:root{--panel-bg: rgba(12, 20, 16, .66);--panel-border: rgba(255, 255, 255, .14);--ink: #f2f5ef;--ink-dim: rgba(242, 245, 239, .62);--accent: #ffd166;--accent-2: #7ae08a;--danger: #ff7b6b;--radius: 14px;--hud-gap: clamp(8px, 1.2vmin, 14px)}*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:#0d1a12;color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}#c{position:fixed;inset:0;width:100vw;height:100vh;display:block;touch-action:none}#lobby{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:5vmin;background:radial-gradient(120% 90% at 50% 0%,#1e4a348c,#08100be0 62%),#08100b;overflow:auto}.lobbyCard{width:min(560px,100%);max-height:92vh;overflow:auto;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:calc(var(--radius) + 6px);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:clamp(20px,4vmin,36px);box-shadow:0 18px 60px #00000073}.lobbyCard h1{margin:0 0 6px;font-size:clamp(28px,6vmin,42px);letter-spacing:.02em}.lobbyCard h1:after{content:" ⛳"}.lobbyCard .sub{margin:0 0 18px;color:var(--ink-dim);font-size:clamp(13px,2.2vmin,15px);line-height:1.45}.lobbyCard .row{display:flex;gap:8px;margin-bottom:10px}.lobbyCard input{flex:1;min-width:0;padding:12px 14px;font-size:16px;color:var(--ink);background:#00000059;border:1px solid var(--panel-border);border-radius:10px;outline:none;text-transform:uppercase}.lobbyCard input:focus{border-color:var(--accent)}.lobbyCard input::placeholder{text-transform:none;color:var(--ink-dim)}.lobbyCard button{padding:12px 18px;font-size:15px;font-weight:600;color:#10231a;background:var(--accent);border:none;border-radius:10px;cursor:pointer;min-height:46px;transition:transform .06s ease,filter .12s ease}.lobbyCard button:hover:not(:disabled){filter:brightness(1.08)}.lobbyCard button:active:not(:disabled){transform:scale(.97)}.lobbyCard button:disabled{opacity:.45;cursor:default}#lobbyStatus{min-height:20px;margin:6px 2px 4px;font-size:14px;color:var(--accent-2)}#lobbyStatus.err{color:var(--danger)}#roomList{display:flex;flex-direction:column;gap:6px;margin:10px 0 4px}.roomBtn{text-align:left;padding:11px 14px;font-size:14px;color:var(--ink);background:#ffffff0f;border:1px solid var(--panel-border);border-radius:10px;cursor:pointer;min-height:44px}.roomBtn:hover{background:#ffffff1f}.hint{margin-top:14px;padding-top:12px;border-top:1px solid var(--panel-border);color:var(--ink-dim);font-size:clamp(11px,1.8vmin,13px);line-height:1.5}#hud{position:fixed;inset:0;z-index:10;pointer-events:none;padding:var(--hud-gap)}.panel{pointer-events:auto;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 8px 28px #00000059}#holeCard{position:absolute;top:var(--hud-gap);left:var(--hud-gap);padding:10px 14px 11px;max-width:min(46vw,340px)}#holeTitle{font-size:clamp(14px,2.6vmin,18px);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#holeSub{font-size:clamp(11px,2vmin,13px);color:var(--ink-dim);margin-top:2px}#windLine{font-size:clamp(11px,2vmin,13px);color:var(--accent);margin-top:2px}#scoreCard{position:absolute;top:var(--hud-gap);right:var(--hud-gap);padding:9px 12px;min-width:min(52vw,300px)}.scHead{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-dim);margin-bottom:5px}.scRow{display:flex;align-items:center;gap:7px;padding:4px 6px;border-radius:8px;font-size:clamp(12px,2vmin,14px)}.scRow.active{background:#ffd16624}.dot{width:10px;height:10px;border-radius:50%;flex:none;box-shadow:0 0 0 1px #0006}.scName{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scNum{color:var(--ink-dim);font-variant-numeric:tabular-nums;white-space:nowrap}#turnBanner{position:absolute;bottom:calc(var(--hud-gap) + 86px);left:50%;transform:translate(-50%);max-width:min(92vw,640px);padding:9px 18px;font-size:clamp(13px,2.4vmin,16px);font-weight:600;text-align:center;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:opacity .25s ease}#turnBanner:empty{display:none}#aimInfo{position:absolute;bottom:var(--hud-gap);left:50%;transform:translate(-50%);width:min(78vw,420px);display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 14px 12px}#powerWrap{width:100%;height:16px;border-radius:999px;background:#00000073;border:1px solid var(--panel-border);overflow:hidden}#powerFill{height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,#7ae08a,#ffd166 55%,#ff7b6b);transition:width .03s linear}#shotDist{font-size:clamp(13px,2.4vmin,16px);font-weight:700;color:var(--accent);font-variant-numeric:tabular-nums}#toasts{position:absolute;top:calc(var(--hud-gap) + 64px);left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;width:min(92vw,520px);pointer-events:none}.toast{padding:8px 16px;font-size:clamp(12px,2.2vmin,14px);font-weight:600;text-align:center;color:var(--ink);background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:1;transition:opacity .5s ease}.toast.err{border-color:#ff7b6b99;color:#ffd7d1}.toast.fade{opacity:0}#roundOver{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(92vw,460px);padding:clamp(18px,4vmin,30px);text-align:center;z-index:20}#roundOver h2{margin:0 0 14px;font-size:clamp(22px,4.5vmin,30px)}#roundOver .scRow{justify-content:center}#roundOver .scRow+.scRow{margin-top:2px}@media (max-width: 640px){#holeCard{max-width:44vw;padding:8px 10px}#scoreCard{min-width:0;width:48vw;padding:7px 9px}.scRow{padding:3px 4px;gap:5px}.scNum{font-size:11px}#turnBanner{bottom:calc(var(--hud-gap) + 96px)}#aimInfo{width:84vw}}@media (max-height: 480px){:root{--hud-gap: 6px}#holeCard,#scoreCard{padding:7px 10px}#turnBanner{bottom:calc(var(--hud-gap) + 74px)}#toasts{top:calc(var(--hud-gap) + 48px)}}
