/* KAR WORKVISION — экраны сайта AI-помощника (подключается после style.css, graphite.css, system3d.css).
   Цвет WorkVision: глубокий зелёный #194138 + холодный серый (#616C71 / #B1B4BC); мятный и салатовый — только акценты. */
:root{--sp:clamp(44px,4.2vw,68px);--sp-t:calc(var(--sp) + 8px);--f-text:Montserrat,"Noto Sans Thai",Arial,sans-serif;--f-mono:"Plex Mono","Noto Sans Thai",ui-monospace,monospace;--wv-bg:#194138;--wv-bg-2:#1E4A40;--wv-line:rgba(230,227,224,.14);--wv-ice:#E4E7EA;--wv-card:#F3F4F6}

/* ============ ЭКРАН 2 — что такое WorkVision ============ */
.wv2{position:relative;background:var(--wv-bg);color:var(--sand);padding:0;overflow:hidden}
.wv2-grid{display:grid;grid-template-columns:var(--split) 1fr}
.wv2-text{padding:var(--sp-t) clamp(20px,2.4vw,40px) var(--sp) var(--pad);border-right:1px solid var(--wv-line)}

.wv2-kick{margin:0 0 30px;font-size:15px;text-transform:uppercase;letter-spacing:.18em;color:var(--mint)}
.wv2-title{margin:0;font:700 clamp(26px,2.9vw,46px)/1.02 var(--f-head);letter-spacing:.01em;color:var(--sand)}
.wv2-title .wl{position:relative;display:block;width:max-content}
.wv2-title .tx{opacity:0}
.wv2-title .bar{position:absolute;left:-.05em;right:-.05em;top:.04em;bottom:.02em;background:var(--mint);transform:scaleX(0);transform-origin:left}
.wv2-sub{margin:24px 0 0;font:600 clamp(15px,1.1vw,18px)/1.4 var(--f-text);max-width:32ch}
.wv2-type{margin:14px 0 26px;font-size:clamp(12px,.85vw,14px);line-height:1.6;color:var(--mint);min-height:3.2em;max-width:36ch}
.wv2-type .caret{display:inline-block;width:.6em;height:1.1em;margin-left:2px;vertical-align:-.18em;background:var(--mint);animation:caret 1s steps(1) infinite}
.wv2-sees{display:flex;align-items:center;gap:12px;margin:20px 0 0;min-height:1.6em;white-space:nowrap}
.wv2-sees b{font:600 clamp(14px,.95vw,15px)/1.4 var(--f-text);color:var(--sand)}
.wv2-tick{display:inline-flex;align-items:center;gap:9px;height:1.6em;font-size:clamp(13px,.95vw,15px);line-height:1;color:var(--mint)}
.wv2-tick .ck{position:relative;flex:none;width:13px;height:13px;top:-1px;border-radius:2px;background:var(--mint)}
.wv2-tick .ck::after{content:"";position:absolute;left:3.6px;top:1px;width:3px;height:6.5px;border:solid var(--wv-bg);border-width:0 1.4px 1.4px 0;transform:rotate(45deg)}
.wv2-tick .caret{display:inline-block;width:.6em;height:1.05em;margin-left:-7px;background:var(--mint);animation:caret 1s steps(1) infinite}
.wv2-body{margin:0 0 14px;font:400 clamp(12px,.85vw,14px)/1.7 var(--f-mono);letter-spacing:.01em;color:var(--grey);max-width:50ch}
/* тексты проявляются по очереди при входе экрана */
.wv2-text>*:not(.wv2-title){opacity:0;transform:translateY(10px);transition:opacity .7s,transform .7s cubic-bezier(.2,.7,.2,1)}
.wv2.in .wv2-text>*{opacity:1;transform:none}
.wv2.in .wv2-sub{transition-delay:.35s}.wv2.in .wv2-type{transition-delay:.5s}
.wv2.in .wv2-body{transition-delay:.65s}.wv2.in .wv2-sees{transition-delay:.8s}.wv2.in .wv2-body+.wv2-body{transition-delay:.8s}

/* правая часть: чертёжное поле (миллиметровка светлыми линиями), телефон в центре, по три функции с каждой стороны */
.wv2-stage{position:relative;display:grid;grid-template-columns:minmax(150px,205px) auto minmax(150px,205px);justify-content:center;grid-template-rows:repeat(3,auto);
  align-content:center;align-items:center;column-gap:clamp(28px,3.6vw,68px);row-gap:clamp(28px,5vh,60px);padding:var(--sp-t) clamp(24px,3vw,56px) var(--sp);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cpath d='M0 .5H100M.5 0V100' stroke='%23E6E3E0' stroke-opacity='.08' stroke-width='1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath d='M0 .5H20M.5 0V20' stroke='%23E6E3E0' stroke-opacity='.05' stroke-width='.8' stroke-dasharray='2 2'/%3E%3C/svg%3E");
  background-position:-1px -1px}
.wv-links{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.wv-links .lk{fill:none;stroke:rgba(230,227,224,.22);stroke-width:1;stroke-dasharray:3 4;transition:stroke .4s}
.wv-links .lk.on{stroke:var(--mint);stroke-dasharray:none}
.wv-links .nd{fill:var(--wv-bg);stroke:rgba(230,227,224,.35);stroke-width:1;transition:fill .4s,stroke .4s}
.wv-links .nd.on{fill:var(--mint);stroke:var(--mint)}
.wv-links .run{fill:var(--mint);filter:drop-shadow(0 0 4px var(--mint))}

/* функция: тонкая иконка, название, моно-подпись; активная — мятная обводка */
.wv-fn{position:relative;z-index:2;grid-column:calc((var(--c) - 1) * 2 + 1);grid-row:var(--r);display:grid;grid-template-columns:auto 1fr;column-gap:11px;row-gap:4px;
  align-items:center;text-align:left;padding:12px 14px;border:1px solid var(--wv-line);border-radius:14px;background:rgba(25,65,56,.82);
  color:var(--sand);font:inherit;cursor:pointer;transition:border-color .4s,background .4s,transform .4s cubic-bezier(.2,.7,.2,1)}
.wv-fn svg{grid-row:span 2;width:22px;height:22px;fill:none;stroke:var(--grey);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s}
.wv-fn b{font:600 14px/1.2 var(--f-text)}
.wv-fn span{font-size:10.5px;line-height:1.35;color:var(--grey);letter-spacing:.02em}
.wv-fn:hover{border-color:rgba(121,239,179,.45)}
.wv-fn.on{border-color:var(--mint);background:rgba(121,239,179,.08)}
.wv-fn.on svg{stroke:var(--mint)}
.wv-fn:focus-visible{outline:1px solid var(--mint);outline-offset:3px}
/* полоса автопоказа под активной функцией */
.wv-fn::after{content:"";position:absolute;left:18px;right:18px;bottom:-1px;height:1px;background:var(--mint);transform:scaleX(var(--p,0));transform-origin:left}

/* ---------- телефон ---------- */
.wv-phone{position:relative;z-index:3;grid-column:2;grid-row:1 / span 3;width:clamp(240px,15vw,262px);aspect-ratio:300 / 620;padding:9px;border-radius:46px;
  background:linear-gradient(160deg,#2C292A,#1A1718);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 40px 80px -30px rgba(0,0,0,.6),0 0 0 1px rgba(121,239,179,.12)}
.ph-scr{height:100%;border-radius:37px;overflow:hidden;background:var(--wv-ice);color:var(--graphite);display:flex;flex-direction:column}
.ph-bar{display:flex;justify-content:space-between;align-items:center;height:38px;padding:0 22px;font-size:11px;flex:none}
.ph-isl{width:78px;height:22px;border-radius:12px;background:#151213}
.ph-sig{display:flex;gap:2px;align-items:flex-end}.ph-sig i{width:3px;background:var(--graphite);border-radius:1px}
.ph-sig i:nth-child(1){height:5px}.ph-sig i:nth-child(2){height:7px}.ph-sig i:nth-child(3){height:9px}
.ph-app{flex:1;display:flex;flex-direction:column;gap:9px;padding:6px 12px 12px;min-height:0}
.ph-head{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:12px;background:var(--wv-bg);color:var(--sand)}
.ph-head b{font:700 11px/1 var(--f-head);letter-spacing:.02em;flex:1}
.ph-sign{width:15px;height:15px;fill:var(--mint)}
.ph-ai{font-size:9px;letter-spacing:.08em;padding:3px 6px;border:1px solid var(--mint);border-radius:6px;color:var(--mint)}
.ph-obj{padding:2px 4px}
.ph-obj b{display:block;font:700 15px/1.2 var(--f-text)}
.ph-obj span{font-size:10px;color:var(--steel)}
.ph-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.ph-stats div{padding:7px 4px 6px;border-radius:10px;background:var(--wv-card);text-align:center;transition:background .4s,box-shadow .4s}
.ph-stats b{display:block;font:700 16px/1.1 var(--f-text)}
.ph-stats span{font-size:8.5px;color:var(--steel)}
.ph-stats div.on{background:var(--salad);box-shadow:inset 0 0 0 1px var(--wv-bg)}
.ph-prog{height:5px;border-radius:3px;background:#CFD3D8;overflow:hidden}
.ph-prog i{display:block;height:100%;width:58%;background:var(--wv-bg);border-radius:3px;transition:width .9s cubic-bezier(.2,.7,.2,1)}
.ph-prog.on i{width:71%;background:var(--mint)}
.ph-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;min-height:0}
.ph-list li{display:grid;grid-template-columns:auto 1fr;column-gap:9px;align-items:center;padding:8px 10px;border-radius:10px;background:var(--wv-card);
  transition:background .4s,box-shadow .4s,transform .4s cubic-bezier(.2,.7,.2,1)}
.ph-list li b{font:600 11.5px/1.25 var(--f-text)}
.ph-list li span{grid-column:2;font-size:9.5px;color:var(--steel)}
.ph-list li .sti{grid-row:span 2;width:8px;height:8px;border-radius:2px}
.st-run{background:var(--wv-bg)}.st-late{background:var(--steel)}.st-chk{background:var(--salad);box-shadow:inset 0 0 0 1px var(--wv-bg)}.st-ok{background:var(--mint)}
.ph-list li.on{background:#fff;box-shadow:inset 0 0 0 1.5px var(--mint),0 6px 16px -10px rgba(25,65,56,.5);transform:translateX(3px)}
.ph-tabs{margin-top:auto;display:flex;justify-content:space-around;padding:10px 6px 2px;border-top:1px solid #D2D6DA}
.ph-tabs i{width:18px;height:4px;border-radius:2px;background:#C4C8CE}.ph-tabs i.on{background:var(--wv-bg)}

/* ---------- всплывающее окно функции (как карточка в приложении) ---------- */
.wv-pop{position:absolute;z-index:5;width:clamp(230px,15.5vw,262px);padding:12px;border-radius:16px;background:var(--wv-card);color:var(--graphite);
  box-shadow:0 30px 60px -24px rgba(0,0,0,.55),0 0 0 1px rgba(25,65,56,.08);opacity:0;transform:translateY(10px);pointer-events:none;
  transition:opacity .45s,transform .55s cubic-bezier(.2,.7,.2,1),left .6s cubic-bezier(.2,.7,.2,1),top .6s cubic-bezier(.2,.7,.2,1)}
.wv-pop.show{opacity:1;transform:none}
.pp-h{display:flex;align-items:center;gap:7px;padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid #DEE1E5}
.pp-h svg{width:13px;height:13px;fill:var(--wv-bg)}
.pp-h b{font:600 12px var(--f-text);flex:1}
.pp-badge{white-space:nowrap;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;padding:4px 7px;border-radius:6px;background:var(--salad);color:var(--wv-bg)}
.pp-badge.dk{background:var(--wv-bg);color:var(--mint)}
.pp-t{margin:0 0 3px;font:600 13px/1.3 var(--f-text)}
.pp-s{margin:0;font-size:10.5px;color:var(--steel);line-height:1.5}
.pp-rows{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.pp-row{display:flex;justify-content:space-between;gap:10px;font-size:11px;padding:7px 9px;border-radius:8px;background:var(--wv-ice)}
.pp-row span{color:var(--steel)}
/* элементы окна проявляются по очереди */
.wv-pop .q{opacity:0;transform:translateY(6px);transition:opacity .4s,transform .45s cubic-bezier(.2,.7,.2,1)}
.wv-pop.show .q{opacity:1;transform:none}
.wv-pop.show .q:nth-child(2){transition-delay:.12s}.wv-pop.show .q:nth-child(3){transition-delay:.24s}
.wv-pop.show .q:nth-child(4){transition-delay:.36s}.wv-pop.show .q:nth-child(5){transition-delay:.48s}

/* сроки: мини-график этапов */
.pp-gantt{margin-top:10px;display:flex;flex-direction:column;gap:7px}
.pp-gantt div{display:grid;grid-template-columns:62px 1fr;align-items:center;gap:8px;font-size:10px;color:var(--steel)}
.pp-gantt p{margin:0;position:relative;height:8px;border-radius:4px;background:var(--wv-ice)}
.pp-gantt p i{position:absolute;top:0;bottom:0;left:var(--a);width:0;border-radius:4px;background:var(--wv-bg);transition:width .9s cubic-bezier(.2,.7,.2,1) .3s}
.wv-pop.show .pp-gantt p i{width:var(--w)}
.pp-gantt p i.late{background:var(--steel)}
.pp-gantt p i.now{background:var(--mint)}
.pp-gantt p em{position:absolute;top:-3px;bottom:-3px;width:1px;background:var(--graphite);left:52%}
/* перевод: два пузыря */
.pp-msg{margin-top:8px;padding:9px 11px;border-radius:12px 12px 12px 4px;background:var(--wv-ice);font-size:12px;line-height:1.45}
.pp-msg.to{margin-left:22px;border-radius:12px 12px 4px 12px;background:var(--wv-bg);color:var(--sand)}
.pp-msg small{display:block;margin-bottom:3px;font:400 9px var(--f-mono);letter-spacing:.08em;color:var(--steel);text-transform:uppercase}
.pp-msg.to small{color:var(--mint)}
.pp-msg .caret{display:inline-block;width:.5em;height:1em;margin-left:1px;vertical-align:-.15em;background:var(--mint);animation:caret 1s steps(1) infinite}
/* фото: условные кадры — чертёжные эскизы, не выдаём за реальные фото */
.pp-ph{margin-top:10px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.pp-ph svg{display:block;width:100%;aspect-ratio:1;border-radius:8px;background:#CDD2D7}
.pp-ph svg path{fill:none;stroke:var(--wv-bg);stroke-width:1.2;opacity:.55}
.pp-ph svg .fl{fill:var(--salad);stroke:none;opacity:1}
/* проверка: квадратные отметки */
.pp-ck{margin:10px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.pp-ck li{display:flex;align-items:center;gap:9px;font-size:11.5px}
.pp-ck li i{width:13px;height:13px;flex:none;border:1.2px solid var(--wv-bg);border-radius:3px;position:relative;transition:background .3s}
.pp-ck li.is-ok i{background:var(--mint);border-color:var(--wv-bg)}
.pp-ck li.is-ok i::after{content:"";position:absolute;left:3.5px;top:.5px;width:3px;height:7px;border:solid var(--wv-bg);border-width:0 1.4px 1.4px 0;transform:rotate(45deg)}
/* камера: кадр с метками */
.pp-cam{position:relative;margin-top:10px;border-radius:10px;overflow:hidden;background:#2A3431;aspect-ratio:16 / 9}
.pp-cam svg{position:absolute;inset:0;width:100%;height:100%}
.pp-cam svg path{fill:none;stroke:rgba(230,227,224,.4);stroke-width:1}
.pp-cam .rec{position:absolute;left:8px;top:7px;font:400 8.5px var(--f-mono);letter-spacing:.08em;color:var(--sand)}
.pp-cam .mk{position:absolute;border:1.2px solid var(--mint);border-radius:3px;opacity:0;transition:opacity .4s}
.pp-cam .mk span{position:absolute;left:-1px;top:-15px;padding:1px 4px;background:var(--mint);color:var(--wv-bg);font:400 8px var(--f-mono);white-space:nowrap;border-radius:2px}
.wv-pop.show .pp-cam .mk{opacity:1;transition-delay:.7s}.wv-pop.show .pp-cam .mk+.mk{transition-delay:1.1s}
/* отчёт: столбики */
.pp-kpi{margin-top:10px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;text-align:center}
.pp-kpi div{padding:7px 4px;border-radius:8px;background:var(--wv-ice)}
.pp-kpi b{display:block;font:700 16px/1.1 var(--f-text)}.pp-kpi span{font-size:9px;color:var(--steel)}
.pp-bars{margin-top:10px;height:54px;display:flex;align-items:flex-end;gap:5px;padding:0 2px;border-bottom:1px solid #D2D6DA}
.pp-bars i{flex:1;height:0;border-radius:3px 3px 0 0;background:var(--wv-bg);transition:height .8s cubic-bezier(.2,.7,.2,1)}
.pp-bars i.m{background:var(--mint)}
.wv-pop.show .pp-bars i{height:var(--h)}

/* ---------- адаптив ---------- */
@media (max-width:1280px){
  .wv2-stage{column-gap:28px}
  .wv-fn{padding:11px 12px;column-gap:9px}.wv-fn b{font-size:13.5px}.wv-fn svg{width:20px;height:20px}
}
@media (max-width:1100px){
  .wv2-grid{grid-template-columns:1fr}
  .wv2-text{border-right:0;border-bottom:1px solid var(--wv-line)}
}
@media (max-width:720px){
  .wv2-text{padding:var(--sp-t) var(--pad) 40px}
  .wv2-kick{font-size:12px;margin-bottom:22px}
  .wv2-stage{grid-template-columns:1fr 1fr;grid-template-rows:auto;column-gap:10px;row-gap:10px;padding:40px var(--pad) var(--sp)}
  .wv-phone{grid-column:1 / span 2;grid-row:1;justify-self:center;width:min(270px,72vw);margin-bottom:24px}
  .wv-fn{grid-column:auto;grid-row:auto;padding:12px;grid-template-columns:1fr;row-gap:6px}
  .wv-fn svg{grid-row:auto;width:22px;height:22px}
  .wv-fn b{font-size:13.5px}.wv-fn span{font-size:10.5px}
  .wv-links{display:none}
  .wv-pop{width:min(270px,76vw)}
}
@media (prefers-reduced-motion:reduce){
  .wv2-text>*{opacity:1!important;transform:none!important}
  .wv2-title .tx{opacity:1}
}

/* значок AI: «AI» в кольце с бегущим штрихом (как на сайте KAR Supply и в схеме KAR SYSTEM); на светлом — тёмно-зелёный */
.aib{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:22px;height:22px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(121,239,179,.45)}
.aib em{font:600 8.5px var(--f-mono);font-style:normal;letter-spacing:.02em;color:var(--mint)}
.aib::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:1.5px solid transparent;border-top-color:var(--mint);animation:aiSpin 2.2s linear infinite}
.aib-sm{width:18px;height:18px}.aib-sm em{font-size:7.5px}.aib-sm::after{inset:-2.5px;border-width:1.3px}
.wv-light .aib,.card .aib,.crm .aib{box-shadow:inset 0 0 0 1px rgba(25,65,56,.35)}
.wv-light .aib em,.card .aib em,.crm .aib em{color:var(--wv-bg)}
.wv-light .aib::after,.card .aib::after,.crm .aib::after{border-top-color:var(--wv-bg)}
.ph-head .aib,.ra-bar .aib,.ai-bridge .aib,.card[style*="--wv-bg"] .aib{box-shadow:inset 0 0 0 1px rgba(121,239,179,.45)}
.ph-head .aib em,.ra-bar .aib em,.ai-bridge .aib em,.card[style*="--wv-bg"] .aib em{color:var(--mint)}
.ph-head .aib::after,.ra-bar .aib::after,.ai-bridge .aib::after,.card[style*="--wv-bg"] .aib::after{border-top-color:var(--mint)}
@keyframes aiSpin{to{transform:rotate(360deg)}}
.wv2-title{position:relative;width:max-content}
.wv2-title .aib-lg{position:absolute;right:-44px;bottom:8px;width:30px;height:30px}.wv2-title .aib-lg em{font-size:10.5px}
.wv-fn>.aib{position:absolute;top:9px;right:9px}
.pp-h .aib{margin-right:2px}
.ra-bar .aib{margin-left:-2px}
.crm-brand .aib{margin-left:4px}
@media (prefers-reduced-motion:reduce){.aib::after{animation:none}}
@media (max-width:720px){.wv2-title .aib-lg{right:-36px;width:26px;height:26px}}
/* Рабочие панели (роль, сценарий, панель проекта) — один размер: до 650px, 16:10. */
/* Отступы экранов — единое правило: сверху var(--sp-t), снизу var(--sp); экран заканчивается вместе с содержимым, без пустот. */
/* Два шрифта на всех экранах: основной (заголовки, подзаголовки) и моноширинный мелкий — для поясняющих текстов
   (как «печатная машинка», но статично). */
/* ================================================================
   ОБЩЕЕ ДЛЯ ЭКРАНОВ 3–6
   Ритм цвета: графит (1) → зелёный (2) → светлый холодный (3) → графит (4) → светлый холодный (5) → зелёный (6) → графит (подвал)
   ================================================================ */
.wv-head{max-width:var(--maxw,none);padding:0 var(--pad)}
.wv-kick{margin:0 0 22px;font-size:15px;text-transform:uppercase;letter-spacing:.18em;color:var(--mint)}
.wv-h2{margin:0;font:700 clamp(26px,2.7vw,44px)/1.08 var(--f-head);text-transform:uppercase;letter-spacing:.01em;max-width:22ch}
.wv-light{--grid-c:%23221F20}
/* светлые экраны: холодный светлый фон + тёмная миллиметровка */
.wv3,.wv5{background-color:var(--wv-ice);color:var(--graphite);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cpath d='M0 .5H100M.5 0V100' stroke='%23194138' stroke-opacity='.09' stroke-width='1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath d='M0 .5H20M.5 0V20' stroke='%23194138' stroke-opacity='.06' stroke-width='.8' stroke-dasharray='2 2'/%3E%3C/svg%3E");
  background-position:-1px -1px}
.wv3 .wv-kick,.wv5 .wv-kick{color:var(--wv-bg)}
/* общий вход: блоки экрана проявляются снизу */
.rv{opacity:0;transform:translateY(16px);transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1)}
.in .rv,.rv.in{opacity:1;transform:none}

/* ============ ЭКРАН 3 — кому подходит ============ */
.wv3{padding:var(--sp-t) 0 var(--sp)}
.rt-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:36px var(--pad) 0;padding:6px;border-radius:16px;background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 1px rgba(25,65,56,.1)}
.rt{position:relative;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px;height:46px;padding:0 10px;border:0;border-radius:11px;background:transparent;color:var(--steel);
  font:600 11.5px/1 var(--f-text);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;cursor:pointer;overflow:hidden;transition:background .4s,color .4s}
.rt svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.rt:hover{color:var(--graphite)}
.rt.on{background:var(--wv-bg);color:var(--sand)}
.rt.on svg{stroke:var(--mint)}
.rt::after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:1px;background:var(--mint);transform:scaleX(var(--p,0));transform-origin:left}
.rt-body{display:grid;grid-template-columns:minmax(300px,5fr) 6fr;gap:clamp(32px,5vw,96px);align-items:start;margin:36px var(--pad) 0}
.rt-title{margin:-.2em 0 16px;font:700 clamp(18px,1.45vw,24px)/1.25 var(--f-text);max-width:26ch}
.rt-text{margin:0 0 28px;font:400 clamp(12px,.85vw,14px)/1.7 var(--f-mono);letter-spacing:.01em;color:var(--wv-bg);max-width:46ch;min-height:6.8em}
.rt-text .caret{display:inline-block;width:.6em;height:1.1em;margin-left:2px;vertical-align:-.18em;background:var(--mint);box-shadow:0 0 0 1px var(--wv-bg);animation:caret 1s steps(1) infinite}
.rt-vis{display:flex;gap:10px;align-items:flex-start;margin:0;font-size:12.5px;line-height:1.6;color:var(--wv-bg);max-width:46ch}
.rt-vis i{flex:none;width:9px;height:9px;margin-top:5px;background:var(--mint);box-shadow:0 0 0 1px var(--wv-bg)}
.rt-copy>*{transition:opacity .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
.rt-copy.out>*{opacity:0;transform:translateY(6px)}
/* правая часть: условный экран роли */
.rt-art{position:relative;aspect-ratio:16 / 10;max-height:410px;width:100%;max-width:650px;justify-self:end;border-radius:14px;background:#F6F7F8;box-shadow:0 0 0 1px rgba(25,65,56,.1),0 40px 80px -40px rgba(25,65,56,.45);overflow:hidden}
.rt-art .q{opacity:0;transform:translateY(10px);transition:opacity .5s,transform .6s cubic-bezier(.2,.7,.2,1)}
.rt-art.show .q{opacity:1;transform:none}
.rt-art.show .q:nth-child(2){transition-delay:.15s}.rt-art.show .q:nth-child(3){transition-delay:.3s}.rt-art.show .q:nth-child(4){transition-delay:.45s}
.rt-art.show .q:nth-child(5){transition-delay:.6s}.rt-art.show .q:nth-child(6){transition-delay:.75s}
.ra{position:absolute;inset:0}
.ra-bar{position:absolute;left:0;right:0;top:0;height:44px;display:flex;align-items:center;gap:10px;padding:0 18px;background:var(--wv-bg);color:var(--sand);font:700 11px var(--f-head);letter-spacing:.03em}
.ra-bar svg{width:15px;height:15px;fill:var(--mint)}
.ra-bar .mono{margin-left:auto;font:400 10px var(--f-mono);letter-spacing:.08em;color:var(--mint);text-transform:uppercase}
.card{position:absolute;padding:12px 14px;border-radius:10px;background:#fff;box-shadow:0 18px 40px -22px rgba(25,65,56,.55),0 0 0 1px rgba(25,65,56,.07);font-size:12px;color:var(--graphite)}
.card b{display:block;font:600 13px/1.3 var(--f-text)}
.card .mono{font-size:10px;color:var(--steel);letter-spacing:.03em}
.pill{display:inline-block;padding:3px 8px;border-radius:6px;font:400 9.5px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;background:var(--salad);color:var(--wv-bg)}
.pill.dk{background:var(--wv-bg);color:var(--mint)}.pill.gr{background:#E1E4E8;color:var(--steel)}
.pbar{display:block;height:5px;border-radius:3px;background:#E1E4E8;overflow:hidden;margin-top:8px}
.pbar i{display:block;height:100%;width:0;border-radius:3px;background:var(--wv-bg);transition:width 1.1s cubic-bezier(.2,.7,.2,1) .5s}
.show .pbar i{width:var(--w)}
.pbar i.m{background:var(--mint)}
.thb{display:block;height:44px;border-radius:8px;background:#CDD2D7;position:relative;overflow:hidden}
.thb svg{position:absolute;inset:0;width:100%;height:100%}
.thb svg path{fill:none;stroke:var(--wv-bg);stroke-width:1.2;opacity:.5}
.thb svg .fl{fill:var(--salad);stroke:none;opacity:1}
.ln-art path{fill:none;stroke:var(--wv-bg);stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.ln-art .fl{fill:var(--salad);stroke:var(--wv-bg)}
.ln-art .mt{fill:var(--mint);stroke:var(--wv-bg)}
.ln-art .dsh{stroke-dasharray:4 4;opacity:.5}
/* разметка плана: рисуется линией при показе */
.ln-art .draw{stroke-dasharray:var(--l,1200);stroke-dashoffset:var(--l,1200);transition:stroke-dashoffset 1.8s cubic-bezier(.4,0,.2,1)}
.show .ln-art .draw{stroke-dashoffset:0}
.gantt{display:flex;flex-direction:column;gap:9px}
.gantt div{display:grid;grid-template-columns:92px 1fr 34px;gap:10px;align-items:center;font-size:11px;color:var(--steel)}
.gantt p{margin:0;position:relative;height:10px;border-radius:5px;background:#EDEFF1}
.gantt p i{position:absolute;top:0;bottom:0;left:var(--a);width:0;border-radius:5px;background:var(--wv-bg);transition:width 1s cubic-bezier(.2,.7,.2,1) .6s}
.show .gantt p i{width:var(--w)}
.gantt p i.m{background:var(--mint)}.gantt p i.s{background:var(--steel)}
.gantt em{font-style:normal;font:400 10px var(--f-mono);color:var(--wv-bg)}
.av{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:7px;background:var(--wv-bg);color:var(--mint);font:600 9px var(--f-text)}
.pin{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:7px;background:var(--wv-bg);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 4px rgba(121,239,179,.25)}
.pin span{font:600 11px var(--f-text);color:var(--mint)}
.pin.m{background:var(--mint)}.pin.m span{color:var(--wv-bg)}
.lst{display:flex;flex-direction:column;gap:8px}
.lst>div{display:grid;grid-template-columns:1fr 90px 92px;gap:14px;align-items:center;padding:11px 14px;border-radius:12px;background:#fff;box-shadow:0 0 0 1px rgba(25,65,56,.07)}
.lst b{font:600 13px var(--f-text)}.lst .mono{font-size:10px;color:var(--steel)}
.lst .pbar{margin:0}

/* ============ ЭКРАН 4 — шесть сценариев (графит) ============ */
.wv4{background:var(--graphite);color:var(--sand);padding:var(--sp-t) 0 var(--sp)}
.sc-grid{display:grid;grid-template-columns:minmax(320px,5fr) 7fr;gap:clamp(32px,4vw,80px);margin:56px var(--pad) 0;align-items:stretch}
.sc-side{display:flex;flex-direction:column}
.sc-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.sc-tab{position:relative;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:9px;height:44px;padding:0 8px;border:1px solid var(--line-d);border-radius:10px;background:transparent;
  color:var(--grey);font:600 11px/1 var(--f-text);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;cursor:pointer;overflow:hidden;transition:border-color .4s,color .4s,background .4s}
.sc-tab svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.sc-tab:hover{color:var(--sand);border-color:rgba(230,227,224,.35)}
.sc-tab.on{color:var(--sand);border-color:var(--mint);background:rgba(121,239,179,.06)}
.sc-tab.on svg{stroke:var(--mint)}
.sc-tab::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:1px;background:var(--mint);transform:scaleX(var(--p,0));transform-origin:left}
.sc-copy{margin-top:44px;flex:1}
.sc-copy>*{transition:opacity .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
.sc-copy.out>*{opacity:0;transform:translateY(6px)}
.sc-num{margin:0 0 14px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--mint)}
.sc-title{margin:0 0 16px;font:700 clamp(22px,1.9vw,30px)/1.2 var(--f-text)}
.sc-text{margin:0 0 24px;font:400 clamp(12px,.85vw,14px)/1.7 var(--f-mono);letter-spacing:.01em;color:var(--grey);max-width:50ch}
.sc-flow{margin:0;font-size:12.5px;line-height:1.7;color:var(--grey)}
.sc-flow b{font-weight:400;color:var(--grey);transition:color .4s}
.sc-flow b.on{color:var(--mint)}
.sc-flow i{font-style:normal;color:var(--steel);margin:0 6px}
.sc-nav{display:flex;align-items:center;gap:10px;margin-top:32px;padding-top:20px;border-top:1px solid var(--line-d)}
.sc-count{font-size:12px;letter-spacing:.1em;color:var(--grey);margin-right:auto}
.sc-arr{width:44px;height:36px;border-radius:10px;border:1px solid rgba(230,227,224,.3);background:transparent;color:var(--sand);font-size:16px;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.sc-arr[data-d="1"]{background:var(--mint);border-color:var(--mint);color:var(--graphite)}
.sc-arr:hover{border-color:var(--mint)}
/* сцена сценария: чертёжное поле на графите */
.sc-stage{position:relative;width:100%;max-width:650px;aspect-ratio:16 / 10;max-height:410px;justify-self:end;align-self:center;border-radius:14px;border:1px solid var(--line-d);overflow:hidden;background-color:var(--graphite-2);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cpath d='M0 .5H100M.5 0V100' stroke='%23E6E3E0' stroke-opacity='.08' stroke-width='1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath d='M0 .5H20M.5 0V20' stroke='%23E6E3E0' stroke-opacity='.05' stroke-width='.8' stroke-dasharray='2 2'/%3E%3C/svg%3E")}
.sc-v{position:absolute;inset:0;opacity:0;transition:opacity .45s}
.sc-v.show{opacity:1}
.sc-v .stp{opacity:0;transform:translateY(12px);transition:opacity .55s,transform .65s cubic-bezier(.2,.7,.2,1)}
.sc-v[data-k] .stp.on{opacity:1;transform:none}
.sc-v .ai-bridge.stp{transform:translate(-50%,12px)}.sc-v .ai-bridge.stp.on{transform:translateX(-50%)}
.sc-v .card{box-shadow:0 30px 60px -26px rgba(0,0,0,.7),0 0 0 1px rgba(25,65,56,.08)}
.sc-cap{position:absolute;left:20px;top:16px;font:400 10.5px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grey)}
.sc-cap b{font-weight:400;color:var(--mint)}
.dk-art path{fill:none;stroke:rgba(230,227,224,.55);stroke-width:1.3;stroke-linejoin:round}
.dk-art .room{fill:rgba(230,227,224,.03);stroke:rgba(230,227,224,.55);transition:fill .6s,stroke .6s}
.dk-art .room.on{fill:rgba(121,239,179,.22);stroke:var(--mint)}
.dk-art .dsh{stroke-dasharray:3 4;stroke:rgba(230,227,224,.3)}
.dk-art text{font:400 10px var(--f-mono);fill:var(--grey);letter-spacing:.06em}
/* чат перевода */
.chat{position:absolute;top:56px;height:62%;width:42%;border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:10px;overflow:hidden}
.chat.l{left:5%;background:#F3F4F6}.chat.r{right:5%;background:#1B1819;box-shadow:0 0 0 1px var(--line-d)}
.chat-h{display:flex;align-items:center;gap:8px;padding-bottom:10px;border-bottom:1px solid rgba(97,108,113,.25);font:600 12px var(--f-text)}
.chat.l .chat-h{color:var(--graphite)}.chat.r .chat-h{color:var(--sand)}
.chat-h .mono{margin-left:auto;font-size:9.5px;color:var(--steel)}
.msg{max-width:88%;padding:9px 12px;border-radius:12px;font-size:12.5px;line-height:1.45}
.msg small{display:block;margin-bottom:3px;font:400 9px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.chat.l .msg{background:#fff;color:var(--graphite);box-shadow:0 0 0 1px rgba(25,65,56,.08)}
.chat.l .msg.me{align-self:flex-end;background:var(--wv-bg);color:var(--sand)}
.chat.r .msg{background:#2B2829;color:var(--sand)}
.chat.r .msg.me{align-self:flex-end;background:var(--mint);color:var(--graphite)}
.ai-bridge{position:absolute;left:50%;bottom:12%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;z-index:2}
.ai-bridge .chip{padding:7px 10px;border-radius:9px;background:var(--wv-bg);border:1px solid var(--mint);color:var(--mint);font:400 10px var(--f-mono);letter-spacing:.08em;white-space:nowrap}
.ai-bridge .flow{width:90px;height:2px;background:repeating-linear-gradient(90deg,var(--mint) 0 6px,transparent 6px 11px);background-size:22px 2px;animation:flow 1s linear infinite}
@keyframes flow{to{background-position:22px 0}}
/* видоискатель */
.vf{position:absolute;border-radius:16px;overflow:hidden;background:#2E3532}
.vf .cor{position:absolute;width:18px;height:18px;border:1.5px solid var(--mint)}
.vf .cor:nth-of-type(1){left:12px;top:12px;border-width:1.5px 0 0 1.5px}.vf .cor:nth-of-type(2){right:12px;top:12px;border-width:1.5px 1.5px 0 0}
.vf .cor:nth-of-type(3){left:12px;bottom:12px;border-width:0 0 1.5px 1.5px}.vf .cor:nth-of-type(4){right:12px;bottom:12px;border-width:0 1.5px 1.5px 0}
.vf .flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.vf .flash.go{animation:flash .6s ease-out}
@keyframes flash{0%{opacity:.8}100%{opacity:0}}
.vf svg{position:absolute;inset:0;width:100%;height:100%}
.vf svg path{fill:none;stroke:rgba(230,227,224,.45);stroke-width:1.2}
.vf svg .fl{fill:rgba(121,239,179,.18);stroke:none}
.vf .rec{position:absolute;left:14px;top:12px;font:400 9.5px var(--f-mono);letter-spacing:.08em;color:var(--sand)}
.vf .mk{position:absolute;border:1.5px solid var(--mint);border-radius:4px;opacity:0;transition:opacity .4s}
.vf .mk span{position:absolute;left:-1.5px;top:-17px;padding:1px 5px;background:var(--mint);color:var(--wv-bg);font:400 9px var(--f-mono);white-space:nowrap;border-radius:3px}
.vf .mk.on{opacity:1}
.stamp{position:absolute;padding:8px 14px;border:2px solid var(--mint);border-radius:8px;color:var(--mint);font:700 15px var(--f-head);letter-spacing:.06em;text-transform:uppercase;
  transform:rotate(-6deg) scale(1.2);opacity:0;transition:opacity .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
.stamp.on{opacity:1;transform:rotate(-6deg) scale(1)}
.ck{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:7px}
.ck li{display:flex;gap:9px;align-items:center;font-size:12px}
.ck li i{position:relative;width:13px;height:13px;flex:none;border:1.2px solid var(--wv-bg);border-radius:3px;transition:background .3s}
.ck li.is-ok i{background:var(--mint)}
.ck li.is-ok i::after{content:"";position:absolute;left:3.5px;top:.5px;width:3px;height:7px;border:solid var(--wv-bg);border-width:0 1.4px 1.4px 0;transform:rotate(45deg)}
.kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}
.kpi div{padding:10px 6px;border-radius:10px;background:#EEF0F2}
.kpi b{display:block;font:700 22px/1.1 var(--f-text)}.kpi span{font-size:10px;color:var(--steel)}
.bars{display:flex;align-items:flex-end;gap:7px;height:96px;padding:0 2px;border-bottom:1px solid #D2D6DA}
.bars i{flex:1;height:0;border-radius:4px 4px 0 0;background:var(--wv-bg);transition:height .9s cubic-bezier(.2,.7,.2,1)}
.bars i.m{background:var(--mint)}
.on .bars i,.bars.on i{height:var(--h)}
.mini{width:170px;transition:left .9s cubic-bezier(.6,0,.2,1),top .9s cubic-bezier(.6,0,.2,1),opacity .5s,transform .9s cubic-bezier(.6,0,.2,1)!important}

/* ============ ЭКРАН 5 — как это работает (светлый, закреплён при прокрутке) ============ */
.wv5{position:relative}
.wv5-pin{height:auto}
.wv5-in{position:relative;display:grid;grid-template-columns:minmax(320px,5fr) 7fr;gap:clamp(32px,5vw,96px);align-items:center;padding:var(--sp-t) var(--pad) var(--sp)}
.hw-steps{list-style:none;margin:40px 0 0;padding:0;position:relative}
.hw-steps::before{content:"";position:absolute;left:13px;top:14px;bottom:14px;width:1px;background:rgba(25,65,56,.18)}
.hw-steps::after{content:"";position:absolute;left:13px;top:14px;width:1px;height:calc((100% - 28px) * var(--k,0));background:var(--wv-bg);transition:height .5s}
.hw-steps li{position:relative;display:grid;grid-template-columns:28px 1fr;column-gap:18px;padding:10px 0;color:#8A9196;cursor:pointer;outline:none;transition:color .4s}
.hw-steps li:hover b,.hw-steps li:focus-visible b{color:var(--graphite)}
.hw-steps li:focus-visible span{box-shadow:0 0 0 2px var(--mint)}
.hw-steps li span{grid-row:span 2;position:relative;z-index:1;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:var(--wv-ice);
  box-shadow:inset 0 0 0 1px rgba(25,65,56,.25);font-size:11px;transition:background .4s,color .4s,box-shadow .4s}
.hw-steps b{font:600 clamp(14px,1.1vw,16px)/1.3 var(--f-text);padding-top:4px}
.hw-steps p{margin:6px 0 0;font:400 clamp(12px,.85vw,14px)/1.7 var(--f-mono);letter-spacing:.01em;max-height:0;overflow:hidden;opacity:0;transition:max-height .5s,opacity .5s}
.hw-steps li.done{color:var(--graphite)}
.hw-steps li.done span{background:var(--wv-bg);color:var(--mint);box-shadow:none}
.hw-steps li.on{color:var(--graphite)}
.hw-steps li.on span{background:var(--mint);color:var(--wv-bg);box-shadow:0 0 0 1px var(--wv-bg)}
.hw-steps li.on p{max-height:80px;opacity:1;color:var(--wv-bg)}
.wv5-left{min-height:500px}
@media (max-width:1100px){.wv5-left{min-height:0}}
.hw-hint{margin:22px 0 0 46px;font-size:11.5px;letter-spacing:.06em;color:var(--steel);transition:opacity .5s}
.hw-hint.off{opacity:0}
.crm{display:flex;flex-direction:column;gap:9px;padding:14px;max-width:650px;margin-left:auto;border-radius:14px;background:#F6F7F8;box-shadow:0 0 0 1px rgba(25,65,56,.1),0 40px 80px -40px rgba(25,65,56,.45)}
.crm-top{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 6px}
.crm-brand{display:flex;align-items:center;gap:8px;font:700 11.5px var(--f-head);letter-spacing:.03em}
.crm-brand .sg{width:16px;height:16px;fill:var(--wv-bg)}
.crm-chip{padding:4px 9px;border-radius:7px;background:#E1E4E8;font-size:10px;letter-spacing:.06em;color:var(--steel)}
.cp{border-radius:10px;background:#fff;box-shadow:0 0 0 1px rgba(25,65,56,.07);padding:11px 13px;
  opacity:.28;filter:grayscale(1);transition:opacity .6s,filter .6s,box-shadow .6s,transform .6s cubic-bezier(.2,.7,.2,1)}
.cp.on{opacity:1;filter:none}
.cp.cur{box-shadow:0 0 0 1.5px var(--mint),0 18px 40px -24px rgba(25,65,56,.6);transform:translateX(-4px)}
.crm-oh{display:flex;justify-content:space-between}
.crm-oh b{display:block;font:700 15px var(--f-text)}.crm-oh .mono{font-size:10.5px;color:var(--steel)}
.crm-dots{font-style:normal;color:var(--steel)}
.crm-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}
.crm-tags span{padding:3px 8px;border-radius:6px;background:#EEF0F2;font-size:10px;color:#3E4447}
.crm-sum{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px;background:transparent;box-shadow:none}
.crm-sum div{padding:9px 6px;border-radius:12px;background:#fff;text-align:center;box-shadow:0 0 0 1px rgba(25,65,56,.07)}
.crm-sum b{display:block;font:700 19px/1.1 var(--f-text)}.crm-sum span{font-size:10px;color:var(--steel)}
.crm-sum.cur{box-shadow:0 0 0 1.5px var(--mint)}
.crm-th{display:flex;justify-content:space-between;align-items:center;gap:10px}
.crm-th b{font:600 13px var(--f-text)}
.crm-st{padding:3px 8px;border-radius:6px;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;background:#E1E4E8;color:var(--steel);transition:background .4s,color .4s}
.crm-st.go{background:var(--wv-bg);color:var(--mint)}.crm-st.is-ok{background:var(--mint);color:var(--wv-bg)}.crm-st.chk{background:var(--salad);color:var(--wv-bg)}
.crm-task p{margin:6px 0 10px;font-size:10.5px;color:var(--steel)}
.crm-bar{height:6px;border-radius:3px;background:#E1E4E8;overflow:hidden}
.crm-bar i{display:block;height:100%;width:var(--w,8%);background:var(--wv-bg);border-radius:3px;transition:width .8s cubic-bezier(.2,.7,.2,1)}
.crm-tr{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:4px;align-items:center}
.crm-tr .mono{grid-row:span 2;padding:5px 8px;border-radius:7px;background:var(--wv-bg);color:var(--mint);font-size:10px}
.crm-tr p{margin:0;font-size:11.5px}.crm-tr p.th{color:var(--wv-bg);font-weight:600}
.crm-ph{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center}
.crm-ph>.mono{font-size:10.5px;color:var(--steel)}
.crm-thumbs{display:flex;gap:6px}
.crm-thumbs i{width:38px;height:28px;border-radius:7px;background:#CDD2D7 linear-gradient(160deg,transparent 55%,var(--salad) 55% 75%,transparent 75%)}
.crm-rem{padding:4px 8px;border-radius:6px;background:var(--salad);color:var(--wv-bg);font-size:9.5px}
.crm-note{margin:12px 4px 0;text-align:right;font-size:10.5px;color:var(--steel)}

/* ============ ЭКРАН 6 — подключить WorkVision (зелёный) ============ */
.wv6{background:var(--wv-bg);color:var(--sand);padding:var(--sp-t) var(--pad) var(--sp);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cpath d='M0 .5H100M.5 0V100' stroke='%23E6E3E0' stroke-opacity='.06' stroke-width='1'/%3E%3C/svg%3E");background-position:-1px -1px}
.wv6-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,120px);align-items:start}
.wv6-lead{margin:26px 0 36px;font:400 clamp(12px,.85vw,14px)/1.7 var(--f-mono);letter-spacing:.01em;color:var(--grey);max-width:48ch}
.wv6-btn{min-width:320px;justify-content:space-between}
.wv6 .btn-fill{background:var(--mint);border-color:var(--mint);color:var(--graphite)}
.wv6 .btn-fill:hover{background:#96F7C6}
.wv6-r{padding-top:6px}
.wv6-h{margin:0 0 18px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mint)}
.wv6-q{list-style:none;margin:0;padding:0;border-top:1px solid var(--wv-line)}
.wv6-q li{display:flex;align-items:center;gap:16px;padding:18px 0;border-bottom:1px solid var(--wv-line);font:500 16px/1.4 var(--f-text)}
.wv6-q svg{width:22px;height:22px;flex:none;fill:none;stroke:var(--mint);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.wv6-form{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px;padding:22px;border-radius:18px;background:rgba(230,227,224,.05);box-shadow:inset 0 0 0 1px var(--wv-line)}
.wv6-form[hidden]{display:none}
.wv6-form label{display:flex;flex-direction:column;gap:8px}
.wv6-form label.wide{grid-column:1 / -1}
.wv6-form .mono{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey)}
.wv6-form input,.wv6-form textarea{font:500 15px var(--f-text);color:var(--sand);background:transparent;border:0;border-bottom:1px solid rgba(230,227,224,.3);padding:8px 0;outline:none;resize:vertical}
.wv6-form input:focus,.wv6-form textarea:focus{border-bottom-color:var(--mint)}
.wv6-form textarea::placeholder{color:rgba(177,180,188,.55)}
.wv6-form .btn{grid-column:1 / -1;justify-content:space-between}
.wv6-ok{grid-column:1 / -1;margin:0;font-size:13px;color:var(--mint)}
.wv6-form.open{animation:formIn .5s cubic-bezier(.2,.7,.2,1)}
@keyframes formIn{from{opacity:0;transform:translateY(10px)}}

/* подвал: текущий сайт в списке системы — мятным */
.s5-cur{color:var(--mint)!important}
.s5-soon{display:flex;align-items:center;gap:10px;font:500 15px var(--f-text);color:var(--steel)}
.s5-soon em{font-style:normal;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--steel)}
.s5{padding-top:56px}

/* ---------- адаптив экранов 3–6 ---------- */
@media (max-width:1100px){
  .rt-body,.sc-grid,.wv6-grid{grid-template-columns:1fr}
  .wv5-pin{height:auto}
  .wv5-in{position:relative;height:auto;min-height:0;grid-template-columns:1fr}
  .sc-stage{justify-self:stretch;max-width:none}
}
@media (max-width:720px){
  :root{--sp:40px}
  .wv-kick{font-size:12px}
  .rt-tabs{grid-template-columns:repeat(5,max-content);overflow-x:auto;margin-top:32px;scrollbar-width:none}
  .rt{font-size:10px;padding:0 10px;letter-spacing:.1em}
  .rt-body{margin-top:32px}
  /* мобильная: интерфейсы роли и сценария — вертикальной стопкой, без наложений */
  .rt-art{aspect-ratio:auto;height:auto;max-height:none}
  .ra{position:relative;inset:auto;display:flex;flex-direction:column;gap:10px;padding:0 14px 16px}
  .ra>*{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:auto!important}
  .ra>.ra-bar{margin:0 -14px 4px;height:44px}
  .ra>.ln-art{width:100%!important;height:auto}
  .ra>.pin{display:none}
  .ra>.q[style*="border-radius:34px"]{width:72%!important;height:400px;align-self:center}
  .lst{position:relative!important}
  .lst>div{grid-template-columns:1fr 64px;row-gap:6px}.lst>div .pill{grid-column:1 / -1;justify-self:start}
  .sc-stage{height:auto!important;min-height:0;aspect-ratio:auto;max-height:none;padding:14px}
  .sc-v{position:relative;inset:auto;display:flex;flex-direction:column;gap:10px}
  .sc-v:not(.show){display:none}
  .sc-v>*{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:auto!important;height:auto!important}
  .sc-v>.dk-art{width:100%!important}
  .sc-v>.vf{aspect-ratio:16 / 10}
  .sc-v>.pin,.sc-v>.mini,.sc-v[data-k="4"]>.vf:not(.cam0){display:none}
  .sc-v>.chat{gap:8px}
  .sc-v>.ai-bridge{transform:none!important;align-self:center;order:1}
  .sc-v>.chat.r{order:2}
  .sc-v>.stamp{align-self:flex-start;margin:4px 0 0 6px}
  .sc-v>.sc-cap{font-size:9.5px}
  .msg{font-size:12px}
  .sc-tabs{grid-template-columns:repeat(3,1fr)}
  .sc-tab{font-size:9.5px;letter-spacing:.08em;gap:6px;padding:0 4px}.sc-tab svg{width:14px;height:14px}
  .sc-stage{aspect-ratio:auto;max-height:none;height:440px}
  .crm-ph{grid-template-columns:1fr}
  .wv6-btn{min-width:0;width:100%}
  .wv6-form{grid-template-columns:1fr}
  .s5-grid{grid-template-columns:1fr}
  .s5-col+.s5-col{padding-left:0;border-left:0}
}
@media (prefers-reduced-motion:reduce){ .rv{opacity:1;transform:none} }
