/* ═══════════════════════════════════════════════════════════════
   ПОСТПИЛОТ · Лендинг v5 · Реализация
   Значения перенесены 1:1 из reference/source/landing.dc.html.
   Токены — styles/tokens.css. Здесь: ресеты, кейфреймы,
   hover/active-состояния (из style-hover/style-active),
   адаптивность (брейкпоинт 768px), нативный слайдер.
   ═══════════════════════════════════════════════════════════════ */

/* ── Кейфреймы (копия из исходного <style>) ── */
@keyframes tickerA{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes barGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes sunSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes moonSway{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(14deg)}}
@keyframes borderComet{to{transform:rotate(360deg)}}
@keyframes caretBlink{0%,100%{opacity:1}50%{opacity:0}}
@keyframes popIn{from{transform:scale(.55);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes chipIn{from{opacity:0;transform:translateY(10px) scale(.85)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes chipFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(-.4deg)}}
@keyframes calIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes todayRing{0%,100%{box-shadow:0 0 0 0 rgba(255,210,63,.55)}55%{box-shadow:0 0 0 7px rgba(255,210,63,0)}}
@keyframes hlPulse{0%,100%{opacity:.75}50%{opacity:1}}
@keyframes badgeBob{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-7px) rotate(-8deg)}60%{transform:translateY(2px) rotate(5deg)}}
@keyframes arrowNudge{0%,100%{transform:translateX(0);opacity:.55}50%{transform:translateX(6px);opacity:1}}
@keyframes pulseDot{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes caret{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes tapRipple{0%{box-shadow:0 0 0 0 rgba(255,210,63,.65)}70%,100%{box-shadow:0 0 0 15px rgba(255,210,63,0)}}
@keyframes tapRippleG{0%{box-shadow:0 0 0 0 rgba(111,199,154,.6)}70%,100%{box-shadow:0 0 0 15px rgba(111,199,154,0)}}
@keyframes tapCore{0%,100%{transform:scale(1)}50%{transform:scale(.72)}}

/* ── Ресет / база ── */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-mono);
  position:relative;isolation:isolate;overflow-x:hidden;min-height:100vh}
a{text-decoration:none;color:inherit}
img{max-width:100%}
input,button{font-family:var(--font-mono)}

/* ── Фоновое видео на весь вьюпорт ── */
.bg-video{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero-overlay{position:fixed;inset:0;background:var(--hero-overlay);z-index:-1;pointer-events:none}

/* ── Верхняя жёлтая полоса ── */
.accent-bar{height:var(--topbar-accent-h);background:var(--accent);position:relative}

/* ── Контейнеры экранов / брейкпоинт 768 ── */
.screen{width:100%;position:relative}
.screen-desktop{max-width:var(--w-desktop);margin:0 auto}
.screen-mobile{max-width:var(--w-mobile);margin:0 auto}
.screen-mobile{display:none}
@media (max-width:767.98px){
  .screen-desktop{display:none}
  .screen-mobile{display:block}
}

/* ── Переключатель темы: позиция ползунка + иконки ── */
.toggle-knob{left:2px}
.dark .toggle-knob{left:34px}
.toggle-knob-m{left:2px}
.dark .toggle-knob-m{left:27px}
.icon-sun{display:flex}
.icon-moon{display:none}
.dark .icon-sun{display:none}
.dark .icon-moon{display:flex}

/* ── Состояния кнопок (style-hover / style-active из исходника) ── */
.nav-link{cursor:pointer}
.nav-link:active{transform:translateY(1px);opacity:.7}

.btn-login{transition:transform var(--dur-hover) ease}
.btn-login:hover{transform:translate(-1px,-1px)}
.btn-login:active{transform:translate(2px,2px);box-shadow:0 0 0 rgba(0,0,0,0)}
/* мобильная «войти →»: только active, transition .08s (десктопного hover нет) */
.btn-login-m{transition:transform var(--dur-press) ease,box-shadow var(--dur-press) ease}
.btn-login-m:active{transform:translate(2px,2px);box-shadow:0 0 0 rgba(0,0,0,0)}

.btn-cta{transition:transform var(--dur-press) ease,box-shadow var(--dur-press) ease}
.btn-cta:active{transform:translate(2px,2px);box-shadow:0 0 0 rgba(0,0,0,0)}
.btn-cta-hero{transition:transform var(--dur-press) ease,box-shadow var(--dur-press) ease}
.btn-cta-hero:active{transform:translate(3px,3px);box-shadow:0 0 0 rgba(0,0,0,0)}

.btn-demo{transition:transform var(--dur-press) ease}
.btn-demo:active{transform:scale(.96)}

.btn-x{transition:transform var(--dur-press) ease}
.btn-x:active{transform:scale(.85)}

.step-card,.mstep{transition:transform var(--dur-press) ease}
.step-card:active,.mstep:active{transform:scale(.98)}

.btn-approve{transition:transform var(--dur-press) ease,box-shadow var(--dur-press) ease}
.btn-approve:active{transform:translate(3px,3px);box-shadow:0 0 0 rgba(0,0,0,0)}
.btn-approve-m:active{transform:translate(2px,2px);box-shadow:0 0 0 rgba(0,0,0,0)}

/* ── Календарь: ячейка / чип ── */
.cal-cell{transition:background var(--dur-chip)}
.cal-cell:hover{background:var(--cell-hover) !important}
.cal-chip{transition:transform var(--dur-chip) var(--ease-pop),box-shadow var(--dur-chip),opacity .2s;cursor:grab}
.cal-chip:hover{transform:translateY(-4px) scale(1.05) rotate(-.6deg);box-shadow:var(--shadow-chip-hover);animation-play-state:paused,paused}

/* ── Нативный слайдер каналов ── */
input[type=range].chan-range{accent-color:#FFD23F;cursor:pointer;height:22px;margin:0}

/* ── Скрытие по режиму (normal / waitlist) ──
   !important — чтобы перебить инлайновый display:flex у hero-блоков */
body[data-mode="normal"] .only-wait{display:none !important}
body[data-mode="waitlist"] .only-normal{display:none !important}