/* qymyz.dev — generated from tokens.json */
:root, [data-theme="dark"] {
  --violet: #a970ff;
  --on-violet: var(--night);
  --lime: #c8ff2e;
  --on-lime: var(--night);
  --magenta: #ff3ec8;
  --on-magenta: var(--night);
  --cyan: #22e4ff;
  --gold: #fec50c;
  --garnet: #bd1f42;
  --garnet-deep: #3e0a16;
  --milk: #f4f1ea;
  --night: #0b0a0e;
  --felt: #c9b089;
  --canvas: var(--night);
  --canvas-alt: #131118;
  --surface: #1a1720;
  --band: #15121b;
  --band-raised: #221d2b;
  --band-garnet: var(--garnet-deep);
  --band-uv: var(--violet);
  --terminal: #0f0d13;
  --ink: var(--milk);
  --ink-mid: #c9c4d2;
  --ink-mute: #9590a0;
  --accent: var(--violet);
  --on-band: var(--milk);
  --on-band-mute: #b8b2c4;
  --link: var(--cyan);
  --hud: var(--violet);
  --line: #2a2533;
  --line-strong: #6f6879;
  --primary: var(--violet);
  --on-primary: var(--night);
  --focus-ring: 0 0 0 2px #0b0a0e, 0 0 0 4px #22e4ff;
}
[data-theme="light"] {
  --on-violet: var(--night);
  --on-lime: var(--night);
  --on-magenta: var(--night);
  --canvas: var(--milk);
  --canvas-alt: #ece8df;
  --surface: #ffffff;
  --band-garnet: var(--garnet-deep);
  --band-uv: var(--violet);
  --ink: var(--night);
  --ink-mid: #4e4a55;
  --ink-mute: #6a6572;
  --accent: #5a2ac4;
  --on-band: var(--milk);
  --link: #006a80;
  --hud: #5a2ac4;
  --line: #dcd7ce;
  --line-strong: #8a8578;
  --primary: var(--night);
  --on-primary: var(--violet);
  --focus-ring: 0 0 0 2px #f4f1ea, 0 0 0 4px #006a80;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-20: 80px;
  --space-30: 120px;
  --radius-0: 0;
  --radius-circle: 50%;
  --size-nav: 80px;
  --size-control: 48px;
  --size-tab: 36px;
  --size-cut: 12px;
  --size-hud: 14px;
  --size-content: 1280px;
  --stroke-hairline: 1px;
  --stroke-ornament: 1.5px;
  --stroke-ornament-bold: 2px;
  --font-display: "Bitcount Prop Single", "Courier New", monospace;
  --font-loom: "Jacquard 24", "UnifrakturMaguntia", serif;
  --font-sans: "Mona Sans", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --font-glitch: "Rubik Glitch", "Arial Black", sans-serif;
  --font-neon: "Monoton", "Arial Black", sans-serif;
  --font-crt: "Sixtyfour", "Courier New", monospace;
  --font-holo: "Tilt Prism", "Arial Black", sans-serif;
  --font-scribble: "Syne Tactile", "Comic Sans MS", cursive;
  --font-loom-sm: "Jacquarda Bastarda 9", "Jacquard 24", serif;
  --font-hud: "Bitcount Grid Double", "Courier New", monospace;
  --font-arcade: "Nabla", "Arial Black", sans-serif;
}
.display-xl { font-family: var(--font-display); font-size: 80px; line-height: 80px; font-weight: 800; letter-spacing: 0.01em; }
.display-lg { font-family: var(--font-display); font-size: 48px; line-height: 50px; font-weight: 800; }
.heading-md { font-family: var(--font-display); font-size: 26px; line-height: 30px; font-weight: 700; }
.eyebrow { font-family: var(--font-display); font-size: 14px; line-height: 18px; font-weight: 600; letter-spacing: 0.04em; }
.button { font-family: var(--font-display); font-size: 15px; line-height: 18px; font-weight: 700; letter-spacing: 0.02em; }
.loom-xl { font-family: var(--font-loom); font-size: 120px; line-height: 104px; font-weight: 400; }
.quote { font-family: var(--font-loom); font-size: 64px; line-height: 60px; font-weight: 400; }
.heading-sm { font-family: var(--font-sans); font-size: 18px; line-height: 24px; font-weight: 500; }
.body-lg { font-family: var(--font-sans); font-size: 18px; line-height: 27px; font-weight: 400; }
.body-md { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 400; }
.body-sm { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 400; }
.caption { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 400; }
.code { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 400; }
.glitch { font-family: var(--font-glitch); font-size: 80px; line-height: 80px; font-weight: 400; }
.neon-sign { font-family: var(--font-neon); font-size: 64px; line-height: 68px; font-weight: 400; letter-spacing: 0.02em; }
.crt { font-family: var(--font-crt); font-size: 32px; line-height: 40px; font-weight: 400; }
.holo { font-family: var(--font-holo); font-size: 72px; line-height: 72px; font-weight: 400; }
.scribble { font-family: var(--font-scribble); font-size: 28px; line-height: 32px; font-weight: 400; }
.loom-sm { font-family: var(--font-loom-sm); font-size: 24px; line-height: 28px; font-weight: 400; }
.hud-num { font-family: var(--font-hud); font-size: 48px; line-height: 48px; font-weight: 700; letter-spacing: 0.02em; }
.arcade-3d { font-family: var(--font-arcade); font-size: 72px; line-height: 72px; font-weight: 400; }