:root{--ink: #10151a;--panel: #182129;--panel-soft: #202c36;--line: #35434e;--text: #edf3f5;--muted: #93a3ad;--gold: #f0b429;--teal: #2ec4b6;--danger: #e4572e;--good: #5dbb63;--purple: #9a6bdb}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{width:100%;height:100%;overflow:hidden;background:var(--ink);color:var(--text);font-family:SF Pro Display,PingFang SC,Microsoft YaHei,system-ui,sans-serif;user-select:none;-webkit-user-select:none;touch-action:none}canvas{display:block;width:100%;height:100%;background:#12181e}.hidden{display:none!important}.desktop-only{display:flex}.mobile-only,body.touch .desktop-only{display:none}body.touch .mobile-only{display:flex}#hud{position:fixed;inset:0;pointer-events:none;z-index:5}.hud-top{position:absolute;top:max(12px,env(safe-area-inset-top));left:12px;right:12px;display:flex;gap:10px;align-items:flex-start;justify-content:space-between}.player-panel{display:flex;gap:10px;align-items:center;background:#10151ab8;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:8px 10px;min-width:230px;backdrop-filter:blur(6px)}.level-badge{width:46px;height:46px;display:grid;place-items:center;border-radius:8px;background:linear-gradient(145deg,#f4c74f,#d18d16);color:#241a05;font-weight:800;font-size:14px;letter-spacing:0;box-shadow:0 3px 12px #f0b42947}.lives-box{display:grid;gap:2px;min-width:52px;text-align:center}.lives-base{color:#ff6b81;font-size:16px;font-weight:800;letter-spacing:0;line-height:1}.lives-temp{min-height:12px;color:#63c7ff;font-size:10px;font-weight:700}.bars{display:grid;gap:6px;flex:1;min-width:170px}.bar{position:relative;height:18px;border-radius:5px;background:#ffffff14;overflow:hidden;border:1px solid rgba(255,255,255,.1)}.bar-fill{width:100%;height:100%;transform-origin:left center;transform:scaleX(1);transition:transform .12s linear}.bar.hp .bar-fill{background:linear-gradient(90deg,#ff6b4a,#e4572e)}.bar.xp{height:12px}.bar.xp .bar-fill{background:linear-gradient(90deg,#34d1c0,#2ec4b6)}.bar span{position:absolute;inset:0;display:grid;place-items:center;font-size:11px;font-weight:700;letter-spacing:0;text-shadow:0 1px 2px rgba(0,0,0,.9)}.score-panel{display:grid;gap:4px;background:#10151ab8;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:8px 12px;color:var(--muted);font-size:12px;backdrop-filter:blur(6px)}.score-panel b{color:var(--text);font-size:14px;min-width:34px;display:inline-block;text-align:right}.skill-panel{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end;max-width:45vw}.skill-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;background:#10151ab8;border:1px solid rgba(255,255,255,.14);border-radius:6px;font-size:12px;color:var(--text);backdrop-filter:blur(6px)}.skill-chip .chip-icon{width:18px;height:18px;display:grid;place-items:center;border-radius:5px;background:#2ec4b62e;color:var(--teal);font-size:12px;font-weight:800}.respawn-notice{position:absolute;left:50%;bottom:16%;transform:translate(-50%);padding:8px 16px;border-radius:8px;background:#10151ad1;border:1px solid rgba(99,199,255,.45);color:#bfe7ff;font-size:14px;font-weight:800;backdrop-filter:blur(6px);white-space:nowrap}.chat-bar{position:absolute;left:12px;bottom:max(12px,env(safe-area-inset-bottom));display:flex;gap:8px;width:min(360px,calc(100vw - 24px))}.chat-bar input{flex:1;min-width:0;height:38px;padding:0 12px;border-radius:7px;border:1px solid rgba(99,199,255,.4);background:#10151ad1;color:var(--text);font-size:14px;outline:none;pointer-events:auto}.chat-bar button{height:38px;padding:0 14px;border:0;border-radius:7px;background:#63c7ff29;color:#bfe7ff;font-size:13px;font-weight:800;cursor:pointer;pointer-events:auto}.chat-bar button:hover{background:#63c7ff47}.overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#080b0ead;backdrop-filter:blur(8px)}.menu-card,.upgrade-card{width:min(560px,calc(100vw - 28px));background:linear-gradient(160deg,#202c36f5,#10151af5);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:28px;box-shadow:0 24px 80px #00000073;text-align:center}.menu-title{font-size:clamp(34px,7vw,54px);font-weight:900;letter-spacing:0;background:linear-gradient(120deg,#ffd35c,#ff8e4f 45%,#ff5e8a);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1.1}.menu-subtitle{margin-top:6px;color:var(--teal);font-weight:800;letter-spacing:.42em;font-size:13px}.menu-controls{margin:24px 0;display:grid;gap:10px;text-align:left}.control-row{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px}.control-row span:last-child{margin-left:auto;color:var(--text)}kbd{display:inline-grid;place-items:center;min-width:26px;height:26px;padding:0 6px;border-radius:5px;background:#2a3945;border:1px solid #455763;box-shadow:0 2px #10151a;color:#f5f9fa;font-size:12px;font-weight:700}.primary-btn{width:100%;height:48px;border:0;border-radius:8px;background:linear-gradient(100deg,#2ec4b6,#2a9d8f);color:#061312;font-size:17px;font-weight:800;cursor:pointer;box-shadow:0 6px 22px #2ec4b64d}.primary-btn:hover{filter:brightness(1.08)}.primary-btn:active{transform:translateY(1px)}.ghost-btn{width:100%;height:40px;margin-bottom:10px;border:1px solid #455763;border-radius:8px;background:#080d1173;color:var(--muted);font-size:13px;font-weight:700;cursor:pointer}.ghost-btn:hover{border-color:var(--teal);color:var(--text)}.nickname-row{display:grid;grid-template-columns:1fr 1.25fr;gap:10px;margin-bottom:10px}.nickname-row input{width:100%;height:48px;padding:0 14px;border-radius:8px;border:1px solid #455763;background:#080d1199;color:var(--text);font-size:15px;outline:none}.nickname-row input:focus{border-color:var(--teal)}.uuid-row{display:grid;grid-template-columns:52px 1fr;align-items:center;gap:8px;margin-bottom:10px}.field-label{color:var(--muted);font-size:12px;font-weight:800;text-align:left}.uuid-row input{width:100%;height:40px;padding:0 12px;border-radius:8px;border:1px solid #455763;background:#080d1199;color:var(--muted);font-size:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;outline:none}.uuid-row input:focus{border-color:var(--teal);color:var(--text)}.menu-foot{margin-top:14px;color:var(--muted);font-size:12px}.upgrade-head{font-size:22px;font-weight:800;margin-bottom:18px;color:#ffe08a}.upgrade-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.upgrade-choice{border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#080d118c;padding:16px 12px;cursor:pointer;text-align:left;color:var(--text);transition:transform .1s ease,border-color .1s ease,background .1s ease}.upgrade-choice:hover{transform:translateY(-2px);border-color:var(--teal);background:#2ec4b614}.choice-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:8px;background:#f0b42929;color:var(--gold);font-size:20px;font-weight:800;margin-bottom:10px}.choice-name{font-weight:800;font-size:15px;margin-bottom:6px}.choice-desc{color:var(--muted);font-size:12px;line-height:1.5}.choice-stack{display:inline-block;margin-top:8px;font-size:11px;color:var(--teal);border:1px solid rgba(46,196,182,.35);border-radius:4px;padding:2px 6px}.gameover-title{font-size:34px;font-weight:900;color:#ff8f6b}.gameover-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.gameover-stats div{background:#080d118c;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:14px 8px;color:var(--muted);font-size:12px}.gameover-stats b{display:block;color:var(--text);font-size:24px;margin-top:4px}#touch-layer{position:fixed;inset:0;z-index:10;pointer-events:none}@media(max-width:700px){.hud-top{flex-direction:column;gap:6px}.player-panel{min-width:0;width:100%}.score-panel{display:none}.skill-panel{max-width:100%}.upgrade-choices{grid-template-columns:1fr}.upgrade-card{width:calc(100vw - 20px);padding:18px 14px}.menu-card{padding:22px 18px}}