:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;--panel: rgba(12, 20, 31, .58);--panel-strong: rgba(8, 13, 22, .9);--text: #f7fbff;--muted: #a9bdd1;--accent: #ffd166;--blue: #4ea1ff;--red: #ff6b5f;--line: rgba(255, 255, 255, .16)}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;background:#87c8f6}body{overscroll-behavior:none}button,input{font:inherit}.game-canvas{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;color:var(--text);text-shadow:0 2px 14px rgba(0,0,0,.36)}.hud.is-hidden,.menu-panel.is-hidden{display:none}.hud-row{position:absolute;left:24px;top:18px;display:grid;grid-template-columns:180px 148px;gap:10px;width:max-content}.hud-block{min-height:58px;padding:10px 12px;border:1px solid var(--line);background:var(--panel);border-radius:8px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hud-block span{display:block;margin-bottom:4px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:0;text-transform:uppercase}.hud-block strong{font-size:22px;line-height:1}.health-block{min-width:180px}.health-meter{width:100%;height:18px;overflow:hidden;border:1px solid rgba(255,255,255,.22);border-radius:5px;background:#ffffff1f}.health-fill{width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#45d483,#ffd166);transition:width .14s ease,background .14s ease}.hud.danger .health-fill{background:linear-gradient(90deg,var(--red),#ffd166)}.hud-center{position:absolute;left:50%;top:31%;transform:translate(-50%);min-height:38px;padding:8px 14px;color:#fff9e7;font-weight:800;font-size:18px;text-align:center}.menu-panel{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;width:min(360px,calc(100vw - 32px));padding:14px;color:var(--text);border:1px solid var(--line);border-radius:8px;background:var(--panel-strong);box-shadow:0 24px 60px #00000040;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand{display:flex;gap:12px;align-items:center;margin-bottom:14px}.brand-mark{width:38px;height:38px;border-radius:8px;background:linear-gradient(135deg,#ffd166f2,#ff6b5feb),#ffd166;box-shadow:inset 0 -10px 24px #0003}.brand h1{margin:0;font-size:19px;line-height:1.1;letter-spacing:0}.brand p{margin:4px 0 0;color:var(--muted);font-size:12px;line-height:1.3}.menu-actions{display:grid;gap:8px}.menu-actions.is-hidden,.room-lobby.is-hidden{display:none}.menu-actions button,.menu-actions input,.room-lobby button{min-height:38px;border:1px solid var(--line);border-radius:8px}.menu-actions button,.room-lobby button{cursor:pointer;color:#111827;background:var(--accent);font-weight:800}.menu-actions button:hover,.room-lobby button:hover{filter:brightness(1.06)}.menu-actions .ghost,.room-lobby .ghost{color:var(--text);background:#ffffff14}.menu-actions form{display:grid;grid-template-columns:1fr 76px;gap:8px}.menu-actions input{width:100%;padding:0 10px;color:var(--text);background:#ffffff14;outline:none}.menu-actions input:focus{border-color:var(--accent)}.room-lobby{display:grid;gap:8px}.room-code-card{display:grid;gap:6px;min-height:94px;padding:12px;align-content:center;border:1px solid var(--line);border-radius:8px;background:#ffffff12;text-align:center}.room-code-card span{color:var(--muted);font-size:11px;font-weight:800;letter-spacing:0;text-transform:uppercase}.room-code-card strong{color:var(--accent);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:40px;line-height:1;letter-spacing:4px}.room-share-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.menu-controls{margin-top:10px;padding:10px;border:1px solid var(--line);border-radius:8px;color:var(--muted);background:#ffffff0f;font-size:12px;font-weight:700;line-height:1.35}.menu-status{margin-top:10px;color:var(--muted);font-size:12px;font-weight:700}@media (max-width: 860px){.hud-row{left:10px;top:10px;grid-template-columns:minmax(150px,1fr) 120px;width:min(100vw - 20px,310px)}.hud-block{min-height:50px;padding:8px}.hud-block strong{font-size:18px}.menu-panel{width:calc(100vw - 20px)}}