:root{color-scheme:dark;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",system-ui,sans-serif;color:#f3f7ff;background:#0b1d33;font-synthesis:none}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
button{font:inherit;cursor:pointer;color:inherit;border:0;touch-action:none}
button:focus-visible{outline:3px solid #ffe3a0;outline-offset:5px}
[hidden]{display:none!important}
#game{position:relative;isolation:isolate;width:100%;height:100dvh;min-height:420px;overflow:hidden;touch-action:auto;user-select:none}
canvas{display:block;width:100%;height:100%;touch-action:none}
.hud{position:absolute;top:max(23px,env(safe-area-inset-top));left:24px;right:24px;display:flex;align-items:center;gap:16px;pointer-events:none}
.brand{display:grid;gap:5px;margin-right:auto}.brand>span{font-size:12px;letter-spacing:3px;font-weight:600}.brand small{font-size:11px;color:#bfd1e3;letter-spacing:2px}
.stats{display:flex;gap:8px;align-items:center;font-variant-numeric:tabular-nums;font-size:22px;font-weight:600}.stats small{font-size:12px;color:#bed0df}.star-icon{font-size:26px;color:#ffdb93}
.icon-button{pointer-events:auto;display:grid;place-items:center;width:38px;height:38px;border:1px solid #ffffff30;background:#ffffff0c;border-radius:50%;font-size:16px}
.progress-track{position:absolute;left:24px;right:24px;top:calc(max(23px,env(safe-area-inset-top)) + 66px);height:2px;background:#ffffff1a;border-radius:2px;overflow:hidden}#progress{width:0;height:100%;background:#ffdca0;transition:width .15s linear}
.toast{position:absolute;left:20px;right:20px;bottom:calc(max(26px,env(safe-area-inset-bottom)) + 170px);text-align:center;color:#ffe1a1;font-size:13px;opacity:0;transition:opacity .2s;pointer-events:none}.toast.show{opacity:1}
.controls{position:absolute;left:24px;right:24px;bottom:max(28px,env(safe-area-inset-bottom));height:145px;display:flex;align-items:flex-end;justify-content:space-between}
.action-buttons{position:relative;display:flex;align-items:flex-end;gap:12px;padding-bottom:10px}.action{border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#eef7ff0c;border:1px solid #eef7ff40;width:66px;height:66px}.action>span{font-family:system-ui;font-size:27px;line-height:1.1;font-weight:400}.action small{font-size:10px;margin-top:4px}.jump{width:78px;height:78px;background:#ffdda61a;border-color:#ffdda680;color:#ffe3ad}.dash{margin-bottom:40px}.action.pressed{background:#eef7ff40;transform:scale(.94)}.dash.unavailable{opacity:.34}.dash.ready{box-shadow:0 0 25px #a9e7ff18}.hold-label{position:absolute;right:3px;bottom:-11px;font-size:10px;color:#c8d6e2}
.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:100px 28px 32px;background:linear-gradient(180deg,#0b213855,#102f507a 40%,#0c2440e8);backdrop-filter:blur(3px);text-align:center}
.sun-badge{width:68px;height:68px;flex-shrink:0;margin-bottom:12px;filter:drop-shadow(0 0 22px #ffdc9955)}.intro-tag{color:#c7d9e7;font-size:9px;letter-spacing:3px;margin-bottom:19px}h1{font-size:clamp(36px,8vw,58px);font-weight:600;letter-spacing:4px;margin:0 0 17px;text-shadow:0 4px 35px #e7efff25}.subtitle{font-size:13px;letter-spacing:1px;line-height:2;margin:0 0 30px;color:#dbe5ee}.intro-content{width:100%;max-width:310px}.stage-label{display:flex;align-items:center;text-align:left;gap:16px;padding:17px 0;border-block:1px solid #ffffff22}.stage-label>span{font-size:30px;color:#ffe0a7;font-family:Georgia,serif}.stage-label>div{font-size:14px;letter-spacing:2px}.stage-label small{display:block;letter-spacing:.5px;font-size:10px;color:#b6cddd;margin-top:6px}.instructions{margin:20px 0;text-align:left}.instructions p{font-size:12px;margin:12px 0;color:#e0eaf2;display:flex;gap:16px}.instructions p>span{color:#a7c2d7;width:48px;flex-shrink:0}.intro-note{font-size:11px;line-height:1.9;color:#b4cbdd;margin:0 0 26px}.primary{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:310px;min-height:53px;padding:15px 24px;background:#ffe0a9;color:#17314d;border-radius:28px;font-size:14px;letter-spacing:1px;font-weight:600;box-shadow:0 7px 35px #ffdd9912}.primary span{font-size:20px}.secondary{padding:16px;background:none;font-size:12px;color:#d0e0ed;text-decoration:underline;text-underline-offset:5px}.keyboard-note{font-size:10px;line-height:1.7;color:#9bb5cd;margin:22px 0 0}.result{max-width:310px;width:100%;margin:2px 0 28px;line-height:2;font-size:13px;color:#cfdeeb}.result strong{font-size:35px;display:block;color:#ffe0a9;font-weight:600}.result small{display:block;color:#a8c3d8;font-size:11px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:720px){#game{max-width:1000px;margin:auto;border-inline:1px solid #ffffff12}.hud{left:36px;right:36px}.controls{left:40px;right:40px}.overlay{padding-top:90px}}
@media(max-height:670px){.sun-badge{display:none}.overlay{padding-top:86px}.intro-tag{margin-bottom:10px}h1{font-size:35px;margin-bottom:10px}.subtitle{margin-bottom:16px;font-size:12px}.stage-label{padding:10px 0}.instructions{margin:13px 0}.instructions p{margin:8px 0}.intro-note{margin-bottom:15px}.keyboard-note{margin-top:13px}.controls{transform:scale(.88);transform-origin:bottom center;left:14px;right:14px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.controls{isolation:isolate}.controls::before{content:"";position:absolute;z-index:-1;inset:-50px -40px -45px;background:linear-gradient(180deg,#263e6300,#263e63b8);pointer-events:none}.hold-label{color:#e6edf8}.action{background:#304a755c;border-color:#eef7ff8a}.jump{background:#ffdda6d9;color:#344565;border-color:#ffe8bc}.dash.unavailable{opacity:.55}
@media(min-height:671px) and (max-height:740px){.sun-badge{width:50px;height:50px}.overlay{padding-top:86px}.intro-tag{margin-bottom:12px}.subtitle{margin-bottom:20px}.intro-note{margin-bottom:20px}}
.auto-note{align-self:center;text-align:left;max-width:160px}.auto-note>span{font-size:10px;letter-spacing:1.5px;color:#ffdfa1}.auto-note p{font-size:11px;line-height:1.9;margin:9px 0;color:#f1f5ff}.auto-note small{font-size:9px;color:#d2e0f0}@media(max-width:400px){.auto-note{max-width:125px}.auto-note small{font-size:8px}.action-buttons{gap:9px}}
.effects{position:absolute;top:calc(max(23px,env(safe-area-inset-top)) + 84px);left:24px;right:24px;font-size:11px;color:#defff0;letter-spacing:.5px;pointer-events:none}
.home{position:absolute;inset:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:max(24px,env(safe-area-inset-top)) 24px max(22px,env(safe-area-inset-bottom));background:linear-gradient(165deg,#172d48f5,#233b5bea 65%,#3c4260f2);scrollbar-width:thin}.home>*{max-width:520px;margin-inline:auto}.home-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.home-top>span{font-size:11px;letter-spacing:3px;font-weight:600}.home-top small{font-size:11px;color:#c8d7e8}.home-hero{display:flex;align-items:center;justify-content:center;gap:17px;margin-block:24px}.home-sun{font-family:system-ui;font-size:62px;color:#ffdfa1;line-height:1;text-shadow:0 0 26px #ffd89344}.home-hero h1{font-size:31px;letter-spacing:3px;margin:0 0 8px}.home-hero p{font-size:11px;letter-spacing:1px;color:#c3d2e4;margin:0}.home-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}.home-heading h2{font-size:12px;font-weight:500;margin:0}.home-heading>span{font-size:9px;color:#aebfd3}.stage-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.stage-tile{min-height:59px;border:1px solid #ffffff2b;border-radius:12px;background:#ffffff08;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;touch-action:manipulation}.stage-tile>span{font-size:19px;font-weight:500;line-height:1.2}.stage-tile small{font-size:8px;color:#aabed3}.stage-tile.selected{background:#ffdfa11a;border-color:#ffdfa1;color:#ffe0a6}.stage-tile.cleared{border-color:#a8e3d55e}.stage-tile.cleared small{color:#a8e3d5}.stage-tile:disabled{cursor:default;opacity:.43;background:#0a1a2d40}.selected-stage{margin-block:17px 14px;padding:13px 15px;border:1px solid #ffffff20;border-radius:12px;min-height:75px}.selected-stage>span{display:block;font-size:10px;letter-spacing:1px;color:#ffdfa1;margin-bottom:6px}.selected-stage p{font-size:14px;margin:0 0 6px}.selected-stage small{font-size:10px;color:#b4c8dd}.home>.primary{max-width:520px}.home-controls{font-size:10px;text-align:center;line-height:1.9;color:#c5d5e8;margin-block:14px 6px}.save-status{font-size:9px;line-height:1.7;text-align:center;color:#97b2ce;margin-block:0}.home-link{background:none;padding:11px 16px;font-size:12px;color:#cadced;text-decoration:underline;text-underline-offset:5px;flex-shrink:0}.secondary{flex-shrink:0}.overlay .subtitle{max-width:320px}.overlay .primary{flex-shrink:0}
@media(max-height:650px){.home-hero{margin-block:18px}.home-hero h1{font-size:28px}.home-sun{font-size:52px}.stage-tile{min-height:53px}.stage-grid{gap:7px}.selected-stage{margin-block:14px 12px}}
.home-sun .sun-badge{display:block;width:70px;height:70px;margin:0}
.home-hero{margin-block:12px}.selected-stage{margin-block:10px 7px;padding:11px 13px}.home{padding-bottom:max(16px,env(safe-area-inset-bottom))}
.medal-icon{width:18px;height:21px;vertical-align:middle;flex-shrink:0}.medal-status{display:flex;align-items:center;justify-content:center;gap:6px;color:#ffdfa1;font-size:11px;margin-top:7px}.selected-stage .medal-status{justify-content:flex-start;color:#ffdfa1}.stage-tile .tile-medal{display:flex;align-items:center;gap:3px;color:#ffdfa1}.tile-medal .medal-icon{width:10px;height:12px}.toast{z-index:5}.home-top small{font-size:10px}

/* iOS Safari can select nested button text during a long touch unless every descendant opts out. */
.action,.action *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
.action{touch-action:none}
.action>*{pointer-events:none}
@media(max-width:600px){.auto-note p{display:none}}
@media(max-width:600px){.desktop-controls{display:none}.mobile-controls{display:block}}
@media(min-width:601px){.mobile-controls{display:none}}