/* Сцены шоурилов кейсов (28.10.2026, Фёдор: «такой же шоурил, как для Коммерсанта, — для производственной компании, НПФ Сбера,
   Открытия, Легенды, Работы.ру и Альфа-Банка, после верхнего блока»). Данные — site/case-reels.json, разметка — sitegen.py case_reel(),
   таймлайн и курсор — reel.js, основа (кадр, смена сцен, подписи, панель) — reel.css. Размеры в единицах контейнера: кадр 16:9,
   на телефоне 4:5 — раскладка внизу файла. Сцена оживает по классу .is-on. */
.reel--case .rs-by img{width:auto;height:calc(var(--lh,7) * .55cqw)}
.rs-card{background:#fff;box-shadow:0 2.4cqw 4.4cqw -2cqw rgba(30,26,60,.3),0 0 0 1px rgba(14,13,22,.06)}

/* заставка: контур ключевой цифры, затем логотип или название */
.rs-hard--k{font:600 min(62cqh,calc(150cqw / var(--gl,1)))/1 var(--r-d);letter-spacing:-.06em;-webkit-text-stroke-width:.2cqw;white-space:nowrap}
.rs-brand{display:flex;align-items:center;gap:1.8cqw;clip-path:inset(0 100% 0 0)}
.rs--intro.is-on .rs-brand{animation:rswipe 1.1s cubic-bezier(.65,0,.35,1) 1.5s both}
.rs-brand__logo{display:block;width:auto;height:calc(var(--lh,7) * 1cqw);max-width:60cqw}
.rs-word{color:var(--ink);font:600 min(7cqw,calc(100cqw / var(--wl,10)))/1.05 var(--r-d);letter-spacing:-.04em;white-space:nowrap}
.rs-word--serif{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:.2em}
.rs-by>.rs-word--by{font-size:min(3cqw,calc(60cqw / var(--wl,10)))}
.reel--case .rs-intro__k{flex-wrap:wrap;justify-content:center;max-width:88cqw;row-gap:.6cqw;text-align:center}
.reel--case .rs-plane{--ty:var(--tyd)}
.reel--case .rs--page::after{background:linear-gradient(0deg,rgba(6,5,11,.95) 0,rgba(6,5,11,.62) 36%,rgba(6,5,11,0) 60%)}
/* сцены с крупным элементом справа: подпись уже и мельче, чтобы длинные слова («недропользования») помещались */
.rs--pic .rs-cap,.rs--chat .rs-cap,.rs--build .rs-cap,.rs--bars .rs-cap,.rs--convert .rs-cap,.rs--chips .rs-cap,.rs--run .rs-cap,.rs--tiles .rs-cap,.rs--grow .rs-cap{max-width:34cqw}
.rs--pic .rs-cap>b,.rs--chat .rs-cap>b,.rs--build .rs-cap>b,.rs--bars .rs-cap>b,.rs--convert .rs-cap>b,.rs--chips .rs-cap>b,.rs--run .rs-cap>b{font-size:2.9cqw}

/* снимки слоями */
.rs--float .rs-float{position:absolute;inset:0;transform-style:preserve-3d}
.rs--float.is-on .rs-float{animation:rsorbit 4.8s cubic-bezier(.45,0,.25,1) both}
.rs-s{aspect-ratio:16/10;object-fit:cover;object-position:top}
.rs-s--1{left:40cqw;top:5cqh;width:46cqw;transform:translateZ(-26cqw);filter:blur(.3cqw)}
.rs-s--2{left:9cqw;top:10cqh;width:42cqw;transform:translateZ(0)}
.rs-s--3{left:52cqw;top:38cqh;width:34cqw;transform:translateZ(12cqw)}
.rs-float--2 .rs-s--1{left:10cqw;top:7cqh;width:48cqw;filter:none;transform:translateZ(-8cqw)}
.rs-float--2 .rs-s--2{left:46cqw;top:28cqh;width:44cqw;transform:translateZ(10cqw)}
.rs--float.is-on .rs-c{animation:rsc 1.1s cubic-bezier(.16,1,.3,1) both}
.rs--float.is-on .rs-s--2{animation-delay:.2s}.rs--float.is-on .rs-s--3{animation-delay:.4s}
.rs--float::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(20deg,rgba(236,235,242,.97) 0,rgba(236,235,242,.75) 24%,rgba(236,235,242,0) 44%)}
.rs--float .rs-cap{z-index:6}

/* картинка крупно: снимок в окне с панорамой или контурный чертёж, который прорисовывается */
.rs-win{position:absolute;right:5cqw;top:50%;width:54cqw;height:min(84cqh,calc(54cqw / var(--ar,1.4) + 2.6cqw));translate:0 -50%;border-radius:1cqw;overflow:hidden;opacity:0}
.rs-win__bar{display:flex;gap:.5cqw;align-items:center;height:2.6cqw;padding:0 1cqw;background:#f4f4f7;border-bottom:1px solid rgba(14,13,22,.06)}
.rs-win__bar i{width:.7cqw;height:.7cqw;border-radius:50%;background:#d5d4de}
.rs-win__in{position:absolute;left:0;right:0;top:2.6cqw;bottom:0;overflow:hidden}
.rs-win__in img{display:block;width:100%;height:100%;object-fit:cover;object-position:0 0}
.rs--pic.is-on .rs-win{animation:rsrise2 .9s cubic-bezier(.16,1,.3,1) both}
.rs--pic.is-on .rs-win__in img{animation:rspan 4.6s cubic-bezier(.45,0,.25,1) .3s both}
@keyframes rsrise2{from{opacity:0;transform:translateY(5cqh) scale(.97)}to{opacity:1;transform:none}}
@keyframes rspan{from{object-position:0 0;transform:scale(1.08)}to{object-position:100% 100%;transform:scale(1)}}
.rs-bpimg{position:absolute;right:7cqw;top:50%;width:min(50cqw,90cqh);height:auto;translate:0 -50%;clip-path:inset(0 100% 0 0)}
.rs--pic.is-on .rs-bpimg{animation:rsdraw 2.4s cubic-bezier(.65,0,.35,1) .2s both,rsbpz 4.6s ease-out both}
@keyframes rsdraw{to{clip-path:inset(0)}}
@keyframes rsbpz{from{scale:1.08}to{scale:1}}

/* несколько сайтов сходятся в один */
.rs-mg{position:absolute;inset:0}
.rs-mg__i,.rs-mg__to{position:absolute;left:50%;top:56%;width:30cqw;border-radius:.8cqw;overflow:hidden;background:#fff;box-shadow:0 2.4cqw 4cqw -1.6cqw rgba(30,26,60,.3),0 0 0 1px rgba(14,13,22,.06)}
.rs-mg__i img,.rs-mg__to img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top}
.rs-mg__i{opacity:0;transform:translate(-50%,-50%) translate(calc(var(--x) * var(--sx,1) * 1cqw),calc(var(--y) * 1cqh)) rotate(var(--a))}
.rs--merge.is-on .rs-mg__i{animation:rsmg 3.2s cubic-bezier(.65,0,.35,1) calc(var(--i) * .15s) both}
@keyframes rsmg{0%{opacity:0;translate:0 5cqh}16%{opacity:1;translate:0 0}55%{opacity:1;transform:translate(-50%,-50%) translate(calc(var(--x) * var(--sx,1) * 1cqw),calc(var(--y) * 1cqh)) rotate(var(--a))}
  100%{opacity:0;transform:translate(-50%,-50%) translate(0,0) rotate(0) scale(.7)}}
.rs-mg__to{width:44cqw;opacity:0;transform:translate(-50%,-50%) scale(.6);box-shadow:0 3cqw 6cqw -2cqw rgba(30,26,60,.4),0 0 0 .2cqw #3d12fc}
.rs--merge.is-on .rs-mg__to{animation:rsmgto 1s cubic-bezier(.16,1,.3,1) 3s both}
@keyframes rsmgto{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.rs-mg__l{position:absolute;right:5cqw;top:8cqh;z-index:5;color:#3d12fc;font:600 7cqw/1 var(--r-d);letter-spacing:-.05em;opacity:0}
.rs--merge.is-on .rs-mg__l{animation:rsfade .6s ease 3.1s both}

/* центр и спутники: линии прорисовываются по очереди */
.rs-hub{position:absolute;left:24cqw;top:9cqh;width:62cqw;height:80cqh}
.rs-hub__ln{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.rs-hub__ln path{fill:none;stroke:#3d12fc;stroke-width:.3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.rs--hub.is-on .rs-hub__ln path{animation:rsln .8s cubic-bezier(.65,0,.35,1) calc(.6s + var(--i) * .7s) both}
@keyframes rsln{to{stroke-dashoffset:0}}
.rs-hub__c{position:absolute;left:18%;top:50%;display:grid;place-items:center;width:15cqw;height:15cqw;border-radius:50%;background:#3d12fc;color:#fff;font:600 1.9cqw/1.1 var(--r-d);letter-spacing:-.02em;text-align:center;
  transform:translate(-50%,-50%);box-shadow:0 0 0 1.4cqw rgba(61,18,252,.12),0 0 0 2.8cqw rgba(61,18,252,.06)}
.rs--hub.is-on .rs-hub__c{animation:rspop .7s cubic-bezier(.16,1,.3,1) .1s both}
@keyframes rspop{from{opacity:0;transform:translate(-50%,-50%) scale(.6)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes rspop0{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.rs-hub__s{position:absolute;display:flex;align-items:center;gap:1cqw;padding:1.2cqw 1.8cqw;border-radius:99px;background:#fff;color:var(--ink);font:600 1.8cqw/1 var(--r-d);letter-spacing:-.02em;white-space:nowrap;
  transform:translate(0,-50%);box-shadow:0 1.6cqw 3cqw -1.2cqw rgba(30,26,60,.3),0 0 0 1px rgba(14,13,22,.06);opacity:0}
.rs-hub__s i{color:#3d12fc;font-size:1.2cqw;font-style:normal}
.rs--hub.is-on .rs-hub__s{animation:rspops .6s cubic-bezier(.16,1,.3,1) calc(1.2s + var(--i) * .7s) both}
@keyframes rspops{from{opacity:0;transform:translate(-2cqw,-50%)}to{opacity:1;transform:translate(0,-50%)}}

/* шаги: загораются по очереди, линия прогресса идёт следом */
.rs-steps{position:absolute;left:5cqw;right:5cqw;top:44cqh;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:1.6cqw;margin:0;padding:0;list-style:none}
.rs-steps::before,.rs-steps::after{content:"";position:absolute;left:2.2cqw;right:8%;top:2.2cqw;height:2px;background:rgba(61,18,252,.16)}
.rs-steps::after{background:#3d12fc;transform:scaleX(0);transform-origin:0 50%}
.rs--steps.is-on .rs-steps::after{animation:rsbar calc(var(--n) * .75s) linear .5s both}
@keyframes rsbar{to{transform:none}}
.rs-steps li{position:relative;display:grid;gap:1.4cqw;align-content:start;opacity:.3}
.rs-steps i{display:grid;place-items:center;width:4.4cqw;height:4.4cqw;border-radius:50%;background:#fff;border:2px solid rgba(61,18,252,.25);color:#3d12fc;font:600 1.3cqw/1 var(--r-d);font-style:normal}
.rs-steps b{color:var(--ink);font:600 2cqw/1.15 var(--r-d);letter-spacing:-.03em;text-wrap:balance}
.rs--steps.is-on .rs-steps li{animation:rsstep .5s ease calc(.5s + var(--i) * .75s) both}
.rs--steps.is-on .rs-steps i{animation:rsstepi .5s ease calc(.5s + var(--i) * .75s) both}
@keyframes rsstep{to{opacity:1}}
@keyframes rsstepi{to{background:#3d12fc;border-color:#3d12fc;color:#fff}}

/* большое число считается, факты справа внизу */
.rs--count::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,5,11,.9) 0,rgba(6,5,11,.45) 55%,rgba(6,5,11,.8) 100%)}
.rs--count.is-on .rs-bg{animation:rskb 5s ease-out both}
.rs-num{font-variant-numeric:tabular-nums;white-space:nowrap}
.rs--count .rs-big b{font-size:min(19cqw,calc(118cqw / var(--n,4)))}
.rs-chips{position:absolute;right:5cqw;bottom:11cqh;z-index:3;display:grid;gap:1cqw;justify-items:end;max-width:50cqw;margin:0;padding:0;list-style:none}
.rs-chips li{padding:1cqw 1.6cqw;border-radius:99px;border:1px solid rgba(250,250,250,.25);background:rgba(250,250,250,.06);color:#fafafa;font:500 1.35cqw/1.25 var(--r-d);text-align:right;white-space:nowrap;opacity:0}
.rs--count.is-on .rs-chips li{animation:rsfade .6s ease calc(1.4s + var(--i) * .35s) both,rsslide .7s cubic-bezier(.16,1,.3,1) calc(1.4s + var(--i) * .35s) both}
@keyframes rsslide{from{translate:3cqw 0}to{translate:0 0}}
.rs--count .rs-cap{z-index:3;max-width:44cqw}

/* N страниц: клетки-страницы появляются, затем каждая «проверена» */
.rs-px--l{left:5cqw;right:auto;top:9cqh}
.rs-px--l b{font-size:12cqw}
.rs-px--l span{color:#5d5c69}
.rs-tl{position:absolute;right:5cqw;top:11cqh;display:grid;grid-template-columns:repeat(10,3.6cqw);gap:.7cqw}
.rs-tl i{position:relative;height:4.4cqw;border-radius:.4cqw;background:#fff;box-shadow:0 0 0 1px rgba(14,13,22,.08);opacity:0}
.rs-tl i::before{content:"";position:absolute;left:16%;right:16%;top:18%;height:14%;border-radius:1px;background:rgba(61,18,252,.4)}
.rs-tl i::after{content:"";position:absolute;left:16%;right:28%;top:44%;height:36%;background:repeating-linear-gradient(rgba(14,13,22,.16) 0 1px,transparent 1px 25%)}
.rs--tiles.is-on .rs-tl i{animation:rstile .35s ease calc(var(--i) * 28ms + .3s) both,rstok .4s ease calc(var(--i) * 18ms + 3s) forwards}
@keyframes rstile{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes rstok{to{box-shadow:0 0 0 .18cqw #3d12fc}}

/* команда растёт */
.rs-gr{position:absolute;right:7cqw;top:13cqh;display:grid;grid-template-columns:repeat(5,7cqw);gap:2.2cqw 2.6cqw}
.rs-gr i{position:relative;height:8cqw;opacity:0}
.rs-gr i::before,.rs-gr i::after{content:"";position:absolute;left:50%;translate:-50% 0;background:#3d12fc}
.rs-gr i::before{top:0;width:3cqw;height:3cqw;border-radius:50%}
.rs-gr i::after{bottom:0;width:6cqw;height:4.2cqw;border-radius:3cqw 3cqw .8cqw .8cqw}
.rs-gr i.is-base{opacity:1}
.rs-gr i.is-base::before,.rs-gr i.is-base::after{background:var(--ink)}
.rs--grow.is-on .rs-gr i:not(.is-base){animation:rspop2 .45s cubic-bezier(.16,1,.3,1) calc(.6s + var(--i) * 110ms) both}
@keyframes rspop2{from{opacity:0;transform:translateY(1.5cqw) scale(.7)}to{opacity:1;transform:none}}

/* чат-бот: реплики по очереди, курсор нажимает «Начать тест», справа приходят профессии */
.rs-chat{position:absolute;left:41cqw;top:8cqh;width:31cqw;height:84cqh;display:flex;flex-direction:column;border-radius:1.4cqw;overflow:hidden;background:#fff;
  box-shadow:0 3cqw 6cqw -2cqw rgba(30,26,60,.3),0 0 0 1px rgba(14,13,22,.06);opacity:0}
.rs--chat.is-on .rs-chat{animation:rsrise2 .8s cubic-bezier(.16,1,.3,1) both}
.rs-chat__hd{display:flex;align-items:center;gap:.8cqw;margin:0;padding:1.2cqw 1.6cqw;border-bottom:1px solid rgba(14,13,22,.06);color:var(--ink);font:600 1.3cqw/1 var(--r-d)}
.rs-chat__hd i{width:2.2cqw;height:2.2cqw;border-radius:50%;background:radial-gradient(circle at 50% 40%,#fff 0 22%,transparent 23%),#3d12fc}
.rs-chat__log{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:.9cqw;padding:1.6cqw;overflow:hidden}
.rs-msg{display:none;max-width:84%;margin:0;padding:1cqw 1.3cqw;border-radius:1.2cqw;font-size:1.3cqw;line-height:1.35}
.rs-msg.is-on{display:block;animation:rsmsg .35s cubic-bezier(.16,1,.3,1) both}
@keyframes rsmsg{from{opacity:0;transform:translateY(1cqw) scale(.96)}to{opacity:1;transform:none}}
.rs-msg--b{align-self:flex-start;background:#f0f0f5;color:var(--ink);border-bottom-left-radius:.3cqw}
.rs-msg--u{align-self:flex-end;background:#3d12fc;color:#fff;border-bottom-right-radius:.3cqw}
.rs-typing{gap:.4cqw;padding:1.2cqw 1.4cqw}
.rs-typing.is-on{display:flex;animation:none}
.rs-typing i{width:.6cqw;height:.6cqw;border-radius:50%;background:#8b8a99;animation:rsdot 1s infinite}
.rs-typing i:nth-child(2){animation-delay:.15s}.rs-typing i:nth-child(3){animation-delay:.3s}
@keyframes rsdot{0%,60%,100%{transform:none;opacity:.4}30%{transform:translateY(-.4cqw);opacity:1}}
.rs-chat__opts{display:flex;flex-wrap:wrap;align-items:center;gap:.6cqw;padding:1.2cqw 1.6cqw 1.6cqw;border-top:1px solid rgba(14,13,22,.06)}
.rs-chat__opts span{padding:.7cqw 1.1cqw;border-radius:99px;border:1px solid rgba(14,13,22,.14);color:var(--ink);font:500 1.15cqw/1 var(--r-d)}
.rs-chat__opts .rs-chat__go{margin-left:auto;border-color:var(--ink);background:var(--ink);color:#fff;transition:background .2s,border-color .2s}
.rs-chat__go.is-hit{border-color:#3d12fc;background:#3d12fc}
.rs-res{position:absolute;left:74.5cqw;top:20cqh;display:grid;gap:1.4cqw;width:20.5cqw;margin:0;padding:0;list-style:none}
.rs-res li{padding:1.6cqw;border-radius:1.2cqw;background:#fff;box-shadow:0 2cqw 4cqw -2cqw rgba(30,26,60,.3),0 0 0 1px rgba(14,13,22,.06);opacity:0;transform:translateX(3cqw)}
.rs-res li>b{display:block;color:var(--ink);font:600 1.8cqw/1.1 var(--r-d);letter-spacing:-.03em}
.rs-res li>span{display:block;margin-top:.6cqw;color:#5d5c69;font-size:1.1cqw;line-height:1.35}
.rs--chat.is-res .rs-res li{animation:rsres .6s cubic-bezier(.16,1,.3,1) calc(var(--i) * .2s) both}
@keyframes rsres{to{opacity:1;transform:none}}

/* конструктор: панель виджетов слева, страница справа; курсор переносит виджеты */
.rs-bd{position:absolute;left:41cqw;top:9cqh;width:53cqw;height:80cqh;display:grid;grid-template-columns:11cqw minmax(0,1fr);gap:1.6cqw}
.rs-bd__pal,.rs-bd__cv{border-radius:1.2cqw;background:#fff;box-shadow:0 2.4cqw 4.4cqw -2cqw rgba(30,26,60,.28),0 0 0 1px rgba(14,13,22,.06)}
.rs-bd__pal{display:grid;align-content:start;gap:.9cqw;padding:1.1cqw}
.rs-bd__cv{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:2cqw 12cqw 8cqw 9cqw;gap:1cqw;align-content:start;padding:1.4cqw}
.rs-bd__top{grid-column:1/-1;border-radius:.4cqw;background:linear-gradient(90deg,var(--ink) 0 5cqw,transparent 5cqw),repeating-linear-gradient(90deg,transparent 0 22cqw,#e6e5ee 22cqw 25cqw,transparent 25cqw 26cqw)}
.rs-w,.rs-bd__slot,.rs-ghost{position:relative;border-radius:.6cqw}
.rs-w{height:4.6cqw;background:#f5f4fa;transition:box-shadow .2s}
.rs-w.is-hit{box-shadow:0 0 0 .18cqw #3d12fc}
.rs-bd__slot{border:1.5px dashed rgba(61,18,252,.3);background:rgba(61,18,252,.03)}
.rs-bd__slot[data-w="hero"],.rs-bd__slot[data-w="cards"]{grid-column:1/-1}
.rs-bd__slot.is-on{border-style:solid;border-color:rgba(14,13,22,.06);background:#f7f6fc;animation:rsdrop .45s cubic-bezier(.16,1,.3,1)}
@keyframes rsdrop{from{transform:scale(.94)}to{transform:none}}
.rs-w>i,.rs-bd__slot>i,.rs-ghost>i{position:absolute;inset:18%;border-radius:.3cqw}
.rs-bd__slot>i{inset:10%;opacity:0;transition:opacity .25s}
.rs-bd__slot.is-on>i{opacity:1}
.rs-ghost{position:absolute;left:0;top:0;z-index:7;background:#fff;box-shadow:0 2cqw 3cqw -1cqw rgba(30,26,60,.35),0 0 0 .18cqw #3d12fc;opacity:0;pointer-events:none}
.rs-ghost.is-on{opacity:1}
.rs-w--hero>i{background:linear-gradient(135deg,#d6cfff,#3d12fc)}
.rs-w--text>i{background:repeating-linear-gradient(#c9c7d6 0 .3cqw,transparent .3cqw 1cqw)}
.rs-w--cards>i{background:linear-gradient(90deg,#b4a8ff 0 30%,transparent 30% 35%,#b4a8ff 35% 65%,transparent 65% 70%,#b4a8ff 70%)}
.rs-w--gal>i{background:linear-gradient(90deg,transparent 48%,#fff 48% 52%,transparent 52%),linear-gradient(transparent 45%,#fff 45% 55%,transparent 55%),#8f7bff}
.rs-w--map>i{background:radial-gradient(circle at 60% 40%,#3d12fc 0 12%,transparent 13%),repeating-linear-gradient(90deg,#e1def0 0 1px,transparent 1px 20%),repeating-linear-gradient(#e1def0 0 1px,transparent 1px 25%),#f3f1fb}
.rs-w--form>i{background:linear-gradient(#e1def0 0 22%,transparent 22% 36%,#e1def0 36% 58%,transparent 58% 72%,#0e0d16 72%) 0 0/70% 100% no-repeat}
.rs--build .rs-px{left:5cqw;right:auto;top:9cqh}
.rs--build .rs-px span{color:#5d5c69}

/* зарплаты: распределение столбцами, города переключаются */
.rs-bars{position:absolute;left:41cqw;top:10cqh;width:53cqw;height:76cqh;display:grid;grid-template-rows:auto minmax(0,1fr);gap:2cqw;padding:2.4cqw;border-radius:1.4cqw;background:#fff;
  box-shadow:0 3cqw 6cqw -2cqw rgba(30,26,60,.3),0 0 0 1px rgba(14,13,22,.06)}
.rs-bars__tabs{display:flex;flex-wrap:wrap;gap:.8cqw;margin:0}
.rs-bars__tabs span{padding:.8cqw 1.4cqw;border-radius:99px;background:#f0f0f5;color:#5d5c69;font:500 1.25cqw/1 var(--r-d);transition:background .3s,color .3s}
.rs-bars__tabs span.is-on{background:var(--ink);color:#fff}
.rs-bars__g{display:flex;align-items:flex-end;gap:.7cqw;border-bottom:1px solid rgba(14,13,22,.12)}
.rs-bars__g{height:100%}
.rs-bars__g i{flex:1;height:100%;border-radius:.5cqw .5cqw 0 0;background:#d9d3ff;transform:scaleY(var(--h,0));transform-origin:50% 100%;transition:transform .8s cubic-bezier(.16,1,.3,1) calc(var(--i) * 25ms),background .3s}
.rs-bars__g i.is-max{background:#3d12fc}

/* слои карты в изометрии сходятся в одну карту */
.rs-ly{position:absolute;left:62%;top:50%;width:38cqw;height:38cqw;transform:translate(-50%,-50%) rotateX(56deg) rotateZ(-40deg);transform-style:preserve-3d}
.rs-ly__p{position:absolute;inset:0;border:1px solid rgba(180,168,255,.45);background:rgba(61,18,252,.08);opacity:0;transform:translateZ(calc(var(--i) * 1.2cqw))}
.rs--layers.is-on .rs-ly__p{animation:rsly 4.6s cubic-bezier(.65,0,.35,1) calc(var(--i) * .18s) both}
@keyframes rsly{0%{opacity:0;transform:translateZ(calc(var(--i) * 8cqw + 20cqw))}20%,55%{opacity:1;transform:translateZ(calc(var(--i) * 8cqw))}88%,100%{opacity:1;transform:translateZ(calc(var(--i) * 1.2cqw))}}
.rs-ly svg{display:block;width:100%;height:100%;fill:none;stroke:#b4a8ff;stroke-width:.5}
.rs-ly path.d{stroke-dasharray:2 1.4}
.rs-ly path.f{fill:rgba(143,123,255,.4);stroke:none;opacity:0}
.rs--layers.is-on .rs-ly path.f{animation:rsfade .6s ease 3.9s both}
.rs-ly circle{fill:#fafafa;stroke:none}
.rs-ly path.g{stroke:rgba(180,168,255,.28);stroke-width:.2}
.rs-ly path.w{stroke:#fafafa;stroke-width:.7}

/* конвертер: строки одной таблицы переходят в другую */
.rs-cvt{position:absolute;left:41cqw;top:12cqh;width:53cqw;height:72cqh;display:grid;grid-template-columns:minmax(0,1fr) 7cqw minmax(0,1fr);align-items:center}
.rs-cvt__t{display:grid;gap:.5cqw;padding:1.6cqw;border-radius:1.2cqw;background:#fff;box-shadow:0 2.4cqw 4.4cqw -2cqw rgba(30,26,60,.28),0 0 0 1px rgba(14,13,22,.06)}
.rs-cvt__h,.rs-cvt__r{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:.8cqw;margin:0}
.rs-cvt__h{margin-bottom:.6cqw}
.rs-cvt__h i{height:1.2cqw;border-radius:.3cqw;background:#3d12fc}
.rs-cvt__t--b .rs-cvt__h i{background:var(--ink)}
.rs-cvt__r{padding:.8cqw .6cqw;border-radius:.5cqw}
.rs-cvt__r i{width:var(--w);height:.9cqw;border-radius:.3cqw;background:#dcdbe6}
.rs--convert.is-on .rs-cvt__t--a .rs-cvt__r{animation:rsrowa .9s ease calc(.4s + var(--i) * .45s) both}
@keyframes rsrowa{0%,100%{background:transparent}30%,70%{background:#efebff}}
.rs-cvt__t--b .rs-cvt__r i{transform:scaleX(0);transform-origin:0 50%}
.rs--convert.is-on .rs-cvt__t--b .rs-cvt__r i{animation:rsfill .5s cubic-bezier(.16,1,.3,1) calc(.85s + var(--i) * .45s) both}
@keyframes rsfill{to{transform:none;background:#b4a8ff}}
.rs-cvt__mid{position:relative;height:100%}
.rs-cvt__mid i{position:absolute;left:8%;top:calc(30% + var(--i) * 8.4%);width:1cqw;height:1cqw;border-radius:50%;background:#3d12fc;opacity:0}
.rs--convert.is-on .rs-cvt__mid i{animation:rsfly .5s ease-in-out calc(.6s + var(--i) * .45s) both}
@keyframes rsfly{0%{opacity:0;translate:0 0}20%,80%{opacity:1}100%{opacity:0;translate:5cqw 0}}

/* было / стало */
.rs-cmp{position:absolute;left:5cqw;right:5cqw;top:12cqh;display:grid;gap:6cqh;margin:0;padding:0;list-style:none}
.rs-cmp li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.4cqw 3cqw;align-items:baseline}
.rs-cmp li>span{color:#c9c5e6;font-size:1.5cqw}
.rs-cmp p{grid-column:1/-1;position:relative;height:4cqw;margin:0}
.rs-cmp p i{position:absolute;left:0;top:0;bottom:0;border-radius:.6cqw}
.rs-cmp p i:first-child{right:0;border:1px solid rgba(250,250,250,.2);background:rgba(250,250,250,.08)}
.rs-cmp p i:last-child{right:0;background:linear-gradient(90deg,#3d12fc,#8f7bff);transform-origin:0 50%}
.rs--cmp.is-on .rs-cmp p i:last-child{animation:rsshrink 1.4s cubic-bezier(.65,0,.35,1) calc(.8s + var(--i) * .4s) both}
@keyframes rsshrink{from{transform:none}to{transform:scaleX(var(--r))}}
.rs-cmp li>b{color:#fafafa;font:600 3.2cqw/1 var(--r-d);letter-spacing:-.04em;white-space:nowrap;opacity:0}
.rs--cmp.is-on .rs-cmp li>b{animation:rsfade .6s ease calc(1.9s + var(--i) * .4s) both}

/* стек: метки вылетают по очереди */
.rs-chp{position:absolute;left:41cqw;right:5cqw;top:12cqh;display:flex;flex-wrap:wrap;align-content:flex-start;gap:1.2cqw;margin:0;padding:0;list-style:none}
.rs-chp li{padding:1.4cqw 2.2cqw;border-radius:99px;background:#fff;color:var(--ink);font:600 2.2cqw/1 var(--r-d);letter-spacing:-.03em;box-shadow:0 1.2cqw 2.4cqw -1.2cqw rgba(30,26,60,.3),0 0 0 1px rgba(14,13,22,.06);opacity:0}
.rs-chp li:nth-child(4n+1){background:#3d12fc;color:#fff}
.rs--chips.is-on .rs-chp li{animation:rschip .6s cubic-bezier(.16,1,.3,1) calc(.2s + var(--i) * .12s) both}
@keyframes rschip{from{opacity:0;transform:translateY(3cqh) scale(.9)}to{opacity:1;transform:none}}

/* автотесты: строки проверяются по очереди */
.rs-run{position:absolute;left:41cqw;top:9cqh;width:53cqw;padding:2cqw;border:1px solid rgba(250,250,250,.12);border-radius:1.2cqw;background:rgba(250,250,250,.04)}
.rs-run__chips{display:flex;gap:.8cqw;margin:0 0 1.8cqw}
.rs-run__chips span{padding:.7cqw 1.2cqw;border:1px solid rgba(250,250,250,.25);border-radius:99px;color:#fafafa;font:500 1.2cqw/1 var(--r-d)}
.rs-run__l{display:grid;gap:1.1cqw;margin:0;padding:0;list-style:none}
.rs-run__l li{display:flex;align-items:center;gap:1.2cqw}
.rs-run__l li>i{position:relative;flex:none;width:2cqw;height:2cqw}
.rs-run__l li>i::before,.rs-run__l li>i::after{content:"";position:absolute;inset:0;border-radius:50%}
.rs-run__l li>i::before{border:.2cqw solid rgba(250,250,250,.25);border-top-color:#b4a8ff;animation:rsspin .8s linear infinite}
.rs-run__l li>i::after{transform:scale(0);background:#12b76a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/72% no-repeat}
.rs-run__l li>span{width:var(--w);height:.9cqw;border-radius:.3cqw;background:rgba(250,250,250,.18)}
.rs--run.is-on .rs-run__l li>i::before{animation:rsspin .8s linear infinite,rsgone .2s ease calc(.6s + var(--i) * .32s) forwards}
.rs--run.is-on .rs-run__l li>i::after{animation:rsok .35s cubic-bezier(.16,1,.3,1) calc(.6s + var(--i) * .32s) forwards}
.rs--run.is-on .rs-run__l li>span{animation:rsbright .3s ease calc(.6s + var(--i) * .32s) forwards}
@keyframes rsspin{to{rotate:360deg}}
@keyframes rsgone{to{opacity:0}}
@keyframes rsok{to{transform:scale(1)}}
@keyframes rsbright{to{background:rgba(250,250,250,.5)}}

/* телефон: кадр 4:5 — сцены в колонку, подпись внизу во всю ширину */
@media (max-width:699px){
  .reel--case .rs-by img{height:calc(var(--lh,7) * 1cqw)}
  .rs-hard--k{font-size:min(44cqh,calc(130cqw / var(--gl,1)))}
  .rs-brand{flex-wrap:wrap;justify-content:center;gap:3cqw;max-width:88cqw}
  .rs-brand__logo{height:calc(var(--lh,7) * 1.7cqw);max-width:84cqw}
  .rs-word{font-size:min(9cqw,calc(150cqw / var(--wl,10)));white-space:normal;text-align:center}
  .rs-by>.rs-word--by{font-size:min(6cqw,calc(80cqw / var(--wl,10)));white-space:nowrap}
  .reel--case .rs-by{flex-wrap:wrap;max-width:88cqw}
  .reel--case .rs-cap>b{font-size:5.8cqw}
  .reel--case .rs-plane{--ty:var(--tym)}
  .rs-s--1,.rs-float--2 .rs-s--1{left:6cqw;top:5cqh;width:80cqw}
  .rs-s--2{left:4cqw;top:22cqh;width:72cqw}
  .rs-s--3{left:28cqw;top:38cqh;width:66cqw}
  .rs-float--2 .rs-s--2{left:16cqw;top:28cqh;width:78cqw}
  .rs--float::after{background:linear-gradient(0deg,rgba(236,235,242,.97) 0,rgba(236,235,242,.8) 22%,rgba(236,235,242,0) 40%)}
  .rs-win{left:6cqw;right:6cqw;top:8cqh;width:auto;height:min(60cqh,calc(88cqw / var(--ar,1.4) + 5cqw));translate:none}
  .rs-win__bar{height:5cqw;padding:0 2.4cqw;gap:1.2cqw}.rs-win__bar i{width:1.6cqw;height:1.6cqw}
  .rs-win__in{top:5cqw}
  .rs-bpimg{right:auto;left:50%;top:6cqh;width:84cqw;translate:-50% 0}
  .rs--pic .rs-cap,.rs--chat .rs-cap,.rs--build .rs-cap,.rs--bars .rs-cap,.rs--convert .rs-cap,.rs--chips .rs-cap,.rs--run .rs-cap,
  .rs--tiles .rs-cap,.rs--grow .rs-cap,.rs--count .rs-cap{max-width:none}
  .rs-mg{--sx:.42}
  .rs-mg__i{width:52cqw}.rs-mg__to{width:78cqw}
  .rs-mg__i,.rs-mg__to{top:58%}
  .rs-mg__l{top:25cqh;right:6cqw;font-size:12cqw}
  .rs-hub{left:6cqw;right:6cqw;top:7cqh;width:auto;height:auto;display:flex;flex-direction:column;align-items:flex-start;gap:3cqw}
  .rs-hub__ln{display:none}
  .rs-hub__c{position:relative;left:auto;top:auto;width:28cqw;height:28cqw;margin-bottom:3cqw;transform:none;font-size:4.4cqw}
  .rs-hub__s{position:relative;left:auto!important;top:auto!important;transform:none;gap:2cqw;padding:2.8cqw 4cqw;font-size:4.4cqw}
  .rs-hub__s i{font-size:3.2cqw}
  .rs--hub.is-on .rs-hub__c,.rs--hub.is-on .rs-hub__s{animation-name:rspop0}
  .rs-steps{top:34cqh;left:6cqw;right:6cqw;grid-template-columns:1fr;gap:3.6cqw}
  .rs-steps::before,.rs-steps::after{display:none}
  .rs-steps li{grid-template-columns:auto 1fr;align-items:center;gap:3.6cqw}
  .rs-steps i{width:9cqw;height:9cqw;font-size:3cqw}
  .rs-steps b{font-size:4.6cqw}
  .rs--count .rs-big b{font-size:min(30cqw,calc(105cqw / var(--n,4)))}
  .rs-chips{left:6cqw;right:6cqw;bottom:auto;top:40cqh;max-width:none;justify-items:start;gap:2cqw}
  .rs-chips li{padding:2cqw 3.2cqw;font-size:3.4cqw;text-align:left;white-space:normal}
  .rs-px--l{left:6cqw;top:6cqh}
  .rs-px--l b{font-size:17cqw}
  .rs-tl{right:auto;left:6cqw;top:22cqh;grid-template-columns:repeat(10,7.6cqw);gap:1.2cqw}
  .rs-tl i{height:6cqw}
  .rs-gr{right:auto;left:12cqw;top:22cqh;grid-template-columns:repeat(5,11cqw);gap:2.4cqw 4cqw}
  .rs-gr i{height:11cqw}
  .rs-gr i::before{width:4.4cqw;height:4.4cqw}
  .rs-gr i::after{width:9cqw;height:6cqw}
  .rs-chat{left:6cqw;width:88cqw;top:5cqh;height:58cqh;border-radius:3cqw}
  .rs-chat__hd{gap:2cqw;padding:3cqw 3.4cqw;font-size:3.4cqw}.rs-chat__hd i{width:5cqw;height:5cqw}
  .rs-chat__log{gap:2cqw;padding:3.4cqw}
  .rs-msg{padding:2.2cqw 3cqw;border-radius:3cqw;font-size:3.4cqw}
  .rs-typing{gap:1cqw}.rs-typing i{width:1.4cqw;height:1.4cqw}
  .rs-chat__opts{gap:1.6cqw;padding:2.6cqw 3.4cqw 3.4cqw}
  .rs-chat__opts span{padding:1.8cqw 2.8cqw;font-size:3cqw}
  .rs-res{left:10cqw;right:10cqw;top:16cqh;width:auto;grid-template-columns:1fr 1fr;gap:2.4cqw}
  .rs-res li{padding:3cqw;border-radius:3cqw}
  .rs-res li>b{font-size:4cqw}.rs-res li>span{display:none}
  .rs-chat__log{transition:opacity .4s}.rs--chat.is-res .rs-chat__log{opacity:.12}
  .rs-bd{left:5cqw;width:90cqw;top:22cqh;height:52cqh;grid-template-columns:18cqw minmax(0,1fr);gap:2.4cqw}
  .rs-bd__pal{gap:1.6cqw;padding:2cqw;border-radius:2.4cqw}
  .rs-bd__cv{grid-template-rows:3cqw 18cqw 11cqw 12cqw;gap:1.8cqw;padding:2.4cqw;border-radius:2.4cqw}
  .rs-w{height:7.6cqw}
  .rs--build .rs-px{left:6cqw;top:5cqh}
  .rs--build .rs-px b{font-size:14cqw}
  .rs-bars{left:6cqw;width:88cqw;top:6cqh;height:60cqh;padding:4cqw;gap:4cqw;border-radius:3cqw}
  .rs-bars__tabs{gap:1.6cqw}.rs-bars__tabs span{padding:1.8cqw 2.8cqw;font-size:3cqw}
  .rs-bars__g{gap:1.2cqw}
  .rs-ly{left:50%;top:38%;width:62cqw;height:62cqw}
  .rs-cvt{left:5cqw;width:90cqw;top:8cqh;height:60cqh;grid-template-columns:minmax(0,1fr) 6cqw minmax(0,1fr)}
  .rs-cvt__t{gap:1cqw;padding:2.6cqw;border-radius:2.4cqw}
  .rs-cvt__h i{height:2.2cqw}.rs-cvt__r{padding:1.4cqw 1cqw}.rs-cvt__r i{height:1.8cqw}
  .rs-cvt__mid i{width:2cqw;height:2cqw}
  .rs-cmp{left:6cqw;right:6cqw;top:8cqh;gap:7cqh}
  .rs-cmp li{gap:2.4cqw 3cqw}
  .rs-cmp li>span{font-size:3.6cqw}.rs-cmp p{height:7cqw}.rs-cmp li>b{font-size:5.6cqw}
  .rs-chp{left:6cqw;right:6cqw;top:7cqh;gap:2.4cqw}
  .rs-chp li{padding:2.6cqw 4cqw;font-size:4.4cqw}
  .rs-run__l li:nth-child(n+8){display:none}
  .rs-run{left:6cqw;right:6cqw;width:auto;top:5cqh;padding:4cqw;border-radius:3cqw}
  .rs-run__chips{gap:2cqw;margin-bottom:4cqw}.rs-run__chips span{padding:1.8cqw 2.8cqw;font-size:3cqw}
  .rs-run__l{gap:2.4cqw}.rs-run__l li{gap:3cqw}.rs-run__l li>i{width:4.6cqw;height:4.6cqw}.rs-run__l li>span{height:2cqw}
}
