.game-heading,.hand-heading{display:flex;justify-content:space-between;gap:15px;align-items:center}.game-heading .eyebrow{margin:0 0 8px}.game-heading{margin-top:28px}.game-score{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.game-score>div{padding:14px;border:1px solid var(--line);border-top-width:3px;border-radius:8px;display:flex;align-items:center;gap:15px}.game-score .eyebrow{margin:0}.game-score strong{font:30px Georgia}.game-score .note{margin-left:auto}.game-board{height:440px;position:relative;border:7px solid #b79a63;border-radius:90px;background:radial-gradient(ellipse,#356646,#214630);box-shadow:inset 0 0 40px #0b291e55;color:#fffdf0;margin:18px 0 24px}.table-seat{position:absolute;z-index:2;text-align:center;padding:8px 12px;border-radius:8px;max-width:170px;background:#143c2da6;border:1px solid #ffffff26}.table-seat strong{display:block;font-size:13px;overflow-wrap:anywhere}.table-seat span,.table-seat small{display:block;font-size:10px;margin-top:3px;color:#e4e9db}.table-seat.on-turn{border-color:#f6cc5c;box-shadow:0 0 0 2px #e9b92f55}.table-seat.position-0{bottom:12px;left:50%;transform:translateX(-50%)}.table-seat.position-1{right:10px;top:45%;transform:translateY(-50%)}.table-seat.position-2{top:12px;left:50%;transform:translateX(-50%)}.table-seat.position-3{left:10px;top:45%;transform:translateY(-50%)}.table-center{position:absolute;top:22%;left:50%;transform:translateX(-50%);text-align:center;width:260px}.table-center strong{display:block;font:18px Georgia;color:#f5d17a}.table-center span{display:block;font-size:10px;margin-top:5px}.table-trick{position:absolute;inset:0}.playing-card{position:relative;background:#fffdf3;border:1px solid #c5ac75;border-radius:7px;box-shadow:1px 3px 5px #192f3026;color:var(--blue);width:78px;height:112px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:7px;margin:0;font:600 12px Georgia}.playing-card:before{content:'';position:absolute;inset:4px;border:1px solid #d6c59d;border-radius:3px;pointer-events:none}.playing-card svg{width:35px;height:40px}.card-rank{align-self:flex-start;z-index:1}.card-suit{font-size:9px;text-transform:uppercase;letter-spacing:.5px}.playing-card.oros{color:#8b5d13}.playing-card.copas{color:#a1352f}.playing-card.bastos{color:#306444}.playing-card.trick-card{position:absolute;width:72px;height:100px}.trick-card.position-0{top:57%;left:calc(50% - 36px);transform:rotate(-4deg)}.trick-card.position-1{top:44%;left:calc(50% + 31px);transform:rotate(6deg)}.trick-card.position-2{top:32%;left:calc(50% - 36px);transform:rotate(3deg)}.trick-card.position-3{top:44%;left:calc(50% - 105px);transform:rotate(-7deg)}.game-hand{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;margin-top:15px;align-items:start}.game-hand .playing-card{width:100%;min-width:0}.game-hand .playing-card:disabled{cursor:default;opacity:.75}.game-hand .playing-card.legal{border:2px solid var(--gold);opacity:1;box-shadow:0 3px 0 #c293263b}.game-hand .playing-card.legal:hover{background:#fff2ce;transform:translateY(-5px)}.game-controls{background:#f8f2e4;border:1px solid var(--line);border-radius:9px;padding:18px;margin-bottom:22px}.game-controls>button{margin:7px 8px 4px 0}.game-controls label{margin-top:10px}.game-controls p:first-child{margin-top:0}.mark-buttons{display:flex;flex-wrap:wrap;gap:8px}.mark-buttons button{margin:0}.bid-form{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}.bid-form p,.bid-form button{grid-column:1/-1;margin:4px 0}.bid-form input,.bid-form select{padding:10px}.bid-form button{justify-self:start}#pete[aria-pressed=true]{background:#c29326;color:#fff;border-color:#a67a18}#game-log,#auction-log{font-size:12px;line-height:1.8;padding-left:20px}#game-error{color:#a52e29;font-size:13px}.pete-knock{animation:table-knock .22s linear}@keyframes table-knock{25%{transform:translate(3px,2px)}50%{transform:translate(-3px,-2px)}75%{transform:translate(2px,1px)}}@media(prefers-reduced-motion:reduce){.pete-knock{animation:none}.game-hand .playing-card.legal:hover{transform:none}}@media(max-width:720px){.game-hand{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.game-hand .playing-card{max-width:100%;height:106px}.game-score>div{flex-wrap:wrap;gap:7px}.game-score .note{margin-left:0;width:100%}.table-seat{max-width:115px}.table-seat strong{font-size:11px}.game-board{border-radius:45px}.table-seat.position-1{right:5px;top:75%}.table-seat.position-3{left:5px;top:75%}}@media(max-width:440px){.game-board{height:400px;border-width:5px;border-radius:28px}.table-seat.position-0{bottom:9px}.table-seat.position-1,.table-seat.position-3{top:72%;max-width:85px;padding:6px}.table-seat span{font-size:9px}.table-center{top:23%;width:230px}.trick-card.position-0{top:55%}.trick-card.position-1,.trick-card.position-3{top:42%}.trick-card.position-2{top:29%}.game-controls{padding:12px}.bid-form{grid-template-columns:1fr}.game-score .eyebrow{font-size:9px;letter-spacing:1px}.hand-heading h3{font-size:18px}.playing-card{font-size:11px}.card-suit{font-size:8px}.game-heading{align-items:flex-start}.game-heading h3{font-size:19px}}
.game-controls:empty{display:none}

/* Keep the play surface together; histories scroll in their own side panels. */
.game-stage{min-width:0}.game-sidebar{min-width:0}.game-sidebar details{border:1px solid var(--line);border-radius:8px;background:#faf7ef;padding:13px;margin-top:16px}.game-sidebar summary{font-size:12px}.game-sidebar ol{margin:10px 0 0;overflow:auto;scrollbar-width:thin;scrollbar-color:#c6b48b transparent;overflow-wrap:anywhere;overscroll-behavior:contain}.game-sidebar #auction-log,.game-sidebar #game-log{line-height:1.65}
.pete-knock{animation:table-knock .34s ease-out}@keyframes table-knock{15%{transform:translate(5px,3px)}30%{transform:translate(-5px,-3px)}45%{transform:translate(4px,2px)}60%{transform:translate(-3px,-2px)}80%{transform:translate(1px,1px)}}
@media(prefers-reduced-motion:reduce){.pete-knock{animation:none}}
@media(min-width:1000px){
  .playing-table main{max-width:1560px;padding:10px 16px}
  .playing-table header{display:flex;align-items:center;justify-content:center;gap:15px;margin:0 0 10px;height:44px}
  .playing-table header .brand{width:29px;height:40px;margin:0;filter:drop-shadow(2px 2px 0 #d9cfb888)}
  .playing-table header h1{font-size:32px;margin:0}.playing-table header>.eyebrow,.playing-table header>.intro,.playing-table header>.suit-strip{display:none}
  .playing-table #account{padding:12px 16px}.playing-table .account-top{display:none}
  .playing-table .member-nav{padding:0 0 7px;margin:0 0 8px;gap:6px}.playing-table .member-nav button{padding:7px 12px;font-size:12px}
  .playing-table #live-status{display:none}.playing-table .room-heading{margin:0;min-height:29px}.playing-table .room-heading h2{font-size:18px;margin:0}.playing-table .room-heading .eyebrow{display:none}
  .playing-table #waiting-room>p,.playing-table #waiting-room>.notice{display:none}
  .playing-table #room-code-line{display:none}
  .playing-table #game-table{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 14px}
  .playing-table .game-heading{grid-column:1;margin:6px 0 0;gap:12px}.playing-table .game-heading h3{font-size:18px;margin:0}.playing-table .game-heading .eyebrow{font-size:8px;letter-spacing:1.4px;margin:0 0 4px}
  .playing-table .game-heading .compact{font-size:10px;padding:7px 9px}
  .playing-table .game-score{grid-column:2;grid-row:1;margin:5px 0 0;gap:8px;align-self:center}.playing-table .game-score>div{gap:8px;padding:7px 10px}.playing-table .game-score strong{font-size:23px}.playing-table .game-score .eyebrow{font-size:8px;letter-spacing:1px}.playing-table .game-score .note{font-size:10px!important}
  .playing-table #game-status{grid-column:1/-1;font-size:13px;margin:2px 0 4px;line-height:1.4}
  .playing-table .game-layout{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) 252px;gap:16px;align-items:start}
  .playing-table .game-board{height:clamp(260px,calc(100dvh - 420px),390px);margin:0 0 9px;border-width:5px;border-radius:58px}
  .playing-table .table-seat{padding:6px 9px;max-width:140px}.playing-table .table-seat strong{font-size:12px}.playing-table .table-seat span,.playing-table .table-seat small{font-size:9px;margin-top:2px}
  .playing-table .table-seat.position-0{bottom:7px}.playing-table .table-seat.position-2{top:7px}
  .playing-table .table-center{top:19%;width:220px}.playing-table .table-center strong{font-size:17px}.playing-table .table-center span{margin-top:3px}
  .playing-table .playing-card.trick-card{width:61px;height:82px;padding:6px}.playing-table .trick-card svg{width:27px;height:31px}.playing-table .trick-card .card-rank{font-size:11px}.playing-table .trick-card .card-suit{font-size:8px}
  .playing-table .trick-card.position-0{top:52%;left:calc(50% - 30px)}.playing-table .trick-card.position-1{top:41%;left:calc(50% + 26px)}.playing-table .trick-card.position-2{top:29%;left:calc(50% - 30px)}.playing-table .trick-card.position-3{top:41%;left:calc(50% - 87px)}
  .playing-table .game-controls{padding:9px 12px;margin:0 0 9px}.playing-table .game-controls>button{margin:3px 8px 3px 0}.playing-table .game-controls>p{margin:0;font-size:12px}.playing-table .game-controls .compact{padding:8px 10px;font-size:11px}
  .playing-table .hand-heading h3{font-size:18px;margin:0}.playing-table #pete{padding:7px 10px;font-size:11px}.playing-table .game-hand{gap:5px;margin-top:8px}.playing-table .game-hand .playing-card{height:88px;padding:6px}.playing-table .game-hand .playing-card svg{width:29px;height:33px}.playing-table #hand-area>.note{font-size:10px!important;margin:6px 0 0;line-height:1.3}
  .playing-table #game-error{margin:0}.playing-table footer{display:none}.playing-table #message:empty{display:none}
  .playing-table .game-sidebar{display:grid;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:10px;height:calc(100dvh - 248px);min-height:340px;max-height:650px}
  .playing-table .game-sidebar details{margin:0;padding:12px;min-height:0;overflow:hidden}.playing-table .game-sidebar ol{max-height:calc((100dvh - 248px)/2 - 56px)}
  .playing-table #game-table:is([data-phase=auction],[data-phase=draw],[data-phase=cut],[data-phase=trump],[data-phase=sing],[data-phase=handEnd],[data-phase=matchEnd]) .game-stage{display:grid;grid-template-columns:minmax(0,1fr) 232px;gap:9px 12px;align-items:start}
  .playing-table #game-table:is([data-phase=auction],[data-phase=draw],[data-phase=cut],[data-phase=trump],[data-phase=sing],[data-phase=handEnd],[data-phase=matchEnd]) .game-board{grid-column:1;margin:0;min-width:0}
  .playing-table #game-table:is([data-phase=auction],[data-phase=draw],[data-phase=cut],[data-phase=trump],[data-phase=sing],[data-phase=handEnd],[data-phase=matchEnd]) .game-controls{grid-column:2;grid-row:1;max-height:clamp(260px,calc(100dvh - 420px),390px);overflow:auto;margin:0}
  .playing-table #game-table:is([data-phase=auction],[data-phase=draw],[data-phase=cut],[data-phase=trump],[data-phase=sing],[data-phase=handEnd],[data-phase=matchEnd]) #hand-area{grid-column:1/-1}
  .playing-table #game-table:is([data-phase=auction],[data-phase=draw],[data-phase=cut],[data-phase=trump],[data-phase=sing],[data-phase=handEnd],[data-phase=matchEnd]) #game-error{grid-column:1/-1}
  .playing-table .bid-form{grid-template-columns:1fr;gap:6px;margin-top:8px;padding-top:8px}.playing-table .bid-form label,.playing-table .game-controls label{font-size:11px;margin-top:5px}.playing-table .bid-form input,.playing-table .bid-form select,.playing-table .game-controls input{padding:7px;margin-top:5px;font-size:12px}.playing-table .mark-buttons{gap:6px}.playing-table .game-controls .note{font-size:11px!important;line-height:1.4}
}
@media(min-width:1000px) and (max-height:720px){.playing-table .game-board{height:260px}.playing-table .game-sidebar{height:calc(100dvh - 220px);min-height:300px}.playing-table .game-sidebar ol{max-height:calc((100dvh - 220px)/2 - 56px)}.playing-table .game-hand .playing-card{height:76px}.playing-table .game-hand .playing-card svg{width:25px;height:27px}.playing-table #hand-area>.note{display:none}}
@media(max-width:999px){.game-sidebar{display:grid;grid-template-columns:1fr 1fr;gap:12px}.game-sidebar ol{max-height:230px}.game-sidebar details{min-width:0}}
@media(max-width:600px){.game-sidebar{grid-template-columns:1fr;gap:0}}
@media(min-width:1000px){.playing-table .game-sidebar{height:min(650px,var(--game-space,calc(100dvh - 284px)));min-height:0}.playing-table .game-sidebar ol{max-height:calc((min(650px,var(--game-space,calc(100dvh - 284px))) - 10px)/2 - 50px)}}
@media(min-width:1000px){.playing-table .table-center{top:17%}.playing-table .trick-card.position-0{top:48%}.playing-table .trick-card.position-2{top:31%}.playing-table .table-seat strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playing-table .table-seat.position-0{max-width:210px}}
@media(min-width:1000px){.playing-table .table-seat span,.playing-table .table-seat small{display:inline}.playing-table .table-seat small:not(:empty)::before{content:' · '}.playing-table .table-center{top:16%}}
@media(min-width:1000px) and (max-height:800px){.playing-table .playing-card.trick-card{width:48px;height:60px;padding:4px}.playing-table .trick-card svg{width:20px;height:22px}.playing-table .trick-card .card-rank{font-size:10px}.playing-table .trick-card .card-suit{font-size:7px}.playing-table .trick-card.position-0{top:55%;left:calc(50% - 24px)}.playing-table .trick-card.position-2{top:31%;left:calc(50% - 24px)}.playing-table .trick-card.position-1{top:42%;left:calc(50% + 29px)}.playing-table .trick-card.position-3{top:42%;left:calc(50% - 77px)}}
@media(min-width:1000px){.playing-table .table-center{top:15px;left:12px;width:128px;transform:none;text-align:left}.playing-table .table-center strong{font-size:16px}}
@media(min-width:1000px){.playing-table main{padding-bottom:0}}

/* Square felt; the auction is a full-width bar immediately above the hand. */
.playing-table #game-table[data-phase] .game-stage{display:flex;flex-direction:column;gap:0;align-items:stretch}
.playing-table #game-table[data-phase] .game-board{width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:1/1;flex:none;margin:0 0 18px;align-self:center}
.playing-table #game-table[data-phase] .game-controls{grid-column:auto;grid-row:auto;display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;width:100%;max-height:none;overflow:visible;margin:0 0 18px;padding:16px}
.playing-table #game-table[data-phase] .game-controls:empty{display:none}
.playing-table #game-table[data-phase] .game-controls>p{flex:1 0 100%;margin:0}
.playing-table #game-table[data-phase] .game-controls>.mark-buttons{flex:0 1 auto;gap:8px}
.playing-table #game-table[data-phase] .game-controls>button{flex:0 0 auto;margin:0}
.playing-table #game-table[data-phase] .game-controls .mark-buttons button{margin:0}
.playing-table #game-table[data-phase] .game-controls .bid-form{display:flex;flex:1 0 100%;flex-wrap:wrap;align-items:flex-end;gap:10px 16px;margin:2px 0 0;padding-top:12px;min-width:0}
.playing-table #game-table[data-phase] .bid-form>label{flex:1 1 190px;min-width:0;margin:0}
.playing-table #game-table[data-phase] .bid-form>label:has(select){flex-grow:1.3}
.playing-table #game-table[data-phase] .bid-form>button{flex:0 0 auto;margin:0;align-self:flex-end}
.playing-table #game-table[data-phase] .bid-form>p{order:1;flex:1 0 100%;margin:0}
.playing-table #game-table[data-phase] #hand-area{width:100%;margin-top:12px;padding-top:4px}
.playing-table #game-table[data-phase] .game-hand{margin-top:12px}
.playing-table #game-table[data-phase] .table-seat.position-1,.playing-table #game-table[data-phase] .table-seat.position-3{top:50%}
@media(min-width:1000px){
  .playing-table main{padding-top:6px}
  .playing-table header{height:28px;margin-bottom:6px;gap:10px}
  .playing-table header .brand{width:21px;height:28px}.playing-table header h1{font-size:26px}
  .playing-table #account{padding-top:8px;padding-bottom:8px}
  .playing-table .member-nav{padding-bottom:4px;margin-bottom:4px}.playing-table .member-nav button{padding:5px 10px}
  .playing-table .room-heading{min-height:26px}.playing-table .room-heading h2{font-size:16px}.playing-table #leave-room{padding:5px 9px;font-size:11px}
  .playing-table .game-heading .eyebrow{display:none}.playing-table .game-heading h3{font-size:16px}
  .playing-table .game-score>div{padding:4px 8px}.playing-table .game-score strong{font-size:20px}
  .playing-table #game-table[data-phase] .game-board{width:min(100%,var(--felt-size,300px));margin-bottom:8px;border-radius:42px}
  .playing-table #game-table[data-phase] .game-controls{padding:8px 10px;gap:6px 8px;margin-bottom:6px}
  .playing-table #game-table[data-phase] .game-controls>p{font-size:11px;line-height:1.3}
  .playing-table #game-table[data-phase] .game-controls>.mark-buttons,.playing-table #game-table[data-phase] .game-controls>button{order:1}
  .playing-table #game-table[data-phase] .game-controls .bid-form{order:2;padding-top:6px;margin-top:0;gap:4px 10px}
  .playing-table #game-table[data-phase] .game-controls .compact{padding:6px 9px}
  .playing-table #game-table[data-phase] .bid-form input,.playing-table #game-table[data-phase] .bid-form select{padding:5px;margin-top:3px}
  .playing-table #game-table[data-phase] .bid-form>label{flex-basis:170px}
  .playing-table #game-table[data-phase] #hand-area{margin-top:0;padding-top:0}
  .playing-table #game-table[data-phase] .game-hand{margin-top:6px}
  .playing-table .game-sidebar{position:sticky;top:12px;height:var(--game-space,calc(100dvh - 220px));max-height:none}
  .playing-table .game-sidebar ol{max-height:calc((var(--game-space,calc(100dvh - 220px)) - 10px)/2 - 50px)}
  .playing-table #game-table[data-phase] .playing-card.trick-card{width:72px;height:100px;padding:7px}
  .playing-table #game-table[data-phase] .trick-card svg{width:32px;height:37px}
  .playing-table #game-table[data-phase] .trick-card .card-rank{font-size:12px}
  .playing-table #game-table[data-phase] .trick-card .card-suit{font-size:8px}
  .playing-table #game-table[data-phase] .trick-card.position-0{top:calc(50% + 12px);left:calc(50% - 36px)}
  .playing-table #game-table[data-phase] .trick-card.position-2{top:calc(50% - 112px);left:calc(50% - 36px)}
  .playing-table #game-table[data-phase] .trick-card.position-1{top:calc(50% - 50px);left:calc(50% + 46px)}
  .playing-table #game-table[data-phase] .trick-card.position-3{top:calc(50% - 50px);left:calc(50% - 118px)}
}
@media(min-width:1000px) and (max-height:800px){
  .playing-table #game-table[data-phase] .playing-card.trick-card{width:38px;height:52px;padding:4px}
  .playing-table #game-table[data-phase] .trick-card svg{width:18px;height:18px}
  .playing-table #game-table[data-phase] .trick-card .card-rank{font-size:9px}
  .playing-table #game-table[data-phase] .trick-card .card-suit{font-size:6px}
  .playing-table #game-table[data-phase] .trick-card.position-0{top:calc(50% + 2px);left:calc(50% - 19px)}
  .playing-table #game-table[data-phase] .trick-card.position-2{top:calc(50% - 54px);left:calc(50% - 19px)}
  .playing-table #game-table[data-phase] .trick-card.position-1{top:calc(50% - 26px);left:calc(50% + 12px)}
  .playing-table #game-table[data-phase] .trick-card.position-3{top:calc(50% - 26px);left:calc(50% - 50px)}
  .playing-table .table-seat.position-1,.playing-table .table-seat.position-3{max-width:58px;padding:4px}
  .playing-table .table-seat.position-1 strong,.playing-table .table-seat.position-3 strong{font-size:10px}
  .playing-table .table-seat.position-1 span,.playing-table .table-seat.position-3 span,.playing-table .table-seat.position-1 small,.playing-table .table-seat.position-3 small{font-size:8px}
  .playing-table .table-seat.position-1{right:4px}.playing-table .table-seat.position-3{left:4px}
  .playing-table .table-seat.position-1 span,.playing-table .table-seat.position-3 span{display:block}
  .playing-table .table-center{top:10px;left:8px;width:52px}.playing-table .table-center strong{font-size:11px}.playing-table .table-center span{display:none}
}
@media(max-width:999px){.playing-table #game-table[data-phase] .game-controls{padding:12px;gap:10px}.playing-table #game-table[data-phase] .bid-form>label{flex-basis:160px}}

/* Clear table information and taller hand cards that fill the available panel. */
.table-center .trump-symbol{display:inline-flex;align-items:center;justify-content:center;width:64px;height:72px;background:#fff9e7;border:1px solid #c5ac75;border-radius:10px;box-shadow:0 2px 6px #102c2440}
.table-center .trump-symbol svg{width:48px;height:54px}
.playing-table #game-table .table-center{width:180px}
.playing-table #game-table .table-center strong{font-size:24px}
.playing-table #game-table .table-center>span{font-size:14px;line-height:1.4;margin-top:6px}
@media(min-width:1000px){
  .playing-table #game-table[data-phase] .game-stage{min-height:var(--game-space,auto)}
  .playing-table #game-table[data-phase] .game-controls{flex:none}
  .playing-table #game-table[data-phase] #hand-area{display:flex;flex-direction:column;flex:none}
  .playing-table #game-table[data-phase] .game-hand{--hand-card-min:88px;flex:none;height:var(--hand-card-height,var(--hand-card-min));min-height:var(--hand-card-min);align-items:stretch}
  .playing-table #game-table[data-phase] .game-hand .playing-card{height:100%;min-height:var(--hand-card-min)}
  .playing-table #game-table[data-phase] .hand-heading,.playing-table #hand-area>.note{flex:none}
}
@media(min-width:1000px) and (max-height:720px){.playing-table #game-table[data-phase] .game-hand{--hand-card-min:76px}}
@media(min-width:1000px) and (max-height:800px){
  .playing-table #game-table .table-center{width:52px}
  .playing-table #game-table .table-center strong{font-size:14px}
  .playing-table #game-table .table-center>span{display:block;font-size:10px;margin-top:4px}
  .playing-table #game-table .table-center .trump-symbol{width:40px;height:44px;border-radius:6px}
  .playing-table #game-table .table-center .trump-symbol svg{width:30px;height:34px}
}

.game-controls .trump-choice{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.trump-choice-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:27px;height:29px;border-radius:4px;background:#fffaf0}
.trump-choice-icon svg{display:block;width:23px;height:25px}

/* Each rank has its own illustration; keep the established card dimensions. */
.playing-card .card-art{flex:1 1 0;min-height:0;min-width:0;width:100%;height:auto;align-self:stretch;position:relative;z-index:1}
.playing-card .card-rank,.playing-card .card-suit{flex:none;line-height:1.1}
.playing-table #game-table[data-phase] .playing-card .card-art{width:100%;height:auto}
.history-cards .playing-card .card-art{width:100%;height:auto}
.playing-card .card-footer{display:flex;align-items:flex-end;justify-content:space-between;width:100%;flex:none;gap:2px;min-width:0;margin-top:2px}
.playing-card .card-footer .card-suit{align-self:center;margin:0;letter-spacing:0}
.playing-card .card-footer .card-rank-bottom{display:block;align-self:flex-end;margin:0 0 0 auto;transform:rotate(180deg);white-space:nowrap}
.playing-card .card-footer:has(.ace-ribbon){flex-wrap:wrap;row-gap:0}
.playing-card .card-footer .ace-ribbon{position:relative;isolation:isolate;flex:0 0 calc(100% - 8px);margin:0 4px 2px;padding:2px 0;background:linear-gradient(#f7ebc8,#ead29c);border-top:1px solid #b79a63;border-bottom:1px solid #b79a63;text-align:center;line-height:1;letter-spacing:.3px;white-space:nowrap}
.ace-ribbon:before,.ace-ribbon:after{content:'';position:absolute;top:2px;bottom:-3px;width:6px;background:#d7b778;z-index:-1}
.ace-ribbon:before{left:-4px;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,30% 50%)}
.ace-ribbon:after{right:-4px;clip-path:polygon(0 0,100% 0,70% 50%,100% 100%,0 100%)}

/* Public actions from this hand, with the actual captured or announced cards. */
.game-sidebar #game-log{padding-left:0;list-style:none}
.history-row{display:flex;align-items:center;gap:8px;min-width:0;margin:0 0 6px;min-height:22px}
.history-row:last-child{margin-bottom:0}
.history-caption{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.history-cards{display:flex;align-items:center;gap:4px;flex:none}
.history-cards .playing-card{width:38px;height:52px;padding:3px;font-size:8px;box-shadow:0 1px 2px #192f3026;border-radius:4px}
.history-cards .playing-card:before{inset:2px;border-radius:2px}
.history-cards .playing-card svg{width:18px;height:20px}
.history-cards .playing-card .card-rank{white-space:nowrap}
.history-cards .playing-card .card-suit{font-size:6px;letter-spacing:0;white-space:nowrap}
.history-cards .playing-card .card-footer:has(.card-suit){flex-wrap:wrap;row-gap:0}
.history-cards .playing-card .card-footer .ace-ribbon{flex-basis:calc(100% - 4px);margin:0 2px 1px;font-size:5px;padding:1px 0;text-align:center;border-width:.5px;letter-spacing:0}
.history-cards .ace-ribbon:before,.history-cards .ace-ribbon:after{width:3px;top:1px;bottom:-2px}
.history-cards .ace-ribbon:before{left:-2px}.history-cards .ace-ribbon:after{right:-2px}
@media(min-width:1000px){
  .playing-table main{max-width:1728px}
  .playing-table .game-layout{grid-template-columns:minmax(0,1fr) 420px}
  .playing-table .game-sidebar #game-log{font-size:11px;line-height:1.4}
}
@media(max-width:999px){.game-sidebar{grid-template-columns:1fr}.game-sidebar #game-log{max-height:360px}}
@media(max-width:440px){.history-cards{gap:3px}.history-cards .playing-card{width:29px;height:42px;font-size:6px}.history-cards .playing-card .card-suit{font-size:5px}.history-row{gap:5px}.history-caption{font-size:11px}}

/* Comic dialogue belongs to the speaking player's seat and points into the felt. */
.table-seat:has(.speech-bubble){z-index:5}
.table-seat .speech-bubble{position:absolute;z-index:6;width:max-content;min-width:86px;max-width:260px;padding:11px 14px;background:#fffaf0;color:#234b79;border:2px solid #b79a63;border-radius:17px;box-shadow:0 5px 14px #102c2440;pointer-events:none;text-align:center;white-space:normal}
.speech-bubble::after{content:'';position:absolute;width:12px;height:12px;background:#fffaf0;transform:rotate(45deg)}
.speech-bubble .speech-text{font:600 14px/1.35 system-ui,sans-serif;overflow-wrap:anywhere}
.table-seat.position-0 .speech-bubble{bottom:calc(100% + 14px);left:50%;transform:translateX(-50%)}
.table-seat.position-0 .speech-bubble::after{bottom:-8px;left:calc(50% - 7px);border-right:2px solid #b79a63;border-bottom:2px solid #b79a63}
.table-seat.position-2 .speech-bubble{top:calc(100% + 14px);left:50%;transform:translateX(-50%)}
.table-seat.position-2 .speech-bubble::after{top:-8px;left:calc(50% - 7px);border-left:2px solid #b79a63;border-top:2px solid #b79a63}
.table-seat.position-1 .speech-bubble{right:calc(100% + 14px);top:50%;transform:translateY(-50%)}
.table-seat.position-1 .speech-bubble::after{right:-8px;top:calc(50% - 7px);border-right:2px solid #b79a63;border-top:2px solid #b79a63}
.table-seat.position-3 .speech-bubble{left:calc(100% + 14px);top:50%;transform:translateY(-50%)}
.table-seat.position-3 .speech-bubble::after{left:-8px;top:calc(50% - 7px);border-left:2px solid #b79a63;border-bottom:2px solid #b79a63}
.speech-bubble .speech-suit{margin:7px auto 0;width:46px;height:50px;display:flex;align-items:center;justify-content:center}
.speech-suit svg{width:42px;height:46px}
.speech-bubble .speech-cards{justify-content:center;margin-top:8px}
.speech-cards .playing-card{flex:none}
.table-seat .speech-cards .playing-card .card-rank{font-size:8px;display:block;color:inherit;margin:0}
.table-seat .speech-cards .playing-card .card-suit{font-size:6px;display:block;color:inherit;margin:0}
@media(max-width:999px),(max-height:800px){
  .table-seat .speech-bubble{max-width:150px;min-width:64px;padding:7px 9px;border-radius:12px}
  .speech-bubble .speech-text{font-size:11px}
  .speech-bubble .speech-suit{width:32px;height:36px;margin-top:5px}.speech-suit svg{width:30px;height:34px}
  .speech-bubble .speech-cards{gap:3px;margin-top:6px}
  .speech-cards .playing-card{width:29px;height:42px;font-size:6px}
  .table-seat .speech-cards .playing-card .card-rank{font-size:6px}.table-seat .speech-cards .playing-card .card-suit{font-size:5px}
  .table-seat .speech-cards .playing-card .card-footer .ace-ribbon{font-size:4px}
}

/* Cards in the trick and in flight match the hidden hands and the cut deck. */
.playing-table #game-table[data-phase] .playing-card:is(.trick-card,.played-flight){box-sizing:border-box;width:var(--back-width,42px);height:var(--back-height,63px);padding:calc(var(--back-width,42px)*.07);font-size:calc(var(--back-width,42px)*.19)}
.playing-table #game-table[data-phase] :is(.trick-card,.played-flight) .card-rank{font-size:inherit}
.playing-table #game-table[data-phase] :is(.trick-card,.played-flight) .card-suit{font-size:calc(var(--back-width,42px)*.12)}
.playing-table #game-table[data-phase] .trick-card.position-0{top:calc(50% + var(--back-height,63px)*.06);left:calc(50% - var(--back-width,42px)/2)}
.playing-table #game-table[data-phase] .trick-card.position-2{top:calc(50% - var(--back-height,63px)*1.06);left:calc(50% - var(--back-width,42px)/2)}
.playing-table #game-table[data-phase] .trick-card.position-1{top:calc(50% - var(--back-height,63px)/2);left:calc(50% + var(--back-width,42px)*.1)}
.playing-table #game-table[data-phase] .trick-card.position-3{top:calc(50% - var(--back-height,63px)/2);left:calc(50% - var(--back-width,42px)*1.1)}
/* Hovering the history still uses the larger first-person hand as its reference. */
#game-log .history-cards{cursor:zoom-in;border-radius:4px}
#game-log .history-cards:focus-visible{outline:2px solid #234b79;outline-offset:3px}
.history-card-preview{position:fixed;z-index:1000;left:0;top:0;width:max-content;max-width:calc(100vw - 16px);box-sizing:border-box;padding:12px;border:1px solid #b79a63;border-radius:10px;background:#faf7ef;box-shadow:0 8px 28px #102c2440;pointer-events:none}
.preview-caption{font:600 12px/1.4 system-ui,sans-serif;color:#234b79;margin-bottom:9px}
.preview-cards{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.history-card-preview .playing-card{flex:none;box-sizing:border-box;width:var(--player-card-width);height:var(--player-card-height);padding:var(--player-card-padding);font-size:var(--player-card-font)}

/* Figure suits remain visible independently of the clothing and held emblem. */
.playing-card .card-rank.figure-index,.table-seat .speech-cards .playing-card .card-rank.figure-index{display:inline-flex;align-items:center;gap:2px;line-height:1.1}
.playing-card .card-rank .figure-suit-icon,.playing-table #game-table[data-phase] .playing-card .card-rank .figure-suit-icon{display:block;flex:none;width:1.1em;height:1.1em}
.history-cards .playing-card .card-rank.figure-index{gap:1px}

/* The same ornamental back is used in the deck, the deal and every hidden hand. */
.opponent-hands,.card-flights{position:absolute;inset:0;pointer-events:none}
.opponent-hands{z-index:1}.table-trick{z-index:2}.table-seat{z-index:3}.card-flights{z-index:8}
.card-back{width:var(--back-width,32px);height:var(--back-height,48px);border-radius:5px;box-shadow:0 2px 4px #102c2440;overflow:hidden}
.card-back img{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}
.opponent-hand{position:absolute;pointer-events:none}
.opponent-hand.position-2{top:65px;left:50%;transform:translateX(-50%)}
.opponent-hand.position-1{right:9px;bottom:25px}.opponent-hand.position-3{left:9px;bottom:25px}
.hands-outside .opponent-hand.position-1,.hands-outside .opponent-hand.position-3{top:50%;bottom:auto;transform:translateY(-50%)}
.hands-outside .opponent-hand.position-1{right:calc(-1*var(--back-height) - 12px)}
.hands-outside .opponent-hand.position-3{left:calc(-1*var(--back-height) - 12px)}
.opponent-card{position:absolute}
.flying-card{position:absolute;left:0;top:0;will-change:transform}
.deal-deck{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:2px 2px 0 #fff9e9,3px 3px 0 #b79a63,5px 5px 0 #fff9e9,6px 6px 0 #b79a63,0 4px 12px #102c2466}
#game-hand.cards-facedown>.playing-card{opacity:0;pointer-events:none}
#game-hand.cards-facedown>.playing-card.dealt{opacity:1}
#game-hand.cards-facedown>.playing-card>*{visibility:hidden}
#game-hand.cards-facedown>.playing-card::after{content:'';position:absolute;inset:0;background:url('/card-back.svg?v=0.6.18') center/100% 100%;border-radius:inherit}
@media(max-width:440px){.opponent-hand.position-1,.opponent-hand.position-3{bottom:54px}.opponent-hand.position-1{right:5px}.opponent-hand.position-3{left:5px}}
@media(prefers-reduced-motion:reduce){.flying-card{will-change:auto}}

/* Cut packets and public contract, using the existing card back and suit art. */
.cut-packet{position:absolute;left:0;top:0;width:var(--back-width,clamp(42px,12%,68px));height:var(--back-height,auto);aspect-ratio:2/3;box-shadow:2px 2px 0 #fff9e9,3px 3px 0 #b79a63,5px 5px 0 #fff9e9,6px 6px 0 #b79a63,0 4px 12px #102c2466;will-change:transform}
.mano-icon{display:inline-block!important;font-size:1.25em!important;line-height:1;vertical-align:middle;margin-left:6px}
.table-contract{display:flex;align-items:center;gap:7px}.table-contract .contract-number{font:700 clamp(24px,3vw,36px)/1 system-ui,sans-serif;color:#f2d280}
#table-center .contract-pair{font-size:13px;font-weight:600;color:#fff6d5}
#bot-learning-panel{margin:18px 0;padding:16px;border:1px solid #d8c8a7;border-radius:10px;background:#faf7ef}
#bot-learning-panel summary{cursor:pointer;font-weight:600}#bot-learning-reviews{max-height:420px;overflow:auto}
.bot-review{padding:10px 0;border-top:1px solid #ddd2bd;margin:0}.bot-review strong{color:#234b79}

.bot-guidance-form{margin:18px 0;padding-bottom:12px;border-bottom:1px solid #d8c8a7}.bot-guidance-form label{font-weight:600}.bot-guidance-form textarea{display:block;width:100%;box-sizing:border-box;min-height:150px;resize:vertical;line-height:1.6;margin:10px 0;font:inherit;background:#fffdf7;color:#234b79}
#bot-guidance-rules{list-style:none;padding:0;margin:12px 0 20px;max-height:360px;overflow:auto}.bot-guidance-rule{border-left:3px solid #52864b;padding:10px 12px;margin:9px 0;background:#f0f4e9}.bot-guidance-rule.pending{border-color:#b18430;background:#faf0db}.bot-guidance-rule p{margin:5px 0;white-space:pre-wrap;overflow-wrap:anywhere}.bot-guidance-rule strong{font-size:13px}

/* Individual bot progress and the existing Spanish-card palette. */
.bot-rating{display:inline-flex;align-items:center;flex-wrap:wrap;gap:7px;line-height:1.3}.bot-stars{display:inline-block;position:relative;color:#b9b3a6;font:20px/1.2 Arial,sans-serif;letter-spacing:1px;white-space:nowrap}.bot-stars-fill{position:absolute;left:0;top:0;color:#c29426;overflow:hidden;white-space:nowrap;height:100%}.bot-rating-label{font-size:12px;color:#53695d}.compact-rating{display:flex;justify-content:center;margin-top:3px}.compact-rating .bot-stars{font-size:12px;letter-spacing:0}.table-seat .bot-rating{width:100%}.seat>label{margin-top:14px}.seat select{width:100%;box-sizing:border-box}.seat .bot-rating{margin-bottom:8px}
#bot-roster-panel{margin:18px 0;padding:16px;border:1px solid #d8c8a7;border-radius:10px;background:#faf7ef}#bot-roster-panel summary{font-weight:600;cursor:pointer}#bot-create-form{margin:16px 0}.bot-roster-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;max-height:520px;overflow:auto}.bot-profile-card{padding:14px;border:1px solid #d8c8a7;border-radius:8px;background:#fffdf7}.bot-profile-card h3{font-size:20px;margin:0 0 8px}.bot-memory-choice{display:block;margin:18px 0 10px}.bot-memory-choice select{max-width:100%;width:100%}.bot-experience-history{margin:16px 0}.bot-experience-history>div{max-height:300px;overflow:auto}

.table-seat .bot-rating{display:flex}.table-seat .bot-stars{display:inline-block;flex:none;color:#b9b3a6;margin:0}.table-seat .bot-stars-fill{display:block;color:#e8be4f;margin:0;font:inherit;letter-spacing:inherit}

.bot-profile-card h3,.seat h3{overflow-wrap:anywhere}

.playing-table .table-seat .bot-rating{display:flex}.playing-table .table-seat .bot-stars{display:inline-block;font:12px/1.2 Arial,sans-serif;letter-spacing:0;margin:0}.playing-table .table-seat .bot-stars-fill{display:block;font:inherit;letter-spacing:inherit;margin:0}

/* A review opens only after all forty cards have been played. */
.posthand-panel{flex:1 0 100%;min-width:0;border-top:1px solid #d8c8a7;padding-top:8px}.posthand-panel h4{margin:0 0 5px;font-size:17px}.posthand-panel>p{margin:5px 0}.posthand-form{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:8px 12px;align-items:end}.posthand-form>label:first-child{grid-row:1/3}.posthand-form label{display:block;margin:0}.posthand-form textarea{display:block;box-sizing:border-box;width:100%;resize:vertical;min-height:82px;max-height:240px;padding:9px;font:14px/1.5 system-ui,sans-serif;background:#fffdf7;color:#234b79;border:1px solid #cfc0a2;border-radius:6px;margin-top:5px}.posthand-form select{width:100%;margin-top:5px}.posthand-form button{margin:0}.feedback-state{font-weight:600;color:#28543b}.posthand-history>div{overflow:auto;min-height:0;flex:1}.posthand-comment{padding:10px 0;border-bottom:1px solid #ddd2bd}.posthand-comment p{white-space:pre-wrap;overflow-wrap:anywhere;margin:6px 0;font-size:13px;line-height:1.45}.posthand-comment strong{font-size:13px}.bot-table-lessons{max-height:380px;overflow:auto;margin-top:20px}.bot-table-lessons p{white-space:pre-wrap;overflow-wrap:anywhere}
.table-seat .speech-bubble.posthand-bubble{max-width:min(410px,70vw);width:330px;pointer-events:auto;text-align:left}.speech-bubble .feedback-recipient{font:700 11px/1.3 system-ui,sans-serif;color:#8a661c;margin:0 0 6px}.posthand-bubble .speech-text{font-size:13px;font-weight:500;white-space:pre-wrap;max-height:min(50vh,370px);overflow:auto}
@media(max-width:600px){.posthand-form{grid-template-columns:minmax(0,1fr)}.posthand-form>label:first-child{grid-row:auto}.table-seat .speech-bubble.posthand-bubble{width:210px;max-width:65vw}.posthand-bubble .speech-text{font-size:11px}}

/* A compact rating: truncated decimal, gold/empty stars and completed matches. */
.bot-rating{gap:4px;flex-wrap:nowrap;font:13px/1.3 system-ui,sans-serif}.bot-rating-score{color:#234b79;font-variant-numeric:tabular-nums}.bot-match-count{color:#234b79;font-size:12px}.bot-stars{display:inline-flex;position:static;align-items:center;font:18px/1.1 Arial,sans-serif;letter-spacing:0;white-space:nowrap}.bot-stars>span{display:inline-block!important;margin:0!important;font:inherit!important;line-height:inherit!important}.bot-stars .bot-star-gold{color:#c68c16!important}.bot-stars .bot-star-empty{color:#8b784b!important}
.playing-table .table-seat .bot-rating{gap:3px;white-space:nowrap;margin-top:4px;justify-content:center}.table-seat:has(.bot-rating){min-width:100px}.playing-table .table-seat .bot-stars{display:inline-flex;font:12px/1.1 Arial,sans-serif;margin:0;color:inherit}.table-seat .bot-rating-score,.table-seat .bot-match-count{display:inline!important;font:11px/1.1 system-ui,sans-serif!important;margin:0!important;color:#fff5d9!important}.table-seat .bot-stars .bot-star-gold{color:#f0bf45!important}.table-seat .bot-stars .bot-star-empty{color:#c9c8a8!important}
.bot-picker{position:relative;margin:6px 0 12px;min-width:0}.bot-picker-label{margin:14px 0 0;font-size:13px}.bot-picker-trigger{display:flex;align-items:center;gap:10px;justify-content:space-between;width:100%;box-sizing:border-box;padding:10px 12px;background:#fffdf7;color:#234b79;border:1px solid #cdbb96;border-radius:6px;font:14px/1.3 system-ui,sans-serif;text-align:left;margin:0}.bot-picker-trigger>span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.bot-picker-arrow{font-size:12px}.bot-picker-options{position:absolute;top:calc(100% + 4px);left:0;right:0;max-height:280px;overflow:auto;z-index:30;background:#fffdf7;border:1px solid #b79a63;border-radius:6px;box-shadow:0 6px 18px #102c2430;padding:4px}.bot-picker-option{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px;border-radius:4px;font:14px/1.3 system-ui,sans-serif;cursor:pointer;color:#234b79}.bot-picker-option[aria-selected=true]{background:#edf0e6}.bot-picker-option.active,.bot-picker-option:not([aria-disabled=true]):hover{outline:1px solid #b79a63;background:#f8efd9}.bot-picker-option[aria-disabled=true]{opacity:.4;cursor:not-allowed}.bot-picker-option[aria-disabled=true]::after{content:'En la mesa';font-size:10px;color:#53695d}.bot-picker-trigger:focus-visible{outline:2px solid #234b79;outline-offset:2px}
.seat .bot-picker-trigger,.seat .bot-picker-trigger:hover,.seat .bot-picker-trigger:focus{background:#fffdf7;color:#234b79;border:1px solid #cdbb96}.seat .bot-picker-trigger>span:first-child{color:#234b79}

/* Initial draw: cut, turn the public card over, then keep each result visible. */
.draw-layer{position:absolute;inset:0;z-index:4;pointer-events:none}.draw-layer.draw-turning{perspective:900px}.drawn-result{position:absolute;text-align:center}.drawn-result .playing-card.drawn-card{box-sizing:border-box;width:100%;height:var(--draw-card-height);padding:5px;font-size:11px;transform-origin:center;backface-visibility:hidden}.drawn-result .card-rank{font-size:inherit}.drawn-result .card-art{width:100%;height:auto}.drawn-label{font:600 10px/1.3 system-ui,sans-serif;color:#fff7df;margin-top:5px;text-shadow:0 1px 2px #102c24;overflow-wrap:anywhere}.draw-winner .drawn-card,.draw-tied .drawn-card{outline:3px solid #f2c65c;outline-offset:2px}.draw-winner .drawn-label{color:#ffe59b}.draw-packet,.draw-turn-back{position:absolute;left:0;top:0;transform-origin:center;will-change:transform}.draw-packet{z-index:5;box-shadow:2px 2px 0 #fff9e9,3px 3px 0 #b79a63,0 3px 10px #102c2455}.draw-turn-back{z-index:6;backface-visibility:hidden}.drawn-result{z-index:7}.draw-outcome{position:absolute;bottom:12%;left:15%;right:15%;text-align:center;font:700 clamp(12px,2vw,18px)/1.3 system-ui,sans-serif;color:#ffe59b;text-shadow:0 1px 2px #102c24}.is-drawing .table-center{visibility:hidden}
@media(prefers-reduced-motion:reduce){.draw-packet,.draw-turn-back{will-change:auto}}

.playing-table #game-table[data-phase=auction] #table-center{width:150px;text-align:center}.playing-table #game-table #table-center .auction-indicator-title{display:block;font:600 13px/1.3 system-ui,sans-serif;color:#fff2cf;margin:0}.playing-table #game-table #table-center .auction-indicator-number{display:block;font:700 38px/1.1 system-ui,sans-serif;color:#f5d17a;margin:4px 0}.playing-table #game-table #table-center .auction-indicator-player{display:block;font:500 12px/1.3 system-ui,sans-serif;color:#fff2cf;margin:0;overflow-wrap:anywhere}
@media(max-height:800px){.playing-table #game-table[data-phase=auction] #table-center{width:112px;left:8px}.playing-table #game-table #table-center .auction-indicator-title{font-size:10px}.playing-table #game-table #table-center .auction-indicator-number{font-size:30px}.playing-table #game-table #table-center .auction-indicator-player{font-size:10px}}
.playing-table #game-table[data-phase=auction] #table-center{top:15px;left:12px;transform:none}
@media(min-width:1000px) and (max-height:800px){.playing-table #game-table[data-phase=auction] #table-center{top:8px;left:-150px;width:130px;padding:10px 8px;border:1px solid #d8c8a7;border-radius:8px;background:#fffaf0;box-sizing:border-box}.playing-table #game-table[data-phase=auction] #table-center .auction-indicator-title,.playing-table #game-table[data-phase=auction] #table-center .auction-indicator-player{color:#234b79}.playing-table #game-table[data-phase=auction] #table-center .auction-indicator-number{color:#b4821b}}
@media(min-width:1000px) and (max-height:800px){.playing-table #game-table[data-phase=auction] #table-center{left:calc((var(--felt-size,220px) - var(--game-stage-width,600px))/2 + 8px);z-index:6}}

/* Pair names stay readable without increasing the height of the seats. */
.game-score>div{min-width:0}.game-score .eyebrow{overflow-wrap:anywhere;text-transform:none}
.table-seat .seat-info{display:block!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.table-seat .bot-rating{flex-wrap:nowrap}.table-seat .bot-stars>span{display:inline!important}
#table-center .contract-pair{overflow-wrap:anywhere;line-height:1.25}
#room-pairs,.seat>.eyebrow{overflow-wrap:anywhere}
@media(min-width:1000px){.playing-table .game-score .eyebrow{font-size:10px;letter-spacing:.2px;line-height:1.3;max-width:155px}.playing-table .table-seat{box-sizing:border-box;width:122px;max-width:122px}.playing-table .table-seat.position-0{width:145px;max-width:145px}}
@media(min-width:1000px) and (max-height:800px){.playing-table #game-table[data-phase] .table-seat{padding:4px;min-width:100px;width:100px;max-width:100px}.playing-table #game-table[data-phase] .table-seat.position-0{width:145px;max-width:145px}.playing-table #game-table[data-phase] .table-seat .seat-info{font-size:8px}.playing-table #game-table[data-phase] .table-seat .bot-stars{font-size:10px}.playing-table #game-table[data-phase] .table-seat .bot-rating{gap:2px}.playing-table #game-table:has(.contract-pair) #table-center{left:calc((var(--felt-size,220px) - var(--game-stage-width,600px))/2 + 8px);width:130px;padding:8px;background:#214630;border:1px solid #b79a63;border-radius:8px}}
.table-seat .seat-info{white-space:normal}.table-seat .seat-pair{display:block!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0;max-width:100%}.table-seat .seat-count{display:block!important;margin-top:1px}.playing-table #game-table[data-phase] .table-seat .bot-rating{display:flex!important;flex-wrap:nowrap}.playing-table #game-table[data-phase] .table-seat .bot-stars{display:inline-flex!important;width:auto;flex:none}.playing-table #game-table[data-phase] .table-seat .bot-stars>span{display:inline!important}
.cut-caption{position:absolute;left:0;right:0;z-index:9;text-align:center;font:600 11px/1.3 system-ui,sans-serif;color:#fff1c6;text-shadow:0 1px 3px #102c24;pointer-events:none}.draw-packet{box-shadow:2px 2px 0 #fff9e9,3px 3px 0 #b79a63,5px 5px 0 #fff9e9,6px 6px 0 #b79a63,0 4px 12px #102c2466}
.draw-layer .cut-caption{z-index:14}.cut-caption{width:max-content;max-width:100%;left:50%;right:auto;transform:translateX(-50%);padding:3px 7px;border-radius:5px;background:#163c2de0}
/* Live hand totals and captured tricks, anchored to the first winner of each pair. */
.game-score>div{display:flex;flex-wrap:wrap;column-gap:9px;row-gap:3px}.game-score .eyebrow{flex:1 0 100%;max-width:none!important}.game-score .hand-live-points{font:700 16px/1.3 system-ui,sans-serif;color:#234b79}.game-score .note{width:100%;margin:0;font-size:10px}.playing-table .game-score>div{padding:5px 9px}.playing-table .game-score .eyebrow{font-size:10px}.surrender-panel{flex:1 0 100%;display:flex;align-items:center;flex-wrap:wrap;gap:8px;border-top:1px solid #d8c8a7;padding-top:6px}.surrender-panel p{flex:1 0 100%;margin:0;font-size:12px}.surrender-panel button{margin:0}.hand-completion{flex:1 0 100%;font-weight:600;color:#28543b}
.capture-pile{position:absolute;z-index:4;width:72px;height:calc(65px + var(--pile-cantes,0)*10px);text-align:center;pointer-events:auto}.capture-stack{position:absolute;inset:0}.capture-back{position:absolute;width:32px;height:46px;left:calc(var(--pile-index)*.35px);top:calc(var(--pile-index)*.55px);border:1px solid #cfbf98;box-shadow:1px 1px 1px #102c2440}.capture-count{position:absolute;left:0;bottom:0;min-width:44px;padding:2px 4px;margin:0!important;border-radius:4px;background:#173e2e;font:600 9px/1.3 system-ui,sans-serif!important;color:#fff5d9!important;white-space:nowrap}.capture-cante{position:absolute;left:calc(18px + var(--cante-index)*4px);top:calc(9px + var(--cante-index)*18px);width:48px;height:34px;z-index:3;cursor:help}.capture-cante .playing-card{box-sizing:border-box;position:absolute;width:34px;height:48px;left:7px;top:-7px;padding:3px;border-radius:3px;transform:rotate(90deg);font-size:7px}.capture-cante .playing-card .card-rank{display:block;font:600 7px/1 Georgia;margin:0}.capture-cante .playing-card .card-rank-bottom{transform:rotate(180deg)}.capture-cante .playing-card .card-art{width:100%;height:auto}.capture-cante .playing-card .ace-ribbon{font-size:4px}.capture-cante .playing-card .figure-suit-icon{width:7px;height:7px}.capture-cante .capture-cante-points{position:absolute;right:-3px;top:-4px;background:#e9c463;color:#183b2e;border:1px solid #ae8936;border-radius:6px;padding:1px 3px;font:700 8px/1 system-ui,sans-serif;margin:0}.capture-cante:focus-visible{outline:2px solid #f1c458;border-radius:3px}.table-seat.position-0 .capture-pile{left:calc(100% + 10px);bottom:0}.table-seat.position-2 .capture-pile{left:calc(100% + 10px);top:0}.table-seat.position-1 .capture-pile{right:0;top:calc(100% + 9px)}.table-seat.position-3 .capture-pile{left:0;top:calc(100% + 9px)}.piles-outside .table-seat.position-1 .capture-pile{left:calc(100% + 85px);right:auto;top:0}.piles-outside .table-seat.position-3 .capture-pile{right:calc(100% + 85px);left:auto;top:0}
@media(max-width:600px){.game-score .hand-live-points{font-size:14px}.capture-pile{width:54px}.capture-back{width:28px;height:41px}.table-seat.position-0 .capture-pile,.table-seat.position-2 .capture-pile{left:calc(100% + 4px)}}
.posthand-reply-form{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}.posthand-reply-form label{display:block;flex:1 0 100%;font-size:12px}.posthand-reply-form textarea{display:block;box-sizing:border-box;width:100%;margin-top:5px;padding:8px;min-height:88px;resize:vertical;border:1px solid #cdbb96;border-radius:6px;background:#fffdf7;color:#234b79;font:13px/1.45 system-ui,sans-serif}.posthand-reply-form button,.posthand-comment>button{font-size:11px;padding:6px 9px;margin:0}.reply-context{margin:8px 0;padding:6px 9px;border-left:3px solid #b79a63;color:#53695e;font-size:11px;white-space:pre-wrap}.speech-bubble.posthand-bubble>button{pointer-events:auto;font-size:11px;margin:8px 0 0;padding:6px 9px}
/* Match standings stay in the header; each hand total belongs to its captured pile. */
.game-score .match-totals{display:flex;flex-wrap:wrap;gap:8px 20px;width:100%;align-items:center}.match-totals>span{display:flex;align-items:baseline;gap:6px;min-width:0}.game-score .match-totals strong{font:700 22px/1.2 system-ui,sans-serif;color:#234b79}.match-totals>span>span{font:500 11px/1.3 system-ui,sans-serif;color:#53695e}.capture-hand-score{position:absolute;left:calc(100% + 6px);top:2px;box-sizing:border-box;width:78px;padding:5px 4px;border:1px solid #c5ad74;border-radius:6px;background:#fff8e8;box-shadow:0 2px 4px #102c2433;text-align:center}.table-seat .capture-hand-score strong{display:block!important;font:700 19px/1.15 system-ui,sans-serif!important;color:#234b79;white-space:normal;overflow:visible}.table-seat .capture-hand-score>span{display:block!important;font:500 9px/1.25 system-ui,sans-serif!important;margin-top:3px;color:#53695e;white-space:normal}.table-seat.position-3 .capture-hand-score{left:auto;right:calc(100% + 6px)}.empty-capture-pile{height:45px}.empty-capture-pile .capture-count{display:none!important}.empty-capture-pile .capture-hand-score{left:0;right:auto}
@media(max-width:999px){.table-seat.position-1 .capture-hand-score{left:auto;right:calc(100% + 6px)}.table-seat.position-3 .capture-hand-score{left:calc(100% + 6px);right:auto}.table-seat.position-0 .capture-hand-score,.table-seat.position-2 .capture-hand-score{left:-9px;right:auto;top:calc(100% + 4px);width:78px}.empty-capture-pile .capture-hand-score{top:0}.game-score .match-totals{gap:5px 12px}.game-score .match-totals strong{font-size:19px}}
/* All player backs and captured piles stay on the felt, behind or beside each name. */
.playing-table #game-table[data-phase] .table-seat{box-sizing:border-box;width:var(--table-seat-width,100px);max-width:var(--table-seat-width,100px);min-width:0;padding:5px 6px;background:#143c2de8}.playing-table #game-table[data-phase] .table-seat.position-0{left:50%;bottom:24px;top:auto;transform:translateX(-50%)}.playing-table #game-table[data-phase] .table-seat.position-2{left:50%;top:24px;bottom:auto;transform:translateX(-50%)}.playing-table #game-table[data-phase] .table-seat.position-1{right:24px;left:auto;top:50%;bottom:auto;transform:translateY(-50%)}.playing-table #game-table[data-phase] .table-seat.position-3{left:24px;right:auto;top:50%;bottom:auto;transform:translateY(-50%)}
.capture-pile .capture-back{width:26px;height:39px;left:calc(var(--pile-index)*.2px);top:calc(var(--pile-index)*.22px)}.capture-pile .capture-cante{left:calc(3px + var(--cante-index)*4px);top:calc(4px + var(--cante-index)*7px)}.capture-pile .capture-count{top:59px;bottom:auto;left:0;min-width:0;margin:0;padding:1px 3px;font-size:8px!important;line-height:10px!important}.table-seat .capture-pile .capture-hand-score{left:0!important;right:auto!important;top:auto!important;bottom:0;width:64px;height:34px;padding:1px 2px}.table-seat .capture-pile .capture-hand-score strong{font-size:14px!important;line-height:15px!important;margin:0}.table-seat .capture-pile .capture-hand-score>span{font-size:7.5px!important;line-height:8px!important;margin-top:1px}.table-seat .capture-pile.empty-capture-pile .capture-hand-score{top:0!important;bottom:auto}.capture-pile .capture-cante .capture-cante-points{font-size:7px;padding:1px 2px}
.capture-pile .capture-count{top:var(--pile-count-top,46px)}

/* Neutral table and round boxes share the compact match header. */
.playing-table .room-heading,.playing-table #room-code-line{display:none}
.playing-table .game-heading{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:stretch;gap:8px;margin:5px 0 0}
.game-meta-box{box-sizing:border-box;min-width:0;display:flex;flex-direction:column;justify-content:center;padding:8px 10px;border:1px solid #d8c8a7;border-top:3px solid #bdb5a5;border-radius:8px;background:#f3f1eb;color:#53615b}
.playing-table .game-heading .game-meta-box h3{margin:0;font:600 16px/1.35 Georgia,serif;color:#53615b;overflow-wrap:anywhere}
.playing-table .game-heading .eyebrow{display:none}
.game-room-code{margin:4px 0 0;font:11px/1.3 system-ui,sans-serif;overflow-wrap:anywhere;color:#657168}
.game-round-box{white-space:nowrap}
.game-heading-actions{display:flex;flex-direction:column;justify-content:center;gap:5px}
.playing-table .game-heading-actions .compact{margin:0;padding:6px 8px;font-size:10px}
.playing-table #game-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(min-width:1000px){.playing-table #game-table{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.playing-table .game-heading{align-self:stretch}.playing-table .game-score{align-self:stretch}.playing-table .game-heading .game-meta-box h3{font-size:15px}.playing-table .game-score>div{align-content:center}}
@media(max-width:600px){.playing-table .game-heading{grid-template-columns:minmax(0,1fr) auto}.game-room-box{grid-column:1}.game-round-box{grid-column:1;grid-row:2}.game-heading-actions{grid-column:2;grid-row:1/3}.playing-table .game-heading .game-meta-box h3{font-size:15px}}

/* The host places humans without changing admission or a game already in progress. */
.seat .human-seat-form{display:grid;gap:8px;margin-top:16px;min-width:0}
.seat .human-seat-form label{margin:0;font-size:12px;font-weight:500;min-width:0}
.seat .human-seat-form select{display:block;width:100%;max-width:100%;min-width:0;margin-top:6px;padding:10px 8px;border:1px solid #cdbb96;border-radius:6px;background:#fffdf7;color:#234b79;font:12px system-ui,sans-serif}
.seat .human-seat-form button{justify-self:start;width:auto;margin:0}
/* Shared tables, admission and the spectator gallery retain the Spanish-card palette. */
.table-toolbar{display:flex;justify-content:flex-end;margin:0 0 6px}.table-toolbar button{margin:0;font-size:10px;padding:4px 8px}.table-directory{margin:14px 0}.room-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0;border-bottom:1px solid #d8c8a7}.room-row .note{margin:5px 0}.room-row-actions{display:flex;flex-wrap:wrap;gap:7px;flex:none}.room-row-actions button{margin:0}.room-watchers{font-size:12px;color:#667269}.table-entry-dialog{box-sizing:border-box;max-width:calc(100vw - 30px);width:420px;border:1px solid #c5ad74;border-radius:12px;background:#fffdf5;padding:24px;color:#234b79}.table-entry-dialog::backdrop{background:#143c2d66}.table-entry-dialog button{margin-right:8px}.table-session-panel:not(.has-notice){display:none}.table-session-panel{margin:6px 0}.admission-row,.countdown-notice{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:10px 14px;border:1px solid #c5ad74;border-radius:8px;background:#f8f0dd}.admission-row button,.countdown-notice button{margin:0}.countdown-notice strong{font:700 30px/1 system-ui,sans-serif}.departure-notice{padding:16px;border:2px solid #b18430;border-radius:10px;background:#fff5d9;color:#51472e}.departure-notice>strong{font-size:20px}.departure-notice p{margin:6px 0}.departure-notice button{margin:8px 8px 0 0}.table-session-panel .admission-notice{padding:10px;background:#f8f0dd;border-radius:8px}.room-password-form{padding:12px;border:1px solid #d8c8a7;border-radius:8px}
.felt-row{display:grid;grid-template-columns:minmax(170px,1fr) minmax(0,1.65fr);gap:14px;align-items:stretch;margin-bottom:8px;min-width:0}.table-side{display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0}.playing-table #game-table[data-phase] .felt-row .game-board{margin:0;width:100%;align-self:start}.playing-table #game-table[data-phase] #table-center{position:static!important;box-sizing:border-box;width:100%!important;max-width:none;left:auto!important;top:auto!important;transform:none;text-align:center;padding:8px!important;border:1px solid #d8c8a7;border-radius:8px;background:#f7f2e7!important}.playing-table #game-table[data-phase] #table-center .table-contract{justify-content:center}.playing-table #game-table[data-phase] #table-center strong,.playing-table #game-table[data-phase] #table-center .contract-number{color:#9a701a}.playing-table #game-table[data-phase] #table-center span{color:#234b79}.playing-table #game-table[data-phase] #table-center .auction-indicator-number{font-size:30px}.playing-table #game-table[data-phase] #table-center .auction-indicator-title{font-size:11px}.playing-table #game-table[data-phase] #table-center .contract-pair{font-size:11px}.playing-table #game-table[data-phase] #table-center .trump-symbol svg{width:25px;height:25px}
.spectator-chat{flex:1;min-height:0;display:flex;flex-direction:column;border:1px solid #d8c8a7;border-radius:8px;padding:9px;background:#faf7ef}.spectator-counter{display:flex;align-items:center;justify-content:center;gap:7px;color:#53695e;font:600 16px/1.2 system-ui,sans-serif}.spectator-counter svg{width:24px;height:24px;display:block}.spectator-messages{list-style:none;flex:1;overflow:auto;min-height:28px;margin:8px 0;padding:0;font:11px/1.45 system-ui,sans-serif;overflow-wrap:anywhere;scrollbar-width:thin}.spectator-messages li{margin:0 0 8px}.spectator-chat form{display:flex;flex-wrap:wrap;gap:6px}.spectator-chat label{margin:0;width:100%;font-size:10px}.spectator-chat textarea{box-sizing:border-box;width:100%;resize:none;min-height:44px;max-height:60px;margin-top:4px;padding:5px;font:11px/1.3 system-ui,sans-serif;background:#fffdf7;border:1px solid #cdbb96;border-radius:5px}.spectator-chat textarea:disabled{opacity:.6}.spectator-chat button{font-size:10px;padding:4px 8px;margin:0}.spectator-chat .note{font-size:9px!important;line-height:1.3;margin:5px 0 0}
.waiting-gallery{max-width:420px;margin-top:16px}.waiting-gallery .spectator-chat{height:260px;box-sizing:border-box}
@media(min-width:1000px){.playing-table .game-layout{grid-template-columns:minmax(0,1fr) 340px}.playing-table .felt-row{grid-template-columns:minmax(180px,1fr) var(--felt-size,300px);height:var(--felt-size,300px)}.playing-table #game-table[data-phase] .felt-row .game-board{width:var(--felt-size,300px)}.playing-table .table-toolbar{position:absolute;right:35px;top:58px}.playing-table .member-nav{padding-right:90px}}
@media(max-width:999px){.table-side{max-height:500px}.spectator-messages{max-height:240px}.room-row{align-items:flex-start}.room-row-actions{flex-direction:column}.table-toolbar{margin-top:8px}}
@media(max-width:600px){.felt-row{grid-template-columns:minmax(0,1fr)}.table-side{order:2;max-height:300px}.playing-table #game-table[data-phase] .felt-row .game-board{order:1}.room-row{flex-direction:column;gap:8px}.room-row-actions{flex-direction:row}.playing-table .game-sidebar{margin-top:10px}}
.spectator-chat.readonly-chat form{display:none}
.table-session-panel{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}.table-session-panel>p.note{margin:3px 0;font-size:11px!important}
@media(min-width:601px){.playing-table #game-table[data-phase] .felt-row .game-board{grid-column:2;grid-row:1}.felt-row .table-side{grid-column:1;grid-row:1;height:100%;box-sizing:border-box}}
@media(min-width:1000px){.playing-table .table-toolbar{top:9px}.playing-table #game-table[data-phase] #table-center{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 10px;flex:none;min-height:48px}.playing-table #game-table[data-phase] #table-center .auction-indicator-title,.playing-table #game-table[data-phase] #table-center .auction-indicator-number,.playing-table #game-table[data-phase] #table-center .auction-indicator-player{margin:0}.playing-table #game-table[data-phase] #table-center .auction-indicator-number{font-size:28px}}
/* The entire auction announcement uses the number's typography and gold. */
.playing-table #game-table[data-phase=auction] #table-center :is(.auction-indicator-title,.auction-indicator-number,.auction-indicator-player){font:700 28px/1.1 system-ui,sans-serif;color:#9a701a;margin:0}
/* Trump reuses the ace illustration and ribbon without a card or rank indexes. */
.playing-table #game-table[data-phase] #table-center :is(.contract-number,.contract-pair){font:700 clamp(24px,3vw,36px)/1 system-ui,sans-serif;color:#9a701a;margin:0}
.playing-table #game-table[data-phase] #table-center .trump-ace{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none;width:64px;height:84px;background:none;border:0;border-radius:0;box-shadow:none}
.playing-table #game-table[data-phase] #table-center .trump-ace svg.card-art{display:block;flex:none;width:56px;height:70px}
.playing-table #game-table[data-phase] #table-center .trump-ace .ace-ribbon{position:relative;isolation:isolate;box-sizing:border-box;display:block;flex:none;width:56px;margin:0 4px 2px;padding:2px 0;background:linear-gradient(#f7ebc8,#ead29c);border-top:1px solid #b79a63;border-bottom:1px solid #b79a63;font:700 8px/1 Georgia,serif;letter-spacing:.3px;text-transform:uppercase;white-space:nowrap;color:#234b79}
/* Captured cards match the on-table hand; hand points have a separate, larger badge. */
.playing-table #game-table[data-phase] .capture-pile .capture-back{box-sizing:border-box;width:var(--back-width);height:var(--back-height);left:calc(var(--pile-index)*.22px);top:calc(var(--pile-index)*.22px)}
.playing-table #game-table[data-phase] .capture-pile.side-pile .capture-back{left:calc((var(--back-height) - var(--back-width))/2 + var(--pile-index)*.22px);top:calc((var(--back-width) - var(--back-height))/2 + var(--pile-index)*.22px);transform:rotate(90deg)}
.playing-table #game-table[data-phase] .capture-pile .capture-count{left:50%;right:auto;top:-16px;bottom:auto;transform:translateX(-50%);padding:2px 4px;font:600 10px/1 system-ui,sans-serif!important;white-space:nowrap}
.playing-table #game-table[data-phase] .capture-pile .capture-cante{width:var(--back-height);height:var(--back-width);left:calc(var(--cante-index)*var(--capture-spread));top:calc(var(--back-width)*.2 + var(--cante-index)*var(--back-width)*.2)}
.playing-table #game-table[data-phase] .capture-pile .capture-cante .playing-card{box-sizing:border-box;width:var(--back-width);height:var(--back-height);left:calc((var(--back-height) - var(--back-width))/2);top:calc((var(--back-width) - var(--back-height))/2);padding:2px;transform:rotate(90deg)}
.playing-table #game-table[data-phase] .capture-pile.side-pile .capture-cante{width:var(--back-width);height:var(--back-height);left:calc(var(--back-width)*.2 + var(--cante-index)*var(--back-width)*.2);top:calc(var(--cante-index)*var(--capture-spread))}
.playing-table #game-table[data-phase] .capture-pile.side-pile .capture-cante .playing-card{left:0;top:0;transform:none}
.playing-table #game-table[data-phase] .table-seat>.capture-hand-score{position:absolute;z-index:5;box-sizing:border-box;width:84px;height:56px;padding:4px 6px;border:1px solid #c5ad74;border-radius:8px;background:#fff8e8;box-shadow:0 2px 5px #102c2440;text-align:center}
.playing-table #game-table[data-phase] .table-seat>.capture-hand-score strong{display:block!important;margin:0!important;font:700 26px/28px system-ui,sans-serif!important;color:#234b79;white-space:nowrap}
.playing-table #game-table[data-phase] .table-seat>.capture-hand-score>span{display:block!important;font:500 9px/10px system-ui,sans-serif!important;margin:2px 0 0!important;color:#53695e;white-space:normal}
/* Scale miniature face indexes and ace ribbons with the captured card. */
.playing-table #game-table[data-phase] .capture-cante .playing-card{gap:0;font-size:calc(var(--back-width)*.19);overflow:hidden}
.playing-table #game-table[data-phase] .capture-cante .playing-card .card-rank{font:600 calc(var(--back-width)*.19)/1 Georgia;margin:0;color:inherit}
.playing-table #game-table[data-phase] .capture-cante .playing-card .card-footer{width:100%;min-width:0;gap:0;margin:0}
.playing-table #game-table[data-phase] .capture-cante .playing-card .card-art{flex:1;min-height:0;width:100%;height:100%;margin:0}
.playing-table #game-table[data-phase] .capture-cante .playing-card .ace-ribbon{box-sizing:border-box;flex-basis:calc(100% - 2px);width:calc(100% - 2px);margin:0 1px 1px;padding:1px 0;font:600 calc(var(--back-width)*.12)/1 Georgia;letter-spacing:0;color:inherit}
.playing-table #game-table[data-phase] .capture-cante .ace-ribbon:before,.playing-table #game-table[data-phase] .capture-cante .ace-ribbon:after{width:2px;top:1px;bottom:-1px}
.playing-table #game-table[data-phase] .capture-cante .ace-ribbon:before{left:-1px}.playing-table #game-table[data-phase] .capture-cante .ace-ribbon:after{right:-1px}
/* Player video stays above the shared written chat, and opens only between hands. */
.room-social-panel{display:flex;flex:1;flex-direction:column;gap:8px;min-height:0;min-width:0}.room-social-panel>.spectator-chat{min-height:85px}.table-video{flex:none;padding:8px;border:1px solid #c5ad74;border-radius:8px;background:#f8f2e4}.table-video[hidden]{display:none}.table-video h4{margin:0 0 6px;font:600 12px/1.2 system-ui,sans-serif;color:#264c3e}.video-mosaic{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,auto);gap:5px;height:auto}.video-tile{position:relative;aspect-ratio:1/1;box-sizing:border-box;min-width:0;min-height:0;overflow:hidden;border:1px solid #d5c5a4;border-radius:6px;background:#183d2f;color:#fff8e7}.video-tile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.video-tile video[hidden],.video-avatar[hidden]{display:none}.video-avatar{position:absolute;inset:0;display:grid;place-items:center;height:100%;font:28px Georgia,serif;color:#ebd398;background:radial-gradient(ellipse,#356646,#183d2f)}.video-caption{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:1px 5px;padding:3px 5px;background:#102e24bb;font:10px/1.2 system-ui,sans-serif}.video-caption span{font-size:8px;color:#e9ddc5}.video-controls{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.video-controls button{margin:0;padding:4px 6px;font-size:10px}.video-controls button[aria-pressed=true]{background:#315c45;color:#fff7df}.video-help{margin:5px 0 0;font:10px/1.25 system-ui,sans-serif;color:#53695e}.table-side:has(.table-video:not([hidden])){overflow:auto;scrollbar-width:thin}.table-side:has(.table-video:not([hidden]))>.room-social-panel{flex:1;min-height:330px}.table-side:has(.table-video:not([hidden])) .spectator-chat{flex:1}.waiting-gallery .room-social-panel>.spectator-chat{min-height:180px}.table-side:has(.table-video:not([hidden])) #table-center{min-height:48px!important;padding:4px!important}.table-side:has(.table-video:not([hidden])) #table-center .trump-ace{height:42px!important;width:40px!important}.table-side:has(.table-video:not([hidden])) #table-center .trump-ace svg.card-art{width:30px!important;height:31px!important}.table-side:has(.table-video:not([hidden])) #table-center .trump-ace .ace-ribbon{width:30px!important;font-size:5px!important}.table-side:has(.table-video:not([hidden])) #table-center :is(.contract-number,.contract-pair){font-size:22px!important}
@media(max-width:600px){.table-side:has(.table-video:not([hidden])){max-height:none}.table-side:has(.table-video:not([hidden]))>.room-social-panel{min-height:420px}}
@media(min-width:1000px){.table-side:has(.table-video:not([hidden])){overflow:visible}.table-side:has(.table-video:not([hidden]))>.room-social-panel{min-height:0}.table-side:has(.table-video:not([hidden])) .spectator-chat{min-height:150px}.table-side .spectator-chat form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end}.table-side .spectator-chat form label{min-width:0}.table-side .spectator-chat textarea{min-height:34px;height:34px}.playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) #game-controls{padding:8px 10px;margin-bottom:8px}.playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) #game-controls h3{font-size:18px;margin:3px 0}.playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) #game-controls p{font-size:11px;line-height:1.3;margin:4px 0}.playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) #game-controls>button{margin:4px 0 0}}
@media(min-width:1000px){.playing-table #game-table[data-phase] .table-side:has(.table-video:not([hidden])) #table-center{padding:4px!important}.playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) #game-controls{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:2px 10px}.playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) #game-controls>:is(p,h3,strong){grid-column:1/-1}.playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) #game-controls>p:last-child{grid-column:2;grid-row:auto}.playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) #game-controls>button{grid-column:1;grid-row:auto}}
@media(min-width:1000px){.game-sidebar:has(>#game-controls){display:grid;grid-template-rows:auto minmax(80px,1fr) minmax(100px,1fr);gap:10px;min-height:0}.game-sidebar>#game-controls{box-sizing:border-box;width:100%;align-self:start}.game-sidebar>#game-controls>p:last-child{grid-column:1/-1!important}.game-sidebar>#game-controls>button{justify-self:start}}

/* Between hands the written conversation reaches the bottom of the main panel. */
@media(min-width:1000px){
 .playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) .felt-row{height:auto;min-height:var(--game-space,calc(100dvh - 220px));align-items:stretch;margin-bottom:0}
 .playing-table #game-table:is([data-phase=handEnd],[data-phase=matchEnd]):has(.table-video:not([hidden])) .table-side{height:auto;max-height:none;align-self:stretch}
}
/* Laptop layout: preserve readable controls and a useful playing square. */
@media (min-width:1000px) and (max-width:1599px){
 body.playing-table{margin:0}
 .playing-table main{position:relative;max-width:none;padding:4px 10px}
 .playing-table #account{padding:10px 12px}
 .playing-table header{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:2;height:28px;margin:0}
 .playing-table header h1{font-size:27px}
 .playing-table header .brand{height:29px;width:22px}
 .playing-table .member-nav button{font-size:13px;padding:5px 10px}
 .playing-table .game-layout{grid-template-columns:minmax(0,1fr) 292px;gap:12px}
 .playing-table .felt-row{grid-template-columns:minmax(250px,1fr) var(--felt-size,400px);gap:12px;height:var(--felt-size,360px);margin-bottom:0}
 .playing-table #game-table[data-phase] .game-stage{min-height:0}
 .playing-table #game-table[data-phase] .table-side{height:100%;max-height:none;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain}
 .playing-table .table-side>#game-controls{flex:none;margin:0!important;box-sizing:border-box;width:100%;padding:10px!important;gap:8px}
 .playing-table #game-table[data-phase] .game-controls p,.playing-table #game-table[data-phase] .game-controls label,.playing-table #game-table[data-phase] .game-controls .note{font-size:13px!important;line-height:1.4}
 .playing-table #game-table[data-phase] .game-controls :is(button,input,select){font-size:14px;padding:7px 9px}
 .playing-table #game-table[data-phase] .bid-form{gap:7px 10px}
 .playing-table #game-table[data-phase] .bid-form>label{flex-basis:160px}
 .playing-table #game-table[data-phase] .game-heading{grid-template-columns:minmax(180px,1fr) minmax(145px,auto) auto}
 .playing-table #game-table[data-phase] .game-meta-box h3{font-size:16px}
 .playing-table #game-table[data-phase] .game-meta-box{padding:6px 8px}
 .playing-table .game-heading-actions{flex-direction:row;gap:5px}
 .playing-table .game-heading-actions .compact{font-size:12px;padding:6px 8px}
 .playing-table .game-room-code,.playing-table .game-score .eyebrow{font-size:12px!important;letter-spacing:0}
 .playing-table .match-totals span,.playing-table .game-score .match-totals{font-size:12px}
 .playing-table .game-score .match-totals strong{font-size:23px}
 .playing-table .game-score>div{display:grid;grid-template-columns:minmax(0,1fr);gap:0;padding:3px 6px}
 .playing-table .game-score .match-totals{gap:10px}
 .playing-table .game-score .match-totals>span{display:flex;align-items:center;gap:4px}
 .playing-table #game-table[data-phase] .table-seat{padding:4px 6px;min-width:100px;width:auto;max-width:145px}
 .playing-table #game-table[data-phase] .table-seat strong{font-size:14px}
 .playing-table #game-table[data-phase] .table-seat :is(span,small){margin-top:1px}
 .playing-table #game-table[data-phase] .table-seat :is(span,small),.playing-table #game-table[data-phase] .table-seat .seat-info{font-size:12px;line-height:1.25}
 .playing-table #game-table[data-phase] .table-seat .bot-stars{font-size:13px}
 .playing-table #game-table[data-phase] .table-seat .bot-rating{font-size:12px}
 .playing-table #game-table[data-phase] #table-center{min-height:55px;padding:8px!important}
 .playing-table #game-table[data-phase] #table-center :is(.auction-indicator-title,.auction-indicator-number,.auction-indicator-player,.contract-number,.contract-pair){font-size:21px!important}
 .playing-table .game-sidebar{position:static;min-height:400px}
 .playing-table .game-sidebar details{padding:10px}
 .playing-table .game-sidebar summary{font-size:14px;font-weight:600}
 .playing-table .game-sidebar :is(#auction-log,#game-log){font-size:13px;line-height:1.55}
 .playing-table #game-log .history-caption{flex:1 0 100%;font-size:13px;white-space:normal;overflow:visible;text-overflow:clip}
 .playing-table #game-log>li{flex-wrap:wrap;gap:5px;align-items:center}
 .playing-table #game-log .history-cards .playing-card{width:43px;height:62px}
 .playing-table .spectator-messages{font-size:13px}
 .playing-table .spectator-chat :is(label,button,textarea){font-size:13px}
 .playing-table .spectator-chat .note{font-size:11px!important}
 .playing-table .table-side:not(:has(.table-video:not([hidden]))) .room-social-panel{flex:1;min-height:80px}
 .playing-table .table-side:not(:has(.table-video:not([hidden]))) .spectator-chat{min-height:80px;box-sizing:border-box;padding:8px}
 .playing-table .table-side .spectator-chat:has(textarea:disabled) form{display:none}
 .playing-table .table-side .spectator-chat:has(textarea:disabled) .spectator-messages{min-height:20px}
 .playing-table #game-table[data-phase] .game-hand .playing-card{font-size:15px;padding:6px}
 .playing-table #hand-area>.note{display:none}
 .playing-table #game-table[data-phase] .game-hand{margin-top:2px}
 .playing-table .hand-heading h3{font-size:19px}
 .playing-table #pete{font-size:13px;padding:5px 8px}
 .playing-table .hand-heading{min-height:27px}
 .playing-table .speech-bubble .speech-text{font-size:15px}
 .playing-table .table-video h4{font-size:14px}
 .playing-table .video-caption{font-size:13px}
 .playing-table .video-caption span{font-size:11px}
 .playing-table .video-controls button{font-size:13px;padding:7px}
 .playing-table .video-help{font-size:12px}
}
@media(min-width:1000px) and (max-width:1199px){.playing-table #game-table{grid-template-columns:minmax(0,1fr)}.playing-table .game-score{grid-column:1;grid-row:auto}}
/* On short laptop tables, keep nameplates outside the central trick. */
@media(min-width:1000px) and (max-width:1599px) and (max-height:800px){
 .playing-table #game-table:is([data-phase=play],[data-phase=sing],[data-phase=trickEnd]) .table-seat{box-sizing:border-box;min-width:0;width:auto;max-width:140px;padding:4px 6px}
 .playing-table #game-table:is([data-phase=play],[data-phase=sing],[data-phase=trickEnd]) .table-seat>:is(.seat-info,small,.bot-rating){display:none!important}
 .playing-table #game-table:is([data-phase=play],[data-phase=sing],[data-phase=trickEnd]) .table-seat strong{font-size:14px;line-height:1.2}
 .playing-table #game-table:is([data-phase=play],[data-phase=sing],[data-phase=trickEnd]) .table-seat:is(.position-1,.position-3){width:58px;max-width:58px}
 .playing-table #game-table:is([data-phase=play],[data-phase=sing],[data-phase=trickEnd]) .table-seat.position-1{right:4px}
 .playing-table #game-table:is([data-phase=play],[data-phase=sing],[data-phase=trickEnd]) .table-seat.position-3{left:4px}
 .playing-table #game-table:is([data-phase=play],[data-phase=sing],[data-phase=trickEnd]) .table-seat>strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
}

/* Hand result follows the contract scale, including video and laptop layouts. */
#game-table{--hand-result-size:clamp(24px,3vw,36px)}
#game-table:has(.table-video:not([hidden])){--hand-result-size:22px}
.playing-table #game-table[data-phase] #game-controls h3.hand-result-title{font:700 var(--hand-result-size)/1.2 system-ui,sans-serif!important;color:#9a701a;margin:8px 0;overflow-wrap:anywhere}
@media(min-width:1000px) and (max-width:1599px){#game-table,#game-table:has(.table-video:not([hidden])){--hand-result-size:21px}}

/* Contract outcome remains beside the awarded points at the same scale. */
.hand-result-title{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25em .55em}
.hand-result-title>span{font:inherit!important}
.hand-result-title .hand-result-status.is-fulfilled{color:#1ed760}
.hand-result-title .hand-result-status.is-unfulfilled{color:#b12f2f}

/* Initial draw: expose the underside of the lifted upper packet, then restore it. */
.draw-held-packet{z-index:12;transform-style:preserve-3d;background:transparent}
.draw-held-packet>.draw-held-back,.draw-held-packet>.playing-card.draw-bottom-face{position:absolute;inset:0;box-sizing:border-box;width:100%;height:100%;margin:0;backface-visibility:hidden;transform-origin:center}
.draw-held-packet>.draw-held-back{transform:rotateY(0deg)}
.draw-held-packet>.playing-card.draw-bottom-face{transform:rotateY(180deg);padding:5px;font-size:11px}
.draw-table-packet{z-index:5}

/* Give each flight a crisp outline and let the deck belong to its dealer. */
.deal-deck{left:0;top:0;will-change:transform}
.flying-card,.played-flight{box-shadow:0 5px 10px #061e2673,0 1px 2px #fff6d966;backface-visibility:hidden}
.played-flight{position:absolute;left:0;top:0;margin:0;box-sizing:border-box;will-change:transform;pointer-events:none}
.is-drawing .table-seat :is(.seat-info,small,.bot-rating){display:none!important}
@media(prefers-reduced-motion:reduce){.flying-card,.played-flight,.deal-deck{will-change:auto}}

/* The transparent anchor keeps piles in place; only the round identity is painted. */
.playing-table #game-table[data-phase] .table-seat:has(>.seat-disc)>.seat-info[hidden]{display:none!important}
.playing-table #game-table[data-phase] .table-seat:has(>.seat-disc){box-sizing:border-box;width:var(--table-seat-width,122px)!important;height:72px!important;min-width:0!important;max-width:none!important;padding:0!important;border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important;pointer-events:none}
.seat-disc{position:absolute;left:0;top:0;box-sizing:border-box;width:var(--seat-disc-size,58px);height:var(--seat-disc-size,58px);border:2px solid #d6bf82;border-radius:50%;background:#244f3c;box-shadow:0 2px 7px #071f2a66;isolation:isolate;pointer-events:auto}
.seat-photo{position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;overflow:hidden;background:radial-gradient(ellipse at 45% 30%,#52785c,#183e30);color:#fff6dc;font:700 calc(var(--seat-disc-size,58px)*.35)/1 Georgia,serif}
.seat-photo>img{display:block;width:100%;height:100%;object-fit:cover}
.seat-caption{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:0;border-radius:50%;padding:0 4px 8px;overflow:hidden;background:linear-gradient(transparent 35%,#102b249e 58%,#102b24f2 100%)}
.playing-table #game-table[data-phase] .seat-disc .seat-name{display:block!important;box-sizing:border-box;width:100%;margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:700 clamp(10px,calc(var(--seat-disc-size,58px)*.15),13px)/1.2 system-ui,sans-serif;color:#fffdf2;text-shadow:0 1px 2px #071e19}
.seat-disc.bot-disc .seat-caption{padding-bottom:6px}
.playing-table #game-table[data-phase] .seat-disc .seat-bot-stars{display:block;margin:0;line-height:1;height:calc(var(--seat-disc-size,58px)*.18)}
.playing-table #game-table[data-phase] .seat-disc .bot-stars{display:inline-flex;gap:0;margin:0;font:calc(var(--seat-disc-size,58px)*.18)/1 Arial,sans-serif;letter-spacing:0}
.seat-disc .bot-star-gold{color:#ffd15a!important}.seat-disc .bot-star-empty{color:#f5e9c7!important}
.playing-table #game-table[data-phase] .seat-disc .seat-marker{position:absolute;z-index:2;display:grid!important;place-items:center;box-sizing:border-box;width:19px;height:19px;margin:0;border:1px solid #d8bf81;border-radius:50%;background:#fff6df;color:#234b79;font:12px/1 system-ui,sans-serif;box-shadow:0 1px 3px #09231c66}
.seat-disc .mano-icon{left:-3px;top:-3px}.seat-disc .seat-dealer{right:-3px;top:-3px}
.table-seat.on-turn>.seat-disc{border-color:#ffdc62;box-shadow:0 0 0 2px #e9b92f88,0 2px 8px #071f2a66}
.table-seat:has(>.seat-disc):is(.position-0,.position-2) .speech-bubble::after{left:var(--speech-tail-x,calc(50% - 7px))}
.table-seat:has(>.seat-disc):is(.position-1,.position-3) .speech-bubble::after{top:var(--speech-tail-y,calc(50% - 7px))}