/* Shyne color tokens — single source of truth.
   Mirrored byte-identical: apps/app/src/theme.css ⇄ apps/www-v1/src/react-app/theme.css (CI-checked).
   Raw hex lives only here; each app consumes thin aliases (--ui-* / --bg, --gold, …). */
:root {
  --_bg:#171a19; --_canvas:#1c1f1e; --_surface:#292c2b; --_surface2:#333635; --_surface3:#141716;
  --_hover:#303332; --_line:#3d403f; --_line-soft:#242726;
  --_hair:rgba(230,240,232,.075); --_hair2:rgba(230,240,232,.14);

  --_ink:#eef3ec; --_ink-strong:#f4f8f2; --_ink2:#b9c7bd; --_muted:#869489; --_faint:#61706a;

  --_green:#3f9c76; --_green2:#58b78d; --_green-soft:rgba(63,156,118,.18); --_accent-ink:#6fca9f;
  --_green-deep:#123526;
  --_gold:#e6b85a; --_gold2:#cf9f3f; --_gold-soft:rgba(230,184,90,.16);
  /* THE MARK — see packages/brand/theme.css for the contract. --_mark-gold inks the whole lockup,
     pinwheel and word, and darkens in light mode to stay legible on white. --_mark-plate /
     --_mark-on-plate are the APP ICON only (favicon.svg, .icns) and never flip; chrome shows the
     pinwheel with no plate. */
  --_mark-gold:#e2b256; --_mark-plate:#153b2b; --_mark-on-plate:#e2b256;
  --_on-brand:#0b1410;

  --_red:#f2555f; --_blue:#6ea8e0; --_blue-soft:rgba(110,168,224,.16); --_blue-ink:#8fc0ee;
  --_coral:#e0876a; --_violet:#9b8cff;
  --_success:#46b985; --_warning:#eaa13e;

  --_shadow:0 14px 44px rgba(0,0,0,.5), 0 2px 10px rgba(0,0,0,.4);

  --success:var(--_success); --danger:var(--_red); --warning:var(--_warning); --info:var(--_blue);
  --info-soft:var(--_blue-soft); --info-ink:var(--_blue-ink);
  --c-green:var(--_green); --c-gold:var(--_gold); --c-coral:var(--_coral);
  --c-blue:var(--_blue); --c-violet:var(--_violet);

  --bg:var(--_canvas); --bg-2:var(--_bg); --surface:var(--_surface); --surface-2:var(--_surface2);
  --line:var(--_hair); --line-2:var(--_hair2);
  --text:var(--_ink); --text-2:var(--_ink2); --text-3:var(--_muted);
  --gold:var(--_gold); --gold-2:var(--_gold2); --green:var(--_green); --green-2:var(--_green2);
  --green-deep:var(--_green-deep); --on-brand:var(--_on-brand);
  --brand-gold:var(--_mark-gold); --brand-plate:var(--_mark-plate); --brand-plate-ink:var(--_mark-on-plate);
  --coral:var(--_coral); --blue:var(--_blue);

  --ui-bg:var(--_canvas); --ui-workspace:var(--_bg);
  --ui-surface:var(--_surface); --ui-surface-2:var(--_surface2); --ui-surface-3:var(--_surface3);
  --ui-hover:var(--_hover); --ui-line:var(--_line); --ui-line-soft:var(--_line-soft);
  --ui-ink:var(--_ink); --ui-ink-2:var(--_ink2); --ui-fg:var(--_ink-strong); --ui-muted:var(--_muted); --ui-muted-2:var(--_faint);
  --ui-accent:var(--_green); --ui-accent-soft:var(--_green-soft); --ui-accent-ink:var(--_accent-ink); --ui-on-accent:var(--_on-brand);
  --ui-ok:var(--_success); --ui-danger:var(--_red); --ui-warn:var(--_warning); --ui-key:var(--_gold);
  --ui-shadow:var(--_shadow);
}

:root[data-theme="light"] {
  --_bg:#fafcfa; --_canvas:#f4f6f4; --_surface:#ffffff; --_surface2:#f2f4f2; --_surface3:#ecefed;
  --_hover:#eef1ef; --_line:#e4e8e5; --_line-soft:#eef1ee;
  --_hair:rgba(20,34,26,.09); --_hair2:rgba(20,34,26,.15);

  --_ink:#12211b; --_ink-strong:#0c1a13; --_ink2:#384942; --_muted:#6d7d72; --_faint:#9aa69c;

  --_green:#2f7a58; --_green2:#256b4c; --_green-soft:#e3efe7; --_accent-ink:#256b4c;
  --_gold:#a9781f; --_gold2:#8f6417; --_gold-soft:rgba(169,120,31,.14);
  --_mark-gold:#8a6420; --_mark-plate:#153b2b; --_mark-on-plate:#e2b256;
  --_on-brand:#ffffff;

  --_red:#d1503b; --_blue:#4f88c4; --_blue-soft:#e7f0f9; --_blue-ink:#3f74ad;
  --_coral:#cf6f52; --_violet:#7a6be0;
  --_success:#2e9e60; --_warning:#b9721c;

  --_shadow:0 10px 34px rgba(24,34,26,.12), 0 2px 8px rgba(24,34,26,.06);
}
