/* ===== Lokizenith v2.2 additions · made by Lokiz Studios ===== */
/* ---- changelog ---- */
.btn-changelog{margin-top:6px}
.btn-changelog::before{animation-delay:-1s!important;opacity:.45}
.cl-badge{display:none;width:9px;height:9px;border-radius:50%;background:#ff5b7a;box-shadow:0 0 0 0 rgba(255,91,122,.7);animation:clPulse 1.8s infinite}
.btn-changelog.has-new .cl-badge{display:block}
@keyframes clPulse{0%{box-shadow:0 0 0 0 rgba(255,91,122,.6)}70%{box-shadow:0 0 0 9px rgba(255,91,122,0)}100%{box-shadow:0 0 0 0 rgba(255,91,122,0)}}
.cl-intro{color:var(--mut,#9cc4b2);margin:0 0 14px}
.cl-timeline{position:relative;padding-inline-start:26px}
.cl-timeline::before{content:"";position:absolute;inset-inline-start:8px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--acc),rgba(var(--acc-rgb),.08));border-radius:2px}
.cl-item{position:relative;margin-bottom:16px;opacity:0;transform:translateY(14px);animation:clIn .6s var(--ease,ease) forwards;animation-delay:var(--d)}
@keyframes clIn{to{opacity:1;transform:none}}
.cl-dot{position:absolute;inset-inline-start:-24px;top:16px;width:14px;height:14px;border-radius:50%;background:#030806;border:2px solid var(--acc);box-shadow:0 0 12px rgba(var(--acc-rgb),.6)}
.cl-item.latest .cl-dot{background:var(--acc);animation:clPulse2 2s infinite}
@keyframes clPulse2{50%{box-shadow:0 0 22px rgba(var(--acc-rgb),.95)}}
.cl-box{padding:14px 16px;border-radius:16px;background:linear-gradient(135deg,rgba(var(--acc-rgb),.07),rgba(0,0,0,.35));border:1px solid var(--line,rgba(255,255,255,.08))}
.cl-item.latest .cl-box{border-color:rgba(var(--acc-rgb),.45);box-shadow:0 0 34px rgba(var(--acc-rgb),.12)}
.cl-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cl-ver{font-family:'JetBrains Mono',monospace;font-weight:700;color:#04140c;background:var(--acc);padding:2px 9px;border-radius:999px;font-size:.8rem}
.cl-new{font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--acc);border:1px solid rgba(var(--acc-rgb),.5);padding:2px 8px;border-radius:999px}
.cl-date{margin-inline-start:auto;color:var(--mut,#9cc4b2);font-size:.8rem}
.cl-box h3{margin:8px 0 6px;font-size:1.05rem}
.cl-sec h4{margin:10px 0 4px;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;opacity:.85}
.cl-sec.n h4{color:var(--acc)} .cl-sec.f h4{color:#ffd166} .cl-sec.c h4{color:#7cc8ff}
.cl-sec ul{margin:0;padding-inline-start:18px;display:grid;gap:3px;font-size:.9rem;line-height:1.5}
.whatsnew{position:fixed;z-index:120;top:calc(68px + env(safe-area-inset-top));inset-inline-end:18px;display:flex;align-items:center;gap:12px;max-width:min(440px,calc(100vw - 24px));padding:12px 12px 12px 14px;border-radius:18px;background:rgba(6,18,12,.96);border:1px solid rgba(var(--acc-rgb),.5);box-shadow:0 18px 50px rgba(0,0,0,.6),0 0 30px rgba(var(--acc-rgb),.18);animation:wnIn .6s var(--spring,cubic-bezier(.2,1.4,.4,1))}
.whatsnew.out{animation:wnIn .35s reverse both}
@keyframes wnIn{from{opacity:0;transform:translateY(30px) scale(.95)}}
.whatsnew .wn-ic{font-size:1.6rem}
.whatsnew b{display:block}.whatsnew small{display:block;color:var(--mut,#9cc4b2)}
.whatsnew .btn-primary{white-space:nowrap;padding:8px 12px}
.whatsnew .wn-x{width:30px;height:30px;border-radius:50%;opacity:.7}
/* ---- auto-growing prompt boxes ---- */
.composer textarea,#lcPrompt,#lsInput,.autogrow{max-height:40vh;max-height:40dvh;overflow-y:hidden;overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap}
.composer textarea{flex:1 1 120px}
/* ---- location prompt ---- */
.geo-ask{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:16px;background:rgba(0,6,3,.62);backdrop-filter:blur(6px);animation:geoIn .3s ease}
.geo-ask.out{animation:geoOut .3s ease forwards}
@keyframes geoIn{from{opacity:0}}@keyframes geoOut{to{opacity:0}}
.geo-card{width:min(420px,100%);text-align:center;padding:26px 22px 18px;border-radius:24px;background:linear-gradient(160deg,rgba(var(--acc-rgb),.12),rgba(6,16,11,.96) 45%);border:1px solid rgba(var(--acc-rgb),.35);box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 60px rgba(var(--acc-rgb),.15);animation:geoPop .5s cubic-bezier(.2,1.4,.4,1)}
@keyframes geoPop{from{transform:translateY(30px) scale(.9);opacity:0}}
.geo-card h3{margin:14px 0 6px;font-size:1.25rem}.geo-card p{margin:0 0 16px;color:var(--dim);line-height:1.55;font-size:.93rem}.geo-card small{display:block;margin-top:12px;color:var(--dim);font-size:.76rem}
.geo-acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.geo-acts button{min-height:44px;padding:0 18px}
.geo-anim{position:relative;width:110px;height:110px;margin:0 auto}
.geo-ring{position:absolute;inset:0;margin:auto;width:30px;height:30px;top:40px;border-radius:50%;border:2px solid var(--acc);opacity:0;animation:geoRing 2.4s ease-out infinite}
.geo-ring:nth-child(2){animation-delay:.8s}.geo-ring:nth-child(3){animation-delay:1.6s}
@keyframes geoRing{0%{transform:scale(.4);opacity:.9}100%{transform:scale(3.4);opacity:0}}
.geo-pin{position:absolute;left:50%;top:10px;width:54px;height:54px;margin-left:-27px;animation:geoBob 1.6s ease-in-out infinite;filter:drop-shadow(0 0 14px rgba(var(--acc-rgb),.8))}
.geo-pin svg{width:100%;height:100%;fill:var(--acc)}
@keyframes geoBob{50%{transform:translateY(-10px)}}
.geo-inline{margin-top:8px}.geo-inline .ok{color:var(--acc)}
/* ---- place cards ---- */
.places{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:10px;width:100%}
.pl-card{border-radius:18px;overflow:hidden;background:rgba(8,22,15,.85);border:1px solid rgba(var(--acc-rgb),.18);display:flex;flex-direction:column;animation:plIn .5s calc(var(--i)*80ms) both cubic-bezier(.2,.9,.3,1);transition:transform .2s,border-color .2s}
.pl-card:hover{transform:translateY(-3px);border-color:rgba(var(--acc-rgb),.45)}
@keyframes plIn{from{opacity:0;transform:translateY(14px)}}
.pl-media{position:relative;aspect-ratio:16/9;background:#04110a;cursor:pointer;overflow:hidden}
.pl-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s}.pl-media img.on{opacity:1}
.pl-rank{position:absolute;top:8px;inset-inline-start:8px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:var(--acc);color:#02120a;box-shadow:0 0 12px rgba(var(--acc-rgb),.6)}
.pl-dist{position:absolute;bottom:8px;inset-inline-end:8px;padding:3px 9px;border-radius:99px;background:rgba(0,0,0,.65);backdrop-filter:blur(6px);font-size:.78rem;font-weight:600}
.pl-dots{position:absolute;bottom:10px;inset-inline-start:10px;display:flex;gap:4px}.pl-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.4)}.pl-dots i.on{background:#fff}
.pl-body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1}
.pl-type{font-size:.76rem;color:var(--acc);text-transform:capitalize;font-weight:600}
.pl-body h4{margin:0;font-size:1.05rem;line-height:1.3}.pl-alt{font-size:.8rem;color:var(--dim);margin-top:-4px}
.pl-why{margin:0;font-size:.86rem;color:#cfeee0;line-height:1.45}
.pl-stars{color:#ffd166;font-size:.9rem}.pl-stars small{color:var(--dim)}
.pl-info{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;font-size:.8rem;color:var(--dim)}
.pl-info li{display:flex;gap:6px;align-items:baseline;overflow-wrap:anywhere}.pl-info a{color:var(--acc);text-decoration:none}.pl-info b.open{color:#4dff9a}.pl-info b.shut{color:#ff7b93}
.pl-acts{display:flex;gap:8px;margin-top:auto;padding-top:8px;flex-wrap:wrap}.pl-acts>*{flex:1 1 auto;min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;font-size:.85rem;white-space:nowrap}
/* ---- route card ---- */
.route-card{margin-top:10px;width:100%;border-radius:18px;overflow:hidden;background:rgba(8,22,15,.9);border:1px solid rgba(var(--acc-rgb),.25)}
.rc-head{display:flex;gap:10px;align-items:center;padding:12px 14px}.rc-ic{font-size:1.4rem}.rc-t{display:flex;flex-direction:column;min-width:0}.rc-t small{color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-map{height:300px;background:#0a0f0d;position:relative}.rc-loading{position:absolute;inset:0;display:grid;place-items:center;font-size:2rem;animation:geoBob 1.4s infinite}
.rc-map .leaflet-container{background:#0a0f0d}.route-card .leaflet-control-attribution{background:rgba(0,0,0,.6);color:#9ab}.route-card .leaflet-control-attribution a{color:var(--acc)}
.rc-pin.me i{display:block;width:18px;height:18px;margin:6px;border-radius:50%;background:#3da5ff;border:3px solid #fff;box-shadow:0 0 0 6px rgba(61,165,255,.3);animation:mePulse 2s infinite}
@keyframes mePulse{50%{box-shadow:0 0 0 12px rgba(61,165,255,.1)}}
.rc-pin.dest svg{width:30px;height:30px;fill:var(--acc);filter:drop-shadow(0 0 8px rgba(var(--acc-rgb),.9));transform:translateY(-12px)}
.rc-modes{display:flex;gap:8px;padding:10px 12px}
.rc-modes button{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:9px 12px;min-height:56px;border-radius:14px;border:1px solid rgba(var(--acc-rgb),.18);background:rgba(255,255,255,.03);color:inherit;cursor:pointer;font:inherit;transition:.2s}
.rc-modes button b{font-size:1.1rem}.rc-modes button small{color:var(--dim)}.rc-modes button.on{border-color:var(--acc);background:rgba(var(--acc-rgb),.12);box-shadow:0 0 18px rgba(var(--acc-rgb),.18)}
.rc-steps{margin:0 12px;border-top:1px solid rgba(255,255,255,.06)}.rc-steps summary{cursor:pointer;padding:10px 2px;font-weight:600;min-height:44px;display:flex;align-items:center;gap:6px}.rc-steps .n{color:var(--dim);font-weight:400}
.rc-steps ol{list-style:none;margin:0;padding:0 0 8px;max-height:260px;overflow:auto}.rc-steps li{display:flex;gap:10px;align-items:center;padding:7px 2px;border-bottom:1px solid rgba(255,255,255,.04);font-size:.86rem}
.rc-steps .ar{width:26px;text-align:center}.rc-steps .tx{flex:1}.rc-steps .dd{color:var(--dim);font-size:.78rem;white-space:nowrap}
.rc-go{display:flex;align-items:center;justify-content:center;margin:10px 12px 12px;min-height:46px;text-decoration:none;border-radius:14px}
@media (max-width:640px){.places{grid-template-columns:1fr}.rc-map{height:240px}}
.rc-map .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.88) saturate(.55)}
.pl-acts a.pl-gm,.pl-acts a.pl-gm:visited{color:#e6fff3;background:rgba(255,255,255,.06);border:1px solid rgba(var(--acc-rgb),.35);border-radius:12px;font-weight:600}
.pl-acts a.pl-gm:hover{background:rgba(var(--acc-rgb),.14);border-color:var(--acc);color:#fff}
.pl-acts .pl-nav{border-radius:12px}

/* ===== map attribution on dark ===== */
.rc-map .leaflet-control-attribution{background:rgba(3,10,7,.72)!important;color:#9fb8ab!important;backdrop-filter:blur(4px)}
.rc-map .leaflet-control-attribution a{color:#7dffcf!important}

/* ===== v2.2 tool cards ===== */
.chat-quiz{margin-top:10px}
.wx-card,.fx-card,.qr-card,.tm-card,.rx-card,.mm-card,.rc-recipes,.ocr-card,.pal-card{margin-top:10px;border:1px solid rgba(var(--acc-rgb),.22);border-radius:18px;background:linear-gradient(160deg,rgba(var(--acc-rgb),.07),rgba(255,255,255,.015));padding:14px;max-width:640px;animation:plIn .45s cubic-bezier(.2,.8,.2,1) both}
.wx-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.wx-ic{font-size:46px;filter:drop-shadow(0 4px 14px rgba(var(--acc-rgb),.35));animation:wxFloat 4s ease-in-out infinite}
@keyframes wxFloat{50%{transform:translateY(-4px)}}
.wx-t{font-size:40px;font-weight:800;line-height:1}
.wx-l{color:var(--mut,#9fb8ab);font-size:13px;margin-top:2px}
.wx-meta{list-style:none;margin:0 0 0 auto;padding:0;display:flex;gap:10px;font-size:13px;color:var(--mut,#9fb8ab);flex-wrap:wrap}
.wx-spark{width:100%;height:70px;display:block;margin:10px 0 2px}
.wx-hours{display:flex;justify-content:space-between;font-size:12px;overflow-x:auto;gap:6px}
.wx-hours span{display:flex;flex-direction:column;align-items:center;min-width:40px}
.wx-hours small{opacity:.6}.wx-hours i{font-style:normal;font-size:10px;color:#7dc8ff;min-height:12px}
.wx-days{margin-top:10px;border-top:1px solid rgba(255,255,255,.06);padding-top:6px}
.wx-days div{display:grid;grid-template-columns:52px 30px 1fr auto;align-items:center;gap:8px;padding:5px 2px;font-size:14px}
.wx-days .pp{color:#7dc8ff;font-size:12px}.wx-days .mm b{margin-inline-end:4px}
.fx-card{display:grid;gap:8px;max-width:420px}
.fx-row{display:flex;gap:8px;align-items:center}
.fx-row input,.fx-row output,.fx-row select{min-height:46px;border-radius:12px;border:1px solid rgba(var(--acc-rgb),.25);background:rgba(0,0,0,.35);color:inherit;font:inherit;padding:0 12px}
.fx-row input,.fx-row output{flex:1;min-width:0;font-size:20px;font-weight:700;display:flex;align-items:center}
.fx-row output{color:var(--acc)}
.fx-row select{width:110px}
.fx-sw{justify-self:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(var(--acc-rgb),.35);background:rgba(var(--acc-rgb),.1);color:var(--acc);font-size:18px;cursor:pointer;transition:transform .3s}
.fx-sw:hover{transform:rotate(180deg)}
.fx-src{opacity:.55;font-size:11px}
.qr-card{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.qr-img canvas{width:200px;height:200px;border-radius:14px;display:block;box-shadow:0 0 30px rgba(var(--acc-rgb),.25)}
.qr-side{flex:1;min-width:180px;display:grid;gap:10px}
.qr-txt{font-size:13px;word-break:break-all;opacity:.8}
.qr-acts{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.qr-acts label{display:flex;align-items:center;gap:6px;font-size:13px}
.qr-acts input[type=color]{width:34px;height:30px;border:0;background:none;padding:0}
.tm-card{display:flex;gap:16px;align-items:center;max-width:460px}
.tm-ring{position:relative;width:110px;height:110px;flex:none}
.tm-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.tm-ring circle{fill:none;stroke:rgba(255,255,255,.08);stroke-width:9}
.tm-ring .v{stroke:var(--acc);stroke-linecap:round;transition:stroke-dashoffset .25s linear;filter:drop-shadow(0 0 6px rgba(var(--acc-rgb),.6))}
.tm-num{position:absolute;inset:0;display:grid;place-items:center;font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}
.tm-card.done .tm-num{color:var(--acc);animation:tmPop .6s}
@keyframes tmPop{40%{transform:scale(1.25)}}
.tm-side{display:grid;gap:6px}.tm-at{opacity:.6}.tm-acts{display:flex;gap:8px;flex-wrap:wrap}
.rx-top{display:flex;align-items:center;gap:4px;font-family:var(--mono,monospace);color:var(--acc)}
.rx-top input{min-height:44px;border-radius:10px;border:1px solid rgba(var(--acc-rgb),.25);background:rgba(0,0,0,.35);color:#e6fff3;font:14px var(--mono,monospace);padding:0 10px}
.rx-p{flex:1;min-width:0}.rx-p.bad{border-color:#ff5c7a!important}.rx-f{width:64px}
.rx-s,.rx-out{width:100%;margin-top:8px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.3);color:inherit;font:13px/1.6 var(--mono,monospace);padding:10px;box-sizing:border-box;white-space:pre-wrap;word-break:break-word}
.rx-out mark{background:rgba(var(--acc-rgb),.3);color:#fff;border-radius:3px;box-shadow:0 0 0 1px rgba(var(--acc-rgb),.6)}
.rx-info{font-size:12px;opacity:.75;margin-top:6px}.rx-info code{background:rgba(255,255,255,.07);padding:1px 5px;border-radius:5px}
.rx-exp{font-size:14px;margin-bottom:8px}
.mm-view{background:rgba(0,0,0,.25);border-radius:12px;padding:12px;overflow:auto;text-align:center;min-height:80px}
.mm-view svg{max-width:100%;height:auto}
.mm-acts,.ocr-acts,.pal-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.mm-code{font-size:12px;max-height:240px;overflow:auto;background:rgba(0,0,0,.35);padding:10px;border-radius:10px;margin-top:8px}
.rc-recipes{display:grid;gap:10px;padding:10px}
.rcp{border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(0,0,0,.2);overflow:hidden}
.rcp summary{display:flex;gap:12px;align-items:center;padding:12px;cursor:pointer;list-style:none;min-height:44px}
.rcp summary::-webkit-details-marker{display:none}
.rcp-e{font-size:30px}.rcp-h{display:grid}.rcp-h small{opacity:.65}
.rcp[open] summary{background:rgba(var(--acc-rgb),.07)}
.rcp-d{margin:10px 14px 0;opacity:.85}
.rcp-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:14px;padding:6px 14px 14px}
.rcp h5{margin:8px 0 6px;color:var(--acc);font-size:13px;text-transform:uppercase;letter-spacing:.06em}
.rcp-ing{list-style:none;padding:0;margin:0}.rcp-ing li{padding:3px 0}.rcp-ing li.extra span{color:#ffcf7d}
.rcp-ing input:checked+span{text-decoration:line-through;opacity:.5}
.rcp-st{margin:0;padding-inline-start:20px}.rcp-st li{padding:4px 0;cursor:pointer}.rcp-st li.done{opacity:.45;text-decoration:line-through}
.ocr-h{font-weight:700;margin-bottom:8px}.ocr-h small{opacity:.6;font-weight:400}
.ocr-t{width:100%;box-sizing:border-box;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.3);color:inherit;font:14px/1.55 inherit;padding:10px;resize:vertical}
.pal-bar{display:flex;height:56px;border-radius:12px;overflow:hidden}
.pal-sw{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;margin-top:10px}
.pal-sw button{background:var(--c);border:0;border-radius:12px;min-height:64px;cursor:pointer;display:grid;place-content:center;font:inherit;transition:transform .2s}
.pal-sw button:hover{transform:translateY(-3px)}.pal-sw small{opacity:.75}
.it-drop{display:grid;place-items:center;gap:10px;border:2px dashed rgba(var(--acc-rgb),.35);border-radius:16px;padding:20px;cursor:pointer;min-height:120px;text-align:center}
.it-drop.over{background:rgba(var(--acc-rgb),.08)}.it-drop img{max-width:100%;max-height:240px;border-radius:10px}
.cv-k.on{background:rgba(var(--acc-rgb),.18);border-color:var(--acc)}
@media(max-width:640px){.rcp-cols{grid-template-columns:1fr}.tm-ring{width:90px;height:90px}.qr-img canvas{width:170px;height:170px}.wx-meta{margin:0}.fx-row select{width:96px}}
.wx-days span{white-space:nowrap;line-height:1.3}.wx-days div{padding:4px 2px}
.fx-row input{width:0}.fx-card{box-sizing:border-box;width:100%}

/* ===================== Loki mascot ===================== */
.mz{--size:56px;--px:0;--py:0;--tilt:0deg;--x:0px;--dir:1;width:var(--size);height:calc(var(--size)*1.1);position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none;user-select:none}
.mz:focus-visible{filter:drop-shadow(0 0 0 2px var(--acc))}
.mz-move{width:100%;height:100%;transform:translateX(var(--x));will-change:transform}
.mz-flip{width:100%;height:100%;transition:transform .3s}
.mz.walk .mz-flip{transform:scaleX(var(--dir))}
.mz-svg{width:100%;height:100%;overflow:visible;display:block}
.mz-shadow{fill:#000;opacity:.35;transform-origin:60px 126px;animation:mzShadow 3.2s ease-in-out infinite}
.mz-body{transform-origin:60px 118px;transform-box:view-box;animation:mzBob 3.2s ease-in-out infinite;transition:transform .35s}
.mz-face{transform:translate(calc(var(--px)*.55px),calc(var(--py)*.5px));transition:transform .25s ease-out;transform-box:view-box}
.mz-pu,.mz-gl{transform:translate(calc(var(--px)*1px),calc(var(--py)*1px));transition:transform .18s ease-out}
.mz-ew{fill:var(--acc,#00ff9c)}.mz-pu{fill:#021209}.mz-gl{fill:#fff;opacity:.9}
.mz-lid{transform-box:fill-box;transform-origin:center;transition:transform .12s}
.mz.blink .mz-lid{transform:scaleY(.08)}
.mz-he,.mz-xe{fill:none;stroke:var(--acc,#00ff9c);stroke-width:3.6;stroke-linecap:round;opacity:0}
.mz-brow{fill:none;stroke:var(--acc,#00ff9c);stroke-width:2.6;stroke-linecap:round;opacity:.0;transition:transform .3s,opacity .3s;transform-box:fill-box;transform-origin:center}
.mz-cheek{fill:#ff7eb6;opacity:0;transition:opacity .3s}
.mz-m{opacity:0;transition:opacity .15s}
.mz-m.smile,.mz-m.frown,.mz-m.flat{fill:none;stroke:var(--acc,#00ff9c);stroke-width:3;stroke-linecap:round}
.mz-m.grin{fill:var(--acc,#00ff9c)}.mz-m.o,.mz-m.talk{fill:var(--acc,#00ff9c)}
.mz-m.talk{transform-box:fill-box;transform-origin:center}
.mz[data-s=idle] .mz-m.smile,.mz[data-s=curious] .mz-m.smile,.mz[data-s=listening] .mz-m.smile,.mz[data-s=waving] .mz-m.grin{opacity:1}
.mz-arm{transform-box:view-box;transition:transform .4s}
.mz-arm.l{transform-origin:26px 80px}.mz-arm.r{transform-origin:94px 80px}
.mz-horn{transform-box:fill-box;transition:transform .4s}
.mz-horn.l{transform-origin:100% 100%}.mz-horn.r{transform-origin:0 100%}
.mz-think,.mz-spark,.mz-z,.mz-sweat{opacity:0;transition:opacity .3s}
.mz-think circle{fill:#bfffe4}
.mz-spark path{fill:#ffe36e}
.mz-z text{fill:#bfffe4;font:700 11px Inter,sans-serif}
.mz-sweat{fill:#7dd3ff}
/* curious — head tilt, eyes wander */
.mz[data-s=curious] .mz-body,.mz[data-s=listening] .mz-body{animation:none;transform:rotate(var(--tilt))}
.mz[data-s=curious] .mz-brow.r{opacity:1;transform:translateY(-2px) rotate(-8deg)}
.mz[data-s=curious] .mz-eye.l .mz-lid{transform:scale(.9)}
.mz[data-s=listening] .mz-brow{opacity:1;transform:translateY(-2px)}
.mz[data-s=listening] .mz-horn.l{animation:mzEar 1.4s ease-in-out infinite}.mz[data-s=listening] .mz-horn.r{animation:mzEar 1.4s ease-in-out infinite reverse}
/* happy — ^^ eyes, grin, blush, sparkles, bounce */
.mz[data-s=happy] .mz-lid,.mz[data-s=love] .mz-lid{opacity:0}
.mz[data-s=happy] .mz-he,.mz[data-s=love] .mz-he{opacity:1}
.mz[data-s=happy] .mz-m.grin,.mz[data-s=love] .mz-m.grin{opacity:1}
.mz[data-s=happy] .mz-cheek,.mz[data-s=love] .mz-cheek,.mz[data-s=waving] .mz-cheek{opacity:.85}
.mz[data-s=happy] .mz-spark,.mz[data-s=love] .mz-spark{opacity:1;animation:mzTwinkle .9s ease-in-out infinite alternate}
.mz[data-s=happy] .mz-body{animation:mzHop .55s cubic-bezier(.3,.6,.4,1) 3}
.mz[data-s=happy] .mz-arm.l{transform:rotate(55deg)}.mz[data-s=happy] .mz-arm.r{transform:rotate(-55deg)}
.mz[data-s=love] .mz-he{stroke:#ff7eb6}
.mz[data-s=love] .mz-body{animation:mzWiggle .5s ease-in-out 4}
/* waving */
.mz[data-s=waving] .mz-arm.r{animation:mzWave .42s ease-in-out infinite alternate}
.mz[data-s=waving] .mz-body{animation:mzBob 1.6s ease-in-out infinite}
/* thinking — eyes up, brow raised, thought dots, hand on chin */
.mz[data-s=thinking] .mz-m.flat{opacity:1}
.mz[data-s=thinking] .mz-brow.l{opacity:1;transform:translateY(-3px) rotate(-10deg)}
.mz[data-s=thinking] .mz-brow.r{opacity:1;transform:translateY(1px)}
.mz[data-s=thinking] .mz-think{opacity:1}
.mz[data-s=thinking] .mz-think circle{animation:mzDot 1.2s ease-in-out infinite}
.mz[data-s=thinking] .mz-think circle:nth-child(2){animation-delay:.2s}.mz[data-s=thinking] .mz-think circle:nth-child(3){animation-delay:.4s}
.mz[data-s=thinking] .mz-arm.r{transform:rotate(-62deg)}
.mz[data-s=thinking] .mz-body{animation:mzSway 2.4s ease-in-out infinite}
/* talking */
.mz[data-s=talking] .mz-m.talk{opacity:1;animation:mzTalk .22s ease-in-out infinite alternate}
.mz[data-s=talking] .mz-body{animation:mzBob 1.1s ease-in-out infinite}
.mz[data-s=talking] .mz-brow{opacity:.8}
/* surprised */
.mz[data-s=surprised] .mz-m.o{opacity:1}
.mz[data-s=surprised] .mz-lid{transform:scale(1.18)}
.mz[data-s=surprised] .mz-brow{opacity:1;transform:translateY(-5px)}
.mz[data-s=surprised] .mz-body{animation:mzJump .5s cubic-bezier(.2,.9,.3,1.4)}
.mz[data-s=surprised] .mz-arm.l{transform:rotate(40deg)}.mz[data-s=surprised] .mz-arm.r{transform:rotate(-40deg)}
/* oops / sad */
.mz[data-s=oops] .mz-m.frown{opacity:1}
.mz[data-s=oops] .mz-brow.l{opacity:1;transform:rotate(-18deg) translateY(-1px)}.mz[data-s=oops] .mz-brow.r{opacity:1;transform:rotate(18deg) translateY(-1px)}
.mz[data-s=oops] .mz-lid{transform:scaleY(.72) translateY(1.5px)}
.mz[data-s=oops] .mz-sweat{opacity:1;animation:mzDrip 1.4s ease-in infinite}
.mz[data-s=oops] .mz-body{animation:none;transform:translateY(3px) scaleY(.96)}
.mz[data-s=oops] .mz-horn.l{transform:rotate(-14deg)}.mz[data-s=oops] .mz-horn.r{transform:rotate(14deg)}
/* sleepy */
.mz[data-s=sleepy] .mz-lid{transform:scaleY(.12)}
.mz[data-s=sleepy] .mz-m.flat{opacity:1}
.mz[data-s=sleepy] .mz-z{opacity:1}.mz[data-s=sleepy] .mz-z text{animation:mzZ 2.4s ease-in-out infinite}.mz[data-s=sleepy] .mz-z text:nth-child(2){animation-delay:1.2s}
.mz[data-s=sleepy] .mz-body{animation:mzBreath 3.6s ease-in-out infinite}
.mz.spin .mz-flip{animation:mzSpin .85s cubic-bezier(.4,1.4,.5,1)}
.mz.walk .mz-body{animation:mzWalk .32s ease-in-out infinite}
@keyframes mzBob{50%{transform:translateY(-3px)}}
@keyframes mzShadow{50%{transform:scaleX(.88);opacity:.25}}
@keyframes mzHop{40%{transform:translateY(-12px) scale(1.03,.97)}70%{transform:translateY(0) scale(1.05,.95)}}
@keyframes mzJump{30%{transform:translateY(-10px) scale(.96,1.06)}}
@keyframes mzWave{from{transform:rotate(-100deg)}to{transform:rotate(-150deg)}}
@keyframes mzSway{50%{transform:rotate(-4deg)}}
@keyframes mzWiggle{25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}
@keyframes mzTalk{from{transform:scaleY(.35)}to{transform:scaleY(1.25)}}
@keyframes mzDot{50%{opacity:.25;transform:translateY(-2px)}}
@keyframes mzTwinkle{to{opacity:.35}}
@keyframes mzDrip{0%{transform:translateY(-3px);opacity:0}30%{opacity:1}100%{transform:translateY(10px);opacity:0}}
@keyframes mzZ{0%{opacity:0;transform:translate(0,4px)}50%{opacity:1}100%{opacity:0;transform:translate(6px,-8px)}}
@keyframes mzBreath{50%{transform:scale(1.025,.975) translateY(1px)}}
@keyframes mzSpin{to{transform:rotate(360deg)}}
@keyframes mzWalk{50%{transform:translateY(-4px) rotate(calc(var(--dir)*3deg))}}
@keyframes mzEar{50%{transform:rotate(8deg)}}
.mz-say{position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%) scale(.6);transform-origin:50% 100%;opacity:0;white-space:nowrap;background:#e9fff5;color:#04140d;font:600 13px/1.2 Inter,sans-serif;padding:7px 11px;border-radius:14px;box-shadow:0 6px 20px rgba(0,0,0,.35);pointer-events:none;transition:transform .3s cubic-bezier(.3,1.5,.5,1),opacity .2s;z-index:5}
.mz-say::after{content:"";position:absolute;top:100%;left:50%;margin-left:-6px;border:6px solid transparent;border-top-color:#e9fff5}
.mz-say.in{opacity:1;transform:translateX(-50%) scale(1)}
/* welcome screen */
.hero-orb.has-mz{width:124px;height:132px}
.hero-orb.has-mz .core,.hero-orb.has-mz .ring{opacity:0}
.hero-orb.has-mz .mz{position:absolute;left:50%;top:0;transform:translateX(-50%)}
.hero-orb.has-mz::after{content:"";position:absolute;inset:20% 10% 0;border-radius:50%;background:radial-gradient(rgba(var(--acc-rgb),.28),transparent 70%);z-index:-1;filter:blur(8px)}
/* composer dock */
.mz-dock{position:absolute;bottom:calc(100% - 14px);inset-inline:28px;height:56px;pointer-events:none;z-index:3}
.mz-dock .mz{pointer-events:auto;position:absolute;bottom:0;inset-inline-start:0}
.mz-dock[hidden]{display:none}
/* voice call */
.co-stage.has-mz{position:relative}
.co-stage.has-mz .co-orb .core{opacity:.0}
.co-stage.has-mz .mz{position:absolute;left:50%;top:50%;transform:translate(-50%,-52%);z-index:2}
/* settings preview */
.mz-pre{display:grid;place-items:center;padding:16px 0 6px;min-height:120px}
.mz-try{flex-wrap:wrap}
.mz-off .mz-dock,.mz-off .hero-orb .mz,.mz-off .co-stage .mz{display:none}
.mz-off .hero-orb.has-mz .core,.mz-off .hero-orb.has-mz .ring{opacity:1}
@media (prefers-reduced-motion:reduce){.mz *{animation-duration:.01s!important;animation-iteration-count:1!important}}
.reduce-motion .mz *{animation:none!important}
@media(max-width:640px){.mz-dock{inset-inline:14px;height:48px;bottom:calc(100% - 10px)}.mz-dock .mz{--size:40px!important}.hero-orb.has-mz{width:104px;height:112px}.hero-orb.has-mz .mz{--size:96px!important}}
.mz-dock .mz-say{left:0;transform:scale(.6);transform-origin:12px 100%}
.mz-dock .mz-say.in{transform:scale(1)}
.mz-dock .mz-say::after{left:20px;margin-left:0}
[dir=rtl] .mz-dock .mz-say{left:auto;right:0;transform-origin:calc(100% - 12px) 100%}
[dir=rtl] .mz-dock .mz-say::after{left:auto;right:20px}
/* modals never wider than the screen; settings tabs cover the scroll padding */
.modal{grid-template-columns:minmax(0,1fr)}
.modal-card{min-width:0;max-width:100%;justify-self:center}
.modal-body{min-width:0}
.set-tabs{top:-18px!important;padding-top:14px!important;background:#07130d!important;box-shadow:0 10px 12px -6px #07130d}
@media(max-width:640px){
  .modal{padding:0;align-items:end}
  .modal-card,.modal-card.wide{width:100%;max-height:calc(100dvh - 24px);border-radius:22px 22px 0 0;border-bottom:0;padding-bottom:env(safe-area-inset-bottom)}
  .modal-card::before{content:"";display:block;width:40px;height:4px;border-radius:4px;background:rgba(255,255,255,.22);margin:8px auto -4px}
  .modal-body{padding:14px 16px 22px}
  .set-tabs{top:-14px!important}
}
.whatsnew>span:nth-child(2){min-width:0;flex:1}
.whatsnew{box-sizing:border-box}
@media(max-width:640px){.whatsnew{inset-inline:12px;max-width:none;gap:10px;padding:10px 12px}.whatsnew .wn-ic{font-size:1.3rem}.whatsnew .btn-primary{padding:8px 10px;font-size:.85rem}.whatsnew .wn-x{width:44px;height:44px;margin:-7px -8px -7px -6px}}
.seg[data-seg=bgStyle]{display:flex;flex-wrap:wrap;gap:2px;max-width:420px}
.set-row:has(.seg[data-seg=bgStyle]){flex-wrap:wrap;gap:10px}

/* ===== Design assistant ===== */
.dz-intro{color:var(--muted);margin:-4px 0 12px;font-size:.92em}
.dz-form{display:flex;gap:8px;align-items:flex-end;background:rgba(var(--acc-rgb),.05);border:1px solid var(--line);border-radius:16px;padding:8px}
.dz-form textarea{flex:1;min-width:0;resize:none;background:transparent;border:0;outline:0;color:var(--text);font:inherit;line-height:1.45;padding:8px 6px;min-height:44px;max-height:40vh;overflow-y:auto}
.dz-form .dz-go{min-height:44px;white-space:nowrap;flex:none}
.dz-ex{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.chip-s{background:rgba(var(--acc-rgb),.06);border:1px solid var(--line);color:var(--text);border-radius:999px;padding:7px 12px;font-size:.84em;cursor:pointer;min-height:36px}
.chip-s:hover{border-color:rgba(var(--acc-rgb),.5)}
.dz-work:empty{display:none}.dz-work{margin:8px 0}
.dz-note{margin-top:8px;padding:10px 12px;border-radius:12px;background:rgba(var(--acc-rgb),.08);border:1px solid rgba(var(--acc-rgb),.25);font-size:.92em}
.dz-note.err{background:rgba(255,80,80,.08);border-color:rgba(255,80,80,.35)}
.dz-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:16px 0 8px;flex-wrap:wrap}
.dz-head span{display:flex;gap:6px}.dz-head .btn-ghost{min-height:40px}
.dz-list{display:flex;flex-direction:column;gap:8px}
.dz-empty{color:var(--muted);font-size:.9em;padding:14px;border:1px dashed var(--line);border-radius:12px;text-align:center}
.dz-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02)}
.dz-item.on{border-color:rgba(var(--acc-rgb),.45)}
.dz-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.dz-meta small{color:var(--muted);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.dz-tags{display:flex;gap:4px}.dz-tags i{font-style:normal;font-size:.7em;padding:1px 7px;border-radius:99px;background:rgba(var(--acc-rgb),.12);color:var(--acc)}
.dz-del{min-width:44px;min-height:44px}

/* ===== LokiCode interactive input ===== */
.lc-output .in{color:#9fd8ff}
.lc-output .lc-echo{color:#9fd8ff}
.lc-ask{display:inline-flex;align-items:center;gap:6px;vertical-align:baseline;max-width:100%}
.lc-inline{min-width:140px;width:min(320px,60vw);background:rgba(var(--acc-rgb),.08);border:1px solid rgba(var(--acc-rgb),.4);border-radius:8px;color:#9fd8ff;font:inherit;padding:4px 8px;outline:none;caret-color:var(--acc);animation:lcAsk 1.6s ease-in-out infinite}
.lc-inline:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(var(--acc-rgb),.15)}
.lc-eof{font:inherit;font-size:.72rem;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:7px;padding:4px 8px;cursor:pointer;min-height:30px}
@keyframes lcAsk{50%{border-color:rgba(var(--acc-rgb),.85)}}
@media (max-width:700px){.lc-inline{width:56vw;font-size:16px;min-height:40px}.lc-eof{min-height:40px}}
@media (prefers-reduced-motion:reduce){.lc-inline{animation:none}}

/* ===== Draggable Loki Mascot + Live Voice-Call & Situational Animations ===== */
.mz{touch-action:none;cursor:grab;transform:translate(var(--drag-x,0px),var(--drag-y,0px))}
.mz:active,.mz.dragging{cursor:grabbing;z-index:999!important;filter:drop-shadow(0 12px 24px rgba(0,255,156,.45))}
.mz.free-roam{position:fixed!important;z-index:450!important;pointer-events:auto!important;transform:none!important}
.mz-notes,.mz-code-glyphs{opacity:0;transition:opacity .25s;pointer-events:none}
.mz-notes text{fill:#ffcf5c;font:800 13px Inter,sans-serif}
.mz-code-glyphs text{fill:#3ce0ff;font:800 10px 'JetBrains Mono',monospace}
/* Live Mouth & Hand Articulation (Voice Call / Speech / Coding) */
.mz[data-s=calling] .mz-m.talk,.mz[data-s=talking] .mz-m.talk{
  opacity:1;
  transform:scaleY(var(--mouth-open,1));
  transition:transform 60ms linear;
}
.mz[data-s=calling] .mz-m.smile{opacity:0}
.mz[data-s=calling] .mz-arm.l,.mz[data-s=talking] .mz-arm.l{
  transform:rotate(var(--arm-l,35deg));
  transition:transform 75ms linear;
}
.mz[data-s=calling] .mz-arm.r,.mz[data-s=talking] .mz-arm.r{
  transform:rotate(var(--arm-r,-35deg));
  transition:transform 75ms linear;
}
.mz[data-s=calling] .mz-cheek{opacity:.75}
.mz[data-s=calling] .mz-brow{opacity:1;transform:translateY(-2px)}
.mz[data-s=calling] .mz-body{animation:mzCallGroove .9s ease-in-out infinite alternate}
@keyframes mzCallGroove{from{transform:translateY(-2px) rotate(-2.5deg)}to{transform:translateY(1px) rotate(2.5deg)}}
/* Coding State — rapid typing hands & code glyphs */
.mz[data-s=coding] .mz-m.flat{opacity:1}
.mz[data-s=coding] .mz-brow{opacity:1;transform:translateY(-1px)}
.mz[data-s=coding] .mz-code-glyphs{opacity:1;animation:mzFloatGlyph .7s ease-in-out infinite alternate}
.mz[data-s=coding] .mz-arm.l{transform:rotate(var(--arm-l,38deg));transition:transform 50ms linear}
.mz[data-s=coding] .mz-arm.r{transform:rotate(var(--arm-r,-38deg));transition:transform 50ms linear}
.mz[data-s=coding] .mz-body{animation:mzBob .45s ease-in-out infinite}
@keyframes mzFloatGlyph{from{transform:translateY(2px)}to{transform:translateY(-4px)}}
/* Dancing State */
.mz[data-s=dancing] .mz-m.grin{opacity:1}
.mz[data-s=dancing] .mz-cheek{opacity:.85}
.mz[data-s=dancing] .mz-notes{opacity:1;animation:mzFloatGlyph .55s ease-in-out infinite alternate}
.mz[data-s=dancing] .mz-body{animation:mzDance .48s ease-in-out infinite alternate}
.mz[data-s=dancing] .mz-arm.l{animation:mzDanceArmL .48s ease-in-out infinite alternate}
.mz[data-s=dancing] .mz-arm.r{animation:mzDanceArmR .48s ease-in-out infinite alternate}
@keyframes mzDance{from{transform:translateY(-6px) rotate(-8deg) scale(1.03,.97)}to{transform:translateY(1px) rotate(8deg) scale(.97,1.03)}}
@keyframes mzDanceArmL{from{transform:rotate(75deg)}to{transform:rotate(-25deg)}}
@keyframes mzDanceArmR{from{transform:rotate(25deg)}to{transform:rotate(-75deg)}}
/* Celebrating State */
.mz[data-s=celebrating] .mz-lid{opacity:0}
.mz[data-s=celebrating] .mz-he{opacity:1}
.mz[data-s=celebrating] .mz-m.grin{opacity:1}
.mz[data-s=celebrating] .mz-spark,.mz[data-s=celebrating] .mz-notes{opacity:1;animation:mzTwinkle .45s ease-in-out infinite alternate}
.mz[data-s=celebrating] .mz-body{animation:mzHop .45s cubic-bezier(.3,.6,.4,1) infinite}
.mz[data-s=celebrating] .mz-arm.l{transform:rotate(115deg)}
.mz[data-s=celebrating] .mz-arm.r{transform:rotate(-115deg)}
/* Juggling State */
.mz[data-s=juggling] .mz-m.o{opacity:1}
.mz[data-s=juggling] .mz-spark{opacity:1}
.mz[data-s=juggling] .mz-arm.l{animation:mzJugL .26s ease-in-out infinite alternate}
.mz[data-s=juggling] .mz-arm.r{animation:mzJugR .26s ease-in-out infinite alternate}
@keyframes mzJugL{from{transform:rotate(20deg)}to{transform:rotate(85deg)}}
@keyframes mzJugR{from{transform:rotate(-85deg)}to{transform:rotate(-20deg)}}
/* Salute State */
.mz[data-s=salute] .mz-m.smile{opacity:1}
.mz[data-s=salute] .mz-brow{opacity:1;transform:translateY(-2px)}
.mz[data-s=salute] .mz-arm.r{transform:rotate(-132deg)}
.mz[data-s=salute] .mz-arm.l{transform:rotate(12deg)}
/* Mascot inside Live Voice Call Stage */
#callOrbWrap.has-mz .call-crest{opacity:.12}
#callOrbWrap.has-mz .mz.incall{position:absolute;left:50%;top:50%;transform:translate(calc(-50% + var(--drag-x,0px)),calc(-52% + var(--drag-y,0px)));z-index:4}

/* ===== Ultra 4x Quantum Reasoning Blueprint ===== */
.ultra-blueprint{margin:8px 0 12px;border:1px solid rgba(var(--acc-rgb),.32);border-radius:14px;background:linear-gradient(145deg,rgba(var(--acc-rgb),.09),rgba(6,16,12,.88));overflow:hidden}
.ultra-blueprint summary{display:flex;align-items:center;gap:8px;padding:9px 13px;cursor:pointer;list-style:none;font-size:.83rem;font-weight:700;color:#e8fff5;flex-wrap:wrap}
.ultra-blueprint summary::-webkit-details-marker{display:none}
.ub-pills{display:inline-flex;gap:5px;flex-wrap:wrap}
.ub-pills span{padding:2px 7px;border-radius:6px;background:rgba(255,255,255,.06);font-size:.72rem;font-weight:600;color:#cfeee0}
.ub-time{margin-inline-start:auto;padding:2px 8px;border-radius:999px;background:rgba(var(--acc-rgb),.18);color:var(--acc);font-size:.73rem;font-family:'JetBrains Mono',monospace}
.ub-badge{padding:2px 8px;border-radius:999px;background:rgba(var(--acc-rgb),.18);color:var(--acc);font-size:.75rem;font-weight:800}
.ub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;padding:0 12px 12px}
.ub-step,.ub-col{padding:9px 11px;border-radius:10px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.06);font-size:.8rem;line-height:1.45}
.ub-step b,.ub-col h5{display:block;color:var(--acc);font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;margin:0 0 4px}
.ub-col ul{margin:0;padding-inline-start:16px;display:grid;gap:3px}
.ub-col p{margin:0}

/* ===== Multi-Engine Research Badges ===== */
.src-eng{display:inline-block;padding:1px 6px;border-radius:6px;background:rgba(var(--acc-rgb),.14);color:var(--acc);font-size:.68rem;font-weight:700;margin-inline-end:4px}
.dr-engines{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.dr-eng-chip{padding:3px 9px;border-radius:999px;background:rgba(var(--acc-rgb),.1);border:1px solid rgba(var(--acc-rgb),.28);font-size:.74rem;color:#d6fff0}

/* ===== Lokizen 4.0 Stark Interactive Visual Blocks & Toolbar ===== */
.stark-block{margin:12px 0;padding:14px 16px;border-radius:16px;background:linear-gradient(160deg,rgba(var(--acc-rgb),.08),rgba(5,14,10,.92));border:1px solid rgba(var(--acc-rgb),.28);box-shadow:0 12px 32px rgba(0,0,0,.35)}
.sb-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.07)}
.sb-badge{padding:3px 9px;border-radius:999px;background:rgba(var(--acc-rgb),.15);color:var(--acc);font-size:.73rem;font-weight:800}
.sb-title{font-weight:800;font-size:.96rem;color:#eafff6;display:flex;align-items:center;gap:6px}
.sb-actions,.sb-chart-types{display:flex;gap:5px;flex-wrap:wrap}
.sb-btn,.sb-ct,.sb-dl{padding:4px 9px;border-radius:8px;border:1px solid rgba(var(--acc-rgb),.25);background:rgba(0,0,0,.35);color:#cfeee0;font:600 .74rem Inter,sans-serif;cursor:pointer;transition:.18s}
.sb-btn:hover,.sb-btn.on,.sb-ct:hover,.sb-ct.on,.sb-dl:hover{background:var(--acc);color:#03140b;border-color:var(--acc)}
.sb-chart-wrap,.sb-chart-stage{position:relative;height:260px;width:100%}
/* KPI Metrics Grid */
.sb-kpi-grid,.sb-metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.sb-kpi-card,.sb-metric-card{padding:12px 14px;border-radius:12px;background:rgba(0,0,0,.38);border:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;gap:5px}
.sbm-top{display:flex;align-items:center;justify-content:space-between;gap:6px}
.sb-kpi-lbl,.sbm-lbl{font-size:.75rem;color:var(--muted,#9cc4b2);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.sb-kpi-val,.sbm-val{font-size:1.45rem;font-weight:800;color:#fff;font-family:'JetBrains Mono',monospace}
.sb-kpi-delta,.sbm-delta{font-size:.74rem;font-weight:700;padding:2px 7px;border-radius:99px;background:rgba(0,255,156,.12);color:#00ff9c}
.sb-kpi-delta.down,.sbm-delta.dn{background:rgba(255,107,139,.14);color:#ff6b8b}
.sb-kpi-bar,.sbm-bar{height:5px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:4px}
.sb-kpi-bar i,.sbm-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),#3ce0ff);border-radius:99px}
/* Pros & Cons Matrix */
.sb-pc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.sb-pc-col{padding:12px;border-radius:12px;background:rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.06)}
.sb-pc-col.pros{border-color:rgba(0,255,156,.28)}.sb-pc-col.cons{border-color:rgba(255,107,139,.28)}
.sb-pc-col h5{margin:0 0 8px;font-size:.85rem}
.sb-pc-col ul{margin:0;padding-inline-start:18px;display:grid;gap:5px;font-size:.86rem}
.sb-pc-verdict{margin-top:10px;padding:9px 12px;border-radius:10px;background:rgba(var(--acc-rgb),.1);font-size:.86rem}
/* Interactive Timeline */
.sb-tl-list{position:relative;padding-inline-start:22px;display:grid;gap:10px}
.sb-tl-list::before{content:"";position:absolute;inset-inline-start:7px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--acc),rgba(var(--acc-rgb),.15))}
.sb-tl-item{position:relative;padding:9px 12px;border-radius:11px;background:rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.06)}
.sb-tl-dot{position:absolute;inset-inline-start:-19px;top:13px;width:10px;height:10px;border-radius:50%;background:var(--acc);box-shadow:0 0 10px var(--acc)}
.sb-tl-date{font-size:.73rem;font-weight:700;color:var(--acc);font-family:'JetBrains Mono',monospace}
.sb-tl-item b{display:block;margin:2px 0;font-size:.9rem}
.sb-tl-item p{margin:0;font-size:.83rem;color:#cfeee0}
/* Interactive Checklist */
.sb-prog-wrap{height:7px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin-bottom:10px}
.sb-prog-bar{height:100%;background:linear-gradient(90deg,var(--acc),#3ce0ff);transition:width .25s ease}
.sb-step-list{display:grid;gap:6px}
.sb-step-row{display:flex;align-items:flex-start;gap:9px;padding:8px 10px;border-radius:10px;background:rgba(0,0,0,.3);cursor:pointer;font-size:.87rem;transition:.15s}
.sb-step-row.done{opacity:.55;text-decoration:line-through}
.sb-step-row small{display:block;color:var(--muted,#9cc4b2);font-size:.78rem}
/* 3D Flip Cards */
.sb-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:10px}
.sb-flip-card{perspective:800px;min-height:118px;cursor:pointer}
.sb-flip-inner{position:relative;width:100%;min-height:118px;transform-style:preserve-3d;transition:transform .45s cubic-bezier(.2,.85,.3,1)}
.sb-flip-card.flipped .sb-flip-inner{transform:rotateY(180deg)}
.sb-flip-front,.sb-flip-back{position:absolute;inset:0;backface-visibility:hidden;border-radius:12px;padding:12px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;border:1px solid rgba(var(--acc-rgb),.28);background:rgba(4,16,11,.94)}
.sb-flip-back{transform:rotateY(180deg);background:linear-gradient(145deg,rgba(var(--acc-rgb),.18),rgba(4,16,11,.96));color:#eafff6;font-size:.83rem}
.sb-flip-tag{font-size:.68rem;text-transform:uppercase;color:var(--acc);letter-spacing:.05em;margin-bottom:4px}
.sb-flip-front small{margin-top:6px;font-size:.7rem;opacity:.6}
/* Callout */
.stark-callout-block{display:flex;gap:12px;align-items:flex-start}
.sb-co-ic{font-size:1.5rem;line-height:1}
.sb-co-body{flex:1;min-width:0}
.sb-co-body b{display:block;margin-bottom:3px;color:var(--acc)}
.sb-co-body p{margin:0;font-size:.88rem;line-height:1.5}
.sb-co-formula{display:inline-block;margin-top:6px;padding:4px 9px;border-radius:8px;background:rgba(0,0,0,.45);color:#7dffcf;font-family:'JetBrains Mono',monospace;font-size:.8rem}
/* Stark Visuals Action Bar on Assistant Messages */
.stark-viz-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:8px;padding-top:6px;border-top:1px dashed rgba(var(--acc-rgb),.18)}
.svb-lbl{font-size:.72rem;font-weight:800;color:var(--acc);text-transform:uppercase;letter-spacing:.04em;margin-inline-end:2px}
.svb-btn{padding:4px 9px;border-radius:999px;border:1px solid rgba(var(--acc-rgb),.24);background:rgba(var(--acc-rgb),.07);color:#d8fff0;font:600 .74rem Inter,sans-serif;cursor:pointer;transition:.18s}
.svb-btn:hover:not(:disabled){background:rgba(var(--acc-rgb),.22);border-color:var(--acc);transform:translateY(-1px)}
.svb-btn:disabled{opacity:.5;cursor:wait}
.sb-prog-bar{height:6px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin-bottom:10px}
.sb-prog-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),#3ce0ff);transition:width .25s ease}
.sb-steps-list{display:grid;gap:6px}
.sb-step-row input[type=checkbox]{display:none}
.sb-chk{width:20px;height:20px;border-radius:6px;border:1.5px solid rgba(var(--acc-rgb),.4);display:grid;place-items:center;font-size:.75rem;color:transparent;background:rgba(0,0,0,.35);flex:none;margin-top:2px;transition:.15s}
.sb-step-row.done .sb-chk,.sb-step-row input:checked+.sb-chk{background:var(--acc);border-color:var(--acc);color:#03140b;font-weight:800}

/* ===== Usage Quota & Account Topbar Controls ===== */
.labs-menu[hidden]{display:none!important}
.top-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* ===== 10 New Stark Interactive Answer Blocks (#8 - #17) ===== */
/* #8 Interactive Kanban Board */
.sb-kb-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(195px,1fr));gap:10px}
.sb-kb-col{background:rgba(0,0,0,.36);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px}
.sb-kb-head{display:flex;justify-content:space-between;align-items:center;font-size:.82rem;color:var(--acc);padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.06)}
.sb-kb-cnt{padding:1px 7px;border-radius:99px;background:rgba(var(--acc-rgb),.16);font-size:.72rem;font-weight:800}
.sb-kb-list{display:grid;gap:6px}
.sb-kb-card{padding:8px 10px;border-radius:9px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);font-size:.82rem;display:flex;flex-direction:column;gap:6px}
.sb-kb-acts{display:flex;gap:4px;justify-content:flex-end}
.sb-kb-acts button{padding:2px 6px;border-radius:5px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.4);color:#cfeee0;font-size:.7rem;cursor:pointer}
.sb-kb-acts button:hover{background:var(--acc);color:#03140b;border-color:var(--acc)}
.sb-kb-add{display:flex;gap:5px;margin-top:auto}
.sb-kb-add input{flex:1;min-width:0;padding:5px 8px;border-radius:7px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.35);color:#fff;font-size:.78rem}
.sb-kb-add button{padding:4px 9px;border-radius:7px;border:0;background:var(--acc);color:#03140b;font-weight:800;cursor:pointer}

/* #9 Instant Mini-Quiz */
.sb-quiz-score{padding:3px 9px;border-radius:99px;background:rgba(var(--acc-rgb),.18);color:var(--acc);font-size:.76rem;font-weight:800}
.sb-quiz-list{display:grid;gap:12px}
.sb-quiz-q{padding:11px 13px;border-radius:12px;background:rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.07)}
.sb-qq-title{display:block;margin-bottom:8px;font-size:.9rem;color:#fff}
.sb-qq-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:7px}
.sb-qq-opt{padding:8px 11px;border-radius:9px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#e8fff5;text-align:start;font-size:.82rem;cursor:pointer;transition:.16s}
.sb-qq-opt:hover{border-color:var(--acc);background:rgba(var(--acc-rgb),.1)}
.sb-qq-opt.correct{background:rgba(0,255,156,.22)!important;border-color:#00ff9c!important;color:#fff;font-weight:700}
.sb-qq-opt.wrong{background:rgba(255,77,109,.22)!important;border-color:#ff4d6d!important;color:#ffd5dd}
.sb-qq-exp{margin-top:8px;padding:7px 10px;border-radius:8px;background:rgba(var(--acc-rgb),.1);font-size:.8rem;color:#cfeee0}

/* #10 Sortable Data Table & Markdown Tables */
.sb-tbl-search{padding:5px 12px;border-radius:8px;border:1px solid rgba(var(--acc-rgb),.3);background:rgba(0,0,0,.5);color:#fff;font-size:.78rem;outline:none}
.sb-tbl-search:focus{border-color:var(--acc);box-shadow:0 0 10px rgba(var(--acc-rgb),.2)}
.sb-tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.3);max-width:100%}
.sb-tbl-wrap table{width:100%;min-width:100%;border-collapse:collapse;font-size:.84rem}
.sb-tbl-wrap th,.sb-tbl-wrap td{padding:9px 13px;border:1px solid rgba(255,255,255,.06);text-align:start}
.sb-tbl-wrap th{background:rgba(var(--acc-rgb),.12);color:var(--acc);cursor:pointer;user-select:none;white-space:nowrap;font-weight:700}
.sb-tbl-wrap th:hover{background:rgba(var(--acc-rgb),.2)}
.sb-tbl-wrap tr:nth-child(even) td{background:rgba(255,255,255,.02)}
.sb-tbl-wrap tr:hover td{background:rgba(var(--acc-rgb),.06)}

/* Rich In-Text Markdown Table Wrapper */
.md-table-wrap{margin:12px 0;padding:12px 14px;border-radius:16px;background:linear-gradient(160deg,rgba(var(--acc-rgb),.07),rgba(5,14,10,.94));border:1px solid rgba(var(--acc-rgb),.28);box-shadow:0 8px 24px rgba(0,0,0,.3)}
.md-table-wrap .sb-head{margin-bottom:8px;padding-bottom:6px}
.stark-visual-fallback{margin:12px 0;padding:14px;border-radius:14px;background:rgba(var(--acc-rgb),.05);border:1px solid rgba(var(--acc-rgb),.25)}
.stark-visual-fallback .sb-fb-body{color:#d8fff0;line-height:1.6}

/* #11 Live Code Playground Sandbox */
.sb-play-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.sb-play-ed{width:100%;min-height:150px;padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#030b07;color:#7dffcf;font:12px/1.45 'JetBrains Mono',monospace;resize:vertical}
.sb-play-fr{width:100%;height:150px;border-radius:10px;border:1px solid rgba(var(--acc-rgb),.28);background:#04120c}

/* #12 System Architecture Flow */
.sb-arch-flow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.sb-arch-step{display:flex;align-items:center;gap:8px}
.sb-arch-node{padding:10px 13px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.4);color:#e8fff5;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:120px;transition:.18s}
.sb-arch-node.active,.sb-arch-node:hover{border-color:var(--acc);background:rgba(var(--acc-rgb),.16);box-shadow:0 0 18px rgba(var(--acc-rgb),.22)}
.sb-an-ic{font-size:1.25rem}
.sb-arch-node b{font-size:.82rem}
.sb-arch-node small{font-size:.68rem;color:var(--muted)}
.sb-arch-arr{color:var(--acc);font-weight:800}
.sb-arch-detail{padding:10px 13px;border-radius:10px;background:rgba(0,0,0,.35);border:1px solid rgba(var(--acc-rgb),.24);font-size:.84rem;color:#d8fff0}

/* #13 2x2 SWOT Matrix */
.sb-swot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.sb-swot-cell{padding:11px 13px;border-radius:12px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.08)}
.sb-swot-cell.s{border-color:rgba(0,255,156,.32)}.sb-swot-cell.w{border-color:rgba(255,184,77,.32)}
.sb-swot-cell.o{border-color:rgba(60,224,255,.32)}.sb-swot-cell.t{border-color:rgba(255,92,124,.32)}
.sb-swot-cell h5{margin:0 0 7px;font-size:.84rem}
.sb-swot-cell ul{margin:0;padding-inline-start:17px;display:grid;gap:4px;font-size:.82rem}

/* #14 Deep-Dive Accordion */
.sb-acc-list{display:grid;gap:7px}
.sb-acc-item{border-radius:10px;background:rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.08);overflow:hidden}
.sb-acc-item summary{padding:9px 13px;cursor:pointer;font-weight:700;font-size:.86rem;color:#e8fff5}
.sb-acc-body{padding:0 13px 11px;font-size:.83rem;color:#cfeee0;line-height:1.5}

/* #15 Weighted Decision Matrix */
.sb-dec-weights{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-bottom:12px;padding:10px;border-radius:11px;background:rgba(0,0,0,.3)}
.sb-dec-w{display:flex;flex-direction:column;gap:4px;font-size:.78rem;color:#cfeee0}
.sb-dec-w input[type=range]{accent-color:var(--acc);cursor:pointer}
.sb-dec-results{display:grid;gap:8px}
.sb-dec-row{padding:9px 12px;border-radius:10px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.07)}
.sb-dec-row.winner{border-color:var(--acc);background:rgba(var(--acc-rgb),.11)}
.sb-dec-top{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:.85rem}
.sb-dec-rank{padding:2px 8px;border-radius:99px;background:rgba(var(--acc-rgb),.2);color:var(--acc);font-size:.72rem;font-weight:800}
.sb-dec-score{margin-inline-start:auto;font-family:'JetBrains Mono',monospace;font-weight:800;color:#fff}

/* #16 Side-by-Side Diff Viewer */
.sb-diff-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px}
.sb-diff-col{border-radius:11px;background:#030c08;border:1px solid rgba(255,255,255,.09);overflow:hidden}
.sb-diff-col.after{border-color:rgba(var(--acc-rgb),.35)}
.sb-diff-top{display:flex;justify-content:space-between;align-items:center;padding:7px 11px;background:rgba(255,255,255,.04);font-size:.78rem}
.sb-diff-top button{padding:2px 8px;border-radius:6px;border:1px solid rgba(255,255,255,.14);background:transparent;color:#cfeee0;font-size:.72rem;cursor:pointer}
.sb-diff-col pre{margin:0;padding:10px;overflow-x:auto;font:12px/1.45 'JetBrains Mono',monospace;color:#d8fff0}

/* #17 Playable WebAudio Synth */
.sb-synth-pads{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px}
.sb-synth-pad{padding:12px 8px;border-radius:12px;border:1px solid rgba(var(--acc-rgb),.32);background:linear-gradient(160deg,rgba(var(--acc-rgb),.15),rgba(0,0,0,.5));color:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;transition:.14s}
.sb-synth-pad:hover,.sb-synth-pad.hit{transform:translateY(-2px) scale(1.03);background:var(--acc);color:#03140b;box-shadow:0 0 20px rgba(var(--acc-rgb),.45)}
.sb-synth-pad small{font-size:.68rem;opacity:.75}

/* ===== Live Voice Call Studio — Side Panel (3 Male + 3 Female Voices), Spectrum & Red Animated Mute/Quiet Buttons ===== */
.call-ov:not([hidden]){opacity:1!important;transform:none!important;background:radial-gradient(circle at 40% 35%,rgba(12,38,26,.97),rgba(3,8,6,.99));backdrop-filter:blur(18px);display:flex;flex-direction:column;justify-content:space-between;padding:16px 20px;z-index:600}
.call-ov[hidden]{display:none!important}
.call-top{width:100%;max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.call-top-left,.call-top-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.call-live{display:inline-flex;align-items:center;gap:8px;padding:6px 13px;border-radius:999px;background:rgba(var(--acc-rgb),.12);border:1px solid rgba(var(--acc-rgb),.32);font-weight:700;font-size:.82rem}
.call-live i{width:8px;height:8px;border-radius:50%;background:var(--acc);box-shadow:0 0 10px var(--acc)}
.call-lang-pill{padding:5px 11px;border-radius:999px;background:rgba(60,224,255,.12);border:1px solid rgba(60,224,255,.35);color:#b8f3ff;font-size:.76rem;font-weight:700}
.call-timer{font-family:'JetBrains Mono',monospace;font-size:.88rem;color:#9cc4b2}

.call-layout{flex:1;width:100%;max-width:1180px;margin:10px auto;display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:center;min-height:0;overflow:hidden}
.call-ov.hide-side .call-layout{grid-template-columns:1fr}
.call-ov.hide-side .call-side{display:none}
@media(max-width:900px){
  .call-layout{grid-template-columns:1fr;overflow-y:auto}
  .call-side{max-height:320px}
}

.call-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;text-align:center}
.call-orb-wrap{--lvl:0.15;position:relative;width:186px;height:186px;display:grid;place-items:center;cursor:pointer}
.call-orb{width:136px;height:136px;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(0,255,156,.28),rgba(4,20,13,.92));border:2px solid rgba(var(--acc-rgb),.45);box-shadow:0 0 50px rgba(var(--acc-rgb),.35);display:grid;place-items:center;transform:scale(calc(1 + var(--lvl) * 0.18));transition:transform .09s linear}
.call-ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(var(--acc-rgb),.3);animation:geoRing 2.6s ease-out infinite;pointer-events:none}
.call-ring.r2{animation-delay:.85s}.call-ring.r3{animation-delay:1.7s}

.call-spectrum{display:flex;align-items:center;justify-content:center;gap:4px;height:48px}
.call-spectrum i{display:block;width:4px;height:12px;border-radius:99px;background:linear-gradient(180deg,var(--acc),#3ce0ff);transition:height 70ms linear}

.call-state{font-size:1.25rem;font-weight:800;color:#fff}
.call-sub{font-size:.86rem;color:#9cc4b2;max-width:460px}
.call-caption{min-height:44px;width:100%;max-width:540px;padding:9px 14px;border-radius:13px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);font-size:.92rem;line-height:1.45;color:#e8fff5}
.call-chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;max-width:560px}
.call-chips button{padding:5px 11px;border-radius:999px;border:1px solid rgba(var(--acc-rgb),.28);background:rgba(var(--acc-rgb),.08);color:#d8fff0;font-size:.75rem;font-weight:600;cursor:pointer;transition:.16s}
.call-chips button:hover{background:var(--acc);color:#03140b}

.call-quick-row{display:flex;gap:8px;align-items:center;justify-content:center;width:100%;max-width:520px;margin-top:4px;z-index:5}
.call-quick-row input{flex:1;padding:10px 14px;border-radius:999px;border:1px solid rgba(var(--acc-rgb),.35);background:rgba(8,22,15,.85);color:#fff;font-size:13px;outline:none}
.call-quick-row button{padding:10px 15px;border-radius:999px;border:1px solid rgba(var(--acc-rgb),.45);background:rgba(var(--acc-rgb),.2);color:#e8fff5;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}

/* Voice Call Side Panel */
.call-side{height:100%;max-height:74vh;overflow-y:auto;background:rgba(4,16,11,.88);border:1px solid rgba(var(--acc-rgb),.26);border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:14px;box-shadow:0 16px 40px rgba(0,0,0,.45)}
.cs-sec{display:flex;flex-direction:column;gap:7px}
.cs-title{font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--acc);display:flex;justify-content:space-between;align-items:center}
.cs-v-lbl{font-size:.72rem;font-weight:700;color:#9cc4b2}
.cs-voices{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.cs-voice-btn{padding:7px 6px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);color:#e8fff5;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center;transition:.16s}
.cs-voice-btn:hover{border-color:rgba(var(--acc-rgb),.5)}
.cs-voice-btn.on{border-color:var(--acc);background:rgba(var(--acc-rgb),.18);box-shadow:0 0 14px rgba(var(--acc-rgb),.25)}
.v-avatar{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:.78rem;font-weight:800}
.v-avatar.male{background:rgba(56,189,248,.2);color:#38bdf8}
.v-avatar.female{background:rgba(244,114,182,.2);color:#f472b6}
.v-info b{display:block;font-size:.76rem}
.v-info small{display:block;font-size:.63rem;color:#9cc4b2}

.cs-speeds{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.cs-speeds button{padding:6px;border-radius:8px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.35);color:#cfeee0;font:700 .76rem 'JetBrains Mono',monospace;cursor:pointer}
.cs-speeds button.on{background:var(--acc);color:#03140b;border-color:var(--acc)}

.cs-personas{display:flex;flex-wrap:wrap;gap:5px}
.cs-pers-btn{padding:5px 9px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);color:#d8fff0;font-size:.74rem;cursor:pointer;display:inline-flex;align-items:center;gap:4px}
.cs-pers-btn.on{border-color:var(--acc);background:rgba(var(--acc-rgb),.18);font-weight:700}

.cs-trans-sec{flex:1;min-height:110px}
.cs-save-btn{padding:2px 8px;border-radius:6px;border:1px solid rgba(var(--acc-rgb),.35);background:rgba(var(--acc-rgb),.12);color:#e8fff5;font-size:.68rem;font-weight:700;cursor:pointer}
.cs-trans-list{flex:1;max-height:150px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;padding-right:4px}
.cs-trans-empty{font-size:.75rem;color:var(--muted);text-align:center;padding:16px 0}
.cs-tr-item{padding:6px 9px;border-radius:9px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.06);font-size:.76rem}
.cs-tr-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:2px;color:var(--acc)}
.cs-tr-play{border:0;background:transparent;cursor:pointer;font-size:.75rem}

/* Call Dock + Red Animated Mute & Quiet Buttons */
.call-dock{display:flex;gap:14px;align-items:center;justify-content:center;padding-top:6px}
.call-dock .call-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:999px;border:1.5px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);color:#fff;font-weight:800;cursor:pointer;transition:background .25s cubic-bezier(.2,.9,.3,1),border-color .25s ease,transform .22s cubic-bezier(.3,1.5,.5,1),box-shadow .25s ease}
.call-dock .call-btn svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .25s ease}
.call-dock .call-btn.active-red{
  background:linear-gradient(135deg,#ff2a55,#d90429)!important;
  border-color:#ff758f!important;
  color:#fff!important;
  box-shadow:0 0 28px rgba(255,42,85,.65),inset 0 1px 0 rgba(255,255,255,.35)!important;
}
.call-dock .call-btn.active-red svg{transform:scale(1.12) rotate(-6deg)}
.call-dock .call-btn.btn-anim-pop{animation:callBtnPop .42s cubic-bezier(.28,1.65,.45,1)}
@keyframes callBtnPop{
  0%{transform:scale(.86)}
  45%{transform:scale(1.12)}
  100%{transform:scale(1)}
}
.call-dock .call-btn.end{background:#ff4d6d;border-color:#ff4d6d;color:#fff}

/* ===== 🌌 ULTRA-ANIMATED WORKING INDICATOR (4 SELECTABLE STYLES) ===== */

/* Shared extra elements (hidden in Classic mode, active in new modes) */
.wk-ring,.wk-spark,.wk-eq,.wk-step-pill,.wk-progress-track,.wk-idx,.wk-done-steps{display:none}
.set-work-preview{
  margin-top:6px;padding:12px 14px;border-radius:16px;
  background:radial-gradient(circle at 20% 0%,rgba(var(--acc-rgb),.14),rgba(3,12,8,.92));
  border:1px solid rgba(var(--acc-rgb),.26);
}
.set-work-preview .work{margin:0}

/* -------------------------------------------------------------------
   STYLE 1: NEBULA HOLO-CORE (Default — 100x More Beautiful & Animated)
   ------------------------------------------------------------------- */
.work[data-wstyle="nebula"]{
  margin:8px 0 12px;
  position:relative;
  filter:drop-shadow(0 12px 32px rgba(0,255,156,.16));
}
.work[data-wstyle="nebula"] .work-pill{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;gap:12px;
  padding:11px 18px 13px 14px;
  border-radius:20px;
  background:
    radial-gradient(120% 180% at 0% 0%,rgba(0,255,156,.22) 0%,rgba(0,180,216,.14) 45%,rgba(5,18,13,.96) 100%);
  border:1px solid rgba(0,255,156,.48);
  box-shadow:
    0 12px 36px -8px rgba(0,255,156,.34),
    0 0 24px rgba(0,180,216,.22),
    inset 0 1px 0 rgba(255,255,255,.22);
  backdrop-filter:blur(18px);
  max-width:100%;
  transition:all .28s cubic-bezier(.2,.9,.3,1);
}
.work[data-wstyle="nebula"] .work-pill::before{
  content:'';position:absolute;inset:-2px;
  background:linear-gradient(115deg,transparent 20%,rgba(0,255,156,.28) 45%,rgba(0,212,255,.32) 55%,transparent 80%);
  background-size:240% 100%;
  animation:nebulaSweep 2.6s linear infinite;
  pointer-events:none;z-index:0;
}
@keyframes nebulaSweep{
  0%{background-position:200% 0}
  100%{background-position:-100% 0}
}
.work[data-wstyle="nebula"] .work-pill > *{position:relative;z-index:1}

/* 3D Multi-Ring Holographic Orb */
.work[data-wstyle="nebula"] .work-orb{
  width:34px;height:34px;flex-shrink:0;
  position:relative;display:grid;place-items:center;
  border-radius:50%;
  background:radial-gradient(circle,rgba(0,255,156,.28),rgba(0,180,216,.08) 70%,transparent);
  box-shadow:0 0 22px rgba(0,255,156,.55),inset 0 0 12px rgba(0,255,156,.35);
}
.work[data-wstyle="nebula"] .work-orb::before{
  inset:8px;
  background:radial-gradient(circle at 30% 30%,#ffffff,#00ff9c 55%,#00b4d8);
  box-shadow:0 0 16px #00ff9c,0 0 28px #00b4d8;
  animation:nebulaCoreBeat 1.3s ease-in-out infinite alternate;
}
.work[data-wstyle="nebula"] .work-orb::after{display:none}
.work[data-wstyle="nebula"] .wk-ring{
  display:block;position:absolute;border-radius:50%;pointer-events:none;
}
.work[data-wstyle="nebula"] .wk-ring.r1{
  inset:0;
  border:2px solid transparent;
  border-top-color:#00ff9c;
  border-right-color:#00d4ff;
  animation:nebulaSpin 1.4s linear infinite;
  filter:drop-shadow(0 0 6px #00ff9c);
}
.work[data-wstyle="nebula"] .wk-ring.r2{
  inset:3px;
  border:1.5px dashed rgba(168,255,220,.75);
  animation:nebulaSpinRev 2.4s linear infinite;
}
.work[data-wstyle="nebula"] .wk-ring.r3{
  inset:-3px;
  border:1px solid rgba(0,255,156,.28);
  animation:nebulaPulseRing 1.9s ease-out infinite;
}
.work[data-wstyle="nebula"] .wk-spark{
  display:block;position:absolute;width:5px;height:5px;border-radius:50%;
  background:#fff;box-shadow:0 0 10px #00ff9c;
  top:-2px;left:50%;transform:translateX(-50%);
  animation:nebulaOrbit 1.4s linear infinite;
  transform-origin:0 19px;
}
@keyframes nebulaSpin{to{transform:rotate(360deg)}}
@keyframes nebulaSpinRev{to{transform:rotate(-360deg)}}
@keyframes nebulaCoreBeat{
  0%{transform:scale(.82);filter:brightness(1)}
  100%{transform:scale(1.16);filter:brightness(1.35)}
}
@keyframes nebulaPulseRing{
  0%{transform:scale(.88);opacity:.9}
  100%{transform:scale(1.38);opacity:0}
}
@keyframes nebulaOrbit{to{transform:rotate(360deg)}}

/* Animated Gradient Title & Equalizer Wave */
.work[data-wstyle="nebula"] .work-word{
  font-weight:900;font-size:.98rem;letter-spacing:.02em;
  background:linear-gradient(90deg,#ffffff 0%,#7bffca 45%,#5ce1e6 80%,#ffffff 100%);
  background-size:200% auto;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:nebulaTextShine 2.4s linear infinite;
}
@keyframes nebulaTextShine{to{background-position:200% center}}

.work[data-wstyle="nebula"] .work-dots{display:none}
.work[data-wstyle="nebula"] .wk-eq{
  display:inline-flex;align-items:center;gap:2.5px;height:16px;padding:0 2px;
}
.work[data-wstyle="nebula"] .wk-eq i{
  display:block;width:3px;height:6px;border-radius:99px;
  background:linear-gradient(180deg,#00ff9c,#00d4ff);
  box-shadow:0 0 6px rgba(0,255,156,.7);
  animation:nebulaEq .85s ease-in-out infinite alternate;
}
.work[data-wstyle="nebula"] .wk-eq i:nth-child(2){animation-delay:.12s}
.work[data-wstyle="nebula"] .wk-eq i:nth-child(3){animation-delay:.24s}
.work[data-wstyle="nebula"] .wk-eq i:nth-child(4){animation-delay:.36s}
.work[data-wstyle="nebula"] .wk-eq i:nth-child(5){animation-delay:.48s}
@keyframes nebulaEq{
  0%{height:4px;opacity:.55}
  100%{height:15px;opacity:1}
}

.work[data-wstyle="nebula"] .work-sec{
  font-family:'JetBrains Mono',monospace;
  font-weight:800;font-size:.8rem;
  padding:3px 9px;border-radius:999px;
  background:rgba(0,255,156,.16);
  border:1px solid rgba(0,255,156,.38);
  color:#9effd6;
  box-shadow:inset 0 0 8px rgba(0,255,156,.2);
}
.work[data-wstyle="nebula"] .wk-step-pill{
  display:inline-flex;align-items:center;
  padding:2px 8px;border-radius:999px;
  font-size:.7rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;
  background:rgba(0,212,255,.15);
  border:1px solid rgba(0,212,255,.36);
  color:#8be9fd;
}
.work[data-wstyle="nebula"] .work-cur{
  color:#e4fff3;font-weight:600;font-size:.86rem;max-width:340px;
}
.work[data-wstyle="nebula"] .work-caret{
  width:26px;height:26px;border-radius:9px;
  background:rgba(0,255,156,.16);border:1px solid rgba(0,255,156,.35);
  color:#7bffca;
}

/* Shimmering Progress Track along bottom of pill */
.work[data-wstyle="nebula"] .wk-progress-track{
  display:block;position:absolute;left:0;right:0;bottom:0;height:3px;
  background:rgba(255,255,255,.06);overflow:hidden;
}
.work[data-wstyle="nebula"] .wk-progress-bar{
  display:block;width:45%;height:100%;border-radius:99px;
  background:linear-gradient(90deg,transparent,#00ff9c,#00d4ff,transparent);
  animation:nebulaBarSlide 1.35s cubic-bezier(.4,0,.2,1) infinite;
}
@keyframes nebulaBarSlide{
  0%{transform:translateX(-110%)}
  100%{transform:translateX(240%)}
}

/* Nebula Timeline Body */
.work[data-wstyle="nebula"] .work-body{
  margin-top:8px;padding:10px 12px 10px 30px;
  border-radius:16px;
  background:linear-gradient(145deg,rgba(4,20,14,.88),rgba(2,10,8,.92));
  border:1px solid rgba(0,255,156,.22);
  box-shadow:0 10px 28px rgba(0,0,0,.35);
}
.work[data-wstyle="nebula"] .work-body::before{
  left:15px;top:12px;bottom:12px;width:2px;
  border-left:0;
  background:linear-gradient(180deg,#00ff9c,#00d4ff,rgba(0,255,156,.15));
  box-shadow:0 0 8px rgba(0,255,156,.5);
}
.work[data-wstyle="nebula"] .wk-line{
  padding:6px 10px;border-radius:10px;margin-bottom:3px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.05);
  align-items:center;
}
.work[data-wstyle="nebula"] .wk-line:last-child{
  background:linear-gradient(90deg,rgba(0,255,156,.13),rgba(0,212,255,.06));
  border-color:rgba(0,255,156,.34);
}
.work[data-wstyle="nebula"] .wk-dot{left:-19px;top:11px}
.work[data-wstyle="nebula"] .wk-idx{
  display:inline-grid;place-items:center;
  padding:1px 6px;border-radius:6px;
  font:800 .66rem 'JetBrains Mono',monospace;
  background:rgba(0,255,156,.16);color:#7bffca;
}

/* Nebula Done Pill */
.work[data-wstyle="nebula"].done .work-pill{
  padding:8px 15px;border-radius:14px;
  background:linear-gradient(135deg,rgba(0,255,156,.16),rgba(5,20,14,.92));
  border-color:rgba(0,255,156,.42);
}
.work[data-wstyle="nebula"].done .wk-done-orb{
  display:inline-grid;place-items:center;
  width:20px;height:20px;border-radius:50%;
  background:linear-gradient(135deg,#00ff9c,#00d4ff);
  color:#03140b;font-weight:900;font-size:.74rem;
  box-shadow:0 0 12px rgba(0,255,156,.6);
}
.work[data-wstyle="nebula"].done .wk-done-steps{
  display:inline-flex;padding:2px 8px;border-radius:999px;
  background:rgba(0,212,255,.14);border:1px solid rgba(0,212,255,.3);
  color:#8be9fd;font-size:.72rem;font-weight:700;
}

/* -------------------------------------------------------------------
   STYLE 2: CYBER HUD MATRIX (Sci-Fi Tactical Command Module)
   ------------------------------------------------------------------- */
.work[data-wstyle="cyber"]{
  margin:8px 0 12px;
  font-family:'JetBrains Mono',monospace;
}
.work[data-wstyle="cyber"] .work-pill{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;gap:11px;
  padding:10px 18px 12px 14px;
  border-radius:6px;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));
  background:
    repeating-linear-gradient(0deg,rgba(0,255,156,.04) 0 1px,transparent 1px 3px),
    linear-gradient(90deg,rgba(2,18,14,.96),rgba(4,28,22,.94));
  border:1px solid #00ff9c;
  box-shadow:0 0 24px rgba(0,255,156,.28),inset 0 0 18px rgba(0,255,156,.12);
}
.work[data-wstyle="cyber"] .work-pill::after{
  content:'SYS//ACTIVE';
  position:absolute;top:2px;right:16px;
  font-size:.52rem;letter-spacing:.16em;color:rgba(0,255,156,.55);
  pointer-events:none;
}
.work[data-wstyle="cyber"] .work-orb{
  width:28px;height:28px;border-radius:4px;
  border:1.5px solid #00ff9c;
  background:rgba(0,255,156,.1);
  position:relative;display:grid;place-items:center;
}
.work[data-wstyle="cyber"] .work-orb::before{
  inset:6px;border-radius:2px;
  background:#00ff9c;
  box-shadow:0 0 12px #00ff9c;
  animation:cyberSpinSquare 1.6s steps(8) infinite;
}
.work[data-wstyle="cyber"] .work-orb::after{
  inset:-4px;border-radius:4px;
  border:1px dashed #00d4ff;
  animation:nebulaSpin 2.2s linear infinite;
}
@keyframes cyberSpinSquare{
  0%{transform:rotate(0deg) scale(.85)}
  50%{transform:rotate(180deg) scale(1.1)}
  100%{transform:rotate(360deg) scale(.85)}
}
.work[data-wstyle="cyber"] .work-word{
  font-family:'JetBrains Mono',monospace;
  text-transform:uppercase;letter-spacing:.12em;font-size:.84rem;
  color:#00ff9c;text-shadow:0 0 10px rgba(0,255,156,.75);
}
.work[data-wstyle="cyber"] .work-dots{display:none}
.work[data-wstyle="cyber"] .wk-eq{
  display:inline-flex;align-items:flex-end;gap:2px;height:14px;
}
.work[data-wstyle="cyber"] .wk-eq i{
  display:block;width:3px;height:100%;background:#00ff9c;
  animation:cyberBar .6s steps(4) infinite alternate;
}
.work[data-wstyle="cyber"] .wk-eq i:nth-child(even){background:#00d4ff;animation-delay:.2s}
@keyframes cyberBar{0%{transform:scaleY(.25)}100%{transform:scaleY(1)}}
.work[data-wstyle="cyber"] .work-sec{
  padding:2px 7px;border-radius:3px;
  background:#00ff9c;color:#02120c;font-weight:900;font-size:.76rem;
}
.work[data-wstyle="cyber"] .wk-step-pill{
  display:inline-flex;padding:2px 6px;border-radius:3px;
  border:1px solid #00d4ff;color:#00d4ff;font-size:.68rem;font-weight:800;
}
.work[data-wstyle="cyber"] .work-cur{
  color:#b8ffe3;font-size:.8rem;max-width:320px;
}
.work[data-wstyle="cyber"] .wk-progress-track{
  display:block;position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(0,255,156,.18);
}
.work[data-wstyle="cyber"] .wk-progress-bar{
  display:block;width:35%;height:100%;background:#00ff9c;box-shadow:0 0 10px #00ff9c;
  animation:nebulaBarSlide 1.1s linear infinite;
}
.work[data-wstyle="cyber"] .work-body{
  margin-top:6px;padding:10px 12px 10px 28px;
  border-radius:4px;background:rgba(2,14,10,.95);
  border:1px solid rgba(0,255,156,.4);
}
.work[data-wstyle="cyber"] .wk-idx{
  display:inline-block;color:#00d4ff;font-weight:800;font-size:.7rem;
}

/* -------------------------------------------------------------------
   STYLE 3: LIQUID AURORA RIBBON (Iridescent Morphing Glass Capsule)
   ------------------------------------------------------------------- */
.work[data-wstyle="aurora"]{
  margin:8px 0 12px;
}
.work[data-wstyle="aurora"] .work-pill{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;gap:12px;
  padding:11px 20px 11px 14px;
  border-radius:999px;
  background:linear-gradient(125deg,rgba(0,255,156,.22),rgba(0,180,216,.24),rgba(168,85,247,.22),rgba(0,255,156,.22));
  background-size:300% 300%;
  animation:auroraFlow 4s ease infinite;
  border:1px solid rgba(255,255,255,.28);
  box-shadow:
    0 12px 34px -6px rgba(0,212,255,.32),
    0 4px 20px rgba(168,85,247,.22),
    inset 0 1px 1px rgba(255,255,255,.35);
  backdrop-filter:blur(20px);
}
@keyframes auroraFlow{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
.work[data-wstyle="aurora"] .work-orb{
  width:30px;height:30px;
  border-radius:42% 58% 63% 37% / 45% 42% 58% 55%;
  background:linear-gradient(135deg,#00ff9c,#00d4ff,#c084fc);
  box-shadow:0 0 20px rgba(0,255,156,.65),0 0 28px rgba(192,132,252,.45);
  animation:auroraMorph 2.4s ease-in-out infinite;
}
.work[data-wstyle="aurora"] .work-orb::before,
.work[data-wstyle="aurora"] .work-orb::after{display:none}
@keyframes auroraMorph{
  0%,100%{border-radius:42% 58% 63% 37% / 45% 42% 58% 55%;transform:rotate(0deg) scale(1)}
  50%{border-radius:62% 38% 39% 61% / 58% 64% 36% 42%;transform:rotate(180deg) scale(1.1)}
}
.work[data-wstyle="aurora"] .work-word{
  font-weight:900;font-size:.96rem;
  color:#ffffff;text-shadow:0 2px 12px rgba(0,212,255,.55);
}
.work[data-wstyle="aurora"] .wk-eq{
  display:inline-flex;align-items:center;gap:3px;height:15px;
}
.work[data-wstyle="aurora"] .wk-eq i{
  display:block;width:3.5px;height:8px;border-radius:99px;
  background:linear-gradient(180deg,#fff,#7bffca);
  animation:nebulaEq .9s ease-in-out infinite alternate;
}
.work[data-wstyle="aurora"] .wk-eq i:nth-child(2){animation-delay:.15s}
.work[data-wstyle="aurora"] .wk-eq i:nth-child(3){animation-delay:.3s}
.work[data-wstyle="aurora"] .wk-eq i:nth-child(4){animation-delay:.45s}
.work[data-wstyle="aurora"] .wk-eq i:nth-child(5){animation-delay:.6s}
.work[data-wstyle="aurora"] .work-dots{display:none}
.work[data-wstyle="aurora"] .work-sec{
  padding:3px 10px;border-radius:999px;
  background:rgba(255,255,255,.16);color:#fff;font-weight:800;font-size:.78rem;
}
.work[data-wstyle="aurora"] .work-cur{color:#f5fffb;font-weight:600}
.work[data-wstyle="aurora"] .work-body{
  margin-top:8px;padding:10px 14px 10px 30px;border-radius:18px;
  background:linear-gradient(135deg,rgba(8,25,20,.86),rgba(18,12,32,.86));
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(16px);
}

/* -------------------------------------------------------------------
   STYLE 4: CLASSIC (Exact Previous Design Option)
   ------------------------------------------------------------------- */
.work[data-wstyle="classic"] .wk-ring,
.work[data-wstyle="classic"] .wk-spark,
.work[data-wstyle="classic"] .wk-eq,
.work[data-wstyle="classic"] .wk-step-pill,
.work[data-wstyle="classic"] .wk-progress-track,
.work[data-wstyle="classic"] .wk-idx,
.work[data-wstyle="classic"] .wk-done-orb,
.work[data-wstyle="classic"] .wk-done-steps{
  display:none!important;
}

/* ===== 🌐 SOURCE DRAWER ===== */
.sources-wrap{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.src-more-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 13px;border-radius:999px;
  background:linear-gradient(135deg,rgba(0,255,156,.18),rgba(0,180,216,.16));
  border:1px solid rgba(0,255,156,.42);
  color:#8affd1;font-weight:800;font-size:.76rem;
  cursor:pointer;transition:.18s;
}
.src-more-btn:hover{
  background:var(--acc);color:#03140b;
  box-shadow:0 0 18px rgba(0,255,156,.45);
}
.sources-all{
  display:flex;flex-wrap:wrap;gap:6px;
  max-height:260px;overflow-y:auto;
  padding:10px;border-radius:14px;
  background:rgba(3,14,10,.88);
  border:1px solid rgba(0,255,156,.22);
}

/* ============================================================================
   📊 BENCHES BUTTON (TOPBAR) & FRONTIER BENCHMARK SUITE MODAL
   ============================================================================ */
.benches-top-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 12px;border-radius:999px;
  background:linear-gradient(135deg,rgba(0,255,156,.16),rgba(56,189,248,.14));
  border:1px solid rgba(0,255,156,.42);
  color:#eafff5;font-size:.78rem;font-weight:800;
  cursor:pointer;transition:all .18s ease;
  box-shadow:0 4px 14px rgba(0,255,156,.14);
  white-space:nowrap;
}
.benches-top-btn:hover,
.benches-top-btn.active{
  background:linear-gradient(135deg,rgba(0,255,156,.32),rgba(56,189,248,.28));
  border-color:#00ff9c;
  color:#fff;
  transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(0,255,156,.32);
}
.benches-ic{font-size:.88rem;line-height:1}

/* ============================================================================
   📊 PARETO FRONTIER BENCHMARKS PAGE (Matching image_ce4d4cce.png)
   ============================================================================ */
.benches-view{
  position:absolute;
  inset:0;
  top:var(--top-h,65px);
  overflow-y:auto;
  padding:24px 20px 80px;
  background:radial-gradient(circle at 50% 10%,rgba(96,165,250,.06),transparent 65%),
             radial-gradient(circle at 20% 80%,rgba(0,255,156,.05),transparent 55%);
  z-index:5;
}

.pareto-bench-page{
  max-width:880px;
  width:100%;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:18px;
}

/* Top Back & Model Switcher Bar */
.pareto-top-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  padding:12px 18px;
  border-radius:18px;
  background:rgba(8,12,18,.92);
  border:1px solid rgba(255,255,255,.09);
}
.pareto-header-title{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.pareto-eyebrow{
  font-size:.65rem;
  font-weight:800;
  letter-spacing:.08em;
  color:#60a5fa;
  text-transform:uppercase;
}
.pareto-header-title h2{
  margin:0;
  font-size:1.15rem;
  font-weight:900;
  color:#fff;
}
.pareto-model-toggle{
  display:flex;
  gap:6px;
  padding:4px;
  border-radius:12px;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.1);
}
.pmt-btn{
  padding:6px 12px;
  border-radius:9px;
  border:1px solid transparent;
  background:transparent;
  color:#cbd5e1;
  font-size:.76rem;
  font-weight:700;
  cursor:pointer;
  transition:all .16s ease;
}
.pmt-btn:hover{
  background:rgba(255,255,255,.05);
}
.pmt-btn.active.stark{
  background:linear-gradient(135deg,rgba(0,255,156,.2),rgba(56,189,248,.15));
  border-color:#00ff9c;
  color:#fff;
}
.pmt-btn.active.fera{
  background:linear-gradient(135deg,rgba(52,211,153,.2),rgba(16,185,129,.15));
  border-color:#34d399;
  color:#fff;
}

/* Benchmark Selector Pill Bar */
.pareto-bench-selector{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding-bottom:4px;
  scrollbar-width:thin;
}
.pbs-tab{
  padding:8px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(12,18,26,.8);
  color:#cbd5e1;
  font-size:.77rem;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
  transition:all .16s ease;
}
.pbs-tab:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.25);
  color:#fff;
}
.pbs-tab.active{
  background:linear-gradient(135deg,rgba(96,165,250,.22),rgba(0,255,156,.18));
  border-color:#60a5fa;
  color:#fff;
  box-shadow:0 4px 16px rgba(96,165,250,.2);
}

/* Central Card (Matching image_ce4d4cce.png) */
.pareto-card-container{
  background:#090d14;
  border:1px solid rgba(255,255,255,.14);
  border-radius:24px;
  padding:28px 32px 32px;
  box-shadow:0 24px 80px rgba(0,0,0,.8), 0 0 45px rgba(0,0,0,.6);
  display:flex;
  flex-direction:column;
  gap:20px;
  position:relative;
}

/* Top Card Row: Download Button (Left) & Title + Metric Dropdown (Right) */
.pareto-card-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
}
.pareto-header-left{
  display:flex;
  align-items:center;
}
.pareto-dl-btn{
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.04);
  color:#e2e8f0;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:all .18s ease;
}
.pareto-dl-btn svg{
  width:18px;
  height:18px;
}
.pareto-dl-btn:hover{
  background:rgba(255,255,255,.12);
  border-color:#fff;
  color:#fff;
  transform:translateY(-1px);
}

.pareto-header-right{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
}
.pareto-card-title{
  font-size:1.35rem;
  font-weight:900;
  color:#ffffff;
  letter-spacing:-.01em;
  text-align:right;
}
.pareto-metric-dropdown-wrap{
  position:relative;
}
.pareto-metric-dropdown-btn{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:5px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.05);
  color:#f1f5f9;
  font-size:.76rem;
  font-weight:700;
  cursor:pointer;
  transition:all .16s ease;
}
.pareto-metric-dropdown-btn:hover{
  background:rgba(255,255,255,.12);
  border-color:#60a5fa;
}
.pareto-metric-menu{
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  min-width:210px;
  padding:6px;
  border-radius:14px;
  background:#0f172a;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 16px 40px rgba(0,0,0,.7);
  display:flex;
  flex-direction:column;
  gap:4px;
  z-index:40;
}
.pareto-metric-menu button{
  padding:7px 11px;
  border-radius:9px;
  border:none;
  background:transparent;
  color:#cbd5e1;
  font-size:.75rem;
  font-weight:700;
  text-align:right;
  cursor:pointer;
  transition:.14s;
}
.pareto-metric-menu button:hover,
.pareto-metric-menu button.active{
  background:rgba(96,165,250,.2);
  color:#60a5fa;
}

/* Legend Row (matching screenshot) */
.pareto-legend-strip{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
  width:100%;
}
.pareto-legend-items{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:14px;
  font-size:.82rem;
  color:#f8fafc;
  font-weight:700;
}
.pli-item{
  display:flex;
  align-items:center;
  gap:6px;
}
.pli-item.stark .pli-label{
  color:#00ff9c;
}
.pli-sym.triangle{color:#ea580c;font-size:.78rem}
.pli-sym.diamond{color:#b45309;font-size:.78rem}
.pli-sym.circle{color:#2563eb;font-size:.72rem}
.pli-sym.star{color:#60a5fa;font-size:.88rem}
.pli-sym.stark{color:#00ff9c;font-size:.88rem}

.pareto-legend-divider{
  width:1px;
  height:12px;
  background:rgba(255,255,255,.15);
}

.pareto-baseline-legend{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:.78rem;
  color:#e2e8f0;
  font-weight:700;
}
.pbl-line{
  color:#c2410c;
  font-weight:900;
  letter-spacing:1px;
}

/* SVG Chart */
.pareto-chart-canvas-wrap{
  width:100%;
  display:flex;
  justify-content:center;
  position:relative;
}
.pareto-chart-svg{
  width:100%;
  max-width:760px;
  height:auto;
  display:block;
}
.chart-point{
  cursor:pointer;
  transition:transform .15s ease,filter .15s ease;
}
.chart-node:hover .chart-point{
  transform:scale(1.3);
  filter:drop-shadow(0 0 8px currentColor);
}

/* Bottom Narrative Box */
.pareto-narrative-box{
  padding:14px 18px;
  border-radius:14px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
}
.pareto-narrative-box p{
  margin:0;
  font-size:.88rem;
  line-height:1.65;
  color:#e2e8f0;
  font-style:italic;
  text-align:justify;
}

/* Verifiable Proof Section */
.pareto-proof-section{
  margin-top:6px;
}
.pareto-proof-card{
  padding:22px 24px;
  border-radius:22px;
  background:radial-gradient(circle at 10% 20%,rgba(0,255,156,.09),transparent 60%),
             linear-gradient(160deg,#0a130f,#050c08);
  border:1px solid rgba(0,255,156,.32);
  box-shadow:0 18px 50px rgba(0,0,0,.6),0 0 35px rgba(0,255,156,.12);
  display:flex;
  flex-direction:column;
  gap:16px;
}
.ppc-header h3{
  margin:4px 0 6px;
  font-size:1.1rem;
  font-weight:800;
  color:#fff;
}
.ppc-badge{
  display:inline-block;
  padding:3px 9px;
  border-radius:999px;
  font-size:.65rem;
  font-weight:800;
  letter-spacing:.05em;
  background:rgba(0,255,156,.18);
  border:1px solid rgba(0,255,156,.45);
  color:#00ff9c;
}
.ppc-header p{
  margin:0;
  font-size:.82rem;
  color:#9cc4b2;
  line-height:1.45;
}

.ppc-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:14px;
}
.ppc-col{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.ppc-col-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  font-size:.73rem;
  font-weight:800;
  color:#7dffcf;
}
.ppc-test-live-btn{
  padding:3px 9px;
  border-radius:8px;
  border:none;
  background:linear-gradient(135deg,#00ff9c,#00d4ff);
  color:#03180e;
  font-size:.7rem;
  font-weight:900;
  cursor:pointer;
  transition:.15s;
}
.ppc-test-live-btn:hover:not(:disabled){
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(0,255,156,.4);
}
.ppc-test-live-btn:disabled{opacity:.6;cursor:wait}

.ppc-code{
  margin:0;
  padding:12px 14px;
  border-radius:12px;
  background:#030906;
  border:1px solid rgba(0,255,156,.2);
  font-family:'JetBrains Mono',monospace;
  font-size:.75rem;
  line-height:1.48;
  color:#d4fce8;
  white-space:pre-wrap;
  word-break:break-word;
  max-height:170px;
  overflow-y:auto;
}
.ppc-code.prompt{
  background:#050d14;
  border-color:rgba(96,165,250,.25);
  color:#bfdbfe;
}

.ppc-metrics-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding-top:4px;
  border-top:1px solid rgba(0,255,156,.15);
}
.ppc-metric-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.09);
  font-size:.74rem;
}
.pmp-label{color:#9cc4b2}
.pmp-val{color:#00ff9c;font-weight:800;font-family:'JetBrains Mono',monospace}

@media (max-width:680px){
  .pareto-card-container{padding:20px 16px}
  .pareto-legend-items{font-size:.74rem;gap:8px}
  .pareto-card-title{font-size:1.1rem}
}/* ============================================================================
   📊 MASTER BENCHMARKS SUITE STYLING (Matching image.png & image_ce4d4cce.png)
   ============================================================================ */
.bench-page-container{
  max-width:1440px;
  width:100%;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:20px;
}

/* Master Top Navigation */
.bp-top-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:14px;
  padding:14px 22px;
  border-radius:18px;
  background:rgba(6,12,18,.92);
  border:1px solid rgba(255,255,255,.09);
  backdrop-filter:blur(16px);
}
.bp-title-wrap{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.bp-eyebrow{
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.09em;
  color:#38bdf8;
  text-transform:uppercase;
}
.bp-title-wrap h2{
  margin:0;
  font-size:1.18rem;
  font-weight:900;
  color:#fff;
  letter-spacing:-.01em;
}

.bp-model-toggle{
  display:flex;
  gap:6px;
  padding:4px;
  border-radius:12px;
  background:rgba(0,0,0,.5);
  border:1px solid rgba(255,255,255,.1);
}
.bp-mt-btn{
  padding:7px 14px;
  border-radius:9px;
  border:1px solid transparent;
  background:transparent;
  color:#94a3b8;
  font-size:.78rem;
  font-weight:700;
  cursor:pointer;
  transition:all .16s ease;
}
.bp-mt-btn:hover{color:#fff;background:rgba(255,255,255,.06)}
.bp-mt-btn.active.stark{
  background:linear-gradient(135deg,rgba(0,255,156,.2),rgba(56,189,248,.18));
  border-color:#00ff9c;
  color:#00ff9c;
  box-shadow:0 0 16px rgba(0,255,156,.25);
}
.bp-mt-btn.active.fera{
  background:linear-gradient(135deg,rgba(52,211,153,.2),rgba(16,185,129,.18));
  border-color:#34d399;
  color:#34d399;
  box-shadow:0 0 16px rgba(52,211,153,.25);
}

/* Master View Switcher Tabs */
.bp-tab-row{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding-bottom:4px;
  scrollbar-width:thin;
}
.bp-tab-btn{
  padding:9px 16px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(8,16,14,.75);
  color:#94a3b8;
  font-size:.78rem;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
  transition:all .18s ease;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.bp-tab-btn:hover{
  color:#fff;
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.2);
}
.bp-tab-btn.active{
  background:linear-gradient(135deg,rgba(0,255,156,.18),rgba(6,36,24,.85));
  border-color:#00ff9c;
  color:#00ff9c;
  box-shadow:0 4px 20px rgba(0,255,156,.22);
}

/* Filter Bar in Cards View */
.bc-section-wrap{
  display:flex;
  flex-direction:column;
  gap:22px;
}
.bc-filter-bar{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding-bottom:4px;
  scrollbar-width:thin;
}
.bc-fbtn{
  padding:6px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(12,20,18,.8);
  color:#cbd5e1;
  font-size:.74rem;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
  transition:all .15s ease;
}
.bc-fbtn:hover{
  background:rgba(255,255,255,.08);
  color:#fff;
  border-color:rgba(255,255,255,.25);
}
.bc-fbtn.active{
  background:linear-gradient(135deg,rgba(0,255,156,.25),rgba(0,180,120,.2));
  border-color:#00ff9c;
  color:#00ff9c;
  box-shadow:0 0 12px rgba(0,255,156,.25);
}

.bc-categories-list{
  display:flex;
  flex-direction:column;
  gap:28px;
}
.bc-category-block{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.bc-cat-title-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding-bottom:6px;
  border-bottom:1px solid rgba(0,255,156,.15);
}
.bc-cat-ico{
  font-size:1.15rem;
}
.bc-cat-title-he{
  font-size:1.05rem;
  font-weight:800;
  color:#fff;
}
.bc-cat-title-en{
  font-size:.82rem;
  font-weight:600;
  color:#64748b;
  margin-left:4px;
}

/* 3-Column Grid matching image.png */
.bc-cards-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(330px,1fr));
  gap:18px;
}
@media (min-width:1100px){
  .bc-cards-grid{
    grid-template-columns:repeat(3,1fr);
  }
}

/* Authentic Green Benchmark Card (matching image.png) */
.bc-bench-card{
  background:rgba(4,20,14,.92);
  border:1px solid rgba(0,255,156,.35);
  border-radius:18px;
  padding:20px;
  display:flex;
  flex-direction:column;
  gap:14px;
  box-shadow:0 12px 35px rgba(0,0,0,.6), 0 0 25px rgba(0,255,156,.05);
  position:relative;
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.bc-bench-card:hover{
  border-color:rgba(0,255,156,.65);
  transform:translateY(-2px);
  box-shadow:0 16px 45px rgba(0,0,0,.7), 0 0 35px rgba(0,255,156,.12);
}

.bc-card-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
}
.bc-card-name{
  margin:0;
  font-size:1.18rem;
  font-weight:800;
  color:#ffffff;
  letter-spacing:-.01em;
}
.bc-card-pills{
  display:flex;
  align-items:center;
  gap:6px;
  flex-shrink:0;
}
.bc-delta-pill{
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:800;
  white-space:nowrap;
}
.bc-delta-pill.lead{
  background:rgba(0,255,156,.12);
  border:1px solid rgba(0,255,156,.45);
  color:#00ffc8;
}
.bc-delta-pill.trail{
  background:rgba(148,163,184,.1);
  border:1px solid rgba(148,163,184,.25);
  color:#94a3b8;
}

.bc-test-live-btn{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px 12px;
  border-radius:999px;
  background:transparent;
  border:1px solid #00ff9c;
  color:#00ff9c;
  font-size:.72rem;
  font-weight:800;
  cursor:pointer;
  transition:all .15s ease;
  white-space:nowrap;
}
.bc-test-live-btn:hover:not(:disabled){
  background:#00ff9c;
  color:#03180e;
  box-shadow:0 0 12px rgba(0,255,156,.5);
}
.bc-test-live-btn:disabled{
  opacity:.6;
  cursor:wait;
}

.bc-card-descs{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.bc-desc-he{
  margin:0;
  font-size:.82rem;
  color:#cbd5e1;
  line-height:1.45;
  font-weight:500;
}
.bc-desc-en{
  margin:0;
  font-size:.75rem;
  color:#64748b;
  line-height:1.4;
}

/* Horizontal Comparison Bars Stack */
.bc-bars-stack{
  display:flex;
  flex-direction:column;
  gap:9px;
  padding:8px 0;
}
.bc-bar-row{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:.78rem;
}
.bc-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  flex-shrink:0;
}
.bc-bar-name{
  width:125px;
  color:#e2e8f0;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex-shrink:0;
}
.bc-bar-row.stark .bc-bar-name{
  color:#00ff9c;
  font-weight:800;
}
.bc-track{
  flex:1;
  height:8px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  overflow:hidden;
  position:relative;
}
.bc-track i{
  display:block;
  height:100%;
  border-radius:999px;
  transition:width .4s ease;
}
.bc-val{
  width:46px;
  text-align:right;
  font-family:'JetBrains Mono',monospace;
  font-size:.78rem;
  font-weight:700;
  color:#cbd5e1;
  flex-shrink:0;
}

/* Verified Live Model Output Box (Matching image.png) */
.bc-verified-box{
  background:#02120a;
  border:1px solid rgba(0,255,156,.3);
  border-radius:12px;
  padding:12px 14px;
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:auto;
}
.bc-vb-head{
  font-size:.72rem;
  font-weight:800;
  color:#00ff9c;
  display:flex;
  align-items:center;
  gap:5px;
  letter-spacing:.02em;
}
.bc-vb-code{
  margin:0;
  font-family:'JetBrains Mono',monospace;
  font-size:.74rem;
  line-height:1.48;
  color:#e2e8f0;
  white-space:pre-wrap;
  word-break:break-word;
  max-height:140px;
  overflow-y:auto;
}

/* ============================================================================
   Built-In Features: Terminal-Bench, DeepSWE & BenchCAD Studios
   ============================================================================ */
.feat-studio-card{
  background:rgba(4,18,13,.94);
  border:1px solid rgba(0,255,156,.4);
  border-radius:22px;
  padding:26px 28px;
  display:flex;
  flex-direction:column;
  gap:20px;
  box-shadow:0 18px 60px rgba(0,0,0,.75), 0 0 35px rgba(0,255,156,.12);
}
.fsc-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
}
.fsc-title-group h3{
  margin:4px 0;
  font-size:1.25rem;
  font-weight:900;
  color:#fff;
}
.fsc-title-group p{
  margin:0;
  font-size:.84rem;
  color:#94a3b8;
  line-height:1.45;
}
.fsc-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 12px;
  border-radius:999px;
  background:rgba(0,255,156,.16);
  border:1px solid rgba(0,255,156,.45);
  color:#00ff9c;
  font-size:.72rem;
  font-weight:800;
}
.fsc-presets{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding:10px 14px;
  border-radius:12px;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.08);
}
.fsc-preset-label{
  font-size:.74rem;
  font-weight:700;
  color:#64748b;
}
.fsc-preset-btn{
  padding:4px 10px;
  border-radius:8px;
  border:1px solid rgba(0,255,156,.25);
  background:rgba(0,255,156,.06);
  color:#d4fce8;
  font-size:.72rem;
  font-weight:700;
  cursor:pointer;
  transition:all .15s ease;
}
.fsc-preset-btn:hover{
  background:rgba(0,255,156,.18);
  border-color:#00ff9c;
  color:#fff;
}

/* Interactive Terminal Window */
.fsc-terminal-window{
  border-radius:14px;
  background:#020b06;
  border:1px solid rgba(0,255,156,.35);
  overflow:hidden;
  box-shadow:inset 0 0 30px rgba(0,0,0,.8);
  display:flex;
  flex-direction:column;
}
.fsc-term-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 16px;
  background:#04150c;
  border-bottom:1px solid rgba(0,255,156,.2);
}
.fsc-term-dots{
  display:flex;
  gap:6px;
}
.fsc-term-dots span{
  width:10px;
  height:10px;
  border-radius:50%;
}
.fsc-term-title{
  font-family:'JetBrains Mono',monospace;
  font-size:.72rem;
  font-weight:700;
  color:#94a3b8;
}
.fsc-term-output{
  padding:16px;
  font-family:'JetBrains Mono',monospace;
  font-size:.78rem;
  line-height:1.55;
  color:#34d399;
  min-height:220px;
  max-height:360px;
  overflow-y:auto;
}
.term-line-cmd{
  color:#38bdf8;
  font-weight:700;
  margin-bottom:4px;
}
.term-line-out{
  color:#d1fae5;
  margin-bottom:8px;
  white-space:pre-wrap;
}
.term-line-ok{
  color:#00ff9c;
  font-weight:700;
  margin-bottom:10px;
}
.fsc-term-input-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 16px;
  background:#030f08;
  border-top:1px solid rgba(0,255,156,.2);
}
.fsc-term-prompt{
  font-family:'JetBrains Mono',monospace;
  font-size:.78rem;
  font-weight:800;
  color:#00ff9c;
}
.fsc-term-input{
  flex:1;
  background:transparent;
  border:none;
  color:#fff;
  font-family:'JetBrains Mono',monospace;
  font-size:.8rem;
  outline:none;
}
.fsc-term-run-btn{
  padding:5px 14px;
  border-radius:8px;
  border:none;
  background:#00ff9c;
  color:#03180e;
  font-weight:800;
  font-size:.74rem;
  cursor:pointer;
  transition:.15s;
}
.fsc-term-run-btn:hover{
  background:#34d399;
  box-shadow:0 0 12px rgba(0,255,156,.5);
}

/* DeepSWE & BenchCAD grids */
.fsc-swe-grid,
.fsc-cad-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:18px;
}
.fsc-swe-box{
  background:rgba(2,14,9,.8);
  border:1px solid rgba(0,255,156,.25);
  border-radius:14px;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.fsc-box-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:.78rem;
  font-weight:800;
  color:#fff;
  padding-bottom:8px;
  border-bottom:1px solid rgba(0,255,156,.15);
}
.fsc-swe-steps{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:.75rem;
}
.fsc-step{
  padding:6px 10px;
  border-radius:8px;
  background:rgba(0,0,0,.4);
  color:#94a3b8;
}
.fsc-step.done{
  color:#34d399;
  background:rgba(0,255,156,.08);
  border:1px solid rgba(0,255,156,.2);
}
.fsc-textarea{
  width:100%;
  border-radius:10px;
  background:#020905;
  border:1px solid rgba(0,255,156,.25);
  color:#e2e8f0;
  font-family:'JetBrains Mono',monospace;
  font-size:.75rem;
  padding:10px 12px;
  outline:none;
  resize:vertical;
}
.fsc-textarea:focus{
  border-color:#00ff9c;
}
.fsc-diff-view{
  margin:0;
  padding:12px;
  border-radius:10px;
  background:#020905;
  border:1px solid rgba(0,255,156,.2);
  font-family:'JetBrains Mono',monospace;
  font-size:.74rem;
  line-height:1.48;
  color:#93c5fd;
  white-space:pre-wrap;
  max-height:220px;
  overflow-y:auto;
}
.fsc-run-btn{
  padding:8px 16px;
  border-radius:10px;
  border:none;
  background:linear-gradient(135deg,#00ff9c,#38bdf8);
  color:#03180e;
  font-weight:900;
  font-size:.76rem;
  cursor:pointer;
  transition:.15s;
}
.fsc-run-btn:hover{
  box-shadow:0 0 16px rgba(0,255,156,.4);
  transform:translateY(-1px);
}
.fsc-cad-preview{
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:center;
}
.fsc-cad-visual{
  width:100%;
  padding:14px;
  border-radius:10px;
  background:#020905;
  border:1px solid rgba(0,255,156,.18);
  display:flex;
  justify-content:center;
  align-items:center;
}
.fsc-cad-meta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  font-size:.74rem;
  color:#cbd5e1;
}
.fsc-quick-presets{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.08);
}
.fsc-pbtn{
  padding:6px 12px;
  border-radius:8px;
  border:1px solid rgba(0,255,156,.28);
  background:rgba(0,255,156,.08);
  color:#d4fce8;
  font-size:.74rem;
  font-weight:700;
  cursor:pointer;
  transition:all .15s ease;
}
.fsc-pbtn:hover{
  background:rgba(0,255,156,.22);
  border-color:#00ff9c;
  color:#fff;
  transform:translateY(-1px);
}
.fsc-term-bar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 16px;
  background:#04150c;
  border-bottom:1px solid rgba(0,255,156,.2);
  font-family:'JetBrains Mono',monospace;
  font-size:.74rem;
  color:#94a3b8;
}
.fsc-term-bar .dots{
  display:flex;
  gap:6px;
}
.fsc-term-bar .dots i{
  display:block;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#334155;
}
.fsc-term-bar .dots i:nth-child(1){background:#ef4444}
.fsc-term-bar .dots i:nth-child(2){background:#f59e0b}
.fsc-term-bar .dots i:nth-child(3){background:#10b981}
.fsc-verified-tag{
  color:#00ff9c;
  font-size:.7rem;
  font-weight:800;
}
.fsc-prompt-sym{
  color:#00ff9c;
  font-family:'JetBrains Mono',monospace;
  font-weight:800;
  font-size:.85rem;
}
.fsc-patch-code{
  margin:0;
  padding:14px;
  border-radius:10px;
  background:#020905;
  border:1px solid rgba(0,255,156,.22);
  font-family:'JetBrains Mono',monospace;
  font-size:.74rem;
  line-height:1.48;
  color:#93c5fd;
  white-space:pre-wrap;
  word-break:break-word;
  max-height:220px;
  overflow-y:auto;
}

/* ============================================================================
   🏆 TOURNAMENT LEADERBOARD & WINNERS STANDINGS
   ============================================================================ */
.bc-leaderboard-container{
  display:flex;
  flex-direction:column;
  gap:26px;
  max-width:1300px;
  margin:0 auto;
}

/* Grand Champion Card */
.bc-champion-card{
  background:radial-gradient(circle at 50% 0%,rgba(245,158,11,.15),transparent 70%),
             linear-gradient(180deg,#120e06,#080703);
  border:1px solid rgba(245,158,11,.45);
  border-radius:24px;
  padding:30px 32px;
  box-shadow:0 24px 70px rgba(0,0,0,.85), 0 0 40px rgba(245,158,11,.15);
  display:flex;
  flex-direction:column;
  gap:24px;
}
.bc-champ-badge{
  display:inline-flex;
  align-self:flex-start;
  padding:5px 14px;
  border-radius:999px;
  background:rgba(245,158,11,.18);
  border:1px solid rgba(245,158,11,.5);
  color:#fbbf24;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.bc-champ-body{
  display:flex;
  align-items:center;
  gap:20px;
}
.bc-champ-trophy{
  font-size:3.2rem;
  line-height:1;
  filter:drop-shadow(0 0 20px rgba(245,158,11,.6));
}
.bc-champ-info h2{
  margin:0 0 6px;
  font-size:1.85rem;
  font-weight:900;
  color:#fff;
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.bc-champ-score{
  display:inline-block;
  padding:4px 12px;
  border-radius:12px;
  background:linear-gradient(135deg,#f59e0b,#d97706);
  color:#000;
  font-size:1.2rem;
  font-weight:900;
  font-family:'JetBrains Mono',monospace;
}
.bc-champ-desc{
  margin:0;
  font-size:.9rem;
  color:#fde68a;
  line-height:1.55;
  max-width:850px;
}

/* Official 4-Model Podium */
.bc-podium-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  align-items:flex-end;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.1);
}
@media (max-width:768px){
  .bc-podium-row{
    grid-template-columns:repeat(2,1fr);
  }
}
.bc-podium-col{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  padding:16px 12px;
  border-radius:16px;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.08);
  transition:all .2s ease;
}
.bc-podium-col.first{
  border-color:rgba(245,158,11,.5);
  background:linear-gradient(180deg,rgba(245,158,11,.12),rgba(0,0,0,.6));
  box-shadow:0 0 25px rgba(245,158,11,.15);
}
.bc-podium-col.second{
  border-color:rgba(56,189,248,.4);
  background:linear-gradient(180deg,rgba(56,189,248,.1),rgba(0,0,0,.6));
}
.bc-podium-col.third{
  border-color:rgba(0,255,156,.4);
  background:linear-gradient(180deg,rgba(0,255,156,.1),rgba(0,0,0,.6));
}
.bc-podium-col.stark-highlight{
  border-color:#00ff9c;
}
.bc-podium-medal{
  font-size:1.8rem;
  line-height:1;
}
.bc-podium-model-name{
  font-size:.85rem;
  font-weight:800;
  color:#fff;
  text-align:center;
}
.bc-podium-score{
  font-size:1.25rem;
  font-weight:900;
  font-family:'JetBrains Mono',monospace;
}
.bc-podium-bar-wrap{
  width:100%;
  max-width:120px;
  display:flex;
  justify-content:center;
  align-items:flex-end;
  height:120px;
  background:rgba(255,255,255,.04);
  border-radius:8px;
  overflow:hidden;
}
.bc-podium-bar{
  width:100%;
  border-radius:6px 6px 0 0;
  transition:height .5s ease;
}
.bc-podium-tag{
  font-size:.72rem;
  font-weight:800;
  color:#94a3b8;
  text-transform:uppercase;
  letter-spacing:.04em;
}

/* Honest Standings Summary Card */
.bc-honest-summary-card{
  background:rgba(10,18,28,.85);
  border:1px solid rgba(56,189,248,.25);
  border-radius:18px;
  padding:20px 24px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.bc-hsc-title{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:.95rem;
  font-weight:800;
  color:#38bdf8;
}
.bc-hsc-tag{
  font-size:.68rem;
  font-weight:800;
  padding:3px 9px;
  border-radius:999px;
  background:rgba(56,189,248,.15);
  border:1px solid rgba(56,189,248,.35);
  color:#38bdf8;
}
.bc-honest-summary-card p{
  margin:0;
  font-size:.85rem;
  line-height:1.65;
  color:#cbd5e1;
}
.bc-honest-summary-card p b{
  color:#fff;
}

/* Category Scoreboard */
.bc-cat-scoreboard-title{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.bc-cat-scoreboard-title h3{
  margin:0;
  font-size:1.3rem;
  font-weight:900;
  color:#fff;
}
.bc-cat-scoreboard-title p{
  margin:0;
  font-size:.82rem;
  color:#64748b;
}

.bc-cat-grid-scoreboard{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
  gap:18px;
}
@media (min-width:1100px){
  .bc-cat-grid-scoreboard{
    grid-template-columns:repeat(3,1fr);
  }
}

.bc-cat-card-score{
  background:rgba(6,14,12,.92);
  border:1px solid rgba(255,255,255,.1);
  border-radius:18px;
  padding:20px;
  display:flex;
  flex-direction:column;
  gap:14px;
  box-shadow:0 12px 30px rgba(0,0,0,.6);
  transition:border-color .18s ease;
}
.bc-cat-card-score:hover{
  border-color:rgba(255,255,255,.25);
}
.bc-ccs-head{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.bc-ccs-icon-title{
  display:flex;
  align-items:center;
  gap:8px;
}
.bc-ccs-ico{
  font-size:1.2rem;
}
.bc-ccs-title{
  font-size:1rem;
  font-weight:800;
  color:#fff;
}
.bc-ccs-winner-pill{
  display:inline-flex;
  align-self:flex-start;
  padding:3px 10px;
  border-radius:999px;
  border:1px solid;
  background:rgba(0,0,0,.45);
  font-size:.72rem;
  font-weight:800;
}

.bc-ccs-bars{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.bc-ccs-row{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.78rem;
}
.bc-ccs-row.leader{
  font-weight:800;
}
.bc-ccs-row.stark .bc-ccs-name{
  color:#00ff9c;
  font-weight:800;
}
.bc-ccs-rank{
  width:16px;
  color:#64748b;
  font-weight:800;
  font-size:.72rem;
}
.bc-ccs-name{
  width:125px;
  color:#cbd5e1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex-shrink:0;
}
.bc-ccs-track{
  flex:1;
  height:7px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  overflow:hidden;
}
.bc-ccs-track i{
  display:block;
  height:100%;
  border-radius:999px;
  transition:width .4s ease;
}
.bc-ccs-val{
  width:48px;
  text-align:right;
  font-family:'JetBrains Mono',monospace;
  font-size:.78rem;
  font-weight:800;
}

/* Medal Delta Pills */
.bc-delta-pill.lead{
  background:rgba(0,255,156,.14);
  border:1px solid rgba(0,255,156,.5);
  color:#00ffc8;
}
.bc-delta-pill.silver{
  background:rgba(226,232,240,.12);
  border:1px solid rgba(226,232,240,.4);
  color:#f1f5f9;
}
.bc-delta-pill.bronze{
  background:rgba(217,119,6,.15);
  border:1px solid rgba(217,119,6,.45);
  color:#f59e0b;
}
.bc-delta-pill.trail{
  background:rgba(100,116,139,.14);
  border:1px solid rgba(100,116,139,.3);
  color:#94a3b8;
}

/* ============================================================================
   Lokizenith v2.4 — Auth, Live Usage Bar, Codes, Admin Reset, Teams & Hub
   ============================================================================ */
[hidden], .lz-auth-overlay[hidden], .modal[hidden], .admin-reset-btn[hidden],
.notif-top-btn[hidden], .user-top-chip[hidden], .lz-account-row[hidden], .lz-admin-tag[hidden] {
  display: none !important;
}

/* ---- Sidebar Live Usage Bar & Account Row ---- */
.lz-usage-card {
  margin-top: 8px;
  padding: 10px 11px;
  border-radius: 14px;
  background: linear-gradient(160deg, rgba(var(--acc-rgb), .08), rgba(4, 14, 10, .85));
  border: 1px solid rgba(var(--acc-rgb), .24);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.lz-usage-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: .78rem;
  font-weight: 700;
}
.lz-usage-lbl { color: var(--dim, #b7dfd0); }
.lz-usage-pct {
  font-family: 'JetBrains Mono', monospace;
  color: var(--acc, #00ff9c);
  font-weight: 800;
}
.lz-usage-track {
  width: 100%;
  height: 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .09);
  overflow: hidden;
}
.lz-usage-fill {
  height: 100%;
  width: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--acc, #00ff9c), #3ce0ff);
  box-shadow: 0 0 10px rgba(var(--acc-rgb), .5);
  transition: width .35s cubic-bezier(.22, 1, .36, 1), background .3s;
}
.lz-usage-fill.warn { background: linear-gradient(90deg, #f59e0b, #fbbf24); box-shadow: 0 0 10px rgba(245, 158, 11, .45); }
.lz-usage-fill.low { background: linear-gradient(90deg, #ef4444, #fb7185); box-shadow: 0 0 10px rgba(239, 68, 68, .55); }
.lz-usage-fill.boosted { background: linear-gradient(90deg, #00ff9c, #a78bfa); }
.lz-usage-meta {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  font-size: .7rem;
  color: var(--muted, #87ab9c);
  font-family: 'JetBrains Mono', monospace;
}
.lz-usage-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-top: 2px;
}
.lz-usage-code-btn {
  border: 1px solid rgba(var(--acc-rgb), .28);
  background: rgba(var(--acc-rgb), .09);
  color: #e2fff4;
  border-radius: 9px;
  padding: 5px 6px;
  font: 700 .72rem Inter, sans-serif;
  cursor: pointer;
  white-space: nowrap;
  transition: .18s;
}
.lz-usage-code-btn:hover { background: rgba(var(--acc-rgb), .2); border-color: var(--acc); }
.lz-usage-code-btn.dev { border-color: rgba(124, 200, 255, .35); background: rgba(60, 180, 255, .1); color: #cdeeff; }
.lz-usage-code-btn.dev:hover { background: rgba(60, 180, 255, .22); border-color: #7cc8ff; }

.lz-account-row {
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .07);
}
.lz-acc-id { display: flex; align-items: center; gap: 6px; min-width: 0; }
.lz-acc-dot { width: 8px; height: 8px; border-radius: 50%; background: #00ff9c; box-shadow: 0 0 8px #00ff9c; flex: none; }
.lz-acc-name { font-size: .82rem; font-weight: 700; color: #f0fff8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lz-admin-tag {
  font-size: .64rem;
  font-weight: 800;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(255, 209, 102, .16);
  border: 1px solid rgba(255, 209, 102, .45);
  color: #ffd166;
}
.lz-logout-btn {
  border: 1px solid rgba(255, 91, 122, .35);
  background: rgba(255, 91, 122, .1);
  color: #ff9eb0;
  border-radius: 8px;
  padding: 4px 8px;
  font: 700 .72rem Inter, sans-serif;
  cursor: pointer;
  white-space: nowrap;
}
.lz-logout-btn:hover { background: rgba(255, 91, 122, .24); color: #fff; }

/* ---- Topbar Admin Reset, Notifications & User Chip ---- */
.admin-reset-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255, 209, 102, .55);
  background: linear-gradient(135deg, rgba(255, 209, 102, .22), rgba(255, 123, 84, .18));
  color: #ffe39b;
  font: 800 .79rem Inter, sans-serif;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  box-shadow: 0 0 18px rgba(255, 209, 102, .2);
  transition: transform .18s, box-shadow .18s;
}
.admin-reset-btn:hover { transform: translateY(-1px); box-shadow: 0 0 24px rgba(255, 209, 102, .4); }

.notif-top-btn, .user-top-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 11px;
  border-radius: 999px;
  border: 1px solid rgba(var(--acc-rgb), .26);
  background: rgba(255, 255, 255, .04);
  color: #e6fff5;
  font: 700 .8rem Inter, sans-serif;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}
.notif-top-btn:hover, .user-top-chip:hover { border-color: var(--acc); background: rgba(var(--acc-rgb), .12); }
.notif-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 999px;
  background: #ff4d6d;
  color: #fff;
  font-size: .68rem;
  font-weight: 800;
  display: grid;
  place-items: center;
}
.utc-avatar {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--acc, #00ff9c);
  color: #03150c;
  font-size: .74rem;
  font-weight: 900;
  display: grid;
  place-items: center;
}

/* ---- Auth Overlay ---- */
.lz-auth-overlay {
  position: fixed;
  inset: 0;
  z-index: 900;
  display: grid;
  place-items: center;
  padding: 18px;
  background: radial-gradient(circle at 20% 20%, rgba(var(--acc-rgb), .14), transparent 45%), rgba(2, 7, 5, .92);
  backdrop-filter: blur(18px);
}
.lz-auth-card {
  width: min(440px, 100%);
  padding: 26px 24px 22px;
  border-radius: 24px;
  background: linear-gradient(165deg, rgba(10, 28, 20, .96), rgba(4, 12, 8, .98));
  border: 1px solid rgba(var(--acc-rgb), .35);
  box-shadow: 0 32px 90px rgba(0, 0, 0, .75), 0 0 60px rgba(var(--acc-rgb), .14);
}
.lz-auth-brand { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.lz-auth-brand .logo { width: 46px; height: 46px; flex: none; }
.lz-auth-brand h1 { margin: 0; font-size: 1.45rem; }
.lz-auth-brand h1 span { color: var(--acc, #00ff9c); }
.lz-auth-brand p { margin: 3px 0 0; font-size: .82rem; color: var(--muted, #94b8a8); }
.lz-auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 4px;
  border-radius: 14px;
  background: rgba(0, 0, 0, .4);
  margin-bottom: 16px;
}
.lz-auth-tab {
  border: 0;
  background: transparent;
  color: var(--dim, #b2d8c7);
  padding: 9px 12px;
  border-radius: 10px;
  font: 700 .88rem Inter, sans-serif;
  cursor: pointer;
  transition: .2s;
}
.lz-auth-tab.on { background: var(--acc, #00ff9c); color: #03150c; }
.lz-auth-form { display: flex; flex-direction: column; gap: 12px; }
.lz-auth-field { display: flex; flex-direction: column; gap: 5px; }
.lz-auth-field label { font-size: .8rem; font-weight: 700; color: #ccefe0; }
.lz-auth-field input, .lz-auth-field select {
  min-height: 44px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(var(--acc-rgb), .28);
  background: rgba(0, 0, 0, .45);
  color: #fff;
  font: inherit;
  outline: none;
}
.lz-auth-field input:focus, .lz-auth-field select:focus {
  border-color: var(--acc, #00ff9c);
  box-shadow: 0 0 0 3px rgba(var(--acc-rgb), .16);
}
.lz-auth-err {
  padding: 9px 12px;
  border-radius: 10px;
  background: rgba(255, 77, 109, .14);
  border: 1px solid rgba(255, 77, 109, .42);
  color: #ffb3c1;
  font-size: .84rem;
}
.lz-auth-submit { min-height: 46px; justify-content: center; font-size: .95rem; margin-top: 4px; }
.lz-auth-foot {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, .07);
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  font-size: .75rem;
  color: var(--muted, #8eb3a2);
}

/* ---- Zero-Token Limit Card (with 2 Buttons: Gift Code & DEV CODE) ---- */
.lz-limit-card {
  margin: 10px 0;
  padding: 16px;
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255, 77, 109, .14), rgba(14, 10, 16, .92));
  border: 1px solid rgba(255, 91, 122, .45);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .4);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.lz-lim-head { display: flex; align-items: flex-start; gap: 10px; }
.lz-lim-ic { font-size: 1.5rem; line-height: 1; }
.lz-lim-head b { display: block; color: #ff9eb0; font-size: .95rem; }
.lz-lim-head p { margin: 4px 0 0; color: #fff; font-size: .95rem; font-weight: 600; }
.lz-lim-sub { font-size: .82rem; color: #d3c6ce; }
.lz-lim-btns { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 2px; }
.lz-lim-btn { min-height: 40px; padding: 0 16px; }
.lz-lim-btn.dev { border-color: rgba(124, 200, 255, .45); color: #bfe5ff; }

/* ---- Gift Code / DEV CODE Modal ---- */
.lz-code-balance {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(var(--acc-rgb), .08);
  border: 1px solid rgba(var(--acc-rgb), .24);
  margin-bottom: 12px;
  font-size: .88rem;
}
.lz-code-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px; }
.lz-code-tab {
  min-height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .1);
  background: rgba(0, 0, 0, .35);
  color: var(--dim);
  font: 700 .86rem Inter, sans-serif;
  cursor: pointer;
}
.lz-code-tab.on { background: rgba(var(--acc-rgb), .18); border-color: var(--acc); color: #fff; }
.lz-code-desc { margin: 0 0 12px; font-size: .86rem; color: var(--dim); line-height: 1.5; }
.lz-gift-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
@media (max-width: 540px) { .lz-gift-options { grid-template-columns: 1fr; } }
.lz-gift-chip {
  padding: 10px;
  border-radius: 12px;
  border: 1px solid rgba(var(--acc-rgb), .28);
  background: rgba(var(--acc-rgb), .06);
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 3px;
  text-align: left;
  cursor: pointer;
  transition: .18s;
}
.lz-gift-chip:hover:not(:disabled) { border-color: var(--acc); background: rgba(var(--acc-rgb), .16); }
.lz-gift-chip.used { opacity: .45; cursor: not-allowed; }
.lz-gift-chip b { color: var(--acc); font-family: 'JetBrains Mono', monospace; }
.lz-gift-chip span { font-size: .82rem; font-weight: 700; }
.lz-gift-chip small { font-size: .72rem; color: var(--muted); }
.lz-code-form { display: flex; gap: 8px; flex-wrap: wrap; }
.lz-code-form input {
  flex: 1 1 200px;
  min-height: 42px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(var(--acc-rgb), .3);
  background: rgba(0, 0, 0, .4);
  color: #fff;
  font: inherit;
}
.lz-code-feedback {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: .86rem;
  font-weight: 600;
}
.lz-code-feedback.ok { background: rgba(0, 255, 156, .12); border: 1px solid rgba(0, 255, 156, .4); color: #9effd8; }
.lz-code-feedback.err { background: rgba(255, 77, 109, .14); border: 1px solid rgba(255, 77, 109, .45); color: #ffb3c1; }

/* ---- Team Chat View ---- */
.teamchat-view { padding: 0; overflow: hidden; }
.tc-shell {
  display: grid;
  grid-template-columns: 290px minmax(0, 1fr);
  height: 100%;
  min-height: 0;
}
@media (max-width: 820px) { .tc-shell { grid-template-columns: 1fr; grid-template-rows: auto 1fr; } }
.tc-sidebar {
  border-inline-end: 1px solid rgba(255, 255, 255, .08);
  background: rgba(4, 12, 9, .78);
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow-y: auto;
}
.tc-sb-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.tc-sb-head h2 { margin: 0; font-size: 1.08rem; }
.tc-sb-head small { color: var(--muted); font-size: .76rem; }
.tc-create-box { display: flex; flex-direction: column; gap: 7px; padding-bottom: 12px; border-bottom: 1px solid rgba(255, 255, 255, .07); }
.tc-create-box input {
  min-height: 38px;
  padding: 0 10px;
  border-radius: 10px;
  border: 1px solid rgba(var(--acc-rgb), .24);
  background: rgba(0, 0, 0, .4);
  color: #fff;
  font: inherit;
  font-size: .84rem;
}
.tc-room-list { display: flex; flex-direction: column; gap: 6px; overflow-y: auto; }
.tc-room-item {
  width: 100%;
  text-align: left;
  padding: 10px 11px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .07);
  background: rgba(255, 255, 255, .02);
  color: inherit;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tc-room-item.on { border-color: var(--acc); background: rgba(var(--acc-rgb), .12); }
.tc-ri-top { display: flex; justify-content: space-between; gap: 6px; font-size: .88rem; }
.tc-ri-cnt { font-size: .74rem; color: var(--acc); font-weight: 700; }
.tc-room-item small { color: var(--muted); font-size: .76rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tc-empty-list { padding: 18px 12px; text-align: center; color: var(--muted); font-size: .86rem; border: 1px dashed rgba(255, 255, 255, .1); border-radius: 12px; }

.tc-main { display: flex; flex-direction: column; min-height: 0; background: rgba(3, 9, 6, .55); }
.tc-room-head {
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.tc-head-info h3 { margin: 0 0 6px; font-size: 1.05rem; }
.tc-member-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.tc-mpill, .lct-mpill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .1);
  font-size: .75rem;
}
.tc-mpill i, .lct-mpill i { width: 7px; height: 7px; border-radius: 50%; background: #64748b; }
.tc-mpill.on i, .lct-mpill.on i { background: #00ff9c; box-shadow: 0 0 6px #00ff9c; }
.tc-mremove, .lct-rm {
  border: 0;
  background: rgba(255, 91, 122, .2);
  color: #ff9eb0;
  border-radius: 50%;
  width: 17px;
  height: 17px;
  font-size: .68rem;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.tc-mremove:hover, .lct-rm:hover { background: #ff4d6d; color: #fff; }
.tc-add-form, .lct-add-form { display: flex; gap: 6px; align-items: center; }
.tc-add-form input, .lct-add-form input {
  min-height: 36px;
  padding: 0 10px;
  border-radius: 10px;
  border: 1px solid rgba(var(--acc-rgb), .28);
  background: rgba(0, 0, 0, .4);
  color: #fff;
  font: inherit;
  font-size: .82rem;
}
.tc-shared-note { font-size: .8rem; color: var(--muted); }
.tc-messages { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.tc-msg { display: flex; flex-direction: column; align-items: flex-start; max-width: min(760px, 90%); }
.tc-msg.mine { align-self: flex-end; align-items: flex-end; }
.tc-msg-meta { display: flex; gap: 8px; font-size: .74rem; color: var(--muted); margin-bottom: 3px; }
.tc-msg-author { font-weight: 700; color: var(--acc); }
.tc-msg.mine .tc-msg-author { color: #7cc8ff; }
.tc-msg-bubble {
  padding: 10px 14px;
  border-radius: 15px;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .08);
  line-height: 1.5;
  font-size: .92rem;
}
.tc-msg.mine .tc-msg-bubble { background: rgba(var(--acc-rgb), .14); border-color: rgba(var(--acc-rgb), .35); }
.tc-msg.ai .tc-msg-bubble { background: rgba(6, 20, 14, .92); border-color: rgba(var(--acc-rgb), .32); }
.tc-typing { min-height: 18px; padding: 0 16px; font-size: .78rem; color: var(--acc); font-style: italic; }
.tc-composer {
  padding: 12px 16px;
  border-top: 1px solid rgba(255, 255, 255, .08);
  display: flex;
  gap: 8px;
  align-items: center;
}
.tc-composer input {
  flex: 1;
  min-width: 0;
  min-height: 44px;
  padding: 0 14px;
  border-radius: 13px;
  border: 1px solid rgba(var(--acc-rgb), .28);
  background: rgba(0, 0, 0, .45);
  color: #fff;
  font: inherit;
}
.tc-empty-main { margin: auto; max-width: 420px; text-align: center; padding: 24px; color: var(--dim); }

/* ---- LokiCode Team Collaboration Bar ---- */
.lc-team-bar {
  margin: 0 0 12px;
  padding: 10px 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(var(--acc-rgb), .08), rgba(6, 16, 12, .9));
  border: 1px solid rgba(var(--acc-rgb), .26);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.lct-left, .lct-center, .lct-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.lct-label { font-size: .82rem; font-weight: 800; color: var(--acc); }
.lct-select {
  min-height: 34px;
  padding: 0 10px;
  border-radius: 9px;
  border: 1px solid rgba(var(--acc-rgb), .3);
  background: rgba(0, 0, 0, .45);
  color: #fff;
  font: 600 .82rem Inter, sans-serif;
}
.lct-live-dot { width: 8px; height: 8px; border-radius: 50%; background: #00ff9c; box-shadow: 0 0 8px #00ff9c; }
.lct-members-row { display: flex; gap: 6px; flex-wrap: wrap; }

/* ---- Shared Hub View & Notifications ---- */
.sharedhub-view { padding: 18px 22px; overflow-y: auto; }
.sh-wrap { max-width: 1120px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }
.sh-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.sh-head h2 { margin: 0; font-size: 1.35rem; }
.sh-head small { color: var(--muted); }
.sh-head-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.sh-section h3 { margin: 0 0 10px; font-size: 1rem; color: #eafff6; }
.sh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; }
.sh-card {
  padding: 14px;
  border-radius: 16px;
  background: rgba(8, 20, 14, .88);
  border: 1px solid rgba(var(--acc-rgb), .22);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sh-card-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .76rem; color: var(--muted); }
.sh-tag { padding: 2px 8px; border-radius: 999px; background: rgba(var(--acc-rgb), .15); color: var(--acc); font-weight: 800; text-transform: uppercase; font-size: .7rem; }
.sh-card h4 { margin: 0; font-size: 1rem; }
.sh-card p { margin: 0; font-size: .84rem; color: var(--dim); }
.sh-preview {
  margin: 0;
  padding: 10px;
  border-radius: 10px;
  background: rgba(0, 0, 0, .45);
  font-family: 'JetBrains Mono', monospace;
  font-size: .76rem;
  max-height: 130px;
  overflow: hidden;
  color: #c8f5e1;
}
.sh-card-acts { display: flex; gap: 8px; margin-top: auto; padding-top: 4px; }
.lz-notif-list { display: flex; flex-direction: column; gap: 10px; }
.lz-notif-item {
  padding: 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .08);
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
}
.lz-notif-item.unread { border-color: rgba(var(--acc-rgb), .45); background: rgba(var(--acc-rgb), .07); }
.lz-notif-top { width: 100%; display: flex; justify-content: space-between; gap: 8px; }
.lz-notif-item p { margin: 0; font-size: .86rem; color: var(--dim); }

/* ---- Topbar Shared Hub & Sidebar Chat History Space ---- */
.sharedhub-top-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(var(--acc-rgb), .14), rgba(124, 200, 255, .14));
  border: 1px solid rgba(var(--acc-rgb), .38);
  color: #eafff5;
  font-size: .78rem;
  font-weight: 800;
  cursor: pointer;
  transition: all .18s ease;
  white-space: nowrap;
  flex-shrink: 0;
}
.sharedhub-top-btn:hover,
.sharedhub-top-btn.active {
  background: linear-gradient(135deg, rgba(var(--acc-rgb), .3), rgba(124, 200, 255, .28));
  border-color: var(--acc);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(var(--acc-rgb), .26);
}
.sidebar {
  gap: 7px !important;
  padding: 12px 10px 10px !important;
  overflow: hidden;
}
.sidebar .brand { padding: 2px 6px 4px; }
.sidebar .btn-new { padding: 9px 12px; }
.sidebar .btn-lokicode { padding: 8px 10px; gap: 10px; margin-top: 0 !important; }
.sidebar .lc-icon { width: 28px; height: 28px; font-size: .78rem; flex-shrink: 0; }
.sidebar .history {
  flex: 1 1 180px !important;
  min-height: 150px !important;
  overflow-y: auto !important;
}
.sidebar .sidebar-foot { gap: 6px; padding-top: 8px; flex-shrink: 0; }
.sidebar .btn-settings { padding: 7px 10px; }
.sidebar .lz-usage-card { margin-top: 2px; padding: 8px 10px; gap: 4px; }
.sidebar .lz-account-row { margin-top: 2px; padding: 5px 8px; }
.mz, #lokiMascot { display: none !important; }

@media (max-width: 1040px) {
  .topbar {
    flex-wrap: wrap !important;
    gap: 6px !important;
    padding: 6px 10px !important;
    max-width: 100% !important;
  }
  .topbar #thinkPicker {
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
  }
  .topbar .top-actions {
    margin-inline-start: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    max-width: 100%;
  }
}

@media (max-width: 820px) {
  html, body, .app, .main {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
  .topbar {
    padding: 6px 8px !important;
    gap: 5px !important;
  }
  .topbar .model-picker,
  .topbar .think-picker {
    min-width: 0;
    max-width: 100%;
  }
  .topbar .model-btn,
  .topbar .think-btn {
    max-width: 100%;
  }
  .topbar .think-menu {
    left: 0;
    right: auto;
    width: min(320px, calc(100vw - 20px));
    transform-origin: top left;
  }
  .benches-top-btn,
  .sharedhub-top-btn,
  .admin-reset-btn,
  .notif-top-btn,
  .user-top-chip,
  .lokibot-nav-btn {
    padding: 3px 8px !important;
    height: 26px !important;
    font-size: .71rem !important;
    gap: 4px !important;
  }
  .user-top-chip .utc-avatar {
    width: 16px;
    height: 16px;
    font-size: .66rem;
  }
  .user-top-chip .utc-name {
    max-width: 82px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sidebar {
    max-height: 100dvh;
    overflow-y: auto;
  }
}

/* ================= v2.5: INVITE SHARING, FORMULA CALCULATOR, WEB IMAGES & VOICE VAD ================= */
.invite-top-btn{
  display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:999px;
  background:linear-gradient(135deg,rgba(0,255,156,.18),rgba(255,209,102,.16));
  border:1px solid rgba(0,255,156,.42);color:#eafff5;font-size:.76rem;font-weight:800;
  cursor:pointer;transition:all .18s ease;white-space:nowrap;flex-shrink:0;
}
.invite-top-btn:hover{
  background:linear-gradient(135deg,rgba(0,255,156,.34),rgba(255,209,102,.28));
  border-color:#00ff9c;color:#fff;transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(0,255,156,.25);
}
.lz-usage-actions{display:flex;gap:5px;flex-wrap:wrap}
.lz-usage-code-btn.invite{
  flex:1 1 100%;
  background:linear-gradient(135deg,rgba(0,255,156,.16),rgba(56,189,248,.14));
  border-color:rgba(0,255,156,.35);color:#b7ffe3;font-weight:700;
}
.lz-usage-code-btn.invite:hover{background:rgba(0,255,156,.26);color:#fff}
.lz-usage-pct.unlimited{
  font-size:1rem;color:#7bffcf;text-shadow:0 0 10px rgba(0,255,156,.5);
}
.lz-usage-pct.boosted{color:#ffd166}
.lz-auth-invite{
  margin:0 0 12px;padding:10px 12px;border-radius:12px;
  background:linear-gradient(135deg,rgba(0,255,156,.16),rgba(56,189,248,.12));
  border:1px solid rgba(0,255,156,.42);color:#eafff5;font-size:.84rem;
  text-align:center;line-height:1.4;
}
.lz-invite-box{display:flex;flex-direction:column;gap:14px}
.lz-invite-hero{
  display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;
  background:linear-gradient(135deg,rgba(0,255,156,.14),rgba(56,189,248,.1));
  border:1px solid rgba(0,255,156,.3);
}
.lz-invite-hero .ih-ic{font-size:2rem;line-height:1}
.lz-invite-hero b{display:block;font-size:1rem;color:#fff;margin-bottom:3px}
.lz-invite-hero small{color:var(--dim);font-size:.84rem;line-height:1.4;display:block}
.lz-invite-link-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.lz-invite-link-row input{
  flex:1;min-width:200px;min-height:42px;padding:0 12px;border-radius:11px;
  border:1px solid rgba(var(--acc-rgb),.32);background:rgba(0,0,0,.45);
  color:#a8ffdc;font-family:'JetBrains Mono',monospace;font-size:.8rem;
}
.lz-invite-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.lz-invite-stat{
  padding:12px;border-radius:12px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);text-align:center;
}
.lz-invite-stat b{display:block;font-size:1.25rem;color:var(--acc);margin-bottom:2px}
.lz-invite-stat span{font-size:.76rem;color:var(--muted)}

/* ---- Formula Calculator Card & Lab ---- */
.fc-card:not(.fc-scene .fc-card){
  height:auto !important;min-height:0 !important;
  transform:none !important;transform-style:flat !important;cursor:default;
  margin-top:12px;margin-bottom:16px;padding:18px 20px;border-radius:18px;
  background:linear-gradient(145deg,rgba(6,22,16,.96),rgba(4,12,10,.98));
  border:1px solid rgba(var(--acc-rgb),.36);
  box-shadow:0 14px 34px rgba(0,0,0,.48);
  display:flex;flex-direction:column;gap:14px;
}
.fc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}
.fc-head-left{display:flex;flex-direction:column;gap:4px}
.fc-domain{
  display:inline-flex;align-self:flex-start;padding:3px 10px;border-radius:999px;
  background:rgba(var(--acc-rgb),.16);border:1px solid rgba(var(--acc-rgb),.38);
  color:var(--acc);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
}
.fc-title{font-size:1.12rem;font-weight:800;color:#fff;margin:0}
.fc-desc{font-size:.86rem;color:var(--dim);margin:0;line-height:1.5}
.fc-formula-box{
  min-height:96px;padding:22px 26px;border-radius:14px;background:rgba(0,0,0,.52);
  border:1px solid rgba(var(--acc-rgb),.22);text-align:center;
  overflow-x:auto;overflow-y:visible;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  color:#eafff5;font-size:1.35rem;line-height:1.6;
}
.fc-katex{width:100%;overflow-x:auto;overflow-y:visible;padding:6px 4px}
.fc-katex .katex-display{margin:6px 0 !important;overflow-x:auto;overflow-y:visible;padding:4px 0}
.fc-expr-plain{margin-top:4px;font-family:'JetBrains Mono',monospace;font-size:.86rem;color:#8affd1;opacity:.9;word-break:break-word}
.fc-vars-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.fc-var{
  padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;gap:8px;
}
.fc-var label{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:.82rem;color:#cfeee0}
.fc-var label code{color:var(--acc);font-weight:800;font-size:.85rem}
.fc-var input[type="number"]{
  width:100%;min-height:38px;padding:0 12px;border-radius:9px;
  border:1px solid rgba(var(--acc-rgb),.32);background:rgba(0,0,0,.52);
  color:#fff;font-family:'JetBrains Mono',monospace;font-size:.94rem;
}
.fc-var input[type="range"]{width:100%;accent-color:var(--acc);cursor:pointer}
.fc-result-bar{
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:14px 18px;border-radius:14px;
  background:linear-gradient(135deg,rgba(var(--acc-rgb),.2),rgba(56,189,248,.14));
  border:1px solid rgba(var(--acc-rgb),.48);
}
.fc-res-label{font-size:.82rem;color:#b9f5dc;font-weight:700}
.fc-res-value{font-family:'JetBrains Mono',monospace;font-size:1.45rem;font-weight:800;color:#fff}
.fc-res-acts{display:flex;gap:8px;flex-wrap:wrap}

/* ---- Topic Internet Images Gallery Strip (Compact In-Bubble, No Links) ---- */
.web-img-strip{
  margin-top:8px;display:flex;flex-wrap:wrap;align-items:flex-start;
  gap:8px;max-width:100%;
}
.bubble .web-img-strip{
  margin-top:9px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08);
}
.web-img-card{
  position:relative;width:142px;border-radius:11px;overflow:hidden;
  background:rgba(5,16,12,.92);border:1px solid rgba(var(--acc-rgb),.28);
  display:flex;flex-direction:column;transition:transform .16s ease,border-color .16s ease;
  flex-shrink:0;
}
.web-img-card:hover{transform:translateY(-2px);border-color:var(--acc)}
.web-img-card img{
  width:142px;height:112px;object-fit:cover;object-position:center top;display:block;cursor:zoom-in;background:#030a07;
}
.web-img-meta{
  padding:4px 7px;display:flex;flex-direction:column;gap:1px;font-size:.68rem;
}
.web-img-meta b{
  color:#eafff5;font-size:.69rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* ---- Voice Dictation Active Pulse & Status ---- */
.tool-btn.mic.rec{
  color:#fff;background:linear-gradient(135deg,#00ff9c,#00b4d8);
  border-color:#00ff9c;box-shadow:0 0 18px rgba(0,255,156,.55);
  animation:micPulse 1.1s ease-in-out infinite alternate;
}
@keyframes micPulse{
  0%{transform:scale(1);box-shadow:0 0 10px rgba(0,255,156,.45)}
  100%{transform:scale(1.08);box-shadow:0 0 22px rgba(0,255,156,.85)}
}
@media (max-width:820px){
  .invite-top-btn,.admin-panel-btn{padding:3px 8px !important;height:26px !important;font-size:.71rem !important}
  .web-img-card,.web-img-card img{width:124px;height:98px}
}

/* ---- Lokizenith Admin Control Center, Reset Usages & Ban Pop-up ---- */
.admin-panel-btn{
  display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:999px;
  background:linear-gradient(135deg,rgba(168,85,247,.22),rgba(56,189,248,.18));
  border:1px solid rgba(168,85,247,.48);color:#f3e8ff;font-size:.76rem;font-weight:800;
  cursor:pointer;transition:all .18s ease;white-space:nowrap;flex-shrink:0;
}
.admin-panel-btn:hover{
  background:linear-gradient(135deg,rgba(168,85,247,.38),rgba(56,189,248,.32));
  border-color:#c084fc;color:#fff;transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(168,85,247,.32);
}
.adm-wide-card{max-width:1200px !important}
.adm-tabs{display:flex;gap:8px;margin-bottom:14px;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:10px}
.adm-tab{
  padding:8px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);color:var(--dim);font-weight:700;cursor:pointer;font-size:.86rem;
}
.adm-tab.on{background:rgba(var(--acc-rgb),.18);border-color:var(--acc);color:#fff}
.adm-user-add-row{display:flex;gap:8px;margin-bottom:12px}
.adm-user-add-row input,.adm-dir-bar input,.adm-ban-controls input,.adm-ban-controls select{
  min-height:40px;padding:0 12px;border-radius:10px;border:1px solid rgba(var(--acc-rgb),.3);
  background:rgba(0,0,0,.45);color:#fff;font:inherit;font-size:.86rem;
}
.adm-user-add-row input,.adm-dir-bar input{flex:1;min-width:180px}
.adm-selected-queue{
  padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.09);margin-bottom:12px;
}
.adm-q-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:.82rem;color:#cfeee0}
.adm-q-chips{display:flex;flex-wrap:wrap;gap:6px}
.adm-q-chip{
  display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;
  background:rgba(var(--acc-rgb),.18);border:1px solid rgba(var(--acc-rgb),.45);color:#fff;font-size:.8rem;font-weight:700;
}
.adm-q-chip button{border:0;background:transparent;color:#ff9eb0;cursor:pointer;font-weight:800;padding:0}
.adm-live-table-wrap{
  max-height:280px;overflow:auto;border-radius:12px;
  border:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.34);
}
.adm-live-table-wrap.tall{max-height:420px}
.adm-lt-hdr{
  display:flex;justify-content:space-between;padding:8px 12px;font-size:.76rem;color:var(--muted);
  border-bottom:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02);
}
.adm-table{width:100%;border-collapse:collapse;font-size:.81rem}
.adm-table th{
  text-align:left;padding:9px 10px;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;background:#07120d;z-index:2;white-space:nowrap;
}
.adm-table td{padding:9px 10px;border-bottom:1px solid rgba(255,255,255,.06);vertical-align:middle}
.adm-row-pick{cursor:pointer;transition:background .12s}
.adm-row-pick:hover{background:rgba(var(--acc-rgb),.08)}
.adm-row-pick.picked{background:rgba(var(--acc-rgb),.14)}
.adm-pill-online{color:#00ff9c;font-weight:700;font-size:.78rem}
.adm-pill-offline{color:var(--muted);font-size:.78rem}
.adm-pill-ban{
  display:inline-flex;padding:2px 7px;border-radius:999px;background:rgba(239,68,68,.2);
  border:1px solid rgba(239,68,68,.5);color:#fca5a5;font-size:.7rem;font-weight:800;
}
.adm-tag-inf{padding:1px 6px;border-radius:999px;background:rgba(0,255,156,.18);color:#7bffcf;font-size:.72rem;font-weight:800}
.adm-pw-cell{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.adm-pw-val{padding:2px 7px;border-radius:6px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#fde68a;font-size:.77rem}
.adm-pw-val.muted{color:var(--muted);font-size:.72rem}
.adm-mini-btn{
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:var(--dim);
  border-radius:6px;padding:2px 6px;font-size:.72rem;cursor:pointer;
}
.adm-mini-btn:hover{border-color:var(--acc);color:#fff}
.adm-dev-cell{font-size:.79rem;color:#dffef0;font-weight:600}
.lz-invite-code-row{
  display:flex;gap:8px;align-items:center;margin:10px 0 6px;
}
.lz-inv-code-lbl{font-size:.82rem;color:var(--dim);font-weight:700;white-space:nowrap}
.lz-invite-code-row input{
  flex:1;min-height:38px;padding:0 12px;border-radius:10px;border:1px solid rgba(var(--acc-rgb),.32);
  background:rgba(0,0,0,.45);color:#fff;font-family:'JetBrains Mono',monospace;font-size:.92rem;font-weight:700;letter-spacing:.05em;
}
.adm-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:14px}
.adm-kpi{
  padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;gap:3px;
}
.adm-kpi.live{border-color:rgba(0,255,156,.38);background:rgba(0,255,156,.08)}
.adm-kpi.ban{border-color:rgba(239,68,68,.38);background:rgba(239,68,68,.08)}
.adm-kpi small{font-size:.72rem;color:var(--muted)}
.adm-kpi b{font-size:1.18rem;color:#fff}
.adm-dir-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.adm-filters{display:flex;gap:5px;flex-wrap:wrap}
.adm-fbtn{
  padding:6px 10px;border-radius:9px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);color:var(--dim);font-size:.78rem;font-weight:700;cursor:pointer;
}
.adm-fbtn.on{background:rgba(var(--acc-rgb),.18);border-color:var(--acc);color:#fff}
.adm-u-cell{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.adm-subline{display:block;font-size:.72rem;color:var(--muted);margin-top:2px}
.adm-row-acts{display:flex;gap:6px;flex-wrap:wrap}
.adm-row-acts button{padding:4px 9px;font-size:.75rem}
.adm-act-ban{color:#fca5a5 !important;border-color:rgba(239,68,68,.4) !important}
.adm-ban-form{
  padding:12px;border-radius:12px;background:rgba(239,68,68,.08);
  border:1px solid rgba(239,68,68,.42);margin-bottom:12px;display:flex;flex-direction:column;gap:10px;
}
.adm-ban-head{display:flex;justify-content:space-between;align-items:center}
.adm-ban-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.adm-ban-dur-row{display:flex;gap:6px;align-items:center}
.adm-ban-dur-row input{width:76px}
.lz-ban-modal{z-index:99999 !important;background:rgba(2,6,5,.92) !important;backdrop-filter:blur(16px)}
.lz-ban-card{max-width:460px !important;border-color:rgba(239,68,68,.55) !important}
.lz-ban-countdown-box{
  margin:10px auto;padding:12px 14px;border-radius:12px;background:rgba(239,68,68,.12);
  border:1px solid rgba(239,68,68,.4);display:flex;flex-direction:column;gap:4px;
}
.lz-ban-countdown-box small{font-size:.74rem;color:#fca5a5;text-transform:uppercase;letter-spacing:.04em}
.lz-ban-countdown-box b{font-size:1rem;color:#fff;font-family:'JetBrains Mono',monospace}

/* ================= v4.0: GOOGLE OAUTH, LIVE ACCOUNT INSPECT, SOUNDBOARD & 9-MODULE ADMIN SUITE ================= */
.lz-auth-oauth-wrap{display:flex;flex-direction:column;gap:12px;margin-bottom:8px}
.lz-google-btn{
  width:100%;min-height:46px;padding:10px 16px;border-radius:13px;
  border:1px solid rgba(255,255,255,.2);
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(241,245,249,.95));
  color:#0f172a;font:700 .92rem Inter,sans-serif;
  display:flex;align-items:center;justify-content:center;gap:10px;
  cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1);
  box-shadow:0 8px 24px rgba(0,0,0,.35);
}
.lz-google-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(0,255,156,.25);
  background:#fff;
}
.lz-google-btn:active{transform:translateY(0)}
.lz-google-ic{flex-shrink:0}
.lz-auth-divider{
  display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.73rem;
  text-transform:uppercase;letter-spacing:.06em;margin:2px 0;
}
.lz-auth-divider::before,.lz-auth-divider::after{
  content:'';flex:1;height:1px;background:rgba(255,255,255,.1);
}

/* ---- Live Account Inspection Top Bar ---- */
.lz-inspect-bar{
  position:fixed;top:0;left:0;right:0;z-index:99990;
  min-height:46px;padding:6px 18px;
  background:linear-gradient(90deg,rgba(88,28,135,.96),rgba(15,23,42,.96),rgba(6,78,59,.96));
  border-bottom:1px solid rgba(192,132,252,.55);
  box-shadow:0 8px 30px rgba(0,0,0,.6);
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  backdrop-filter:blur(14px);
  animation:admSlideDown .28s cubic-bezier(.16,1,.3,1);
}
body.is-inspecting-account .app{padding-top:46px !important}
.lz-inspect-left,.lz-inspect-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.lz-inspect-pulse{
  width:10px;height:10px;border-radius:50%;background:#c084fc;
  box-shadow:0 0 12px #c084fc;animation:micPulse 1s infinite alternate;
}
.lz-inspect-badge{
  padding:3px 9px;border-radius:999px;background:rgba(192,132,252,.22);
  border:1px solid rgba(192,132,252,.55);color:#f3e8ff;font-size:.72rem;font-weight:800;letter-spacing:.05em;
}
.lz-inspect-txt{font-size:.85rem;color:#f8fafc}
.lz-inspect-txt b{color:#7bffcf;font-weight:800}
.lz-inspect-meta{font-size:.78rem;color:#cbd5e1;font-family:'JetBrains Mono',monospace}
.lz-inspect-btn{
  padding:5px 12px;border-radius:9px;border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.08);color:#fff;font-size:.78rem;font-weight:700;cursor:pointer;transition:all .16s;
}
.lz-inspect-btn:hover{background:rgba(255,255,255,.16);border-color:#fff}
.lz-inspect-btn.back{
  background:linear-gradient(135deg,#a855f7,#00d98b);border-color:rgba(255,255,255,.35);
  color:#fff;font-weight:800;box-shadow:0 4px 16px rgba(168,85,247,.4);
}
.lz-inspect-btn.back:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(0,255,156,.45)}

/* ---- Global Pinned MOTD Ribbon ---- */
.lz-motd-ribbon{
  position:fixed;top:0;left:0;right:0;z-index:99980;
  min-height:36px;padding:5px 16px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:.82rem;font-weight:700;color:#fff;backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(0,255,156,.4);
  background:linear-gradient(90deg,rgba(4,47,36,.95),rgba(6,78,59,.95));
}
body.is-inspecting-account .lz-motd-ribbon{top:46px}
body.has-motd-ribbon .app{padding-top:36px}
body.is-inspecting-account.has-motd-ribbon .app{padding-top:82px !important}
.lz-motd-ribbon.theme-gold{background:linear-gradient(90deg,rgba(120,53,15,.95),rgba(180,83,9,.92));border-color:rgba(251,191,36,.5)}
.lz-motd-ribbon.theme-cyber{background:linear-gradient(90deg,rgba(12,74,110,.95),rgba(30,58,138,.92));border-color:rgba(56,189,248,.5)}
.lz-motd-ribbon.theme-crimson{background:linear-gradient(90deg,rgba(127,29,29,.95),rgba(153,27,27,.92));border-color:rgba(248,113,113,.5)}
.lz-motd-inner{display:flex;align-items:center;gap:8px;margin:0 auto}
.lz-motd-close{border:0;background:transparent;color:#fff;opacity:.75;cursor:pointer;font-size:.85rem}
.lz-motd-close:hover{opacity:1}

/* ---- Live Audio PA & Soundboard Floating HUD ---- */
.lz-live-audio-hud{
  position:fixed;bottom:22px;right:22px;z-index:99995;
  padding:12px 16px;border-radius:16px;
  background:linear-gradient(135deg,rgba(15,10,34,.96),rgba(6,28,22,.96));
  border:1px solid rgba(0,255,156,.55);
  box-shadow:0 16px 42px rgba(0,0,0,.7),0 0 28px rgba(0,255,156,.28);
  display:flex;align-items:center;gap:12px;max-width:420px;
  backdrop-filter:blur(16px);
  animation:admPopIn .25s cubic-bezier(.16,1,.3,1);
}
.lah-waves{display:flex;align-items:flex-end;gap:3px;height:24px}
.lah-waves span{
  width:4px;border-radius:99px;background:linear-gradient(180deg,#00ff9c,#a855f7);
  animation:lahWave .55s ease-in-out infinite alternate;
}
.lah-waves span:nth-child(1){height:10px;animation-delay:0s}
.lah-waves span:nth-child(2){height:20px;animation-delay:.12s}
.lah-waves span:nth-child(3){height:14px;animation-delay:.24s}
.lah-waves span:nth-child(4){height:24px;animation-delay:.08s}
.lah-waves span:nth-child(5){height:12px;animation-delay:.2s}
@keyframes lahWave{0%{transform:scaleY(.35)}100%{transform:scaleY(1)}}
.lah-info{display:flex;flex-direction:column;gap:2px;min-width:0}
.lah-info b{font-size:.84rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lah-info small{font-size:.74rem;color:#a7f3d0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lah-stop{
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.07);
  color:#fff;border-radius:8px;padding:4px 9px;font-size:.72rem;cursor:pointer;
}

/* ---- Global Broadcast Notice Modal (Pure Announcement, No Token Reset) ---- */
.lz-bcast-modal-card{
  border-color:rgba(168,85,247,.55) !important;
  background:radial-gradient(circle at top,rgba(168,85,247,.2),rgba(5,14,11,.97) 70%) !important;
  box-shadow:0 24px 64px rgba(0,0,0,.75),0 0 40px rgba(168,85,247,.25) !important;
}
.lz-bcast-badge{
  display:inline-block;padding:4px 12px;border-radius:999px;
  background:linear-gradient(135deg,rgba(168,85,247,.26),rgba(0,255,156,.2));
  border:1px solid rgba(192,132,252,.5);color:#f3e8ff;font-size:.72rem;font-weight:800;
  letter-spacing:.06em;margin-bottom:8px;
}

/* ---- Upgraded 9-Module Lokizenith Admin Command Suite ---- */
@keyframes admSlideDown{from{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes admPopIn{from{transform:scale(.94) translateY(8px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}
@keyframes admGlowBorder{
  0%{box-shadow:0 25px 70px rgba(0,0,0,.8),0 0 28px rgba(0,255,156,.16)}
  100%{box-shadow:0 25px 70px rgba(0,0,0,.8),0 0 38px rgba(168,85,247,.28)}
}

.adm-suite-card{
  width:min(1380px,96vw) !important;
  max-width:1380px !important;
  max-height:92vh !important;
  display:flex !important;
  flex-direction:column !important;
  background:radial-gradient(circle at 12% 0%,rgba(168,85,247,.16),transparent 42%),radial-gradient(circle at 88% 0%,rgba(0,255,156,.14),transparent 42%),linear-gradient(180deg,#06110d,#040907) !important;
  border:1px solid rgba(0,255,156,.38) !important;
  border-radius:22px !important;
  animation:admGlowBorder 4s ease-in-out infinite alternate;
  overflow:hidden !important;
}
.adm-suite-header{
  padding:14px 20px !important;
  background:linear-gradient(90deg,rgba(168,85,247,.14),rgba(0,255,156,.1),rgba(56,189,248,.1));
  border-bottom:1px solid rgba(255,255,255,.1) !important;
  display:flex !important;align-items:center !important;justify-content:space-between !important;gap:12px;width:100%;
}
.adm-suite-title-wrap{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.adm-suite-orb{
  width:42px;height:42px;border-radius:13px;
  background:linear-gradient(135deg,#a855f7,#00ff9c);
  display:flex;align-items:center;justify-content:center;font-size:1.35rem;
  box-shadow:0 0 20px rgba(168,85,247,.45);flex-shrink:0;
}
.adm-suite-sub{display:block;font-size:.75rem;color:#a7f3d0;margin-top:2px}
.adm-suite-head-right{display:flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0}
.adm-suite-live-pill{
  display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;
  background:rgba(0,255,156,.12);border:1px solid rgba(0,255,156,.4);
  color:#7bffcf;font-size:.72rem;font-weight:800;letter-spacing:.04em;
}
.adm-suite-live-pill i{width:7px;height:7px;border-radius:50%;background:#00ff9c;box-shadow:0 0 8px #00ff9c}
.adm-suite-shell{padding:16px 20px !important;overflow-y:auto !important;flex:1;display:flex;flex-direction:column;gap:14px}

.adm-suite-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:10px}
.adm-kpi-card{
  padding:11px 14px;border-radius:14px;
  background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.09);
  display:flex;align-items:center;gap:11px;transition:transform .18s ease,border-color .18s ease;
}
.adm-kpi-card:hover{transform:translateY(-2px);border-color:rgba(0,255,156,.45)}
.adm-kpi-card.live{border-color:rgba(0,255,156,.42);background:linear-gradient(145deg,rgba(0,255,156,.12),rgba(0,255,156,.03))}
.adm-kpi-card.ban{border-color:rgba(239,68,68,.42);background:linear-gradient(145deg,rgba(239,68,68,.12),rgba(239,68,68,.03))}
.adm-kpi-ic{font-size:1.45rem;line-height:1}
.adm-kpi-card small{display:block;font-size:.72rem;color:var(--muted)}
.adm-kpi-card b{font-size:1.15rem;color:#fff;font-weight:800}

.adm-suite-nav{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  gap:8px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.adm-suite-tab{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex:0 1 auto;
  max-width:100%;
  padding:9px 14px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
  color:#cbd5e1;
  font-size:.77rem;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
  transition:all .18s cubic-bezier(.16,1,.3,1);
}
.adm-suite-tab:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateY(-1px)}
.adm-suite-tab.on{
  background:linear-gradient(135deg,rgba(168,85,247,.32),rgba(0,255,156,.24));
  border-color:#00ff9c;color:#fff;
  box-shadow:0 6px 20px rgba(0,255,156,.2);
}
.ast-ic{flex-shrink:0;line-height:1}
.ast-lbl{line-height:1.2}
.ast-badge{
  position:static;
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:2px 8px;
  border-radius:999px;
  background:rgba(0,0,0,.48);
  border:1px solid rgba(255,255,255,.18);
  font-size:.69rem;
  font-weight:800;
  color:#7bffcf;
  line-height:1.2;
}
.adm-suite-stage{min-height:0}

/* ---- Directory Action Drawers, Role Badges & Scrollable Account Cards ---- */
.adm-action-drawer{
  padding:13px 16px;border-radius:14px;margin-bottom:12px;
  display:flex;flex-direction:column;gap:10px;
}
.adm-action-drawer.ban{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.45)}
.adm-action-drawer.tokens{background:rgba(0,255,156,.09);border:1px solid rgba(0,255,156,.42)}
.adm-action-drawer.pw{background:rgba(168,85,247,.11);border:1px solid rgba(168,85,247,.45)}
.adm-drawer-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.adm-quick-gift-pills{display:flex;gap:5px}
.adm-u-av{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1px solid rgba(0,255,156,.45);flex-shrink:0}
.adm-u-av-txt{
  width:34px;height:34px;border-radius:50%;
  background:linear-gradient(135deg,rgba(0,255,156,.24),rgba(168,85,247,.24));
  border:1px solid rgba(0,255,156,.38);color:#fff;font-weight:800;font-size:.86rem;
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
}
.adm-tag-google{
  display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;border-radius:50%;background:#fff;color:#ea4335;
  font-weight:900;font-size:.68rem;flex-shrink:0;
}
.adm-row-online{background:rgba(0,255,156,.03)}
.adm-act-inspect{
  background:linear-gradient(135deg,#8b5cf6,#00d98b) !important;
  border:1px solid rgba(255,255,255,.28) !important;color:#fff !important;font-weight:800 !important;
}
.adm-role-badge{
  display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;
  font-size:.67rem;font-weight:800;letter-spacing:.03em;white-space:nowrap;
}
.adm-role-badge.owner{
  background:linear-gradient(135deg,rgba(250,204,21,.24),rgba(234,88,12,.22));
  border:1px solid rgba(250,204,21,.55);color:#fef08a;
}
.adm-role-badge.full{
  background:rgba(0,255,156,.16);border:1px solid rgba(0,255,156,.45);color:#7bffcf;
}
.adm-role-badge.partial{
  background:rgba(168,85,247,.2);border:1px solid rgba(192,132,252,.5);color:#e9d5ff;
}
.adm-role-badge.none{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:#94a3b8;
}
.adm-dir-sticky-bar{
  position:sticky;top:0;z-index:6;
  padding:10px 12px;border-radius:14px;
  background:rgba(5,14,11,.94);backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.1);
}
.adm-sort-select{
  min-height:38px;padding:0 10px;border-radius:9px;
  border:1px solid rgba(0,255,156,.32);background:rgba(0,0,0,.55);
  color:#e2e8f0;font:600 .78rem Inter,sans-serif;
}
.adm-accounts-scroll-meta{
  display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;
  padding:4px 8px 8px;font-size:.76rem;color:#94a3b8;
}
.adm-accounts-scroll-viewport{
  max-height:460px;overflow-y:auto;overflow-x:hidden;
  padding:8px;border-radius:16px;
  background:rgba(2,8,6,.58);border:1px solid rgba(0,255,156,.22);
  display:flex;flex-direction:column;gap:9px;
  scroll-behavior:smooth;
}
.adm-accounts-scroll-viewport::-webkit-scrollbar{width:8px}
.adm-accounts-scroll-viewport::-webkit-scrollbar-track{background:rgba(255,255,255,.03);border-radius:99px}
.adm-accounts-scroll-viewport::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(0,255,156,.45),rgba(168,85,247,.45));
  border-radius:99px;
}
.adm-acc-card{
  display:grid;
  grid-template-columns:minmax(220px,1.35fr) minmax(175px,1fr) minmax(175px,1fr) minmax(240px,1.35fr);
  gap:12px;align-items:center;
  padding:12px 14px;border-radius:14px;
  background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(0,0,0,.42));
  border:1px solid rgba(255,255,255,.09);
  transition:border-color .16s ease,transform .16s ease,background .16s ease;
}
.adm-acc-card:hover{
  border-color:rgba(0,255,156,.42);
  background:linear-gradient(145deg,rgba(0,255,156,.06),rgba(168,85,247,.05));
}
.adm-acc-card.online{
  border-left:3px solid #00ff9c;
}
.adm-acc-card.banned{
  border-color:rgba(239,68,68,.45);
  background:linear-gradient(145deg,rgba(239,68,68,.09),rgba(0,0,0,.45));
}
.adm-acc-col{min-width:0;display:flex;flex-direction:column;gap:5px}
.adm-acc-user{flex-direction:row;align-items:center;gap:10px}
.adm-acc-av-wrap{position:relative;flex-shrink:0}
.adm-acc-dot{
  position:absolute;bottom:0;right:0;width:10px;height:10px;border-radius:50%;
  background:#64748b;border:2px solid #06110d;
}
.adm-acc-dot.on{background:#00ff9c;box-shadow:0 0 8px #00ff9c}
.adm-acc-ident{min-width:0;display:flex;flex-direction:column;gap:2px}
.adm-acc-name-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.adm-acc-name{font-size:.9rem;color:#fff;font-weight:800}
.adm-acc-status-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:2px}
.adm-acc-qtop{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:.79rem;color:#e2e8f0}
.adm-acc-prog{height:6px;border-radius:99px;background:rgba(255,255,255,.09);overflow:hidden}
.adm-acc-prog i{display:block;height:100%;background:linear-gradient(90deg,#00ff9c,#38bdf8);border-radius:99px}
.adm-acc-acts{align-items:flex-end;justify-content:center}

/* ---- Admin Access & Roles Studio (🔐 Access & Roles Tab) ---- */
.adm-access-shell{display:flex;flex-direction:column;gap:14px}
.adm-access-owner-banner{
  padding:14px 18px;border-radius:16px;
  background:linear-gradient(135deg,rgba(250,204,21,.14),rgba(168,85,247,.16),rgba(0,255,156,.12));
  border:1px solid rgba(250,204,21,.45);
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.adm-aob-left{display:flex;align-items:center;gap:12px}
.adm-aob-crown{
  width:42px;height:42px;border-radius:12px;
  background:linear-gradient(135deg,#facc15,#f97316);
  display:flex;align-items:center;justify-content:center;font-size:1.35rem;
  box-shadow:0 0 18px rgba(250,204,21,.38);flex-shrink:0;
}
.adm-aob-left b{display:block;font-size:.95rem;color:#fff}
.adm-aob-left small{display:block;font-size:.77rem;color:#fde68a;margin-top:2px}
.adm-aob-badges{display:flex;gap:8px;flex-wrap:wrap}
.adm-access-grid{
  display:grid;grid-template-columns:minmax(340px,1.1fr) minmax(340px,1fr);gap:14px;
}
.adm-access-editor,.adm-access-roster{display:flex;flex-direction:column;gap:10px}
.adm-tier-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:4px}
.adm-tier-card{
  padding:10px;border-radius:12px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);cursor:pointer;display:flex;flex-direction:column;gap:3px;
  transition:all .16s ease;
}
.adm-tier-card input{display:none}
.adm-tier-card b{font-size:.8rem;color:#fff}
.adm-tier-card small{font-size:.7rem;color:var(--muted);line-height:1.3}
.adm-tier-card.on{
  border-color:#00ff9c;background:linear-gradient(145deg,rgba(0,255,156,.16),rgba(168,85,247,.14));
  box-shadow:0 6px 18px rgba(0,255,156,.16);
}
.adm-perms-box{
  padding:12px;border-radius:12px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.09);display:flex;flex-direction:column;gap:8px;
}
.adm-perms-head{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.78rem;color:#cbd5e1}
.adm-perms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:7px}
.adm-perm-item{
  padding:8px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.1);
  background:rgba(0,0,0,.38);cursor:pointer;display:flex;align-items:flex-start;gap:8px;
  transition:border-color .15s ease,background .15s ease;
}
.adm-perm-item.on{border-color:rgba(0,255,156,.5);background:rgba(0,255,156,.1)}
.adm-perm-item b{display:block;font-size:.76rem;color:#fff}
.adm-perm-item small{display:block;font-size:.67rem;color:var(--muted);line-height:1.25}
.adm-access-roster-scroll{
  max-height:380px;overflow-y:auto;display:flex;flex-direction:column;gap:7px;padding-right:4px;
}
.adm-roster-row{
  padding:9px 11px;border-radius:11px;background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.adm-roster-row.selected{border-color:#00ff9c;background:rgba(0,255,156,.09)}
.adm-roster-left{display:flex;align-items:center;gap:9px;min-width:0}
.adm-roster-right{display:flex;align-items:center;gap:7px;flex-wrap:wrap}

/* ---- X-Ray Module ---- */
.adm-xray-shell{display:flex;flex-direction:column;gap:14px}
.adm-xray-top{padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09)}
.adm-select{
  min-height:38px;padding:0 12px;border-radius:10px;border:1px solid rgba(0,255,156,.35);
  background:rgba(0,0,0,.55);color:#fff;font:600 .85rem Inter,sans-serif;
}
.adm-empty-state{
  padding:36px 20px;text-align:center;border-radius:16px;
  background:rgba(255,255,255,.025);border:1px dashed rgba(255,255,255,.15);color:var(--dim);
}
.adm-xray-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px}
.adm-xray-card{
  padding:14px;border-radius:14px;background:rgba(0,0,0,.38);border:1px solid rgba(255,255,255,.09);
}
.adm-xray-card h4{margin:0 0 10px;font-size:.92rem;color:#7bffcf}
.adm-kv-list{display:flex;flex-direction:column;gap:6px;font-size:.82rem}
.adm-kv-list > div{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid rgba(255,255,255,.05);padding-bottom:4px}
.adm-kv-list span{color:var(--muted)}
.adm-code-preview{
  margin:0;padding:10px;border-radius:10px;background:rgba(0,0,0,.6);
  max-height:170px;overflow:auto;font-family:'JetBrains Mono',monospace;font-size:.76rem;color:#a7f3d0;
}
.adm-xray-chats-box{
  display:grid;grid-template-columns:280px 1fr;gap:12px;min-height:280px;
}
.adm-xray-chats-list,.adm-xray-transcript{
  padding:12px;border-radius:14px;background:rgba(0,0,0,.38);border:1px solid rgba(255,255,255,.09);
  display:flex;flex-direction:column;gap:8px;max-height:360px;overflow-y:auto;
}
.adm-xray-conv-btn{
  text-align:left;padding:9px 11px;border-radius:10px;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);color:#e2e8f0;cursor:pointer;display:flex;flex-direction:column;gap:2px;
}
.adm-xray-conv-btn.on{border-color:#00ff9c;background:rgba(0,255,156,.12)}
.adm-xray-conv-btn small{font-size:.72rem;color:var(--muted)}
.adm-xray-msgs{display:flex;flex-direction:column;gap:8px}
.adm-xmsg{padding:9px 12px;border-radius:11px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);font-size:.83rem}
.adm-xmsg.usr{border-color:rgba(56,189,248,.35);background:rgba(56,189,248,.08)}
.adm-xmsg.ai{border-color:rgba(0,255,156,.3);background:rgba(0,255,156,.06)}
.adm-xmsg-meta{font-size:.73rem;color:#7bffcf;margin-bottom:3px}

/* ---- Soundboard & Live Voice PA Module ---- */
.adm-soundboard-shell{display:flex;flex-direction:column;gap:16px}
.adm-voice-pa-card{
  padding:18px;border-radius:18px;
  background:radial-gradient(circle at right top,rgba(236,72,153,.2),rgba(88,28,135,.22),rgba(4,18,14,.95));
  border:1px solid rgba(236,72,153,.45);
  box-shadow:0 12px 32px rgba(0,0,0,.45);
}
.adm-vpa-badge{
  display:inline-block;padding:3px 10px;border-radius:999px;
  background:rgba(236,72,153,.22);border:1px solid rgba(244,114,182,.55);
  color:#fbcfe8;font-size:.7rem;font-weight:800;letter-spacing:.06em;margin-bottom:6px;
}
.adm-voice-pa-card h3{margin:0 0 6px;font-size:1.1rem;color:#fff}
.adm-voice-pa-card p{margin:0 0 12px;font-size:.84rem;color:#e2e8f0}
.adm-vpa-filters{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:12px}
.adm-vfilter-btn{
  padding:6px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.4);color:#e2e8f0;font-size:.76rem;font-weight:700;cursor:pointer;
}
.adm-vfilter-btn.on{background:linear-gradient(135deg,#ec4899,#8b5cf6);border-color:#f9a8d4;color:#fff}
.adm-vpa-controls{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.adm-vpa-controls input,.adm-sb-header input{
  min-height:40px;padding:0 12px;border-radius:10px;border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.5);color:#fff;font:inherit;font-size:.84rem;
}
.adm-rec-btn.recording{
  background:linear-gradient(135deg,#ef4444,#f97316) !important;
  animation:micPulse .8s infinite alternate;
}
.adm-rec-ready{margin-top:10px;font-size:.81rem;color:#7bffcf;font-weight:700}
.adm-sb-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.adm-sb-header h3{margin:0;font-size:1rem;color:#fff}
.adm-sb-header small{color:var(--muted);font-size:.8rem}
.adm-soundboard-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:11px;
}
.adm-sound-card{
  padding:13px;border-radius:15px;
  background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(0,0,0,.45));
  border:1px solid rgba(255,255,255,.11);
  display:flex;flex-direction:column;gap:6px;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.adm-sound-card:hover{
  transform:translateY(-3px);
  border-color:var(--sc-color,#00ff9c);
  box-shadow:0 10px 26px rgba(0,0,0,.5);
}
.adm-sc-top{display:flex;align-items:center;justify-content:space-between}
.adm-sc-icon{font-size:1.65rem;line-height:1}
.adm-sc-tag{
  padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.08);
  color:var(--sc-color,#7bffcf);font-size:.66rem;font-weight:800;letter-spacing:.05em;
}
.adm-sound-card b{font-size:.9rem;color:#fff}
.adm-sound-card small{font-size:.75rem;color:var(--muted);line-height:1.35;margin-bottom:4px}
.adm-sc-actions{display:flex;gap:6px;margin-top:auto}
.adm-sc-actions button{flex:1;padding:6px 8px;font-size:.75rem}

/* ---- Broadcast, Scheduler, Leaderboards, Promo Studio & Security ---- */
.adm-bcast-grid,.adm-codes-studio-grid,.adm-bcast-lists-grid,.adm-sec-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:14px;
}
.adm-bcast-lists-grid{margin-top:14px}
.adm-bcast-card,.adm-bcast-list-box,.adm-lb-card{
  padding:16px;border-radius:16px;background:rgba(0,0,0,.38);
  border:1px solid rgba(255,255,255,.1);
}
.adm-card-badge{
  display:inline-block;padding:3px 9px;border-radius:999px;
  background:rgba(0,255,156,.15);border:1px solid rgba(0,255,156,.4);
  color:#7bffcf;font-size:.68rem;font-weight:800;letter-spacing:.05em;margin-bottom:6px;
}
.adm-card-badge.gold{background:rgba(245,158,11,.18);border-color:rgba(245,158,11,.48);color:#fde68a}
.adm-bcast-card h3,.adm-bcast-list-box h4,.adm-lb-card h4{margin:0 0 8px;color:#fff}
.adm-form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.adm-field{display:flex;flex-direction:column;gap:5px}
.adm-field label{font-size:.75rem;color:#cbd5e1;font-weight:700}
.adm-field input,.adm-field select,.adm-field textarea,.adm-bcast-card select{
  min-height:38px;padding:8px 11px;border-radius:10px;border:1px solid rgba(0,255,156,.3);
  background:rgba(0,0,0,.5);color:#fff;font:inherit;font-size:.84rem;
}
.adm-sched-item{
  padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;
}
.adm-sched-item p{margin:3px 0;font-size:.81rem;color:#cbd5e1}
.adm-sched-item small{font-size:.73rem;color:#7bffcf}
.adm-mini-tag{
  padding:2px 7px;border-radius:999px;background:rgba(168,85,247,.2);
  color:#e9d5ff;font-size:.68rem;font-weight:700;margin-left:5px;
}
.adm-leaderboards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:14px}
.adm-lb-list{display:flex;flex-direction:column;gap:9px}
.adm-lb-row{
  display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:11px;
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);
}
.adm-lb-rank{font-weight:900;color:#fde68a;font-size:.84rem;min-width:26px}
.adm-lb-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;font-size:.81rem}
.adm-lb-bar{height:6px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.adm-lb-bar i{display:block;height:100%;background:linear-gradient(90deg,#00ff9c,#a855f7)}
.adm-lb-bar.cyan i{background:linear-gradient(90deg,#38bdf8,#00ff9c)}
.adm-builtin-codes-list{display:flex;flex-direction:column;gap:8px;max-height:230px;overflow-y:auto}
.adm-code-pill-row{
  padding:8px 11px;border-radius:10px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;align-items:center;gap:8px;
}
.adm-sec-header{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.adm-audit-stream{display:flex;flex-direction:column;gap:7px;max-height:360px;overflow-y:auto}
.adm-audit-row{
  padding:9px 11px;border-radius:10px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:10px;font-size:.8rem;
}
.adm-audit-cat{
  padding:2px 7px;border-radius:6px;background:rgba(0,255,156,.15);
  color:#7bffcf;font-size:.67rem;font-weight:800;min-width:64px;text-align:center;
}
.adm-audit-main{flex:1;display:flex;flex-direction:column;gap:2px}
.adm-audit-main small{color:var(--muted);font-size:.73rem}
.adm-audit-row time{font-size:.72rem;color:var(--muted);white-space:nowrap}

@media (max-width:980px){
  .adm-acc-card{grid-template-columns:1fr 1fr}
  .adm-acc-acts{align-items:flex-start}
  .adm-access-grid{grid-template-columns:1fr}
}
@media (max-width:860px){
  .adm-xray-chats-box{grid-template-columns:1fr}
  .adm-bcast-grid,.adm-codes-studio-grid,.adm-bcast-lists-grid,.adm-sec-grid{grid-template-columns:1fr}
  .adm-acc-card{grid-template-columns:1fr}
}

/* ============================================================================
   LokiCode — Dynamic Language Ideas Bar, AI Refresh Button,
   Compiled Output & Interactive Stdin Modal (#lcRunModal), and Convert Modal
   ============================================================================ */
#lcLangs.lc-langs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
#lcLangs.lc-langs .lang {
  padding: 7px 12px;
  font-size: 0.82rem;
}
.lc-quick-ideas-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.lc-refresh-ideas-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0, 255, 156, 0.45);
  background: linear-gradient(135deg, rgba(0, 255, 156, 0.16), rgba(56, 189, 248, 0.14));
  color: #7bffcf;
  font-size: 0.76rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.18s ease;
  box-shadow: 0 2px 10px rgba(0, 255, 156, 0.12);
}
.lc-refresh-ideas-btn:hover {
  background: linear-gradient(135deg, rgba(0, 255, 156, 0.28), rgba(56, 189, 248, 0.24));
  border-color: #00ff9c;
  color: #fff;
  transform: translateY(-1px);
}
.lc-refresh-ideas-btn.spinning .lc-ref-ic {
  display: inline-block;
  animation: lcSpin 0.8s linear infinite;
}
@keyframes lcSpin {
  to { transform: rotate(360deg); }
}

.lc-run-modal-card {
  max-width: 880px;
  width: 95vw;
  border: 1px solid rgba(0, 255, 156, 0.32);
  background: rgba(5, 14, 11, 0.97);
}
.lc-run-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.lc-run-head-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.lc-run-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.lc-compiler-pill {
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  background: rgba(0, 255, 156, 0.14);
  border: 1px solid rgba(0, 255, 156, 0.35);
  color: #6ee7b7;
}
.lc-compiler-pill.running {
  background: rgba(56, 189, 248, 0.16);
  border-color: rgba(56, 189, 248, 0.4);
  color: #7dd3fc;
}
.lc-compiler-pill.err {
  background: rgba(239, 68, 68, 0.18);
  border-color: rgba(239, 68, 68, 0.45);
  color: #fca5a5;
}
.lc-compiler-banner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  padding: 10px 18px;
  background: rgba(0, 255, 156, 0.05);
  border-bottom: 1px solid rgba(0, 255, 156, 0.16);
}
.lc-comp-col {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.lc-comp-col small {
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: var(--muted);
}
.lc-comp-col b {
  font-size: 0.82rem;
  color: #e2e8f0;
  font-family: var(--mono);
}
.lc-stdin-bar {
  padding: 12px 18px;
  background: rgba(14, 28, 38, 0.72);
  border-bottom: 1px solid rgba(56, 189, 248, 0.24);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.lc-stdin-top label {
  font-size: 0.78rem;
  color: #bae6fd;
}
.lc-stdin-controls {
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.lc-stdin-controls textarea {
  flex: 1;
  min-height: 44px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid rgba(56, 189, 248, 0.35);
  background: rgba(2, 8, 12, 0.85);
  color: #f8fafc;
  font-family: var(--mono);
  font-size: 0.84rem;
  resize: vertical;
}
.lc-stdin-send-btn {
  white-space: nowrap;
  padding: 0 18px;
  font-weight: 700;
}
.lc-convert-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
  gap: 10px;
}
.lc-convert-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
  text-align: left;
  cursor: pointer;
  transition: all 0.16s ease;
}
.lc-convert-item:hover {
  border-color: var(--c, #00ff9c);
  background: rgba(0, 255, 156, 0.1);
  transform: translateY(-1px);
}
.lc-convert-item.current {
  border-color: rgba(0, 255, 156, 0.45);
  background: rgba(0, 255, 156, 0.08);
}
.lc-conv-ic {
  font-size: 1.35rem;
}
.lc-convert-item b {
  display: block;
  font-size: 0.88rem;
}
.lc-convert-item small {
  display: block;
  font-size: 0.72rem;
  color: var(--muted);
}

/* ============================================================================
   PAGED SETTINGS LAYOUT (1 SECTION PAGE OPEN AT A TIME)
   ============================================================================ */
.set-paged-layout {
  display: grid;
  grid-template-columns: 235px minmax(0, 1fr);
  gap: 18px;
  min-height: 480px;
  max-height: 74vh;
}
@media (max-width: 780px) {
  .set-paged-layout {
    grid-template-columns: 1fr;
    max-height: none;
  }
}
.set-sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px;
  border-radius: 16px;
  background: rgba(3, 12, 9, 0.72);
  border: 1px solid rgba(var(--acc-rgb), 0.22);
  overflow-y: auto;
}
.set-nav-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--dim, #b7dcd0);
  text-align: left;
  cursor: pointer;
  transition: all 0.18s ease;
}
.set-nav-btn:hover {
  background: rgba(var(--acc-rgb), 0.08);
  color: #fff;
}
.set-nav-btn.on {
  background: linear-gradient(135deg, rgba(var(--acc-rgb), 0.22), rgba(var(--acc-rgb), 0.07));
  border-color: rgba(var(--acc-rgb), 0.48);
  color: #fff;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}
.snb-ic,
.set-nav-ic {
  font-size: 1.25rem;
  flex-shrink: 0;
  line-height: 1;
}
.snb-txt,
.set-nav-txt {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.snb-txt b,
.set-nav-txt b {
  display: block;
  font-size: 0.88rem;
  line-height: 1.25;
}
.snb-txt small,
.set-nav-txt small {
  display: block;
  font-size: 0.72rem;
  line-height: 1.3;
  color: var(--muted, #84ab9b);
}
.set-pages-viewport {
  padding: 16px 18px;
  border-radius: 16px;
  background: rgba(5, 16, 12, 0.65);
  border: 1px solid rgba(var(--acc-rgb), 0.2);
  overflow-y: auto;
}
.set-page-section[hidden] {
  display: none !important;
}
.set-page-section {
  animation: fadeSlideIn 0.22s ease;
}
@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ============================================================================
   CLICKABLE USER AVATAR & DISPLAY NAME IN REGULAR CHAT
   ============================================================================ */
.lz-msg-avatar-img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}
.lz-msg-author-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.lz-msg-author-name {
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--acc, #00ff9c);
  cursor: pointer;
}
.lz-msg-author-name:hover {
  text-decoration: underline;
}

/* ============================================================================
   USER PROFILE STUDIO MODAL, HOVER PENCIL OVERLAY & CROP SIZER
   ============================================================================ */
.lz-prof-studio-card {
  width: min(860px, 96vw) !important;
  max-height: 92vh;
  display: flex;
  flex-direction: column;
}
#lzProfileStudioBody {
  overflow-y: auto;
  padding: 16px 20px 20px;
}
.lz-ps-layout {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* Nova-Style 600x240 Banner + Circular Avatar Preview */
.lz-ps-preview-shell,
.lz-pub-card {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #14161c;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.65);
}

/* Animated Profile Backgrounds */
.bg-nebula {
  background: radial-gradient(circle at 80% 15%, rgba(56, 189, 248, 0.24), transparent 50%),
              radial-gradient(circle at 20% 85%, rgba(0, 255, 156, 0.18), transparent 55%),
              linear-gradient(160deg, #0d1222 0%, #141824 55%, #0b161e 100%);
}
.bg-matrix {
  background: repeating-linear-gradient(0deg, rgba(0, 255, 156, 0.05) 0px, rgba(0, 255, 156, 0.05) 1px, transparent 1px, transparent 18px),
              linear-gradient(165deg, #04130d 0%, #091e16 100%);
}
.bg-aurora {
  background: radial-gradient(ellipse at 30% 20%, rgba(45, 212, 191, 0.28), transparent 55%),
              radial-gradient(ellipse at 75% 80%, rgba(168, 85, 247, 0.26), transparent 55%),
              linear-gradient(155deg, #091526 0%, #131129 100%);
}
.bg-starfield {
  background: radial-gradient(circle at 50% 25%, rgba(99, 102, 241, 0.25), transparent 60%),
              linear-gradient(180deg, #050711 0%, #0f172a 100%);
}
.bg-cyberpunk {
  background: radial-gradient(circle at 85% 20%, rgba(236, 72, 153, 0.28), transparent 50%),
              radial-gradient(circle at 15% 80%, rgba(6, 182, 212, 0.25), transparent 50%),
              linear-gradient(155deg, #190b28 0%, #091929 100%);
}
.bg-gold {
  background: radial-gradient(circle at 75% 20%, rgba(250, 204, 21, 0.26), transparent 52%),
              linear-gradient(160deg, #1c1608 0%, #0e0d0a 100%);
}

/* Animated Profile Overlays */
.lz-ps-preview-shell::after,
.lz-pub-card::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}
.ov-scanlines::after {
  background: repeating-linear-gradient(to bottom, transparent 0px, transparent 2px, rgba(255, 255, 255, 0.035) 3px, transparent 4px);
}
.ov-sparks::after {
  background-image: radial-gradient(rgba(255, 255, 255, 0.55) 1px, transparent 1px),
                    radial-gradient(rgba(0, 255, 156, 0.5) 1.5px, transparent 1.5px);
  background-size: 48px 48px, 72px 72px;
  background-position: 0 0, 24px 24px;
  animation: profSparkDrift 12s linear infinite;
  opacity: 0.45;
}
.ov-rain::after {
  background: repeating-linear-gradient(105deg, transparent 0px, transparent 28px, rgba(56, 189, 248, 0.12) 29px, transparent 30px);
  animation: profSparkDrift 6s linear infinite;
}
.ov-sakura::after {
  background-image: radial-gradient(rgba(244, 114, 182, 0.55) 2px, transparent 2px);
  background-size: 56px 56px;
  animation: profSparkDrift 10s linear infinite;
}
.ov-prism::after {
  background: linear-gradient(125deg, rgba(255, 0, 128, 0.08), rgba(0, 255, 255, 0.08), rgba(255, 255, 0, 0.08));
}
.ov-pulse::after {
  box-shadow: inset 0 0 38px var(--prof-acc, #00ff9c);
  opacity: 0.35;
}
@keyframes profSparkDrift {
  from { background-position: 0 0, 24px 24px; }
  to { background-position: 48px 96px, 72px 120px; }
}

.lz-ps-banner-wrap,
.lz-pub-banner {
  position: relative;
  width: 100%;
  aspect-ratio: 600 / 240;
  max-height: 220px;
  background: #080d1a;
  overflow: hidden;
  cursor: pointer;
}
.lz-pub-banner {
  cursor: default;
}
.lz-ps-banner-img,
.lz-pub-banner-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.lz-ps-dim-tag,
.lz-banner-dim-pill {
  position: absolute;
  right: 12px;
  bottom: 10px;
  z-index: 4;
  padding: 4px 10px;
  border-radius: 8px;
  background: #4f46e5;
  color: #fff;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
}

.lz-ps-hover-pencil {
  position: absolute;
  inset: 0;
  z-index: 3;
  background: rgba(4, 9, 16, 0.68);
  backdrop-filter: blur(3px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  color: #fff;
  opacity: 0;
  transition: opacity 0.18s ease;
}
.lz-ps-banner-wrap:hover .lz-ps-hover-pencil,
.lz-ps-avatar-wrap:hover .lz-ps-hover-pencil {
  opacity: 1;
}
.lz-pencil-ic {
  font-size: 1.45rem;
}

.lz-ps-identity-strip {
  position: relative;
  z-index: 4;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding: 0 22px 14px;
  margin-top: -46px;
  flex-wrap: wrap;
}
.lz-ps-avatar-wrap,
.lz-pub-avatar-holder {
  position: relative;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  border: 5px solid #181920;
  background: #0d1520;
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.6);
  cursor: pointer;
  flex-shrink: 0;
}
.lz-pub-avatar-holder {
  cursor: default;
}
.lz-ps-avatar-img,
.lz-pub-avatar-img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}
.lz-ps-avatar-fallback,
.lz-pub-avatar-fallback {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 2.1rem;
  font-weight: 900;
  background: linear-gradient(135deg, var(--prof-acc, #00ff9c), #0ea5e9);
  color: #03150c;
}
.lz-ps-avatar-wrap .avatar-pencil {
  border-radius: 50%;
}
.lz-ps-online-dot,
.lz-pub-status-dot {
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #22c55e;
  border: 3.5px solid #181920;
  z-index: 5;
}
.lz-pub-status-dot.off {
  background: #64748b;
}

.lz-ps-name-block {
  flex: 1;
  min-width: 180px;
  padding-top: 44px;
}
.lz-ps-dname-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.lz-ps-dname-row h3 {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 800;
  color: #fff;
}
.lz-ps-pronouns {
  font-size: 0.74rem;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.09);
  color: #cbd5e1;
}
.lz-ps-status-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 3px;
  flex-wrap: wrap;
}
.lz-ps-status-text,
.lz-pub-online-text {
  font-size: 0.85rem;
  color: #cbd5e1;
}
.lz-ps-uname-pill {
  font-size: 0.75rem;
  font-family: var(--mono);
  padding: 2px 8px;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.45);
  color: #94a3b8;
}
.lz-ps-quick-btns {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.lz-ps-bio-preview {
  position: relative;
  z-index: 4;
  padding: 0 22px 16px;
  font-size: 0.85rem;
  color: #cbd5e1;
}

/* Profile Studio Form Fields */
.lz-ps-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
@media (max-width: 680px) {
  .lz-ps-form-grid {
    grid-template-columns: 1fr;
  }
}
.lz-ps-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.lz-ps-field.full {
  grid-column: 1 / -1;
}
.lz-ps-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.lz-ps-field label {
  font-size: 0.8rem;
  font-weight: 800;
  color: #e2e8f0;
}
.lz-ps-field input[type="text"],
.lz-ps-field textarea {
  padding: 9px 12px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
  font: inherit;
  font-size: 0.88rem;
}
.lz-ps-locked-input {
  opacity: 0.65;
  cursor: not-allowed;
}
.lz-ps-help {
  font-size: 0.73rem;
  color: var(--muted);
}
.lz-ps-cooldown-tag {
  font-size: 0.69rem;
  font-weight: 800;
  padding: 2px 8px;
  border-radius: 999px;
}
.lz-ps-cooldown-tag.free,
.lz-ps-cooldown-tag.ready {
  background: rgba(0, 255, 156, 0.15);
  color: #6ee7b7;
  border: 1px solid rgba(0, 255, 156, 0.35);
}
.lz-ps-cooldown-tag.locked {
  background: rgba(245, 158, 11, 0.16);
  color: #fcd34d;
  border: 1px solid rgba(245, 158, 11, 0.38);
}
.lz-ps-cooldown-tag.perm {
  background: rgba(148, 163, 184, 0.15);
  color: #cbd5e1;
}

.lz-ps-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}
.lz-ps-choice-btn {
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(0, 0, 0, 0.35);
  color: #e2e8f0;
  text-align: left;
  cursor: pointer;
}
.lz-ps-choice-btn.on {
  border-color: var(--acc, #00ff9c);
  background: rgba(var(--acc-rgb), 0.14);
}
.lz-ps-choice-btn b {
  display: block;
  font-size: 0.78rem;
}
.lz-ps-choice-btn small {
  display: block;
  font-size: 0.67rem;
  color: var(--muted);
}
.lz-ps-overlay-pills,
.lz-ps-badges-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.lz-ps-ov-pill,
.lz-ps-badge-chip {
  padding: 6px 11px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(0, 0, 0, 0.35);
  color: #cbd5e1;
  font-size: 0.76rem;
  font-weight: 700;
  cursor: pointer;
}
.lz-ps-ov-pill.on,
.lz-ps-badge-chip.on {
  border-color: var(--acc, #00ff9c);
  background: rgba(var(--acc-rgb), 0.18);
  color: #fff;
}
.lz-ps-accent-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  font-size: 0.78rem;
}
.lz-ps-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  flex-wrap: wrap;
}
.lz-ps-footer-note {
  font-size: 0.78rem;
  color: var(--muted);
}
.lz-ps-footer-btns {
  display: flex;
  gap: 10px;
}

/* Interactive Image Crop & Size Modal */
.lz-sizer-card {
  width: min(640px, 95vw) !important;
}
.lz-sizer-wrap {
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: center;
}
.lz-sizer-hint {
  margin: 0;
  font-size: 0.84rem;
  color: var(--dim);
  text-align: center;
}
.lz-sizer-stage {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  border: 2px solid rgba(0, 255, 156, 0.38);
  background: #060a10;
  cursor: grab;
  max-width: 100%;
}
.lz-sizer-stage:active {
  cursor: grabbing;
}
.lz-sizer-stage canvas {
  display: block;
  max-width: 100%;
  height: auto;
}
.lz-sizer-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  max-width: 420px;
}
.lz-sizer-controls input[type="range"] {
  flex: 1;
}
.lz-sizer-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  width: 100%;
}

/* Public Profile Card Modal */
.lz-pub-prof-modal-card {
  width: min(600px, 95vw) !important;
  padding: 0 !important;
  overflow: hidden;
  border-radius: 22px !important;
}
.lz-pub-close-x {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 6;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
  cursor: pointer;
}
.lz-pub-main {
  position: relative;
  z-index: 4;
  padding: 0 24px 24px;
}
.lz-pub-top-row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-top: -48px;
  margin-bottom: 12px;
}
.lz-pub-name-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.lz-pub-name-line h2 {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 800;
  color: #fff;
}
.lz-pub-subline {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
  flex-wrap: wrap;
}
.lz-pub-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 14px;
}
.lz-pub-badge {
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  font-size: 0.75rem;
  font-weight: 700;
  color: #f1f5f9;
}
.lz-pub-section {
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.38);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.lz-pub-section h4 {
  margin: 0 0 6px;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  color: #94a3b8;
}
.lz-pub-section p {
  margin: 0;
  font-size: 0.88rem;
  color: #e2e8f0;
  line-height: 1.5;
}
.lz-pub-section.meta {
  font-size: 0.78rem;
  color: #94a3b8;
}

/* ============================================================================
   TEAM CHAT 1000X REDESIGN, @ MENTION POPUP, VOICE BAR & GROUP VOICE CALLS
   ============================================================================ */
.tc-ri-badges {
  display: flex;
  align-items: center;
  gap: 6px;
}
.tc-live-call-pill {
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(34, 197, 94, 0.22);
  border: 1px solid rgba(34, 197, 94, 0.5);
  color: #4ade80;
  font-size: 0.65rem;
  font-weight: 800;
}
.tc-ri-av-stack {
  display: flex;
  align-items: center;
  margin-top: 6px;
}
.tc-mini-stack-av {
  margin-right: -5px;
  border: 1.5px solid #081510;
}
.tc-head-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.tc-online-count-badge {
  font-size: 0.72rem;
  padding: 2px 9px;
  border-radius: 999px;
  background: rgba(0, 255, 156, 0.12);
  border: 1px solid rgba(0, 255, 156, 0.3);
  color: #6ee7b7;
}
.tc-mpill {
  cursor: pointer;
  transition: transform 0.15s ease, border-color 0.15s ease;
}
.tc-mpill:hover {
  transform: translateY(-1px);
  border-color: var(--acc, #00ff9c);
}
.tc-voice-call-btn.in-call {
  background: linear-gradient(135deg, #22c55e, #10b981) !important;
  color: #02180c !important;
}

/* Team Chat Message Author & Bubble */
.tc-msg-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 4px;
}
.tc-msg-author-trigger {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.tc-msg-author-trigger.clickable {
  cursor: pointer;
}
.tc-msg-author-trigger.clickable:hover .tc-msg-author {
  text-decoration: underline;
  color: var(--acc, #00ff9c);
}
.tc-msg-av-img,
.tc-msg-av {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  display: inline-grid;
  place-items: center;
  font-size: 0.72rem;
  font-weight: 800;
  background: rgba(0, 255, 156, 0.2);
  color: #00ff9c;
}
.tc-msg-handle {
  font-size: 0.7rem;
  color: var(--muted);
}
.tc-mention-chip {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 6px;
  font-weight: 700;
  background: rgba(88, 101, 242, 0.28);
  color: #c7d2fe;
}
.tc-mention-chip.ai {
  background: rgba(0, 255, 156, 0.22);
  color: #6ee7b7;
}

/* Team Chat Attachments */
.tc-msg-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.tc-att-img {
  max-width: 240px;
  max-height: 180px;
  border-radius: 12px;
  object-fit: cover;
  cursor: zoom-in;
  border: 1px solid rgba(255, 255, 255, 0.14);
}
.tc-att-file-card {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #e2e8f0;
  text-decoration: none;
}
.tc-composer-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.tc-att-tray {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 12px;
  background: rgba(4, 14, 10, 0.85);
  border: 1px solid rgba(var(--acc-rgb), 0.25);
}
.tc-pending-att {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
  font-size: 0.76rem;
}
.tc-pending-att img {
  width: 26px;
  height: 26px;
  border-radius: 6px;
  object-fit: cover;
}
.tc-pending-att button {
  border: 0;
  background: transparent;
  color: #fca5a5;
  cursor: pointer;
}
.tc-icon-btn {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  color: #e2e8f0;
  font-size: 1rem;
  cursor: pointer;
  flex-shrink: 0;
}
.tc-icon-btn:hover {
  border-color: var(--acc, #00ff9c);
  background: rgba(var(--acc-rgb), 0.15);
}

/* @ Mention Autocomplete Popup Above Prompt Bar */
.tc-mention-popup {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: calc(100% + 8px);
  z-index: 30;
  max-height: 240px;
  overflow-y: auto;
  padding: 8px;
  border-radius: 14px;
  background: rgba(8, 20, 16, 0.98);
  border: 1px solid rgba(0, 255, 156, 0.38);
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.65);
}
.tc-men-head {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 4px 8px 6px;
}
.tc-men-item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 0;
  background: transparent;
  color: #fff;
  text-align: left;
  cursor: pointer;
}
.tc-men-item:hover,
.tc-men-item.on {
  background: rgba(0, 255, 156, 0.15);
}
.tc-men-ai-av {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(0, 255, 156, 0.22);
}
.tc-men-info b {
  display: block;
  font-size: 0.84rem;
}
.tc-men-info small {
  display: block;
  font-size: 0.72rem;
  color: var(--muted);
}

/* Voice Recording Bar (Matches Screenshot 3: Purple/Indigo Waveform Bar) */
.tc-voice-rec-bar {
  padding: 12px 16px;
  border-radius: 20px;
  background: linear-gradient(180deg, #5865f2 0%, #4752c4 100%);
  box-shadow: 0 12px 32px rgba(88, 101, 242, 0.42);
  color: #fff;
}
.tc-vrb-top-hint {
  text-align: center;
  font-size: 0.82rem;
  font-weight: 700;
  margin-bottom: 8px;
  opacity: 0.95;
}
.tc-vrb-controls {
  display: flex;
  align-items: center;
  gap: 12px;
}
.tc-vrb-trash-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 0;
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  font-size: 1.15rem;
  cursor: pointer;
  flex-shrink: 0;
}
.tc-vrb-trash-btn:hover {
  background: rgba(239, 68, 68, 0.85);
}
.tc-vrb-pill {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  height: 44px;
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(20, 24, 52, 0.48);
}
.tc-vrb-red-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ef4444;
  box-shadow: 0 0 8px #ef4444;
  animation: recBlink 1s infinite;
}
@keyframes recBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}
.tc-vrb-timer {
  font-weight: 800;
  font-size: 0.92rem;
  min-width: 38px;
}
.tc-vrb-wave {
  flex: 1;
  height: 26px;
  display: flex;
  align-items: center;
  gap: 3px;
  overflow: hidden;
}
.tc-vrb-bar {
  flex: 1;
  min-width: 2.5px;
  border-radius: 999px;
  background: #ffffff;
  transition: height 0.15s ease;
}
.tc-vrb-send-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 0;
  background: #ffffff;
  color: #4752c4;
  font-size: 1.15rem;
  font-weight: 900;
  cursor: pointer;
  flex-shrink: 0;
}

/* Inline Voice Message Dark Pill Player (Matches Screenshot 4) */
.tc-voice-pill-player {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 8px 16px 8px 10px;
  border-radius: 999px;
  background: #232428;
  border: 1px solid rgba(255, 255, 255, 0.08);
  min-width: 205px;
  margin-top: 4px;
}
.tc-vp-play-btn {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 0;
  background: #5865f2;
  color: #ffffff;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: transform 0.14s ease, background 0.14s ease;
}
.tc-vp-play-btn:hover {
  transform: scale(1.06);
  background: #6d78f7;
}
.tc-vp-bars {
  display: flex;
  align-items: center;
  gap: 4px;
  height: 24px;
  flex: 1;
}
.tc-vp-bar {
  width: 3.5px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.45);
  transition: background 0.12s ease;
}
.tc-vp-bar.played,
.tc-voice-pill-player.playing .tc-vp-bar {
  background: #ffffff;
}
.tc-vp-time {
  font-size: 0.9rem;
  font-weight: 600;
  color: #cbd5e1;
  font-variant-numeric: tabular-nums;
}

/* Full-Screen Incoming Voice Call Popup */
.lz-incoming-call-overlay {
  position: fixed;
  inset: 0;
  z-index: 1250;
  background: radial-gradient(circle at 50% 30%, rgba(34, 197, 94, 0.22), rgba(3, 8, 15, 0.94));
  backdrop-filter: blur(18px);
  display: grid;
  place-items: center;
  padding: 20px;
}
.lz-incoming-call-overlay[hidden] {
  display: none !important;
}
.lz-inc-card {
  width: min(440px, 95vw);
  padding: 32px 26px;
  border-radius: 28px;
  background: linear-gradient(165deg, rgba(12, 24, 34, 0.96), rgba(6, 12, 18, 0.98));
  border: 1px solid rgba(34, 197, 94, 0.42);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.8);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.lz-inc-caller-av {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid #22c55e;
  box-shadow: 0 0 0 10px rgba(34, 197, 94, 0.16);
  display: grid;
  place-items: center;
  background: #0f172a;
  font-size: 2.2rem;
  font-weight: 900;
  color: #fff;
  animation: incPulse 1.6s ease-in-out infinite;
}
.lz-inc-caller-av img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@keyframes incPulse {
  0%, 100% { transform: scale(1); box-shadow: 0 0 0 8px rgba(34, 197, 94, 0.18); }
  50% { transform: scale(1.06); box-shadow: 0 0 0 18px rgba(34, 197, 94, 0.06); }
}
.lz-inc-badge {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: #4ade80;
}
.lz-inc-joined-box {
  width: 100%;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.lz-inc-joined-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin-top: 6px;
}
.lz-inc-pchip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.4);
  font-size: 0.78rem;
}
.lz-inc-pchip img,
.lz-inc-pchip i {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  object-fit: cover;
  font-style: normal;
  display: inline-grid;
  place-items: center;
  background: #22c55e;
  color: #02140a;
  font-weight: 800;
}
.lz-inc-actions {
  display: flex;
  gap: 14px;
  margin-top: 10px;
  width: 100%;
}
.lz-inc-btn {
  flex: 1;
  min-height: 46px;
  border-radius: 999px;
  border: 0;
  font-weight: 800;
  font-size: 0.92rem;
  cursor: pointer;
}
.lz-inc-btn.decline {
  background: rgba(239, 68, 68, 0.22);
  border: 1px solid rgba(239, 68, 68, 0.5);
  color: #fca5a5;
}
.lz-inc-btn.accept {
  background: #22c55e;
  color: #02180c;
}

/* Active Group Voice Call Stage & Screen Share Preview */
.tc-call-stage-box {
  margin: 8px 14px;
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(160deg, rgba(8, 22, 18, 0.95), rgba(6, 14, 22, 0.96));
  border: 1px solid rgba(34, 197, 94, 0.38);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.45);
}
.tc-call-stage-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.tc-call-stage-title {
  display: flex;
  align-items: center;
  gap: 8px;
}
.tc-live-call-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 10px #22c55e;
}
.tc-call-stage-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.tc-call-ctl-btn.stop-share,
.tc-call-ctl-btn.leave {
  border-color: rgba(239, 68, 68, 0.5);
  color: #fca5a5;
}
.tc-call-error-banner {
  margin-bottom: 10px;
  padding: 9px 12px;
  border-radius: 10px;
  background: rgba(239, 68, 68, 0.16);
  border: 1px solid rgba(239, 68, 68, 0.45);
  color: #fecaca;
  font-size: 0.82rem;
}
.tc-call-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
  gap: 12px;
}
.tc-call-tile {
  padding: 16px 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.tc-call-tile.speaking {
  border-color: #22c55e;
  box-shadow: 0 0 22px rgba(34, 197, 94, 0.28);
}
.tc-call-av-orb {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid rgba(34, 197, 94, 0.55);
  display: grid;
  place-items: center;
  background: #0f172a;
  cursor: pointer;
  transition: transform 0.12s ease;
}
.tc-call-av-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tc-call-av-fallback {
  font-size: 1.5rem;
  font-weight: 900;
  color: #fff;
}
.tc-local-mute-btn {
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(0, 0, 0, 0.4);
  color: #cbd5e1;
  font-size: 0.72rem;
  cursor: pointer;
}
.tc-local-mute-btn.on {
  border-color: rgba(239, 68, 68, 0.5);
  color: #fca5a5;
}

/* Screen Share Tile: Centered Live Preview + Small White-on-Black Name in Bottom-Left */
.tc-call-tile.screen-sharing-tile {
  grid-column: 1 / -1;
  padding: 0;
  overflow: hidden;
  background: #000;
}
.tc-screen-preview-box {
  position: relative;
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  aspect-ratio: 16 / 9;
  background: #000;
  display: grid;
  place-items: center;
}
.tc-screen-video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.tc-screen-sharer-label {
  position: absolute;
  left: 10px;
  bottom: 10px;
  z-index: 5;
  padding: 3px 9px;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.86);
  color: #ffffff;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

/* ============================================================================
   ENLARGED SPACIOUS SETTINGS MODAL (#settings)
   ============================================================================ */
#settings .modal-card,
#settings .settings-card {
  width: min(1140px, 95vw) !important;
  max-width: 1140px !important;
  height: min(820px, 90vh) !important;
  max-height: 90vh !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 24px 28px !important;
  border-radius: 24px !important;
}

#settings .set-paged-layout {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: 100% !important;
  display: grid !important;
  grid-template-columns: 270px 1fr !important;
  gap: 24px !important;
  margin-top: 14px !important;
  overflow: hidden !important;
}

@media (max-width: 820px) {
  #settings .set-paged-layout {
    grid-template-columns: 1fr !important;
    overflow-y: auto !important;
  }
}

#settings .set-paged-nav {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding-right: 10px !important;
  overflow-y: auto !important;
}

#settings .set-nav-tab {
  padding: 13px 16px !important;
  border-radius: 14px !important;
  font-size: 0.94rem !important;
}

#settings .set-paged-content {
  height: 100% !important;
  overflow-y: auto !important;
  padding: 22px 26px !important;
  border-radius: 18px !important;
  background: rgba(6, 20, 14, 0.55) !important;
  border: 1px solid rgba(0, 255, 156, 0.18) !important;
}

/* ============================================================================
   PLAN TAG BADGES (.lz-plan-tag: FREE / PRO / ✦ ULTIMATE)
   ============================================================================ */
.lz-plan-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-family: var(--font, system-ui, sans-serif);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  line-height: 1;
  padding: 3.5px 9px;
  border-radius: 999px;
  text-transform: uppercase;
  vertical-align: middle;
  white-space: nowrap;
  user-select: none;
  flex-shrink: 0;
}

.lz-plan-tag.sm {
  font-size: 0.6rem;
  padding: 2.5px 7px;
}

.lz-plan-tag.lg {
  font-size: 0.76rem;
  padding: 5px 12px;
}

/* Free Plan Tag: Plain basic muted gray box */
.lz-plan-tag.free {
  background: #272a30;
  color: #8b929e;
  border: 1px solid #3c4049;
  border-radius: 5px;
  font-weight: 700;
  letter-spacing: 0.03em;
  box-shadow: none;
}

/* Pro Plan Tag: Neon Emerald Green Gradient Pill (matching user reference image) */
.lz-plan-tag.pro {
  background: linear-gradient(90deg, #00e676 0%, #34f5a6 55%, #7affc6 100%);
  color: #02140a;
  border: 1px solid rgba(122, 255, 198, 0.85);
  border-radius: 999px;
  font-weight: 900;
  box-shadow: 0 0 14px rgba(0, 230, 118, 0.45), inset 0 1px 1px rgba(255, 255, 255, 0.45);
}

/* Ultimate Plan Tag: 100x Better Animated Holographic Prismatic Crown Badge */
@keyframes lzUltimateShimmer {
  0% {
    background-position: 0% 50%;
    box-shadow: 0 0 16px rgba(0, 255, 156, 0.55), 0 0 28px rgba(250, 204, 21, 0.35);
  }
  50% {
    background-position: 100% 50%;
    box-shadow: 0 0 22px rgba(56, 189, 248, 0.7), 0 0 34px rgba(168, 85, 247, 0.45);
  }
  100% {
    background-position: 0% 50%;
    box-shadow: 0 0 16px rgba(0, 255, 156, 0.55), 0 0 28px rgba(250, 204, 21, 0.35);
  }
}

.lz-plan-tag.ultimate {
  background: linear-gradient(120deg, #00ff9c, #fde047, #38bdf8, #c084fc, #00ff9c);
  background-size: 260% 260%;
  animation: lzUltimateShimmer 4s ease infinite;
  color: #021008;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 999px;
  font-weight: 900;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
}

/* ============================================================================
   SUBSCRIPTION PLANS STUDIO (#benchesView / .lplans-*)
   ============================================================================ */
#benchesView {
  position: absolute !important;
  top: var(--top-h, 65px) !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  display: block !important;
  padding: 0 0 96px 0 !important;
  z-index: 6;
  -webkit-overflow-scrolling: touch;
}

#benchesView:not(.active) {
  display: none !important;
}

.lplans-shell {
  position: relative;
  max-width: 1320px;
  margin: 0 auto;
  padding: 28px 24px 80px;
  color: #ecfdf5;
  overflow: visible;
  flex-shrink: 0;
}

.lplans-orbs {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}

.lplans-orbs span {
  position: absolute;
  border-radius: 50%;
  filter: blur(85px);
  opacity: 0.25;
}

.lplans-orbs .orb-1 {
  width: 420px;
  height: 420px;
  background: #00ff9c;
  top: -120px;
  left: -80px;
}

.lplans-orbs .orb-2 {
  width: 480px;
  height: 480px;
  background: #10b981;
  top: 180px;
  right: -140px;
}

.lplans-orbs .orb-3 {
  width: 380px;
  height: 380px;
  background: #facc15;
  bottom: -120px;
  left: 35%;
  opacity: 0.14;
}

.lplans-hero {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 28px;
}

.lplans-hero-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.lplans-active-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgba(5, 24, 16, 0.82);
  border: 1px solid rgba(0, 255, 156, 0.3);
  font-size: 0.85rem;
  font-weight: 700;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.lplans-trial-chip {
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(250, 204, 21, 0.18);
  border: 1px solid rgba(250, 204, 21, 0.45);
  color: #fde047;
  font-size: 0.74rem;
  font-weight: 800;
}

.lplans-canceled-chip {
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.18);
  border: 1px solid rgba(245, 158, 11, 0.45);
  color: #fcd34d;
  font-size: 0.74rem;
  font-weight: 800;
}

.lplans-hero-center {
  text-align: center;
  max-width: 820px;
  margin: 0 auto;
}

.lplans-eyebrow {
  display: inline-block;
  padding: 5px 14px;
  border-radius: 999px;
  background: rgba(0, 255, 156, 0.12);
  border: 1px solid rgba(0, 255, 156, 0.35);
  color: #4ade80;
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  margin-bottom: 10px;
}

.lplans-hero-center h1 {
  margin: 0 0 10px;
  font-size: clamp(1.85rem, 3.2vw, 2.65rem);
  font-weight: 900;
  letter-spacing: -0.02em;
  background: linear-gradient(95deg, #ffffff 0%, #6ee7b7 55%, #fde047 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.lplans-hero-center p {
  margin: 0;
  font-size: 0.96rem;
  line-height: 1.55;
  color: #a7f3d0;
  opacity: 0.9;
}

/* Live Quota Strip at Top of Plans */
.lplan-quota-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(195px, 1fr));
  gap: 12px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(4, 20, 13, 0.82);
  border: 1px solid rgba(0, 255, 156, 0.24);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}

.lplan-q-item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.07);
}

.lplan-q-item .q-ic {
  font-size: 1.35rem;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(0, 255, 156, 0.12);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.lplan-q-item small {
  display: block;
  font-size: 0.72rem;
  color: #94a3b8;
}

.lplan-q-item b {
  font-size: 0.88rem;
  color: #ecfdf5;
}

.lplan-q-item b.q-inf {
  color: #fde047;
}

/* 3-Column Plans Grid */
.lplans-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  align-items: stretch;
}

@media (max-width: 1060px) {
  .lplans-grid {
    grid-template-columns: 1fr;
    max-width: 580px;
    margin: 0 auto;
  }
}

.lplan-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 24px 22px;
  border-radius: 24px;
  background: linear-gradient(165deg, rgba(6, 24, 16, 0.92), rgba(3, 12, 9, 0.96));
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.48);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
  overflow: hidden;
}

.lplan-card:hover {
  transform: translateY(-5px);
}

.lplan-card.tier-pro {
  border-color: rgba(0, 230, 118, 0.48);
  box-shadow: 0 20px 50px rgba(0, 230, 118, 0.14);
}

.lplan-card.tier-ultimate {
  background: linear-gradient(165deg, rgba(9, 30, 20, 0.96), rgba(5, 16, 14, 0.98));
  border: 1.5px solid rgba(250, 204, 21, 0.65);
  box-shadow: 0 22px 60px rgba(0, 255, 156, 0.2), 0 0 36px rgba(250, 204, 21, 0.12);
}

.lplan-card.is-active-plan {
  outline: 2px solid #00ff9c;
  outline-offset: 2px;
}

.lplan-card-head {
  margin-bottom: 16px;
}

.lplan-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.lplan-tier-kicker {
  display: block;
  font-size: 0.69rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  color: #6ee7b7;
  margin-bottom: 4px;
}

.lplan-card.tier-ultimate .lplan-tier-kicker {
  color: #fde047;
}

.lplan-title-row h2 {
  margin: 0;
  font-size: 1.55rem;
  font-weight: 900;
  color: #ffffff;
}

.lplan-price-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.lplan-price {
  font-size: 2.15rem;
  font-weight: 900;
  color: #00ff9c;
  letter-spacing: -0.02em;
}

.lplan-card.tier-ultimate .lplan-price {
  color: #fde047;
}

.lplan-price span {
  font-size: 0.92rem;
  font-weight: 600;
  color: #94a3b8;
  margin-left: 3px;
}

.lplan-old-price {
  font-size: 1.2rem !important;
  text-decoration: line-through;
  color: #64748b !important;
  margin-right: 6px;
}

.lplan-upgrade-save {
  font-size: 0.73rem;
  font-weight: 800;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(0, 255, 156, 0.16);
  border: 1px solid rgba(0, 255, 156, 0.4);
  color: #6ee7b7;
}

.lplan-sub {
  margin: 8px 0 0;
  font-size: 0.85rem;
  color: #cbd5e1;
  line-height: 1.45;
}

/* Pay Box & CTA Buttons (Below Plan Name, Above Benefits) */
.lplan-pay-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  border-radius: 16px;
  background: rgba(0, 0, 0, 0.38);
  border: 1px solid rgba(255, 255, 255, 0.1);
  margin-bottom: 16px;
}

.lplan-pay-box.is-current {
  background: rgba(0, 255, 156, 0.08);
  border-color: rgba(0, 255, 156, 0.35);
}

.lplan-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 14px;
  border-radius: 12px;
  font-size: 0.86rem;
  font-weight: 800;
  background: rgba(0, 255, 156, 0.16);
  color: #6ee7b7;
  border: 1px solid rgba(0, 255, 156, 0.4);
}

.lplan-status-pill.ultimate {
  background: linear-gradient(90deg, rgba(0, 255, 156, 0.2), rgba(250, 204, 21, 0.22));
  color: #fde047;
  border-color: rgba(250, 204, 21, 0.5);
}

.lplan-pay-note {
  font-size: 0.75rem;
  color: #94a3b8;
  text-align: center;
}

.lplan-cta-btn {
  width: 100%;
  min-height: 44px;
  padding: 11px 16px;
  border-radius: 999px;
  border: 0;
  font-family: inherit;
  font-size: 0.9rem;
  font-weight: 900;
  cursor: pointer;
  transition: transform 0.15s ease, filter 0.15s ease, box-shadow 0.15s ease;
}

.lplan-cta-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  filter: brightness(1.08);
}

.lplan-cta-btn.pro-btn {
  background: linear-gradient(90deg, #00e676, #34f5a6);
  color: #02140a;
  box-shadow: 0 8px 22px rgba(0, 230, 118, 0.35);
}

.lplan-cta-btn.ultimate-btn {
  background: linear-gradient(90deg, #facc15, #34d399, #38bdf8);
  color: #03120a;
  box-shadow: 0 8px 26px rgba(250, 204, 21, 0.35);
}

.lplan-cta-btn.disabled {
  background: rgba(148, 163, 184, 0.12);
  color: #64748b;
  border: 1px solid rgba(148, 163, 184, 0.22);
  cursor: not-allowed;
}

.lplan-trial-btn {
  width: 100%;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1.5px dashed rgba(250, 204, 21, 0.75);
  background: rgba(250, 204, 21, 0.12);
  color: #fde047;
  font-family: inherit;
  font-size: 0.83rem;
  font-weight: 800;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease;
}

.lplan-trial-btn:hover:not(:disabled) {
  background: rgba(250, 204, 21, 0.22);
  transform: translateY(-1px);
}

.lplan-trial-used {
  font-size: 0.74rem;
  color: #94a3b8;
  text-align: center;
  padding: 4px 8px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
}

.lplan-prorate-pill {
  font-size: 0.74rem;
  font-weight: 700;
  color: #6ee7b7;
  text-align: center;
  padding: 5px 10px;
  border-radius: 8px;
  background: rgba(0, 255, 156, 0.1);
  border: 1px solid rgba(0, 255, 156, 0.28);
}

.lplan-paypal-wrap {
  margin-top: 4px;
  min-height: 42px;
}

.lplan-trial-badge-pp {
  font-size: 0.78rem;
  font-weight: 700;
  color: #fef08a;
  text-align: center;
  padding: 8px 12px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(250, 204, 21, 0.16), rgba(0, 255, 156, 0.1));
  border: 1px solid rgba(250, 204, 21, 0.45);
  box-shadow: 0 4px 14px rgba(250, 204, 21, 0.12);
}

.lplans-sync-bar {
  margin-top: 14px;
  padding: 12px 16px;
  border-radius: 14px;
  background: rgba(7, 22, 16, 0.85);
  border: 1px solid rgba(0, 255, 156, 0.24);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.lplans-sync-info {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1 1 280px;
}

.lplans-sync-info b {
  display: block;
  font-size: 0.82rem;
  color: #e6fff5;
}

.lplans-sync-info small {
  display: block;
  font-size: 0.74rem;
  color: #8fb8a6;
}

.lplans-sync-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #64748b;
  flex-shrink: 0;
}

.lplans-sync-dot.live {
  background: #00ff9c;
  box-shadow: 0 0 10px #00ff9c;
}

.lplans-sync-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.lplans-sync-input {
  width: 210px;
  max-width: 100%;
  padding: 8px 11px;
  border-radius: 10px;
  border: 1px solid rgba(0, 255, 156, 0.28);
  background: rgba(3, 12, 9, 0.9);
  color: #e6fff5;
  font-size: 0.78rem;
}

.lplans-sync-btn {
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid rgba(0, 255, 156, 0.45);
  background: rgba(0, 255, 156, 0.16);
  color: #7dffcf;
  font-size: 0.78rem;
  font-weight: 800;
  cursor: pointer;
  transition: transform 0.15s ease, background 0.15s ease;
}

.lplans-sync-btn:hover {
  transform: translateY(-1px);
  background: rgba(0, 255, 156, 0.26);
}

/* 5x Usage / Ultimate Big Callout Banner */
.lplan-big-banner {
  padding: 11px 14px;
  border-radius: 14px;
  font-size: 0.8rem;
  font-weight: 900;
  text-align: center;
  letter-spacing: 0.03em;
  margin-bottom: 14px;
  background: linear-gradient(90deg, rgba(0, 230, 118, 0.2), rgba(16, 185, 129, 0.3));
  border: 1px solid rgba(0, 230, 118, 0.5);
  color: #6ee7b7;
  box-shadow: 0 6px 20px rgba(0, 230, 118, 0.15);
}

.lplan-big-banner.ultimate {
  background: linear-gradient(90deg, rgba(250, 204, 21, 0.2), rgba(0, 255, 156, 0.22));
  border-color: rgba(250, 204, 21, 0.55);
  color: #fef08a;
}

.lplan-compare-lbl {
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #94a3b8;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* Categorized Benefit Sections (AI Benefits / App Benefits / Profile Benefits) */
.lplan-sections {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1;
}

.lplan-sec-title {
  margin: 0 0 8px;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #4ade80;
}

.lplan-card.tier-ultimate .lplan-sec-title {
  color: #fde047;
}

.lplan-feat-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.lplan-feat-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 9px 11px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.lplan-feat-item.is-highlight {
  background: rgba(0, 255, 156, 0.07);
  border-color: rgba(0, 255, 156, 0.24);
}

.lplan-card.tier-ultimate .lplan-feat-item.is-highlight {
  background: rgba(250, 204, 21, 0.07);
  border-color: rgba(250, 204, 21, 0.26);
}

.lplan-feat-item.is-locked {
  opacity: 0.5;
}

.lplan-feat-ic {
  font-size: 1.05rem;
  line-height: 1.2;
  flex-shrink: 0;
  margin-top: 1px;
}

.lplan-feat-body {
  flex: 1;
  min-width: 0;
}

.lplan-feat-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.lplan-feat-top b {
  font-size: 0.84rem;
  color: #f8fafc;
}

.lplan-feat-badge {
  font-size: 0.67rem;
  font-weight: 800;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(0, 255, 156, 0.16);
  color: #6ee7b7;
  border: 1px solid rgba(0, 255, 156, 0.35);
}

.lplan-card.tier-ultimate .lplan-feat-badge {
  background: rgba(250, 204, 21, 0.18);
  color: #fde047;
  border-color: rgba(250, 204, 21, 0.4);
}

.lplan-feat-body small {
  display: block;
  margin-top: 2px;
  font-size: 0.74rem;
  color: #94a3b8;
  line-height: 1.35;
}

/* Cancel Plan Footer */
.lplans-cancel-footer {
  position: relative;
  z-index: 1;
  margin-top: 32px;
}

.lplans-cancel-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  padding: 18px 22px;
  border-radius: 18px;
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(239, 68, 68, 0.35);
}

.lplans-cancel-info b {
  display: block;
  font-size: 0.95rem;
  color: #f8fafc;
  margin-bottom: 4px;
}

.lplans-cancel-info p {
  margin: 0;
  font-size: 0.82rem;
  color: #cbd5e1;
}

.lplans-cancel-btn {
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid rgba(239, 68, 68, 0.6);
  background: rgba(239, 68, 68, 0.18);
  color: #fca5a5;
  font-weight: 800;
  font-size: 0.85rem;
  cursor: pointer;
  transition: background 0.15s ease;
}

.lplans-cancel-btn:hover {
  background: rgba(239, 68, 68, 0.32);
}

.lplans-canceled-pill {
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.16);
  border: 1px solid rgba(245, 158, 11, 0.45);
  color: #fcd34d;
  font-size: 0.8rem;
  font-weight: 800;
}

/* ============================================================================
   AI CHAT UPGRADE CTA BUTTON & VIDEO BANNER LOOP
   ============================================================================ */
.lz-plan-upgrade-bubble-cta {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(0, 255, 156, 0.22);
}

.lz-msg-upgrade-plan-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 10px 18px !important;
  border-radius: 14px !important;
  background: linear-gradient(90deg, #00e676, #34d399, #facc15) !important;
  color: #02140a !important;
  font-weight: 900 !important;
  box-shadow: 0 8px 24px rgba(0, 230, 118, 0.32) !important;
}

.lz-msg-upgrade-plan-btn small {
  font-size: 0.72rem;
  font-weight: 700;
  opacity: 0.85;
}

.lz-ps-banner-video,
.lz-pub-banner-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ============================================================================
   ADMIN SUITE NAVIGATION, TIMED PLAN MANAGER & AI COMMUNITY EVENTS
   ============================================================================ */
.adm-suite-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 8px !important;
  margin: 14px 0 !important;
}

.adm-suite-tab {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 9px 14px !important;
  border-radius: 12px !important;
  white-space: nowrap !important;
  overflow: visible !important;
  flex: 0 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
}

.adm-suite-tab .ast-badge,
.adm-suite-tab .adm-tab-badge {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: 2px !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  transform: none !important;
  flex-shrink: 0 !important;
}

.adm-action-drawer.plan {
  margin: 12px 0;
  padding: 16px 18px;
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(6, 28, 18, 0.95), rgba(4, 16, 12, 0.98));
  border: 1px solid rgba(0, 255, 156, 0.45);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
}

.adm-plan-duration-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.adm-dur-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  color: #cbd5e1;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  transition: all 0.16s ease;
}

.adm-dur-pill.on {
  background: rgba(0, 255, 156, 0.18);
  border-color: #00ff9c;
  color: #fff;
}

.adm-plan-timed-inputs {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  opacity: 0.45;
  transition: opacity 0.18s ease;
}

.adm-plan-timed-inputs.open {
  opacity: 1;
}

.adm-plan-timed-inputs input[type="number"] {
  width: 78px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(0, 0, 0, 0.4);
  color: #fff;
  font-weight: 700;
}

.adm-plan-timed-inputs select {
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(6, 20, 14, 0.9);
  color: #fff;
  font-weight: 700;
}

.adm-plan-exp-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 700;
  background: rgba(250, 204, 21, 0.14);
  border: 1px solid rgba(250, 204, 21, 0.42);
  color: #fde68a;
}

.adm-plan-exp-chip.perm {
  background: rgba(0, 255, 156, 0.12);
  border-color: rgba(0, 255, 156, 0.35);
  color: #9effd8;
}

/* ---- Admin AI Community Event Studio ---- */
.adm-ev-studio {
  background: linear-gradient(155deg, rgba(6, 24, 17, 0.92), rgba(7, 13, 24, 0.95));
  border: 1px solid rgba(0, 255, 156, 0.34);
  border-radius: 18px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.35);
}

.adm-ev-studio-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.adm-ev-studio-head h3 {
  margin: 6px 0 2px;
  font-size: 1.08rem;
  color: #fff;
}

.adm-ev-live-status {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.14);
  font-size: 0.8rem;
  color: #cbd5e1;
}

.adm-ev-live-status.on {
  background: rgba(0, 255, 156, 0.1);
  border-color: rgba(0, 255, 156, 0.45);
  color: #fff;
}

.adm-ev-live-status small {
  display: block;
  font-size: 0.72rem;
  color: #9effd8;
}

.adm-ev-live-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #00ff9c;
  box-shadow: 0 0 10px #00ff9c;
}

.adm-ev-stop-btn {
  border-color: rgba(239, 68, 68, 0.5) !important;
  color: #fca5a5 !important;
}

.adm-ev-prompt-bar {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.adm-ev-prompt-bar input {
  flex: 1 1 320px;
  padding: 11px 14px;
  border-radius: 12px;
  border: 1px solid rgba(0, 255, 156, 0.35);
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  font-size: 0.88rem;
}

.adm-ev-config-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.adm-ev-span2 {
  grid-column: span 2;
}

.adm-ev-spanfull {
  grid-column: 1 / -1;
}

.adm-ev-config-grid textarea {
  width: 100%;
  padding: 9px 12px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  resize: vertical;
  font-family: inherit;
  font-size: 0.84rem;
}

.adm-ev-tiers-box {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.adm-ev-tiers-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.adm-ev-tiers-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.adm-ev-tier-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.32);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.adm-ev-tier-row input,
.adm-ev-tier-row select {
  padding: 6px 9px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(8, 22, 16, 0.9);
  color: #fff;
  font-size: 0.78rem;
}

.adm-ev-t-emoji { width: 46px; text-align: center; }
.adm-ev-t-title { flex: 1 1 140px; min-width: 120px; }
.adm-ev-t-target { width: 84px; }
.adm-ev-t-damt { width: 68px; }
.adm-ev-t-tok { width: 105px; }
.adm-ev-t-desc { flex: 2 1 180px; min-width: 150px; }

.adm-ev-launch-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 6px;
}

@media (max-width: 820px) {
  .adm-ev-config-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 540px) {
  .adm-ev-config-grid { grid-template-columns: 1fr; }
  .adm-ev-span2 { grid-column: auto; }
}

/* ============================================================================
   DYNAMIC COMMUNITY EVENT TOPBAR BUTTON & SHOWCASE VIEW (#eventView)
   ============================================================================ */
.event-top-btn[hidden] {
  display: none !important;
}

.event-top-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0, 255, 156, 0.45);
  background: linear-gradient(135deg, rgba(0, 255, 156, 0.18), rgba(16, 185, 129, 0.12));
  color: #e6fff5;
  font-size: 0.79rem;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 4px 16px rgba(0, 255, 156, 0.18);
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.event-top-btn:hover,
.event-top-btn.active {
  transform: translateY(-1px);
  border-color: #00ff9c;
  box-shadow: 0 6px 22px rgba(0, 255, 156, 0.34);
}

.event-top-btn[data-accent="gold"] {
  border-color: rgba(250, 204, 21, 0.55);
  background: linear-gradient(135deg, rgba(250, 204, 21, 0.2), rgba(245, 158, 11, 0.12));
  color: #fef3c7;
}

.event-top-btn[data-accent="violet"] {
  border-color: rgba(168, 85, 247, 0.55);
  background: linear-gradient(135deg, rgba(168, 85, 247, 0.22), rgba(99, 102, 241, 0.14));
  color: #f3e8ff;
}

.event-top-btn[data-accent="cyber"] {
  border-color: rgba(56, 189, 248, 0.55);
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.22), rgba(6, 182, 212, 0.12));
  color: #e0f2fe;
}

.event-top-btn[data-accent="crimson"] {
  border-color: rgba(244, 63, 94, 0.55);
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.22), rgba(239, 68, 68, 0.12));
  color: #ffe4e6;
}

.ev-top-pct {
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.38);
  font-size: 0.7rem;
  font-weight: 900;
}

.event-view {
  padding: 20px 24px 48px;
  overflow-y: auto !important;
  flex: 1 1 auto;
  min-height: 0;
}

.lev-shell {
  max-width: 1120px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  --ev-accent: #00ff9c;
  --ev-glow: rgba(0, 255, 156, 0.22);
}

.lev-shell[data-accent="gold"] { --ev-accent: #facc15; --ev-glow: rgba(250, 204, 21, 0.24); }
.lev-shell[data-accent="violet"] { --ev-accent: #c084fc; --ev-glow: rgba(168, 85, 247, 0.26); }
.lev-shell[data-accent="cyber"] { --ev-accent: #38bdf8; --ev-glow: rgba(56, 189, 248, 0.26); }
.lev-shell[data-accent="crimson"] { --ev-accent: #fb7185; --ev-glow: rgba(244, 63, 94, 0.26); }

.lev-hero {
  background: linear-gradient(145deg, rgba(7, 22, 16, 0.92), rgba(8, 12, 22, 0.96));
  border: 1px solid color-mix(in srgb, var(--ev-accent) 42%, transparent);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.45), 0 0 40px var(--ev-glow);
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.lev-hero-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}

.lev-hero-pills {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.lev-live-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  background: color-mix(in srgb, var(--ev-accent) 18%, transparent);
  border: 1px solid color-mix(in srgb, var(--ev-accent) 55%, transparent);
  color: #fff;
}

.lev-live-pill.live i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ev-accent);
  box-shadow: 0 0 10px var(--ev-accent);
}

.lev-meta-pill {
  padding: 5px 11px;
  border-radius: 999px;
  font-size: 0.75rem;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #cbd5e1;
}

.lev-hero-main {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}

.lev-hero-icon {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  display: grid;
  place-items: center;
  font-size: 2.4rem;
  background: color-mix(in srgb, var(--ev-accent) 16%, rgba(255, 255, 255, 0.04));
  border: 1px solid color-mix(in srgb, var(--ev-accent) 45%, transparent);
  box-shadow: 0 10px 26px var(--ev-glow);
  flex-shrink: 0;
}

.lev-kicker {
  display: inline-block;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ev-accent);
  margin-bottom: 4px;
}

.lev-hero-copy h1 {
  margin: 0 0 6px;
  font-size: clamp(1.5rem, 2.8vw, 2.15rem);
  font-weight: 900;
  color: #fff;
}

.lev-hero-copy p {
  margin: 0;
  color: #cbd5e1;
  font-size: 0.95rem;
  line-height: 1.5;
  max-width: 760px;
}

.lev-kpi-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}

.lev-kpi {
  padding: 13px 15px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.lev-kpi small {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: var(--muted);
}

.lev-kpi b {
  font-size: 1.22rem;
  font-weight: 900;
  color: #fff;
}

.lev-kpi span {
  font-size: 0.76rem;
  color: #94a3b8;
}

.lev-progress-card {
  padding: 16px 18px 22px;
  border-radius: 16px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.lev-prog-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 0.86rem;
  margin-bottom: 12px;
  color: #e2e8f0;
}

.lev-prog-track {
  position: relative;
  height: 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.09);
  overflow: visible;
}

.lev-prog-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--ev-accent), #34d399, #facc15);
  box-shadow: 0 0 18px var(--ev-glow);
  transition: width 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.lev-prog-pin {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.85rem;
  background: #0a1410;
  border: 2px solid rgba(255, 255, 255, 0.35);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}

.lev-prog-pin.hit {
  border-color: var(--ev-accent);
  background: color-mix(in srgb, var(--ev-accent) 28%, #04120c);
}

.lev-section-head h2 {
  margin: 0 0 4px;
  font-size: 1.25rem;
  color: #fff;
}

.lev-section-head p {
  margin: 0;
  color: #94a3b8;
  font-size: 0.88rem;
}

.lev-tiers-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 16px;
  margin-top: 14px;
}

.lev-tier-card {
  background: rgba(8, 18, 14, 0.9);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 18px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform 0.18s ease, border-color 0.18s ease;
}

.lev-tier-card.is-unlocked {
  border-color: color-mix(in srgb, var(--ev-accent) 60%, transparent);
  box-shadow: 0 12px 30px var(--ev-glow);
}

.lev-tier-card.is-claimed {
  border-color: rgba(52, 211, 153, 0.45);
  background: linear-gradient(155deg, rgba(6, 36, 24, 0.88), rgba(6, 16, 14, 0.92));
}

.lev-tier-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.lev-tier-step {
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  color: var(--ev-accent);
  padding: 3px 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ev-accent) 14%, transparent);
}

.lev-tier-emoji {
  font-size: 1.65rem;
}

.lev-tier-card h3 {
  margin: 0;
  font-size: 1.08rem;
  color: #fff;
}

.lev-tier-desc {
  margin: 0;
  font-size: 0.85rem;
  color: #cbd5e1;
  line-height: 1.45;
  flex: 1 1 auto;
}

.lev-tier-reward-pill {
  padding: 7px 11px;
  border-radius: 10px;
  font-size: 0.8rem;
  font-weight: 800;
  color: #fef08a;
  background: rgba(250, 204, 21, 0.11);
  border: 1px solid rgba(250, 204, 21, 0.34);
}

.lev-tier-prog-meta {
  display: flex;
  justify-content: space-between;
  font-size: 0.76rem;
  color: #94a3b8;
}

.lev-tier-bar {
  height: 7px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.09);
  overflow: hidden;
}

.lev-tier-bar i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--ev-accent), #facc15);
  border-radius: 999px;
}

.lev-claim-btn {
  width: 100%;
  padding: 11px 14px;
  border-radius: 12px;
  border: none;
  background: linear-gradient(90deg, var(--ev-accent), #34d399, #facc15);
  color: #03150c;
  font-weight: 900;
  font-size: 0.88rem;
  cursor: pointer;
  box-shadow: 0 8px 22px var(--ev-glow);
}

.lev-claim-btn:disabled {
  opacity: 0.65;
  cursor: wait;
}

.lev-claim-done {
  text-align: center;
  padding: 10px 12px;
  border-radius: 11px;
  background: rgba(16, 185, 129, 0.16);
  border: 1px solid rgba(16, 185, 129, 0.45);
  color: #a7f3d0;
  font-size: 0.82rem;
  font-weight: 800;
}

.lev-claim-locked {
  text-align: center;
  padding: 10px 12px;
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #94a3b8;
  font-size: 0.8rem;
  font-weight: 700;
}

.lev-story-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 16px;
}

@media (max-width: 820px) {
  .lev-story-grid { grid-template-columns: 1fr; }
}

.lev-story-card,
.lev-highlights-card,
.lev-empty-card {
  background: rgba(8, 16, 14, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 18px;
  padding: 20px;
}

.lev-story-card h3,
.lev-highlights-card h3 {
  margin: 0 0 12px;
  font-size: 1rem;
  color: #fff;
}

.lev-highlights-card ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lev-highlights-card li {
  display: flex;
  gap: 8px;
  font-size: 0.86rem;
  color: #cbd5e1;
  line-height: 1.45;
}

.lev-empty-card {
  text-align: center;
  padding: 48px 24px;
  margin-top: 24px;
}

.lev-empty-ic {
  font-size: 3rem;
  margin-bottom: 10px;
}

.lev-empty-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
}

/* ============================================================================
   🗄 DATA VAULT, ETERNAL PERSISTENCE & ADMIN POWER TOOLS
   ============================================================================ */
.adm-vault-shell {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.adm-vault-hero {
  background: radial-gradient(circle at 90% 10%, rgba(0, 255, 156, 0.14), transparent 55%),
              linear-gradient(135deg, rgba(8, 22, 18, 0.96), rgba(4, 10, 12, 0.98));
  border: 1px solid rgba(0, 255, 156, 0.32);
  border-radius: 18px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.adm-vault-hero-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
}

.adm-vault-hero-top h3 {
  margin: 4px 0 4px;
  font-size: 1.15rem;
  color: #fff;
}

.adm-vault-loc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.adm-vault-loc-card {
  background: rgba(0, 0, 0, 0.42);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  padding: 11px 13px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.adm-vault-loc-card.ok {
  border-color: rgba(16, 185, 129, 0.35);
}

.adm-vault-loc-card b {
  font-size: 0.82rem;
  color: #e2e8f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
}

.adm-vault-loc-card code {
  font-size: 0.7rem;
  color: #6ee7b7;
  word-break: break-all;
}

.adm-vault-loc-card small {
  font-size: 0.72rem;
  color: #94a3b8;
}

.adm-vault-actions-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.adm-vault-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 14px;
}

.adm-snap-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 270px;
  overflow-y: auto;
  padding-right: 4px;
}

.adm-snap-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 11px;
  background: rgba(0, 0, 0, 0.38);
  border: 1px solid rgba(255, 255, 255, 0.08);
  flex-wrap: wrap;
}

.adm-snap-row.pre-update {
  border-color: rgba(250, 204, 21, 0.38);
}

.adm-snap-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 180px;
}

.adm-snap-meta b {
  font-size: 0.8rem;
  color: #fff;
}

.adm-snap-meta small {
  font-size: 0.72rem;
  color: #94a3b8;
}

.adm-snap-acts {
  display: flex;
  align-items: center;
  gap: 6px;
}

.adm-analyst-presets {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.adm-analyst-output {
  margin-top: 12px;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba(2, 12, 10, 0.88);
  border: 1px solid rgba(0, 255, 156, 0.25);
  color: #e2e8f0;
  font-size: 0.84rem;
  line-height: 1.55;
  max-height: 280px;
  overflow-y: auto;
}

.adm-file-upload-btn {
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.adm-file-upload-btn input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

/* ============================================================================
   🚧 FULL-SCREEN UNCLOSABLE MAINTENANCE OVERLAY (NON-ADMINS)
   ============================================================================ */
.lz-maint-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  overflow-y: auto;
  pointer-events: auto;
}

.lz-maint-overlay[hidden] {
  display: none !important;
}

.lz-maint-backdrop {
  position: fixed;
  inset: 0;
  background: radial-gradient(circle at 50% 15%, rgba(245, 158, 11, 0.16), transparent 60%),
              radial-gradient(circle at 20% 80%, rgba(239, 68, 68, 0.12), transparent 50%),
              rgba(3, 8, 7, 0.96);
  backdrop-filter: blur(28px) saturate(180%);
  -webkit-backdrop-filter: blur(28px) saturate(180%);
  pointer-events: none;
}

.lz-maint-card {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 760px;
  background: linear-gradient(145deg, rgba(16, 26, 22, 0.96), rgba(8, 14, 12, 0.98));
  border: 1px solid rgba(245, 158, 11, 0.38);
  border-radius: 24px;
  padding: 32px 36px;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.8), 0 0 60px rgba(245, 158, 11, 0.15);
  display: flex;
  flex-direction: column;
  gap: 20px;
  animation: lzMaintScaleIn 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes lzMaintScaleIn {
  from { opacity: 0; transform: scale(0.96) translateY(12px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

.lz-maint-badge-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.lz-maint-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(245, 158, 11, 0.14);
  border: 1px solid rgba(245, 158, 11, 0.4);
  color: #fde68a;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lz-maint-pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #f59e0b;
  box-shadow: 0 0 10px #f59e0b;
  animation: lzMaintDotPulse 1.4s infinite alternate;
}

@keyframes lzMaintDotPulse {
  from { opacity: 0.4; transform: scale(0.85); }
  to { opacity: 1; transform: scale(1.2); }
}

.lz-maint-by {
  font-size: 0.8rem;
  color: #94a3b8;
  font-weight: 500;
}

.lz-maint-title {
  margin: 0;
  font-size: 1.85rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

.lz-maint-timer-wrap {
  background: rgba(0, 0, 0, 0.48);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: center;
}

.lz-maint-timer-label {
  font-size: 0.74rem;
  font-weight: 800;
  color: #fde68a;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.lz-maint-countdown-grid {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.lz-maint-seg {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  padding: 10px 16px;
  min-width: 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.lz-maint-seg.accent {
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(245, 158, 11, 0.45);
}

.lz-maint-seg b {
  font-family: 'JetBrains Mono', monospace;
  font-size: 2rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
}

.lz-maint-seg.accent b {
  color: #fbbf24;
}

.lz-maint-seg small {
  font-size: 0.68rem;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
}

.lz-maint-progress-track {
  width: 100%;
  height: 6px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  overflow: hidden;
  margin-top: 4px;
}

.lz-maint-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #f59e0b, #00ff9c);
  transition: width 0.4s ease;
  border-radius: 999px;
}

.lz-maint-eta {
  font-size: 0.78rem;
  color: #a1a1aa;
}

.lz-maint-article-box {
  background: rgba(0, 0, 0, 0.38);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 16px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 280px;
  overflow-y: auto;
}

.lz-maint-article-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 0.88rem;
  font-weight: 700;
  color: #e2e8f0;
}

.lz-maint-lock-tag {
  font-size: 0.72rem;
  color: #34d399;
  background: rgba(52, 211, 153, 0.12);
  padding: 3px 8px;
  border-radius: 6px;
  font-weight: 600;
}

.lz-maint-article-body {
  font-size: 0.88rem;
  color: #cbd5e1;
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-word;
}

.lz-maint-article-body b,
.lz-maint-article-body strong {
  color: #fff;
}

.lz-maint-article-body ul {
  margin: 6px 0;
  padding-left: 20px;
}

.lz-maint-article-body li {
  margin: 4px 0;
}

.lz-maint-foot {
  text-align: center;
  font-size: 0.78rem;
  color: #71717a;
  line-height: 1.45;
}

.lz-maint-admin-preview-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 14px;
  border-top: 1px dashed rgba(245, 158, 11, 0.4);
  font-size: 0.82rem;
  color: #fde68a;
}

/* ============================================================================
   👑 ADMIN FLOATING MAINTENANCE BAR (ADMINS SEE IT LIVE AT TOP)
   ============================================================================ */
.lz-admin-maint-bar {
  position: fixed;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999998;
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(20, 24, 20, 0.94);
  border: 1px solid rgba(245, 158, 11, 0.6);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.75), 0 0 25px rgba(245, 158, 11, 0.25);
  border-radius: 999px;
  padding: 8px 18px;
  color: #fde68a;
  font-size: 0.82rem;
  font-weight: 700;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.lz-admin-maint-bar[hidden] {
  display: none !important;
}

.lz-maint-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #f59e0b;
  box-shadow: 0 0 8px #f59e0b;
  animation: lzMaintDotPulse 1.2s infinite alternate;
}

.lz-maint-bar-btn {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: #fff;
  font-size: 0.76rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.lz-maint-bar-btn:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.3);
}

.lz-maint-bar-btn.stop {
  background: rgba(239, 68, 68, 0.2);
  border-color: rgba(239, 68, 68, 0.5);
  color: #fca5a5;
}

.lz-maint-bar-btn.stop:hover {
  background: rgba(239, 68, 68, 0.35);
}

/* ============================================================================
   🎛 EXPANDED ADMIN POWER TOOLS & STUDIO STYLES
   ============================================================================ */
.adm-maint-card {
  border-color: rgba(245, 158, 11, 0.38) !important;
  background: radial-gradient(circle at 95% 5%, rgba(245, 158, 11, 0.1), transparent 55%),
              rgba(12, 18, 16, 0.95) !important;
}

.adm-maint-live-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: rgba(245, 158, 11, 0.12);
  border: 1px solid rgba(245, 158, 11, 0.35);
  border-radius: 12px;
  padding: 10px 14px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.adm-maint-live-banner.off {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.08);
  color: #94a3b8;
}

.adm-dur-preset-pills {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 6px;
}

.adm-dur-preset-btn {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #cbd5e1;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.adm-dur-preset-btn:hover {
  background: rgba(245, 158, 11, 0.2);
  border-color: rgba(245, 158, 11, 0.4);
  color: #fde68a;
}

.adm-sockets-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 240px;
  overflow-y: auto;
  margin-top: 10px;
}

.adm-socket-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 0.8rem;
}

.adm-socket-meta {
  display: flex;
  align-items: center;
  gap: 8px;
}

.adm-socket-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.adm-plan-breakdown-bar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.adm-pbreak-card {
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.adm-pbreak-card small {
  font-size: 0.7rem;
  color: #94a3b8;
  text-transform: uppercase;
}

.adm-pbreak-card b {
  font-size: 1.1rem;
  color: #fff;
}

/* Dedicated Admin Maintenance Studio Section */
.adm-suite-tab[data-amtab="maintenance"].maint-live-tab {
  border-color: rgba(245, 158, 11, 0.55) !important;
  box-shadow: 0 0 14px rgba(245, 158, 11, 0.22);
}

.adm-suite-tab[data-amtab="maintenance"].maint-live-tab .ast-badge {
  background: rgba(245, 158, 11, 0.25);
  color: #fde68a;
  border-color: rgba(245, 158, 11, 0.55);
}

.adm-maint-shell {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.adm-maint-hero {
  border-radius: 18px;
  padding: 18px 20px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: radial-gradient(circle at 90% 10%, rgba(16, 185, 129, 0.12), transparent 55%),
              rgba(10, 15, 14, 0.94);
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.adm-maint-hero.is-active {
  border-color: rgba(245, 158, 11, 0.55);
  background: radial-gradient(circle at 90% 10%, rgba(245, 158, 11, 0.18), transparent 58%),
              rgba(18, 14, 10, 0.96);
  box-shadow: 0 0 24px rgba(245, 158, 11, 0.14);
}

.adm-maint-hero-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.adm-maint-hero-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.adm-maint-stat {
  background: rgba(0, 0, 0, 0.38);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 10px 12px;
}

.adm-maint-stat small {
  display: block;
  font-size: 0.7rem;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 3px;
}

.adm-maint-stat b {
  font-size: 1rem;
  color: #fff;
}

.adm-maint-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.95fr);
  gap: 16px;
  align-items: start;
}

@media (max-width: 960px) {
  .adm-maint-grid {
    grid-template-columns: 1fr;
  }
}

.adm-maint-tpl-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 8px;
}

.adm-maint-tpl-btn,
.adm-maint-ext-btn {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #e2e8f0;
  font-size: 0.73rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.adm-maint-tpl-btn:hover,
.adm-maint-ext-btn:hover {
  background: rgba(0, 255, 156, 0.14);
  border-color: rgba(0, 255, 156, 0.42);
  color: #a7f3d0;
}

.adm-maint-ext-btn {
  background: rgba(245, 158, 11, 0.14);
  border-color: rgba(245, 158, 11, 0.38);
  color: #fde68a;
}

.adm-maint-ext-btn:hover {
  background: rgba(245, 158, 11, 0.28);
  border-color: rgba(245, 158, 11, 0.65);
  color: #fef3c7;
}

.adm-maint-preview-pane {
  background: rgba(4, 8, 7, 0.75);
  border: 1px solid rgba(245, 158, 11, 0.25);
  border-radius: 14px;
  padding: 14px 16px;
  margin-top: 10px;
}

.adm-maint-preview-pane h4 {
  margin: 0 0 8px;
  font-size: 0.95rem;
  color: #fde68a;
}

.adm-maint-history-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 230px;
  overflow-y: auto;
  margin-top: 8px;
}

.adm-maint-hist-row {
  padding: 8px 11px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 0.78rem;
  display: flex;
  flex-direction: column;
  gap: 3px;
}