/* Design tokens — semantic custom properties, light + dark.
   Components must reference ONLY these tokens (no raw hex outside this file). */

:root {
  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;
  --text-xs: 0.75rem; --text-sm: 0.8125rem; --text-base: 0.875rem;
  --text-md: 1rem; --text-lg: 1.125rem; --text-xl: 1.375rem; --text-2xl: 1.75rem;
  --leading: 1.5;
  --sp-1: 0.25rem; --sp-2: 0.5rem; --sp-3: 0.75rem; --sp-4: 1rem;
  --sp-5: 1.5rem; --sp-6: 2rem; --sp-8: 3rem;
  --r-sm: 4px; --r-md: 6px; --r-lg: 10px; --r-full: 999px;
  --shadow-1: 0 1px 2px rgb(0 0 0 / .05);
  --shadow-2: 0 1px 3px rgb(0 0 0 / .06), 0 4px 12px rgb(0 0 0 / .06);
  --shadow-pop: 0 4px 24px rgb(0 0 0 / .14);
  --bg-app: #f7f7f8; --bg-surface: #ffffff; --bg-inset: #f0f0f2;
  --border: #e4e4e7; --border-strong: #d4d4d8;
  --text-1: #18181b; --text-2: #52525b; --text-3: #8e8e98;
  --accent: #5b5bd6; --accent-strong: #4a4ac4; --accent-text: #ffffff; --accent-soft: #eceafd;
  --ok: #1a7f37; --ok-soft: #e2f2e6;
  --warn: #9a6700; --warn-soft: #fcf0d8;
  --danger: #c9403c; --danger-soft: #fbe9e8;
  --focus-ring: 0 0 0 2px var(--bg-surface), 0 0 0 4px var(--accent);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg-app: #101014; --bg-surface: #17171c; --bg-inset: #1f1f26;
    --border: #26262e; --border-strong: #34343e;
    --text-1: #ededf0; --text-2: #a5a5b1; --text-3: #71717c;
    --accent: #7b7bea; --accent-strong: #9292f0; --accent-text: #101014; --accent-soft: #26264a;
    --ok: #4fb56b; --ok-soft: #15291b;
    --warn: #d9a13c; --warn-soft: #2d2410;
    --danger: #e5645f; --danger-soft: #331716;
    --shadow-1: 0 1px 2px rgb(0 0 0 / .4);
    --shadow-2: 0 1px 3px rgb(0 0 0 / .5), 0 4px 12px rgb(0 0 0 / .4);
  }
}

[data-theme="dark"] {
  --bg-app: #101014; --bg-surface: #17171c; --bg-inset: #1f1f26;
  --border: #26262e; --border-strong: #34343e;
  --text-1: #ededf0; --text-2: #a5a5b1; --text-3: #71717c;
  --accent: #7b7bea; --accent-strong: #9292f0; --accent-text: #101014; --accent-soft: #26264a;
  --ok: #4fb56b; --ok-soft: #15291b;
  --warn: #d9a13c; --warn-soft: #2d2410;
  --danger: #e5645f; --danger-soft: #331716;
  --shadow-1: 0 1px 2px rgb(0 0 0 / .4);
  --shadow-2: 0 1px 3px rgb(0 0 0 / .5), 0 4px 12px rgb(0 0 0 / .4);
}