/* Токены дизайна. Правила и обоснования — в DESIGN.md.
   Светлая тема по умолчанию; тёмная — prefers-color-scheme или [data-theme="dark"]. */
:root {
  --font-display: "Geologica", "Golos Text", "Segoe UI", sans-serif;
  --font-sans: "Golos Text", "Segoe UI", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-cjk: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC",
    "Noto Sans SC", "Source Han Sans SC", "Malgun Gothic", "Yu Gothic", sans-serif;
  --font-arabic: "Segoe UI", "Geeza Pro", "Noto Naskh Arabic", "Noto Sans Arabic",
    "Droid Arabic Naskh", Tahoma, sans-serif;

  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-md: 1rem;
  --fs-lg: 1.1875rem;
  --fs-xl: 1.625rem;
  --fs-2xl: clamp(2rem, 1.5rem + 2vw, 2.75rem);
  --fs-display: clamp(2.75rem, 1.6rem + 4vw, 5.25rem);
  --fs-section: clamp(2rem, 1.4rem + 2.4vw, 3.5rem);

  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4.5rem;
  --sp-9: 7.5rem;

  --radius: 10px;

  --nav-h: 3.5rem;
  --nav-w: 13.5rem;
  --content-w: 44rem;
  --page-w: 90rem;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  /* Не зависят от темы: тёмные и маркерные блоки сайта */
  --ink-fixed: oklch(0.2 0.035 262);
  --ink-hover: oklch(0.29 0.045 262);
  --on-ink: oklch(0.97 0.008 240);
  --on-ink-soft: oklch(0.8 0.02 250);
  --marker-fixed: oklch(0.905 0.165 103);
  --marker-hover: oklch(0.94 0.15 103);
  --card-fixed: oklch(0.985 0.005 240);
  --muted-fixed: oklch(0.47 0.03 256);
  --line-fixed: oklch(0.88 0.014 250);
  --shadow-sm: 0 1px 1px oklch(0.2 0.03 262 / 0.05), 0 8px 24px oklch(0.2 0.03 262 / 0.07);
  --shadow: 0 1px 1px oklch(0.2 0.03 262 / 0.06), 0 16px 40px oklch(0.2 0.03 262 / 0.13);

  /* Лист ведомости: холодная бумага, синие чернила, один жёлтый маркер. */
  --bg: oklch(0.973 0.007 240);
  --surface: oklch(0.992 0.004 240);
  --surface-2: oklch(0.945 0.01 245);
  --line: oklch(0.875 0.014 250);
  --line-strong: oklch(0.34 0.04 262);
  --text: oklch(0.25 0.04 262);
  --text-muted: oklch(0.46 0.03 256);
  --marker: oklch(0.905 0.165 103);
  --marker-ink: oklch(0.25 0.04 262);
  --solid: oklch(0.25 0.04 262);
  --solid-hover: oklch(0.33 0.05 262);
  --solid-ink: oklch(0.973 0.007 240);
  --danger: oklch(0.5 0.17 27);
  --danger-soft: oklch(0.94 0.03 27);
  --success: oklch(0.42 0.1 155);
  --focus: oklch(0.25 0.04 262);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: oklch(0.205 0.025 262);
    --surface: oklch(0.24 0.028 262);
    --surface-2: oklch(0.275 0.03 262);
    --line: oklch(0.36 0.03 262);
    --line-strong: oklch(0.85 0.015 250);
    --text: oklch(0.93 0.012 245);
    --text-muted: oklch(0.74 0.02 250);
    --marker: oklch(0.86 0.155 103);
    --solid: oklch(0.93 0.012 245);
    --solid-hover: oklch(0.84 0.02 245);
    --solid-ink: oklch(0.205 0.025 262);
    --danger: oklch(0.74 0.14 27);
    --danger-soft: oklch(0.3 0.06 27);
    --success: oklch(0.78 0.11 155);
    --focus: oklch(0.86 0.155 103);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: oklch(0.205 0.025 262);
  --surface: oklch(0.24 0.028 262);
  --surface-2: oklch(0.275 0.03 262);
  --line: oklch(0.36 0.03 262);
  --line-strong: oklch(0.85 0.015 250);
  --text: oklch(0.93 0.012 245);
  --text-muted: oklch(0.74 0.02 250);
  --marker: oklch(0.86 0.155 103);
  --solid: oklch(0.93 0.012 245);
  --solid-hover: oklch(0.84 0.02 245);
  --solid-ink: oklch(0.205 0.025 262);
  --danger: oklch(0.74 0.14 27);
  --danger-soft: oklch(0.3 0.06 27);
  --success: oklch(0.78 0.11 155);
  --focus: oklch(0.86 0.155 103);
  color-scheme: dark;
}