*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#02040a;color:#e9fbff;font-family:Inter,system-ui,Arial,sans-serif}button,input{font:inherit}#worldCanvas{position:fixed;inset:0;width:100vw;height:100vh;background:radial-gradient(circle at 50% 50%,#081d2a,#02040a 70%);touch-action:none}.hidden{display:none!important}.login-screen{position:fixed;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,#063449,#02040a 65%);z-index:20}.login-card{width:min(420px,92vw);padding:28px;border:1px solid #1be7ff66;border-radius:24px;background:#06101dcc;box-shadow:0 0 50px #00e5ff33;backdrop-filter:blur(12px)}.brand{letter-spacing:.35em;color:#00e5ff;text-shadow:0 0 18px #00e5ff}.brand.small{font-size:12px}.login-card h1{margin:10px 0 6px}.login-card p{opacity:.8}.login-card input,.panel input{width:100%;margin:8px 0;padding:12px;border:1px solid #18dfff55;background:#010913;color:white;border-radius:12px;outline:none}.login-card button,.controls button,.chat-actions button{border:1px solid #18dfff77;background:linear-gradient(135deg,#062236,#0b5162);color:white;border-radius:13px;padding:10px 12px;cursor:pointer;box-shadow:0 0 18px #00e5ff22}.msg{min-height:22px;color:#ff628a}.hud,.panel,.help{position:fixed;z-index:5;border:1px solid #18dfff4d;background:#03101bcc;box-shadow:0 0 24px #00e5ff1f, inset 0 0 22px #00e5ff0e;backdrop-filter:blur(10px);border-radius:18px}.top-left{top:14px;left:14px;padding:14px;width:220px}.top-right{top:14px;right:14px;padding:10px;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;max-width:430px}.metric{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:13px}.metric span{opacity:.7}.metric b{color:#86f7ff}.panel{padding:14px}.panel h2{font-size:15px;margin:0 0 10px;color:#bffaff}.left-panel{left:14px;top:190px;width:260px}.right-panel{right:14px;top:92px;width:300px;max-height:48vh;overflow:hidden}.list{max-height:34vh;overflow:auto}.user-row{padding:9px;margin:7px 0;border:1px solid #18dfff2e;border-radius:13px;background:#061827b3;cursor:pointer}.user-row:hover{border-color:#00e5ff}.user-row b{color:#fff}.user-row small{display:block;opacity:.72;line-height:1.35}.selected{font-size:13px;opacity:.9;line-height:1.4}.bottom-panel{left:290px;right:330px;bottom:14px;height:180px}.chat-head{display:flex;justify-content:space-between;gap:10px}.chat-log{height:92px;overflow:auto;font-size:13px;margin:10px 0;padding:8px;background:#020812;border-radius:12px}.chat-msg{margin:5px 0}.chat-msg b{color:#73f4ff}.chat-actions{display:flex;gap:8px}.chat-actions input{flex:1;margin:0;padding:10px;border-radius:12px;border:1px solid #18dfff55;background:#010913;color:white}.help{left:50%;transform:translateX(-50%);bottom:205px;padding:9px 14px;font-size:12px;opacity:.78}.mobile-joy{display:none;position:fixed;z-index:9;width:112px;height:112px;border-radius:50%;bottom:28px;border:1px solid #18dfff66;background:#05131ecc;touch-action:none}.mobile-joy div{position:absolute;width:42px;height:42px;border-radius:50%;left:35px;top:35px;background:#00e5ff77;box-shadow:0 0 18px #00e5ff}.left-joy{left:18px}.right-joy{right:18px}@media(max-width:850px){.top-left{width:170px;font-size:12px}.top-right{left:190px;right:8px;top:8px}.controls button{padding:8px;font-size:12px}.left-panel{display:none}.right-panel{right:8px;top:145px;width:220px;max-height:35vh}.bottom-panel{left:8px;right:8px;bottom:154px;height:160px}.help{display:none}.mobile-joy{display:block}.chat-log{height:75px}.chat-actions button{padding:8px}.chat-actions input{min-width:0}}


/* PATCH YOUPLUGS FPS/PSEUDO RESPONSIVE */
.top-right.controls{max-width:min(760px,calc(100vw - 255px));align-items:center}
.controls button{white-space:nowrap}
.panel{transition:opacity .18s ease, transform .18s ease}
.panel-close{position:absolute;right:9px;top:8px;z-index:3;padding:4px 9px;border-radius:10px}
.right-panel,.left-panel,.bottom-panel{overflow:auto}
body.fps-mode{cursor:crosshair}
body.fps-mode #worldCanvas{cursor:crosshair}
body.fps-mode .help{opacity:1;color:#bffaff;border-color:#00e5ff99}
button.active{box-shadow:0 0 22px #00e5ff88!important;border-color:#00e5ff!important}
@media(max-width:1050px){
  .top-left{top:8px;left:8px;width:180px}
  .top-right{top:8px;left:196px;right:8px;max-width:none;justify-content:flex-start}
  .controls button{padding:7px 9px;font-size:12px}
  .left-panel{left:8px;top:158px;width:245px;max-height:38vh}
  .right-panel{right:8px;top:158px;width:260px;max-height:38vh}
  .bottom-panel{left:8px;right:8px;bottom:10px;height:160px}
}
@media(max-width:720px){
  .top-left{position:fixed;top:6px;left:6px;width:calc(50vw - 10px);padding:9px}
  .top-right{top:6px;left:calc(50vw + 2px);right:6px;max-height:142px;overflow:auto;padding:7px;gap:5px}
  .controls button{font-size:11px;padding:6px 7px}
  .left-panel,.right-panel{left:8px!important;right:8px!important;width:calc(100vw - 16px)!important;top:154px!important;max-height:38vh}
  .bottom-panel{left:8px!important;right:8px!important;bottom:132px!important;height:155px}
  .panel.hidden-mobile{display:none!important}
  .mobile-joy{display:block}
}