/* GW OMTC Design System — vendored tokens.
 *
 * Source of truth: the "GW OMTC Design System" project on claude.ai/design
 * (projectId 2769c551-edbc-4488-80b2-28e54406af37), files tokens/*.css.
 * This file is a CONCATENATION of that directory, not a reinterpretation of
 * it. When the design system changes, re-pull and replace wholesale — do not
 * hand-edit values here, and do not add app-specific tokens to this file.
 * App-level mappings live at the top of css/style.css and admin/css/style.css.
 *
 * Concatenated rather than @import-ed on purpose: an @import chain of eight
 * files is eight serialized round-trips before the first pixel is styled, and
 * this is the first stylesheet every page loads.
 *
 * NOTE — OMTC is NOT the GW Medicine design system. Different seal, different
 * navy, different type. Do not cross-pollinate the two.
 */

/* ── fonts ─────────────────────────────────────────────────────────────── */
/* Loaded by each page's <link rel=preconnect/stylesheet>, not @import-ed here:
   an @import inside a stylesheet blocks and cannot be preconnected. */

/* ── colors ────────────────────────────────────────────────────────────── */
:root {
  /* --- Base palette: Star of Life blue --- */
  /* --blue-500 is GW Pantone 2925, --blue-600 its dark companion */
  --blue-50:#e8f5fc;--blue-100:#c7e8f8;--blue-200:#8fd2f1;--blue-300:#4fb8e6;--blue-400:#1fa3dc;--blue-500:#0190db;--blue-600:#006fab;--blue-700:#025b8b;--blue-800:#014a68;--blue-900:#013448;
  /* --- Base palette: seal navy --- */
  --navy-50:#eef2f6;--navy-100:#d5dfe9;--navy-200:#a7bacd;--navy-300:#7291ae;--navy-400:#456a8c;--navy-500:#28527a;--navy-600:#1b4463;--navy-700:#003b5c;--navy-800:#002a42;--navy-900:#081e2e;--navy-950:#04121c;
  /* --- Base palette: cherry blossom (GW / DC accent) --- */
  --blossom-50:#fef7f9;--blossom-100:#fdeef2;--blossom-200:#fbc3d0;--blossom-300:#f4a9c0;--blossom-400:#e97f9f;--blossom-500:#d95f84;--blossom-600:#b8446a;--blossom-700:#8f3252;
  /* --- Extended palette: category & data colours, all tuned to the seal --- */
  --teal-100:#d6f0ee;--teal-300:#79cfc8;--teal-500:#12897f;--teal-700:#0b5f58;
  --slate-100:#dfe6ee;--slate-300:#9fb0c4;--slate-500:#5b708a;--slate-700:#3b4c60;
  --plum-100:#eae4f2;--plum-300:#b9a5d4;--plum-500:#6f52a3;--plum-700:#4c3773;
  --gold-100:#fbf0d3;--gold-300:#e9c66c;--gold-500:#b98b12;--gold-700:#8a670c;
  --sky-100:#dff0fb;--sky-300:#8ecdf0;--sky-500:#2f9fd6;
  --ink-100:#e6eaee;--ink-500:#3a4653;--ink-900:#111820;

  /* --- GW institutional secondaries (Pantone) --- */
  --gw-buff:#aa9868;--gw-cream:#f9e08e;--gw-green:#008364;--gw-gold:#ffc72c;--gw-lime:#78be20;--gw-rust:#a75523;--gw-red:#c9102f;

  /* --- AHA discipline coding, as used on the public catalog --- */
  --disc-bls:var(--blue-500);--disc-acls:var(--gw-red);--disc-pals:var(--plum-500);--disc-ems:var(--navy-700);
  /* Legible companions for the same coding on dark surfaces */
  --disc-bls-on-dark:var(--blue-300);--disc-acls-on-dark:#ff7183;--disc-pals-on-dark:var(--plum-300);--disc-ems-on-dark:var(--sky-300);

  /* --- Data visualisation series (use in this order) --- */
  --viz-1:var(--blue-500);--viz-2:var(--navy-500);--viz-3:var(--blossom-400);--viz-4:var(--teal-500);--viz-5:var(--gold-500);--viz-6:var(--plum-500);

  /* --- Neutrals --- */
  --neutral-0:#ffffff;--neutral-25:#fafbfc;--neutral-50:#f4f6f8;--neutral-100:#e8ecf0;--neutral-200:#d5dbe2;--neutral-300:#b3bcc6;--neutral-400:#8b96a3;--neutral-500:#6a7683;--neutral-600:#4f5a66;--neutral-700:#39424c;--neutral-800:#242b33;--neutral-900:#14181d;--neutral-950:#0a0c0f;
  /* --- Status / triage --- */
  --red-100:#fde4e2;--red-500:#c62828;--red-600:#a71f1f;
  --amber-100:#fdf0d6;--amber-500:#c47f00;--amber-600:#9c6400;
  --green-100:#dff2e5;--green-500:#1e7a45;--green-600:#175f36;
  --gray-tag:#5a6672;

  /* --- Semantic: surfaces --- */
  --surface-page:var(--neutral-25);
  --surface-card:var(--neutral-0);
  --surface-sunken:var(--neutral-50);
  --surface-inverse:var(--navy-900);
  --surface-brand:var(--navy-700);
  --surface-brand-soft:var(--blue-50);
  --surface-accent-soft:var(--blossom-100);
  --surface-accent-tint:var(--blossom-50);
  --surface-light-band:linear-gradient(180deg,var(--blossom-50) 0%,var(--neutral-0) 62%);
  --accent-blossom:var(--blossom-400);
  --accent-blossom-strong:var(--blossom-600);
  --text-accent:var(--blossom-700);
  --border-accent:var(--blossom-300);
  --surface-overlay:rgba(8,30,46,.62);

  /* --- Semantic: text --- */
  --text-heading:var(--navy-800);
  --text-body:var(--neutral-700);
  --text-muted:var(--neutral-500);
  --text-inverse:var(--neutral-0);
  --text-inverse-muted:var(--navy-200);
  --text-link:var(--blue-600);
  --text-link-hover:var(--blue-700);
  --text-on-brand:var(--neutral-0);

  /* --- Semantic: lines --- */
  --border-subtle:var(--neutral-100);
  --border-default:var(--neutral-200);
  --border-strong:var(--neutral-300);
  --border-brand:var(--blue-500);
  --border-inverse:rgba(255,255,255,.16);

  /* --- Semantic: interactive --- */
  --action-primary:var(--blue-500);
  --action-primary-hover:var(--blue-600);
  --action-primary-active:var(--blue-700);
  --action-secondary:var(--navy-700);
  --action-secondary-hover:var(--navy-800);
  --action-ghost-hover:var(--blue-50);
  --focus-ring:var(--blue-300);

  /* --- Semantic: status --- */
  --status-critical:var(--red-500);--status-critical-soft:var(--red-100);
  --status-caution:var(--amber-500);--status-caution-soft:var(--amber-100);
  --status-pass:var(--green-500);--status-pass-soft:var(--green-100);
  --status-info:var(--blue-500);--status-info-soft:var(--blue-50);
}

/* ── typography ────────────────────────────────────────────────────────── */
:root {
  --font-core:"Source Sans 3","Frutiger","Myriad Pro",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;

  --fs-display:56px;--fs-h1:40px;--fs-h2:30px;--fs-h3:23px;--fs-h4:19px;
  --fs-body-lg:18px;--fs-body:16px;--fs-body-sm:14px;--fs-caption:13px;--fs-micro:11px;

  --lh-tight:1.08;
  --lh-snug:1.22;
  --lh-normal:1.5;
  --lh-relaxed:1.62;

  --fw-light:300;
  --fw-regular:400;
  --fw-semibold:600;
  --fw-bold:700;
  --fw-black:900;

  --ls-display:-0.02em;
  --ls-heading:-0.01em;
  --ls-body:0;
  --ls-eyebrow:0.12em;
  --ls-button:0.01em;

  /* Composite type roles */
  --type-display:var(--fw-bold) var(--fs-display)/var(--lh-tight) var(--font-core);
  --type-h1:var(--fw-bold) var(--fs-h1)/var(--lh-snug) var(--font-core);
  --type-h2:var(--fw-semibold) var(--fs-h2)/var(--lh-snug) var(--font-core);
  --type-h3:var(--fw-semibold) var(--fs-h3)/1.3 var(--font-core);
  --type-h4:var(--fw-semibold) var(--fs-h4)/1.35 var(--font-core);
  --type-body:var(--fw-regular) var(--fs-body)/var(--lh-relaxed) var(--font-core);
  --type-body-sm:var(--fw-regular) var(--fs-body-sm)/var(--lh-normal) var(--font-core);
  --type-eyebrow:var(--fw-bold) var(--fs-micro)/1.2 var(--font-core);
  --type-button:var(--fw-semibold) var(--fs-body-sm)/1 var(--font-core);
  --type-mono:var(--fw-medium,500) var(--fs-body-sm)/1.45 var(--font-mono);
}

/* ── spacing ───────────────────────────────────────────────────────────── */
:root {
  --space-0:0px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--space-32:128px;
  --gutter-page:24px;--gutter-page-lg:48px;
  --container-max:1200px;--container-narrow:760px;
  --card-pad:20px;--card-pad-lg:28px;--section-pad-y:80px;
  --control-h-sm:32px;--control-h-md:40px;--control-h-lg:48px;
}

/* ── radius ────────────────────────────────────────────────────────────── */
:root{--radius-0:0px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:22px;--radius-2xl:28px;--radius-pill:999px;--radius-card:var(--radius-lg);--radius-control:var(--radius-md);--border-w:1px;--border-w-thick:2px;--rule-accent-w:3px;}

/* ── elevation ─────────────────────────────────────────────────────────── */
:root {
  --shadow-none:none;
  --shadow-xs:0 1px 2px rgba(8,30,46,.06);
  --shadow-sm:0 1px 3px rgba(8,30,46,.08),0 1px 2px rgba(8,30,46,.04);
  --shadow-md:0 4px 12px rgba(8,30,46,.10),0 1px 3px rgba(8,30,46,.06);
  --shadow-lg:0 12px 28px rgba(8,30,46,.14),0 2px 6px rgba(8,30,46,.06);
  --shadow-focus:0 0 0 3px rgba(79,184,230,.45);
  --shadow-inset-line:inset 0 -1px 0 var(--border-subtle);
  --scrim-top:linear-gradient(180deg,rgba(8,30,46,.72) 0%,rgba(8,30,46,0) 100%);
  --scrim-bottom:linear-gradient(0deg,rgba(8,30,46,.85) 0%,rgba(8,30,46,0) 100%);
}

/* ── motion ────────────────────────────────────────────────────────────── */
:root {
  --dur-instant:80ms;
  --dur-fast:140ms;
  --dur-base:200ms;
  --dur-slow:320ms;
  --ease-standard:cubic-bezier(.2,0,.2,1);
  --ease-out:cubic-bezier(0,0,.2,1);
  --ease-in:cubic-bezier(.4,0,1,1);
  --transition-control:background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard);
}
@media (prefers-reduced-motion:reduce){:root{
  --dur-instant:0ms;
  --dur-fast:0ms;
  --dur-base:0ms;
  --dur-slow:0ms;
}}
