@layer figreset, figoverridable, reset, theme, base, figutils, components, utilities;
@layer figreset {
    :root {
        --100dvw: 100vw;
        --100dvh: 100vh
    }

    @supports (width:100dvw) {
        :root {
            --100dvw: 100dvw;
            --100dvh: 100dvh
        }
    }
}
@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
    }

    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 .textContents.hangingList > ul, #container .textContents.hangingList > ol {
        margin-left: -1.5em
    }

    #container .textContents > :not(:last-child) {
        margin-bottom: var(--paragraph-spacing)
    }

    #container .textContents > :is(ul,ol):not(:last-child):has(+:is(ul,ol)) {
        margin-bottom: var(--list-spacing)
    }

    #container .textContents li {
        margin-bottom: var(--list-spacing)
    }

    #container .textContents > :is(ol,ul):is(:last-child,:has(+ div)) > li:last-child, #container .textContents > :is(ol,ul):is(:last-child,:has(+ div)) > :is(ol,ul):last-child > li:last-child, #container .textContents > :is(ol,ul):is(:last-child,:has(+ div)) > :is(ol,ul):last-child > :is(ol,ul):last-child > li:last-child, #container .textContents > :is(ol,ul):is(:last-child,:has(+ div)) > :is(ol,ul):last-child > :is(ol,ul):last-child > :is(ol,ul):last-child > li:last-child, #container .textContents > :is(ol,ul):is(:last-child,:has(+ div)) > :is(ol,ul):last-child > :is(ol,ul):last-child > :is(ol,ul):last-child > :is(ol,ul):last-child > li:last-child {
        margin-bottom: 0
    }

    #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)
    }

    @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%
    }
}
@layer figutils {
    .textContents ul > 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)
    }

    .textContents ol > 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)
    }

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