:root{--bg:#0a0f18;--panel:#101826;--panel2:#0d1420;--line:#1f2b3d;--teal:#1fb5ad;--gold:#f2c94c;--org:#e8892c;--grn:#2fbf71;--txt:#d9e3ee;--mut:#7f8ea3;--pur:#8b5cf6}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--txt);font:13px/1.35 "Segoe UI",system-ui,sans-serif}
button{font:inherit;cursor:pointer}
.app{display:grid;grid-template-columns:190px 1fr 330px;grid-template-rows:64px 1fr 38px;height:100vh;grid-template-areas:"top top top" "side center right" "tick tick tick"}
.top{grid-area:top;display:flex;align-items:center;gap:18px;padding:0 18px;background:linear-gradient(#111a29,#0c131e);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;min-width:220px}.brand b{display:block;font:800 18px/1.1 "Segoe UI",sans-serif;letter-spacing:1.5px;color:#fff}.brand small{color:var(--mut);font-size:11px}
.logoic svg{width:34px;height:34px;display:block}
.stats{display:flex;gap:8px;flex:1}.sc{background:#0e1624;border:1px solid var(--line);border-radius:8px;padding:5px 14px;min-width:96px}
.sc small{display:block;font-size:9.5px;letter-spacing:1px;color:var(--mut)}.sc b{font-size:16px;color:#fff;display:flex;gap:6px;align-items:center}.sc b span{font-size:13px}
.tright{display:flex;gap:16px;align-items:center;font-size:18px}.bell{position:relative;cursor:pointer}.bell i{position:absolute;top:-6px;right:-8px;background:var(--grn);color:#fff;font:700 10px/16px sans-serif;font-style:normal;border-radius:8px;min-width:16px;text-align:center}
.ava{width:36px;height:36px;border-radius:50%;background:#2a1c45;border:2px solid var(--pur);display:grid;place-items:center}
.side{grid-area:side;background:var(--panel2);border-right:1px solid var(--line);padding:12px 10px;display:flex;flex-direction:column;gap:10px;overflow:auto}
.side nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:7px;color:#aab6c6;cursor:pointer;font-size:12px;letter-spacing:.5px;text-transform:uppercase}
.side nav a svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}.side nav a.on{background:#15283a;color:#5fd6ff;box-shadow:inset 3px 0 #2ea8ff}.side nav a.dis{opacity:.45;cursor:default}
.hirebtn{margin-top:4px}.lvl{margin-top:auto;background:#0f1828;border:1px solid var(--line);border-radius:8px;padding:10px}.lvl small{color:var(--mut);font-size:10px;letter-spacing:1px}
.lvlrow{display:flex;align-items:center;gap:10px;margin:6px 0;font-size:11px;color:var(--mut)}.hex{width:30px;height:30px;display:grid;place-items:center;border:2px solid #4a8cc0;border-radius:6px;transform:rotate(45deg);font-weight:700;color:#fff}
.bar{height:6px;background:#1c2738;border-radius:3px;overflow:hidden;margin-bottom:6px}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),#47e0c8)}
.center{grid-area:center;overflow:auto;padding:12px 14px;background:#0b121c}
.page{display:none}.page.on{display:block}
.mtabs{display:none}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:middle}
.dot.working{background:#3ddc84;box-shadow:0 0 4px #3ddc84}.dot.waiting{background:var(--gold)}.dot.done{background:var(--teal)}.dot.idle{background:#6b7a88}
.seatic{display:inline-block;width:10px;height:10px;border:1px dashed #aaa;border-radius:50%;margin-right:4px;vertical-align:middle}
.mlist{display:none}
.right{grid-area:right;background:var(--panel2);border-left:1px solid var(--line);overflow:auto;padding:10px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px;margin-bottom:10px}
h2{font-size:12px;margin:0 0 10px;color:#c9d4e2;letter-spacing:1.2px;font-weight:700}
label{display:block;font-size:11.5px;color:var(--mut);margin-bottom:8px}
select,textarea,input{width:100%;margin-top:4px;background:#0a111c;color:var(--txt);border:1px solid #26354b;border-radius:6px;padding:8px;font:inherit}
.btn{width:100%;background:linear-gradient(#1fb5ad,#15938d);color:#fff;border:0;border-radius:6px;padding:10px;font-weight:700;letter-spacing:.8px}
.btn.sm{width:auto;padding:6px 12px}.btn.ghost{background:#1a2638;color:#c9d4e2}.btn.red{background:#7a2330}
.msg{font-size:12px;margin-top:6px;color:var(--teal)}
.tabs{display:flex;gap:2px;margin-bottom:6px;background:#0a111c;border-radius:6px;padding:3px}.tabs button{flex:1;background:none;border:0;color:var(--mut);padding:6px 2px;border-radius:4px;font-size:10.5px;font-weight:600}.tabs button.on{background:#1b2a3f;color:#fff}
.tasks{list-style:none;margin:0;padding:0}.tasks li{display:flex;gap:9px;align-items:center;border-top:1px solid var(--line);padding:9px 2px}
.ck{flex:none;width:18px;height:20px;border:2px solid var(--org);border-radius:3px;display:grid;place-items:center;font-size:11px;font-weight:900;color:var(--grn);position:relative}
.ck:before{content:"";position:absolute;top:-4px;left:3px;width:8px;height:4px;background:currentColor;border-radius:2px;color:inherit}
.ck.in_progress,.ck.new{border-color:var(--org);color:var(--org)}.ck.done{border-color:var(--grn);color:var(--grn)}.ck.waiting{border-color:var(--gold);color:var(--gold)}
.tb{flex:1;min-width:0}.tb .d{color:#e7eef6;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tb small{color:var(--mut);font-size:10.5px}
.b{flex:none;font-size:9.5px;font-weight:700;padding:3px 7px;border-radius:4px;white-space:nowrap;letter-spacing:.4px;border:1px solid}
.b.in_progress,.b.working{color:#ff9f43;border-color:#8a4e17;background:#2c1a0b}.b.done{color:#3ddc84;border-color:#1f6b45;background:#0d2a1c}.b.waiting{color:var(--gold);border-color:#7a6320;background:#2a230b}.b.new,.b.idle{color:#b9c4d0;border-color:#3a4658;background:#161f2c}
.proj{color:#9cc8ff}.emp{color:var(--mut);justify-content:center}
.ticker{grid-area:tick;display:flex;align-items:center;gap:14px;padding:0 16px;background:#0c131e;border-top:1px solid var(--line);font-size:11.5px;overflow:hidden;white-space:nowrap}
.ticker b{color:#c9d4e2;letter-spacing:1px}.tk{overflow:hidden;flex:1}.tk div{display:inline-block;animation:tk 60s linear infinite;color:#aab6c6}.tk span{margin-right:28px}.tk i{color:var(--mut);font-style:normal}
.tk em{font-style:normal}.tk em.done{color:var(--grn)}.tk em.in_progress{color:var(--org)}.tk em.waiting{color:var(--gold)}
@keyframes tk{0%,8%{transform:translateX(0)}to{transform:translateX(-100%)}}
.phead{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.phead h2{font-size:16px;margin:0}
.stgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.stc{display:flex;gap:12px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px}.stc>div:nth-child(2){flex:1}.stc b{display:block;color:#fff}.stc small{display:block;color:var(--mut);font-size:11px;margin-bottom:3px}
.mini{flex:none;width:30px;background:#1a2433;border-radius:6px;padding:3px}.mini.big{width:48px}.mini svg{display:block;width:100%;image-rendering:pixelated}
.sub{font-size:12px;color:var(--mut);letter-spacing:1px;margin:18px 0 8px}.freel{display:flex;flex-wrap:wrap;gap:6px}
.chip{background:#132034;border:1px dashed #2f4566;color:#d9e3ee;border-radius:16px;padding:6px 12px}.chip small{color:var(--mut)}.chip:hover{border-color:var(--teal)}
.modal{display:none;position:fixed;inset:0;background:#000a;z-index:50;place-items:center;padding:12px}.modal.on{display:grid}
.mbox{background:var(--panel);border:1px solid #2c3d57;border-radius:10px;padding:18px;width:min(460px,100%);max-height:94vh;overflow:auto}
.mbox h2{font-size:15px;color:#fff}.hgrid{display:grid;grid-template-columns:90px 1fr;gap:14px}.hprev{background:#1a2433 url() ;border-radius:8px;padding:10px;align-self:start}.hprev svg{width:100%;display:block;image-rendering:pixelated}
.looks{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin-top:4px}.looks button{background:#1a2433;border:2px solid transparent;border-radius:5px;padding:2px}.looks button.on{border-color:var(--teal)}.looks svg{display:block;width:100%}
.mbtns{display:flex;gap:8px;margin-top:6px}.mbtns .btn{flex:1}
.bottombar{display:none}
.login{display:grid;place-items:center;height:100vh}.loginbox{background:var(--panel);border:1px solid var(--line);padding:24px;border-radius:10px;width:300px}.loginbox p{color:var(--mut)}.err{color:#ff6b6b!important}.logo{font:800 16px sans-serif;letter-spacing:1.5px;color:#fff}
@media(max-width:1100px){.sc:nth-child(4){display:none}.app{grid-template-columns:170px 1fr 300px}}
@media(max-width:820px){
.app{display:block;height:auto;padding-bottom:64px}.side,.ticker{display:none}
.top{height:auto;flex-wrap:wrap;padding:10px;gap:8px}.brand{min-width:0;flex:1}.brand b{font-size:15px}
.stats{order:3;flex:1 1 100%;overflow-x:auto}.sc{min-width:0;flex:1;padding:4px 8px}.sc:nth-child(4),.sc:nth-child(5){display:none}.sc small{font-size:8.5px}.sc b{font-size:14px}
.center{padding:8px}.scene{max-width:none;border-radius:4px}
.mtabs{display:flex;gap:4px;margin-bottom:8px;overflow-x:auto}.mtabs button{flex:1;background:var(--panel);border:1px solid var(--line);color:var(--mut);padding:7px 4px;border-radius:6px;font-weight:600}.mtabs button.on{background:#15283a;color:#5fd6ff;border-color:#2ea8ff}
.fsw{display:none}.bub{display:none}.tag{font-size:1.6cqw;margin-top:1.6cqw}.pp{width:4.6cqw}.plq{font-size:1.7cqw;padding:.5cqw .9cqw}.plq.sm{font-size:1.4cqw}.mlist{display:block;list-style:none;padding:0;margin:10px 0 0}.mlist li{display:flex;gap:10px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px;margin-bottom:6px}.mlist li>div{flex:1;min-width:0}.mlist b{color:#fff}.mlist small{color:var(--mut)}.mt{font-size:12px;color:#c9d4e2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.right{border:0;padding:8px;background:none}
body[data-v=office] .right,body[data-v=staff] .right{display:none}body[data-v=tasks] .center,body[data-v=wait] .center{display:none}
body[data-v=wait] #formcard{display:none}
.bottombar{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--panel);border-top:1px solid var(--line);z-index:9}
.bottombar a{flex:1;text-align:center;padding:7px 0;font-size:11px;color:var(--mut)}.bottombar a.on{color:#5fd6ff}
.stgrid{grid-template-columns:1fr}.hgrid{grid-template-columns:64px 1fr}}

/* ===== v3: сцена во весь центр, 3/4-вид ===== */
.app{grid-template-columns:170px 1fr 310px;grid-template-rows:62px 1fr 40px}
.center{padding:0;overflow:hidden;background:#11151d}
#pg-office.on{display:flex;flex-direction:column;height:100%}
.scene{flex:1;min-height:0;container-type:size;display:grid;place-items:center;background:#11151d}
.stage{position:relative;width:min(100cqw,calc(100cqh * 640 / 476));aspect-ratio:640/476;container-type:inline-size;overflow:hidden}
.stage>img{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;display:block}
#fg{pointer-events:none;z-index:3}.stage:after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 55%,#0006 100%)}#ppl{position:absolute;inset:0;z-index:2}#ov{position:absolute;inset:0;z-index:4;pointer-events:none}#hds{position:absolute;inset:0;z-index:3;pointer-events:none}
.hands{position:absolute;width:4.69cqw;transform:translate(-50%,-100%)}.hands svg{display:block;width:100%}.hands.working svg{animation:type .35s steps(2) infinite}@keyframes type{50%{transform:translateY(.1cqw)}}
.roof{position:absolute;left:0;right:0;top:0;height:4.4cqw;display:flex;align-items:center;gap:1.4cqw;padding:0 2.2cqw;z-index:5;color:#8fa1b8;font:700 1.3cqw/1 "Segoe UI",sans-serif;letter-spacing:.12cqw}
.rname{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.roof>*{flex:none}.roof>.rname{flex:0 1 auto}.legend>span{white-space:nowrap}.rname em{font-style:normal;color:#dfe8f3}
.fbar{display:flex;align-items:center;gap:.3cqw;margin-left:auto;background:#0b1018;border:.12cqw solid #2c3d57;border-radius:.6cqw;padding:.25cqw .5cqw}
.fbar>span:first-child{margin:0 .5cqw;color:#7f8ea3}
.fbar button{background:none;border:0;color:#c8d3e0;font:800 1.2cqw/1 sans-serif;padding:.35cqw .8cqw;border-radius:.35cqw}.fbar button.on{background:#e8eef5;color:#0b1220}.fbar button:hover:not(.on){background:#1c2a3e}
.legend{display:flex;gap:1.2cqw;font:600 1.15cqw/1 sans-serif;letter-spacing:0;color:#7f8ea3}.legend .dot{width:.8cqw;height:.8cqw}
.plq{position:absolute;max-width:22cqw;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:.6cqw;background:linear-gradient(#1c2433,#121823);border:.18cqw solid var(--pc);color:#fff;font:800 1.05cqw/1 "Segoe UI",sans-serif;letter-spacing:.08cqw;text-transform:uppercase;padding:.3cqw .9cqw .3cqw .3cqw;border-radius:.6cqw;white-space:nowrap;box-shadow:0 .35cqw 0 #0008}
.plq.c{transform:translateX(-50%)}
.plq .pi{display:grid;place-items:center;min-width:2cqw;height:2cqw;padding:0 .2cqw;border-radius:.4cqw;background:var(--pc);font-size:1.2cqw;letter-spacing:0;text-transform:none;color:#fff;text-shadow:0 .1cqw 0 #0006}
.pp{position:absolute;width:4.69cqw;transform:translate(-50%,-100%);cursor:pointer}
.pp svg{display:block;width:100%;image-rendering:pixelated;filter:drop-shadow(0 .25cqw 0 #0005)}
.pp:hover svg{filter:drop-shadow(0 0 .3cqw #fff) drop-shadow(0 .25cqw 0 #0005)}
.pp.working svg{animation:bob 2.4s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-.12cqw)}}
.tag{position:absolute;transform:translate(-50%,0);background:#0b1220e0;color:#fff;font:700 .95cqw/1.1 "Segoe UI",sans-serif;padding:.22cqw .6cqw;border-radius:.4cqw;white-space:nowrap;border:.1cqw solid #ffffff22}
.tag .dot{width:.7cqw;height:.7cqw;margin-right:.35cqw}
.bub{position:absolute;transform:translate(-50%,calc(-100% - 6.4cqw));max-width:13cqw;width:max-content;background:#f4f6f8;color:#111;font:600 1cqw/1.2 "Segoe UI",sans-serif;padding:.45cqw .7cqw;border-radius:.7cqw;box-shadow:0 .25cqw 0 #0006;text-align:center;border:.12cqw solid #1a1a1a}
.bub span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bub.waiting{background:#fff1c2;border-color:#7a5a00}
.bub:after{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);border:.55cqw solid transparent;border-top-color:#1a1a1a}.bub:before{content:"";position:absolute;left:50%;top:calc(100% - .2cqw);transform:translateX(-50%);border:.45cqw solid transparent;border-top-color:#f4f6f8;z-index:1}.bub.waiting:before{border-top-color:#fff1c2}
.seat{position:absolute;transform:translate(-50%,-100%);width:5.4cqw;height:4.2cqw;border:0;background:none;padding:0;border-radius:.6cqw;color:transparent}
.seat span{display:grid;place-items:center;width:2.4cqw;height:2.4cqw;margin:0 auto;border-radius:50%;font:800 1.6cqw/1 sans-serif;background:#2fbf71;color:#fff;opacity:0;transform:scale(.7);transition:.15s;box-shadow:0 0 0 .25cqw #2fbf7155}
.seat:hover span,.seat:focus-visible span{opacity:1;transform:none}
@media (hover:none){.seat span{opacity:.55;transform:scale(.8);background:#ffffff40;box-shadow:none}}
.walker{position:absolute;width:3.9cqw;transform:translate(-50%,-100%);pointer-events:none}
.walker svg{display:block;width:100%;filter:drop-shadow(0 .25cqw 0 #0005)}
.walker .legs rect:first-child{animation:leg .5s steps(2) infinite}.walker .legs rect:last-child{animation:leg .5s steps(2) infinite reverse}
@keyframes leg{50%{transform:translateY(-1.5px)}}
@keyframes walk{0%{translate:calc(var(--dx)*-1) 0;scale:1 1}48%{translate:var(--dx) 0;scale:1 1}50%{translate:var(--dx) 0;scale:-1 1}98%{translate:calc(var(--dx)*-1) 0;scale:-1 1}100%{translate:calc(var(--dx)*-1) 0;scale:1 1}}
body.paused .walker,body.paused .walker rect,body.paused .pp svg,body.paused .tk div{animation-play-state:paused}
/* header */
.sc{display:flex;flex-direction:column;justify-content:center;min-width:104px;height:44px}
.sc b svg{width:16px;height:16px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tright .ic{position:relative;display:grid;place-items:center;width:34px;height:34px;border-radius:8px;color:#aab6c6;cursor:pointer}.tright .ic:hover{background:#15283a}
.tright .ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.bell i{top:2px;right:2px}.chev{color:#7f8ea3;font-size:14px;margin-left:-8px}
/* ticker + скорость */
.spd{display:flex;align-items:center;gap:4px;margin-left:10px}
.spd button{background:#15202f;border:1px solid #26354b;color:#c9d4e2;border-radius:6px;width:30px;height:24px;font-size:10px;padding:0}.spd button.on{background:#1f6f6b;border-color:#1fb5ad;color:#fff}
.spd small{color:var(--mut);font-size:10px;letter-spacing:1px;margin:0 4px 0 10px}.spd b{font-size:12px;color:#fff;min-width:44px}
@media(max-width:1100px){.app{grid-template-columns:150px 1fr 280px}}
@media(max-width:820px){
 .center{background:none;padding:8px;overflow:visible}#pg-office.on{display:block;height:auto}
 .scene{container-type:normal;display:block;background:none}.stage{width:100%;border-radius:6px}
 .roof .rname,.roof .legend{display:none}.fbar{display:none}
 .bub{display:none}.tag{font-size:1.7cqw;padding:.3cqw .8cqw}.plq{font-size:1.5cqw}.plq .pi{min-width:2.6cqw;height:2.6cqw;font-size:1.6cqw}
 .tright .ic:nth-child(2),.chev{display:none}.spd{display:none}
}
@media(min-width:821px) and (max-aspect-ratio:33/20){
 .app{grid-template-columns:64px 1fr 310px}.side{padding:12px 8px}.side nav a{font-size:0;justify-content:center;padding:11px 0;gap:0}.side nav a svg{width:20px;height:20px}
 .hirebtn{font-size:0;padding:9px 0}.hirebtn:before{content:"＋";font-size:20px;line-height:1}
 .lvl{padding:8px 4px;text-align:center}.lvl small,.lvl #lvlT{display:none}.lvlrow{justify-content:center}.lvl .bar{margin:6px 4px 0}
}

@media(max-width:820px){
 .scene{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:6px;place-items:normal}.stage{width:680px;max-width:none}
 .tag{font-size:1.7cqw;padding:.3cqw .7cqw}.plq{font-size:1.65cqw}.plq .pi{min-width:2.8cqw;height:2.8cqw;font-size:1.7cqw}
 .scene:after{content:"← листай этаж →";display:block;text-align:center;color:var(--mut);font-size:11px;padding:4px 0}
}

/* ===== v5: сцена = референс, люди = вырезки из референса ===== */
.stage{width:min(100cqw,calc(100cqh * 1401 / 982));aspect-ratio:1401/982}
.stage>img{image-rendering:auto}
.stage:after{display:none}
#hds{display:none}
.roof{height:2.1cqw;padding:0 .8cqw;gap:1cqw;font:700 .95cqw/1 "Segoe UI",sans-serif;background:none}
.roof .rname{order:2;color:#8fa1b8;margin-left:18.5cqw}.roof .fbar{order:1;margin:0;padding:.12cqw .3cqw;border-radius:.45cqw;background:#0b1018e6}
.fbar button{font-size:.95cqw;padding:.22cqw .6cqw}.roof .legend{order:3;margin-left:auto;font-size:.9cqw;background:#0b1018cc;padding:.3cqw .6cqw;border-radius:.45cqw}
.pp{transform:none;width:auto}
.spr{display:block;position:relative;aspect-ratio:1/var(--ar)}.spr img{display:block;width:100%;height:100%;filter:drop-shadow(0 .12cqw 0 #0006)}
.pp .spr img{image-rendering:auto}
.pp:hover .spr img{filter:drop-shadow(0 0 .25cqw #fff) drop-shadow(0 .12cqw 0 #0006)}
.pp.working .spr{animation:bob 2.4s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-.1cqw)}}
.pp.waiting .spr:after{content:"!";position:absolute;right:-18%;top:-10%;width:1.3cqw;height:1.3cqw;display:grid;place-items:center;border-radius:50%;background:#f2c94c;color:#1a1300;font:900 .95cqw/1 sans-serif;box-shadow:0 0 0 .12cqw #1a1300}
.horns{position:absolute;left:6%;top:-30%;width:88%;display:block;filter:drop-shadow(0 0 .06cqw #000)}
.bub{transform:translate(1.3cqw,-100%);max-width:10.5cqw;background:#ebebeb;color:#141414;font:500 .9cqw/1.18 "Segoe UI",Roboto,sans-serif;padding:.4cqw .6cqw;border-radius:.55cqw;border:.13cqw solid #1d1d1d;box-shadow:0 .14cqw 0 #0005;text-align:left}
.bub:after{left:.9cqw;top:100%;transform:none;border:0;width:.9cqw;height:.9cqw;background:#1d1d1d;clip-path:polygon(0 0,100% 0,0 100%)}
.bub:before{left:1.03cqw;top:calc(100% - .14cqw);transform:none;border:0;width:.6cqw;height:.62cqw;background:#ebebeb;clip-path:polygon(0 0,100% 0,0 100%)}
.bub.waiting{background:#fff1c2;border-color:#5a4300}.bub.waiting:before{background:#fff1c2}
.bub.done{background:#d9f5e6}.bub.done:before{background:#d9f5e6}
.tag{font:700 .78cqw/1.1 "Segoe UI",sans-serif;padding:.16cqw .45cqw;background:#0b1220d0;border-radius:.35cqw}
.seat{width:3.6cqw;height:3.4cqw}
.seat span{width:2cqw;height:2cqw;font-size:1.4cqw}
.walker{transform:translate(-50%,-100%)}
.walker img{display:block;width:100%;height:auto;filter:drop-shadow(0 .12cqw 0 #0006);transform-origin:50% 50%}
@keyframes wbob{50%{translate:0 -.12cqw}}
.wb{position:absolute;left:55%;bottom:calc(100% + .1cqw);width:max-content;max-width:9cqw;background:#ebebeb;color:#141414;font:500 .85cqw/1.15 "Segoe UI",Roboto,sans-serif;padding:.32cqw .5cqw;border-radius:.5cqw;border:.13cqw solid #1d1d1d;box-shadow:0 .14cqw 0 #0005}
.wb:after{content:"";position:absolute;left:.7cqw;top:100%;width:.8cqw;height:.8cqw;background:#1d1d1d;clip-path:polygon(0 0,100% 0,0 100%)}
.wb:before{content:"";position:absolute;left:.83cqw;top:calc(100% - .14cqw);width:.52cqw;height:.55cqw;background:#ebebeb;clip-path:polygon(0 0,100% 0,0 100%);z-index:1}
body.paused .walker img,body.paused .pp .spr{animation-play-state:paused}
.plq{display:flex;align-items:center;gap:.6cqw;max-width:none;padding:0 .7cqw 0 .35cqw;border-radius:.55cqw;
 background:linear-gradient(color-mix(in srgb,var(--pc) 30%,#0c1424),color-mix(in srgb,var(--pc) 22%,#080d18));
 border:.16cqw solid color-mix(in srgb,var(--pc) 65%,#fff 10%);box-shadow:0 .2cqw 0 #0009,inset 0 0 0 .08cqw #0006;
 color:color-mix(in srgb,var(--pc) 25%,#fff);font:600 1.02cqw/1 "Segoe UI",Roboto,sans-serif;letter-spacing:.04cqw;transform:none}
.plq .pi{flex:none;height:min(72%,2.6cqw);aspect-ratio:1;min-width:0;border-radius:.4cqw;background:color-mix(in srgb,var(--pc) 35%,#0c1424);border:.12cqw solid color-mix(in srgb,var(--pc) 60%,#fff 15%);font-size:1.15cqw}
.plq .pn{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.plq.baked{background:none;border:0;box-shadow:none}
@media(max-width:820px){.bub{display:block;font-size:1.62cqw;max-width:17cqw}.wb{font-size:1.62cqw;max-width:16cqw}.tag{font-size:1.62cqw}.plq{font-size:1.62cqw}.plq .pi{font-size:1.62cqw}.roof{display:none}}
/* v5: пропорции UI как у референса (при 1600×900) */
@media(min-width:821px){
.app{grid-template-columns:162px 1fr 342px;grid-template-rows:74px 1fr 48px}
.top{padding:0 20px 0 14px;gap:22px;background:#0b111b;border-bottom:1px solid #17212f}
.brand{min-width:236px;gap:12px}.brand b{font-size:21px;letter-spacing:1.2px}.brand small{font-size:12px;color:#8a98ab}.logoic svg{width:40px;height:40px}
.stats{gap:10px}.sc{height:54px;min-width:112px;padding:6px 16px;background:#0f1724;border:1px solid #1a2535;border-radius:9px}
.sc small{font-size:10px;letter-spacing:.9px;color:#8796aa;margin-bottom:5px}.sc b{font-size:17px;font-weight:600}
.tright{gap:22px}.tright .ic svg{width:22px;height:22px}.ava{width:42px;height:42px;font-size:22px}
.side{padding:12px 8px;background:#0b111b;border-right:1px solid #17212f}.side nav{display:flex;flex-direction:column;gap:2px}
.side nav a{padding:12px 12px;font-size:12px;letter-spacing:.4px;gap:12px;border:1px solid transparent}.side nav a svg{width:21px;height:21px}
.side nav a.on{background:linear-gradient(90deg,#123b46,#0f2a35);color:#e9fbff;border-color:#1f6f7a;box-shadow:none}
.side nav a.dis{opacity:.55}
.right{background:#0b111b;border-left:1px solid #17212f;padding:10px}
.card{background:#0f1724;border:1px solid #1a2535;padding:14px}
.ticker{background:#0b111b;border-top:1px solid #17212f;font-size:12px;gap:18px;padding:0 18px}
.spd button{width:34px;height:28px}
}
@media(min-width:821px) and (max-aspect-ratio:33/20){.app{grid-template-columns:64px 1fr 320px}.brand{min-width:0}}
@media(min-width:821px) and (max-aspect-ratio:33/20){
 .side nav a{font-size:0;justify-content:center;padding:11px 0;gap:0}.side nav a svg{width:21px;height:21px}
}
.pp:has(.horns){z-index:1}
@media(max-width:820px){.stage{width:720px;max-width:none}}
@media(min-width:821px){.brand b{font-size:23px}.logoic svg{width:44px;height:44px}.bub{font-size:.95cqw}.wb{font-size:.95cqw;max-width:10cqw}}