/* =============================================================================
   Bloom — дизайн-токени
   =============================================================================
   Кожна змінна тут відповідає колонці в таблиці tenant_branding.
   Це не декоративний збіг: сервер віддає CSS-змінні під кожен бренд,
   і білий лейбл перефарбовується без збірки фронтенду.

   Рішення 19-А: палітра затверджена.
   Рішення 21-В: темної теми немає — кремовий світлий і є характером бренду.
   ============================================================================= */

:root {
  /* ── Кольори (= tenant_branding.color_*) ───────────────────────────────── */
  --bg:            #FDF8F3;  /* кремовий фон */
  --card-pink:     #F9D5CE;
  --card-lilac:    #DDD4F2;
  --card-sage:     #CFDEC6;
  --card-butter:   #F7E5B0;
  --accent:        #E8836F;  /* корал — єдиний CTA-колір */
  --ink:           #2E2823;  /* не чорний: чорний на кремовому «дзвенить» */
  --ink-muted:     #8A8177;

  /* Похідні: світліші заливки для великих площин */
  --pink-soft:     #FDEEEB;
  --lilac-soft:    #F0ECFA;
  --sage-soft:     #E8F0E3;
  --butter-soft:   #FDF5DF;

  --surface:       #FFFFFF;
  --hairline:      rgba(46, 40, 35, 0.08);

  /* ── Типографіка (= tenant_branding.font_*) ────────────────────────────── */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Великі числа — герой кожної картки */
  --size-hero:    clamp(3.5rem, 14vw, 4.5rem);
  --size-xl:      1.75rem;
  --size-lg:      1.25rem;
  --size-md:      1rem;
  --size-sm:      0.875rem;
  --size-xs:      0.75rem;

  /* ── Форма ─────────────────────────────────────────────────────────────── */
  --radius-card:   28px;
  --radius-inner:  16px;
  --radius-pill:   999px;

  /* Тіні дуже м'які: різка тінь на пастелі виглядає дешево */
  --shadow-card:  0 8px 24px rgba(46, 40, 35, 0.06);
  --shadow-lift:  0 12px 32px rgba(46, 40, 35, 0.10);

  /* ── Ритм ──────────────────────────────────────────────────────────────── */
  --gap:          14px;
  --pad-screen:   20px;
  --tabbar-h:     76px;
}

/* Повага до системного налаштування «зменшити рух».
   Для аудиторії з тривожністю це не формальність. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}