/* Generated from shared/tokens.json 1.0.0 (09/10/2026). Do not edit by hand. */
:root {
  /* colour: one cool grey family, and one red */
  --paper: #FBFBFC;
  --white: #FFFFFF;
  --silver-50: #F7F7F9;
  --silver-100: #F4F4F7;
  --silver-150: #EDEDF0;
  --silver-200: #E2E2E6;
  --silver-300: #D4D4D9;
  --silver-400: #C4C4CB;
  --silver-450: #B4B4BD;
  --silver-500: #A0A0A9;
  --silver-600: #8C8C96;
  --silver-700: #74747E;
  --graphite-600: #55555E;
  --graphite-700: #3A3A42;
  --graphite-800: #2A2A30;
  --graphite-850: #1C1C21;
  --graphite-900: #101013;
  --ink: #0B0B0E;
  --signal: #E63946;

  /* roles on Paper (the default surface) */
  --surface: #FBFBFC;
  --raised: #FFFFFF;
  --quiet-band: #F4F4F7;
  --text: #0B0B0E;
  --body: #3A3A42;
  --muted: #55555E;
  --faint: #D4D4D9;
  --rule: #E2E2E6;
  --focus: #0B0B0E;
  --selection-bg: #0B0B0E;
  --selection-text: #FFFFFF;

  /* type */
  --serif: 'Newsreader', Georgia, 'Times New Roman', serif;
  --mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --fs-display-xl: clamp(3.5rem, 0.7143rem + 11.4286vw, 11rem);
  --lh-display-xl: 0.94;
  --tr-display-xl: -0.045em;
  --fs-display-l: clamp(2.75rem, 0.9857rem + 7.2381vw, 7.5rem);
  --lh-display-l: 1;
  --tr-display-l: -0.04em;
  --fs-display-m: clamp(2.25rem, 0.95rem + 5.3333vw, 5.75rem);
  --lh-display-m: 1.04;
  --tr-display-m: -0.035em;
  --fs-display-s: clamp(2.125rem, 1.0571rem + 4.381vw, 5rem);
  --lh-display-s: 1.08;
  --tr-display-s: -0.03em;
  --fs-heading: clamp(2rem, 1.2571rem + 3.0476vw, 4rem);
  --lh-heading: 1.1;
  --tr-heading: -0.025em;
  --fs-lead: clamp(1.625rem, 1.1607rem + 1.9048vw, 2.875rem);
  --lh-lead: 1.22;
  --tr-lead: -0.02em;
  --fs-title: clamp(1.5rem, 1.2679rem + 0.9524vw, 2.125rem);
  --lh-title: 1.3;
  --tr-title: -0.01em;
  --fs-body-l: clamp(1.1875rem, 1.1179rem + 0.2857vw, 1.375rem);
  --lh-body-l: 1.6;
  --tr-body-l: 0;
  --fs-body: clamp(1.125rem, 1.0786rem + 0.1905vw, 1.25rem);
  --lh-body: 1.6;
  --tr-body: 0;
  --fs-small: 1.0625rem;
  --lh-small: 1.5;
  --tr-small: 0;
  --fs-mono-label: 0.6875rem;
  --lh-mono-label: 1.7;
  --tr-mono-label: 0.14em;
  --fs-mono-note: 0.75rem;
  --lh-mono-note: 1.8;
  --tr-mono-note: 0;
  --measure-note: 33rem;
  --measure-prose: 41rem;
  --measure-sentence: 34rem;
  --measure-headline: 10.6em;
  --measure-lead: 66rem;
  --measure-display: 75rem;

  /* space: one section interval, one header grammar */
  --section: clamp(6rem, 4.5143rem + 6.0952vw, 10rem);
  --gutter: clamp(1.375rem, 0.7714rem + 2.4762vw, 3rem);
  --frame-inset: clamp(0.5rem, 0.4071rem + 0.381vw, 0.75rem);
  --container-max: 90rem;
  --gap-label-heading: 20px;
  --gap-heading-sentence: 20px;
  --gap-sentence-action: 32px;
  --gap-header-object: clamp(2.5rem, 1.9429rem + 2.2857vw, 4rem);
  --row-pad: clamp(1.5rem, 1.1286rem + 1.5238vw, 2.5rem);

  /* radius: panel, card, pill. Paper is always 0 */
  --r-panel: clamp(1.25rem, 1.0643rem + 0.7619vw, 1.75rem);
  --r-card: calc(var(--r-panel) - var(--frame-inset));
  --r-pill: 999px;

  /* hairlines and shadows */
  --hairline: 1px solid #E2E2E6;
  --hairline-material: 0 0 0 1px rgba(11,11,14,0.07);
  --lift-1: 0 1px 1px rgba(11,11,14,0.03), 0 2px 4px rgba(11,11,14,0.03);
  --lift-2: 0 1px 1px rgba(11,11,14,0.03), 0 4px 8px rgba(11,11,14,0.035), 0 14px 28px -6px rgba(11,11,14,0.07);
  --lift-3: 0 1px 1px rgba(11,11,14,0.03), 0 6px 12px rgba(11,11,14,0.04), 0 22px 44px -10px rgba(11,11,14,0.10), 0 48px 90px -30px rgba(11,11,14,0.16);
  --shadow-ink-pill: inset 0 1px 0 rgba(255,255,255,0.22), inset 0 -1px 0 rgba(0,0,0,0.55), 0 0 0 1px #0B0B0E, 0 1px 2px rgba(11,11,14,0.30), 0 10px 22px -8px rgba(11,11,14,0.38);
  --shadow-silver-pill: inset 0 1px 0 #FFFFFF, inset 0 -1px 0 rgba(11,11,14,0.16), 0 0 0 1px rgba(255,255,255,0.50), 0 8px 20px -8px rgba(0,0,0,0.60);
  --lift-pane: 0 1px 1px rgba(11,11,14,0.03), 0 10px 20px -8px rgba(11,11,14,0.08), 0 30px 60px -24px rgba(11,11,14,0.16);
  --lift-nav: 0 1px 1px rgba(11,11,14,0.03), 0 8px 24px -12px rgba(11,11,14,0.12);

  /* glass: opaque by default, translucent where supported */
  --glass-nav-fill: linear-gradient(180deg, rgba(255,255,255,0.74) 0%, rgba(247,247,249,0.56) 100%);
  --glass-nav-blur: 18px;
  --glass-nav-sat: 1.2;
  --glass-nav-rim: inset 0 1px 0 rgba(255,255,255,0.95), inset 0 -1px 0 rgba(11,11,14,0.04), inset 0 0 0 1px rgba(255,255,255,0.45);
  --glass-nav-hairline: 0 0 0 1px rgba(11,11,14,0.07);
  --glass-nav-solid: #F7F7F9;
  --glass-control-fill: linear-gradient(180deg, rgba(255,255,255,0.78) 0%, rgba(255,255,255,0.58) 100%);
  --glass-control-blur: 14px;
  --glass-control-sat: 1.3;
  --glass-control-rim: inset 0 1px 0 rgba(255,255,255,0.95), inset 0 0 0 1px rgba(255,255,255,0.50);
  --glass-control-hairline: 0 0 0 1px rgba(11,11,14,0.09);
  --glass-control-solid: #F7F7F9;
  --glass-pane-frost-fill: linear-gradient(135deg, rgba(255,255,255,0.44) 0%, rgba(244,244,247,0.14) 50%, rgba(196,196,203,0.24) 100%);
  --glass-pane-frost-blur: 4px;
  --glass-pane-frost-sat: 1.1;
  --glass-pane-frost-rim: inset 0 1px 0 rgba(255,255,255,0.95), inset 1px 0 0 rgba(255,255,255,0.60), inset 0 -1px 0 rgba(11,11,14,0.05), inset 0 0 0 1px rgba(255,255,255,0.35);
  --glass-pane-frost-hairline: 0 0 0 1px rgba(11,11,14,0.07);
  --glass-pane-frost-solid: #F4F4F7;
  --glass-pane-clear-fill: linear-gradient(135deg, rgba(255,255,255,0.34) 0%, rgba(255,255,255,0.06) 50%, rgba(160,160,169,0.10) 100%);
  --glass-pane-clear-blur: 0px;
  --glass-pane-clear-sat: 1;
  --glass-pane-clear-rim: inset 0 1px 0 rgba(255,255,255,0.95), inset 1px 0 0 rgba(255,255,255,0.60), inset 0 -1px 0 rgba(11,11,14,0.05), inset 0 0 0 1px rgba(255,255,255,0.35);
  --glass-pane-clear-hairline: 0 0 0 1px rgba(11,11,14,0.07);
  --glass-pane-clear-solid: transparent;
  --glass-pane-sheen: linear-gradient(121deg, rgba(255,255,255,0) 16%, rgba(255,255,255,0.50) 29%, rgba(255,255,255,0.06) 30%, rgba(255,255,255,0) 58%, rgba(255,255,255,0.16) 100%);

  /* chrome edge, fills, light */
  --chrome-edge: linear-gradient(100deg, transparent 18%, rgba(255,255,255,0.95) 27%, transparent 37%, transparent 62%, rgba(255,255,255,0.80) 71%, transparent 80%), linear-gradient(180deg, #FFFFFF 0%, #E2E2E6 38%, #B4B4BD 100%);
  --fill-ink: linear-gradient(180deg, #2A2A30 0%, #0B0B0E 100%);
  --fill-silver: linear-gradient(180deg, #FFFFFF 0%, #F4F4F7 55%, #D4D4D9 100%);
  --light-angle: 121deg;
  --field: radial-gradient(90% 80% at 12% -10%, #FFFFFF 0%, rgba(255,255,255,0) 60%), linear-gradient(121deg, rgba(255,255,255,0) 30%, rgba(255,255,255,0.70) 44%, rgba(255,255,255,0) 58%), linear-gradient(121deg, rgba(255,255,255,0) 66%, rgba(255,255,255,0.45) 74%, rgba(255,255,255,0) 82%), radial-gradient(60% 70% at 88% 30%, rgba(212,212,217,0.55) 0%, rgba(212,212,217,0) 70%), radial-gradient(70% 60% at 40% 110%, rgba(226,226,230,0.80) 0%, rgba(226,226,230,0) 70%), linear-gradient(180deg, #FAFAFB 0%, #EFEFF2 100%);
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-opacity: 0.045;
  --grain-blend: multiply;

  /* motion: one primary curve */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-line: cubic-bezier(0.6, 0, 0.1, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --ease-linear: linear;
  --d-press: 150ms;
  --d-colour: 300ms;
  --d-hover: 600ms;
  --d-reveal: 900ms;
  --d-line-rise: 1100ms;
  --d-glide: 1300ms;
  --d-register: 1800ms;
  --d-glint: 900ms;
  --d-film-text-in: 600ms;
  --d-film-text-out: 333ms;
  --d-film-scene-overlap: 400ms;

  /* layers */
  --z-field: 0;
  --z-line: 1;
  --z-pane: 2;
  --z-label: 3;
  --z-content: 4;
  --z-sticky: 20;
  --z-menu: 55;
  --z-nav: 60;
  --z-theatre: 80;
  --z-skip-link: 100;

  /* the Red signal */
  --signal-dot: 6px;
  --signal-halo: 0 0 0 4px rgba(230,57,70,0.12);
}

/* The Graphite band: same components, different values. */
[data-surface="graphite"] {
  --surface: #101013;
  --raised: #1C1C21;
  --text: #F4F4F7;
  --body: #C4C4CB;
  --muted: #A0A0A9;
  --faint: #55555E;
  --rule: rgba(255,255,255,0.10);
  --focus: #F4F4F7;
  --selection-bg: #F4F4F7;
  --selection-text: #0B0B0E;
  --hairline: 1px solid rgba(255,255,255,0.10);
  --hairline-material: 0 0 0 1px rgba(0,0,0,0.60);
  --lift-1: 0 1px 2px rgba(0,0,0,0.40);
  --lift-2: 0 1px 2px rgba(0,0,0,0.40), 0 12px 28px -8px rgba(0,0,0,0.60);
  --lift-3: 0 1px 2px rgba(0,0,0,0.40), 0 24px 48px -12px rgba(0,0,0,0.70), 0 60px 110px -30px rgba(0,0,0,0.80);
  --glass-nav-fill: linear-gradient(180deg, rgba(42,42,48,0.66) 0%, rgba(16,16,19,0.58) 100%);
  --glass-nav-blur: 18px;
  --glass-nav-sat: 1.2;
  --glass-nav-rim: inset 0 1px 0 rgba(255,255,255,0.16), inset 0 0 0 1px rgba(255,255,255,0.06);
  --glass-nav-hairline: 0 0 0 1px rgba(0,0,0,0.60);
  --glass-nav-solid: #1C1C21;
  --chrome-edge: linear-gradient(100deg, transparent 18%, rgba(255,255,255,0.55) 27%, transparent 37%), linear-gradient(180deg, rgba(255,255,255,0.42) 0%, rgba(255,255,255,0.10) 40%, rgba(255,255,255,0.03) 100%);
  --field: radial-gradient(80% 80% at 14% -10%, rgba(116,116,126,0.24) 0%, rgba(116,116,126,0) 60%), linear-gradient(121deg, rgba(255,255,255,0) 34%, rgba(255,255,255,0.045) 46%, rgba(255,255,255,0) 58%), radial-gradient(52% 60% at 84% 40%, rgba(85,85,94,0.22) 0%, rgba(85,85,94,0) 70%), linear-gradient(180deg, #17171B 0%, #0D0D10 100%);
  --grain-opacity: 0.07;
  --grain-blend: screen;
}