:root{--accent: #ff6a10;--accent-2: #ffb21a;--aqua: #3ee6d8;--ink: #06141d;--glass: rgba(6, 22, 32, .42);--glass-line: rgba(255, 255, 255, .16);--white: #f7fbfc;--num: "Barlow Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;--jp: "M PLUS Rounded 1c", "Hiragino Maru Gothic ProN", "BIZ UDPGothic", "Yu Gothic", sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:#04121a;color:var(--white);overflow:hidden}body{font-family:var(--jp);-webkit-font-smoothing:antialiased;user-select:none;-webkit-user-select:none;touch-action:none}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;-webkit-tap-highlight-color:transparent}#app{position:fixed;inset:0}#scene{position:absolute;inset:0;width:100%;height:100%;display:block}.hidden{display:none!important}.screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,2.6vh,26px);padding:24px 16px;text-align:center}#loading{background:radial-gradient(120% 90% at 50% 30%,#0f3a4c,#04121a 70%)}#title{justify-content:space-between;padding-top:clamp(28px,7vh,80px);padding-bottom:clamp(18px,4vh,44px);background:linear-gradient(180deg,#030e168c,#030e1600 30% 55%,#030e1699)}#title .mid{display:flex;flex-direction:column;align-items:center;gap:18px}.screen.dim{background:#030c1280;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.brand{display:flex;flex-direction:column;align-items:center;gap:6px;text-shadow:0 4px 24px rgba(0,0,0,.45)}.logo{font-family:var(--num);font-style:italic;font-weight:800;font-size:clamp(64px,12vw,148px);line-height:.86;letter-spacing:.02em}.logo span{color:var(--accent);margin-left:.12em}.sub{font-weight:800;font-size:clamp(16px,2.3vw,24px);letter-spacing:.12em;opacity:.95}.bar{width:min(360px,70vw);height:8px;border-radius:99px;background:#ffffff24;overflow:hidden}.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--aqua),var(--accent));border-radius:inherit;transition:width .2s}.note{margin:0;opacity:.8;font-weight:700}.choose{display:flex;gap:14px}.time-card{width:clamp(116px,15vw,150px);padding:8px 8px 10px;border-radius:20px;background:var(--glass);border:2px solid var(--glass-line);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;flex-direction:column;gap:8px;align-items:center;transition:transform .15s,border-color .15s,box-shadow .15s}.time-card:hover{transform:translateY(-2px)}.time-card[aria-checked=true]{border-color:#fff;box-shadow:0 0 0 4px #ffffff2e,0 10px 30px #00000059}.time-card .lbl{font-weight:800;font-size:19px}.pic{width:100%;aspect-ratio:16 / 10;border-radius:13px;position:relative;overflow:hidden}.pic:before{content:"";position:absolute;border-radius:50%}.pic:after{content:"";position:absolute;left:0;right:0;bottom:0;height:36%}.pic.day{background:linear-gradient(180deg,#2f7fd0,#8cc6ee 70%,#cfe8f4)}.pic.day:before{width:26%;aspect-ratio:1;right:16%;top:14%;background:radial-gradient(circle,#fffbe6 40%,#fffadc00 72%)}.pic.day:after{background:linear-gradient(180deg,#1b6f8c,#0b3f57)}.pic.sunset{background:linear-gradient(180deg,#32315e,#c0587a 45%,#ffad5c 72%,#ffd9a0)}.pic.sunset:before{width:30%;aspect-ratio:1;left:35%;bottom:22%;background:radial-gradient(circle,#fff3c4 35%,#ffb45a00 70%)}.pic.sunset:after{background:linear-gradient(180deg,#e08a5a,#3a2c48 60%,#1c1a30)}.big-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-width:min(320px,80vw);padding:18px 40px;border-radius:99px;font-weight:800;font-size:clamp(24px,3.4vw,34px);letter-spacing:.1em;background:linear-gradient(180deg,#ff8a2a,var(--accent) 60%,#e5550a);box-shadow:0 10px #a63a03,0 18px 36px #0006,inset 0 2px #ffffff59;transition:transform .08s,box-shadow .08s}.big-btn svg{width:1.1em;height:1.1em}.big-btn:hover{filter:brightness(1.06)}.big-btn:active{transform:translateY(6px);box-shadow:0 4px #a63a03,0 8px 18px #0006,inset 0 2px #ffffff59}.big-btn:focus-visible,.sub-btn:focus-visible,.time-card:focus-visible,.icon-btn:focus-visible{outline:3px solid #fff;outline-offset:4px}.sub-btn{padding:12px 28px;border-radius:99px;font-weight:800;font-size:19px;background:#ffffff24;border:2px solid rgba(255,255,255,.3)}.sub-btn:hover{background:#ffffff38}.best{min-height:1.4em;font-family:var(--num);font-weight:700;font-size:22px;letter-spacing:.04em;opacity:.95;display:flex;gap:16px;justify-content:center;align-items:center}.best span{display:inline-flex;align-items:center;gap:6px}.howto{display:flex;gap:clamp(12px,3vw,34px);justify-content:center;flex-wrap:wrap}.how{display:flex;align-items:center;gap:10px;padding:8px 16px 8px 10px;border-radius:16px;background:var(--glass);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--glass-line);font-weight:800;font-size:15px;line-height:1.25;text-align:left}.ico{width:46px;height:46px;flex:none;background:center / contain no-repeat}.mouse-lr{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect x='22' y='14' width='20' height='32' rx='10' fill='%23fff'/%3E%3Cpath d='M32 14v11' stroke='%23163040' stroke-width='2'/%3E%3Cpath d='M14 30l-7 0M7 30l5-5M7 30l5 5M50 30h7M57 30l-5-5M57 30l-5 5' stroke='%233ee6d8' stroke-width='4' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E")}.mouse-click{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect x='22' y='16' width='20' height='32' rx='10' fill='%23fff'/%3E%3Cpath d='M22 26a10 10 0 0 1 10-10v10z' fill='%23ff6a10'/%3E%3Cpath d='M32 16v10' stroke='%23163040' stroke-width='2'/%3E%3Cpath d='M16 12l4 4M12 20h5M22 7l1 5' stroke='%23ffb21a' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E")}.star-ico{display:inline-block;width:40px;height:40px;background:linear-gradient(160deg,#fff2a8,#ffc436 45%,#f08a00);clip-path:polygon(50% 2%,62% 36%,98% 38%,69% 59%,80% 95%,50% 74%,20% 95%,31% 59%,2% 38%,38% 36%)}.star-ico.small{width:24px;height:24px}.gate-ico{display:inline-block;width:40px;height:40px;background:center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M7 36V20a13 13 0 0 1 26 0v16' stroke='%23ff6a10' stroke-width='6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}.jump-ico{display:inline-block;width:40px;height:40px;background:center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M3 34h16L3 26z' fill='%231e6fd9'/%3E%3Cpath d='M18 24c6-14 14-14 19-6' stroke='%233ee6d8' stroke-width='4' fill='none' stroke-linecap='round' stroke-dasharray='1 6'/%3E%3C/svg%3E")}#hud{position:absolute;inset:0;pointer-events:none}.hud-top{position:absolute;top:max(14px,env(safe-area-inset-top));left:16px;right:16px;display:flex;align-items:center;gap:16px}.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 16px 6px 12px;border-radius:99px;background:var(--glass);border:1px solid var(--glass-line);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.pill svg{width:22px;height:22px}.pill b{font-family:var(--num);font-weight:700;font-size:30px;line-height:1;letter-spacing:.02em;font-variant-numeric:tabular-nums}.pill small{font-family:var(--num);font-weight:600;font-size:18px;opacity:.7}.timer b{min-width:3.6em;text-align:left}.progress{flex:1;display:flex;align-items:center;gap:10px;max-width:640px;margin:0 auto}.track{position:relative;flex:1;height:8px;border-radius:99px;background:#ffffff38;box-shadow:0 2px 10px #00000040}.track i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--aqua),#fff)}.boat-dot{position:absolute;top:50%;left:0;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:var(--accent);border:3px solid #fff;box-shadow:0 2px 8px #0006}.flag{width:26px;height:22px;background:center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 22'%3E%3Cpath d='M2 1v20' stroke='%23fff' stroke-width='2.4' stroke-linecap='round'/%3E%3Cpath d='M3 2h20v12H3z' fill='%23fff'/%3E%3Cpath d='M3 2h5v4H3zM13 2h5v4h-5zM8 6h5v4H8zM18 6h5v4h-5zM3 10h5v4H3zM13 10h5v4h-5z' fill='%23111'/%3E%3C/svg%3E")}.hud-bottom{position:absolute;left:16px;right:16px;bottom:max(14px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:flex-end}.hud-buttons{display:flex;gap:10px;pointer-events:auto}.icon-btn{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--glass);border:1px solid var(--glass-line);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.icon-btn svg{width:26px;height:26px}.icon-btn .cross{display:none}.icon-btn.muted .cross{display:block}.icon-btn.muted .wave{display:none}.speedo{display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-shadow:0 3px 18px rgba(0,0,0,.45)}.speed{display:flex;align-items:baseline;gap:6px}.speed b{font-family:var(--num);font-style:italic;font-weight:800;font-size:clamp(64px,9vw,104px);line-height:.8;font-variant-numeric:tabular-nums;min-width:2.1em;text-align:right}.speed small{font-family:var(--num);font-weight:700;font-size:22px;opacity:.85}.turbo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:15px}.gauge{width:clamp(150px,18vw,230px);height:14px;border-radius:99px;background:#ffffff2e;border:1px solid rgba(255,255,255,.25);overflow:hidden}.gauge i{display:block;height:100%;width:100%;border-radius:inherit;background:linear-gradient(90deg,var(--aqua),#8ff 50%,var(--accent-2));transition:width .08s linear}.gauge.full i{animation:glow .9s ease-in-out infinite alternate}.gauge.on i{background:linear-gradient(90deg,var(--accent),#ffd04a)}@keyframes glow{0%{filter:brightness(1)}to{filter:brightness(1.45)}}#countdown{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}#countdown b{font-family:var(--num);font-style:italic;font-weight:800;font-size:clamp(120px,24vw,280px);text-shadow:0 8px 40px rgba(0,0,0,.45);animation:pop .9s ease-out forwards}#countdown b.go{color:var(--accent-2)}@keyframes pop{0%{transform:scale(1.8);opacity:0}15%{transform:scale(1);opacity:1}75%{opacity:1}to{transform:scale(.85);opacity:0}}#popups{position:absolute;inset:0;pointer-events:none;overflow:hidden}.popup{position:absolute;left:50%;top:34%;transform:translate(-50%);font-weight:800;font-size:clamp(26px,4vw,42px);white-space:nowrap;text-shadow:0 4px 18px rgba(0,0,0,.5),0 0 2px rgba(0,0,0,.6);animation:rise 1.1s ease-out forwards}.popup.gold{color:#ffd34a}.popup.aqua{color:var(--aqua)}.popup.big{font-size:clamp(40px,7vw,76px);top:28%}.popup.side{top:46%;font-size:clamp(22px,3vw,30px)}@keyframes rise{0%{opacity:0;transform:translate(-50%,16px) scale(.85)}15%{opacity:1;transform:translate(-50%) scale(1.05)}30%{transform:translate(-50%) scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-40px)}}#tutorial{position:absolute;left:0;right:0;bottom:22%;display:flex;gap:16px;justify-content:center;pointer-events:none;animation:fadeout 6s forwards}#tutorial .how{font-size:18px;padding:10px 20px 10px 12px}#tutorial .ico{width:54px;height:54px}@keyframes fadeout{0%,80%{opacity:1}to{opacity:0}}#turbo-btn{position:absolute;right:22px;bottom:150px;width:112px;height:112px;border-radius:50%;font-weight:800;font-size:20px;background:radial-gradient(circle at 50% 35%,#ffa04a,var(--accent) 60%,#c94a06);box-shadow:0 8px #8e3404,0 14px 30px #0006;pointer-events:auto}#turbo-btn.on{transform:translateY(5px);box-shadow:0 3px #8e3404,0 8px 18px #0006}#pause h2,#result h2{margin:0;font-size:clamp(30px,5vw,46px);font-weight:800;letter-spacing:.08em;text-shadow:0 4px 20px rgba(0,0,0,.4)}.medal{width:clamp(120px,18vh,170px);height:clamp(120px,18vh,170px);animation:medalIn .7s cubic-bezier(.2,1.6,.4,1) both;filter:drop-shadow(0 12px 24px rgba(0,0,0,.45))}.medal svg{width:100%;height:100%}@keyframes medalIn{0%{transform:scale(.2) rotate(-25deg);opacity:0}to{transform:none;opacity:1}}.res-time{display:flex;align-items:baseline;gap:14px;font-weight:800;font-size:20px;flex-wrap:wrap;justify-content:center}.res-time b{font-family:var(--num);font-style:italic;font-weight:800;font-size:clamp(56px,8vw,84px);line-height:.9}.res-time em{font-style:normal;color:#ffd34a;font-size:22px;animation:blink .8s steps(2) infinite}@keyframes blink{50%{opacity:.35}}.res-grid{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.res-grid>div{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:110px;padding:12px 14px;border-radius:18px;background:var(--glass);border:1px solid var(--glass-line)}.res-grid b{font-family:var(--num);font-weight:700;font-size:40px;line-height:1}.res-grid small{font-weight:800;font-size:14px;opacity:.85}.res-buttons{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:4px;transition:opacity .4s}#result.locked .res-buttons{opacity:.35;pointer-events:none}body.touch .hud-bottom .speedo{position:absolute;right:0;bottom:0}body.touch #turbo-btn{bottom:max(110px,calc(env(safe-area-inset-bottom) + 100px))}body.touch .howto .mouse-lr,body.touch #tutorial .mouse-lr{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='26' r='9' fill='%23fff'/%3E%3Cpath d='M28 34v18h8V34' fill='%23fff'/%3E%3Cpath d='M14 30H6M6 30l5-5M6 30l5 5M50 30h8M58 30l-5-5M58 30l-5 5' stroke='%233ee6d8' stroke-width='4' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E")}@media(max-width:640px){.hud-top{gap:8px;left:10px;right:10px}.pill{padding:4px 10px 4px 8px}.pill b{font-size:22px}.pill small{font-size:14px}.timer b{min-width:3.3em}.howto{gap:8px}.how{font-size:13px;padding:6px 10px 6px 6px}.ico{width:36px;height:36px}.speed b{font-size:60px}.gauge{width:130px}.icon-btn{width:44px;height:44px}#turbo-btn{width:96px;height:96px;right:14px}}@media(max-height:520px){#title{padding-top:14px;padding-bottom:12px;gap:8px}.logo{font-size:56px}.howto{display:none}.big-btn{padding:12px 30px}}body.touch .howto .mouse-click,body.touch #tutorial .mouse-click{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='34' cy='36' r='18' fill='%23ff6a10'/%3E%3Ccircle cx='34' cy='36' r='18' fill='none' stroke='%23fff' stroke-width='3'/%3E%3Cpath d='M14 12l5 5M8 24h6M24 6l1 6' stroke='%23ffb21a' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E")}