/* ==========================================================================
   Nova Play Cafe — токены оформления = дизайн-система, tokens.json v3 (in/ds/nova-play-cafe/design-system).
   Значения перенесены 1:1; имена WonderWalk сохранены (--brand, --brand-2, --ink, --ink-soft, --paper,
   --cream, --gold, --ok, --radius, --shadow, --maxw, --cta-h, --lp-vh). Движение — motion.css (19) по именам.
   ========================================================================== */
@font-face { font-family: "Baloo 2"; src: url("../fonts/baloo2.woff2") format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/montserrat.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }

:root {
  /* --- Цвет (tokens.json → color) ----------------------------------- */
  --cream:        #FCF0F4;  /* фон страницы (blush) */
  --paper:        #FFFFFF;  /* карточки, шторки, панель, белые секции */
  --pink-2:       #FCD8E8;  /* верх облака, оттенки, диски галочек */
  --pink-1:       #FCC6DD;  /* низ облака; мелкий текст на нём — только ink */
  --brand:        #E35584;  /* hot pink — заливка главной пилюли; белая подпись только ≥ 19 px / 800 */
  --brand-strong: #D3346E;  /* маленькие пилюли ≤ 18 px с белым текстом; наведение на brand */
  --brand-2:      #D40754;  /* raspberry: заголовки, нажатие, ссылки, фокус */
  --ink:          #4E2A55;  /* plum: текст, цены, счётчики */
  --ink-soft:     #7A5A80;  /* вторичный текст; не на pink-1 */
  --ink-mute:     #876B8D;  /* подсказки ≥ 14 px, только на paper */
  --gold:         #FFC93C;  /* искры, Best value, Free */
  --gold-deep:    #F2B51E;  /* основание короны */
  --lavender:     #B689C0;  /* только декор: рамка [confirm] */
  --logo-red:     #E20E0A;  /* только логотип */
  --logo-blue:    #275AC4;  /* подписи ряда значков, ссылки на карту, инфо-значки */
  --ok: #1B7A50;   --ok-tint: #E3F5EC;
  --warn: #9E5A06; --warn-tint: #FFF1D6;
  --err: #B5102A;  --err-tint: #FDE3E7;
  --scrim-photo: 58 36 64;   /* #3A2440 — rgb для rgba(var(--scrim-photo) / α) */
  --scrim-layer: 42 21 48;   /* #2A1530 — под шторками/окнами с прозрачностью из motion.css */
  --shadow-tint: 212 7 84;   /* #D40754 — единственный цвет тени */
  --focus:        #D40754;
  /* рамки, снятые с макетов системы (ring-цвета компонентов) */
  --ring-field:   #EBD3DE;   /* поле ввода, карточка выбора */
  --ring-pink:    #F6A9C6;   /* вторичная пилюля, «−» счётчика, ячейки */
  --ring-soft:    #F3D6E3;   /* клетка полоски дней */
  --ring-mute:    #C9AFCD;   /* пустая радиокнопка/флажок, неактивный «−» */
  --divider:      rgba(212, 7, 84, .12); /* линии внутри списков */
  --closed-fill:  #F3EEF2;   /* понедельник в полоске дней */
  --closed-ink:   #7A5A80;   /* в макете #9A869E (2.9:1) — затемнён до ink-soft ради AA, зачёркивание остаётся */
  --pill-disabled:#F6C9DA;
  --plum-meta:    #6B3E73;   /* строка под заголовком зоны (макет), [confirm] */

  /* --- Шрифты (tokens.json → type) ---------------------------------- */
  --font-display: "Baloo 2", "Fredoka", system-ui, sans-serif;
  --font-body: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  /* телефон */
  --t-h1: 44px;  --t-h1-lh: 42px; --t-h1-ls: -0.5px;
  --t-h2: 36px;  --t-h2-lh: 36px; --t-h2-ls: -0.3px;
  --t-h3: 24px;  --t-h3-lh: 26px; --t-h3-ls: -0.2px;
  --t-price: 46px; --t-total: 44px;
  --t-lead: 17px; --t-lead-lh: 26px;
  --t-body: 16px; --t-body-lh: 24px;
  --t-small: 14px; --t-small-lh: 20px;
  --t-eyebrow: 14px; --t-eyebrow-lh: 18px; --t-eyebrow-ls: 1.4px;
  --t-btn-lg: 19px; --t-btn-md: 16px; --t-btn-sm: 14px;
  --t-counter: 20px; --t-input: 16px; --t-icon-label: 14px;

  /* --- Сетка (tokens.json → spacing) --------------------------------- */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px;
  --space-7: 32px; --space-8: 40px; --space-9: 48px; --space-10: 64px; --space-11: 80px;
  --gutter: 16px;
  --maxw: 620px;
  --maxw-desktop: 1200px;
  --section-top: 48px; --section-bottom: 64px;
  --cta-h: 78px;
  --control-lg: 56px; --control-md: 52px; --control-sm: 44px; --control-chip: 32px;
  --header-h: 64px;
  --icon-disc: 56px;
  --qr: 72px;
  --sheet-max: 92%;
  --lp-vh: 100vh; --lp-vh: 100svh;   /* = WW, JS замораживает в px */

  /* --- Форма (tokens.json → radius) ---------------------------------- */
  --radius: 24px;        /* фото-рамки */
  --radius-card: 28px;   /* карточки, панель списка, билеты, календарь */
  --radius-cloud: 44px;  /* облако (60 на компьютере) */
  --radius-sheet: 28px;
  --radius-modal: 32px;
  --radius-inset: 12px;  /* вложенные блоки */
  --radius-input: 16px;
  --radius-pill: 999px;
  --radius-tag: 6px;
  --radius-row: 16px;
  --radius-cell: 8px;
  --radius-tile: 24px;

  /* --- Глубина (tokens.json → shadow) --------------------------------- */
  --shadow: 0 18px 44px rgba(212, 7, 84, .16);
  --shadow-bar: 0 -8px 24px rgba(212, 7, 84, .12);
  --shadow-bar-d: 0 8px 24px rgba(212, 7, 84, .12);
  --shadow-toast: 0 10px 28px rgba(212, 7, 84, .14);
  --shadow-pill: 0 8px 20px rgba(212, 7, 84, .16);
  --shadow-sticker: 0 10px 24px rgba(212, 7, 84, .20);

  /* --- Фото (tokens.json → photo) ------------------------------------ */
  --photo-wash: rgba(252, 214, 232, .10);
  --photo-filter: saturate(1.05) contrast(1.03);
  --photo-scrim: linear-gradient(180deg, rgba(58, 36, 64, 0) 40%, rgba(58, 36, 64, .72) 100%);
  --photo-scrim-tile: linear-gradient(180deg, rgba(58, 36, 64, 0) 52%, rgba(58, 36, 64, .74) 100%);
  --photo-empty: #FCD8E8;

  /* --- Облако --------------------------------------------------------- */
  --cloud-fill: linear-gradient(180deg, #FCD8E8 0%, #FCC6DD 100%);
}

@media (min-width: 1024px) {
  :root {
    --t-h1: 64px; --t-h1-lh: 60px; --t-h1-ls: -1px;
    --t-h2: 48px; --t-h2-lh: 48px; --t-h2-ls: -0.5px;
    --t-price: 48px; --t-total: 52px;
    --gutter: 24px;
    --section-top: 64px; --section-bottom: 80px;
    --header-h: 84px;
    --icon-disc: 76px;
    --radius-cloud: 60px;
  }
}