:root{--sky: #b9d0d4;--sky-mid: #dcd6b4;--horizon: #e8c56a;--ink: #2b2320;--ink-rgb: 43, 35, 32;--paper: #fff6e4;--paper-rgb: 255, 246, 228;--accent: #c42820;--mailbox: #2a4e7a;--band: #8fa338;--perfect: #ffc83a;--shadow: 0 2px 8px rgba(var(--ink-rgb), .28);--font: ui-rounded, "SF Pro Rounded", system-ui, sans-serif;--pill-ring: inset 0 0 0 2px rgba(var(--ink-rgb), .7)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:var(--sky);font-family:var(--font);color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#view{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none}#grade{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse 120% 80% at 50% 46%,#5c301800 55%,#5c301852),linear-gradient(to bottom,#3c241400 72%,#3c241429)}#hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}#topbar{position:absolute;top:calc(env(safe-area-inset-top) + 10px);left:12px;right:12px;display:flex;justify-content:space-between;gap:8px;font-weight:700;font-size:15px}#hud-hole{pointer-events:auto;touch-action:none}#topbar>div,#hud-yards,#wind{background:rgba(var(--paper-rgb),.9);border-radius:999px;padding:6px 12px;box-shadow:var(--pill-ring),var(--shadow)}#hud-yards{position:absolute;top:calc(env(safe-area-inset-top) + 52px);left:50%;transform:translate(-50%);font-weight:800;font-size:17px;white-space:nowrap}#wind{position:absolute;top:calc(env(safe-area-inset-top) + 52px);right:12px;display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;padding:5px 10px}#wind-arrow{width:18px;height:18px;fill:var(--mailbox);transition:transform .3s}#meter{position:absolute;left:18px;top:34%;height:34%;width:16px;background:rgba(var(--ink-rgb),.55);border:2px solid rgba(var(--paper-rgb),.9);border-radius:10px;opacity:0;transition:opacity .2s}#meter.on{opacity:1}#meter-band{position:absolute;left:0;right:0;background:var(--band);border-radius:4px}#meter-perfect{position:absolute;left:-3px;right:-3px;background:var(--perfect);border-radius:3px}#meter-ball{position:absolute;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;background:#fff;border:2px solid var(--ink);border-radius:50%}#tap-cue{position:absolute;left:0;top:0;width:0;height:0;display:none}#tap-cue.on{display:block}#tap-cue .ring{position:absolute;left:-28px;top:-28px;width:56px;height:56px;border-radius:50%;border:4px solid var(--paper);box-shadow:0 0 0 2px rgba(var(--ink-rgb),.55);animation:cue-ring 1.1s ease-out infinite}#tap-cue .finger{position:absolute;left:-4px;top:10px;width:36px;height:42px;fill:var(--paper);stroke:var(--ink);stroke-width:1.6;filter:drop-shadow(0 2px 2px rgba(var(--ink-rgb),.35));transform-origin:35% 5%;animation:cue-press 1.1s ease-in-out infinite}#tap-cue.now .ring{border-color:var(--perfect);animation-duration:.35s}#tap-cue.now .finger{fill:var(--perfect);animation-duration:.35s}@keyframes cue-ring{0%{transform:scale(.55);opacity:1}to{transform:scale(1.35);opacity:0}}@keyframes cue-press{0%,to{transform:translate(6px,8px)}40%{transform:translate(0) scale(.92)}}#meter-band{transition:box-shadow .08s,filter .08s}#meter.go #meter-band{box-shadow:0 0 0 3px var(--paper),0 0 14px 4px var(--band);filter:brightness(1.25)}#target-marker{position:absolute;left:0;top:0;display:none;flex-direction:column;align-items:center;margin:-46px 0 0 -30px;width:60px;font-weight:800;font-size:13px}#target-marker.on{display:flex}#target-marker .pin{width:26px;height:26px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--accent);border:3px solid var(--paper);box-shadow:var(--shadow)}#target-yards{margin-top:4px;white-space:nowrap;background:rgba(var(--paper-rgb),.92);border-radius:999px;padding:1px 7px;box-shadow:var(--pill-ring),var(--shadow)}#target-marker.edge{opacity:.75}#callout{position:absolute;left:0;right:0;top:40%;text-align:center;opacity:0;font-weight:900;color:var(--paper);text-shadow:0 3px 0 var(--ink),0 0 14px rgba(var(--ink-rgb),.35)}#callout.show{opacity:1}#callout{white-space:pre-line;line-height:1.05}#callout.big{font-size:clamp(38px,11vw,64px);letter-spacing:1px}#callout.mid{font-size:clamp(30px,8.8vw,52px)}#callout.small{font-size:clamp(22px,6vw,32px)}#callout.pop{animation:pop .35s cubic-bezier(.2,1.6,.4,1)}@keyframes pop{0%{transform:scale(.4)}to{transform:scale(1)}}#readout{position:absolute;left:12px;top:calc(env(safe-area-inset-top) + 94px);background:rgba(var(--ink-rgb),.72);color:var(--paper);font-size:12px;line-height:1.45;border-radius:10px;padding:6px 9px;display:none;max-width:calc(100% - 112px)}#readout.on{display:block}#mode-btn{position:absolute;right:12px;top:calc(env(safe-area-inset-top) + 92px);pointer-events:auto;font:inherit;font-weight:800;font-size:13px;color:var(--ink);cursor:pointer;background:rgba(var(--paper-rgb),.9);border:0;border-radius:999px;padding:7px 12px;box-shadow:var(--pill-ring),var(--shadow)}#mode-btn:empty{display:none}#hint{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom) + 18px);text-align:center;font-weight:800;font-size:16px;color:var(--paper);text-shadow:0 2px 0 rgba(var(--ink-rgb),.8)}#card{position:fixed;top:0;right:0;bottom:0;left:0;display:none;align-items:center;justify-content:center;background:rgba(var(--ink-rgb),.35)}#card.on{display:flex}.card-box{background:var(--paper);border-radius:22px;padding:22px 26px;text-align:center;min-width:260px;box-shadow:0 10px 30px rgba(var(--ink-rgb),.3);animation:pop .35s cubic-bezier(.2,1.6,.4,1)}#card-title{font-size:34px;font-weight:900;color:var(--accent)}#card-result{font-size:24px;font-weight:800;margin-top:4px}#card-detail{font-size:15px;margin-top:6px;opacity:.8}#card-again{margin-top:16px;font:inherit;font-weight:800;font-size:18px;padding:11px 26px;border:0;border-radius:999px;background:var(--accent);color:var(--paper);cursor:pointer;box-shadow:var(--pill-ring)}#tally{position:fixed;top:0;right:0;bottom:0;left:0;display:none;align-items:center;justify-content:center;background:rgba(var(--ink-rgb),.55);padding:16px}#tally.on{display:flex}#tally .card-box{text-align:left;max-width:360px;width:100%;min-width:0}#tally-title{font-size:22px;font-weight:900;color:var(--accent)}#tally-lines{font-size:15px;font-weight:700;margin-top:8px;line-height:1.45}#tally-past{font-size:13px;margin-top:10px;opacity:.75;line-height:1.4}#tally-past:empty{display:none}.tally-buttons{display:flex;gap:10px;margin-top:16px}.tally-buttons button{flex:1;font:inherit;font-weight:800;font-size:15px;padding:11px 10px;border:0;border-radius:999px;background:rgba(var(--ink-rgb),.1);color:var(--ink);cursor:pointer;box-shadow:var(--pill-ring)}#tally-next{background:var(--accent);color:var(--paper)}#loading{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(var(--sky) 30%,var(--sky-mid) 70%,var(--horizon));text-align:center;padding:16px;gap:8px}#loading.gone{display:none}#loading .logo{font-size:44px;font-weight:900;color:var(--paper);text-shadow:0 3px 0 var(--accent)}#loading-text{font-size:18px;font-weight:800}#start{display:none;flex-direction:column;gap:12px;margin:10px 0 6px;width:min(280px,100%)}#loading.ready #start{display:flex}#loading.ready #loading-text{display:none}#start button{font:inherit;font-weight:900;font-size:20px;padding:14px 20px;border:0;border-radius:999px;background:var(--paper);color:var(--ink);box-shadow:var(--pill-ring),var(--shadow);cursor:pointer}#start button[data-mode=range]{background:var(--accent);color:var(--paper)}#loading .sub{font-size:13px;opacity:.75}@media (max-width: 359px){#hud-yards{left:12px;transform:none;font-size:16px}#readout{font-size:11.5px}}@media (orientation: landscape){#meter{top:30%;height:42%;left:24px}#readout{left:56px;max-width:40%}}