/* ShowMe brand tokens.
   Doctrine: Look here. --accent === --live (the USB kitchen is live).
   Scarce: mark pip, primary action, live pill only.
   Palette: html[data-palette="paper"|"ink"|"system"]. Default ink. */

@font-face {
  font-family: 'Space Grotesk';
  src: url('/fonts/SpaceGrotesk-latin.woff2') format('woff2');
  font-weight: 300 700;
  font-display: swap;
}

:root {
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --sans: 'Space Grotesk', -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --radius: 6px;
  --panel-side-min: 360px;
  --panel-side-comfort: 420px;
}

/* —— Ink (product night — default) —— */
:root,
html[data-palette="ink"] {
  color-scheme: dark;
  --bg: #101211;
  --surface: #171918;
  --raised: #1e211f;
  --ink: #e6eee9;
  --ink-soft: #7a8a82;
  --ink-mid: #b4c2ba;
  --line: #2a302c;
  --accent: #10b981;
  --accent-ink: #052e1a;
  --brand: var(--accent);
  --brand-ink: var(--accent-ink);
  --unseen: #fbbf24;
  --unseen-ink: #3a2a00;
  --stop: #ef4444;
  --stop-ink: #ffffff;
  --ship-inflight: #10b981;
  --ship-inflight-ink: #052e1a;
  --ship-ok: #4ade80;
  --ship-ok-ink: #052e1a;
  --ship-blocked: #fbbf24;
  --ship-blocked-ink: #3a2a00;
  --ship-failed: #ef4444;
  --ship-failed-ink: #ffffff;
  --badge-count-bg: #10b981;
  --badge-count-ink: #052e1a;
}

/* —— Paper (day board) —— */
html[data-palette="paper"] {
  color-scheme: light;
  --bg: #e8ece9;
  --surface: #dde4df;
  --raised: #f4f7f5;
  --ink: #141816;
  --ink-soft: #6b7871;
  --ink-mid: #3d4a43;
  --line: #c5cfc8;
  --accent: #0d8f66;
  --accent-ink: #f4faf7;
  --brand: var(--accent);
  --brand-ink: var(--accent-ink);
  --unseen: #c49212;
  --unseen-ink: #2a2000;
  --stop: #c53030;
  --stop-ink: #ffffff;
  --ship-inflight: #0d8f66;
  --ship-inflight-ink: #f4faf7;
  --ship-ok: #2f7a4a;
  --ship-ok-ink: #f4faf7;
  --ship-blocked: #c49212;
  --ship-blocked-ink: #2a2000;
  --ship-failed: #c53030;
  --ship-failed-ink: #ffffff;
  --badge-count-bg: #0d8f66;
  --badge-count-ink: #f4faf7;
}

@media (prefers-color-scheme: light) {
  html:not([data-palette]),
  html[data-palette="system"] {
    color-scheme: light;
    --bg: #e8ece9;
    --surface: #dde4df;
    --raised: #f4f7f5;
    --ink: #141816;
    --ink-soft: #6b7871;
    --ink-mid: #3d4a43;
    --line: #c5cfc8;
    --accent: #0d8f66;
    --accent-ink: #f4faf7;
    --brand: var(--accent);
    --brand-ink: var(--accent-ink);
    --unseen: #c49212;
    --unseen-ink: #2a2000;
    --stop: #c53030;
    --stop-ink: #ffffff;
    --ship-inflight: #0d8f66;
    --ship-inflight-ink: #f4faf7;
    --ship-ok: #2f7a4a;
    --ship-ok-ink: #f4faf7;
    --ship-blocked: #c49212;
    --ship-blocked-ink: #2a2000;
    --ship-failed: #c53030;
    --ship-failed-ink: #ffffff;
    --badge-count-bg: #0d8f66;
    --badge-count-ink: #f4faf7;
  }
}

* { scrollbar-width: thin; scrollbar-color: var(--accent) transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--accent); border-radius: 99px; border: 2px solid var(--bg); }