/* ============================================================================
   DailyHub — canonical design tokens
   The single source of truth for design values. See DESIGN_SYSTEM.md for the
   law and DESIGN_DECISIONS.md for why this architecture exists.

   NAMESPACE RULES
   - --dh-*        may be DEFINED in this file only. Anything else defining a
                   --dh-* variable is a bug.
   - --dh-legacy-* frozen compatibility tokens: existing consumers only,
                   NEVER add new ones. They converge onto canonical tokens in
                   Step 3 and then get deleted.
   - --dh-mk-*     the marketing surface group (landing/privacy) — a sanctioned
                   separate identity pending a product decision; not legacy.
   - --app-*       runtime/layout/state variables (JS-mutated, measured, or
                   transient) live OUTSIDE this file under --app-*. Grandfathered
                   pre-existing runtime names (do not rename, do not imitate):
                   --pulse, --pulse-glow, --ws-dock-w, --mb-hdr-h, --pb-*.

   EDITING RULES
   - New code references canonical --dh-* names directly.
   - Every page keeps its historical names (--bg, --green, …) as thin aliases
     onto these tokens, each with a literal fallback equal to the value at
     extraction day — so a failed load of this file degrades to today's exact
     appearance instead of losing all styling.
   - Never change a value here to "improve" a screen — that is a design change
     and belongs to a later phase with its own approval.
   ============================================================================ */

/* ═══════════════════════════════════════════════════════════════════════════
   CANONICAL — the DailyHub design language (DESIGN_SYSTEM.md §3–§7)
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  /* ---- Canvas & surfaces (the app ladder: bg → surface → surface-2) ---- */
  --dh-bg: #0E0F12;
  --dh-surface: #16181D;          /* elevated card surface */
  --dh-surface-2: #1C1F26;        /* raised surface */
  --dh-card-glass: linear-gradient(135deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,.018) 100%);
  --dh-card-solid: #16181D;
  --dh-shadow-card: 0 10px 32px rgba(0,0,0,.55), 0 3px 10px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);

  /* ---- Text ---- */
  --dh-text: #E6E8EB;
  --dh-text-secondary: #8E8E93;   /* canonical iOS secondary — a raw literal 38× today; consumers arrive in Step 3 */

  /* ---- Semantic set (iOS system palette) ---- */
  --dh-accent: #BF5AF2;           /* THE brand accent (purple) */
  --dh-positive: #30D158;         /* gains, live, active */
  --dh-negative: #FF453A;         /* losses, alerts, destructive */
  --dh-link: #0A84FF;             /* links, saves, info */

  /* ---- Brand signatures ---- */
  --dh-acid: #B0FF00;             /* signature acid green — sparingly, it's a signature not a workhorse */
  --dh-gold: #f59e0b;
  --dh-gold-anchor: #F5A623;      /* pairs the gold-star Lottie loader with Save controls (alpha helpers below
                                     are pre-computed — no color-mix, for WKWebView) */
  --dh-gold-soft: #FFDCA6;        /* light gold for label text (contrast on dark) */
  --dh-gold-line: rgba(245,166,35,.5);
  --dh-gold-fill-a: rgba(245,166,35,.18);
  --dh-gold-fill-b: rgba(245,166,35,.07);
  --dh-gold-glow: rgba(245,166,35,.16);
  --dh-pink: #f472b6;
  --dh-cyan: #38bdf8;

  /* ---- Pulse defaults (DailyHub Pulse — market-sentiment ambient).
          The Pulse engine mutates --pulse/--pulse-glow on :root at runtime;
          these are only the pre-data defaults. The @property registrations
          live in index.html and must keep literal initial-values. ---- */
  --dh-pulse-default: #f59e0b;
  --dh-pulse-glow-default: rgba(245,158,11,.12);

  /* ---- Motion (documented scale — no consumers yet; existing CSS keeps
          literal curves until Step 3) ---- */
  --dh-ease: cubic-bezier(.32,.72,0,1);        /* the signature slide/dock curve */
  --dh-ease-pop: cubic-bezier(.34,1.56,.64,1); /* overshoot pops (buttons, likes) */
  --dh-dur-micro: .1s;
  --dh-dur-state: .2s;
  --dh-dur-sheet: .3s;
  --dh-dur-dock: .38s;                         /* docked overlays */
  --dh-dur-pane: .44s;                         /* drawer panes */
  /* Mobile panel push (Codex motion study rev.2, 2026-07-12): slower, heavier
     surface — deliberate open, slightly more direct close; one easing family
     for surface + depth, including the left→right context handoff. */
  --dh-ease-panel: cubic-bezier(.22, .68, .12, 1);
  --dh-dur-panel-open: .42s;
  --dh-dur-panel-close: .36s;

  /* ---- Radii (documented scale — no consumers yet; the long tail of odd
          values in index.html is debt for Step 3, not a target to "fix") ---- */
  --dh-radius-control: 12px;
  --dh-radius-tile: 14px;
  --dh-radius-card: 16px;
  --dh-radius-pill: 999px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   MARKETING — landing.html + privacy.html surface group (--dh-mk-*)
   A deliberately distinct identity; whether it converges on the app palette
   is an open product decision (DESIGN_SYSTEM.md §11, DESIGN_DECISIONS.md DD-7). Not legacy.
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  --dh-mk-bg: #0A0B0D;
  --dh-mk-card: #14171C;
  --dh-mk-border: rgba(255,255,255,0.06);
  --dh-mk-border-strong: rgba(255,255,255,.08);   /* privacy.html uses the stronger line */
  --dh-mk-green: #00FF9F;
  --dh-mk-orange: #FF8C42;
  --dh-mk-muted: #9AA3B2;
  --dh-mk-white: #F5F7FA;
  --dh-mk-text: #E8EBF0;
  --dh-mk-cta-grad: linear-gradient(180deg,#4ae285,#22c55e);  /* solid brand green CTA (was a green→orange sweep) */
}

/* ═══════════════════════════════════════════════════════════════════════════
   LEGACY — FROZEN (--dh-legacy-*)
   Pre-canon values still consumed via page aliases. NO NEW CONSUMERS.
   Each converges onto a canonical token in Step 3 (pending the palette
   ruling), then gets deleted here.
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  --dh-legacy-green: #34d399;     /* Tailwind green  → --dh-positive */
  --dh-legacy-red: #f87171;       /* Tailwind red    → --dh-negative */
  --dh-legacy-indigo: #818cf8;    /* Tailwind indigo → --dh-accent */
  --dh-legacy-muted: #9AA0A6;     /* historical --muted → --dh-text-secondary */
  --dh-legacy-orange: #FF7A00;    /* defined for years, zero consumers found; delete after a Step 3 sweep */
  --dh-legacy-card-border: rgba(255,255,255,.06);  /* a few old chips only; prefer no hard borders */

  /* Library page (projects.html — still in the sw.js shell precache).
     Near-miss duplicates of the app ladder; frozen until the page's fate is decided. */
  --dh-legacy-lib-bg: #0a0a0f;
  --dh-legacy-lib-card-glass: linear-gradient(135deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.01) 100%);
  --dh-legacy-lib-shadow: 0 8px 32px rgba(0,0,0,.4), 0 2px 8px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.05);
  --dh-legacy-lib-text: #f4f4f6;
  --dh-legacy-lib-muted: #9b9ba6;
}