/* ============================================================================
   Clearline visual reset - design tokens (single source for the whole site)
   #73 (Track B skin) + the "Refinements locked 2026-06-05" reference build
   (clearline-marketing/mockups/visual-reset-reference/app.css). Richard approved
   the claude.ai-style design site-wide 2026-06-05.

   Canonical-source note: FOUNDATION LOCKED 2026-06-07 (Richard). These are the
   single source of truth, proposed to clearline-design#6 (UX to publish tokens/).
   The four SPAs consume the SAME tokens in Phase 1 (Compass first), GATED on that
   publish - see clearline-platform/docs/handoffs/2026-06-07-spa-skin-alignment-phase-0.md.
   So: NO page-local colour/font literals: every page references these vars.
   AA-reconcile (2026-06-07): --ink-muted darkened to #5F6470 (5.5:1) + --success
   #00735A added: the two AA-verified accents from the #73 finale.
   When clearline-design publishes tokens/, re-sync to it (it wins).
   ============================================================================ */
:root {
  /* Type: Fraunces (display, H1/H2 only) + Inter (body/UI) + JetBrains Mono (eyebrows/Connect IDs) */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body: 'Inter', -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', Consolas, monospace;

  /* Canvas: warm paper, white surfaces, hairline borders */
  --paper: #FAF9F5;
  --surface: #FFFFFF;
  --hairline: #E8E5DC;
  --panel: #F2EFE7;        /* quiet panel fill (e.g. /start/ right pane) */

  /* Ink */
  --ink: #0A0E1A;
  --ink-secondary: #3D3D38;
  --ink-muted: #5F6470;    /* AA-verified 5.5:1 on --paper (reconciled 2026-06-07 from #6B6A64). */

  /* Action: navy is THE action colour (filled buttons + text links). --dark = nav "Start free" pill. */
  --action: #142774;
  --action-text: #FFFFFF;
  --dark: #14110E;

  /* Coral: ratified exception to the navy-only action rule. LOCKED #B5532F (Richard,
     2026-06-05); supersedes the mockup's #C15F3C (failed the contrast gate at ~4.2:1 white-on-
     coral). #B5532F passes at 4.95:1, no perceptible visual change. SCOPE: signup-box button,
     /start/ "Continue", and the sub-nav countdown dot ONLY: navy stays the action colour
     everywhere else; Compass identity coral #C47A5A is NEVER used for buttons. */
  --cta-coral: #B5532F;
  --cta-coral-hover: #A84B2A;   /* hover/press: 5.67:1 white-on-coral */

  /* Warning chip (pre-1-July countdown) */
  --chip-warn-bg: #FAEEDA;
  --chip-warn-text: #854F0B;

  /* Status: AA-verified positive (reconciled 2026-06-07; supersedes the old #00A888 ~3:1). */
  --success: #00735A;      /* ~5.8:1 on --paper: on-track / fundable / saved states */

  /* App identity: primary + centre-dot. Scrive = ink/amber, Pilot = violet (ratified 2026-06-04). */
  --aura: #142774;     --aura-dot: #00D9C0;
  --compass: #2C4A3E;  --compass-dot: #C47A5A;
  --scrive: #0F1B3D;   --scrive-dot: #D4A645;
  --pilot: #475569;    --pilot-dot: #7F77DD;

  /* Consolidated scale tokens (Clearline Next unified scales) */
  --cl-text-xs: 11px;
  --cl-text-sm: 12px;
  --cl-text-base: 14px;
  --cl-text-md: 15px;
  --cl-text-lg: 16px;
  --cl-text-xl: 18px;
  --cl-text-2xl: 22px;
  --cl-text-3xl: 28px;

  --cl-radius-xs: 4px;
  --cl-radius-sm: 6px;
  --cl-radius: 8px;
  --cl-radius-lg: 12px;
  --cl-radius-xl: 16px;
  --cl-radius-pill: 9999px;

  --cl-shadow-sm: 0 1px 2px rgb(17 24 39 / 6%);
  --cl-shadow-md: 0 4px 12px rgb(17 24 39 / 8%);
  --cl-shadow-lg: 0 12px 32px rgb(17 24 39 / 12%);
  --cl-shadow-xl: 0 20px 48px rgb(17 24 39 / 18%);
  --cl-shadow: 0 18px 50px rgb(17 24 39 / 18%);

  --cl-accent: var(--action);
  --cl-focus-ring: 2px solid var(--cl-accent);
  --cl-focus-offset: 2px;

  /* Radius aliases (backwards compatible) */
  --radius: var(--cl-radius, 8px);
  --radius-lg: var(--cl-radius-lg, 12px);
  --radius-pill: var(--cl-radius-pill, 9999px);

  /* Type scale (reference: apply in the shell/components CSS, not as page literals)
     H1 44/40/34 (desktop/tablet/mobile) Fraunces 500, lh 1.15, letter-spacing -0.5px
     H2 30 Fraunces 500 | H3 19 Inter 500 | body 17 Inter 400 lh 1.6 | small 13.5 | micro 12
     Hero H1 scales up to 68 desktop (reference). Spacing on an 8px rhythm. Sentence case only. */
}

/* Universal accessible focus rings (WCAG 2.4.7 + WCAG 1.4.11) */
:focus-visible,
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--cl-accent, var(--action, #142774));
  outline-offset: 2px;
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}