*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:ui-sans-serif,system-ui,-apple-system,"PingFang SC",sans-serif;color:#173d3a;background:#b4d8ce}button{font:inherit;color:inherit;cursor:pointer}#app,#scene{position:absolute;inset:0}#scene canvas{display:block;width:100%;height:100%;touch-action:none}.grain{pointer-events:none;position:absolute;inset:0;background:linear-gradient(180deg,rgba(240,250,232,.25),transparent 32%,transparent 65%,rgba(23,61,58,.08))}header{position:absolute;top:max(24px,env(safe-area-inset-top));left:6%;right:6%;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:10px}.brand strong{display:block;font-size:17px;letter-spacing:.08em}.brand small{display:block;font-size:8px;font-weight:700;letter-spacing:.18em;margin-top:2px}.mark{display:grid;place-items:center;border:1px solid currentColor;width:37px;height:37px;border-radius:50%;font-size:23px}.icon-btn,.round{border:1px solid rgba(24,61,58,.24);background:rgba(251,250,226,.66);border-radius:50%;display:grid;place-items:center}.icon-btn{width:38px;height:38px;font-weight:700}.location{position:absolute;top:91px;left:6%;font-size:9px;font-weight:800;letter-spacing:.18em}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#ee805a;margin-right:6px}.slash{opacity:.4;padding:0 5px}.caption{position:absolute;top:16%;left:7%;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:.19em;font-weight:800}.caption h1{font-family:Georgia,"Songti SC",serif;font-weight:500;line-height:1.14;font-size:clamp(34px,5vw,64px);letter-spacing:.02em;margin:12px 0}.caption h1 em{font-style:normal;color:#d86446}.caption p{font-size:12px;letter-spacing:.08em}.hint{position:absolute;right:7%;bottom:28%;font-size:10px;letter-spacing:.08em;opacity:.75;pointer-events:none}.hint span{font-size:18px}.dashboard{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(440px,calc(100% - 32px));padding:18px 20px 13px;border:1px solid rgba(255,255,255,.65);border-radius:20px;background:rgba(250,249,225,.88);box-shadow:0 12px 40px rgba(31,65,58,.14);backdrop-filter:blur(14px)}.dashboard-top{display:flex;justify-content:space-between;align-items:end}.label{font-size:10px;letter-spacing:.1em;color:#65807a}.distance{font-family:Georgia,serif;font-size:31px;line-height:1.1}.distance small,.speed-display small{font-family:system-ui;font-size:10px}.speed-display{text-align:right}.speed-display div{font-family:Georgia,serif;font-size:21px}.line{height:1px;background:#cbd7c7;margin:12px 0}.controls{display:flex;align-items:center;gap:9px}.round{width:43px;height:43px;flex:none;font-size:20px;background:transparent}.round:hover,.icon-btn:hover{background:#e1ebd9}.round:active,.play:active{transform:scale(.94)}.play{border:0;border-radius:24px;background:#214b43;color:#fffce9;height:43px;flex:1;display:flex;justify-content:center;align-items:center;gap:9px;font-size:12px;font-weight:700}.play:hover{background:#35685b}.divider{width:1px;height:25px;background:#cbd7c7;margin:0 2px}.keyboard{text-align:center;margin-top:11px;color:#718880;font-size:9px;letter-spacing:.02em}.help-panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(340px,calc(100% - 40px));padding:30px;background:#fbf9e9;border-radius:20px;box-shadow:0 20px 80px #193c3c66}.help-panel[hidden]{display:none}.help-panel h2{font-family:Georgia,"Songti SC",serif;font-weight:500;font-size:28px}.help-panel p{font-size:13px;line-height:1.8;color:#55716b}.help-panel #close-help{position:absolute;right:20px;top:15px;border:0;background:none;font-size:24px}.help-panel #got-it{border:0;background:#214b43;color:white;border-radius:30px;padding:12px 22px;margin-top:10px}#toast{position:absolute;left:50%;top:13%;transform:translateX(-50%);border-radius:30px;padding:8px 15px;background:#214b43;color:white;font-size:12px;opacity:0;transition:opacity .2s;pointer-events:none}#toast.show{opacity:1}@media(max-width:430px){.caption{top:15%}.caption h1{font-size:36px}.hint{bottom:29%}.dashboard{padding:15px 16px 11px}.keyboard{font-size:8px}.controls{gap:7px}.round{width:40px;height:40px}.play{height:40px}}@media(max-height:650px){.caption{top:17%}.caption h1{font-size:29px;margin:7px 0}.caption p{display:none}.location{top:75px}.dashboard{padding-top:10px}.distance{font-size:25px}.line{margin:7px 0}.hint{display:none}}@media(prefers-reduced-motion:reduce){#toast{transition:none}}