:root{color:#263e36;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--ink:#263e36;--muted:#7b8c81;background:#edf1eb;font-family:DM Sans,Segoe UI,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{overscroll-behavior:none;width:100%;height:100%;margin:0;overflow:hidden}body{touch-action:none;-webkit-user-select:none;user-select:none}button{font:inherit}button:focus-visible{outline-offset:6px;outline:3px solid #7ca793}[hidden]{display:none!important}#app{isolation:isolate;width:100%;height:100dvh;position:relative;overflow:hidden}#game-canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.screen,.hud{pointer-events:none;text-align:center;position:absolute;inset:0}.brand{top:max(27px, env(safe-area-inset-top));letter-spacing:2px;color:#698073;justify-content:center;align-items:center;gap:8px;width:100%;font-size:9px;font-weight:600;display:flex;position:absolute;left:0}.brand img{width:23px;height:23px}.intro{position:absolute;top:15%;left:20px;right:20px}.eyebrow{letter-spacing:2.8px;color:#819084;margin:0 0 13px;font-size:10px;font-weight:600}h1{letter-spacing:-4px;margin:0;font-family:Manrope,Segoe UI,sans-serif;font-size:clamp(56px,17vw,76px);font-weight:800;line-height:.98}h1>span:not(.title-dot){color:#769887}.title-dot{color:#c0a375}.description{color:#7b8c81;margin:21px 0 0;font-size:12px;line-height:1.8}.screen-bottom{bottom:max(24px, calc(env(safe-area-inset-bottom) + 13px));width:min(100% - 64px,340px);position:absolute;left:50%;transform:translate(-50%)}.primary-button{pointer-events:auto;background:var(--ink);color:#f3f5ef;letter-spacing:3px;cursor:pointer;touch-action:manipulation;border:none;border-radius:18px;justify-content:space-between;align-items:center;width:100%;min-height:64px;padding:0 26px;font-size:12px;font-weight:600;transition:transform .14s,background .14s;display:flex;box-shadow:0 8px 22px #263e3612}.primary-button:hover{background:#345449}.primary-button:active{transform:scale(.98)}.button-arrow{letter-spacing:0;font-size:26px;font-weight:400;line-height:1}.best-line{color:#8b968d;letter-spacing:1.6px;margin:20px 0 0;font-size:9px;font-weight:500;line-height:1.8}.best-line [data-best]{color:#486757;margin-left:8px;font-size:12px;font-weight:700}.best-unit{letter-spacing:1px;margin-left:3px;font-size:8px}.hud-wordmark{top:max(30px, env(safe-area-inset-top));letter-spacing:3px;color:#8d9e91;width:100%;font-size:9px;position:absolute}.scoreboard{flex-direction:column;align-items:center;width:100%;display:flex;position:absolute;top:12.5%}.score{letter-spacing:-5px;font-variant-numeric:tabular-nums;font-family:Manrope,Segoe UI,sans-serif;font-size:clamp(70px,21vw,96px);font-weight:500;line-height:1.1}.score-unit{letter-spacing:3px;color:#8a9b8d;margin:8px 0 0 3px;font-size:9px;font-weight:500}.placement-feedback{letter-spacing:4px;color:#6a9d82;opacity:0;width:100%;font-size:11px;font-weight:600;transition:opacity .18s,transform .18s;position:absolute;top:33%;transform:translateY(7px)}.placement-feedback.visible{opacity:1;transform:translateY(0)}.tap-hint{width:100%;bottom:max(52px, calc(env(safe-area-inset-bottom) + 32px));color:#8a9b8d;letter-spacing:2px;flex-direction:column;align-items:center;gap:14px;margin:0;font-size:9px;font-weight:500;transition:opacity .5s;display:flex;position:absolute}.tap-hint.quiet{opacity:0}.tap-symbol{border:1.4px solid #9cad9c;border-radius:10px;width:17px;height:24px;position:relative}.tap-symbol:after{content:"";background:#9cad9c;border-radius:2px;width:3px;height:5px;position:absolute;top:5px;left:5.6px}.result-copy{animation:.4s both appear;position:absolute;top:16%;left:20px;right:20px}.result-copy .eyebrow{color:#7f9385}.result-copy h2{letter-spacing:-5px;flex-direction:column;align-items:center;margin:6px 0 0;font-family:Manrope,Segoe UI,sans-serif;font-size:85px;font-weight:500;line-height:1.1;display:flex}.result-unit{letter-spacing:4px;color:#819586;margin-top:8px;font-family:DM Sans,Segoe UI,sans-serif;font-size:10px;font-weight:500}.record-note{color:#819084;margin:23px 0 15px;font-size:11px}.result-best{letter-spacing:2px;color:#819084;border:1px solid #d5dfd2;border-radius:30px;gap:14px;margin:0;padding:9px 17px;font-size:9px;display:inline-flex}.result-best span{color:#486757;font-weight:700}.fallback{text-align:center;max-width:440px;margin:auto;position:absolute;top:25%;left:10%;right:10%}.fallback h1{letter-spacing:-1px;font-size:38px;line-height:1.1}.fallback>p:not(.eyebrow){color:#718778;margin:24px 0;font-size:14px;line-height:1.7}.connection-notice{text-align:center;color:#486757;z-index:5;background:#edf1ebe8;place-content:center;padding:40px;font-size:14px;display:grid;position:absolute;inset:0}@keyframes appear{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (width>=700px){.intro{top:12%}h1{font-size:58px}.description{margin-top:17px}.scoreboard{top:10%}.score{font-size:76px}.placement-feedback{top:30%}.screen-bottom{bottom:22px}.primary-button{min-height:58px}.result-copy{top:12%}}@media (height<=680px){.brand{top:max(15px, env(safe-area-inset-top))}.intro{top:12%}h1{letter-spacing:-3px;font-size:49px}.description{margin-top:13px;font-size:11px}.eyebrow{margin-bottom:9px;font-size:8px}.primary-button{min-height:54px}.best-line{margin-top:12px}.result-copy{top:12%}.result-copy h2{font-size:64px}.record-note{margin-top:15px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
