/* Sekala Niskala — design tokens. Source of truth for every value. Generated from tokens.snapshot.json; edit here, keep DESIGN.md in sync. */

:root, [data-theme="paper"] {
  --blue: #0000d6;
  --blue-frame: #0000a6;
  --blue-deep: #000078;
  --blue-night: #000026;
  --paper: #f2f2f2;
  --paper-tint: #fafaff;
  --paper-shade: #e6e6e6;
  --canang-yellow: #f2f200;
  --slate: #5c5c8f;
  --periwinkle: #c2c2ff;
  --lavender: #6f6ff0;
  --ground: var(--paper);
  --ground-raised: var(--paper-shade);
  --ground-deep: var(--blue);
  --ink: var(--blue);
  --ink-muted: var(--slate);
  --ink-invert: var(--paper);
  --rule: #c8c8ee;
  --focus: var(--blue);
}

[data-theme="blue"] {
  --ground: var(--blue);
  --ground-raised: var(--blue-frame);
  --ground-deep: var(--blue-night);
  --ink: var(--paper);
  --ink-muted: var(--periwinkle);
  --ink-invert: var(--paper);
  --rule: #3d3de0;
  --focus: var(--canang-yellow);
}

:root {
  /* spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 40px;
  --space-7: 64px;
  --space-8: 96px;
  --space-9: 160px;
  /* radius */
  --radius-none: 0;
  --radius-sm: 2px;
  --radius-term: 6px;
  /* size */
  --container: 1240px;
  --measure: 68ch;
  --gutter-ch: 2ch;
  --plate-dot: 2px;
  --ascii-cell-w: 8px;
  --ascii-cell-h: 14px;
  /* duration */
  --dur-instant: 80ms;
  --dur-fast: 160ms;
  --dur-scramble: 400ms;
  --dur-reveal: 600ms;
  --dur-gate: 1100ms;
  --caret-blink: 1060ms;
  /* easing */
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-step: steps(6, end);
  --ease-gate: cubic-bezier(0.7, 0, 0.2, 1);
  /* font families */
  --font-display: "Doto", "Geist Mono", ui-monospace, monospace;
  --font-mono: "Geist Mono", "JetBrains Mono", ui-monospace, monospace;
  --font-sans: "Geist", "Helvetica Neue", Arial, sans-serif;
}

/* Type styles: apply as classes (t-hero, t-body…) or copy the declarations. */
.t-hero { font-family: var(--font-display); font-size: 112px; line-height: 0.9; font-weight: 900; letter-spacing: -0.02em; font-variation-settings: "ROND" 0; text-transform: uppercase; }
.t-heading { font-family: var(--font-display); font-size: 72px; line-height: 0.95; font-weight: 800; letter-spacing: -0.01em; font-variation-settings: "ROND" 0; }
.t-wordmark { font-family: var(--font-display); font-size: 40px; line-height: 0.9; font-weight: 900; font-variation-settings: "ROND" 0; text-transform: uppercase; }
.t-title { font-family: var(--font-mono); font-size: 22px; line-height: 1.2; font-weight: 500; letter-spacing: 0.02em; text-transform: uppercase; }
.t-subtitle { font-family: var(--font-mono); font-size: 18px; line-height: 1.45; font-weight: 400; }
.t-nav { font-family: var(--font-mono); font-size: 12px; line-height: 1; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; }
.t-legend { font-family: var(--font-mono); font-size: 11px; line-height: 1.3; font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; }
.t-meta { font-family: var(--font-mono); font-size: 12px; line-height: 1.4; font-weight: 400; letter-spacing: 0.02em; }
.t-code { font-family: var(--font-mono); font-size: 13px; line-height: 1.6; font-weight: 400; }
.t-lead { font-family: var(--font-sans); font-size: 20px; line-height: 1.5; font-weight: 400; }
.t-body { font-family: var(--font-sans); font-size: 16px; line-height: 1.6; font-weight: 400; }
.t-small { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; font-weight: 400; }

@media (max-width: 760px) { .t-hero { font-size: 52px; } .t-heading { font-size: 44px; } }