/* Scipen – общий слой лендинга: токены «Операционной», шрифты, кнопки, знак, форма листа ожидания,
   сцена «рабочий стол». Варианты A/B/C подключают этот файл и добавляют только свою композицию. */

:root{
  /* поверхности – от дальней к ближней (как в apps/web/app/globals.css) */
  --ground:#ECF1EF; --frame:#E3EAE7; --seg:#D9E3DF; --panel:#F6F9F8; --sheet:#FFFFFF; --veil:#E4EEEA;
  --ink:#1B2523; --tx2:#4F5E58; --tx3:#5E6E68; --line:#D3DCD8; --line2:#E3EAE7;
  --mint:#CFE7DF; --mint2:#C1DFD5; --onmint:#1D4B40; --focus:#3F8574; --select:#D5EBE3; --row:#E7F2EE;
  /* состояния проверки: всегда цвет + глиф + подпись */
  --ok:#2D7250; --pa:#86641C; --ba:#A43B31; --un:#56655F;
  --ok-t:#E3F0E9; --pa-t:#F4ECDB; --ba-t:#F6E5E2; --ins:#DDEFE6; --ins-tx:#1F5A3E; --del-tx:#8E2F27;
  /* поле «хирургическая простыня» – единственный насыщенный цвет страницы */
  --drape:#1D4B40; --drape-2:#173F35; --drape-3:#245A4D; --on-drape:#EEF6F2; --on-drape-2:#BCD8CD;
  --knot-ink:#1B2523; --knot-green:#2D7250; --knot-grey:#A3B1AC;
  --sh-sheet:0 1px 2px rgba(27,37,35,.05),0 20px 56px rgba(27,37,35,.10);
  --sh-pop:0 2px 6px rgba(27,37,35,.08),0 18px 44px rgba(27,37,35,.16);
  --sh-win:0 1px 2px rgba(27,37,35,.08),0 24px 70px rgba(18,40,34,.28);
  --f-ui:"Golos Text",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-text:"Literata","Source Serif 4",Georgia,"Times New Roman",serif;
  --gut:max(clamp(16px,3.4vw,48px),env(safe-area-inset-left,0px));
  --gut-r:max(clamp(16px,3.4vw,48px),env(safe-area-inset-right,0px));
  --ease:cubic-bezier(.16,1,.3,1); --ease-io:cubic-bezier(.65,0,.35,1);
  --r:6px; --r-win:12px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --ground:#171D1B; --frame:#1D2422; --seg:#28312E; --panel:#1F2725; --sheet:#242D2A; --veil:#1B2220;
  --ink:#E7ECE9; --tx2:#AAB7B2; --tx3:#9EACA6; --line:#34413C; --line2:#2B3532;
  --mint:#2C4A40; --mint2:#35594D; --onmint:#CFECE0; --focus:#8FD0AE; --select:#2E4A40; --row:#26352F;
  --ok:#8FD0AE; --pa:#D6B466; --ba:#E8897E; --un:#A7B4AF;
  --ok-t:#213629; --pa-t:#3A3221; --ba-t:#3D2623; --ins:#234031; --ins-tx:#B5E8CC; --del-tx:#F2B6AD;
  --drape:#12302A; --drape-2:#0E2621; --drape-3:#1A3E35; --on-drape:#E7F2EE; --on-drape-2:#A9CABE;
  --knot-ink:#E7ECE9; --knot-green:#8FD0AE; --knot-grey:#5E6B66;
  --sh-sheet:0 1px 2px rgba(0,0,0,.3),0 20px 56px rgba(0,0,0,.35);
  --sh-pop:0 2px 6px rgba(0,0,0,.3),0 18px 44px rgba(0,0,0,.45);
  --sh-win:0 1px 2px rgba(0,0,0,.4),0 24px 70px rgba(0,0,0,.55);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --ground:#171D1B; --frame:#1D2422; --seg:#28312E; --panel:#1F2725; --sheet:#242D2A; --veil:#1B2220;
  --ink:#E7ECE9; --tx2:#AAB7B2; --tx3:#9EACA6; --line:#34413C; --line2:#2B3532;
  --mint:#2C4A40; --mint2:#35594D; --onmint:#CFECE0; --focus:#8FD0AE; --select:#2E4A40; --row:#26352F;
  --ok:#8FD0AE; --pa:#D6B466; --ba:#E8897E; --un:#A7B4AF;
  --ok-t:#213629; --pa-t:#3A3221; --ba-t:#3D2623; --ins:#234031; --ins-tx:#B5E8CC; --del-tx:#F2B6AD;
  --drape:#12302A; --drape-2:#0E2621; --drape-3:#1A3E35; --on-drape:#E7F2EE; --on-drape-2:#A9CABE;
  --knot-ink:#E7ECE9; --knot-green:#8FD0AE; --knot-grey:#5E6B66;
  --sh-sheet:0 1px 2px rgba(0,0,0,.3),0 20px 56px rgba(0,0,0,.35);
  --sh-pop:0 2px 6px rgba(0,0,0,.3),0 18px 44px rgba(0,0,0,.45);
  --sh-win:0 1px 2px rgba(0,0,0,.4),0 24px 70px rgba(0,0,0,.55);
  color-scheme:dark}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{margin:0;background:var(--ground);color:var(--ink);font:400 17px/1.55 var(--f-ui);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,video{max-width:100%}
[hidden]{display:none!important}
::selection{background:var(--mint2);color:var(--ink)}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:4px}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.025em;text-wrap:balance}
p{margin:0;text-wrap:pretty}
.num{font-variant-numeric:tabular-nums}
.wrap{max-width:1400px;margin-inline:auto;padding-left:var(--gut);padding-right:var(--gut-r)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html{scrollbar-color:var(--seg) transparent}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--seg);border-radius:10px;border:2px solid var(--ground)}

/* ── глифы состояний ── */
.g{width:12px;height:12px;flex:none;display:inline-block;vertical-align:-1px}
.s-ok{color:var(--ok)}.s-pa{color:var(--pa)}.s-ba{color:var(--ba)}.s-un{color:var(--un)}

/* ── знак ── */
.knot{display:inline-flex;line-height:0}
.knot svg{width:100%;height:100%}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:600 21px/1 var(--f-ui);letter-spacing:-.03em}
.brand .knot{width:30px;height:30px}
.brand .dot-i{position:relative}

/* ── кнопки: одна форма на весь сайт ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:var(--r);border:0;cursor:pointer;
  font:600 16px/1 var(--f-ui);text-decoration:none;white-space:nowrap;
  transition:background-color .18s,color .18s,transform .25s var(--ease),box-shadow .18s}
.btn:active{transform:translateY(1px) scale(.985)}
.btn svg{width:18px;height:18px;flex:none}
.btn-main{background:var(--drape);color:#fff}
.btn-main:hover{background:var(--drape-3)}
:root[data-theme="dark"] .btn-main{background:var(--focus);color:#0E1F1A}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .btn-main{background:var(--focus);color:#0E1F1A}}
.btn-main:hover svg{transform:translateX(3px)}
.btn-main svg{transition:transform .3s var(--ease)}
.btn-light{background:var(--on-drape);color:var(--drape-2)}
.btn-light:hover{background:#fff}
.btn-ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 1.5px currentColor}
.btn-ghost:hover{background:color-mix(in srgb,currentColor 8%,transparent)}
.btn[disabled],.btn[aria-busy="true"]{opacity:.7;cursor:progress}
.link{font-weight:500;text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent)}
.link:hover{text-decoration-color:currentColor}

/* ── шапка ── */
.top{position:sticky;top:0;z-index:40;background:var(--ground);transition:box-shadow .3s}
.top.scrolled{box-shadow:0 1px 0 var(--line2)}
.top .wrap{display:flex;align-items:center;gap:28px;min-height:68px}
.top nav{display:flex;gap:26px;margin-left:auto}
.top nav a{font-size:15px;font-weight:500;color:var(--tx2);text-decoration:none;transition:color .15s}
.top nav a:hover{color:var(--ink)}
.top .btn{min-height:44px;font-size:15px;padding:0 16px}
@media (max-width:900px){.top nav{display:none}.top .btn{margin-left:auto}}
@media (max-width:400px){.top .btn{padding:0 12px;font-size:14px}}

/* ── форма листа ожидания ── */
.wl{display:grid;gap:14px;max-width:560px}
.wl-row{display:flex;gap:10px;flex-wrap:wrap}
.wl input[type=email],.wl select{min-height:52px;border-radius:var(--r);border:0;padding:0 16px;background:var(--sheet);color:var(--ink);
  box-shadow:inset 0 0 0 1.5px var(--line);font-size:16px;transition:box-shadow .15s}
.wl input[type=email]{flex:1 1 240px;min-width:0}
.wl input::placeholder{color:var(--tx3)}
.wl input:focus,.wl select:focus{outline:none;box-shadow:inset 0 0 0 2px var(--focus)}
.wl input[aria-invalid="true"]{box-shadow:inset 0 0 0 2px var(--ba)}
.wl select{flex:1 1 200px;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2356655F' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.wl .btn{min-height:52px}
.wl-roles{display:flex;flex-wrap:wrap;gap:8px;border:0;margin:0;padding:0}
.wl-roles legend{font-size:14px;color:var(--tx2);margin-bottom:8px;padding:0}
.wl-roles label{position:relative;cursor:pointer}
.wl-roles input{position:absolute;opacity:0;inset:0}
.wl-roles span{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;background:var(--frame);font-size:14.5px;font-weight:500;transition:background-color .15s,color .15s}
.wl-roles input:checked+span{background:var(--drape);color:#fff}
.wl-roles input:focus-visible+span{outline:2px solid var(--focus);outline-offset:2px}
.wl-roles label:hover span{background:var(--seg)}
.wl-roles input:checked+span:hover{background:var(--drape-3)}
.wl-note{font-size:13.5px;line-height:1.5;color:var(--tx2)}
.wl-note a{color:inherit}
.wl-err{font-size:14px;color:var(--ba);font-weight:500}
.wl-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.wl-done{display:grid;gap:8px;max-width:560px}
.wl-done b{font-size:20px;letter-spacing:-.02em}
.wl-done p{color:var(--tx2);font-size:15px}
.wl-done:focus{outline:none}
.wl-again{display:inline;padding:0;border:0;background:none;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.wl-again:hover{color:var(--ink)}
.on-drape .wl-again:hover{color:var(--on-drape)}
/* форма на зелёном поле */
.on-drape .wl input[type=email],.on-drape .wl select{background:var(--on-drape);color:#13241F;box-shadow:none}
.on-drape .wl input::placeholder{color:#4F5E58}
.on-drape .wl input:focus,.on-drape .wl select:focus{box-shadow:inset 0 0 0 2px #8FD0AE}
.on-drape .wl-roles span{background:rgba(255,255,255,.12);color:var(--on-drape)}
.on-drape .wl-roles label:hover span{background:rgba(255,255,255,.2)}
.on-drape .wl-roles input:checked+span{background:var(--on-drape);color:var(--drape-2)}
.on-drape .wl-roles legend,.on-drape .wl-note,.on-drape .wl-done p{color:var(--on-drape-2)}
.on-drape .wl-err{color:#FFB4A8}
.on-drape{--knot-ink:#EEF6F2;--knot-green:#8FD0AE;--knot-grey:#5E7A70}

/* ── появление: содержимое видно по умолчанию, скрипт прячет только то, что ниже экрана ── */
.rv{opacity:0;transform:translateY(24px)}
.rv.in{opacity:1;transform:none;transition:opacity .8s var(--ease),transform .9s var(--ease)}

/* ══════════ Рабочий стол ══════════ */
.desk{position:relative;width:100%;user-select:none;-webkit-user-select:none}
.desk-stage{position:absolute;left:0;top:0;width:1200px;height:740px;transform-origin:0 0;overflow:hidden;border-radius:14px;
  background:#C9D9D2;font:400 13px/1.4 var(--f-ui);color:#1B2523;--k:1}
.desk-stage *{box-sizing:border-box}
/* обои: стол в тоне «Операционной», мягкий свет из окна */
.dk-wall{position:absolute;inset:0;background:#C9DAD2}
.desk[data-dark] .desk-stage{background:#1A2421}
.desk[data-dark] .dk-wall{background:#18211E}
.dk-bar{position:absolute;left:0;right:0;top:0;height:28px;display:flex;align-items:center;gap:18px;padding:0 14px;background:rgba(246,249,248,.72);font-size:12.5px;font-weight:500;color:#1B2523;z-index:5}
.dk-bar .knot{width:16px;height:16px}
.dk-bar b{font-weight:700}
.dk-bar .r{margin-left:auto;display:flex;gap:16px;color:#3B4844;font-variant-numeric:tabular-nums}
.dk-icons{position:absolute;right:22px;top:52px;display:grid;gap:18px;z-index:1}
.dk-file{width:92px;display:grid;justify-items:center;gap:6px;text-align:center;font-size:11.5px;line-height:1.25;color:#13241F;font-weight:500;border-radius:6px;padding:6px 4px;transition:background-color .2s,opacity .3s}
.dk-file.sel{background:rgba(29,75,64,.18)}
.dk-file i{display:block;width:46px;height:56px;border-radius:5px;background:#fff;position:relative;box-shadow:0 1px 2px rgba(0,0,0,.12),0 4px 10px rgba(18,40,34,.12)}
.dk-file i::before{content:"";position:absolute;right:0;top:0;width:14px;height:14px;background:linear-gradient(225deg,var(--k-bg,#C9D9D2) 50%,#E3EAE7 50%);border-bottom-left-radius:3px}
.dk-file i::after{content:attr(data-ext);position:absolute;left:5px;right:5px;bottom:7px;height:15px;border-radius:3px;background:var(--fc,#2A5D9F);color:#fff;font:700 8.5px/15px var(--f-ui);letter-spacing:.04em;text-align:center}
.dk-file.gone{opacity:.25}
.dk-ghost{position:absolute;left:0;top:0;z-index:30;pointer-events:none;opacity:0;transition:opacity .2s}
.dk-ghost.on{opacity:.9}

.dk-win{position:absolute;left:36px;top:46px;width:1000px;height:668px;border-radius:var(--r-win);background:#ECF1EF;box-shadow:var(--sh-win);overflow:hidden;display:grid;grid-template-rows:40px 1fr;z-index:2}
.dk-title{display:flex;align-items:center;gap:10px;padding:0 14px;background:#E3EAE7;font-size:12.5px;color:#3B4844;font-weight:500}
.dk-lights{display:flex;gap:7px;margin-right:6px}
.dk-lights i{width:12px;height:12px;border-radius:50%;background:#C9D6D1}
.dk-lights i:nth-child(1){background:#E8796D}.dk-lights i:nth-child(2){background:#E9B949}.dk-lights i:nth-child(3){background:#6CC07A}
.dk-title .knot{width:18px;height:18px}
.dk-title .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dk-title .t b{color:#1B2523;font-weight:600}
.dk-state{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;background:#D9E3DF;font-size:11.5px;font-weight:600;color:#3B4844;transition:background-color .4s,color .4s}
.dk-state.ok{background:#DDEFE6;color:#1F5A3E}
.dk-body{display:grid;grid-template-columns:184px minmax(0,1fr) 300px;min-height:0}
.dk-side{background:#E3EAE7;padding:14px 10px;display:grid;align-content:start;gap:2px}
.dk-side h6{margin:6px 8px 6px;font:600 11.5px/1 var(--f-ui);color:#56655F}
.dk-side a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;border-radius:6px;font-size:13px;font-weight:500;color:#2C3935;text-decoration:none}
.dk-side a.on{background:#fff;color:#1B2523}
.dk-side a small{font-size:11px;color:#56655F;font-variant-numeric:tabular-nums}
.dk-side .sep{height:12px}
.dk-main{position:relative;min-width:0;padding:16px 18px 0;display:grid;grid-template-rows:auto 1fr;gap:12px}
.dk-tools{display:flex;align-items:center;gap:8px}
.dk-btn{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 12px;border-radius:6px;background:#fff;box-shadow:inset 0 0 0 1px #D3DCD8;font-size:12.5px;font-weight:600;color:#1B2523;white-space:nowrap;transition:transform .12s,background-color .2s}
.dk-btn.pri{background:#1D4B40;color:#fff;box-shadow:none}
.dk-btn.press{transform:scale(.94)}
.dk-btn svg{width:13px;height:13px}
.dk-tally{margin-left:auto;display:flex;gap:12px;font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums}
.dk-tally span{display:inline-flex;align-items:center;gap:5px}
.dk-sheet{position:relative;background:#fff;border-radius:10px 10px 0 0;box-shadow:0 1px 2px rgba(27,37,35,.05),0 12px 30px rgba(27,37,35,.07);padding:30px 40px;overflow:hidden}
.dk-sheet h3{font:600 21px/1.25 var(--f-text);letter-spacing:-.01em;margin-bottom:12px}
.dk-sheet p{font:400 15px/1.72 var(--f-text);color:#1B2523;max-width:62ch}
.dk-sheet p+p{margin-top:10px}
.dk-sheet .dim{color:#56655F}
.dk-empty{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:10px;background:#fff;color:#56655F;font-size:13.5px;transition:opacity .5s}
.dk-empty .drop{width:300px;height:150px;border-radius:12px;box-shadow:inset 0 0 0 2px #C9D6D1;display:grid;place-items:center;text-align:center;padding:20px;transition:box-shadow .2s,background-color .2s}
.dk-empty.hot .drop{box-shadow:inset 0 0 0 2px #3F8574;background:#E7F2EE}
.dk-empty.off{opacity:0;pointer-events:none}
.ct{font:600 .8em/1 var(--f-ui);color:#56655F;padding:2px 4px;border-radius:4px;white-space:nowrap;transition:color .35s,background-color .35s,box-shadow .35s;cursor:default}
.ct .g{width:9px;height:9px;margin-left:3px;vertical-align:0;opacity:0;transition:opacity .35s}
.ct[data-s="ok"]{color:#2D7250;background:#E3F0E9}
.ct[data-s="pa"]{color:#86641C;background:#F4ECDB}
.ct[data-s="ba"]{color:#A43B31;background:#F6E5E2}
.ct[data-s]:not([data-s="un"]) .g{opacity:1}
.ct.focus{box-shadow:0 0 0 2px #A43B31}
.rw{transition:background-color .7s;border-radius:3px}
.rw.flash{background:#DDEFE6}
.rw.mark{background:#F6E5E2}
.dk-scan{position:absolute;height:3px;border-radius:2px;background:#3F8574;opacity:0;pointer-events:none;transition:left .45s var(--ease),top .45s var(--ease),width .45s var(--ease),opacity .25s}
.dk-panel{background:#F6F9F8;display:grid;grid-template-rows:auto 1fr;min-height:0;box-shadow:inset 1px 0 0 #E3EAE7}
.dk-tabs{display:flex;gap:2px;margin:12px 12px 0;padding:3px;border-radius:8px;background:#E3EAE7}
.dk-tabs span{flex:1;text-align:center;padding:6px 4px;border-radius:6px;font-size:12px;font-weight:600;color:#56655F;transition:background-color .2s,color .2s}
.dk-tabs span.on{background:#fff;color:#1B2523;box-shadow:0 1px 2px rgba(27,37,35,.1)}
.dk-pane{position:relative;padding:14px;overflow:hidden}
.dk-view{position:absolute;inset:14px;display:grid;align-content:start;gap:10px;opacity:0;transform:translateY(8px);transition:opacity .35s var(--ease),transform .45s var(--ease);pointer-events:none}
.dk-view.on{opacity:1;transform:none;pointer-events:auto}
.dk-card{background:#fff;border-radius:10px;padding:13px 14px;box-shadow:0 1px 2px rgba(27,37,35,.06)}
.dk-card h5{margin:0;display:flex;align-items:center;gap:7px;font:600 11.5px/1.3 var(--f-ui);color:#56655F}
.dk-card .dk-st{font:600 13.5px/1.35 var(--f-text);margin-top:8px}
.dk-card .dk-q{font:400 12.5px/1.6 var(--f-text);color:#3B4844;margin-top:8px}
.dk-card .dk-q mark{background:#E7F1EC;color:#1B2523;border-radius:2px;padding:0 2px;transition:background-color .4s}
.dk-card .dk-q mark.hot{background:#CFE7DF}
.dk-card .dk-vd{display:flex;gap:7px;align-items:flex-start;margin-top:10px;font-size:12px;font-weight:600;line-height:1.4}
.dk-card .dk-vd .g{margin-top:2px}
.dk-card .dk-df{font:400 12.5px/1.6 var(--f-text);margin-top:8px}
.dk-card del{color:#8E2F27;background:#F6E5E2;text-decoration-thickness:1px;padding:0 2px}
.dk-card ins{color:#1F5A3E;background:#DDEFE6;text-decoration:none;padding:0 2px}
.dk-card .dk-acts{display:flex;gap:6px;margin-top:10px}
.dk-card .dk-done{display:none;align-items:center;gap:6px;margin-top:10px;font-size:12px;font-weight:600;color:#2D7250}
.dk-card.applied .dk-acts{display:none}.dk-card.applied .dk-done{display:flex}
.dk-sv{display:inline-flex;width:18px;height:18px;border-radius:50%;background:#1D4B40;color:#fff;align-items:center;justify-content:center;flex:none}
.dk-sv svg{width:11px;height:11px}
.dk-run{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center;font-size:12px;padding:7px 2px}
.dk-run+.dk-run{box-shadow:0 -1px 0 #E3EAE7}
.dk-run small{color:#56655F;font-variant-numeric:tabular-nums}
.dk-bar2{height:6px;border-radius:3px;background:#E3EAE7;overflow:hidden}
.dk-bar2 i{display:block;height:100%;width:0;background:#3F8574;border-radius:3px;transition:width .9s var(--ease)}
.dk-spin{width:11px;height:11px;border-radius:50%;border:1.5px solid #C9D6D1;border-top-color:#3F8574;animation:dkspin .9s linear infinite}
@keyframes dkspin{to{transform:rotate(360deg)}}
.dk-health{display:grid;gap:11px}
.dk-h{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:12px}
.dk-h b{font-weight:600}
.dk-h small{color:#56655F;font-variant-numeric:tabular-nums}
.dk-seg{display:flex;gap:2px;height:9px}
.dk-seg i{display:block;height:100%;border-radius:2px;transition:flex-grow .8s var(--ease),background-color .5s}
.dk-seg .ok{background:#2D7250}.dk-seg .pa{background:#C9A24E}.dk-seg .ba{background:#A43B31}.dk-seg .un{background:#C9D6D1}
.dk-toast{position:absolute;left:50%;bottom:22px;transform:translate(-50%,16px);opacity:0;z-index:20;display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:10px;background:#1B2523;color:#EEF6F2;font-size:12.5px;font-weight:500;box-shadow:0 10px 30px rgba(0,0,0,.25);transition:opacity .3s,transform .4s var(--ease);white-space:nowrap}
.dk-toast.on{opacity:1;transform:translate(-50%,0)}
.dk-toast .g{color:#8FD0AE}
/* курсор */
.dk-cur{position:absolute;left:0;top:0;width:22px;height:22px;z-index:40;pointer-events:none;will-change:transform;transition:transform .9s var(--ease-io);filter:drop-shadow(0 2px 3px rgba(0,0,0,.25))}
.dk-cur svg{width:22px;height:22px;display:block}
.dk-cur::after{content:"";position:absolute;left:-11px;top:-11px;width:22px;height:22px;border-radius:50%;border:2px solid #3F8574;opacity:0;transform:scale(.4)}
.dk-cur.click::after{animation:dkclick .5s var(--ease)}
@keyframes dkclick{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(1.6)}}
.dk-cur.grab svg path{fill:#1B2523}
/* подпись под сценой */
.desk-cap{position:absolute;left:0;right:0;bottom:0;display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:14px;color:var(--tx2)}
.desk-cap .step{font-weight:600;color:var(--ink);min-height:1.5em;transition:opacity .3s}
.desk-ctl{margin-left:auto;display:flex;gap:6px}
.desk-ctl button{min-height:36px;padding:0 12px;border-radius:var(--r);border:0;background:var(--frame);font-size:13.5px;font-weight:600;cursor:pointer;color:var(--ink);display:inline-flex;align-items:center;gap:6px}
.desk-ctl button:hover{background:var(--seg)}
.desk-ctl svg{width:14px;height:14px}
.on-drape .desk-cap{color:var(--on-drape-2)}
.on-drape .desk-cap .step{color:var(--on-drape)}
.on-drape .desk-ctl button{background:rgba(255,255,255,.12);color:var(--on-drape)}
.on-drape .desk-ctl button:hover{background:rgba(255,255,255,.2)}

/* компактный стол (телефон): только окно, панель под листом */
.desk.compact .desk-stage{width:420px;height:960px}
.desk.compact .dk-icons{right:auto;left:12px;top:40px;grid-auto-flow:column;gap:6px}
.desk.compact .dk-file{width:84px}
.desk.compact .dk-win{left:8px;right:8px;width:auto;top:150px;height:800px}
.desk.compact .dk-body{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) 262px}
.desk.compact .dk-side{display:flex;overflow:hidden;padding:8px;gap:4px}
.desk.compact .dk-side h6,.desk.compact .dk-side .sep,.desk.compact .dk-side a:nth-of-type(n+5){display:none}
.desk.compact .dk-side a{padding:6px 9px;font-size:12px;white-space:nowrap}
.desk.compact .dk-side a small{display:none}
.desk.compact .dk-main{padding:10px 10px 0}
.desk.compact .dk-sheet{padding:18px 18px}
.desk.compact .dk-sheet p{font-size:14px;line-height:1.62}
.desk.compact .dk-sheet h3{font-size:18px;margin-bottom:8px}
.desk.compact .dk-title .t span{display:none}
.desk.compact .dk-sheet p.dim{display:none}
.desk.compact .dk-tally{display:none}
.desk.compact .dk-bar .r span:not(:last-child){display:none}
.desk.compact .dk-title .dk-state{display:none}

/* ── узел-лента (ribbon.js) ── */
.ribbon{display:block;width:100%;height:100%;overflow:visible}
.ribbon .rb-ink{stroke:var(--knot-ink)}
.ribbon .rb-ghost path{stroke:var(--ribbon-ghost,color-mix(in srgb,var(--ink) 9%,var(--ground)))}
.ribbon .rb-text{fill:var(--ribbon-text,var(--ground));font:500 1.62px/1 var(--f-ui);letter-spacing:.015em;text-rendering:geometricPrecision;font-kerning:none}
.ribbon .rb-words{transition:opacity .26s}
.ribbon.rb-swap .rb-words{opacity:0!important}
.ribbon .rb-node{fill:var(--knot-grey);transform-box:fill-box;transform-origin:center;transform:scale(0);transition:transform .5s cubic-bezier(.3,1.5,.5,1),fill .35s}
.ribbon .rb-node.on{transform:scale(1)}
.ribbon .rb-node.ok{transform:scale(1);fill:var(--knot-green);animation:rbpulse .6s cubic-bezier(.3,0,.3,1)}
@keyframes rbpulse{45%{transform:scale(1.24)}}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}