*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#061722;color:#f6e3b7;font-family:Arial,sans-serif;overscroll-behavior:none;touch-action:none}
img,canvas,button{user-select:none;-webkit-user-drag:none;-webkit-touch-callout:none}
canvas{position:fixed;inset:0;width:100%;height:100%;image-rendering:pixelated;touch-action:none}
.screen{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:linear-gradient(#00101b40,#00101bd5);z-index:20}.screen.visible{display:flex}
.panel{width:min(88vw,600px);padding:24px;text-align:center;border:3px solid #c98e3d;border-radius:16px;background:#082333f2;box-shadow:0 18px 60px #0008}.logo{width:76px;height:76px;object-fit:contain}.eyebrow{letter-spacing:.16em;color:#e5ad53;font-weight:800;margin:4px}.panel h1{font-size:clamp(28px,5vw,54px);margin:3px}.panel h2{margin:7px;font-size:clamp(17px,2.7vw,27px)}.panel p{line-height:1.35;margin:8px}.panel button{display:block;margin:15px auto 10px;padding:12px 34px;border:2px solid #f0d19a;background:#d59535;color:#102638;font-weight:900;font-size:18px;border-radius:10px}.panel small{display:block;color:#ddd}
.hidden{display:none!important}
#hud{position:fixed;top:max(5px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));height:58px;display:flex;align-items:center;gap:12px;padding:5px 12px;border:2px solid #d49943;border-radius:12px;background:#061d2ef0;z-index:8;white-space:nowrap;overflow:hidden;box-shadow:0 4px 14px #0005}
.hudtitle{margin-right:auto;min-width:0;line-height:1.05}.hudtitle b{display:block;font-size:clamp(16px,2.4vw,24px);overflow:hidden;text-overflow:ellipsis}.hudtitle span{display:block;color:#e4b05d;font-size:clamp(11px,1.55vw,15px);overflow:hidden;text-overflow:ellipsis}
.counter{display:flex;align-items:center;gap:4px;font-size:clamp(15px,2.2vw,21px)}.counter img{width:34px;height:34px;object-fit:contain}#hearts{display:flex;gap:3px;color:#ef322f;font-size:25px;line-height:1}
#controls{position:fixed;left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));bottom:max(9px,env(safe-area-inset-bottom));display:flex;gap:10px;z-index:12;pointer-events:none}
#controls button{pointer-events:auto;width:74px;height:58px;border:2px solid #e4c18a;background:#072b43e8;color:#fff;font-weight:900;font-size:23px;border-radius:14px;box-shadow:0 4px 10px #0006;touch-action:none}.jump{margin-left:auto;width:124px!important;font-size:17px!important}
#rotate{display:none;position:fixed;inset:0;z-index:50;background:#061722;align-items:center;justify-content:center;text-align:center;color:#f6e3b7}#rotate div{border:2px solid #d49943;border-radius:16px;padding:24px 34px;background:#082333}#rotate b{display:block;font-size:28px}#rotate span{display:block;margin-top:8px;color:#e4b05d}
@media (orientation:portrait) and (max-width:900px){#rotate{display:flex}#hud,#controls,.screen,canvas{visibility:hidden}}
@media (max-height:520px){#hud{height:50px;padding:3px 10px}.counter img{width:29px;height:29px}#hearts{font-size:22px}#controls button{height:54px;width:68px}.jump{width:116px!important}.panel{padding:16px}.logo{width:56px;height:56px}.panel p{margin:5px}.panel button{margin:10px auto 7px}}
@media (max-width:680px){#hud{gap:7px}.counter{gap:2px}.counter img{width:29px;height:29px}.hudtitle b{font-size:16px}.hudtitle span{font-size:11px}}
@media (min-width:1000px){#controls{opacity:.42}}

.sound-toggle{
  position:fixed;top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));
  z-index:40;width:42px;height:36px;border:1px solid rgba(230,177,75,.8);
  border-radius:10px;background:rgba(4,25,38,.82);color:#fff;font-size:20px;
  display:grid;place-items:center;touch-action:manipulation;-webkit-user-select:none;user-select:none;
}
@media (orientation:portrait){.sound-toggle{display:none}}