/* Design tokens: color, type, spacing. Light is default; dark via [data-theme=dark] or OS. */
:root{
  color-scheme:light;
  --font-display:'Fraunces',ui-serif,Georgia,serif;
  --font-serif:'Source Serif 4',ui-serif,Georgia,serif;
  --font-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --font-body:'Source Sans 3',ui-sans-serif,-apple-system,sans-serif;

  --bg:#faf7f1;
  --bg-raised:#ffffff;
  --bg-sunken:#f0ebe0;
  --surface-1:#ffffff;
  --surface-2:#f2ede2;
  --border:#ddd4c1;
  --border-strong:#b8ac91;
  --text-primary:#1c1912;
  --text-secondary:#5b5442;
  --text-muted:#756d58;
  --accent:#b3541e;
  --accent-ink:#7a3812;
  --accent-soft:#f1ddc9;
  --link:#1c5cab;

  --series-1:#2a78d6;
  --series-2:#eb6834;
  --series-3:#1baf7a;
  --series-4:#eda100;
  --series-5:#e87ba4;
  --series-6:#008300;
  --series-7:#4a3aa7;
  --series-8:#e34948;

  --status-good:#0ca30c;
  --status-warning:#fab219;
  --status-serious:#ec835a;
  --status-critical:#d03b3b;
  --status-neutral:#8a8168;
  /* High-contrast "ink" text pairing for each status when set on its own
     pale tint background (badges, tags, pills). Light mode needs darker,
     more saturated ink than the raw status hue; dark mode text can use the
     status hue itself (already >=3:1 on the dark surface). */
  --status-good-ink:#146214;
  --status-warning-ink:#7a4a00;
  --status-serious-ink:#9c3a1a;
  --status-critical-ink:#a11f1f;
  --status-neutral-ink:#5b5442;
  --status-good-bg:#e0f5e0;
  --status-warning-bg:#fef0cd;
  --status-serious-bg:#fbe0d4;
  --status-critical-bg:#f9d9d9;
  --status-neutral-bg:#eee8d9;

  --shadow-1:0 1px 2px rgba(28,25,18,.08),0 1px 1px rgba(28,25,18,.06);
  --shadow-2:0 8px 24px rgba(28,25,18,.16),0 2px 8px rgba(28,25,18,.10);
  --shadow-3:0 24px 64px rgba(28,25,18,.28),0 8px 24px rgba(28,25,18,.16);

  --radius-s:6px;
  --radius-m:10px;
  --radius-l:16px;
  --nav-h:64px;
  --content-w:920px;
  --wide-w:1180px;
}

@media (prefers-color-scheme:dark){
  :root:where(:not([data-theme="light"])){
    color-scheme:dark;
    --bg:#15140f;
    --bg-raised:#1c1a14;
    --bg-sunken:#0f0e0a;
    --surface-1:#1e1c16;
    --surface-2:#26231b;
    --border:#3a3527;
    --border-strong:#544c37;
    --text-primary:#f3efe3;
    --text-secondary:#c7bea6;
    --text-muted:#8f866c;
    --accent:#e8925a;
    --accent-ink:#f6b585;
    --accent-soft:#3a2716;
    --link:#7db3f0;

    --series-1:#3987e5;
    --series-2:#d95926;
    --series-3:#199e70;
    --series-4:#c98500;
    --series-5:#d55181;
    --series-6:#2fae2f;
    --series-7:#9085e9;
    --series-8:#e66767;

    --status-good:#2fae2f;
    --status-warning:#fab219;
    --status-serious:#ec835a;
    --status-critical:#e66767;
    --status-neutral:#a89c7c;

    --status-good-ink:#5fdc5f;
    --status-warning-ink:#fab219;
    --status-serious-ink:#ffab85;
    --status-critical-ink:#ff9d9d;
    --status-neutral-ink:#c7bea6;
    --status-good-bg:rgba(47,174,47,.18);
    --status-warning-bg:rgba(250,178,25,.18);
    --status-serious-bg:rgba(236,131,90,.18);
    --status-critical-bg:rgba(230,103,103,.2);
    --status-neutral-bg:#26231b;

    --shadow-1:0 1px 2px rgba(0,0,0,.4);
    --shadow-2:0 8px 24px rgba(0,0,0,.5);
    --shadow-3:0 24px 64px rgba(0,0,0,.6);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#15140f;
  --bg-raised:#1c1a14;
  --bg-sunken:#0f0e0a;
  --surface-1:#1e1c16;
  --surface-2:#26231b;
  --border:#3a3527;
  --border-strong:#544c37;
  --text-primary:#f3efe3;
  --text-secondary:#c7bea6;
  --text-muted:#8f866c;
  --accent:#e8925a;
  --accent-ink:#f6b585;
  --accent-soft:#3a2716;
  --link:#7db3f0;

  --series-1:#3987e5;
  --series-2:#d95926;
  --series-3:#199e70;
  --series-4:#c98500;
  --series-5:#d55181;
  --series-6:#2fae2f;
  --series-7:#9085e9;
  --series-8:#e66767;

  --status-good:#2fae2f;
  --status-warning:#fab219;
  --status-serious:#ec835a;
  --status-critical:#e66767;
  --status-neutral:#a89c7c;

  --status-good-ink:#5fdc5f;
  --status-warning-ink:#fab219;
  --status-serious-ink:#ffab85;
  --status-critical-ink:#ff9d9d;
  --status-neutral-ink:#c7bea6;
  --status-good-bg:rgba(47,174,47,.18);
  --status-warning-bg:rgba(250,178,25,.18);
  --status-serious-bg:rgba(236,131,90,.18);
  --status-critical-bg:rgba(230,103,103,.2);
  --status-neutral-bg:#26231b;

  --shadow-1:0 1px 2px rgba(0,0,0,.4);
  --shadow-2:0 8px 24px rgba(0,0,0,.5);
  --shadow-3:0 24px 64px rgba(0,0,0,.6);
}
