:root{color-scheme:dark;--green:#17e99e;--panel:#0d2029;--line:#1c3e46;--muted:#9cb2bc}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#123a36,transparent 55%),#051019;color:#f5f9fc;font:15px system-ui,sans-serif}.remote{width:min(900px,100%);margin:auto;padding:22px 18px 40px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.brand{font-weight:950;letter-spacing:2px;font-size:28px;text-decoration:none;color:white}.brand span{color:var(--green)}header small{display:block;font-size:10px;letter-spacing:2px;color:var(--muted);margin-top:3px}button{font:700 13px system-ui;cursor:pointer;padding:13px 10px;min-height:46px;border-radius:11px;border:1px solid #36515e;background:#152d3a;color:#f3f9fa;touch-action:manipulation}button:hover{border-color:var(--green)}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible{outline:3px solid var(--green);outline-offset:2px}.primary{background:#087452;border-color:#20b984}.quiet{background:transparent}.connection{padding:10px 14px;background:#0b2425;border:1px solid var(--line);color:var(--green);border-radius:10px;font-size:12px;font-weight:700}.connection.offline{color:#ffd378;background:#33260e}#error{color:#ffb4b4;margin:8px 0;min-height:20px}.match{display:grid;grid-template-columns:1fr 1fr;gap:14px}.player,.clock-card{background:linear-gradient(145deg,#102a33,#0a1923);border:1px solid var(--line);border-radius:18px;padding:18px}.player.active{border-color:var(--green);box-shadow:inset 0 3px 0 var(--green)}.select{display:block;border:0;background:transparent;padding:0;min-height:74px;width:100%;text-align:left}.select small{display:block;color:var(--muted);font-size:10px;letter-spacing:1px}.select strong{display:block;font-size:19px;line-height:1.2;margin:7px 0;overflow-wrap:anywhere}.select span{font-size:11px;color:var(--green);min-height:14px;display:block}.score{text-align:center;font-size:62px;font-weight:900;line-height:1.3}.buttons,.colors,.sets{display:flex;gap:8px;margin:9px 0}.buttons>*,.colors>*,.sets>button{flex:1;min-width:0}.colors button{display:flex;align-items:center;justify-content:center;gap:7px;font-size:12px}.ball{display:inline-block;flex:none;width:15px;height:15px;border-radius:50%;box-shadow:inset -3px -3px 5px #0005,0 0 0 1px #ffffff30}.red{background:radial-gradient(circle at 30% 25%,#ffb5b5,#f53345 45%)}.yellow{background:radial-gradient(circle at 30% 25%,#fff6bb,#ffc933 45%)}.player p{font-size:12px;color:var(--muted);margin:8px 0}.sets{align-items:center;justify-content:center;border-top:1px solid var(--line);padding-top:9px}.sets button{font-size:11px;padding:8px;min-height:36px}.sets span{font-size:12px;white-space:nowrap}.clock-card{margin-top:16px}h2{font-size:16px;margin:0 0 10px}.clock-head{display:flex;justify-content:space-between;gap:10px}.clock-head>span{color:var(--green);font-size:12px}.timer{text-align:center;font-size:74px;font-variant-numeric:tabular-nums;font-weight:900;line-height:1.2;color:#e7fff4}.timer.warning{color:#ffc746}.timer.expired{color:#ff5e6f}.match-timer{font-size:49px}.clock-card>p{text-align:center;color:var(--muted);font-size:12px;min-height:15px}.extension,.gold{background:#3a2f13;border-color:#796425;color:#ffe198}.danger{background:#3a1c29;border-color:#72424a}.wide{width:100%;margin-top:5px}.hint,footer{font-size:12px;color:var(--muted);line-height:1.5}footer{padding-top:20px;text-align:center}dialog{width:min(540px,94vw);max-height:92vh;background:#0b202b;color:white;border:1px solid #225649;border-radius:18px;padding:24px}dialog::backdrop{background:#000a}form label{display:block;margin:12px 0;font-size:13px;color:#c1d5dc}input:not([type=checkbox]),select{width:100%;font:16px system-ui;padding:10px;margin-top:5px;border:1px solid #41616a;border-radius:8px;background:#07151c;color:white}input[type=checkbox]{accent-color:var(--green)}@media(max-width:500px){.remote{padding:14px 9px}.match{gap:8px}.player{padding:12px 8px}.select strong{font-size:15px}.select{min-height:85px}.buttons{gap:5px}button{font-size:11px;padding:10px 6px}.colors{gap:4px}.colors button{font-size:10px;gap:4px}.sets{gap:5px}.score{font-size:51px}.clock-card{padding:16px 12px}}

/* V99: local sound controls are visible on desktop as well. */
body:not(.ref-mobile) .rm-sound{padding:16px;margin:12px 0;border:1px solid #b7ff0060;border-radius:12px;background:#121a13}body:not(.ref-mobile) .rm-sound-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}body:not(.ref-mobile) .rm-sound button{padding:10px 16px;min-height:44px}body:not(.ref-mobile) #rmSoundToggle{color:#b7ff00}body:not(.ref-mobile) .rm-sound p{font-size:13px;color:#becbbf}body:not(.ref-mobile) .rm-sound-engine{display:block;margin-top:12px}
