/* Sovel reviewer app -- design tokens.
 * ----------------------------------------------------------------
 * Single source of truth for color / spacing / type / radii / shadow / motion / z-index.
 * Loaded BEFORE style.css and knowledge_pulse.css so token vars are defined when
 * those stylesheets evaluate. Task 1.2 only *defines* tokens -- no rules reference
 * them yet, so this file is a pure no-op visually until Task 1.3 migrates rules.
 *
 * --------------------------------------------------------------------------------
 * Knowledge_pulse decision (path a vs b from the Task 1.2 spec):
 *   PATH (a) chosen. knowledge_pulse.css uses a parallel slate-family palette
 *   (#0f172a, #1e293b, #334155, #64748b, #cbd5e1, #ef4444, #f59e0b, #eff6ff,
 *   #fef3c7, plus a gradient linear-gradient(135deg, #3b82f6, #1e40af)). Those
 *   colors are NOT yet present in style.css's :root. They are included here as
 *   additive tokens (see "Knowledge Pulse extension" section) so Task 1.3 can
 *   migrate both stylesheets in one pass without re-extracting tokens. Defining
 *   unused custom properties has zero visual effect.
 *
 * --------------------------------------------------------------------------------
 * Naming-mirror decision:
 *   The Task 1.2 spec text lists `--color-ink`, `--color-paper`, `--color-accent`
 *   as the target palette names. The shipped app already uses a different,
 *   coherent semantic taxonomy in style.css's :root: --primary, --text, --surface,
 *   --success/--warning/--danger/--info, --signal, --ink (ink = #0f1720 dark navy,
 *   not black). To preserve visual parity and avoid breaking the ~3,278-line
 *   style.css that already references these vars, this file MIRRORS the existing
 *   names rather than introducing a parallel ink/paper/accent namespace. The
 *   *missing* categories the spec calls for -- spacing scale, type scale, weight
 *   scale, motion timing, z-index -- are added here as net-new tokens.
 *
 *   The existing tokens in style.css :root are duplicated here so this file is
 *   the single source of truth going forward. Task 1.3 will remove the duplicate
 *   declarations from style.css :root once consumers are migrated.
 *
 * --------------------------------------------------------------------------------
 * Severity / confidence tokens:
 *   The existing app reuses semantic colors for severity and confidence
 *   (--danger / --warning / --success / --text-muted). No separate severity
 *   palette exists. We add aliases (--severity-* / --confidence-*) here so future
 *   refactors can swap severity color independently of the semantic system if
 *   desired, without touching every call site again.
 *
 * Inventory source: tools/css-audit/inventory.md (109 unique colors, 192 spacing
 * declarations w/ regex bleed, 24 font-sizes, 16 box-shadows, 18 transitions).
 * --------------------------------------------------------------------------------
 */

:root {
  /* ============================================================
   * Color -- surfaces (backgrounds).
   * --bg aligned to bundle colors_and_type.css (#F5F7FA, slightly warmer
   * than the earlier #eef2f5 — the bundle's ledger-feel breaks if the
   * surround drifts even 1–2 LCH units). --surface-hover added as the
   * soft row-hover token used by the bundle .tbl .r:hover rule.
   * ============================================================ */
  --bg: #F5F7FA;
  --surface: #ffffff;
  --surface-raised: #fbfcfd;
  --surface-inset: #EEF1F5;
  --surface-hover: #F8FAFC;
  --surface-shell: #0f1720;
  --surface-shell-2: #18212c;
  --surface-shell-3: #223042;

  /* ============================================================
   * Color -- borders
   * ============================================================ */
  --border: #d8e0e7;
  --border-subtle: #e7edf2;
  --border-strong: #c4cfd9;

  /* ============================================================
   * Color -- text hierarchy
   * ============================================================ */
  --text: #101826;
  --text-secondary: #465468;
  --text-muted: #708095;
  --text-shell: #eef4fa;
  --text-shell-muted: #9fb0c5;

  /* ============================================================
   * Color -- accent + brand
   * ============================================================ */
  --primary: #1f5eff;
  --primary-soft: #edf3ff;
  --primary-hover: #184dde;
  --ink: #0f1720;
  --ink-soft: #253243;
  --signal: #8b5cf6;
  --signal-soft: #f3efff;

  /* ============================================================
   * Color -- semantic (success / warning / danger / info)
   * ============================================================ */
  --success: #16a34a;
  --success-soft: #ecfdf5;
  --warning: #d97706;
  --warning-soft: #fffbeb;
  --danger: #dc2626;
  --danger-soft: #fef2f2;
  --info: #0891b2;
  --info-soft: #ecfeff;

  /* ============================================================
   * Color -- severity aliases (issue board stripes + badges).
   * Existing rules reuse semantic colors; aliases let Task 1.3+
   * swap severity independently if needed.
   * ============================================================ */
  --severity-critical: #B91C1C;       /* bundle sev-critical */
  --severity-high:     #DC2626;       /* bundle sev-high */
  --severity-medium:   #D97706;       /* bundle sev-medium */
  --severity-low:      #64748B;       /* bundle sev-low — slate, was #708095 */
  --severity-low-stripe: var(--border);

  /* Accent-tint token used by the bundle for selection wash + active
   * nav state. Slightly cooler than --primary-soft (#EDF3FF); keeping
   * both so existing call sites don't move in this pass. */
  --accent-tint: #EBF1FF;

  /* ============================================================
   * Color -- confidence pills (review inbox).
   * Existing rules use success-soft/warning-soft/danger-soft + dark text.
   * ============================================================ */
  --confidence-high-bg: var(--success-soft);
  --confidence-high-fg: #065f46;
  --confidence-medium-bg: var(--warning-soft);
  --confidence-medium-fg: #92400e;
  --confidence-low-bg: var(--danger-soft);
  --confidence-low-fg: #991b1b;

  /* ============================================================
   * Knowledge Pulse extension -- slate palette parallel to style.css.
   * Used by web/static/css/knowledge_pulse.css. Defined here so Task 1.3
   * can migrate that file in the same pass. Path (a) decision (see header).
   * ============================================================ */
  --kp-ink: #0f172a;             /* darkest slate, modal text */
  --kp-ink-2: #1e293b;
  --kp-text-strong: #334155;
  --kp-text-muted: #64748b;      /* meta text, mic-off */
  --kp-border: #cbd5e1;
  --kp-surface-blue-soft: #eff6ff;
  --kp-surface-amber-soft: #fef3c7;
  --kp-accent-blue: #3b82f6;     /* gradient start */
  --kp-accent-blue-deep: #1e40af;/* gradient end + primary button */
  --kp-accent-amber: #f59e0b;    /* deviation accent */
  --kp-accent-red: #ef4444;      /* badge */
  --kp-accent-red-deep: #dc2626; /* recording state */
  --kp-success-deep: #065f46;    /* toast success bg */
  --kp-danger-deep: #991b1b;     /* toast error bg */
  --kp-gradient-orb: linear-gradient(135deg, #3b82f6 0%, #1e40af 100%);

  /* ============================================================
   * Spacing scale (rem-based, tracking the values most-used in inventory).
   * Inventory clusters around 0.25 / 0.375 / 0.5 / 0.625 / 0.75 / 0.875 /
   * 1 / 1.25 / 1.5 / 2 / 2.5 / 3rem with several off-grid values
   * (0.1 / 0.15 / 0.2 / 0.3 / 0.35 / 0.45 / 0.65 / 0.85 / 0.95rem).
   * Task 1.3 will snap off-grid values to the nearest scale step.
   * ============================================================ */
  --space-0: 0;
  --space-px: 1px;
  --space-0-5: 0.125rem;  /* 2px */
  --space-1: 0.25rem;     /* 4px */
  --space-1-5: 0.375rem;  /* 6px */
  --space-2: 0.5rem;      /* 8px */
  --space-2-5: 0.625rem;  /* 10px */
  --space-3: 0.75rem;     /* 12px */
  --space-3-5: 0.875rem;  /* 14px */
  --space-4: 1rem;        /* 16px */
  --space-5: 1.25rem;     /* 20px */
  --space-6: 1.5rem;      /* 24px */
  --space-7: 1.75rem;     /* 28px */
  --space-8: 2rem;        /* 32px */
  --space-10: 2.5rem;     /* 40px */
  --space-12: 3rem;       /* 48px */
  --space-16: 4rem;       /* 64px */
  --space-20: 5rem;       /* 80px */

  /* ============================================================
   * Type -- families. Existing app uses Inter (sans) + SF Mono /
   * Cascadia Code / JetBrains Mono fallback chain (mono). NO serif
   * is currently used; the spec's --font-serif is omitted to avoid
   * introducing new font loads in this task.
   * ============================================================ */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'SF Mono', 'Cascadia Code', 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;

  /* ============================================================
   * Type -- size scale (rem-based, tracking inventory's 24 unique sizes).
   * Many micro-pill sizes (0.55 / 0.5625 / 0.6 / 0.625 / 0.6875rem) cluster
   * around --text-2xs and --text-xs. Off-grid sizes (0.95 / 1.2 / 1.55rem)
   * are not snapped here -- Task 1.3 decides per call site.
   * ============================================================ */
  --text-2xs: 0.625rem;    /* 10px */
  --text-xs: 0.75rem;      /* 12px */
  --text-sm: 0.8125rem;    /* 13px */
  --text-base: 0.875rem;   /* 14px */
  --text-md: 0.9375rem;    /* 15px - body default */
  --text-lg: 1rem;         /* 16px */
  --text-xl: 1.125rem;     /* 18px */
  --text-2xl: 1.25rem;     /* 20px */
  --text-3xl: 1.375rem;    /* 22px */
  --text-4xl: 1.5rem;      /* 24px */
  --text-5xl: 1.75rem;     /* 28px */
  --text-6xl: 2.25rem;     /* 36px */
  --text-7xl: 2.5rem;      /* 40px */

  /* ============================================================
   * Type -- weight scale (matches inventory: only 4 weights used)
   * ============================================================ */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* ============================================================
   * Radii (mirrors existing :root + adds pill alias)
   * --radius-xs added in Task 1.3 radius pass for the 8 recurring
   * 3px-radius call sites (kbd chips, mini badges, swatches, freshness
   * bars). Single-alias allowance per the migration task spec.
   * ============================================================ */
  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 9999px;
  --radius-circle: 50%;

  /* ============================================================
   * Shadows (mirrors existing tinted-shadow set; pure-black variants
   * used by knowledge_pulse.css are kept under --shadow-pulse-*).
   * ============================================================ */
  --shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.05);
  --shadow-sm: 0 1px 3px rgba(16, 24, 40, 0.06), 0 1px 2px rgba(16, 24, 40, 0.04);
  --shadow-md: 0 4px 8px -2px rgba(16, 24, 40, 0.06), 0 2px 4px -2px rgba(16, 24, 40, 0.04);
  --shadow-lg: 0 12px 24px -4px rgba(16, 24, 40, 0.08), 0 4px 8px -4px rgba(16, 24, 40, 0.04);
  --shadow-shell: 0 20px 40px rgba(15, 23, 32, 0.08);
  --shadow-focus-primary: 0 0 0 3px var(--primary-soft);
  --shadow-focus-danger: 0 0 0 2px var(--danger-soft);

  /* Knowledge Pulse-specific shadows (pure-black, deeper -- preserved as-is). */
  --shadow-pulse-orb: 0 8px 24px rgba(30, 64, 175, 0.35), 0 2px 6px rgba(0, 0, 0, 0.15);
  --shadow-pulse-orb-hover: 0 12px 28px rgba(30, 64, 175, 0.45), 0 2px 6px rgba(0, 0, 0, 0.2);
  --shadow-pulse-modal: 0 20px 48px rgba(0, 0, 0, 0.25);
  --shadow-pulse-toast: 0 8px 20px rgba(0, 0, 0, 0.2);

  /* ============================================================
   * Motion -- timing + easing.
   * Existing app exposes a single --duration: 0.2s + --ease cubic-bezier.
   * Spec asks for a 4-step timing scale; we add the scale alongside the
   * existing aliases so existing rules continue to work unchanged.
   * ============================================================ */
  --duration: 0.2s;                                    /* legacy alias, used by 18 transition decls */ /* @deprecated — prefer --motion-base in new rules */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);               /* legacy alias */ /* @deprecated — prefer --ease-out / --ease-in-out in new rules */
  --motion-snap: 80ms;
  --motion-quick: 120ms;       /* matches knowledge_pulse 120ms hover */
  --motion-base: 200ms;        /* matches existing --duration */
  --motion-deliberate: 250ms;
  --motion-leisure: 400ms;
  --motion-pulse: 2400ms;      /* matches existing 2.4s breathe animation */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* ============================================================
   * Z-index layers. Inventory contains z-index: 40 (nav), 9500 (orb),
   * 9600 (orb modal), 9700 (toast). We codify a layered scale here.
   * ============================================================ */
  --z-base: 1;
  --z-sticky: 10;
  --z-nav: 40;
  --z-overlay: 100;
  --z-palette: 1000;
  --z-toast: 1100;
  --z-modal: 1200;
  --z-popover: 1300;
  --z-pulse-orb: 9500;
  --z-pulse-modal: 9600;
  --z-pulse-toast: 9700;
}

/* Reduced-motion override -- collapses all motion tokens to instant.
 * Also zeroes any hardcoded animation/transition durations that didn't
 * migrate to tokens (e.g. 0.5s in style.css, 180ms in knowledge_pulse.css),
 * so the "every animation respects user preference" claim actually holds. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --duration: 0ms;
    --motion-snap: 0ms;
    --motion-quick: 0ms;
    --motion-base: 0ms;
    --motion-deliberate: 0ms;
    --motion-leisure: 0ms;
    --motion-pulse: 0ms;
  }

  *, ::before, ::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
