/* HEAT Padel Series · design tokens · v1.0 (Документ 03)
   Источник правил: heat-brandbook.html. Ночной режим по умолчанию.
   Режим бумаги: [data-mode="paper"] на html/body или класс .heat-paper на контейнере.
   Подключение: <link rel="stylesheet" href="design-system/tokens/heat-tokens.css"> после assets/fonts/fonts.css */

:root, .heat-night, [data-mode="night"] {
  color-scheme: dark;

  /* colour · night */
  --bg: oklch(14% 0 0);                 /* #090909 almost black */
  --surface: oklch(20% 0.006 280);      /* #151619 */
  --surface-2: oklch(25% 0.006 280);    /* #212125 raised */
  --fg: oklch(95.5% 0.006 85);          /* #f2f0ec warm white · 17.5:1 */
  --muted: oklch(70% 0.01 85);          /* #a19e98 · 7.45:1 */
  --border: oklch(30% 0.006 280);       /* #2d2d31 */
  --accent: oklch(76% 0.14 250);        /* #66b6ff electric blue 300 · 9.2:1 */
  --accent-hover: oklch(84% 0.11 250);  /* #92d0ff */
  --on-accent: var(--bg);               /* text on a blue button · 9.2:1 */
  --overlay: oklch(14% 0 0 / 0.72);     /* photo darkening under text */
  --line: oklch(100% 0 0 / 0.08);       /* hairline on dark */

  /* heat spectrum · fills only, never body text */
  --heat-1: oklch(60% 0.22 262);  /* #2e75ff electric blue */
  --heat-2: oklch(52% 0.26 300);  /* #851ee3 violet */
  --heat-3: oklch(62% 0.27 345);  /* #ea00aa magenta */
  --heat-4: oklch(63% 0.25 25);   /* #fd122e hot red */
  --heat-5: oklch(74% 0.20 50);   /* #ff7c00 infra orange */
  --heat-6: oklch(91% 0.19 100);  /* #ffe300 acid yellow */
  --heat-7: oklch(97.5% 0.02 95); /* #fbf7e8 white-hot */
  --spectrum: linear-gradient(90deg, var(--bg) 0%, var(--heat-1) 20%, var(--heat-2) 38%, var(--heat-3) 55%, var(--heat-4) 68%, var(--heat-5) 82%, var(--heat-6) 93%, var(--heat-7) 100%);

  /* heat levels · colour of the level dot and the level kicker */
  --level-1: var(--heat-1);   /* LEVEL 01 · COLD START · temp .24 */
  --level-2: var(--heat-2);   /* LEVEL 02 · BUILD UP · temp .42 */
  --level-3: var(--heat-3);   /* LEVEL 03 · MATCH ON · temp .60 */
  --level-4: var(--heat-4);   /* LEVEL 04 · HIGH INTENSITY · temp .80 */
  --level-max: var(--heat-6); /* MAX HEAT · temp 1 */

  /* heat-filled wordmark paint (sRGB, saturated; pure white base) */
  --paint-blue: #1458ff; --paint-sky: #5096ff; --paint-violet: #7828eb; --paint-magenta: #f01496;
  --paint-red: #ff2332; --paint-orange: #ff7d23; --paint-yellow: #ffdc28;

  /* type */
  --font-display: 'Unbounded', 'Arial Black', Impact, sans-serif;
  --font-body: 'Golos Text', 'Helvetica Neue', Arial, sans-serif;
  --font-label: 'Archivo Narrow', 'Arial Narrow', sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', Menlo, monospace;

  --text-display-xl: clamp(6rem, 3rem + 8vw, 10rem);        /* 96–160 px · Unbounded 900 · -0.03em */
  --text-display-l: clamp(3rem, 2rem + 3vw, 4.5rem);        /* 48–72 px · Unbounded 700 · -0.02em */
  --text-display-s: clamp(1.25rem, 1rem + 1vw, 2rem);       /* 20–32 px · Unbounded 400 */
  --text-label: 0.8125rem;                                  /* 13 px · Archivo Narrow 600 caps · +0.08em */
  --text-label-l: 1rem;                                     /* 16 px */
  --text-data: 0.875rem;                                    /* 14 px · JetBrains Mono · tabular */
  --text-data-l: 1.375rem;                                  /* 22 px */
  --text-body: clamp(1rem, 0.95rem + 0.25vw, 1.0625rem);    /* 16–17 px · Golos Text · 1.6 */
  --text-body-s: 0.9375rem;                                 /* 15 px */

  --track-display-xl: -0.03em; --track-display-l: -0.02em; --track-display-s: 0;
  --track-label: 0.08em; --track-data: 0.02em;
  --leading-display: 0.95; --leading-tight: 1.2; --leading-body: 1.6;

  /* space · 4 px base */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px; --space-10: 128px;
  --space-section: clamp(4rem, 3rem + 4vw, 7rem);
  --gutter: clamp(16px, 2vw, 32px);
  --container: 1240px;
  --measure: 66ch;

  /* grid · court */
  --court-x: 20; --court-y: 10;                 /* invisible 20 × 10 grid under every field */
  --safe: 6%;                                   /* template safe area, share of the short side */
  --hairline: 1px;
  --mark-stroke: 0.26;                          /* wordmark stroke = 26 / 100 of its height = clear space */
  --radius: 0;                                  /* no rounded corners anywhere */
  --radius-dot: 50%;                            /* the only circle: level dot */

  /* motion */
  --dur-fast: 120ms; --dur: 180ms; --dur-slow: 400ms; --dur-heat: 1200ms;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);        /* out-expo · ui */
  --ease-heat: cubic-bezier(0.4, 0, 0.2, 1);    /* heat-in · fields and the heat-filled mark */

  /* focus */
  --focus: 2px solid var(--accent);
  --focus-offset: 3px;
}

.heat-paper, [data-mode="paper"] {
  color-scheme: light;
  --bg: oklch(95.5% 0.006 85);          /* #f2f0ec warm white */
  --surface: oklch(98.5% 0.004 85);     /* #fbfaf7 */
  --surface-2: oklch(92% 0.008 85);     /* #e7e4df */
  --fg: oklch(17% 0.005 280);           /* #0f0f12 · 16.8:1 */
  --muted: oklch(45% 0.01 280);         /* #54555b · 6.53:1 */
  --border: oklch(86% 0.008 85);        /* #d3d1cb */
  --accent: oklch(47% 0.2 262);         /* #0e4ec8 electric blue 600 · 6.27:1 */
  --accent-hover: oklch(39% 0.19 262);  /* #0035a8 */
  --on-accent: oklch(95.5% 0.006 85);
  --overlay: oklch(95.5% 0.006 85 / 0.8);
  --line: oklch(0% 0 0 / 0.1);
}

/* reduced motion: fields render their final state, nothing drifts */
@media (prefers-reduced-motion: reduce) {
  :root, .heat-night, .heat-paper { --dur-fast: 0ms; --dur: 0ms; --dur-slow: 0ms; --dur-heat: 0ms; }
}