/* ═══════════════════════════════════════════════════════════════════════════
 * Kallisto Design System — Tokens
 * Single source of truth for colors, typography, spacing, shadows, radii,
 * glass surfaces, motion, and status semantics.
 * ═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Surface ─────────────────────────────────────────────────────────── */
  --bg-1: oklch(0.985 0.012 295);
  --bg-2: oklch(0.965 0.022 280);
  --bg-3: oklch(0.945 0.030 285);

  /* ── Ink ──────────────────────────────────────────────────────────────── */
  --ink:   oklch(0.20 0.012 280);
  --ink-2: oklch(0.42 0.015 280);
  --ink-3: oklch(0.62 0.012 280);

  /* ── Lines ────────────────────────────────────────────────────────────── */
  --line:        oklch(0.90 0.012 280 / 0.55);
  --line-strong: oklch(0.85 0.015 280 / 0.7);

  /* ── Brand Accents ───────────────────────────────────────────────────── */
  --violet:    oklch(0.68 0.18 295);
  --violet-2:  oklch(0.55 0.18 285);
  --sky:       oklch(0.74 0.13 235);
  --mint:      oklch(0.78 0.10 175);
  --lavender:  oklch(0.92 0.04 285);
  --lavender-2:oklch(0.86 0.06 285);

  /* ── Status ──────────────────────────────────────────────────────────── */
  --ok:   oklch(0.62 0.13 150);
  --warn: oklch(0.72 0.14 70);
  --bad:  oklch(0.62 0.18 30);

  /* ── Glass ───────────────────────────────────────────────────────────── */
  --glass-bg:        rgba(255,255,255, 0.55);
  --glass-bg-strong: rgba(255,255,255, 0.72);
  --glass-bg-opaque: rgba(255,255,255, 0.94);
  --glass-stroke:    rgba(255,255,255, 0.85);
  --glass-stroke-2:  rgba(255,255,255, 0.45);

  /* ── Shadows ─────────────────────────────────────────────────────────── */
  --shadow-sm: 0 1px 2px rgba(60,40,110,.04), 0 4px 12px rgba(60,40,110,.05);
  --shadow-md: 0 2px 4px rgba(60,40,110,.05), 0 12px 32px rgba(60,40,110,.08);
  --shadow-lg: 0 8px 24px rgba(60,40,110,.10), 0 24px 60px rgba(60,40,110,.12);

  /* ── Radii ───────────────────────────────────────────────────────────── */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 22px;
  --r-full: 999px;

  /* ── Typography ──────────────────────────────────────────────────────── */
  --font-sans: 'Geist', -apple-system, system-ui, 'Segoe UI', sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, 'SF Mono', monospace;

  --fs-2xs: 9.5px;
  --fs-xs:  10px;
  --fs-sm:  11.5px;
  --fs-sub: 12.5px;
  --fs-base: 13px;
  --fs-body: 13.5px;
  --fs-md:  14px;
  --fs-nav: 15px;
  --fs-lg:  16px;
  --fs-xl:  22px;
  --fs-2xl: 28px;
  --fs-3xl: 48px;

  --fw-regular: 400;
  --fw-medium:  450;
  --fw-semi:    500;
  --fw-bold:    600;
  --fw-black:   700;

  --lh-tight:  1.15;
  --lh-normal: 1.45;
  --lh-loose:  1.55;

  --ls-tight: -0.02em;
  --ls-normal: -0.005em;
  --ls-wide:   0.08em;
  --ls-wider:  0.12em;

  /* ── Layout ──────────────────────────────────────────────────────────── */
  --sidebar-w:           240px;
  --sidebar-collapsed-w: 76px;
  --topbar-h:            64px;

  /* ── Motion ──────────────────────────────────────────────────────────── */
  --motion-instant: 80ms;
  --motion-fast:    160ms;
  --motion-base:    240ms;
  --motion-slow:    380ms;
  --ease-standard:   cubic-bezier(0.2, 0, 0, 1);
  --ease-decelerate: cubic-bezier(0, 0, 0.2, 1);
  --ease-accelerate: cubic-bezier(0.4, 0, 1, 1);
  --ease-sharp:      cubic-bezier(0.4, 0, 0.6, 1);

  /* ── Statics ─────────────────────────────────────────────────────────── */
  --black: #000;
  --white: #fff;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-instant: 1ms;
    --motion-fast:    1ms;
    --motion-base:    1ms;
    --motion-slow:    1ms;
  }
}