html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#0d3036}
body>main{width:100%;height:100dvh;max-width:none;padding:0!important}
.game{width:100vw!important;height:100dvh!important;max-height:none;aspect-ratio:auto!important;padding:0!important;margin:0;min-height:0!important;border:0;border-radius:0}
.game canvas#canvas{width:100%;height:100%}
.playing #pause,#pause{display:block!important;position:absolute;top:0;right:0;pointer-events:auto;background:#163e47;border:2px solid #f9d374;color:#fff5d3;border-radius:12px;width:48px;height:48px;font-size:24px}
.hud{padding-right:62px}.level{margin-right:0}
.player-health progress{accent-color:#e62f43}.player-health progress::-webkit-progress-value{background:linear-gradient(90deg,#c81f37,#ff5c5c)}.player-health progress::-moz-progress-bar{background:#e62f43}
#bossHealth{accent-color:#db2939}#bossHealth::-webkit-progress-value{background:#db2939}
#toast{display:none}.boss-hud{left:35%;right:15%;top:76px;width:auto;background:#301d29e8;border-color:#ef8070}
.scene-pane{z-index:8}.game.in-scene .hud,.game.in-scene .touch,.game.in-scene .powers{visibility:hidden}
#tutorial{position:absolute;inset:0;z-index:20;overflow:hidden;background:#071e3622}
.tutorial-caption{position:absolute;top:22%;left:50%;transform:translateX(-50%);width:max-content;max-width:88%;text-align:center;color:white;text-shadow:0 2px 4px #102e36,0 0 8px #102e36;pointer-events:none}
.tutorial-caption small{font-size:11px;letter-spacing:2px;color:#ffe392;font-weight:800}
.tutorial-caption h2{font-size:18px;margin:3px 0;font-weight:900;letter-spacing:1px}
.tutorial-caption p{font-size:13px;line-height:1.4;margin:0;font-weight:650}
#tutorialHand{position:absolute;width:65px;height:82px;pointer-events:none;transform-origin:28px 4px;filter:drop-shadow(0 3px 3px #12263080)}
#tutorialHand svg{width:100%;height:100%}
#gestureTrail{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#gesturePath{fill:none;stroke:#fff2b5;stroke-width:3;stroke-dasharray:4 9;stroke-linecap:round;filter:drop-shadow(0 1px 2px #163a40)}
#gestureRing{position:absolute;width:32px;height:32px;border:2px solid #fff2b5;border-radius:50%;box-sizing:border-box;pointer-events:none}
#tutorialLightning{position:absolute;width:68px;height:68px;object-fit:contain;pointer-events:none}
.tutorial-actions{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:12px}
.tutorial-actions button{min-height:40px;min-width:75px;border:1px solid #f4d68c;border-radius:22px;padding:8px 18px;background:#153f47ed;color:#fff2cb;font-size:13px;font-weight:800}
.tutorial-actions button:last-child{background:#ffdb75;color:#382914}
@media(orientation:landscape) and (max-height:550px){.tutorial-caption{top:23%}.tutorial-caption h2{font-size:16px}.tutorial-caption p{font-size:12px}#tutorialHand{width:56px;height:71px}.tutorial-actions{bottom:10px}.boss-hud{left:37%;right:15%;top:65px}.hud .level{max-width:45%}}
@media(orientation:portrait){.tutorial-caption{top:26%}.boss-hud{left:40%;right:10px;top:85px}}
/* Compact meters: scenery remains visible behind the HUD. */
.hud,.game:fullscreen .hud{top:max(10px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right))}
.hud .level{display:none!important}
.hud .stats{display:flex;flex-direction:column;align-items:flex-start;gap:3px;background:none;border:0;box-shadow:none;padding:0;border-radius:0;font-size:13px;--bar-width:clamp(112px,15vw,220px)}
.stats .meter{position:relative;display:grid;grid-template-columns:var(--bar-width) 38px;align-items:center;gap:5px;width:auto;min-width:0;height:24px;padding:0 0 0 22px;background:none;border:0;box-shadow:none;margin:0}
.stats .meter-icon{position:absolute;left:0;top:-2px;width:30px;height:30px;z-index:1;object-fit:contain}
.stats .meter progress{appearance:none;display:block;width:var(--bar-width);height:16px;margin:0;border:2px solid #252126;border-radius:4px;overflow:hidden;background:#465159;accent-color:#ee3549}
.stats .meter progress::-webkit-progress-bar{background:#465159}
.stats .meter progress::-webkit-progress-value{background:linear-gradient(90deg,#f59ca3,#ef3549)}
.stats .meter progress::-moz-progress-bar{background:linear-gradient(90deg,#f59ca3,#ef3549)}
.stats .power-meter progress{accent-color:#22baff}
.stats .power-meter progress::-webkit-progress-value{background:linear-gradient(90deg,#1458ee,#31c7fa)}
.stats .power-meter progress::-moz-progress-bar{background:linear-gradient(90deg,#1458ee,#31c7fa)}
.stats .meter b,.stats .meter span{font-size:13px;font-weight:800;letter-spacing:0;color:white;text-shadow:0 1px 3px #102d37,0 0 4px #102d37}
.small-stats{display:flex;align-items:center;gap:7px;padding-left:6px;font-size:12px;font-weight:750;text-shadow:0 1px 3px #102d37,0 0 4px #102d37}
.small-stats .coin{font-size:18px}.powers{display:none!important}
.movement-step .tutorial-caption{top:63%;left:8%;transform:none;text-align:left;max-width:44%}
.movement-step .tutorial-caption small,.movement-step .tutorial-caption h2{display:inline;font-size:14px;letter-spacing:0;margin-right:10px}
.movement-step .tutorial-caption p{font-size:12px;margin-top:3px}
.movement-step #tutorialHand{width:42px;height:54px}
@media(orientation:portrait){.movement-step .tutorial-caption{top:61%;max-width:78%}.movement-step .tutorial-caption p{font-size:12px}}