@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#203a31;background:#f4f3ed;font-synthesis:none;--green:#173e31;--gold:#e5b979}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;transition:background .2s,transform .2s}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #cf923f;outline-offset:4px}header{height:98px;padding:0 6%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #dddfd6}.brand{display:flex;gap:13px;align-items:center;font-size:42px;color:var(--green);text-decoration:none}.brand>span{font-family:'Space Grotesk',sans-serif;font-size:26px;font-weight:700;letter-spacing:-1px}.brand-light{font-weight:400}.brand small{display:block;font-family:'DM Sans',sans-serif;font-size:8px;letter-spacing:2px;margin-top:4px}.text-button{border:0;background:none;color:var(--green);font-size:13px;padding:10px 0}.text-button span{margin-left:20px}main{max-width:1450px;margin:auto;padding:38px 6% 0}.intro{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:#718074}h1{font-family:'Space Grotesk',sans-serif;font-size:40px;line-height:1.16;letter-spacing:-1.8px;font-weight:500;margin:12px 0 0}h1 em{font-style:normal;color:#7a887a}.variant{font-size:10px;letter-spacing:1px;padding:11px 15px;border:1px solid #d9ddd3;border-radius:30px}.variant span{border-left:1px solid #cbd1c6;margin-left:9px;padding-left:9px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}.arena{background:#132c25;border-radius:18px;padding:17px 20px 0;box-shadow:0 8px 24px #132c2510;overflow:hidden}.arena-top{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;color:#9dad9e;padding:1px 1px 16px}.live-dot{color:#b6c9a7;font-size:8px}.felt{position:relative;min-height:466px;border-radius:120px;background:radial-gradient(ellipse at center,#2b634b,#204c3b 65%,#1b4334);border:1px solid #62816a4d;box-shadow:inset 0 0 0 9px #132c2526,inset 0 0 65px #071e1a55;display:flex;flex-direction:column;align-items:center;padding:20px 0 15px}.felt:before{content:'';position:absolute;inset:14px;border:1px dashed #82a48425;border-radius:110px;pointer-events:none}.player{display:flex;gap:9px;align-items:center;color:#e9eddf;z-index:1}.avatar{width:31px;height:31px;border-radius:50%;background:#bb9c6e;color:#223e30;display:grid;place-items:center;font-size:12px;font-weight:700;border:3px solid #56715b}.player strong{font-size:11px}.player small{display:block;color:#b0c4b1;font-size:9px;margin-top:3px}.cards{display:flex;justify-content:center;gap:9px}.opponent-cards{margin-top:15px;gap:0}.card{width:75px;height:105px;background:#fffdf4;border-radius:7px;box-shadow:0 3px 7px #081c2750;position:relative;display:inline-flex;align-items:center;justify-content:center;color:#263c36;flex-shrink:0}.card b{font-size:38px;font-weight:400}.card.red{color:#b7473e}.corner{position:absolute;top:7px;left:7px;font-size:13px;font-weight:700;letter-spacing:-1px}.corner.bottom{top:auto;left:auto;bottom:7px;right:7px;transform:rotate(180deg)}.back{background:repeating-linear-gradient(45deg,transparent,transparent 5px,#a8b9a718 5px,#a8b9a718 6px),#193f35;border:4px solid #e9e9d5;outline:1px solid #c9ccba;box-shadow:inset 0 0 0 2px #8d9d7b}.back:after{content:'♣';color:#b5ba94;font-size:35px}.opponent-cards .card{width:54px;height:75px}.opponent-cards .card:first-child{transform:rotate(-12deg) translate(9px,3px)}.opponent-cards .card:last-child{transform:rotate(12deg) translate(-9px,3px)}.table-center{display:flex;align-items:center;width:100%;height:139px;position:relative}.deck-area{position:absolute;left:11%;display:flex;align-items:center}.deck-area .card{width:49px;height:69px}.deck-area .deck{transform:rotate(-7deg);margin-right:-20px}.deck-area #vira{transform:rotate(10deg)}.deck-area .card b{font-size:27px}.deck-area .corner{font-size:10px;top:4px;left:4px}.deck-area small{position:absolute;bottom:-22px;left:22px;font-size:8px;letter-spacing:2px;color:#a1b79f}.played{margin:auto;display:flex;gap:13px;align-items:center;height:100%}.played .card{width:63px;height:88px}.played-mine{transform:rotate(8deg)}.played-other{transform:rotate(-8deg)}.watermark{font-size:64px;color:#acc0a31c;text-align:center}.watermark small{display:block;font-size:8px;letter-spacing:3px;margin-top:-8px}.rounds{display:flex;gap:7px;margin:0 0 12px}.rounds span{width:22px;height:22px;border:1px solid #9eb29b50;border-radius:50%;display:grid;place-items:center;color:#bdc8b0;font-size:9px}.rounds .won{background:#e5b979;color:#243e30}.rounds .lost{background:#19382c}.my-hand{height:107px;z-index:1}.card-button{border:0;background:none;padding:0;transition:transform .2s}.card-button:not(:disabled):hover{transform:translateY(-12px) rotate(-3deg)}.card-button:disabled{opacity:.85}.me{margin-top:16px}.me .avatar{background:#dfb985}.table-footer{min-height:87px;display:flex;justify-content:space-between;align-items:center;gap:15px;color:#f2f0df}.table-footer .eyebrow{color:#94aa96;font-size:8px}.table-footer p{font-size:12px;margin:6px 0 0;max-width:330px}#actions{display:flex;gap:8px;align-items:center}.stake{font-size:10px;color:#bac6ad;white-space:nowrap}.panel{border:1px solid #daddd2;border-radius:13px;padding:24px;background:#fafaf5;margin-bottom:17px}h2{font-family:'Space Grotesk',sans-serif;font-size:23px;letter-spacing:-.8px;font-weight:500;margin:9px 0 23px}label{display:block;font-size:10px;color:#6a786d;margin-bottom:7px}input{width:100%;border:1px solid #d9ded1;background:#f4f5ee;border-radius:6px;padding:12px;color:#203a31;font-size:12px;min-width:0}input::placeholder{color:#99a093}.primary,.secondary{display:block;width:100%;border:0;border-radius:6px;padding:13px 15px;font-size:12px;font-weight:600}.primary{background:var(--green);color:#fffcef}.primary:hover{background:#28573f}.primary span{float:right}.setup>.primary{margin-top:15px}.secondary{background:#eceee4;color:#294936;border:1px solid #dce1d3}.secondary:hover{background:#e1e6d7}.hint{font-size:9px;color:#89917f;text-align:center;margin:10px 0 22px}.divider{font-size:8px;letter-spacing:1.3px;color:#8a9383;display:flex;align-items:center;gap:8px;margin-bottom:18px}.divider:before,.divider:after{content:'';height:1px;background:#e1e5d8;flex:1}form{margin-top:20px}.join-row{display:flex;gap:7px}.join-row input{text-transform:uppercase;letter-spacing:1px}.join-button{border:1px solid #d9ded1;background:#eceee4;color:#234632;border-radius:6px;width:44px;font-size:20px}.score-panel{padding-bottom:17px}.score-panel h2{margin-bottom:19px}.score{display:flex;justify-content:space-around;align-items:center}.score>div{text-align:center;max-width:42%;overflow:hidden}.score div span{display:block;font-size:10px;color:#7d8878;overflow:hidden;text-overflow:ellipsis}.score strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:47px;font-weight:500;letter-spacing:-3px;line-height:1.4}.score-x{font-size:15px;color:#abb19f}.progress{display:flex;gap:4px;height:4px;background:#e5e8dc;border-radius:4px;margin-top:8px;overflow:hidden}.progress i{background:#2c5940;width:0;max-width:50%}.progress i:last-child{background:#c2a072}.score-bottom{border-top:1px solid #e1e5d7;margin-top:17px;padding-top:12px;display:flex;justify-content:space-between;font-size:9px;color:#85907e}.note{display:flex;align-items:center;justify-content:center;gap:14px;color:#858d7b}.note span{font-size:27px;color:#b5a480}.note p{font-size:11px;line-height:1.7}.table-footer .primary{background:var(--gold);color:#253b2b;white-space:nowrap;width:auto}.table-footer .secondary{width:auto;white-space:nowrap}.room-panel p{font-size:12px;color:#6e7a69;line-height:1.7}.room-panel h2{margin-bottom:12px}.room-panel .text-button{margin-top:10px}footer{display:flex;justify-content:space-between;padding:28px 0;color:#8e9686;font-size:8px;letter-spacing:1.5px}dialog{border:1px solid #daddd2;border-radius:16px;background:#fafaf5;color:#203a31;max-width:530px;padding:32px}dialog::backdrop{background:#0b221bcc;backdrop-filter:blur(5px)}dialog p{font-size:13px;line-height:1.8}.close{float:right;margin-top:-15px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#182e25;color:#f8efd9;border:1px solid #cba96d;padding:15px 24px;border-radius:10px;z-index:10;max-width:90%;font-size:13px}[hidden]{display:none!important}
@media(min-width:1350px){.felt{min-height:500px;padding-top:26px}.table-center{height:158px}.arena{padding:20px 28px 0}.table-footer{min-height:100px}}
@media(max-width:980px){main{padding:28px 4% 0}header{padding:0 4%}.layout{grid-template-columns:minmax(0,1fr) 260px;gap:16px}.panel{padding:19px}.arena{padding:15px 12px 0}.deck-area{left:5%}.table-footer{flex-direction:column;align-items:start;padding:15px 2px;gap:13px}#actions{align-self:end}.felt{border-radius:75px}.felt:before{border-radius:65px}h1{font-size:34px}}
@media(max-width:700px){header{height:78px}.brand>span{font-size:23px}.brand{font-size:35px}main{padding-top:23px}.intro{align-items:start;gap:12px}h1{font-size:29px;letter-spacing:-1px}.eyebrow{font-size:8px}.variant{font-size:8px;padding:9px;margin-top:2px}.variant span{display:none}.layout{display:flex;flex-direction:column}.arena{width:100%}.felt{min-height:447px}.table-center{height:130px}.deck-area{left:6%}.table-footer{flex-direction:row;align-items:center;min-height:88px}.table-footer p{font-size:10px}.table-footer .primary,.table-footer .secondary{font-size:10px;padding:11px}#actions{align-self:center;flex-wrap:wrap;justify-content:end;min-width:100px}.stake{font-size:9px}.layout aside{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}.setup{grid-column:1/-1;order:-1}.panel{margin:0}.note{grid-column:1/-1}.score-panel h2{font-size:20px}.score strong{font-size:37px}.room-panel h2{font-size:19px}footer{font-size:7px;letter-spacing:.6px;gap:20px}.arena-top{font-size:8px}.live-dot{font-size:7px}.played{padding-left:30px}.played .card{width:56px;height:80px}.table-footer .eyebrow{font-size:7px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Duplas, sala mista e movimento da mesa */
select{width:100%;border:1px solid #d9ded1;background:#f4f5ee;border-radius:6px;padding:11px;color:#203a31;font:inherit;font-size:12px;margin-bottom:12px}.format-label{margin-top:14px}#join-seat{margin-top:0;margin-bottom:0}#join-form>label:last-of-type{margin-top:12px}#chairs{margin:18px 0}.chair-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 0;border-bottom:1px solid #e2e6da;font-size:11px}.chair-row small{display:block;font-size:9px;color:#7c8876;margin-top:4px}.chair-row.ally{border-left:3px solid #568268;padding-left:9px}.chair-row.rival{border-left:3px solid #c4a071;padding-left:9px}.chair-toggle{background:#eceee4;border:1px solid #d5ddcd;border-radius:5px;padding:7px;color:#294936;font-size:10px;white-space:nowrap}#begin{margin-bottom:12px}button:disabled{opacity:.55}.current-turn{outline:2px solid #e5b979;outline-offset:7px;border-radius:7px}.felt{transition:box-shadow .3s}.felt.my-turn{box-shadow:inset 0 0 0 9px #132c2526,inset 0 0 65px #071e1a55,0 0 0 2px #e5b97955}.side-seat{position:absolute;top:44%;width:105px;text-align:center;z-index:2;color:#f2f0de}.side-seat.left{left:24px}.side-seat.right{right:24px}.side-seat strong{font-size:11px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side-seat small{font-size:8px;color:#b6c6ad;display:block;margin-top:4px}.mini-cards{display:flex;justify-content:center;margin-top:10px}.mini-cards .card{width:26px;height:38px;border-width:2px;border-radius:3px;margin-left:-5px}.mini-cards .card:after{font-size:18px}.doubles .deck-area{left:14%;top:-8px}.doubles .deck-area .card{width:33px;height:47px}.doubles .deck-area .corner{font-size:8px}.doubles .deck-area .card b{font-size:20px}.doubles .deck-area small{left:7px;font-size:7px}.doubles .table-center{height:166px}.doubles .played{position:relative;width:174px;padding:0}.trick-card{display:flex;flex-direction:column;align-items:center;gap:4px}.trick-card small{max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c3cfb9;font-size:8px}.doubles .trick-card{position:absolute}.doubles .trick-card .card{width:43px;height:60px}.doubles .trick-card .card b{font-size:27px}.doubles .trick-card .corner{font-size:10px;top:4px;left:4px}.doubles .trick-card .corner.bottom{top:auto;left:auto;bottom:4px;right:4px}.doubles .trick-card[data-position='0']{bottom:0;left:65px}.doubles .trick-card[data-position='2']{top:0;left:65px}.doubles .trick-card[data-position='1']{top:45px;left:4px}.doubles .trick-card[data-position='3']{top:45px;right:4px}.deal-in{animation:deal-in .55s both;animation-delay:var(--delay,0ms)}.play-in{animation:play-in .4s cubic-bezier(.2,.8,.2,1) both}.trick-card[data-position='0']{--from-x:0px;--from-y:90px}.trick-card[data-position='1']{--from-x:-100px;--from-y:0px}.trick-card[data-position='2']{--from-x:0px;--from-y:-90px}.trick-card[data-position='3']{--from-x:100px;--from-y:0px}.score-pop{animation:score-pop .6s ease-out}.truco-pop{animation:truco-pop .5s ease-out}.progress i{transition:width .6s ease}.score strong{transition:color .3s}
@keyframes deal-in{from{opacity:0;transform:translate(30px,-65px) rotate(10deg) scale(.7)}to{opacity:1;transform:translate(0,0) rotate(0) scale(1)}}
@keyframes play-in{from{opacity:0;transform:translate(var(--from-x,0px),var(--from-y,70px)) scale(.7) rotate(-15deg)}to{opacity:1;transform:translate(0,0) scale(1) rotate(0)}}
@keyframes score-pop{0%{box-shadow:0 0 0 0 #d3a05a99}55%{box-shadow:0 0 0 9px #d3a05a22}100%{box-shadow:0 0 0 0 transparent}}
@keyframes truco-pop{0%{transform:scale(.9);color:#e5b979}45%{transform:scale(1.04);color:#e5b979}100%{transform:scale(1)}}
@media(max-width:980px){.side-seat{width:75px}.side-seat.left{left:12px}.side-seat.right{right:12px}.doubles .deck-area{left:12%}.doubles .played{width:145px}.doubles .trick-card[data-position='0'],.doubles .trick-card[data-position='2']{left:51px}.doubles .trick-card[data-position='1']{left:0}.doubles .trick-card[data-position='3']{right:0}.doubles .trick-card small{max-width:49px;font-size:7px}}
@media(max-width:700px){.side-seat{width:65px}.side-seat.left{left:9px}.side-seat.right{right:9px}.side-seat strong{font-size:9px}.side-seat small{font-size:7px}.doubles .deck-area{left:9%;top:-8px}.felt.doubles{min-height:480px}.doubles .table-center{height:171px}.room-panel{grid-column:1/-1}.score-panel{grid-column:1/-1}.layout aside .room-panel{order:-1}.doubles .played{width:150px}.doubles .trick-card[data-position='0'],.doubles .trick-card[data-position='2']{left:53px}.my-hand .card{width:67px;height:96px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Sala: entrar primeiro, escolher a cadeira depois */
.lobby-mode{min-height:620px;border-radius:32px;padding:24px}.lobby-mode> :not(#seat-picker){display:none!important}#seat-picker{width:100%;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:auto auto auto;gap:16px;align-items:center;z-index:1}.lobby-center{grid-column:2;grid-row:2;text-align:center;color:#eceddd}.lobby-center b{display:block;font-size:46px;color:#e5b979}.lobby-center strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:500}.lobby-center small{display:block;font-size:10px;color:#b9c9b1;margin-top:7px}.seat-choice{display:flex;flex-direction:column;align-items:stretch;gap:9px;border:1px solid #6a8e7355;background:#173f32e8;border-radius:12px;padding:14px;color:#e9eedd;min-width:0;box-shadow:0 4px 12px #102b2020}.seat-choice>strong{font-size:10px;color:#cbb58b}.seat-choice>span{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seat-choice label{margin:0;color:#adc1a6;font-size:9px}.seat-choice select{font-size:10px;padding:8px;margin:0;background:#eaf0e0}.seat-choice>small{font-size:9px;line-height:1.5;color:#afc3a9}.seat-choice .chair-toggle{background:#d9bd87;border:0;padding:9px;color:#173e31;font-weight:600}.seat-choice.own-chair{border-color:#e5b979;box-shadow:0 0 0 2px #e5b97922}.chair-0{grid-row:3;grid-column:2}.chair-1{grid-row:2;grid-column:1}.chair-2{grid-row:1;grid-column:2}.chair-3{grid-row:2;grid-column:3}.two-chairs .chair-1{grid-row:1;grid-column:2}.two-chairs .lobby-center{grid-row:2;grid-column:2}.rule-toggle{display:flex;gap:9px;align-items:start;padding:10px 0;border-top:1px solid #e1e5d8;font-size:12px}.rule-toggle input{width:16px;height:16px;margin:0;accent-color:#204c38;flex-shrink:0}.rule-toggle small{display:block;font-size:10px;line-height:1.5;margin-top:5px;color:#819078}.settings-note{font-size:10px;line-height:1.6;color:#7c8875}#waiting-members{font-size:11px;line-height:1.7;color:#4a634b;margin:12px 0}#back-lobby{margin-bottom:12px}.room-panel #chairs:empty{display:none}.room-panel:has(#room-settings) h2{margin-bottom:14px}.room-panel{overflow:hidden}
@media(max-width:1100px){.lobby-mode{padding:18px 12px}#seat-picker{gap:9px}.seat-choice{padding:11px 8px}.seat-choice>strong{font-size:9px}.seat-choice>span{font-size:11px}.lobby-center strong{font-size:13px}.lobby-center small{font-size:9px}}
@media(max-width:980px){#seat-picker.four-chairs{grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto}.four-chairs .lobby-center{grid-column:1/-1;grid-row:1;margin-bottom:7px}.four-chairs .chair-0{grid-column:1;grid-row:2}.four-chairs .chair-2{grid-column:2;grid-row:2}.four-chairs .chair-1{grid-column:1;grid-row:3}.four-chairs .chair-3{grid-column:2;grid-row:3}.lobby-mode{min-height:590px}.seat-choice{padding:13px}.lobby-center b{font-size:34px}}
@media(max-width:700px){.lobby-mode{min-height:560px;border-radius:24px}.room-panel{grid-column:1/-1}#seat-picker.two-chairs{grid-template-columns:1fr 2fr 1fr}.seat-choice>strong{font-size:10px}.seat-choice>span{font-size:12px}.seat-choice select{font-size:11px}}
/* A sala e a partida ocupam a área útil da janela. */
html,body{height:100%;margin:0}body{height:100dvh;display:flex;flex-direction:column}header{height:56px;flex:0 0 56px;padding:0 24px}.brand{font-size:32px}.brand>span{font-size:22px}.brand small{font-size:7px}main{width:100%;max-width:1440px;flex:1;min-height:0;display:flex;flex-direction:column;padding:16px 24px 18px;margin:0 auto}.intro{margin:0 0 16px;align-items:center}h1{font-size:25px;line-height:1.1;margin:5px 0 0}h1 br{display:none}h1 em{margin-left:8px}.intro>.eyebrow{font-size:8px}.layout{flex:1;min-height:0;grid-template-columns:minmax(0,1fr) 280px;gap:16px;align-items:stretch}.arena{display:flex;flex-direction:column;min-height:0;padding:12px 16px 0}.arena-top{flex:0 0 auto;padding:0 0 10px;min-height:20px}.felt,.felt.doubles,.felt.lobby-mode{flex:1;min-height:0;padding:12px;overflow:visible;border-radius:28px}.felt:before{border-radius:22px}.table-footer{flex:0 0 auto;min-height:60px;padding:10px 0;gap:12px;flex-direction:row;align-items:center}.table-footer p{font-size:11px;max-width:none}.table-footer>div:first-child{min-width:0}.table-footer .eyebrow{font-size:7px}#actions{align-self:center;flex-wrap:wrap;justify-content:flex-end;min-width:0}.layout aside{display:flex;flex-direction:column;min-height:0;gap:12px}.panel{padding:18px;margin:0}.score-panel,.note,main>footer{display:none}.setup h2{margin-bottom:16px}.setup .hint{margin-bottom:12px}.setup form{margin-top:14px}.in-room .intro{display:none}.in-room .room-panel{flex:1;display:flex;flex-direction:column;gap:10px}.in-room .room-panel>.eyebrow{display:none}.in-room .room-panel h2{margin:0;font-size:22px}.room-panel p{margin:0;font-size:11px;line-height:1.5}.room-panel #room-description{font-size:10px}.room-panel .rule-toggle{padding:8px 0;margin:0;font-size:11px}.rule-toggle small{font-size:9px;margin-top:3px}.room-panel select{margin-bottom:8px;padding:9px}.room-panel #settings-note{font-size:9px;margin:6px 0 0}.room-panel #waiting-members{font-size:10px;margin:0;max-height:40px;overflow:auto}.room-panel #chairs{display:none}.room-panel #begin{margin:0;margin-top:auto}.room-panel #copy{margin:0}.room-panel #leave{align-self:flex-end;margin:0;padding:6px;font-size:11px}.room-panel #room-settings{margin-top:2px}.lobby-mode{justify-content:center}#seat-picker.four-chairs,#seat-picker.two-chairs{height:100%;max-height:470px;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:stretch}.four-chairs .lobby-center,.two-chairs .lobby-center{grid-row:1;grid-column:1/-1;margin:0;padding-bottom:4px}.lobby-center b{font-size:28px;line-height:1}.lobby-center strong{font-size:14px;margin-top:4px}.lobby-center small{font-size:9px;margin-top:4px}.four-chairs .chair-0,.two-chairs .chair-0{grid-row:2;grid-column:1}.four-chairs .chair-2{grid-row:2;grid-column:2}.four-chairs .chair-1,.two-chairs .chair-1{grid-row:3;grid-column:1}.four-chairs .chair-3{grid-row:3;grid-column:2}.two-chairs .chair-0{grid-column:1/-1}.two-chairs .chair-1{grid-column:1/-1}.seat-choice{justify-content:center;padding:12px;gap:8px}.seat-choice>strong{font-size:10px}.seat-choice>span{font-size:12px}.seat-choice .chair-toggle{padding:9px;min-height:32px;font-size:11px}.in-game{background:#10271f}.in-game>header,.in-game .intro,.in-game aside{display:none}.in-game main{max-width:none;padding:12px}.in-game .layout{display:flex;gap:0}.in-game .arena{width:100%;padding:14px 20px 0;border-radius:16px;position:relative}.in-game .score-panel{display:flex;align-items:center;gap:16px;position:absolute;top:8px;left:50%;transform:translateX(-50%);padding:0;border:0;background:none;color:#f3ecd9;z-index:3}.in-game .score-panel>.eyebrow,.in-game .score-panel>h2,.in-game .score-panel>.progress{display:none}.in-game .score{gap:12px}.in-game .score>div{display:flex;align-items:center;gap:8px;max-width:none}.in-game .score div span{font-size:10px;color:#c0cfb6;max-width:110px;text-overflow:ellipsis;white-space:nowrap}.in-game .score strong{font-size:24px;line-height:1;letter-spacing:-1px}.in-game .score-x{font-size:11px}.in-game .score-bottom{margin:0;padding:0;border:0;font-size:9px;color:#a9bca0}.in-game .score-bottom>span:last-child{display:none}.in-game .arena-top{min-height:32px}.in-game .felt{border-radius:80px;padding:0}.in-game .felt:before{border-radius:72px}.in-game .opponent{position:absolute;top:12px}.in-game .opponent-cards{position:absolute;top:53px;margin:0}.in-game .opponent-cards .card{width:clamp(35px,7vh,54px);height:clamp(49px,9vh,75px)}.in-game .table-center,.in-game .doubles .table-center{position:absolute;top:50%;transform:translateY(-50%);height:160px}.in-game .deck-area,.in-game .doubles .deck-area{left:18%;top:50%;transform:translateY(-50%)}.in-game .rounds{position:absolute;bottom:150px;margin:0}.in-game .my-hand{position:absolute;bottom:43px;height:auto}.in-game .my-hand .card{width:clamp(48px,10vh,80px);height:clamp(67px,14vh,112px)}.in-game .me{position:absolute;bottom:8px;margin:0}.in-game .side-seat{top:45%;width:110px}.in-game .side-seat.left{left:6%}.in-game .side-seat.right{right:6%}.in-game .table-footer{display:grid;grid-template-columns:minmax(0,1fr) auto auto;min-height:62px}.in-game #leave{color:#c3d2b9;padding:11px 12px;border:1px solid #67816a66;border-radius:6px;font-size:11px;white-space:nowrap;margin:0}.in-game #leave:hover{background:#254634}.in-game #back-lobby{width:auto;margin:0}.in-game .table-footer .primary,.in-game .table-footer .secondary{padding:11px 14px}.in-game .score-pop{animation:none}
@media(max-width:900px){header{padding:0 16px}main{padding:12px 16px}.layout{grid-template-columns:minmax(0,1fr) 250px;gap:12px}.arena{padding:10px 12px 0}.panel{padding:14px}.seat-choice{padding:10px;gap:7px}.seat-choice .chair-toggle{font-size:10px;padding:8px}.in-game .arena-top #mode-label{font-size:8px}.in-game .score-bottom{display:none}.in-game .side-seat{width:80px}.in-game .side-seat.left{left:4%}.in-game .side-seat.right{right:4%}.in-game .deck-area,.in-game .doubles .deck-area{left:16%}}
@media(max-width:600px){header{height:44px;flex-basis:44px;padding:0 12px}.brand{font-size:27px}.brand>span{font-size:19px}.brand small{display:none}.text-button{font-size:11px}main{padding:8px 10px 10px}.intro{margin-bottom:8px}h1{font-size:18px}h1 em{display:none}.intro .eyebrow,.variant{font-size:7px}.variant{padding:7px}.layout{display:flex;flex-direction:column;gap:8px}.layout aside{width:100%;flex:none;gap:0}.layout>.arena{flex:1;min-height:0}.panel{padding:12px}body:not(.in-room) .arena{display:none}body:not(.in-room) .layout{justify-content:center}body:not(.in-room) aside{max-width:380px;align-self:center}.in-room .room-panel{display:grid;grid-template-columns:1fr 1fr;gap:7px 10px}.room-panel h2{font-size:16px!important;align-self:center}.room-panel #room-description,.room-panel #settings-note{display:none}.room-panel #room-settings{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:5px 10px;margin:0}.room-panel #room-settings>label:first-child{grid-column:1;grid-row:1;margin:0;font-size:9px;align-self:end}.room-panel #players{grid-column:1;grid-row:2/4;margin:0;align-self:center;padding:8px;font-size:11px}.room-panel .rule-toggle{grid-column:2;padding:4px 0;border:0;font-size:10px;gap:6px}.room-panel .rule-toggle:has(#eleven){grid-row:1/3}.room-panel .rule-toggle:has(#iron){grid-row:3}.room-panel .rule-toggle small{display:none}.room-panel #waiting-members{grid-column:2;grid-row:1;font-size:9px;text-align:right;max-height:24px}.room-panel #begin{grid-column:1;grid-row:3;margin:0;padding:10px;font-size:11px}.room-panel #copy{grid-column:2;grid-row:3;padding:10px;font-size:11px}.room-panel #leave{grid-column:2;justify-self:end;padding:3px;font-size:10px}.arena-top{font-size:7px;letter-spacing:.8px;padding-bottom:6px}.live-dot{font-size:7px}.felt.lobby-mode{padding:9px;border-radius:18px}#seat-picker.four-chairs,#seat-picker.two-chairs{gap:7px;max-height:none;grid-template-rows:auto 1fr 1fr}.lobby-center b{display:none}.lobby-center strong{font-size:12px;margin:0}.lobby-center small{font-size:8px;margin-top:3px}.seat-choice{padding:8px;gap:5px;border-radius:8px}.seat-choice>strong{font-size:8px}.seat-choice>span{font-size:10px}.seat-choice .chair-toggle{min-height:28px;padding:6px;font-size:10px}.table-footer{min-height:38px;padding:7px 0}.table-footer .eyebrow{display:none}.table-footer p{font-size:9px;line-height:1.3;margin:0}.in-game main{padding:6px}.in-game .arena{padding:10px 10px 0}.in-game .arena-top{padding-bottom:3px;min-height:49px;align-items:start}.in-game .score-panel{top:29px;gap:10px;white-space:nowrap}.in-game .score{gap:8px}.in-game .score div span{font-size:9px;max-width:85px}.in-game .score strong{font-size:21px}.in-game .felt{border-radius:35px}.in-game .felt:before{border-radius:28px;inset:9px}.in-game .opponent{top:10px}.in-game .opponent-cards{top:50px}.in-game .table-center,.in-game .doubles .table-center{height:160px}.in-game .deck-area,.in-game .doubles .deck-area{left:12%;top:0}.in-game .side-seat{width:65px}.in-game .side-seat.left{left:9px}.in-game .side-seat.right{right:9px}.in-game .rounds{bottom:143px}.in-game .table-footer{grid-template-columns:minmax(0,1fr) auto;gap:7px;min-height:88px;padding:8px 0}.in-game .table-footer>div:first-child{grid-column:1/-1}.in-game #actions{justify-content:start;flex-wrap:wrap;gap:6px;grid-column:1}.in-game #leave{grid-column:2;font-size:10px;padding:9px}.in-game .table-footer .primary,.in-game .table-footer .secondary{font-size:10px;padding:10px}.in-game .me small{font-size:8px;max-width:240px}.in-game .score-bottom{display:none}}
@media(max-height:650px) and (min-width:601px){header{height:44px;flex-basis:44px}main{padding-top:8px;padding-bottom:10px}.intro{margin-bottom:8px}h1{font-size:20px}.room-panel #room-description,.room-panel #settings-note{display:none}.in-room .room-panel{gap:8px}.panel{padding:12px}.room-panel .rule-toggle{padding:6px 0}.room-panel .rule-toggle small{font-size:8px}.seat-choice{gap:5px;padding:8px}.seat-choice .chair-toggle{padding:6px;min-height:28px}.lobby-center b{display:none}.in-game .opponent-cards{top:44px}.in-game .table-center,.in-game .doubles .table-center{height:132px}.in-game .opponent-cards .card{width:35px;height:49px}.in-game .my-hand .card{width:48px;height:67px}.in-game .my-hand{bottom:39px}.in-game .rounds{bottom:115px}.in-game .table-footer{min-height:53px}.in-game .trick-card .card{width:38px;height:52px}.in-game .doubles .trick-card[data-position='1'],.in-game .doubles .trick-card[data-position='3']{top:34px}}
@media(max-height:450px){.room-panel .rule-toggle small,.room-panel #room-description,.room-panel #settings-note,.lobby-center{display:none!important}#seat-picker.four-chairs,#seat-picker.two-chairs{grid-template-rows:1fr 1fr}.four-chairs .chair-0,.two-chairs .chair-0{grid-row:1;grid-column:1}.four-chairs .chair-2{grid-row:1;grid-column:2}.four-chairs .chair-1,.two-chairs .chair-1{grid-row:2;grid-column:1}.four-chairs .chair-3{grid-row:2;grid-column:2}.two-chairs .chair-0,.two-chairs .chair-1{grid-row:1/-1}.two-chairs .chair-1{grid-column:2}.in-game .opponent-cards{display:none}.in-game .me .avatar,.in-game .opponent .avatar{display:none}.in-game .opponent{top:7px}.in-game .my-hand{bottom:26px}.in-game .me{bottom:4px}.in-game .rounds{bottom:99px}.in-game .table-center,.in-game .doubles .table-center{height:104px;top:40%}.in-game .trick-card .card{width:30px;height:42px}.in-game .trick-card .card b{font-size:22px}.in-game .trick-card small{display:none}.in-game .doubles .trick-card[data-position='1'],.in-game .doubles .trick-card[data-position='3']{top:26px}}
body:not(.in-room) .felt> :not(.table-center){display:none}body:not(.in-room) .felt .deck-area{display:none}body:not(.in-room) .table-center{flex:1;height:100%;margin:0}body:not(.in-room) .table-center .watermark{font-size:100px}body:not(.in-room) .table-footer #actions{display:none}dialog{width:min(620px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);padding:22px}dialog p{font-size:12px;line-height:1.5;margin:10px 0}dialog h2{font-size:22px;margin:10px 0 16px}@media(max-width:600px){dialog{padding:16px}dialog p{font-size:11px;line-height:1.45;margin:8px 0}dialog h2{font-size:19px;margin:10px 0}.close{margin-top:-5px}}@media(max-height:450px){dialog{width:min(860px,calc(100vw - 24px));padding:14px}dialog p{font-size:10px;line-height:1.4;margin:6px 0}dialog h2{font-size:18px;margin:5px 0 8px}}
@media(max-height:450px){header{height:36px;flex-basis:36px}main{padding-top:6px;padding-bottom:8px}.intro{display:none}.in-room .room-panel{gap:5px;padding:10px}.in-room .room-panel h2{font-size:18px}.room-panel #room-settings{margin:0}.room-panel select{padding:6px;margin-bottom:4px}.room-panel .rule-toggle{padding:4px 0}.room-panel #waiting-members{font-size:9px;max-height:14px}.room-panel .primary,.room-panel .secondary{padding:8px;font-size:10px}.room-panel #leave{padding:4px}.setup{padding:12px}.setup h2{font-size:18px;margin:6px 0 10px}.setup input{padding:8px}.setup>.primary{padding:9px;margin-top:10px}.setup .hint{margin:6px 0}.setup form{margin-top:8px}.seat-choice{padding:6px;gap:4px}.seat-choice .chair-toggle{padding:6px;min-height:26px}.table-footer{min-height:34px;padding:6px 0}.table-footer .eyebrow{display:none}.table-footer p{margin:0;font-size:9px}}
#room-start{display:flex;gap:8px;margin-top:auto}#room-start>button{flex:1;min-width:0;padding:10px 7px;font-size:10px}#room-start #begin{margin:0}@media(max-width:600px){.room-panel #room-start{grid-column:1/-1;grid-row:3;margin:0}.room-panel #room-start #begin{font-size:10px;grid-row:auto;padding:9px 6px}.room-panel #copy{grid-column:1;grid-row:4;padding:8px;font-size:10px}.room-panel #leave{grid-column:2;grid-row:4;align-self:center}.room-panel #room-start #fill-bots{font-size:10px;padding:9px 6px}}@media(max-height:450px){#room-start>button{padding:7px 5px;font-size:9px}}
/* A entrada mostra apenas o painel de acesso à sala. */
body:not(.in-room) .arena,body:not(.in-room) .intro{display:none}body:not(.in-room) .layout{display:flex;align-items:center;justify-content:center}body:not(.in-room) .layout aside{width:min(100%,380px);flex:none;align-self:center}body:not(.in-room) .setup{width:100%}
.header-actions{display:flex;align-items:center;gap:22px}.theme-toggle{display:flex;align-items:center;gap:8px;background:none;border:1px solid #d4dcd0;border-radius:24px;padding:7px 10px;color:#294936;font-size:11px}.theme-icon{font-size:15px;line-height:1}.theme-track{display:block;width:29px;height:17px;border-radius:12px;background:#c7d0bf;padding:2px}.theme-track>span{display:block;width:13px;height:13px;border-radius:50%;background:#fffdf4;transition:transform .2s}.theme-toggle[aria-checked='true'] .theme-track{background:#80a17e}.theme-toggle[aria-checked='true'] .theme-track>span{transform:translateX(12px)}html[data-theme='dark']{color-scheme:dark;background:#101b17;color:#e6ecdf}html[data-theme='light']{color-scheme:light}html[data-theme='dark'] body:not(.in-game){background:#101b17;color:#e6ecdf}html[data-theme='dark'] header{border-color:#2d4035}html[data-theme='dark'] .brand,html[data-theme='dark'] .text-button{color:#d8e4ca}html[data-theme='dark'] .panel,html[data-theme='dark'] dialog{background:#192a22;border-color:#354b3b;color:#e6ecdf}html[data-theme='dark'] input,html[data-theme='dark'] select{background:#102018;border-color:#3d5340;color:#e7eede}html[data-theme='dark'] input::placeholder{color:#9da991}html[data-theme='dark'] label,html[data-theme='dark'] .hint,html[data-theme='dark'] .eyebrow,html[data-theme='dark'] .room-panel p,html[data-theme='dark'] .settings-note,html[data-theme='dark'] .rule-toggle small{color:#acbca2}html[data-theme='dark'] .primary{background:#bed39c;color:#14271b}html[data-theme='dark'] .primary:hover{background:#d1e4b2}html[data-theme='dark'] .secondary,html[data-theme='dark'] .join-button{background:#2a4030;border-color:#456045;color:#dce9ce}html[data-theme='dark'] .secondary:hover,html[data-theme='dark'] .join-button:hover{background:#36523c}html[data-theme='dark'] .rule-toggle{border-color:#354c3a}html[data-theme='dark'] #waiting-members{color:#c4d3b7}html[data-theme='dark'] .theme-toggle{color:#dce9ce;border-color:#456045}html[data-theme='dark'] .in-game .score-panel{background:none;border:0;color:#f3ecd9}html[data-theme='dark'] .seat-choice .chair-toggle{background:#d9bd87;color:#173e31}html[data-theme='dark'] .table-footer .primary{background:var(--gold);color:#253b2b}html[data-theme='dark'] .rule-toggle input{accent-color:#9fc37e}@media(max-width:600px){.header-actions{gap:10px}.theme-toggle{padding:5px 8px;font-size:10px;gap:6px}.theme-icon{display:none}.text-button span{margin-left:5px}}
/* Escala confortável: controles legíveis e espaço útil bem distribuído. */
@media(min-height:601px) and (min-width:601px){
header{height:64px;flex-basis:64px;padding-inline:clamp(20px,4vw,56px)}.brand{font-size:36px}.brand>span{font-size:25px}.brand small{font-size:8px}.header-actions{gap:24px}.theme-toggle{font-size:13px;padding:9px 13px}.text-button{font-size:13px}main{padding:20px clamp(18px,3vw,40px)}body:not(.in-room) .layout aside{width:min(100%,440px);max-width:440px}.setup{padding:32px;border-radius:18px}.setup>.eyebrow{font-size:11px}.setup h2{font-size:30px;margin:12px 0 25px}.setup label{font-size:13px;margin-bottom:9px}.setup input{font-size:15px;padding:14px}.setup>.primary{font-size:15px;min-height:48px;margin-top:20px}.setup .hint{font-size:12px;line-height:1.5;margin:13px 0 23px}.setup form{margin-top:24px}.setup .join-button{min-width:48px;font-size:23px}.in-room .layout{grid-template-columns:minmax(0,1fr) 310px;gap:20px}.in-room .room-panel{padding:22px;gap:14px;border-radius:16px}.in-room .room-panel h2{font-size:26px}.room-panel #room-description{font-size:12px;line-height:1.6}.room-panel #room-settings>label:first-child{font-size:12px}.room-panel select{font-size:14px;padding:12px;margin-bottom:10px}.room-panel .rule-toggle{font-size:13px;padding:11px 0;gap:10px}.room-panel .rule-toggle input{width:18px;height:18px}.room-panel .rule-toggle small{font-size:11px;line-height:1.5}.room-panel #settings-note{font-size:11px}.room-panel #waiting-members{font-size:12px}.room-panel #copy{font-size:13px;padding:13px}.room-panel #leave{font-size:12px}.room-panel #room-start>button{font-size:12px;min-height:48px;padding:10px 7px}.arena-top{font-size:11px;letter-spacing:1px}.live-dot{font-size:9px}.lobby-center strong{font-size:19px}.lobby-center small{font-size:12px}.lobby-center b{font-size:34px}.seat-choice{padding:18px;gap:12px}.seat-choice>strong{font-size:12px}.seat-choice>span{font-size:16px}.seat-choice .chair-toggle{font-size:13px;min-height:40px;padding:11px}.table-footer p{font-size:13px}.table-footer .eyebrow{font-size:9px}.in-game main{padding:16px}.in-game .player strong{font-size:14px}.in-game .player small{font-size:11px}.in-game .avatar{width:36px;height:36px;font-size:14px}.in-game .opponent-cards{top:61px}.in-game .side-seat strong{font-size:14px}.in-game .side-seat small{font-size:11px}.in-game .side-seat{width:130px}.in-game .score strong{font-size:30px}.in-game .score div span{font-size:13px}.in-game .score-bottom{font-size:11px}.in-game .arena-top{min-height:42px}.in-game .table-footer{min-height:72px}.in-game #leave{font-size:13px;padding:13px 16px}.in-game .table-footer .primary,.in-game .table-footer .secondary{font-size:14px;min-height:44px}.in-game .stake{font-size:12px}.in-game .my-hand .card{width:clamp(64px,11vh,92px);height:clamp(90px,15.4vh,129px)}.in-game .rounds{bottom:182px}.in-game .rounds span{width:26px;height:26px;font-size:11px}.in-game .trick-card small{font-size:10px}.in-game .my-hand{bottom:50px}.in-game .me{bottom:9px}
}
@media(min-height:601px) and (min-width:601px) and (max-width:850px){.in-room .layout{grid-template-columns:minmax(0,1fr) 270px;gap:12px}.in-room .room-panel{padding:16px;gap:10px}.room-panel #room-description{font-size:11px}.room-panel .rule-toggle{font-size:12px;padding:9px 0}.room-panel .rule-toggle small{font-size:10px}.room-panel #settings-note{font-size:10px}.room-panel #room-start>button{font-size:11px;padding:8px 4px}.seat-choice{padding:10px;gap:9px}.seat-choice>strong{font-size:10px}.seat-choice>span{font-size:13px}.seat-choice .chair-toggle{font-size:11px;min-height:36px;padding:8px}.lobby-center strong{font-size:16px}.arena-top{font-size:9px}.live-dot{font-size:8px}.in-game .side-seat{width:90px}.in-game .side-seat strong{font-size:12px}.in-game .side-seat small{font-size:9px}.in-game .score div span{font-size:12px}.in-game .score-bottom{display:none}}
@media(max-width:600px) and (min-height:601px){body:not(.in-room) .layout aside{width:min(100%,400px);max-width:400px}.setup{padding:24px;border-radius:16px}.setup h2{font-size:27px;margin:10px 0 22px}.setup label{font-size:12px}.setup input{font-size:14px;padding:13px}.setup>.primary{min-height:46px;font-size:14px;margin-top:17px}.setup .hint{font-size:11px;line-height:1.5;margin:12px 0 18px}.setup form{margin-top:20px}.seat-choice>span{font-size:12px}.seat-choice>strong{font-size:9px}.seat-choice .chair-toggle{font-size:11px;min-height:30px}.room-panel #room-start>button,.room-panel #room-start #begin,.room-panel #room-start #fill-bots{font-size:11px;min-height:38px}.in-game .score div span{font-size:11px}.in-game .score strong{font-size:25px}.in-game .player strong{font-size:12px}.in-game .player small{font-size:10px}.in-game #leave{font-size:11px}.in-game .table-footer p{font-size:11px}.in-game .table-footer .primary,.in-game .table-footer .secondary{font-size:12px;min-height:38px}}
/* Evita que o flex comprima o nome entre os botões da cadeira. */
.seat-choice>strong,.seat-choice>span,.seat-choice>button{flex-shrink:0}.seat-choice>span{min-height:1.4em;line-height:1.4}.in-game .my-hand{bottom:66px}.in-game .me{bottom:12px}.in-game .rounds{bottom:calc(66px + clamp(67px,14vh,112px) + 16px)}
@media(min-height:601px) and (min-width:601px){.in-game .my-hand{bottom:74px}.in-game .rounds{bottom:calc(74px + clamp(90px,15.4vh,129px) + 14px)}}
@media(max-height:450px){.in-game .my-hand{bottom:48px}.in-game .me{bottom:5px}.in-game .rounds{bottom:125px}.seat-choice{gap:3px}.seat-choice>strong{font-size:9px}.seat-choice>span{font-size:11px}.seat-choice .chair-toggle{min-height:24px;padding:4px}}
.sound-control{position:relative;color:inherit;z-index:8}.sound-control summary{cursor:pointer;list-style:none;border:1px solid #82977a66;border-radius:50%;width:30px;height:30px;display:grid;place-items:center;font-size:19px}.sound-control summary::-webkit-details-marker{display:none}.volume-panel{position:absolute;right:0;top:38px;width:220px;background:#fafaf5;color:#203a31;border:1px solid #daddd2;border-radius:10px;padding:16px;box-shadow:0 10px 35px #0004}.volume-panel label{font-size:12px}.volume-panel output{float:right}.volume-panel input{width:100%;height:24px;padding:0;accent-color:#608c52}.volume-panel small{font-size:10px;color:#7b8c70}.in-game .sound-control{position:absolute;right:30px;top:49px;color:#d9e5cd}.in-game .sound-control .volume-panel{top:35px}html[data-theme='dark'] .volume-panel{background:#192a22;color:#e6ecdf;border-color:#456045}#truco-dialog{max-width:440px;padding:24px}#truco-dialog .advice-note{font-size:11px;color:#839077}#truco-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}#truco-actions>button{flex:1;min-width:95px;padding:13px 10px}#truco-dialog::backdrop{background:#071b16b3;backdrop-filter:blur(3px)}@media(max-width:600px){.header-actions{gap:7px}.theme-toggle{padding:5px 6px}.sound-control summary{width:26px;height:26px;font-size:17px}.in-game .sound-control{right:20px;top:65px}.volume-panel{width:200px}.in-game .my-hand{bottom:64px}.in-game .rounds{bottom:calc(64px + clamp(67px,14vh,112px) + 14px)}#truco-dialog{padding:18px}}
#seat-picker.four-chairs,#seat-picker.two-chairs{max-height:none;grid-template-rows:auto repeat(2,minmax(min-content,1fr))}.seat-choice{gap:clamp(5px,1vh,10px);padding:clamp(8px,1.6vh,16px)}@media(max-height:450px){#seat-picker.four-chairs,#seat-picker.two-chairs{grid-template-rows:repeat(2,minmax(min-content,1fr))}.seat-choice{gap:3px;padding:6px}}
/* Em monitores grandes, as peças acompanham o espaço disponível da mesa. */
@media (min-width:1100px) and (min-height:900px){
.in-game{--hand-h:clamp(140px,min(20vh,12vw),200px);--trick-h:clamp(74px,9vh,100px);--piece-font:clamp(16px,1.1vw,21px)}
.in-game .player strong,.in-game .side-seat strong{font-size:var(--piece-font)}
.in-game .player small,.in-game .side-seat small{font-size:clamp(12px,.85vw,16px)}
.in-game .avatar{width:clamp(42px,3.2vw,58px);height:clamp(42px,3.2vw,58px);font-size:20px}
.in-game .side-seat{width:clamp(140px,12vw,220px)}
.in-game .opponent{top:18px}.in-game .opponent-cards{top:clamp(76px,8vh,96px)}
.in-game .opponent-cards .card{height:clamp(80px,11vh,110px);width:clamp(57px,7.85vh,79px)}
.in-game .mini-cards .card{width:40px;height:56px}.in-game .mini-cards .card:after{font-size:26px}
.in-game .my-hand{bottom:clamp(84px,10vh,110px);gap:14px}
.in-game .my-hand .card{height:var(--hand-h);width:calc(var(--hand-h) / 1.4)}
.in-game .my-hand .card b{font-size:clamp(44px,4vw,64px)}
.in-game .my-hand .corner{font-size:clamp(16px,1.2vw,22px);top:10px;left:10px}
.in-game .my-hand .corner.bottom{top:auto;left:auto;bottom:10px;right:10px}
.in-game .me{bottom:18px}
.in-game .rounds{bottom:calc(clamp(84px,10vh,110px) + var(--hand-h) + 18px)}
.in-game .rounds span{width:34px;height:34px;font-size:14px}
.in-game .table-center,.in-game .doubles .table-center{height:calc(var(--trick-h) * 2 + 36px);top:calc(clamp(76px,8vh,96px) + clamp(80px,11vh,110px) + 12px);transform:none}
.in-game .doubles .played{width:calc(var(--trick-h) * 2.25)}
.in-game .trick-card .card{height:var(--trick-h);width:calc(var(--trick-h) / 1.4)}
.in-game .trick-card .card b{font-size:38px}.in-game .trick-card .corner{font-size:14px}
.in-game .trick-card small{font-size:12px;max-width:100px}
.in-game .doubles .trick-card[data-position='0'],.in-game .doubles .trick-card[data-position='2']{left:50%;transform:translateX(-50%)}
.in-game .doubles .trick-card[data-position='1'],.in-game .doubles .trick-card[data-position='3']{top:calc(var(--trick-h) * .6 + 12px)}
.in-game .deck-area .card,.in-game .doubles .deck-area .card{width:58px;height:82px}
.in-game .deck-area .card b,.in-game .doubles .deck-area .card b{font-size:34px}
.in-game .deck-area .corner,.in-game .doubles .deck-area .corner{font-size:13px}
.in-game .score strong{font-size:40px}.in-game .score div span{font-size:16px}.in-game .score-bottom{font-size:14px}
.in-game .arena-top{min-height:54px;font-size:13px}
.in-game .table-footer p,.in-game .stake,.in-game #leave{font-size:16px}
.in-game .table-footer .primary,.in-game .table-footer .secondary{font-size:16px;min-height:48px}
.in-game .sound-control summary{width:38px;height:38px;font-size:24px}
}

#debug-history{position:absolute;top:50px;left:30px;z-index:7;color:#e6ecdf;font-size:12px}#debug-history summary{cursor:pointer;padding:8px 12px;border:1px solid #82977a66;border-radius:8px;background:#192f26}.history-panel{position:absolute;top:42px;left:0;width:min(440px,calc(100vw - 60px));max-height:calc(100dvh - 170px);overflow:auto;background:#192a22;border:1px solid #56715b;border-radius:12px;padding:18px;box-shadow:0 12px 40px #0006}.history-panel>p{color:#b0c4b1;font-size:11px}.history-panel article{padding:12px 0;border-top:1px solid #56715b66}.history-panel article p{white-space:pre-line;line-height:1.7;margin:7px 0 0;font-size:12px}@media(max-width:600px){#debug-history{left:20px;top:65px;font-size:10px}.history-panel{width:min(400px,calc(100vw - 52px))}}

/* Cartas centrais maiores, com posições recalculadas para as quatro jogadas. */
@media(min-width:601px) and (min-height:750px){
.in-game .table-center,.in-game .doubles .table-center{height:222px;top:39.5%}
.in-game .doubles .played{width:232px}
.in-game .trick-card .card{width:68px;height:95px}
.in-game .trick-card .card b{font-size:36px}
.in-game .trick-card .corner{font-size:13px}
.in-game .doubles .trick-card[data-position='0'],.in-game .doubles .trick-card[data-position='2']{left:50%;transform:translateX(-50%)}
.in-game .doubles .trick-card[data-position='1'],.in-game .doubles .trick-card[data-position='3']{top:62px}
}
@media(min-width:1100px) and (min-height:900px){
.in-game .table-center,.in-game .doubles .table-center{height:260px;top:calc(clamp(76px,8vh,96px) + clamp(80px,11vh,110px) + 12px);transform:none}
.in-game .doubles .played{width:270px}
.in-game .trick-card .card{width:79px;height:110px}
.in-game .doubles .trick-card[data-position='1'],.in-game .doubles .trick-card[data-position='3']{top:76px}
}
.in-game .arena-top{align-items:center;gap:12px;padding-block:0 10px}
.in-game .live-dot{margin-left:auto}
.in-game .arena-top .sound-control{position:relative;inset:auto;flex:none;z-index:8}
.in-game .sound-control summary{width:30px;height:30px;font-size:19px}
.in-game .sound-control .volume-panel{top:38px}
@media(max-width:600px){.in-game .arena-top{align-items:flex-start;gap:8px}.in-game .sound-control summary{width:26px;height:26px;font-size:17px}}

@media(min-width:1100px) and (min-height:900px) and (max-height:999px){.in-game .table-center,.in-game .doubles .table-center{height:222px;top:calc(clamp(76px,8vh,96px) + clamp(80px,11vh,110px) + 4px)}.in-game .trick-card .card{width:68px;height:95px}.in-game .doubles .played{width:232px}.in-game .doubles .trick-card[data-position='1'],.in-game .doubles .trick-card[data-position='3']{top:62px}}
/* A marca vazia tem o próprio centro, independente da largura das cartas. */
.in-game .played:has(>.watermark){justify-content:center;padding:0}
.in-game .played>.watermark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max-content;line-height:1.1}
.in-game .table-center:has(.watermark){top:50%;transform:translateY(-50%)}
/* Vira e mãos laterais legíveis sem competir com as cartas jogadas. */
@media(min-width:601px) and (min-height:451px){
.in-game .mini-cards{gap:3px;margin-top:12px}
.in-game .mini-cards .card{width:clamp(40px,3.4vw,58px);height:clamp(56px,4.76vw,81px);border-width:3px;border-radius:5px;margin-left:-6px}
.in-game .mini-cards .card:after{font-size:clamp(25px,2.2vw,36px)}
.in-game .deck-area .card,.in-game .doubles .deck-area .card{width:clamp(52px,4.2vw,72px);height:clamp(73px,5.88vw,101px)}
.in-game .deck-area .card b,.in-game .doubles .deck-area .card b{font-size:clamp(32px,2.7vw,44px)}
.in-game .deck-area .corner,.in-game .doubles .deck-area .corner{font-size:clamp(12px,1vw,16px)}
.in-game .deck-area small,.in-game .doubles .deck-area small{left:18px;font-size:9px;bottom:-24px}
}
@media(max-width:600px) and (min-height:601px){
.in-game .mini-cards .card{width:32px;height:45px}.in-game .mini-cards .card:after{font-size:22px}
.in-game .deck-area .card,.in-game .doubles .deck-area .card{width:42px;height:59px}
.in-game .deck-area .card b,.in-game .doubles .deck-area .card b{font-size:28px}
.in-game .deck-area .corner,.in-game .doubles .deck-area .corner{font-size:11px}
}
/* A decisão de truco inclui a própria mão, sem depender da mesa ao fundo. */
.truco-hand-preview{text-align:center;margin:16px 0}.truco-hand-preview .cards{margin:10px 0;gap:12px}.truco-hand-preview .card{width:72px;height:101px}.truco-hand-preview .card b{font-size:38px}.truco-hand-preview .corner{font-size:14px}.truco-hand-preview>small{display:block;font-size:11px;color:#839077}#truco-dialog::backdrop{backdrop-filter:none;background:#071b1680}
@media(max-height:650px){.truco-hand-preview{margin:10px 0}.truco-hand-preview .cards{margin:7px 0}.truco-hand-preview .card{width:58px;height:81px}.truco-hand-preview .card b{font-size:30px}#truco-dialog{padding:16px}#truco-dialog p{margin:7px 0}#truco-actions{margin-top:12px}}
/* O indicador de turno envolve somente a identificação do jogador lateral. */
.side-identity{width:max-content;max-width:100%;margin-inline:auto;padding:3px 8px}
.side-seat.current-turn{outline:none;border-radius:0}
.side-seat.current-turn>.side-identity{outline:2px solid #e5b979;outline-offset:5px;border-radius:7px}
/* A liderança considera apenas as cartas públicas da rodada atual. */
.trick-card .card.strongest-card{box-shadow:0 0 0 3px #edc879,0 0 18px #edc87955,0 3px 7px #081c2750}
.strongest-marker{position:absolute;left:50%;top:-13px;transform:translateX(-50%);white-space:nowrap;background:#edc879;color:#183b2c;border-radius:12px;padding:3px 7px;font-size:9px;font-weight:700;line-height:1.2;z-index:2;letter-spacing:0}
@media(max-width:600px),(max-height:600px){.strongest-marker{font-size:7px;padding:2px 4px;top:-10px}}
#result-dialog{width:min(460px,calc(100vw - 28px));text-align:center;padding:32px;border-color:#8eac74}#result-dialog h2{font-size:30px;margin:15px 0}#result-score{font-family:'Space Grotesk',sans-serif;font-size:21px;margin:16px 0 24px}#result-actions{display:flex;flex-direction:column;gap:10px}#result-actions button{min-height:46px;font-size:14px}#result-dialog::backdrop{background:#071b16a6;backdrop-filter:blur(2px)}.game-finished .table-footer #actions,.game-finished .table-footer>#leave{visibility:hidden}@media(max-height:450px){#result-dialog{padding:18px}#result-dialog h2{font-size:24px;margin:8px 0}#result-score{margin:10px 0}#result-actions button{min-height:36px;padding:8px}}
#rules{width:min(760px,calc(100vw - 28px));padding:28px;max-height:calc(100dvh - 28px)}.rules-header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.rules-header h2{font-size:30px;margin:10px 0}.rules-header p{color:#7b8c70;margin:0!important}.rules-header button{white-space:nowrap}.rules-tabs{display:flex;gap:8px;margin:22px 0}.rules-tabs button{flex:1;padding:11px 8px;border-radius:8px;border:1px solid #83907755;background:transparent;color:inherit;font-size:13px}.rules-tabs button.active{background:#d9bd87;color:#173e31;border-color:#d9bd87;font-weight:700}.rules-page{min-height:340px}.rules-page h3{font-size:20px;margin:0 0 14px}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.rules-grid article{padding:16px;border:1px solid #83907740;border-radius:12px}.rules-grid h4{font-size:16px;margin:6px 0 8px}.rules-page p{font-size:13px;line-height:1.65}.rules-grid p{margin:0}.rule-number{font-family:'Space Grotesk',sans-serif;font-size:23px;color:#b39763}.rule-example{padding:15px 18px;border-left:3px solid #d9bd87;background:#83907712;border-radius:8px;margin:14px 0}.rule-example p:last-child{margin-bottom:0}.rank-order{display:flex;gap:6px;margin:18px 0}.rank-order span{flex:1;text-align:center;padding:12px 0;background:#fffdf4;color:#203a31;border-radius:6px;font-size:19px;font-weight:700;box-shadow:0 2px 4px #0002}.suit-order{display:flex;align-items:center;justify-content:center;gap:18px;font-size:30px;margin:12px 0}.suit-order span:nth-child(1),.suit-order span:nth-child(5){color:#ca5a50}.suit-order b{font-size:20px;color:#839077}.rules-tip{color:#7b8c70}.rules-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #83907740;padding-top:16px;margin-top:16px;gap:16px}.rules-footer>span{font-size:12px;color:#839077}.rules-footer button{width:auto;font-size:13px;min-width:180px}html[data-theme='dark'] .rules-tip,html[data-theme='dark'] .rules-header p{color:#acbca2}
@media(max-width:600px){#rules{padding:18px}.rules-header h2{font-size:24px}.rules-header{gap:10px}.rules-tabs{gap:5px;margin:16px 0}.rules-tabs button{font-size:11px;padding:10px 4px}.rules-page{min-height:0}.rules-page h3{font-size:18px}.rules-grid{gap:8px}.rules-grid article{padding:10px}.rules-grid h4{font-size:14px}.rules-page p{font-size:12px;line-height:1.5}.rule-number{font-size:18px}.rank-order{gap:4px}.rank-order span{font-size:15px;padding:9px 0}.rule-example{padding:10px 12px}.rules-footer button{min-width:0;font-size:12px}.suit-order{font-size:25px;margin:8px 0}}
@media(max-height:700px){#rules{padding:18px}.rules-page{min-height:0}.rules-tabs{margin:14px 0}.rules-grid article{padding:10px}.rules-page p{font-size:12px;line-height:1.5}.rules-header h2{font-size:24px}.rules-footer{margin-top:12px;padding-top:12px}}
/* Contraste do painel de entrada e mudança gradual de tema. */
html,body,header,.panel,dialog,input,select,.primary,.secondary,.join-button,.theme-toggle,.text-button,.brand,label,.hint,.eyebrow,.volume-panel,.rules-tabs button{transition:background-color .32s ease,color .32s ease,border-color .32s ease,box-shadow .32s ease}
html[data-theme='light'] body:not(.in-game){background:#eceee7}
html[data-theme='light'] body:not(.in-room) .setup{background:#fff;border-color:#c8d2c2;box-shadow:0 18px 48px #173e3115,0 3px 10px #173e310a}
html[data-theme='light'] .setup input{background:#f5f7f2;border-color:#cbd5c5}
html[data-theme='light'] .setup input:focus{border-color:#52775c}
html[data-theme='light'] .setup .hint{color:#697b66}
@media(prefers-reduced-motion:reduce){html,body,header,.panel,dialog,input,select,.primary,.secondary,.join-button,.theme-toggle,.text-button,.brand,label,.hint,.eyebrow,.volume-panel,.rules-tabs button{transition:none}}
/* Consulta da força das cartas sem sair da partida. */
#card-guide{position:absolute;right:24px;bottom:20px;z-index:4;width:270px;color:#e8eedf;background:#142e25ed;border:1px solid #78916a66;border-radius:12px;font-size:12px;box-shadow:0 5px 16px #0002}
#card-guide summary{cursor:pointer;padding:10px 13px;font-weight:700;color:#e5c68c}.card-guide-content{padding:0 13px 13px}.card-guide-content>small{font-size:9px;color:#b6c6ad;letter-spacing:.5px}#guide-ranks{display:flex;gap:5px;margin:10px 0}#guide-ranks span{flex:1;text-align:center;background:#e9eddf;color:#203a31;border-radius:4px;padding:5px 0;font-weight:700}#guide-manilha{font-size:12px;color:#e5c68c;margin:9px 0}.guide-suits{font-size:19px;text-align:center;word-spacing:7px;margin:5px 0}.guide-suits span:first-child,.guide-suits span:nth-child(3){color:#f39a8d}
@media(max-width:1099px),(max-height:699px){#card-guide{right:12px;bottom:auto;top:12px;width:235px;font-size:11px}#card-guide summary{padding:8px 10px}.card-guide-content{padding:0 10px 10px}}
@media(max-width:600px){#card-guide{top:90px;right:8px;width:205px}#guide-ranks{gap:3px}#guide-manilha{font-size:11px}}
#partner-advice{border:1px solid #8fa27666;border-radius:10px;padding:12px;margin:14px 0;background:#8fa27612}#partner-advice-message{font-weight:700;color:#a4b57f}#partner-advice>small{font-size:10px}#partner-advice-buttons{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}#partner-advice-buttons button{flex:1;min-width:90px;padding:9px 6px;font-size:11px}#partner-advice-buttons .advice-selected{outline:2px solid #d9bd87}
.guide-toggle{flex:none;border:1px solid #82977a66;background:#193b2e;color:#e5c68c;padding:7px 10px;border-radius:8px;font-size:11px}.guide-toggle[aria-expanded='true']{background:#e5c68c;color:#173e31}
#card-guide{resize:both;overflow:auto;width:280px;height:228px;min-width:205px;min-height:200px;max-width:calc(100% - 32px);max-height:calc(100% - 40px)}.guide-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 13px;color:#e5c68c}.guide-heading button{border:0;background:none;color:inherit;font-size:22px;line-height:1;padding:2px 5px}.guide-resize-hint{display:block;margin-top:10px;opacity:.7}.card-guide-content{font-size:clamp(11px,1vw,14px)}#guide-ranks span{padding-block:7px}
@media(max-width:600px){.guide-toggle{font-size:9px;padding:5px 7px}.in-game .arena-top #connection{display:none}#card-guide{max-height:calc(100% - 108px);max-width:calc(100% - 16px);width:235px;height:228px}}
/* Resultado visível por 1 s; recolhimento animado nos últimos 400 ms. */
.trick-card{--collect-x:0px;--collect-y:0px}
.trick-card[data-position='0']{--collect-y:-65px}.trick-card[data-position='2']{--collect-y:65px}.trick-card[data-position='1']{--collect-x:65px}.trick-card[data-position='3']{--collect-x:-65px}
.trick-resolved .trick-card .card{animation:collect-trick .4s cubic-bezier(.4,0,.6,1) 1s forwards}
.trick-resolved .trick-card small{animation:collect-label .4s ease 1s forwards}
@keyframes collect-trick{from{opacity:1;transform:translate(0,0) scale(1)}to{opacity:0;transform:translate(var(--collect-x),var(--collect-y)) scale(.35) rotate(-12deg)}}
@keyframes collect-label{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:reduce){.trick-resolved .trick-card .card,.trick-resolved .trick-card small{animation:none}}
#card-guide{resize:none}.guide-resize-handle{position:absolute;left:0;top:0;width:24px;height:24px;padding:0;border:0;background:transparent;color:#e5c68c;cursor:nwse-resize;touch-action:none;border-radius:12px 0 0 0;font-size:16px;line-height:1}.guide-resize-handle:before{content:'◩'}.guide-heading{padding-left:27px}#card-guide.guide-resizing{user-select:none}
.turn-clock{position:absolute;left:24px;bottom:22px;width:180px;padding:10px 13px;border:1px solid #819a7266;border-radius:10px;background:#142e25ed;color:#e8eedf;z-index:4;font-size:12px}.turn-clock>div:first-child{display:flex;justify-content:space-between;align-items:center;gap:8px}.turn-clock strong{font-size:21px;font-variant-numeric:tabular-nums}.clock-track{height:5px;border-radius:5px;background:#9bb38a33;overflow:hidden;margin-top:8px}.clock-track i{display:block;width:100%;height:100%;background:#e5c68c;transition:width .1s linear}.clock-urgent{color:#ffb09b!important}.clock-urgent .clock-track i{background:#f48369}.clock-urgent strong{animation:clock-pulse .65s ease-in-out infinite alternate}.truco-clock{text-align:center;padding:8px;border-radius:8px;background:#83907715;font-size:13px}.truco-clock strong{display:inline-block;font-variant-numeric:tabular-nums}@keyframes clock-pulse{to{opacity:.35;transform:scale(1.08)}}@media(max-width:600px){.turn-clock{left:10px;bottom:12px;width:100px;padding:7px;font-size:9px}.turn-clock strong{font-size:17px}.turn-clock>div:first-child{flex-wrap:wrap}.turn-clock #clock-label{max-width:65px}}@media(prefers-reduced-motion:reduce){.clock-urgent strong{animation:none}}
#table-notice{position:fixed;left:50%;top:40%;transform:translate(-50%,-50%);z-index:9;pointer-events:none;background:#173e31f5;border:1px solid #e5c68c;color:#fff3d6;padding:20px 30px;border-radius:16px;box-shadow:0 10px 40px #0005;text-align:center;font-size:clamp(18px,2vw,28px);font-weight:700;max-width:calc(100vw - 32px);width:max-content}.notice-enter{animation:notice-pop .25s ease-out}@keyframes notice-pop{from{opacity:0;transform:translate(-50%,-40%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@media(prefers-reduced-motion:reduce){.notice-enter{animation:none}}
/* Resultado com hierarquia clara, equipes e destaque para a revanche. */
#result-dialog{width:min(520px,calc(100vw - 28px));padding:28px;border:1px solid #71876588;border-radius:22px;box-shadow:0 24px 90px #0005;overflow:auto}
.result-emblem{width:62px;height:62px;margin:0 auto 16px;border-radius:20px;background:#b59a591a;border:1px solid #c3a96c55;display:grid;place-items:center;font-size:39px;color:#c7a769}
#result-dialog[data-outcome='win'] .result-emblem{background:#dfbd7f25;color:#e5bc70;border-color:#d2af68}
#result-dialog>.eyebrow{font-size:10px;letter-spacing:2px}#result-dialog h2{font-size:30px;line-height:1.15;margin:12px 0 8px;letter-spacing:-1px}
#result-subtitle{font-size:13px;line-height:1.5;margin:0 0 22px;color:#748369}
#result-score.result-scoreboard{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0;font-family:inherit;font-size:14px}
.result-team{display:flex;flex-direction:column;align-items:center;min-width:0;padding:17px 10px 13px;border:1px solid #83907740;border-radius:14px;background:#83907708}
.result-team.result-winner{border-color:#bc985c;background:#bc985c14}.result-team-label{font-size:12px;font-weight:600}.result-team>strong{font-family:'Space Grotesk',sans-serif;font-size:58px;font-weight:500;line-height:1.2;letter-spacing:-3px;margin:6px 0;color:#65785b}.result-winner>strong{color:#b58a42}.result-team>small{font-size:11px;line-height:1.4;min-height:31px;overflow-wrap:anywhere}.result-team-badge{font-size:8px;letter-spacing:1.5px;margin-top:11px;color:#7a876e}.result-winner .result-team-badge{color:#af8441}
#result-detail{font-size:11px;color:#7a876e;margin:15px 0 22px}#result-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}#result-actions>.primary{grid-column:1/-1;background:#d9bd87;color:#173e31}#result-actions>.primary:hover{background:#e7cc9b}#result-actions>.result-leave{background:none;border:1px solid transparent;color:inherit;border-radius:6px;font-weight:500;opacity:.75}#result-actions>.result-leave:hover{opacity:1;background:#83907715}#result-actions>.result-leave:nth-child(2){grid-column:1/-1}
html[data-theme='dark'] #result-subtitle,html[data-theme='dark'] #result-detail{color:#aab99e}html[data-theme='dark'] .result-team>strong{color:#aab99e}html[data-theme='dark'] .result-winner>strong{color:#e5c68c}html[data-theme='dark'] .result-winner .result-team-badge{color:#e5c68c}
@media(max-height:700px){#result-dialog{padding:20px}.result-emblem{width:44px;height:44px;font-size:29px;border-radius:13px;margin-bottom:10px}#result-dialog h2{font-size:25px}#result-subtitle{margin-bottom:14px}.result-team{padding:10px}.result-team>strong{font-size:46px;margin:3px 0}#result-detail{margin:10px 0 14px}#result-actions button{min-height:40px;padding:10px;font-size:12px}}
@media(max-width:400px){#result-dialog{padding:18px}#result-dialog h2{font-size:25px}.result-team>strong{font-size:46px}#result-score.result-scoreboard{gap:8px}.result-team>small{font-size:10px}#result-actions button{font-size:11px}}
.extra-settings{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:4px 0 6px}.extra-settings label{font-size:11px}.extra-settings select{font-size:12px;padding:9px;margin:7px 0 0}#resume-session{margin-bottom:18px}
@media(max-width:600px){.room-panel #room-settings>.extra-settings{grid-column:1/-1;grid-row:4}.extra-settings{gap:8px;margin:0}.extra-settings label{font-size:9px}.extra-settings select{font-size:10px;padding:6px;margin-top:3px}}
@media(max-height:700px){.in-room .room-panel{gap:8px}.room-panel .rule-toggle{padding:6px 0}.extra-settings{gap:6px;margin:0}.extra-settings select{padding:6px;margin-top:4px}}
@media(max-width:600px) and (max-height:750px){#seat-picker.four-chairs,#seat-picker.two-chairs{gap:5px;grid-template-rows:auto repeat(2,minmax(min-content,1fr))}.seat-choice{padding:6px;gap:4px}.seat-choice>strong{font-size:8px}.seat-choice>span{font-size:10px;min-height:1.2em;line-height:1.2}.seat-choice .chair-toggle{min-height:24px;padding:5px;font-size:10px}.lobby-center strong{font-size:11px}.lobby-center small{font-size:8px;margin-top:2px}.lobby-center{padding:0!important}}

/* Exemplo interativo dentro de Como jogar. */
.tutorial-entry{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid #ba935b;border-radius:12px;background:#c3a06018;margin-top:10px}.tutorial-entry strong{font-size:13px}.tutorial-entry button{font-size:12px;padding:10px;white-space:nowrap}
#practice-dialog{width:min(1100px,96vw);max-width:1100px;height:min(740px,94dvh);max-height:94dvh;padding:20px;overflow:auto}.practice-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}.practice-top button{background:transparent;border:1px solid #85907766;color:inherit;padding:10px;border-radius:8px}.practice-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;height:calc(100% - 65px)}.practice-table{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;min-height:420px;border:2px solid #a38c5a;border-radius:60px;background:radial-gradient(ellipse,#2b634b,#173e31);color:#fff8e6;padding:24px 18px 45px}.practice-vira{position:absolute;left:6%;top:32%;display:flex;flex-direction:column;align-items:center;gap:8px}.practice-vira small{font-size:9px}.practice-table .card{width:76px;height:106px;display:inline-flex;position:relative}.practice-table .card b{margin:auto;font-size:34px}.practice-table button.card{border:0;padding:0;background:#fffdf3;color:#203a31}.practice-table button.card.red{color:#bf463b}.practice-table button.card:disabled{opacity:1;cursor:default}.practice-table .practice-suggested{outline:3px solid #efc76a;outline-offset:4px;animation:practice-hint 1s ease-in-out infinite alternate}#practice-played{display:flex;gap:20px;align-items:center;min-height:140px;margin-left:75px}#practice-played>div{display:flex;flex-direction:column;align-items:center;gap:7px;animation:practice-enter .3s ease-out}#practice-played small{font-size:11px}.practice-own{display:flex;flex-direction:column;align-items:center;gap:12px}#practice-hand{display:flex;gap:12px}#practice-score{position:absolute;bottom:14px;font-size:12px}.practice-coach{align-self:center;border:1px solid #ba935b;border-radius:16px;padding:20px;background:#d6bb7e12;box-shadow:0 10px 26px #0001}.practice-coach h2{font-size:23px;margin:12px 0}.practice-coach p{font-size:14px;line-height:1.65}.practice-coach small{font-size:10px;line-height:1.5;display:block}.practice-coach #practice-feedback:empty{display:none}#practice-feedback{background:#d0a45322;padding:10px;border-radius:8px}#practice-actions{display:flex;flex-direction:column;gap:8px;margin:18px 0}#practice-actions button{padding:11px;font-size:13px}html[data-theme='dark'] #practice-dialog{background:#182e25;color:#eef1df}
@keyframes practice-hint{to{outline-color:#fff0bb;box-shadow:0 0 16px #edbd6677}}@keyframes practice-enter{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){#practice-dialog{padding:12px}.practice-layout{grid-template-columns:1fr;gap:12px;height:auto}.practice-table{min-height:330px;border-radius:35px;padding:16px 12px 38px}.practice-coach{padding:14px}.practice-coach h2{font-size:19px}.practice-coach p{font-size:13px;margin:8px 0}.practice-table .card{width:56px;height:80px}#practice-played{min-height:100px;gap:12px}.practice-vira{left:3%;top:28%}.practice-vira small{font-size:7px}.practice-top{font-size:12px;margin-bottom:10px}.tutorial-entry{flex-direction:column;align-items:stretch}.tutorial-entry button{white-space:normal}.practice-own{gap:8px}}
@media(prefers-reduced-motion:reduce){#practice-played>div,.practice-table .practice-suggested{animation:none}}