:root{color-scheme:dark;--bg:#080e1c;--panel:#111c30;--panel2:#17243d;--line:rgba(255,255,255,0.09);--text:#eef6ff;--muted:#9faec6;--mint:#78f1d1;--gold:#78f1d1;--green:#78f1d1;--font:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 75% 0%,#1a2442 0%,transparent 42%),radial-gradient(ellipse at 20% 90%,#12182c 0%,transparent 42%),var(--bg);font:14px/1.6 var(--font);color:var(--text)}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button:disabled{opacity:.35;cursor:not-allowed}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--mint);outline-offset:4px}button svg{display:block;width:18px;height:18px}svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}button{border:0}.site-header,.club-header{max-width:1300px;margin:auto;height:82px;padding:0 34px;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box}.brand{font-size:13px;font-weight:800;letter-spacing:.01em;display:flex;gap:11px;align-items:center}.brand b{border:1px solid var(--line);border-radius:9px;color:var(--mint);font-size:22px;width:35px;height:35px;display:grid;place-items:center}.header-links{display:flex;gap:22px;font-size:13px;color:var(--muted);align-items:center}.header-links a{font-weight:600;transition:color .2s ease}.header-links a:hover{color:var(--mint)}main{max-width:1232px;margin:0 auto;padding:15px 0 0}.title-row,.page-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:23px;max-width:1232px;margin-left:auto;margin-right:auto;padding:0 4px}.eyebrow,.kicker{font-size:10px;letter-spacing:.18em;color:var(--mint);font-weight:800;text-transform:uppercase}.title-row h1,.page-title h1{font-size:32px;letter-spacing:-1.2px;line-height:1.15;margin:6px 0 0;font-weight:750}.title-row p,.page-title p{color:var(--muted);font-size:13px;margin:6px 0 0}.game-tags{display:flex;gap:7px}.game-tags span,.page-title .pill{border:1px solid var(--line);padding:6px 11px;border-radius:30px;font-size:10px;font-weight:700;letter-spacing:.06em;color:#b6c4db;background:rgba(255,255,255,0.03)}.club-shell{background:#070b17;border:1px solid #7e9dbc35;border-radius:22px;box-shadow:0 24px 90px rgba(0,0,0,0.4);overflow:hidden;isolation:isolate}.scoreboard{display:grid;grid-template-columns:1fr 190px 1fr;padding:22px 27px;border-bottom:1px solid var(--line);background:linear-gradient(90deg,#0e1a2d,#0b1424 45%,#0d1727);gap:20px}.player{display:flex;align-items:center;gap:12px;position:relative}.player:last-child{flex-direction:row-reverse;text-align:right}.avatar{width:39px;height:39px;border-radius:50%;border:1px solid #78f1d133;background:#15263a;color:var(--mint);display:grid;place-items:center;font-size:10px;font-weight:800}.player .name{font-size:12px;font-weight:700}.player .meta{font-size:9px;color:var(--muted);letter-spacing:.07em}.player .score{font-family:Georgia,serif;font-variant-numeric:tabular-nums;font-size:41px;line-height:1;margin-left:auto}.player:last-child .score{margin:0 auto 0 0}.player.active .name{color:var(--mint)}.player.active .avatar{border-color:var(--mint);box-shadow:0 0 0 4px #78f1d115}.player.active:after{content:"";position:absolute;height:2px;bottom:-23px;width:90%;background:linear-gradient(90deg,var(--mint),transparent)}.player:last-child.active:after{background:linear-gradient(270deg,var(--mint),transparent)}.frame-info{text-align:center;align-self:center}.frame-info small{color:var(--muted);font-size:9px;letter-spacing:.1em}.frame-score{font-size:12px;letter-spacing:.08em;color:#dfeae4;margin:3px 0}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 248px}.table-area{min-width:0;padding:15px 18px 0;background:radial-gradient(ellipse,#14243a40,transparent 65%)}.table-topbar{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:0 5px 12px}.ball-on{display:flex;align-items:center;gap:8px;color:#dceade;font-size:11px}.ball-on .label{color:#83998e;font-size:9px;letter-spacing:.08em}.ball-dot{display:inline-block;width:11px;height:11px;flex-shrink:0;border-radius:50%;background:var(--ball,#cd3942);box-shadow:inset -2px -2px 3px #0006,inset 2px 2px 3px #ffffff44,0 1px 3px #0006;border:1px solid #ffffff12}.table-tools{display:flex;gap:5px}.icon-button{border:1px solid var(--line);background:#111c30;border-radius:7px;width:30px;height:29px;display:grid;place-items:center;color:#a4b5ad}.icon-button:hover{color:var(--mint);background:#1a2842}.icon-button[aria-pressed=true]{color:var(--mint)}.viewport{overflow:auto;scrollbar-width:thin;scrollbar-color:#2a3e5c #111c30;position:relative;border-radius:9px;touch-action:pan-y}.canvas-wrap{width:100%;position:relative;min-width:100%;aspect-ratio:1.83}.canvas-wrap canvas{display:block;width:100%;height:100%;touch-action:none}.table-interaction-row{display:flex;align-items:stretch;gap:12px}.table-interaction-row .viewport{flex:1;min-width:0}.mobile-cue-rail{display:none}.table-status{display:flex;justify-content:space-between;gap:20px;color:#9eb4a6;font-size:10px;padding:8px 6px 13px;min-height:40px}.table-status #shot-message{max-width:76%}.table-status #motion-status{color:#6e8778;white-space:nowrap}.control-strip{display:grid;grid-template-columns:auto 1fr auto auto;gap:18px;padding:15px 6px 20px;align-items:center;border-top:1px solid var(--line)}.fine-controls{display:flex;gap:5px}.fine-controls button{border:1px solid var(--line);background:#162438;color:#d1dfd4;width:30px;height:31px;border-radius:7px}.power-control{min-width:50px}.control-label{font-size:8px;letter-spacing:.12em;color:#9eafa4;display:flex;justify-content:space-between;align-items:center}.control-label strong{font-size:10px;color:var(--mint);font-weight:600}.power-control input{width:100%;accent-color:var(--mint);height:18px;cursor:pointer;margin:5px 0 0}.shoot-button{color:#081816;background:var(--mint);min-height:43px;border-radius:8px;padding:10px 27px;font-size:11px;font-weight:800;letter-spacing:.08em;box-shadow:0 4px 12px rgba(120,241,209,0.25)}.shoot-button:hover{filter:brightness(1.1);background:#92ffe2}.spin-wrap{display:flex;gap:8px;align-items:center}.spin-pad{position:relative;width:39px;height:39px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fffef4,#cbd2c8 70%,#89998e);box-shadow:0 2px 5px #0006;touch-action:none;cursor:crosshair}.spin-pad:before,.spin-pad:after{content:"";position:absolute;background:#394d3430;left:7px;right:7px;top:19px;height:1px}.spin-pad:after{transform:rotate(90deg)}.spin-pad span{width:6px;height:6px;border-radius:50%;background:#c34346;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #fff7;z-index:1}.spin-wrap small{font-size:8px;letter-spacing:.1em;color:var(--muted)}.sidebar{background:#0e1728;border-left:1px solid var(--line);padding:20px 18px;display:flex;flex-direction:column}.sidebar-title{display:flex;align-items:center;justify-content:space-between}.sidebar h2{font-size:12px;margin:0;color:#dfebe2;font-weight:700}.sidebar-title span{font-size:8px;letter-spacing:.1em;color:var(--mint)}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:15px 0 18px}.stat-card{background:#080e1c;border:1px solid var(--line);border-radius:9px;padding:10px 12px}.stat-card span{display:block;color:#7e92ac;letter-spacing:.08em;font-size:8px}.stat-card b{font-size:23px;line-height:1.4;font-family:Georgia,serif;font-weight:400;color:#eef6ff}.selector-label{font-size:8px;text-transform:uppercase;letter-spacing:.13em;color:#8fa7c4;margin:0 0 9px}.colours{display:flex;gap:6px;margin-bottom:17px;flex-wrap:wrap}.colour-button{width:29px;height:34px;border:1px solid var(--line);border-radius:7px;background:#142236;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;padding:4px 0}.colour-button small{color:#9faec6;font-size:8px;line-height:1}.colour-button[aria-pressed=true]{border-color:var(--mint);background:#1a324a}.colour-button .ball-dot{width:12px;height:12px}.free-ball select{width:100%;background:#13243a;color:#eef6ff;border:1px solid var(--line);border-radius:7px;font-size:11px;padding:7px;margin-bottom:13px}.activity{border-top:1px solid var(--line);padding-top:14px;flex:1;min-height:140px}.activity h3{font-size:9px;letter-spacing:.1em;font-weight:600;color:#8fa7c4;margin:0 0 11px}.shot-log{list-style:none;padding:0;margin:0;max-height:155px;overflow:auto;scrollbar-width:thin}.shot-log li{font-size:10px;line-height:1.6;color:#a0b2cc;padding:6px 0;border-bottom:1px solid var(--line)}.shot-log li:first-child{color:#eef6ff}.shot-log li.foul{color:#ff9e9e}.side-buttons{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:15px}.small-button{border:1px solid var(--line);border-radius:7px;background:#16253c;padding:8px;font-size:10px;color:#c2d2ea}.small-button:hover{border-color:var(--mint);color:var(--mint)}.bottom-note{display:flex;justify-content:space-between;gap:15px;padding:12px 24px;background:#090f1d;border-top:1px solid var(--line);font-size:10px;color:#8da0be}.bottom-note a{color:var(--mint)}.decision-bar{margin:0 24px 17px;padding:14px 17px;border:1px solid var(--mint);background:#13273890;border-radius:10px}.decision-bar p{font-size:12px;color:#eef6ff;margin:0 0 10px}.decision-bar .actions{display:flex;gap:8px;flex-wrap:wrap}.decision-bar button{background:#1a364d;border:1px solid var(--mint);border-radius:6px;padding:8px 11px;font-size:10px;color:#eef6ff}.overlay{position:fixed;inset:0;background:#040915cc;backdrop-filter:blur(12px);z-index:20;display:grid;place-items:center;padding:20px}.dialog{width:470px;max-width:100%;background:linear-gradient(160deg,#15233c,#0d1628);border:1px solid #78f1d144;border-radius:19px;padding:34px;box-shadow:0 30px 120px #0009}.dialog .crest{width:46px;height:46px;border:1px solid #78f1d155;display:grid;place-items:center;border-radius:50%;font-family:Georgia,serif;font-size:21px;color:var(--mint);margin-bottom:21px}.dialog h2{font:normal 34px/1.15 Georgia,serif;letter-spacing:-1px;margin:9px 0 12px}.dialog p{font-size:12px;color:#a6bdb0;line-height:1.8;margin:0 0 20px}.dialog .field-label{font-size:9px;letter-spacing:.1em;color:#a2b6a8;margin:15px 0 6px;display:block}.segmented{display:grid;grid-template-columns:repeat(3,1fr);padding:4px;border:1px solid var(--line);background:#091122;border-radius:9px;gap:3px}.segmented button{font-size:10px;padding:9px 3px;background:transparent;color:#92ab9e;border-radius:6px}.segmented button[aria-pressed=true]{background:#1e3752;color:#eff6e9}.setup-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}.setup-row select{width:100%;background:#101d32;border:1px solid var(--line);color:#d9e8d9;border-radius:7px;padding:8px;font-size:11px}.dialog .wide-button{display:block;width:100%;margin-top:24px}.dialog .dialog-dismiss{display:block;margin:13px auto 0;background:none;color:#9db29f;font-size:11px}.dialog .result-scores{display:flex;justify-content:center;gap:24px;font-family:Georgia,serif;font-size:50px;color:var(--mint);margin:18px 0}.dialog .result-scores small{font:10px var(--font);color:#91a993;display:block;text-align:center}.content{display:grid;grid-template-columns:1.4fr 1fr;gap:70px;padding:49px 4px 45px;max-width:1232px;margin:auto}.content h2{font-size:18px;font-weight:650;letter-spacing:-.5px;margin:0 0 13px}.content h3{font-size:13px;color:#eef6ff;font-weight:700;margin:18px 0 5px}.content p,.content li{color:var(--muted);font-size:13px;line-height:1.85;margin:0 0 13px}.content ol{padding-left:18px}.content a{color:var(--mint);border-bottom:1px solid #78f1d144}kbd{font:10px var(--font);background:#19263d;border:1px solid rgba(107,132,169,0.27);border-bottom-width:2px;padding:2px 6px;border-radius:4px;color:#d6e4f4}.site-footer,.club-footer{max-width:1232px;margin:0 auto;border-top:1px solid var(--line);padding:22px 0 30px;display:flex;justify-content:space-between;gap:18px;color:#6f839f;font-size:10px}.site-footer nav,.club-footer nav{display:flex;gap:20px}.site-footer a:hover,.club-footer a:hover{color:var(--mint)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.club-shell:fullscreen,.club-shell.pseudo-fullscreen{position:fixed!important;inset:0!important;top:0!important;left:0!important;border:0!important;border-radius:0!important;overflow:auto!important;width:100vw!important;height:100dvh!important;display:flex!important;flex-direction:column!important;z-index:999999!important;margin:0!important;max-width:none!important;background:#070b17!important}.club-shell:fullscreen .workspace,.club-shell.pseudo-fullscreen .workspace{flex:1!important}.club-shell:fullscreen .table-area,.club-shell.pseudo-fullscreen .table-area{display:flex!important;flex-direction:column!important}.club-shell:fullscreen .viewport,.club-shell.pseudo-fullscreen .viewport{margin:auto!important;width:min(100%,calc((100dvh - 260px)*1.83))!important}.club-shell:fullscreen .sidebar,.club-shell.pseudo-fullscreen .sidebar{max-width:248px!important}.brand-logo{height:38px;width:auto;max-width:100%;object-fit:contain;display:block}html.has-fullscreen-game,body.has-fullscreen-game{overflow:hidden!important;touch-action:none!important;margin:0!important;padding:0!important;width:100vw!important;height:100dvh!important}.paused-banner{position:absolute;inset:0;background:#050d18b3;backdrop-filter:blur(4px);display:grid;place-items:center;color:var(--mint);font:26px Georgia,serif;pointer-events:none}
@media(max-width:1430px){main,.club-footer{margin-left:35px;margin-right:35px}}
@media(max-width:1050px){.workspace{grid-template-columns:minmax(0,1fr) 205px}.sidebar{padding:17px 13px}.table-area{padding:13px 12px 0}.control-strip{gap:11px}.shoot-button{padding:10px 20px}.colours{gap:4px}.colour-button{width:25px}.scoreboard{padding:19px 22px;grid-template-columns:1fr 150px 1fr}.player.active:after{bottom:-20px}}
@media(max-width:800px){main,.club-footer{margin-left:18px;margin-right:18px}.club-header{padding:20px 18px}.workspace{grid-template-columns:1fr}.sidebar{border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:12px 20px}.sidebar-title,.activity{display:none}.stat-grid{margin:0;grid-column:1}.nomination-block{grid-column:2;grid-row:1}.selector-label{margin-top:3px}.colours{margin:5px 0 0;gap:6px}.colour-button{width:30px}.free-ball{grid-column:1/-1}.side-buttons{margin:0;grid-column:1/-1;grid-template-columns:repeat(4,1fr)}.stat-card{padding:6px 11px}.stat-card b{font-size:20px}.scoreboard{grid-template-columns:1fr 125px 1fr;padding:17px 18px;gap:15px}.player.active:after{bottom:-18px}.player .score{font-size:34px}.avatar{width:30px;height:30px}.player{gap:8px}.player .name{font-size:10px}.player .meta{font-size:8px}.content{gap:35px}.club-shell:fullscreen .sidebar{max-width:none}.club-shell:fullscreen .viewport{width:min(100%,calc((100dvh - 355px)*1.83))}.club-shell:fullscreen .workspace{display:block}}
@media(max-width:520px){.club-header{padding:16px}.brand{font-size:9px;gap:9px}.brand b{height:29px;width:29px;font-size:19px}.header-links{gap:13px;font-size:10px}main{margin:0;padding-top:5px}.page-title{padding:0 18px;margin-bottom:21px}.page-title h1{font-size:30px}.page-title p{font-size:11px}.page-title .pill{font-size:8px;padding:5px 8px}.club-shell{border-left:0;border-right:0;border-radius:0}.scoreboard{padding:16px 14px;gap:9px;grid-template-columns:1fr 88px 1fr}.player .score{font-size:30px}.player .avatar{display:none}.player.active:after{bottom:-17px}.player .meta{font-size:7px}.frame-score{font-size:10px}.frame-info small{font-size:7px}.table-area{padding:12px 7px 0}.table-topbar{padding:0 7px 8px}.ball-on{font-size:10px;gap:6px}.table-tools{gap:4px}.icon-button{width:26px;height:27px}.control-strip{gap:8px;padding:12px 8px 16px;grid-template-columns:auto 1fr auto}.fine-controls button{width:24px;height:30px}.spin-wrap{grid-column:1;grid-row:2;gap:7px;margin-top:3px}.spin-pad{width:35px;height:35px}.spin-pad:before,.spin-pad:after{top:17px}.shoot-button{font-size:10px;padding:9px 17px;min-height:40px}.control-label{font-size:7px}.table-status{font-size:9px;gap:7px;padding-bottom:10px}.table-status #shot-message{max-width:78%}.control-strip .shot-help{grid-column:2/-1;font-size:9px;color:var(--muted);display:block!important}.sidebar{padding:14px 17px;gap:12px}.stat-grid{gap:7px}.stat-card{padding:8px}.stat-card span{font-size:7px}.stat-card b{font-size:19px}.colours{gap:4px}.colour-button{width:24px;height:34px}.selector-label{font-size:7px}.side-buttons .small-button{padding:7px 3px;font-size:9px}.bottom-note{padding:12px 17px;font-size:8px;gap:8px}.bottom-note span:last-child{display:none}.decision-bar{margin:0 15px 13px;padding:12px}.decision-bar p{font-size:11px}.content{grid-template-columns:1fr;padding:29px 22px;gap:19px}.content h2{font-size:16px}.dialog{padding:10px 14px!important;width:min(94vw,350px)!important;max-height:calc(100dvh - 100px)!important;border-radius:14px!important;overflow-y:auto!important;display:flex!important;flex-direction:column!important;justify-content:center!important;margin:auto!important}.dialog h2{font-size:1.15rem!important;line-height:1.15!important;margin:2px 0 3px!important}.dialog .crest{width:24px!important;height:24px!important;font-size:11px!important;margin:0 auto 3px auto!important}.dialog p{font-size:10px!important;line-height:1.25!important;margin:0 0 4px!important}.dialog .field-label{font-size:7.5px!important;margin:2px 0 2px!important}.segmented{padding:2px!important;gap:2px!important;margin-bottom:4px!important}.segmented button{font-size:8.5px!important;padding:4px 2px!important}.setup-row{gap:6px!important;margin-top:2px!important}.setup-row select{padding:3px 6px!important;font-size:9.5px!important}.dialog .wide-button,#start-match{margin-top:6px!important;min-height:32px!important;padding:6px 10px!important;font-size:10px!important}.club-footer{padding:19px 0;flex-wrap:wrap;font-size:9px}.club-shell:fullscreen .viewport{width:100%}}
@media(max-height:530px) and (orientation:landscape){.club-shell:fullscreen .scoreboard{padding:8px 22px}.club-shell:fullscreen .player .score{font-size:27px}.club-shell:fullscreen .sidebar,.club-shell:fullscreen .bottom-note{display:none}.club-shell:fullscreen .viewport{width:min(100%,calc((100dvh - 160px)*1.83))}.club-shell:fullscreen .table-area{padding-top:6px}.club-shell:fullscreen .control-strip{padding:7px 4px}.club-shell:fullscreen .table-status{display:none}.dialog{padding:20px 27px;max-height:94dvh;overflow:auto}.dialog .crest{display:none}.dialog h2{font-size:27px}.dialog p{margin-bottom:8px}}


@media(max-height:530px) and (orientation:landscape){.club-shell:fullscreen .workspace{display:grid;grid-template-columns:minmax(0,1fr) 180px}.club-shell:fullscreen .sidebar{display:block;padding:10px;border-left:1px solid var(--line)}.club-shell:fullscreen .sidebar .stat-grid,.club-shell:fullscreen .sidebar .activity,.club-shell:fullscreen .sidebar-title,.club-shell:fullscreen .side-buttons{display:none}.club-shell:fullscreen .colours{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.club-shell:fullscreen .free-ball{margin-top:10px}.club-shell:fullscreen .viewport{width:min(100%,calc((100dvh - 160px)*1.83))}}


#snooker-canvas{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 11 11'%3E%3Ccircle cx='5.5' cy='5.5' r='2.5' fill='rgba(120,241,209,0.45)' stroke='%2378f1d1' stroke-width='1.2'/%3E%3Ccircle cx='5.5' cy='5.5' r='0.8' fill='%23ffffff'/%3E%3C/svg%3E") 5 5, crosshair;user-select:none;-webkit-user-select:none}
.cue-power-readout{--pull-colour:#e1c68b;position:absolute;bottom:12px;left:50%;transform:translateX(-50%);width:190px;max-width:75%;padding:10px 13px;border:1px solid #e1c68b66;border-radius:10px;background:#0c1918ed;box-shadow:0 5px 25px #0006;pointer-events:none;z-index:2}
.cue-power-readout>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:7px}
.cue-power-readout strong{font-size:20px;color:var(--pull-colour);font-variant-numeric:tabular-nums;line-height:1}
.cue-power-readout span{font-size:8px;letter-spacing:.08em;color:#c0ccbb}
.cue-pull-track{height:4px;border-radius:4px;background:#63756244;overflow:hidden}
.cue-pull-track i{display:block;height:100%;width:0;background:var(--pull-colour);border-radius:4px}
@media(max-width:520px){.cue-power-readout{bottom:7px;width:166px;padding:8px 11px}.cue-power-readout strong{font-size:18px}}


.online-hud-bar{display:inline-flex;align-items:center;gap:8px}
.room-pill-btn{display:inline-flex;align-items:center;gap:6px;background:#152622;border:1px solid #d9bc7a66;border-radius:20px;padding:4px 10px;font-size:11px;font-weight:700;color:var(--gold);cursor:pointer;transition:all .2s ease}
.room-pill-btn:hover{background:#233a34;border-color:var(--gold);box-shadow:0 0 10px #d9bc7a33}
.mp-dot{width:8px;height:8px;border-radius:50%;background:#38ef7d;box-shadow:0 0 8px #38ef7d;animation:snooker-pulse 1.6s infinite}
@keyframes snooker-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.25);opacity:.6}}
.online-clock-badge{display:inline-flex;align-items:center;justify-content:center;min-width:38px;padding:3px 8px;border-radius:12px;background:#1c2729;border:1px solid #d5e3df22;font-family:monospace;font-size:11px;font-weight:700;color:#cde2d6}
.online-clock-badge.urgent{background:#421719;border-color:#ff5a5f;color:#ff8e92;animation:snooker-pulse .8s infinite}

.snooker-reaction-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 6px 12px;border-top:1px solid var(--line)}
.reaction-label{font-size:8px;letter-spacing:.12em;color:#9eafa4;font-weight:700;margin-right:4px}
.reaction-emojis{display:flex;gap:4px}
.reaction-emoji-btn{background:#162422;border:1px solid #d5e3df18;border-radius:6px;padding:4px 6px;font-size:14px;cursor:pointer;line-height:1;transition:transform .15s ease,background .15s ease}
.reaction-emoji-btn:hover{background:#283e38;transform:scale(1.2)}
.reaction-chips{display:flex;gap:5px;flex-wrap:wrap}
.reaction-chip-btn{background:#162422;border:1px solid #d5e3df18;border-radius:12px;padding:3px 9px;font-size:10px;color:#c1d6c8;cursor:pointer;transition:all .15s ease}
.reaction-chip-btn:hover{background:#283e38;border-color:var(--gold);color:var(--gold)}

.snooker-rematch-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(90deg,#253a2f,#1a2d24);border:1px solid #d9bc7a77;border-radius:8px;padding:9px 14px;margin:8px 6px 12px;font-size:11px;color:#f1eedb}
.rematch-actions{display:flex;gap:6px}
.rematch-actions button{font-weight:700;padding:6px 12px}

.snooker-multiplayer-dialog{width:490px;max-width:96vw}
.snooker-mp-input{width:100%;background:#0d1819;border:1px solid #d5e3df33;border-radius:8px;padding:8px 12px;font-size:12px;color:#e6ede7;outline:none;transition:border-color .2s ease}
.snooker-mp-input:focus{border-color:var(--gold);box-shadow:0 0 0 2px #d9bc7a33}
.snooker-mp-tabs button{font-size:11px;font-weight:600;padding:8px}
.snooker-mp-tabs button.active{background:#3a5143;color:#eff6e9}
.snooker-mp-tab-pane.hidden{display:none}

.snooker-room-code-display{display:flex;flex-direction:column;align-items:center;gap:4px;background:#0d1716;border:1px dashed #d9bc7a66;border-radius:12px;padding:14px;margin:12px 0}
.snooker-code-label{font-size:9px;letter-spacing:.14em;color:#9eb4a6;font-weight:700}
.snooker-code-digits{font-family:monospace;font-size:36px;font-weight:800;letter-spacing:10px;color:var(--gold);text-shadow:0 0 12px #d9bc7a55}
.snooker-role-tag{font-size:9px;letter-spacing:.08em;color:var(--green)}

.snooker-qr-wrap{display:flex;flex-direction:column;align-items:center;gap:6px;background:#0c1618;border-radius:10px;padding:10px;margin:10px 0;border:1px solid #b5d7c90c}
#snooker-host-qr-canvas{background:#fff;border-radius:8px;padding:6px}
.snooker-qr-hint{font-size:10px;color:#859e8f}

.snooker-join-url-row{display:flex;gap:8px;margin-top:10px}
.snooker-join-url-row .url-input{font-family:monospace;font-size:10px;color:#9cb5a8}

.snooker-waiting-status{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;font-size:11px;color:var(--gold)}
.radar-dot{width:9px;height:9px;border-radius:50%;background:var(--gold);animation:snooker-pulse 1.4s infinite}

.snooker-join-form{display:flex;gap:8px;margin:14px 0}
.snooker-join-form .code-input{font-family:monospace;font-size:20px;letter-spacing:6px;text-align:center;font-weight:700;text-transform:uppercase}
.snooker-join-error{font-size:11px;color:#ff8e92;background:#441a1c;border:1px solid #ff5a5f55;border-radius:6px;padding:8px 12px;margin-top:8px}
.snooker-join-error.hidden{display:none}

.snooker-public-list{max-height:190px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;margin-top:6px}
.public-room-item{display:flex;justify-content:space-between;align-items:center;background:#152422;border:1px solid #d5e3df15;border-radius:8px;padding:8px 12px;font-size:11px;transition:background .15s ease}
.public-room-item:hover{background:#1d322e}
.public-room-item strong{color:var(--gold);font-family:monospace;font-size:12px;letter-spacing:1px}
.public-room-item .room-host{color:#e6ede7;font-weight:600}
.public-room-item .room-frames{color:#8ea798;font-size:10px}

.floating-reaction{position:absolute;pointer-events:none;z-index:25;animation:float-up-fade 2.4s ease-out forwards;font-weight:700;font-size:16px;text-shadow:0 2px 6px #000a}
@keyframes float-up-fade{0%{opacity:0;transform:translateY(0) scale(0.7)}15%{opacity:1;transform:translateY(-8px) scale(1.1)}80%{opacity:1;transform:translateY(-35px) scale(1)}100%{opacity:0;transform:translateY(-55px) scale(0.9)}}



.mobile-cue-rail{user-select:none;touch-action:none;background:linear-gradient(180deg,#182234 0%,#0d131f 100%);border:2px solid rgba(255,255,255,0.12);border-radius:16px;box-shadow:0 12px 32px rgba(0,0,0,0.65),inset 0 1px 2px rgba(255,255,255,0.1);padding:10px 4px;width:44px;min-width:44px;display:none;flex-direction:column;align-items:center;justify-content:space-between}.mobile-cue-title{font-size:9px;font-weight:800;letter-spacing:.14em;color:#9faec6}.mobile-cue-track{position:relative;flex:1;width:18px;margin:10px 0;background:#090e17;border-radius:9px;border:1px solid rgba(255,255,255,0.12);overflow:hidden;box-shadow:inset 0 2px 6px rgba(0,0,0,0.85)}.mobile-cue-fill{position:absolute;top:0;left:0;width:100%;height:45%;background:linear-gradient(180deg,#10b981 0%,#f59e0b 55%,#ef4444 100%);border-radius:9px;box-shadow:0 0 12px rgba(245,158,11,0.5);pointer-events:none}.mobile-cue-shaft{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:4px;height:calc(100% - 20px);border-radius:4px;background:linear-gradient(180deg,#fef3c7 0%,#c08457 55%,#7c4a24 100%);opacity:.75;pointer-events:none}.mobile-cue-handle{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);width:26px;height:26px;border-radius:999px;background:radial-gradient(circle at 35% 30%,#ffffff 0%,#cbd5e1 28%,#334155 100%);border:2px solid rgba(255,255,255,0.28);box-shadow:0 4px 12px rgba(0,0,0,0.55);pointer-events:none}.mobile-cue-rail strong{font-size:12px;color:var(--mint);font-weight:800;font-variant-numeric:tabular-nums}.mobile-cue-rail small{font-size:8px;letter-spacing:.1em;color:#9faec6}.mobile-cue-rail.is-dragging{border-color:rgba(120,241,209,0.55);box-shadow:0 12px 34px rgba(0,0,0,0.7),0 0 16px rgba(120,241,209,0.18)}


@media(max-width:900px){
  .table-interaction-row{gap:8px;align-items:stretch}
  .mobile-cue-rail{display:flex;min-height:300px;align-self:stretch}
  .control-strip .power-control,
  .control-strip #shoot-button,
  .control-strip .shot-help{display:none!important}
}

@media(max-width:520px){
  .table-interaction-row{gap:7px}
  .mobile-cue-rail{width:40px;min-width:40px;min-height:250px;padding:8px 3px}
  .mobile-cue-track{width:16px;margin:8px 0}
  .mobile-cue-handle{width:24px;height:24px}
}
