/* Designtokens for Yappi HQ. Aksent = Yappi-lilla (style-yappi.css). Alt annet er nøytrale grå. */
:root {
  --accent: #6a45e0; --accent-strong: #5a37cc; --accent-soft: #efeaff; --accent-text: #5a37cc; --on-accent: #ffffff;
  --bg: #f7f7f9; --surface: #ffffff; --surface-2: #f2f2f5; --surface-hover: #ececf1;
  --text: #16151c; --text-muted: #5b5968; --text-dim: #6b6977;
  --border: #e5e4ea; --focus: #6a45e0;
  --ok: #1d7552; --ok-soft: #e2f3eb; --warn: #875700; --warn-soft: #fcf0d6;
  --danger: #b3261e; --danger-soft: #fbe5e3; --info: #2b5cb0; --info-soft: #e4ecfa; --neutral-soft: #ececf1;
  --shadow-1: 0 1px 2px rgb(20 16 40 / 0.06), 0 1px 3px rgb(20 16 40 / 0.04);
  --shadow-2: 0 10px 30px rgb(20 16 40 / 0.14);
  --radius-s: 8px; --radius-m: 10px; --radius-l: 12px; --radius-pill: 999px;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-7: 48px;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --mono: ui-monospace, Consolas, monospace;
  --fs-s: 13px; --fs-m: 15px; --fs-l: 20px; --fs-xl: 26px;
  --sidebar-w: 232px; --sidebar-w-collapsed: 64px; --topbar-h: 56px; --bottomnav-h: 64px;
  --logo-1: #b49bff; --logo-2: #6a45e0;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --accent: #926bff; --accent-strong: #7b55f2; --accent-soft: #2a2145; --accent-text: #b49bff; --on-accent: #ffffff;
    --bg: #0e0d15; --surface: #16151f; --surface-2: #1d1c28; --surface-hover: #242332;
    --text: #f2f1f7; --text-muted: #aaa7c0; --text-dim: #858199;
    --border: #2a2837; --focus: #b49bff;
    --ok: #6fd6ae; --ok-soft: #15302a; --warn: #f0c060; --warn-soft: #372c12;
    --danger: #f2728c; --danger-soft: #381a22; --info: #8ab4ff; --info-soft: #182440; --neutral-soft: #262533;
    --shadow-1: 0 1px 2px rgb(0 0 0 / 0.4); --shadow-2: 0 12px 32px rgb(0 0 0 / 0.5);
    --logo-1: #c6b4ff; --logo-2: #8c65ff;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --accent: #926bff; --accent-strong: #7b55f2; --accent-soft: #2a2145; --accent-text: #b49bff; --on-accent: #ffffff;
  --bg: #0e0d15; --surface: #16151f; --surface-2: #1d1c28; --surface-hover: #242332;
  --text: #f2f1f7; --text-muted: #aaa7c0; --text-dim: #858199;
  --border: #2a2837; --focus: #b49bff;
  --ok: #6fd6ae; --ok-soft: #15302a; --warn: #f0c060; --warn-soft: #372c12;
  --danger: #f2728c; --danger-soft: #381a22; --info: #8ab4ff; --info-soft: #182440; --neutral-soft: #262533;
  --shadow-1: 0 1px 2px rgb(0 0 0 / 0.4); --shadow-2: 0 12px 32px rgb(0 0 0 / 0.5);
  --logo-1: #c6b4ff; --logo-2: #8c65ff;
  color-scheme: dark;
}