html,body{color:#eee;background:#000;height:100%;margin:0;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;overflow:hidden}#app{position:fixed;inset:0}#app canvas{width:100%;height:100%;display:block}#ui{pointer-events:none;position:fixed;inset:0}#ui>*{pointer-events:none}.hidden{display:none!important}button{font:inherit;cursor:pointer}.start{background:radial-gradient(at 50% 35%,#1e160ceb,#000000f7);justify-content:center;align-items:center;display:flex;position:absolute;inset:0;pointer-events:auto!important}.start-inner{text-align:center;max-width:1240px;padding:30px}.brand{letter-spacing:.08em;color:#f1e3c2;text-shadow:0 0 18px #ffaa5a73,0 0 60px #ff783c40;font-family:Georgia,Times New Roman,serif}.brand-club{margin-right:18px;font-size:64px;font-weight:400}.brand-no{color:#ff5a4a;text-shadow:0 0 20px #ff503ccc,0 0 70px #ff3c2880;font-size:112px;font-style:italic;font-weight:700}.tag{color:#b9a98a;letter-spacing:.35em;text-transform:uppercase;margin:4px 0 34px;font-size:13px}.modes{justify-content:center;gap:18px;margin-bottom:34px;display:flex}.modes button,.menu button{color:#f1e3c2;letter-spacing:.18em;pointer-events:auto;background:linear-gradient(#2a2017,#15100b);border:1px solid #6a5435;border-radius:3px;padding:16px 30px;font-size:15px;transition:all .15s}.modes button:hover,.menu button:hover{background:linear-gradient(#4a3620,#2a1d10);border-color:#d2a65a;box-shadow:0 0 20px #ffaa5040}.controls{text-align:left;justify-content:center;gap:30px;display:flex}.controls .col{color:#cdbfa6;background:#00000059;border:1px solid #ffffff14;border-radius:4px;width:330px;padding:16px 20px;font-size:13px;line-height:1.75}.controls h4{color:#f1e3c2;letter-spacing:.2em;margin:0 0 6px;font-size:12px;font-weight:400}.controls b{color:#ffd890;font-weight:600}.foot{color:#8a7d68;letter-spacing:.05em;margin-top:26px;font-size:12px}.menu{background:#0000009e;justify-content:center;align-items:center;display:flex;position:absolute;inset:0;pointer-events:auto!important}.menu-inner{flex-direction:column;gap:12px;width:440px;max-height:86vh;display:flex}.menu-title{color:#f1e3c2;letter-spacing:.2em;text-align:center;margin-bottom:10px;font-family:Georgia,serif;font-size:34px}.replay-list{pointer-events:auto;background:#0009;border:1px solid #3a3025;border-radius:3px;max-height:44vh;overflow-y:auto}.r-item{text-align:left;color:#e5d7bb;pointer-events:auto;background:0 0;border:0;border-bottom:1px solid #221c15;gap:12px;width:100%;padding:10px 14px;font-size:13px;display:flex}.r-item:hover{background:#ffc8781a}.r-item span:first-child{flex:1}.r-out{color:#b9a98a}.r-dur{color:#7a6d5a;text-align:right;width:48px}.r-empty{color:#8a7d68;padding:14px;font-size:13px}.hud{position:absolute;inset:0}.status{letter-spacing:.3em;color:#e9dcc0;text-shadow:0 1px 6px #000;background:#0000004d;border-radius:2px;padding:8px 18px;font-size:12px;position:absolute;top:22px;left:50%;transform:translate(-50%)}.crosshair{background:#ffffffa6;border-radius:50%;width:4px;height:4px;margin:-2px;position:absolute;top:50%;left:50%;box-shadow:0 0 4px #000}.message{text-align:center;text-shadow:0 2px 10px #000;position:absolute;top:18%;left:50%;transform:translate(-50%)}.m-title{color:#f6ead0;letter-spacing:.08em;font-family:Georgia,serif;font-size:40px}.m-sub{color:#cdbfa6;letter-spacing:.15em;text-transform:uppercase;margin-top:6px;font-size:13px}.balls{align-items:flex-start;gap:18px;display:flex;position:absolute;top:60px;right:26px}.balls .side{background:#00000059;border:1px solid #0000;border-radius:3px;padding:8px 10px}.balls .side.active{border-color:#ffd28c80}.balls .who{letter-spacing:.25em;color:#cdbfa6;margin-bottom:6px;font-size:10px}.chips{gap:5px;display:flex}.chip{color:#111;background:radial-gradient(circle at 35% 30%, #fff 0, var(--c) 28%, var(--c) 100%);border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;font-size:10px;font-weight:700;display:inline-flex;box-shadow:inset -2px -3px 4px #00000080}.chip.stripe{background:linear-gradient(#f4efe3 0 22%, var(--c) 22% 78%, #f4efe3 78%)}.chip{position:relative}.chip:after{content:""}.chip.off{opacity:.18;filter:grayscale()}.eight{padding:14px 4px}.eight .chip{color:#eee;background:radial-gradient(circle at 35% 30%,#666 0,#111 35%)}.bottom{align-items:flex-end;gap:36px;display:flex;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}.strike{text-align:center}.strike-ball{background:radial-gradient(circle at 40% 35%,#fff,#c9c2b2 70%,#7a7468);border:2px solid #00000080;border-radius:50%;width:86px;height:86px;position:relative;box-shadow:0 4px 14px #0009}.strike-ball:before{content:"";background:#0000002e;width:1px;position:absolute;top:10%;bottom:10%;left:50%}.strike-ball:after{content:"";background:#0000002e;height:1px;position:absolute;top:50%;left:10%;right:10%}.strike-dot{background:#2f5aa8;border:2px solid #fff;border-radius:50%;width:12px;height:12px;margin:-6px;position:absolute;top:50%;left:50%;box-shadow:0 0 6px #0009}.strike-label,.power-label{letter-spacing:.3em;color:#cdbfa6;text-shadow:0 1px 4px #000;margin-top:8px;font-size:10px}.power{text-align:center;width:300px}.power-bar{background:#0000008c;border:1px solid #ffffff40;border-radius:2px;height:14px;overflow:hidden}.power-fill{background:#d8c27a;width:0;height:100%;transition:width 30ms linear}.power.charging .power-bar{border-color:#ffd890;box-shadow:0 0 12px #ffc87866}.hint{text-align:center;letter-spacing:.15em;color:#9a8d78;white-space:nowrap;font-size:11px;position:absolute;bottom:-26px;left:0;right:0}.practice{flex-direction:column;gap:8px;display:flex;position:absolute;top:60px;left:26px}.practice button{pointer-events:auto;color:#e9dcc0;letter-spacing:.15em;background:#00000080;border:1px solid #5a4a35;border-radius:2px;padding:8px 14px;font-size:11px}.rhud{background:linear-gradient(#0000,#000000bf);padding:18px 30px 26px;position:absolute;bottom:0;left:0;right:0;pointer-events:auto!important}.r-title{color:#f6ead0;letter-spacing:.15em;margin-bottom:10px;font-family:Georgia,serif;font-size:18px}.r-controls{align-items:center;gap:12px;display:flex}.r-controls button{color:#e9dcc0;letter-spacing:.1em;background:#0000008c;border:1px solid #5a4a35;border-radius:2px;padding:8px 14px;font-size:12px}.r-controls button.on{color:#ffd890;border-color:#ffd890}.r-seek{accent-color:#ffd890;flex:1}.r-time{color:#cdbfa6;width:110px;font-size:12px}.r-hint{color:#7a6d5a;letter-spacing:.15em;margin-top:8px;font-size:11px}.loading{color:#9a8d78;letter-spacing:.3em;font-size:11px;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}