/* =========================================================================
   tokens.css — re-copied 2026-08-10 from /srv/mycedhcoach/app/src/styles/tokens.css
   --------------------------------------------------------------------------
   Design tokens for the marketing landing at /var/www/landing/.
   If app tokens change, re-copy this file to keep palette parity.

   HISTORY: the previous copy was taken 2026-04-25 and froze this page on the
   retired `--cedh-*` teal ramp (--accent #01CFBD on --bg-dark #080C1C). The app
   moved to the Duke system on 2026-07-13, so for ~3 months the public marketing
   site advertised a product that no longer looked like this. The `--cedh-*`
   aliases are gone — nothing outside this file ever consumed them (the only
   remaining references are documentation lines in the brand-export README).

   COLOR ONLY. The three --font-* tokens at the bottom are deliberately NOT
   synced to the app; see the note in that block.

   Rules (see UI_DESIGN_SYSTEM.md §2.4):
   - Do not hardcode colors in landing.css — always use these tokens.
   - --mana-* is intentionally absent: MTG color identity has no place on a
     marketing page, and omitting it prevents accidental use as UI chrome.
   ========================================================================= */

/* ---------- DARK (default) ---------- */
:root,
:root[data-theme="dark"] {
  /* Surfaces — Duke dark ramp, ascending lightness */
  --bg-dark:        #04060C;   /* base canvas */
  --bg-surface:     #0C1120;   /* band */
  --bg-card:        #111726;   /* raised surface */
  --bg-hover:       #151C2C;   /* inset / hover */

  /* Text — readability floor is #8A99A9; never declare a dimmer text token */
  --text-primary:   #E2E6ED;   /* Hatteras */
  --text-secondary: #C9D6E4;
  --text-muted:     #9FB0C1;

  /* Primary accent — Duke Royal. The ONLY UI accent in dark mode. */
  --accent:         #00539B;
  --accent-strong:  #0563B8;   /* hover */
  --accent-soft:    rgba(0, 83, 155, 0.13);
  --accent-border:  rgba(0, 83, 155, 0.32);
  /* Royal is too dark to read as text on the near-black canvas. This is the
     readable azure the Duke spec calls `--ac-soft` — use it for links, mono
     kickers, and any accent-colored text. Never as a fill. */
  --accent-azure:   #4F9FDD;
  --accent-ink:     #FFFFFF;   /* text ON an accent fill (both themes) */

  /* Secondary accent — red */
  --sec:            #b84a4a;
  --sec-soft:       rgba(184, 74, 74, 0.14);
  --sec-border:     rgba(184, 74, 74, 0.32);

  /* Category accent — Duke Ironweed. On this page it carries the "Research"
     module group and the interoperability callouts. This is a CATEGORY accent
     from the Duke tertiary set, NOT the MTG black-mana purple. */
  --accent-purple:        #993399;   /* Ironweed */
  --accent-purple-strong: #b23fb2;
  --accent-purple-soft:   rgba(153, 51, 153, 0.13);
  --accent-purple-border: rgba(153, 51, 153, 0.32);

  /* System state */
  --warn:           #d4a14a;
  --warn-soft:      rgba(212, 161, 74, 0.14);
  --danger:         #b84a4a;
  --danger-soft:    rgba(184, 74, 74, 0.14);

  /* Structure — Duke hairlines. Min .16 alpha on outlines/panels so they stay
     identifiable against the near-black navy. */
  --border:         rgba(150, 175, 205, 0.16);
  --border-strong:  rgba(150, 175, 205, 0.28);
}

/* ---------- LIGHT (derived, darker accents for contrast) ---------- */
:root[data-theme="light"] {
  --bg-dark:        #F3F2F1;   /* Whisper Gray */
  --bg-surface:     #FFFFFF;
  --bg-card:        #FFFFFF;
  --bg-hover:       #E5E5E5;   /* Limestone */

  --text-primary:   #1C2333;   /* near-black navy */
  --text-secondary: #4C5D72;
  --text-muted:     #4C5D72;

  /* Primary accent — Duke Navy. The ONLY UI accent in light mode. */
  --accent:         #012169;
  --accent-strong:  #00539B;   /* hover — Royal */
  --accent-soft:    rgba(1, 33, 105, 0.08);
  --accent-border:  rgba(1, 33, 105, 0.32);
  /* Navy is legible as text on Whisper Gray, so the readable variant steps UP
     to Royal rather than down to azure (see dark block). */
  --accent-azure:   #00539B;
  --accent-ink:     #FFFFFF;

  --sec:            #a03f3f;
  --sec-soft:       rgba(160, 63, 63, 0.08);
  --sec-border:     rgba(160, 63, 63, 0.28);

  --accent-purple:        #7a2980;   /* Ironweed, darkened */
  --accent-purple-strong: #5f1f64;
  --accent-purple-soft:   rgba(122, 41, 128, 0.08);
  --accent-purple-border: rgba(122, 41, 128, 0.32);

  --warn:           #b07820;
  --warn-soft:      rgba(176, 120, 32, 0.09);
  --danger:         #a03f3f;
  --danger-soft:    rgba(160, 63, 63, 0.08);

  /* Structure — Duke light hairline */
  --border:         rgba(40, 64, 110, 0.16);
  --border-strong:  rgba(40, 64, 110, 0.28);
}

/* ---------- Duke tertiary / extended palette ----------
   Theme-independent brand constants, mirrored from the app's tokens.css, which
   mirrors the design system's `templates/_theme/duke-palette.css`. For category
   accents, icons, and object fills ONLY — these are NEVER the UI accent, which
   is always --accent (Royal in dark, Navy in light).
   ------------------------------------------------------------------------ */
:root {
  --duke-copper:      #C84E00;
  --duke-persimmon:   #E89923;
  --duke-dandelion:   #FFD960;
  --duke-piedmont:    #A1B70D;
  --duke-eno:         #339898;
  --duke-magnolia:    #1D6363;
  --duke-prussian:    #005587;
  --duke-shale:       #0577B1;
  --duke-ironweed:    #993399;
  --duke-hatteras:    #E2E6ED;
  --duke-whisper:     #F3F2F1;
  --duke-gingerbeer:  #FCF7E5;
  --duke-dogwood:     #988675;
  --duke-shackleford: #DAD0C6;
  --duke-castiron:    #262626;
  --duke-graphite:    #666666;
  --duke-granite:     #B5B5B5;
  --duke-limestone:   #E5E5E5;
}

/* ---------- Typography — LANDING-LOCAL, deliberately NOT synced ----------
   The app declares its own font tokens in app/src/index.css (currently Playfair
   Display / Open Sans / Roboto Mono) — NOT in tokens.css, so a mechanical
   re-copy of the palette never carried them here.

   The landing keeps Cinzel / Inter / JetBrains Mono because those are the faces
   its own @font-face blocks in landing.css declare and preload. All six of the
   app's newer variable faces ARE present under the shared /fonts/ mount
   (PlayfairDisplay-var, OpenSans-var, RobotoMono-var all serve 200), so a
   typography sync is mechanically possible — but it restyles every heading on
   the public marketing page, which is a design decision, not a parity fix.
   Deferred to an explicit call. If it is taken, landing.css's @font-face blocks
   must change in the same edit or the page falls back to Georgia/system.
   ------------------------------------------------------------------------ */
:root {
  --font-display:   "Cinzel", serif;
  --font-body:      "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:      "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;
}