:root{--grass-1: #7ec850;--grass-2: #5fa83b;--grass-3: #447028;--water-1: #4ba3df;--water-2: #2f78ad;--sand-1: #f0d495;--sand-2: #c9a567;--wall: #f6efe2;--wall-edge: #c9bfa9;--ball: #ffffff;--hole: #1a1a1a;--p1: #e8483a;--p2: #2e8aff;color-scheme:light}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden;font-family:Fredoka,-apple-system,system-ui,sans-serif;font-weight:600;background:#1f3320;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none}#root{position:relative;width:100vw;height:100vh;height:100dvh}#game{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;cursor:crosshair}#ui{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0a180cc7;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:center;pointer-events:auto;animation:fadeIn .22s ease-out}.card{background:linear-gradient(180deg,#fff,#f5f6f0);color:#1a1a1a;border-radius:28px;padding:32px 38px;min-width:320px;max-width:min(440px,92vw);text-align:center;box-shadow:0 24px 60px #0006,0 1px #ffffffb3 inset;animation:pop .28s cubic-bezier(.2,.9,.3,1.2)}.card h1{font-size:32px;font-weight:700;margin-bottom:6px;color:#1a1a1a;letter-spacing:.5px}.card h2{font-size:20px;font-weight:600;margin:8px 0 16px;color:#444}.card p{font-size:15px;font-weight:500;color:#555;line-height:1.5;margin:8px 0}.card .hole-num{font-size:13px;text-transform:uppercase;letter-spacing:2px;color:#888;margin-bottom:4px}.btn{display:inline-flex;align-items:center;justify-content:center;font-family:inherit;font-weight:700;font-size:17px;background:linear-gradient(180deg,#6dc242,#4f9c2c);color:#fff;border:none;border-radius:16px;padding:14px 28px;cursor:pointer;margin-top:18px;box-shadow:0 4px #3a7720,0 8px 18px #0000002e;transition:transform 80ms ease,box-shadow 80ms ease;letter-spacing:.5px}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(2px);box-shadow:0 2px #3a7720,0 4px 10px #0000002e}.btn.secondary{background:linear-gradient(180deg,#f5f5f5,#d8d8d8);color:#333;box-shadow:0 4px #b5b5b5,0 8px 18px #0000001f}.btn.secondary:active{box-shadow:0 2px #b5b5b5,0 4px 10px #0000001f}.scoretable{width:100%;margin:14px 0 6px;border-collapse:collapse;font-variant-numeric:tabular-nums}.scoretable th,.scoretable td{padding:10px 6px;font-size:16px;border-bottom:1px solid #e8e8e8}.scoretable th{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#888;font-weight:600}.scoretable .player{text-align:left;font-weight:700}.scoretable .player.p1{color:var(--p1)}.scoretable .player.p2{color:var(--p2)}.scoretable .total{font-weight:700}.scoretable .winner{background:#ffd7002e}.hud{position:absolute;pointer-events:none}.hud-top{top:env(safe-area-inset-top,0);left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:14px 18px;gap:12px}.hud-pill{background:#142816d9;color:#fff;border-radius:999px;padding:8px 14px;font-size:14px;font-weight:600;letter-spacing:.4px;box-shadow:0 2px 12px #00000040;display:inline-flex;align-items:center;gap:8px}.hud-pill .dot{width:10px;height:10px;border-radius:50%}.hud-pill.p1 .dot{background:var(--p1)}.hud-pill.p2 .dot{background:var(--p2)}.hud-center{flex:1;text-align:center;font-size:13px;color:#fffc;text-transform:uppercase;letter-spacing:2px}.hud-bottom{bottom:env(safe-area-inset-bottom,0);left:0;right:0;text-align:center;padding:14px;font-size:13px;color:#ffffffa6;text-shadow:0 2px 6px rgba(0,0,0,.4);letter-spacing:.6px}.toast{position:absolute;top:72px;left:50%;transform:translate(-50%);background:#fffffff5;color:#1a1a1a;border-radius:14px;padding:12px 22px;font-size:16px;font-weight:700;box-shadow:0 8px 24px #0000004d;pointer-events:none;animation:toastIn .18s ease-out,toastOut .22s ease-in 1.4s forwards}.toast.big{font-size:22px;padding:16px 32px;border-radius:18px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pop{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}@keyframes toastIn{0%{transform:translate(-50%,-10px);opacity:0}to{transform:translate(-50%);opacity:1}}@keyframes toastOut{to{transform:translate(-50%,-10px);opacity:0}}