/* Shared design tokens for every TechDrift surface (app, legal pages, story pages). */
:root{
  color-scheme:dark;
  --bg:#0b1118;--surface:#121b25;--raised:#202c38;--fg:#e8eef5;--muted:#b2bfcc;
  --accent:#72d5c5;--accent-strong:#b5f2e8;--border:#3a4b5a;--pill:#16443f;--pill-text:#b5f2e8;
  --danger:#542e35;--danger-text:#ffdad9;--up:#63d7a0;--down:#ff7d84;--warm:#ffca80;
  --glow:color-mix(in srgb,var(--accent) 13%,transparent);
  --hairline:color-mix(in srgb,var(--border) 42%,transparent);
}
/* Pages with no theme-sync script (cross-origin from the app, e.g. the landing page)
   fall back to the OS preference. Pages that set data-theme explicitly always win
   below, since that rule is more specific than this media-gated one. */
@media(prefers-color-scheme:light){
  :root:not([data-theme]){
    color-scheme:light;
    --bg:#f3f6f7;--surface:#fff;--raised:#e6ecef;--fg:#17212b;--muted:#4b5a66;
    --accent:#176b61;--accent-strong:#0c3731;--border:#9baab4;--pill:#d0f1ea;--pill-text:#0c3731;
    --danger:#ffdad9;--danger-text:#410e12;--up:#0f6b45;--down:#b3261e;--warm:#a15c00;
    --glow:color-mix(in srgb,var(--accent) 9%,transparent);
    --hairline:color-mix(in srgb,var(--border) 50%,transparent);
  }
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f3f6f7;--surface:#fff;--raised:#e6ecef;--fg:#17212b;--muted:#4b5a66;
  --accent:#176b61;--accent-strong:#0c3731;--border:#9baab4;--pill:#d0f1ea;--pill-text:#0c3731;
  --danger:#ffdad9;--danger-text:#410e12;--up:#0f6b45;--down:#b3261e;--warm:#a15c00;
  --glow:color-mix(in srgb,var(--accent) 9%,transparent);
  --hairline:color-mix(in srgb,var(--border) 50%,transparent);
}
