*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
html,body{width:100%;height:100%;overflow:hidden;background:#0b1a10;font-family:"Trebuchet MS",system-ui,sans-serif;color:#fff;touch-action:none}
#game,#game canvas{position:fixed;inset:0;width:100%;height:100%;display:block}
.hidden{display:none!important}
#hud{position:fixed;left:0;right:0;top:0;display:flex;justify-content:space-between;align-items:flex-start;padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 0 max(14px,env(safe-area-inset-left));pointer-events:none;text-shadow:0 2px 0 #000;font-weight:800}
.hl,.hr{display:flex;flex-direction:column;gap:4px}.hr{align-items:flex-end}.hc{flex:1;display:flex;justify-content:center}
#lives{display:flex;gap:5px}#lives i{width:14px;height:22px;background:linear-gradient(#e33 0 28%,#f4c38a 28% 45%,#3a6d3a 45%);border:2px solid #000;border-radius:3px}
#weapon{font-size:14px;color:#ffd84a;letter-spacing:2px}#score{font-size:22px;letter-spacing:3px}
#pausebtn{pointer-events:auto;background:#0008;border:2px solid #fff6;color:#fff;font-weight:900;width:34px;height:30px;border-radius:6px;margin-top:4px}
#bossbar{text-align:center;font-size:12px;letter-spacing:3px;color:#ff8a6a}#bossbar div{width:min(40vw,360px);height:12px;border:2px solid #000;background:#300;margin-top:3px;box-shadow:0 0 0 2px #ff8a6a}
#bossfill{display:block;height:100%;width:100%;background:linear-gradient(#ff5c3a,#b3120c);transition:width .15s}
.screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:radial-gradient(ellipse at center,#0b2a14cc,#020a05f2);text-align:center;padding:16px;z-index:5}
h1{font-size:clamp(34px,8vw,84px);line-height:.9;letter-spacing:4px;font-style:italic;color:#ffd84a;text-shadow:4px 4px 0 #a2320c,8px 8px 0 #000}
h1 b{display:block;color:#ff5c3a;text-shadow:4px 4px 0 #6b1404,8px 8px 0 #000}h1 em{font-size:.45em;color:#8fe36b;letter-spacing:12px}
h2{font-size:clamp(30px,6vw,60px);color:#ffd84a;text-shadow:4px 4px 0 #000;letter-spacing:4px}
.tag{color:#cfe8c5;font-size:clamp(12px,2vw,16px)}
.controls{display:flex;gap:28px;flex-wrap:wrap;justify-content:center;font-size:clamp(11px,1.6vw,14px);color:#dfe;text-align:left}
.controls h3{color:#8fe36b;font-size:13px;letter-spacing:2px;margin-bottom:4px}.controls p{margin:3px 0}
kbd{background:#fff2;border:1px solid #fff5;border-radius:4px;padding:0 5px;font-family:inherit}
b.s{color:#ff5c3a}b.m{color:#4ab8ff}b.l{color:#c58aff}
.big{font:900 clamp(16px,2.6vw,24px) inherit;letter-spacing:4px;padding:12px 30px;border:3px solid #000;border-radius:8px;background:#ffd84a;color:#2a1000;box-shadow:0 5px 0 #a2320c;cursor:pointer;animation:pulse 1.2s infinite}
@keyframes pulse{50%{transform:scale(1.05)}}.small{font-size:12px;color:#9ab}
#touch{position:fixed;inset:0;pointer-events:none;z-index:3}
#stick{position:absolute;left:max(24px,env(safe-area-inset-left));bottom:24px;width:130px;height:130px;border-radius:50%;background:#ffffff14;border:2px solid #ffffff40;pointer-events:auto}
#knob{position:absolute;left:40px;top:40px;width:50px;height:50px;border-radius:50%;background:#ffffff55;border:2px solid #fff9}
#tbtns{position:absolute;right:max(20px,env(safe-area-inset-right));bottom:22px;display:flex;gap:14px;align-items:flex-end;pointer-events:auto}
#tbtns button{width:76px;height:76px;border-radius:50%;font:900 13px inherit;color:#fff;border:3px solid #fff8;background:#2c8a3acc}
#tbtns #tfire{width:88px;height:88px;background:#c8321acc;margin-bottom:26px}#tbtns button.on{filter:brightness(1.5)}
#msg{position:fixed;left:0;right:0;top:38%;text-align:center;font:900 clamp(28px,6vw,56px) 'Trebuchet MS',sans-serif;color:#ffd84a;text-shadow:3px 3px 0 #a2320c,6px 6px 0 #000;pointer-events:none;z-index:4;letter-spacing:4px}