/* ============================================================================
   tokens.css — PRIMITIVE tokens (theme-independent). Raw palette + scales.
   Colour values sourced from STYLING.md (Plixel / Deep Blue Mosaic).
   Components never use these directly — only the semantic tokens in themes.css.
   ============================================================================ */
:root {
    /* --- Brand blue (primary accent) --- */
    --c-blue-300: #93C5FD;
    --c-blue-500: #3B82F6;
    --c-blue-600: #2563EB;
    --c-blue-700: #1D4ED8;
    --c-blue-rgb: 59, 130, 246;

    /* --- Amber / orange (secondary accent — reserved for prominence) --- */
    --c-amber-400: #ffc14d;
    --c-amber-500: #f5a623;
    --c-amber-600: #d98c0a;
    --c-orange-500: #ff7a1a;
    --c-orange-600: #e85f00;

    /* --- Dark neutrals --- */
    --c-navy-950: #121416;
    --c-navy-900: #16181b;
    --c-navy-850: #1a1d21;
    --c-navy-800: #1c1f23;
    --c-navy-700: #2a2d31;
    --c-ink-050: #f5f5f5;
    --c-ink-100: #e6e6e6;
    --c-ink-300: #b3b8be;

    /* --- Light neutrals --- */
    --c-paper-50: #fafafa;
    --c-white: #ffffff;
    --c-paper-100: #f0f1f3;
    --c-paper-200: #dee2e6;
    --c-slate-900: #15181c;
    --c-slate-500: #5c636a;

    /* --- Status (theme-aware pairs) --- */
    --c-warn-light: #b25e00;
    --c-warn-dark: #ffb84d;
    --c-info-light: #0a6e9e;
    --c-info-dark: #4dd6f5;
    --c-ok-light: #198754;
    --c-ok-dark: #3ddc84;
    --c-danger-light: #dc3545;
    --c-danger-dark: #ff6b6b;

    /* --- Content-type markers (constant across themes — per the designs) --- */
    --c-green-500: #22c55e;
    --c-red-500: #ef4444;
    --c-purple-500: #a855f7;

    /* --- Font families (Google Fonts; see STYLING.md §7 / DEVELOPMENT §15.3) --- */
    --sc-font-heading:    "Stack Sans Text", system-ui, -apple-system, sans-serif;
    --sc-font-subheading: "Stack Sans Text", system-ui, -apple-system, sans-serif;
    --sc-font-body:       "IBM Plex Sans", system-ui, -apple-system, sans-serif;
    --sc-font-condensed:  "Sofia Sans Extra Condensed", "Arial Narrow", sans-serif;

    /* --- Font weights --- */
    --sc-fw-thin: 100;      --sc-fw-extralight: 200; --sc-fw-light: 300;
    --sc-fw-regular: 400;   --sc-fw-medium: 500;     --sc-fw-semibold: 600;
    --sc-fw-bold: 700;      --sc-fw-extrabold: 800;  --sc-fw-black: 900;

    /* --- Font sizes + rhythm --- (tightened 2026-07-15 for a denser, cleaner read) */
    --sc-fs-display: clamp(1.9rem, 3.6vw, 3rem);
    --sc-fs-h1: clamp(1.45rem, 2.6vw, 2rem);
    --sc-fs-h2: 1.35rem;
    --sc-fs-h3: 1.125rem;
    --sc-fs-body: 0.9375rem;   /* 15px */
    --sc-fs-sm: 0.8125rem;     /* 13px */
    --sc-fs-xs: 0.6875rem;     /* 11px */
    --sc-lh-tight: 1.15;
    --sc-lh-body: 1.5;

    /* --- Spacing scale (4px base) --- */
    --sc-space-1: 0.25rem; --sc-space-2: 0.5rem;  --sc-space-3: 0.75rem;
    --sc-space-4: 1rem;    --sc-space-5: 1.5rem;  --sc-space-6: 2rem;
    --sc-space-7: 3rem;    --sc-space-8: 4rem;

    /* --- Radii --- */
    --sc-radius-sm: 6px;
    --sc-radius-md: 10px;
    --sc-radius-lg: 16px;
    --sc-radius-pill: 999px;

    /* --- Layout --- */
    --sc-container-max: 1200px;
    --sc-z-nav: 100; --sc-z-overlay: 200; --sc-z-modal: 300; --sc-z-toast: 400;

    /* --- Breakpoints (reference; media queries use literals) --- */
    --sc-bp-sm: 480px; --sc-bp-md: 768px; --sc-bp-lg: 1024px; --sc-bp-xl: 1280px;
}