/* Design tokens · Korovchenko · redesign v2
 * Тема зависит от времени в Новосибирске: html[data-time="day|twilight|night"], html[data-season="winter|summer"].
 * Шрифт: Onest 400–800 (кириллица), раздаётся с сайта.
 */

@font-face {
  font-family: "Onest";
  src: url("../fonts/onest-cyrillic.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: "Onest";
  src: url("../fonts/onest-latin.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Onest Fallback";
  src: local("Arial"), local("Helvetica Neue"), local("Helvetica");
  size-adjust: 103%;
  ascent-override: 92%;
  descent-override: 24%;
  line-gap-override: 0%;
}

:root {
  /* ---------- Type ---------- */
  --font: "Onest", "Onest Fallback", system-ui, sans-serif;
  --text-xs:   0.8125rem;
  --text-sm:   0.9375rem;
  --text-base: 1.125rem;                                   /* 18px — крупно и читаемо */
  --text-md:   1.25rem;
  --text-lg:   1.375rem;
  --text-xl:   clamp(1.625rem, 1.2rem + 1.2vw, 2.125rem);
  --text-2xl:  clamp(2rem, 1.3rem + 2.4vw, 3.25rem);
  --text-hero: clamp(2.375rem, 1.2rem + 3.6vw, 4.125rem);

  /* ---------- Space ---------- */
  --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;
  --space-3xl: 6rem;

  --container: 76rem;
  --gutter: clamp(1.25rem, 5vw, 3rem);
  --head-h: 4.5rem;

  /* ---------- Shape ---------- */
  --radius-sm: 0.625rem;
  --radius:    1rem;
  --radius-lg: 2rem;
  --radius-pill: 999px;

  /* ---------- Motion ---------- */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 140ms;
  --dur-short: 240ms;
  --dur-long:  700ms;
  --dur-theme: 1200ms;

  /* ---------- Layers ---------- */
  --z-base: 1;
  --z-raised: 10;
  --z-sticky: 200;
  --z-toast: 500;

  /* ---------- Page colours: day ---------- */
  --bg:       oklch(98.6% 0.004 250);
  --surface:  oklch(99.6% 0.002 250);
  --tint:     oklch(95.8% 0.012 245);
  --ink:      oklch(22% 0.025 260);
  --muted:    oklch(42% 0.02 260);
  --line:     oklch(89% 0.012 250);
  --accent:        oklch(72% 0.17 52);    /* оранжевый сигнал — кнопки */
  --accent-ink:    oklch(21% 0.04 45);    /* тёмный текст на оранжевом */
  --accent-strong: oklch(58% 0.18 42);    /* оранжевый для значков на светлом */
  --accent-soft:   color-mix(in oklab, var(--accent) 16%, var(--surface));
  --on-dark:       oklch(97% 0.008 250);
  --on-dark-muted: oklch(84% 0.02 250);
  --panel-a: oklch(31% 0.08 262);
  --panel-b: oklch(21% 0.06 264);
  --brand-wa:  oklch(64% 0.17 150);
  --brand-tg:  oklch(62% 0.14 235);
  --brand-max: oklch(55% 0.2 285);
  --rec:       oklch(60% 0.22 25);
  --focus:     oklch(55% 0.2 255);
  --shadow:    0 14px 40px oklch(30% 0.05 260 / 0.12);
  --shadow-sm: 0 4px 14px oklch(30% 0.05 260 / 0.10);

  --art-metal: oklch(32% 0.03 260);
  --art-panel: oklch(50% 0.13 255);

  /* ---------- Sky + scene: day ---------- */
  --sky-top:    oklch(67% 0.13 245);
  --sky-mid:    oklch(80% 0.09 232);
  --sky-bottom: oklch(92% 0.045 215);
  --hero-ink:   oklch(17% 0.03 260);
  --hero-muted: oklch(26% 0.035 260);
  --glass:      color-mix(in oklab, var(--surface) 74%, transparent);
  --glass-line: color-mix(in oklab, var(--ink) 10%, transparent);
  --stars-o: 0;
  --clouds-o: 0.92;
  --cloud:  oklch(99% 0.004 240);

  --sun:        oklch(90% 0.16 92);
  --sun-o: 1;
  --sun-y: 0px;
  --moon:       oklch(94% 0.03 95);
  --moon-o: 0;

  --sc-wall:      oklch(91% 0.04 78);
  --sc-wall-line: oklch(84% 0.05 72);
  --sc-roof:      oklch(50% 0.14 32);
  --sc-roof-edge: oklch(36% 0.1 32);
  --sc-chimney:   oklch(56% 0.09 36);
  --sc-window:    oklch(83% 0.06 228);
  --sc-frame:     oklch(98% 0.01 80);
  --sc-door:      oklch(46% 0.09 52);
  --sc-glow-o: 0;
  --sc-glow:      oklch(88% 0.15 85);
  --sc-metal:     oklch(90% 0.01 250);
  --sc-metal-dark: oklch(38% 0.02 255);
  --sc-panel:     oklch(46% 0.12 255);
  --sc-spruce:    oklch(45% 0.1 158);
  --sc-trunk:     oklch(40% 0.06 50);
  --sc-ground:     oklch(72% 0.13 136);
  --sc-ground-far: oklch(64% 0.11 142);
  --sc-snow:      oklch(98% 0.008 240);
  --sc-snow-o: 0;
  --sc-signal:    oklch(66% 0.2 45);
  --sc-cone-o: 0.45;
  --sc-smoke:     oklch(96% 0.005 250);
}

/* ---------- Winter: snow on the ground, roof and trees ---------- */
:root[data-season="winter"] {
  --sc-ground:     oklch(95% 0.016 240);
  --sc-ground-far: oklch(89% 0.024 240);
  --sc-snow-o: 1;
}

/* ---------- Twilight: dawn or dusk — warm sky, lights on ---------- */
:root[data-time="twilight"] {
  --sky-top:    oklch(30% 0.08 282);
  --sky-mid:    oklch(52% 0.13 332);
  --sky-bottom: oklch(79% 0.13 58);
  --hero-ink:   oklch(98% 0.008 70);
  --hero-muted: oklch(91% 0.03 60);
  --stars-o: 0.35;
  --clouds-o: 0.45;
  --cloud:  oklch(80% 0.08 20);
  --sun:    oklch(80% 0.17 55);
  --sun-y:  150px;
  --sc-wall:      oklch(73% 0.07 45);
  --sc-wall-line: oklch(66% 0.07 42);
  --sc-roof:      oklch(40% 0.1 28);
  --sc-roof-edge: oklch(30% 0.08 28);
  --sc-chimney:   oklch(46% 0.08 34);
  --sc-window:    oklch(86% 0.13 80);
  --sc-frame:     oklch(40% 0.05 40);
  --sc-door:      oklch(36% 0.07 45);
  --sc-glow-o: 0.75;
  --sc-metal:     oklch(78% 0.03 40);
  --sc-metal-dark: oklch(30% 0.03 290);
  --sc-spruce:    oklch(32% 0.06 165);
  --sc-ground:     oklch(50% 0.08 125);
  --sc-ground-far: oklch(43% 0.07 135);
}
:root[data-time="twilight"][data-season="winter"] {
  --sc-ground:     oklch(82% 0.05 20);
  --sc-ground-far: oklch(72% 0.06 330);
}

/* ---------- Night: dark page, stars, moon, lit windows ---------- */
:root[data-time="night"] {
  color-scheme: dark;
  --bg:       oklch(16% 0.03 262);
  --surface:  oklch(21.5% 0.035 262);
  --tint:     oklch(19% 0.035 262);
  --ink:      oklch(95% 0.01 250);
  --muted:    oklch(79% 0.02 250);
  --line:     oklch(32% 0.03 262);
  --accent:        oklch(76% 0.16 58);
  --accent-ink:    oklch(19% 0.04 50);
  --accent-strong: oklch(80% 0.15 60);
  --panel-a: oklch(27% 0.07 262);
  --panel-b: oklch(22% 0.05 266);
  --focus:   oklch(80% 0.12 240);
  --shadow:    0 14px 40px oklch(5% 0.02 260 / 0.5);
  --shadow-sm: 0 4px 14px oklch(5% 0.02 260 / 0.4);
  --art-metal: oklch(86% 0.02 250);
  --art-panel: oklch(60% 0.12 255);

  --sky-top:    oklch(12% 0.03 266);
  --sky-mid:    oklch(19% 0.05 262);
  --sky-bottom: oklch(31% 0.07 254);
  --hero-ink:   oklch(97% 0.008 250);
  --hero-muted: oklch(85% 0.02 250);
  --glass:      color-mix(in oklab, var(--surface) 70%, transparent);
  --glass-line: color-mix(in oklab, var(--ink) 16%, transparent);
  --stars-o: 1;
  --clouds-o: 0;
  --sun-o: 0;
  --moon-o: 1;

  --sc-wall:      oklch(36% 0.03 262);
  --sc-wall-line: oklch(31% 0.03 262);
  --sc-roof:      oklch(26% 0.05 30);
  --sc-roof-edge: oklch(19% 0.04 30);
  --sc-chimney:   oklch(30% 0.04 34);
  --sc-window:    oklch(87% 0.14 85);
  --sc-frame:     oklch(28% 0.03 262);
  --sc-door:      oklch(26% 0.04 50);
  --sc-glow-o: 1;
  --sc-metal:     oklch(66% 0.02 255);
  --sc-metal-dark: oklch(20% 0.02 260);
  --sc-panel:     oklch(38% 0.09 255);
  --sc-spruce:    oklch(25% 0.045 188);
  --sc-trunk:     oklch(24% 0.03 50);
  --sc-ground:     oklch(27% 0.05 165);
  --sc-ground-far: oklch(23% 0.045 172);
  --sc-snow:      oklch(78% 0.03 250);
  --sc-signal:    oklch(78% 0.16 60);
  --sc-cone-o: 0.6;
  --sc-smoke:     oklch(60% 0.02 255);
}
:root[data-time="night"][data-season="winter"] {
  --sc-ground:     oklch(47% 0.035 255);
  --sc-ground-far: oklch(39% 0.04 258);
}