:root{color-scheme:dark;--ink:#202a26;--lime:#deff7a;--cream:#f6f3e8}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#151d19;color:var(--cream);font-family:Arial,Helvetica,sans-serif;overscroll-behavior:none;touch-action:none}button{font:inherit;cursor:pointer;color:inherit;border:0}#game{position:relative;width:100%;max-width:540px;height:100%;height:100dvh;margin:auto;overflow:hidden;background:#bdd8cb;isolation:isolate}canvas{position:absolute;inset:0;width:100%;height:100%}#hud{position:absolute;top:max(19px,env(safe-area-inset-top));left:22px;right:22px;display:flex;align-items:center;justify-content:space-between;color:var(--ink)}.brand{font-size:33px;font-weight:1000;letter-spacing:-4px;line-height:1}.brand>span{color:#426954;font-size:29px;letter-spacing:-2px}.brand small{display:block;letter-spacing:1.3px;font-size:8px;margin-top:4px}.score{text-align:center;padding-right:10px}.score>span{font-size:31px;font-weight:900;letter-spacing:-1px;font-variant-numeric:tabular-nums}.score small{display:block;font-size:8px;font-weight:700;letter-spacing:2px;margin-top:2px}.icon{border:1px solid #202a2640;background:#eff5e650;border-radius:50%;height:38px;width:38px;font-weight:900}#runbar{position:absolute;top:calc(max(19px,env(safe-area-inset-top)) + 66px);left:22px;right:22px;border-top:1px solid #202a2630;padding-top:12px;display:flex;justify-content:space-between;color:var(--ink);font-size:9px;letter-spacing:1px}#runbar b{font-size:9px}#runbar i{display:inline-block;width:5px;height:5px;border-radius:100%;background:#507c5c;margin:0 5px 1px 0}#timer{font-size:12px;font-weight:bold;font-variant-numeric:tabular-nums}#objectives{position:absolute;top:calc(max(19px,env(safe-area-inset-top)) + 102px);left:22px;display:flex;gap:5px}#objectives span{font-size:9px;letter-spacing:.3px;background:#f6f3e891;color:#334e42;padding:6px 9px;border-radius:20px}#objectives span.done{background:var(--lime);color:#202a26}#controls{position:absolute;bottom:calc(max(18px,env(safe-area-inset-bottom)) + 34px);left:23px;right:23px;display:flex;justify-content:space-between;pointer-events:none}.control{display:flex;flex-direction:column;align-items:center;gap:9px}.pad-label{font-size:8px;font-weight:800;letter-spacing:1.8px;text-shadow:0 1px 8px #18251c}.pad{width:111px;height:111px;position:relative;border:1px solid #f3f6e845;background:#20362c32;border-radius:50%;pointer-events:auto;touch-action:none;user-select:none;box-shadow:inset 0 0 0 8px #ffffff05;backdrop-filter:blur(3px)}.pad:after{content:'';position:absolute;inset:19px;border-radius:50%;border:1px dashed #f6f3e827;pointer-events:none}.knob{position:absolute;left:36px;top:36px;width:37px;height:37px;border-radius:50%;background:#f6f3e8db;border:1px solid #fff;box-shadow:0 4px 14px #10231830;pointer-events:none;z-index:2}.right .knob{background:var(--lime);border-color:#ebffb2}.axis{position:absolute;top:43px;left:12px;right:12px;display:block;text-align:center;white-space:pre;font-size:17px;color:#fff9}.up,.down,.left-arrow,.right-arrow{position:absolute;color:#e0ffac9c;font-size:16px}.up{top:5px;left:47px}.down{bottom:5px;left:47px}.left-arrow{top:27px;left:12px}.right-arrow{top:27px;right:12px}.pad.active{border-color:var(--lime);background:#32432e60}#bottom{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:22px;right:22px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:7px;letter-spacing:1px}#bottom button{font-size:8px;letter-spacing:.7px;background:none;padding:9px 0}#bottom>span{opacity:.6;font-size:6px}#combo{position:absolute;bottom:calc(max(18px,env(safe-area-inset-bottom)) + 175px);left:24px;right:24px;display:flex;justify-content:space-between;align-items:center}#comboLabel{font-size:9px;font-weight:bold;letter-spacing:1.6px;text-shadow:0 2px 8px #1a2c1a}#multiplier{font-size:30px;color:var(--lime);font-weight:900}#trick{position:absolute;top:36%;width:100%;text-align:center;pointer-events:none;opacity:0;transition:opacity .15s;filter:drop-shadow(0 2px 6px #23332445)}#trick.show{opacity:1}#trick small{display:block;font-size:9px;letter-spacing:3px;color:var(--lime);font-weight:800}#trick strong{display:block;font-size:36px;line-height:1.1;font-style:italic;font-weight:900;letter-spacing:-1.5px;margin:6px 0}#trick>span{font-size:12px;font-weight:800;letter-spacing:1px}.overlay{position:absolute;inset:0;z-index:10;background:linear-gradient(180deg,#202a2620 5%,#202a2600 24%,#202a2610 44%,#172c26c9 70%,#172c26 100%);padding:26px 26px max(27px,env(safe-area-inset-bottom));display:flex;flex-direction:column;justify-content:space-between}.intro-top{display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1px;color:var(--ink)}.pill{padding:7px 9px;border:1px solid #202a2660;border-radius:20px;font-weight:700}.intro-copy{position:absolute;top:15%;color:var(--ink)}.eyebrow{font-size:8px;letter-spacing:1.7px;font-weight:800}h1{font-size:clamp(72px,21vw,112px);font-weight:1000;line-height:.8;letter-spacing:-8px;margin:19px 0 18px;position:relative}h1 span{font-size:69px;position:absolute;right:-62px;top:0;color:#527760}.intro-copy>p{font-size:12px;line-height:1.55}.intro-bottom{margin-top:auto;width:100%}.how{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:21px}.how b{font-size:9px;color:var(--lime);letter-spacing:1.5px}.how p{font-size:11px;line-height:1.6;opacity:.85;margin:7px 0 0}.primary{background:var(--lime);color:var(--ink);padding:19px 19px;width:100%;display:flex;justify-content:space-between;align-items:center;font-weight:900;font-size:13px;letter-spacing:1.5px;border-radius:3px}.primary span{font-size:23px;line-height:14px}.intro-foot{display:flex;justify-content:space-between;font-size:7px;letter-spacing:1px;opacity:.65;margin-top:15px}.modal{position:absolute;inset:0;z-index:20;background:#15231db8;backdrop-filter:blur(7px);display:flex;align-items:center;padding:23px}.sheet{width:100%;background:#25372e;padding:27px;border:1px solid #dfff7930;border-radius:8px}.sheet h2{font-size:37px;letter-spacing:-1.5px;margin:14px 0 22px}.sheet .eyebrow{color:var(--lime)}.secondary{width:100%;background:none;font-size:9px;letter-spacing:1.5px;padding:20px 0 0;opacity:.7}.guide{display:grid;grid-template-columns:65px 1fr;gap:15px 10px;margin:0 0 24px;font-size:12px;line-height:1.5}.guide b{font-size:22px;color:var(--lime)}.guide span small{display:block;opacity:.55;font-size:10px}.modal p{font-size:12px;line-height:1.6;color:#d1d8c9}.result-score{font-size:68px;font-weight:900;letter-spacing:-4px;color:var(--lime)}.stats{display:flex;gap:22px;margin:16px 0 25px}.stats span{font-size:10px;line-height:1.6;opacity:.8}.stats b{display:block;font-size:20px}.hidden{display:none!important}#landscape{display:none}body.intro #hud,body.intro #runbar,body.intro #objectives,body.intro #controls,body.intro #combo,body.intro #bottom{visibility:hidden}@media (orientation:landscape) and (max-height:500px){#landscape{display:flex;position:absolute;inset:0;z-index:50;background:#202a26;align-items:center;justify-content:center;flex-direction:column;font-size:25px;font-weight:bold;color:var(--lime)}#landscape small{font-size:12px;color:#eee;margin-top:16px}}@media(max-height:690px){.intro-copy{top:14%}h1{font-size:76px}.intro-copy>p{font-size:11px}.how{margin-bottom:13px}.overlay{padding:20px}.pad{width:98px;height:98px}.knob{left:30px;top:30px}.up,.down{left:41px}.axis{top:36px}#controls{left:20px;right:20px}#combo{bottom:175px}.sheet{padding:20px}.guide{gap:9px}.sheet h2{margin:10px 0 15px}}
.sheet{max-height:calc(100dvh - 46px);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#b0c781 #25372e}.sheet>*{touch-action:pan-y}@media(max-width:350px){.sheet h2{font-size:31px}.guide{grid-template-columns:48px 1fr;font-size:11px}.guide b{font-size:20px}.sheet p{font-size:11px}}
#game{background:#c6dad0}#scene{touch-action:none}.overlay{background:linear-gradient(180deg,#e7edea50 0%,#d9e8de00 37%,#17382c22 49%,#172c26ed 76%,#172c26 100%)}.intro-copy{top:14%}.intro-copy p{font-weight:500;text-shadow:0 1px 8px #e8eee1}.intro-top{font-size:7px}.intro-copy .eyebrow{font-size:7px;letter-spacing:1.6px}#modeSelect{display:flex;border:1px solid #b4c9a945;margin-bottom:12px;border-radius:4px;overflow:hidden}#modeSelect button{background:#142a2440;width:50%;padding:11px 5px;font-size:9px;letter-spacing:.8px;text-align:center;font-weight:800}#modeSelect button.selected{color:#e0ff7a;background:#46604d80;box-shadow:inset 0 -2px #deff7a}#modeSelect small{display:block;font-size:6px;letter-spacing:.7px;opacity:.6;margin-top:5px}.primary:disabled{opacity:.6}.header-actions{display:flex;gap:7px}.header-actions .icon{width:33px;height:33px;font-size:15px}#hud{left:18px;right:18px}.score>span{font-size:28px}.brand{font-size:29px}#runbar{left:18px;right:18px}#objectives{left:18px}#timer{font-size:10px}#controls{left:18px;right:18px;gap:6px}.pad{background:#1c362e60;border-color:#f6f3e86b}.pad-label{font-size:7px;letter-spacing:1px}#bottom{left:18px;right:18px}#minimap{position:absolute;right:18px;top:calc(max(19px,env(safe-area-inset-top)) + 106px);width:70px;background:#163a2e7d;border:1px solid #f9ffed50;border-radius:4px;padding:4px 4px 5px;backdrop-filter:blur(5px)}#map{position:static;display:block;width:60px;height:68px}#minimap span{display:block;text-align:center;font-size:5px;letter-spacing:1px;opacity:.8;margin-top:4px}body.intro #minimap{visibility:hidden}#trick{top:31%;padding:0 16px}#trick strong{font-size:29px}#trickPoints{font-size:11px}#combo{left:20px;right:20px;bottom:calc(max(18px,env(safe-area-inset-bottom)) + 184px);align-items:flex-start;gap:10px}#combo>div{flex:1;min-width:0}#comboLabel{font-size:16px;font-weight:900;letter-spacing:.4px;color:#eeffb8}#comboTricks{display:block;font-size:9px;line-height:1.5;opacity:.85;margin-top:5px;min-height:14px}#comboClock{width:100%;max-width:230px;height:3px;background:#ffffff20;margin-top:7px;border-radius:2px;overflow:hidden}#comboClock i{display:block;width:0;height:100%;background:#deff7a}#multiplier{font-size:36px;line-height:1}.link-control{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:10px;gap:7px;pointer-events:auto}.link-control button{width:44px;height:44px;border:1px solid #d6edb586;border-radius:50%;background:#273e3180;font-size:8px;font-weight:bold;letter-spacing:1px;touch-action:none}.link-control button.active{background:#deff7a;color:#21382a}.link-control small{font-size:5px;line-height:1.5;text-align:center;letter-spacing:.5px;opacity:.7}#speed{font-size:7px;letter-spacing:.7px;font-weight:bold}#balance{position:absolute;left:30%;right:30%;top:calc(57% + 20px);text-align:center;font-size:7px;letter-spacing:2px}#balance>div{height:6px;border:1px solid #fff9;border-radius:10px;background:linear-gradient(90deg,#ee947b 0%,#deff7a 40%,#deff7a 60%,#ee947b 100%);position:relative;margin-top:8px}#balanceNeedle{position:absolute;top:-5px;left:50%;height:15px;width:3px;background:white;box-shadow:0 0 8px #202a26}.challenges{list-style:none;padding:0;margin:16px 0 25px;display:grid;gap:9px}.challenges li{font-size:11px;display:flex;gap:9px}.challenges .checked{color:#deff7a}.load-error{font-size:12px;line-height:1.5;background:#283c31;padding:12px}.fatal{position:absolute;inset:0;background:#213729;padding:50px;z-index:100}#scene.lost{filter:blur(4px)}@media(max-height:730px){h1{font-size:72px;letter-spacing:-6px}.intro-copy{top:12%}.intro-copy>p{font-size:10px}.how{margin-bottom:13px}.how p{font-size:10px}.intro-foot{font-size:6px}.primary{padding:16px}#modeSelect button{padding:8px 4px}.intro-top{font-size:6px}.overlay{padding:20px}.pad{width:96px;height:96px}.knob{left:29px;top:29px}#combo{bottom:174px}.axis{top:36px}.up,.down{left:40px}#controls{bottom:48px}.sheet{padding:20px}.guide{gap:9px}}
@media(max-width:350px){.pad{width:94px;height:94px}.knob{left:28px;top:28px}.pad-label{font-size:6px}.link-control button{width:36px;height:36px}#hud{left:14px;right:14px}.score>span{font-size:24px}#objectives span{font-size:8px;padding:5px 7px}.intro-copy .eyebrow{font-size:6px}.intro-top .pill{font-size:6px}.intro-copy>p{font-size:10px}.intro-copy{top:13%}h1{font-size:65px;line-height:.82}.how p{font-size:9px}.how b{font-size:8px}.intro-bottom .primary{padding:13px}}
#vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#e4ecdec9 0%,#e4ecde55 12%,#e4ecde00 25%,#203a2e00 58%,#19332888 85%,#193328e0 100%)}body.intro #vignette{display:none}#trick{filter:drop-shadow(0 2px 5px #142f2390)}
