/* Шрифты на сайте — self-host-fonts.py (Geologica вариативная: wght 400–900, наклон до 12°) */
@font-face { font-family: 'Geologica'; font-style: oblique 0deg 12deg; font-weight: 400 900; font-display: swap; src: url('fonts/geologica-var-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Geologica'; font-style: oblique 0deg 12deg; font-weight: 400 900; font-display: swap; src: url('fonts/geologica-var-latin.woff2') format('woff2'); 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: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('fonts/ibm-plex-mono-500-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('fonts/ibm-plex-mono-500-latin.woff2') format('woff2'); 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; }
/* Токены SoundStore — из design/direction.md («Сторона A»). Шрифты — @font-face в fonts.css. */
:root {
  /* Цвет (direction §Палитра) */
  --surface: #EFEAE0;      /* бумага конверта, фон */
  --edge: #E2DBCD;         /* края конверта, линии на бумаге */
  --ink: #0E0E0E;          /* текст, пластинка */
  --ink-muted: #625E57;    /* вторичный текст и метки, 5.4:1 */
  --accent: #7B2CF5;       /* только кнопка, этикетка, текущий номер */
  --on-accent: #FFFFFF;    /* белый на фиолетовом 5.96:1 */
  --plate: #000000;        /* фон окна = фон пэкшота канала (direction §Кадры 03/07/08) */
  --plane: #000000;        /* слот без картинки — та же плоскость окна */
  --line: color-mix(in oklab, var(--ink) 88%, var(--surface)); /* линия треклиста */

  /* Типографика (direction §Шрифты) */
  --font-display: 'Geologica', system-ui, sans-serif;
  --font-body: 'Geologica', system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --track-display: -0.02em;
  --track-mono: 0.06em;
  --slant: oblique 12deg;  /* вторая строка заголовка, как «store» */
  --step--1: 13px;         /* метки mono */
  --step-0: 17px;          /* текст 17/1.5 */
  --step-1: 15px;          /* mono крупнее: цены, номера */
  --step-2: 40px;          /* строка треклиста (телефон 26) */
  --step-3: clamp(44px, 6vw, 96px);    /* h2 (телефон 44) */
  --step-4: clamp(48px, 6.6vw, 112px); /* h1 первого экрана: стоит рядом с проигрывателем (decisions) */
  --step-5: clamp(64px, 15vw, 240px);  /* «SOUND» на конверте */

  /* Пространство: 4 8 12 16 24 32 48 64 96 128 */
  --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;
  --container: 1440px;
  --gutter: 56px;          /* поля ПК 56 (телефон 18) */
  --col-gap: 24px;         /* межколонник ПК 24 (телефон 12) */
  --header-h: 92px;

  /* Радиусы (direction §Сетка: исключение §5) */
  --radius-row: 0;         /* строки */
  --radius-plate: 4px;     /* плашка логотипа */
  --radius-pill: 28px;     /* кнопка 56 */
  --radius-control: 28px;  /* имя, которое читает base.css */
  --btn-h: 56px;

  /* Движение */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.33, 1, 0.68, 1);
  --dur-micro: 180ms;
  --dur-reveal: 400ms;

  /* Сигнатура — пластинка и проигрыватель */
  --signature-vinyl: #0E0E0E;
  --signature-label: var(--accent);
  --signature-lerp: 0.12;      /* сглаживание прокрутки, без пружины */
  --signature-rpm: 33.333;
  --signature-shadow: 0 1px 2px rgb(40 30 15 / 0.18), 0 24px 48px -12px rgb(40 30 15 / 0.35);
}

@media (max-width: 900px) {
  :root {
    --gutter: 18px;
    --col-gap: 12px;
    --header-h: 64px;
    --step-2: 26px;
    --step-3: 44px;
    --step-4: 48px;
    --step--1: 12px;
  }
}