*{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e0;background:#0a0a0f;height:100vh;font-family:Segoe UI,sans-serif;overflow:hidden}#app{width:100vw;height:100vh}.screen{flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.screen.hidden{display:none}h1{background:linear-gradient(135deg,#f39c12,#e74c3c);-webkit-text-fill-color:transparent;letter-spacing:4px;text-transform:uppercase;-webkit-background-clip:text;margin-bottom:8px;font-size:3rem;font-weight:900}.subtitle{color:#888;letter-spacing:2px;margin-bottom:24px;font-size:.9rem}.panel{background:#ffffff0a;border:1px solid #ffffff14;border-radius:12px;flex-direction:column;gap:14px;min-width:340px;padding:32px 40px;display:flex}input[type=text]{color:#fff;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:8px;outline:none;padding:10px 14px;font-size:1rem;transition:border-color .2s}input[type=text]:focus{border-color:#f39c12}input[type=text]::placeholder{color:#555}.btn{cursor:pointer;letter-spacing:.5px;border:none;border-radius:8px;padding:11px 20px;font-size:.95rem;font-weight:600;transition:transform .1s,opacity .2s}.btn:active{transform:scale(.97)}.btn-primary{color:#000;background:#f39c12}.btn-secondary{color:#ccc;background:#ffffff14;border:1px solid #ffffff1f}.btn:disabled{opacity:.4;cursor:default}.class-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.class-card{cursor:pointer;background:#ffffff08;border:2px solid #ffffff14;border-radius:8px;padding:14px;transition:border-color .2s,background .2s}.class-card:hover{background:#ffffff12}.class-card.selected{background:#f39c121a;border-color:#f39c12}.class-card h3{margin-bottom:4px;font-size:.9rem}.class-card p{color:#777;font-size:.75rem}.room-code{letter-spacing:8px;color:#f39c12;text-align:center;font-family:monospace;font-size:2.5rem;font-weight:900}.label{color:#666;text-transform:uppercase;letter-spacing:1px;font-size:.75rem}#player-list{flex-direction:column;gap:8px;min-height:40px;display:flex}.player-entry{background:#ffffff0d;border-radius:6px;align-items:center;gap:10px;padding:8px 12px;font-size:.9rem;display:flex}.player-dot{border-radius:50%;width:10px;height:10px}.error-msg{color:#e74c3c;text-align:center;min-height:20px;font-size:.85rem}#hud{pointer-events:none;z-index:10;justify-content:space-between;align-items:flex-start;padding:10px 16px;display:flex;position:fixed;top:0;left:0;right:0}#hud.hidden{display:none}.hud-players{gap:12px;display:flex}.hud-player{background:#0009;border:1px solid #ffffff14;border-radius:8px;min-width:120px;padding:6px 10px}.hud-player .name{color:#ccc;margin-bottom:4px;font-size:.75rem}.hp-bar-bg{background:#2a2a2a;border-radius:4px;height:8px;overflow:hidden}.hp-bar{border-radius:4px;height:100%;transition:width .15s}.hud-player.dead{opacity:.4}.hud-right{flex-direction:column;align-items:flex-end;gap:6px;display:flex}.floor-badge{color:#f39c12;background:#0009;border:1px solid #f39c124d;border-radius:8px;padding:6px 12px;font-size:.85rem}.cooldown-bar{color:#aaa;background:#0009;border:1px solid #ffffff14;border-radius:8px;padding:6px 10px;font-size:.7rem}#inventory-panel{z-index:10;pointer-events:all;gap:8px;display:flex;position:fixed;bottom:10px;left:50%;transform:translate(-50%)}#inventory-panel.hidden{display:none}.inv-slot{color:#aaa;cursor:pointer;text-align:center;background:#0009;border:1px solid #ffffff1f;border-radius:8px;justify-content:center;align-items:center;width:48px;height:48px;padding:4px;font-size:.6rem;transition:border-color .2s;display:flex}.inv-slot:hover{border-color:#f39c12}#loot-popup{z-index:20;pointer-events:all;background:#000000e6;border:1px solid #f39c12;border-radius:10px;flex-direction:column;gap:8px;min-width:200px;padding:14px 20px;display:flex;position:fixed;bottom:80px;left:50%;transform:translate(-50%)}#loot-popup.hidden{display:none}#loot-popup h3{color:#f39c12;font-size:.85rem}#loot-popup p{color:#ccc;font-size:.8rem}.loot-btns{gap:8px;margin-top:4px;display:flex}#meta-screen{z-index:50;background:#000000eb;flex-direction:column;justify-content:center;align-items:center;gap:24px;display:flex;position:fixed;inset:0}#meta-screen.hidden{display:none}.upgrade-cards{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.upgrade-card{cursor:pointer;text-align:center;background:#ffffff0a;border:2px solid #ffffff1a;border-radius:12px;min-width:180px;padding:24px 28px;transition:border-color .2s,background .2s}.upgrade-card:hover{background:#f39c1214;border-color:#f39c12}.upgrade-card h3{color:#f39c12;margin-bottom:8px;font-size:1rem}.upgrade-card p{color:#999;font-size:.8rem}#floor-banner{color:#f39c12;text-shadow:0 0 20px #f39c12cc;pointer-events:none;z-index:30;opacity:0;letter-spacing:4px;text-transform:uppercase;font-size:2rem;font-weight:900;transition:opacity .3s;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}#floor-banner.show{opacity:1}#game-container{position:fixed;inset:0}#game-container.hidden{display:none}canvas{cursor:crosshair;display:block}.controls-hint{color:#666;text-align:center;margin-top:4px;font-size:.72rem;line-height:1.5}#toast{color:#cdeeff;z-index:28;opacity:0;pointer-events:none;text-align:center;background:#0a0c14eb;border:1px solid #4fd0ff66;border-radius:10px;max-width:90vw;padding:10px 18px;font-size:.85rem;transition:opacity .25s,transform .25s;position:fixed;top:64px;left:50%;transform:translate(-50%)translateY(-10px)}#toast.show{opacity:1;transform:translate(-50%)translateY(0)}