:root {
  --paper: #f4f3f8;
  --white: #fff;
  --ink: #25283d;
  --muted: #6d6b8a;
  --violet: #7a6fa8;
  --lilac: #e8e4f3;
  --line: #dcd9e6;
  --skin: #efba9f;
  --serif: "EB Garamond", "Times New Roman", serif;
  --sans: "Inter", system-ui, sans-serif;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --pad: max(clamp(1.25rem, 5.5vw, 5rem), env(safe-area-inset-left), env(safe-area-inset-right));
}

* { box-sizing: border-box; margin: 0; }
html { scroll-behavior: smooth; scrollbar-color: var(--violet) var(--paper); }
::selection { background: var(--ink); color: var(--paper); }
body { font: 400 1.0625rem/1.5 var(--sans); color: var(--ink); background: var(--paper); overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
ul, ol { padding: 0; list-style: none; }
:focus-visible { outline: 2px solid var(--violet); outline-offset: 4px; }

h1 { font-family: var(--serif); font-weight: 400; text-wrap: balance; }
.wrap { padding-inline: var(--pad); }

/* ---------- первый экран ---------- */
.hero { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: hidden; isolation: isolate; }
.hero__bg { position: absolute; inset: -3%; z-index: -2; background: url(img/hero-poster.jpg) 70% 50% / cover no-repeat; transform: translate3d(var(--px, 0px), var(--py, 0px), 0); transition: transform .6s var(--ease-out); }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, var(--paper) 0%, rgba(244, 243, 248, .86) 30%, rgba(244, 243, 248, 0) 58%); }

.hero__text { position: relative; z-index: 4; width: min(44rem, 56vw); padding: 3rem var(--pad) 4rem; }
h1 { font-size: clamp(2.9rem, 7.2vw, 6rem); line-height: .98; letter-spacing: .01em; text-transform: uppercase; }
.hero__claim { margin-top: 1.5rem; font: 700 clamp(1.4rem, 2.6vw, 2.3rem)/1.15 var(--sans); letter-spacing: -.02em; text-wrap: balance; }
.hero__lead { margin-top: 1rem; max-width: 24em; font-size: clamp(1.1rem, 1.7vw, 1.5rem); line-height: 1.35; color: var(--muted); }
.hero__when { display: flex; flex-wrap: wrap; gap: .25em 1.5em; margin-top: 2.25rem; padding-top: 1.25rem; border-top: 1px solid var(--line); font-size: clamp(1.05rem, 1.6vw, 1.4rem); }
.hero__when b { font-weight: 700; }
.hero__buttons { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 2rem; }

.btn { display: inline-block; padding: 1em 1.6em; font: 600 1rem var(--sans); text-decoration: none; border: 1px solid var(--ink); transition: background .35s var(--ease-out), color .35s var(--ease-out), transform .35s var(--ease-out); }
.btn--ink { color: var(--paper); background: var(--ink); }
.btn--line { color: var(--ink); background: rgba(255, 255, 255, .55); }
.btn--ink:hover { background: var(--violet); border-color: var(--violet); }
.btn--line:hover { background: var(--ink); color: var(--paper); }
.btn:active { transform: translateY(1px); }

/* ---------- второй экран: пузыри (макет .impeccable/mocks/comp-b.png) ---------- */
.pop { --u: 1vw; --ink-2: #4c4b70; position: relative; height: max(40rem, 56.25vw); overflow: hidden; isolation: isolate; background: linear-gradient(180deg, #f1f0fa 0%, #e7e6f6 100%); }

.pop__text { position: absolute; z-index: 4; left: 39.8%; top: 10.4%; width: min(54%, 54rem); }
h2 { font: 500 clamp(2rem, 4.15vw, 5.4rem)/1.02 var(--serif); letter-spacing: .01em; text-transform: uppercase; text-wrap: balance; }
.pop__lead { margin-top: clamp(.9rem, 1.5vw, 1.6rem); max-width: 36em; font-size: clamp(1rem, 1.45vw, 1.6rem); line-height: 1.4; color: var(--ink-2); }

.pop__air { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.pop::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; height: 14%; background: linear-gradient(rgba(231, 230, 246, 0), #e7e6f6 85%); pointer-events: none; }
.pop__verbs { position: absolute; inset: 0; z-index: 3; pointer-events: none; }

/* пузырь: плёнка — картинка, плавает и лопается от клика */
.bubble, .ball { position: absolute; left: var(--x); top: var(--y); width: calc(var(--s) * var(--u)); aspect-ratio: 1; margin: calc(var(--s) * var(--u) / -2) 0 0 calc(var(--s) * var(--u) / -2); animation: drift var(--t, 8s) ease-in-out infinite alternate; }
.bubble { display: block; border-radius: 50%; pointer-events: auto; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.bubble::before { content: ""; position: absolute; inset: 0; background: url(img/bubble.webp) center / contain no-repeat; transition: transform 1s var(--ease-out), opacity .45s var(--ease-out); }
.bubble.is-popped::before { transform: scale(1.22); opacity: 0; transition: transform .16s ease-out, opacity .16s ease-out; }
.bubble.is-gone::before { transform: scale(.15); opacity: 0; transition: none; }
.bubble:nth-child(3n) { animation-delay: -2.4s; }
/* одна плёнка на все пузыри — повёрнута и отражена по-разному, чтобы радуга не повторялась */
.bubble:nth-child(4n + 2)::before { rotate: 95deg; }
.bubble:nth-child(4n + 3)::before { rotate: 205deg; scale: -1 1; }
.bubble:nth-child(4n)::before { rotate: -60deg; scale: -1 1; }
.bubble:nth-child(3n + 1) { animation-delay: -5.1s; }
.ball { animation-delay: -3s; filter: drop-shadow(0 .5rem .6rem rgba(37, 40, 61, .16)); }
@keyframes drift { from { translate: 0 0; } to { translate: var(--dx, 6px) var(--dy, -12px); } }

.bubble--verb { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 calc(var(--s) * var(--u) * .12); text-align: center; }
.bubble--verb b { position: relative; font: 500 clamp(1.6rem, 3.25vw, 4.2rem)/1.05 var(--serif); }
.bubble--verb span { position: relative; max-width: 11em; margin-top: .5em; font-size: clamp(.85rem, 1.22vw, 1.4rem); line-height: 1.3; color: var(--ink-2); text-wrap: balance; }

.disco { position: absolute; top: 0; width: calc(12 * var(--u)); transform-origin: 50% 0; animation: swing 5.5s ease-in-out infinite alternate; filter: drop-shadow(0 .6rem .7rem rgba(37, 40, 61, .14)); }
.disco--l { left: calc(3.9% - 6 * var(--u)); }
.disco--r { left: calc(96.4% - 6 * var(--u)); top: -2%; animation-delay: -2.2s; }
@keyframes swing { from { rotate: -3deg; } to { rotate: 3deg; } }

.fleck { position: absolute; left: var(--x); top: var(--y); width: .5rem; aspect-ratio: 1; rotate: calc(45deg + var(--r)); background: linear-gradient(135deg, #fff 0%, #cfd0e4 45%, #8e92b8 100%); box-shadow: 0 1px 2px rgba(37, 40, 61, .2); }
.fleck:nth-child(odd) { width: .32rem; aspect-ratio: .5; }
.fleck { animation: twinkle 2.8s ease-in-out infinite; }
.fleck:nth-child(3n) { animation-delay: -1.1s; }
.fleck:nth-child(3n + 1) { animation-delay: -2s; }
@keyframes twinkle { 0%, 100% { opacity: .35; scale: .75; } 50% { opacity: 1; scale: 1.15; } }
.splash { position: absolute; z-index: 2; pointer-events: none; }

.drop { position: absolute; z-index: 2; width: var(--d); aspect-ratio: 1; border-radius: 50%; pointer-events: none; background: radial-gradient(circle at 34% 30%, #fff 0 20%, rgba(190, 172, 250, .95) 44%, rgba(122, 170, 230, .7) 64%, rgba(122, 111, 168, .5) 70%, transparent 72%); }
.glint { position: absolute; z-index: 2; width: var(--d); aspect-ratio: 1; pointer-events: none; background: #fff; clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%); filter: drop-shadow(0 0 2px rgba(122, 111, 168, .9)); }

/* Дед Мороз вниз головой: держится за край первого экрана */
.ded.ded--peek { --w: clamp(13rem, 25vw, 32rem); position: absolute; z-index: 5; left: 21.5%; top: 0; width: var(--w); margin-left: calc(var(--w) / -2); transform: translateY(-102%); transition: transform 1.1s var(--ease-out); }
.ded.ded--peek.is-out { transform: translateY(0); transition-delay: .35s; }
.ded.ded--peek img { filter: drop-shadow(0 1rem 1.2rem rgba(37, 40, 61, .2)); }

/* ---------- третий экран: «в зале гаснет свет» — программа трейлером ---------- */
/* после светлого зала — сумерки и темнота; сцены переключаются прокруткой, кадр во всю ширину экрана */
.show { --night: #02071a; --bar: #02071a; --silver: #eef0ff; --ice: #b4bdf0; background: var(--night); color: var(--silver); }
.show__dusk { display: flex; align-items: flex-end; min-height: 95svh; padding: 0 var(--pad) 10svh; background: linear-gradient(180deg, #e7e6f6 0%, #c9c5e6 10%, #8a86bb 24%, #45427a 40%, #1a1a40 58%, var(--night) 76%); }
.show__dusk h2 { max-width: 11ch; font-size: clamp(2.6rem, 7.4vw, 8rem); line-height: .95; color: var(--silver); }

.show__reel { position: relative; height: calc(var(--n) * 100svh); }
/* мягкие остановки: прокрутка «присаживается» в начало каждой сцены, вход успевает сыграть */
html:has(.show) { scroll-snap-type: y proximity; }
.show__snap { position: absolute; left: 0; width: 1px; height: 1px; top: calc((var(--i) + .06) * (var(--n) - 1) * 100svh / var(--n)); scroll-snap-align: start; pointer-events: none; }
.show__stage { position: sticky; top: 0; display: grid; place-content: center; height: 100svh; padding-bottom: 6rem; overflow: hidden; background: var(--bar); }
/* кадр во всю ширину; на низких экранах подрезается по высоте, а не сужается */
.show__shots { position: relative; width: 100vw; height: min(100vw * 9 / 21, 100svh - 12rem); }

.shot { position: absolute; inset: 0; opacity: 0; transition: opacity .9s var(--ease-out); }
.shot.is-on { opacity: 1; }
.shot::after { content: ""; position: absolute; inset: -1px 0 -2px; background: linear-gradient(0deg, var(--bar) 0, var(--bar) 3px, rgba(2, 7, 26, .88) 6%, rgba(2, 7, 26, .45) 20%, rgba(2, 7, 26, 0) 42%), linear-gradient(180deg, var(--bar) 0, rgba(2, 7, 26, 0) 5%); pointer-events: none; }
.shot__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--focus, 50% 50%); }
/* вход сцены играет один раз, потом без шва включается петля с его последнего кадра */
.shot__loop { opacity: 0; transition: opacity .4s ease; }
.shot.is-looping .shot__loop { opacity: 1; }
.shot__text { position: absolute; z-index: 2; left: var(--pad); top: 100%; max-width: 70%; translate: 0 -48%; }
.shot__text h3 { font: 500 clamp(2.2rem, 5.4vw, 6.4rem)/.92 var(--serif); letter-spacing: .01em; text-transform: uppercase; text-wrap: balance; color: var(--silver); }
.shot__text p { max-width: 24em; margin-top: 1.1rem; font-size: clamp(1rem, 1.3vw, 1.35rem); line-height: 1.4; color: var(--ice); }
.shot__text > * { opacity: 0; transform: translateY(1.4rem); transition: opacity .8s var(--ease-out), transform 1s var(--ease-out); }
.shot.is-on .shot__text > * { opacity: 1; transform: none; transition-delay: .3s; }
.shot.is-on .shot__text p { transition-delay: .5s; }

.show__chapters { position: absolute; right: var(--pad); bottom: clamp(1rem, 2.6svh, 2rem); display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .6rem clamp(1.2rem, 3vw, 3rem); }
.show__chapters button { position: relative; padding: .45rem 0; font: 600 .78rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: rgba(238, 240, 255, .62); background: none; border: 0; cursor: pointer; transition: color .3s var(--ease-out); }
.show__chapters button::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--silver); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s var(--ease-out); }
.show__chapters button:hover, .show__chapters [aria-current="true"] { color: var(--silver); }
.show__chapters [aria-current="true"]::after { transform: scaleX(1); }
.show__chapters button:focus-visible { outline: 2px solid var(--ice); outline-offset: 5px; }

/* ---------- четвёртый экран: билеты (макет .impeccable/mocks/tickets-a.png) ---------- */
/* после трейлера в зале снова зажигается свет: тёмная полоса светлеет до бумаги, в ней загораются пятна прожекторов */
.tix { --u: 1vw; --dawn: clamp(7rem, 14vw, 16rem); --glow: 6.2vw; --ground: #f0f0fb; --ink-2: #4c4b70; position: relative; overflow: hidden; isolation: isolate; padding-top: var(--dawn);
  background: linear-gradient(180deg, #02071a 0, #1a1a40 calc(var(--dawn) * .36), #45427a calc(var(--dawn) * .72), #4f5d92 var(--dawn), #8088b6 calc(var(--dawn) + var(--glow) * .3), #b8bcdc calc(var(--dawn) + var(--glow) * .6), #e4e4f6 calc(var(--dawn) + var(--glow)), var(--ground) calc(var(--dawn) + var(--glow) * 2), #f0effb 100%); }
.tix::before { content: ""; position: absolute; z-index: 0; left: 0; right: 0; top: calc(var(--dawn) * .25); height: calc(var(--dawn) * 1.05); pointer-events: none; opacity: 0; transition: opacity 1.8s var(--ease-out) .2s;
  background: radial-gradient(ellipse 10% 42% at 12% 74%, rgba(176, 181, 232, .78), rgba(176, 181, 232, 0)), radial-gradient(ellipse 12% 46% at 58% 72%, rgba(176, 181, 232, .74), rgba(176, 181, 232, 0)), radial-gradient(ellipse 9% 40% at 85% 76%, rgba(176, 181, 232, .78), rgba(176, 181, 232, 0)); }
.tix.is-lit::before { opacity: 1; }
.tix__stage { position: relative; min-height: max(40rem, 56.25vw); padding: 18.42vw 0 5vw 9.57vw; }
.tix h2 { position: absolute; z-index: 3; left: 9.6vw; top: 8.3vw; font-size: clamp(3rem, 6.5vw, 7.9rem); line-height: .9; }

/* билеты, строка оплаты и условия — одним столбцом: билет вырос от текста — условия сдвигаются, а не налезают */
.tix__list { position: relative; z-index: 3; display: grid; grid-template-columns: 37.63vw 41.86vw; column-gap: 3.06vw; width: max-content; min-height: 20.25vw; }
.ticket { --stub: 6.5vw; --r: .62vw; --h: .26vw; --pitch: 1.05vw; --fx: 18%; position: relative; transition: translate .6s var(--ease-out); }
/* тень — на обёртке только вокруг билета: подарок качается снаружи, и тень не перерисовывается каждый кадр (замер 24.10.2026) */
.ticket__shade { height: 100%; filter: drop-shadow(0 .9vw 1.3vw rgba(37, 40, 61, .13)) drop-shadow(0 1px 1px rgba(37, 40, 61, .14)); }
.ticket--gift { --fx: 82%; }
.ticket:hover { translate: 0 -.3vw; }
/* фольга — картинка; форма билета, кромка картона, вырезы, перфорация и штрихкод — код */
.ticket__card { position: relative; display: grid; grid-template-columns: 1fr var(--stub); height: 100%; overflow: hidden;
  box-shadow: inset 0 -2px 0 rgba(90, 86, 150, .45), inset -2px 0 0 rgba(90, 86, 150, .38), inset 0 1px 0 rgba(255, 255, 255, .75), inset 0 0 0 1px rgba(122, 111, 168, .26);
  background: url(img/foil.webp) calc(var(--fx) + (var(--sx, .5) - .5) * 40%) 50% / 150% auto;
  -webkit-mask: radial-gradient(circle at calc(100% - var(--stub)) 0, #0000 var(--r), #000 calc(var(--r) + .5px)) top / 100% 51% no-repeat, radial-gradient(circle at calc(100% - var(--stub)) 100%, #0000 var(--r), #000 calc(var(--r) + .5px)) bottom / 100% 51% no-repeat;
          mask: radial-gradient(circle at calc(100% - var(--stub)) 0, #0000 var(--r), #000 calc(var(--r) + .5px)) top / 100% 51% no-repeat, radial-gradient(circle at calc(100% - var(--stub)) 100%, #0000 var(--r), #000 calc(var(--r) + .5px)) bottom / 100% 51% no-repeat; }
/* блик фольги: за курсором, на телефоне — от прокрутки */
.ticket__card::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: soft-light;
  background: linear-gradient(105deg, rgba(255, 255, 255, 0) calc(var(--sx, .3) * 100% - 24%), rgba(255, 255, 255, .7) calc(var(--sx, .3) * 100%), rgba(255, 255, 255, 0) calc(var(--sx, .3) * 100% + 24%)); }
.ticket__body { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; padding: 2.9vw 2vw 1.9vw 3.7vw; }
/* «Билет без подарка» и «Билет с подарком» — одной длины и одного кегля */
.ticket__name { font: 600 clamp(1.5rem, 2.95vw, 3.6rem)/.95 var(--serif); }
.ticket .ticket__body { padding-top: 2.6vw; }
.ticket__price { margin-top: .6vw; font: 600 clamp(2.4rem, 5.1vw, 6.2rem)/.9 var(--serif); letter-spacing: -.01em; font-variant-numeric: lining-nums; }
.ticket__note { max-width: 20em; margin-top: .6vw; font-size: clamp(.85rem, 1.2vw, 1.4rem); line-height: 1.3; color: var(--ink-2); }
.ticket__buy { margin-top: 2.5vw; padding: .7em 2.8em; font-size: clamp(.9rem, 1.17vw, 1.35rem); font-weight: 500; }
.ticket--gift .ticket__buy { margin-top: 1.1vw; padding-inline: 3.2em; }
.ticket__stub { position: relative; }
/* перфорация — пробитые дырочки: в них видна бумага зала, по краю тень и светлый ободок */
.ticket__stub::before { content: ""; position: absolute; left: calc(var(--h) * -2); width: calc(var(--h) * 4); top: calc(var(--r) * 1.6); bottom: calc(var(--r) * 1.6);
  background: radial-gradient(circle, var(--ground) 0 var(--h), rgba(90, 86, 150, .5) calc(var(--h) + .6px), rgba(255, 255, 255, .8) calc(var(--h) + 1.6px), rgba(255, 255, 255, 0) calc(var(--h) + 2.6px)) 50% 0 / 100% var(--pitch) repeat-y; }
.ticket__stub::after { content: ""; position: absolute; left: 31%; right: 31%; top: 17%; bottom: 17%; background: url(img/barcode.svg) 0 0 / 100% 100% no-repeat; }
.ticket__gift { position: absolute; z-index: 2; left: 55.4%; top: -8.6vw; width: 17.3vw; filter: drop-shadow(0 1vw 1.1vw rgba(37, 40, 61, .2)); animation: drift 7s ease-in-out infinite alternate; --dx: 0px; --dy: -8px; pointer-events: none; }

.tix__terms { position: relative; z-index: 3; width: 79.9vw; margin: 3.7vw 0 0 .2vw; padding-top: 1.55vw; border-top: 1px solid #bdbcd6; font-size: clamp(.95rem, 1.24vw, 1.45rem); line-height: 1.45; color: var(--ink-2); }
.tix__terms li + li { margin-top: .5vw; }

.tix__air { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.tix .disco { width: 12vw; }
.tix .disco--l { left: calc(3.6% - 6vw); top: 0; }
.tix .disco--r { left: calc(95.7% - 6vw); top: -1.3vw; }

/* ---------- пятый экран: когда и где (макет .impeccable/mocks/where-a.png) ---------- */
/* четыре зеркальных шара на нитках — четыре дня шоу, парами по выходным; шары спускаются, когда экран появляется, и пускают зайчиков */
.where { --u: 1vw; --ink-2: #4c4b70; --hair: #c9c8e0; position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(180deg, #f0effb 0, #f0f0fd 40%, #ececfc 100%); }
.where__stage { position: relative; min-height: max(40rem, 56.25vw); padding: 38.9vw 0 5vw 8.3vw; }
.where h2 { position: absolute; z-index: 3; left: var(--pad); top: 4.6vw; font-size: clamp(2.6rem, 5.85vw, 7rem); line-height: .9; }

.where__dates { position: absolute; z-index: 2; inset: 0 0 auto; height: 36vw; }
.date { position: absolute; top: 0; left: var(--x); width: 16vw; margin-left: -8vw; display: flex; flex-direction: column; align-items: center; text-align: center; }
.date__hang { --lift: calc(-1 * (var(--len) + 12vw)); position: relative; display: block; width: 11.1vw; padding-top: var(--len); transform-origin: 50% 0; animation: swing var(--t, 6s) ease-in-out infinite alternate; }
/* шнур — серебряный, витой; за заголовком прячется (--gap0..--gap1 — где его закрывают буквы) */
.date__hang::before { content: ""; position: absolute; left: calc(50% - 1.25px); top: 0; width: 2.5px; height: calc(var(--len) + 2px);
  background: repeating-linear-gradient(160deg, #dcdef0 0 1px, #a9acd0 1px 2px, #7c7eaa 2px 2.8px);
  -webkit-mask: linear-gradient(#000 0 var(--gap0, 0), #0000 var(--gap0, 0) var(--gap1, 0), #000 var(--gap1, 0)); mask: linear-gradient(#000 0 var(--gap0, 0), #0000 var(--gap0, 0) var(--gap1, 0), #000 var(--gap1, 0)); }
.date__hang img { width: 100%; filter: drop-shadow(0 .6vw .7vw rgba(37, 40, 61, .16)); }
.where--hang .date__hang { translate: 0 var(--lift); }
.where--hang.is-hung .date__hang { translate: 0 0; transition: translate 1.5s cubic-bezier(.3, 1.25, .5, 1) var(--d, 0s), opacity .5s ease var(--d, 0s); }
.date b { margin-top: 2.1vw; font: 600 clamp(3rem, 7.6vw, 9.2rem)/.86 var(--serif); font-variant-numeric: lining-nums; }
.date span:last-child { margin-top: .9vw; font-size: clamp(1rem, 1.56vw, 1.85rem); color: var(--ink-2); }

/* солнечные зайчики: у каждого шара свои — светлые отражения зеркальных плиток плывут вокруг него, на цифры не заходят */
.date__specks { position: absolute; z-index: -1; left: -70%; top: var(--len); width: 240%; aspect-ratio: 2.4 / 1.3; translate: 0 -10%; container-type: size; pointer-events: none; opacity: 0; }
.where:not(.where--hang) .date__specks { opacity: 1; }
.where--hang.is-hung .date__specks { opacity: 1; transition: opacity 1.2s ease calc(var(--d, 0s) + 1.3s); }
.speck { position: absolute; left: var(--x); top: var(--y); width: var(--w); aspect-ratio: 1.35; border-radius: 18%; rotate: var(--r); opacity: 0;
  background: linear-gradient(135deg, #fff 0 35%, var(--c, #d6daff)); box-shadow: 0 0 .5vw .1vw rgba(150, 140, 232, .55); animation: sweep var(--t) linear infinite var(--dl); }
.speck--g { width: calc(var(--w) * 1.6); aspect-ratio: 1; border-radius: 0; rotate: 0deg; background: #fff; box-shadow: none; clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%); filter: drop-shadow(0 0 2px rgba(122, 111, 168, .9)); animation: glimmer var(--t) ease-in-out infinite var(--dl); }
@keyframes sweep { 0% { translate: -14cqw 0; opacity: 0; } 18% { opacity: var(--o, .9); } 82% { opacity: var(--o, .9); } 100% { translate: 14cqw var(--dy, 0); opacity: 0; } }
@keyframes glimmer { 0%, 100% { opacity: 0; scale: .4; } 45%, 55% { opacity: 1; scale: 1; } }

.where__info { position: relative; z-index: 3; width: 82.7vw; display: grid; grid-template-columns: 25.3vw 26vw 1fr; padding-top: 2vw; border-top: 1px solid var(--hair); }
.where__info > * + * { padding-left: 2.6vw; border-left: 1px solid var(--hair); }
.where__time { padding-top: 1.4vw; font-size: clamp(1rem, 1.56vw, 1.85rem); color: var(--ink-2); }
.where__place h3 { font: 600 clamp(1.3rem, 1.8vw, 2.15rem)/1.15 var(--serif); }
.where__place p { margin-top: .9vw; font-size: clamp(.95rem, 1.3vw, 1.55rem); color: var(--ink-2); }
.where__route { display: inline-flex; align-items: center; gap: .55em; margin-top: 1.3vw; font: 600 clamp(.95rem, 1.3vw, 1.55rem) var(--sans); color: #5a50a0; text-decoration: none; }
.where__route svg { width: 1.1em; transition: translate .4s var(--ease-out); }
.where__route:hover svg { translate: .3em 0; }
.where__route:hover { color: var(--ink); }
.where__contact { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8vw; align-content: start; padding-top: 1vw; }
.where__contact .btn { padding: .72em .4em; text-align: center; font-size: clamp(.9rem, 1.24vw, 1.45rem); font-weight: 500; }
.where__buy { grid-column: 1 / -1; margin-top: .65vw; }

.where__air { position: absolute; inset: 0; z-index: 1; pointer-events: none; }

/* средние экраны: время и площадка в ряд, связь — ниже во всю ширину */
@media (min-width: 861px) and (max-width: 1100px) {
  .where__info { grid-template-columns: 1fr 1.25fr; }
  .where__contact { grid-column: 1 / -1; grid-template-columns: repeat(3, 1fr) 1.6fr; margin-top: 2vw; padding: 2vw 0 0 !important; border-left: 0 !important; border-top: 1px solid var(--hair); }
  .where__buy { grid-column: auto; margin-top: 0; }
}

/* ---------- финал: подвал цвета чернил, Дед Мороз поднимается снизу и машет на прощание ---------- */
.fin { --silver: #eef0ff; --ice: #b4bdf0; --dusk: clamp(5rem, 9vw, 9rem); position: relative; overflow: hidden; isolation: isolate; min-height: max(28rem, 34vw); padding: calc(var(--dusk) + clamp(2rem, 4vw, 4rem)) var(--pad) clamp(3rem, 5vw, 5rem); color: var(--silver);
  background: linear-gradient(180deg, #ececfc 0, #c9c5e6 calc(var(--dusk) * .25), #8a86bb calc(var(--dusk) * .5), #45427a calc(var(--dusk) * .78), #2b2e48 var(--dusk), var(--ink) 60%, #1d2034 100%); }
.fin__text { position: relative; z-index: 2; max-width: 34rem; }
.fin__name { font: 400 clamp(2.4rem, 5.2vw, 6rem)/.95 var(--serif); letter-spacing: .01em; text-transform: uppercase; }
.fin__claim { margin-top: 1rem; font: 700 clamp(1.15rem, 1.9vw, 1.8rem)/1.2 var(--sans); letter-spacing: -.02em; }
.fin__when { display: flex; flex-wrap: wrap; gap: .25em 1.5em; margin-top: 1.6rem; padding-top: 1.2rem; border-top: 1px solid rgba(238, 240, 255, .22); font-size: clamp(.95rem, 1.2vw, 1.15rem); color: var(--ice); }
.fin__nav { display: flex; flex-wrap: wrap; gap: .6rem 1.8rem; margin-top: 1.6rem; }
.fin__nav a { position: relative; padding: .3rem 0; font: 600 .78rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: rgba(238, 240, 255, .7); text-decoration: none; transition: color .3s var(--ease-out); }
.fin__nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--silver); transform: scaleX(0); transform-origin: 0 50%; transition: transform .5s var(--ease-out); }
.fin__nav a:hover { color: var(--silver); }
.fin__nav a:hover::after { transform: scaleX(1); }
.fin__nav a:focus-visible { outline: 2px solid var(--ice); outline-offset: 4px; }
.fin__legal { margin-top: 2rem; font-size: .82rem; line-height: 1.6; color: rgba(180, 189, 240, .8); }
.fin__legal a { color: var(--silver); text-underline-offset: .2em; text-decoration-color: rgba(238, 240, 255, .4); }
.fin__legal a:hover { text-decoration-color: var(--silver); }
.fin__copy { margin-top: 1.4rem; font-size: .85rem; color: rgba(180, 189, 240, .75); }
.fin__air { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.ded.ded--bye { --w: clamp(15rem, 31vw, 33rem); position: absolute; z-index: 1; right: 6vw; bottom: 0; width: var(--w); transform: translateY(102%); transform-origin: 50% 100%; transition: transform 1.2s var(--ease-out); animation: bye-sway 5s ease-in-out infinite alternate; }
@keyframes bye-sway { from { rotate: -1.6deg; } to { rotate: 1.6deg; } }
.ded.ded--bye.is-out { transform: none; transition-delay: .2s; }
.ded.ded--bye img { filter: drop-shadow(0 -1rem 2.4rem rgba(180, 189, 240, .18)); }

/* ---------- страницы документов: оферта, политика ---------- */
.legal-page { background: var(--paper); }
.legal { max-width: 46rem; margin: 0 auto; padding: clamp(2.5rem, 6vw, 5rem) var(--pad) 6rem; font-size: 1rem; line-height: 1.65; }
.legal__back { display: inline-flex; align-items: center; gap: .55em; margin-bottom: 2.5rem; font-weight: 600; color: #5a50a0; text-decoration: none; }
.legal__back svg { width: 1.1em; transition: translate .4s var(--ease-out); }
.legal__back:hover { color: var(--ink); }
.legal__back:hover svg { translate: -.3em 0; }
.legal h1 { font: 500 clamp(2rem, 4.6vw, 3.4rem)/1.05 var(--serif); letter-spacing: .01em; text-transform: uppercase; text-wrap: balance; }
.legal__meta { margin-top: .8rem; color: var(--muted); }
.legal h2 { margin: 2.6rem 0 .8rem; font: 500 clamp(1.3rem, 2.2vw, 1.7rem)/1.2 var(--serif); }
.legal p, .legal ul { margin-top: .8rem; }
.legal ul { padding-left: 1.2rem; list-style: disc; }
.legal li + li { margin-top: .4rem; }
.legal a { color: #5a50a0; text-underline-offset: .2em; }
.legal__card { display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1.5rem; margin-top: 2.4rem; padding: 1.4rem 1.6rem; border: 1px solid var(--line); background: #fff; }
.legal__card dt { color: var(--muted); }
.legal__foot { margin-top: 3rem; padding-top: 1.2rem; border-top: 1px solid var(--line); font-size: .9rem; color: var(--muted); }
@media (max-width: 560px) { .legal__card { grid-template-columns: 1fr; gap: .1rem; } .legal__card dd + dt { margin-top: .7rem; } }

/* ---------- окно заявки: бумага, чернила, прямые углы; открывается кнопками на билетах ---------- */
.order { width: min(36rem, calc(100vw - 2rem)); margin: auto; max-height: calc(100svh - 2rem); padding: 0; border: 0; color: var(--ink); background: var(--paper); box-shadow: 0 2rem 4rem rgba(2, 7, 26, .35), inset 0 0 0 1px rgba(122, 111, 168, .35); overflow: auto; overscroll-behavior: contain; }
.order::backdrop { background: rgba(2, 7, 26, .55); }
.order[open] { animation: order-in .45s var(--ease-out); }
@keyframes order-in { from { opacity: 0; translate: 0 1.2rem; } }
.order__form, .order__done { position: relative; padding: clamp(1.5rem, 4vw, 2.4rem); }
.order__close { position: absolute; top: .9rem; right: .9rem; width: 2.6rem; height: 2.6rem; display: grid; place-items: center; padding: 0; color: var(--ink); background: none; border: 0; cursor: pointer; }
.order__close svg { width: 1.1rem; }
.order__close:hover { color: var(--violet); }
.order h2 { padding-right: 2.5rem; font-size: clamp(1.7rem, 4vw, 2.4rem); }
.order__lead { margin-top: .7rem; color: var(--ink-2); line-height: 1.45; }
.order fieldset { margin: 1.5rem 0 0; padding: 0; border: 0; }
.order legend { margin-bottom: .6rem; font: 600 .78rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); }
.order__dates { display: grid; grid-template-columns: repeat(4, 1fr); gap: .4rem; }
.order__dates legend { grid-column: 1 / -1; }
.order__dates label { position: relative; cursor: pointer; }
.order__dates input { position: absolute; opacity: 0; pointer-events: none; }
.order__dates span { display: grid; place-items: center; gap: .1rem; height: 100%; padding: .6rem .3rem; font-size: .8rem; line-height: 1.2; text-align: center; color: var(--ink-2); background: #fff; border: 1px solid var(--line); transition: background .25s var(--ease-out), color .25s var(--ease-out), border-color .25s var(--ease-out); }
.order__dates b { font: 500 1.7rem/1 var(--serif); color: var(--ink); }
.order__dates input:checked + span { color: var(--paper); background: var(--ink); border-color: var(--ink); }
.order__dates input:checked + span b { color: var(--paper); }
.order__dates input:focus-visible + span { outline: 2px solid var(--violet); outline-offset: 2px; }
.qty { display: grid; grid-template-columns: 1fr 2.6rem 2.4rem 2.6rem; align-items: center; gap: .2rem; padding: .7rem 0; border-top: 1px solid var(--line); }
.qty[data-kind="adults"] { border-bottom: 1px solid var(--line); }
.qty__name { line-height: 1.3; }
.qty__name b { font-weight: 600; white-space: nowrap; }
.qty__name small { display: block; font-size: .8rem; color: var(--muted); }
.qty button { width: 2.6rem; height: 2.6rem; padding: 0; font: 500 1.3rem/1 var(--sans); color: var(--ink); background: #fff; border: 1px solid var(--line); cursor: pointer; }
.qty button:hover { border-color: var(--ink); }
.qty button:disabled { opacity: .35; cursor: default; }
.qty output { text-align: center; font: 500 1.5rem/1 var(--serif); font-variant-numeric: lining-nums; }
.order__note { margin-top: .7rem; font-size: .85rem; line-height: 1.4; color: var(--ink-2); }
.order__sum { margin-top: .7rem; font-size: 1.05rem; }
.order__sum b { font: 600 1.5rem/1 var(--serif); font-variant-numeric: lining-nums; }
.order__field { display: grid; gap: .35rem; margin-top: 1rem; font-weight: 600; font-size: .92rem; }
.order__field i { font-style: normal; font-weight: 400; color: var(--muted); }
.order__field input, .order__field textarea { width: 100%; padding: .7rem .8rem; font: 400 1rem/1.4 var(--sans); color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: 0; }
.order__field input:focus, .order__field textarea:focus { outline: 2px solid var(--violet); outline-offset: 0; border-color: var(--violet); }
.order__field textarea { resize: vertical; min-height: 3.6rem; }
.order [aria-invalid="true"] { border-color: #5a50a0; box-shadow: inset 3px 0 0 #5a50a0; }
.order__trap { position: absolute; left: -10000px; width: 1px; height: 1px; opacity: 0; }
.order__consent { display: grid; grid-template-columns: auto 1fr; gap: .6rem; align-items: start; margin-top: 1.2rem; font-size: .88rem; line-height: 1.4; color: var(--ink-2); cursor: pointer; }
.order__consent input { width: 1.15rem; height: 1.15rem; margin-top: .1rem; accent-color: var(--ink); }
.order__consent a, .order__done a { color: #5a50a0; }
.order__err { min-height: 0; margin-top: .3rem; font-size: .82rem; color: #5a50a0; }
.order__err:empty { display: none; }
.order__submit { width: 100%; margin-top: 1.4rem; padding: 1.05em; font-size: 1.02rem; cursor: pointer; }
.order__submit[disabled] { opacity: .6; cursor: progress; }
.order__fail { margin-top: .7rem; font-size: .9rem; color: #5a50a0; }
.order__fail:empty { display: none; }
.order__done p { margin-top: .9rem; line-height: 1.5; color: var(--ink-2); }
.order__done .btn { margin-top: 1.4rem; cursor: pointer; }

/* ---------- плавающая кнопка «Купить билет»: из той же фольги, что билеты; видна и на светлом, и на тёмном ---------- */
/* сверху справа — не спорит с титрами и главами трейлера; прячется на первом экране, у билетов и у последней кнопки */
.fab { position: fixed; z-index: 60; top: 1.1rem; right: var(--pad); display: inline-flex; align-items: center; gap: .85em; padding: .85em 1.35em; font: 600 .95rem/1 var(--sans); color: var(--ink); text-decoration: none;
  background: url(img/foil.webp) 30% 50% / 130% auto; box-shadow: 0 .6rem 1.4rem rgba(2, 7, 26, .22), inset 0 0 0 1px rgba(122, 111, 168, .4), inset 0 -2px 0 rgba(90, 86, 150, .35);
  translate: 0 -160%; opacity: 0; visibility: hidden; transition: translate .6s var(--ease-out), opacity .4s ease, visibility 0s linear .6s, background-position 1.2s var(--ease-out); }
.fab span { padding-left: .85em; border-left: 1px solid rgba(37, 40, 61, .3); font-weight: 400; }
.fab.is-on { translate: 0 0; opacity: 1; visibility: visible; transition: translate .6s var(--ease-out), opacity .4s ease, background-position 1.2s var(--ease-out); }
.fab:hover { background-position: 75% 50%; }
.fab:focus-visible { outline: 2px solid var(--violet); outline-offset: 3px; }

/* ---------- Дед Мороз ---------- */
.ded { position: relative; aspect-ratio: 1; pointer-events: none; }
.ded img { width: 100%; height: 100%; filter: drop-shadow(0 1.4rem 1.6rem rgba(37, 40, 61, .28)); }
.ded--hero { position: absolute; z-index: 2; right: clamp(20%, 27vw, 32%); bottom: -1%; width: clamp(17rem, 36vw, 36rem); transform-origin: 50% 100%; animation: sway 6s ease-in-out infinite; transition: translate .7s var(--ease-out) .3s; }
.ded--hero.is-dived { translate: 0 108%; transition: translate .45s cubic-bezier(.5, 0, .75, 0); }
@keyframes sway { 0%, 100% { transform: rotate(-1deg); } 50% { transform: rotate(1deg); } }

.eye { position: absolute; left: var(--x); top: var(--y); width: var(--d); aspect-ratio: var(--r, 1); transform: translate(-50%, -50%); border-radius: 50%; overflow: hidden; }
.pupil { position: absolute; left: 50%; top: 50%; width: 52%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; background: radial-gradient(circle at 34% 30%, #fff 0 13%, transparent 14%), radial-gradient(circle at 50% 50%, #14162b 0 44%, #5a6fa8 45% 100%); transform: translate(var(--tx, 0px), var(--ty, 0px)); transition: transform .09s linear; }
.lid { position: absolute; inset: -4%; background: var(--skin); border-bottom: 2px solid #7d4f3c; transform: translateY(-104%); transition: transform .09s ease-in; }
.eye--flip .lid { border-bottom: 0; border-top: 2px solid #7d4f3c; transform: translateY(104%); }
.ded.is-blinking .lid { transform: translateY(0); }

@media (max-width: 760px) {
  .hero { align-items: flex-start; min-height: 100svh; }
  .hero__bg { background-position: 82% 50%; }
  .hero::after { background: linear-gradient(180deg, var(--paper) 0%, rgba(244, 243, 248, .9) 46%, rgba(244, 243, 248, 0) 72%); }
  .hero__text { width: 100%; padding-top: 3rem; padding-bottom: 0; }
  .ded--hero { right: -6%; width: 66vw; }
}

@media (max-width: 860px) {
  .pop { --u: 2.2vw; height: auto; padding: 0 var(--pad) 4.5rem; }
  .ded.ded--peek { --w: 44vw; left: 2vw; margin-left: 0; }
  .pop__text { position: relative; left: auto; top: auto; width: auto; padding-top: 36vw; }
  .pop__verbs { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem 3vw; margin-top: 1.5rem; padding: 0; }
  .bubble--verb { position: relative; left: auto; top: auto; width: 100%; margin: 0; padding: 0 9%; }
  .bubble--verb:nth-child(even) { margin-top: 18%; }
  .bubble--verb b { font-size: clamp(1.35rem, 6.4vw, 2.6rem); }
  .bubble--verb span { max-width: min(11em, 100%); font-size: clamp(.72rem, 2.9vw, 1rem); }
  .pop__air .bubble.m-keep { left: var(--mx); top: var(--my); --s: var(--ms); }
  .br-d { display: none; }
  .pop__air .bubble:not(.m-keep), .pop__air .ball:not(.m-keep), .fleck:nth-child(n + 15), .disco--l { display: none; }
  .disco--r { width: 26vw; left: auto; right: -5vw; }
  .show__dusk { min-height: 75svh; }
  .show__reel { height: auto; }
  .show__stage { position: static; display: block; height: auto; padding-bottom: 0; background: var(--night); }
  .show__shots { display: grid; gap: 2.5rem; width: auto; height: auto; padding-bottom: 3.5rem; }
  .shot { position: relative; inset: auto; opacity: 1; }
  .shot::after { inset: 0; background: linear-gradient(0deg, rgba(2, 7, 26, .9) 0%, rgba(2, 7, 26, .3) 45%, rgba(2, 7, 26, 0) 62%); }
  .shot__video { display: block; aspect-ratio: var(--m-ar, 4 / 3); height: auto; object-position: var(--m-focus, 50%) 50%; }
  .shot__in { position: relative; }
  .shot__text { top: auto; right: var(--pad); bottom: 1.4rem; max-width: none; translate: none; }
  .shot__text h3 { font-size: clamp(2rem, 9vw, 3rem); }
  .shot__text > * { opacity: 1; transform: none; }
  .show__chapters, .show__snap { display: none; }
  .tix { --u: 2.2vw; --dawn: 30vw; --glow: 20vw; }
  .tix__stage { min-height: 0; padding: 22vw var(--pad) 16vw; }
  .tix h2 { position: relative; left: auto; top: auto; font-size: clamp(3rem, 15vw, 5rem); }
  .tix__list { grid-template-columns: 1fr; row-gap: 12vw; width: auto; min-height: 0; margin-top: 16vw; }
  .ticket { --stub: 15vw; --r: 2vw; --h: 1vw; --pitch: 4vw; }
  .ticket__card { background-size: auto 118%; }
  .ticket__body { padding: 5.5vw 4vw 5.5vw 6vw; gap: 0; }
  .ticket__name { font-size: clamp(1.6rem, 7.6vw, 2.4rem); }
  .ticket__name { max-width: 7em; }
  .ticket__price { margin-top: 2.5vw; font-size: clamp(2.4rem, 12vw, 3.8rem); }
  .ticket__note { margin-top: 2.5vw; font-size: clamp(.85rem, 3.7vw, 1rem); }
  .ticket__buy { margin-top: 5vw; font-size: clamp(.9rem, 4vw, 1.05rem); padding-inline: 1.6em; }
  .ticket--gift .ticket__buy { margin-top: 5vw; padding-inline: 1.6em; }
  .ticket--gift .ticket__name { font-size: clamp(1.6rem, 7.6vw, 2.4rem); }
  .ticket--gift .ticket__body { padding-top: 5.5vw; }
  .ticket__gift { left: auto; right: 9vw; top: -15vw; width: 34vw; }
  .tix__terms { width: auto; margin: 12vw 0 0; padding-top: 5vw; font-size: clamp(.95rem, 4vw, 1.1rem); }
  .tix__terms li + li { margin-top: 3vw; }
  .tix__air .bubble:not(.m-keep), .tix__air .ball, .tix .disco--l { display: none; }
  .tix__air .bubble.m-keep { left: var(--mx); top: var(--my); --s: var(--ms); }
  .tix .disco--r { width: 20vw; left: auto; right: -4vw; top: -6vw; }
  .fin { padding-bottom: 82vw; }
  .fin__air .fleck { top: calc(var(--y) * .28 + 64%); left: calc((var(--x) - 45%) * 1.7); }
  .ded.ded--bye { --w: 74vw; right: 2vw; }
  .order { width: 100vw; max-width: none; max-height: 100svh; height: 100svh; margin: 0; }
  .order__dates { grid-template-columns: repeat(2, 1fr); }
  .fab { top: auto; bottom: 0; left: 0; right: 0; justify-content: center; padding: 1.05em 1em calc(1.05em + env(safe-area-inset-bottom)); font-size: 1rem; translate: 0 110%; border-top: 1px solid rgba(122, 111, 168, .45); box-shadow: 0 -.4rem 1.2rem rgba(2, 7, 26, .18), inset 0 1px 0 rgba(255, 255, 255, .7); }
  .where { --u: 2.2vw; }
  .where__stage { min-height: 0; padding: 12vw var(--pad) 16vw; }
  .where__air .bubble:not(.m-keep) { display: none; }
  .where__air .bubble.m-keep { left: var(--mx); top: var(--my); --s: var(--ms); }
  .date__hang { --lift: -7vw; }
  .where--hang .date__hang { opacity: 0; }
  .where--hang.is-hung .date__hang { opacity: 1; }
  .date__hang::before { -webkit-mask: none; mask: none; }
  .where h2 { position: relative; left: auto; top: auto; font-size: clamp(2.6rem, 13vw, 4.4rem); }
  .where__dates { position: relative; inset: auto; height: auto; display: grid; grid-template-columns: 1fr 1fr; row-gap: 8vw; margin-top: 2vw; }
  .date { position: relative; left: auto; width: auto; margin-left: 0; }
  .date__hang { width: 24vw; --len: 12vw !important; }
  .date b { margin-top: 3vw; font-size: clamp(3rem, 19vw, 5rem); }
  .date span:last-child { margin-top: 1.5vw; font-size: clamp(.95rem, 4.2vw, 1.15rem); }
  .where__info { width: auto; grid-template-columns: 1fr; margin-top: 12vw; padding-top: 6vw; }
  .where__info > * + * { padding-left: 0; border-left: 0; margin-top: 7vw; }
  .where__time { padding-top: 0; font-size: clamp(1rem, 4.4vw, 1.2rem); }
  .where__place h3 { font-size: clamp(1.4rem, 6.4vw, 1.9rem); }
  .where__place p, .where__route { margin-top: 2.5vw; font-size: clamp(1rem, 4.2vw, 1.15rem); }
  .where__contact { gap: 2.4vw; padding-top: 0; }
  .where__contact .btn { font-size: clamp(.85rem, 3.8vw, 1rem); }
}

/* экран вне поля зрения — его анимации на паузе (app.js, IntersectionObserver) */
.is-off, .is-off *, .is-off *::before, .is-off *::after { animation-play-state: paused !important; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ded--hero { animation: none; transition: none; }
  .btn { transition: none; }
  .bubble, .ball, .disco, .fleck { animation: none; }
  .shot__text > *, .shot { transition: none; }
  .ded.ded--peek { transform: none; transition: none; }
  .hero__bg { transform: none; }
  .ticket, .ticket__gift { transition: none; animation: none; }
  .tix::before { opacity: 1; transition: none; }
  .date__hang { animation: none; transition: none; }
  .fab { transition: opacity .2s ease, visibility 0s; translate: 0 0; }
  .ded.ded--bye { transform: none; transition: none; animation: none; }
  .speck { animation: none; opacity: var(--o, .9); }
  .date__specks { opacity: 1; transition: none; }
}