:root {
  color-scheme: dark;

  /* Signal Archive palette */
  --ink-950: #03060a;
  --ink-900: #060b12;
  --ink-850: #08111b;
  --ink-800: #0b1722;
  --ink-750: #10202d;
  --surface: rgb(8 17 27 / 82%);
  --surface-solid: #09131e;
  --surface-raised: #0d1b28;
  --surface-bright: #132635;
  --line-faint: rgb(153 221 229 / 12%);
  --line: rgb(153 221 229 / 24%);
  --line-strong: rgb(153 221 229 / 46%);

  --paper: #f3fafb;
  --paper-soft: #d7e7e9;
  --muted: #94aeb4;
  --muted-strong: #b6cbd0;
  --cyan: #71ecf2;
  --cyan-bright: #a6fbff;
  --cyan-deep: #16aebb;
  --amber: #f4ba57;
  --amber-bright: #ffd88d;
  --magenta: #df68aa;
  --green: #72e4a0;
  --red: #ff7d89;
  --blue: #78aaf7;

  --status-concept: #d790ce;
  --status-development: #7eb6ff;
  --status-announced: #71ecf2;
  --status-soon: #f4ba57;
  --status-access: #ba92ff;
  --status-released: #72e4a0;
  --status-hold: #ff9c78;
  --status-legacy: #a8b4bc;

  --font-display: "Arial Narrow", "Aptos Display", "Roboto Condensed", "Helvetica Neue", sans-serif;
  --font-body: Inter, Aptos, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

  --text-xs: clamp(0.68rem, 0.65rem + 0.1vw, 0.75rem);
  --text-sm: clamp(0.82rem, 0.79rem + 0.12vw, 0.9rem);
  --text-base: clamp(1rem, 0.96rem + 0.16vw, 1.1rem);
  --text-lg: clamp(1.14rem, 1.04rem + 0.36vw, 1.38rem);
  --text-xl: clamp(1.45rem, 1.2rem + 0.8vw, 2rem);
  --text-2xl: clamp(2rem, 1.42rem + 2vw, 3.5rem);
  --text-3xl: clamp(2.75rem, 1.55rem + 4.4vw, 6rem);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  --measure-copy: 68ch;
  --container: 76rem;
  --container-wide: 92rem;
  --header-height: 4.75rem;
  --card-min: 16rem;
  --card-art-ratio: 4 / 5;

  /* Documented layout thresholds; repeated literally in media queries because
     CSS custom properties cannot be used in media-condition expressions. */
  --breakpoint-phone: 38rem;
  --breakpoint-tablet: 52rem;
  --breakpoint-laptop: 64rem;
  --breakpoint-desktop: 78rem;

  --radius-xs: 0.2rem;
  --radius-sm: 0.45rem;
  --radius: 0.75rem;
  --radius-lg: 1.1rem;
  --radius-pill: 100vmax;
  --cut: 1rem;
  --cut-lg: 2rem;

  --shadow-panel: 0 1.5rem 5rem rgb(0 0 0 / 34%);
  --shadow-cyan: 0 0 2rem rgb(60 224 234 / 18%);
  --shadow-amber: 0 0 2rem rgb(244 186 87 / 16%);
  --glow-low: 12%;
  --glow-medium: 18%;
  --focus: 0 0 0 0.2rem var(--ink-950), 0 0 0 0.38rem var(--cyan-bright);

  --ease-out: cubic-bezier(0.2, 0.75, 0.2, 1);
  --ease-spring: cubic-bezier(0.2, 0.9, 0.3, 1.18);
  --duration-fast: 140ms;
  --duration: 260ms;
  --duration-slow: 650ms;

  --z-base: 0;
  --z-art: 1;
  --z-content: 2;
  --z-header: 30;
  --z-menu: 40;
  --z-skip: 80;
}