/* Gameplay UI: keep the middle of the screen clear. */
.mouse-capture{position:fixed;z-index:12;left:50%;bottom:110px;transform:translateX(-50%);max-width:90vw;padding:10px 18px;border:1px solid var(--coral);border-radius:9px;background:#06272df2;color:#fff4da;font:700 15px/1.3 var(--display);cursor:pointer}
.mouse-capture[hidden]{display:none}
.hud-symbols{position:absolute;width:0;height:0;overflow:hidden}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
#game-hud{--edge:clamp(16px,2.2vw,32px);transition:opacity .2s;pointer-events:none}
body[data-screen=intro] #game-hud,body[data-screen=result] #game-hud{opacity:0;pointer-events:none}
body[data-screen=menu] #game-hud{opacity:.2;pointer-events:none}
.hud-icon{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.hud-shell{background:linear-gradient(145deg,#103536ed,#041c24f2);border:1px solid #9cddc58c;border-radius:15px;box-shadow:inset 0 1px 0 #ffffff12,0 3px 0 #021419a6,0 6px 18px #0003}
.hud-score{position:fixed;left:var(--edge);top:var(--edge);display:flex;align-items:center;padding:10px 16px;gap:17px}
.hud-stat{display:flex;align-items:center;gap:9px}
.hud-stat+.hud-stat{border-left:1px solid #9cddc560;padding-left:17px}
.hud-stat b{font:32px/1 var(--display);font-variant-numeric:tabular-nums}
.hud-timer{position:fixed;left:50%;top:var(--edge);transform:translateX(-50%);display:flex;align-items:center;gap:9px;padding:10px 15px;border-color:var(--coral)}
.hud-timer>.hud-icon{color:var(--coral)}
#run-clock{font:34px/1 var(--display);font-variant-numeric:tabular-nums;letter-spacing:.6px}
.hud-timer.urgent{box-shadow:0 0 18px #ff4f703b;border-color:#ff9aae}
.hud-timer.urgent #run-clock{color:#ff91a6;animation:urgent 1s ease-in-out infinite}
.practice-label{display:none}.practice .practice-label{display:block;position:absolute;top:calc(100% + 6px);left:0;right:0;text-align:center;color:var(--mint);font:700 9px Arial;letter-spacing:2px;text-shadow:0 2px 4px #000}
.hud-pause{position:fixed;right:var(--edge);top:var(--edge);width:53px;height:53px;display:grid;place-items:center;padding:0;border-color:var(--coral);pointer-events:auto}
.hud-pause:hover{background:#19474b}
#interact{position:fixed;left:50%;bottom:66px;transform:translateX(-50%);display:flex;gap:9px;align-items:center;padding:7px 12px 7px 7px;background:#05262de3;border:1px solid #9cddc573;border-radius:10px;box-shadow:0 3px 12px #0003;max-width:80vw}
#interact kbd{background:var(--cream);color:var(--ink);padding:5px 8px;font-size:14px;border:0;box-shadow:0 2px #a49980}
#interact span{font-size:12px;font-weight:700;letter-spacing:.3px}
#putting{--power:40%;position:fixed;left:50%;right:auto;bottom:18px;transform:translateX(-50%);width:min(360px,calc(100vw - 190px));padding:0;background:none;border:0;box-shadow:none;border-radius:0;max-height:none;overflow:visible;pointer-events:auto}
.power-capsule{display:flex;align-items:center;gap:11px;padding:10px 14px;border-radius:24px}
.power-capsule>.hud-icon{width:28px;height:28px}
.power-track{position:relative;flex:1;height:20px;border:2px solid #54777580;border-radius:12px;background:#031a22;box-shadow:inset 0 2px 4px #0008}
.power-fill{position:absolute;inset:2px auto 2px 2px;width:clamp(0px,var(--power),calc(100% - 4px));border-radius:9px;background:linear-gradient(90deg,#8ed9c4,#c0e4c4 55%,#fff0ce);box-shadow:0 0 8px #9cddc52b;pointer-events:none}
#power{position:absolute;inset:-6px -2px;width:calc(100% + 4px);height:28px;margin:0;appearance:none;background:transparent;border:0;border-radius:10px;cursor:ew-resize}
#power::-webkit-slider-thumb{appearance:none;width:3px;height:25px;border:0;border-radius:1px;background:var(--cream);box-shadow:0 0 5px #fff0ce55}
#power::-moz-range-thumb{width:3px;height:25px;border:0;border-radius:1px;background:var(--cream)}
.putt-tools{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:7px;height:34px}
.putt-tools>span,.putt-tools>button{display:flex;align-items:center;justify-content:center;gap:6px;color:var(--cream);filter:drop-shadow(0 2px 3px #00151d)}
.putt-tools button{border:0;border-left:1px solid #9cddc538;border-radius:0;padding:3px 0 3px 13px;background:none;min-height:32px}
.putt-tools .hud-icon{width:23px;height:27px;stroke-width:1.8}
.putt-tools kbd{border:0;background:none;padding:0;font-size:8px;letter-spacing:.5px;color:#fff0ceac}
.putt-tools button:hover{color:var(--mint)}
#toast{position:fixed;top:auto;bottom:133px;left:50%;width:min(520px,70vw);transform:translate(-50%,5px);text-align:center;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
#toast.visible{opacity:1;transform:translate(-50%,0)}
#toast p{display:inline;padding:5px 10px;border:0;border-radius:5px;background:#041e2680;box-shadow:none;color:#fff0cee0;font:italic 13px/1.7 Georgia,serif;text-shadow:0 1px 4px #000}
.is-putting #world{cursor:crosshair}
@media(max-width:700px){.hud-score{gap:10px;padding:10px}.hud-stat{gap:5px}.hud-stat+.hud-stat{padding-left:10px}.hud-stat b{font-size:24px}.hud-score .hud-icon{width:24px;height:24px}.hud-timer{padding:9px 10px;gap:5px}#run-clock{font-size:28px}.hud-timer .hud-icon{width:25px;height:25px}.hud-pause{width:46px;height:46px}#putting{width:min(340px,calc(100vw - 145px))}#toast{width:80vw}}
@media(max-width:440px){.hud-score{gap:6px}.hud-stat+.hud-stat{padding-left:6px}.hud-stat b{font-size:20px}.hud-score .hud-icon{width:19px}.hud-timer{left:50%}#run-clock{font-size:24px}.hud-pause{width:38px;height:44px}.power-capsule{padding:8px;gap:5px}.putt-tools{gap:6px}}

@media(max-width:850px){.hud-timer{top:85px;left:50%}}

.hud-hole-value{display:flex;flex-direction:column;align-items:center;gap:4px}.hud-hole-value small{font:700 10px/1 Arial,sans-serif;letter-spacing:.07em;color:var(--cream);white-space:nowrap}

.hud-hole{position:fixed;left:var(--edge);bottom:var(--edge);display:flex;align-items:center;padding:12px 16px;pointer-events:none}
.hud-mute{position:fixed;right:calc(var(--edge) + 63px);top:var(--edge);width:53px;height:53px;display:grid;place-items:center;padding:0;border-color:var(--coral);pointer-events:auto}
.hud-mute:hover{background:#19474b}.hud-mute .audio-off{display:none}.hud-mute[aria-pressed=true] .audio-on{display:none}.hud-mute[aria-pressed=true] .audio-off{display:block;color:var(--coral)}
@media(max-width:700px){.hud-mute{width:46px;height:46px;right:calc(var(--edge) + 56px)}.hud-hole{padding:10px 12px}.hud-hole .hud-icon{width:24px;height:24px}}
@media(max-width:440px){.hud-mute{width:38px;height:44px;right:calc(var(--edge) + 46px)}.hud-mute .hud-icon{width:24px;height:24px}}
@media(max-width:700px){#putting{left:auto;right:var(--edge);transform:none;width:min(340px,calc(100vw - 150px))}}
