@font-face{font-family:Space;src:url('./fonts/body.woff2') format('woff2');font-weight:400 700;font-display:swap}
@font-face{font-family:Barlow;src:url('./fonts/display.woff2') format('woff2');font-weight:800;font-display:swap}
:root{color-scheme:dark;--bg:#0b1214;--panel:#131e20;--line:#283638;--text:#f2f2e9;--muted:#94a4a2;--mint:#bff5cd;--gold:#e7c693;--coral:#ff896b;font-family:Space,system-ui,sans-serif;font-size:14px}
*{box-sizing:border-box}body{margin:0;color:var(--text);background:var(--bg);overflow-x:hidden}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit;touch-action:manipulation}button:disabled{cursor:not-allowed;opacity:.35}button,a,input{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--mint);outline-offset:4px}[hidden]{display:none!important}svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 70% 0%,#3b5d4326,transparent 55%),radial-gradient(ellipse at 0% 70%,#26414b22,transparent 50%)}
.app-layout{position:relative;max-width:1600px;margin:auto;padding:0 40px}.site-header{height:70px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ceddd115;gap:16px}.brand{display:flex;align-items:center;gap:9px;font-size:20px;font-weight:700;letter-spacing:-1px}.brand-light{font-weight:400;color:var(--mint)}.brand small{font-size:8px;letter-spacing:1.7px;color:var(--muted);font-weight:500;border-left:1px solid var(--line);padding:8px 0 8px 18px;margin-left:12px}.header-stamp{font-size:8px;letter-spacing:1.4px;color:#a9b9b2;display:flex;align-items:center;gap:7px}.mini-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--mint);flex-shrink:0}
.intro{min-height:176px;position:relative;display:flex;align-items:center;isolation:isolate;padding:25px 0 29px}.intro-copy{z-index:2}.eyebrow{font-size:9px;letter-spacing:1.7px;line-height:1.5;font-weight:600;color:var(--muted);margin:0 0 10px}.intro .eyebrow{color:#a9bdb4;font-size:8px;letter-spacing:1.8px}.edition{display:inline-block;margin-right:9px;padding:2px 5px;border:1px solid #667d7066;border-radius:3px;color:var(--mint);font-size:8px;letter-spacing:0}h1{font-family:Barlow,Impact,sans-serif;font-weight:800;font-size:96px;letter-spacing:-1px;line-height:.86;margin:0 0 14px;position:relative}h1 span{color:var(--mint)}h1 i{font:14px Space,system-ui;vertical-align:top;margin:7px 0 0 6px;display:inline-block;color:var(--muted)}.tagline{font-size:11px;color:#a4b5af;margin:0}.tagline strong{color:var(--text);font-weight:500}.hero-art{position:absolute;width:550px;height:275px;object-fit:contain;right:80px;top:-37px;z-index:-1;pointer-events:none;filter:drop-shadow(0 15px 18px #0004)}.intro-seal{position:absolute;right:4px;top:48px;border-left:1px solid #b7d0ba33;padding-left:16px;transform:rotate(4deg);color:var(--gold)}.intro-seal>span{font-size:7px;letter-spacing:1.5px}.intro-seal strong{display:block;font:800 30px/.95 Barlow,sans-serif;margin:7px 0}
.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:20px;align-items:start}.game-stage{min-width:0;background:none;border:0;border-radius:0;overflow:visible;box-shadow:none}
.board-viewport{height:clamp(420px,52vh,610px);position:relative;isolation:isolate;overflow:visible;background:none}.board-viewport:focus{outline:none}.arena-orbit{position:absolute;border:1px solid #8faf8e0c;border-radius:50%;width:580px;height:580px;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}.orbit-two{width:760px;height:760px;border-style:dashed;opacity:.7}.board-scroll{position:absolute;inset:0;z-index:2;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#91b6a0 #14201f;overscroll-behavior-x:contain}.board-renderer{position:relative;height:100%;min-width:100%}.board-renderer canvas{display:block;outline:none}.board-scroll:focus-visible{outline-offset:-3px}.arena-label{position:absolute;inset:14px 17px auto;display:flex;justify-content:space-between;color:#658477;font-size:6px;letter-spacing:1.5px;pointer-events:none}.board-caption{position:absolute;bottom:17px;left:0;right:0;z-index:3;display:flex;align-items:center;justify-content:center;gap:12px;color:#729589;font-size:6px;letter-spacing:1.7px;pointer-events:none}.caption-rule{width:30px;height:1px;background:#638c7544}
kbd{font:7px Space,system-ui;border:1px solid #77908155;border-radius:3px;padding:2px 5px;letter-spacing:.5px;color:#a4baac}
.control-sidebar{display:flex;flex-direction:column;gap:15px;min-width:0}.launch-card{position:relative;background:radial-gradient(ellipse at 100% 0%,#bff5cd19,transparent 70%),linear-gradient(135deg,#233831,#192822);border:1px solid #61755c77;border-radius:16px;padding:20px;box-shadow:0 1px 0 #ecffe51a inset;overflow:hidden}.launch-heading{display:flex;justify-content:space-between;align-items:center;gap:6px}.launch-heading .eyebrow{font-size:7px;letter-spacing:1.35px;margin:0;color:#a7bca5}.launch-heading svg{color:var(--mint);width:22px;height:22px}.launch-card h2{font:800 61px/.83 Barlow,Impact,sans-serif;letter-spacing:-.4px;margin:16px 0 17px;color:#e2e8d9}.launch-card h2 span{color:var(--mint)}.button{border:0;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:11px;font-weight:600;padding:12px 16px;border-radius:7px;transition:background .18s,transform .18s,box-shadow .18s}.button:not(:disabled):active{transform:translateY(1px)}.button-primary{background:var(--mint);color:#14271a;box-shadow:0 3px 0 #6c9875,0 6px 22px #bff5cd0a}.button-primary:hover:not(:disabled){background:#d5ffdf;box-shadow:0 3px 0 #82b08c,0 8px 30px #bff5cd20}.start-button{width:100%;height:46px;justify-content:space-between;font-size:12px}.start-button svg{width:21px;height:21px}.button-subtle{background:#07181130;border:1px solid #62765f66;color:#c2d3c0;font-size:10px}.button-subtle:hover:not(:disabled){background:#9ebba21a}.secondary-controls{display:flex;gap:8px;margin-top:12px}.secondary-controls button{flex:1;padding:9px}.secondary-controls svg{width:13px;height:13px}.launch-hint{font-size:7px;text-align:center;color:#a2b69e;margin:11px 0 0;line-height:1.5;min-height:11px}.playback-tools{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;margin-top:16px;padding-top:12px;border-top:1px solid #bff5cd1a}.icon-button{background:none;border:0;padding:0;display:inline-flex;gap:7px;align-items:center;font-size:9px;color:#a9b9aa;white-space:nowrap}.icon-button:hover{color:var(--mint)}.icon-button[aria-pressed=true]{color:var(--mint)}.icon-button svg{width:15px;height:15px}.volume-control{grid-column:1/-1}.volume-control input{display:block;width:100%;height:3px;accent-color:var(--mint);margin:2px 0 0;cursor:pointer}
.roster-card{min-width:0;background:linear-gradient(160deg,#182322,#121d1f);border:1px solid #34453e;border-radius:16px;overflow:hidden}.card-heading{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 14px}.card-heading .eyebrow{font-size:7px;letter-spacing:1.4px;color:#7e9a8b;margin:0 0 6px}.card-heading h2{font-size:20px;font-weight:500;letter-spacing:-.7px;margin:0}.card-heading h2>span{display:inline-grid;place-items:center;min-width:23px;height:21px;font-size:9px;color:var(--mint);background:#bff5cd0c;border:1px solid #bff5cd22;border-radius:5px;vertical-align:middle;margin-left:6px;letter-spacing:0}.text-button{display:inline-flex;align-items:center;gap:5px;background:none;border:0;font-size:9px;color:#b2c8b7;padding:9px 0 9px 8px}.text-button svg{width:13px;height:13px}.text-button:hover{color:var(--mint)}.roster-list{height:213px;overflow:auto;scrollbar-width:thin;scrollbar-color:#577761 transparent;padding:0 10px 0 12px}.roster-player{display:flex;align-items:center;gap:10px;padding:7px 6px;border-top:1px solid #bff5cd06;border-radius:6px;min-width:0;transition:opacity .35s,background .35s,transform .35s}.roster-number{font-size:7px;color:#698477;font-variant-numeric:tabular-nums}.roster-avatar{width:29px;height:29px;flex-shrink:0;object-fit:cover;border-radius:50%;border:1px solid #9db8a544;box-shadow:0 2px 5px #0004}.roster-name{font-size:10px;font-weight:500;flex:1;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.roster-state{width:4px;height:4px;border-radius:50%;background:var(--player-color,var(--mint));margin:0 3px}.roster-player.is-out{opacity:.3}.roster-player.is-out .roster-state{background:#69796b}.roster-player.is-winner{background:#bff5cd13;opacity:1}.roster-player.is-winner .roster-name{color:var(--mint)}.roster-foot{display:flex;align-items:center;gap:6px;padding:12px 18px;margin-top:6px;border-top:1px solid #bff5cd0c;font-size:7px;color:#8aa393}.roster-foot .mini-dot{width:4px;height:4px}
.site-footer{display:flex;align-items:center;justify-content:flex-end;gap:20px;padding:22px 0 25px;font-size:8px;color:#698577}.site-footer>span:first-child{font-size:7px;letter-spacing:1px}.site-footer strong{font-weight:500;color:#b4cbbb}.site-footer>span:last-child{font-size:7px;letter-spacing:1.5px}.site-footer i{font-style:normal;color:var(--mint);padding:0 5px}
.countdown-overlay,.pause-overlay,.winner-panel,.game-error{position:absolute;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center}.countdown-overlay{pointer-events:none;width:100%;text-shadow:0 6px 40px #081810}.countdown-overlay:before{content:'';position:absolute;z-index:-1;inset:-70px 0;background:radial-gradient(ellipse,#081c18dc,transparent 64%)}.countdown-overlay .eyebrow{color:var(--mint);font-size:10px;letter-spacing:4px}.countdown-overlay>strong{display:block;font:800 165px/1 Barlow,Impact,sans-serif;color:#dcffe3;filter:drop-shadow(0 0 30px #bff5cd22)}.countdown-overlay>p{font-size:10px;color:#b9d1c3}.pause-overlay{width:min(330px,calc(100% - 32px));padding:28px;border:1px solid #6b9478;border-radius:17px;background:#112521ee;backdrop-filter:blur(12px);box-shadow:0 20px 80px #0008}.pause-overlay .eyebrow{color:var(--mint);font-size:8px}.pause-overlay>strong{display:block;font:800 58px/.85 Barlow,Impact,sans-serif}.pause-overlay p{font-size:10px;color:#9ab4a6;margin:18px 0}.pause-overlay .button{width:100%}.winner-panel{width:min(340px,calc(100% - 28px));padding:88px 27px 26px;border:1px solid #dfc493aa;background:radial-gradient(ellipse at 50% 0%,#8d703b45,transparent 70%),#12241eee;border-radius:20px;box-shadow:0 0 0 5px #e7c69308,0 20px 90px #0009;backdrop-filter:blur(15px);animation:winner-reveal .7s cubic-bezier(.2,.9,.2,1)}.winner-crown{position:absolute;top:-47px;left:50%;transform:translateX(-50%);width:140px;height:140px;filter:drop-shadow(0 8px 20px #0008)}.winner-panel .eyebrow{color:var(--gold);font-size:7px;letter-spacing:1.7px;margin:0 0 16px}.winner-panel #winner-avatar{width:64px;height:64px;border-radius:50%;border:2px solid var(--gold);padding:3px;background:#12241e;box-shadow:0 0 30px #e7c69320}.winner-panel h2{font:800 42px/.95 Barlow,Impact,sans-serif;text-transform:uppercase;overflow-wrap:anywhere;margin:13px 0;color:#fff2d3}.winner-summary{font-size:10px;color:#c2c6b0;margin:0 0 20px;line-height:1.5}.winner-panel .button{width:100%;background:#e7c693;box-shadow:0 3px 0 #8e784e;color:#2e2618}.winner-rays{position:absolute;inset:-40px;z-index:-1;pointer-events:none;border-radius:50%;background:conic-gradient(from 0deg,transparent 0deg 20deg,#e7c69306 20deg 30deg,transparent 30deg 50deg,#e7c69306 50deg 60deg);filter:blur(2px)}
.game-error{width:min(350px,calc(100% - 32px));background:#26201cf5;border:1px solid #ff896b88;border-radius:12px;padding:24px;color:#ffd9c1;font-size:12px;line-height:1.7}.nudge-notice{position:absolute;z-index:7;top:16px;left:50%;transform:translateX(-50%);background:#26392df0;border:1px solid #bff5cd66;border-radius:20px;padding:8px 12px;font-size:8px;white-space:nowrap;color:var(--mint)}
dialog{width:min(480px,calc(100% - 28px));max-height:calc(100svh - 30px);background:#142521;border:1px solid #587862;border-radius:18px;color:var(--text);padding:28px;box-shadow:0 25px 100px #000b}dialog::backdrop{background:#071211bc;backdrop-filter:blur(8px)}.dialog-heading{display:flex;justify-content:space-between;align-items:start;gap:10px}.dialog-heading .eyebrow{color:var(--mint);font-size:8px}.dialog-heading h2{font:800 39px/.95 Barlow,Impact,sans-serif;margin:0}.close-button{border:0;background:none;color:#91ad9a;font-size:27px;padding:0}.dialog-copy{font-size:11px;color:#a4bbab;margin:18px 0}.dialog-heading~label{display:block;font-size:10px;margin-bottom:8px}textarea{width:100%;min-height:145px;max-height:40svh;resize:vertical;padding:12px 14px;color:#edf7eb;background:#0b1b18;border:1px solid #3b5746;border-radius:8px;font-size:12px;line-height:1.65;scrollbar-width:thin}.textarea-meta{display:flex;justify-content:space-between;align-items:start;gap:16px;font-size:8px;line-height:1.5;color:#86a793;margin-top:7px}.textarea-meta strong{color:var(--mint);white-space:nowrap;font-size:10px;font-weight:500}.form-error{color:#ffb191;font-size:10px}.dialog-actions{display:flex;justify-content:space-between;gap:10px;margin-top:22px}.dialog-footnote{font-size:8px;line-height:1.6;color:#86a793;margin:18px 0 0}.button-outline{border:1px solid #638069;color:#c3d7c6;background:#bff5cd06;font-size:10px}.button-outline:hover{background:#bff5cd12}
.showcase-hint{display:none;position:absolute;bottom:37px;left:0;right:0;z-index:4;pointer-events:none;text-align:center;font-size:8px;color:#9cbbac;letter-spacing:1px}.showcase .showcase-hint{display:block}.showcase .site-header,.showcase .intro,.showcase .control-sidebar,.showcase .site-footer{display:none}.showcase .app-layout{max-width:none;padding:0}.showcase .game-layout{display:block}.showcase .game-stage{border:0;border-radius:0}.showcase .board-viewport{height:calc(100svh - 168px)}.exit-showcase{position:fixed;right:18px;top:18px;z-index:20;background:#132820f0}.showcase .arena-orbit{display:none}
@keyframes winner-reveal{from{opacity:0;transform:translate(-50%,-43%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(min-width:1700px){.app-layout{max-width:1720px;padding:0 55px}.game-layout{grid-template-columns:minmax(0,1fr) 325px;gap:24px}.board-viewport{height:610px}.roster-list{height:280px}.hero-art{right:160px;width:600px;height:300px;top:-46px}}
@media(max-width:1150px){.app-layout{padding:0 24px}.game-layout{grid-template-columns:minmax(0,1fr) 260px;gap:15px}.hero-art{right:25px;opacity:.85;width:470px}.intro-seal{display:none}.intro{min-height:170px}h1{font-size:85px}.launch-card{padding:17px}.launch-card h2{font-size:55px}.board-viewport{height:510px}.card-heading{padding:17px 15px}.roster-list{height:231px}.header-stamp{font-size:7px}}
@media(max-width:850px){.app-layout{padding:0 18px}.brand small{display:none}.intro{min-height:160px}.hero-art{width:400px;right:-45px;top:-15px;opacity:.65}.intro-copy{max-width:80%}h1{font-size:78px}.game-layout{grid-template-columns:1fr}.board-viewport{height:480px}.control-sidebar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:stretch}.launch-card h2{font-size:58px}.roster-list{height:249px}.roster-foot{font-size:7px}.site-footer>span:nth-child(2){display:none}}
@media(max-width:560px){.app-layout{padding:0 12px}.site-header{height:58px}.brand{font-size:18px}.brand img{width:27px;height:27px}.header-stamp{font-size:6px;letter-spacing:.9px;max-width:110px;line-height:1.7}.header-stamp .mini-dot{width:4px;height:4px}.intro{min-height:174px;padding:24px 0}.intro .eyebrow{font-size:6px;letter-spacing:1.3px}.edition{font-size:6px;padding:1px 4px}.intro-copy{max-width:100%}h1{font-size:68px;letter-spacing:-.7px;margin-bottom:13px}h1 i{font-size:10px}.tagline{font-size:9px;max-width:245px;line-height:1.6}.hero-art{width:265px;height:170px;right:-70px;top:43px;opacity:.43;z-index:-1}.game-layout{gap:14px}.game-stage{border-radius:12px}.board-viewport{height:450px}.arena-label{font-size:5px;inset:12px}.board-caption{font-size:5px;letter-spacing:1px;gap:6px}.caption-rule{width:16px}.control-sidebar{grid-template-columns:1fr;gap:14px}.launch-card{padding:20px}.launch-heading{padding-right:130px;min-height:22px}.launch-heading .eyebrow{font-size:6px;max-width:130px}.launch-heading svg{width:16px;height:16px}.launch-card h2{position:absolute;right:19px;top:17px;text-align:right;font-size:42px;line-height:.85;margin:0}.launch-card h2 br{display:none}.launch-card h2 span{display:block}.start-button{margin-top:31px;height:48px;font-size:12px}.secondary-controls button{font-size:10px;padding:11px}.launch-hint{font-size:8px}.playback-tools{margin-top:14px}.icon-button{font-size:10px}.roster-list{height:241px;display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:0 8px;padding:0 11px}.roster-player{gap:7px;padding:9px 4px}.roster-name{font-size:9px}.roster-avatar{width:27px;height:27px}.roster-state{display:none}.card-heading{padding:20px 18px 15px}.roster-foot{padding:13px 18px;font-size:8px}.site-footer{padding:20px 0;gap:12px;flex-wrap:wrap;font-size:7px}.site-footer>span:first-child{font-size:6px}.site-footer>span:last-child{font-size:6px}.winner-panel{width:min(300px,calc(100% - 28px));padding:74px 23px 23px}.winner-crown{width:120px;height:120px;top:-39px}.winner-panel h2{font-size:36px}.winner-panel .eyebrow{font-size:6px}.winner-panel #winner-avatar{width:55px;height:55px}.countdown-overlay>strong{font-size:145px}.exit-showcase{font-size:8px;top:14px;right:10px;padding:8px}.showcase .board-viewport{height:calc(100svh - 126px)}dialog{padding:22px}.dialog-heading h2{font-size:33px}.dialog-actions .button{font-size:10px;padding:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Keep the illustration clear of the arena controls. */
@media(min-width:851px){.hero-art{width:450px;height:225px;top:-19px;right:100px}}
@media(min-width:1700px){.hero-art{width:500px;height:250px;top:-37px;right:175px}}
@media(min-width:851px) and (max-width:1150px){.hero-art{width:400px;height:200px;top:0;right:5px}}
@media(max-width:560px){.hero-art{width:230px;height:140px;top:25px;right:-18px;opacity:.36}.start-button{margin-top:51px}.intro{overflow:hidden}.launch-heading{padding-right:130px}}
@media(min-width:561px) and (max-width:850px){.hero-art{right:0;width:340px;height:160px;top:0}}

/* Desktop playfield pass: keep the existing page treatment and give the game the screen. */
.app-layout{max-width:1920px;padding:20px 28px 0}
.game-layout{grid-template-columns:minmax(0,1fr) 270px;gap:18px}
.board-viewport{height:clamp(480px,calc(100vh - 210px),900px);background:none}
.launch-card{padding:20px}.start-button{margin-top:0}
.roster-list{height:clamp(240px,calc(100vh - 444px),630px)}
.site-footer{padding:18px 0}
.showcase .app-layout{padding:24px 0 0}.showcase .board-viewport{height:calc(100vh - 136px)}

.roster-avatar{border:0;box-shadow:none;border-radius:50%;object-fit:contain;width:34px;height:34px}.roster-player:hover,.roster-player:focus-visible{background:#bff5cd0d}.roster-player{cursor:default}

/* Streamer controls live alongside the game, below the drop button. */
.youtube-card{border:1px solid #34453e;border-radius:16px;background:#142121;padding:16px;min-width:0;font-size:11px}.youtube-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.youtube-heading h2{font-size:17px;margin:0;font-weight:500}.youtube-heading>span{font-size:8px;color:var(--mint);padding:4px 7px;border:1px solid #bff5cd30;border-radius:5px}.google-signin{display:flex;align-items:center;justify-content:center;gap:10px;background:#f2f2f2;color:#1f1f1f;border:1px solid #747775;border-radius:6px;width:100%;min-height:40px;font:500 13px Arial,sans-serif;padding:9px}.google-signin svg{width:20px;height:20px}.google-signin:hover:not(:disabled){background:#fff}.youtube-help{font-size:10px;line-height:1.6;color:#a1b5ac;margin:10px 0 0}.youtube-account{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.youtube-account>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:500}.account-menu{position:relative;flex-shrink:0}.account-menu summary{font-size:9px;color:#acbfb2;cursor:pointer}.account-menu>div{position:absolute;z-index:9;right:0;top:23px;width:178px;background:#172b27;border:1px solid #5a7668;border-radius:7px;padding:5px;box-shadow:0 8px 24px #0009}.account-menu button{display:block;background:none;border:0;padding:10px;text-align:left;width:100%;font-size:11px}.account-menu button:hover{background:#ffffff10}.youtube-broadcast-row{display:flex;gap:6px;align-items:stretch}.youtube-broadcast-row select{min-width:0;flex:1;background:#091819;border:1px solid #4c6559;color:var(--text);border-radius:5px;padding:9px 6px;font:10px Space,system-ui}.youtube-broadcast-row button{background:#233b30;border:1px solid #4c6559;border-radius:5px;font-size:20px;padding:0 8px}.youtube-count{display:block;font-size:14px;color:var(--mint);margin-top:9px;font-weight:500}.youtube-actions{display:flex;flex-direction:column;gap:7px;margin-top:12px}.youtube-actions .button{font-size:10px;padding:10px}.youtube-actions .text-button{justify-content:center;padding:5px}.youtube-notice{font-size:10px;line-height:1.6;padding:9px;border:1px solid #63836b50;border-radius:5px;color:#b9d7c0;margin:12px 0 0}.youtube-notice.is-error{color:#ffd0a7;border-color:#ba895d50}.youtube-card>.text-button,#youtube-manual{font-size:9px;padding:10px 0 0}.roster-list{height:max(145px,calc(100vh - 448px - var(--streamer-height,150px)))}.legal-links{display:flex;gap:16px}.legal-links a:hover{text-decoration:underline}.control-sidebar{max-height:calc(100vh - 40px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#526c5e transparent;padding-bottom:3px}.control-sidebar>section{flex-shrink:0}.legal-page{max-width:780px;margin:50px auto;padding:0 24px;font:15px/1.7 Space,system-ui}.legal-page h1{font:800 48px Barlow,Impact;margin:24px 0}.legal-page h2{font-size:20px;margin:30px 0 8px}.legal-page a{text-decoration:underline;color:var(--mint)}

.winner-dismiss{position:absolute;top:12px;right:12px;z-index:2;display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid #dfc49366;border-radius:8px;background:#12241e;color:#fff2d3}.winner-dismiss:hover{background:#354334;border-color:#dfc493}

/* Keep the standalone board fitted, with the controls alongside. */
/* Reserve the initial 12-marble board before fonts and the renderer load.
   The aspect is the projected chassis size from getBoardFraming(createBoard(12)). */
.game-layout{--initial-board-ratio:1.3739985280050426;--initial-board-width:min(calc(100% - 288px),calc(clamp(450px,calc(100vh - 210px),900px) * var(--initial-board-ratio)));grid-template-columns:minmax(0,var(--board-panel-width,var(--initial-board-width))) 270px;justify-content:center}
.game-stage{width:100%}
.showcase .game-layout{--initial-board-width:calc(clamp(450px,calc(100vh - 140px),900px) * var(--initial-board-ratio))}
.showcase .game-stage{width:min(100%,var(--board-panel-width,var(--initial-board-width)));margin-inline:auto}
.board-viewport,.showcase .board-viewport{width:100%;height:auto;aspect-ratio:var(--initial-board-ratio)}
body[data-game-state=loading] .board-renderer{visibility:hidden}

/* Keep wheel scrolling without visible bars. */
html,body,.control-sidebar,.roster-list{scrollbar-width:none}
html::-webkit-scrollbar,body::-webkit-scrollbar,.control-sidebar::-webkit-scrollbar,.roster-list::-webkit-scrollbar{display:none}

/* Keep overlays accessible when a wide lineup makes the board shallow. */
.board-viewport[data-short-board=true] .winner-panel{top:60px;transform:translateX(-50%);animation:none}
.board-viewport[data-short-board=true] .pause-overlay{top:16px;transform:translateX(-50%)}

/* One compact panel for the drop controls, chat connection and lineup. */
.control-sidebar{gap:0;padding:0;border:1px solid #3c5147;border-radius:16px;background:radial-gradient(ellipse at 70% 0%,#7caa8120,transparent 45%),linear-gradient(160deg,#1b2b26,#111e1e);box-shadow:0 1px 0 #e5ffe310 inset;overflow-x:hidden}
.control-sidebar>.launch-card,.control-sidebar>.youtube-card,.control-sidebar>.roster-card{margin:0;border:0;border-radius:0;background:none;box-shadow:none}
.control-sidebar>.launch-card{padding:14px;overflow:visible}
.control-sidebar .start-button{height:42px;font-size:12px}
.control-sidebar .secondary-controls{gap:8px;margin-top:8px}
.control-sidebar .secondary-controls button{min-height:30px;padding:7px 10px}
.control-sidebar .playback-tools{grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:9px;margin-top:12px;padding-top:0;border:0}
.control-sidebar .playback-tools .icon-button{min-height:24px}
.control-sidebar .volume-control{grid-column:auto}
.control-sidebar .volume-control input{height:4px;margin:0}
.control-sidebar .launch-hint{margin:9px 0 0;font-size:9px;line-height:1.45;text-align:left;min-height:0}
.control-sidebar>.youtube-card{padding:13px 14px;border-top:1px solid #b9d7c21b}
.control-sidebar .youtube-heading{margin-bottom:10px}
.control-sidebar .youtube-heading h2{font-size:13px;font-weight:600}
.control-sidebar .google-signin{font-size:12px;min-height:38px;padding:8px}
.control-sidebar .youtube-help{font-size:10px;margin-top:8px}
.control-sidebar>.roster-card{border-top:1px solid #b9d7c21b;padding-bottom:8px}
.control-sidebar .card-heading{padding:10px 14px 8px}
.control-sidebar .card-heading h2{font-size:15px;font-weight:600;letter-spacing:-.25px}
.control-sidebar .card-heading h2>span{min-width:21px;height:19px;font-size:9px;margin-left:5px}
.control-sidebar .card-heading .text-button{font-size:10px;padding:5px 0 5px 8px}
.control-sidebar .roster-list{height:clamp(156px,calc(100vh - 390px - var(--streamer-height,90px)),312px);padding:0 8px}
.control-sidebar .roster-player{gap:9px;padding:5px 6px}
.control-sidebar .roster-avatar{width:28px;height:28px}
.control-sidebar .roster-name{font-size:11px}
.control-sidebar .roster-number{font-size:8px}
.control-sidebar .roster-note{margin:8px 14px 3px;color:#92aaa0;font-size:9px;line-height:1.45}
