*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0f1114; --bg2:#141720; --panel:#171a21; --card:rgba(255,255,255,.035); --card2:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.075); --line2:rgba(255,255,255,.14);
  --tx:#f2f2f5; --dim:#9a9aa8; --dim2:#65656f;
  --acc:#e8b86d; --acc2:#f3d09a; --grad:linear-gradient(120deg,var(--acc),var(--acc2));
  --glow:rgba(232,184,109,.10); --ok:#6fd3a5; --warn:#f0a868;
  --r:14px;
}
body[data-theme="crimson"]{--acc:#ff2d4d;--acc2:#ff7a2f;--glow:rgba(255,45,77,.10)}
body[data-theme="aurora"]{--acc:#4dc3ff;--acc2:#9a6bff;--glow:rgba(77,195,255,.10)}
body[data-theme="ivory"]{--acc:#e8ddc8;--acc2:#c9a86a;--glow:rgba(232,221,200,.07)}
body[data-theme="venom"]{--acc:#53f27a;--acc2:#b8ff4a;--glow:rgba(83,242,122,.08)}
html,body{height:100%}
body{background:var(--bg);color:var(--tx);font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:-30%;z-index:0;pointer-events:none;
  background:radial-gradient(45% 40% at 18% 12%,var(--glow),transparent 60%),radial-gradient(40% 35% at 85% 80%,var(--glow),transparent 60%);
  animation:breathe 16s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:scale(1) translateY(0);opacity:.85}50%{transform:scale(1.12) translateY(-2%);opacity:1}}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.11);border-radius:9px}
::-webkit-scrollbar-track{background:transparent}

/* ---------- intro ---------- */
#intro{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:26px;transition:opacity .7s ease,transform .7s ease}
#intro.gone{opacity:0;transform:scale(1.06);pointer-events:none}
.i-mark{width:82px;height:82px;border-radius:24px;background:var(--panel);border:1px solid var(--line2);display:flex;align-items:center;justify-content:center;box-shadow:0 24px 70px var(--glow);animation:pop .9s cubic-bezier(.2,.9,.25,1)}
.i-mark svg{width:48px;height:48px}
.i-name{font-size:46px;font-weight:200;letter-spacing:.42em;text-indent:.42em;animation:rise 1s .12s both}
.i-name b{font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.i-sub{color:var(--dim);font-size:14.5px;letter-spacing:.04em;max-width:440px;text-align:center;animation:rise 1s .26s both}
.i-go{margin-top:6px;padding:13px 40px;border:none;border-radius:30px;background:var(--grad);color:#fff;font-size:14.5px;font-weight:600;cursor:pointer;letter-spacing:.02em;box-shadow:0 14px 40px var(--glow);animation:rise 1s .4s both;transition:.18s}
.i-go:hover{transform:translateY(-2px);box-shadow:0 20px 52px var(--glow)}
.i-feat{display:flex;gap:26px;flex-wrap:wrap;justify-content:center;margin-top:14px;animation:rise 1s .54s both}
.i-feat div{color:var(--dim2);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
@keyframes pop{from{opacity:0;transform:scale(.7) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ---------- shell ---------- */
#app{display:none;position:fixed;inset:0;z-index:1;overflow:auto}
#app.on{display:block;animation:fadein .6s both}
@keyframes fadein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.snav{position:fixed;top:0;left:0;bottom:0;width:172px;background:rgba(12,12,17,.72);backdrop-filter:blur(18px);border-right:1px solid var(--line);padding:18px 12px;display:flex;flex-direction:column;gap:5px;z-index:20}
.brand{display:flex;align-items:center;gap:9px;padding:4px 8px 20px;cursor:pointer}
.brand svg{width:26px;height:26px;flex:none}
.brand span{font-size:15.5px;font-weight:300;letter-spacing:.26em}
.brand b{font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.snav button{display:flex;align-items:center;gap:10px;background:none;border:none;color:var(--dim);padding:9px 11px;border-radius:10px;cursor:pointer;font-size:13.2px;text-align:left;transition:.15s;font-family:inherit;width:100%}
.snav button:hover{color:var(--tx);background:var(--card)}
.snav button.act{color:#fff;background:var(--card2);box-shadow:inset 0 0 0 1px var(--line2)}
.snav .ic{width:17px;text-align:center;opacity:.85;font-size:14px}
.snav .sp{flex:1}
.ver{color:var(--dim2);font-size:10.5px;padding:8px 11px;letter-spacing:.05em}
.top{position:fixed;top:0;left:172px;right:0;height:56px;display:flex;align-items:center;gap:12px;padding:0 22px;background:rgba(9,9,13,.7);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);z-index:19}
.top .lbl{color:var(--dim2);font-size:10.5px;text-transform:uppercase;letter-spacing:.14em}
.spacer{flex:1}
.spend{color:var(--dim);font-size:12.5px}
.spend b{color:var(--warn)}
main{margin:56px 0 0 172px;padding:26px 24px 90px;max-width:1500px}

/* ---------- atoms ---------- */
select,input[type=text],input[type=number],input[type=search]{background:var(--bg2);border:1px solid var(--line);color:var(--tx);border-radius:10px;padding:9px 11px;font-size:13px;font-family:inherit;outline:none;transition:.15s}
select:focus,input:focus{border-color:var(--line2)}
textarea{width:100%;min-height:104px;background:var(--bg2);border:1px solid var(--line);color:var(--tx);border-radius:12px;padding:13px 14px;font-size:13.6px;font-family:inherit;resize:vertical;outline:none;line-height:1.55;transition:.15s}
textarea:focus{border-color:var(--line2);box-shadow:0 0 0 3px var(--glow)}
.btn{background:var(--grad);border:none;color:#fff;border-radius:11px;padding:11px 24px;font-size:13.4px;font-weight:600;cursor:pointer;font-family:inherit;box-shadow:0 5px 16px var(--glow);transition:.16s}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px var(--glow)}
.btn:disabled{opacity:.45;cursor:default;transform:none}
.btn2{background:var(--card2);border:1px solid var(--line2);color:var(--tx);border-radius:11px;padding:10px 17px;font-size:13px;cursor:pointer;font-family:inherit;transition:.15s}
.btn2:hover{border-color:var(--acc);color:#fff}
.btn3{background:var(--card);border:1px solid var(--line);color:var(--dim);border-radius:9px;padding:6px 11px;font-size:11.8px;cursor:pointer;font-family:inherit;transition:.15s}
.btn3:hover{color:#fff;border-color:var(--line2)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;backdrop-filter:blur(10px)}
.grid{display:grid;grid-template-columns:1.35fr .95fr;gap:18px;align-items:start}
@media(max-width:1140px){.grid{grid-template-columns:1fr}}
h2{font-size:15.5px;font-weight:600;margin-bottom:13px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
h2 span{font-size:11.5px;color:var(--dim2);font-weight:400}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}
.field{margin-top:15px}
.field>label{display:block;color:var(--dim2);font-size:10.5px;text-transform:uppercase;letter-spacing:.13em;margin-bottom:7px}
.hint{color:var(--dim2);font-size:11.8px;margin-top:8px;line-height:1.6}
.chip{background:var(--bg2);border:1px solid var(--line);color:var(--dim);border-radius:20px;padding:6px 14px;font-size:12.4px;cursor:pointer;transition:.13s;font-family:inherit}
.chip:hover{color:#fff;border-color:var(--acc)}
.chip.on{color:#fff;border-color:var(--acc);background:var(--card2)}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.cost{margin-left:auto;color:var(--dim);font-size:12.5px}
.cost b{color:var(--warn)}
.pbar{height:3px;background:var(--line);border-radius:3px;overflow:hidden;margin-top:13px;display:none}
.pbar.on{display:block}
.pbar i{display:block;height:100%;background:var(--grad);width:0;transition:width .4s}
.pbar.indet i{width:36%;animation:sl 1.15s ease-in-out infinite}
@keyframes sl{0%{margin-left:-36%}100%{margin-left:100%}}
.prog{color:var(--dim);font-size:12.5px;margin-top:9px;min-height:17px}
.out{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:11px;margin-top:14px}
.out img,.out video{width:100%;border-radius:11px;border:1px solid var(--line);cursor:pointer;display:block;transition:.2s}
.out img:hover{transform:scale(1.02);border-color:var(--line2)}
.slider{display:flex;align-items:center;gap:12px}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:3px;background:var(--line);border-radius:3px;outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--grad);cursor:pointer;box-shadow:0 0 0 4px var(--glow)}
.task{display:flex;gap:10px;align-items:center;padding:10px 12px;background:var(--bg2);border:1px solid var(--line);border-radius:11px;margin-top:8px;font-size:12.5px}
.task .tth{width:34px;height:44px;object-fit:cover;border-radius:6px;flex:none;border:1px solid var(--line);background:#000;display:block}
.dot{width:8px;height:8px;border-radius:50%;background:var(--warn);animation:pulse 1.2s infinite;flex:none}
.dot.ok{background:var(--ok);animation:none}
.dot.bad{background:#ff5d6c;animation:none}
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:10px}
.tcard{position:relative;background:var(--bg2);border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:12px}
.tcard .tv{position:relative;width:100%;aspect-ratio:9/16;background:#000;overflow:hidden}
.tcard .tv video,.tcard .tv img{width:100%;height:100%;object-fit:cover;display:block}
.tcard .tv img.src{opacity:.45;filter:blur(1px) saturate(.7)}
.tcard .tv .shim{position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,var(--glow) 50%,transparent 70%);background-size:200% 100%;animation:shim 1.6s linear infinite}
@keyframes shim{0%{background-position:200% 0}100%{background-position:-200% 0}}
.tcard .tv .st{position:absolute;left:8px;top:8px;display:flex;align-items:center;gap:6px;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);border-radius:999px;padding:4px 9px;color:#fff;font-size:11px}
.tcard .tv .tm{position:absolute;right:8px;top:8px;background:rgba(0,0,0,.6);border-radius:999px;padding:4px 8px;color:#fff;font-size:11px;font-variant-numeric:tabular-nums}
.tcard .tv .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:44px;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.6);cursor:pointer;opacity:.9}
.tcard .tv .play:hover{opacity:1;transform:scale(1.06)}
.tcard .tb{padding:8px 10px;display:flex;flex-direction:column;gap:6px}
.tcard .tp{color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tcard .ta{display:flex;gap:6px;flex-wrap:wrap}
.tcard .ta .btn3{padding:4px 8px;font-size:11px}
.tcard .tx{position:absolute;right:6px;bottom:6px}
.tcard.done{border-color:rgba(111,211,165,.35)}
.tcard.bad{border-color:rgba(255,93,108,.4)}
.stylechips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.sc{background:var(--card);border:1px solid var(--line2);color:var(--dim);border-radius:999px;padding:5px 11px;font:inherit;font-size:11.5px;cursor:pointer;transition:.15s}
.sc:hover{color:var(--tx);border-color:var(--acc)}
.sc.lock{border-color:var(--acc);color:var(--acc)}
.chargrid{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px;align-items:center}
.chr{position:relative;display:flex;align-items:center;gap:7px;background:var(--card2);border:1px solid var(--line2);border-radius:11px;padding:4px 9px 4px 4px;cursor:pointer;font-size:12px}
.chr:hover{border-color:var(--acc)}
.chr img{width:26px;height:34px;object-fit:cover;border-radius:6px;background:#000}
.chr .x{background:none;border:none;color:var(--dim2);cursor:pointer;font-size:11px;padding:0 2px}
.chr .x:hover{color:#ff5d6c}
.spend b.warn{color:var(--warn)}
.kbd{font-size:10.5px;color:var(--dim2);border:1px solid var(--line);border-radius:5px;padding:1px 5px;margin-left:6px;font-family:inherit}
#login{position:fixed;inset:0;z-index:200;background:radial-gradient(1200px 600px at 50% -10%,rgba(232,184,109,.10),transparent),var(--bg);display:none;align-items:center;justify-content:center}
#login.on{display:flex}
#login .box{width:min(92vw,380px);background:var(--panel);border:1px solid var(--line2);border-radius:18px;padding:26px 24px;box-shadow:0 30px 90px rgba(0,0,0,.6)}
#login h3{font-size:17px;font-weight:600;margin-bottom:4px}
#login .sub{color:var(--dim);font-size:12.5px;margin-bottom:18px}
#login input{width:100%;margin-bottom:10px}
#login .err{color:var(--warn);font-size:12.5px;min-height:18px}
.utable{width:100%;border-collapse:collapse;font-size:13px;margin-top:10px}
.utable th{text-align:left;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding:6px 8px;border-bottom:1px solid var(--line2)}
.utable td{padding:8px;border-bottom:1px solid var(--line)}
.utable tr:hover td{background:var(--card)}
.tier{font-size:11px;border-radius:999px;padding:2px 8px;border:1px solid var(--line2);color:var(--dim)}
.tier.insider{border-color:var(--acc);color:var(--acc)}
.tier.public{border-color:#6fd3a5;color:#6fd3a5}
.tier.admin{border-color:var(--line2);color:var(--tx)}
.ubal{font-variant-numeric:tabular-nums}
.pwbox{background:var(--card2);border:1px solid var(--acc);border-radius:10px;padding:10px 12px;margin-top:10px;font-size:13px}
.pwbox code{font-size:15px;letter-spacing:.06em;color:var(--acc)}
#toasts{position:fixed;right:18px;bottom:18px;z-index:9999;display:flex;flex-direction:column;gap:8px}
.toast{background:var(--bg2);border:1px solid var(--line);border-left:3px solid var(--acc);border-radius:12px;padding:10px 14px;font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.45);display:flex;gap:10px;align-items:center;cursor:pointer;animation:tin .25s ease}
.toast video{width:36px;height:56px;object-fit:cover;border-radius:6px;background:#000}
@keyframes tin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.sug{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:11px 13px;margin-top:8px;font-size:12.6px;cursor:pointer;line-height:1.55}
.sug:hover{border-color:var(--acc)}
.apo{display:none;margin-top:13px}
.apo.act{display:block}

/* ---------- asset cards ---------- */
.att{position:relative;width:96px;border:2px solid var(--line);border-radius:12px;overflow:hidden;background:#000;transition:.15s}
.att:hover{border-color:var(--line2)}
.att .im{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.att div.im{display:flex;align-items:center;justify-content:center;font-size:28px;color:var(--acc);background:var(--bg2)}
.att .lb{font-size:9.6px;color:var(--dim);padding:4px 6px;background:var(--bg2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att .bdg{position:absolute;top:4px;left:4px;width:22px;height:22px;border-radius:7px;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;color:var(--acc);pointer-events:none}
.att .bdg svg{width:13px;height:13px}
.att .bdg .n{position:absolute;right:-5px;bottom:-5px;background:var(--acc);color:#000;font-size:8px;font-weight:700;border-radius:5px;min-width:13px;height:13px;line-height:13px;text-align:center;padding:0 2px}
.att.addA .ic{color:var(--dim);display:flex;align-items:center;justify-content:center}
.att.addA .ic svg{width:26px;height:26px}
.att.addA:hover .ic{color:var(--acc)}
.att .x{position:absolute;top:3px;right:3px;background:rgba(0,0,0,.75);border:none;color:#fff;border-radius:6px;width:19px;height:19px;cursor:pointer;font-size:10px;display:none}
.att:hover .x{display:block}
.att.addA{border-style:dashed;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:124px;color:var(--dim);font-size:11px;gap:5px;cursor:pointer;text-align:center;padding:6px}
.att.addA:hover{color:var(--acc);border-color:var(--acc)}
.mchip{background:var(--card2);border:1px solid var(--line2);color:var(--tx);border-radius:8px;padding:3px 8px;font:inherit;font-size:12px;cursor:pointer}
.mnote{color:var(--dim2);font-style:normal;font-size:11.5px;margin-left:6px}
.mbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:6px 0 14px;padding:10px 12px;background:var(--card);border:1px solid var(--line2);border-radius:12px}
.mbar .ml{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.mbar select.msel{background:var(--bg2);border:1px solid var(--line2);color:var(--tx);border-radius:9px;padding:7px 10px;font:inherit;font-size:14px;font-weight:600;cursor:pointer;min-width:190px}
.mbar .mp{font-size:13px;color:var(--tx);font-variant-numeric:tabular-nums}
.mbar .mp b{color:var(--acc)}
.mbar .mn{font-size:12.5px;color:var(--dim);flex:1;min-width:160px}
body[data-theme="light"]{--bg:#f4f2ee;--bg2:#ffffff;--panel:#faf8f4;--card:rgba(0,0,0,.035);--card2:rgba(0,0,0,.06);--line:rgba(0,0,0,.09);--line2:rgba(0,0,0,.16);--tx:#1c1b19;--dim:#5e5c57;--dim2:#8a877f;--acc:#b8842a;--acc2:#d9a94a;--glow:rgba(184,132,42,.10);--ok:#2f9c6a;--warn:#c9711f}
body[data-theme="light"] .tcard .tv,body[data-theme="light"] .task .tth{background:#e8e5df}
body[data-theme="light"] .snav button.act,body[data-theme="light"] .chip.on,body[data-theme="light"] .chip:hover,body[data-theme="light"] .btn2:hover,body[data-theme="light"] .btn3:hover{color:var(--tx)}
body[data-theme="light"] .top{background:rgba(244,242,238,.8)}
body[data-theme="light"] .snav{background:rgba(250,248,244,.85)}
.attgrid{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px;border-radius:12px;transition:.18s}
.attgrid.hot{background:var(--glow);box-shadow:0 0 0 2px var(--acc) inset;padding:6px;margin:2px -6px 0}
.att.hot{border-color:var(--acc)!important;transform:scale(1.04);box-shadow:0 0 0 3px var(--glow)}
.acard[draggable],.thumb[draggable]{cursor:grab}
.acard.dragging,.thumb.dragging{opacity:.5}
body.dnd .attgrid .addA{border-color:var(--acc);color:var(--acc)}

/* ---------- library ---------- */
.libbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.libbar input[type=search]{flex:1;min-width:180px}
.lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--tile,126px),1fr));gap:11px}
/* Повзунок розміру плиток. Одна змінна — і вся сітка міняється разом. */
.tsize{display:flex;align-items:center;gap:7px;color:var(--dim);font-size:11.5px}
.tsize input[type=range]{width:96px;accent-color:var(--acc);cursor:pointer}
/* клік по самій картинці — відкрити на весь екран */
.acard .zone{display:block;position:relative;cursor:zoom-in}
.lgrid.list .acard .zone{flex:none;width:56px}
.acard .th,.acard .ph{cursor:zoom-in}
.lgrid.list{grid-template-columns:1fr;gap:6px}
.acard{position:relative;border:2px solid var(--line);border-radius:12px;overflow:hidden;background:#000;cursor:pointer;transition:.15s}
.acard:hover{border-color:var(--line2);transform:translateY(-2px)}
.acard.sel{border-color:var(--acc);box-shadow:0 0 0 3px var(--glow)}
.acard .th{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;background:var(--bg2)}
.acard .ph{width:100%;aspect-ratio:3/4;display:flex;align-items:center;justify-content:center;font-size:30px;color:var(--dim);background:var(--bg2)}
.acard .meta{padding:5px 7px;background:var(--bg2);font-size:9.8px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acard .badge{position:absolute;top:5px;left:5px;background:rgba(0,0,0,.7);border-radius:5px;padding:1px 6px;font-size:9.5px;color:#fff;letter-spacing:.03em}
.acard .fav{position:absolute;top:4px;right:4px;background:rgba(0,0,0,.62);border:none;color:#fff;border-radius:6px;width:21px;height:21px;cursor:pointer;font-size:11px;opacity:0;transition:.15s}
.acard:hover .fav,.acard .fav.on{opacity:1}
.acard .fav.on{color:var(--warn)}
.acard .more{position:absolute;bottom:26px;right:4px;background:rgba(0,0,0,.62);border:none;color:#fff;border-radius:6px;width:21px;height:21px;cursor:pointer;font-size:11px;opacity:0;transition:.15s}
.acard:hover .more{opacity:1}
.lgrid.list .acard{display:flex;align-items:center;gap:11px;aspect-ratio:auto;border-radius:10px}
.lgrid.list .acard .th,.lgrid.list .acard .ph{width:56px;aspect-ratio:1;flex:none}
.acard .dur,.thumb .dur,.att .dur{position:absolute;bottom:24px;left:5px;background:rgba(0,0,0,.72);border-radius:5px;padding:1px 6px;font-size:9.5px;color:#fff;font-variant-numeric:tabular-nums}
.att .dur{bottom:5px}
.acard .pv,.thumb .pv,.att .pv{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:20px;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.7);pointer-events:none;opacity:.9}
.acard:hover .pv{opacity:1;transform:translate(-50%,-50%) scale(1.15);transition:.15s}
canvas.prev{background:var(--bg2)}
.lgrid.list .acard .meta{flex:1;background:none;font-size:12px;color:var(--tx)}
.drop{border:2px dashed var(--line2);border-radius:var(--r);padding:26px;text-align:center;color:var(--dim);font-size:12.5px;margin-bottom:14px;transition:.18s}
.drop.hot{border-color:var(--acc);color:var(--tx);background:var(--glow)}
.empty{color:var(--dim2);text-align:center;padding:44px 10px;font-size:13px}

/* ---------- overlays ---------- */
.ovl{position:fixed;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(6px);display:none;z-index:60;align-items:center;justify-content:center;padding:20px}
.ovl.act{display:flex}
.ovlc{background:var(--panel);border:1px solid var(--line2);border-radius:18px;padding:22px;width:min(1020px,96vw);max-height:90vh;overflow:auto;box-shadow:0 30px 90px rgba(0,0,0,.7)}
.ovlh{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.ovlh h2{margin:0}
.setlbl{color:var(--dim2);font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;margin:14px 0 7px;display:flex;align-items:center;gap:9px}
.setlbl b{color:var(--tx);font-size:11.5px;letter-spacing:.06em}
.setgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px;max-height:300px;overflow:auto}
.thumb{position:relative;border:2px solid var(--line);border-radius:10px;overflow:hidden;cursor:pointer;aspect-ratio:3/4;background:#000}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb.sel{border-color:var(--acc);box-shadow:0 0 0 2px var(--glow)}
.thumb .x{position:absolute;top:3px;right:3px;background:rgba(0,0,0,.72);border:none;color:#fff;border-radius:6px;width:19px;height:19px;cursor:pointer;font-size:10px;display:none}
.thumb:hover .x{display:block}
.thumb.add{display:flex;align-items:center;justify-content:center;font-size:26px;color:var(--dim);border-style:dashed;background:transparent}
.thumb.add:hover{color:var(--acc);border-color:var(--acc)}

/* inspector */
.insp video{width:100%;max-height:52vh;border-radius:12px;background:#000;display:block}
.tl{position:relative;margin-top:14px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg2);cursor:pointer}
.strip{display:flex;height:62px}
.strip canvas{height:62px;flex:none;display:block;opacity:.9}
.ph-line{position:absolute;top:0;bottom:0;width:2px;background:var(--acc);box-shadow:0 0 10px var(--acc);pointer-events:none}
.ticks{display:flex;justify-content:space-between;color:var(--dim2);font-size:10px;margin-top:5px;padding:0 2px}
.tcode{font-variant-numeric:tabular-nums;color:var(--tx);font-size:13px}
.tcode b{color:var(--acc)}

/* crop */
.cropwrap{position:relative;display:inline-block;max-width:100%;line-height:0;user-select:none}
.cropwrap img{max-width:100%;max-height:56vh;display:block;border-radius:10px}
.croprect{position:absolute;border:2px solid var(--acc);box-shadow:0 0 0 9999px rgba(0,0,0,.55);cursor:move}
.croprect i{position:absolute;width:13px;height:13px;background:var(--acc);border-radius:3px;right:-7px;bottom:-7px;cursor:nwse-resize}

/* audio */
.wave{width:100%;height:104px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;display:block;cursor:crosshair}
.arange{display:flex;gap:14px;align-items:center;margin-top:11px;flex-wrap:wrap}
.arange b{font-variant-numeric:tabular-nums}

/* news */
.news{border-left:2px solid var(--line2);padding-left:18px;margin-top:6px}
.nitem{margin-bottom:20px;position:relative}
.nitem:before{content:"";position:absolute;left:-24px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--grad);box-shadow:0 0 0 4px var(--glow)}
.nitem h3{font-size:13.6px;font-weight:600;margin-bottom:3px}
.nitem .d{color:var(--dim2);font-size:11px;margin-bottom:6px}
.nitem p{color:var(--dim);font-size:12.8px;line-height:1.65}

/* chat */
#fab{position:fixed;right:22px;bottom:22px;width:52px;height:52px;border-radius:50%;background:var(--grad);border:none;color:#fff;font-size:21px;cursor:pointer;box-shadow:0 14px 36px var(--glow);z-index:40;transition:.18s}
#fab:hover{transform:scale(1.07)}
#chat{position:fixed;top:0;right:0;bottom:0;width:min(400px,92vw);background:rgba(20,23,30,.94);backdrop-filter:blur(18px);border-left:1px solid var(--line2);display:flex;flex-direction:column;z-index:41;box-shadow:-20px 0 60px rgba(0,0,0,.45);transform:translateX(102%);transition:transform .38s cubic-bezier(.22,.8,.26,1)}
#chat.on{transform:none}
/* edge drawers */
.edge{position:fixed;top:0;bottom:0;width:10px;z-index:39}
.edge.l{left:0}.edge.r{right:0}
/* язички шухляд — видно завжди, щоб ніхто їх не шукав */
.ehandle{position:fixed;top:50%;transform:translateY(-50%);width:30px;min-height:118px;z-index:42;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  writing-mode:vertical-rl;padding:14px 0;
  transition:width .2s,filter .2s,box-shadow .2s;border:1px solid;user-select:none}
.ehandle .eic{writing-mode:horizontal-tb;font-size:14px;line-height:1}
.ehandle .ecount{writing-mode:horizontal-tb;font-size:9.5px;font-weight:700;letter-spacing:0;
  min-width:17px;text-align:center;padding:1px 4px;border-radius:9px;background:rgba(0,0,0,.34)}
.ehandle.l{left:0;border-radius:0 13px 13px 0;border-left:0;
  background:linear-gradient(160deg,#e8b563,#c9863a);color:#1b1408;border-color:#f0d3a055;
  box-shadow:3px 0 18px rgba(232,181,99,.24)}
.ehandle.r{right:0;transform:translateY(-50%) rotate(180deg);border-radius:0 13px 13px 0;border-left:0;
  background:linear-gradient(160deg,#7d6bd8,#4d3fa8);color:#f2f0ff;border-color:#9c8dff55;
  box-shadow:-3px 0 18px rgba(125,107,216,.26)}
.ehandle:hover{width:37px;filter:brightness(1.08)}
.ehandle.l:hover{box-shadow:5px 0 26px rgba(232,181,99,.4)}
.ehandle.r:hover{box-shadow:-5px 0 26px rgba(125,107,216,.42)}
.ehandle.hid{opacity:0;pointer-events:none}
@media(max-width:640px){.ehandle{min-height:92px;font-size:9.5px;width:24px}}
#drawer{position:fixed;top:0;left:0;bottom:0;width:min(340px,88vw);background:rgba(20,23,30,.94);backdrop-filter:blur(18px);border-right:1px solid var(--line2);z-index:41;display:flex;flex-direction:column;transform:translateX(-102%);transition:transform .38s cubic-bezier(.22,.8,.26,1);box-shadow:20px 0 60px rgba(0,0,0,.45)}
#drawer.on{transform:none}
.dhead{display:flex;align-items:center;gap:10px;padding:16px 16px 10px;border-bottom:1px solid var(--line)}
.dhead b{font-size:12px;letter-spacing:.14em}
.dpin{margin-left:auto;font-size:11px;color:var(--dim);border:1px solid var(--line);border-radius:8px;padding:4px 8px;cursor:pointer;background:none;font-family:inherit}
.dpin.on{color:var(--acc);border-color:var(--acc)}
.dtabs{display:flex;gap:4px;padding:8px 12px 0}
.dtabs button{flex:1;background:none;border:0;border-bottom:2px solid transparent;color:var(--dim);padding:8px 4px;font:inherit;font-size:12.5px;cursor:pointer}
.dtabs button.on{color:var(--tx);border-color:var(--acc)}
.dbody{flex:1;overflow:auto;padding:10px 12px}
.pi{display:flex;gap:10px;align-items:center;padding:9px 10px;border-radius:10px;cursor:pointer;transition:.15s}
.pi:hover{background:var(--card2)}
.pi.on{background:var(--card2);outline:1px solid var(--line2)}
.pi .av{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,#3a3f4a,#5a6272);flex:none;display:grid;place-items:center;font-size:12px;font-weight:700;color:#e6e9ef}
.pi.on .av{background:var(--grad);color:#1a1409}
.pi .t{font-size:13px}.pi .s{font-size:11px;color:var(--dim)}.pi .n{margin-left:auto;font-size:11px;color:var(--dim2)}
.hi{display:flex;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer;align-items:center}
.hi:hover{background:var(--card2)}
.hi img,.hi .ph{width:34px;height:44px;object-fit:cover;border-radius:6px;background:#000;flex:none;display:grid;place-items:center;color:var(--dim2);font-size:11px}
.hi .t{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hi .s{font-size:11px;color:var(--dim2)}
.think{align-self:flex-start;color:var(--dim);font-size:12.5px;display:flex;align-items:center;gap:8px;padding:2px 4px}
.think i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--dim);margin-right:3px;animation:blink 1.2s infinite}
.think i:nth-child(2){animation-delay:.2s}.think i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
.chead{padding:13px 15px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px;font-size:13.4px;font-weight:600}
.cbody{flex:1;overflow:auto;padding:13px;display:flex;flex-direction:column;gap:9px}
.msg{max-width:86%;padding:9px 12px;border-radius:12px;font-size:12.8px;line-height:1.55;white-space:pre-wrap}
.msg.u{align-self:flex-end;background:var(--card2);border:1px solid var(--line2)}
.msg.a{align-self:flex-start;background:var(--bg2);border:1px solid var(--line)}
.cfoot{padding:11px;border-top:1px solid var(--line);display:flex;gap:8px}
.cfoot input{flex:1}
/* ============ дії під кожним фото ============ */
.acard:hover{transform:translateY(-4px) scale(1.06);z-index:6}
.acard .zoomb{bottom:52px}
.acard .dur,.thumb .dur{bottom:50px}
.acard .meta{padding:4px 7px}
.acard .abar{display:flex;align-items:center;gap:1px;background:var(--bg2);padding:2px 2px 1px;border-top:1px solid var(--line)}
.acard .abar button{flex:1;background:transparent;border:0;color:var(--dim);font-size:12.5px;line-height:1;
  padding:5px 0;border-radius:6px;cursor:pointer;transition:.13s}
.acard .abar button:hover{background:rgba(34,200,230,.14);color:var(--acc)}
.acard .abar button.fv.on{color:var(--warn)}
.acard .abar button.fv.on:hover{color:var(--warn);background:rgba(255,180,84,.14)}
.acard.isfav{border-color:rgba(255,180,84,.5)}
/* ============ бічна панель у великому перегляді ============ */
.viewer .vrail{position:absolute;right:18px;top:50%;transform:translateY(-50%) translateX(14px);
  display:flex;flex-direction:column;gap:6px;opacity:0;transition:opacity .3s ease .42s,transform .38s cubic-bezier(.22,.8,.26,1) .42s;z-index:4}
.viewer.act .vrail{opacity:1;transform:translateY(-50%)}
.viewer .vrail button{width:44px;height:44px;border:0;border-radius:14px;background:rgba(255,255,255,.08);
  color:#fff;font-size:16px;cursor:pointer;display:grid;place-items:center;transition:.14s;position:relative}
.viewer .vrail button:hover{background:var(--acc);color:#000;transform:scale(1.06)}
.viewer .vrail button.fv.on{background:rgba(255,180,84,.22);color:var(--warn)}
.viewer .vrail button.dang:hover{background:#e2564f;color:#fff}
.viewer .vrail i{position:absolute;right:52px;top:50%;transform:translateY(-50%);white-space:nowrap;font-style:normal;
  font-size:11.5px;background:rgba(0,0,0,.8);color:#fff;padding:4px 9px;border-radius:8px;opacity:0;pointer-events:none;transition:.13s}
.viewer .vrail button:hover i{opacity:1}
.viewer .sheet{padding:28px 96px 28px 72px}
.viewer .vn.n{right:74px}
@media(max-width:760px){.viewer .vrail{right:8px}.viewer .sheet{padding:24px 60px 24px 12px}.viewer .vn.n{right:58px}}
.viewer{position:fixed;inset:0;z-index:80;pointer-events:none}
.viewer .veil{position:absolute;inset:0;background:rgba(4,5,7,0);transition:background .45s ease .32s}
.viewer .sheet{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,17,20,.985),rgba(15,17,20,.94));transform:translateY(-101%);transition:transform .52s cubic-bezier(.22,.8,.26,1);display:flex;align-items:center;justify-content:center;padding:28px 72px}
.viewer.act{pointer-events:auto}
.viewer.act .sheet{transform:none}
.viewer.act .veil{background:rgba(4,5,7,.72)}
.viewer .grip{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:54px;height:5px;border-radius:5px;background:rgba(255,255,255,.22)}
.viewer.phone .vmedia img,.viewer.phone .vmedia video{height:78vh;aspect-ratio:9/16;width:auto;max-width:none;object-fit:cover;border-radius:30px;border:11px solid #0a0a0d;box-shadow:0 0 0 2px #23242b,0 26px 70px rgba(0,0,0,.75)}
.viewer.phone .vmedia{position:relative}
.viewer.phone .vmedia:after{content:"";position:absolute;top:16px;left:50%;transform:translateX(-50%);width:74px;height:6px;border-radius:6px;background:#1b1c22;pointer-events:none}
.viewer .vph{position:absolute;top:16px;right:64px;width:38px;height:38px;border:0;border-radius:12px;background:rgba(255,255,255,.07);color:var(--tx);cursor:pointer;font-size:15px}
.viewer .vph.on{background:var(--grad);color:#fff}
.viewer .vx{position:absolute;top:16px;right:18px;width:38px;height:38px;border:0;border-radius:12px;background:rgba(255,255,255,.08);color:#fff;font-size:16px;cursor:pointer}
.viewer .vx:hover{background:var(--acc);color:#000}
.viewer .vn{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:#fff;font-size:20px;cursor:pointer;display:grid;place-items:center}
.viewer .vn:hover{background:var(--acc);color:#000}
.viewer .vn.p{left:16px}.viewer .vn.n{right:16px}
.viewer .vn[disabled]{opacity:.25;pointer-events:none}
.viewer .vcap{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:var(--dim);font-size:12.5px;padding:0 80px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.viewer .vmedia{opacity:0;transform:scale(.965);transition:opacity .35s ease .38s,transform .45s cubic-bezier(.22,.8,.26,1) .38s;display:flex;align-items:center;justify-content:center}
.viewer.act .vmedia{opacity:1;transform:none}
.viewer .vmedia img,.viewer .vmedia video{max-width:min(92vw,1100px);max-height:84vh;border-radius:14px;box-shadow:0 30px 90px rgba(0,0,0,.6);background:#000}
.viewer .vmedia audio{width:min(80vw,560px)}
/* hover-to-inspect on every thumbnail */
.att .im{cursor:zoom-in;transition:transform .25s cubic-bezier(.22,.8,.26,1)}
.att:hover .im{transform:scale(1.04)}
.tth{cursor:zoom-in;transition:transform .2s}
.tth:hover{transform:scale(1.08)}
.thumb{position:relative}
.thumb .zb{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:7px;background:rgba(0,0,0,.66);color:#fff;font-size:12px;display:grid;place-items:center;opacity:0;transition:.15s;cursor:zoom-in;z-index:2}
.thumb:hover .zb{opacity:1}
.thumb .zb:hover{background:var(--acc);color:#000}
.acard{transition:transform .22s cubic-bezier(.22,.8,.26,1),box-shadow .22s,border-color .15s}
.acard:hover{transform:translateY(-4px) scale(1.015);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.acard .zoomb{position:absolute;bottom:22px;right:4px;width:22px;height:22px;border:0;border-radius:6px;background:rgba(0,0,0,.66);color:#fff;font-size:12px;line-height:22px;text-align:center;cursor:pointer;opacity:0;transition:opacity .15s;padding:0;z-index:3}
.acard:hover .zoomb{opacity:1}
.acard .zoomb:hover{background:var(--acc);color:#000}

/* знак «Дві дуги» */
.mk{overflow:visible}
.mk .mk-in{transform-origin:32px 32px;transition:transform .7s cubic-bezier(.3,.9,.3,1)}
.mk .mk-core{transition:r .35s ease}
.brand:hover .mk .mk-in{transform:rotate(180deg)}
.brand:hover .mk .mk-core{r:6}
#intro .mk .mk-in{animation:mkspin 9s cubic-bezier(.5,0,.5,1) infinite}
@keyframes mkspin{0%,55%{transform:rotate(0)}75%,100%{transform:rotate(180deg)}}
/* ====== вкладка Video: три колонки ====== */
.vwrap{display:grid;grid-template-columns:250px minmax(0,1fr) 280px;gap:14px;align-items:start}
@media(max-width:1180px){.vwrap{grid-template-columns:230px minmax(0,1fr)}.vright{display:none}}
@media(max-width:860px){.vwrap{grid-template-columns:1fr}}
.vcol{background:var(--pan,#121216);border:1px solid var(--line);border-radius:16px;padding:12px}
.vleft{position:sticky;top:12px}
.vpreset{position:relative;border-radius:13px;overflow:hidden;height:92px;margin-bottom:11px;background:linear-gradient(135deg,#2a2038,#1a1a24)}
.vpreset img{width:100%;height:100%;object-fit:cover;opacity:.5}
.vpreset .pt{position:absolute;left:11px;bottom:8px}
.vpreset .pt b{display:block;font-size:14px;letter-spacing:.05em;color:var(--acc);text-shadow:0 1px 8px #000}
.vpreset .pt s{display:block;text-decoration:none;font-size:11px;color:#cfcfd8}
.vmodes{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:11px}
.vmodes b{display:flex;align-items:center;gap:6px;background:#0e0e12;border:1px solid var(--line);border-radius:10px;
 padding:8px 9px;font-size:11.5px;font-weight:600;color:var(--dim);cursor:pointer;transition:.16s}
.vmodes b i{font-style:normal;font-size:13px}
.vmodes b:hover{border-color:var(--line2);color:var(--tx)}
.vmodes b.on{background:rgba(232,181,99,.12);border-color:rgba(232,181,99,.42);color:var(--acc)}
.vmodes b.add{grid-column:1/-1;justify-content:center;color:#5f5f6a;font-size:15px;padding:5px;border-style:dashed}
.vmodes b.add:hover{color:var(--acc);border-color:rgba(232,181,99,.35)}
.vlbl{font-size:10.5px;color:var(--dim);letter-spacing:.09em;text-transform:uppercase;font-weight:600;margin:10px 0 5px}
.vrow{display:flex;align-items:center;justify-content:space-between;background:#0e0e12;border:1px solid var(--line);
 border-radius:11px;padding:9px 11px;margin-top:9px}
.vrow small{display:block;font-size:11px;color:var(--dim)}
.vgo{width:100%;border:0;border-radius:12px;padding:13px;font:inherit;font-weight:700;font-size:14.5px;cursor:pointer;
 background:var(--grad);color:#1c1408;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px}
.vgo:disabled{opacity:.5;cursor:default}
.vgo span{background:rgba(0,0,0,.14);border-radius:8px;padding:2px 8px;font-size:13px}
.vmid .mh{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.vmid .mh b{font-size:15px}
.vright{position:sticky;top:12px;max-height:calc(100vh - 26px);overflow:auto}
.vrh{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.vrh b{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
.vrh .n{margin-left:auto;font-size:11px;background:rgba(255,255,255,.06);border-radius:9px;padding:2px 7px;color:var(--dim)}
.vday{font-size:10.5px;color:#5f5f6a;text-align:center;margin:11px 0 8px;letter-spacing:.05em}
.hcard{border:1px solid var(--line);background:var(--card,#16161b);border-radius:13px;padding:11px;margin-bottom:9px;cursor:pointer;transition:.18s}
.hcard:hover{border-color:var(--line2);transform:translateY(-1px)}
.hcard .hm{display:flex;align-items:center;gap:6px;font-size:11.5px;font-weight:650;margin-bottom:7px}
.hcard .hm .md{color:var(--acc)}
.hcard .hm .price{margin-left:auto;font-size:11px;color:var(--acc);background:rgba(232,181,99,.12);border-radius:8px;padding:1px 7px;font-weight:700}
.hcard .hp{font-size:11.6px;color:#a9a9b4;line-height:1.45;max-height:62px;overflow:hidden}
.hcard .htn{display:flex;gap:5px;margin-top:8px}
.hcard .htn img{width:30px;height:30px;object-fit:cover;border-radius:7px;border:1px solid var(--line2)}
.hcard .hchips{display:flex;gap:5px;margin-top:8px;flex-wrap:wrap}
.hcard .hchips i{font-style:normal;font-size:10.5px;color:var(--dim);border:1px solid var(--line);border-radius:7px;padding:2px 6px}
.hcard .hact{display:flex;gap:5px;margin-top:9px;opacity:0;transition:.18s}
.hcard:hover .hact{opacity:1}
.hcard .hact b{flex:1;text-align:center;font-size:11px;font-weight:600;border:1px solid var(--line2);border-radius:7px;padding:4px;color:var(--dim)}
.hcard .hact b:hover{border-color:var(--acc);color:var(--acc)}
.stt{width:6px;height:6px;border-radius:50%;background:#5fd08a}
.stt.f{background:#c0463e}
/* ====== Сцена ====== */
.scene{border:1px solid var(--line);border-radius:16px;background:
  radial-gradient(700px 240px at 25% 0%,rgba(232,181,99,.05) 0%,transparent 70%),#0d0d11;
  padding:13px;margin-bottom:14px}
.scene .sch{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.scene .sch b{font-size:14px}
.scene .sch .hint{font-size:11.5px;color:var(--dim);margin:0}
.scene .sch .sp{flex:1}
.sblk{display:flex;gap:11px;align-items:flex-start;margin-bottom:9px}
.sblk .sthumb{flex:none;width:72px;border-radius:11px;overflow:hidden;border:2px solid var(--line2);background:#17171c;position:relative}
.sblk .sthumb img,.sblk .sthumb video{width:100%;height:96px;object-fit:cover;display:block}
.sblk .sthumb .wv{height:96px;display:grid;place-items:center;font-size:24px;color:#5fd08a;background:#101711}
.sblk .sthumb .cap{font-size:9.5px;font-weight:700;padding:3px 5px;text-align:center;letter-spacing:.02em}
.sblk .sthumb .rm{position:absolute;right:3px;top:3px;width:17px;height:17px;border-radius:50%;
  background:rgba(0,0,0,.66);color:#fff;font-size:10px;display:grid;place-items:center;cursor:pointer;border:0;line-height:1}
.sblk.i .sthumb{border-color:rgba(232,181,99,.55)}.sblk.i .cap{background:rgba(232,181,99,.16);color:var(--acc)}
.sblk.v .sthumb{border-color:rgba(125,107,216,.55)}.sblk.v .cap{background:rgba(125,107,216,.18);color:#b8adff}
.sblk.a .sthumb{border-color:rgba(95,208,138,.5)}.sblk.a .cap{background:rgba(95,208,138,.15);color:#5fd08a}
.sblk .snote{flex:1;min-width:0}
.sblk .srole{display:flex;align-items:center;gap:7px;margin-bottom:4px}
.sblk .srole em{font-style:normal;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border-radius:7px;padding:2px 8px}
.sblk.i .srole em{background:rgba(232,181,99,.14);color:var(--acc)}
.sblk.v .srole em{background:rgba(125,107,216,.16);color:#b8adff}
.sblk.a .srole em{background:rgba(95,208,138,.13);color:#5fd08a}
.sblk .srole span{font-size:11px;color:var(--dim)}
.sblk textarea{width:100%;background:#111116;border:1px solid var(--line);border-radius:10px;color:var(--tx);
  font:inherit;font-size:12.5px;padding:7px 10px;resize:vertical;min-height:46px;outline:0}
.sblk textarea:focus{border-color:var(--acc)}
.sadd{border:1px dashed var(--line2);border-radius:12px;padding:12px;text-align:center;color:#5a5a64;font-size:12px;cursor:pointer}
.sadd:hover{border-color:var(--acc);color:var(--acc)}
.smain{margin-top:11px}
.smain label{font-size:10.5px;color:var(--dim);letter-spacing:.09em;text-transform:uppercase;font-weight:600}
.smain textarea{width:100%;background:#111116;border:1px solid var(--line);border-radius:11px;color:var(--tx);
  font:inherit;padding:9px 11px;resize:vertical;min-height:74px;outline:0;margin-top:5px}
.smain textarea:focus{border-color:var(--acc)}
.strip2{display:flex;gap:6px;overflow-x:auto;padding:8px 0 2px;margin-top:9px;border-top:1px solid var(--line)}
.strip2 .mini{flex:none;width:44px;height:44px;border-radius:9px;overflow:hidden;border:1px solid var(--line2);
  position:relative;cursor:pointer;background:#17171c}
.strip2 .mini img{width:100%;height:100%;object-fit:cover}
.strip2 .mini.a{display:grid;place-items:center;color:#5fd08a;font-size:15px}
.strip2 .mini:hover{border-color:var(--acc)}
.strip2 .mini.v::after{content:"▶";position:absolute;right:2px;bottom:0;font-size:8px;color:#fff;text-shadow:0 1px 3px #000}
/* ====== розкладка 2 ====== */
.vwrap{grid-template-columns:184px minmax(0,1fr) 258px !important}
@media(max-width:1180px){.vwrap{grid-template-columns:170px minmax(0,1fr) !important}}
@media(max-width:860px){.vwrap{grid-template-columns:1fr !important}}
.vleft .vmodes{grid-template-columns:1fr;gap:4px;margin-bottom:9px}
.vleft .vmodes b{padding:5px 8px;font-size:11px}
.vleft .vlbl{margin:9px 0 4px;font-size:9.5px}
.vleft .chips{gap:4px}
.vleft .chip{padding:3px 7px;font-size:10.5px}
.vleft select{font-size:11.5px;padding:4px 6px}
.vleft .slider{margin-top:3px}
.vleft .vgo{margin-top:20px;padding:12px;font-size:13.5px}
/* шапка Сцени = картка моделі */
.schead{position:relative;border-radius:13px;overflow:hidden;margin:-13px -13px 13px;height:96px;
  background:linear-gradient(135deg,#2a2038,#161620);display:flex;align-items:flex-end}
.schead>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.34}
.schead .grd{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,13,.15) 20%,rgba(10,10,13,.94))}
.schead .in{position:relative;padding:11px 14px;display:flex;align-items:flex-end;gap:12px;width:100%}
.schead .nm b{display:block;font-size:18px;letter-spacing:.05em;color:var(--acc);line-height:1.12}
.schead .nm s{display:block;text-decoration:none;font-size:11.5px;color:#cfcfd8;margin-top:3px}
.schead .sp{flex:1}
.schead .chg{background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:9px;
  padding:5px 11px;font:inherit;font-size:11.5px;cursor:pointer;white-space:nowrap}
.schead .chg:hover{border-color:var(--acc);color:var(--acc)}
/* права колонка: що просто зараз крутиться */
.vlive{border:1px solid rgba(232,181,99,.28);background:rgba(232,181,99,.055);border-radius:13px;
  padding:10px;margin-bottom:12px}
.vlive .lt{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);font-weight:700;margin-bottom:8px}
.lrow{display:flex;gap:9px;align-items:center;margin-bottom:9px}
.lrow:last-child{margin-bottom:0}
.lrow .lth{width:36px;height:48px;border-radius:8px;overflow:hidden;background:#1c1c24;flex:none;position:relative}
.lrow .lth img{width:100%;height:100%;object-fit:cover;opacity:.6}
.lrow .lth::after{content:"";position:absolute;left:0;right:0;height:60%;
  background:linear-gradient(180deg,transparent,rgba(232,181,99,.45));animation:lsw 1.7s ease-in-out infinite}
@keyframes lsw{0%{transform:translateY(-120%)}100%{transform:translateY(220%)}}
.lrow .li{min-width:0;flex:1}
.lrow .li b{display:block;font-size:12px;font-weight:600}
.lrow .li s{display:block;text-decoration:none;font-size:10.5px;color:var(--dim);margin-top:1px}
.lbar{height:3px;border-radius:3px;background:#26262e;margin-top:6px;overflow:hidden}
.lbar i{display:block;height:100%;width:30%;background:var(--grad,linear-gradient(90deg,#e8b563,#b07be0));
  animation:lslide 1.6s ease-in-out infinite}
@keyframes lslide{0%{margin-left:-32%}100%{margin-left:102%}}
.vidle{color:#5a5a64;font-size:11.5px;text-align:center;padding:7px 0;line-height:1.5}
.vdone{display:flex;gap:8px;align-items:center;font-size:11.5px;color:var(--dim);margin-top:9px;
  border-top:1px solid var(--line);padding-top:9px}
.vdone b{color:var(--ok,#5fd08a);font-weight:600}
/* ====== перевірка промпта ====== */
.trigbox{margin-top:8px;border-radius:11px;padding:9px 11px;font-size:12.5px;line-height:1.5;
  border:1px solid rgba(229,178,95,.35);background:rgba(229,178,95,.07);color:#e3d4b6}
.trigbox.hard{border-color:rgba(229,113,95,.5);background:rgba(229,113,95,.1);color:#f0c4bb}
.trigbox b{display:block;font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;
  margin-bottom:6px;color:var(--acc)}
.trigbox.hard b{color:#e5715f}
.trigrow{display:flex;gap:8px;align-items:flex-start;margin-bottom:6px}
.trigrow:last-child{margin-bottom:0}
.trigrow code{background:rgba(0,0,0,.35);border-radius:6px;padding:1px 6px;font-size:12px;
  color:#fff;white-space:nowrap;flex:none}
.trigrow span{flex:1;min-width:0}
.trigfix{background:rgba(255,255,255,.09);border:1px solid var(--line2);color:var(--tx);
  border-radius:8px;padding:3px 9px;font:inherit;font-size:11.5px;cursor:pointer;flex:none}
.trigfix:hover{border-color:var(--acc);color:var(--acc)}
/* ================= STUDIO ================= */
.stwrap{display:grid;grid-template-columns:392px minmax(0,1fr);gap:0;height:calc(100vh - 96px);
  border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--bg2)}
@media(max-width:1100px){.stwrap{grid-template-columns:1fr;height:auto}}
.stwork{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0}
.stmodes{display:flex;gap:4px;padding:11px 12px 10px;border-bottom:1px solid var(--line)}
.stmodes b{flex:1;text-align:center;padding:7px 0;border-radius:9px;font-size:12.5px;font-weight:600;
  color:var(--dim);background:var(--bg);border:1px solid var(--line);cursor:pointer}
.stmodes b.on{background:rgba(232,181,99,.13);border-color:rgba(232,181,99,.4);color:var(--acc)}
.stchat{flex:1;overflow-y:auto;padding:13px;min-height:230px}
.stmsg{margin-bottom:13px}
.stmsg .who{font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);
  margin-bottom:5px;display:flex;align-items:center;gap:6px}
.stmsg .who em{font-style:normal;width:5px;height:5px;border-radius:50%;background:var(--acc)}
.stmsg.me .who em{background:#b07be0}
.stbub{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:10px 12px;font-size:13px}
.stmsg.me .stbub{background:rgba(232,181,99,.09);border-color:rgba(232,181,99,.25)}
.stbub ul{margin:6px 0 0;padding-left:17px}.stbub li{font-size:12.5px;margin-bottom:3px;color:var(--tx)}
.stq{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.stq button{background:rgba(232,181,99,.13);border:1px solid rgba(232,181,99,.4);color:var(--acc);
  border-radius:9px;padding:5px 11px;font-size:12px;font:inherit;font-size:12px;cursor:pointer}
.stq button.g{background:var(--card);border-color:var(--line2);color:var(--tx)}
.stcomp{border-top:1px solid var(--line);padding:11px 12px 12px;background:var(--panel)}
.strefs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:9px}
.stref{width:74px;border-radius:10px;overflow:hidden;border:2px solid var(--line2);background:var(--card2);position:relative}
.stref img,.stref video{width:100%;height:58px;object-fit:cover;display:block}
.stref .wv{height:58px;display:grid;place-items:center;color:#5fd08a;font-size:17px}
.stref select{width:100%;border:0;background:var(--bg);color:var(--dim);font:inherit;font-size:9.5px;
  padding:3px 2px;text-align:center;outline:none;cursor:pointer}
.stref .x{position:absolute;top:3px;right:3px;width:16px;height:16px;border-radius:50%;border:0;
  background:rgba(0,0,0,.7);color:#fff;font-size:10px;line-height:16px;padding:0;cursor:pointer}
.stref.r-char{border-color:rgba(232,181,99,.75)}
.stref.r-loc{border-color:rgba(176,123,224,.7)}
.stref.r-style{border-color:rgba(95,208,138,.6)}
.stref.r-first,.stref.r-last{border-color:rgba(95,160,232,.7)}
.stref.add{display:grid;place-items:center;height:79px;border-style:dashed;color:var(--dim2);font-size:21px;cursor:pointer}
.stref.add:hover{border-color:var(--acc);color:var(--acc)}
.stta{width:100%;background:var(--bg);border:1px solid var(--line2);border-radius:11px;color:var(--tx);
  font:inherit;font-size:13px;padding:10px 11px;min-height:62px;resize:vertical;outline:none}
.stta:focus{border-color:rgba(232,181,99,.5)}
.stpar{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px;align-items:center}
.stgo{width:100%;margin-top:10px;border:0;border-radius:12px;padding:12px;font-weight:700;font-size:14px;
  background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer}
.stgo span{background:rgba(0,0,0,.16);border-radius:8px;padding:2px 9px;font-size:12.5px}
.stres{display:flex;flex-direction:column;min-width:0;background:var(--bg2)}
.strtop{display:flex;align-items:center;gap:9px;padding:10px 15px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.strtop .tb{padding:6px 12px;border-radius:9px;font-size:12.5px;color:var(--dim);border:1px solid transparent;cursor:pointer}
.strtop .tb.on{background:var(--panel);border-color:var(--line);color:var(--tx)}
.strtop .sp{flex:1}
.stest{font-size:12px;color:var(--dim)}.stest b{color:var(--acc);font-size:14px}
.strbody{flex:1;overflow-y:auto;padding:15px}
.sthead{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.sthead h2{font-size:15px;margin:0}
.sthead .n{font-size:11px;background:var(--card);border-radius:8px;padding:3px 8px;color:var(--dim)}
.sttiers{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap}
.sttier{background:var(--card);border:1px solid var(--line2);color:var(--dim);border-radius:9px;
  padding:5px 10px;font-size:11.5px;font:inherit;font-size:11.5px;cursor:pointer}
.sttier.on{background:rgba(232,181,99,.14);border-color:rgba(232,181,99,.45);color:var(--acc)}
.stgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:12px}
.stsc{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;cursor:pointer}
.stsc:hover{border-color:var(--line2)}
.stsc.sel{border-color:rgba(232,181,99,.6);box-shadow:0 0 0 1px rgba(232,181,99,.25)}
.stsc .pv{position:relative;height:124px;background:var(--card)}
.stsc .pv img{width:100%;height:100%;object-fit:cover;display:block}
.stsc .no{position:absolute;top:7px;left:8px;background:rgba(0,0,0,.7);border-radius:7px;padding:2px 8px;
  font-size:10.5px;letter-spacing:.08em;color:#fff}
.stsc .du{position:absolute;bottom:7px;right:8px;background:rgba(0,0,0,.72);border-radius:7px;padding:2px 8px;
  font-size:10.5px;color:#fff}
.stsc .bd{padding:9px 11px 11px}
.stsc .ds{font-size:12.5px;margin-bottom:7px;line-height:1.4}
.stsc dl{margin:0;font-size:11px;display:grid;grid-template-columns:54px 1fr;gap:2px 7px}
.stsc dt{color:var(--dim2)}.stsc dd{margin:0;color:var(--tx)}
.stsc .ft{display:flex;align-items:center;gap:7px;margin-top:9px;padding-top:8px;border-top:1px solid var(--line)}
.stsc .md{font-size:10.5px;background:var(--card);border:1px solid var(--line2);border-radius:7px;padding:2px 7px;color:var(--tx)}
.stsc .pr{margin-left:auto;font-size:12px;font-weight:600;color:var(--acc)}
.stdet{margin-top:15px;background:var(--panel);border:1px solid rgba(232,181,99,.3);border-radius:14px;padding:13px 15px}
.stdet h3{margin:0 0 4px;font-size:13.5px;color:var(--acc)}
.stdet .sub{font-size:11.5px;color:var(--dim);margin-bottom:10px}
.stdet .row{display:flex;gap:7px;flex-wrap:wrap}
.stdet .row button{background:var(--panel);border:1px solid var(--line2);color:var(--tx);border-radius:9px;
  padding:6px 11px;font-size:12px;font:inherit;font-size:12px;cursor:pointer}
.stdet .row button:hover{border-color:var(--acc);color:var(--acc)}
.stempty{color:var(--dim2);font-size:13px;text-align:center;padding:44px 20px;line-height:1.6}
.stbar{display:flex;gap:8px;align-items:center;margin:0 0 12px;flex-wrap:wrap}
.stbtn{background:var(--card);border:1px solid var(--line2);color:var(--tx);border-radius:10px;
  padding:8px 13px;font:inherit;font-size:12.5px;cursor:pointer}
.stbtn:hover{border-color:var(--acc);color:var(--acc)}
.stbtn.pri{background:var(--grad);color:#fff;border:0;font-weight:700}
.stbtn:disabled{opacity:.45;cursor:default}
.stbtn.pri:disabled{filter:grayscale(.6)}
.stcont{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--dim);cursor:pointer;
  background:var(--card);border:1px solid var(--line2);border-radius:10px;padding:7px 11px}
.stcont input{accent-color:var(--acc);margin:0}
.stcont.on{border-color:rgba(232,181,99,.45);color:var(--acc)}
.stpg{font-size:12px;color:var(--dim);margin-left:auto}
.stsc .ed{outline:none;border-radius:5px}
.stsc .ed:focus{background:rgba(232,181,99,.1);box-shadow:0 0 0 2px rgba(232,181,99,.25)}
.stsc .tools{position:absolute;top:6px;right:7px;display:flex;gap:4px;opacity:0;transition:opacity .12s}
.stsc:hover .tools{opacity:1}
.stsc .tools button{width:22px;height:22px;border-radius:6px;border:0;background:var(--card2);
  color:var(--tx);font-size:12px;line-height:22px;padding:0;cursor:pointer}
.stsc .tools button:hover{background:rgba(232,181,99,.85);color:#141014}
.stsc .pv.busy::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent,rgba(232,181,99,.35));animation:lsw 1.6s ease-in-out infinite}
.stadd{display:grid;place-items:center;min-height:150px;border:1px dashed var(--line2);border-radius:14px;
  color:var(--dim2);font-size:24px;cursor:pointer}
.stadd:hover{border-color:var(--acc);color:var(--acc)}
body[data-theme="light"] .stwrap,body[data-theme="light"] .stres{background:#efece6}
body[data-theme="light"] .stsc .pv,body[data-theme="light"] .stref{background:#e6e2da}
body[data-theme="light"] .stbub{background:#fff}
body[data-theme="light"] .stmsg.me .stbub{background:rgba(184,132,42,.10)}
body[data-theme="light"] .stgo,body[data-theme="light"] .stbtn.pri{color:#fff}
body[data-theme="light"] .stref select{background:#efece6;color:var(--dim)}
body[data-theme="light"] .stsc .no,body[data-theme="light"] .stsc .du{background:rgba(0,0,0,.55)}
body[data-theme="light"] .trigbox{color:#5a4a28}
body[data-theme="light"] .trigrow code{background:rgba(0,0,0,.72)}
body[data-theme="light"] .vlive{background:rgba(184,132,42,.07)}
body[data-theme="light"] .lrow .lth,body[data-theme="light"] .lbar{background:#e6e2da}
body[data-theme="light"] .schead{background:linear-gradient(135deg,#e9e3d6,#dcd6c8)}
/* світла тема: панелі, що були жорстко темними */
body[data-theme="light"] .vcol,body[data-theme="light"] .nav,body[data-theme="light"] .plan,body[data-theme="light"] .navsess,body[data-theme="light"] .vhist,body[data-theme="light"] .hcard,body[data-theme="light"] .tcard{background:#ffffff}
body[data-theme="light"] .scene{background:radial-gradient(700px 240px at 25% 0%,rgba(184,132,42,.06) 0%,transparent 70%),#faf8f4}
body[data-theme="light"] .sblk textarea,body[data-theme="light"] .smain textarea,body[data-theme="light"] .vwrap textarea{background:#ffffff;color:var(--tx)}
body[data-theme="light"] .vmodes b{background:#f1eee8;color:var(--tx)}
body[data-theme="light"] .vpreset{background:linear-gradient(135deg,#efe9dc,#e4ded2)}
body[data-theme="light"] .vpreset .pt s{color:#6a675f}
body[data-theme="light"] .hcard .hp{color:#5e5c57}
body[data-theme="light"] #drawer,body[data-theme="light"] #chat{background:rgba(250,248,244,.97)}
body[data-theme="light"] .dbody,body[data-theme="light"] .cbody{background:transparent}
body[data-theme="light"] .strip2 > *{background:#efece6}
body[data-theme="light"] .tgrid .tcard .tb{background:#ffffff}
body[data-theme="light"] .schead .in{color:var(--tx)}
body[data-theme="light"] .scene .in{background:#ffffff}
body[data-theme="light"] .schead .chg{background:rgba(255,255,255,.75);color:#1c1b19}
/* м'яка паперова тема */
body[data-theme="paper"]{--bg:#faf7f1;--bg2:#fffdf9;--panel:#fffdf9;--card:rgba(0,0,0,.028);
 --card2:rgba(0,0,0,.05);--line:rgba(0,0,0,.08);--line2:rgba(0,0,0,.14);
 --tx:#221f1a;--dim:#6b665c;--dim2:#96907f;--acc:#8a6a2f;--acc2:#c2a05a;
 --glow:rgba(138,106,47,.07);--ok:#2f8f63;--warn:#b8681c}
body[data-theme="paper"] .stwrap,body[data-theme="paper"] .stres{background:#f4f0e7}
body[data-theme="paper"] .stsc .pv,body[data-theme="paper"] .stref{background:#eae5da}
body[data-theme="paper"] .stbub{background:#fff}
body[data-theme="paper"] .stgo,body[data-theme="paper"] .stbtn.pri{color:#fff}
body[data-theme="paper"] .top{background:rgba(250,247,241,.85)}
body[data-theme="paper"] .snav{background:rgba(255,253,249,.9)}
body[data-theme="paper"] .stsc .no,body[data-theme="paper"] .stsc .du{background:rgba(0,0,0,.5)}
body[data-theme="paper"] .trigrow code{background:rgba(0,0,0,.7)}
/* на світлих темах гасимо фонове сяйво, щоб не було брудних плям */
body[data-theme="light"]:before,body[data-theme="paper"]:before{opacity:.35}
body[data-theme="light"] .stsc .tools button,body[data-theme="paper"] .stsc .tools button{background:rgba(255,255,255,.9);color:#221f1a;border:1px solid rgba(0,0,0,.12)}
body[data-theme="light"] .stbtn.pri,body[data-theme="paper"] .stbtn.pri{color:#fff}
/* ---- перемикач теми ---- */
.thsw{position:relative;display:inline-flex;align-items:center;gap:0;background:var(--card);
  border:1px solid var(--line2);border-radius:999px;padding:4px;cursor:pointer;overflow:hidden;
  transition:padding .18s ease,box-shadow .18s ease;margin-right:10px;vertical-align:middle}
.thsw:hover{padding:4px 12px 4px 4px;box-shadow:0 0 0 3px var(--glow)}
.thsw .knob{width:26px;height:26px;border-radius:999px;display:grid;place-items:center;
  background:var(--grad);color:#141014;font-size:14px;line-height:1;flex:none;
  transition:transform .3s cubic-bezier(.4,1.6,.5,1)}
.thsw:hover .knob{transform:rotate(-18deg) scale(1.08)}
.thsw .lab{max-width:0;opacity:0;white-space:nowrap;font-size:11.5px;color:var(--dim);
  transition:max-width .2s ease,opacity .18s ease,margin .2s ease;margin-left:0}
.thsw:hover .lab{max-width:150px;opacity:1;margin-left:8px}
/* ---- сесії ---- */
.sess{display:flex;gap:9px;align-items:flex-start;padding:9px 10px;border-radius:11px;cursor:pointer;
  border:1px solid transparent}
.sess:hover{background:var(--card)}
.sess.on{background:var(--card2);border-color:rgba(232,181,99,.35)}
.sess .av{width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;
  background:var(--card2);color:var(--acc);font-size:13px;overflow:hidden}
.sess .av img{width:100%;height:100%;object-fit:cover}
.sess .i{min-width:0;flex:1}
.sess .t{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sess .s{font-size:10.5px;color:var(--dim);margin-top:2px}
.sess .x{border:0;background:transparent;color:var(--dim2);font-size:12px;cursor:pointer;padding:2px 4px}
.sess .x:hover{color:var(--warn)}
.sessnew{display:flex;gap:9px;align-items:center;padding:9px 10px;border-radius:11px;cursor:pointer;
  border:1px dashed var(--line2);color:var(--dim);margin-bottom:8px;font-size:12.5px}
.sessnew:hover{border-color:var(--acc);color:var(--acc)}
/* ================= STUDIO v2 · п'ять зон, скло ================= */
:root{--glass:rgba(255,255,255,.045);--glass2:rgba(255,255,255,.075);--gline:rgba(255,255,255,.10);--blur:14px}
body[data-theme="light"],body[data-theme="paper"]{--glass:rgba(255,255,255,.62);--glass2:rgba(255,255,255,.85);--gline:rgba(0,0,0,.09)}
.st5{margin-top:0;display:grid;grid-template-columns:200px minmax(300px,.9fr) minmax(360px,1.4fr) 250px;
  grid-template-rows:minmax(0,1fr) auto;gap:12px;height:calc(100vh - 92px);min-height:600px}
@media(max-width:1500px){.st5{grid-template-columns:186px minmax(280px,.9fr) minmax(320px,1.3fr) 232px}}
@media(max-width:1250px){.st5{grid-template-columns:minmax(340px,1fr) minmax(380px,1.2fr);grid-template-rows:minmax(0,1fr) auto}
  .st5 .z-hist,.st5 .z-insp{display:none}}
.st5 .z{background:var(--glass);border:1px solid var(--gline);border-radius:18px;
  backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));
  display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}
.st5 .zh{display:flex;align-items:center;gap:9px;padding:13px 15px 10px;border-bottom:1px solid var(--gline)}
.st5 .zh h2{margin:0;font-size:15px}
.st5 .zh .n{font-size:11px;color:var(--dim)}
.st5 .zh .sp{flex:1}
.st5 .zb{flex:1;overflow-y:auto;padding:12px 13px;min-height:0}
.st5 .z-bar{grid-column:1/-1;flex-direction:row;align-items:center;gap:0;padding:8px 10px;overflow:visible}
/* --- історія --- */
.hs{display:flex;gap:9px;align-items:center;padding:8px 9px;border-radius:12px;cursor:pointer;
  border:1px solid transparent;margin-bottom:5px}
.hs:hover{background:var(--glass2)}
.hs.on{background:var(--glass2);border-color:rgba(232,181,99,.45)}
.hs .th{width:52px;height:52px;border-radius:10px;overflow:hidden;background:var(--card2);flex:none;
  display:grid;place-items:center;color:var(--acc);font-size:16px}
.hs .th img{width:100%;height:100%;object-fit:cover}
.hs .i{min-width:0;flex:1}
.hs .t{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.hs .s{font-size:10.5px;color:var(--dim);margin-top:2px}
.hs .x{border:0;background:transparent;color:var(--dim2);cursor:pointer;font-size:12px;padding:2px 4px}
.hs .x:hover{color:var(--warn)}
.hsearch{width:100%;background:var(--bg);border:1px solid var(--gline);border-radius:10px;color:var(--tx);
  font:inherit;font-size:12.5px;padding:7px 10px;outline:none;margin-bottom:9px}
.hsnew{width:100%;border:1px dashed var(--line2);background:transparent;color:var(--dim);border-radius:11px;
  padding:9px;font:inherit;font-size:12.5px;cursor:pointer;margin-top:6px}
.hsnew:hover{border-color:var(--acc);color:var(--acc)}
/* --- агент --- */
.agtabs{display:flex;gap:4px;padding:10px 13px 0}
.agtabs b{padding:6px 12px;border-radius:9px;font-size:12px;font-weight:600;color:var(--dim);cursor:pointer;
  border:1px solid transparent}
.agtabs b.on{background:var(--glass2);border-color:var(--gline);color:var(--tx)}
.aglab{font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dim);font-weight:700;
  display:flex;align-items:center;gap:8px;margin:12px 0 8px}
.aglab .sp{flex:1}
.aglab button{border:1px solid var(--gline);background:var(--glass);color:var(--tx);border-radius:8px;
  padding:3px 9px;font:inherit;font-size:11px;cursor:pointer}
.aglab button:hover{border-color:var(--acc);color:var(--acc)}
.refgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:7px}
.refgrid .a{position:relative;border-radius:12px;overflow:hidden;background:var(--card2);border:1px solid var(--gline);
  aspect-ratio:1/1;cursor:pointer}
.refgrid .a img,.refgrid .a video{width:100%;height:100%;object-fit:cover;display:block}
.refgrid .a .wv{width:100%;height:100%;display:grid;place-items:center;color:#5fd08a;font-size:24px;
  background:linear-gradient(135deg,rgba(95,208,138,.12),transparent)}
.refgrid .a .rl{position:absolute;top:6px;left:6px;font-size:9.5px;letter-spacing:.04em;padding:2px 7px;border-radius:7px;
  color:#fff;background:rgba(0,0,0,.6);border:0;font:inherit;font-size:9.5px;cursor:pointer;appearance:none;-webkit-appearance:none;
  padding-right:14px;text-transform:capitalize}
.refgrid .a.r-char .rl{background:rgba(232,181,99,.85);color:#141014}
.refgrid .a.r-loc .rl{background:rgba(176,123,224,.85)}
.refgrid .a.r-style .rl{background:rgba(95,208,138,.85);color:#0d1a12}
.refgrid .a.r-audio .rl{background:rgba(95,208,138,.85);color:#0d1a12}
.refgrid .a.r-first .rl,.refgrid .a.r-last .rl{background:rgba(95,160,232,.85)}
.refgrid .a .x{position:absolute;top:5px;right:5px;width:18px;height:18px;border-radius:50%;border:0;
  background:rgba(0,0,0,.65);color:#fff;font-size:10px;line-height:18px;padding:0;cursor:pointer}
.refgrid .a .nm{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(0,0,0,.75));
  color:#fff;font-size:9.5px;padding:12px 7px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.refgrid .a.add{display:grid;place-items:center;border-style:dashed;color:var(--dim2);font-size:24px;background:transparent}
.refgrid .a.add:hover{border-color:var(--acc);color:var(--acc)}
/* промпт: великий, з мініатюрами всередині */
.pbox{position:relative;background:var(--bg);border:1px solid var(--gline);border-radius:14px;padding:10px 11px 42px;min-height:150px}
.pbox:focus-within{border-color:rgba(232,181,99,.5)}
.pbox .pins{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.pbox .pins:empty{display:none}
.pin{display:inline-flex;align-items:center;gap:6px;background:var(--glass2);border:1px solid var(--gline);
  border-radius:9px;padding:3px 8px 3px 3px;font-size:11px;color:var(--tx);cursor:default}
.pin i{width:22px;height:22px;border-radius:6px;overflow:hidden;display:grid;place-items:center;font-style:normal;
  background:var(--card2);color:#5fd08a;font-size:11px;flex:none}
.pin i img{width:100%;height:100%;object-fit:cover}
.pin b{font-weight:600;color:var(--acc)}
.pin.r-loc b{color:#c9a4ec}.pin.r-style b,.pin.r-audio b{color:#5fd08a}.pin.r-first b,.pin.r-last b{color:#8fc0f0}
.pbox textarea{width:100%;background:transparent;border:0;color:var(--tx);font:inherit;font-size:13.5px;
  line-height:1.55;min-height:110px;resize:vertical;outline:none;padding:0}
.pbox .pfoot{position:absolute;left:10px;right:10px;bottom:8px;display:flex;align-items:center;gap:8px}
.pbox .pfoot button{border:0;background:transparent;color:var(--dim);cursor:pointer;font-size:14px;padding:3px 6px;border-radius:7px}
.pbox .pfoot button:hover{background:var(--glass2);color:var(--acc)}
.pbox .pfoot .cnt{margin-left:auto;font-size:10.5px;color:var(--dim2)}
.sugg{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.sugg button{border:1px solid var(--gline);background:var(--glass);color:var(--tx);border-radius:9px;
  padding:5px 10px;font:inherit;font-size:11.5px;cursor:pointer}
.sugg button:hover{border-color:var(--acc);color:var(--acc)}
.sugg button.pri{background:rgba(232,181,99,.14);border-color:rgba(232,181,99,.45);color:var(--acc)}
.agchat{margin-top:12px}
/* --- розкадровка --- */
.sb{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.sbc{background:var(--glass);border:1px solid var(--gline);border-radius:14px;overflow:hidden;cursor:pointer;position:relative}
.sbc:hover{border-color:var(--line2)}
.sbc.sel{border-color:rgba(232,181,99,.7);box-shadow:0 0 0 1px rgba(232,181,99,.3)}
.sbc .pv{position:relative;aspect-ratio:4/5;background:var(--card2)}
.sbc .pv img{width:100%;height:100%;object-fit:cover;display:block}
.sbc .no{position:absolute;top:7px;left:7px;width:22px;height:22px;border-radius:50%;background:var(--grad);
  color:#141014;font-size:11px;font-weight:700;display:grid;place-items:center}
.sbc .du{position:absolute;bottom:7px;left:7px;background:rgba(0,0,0,.7);border-radius:6px;padding:1px 7px;font-size:10.5px;color:#fff}
.sbc .pr{position:absolute;bottom:7px;right:7px;background:rgba(232,181,99,.9);border-radius:6px;padding:1px 7px;
  font-size:10.5px;color:#141014;font-weight:700}
.sbc .bd{padding:9px 10px 10px}
.sbc .t{font-size:12.5px;font-weight:600;margin-bottom:3px;outline:none;border-radius:4px}
.sbc .d{font-size:11px;color:var(--dim);line-height:1.4;max-height:2.8em;overflow:hidden}
.sbc .tools{position:absolute;top:6px;right:6px;display:flex;gap:3px;opacity:0;transition:opacity .12s}
.sbc:hover .tools{opacity:1}
.sbc .tools button{width:22px;height:22px;border-radius:6px;border:0;background:rgba(0,0,0,.72);color:#fff;font-size:12px;
  line-height:22px;padding:0;cursor:pointer}
.sbc .tools button:hover{background:rgba(232,181,99,.9);color:#141014}
.sbc .pv.busy::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(232,181,99,.35));animation:lsw 1.6s ease-in-out infinite}
.sbadd{display:grid;place-items:center;border:1px dashed var(--line2);border-radius:14px;color:var(--dim2);font-size:24px;
  cursor:pointer;min-height:180px}
.sbadd:hover{border-color:var(--acc);color:var(--acc)}
.sbtot{display:flex;align-items:center;gap:8px;padding:10px 4px 0;font-size:12.5px;color:var(--dim)}
.sbtot b{color:var(--acc);font-size:15px;margin-left:auto}
/* --- інспектор --- */
.insp label{display:block;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--dim);margin:11px 0 5px}
.insp input,.insp select,.insp textarea{width:100%;background:var(--bg);border:1px solid var(--gline);border-radius:10px;
  color:var(--tx);font:inherit;font-size:12.5px;padding:8px 10px;outline:none}
.insp textarea{min-height:76px;resize:vertical}
.insp .two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.insp .asset{display:flex;gap:8px;align-items:center;padding:6px;border-radius:10px;background:var(--glass);
  border:1px solid var(--gline);margin-bottom:6px}
.insp .asset i{width:36px;height:36px;border-radius:8px;overflow:hidden;background:var(--card2);flex:none;
  display:grid;place-items:center;font-style:normal;color:#5fd08a}
.insp .asset i img{width:100%;height:100%;object-fit:cover}
.insp .asset .n{font-size:11.5px;min-width:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.insp .asset .r{font-size:9.5px;color:var(--dim)}
.insp .cost{display:flex;align-items:center;font-size:12px;color:var(--dim);margin-top:12px}
.insp .cost b{margin-left:auto;font-size:15px;color:var(--tx)}
.insp .go{width:100%;margin-top:10px;border:0;border-radius:11px;padding:10px;font:inherit;font-weight:700;font-size:13px;
  cursor:pointer;background:var(--grad);color:#141014}
.insp .go2{width:100%;margin-top:7px;border:1px solid var(--gline);border-radius:11px;padding:9px;font:inherit;font-size:12.5px;
  cursor:pointer;background:var(--glass);color:var(--tx)}
.insp .go2:hover{border-color:var(--acc);color:var(--acc)}
.insp .empty{color:var(--dim2);font-size:12.5px;text-align:center;padding:40px 10px;line-height:1.5}
/* --- нижня панель --- */
.gbar{display:flex;align-items:stretch;gap:0;width:100%;min-width:0;flex-wrap:wrap}
.gbar .cell{display:flex;flex-direction:column;justify-content:center;padding:6px 16px;border-right:1px solid var(--gline);min-width:0}
.gbar .cell:last-of-type{border-right:0}
.gbar .cell .k{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--dim);margin-bottom:2px}
.gbar .cell select,.gbar .cell .v{background:transparent;border:0;color:var(--tx);font:inherit;font-size:13.5px;font-weight:600;
  outline:none;padding:0;cursor:pointer}
.gbar .cell .v{cursor:default}
.gbar .cell .v.acc{color:var(--acc)}
.gbar .go{margin-left:auto;flex:none;border:0;border-radius:13px;padding:0 26px;font:inherit;font-weight:700;font-size:15px;
  background:var(--grad);color:#141014;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:52px;white-space:nowrap}
.gbar .go:disabled{opacity:.5;cursor:default}
.gbar .go span{background:rgba(0,0,0,.16);border-radius:8px;padding:2px 9px;font-size:13px}
.gbar .go2{border:1px solid var(--gline);background:var(--glass);color:var(--tx);border-radius:13px;padding:0 16px;
  font:inherit;font-size:13px;cursor:pointer;margin-left:8px;white-space:nowrap}
.gbar .go2:hover{border-color:var(--acc);color:var(--acc)}
/* ================= SHELL v2 (за макетами) ================= */
.snav{width:196px;padding:16px 12px 14px;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(var(--blur));
  border-right:1px solid var(--gline)}
.top{left:196px;height:64px;padding:0 20px;background:var(--bg);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(var(--blur));border-bottom:1px solid var(--gline)}
main{margin:64px 0 0 196px;padding:14px 16px 20px;max-width:none}
.snav button{padding:10px 12px;border-radius:12px;font-size:13.4px}
.snav button.act{background:rgba(232,181,99,.13);color:var(--acc);box-shadow:inset 0 0 0 1px rgba(232,181,99,.35)}
.snav .sep{height:1px;background:var(--gline);margin:8px 6px}
/* заголовок сторінки в шапці */
.ptitle{display:flex;align-items:center;gap:11px;min-width:0}
.ptitle .ico{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:rgba(232,181,99,.14);color:var(--acc);font-size:15px;flex:none}
.ptitle h1{margin:0;font-size:17px;font-weight:700;letter-spacing:.01em;white-space:nowrap}
.ptitle .sub{font-size:11.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* капсули справа */
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--glass2);border:1px solid var(--gline);
  border-radius:999px;padding:6px 12px;font-size:12.5px;color:var(--tx);white-space:nowrap}
.pill b{font-weight:700}
.pill .ic{color:var(--acc)}
.pill.btn{cursor:pointer}
.pill.btn:hover{border-color:var(--acc)}
.pill .plus{width:20px;height:20px;border-radius:50%;background:var(--grad);color:#141014;display:grid;place-items:center;font-size:13px;font-weight:700;margin-left:2px}
.pill select{background:transparent;border:0;color:var(--tx);font:inherit;font-size:12.5px;padding:0;outline:none;cursor:pointer}
/* план у навігації */
.plan{margin-top:auto;background:var(--glass2);border:1px solid var(--gline);border-radius:14px;padding:11px 12px}
.plan .k{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--dim)}
.plan .v{font-size:19px;font-weight:700;color:var(--acc);margin:2px 0 6px}
.plan .bar{height:5px;border-radius:5px;background:var(--card2);overflow:hidden;margin-bottom:9px}
.plan .bar i{display:block;height:100%;background:var(--grad)}
.plan button{width:100%;border:1px solid var(--gline);background:var(--glass);color:var(--tx);border-radius:10px;padding:7px;font:inherit;font-size:12px;cursor:pointer}
.plan button:hover{border-color:var(--acc);color:var(--acc)}
.who{display:flex;align-items:center;gap:9px;padding:10px 6px 4px}
.who .av{width:30px;height:30px;border-radius:50%;background:var(--grad);color:#141014;display:grid;place-items:center;font-weight:700;font-size:12px}
.who .n{font-size:12.5px;font-weight:600;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.who .r{font-size:10.5px;color:var(--dim)}
/* оверлей-скло для решти вкладок */
main>.card,main .card{background:var(--glass);border-color:var(--gline);backdrop-filter:blur(var(--blur))}
/* Studio займає всю висоту під новою шапкою */
.st5{height:calc(100vh - 96px)}
@media(max-width:1250px){.st5{height:auto}}
/* ================= OCEAN — основна тема ================= */
/* Спокійна синьо-фіолетова гама інтерфейсу. Червоне живе тільки у знаку —
   так бренд лишається впізнаваним, але не тисне під час роботи. */
:root{
  --bg:#0a0e14; --bg2:#0e131b; --panel:#111823; --card:rgba(255,255,255,.035); --card2:rgba(255,255,255,.065);
  --line:rgba(255,255,255,.07); --line2:rgba(255,255,255,.14);
  --tx:#eef3f8; --dim:#8d9aab; --dim2:#5c6878;
  --acc:#3fb6cd; --acc2:#7b6fc4; --grad:linear-gradient(100deg,#2f9fb8 0%,#3d6fb4 52%,#6a5aa6 100%);
  --glow:rgba(63,182,205,.09); --ok:#3ddc97; --warn:#ffb454;
  --glass:rgba(255,255,255,.04);--glass2:rgba(255,255,255,.07);--gline:rgba(255,255,255,.09);--blur:16px;
}
body[data-theme="light"]{--bg:#eef3f7;--bg2:#ffffff;--panel:#f7fafc;--card:rgba(10,30,50,.04);--card2:rgba(10,30,50,.07);
  --line:rgba(10,30,50,.09);--line2:rgba(10,30,50,.16);--tx:#0f1a26;--dim:#4f5f72;--dim2:#8593a4;
  --acc:#0aa9c9;--acc2:#6d4cf0;--glow:rgba(10,169,201,.12);--ok:#1f9d6b;--warn:#c9711f;
  --glass:rgba(255,255,255,.66);--glass2:rgba(255,255,255,.88);--gline:rgba(10,30,50,.10)}
body:before{background:
  radial-gradient(38% 34% at 12% 8%,rgba(63,182,205,.10),transparent 62%),
  radial-gradient(34% 30% at 88% 92%,rgba(123,111,196,.10),transparent 62%),
  radial-gradient(28% 26% at 70% 10%,rgba(61,111,180,.06),transparent 60%)}
body[data-theme="light"]:before{opacity:.55}
.btn,.stgo,.gbar .go,.stbtn.pri,.insp .go{color:#fff}
.snav button.act{background:rgba(34,200,230,.12);color:var(--acc);box-shadow:inset 0 0 0 1px rgba(34,200,230,.35)}
.snav button.act::before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:3px;background:var(--grad)}
.snav button{position:relative}
.thsw .knob{color:#fff}
.pill .plus{color:#fff}
.sbc .no{color:#fff}
.hs.on{border-color:rgba(34,200,230,.5)}
.sbc.sel{border-color:rgba(34,200,230,.7);box-shadow:0 0 0 1px rgba(34,200,230,.3)}
.refgrid .a.r-char .rl{background:rgba(59,140,255,.9);color:#fff}
.refgrid .a.r-loc .rl{background:rgba(124,92,255,.9);color:#fff}
.refgrid .a.r-style .rl,.refgrid .a.r-audio .rl{background:rgba(61,220,151,.9);color:#062b1c}
.pin b{color:var(--acc)}.pin.r-loc b{color:#a48cff}.pin.r-style b,.pin.r-audio b{color:var(--ok)}
.brand b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
/* ================= LAYOUT — за Higgsfield ================= */
.st5{grid-template-columns:400px minmax(420px,1fr) 272px !important;grid-template-rows:minmax(0,1fr) auto}
@media(max-width:1500px){.st5{grid-template-columns:360px minmax(380px,1fr) 250px !important}}
@media(max-width:1200px){.st5{grid-template-columns:340px minmax(320px,1fr) !important}.st5 .z-insp{display:none}}
.st5 .z-hist{display:none}                              /* історія переїхала в ліву навігацію */
/* робоче вікно: референси сіткою + великий промпт + рядок параметрів + Generate */
.wk .refgrid{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:6px;width:100% !important;max-width:none !important;justify-content:stretch !important}
.wk .refgrid .a{aspect-ratio:1/1;border-radius:9px;width:auto;min-width:0}
.wk .refgrid .a .rl{top:4px;left:4px;font-size:9px;padding:1px 6px 1px 6px}
.wk .refgrid .a .nm{font-size:9px;padding:10px 6px 4px}
.wk .cnts{display:flex;gap:10px;font-size:11px;color:var(--dim);margin:0 0 8px}
.wk .cnts b{color:var(--tx);font-weight:600}
.wk .pbox{min-height:210px;padding-bottom:40px}
.wk .pbox textarea{min-height:160px}
.wk .prow{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:10px}
.wk .prow .pc{display:inline-flex;align-items:center;gap:5px;background:var(--glass2);border:1px solid var(--gline);border-radius:9px;
  padding:5px 9px;font-size:11.5px;color:var(--tx);cursor:pointer;white-space:nowrap}
.wk .prow .pc:hover{border-color:var(--acc)}
.wk .prow .pc select{background:transparent;border:0;color:var(--tx);font:inherit;font-size:11.5px;outline:none;padding:0;cursor:pointer}
.wk .prow .pc i{font-style:normal;color:var(--dim);font-size:11px}
.wk .gorow{display:flex;gap:8px;align-items:center;margin-top:10px}
.wk .gorow .mdl{flex:1;display:flex;align-items:center;gap:7px;background:var(--glass2);border:1px solid var(--gline);border-radius:11px;padding:8px 11px;font-size:12.5px;min-width:0}
.wk .gorow .mdl select{background:transparent;border:0;color:var(--tx);font:inherit;font-size:12.5px;font-weight:600;outline:none;padding:0;cursor:pointer;min-width:0;max-width:100%}
.wk .gorow .stgo{width:auto;margin:0;padding:10px 18px;border-radius:11px;font-size:13.5px}
/* великий результат */
.res .big{position:relative;background:#000;border-radius:14px;overflow:hidden;aspect-ratio:16/9;display:grid;place-items:center;border:1px solid var(--gline)}
.res .big video,.res .big img{width:100%;height:100%;object-fit:contain;display:block;background:#000}
.res .big .ph{color:var(--dim2);font-size:13px;text-align:center;padding:30px;line-height:1.6}
.res .big .cap{position:absolute;left:0;right:0;bottom:0;padding:24px 14px 10px;background:linear-gradient(transparent,rgba(0,0,0,.75));color:#fff;font-size:12px;display:flex;gap:10px;align-items:flex-end}
.res .big .cap b{font-size:13px}
.res .big .cap .sp{flex:1}
.res .big .cap .tag{background:rgba(255,255,255,.14);border-radius:7px;padding:2px 8px;font-size:10.5px}
.res .acts{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 12px}
.res .acts button{border:1px solid var(--gline);background:var(--glass);color:var(--tx);border-radius:9px;padding:6px 11px;font:inherit;font-size:12px;cursor:pointer}
.res .acts button:hover{border-color:var(--acc);color:var(--acc)}
.res .acts .sp{flex:1}
.res .filt{display:flex;gap:6px;margin-bottom:10px}
.res .filt b{padding:5px 11px;border-radius:999px;font-size:11.5px;color:var(--dim);cursor:pointer;border:1px solid transparent}
.res .filt b.on{background:var(--glass2);border-color:var(--gline);color:var(--tx)}
/* стрічка сцен під результатом */
.strip{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 8px}
.strip .sc{flex:none;width:118px;background:var(--glass);border:1px solid var(--gline);border-radius:11px;overflow:hidden;cursor:pointer;position:relative}
.strip .sc:hover{border-color:var(--line2)}
.strip .sc.sel{border-color:rgba(34,200,230,.75);box-shadow:0 0 0 1px rgba(34,200,230,.3)}
.strip .sc .pv{aspect-ratio:1/1;background:var(--card2);position:relative}
.strip .sc .pv img{width:100%;height:100%;object-fit:cover;display:block}
.strip .sc .no{position:absolute;top:5px;left:5px;width:18px;height:18px;border-radius:50%;background:var(--grad);color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center}
.strip .sc .du{position:absolute;bottom:5px;left:5px;background:rgba(0,0,0,.7);border-radius:5px;padding:0 6px;font-size:10px;color:#fff}
.strip .sc .pr{position:absolute;bottom:5px;right:5px;background:rgba(34,200,230,.9);border-radius:5px;padding:0 6px;font-size:10px;color:#04222b;font-weight:700}
.strip .sc .t{font-size:10.5px;padding:5px 7px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.strip .sc .pv.busy::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(34,200,230,.4));animation:lsw 1.6s ease-in-out infinite}
.strip .add{flex:none;width:64px;display:grid;place-items:center;border:1px dashed var(--line2);border-radius:11px;color:var(--dim2);font-size:22px;cursor:pointer}
.strip .add:hover{border-color:var(--acc);color:var(--acc)}
/* останні результати (задачі) */
.rlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px;margin-top:8px}
.rlist .it{background:var(--glass);border:1px solid var(--gline);border-radius:11px;overflow:hidden;cursor:pointer}
.rlist .it .pv{aspect-ratio:16/9;background:#000;position:relative;display:grid;place-items:center;color:var(--dim2);overflow:hidden}
.rlist .it .pv video,.rlist .it .pv img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.rlist .it .pv .st{position:absolute;top:5px;left:5px;background:rgba(0,0,0,.7);border-radius:6px;padding:1px 7px;font-size:10px;color:#fff}
.rlist .it .pv .st.ok{background:rgba(61,220,151,.9);color:#062b1c}
.rlist .it .pv .st.bad{background:rgba(255,100,100,.9)}
.rlist .it .t{font-size:10.5px;color:var(--dim);padding:5px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* сесії в лівій навігації */
.navsess{margin:8px 0 6px;max-height:34vh;overflow-y:auto;padding-right:2px}
.navsess .k{font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--dim2);padding:8px 10px 4px;display:flex;align-items:center}
.navsess .k .sp{flex:1}
.navsess .k button{border:0;background:transparent;color:var(--acc);cursor:pointer;font-size:14px;line-height:1;padding:0 2px}
.navsess .r{display:flex;gap:8px;align-items:center;padding:6px 8px;border-radius:9px;cursor:pointer;color:var(--dim);font-size:12px}
.navsess .r:hover{background:var(--card);color:var(--tx)}
.navsess .r.on{background:rgba(34,200,230,.10);color:var(--tx)}
.navsess .r .th{width:22px;height:22px;border-radius:6px;overflow:hidden;background:var(--card2);flex:none;display:grid;place-items:center;font-size:10px;color:var(--acc)}
.navsess .r .th img{width:100%;height:100%;object-fit:cover}
.navsess .r .t{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
/* ================= POLISH ================= */
/* 1. шапка: логотип | риска | заголовок */
.top .ptitle{border-left:1px solid var(--gline);padding-left:16px;margin-left:2px}
/* 2. перемикач Dark/Light словами */
.thsw2{display:inline-flex;background:var(--glass2);border:1px solid var(--gline);border-radius:999px;padding:3px;margin-right:8px;cursor:pointer}
.thsw2 b{padding:5px 12px;border-radius:999px;font-size:12px;font-weight:600;color:var(--dim);display:inline-flex;align-items:center;gap:6px}
.thsw2 b.on{background:var(--grad);color:#fff}
/* 3. капсули з іконками */
.pill .ic{width:16px;height:16px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-size:9px;font-weight:700}
.iconbtn{width:34px;height:34px;border-radius:50%;border:1px solid var(--gline);background:var(--glass2);color:var(--dim);display:grid;place-items:center;cursor:pointer;font-size:14px}
.iconbtn:hover{color:var(--tx);border-color:var(--acc)}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-weight:700;font-size:12px;cursor:pointer}
/* 4. навігація: Upgrade-блок і Collapse */
.plan{border:1px solid rgba(34,200,230,.35);background:linear-gradient(160deg,rgba(34,200,230,.08),rgba(124,92,255,.08))}
.plan .k{display:flex;align-items:center;gap:6px}
.plan .k::before{content:"◈";color:var(--acc)}
.plan button{border-color:rgba(34,200,230,.4);color:var(--acc)}
.navcol{border:1px solid var(--gline);background:var(--glass);border-radius:11px;padding:8px 10px;font-size:12px;color:var(--dim);cursor:pointer;display:flex;align-items:center;gap:8px;margin-top:8px}
.navcol:hover{color:var(--tx)}
/* 5. референси: назва файлу поверх, тип внизу */
.wk .refgrid .a .rl{top:auto;bottom:5px;left:5px;right:auto}
.wk .refgrid .a .nm{top:0;bottom:auto;background:linear-gradient(rgba(0,0,0,.75),transparent);padding:5px 7px 12px;font-size:9.5px}
.wk .refgrid .a .x{top:4px;right:4px}
/* 6. промпт: бірюзова рамка, кнопки знизу */
.wk .pbox{border-color:rgba(34,200,230,.45);box-shadow:0 0 0 1px rgba(34,200,230,.10),0 0 24px rgba(34,200,230,.08)}
.wk .pbox:focus-within{border-color:rgba(34,200,230,.8)}
.wk .pbox .pfoot button.txt{font-size:11.5px;padding:4px 9px;border:1px solid var(--gline);background:var(--glass);color:var(--tx);border-radius:8px}
.wk .pbox .pfoot button.txt:hover{border-color:var(--acc);color:var(--acc)}
/* 7. AI-підказки з іконками */
.wk .sugg2{margin-top:10px}
.wk .sugg2 .k{font-size:11.5px;color:var(--dim);margin-bottom:6px;font-weight:600}
.wk .sugg2 .row{display:flex;gap:6px;flex-wrap:wrap}
.wk .sugg2 button{border:1px solid var(--gline);background:var(--glass);color:var(--tx);border-radius:9px;padding:6px 10px;font:inherit;font-size:11.5px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.wk .sugg2 button i{font-style:normal;color:var(--acc);font-size:11px}
.wk .sugg2 button:hover{border-color:var(--acc)}
.wk .sugg2 button.rf{width:32px;justify-content:center;padding:6px 0}
/* 8. інспектор: Selected Scene з мініатюрою */
.insp .selsc{display:flex;gap:10px;align-items:center;background:var(--glass2);border:1px solid var(--gline);border-radius:12px;padding:8px;margin-bottom:6px}
.insp .selsc .th{width:64px;height:48px;border-radius:8px;overflow:hidden;background:var(--card2);flex:none;position:relative}
.insp .selsc .th img{width:100%;height:100%;object-fit:cover}
.insp .selsc .th .no{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--grad);color:#fff;font-size:9px;font-weight:700;display:grid;place-items:center}
.insp .selsc .i{min-width:0}
.insp .selsc .t{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.insp .selsc .m{font-size:10.5px;color:var(--dim);display:flex;gap:8px;margin-top:2px}
.insp .selsc .m b{color:var(--acc);font-weight:600}
.insp .acts2{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.insp .acts2 button{flex:1;border:1px solid var(--gline);background:var(--glass);color:var(--tx);border-radius:9px;padding:7px 8px;font:inherit;font-size:11.5px;cursor:pointer;white-space:nowrap}
.insp .acts2 button:hover{border-color:var(--acc);color:var(--acc)}
.insp .acts2 button.del:hover{border-color:#ff6b6b;color:#ff6b6b}
/* 9. нижня панель: капсули з іконкою і підписом */
.gbar{gap:8px;padding:6px 8px}
.gbar .cell{border:1px solid var(--gline);background:var(--glass);border-radius:12px;padding:7px 12px;border-right:1px solid var(--gline) !important;flex:1;min-width:120px}
.gbar .cell .k{display:flex;align-items:center;gap:6px}
.gbar .cell .k::before{content:attr(data-ic);color:var(--acc);font-size:12px}
.gbar .go{border-radius:13px;min-height:50px;box-shadow:0 5px 16px rgba(61,111,180,.16)}
.gbar .go small{display:block;font-size:10px;font-weight:400;opacity:.85;margin-top:1px}
body.navmini .snav{width:64px;padding:16px 8px}body.navmini .snav button span:last-child,body.navmini .brand span,body.navmini .navsess,body.navmini .plan,body.navmini .who div,body.navmini .navcol{display:none}body.navmini .top{left:64px}body.navmini main{margin-left:64px}
/* ================= PROGRESS ================= */
.genbox{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  background:radial-gradient(60% 60% at 50% 40%,rgba(34,200,230,.10),transparent 70%),rgba(6,10,16,.55);backdrop-filter:blur(3px)}
.genbox .ring{width:74px;height:74px;border-radius:50%;position:relative;
  background:conic-gradient(var(--acc) calc(var(--p,0)*1%),rgba(255,255,255,.08) 0);
  display:grid;place-items:center;box-shadow:0 0 30px rgba(34,200,230,.25)}
.genbox .ring::before{content:"";position:absolute;inset:6px;border-radius:50%;background:#0a0e14}
.genbox .ring b{position:relative;font-size:15px;font-weight:700;color:#fff}
.genbox .ring i{position:absolute;inset:-4px;border-radius:50%;border:2px solid transparent;border-top-color:rgba(255,255,255,.35);animation:spin 1.4s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.genbox .st{font-size:13.5px;font-weight:600;color:#fff;text-align:center}
.genbox .st small{display:block;font-size:11.5px;color:var(--dim);font-weight:400;margin-top:3px}
.genbox .steps{display:flex;gap:6px;align-items:center;font-size:10.5px;color:var(--dim2)}
.genbox .steps b{font-weight:600;color:var(--dim)}
.genbox .steps b.on{color:var(--acc)}
.genbox .steps b.ok{color:var(--ok)}
.genbox .steps em{font-style:normal;opacity:.5}
.genbox .bar{width:min(340px,70%);height:6px;border-radius:6px;background:rgba(255,255,255,.08);overflow:hidden;position:relative}
.genbox .bar i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--p,0)*1%);background:var(--grad);border-radius:6px;transition:width .9s linear}
.genbox .bar i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);animation:shine 1.6s ease-in-out infinite}
@keyframes shine{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.genbox .eta{font-size:11.5px;color:var(--dim)}
.genbox .eta b{color:#fff;font-weight:600}
.genbox .tip{font-size:11px;color:var(--dim2);max-width:360px;text-align:center;line-height:1.5}
/* міні-прогрес на картках останніх результатів і стрічці */
.rlist .it .pv .mbar,.strip .sc .pv .mbar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.1)}
.rlist .it .pv .mbar i,.strip .sc .pv .mbar i{display:block;height:100%;width:calc(var(--p,0)*1%);background:var(--grad);transition:width .9s linear}
/* ================= REFS v3: маленькі мініатюри ================= */
.wk .refgrid{display:flex !important;flex-wrap:wrap;gap:6px;grid-template-columns:none !important;width:auto !important}
.wk .refgrid .a{width:64px;height:64px;aspect-ratio:auto;border-radius:9px;flex:none}
.wk .refgrid .a .rl{top:auto;bottom:3px;left:3px;right:3px;font-size:8.5px;padding:1px 4px;text-align:center;
  border-radius:5px;padding-right:4px;background:rgba(0,0,0,.72)}
.wk .refgrid .a .nm{display:none}
.wk .refgrid .a .x{top:2px;right:2px;width:16px;height:16px;font-size:9px;line-height:16px;opacity:0;transition:opacity .12s}
.wk .refgrid .a:hover .x{opacity:1}
.wk .refgrid .a .wv{font-size:18px}
.wk .refgrid .a.add{width:64px;height:64px;font-size:20px}
.wk .cnts{margin:0 0 6px}
/* промпт великий */
.wk .pbox{min-height:260px;padding-bottom:40px}
.wk .pbox textarea{min-height:210px;font-size:14px}
.wk .pbox .pins .pin{padding:2px 7px 2px 2px;font-size:10.5px}
.wk .pbox .pins .pin i{width:20px;height:20px}
/* рядок параметрів стиснутий */
.wk .prow{gap:5px;margin-top:8px}
.wk .prow .pc{padding:4px 8px;font-size:11px;border-radius:8px}
.wk .prow .pc input[type=number]{width:44px;background:transparent;border:0;color:var(--tx);font:inherit;font-size:11px;
  font-weight:600;outline:none;padding:0;text-align:right;-moz-appearance:textfield}
.wk .prow .pc input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}
.wk .sugg2{margin-top:8px}
.wk .sugg2 button{padding:5px 9px;font-size:11px}
.wk .gorow{margin-top:8px}
/* ================= IMAGE v2 ================= */
.imgwrap{display:grid;grid-template-columns:400px minmax(0,1fr);gap:12px;height:calc(100vh - 96px);min-height:560px}
@media(max-width:1200px){.imgwrap{grid-template-columns:340px minmax(0,1fr)}}
@media(max-width:900px){.imgwrap{grid-template-columns:1fr;height:auto}}
.imgwrap .z{background:var(--glass);border:1px solid var(--gline);border-radius:18px;
  backdrop-filter:blur(var(--blur));display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}
.imgwrap .zh{display:flex;align-items:center;gap:9px;padding:13px 15px 10px;border-bottom:1px solid var(--gline)}
.imgwrap .zh h2{margin:0;font-size:15px}
.imgwrap .zh .n{font-size:11px;color:var(--dim)}
.imgwrap .zh .sp{flex:1}
.imgwrap .zb{flex:1;overflow-y:auto;padding:12px 13px;min-height:0}
.imgwrap .card{background:transparent;border:0;padding:0;backdrop-filter:none}
.imgwrap .card h2{display:none}
.imgwrap textarea#prompt{min-height:170px;font-size:13.5px;border-color:rgba(34,200,230,.4);
  box-shadow:0 0 0 1px rgba(34,200,230,.08),0 0 20px rgba(34,200,230,.06)}
.imgwrap .chips{gap:5px}.imgwrap .chip{padding:4px 8px;font-size:11px}
.imgwrap .field label{font-size:10.5px}
.imgwrap .row{gap:6px}
.imgwrap select,.imgwrap input[type=number]{padding:6px 9px;font-size:12px}
.imgwrap .btn{padding:10px 18px;font-size:13px}
.imgwrap .attgrid{gap:6px}
.imgwrap .att{width:58px}
.imgwrap .att .im{aspect-ratio:1/1}
.imgwrap .apo{margin-top:8px}
/* результат */
.imgres{display:grid;gap:10px;align-content:start}
.imgres.n1{grid-template-columns:1fr}
.imgres.n2{grid-template-columns:1fr 1fr}
.imgres.n4,.imgres.n3{grid-template-columns:1fr 1fr}
.imgres.n6{grid-template-columns:repeat(3,1fr)}
.imgres .cell{position:relative;border-radius:14px;overflow:hidden;background:#000;border:1px solid var(--gline);
  aspect-ratio:var(--ar,9/16);max-height:calc(100vh - 220px);cursor:pointer}
.imgres.n1 .cell{aspect-ratio:auto;max-height:calc(100vh - 200px);height:calc(100vh - 200px)}
.imgres .cell img{width:100%;height:100%;object-fit:contain;display:block;background:#000;
  animation:imgin .5s ease both}
@keyframes imgin{from{opacity:0;filter:blur(10px)}to{opacity:1;filter:blur(0)}}
/* заготовка: синя, розмита, «проявляється» */
.imgres .cell.wait{background:
  radial-gradient(60% 55% at 45% 40%,rgba(34,200,230,.28),transparent 70%),
  radial-gradient(45% 45% at 80% 80%,rgba(124,92,255,.22),transparent 70%),
  linear-gradient(160deg,#0b1a2a,#0e1420)}
.imgres .cell.wait::before{content:"";position:absolute;inset:-30%;
  background:conic-gradient(from 0deg,transparent 0 60%,rgba(34,200,230,.22) 75%,transparent 90%);
  animation:sweep 2.6s linear infinite;filter:blur(18px)}
@keyframes sweep{to{transform:rotate(360deg)}}
.imgres .cell.wait::after{content:"";position:absolute;inset:0;backdrop-filter:blur(2px)}
.imgres .cell.wait .lbl{position:absolute;left:0;right:0;bottom:0;padding:22px 12px 10px;font-size:11.5px;color:#fff;
  background:linear-gradient(transparent,rgba(0,0,0,.6));z-index:1;display:flex;align-items:center;gap:8px}
.imgres .cell.wait .lbl i{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.35);
  border-top-color:#fff;animation:spin 1s linear infinite;font-style:normal;flex:none}
.imgres .cell.wait .lbl b{font-weight:600}
.imgres .cell.wait .lbl .no{margin-left:auto;opacity:.6}
.imgres .cell.ref img{opacity:.22;filter:blur(6px) saturate(.4)}
.imgres .cell.bad{background:#1a0d0d}
.imgres .cell.bad .lbl{color:#ffb4b4}
.imgres .cell .dl{position:absolute;top:8px;right:8px;background:rgba(0,0,0,.6);color:#fff;border:0;border-radius:8px;
  padding:4px 9px;font-size:11px;cursor:pointer;opacity:0;transition:opacity .12s}
.imgres .cell:hover .dl{opacity:1}
/* ================= IMAGE drawer ================= */
.imgwrap .z{position:relative}
.imgwrap .z .zb,.imgwrap .z .zh{transition:margin-right .28s cubic-bezier(.4,0,.2,1)}
.imgwrap .z.dopen .zb,.imgwrap .z.dopen .zh{margin-right:300px}
.imgdrawer{position:absolute;top:0;right:0;bottom:0;width:300px;background:#0d1320;
  background:color-mix(in srgb,var(--bg,#0d1320) 88%,#fff 0%);
  border-left:1px solid var(--gline);backdrop-filter:blur(18px);transform:translateX(102%);
  transition:transform .28s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;z-index:5;overflow:hidden}
.imgdrawer.on{transform:translateX(0)}
.imgdrawer .dh{display:flex;align-items:center;gap:8px;padding:11px 12px 9px;border-bottom:1px solid var(--gline);font-size:12.5px}
.imgdrawer .dh b{font-weight:600}
.imgdrawer .dh .sp{flex:1}
.imgdrawer .dh .x{background:transparent;border:1px solid var(--gline);color:var(--fg);border-radius:8px;width:26px;height:26px;cursor:pointer;font-size:12px}
.imgdrawer .db{flex:1;overflow-y:auto;padding:12px}
.imgdrawer .prev{width:100%;max-height:36vh;object-fit:contain;border-radius:12px;background:#000;display:block;cursor:zoom-in}
.imgdrawer .meta{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0 8px}
.imgdrawer .meta span{font-size:10.5px;color:var(--dim);border:1px solid var(--gline);border-radius:20px;padding:2px 8px}
.imgdrawer .pr{font-size:12px;line-height:1.5;color:var(--dim);max-height:120px;overflow-y:auto;background:rgba(255,255,255,.03);
  border:1px solid var(--gline);border-radius:10px;padding:8px 10px;white-space:pre-wrap;word-break:break-word}
.imgdrawer .acts{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px}
.imgdrawer .acts button{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.04);border:1px solid var(--gline);
  color:var(--fg);border-radius:10px;padding:8px 10px;font-size:12px;cursor:pointer;text-align:left;transition:.15s}
.imgdrawer .acts button:hover{border-color:var(--acc);background:rgba(34,200,230,.08)}
.imgdrawer .acts button .i{font-size:14px;width:18px;text-align:center;flex:none}
.imgdrawer .acts button.wide{grid-column:1/-1;background:var(--grad);border:0;color:#fff;font-weight:600;justify-content:center}
.imgdrawer .acts button.wide:hover{filter:brightness(1.08)}
.imgdrawer .acts button.fav.on{border-color:var(--warn);color:var(--warn)}
.imgdrawer .acts button.danger:hover{border-color:#ff6b6b;color:#ff9c9c;background:rgba(255,80,80,.08)}
.imgres .cell.sel{outline:2px solid var(--acc);outline-offset:-2px;box-shadow:0 0 0 4px rgba(34,200,230,.18)}
.imgres .cell .fv{position:absolute;top:8px;left:8px;font-size:13px;color:var(--warn);text-shadow:0 1px 4px #000;display:none}
.imgres .cell.isfav .fv{display:block}
body[data-theme=light] .imgdrawer{background:#f6f8fb}
/* щоб усі 4/6 вміщались без прокрутки: висота від екрана, ширина — з пропорції */
.imgres .cell{height:var(--ch,calc(100vh - 220px));width:auto;max-width:100%;max-height:none;justify-self:center}
.imgres.n1 .cell{--ch:calc(100vh - 200px);height:var(--ch);aspect-ratio:var(--ar,9/16)}
.imgres.n2 .cell{--ch:calc(100vh - 220px)}
.imgres.n4 .cell,.imgres.n3 .cell,.imgres.n6 .cell{--ch:calc((100vh - 240px)/2)}
.imgres .cell img{width:100%;height:100%}
/* ===== заготовки v3: у тіні, сіро-синій з відтінком кнопки, прозора рамка ===== */
.imgres .cell.wait{background:
  radial-gradient(70% 60% at 30% 25%,rgba(34,200,230,.16),transparent 70%),
  radial-gradient(60% 55% at 80% 85%,rgba(124,92,255,.16),transparent 70%),
  linear-gradient(160deg,#151b28,#0f1420 60%,#121626);
  border:1px solid rgba(120,160,220,.22);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),inset 0 0 60px rgba(0,0,0,.45),0 0 0 3px rgba(34,200,230,.06),0 8px 30px rgba(0,0,0,.35)}
.imgres .cell.wait::before{background:conic-gradient(from 0deg,transparent 0 62%,rgba(34,200,230,.13) 74%,rgba(124,92,255,.10) 82%,transparent 90%);filter:blur(22px)}
.imgres .cell.wait::after{backdrop-filter:blur(3px) brightness(.85)}
.imgres .cell.wait .lbl{color:rgba(230,238,255,.85)}
.imgres .cell.ref img{opacity:.14;filter:blur(8px) saturate(.3) brightness(.7)}
/* наведення — збільшення з підсвіткою, як картки */
.imgres .cell{transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s,outline-color .2s;will-change:transform}
.imgres .cell:not(.wait):hover{transform:scale(1.04);z-index:3;box-shadow:0 18px 50px rgba(0,0,0,.55),0 0 0 1px rgba(34,200,230,.35),0 0 32px rgba(34,200,230,.18)}
.imgres.n1 .cell:not(.wait):hover{transform:scale(1.015)}
.imgres{padding:6px;justify-content:center;column-gap:14px}
.imgres.n2{grid-template-columns:repeat(2,max-content)}
.imgres.n4,.imgres.n3{grid-template-columns:repeat(2,max-content)}
.imgres.n6{grid-template-columns:repeat(3,max-content)}
.imgres.n1{grid-template-columns:max-content}
/* гортання в панелі */
.imgdrawer .pv{position:relative}
.imgdrawer .pv .nv{position:absolute;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.2);
  background:rgba(0,0,0,.55);color:#fff;font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:.75}
.imgdrawer .pv .nv:hover{opacity:1;border-color:var(--acc)}
.imgdrawer .pv .nv.p{left:6px}.imgdrawer .pv .nv.n{right:6px}
.imgdrawer .pv .nv:disabled{opacity:.2;cursor:default}
.imgdrawer .dh .k{font-size:10px;color:var(--dim);border:1px solid var(--gline);border-radius:5px;padding:1px 5px}
.imgempty{color:var(--dim2);font-size:13px;text-align:center;padding:60px 20px;line-height:1.6}
.imgtop{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:12px;color:var(--dim)}
.imgtop b{color:var(--acc)}
.imgtop .sp{flex:1}

/* --- підняти службові кнопки над рядком дій (має бути останнім) --- */
.acard .zoomb{bottom:52px!important}
.acard .dur{bottom:50px!important}
.acard .pv{top:calc(50% - 22px)}

/* ================= ШИРОКА ПАНЕЛЬ ПРОМТА ================= */
.imgwrap{grid-template-columns:minmax(560px,44%) minmax(0,1fr) !important}
.imgwrap textarea#prompt{min-height:300px !important;font-size:14.5px !important;line-height:1.6 !important}
.st5{grid-template-columns:minmax(470px,34%) minmax(430px,1fr) 250px !important}
.wk .pbox{min-height:360px !important;padding-bottom:44px !important}
.wk .pbox textarea{min-height:300px !important;font-size:14.5px !important;line-height:1.6 !important}
#stPrompt{min-height:320px !important;font-size:14.5px !important;line-height:1.6 !important}
.vwrap textarea#vprompt{min-height:230px !important;font-size:14.5px !important;line-height:1.6 !important}
@media(max-width:1500px){
  .imgwrap{grid-template-columns:minmax(480px,46%) minmax(0,1fr) !important}
  .st5{grid-template-columns:minmax(420px,36%) minmax(380px,1fr) 232px !important}
  .wk .pbox{min-height:320px !important}.wk .pbox textarea{min-height:262px !important}
}
@media(max-width:1200px){
  .imgwrap{grid-template-columns:minmax(420px,50%) minmax(0,1fr) !important}
  .st5{grid-template-columns:minmax(380px,40%) minmax(340px,1fr) !important}
  .st5 .z-insp{display:none}
}
@media(max-width:960px){
  .imgwrap{grid-template-columns:1fr !important;height:auto !important}
  .st5{grid-template-columns:1fr !important;height:auto !important}
  .wk .pbox{min-height:260px !important}.wk .pbox textarea{min-height:200px !important}
}

/* ================= НОВИНИ: радар можливостей ================= */
.nbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:0 0 14px}
.nbar .sp{flex:1}
.nsrc{font-size:11px;color:var(--dim2)}
.nchip{border:1px solid var(--gline);background:var(--glass);color:var(--dim);border-radius:999px;
  padding:6px 13px;font:inherit;font-size:12.5px;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:6px}
.nchip:hover{border-color:var(--line2);color:var(--tx)}
.nchip.on{background:var(--grad);color:#0d0d10;border-color:transparent;font-weight:600}
.nchip i{font-style:normal;background:#f0b23c;color:#231703;border-radius:999px;
  min-width:17px;height:17px;display:inline-flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:700}
.nchip.on i{background:rgba(0,0,0,.28);color:#fff}
.ngrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(430px,1fr));gap:12px;align-items:start}
@media(max-width:980px){.ngrid{grid-template-columns:1fr}}
.ncard{background:var(--glass);border:1px solid var(--gline);border-left:3px solid var(--nc);
  border-radius:14px;padding:13px 15px 14px;transition:.15s}
.ncard:hover{border-color:var(--line2);border-left-color:var(--nc)}
.ncard .nh{display:flex;align-items:center;gap:9px;cursor:pointer;flex-wrap:wrap}
.ncard .ntag{font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:var(--nc);
  border:1px solid var(--nc);border-radius:5px;padding:1px 6px;opacity:.9;white-space:nowrap}
.ncard .nt{font-size:14.2px;font-weight:600;flex:1;min-width:180px;line-height:1.35}
.ncard .nd{font-size:11px;color:var(--dim2);white-space:nowrap}
.ncard .nar{color:var(--dim2);font-size:12px;width:14px;text-align:center}
.ndl{font-size:10.5px;border-radius:999px;padding:2px 8px;background:rgba(111,211,165,.14);color:#6fd3a5;white-space:nowrap}
.ndl.hot{background:rgba(240,178,60,.16);color:#f0b23c}
.ncard .ns{color:var(--dim);font-size:12.8px;line-height:1.6;margin-top:7px}
.ncard .nb{margin-top:10px;border-top:1px solid var(--gline);padding-top:10px}
.ncard .nb ul{margin:0;padding-left:17px}
.ncard .nb li{color:var(--dim);font-size:12.5px;line-height:1.7;margin-bottom:4px}
.ncard .nimp{margin-top:9px;background:var(--bg2);border-radius:9px;padding:8px 11px;
  font-size:12.4px;line-height:1.6;color:var(--tx)}
.ncard .nimp b{color:var(--nc)}
.nlogwrap{margin-top:26px;background:var(--glass);border:1px solid var(--gline);border-radius:14px;padding:15px 18px 6px}
.nlogh{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--dim2);margin-bottom:12px}


.msale{font-size:10.5px;background:rgba(240,178,60,.16);color:#f0b23c;border-radius:999px;padding:2px 9px;white-space:nowrap;margin-left:8px}

/* ---- велике візуальне вікно під референси ---- */
.imgwrap .refgrid,.wk .refgrid{min-height:150px}
.dropbig{position:relative;border:1.5px dashed rgba(120,160,220,.28);border-radius:16px;
  background:radial-gradient(70% 60% at 30% 20%,rgba(34,200,230,.06),transparent 70%),var(--bg2);
  padding:12px;transition:.18s}
.dropbig.over{border-color:var(--acc);background:radial-gradient(70% 60% at 30% 20%,rgba(34,200,230,.16),transparent 70%),var(--bg2)}
.dropbig .dhint{text-align:center;color:var(--dim2);font-size:12px;padding:26px 8px;line-height:1.7}
.dropbig .dhint b{display:block;color:var(--dim);font-size:13.5px;font-weight:600;margin-bottom:4px}

/* ---- анімація генерації ---- */
.genwrap{position:relative;overflow:hidden;border-radius:14px}
.genwrap::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(34,200,230,.14) 50%,transparent 65%);
  background-size:260% 100%;animation:genSweep 1.5s linear infinite}
@keyframes genSweep{from{background-position:180% 0}to{background-position:-80% 0}}
.genstat{display:flex;align-items:center;gap:10px;font-size:12.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--acc);font-weight:600}
.genstat .dot{width:8px;height:8px;border-radius:50%;background:var(--acc);animation:genPulse 1s ease-in-out infinite}
.genstat .sub{text-transform:none;letter-spacing:0;color:var(--dim);font-weight:400;font-size:12px}
@keyframes genPulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.25)}}
#fixline{font-size:11.5px;color:#f0b23c;min-height:15px;margin-top:5px}
.imgres .cell.wait .lbl{font-weight:600;letter-spacing:.06em;text-transform:uppercase}

/* велике вікно під референси: картки більші, порожній стан помітний */
.attgrid.big{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px;min-height:150px}
.attgrid.big .att{height:132px;border-radius:14px}
.attgrid.big .att .im{width:100%;height:100%;object-fit:cover}
.attgrid.big .att.addA{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  border:1.5px dashed rgba(120,160,220,.3);background:transparent;font-size:12.5px;color:var(--dim)}
.attgrid.big .att.addA:hover{border-color:var(--acc);color:var(--acc)}
.attgrid.big .att.addA .ic{font-size:26px;opacity:.75}

.engb{margin-top:8px;background:var(--bg2);border-left:2px solid var(--acc);border-radius:0 9px 9px 0;padding:7px 11px}
.engb .k{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--dim2)}
.engb .v{font-size:12px;line-height:1.6;color:var(--dim);margin-top:3px;max-height:96px;overflow:auto}

/* ---- головна кнопка генерації ---- */
#go{font-size:16px !important;font-weight:700 !important;padding:16px 26px !important;
  border-radius:14px !important;width:100% !important;justify-content:center !important;
  letter-spacing:.02em;box-shadow:0 8px 28px rgba(34,200,230,.28),0 0 0 1px rgba(34,200,230,.35) inset;
  transition:transform .12s ease,box-shadow .2s ease}
#go:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 12px 36px rgba(34,200,230,.4),0 0 0 1px rgba(34,200,230,.5) inset}
#go:active:not(:disabled){transform:translateY(1px)}
#go:disabled{opacity:.45;box-shadow:none}
.imgwrap .row:has(#go){margin-top:14px}

/* ---- завантаження: окрема помітна дія ---- */
.uprow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:2px 0 9px}
.upbtn{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(34,200,230,.45);
  background:linear-gradient(180deg,rgba(34,200,230,.14),rgba(34,200,230,.05));
  color:var(--tx);border-radius:12px;padding:11px 18px;font:inherit;font-size:13.5px;font-weight:600;cursor:pointer;
  transition:.15s}
.upbtn:hover{border-color:var(--acc);background:linear-gradient(180deg,rgba(34,200,230,.24),rgba(34,200,230,.09))}
.upbtn .i{font-size:16px;color:var(--acc)}
.uph{font-size:12px;color:var(--dim2)}

/* ---- правка кадру ---- */
.editbox{margin:12px 0 6px;background:var(--bg2);border:1px solid rgba(34,200,230,.28);border-radius:14px;padding:11px 12px 12px}
.editbox .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--acc);margin-bottom:7px;font-weight:600}
.editbox textarea{width:100%;min-height:70px;background:var(--bg);border:1px solid var(--gline);border-radius:10px;
  color:var(--tx);font:inherit;font-size:13px;line-height:1.55;padding:9px 11px;resize:vertical;outline:none}
.editbox textarea:focus{border-color:var(--acc)}
.editbox .er{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:9px}
.editbox .apply{border:0;background:var(--grad);color:#0d0d10;border-radius:10px;padding:9px 16px;
  font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.editbox .apply:hover{filter:brightness(1.08)}
.editbox .h{font-size:11px;color:var(--dim2);flex:1;min-width:140px}
.brand .wm{display:flex;flex-direction:column;line-height:1.05;font-weight:700;letter-spacing:.17em;font-size:12.5px}
.brand .wm i{font-style:normal;font-weight:500;letter-spacing:.3em;font-size:8.5px;color:var(--dim);margin-top:3px}
.brand svg{color:var(--tx)}
.i-name{letter-spacing:.16em}
.i-name b{display:block;font-size:.5em;letter-spacing:.34em;font-weight:500;background:none;-webkit-text-fill-color:var(--dim);color:var(--dim);margin-top:5px}
.editbox .apply{color:#fff}
.brand .wm i::after,.logo b span::after{content:"";display:block;width:16px;height:2px;background:#c0332b;margin-top:4px;border-radius:1px}

/* --- АГЕНТ 2: референси сіткою, картка плану --- */
.wk .refgrid{max-height:210px;overflow-y:auto;overflow-x:hidden;align-content:flex-start;padding-right:2px}
.wk .refgrid::-webkit-scrollbar{width:6px}
.wk .refgrid::-webkit-scrollbar-thumb{background:var(--line2);border-radius:3px}
.refgrid.drop{outline:2px dashed var(--acc);outline-offset:3px}
.refhead{display:flex;align-items:center;gap:8px}
.refhead .n{color:var(--dim);font-weight:400;font-size:11px;letter-spacing:0;text-transform:none}
.pcard{border:1px solid var(--gline);border-radius:12px;background:var(--card2);padding:10px 12px;margin-top:6px}
.pcard h4{margin:0 0 8px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.pcard table{width:100%;border-collapse:collapse;font-size:11.5px}
.pcard td{padding:3px 4px;border-bottom:1px solid var(--gline);vertical-align:top}
.pcard td.n{width:22px;color:var(--dim);font-variant-numeric:tabular-nums}
.pcard td.d{width:44px;text-align:right;color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.pcard .sum{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px;font-size:11.5px;color:var(--dim)}
.pcard .sum b{color:var(--fg)}
.pcard .qs{margin:0;padding-left:18px;font-size:12px;line-height:1.55}

/* =====================================================================
   02.10 REDESIGN «MONO» — лише чорне / біле, без золота й кольорових градієнтів.
   Шар іде ОСТАННІМ і перекриває попередні теми. Верхня смуга: логотип + меню.
   Ліва панель як була (згортається), права — «Готові роботи» квадратиками (ховається).
   ===================================================================== */
html body{--bg:#0b0b0c;--bg2:#131315;--panel:#161618;--card:rgba(255,255,255,.035);--card2:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.16);--tx:#f4f4f5;--dim:#a1a1aa;--dim2:#6b6b73;
  --acc:#e4e4e7;--acc2:#a1a1aa;--grad:linear-gradient(180deg,#3f3f46,#27272a);--glow:rgba(255,255,255,.05);--hi:#fafafa;--hitx:#0b0b0c}
html body[data-theme="light"]{--bg:#fafafa;--bg2:#ffffff;--panel:#ffffff;--card:rgba(0,0,0,.03);--card2:rgba(0,0,0,.055);
  --line:rgba(0,0,0,.08);--line2:rgba(0,0,0,.16);--tx:#111113;--dim:#5f5f66;--dim2:#9a9aa2;
  --acc:#18181b;--acc2:#52525b;--grad:linear-gradient(180deg,#27272a,#111113);--glow:rgba(0,0,0,.04);--hi:#111113;--hitx:#ffffff}
html body{background:var(--bg)}
html body:before{background:radial-gradient(60% 50% at 50% 110%,var(--glow),transparent 70%);animation:none}
html body #app,html body .snav,html body .top{background:var(--bg)}
html body .snav,html body .top{backdrop-filter:none}

/* верхня смуга на всю ширину: логотип зліва, текстове меню */
html body .top{left:0!important;height:58px;padding:0 18px;gap:10px}
html body .snav{top:58px;padding-top:12px}
html body .snav .brand,html body .ptitle{display:none!important}
.tbrand{display:flex;align-items:center;gap:10px;cursor:pointer;margin-right:18px;font-weight:700;letter-spacing:.2em;font-size:12.5px;color:var(--tx)}
.tbrand img{width:28px;height:28px;border-radius:7px}
html body[data-theme="light"] .tbrand img{filter:none}
.tmenu{display:flex;gap:4px}
.tmenu a{padding:6px 11px;border-radius:8px;color:var(--dim);font-size:13.5px;cursor:pointer;user-select:none}
.tmenu a:hover{color:var(--tx)}
.tmenu a.on{color:var(--tx);background:var(--card2)}
@media(max-width:900px){.tmenu{display:none}}

/* кнопки й акценти — моно */
html body .btn,html body .i-go,html body #fab{background:var(--hi)!important;color:var(--hitx)!important;box-shadow:none}
html body .snav button.act,html body .snav button.on{background:var(--card2);color:var(--tx);box-shadow:inset 0 0 0 1px var(--line2)}
html body .snav button.act:before{display:none}
html body .ehandle{background:var(--panel)!important;color:var(--dim)!important;border:1px solid var(--line2)!important;box-shadow:none!important}
html body .ehandle:hover{color:var(--tx)!important}
html body *{scrollbar-color:var(--line2) transparent}

/* права панель «Готові роботи» */
#gal{position:fixed;top:58px;right:0;bottom:0;width:286px;border-left:1px solid var(--line);background:var(--bg);z-index:18;display:flex;flex-direction:column}
#gal .ghd{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 10px;font-size:13px;color:var(--dim)}
.gtg,.galrail{width:30px;height:30px;border:1px solid var(--line2);border-radius:8px;background:transparent;color:var(--dim);display:flex;align-items:center;justify-content:center;cursor:pointer}
.gtg:hover,.galrail:hover{color:var(--tx)}
.gtg svg,.galrail svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.7}
#gal .ggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:0 12px 14px;overflow:auto;align-content:start}
#gal .gt{aspect-ratio:1;border-radius:8px;overflow:hidden;background:var(--card2);position:relative;cursor:pointer}
#gal .gt img,#gal .gt video{width:100%;height:100%;object-fit:cover;display:block}
#gal .gt.v:after{content:"▶";position:absolute;right:5px;bottom:3px;font-size:9px;color:#fff;text-shadow:0 1px 3px #000}
#gal .gt:hover{outline:1px solid var(--line2)}
#gal .gempty{grid-column:1/-1;color:var(--dim2);font-size:12.5px;padding:18px 4px;text-align:center}
.galrail{position:fixed;top:70px;right:12px;z-index:18;display:none;background:var(--bg)}
body.galoff #gal{display:none}
body.galoff .galrail{display:flex}
html body main{margin-right:286px!important;margin-top:58px!important}
html body.galoff main{margin-right:52px!important}
html body .ehandle.r{right:286px}
html body.galoff .ehandle.r{right:0}
#login.on~#gal,#intro:not(.gone)~#app #gal{display:none}

/* =====================================================================
   02.10 RIFTWAY V1 — graphite, calm, composer-first
   ===================================================================== */
html body{--bg:#101113;--bg2:#16171a;--panel:#18191c;--panel2:#1f2024;--line:rgba(255,255,255,.07);--line2:rgba(255,255,255,.13);--tx:#ededef;--dim:#9b9ba3;--dim2:#6b6b73;--hi:#f2f2f3;--hitx:#101113}
html body[data-theme="light"]{--bg:#f6f6f7;--bg2:#fff;--panel:#fff;--panel2:#f0f0f2;--line:rgba(0,0,0,.08);--line2:rgba(0,0,0,.14);--tx:#141416;--dim:#55555d;--dim2:#8b8b93;--hi:#141416;--hitx:#fff}
.wsi{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* P0: згода — завжди в межах екрана, текст гортається всередині, кнопки видно */
#consentGate.cgwrap{padding:12px!important;align-items:center}
#consentGate .cgbox{max-height:calc(100dvh - 24px);display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden}
#consentGate .cgtext{overflow:auto;min-height:0;flex:1 1 auto;padding-right:4px}
#consentGate .cgact{flex:none;padding-top:10px;position:sticky;bottom:0;background:inherit}
#consentGate .cgact button{min-height:40px;padding:0 18px}
/* P0: beta-повідомлення не перекриває нічого — внизу зліва, закривається */
#betaBar{position:fixed;left:12px;bottom:12px;z-index:60;max-width:min(520px,calc(100vw - 24px));display:flex;gap:10px;align-items:center;
  background:var(--panel2);color:var(--dim);border:1px solid var(--line2);border-radius:12px;padding:8px 8px 8px 14px;font:500 12.5px/1.4 system-ui,sans-serif;box-shadow:0 10px 30px rgba(0,0,0,.3)}
#betaBar button{background:transparent;border:none;color:var(--dim);cursor:pointer;font-size:14px;width:28px;height:28px;border-radius:7px;flex:none}
#betaBar button:hover{background:var(--line);color:var(--tx)}
body.tab-ws #betaBar{bottom:auto;top:66px}
#login{z-index:300}
#login .box{max-height:calc(100dvh - 24px);overflow:auto}

/* ---------- Create (workspace) ---------- */
body.tab-ws main{padding:0!important;max-width:none!important;height:calc(100vh - 58px);height:calc(100dvh - 58px);overflow:hidden}
.ws{position:relative;height:100%;display:flex;flex-direction:column}
.wsfeed{flex:1;overflow:auto;padding:26px max(24px,calc(50% - 430px)) 24px;display:flex;flex-direction:column;gap:18px}
.wsempty{margin:auto;text-align:center;color:var(--dim);padding:40px 0}
.wsempty h2{color:var(--tx);font-size:30px;font-weight:600;letter-spacing:-.02em;margin-bottom:8px}
.wscard{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px 16px 14px;transition:box-shadow .3s}
.wscard.pin{border-color:var(--line2);box-shadow:inset 0 0 0 1px var(--line2)}
.wscard.pop{animation:wspop .9s ease}
@keyframes wspop{0%{box-shadow:0 0 0 0 rgba(255,255,255,.35)}100%{box-shadow:0 0 0 14px rgba(255,255,255,0)}}
.wsch{display:flex;gap:12px;align-items:baseline;justify-content:space-between;flex-wrap:wrap}
.wsq{font-size:14px;line-height:1.45;margin:0;flex:1 1 320px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.wsmeta{font-size:12px;color:var(--dim2);white-space:nowrap}
.wsst{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 10px;padding:0}
.wsst li{font-size:11.5px;color:var(--dim2);padding:3px 9px;border-radius:20px;border:1px solid var(--line)}
.wsst li.ok{color:var(--dim)}
.wsst li.ok:before{content:"✓ "}
.wsst li.cur{color:var(--tx);border-color:var(--line2);background:var(--card2)}
.wsbar{height:3px;border-radius:3px;background:var(--line);overflow:hidden;position:relative}
.wsbar i{position:absolute;inset:0;width:35%;background:linear-gradient(90deg,transparent,var(--dim),transparent);animation:wsslide 1.6s ease-in-out infinite}
@keyframes wsslide{0%{transform:translateX(-100%)}100%{transform:translateX(300%)}}
.wstime{font-size:12px;color:var(--dim2);margin-top:8px}
.wserr{margin-top:10px;font-size:13px;color:#e08a8a}
.wsmed{margin-top:12px;border-radius:12px;overflow:hidden;background:#000;max-width:520px}
.wsmed.image{max-width:360px;cursor:zoom-in}
.wsmed video,.wsmed img{display:block;width:100%;max-height:60vh;object-fit:contain}
.wstb{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.wstb button,.wstb a{display:inline-flex;align-items:center;gap:6px;font:500 12.5px system-ui,sans-serif;color:var(--dim);background:transparent;border:1px solid var(--line);border-radius:9px;padding:6px 10px;cursor:pointer;text-decoration:none}
.wstb button:hover,.wstb a:hover,.wstb .on{color:var(--tx);border-color:var(--line2);background:var(--card2)}
.wscmpbar{position:sticky;top:0;z-index:2;display:flex;gap:8px;align-items:center;align-self:center;background:var(--panel2);border:1px solid var(--line2);border-radius:12px;padding:6px 8px 6px 14px;font-size:13px}
.wscmpbar button{border:1px solid var(--line2);background:transparent;color:var(--tx);border-radius:8px;padding:5px 10px;cursor:pointer}

/* композер */
.wscomp{flex:none;margin:0 max(16px,calc(50% - 450px)) 18px;background:var(--panel);border:1px solid var(--line2);border-radius:18px;padding:10px 12px 10px;box-shadow:0 18px 50px rgba(0,0,0,.28)}
.wsstrip{display:flex;gap:6px;flex-wrap:wrap}
.wsstrip:empty{display:none}
.wscomp textarea{width:100%;border:none;outline:none;resize:none;background:transparent;color:var(--tx);font:15px/1.5 system-ui,sans-serif;padding:8px 4px;min-height:48px;max-height:30vh}
.wsrow{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.wsrow .sp{flex:1}
.seg{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:2px}
.seg button{display:inline-flex;align-items:center;gap:6px;border:none;background:transparent;color:var(--dim);font:500 12.5px system-ui,sans-serif;padding:6px 10px;border-radius:8px;cursor:pointer}
.seg button.on{background:var(--panel2);color:var(--tx);box-shadow:0 1px 2px rgba(0,0,0,.2)}
.wsb{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:transparent;color:var(--dim);font:500 12.5px system-ui,sans-serif;padding:7px 10px;border-radius:10px;cursor:pointer}
.wsb:hover{color:var(--tx);border-color:var(--line2)}
.wsb.icon{padding:7px}
.wss{background:var(--card);border:1px solid var(--line);color:var(--tx);font:500 12.5px system-ui,sans-serif;padding:7px 8px;border-radius:10px;max-width:180px}
.wstag{font-size:11.5px;color:var(--dim);padding:5px 8px;border-radius:8px;background:var(--card)}
.wsprice{font-size:13px;color:var(--tx);font-weight:600;white-space:nowrap;padding:0 4px}
.wsgo{background:var(--hi);color:var(--hitx);border:none;border-radius:11px;font:650 14px system-ui,sans-serif;padding:10px 20px;cursor:pointer;min-height:40px}
.wsgo:disabled{opacity:.5;cursor:wait}
.wsref{position:relative;width:64px;height:64px;border-radius:10px;overflow:hidden;background:var(--card2);flex:none;cursor:grab}
.wsref.s{width:44px;height:44px;border-radius:8px}
.wsref img,.wsref video{width:100%;height:100%;object-fit:cover;display:block}
.wsref b{position:absolute;left:4px;bottom:2px;font-size:10px;color:#fff;text-shadow:0 1px 3px #000}
.wsref button{position:absolute;top:2px;right:2px;width:18px;height:18px;border-radius:50%;border:none;background:rgba(0,0,0,.6);color:#fff;display:none;align-items:center;justify-content:center;cursor:pointer;padding:0}
.wsref button .wsi{width:10px;height:10px}
.wsref:hover button{display:flex}
.wsmore{font-size:12px;color:var(--dim);align-self:center}

/* панелі */
.wsp{position:fixed;z-index:70;display:none;flex-direction:column;background:var(--panel);border:1px solid var(--line2);border-radius:14px;box-shadow:0 24px 70px rgba(0,0,0,.4);resize:both;overflow:hidden;min-width:260px;min-height:160px}
.wsp.on{display:flex}
.wsp.min{resize:none;min-height:0;height:auto!important}
.wsp.min .wspb{display:none}
.wsp.dock-left,.wsp.dock-right{top:58px!important;bottom:0;width:340px;height:auto;border-radius:0;resize:none}
.wsp.dock-left{left:0!important}
.wsp.dock-right{right:0;left:auto!important}
.wsph{display:flex;align-items:center;gap:2px;padding:8px 8px 8px 14px;border-bottom:1px solid var(--line);cursor:move;user-select:none;touch-action:none}
.wsph b{font-size:13px}
.wsph .sp{flex:1}
.wsph button{width:28px;height:28px;border:none;background:transparent;color:var(--dim);border-radius:7px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.wsph button:hover{background:var(--card2);color:var(--tx)}
.wspb{flex:1;overflow:auto;padding:14px}
.wsrefgrid{display:flex;flex-wrap:wrap;gap:8px}
.wsrefadd{width:64px;height:64px;border-radius:10px;border:1px dashed var(--line2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--dim);font-size:11px;cursor:pointer}
.wsrefs-drop.over{outline:1px dashed var(--line2);outline-offset:6px;border-radius:10px}
.wsfl{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:12px;color:var(--dim)}
.wshint{font-size:12px;color:var(--dim2);margin:12px 0 0}
.calc{display:flex;flex-direction:column;gap:10px}
.calc label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--dim)}
.calc select{background:var(--card);border:1px solid var(--line);color:var(--tx);border-radius:9px;padding:8px}
.calcnote{font-size:12px;color:var(--dim)}
.calcout{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:12px;border-radius:12px;background:var(--card2)}
.calcout span{font-size:12px;color:var(--dim);flex-basis:100%}
.calcout b{font-size:24px;font-weight:650}
.calcout i{font-style:normal;color:var(--dim)}

/* модалки (порівняння, обрізка, кадр, стан оплати) */
.wsmodal{position:fixed;inset:0;z-index:400;background:rgba(0,0,0,.65);display:flex;align-items:center;justify-content:center;padding:12px}
.wsmbox{background:var(--panel);border:1px solid var(--line2);border-radius:16px;padding:14px 16px 16px;width:min(720px,100%);max-height:calc(100dvh - 24px);overflow:auto}
.wsmbox.wide{width:min(1100px,100%)}
.wsmbox header{display:flex;align-items:center;margin-bottom:10px}
.wsmbox header .sp{flex:1}
.wsmbox header button{border:none;background:transparent;color:var(--dim);cursor:pointer;width:30px;height:30px;border-radius:8px}
.wsmbox video{width:100%;max-height:55vh;background:#000;border-radius:10px}
.wsab{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.wsab figure{margin:0;display:flex;flex-direction:column;gap:8px}
.wsab img,.wsab video{width:100%;border-radius:10px;background:#000}
.wsab figcaption{font-size:12.5px;color:var(--dim)}
.wsab button,.edact button{border:1px solid var(--line2);background:transparent;color:var(--tx);border-radius:10px;padding:8px 12px;cursor:pointer;font:500 13px system-ui,sans-serif}
.edtl{margin-top:10px}
.edtl input,.edtrim input{width:100%}
.edlbl{display:flex;justify-content:space-between;font-size:12px;color:var(--dim);margin-top:4px}
.edtrim{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.edtrim label{font-size:12px;color:var(--dim)}
.edact{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-top:12px}
.edact .wsgo{border:none}
.wsmbox.pay{width:min(420px,100%);text-align:center;padding:24px}
.wsmbox.pay .payt{display:block;font-size:20px;margin-bottom:8px}
.wsmbox.pay p{color:var(--dim)}
.wsmbox.pay a{color:var(--tx)}

/* Generated (права панель): дії на мініатюрах */
#gal .gt .gtact{position:absolute;right:4px;top:4px;display:none;gap:3px}
#gal .gt:hover .gtact{display:flex}
#gal .gtact button,#gal .gtact a{width:24px;height:24px;border-radius:6px;border:none;background:rgba(0,0,0,.6);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
#gal .gtact .wsi{width:13px;height:13px}
body.tab-ws #fab{bottom:auto;top:70px;right:300px;width:40px;height:40px;font-size:16px}
body.tab-ws.galoff #fab{right:64px}

/* ---------- мобільний ---------- */
.mnav{display:none;border:1px solid var(--line2);background:transparent;color:var(--tx);border-radius:9px;width:36px;height:34px;cursor:pointer;margin-left:6px}
@media(max-width:900px){html body .tmenu{display:flex}.tmenu a{display:none}.mnav{display:block}}
@media(max-width:760px){
  html body .snav{transform:translateX(-102%);transition:transform .25s;z-index:80;width:240px}
  body.navopen .snav{transform:none}
  html body main{margin-left:0!important;margin-right:0!important}
  html body #gal{display:none}
  html body .galrail{display:none!important}
  html body .top{padding:0 10px;gap:6px}
  html body .top #proj,html body .top #pjL,html body .top #pjN,html body .top .iconbtn,html body .top #thBtn,html body .top .avatar{display:none}
  .tbrand span{display:none}
  .wsfeed{padding:16px 12px}
  .wscomp{margin:0 8px 8px;border-radius:16px;padding:8px}
  .wsrow{gap:5px}
  .wss{max-width:46vw;padding:7px 6px}
  .seg button span,.wsb span{display:none}
  .wsprice{flex-basis:100%;order:9;text-align:right;font-size:12.5px}
  .wsgo{order:10;flex:1}
  .wsp{left:0!important;right:0;top:auto!important;bottom:0;width:auto!important;height:auto!important;max-height:72vh;border-radius:16px 16px 0 0;resize:none}
  .wsp.dock-left,.wsp.dock-right{top:auto!important;width:auto}
  .wsph{cursor:default}
  .wsph button[title^="Dock"],.wsph button[title="Float"]{display:none}
  .wsab{grid-template-columns:1fr}
  .wsmed{max-width:100%}
  body.tab-ws #fab{top:auto;bottom:150px;right:12px}
  #betaBar,body.tab-ws #betaBar{left:8px;right:8px;max-width:none;top:auto;bottom:8px}
  body.tab-ws #betaBar{bottom:auto;top:62px}
}
.wsright{display:flex;align-items:center;gap:6px;margin-left:auto}
#betaBar.inline{position:static;max-width:none;align-self:center;box-shadow:none;margin:-8px 0 0}
body.tab-ws .ehandle.l,body.tab-ws #fab{display:none}
@media(max-width:760px){.wsright{flex-basis:100%;justify-content:flex-end}.wsright .wsgo{flex:1}#betaBar.inline{margin:0}}
@media(max-width:760px){
  html body .top .pill:not(#credPill),html body .top #lang{display:none!important}
  html body .ehandle{display:none!important}
  #credPill{max-width:46vw;overflow:hidden;white-space:nowrap}
}

/* ===== 02.10 V1 · Pricing modal ===== */
#buy.pk #buyC{max-width:1000px;width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow:auto;border-radius:18px}
.pkwrap{position:relative;padding:34px 30px 26px;color:var(--tx)}
.pkwrap h2{display:block;width:100%;margin:0;padding:0 30px;box-sizing:border-box;text-align:center !important;justify-content:center;font-size:clamp(26px,4vw,40px);letter-spacing:-.02em;font-weight:800}
.pksub{text-align:center;color:var(--dim);margin:8px 0 22px}
.pkx{position:absolute;right:14px;top:12px;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:transparent;color:inherit;font-size:20px;cursor:pointer}
.pknote{margin:0 auto 18px;max-width:640px;padding:10px 14px;border:1px solid var(--line);border-radius:10px;color:var(--dim);font-size:13px;text-align:center}
.pkrow{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:end}
.pkc{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel);transition:box-shadow .2s,border-color .2s}
.pkc.feat{border:1.5px solid var(--tx)}
.pkc.fit{box-shadow:0 0 0 2px var(--tx)}
.pktag{padding:10px;text-align:center;font-weight:700;font-size:14px;background:var(--line);color:inherit}
.pkc.feat .pktag{background:var(--tx);color:var(--bg)}
.pkin{padding:22px}
.pkhd{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.pknm{letter-spacing:.28em;font-size:18px}
.pkpr{font-size:21px;font-weight:800}.pkpr i{font-style:normal;font-weight:400;font-size:12px;color:var(--dim);margin-left:3px}
.pkcr{margin:18px 0 12px;color:var(--dim)}.pkcr b{font-size:25px;color:var(--tx);margin-right:4px}
.pkc ul{list-style:none;padding:0;margin:0 0 20px}
.pkc li{display:flex;gap:10px;align-items:flex-start;margin:9px 0;font-size:14.5px}.pkc li svg{flex:none;margin-top:1px}
.pkbtn{width:100%;padding:13px;border-radius:999px;border:1px solid var(--line);background:transparent;color:inherit;font-weight:700;font-size:15px;cursor:pointer}
.pkc.feat .pkbtn{background:var(--tx);color:var(--bg);border-color:transparent}
.pkbtn:hover{filter:brightness(1.1)}
.pkcalc{margin-top:18px;border:1px solid var(--line);border-radius:16px;padding:18px 20px}
.pkcl b{display:block;font-size:16px}.pkcl span{color:var(--dim);font-size:12.5px}
.pkcf{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0}
.pkcf select,.pkcf input{background:transparent;color:inherit;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font:inherit;font-size:13.5px}
.pkcf input{width:72px}.pkcf .seg{display:inline-flex}
.pkq{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--dim)}
.pkco{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;color:var(--dim);font-size:13px}
.pkco b{font-size:22px;color:var(--tx)}
.pkhint{margin-top:6px;font-size:13px}
.pkhist{margin-top:16px;font-size:13px}.pkhist summary{cursor:pointer;color:var(--dim)}
.pkhist table{width:100%;border-collapse:collapse;margin-top:8px}.pkhist th,.pkhist td{text-align:left;padding:6px 4px;border-bottom:1px solid var(--line)}
.pkhist th{color:var(--dim);font-weight:500}.pkempty{color:var(--dim);padding:8px 0}
@media (max-width:760px){
  #buy.pk #buyC{width:100vw;max-height:100dvh;border-radius:16px 16px 0 0}
  .pkwrap{padding:26px 16px 22px}.pkrow{grid-template-columns:1fr}
  .pkc.feat{order:-1}.pkin{padding:18px}.pkhist{overflow-x:auto}
}

/* ===== 02.10 V1.1 · «+», Supercomputer, ліва ручка ===== */
:root{--sc:#e5484d}
.wsplusw{display:inline-flex}
.wsplus{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--tx);font-size:22px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.wsplus:hover{background:var(--line)}
.plusm{position:fixed;z-index:80;min-width:230px;padding:6px;border:1px solid var(--line);border-radius:14px;background:var(--panel,var(--bg));box-shadow:0 12px 40px rgba(0,0,0,.35)}
.plusm button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:0;background:transparent;color:var(--tx);border-radius:9px;cursor:pointer;font:inherit;font-size:13.5px;text-align:left}
.plusm button:hover{background:var(--line)}.plusm button span{flex:1}.plusm i{font-style:normal;font-size:11px;color:var(--dim)}
.plusm svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7}
.seg.cnt button{min-width:30px;justify-content:center}
.wsb.super{border:1px solid color-mix(in srgb,var(--sc) 55%,transparent)!important;color:var(--tx)}
.wsb.super.on{background:color-mix(in srgb,var(--sc) 14%,transparent);border-color:var(--sc)!important}
.wsgo.think{background:transparent;color:var(--tx);border:1px solid var(--sc)}
.wsgo[disabled]{opacity:.45;cursor:not-allowed}
.wstag.soon{color:var(--dim);border-style:dashed}
.wstoast{position:fixed;left:50%;bottom:120px;transform:translateX(-50%);z-index:90;padding:10px 16px;border-radius:12px;background:var(--tx);color:var(--bg);font-size:13px;max-width:min(520px,calc(100vw - 32px))}
.topsuper{position:static;margin:0 auto;flex:none;display:inline-flex;align-items:center;gap:8px;padding:5px 12px;border:1px solid color-mix(in srgb,var(--sc) 65%,transparent);border-radius:999px;color:var(--tx);text-decoration:none;font-size:12.5px;white-space:nowrap}
.topsuper b{letter-spacing:.22em;font-size:11.5px}.topsuper span{color:var(--tx);opacity:.9}
.topsuper:hover{background:color-mix(in srgb,var(--sc) 10%,transparent)}
.wscard.agent{border:1px solid color-mix(in srgb,var(--sc) 45%,transparent)}
.sbadge{display:inline-block;margin-right:6px;padding:1px 8px;border:1px solid color-mix(in srgb,var(--sc) 65%,transparent);border-radius:999px;font-size:11px;font-weight:600}
.sthink{margin:8px 0;font-size:12.5px;color:var(--dim)}.sthink summary{cursor:pointer}.sthink div{white-space:pre-wrap;margin-top:6px;max-height:180px;overflow:auto}
.splan{white-space:pre-wrap;font-size:14px;line-height:1.55;margin:8px 0}
.sshots{margin:6px 0 0;padding-left:20px}.sshots li{margin:8px 0;font-size:13.5px}
.sshots li>div{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
.sshots button{padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--tx);cursor:pointer;font:inherit;font-size:12.5px}
.sshots button.g{background:var(--tx);color:var(--bg);border-color:transparent}
.navh{position:fixed;top:50%;left:195px;width:24px;height:44px;border-radius:0 10px 10px 0;border:1px solid var(--line);border-left:0;background:var(--bg);color:var(--dim);cursor:pointer;z-index:5;font-size:16px;line-height:1}
.navh:hover{color:var(--tx)}
body.navmini .navh{left:63px;transform:scaleX(-1);border-radius:10px 0 0 10px;border-left:1px solid var(--line);border-right:0}
@media (max-width:1100px){.topsuper b{display:none}}
@media (max-width:760px){.topsuper{margin:0;padding:4px 9px}.topsuper span{font-size:11.5px}.navh{display:none}
  .wsb.super span{display:none}}

/* ===== 02.10 V1.2 · Storyboard, Auto, версії, швидкі дії, Pricing-моделі ===== */
.vchip{display:inline-block;margin-right:8px;padding:1px 7px;border:1px solid var(--line);border-radius:999px;font-size:11px;color:var(--dim);white-space:nowrap}
.wstb2{border-top:1px dashed var(--line);margin-top:6px;padding-top:6px}
.wstb2 button.dim{opacity:.55}.wstb2 button.hi{border-color:var(--tx)}
.plusm hr{border:0;border-top:1px solid var(--line);margin:4px 2px}
.wsb sup{font-size:10px;margin-left:2px}
.sb{display:flex;flex-direction:column;gap:10px;font-size:13.5px}
.sbtop{display:flex;gap:8px}.sbtitle{flex:1;background:transparent;border:1px solid var(--line);border-radius:10px;padding:8px 10px;color:var(--tx);font:inherit;font-weight:600}
.sb button{padding:6px 11px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--tx);cursor:pointer;font:inherit;font-size:12.5px}
.sb button[disabled]{opacity:.35;cursor:default}.sb button.g{background:var(--tx);color:var(--bg);border-color:transparent}
.sblist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.sblist li{border:1px solid var(--line);border-radius:12px;padding:10px}
.sbh{display:flex;align-items:center;gap:4px;margin-bottom:6px}.sbh .sp{flex:1}.sbh button{padding:2px 9px}
.sblist textarea{width:100%;box-sizing:border-box;background:transparent;border:1px solid var(--line);border-radius:8px;color:var(--tx);font:inherit;font-size:13px;padding:8px;resize:vertical}
.sbrefs{font-size:12px;color:var(--dim);margin:6px 0}.sbrefs a{cursor:pointer;text-decoration:underline}
.sbact{display:flex;gap:6px;flex-wrap:wrap}
.sbfoot{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--line);padding-top:10px;flex-wrap:wrap}
.sact{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.sact button{padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--tx);cursor:pointer;font:inherit;font-size:12.5px}
.sact button.g{background:var(--tx);color:var(--bg);border-color:transparent;font-weight:600}
.aupick{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.aupick>div{border:1px solid var(--line);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:3px}
.aupick .aurs{grid-column:1/-1}.aupick .lbl{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em}
.aupick b{font-size:16px}
.pkc li.soon{opacity:.6}.pkc li i{font-style:normal;color:var(--dim);font-size:12.5px}
.pkmods{margin-top:18px;border:1px solid var(--line);border-radius:16px;padding:14px 18px;font-size:13.5px}
.pkmods summary{cursor:pointer;font-weight:700;font-size:15px}
.pkmods table{width:100%;border-collapse:collapse;margin-top:10px}.pkmods th,.pkmods td{text-align:left;padding:6px 4px;border-bottom:1px solid var(--line)}
.pkmods th{color:var(--dim);font-weight:500}.pkmods tr.soon td{color:var(--dim)}
@media (max-width:760px){.aupick{grid-template-columns:1fr}.pkmods{overflow-x:auto;padding:12px}}
@media (max-width:760px){body.tab-ws .wsright{flex-wrap:wrap;row-gap:8px}body.tab-ws .wsright .wsgo{flex:1 1 100%;order:9}body.tab-ws .wsright .wsprice{flex:1;text-align:right}}
.aexp table.aext{width:100%;border-collapse:collapse;margin-top:10px;font-size:12.5px}.aext th,.aext td{text-align:left;padding:5px 4px;border-bottom:1px solid var(--line)}.aext th{color:var(--dim);font-weight:500}
.galtabs{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 10px;grid-column:1/-1}
.galtabs button{padding:4px 9px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--dim);font:inherit;font-size:11.5px;cursor:pointer}
.galtabs button.on{color:var(--tx);border-color:var(--tx)}.galtabs button.dim{opacity:.5}
#galG{display:block!important}.galgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.gt{position:relative}.gpin{position:absolute;left:5px;top:3px;font-size:12px;text-shadow:0 0 4px #000}
.betab{display:inline-block;margin-left:4px;padding:0 6px;border:1px solid var(--line);border-radius:999px;font-size:10px;font-weight:600;letter-spacing:.06em;color:var(--dim);vertical-align:middle}

/* 03.10 · бейдж моделі (іконка типу + назва), моно, компактний */
.mbadge{display:inline-flex;align-items:center;gap:4px;max-width:100%;padding:1px 7px 1px 5px;border:1px solid var(--line);border-radius:999px;font-size:11px;line-height:16px;font-weight:600;color:var(--tx);background:var(--panel);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
.mbadge svg{width:11px;height:11px;flex:none;fill:currentColor;opacity:.75}
.wsmeta .mbadge{margin-right:6px}
.wsvia{display:inline-flex;min-width:0}
figcaption .mbadge{margin-left:4px}
@media (max-width:760px){.wsvia{order:8}.mbadge{font-size:10.5px}}

/* 03.10 · спрощена навігація і картка «Generating with» */
.navmore{opacity:.75}
.navfold .ic{opacity:.7}
.nowc{margin:0 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);font-size:12px}
.nowh{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.nowr{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:3px 0}
.nowr span{color:var(--dim2)}
.nowr b{font-weight:600;color:var(--tx);text-align:right;min-width:0}

/* ===== 03.10 · Тони тем: матові панелі, без чисто-білого і чисто-чорного; нативні списки видно одразу ===== */
html body{--bg:#111215;--bg2:#17181c;--panel:#1a1b1f;--panel2:#222328;--line:rgba(255,255,255,.065);--line2:rgba(255,255,255,.12);--tx:#e7e7ea;--dim:#a0a0a8;--dim2:#74747c;color-scheme:dark}
html body[data-theme="light"]{--bg:#f1f1ef;--bg2:#fbfbf9;--panel:#fafaf8;--panel2:#f0f0ed;--line:rgba(20,20,15,.07);--line2:rgba(20,20,15,.12);--tx:#18181a;--dim:#55555c;--dim2:#86868d;color-scheme:light}
/* Windows/Chrome: випадаючий список бере системний фон; без явних кольорів пункти були білим по білому, доки не наведеш мишею */
select option,select optgroup{background-color:var(--bg2);color:var(--tx)}
select:disabled option,option:disabled{color:var(--dim2)}
/* бокові панелі й верх — матова «підкладка», трохи відмінна від робочого поля */
html body .snav, html body #gal{background:var(--panel)}
html body .top{background:var(--panel)}
html body[data-theme="light"] .snav, html body[data-theme="light"] #gal, html body[data-theme="light"] .top{background:#f8f8f6}
html body .snav{border-right:1px solid var(--line)} html body #gal{border-left:1px solid var(--line)}
html body[data-theme="light"] .wscard, html body[data-theme="light"] .wscomp, html body[data-theme="light"] .nowc{background:#fbfbf9;border-color:var(--line)}
html body:not([data-theme="light"]) .wscard, html body:not([data-theme="light"]) .wscomp{background:#1a1b1f;border-color:var(--line)}
/* ===== 03.10 · Права панель: зміна ширини + видима смуга, коли згорнута ===== */
html body #gal{width:var(--galw,286px)}
html body main{margin-right:var(--galw,286px)!important}
html body .ehandle.r{right:var(--galw,286px)}
html body.galoff main{margin-right:52px!important}
html body.galoff .ehandle.r{right:0}
#galRz{position:absolute;left:-4px;top:0;bottom:0;width:8px;cursor:col-resize;z-index:2}
#galRz:hover,#galRz.on{background:linear-gradient(90deg,transparent 3px,var(--line2) 3px,var(--line2) 5px,transparent 5px)}
.galrail{top:58px!important;right:0!important;bottom:0;width:44px;height:auto!important;justify-content:flex-start;flex-direction:column;align-items:center;gap:10px;padding:12px 0;border:none;border-left:1px solid var(--line);background:var(--panel)!important;color:var(--dim);cursor:pointer;border-radius:0}
.galrail svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
.galrail .grh{display:flex;flex-direction:column;gap:3px;margin-top:4px}.galrail .grh i{display:block;width:14px;height:2px;border-radius:2px;background:currentColor;opacity:.7}
.galrail .grl{writing-mode:vertical-rl;transform:rotate(180deg);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;margin-top:6px}
.galrail .grn{font-size:10px;font-weight:700;color:var(--tx);background:var(--card2);border-radius:999px;padding:1px 6px}
.galrail:hover{color:var(--tx)}
@media (max-width:760px){.galrail{display:none!important}}
/* 03.10 · Agent ON/OFF перемикач у панелі */
.agsw{display:inline-block;width:22px;height:12px;border-radius:999px;background:var(--line2);position:relative;margin-left:6px;vertical-align:middle;transition:.15s}
.agsw:after{content:"";position:absolute;top:2px;left:2px;width:8px;height:8px;border-radius:50%;background:var(--dim);transition:.15s}
.agsw.on{background:var(--tx)}.agsw.on:after{left:12px;background:var(--bg)}
@media(max-width:760px){html body main,html body.galoff main{margin-right:0!important}}
/* 08.10 · широка кнопка Generate: на всю ширину панелі вводу на комп'ютері й телефоні; ціна над нею праворуч */
body.tab-ws .wsright{flex-basis:100%;flex-wrap:wrap;justify-content:flex-end;row-gap:8px}
body.tab-ws .wsright .wsgo{flex:1 1 100%;order:9;min-height:48px;font-size:16px;border-radius:12px}

/* ===== 08.10 · Темна тема «кіно»: глибокий чорний, скляні панелі, синій світловий край, теплий градієнт на головній кнопці ===== */
html body:not([data-theme="light"]):not([data-theme="paper"]){
  --cine-blue:#4aa8ff;--cine-cyan:#5fe1ff;--cine-glass:rgba(22,24,30,.72);--cine-edge:rgba(255,255,255,.07);
  background:#07080b radial-gradient(1200px 600px at 78% -10%,rgba(56,120,255,.16),transparent 60%) fixed,
             radial-gradient(900px 500px at 10% 110%,rgba(80,60,255,.08),transparent 60%) fixed;}
html body:not([data-theme="light"]):not([data-theme="paper"]) #main,
html body:not([data-theme="light"]):not([data-theme="paper"]) .ws{background:transparent}
/* бокові панелі — скло з тонким краєм */
html body:not([data-theme="light"]):not([data-theme="paper"]) nav.snav,
html body:not([data-theme="light"]):not([data-theme="paper"]) aside#gal{background:linear-gradient(180deg,rgba(18,20,26,.78),rgba(10,11,15,.78));backdrop-filter:blur(14px);border-color:var(--cine-edge)}
html body:not([data-theme="light"]):not([data-theme="paper"]) nav.snav #nav button.act{background:linear-gradient(90deg,rgba(74,168,255,.16),rgba(74,168,255,.02));border:1px solid rgba(74,168,255,.28);box-shadow:inset 0 0 12px rgba(74,168,255,.12)}
/* панель вводу — скло + світловий промінь по верхньому краю */
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp{position:relative;background:var(--cine-glass);backdrop-filter:blur(18px) saturate(1.2);border:1px solid var(--cine-edge);
  box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.02) inset,0 -1px 0 rgba(255,255,255,.06) inset,0 0 60px rgba(74,168,255,.08)}
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp::before{content:"";position:absolute;left:8%;right:8%;top:-1px;height:2px;border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(95,225,255,.0) 5%,var(--cine-cyan) 45%,var(--cine-blue) 60%,transparent);filter:blur(.4px);box-shadow:0 0 18px 2px rgba(74,168,255,.55)}
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp:focus-within{border-color:rgba(74,168,255,.35);box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px rgba(74,168,255,.18),0 0 70px rgba(74,168,255,.16)}
html body:not([data-theme="light"]):not([data-theme="paper"]) #wsPrompt{background:transparent}
/* кнопки й списки — темне скло, синій край при наведенні */
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp .wsb,
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp .wss{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.08);color:#c9ced8;transition:border-color .2s,box-shadow .2s,color .2s}
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp .wsb:hover,
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp .wss:hover{border-color:rgba(74,168,255,.45);color:#fff;box-shadow:0 0 14px rgba(74,168,255,.18)}
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp .seg{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.08)}
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp .seg button.on{background:rgba(74,168,255,.14);color:#fff;box-shadow:inset 0 -2px 0 var(--cine-blue),0 0 16px rgba(74,168,255,.18)}
/* головна кнопка — теплий градієнт зі світінням */
html body:not([data-theme="light"]):not([data-theme="paper"]) .wsgo:not(.think){color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35);
  background:linear-gradient(100deg,#ffd76a 0%,#ffa144 38%,#ff6a3d 70%,#ff4a5c 100%);box-shadow:0 8px 30px rgba(255,120,60,.35),0 0 0 1px rgba(255,255,255,.18) inset;transition:transform .15s,box-shadow .2s,filter .2s}
html body:not([data-theme="light"]):not([data-theme="paper"]) .wsgo:not(.think):hover{transform:translateY(-1px);filter:saturate(1.15);box-shadow:0 12px 40px rgba(255,120,60,.5),0 0 0 1px rgba(255,255,255,.25) inset}
/* ціна — зелена «бирка», як +3.1% */
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp .wsprice{color:#7dffb0;background:rgba(40,200,120,.1);border:1px solid rgba(80,230,150,.25);padding:3px 9px;border-radius:999px;font-weight:600}
/* картки праворуч і плитки результатів — скло з синім ободом */
html body:not([data-theme="light"]):not([data-theme="paper"]) aside#gal > div > div:first-child,
html body:not([data-theme="light"]):not([data-theme="paper"]) .wscard{background:linear-gradient(160deg,rgba(28,32,42,.75),rgba(14,16,22,.75));border:1px solid rgba(255,255,255,.07);box-shadow:0 0 0 1px rgba(74,168,255,.06) inset,0 10px 30px rgba(0,0,0,.4)}
/* смуга прогресу — неоновий ціан */
html body:not([data-theme="light"]):not([data-theme="paper"]) .wsbar{background:rgba(255,255,255,.06)}
html body:not([data-theme="light"]):not([data-theme="paper"]) .wsbar i{background:linear-gradient(90deg,transparent,var(--cine-cyan),transparent);box-shadow:0 0 12px var(--cine-cyan)}
/* заголовок порожнього екрана — м'яке світіння */
html body:not([data-theme="light"]):not([data-theme="paper"]) .wsempty h2{background:linear-gradient(180deg,#fff,#aeb7c8);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
@media (prefers-reduced-motion:reduce){html body .wsgo{transition:none}}
html body:not([data-theme="light"]):not([data-theme="paper"]) #wsPrompt,html body:not([data-theme="light"]):not([data-theme="paper"]) #wsPrompt:focus{outline:none;border-color:transparent;box-shadow:none}
@media(max-width:760px){html body:not([data-theme="light"]):not([data-theme="paper"]) .wscomp .wsprice{flex:0 0 auto;margin-left:auto}}
/* світла тема: кнопки «New session» / «History» були темними плямами */
html body[data-theme="light"] .flsess button{background:var(--panel);border-color:var(--line);color:var(--tx)}

/* 12.10 (Володя: «на старті дуже маленьке вікно логіну») — поля й кнопка звичайного розміру, читається з телефона без зуму */
#login .box{width:min(92vw,440px);padding:32px 30px 26px;border-radius:20px}
#login h3{font-size:22px;letter-spacing:.04em;margin-bottom:6px}
#login .sub{font-size:14px;margin-bottom:20px}
#login input:not([type=checkbox]),#login select{display:block;width:100%;box-sizing:border-box;height:48px;padding:0 14px;margin:0 0 12px;font:inherit;font-size:16px;color:var(--tx,#eee);background:rgba(127,127,127,.08);border:1px solid var(--line2,#333);border-radius:12px;outline:none;transition:border-color .15s,box-shadow .15s}
#login input:not([type=checkbox]):focus,#login select:focus{border-color:var(--acc,#e8b86d);box-shadow:0 0 0 3px rgba(232,184,109,.18)}
#login input::placeholder{color:var(--dim,#888);opacity:1}
#login #lgBtn{height:48px;font-size:16px;border-radius:12px;margin-top:6px}
#login #lgGoogle{min-height:48px;font-size:15px;border-radius:12px!important}
#login #lgSwap{font-size:14px;padding:6px 0}
#login .err{font-size:13.5px}

/* 14.10 шаблони */
.rwtplg{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
.rwtplb{text-align:left;padding:10px 12px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:rgba(255,255,255,.03);color:inherit;cursor:pointer;display:flex;flex-direction:column;gap:4px}
.rwtplb:hover{border-color:rgba(255,255,255,.4)}
.rwtplb small{opacity:.65;font-size:12px}

/* 15.10 scenes */
.rwscn{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.rwscn-i{border:1px solid var(--line2);border-radius:12px;padding:8px;background:rgba(127,127,127,.06)}
.rwscn-f{aspect-ratio:16/9;background:#000;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.rwscn-f img{width:100%;height:100%;object-fit:contain}
.rwscn-t{font-size:12px;margin:6px 0 4px;opacity:.85}
.rwscn-b{display:flex;gap:6px;flex-wrap:wrap}