@layer figreset,figoverridable,reset,theme,base,figutils,components,utilities;@layer figreset {
    :root {
        --100dvw: 100vw;
        --100dvh: 100vh;
        --banner-height: 48px;
        --full-height-with-banner: calc(100dvh - var(--banner-height));
        font-synthesis: none;
        text-align: left;
        button {
            text-align: left
        }
    }

    @supports (width: 100dvw) {
        :root {
            --100dvw:100dvw;
            --100dvh: 100dvh
        }
    }
}

.wrapper-with-banner .min-h-screen {
    min-height: var(--full-height-with-banner)
}

.wrapper-with-banner .h-screen {
    height: var(--full-height-with-banner)
}

@layer figreset {
    :root {
        font-family: var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji")
    }

    *,*:before,*:after {
        box-sizing: border-box
    }

    html {
        -webkit-text-size-adjust: 100%;
        -webkit-tap-highlight-color: transparent;
        -webkit-font-smoothing: antialiased;
        width: 100%
    }

    html:has(#responsive-scaler) {
        scrollbar-width:none;
        -ms-overflow-style: none
    }

    body {
        margin: 0;
        width: 100%
    }

    body:has([data-page-overflowx='hidden']) {
        overflow-x:hidden
    }

    body:has([data-page-overflowx='auto']) {
        overflow-x:auto
    }

    #container {
        width: 100%
    }

    a {
        color: inherit;
        text-decoration: none
    }

    button {
        border: none;
        background: none;
        padding: 0
    }

    h1,h2,h3,h4,h5,h6,p {
        font-size: inherit;
        font-weight: inherit
    }

    blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre {
        margin: 0
    }

    ol,ul,menu {
        list-style: none;
        margin: 0;
        padding-inline-start:1.5em}

    #container .textContents {
        color: #ffffff00
    }

    #container .textClip {
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent !important
    }

    #container .textClip > * {
        -webkit-text-fill-color: initial
    }

    #container .embed {
        border: none
    }

    #container .marquee-container {
        overflow-x: hidden;
        display: flex;
        flex-direction: row;
        position: relative;
        width: var(--width);
        transform: var(--transform);
        &:hover div {
            animation-play-state: var(--pause-on-hover)
        }

        &:active div {
            animation-play-state: var(--pause-on-click)
        }
    }

    #container .marquee {
        flex: 0 0 auto;
        min-width: var(--min-width);
        display: flex;
        flex-direction: row;
        align-items: center;
        animation: scroll var(--duration) linear var(--delay) var(--iteration-count);
        animation-delay: var(--delay);
        animation-direction: var(--direction);
        animation-timing-function: var(--timing-function)
    }

    #container .marquee.reduced-motion {
        @media (prefers-reduced-motion:reduce) {
            animation:none}
    }

    @keyframes scroll {
        0% {
            transform: translateX(0%)
        }

        100% {
            transform: translateX(-100%)
        }
    }

    #container .marquee-initial-child-container {
        flex: 0 0 auto;
        display: flex;
        min-width: auto;
        flex-direction: row;
        align-items: center
    }

    #container .marquee-child {
        transform: var(--transform)
    }

    .code-behavior-wrapper > * {
        width: 100%;
        height: 100%
    }

    .bypass-link {
        position: fixed;
        top: 16px;
        left: 0;
        right: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        opacity: 0;
        pointer-events: none
    }

    .bypass-link:focus-within {
        opacity: 1;
        z-index: 10000
    }

    .bypass-link > a {
        background-color: #000;
        color: #fff;
        border: 1px solid #fff;
        padding: 12px 16px;
        font-size: 16px;
        border-radius: 12px;
        pointer-events: auto
    }
}

@layer figutils {
    :is(.textContents ul,ul.textContents) > li:before {
        content:'\2022';
        margin-left: -1.5em;
        display: inline-block;
        text-align: center;
        width: 1.5em;
        -webkit-background-clip: var(--list-marker-background-clip);
        -webkit-text-fill-color: var(--list-marker-text-fill-color);
        background-clip: var(--list-marker-background-clip);
        background-image: var(--list-marker-background-image);
        color: var(--list-marker-color);
        font-size: var(--list-marker-font-size);
        line-height: var(--list-marker-line-height);
        mix-blend-mode: var(--list-marker-mix-blend-mode);
        vertical-align: var(--list-marker-vertical-align)
    }

    :is(.textContents ol,ol.textContents) > li::marker {
        color:var(--list-marker-color);
        font-size: var(--list-marker-font-size);
        line-height: var(--list-marker-line-height);
        vertical-align: var(--list-marker-vertical-align)
    }

    :is(.textContents,.textContents *).adjustLetterSpacing:after {
        content: '';
        margin-left: calc(var(--letter-spacing) * -1)
    }
}