/* Design tokens — from Claude Design handoff (2026-04-18).
   Do not edit per-component; adjust this file to reskin everything. */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,500;0,8..60,600;1,8..60,400&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  /* Surfaces & ink — light / warm-paper default */
  --bg:           oklch(0.985 0.006 75);
  --bg-sunk:      oklch(0.965 0.008 70);
  --fg:           oklch(0.22  0.012 60);
  --fg-soft:      oklch(0.34  0.012 60);
  --muted:        oklch(0.52  0.010 60);
  --muted-2:      oklch(0.66  0.008 65);
  --border:       oklch(0.90  0.008 70);
  --border-soft:  oklch(0.94  0.008 70);
  --accent:       oklch(0.52  0.130 35);
  --accent-hover: oklch(0.44  0.140 32);
  --accent-wash:  oklch(0.95  0.030 40);
  --visited:      oklch(0.44 0.09 320);

  /* Graph edges — ink-on-paper in light, luminance-on-ink in dark themes.
     Consumed by src/components/Graph.tsx. */
  --graph-edge:      oklch(0.22 0.012 60 / 0.18);
  --graph-edge-weak: oklch(0.22 0.012 60 / 0.10);
  --graph-edge-dim:  oklch(0.22 0.012 60 / 0.05);

  /* Graph theme palette — 11 clusters */
  --theme-psihologiya: oklch(0.58 0.15  285);
  --theme-rody:        oklch(0.70 0.11   10);
  --theme-zdorove:     oklch(0.66 0.10  165);
  --theme-pitanie:     oklch(0.80 0.11   85);
  --theme-recepty:     oklch(0.60 0.15   25);
  --theme-dosug:       oklch(0.68 0.12   45);
  --theme-knigi:       oklch(0.48 0.08   55);
  --theme-uchyoba:     oklch(0.58 0.13  245);
  --theme-video:       oklch(0.62 0.11  320);
  --theme-meta:        oklch(0.78 0.008 250);
  --theme-misc:        oklch(0.62 0.10  300);
  --theme-untagged:    oklch(0.72 0.008  70);

  /* Type */
  --font-serif: 'Source Serif 4', 'PT Serif', Georgia, 'Times New Roman', serif;
  --font-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-mono:  'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --fs-micro: 12px;
  --fs-meta:  14px;
  --fs-small: 16px;
  --fs-base:  19px;
  --fs-lead:  21px;
  --fs-h2:    26px;
  --fs-h1:    38px;
  --fs-h1-lg: 46px;

  --lh-tight: 1.15;
  --lh-snug:  1.35;
  --lh-prose: 1.65;
  --lh-loose: 1.85;

  --tracking-caps: 0.1em;

  /* Spacing */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px;  --sp-8: 64px; --sp-9: 96px;

  --container: 720px;

  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;

  --dur-fast: 120ms;
  --dur:      200ms;
  --ease: cubic-bezier(.2,.6,.2,1);
}

:root[data-theme="dark"],
:root[data-theme="auto"] {
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] {
    --bg:          oklch(0.19 0.008 60);
    --bg-sunk:     oklch(0.22 0.008 60);
    --fg:          oklch(0.92 0.008 75);
    --fg-soft:     oklch(0.82 0.008 70);
    --muted:       oklch(0.65 0.010 65);
    --muted-2:     oklch(0.55 0.010 65);
    --border:      oklch(0.30 0.010 65);
    --border-soft: oklch(0.26 0.010 65);
    --accent:      oklch(0.74 0.120 40);
    --accent-hover:oklch(0.82 0.110 40);
    --accent-wash: oklch(0.30 0.030 40);
    --visited:     oklch(0.72 0.08 320);
    --graph-edge:      oklch(0.92 0.008 75 / 0.26);
    --graph-edge-weak: oklch(0.92 0.008 75 / 0.14);
    --graph-edge-dim:  oklch(0.92 0.008 75 / 0.07);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg:          oklch(0.19 0.008 60);
  --bg-sunk:     oklch(0.22 0.008 60);
  --fg:          oklch(0.92 0.008 75);
  --fg-soft:     oklch(0.82 0.008 70);
  --muted:       oklch(0.65 0.010 65);
  --muted-2:     oklch(0.55 0.010 65);
  --border:      oklch(0.30 0.010 65);
  --border-soft: oklch(0.26 0.010 65);
  --accent:      oklch(0.74 0.120 40);
  --accent-hover:oklch(0.82 0.110 40);
  --accent-wash: oklch(0.30 0.030 40);
  --visited:     oklch(0.72 0.08 320);
  --graph-edge:      oklch(0.92 0.008 75 / 0.26);
  --graph-edge-weak: oklch(0.92 0.008 75 / 0.14);
  --graph-edge-dim:  oklch(0.92 0.008 75 / 0.07);
  color-scheme: dark;
}

:root[data-theme="cozy"] {
  --bg:          oklch(0.94 0.022 70);
  --bg-sunk:     oklch(0.915 0.026 65);
  --fg:          oklch(0.28 0.028 50);
  --fg-soft:     oklch(0.40 0.025 50);
  --muted:       oklch(0.54 0.020 55);
  --muted-2:     oklch(0.66 0.018 60);
  --border:      oklch(0.84 0.022 65);
  --border-soft: oklch(0.89 0.020 65);
  --accent:      oklch(0.46 0.150 32);
  --accent-hover:oklch(0.40 0.160 30);
  --accent-wash: oklch(0.88 0.045 40);
  --visited:     oklch(0.40 0.09 320);
  --graph-edge:      oklch(0.28 0.028 50 / 0.20);
  --graph-edge-weak: oklch(0.28 0.028 50 / 0.12);
  --graph-edge-dim:  oklch(0.28 0.028 50 / 0.06);
  color-scheme: light;
}