:root{--ink:#111;--paper:#fffdf6;--accent:#ffc300;--danger:#ff3b5c;font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;background:#5fb8ff;margin:0;overflow:hidden}#app{position:fixed;inset:0}#app canvas{display:block}.hidden{display:none!important}#hud{pointer-events:none;text-shadow:2px 2px #fff,-2px -2px #fff,2px -2px #fff,-2px 2px #fff;grid-template-columns:1fr minmax(160px,420px) 1fr;align-items:center;gap:16px;padding:14px 20px;font-size:26px;font-weight:800;display:grid;position:fixed;top:0;left:0;right:0}.hud-left{align-items:center;gap:18px;display:flex}.hud-right{justify-content:flex-end;align-items:center;gap:8px;display:flex}.heart{color:var(--danger);-webkit-text-stroke:2px var(--ink);margin-right:2px;font-size:34px}.heart.empty{color:#fff;opacity:.8}.lives{white-space:nowrap;align-items:center;gap:6px;display:flex}.head-icon{background:var(--ink);border-radius:50%;width:26px;height:26px;display:inline-block;position:relative}.head-icon:before,.head-icon:after{content:"";width:9px;height:10px;box-shadow:inset 3px 0 0 1px var(--ink);background:#fff;border-radius:50%;position:absolute;top:6px}.head-icon:before{left:3px}.head-icon:after{right:3px}.weapon{align-items:center;gap:6px;margin-right:14px;display:inline-flex}.weapon-icon{filter:drop-shadow(2px 2px #fff);width:34px;height:34px}.weapon-emoji{font-size:26px;line-height:34px}.weapon .slot{opacity:.55;border:3px solid #0000;border-radius:10px;align-items:center;gap:2px;padding:0 6px;display:inline-flex}.weapon .slot.active{opacity:1;border-color:var(--ink);background:#ffffffbf}.weapon .ammo{white-space:nowrap;font-size:18px}.weapon .slot-hint{opacity:.85;font-size:14px}.coin-icon{background:var(--accent);border:3px solid var(--ink);border-radius:50%;width:24px;height:24px;display:inline-block}.hud-center{align-items:center;gap:12px;display:flex}#progress{flex:1}.timer{white-space:nowrap;font-variant-numeric:tabular-nums;font-size:22px}#progress{border:3px solid var(--ink);background:#ffffffb3;border-radius:10px;height:14px;overflow:hidden}#progress-fill{background:linear-gradient(90deg,#6abe30,#ffc300);width:0;height:100%;transition:width .2s}#boss-bar{pointer-events:none;text-align:center;width:min(560px,80vw);position:fixed;top:62px;left:50%;transform:translate(-50%)}#boss-name{letter-spacing:3px;text-transform:uppercase;color:#e3242b;text-shadow:2px 2px 0 var(--ink), -2px -2px 0 var(--ink), 2px -2px 0 var(--ink), -2px 2px 0 var(--ink);margin-bottom:4px;font-size:22px;font-weight:900}.boss-hp{border:3px solid var(--ink);height:18px;box-shadow:3px 3px 0 var(--ink);background:#ffffffbf;border-radius:10px;overflow:hidden}#boss-hp-fill{background:linear-gradient(90deg,#e3242b,#ff7a1a);width:100%;height:100%;transition:width .25s}#boss-bar.rage #boss-hp-fill{animation:.5s infinite alternate rage}@keyframes rage{0%{filter:brightness()}to{filter:brightness(1.5)}}#hud.hub-mode .level-only{visibility:hidden}.diamond-icon{vertical-align:middle;filter:drop-shadow(2px 2px #fff);width:26px;height:26px}.menu-panel .diamond-icon,.panel .diamond-icon{filter:none;width:20px;height:20px}#prompt{background:var(--accent);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);pointer-events:none;opacity:0;text-align:center;border-radius:14px;max-width:90vw;padding:10px 20px;font-size:20px;font-weight:800;transition:opacity .2s;position:fixed;bottom:20%;left:50%;transform:translate(-50%)}#prompt.show{opacity:1;animation:1.2s ease-in-out infinite bob}@keyframes bob{50%{transform:translate(-50%,-4px)}}#toast{background:var(--paper);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);opacity:0;pointer-events:none;text-align:center;border-radius:14px;max-width:90vw;padding:12px 22px;font-size:20px;font-weight:700;transition:opacity .25s,transform .25s;position:fixed;bottom:8%;left:50%;transform:translate(-50%,30px)}#toast.show{opacity:1;transform:translate(-50%)}.screen{background:#14284659;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.panel{background:var(--paper);border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink);text-align:center;border-radius:22px;max-width:min(560px,92vw);padding:28px 40px}.panel h2{margin:0 0 12px;font-size:38px}.logo{letter-spacing:6px;color:var(--ink);text-shadow:4px 4px 0 var(--accent);margin:0;font-size:72px}.subtitle{opacity:.8;margin:4px 0 16px;font-size:18px}.controls{text-align:left;grid-template-columns:1fr 1fr;gap:8px 22px;margin:16px 0;font-size:16px;display:grid}.win-time{font-variant-numeric:tabular-nums;margin:8px 0 2px;font-size:30px;font-weight:900}.record{margin-bottom:4px;font-size:18px;font-weight:700}.record.new{color:#b8860b;font-size:22px;animation:.7s ease-out record-pop}@keyframes record-pop{0%{opacity:0;transform:scale(.4)}70%{transform:scale(1.15)}to{transform:scale(1)}}.level-record{margin-left:6px;font-size:.85em;font-weight:700}.records-title{margin:14px 0 4px;font-size:20px}.records{text-align:left;grid-template-columns:1fr 1fr;gap:4px 24px;font-size:15px;display:grid}.records div{justify-content:space-between;gap:12px;display:flex}.records b{font-variant-numeric:tabular-nums;white-space:nowrap}.stats{grid-template-columns:1fr 1fr;gap:10px 28px;margin:12px 0;font-size:18px;display:grid}kbd{border:2px solid var(--ink);min-width:26px;box-shadow:2px 2px 0 var(--ink);text-align:center;background:#fff;border-radius:6px;margin:0 2px;padding:2px 7px;font-family:inherit;font-size:14px;font-weight:700;display:inline-block}.pad-btn,.pad-stick,.pad-pill{vertical-align:middle;border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);color:#fff;justify-content:center;align-items:center;margin:0 2px;font-size:14px;font-weight:800;line-height:1;display:inline-flex}.pad-btn{border-radius:50%;width:26px;height:26px}.pad-stick{width:26px;height:26px;box-shadow:2px 2px 0 var(--ink), inset 0 0 0 4px #666;background:#444;border-radius:50%}.pad-pill{background:#333;border-radius:12px;min-width:34px;height:24px;padding:0 8px;font-size:13px}.pad-btn.xa{background:#3fb34f}.pad-btn.xb{background:#e2453c}.pad-btn.xx{background:#2f74c0}.pad-btn.xy{color:var(--ink);background:#f2c500}.pad-btn.ps-cross,.pad-btn.ps-circle,.pad-btn.ps-square,.pad-btn.ps-triangle{background:#222;font-size:16px}.pad-btn.ps-cross{color:#8fb4ff}.pad-btn.ps-circle{color:#ff6b6b}.pad-btn.ps-square{color:#ff8fd0;font-size:21px}.pad-btn.ps-triangle{color:#4fd1a5}.pad-btn.nt{background:#3a3a3a}.pad-status{margin:4px 0 0;font-size:15px;font-weight:700}.pad-status.muted{opacity:.6;font-weight:400}#toast .pad-btn,#toast .pad-stick,#toast .pad-pill,#toast kbd{margin-top:-3px}.blink{margin-top:18px;font-weight:700;animation:1.1s infinite blink}.menu-panel{width:min(460px,92vw);max-height:92vh;overflow-y:auto}.menu-panel.wide{width:min(620px,94vw)}.menu-list{flex-direction:column;gap:10px;margin:16px 0;display:flex}.menu-list.row{flex-flow:wrap;justify-content:center}.menu-btn{font:inherit;border:3px solid var(--ink);color:var(--ink);box-shadow:3px 3px 0 var(--ink);cursor:pointer;background:#fff;border-radius:12px;padding:10px 18px;font-size:18px;font-weight:800;transition:transform 80ms}.menu-btn:hover,.menu-btn:focus-visible{box-shadow:4px 4px 0 var(--ink);background:#fff6d6;outline:none;transform:translate(-1px,-1px)}.menu-btn:focus{outline:3px solid var(--accent);outline-offset:2px}.menu-btn:active{box-shadow:1px 1px 0 var(--ink);transform:translate(2px,2px)}.menu-btn.primary{background:var(--accent)}.menu-btn[disabled]{opacity:.5;cursor:default}.menu-btn.small-btn{padding:5px 10px;font-size:14px}.tabs{justify-content:center;gap:8px;margin:12px 0;display:flex}.tab{padding:6px 14px;font-size:15px}.tab.active{background:var(--accent)}.menu-form{text-align:left;flex-direction:column;gap:10px;margin:8px 0;display:flex}.menu-form.inline{flex-direction:row;align-items:center}.menu-form.inline .menu-input{flex:1;min-width:0}.menu-form label{flex-direction:column;gap:4px;font-weight:700;display:flex}.menu-input{font:inherit;border:3px solid var(--ink);background:#fff;border-radius:10px;padding:8px 12px;font-size:17px}.menu-input:focus{outline:3px solid var(--accent)}.menu-error{color:#c1121f;min-height:1.2em;margin:4px 0;font-weight:700}.muted{opacity:.7}.small{font-size:14px}.code{border:2px solid var(--ink);background:#fff;border-radius:6px;padding:0 6px;font-family:ui-monospace,Consolas,monospace;font-weight:800}.code.big{letter-spacing:3px;font-size:24px}.room-list{border:3px solid var(--ink);text-align:left;background:#fff;border-radius:12px;max-height:220px;padding:6px;overflow-y:auto}.room-row{border-bottom:2px dashed #ddd;justify-content:space-between;align-items:center;gap:10px;padding:8px;display:flex}.room-row:last-child{border-bottom:none}.room-meta{align-items:center;gap:8px;font-weight:800;display:flex}.tag{border:2px solid var(--ink);background:#eee;border-radius:6px;padding:1px 6px;font-size:12px}.room-players{text-align:left;gap:6px;margin:12px 0;display:grid}.player-row{border:3px solid var(--ink);background:#fff;border-radius:10px;align-items:center;gap:10px;padding:8px 10px;display:flex}.player-row.empty{opacity:.5;border-style:dashed}.swatch{border:3px solid var(--ink);border-radius:50%;flex:none;width:22px;height:22px}.ready{opacity:.7;margin-left:auto;font-size:14px}.ready.yes{opacity:1;color:#2b9348;font-weight:800}.chat{border:3px solid var(--ink);background:#fff;border-radius:12px;padding:8px}.chat-log{text-align:left;height:110px;font-size:15px;overflow-y:auto}@keyframes blink{50%{opacity:.35}}.wallet{margin:4px 0;font-size:20px}.panel h3{text-align:left;margin:12px 0 6px}.shop-grid{text-align:left;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.shop-item{border:3px solid var(--ink);background:#fff;border-radius:12px;flex-direction:column;gap:4px;padding:10px;display:flex}.shop-item p{flex:1;margin:0}.shop-item.using{background:#fff6d6}.menu-ok{color:#2b9348;min-height:1.2em;margin:4px 0;font-weight:700}.small-coin{vertical-align:middle;border-width:2px;width:14px;height:14px}.level-btn{text-align:left;flex-direction:column;gap:2px;display:flex}.level-btn .small{font-weight:400}.level-pick{margin:6px 0}@media (max-height:720px){.panel{padding:18px 28px}.panel h2{margin-bottom:6px;font-size:30px}.logo{font-size:56px}.menu-list{gap:8px;margin:10px 0}.room-players{gap:4px;margin:8px 0}.player-row{padding:5px 10px}.chat-log{height:70px}.menu-error{margin:2px 0}}@media (max-width:640px){#hud{grid-template-columns:1fr 1fr;font-size:18px}.hud-center{display:none}.logo{font-size:48px}.controls{grid-template-columns:1fr}}.volume-row{justify-content:center;align-items:center;gap:8px;margin:10px 0;font-weight:700;display:flex}.volume-row .vol-btn{min-width:38px;padding:4px 10px;font-size:20px;line-height:1}.vol-bar{align-items:flex-end;gap:3px;display:inline-flex}.vol-bar i{border:2px solid var(--ink);background:#fff;border-radius:3px;width:9px;height:18px;display:inline-block}.vol-bar i.on{background:var(--accent)}.vol-pct{text-align:left;min-width:42px;font-size:14px}html,body{touch-action:manipulation;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}#app canvas{touch-action:none}#touch{pointer-events:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0}#touch .tc-zone{pointer-events:auto;touch-action:none;position:absolute;top:16%;bottom:0}#touch .tc-move{width:45%;left:0}#touch .tc-look{width:55%;right:0}.tc-stick{left:calc(110px + env(safe-area-inset-left));pointer-events:none;opacity:.6;background:#ffffff38;border:3px solid #1111118c;border-radius:50%;width:124px;height:124px;margin:-62px 0 0 -62px;position:absolute;top:calc(100% - 110px)}.tc-stick.on{opacity:1;background:#ffffff52}.tc-knob{border:3px solid var(--ink);width:58px;height:58px;box-shadow:2px 2px 0 var(--ink);background:#fffdf6f2;border-radius:50%;margin:-29px 0 0 -29px;position:absolute;top:50%;left:50%}.tc-btn{border:3px solid var(--ink);color:var(--ink);box-shadow:3px 3px 0 var(--ink);font:inherit;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;background:#fffdf6e0;border-radius:50%;justify-content:center;align-items:center;padding:0;font-weight:900;line-height:1;display:flex;position:absolute}.tc-btn.on{box-shadow:1px 1px 0 var(--ink);filter:brightness(.9);transform:translate(2px,2px)}.tc-jump{width:88px;height:88px;right:calc(20px + env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));color:#fff;background:#3fb34feb;font-size:42px}.tc-punch{width:78px;height:78px;right:calc(122px + env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));background:#ffc300f0;font-size:34px}.tc-crouch{width:56px;height:56px;right:calc(36px + env(safe-area-inset-right));bottom:calc(126px + env(safe-area-inset-bottom));font-size:22px}.tc-switch{width:56px;height:56px;right:calc(132px + env(safe-area-inset-right));bottom:calc(112px + env(safe-area-inset-bottom));font-size:26px}.tc-special{width:56px;height:56px;right:calc(214px + env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));background:#3dff6ed9;font-size:26px}.tc-small{width:44px;height:44px;left:calc(12px + env(safe-area-inset-left));box-shadow:2px 2px 0 var(--ink);font-size:20px}.tc-pause{top:58px}.tc-cam{top:108px}.tc-full{top:158px}.tbtn{vertical-align:middle;border:2px solid var(--ink);min-width:26px;height:26px;box-shadow:2px 2px 0 var(--ink);background:#fff;border-radius:13px;justify-content:center;align-items:center;margin:0 2px;padding:0 5px;font-size:14px;font-weight:800;line-height:1;display:inline-flex}.tbtn.tb-jump{color:#fff;background:#3fb34f}.tbtn.tb-punch{background:var(--accent)}.tbtn.tb-wide{padding:0 8px}#toast .tbtn{margin-top:-3px}body.touch-play #toast{max-width:52vw;font-size:16px;bottom:6%}body.touch-play #prompt{top:22%;bottom:auto}#rotate{z-index:20;background:#142846d9;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.rotate-box{background:var(--paper);border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);text-align:center;border-radius:22px;padding:22px 28px;font-size:22px;font-weight:900}.rotate-icon{font-size:54px;animation:1.6s ease-in-out infinite rotate-hint}@keyframes rotate-hint{0%,30%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@media (orientation:portrait){body.touch-play #rotate{display:flex}}@media (max-height:500px){#hud{padding:6px calc(12px + env(safe-area-inset-right)) 6px calc(12px + env(safe-area-inset-left));gap:10px;font-size:18px}.heart{font-size:24px}.head-icon{width:20px;height:20px}.head-icon:before,.head-icon:after{width:7px;height:8px;top:4px}.weapon-emoji{font-size:20px;line-height:26px}.weapon-icon,.diamond-icon{width:22px;height:22px}.coin-icon{width:20px;height:20px}.timer{font-size:16px}#progress{height:11px}#boss-bar{width:min(420px,60vw);top:40px}#boss-name{letter-spacing:2px;margin-bottom:2px;font-size:15px}.boss-hp{height:12px}#prompt{padding:6px 14px;font-size:16px}#toast{padding:8px 14px;font-size:15px}.panel{max-height:94vh;box-shadow:5px 5px 0 var(--ink);border-radius:16px;padding:12px 18px;overflow-y:auto}.panel h2{margin-bottom:4px;font-size:24px}.logo{font-size:40px}.controls{gap:4px 16px;margin:8px 0;font-size:13px}.stats{gap:4px 20px;margin:6px 0;font-size:15px}.win-time{font-size:24px}.menu-list{gap:6px;margin:8px 0}.menu-btn{padding:7px 14px;font-size:15px}.menu-panel{max-height:94vh}.shop-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}.volume-row{margin:6px 0}}
