:root{--red:#e10600;--blue:#075acb;--black:#08090b;--panel:#12151a;--text:#f7f7f7;--muted:#aeb5bf}*{box-sizing:border-box}html,body{min-height:100%;color:var(--text);background:#0b0d10;margin:0;font-family:Arial,Helvetica,sans-serif}button,input{font:inherit}button{cursor:pointer}.landing,.setupPage,.controlPage{background:radial-gradient(circle at 20% 20%,#ffffff0f,#0000 35%),#0b0d10;place-items:center;min-height:100vh;padding:24px;display:grid}.card,.setupCard,.controlCard{background:#12151a;border:1px solid #2a2f37;border-radius:18px;width:min(760px,100%);padding:28px;box-shadow:0 20px 60px #00000059}.card h1,.setupCard h1,.controlCard h1{margin:4px 0 10px;font-size:clamp(32px,6vw,52px)}.card p{color:var(--muted);margin-bottom:24px;line-height:1.5}.eyebrow{letter-spacing:.18em;color:#9da6b2;font-size:12px;font-weight:900}.primaryButton,.secondaryButton,.urlBlock button,.quickGrid button{border:0;border-radius:10px;font-weight:900;text-decoration:none}.primaryButton{color:#08090b;background:#fff;justify-content:center;align-items:center;padding:14px 18px;display:inline-flex}.primaryButton.wide{width:100%;margin-top:18px}.secondaryButton{color:#fff;background:#282e37;padding:12px 14px}label{gap:7px;margin-top:16px;font-weight:800;display:grid}input{color:#fff;background:#0b0d10;border:1px solid #343b46;border-radius:10px;outline:none;width:100%;padding:14px}input:focus{border-color:#717d8d}.resultBox{border-top:1px solid #2b3038;margin-top:24px;padding-top:20px}.resultBox h2{margin:0 0 12px}.urlBlock{background:#0c0f13;border:1px solid #303640;border-radius:12px;gap:8px;margin:12px 0;padding:14px;display:grid}.urlBlock>div{gap:3px;display:grid}.urlBlock span{color:var(--muted);font-size:13px}.urlBlock code{overflow-wrap:anywhere;color:#e8edf4;font-size:12px;display:block}.urlBlock button{justify-self:start;padding:8px 12px}.errorBox{color:#ffd9d9;background:#2b1111;border:1px solid #8b3131;border-radius:10px;margin-top:16px;padding:12px}.matchId{color:var(--muted);overflow-wrap:anywhere;font-size:11px}.controlPage{padding:0;display:block}.controlCard{border:0;border-radius:0;width:100%;min-height:100vh;padding:18px 14px 24px}.controlCard h1{margin-bottom:3px;font-size:32px}.controlHeader{justify-content:space-between;align-items:center;gap:12px;display:flex}.copyOverlayButton{color:#fff;background:#20252c;border:1px solid #4a535f;border-radius:10px;flex:none;padding:10px 12px;font-size:12px;font-weight:900}.nameEditor{background:#0d1014;border:1px solid #2b3139;border-radius:14px;margin-top:22px;padding:16px}.nameEditor summary{cursor:pointer;font-weight:900}.nameEditor .secondaryButton{width:100%;margin-top:14px}.currentState{text-align:center;overflow-wrap:anywhere;margin:26px 0 16px;font-size:clamp(27px,8vw,52px);font-weight:1000}.scoreControls{grid-template-columns:1fr 72px 1fr;gap:10px;display:grid}.teamButton,.squareButton{color:#fff;border:0;border-radius:14px;min-height:105px;font-weight:1000;box-shadow:inset 0 0 0 1px #ffffff26}.teamButton{align-content:center;place-items:center;gap:7px;padding:12px;font-size:22px;display:grid}.teamButton small{white-space:nowrap;text-overflow:ellipsis;opacity:.9;max-width:100%;font-size:12px;overflow:hidden}.teamButton.red{background:var(--red)}.teamButton.blue{background:var(--blue)}.squareButton{background:#2a3038;font-size:22px}.quickSet{margin-top:22px}.quickTitle{letter-spacing:.12em;color:var(--muted);text-transform:uppercase;margin-bottom:8px;font-size:12px;font-weight:900}.quickGrid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.quickGrid button{color:#fff;background:#242a32;min-height:44px}.quickTeamLabel{text-overflow:ellipsis;white-space:nowrap;margin:14px 0 7px;font-size:14px;font-weight:900;overflow:hidden}.redText{color:#ff554f}.blueText{color:#5b9eff}.quickSquareButton{color:#fff;background:#343b45;border:1px solid #596371;border-radius:10px;width:100%;min-height:48px;margin-top:10px;font-weight:1000}.controlHelp{color:var(--muted);margin:18px 0 0;font-size:14px;line-height:1.45}@media (min-width:640px){.controlPage{padding:24px;display:grid}.controlCard{border:1px solid #2a2f37;border-radius:18px;width:min(760px,100%);min-height:auto;padding:28px}.controlCard h1{font-size:44px}.scoreControls{grid-template-columns:1fr 100px 1fr}.quickGrid{grid-template-columns:repeat(6,1fr)}}.overlayCanvas{width:100vw;height:100vh;margin:0;padding:10px;overflow:hidden;background:0 0!important}.overlayCanvas,.overlayCanvas *{-webkit-user-select:none;user-select:none}.scoreboard{background:#07080a;border:2px solid #ffffffe6;border-radius:12px;width:min(760px,100vw - 20px);overflow:hidden;box-shadow:0 3px 10px #000000a6}.scoreRow{background:linear-gradient(#14171a 0%,#070809 100%);grid-template-columns:14px minmax(0,1fr) 186px;height:72px;display:grid}.scoreRow+.scoreRow{border-top:2px solid #ffffffe6}.colorStripe.redStripe{background:var(--red)}.colorStripe.blueStripe{background:var(--blue)}.teamName{letter-spacing:-.02em;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 2px 2px #000;align-items:center;min-width:0;padding:0 18px;font-size:32px;font-weight:1000;display:flex;overflow:hidden}.scoreBox{text-shadow:0 2px 2px #0000008c;border-left:2px solid #ffffffe6;justify-content:center;align-items:center;gap:12px;font-weight:1000;display:flex}.redBox{background:var(--red)}.blueBox{background:var(--blue)}.scoreNumber{font-size:38px;line-height:1}.scoreArrow{font-size:34px;line-height:1;transform:translateY(-1px)}@media (max-width:650px){.scoreControls{grid-template-columns:1fr 84px 1fr}.teamButton{font-size:18px}.quickGrid{grid-template-columns:repeat(2,1fr)}}body:has(.overlayCanvas){background:0 0!important}
