:root{--ac:#ffd23a;--ac2:#ff9f1c;--pu:#7a3cff;--bg:#0c1224;--card:rgba(14,20,44,.86);--tx:#f3f6ff;--dim:#9aa6cf;--sk:-7deg}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden;background:#0c1224;color:var(--tx);font-family:"Segoe UI",system-ui,-apple-system,Roboto,sans-serif;user-select:none;-webkit-user-select:none}
#c{position:fixed;inset:0;width:100%;height:100%;display:block}
.hidden{display:none!important}
.layer{position:fixed;inset:0}
.brand{font-size:58px;font-weight:900;font-style:italic;letter-spacing:3px;line-height:1;text-shadow:0 4px 0 #2a1c6b,0 0 34px #7a3cff99;position:absolute;left:5vw;top:3.5vh;z-index:2}
.brand span{color:var(--ac);margin-right:8px}
.brand.big{position:static;font-size:84px}

/* ---------- lobby (stile Fortnite) ---------- */
#menu{background:radial-gradient(ellipse 55% 75% at 50% 58%,transparent 35%,rgba(10,24,80,.55) 75%,rgba(8,14,50,.92) 100%),linear-gradient(0deg,rgba(6,10,40,.75) 0%,transparent 25%,transparent 80%,rgba(6,10,40,.6) 100%);display:block;padding:0}
#topbar{position:absolute;left:0;right:0;top:0;height:64px;display:flex;align-items:center;gap:28px;padding:0 28px;background:linear-gradient(180deg,rgba(6,12,44,.95),rgba(6,12,44,.55));border-bottom:1px solid #ffffff14;z-index:5}
#topbar .logo{font-size:28px;font-weight:900;font-style:italic;letter-spacing:1px;text-shadow:0 3px 0 #000a}#topbar .logo span{color:var(--ac);margin-right:6px}
#tabs{display:flex;gap:4px;height:100%}
#tabs button{background:none;border:0;color:#c9d3ff;font-family:inherit;font-weight:900;font-size:17px;letter-spacing:1px;padding:0 18px;cursor:pointer;position:relative;height:100%;text-transform:uppercase}
#tabs button:hover{color:#fff}#tabs button.on{color:#fff}#tabs button.on:after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:4px;background:var(--ac);border-radius:2px 2px 0 0}
#topbar.nologin #tabs,#topbar.nologin #who-box{visibility:hidden}
#who-box{margin-left:auto;display:flex;align-items:center;gap:12px}
#who{font-size:16px;font-weight:800;text-align:right}#who small{display:block;color:var(--dim);font-weight:500;font-size:11px}
.screen{display:none}.screen.on{display:flex}
.card{background:var(--card);border:1px solid #ffffff1c;border-radius:14px;padding:20px 22px;box-shadow:0 16px 44px #0009;backdrop-filter:blur(6px)}
.card h2{font-size:26px;margin-bottom:12px;font-style:italic;font-weight:900;letter-spacing:1px}.card h3{margin:12px 0 8px;color:var(--ac);font-style:italic}
.login-card{position:absolute;left:6vw;top:50%;transform:translateY(-50%);width:min(420px,90vw);flex-direction:column;gap:10px}
#scr-settings{position:absolute;left:50%;top:calc(50% + 32px);transform:translate(-50%,-50%);width:min(620px,94vw);flex-direction:column;gap:10px;max-height:calc(100vh - 110px)}
#scr-play{position:absolute;inset:64px 0 0 0;pointer-events:none}
#scr-play>*{pointer-events:auto}
.fpanel{background:linear-gradient(160deg,rgba(28,44,120,.88),rgba(10,16,52,.9));border:1px solid #ffffff22;border-radius:8px;padding:16px 18px;box-shadow:0 12px 40px #0008;display:flex;flex-direction:column;gap:10px}
.fpanel h4{font-size:15px;font-weight:900;letter-spacing:3px;color:#fff;font-style:italic}.fpanel h5{font-size:12px;letter-spacing:3px;color:var(--dim);margin-top:6px}
#party-panel{position:absolute;left:24px;bottom:24px;width:320px}
#party-panel .wide{width:100%}
#in-code{text-transform:uppercase;text-align:center;letter-spacing:6px;font-size:20px;width:100%}
.code-box{display:flex;align-items:center;gap:10px;background:#0a0f2a;border-radius:8px;padding:8px 12px}.code-box b{font-size:28px;letter-spacing:6px;color:var(--ac);flex:1}
#party-members{list-style:none;display:flex;flex-direction:column;gap:5px;max-height:180px;overflow:auto}
#party-members li{background:#ffffff12;border-radius:6px;padding:7px 10px;display:flex;gap:6px;align-items:center;font-weight:700}
#party-cfg{display:flex;flex-direction:column;gap:6px}
#play-card{position:absolute;right:28px;bottom:28px;width:360px;display:flex;flex-direction:column;gap:10px}
.mode-card{background:linear-gradient(135deg,#2a6dff,#5a2dd8);border-radius:6px;padding:14px 16px;display:flex;flex-direction:column;gap:6px;box-shadow:0 10px 30px #0008;border:2px solid #ffffff40}
.mode-card small{font-size:11px;letter-spacing:3px;color:#dfe6ff;font-weight:800}.mode-card b{font-size:22px;font-style:italic;font-weight:900;line-height:1.05}.mode-card>span{font-size:13px;color:#e8ecff}
.mode-card label{color:#e8ecff}.mode-card label b{font-size:14px;font-style:normal;color:var(--ac)}
#solo-opts{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.playbtn{background:linear-gradient(180deg,#ffe84a,#ffc21a);color:#1a1200;border:0;border-radius:6px;font-family:inherit;font-weight:900;font-style:italic;font-size:44px;letter-spacing:2px;padding:14px 0;cursor:pointer;box-shadow:0 6px 0 #b07800,0 12px 30px #0009;transition:.08s}
.playbtn:hover{filter:brightness(1.08);transform:translateY(-2px)}.playbtn:active{transform:translateY(3px);box-shadow:0 2px 0 #b07800}
.playbtn:disabled{background:#4a5170;color:#c0c6e0;box-shadow:0 6px 0 #2a2f45;cursor:default}
#scr-locker{position:absolute;right:28px;top:96px;width:380px}
.locker{width:100%}
#skin-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.scard{background:linear-gradient(180deg,#3a4ad0,#1c2470);border:3px solid #ffffff22;border-radius:6px;padding:10px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;transition:.1s}
.scard:hover{transform:translateY(-2px)}.scard.on{border-color:var(--ac);box-shadow:0 0 0 2px #ffd23a55,0 0 22px #ffd23a55}
.scard b{font-size:18px;font-style:italic;font-weight:900;letter-spacing:1px}
.sic{width:64px;height:84px;position:relative}.sic i{position:absolute;inset:0;border-radius:40% 40% 18% 18%;background:radial-gradient(circle at 50% 18%,var(--c1) 0 15%,transparent 16%),linear-gradient(180deg,transparent 24%,var(--c1) 25% 60%,var(--c2) 61% 66%,var(--c1) 67%);opacity:.95}
.colrow{display:flex;align-items:center;gap:10px}.colrow span{flex:1;font-weight:700}
.colrow input[type=color]{width:44px;height:30px;border:0;background:none;padding:0;cursor:pointer}
.hex{width:110px;font-family:ui-monospace,Consolas,monospace;letter-spacing:1px;text-transform:uppercase;padding:7px 10px!important;font-size:14px!important}.hex.bad{border-color:#ff5a5a!important}
#col-presets{display:flex;gap:6px;flex-wrap:wrap}#col-presets i{width:24px;height:24px;border-radius:50%;border:2px solid #0008;cursor:pointer;display:block}#col-presets i:hover{transform:scale(1.15)}
#scr-top{position:absolute;right:28px;top:96px;width:380px}#scr-top .fpanel{width:100%}
#top-list{padding-left:22px;font-size:15px;line-height:1.9}#top-list li span{color:var(--dim);float:right}
#plate{position:absolute;left:50%;bottom:10vh;transform:translateX(-50%);text-align:center;pointer-events:none}
#plate b{display:block;font-size:24px;font-weight:900;font-style:italic;text-shadow:0 2px 0 #000,0 0 14px #000;letter-spacing:1px}#plate small{color:#cfd8ff;font-weight:700;text-shadow:0 1px 3px #000}
#menu-keys{position:absolute;left:50%;transform:translateX(-50%);bottom:12px;width:min(760px,50vw);font-size:11px;color:#c9d3ff;line-height:1.6;text-align:center;text-shadow:0 1px 3px #000;pointer-events:none}
input[type=text],input[type=password],input:not([type]){background:#0a0f2a;border:2px solid #ffffff20;color:var(--tx);border-radius:8px;padding:11px 13px;font-size:16px;outline:none;font-family:inherit}
input:focus{border-color:var(--ac)}
input[type=range]{width:100%;accent-color:var(--ac)}
label{font-size:14px;color:var(--dim)}label b{color:var(--ac)}
.check{display:flex;align-items:center;gap:8px;color:var(--tx);font-size:14px;flex-wrap:wrap}
.btn{background:#27316a;color:var(--tx);border:0;border-radius:5px;padding:11px 18px;font-size:15px;font-weight:900;font-style:italic;cursor:pointer;transition:.1s;font-family:inherit;box-shadow:0 4px 0 #0a0f2a}
.btn:hover{filter:brightness(1.22);transform:translateY(-2px)}.btn:active{transform:translateY(2px);box-shadow:0 1px 0 #0a0f2a}
.btn.primary{background:linear-gradient(135deg,var(--ac),var(--ac2));color:#2a1c00;box-shadow:0 4px 0 #a86a00}
.btn.accent{background:linear-gradient(135deg,#7a3cff,#4a6bff);box-shadow:0 4px 0 #2a1c8a}
.btn.small{padding:6px 12px;font-size:12px}
.tabs{display:flex;gap:6px}.tab{flex:1;background:#141b3a;border:0;color:var(--dim);padding:10px;border-radius:8px;cursor:pointer;font-weight:800;font-family:inherit}.tab.on{background:#27316a;color:var(--tx)}
.msg{min-height:16px;font-size:13px;color:#ff8a8a}.msg.ok{color:#7dff9b}
.sep{display:flex;align-items:center;gap:10px;color:var(--dim);font-size:12px;margin:2px 0}.sep:before,.sep:after{content:"";flex:1;height:1px;background:#ffffff22}
.hint{font-size:12px;color:var(--dim);line-height:1.5}.dim{color:var(--dim)}
.row{display:flex;gap:8px}.row>*{flex:1}
.seg{display:flex;gap:6px}.seg button{flex:1;background:#0a0f2a99;border:1px solid #ffffff22;color:#c9d3ff;padding:8px;border-radius:6px;cursor:pointer;font-weight:800;font-family:inherit}.seg button.on{background:var(--ac);color:#2a1c00;border-color:transparent}
.badge{background:var(--ac);color:#2a1c00;border-radius:4px;padding:1px 6px;font-size:10px;font-weight:900;margin-left:6px;vertical-align:middle}
.set-scroll{display:flex;flex-direction:column;gap:8px;max-height:58vh;overflow:auto;padding-right:6px;scrollbar-width:thin}
#keylist{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.kb{display:flex;justify-content:space-between;align-items:center;background:#141b3a;border:2px solid transparent;border-radius:8px;padding:6px 10px;cursor:pointer;font-size:13px;color:var(--tx);font-family:inherit;text-align:left}
.kb:hover{border-color:#ffffff30}.kb b{background:#0a0f2a;border-radius:6px;padding:3px 9px;color:var(--ac);min-width:52px;text-align:center;font-size:12px}
.kb.wait{border-color:var(--ac)}.kb.wait b{background:var(--ac);color:#2a1c00}
.brand{font-size:58px;font-weight:900;font-style:italic;letter-spacing:3px;line-height:1;text-shadow:0 4px 0 #2a1c6b,0 0 34px #7a3cff99}
.brand span{color:var(--ac);margin-right:8px}
.brand.big{font-size:84px}

/* loading */
#loading{background:radial-gradient(900px 500px at 50% 40%,#2a1c6b 0%,#0c1224 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;z-index:50;font-size:16px}
.loadbar{width:min(420px,80vw);height:14px;background:#ffffff18;border-radius:8px;overflow:hidden}
#loadbar-in{height:100%;width:0;background:linear-gradient(90deg,var(--ac),var(--ac2));transition:width .15s}

/* ---------- HUD ---------- */
#hud{pointer-events:none;z-index:10}
#vignette{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at center,transparent 45%,#ff1030bb 100%);transition:opacity .08s}
#labels,#dmgnums{position:absolute;inset:0;overflow:hidden}
.nl .hb{width:60px;height:6px;background:#000a;border-radius:3px;overflow:hidden;position:relative;border:1px solid #000}
.nl .hb i{position:absolute;left:0;bottom:0;height:3px;display:block}.nl .hb .s{top:0;bottom:auto;background:#52c2ff;height:3px}.nl .hb .h{background:#5cf27c;height:3px}
.dn{position:absolute;left:0;top:0;font-size:24px;font-weight:900;color:#fff;text-shadow:0 0 3px #000,2px 2px 0 #000,-2px -2px 0 #000,2px -2px 0 #000,-2px 2px 0 #000;font-style:italic;will-change:transform}
.dn.head{color:#ffd23a;font-size:30px}.dn.kill{color:#ff5a3a;font-size:34px}
#crosshair{position:absolute;left:50%;top:50%;width:0;height:0;--gap:8px}
#crosshair i{position:absolute;background:#fff;box-shadow:0 0 0 1px #000a;display:block}
#crosshair i:nth-child(1){width:2px;height:9px;left:-1px;top:calc(var(--gap) * -1 - 9px)}
#crosshair i:nth-child(2){width:2px;height:9px;left:-1px;top:var(--gap)}
#crosshair i:nth-child(3){width:9px;height:2px;top:-1px;left:calc(var(--gap) * -1 - 9px)}
#crosshair i:nth-child(4){width:9px;height:2px;top:-1px;left:var(--gap)}
#crosshair.sg i{display:none}
#crosshair.sg:before{content:"";position:absolute;width:calc(var(--r,30px)*2);height:calc(var(--r,30px)*2);left:calc(var(--r,30px)*-1);top:calc(var(--r,30px)*-1);border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #0007,inset 0 0 0 1px #0007;box-sizing:border-box}
#crosshair.sg:after,#crosshair.rl:after{content:"";position:absolute;left:-2px;top:-2px;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #000}
#crosshair.rl i:nth-child(1),#crosshair.rl i:nth-child(2){height:14px}#crosshair.rl i:nth-child(3),#crosshair.rl i:nth-child(4){width:14px}
#crosshair.melee i{opacity:.0}#crosshair.melee:after{content:"";position:absolute;left:-2px;top:-2px;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #000}
#hitm{position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px;opacity:0;transition:opacity .1s}
#hitm:before,#hitm:after{content:"";position:absolute;left:50%;top:50%;width:30px;height:3px;background:#fff;transform:translate(-50%,-50%) rotate(45deg);box-shadow:0 0 3px #000}
#hitm:after{transform:translate(-50%,-50%) rotate(-45deg)}
#hitm.head:before,#hitm.head:after{background:var(--ac)}#hitm.kill:before,#hitm.kill:after{background:#ff4a3a;height:4px}
#dmgdir{position:absolute;left:50%;top:50%;width:0;height:0}
#dmgdir i{position:absolute;left:-90px;top:-90px;width:180px;height:180px;border-radius:50%;border-top:8px solid #ff3a3acc;transition:opacity .7s;display:block;clip-path:polygon(35% 0,65% 0,65% 30%,35% 30%)}
#scope{position:absolute;inset:0;background:radial-gradient(circle at center,transparent 0,transparent 28vh,#000 28.3vh)}
#scope i{position:absolute;background:#000}#scope .h{left:0;right:0;top:50%;height:2px}#scope .v{top:0;bottom:0;left:50%;width:2px}
#compass{position:absolute;left:50%;top:10px;transform:translateX(-50%);width:340px;height:30px;overflow:hidden;background:#0008;border-radius:8px;border:1px solid #ffffff30;-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent)}
#compass-in{position:absolute;left:0;top:0;height:100%;width:3240px;transform:translateX(calc(170px - (360px + var(--deg,0) * 3px)))}
#compass-in span{position:absolute;top:5px;transform:translateX(-50%);font-size:13px;font-weight:800;color:#d6defa}#compass-in span.m{color:#fff;font-size:15px;top:3px}#compass-in span.n{color:#ff6a5a}
#compass b{position:absolute;left:50%;bottom:0;width:0;height:0;border:5px solid transparent;border-bottom-color:var(--ac);transform:translateX(-50%)}
#top-right{position:absolute;right:16px;top:14px;width:200px;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.pills{display:flex;gap:6px}
.pill{background:#000a;border-radius:8px;padding:4px 10px;font-weight:800;font-size:15px;border:1px solid #ffffff30}
#minimap{width:200px;height:200px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 3px #000a,0 6px 16px #0008;background:#123}
#zone-info{background:#000a;border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700;text-align:right;border:1px solid #ffffff22}
#killfeed{display:flex;flex-direction:column;gap:3px;align-items:flex-end;margin-top:6px;max-width:300px}
#killfeed div{background:#000b;padding:4px 9px;border-radius:6px;font-size:13px;font-weight:600;white-space:nowrap;animation:kf .2s}@keyframes kf{from{transform:translateX(30px);opacity:0}}
#killfeed b{color:var(--ac)}#killfeed .dim{font-size:11px}
#center-top{position:absolute;left:50%;top:62px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px}
#place-toast{font-size:26px;font-weight:900;font-style:italic;text-shadow:0 3px 0 #000a,0 0 12px #000;opacity:0;transition:opacity .25s;text-align:center}
#god-badge{background:linear-gradient(135deg,#ffd23a,#ff5a3a);color:#2a1c00;font-weight:900;padding:3px 14px;border-radius:6px;letter-spacing:3px;font-size:13px}
#prompt{position:absolute;left:50%;top:60%;transform:translateX(-50%);background:#000b;padding:8px 16px;border-radius:10px;font-size:17px;font-weight:700;border:1px solid #ffffff33;display:none;white-space:nowrap}
#progress{position:absolute;left:50%;top:67%;transform:translateX(-50%);width:230px;height:22px;background:#000a;border-radius:11px;overflow:hidden;border:1px solid #ffffff44}
#progress-bar{height:100%;width:0;background:linear-gradient(90deg,#5cf27c,#2fd0ff)}#progress-txt{position:absolute;inset:0;text-align:center;font-size:12px;line-height:22px;font-weight:800}
#bus-hint{position:absolute;left:50%;top:76%;transform:translateX(-50%);font-size:24px;font-weight:900;font-style:italic;text-shadow:0 3px 0 #000a,0 0 12px #000;animation:pulse 1s infinite alternate}@keyframes pulse{to{transform:translateX(-50%) scale(1.07)}}
#spectate{position:absolute;left:50%;bottom:90px;transform:translateX(-50%);background:#000b;padding:8px 18px;border-radius:10px;font-weight:700}
#lockhint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#000c;border:2px solid var(--ac);padding:16px 34px;border-radius:12px;font-size:26px;font-weight:900;font-style:italic;letter-spacing:2px}
#wheel{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0006}
.wcard{background:var(--card);border-radius:16px;padding:18px 26px;border:1px solid #ffffff22;min-width:300px;text-align:center}.wcard h4{color:var(--ac);font-style:italic;font-size:22px;margin-bottom:8px}
#wheel-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}#wheel-list div{background:#27316a;border-radius:8px;padding:10px;font-weight:800}#wheel-list b{color:var(--ac);margin-right:6px}
.wcard p{font-size:12px;color:var(--dim);margin-top:10px}
#bottom{position:absolute;left:0;right:0;bottom:14px;display:flex;align-items:flex-end;justify-content:center;gap:18px}
#stats{display:flex;flex-direction:column;gap:5px;width:250px}
.bar{height:22px;background:#000a;border-radius:6px;border:2px solid #000;position:relative;overflow:hidden;transform:skewX(-10deg)}
.bar div{height:100%;transition:width .15s}.bar.hp div{background:linear-gradient(180deg,#8cff9c,#2fc84e)}.bar.sh div{background:linear-gradient(180deg,#8fe0ff,#2a8fe0)}
.bar span{position:absolute;left:0;right:0;top:0;text-align:center;font-weight:900;font-size:14px;line-height:19px;text-shadow:0 1px 2px #000}
#slots{display:flex;gap:6px}
.slot{width:64px;height:64px;background:#0a0f2ab8;border:3px solid #ffffff2a;border-radius:8px;position:relative;overflow:hidden;transition:.08s}
.slot img{position:absolute;inset:6px 4px 10px;width:calc(100% - 8px);height:calc(100% - 16px);object-fit:contain;filter:drop-shadow(0 2px 2px #000)}
.slot .k{position:absolute;left:4px;top:1px;font-size:12px;font-weight:900;color:#fff;text-shadow:0 1px 2px #000;z-index:2}
.slot .c{position:absolute;right:4px;bottom:1px;font-size:13px;font-weight:900;text-shadow:0 1px 2px #000,0 0 3px #000;z-index:2}
.slot .rb{position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--rc,transparent)}
.slot.sel{border-color:var(--ac);transform:translateY(-6px) scale(1.08);box-shadow:0 0 14px #ffd23a88;background:#2a2410d0}
.slot.empty{opacity:.55}
#ammo{width:250px;text-align:right}
#ammo-main{font-size:46px;font-weight:900;font-style:italic;line-height:1;text-shadow:0 3px 0 #000a}
#ammo-res{font-size:16px;font-weight:700;color:#dfe6ff;text-shadow:0 2px 3px #000}
#mats{font-size:15px;font-weight:800;margin-top:4px;text-shadow:0 2px 3px #000}
#buildbar{position:absolute;left:50%;bottom:100px;transform:translateX(-50%);display:flex;gap:8px}
#buildbar div{background:#000b;border:2px solid #ffffff30;border-radius:8px;padding:6px 12px;font-weight:700;font-size:14px}#buildbar div.sel{border-color:var(--ac);background:#2a2410d0;color:var(--ac)}
#buildbar b{background:#0a0f2a;border-radius:5px;padding:1px 7px;margin-right:6px;color:var(--ac)}

#inv{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#0a1030cc,#05081acc);pointer-events:auto;cursor:default;z-index:25}
.invcard{width:min(980px,94vw);display:flex;flex-direction:column;gap:14px}
.ihead b{font-size:34px;font-weight:900;font-style:italic;letter-spacing:2px;text-shadow:0 3px 0 #000a}
.itop{display:grid;grid-template-columns:1.3fr 1fr;gap:14px}
.idet{background:linear-gradient(160deg,color-mix(in srgb,var(--rc) 35%,#0d1330) 0%,#0d1330 70%);border:2px solid color-mix(in srgb,var(--rc) 60%,transparent);border-radius:6px;padding:16px 20px;position:relative;min-height:300px;display:flex;flex-direction:column;gap:8px}
.idet.empty-det{align-items:center;justify-content:center;color:var(--dim)}
.idet .ir{font-size:12px;font-weight:900;letter-spacing:3px;color:var(--rc)}
.idet h2{font-size:30px;font-weight:900;font-style:italic;text-transform:uppercase;line-height:1}
.idet img{height:120px;object-fit:contain;align-self:center;filter:drop-shadow(0 8px 10px #000a);margin:4px 0}
.ist{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px}.ist div{display:flex;justify-content:space-between;border-bottom:1px solid #ffffff18;padding:3px 0;font-size:14px}.ist span{color:var(--dim)}
.iam{font-size:13px;color:#dfe6ff}
.ibtn{align-self:flex-start;margin-top:auto;background:#ffffff14;border:1px solid #ffffff40;color:#fff;font-weight:900;font-style:italic;padding:8px 16px;border-radius:4px;cursor:pointer;font-family:inherit;transform:skewX(var(--sk))}.ibtn:hover{background:#ff4a4a55;border-color:#ff7a7a}
kbd{background:#000a;border-radius:3px;padding:1px 6px;font-size:11px;margin-left:6px;font-family:inherit}
.iside{display:flex;flex-direction:column;gap:12px}
.ires{background:#0d1330e0;border:1px solid #ffffff22;border-radius:6px;padding:10px 14px}.ires h4{font-size:12px;letter-spacing:3px;color:var(--dim);margin-bottom:6px}
.irow{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:14px;font-weight:700;border-bottom:1px solid #ffffff10}.irow b{margin-left:auto;color:var(--ac);min-width:40px;text-align:right}
.rd{width:12px;height:12px;border-radius:3px;background:var(--rc);display:inline-block}
.mini{background:#ffffff12;border:1px solid #ffffff30;color:#cfd6f0;font-size:11px;border-radius:4px;padding:3px 7px;cursor:pointer;font-family:inherit}.mini:hover:not(:disabled){background:#ff4a4a44}.mini:disabled{opacity:.3;cursor:default}
.ibar{display:flex;gap:8px;justify-content:center}
.islot{width:96px;height:96px;background:linear-gradient(180deg,color-mix(in srgb,var(--rc) 45%,#141a3c),#0d1330);border:3px solid #ffffff25;border-radius:6px;position:relative;cursor:grab;transition:transform .08s;user-select:none}
.islot img{position:absolute;inset:10px 6px 16px;width:calc(100% - 12px);height:calc(100% - 26px);object-fit:contain;filter:drop-shadow(0 3px 3px #000)}
.islot .n{position:absolute;left:6px;top:3px;font-weight:900;font-size:13px}.islot .c{position:absolute;right:6px;bottom:3px;font-weight:900;font-size:13px;text-shadow:0 1px 2px #000}
.islot.sel{border-color:#fff;box-shadow:0 0 0 3px var(--ac),0 0 18px #ffd23a77}.islot.over{transform:scale(1.08);border-color:var(--ac)}
.islot.empty{background:#0d1330a0;cursor:default}.islot.pick{cursor:pointer}
.ihint{text-align:center;font-size:12px;color:var(--dim)}
.idrag{position:fixed;left:0;top:0;width:80px;height:80px;pointer-events:none;z-index:99;opacity:.9}.idrag img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 6px #000)}
.idrag.out:after{content:"LASCIA";position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);background:#ff4a4a;color:#fff;font-weight:900;font-size:11px;padding:2px 8px;border-radius:3px}
.nl{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;gap:3px;will-change:transform;pointer-events:none}
.nl .nm{font-size:14px;font-weight:800;color:#fff;background:rgba(8,12,36,.72);padding:2px 9px;border-radius:4px;white-space:nowrap;letter-spacing:.3px;border:1px solid #ffffff22}
.nl.bot .nm{color:#ffd9d0}
.nl .hb{opacity:0;transition:opacity .3s}.nl.hurt .hb{opacity:1}
/* altre schermate */
#bigmap{background:#000a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;z-index:20}
#bigmap-c{width:min(82vh,92vw);height:min(82vh,92vw);border-radius:12px;border:3px solid #fff;box-shadow:0 12px 40px #000}
#pause,#end,#conn{background:#000b;display:flex;align-items:center;justify-content:center;z-index:30}
#pause .card,#end .card,#conn .card{display:flex;flex-direction:column;gap:12px;align-items:stretch;min-width:340px;text-align:center}
#end-title{font-size:72px;font-weight:900;font-style:italic;color:var(--ac);text-shadow:0 5px 0 #2a1c6b}
#end-sub{color:var(--dim)}
.end-stats{display:flex;gap:12px;justify-content:center}.end-stats div{background:#0a0f2a;border-radius:12px;padding:12px 18px;display:flex;flex-direction:column;min-width:96px}.end-stats b{font-size:32px;color:var(--ac)}.end-stats span{font-size:11px;color:var(--dim)}
#toasts{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);display:flex;flex-direction:column;gap:6px;z-index:60;align-items:center}
.toast{background:#000d;padding:10px 18px;border-radius:10px;font-weight:700;border:1px solid #ffffff33}
@media (max-height:760px){.brand{font-size:40px}.card{padding:14px 16px}#menu-left{margin-top:9vh}.btn.huge{padding:12px 18px;font-size:20px}}
body.invopen #bottom,body.invopen #buildbar,body.invopen #crosshair,body.invopen #prompt{display:none}
#col-presets{display:flex;gap:4px}#col-presets i{width:18px;height:18px;border-radius:50%;border:2px solid #0008;cursor:pointer;display:block}#col-presets i:hover{transform:scale(1.2)}
#mats .mt{margin-left:10px;padding:2px 6px;border-radius:6px}#mats .mt.on{background:#ffd23a;color:#111}

.logo .ver{font-size:12px;letter-spacing:1px;margin-left:8px;opacity:.7;vertical-align:super;}
#tm-bar{position:fixed;left:50%;transform:translateX(-50%);top:58px;z-index:40;display:flex;gap:10px;align-items:center;background:#0b1530cc;color:#fff;padding:6px 10px;border-radius:10px;font:600 12px system-ui;pointer-events:auto}#tm-bar span{opacity:.75}#tm-bar button{padding:5px 10px;border:0;border-radius:6px;background:#ffd23a;font-weight:800;cursor:pointer}#tm-bar #tm-exit{background:#ffffff33;color:#fff}
#mats,#buildbar{display:none!important}

/* ===== modalita' arena ===== */
.arena-mode #minimap,.arena-mode #zone-info,.arena-mode #p-alive,.arena-mode #bus-hint{display:none!important}
#arena-bar{position:absolute;top:12px;left:50%;transform:translateX(-50%);display:flex;gap:6px;align-items:stretch;pointer-events:none}
#arena-bar .ts,#arena-bar .mid{background:#000b;border-radius:10px;padding:5px 14px;display:flex;flex-direction:column;align-items:center;min-width:86px;border:2px solid #ffffff22}
#arena-bar b{font-size:24px;font-weight:900;line-height:1.1}#arena-bar span{font-size:11px;font-weight:700;color:#cfd6e6;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#arena-bar .mid b{font-size:20px}#arena-bar .ts.me{border-color:var(--ac)}
#arena-bar .ts.r{background:#c23b33dd}#arena-bar .ts.b{background:#2a6fd6dd}#arena-bar .ts.r.me,#arena-bar .ts.b.me{border-color:#fff}
#respawn{position:absolute;top:38%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;text-shadow:0 2px 6px #000;pointer-events:none}
#respawn b{font-size:72px;font-weight:900;line-height:1}#respawn span{font-weight:800;letter-spacing:2px}#respawn small{font-size:15px;margin-bottom:6px}
#prot{position:absolute;top:64%;left:50%;transform:translateX(-50%);background:#3d8bffcc;padding:4px 12px;border-radius:8px;font-weight:900;font-size:12px;letter-spacing:2px;pointer-events:none}
#board{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#0b1020ee;border-radius:14px;padding:14px 18px;min-width:440px;max-height:80vh;overflow:auto;border:1px solid #ffffff22}
#board .bh,#end-board .bh{display:flex;justify-content:space-between;margin-bottom:8px;font-size:15px}
#board table,#end-board table{width:100%;border-collapse:collapse;font-size:14px}
#board th,#end-board th{font-size:11px;color:var(--dim);font-weight:700;text-align:center;padding:3px 6px}
#board td,#end-board td{text-align:center;padding:4px 6px;border-top:1px solid #ffffff12}
#board .n,#end-board .n{text-align:left;border-left:4px solid var(--tc,transparent);padding-left:8px}
#board tr.me td,#end-board tr.me td{background:#ffffff14;font-weight:800}
#board .tt,#end-board .tt{margin:8px 0 2px;font-weight:900;color:var(--tc)}
#end-board{max-height:44vh;overflow:auto;text-align:left}
#mode-seg{flex-wrap:wrap}#mode-seg button{flex:1 1 45%}
#match-opts{display:flex;flex-direction:column;gap:6px;margin:8px 0}#match-opts.locked{opacity:.6;pointer-events:none}
#mode-desc{font-size:12px;min-height:16px}
.nl.mate .nm{color:#7fb6ff}.nl.foe .nm{color:#ff8a80}
.arena-mode #compass{display:none!important}
.arena-mode .hub-mode #stats .bar.sh{display:none!important}

/* ===================== v0.3: accesso, menu, lobby del party ===================== */
.glass{background:linear-gradient(160deg,rgba(30,36,90,.72),rgba(10,14,40,.82));border:1px solid rgba(255,255,255,.14);border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3)}
body.on-login #menu{background:radial-gradient(ellipse 60% 80% at 62% 55%,transparent 30%,rgba(20,8,60,.6) 70%,rgba(8,6,30,.95) 100%),linear-gradient(90deg,rgba(8,6,30,.92) 0%,rgba(8,6,30,.55) 38%,transparent 60%)}
#scr-login{position:absolute;inset:0;align-items:center;justify-content:space-between;padding:0 6vw;pointer-events:none}
#scr-login>*{pointer-events:auto}
.hero{max-width:min(720px,52vw)}
.hero-logo{display:flex;flex-direction:column;align-items:flex-start;font-weight:900;font-style:italic;line-height:.86;letter-spacing:2px;transform:rotate(-4deg);transform-origin:left bottom;animation:heroIn .9s cubic-bezier(.2,1.4,.4,1) both}
.hero-logo span{display:inline-block;padding-right:.12em;font-size:clamp(54px,7vw,110px);color:#fff;text-shadow:0 6px 0 #3a1c8b,0 0 40px rgba(122,60,255,.6)}
.hero-logo b{display:inline-block;padding:0 .14em .06em 0;font-size:clamp(70px,10vw,156px);background:linear-gradient(180deg,#fff27a 0%,#ffd23a 45%,#ff8a1c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 7px 0 #8a3a00) drop-shadow(0 0 30px rgba(255,170,40,.45))}
@keyframes heroIn{from{opacity:0;transform:rotate(-4deg) translateY(30px) scale(.9)}}
.hero-tag{margin-top:22px;font-size:19px;line-height:1.5;color:#dfe4ff;font-weight:600;text-shadow:0 2px 8px #000;animation:fadeUp .8s .25s both}
.hero-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;animation:fadeUp .8s .4s both}
.hero-chips i{font-style:normal;font-weight:800;font-size:13px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(6px)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}}
.login-card{position:static;transform:none;width:min(400px,90vw);display:flex;flex-direction:column;gap:12px;padding:26px 26px 20px;animation:fadeUp .7s .15s both}
.login-card .tabs{display:flex;gap:6px;background:rgba(0,0,0,.3);padding:5px;border-radius:12px}
.login-card .tab{flex:1;border:0;background:none;color:#b9c3ee;font:inherit;font-weight:900;font-size:15px;padding:10px;border-radius:9px;cursor:pointer;letter-spacing:1px}
.login-card .tab.on{background:linear-gradient(180deg,#ffe84a,#ffc21a);color:#1a1200;box-shadow:0 3px 0 #b07800}
.fld{display:flex;flex-direction:column;gap:5px}.fld span{font-size:12px;font-weight:800;letter-spacing:1px;color:#aeb8e6;text-transform:uppercase}
.login-card input{width:100%;font-size:17px;padding:12px 14px;border-radius:10px}
.btn.big{font-size:19px;padding:13px;font-weight:900;letter-spacing:1px}
.row{display:flex;gap:8px;align-items:stretch}.row input{flex:1;min-width:0}
/* GIOCA */
#scr-play{align-items:center;justify-content:space-between;padding:0 3.5vw}
#play-card{position:static;width:min(400px,92vw);padding:24px;gap:12px;animation:fadeUp .5s both}
#play-card small{font-size:12px;letter-spacing:4px;font-weight:900;color:var(--ac)}#play-card h2{font-size:28px;font-style:italic;font-weight:900;line-height:1.1}
#play-card p{font-size:14px;line-height:1.5}
#play-card .playbtn{font-size:36px}
#modes-info{display:flex;flex-direction:column;gap:10px;width:min(340px,30vw);animation:fadeUp .5s both}
.minfo{background:linear-gradient(100deg,rgba(14,18,48,.85),rgba(14,18,48,.5));border-left:5px solid var(--c);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;backdrop-filter:blur(8px)}
.minfo b{font-size:17px;font-style:italic;font-weight:900;letter-spacing:1px;color:var(--c)}.minfo span{font-size:13px;color:#d6dcf5}
.maps-strip{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.maps-strip i{font-style:normal;font-size:12px;font-weight:800;padding:5px 10px;border-radius:999px;background:rgba(0,0,0,.45);border:2px solid var(--c)}
/* lobby del party */
#hub-bar{position:absolute;top:12px;left:50%;transform:translateX(-50%);display:flex;gap:8px;align-items:stretch;pointer-events:none}
#hub-bar>div{background:rgba(8,12,34,.78);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:6px 14px;display:flex;flex-direction:column;justify-content:center;backdrop-filter:blur(8px)}
.hb-code span{font-size:10px;letter-spacing:3px;color:var(--dim);font-weight:900}.hb-code b{font-size:22px;letter-spacing:5px;color:var(--ac);font-weight:900}
.hb-mid b{font-size:18px;font-style:italic;font-weight:900}.hb-mid span{font-size:12px;color:#c9d3ff}
.hb-hint{font-size:13px;color:#e8ecff}.hb-hint b{background:#fff;color:#111;border-radius:5px;padding:1px 6px;margin-right:4px}
.hub-mode #arena-bar,.hub-mode #respawn{display:none!important}
#pause .card{min-width:min(460px,94vw);max-height:92vh;overflow:auto;padding:22px 24px}
#pause .row .btn{flex:1}
#party-panel2{display:flex;flex-direction:column;gap:8px;text-align:left}
#party-panel2:empty{display:none}
#party-panel2 label{font-size:12px;font-weight:800;letter-spacing:1px;color:#aeb8e6;text-transform:uppercase;margin-top:4px}
#party-panel2 label.check{text-transform:none;font-size:14px;color:#fff;letter-spacing:0;display:flex;gap:8px;align-items:center}
#party-panel2 .seg button{font-size:13px;padding:8px 6px}#party-panel2 .seg button:disabled{opacity:.75;cursor:default}
.pp-head{display:flex;align-items:center;gap:10px;background:rgba(0,0,0,.35);border-radius:12px;padding:10px 14px}
.pp-code{flex:1;display:flex;flex-direction:column}.pp-code span{font-size:10px;letter-spacing:3px;color:var(--dim);font-weight:900}.pp-code b{font-size:30px;letter-spacing:7px;color:var(--ac);font-weight:900}
.pp-members{list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.pp-members li{background:rgba(255,255,255,.08);border-radius:999px;padding:6px 12px 6px 8px;font-weight:800;font-size:14px;display:flex;align-items:center;gap:7px}
.pp-members li i{width:12px;height:12px;border-radius:50%;background:var(--tc);box-shadow:0 0 0 2px rgba(255,255,255,.25)}
.pp-desc{font-size:12px}
#party-panel2 .playbtn{font-size:30px;margin-top:8px}
.pp-wait{text-align:center;color:var(--dim);font-weight:700;padding:10px;background:rgba(255,255,255,.05);border-radius:10px;margin-top:6px}
#prompt{font-weight:900}
.hub-mode #stats .bar.sh{display:none!important}
#respawn small b{font-size:inherit;font-weight:900;color:var(--ac)}
#end .card{max-height:94vh;overflow:auto}
#end-board{max-height:34vh}
.hub-mode #center-top{top:96px}
/* crediti e negozio */
#credits{display:flex;align-items:center;gap:6px;background:linear-gradient(180deg,#2b2f6a,#1b1e48);border:1px solid #6a73ff66;border-radius:999px;padding:5px 12px 5px 8px;font-weight:900;margin-right:10px}
#credits i{font-style:normal;color:#7fd8ff;text-shadow:0 0 8px #2aa8ff}
.fpanel.shop{width:min(560px,46vw)}
.shop-head{display:flex;justify-content:space-between;align-items:center}
.shop-wallet{display:flex;flex-direction:column;align-items:flex-end}.shop-wallet span{font-size:11px;color:var(--dim);font-weight:800;letter-spacing:1px}.shop-wallet b{font-size:26px;font-weight:900;color:#7fd8ff}
.shop-note{font-size:13px;margin:4px 0 10px}
#shop-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.shop-card{border-radius:14px;overflow:hidden;background:#0d1230;border:2px solid #ffffff1c;cursor:pointer;transition:transform .15s,border-color .15s}
.shop-card:hover{transform:translateY(-3px)}.shop-card.on{border-color:var(--ac)}
.sc-art{height:190px;background:linear-gradient(160deg,var(--c1),#0a0d26 85%);background-size:cover;background-position:center top;position:relative}
.sc-art span{position:absolute;left:8px;top:8px;font-size:10px;font-weight:900;letter-spacing:2px;background:#9b5cf0;padding:3px 8px;border-radius:6px}
.sc-body{padding:10px 12px;display:flex;flex-direction:column;gap:2px}.sc-body b{font-size:18px;font-style:italic;font-weight:900}.sc-body small{color:var(--dim);font-size:11px;text-transform:uppercase;letter-spacing:1px}
.sc-buy{display:flex;justify-content:space-between;align-items:center;margin-top:6px}.sc-buy em{font-style:normal;font-weight:900;color:#7fd8ff}
.shop-soon{margin-top:14px;padding:10px 12px;border-radius:10px;background:#ffffff0d;display:flex;flex-direction:column;font-size:13px}.shop-soon span{color:var(--dim)}
.scard.tex .sic{background:linear-gradient(160deg,var(--c1),var(--c2))}
#scr-shop{position:absolute;left:28px;top:76px;max-height:calc(100vh - 100px)}
#scr-shop .fpanel{max-height:calc(100vh - 100px);overflow:auto}
/* ---- armadietto a categorie, oggetti estetici, livelli ---- */
#scr-locker{max-height:calc(100vh - 110px)}
#scr-locker .fpanel{max-height:calc(100vh - 110px);overflow:auto}
.cats{display:flex;flex-wrap:wrap;gap:6px}
.cats button{background:#ffffff12;border:1px solid #ffffff22;color:#cfd6ff;border-radius:999px;padding:5px 11px;font-weight:800;font-size:12px;letter-spacing:.5px;cursor:pointer}
.cats button:hover{background:#ffffff22}.cats button.on{background:var(--ac);color:#1a1a2a;border-color:var(--ac)}
.scard{border-color:color-mix(in srgb,var(--rc,#ffffff22) 55%,transparent)}
.scard.th{padding:6px 6px 8px}.sth{width:100%;height:120px;border-radius:4px;background-size:cover;background-position:center 15%}
.scard.th b{font-size:15px}
#cos-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ccard{border:3px solid color-mix(in srgb,var(--rc) 55%,transparent);border-radius:8px;background:linear-gradient(160deg,var(--c1) -30%,var(--c2) 75%);padding:10px 6px 8px;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;transition:.1s;min-height:96px;text-align:center}
.ccard:hover{transform:translateY(-2px)}.ccard.on{border-color:var(--ac);box-shadow:0 0 0 2px #ffd23a55,0 0 22px #ffd23a55}
.ccard b{font-size:13px;font-weight:900;font-style:italic;line-height:1.1}
.cic{font-size:30px;line-height:1;filter:drop-shadow(0 0 8px var(--c1));color:#fff}.cic.big{font-size:84px;position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.sc-art.cos{background:radial-gradient(circle at 50% 45%,var(--c1) -20%,var(--c2) 70%)}
.sc-art span{background:var(--rc,#9b5cf0)}
#cos-try{align-self:flex-start;margin-top:8px}
/* barra livello in alto */
#who .lvb{display:inline-block;min-width:20px;padding:0 5px;border-radius:5px;background:linear-gradient(180deg,#ffd34a,#e0a020);color:#2a1a00;font-weight:900;font-size:11px;text-align:center;margin-right:3px}
#who .xpb{display:block;height:4px;border-radius:3px;background:#ffffff1f;margin-top:3px;overflow:hidden}#who .xpb b{display:block;height:100%;background:linear-gradient(90deg,#7fd8ff,#ffd34a)}
/* schermata livelli */
#scr-levels{position:absolute;left:28px;top:76px;max-height:calc(100vh - 100px)}
#scr-levels .fpanel{width:min(600px,48vw);max-height:calc(100vh - 100px);overflow:auto}
.lv-head{display:flex;gap:16px;align-items:center}.lv-head>div:last-child{flex:1}
.lv-badge{width:64px;height:64px;border-radius:14px;background:linear-gradient(160deg,#ffd34a,#e08a10);color:#2a1a00;font-size:34px;font-weight:900;display:flex;align-items:center;justify-content:center;box-shadow:0 0 24px #ffb02a66}
.lv-bar{height:12px;border-radius:7px;background:#ffffff1a;overflow:hidden;margin:6px 0 4px}.lv-bar b{display:block;height:100%;background:linear-gradient(90deg,#7fd8ff,#ffd34a);transition:width .4s}
.lv-head small{color:var(--dim);font-weight:700}
.lv-row{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:10px;background:#ffffff0a;border:1px solid #ffffff12}
.lv-row.ok{background:#2fd27a14;border-color:#2fd27a44}.lv-row.next{border-color:var(--ac);box-shadow:0 0 0 1px #ffd23a55}
.lv-n{width:34px;height:34px;border-radius:9px;background:#ffffff18;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:16px}.lv-row.ok .lv-n{background:#2fd27a;color:#002a12}
.lv-i{width:130px;display:flex;flex-direction:column}.lv-i b{font-style:italic;font-weight:900}.lv-i small{color:var(--dim);font-size:11px}
.lv-r{flex:1;display:flex;flex-wrap:wrap;gap:6px}.lv-r em{font-style:normal;font-size:12px;font-weight:800;padding:3px 8px;border-radius:999px;background:#ffffff14;border:1px solid color-mix(in srgb,var(--rc,#7fd8ff) 60%,transparent)}
.lv-r em small{color:var(--dim);font-weight:600;margin-left:3px}.lv-r em.cr{color:#7fd8ff;border-color:#7fd8ff55}
.lv-s{width:22px;text-align:center}
#lv-list{display:flex;flex-direction:column;gap:6px}
/* XP a fine partita */
#end-xp{display:flex;flex-direction:column;gap:6px;align-items:center}
#end-xp .xpgain{font-size:22px;font-weight:900;color:#7fd8ff;text-shadow:0 0 12px #2aa8ff88}
#end-xp .lvup{background:linear-gradient(90deg,#ffd34a22,#ffd34a44,#ffd34a22);border:1px solid #ffd34a88;border-radius:10px;padding:6px 12px;font-size:14px}
#end-xp .lvup b{color:#ffd34a}#end-xp .lvup span{display:block;font-size:12px;color:#e8ecff}

/* ===== Kraxo Royale beta 0.5 ===== */
/* loading screen with the battle artwork */
#loading{background:#0c1224}
#loading .load-art{position:absolute;inset:0;background:url(/assets/loading.jpg) center/cover no-repeat;transform:scale(1.04);animation:loadPan 18s ease-in-out infinite alternate}
#loading .load-art::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,10,28,.15) 0%,rgba(8,10,28,.05) 40%,rgba(8,10,28,.82) 78%,rgba(8,10,28,.95) 100%)}
@keyframes loadPan{from{transform:scale(1.04) translateX(-1%)}to{transform:scale(1.1) translateX(1%)}}
#loading .load-in{position:absolute;left:0;right:0;bottom:7vh;display:flex;flex-direction:column;align-items:center;gap:16px;z-index:1}
#loading .brand.big{text-shadow:0 5px 0 #2a1c6b,0 0 40px #000c,0 0 34px #7a3cff99}
#loading-txt{font-weight:700;text-shadow:0 2px 6px #000}
#loading-tip{font-size:14px;color:#dfe5ff;opacity:.85;max-width:min(640px,90vw);text-align:center;text-shadow:0 2px 6px #000}
/* play card */
#play-card #quick-mode button{font-size:12px;padding:7px 4px}
#play-card .btn.big.wide{width:100%}
#play-card .hint{margin-top:-4px}
/* health only: no shield bar */
#stats .bar.hp{height:26px}
#stats .bar.hp.low div{background:linear-gradient(180deg,#ff8c7a,#e0352a);animation:lowhp .8s ease-in-out infinite alternate}
@keyframes lowhp{to{filter:brightness(1.35)}}
.nl .hb .s{display:none}
/* party panel: match in progress + join with code */
.pp-game{display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,rgba(255,210,63,.18),rgba(122,60,255,.18));border:1px solid rgba(255,210,63,.45);border-radius:12px;padding:10px 12px}
.pp-game div{flex:1;display:flex;flex-direction:column;gap:2px}.pp-game b{font-size:13px}.pp-game span{font-size:12px;color:#d6dcf5}.pp-game span b{color:var(--ac);letter-spacing:2px}
#party-panel2 .row{display:flex;gap:8px}#party-panel2 .row input{flex:1;text-transform:uppercase;letter-spacing:4px;font-weight:900}
#party-panel2 .sep{margin:6px 0 0}
/* match code during private matches */
#arena-bar .mcode{align-self:center;background:#000b;border:2px dashed var(--ac);border-radius:10px;padding:6px 12px;font-size:11px;font-weight:900;letter-spacing:2px;color:#e8ecff}
#arena-bar .mcode b{font-size:16px;color:var(--ac);letter-spacing:4px}
/* kill feed notices (joined / left) */
#killfeed div.note{background:#1b2350cc;color:#cfd6f0;font-style:italic}
#in-code{text-transform:uppercase;letter-spacing:3px;font-weight:800}
.bh span{margin-left:10px}
/* ===== palette from the key art: electric blue next to the gold ===== */
:root{--bl:#2fa8ff;--bl2:#1a4dff}
#topbar .logo{color:#fff;text-shadow:0 2px 0 #0b2a8a,0 0 14px rgba(47,168,255,.55)}
#topbar .logo span{color:var(--ac);margin:0 0 0 6px;text-shadow:0 2px 0 #8a3a00,0 0 12px rgba(255,190,40,.4)}
.hero-logo span{text-shadow:0 6px 0 #0b2a8a,0 0 40px rgba(47,168,255,.65)}
#loading{background:#070b1f}
#loading .load-art{animation:none;transform:none;background-position:center 38%}
#loading .load-art::after{background:linear-gradient(180deg,rgba(7,11,31,0) 0%,rgba(7,11,31,0) 72%,rgba(7,11,31,.75) 90%,rgba(7,11,31,.92) 100%)}
#loading .load-in{bottom:3.2vh;gap:9px}
#loading .loadbar{height:12px;border:2px solid rgba(255,255,255,.22);box-shadow:0 0 18px rgba(47,168,255,.55),0 4px 14px #000a;background:rgba(5,10,30,.75)}
#loadbar-in{background:linear-gradient(90deg,var(--bl2),var(--bl),var(--ac))!important;box-shadow:0 0 12px rgba(47,168,255,.8)}
#loading-txt{font-size:14px;letter-spacing:1px}
#loading-tip{font-size:13px}
.lv-bar b,.xpb b{background:linear-gradient(90deg,var(--bl2),var(--bl))!important}
#arena-bar .mcode{border-color:var(--bl)}#arena-bar .mcode b{color:#7fd0ff}
.pp-game{background:linear-gradient(135deg,rgba(47,168,255,.18),rgba(255,210,63,.14));border-color:rgba(47,168,255,.5)}

/* =====================================================================
   KRAXO THEME (beta 0.5): night blue, electric blue lightning, gold.
   Matches the key art. Menus, lobby, party settings, end screen.
   ===================================================================== */
@font-face{font-family:'Lilita One';src:url(/fonts/lilita-one.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url(/fonts/inter.woff2) format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url(/fonts/inter-italic.woff2) format('woff2');font-weight:100 900;font-style:italic;font-display:swap}
:root{
  --ink:#050819;--navy:#0a1036;--navy2:#111a5c;--indigo:#1d1a78;
  --bl:#2fa8ff;--bl2:#1a4dff;--cy:#8fe3ff;--pu:#7a3cff;--mg:#c23cff;
  --ac:#ffd23a;--ac2:#ff9f1c;--fire:#ff6a1c;--tx:#f4f7ff;--dim:#9fb0e6;
  --disp:'Lilita One','Segoe UI Black',Impact,sans-serif;
  --edge:rgba(64,170,255,.55);--edge2:rgba(122,60,255,.45);
  --panel:linear-gradient(165deg,rgba(22,34,118,.86) 0%,rgba(12,18,70,.9) 45%,rgba(6,9,34,.94) 100%);
  --glow:0 0 0 1px rgba(64,170,255,.35),0 0 24px rgba(47,168,255,.28),0 18px 50px rgba(0,0,8,.65);
}
html,body{font-family:'Inter',"Segoe UI",system-ui,sans-serif}
::selection{background:var(--bl);color:#fff}
*{scrollbar-width:thin;scrollbar-color:rgba(64,170,255,.5) transparent}

/* ---------- display text ---------- */
.card h2,#play-card h2,.fpanel h4,#end-title,.minfo b,.scard b,.sc-body b,.lv-head h4,#pause-title,.playbtn,.btn,.tab,#tabs button,.hb-mid b,.pp-code b,.hb-code b,.lv-n,.lv-badge,.end-stats b,#topbar .logo{font-family:var(--disp);font-weight:400;letter-spacing:.5px}
.btn,.playbtn,.tab,#tabs button{font-style:normal}

/* ---------- menu backdrop: night tint over the 3D lobby, lightning glow at the edges ---------- */
#menu{background:
  radial-gradient(ellipse 50% 70% at 50% 60%,transparent 40%,rgba(10,16,70,.5) 78%,rgba(5,8,30,.9) 100%),
  radial-gradient(ellipse 40% 60% at 0% 30%,rgba(122,60,255,.32),transparent 70%),
  radial-gradient(ellipse 40% 60% at 100% 20%,rgba(47,168,255,.28),transparent 70%),
  linear-gradient(0deg,rgba(5,8,30,.85) 0%,transparent 26%,transparent 78%,rgba(5,8,30,.75) 100%)}
#menu:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.55;mix-blend-mode:screen;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='900' viewBox='0 0 1600 900'%3E%3Cg fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M-20 210 L140 250 L110 300 L300 330 L270 380 L470 390' stroke='%232fa8ff' stroke-width='3' opacity='.55'/%3E%3Cpath d='M1620 120 L1450 170 L1490 210 L1300 250 L1340 290 L1160 300' stroke='%238fe3ff' stroke-width='2.5' opacity='.5'/%3E%3Cpath d='M1620 760 L1480 730 L1510 690 L1360 670' stroke='%23c23cff' stroke-width='2' opacity='.45'/%3E%3C/g%3E%3C/svg%3E") center/cover no-repeat;
  filter:drop-shadow(0 0 6px #2fa8ff);animation:zap 6s infinite}
@keyframes zap{0%,100%{opacity:.35}48%{opacity:.35}50%{opacity:.9}52%{opacity:.3}54%{opacity:.75}57%{opacity:.35}}
body.on-login #menu:before{display:none}

/* ---------- top bar ---------- */
#topbar{height:66px;background:linear-gradient(180deg,rgba(5,8,30,.97),rgba(8,12,48,.78));border-bottom:0;box-shadow:0 1px 0 rgba(64,170,255,.55),0 6px 24px rgba(47,168,255,.18)}
#topbar:after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,var(--bl) 20%,var(--mg) 50%,var(--bl) 80%,transparent);opacity:.85}
#topbar .logo{font-size:30px;font-style:italic;color:#fff;text-shadow:0 0 0 #000;-webkit-text-stroke:0;paint-order:stroke fill;
  filter:drop-shadow(0 2px 0 #0b2a8a) drop-shadow(0 0 10px rgba(47,168,255,.6))}
#topbar .logo span{color:var(--ac);margin-left:7px;filter:drop-shadow(0 2px 0 #8a3a00);text-shadow:none}
#topbar .logo .ver{font-family:'Inter',sans-serif;font-style:italic;font-weight:800;font-size:11px;color:var(--cy);background:rgba(47,168,255,.15);border:1px solid rgba(64,170,255,.45);border-radius:999px;padding:1px 7px;vertical-align:middle;opacity:1;filter:none}
body.on-login #topbar .logo{visibility:hidden}
#tabs{gap:2px}
#tabs button{font-size:18px;color:#b8c6ff;padding:0 20px;transition:color .15s}
#tabs button:hover{color:#fff;text-shadow:0 0 12px rgba(47,168,255,.8)}
#tabs button.on{color:#fff;text-shadow:0 0 14px rgba(255,210,58,.55)}
#tabs button.on:after{left:10px;right:10px;height:4px;background:linear-gradient(90deg,var(--ac2),var(--ac));box-shadow:0 0 12px rgba(255,210,58,.8);border-radius:3px 3px 0 0}
#who{font-family:var(--disp);font-size:18px;font-weight:400}
#who small{font-family:'Inter',sans-serif}
.lvb{background:linear-gradient(180deg,var(--bl),var(--bl2));color:#fff;border-radius:6px;padding:0 6px;font-weight:900}
#credits{background:linear-gradient(180deg,rgba(26,77,255,.45),rgba(10,16,60,.8));border:1px solid var(--edge);box-shadow:0 0 14px rgba(47,168,255,.3)}
#credits b{font-family:var(--disp);font-weight:400;font-size:18px}

/* ---------- panels ---------- */
.glass,.fpanel,.card,#pause .card,#end .card,#conn .card{background:var(--panel);border:1px solid var(--edge);border-radius:16px;box-shadow:var(--glow),inset 0 1px 0 rgba(160,210,255,.18);backdrop-filter:blur(14px) saturate(1.35);-webkit-backdrop-filter:blur(14px) saturate(1.35);position:relative}
.glass:before,.fpanel:before,#pause .card:before,#end .card:before{content:'';position:absolute;left:18px;right:18px;top:-1px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--cy),var(--bl) 40%,var(--mg) 70%,transparent);box-shadow:0 0 10px rgba(47,168,255,.8);pointer-events:none}
.fpanel h4{font-size:24px;letter-spacing:1px;color:#fff;text-shadow:0 2px 0 #0b2a8a,0 0 14px rgba(47,168,255,.55);font-style:italic}
.fpanel h5{color:var(--cy);letter-spacing:2px;font-weight:900}
.dim{color:var(--dim)}.hint{color:#8d9dd6}
.card h2{font-size:30px;font-style:italic;color:#fff;text-shadow:0 3px 0 #0b2a8a,0 0 16px rgba(47,168,255,.5)}
.card h3{font-family:var(--disp);font-weight:400;color:var(--ac);font-style:italic;letter-spacing:.5px}

/* ---------- buttons ---------- */
.btn{background:linear-gradient(180deg,#2c63ff 0%,#1a3ec8 55%,#152f9e 100%);color:#fff;border:1px solid rgba(143,227,255,.55);border-radius:10px;box-shadow:0 4px 0 #0a1a66,0 0 14px rgba(47,168,255,.25);text-shadow:0 1px 0 #0a1a66;font-size:16px;letter-spacing:.6px;padding:11px 18px}
.btn:hover{filter:none;transform:translateY(-2px);box-shadow:0 6px 0 #0a1a66,0 0 22px rgba(47,168,255,.55);background:linear-gradient(180deg,#3d72ff 0%,#2149de 55%,#1834ad 100%)}
.btn:active{transform:translateY(2px);box-shadow:0 1px 0 #0a1a66}
.btn.primary{background:linear-gradient(180deg,#fff27a 0%,#ffd23a 40%,#ff9f1c 100%);color:#2a1300;text-shadow:0 1px 0 rgba(255,255,255,.4);border:1px solid #fff2a8;box-shadow:0 4px 0 #9a4d00,0 0 16px rgba(255,190,40,.35)}
.btn.primary:hover{background:linear-gradient(180deg,#fff69a 0%,#ffdb52 40%,#ffab2e 100%);box-shadow:0 6px 0 #9a4d00,0 0 24px rgba(255,190,40,.6)}
.btn.small{font-size:13px;padding:6px 12px;border-radius:8px}
.btn:disabled{opacity:.55;transform:none;cursor:default}
.playbtn{position:relative;overflow:hidden;font-size:46px;letter-spacing:1px;color:#2a1300;border-radius:12px;border:2px solid #fff3b0;padding:12px 0 10px;
  background:linear-gradient(180deg,#fff58a 0%,#ffd23a 38%,#ffb21c 70%,#ff8a14 100%);
  text-shadow:0 2px 0 rgba(255,255,255,.45);box-shadow:0 6px 0 #8a4100,0 0 0 4px rgba(10,16,60,.85),0 0 30px rgba(255,190,40,.45),0 14px 34px rgba(0,0,10,.7)}
.playbtn:before{content:'';position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:shine 3.2s ease-in-out infinite}
@keyframes shine{0%,60%{left:-60%}100%{left:130%}}
.playbtn:hover{filter:brightness(1.06) saturate(1.1);transform:translateY(-2px)}
.playbtn:active{transform:translateY(3px);box-shadow:0 2px 0 #8a4100,0 0 0 4px rgba(10,16,60,.85)}
.playbtn:disabled{background:linear-gradient(180deg,#4a5aa0,#2a3370);color:#c8d2ff;border-color:#7d8fd6;text-shadow:none;box-shadow:0 6px 0 #161d4a,0 0 0 4px rgba(10,16,60,.85)}
.playbtn:disabled:before{display:none}

/* ---------- inputs, segments, tabs ---------- */
input[type=text],input[type=password],input[type=number],input:not([type]){background:rgba(4,8,30,.85);border:2px solid rgba(64,170,255,.3);border-radius:10px;color:#fff;font-weight:600;transition:border-color .15s,box-shadow .15s}
input:focus{border-color:var(--bl);box-shadow:0 0 0 3px rgba(47,168,255,.25),0 0 18px rgba(47,168,255,.35)}
input::placeholder{color:#6c7bb4}
input[type=range]{accent-color:var(--ac);height:22px}
.seg{gap:5px;background:rgba(4,8,30,.55);padding:4px;border-radius:12px;border:1px solid rgba(64,170,255,.22)}
.seg button{background:transparent;border:1px solid transparent;color:#b8c6ff;border-radius:9px;font-family:var(--disp);font-weight:400;font-size:15px;letter-spacing:.4px;padding:8px 6px;transition:.12s}
.seg button:hover:not(:disabled){color:#fff;background:rgba(47,168,255,.14);border-color:rgba(64,170,255,.35)}
.seg button.on{background:linear-gradient(180deg,#fff27a,#ffd23a 45%,#ff9f1c);color:#2a1300;border-color:#fff2a8;box-shadow:0 3px 0 #9a4d00,0 0 14px rgba(255,190,40,.4)}
.login-card .tabs{background:rgba(4,8,30,.6);border:1px solid rgba(64,170,255,.22)}
.login-card .tab{font-size:18px;color:#b8c6ff}
.login-card .tab.on{background:linear-gradient(180deg,#fff27a,#ffd23a 45%,#ff9f1c);color:#2a1300;box-shadow:0 3px 0 #9a4d00,0 0 14px rgba(255,190,40,.35)}
.fld span,label{color:#9fb6f0}
.sep{color:#8d9dd6;font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:11px}.sep:before,.sep:after{background:linear-gradient(90deg,transparent,rgba(64,170,255,.5),transparent)}
.badge{background:linear-gradient(180deg,#fff27a,#ffb21c);color:#2a1300;font-weight:900;box-shadow:0 0 8px rgba(255,190,40,.5)}
.cats button{background:rgba(4,8,30,.55);border:1px solid rgba(64,170,255,.3);color:#c6d3ff;font-family:var(--disp);font-weight:400;font-size:14px;padding:6px 13px}
.cats button:hover{background:rgba(47,168,255,.18)}
.cats button.on{background:linear-gradient(180deg,#fff27a,#ffd23a 45%,#ff9f1c);color:#2a1300;border-color:#fff2a8;box-shadow:0 0 12px rgba(255,190,40,.4)}
.toast{background:linear-gradient(165deg,rgba(26,60,200,.92),rgba(8,12,48,.95));border:1px solid var(--edge);box-shadow:0 0 20px rgba(47,168,255,.35);font-weight:800}

/* ---------- login: key art on the left, card on the right ---------- */
body.on-login #menu{background:linear-gradient(90deg,transparent 0%,transparent 52%,rgba(5,8,30,.88) 70%,rgba(5,8,30,.97) 100%)}
#scr-login .login-art{position:absolute;left:0;top:66px;bottom:0;width:72vw;background:url(/assets/loading.jpg) 50% 30%/cover no-repeat;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 74%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 74%,transparent 100%)}
#scr-login .login-art:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,30,.95) 0%,rgba(5,8,30,.55) 24%,transparent 46%)}
#scr-login{justify-content:flex-end;align-items:center}
#scr-login .hero{position:absolute;left:4vw;bottom:5vh;max-width:min(640px,58vw);z-index:1}
.hero-tag{font-size:18px;margin-top:0;text-shadow:0 2px 10px #000}
.hero-chips i{background:rgba(10,20,80,.6);border:1px solid var(--edge);box-shadow:0 0 12px rgba(47,168,255,.2);font-weight:800}
#scr-login .login-card{position:relative;top:auto;left:auto;z-index:1;margin-right:1vw;margin-top:40px}
.login-card{padding:28px 26px 22px}
.login-card:after{content:'WELCOME, FIGHTER';position:absolute;top:-13px;left:22px;font-family:var(--disp);font-size:14px;letter-spacing:2px;color:#fff;background:linear-gradient(90deg,var(--bl2),var(--pu));padding:3px 12px;border-radius:6px;box-shadow:0 0 14px rgba(47,168,255,.55)}

/* ---------- play screen ---------- */
#play-card small{color:var(--cy);letter-spacing:5px;text-shadow:0 0 10px rgba(47,168,255,.7)}
#play-card h2{font-size:34px;font-style:italic;color:#fff;text-shadow:0 3px 0 #0b2a8a,0 0 16px rgba(47,168,255,.5)}
#play-card .playbtn{font-size:44px}
#play-card #btn-create{font-size:20px}
#play-card #in-code{font-family:var(--disp);font-weight:400;font-size:22px;letter-spacing:6px;color:var(--ac)}
.minfo{background:linear-gradient(100deg,rgba(14,22,90,.85),rgba(8,12,48,.55));border:1px solid rgba(64,170,255,.25);border-left:6px solid var(--c);border-radius:12px;box-shadow:0 0 18px rgba(0,0,0,.35),-4px 0 18px -6px var(--c)}
.minfo b{font-size:22px;font-style:italic;text-shadow:0 2px 0 rgba(0,0,0,.5),0 0 12px color-mix(in srgb,var(--c) 55%,transparent)}
.maps-strip i{background:rgba(4,8,30,.7);font-weight:800;box-shadow:0 0 10px -2px var(--c)}
#plate b{font-family:var(--disp);font-weight:400;font-size:30px;text-shadow:0 3px 0 #0b2a8a,0 0 14px rgba(47,168,255,.7)}
#plate small{color:var(--cy)}

/* ---------- locker, shop, levels ---------- */
.scard{background:linear-gradient(180deg,rgba(40,70,220,.75),rgba(14,20,80,.92));border-radius:12px}
.scard.on,.ccard.on,.shop-card.on{border-color:var(--ac);box-shadow:0 0 0 2px rgba(255,210,58,.4),0 0 24px rgba(255,190,40,.45)}
.shop-card{background:linear-gradient(180deg,rgba(14,22,90,.9),rgba(6,9,34,.95));border:2px solid rgba(64,170,255,.28);border-radius:14px}
.shop-card:hover{border-color:rgba(143,227,255,.7);box-shadow:0 0 18px rgba(47,168,255,.35)}
.sc-art span{background:var(--rc,#9b5cf0);box-shadow:0 0 10px var(--rc,#9b5cf0)}
.sc-buy em{color:var(--cy);font-family:var(--disp);font-weight:400;font-size:17px}
.shop-wallet b{font-family:var(--disp);font-weight:400;color:var(--cy);text-shadow:0 0 12px rgba(47,168,255,.6)}
.shop-soon{background:rgba(47,168,255,.08);border:1px dashed rgba(64,170,255,.4)}
.lv-badge{background:radial-gradient(circle at 35% 30%,#fff27a,#ffd23a 45%,#ff8a14);color:#2a1300;box-shadow:0 0 0 3px rgba(10,16,60,.9),0 0 22px rgba(255,190,40,.5)}
.lv-bar{background:rgba(4,8,30,.75);border:1px solid rgba(64,170,255,.35)}

/* ---------- party lobby: top bar ---------- */
#hub-bar{top:14px;gap:10px}
#hub-bar>div{background:linear-gradient(165deg,rgba(22,34,118,.88),rgba(6,9,34,.92));border:1px solid var(--edge);border-radius:14px;box-shadow:0 0 18px rgba(47,168,255,.25),0 10px 26px rgba(0,0,8,.55)}
.hb-code b{font-size:26px;letter-spacing:6px;color:var(--ac);text-shadow:0 0 12px rgba(255,190,40,.5)}
.hb-code span{color:var(--cy)}
.hb-mid b{font-size:20px;font-style:italic;text-shadow:0 2px 0 #0b2a8a}
.hb-hint b{background:linear-gradient(180deg,#fff27a,#ffb21c);color:#2a1300;font-weight:900}

/* ---------- party panel (ESC in the lobby) and pause ---------- */
#pause{background:radial-gradient(ellipse at center,rgba(10,16,70,.55),rgba(3,5,20,.88))}
#pause .card{min-width:min(520px,94vw);padding:26px 26px 22px}
#pause-title{font-size:38px;font-style:italic;color:#fff;text-shadow:0 3px 0 #0b2a8a,0 0 18px rgba(47,168,255,.6)}
#party-panel2{gap:9px}
#party-panel2 label{display:flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:400;font-size:15px;letter-spacing:1.5px;color:var(--cy);margin-top:6px}
#party-panel2 label:before{content:'';width:8px;height:8px;transform:rotate(45deg);background:linear-gradient(135deg,var(--cy),var(--bl2));box-shadow:0 0 8px var(--bl)}
#party-panel2 label.check{font-family:'Inter',sans-serif;font-size:14px;letter-spacing:0;color:#fff}
#party-panel2 label.check:before{display:none}
.pp-head{background:linear-gradient(120deg,rgba(26,77,255,.35),rgba(122,60,255,.25));border:1px solid var(--edge);border-radius:14px;box-shadow:inset 0 0 20px rgba(47,168,255,.15)}
.pp-code span{color:var(--cy)}
.pp-code b{font-size:36px;letter-spacing:8px;color:var(--ac);text-shadow:0 2px 0 #8a3a00,0 0 16px rgba(255,190,40,.5)}
.pp-members li{background:rgba(4,8,30,.6);border:1px solid rgba(64,170,255,.25)}
.pp-desc{color:#a9b8ea;line-height:1.45}
.pp-game{background:linear-gradient(120deg,rgba(26,77,255,.35),rgba(255,140,30,.18));border:1px solid rgba(143,227,255,.6);box-shadow:0 0 18px rgba(47,168,255,.3);animation:pulseEdge 2.2s ease-in-out infinite}
@keyframes pulseEdge{50%{box-shadow:0 0 28px rgba(47,168,255,.55)}}
#party-panel2 .playbtn{font-size:34px;margin-top:10px}
#party-panel2 #pp-code{font-family:var(--disp);font-weight:400;font-size:20px;letter-spacing:6px;color:var(--ac);text-align:center}
.pp-wait{background:rgba(47,168,255,.08);border:1px dashed rgba(64,170,255,.45);color:#c6d3ff}

/* ---------- settings ---------- */
.kb{background:rgba(4,8,30,.6);border:1px solid rgba(64,170,255,.22)}
.kb:hover{border-color:rgba(143,227,255,.6)}
.kb b{background:rgba(26,77,255,.3);color:var(--ac);font-family:var(--disp);font-weight:400;font-size:13px}
.kb.wait{border-color:var(--ac)}.kb.wait b{background:var(--ac);color:#2a1300}

/* ---------- end screen ---------- */
#end{background:radial-gradient(ellipse at center,rgba(10,16,70,.5),rgba(3,5,20,.9))}
#end .card{padding:26px 26px 22px;min-width:min(480px,94vw)}
#end-title{font-size:84px;font-style:italic;line-height:1;background:linear-gradient(180deg,#fff58a,#ffd23a 45%,#ff8a14);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 5px 0 #0b2a8a) drop-shadow(0 0 22px rgba(47,168,255,.55))}
#end-sub{color:#c6d3ff;font-weight:700}
.end-stats div{background:linear-gradient(180deg,rgba(26,77,255,.3),rgba(4,8,30,.75));border:1px solid rgba(64,170,255,.35);border-radius:12px}
.end-stats b{font-size:36px;color:var(--ac);text-shadow:0 0 12px rgba(255,190,40,.45)}
.end-stats span{color:var(--cy);font-weight:800;letter-spacing:1px;text-transform:uppercase}
#end-board th,#board th{color:var(--cy)}
.xpgain{font-family:var(--disp);color:var(--cy);text-shadow:0 0 12px rgba(47,168,255,.7)}

/* ---------- connection lost ---------- */
#conn{background:rgba(3,5,20,.85)}

/* small screens */
@media (max-width:1100px){#scr-login .login-art{width:100vw;-webkit-mask-image:none;mask-image:none;opacity:.55}#scr-login .hero{display:none}#scr-login{justify-content:center}}
@media (max-height:760px){#play-card .playbtn{font-size:36px}.playbtn{font-size:38px}#end-title{font-size:64px}}

#hub-bar>.hb-hint{display:block;line-height:1.35;align-self:stretch;padding-top:10px}
.hb-hint b{display:inline-block}

/* ===== key art always shown whole (16:9, never cropped); blurred copy fills the rest of the screen ===== */
#loading .load-bg,#scr-login .login-bg{position:absolute;inset:-60px;background:url(/assets/loading.jpg) center/cover no-repeat;filter:blur(34px) brightness(.5) saturate(1.35);pointer-events:none}
#loading .load-frame{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(100vw,calc(100vh * 16 / 9));aspect-ratio:16/9;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent),linear-gradient(0deg,transparent,#000 3%,#000 97%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent),linear-gradient(0deg,transparent,#000 3%,#000 97%,transparent);mask-composite:intersect}
#loading .load-frame .load-art{position:absolute;inset:0;background:url(/assets/loading.jpg) center/100% 100% no-repeat;transform:none;animation:none}
#loading .load-frame .load-art::after{display:none}
#loading .load-in{position:absolute;left:0;right:0;bottom:2.2%;gap:.7vmin}
#loading .loadbar{width:31%;height:clamp(8px,1.15vmin,13px)}
#loading-txt{font-size:clamp(11px,1.45vmin,16px)}
#loading-tip{font-size:clamp(10px,1.25vmin,14px)}
@media (max-aspect-ratio:1/1){#loading .load-frame{width:100vw}#loading .loadbar{width:60%}}

/* login: no empty top bar, art whole on the left of the card */
body.on-login #topbar{display:none}
#scr-login .login-art{top:50%;left:0;bottom:auto;transform:translateY(-50%);width:min(calc(100vw - min(470px,36vw)),calc(100vh * 16 / 9));aspect-ratio:16/9;background:url(/assets/loading.jpg) center/100% 100% no-repeat;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 90%,transparent 100%),linear-gradient(0deg,transparent,#000 4%,#000 96%,transparent);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,#000 0%,#000 90%,transparent 100%),linear-gradient(0deg,transparent,#000 4%,#000 96%,transparent);mask-composite:intersect}
#scr-login .login-art:after{background:linear-gradient(0deg,rgba(5,8,30,.85) 0%,rgba(5,8,30,.35) 16%,transparent 30%)}
body.on-login #menu{background:linear-gradient(90deg,transparent 0%,transparent 55%,rgba(5,8,30,.55) 70%,rgba(5,8,30,.82) 100%)}
#scr-login .login-card{margin-top:0}
#scr-login .hero{bottom:3.5vh}
@media (max-width:1100px){#scr-login .login-art{width:min(100vw,calc(100vh * 16 / 9));opacity:.5}}
/* browser autofill: keep the dark fields */
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-text-fill-color:#fff;caret-color:#fff;-webkit-box-shadow:0 0 0 1000px #070c2a inset;box-shadow:0 0 0 1000px #070c2a inset;transition:background-color 9999s}

/* ===== admin panel ===== */
#tabs .admin-tab{color:#ff9d6a}#tabs .admin-tab.on:after{background:linear-gradient(90deg,#ff5a3a,#ffb21c)}
#scr-admin{position:absolute;left:50%;top:80px;transform:translateX(-50%);width:min(1240px,97vw);height:calc(100vh - 96px)}
.fpanel.admin{width:100%;height:100%;overflow:hidden;gap:12px}
.adm-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
#adm-stats{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}#adm-stats span{background:rgba(4,8,30,.6);border:1px solid rgba(64,170,255,.3);border-radius:999px;padding:4px 11px;font-size:12px;color:#c6d3ff}#adm-stats b{color:var(--ac)}
#adm-nflags:not(:empty){background:#ff4a3a;color:#fff;border-radius:999px;padding:0 6px;margin-left:4px;font-family:'Inter',sans-serif;font-size:11px}
#adm-body{flex:1;min-height:0;overflow:auto}
.adm-split{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:14px;height:100%;min-height:0}
.adm-list{display:flex;flex-direction:column;gap:8px;min-height:0}.adm-list input{width:100%}
#adm-users{overflow:auto;display:flex;flex-direction:column;gap:6px;padding-right:4px;min-height:0;flex:1}
.adm-u{background:rgba(4,8,30,.55);border:1px solid rgba(64,170,255,.2);border-radius:10px;padding:8px 11px;cursor:pointer;transition:.12s}
.adm-u:hover{border-color:rgba(143,227,255,.6)}.adm-u.on{border-color:var(--ac);box-shadow:0 0 14px rgba(255,190,40,.3)}.adm-u.ban{opacity:.65}
.adm-u b{font-size:15px}.adm-u small{display:block;color:#93a3d8;font-size:11.5px;margin-top:2px}
.tag{display:inline-block;font-size:10px;font-weight:900;letter-spacing:.5px;padding:1px 6px;border-radius:5px;background:rgba(255,255,255,.12);color:#dfe6ff;vertical-align:middle}
.tag.red{background:#d8322a;color:#fff}.tag.warn{background:#ff9f1c;color:#2a1300}
.adm-detail{overflow:auto;min-height:0;background:rgba(4,8,30,.35);border:1px solid rgba(64,170,255,.18);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:12px}
.adm-uh h3{font-family:var(--disp);font-weight:400;font-size:28px;font-style:italic;color:#fff;text-shadow:0 2px 0 #0b2a8a}.adm-uh small{color:#93a3d8}
.adm-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.adm-kpis div{background:linear-gradient(180deg,rgba(26,77,255,.28),rgba(4,8,30,.7));border:1px solid rgba(64,170,255,.3);border-radius:10px;padding:8px;text-align:center;display:flex;flex-direction:column}
.adm-kpis b{font-family:var(--disp);font-weight:400;font-size:22px;color:var(--ac)}.adm-kpis span{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--cy)}
.adm-acts{display:flex;flex-direction:column;gap:8px}
.adm-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:rgba(4,8,30,.45);border-radius:10px;padding:8px 10px}
.adm-row>label{min-width:96px;font-family:var(--disp);font-size:14px;letter-spacing:1px;color:var(--cy);text-transform:uppercase}
.adm-row input:not([type=checkbox]),.adm-row select{flex:1;min-width:120px;padding:8px 10px;font-size:14px}
.adm-row select{background:rgba(4,8,30,.85);border:2px solid rgba(64,170,255,.3);color:#fff;border-radius:10px;font-family:inherit}
.adm-row.danger{border:1px solid rgba(255,90,58,.35)}
.btn.red{background:linear-gradient(180deg,#ff5a4a,#c42a20);border-color:#ffb0a0;box-shadow:0 4px 0 #6a120c,0 0 14px rgba(255,80,60,.3)}
.adm-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.adm-cols h5{font-family:var(--disp);font-weight:400;color:var(--cy);letter-spacing:1.5px;margin:4px 0 6px}
.adm-flag{background:rgba(255,90,58,.12);border-left:3px solid #ff5a3a;border-radius:6px;padding:6px 9px;margin-bottom:5px}.adm-flag b{display:block;font-size:13px}.adm-flag small{color:#c6a9a0;font-size:11px}
.adm-items{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}.adm-items span{background:rgba(26,77,255,.25);border:1px solid rgba(64,170,255,.3);border-radius:999px;padding:3px 4px 3px 10px;font-size:12px;display:flex;gap:5px;align-items:center}
.adm-items i{font-style:normal;cursor:pointer;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.1)}.adm-items i:hover{background:#d8322a}
.adm-log{font-size:12.5px;padding:3px 0;border-bottom:1px solid rgba(255,255,255,.06)}.adm-log small{color:#8494c8}.adm-log .pos{color:#7dff9b}.adm-log .neg{color:#ff8a7a}
.adm-table{overflow:auto}.adm-table table{width:100%;border-collapse:collapse;font-size:13px}
.adm-table th{text-align:left;font-size:11px;color:var(--cy);letter-spacing:1px;text-transform:uppercase;padding:6px 8px;border-bottom:1px solid rgba(64,170,255,.3)}
.adm-table td{padding:7px 8px;border-bottom:1px solid rgba(255,255,255,.06)}.adm-table tr.ban td{opacity:.6}
.adm-match{background:rgba(4,8,30,.55);border:1px solid rgba(64,170,255,.25);border-radius:10px;padding:8px 11px;margin-bottom:6px;display:flex;flex-direction:column;gap:2px}.adm-match small{color:#93a3d8}.adm-match span{font-size:12.5px}
.adm-empty{color:#8494c8;text-align:center;padding:24px}
.adm-note{font-size:13px;margin-bottom:10px;line-height:1.5}
.adm-set{max-width:560px;display:flex;flex-direction:column;gap:12px;padding:6px 4px}.adm-set .playbtn{font-size:30px}
@media (max-width:900px){.adm-split,.adm-cols{grid-template-columns:1fr}.adm-kpis{grid-template-columns:repeat(3,1fr)}}
input[type=number]{padding:11px 13px;font-size:15px;font-family:inherit}input[type=number]::-webkit-inner-spin-button{opacity:.4}

/* ================= TOUCH CONTROLS (phones / tablets) ================= */
#touch{position:absolute;inset:0;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;z-index:5}
#touch.hidden{display:none}
body.touch,body.touch *{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
body.touch #hud{touch-action:none}
#tj{position:absolute;width:calc(var(--jr) * 2);height:calc(var(--jr) * 2);margin:calc(var(--jr) * -1) 0 0 calc(var(--jr) * -1);border-radius:50%;
  --jr:min(70px,16vh);left:calc(var(--jr) + 7vw);top:calc(100% - var(--jr) - 9vh);border:2px solid rgba(255,255,255,.25);background:radial-gradient(circle,rgba(10,16,60,.25),rgba(10,16,60,.5));opacity:.55;pointer-events:none;transition:opacity .15s}
#tj.on{opacity:1;border-color:rgba(127,208,255,.7);box-shadow:0 0 18px rgba(47,168,255,.4)}
#tj.sprint{border-color:var(--ac);box-shadow:0 0 18px rgba(255,210,58,.6)}
#tj i{position:absolute;left:50%;top:50%;width:46%;height:46%;margin:-23% 0 0 -23%;border-radius:50%;background:radial-gradient(circle at 40% 35%,#fff,#bfe6ff 40%,#2fa8ff);box-shadow:0 3px 10px #0008}
.tb{position:absolute;width:var(--s,56px);height:var(--s,56px);border-radius:50%;border:2px solid rgba(255,255,255,.35);background:rgba(8,12,40,.55);color:#fff;
  font:900 calc(var(--s,56px) * .38)/1 'Inter',system-ui,sans-serif;display:flex;align-items:center;justify-content:center;padding:0;pointer-events:auto;touch-action:none;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.tb.dn{transform:scale(.92);background:rgba(47,168,255,.55);border-color:#bfe6ff}
.tb.act{background:rgba(255,210,58,.55);border-color:#fff3b0}
.tb-fire{--s:min(96px,23vh);right:4vw;bottom:9vh;border:3px solid #fff3b0;background:radial-gradient(circle at 50% 40%,rgba(255,138,20,.7),rgba(160,40,0,.65))}
.tb-fire:before,.tb-fire2:before{content:"";width:42%;height:42%;border-radius:50%;border:3px solid #fff;box-shadow:inset 0 0 0 4px transparent,0 0 0 2px #0004;background:radial-gradient(circle,#fff 0 12%,transparent 13%)}
.tb-fire.dn,.tb-fire2.dn{background:radial-gradient(circle at 50% 40%,#ffd23a,#ff6a00)}
.tb-fire2{--s:min(62px,15vh);left:3vw;top:30vh;border:3px solid #fff3b0;background:radial-gradient(circle at 50% 40%,rgba(255,138,20,.6),rgba(160,40,0,.55))}
.tb-ads{--s:min(62px,15vh);right:calc(4vw + min(96px,23vh) + 14px);bottom:7vh}
.tb-jump{--s:min(66px,16vh);right:calc(4vw + 6px);bottom:calc(9vh + min(96px,23vh) + 14px)}
.tb-crouch{--s:min(54px,13vh);right:calc(4vw + min(96px,23vh) + 18px);bottom:calc(7vh + min(62px,15vh) + 12px)}
.tb-reload{--s:min(54px,13vh);right:calc(4vw + min(66px,16vh) + 22px);bottom:calc(9vh + min(96px,23vh) + 30px)}
.tb-use{--s:min(70px,17vh);right:calc(4vw + min(96px,23vh) + 20px);bottom:calc(9vh + min(96px,23vh) + 20px);border-radius:16px;width:auto;padding:0 14px;font-size:16px;background:rgba(47,168,255,.6);border-color:#bfe6ff}
.tb-pause{--s:44px;left:12px;top:10px;font-size:14px}
.tb-board{--s:44px;left:64px;top:10px;font-size:20px}
.tb-emote{--s:44px;left:116px;top:10px;font-size:22px}
#touch.nocombat .tb-fire,#touch.nocombat .tb-fire2,#touch.nocombat .tb-ads,#touch.nocombat .tb-reload{display:none}
#touch.dead .tb-jump,#touch.dead .tb-crouch,#touch.dead .tb-emote,#touch.dead #tj{display:none}
.tb.hidden{display:none}
/* HUD rearranged around the thumbs */
body.touch #compass{top:6px;width:220px;height:24px}
body.touch #compass-in{transform:translateX(calc(110px - (360px + var(--deg,0) * 3px)))}
body.touch #arena-bar,body.touch #hub-bar{top:34px;transform:translateX(-50%) scale(.82);transform-origin:top center}
body.touch #top-right{top:8px;right:10px;transform:scale(.85);transform-origin:top right}
body.touch #bottom{bottom:6px;gap:10px;pointer-events:none}
body.touch #stats{position:absolute;left:12px;top:62px;width:min(200px,26vw)}
body.touch #ammo{position:absolute;right:calc(4vw + min(96px,23vh) + 14px);bottom:calc(7vh + min(62px,15vh) + 4px);width:auto;transform:translateX(-0px);display:none}
body.touch #ammo-main{font-size:30px}body.touch #ammo-res{font-size:12px}
body.touch #slots{pointer-events:auto;gap:4px;position:relative;z-index:6}
body.touch .slot{width:min(50px,12vh);height:min(50px,12vh)}
body.touch .slot .k{display:none}
body.touch #prompt{top:auto;bottom:24vh;font-size:14px}
body.touch #wheel,body.touch #board{pointer-events:auto;z-index:7}
body.touch #wheel-list div{padding:14px 18px;font-size:16px}
body.touch #wheel .wcard p{display:none}
body.touch #board{min-width:0;width:min(560px,92vw);max-height:84vh}
body.touch #crosshair{--gap:7px}
body.touch #lockhint{display:none!important}
@media (max-height:500px){body.touch #killfeed{display:none}}
/* turn your phone sideways */
#rotate{display:none}
@media (orientation:portrait){body.touch #rotate{display:flex;position:fixed;inset:0;z-index:999;background:radial-gradient(ellipse at 50% 40%,#16196b,#070b1f 70%);color:#fff;align-items:center;justify-content:center;flex-direction:column;gap:18px;text-align:center;font:900 22px 'Lilita One',sans-serif;letter-spacing:1px}
  body.touch #rotate i{font-size:64px;font-style:normal;animation:rot 1.6s ease-in-out infinite}}
@keyframes rot{0%,20%{transform:rotate(0)}60%,100%{transform:rotate(90deg)}}
.adm-set textarea{width:100%;box-sizing:border-box;background:rgba(4,8,30,.8);color:#e8ecff;border:1px solid var(--edge,#ffffff33);border-radius:10px;padding:10px;font:12px/1.4 ui-monospace,Consolas,monospace;resize:vertical}
/* small screens (phones): the whole menu is scaled down as one piece; vh-based sizes are corrected for the zoom */
body.mz #menu,body.mz #pause,body.mz #end,body.mz #conn{zoom:var(--mz)}
body.mz #scr-settings{max-height:calc(100vh / var(--mz) - 110px)}
body.mz .set-scroll{max-height:calc(58vh / var(--mz))}
body.mz #scr-shop,body.mz #scr-shop .fpanel,body.mz #scr-levels,body.mz #scr-levels .fpanel{max-height:calc(100vh / var(--mz) - 100px)}
body.mz #scr-locker,body.mz #scr-locker .fpanel{max-height:calc(100vh / var(--mz) - 110px)}
body.mz #scr-admin{height:calc(100vh / var(--mz) - 96px)}
body.mz #plate{bottom:calc(10vh / var(--mz))}
body.mz #scr-login .login-art{width:min(calc(100vw / var(--mz) - min(470px,36vw / var(--mz))),calc(100vh / var(--mz) * 16 / 9))}
body.mz #pause .card{max-height:calc(92vh / var(--mz))}
body.mz #end .card{max-height:calc(94vh / var(--mz))}
body.mz #end-board{max-height:calc(34vh / var(--mz))}
body.mz.touch #keylist,body.mz.touch #keys-reset,body.touch .keys-sec{display:none}
.ot{display:none}body.touch .ot{display:inline}body.touch .nt{display:none}
body.touch #hub-bar{pointer-events:auto;z-index:6}
body.touch #stats{position:fixed;left:172px;top:12px;width:min(190px,22vw)}
body.touch #stats .bar.hp{height:20px}

/* ===== download screen ===== */
#scr-download{position:absolute;left:50%;top:calc(50% + 32px);transform:translate(-50%,-50%);width:min(760px,94vw)}
.dl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:14px 0 8px}
.dl-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:18px;border-radius:14px;background:rgba(10,18,70,.7);border:1px solid rgba(64,170,255,.45);color:#f4f7ff;text-decoration:none;box-shadow:0 0 18px rgba(47,168,255,.18);transition:transform .15s}
.dl-card:hover{transform:translateY(-3px);border-color:#ffd23a}
.dl-card b{font:900 22px 'Lilita One',sans-serif;letter-spacing:1px;font-style:italic}
.dl-card span{color:#a9b8ea;font-size:13px;line-height:1.4}
.dl-btn{margin-top:auto;font-style:normal;font-weight:900;font-size:14px;padding:9px 14px;border-radius:10px;background:linear-gradient(180deg,#fff58a,#ffd23a 40%,#ff8a14);color:#2a1300;box-shadow:0 3px 0 #8a4100}
.dl-card.soon{opacity:.55;border-style:dashed}
.dl-card.soon .dl-btn{background:#33407a;color:#c9d3ff;box-shadow:none}
@media (max-width:760px){.dl-grid{grid-template-columns:1fr}}
#scr-download.on{display:flex;flex-direction:column;gap:6px}
#scr-download .dl-grid{width:100%}
#scr-download .hint{margin:6px 0 0}
/* levels: set headers and item levels */
.lv-set{margin:10px 2px 2px;font:900 15px 'Lilita One',sans-serif;letter-spacing:1.5px;font-style:italic;color:var(--sc);text-shadow:0 0 12px color-mix(in srgb,var(--sc) 55%,transparent)}
.lv-set small{font:600 11px 'Inter',sans-serif;letter-spacing:0;color:var(--dim);margin-left:6px;font-style:normal;text-shadow:none}
.lv-row.item{border-color:#ffffff2e;background:linear-gradient(90deg,#ffffff12,#ffffff06)}
.lv-row.item .lv-n{background:linear-gradient(180deg,#fff58a,#ffb21a);color:#2a1300}
.lv-row.item.ok .lv-n{background:#2fd27a;color:#05210f}
.lv-more{margin:10px 2px 4px;padding:10px;border-radius:10px;text-align:center;color:#c9d3ff;font-size:12px;font-weight:700;background:#ffffff0a;border:1px dashed #ffffff22}