*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden}body{background:#0f0f23;font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,sans-serif;color:#fff;touch-action:none;user-select:none}#app{width:100%;height:100%;position:relative}canvas{display:block;width:100vw;height:100vh}.hud{position:fixed;top:0;left:0;right:0;padding:20px 28px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;z-index:10}.hud-left,.hud-right{display:flex;gap:12px;align-items:center}.hud-pill{background:#0000008c;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);padding:10px 18px;border-radius:100px;font-size:15px;font-weight:600;letter-spacing:.3px;white-space:nowrap}.hud-pill .label{opacity:.5;margin-right:6px;font-weight:400}.hud-pill.timer{color:#7fdbca}.hud-pill.strokes{color:#ffd580}.hud-pill.hole{color:#c3a6ff}.hud-pill.par{color:#ff9aa2}.players-panel{position:fixed;top:70px;left:28px;display:flex;flex-direction:column;gap:6px;pointer-events:none;z-index:10}.pp-row{display:flex;align-items:center;gap:8px;background:#00000080;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.08);padding:6px 14px;border-radius:100px;font-size:13px;font-weight:500;color:#ffffffd9}.pp-row.pp-me{border-color:#ffffff40}.pp-row.pp-in-goal{opacity:.6}.pp-color{width:10px;height:10px;border-radius:50%;flex-shrink:0}.pp-name{flex:1}.pp-strokes{font-weight:700;min-width:16px;text-align:right}.pp-done{color:#4ecdc4;font-weight:700;margin-left:4px}.banner-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:30;pointer-events:none;opacity:0;transition:opacity .3s}.banner-overlay.visible{opacity:1}.banner-card{background:#0a0a1ed9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:36px 56px;text-align:center;transform:scale(.9);transition:transform .3s}.banner-overlay.visible .banner-card{transform:scale(1)}.banner-title{font-size:36px;font-weight:700;margin-bottom:8px;background:linear-gradient(135deg,#7fdbca,#c3a6ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.banner-sub{font-size:18px;opacity:.6}.place-ui{position:fixed;bottom:32px;left:50%;transform:translate(-50%);z-index:10;display:none}.place-ui.visible{display:block}.place-card{background:#0a0a1ecc;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:18px 32px;display:flex;align-items:center;gap:20px}.place-card p{font-size:15px;opacity:.7}.place-timer{font-size:22px;font-weight:700;color:#ffd580;min-width:28px;text-align:center}.btn{background:linear-gradient(135deg,#7fdbca,#4ecdc4);border:none;color:#0f0f23;padding:10px 22px;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;letter-spacing:.3px;transition:transform .1s,box-shadow .2s}.btn:hover{transform:scale(1.04);box-shadow:0 4px 20px #4ecdc44d}.btn:active{transform:scale(.97)}.btn.secondary{background:#ffffff14;color:#ffffffb3}.btn.secondary:hover{background:#ffffff24;box-shadow:none}.hint{position:fixed;bottom:32px;left:50%;transform:translate(-50%);font-size:14px;opacity:0;pointer-events:none;z-index:10;transition:opacity .4s;background:#0006;backdrop-filter:blur(8px);padding:10px 20px;border-radius:100px;border:1px solid rgba(255,255,255,.06)}.hint.visible{opacity:.6}.menu-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background:linear-gradient(180deg,#0a0e1a,#1a1a3e)}.menu-title{font-size:64px;font-weight:800;margin-bottom:8px;background:linear-gradient(135deg,#7fdbca,#c3a6ff,#ffd580);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.menu-subtitle{font-size:18px;opacity:.5;margin-bottom:48px}.menu-btn{background:linear-gradient(135deg,#7fdbca,#4ecdc4);border:none;color:#0f0f23;padding:16px 48px;border-radius:14px;font-size:20px;font-weight:700;cursor:pointer;transition:transform .1s,box-shadow .2s;margin-bottom:16px}.menu-btn:hover{transform:scale(1.04);box-shadow:0 6px 30px #4ecdc459}.menu-btn:active{transform:scale(.97)}.join-row{display:flex;gap:8px;margin-top:8px}.join-input{background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:14px 20px;font-size:16px;color:#fff;outline:none;width:300px;font-family:inherit}.join-input::placeholder{color:#ffffff4d}.join-input:focus{border-color:#7fdbca80}.lobby-screen{height:100vh;background:linear-gradient(180deg,#0a0e1a,#1a1a3e);overflow-y:auto;padding:40px}.lobby-layout{display:flex;gap:32px;max-width:1200px;margin:0 auto;align-items:flex-start}.lobby-left{flex:0 0 360px}.lobby-right{flex:1;display:flex;flex-direction:column;gap:20px}.lobby-card{background:#0f0f28e6;border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:32px 36px;text-align:center}.lobby-title{font-size:36px;font-weight:700;margin-bottom:24px;background:linear-gradient(135deg,#7fdbca,#c3a6ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.lobby-code{margin-bottom:24px}.lobby-code .label{font-size:13px;opacity:.5;display:block;margin-bottom:6px}.lobby-link{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:10px 16px;font-size:14px;font-family:monospace;cursor:pointer;word-break:break-all}.lobby-link:hover{background:#ffffff1a}.lobby-players{margin-bottom:24px}.lobby-player{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:16px}.player-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0}.lobby-waiting{opacity:.4;font-size:14px}.lobby-status{opacity:.4;font-size:14px;margin-top:12px}.config-section{background:#0f0f28e6;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:20px 24px}.config-title{font-size:16px;font-weight:700;margin-bottom:14px;opacity:.8}.config-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.config-row label{font-size:14px;opacity:.6}.config-options{display:flex;gap:6px}.config-opt{background:#ffffff0f;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:6px 14px;font-size:13px;color:#fff9;cursor:pointer;font-family:inherit;font-weight:600;transition:all .15s}.config-opt:hover:not(:disabled){background:#ffffff1a}.config-opt.active{background:#7fdbca33;border-color:#7fdbca80;color:#7fdbca}.config-opt:disabled{opacity:.4;cursor:default}.map-vote-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}.map-vote-card{border:2px solid rgba(255,255,255,.1);border-radius:12px;padding:14px 12px;cursor:pointer;text-align:center;transition:all .15s;color:#fff;font-family:inherit;position:relative}.map-vote-card:hover{border-color:#ffffff4d;transform:translateY(-2px)}.map-vote-card.voted{border-color:#7fdbca;box-shadow:0 0 16px #7fdbca33}.map-vote-name{font-size:15px;font-weight:700;margin-bottom:2px}.map-vote-theme{font-size:12px;opacity:.5;margin-bottom:4px}.map-vote-par{font-size:12px;opacity:.4}.map-vote-count{position:absolute;top:-8px;right:-8px;background:#7fdbca;color:#0f0f23;font-size:11px;font-weight:800;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center}.obstacle-toggle-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}.obstacle-toggle{background:#ffffff0a;border:2px solid rgba(255,255,255,.08);border-radius:10px;padding:10px 8px;cursor:pointer;text-align:center;transition:all .15s;color:#fff;font-family:inherit}.obstacle-toggle:hover:not(:disabled){border-color:#fff3}.obstacle-toggle.on{border-color:#7fdbca66;background:#7fdbca14}.obstacle-toggle.off{opacity:.35}.obstacle-toggle:disabled{cursor:default}.obs-toggle-preview{width:28px;height:28px;border-radius:6px;border:2px solid;margin:0 auto 6px}.obs-toggle-name{font-size:11px;font-weight:600}.results-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background:linear-gradient(180deg,#0a0e1a,#1a1a3e)}.results-title{font-size:48px;font-weight:700;margin-bottom:12px;background:linear-gradient(135deg,#7fdbca,#c3a6ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.results-score{font-size:72px;font-weight:800;color:#ffd580;margin-bottom:8px}.results-detail{font-size:18px;opacity:.5;margin-bottom:48px}.draft-ui{position:fixed;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;z-index:25;pointer-events:all;background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.draft-ui.visible{display:flex}.draft-title{font-size:28px;font-weight:700;margin-bottom:6px;background:linear-gradient(135deg,#7fdbca,#c3a6ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.draft-timer{font-size:36px;font-weight:800;color:#ffd580;margin-bottom:24px}.draft-cards{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;max-width:900px}.draft-card{background:#0f0f28e6;border:2px solid rgba(255,255,255,.1);border-radius:16px;padding:20px 24px 16px;cursor:pointer;transition:transform .12s,box-shadow .2s,border-color .2s;text-align:center;min-width:140px;color:#fff;font-family:inherit}.draft-card:hover{transform:translateY(-4px) scale(1.03);border-color:#7fdbca99;box-shadow:0 8px 32px #4ecdc44d}.draft-card:active{transform:scale(.97)}.draft-preview{margin-bottom:14px;min-height:50px;display:flex;align-items:center;justify-content:center}.draft-name{font-size:16px;font-weight:700;margin-bottom:6px}.draft-desc{font-size:12px;opacity:.5;line-height:1.4;margin-bottom:8px}.draft-size{font-size:11px;opacity:.3;font-weight:600;letter-spacing:.5px;text-transform:uppercase}