:root {
  --font-display: 'Space Grotesk Variable', 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'Inter Variable', 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-serif: 'Fraunces Variable', 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-mono: 'JetBrains Mono Variable', 'JetBrains Mono', ui-monospace, 'Cascadia Code', Consolas, monospace;
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4.5rem;
  --space-8: 6rem;
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1.25rem;
  --radius-xl: 2rem;
  --measure: 70ch;
  --w-narrow: 36rem;
  --w-prose: 42rem;
  --w-wide: 72rem;
  --dur-fast: 150ms;
  --dur-med: 320ms;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --step--1: clamp(0.875rem, 0.84rem + 0.15vw, 0.95rem);
  --step-0: clamp(1.125rem, 1.08rem + 0.2vw, 1.25rem);
  --step-1: clamp(1.3rem, 1.2rem + 0.45vw, 1.55rem);
  --step-2: clamp(1.55rem, 1.35rem + 0.9vw, 2.05rem);
  --step-3: clamp(1.9rem, 1.5rem + 1.7vw, 2.85rem);
  --step-4: clamp(2.3rem, 1.6rem + 3vw, 4rem);
  --leading-body: 1.7;
  --leading-tight: 1.15;
  --bg: #f5f7f8;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #ebeff2;
  --text: #11181d;
  --text-muted: #4a5661;
  --text-inverse: #f5f7f8;
  --accent: #0b7480;
  --accent-strong: #075a63;
  --accent-soft: #dcf0f1;
  --accent-contrast: #ffffff;
  --border: #d9dfe4;
  --border-strong: #8a96a1;
  --focus: #0a62c2;
  --link: #06646e;
  --link-hover: #044950;
  --beam-1: #22d3ee;
  --beam-2: #5eead4;
  --beam-3: #a5b4fc;
  --grid-line: rgba(17, 24, 29, 0.06);
  --shadow-1: 0 1px 2px rgba(15, 23, 42, 0.06), 0 1px 1px rgba(15, 23, 42, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(15, 23, 42, 0.18), 0 2px 6px rgba(15, 23, 42, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(15, 23, 42, 0.30), 0 8px 18px -6px rgba(15, 23, 42, 0.10);
  --code-bg: #eef2f4;
  --selection: #bdecf0;
  color-scheme: light;
}

:root[data-scheme="dark"] {
  --bg: #0a0e13;
  --bg-elev: #10161e;
  --surface: #131b24;
  --surface-2: #1a2430;
  --text: #e7edf2;
  --text-muted: #9eacb9;
  --text-inverse: #0a0e13;
  --accent: #2dd4bf;
  --accent-strong: #5eead4;
  --accent-soft: #0e2a2e;
  --accent-contrast: #04211e;
  --border: #223040;
  --border-strong: #5b6d80;
  --focus: #7dd3fc;
  --link: #67e8f9;
  --link-hover: #a5f3fc;
  --beam-1: #22d3ee;
  --beam-2: #2dd4bf;
  --beam-3: #818cf8;
  --grid-line: rgba(148, 163, 184, 0.08);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(45, 212, 191, 0.18);
  --code-bg: #0e151d;
  --selection: #134e4a;
  color-scheme: dark;
}

:root[data-preset="base"] {
  --bg: #f5f7f8;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #ebeff2;
  --text: #11181d;
  --text-muted: #4a5661;
  --text-inverse: #f5f7f8;
  --accent: #0b7480;
  --accent-strong: #075a63;
  --accent-soft: #dcf0f1;
  --accent-contrast: #ffffff;
  --border: #d9dfe4;
  --border-strong: #8a96a1;
  --focus: #0a62c2;
  --link: #06646e;
  --link-hover: #044950;
  --beam-1: #22d3ee;
  --beam-2: #5eead4;
  --beam-3: #a5b4fc;
  --grid-line: rgba(17, 24, 29, 0.06);
  --shadow-1: 0 1px 2px rgba(15, 23, 42, 0.06), 0 1px 1px rgba(15, 23, 42, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(15, 23, 42, 0.18), 0 2px 6px rgba(15, 23, 42, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(15, 23, 42, 0.30), 0 8px 18px -6px rgba(15, 23, 42, 0.10);
  --code-bg: #eef2f4;
  --selection: #bdecf0;
  color-scheme: light;
}

:root[data-preset="base"][data-scheme="dark"] {
  --bg: #0a0e13;
  --bg-elev: #10161e;
  --surface: #131b24;
  --surface-2: #1a2430;
  --text: #e7edf2;
  --text-muted: #9eacb9;
  --text-inverse: #0a0e13;
  --accent: #2dd4bf;
  --accent-strong: #5eead4;
  --accent-soft: #0e2a2e;
  --accent-contrast: #04211e;
  --border: #223040;
  --border-strong: #5b6d80;
  --focus: #7dd3fc;
  --link: #67e8f9;
  --link-hover: #a5f3fc;
  --beam-1: #22d3ee;
  --beam-2: #2dd4bf;
  --beam-3: #818cf8;
  --grid-line: rgba(148, 163, 184, 0.08);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(45, 212, 191, 0.18);
  --code-bg: #0e151d;
  --selection: #134e4a;
  color-scheme: dark;
}

:root[data-preset="modern-dark"] {
  --bg: #f4f4f8;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #e9e9f2;
  --text: #14131c;
  --text-muted: #4f4d63;
  --text-inverse: #f4f4f8;
  --accent: #6d3fe0;
  --accent-strong: #5329bf;
  --accent-soft: #ebe4fd;
  --accent-contrast: #ffffff;
  --border: #dcdbe7;
  --border-strong: #8d8aa3;
  --focus: #2563eb;
  --link: #5a2fd0;
  --link-hover: #4120a3;
  --beam-1: #a78bfa;
  --beam-2: #22d3ee;
  --beam-3: #f472b6;
  --grid-line: rgba(20, 19, 28, 0.06);
  --shadow-1: 0 1px 2px rgba(30, 20, 60, 0.06), 0 1px 1px rgba(30, 20, 60, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(30, 20, 60, 0.18), 0 2px 6px rgba(30, 20, 60, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(30, 20, 60, 0.30), 0 8px 18px -6px rgba(30, 20, 60, 0.10);
  --code-bg: #efeef6;
  --selection: #ddd2fd;
  color-scheme: light;
}

:root[data-preset="modern-dark"][data-scheme="dark"] {
  --bg: #07070c;
  --bg-elev: #0e0e16;
  --surface: #12121c;
  --surface-2: #1a1a28;
  --text: #ecebf5;
  --text-muted: #a3a1bb;
  --text-inverse: #07070c;
  --accent: #a78bfa;
  --accent-strong: #c4b5fd;
  --accent-soft: #1f1838;
  --accent-contrast: #13072f;
  --border: #262538;
  --border-strong: #625f80;
  --focus: #67e8f9;
  --link: #c4b5fd;
  --link-hover: #ddd6fe;
  --beam-1: #8b5cf6;
  --beam-2: #22d3ee;
  --beam-3: #f472b6;
  --grid-line: rgba(167, 139, 250, 0.08);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(139, 92, 246, 0.22);
  --code-bg: #0f0f18;
  --selection: #3b2a72;
  color-scheme: dark;
}

:root[data-preset="spring"] {
  --bg: #f6faf5;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #e9f2e7;
  --text: #121a14;
  --text-muted: #4a5a4e;
  --text-inverse: #f6faf5;
  --accent: #2c7a4b;
  --accent-strong: #1f5e39;
  --accent-soft: #e0f1e5;
  --accent-contrast: #ffffff;
  --border: #d7e3d8;
  --border-strong: #879a8b;
  --focus: #b0306f;
  --link: #22683f;
  --link-hover: #174a2c;
  --beam-1: #f9a8d4;
  --beam-2: #86efac;
  --beam-3: #fde68a;
  --grid-line: rgba(18, 26, 20, 0.06);
  --shadow-1: 0 1px 2px rgba(20, 50, 30, 0.06), 0 1px 1px rgba(20, 50, 30, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(20, 50, 30, 0.18), 0 2px 6px rgba(20, 50, 30, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(20, 50, 30, 0.30), 0 8px 18px -6px rgba(20, 50, 30, 0.10);
  --code-bg: #edf4ec;
  --selection: #c9ecd3;
  color-scheme: light;
}

:root[data-preset="spring"][data-scheme="dark"] {
  --bg: #0b120d;
  --bg-elev: #111a13;
  --surface: #15201a;
  --surface-2: #1c2a21;
  --text: #e6f0e8;
  --text-muted: #9fb3a5;
  --text-inverse: #0b120d;
  --accent: #6ee7a0;
  --accent-strong: #86efac;
  --accent-soft: #13291b;
  --accent-contrast: #06210f;
  --border: #223428;
  --border-strong: #5d7565;
  --focus: #f9a8d4;
  --link: #86efac;
  --link-hover: #bbf7d0;
  --beam-1: #f472b6;
  --beam-2: #4ade80;
  --beam-3: #fde047;
  --grid-line: rgba(134, 239, 172, 0.07);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(110, 231, 160, 0.16);
  --code-bg: #0f1912;
  --selection: #1f5134;
  color-scheme: dark;
}

:root[data-preset="summer"] {
  --bg: #fdf8f1;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #f6ecdd;
  --text: #1e150c;
  --text-muted: #5d4e3f;
  --text-inverse: #fdf8f1;
  --accent: #b9420c;
  --accent-strong: #943408;
  --accent-soft: #fbe6d6;
  --accent-contrast: #ffffff;
  --border: #ecdfcd;
  --border-strong: #a08c76;
  --focus: #0369a1;
  --link: #a13a0b;
  --link-hover: #7a2b06;
  --beam-1: #fbbf24;
  --beam-2: #fb923c;
  --beam-3: #38bdf8;
  --grid-line: rgba(30, 21, 12, 0.06);
  --shadow-1: 0 1px 2px rgba(70, 40, 10, 0.06), 0 1px 1px rgba(70, 40, 10, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(70, 40, 10, 0.18), 0 2px 6px rgba(70, 40, 10, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(70, 40, 10, 0.30), 0 8px 18px -6px rgba(70, 40, 10, 0.10);
  --code-bg: #f7efe3;
  --selection: #fed7aa;
  color-scheme: light;
}

:root[data-preset="summer"][data-scheme="dark"] {
  --bg: #110c07;
  --bg-elev: #18110a;
  --surface: #1e160e;
  --surface-2: #281d13;
  --text: #f5ece2;
  --text-muted: #bba796;
  --text-inverse: #110c07;
  --accent: #fdba74;
  --accent-strong: #fed7aa;
  --accent-soft: #2e1d0e;
  --accent-contrast: #2a1203;
  --border: #36281a;
  --border-strong: #7a6550;
  --focus: #7dd3fc;
  --link: #fdba74;
  --link-hover: #fed7aa;
  --beam-1: #f59e0b;
  --beam-2: #fb923c;
  --beam-3: #38bdf8;
  --grid-line: rgba(253, 186, 116, 0.07);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(251, 146, 60, 0.18);
  --code-bg: #18120b;
  --selection: #5c3311;
  color-scheme: dark;
}

:root[data-preset="autumn"] {
  --bg: #faf5ef;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #f1e7dc;
  --text: #1d140e;
  --text-muted: #5c4a3d;
  --text-inverse: #faf5ef;
  --accent: #9a3412;
  --accent-strong: #7c2a0e;
  --accent-soft: #f7e3d6;
  --accent-contrast: #ffffff;
  --border: #e8dacb;
  --border-strong: #9c8673;
  --focus: #15803d;
  --link: #8a2f10;
  --link-hover: #66220b;
  --beam-1: #f59e0b;
  --beam-2: #ea580c;
  --beam-3: #65a30d;
  --grid-line: rgba(29, 20, 14, 0.06);
  --shadow-1: 0 1px 2px rgba(60, 30, 10, 0.06), 0 1px 1px rgba(60, 30, 10, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(60, 30, 10, 0.18), 0 2px 6px rgba(60, 30, 10, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(60, 30, 10, 0.30), 0 8px 18px -6px rgba(60, 30, 10, 0.10);
  --code-bg: #f4ebe1;
  --selection: #fbd5bd;
  color-scheme: light;
}

:root[data-preset="autumn"][data-scheme="dark"] {
  --bg: #120c08;
  --bg-elev: #19110c;
  --surface: #1f1610;
  --surface-2: #2a1e16;
  --text: #f3e9e0;
  --text-muted: #b9a493;
  --text-inverse: #120c08;
  --accent: #fb923c;
  --accent-strong: #fdba74;
  --accent-soft: #2f1a0e;
  --accent-contrast: #2a0f02;
  --border: #382a1f;
  --border-strong: #7d6553;
  --focus: #86efac;
  --link: #fdba74;
  --link-hover: #fed7aa;
  --beam-1: #f59e0b;
  --beam-2: #ea580c;
  --beam-3: #84cc16;
  --grid-line: rgba(251, 146, 60, 0.07);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(234, 88, 12, 0.18);
  --code-bg: #18110c;
  --selection: #5a2a10;
  color-scheme: dark;
}

:root[data-preset="winter"] {
  --bg: #f4f7fb;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #e7edf5;
  --text: #0f1724;
  --text-muted: #475569;
  --text-inverse: #f4f7fb;
  --accent: #1d4ed8;
  --accent-strong: #1e3fae;
  --accent-soft: #e0e9fb;
  --accent-contrast: #ffffff;
  --border: #d6dfeb;
  --border-strong: #8693a8;
  --focus: #0e7490;
  --link: #1d4ed8;
  --link-hover: #1e3a8a;
  --beam-1: #93c5fd;
  --beam-2: #e0f2fe;
  --beam-3: #a5b4fc;
  --grid-line: rgba(15, 23, 36, 0.06);
  --shadow-1: 0 1px 2px rgba(15, 30, 60, 0.06), 0 1px 1px rgba(15, 30, 60, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(15, 30, 60, 0.18), 0 2px 6px rgba(15, 30, 60, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(15, 30, 60, 0.30), 0 8px 18px -6px rgba(15, 30, 60, 0.10);
  --code-bg: #ecf1f7;
  --selection: #c7d9fb;
  color-scheme: light;
}

:root[data-preset="winter"][data-scheme="dark"] {
  --bg: #080d17;
  --bg-elev: #0d1420;
  --surface: #111a28;
  --surface-2: #182335;
  --text: #e8eef7;
  --text-muted: #9aaac0;
  --text-inverse: #080d17;
  --accent: #93c5fd;
  --accent-strong: #bfdbfe;
  --accent-soft: #122140;
  --accent-contrast: #081a3a;
  --border: #1f2c42;
  --border-strong: #56698a;
  --focus: #67e8f9;
  --link: #93c5fd;
  --link-hover: #bfdbfe;
  --beam-1: #60a5fa;
  --beam-2: #e0f2fe;
  --beam-3: #818cf8;
  --grid-line: rgba(147, 197, 253, 0.07);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(96, 165, 250, 0.18);
  --code-bg: #0c1320;
  --selection: #1e3a6e;
  color-scheme: dark;
}

:root[data-preset="halloween"] {
  --bg: #faf6f1;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #efe8f3;
  --text: #1a1220;
  --text-muted: #55485e;
  --text-inverse: #faf6f1;
  --accent: #6b21a8;
  --accent-strong: #581c87;
  --accent-soft: #efe3f8;
  --accent-contrast: #ffffff;
  --border: #e4dbe8;
  --border-strong: #958aa0;
  --focus: #c2410c;
  --link: #6b21a8;
  --link-hover: #4c1677;
  --beam-1: #fb923c;
  --beam-2: #a855f7;
  --beam-3: #84cc16;
  --grid-line: rgba(26, 18, 32, 0.06);
  --shadow-1: 0 1px 2px rgba(40, 15, 60, 0.06), 0 1px 1px rgba(40, 15, 60, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(40, 15, 60, 0.18), 0 2px 6px rgba(40, 15, 60, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(40, 15, 60, 0.30), 0 8px 18px -6px rgba(40, 15, 60, 0.10);
  --code-bg: #f2ecf5;
  --selection: #fed7aa;
  color-scheme: light;
}

:root[data-preset="halloween"][data-scheme="dark"] {
  --bg: #0c0910;
  --bg-elev: #130e19;
  --surface: #18111f;
  --surface-2: #21182b;
  --text: #f1eaf5;
  --text-muted: #afa1ba;
  --text-inverse: #0c0910;
  --accent: #fb923c;
  --accent-strong: #fdba74;
  --accent-soft: #2a1730;
  --accent-contrast: #2a0f02;
  --border: #2e2238;
  --border-strong: #6f5d7d;
  --focus: #c084fc;
  --link: #fdba74;
  --link-hover: #fed7aa;
  --beam-1: #f97316;
  --beam-2: #a855f7;
  --beam-3: #a3e635;
  --grid-line: rgba(168, 85, 247, 0.08);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(249, 115, 22, 0.2);
  --code-bg: #120d17;
  --selection: #4c1d6e;
  color-scheme: dark;
}

:root[data-preset="winter-holiday"] {
  --bg: #f7faf7;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #e8f0ea;
  --text: #111a14;
  --text-muted: #475a4d;
  --text-inverse: #f7faf7;
  --accent: #b91c1c;
  --accent-strong: #991b1b;
  --accent-soft: #fbe4e4;
  --accent-contrast: #ffffff;
  --border: #d8e3db;
  --border-strong: #86998b;
  --focus: #166534;
  --link: #9f1d1d;
  --link-hover: #7a1616;
  --beam-1: #fcd34d;
  --beam-2: #22c55e;
  --beam-3: #f87171;
  --grid-line: rgba(17, 26, 20, 0.06);
  --shadow-1: 0 1px 2px rgba(20, 40, 25, 0.06), 0 1px 1px rgba(20, 40, 25, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(20, 40, 25, 0.18), 0 2px 6px rgba(20, 40, 25, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(20, 40, 25, 0.30), 0 8px 18px -6px rgba(20, 40, 25, 0.10);
  --code-bg: #edf3ee;
  --selection: #fecaca;
  color-scheme: light;
}

:root[data-preset="winter-holiday"][data-scheme="dark"] {
  --bg: #08110c;
  --bg-elev: #0d1811;
  --surface: #111f16;
  --surface-2: #17291d;
  --text: #e9f2ec;
  --text-muted: #9db3a5;
  --text-inverse: #08110c;
  --accent: #f87171;
  --accent-strong: #fca5a5;
  --accent-soft: #2b1416;
  --accent-contrast: #2a0606;
  --border: #1f3326;
  --border-strong: #587564;
  --focus: #fcd34d;
  --link: #fca5a5;
  --link-hover: #fecaca;
  --beam-1: #fbbf24;
  --beam-2: #22c55e;
  --beam-3: #ef4444;
  --grid-line: rgba(252, 211, 77, 0.07);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(251, 191, 36, 0.18);
  --code-bg: #0c1610;
  --selection: #5c1a1a;
  color-scheme: dark;
}

:root[data-preset="new-year"] {
  --bg: #faf8f2;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #f1ede1;
  --text: #16140d;
  --text-muted: #57513f;
  --text-inverse: #faf8f2;
  --accent: #7a5c00;
  --accent-strong: #654c00;
  --accent-soft: #f6eccb;
  --accent-contrast: #ffffff;
  --border: #e7e1cf;
  --border-strong: #9a927a;
  --focus: #1d4ed8;
  --link: #6f5400;
  --link-hover: #4f3c00;
  --beam-1: #facc15;
  --beam-2: #e5e7eb;
  --beam-3: #c4b5fd;
  --grid-line: rgba(22, 20, 13, 0.06);
  --shadow-1: 0 1px 2px rgba(50, 40, 10, 0.06), 0 1px 1px rgba(50, 40, 10, 0.04);
  --shadow-2: 0 8px 24px -8px rgba(50, 40, 10, 0.18), 0 2px 6px rgba(50, 40, 10, 0.06);
  --shadow-3: 0 28px 60px -20px rgba(50, 40, 10, 0.30), 0 8px 18px -6px rgba(50, 40, 10, 0.10);
  --code-bg: #f4f0e5;
  --selection: #fde68a;
  color-scheme: light;
}

:root[data-preset="new-year"][data-scheme="dark"] {
  --bg: #08080d;
  --bg-elev: #0f0f16;
  --surface: #13131c;
  --surface-2: #1b1b27;
  --text: #f3f1ea;
  --text-muted: #b0ab9c;
  --text-inverse: #08080d;
  --accent: #facc15;
  --accent-strong: #fde68a;
  --accent-soft: #29230b;
  --accent-contrast: #241c00;
  --border: #2a2a38;
  --border-strong: #6b6a80;
  --focus: #c4b5fd;
  --link: #fde68a;
  --link-hover: #fef3c7;
  --beam-1: #facc15;
  --beam-2: #e5e7eb;
  --beam-3: #a78bfa;
  --grid-line: rgba(250, 204, 21, 0.07);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(250, 204, 21, 0.16);
  --code-bg: #101018;
  --selection: #5c4a07;
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-scheme="light"]) {
    --bg: #0a0e13;
    --bg-elev: #10161e;
    --surface: #131b24;
    --surface-2: #1a2430;
    --text: #e7edf2;
    --text-muted: #9eacb9;
    --text-inverse: #0a0e13;
    --accent: #2dd4bf;
    --accent-strong: #5eead4;
    --accent-soft: #0e2a2e;
    --accent-contrast: #04211e;
    --border: #223040;
    --border-strong: #5b6d80;
    --focus: #7dd3fc;
    --link: #67e8f9;
    --link-hover: #a5f3fc;
    --beam-1: #22d3ee;
    --beam-2: #2dd4bf;
    --beam-3: #818cf8;
    --grid-line: rgba(148, 163, 184, 0.08);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(45, 212, 191, 0.18);
    --code-bg: #0e151d;
    --selection: #134e4a;
    color-scheme: dark;
  }
  :root[data-preset="base"]:not([data-scheme="light"]) {
    --bg: #0a0e13;
    --bg-elev: #10161e;
    --surface: #131b24;
    --surface-2: #1a2430;
    --text: #e7edf2;
    --text-muted: #9eacb9;
    --text-inverse: #0a0e13;
    --accent: #2dd4bf;
    --accent-strong: #5eead4;
    --accent-soft: #0e2a2e;
    --accent-contrast: #04211e;
    --border: #223040;
    --border-strong: #5b6d80;
    --focus: #7dd3fc;
    --link: #67e8f9;
    --link-hover: #a5f3fc;
    --beam-1: #22d3ee;
    --beam-2: #2dd4bf;
    --beam-3: #818cf8;
    --grid-line: rgba(148, 163, 184, 0.08);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(45, 212, 191, 0.18);
    --code-bg: #0e151d;
    --selection: #134e4a;
    color-scheme: dark;
  }
  :root[data-preset="modern-dark"]:not([data-scheme="light"]) {
    --bg: #07070c;
    --bg-elev: #0e0e16;
    --surface: #12121c;
    --surface-2: #1a1a28;
    --text: #ecebf5;
    --text-muted: #a3a1bb;
    --text-inverse: #07070c;
    --accent: #a78bfa;
    --accent-strong: #c4b5fd;
    --accent-soft: #1f1838;
    --accent-contrast: #13072f;
    --border: #262538;
    --border-strong: #625f80;
    --focus: #67e8f9;
    --link: #c4b5fd;
    --link-hover: #ddd6fe;
    --beam-1: #8b5cf6;
    --beam-2: #22d3ee;
    --beam-3: #f472b6;
    --grid-line: rgba(167, 139, 250, 0.08);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(139, 92, 246, 0.22);
    --code-bg: #0f0f18;
    --selection: #3b2a72;
    color-scheme: dark;
  }
  :root[data-preset="spring"]:not([data-scheme="light"]) {
    --bg: #0b120d;
    --bg-elev: #111a13;
    --surface: #15201a;
    --surface-2: #1c2a21;
    --text: #e6f0e8;
    --text-muted: #9fb3a5;
    --text-inverse: #0b120d;
    --accent: #6ee7a0;
    --accent-strong: #86efac;
    --accent-soft: #13291b;
    --accent-contrast: #06210f;
    --border: #223428;
    --border-strong: #5d7565;
    --focus: #f9a8d4;
    --link: #86efac;
    --link-hover: #bbf7d0;
    --beam-1: #f472b6;
    --beam-2: #4ade80;
    --beam-3: #fde047;
    --grid-line: rgba(134, 239, 172, 0.07);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(110, 231, 160, 0.16);
    --code-bg: #0f1912;
    --selection: #1f5134;
    color-scheme: dark;
  }
  :root[data-preset="summer"]:not([data-scheme="light"]) {
    --bg: #110c07;
    --bg-elev: #18110a;
    --surface: #1e160e;
    --surface-2: #281d13;
    --text: #f5ece2;
    --text-muted: #bba796;
    --text-inverse: #110c07;
    --accent: #fdba74;
    --accent-strong: #fed7aa;
    --accent-soft: #2e1d0e;
    --accent-contrast: #2a1203;
    --border: #36281a;
    --border-strong: #7a6550;
    --focus: #7dd3fc;
    --link: #fdba74;
    --link-hover: #fed7aa;
    --beam-1: #f59e0b;
    --beam-2: #fb923c;
    --beam-3: #38bdf8;
    --grid-line: rgba(253, 186, 116, 0.07);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(251, 146, 60, 0.18);
    --code-bg: #18120b;
    --selection: #5c3311;
    color-scheme: dark;
  }
  :root[data-preset="autumn"]:not([data-scheme="light"]) {
    --bg: #120c08;
    --bg-elev: #19110c;
    --surface: #1f1610;
    --surface-2: #2a1e16;
    --text: #f3e9e0;
    --text-muted: #b9a493;
    --text-inverse: #120c08;
    --accent: #fb923c;
    --accent-strong: #fdba74;
    --accent-soft: #2f1a0e;
    --accent-contrast: #2a0f02;
    --border: #382a1f;
    --border-strong: #7d6553;
    --focus: #86efac;
    --link: #fdba74;
    --link-hover: #fed7aa;
    --beam-1: #f59e0b;
    --beam-2: #ea580c;
    --beam-3: #84cc16;
    --grid-line: rgba(251, 146, 60, 0.07);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(234, 88, 12, 0.18);
    --code-bg: #18110c;
    --selection: #5a2a10;
    color-scheme: dark;
  }
  :root[data-preset="winter"]:not([data-scheme="light"]) {
    --bg: #080d17;
    --bg-elev: #0d1420;
    --surface: #111a28;
    --surface-2: #182335;
    --text: #e8eef7;
    --text-muted: #9aaac0;
    --text-inverse: #080d17;
    --accent: #93c5fd;
    --accent-strong: #bfdbfe;
    --accent-soft: #122140;
    --accent-contrast: #081a3a;
    --border: #1f2c42;
    --border-strong: #56698a;
    --focus: #67e8f9;
    --link: #93c5fd;
    --link-hover: #bfdbfe;
    --beam-1: #60a5fa;
    --beam-2: #e0f2fe;
    --beam-3: #818cf8;
    --grid-line: rgba(147, 197, 253, 0.07);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(96, 165, 250, 0.18);
    --code-bg: #0c1320;
    --selection: #1e3a6e;
    color-scheme: dark;
  }
  :root[data-preset="halloween"]:not([data-scheme="light"]) {
    --bg: #0c0910;
    --bg-elev: #130e19;
    --surface: #18111f;
    --surface-2: #21182b;
    --text: #f1eaf5;
    --text-muted: #afa1ba;
    --text-inverse: #0c0910;
    --accent: #fb923c;
    --accent-strong: #fdba74;
    --accent-soft: #2a1730;
    --accent-contrast: #2a0f02;
    --border: #2e2238;
    --border-strong: #6f5d7d;
    --focus: #c084fc;
    --link: #fdba74;
    --link-hover: #fed7aa;
    --beam-1: #f97316;
    --beam-2: #a855f7;
    --beam-3: #a3e635;
    --grid-line: rgba(168, 85, 247, 0.08);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(249, 115, 22, 0.2);
    --code-bg: #120d17;
    --selection: #4c1d6e;
    color-scheme: dark;
  }
  :root[data-preset="winter-holiday"]:not([data-scheme="light"]) {
    --bg: #08110c;
    --bg-elev: #0d1811;
    --surface: #111f16;
    --surface-2: #17291d;
    --text: #e9f2ec;
    --text-muted: #9db3a5;
    --text-inverse: #08110c;
    --accent: #f87171;
    --accent-strong: #fca5a5;
    --accent-soft: #2b1416;
    --accent-contrast: #2a0606;
    --border: #1f3326;
    --border-strong: #587564;
    --focus: #fcd34d;
    --link: #fca5a5;
    --link-hover: #fecaca;
    --beam-1: #fbbf24;
    --beam-2: #22c55e;
    --beam-3: #ef4444;
    --grid-line: rgba(252, 211, 77, 0.07);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(251, 191, 36, 0.18);
    --code-bg: #0c1610;
    --selection: #5c1a1a;
    color-scheme: dark;
  }
  :root[data-preset="new-year"]:not([data-scheme="light"]) {
    --bg: #08080d;
    --bg-elev: #0f0f16;
    --surface: #13131c;
    --surface-2: #1b1b27;
    --text: #f3f1ea;
    --text-muted: #b0ab9c;
    --text-inverse: #08080d;
    --accent: #facc15;
    --accent-strong: #fde68a;
    --accent-soft: #29230b;
    --accent-contrast: #241c00;
    --border: #2a2a38;
    --border-strong: #6b6a80;
    --focus: #c4b5fd;
    --link: #fde68a;
    --link-hover: #fef3c7;
    --beam-1: #facc15;
    --beam-2: #e5e7eb;
    --beam-3: #a78bfa;
    --grid-line: rgba(250, 204, 21, 0.07);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-2: 0 10px 30px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.03);
    --shadow-3: 0 30px 70px -24px rgba(0, 0, 0, 0.85), 0 0 40px -12px rgba(250, 204, 21, 0.16);
    --code-bg: #101018;
    --selection: #5c4a07;
    color-scheme: dark;
  }
}