:root{color:#f5f0df;font-synthesis:none;--ink:#191b2b;--paper:#f5f0df;--muted:#b5b5c6;--accent:#ff785f;--gold:#ffd46a;--line:#3b3d51;--pixel:"Press Start 2P", monospace;background:#191b2b;font-family:Space Grotesk,sans-serif}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button,a{color:inherit}button{cursor:pointer;border:0;border-radius:0}button:disabled{cursor:not-allowed;opacity:.42}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:5px}a{text-underline-offset:4px}svg{display:block}h1,h2,h3,p{margin-top:0}p{line-height:1.6}h1,h2,h3{line-height:1.1}input{width:100%;min-width:0;color:var(--paper);background:#242638;border:1px solid #5a5c70;border-radius:0;padding:13px 14px}input:disabled{opacity:.5}input[type=range]{accent-color:var(--accent);padding:16px 0}label{letter-spacing:1.7px;margin:16px 0 8px;font-size:10px;font-weight:700;display:block}form .button{margin-top:18px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.eyebrow{letter-spacing:2px;color:var(--muted);margin-bottom:18px;font-size:10px;font-weight:700}.eyebrow>span{color:var(--accent);margin-right:10px}.muted,.fine{color:var(--muted)}.fine{font-size:12px;line-height:1.7}.button{letter-spacing:.5px;justify-content:center;align-items:center;gap:20px;min-height:54px;padding:17px 24px;font-size:13px;font-weight:700;text-decoration:none;transition:transform .12s,background .12s;display:flex}.button>span{margin-left:auto;font-size:24px;line-height:.8}.primary{background:var(--accent);color:var(--ink);box-shadow:4px 4px #7c403e}.primary:hover:not(:disabled){background:#ff9279;transform:translateY(-2px)}.secondary{background:var(--paper);color:var(--ink);box-shadow:4px 4px #69697a}.quiet{background:0 0;border:1px solid #656678}.text-button{background:0 0;border:0;padding:10px 0;font-size:13px;font-weight:600;text-decoration:none;display:inline-block}.text-button:hover{text-decoration:underline}.brand{white-space:nowrap;font-family:var(--pixel);letter-spacing:-.8px;align-items:center;gap:9px;font-size:14px;text-decoration:none;display:inline-flex}.brand svg{width:31px;height:31px;color:var(--accent)}.brand>span{color:var(--accent)}.brand i{color:var(--gold);margin-left:1px;font:16px Space Grotesk}.site-header{border-bottom:1px solid var(--line);flex-shrink:0;justify-content:space-between;align-items:center;gap:20px;width:100%;max-width:1440px;height:90px;margin:0 auto;padding:0 48px;display:flex}.header-tag{letter-spacing:2px;color:var(--muted);font-size:10px}.landing{flex-direction:column;min-height:100dvh;display:flex}.landing-main{grid-template-columns:1.2fr 1fr;gap:60px;width:min(100%,1440px);margin:auto;padding:64px 48px 40px;display:grid}.landing-copy h1{letter-spacing:-5px;margin:28px 0;font-size:clamp(48px,5.7vw,86px);font-weight:700;line-height:1.01}.landing-copy h1 em{color:var(--accent);font-style:normal}.lead{color:#c6c5cf;margin-bottom:32px;font-size:17px;line-height:1.8}.landing-copy .primary{width:100%;min-width:285px;max-width:360px}.landing-copy .fine{margin-top:20px}.resume{color:var(--gold);font-size:12px}.landing-visual{border:1px solid var(--line);background-color:#212334;background-image:linear-gradient(#ffffff04 1px,#0000 1px),linear-gradient(90deg,#ffffff04 1px,#0000 1px);background-size:24px 24px;flex-direction:column;justify-content:space-between;min-height:390px;padding:25px 30px;display:flex;position:relative;box-shadow:8px 8px #111321}.landing-visual .buzzer-art{filter:drop-shadow(0 18px #12132066);width:min(90%,360px);margin:auto;transform:rotate(-6deg)}.art-label{font-family:var(--pixel);color:var(--muted);font-size:9px;line-height:2}.art-label span{color:var(--gold)}.visual-caption{letter-spacing:1.3px;color:var(--muted);justify-content:space-between;align-items:center;gap:14px;font-size:8px;display:flex}.visual-caption b{color:var(--gold);white-space:nowrap}.how-to{border-top:1px solid var(--line);grid-column:1/-1;grid-template-columns:repeat(3,1fr);gap:48px;padding-top:30px;display:grid}.how-to>div{padding-left:42px;position:relative}.how-to>div>span{color:var(--accent);font-family:var(--pixel);font-size:11px;position:absolute;top:3px;left:0}.how-to h2{margin-bottom:9px;font-size:19px}.how-to p{color:var(--muted);margin:0;font-size:13px}.site-footer{border-top:1px solid var(--line);letter-spacing:1.5px;color:var(--muted);justify-content:space-between;gap:20px;padding:22px 48px;font-size:9px;display:flex}.buzzer-art{width:200px}.error-message{color:#ffc1ae;background:#ff785f12;border:1px solid #ff785f70;margin:20px 0;padding:14px 16px;font-size:13px;line-height:1.5}.notice{border-left:3px solid var(--gold);color:#e3d9b7;background:#ffd46a0c;padding:12px 16px;font-size:12px}.state-page{text-align:center;max-width:580px;margin:60px auto;padding:24px}.state-page>.brand{margin-bottom:30px}.state-page .buzzer-art{margin:0 auto 20px}.state-page h1{font-size:34px}.state-page .button{margin-top:25px}.phone{max-width:480px;margin:0 auto;padding:32px 24px 40px}.phone-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:18px 24px;display:flex}.phone-header>.brand{font-size:12px}.phone-header>span{letter-spacing:2px;color:var(--muted);font-size:9px}.phone-heading{justify-content:space-between;align-items:center;gap:15px;margin-bottom:25px;display:flex}.phone-heading .eyebrow{letter-spacing:1.3px;margin:0;font-size:8px}.connection{letter-spacing:1px;color:var(--muted);white-space:nowrap;align-items:center;gap:6px;font-size:8px;display:inline-flex}.status-dot{background:#ff785f;border-radius:50%;flex-shrink:0;width:7px;height:7px;display:inline-block}.status-dot.online{background:#7ae4bf}.join-phone{text-align:center;padding-top:24px}.join-phone>.buzzer-art{width:130px;margin:0 auto 18px}.join-phone h1{letter-spacing:-1.5px;margin-bottom:16px;font-size:38px}.join-phone form{text-align:left;margin-top:28px}.join-phone form>.button{width:100%}.join-phone #room-code{font-family:var(--pixel);text-align:center;letter-spacing:8px;padding:20px;font-size:22px}.host-link{margin-top:28px;font-size:12px;display:block}.team-choices{flex-direction:column;gap:12px;margin-top:28px;display:flex}.team-choice{text-align:left;border:1px solid var(--line);color:var(--paper);background:#292b3d;align-items:center;gap:15px;padding:16px;display:flex}.team-choice>span:nth-child(2){overflow-wrap:anywhere;flex:1;font-weight:600}.team-choice small{color:var(--muted);letter-spacing:1.3px;margin-top:6px;font-size:8px;display:block}.team-mark{color:var(--team);background:color-mix(in srgb, var(--team) 12%, transparent);border:2px solid var(--team);flex-shrink:0;justify-content:center;align-items:center;width:95px;height:95px;font-size:55px;line-height:1;display:inline-flex;box-shadow:6px 6px #10121f}.team-mark.small{border-width:1px;width:38px;height:38px;font-size:22px;box-shadow:3px 3px #10121f}.display-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:24px;padding:20px 32px;display:flex}.display-room{color:var(--muted);letter-spacing:1px;align-items:center;gap:10px;font-size:10px;display:flex}.display-room b{color:var(--paper);letter-spacing:3px;font-size:14px}.display-tools{align-items:center;gap:15px;display:flex}.display-tools button{letter-spacing:.5px;background:0 0;padding:8px 0;font-size:9px;font-weight:600}.display-tools button[aria-label=Display\ settings],.display-tools button[aria-label=Toggle\ fullscreen]{padding:2px;font-size:20px}.display-main{grid-template-columns:minmax(0,1fr) 300px;gap:28px;max-width:1600px;margin:0 auto;padding:28px 32px;display:grid}.stage-column{min-width:0}.stage-top{justify-content:space-between;align-items:center;gap:10px;margin-bottom:18px;display:flex}.stage-top p{margin:0}.stage-top>span{letter-spacing:2px;color:var(--muted);font-size:9px}.answer-stage{text-align:center;border:1px solid var(--line);background-color:#212334;background-image:linear-gradient(#ffffff03 1px,#0000 1px),linear-gradient(90deg,#ffffff03 1px,#0000 1px);background-position:0 0;background-repeat:repeat;background-size:24px 24px;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;flex-direction:column;justify-content:center;align-items:center;min-height:380px;padding:24px;display:flex;position:relative;overflow:hidden}.answer-stage:after{content:"";border:2px solid var(--gold);width:10px;height:10px;position:absolute;top:20px;right:20px;box-shadow:-3px -3px #191b2b}.stage-status{font-family:var(--pixel);letter-spacing:1px;color:var(--muted);margin:0 0 24px;font-size:9px;line-height:1.8}.stage-status.is-open{color:var(--gold)}.answer-stage .buzzer-art{width:120px;margin-top:-10px;margin-bottom:5px}.answer-stage h1{letter-spacing:-2px;white-space:pre-line;overflow-wrap:anywhere;max-width:100%;margin:12px 0;font-size:clamp(30px,4.1vw,68px)}.answer-stage>p:last-child{color:var(--muted);margin:0;font-size:13px}.has-answer{border-color:var(--team);box-shadow:inset 0 -6px 0 var(--team)}.has-answer h1{color:var(--team);margin:30px 0 15px}.has-answer .team-mark{animation:.25s steps(4,end) pop-in}.roster-heading{color:var(--muted);letter-spacing:1.5px;justify-content:space-between;gap:10px;margin:25px 0 12px;font-size:8px;display:flex}.display-roster{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.roster-card{border:1px solid var(--line);align-items:center;gap:10px;min-width:0;padding:12px 10px;display:flex}.roster-card.active{background:#f5f0df0a}.roster-card>div{min-width:0}.roster-card strong{overflow-wrap:anywhere;font-size:12px;line-height:1.3;display:block}.roster-card small{color:var(--muted);letter-spacing:.8px;margin-top:6px;font-size:7px;display:block}.roster-card .team-mark.small{width:28px;height:28px;font-size:17px}.display-sidebar{flex-direction:column;gap:20px;display:flex}.pairing-compact{border:1px solid var(--line);color:var(--muted);background:0 0;justify-content:space-between;align-items:center;gap:12px;padding:18px;font-size:10px;display:flex}.pairing-compact b{color:var(--gold);letter-spacing:2px;margin-left:6px}.queue-panel{border:1px solid var(--line);background:#202233;padding:20px}.panel-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:14px;display:flex}.panel-heading h2{font-family:var(--pixel);margin:0;font-size:9px;line-height:1.8}.panel-heading>span{color:var(--gold);font-size:11px}.queue-list{margin:0;padding:0;list-style:none}.queue-list li{overflow-wrap:anywhere;border-bottom:1px solid #3b3d5170;align-items:center;gap:12px;padding:10px 0;font-size:13px;display:flex}.queue-list .team-mark.small{width:27px;height:27px;font-size:16px}.queue-position{color:var(--muted);font-family:var(--pixel);min-width:12px;font-size:8px}.queue-empty{color:var(--muted);margin:0;padding:14px 0;font-size:13px}.queue-note{color:var(--muted);margin:14px 0 0;font-size:10px;line-height:1.6}.pairing-panel{border:1px solid var(--line);text-align:center;padding:20px}.pairing-panel .eyebrow{margin-bottom:16px;font-size:8px;line-height:1.8}.qr-wrap{background:#f6f2e6;width:fit-content;margin:0 auto;padding:8px;box-shadow:5px 5px #10121f}.pair-instruction{margin:16px 0 6px;font-size:12px;font-weight:600}.pair-alternative{color:var(--muted);overflow-wrap:anywhere;margin:0;font-size:10px}.pair-alternative b{font-weight:400;display:block}.room-code{font-family:var(--pixel);letter-spacing:4px;color:var(--gold);margin:14px 0 0;font-size:17px}.host-requests{background:#ffd46a0b;border:1px solid #ffd46a60;padding:20px}.host-requests h2{letter-spacing:1.5px;margin-bottom:20px;font-size:10px}.host-requests strong{overflow-wrap:anywhere;font-size:20px}.host-requests p{color:var(--muted);margin:8px 0 16px;font-size:11px}.host-requests>div+div{margin-top:25px}.inline-actions{gap:10px;display:flex}.inline-actions .button{flex:1;min-height:40px;padding:10px 14px;font-size:11px}.connection-banner{color:#ead29c;background:#ffd46a15;margin:0;padding:10px 32px;font-size:12px}.display-page>.error-message{margin:0 32px 25px}.modal{color:var(--paper);background:#242638;border:1px solid #64657a;width:calc(100% - 40px);max-width:480px;max-height:85dvh;padding:36px;overflow-y:auto;box-shadow:8px 8px #10121f}.modal::backdrop{background:#10121fd9}.modal-close{color:var(--muted);background:0 0;font-size:28px;position:absolute;top:12px;right:16px}.modal h2{overflow-wrap:anywhere;padding-right:10px;font-size:26px}.modal h3{margin:24px 0 10px;font-size:17px}.modal p{color:var(--muted);font-size:13px}.modal .pairing-panel{border:0;padding:20px 0}.modal .button{width:100%}.waiting-host{text-align:center}.waiting-host>.buzzer-art{margin:15px auto 30px}.waiting-host h1{font-size:32px}.waiting-host p{color:var(--muted)}.host-phone{max-width:620px}.host-answer{text-align:center;border:1px solid var(--line);background:#212334;margin-bottom:25px;padding:25px 20px}.host-answer h1{letter-spacing:-1px;overflow-wrap:anywhere;margin:18px 0 4px;font-size:30px}.host-answer .team-mark{width:60px;height:60px;font-size:34px}.host-answer .eyebrow{margin-bottom:12px;font-size:9px;line-height:1.8}.host-controls{grid-template-columns:1fr 1fr;gap:12px;display:grid}.host-controls .primary{grid-column:1/-1}.host-controls .button{padding:18px 16px}.host-phone>.fine{text-align:center;margin:22px 0}.host-phone .queue-panel{margin-bottom:25px}.team-management{border-top:1px solid var(--line);padding-top:20px}.team-management>summary{cursor:pointer;padding:4px 0 14px;font-size:17px;font-weight:600}.team-management>summary>span{float:right;color:var(--muted);font-size:12px}.team-editor{border-bottom:1px solid var(--line);grid-template-columns:38px minmax(0,1fr);gap:10px 14px;padding:18px 0;display:grid}.team-editor form{gap:10px;display:flex}.team-editor input{padding:9px 10px;font-size:14px}.team-editor form>button{background:#393b50;padding:10px;font-size:11px}.team-connection{color:var(--muted);grid-column:2;font-size:10px}.team-edit-actions{grid-column:2;gap:22px;display:flex}.team-edit-actions>button{text-underline-offset:3px;color:var(--muted);background:0 0;padding:6px 0;font-size:10px;text-decoration:underline}.add-team>div{gap:12px;display:flex}.add-team .button{white-space:nowrap;min-height:44px;margin:0;padding:12px;font-size:11px}.team-identity{justify-content:center;align-items:center;gap:14px;margin-top:36px;display:flex}.team-identity h1{letter-spacing:-1px;overflow-wrap:anywhere;min-width:0;margin:0;font-size:32px}.team-state{text-align:center;font-family:var(--pixel);color:var(--muted);margin:25px 0;font-size:10px;line-height:2}.team-state.your-turn{color:var(--team)}.big-buzzer{aspect-ratio:1.08;background:var(--team);width:min(100%,320px);color:var(--ink);box-shadow:0 12px 0 color-mix(in srgb, var(--team) 45%, #10121f), 0 22px 0 #111321;clip-path:polygon(12% 0,88% 0,88% 4%,96% 4%,96% 12%,100% 12%,100% 88%,96% 88%,96% 96%,88% 96%,88% 100%,12% 100%,12% 96%,4% 96%,4% 88%,0 88%,0 12%,4% 12%,4% 4%,12% 4%);-webkit-user-select:none;user-select:none;border:8px solid #ffffff24;flex-direction:column;justify-content:center;align-items:center;margin:0 auto;transition:transform .1s,filter .1s;display:flex}.big-buzzer>span{font-family:var(--pixel);white-space:pre-line;letter-spacing:-2px;font-size:35px;line-height:1.65}.big-buzzer>small{letter-spacing:2px;margin-top:16px;font-size:9px;font-weight:700}.big-buzzer:not(:disabled):active{filter:brightness(.9);transform:translateY(6px)}.big-buzzer:disabled{opacity:.28}.big-buzzer.winner{opacity:1;animation:.2s steps(3,end) pop-in}.buzzer-hint{text-align:center;color:var(--muted);max-width:330px;margin:30px auto 0;font-size:13px;line-height:1.8}.team-footer{border-top:1px solid var(--line);text-align:center;color:var(--muted);letter-spacing:1.3px;margin-top:36px;padding-top:24px;font-size:8px}.phone-sound{color:var(--muted);flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:22px;font-size:11px;display:flex}.phone-sound button{font-size:inherit;text-underline-offset:3px;background:0 0;padding:8px;text-decoration:underline}@keyframes pop-in{0%{transform:scale(.9)}to{transform:scale(1)}}@media (width>=1500px){.display-main{padding-top:35px}.answer-stage{min-height:460px}.roster-card{padding:18px 12px}.roster-card strong{font-size:15px}}@media (width<=1100px){.display-header{flex-wrap:wrap;gap:12px;padding:15px 24px}.display-tools{margin-left:auto}.display-main{grid-template-columns:minmax(0,1fr) 260px;gap:20px;padding:22px 24px}.display-roster{grid-template-columns:repeat(2,minmax(0,1fr))}.answer-stage{min-height:340px}.landing-main{gap:40px;padding:44px 32px}.landing-copy h1{letter-spacing:-3px}.site-header{padding:0 32px}.header-tag{display:none}.how-to{gap:25px}.display-sidebar .qr-wrap svg{width:120px;height:120px}}@media (width<=760px){.landing-main{flex-direction:column;gap:38px;padding:38px 24px;display:flex}.landing-copy h1{letter-spacing:-2.5px;font-size:clamp(43px,8vw,64px)}.landing-visual{min-height:310px;padding:20px}.landing-visual .buzzer-art{width:240px}.how-to{grid-template-columns:1fr;gap:26px}.site-header{height:75px;padding:0 24px}.brand{font-size:12px}.brand svg{width:27px}.site-footer{flex-direction:column;gap:12px;padding:22px 24px;font-size:8px}.display-main{grid-template-columns:1fr;padding:20px}.display-sidebar{grid-template-columns:1fr 1fr;display:grid}.display-roster{grid-template-columns:repeat(4,minmax(0,1fr))}.roster-card{text-align:center;flex-direction:column;padding:12px 6px}.display-room .connection{display:none}.display-tools{justify-content:space-between;width:100%}.display-header{padding:15px 20px}.display-header .brand{font-size:11px}.display-header .brand svg{width:24px}.display-room{margin-left:auto}.display-room b{font-size:12px}.answer-stage{min-height:360px}.answer-stage h1{font-size:40px}.pairing-panel{padding:18px 10px}.display-sidebar .queue-panel{padding:18px 12px}.host-requests,.display-sidebar>.pairing-panel:only-child{grid-column:1/-1}.phone-heading{gap:8px}.phone-heading .eyebrow,.connection{font-size:7px}}@media (width<=380px){.phone{padding:25px 18px}.site-header{padding:0 18px}.brand{font-size:10px}.brand svg{width:24px}.display-sidebar{grid-template-columns:1fr}.display-sidebar .host-requests{grid-column:auto}.display-roster{grid-template-columns:repeat(2,minmax(0,1fr))}.host-controls .button{font-size:12px}.team-identity h1{font-size:26px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
