/* Design tokens. Every color, size, and timing in the site resolves here. */

:root {
  color-scheme: dark;

  /* Surfaces — deep charcoal stack, each step reads as a distinct plane. */
  --bg-void: #08090c;
  --bg-base: #0f1218;
  --bg-panel: #161a22;
  --bg-panel-hi: #1c212b;
  --bg-inset: #0b0d12;

  /* Ink */
  --ink-bright: #f4f6fa;
  --ink: #d2d8e2;
  --ink-dim: #9aa3b2;
  --ink-faint: #5f6877;

  /* Accents — cyan carries interaction, emerald carries "live",
     amber carries achievement, rose carries error. */
  --cyan: #38bdf8;
  --cyan-bright: #a9e6ff;
  --cyan-deep: #0284c7;
  --emerald: #34d399;
  --amber: #fbbf24;
  --rose: #fb7185;

  /* Lines and glows */
  --rule: rgba(255, 255, 255, 0.085);
  --rule-strong: rgba(255, 255, 255, 0.18);
  --glow-cyan: rgba(56, 189, 248, 0.35);
  --glow-emerald: rgba(52, 211, 153, 0.3);

  /* Type families — engraved display serif, literary body serif, terminal mono. */
  --font-display: "Cinzel", Georgia, "Times New Roman", serif;
  --font-body: "Cormorant Garamond", "Newsreader", Georgia, serif;
  --font-mono: "Fira Code", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Type scale */
  --text-2xs: 0.625rem;
  --text-xs: 0.6875rem;
  --text-sm: 0.8125rem;
  --text-md: 0.9375rem;
  --text-body: clamp(1.0625rem, 1rem + 0.35vw, 1.3125rem);
  --text-lead: clamp(1.1875rem, 1.05rem + 0.7vw, 1.5rem);
  --text-h2: clamp(1.0625rem, 0.95rem + 0.45vw, 1.3125rem);
  --text-h3: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);

  /* Spacing */
  --gap-2xs: 0.25rem;
  --gap-xs: 0.5rem;
  --gap-sm: 0.75rem;
  --gap-md: 1.25rem;
  --gap-lg: 2rem;
  --gap-xl: clamp(2.5rem, 2rem + 3vw, 4.5rem);

  --shell-max: 70rem;
  --shell-pad: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);

  --radius-sm: 3px;
  --radius: 6px;

  /* Motion */
  --dur-fast: 140ms;
  --dur: 260ms;
  --dur-slow: 620ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}