/**
 * public-tokens.css — the ON RECORD token layer for the PUBLIC site (S1–S10).
 * Loaded by layouts/base.html AFTER tokens.css: it re-declares the semantic custom
 * properties the public stylesheets consume, so the public site lives in the ON RECORD
 * world while office/portal (which never load this file) keep NIGHT GANTRY intact.
 * Law: kit design-v2.md (docs/design-on-record/design-v2.md). No raw values may appear
 * in public component CSS — everything resolves here.
 */

:root {
  /* ── color primitives (design-v2 §2) ─────────────────────────────────── */
  --graphite-950: #0b0d0f;
  --graphite-900: #101316;
  --graphite-870: #14181c;
  --graphite-820: #1a1e22;
  --graphite-780: #1e2328;
  --seam-800: #262b30;
  --rule-700: #31363c;
  --line-600: #3a3f45;
  --marker-550: #4a4e52;
  --chalk-100: #f2f3ef;
  --chalk-300: #c7cbc5;
  --chalk-400: #a9ada6;
  --chalk-500: #7e837f;
  --hazard-500: #ffc819;
  --hotsteel-500: #ff6a3d;

  /* ── color semantic (design-v2 §3) — overrides the NIGHT GANTRY names ── */
  --color-bg: var(--graphite-900);
  --color-bg-deep: var(--graphite-950);
  --color-surface: var(--graphite-820);
  --color-surface-alt: var(--graphite-870);
  --color-surface-raised: var(--graphite-780);
  --color-seam: var(--seam-800);
  --color-rule: var(--rule-700);
  --color-line: var(--line-600);
  --color-marker: var(--marker-550);
  --color-ink: var(--chalk-100);
  --color-ink-soft: var(--chalk-300);
  --color-ink-muted: var(--chalk-400);
  --color-ink-faint: var(--chalk-500);
  --color-accent: var(--hazard-500);
  --color-accent-2: var(--hotsteel-500);
  --color-chip-text: var(--graphite-900);
  --color-invert-bg: var(--chalk-100);
  --color-invert-ink: #14171a;
  --color-invert-ink-2: #292d31;
  --color-control-border: var(--chalk-400);
  --scrim-plate: rgb(11 13 15 / 0.78);
  --scrim-hud: rgb(11 13 15 / 0.72);
  --scrim-top: linear-gradient(
    rgb(11 13 15 / 0.94),
    rgb(11 13 15 / 0.55) 58%,
    transparent
  );

  /* ── type — Latin ramp (design-v2 §4.1) ──────────────────────────────── */
  --text-hero-lat: clamp(2.75rem, 8vw, 7rem);
  --text-h1sub-lat: clamp(2.4rem, 6.4vw, 5.6rem);
  --text-h2-lat: clamp(2.1rem, 4.6vw, 3.6rem);
  --text-callsheet-lat: clamp(1.6rem, 3.4vw, 2.6rem);
  --text-mechkey-lat: clamp(1.4rem, 2.7vw, 2.1rem);
  --text-h3-lat: 23px;
  --text-slug-lat: 17px;
  --text-formhead-lat: clamp(1.75rem, 3.8vw, 2.7rem);
  --text-ceremony-lat: clamp(2.2rem, 5.2vw, 4rem);
  --text-sanctioned-lat: clamp(19px, 1.7vw, 24px);
  --text-lead-lat: clamp(16px, 1.3vw, 18px);
  --text-body-lat-size: 17px;
  --text-body-lat-leading: 1.6;
  --text-legal-lat: 16px;
  --text-nav-lat: 15px;
  --text-chip-lat: 18px;
  --text-chip-lat-secondary: 17px;
  --text-data-lat: 15px;
  --text-label-lat: 13px;
  --text-key-lat: 12px;
  --text-micro-lat: 11px;
  --text-hud-time: 12.5px;

  /* ── type — Arabic ramp (design-v2 §4.2) ─────────────────────────────── */
  --text-hero-ar: clamp(2.35rem, 6.4vw, 5.6rem);
  --text-h1sub-ar: clamp(2.1rem, 5.2vw, 4.5rem);
  --text-h2-ar: clamp(1.85rem, 4vw, 3.05rem);
  --text-callsheet-ar: clamp(1.75rem, 3.2vw, 2.5rem);
  --text-h3-ar: 28px;
  --text-ceremony-ar: clamp(1.9rem, 4.2vw, 3.2rem);
  --text-lead-ar: clamp(17px, 1.45vw, 20px);
  --text-sanctioned-ar: clamp(20px, 1.8vw, 25px);
  --text-body-ar-size: 19px;
  --text-body-ar-leading: 1.85;
  --text-legal-ar: 18px;
  --text-label-ar: 15px;
  --text-value-ar: 17px;
  --text-nav-ar: 16px;
  --text-chip-ar: 19px;

  /* ── spacing & layout (design-v2 §5) ─────────────────────────────────── */
  --container-max: 1360px;
  --gutter: clamp(20px, 4vw, 48px);
  --deck-pad-block: clamp(72px, 9vw, 120px);
  --hero-min-height: 640px;
  --hud-corner-arm: 30px;
  --hud-corner-stroke: 2.5px;
  --hud-inset-side: 20px;
  --hud-inset-top: 80px;
  --hud-inset-bottom: 20px;
  --hud-plate-pad: 7px 11px;
  --stencil-pad: 6px 14px;
  --specbar-cell-min: 230px;
  --target-min: 44px;
  --field-height: 48px;
  --chip-height: 52px;
  --chip-height-secondary: 48px;
  --wordmark-h-header: 30px;
  --wordmark-h-header-ar: 32px;
  --wordmark-h-footer: 26px;
  --wordmark-h-footer-ar: 28px;

  /* ── motion tokens (design-v2 §6 + the aliveness layer §6b) ──────────── */
  --dur-instant: 0ms;
  --dur-corner: 300ms;
  --dur-wipe: 300ms;
  --dur-stamp: 380ms;
  --dur-shunt: 560ms;
  --dur-plate: 520ms;
  --dur-write: 800ms;
  --dur-flood: 320ms;
  --dur-hover: 200ms; /* aliveness layer: animated hover moves (underline draw, chip fill, lift) */
  --dur-lift: 240ms; /* aliveness layer: tile/card hover lift + media scale */
  --ease-enter: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-micro: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-morph: cubic-bezier(0.83, 0, 0.17, 1);
  --stagger: 80ms;
  --blink-rec: 1.2s;
  --blink-once: 400ms;
  --status-swap: 2800ms;
  --hover-lift: -3px; /* aliveness layer: the floating hover translate */
  --hover-media-scale: 1.03;

  /* ── z ladder ────────────────────────────────────────────────────────── */
  --z-nav: 40;
  --z-skip: 95;
  --z-intro: 90;

  /* ── focus (design-v2 §3) ────────────────────────────────────────────── */
  --focus-ring: 2px solid var(--hazard-500);
  --focus-offset: 3px;
}
