*{box-sizing:border-box}html,body{background:#7fd4ff;margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}canvas{display:block}#hud{pointer-events:none;color:#fff;position:fixed;inset:0}.hud-title{letter-spacing:2px;text-shadow:0 2px 8px #00000059;font-size:22px;font-weight:800;position:absolute;top:16px;left:20px}.hud-time{font-variant-numeric:tabular-nums;text-shadow:0 2px 8px #00000059;font-size:22px;font-weight:700;position:absolute;top:16px;right:20px}.hud-hint{opacity:.85;text-shadow:0 1px 4px #0006;font-size:13px;position:absolute;bottom:14px;left:20px}.win-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:auto;background:#14142866;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.win-overlay.hidden{display:none}.win-card{color:#2a2a3a;text-align:center;background:#fff;border-radius:16px;padding:32px 48px;box-shadow:0 12px 40px #00000059}.win-card h1{margin:0 0 8px;font-size:32px}.win-time{color:#666;margin:0 0 20px;font-size:18px}.win-restart{color:#11402a;cursor:pointer;background:#51ff9e;border:none;border-radius:999px;padding:10px 28px;font-size:16px;font-weight:700}.win-restart:hover{filter:brightness(.95)}.hidden{display:none!important}.hud-toast{color:#fff;white-space:nowrap;background:#141428bf;border-radius:999px;padding:10px 22px;font-size:16px;font-weight:600;position:absolute;top:60px;left:50%;transform:translate(-50%)}.hud-next{pointer-events:auto;color:#11402a;cursor:pointer;background:#51ff9e;border:none;border-radius:999px;padding:10px 22px;font-size:15px;font-weight:700;position:absolute;bottom:18px;right:20px;box-shadow:0 4px 16px #0000004d}.hud-next:hover{filter:brightness(.95)}.win-waiting{color:#888;margin:0;font-size:14px}#lobby{z-index:10;background:linear-gradient(160deg,#7fd4ff 0%,#a3e8c8 100%);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.lobby-card{text-align:center;color:#2a2a3a;background:#fff;border-radius:20px;width:360px;max-width:calc(100vw - 40px);padding:36px 40px;box-shadow:0 16px 50px #14285040}.lobby-card h1{letter-spacing:2px;margin:0 0 6px;font-size:34px}.lobby-card h2{color:#888;text-transform:uppercase;letter-spacing:1px;margin:0 0 4px;font-size:16px;font-weight:600}.lobby-sub{color:#777;margin:0 0 20px;font-size:14px}.lobby-card input{border:2px solid #e0e0ee;border-radius:10px;outline:none;width:100%;margin-bottom:12px;padding:10px 14px;font-size:16px}.lobby-card input:focus{border-color:#9d8df1}.lobby-code{text-transform:uppercase;letter-spacing:3px;font-weight:700}.lobby-btn{cursor:pointer;border:none;border-radius:10px;width:100%;padding:12px 20px;font-size:16px;font-weight:700}.lobby-btn.primary{color:#fff;background:#9d8df1}.lobby-btn.primary:hover{filter:brightness(1.05)}.lobby-join-row{gap:8px;display:flex}.lobby-join-row .lobby-btn{color:#2a2a3a;background:#eee;width:auto}.lobby-divider{color:#aaa;align-items:center;gap:10px;margin:14px 0;font-size:13px;display:flex}.lobby-divider:before,.lobby-divider:after{content:"";background:#e0e0ee;flex:1;height:1px}.lobby-error{color:#d64545;min-height:18px;margin-top:8px;font-size:13px}.lobby-room-code{letter-spacing:6px;color:#9d8df1;margin:4px 0;font-size:40px;font-weight:800}.lobby-share{color:#888;margin:0 0 16px;font-size:13px}.lobby-players{text-align:left;max-height:200px;margin:0 0 20px;padding:0;list-style:none;overflow-y:auto}.lobby-players li{background:#f4f4fa;border-radius:8px;align-items:center;gap:10px;margin-bottom:6px;padding:8px 12px;font-size:15px;font-weight:600;display:flex}.lobby-players .dot{border-radius:50%;flex-shrink:0;width:14px;height:14px}.lobby-waiting{color:#888;font-size:14px}.hud-skills{pointer-events:auto;gap:10px;display:flex;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.skill-slot{cursor:default;background:#14142840;border:2px dashed #ffffff73;border-radius:12px;width:54px;height:54px;padding:0;position:relative}.skill-slot.filled{cursor:pointer;background:#1414288c;border:2px solid #fff;box-shadow:0 4px 14px #0000004d}.skill-slot.filled:hover{transform:scale(1.06)}.skill-icon{font-size:26px;line-height:54px}.skill-key{color:#fffc;font-size:11px;font-weight:700;position:absolute;bottom:2px;right:5px}#quiz{z-index:20;background:#14142859;justify-content:center;align-items:flex-end;padding-bottom:90px;display:flex;position:fixed;inset:0}.quiz-card{color:#2a2a3a;background:#fff;border-radius:16px;width:440px;max-width:calc(100vw - 40px);padding:0 0 18px;overflow:hidden;box-shadow:0 12px 40px #00000059}.quiz-card.quiz-good{outline:5px solid #51ff9e}.quiz-card.quiz-bad{outline:5px solid #ff5d5d}.quiz-bar{background:#eee;height:8px;margin-bottom:14px}.quiz-bar-fill{background:#9d8df1;height:100%;transition:width 50ms linear}.quiz-question{text-align:center;padding:0 20px 14px;font-size:18px;font-weight:700}.quiz-options{grid-template-columns:1fr 1fr;gap:8px;padding:0 16px;display:grid}.quiz-option{cursor:pointer;text-align:left;background:#f7f7fc;border:2px solid #e0e0ee;border-radius:10px;padding:12px 10px;font-size:15px;font-weight:600}.quiz-option:hover:not(:disabled){background:#efecff;border-color:#9d8df1}.quiz-option.picked{background:#e4dfff;border-color:#9d8df1}.quiz-option:disabled{cursor:default;opacity:.75}.lobby-settings{justify-content:center;align-items:center;gap:10px;margin-bottom:14px;display:flex}.lobby-quiz-toggle{cursor:pointer;align-items:center;gap:6px;font-size:14px;font-weight:600;display:flex}.lobby-quiz-toggle input{width:auto!important;margin:0!important}.topic-select{background:#fff;border:2px solid #e0e0ee;border-radius:8px;padding:6px 10px;font-size:14px}.lobby-mode{color:#888;min-height:16px;margin-bottom:12px;font-size:13px}.hud-countdown{color:#fff;text-shadow:0 6px 30px #0006;-webkit-user-select:none;user-select:none;font-size:110px;font-weight:900;position:absolute;top:34%;left:50%;transform:translate(-50%,-50%)}#scoreboard{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:15;background:#1414288c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.score-card{color:#2a2a3a;text-align:center;background:#fff;border-radius:20px;width:400px;max-width:calc(100vw - 40px);padding:30px 38px;box-shadow:0 16px 50px #00000059}.score-card h1{margin:0 0 4px;font-size:26px}.score-round{color:#888;margin:0 0 18px;font-size:14px}.score-list{margin:0 0 20px;padding:0;list-style:none}.score-list li{background:#f4f4fa;border-radius:10px;align-items:center;gap:10px;margin-bottom:6px;padding:9px 14px;font-size:15px;font-weight:600;display:flex}.score-list li.self{outline:2px solid #9d8df1}.score-list .dot{border-radius:50%;flex-shrink:0;width:14px;height:14px}.score-name{text-align:left;flex:1}.score-gained{color:#2eb85c;min-width:34px;font-weight:800}.score-points{text-align:right;min-width:28px;font-weight:800}.score-waiting,.win-note{color:#888;margin:0;font-size:14px}.lobby-code-row{justify-content:center;align-items:center;gap:12px;display:flex}.lobby-copy{color:#2a2a3a;cursor:pointer;white-space:nowrap;background:#fff;border:2px solid #e0e0ee;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:700}.lobby-copy:hover{border-color:#9d8df1}.hud-room{letter-spacing:1px;opacity:.85;text-shadow:0 1px 4px #0006;font-size:14px;font-weight:700;position:absolute;top:46px;left:20px}.hud-role{letter-spacing:.5px;text-shadow:0 2px 8px #00000059;font-size:15px;font-weight:800;position:absolute;top:94px;left:20px}.mode-select{background:#fff;border:2px solid #e0e0ee;border-radius:8px;padding:6px 10px;font-size:14px;font-weight:600}.hud-heartbeat{pointer-events:none;opacity:0;background:radial-gradient(#0000 52%,#ff1e1e8c 100%);position:absolute;inset:0}.bots-row{justify-content:center;align-items:center;gap:10px;margin-bottom:14px;display:flex}.bots-label{font-size:14px;font-weight:700}.bots-btn{cursor:pointer;color:#2a2a3a;background:#fff;border:2px solid #e0e0ee;border-radius:50%;width:30px;height:30px;font-size:18px;font-weight:800;line-height:1}.bots-btn:hover{border-color:#9d8df1}.bots-count{min-width:20px;font-size:16px;font-weight:800}#joystick{touch-action:none;z-index:12;background:#14142840;border:2px solid #fff6;border-radius:50%;width:128px;height:128px;position:fixed;bottom:90px;left:26px}.joystick-knob{pointer-events:none;background:#ffffffbf;border-radius:50%;width:56px;height:56px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 12px #0000004d}.profile{margin-bottom:16px}.profile-level{color:#6b5fd0;margin-bottom:6px;font-size:15px;font-weight:800}.xp-bar{background:#eee;border-radius:999px;height:8px;margin-bottom:10px;overflow:hidden}.xp-fill{background:linear-gradient(90deg,#9d8df1,#51ff9e);height:100%;transition:width .4s}.color-row{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.color-sw{cursor:pointer;text-align:center;border:2px solid #0000;border-radius:50%;width:26px;height:26px;padding:0;font-size:12px;line-height:22px}.color-sw.selected{border-color:#2a2a3a;transform:scale(1.15)}.color-sw.locked{cursor:default;opacity:.7;background:#eee}.score-awards{margin:-6px 0 18px;display:none}.score-award{color:#555;padding:4px 0;font-size:14px;font-weight:700}.hud-round{opacity:.9;text-shadow:0 1px 4px #0006;font-size:13px;font-weight:700;position:absolute;top:70px;left:20px}.profile-daily{color:#999;margin-bottom:6px;font-size:12px;font-weight:600}