.board-shell{position:relative;padding:20px 20px 0;background:repeating-linear-gradient(1deg,transparent 0 8px,#98612a08 9px,transparent 10px 17px),linear-gradient(120deg,#e6bd7e,#f6deb0 36%,#e5bc7e 75%,#f2d39c);border:1px solid #d2a56b;border-radius:22px;box-shadow:0 7px 0 #b98d55,0 9px 0 #967246,0 28px 45px -12px #4f482650,inset 0 1px 2px #fff9}.board{aspect-ratio:1;position:relative;width:100%;border:1px solid #9c794e66;border-radius:10px;isolation:isolate;container-type:inline-size;background:repeating-linear-gradient(0deg,transparent 0 42px,#bc8a450a 43px,transparent 44px 54px)}.board-art{position:absolute;width:100%;height:100%;inset:0}.board-art .track-line{fill:none;stroke:#6b543a;stroke-width:.045}.board-art .field{fill:#fbf0d4;stroke:#755b3d;stroke-width:.035}.board-art .safe{fill:#ad946e;font-size:.27px;text-anchor:middle;dominant-baseline:central}.board-art .home{stroke-width:.04;stroke:#765b3b}.board-art .yard-ring{fill:none;stroke-width:.04;stroke:currentColor;opacity:.24}.board-art .base-label{font: .25px Segoe UI,sans-serif;letter-spacing:.065px;text-anchor:middle;fill:#795c3c}.board-art .center-label{font:italic .33px Georgia,serif;text-anchor:middle;fill:#775f40}.engraving{font-size:8px;letter-spacing:2px;text-align:center;color:#8e6b42;padding:13px 0 12px}.engraving span{margin:0 12px}.piece{--color:var(--red);position:absolute;width:5.6%;height:7.8%;padding:0;transform:translate(-50%,-80%);background:transparent;border:0;border-radius:45%;z-index:3;filter:drop-shadow(2px 4px 2px #49331b70);color:var(--color);transition:filter .2s;touch-action:manipulation}.piece svg{display:block;width:100%;height:100%;overflow:visible}.piece.red{--color:var(--red)}.piece.green{--color:var(--green)}.piece.yellow{--color:var(--yellow)}.piece.blue{--color:var(--blue)}.piece:disabled{opacity:1}.piece .number{font:700 17px Segoe UI,sans-serif;fill:#fff;paint-order:stroke;stroke:#0003;stroke-width:1px}.piece.selectable{cursor:pointer;z-index:5;filter:drop-shadow(0 0 4px white) drop-shadow(2px 4px 2px #49331b70)}.piece.selectable:after{content:'';position:absolute;inset:58% -12% -8%;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 2px var(--color);animation:pick 1.2s infinite;z-index:-1}.piece.selectable:hover{transform:translate(-50%,-90%) scale(1.12)}@keyframes pick{50%{opacity:.35;scale:1.16}}
:root{--ink:#ecf1df;--muted:#a1b5a6;--panel:#1c4238;--line:#ffffff16;--red:#dc5549;--green:#26956d;--yellow:#e8bb38;--blue:#368bcb;--gold:#edcb82;--color:var(--red);font-family:Segoe UI,system-ui,sans-serif;color:var(--ink);background:#102d26;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 40%,#2d5945,#102e27 75%);min-height:100dvh}button,input{font:inherit}button{cursor:pointer;border:0;transition:transform .18s,background .2s,box-shadow .2s}button:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-1px)}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:4px}input:focus{outline:2px solid var(--gold);outline-offset:2px}.hidden{display:none!important}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;gap:16px;border-bottom:1px solid var(--line);background:#102e27b3}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--gold);font-size:24px;font-weight:850;letter-spacing:3px;line-height:1}.brand-mark{font-size:38px;transform:rotate(-12deg);letter-spacing:0}.brand small{display:block;font-size:11px;color:#b5c3ae;letter-spacing:0;font-weight:500;margin-top:7px}.topbar nav,.top-room{display:flex;align-items:center;gap:12px}.top-room{font-size:12px;letter-spacing:1px;color:var(--muted)}#status{font-size:12px;color:#bdd1b7}.icon-button{min-height:40px;min-width:40px;border:1px solid var(--line);border-radius:10px;background:#ffffff06;color:var(--ink);padding:8px 12px;font-size:13px}.game-shell{max-width:1680px;margin:auto;display:grid;grid-template-columns:260px minmax(0,1fr) 260px;gap:24px;padding:22px 24px 12px;align-items:start}.controls,.social-card{border:1px solid #ffffff12;border-radius:18px;background:linear-gradient(150deg,#234b3f,#1a3d33);box-shadow:0 10px 26px #061e211a;padding:20px}.drawer-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.drawer-heading h2{font-size:23px;margin:0;letter-spacing:-.7px}.drawer-heading button{display:none}h1,h2,p{margin-top:0}h2{font-size:19px}label,legend{font-size:14px;font-weight:600;margin:0 0 8px;display:block}label>span{font-size:12px;font-weight:400;color:var(--muted);margin-left:6px}input{width:100%;min-width:0;padding:12px 13px;border:1px solid #ffffff26;background:#102f27;color:var(--ink);border-radius:10px;font-size:15px;min-height:46px}input::placeholder{color:#8ea99a}fieldset{border:0;padding:0;margin:16px 0}.color-picker{display:flex;gap:9px}.color-choice{width:42px;height:42px;background:var(--swatch);border:3px solid #fff3;border-radius:50%;position:relative;box-shadow:inset 0 -4px 3px #0003}.color-choice[aria-pressed=true]{border-color:var(--gold);outline:2px solid var(--gold);outline-offset:3px}.color-choice[aria-pressed=true]:after{content:'✓';font-weight:900;color:white;text-shadow:0 1px 3px #000b;font-size:21px}.color-choice:disabled{opacity:.28}.style-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.style-choice{height:80px;border:1px solid #ffffff22;background:#173a30;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--gold);font-size:12px}.style-choice svg{height:44px;width:32px;filter:drop-shadow(1px 2px 2px #0006)}.style-choice[aria-pressed=true]{border-color:var(--gold);background:#496046;box-shadow:inset 0 0 0 1px var(--gold)}.primary,.secondary{border-radius:11px;font-weight:700;font-size:14px;min-height:46px;padding:12px 14px}.primary{color:#253c28;background:linear-gradient(120deg,#f2d795,#dfb46b);box-shadow:0 3px 0 #a98b53,0 5px 12px #081b1a33}.primary:disabled{background:#617a61;color:#cad4bb;box-shadow:none}.secondary{background:#ffffff0b;border:1px solid #ffffff26;color:var(--ink)}.wide{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;margin:10px 0}.wide small{font-size:11px;font-weight:400;opacity:.75}.mode-row{display:flex;gap:8px;margin-top:11px}.mode-row>*{flex:1;min-width:0;padding:11px 8px}.checkline{display:flex;align-items:center;flex-wrap:wrap;gap:5px;font-size:13px;font-weight:400;margin:17px 0 13px}.checkline input{min-height:18px;height:18px;width:18px;accent-color:var(--gold)}.checkline span{font-size:11px;margin-left:23px;margin-top:-5px}.join{display:flex;gap:6px}.join input{font-size:13px}.join button{padding:10px}.hint{font-size:12px;color:var(--muted);line-height:1.6}.controls .hint{margin:13px 0 0}.text-button{background:none;color:var(--muted);font-size:13px;text-decoration:underline;text-underline-offset:5px;padding:12px 0;margin-top:8px}.rules{font-size:13px;line-height:1.7;color:var(--muted);border-top:1px solid var(--line);padding-top:10px}.rules p{margin-bottom:12px}.invite-banner{padding:12px;border:1px solid #e5c47d6b;background:#e5c47d12;border-radius:12px;margin-bottom:17px;font-size:13px}.invite-banner .wide{margin-bottom:3px}.arena{min-width:0;display:flex;flex-direction:column;align-items:center}.arena-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;max-width:720px;min-height:48px;margin-bottom:10px}.arena-heading>div>span{font-size:10px;letter-spacing:2px;color:#a9c3a2}.arena-heading h1{font-size:23px;letter-spacing:-.6px;margin:5px 0 0;line-height:1.2}.pill{background:#ffffff0a;border:1px solid #ffffff1c;border-radius:30px;padding:6px 10px;font-size:12px;color:#c0d0b5;white-space:nowrap}.seat-rail{display:flex;gap:6px;justify-content:center;align-items:center;width:100%;min-height:38px;margin-bottom:12px}.seat-chip{min-width:0;border:1px solid #ffffff22;border-radius:9px;padding:7px 10px;font-size:12px;display:flex;gap:6px;align-items:center;background:#153c30;max-width:25%}.seat-chip>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seat-chip.active{border-color:var(--gold);box-shadow:0 0 16px #f0c27b18;color:#f6dfa7}.dot{width:11px;height:11px;border-radius:50%;display:inline-block;flex-shrink:0}.red{background:var(--red)}.green{background:var(--green)}.yellow{background:var(--yellow)}.blue{background:var(--blue)}.board-stage{width:100%;display:flex;justify-content:center;perspective:1400px}.board-shell{width:min(100%,calc(100dvh - 292px));max-width:720px;padding:14px 14px 0;border-radius:23px;box-shadow:0 6px 0 #b98d55,0 8px 0 #967246,0 26px 48px -10px #001f20a6,inset 0 1px 2px #fff9;animation:table-in .6s ease-out}.board{border-radius:12px}.engraving{font-size:7px;letter-spacing:1.7px;padding:9px 0}.piece{width:5.9%;height:8.3%;transition:filter .2s;touch-action:manipulation}.piece:disabled{opacity:1}.piece:before{content:'';position:absolute;inset:-5px}.piece.red,.piece.green,.piece.yellow,.piece.blue{background:transparent}.piece.selectable{filter:drop-shadow(0 0 5px #fff6) drop-shadow(2px 4px 2px #49331b70)}.piece.selectable:after{border-color:#fffce3;box-shadow:0 0 0 3px var(--color);animation:pick .9s infinite}.board-art .field{fill:#fff5df;stroke:#86663e}.board-art .home{stroke:#74522c;opacity:.92}.board-art .yard-ring{opacity:.38;stroke-width:.045}.board-art .base-label{font-size:.28px}.board-art .track-line{stroke:#6f5333;stroke-width:.05}.board-art .center-label{font-size:.35px}.game-dock{display:flex;align-items:center;gap:20px;border:1px solid #ffffff20;border-radius:18px;background:linear-gradient(135deg,#315749,#1e4438);padding:13px 24px;margin-top:22px;width:100%;max-width:600px;box-shadow:0 9px 25px #001b1c33;position:relative}.dice-tray{perspective:400px;min-width:84px;min-height:82px;display:grid;place-items:center}.die{width:76px;height:76px;padding:12px;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);gap:6px;border-radius:16px;border:1px solid #d1bb88;background:linear-gradient(135deg,#fffdf0,#edddb5);color:#294437;box-shadow:3px 4px 0 #baac85,5px 9px 16px #001b2366;transform:rotate(-9deg)}.die:disabled{opacity:1}.die:not(:disabled){animation:ready-die 2.4s ease-in-out infinite}.die .pip{border-radius:50%;background:currentColor;box-shadow:inset 1px 2px 2px #0006}.die .pip.empty{visibility:hidden}.die.rolling{animation:tumble .18s linear infinite}.die.settled{animation:land .4s ease-out}.dock-action{flex:1;min-width:0}.dock-action .primary{font-size:17px;min-height:47px;margin:0 0 8px}.dock-action p{font-size:13px;line-height:1.5;margin:0;text-align:center;color:#c7d5bb;min-height:20px}.dice-caption{display:none}.board-hint{font-size:12px;color:#98b59a;text-align:center;margin:12px 0 0}.section-heading{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:1px;color:var(--muted);margin:7px 0 17px}.section-heading b{font:16px ui-monospace,monospace;letter-spacing:2px;color:var(--gold)}#lobby h2{font-size:22px}.members{display:grid;gap:8px;margin-bottom:16px}.member,.player{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#14372d;border:1px solid #ffffff12;border-radius:11px;padding:11px 10px;font-size:14px}.member>span,.player>span{display:flex;align-items:center;gap:7px;min-width:0}.member small,.player small{font-size:11px;color:var(--muted);white-space:nowrap}.player{margin-bottom:9px}.player.active{border-color:var(--gold);background:#405a3d;box-shadow:inset 3px 0 var(--gold)}.player.offline{opacity:.6}.history{margin-top:24px;border-top:1px solid var(--line);padding-top:16px;color:var(--muted);font-size:13px}.history summary{cursor:pointer}.history #log{font-size:12px;line-height:1.7;max-height:180px;overflow:auto;padding-top:15px}.history #log>div{padding-bottom:7px}.social-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.social-heading h2{font-size:17px;margin:0;letter-spacing:-.3px}.social-heading .icon-button{border:0;background:none}.social-card>.hint{margin:10px 0 14px}.rooms-list{display:grid;gap:10px;max-height:55dvh;overflow:auto}.room-card{border:1px solid #ffffff20;border-radius:12px;padding:13px;background:#15392e;animation:fade-in .25s ease-out}.room-card>div{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:14px;margin-bottom:10px}.room-card strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.room-card small{color:var(--muted);font-size:12px;white-space:nowrap}.room-card button{width:100%;min-height:39px;padding:8px}.empty-rooms{border:1px dashed #ffffff30;padding:20px 13px;text-align:center;border-radius:13px;font-size:14px;line-height:1.7;color:#b6cab0}.empty-rooms .primary{margin-top:16px}.match-note{display:flex;gap:12px;align-items:center;justify-content:center;color:#90ad91;margin-top:25px}.match-note>span{font-size:30px;color:var(--gold)}.match-note p{font-size:13px;line-height:1.8;margin:0}.match-note b{font-weight:500}.chat{padding:18px 16px}.chat-heading{border-bottom:1px solid var(--line)}.chat-live{color:#93bc91;font-size:9px;white-space:nowrap;letter-spacing:.5px}.chat-count{font-size:11px;background:#9cba9026;border-radius:30px;padding:3px 7px;margin-left:4px}.chat .social-heading .hint{display:block;margin-top:5px;font-size:11px}.messages{height:clamp(220px,45dvh,460px);overflow-y:auto;overscroll-behavior:contain;margin:17px -4px 12px;padding:0 4px;scrollbar-width:thin;scrollbar-color:#648167 transparent;display:flex;flex-direction:column;gap:12px}.chat-empty{margin:auto;text-align:center;font-size:14px;color:var(--muted);line-height:1.8;padding:15px}.chat-empty b{display:block;color:var(--gold);font-size:27px;margin-bottom:10px}.message{display:flex;flex-direction:column;gap:5px;align-items:flex-start;animation:message-in .2s ease-out}.message.mine{align-items:flex-end}.message-meta{font-size:11px;color:#b1c5ab;display:flex;align-items:center;gap:6px}.message-text{background:#ffffff0b;border:1px solid #ffffff0c;border-radius:3px 12px 12px;padding:9px 11px;font-size:14px;line-height:1.5;overflow-wrap:anywhere;white-space:pre-wrap;max-width:100%}.message.mine .message-text{background:#6a835838;border-color:#c1d18f27;border-radius:12px 3px 12px 12px}.reactions{display:flex;gap:6px;margin-bottom:10px}.reactions button{background:#ffffff08;border:1px solid #ffffff18;padding:6px 10px;border-radius:8px;color:#cad9bf;font-size:13px;min-height:34px}.chat-form{display:flex;gap:6px}.chat-form input{font-size:14px;padding:11px 10px}.chat-form .primary{padding:8px 14px;font-size:21px;min-width:43px}.chat-privacy{display:block;font-size:11px;color:#8ca98e;text-align:center;margin-top:10px}#menu{display:none}.drawer-backdrop{position:fixed;inset:0;background:#001b19b3;backdrop-filter:blur(5px);z-index:30}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:100;border:1px solid #d1b87966;background:#f4e6bf;color:#263d2b;padding:15px 20px;border-radius:12px;box-shadow:0 10px 35px #0005;font-size:14px;max-width:90%;display:none}#toast.show{display:block;animation:message-in .2s ease-out}.winner-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:10}.winner-confetti i{position:absolute;top:-10%;width:8px;height:15px;background:var(--color);animation:confetti 3s ease-in infinite;left:var(--x);animation-delay:var(--delay)}@keyframes confetti{to{transform:translateY(800px) rotate(700deg)}}@keyframes table-in{from{opacity:0;transform:translateY(16px) rotateX(4deg)}}@keyframes fade-in{from{opacity:0}}@keyframes message-in{from{opacity:0;transform:translateY(7px)}}@keyframes tumble{0%{transform:translateY(-5px) rotate(-15deg) rotateY(-22deg)}50%{transform:translateY(-17px) rotate(14deg) rotateY(28deg)}100%{transform:translateY(-5px) rotate(75deg) rotateY(-22deg)}}@keyframes land{0%{transform:translateY(-15px) rotate(8deg)}65%{transform:translateY(3px) rotate(-12deg)}100%{transform:rotate(-9deg)}}@keyframes ready-die{50%{box-shadow:3px 4px 0 #baac85,0 0 22px #e7c48066;transform:rotate(-5deg) translateY(-2px)}}@media(min-width:1500px){.game-shell{grid-template-columns:280px minmax(0,1fr) 280px;gap:38px;padding:24px 36px}.controls,.social-card{padding:24px}.board-shell{width:min(100%,calc(100dvh - 300px))}}@media(max-width:1150px){.game-shell{grid-template-columns:220px minmax(0,1fr) 225px;gap:15px;padding:18px 15px}.controls{padding:16px}.social-card{padding:15px}.style-choice{height:74px}.style-choice span{font-size:11px}.arena-heading h1{font-size:20px}.topbar{padding:0 18px}.game-dock{padding:12px 16px;gap:15px}.dock-action .primary{font-size:15px}.dock-action p{font-size:12px}.board-shell{padding:10px 10px 0}.engraving{font-size:6px;letter-spacing:1px}.color-picker{gap:7px}.color-choice{width:37px;height:37px}.messages{height:40dvh}.room-card{padding:10px}.social-heading h2{font-size:16px}.brand{font-size:22px}.top-room{font-size:10px}.topbar nav{gap:7px}}
@media(max-width:900px){.game-shell{grid-template-columns:minmax(0,1fr) 250px;gap:20px;padding:16px 20px}.arena{grid-column:1;grid-row:1}.social{grid-column:2;grid-row:1}.controls{position:fixed;top:76px;bottom:16px;left:16px;width:310px;overflow-y:auto;z-index:40;display:none;padding:22px;box-shadow:10px 20px 50px #00171699}.controls.open{display:block;animation:message-in .25s ease-out}.drawer-heading button{display:block}#menu{display:block}.top-room{display:none}.board-shell{width:min(100%,calc(100dvh - 300px))}.arena-heading h1{font-size:21px}.social-card{padding:18px}.color-choice{width:44px;height:44px}.style-choice{height:82px}.style-choice span{font-size:12px}.checkline span{margin:0 0 0 4px}.topbar .icon-button{font-size:12px}}
@media(max-width:640px){.topbar{height:64px;padding:0 12px;gap:6px}.brand{font-size:21px;letter-spacing:2px;gap:6px}.brand-mark{font-size:30px}.brand small{font-size:9px;margin-top:5px}.topbar nav{gap:5px}#status{font-size:0}#status:before{content:'●';font-size:10px;color:#9abc88}.topbar .icon-button{padding:7px 9px;min-width:37px;font-size:11px;min-height:38px}#sound{font-size:0}#sound:before{content:'♫';font-size:17px}.game-shell{display:flex;flex-direction:column;padding:12px 12px 18px;gap:18px}.arena{width:100%}.arena-heading{margin-bottom:8px;min-height:38px}.arena-heading>div>span{font-size:8px;letter-spacing:1.6px}.arena-heading h1{font-size:20px;margin-top:4px}.pill{font-size:10px;padding:5px 8px}.seat-rail{min-height:33px;gap:4px;margin-bottom:10px}.seat-chip{padding:6px;font-size:11px;gap:5px;max-width:25%}.dot{height:10px;width:10px}.board-shell{width:min(100%,calc(100dvh - 288px));max-width:560px;padding:9px 9px 0;border-radius:17px}.engraving{font-size:5px;padding:7px 0;letter-spacing:1.1px}.board{border-radius:9px}.board-art .base-label{font-size:.31px}.piece{width:6.6%;height:9.2%}.game-dock{margin-top:19px;padding:11px 14px;gap:16px;border-radius:14px;min-height:102px}.dice-tray{min-width:69px;min-height:72px}.die{height:66px;width:66px;padding:11px;gap:5px;border-radius:13px}.dock-action .primary{font-size:16px;min-height:44px;margin-bottom:7px}.dock-action p{font-size:12px;line-height:1.4;min-height:18px}.board-hint{font-size:11px;margin-top:8px}.social{width:100%}.chat{padding:16px}.messages{height:150px;margin:14px 0 12px;gap:9px}.message-text{font-size:14px;padding:8px 11px}.message-meta{font-size:11px}.chat .social-heading h2{font-size:17px}.chat .social-heading .hint{font-size:11px}.chat-privacy{font-size:11px}.reactions{position:absolute;right:16px;top:15px;margin:0}.chat{position:relative}.chat-live{display:none}.reactions button{padding:5px 8px;min-height:33px;font-size:12px}.chat .social-heading{padding-right:130px}.chat-form input{font-size:15px}.social .rooms-list{max-height:230px}.match-note{display:none}.controls{top:auto;left:10px;right:10px;bottom:10px;width:auto;max-height:calc(100dvh - 85px);padding:19px 20px;border-radius:20px}.drawer-heading{margin-bottom:13px}.drawer-heading h2{font-size:22px}.customizer{display:grid;grid-template-columns:1fr 1.25fr;gap:15px}.customizer fieldset{min-width:0;margin:14px 0 13px}.customizer legend{font-size:13px}.color-picker{display:grid;grid-template-columns:repeat(2,35px);gap:9px}.color-choice{width:35px;height:35px}.style-choice{height:78px;padding:3px}.style-choice span{font-size:10px}.style-picker{gap:5px}.style-choice svg{height:43px;width:29px}.controls input{min-height:44px}.controls .hint{font-size:12px}.checkline{margin:13px 0}.checkline span{font-size:11px}.controls .wide{margin:8px 0}.invite-banner{padding:10px;margin-bottom:12px}#lobbyCustomizer .customizer{margin-top:5px}.members{gap:6px}.member{padding:9px 10px}.room-card button{font-size:14px}.rooms-list{grid-template-columns:repeat(2,minmax(0,1fr))}.empty-rooms{grid-column:1/-1}.room-card>div{flex-wrap:wrap}.room-card strong{width:100%}.social-heading>h2{font-size:17px}.controls .rules{font-size:13px}body.drawer-open{overflow:hidden}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition:none!important}}
@media(min-width:901px){.topbar{height:68px}.game-shell{padding-top:16px}.board-shell{width:min(100%,calc(100dvh - 300px))}.game-dock{margin-top:18px;padding-top:7px;padding-bottom:7px}.controls{max-height:calc(100dvh - 102px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#668363 transparent}.board-hint{display:none}}
.messages{height:clamp(180px,29dvh,310px)}
@media(max-width:640px){.messages{height:100px;margin:10px 0}.chat{padding:13px}.chat .social-heading{padding-right:127px}.chat .reactions{top:12px;right:12px}.board-hint{display:none}.game-shell{gap:12px}.chat-privacy{font-size:10px;margin-top:7px}}
.dock-buttons{display:flex;align-items:stretch;gap:8px}.dock-buttons .primary{flex:1;min-width:0;margin:0!important}.dock-buttons #leave{flex-shrink:0;font-size:14px;min-width:62px;padding:10px}.dock-action>p{margin-top:9px}.piece{width:7%;height:9.8%}#addBot{width:100%}
@media(max-width:640px){.piece{width:7.4%;height:10.4%}.game-dock{gap:12px;padding-left:12px;padding-right:12px}.dock-buttons .primary{font-size:15px}.dock-buttons #leave{min-width:59px;font-size:14px;padding:10px 8px}.dock-action>p{font-size:12px;line-height:1.4}}
.board-reactions{display:flex;align-items:center;justify-content:center;gap:5px;margin:0 0 12px;padding:6px 9px;border:1px solid #ffffff20;border-radius:14px;background:#12362bc4;max-width:100%}.board-reactions button,.reactions button{display:grid;place-items:center;font-size:23px;width:40px;min-height:40px;padding:3px;background:transparent;border:1px solid transparent;border-radius:9px;line-height:1}.board-reactions button:hover,.reactions button:hover{background:#e3c98120;border-color:#e3c98166;transform:translateY(-3px) scale(1.15)}.board-reactions button:active,.reactions button:active{transform:scale(.88)}.reactions{display:flex;gap:2px;flex-wrap:wrap;margin:0 0 10px;position:static}.reactions button{font-size:21px;width:36px;min-height:36px;flex:1 0 16%}.floating-reactions-overlay{position:absolute;inset:0;border-radius:inherit;overflow:hidden;z-index:25;pointer-events:none}.floating-reaction{position:absolute;top:66%;display:flex;align-items:center;flex-direction:column;gap:4px;animation:float-reaction 3.3s cubic-bezier(.15,.65,.4,1) forwards;will-change:transform,opacity}.floating-emoji{font-size:clamp(38px,5vw,66px);line-height:1.15;filter:drop-shadow(0 3px 4px #102f2955)}.reaction-player{display:flex;gap:6px;align-items:center;max-width:160px;padding:6px 10px;border:1px solid #ffffff40;border-radius:20px;background:#102f29ed;box-shadow:0 3px 9px #102f2944;color:#fff8de;font-size:13px;font-weight:600;white-space:nowrap}.reaction-player>span{overflow:hidden;text-overflow:ellipsis}.reaction-player .dot{width:11px;height:11px;border:1px solid #fff5}@keyframes float-reaction{0%{opacity:0;transform:translate(-50%,22px) scale(.45)}12%{opacity:1;transform:translate(-50%,0) scale(1.12)}30%{opacity:1;transform:translate(calc(-50% + var(--drift)*.2),-35px) scale(1)}75%{opacity:1;transform:translate(calc(-50% + var(--drift)*.7),-150px) scale(1.04)}100%{opacity:0;transform:translate(calc(-50% + var(--drift)),-235px) scale(.9)}}
@media(min-width:901px){.board-shell{width:min(100%,calc(100dvh - 356px))}}
@media(max-width:640px){.board-reactions{gap:1px;width:100%;justify-content:space-between;padding:4px;margin-bottom:10px;border-radius:12px}.board-reactions button{width:34px;min-height:36px;font-size:22px;padding:2px}.chat .reactions{position:static;margin:4px 0 9px;gap:0;flex-wrap:nowrap;justify-content:space-between}.chat .reactions button{font-size:21px;min-width:0;width:auto;flex:1 1 0;min-height:36px;padding:2px}.chat .social-heading{padding-right:0}.floating-emoji{font-size:47px}.reaction-player{font-size:12px;padding:5px 9px;max-width:140px}}
@media(prefers-reduced-motion:reduce){.floating-reaction{animation:reaction-still 2s linear forwards!important}@keyframes reaction-still{0%,100%{opacity:0;transform:translate(-50%,-45px)}15%,85%{opacity:1;transform:translate(-50%,-45px)}}}
@media(min-width:641px){.piece{width:7.4%;height:10.4%}}
.mobile-welcome{display:none}.room-tools{display:flex;gap:8px;justify-content:center;width:100%;max-width:600px;margin:0 0 10px}.room-tools button{flex:1;min-height:44px;font-size:14px;padding:10px 12px;background:#274f41;border-color:#d0ca9b3d}.room-tools button:disabled{opacity:.5}.app-dialog{border:1px solid #e4ce8c50;border-radius:22px;background:linear-gradient(145deg,#244e40,#12362d);color:var(--ink);padding:24px;width:min(420px,calc(100% - 24px));max-height:calc(100dvh - 40px);overflow:auto;box-shadow:0 20px 80px #001a1c99}.app-dialog::backdrop{background:#001c1abf;backdrop-filter:blur(5px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:18px}.dialog-heading h2{font-size:23px;margin:0}.app-dialog p{font-size:15px;line-height:1.7;color:#c5d5bb}.app-dialog h3{font-size:16px;margin:12px 0}.app-dialog ol{font-size:15px;line-height:1.7;padding-left:23px}.app-dialog li{margin-bottom:9px}.app-dialog .hint{font-size:12px}.install-icon{border-radius:18px;box-shadow:0 5px 15px #001b1950}.install-button{color:var(--gold);border-color:#e1c57966}.app-dialog input{font-size:16px}#inviteLink{font-size:14px}
@media(min-width:901px){.board-shell{width:min(100%,calc(100dvh - 408px))}}
@media(max-width:900px){.mobile-welcome{display:block;width:100%;max-width:550px;margin-bottom:18px;padding:17px;background:linear-gradient(130deg,#285743,#1a4034);border:1px solid #ffffff26;border-radius:18px;box-shadow:0 8px 28px #001c1b22}.mobile-intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.mobile-intro h2{font-size:23px;margin:0}.mobile-intro .text-button{margin:0;padding:7px;font-size:13px;color:var(--gold)}.mobile-welcome input{font-size:16px;min-height:44px}.mobile-modes,.mobile-links{display:flex;gap:8px;margin-top:10px}.mobile-modes button,.mobile-links button{flex:1;padding:11px 8px;min-height:46px;font-size:14px}.mobile-links button{font-size:13px;background:#ffffff06}.install-promo{display:flex;align-items:center;gap:9px;border-top:1px solid #ffffff18;margin-top:16px;padding-top:13px}.install-promo>span{font-size:27px;color:var(--gold)}.install-promo p{margin:0;flex:1;font-size:12px;line-height:1.5}.install-promo small{display:block;color:var(--muted);font-size:11px}.install-promo button{font-size:12px;min-height:38px;padding:8px 11px}.mobile-welcome.has-invite .mobile-modes{display:none}.mobile-welcome.has-invite .mobile-links{display:none}body:not([data-mode]) .arena-heading,body:not([data-mode]) .seat-rail,body:not([data-mode]) .board-reactions{display:none}body:not([data-mode]) .game-dock{display:none}.controls{top:auto;bottom:max(12px,env(safe-area-inset-bottom));max-height:calc(100dvh - 90px)}.app-dialog{padding:21px}.room-tools{gap:8px;margin:0 0 9px}}
@media(max-width:640px){.topbar{height:calc(60px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);position:sticky;top:0;z-index:26;background:#102e27fa;backdrop-filter:blur(10px)}.brand{font-size:19px;gap:5px;letter-spacing:1.3px}.brand-mark{font-size:29px}.brand small{font-size:8px}.topbar nav{gap:4px}.topbar .icon-button{min-height:38px;padding:7px 8px}.topbar .install-button{font-size:11px;white-space:nowrap}.game-shell{padding:10px 10px calc(14px + env(safe-area-inset-bottom));gap:12px}.mobile-welcome{padding:16px;margin-bottom:13px}.arena-heading{min-height:37px;margin-bottom:7px}.arena-heading h1{font-size:19px}.arena-heading>div>span{font-size:8px}.seat-rail{margin-bottom:8px;min-height:29px}.seat-chip{padding:5px 7px}.room-tools button{font-size:14px;min-height:44px;padding:9px 8px;border-radius:10px}.board-reactions{margin-bottom:8px}.board-shell{width:min(100%,calc(100svh - 342px));padding:8px 8px 0}.game-dock{position:sticky;bottom:max(8px,env(safe-area-inset-bottom));z-index:20;margin-top:15px;min-height:94px;padding:9px 11px;gap:12px;background:linear-gradient(135deg,#315749,#1b4035);box-shadow:0 7px 26px #001b1b66}.dice-tray{min-width:62px;min-height:66px}.die{width:60px;height:60px;padding:10px;gap:4px;border-radius:12px}.dock-buttons .primary{font-size:15px;min-height:46px}.dock-buttons #leave{min-height:46px}.dock-action>p{font-size:12px;margin-top:7px}.chat-form input{font-size:16px}.app-dialog input{font-size:16px;min-height:48px}.chat{padding:14px}.messages{height:110px}.chat .reactions button{font-size:23px;min-height:38px}.chat .social-heading h2{font-size:18px}#toast{bottom:calc(18px + env(safe-area-inset-bottom));font-size:14px;width:max-content;max-width:calc(100% - 24px)}.app-dialog{margin:auto auto max(12px,env(safe-area-inset-bottom));max-height:calc(100dvh - 40px)}}
.app-dialog .join-error{color:#ffcf8c;font-size:14px;margin:8px 0;line-height:1.5}.join-error:empty{display:none}
@media(min-width:901px){.arena>.seat-rail{display:none}.board-shell{width:min(100%,calc(100dvh - 360px))}}
