body.side-scroller-page{min-height:100svh;background:radial-gradient(circle at 50% 18%,rgba(105,222,203,.10),transparent 34rem),#02090b;color:#dff4f4}
.side-scroller-shell{width:min(1120px,calc(100vw - 34px));margin:0 auto;padding:94px 0 50px}.side-scroller-heading{display:flex;justify-content:space-between;gap:22px;align-items:end;margin-bottom:14px}.side-scroller-heading h1{margin:6px 0 7px;font:700 clamp(27px,4.5vw,46px)/1 var(--mono);letter-spacing:.1em}.side-scroller-heading p{max-width:680px;margin:0;color:#739799;font:700 9px/1.55 var(--mono);letter-spacing:.055em}.side-scroller-card{border:1px solid rgba(151,239,241,.16);background:linear-gradient(160deg,rgba(7,27,30,.92),rgba(2,10,12,.98));box-shadow:0 28px 75px rgba(0,0,0,.34);overflow:hidden}.side-scroller-hud{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid rgba(151,239,241,.12)}.side-scroller-hud>div{padding:11px 14px;border-right:1px solid rgba(151,239,241,.08)}.side-scroller-hud>div:last-child{border-right:0}.side-scroller-hud span{display:block;color:#557a7d;font:800 7px/1 var(--mono);letter-spacing:.12em}.side-scroller-hud b{display:block;margin-top:6px;color:#e7fafa;font:900 18px/1 var(--mono)}.side-scroller-stage{position:relative;touch-action:manipulation;user-select:none;cursor:pointer;background:#061014}.side-scroller-stage canvas{display:block;width:100%;height:auto;aspect-ratio:16/8.3;max-height:70svh}.side-scroller-overlay{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;background:linear-gradient(180deg,rgba(1,7,9,.08),rgba(1,7,9,.34))}.side-scroller-overlay[hidden]{display:none}.side-scroller-overlay div{max-width:620px;padding:20px;text-align:center;text-shadow:0 2px 16px #000}.side-scroller-overlay b{display:block;color:#eaffff;font:900 clamp(20px,4vw,36px)/1 var(--mono);letter-spacing:.12em}.side-scroller-overlay span{display:block;margin-top:10px;color:#a8d0cf;font:800 9px/1.5 var(--mono);letter-spacing:.12em}.side-scroller-feedback{min-height:35px;margin:0;padding:11px 14px;border-top:1px solid rgba(151,239,241,.08);color:#6f9999;font:800 8px/1.5 var(--mono);letter-spacing:.08em}.side-scroller-feedback[data-tone="ok"]{color:#8edca8}.side-scroller-feedback[data-tone="error"]{color:#ff8c99}.side-scroller-help{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.side-scroller-help div{padding:12px;border:1px solid rgba(151,239,241,.09);background:rgba(2,11,13,.7)}.side-scroller-help span{display:block;color:#54777a;font:800 7px/1 var(--mono);letter-spacing:.12em}.side-scroller-help b{display:block;margin-top:6px;color:#bfe8e6;font:800 9px/1.3 var(--mono);letter-spacing:.07em}.side-scroll-scoreboard{margin-top:14px;border:1px solid rgba(151,239,241,.11);background:rgba(2,11,13,.78)}.side-scroll-scoreboard header{display:flex;justify-content:space-between;gap:18px;padding:14px 16px;border-bottom:1px solid rgba(151,239,241,.08)}.side-scroll-scoreboard header span{color:#557a7d;font:800 7px/1 var(--mono);letter-spacing:.12em}.side-scroll-scoreboard header h2{margin:6px 0 0;font:900 17px/1 var(--mono);letter-spacing:.1em}.side-scroll-personal{text-align:right}.side-scroll-personal b{display:block;margin-top:5px;color:#e4fafa;font:900 17px/1 var(--mono)}.side-scroll-score-head,.side-scroll-scoreboard li{display:grid;grid-template-columns:58px 1fr 120px;gap:12px;align-items:center}.side-scroll-score-head{padding:9px 16px;color:#4f7376;font:800 7px/1 var(--mono);letter-spacing:.11em}.side-scroll-scoreboard ol{list-style:none;margin:0;padding:0}.side-scroll-scoreboard li{padding:10px 16px;border-top:1px solid rgba(151,239,241,.055);color:#7ea2a4;font:800 8px/1 var(--mono)}.side-scroll-scoreboard li b{color:#cbe7e6}.side-scroll-scoreboard li strong{text-align:right;color:#e5f7f6}.side-scroll-scoreboard li.is-you{background:rgba(94,205,188,.055)}.side-scroll-scoreboard li.is-empty{display:block;text-align:center;padding:18px;color:#527477}
@media(max-width:680px){.side-scroller-shell{width:100%;padding:72px 0 70px}.side-scroller-heading{padding:0 14px;align-items:flex-start;flex-direction:column}.side-scroller-heading .runtime-back{align-self:flex-end}.side-scroller-card{border-left:0;border-right:0}.side-scroller-stage canvas{aspect-ratio:10/8.2;max-height:62svh}.side-scroller-hud>div{padding:10px}.side-scroller-hud b{font-size:15px}.side-scroller-help{grid-template-columns:1fr;margin:10px 12px}.side-scroll-scoreboard{margin:12px}.side-scroll-score-head,.side-scroll-scoreboard li{grid-template-columns:42px 1fr 92px}.side-scroll-scoreboard header{padding:12px}.side-scroll-score-head,.side-scroll-scoreboard li{padding-left:12px;padding-right:12px}}