@media {
    :root {
        --fonts-body: X, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
        --fonts-mono: JetBrains Mono, Menlo, monospace;
        --fonts-serif: Georgia, serif;

        --shadows-small: 0 5px 10px rgba(0, 0, 0, 0.12);
        --shadows-medium: 0 8px 30px rgba(0, 0, 0, 0.12);
        --shadows-large: 0 30px 60px rgba(0, 0, 0, 0.12);
        --shadows-tooltip: 0px 4px 8px 0px rgba(0, 0, 0, 0.04), 0px 1px 1px 0px rgba(0, 0, 0, 0.02);
        --transitions-snappy: cubic-bezier(.2, .8, .2, 1)
    }
    .light {
        --colors-gray0: hsl(0, 0%, 100%);
        --colors-gray1: hsl(0 0% 99.0%);
        --colors-gray2: hsl(0 0% 97.3%);
        --colors-gray3: hsl(0 0% 95.1%);
        --colors-gray4: hsl(0 0% 93.0%);
        --colors-gray5: hsl(0 0% 90.9%);
        --colors-gray6: hsl(0 0% 88.7%);
        --colors-gray7: hsl(0 0% 85.8%);
        --colors-gray8: hsl(0 0% 78.0%);
        --colors-gray9: hsl(0 0% 56.1%);
        --colors-gray10: hsl(0 0% 52.3%);
        --colors-gray11: hsl(0 0% 43.5%);
        --colors-gray12: hsl(45, 5%, 15%);
        --colors-gray13: hsl(0, 0%, 5%);
        --colors-grayA1: hsl(0 0% 0% / 0.012);
        --colors-grayA2: hsl(0 0% 0% / 0.027);
        --colors-grayA3: hsl(0 0% 0% / 0.047);
        --colors-grayA4: hsl(0 0% 0% / 0.071);
        --colors-grayA5: hsl(0 0% 0% / 0.090);
        --colors-grayA6: hsl(0 0% 0% / 0.114);
        --colors-grayA7: hsl(0 0% 0% / 0.141);
        --colors-grayA8: hsl(0 0% 0% / 0.220);
        --colors-grayA9: hsl(0 0% 0% / 0.439);
        --colors-grayA10: hsl(0 0% 0% / 0.478);
        --colors-grayA11: hsl(0 0% 0% / 0.565);
        --colors-grayA12: hsl(0 0% 0% / 0.910);
        --colors-bg: #FFF;
        --colors-lowContrast: #FFFFFF;
        --colors-highContrast: black;
        --colors-focus: var(--colors-amber9);
    }

    .dark {
        --colors-gray0: hsl(0, 0%, 0%);
        --colors-gray1: hsl(0 0% 7.5%);
        --colors-gray2: hsl(0 0% 11.0%);
        --colors-gray3: hsl(0 0% 13.6%);
        --colors-gray4: hsl(0 0% 15.8%);
        --colors-gray5: hsl(0 0% 17.9%);
        --colors-gray6: hsl(0 0% 20.5%);
        --colors-gray7: hsl(0 0% 24.3%);
        --colors-gray8: hsl(0 0% 31.2%);
        --colors-gray9: hsl(0 0% 43.9%);
        --colors-gray10: hsl(0 0% 49.4%);
        --colors-gray11: hsl(0 0% 62.8%);
        --colors-gray12: hsl(0 0% 93.0%);
        --colors-gray13: hsl(0 0% 95.0%);
        --colors-grayA1: hsl(0 0% 100% / 0);
        --colors-grayA2: hsl(0 0% 100% / 0.026);
        --colors-grayA3: hsl(0 0% 100% / 0.056);
        --colors-grayA4: hsl(0 0% 100% / 0.077);
        --colors-grayA5: hsl(0 0% 100% / 0.103);
        --colors-grayA6: hsl(0 0% 100% / 0.129);
        --colors-grayA7: hsl(0 0% 100% / 0.172);
        --colors-grayA8: hsl(0 0% 100% / 0.249);
        --colors-grayA9: hsl(0 0% 100% / 0.386);
        --colors-grayA10: hsl(0 0% 100% / 0.446);
        --colors-grayA11: hsl(0 0% 100% / 0.592);
        --colors-grayA12: hsl(0 0% 100% / 0.923);
        --colors-bg: #000;
        --colors-lowContrast: black;
        --colors-highContrast: white;
    }
}