/* Hallmark · genre: atmospheric (tempered for academic readers) · macrostructure: Feature Stack · nav: N10 · footer: Ft5
 * theme: studied-DNA (source: ai-workflow-interface-DESIGN.md) · paper oklch(14.1% 0.004 285.8) · signal oklch(80.3% 0.236 147.4) · accent oklch(75.4% 0.139 232.7)
 * display + body: Inter · labels: JetBrains Mono · enrichment: user photo + Tier-B canvas signal grid
 * pre-emit critique: P4 H4 E4 S4 R4 V4 (independent review before fixes: P4 H4 E3 S4 R3 V4)
 * slop: 58/58 after fixes (11 gates fixed: 9 13 22 24 25 26 35 40 44 49 51) · honest: all copy traced to CV · tokens: locked · mobile: 320/375/414/768/1280 verified
 */

@font-face {
  font-family: "Inter Variable";
  src: url("assets/fonts/inter-var.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono Variable";
  src: url("assets/fonts/jetbrains-mono-var.woff2") format("woff2-variations");
  font-weight: 100 800;
  font-display: swap;
}

:root {
  color-scheme: dark;

  /* colour — from ai-workflow-interface-DESIGN.md, converted to OKLCH */
  --color-paper: oklch(14.1% 0.004 285.8);       /* #09090B secondary */
  --color-surface: oklch(22.2% 0.006 271.1);     /* #1A1B1E surface   */
  --color-surface-2: oklch(18% 0.005 278);       /* between paper and surface */
  --color-rule: oklch(27.4% 0.005 286);          /* #27272A border    */
  --color-rule-strong: oklch(36% 0.006 286);
  --color-ink: oklch(99% 0.003 286);             /* ≈ #FFFFFF, tinted  */
  --color-ink-2: oklch(86% 0.008 286);           /* body copy         */
  --color-muted: oklch(71.2% 0.013 286.1);       /* #A1A1AA           */
  --color-signal: oklch(80.3% 0.236 147.4);      /* #00E559 primary   */
  --color-signal-dim: oklch(80.3% 0.236 147.4 / 0.14);
  --color-signal-ink: oklch(14.1% 0.004 285.8);  /* text on signal    */
  --color-accent: oklch(75.4% 0.139 232.7);      /* #38BDF8 accent    */
  --color-surface-veil: oklch(22.2% 0.006 271.1 / 0.82);   /* surface, lets the glyph rain show through */
  --color-surface-2-veil: oklch(18% 0.005 278 / 0.82);
  --color-mask-faint: oklch(0% 0 0 / 0.25);   /* mask alpha only — dims a layer to 25% */
  --color-signal-glow: oklch(80.3% 0.236 147.4 / 0.32);
  --color-accent-dim: oklch(75.4% 0.139 232.7 / 0.14);
  --color-bloom: oklch(80.3% 0.236 147.4 / 0.10);
  --color-shadow: oklch(8% 0.005 286 / 0.45);
  --color-focus: oklch(80.3% 0.236 147.4);

  /* type */
  --font-display: "Inter Variable", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Inter Variable", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono Variable", "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --text-xs: 0.75rem;     /* 12 — label-md */
  --text-sm: 0.875rem;
  --text-base: 1rem;      /* 16 — body-md */
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: clamp(1.5rem, 1.1rem + 1.6vw, 2.125rem);
  --text-3xl: clamp(2rem, 1.3rem + 3vw, 3.25rem);
  --text-display: clamp(2.375rem, 1.4rem + 5.6vw, 4rem); /* 64px cap — display-lg */

  /* space — 4pt scale (8px base) */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;       /* 16 gap */
  --space-md: 1.5rem;     /* 24 card padding */
  --space-lg: 2.5rem;
  --space-xl: 3.5rem;
  --space-2xl: 5rem;      /* 80 section padding */
  --page-gutter: clamp(1rem, 4vw, 2.5rem);
  --page-max: 75rem;

  /* shape */
  --radius-card: 20px;
  --radius-control: 20px;
  --radius-pill: 9999px;
  --rule-hair: 1px;

  /* motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long: 420ms;
  --dur-laser: 1400ms;   /* certification scan sweep */
}