:root{color:#fff9e9;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#eda253;font-family:Barlow,system-ui,sans-serif}*{box-sizing:border-box}html,body{overscroll-behavior:none;width:100%;height:100%;margin:0;overflow:hidden}body{background:radial-gradient(at 48% 35%,#ffd596 0%,#f3b76c 45%,#e99a4d 100%)}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline-offset:6px;outline:3px solid #fff9e9}button[hidden]{display:none}#app{touch-action:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0}#app>canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.ui{pointer-events:none;position:absolute;inset:0}.hud{justify-content:space-between;align-items:flex-start;padding:32px 40px;display:flex;position:absolute;inset:0 0 auto}.wordmark{color:#36523d;letter-spacing:-1px;font-family:Barlow Condensed,Impact,sans-serif;font-size:30px;font-style:italic;font-weight:900;line-height:.95}.wordmark>span{color:#fff9e9;margin-left:3px}.wordmark small{letter-spacing:2px;margin-top:10px;font-family:Barlow,sans-serif;font-size:8px;font-style:normal;font-weight:800;display:block}.scoreboard{flex-direction:column;align-items:center;display:flex;position:absolute;top:28px;left:50%;transform:translate(-50%)}.eyebrow{letter-spacing:2.7px;font-size:10px;font-weight:800}.scoreboard>.eyebrow{color:#795d3b}.score{color:#fffdf5;-webkit-text-stroke:2px #36523d;paint-order:stroke fill;text-shadow:0 3px #36523d,0 5px 10px #243e2a40;font-family:Barlow Condensed,Impact,sans-serif;font-size:78px;font-style:italic;font-weight:800;line-height:1.05}.best{color:#795d3b;letter-spacing:2px;font-size:11px;font-weight:800}.overlay{place-items:center;display:grid;position:absolute;inset:0}.ui[data-state=loading] .overlay,.ui[data-state=home] .overlay,.ui[data-state=over] .overlay{pointer-events:auto;background:radial-gradient(at 48% 35%,#ffd596 0%,#f3b76c 45%,#e99a4d 100%)}.panel{pointer-events:auto;text-align:center;color:#36523d;background:#fff6dfed;border:1px solid #fff9e9;border-radius:9px;max-width:calc(100vw - 36px);padding:30px 34px;box-shadow:0 18px 70px #6c512b1f,inset 0 3px #fff9e970}.ui[data-state=loading] .overlay{background:#000}.loading-screen{flex-direction:column;align-items:center;gap:28px;width:min(280px,100% - 64px);display:flex}.loading-icon{object-fit:contain;width:180px;max-width:100%;max-height:40dvh;display:block}.loading-bar{appearance:none;color:#fff;background:#000;border:1px solid #fff;border-radius:999px;width:100%;height:10px;display:block;overflow:hidden}.loading-bar::-webkit-progress-bar{background:#000}.loading-bar::-webkit-progress-value{background:#fff;border-radius:999px}.loading-bar::-moz-progress-bar{background:#fff;border-radius:999px}.home-screen{pointer-events:auto;text-align:center;width:300px;max-width:calc(100vw - 48px);padding:26px}.home-screen h1{color:#36523d;text-shadow:0 3px #fff9e940;margin:0 0 35px;font-size:112px}.home-screen h1 em{color:#fff9e9}.tutorial-panel{width:360px;max-height:calc(100dvh - 24px);overflow-y:auto}.tutorial-image{object-fit:contain;width:100%;height:auto;max-height:180px;display:block}.tutorial-panel h2{font-size:45px}.tutorial-panel p strong{color:#36523d}.panel .eyebrow{color:#87795b;letter-spacing:2px;font-size:9px}h1,h2{letter-spacing:-1.5px;margin:15px 0 12px;font-family:Barlow Condensed,Impact,sans-serif;font-style:italic;font-weight:900;line-height:.87}h1{font-size:76px}h1 em{color:#519c48;font-style:inherit}h2{margin:19px 0;font-size:55px}.panel p{color:#7b7d64;margin:17px 0 25px;font-size:13px;font-weight:600;line-height:1.8}.primary-button{color:#fff9e9;letter-spacing:1.6px;background:#36523d;border:0;border-radius:4px;justify-content:center;align-items:center;gap:30px;width:100%;padding:17px 22px;font-size:13px;font-weight:800;transition:background .12s,transform .12s;display:flex;box-shadow:0 4px #243e2a}.primary-button:hover{background:#456c4d}.primary-button:active{transform:translateY(3px);box-shadow:0 1px #243e2a}.primary-button>span{font-size:21px;line-height:14px}.panel>small{letter-spacing:1.8px;color:#99937a;margin-top:21px;font-size:8px;font-weight:700;display:block}.compact{width:330px}.result-scores{grid-template-columns:1fr;gap:16px;margin:28px 0 30px;display:grid}.result-scores dt{color:#7b7d64;letter-spacing:1.5px;font-size:10px;font-weight:800}.result-scores dd{color:#36523d;margin:8px 0 0;font-family:Barlow Condensed,Impact,sans-serif;font-size:64px;font-style:italic;font-weight:800;line-height:1}.ui[data-state=loading] .hud,.ui[data-state=home] .hud,.ui[data-state=tutorial] .hud,.ui[data-state=over] .hud{display:none}.fallback{text-align:center;color:#36523d;place-content:center;padding:30px;display:grid;position:absolute;inset:0}.fallback p{max-width:400px;line-height:1.6}@media (width<=600px){.hud{padding:max(24px, env(safe-area-inset-top)) 22px 0}.wordmark{font-size:25px}.wordmark small{letter-spacing:1.2px;font-size:6px}.scoreboard{top:24px}.score{font-size:65px}.scoreboard .eyebrow{letter-spacing:2px;font-size:8px}.home-screen h1{font-size:100px}h1{font-size:68px}.panel{padding:27px}}@media (height<=550px){.hud{padding:18px 24px}.scoreboard{top:13px}.score{font-size:51px}.home-screen h1{margin-bottom:25px;font-size:76px}.tutorial-panel h2{font-size:36px}.tutorial-image{max-height:110px}.tutorial-panel p{line-height:1.5}.panel{padding:18px 28px}h1{margin:10px 0;font-size:48px}h2{margin:12px 0;font-size:40px}.panel p{margin:10px 0 16px;font-size:12px}.panel>small{margin-top:15px}.result-scores{margin:18px 0}.result-scores dd{font-size:50px}}.sound-toggle{color:#36523d;letter-spacing:1.6px;opacity:.75;background:0 0;border:0;margin:24px auto 0;padding:8px 12px;font-size:10px;font-weight:800;display:block}.sound-toggle:hover{opacity:1}
