:root{--ink: #f4f6ff;--ink-dim: rgba(228, 234, 255, .78);--pill-bg: rgba(8, 11, 20, .72);--pill-border: rgba(170, 190, 255, .18);--screen-bg: rgba(5, 7, 13, .78);--panel-bg: rgba(12, 16, 28, .95);--gold: #f5c518;--red: #c8102e;--good: #3ddc84;--bad: #ff6b5b;--radius: 14px;--gutter: 12px;--safe-t: env(safe-area-inset-top, 0px);--safe-r: env(safe-area-inset-right, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px);--font-ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;--ui-scale: 1;--text-sm: calc(14px * var(--ui-scale));--text-md: calc(16px * var(--ui-scale));--text-lg: calc(20px * var(--ui-scale));--float-top: 52%}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;background:#000;color:var(--ink);font-family:var(--font-ui);font-size:var(--text-md);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;overscroll-behavior:none;touch-action:manipulation}#stage,#stage canvas{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}button,input,.overlay{font:inherit;color:inherit;touch-action:manipulation}:focus-visible{outline:3px solid var(--gold);outline-offset:2px}#hud{position:fixed;inset:0;pointer-events:none;padding:calc(var(--safe-t) + var(--gutter)) calc(var(--safe-r) + var(--gutter)) calc(var(--safe-b) + var(--gutter)) calc(var(--safe-l) + var(--gutter));font-size:var(--text-md)}#hud button,#hud input{pointer-events:auto}.pill{background:var(--pill-bg);border:1px solid var(--pill-border);border-radius:var(--radius);padding:8px 12px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.hint{color:var(--ink-dim);font-size:var(--text-sm);text-align:center;text-shadow:0 1px 3px rgba(0,0,0,.8)}.btn{min-height:48px;min-width:44px;padding:12px 28px;border-radius:999px;border:0;font-weight:700;font-size:var(--text-lg);letter-spacing:.02em;cursor:pointer;background:#ffffff29}.btn{white-space:nowrap}.btn.primary{background:var(--gold);color:#1a1400}.btn.primary:active{transform:translateY(1px)}.hud-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.score{font-family:var(--font-display);font-size:calc(var(--text-md) * 1.2);font-weight:700;letter-spacing:.02em;font-variant-numeric:tabular-nums}.top-left{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}.shot-clock{display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:700}.shot-clock[hidden]{display:none}.shot-clock-label{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-dim)}.shot-clock-value{font-size:calc(var(--text-md) * 1.3);min-width:1.4em;text-align:right;font-variant-numeric:tabular-nums}.shot-clock-track{width:56px;height:6px;border-radius:3px;background:#ffffff2e;overflow:hidden}.shot-clock-bar{display:block;height:100%;background:var(--gold);transform-origin:left}.shot-clock.urgent{border-color:var(--bad)}.shot-clock.urgent .shot-clock-value{color:var(--bad)}.shot-clock.urgent .shot-clock-bar{background:var(--bad)}.shot-clock.urgent .shot-clock-label:after{content:" — hurry"}#hud:has(#shot-clock:not([hidden])) .wind{top:calc(var(--safe-t) + var(--gutter) + 104px)}@media(orientation:landscape){#hud:has(#shot-clock:not([hidden])) .wind{top:calc(var(--safe-t) + var(--gutter));left:auto;right:calc(var(--safe-r) + var(--gutter) + 60px);margin:0}}.icon-btn{width:48px;height:48px;border-radius:50%;border:1px solid var(--pill-border);background:var(--pill-bg);display:grid;place-items:center;cursor:pointer;pointer-events:auto}.icon-btn svg{width:22px;height:22px;fill:currentColor}.score .sep{opacity:.5;margin:0 4px}.wind{position:absolute;top:calc(var(--safe-t) + var(--gutter) + 52px);left:calc(var(--safe-l) + var(--gutter));right:calc(var(--safe-r) + var(--gutter));margin-inline:auto;width:fit-content;display:flex;align-items:center;gap:10px;max-width:calc(100% - 2 * var(--gutter))}.wind-dial{width:40px;height:40px;flex:none}.wind-dial-bg{fill:#ffffff1a;stroke:#ffffff59;stroke-width:1.5}#wind-arrow path{fill:var(--gold);stroke:#000;stroke-width:.8}.wind-text{min-width:0}#wind-label{font-weight:700;font-size:var(--text-md);line-height:1.2}.wind-strength{display:flex;align-items:center;gap:8px;font-size:var(--text-sm);color:var(--ink-dim)}.wind-bars{display:inline-flex;align-items:flex-end;gap:2px;height:14px}.wind-bars i{width:5px;border-radius:1px;border:1px solid rgba(255,255,255,.6)}.wind-bars i:nth-child(1){height:5px}.wind-bars i:nth-child(2){height:7px}.wind-bars i:nth-child(3){height:9px}.wind-bars i:nth-child(4){height:11px}.wind-bars i:nth-child(5){height:14px}.wind-bars i.on{background:var(--ink);border-color:var(--ink)}.caption{position:absolute;left:calc(var(--safe-l) + var(--gutter));right:calc(var(--safe-r) + var(--gutter));margin-inline:auto;bottom:calc(var(--safe-b) + 18%);text-align:center;width:fit-content;display:none}.caption-text{font-family:var(--font-display);font-size:calc(var(--text-lg) * 1.3);font-weight:700;letter-spacing:.01em;background:var(--pill-bg);border:1px solid var(--pill-border);border-radius:var(--radius);padding:8px 16px;margin-bottom:6px}.panel-bottom{position:absolute;left:50%;bottom:calc(var(--safe-b) + var(--gutter));transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;width:min(92%,520px)}.info{font-weight:700;font-variant-numeric:tabular-nums;text-align:center}.elevation{position:absolute;right:calc(var(--safe-r) + var(--gutter));top:42%;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:auto;background:var(--pill-bg);border:1px solid var(--pill-border);border-radius:999px;padding:10px 4px}#hud[data-hand=left] .elevation{right:auto;left:calc(var(--safe-l) + var(--gutter))}.elev-label{font-size:12px;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.06em}#elev-slider{writing-mode:vertical-lr;direction:rtl;width:44px;height:min(28vh,200px);accent-color:var(--gold);cursor:pointer}#elev-value{font-weight:700;font-variant-numeric:tabular-nums}.meter{display:none;align-items:center;gap:10px;width:min(100%,320px)}.meter-track{flex:1;height:16px;border-radius:8px;background:#0009;border:2px solid rgba(255,255,255,.5);overflow:hidden}.meter-fill{height:100%;width:0%;background:var(--gold)}.meter-value{font-weight:700;width:3.5em;text-align:right;font-variant-numeric:tabular-nums}#hud.meter-on .meter{display:flex}.drag-layer{position:fixed;inset:0;width:100%;height:100%;overflow:visible;display:none}#hud.dragging .drag-layer{display:block}#drag-line{stroke:var(--gold);stroke-width:4;stroke-linecap:round;stroke-dasharray:2 8}#drag-origin{fill:none;stroke:#fff;stroke-width:3}#drag-power{fill:#fff;font-weight:800;font-size:18px;paint-order:stroke;stroke:#000;stroke-width:4px}.result{position:absolute;top:calc(var(--safe-t) + 22%);left:calc(var(--safe-l) + var(--gutter));right:calc(var(--safe-r) + var(--gutter));margin-inline:auto;width:fit-content;text-align:center;background:var(--pill-bg);border:1px solid var(--pill-border);border-radius:20px;padding:16px 24px;min-width:min(100%,300px);display:none}.result-title{font-family:var(--font-display);font-size:clamp(36px,9vw,60px);font-weight:800;line-height:1;letter-spacing:.01em}.result[data-tone=good] .result-title{color:var(--good)}.result[data-tone=bad] .result-title{color:var(--bad)}.result[data-tone=good] .result-title:before{content:"✓ "}.result[data-tone=bad] .result-title:before{content:"✕ "}.result-points{font-family:var(--font-display);font-size:calc(var(--text-lg) * 1.4);font-weight:800;color:var(--gold)}.result-why{margin:6px 0 8px;font-size:var(--text-md)}#tee-panel,#aim-panel,#wind{display:none}#hud[data-phase=establish] .caption{display:block}#hud[data-phase=establish] #wind,#hud[data-phase=tee] #wind,#hud[data-phase=aim] #wind,#hud[data-phase=tee] #tee-panel{display:flex}#hud[data-phase=aim] #aim-panel,#hud[data-phase=result] .result{display:block}.result[data-outcome=wide_left] .result-points:before{content:"← wide left"}.result[data-outcome=wide_right] .result-points:before{content:"wide right →"}.result[data-outcome=short] .result-points:before{content:"↓ short"}.result[data-outcome=under_bar] .result-points:before{content:"⤓ under"}.result[data-outcome=post_out] .result-points:before,.result[data-outcome=bar_out] .result-points:before{content:"✱ woodwork"}.result[data-tone=bad] .result-points{color:var(--ink-dim);font-size:var(--text-md);letter-spacing:.08em;text-transform:uppercase}.float-points{position:absolute;left:50%;top:50%;transform:translate(-50%);font-family:var(--font-display);font-weight:800;font-size:clamp(56px,16vw,110px);z-index:2;color:var(--gold);text-shadow:0 4px 0 var(--red),0 8px 30px rgba(0,0,0,.6);opacity:0;pointer-events:none}.float-points.show{animation:float-up 1.3s cubic-bezier(.5,0,.3,1) forwards}@keyframes float-up{0%{opacity:0;left:50%;top:calc(var(--float-top) + 2%);transform:translate(-50%) scale(.7)}18%{opacity:1;left:50%;top:var(--float-top);transform:translate(-50%) scale(1.05)}40%{opacity:1;left:50%;top:var(--float-top);transform:translate(-50%) scale(1)}to{opacity:0;left:calc(var(--safe-l) + var(--gutter) + 40px);top:calc(var(--safe-t) + var(--gutter));transform:translate(-50%) scale(.3)}}.doink{position:absolute;left:50%;top:30%;transform:translate(-50%) rotate(-6deg);font-family:var(--font-display);font-weight:800;font-size:clamp(34px,9vw,60px);color:#fff;background:var(--red);padding:0 14px 2px;border-radius:10px;opacity:0;pointer-events:none}.doink.show{animation:doink-pop .9s ease-out forwards}@keyframes doink-pop{0%{opacity:0;transform:translate(-50%) rotate(-6deg) scale(.6)}20%{opacity:1;transform:translate(-50%) rotate(-6deg) scale(1.1)}80%{opacity:1;transform:translate(-50%) rotate(-6deg) scale(1)}to{opacity:0}}body.reduce-motion .float-points.show,body.reduce-motion .doink.show{animation-name:fade-in-out}@keyframes fade-in-out{0%,to{opacity:0}20%,75%{opacity:1}}body.reduce-motion *{transition:none!important}body.high-contrast{--pill-bg: #000;--pill-border: #fff;--ink-dim: #fff;--screen-bg: rgba(0, 0, 0, .92);--panel-bg: #000}body.high-contrast .pill,body.high-contrast .result,body.high-contrast .elevation,body.high-contrast .btn:not(.primary){border:2px solid #fff;backdrop-filter:none}body.high-contrast .hint{background:#000;padding:2px 8px;border-radius:6px;text-shadow:none}body.high-contrast .btn:not(.primary){background:#000}body.high-contrast .best{background:#000;padding:2px 10px;border-radius:6px;text-shadow:none}body.high-contrast .wind-bars i{border-color:#fff}#hud[data-phase=flight] .score{opacity:0}#hud[data-phase=idle] .hud-top,#hud[data-phase=over] .hud-top{display:none}#btn-next{min-height:44px;font-size:var(--text-md);padding:8px 22px}@media(orientation:landscape){#aim-panel .panel-bottom{left:calc(var(--safe-l) + var(--gutter));transform:none;width:auto;max-width:34%;align-items:flex-start}#aim-panel .hint{text-align:left}}@media(orientation:landscape)and (max-height:500px){.wind{top:calc(var(--safe-t) + var(--gutter));padding:4px 10px}.wind-dial{width:32px;height:32px}.elevation{top:22%}#elev-slider{height:38vh}.result{top:calc(var(--safe-t) + 16%);padding:10px 20px}.caption{bottom:calc(var(--safe-b) + 24%)}:root{--float-top: 68%}}.coach{position:absolute;left:calc(var(--safe-l) + var(--gutter));right:calc(var(--safe-r) + var(--gutter));top:calc(var(--safe-t) + 132px);margin-inline:auto;width:fit-content;max-width:min(440px,calc(100% - 2 * var(--gutter)));background:var(--gold);color:#1a1400;border-radius:16px;padding:12px 16px 8px;font-weight:600;line-height:1.35;box-shadow:0 6px 24px #00000059}.coach[hidden]{display:none}.coach p{margin-bottom:4px}.link-btn{background:none;border:0;text-decoration:underline;font-size:var(--text-sm);min-height:44px;padding:0 4px;cursor:pointer;pointer-events:auto;color:inherit}@media(orientation:landscape)and (max-height:500px){.coach{top:calc(var(--safe-t) + 64px);max-width:46%;left:auto;right:calc(var(--safe-r) + var(--gutter) + 64px);margin:0}}.screen{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:calc(var(--safe-t) + 16px) calc(var(--safe-r) + 16px) calc(var(--safe-b) + 16px) calc(var(--safe-l) + 16px);background:var(--screen-bg);overflow-y:auto}.screen[hidden]{display:none}.menu-card,.title-card{width:min(100%,420px);display:flex;flex-direction:column;gap:12px;align-items:stretch;text-align:center;margin:auto}.menu-card h2{font-family:var(--font-display);font-size:clamp(36px,9vw,56px);font-weight:800;letter-spacing:.02em;margin-bottom:4px}.btn.big{min-height:60px;font-size:calc(var(--text-lg) * 1.2)}.btn.small{min-height:44px;font-size:var(--text-md);padding:8px 18px;align-self:flex-start}.row{display:flex;gap:10px}.row .btn{flex:1;padding-inline:12px;font-size:min(var(--text-lg),5.6vw)}body.menu-open #hud{visibility:hidden}.btn.mode{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:min(var(--text-md),4.8vw);padding:8px 6px;white-space:normal;line-height:1.1}.btn.mode small{font-size:min(calc(12px * var(--ui-scale)),3.6vw);font-weight:500;color:var(--ink-dim)}.segmented,.dir-grid{border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:10px}.segmented{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.segmented legend,.dir-grid legend{grid-column:1 / -1}.segmented{grid-template-columns:repeat(auto-fit,minmax(72px,1fr))}.sub-legend{font-family:var(--font-ui);font-size:var(--text-md);color:var(--ink);text-transform:none;letter-spacing:0;font-weight:500}.segmented label,.dir-grid label{position:relative;min-height:44px;display:grid;place-items:center;border-radius:10px;border:1px solid var(--pill-border);background:#ffffff14;cursor:pointer;font-weight:700}.segmented input,.dir-grid input{position:absolute;opacity:0;inset:0;cursor:pointer}.segmented label:has(input:checked),.dir-grid label:has(input:checked){background:var(--gold);color:#1a1400;border-color:var(--gold)}.segmented label:has(input:focus-visible),.dir-grid label:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:2px}.dir-grid{display:grid;grid-template-columns:repeat(3,56px);justify-content:start;gap:6px}.dir-grid span{font-size:24px}.dir-caption{grid-column:1 / -1;color:var(--ink-dim);font-size:var(--text-sm);min-height:1.2em}.practice-card .btn:last-child{align-self:flex-start}.title-screen{background:linear-gradient(to bottom,#05070d00,#05070d1a 35%,#05070de0);align-items:flex-end}.kicker{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.3em;font-weight:700;color:var(--gold)}.logo{font-family:var(--font-display);font-size:clamp(64px,20vw,120px);font-weight:800;line-height:.9;text-transform:uppercase;letter-spacing:.01em;text-shadow:0 4px 0 var(--red),0 8px 24px rgba(0,0,0,.5)}.fixture{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;margin-bottom:10px}.fixture span{color:var(--gold);margin:0 6px}.best{color:var(--ink-dim);min-height:1.2em}.settings-card{width:min(100%,560px);text-align:left;background:var(--panel-bg);border:1px solid var(--pill-border);border-radius:20px;padding:16px;max-height:calc(100dvh - 32px - var(--safe-t) - var(--safe-b))}.settings-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.settings-head h2{margin:0}.settings-body{overflow-y:auto;display:flex;flex-direction:column;gap:16px;padding-right:4px}fieldset{border:0;display:flex;flex-direction:column;gap:4px}legend{font-family:var(--font-display);font-weight:700;font-size:var(--text-lg);color:var(--gold);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}.setting{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.08)}.setting small{display:block;color:var(--ink-dim);font-size:var(--text-sm)}.setting input[type=checkbox]{appearance:none;flex:none;margin-left:calc(2.6em * var(--ui-scale));width:52px;height:30px;border-radius:15px;background:#fff3;position:relative;cursor:pointer}.setting input[type=checkbox]:after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .15s}.setting input[type=checkbox]:checked{background:var(--gold)}.setting input[type=checkbox]:checked:after{transform:translate(22px)}.setting input[type=checkbox]:before{content:"Off";position:absolute;right:calc(100% + 8px);top:5px;font-size:var(--text-sm);color:var(--ink-dim)}.setting input[type=checkbox]:checked:before{content:"On"}.setting.range input{flex:1;max-width:180px;accent-color:var(--gold);min-height:44px}.setting output{width:3em;text-align:right;font-variant-numeric:tabular-nums}.keymap{display:grid;grid-template-columns:1fr auto;gap:6px 12px;align-items:center;margin-bottom:8px}.key-btn{min-width:96px;min-height:44px;border-radius:10px;border:1px solid var(--pill-border);background:#ffffff1a;font-weight:700;cursor:pointer}.key-btn[data-capturing]{background:var(--gold);color:#1a1400}.summary-card{width:min(100%,460px)}.summary-points{font-family:var(--font-display);font-size:clamp(56px,16vw,88px);font-weight:800;line-height:1;color:var(--gold)}.summary-points span{font-variant-numeric:tabular-nums}.summary-line{font-size:var(--text-lg);font-weight:600}.summary-best{color:var(--ink-dim)}.summary-best.new{color:var(--good);font-weight:800}.summary-best.new:before{content:"★ "}.kick-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;text-align:left;margin:4px 0 8px}.kick-table th,.kick-table td{padding:5px 8px;border-bottom:1px solid rgba(255,255,255,.1)}.kick-table th{color:var(--ink-dim);font-weight:600;font-size:var(--text-sm)}.kick-table td:last-child,.kick-table th:last-child{text-align:right}.kick-table .good{color:var(--good)}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(orientation:landscape)and (max-height:500px){.title-screen{align-items:center;justify-content:flex-start}.title-card{margin:0;width:min(46%,380px);gap:8px}.logo{font-size:72px}.menu-card{gap:8px}.menu-card h2{font-size:36px;margin:0}.menu-card .btn{min-height:44px;padding-block:8px;font-size:var(--text-md)}#screen-pause .menu-card{width:min(100%,560px);display:grid;grid-template-columns:1fr 1fr}#screen-pause h2,#btn-resume{grid-column:1 / -1}.summary-points{font-size:56px}.summary-card{width:min(100%,720px);display:grid;grid-template-columns:1fr 1.3fr;column-gap:20px;align-items:start}.summary-card>:not(.kick-table){grid-column:1}.summary-card .kick-table{grid-column:2;grid-row:1 / span 6}}@media(min-width:1100px)and (min-height:700px){:root{--text-sm: calc(16px * var(--ui-scale));--text-md: calc(19px * var(--ui-scale));--text-lg: calc(24px * var(--ui-scale));--gutter: 20px}.wind{top:calc(var(--safe-t) + var(--gutter))}.wind-dial{width:52px;height:52px}.title-card{width:480px}}@font-face{font-family:Barlow Condensed;font-style:normal;font-display:swap;font-weight:700;src:url(/rugbygoalkick/assets/barlow-condensed-latin-700-normal-v1xN8_Wq.woff2) format("woff2"),url(/rugbygoalkick/assets/barlow-condensed-latin-700-normal-Dmwat-ge.woff) format("woff")}@font-face{font-family:Barlow Condensed;font-style:normal;font-display:swap;font-weight:800;src:url(/rugbygoalkick/assets/barlow-condensed-latin-800-normal-BKzMuPgK.woff2) format("woff2"),url(/rugbygoalkick/assets/barlow-condensed-latin-800-normal-e9GbPXiK.woff) format("woff")}
