:root{font-family:Arial,Helvetica,sans-serif;color:#f4f8f1;background:#8ca6ad;font-synthesis:none;--lime:#d6efb0;--ink:#163a3f;--muted:#bdd0ce;--line:rgba(236,247,231,.19)}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}button,a,select{-webkit-tap-highlight-color:transparent}button,select{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.7}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--lime);outline-offset:5px}.hidden{display:none!important}#game,#scene,.vignette{position:absolute;inset:0;width:100%;height:100%}#scene{display:block;touch-action:none}.vignette{pointer-events:none;background:linear-gradient(180deg,rgba(10,38,47,.5),transparent 25%,transparent 70%,rgba(12,40,45,.45));z-index:1}.topbar{position:absolute;z-index:5;left:38px;right:34px;top:27px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#f3f7e9;font-size:15px;letter-spacing:2.4px;font-weight:800}.brand svg{height:36px;width:36px}.brand-light{font-weight:400;opacity:.8;margin-left:5px}.version{color:var(--lime);font-size:9px;letter-spacing:1px;align-self:flex-start;border:1px solid #d6efb044;border-radius:4px;padding:3px 4px;margin-top:2px}.spot-label{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:2.4px;font-weight:600}.spot-small{font-weight:400;opacity:.6}.live-dot,.small-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--lime)}.top-actions{display:flex;gap:7px}.icon-btn{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid #f5fff030;color:#f2f6ed;background:rgba(19,55,61,.2);backdrop-filter:blur(12px);transition:background .15s}.icon-btn:hover{background:#254e56aa}.icon-btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.icon-btn.active{background:var(--lime);color:var(--ink)}.intro-panel{position:absolute;z-index:3;left:5.1%;top:50%;transform:translateY(-48%);width:355px;background:linear-gradient(135deg,rgba(18,56,61,.93),rgba(20,57,61,.83));border:1px solid #eefce129;backdrop-filter:blur(16px);border-radius:4px 24px 24px 24px;padding:28px;box-shadow:0 24px 80px #092d3630}.eyebrow{display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:1.4px;color:#d4e4de}.tag{padding:5px 7px;border:1px solid #c5dfc05c;border-radius:4px;color:var(--lime);font-weight:700;letter-spacing:1px;font-size:8px}.intro-panel h1{font-size:62px;line-height:.99;letter-spacing:-3.6px;font-weight:400;margin:24px 0 18px}.intro-panel em{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--lime);letter-spacing:-3px}.intro-copy{font-size:13px;line-height:1.65;color:#d0ded8;margin:0 0 23px;max-width:290px}.session-select{display:flex;gap:8px;margin-bottom:17px}.session-option{flex:1;border:1px solid #e2f3dc30;border-radius:8px;padding:12px 10px;background:#23474d;color:#c4d8d1;text-align:left;font-size:9px;line-height:1.5}.session-option.selected{background:#d6efb013;border-color:#d6efb08c;color:#f2f8e8}.option-top{display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1.1px;font-weight:700;margin-bottom:5px}.option-top>span{font-size:16px;color:var(--lime)}.start-btn{border:0;width:100%;border-radius:8px;background:var(--lime);color:#1c403d;padding:17px 18px;display:flex;justify-content:space-between;align-items:center;text-align:left;font-weight:700;font-size:13px;transition:background .15s,transform .15s}.start-btn:hover{background:#e6f7c9;transform:translateY(-1px)}.button-arrow{font-size:21px;line-height:12px}.first-run{font-size:8px;color:#bed0c8;margin-top:12px;display:flex;align-items:center;gap:6px;white-space:nowrap}.mini-controls{display:flex;gap:18px;border-top:1px solid var(--line);margin-top:23px;padding-top:17px;color:#d8e4dc;font-size:9px;align-items:center}.mini-controls>span{display:flex;align-items:center;gap:4px}kbd{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;border:1px solid #ecf3df4a;border-radius:4px;font-family:inherit;font-size:9px;padding:0 5px;color:inherit;background:#edf7dd08}.mini-controls kbd:last-of-type{margin-right:3px}.bottom-left{position:absolute;left:39px;bottom:33px;z-index:2}.record-card{display:flex;align-items:center;gap:12px;margin-bottom:24px}.record-icon{border:1px solid #e5f2df40;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:19px}.record-card>div{display:grid;gap:6px}.record-card div>span{font-size:8px;letter-spacing:1.5px;color:#e4eaddbb}.record-card b{font-size:13px;font-weight:500}.spot-caption{font-size:8px;line-height:1.8;letter-spacing:1.3px;display:flex;align-items:flex-start;gap:12px;color:#e5ede0a6}.spot-caption b{font-weight:400;letter-spacing:.4px;color:#edf5e3da}.caption-line{height:27px;width:1px;background:#d6efb088;margin-top:4px}.map-card{position:absolute;z-index:2;right:34px;bottom:33px;width:210px;background:rgba(17,53,60,.75);border:1px solid #f0f7e62b;border-radius:14px;overflow:hidden;backdrop-filter:blur(18px);box-shadow:0 12px 35px #163c4320}.map-header,.map-footer{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;font-size:8px;letter-spacing:1.5px}.map-header{padding-bottom:3px}.map-north{color:#d6efb09c;letter-spacing:1px;font-size:9px}#minimap{width:100%;height:139px;display:block}.map-footer{border-top:1px solid #c0d3d422;padding:7px 12px;color:#dcead5a8;font-size:7px;letter-spacing:1px}.map-footer button{background:transparent;border:1px solid #bfd2cc66;color:#c9d9cf;border-radius:50%;width:17px;height:17px;font-family:Georgia,serif;font-size:11px;padding:0}.prototype-note{position:absolute;z-index:2;bottom:36px;left:50%;transform:translateX(-50%);font-size:8px;letter-spacing:2px;white-space:nowrap;color:#eef4e2aa}.hud{position:absolute;z-index:2;top:108px;left:40px;display:flex;gap:28px;align-items:flex-start;background:#143d446b;backdrop-filter:blur(16px);padding:18px 21px;border:1px solid #eff6e424;border-radius:14px}.stat-label{font-size:8px;letter-spacing:1.6px;color:#d7e4de;display:block;margin-bottom:8px}.stat b{font-size:27px;font-weight:400;letter-spacing:-1px;line-height:1}.primary-stat b{color:var(--lime);font-size:34px}.unit{font-size:10px;color:#d4e0d5;margin-left:5px}.flight-status{font-size:8px;letter-spacing:.9px;margin-left:1px;min-width:100px;padding-left:20px;border-left:1px solid var(--line);line-height:1.3}#heightLabel{color:var(--lime);font-size:7px}.height-track{height:3px;background:#c4d9cc33;width:105px;margin:12px 0 9px;border-radius:3px;overflow:hidden}#heightFill{height:100%;width:10%;background:var(--lime);transition:width .1s}.challenge{position:absolute;z-index:2;top:110px;right:35px;display:flex;align-items:center;gap:13px;background:#173e446b;border:1px solid #eff6e424;backdrop-filter:blur(16px);border-radius:12px;padding:13px 15px}.challenge-number{font-size:28px;letter-spacing:-2px;color:var(--lime);font-weight:400}.challenge>div{display:grid;gap:7px}.challenge div>span{font-size:7px;letter-spacing:1.3px;color:#d5e5d8}.challenge div>b{font-size:12px;font-weight:400}.challenge>span:last-child{font-size:10px;margin-left:12px;color:#b7cebf}.rhythm{position:absolute;bottom:39px;left:50%;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:16px}.rhythm-copy{text-align:right;display:grid;gap:7px}.rhythm-copy>span{color:var(--lime);font-size:8px;letter-spacing:1.3px}.rhythm-copy>b{font-size:10px;font-weight:400;color:#ecf3e3}.pump-button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:78px;height:78px;border:1px solid #d6efb055;border-radius:50%;background:#133d45d9;backdrop-filter:blur(16px);color:var(--lime);padding:0;touch-action:none;user-select:none}.beat-svg{position:absolute;inset:-7px;width:90px;height:90px;transform:rotate(-90deg);pointer-events:none}.beat-svg circle{fill:none;stroke-width:2}.beat-track{stroke:#d6efb022}#beatRing{stroke:var(--lime);stroke-dasharray:251.33;stroke-dashoffset:240}.pump-icon{width:25px;height:25px;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}.pump-button>span{font-size:7px;letter-spacing:1px}.pump-button.on-beat{box-shadow:0 0 0 6px #d6efb022;background:#cce9a6;color:#164246}.rhythm-ticks{display:flex;align-items:center;gap:4px;width:36px}.rhythm-ticks i{height:6px;width:3px;border-radius:2px;background:#d6efb044}.rhythm-ticks i.filled{background:var(--lime);height:14px}.feedback{position:absolute;z-index:3;left:50%;top:34%;transform:translate(-50%,8px);font-size:17px;font-weight:500;letter-spacing:.2px;color:var(--lime);text-shadow:0 2px 14px #13383d;opacity:0;transition:opacity .15s,transform .15s;pointer-events:none;white-space:nowrap}.feedback.visible{opacity:1;transform:translate(-50%,0)}.feedback small{display:block;margin-top:6px;text-align:center;font-size:9px;letter-spacing:1px;font-weight:400;color:#edf5e2}.help-toast{position:absolute;z-index:3;top:48%;left:50%;transform:translate(-50%,-50%);max-width:430px;background:#183f45d9;border:1px solid #e5f1d93b;backdrop-filter:blur(12px);padding:13px 18px;border-radius:9px;font-size:11px;line-height:1.7;text-align:center;pointer-events:none}.help-toast kbd{margin-left:3px}.playing-footer{position:absolute;z-index:2;bottom:15px;left:50%;transform:translateX(-50%);display:flex;gap:14px;font-size:7px;color:#e9f1e3b3;white-space:nowrap}.playing-footer kbd{height:14px;min-width:15px;font-size:7px;border-radius:3px;margin-right:3px}.steer-controls{position:absolute;z-index:4;bottom:44px;left:26px;display:flex;gap:11px}.steer-controls button{height:58px;width:58px;border-radius:50%;background:#163f47bf;border:1px solid #edfae33d;color:#e4f0d7;font-size:24px;touch-action:none;user-select:none}.steer-controls button.pressed{background:#d6efb0;color:#163e42}.settings-panel{position:absolute;z-index:10;right:35px;top:80px;width:280px;background:#153c43f5;border:1px solid #e5f7da30;backdrop-filter:blur(20px);border-radius:14px;padding:23px;box-shadow:0 18px 40px #082f4440}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.panel-heading h2{font-weight:400;font-size:21px;letter-spacing:-.5px;margin:0}.panel-heading button{color:#d4e2d2;border:0;background:none;font-size:23px;padding:0 3px}.settings-panel label{font-size:10px;display:block;color:#c8dcd2;margin:17px 0 7px}.settings-panel select{appearance:auto;background:#254f54;border:1px solid #b9d3b63d;color:#edf5e5;width:100%;padding:10px;border-radius:6px;font-size:11px}.settings-panel p{font-size:9px;line-height:1.6;color:#a9c3ba;margin:18px 0 0}.modal-backdrop{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#092b3b66;backdrop-filter:blur(8px);padding:20px}.modal{width:390px;max-height:95%;overflow-y:auto;background:#173f45f7;border:1px solid #d9efcd38;border-radius:20px;padding:32px;box-shadow:0 24px 70px #062f4266}.modal h2{font-size:42px;font-weight:400;letter-spacing:-2px;line-height:1.05;margin:24px 0}.modal p{font-size:12px;line-height:1.7;color:#c9ddd1}.modal .start-btn{margin-top:23px}.secondary-btn{width:100%;display:block;text-align:center;background:#d7ecc00c;border:1px solid #d7ecc040;border-radius:8px;color:#e5efd8;padding:13px 15px;font-size:12px;margin-top:10px}.text-btn{display:block;border:0;background:transparent;color:#c8dbc9;font-size:11px;padding:10px;margin:12px auto 0}.result-main{display:flex;flex-direction:column;align-items:center;margin:23px 0;gap:7px}.result-main>b{font-size:70px;line-height:1;letter-spacing:-4px;color:var(--lime);font-weight:400}.result-main>span{font-size:8px;letter-spacing:2px;color:#d1e1d2}.result-stats{display:flex;justify-content:space-around;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:17px 0;gap:14px}.result-stats>div{display:grid;gap:8px;text-align:center}.result-stats b{font-size:17px;font-weight:400}.result-stats span{font-size:6px;letter-spacing:.9px;color:#c6d8ce}.result-modal h2{margin-bottom:10px}.result-modal>p{font-size:11px;margin:0}.map-link{text-decoration:none}.modal .credits{font-size:9px;margin-top:18px;color:#94b5ab}.credits a{color:#c9ddba}.info-modal .panel-heading{margin-bottom:0}.info-modal h2{font-size:36px}
@media(min-width:1700px){.intro-panel{width:390px;padding:33px}.intro-panel h1{font-size:71px}.intro-copy{font-size:14px}.topbar{left:48px;right:45px;top:35px}.bottom-left{left:49px;bottom:43px}.map-card{right:45px;bottom:43px;width:235px}#minimap{height:160px}}
@media(pointer:fine){.steer-controls{display:none!important}}
@media(max-height:730px) and (min-width:721px){.intro-panel{padding:23px;width:330px;top:51%}.intro-panel h1{font-size:51px;margin-top:18px;margin-bottom:13px}.intro-copy{font-size:12px;margin-bottom:16px}.mini-controls{margin-top:16px;padding-top:13px}.first-run{font-size:7px}.record-card{display:none}.map-card{width:190px}#minimap{height:115px}}
@media(max-width:1000px){.spot-small{display:none}.topbar{left:25px;right:23px}.spot-label{font-size:9px;letter-spacing:1.5px}.brand{font-size:12px;letter-spacing:1.5px}.intro-panel{left:4%;width:330px}.bottom-left{left:25px}.hud{left:25px;gap:19px}.flight-status{display:none}.challenge{right:23px}.map-card{right:23px;width:190px}}
@media(max-width:720px){.topbar{top:16px;left:17px;right:17px;gap:8px}.brand{font-size:11px;letter-spacing:1.3px;gap:6px}.brand svg{height:28px;width:28px}.version{display:none}.brand-light{margin-left:3px}.spot-label{display:none}.top-actions{gap:5px}.icon-btn{width:32px;height:32px}.icon-btn svg{width:15px;height:15px}.intro-panel{left:18px;right:18px;bottom:23px;top:auto;transform:none;width:auto;max-width:390px;padding:24px;border-radius:18px;background:linear-gradient(135deg,#123e44eb,#123e44e0)}.intro-panel h1{font-size:51px;letter-spacing:-2.8px;margin:19px 0 13px}.intro-panel h1 br{display:none}.intro-panel h1 em{margin-left:3px}.intro-copy{font-size:12px;max-width:310px;margin-bottom:17px}.session-select{margin-bottom:13px}.session-option{padding:10px}.start-btn{padding:15px 17px}.mini-controls{display:none}.first-run{font-size:7px;letter-spacing:0;margin-top:11px}.eyebrow{font-size:8px;letter-spacing:1px}.bottom-left{left:20px;bottom:auto;top:77px}.record-card{margin:0}.record-icon{width:27px;height:27px;font-size:16px}.record-card div>span{font-size:6px}.record-card b{font-size:11px}.spot-caption{display:none}.map-card{right:17px;top:76px;bottom:auto;width:125px;border-radius:10px}.map-header{font-size:6px;padding:8px 8px 0;letter-spacing:.8px}.map-north{font-size:7px}#minimap{height:90px}.map-footer{padding:4px 6px;font-size:5px;letter-spacing:.4px}.map-footer button{width:14px;height:14px;font-size:9px}.prototype-note{display:none}.hud{left:17px;right:17px;top:71px;justify-content:space-between;gap:10px;padding:12px 15px}.stat-label{font-size:6px;letter-spacing:1px;margin-bottom:6px}.stat b{font-size:22px}.primary-stat b{font-size:26px}.unit{font-size:8px;margin-left:3px}.challenge{left:17px;right:auto;top:151px;padding:9px 12px;gap:9px}.challenge-number{font-size:23px}.challenge div>span{font-size:6px}.challenge div>b{font-size:10px}.challenge>span:last-child{font-size:9px;margin-left:8px}body.playing .map-card{top:151px;width:107px}body.playing #minimap{height:76px}body.playing .map-footer>span{font-size:4px}.rhythm{bottom:42px;left:auto;right:24px;transform:none;gap:10px}.pump-button{height:69px;width:69px}.beat-svg{width:81px;height:81px;inset:-7px}.pump-button>span{font-size:6px}.rhythm-ticks{display:none}.rhythm-copy{max-width:115px}.rhythm-copy>span{font-size:6px;letter-spacing:.8px}.rhythm-copy>b{font-size:8px;max-width:112px;line-height:1.6}.steer-controls{bottom:47px;left:19px;gap:9px}.steer-controls button{width:49px;height:49px;font-size:22px}.playing-footer{bottom:14px;font-size:6px;gap:10px}.playing-footer kbd{font-size:6px}.feedback{top:38%;font-size:15px}.help-toast{width:82%;font-size:10px;top:49%;padding:11px 14px}.settings-panel{top:62px;right:17px;width:260px}.modal{padding:26px;max-width:370px}.modal h2{font-size:36px}.result-main>b{font-size:59px}}
@media(max-height:520px) and (max-width:950px){.intro-panel{left:23px;bottom:22px;width:310px;max-height:calc(100% - 95px);overflow-y:auto;padding:20px}.intro-panel h1{font-size:42px;margin:12px 0}.intro-copy{font-size:11px;margin-bottom:10px}.session-select{margin-bottom:10px}.session-option{padding:8px}.first-run{font-size:6px}.mini-controls{display:none}.bottom-left{display:none}.map-card{bottom:22px;top:auto!important;right:22px;width:155px}.hud{top:72px}.challenge{top:72px}.rhythm{bottom:30px}.help-toast{top:50%}.modal h2{font-size:29px;margin:12px 0}.modal{padding:22px}.result-main{margin:12px 0}.result-main>b{font-size:44px}.modal .start-btn{margin-top:15px}}

/* Stance selection and the short run-up stay part of the play flow. */
.stance-switch{display:flex;gap:7px;margin:0 0 7px}.stance-switch button{flex:1;padding:10px 8px;border:1px solid #d6efb03b;border-radius:7px;background:#23474d;color:#ccded3;font-size:11px;letter-spacing:.2px}.stance-switch button.selected{background:#d6efb025;border-color:#d6efb0a3;color:#e9f6d6}.stance-hint{font-size:8px;line-height:1.4;color:#bdd3c4;margin:0 0 14px}.intro-panel{padding:25px}.intro-panel h1{font-size:56px;margin:20px 0 16px}.intro-copy{margin-bottom:17px}.mini-controls{gap:12px;margin-top:17px;padding-top:14px}.icon-btn:disabled{cursor:default;opacity:.4}.info-modal a{color:#d6efb0}.rhythm-copy{max-width:245px}.rhythm-copy b{line-height:1.5}
@media(max-height:720px) and (min-width:721px){.intro-panel{top:51%;padding:22px;width:345px}.intro-panel h1{font-size:49px;margin:15px 0 12px}.intro-copy{font-size:12px;margin-bottom:12px}.stance-switch button{padding:8px}.stance-hint{margin-bottom:10px}.session-select{margin-bottom:12px}.session-option{padding:9px}.start-btn{padding:14px 16px}.mini-controls{margin-top:13px;padding-top:12px}.first-run{font-size:7px}}
@media(max-width:720px){.intro-panel h1{font-size:46px;margin:14px 0 12px}.stance-switch button{padding:8px}.stance-hint{margin-bottom:10px}.rhythm-copy{max-width:175px}.rhythm-copy b{font-size:8px}}
@media(max-height:610px) and (max-width:720px){.intro-panel{padding:16px}.intro-panel h1{font-size:36px;margin:10px 0}.intro-copy{font-size:10px;margin-bottom:9px}.stance-hint{font-size:7px;margin-bottom:8px}.mini-controls{margin-top:9px;padding-top:9px}.session-option{padding:7px}.session-select{margin-bottom:9px}.start-btn{padding:12px}}
.help-toast{top:26%}
.brand-lockup{display:grid;gap:4px}.brand-lockup small{font-size:8px;font-weight:500;letter-spacing:2.8px;color:#d5e7d2}
.surf-icon{display:none;width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.pump-button.surf-riding{background:#97dbd4;color:#123e43;border-color:#d4fff0}.pump-button.surf-riding .pump-icon{display:none}.pump-button.surf-riding .surf-icon{display:block}.pump-button.surf-riding #beatRing{stroke:#b4eee2}
.wave-option{display:flex;align-items:center;gap:10px;margin:0 0 13px;padding:9px 11px;border:1px solid #d6efb033;border-radius:8px;background:#d6efb009;cursor:pointer}.wave-option input{width:16px;height:16px;flex-shrink:0;margin:0;accent-color:#a9e5d8;cursor:pointer}.wave-option>span{display:grid;gap:4px}.wave-option b{font-size:10px;font-weight:500;color:#e7f3e7}.wave-option small{font-size:8px;color:#bed4cc}.wave-option .wave-symbol{margin-left:auto;color:#a9e5d8;font-size:27px}.waves-on .wave-option{background:#a9e5d81a;border-color:#a9e5d887}.wave-status{position:absolute;z-index:2;right:35px;top:110px;display:grid;gap:7px;width:280px;padding:14px 16px;background:#173e44ad;border:1px solid #eff6e42b;border-radius:12px;backdrop-filter:blur(16px)}.wave-status.with-course{top:194px}.wave-status>span{font-size:8px;letter-spacing:1px;color:#c5e9dc}.wave-status>b{font-size:10px;font-weight:400;color:#eff5e7}.wave-status>small{font-size:8px;color:#bad1c6}.wave-status.riding{border-color:#a9e5d899;background:#17454bcc}.intro-panel{max-height:calc(100dvh - 110px);overflow-y:auto}
@media(max-width:720px){.wave-status,.wave-status.with-course{left:17px;right:17px;top:282px;width:auto;max-width:290px;padding:10px 12px;gap:5px}.wave-status>span{font-size:7px}.wave-status>b{font-size:9px}.wave-status>small{font-size:7px}.wave-option{margin-bottom:11px}}
@media(max-height:520px) and (max-width:950px){.wave-status,.wave-status.with-course{left:auto;right:22px;top:145px;max-width:245px}}