[hidden]{display:none!important}:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#fff;background:#080b19;color-scheme:dark}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden}body{background:radial-gradient(circle at 20% 10%,#273174,#080b19 50%)}button,input{font:inherit}.panel-wrap{height:100%;display:grid;place-content:center;gap:24px;padding:24px}.brand{display:flex;align-items:center;gap:16px}.brand-mark{width:70px;height:70px;border-radius:22px;display:grid;place-items:center;font-weight:900;font-size:25px;background:linear-gradient(135deg,#805cff,#19c6ff);box-shadow:0 14px 45px #5b45ff66}.brand h1{margin:0;font-size:42px}.brand p{margin:2px 0 0;color:#aab2d5}.panel{width:min(420px,calc(100vw - 32px));padding:24px;border:1px solid #ffffff20;border-radius:24px;background:#11162ddd;backdrop-filter:blur(18px);box-shadow:0 28px 70px #0008}.panel label{display:block;margin-bottom:16px;font-weight:700}.panel small{float:right;color:#8d96bb;font-weight:500}.panel input{display:block;width:100%;margin-top:8px;padding:14px 16px;border:1px solid #ffffff20;border-radius:13px;background:#080c1d;color:#fff;outline:none;text-transform:none}.panel input:focus{border-color:#7868ff}.panel button{width:100%;border:0;border-radius:14px;padding:15px;color:#fff;font-weight:900;background:linear-gradient(135deg,#7255ff,#00bde7);cursor:pointer}.hint,.error{text-align:center;color:#9ca6ca}.error{color:#ff8196;min-height:20px}#game,#world{width:100%;height:100%;display:block}#world{touch-action:none}#hud{position:fixed;top:max(12px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:4}.hud-card{padding:9px 14px;border-radius:14px;background:#0d1228d9;border:1px solid #ffffff26;backdrop-filter:blur(12px);font-size:12px;letter-spacing:.08em;white-space:nowrap}.hud-card strong{display:block;font-size:16px}.room-card strong,.role-card strong{display:inline;margin-left:5px}#players{position:fixed;left:12px;top:85px;z-index:4;max-width:220px;padding:10px;border-radius:14px;background:#0d1228b8;font-size:12px}#players div{padding:3px 4px}#crosshair{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);font-size:30px;text-shadow:0 2px 5px #000;z-index:3;pointer-events:none}#notice{position:fixed;top:22%;left:50%;transform:translateX(-50%);z-index:5;font-size:clamp(20px,5vw,44px);font-weight:900;text-shadow:0 4px 16px #000;text-align:center;pointer-events:none}#paintBar{position:fixed;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:7px;padding:8px;border-radius:18px;background:#0c1024cc;z-index:5}#paintBar button{width:36px;height:36px;border:3px solid #fff5;border-radius:12px;background:var(--c);cursor:pointer}#paintBar button.active{border-color:white;transform:translateY(-4px)}#leave{position:fixed;right:12px;top:max(12px,env(safe-area-inset-top));z-index:6;padding:9px 12px;border:1px solid #ffffff33;border-radius:12px;background:#0d1228cc;color:#fff}#mobileControls{display:none}.dead{opacity:.45;text-decoration:line-through}@media(pointer:coarse),(max-width:820px){#hud{top:8px;gap:5px}.hud-card{padding:7px 9px;font-size:9px}.hud-card strong{font-size:12px}.room-card{display:none}#players{display:none}#paintBar{bottom:12px}.brand h1{font-size:32px}#mobileControls{display:block}.role-card{margin-right:54px}#stick{position:fixed;left:24px;bottom:86px;width:116px;height:116px;border-radius:50%;background:#ffffff20;border:2px solid #ffffff26;z-index:5;touch-action:none}#knob{position:absolute;left:33px;top:33px;width:48px;height:48px;border-radius:50%;background:#ffffff9e}#action,#jump{position:fixed;z-index:5;border:0;border-radius:50%;color:#fff;font-weight:900;background:#7059ffd9;width:74px;height:74px;right:24px;bottom:92px}#jump{right:108px;bottom:35px;width:58px;height:58px;background:#11a9d6d9;font-size:11px}#crosshair{font-size:22px}.hint{font-size:12px}}@media(max-height:520px){#paintBar{bottom:5px;transform:translateX(-50%) scale(.85);transform-origin:bottom center}#stick{bottom:20px;transform:scale(.85);transform-origin:bottom left}#action{bottom:28px}#jump{bottom:12px}.panel-wrap{gap:10px}.brand-mark{width:48px;height:48px;border-radius:15px}.brand h1{font-size:28px}.panel{padding:16px}.panel label{margin-bottom:9px}.panel input{padding:10px}.hint{display:none}}

#lobbyOverlay{position:fixed;right:16px;bottom:16px;z-index:6;width:min(390px,calc(100vw - 32px));pointer-events:none}
#lobbyOverlay[hidden]{display:none}
.lobby-box{width:100%;padding:18px;border:1px solid #ffffff30;border-radius:18px;background:#0d1228e8;backdrop-filter:blur(18px);box-shadow:0 18px 55px #0008;text-align:left;pointer-events:auto}
.lobby-box .eyebrow{font-size:10px;letter-spacing:.18em;color:#72d8ff;font-weight:800}.lobby-box h2{margin:6px 0;font-size:23px}.lobby-box h2 strong{color:#9c8cff;letter-spacing:.12em}.lobby-box p{margin:6px 0 12px;color:#d6daf0}.lobby-box small{display:block;margin-top:10px;color:#929bbd;line-height:1.4}.lobby-actions{display:flex;gap:8px}.lobby-actions button{border:1px solid #ffffff25;border-radius:10px;padding:9px 11px;color:#fff;background:#7255ff;cursor:pointer}.lobby-actions button+button{background:#0faecf}
@media(max-width:600px){#lobbyOverlay{right:10px;bottom:10px;width:min(330px,calc(100vw - 20px))}.lobby-box{padding:13px}.lobby-box h2{font-size:18px}.lobby-box p{font-size:13px}.lobby-box small{font-size:11px}.lobby-actions button{padding:8px 9px;font-size:12px}}
@media(max-height:520px){#lobbyOverlay{right:8px;bottom:8px;width:310px}.lobby-box{padding:10px}.lobby-box small{display:none}.lobby-box h2{font-size:16px;margin:3px 0}.lobby-box p{font-size:11px;margin:3px 0 7px}}