/* Jarvis 2.0 — токены дизайн-системы «Сводка», сброс и базовая типографика.
   Тёмная тема — значения по умолчанию в :root.
   Светлая включается системной настройкой ИЛИ явно через data-theme.
   Правило разрешения конфликта: явный data-theme всегда сильнее системного
   предпочтения, поэтому системный блок исключает :root[data-theme="dark"]. */

:root {
  color-scheme: dark;

  --ink: #0E1417;
  --surface: #151D21;
  --surface-2: #1C262B;
  --surface-3: #233036;
  --line: #293539;
  --line-soft: #1F2A2E;
  --text: #E6EDEA;
  --text-2: #93A39E;
  --text-3: #64756F;
  --jade: #3FBE8C;
  --jade-dim: #2A7D5E;
  --jade-wash: #16302A;
  --amber: #E3A63F;
  --amber-wash: #33280F;
  --clay: #DC6B4F;
  --clay-wash: #351C16;
  --sky: #6FA8C7;

  /* производные от палитры: текст на акцентной заливке, тени, «стеклянный» фон шапки */
  --on-accent: #08130F;
  --sky-wash: #16262E;
  --shadow: 0 1px 2px rgb(0 0 0 / .28), 0 8px 24px rgb(0 0 0 / .22);
  --shadow-sm: 0 1px 2px rgb(0 0 0 / .3);
  --veil: rgb(21 29 33 / .86);

  --r-sm: 6px;
  --r: 10px;
  --r-lg: 14px;

  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;

  --dur: 140ms;

  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    color-scheme: light;

    --ink: #EEF2F0;
    --surface: #FFFFFF;
    --surface-2: #F5F8F6;
    --surface-3: #EAEFEC;
    --line: #D8E1DC;
    --line-soft: #E6ECE9;
    --text: #0E1417;
    --text-2: #55635D;
    --text-3: #7B8A84;
    --jade: #14805A;
    --jade-dim: #9AD3BB;
    --jade-wash: #E4F3EC;
    --amber: #9A6B10;
    --amber-wash: #FBF0DA;
    --clay: #B4442A;
    --clay-wash: #FBE7E1;
    --sky: #2E6E90;

    --on-accent: #FFFFFF;
    --sky-wash: #E3EEF4;
    --shadow: 0 1px 2px rgb(14 20 23 / .06), 0 8px 24px rgb(14 20 23 / .07);
    --shadow-sm: 0 1px 2px rgb(14 20 23 / .07);
    --veil: rgb(255 255 255 / .88);
  }
}

:root[data-theme="light"] {
  color-scheme: light;

  --ink: #EEF2F0;
  --surface: #FFFFFF;
  --surface-2: #F5F8F6;
  --surface-3: #EAEFEC;
  --line: #D8E1DC;
  --line-soft: #E6ECE9;
  --text: #0E1417;
  --text-2: #55635D;
  --text-3: #7B8A84;
  --jade: #14805A;
  --jade-dim: #9AD3BB;
  --jade-wash: #E4F3EC;
  --amber: #9A6B10;
  --amber-wash: #FBF0DA;
  --clay: #B4442A;
  --clay-wash: #FBE7E1;
  --sky: #2E6E90;

  --on-accent: #FFFFFF;
  --sky-wash: #E3EEF4;
  --shadow: 0 1px 2px rgb(14 20 23 / .06), 0 8px 24px rgb(14 20 23 / .07);
  --shadow-sm: 0 1px 2px rgb(14 20 23 / .07);
  --veil: rgb(255 255 255 / .88);
}

/* ─────────────────────────────── сброс ─────────────────────────────── */

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  /* якорные переходы не должны прятать заголовок под липкой шапкой */
  scroll-padding-top: 72px;
}

body,
h1, h2, h3, h4, p, figure, blockquote, dl, dd, ol, ul, fieldset, pre {
  margin: 0;
}

ul, ol { padding: 0; list-style: none; }

fieldset { border: 0; padding: 0; min-width: 0; }

img, svg, video { max-width: 100%; height: auto; display: block; }

button, input, select, textarea { font: inherit; color: inherit; }

button { background: none; border: 0; padding: 0; }

a { color: inherit; text-decoration: none; }

table { border-collapse: collapse; width: 100%; }

/* ────────────────────────── базовая типографика ────────────────────── */

body {
  min-height: 100dvh;
  background: var(--ink);
  color: var(--text);
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: .002em;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  /* Горизонтальную прокрутку разрешаем только внутри .scroll-x.
     Именно clip, а не hidden: hidden сделал бы body контейнером прокрутки
     и сломал бы position: sticky у левой панели. */
  overflow-x: clip;
}

h1 { font-size: 22px; line-height: 1.25; font-weight: 650; letter-spacing: -.012em; }
h2 { font-size: 17px; line-height: 1.3; font-weight: 640; letter-spacing: -.008em; }
h3 { font-size: 14px; line-height: 1.35; font-weight: 640; }

p { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }

small { font-size: 12px; }

code, pre, samp { font-family: var(--mono); font-size: 12.5px; }

/* все числа, время и суммы — моноширинные, с одинаковой шириной цифр */
.num, time, .mono {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

/* структурный приём дизайн-системы: метка над блоком */
.label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--text-3);
  font-weight: 600;
}

::selection { background: var(--jade-wash); color: var(--text); }

::placeholder { color: var(--text-3); opacity: 1; }

/* ───────────────────────────── фокус ───────────────────────────────── */

:focus { outline: none; }

:focus-visible {
  outline: 2px solid var(--jade);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}

/* ──────────────────────── уменьшенная анимация ─────────────────────── */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}