/* Hallmark · tokens · genre: modern-minimal · anchor hue: 255 (cool) · accent: cobalt */
@font-face {
  font-family: "Geist";
  src: url("/fonts/geist.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;

  --color-paper:       oklch(98.4% 0.003 255);
  --color-paper-2:     oklch(96.4% 0.004 255);
  --color-surface:     oklch(99.6% 0.002 255);
  --color-rule:        oklch(91.5% 0.006 255);
  --color-rule-strong: oklch(84% 0.008 255);
  --color-neutral:     oklch(62% 0.012 255);
  --color-muted:       oklch(47% 0.014 255);
  --color-ink:         oklch(22% 0.018 258);
  --color-ink-inverse: oklch(98% 0.003 255);
  --color-accent:      oklch(52% 0.19 258);
  --color-accent-soft: oklch(95.5% 0.022 258);
  --color-accent-ink:  oklch(99% 0.004 255);
  --color-focus:       oklch(52% 0.19 258);
  --color-star:        oklch(76% 0.16 78);
  --color-star-off:    oklch(88% 0.008 255);
  --color-series:      oklch(56% 0.16 258);
  --color-series-dim:  oklch(84% 0.06 258);
  --color-critical:    oklch(52% 0.19 27);
  --color-critical-soft: oklch(96% 0.02 27);
  --color-warn:        oklch(47% 0.11 70);
  --color-warn-soft:   oklch(95.5% 0.04 85);
  --color-good:        oklch(48% 0.12 155);
  --color-good-soft:   oklch(95.5% 0.03 155);
  --color-shadow:      oklch(22% 0.018 258 / 0.18);

  --font-display: "Geist", ui-sans-serif, sans-serif;
  --font-body:    "Geist", ui-sans-serif, sans-serif;

  --text-xs:  0.75rem;
  --text-sm:  0.8125rem;
  --text-md:  0.875rem;
  --text-lg:  1rem;
  --text-xl:  1.25rem;
  --text-2xl: 1.5625rem;
  --text-3xl: 1.9375rem;

  --space-3xs: 0.125rem;
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;

  --radius-input: 6px;
  --radius-card:  10px;
  --radius-pill:  999px;

  --control-h: 2.25rem;
  --sidebar-w: 15rem;
  --topbar-h:  3.5rem;
  --tabbar-h:  3.75rem;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-short: 140ms;

  --z-raised: 10;
  --z-sticky: 200;
  --z-toast: 500;
  --z-tooltip: 600;
}

/* Mode: ikut perangkat, kecuali user memilih sendiri (data-theme diisi theme.js) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-paper:       oklch(15.5% 0.008 258);
    --color-paper-2:     oklch(19% 0.01 258);
    --color-surface:     oklch(18.5% 0.01 258);
    --color-rule:        oklch(27% 0.012 258);
    --color-rule-strong: oklch(36% 0.014 258);
    --color-neutral:     oklch(60% 0.012 255);
    --color-muted:       oklch(72% 0.01 255);
    --color-ink:         oklch(94% 0.005 255);
    --color-ink-inverse: oklch(18% 0.01 258);
    --color-accent:      oklch(72% 0.15 258);
    --color-accent-soft: oklch(26% 0.05 258);
    --color-accent-ink:  oklch(16% 0.02 258);
    --color-focus:       oklch(72% 0.15 258);
    --color-star:        oklch(78% 0.15 78);
    --color-star-off:    oklch(34% 0.012 258);
    --color-series:      oklch(68% 0.14 258);
    --color-series-dim:  oklch(36% 0.06 258);
    --color-critical:    oklch(72% 0.15 27);
    --color-critical-soft: oklch(25% 0.05 27);
    --color-warn:        oklch(80% 0.12 80);
    --color-warn-soft:   oklch(27% 0.045 75);
  --color-good:        oklch(74% 0.13 155);
    --color-good-soft:   oklch(24% 0.04 155);
    --color-shadow:      oklch(0% 0 0 / 0.5);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --color-paper:       oklch(15.5% 0.008 258);
  --color-paper-2:     oklch(19% 0.01 258);
  --color-surface:     oklch(18.5% 0.01 258);
  --color-rule:        oklch(27% 0.012 258);
  --color-rule-strong: oklch(36% 0.014 258);
  --color-neutral:     oklch(60% 0.012 255);
  --color-muted:       oklch(72% 0.01 255);
  --color-ink:         oklch(94% 0.005 255);
  --color-ink-inverse: oklch(18% 0.01 258);
  --color-accent:      oklch(72% 0.15 258);
  --color-accent-soft: oklch(26% 0.05 258);
  --color-accent-ink:  oklch(16% 0.02 258);
  --color-focus:       oklch(72% 0.15 258);
  --color-star:        oklch(78% 0.15 78);
  --color-star-off:    oklch(34% 0.012 258);
  --color-series:      oklch(68% 0.14 258);
  --color-series-dim:  oklch(36% 0.06 258);
  --color-critical:    oklch(72% 0.15 27);
  --color-critical-soft: oklch(25% 0.05 27);
  --color-warn:        oklch(80% 0.12 80);
  --color-warn-soft:   oklch(27% 0.045 75);
  --color-good:        oklch(74% 0.13 155);
  --color-good-soft:   oklch(24% 0.04 155);
  --color-shadow:      oklch(0% 0 0 / 0.5);
}
:root[data-theme="light"] { color-scheme: light; }