:root{--panel-bg:#14161ad1;--panel-fg:#e9e6df;--muted:#a39f96;--accent:#ff8a2a;--danger:#e2412b;--border:#ffffff24}*{box-sizing:border-box}html,body{height:100%;color:var(--panel-fg);-webkit-user-select:none;user-select:none;background:#e8f1f6;margin:0;font-family:system-ui,-apple-system,Hiragino Sans,Noto Sans JP,sans-serif;font-size:14px;overflow:hidden}#app,#app canvas{display:block;position:fixed;inset:0}button{font:inherit;color:var(--panel-fg);cursor:pointer}button:disabled{cursor:default}[hidden]{display:none!important}.hp{pointer-events:none;width:min(620px,100% - 32px);position:fixed;top:16px;left:50%;transform:translate(-50%)}.hp-label{letter-spacing:.06em;color:#2b2f36;max-width:100%;margin:0 0 2px;padding:0 2px;font-family:Luckiest Guy,Hiragino Sans,Noto Sans JP,system-ui,sans-serif;font-size:22px;font-weight:900;display:flex}.hp-label span{text-overflow:ellipsis;white-space:nowrap;padding-top:.05em;line-height:1.35;overflow:hidden}.hp-frame{background:#23272e;border:5px solid #23272e;border-radius:4px;height:30px;position:relative;overflow:hidden}.hp-trail,.hp-fill{width:100%;position:absolute;top:0;bottom:0;right:0}.hp-trail{background:#e8705e;transition:width .9s ease-in .35s}.hp-fill{background:#5ccf3a;transition:width .12s linear,background-color .3s}.hp-fill.mid{background:#f2c230}.hp-fill.low{background:#e8452f}.win{white-space:nowrap;color:#ffdf3a;-webkit-text-stroke:6px #23272e;text-shadow:0 10px #23272e;opacity:0;pointer-events:none;font-family:Luckiest Guy,system-ui,sans-serif;font-size:clamp(72px,19vw,260px);line-height:1;transition:transform .25s cubic-bezier(.2,1.6,.4,1),opacity .2s;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)scale(.4)}.win.show{opacity:1;transform:translate(-50%,-50%)scale(1)}.right-col{flex-direction:column;gap:12px;display:flex;position:fixed;top:50%;right:16px;transform:translateY(-50%)}.rebuild-box{flex-direction:column;gap:6px;display:flex}.rebuild-box button#reset{background:var(--panel-bg);border:1px solid var(--border);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:12px;padding:12px 4px;font-size:13px;font-weight:700}.rebuild-box button#reset:hover{background:#3a3d44}.rebuild-box button#reset.attention{color:#23272e;background:#f2c230;border-color:#23272e;animation:1.1s ease-in-out infinite reset-pulse}.rebuild-box button#reset.attention:hover{background:#ffd84a}@keyframes reset-pulse{0%,to{transform:scale(1);box-shadow:0 0 #f2c230bf}50%{transform:scale(1.08);box-shadow:0 0 0 10px #f2c23000}}.palette{background:var(--panel-bg);border:1px solid var(--border);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:16px;flex-direction:column;gap:10px;padding:12px 10px;display:flex}.type-select{flex-direction:column;gap:4px;display:flex}.type-select button{border:1px solid var(--border);background:#3a3d44;border-radius:8px;padding:4px 6px;font-size:12px}.type-select button[aria-pressed=true]{background:var(--accent);color:#1d1f23;font-weight:700}.bomb-tiles{flex-direction:column;gap:10px;display:flex}.bomb-tile{border:2px solid var(--border);cursor:grab;touch-action:none;background:#34373e;border-radius:12px;place-items:center;width:72px;height:72px;transition:transform .1s,border-color .1s;display:grid;position:relative}.bomb-tile:hover{border-color:var(--accent);transform:scale(1.05)}.bomb-tile:active{cursor:grabbing}.bomb-tile .icon svg{display:block}.bomb-tile .label{text-align:center;letter-spacing:.04em;font-size:11px;font-weight:800;position:absolute;bottom:3px;left:0;right:0}.bomb-tile .icon{margin-bottom:12px}.palette.busy .bomb-tile{opacity:.4;pointer-events:none}.palette-actions{border-top:1px solid var(--border);flex-direction:column;gap:6px;padding-top:8px;display:flex}.palette-actions button{border:1px solid var(--border);background:#3a3d44;border-radius:8px;padding:6px 4px;font-size:12px}.palette-actions button:hover:not(:disabled){background:#4a4e57}.palette-actions button:disabled{opacity:.4}.drag-ghost{pointer-events:none;filter:drop-shadow(0 6px 8px #0006);z-index:10;position:fixed;top:0;left:0;transform:translate(-50%,-50%)}.drag-ghost.over{opacity:.35}.detonate{background:0 0;border:none;width:250px;height:220px;padding:0;position:fixed;bottom:8px;left:50%;transform:translate(-50%)}.detonate svg{filter:drop-shadow(0 8px 10px #0000004d);width:100%;height:100%;overflow:visible}.detonate .box-top{fill:#2c2d31}.detonate .box-front{fill:#141518}.detonate .box-right{fill:#1f2024}.detonate .band{fill:#f5c400}.detonate .band-r{fill:#ffd42a}.detonate .stripes polygon{fill:#18191c}.detonate .screw{fill:#8d9095;stroke:#1b1c1f;stroke-width:1px}.detonate .collar-shadow{fill:#121315}.detonate .collar-side{fill:#a7abb0}.detonate .collar-top{fill:#dfe2e5}.detonate .cap{transition:transform 70ms}.detonate .cap-rim{fill:#a3140b}.detonate .cap-dome{fill:#dc2414}.detonate .cap-shade{fill:#b81a0e}.detonate .cap-shine{fill:#ff7a5e}.detonate .count{fill:#ffcf3a;letter-spacing:.08em;font-size:18px;font-weight:900}.detonate:hover:not(:disabled) .cap{filter:brightness(1.1)}.detonate:active:not(:disabled) .cap{transform:translateY(8px)}.detonate:disabled .cap{filter:saturate(.7)brightness(.85)}.sound-toggle{background:var(--panel-bg);border:2px solid var(--border);letter-spacing:.05em;border-radius:50%;width:72px;height:72px;font-size:11px;line-height:1.3;position:fixed;bottom:18px;right:18px}.sound-toggle b{color:var(--muted);font-size:15px}.sound-toggle[aria-pressed=true]{background:#24402c;border-color:#4f9a5f}.sound-toggle[aria-pressed=true] b{color:#9be3a8}.help-toggle{background:var(--panel-bg);border:2px solid var(--border);border-radius:50%;width:36px;height:36px;font-size:18px;font-weight:900;position:fixed;bottom:30px;left:16px}.help-toggle[aria-expanded=true]{border-color:var(--accent);color:var(--accent)}.help{background:var(--panel-bg);border:1px solid var(--border);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:10px;width:min(320px,100% - 32px);padding:12px 14px;font-size:13px;line-height:1.6;position:fixed;bottom:76px;left:16px}.help h2{color:var(--accent);margin:0 0 6px;font-size:15px}.help ul{margin:0;padding-left:18px}.help p{color:var(--muted);margin:8px 0 0;font-size:12px}.info{color:#282c32bf;pointer-events:none;white-space:nowrap;font-size:8px;position:fixed;bottom:12px;left:16px}#flash{opacity:0;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(circle,#fffbe8 0%,#ffd9a0 60%,#ffb070 100%);position:fixed;inset:0}#loading{background:#1d1f23;place-items:center;font-size:20px;display:grid;position:fixed;inset:0}#loading.hidden{display:none}.start{z-index:40;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#14161a59;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.start-card{background:var(--panel-bg);border:1px solid var(--border);border-radius:18px;flex-direction:column;align-items:stretch;gap:14px;width:min(420px,100%);padding:22px 22px 20px;display:flex;box-shadow:0 18px 40px #00000059}.start-q{text-align:center;letter-spacing:.04em;font-size:17px;font-weight:800}.start-name{border:2px solid var(--border);color:#23272e;letter-spacing:.06em;text-align:center;background:#fffffff2;border-radius:10px;outline:none;width:100%;padding:8px 12px;font-family:Luckiest Guy,Hiragino Sans,Noto Sans JP,system-ui,sans-serif;font-size:26px;line-height:1.35}.start-name:focus{border-color:var(--accent)}.start-go{color:#fff;letter-spacing:.08em;background:#e2412b;border:none;border-radius:12px;padding:12px;font-size:16px;font-weight:800}.start-go:hover{background:#f04e36}@media (max-width:640px),(max-height:500px){.detonate{width:190px;height:168px;bottom:-62px}.right-col{display:contents}.palette{border-radius:14px;flex-direction:row;align-items:center;gap:8px;padding:6px 8px;position:fixed;bottom:108px;left:50%;transform:translate(-50%)}.bomb-tiles{flex-direction:row;gap:6px}.bomb-tile{width:56px;height:56px}.bomb-tile .icon svg{width:40px;height:auto}.bomb-tile .icon{margin-bottom:10px}.bomb-tile .label{font-size:9px}.palette-actions{border-top:none;border-left:1px solid var(--border);padding-top:0;padding-left:8px}.palette-actions button{border-radius:12px;width:56px;height:56px;padding:0 2px;font-size:11px;line-height:1.25}.drag-ghost{transform:translate(-50%,-120%)scale(1.4)}.rebuild-box{position:fixed;top:92px;right:12px}.rebuild-box button#reset{padding:10px 14px}.sound-toggle{width:54px;height:54px;font-size:9px;bottom:12px;right:12px}.sound-toggle b{font-size:12px}.help-toggle{bottom:26px;left:12px}.info{bottom:8px;left:12px}}@media (max-height:500px){.hp{width:min(520px,100% - 200px);top:8px}.rebuild-box{top:12px}}.msg-prompt{z-index:20;background:var(--panel-bg);border:1px solid var(--border);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);-webkit-user-select:text;user-select:text;border-radius:10px;padding:8px;position:fixed}.msg-prompt input{border:2px solid var(--accent);color:#23272e;background:#fff;border-radius:6px;outline:none;width:260px;padding:8px 10px;font-family:inherit;font-size:15px}.msg-prompt .hint{color:var(--muted);text-align:right;margin-top:4px;font-size:11px}.shout{z-index:15;pointer-events:none;white-space:nowrap;color:#fff;-webkit-text-stroke:3px #23272e;paint-order:stroke fill;text-shadow:0 5px #c0260e,0 8px 14px #00000073;font-family:Reggae One,Hiragino Sans,Noto Sans JP,system-ui,sans-serif;font-weight:400;line-height:1;position:fixed}.shout-char{will-change:transform, opacity;display:inline-block}