@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Outfit:wght@400;500;600;700;800;900&display=swap');
:root{color-scheme:dark;--bg:#09151c;--panel:#10212a;--panel2:#132933;--panel3:#182f3a;--edge:#26404a;--muted:#90a3ac;--text:#f4f7f4;--gold:#e9b772;--gold2:#ffd397;--mint:#76dabe;--red:#ec8078;--navy:#102129;--shadow:0 24px 60px #0003}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:14px;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}a{color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px} .ambient{position:fixed;z-index:-1;pointer-events:none;filter:blur(90px);opacity:.45}.ambient-one{width:430px;height:430px;top:-230px;right:10%;background:#b27a3d33}.ambient-two{width:600px;height:470px;bottom:-300px;left:-250px;background:#104d473d}
#app{min-height:100vh}.loading-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;color:var(--muted)}.loading-mark{font-size:80px;font-family:Outfit,sans-serif;font-weight:900;color:var(--gold)}.loading-mark span{color:var(--mint)}
/* shared */
.wrap{width:min(1460px,calc(100% - 72px));margin:auto}.eyebrow{text-transform:uppercase;font-size:10px;font-weight:800;letter-spacing:2.4px;color:var(--gold)}.subtle{color:var(--muted)}.btn{border:1px solid var(--edge);display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:43px;padding:10px 17px;border-radius:10px;background:#1a3039;color:#edf3ef;font-weight:700;transition:background .2s,border-color .2s,transform .2s}.btn:hover:not(:disabled){background:#27414c;border-color:#46616b;transform:translateY(-1px)}.btn-primary{background:var(--gold);border-color:var(--gold);color:#17221f}.btn-primary:hover:not(:disabled){background:#f8cb8d;border-color:#f8cb8d}.btn-quiet{background:transparent}.btn-icon{padding:9px 12px;min-width:43px}.btn-large{min-height:53px;padding:15px 23px}.glass{background:linear-gradient(120deg,#152b34d9,#0e1e26f0);border:1px solid var(--edge);border-radius:17px;box-shadow:var(--shadow)}.section-title{font-size:20px;letter-spacing:-.6px;font-family:Outfit,sans-serif;font-weight:700;margin:0}.top-kicker{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);font-weight:800}.tiny-dot{width:7px;height:7px;border-radius:50%;background:var(--mint);display:inline-block;box-shadow:0 0 12px #76dabe66}
/* landing */
.landing{min-height:100vh;overflow:hidden}.site-header{height:90px;border-bottom:1px solid #ffffff0e;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;white-space:nowrap}.brand-icon{width:43px;height:43px;display:grid;place-items:center;border:2px solid #e7b978;border-radius:12px;transform:rotate(-10deg);color:#ffd499;font-size:29px;font-family:Outfit;font-weight:900;line-height:1;box-shadow:inset 0 0 20px #ffbe6b18}.brand-icon span{transform:rotate(10deg)}.brand-title{display:flex;flex-direction:column;line-height:1.13}.brand-title strong{font:800 19px Outfit,sans-serif;letter-spacing:1.8px}.brand-title small{font-size:9px;letter-spacing:3px;color:var(--gold);font-weight:800;margin-top:4px}.header-right{display:flex;align-items:center;gap:18px;color:#abc0c6}.header-chip{font-size:10px;letter-spacing:1.4px;font-weight:800;border:1px solid #3f4e46;border-radius:99px;padding:9px 13px;color:var(--mint)}.header-link{border:0;color:#c4d4d6;background:transparent;font-size:13px;font-weight:700}.header-link:hover{color:var(--gold)}
.hero{padding:76px 0 72px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(345px,.8fr);align-items:center;gap:7%;min-height:650px}.hero-left{position:relative}.hero-label{display:inline-flex;align-items:center;gap:10px;border:1px solid #445449;background:#e9b77209;border-radius:99px;padding:10px 15px;color:var(--gold);font-size:10px;font-weight:800;letter-spacing:1.6px}.hero h1{font-family:Outfit,system-ui,sans-serif;font-size:clamp(60px,7.7vw,124px);line-height:.93;letter-spacing:-6px;margin:31px 0 28px;font-weight:800}.hero h1 em{font-style:normal;color:var(--gold);display:block}.hero-description{font-size:17px;line-height:1.75;color:#aac0c5;max-width:550px}.hero-features{display:flex;align-items:center;gap:27px;margin-top:38px;flex-wrap:wrap}.feature{display:flex;align-items:center;gap:12px;color:#d4e0df;font-weight:700;font-size:12px}.feature-symbol{width:31px;height:31px;border-radius:9px;background:#17362f;border:1px solid #31564c;display:grid;place-items:center;color:var(--mint);font-size:17px}.hero-visual{position:relative;min-height:520px;display:grid;align-items:center}.hero-art{position:absolute;inset:0;overflow:hidden;pointer-events:none}.glow-orbit{position:absolute;width:420px;height:420px;border-radius:50%;border:1px solid #cd99633b;right:-50px;top:10px;box-shadow:inset 0 0 100px #d9a05e10,0 0 80px #a8804120}.glow-orbit:before{content:'';position:absolute;inset:35px;border-radius:50%;border:1px dashed #d6a06345}.decor-ball{position:absolute;border-radius:50%;display:flex;align-items:center;justify-content:center;font:900 25px Outfit,sans-serif;box-shadow:inset -13px -12px 20px #0002,0 18px 28px #0005;transform:rotate(-12deg);border:7px solid #ffffffaa}.decor-ball.one{height:108px;width:108px;background:#ebc278;color:#29443f;right:-12px;top:9px}.decor-ball.two{height:70px;width:70px;background:#82c7bf;color:#173c43;left:-15px;top:80px;font-size:19px;transform:rotate(20deg)}.decor-ball.three{height:82px;width:82px;background:#d98789;color:#4e2a35;right:28px;bottom:8px;font-size:22px}.join-panel{position:relative;background:linear-gradient(145deg,#183039,#10212b 60%,#0e2029);border:1px solid #4b5550;border-radius:23px;box-shadow:0 40px 90px #0007;max-width:465px;width:100%;margin:auto;padding:27px 27px 30px;z-index:1}.join-panel-header{display:flex;justify-content:space-between;align-items:start;gap:15px;margin-bottom:22px}.join-panel-header h2{font:750 28px Outfit,sans-serif;letter-spacing:-1px;margin:8px 0 0}.free-pill{border:1px solid #406455;color:var(--mint);background:#16382f;border-radius:7px;font-size:10px;font-weight:800;letter-spacing:.8px;padding:8px}.tab-switch{display:grid;grid-template-columns:1fr 1fr;gap:5px;background:#0a1c24;border-radius:11px;padding:5px;margin-bottom:20px}.tab{background:transparent;color:#809ba3;border:0;border-radius:8px;padding:12px 10px;font-size:12px;font-weight:800}.tab.active{background:#26414a;color:#fff;box-shadow:0 2px 7px #0004}.form-label{display:block;font-size:11px;font-weight:800;color:#b6c6c8;margin:17px 0 9px}.form-input{display:block;width:100%;height:47px;border-radius:9px;background:#091922;border:1px solid #35505b;color:#f7fbfa;padding:0 15px;outline:none}.form-input::placeholder{color:#68838d}.form-input:focus{border-color:var(--gold)}.card-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.count-choice{border-radius:9px;border:1px solid #34505b;background:#10232d;color:#b3c5c9;padding:11px 5px;font-weight:700;font-size:12px}.count-choice strong{font-size:22px;display:block;font-family:Outfit;color:#f9f7ef}.count-choice.active{border-color:var(--gold);background:#e9b7721a;color:var(--gold)}.count-choice.active strong{color:var(--gold)}.submit-row{margin-top:23px}.submit-row .btn{width:100%;justify-content:space-between}.form-foot{font-size:11px;color:#77949a;text-align:center;margin:17px 0 0}.hero-footer{border-top:1px solid #ffffff12;padding:24px 0;display:flex;align-items:center;justify-content:space-between;color:#708992;font-size:11px;letter-spacing:.2px;gap:20px}
/* game */
.game-page{display:grid;grid-template-columns:238px minmax(0,1fr);min-height:100vh}.sidebar{border-right:1px solid #213640;background:#0d1d25;display:flex;flex-direction:column;padding:29px 21px;position:sticky;top:0;height:100vh}.side-divider{height:1px;background:#294048;margin:29px 0}.side-nav{display:grid;gap:7px}.side-link{border:0;text-align:left;background:transparent;color:#91a9ad;border-radius:10px;padding:13px 13px;font-weight:700;font-size:13px;display:flex;align-items:center;gap:13px}.side-link .nav-symbol{font-size:19px;width:21px;text-align:center;opacity:.85}.side-link.active{background:#e5af6e17;color:var(--gold)}.side-link:hover{background:#20353f;color:#fff}.side-caption{font-size:10px;letter-spacing:2px;color:#687f88;font-weight:800;margin:0 12px 13px}.side-session{margin-top:9px;padding:15px;background:#142a34;border:1px solid #2b4650;border-radius:13px}.side-session .side-session-label{color:#9baeb4;font-size:10px;text-transform:uppercase;letter-spacing:1.2px;font-weight:800}.side-session .side-session-value{font-family:Outfit;font-size:28px;letter-spacing:5px;margin-top:8px;font-weight:800;color:#f2d09d}.side-session small{display:block;color:#7997a0;margin-top:3px;font-size:11px}.side-bottom{margin-top:auto;color:#738d96}.side-bottom .side-minor{border:1px solid #2a454c;padding:13px;border-radius:12px;font-size:11px;line-height:1.55}.side-bottom strong{color:var(--gold)}.main-content{min-width:0;padding:0 34px 40px}.game-topbar{height:83px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #29404a;gap:20px}.game-topbar-left{display:flex;align-items:center;gap:14px}.topbar-title{font-family:Outfit;font-size:18px;font-weight:700}.topbar-subtitle{color:#8099a1;font-size:11px;margin-top:4px}.topbar-actions{display:flex;align-items:center;gap:10px}.room-tag{background:#152d37;color:#e5bc82;border:1px solid #486052;border-radius:8px;padding:10px 12px;font-size:12px;font-weight:800;letter-spacing:1.2px}.icon-button{display:grid;place-items:center;width:40px;height:40px;border:1px solid #34505a;border-radius:9px;background:#172e38;color:#dfebeb;font-size:17px}.icon-button:hover{background:#29434a}.avatar{border-radius:50%;background:#bde1d4;color:#1d4239;width:37px;height:37px;display:grid;place-items:center;font-weight:900}.game-content{max-width:1360px;margin:auto;padding-top:30px}.intro-row{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:23px}.intro-row h1{font:750 clamp(26px,3vw,36px) Outfit,sans-serif;letter-spacing:-1.1px;margin:7px 0 0}.intro-row .intro-sub{font-size:12px;color:#95acb1;margin-top:7px}.session-progress{text-align:right;min-width:220px}.progress-copy{font-size:11px;font-weight:800;color:#a8bac0;margin-bottom:11px}.progress-copy strong{color:var(--gold)}.progress-dots{display:flex;gap:5px;justify-content:flex-end}.progress-dots .dot{width:14px;height:6px;border-radius:8px;background:#314954}.progress-dots .dot.done{background:#628c79}.progress-dots .dot.current{background:var(--gold);width:23px}.play-stage{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(295px,.7fr);gap:17px;margin-bottom:17px}.caller-panel{padding:23px 26px;background:linear-gradient(135deg,#17343d,#10252d 80%);border:1px solid #35515a;border-radius:16px;position:relative;overflow:hidden;min-height:253px}.caller-panel:after{content:'';position:absolute;width:240px;height:240px;border:1px solid #ffffff10;border-radius:50%;top:8px;left:31%;pointer-events:none}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel-heading strong{font-size:11px;letter-spacing:1.6px;color:#a9bec4}.live-pulse{display:inline-flex;align-items:center;gap:8px;background:#153c38;color:var(--mint);border:1px solid #326255;padding:8px 10px;border-radius:99px;font-size:10px;font-weight:900;letter-spacing:1px}.live-pulse.off{background:#324038;color:#d5bc8b;border-color:#4d5648}.caller-layout{display:flex;align-items:center;gap:31px;margin-top:8px;position:relative;z-index:1}.current-ball{background:radial-gradient(circle at 35% 25%,#fff,#f9edce 74%,#bfad8e);border-radius:50%;width:156px;height:156px;flex:0 0 156px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 12px 40px #0006,inset -11px -14px 22px #b6a78b55,0 0 0 8px #ffffff10;position:relative;color:#18373a}.current-ball:before{content:'';position:absolute;border:2px solid #18373a20;width:118px;height:118px;border-radius:50%}.current-ball span{font:900 42px Outfit,sans-serif;line-height:1}.current-ball strong{font:900 65px Outfit,sans-serif;line-height:1.1;letter-spacing:-2px}.current-ball.waiting span{font-size:21px;letter-spacing:2px}.current-ball.waiting strong{font-size:47px}.current-ball.new{animation:drop .45s ease-out}@keyframes drop{from{transform:translateY(-12px) scale(.92)}to{transform:translateY(0) scale(1)}}.call-details{min-width:0;flex:1}.call-details .kicker{font-size:11px;letter-spacing:1.7px;color:#90b1b7;font-weight:800}.ball-name{font:750 32px Outfit,sans-serif;margin:6px 0 8px;letter-spacing:-.8px}.call-details p{margin:0;color:#84a4ad;font-size:12px}.recent-calls{display:flex;align-items:center;gap:7px;margin-top:21px;flex-wrap:wrap}.recent-calls .smallball{display:flex;align-items:center;justify-content:center;gap:4px;height:31px;min-width:44px;background:#31505b;border:1px solid #4b6870;border-radius:100px;font-weight:800;font-size:12px;color:#e6eeea}.recent-calls .smallball b{color:#ffd69e}.recent-calls .none{font-size:12px;color:#78949a}.pattern-panel{background:linear-gradient(145deg,#202e35,#18252d);border:1px solid #38464b;border-radius:16px;padding:21px 23px;display:flex;align-items:center;justify-content:space-between;gap:19px}.pattern-info{min-width:0}.pattern-info .top-kicker{color:var(--gold)}.pattern-info h2{font:750 27px Outfit,sans-serif;letter-spacing:-.8px;margin:10px 0}.pattern-info p{color:#a3b4b9;line-height:1.65;font-size:12px;max-width:220px}.pattern-stamp{font:700 11px Outfit,sans-serif;color:var(--mint);margin-top:17px}.pattern-board{flex:0 0 143px;border-radius:8px;background:#eaf0e9;padding:9px;box-shadow:0 12px 30px #0004}.mini-letters{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;text-align:center;color:#315b61;font:900 12px Outfit}.mini-grid{margin-top:5px;display:grid;grid-template-columns:repeat(5,1fr);gap:3px}.mini-cell{aspect-ratio:1;background:#cedad6;border-radius:3px}.mini-cell.on{background:var(--gold);box-shadow:inset 0 -2px #b68a51}.mini-cell.center{position:relative}.mini-cell.center:after{content:'★';position:absolute;inset:0;display:grid;place-items:center;font-size:9px;color:#2e5252}.room-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 17px;min-height:68px;padding:13px 20px;background:#142933;border:1px solid #2b4550;border-radius:14px}.toolbar-left,.toolbar-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.toolbar-label{font-weight:800;font-size:11px;color:#9bb1b6;letter-spacing:.5px}.status-note{font-size:11px;color:#8da5ac}.host-select{min-height:40px;border-radius:8px;background:#102129;color:#e2e8e6;border:1px solid #38545e;padding:0 11px}.btn-play{background:#1c544a;color:#97e6c6;border-color:#397765}.btn-play:hover:not(:disabled){background:#287061}.btn-stop{background:#4a3c2d;color:#ffcf98;border-color:#68513a}.bingo-btn{background:var(--gold);color:#1b251f;border-color:var(--gold);font:900 14px Outfit,sans-serif;letter-spacing:1px;box-shadow:0 0 20px #edb97127}.bingo-btn:hover:not(:disabled){background:#ffd395}.board-row{display:grid;grid-template-columns:minmax(0,1fr) 277px;gap:17px;margin-bottom:24px}.flashboard,.standings-panel{background:#10242d;border:1px solid #2e4651;border-radius:16px;padding:20px 22px}.board-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:17px}.board-title h3{font:700 17px Outfit,sans-serif;letter-spacing:-.4px;margin:0}.board-title span{color:#809ba4;font-size:10px;font-weight:800;letter-spacing:1.3px}.flashboard-cols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.flash-col{min-width:0}.flash-letter{height:30px;display:grid;place-items:center;font:900 17px Outfit,sans-serif;letter-spacing:2px;border-radius:6px;margin-bottom:8px;background:#284451;color:#d8f0ee}.flash-col:nth-child(1) .flash-letter{background:#284d6b;color:#aedcf9}.flash-col:nth-child(2) .flash-letter{background:#5e3439;color:#ffbbb7}.flash-col:nth-child(3) .flash-letter{background:#425c38;color:#d5efae}.flash-col:nth-child(4) .flash-letter{background:#665132;color:#ffe0a0}.flash-col:nth-child(5) .flash-letter{background:#4c3d62;color:#ddc4ff}.flash-numbers{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.flash-number{aspect-ratio:1/1;min-width:0;border-radius:5px;display:grid;place-items:center;background:#182f38;color:#617b83;font:800 clamp(8px,.75vw,11px) Outfit,sans-serif}.flash-number.called{background:#f0c27f;color:#18262a;box-shadow:inset 0 0 0 1px #ffe3af;font-weight:900}.flash-number.latest{background:#e4fcf0;color:#173e36;box-shadow:0 0 0 2px var(--mint)}.standings-panel{display:flex;flex-direction:column}.leader-list{display:grid;gap:11px;margin-top:2px}.leader-row{display:flex;align-items:center;gap:9px}.leader-rank{color:#7b9ba4;width:15px;font-size:11px;font-weight:800}.leader-avatar{width:30px;height:30px;display:grid;place-items:center;background:#314d4f;border-radius:9px;color:#d5e9e3;font-weight:800}.leader-name{font-size:12px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}.leader-name.you{color:var(--gold)}.leader-score{font:800 13px Outfit;color:#f6ddad}.standings-footer{font-size:11px;color:#829ba5;margin-top:auto;padding-top:17px;line-height:1.6}.cards-section{scroll-margin-top:18px}.cards-heading{display:flex;justify-content:space-between;align-items:end;gap:15px;margin-bottom:16px}.cards-heading p{font-size:12px;color:#8fa7b0;margin:6px 0 0}.switch-wrap{display:flex;align-items:center;gap:10px;font-size:12px;color:#a7b7b9;font-weight:700;cursor:pointer;user-select:none}.switch-wrap input{position:absolute;opacity:0}.switch-ui{width:39px;height:23px;background:#36505b;border-radius:20px;display:inline-flex;align-items:center;padding:3px;transition:background .2s}.switch-ui:after{content:'';height:17px;width:17px;background:#afc5c6;border-radius:50%;transition:transform .2s}.switch-wrap input:checked+.switch-ui{background:#38866c}.switch-wrap input:checked+.switch-ui:after{transform:translateX(16px);background:#d9ffee}.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.paper-card{background:#f9f8f2;border:1px solid #cbd9d6;border-radius:13px;color:#203b40;padding:14px 13px 13px;position:relative;box-shadow:0 12px 25px #0002}.paper-card.ready{box-shadow:0 0 0 2px #84e3bd,0 10px 26px #26a88335}.paper-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.paper-title{font:900 13px Outfit,sans-serif;letter-spacing:1.1px;color:#25383a}.paper-state{color:#527b77;background:#d7ede5;padding:5px 8px;border-radius:6px;font-size:10px;font-weight:900;white-space:nowrap}.paper-state.winner{background:#fae3b5;color:#815320}.paper-sub{font-size:9px;color:#809193;font-weight:900;letter-spacing:1.5px}.paper-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px}.paper-letters{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;margin:11px 0 4px}.paper-letters div{border-radius:4px 4px 0 0;text-align:center;padding:4px;color:white;font:900 clamp(13px,1.3vw,20px) Outfit}.paper-letters div:nth-child(1){background:#3b7194}.paper-letters div:nth-child(2){background:#bd5c5c}.paper-letters div:nth-child(3){background:#7b9362}.paper-letters div:nth-child(4){background:#bc8a51}.paper-letters div:nth-child(5){background:#8269a4}.paper-cell{border:1px solid #cbdad7;background:#eef1ec;border-radius:4px;aspect-ratio:1/1;display:grid;place-items:center;color:#203c44;min-width:0;position:relative;padding:0;font:900 clamp(12px,1.34vw,20px) Outfit,sans-serif;transition:background .15s}.paper-cell.called-unmarked{background:#e4edec;border-color:#b3cac3}.paper-cell.called-unmarked:after{content:'';height:5px;width:5px;background:#d79557;border-radius:50%;position:absolute;top:3px;right:3px}.paper-cell.daubed{background:#cce7dc;border-color:#8eae9c}.paper-cell.daubed:before{content:'';width:79%;height:79%;background:#69a9a18c;border:2px solid #468b8b55;border-radius:50%;position:absolute;transform:rotate(-10deg)}.paper-cell.daubed span{z-index:1}.paper-cell.last{box-shadow:inset 0 0 0 2px #d7ad4b}.paper-cell.free{background:#e8d8aa;color:#8c612c;font-size:9px}.paper-cell.free:before{content:'★';font-size:21px;color:#bd9453;position:absolute;top:1px;opacity:.44}.paper-cell.free span{z-index:1;font-size:9px}.paper-bottom{display:flex;justify-content:space-between;align-items:center;color:#738b88;font-size:10px;margin-top:10px;font-weight:700}.paper-bottom span:last-child{color:#8b9e9d}.paper-card:nth-child(6n+2){border-top:4px solid #e4a8a4}.paper-card:nth-child(6n+1){border-top:4px solid #6ba8ca}.paper-card:nth-child(6n+3){border-top:4px solid #83a982}.paper-card:nth-child(6n+4){border-top:4px solid #cfb07b}.paper-card:nth-child(6n+5){border-top:4px solid #a99ccb}.paper-card:nth-child(6n){border-top:4px solid #7eb3aa}
/* lobby, round end */
.lobby-banner{background:linear-gradient(120deg,#17333c,#1e3c3c);border:1px solid #3d6158;border-radius:17px;padding:32px;display:flex;justify-content:space-between;gap:25px;align-items:center;margin:20px 0}.lobby-banner h2{font:800 31px Outfit,sans-serif;letter-spacing:-1px;margin:10px 0}.lobby-banner p{color:#a9c1c4;line-height:1.6;margin:0}.players-lobby{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:13px;margin-top:18px}.seat-card{display:flex;align-items:center;gap:12px;padding:20px;border:1px solid #35505b;background:#122831;border-radius:12px}.seat-card .seat-avatar{width:40px;height:40px;border-radius:13px;background:#2c554c;color:#ace4c8;display:grid;place-items:center;font-weight:900;font-size:18px}.seat-card strong{display:block;font-size:13px}.seat-card small{font-size:11px;color:#8ba6ad}.lobby-rules{margin-top:24px;padding:24px;background:#10252c;border:1px solid #2e454b;border-radius:15px}.lobby-rules h3{margin:0 0 13px;font-family:Outfit;font-size:19px}.program-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.program-chip{border-radius:8px;padding:10px;background:#182f38;border:1px solid #31505a;color:#aebfc2;font-size:11px;font-weight:800}.program-chip i{font-style:normal;color:#e6bb7e;margin-right:7px}.result-bar{background:linear-gradient(90deg,#254f43,#173a38);border:1px solid #65927c;border-radius:13px;padding:16px 20px;margin:0 0 17px;display:flex;align-items:center;gap:13px}.result-trophy{font-size:31px}.result-bar strong{font:800 18px Outfit}.result-bar p{margin:4px 0 0;font-size:12px;color:#bce2d6}.finish-panel{padding:45px;text-align:center}.finish-panel h2{font:800 45px Outfit;margin:13px 0}.finish-panel p{color:#a6bac0;line-height:1.65;max-width:500px;margin:0 auto 22px}.finish-panel .btn{margin:5px}.round-host{display:flex;gap:10px;flex-wrap:wrap}.event-list{margin-top:19px;display:grid;gap:8px}.event-line{color:#98acb4;font-size:12px}.event-line strong{color:#f0c789}.footer-note{margin:32px 0 0;text-align:center;font-size:10px;color:#617f87;line-height:1.6}
/* modals/toast */
.toast{position:fixed;z-index:40;right:25px;bottom:24px;max-width:390px;min-width:210px;background:#223a42;color:#eef8f2;padding:17px 21px;border:1px solid #6f9c8c;border-radius:11px;box-shadow:0 20px 50px #0008;transform:translateY(100px);opacity:0;pointer-events:none;transition:transform .25s,opacity .25s;font-weight:700;font-size:13px}.toast.visible{transform:translateY(0);opacity:1}.toast.bad{border-color:#a85f59;background:#422d32}.modal-backdrop{position:fixed;z-index:30;inset:0;display:none;align-items:center;justify-content:center;background:#02080bba;padding:20px;backdrop-filter:blur(9px)}.modal-backdrop.open{display:flex}.modal{background:#132832;border:1px solid #4a646b;border-radius:20px;padding:32px;max-width:640px;max-height:90vh;overflow:auto;position:relative;box-shadow:0 30px 100px #000b}.modal-x{position:absolute;right:16px;top:12px;font-size:29px;background:transparent;border:0;color:#a8c2c7}.modal h2{font:800 32px Outfit;margin:10px 0}.modal>p{color:#adbec2;line-height:1.65}.how-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:19px;margin:24px 0}.how-grid div{background:#1c343d;border:1px solid #3d555e;border-radius:11px;padding:16px}.how-grid span{color:var(--gold);font-weight:900;font-size:12px;display:block;margin-bottom:10px}.how-grid strong{font:800 16px Outfit}.how-grid p{font-size:12px;color:#9cb1b7;line-height:1.6;margin:8px 0 0}.modal-note{font-size:11px!important;color:#7d969c!important}
@media(max-width:1300px){.game-page{grid-template-columns:205px 1fr}.sidebar{padding-left:15px;padding-right:15px}.main-content{padding-left:22px;padding-right:22px}.paper-cell{font-size:16px}.pattern-board{flex-basis:125px}}
@media(max-width:1090px){.hero{grid-template-columns:1fr 430px;gap:25px}.hero h1{font-size:78px;letter-spacing:-4px}.hero-visual{min-height:500px}.game-page{grid-template-columns:1fr}.sidebar{height:auto;position:static;display:none}.play-stage{grid-template-columns:1fr 310px}.board-row{grid-template-columns:1fr 250px}.game-topbar{height:72px}.main-content{padding-left:24px;padding-right:24px}}
@media(max-width:800px){.wrap{width:calc(100% - 32px)}.hero{grid-template-columns:1fr;padding:55px 0;gap:25px}.hero h1{font-size:clamp(58px,12vw,92px)}.hero-visual{min-height:auto}.hero-art{display:none}.join-panel{max-width:100%}.site-header{height:72px}.header-chip{display:none}.hero-footer{flex-direction:column;align-items:flex-start}.play-stage,.board-row{grid-template-columns:1fr}.pattern-panel{min-height:220px}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.flashboard{padding:17px}.paper-cell{font-size:clamp(14px,3vw,24px)}.room-toolbar{align-items:start;flex-direction:column}.session-progress{display:none}.game-content{padding-top:20px}.game-topbar .topbar-subtitle{display:none}.program-chips{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.main-content{padding:0 13px 28px}.topbar-title{font-size:15px}.game-topbar{height:69px}.game-topbar-left{gap:8px}.game-topbar-right{gap:5px}.topbar-actions{gap:5px}.room-tag{padding:9px 8px;font-size:11px}.avatar{display:none}.intro-row h1{font-size:27px}.intro-row .intro-sub{font-size:11px}.caller-panel{padding:18px;min-height:215px}.caller-layout{gap:22px}.current-ball{width:120px;height:120px;flex-basis:120px}.current-ball:before{width:90px;height:90px}.current-ball span{font-size:32px}.current-ball strong{font-size:52px}.ball-name{font-size:25px}.recent-calls{margin-top:13px}.call-details .kicker{font-size:9px}.call-details p{font-size:11px}.pattern-panel{padding:18px}.pattern-board{flex-basis:124px}.pattern-info h2{font-size:22px}.room-toolbar{padding:14px}.toolbar-left,.toolbar-right{width:100%}.toolbar-right .btn{flex:1}.flashboard{padding:13px}.flashboard-cols{gap:4px}.flash-numbers{gap:2px}.flash-number{font-size:9px;border-radius:3px}.flash-letter{margin-bottom:5px}.card-grid{grid-template-columns:1fr;gap:13px}.paper-card{max-width:430px;width:100%;margin:0 auto;padding:14px}.paper-cell{font-size:clamp(20px,6vw,28px)}.paper-letters div{font-size:23px}.cards-heading{align-items:start}.cards-heading p{font-size:11px}.cards-heading .switch-wrap{font-size:11px}.lobby-banner{padding:23px;flex-direction:column;align-items:stretch}.lobby-banner h2{font-size:25px}.lobby-banner .btn{width:100%}.how-grid{grid-template-columns:1fr}.modal{padding:24px}.hero h1{font-size:64px;letter-spacing:-4px}.hero-description{font-size:15px}.hero-features{gap:14px}.feature{font-size:11px}.join-panel{padding:22px}.finish-panel{padding:24px}.toast{bottom:12px;left:12px;right:12px;max-width:none}}
/* Family party upgrades */
.live-tag{font-size:10px;letter-spacing:1px;font-weight:900;color:#8ce1b2;background:#194235;border:1px solid #36745b;border-radius:99px;padding:8px 10px;white-space:nowrap}
.gift-planner{border:1px solid #3b6265;border-radius:16px;background:linear-gradient(145deg,#142c32,#12313a);margin:24px 0;overflow:hidden;box-shadow:0 10px 24px #0002}
.gift-planner summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:21px 23px;font-family:Outfit,sans-serif;font-weight:800;font-size:20px}
.gift-planner summary::-webkit-details-marker{display:none}.gift-summary{color:#a8d9c5;font:700 11px 'DM Sans',sans-serif;letter-spacing:.2px}.gift-summary b{padding-left:12px;color:var(--gold)}
.gift-inner{padding:0 23px 24px}.gift-inner>p{max-width:900px;color:#b3c6c9;line-height:1.6;margin:0 0 20px}
.gift-input-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.gift-field{display:flex;flex-direction:column;gap:8px;min-width:0}.gift-field>span{font-size:12px;font-weight:700;color:#d0e0de}.gift-field b{color:#e9b772;margin-right:6px}
.gift-field input{border:1px solid #42606a;background:#0b222c;border-radius:9px;padding:12px 13px;color:#fff;min-width:0;width:100%;outline-offset:2px}.gift-field input::placeholder{color:#698a8f}.gift-field input:focus{border-color:var(--gold)}.gift-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end;margin-top:20px}
.gift-spotlight{display:flex;align-items:center;gap:18px;padding:19px 24px;margin:12px 0 22px;background:linear-gradient(110deg,#3f3527,#253638 66%,#152b32);border:1px solid #806847;border-radius:15px}
.gift-icon{display:grid;place-items:center;flex:none;width:64px;height:64px;font-size:35px;background:#ffce8a17;border-radius:18px;border:1px solid #b68a557a}.gift-copy{flex:1;min-width:0}.gift-copy h3{font:800 clamp(19px,2vw,27px) Outfit,sans-serif;color:#ffe0ae;letter-spacing:-.4px;margin:5px 0}.gift-copy p{color:#c7d6d1;font-size:12px;line-height:1.5;margin:0}.gift-winner-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:13px}.gift-winner-actions .btn{font-size:12px;min-height:36px;padding:7px 12px}.gift-selected{border-color:#83c2a8!important;background:#235a4d!important}
.gift-ledger{margin:24px auto;padding:15px;border:1px solid #4c665d;border-radius:14px;background:#122b32;max-width:720px;text-align:left}.gift-ledger h2{font:800 22px Outfit,sans-serif;margin:4px 0 15px}.gift-ledger-rows{display:grid;gap:8px}.gift-ledger-row{display:grid;grid-template-columns:1fr 1.2fr .7fr;align-items:center;gap:12px;background:#193841;padding:11px 14px;border-radius:8px;font-size:12px}.gift-ledger-row span{color:#b6cdcb}.gift-ledger-row strong{color:#f8d69c}.gift-ledger-row em{color:#91dbc5;font-style:normal;text-align:right}
.spectator-note{padding:19px 22px;background:#273f48;border:1px solid #9a7b4c;color:#ffe3b0;border-radius:12px;line-height:1.6;margin:0 0 24px;font-weight:700}
@media(max-width:690px){.gift-input-grid{grid-template-columns:1fr}.gift-planner summary{align-items:flex-start;flex-direction:column;font-size:18px}.gift-inner{padding:0 16px 20px}.gift-spotlight{padding:14px;gap:12px}.gift-icon{width:48px;height:48px;font-size:26px}.gift-ledger-row{grid-template-columns:1fr 1fr}.gift-ledger-row em{grid-column:1/-1;text-align:left}.live-tag{display:none}}
.gift-history-actions{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap;border-top:1px solid #3c5960;padding-top:9px}.gift-history-actions .btn{font-size:11px;min-height:32px;padding:6px 10px}
.party-fair{display:flex;gap:10px;align-items:start;padding:12px 10px 8px;color:#c5d9d3;line-height:1.4;font-size:12px}.party-fair input{width:18px;height:18px;accent-color:#edc58d;flex:none;margin-top:2px}.party-fair strong{color:#f5d293}.fair-help{font-size:11px;color:#a4c7c7;margin:12px 0}

/* Closest-to-Bingo ranking: cards reorder visually, while immutable card indexes keep daubs and claims correct. */
.sort-notice{color:#e7cb8d;font-weight:800;white-space:nowrap}
.paper-card.closest-card:not(.ready){border-color:#caac6e;box-shadow:0 0 0 2px #e1be7933,0 12px 27px #0003}
.paper-title{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.closest-indicator{display:inline-block;padding:3px 5px;border:1px solid #d9c18a;border-radius:4px;background:#f7edd0;color:#826026;font:900 9px Outfit,sans-serif;letter-spacing:.3px;white-space:nowrap}
@media(max-width:540px){.sort-notice{display:inline-block;margin-top:3px;white-space:normal}}

/* Live one-away sound cue and server-enforced tie window */
.near-bingo-banner,.tie-window-banner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-radius:13px;padding:15px 19px;margin:0 0 17px;font-size:13px;line-height:1.5;font-weight:700}
.near-bingo-banner{border:1px solid #cbb579;background:linear-gradient(100deg,#423624,#253c35);color:#ffe6b5}
.near-bingo-banner strong{font-weight:900;letter-spacing:.8px;color:#ffd484}
.tie-window-banner{justify-content:space-between;background:linear-gradient(110deg,#285248,#293a41);border:1px solid #77d5af;color:#dcffed;box-shadow:0 0 20px #79e9b118}
.tie-window-banner strong{font:900 17px Outfit,sans-serif;letter-spacing:.7px;color:#fff2b3}
.tie-window-banner b{display:inline-block;min-width:36px;text-align:center;font:900 19px Outfit,sans-serif;color:#ffdc8c}
@media(max-width:540px){.near-bingo-banner,.tie-window-banner{padding:12px;gap:6px}.tie-window-banner strong{font-size:15px}}