:root{color-scheme:dark;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;background:#0d121b;color:#e8efed}*{box-sizing:border-box}body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 70% 0,#172b32,transparent 55%),#0d121b}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #a8f8dc;outline-offset:5px}main{max-width:1560px;margin:auto;padding:0 48px}header{height:104px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;font-weight:900;letter-spacing:-1px;font-size:23px;text-decoration:none;color:#f0f2eb}.brand>span:last-child{color:#a1dbc9;margin-left:7px}.brand-icon{color:#ff7b61;font-size:40px;line-height:1;margin-right:12px}.chapter{font-size:14px;letter-spacing:2px;color:#b9c9cb}.chapter>span{color:#53626b;padding:0 12px}.tools{display:flex;gap:12px}.tools button{background:#17222b;border:1px solid #34434a;color:#d6e2e0;border-radius:5px;min-height:38px;padding:0 12px;font-size:12px}#pause{font-size:20px;width:40px}#stage{position:relative;overflow:hidden;border:1px solid #455055;border-radius:9px;background:#101723;box-shadow:0 22px 70px #0005;isolation:isolate;aspect-ratio:12/7}canvas{display:block;width:100%;height:100%;outline:none;image-rendering:pixelated}.hud{position:absolute;inset:26px 30px auto;display:flex;justify-content:space-between;pointer-events:none;z-index:2;transition:opacity .3s}.eyebrow{display:block;font-size:12px;letter-spacing:2px;font-weight:600;color:#9caeb3;margin-bottom:10px}.health #hearts{color:#ff816e;letter-spacing:3px;font-size:22px}.objective{text-align:center}#fuses{font-size:25px;letter-spacing:6px;color:#a2f6d7}#fuses small{font-size:12px;letter-spacing:1px;color:#dbe7e4;vertical-align:middle;margin-left:10px}.tokens{text-align:right}#score{font-size:25px;letter-spacing:3px}.overlay{position:absolute;inset:0;display:flex;align-items:center;background:linear-gradient(90deg,#090f19f5 0%,#090f19c7 38%,#090f1900 83%);z-index:3}.intro{margin-left:6%;max-width:600px;padding:30px 0}.coral{color:#ff8f74;font-size:12px;letter-spacing:2px}h1{font-family:Impact,'Arial Narrow',sans-serif;font-weight:900;font-size:clamp(55px,7.8vw,118px);letter-spacing:2px;line-height:.94;margin:22px 0 25px;color:#f0efdf;text-shadow:4px 4px 0 #102929}h1 span{color:#b6ecd7}.intro p{font-family:system-ui,sans-serif;font-size:clamp(14px,1.25vw,18px);line-height:1.75;color:#b8c5c7;margin-bottom:28px}.primary{border:0;background:#f38e71;color:#151d21;padding:19px 24px;min-width:250px;text-align:left;font-size:14px;letter-spacing:1px;font-weight:bold;box-shadow:0 5px 0 #924f44;border-radius:3px}.primary:hover{background:#ffad8f;transform:translateY(-1px)}.primary span{float:right;margin-left:30px}.start-note{font-size:12px;line-height:1.7;margin-top:23px;color:#a5b8bb}.level-stamp{position:absolute;right:5%;bottom:11%;font-size:12px;letter-spacing:3px;display:flex;flex-direction:column;color:#cbd1c6;text-align:right;text-shadow:0 2px 5px #000}.level-stamp strong{font-size:68px;line-height:1.3;color:#f5e9cd}.level-stamp span{font-size:10px}.scene-caption{position:absolute;bottom:0;left:0;right:0;padding:13px 24px;background:#081018b0;color:#b2c5c6;font-size:10px;letter-spacing:1.5px;pointer-events:none;z-index:4}.live-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#f89472;margin-right:8px}.caption-right{float:right;color:#8eaaa9}footer{min-height:90px;display:flex;justify-content:space-between;align-items:center;gap:20px}.controls{display:flex;gap:24px;color:#a0b0b5;font-size:11px;align-items:center}.controls>span{white-space:nowrap;display:flex;align-items:center;gap:6px}kbd{font-family:inherit;font-size:11px;border:1px solid #3c4b52;border-bottom-width:3px;padding:5px 7px;border-radius:4px;color:#d1deda}.footer-note{font-size:12px;color:#748a8d}#toast{position:absolute;left:50%;bottom:65px;transform:translateX(-50%);padding:13px 20px;background:#0c1924e8;border:1px solid #538f86;border-radius:4px;font-size:13px;z-index:2;pointer-events:none;text-align:center;max-width:80%;width:max-content;opacity:0;transition:opacity .2s}.touch-controls{display:none;position:absolute;inset:auto 16px 42px;justify-content:space-between;z-index:2;pointer-events:none}.touch-controls>div{display:flex;gap:10px}.touch-controls button{pointer-events:auto;touch-action:none;user-select:none;width:57px;height:57px;border-radius:50%;border:1px solid #9cc3c777;background:#13262cbf;color:#def5e9;font-size:23px}.touch-controls .jump{background:#e9a080d9;color:#101b1f;border-color:#ffd2ae}.hidden{display:none!important}body[data-mode="intro"] .hud{opacity:0}body[data-mode="intro"] .touch-controls,body[data-mode="won"] .touch-controls{display:none}@media(pointer:coarse){.touch-controls{display:flex}.controls{display:none}.footer-note:after{content:' · Touch controls enabled'}}@media(max-width:950px){main{padding:0 20px}header{height:80px}.brand{font-size:18px}.brand-icon{font-size:32px}.chapter{font-size:12px;letter-spacing:1px}.controls{gap:12px}.footer-note{display:none}.intro{margin-left:6%}h1{font-size:75px}.intro p{font-size:15px}.primary{padding:15px 20px}.start-note{margin-top:17px}.hud{inset:18px 20px auto}.eyebrow{font-size:10px;margin-bottom:7px}}@media(max-width:650px){main{padding:0 10px}header{height:68px;gap:5px}.brand{font-size:16px}.brand-icon{margin-right:6px}.chapter{display:none}.tools{gap:6px}.tools button{font-size:10px;padding:0 8px}#stage{aspect-ratio:3/4;max-height:calc(100svh - 100px)}.intro{padding:20px 0;margin-left:7%;margin-right:7%}h1{font-size:70px}.intro p{font-size:15px;max-width:310px}.level-stamp{display:none}.overlay{background:linear-gradient(90deg,#090f19eb,#090f1999)}.coral{font-size:10px;letter-spacing:1.5px}.scene-caption{padding:11px 14px;font-size:8px;letter-spacing:1px}.caption-right{font-size:8px}.objective .eyebrow{font-size:8px;letter-spacing:1px}#fuses{font-size:20px;letter-spacing:3px}#fuses small{display:block;font-size:9px;margin:3px 0}.health #hearts{font-size:17px;letter-spacing:0}#score{font-size:20px}.hud{inset:17px 14px auto}footer{min-height:35px}.controls{display:none}#toast{bottom:115px;font-size:12px;max-width:90%}}

#hearts{display:flex;gap:5px;padding-top:5px}.health-segment{display:block;width:18px;height:17px;border:1px solid #bd837e;background:#29303d;transform:skew(-8deg)}.health-segment.full{background:#ff947b;border-color:#ffd5bc;box-shadow:0 0 9px #ff8d7044}@media(max-width:650px){#hearts{gap:3px}.health-segment{width:12px;height:15px}}

.climb-controls,.climb-hint{display:none!important}body[data-level="3"] .climb-controls,body[data-level="3"] .climb-hint,body[data-free-move="true"] .climb-controls{display:flex!important}.climb-controls{align-self:center}.climb-controls button{width:42px;height:42px;font-size:20px}@media(max-width:450px){.touch-controls{left:8px;right:8px}.touch-controls>div{gap:5px}.touch-controls button{width:47px;height:47px}.climb-controls button{width:36px;height:40px}.climb-controls{gap:3px!important}}


/* Pause is also the current controls reference, including on short screens. */
body[data-mode="paused"] .overlay{align-items:flex-start;overflow-y:auto}
body[data-mode="paused"] .intro{margin-top:auto;margin-bottom:auto;padding:20px 0}
body[data-mode="paused"] h1{font-size:clamp(40px,5vw,72px);margin:12px 0 16px}
body[data-mode="paused"] .intro p{line-height:1.5;margin-bottom:18px}
