/* Общие токены сайта (:root) и сброс — первая часть бывшего invitation.css. Нужна и гостевой
   странице, и конструктору; на пререндеренных публичных страницах грузится блокирующе (без неё
   страница без шрифтов/цветов), остальной CSS приглашения и тем — не задерживая отрисовку. */
:root {
  /* Система Claude Design (2026-09): белый фон, чернила, коралл. Токены хрома конфигуратора
     и служебных страниц; шаблоны живут в своих .invite-theme--* и сюда не смотрят. */
  --c-ivory: #F5F2EE;
  --c-warm-white: #FFFFFF;
  --c-paper: #FFFFFF;

  --c-ink: #14110F;
  --c-muted: #6E655D;

  --c-sage: #C4402B;
  --c-olive: #14110F;
  --c-olive-hover: #E8503A;

  --c-band: #14110F;
  --c-band-ink: #FBF9F7;
  --c-band-line: rgba(255,255,255,0.18);
  --c-sage-light: #F4C9C0;
  --c-sand: #F5F2EE;

  --c-line: rgba(20,17,15,0.10);
  --c-line-strong: rgba(20,17,15,0.22);
  --c-card: rgba(255,255,255,0.92);

  --c-success: #1F7A4C;
  --c-warning: #9A7B3E;
  --c-warning-ink: #8A5F16;
  --c-danger: #C4402B;

  --f-display: "Pozovem Ruble","Playfair Display",Georgia,serif;
  --f-body: "Golos Text","Inter",system-ui,sans-serif;
  --f-mono: "JetBrains Mono",ui-monospace,monospace;

  --container: 1280px;
  --mobile-pad: 20px;

  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-pill: 999px;

  --shadow-card: 0 4px 24px rgba(20,17,15,0.06);
  --shadow-card-hover: 0 8px 32px rgba(20,17,15,0.12);
  --shadow-lift: 0 12px 28px rgba(20,17,15,0.10);
  --shadow-focus: 0 0 0 3px rgba(232,80,58,0.35);

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --section-y: 88px;
}
* { box-sizing: border-box; }
body { margin: 0; }
button, input, textarea, select { font: inherit; }
/* Переход на экран, часть скрипта которого ещё догружается (src/lazy/modules.ts): тонкая полоска
   вверху. Появляется с задержкой — на быстрой сети переход короче и полоска не мелькает. */
body.is-nav-pending::after { content: ""; position: fixed; z-index: 2147483000; top: 0; left: 0; height: 3px; width: 100%; background: linear-gradient(90deg, transparent, #C4402B 40%, #C4402B 60%, transparent); background-size: 50% 100%; background-repeat: no-repeat; opacity: 0; pointer-events: none; animation: nav-pending-in .2s ease .15s forwards, nav-pending-run 1.1s linear .15s infinite; }
body.is-nav-pending { cursor: progress; }
@keyframes nav-pending-in { to { opacity: 1; } }
@keyframes nav-pending-run { from { background-position: -50% 0; } to { background-position: 150% 0; } }
@media (prefers-reduced-motion: reduce) { body.is-nav-pending::after { animation: nav-pending-in .2s ease .15s forwards; background: #C4402B; } }