:root{
  /* ── COOL GRAY (light) — v2-OFF FALLBACK only ──────────
     This file is the LEGACY token surface. It only drives
     the cascade when the v2 feature flag is OFF (see
     index.html inline script + variables-v2.css :root[data-v2="1"]
     scoping). Under normal operation (v2 flag ON), every
     token below is overridden by variables-v2.css.

     Canonical brand identity is teal #298084 — see
     .impeccable.md (Aesthetic Direction → "Working interactive")
     and SCOUT-LIGHT-PLAN.md §1.5. The navy values below are
     the pre-2026-05-04 brand-realignment fallback, retained
     for v2-flag-fail safety only. Do NOT cite these as
     canonical; the v2 token system (variables-v2.css) is.

     Surfaces (v2-OFF): #F0F4F8 · #FFFFFF · #E8EDF2 · #E5E7EB · #D1D5DB
     Accent (v2-OFF):   #1E3A5F (legacy navy fallback)
     Text (v2-OFF):     #111827 · #4B5563 · #6B7280
  ────────────────────────────────────────────────────── */

  /* Accent — legacy navy fallback (v2-OFF only; canonical is teal #298084 in variables-v2.css --color-secondary) */
  --accent-rgb:30,58,95;
  --accent:#1E3A5F;
  --accent-hover:#2A4E7A;
  --accent-deep:#15294A;
  --accent-deep-rgb:21,41,74;
  --navy:#1E3A5F;
  --navy-light:#2A4E7A;
  --offer-green:#0A6B47;

  /* Surfaces — cool gray light */
  --bg:#F0F4F8;
  --s1:#FFFFFF;
  --s2:#E8EDF2;
  --s3:#E5E7EB;
  --s4:#D1D5DB;

  /* Borders */
  --border:rgba(0,0,0,.08);
  --border2:rgba(0,0,0,.14);

  /* Compat aliases removed Phase 8.1 — migrate consumers to canonical
     tokens. Aliases dropped: --gold(2,3) / --cta(2) / --teal / --amber /
     --cyan / --deep-teal / --charcoal / --light-gray / --mid-gray /
     --harbor-mist. Use var(--accent), var(--accent-hover), var(--accent-deep),
     var(--brand-og-accent), var(--color-amber), var(--s3), var(--dim) directly. */

  /* Status (base) */
  --red:#F87171;
  --blue:#60A5FA;
  --green:#0F9D6C;
  --purple:#A78BFA;
  --orange:#FBBF24;

  /* Semantic status colors — darkened for ≥4.5:1 on light surfaces */
  --color-money: #0A6B47;   --color-money-rgb:10,107,71;     /* money = green per 2026-05-05 user directive */
  --color-green:#0A6B47;    --color-green-rgb:10,107,71;     /* 4.8:1 on Raised */
  --color-red:#A31818;      --color-red-rgb:163,24,24;       /* 5.5:1 on Raised */
  /* Danger / Action — bright urgency tokens (Tailwind red-600 + green-500).
     Distinct from --color-red (status-red) and --color-money/-success. v2-OFF fallback
     for variables-v2.css --color-danger / --color-action. Track F.2 (2026-05-06). */
  --color-danger:#DC2626;   --color-danger-rgb:220,38,38;
  --color-action:#22C55E;   --color-action-rgb:34,197,94;
  --color-blue:#134473;     --color-blue-rgb:19,68,115;      /* 6.8:1 on Raised */
  --color-orange:#A8370A;   --color-orange-rgb:168,55,10;    /* 5.0:1 on Raised */
  /* --color-purple removed in R8 (P0-3 closure) — consumers migrated to --color-accent (brass) per .impeccable.md "brass speaks" rule. */
  --color-cyan:#0C6478;     --color-cyan-rgb:12,100,120;     /* 5.0:1 on Raised */
  /* Brand OG accent — matches OGLandman's wordmark color: the teal
     `--color-secondary` (oklch(0.55 0.08 200)) used on the "OG" of
     "OGLandman" in the live site's Navbar/Footer wordmark. Used in
     Scout's "Scout, by OGLandman" lockup across sidebar, auth card,
     splash screen, and header wordmark.
     Source of truth: oglandman-web/src/components/layout/Navbar.tsx
     ("OG" span) → globals.css `--color-secondary`.
     Realigned 2026-05-03 — was cyan #22D3EE; OGLandman's site retired
     cyan as the brand mark. See BRAND-REALIGNMENT-HANDOFF.md. */
  --brand-og-accent:#298084;
  --brand-og-accent-rgb:41,128,132;
  --brand-og-accent-hover:#006D6D;
  /* Brand brass — sidebar wordmark + chrome anchor accent (D3).
     OGLandman canon brass; oklch(0.72 0.12 80). Hits 6.91:1 AAA on
     the dark sidebar bg #13161a. Used on .sb-brand-name "Scout"
     and the brass-muted active-nav halo (per §6.3). */
  --brand-brass:#CC9C42;
  --brand-brass-rgb:204,156,66;
  --brand-brass-hover:#E0AD4D;
  --color-amber:#BA7517;    --color-amber-rgb:186,117,23;
  --color-amber-text:#7C4A0A; /* darkened for Raised bg */
  --color-teal:#34D399;
  --color-completed:#0D5A2B;
  --color-callback:#92400E; --color-callback-rgb:146,64,14;

  /* Owner status palette — distinct color per status, no duplicates.
     Colorblind-safe (blue-orange based). Verified ≥4.5:1 on light surfaces. */
  --color-new:#6B7280;
  --color-no-answer:#C2410C;
  --color-answered:#15803D;
  --color-callback-status:#1D4ED8;
  --color-under-neg:#7C3AED;
  --color-under-psa:#B45309;
  --color-skip:#9CA3AF;

  /* Call button (only orange element in app) */
  --color-call-btn:#B5500F;       /* darkened for 4.9:1 white text */
  --color-call-btn-hover:#9A4310;

  /* Surface transparency (light) */
  --glass:rgba(0,0,0,.04);
  --glass-hover:rgba(0,0,0,.08);
  --glass-strong:rgba(0,0,0,.12);
  --overlay-bg:rgba(0,0,0,.4);

  /* Fallbacks */
  --placeholder:#5A5F5F;
  --user-dot:#94A3B8;

  /* SVG ring track (visible gray on white bg) */
  --ring-track:#D1D5DB;

  /* Text — extra roles */
  --text-on-dark:#dee2e6;  /* always light — for dark sidebar/header */

  /* Canonical text aliases (Phase 8.1 — back-fill for inline-style
     consumers that reference --text-primary/secondary/tertiary names) */
  --text-primary:#111827;
  --text-secondary:#4B5563;
  --text-tertiary:#5A5F5F;

  /* Canonical surface aliases */
  --surface-1:#FFFFFF;
  --surface-2:#E8EDF2;
  --surface-3:#E5E7EB;
  --surface-raised:#FFFFFF;
  --border-default:rgba(0,0,0,.08);

  /* Status surface tints (for danger zones, warning banners) */
  --color-red-bg:rgba(163,24,24,.08);
  --color-red-text:#7E1313;
  --color-amber-bg:rgba(186,117,23,.10);
  --color-amber-rgb:186,117,23;
  --color-no-answer-rgb:194,65,12;

  /* Typography */
  --text:#111827;
  --muted:#4B5563;
  --dim:#5A5F5F;

  /* Spacing (8px grid) */
  --sp-1:4px;  --sp-2:8px;  --sp-3:12px;
  --sp-4:16px; --sp-6:24px; --sp-8:32px;

  /* Border Radius */
  --r-sm:6px;  --r-md:8px;  --r-lg:12px;
  --r-xl:16px; --r-full:9999px;

  /* Shadows — soft on light */
  --shadow-sm:0 1px 2px rgba(0,0,0,.06);
  --shadow-md:0 4px 12px rgba(0,0,0,.08);
  --shadow-lg:0 8px 24px rgba(0,0,0,.12);
  /* Overlay tier — modals, popovers, drawers (.impeccable.md D8 — overlay-only elevation; cards stay flat).
     v2-OFF fallback for variables-v2.css:144 `--shadow-overlay: 0 16px 48px oklch(0.20 0.010 200 / 0.18)`. */
  --shadow-overlay:0 16px 48px rgba(0,0,0,.18);

  /* Transitions */
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-out-quart:cubic-bezier(.25,1,.5,1);  /* canonical entrance ease (replaces --ease-bounce) */
  --dur-fast:.15s;
  --dur-med:.25s;

  /* Z-index layers — centralized stacking order */
  --z-base:0;
  --z-sticky:2;
  --z-dropdown:100;
  --z-header:300;
  --z-sidebar-toggle:400;
  --z-assistant:450;
  --z-overlay:500;
  --z-profile:600;
  --z-search:700;
  --z-modal:900;
  --z-toast:950;
  --z-auth:1000;
}

/* WCAG 2.3.3: Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* WCAG forced-colors mode (Windows high-contrast) — let system colors
   carry button affordance; outline focus rings remain visible. */
@media (forced-colors: active) {
  .btn,
  .btn-primary,
  .btn-confirm,
  .btn-destructive,
  .btn-ghost {
    border: 1px solid CanvasText;
  }
  .btn:focus-visible,
  .input:focus-visible,
  a:focus-visible,
  button:focus-visible {
    outline: 2px solid Highlight;
    outline-offset: 2px;
  }
}
*{margin:0;padding:0;box-sizing:border-box;}
html{font-size:14px;scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:'Geist Sans',system-ui,sans-serif;min-height:100vh;overflow-x:hidden;}