/* Bridge owns its layout; shared card faces and toolbar remain in durak.css. */
.bridge-board { display: grid; grid-template-rows: 40px var(--bridge-north-height,calc(var(--card-height) + 34px)) minmax(78px,1fr) 32px 52px var(--bridge-south-height,calc(var(--card-height) + 28px)); padding: 4px 14px 8px; }
.bridge-info { grid-row: 1; display: flex; flex-wrap: wrap; align-content: center; justify-content: center; gap: 4px 18px; color: #edf5ef; font-size: 12px; text-align: center; }
.bridge-info #bridge-contract { width: auto; order: 1; font-weight: bold; }
.bridge-info #bridge-vulnerability { order: 2; }
.bridge-seat { min-width: 0; position: relative; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.bridge-seat--north { grid-row: 2; width: min(840px,calc(100% - 220px)); justify-self: center; }
.bridge-seat--south { grid-row: 6; width: min(880px,calc(100% - 160px)); justify-self: center; }
.bridge-seat--west,.bridge-seat--east { position: absolute; top: calc(var(--card-height) + 80px); bottom: calc(var(--card-height) + 130px); width: var(--card-width); min-height: var(--card-height); }
.bridge-seat--west { left: 14px; }
.bridge-seat--east { right: 14px; }
.bridge-seat-label { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 8px; color: #eef5ef; font-size: 12px; text-align: center; min-height: 24px; }
.bridge-seat--west .bridge-seat-label,.bridge-seat--east .bridge-seat-label { width: 110px; font-size: 11px; }
.bridge-seat-label span { color: #d4e6d9; }
.bridge-seat.is-active .bridge-seat-label { color: #ffe49a; }
.bridge-hand { width: 100%; min-height: 0; }
.bridge-hand .durak-card { flex-shrink: 0; }
.bridge-hand .durak-card.is-playable { cursor: pointer; }
.bridge-hand .durak-card.is-playable:hover,.bridge-hand .durak-card.is-playable:focus-visible { z-index: 20; translate: 0 -6px; outline: 2px solid #ffdf79; outline-offset: 1px; }
.bridge-hand--vertical { flex-direction: column; height: min(180px,100%); flex: 0 1 180px; }
.bridge-hand--vertical .durak-card { flex: 0 0 var(--card-height); }
.bridge-hand--dummy { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); align-items: start; gap: 2px; width: min(380px,100%); height: var(--bridge-dummy-height,var(--card-height)); overflow: visible; flex-shrink: 0; }
.bridge-hand--dummy-side { width: 156px; height: 100%; max-height: 180px; flex-shrink: 1; }
.bridge-seat:has(.bridge-hand--dummy-side) { width: 156px; }
.bridge-dummy-suit { display: flex; flex-direction: column; align-items: center; gap: 0; color: #fff; font-size: 12px; --card-width: calc(36px * var(--durak-scale)); --card-height: calc(49px * var(--durak-scale)); }

.bridge-dummy-suit .durak-card { flex: 0 0 var(--card-height); margin-left: 0; }
.bridge-hand[hidden],.bridge-info [hidden],.bridge-seat-label [hidden],.bridge-popover[hidden] { display: none; }
.bridge-table { grid-row: 3; position: relative; min-height: 0; width: min(500px,calc(100% - 220px)); justify-self: center; display: flex; align-items: center; justify-content: center; }
.bridge-trick-card { position: absolute; }
.bridge-trick-card--0 { bottom: 0; left: 50%; transform: translateX(-50%); }
.bridge-trick-card--1 { left: 0; top: 50%; transform: translateY(-50%) rotate(-4deg); }
.bridge-trick-card--2 { top: 0; left: 50%; transform: translateX(-50%); }
.bridge-trick-card--3 { right: 0; top: 50%; transform: translateY(-50%) rotate(4deg); }
.bridge-message { grid-row: 4; padding: 0 4px; }
.bridge-actions { grid-row: 5; }
.bridge-bid-form,.bridge-bid-fields,.bridge-bid-calls { display: flex; align-items: center; justify-content: center; gap: 6px; }
.bridge-bid-form label { display: flex; align-items: center; gap: 5px; color: #e5efe7; font-size: 12px; }
.bridge-bid-form select { height: 40px; background: #fff; color: #193522; border: 1px solid #cbddce; border-radius: 3px; padding: 4px; font: 14px Arial; }
.bridge-page .bridge-actions button { min-width: 0; padding: 0 14px; }
.bridge-page .bridge-actions [hidden] { display: none; }
.bridge-actions button:disabled,.bridge-actions select:disabled { opacity: .5; cursor: default; }
.bridge-is-ended.bridge-empty-ended .bridge-seat { visibility: hidden; }
.bridge-result { text-align: center; color: #eff6f1; }
.bridge-result strong { color: #ffe69e; font-size: 20px; }
.bridge-result p { margin: 7px 0 0; font-size: 13px; line-height: 1.3; }
.bridge-auction-preview { width: min(300px,100%); max-height: 100%; overflow: auto; }
.bridge-auction-table { width: 100%; border-collapse: collapse; color: #f2f6f3; font-size: 13px; text-align: center; }
.bridge-auction-table td,.bridge-auction-table th { padding: 5px 8px; border-bottom: 1px solid #ffffff20; }
.bridge-auction-table th { color: #ffe49a; }
.bridge-popover { position: relative; color: #e0eade; font-size: 12px; }
.bridge-popover > summary { padding: 8px 5px; cursor: pointer; white-space: nowrap; }
.bridge-popover > div { position: absolute; z-index: 100; top: 100%; left: 0; width: min(330px,calc(100vw - 26px)); max-height: 320px; overflow: auto; padding: 12px; color: #f2f6f3; background: #13491d; border: 1px solid #507a59; border-radius: 4px; box-shadow: 0 8px 22px #0005; }
.bridge-popover:not([open]) > div { display: none; }
.bridge-popover table { width: 100%; font-size: 12px; border-collapse: collapse; }
.bridge-popover td,.bridge-popover th { padding: 5px; text-align: left; }
.bridge-score-log { border-top: 1px solid #ffffff30; margin-top: 8px; }
.bridge-score-log p { margin: 7px 0; font-size: 11px; }
.bridge-page .durak-toolbar { gap: 8px; }
@media(max-width:900px) {
 .bridge-seat--north,.bridge-seat--south { width: calc(100% - 20px); }
 .bridge-seat--west,.bridge-seat--east { --card-width: calc(38px * var(--durak-scale)); --card-height: calc(51px * var(--durak-scale)); }
 .bridge-table { width: calc(100% - 180px); }
 .bridge-seat--west .bridge-seat-label,.bridge-seat--east .bridge-seat-label { width: 64px; font-size: 10px; }
 .bridge-form-label { display: none; }
 .bridge-hand--dummy-side,.bridge-seat:has(.bridge-hand--dummy-side) { width: 116px; }
 .bridge-dummy-suit { --card-width: calc(26px * var(--durak-scale)); --card-height: calc(36px * var(--durak-scale)); }
}
@media(max-width:680px) {
 .bridge-board { --card-width: calc(52px * var(--durak-scale)); --card-height: calc(70px * var(--durak-scale)); grid-template-rows: 54px var(--bridge-north-height,calc(var(--card-height) + 28px)) minmax(90px,1fr) 36px 41px var(--bridge-south-height,calc(var(--card-height) + 28px)); padding-inline: 5px; }
 .bridge-is-auction .bridge-board { grid-template-rows: 54px var(--bridge-north-height,calc(var(--card-height) + 28px)) minmax(70px,1fr) 36px 82px var(--bridge-south-height,calc(var(--card-height) + 28px)); }
 .bridge-info { gap: 2px 6px; font-size: 11px; }

 .bridge-seat--north { --card-width: calc(40px * var(--durak-scale)); --card-height: calc(54px * var(--durak-scale)); }
 .bridge-seat--west,.bridge-seat--east { --card-width: calc(30px * var(--durak-scale)); --card-height: calc(41px * var(--durak-scale)); top: calc(70px * var(--durak-scale) + 110px); bottom: calc(var(--card-height) + 140px); }
 .bridge-seat--west { left: 5px; }.bridge-seat--east { right: 5px; }
 .bridge-table { width: calc(100% - 110px); }
 .bridge-seat-label { font-size: 11px; gap: 2px 6px; }
 .bridge-bid-form { flex-direction: column; }
 .bridge-bid-form select { height: 35px; font-size: 16px; max-width: 112px; }
 .bridge-page .bridge-actions button { padding-inline: 11px; }
 .bridge-result strong { font-size: 17px; }.bridge-result p { font-size: 11px; margin-top: 4px; }
 .bridge-page .durak-toolbar { gap: 2px; }.bridge-page .durak-tool { margin-right: 3px; }
 .bridge-popover { font-size: 11px; }.bridge-popover > summary { padding: 8px 2px; }
 #bridge-scores > div { left: -70px; }
 .bridge-page #bridge-history > div,.bridge-page #bridge-scores > div { position: fixed; top: 100px; left: 10px; right: 10px; width: calc(100% - 20px); max-height: min(320px,calc(100dvh - 120px)); }
 .bridge-hand--dummy-side,.bridge-seat:has(.bridge-hand--dummy-side) { width: 104px; }
 .bridge-dummy-suit { --card-width: 24px; --card-height: 33px; }
 .bridge-seat:has(.bridge-hand--dummy-side) .bridge-seat-label { width: 100%; }
 .bridge-board:has(.bridge-hand--dummy-side) .bridge-table { width: calc(100% - 230px); min-width: 110px; }
}
@media(max-width:680px) and (max-height:650px) and (min-height:501px) {
 .bridge-board { --card-width: calc(46px * var(--durak-scale)); --card-height: calc(62px * var(--durak-scale)); grid-template-rows: 40px var(--bridge-north-height,calc(46px * var(--durak-scale) + 22px)) minmax(24px,1fr) 24px 41px var(--bridge-south-height,calc(var(--card-height) + 22px)); }
 .bridge-is-auction .bridge-board { grid-template-rows: 40px var(--bridge-north-height,calc(46px * var(--durak-scale) + 22px)) minmax(20px,1fr) 24px 76px var(--bridge-south-height,calc(var(--card-height) + 22px)); }
 .bridge-seat--north { --card-width: calc(34px * var(--durak-scale)); --card-height: calc(46px * var(--durak-scale)); }
 .bridge-seat--west,.bridge-seat--east { top: calc(46px * var(--durak-scale) + 70px); bottom: calc(62px * var(--durak-scale) + 120px); }
 .bridge-seat--west .bridge-seat-label,.bridge-seat--east .bridge-seat-label { width: 50px; }
 .bridge-info { font-size: 10px; }
}
@media(max-height:500px) and (orientation:landscape) {
 .bridge-board { --card-width: calc(30px * var(--durak-scale)); --card-height: calc(41px * var(--durak-scale)); grid-template-rows: 30px var(--bridge-north-height,calc(var(--card-height) + 19px)) minmax(28px,1fr) 20px 0 var(--bridge-south-height,calc(var(--card-height) + 18px)); padding-block: 1px; }
 .bridge-is-auction .bridge-board { grid-template-rows: 30px var(--bridge-north-height,calc(var(--card-height) + 19px)) minmax(0,1fr) 20px 38px var(--bridge-south-height,calc(var(--card-height) + 18px)); }
 .bridge-is-ended .bridge-board { grid-template-rows: 30px var(--bridge-north-height,22px) minmax(64px,1fr) 0 38px var(--bridge-south-height,calc(var(--card-height) + 18px)); }
 .bridge-is-ended.bridge-empty-ended .bridge-board { grid-template-rows: 30px var(--bridge-north-height,22px) minmax(64px,1fr) 0 38px var(--bridge-south-height,20px); }
 .bridge-is-ended .bridge-seat--north .bridge-hand { display: none; }

 .bridge-seat--north { --card-width: calc(30px * var(--durak-scale)); --card-height: calc(41px * var(--durak-scale)); }
 .bridge-info { font-size: 10px; gap: 0 8px; }.bridge-info #bridge-contract { width: auto; }
 .bridge-seat-label { min-height: 16px; font-size: 10px; }.bridge-seat { gap: 2px; }
 .bridge-seat--west,.bridge-seat--east { top: 76px; bottom: 62px; min-height: 41px; --card-width: 26px; --card-height: 35px; }
 .bridge-seat--west .bridge-seat-label strong,.bridge-seat--east .bridge-seat-label strong { max-width: 60px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .bridge-bid-form { flex-direction: row; gap: 4px; }.bridge-bid-fields,.bridge-bid-calls { gap: 3px; }
 .bridge-bid-form select { max-width: 98px; }.bridge-page .bridge-actions button { padding-inline: 8px; font-size: 11px; }
 .bridge-table { width: calc(100% - 190px); }.bridge-auction-table td,.bridge-auction-table th { padding: 2px 6px; font-size: 11px; }
 .bridge-result strong { font-size: 14px; }.bridge-result p { margin-top: 2px; font-size: 10px; }
}
@media(max-width:680px) and (min-height:501px) { .bridge-embedded .bridge-board { padding-bottom: 54px; } }

/* Compact bidding box shares the card scale and fits every row without scrolling. */
.bridge-board { --bridge-bid-scale: calc(var(--durak-scale) * var(--bridge-bid-fit,1)); --bridge-bid-width: 260px; --bridge-bid-height: 24px; --bridge-bid-font: 16px; --bridge-bid-heading: 13px; }
.bridge-bid-grid { display: grid; grid-template-columns: calc(16px * var(--bridge-bid-scale)) repeat(5,minmax(0,1fr)); gap: calc(2px * var(--bridge-bid-scale)); width: min(calc(var(--bridge-bid-width) * var(--bridge-bid-scale)),100%); margin-block: auto; flex-shrink: 0; }
.bridge-bid-heading { display: flex; align-items: center; justify-content: center; color: #ecf4ee; font-size: calc(var(--bridge-bid-heading) * var(--bridge-bid-scale)); }
.bridge-bid-cell { min-width: 0; height: calc(var(--bridge-bid-height) * var(--bridge-bid-scale)); border: 1px solid #ffffff50; border-radius: 3px; background: #edf4ef; color: #143b1c; font: bold calc(var(--bridge-bid-font) * var(--bridge-bid-scale)) Arial; cursor: pointer; }
.bridge-bid-grid .is-red { color: #b72b2b; }
.bridge-bid-cell:disabled { opacity: .3; cursor: default; }
.bridge-bid-cell.is-selected { background: #ffe49a; border-color: #ffe49a; outline: 2px solid #ffe49a; outline-offset: 1px; }
.bridge-bid-cell:focus-visible { outline: 2px solid #fff; outline-offset: 1px; }
.bridge-last-call { color: #ffe49a !important; font-weight: bold; }
.bridge-is-auction .bridge-seat:not(.bridge-seat--south) .bridge-hand { display: none; }
.bridge-is-auction .bridge-board { grid-template-rows: 40px 28px minmax(0,1fr) 28px 44px calc(var(--card-height) + 28px); }
.bridge-is-auction .bridge-table { overflow: visible; align-items: flex-start; padding: 4px 2px; box-sizing: border-box; }
.bridge-bid-form { flex-wrap: wrap; }
.bridge-is-auction .bridge-seat--west,.bridge-is-auction .bridge-seat--east { width: 110px; }
.bridge-is-auction .bridge-seat:not(.bridge-seat--south) [id^="bridge-count-"] { display: none; }
@media(max-width:680px) and (min-height:501px) {
 .bridge-board { --bridge-bid-width: 240px; --bridge-bid-height: 26px; --bridge-bid-font: 16px; --bridge-bid-heading: 13px; }
 .bridge-is-auction .bridge-board { grid-template-rows: 40px 32px minmax(0,1fr) 24px 44px calc(var(--card-height) + 22px); }
 .bridge-bid-cell { height: calc(var(--bridge-bid-height) * var(--bridge-bid-scale)); }
 .bridge-bid-form { flex-direction: row; gap: 5px; }
 .bridge-page .bridge-actions button { padding-inline: 9px; font-size: 12px; }
 .bridge-is-auction .bridge-seat--west,.bridge-is-auction .bridge-seat--east { top: 44px; bottom: auto; width: 85px; min-height: 0; }
 .bridge-is-auction .bridge-seat--west .bridge-seat-label,.bridge-is-auction .bridge-seat--east .bridge-seat-label { width: 100%; }
 .bridge-is-auction .bridge-seat--north .bridge-seat-label { max-width: calc(100% - 160px); }
}
@media(max-height:500px) and (orientation:landscape) {
 .bridge-board { --bridge-bid-width: 220px; --bridge-bid-height: 24px; --bridge-bid-font: 15px; --bridge-bid-heading: 11px; }
 .bridge-is-auction .bridge-board { grid-template-rows: 20px 0 minmax(0,1fr) 16px 32px calc(var(--card-height) + 18px); }
 .bridge-is-auction .bridge-seat--north { position: absolute; top: 34px; left: 0; width: 100px; }
 .bridge-bid-cell { height: calc(var(--bridge-bid-height) * var(--bridge-bid-scale)); }
 .bridge-is-auction .bridge-seat--west,.bridge-is-auction .bridge-seat--east { top: 68px; bottom: 65px; width: 95px; }
}

@media(max-height:500px) and (orientation:landscape) {
 .bridge-is-auction .bridge-board { grid-template-columns: 44% minmax(0,1fr); grid-template-rows: 30px 26px 20px 36px minmax(0,1fr); column-gap: 8px; }
 .bridge-is-auction .bridge-table { grid-column: 1; grid-row: 1 / -1; width: 100%; }
 .bridge-is-auction .bridge-info { grid-column: 2; grid-row: 1; }
 .bridge-is-auction .bridge-seat--north { position: static; grid-column: 2; grid-row: 2; width: 90px; }
 .bridge-is-auction .bridge-message { grid-column: 2; grid-row: 3; font-size: 10px; }
 .bridge-is-auction .bridge-actions { grid-column: 2; grid-row: 4; }
 .bridge-is-auction .bridge-seat--south { grid-column: 2; grid-row: 5; width: 100%; }
 .bridge-is-auction .bridge-seat--west,.bridge-is-auction .bridge-seat--east { top: 30px; bottom: auto; min-height: 0; width: 64px; }
 .bridge-is-auction .bridge-seat--west { left: calc(44% + 8px); }
 .bridge-is-auction .bridge-seat--east { right: 5px; }
}

/* Open dummy: larger shared card faces, suit-colored headings, no hand scrolling. */
.bridge-board { --bridge-player-card-width: var(--card-width); --bridge-trick-minimum: 78px; }
.bridge-dummy-suit { --card-width: calc(min(var(--bridge-player-card-width),calc((var(--bridge-dummy-hand-width,380px) - 12px) / 4)) * var(--bridge-side-card-fit,1)); --card-height: calc(var(--card-width) * var(--bridge-player-card-ratio,1.34246575)); }
.bridge-hand--dummy-side,.bridge-seat:has(.bridge-hand--dummy-side) { width: 224px; }
.bridge-is-playing .bridge-board { grid-template-rows: var(--bridge-info-height,40px) var(--bridge-north-height,calc(var(--card-height) + 34px)) minmax(max(var(--bridge-trick-minimum),var(--card-height)),1fr) var(--bridge-status-height,32px) 0 var(--bridge-south-height,calc(var(--card-height) + 28px)); }
@media(max-width:900px) { .bridge-hand--dummy-side,.bridge-seat:has(.bridge-hand--dummy-side) { width: 144px; } }
@media(max-width:680px) {
 .bridge-board { --bridge-info-height: 54px; --bridge-status-height: 36px; --bridge-trick-minimum: 70px; }
 .bridge-hand--dummy-side,.bridge-seat:has(.bridge-hand--dummy-side) { width: 128px; }
 .bridge-board:has(.bridge-seat--west .bridge-hand--dummy-side) .bridge-table { justify-self: end; margin-right: 40px; width: calc(100% - 180px); min-width: 90px; }
 .bridge-board:has(.bridge-seat--east .bridge-hand--dummy-side) .bridge-table { justify-self: start; margin-left: 40px; width: calc(100% - 180px); min-width: 90px; }
}
@media(max-width:680px) and (max-height:650px) and (min-height:501px) { .bridge-board { --bridge-info-height: 40px; --bridge-status-height: 24px; --bridge-trick-minimum: 48px; } }
@media(max-height:500px) and (orientation:landscape) { .bridge-board { --bridge-info-height: 30px; --bridge-status-height: 20px; --bridge-trick-minimum: 28px; } }

@media(max-height:500px) and (orientation:landscape) {
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) { grid-template-columns: 44% minmax(0,1fr); grid-template-rows: 30px minmax(0,1fr) 20px calc(var(--card-height) + 22px); column-gap: 8px; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) .bridge-info { grid-column: 2; grid-row: 1; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) .bridge-table { grid-column: 2; grid-row: 2; width: 100%; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) .bridge-message { grid-column: 2; grid-row: 3; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) .bridge-actions { display: none; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) .bridge-seat:is(.bridge-seat--north,.bridge-seat--south) { grid-column: 2; grid-row: 4; width: 100%; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) .bridge-seat:has(.bridge-hand--dummy) { grid-column: 1; grid-row: 1 / -1; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) .bridge-seat--west { left: calc(44% + 8px); }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) .bridge-seat--east { right: 5px; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) :is(.bridge-seat--west,.bridge-seat--east) { top: 36px; bottom: auto; min-height: 0; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy:not(.bridge-hand--dummy-side)) :is(.bridge-seat--west,.bridge-seat--east) .bridge-hand { display: none; }
}
.bridge-dummy-suit .durak-card__center { font-size: calc(var(--card-width) * .55); }
.bridge-dummy-suit .durak-card__corner { font-size: min(calc(16px * var(--durak-scale)),calc(var(--card-width) * .27)); }
.bridge-dummy-suit .durak-card__corner span { font-size: min(calc(15px * var(--durak-scale)),calc(var(--card-width) * .25)); }

/* Keep the dummy close to the toolbar and separate it from the current trick. */
@media(min-height:501px) {
 .bridge-is-playing .bridge-board { --bridge-info-height: 24px; --bridge-dummy-table-gap: 24px; }
 .bridge-is-playing .bridge-info { gap: 2px 12px; align-content: start; padding-top: 2px; }
 .bridge-is-playing .bridge-seat--north:has(.bridge-hand--dummy) { justify-content: flex-start; gap: 4px; padding-bottom: var(--bridge-dummy-table-gap); box-sizing: border-box; }
 .bridge-is-playing .bridge-seat--south:has(.bridge-hand--dummy) { padding-top: var(--bridge-dummy-table-gap); box-sizing: border-box; }
 .bridge-is-playing .bridge-seat:has(.bridge-hand--dummy) .bridge-seat-label { min-height: 18px; }
}
@media(min-width:901px) and (min-height:501px) {
 .bridge-is-playing .bridge-seat--north:has(.bridge-hand--dummy) .bridge-seat-label { position: absolute; top: 0; right: calc(50% + 200px); width: 130px; min-height: 0; justify-content: flex-end; white-space: nowrap; }
}
@media(max-width:680px) and (min-height:501px) {
 .bridge-is-playing .bridge-board { --bridge-info-height: 30px; --bridge-dummy-table-gap: 16px; }
}

/* Side dummy needs real vertical space, rather than a shrinking 100% flex height. */
.bridge-is-playing .bridge-seat:has(.bridge-hand--dummy-side) { top: calc(var(--bridge-info-height,40px) + 8px); bottom: calc(var(--card-height) + var(--bridge-status-height,32px) + 40px); }
.bridge-hand--dummy-side { height: auto; max-height: none; flex: 1 1 0; align-self: stretch; }
@media(max-height:500px) and (orientation:landscape) {
 .bridge-is-playing .bridge-seat:has(.bridge-hand--dummy-side) { top: 4px; bottom: 4px; width: 180px; }
 .bridge-is-playing .bridge-hand--dummy-side { width: 180px; }
 .bridge-is-playing .bridge-board:has(.bridge-seat--west .bridge-hand--dummy-side) .bridge-table { justify-self: end; margin-right: 40px; width: calc(100% - 260px); min-width: 90px; }
 .bridge-is-playing .bridge-board:has(.bridge-seat--east .bridge-hand--dummy-side) .bridge-table { justify-self: start; margin-left: 40px; width: calc(100% - 260px); min-width: 90px; }

}
@media(max-width:680px) {
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy-side) { --bridge-north-height: calc(32px * var(--durak-scale) + 24px); --bridge-side-dummy-reserved: 150px; }

}

/* Preserve North's hand beside a side dummy, using smaller card backs. */
@media(max-width:680px), (max-height:500px) and (orientation:landscape) {
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy-side) { --bridge-north-height: calc(32px * var(--durak-scale) + 24px); --bridge-side-dummy-reserved: 150px; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy-side) .bridge-seat--north { --card-width: calc(24px * var(--durak-scale)); --card-height: calc(32px * var(--durak-scale)); width: calc(100% - var(--bridge-side-dummy-reserved)); gap: 4px; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy-side) .bridge-seat--north .bridge-seat-label { min-height: 18px; }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy-side) .bridge-seat--north .bridge-hand { display: flex; }
 .bridge-is-playing .bridge-board:has(.bridge-seat--east .bridge-hand--dummy-side) .bridge-seat--north { justify-self: start; margin-left: 5px; }
 .bridge-is-playing .bridge-board:has(.bridge-seat--west .bridge-hand--dummy-side) .bridge-seat--north { justify-self: end; margin-right: 5px; }
}
@media(max-height:500px) and (orientation:landscape) {
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy-side) { --bridge-side-dummy-reserved: 208px; }
}
@media(max-height:500px) and (orientation:landscape) {
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy-side) { --bridge-north-height: calc(32px * var(--durak-scale) + 8px); }
 .bridge-is-playing .bridge-board:has(.bridge-hand--dummy-side) .bridge-seat--north .bridge-seat-label { position: absolute; top: -14px; left: 0; min-height: 0; }
}