:root{--bg:#06100f;--panel:#0a1a1cdd;--line:#1c4a48;--acc:#4ff0d0;--acc2:#7ff7e0;--amb:#ffb347;--red:#ff5a4a;--mut:#8fb5b0;--txt:#e6fbf7}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden;background:#000;color:var(--txt);font:500 15px/1.4 "Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;user-select:none}
canvas#c{position:fixed;inset:0;width:100%;height:100%;display:block}
.off{display:none!important}button{font:inherit;color:inherit;border:0;cursor:pointer;background:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 26px;font-weight:800;letter-spacing:2px;font-size:15px;background:linear-gradient(#58f5d6,#22b9a0);color:#032420;border-radius:3px;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:.15s}
.btn:hover{filter:brightness(1.15);transform:translateY(-1px)}.btn.ghost{background:#ffffff14;color:var(--txt);box-shadow:inset 0 0 0 1px #ffffff30}.btn.amb{background:linear-gradient(#ffc766,#e08a1a);color:#2a1500}.btn.sm{padding:7px 14px;font-size:12px}.btn[disabled]{filter:grayscale(.9) brightness(.6);pointer-events:none}.btn.big{padding:16px 40px;font-size:20px}
/* ---------- launcher ---------- */
#launcher{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;padding:2.2vh 3vw;background:linear-gradient(90deg,#030a0acc 0%,#030a0a88 42%,#030a0a22 70%,transparent),linear-gradient(0deg,#030a0a99,transparent 30%)}
.lhead{display:flex;align-items:flex-end;justify-content:space-between}.logo b{display:block;font-size:clamp(34px,6vw,64px);font-weight:900;letter-spacing:.22em;line-height:1;color:#eafffb;text-shadow:0 0 28px #4ff0d088,0 3px 0 #000a}.logo span{display:block;font-size:13px;letter-spacing:.7em;color:var(--acc);margin-top:6px;font-weight:700}
.lstat{font-size:12px;letter-spacing:2px;color:var(--mut);text-transform:uppercase}.lstat b{color:var(--acc)}
#lnav{display:flex;gap:2px;margin:2.2vh 0 1.6vh;flex-wrap:wrap}#lnav button{padding:10px 18px;font-weight:800;font-size:13px;letter-spacing:2.5px;color:var(--mut);border-bottom:2px solid #1c4a4855;background:#04101088;transition:.15s}#lnav button:hover{color:#fff;background:#0c2a2a99}#lnav button.on{color:var(--acc);border-color:var(--acc);background:#0c2a2acc}
#lbody{flex:1;min-height:0;overflow:auto;max-width:960px;padding:2px 4px 8px 0;scrollbar-width:thin}.lfoot{display:flex;justify-content:space-between;font-size:11px;letter-spacing:1.5px;color:#8fb5b0aa;text-transform:uppercase;padding-top:6px}
.glass{background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:16px 18px;backdrop-filter:blur(6px);box-shadow:0 8px 30px #0008}
.glass h3{font-size:12px;letter-spacing:3px;color:var(--acc);margin-bottom:10px;text-transform:uppercase}
.intro{max-width:560px;font-size:15px;line-height:1.55;color:#cfe9e5;margin-bottom:14px;text-shadow:0 1px 6px #000}.intro b{color:var(--amb)}
.row{display:flex;gap:14px;flex-wrap:wrap;align-items:stretch}.col{flex:1;min-width:260px}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.field label{font-size:11px;letter-spacing:2px;color:var(--mut);text-transform:uppercase}
.field input[type=text]{background:#02100f;border:1px solid var(--line);color:#fff;padding:10px 12px;font-size:16px;border-radius:3px;outline:none;user-select:text}.field input:focus{border-color:var(--acc)}
.sw{display:flex;gap:8px}.sw i{width:30px;height:30px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:.15s}.sw i.on{border-color:#fff;transform:scale(1.12)}
.srv{display:grid;grid-template-columns:34px 1fr 90px 80px 70px;gap:8px;align-items:center;padding:9px 10px;border-bottom:1px solid #1c4a4844;font-size:14px;cursor:pointer}.srv:hover{background:#4ff0d012}.srv.on{background:#4ff0d01f;box-shadow:inset 3px 0 var(--acc)}.srv.hd{font-size:11px;letter-spacing:2px;color:var(--mut);cursor:default}.srv.hd:hover{background:none}.srv .ld{height:6px;background:#0b2a2a;border-radius:3px;overflow:hidden}.srv .ld i{display:block;height:100%;background:var(--acc)}.srv .pg{color:var(--acc);font-weight:700;text-align:right}
.wipe{margin-top:10px;font-size:13px;color:var(--mut)}.wipe b{color:var(--amb);font-variant-numeric:tabular-nums}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.item{background:#04141499;border:1px solid var(--line);padding:10px 12px;border-radius:3px}.item b{display:block;font-size:20px;color:#fff}.item span{font-size:12px;color:var(--mut);letter-spacing:1px;text-transform:uppercase}
.mrow{padding:8px 0;border-bottom:1px solid #1c4a4844;display:flex;gap:10px;font-size:14px}.mrow i{font-style:normal;width:22px;color:var(--acc)}.mrow.dn{opacity:.5}.mrow.cu{color:#fff}.mrow small{display:block;color:var(--mut);font-size:12px}
.prod{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;padding:10px;border:1px solid var(--line);background:#04141499;border-radius:3px}.prod .ic{width:48px;height:48px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:22px;background:#07201f;color:var(--acc)}.prod b{display:block}.prod small{color:var(--mut);font-size:12px}.price{font-weight:800;color:var(--amb);white-space:nowrap;text-align:right}.price small{display:block;color:var(--mut);font-weight:600;letter-spacing:1px}
.tabs{display:flex;gap:4px;margin-bottom:12px}.tabs button{padding:8px 16px;font-weight:800;font-size:12px;letter-spacing:2px;border:1px solid var(--line);color:var(--mut);background:#04141499}.tabs button.on{color:#032420;background:var(--acc)}
.pl{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:10px}.soon{display:inline-block;padding:2px 8px;border:1px solid var(--amb);color:var(--amb);font-size:11px;letter-spacing:2px;font-weight:800;border-radius:2px}
.wal{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;font-size:13px;color:var(--mut)}.wal b{color:var(--acc)}
.rng{display:flex;align-items:center;gap:12px;margin-bottom:12px}.rng label{width:150px;font-size:12px;letter-spacing:2px;color:var(--mut);text-transform:uppercase}.rng input{flex:1;accent-color:var(--acc)}.rng span{width:40px;text-align:right;color:var(--acc)}
/* ---------- HUD ---------- */
#hud{position:fixed;inset:0;z-index:10;pointer-events:none;text-shadow:0 1px 4px #000c}
#vig{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 55%,#00000066 100%)}#hurt{position:absolute;inset:0;box-shadow:inset 0 0 120px 30px #ff2a1a;opacity:0}#wet{position:absolute;inset:0}
#compass{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:min(420px,40vw);height:26px;overflow:hidden;border:1px solid #4ff0d044;background:#04141466;-webkit-mask:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);mask:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent)}#compass i{position:absolute;left:50%;top:0;width:2px;height:8px;background:var(--acc);transform:translateX(-1px)}#ctape{position:absolute;top:6px;left:0;height:20px;white-space:nowrap;font-size:12px;font-weight:800;letter-spacing:0;color:#cfeee8}#ctape span{position:absolute;transform:translateX(-50%)}#ctape span.m{color:var(--amb)}
#topl{position:absolute;top:44px;left:16px;width:290px}#zone{font-size:11px;letter-spacing:3px;font-weight:800;color:var(--acc);margin-bottom:6px;min-height:14px}#mis{background:#041414b8;border-left:3px solid var(--acc);padding:8px 12px;font-size:13px}#mis b{display:block;font-size:11px;letter-spacing:2px;color:var(--acc)}#mis .g{color:#fff;font-weight:700;margin:2px 0}#mis .pb{height:4px;background:#0b2a2a;margin-top:6px}#mis .pb i{display:block;height:100%;background:var(--acc)}
#topr{position:absolute;top:12px;right:16px;text-align:right}#clock{display:flex;flex-direction:column;align-items:flex-end;gap:1px;background:#041414a8;padding:8px 12px;border-right:3px solid var(--amb)}#ctime{font-size:24px;letter-spacing:2px;font-variant-numeric:tabular-nums}#cday,#cwx{font-size:11px;letter-spacing:2px;color:var(--mut);text-transform:uppercase}#online{font-size:11px;letter-spacing:2px;color:var(--mut);margin-top:6px}#online b{color:var(--acc)}
#res{display:flex;flex-direction:column;gap:3px;margin-top:8px;align-items:flex-end}#res div{background:#041414a8;padding:3px 10px;font-size:13px;min-width:112px;display:flex;justify-content:space-between;gap:14px}#res div span{color:var(--mut);font-size:11px;letter-spacing:1px;text-transform:uppercase;align-self:center}#res div.up{color:var(--acc);animation:up .9s}@keyframes up{from{transform:scale(1.25);color:#fff}}
#cross{position:absolute;left:50%;top:50%;width:0;height:0}#cross i{position:absolute;left:-2px;top:-2px;width:4px;height:4px;border-radius:50%;background:#fff;opacity:.85;box-shadow:0 0 0 1px #0008;transition:.1s}#cross.hot i{background:var(--acc);transform:scale(1.8)}#cross.bld i{width:18px;height:18px;left:-9px;top:-9px;border:1px solid var(--acc);background:none;border-radius:50%}
#hitm{position:absolute;left:50%;top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;opacity:0;background:linear-gradient(45deg,transparent 46%,#fff 46%,#fff 54%,transparent 54%),linear-gradient(-45deg,transparent 46%,#fff 46%,#fff 54%,transparent 54%);-webkit-mask:radial-gradient(circle,transparent 5px,#000 6px);mask:radial-gradient(circle,transparent 5px,#000 6px)}#hitm.k{filter:drop-shadow(0 0 4px var(--red));background:linear-gradient(45deg,transparent 46%,#ff5a4a 46%,#ff5a4a 54%,transparent 54%),linear-gradient(-45deg,transparent 46%,#ff5a4a 46%,#ff5a4a 54%,transparent 54%)}
#prompt{position:absolute;left:50%;top:60%;transform:translateX(-50%);font-size:15px;font-weight:700;letter-spacing:1px;background:#041414b0;padding:6px 14px;border:1px solid #4ff0d055;opacity:0;transition:.12s;text-align:center}#prompt.on{opacity:1}#prompt kbd{display:inline-block;padding:0 7px;margin-right:6px;background:var(--acc);color:#032420;font-weight:900;border-radius:2px}
#toasts{position:absolute;left:50%;top:22%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px}.toast{background:#041414d0;border:1px solid #4ff0d055;padding:7px 16px;font-weight:700;letter-spacing:.5px;animation:tst 3.4s forwards}.toast.bad{border-color:var(--red);color:#ffb8b0}.toast.big{font-size:20px;letter-spacing:3px;padding:12px 28px;border-color:var(--amb);color:var(--amb);background:#1a1204d8}.toast.big small{display:block;font-size:12px;letter-spacing:1px;color:#fff;font-weight:500;margin-top:3px;max-width:380px}@keyframes tst{0%{opacity:0;transform:translateY(8px)}8%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0}}
#chatlog{position:absolute;left:16px;bottom:128px;width:340px;display:flex;flex-direction:column;gap:2px;font-size:13px}#chatlog div{background:#04141488;padding:2px 8px;animation:cl 9s forwards}#chatlog b{color:var(--acc)}@keyframes cl{0%,85%{opacity:1}100%{opacity:0}}
#chatrow{position:absolute;left:16px;bottom:96px;width:340px;display:none;pointer-events:auto}#chatrow.on{display:block}#chatrow input{width:100%;background:#021010ee;border:1px solid var(--acc);color:#fff;padding:7px 10px;font-size:14px;outline:none;user-select:text}
#vit{position:absolute;left:16px;bottom:16px;width:300px;display:flex;flex-direction:column;gap:5px}.vb{display:grid;grid-template-columns:62px 1fr 30px;gap:8px;align-items:center;font-size:10px;letter-spacing:2px;font-weight:800;color:var(--mut)}.vb>div{height:9px;background:#041414aa;border:1px solid #ffffff22;transform:skewX(-18deg)}.vb i{display:block;height:100%;transition:width .2s}.vb b{font-size:13px;color:#fff;text-align:right;letter-spacing:0}.hp i{background:linear-gradient(90deg,#ff5a4a,#ff8f7a)}.fd i{background:linear-gradient(90deg,#e8a030,#ffd070)}.wt i{background:linear-gradient(90deg,#2ab0e0,#7fe3ff)}.st i{background:linear-gradient(90deg,#4ff0d0,#b8fff0)}.vb.low{animation:lw .6s infinite alternate}@keyframes lw{to{color:var(--red)}}
#hot{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:flex;gap:6px}.slot{position:relative;width:62px;height:62px;border:1px solid #4ff0d044;background:#041414b0;display:flex;align-items:center;justify-content:center;transform:skewX(-8deg)}.slot svg{width:36px;height:36px;transform:skewX(8deg);fill:none;stroke:#cfeee8;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.slot.on{border-color:var(--acc);background:#0c3a36cc;box-shadow:0 0 14px #4ff0d055}.slot.on svg{stroke:var(--acc)}.slot kbd{position:absolute;top:2px;left:5px;font-size:10px;color:var(--mut);transform:skewX(8deg)}.slot em{position:absolute;right:4px;bottom:2px;font-style:normal;font-size:12px;font-weight:800;transform:skewX(8deg)}
#ammo{position:absolute;right:20px;bottom:16px;text-align:right;display:none}#ammo b{font-size:44px;font-weight:900;letter-spacing:2px;line-height:1}#ammo span{display:block;font-size:12px;color:var(--mut);letter-spacing:2px}
#build{position:absolute;left:50%;bottom:92px;transform:translateX(-50%);text-align:center;display:none;background:#041414b8;border:1px solid #4ff0d055;padding:8px 18px}#btier{font-size:11px;letter-spacing:3px;color:var(--amb);font-weight:800}#bpiece{font-size:20px;font-weight:800;letter-spacing:2px}#bcost{font-size:13px;color:var(--mut)}#bcost.bad{color:var(--red)}#bhelp{font-size:11px;color:#8fb5b0aa;margin-top:3px}
#keys{position:absolute;left:50%;top:76px;transform:translateX(-50%);font-size:11px;color:#cfeee8cc;letter-spacing:1px;text-align:center;background:#04141488;padding:3px 12px;animation:cl 14s forwards}
/* misc overlays */
#cinema{position:fixed;inset:0;z-index:25;pointer-events:none}.bar{position:absolute;left:0;right:0;height:11vh;background:#000}.bar.t{top:0}.bar.b{bottom:0}#cintxt{position:absolute;left:50%;bottom:16vh;transform:translateX(-50%);text-align:center;font-size:clamp(16px,2.2vw,26px);letter-spacing:.2em;font-weight:700;text-shadow:0 2px 14px #000;width:80vw;line-height:1.6;color:#eafffb}#cintxt small{display:block;font-size:.55em;letter-spacing:.3em;color:var(--acc);margin-bottom:6px}
#flash{position:fixed;inset:0;z-index:24;background:#fff;opacity:0;pointer-events:none}
#dead{position:fixed;inset:0;z-index:40;background:#200404cc;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}#dead h2{font-size:56px;letter-spacing:.3em;color:var(--red);text-shadow:0 0 30px #ff2a1a}#dead p{color:#ffcdc7}
#pause{position:fixed;inset:0;z-index:35;background:#02080acc;display:flex;align-items:center;justify-content:center}.card{display:flex;flex-direction:column;gap:12px;align-items:center;padding:28px 40px}.card h2{letter-spacing:.4em}
#lock{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:22;font-weight:900;letter-spacing:.4em;font-size:22px;background:#041414cc;padding:14px 30px;border:1px solid var(--acc);color:var(--acc);pointer-events:none}
#modal{position:fixed;inset:0;z-index:50;background:#02080acc;display:flex;align-items:center;justify-content:center;padding:14px}.mbox{position:relative;width:min(980px,100%);max-height:92vh;overflow:auto;background:#07181af0;border:1px solid var(--line);padding:22px 24px;box-shadow:0 20px 60px #000}.mx{position:absolute;top:10px;right:12px;width:34px;height:34px;background:#ffffff14;font-size:15px}.mbox h2{letter-spacing:.3em;font-size:18px;color:var(--acc);margin-bottom:12px}
.craft{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;margin-top:10px}.rc{border:1px solid var(--line);padding:10px 12px;background:#04141499;display:flex;flex-direction:column;gap:6px}.rc b{font-size:15px}.rc small{color:var(--mut)}
#tip{position:fixed;z-index:60;background:#000d;border:1px solid var(--acc);padding:4px 10px;font-size:12px;pointer-events:none}
/* wallet modal from kungfu (restyled) */
.wm{position:fixed;inset:0;z-index:80;background:#02080acc;display:flex;align-items:center;justify-content:center;padding:14px}.wm-box{background:#07181a;border:1px solid var(--line);padding:22px;max-width:420px;width:100%;position:relative}.wm-box h3{margin:0 0 4px;font-size:20px;color:var(--acc);letter-spacing:3px}.wm-sub,.wm-note{color:var(--mut);font-size:13px}.wm-x{position:absolute;top:10px;right:12px;width:34px;height:34px;background:#ffffff18}
.wm-row{display:flex;align-items:center;gap:12px;padding:12px;background:#ffffff0f;margin:8px 0;color:#fff;text-decoration:none;font-weight:700;width:100%;cursor:pointer}.wm-ic{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-style:normal;color:#111;border-radius:6px}.wm-nm{flex:1;text-align:left}.wm-st{font-size:13px;color:var(--mut)}.wm-st.ok{color:var(--acc)}.wm-guest{width:100%;margin-top:8px}
@media (max-width:760px){#topl{width:200px}#vit{width:200px}.slot{width:44px;height:44px}.slot svg{width:26px;height:26px}#chatlog{display:none}.srv{grid-template-columns:30px 1fr 70px 60px}}

#boot{position:fixed;inset:0;z-index:99;background:radial-gradient(ellipse at 50% 40%,#0a1d1d,#02080a);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#bff;font-family:inherit}#boot b{font-size:44px;letter-spacing:.35em}#boot small{letter-spacing:.6em;color:#5fd;opacity:.8}#boot .bb{width:min(380px,70vw);height:4px;background:#0c2a2a;margin-top:18px}#boot .bb i{display:block;height:100%;width:0;background:#5fffe0;box-shadow:0 0 12px #5fffe0;transition:width .15s}#boot span{font-size:13px;opacity:.7}
/* ---- v3: weapons, guidance, defense ---- */
.slot{width:56px!important;height:56px!important}.slot.lock{opacity:.38;filter:grayscale(1)}.slot em{font-size:10px}
#mis .how{margin-top:6px;font-size:11px;line-height:1.35;color:#bfe9e2;border-top:1px solid #4ff0d033;padding-top:5px}
#cross.ads i{width:6px;height:6px;left:-3px;top:-3px;background:#ff5a4a}
#hintc{position:absolute;left:50%;bottom:104px;transform:translate(-50%,12px);max-width:560px;background:#031618e6;border:1px solid #4ff0d088;border-left:4px solid var(--acc);padding:9px 16px 10px;font-size:14px;line-height:1.4;opacity:0;pointer-events:none;transition:.25s;text-align:left;box-shadow:0 6px 24px #0008}
#hintc.on{opacity:1;transform:translate(-50%,0)}#hintc small{display:block;font-size:9px;letter-spacing:3px;font-weight:800;color:var(--acc);margin-bottom:2px}
kbd{display:inline-block;min-width:18px;padding:0 5px;margin:0 2px;border:1px solid #4ff0d0aa;border-bottom-width:2px;border-radius:3px;background:#052a2a;color:#d6fff7;font:700 11px/16px inherit;text-align:center}
#wps{position:absolute;inset:0;pointer-events:none;overflow:hidden;transition:opacity .2s}
.wp{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;text-shadow:0 1px 3px #000,0 0 6px #000}
.wp i{width:14px;height:14px;transform:rotate(45deg);border:2px solid var(--acc);background:#04141499;box-shadow:0 0 10px #4ff0d0aa}
.wp b{font-size:10px;letter-spacing:2px;font-weight:800;color:#d6fff7;margin-top:6px;white-space:nowrap}.wp small{font-size:10px;color:#9fd8d0;letter-spacing:1px}
.wp.obj i{border-color:#ffd25a;box-shadow:0 0 12px #ffd25acc;background:#ffd25a33}.wp.obj b{color:#ffe9a8}.wp.post i{border-color:#7fffe0}
.wp.edge{opacity:.85}
#threat{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none}
.th{position:absolute;left:0;top:0;width:0;height:0}.th i{position:absolute;left:-14px;top:-190px;width:0;height:0;border-left:14px solid transparent;border-right:14px solid transparent;border-bottom:30px solid #ff9a3a;filter:drop-shadow(0 0 6px #000);opacity:.55}
.th.tell i{border-bottom-color:#ff3a3a;opacity:1;animation:thp .28s infinite alternate;top:-200px;border-left-width:18px;border-right-width:18px;border-bottom-width:38px;left:-18px}
@keyframes thp{to{transform:scale(1.25);opacity:.6}}
#lookt{position:absolute;left:50%;top:56%;transform:translate(26px,-50%);max-width:260px;background:#031618d8;border:1px solid #4ff0d055;padding:7px 12px;font-size:12px;line-height:1.35;opacity:0;pointer-events:none;transition:.12s}
#lookt.on{opacity:1}#lookt b{display:block;font-size:13px;letter-spacing:1.5px;color:#d6fff7}#lookt small{display:block;font-size:10px;letter-spacing:1.5px;color:var(--acc);margin:1px 0 3px}#lookt span{color:#a6d7d0}
#popup{position:absolute;left:50%;top:38%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:2px;pointer-events:none}
.pop{font-size:30px;font-weight:900;letter-spacing:6px;color:#fff;text-shadow:0 0 14px #4ff0d0,0 2px 4px #000;animation:popu .9s forwards}.pop.gold{color:#ffe27a;text-shadow:0 0 16px #ffb020,0 2px 4px #000}.pop.red{color:#ff5a4a;text-shadow:0 0 16px #f00,0 2px 4px #000}
@keyframes popu{0%{transform:scale(.6);opacity:0}15%{transform:scale(1.15);opacity:1}100%{transform:translateY(-26px) scale(1);opacity:0}}
.vb.low{animation:lowp .5s infinite alternate}@keyframes lowp{to{filter:brightness(1.8)}}
.gd{font-size:13px;line-height:1.5}.gd h4{margin:12px 0 4px;letter-spacing:2px;font-size:12px;color:var(--acc)}.gd p{margin:0 0 8px}
.gcols{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media (max-width:760px){.gcols{grid-template-columns:1fr}}
.wt{width:100%;border-collapse:collapse;margin-bottom:10px}.wt th,.wt td{padding:7px 10px;border-bottom:1px solid #4ff0d022;text-align:left}.wt th{font-size:10px;letter-spacing:2px;color:var(--mut)}.wt small{display:block;color:#8fbab4;font-size:11px}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width:760px){.cards{grid-template-columns:1fr}}
.cc{border:1px solid #4ff0d033;background:#04181a99;padding:10px 14px}.cc h4{margin:0}.cc small{color:#ff9a7a;letter-spacing:1px}.cc ul{margin:2px 0 0 18px;padding:0}.cc li{margin-bottom:3px}

@media (max-width:1500px){.slot{width:48px!important;height:48px!important}.slot svg{width:28px;height:28px}#vit{width:215px}#hot{gap:4px}}
#keys{max-width:640px;font-size:10px!important;opacity:.75}

/* ===== v4 HUD: lighter glass panels, degree compass, server panel, compact hotbar and vitals ===== */
:root{--pn:rgba(10,18,20,.5);--pnb:1px solid rgba(255,255,255,.14)}
#compass{top:8px;width:min(640px,56vw);height:46px;overflow:visible;border:0;background:none;-webkit-mask:none;mask:none}
#compass #ctape{position:absolute;top:0;left:0;width:100%;height:46px;overflow:hidden;white-space:normal;font-size:10px;color:#e6f6f2;-webkit-mask:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);background:linear-gradient(180deg,rgba(8,16,18,.55),rgba(8,16,18,0));border-top:1px solid rgba(255,255,255,.18)}
#ctape span{position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;font-size:10px;font-weight:700;letter-spacing:.5px}
#ctape span u{display:block;width:1px;background:#e6f6f2cc;height:5px}#ctape span.tb u{height:9px}#ctape span.c8 u{height:11px;width:1.5px}#ctape span.c4 u{height:13px;width:2px;background:#fff}
#ctape span em{font-style:normal;margin-top:1px;color:#cfe3df;font-variant-numeric:tabular-nums}#ctape span.c4 em{font-size:14px;font-weight:900;color:#fff;letter-spacing:1px}#ctape span.c8 em{font-size:11px;color:#bfe2db}
#ctape span:first-child u{background:var(--amb)}#ctape span:first-child em{color:var(--amb)}
#compass i.cp{position:absolute;left:50%;top:-3px;width:0;height:0;border:5px solid transparent;border-top:7px solid var(--acc);transform:translateX(-50%);background:none}
#chead{position:absolute;left:50%;top:47px;transform:translateX(-50%);font-size:12px;font-weight:800;letter-spacing:2px;background:var(--pn);border:var(--pnb);padding:0 10px;border-radius:10px;font-variant-numeric:tabular-nums}
.cwp{position:absolute;top:27px;transform:translateX(-50%);display:flex;align-items:center;gap:4px;white-space:nowrap;font-size:9px;font-weight:900;letter-spacing:1px;text-shadow:0 1px 2px #000}
.cwp i{width:9px;height:9px;transform:rotate(45deg);border:2px solid #ffd25a;background:#ffd25a44}.cwp.obj b{color:#ffe9a8}
.cwp.apx i{border-color:#ff6a5a;background:#c040ff66;box-shadow:0 0 8px #ff3b30}.cwp.apx b{color:#ffb0a0}.cwp.edge{opacity:.8}
#bossbar{position:absolute;left:50%;top:76px;transform:translateX(-50%);width:min(560px,50vw);display:none;text-align:center}#bossbar.on{display:block}
#bossbar .bn{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;letter-spacing:3px;text-shadow:0 1px 3px #000}#bossbar .bn b{font-size:17px;letter-spacing:5px;color:#fff}#bossbar .bn span{color:#d49aff;font-weight:800}
#bossbar .bb{height:10px;background:rgba(8,12,14,.6);border:1px solid rgba(255,255,255,.3);border-radius:2px;overflow:hidden}#bossbar .bb i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#8a2bff,#d46aff);transition:width .25s}#bossbar.enr .bb i{background:linear-gradient(90deg,#ff3b30,#ff8a5a)}
#bossbar .bs{margin-top:4px;font-size:11px;letter-spacing:3px;font-weight:800;color:#cfe3df;text-shadow:0 1px 3px #000}#bossbar.tell .bs{color:#ff5a4a;animation:lw .35s infinite alternate}
#topl{top:12px}#topl #zone{color:#d6fff7}#mis{background:var(--pn);border:var(--pnb);border-left:3px solid var(--acc);border-radius:6px;backdrop-filter:blur(5px)}
#keys{top:62px}
#topr{top:10px;right:14px;text-align:left}
#srv{width:240px;background:var(--pn);border:var(--pnb);border-radius:8px;padding:10px 12px;backdrop-filter:blur(6px);box-shadow:0 4px 18px #0006}
#srv .srow.top{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:6px}
#online{margin:0;font-size:11px;letter-spacing:2px;line-height:1}#online b{display:block;font-size:36px;font-weight:900;color:#fff;letter-spacing:0;font-variant-numeric:tabular-nums}#online span{color:var(--acc);font-weight:800;font-size:10px;letter-spacing:3px}
#srv #clock{background:none;border:0;padding:0;align-items:flex-end;gap:1px}#srv #ctime{font-size:20px;letter-spacing:1px}#srv #cday,#srv #cwx{font-size:9px;letter-spacing:2px;color:#9bbdb7}
#srv .kv{display:flex;justify-content:space-between;font-size:11px;letter-spacing:2px;padding:3px 0;border-top:1px solid rgba(255,255,255,.1)}#srv .kv span{color:#9bbdb7}#srv .kv b{color:#fff;font-weight:800;letter-spacing:1px;font-variant-numeric:tabular-nums}#srv .kv b.hot{color:#ff7a6a;animation:lw .6s infinite alternate}
#srv .lbh{margin-top:6px;font-size:9px;letter-spacing:3px;color:var(--acc);font-weight:800;border-top:1px solid rgba(255,255,255,.1);padding-top:6px}
#lbl>div{display:grid;grid-template-columns:14px 10px 1fr auto;gap:6px;align-items:center;font-size:12px;padding:2px 0}#lbl em{font-style:normal;color:#9bbdb7;font-weight:800}#lbl i{width:8px;height:8px;border-radius:50%}#lbl span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#lbl b{font-variant-numeric:tabular-nums;color:#fff}#lbl .dim{display:block;color:#7f9c97;font-size:11px}
#me{display:flex;justify-content:space-between;margin-top:5px;padding-top:5px;border-top:1px dashed rgba(255,255,255,.14);font-size:11px;color:#cfe3df}#me b{color:var(--amb);letter-spacing:1px;font-size:11px}
#br{position:absolute;right:14px;bottom:14px;width:222px;display:flex;flex-direction:column;gap:6px}
#buffs{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end}#buffs div{background:var(--pn);border:var(--pnb);border-radius:10px;padding:1px 9px;font-size:10px;font-weight:800;letter-spacing:1.5px;color:#9dffd8}#buffs div.tmp{color:#e0b0ff}#buffs b{color:#fff}#buffs i{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:5px}
#res{display:flex;flex-wrap:wrap;gap:4px;margin:0;justify-content:flex-end}#res div{background:var(--pn);border:var(--pnb);border-radius:4px;padding:1px 7px;font-size:12px;min-width:0;gap:6px;display:flex;align-items:center}#res div span{font-size:9px;letter-spacing:1px;color:#9bbdb7}
#vit{position:static;width:100%;gap:4px;background:var(--pn);border:var(--pnb);border-radius:8px;padding:8px 10px;backdrop-filter:blur(5px)}
.vb{grid-template-columns:48px 1fr 24px;gap:6px;font-size:9px;letter-spacing:1.5px}.vb>div{height:6px;transform:none;border-radius:3px;background:rgba(255,255,255,.12);border:0;overflow:hidden}.vb b{font-size:12px}
#hot{bottom:12px;gap:4px;padding:5px;background:var(--pn);border:var(--pnb);border-radius:10px;backdrop-filter:blur(5px)}
.slot{width:46px!important;height:46px!important;transform:none;border-radius:7px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05)}
.slot svg{width:26px!important;height:26px!important;transform:none}.slot kbd{transform:none;font-size:9px;top:2px;left:4px}.slot em{transform:none;font-size:10px;right:3px;bottom:1px}
.slot.on{border-color:#fff;background:rgba(255,255,255,.2);box-shadow:0 0 12px #4ff0d066}.slot.on svg{stroke:#fff}.slot.lock{opacity:.4}
#ammo{right:auto;left:calc(50% + 290px);bottom:16px;text-align:left}#ammo b{font-size:28px;text-shadow:0 1px 4px #000}#ammo span{font-size:10px}
#chatlog{bottom:60px;left:14px}#chatrow{bottom:16px;left:14px}
#hintc{bottom:84px}#build{bottom:84px}
.toast.gold{border-color:#ffd25a;color:#ffe9a8}
.tierh{grid-column:1/-1;display:flex;gap:12px;align-items:baseline;margin-top:8px;border-bottom:1px solid #4ff0d044;padding-bottom:3px}.tierh b{letter-spacing:3px;font-size:13px;color:var(--acc)}.tierh.t3 b{color:#d49aff}.tierh.t2 b{color:var(--amb)}.tierh span{color:var(--mut);font-size:12px}
.gintro{margin:0 0 6px;color:#cfe3df}.cc.boss{border-color:#c070ff88;background:#1a0f2a99;grid-column:1/-1}.cc .loot{color:#bff8d8;margin-top:6px;border-top:1px dashed #4ff0d044;padding-top:5px}
@media (max-width:1500px){.slot{width:44px!important;height:44px!important}#vit{width:100%}#hot{gap:3px}}
@media (max-width:1100px){#srv .lbh,#lbl,#me{display:none}#srv{width:190px}#compass{width:46vw}#ammo{left:calc(50% + 270px)}}
@media (max-width:760px){#srv{display:none}#br{width:180px}.slot{width:34px!important;height:34px!important}.slot svg{width:20px!important;height:20px!important}#ammo{display:none!important}}

/* ===== v6: progression HUD + panels ===== */
#pxui{position:fixed;inset:0;pointer-events:none;z-index:12}
#xpw{position:absolute;left:50%;bottom:92px;transform:translateX(-50%);width:min(420px,46vw);display:flex;flex-direction:column;gap:3px}
#xpl{display:flex;align-items:baseline;gap:10px;font-size:11px;letter-spacing:2px;color:var(--mut);text-shadow:0 1px 4px #000}
#xpl b{font-size:18px;color:#ffe18a;letter-spacing:0;min-width:24px;text-align:center;background:#1a1405cc;border:1px solid #ffd25a88;padding:0 7px;border-radius:3px}
#xpt{margin-left:auto;color:#ffe18a;font-weight:800}
#xpb{height:6px;background:#041414cc;border:1px solid #ffffff22;overflow:hidden;border-radius:3px}#xpi{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffb347,#ffe18a);box-shadow:0 0 10px #ffd25a;transition:width .5s}
#xpfeed{position:absolute;left:50%;bottom:122px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:2px;font-size:12px;font-weight:800;letter-spacing:2px;color:#ffe18a;text-shadow:0 1px 6px #000}
#xpfeed div{animation:xpf 2.6s ease-out forwards}@keyframes xpf{0%{opacity:0;transform:translateY(8px)}12%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0;transform:translateY(-10px)}}
#wname{position:absolute;right:20px;bottom:78px;text-align:right;font-weight:800;letter-spacing:2px;font-size:13px;text-shadow:0 1px 6px #000;opacity:0;transition:opacity .3s}
#wname small{display:block;font-size:10px;color:var(--mut);letter-spacing:2px;font-weight:600}
#sovbar{position:absolute;left:50%;top:70px;transform:translateX(-50%);width:min(620px,70vw);display:none;text-align:center}
#sovbar .bn{display:flex;justify-content:space-between;font-size:13px;letter-spacing:5px;font-weight:900;color:#ffb27a;text-shadow:0 0 12px #ff5a14;margin-bottom:4px}#sovbar .bn span{color:#d9a8ff;font-size:11px;letter-spacing:3px}
#sovbar .bb{position:relative;height:12px;background:#12060acc;border:1px solid #ff7a3a99;box-shadow:0 0 16px #ff5a1455;border-radius:2px;overflow:hidden}#sovbar .bb i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#b0200c,#ff7a2a,#ffd08a);transition:width .25s}
#sovbar .bs{margin-top:4px;font-size:11px;letter-spacing:2px;color:#ffd0b0;min-height:14px}
#lorepop{position:absolute;right:24px;top:120px;width:300px;background:#05111cf0;border:1px solid #7fb4ff88;border-left:4px solid #7fb4ff;padding:10px 14px;opacity:0;transform:translateX(30px);transition:all .4s;font-size:13px;line-height:1.45}#lorepop.on{opacity:1;transform:none}
#lorepop small{display:block;font-size:9px;letter-spacing:3px;color:#9fc4ff;font-weight:800;margin-bottom:2px}#lorepop b{display:block;margin-bottom:4px;color:#e9f2ff}#lorepop p{color:#c3d6ee;margin:0}
#lvfx{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%);text-align:center;opacity:0;font-weight:900}#lvfx.on{animation:lvf 3.2s ease-out}
#lvfx b{display:block;font-size:56px;letter-spacing:12px;color:#ffe18a;text-shadow:0 0 30px #ffb347,0 0 80px #ff8a1a}#lvfx small{display:block;font-size:14px;letter-spacing:5px;color:#fff;margin-top:6px;text-shadow:0 1px 8px #000}
#lvfx .ring{position:absolute;left:50%;top:50%;width:90px;height:90px;margin:-45px;border:3px solid #ffd25a;border-radius:50%;animation:lvr 2s ease-out}#lvfx .r2{animation-delay:.25s;border-color:#ffffff}
@keyframes lvf{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}10%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}18%{transform:translate(-50%,-50%) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-62%) scale(1)}}
@keyframes lvr{0%{transform:scale(.3);opacity:.9}100%{transform:scale(9);opacity:0}}
.mbox .tabs{flex-wrap:wrap}.mbox .tabs button.on{background:var(--acc);color:#032420}
.mbox .bar{position:relative;left:auto;right:auto;height:10px;background:#041414;border:1px solid #ffffff22;border-radius:3px;overflow:hidden}.mbox .bar.sm{height:6px}.mbox .bar i{display:block;height:100%;background:linear-gradient(90deg,#4ff0d0,#ffe18a)}
.mbox .plv{display:flex;gap:18px;align-items:center;margin-bottom:12px}.mbox .plv .big{width:92px;height:92px;border:2px solid #ffd25a;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#1a1405cc;box-shadow:0 0 24px #ffb34755}.mbox .plv .big b{font-size:42px;color:#ffe18a;line-height:1}.mbox .plv .big small{letter-spacing:3px;font-size:10px;color:var(--mut)}
.mbox .pbar{flex:1}.mbox .pt{display:flex;justify-content:space-between;font-size:12px;color:var(--mut);margin:4px 0}.mbox .gd{color:#ffe18a}
.hearth{border:1px solid #ffffff22;padding:9px 12px;margin:10px 0;font-size:13px;color:var(--mut);background:#0a1a1caa}.hearth b{color:#ffa860;letter-spacing:2px;margin-right:6px}.hearth.on{border-color:#ffa86088;color:#ffe7cf;background:#2a1608aa}
.pcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;margin:12px 0}.pcard{border:1px solid var(--line);padding:10px 12px;background:#04141499;cursor:pointer;display:flex;flex-direction:column;gap:3px}.pcard:hover{border-color:var(--acc);background:#0a2a2a99}.pcard b{font-size:13px;letter-spacing:1px;color:var(--acc2)}.pcard span{font-size:18px;font-weight:800;color:#fff}.pcard small{color:var(--mut);font-size:11px}
.mbox h3{font-size:12px;letter-spacing:3px;color:var(--acc);text-transform:uppercase;margin:14px 0 8px}.mbox h3 small{color:var(--mut);letter-spacing:1px;text-transform:none}
.mile{display:flex;flex-direction:column;gap:3px}.mile>div{display:flex;gap:10px;align-items:flex-start;padding:5px 8px;font-size:13px;color:var(--mut);border-left:2px solid #ffffff22}.mile>div i{font-style:normal;min-width:20px;text-align:center;color:#8fb5b0;font-weight:800}.mile>div.dn{color:#e6fbf7;border-left-color:var(--acc)}.mile>div.dn i{color:var(--acc)}.mile small{display:block;color:#ffe18a}
.branches{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}.branch{border:1px solid var(--bc,#1c4a48);border-top:3px solid var(--bc,#4ff0d0);background:#04141499;padding:10px}.branch h4{margin:0 0 8px;color:var(--bc);letter-spacing:3px;font-size:13px}
.node{display:grid;grid-template-columns:1fr auto;gap:4px 8px;padding:6px 0;border-top:1px solid #ffffff12;align-items:center}.node b{font-size:13px}.node small{display:block;color:var(--mut);font-size:11px;line-height:1.3}.node .btn{grid-column:1/3;padding:5px 10px;font-size:11px}
.pips{display:flex;gap:3px}.pips i{width:10px;height:10px;border:1px solid #ffffff55;transform:rotate(45deg)}.pips i.on{background:var(--bc,#4ff0d0);border-color:var(--bc,#4ff0d0);box-shadow:0 0 6px var(--bc,#4ff0d0)}
.btn.sm{padding:6px 12px;font-size:11px;letter-spacing:1.5px}.btn[disabled]{opacity:.38;pointer-events:none;filter:grayscale(.6)}
.mlist{display:flex;flex-direction:column;gap:6px}.mrw,.chr{display:grid;grid-template-columns:170px 100px 1fr 190px;gap:10px;align-items:center;padding:6px 8px;border:1px solid #ffffff14;background:#04141488;font-size:13px}.mrw span,.mrw em{color:var(--mut);font-style:normal;font-size:12px}.chr{grid-template-columns:1fr 160px 80px 200px}.chr small{display:block;color:var(--mut)}.chr.dn{opacity:.6}.chr em{font-style:normal;color:#ffe18a;font-size:12px}
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px}.tt{border:1px solid #ffffff1a;padding:8px 10px;background:#04141488;opacity:.55}.tt.got{opacity:1;cursor:pointer;border-color:#4ff0d066}.tt.act{border-color:#ffd25a;background:#2a2008aa}.tt b{display:block;font-size:13px}.tt small{color:var(--mut);font-size:11px}.tt .sw{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:6px;vertical-align:middle}
.lore{display:flex;flex-direction:column;gap:6px}.lg{border-left:3px solid #7fb4ff;padding:6px 10px;background:#05111c99}.lg p{margin:3px 0 0;font-size:13px;color:#c3d6ee;line-height:1.45}.lg.lk{opacity:.4;border-left-color:#ffffff33}
.rc.dn{opacity:.65}.rc .tag{font-style:normal;font-size:10px;letter-spacing:2px;background:#ffd25a;color:#241a00;padding:1px 6px;margin-left:6px}.rc .lk,.rc .no{color:#ff9a7a}.rc .ok{color:var(--acc)}
#mapc{width:min(640px,86vw);height:auto;aspect-ratio:1;display:block;margin:8px auto;border:1px solid var(--line);image-rendering:auto}.mlegend{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;font-size:11px;color:var(--mut)}.mlegend i{display:inline-block;width:9px;height:9px;margin-right:5px}
#lore-hint,.buff{position:fixed}
#rested{position:absolute;left:16px;top:210px}
@media (max-width:760px){.mrw,.chr{grid-template-columns:1fr 1fr}#xpw{bottom:70px}}
#sovbar.on{display:block}#sovbar.tell .bb{box-shadow:0 0 22px #ff3b30aa;border-color:#ff3b30}
#restpill{position:absolute;left:16px;top:200px;background:#2a1608dd;border:1px solid #ffa86088;border-left:4px solid #ffa860;padding:5px 10px;font-size:12px;letter-spacing:1px;display:none;color:#ffe7cf}#restpill.on{display:block}#restpill b{color:#ffa860;letter-spacing:3px;margin-right:6px}#restpill small{display:block;font-size:10px;color:#e9c9a8;letter-spacing:1px}
#hintc{bottom:150px!important}#xpw{bottom:84px}#xpfeed{bottom:120px}#mapc{width:min(640px,86vw,66vh)}

.dn{position:fixed;z-index:60;pointer-events:none;font:800 20px/1 'Segoe UI',Arial,sans-serif;color:#fff;text-shadow:0 0 6px #19d9ff,0 1px 2px #000;transform:translate(-50%,-50%);animation:dnup .85s ease-out forwards}.dn.h{color:#ffe14a;font-size:26px;text-shadow:0 0 8px #ff9a1a,0 1px 2px #000}.dn.k{color:#ff6a5a;font-size:30px;text-shadow:0 0 10px #ff2a1a,0 1px 2px #000}@keyframes dnup{0%{opacity:0;transform:translate(-50%,-30%) scale(.6)}15%{opacity:1;transform:translate(-50%,-60%) scale(1.25)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),-260%) scale(1)}}

#wavetag{position:absolute;top:74px;left:50%;transform:translateX(-50%);padding:5px 16px;border:1px solid #ff5a3a99;background:#1a0a0acc;color:#ffb09a;font:700 12px/1 system-ui,sans-serif;letter-spacing:.2em;border-radius:3px;opacity:0;transition:opacity .4s;pointer-events:none;text-shadow:0 0 8px #ff3a1a}#wavetag.on{opacity:1}#wavetag.sg{border-color:#ffd04a;color:#ffe9a0;text-shadow:0 0 10px #ffa010}#wavetag.ok{border-color:#7dff9a99;color:#b8ffc8;text-shadow:0 0 8px #3aff7a}