html {
    height: 100%;
    width: 100%;
}

body {
    -webkit-text-size-adjust:none;
    text-size-adjust:none;
}

/* Dark theme - default */
:root {
    /* Primary accent colors - subtle blue-gray */
    --primary-3: 30 32 36;
    --primary-4: 35 38 43;
    --primary-7: 55 60 70;
    --primary-9: 99 102 241;
    --primary-10: 129 140 248;
    --primary-11: 165 180 252;

    /* Tint scale - dark backgrounds and text */
    --tint-1: 13 13 15;
    --tint-2: 18 18 21;
    --tint-3: 23 23 27;
    --tint-4: 28 28 33;
    --tint-5: 35 35 41;
    --tint-6: 45 45 52;
    --tint-9: 113 113 122;
    --tint-11: 161 161 170;
    --tint-12: 250 250 250;

    --contrast-primary-9: 255 255 255;

    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;

    /* Code block colors */
    --code-bg: 22 22 26;
    --code-border: 45 45 52;
}

/* Light theme */
:root[data-theme="light"] {
    --primary-3: 238 239 244;
    --primary-4: 228 230 238;
    --primary-7: 190 195 215;
    --primary-9: 79 70 229;
    --primary-10: 99 102 241;
    --primary-11: 67 56 202;

    --tint-1: 255 255 255;
    --tint-2: 250 250 252;
    --tint-3: 245 245 248;
    --tint-4: 240 240 244;
    --tint-5: 228 228 234;
    --tint-6: 212 212 220;
    --tint-9: 113 113 122;
    --tint-11: 82 82 91;
    --tint-12: 24 24 27;

    --contrast-primary-9: 255 255 255;

    /* Keep code blocks dark in light theme for readability with dark syntax highlighting */
}

/* Legacy media query support - both map to dark by default, but respect user toggle */
@media (prefers-color-scheme: dark) {
    :root {
        --primary-3: 30 32 36;
        --primary-4: 35 38 43;
        --primary-7: 55 60 70;
        --primary-9: 99 102 241;
        --primary-10: 129 140 248;
        --primary-11: 165 180 252;

        --tint-1: 13 13 15;
        --tint-2: 18 18 21;
        --tint-3: 23 23 27;
        --tint-4: 28 28 33;
        --tint-5: 35 35 41;
        --tint-6: 45 45 52;
        --tint-9: 113 113 122;
        --tint-11: 161 161 170;
        --tint-12: 250 250 250;

        --contrast-primary-9: 255 255 255;

        --tw-shadow: 0 0 #0000;
        --tw-shadow-colored: 0 0 #0000;

        --code-bg: 22 22 26;
        --code-border: 45 45 52;
    }

    :root[data-theme="light"] {
        --primary-3: 238 239 244;
        --primary-4: 228 230 238;
        --primary-7: 190 195 215;
        --primary-9: 79 70 229;
        --primary-10: 99 102 241;
        --primary-11: 67 56 202;

        --tint-1: 255 255 255;
        --tint-2: 250 250 252;
        --tint-3: 245 245 248;
        --tint-4: 240 240 244;
        --tint-5: 228 228 234;
        --tint-6: 212 212 220;
        --tint-9: 113 113 122;
        --tint-11: 82 82 91;
        --tint-12: 24 24 27;

        --contrast-primary-9: 255 255 255;

        /* Keep code blocks dark in light theme for readability with dark syntax highlighting */
    }
}

@media (prefers-color-scheme: light) {
    :root {
        --primary-3: 30 32 36;
        --primary-4: 35 38 43;
        --primary-7: 55 60 70;
        --primary-9: 99 102 241;
        --primary-10: 129 140 248;
        --primary-11: 165 180 252;

        --tint-1: 13 13 15;
        --tint-2: 18 18 21;
        --tint-3: 23 23 27;
        --tint-4: 28 28 33;
        --tint-5: 35 35 41;
        --tint-6: 45 45 52;
        --tint-9: 113 113 122;
        --tint-11: 161 161 170;
        --tint-12: 250 250 250;

        --contrast-primary-9: 255 255 255;

        --tw-shadow: 0 0 #0000;
        --tw-shadow-colored: 0 0 #0000;

        --code-bg: 22 22 26;
        --code-border: 45 45 52;
    }

    :root[data-theme="light"] {
        --primary-3: 238 239 244;
        --primary-4: 228 230 238;
        --primary-7: 190 195 215;
        --primary-9: 79 70 229;
        --primary-10: 99 102 241;
        --primary-11: 67 56 202;

        --tint-1: 255 255 255;
        --tint-2: 250 250 252;
        --tint-3: 245 245 248;
        --tint-4: 240 240 244;
        --tint-5: 228 228 234;
        --tint-6: 212 212 220;
        --tint-9: 113 113 122;
        --tint-11: 82 82 91;
        --tint-12: 24 24 27;

        --contrast-primary-9: 255 255 255;

        /* Keep code blocks dark in light theme for readability with dark syntax highlighting */
    }
}