/* Landscape-first play view. The home clubhouse continues to use style.css. */
:root{--pool-ui:#14243b;--pool-line:#49607e;--pool-accent:#93d8f1;--pool-gold:#ead08c}
.game-screen{display:grid;grid-template-rows:clamp(50px,10dvh,78px) minmax(0,1fr) 28px;gap:0;padding:max(4px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(3px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:radial-gradient(ellipse 85% 75% at 50% 52%,#25456b 0%,#15263e 68%,#0e172a 100%)}
.match-hud{display:grid;grid-template-columns:40px minmax(0,1fr) minmax(110px,160px) minmax(0,1fr) 40px;align-items:center;gap:clamp(5px,.8vw,14px);max-width:1460px;width:100%;margin:0 auto;z-index:3;min-height:0}
.hud-menu{height:clamp(30px,8dvh,46px);width:clamp(30px,8dvh,46px);display:grid;place-items:center;border:1px solid #b5d0da72;border-radius:10px;background:linear-gradient(#3b5b70,#1e3049);box-shadow:inset 0 1px #ffffff45,0 3px 10px #0008;color:#f2f7eb;font-size:23px}
.hud-menu{color:#c7f0db}.opponent-card{display:flex;align-items:center;gap:clamp(5px,1vw,14px);min-width:0}.opponent-card.right{justify-content:flex-end}.player-token{width:clamp(29px,7.4dvh,51px);height:clamp(29px,7.4dvh,51px);flex:none;display:grid;place-items:center;background:radial-gradient(circle at 32% 28%,#fef1be,#99824d 70%,#3a3331);border:2px solid #cec7a1;border-radius:12px;font:700 clamp(17px,4.2dvh,27px) Georgia,serif;box-shadow:0 3px 10px #0008;color:#312518}.right .player-token{background:radial-gradient(circle at 30% 25%,#f4f8ff,#6b849e 67%,#182c41);color:#162d40;border-color:#a9baca}
.player-info{flex:1;min-width:0}.player-info strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase;font-size:clamp(9px,1.35vw,13px);letter-spacing:.045em;text-shadow:0 2px 2px #0008}.player-info small{display:inline;color:#d6dbdf82;font-size:clamp(6px,1vw,9px);letter-spacing:0;margin-left:6px}.right .player-info{text-align:right}.ball-slots{display:flex;gap:clamp(2px,.5vw,6px);margin-top:5px}.right .ball-slots{justify-content:flex-end}.ball-slot{aspect-ratio:1;width:clamp(8px,2.5dvh,18px);border-radius:50%;border:1px solid #8296b5;background:#0c1728cc;box-shadow:inset 0 1px 4px #000b}.ball-slot.assigned{border:2px solid #eff5fc;box-shadow:0 1px 4px #0007}.ball-slot.pocketed{opacity:.19;filter:grayscale(1)}
.match-center{align-self:center;text-align:center;min-width:0}.match-center small{display:block;font-size:clamp(7px,1vw,10px);letter-spacing:.11em;color:#d8e0e0ae;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.match-center strong{font:700 clamp(11px,1.75vw,20px)/1.15 Georgia,serif;color:#fff7e9;letter-spacing:.02em}
.match-arena{display:grid;grid-template-columns:clamp(54px,8.5vw,112px) minmax(0,1fr) clamp(59px,9vw,115px);gap:clamp(2px,.6vw,12px);max-width:1540px;width:100%;height:100%;min-height:0;min-width:0;place-self:center}
.table-play-area{grid-column:2;grid-row:1;position:relative;width:100%;min-width:0;min-height:0;max-width:none;max-height:none;touch-action:none;margin:0}
.table-play-area canvas{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none}#gameCanvas{z-index:1}
.guide-badge{z-index:2;top:3%;padding:4px 9px;font-size:clamp(7px,1vw,10px);background:#102339b0;border-color:#bbdfed6b;color:#f4fcff;max-width:80%;overflow:hidden;text-overflow:ellipsis}
.shot-rail,.tools-rail{grid-row:1;min-height:0;display:flex;align-items:center;z-index:4}.shot-rail{grid-column:1;flex-direction:column;justify-content:center;gap:5px;padding:3px 1px}.rail-label,.tools-rail small{font:800 clamp(7px,.8vw,10px) system-ui;letter-spacing:.12em;color:#cadce6}.power-track{--pull:0%;position:relative;flex:1;min-height:75px;max-height:440px;width:clamp(28px,5vw,51px);border:2px solid #aebcc5b0;border-radius:13px;background:linear-gradient(90deg,#0a1728,#2d455f 45%,#101b2b);touch-action:none;box-shadow:inset 0 0 0 4px #121a29,0 4px 12px #0009;cursor:ns-resize;overflow:hidden}
.track-groove{position:absolute;inset:12px 7px;border-radius:8px;background:linear-gradient(90deg,#0e1218,#72523b 30%,#c38e5d 53%,#573b2c 77%,#0d1117);box-shadow:inset 0 0 6px #000;overflow:hidden}.power-fill{height:var(--pull);width:100%;background:linear-gradient(#e2cc97b8,#e9b06a22);border-bottom:2px solid #fff5c3aa}.pull-handle{position:absolute;top:calc(4px + var(--pull-y, 0px));left:-1px;width:calc(100% + 2px);height:34px;display:grid;place-items:center;background:linear-gradient(#f8e2c0,#a87540 43%,#5c3e24 57%,#ca8c56);border:2px solid #ead4b2;border-radius:9px;box-shadow:0 3px 7px #000a;pointer-events:none}.cue-tip{width:10px;height:22px;border-radius:5px;background:#f6e9b7;box-shadow:inset 0 1px 3px #fff}.power-readout{font-size:clamp(8px,.9vw,10px);font-weight:900;color:#f3dfad;text-align:center;white-space:nowrap;letter-spacing:.02em}
.tools-rail{grid-column:3;flex-direction:column;justify-content:space-around;gap:3px;padding:2px 0}.cueball-button{flex:none;width:clamp(36px,6dvh,52px);min-height:clamp(38px,8dvh,63px);padding:3px;display:grid;place-items:center;background:#111f35c0;border:1px solid #95a9c285;border-radius:10px;color:white}.cueball-face{display:block;position:relative;width:clamp(27px,5dvh,40px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 26% 20%,#fff,#ddd9d4 54%,#737b83);box-shadow:inset -4px -4px 7px #2632437c,0 3px 7px #0008}.cueball-face i,.spin-ball i{position:absolute;left:50%;top:50%;width:18%;height:18%;transform:translate(-50%,-50%);background:#f3483c;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #a72122}
.cueball-button small{font-size:7px}
.aim-wheel-control{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:clamp(7px,.9vw,10px);letter-spacing:.05em;font-weight:800;color:#ebf0ef}.aim-wheel-control>button{background:#25425a;color:#e2eaf1;border:1px solid #8daab99a;border-radius:8px;min-height:23px;width:38px}.aim-wheel{flex:1;min-height:44px;max-height:175px;width:clamp(28px,4vw,44px);position:relative;border:1px solid #8198b6;border-radius:14px;background:repeating-linear-gradient(0deg,#4c6b8a 0 2px,#1c3047 2px 10px);touch-action:none;cursor:ns-resize;box-shadow:inset 0 0 7px #000a}.wheel-grip{position:absolute;top:50%;left:-5px;right:-5px;height:6px;border-radius:3px;transform:translateY(-50%);background:#d2e4e6;box-shadow:0 0 9px #000}
.aim-wheel-control #aimRange{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}

.spin-shade{position:absolute;inset:0;z-index:17;background:#000b;backdrop-filter:blur(3px)}.spin-sheet{z-index:18;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(340px,84vw);max-height:90dvh;overflow:auto;display:flex;flex-direction:column;gap:9px;align-items:center;padding:16px;background:#ecedea;color:#132035;border-radius:15px;box-shadow:0 20px 80px #000a}.spin-head{display:flex;justify-content:space-between;align-items:center;align-self:stretch}.spin-head h2{margin:0;font:24px Georgia,serif}.spin-head button,.spin-sheet #spinReset{border:0;padding:8px 12px;background:#213b52;color:white;border-radius:7px;font-size:11px;font-weight:800}.spin-sheet p{font-size:12px;color:#455669;margin:0;text-align:center}.spin-ball{width:min(33dvh,150px);height:min(33dvh,150px);max-width:42vw;max-height:42vw;position:relative;border-radius:50%;background:radial-gradient(circle at 28% 20%,#fff,#efeee9 35%,#c1c6ca 71%,#677787);box-shadow:inset -9px -12px 16px #4a55665e,0 10px 24px #0003;touch-action:none;cursor:crosshair}.spin-ball i{width:16%;height:16%;pointer-events:none}.spin-description{font-size:11px;font-weight:900;letter-spacing:.1em}
#spinShade[hidden],#spinSheet[hidden]{display:none!important}
@media (max-height:440px){.game-screen{grid-template-rows:46px minmax(0,1fr) 22px}.match-hud{grid-template-columns:30px minmax(0,1fr) 84px minmax(0,1fr) 30px;gap:4px}.hud-menu{height:29px;width:29px;font-size:17px}.player-token{height:28px;width:28px}.ball-slots{margin-top:2px}.ball-slot{width:10px}.match-center strong{font-size:12px}.match-center small{font-size:7px}.guide-badge{top:0;font-size:7px;padding:2px 5px}.power-track{border-radius:8px}.pull-handle{height:28px}.aim-wheel-control>button{min-height:18px}.cueball-button{min-height:38px}.cueball-face{width:25px}}

@media (prefers-reduced-motion:reduce){.game-screen *{transition:none!important}}
/* Reset legacy compact-screen positioning inherited from the old bottom HUD. */
.game-screen .table-play-area{top:0;left:0;right:auto;bottom:auto}
.game-screen .guide-badge{display:none}
.shot-rail .power-track.is-disabled,.aim-wheel[aria-disabled="true"]{opacity:.48;cursor:not-allowed}
.opponent-card.playing .player-token{outline:2px solid #8ae5b4;outline-offset:2px}
