/* ENH-136: shared approved cream/felt presentation; game and role authority stay server-side. */
:root{color-scheme:light;--color-canvas:var(--gui-bg);--color-rail:var(--gui-bg);--color-play:var(--gui-felt);--color-play-deep:var(--gui-felt2);--color-surface:var(--gui-surface);--color-surface-raised:#fff;--color-surface-reading:var(--gui-surface);--color-surface-selected:var(--gui-soft);--color-text:var(--gui-ink);--color-text-muted:#586b62;--color-text-inverse:#fff;--color-border:var(--gui-line);--color-border-quiet:var(--gui-line);--color-border-strong:#83988d;--color-action:var(--gui-accent);--color-action-hover:var(--gui-felt2);--color-action-ink:#fff;--color-focus:#96730e;--color-success:#17664d;--color-danger:#a92e34;--color-warning:#806013;--color-link:var(--gui-accent);--color-info:#24517a;--font-ui:var(--gui-face),system-ui,sans-serif;--text-base:var(--gui-font);--rail:var(--gui-bg);--rail-2:var(--gui-surface);--ink:var(--gui-ink);--muted:#586b62;--brass:var(--gui-accent);--brass-dim:#83988d;--ok:#17664d;--shadow:0 4px 18px #163b2d18;--gui-field-bg:#fff;--gui-field-ink:#1e2b29;--gui-field-disabled-bg:#e4ebe7;--gui-field-disabled-ink:#44564e}
body{background:var(--gui-bg);color:var(--gui-ink);font-family:var(--gui-face),system-ui,sans-serif;font-size:var(--gui-font)}
body:not(.table-mode) #topbar{background:var(--gui-surface);border-color:var(--gui-line);box-shadow:0 2px 12px #163b2d12}
body:not(.table-mode) :is(.workspace-panel,.tncard,.tnsection,.tablecard,.roombox,.historyrow,.people-row,.admin-action-panel,.activity-strip){background:var(--gui-surface);color:var(--gui-ink);border:1px solid var(--gui-line);border-radius:12px;box-shadow:0 3px 14px #163b2d0c}
body:not(.table-mode) :is(.tnsection,.roombox){padding:18px}
body:not(.table-mode) :is(h1,h2,h3,h4){color:var(--gui-ink);font-family:var(--gui-face),system-ui,sans-serif}
body:not(.table-mode) h1{font-size:clamp(25px,3vw,36px);font-weight:800;letter-spacing:-.02em}
body:not(.table-mode) :is(.btn,.seatcell,.tncard,.historyrow){font-size:inherit;text-transform:none;letter-spacing:normal}
body:not(.table-mode) .btn{background:var(--gui-accent);color:white;border-radius:8px;min-height:44px}
body:not(.table-mode) .btn.ghost{background:var(--gui-soft);color:var(--gui-ink);border:1px solid var(--gui-line)}
body:not(.table-mode) :is(input,select,textarea){background:var(--gui-field-bg);color:var(--gui-field-ink);border:1px solid var(--gui-line);border-radius:7px;font:inherit}
body :is(input:not([type=checkbox]):not([type=radio]),select,textarea){color-scheme:light;caret-color:currentColor;-webkit-text-fill-color:currentColor}
body :is(input:not([type=checkbox]):not([type=radio]),select,textarea):disabled{opacity:1;background:var(--gui-field-disabled-bg);color:var(--gui-field-disabled-ink);-webkit-text-fill-color:var(--gui-field-disabled-ink)}
body :is(input:not([type=checkbox]):not([type=radio]),textarea)::placeholder{color:#5f7068;opacity:1;-webkit-text-fill-color:#5f7068}
body :is(input:not([type=checkbox]):not([type=radio]),select,textarea)[aria-invalid=true]{border-color:var(--color-danger);box-shadow:0 0 0 1px var(--color-danger)}
body :is(input:not([type=checkbox]):not([type=radio])):autofill,
body :is(input:not([type=checkbox]):not([type=radio])):-webkit-autofill{box-shadow:0 0 0 1000px var(--gui-field-bg) inset;-webkit-text-fill-color:var(--gui-field-ink);caret-color:var(--gui-field-ink)}
.inline-action-input{flex:1;min-width:0;padding:8px;font-family:var(--font-data)}
body:not(.table-mode) label{color:var(--gui-muted);text-transform:none;letter-spacing:normal;font-size:var(--gui-font)}
body:not(.table-mode) :is(.sub,.tnmeta,.meta,.note,.byline,.lede){color:var(--gui-muted)}
body:not(.table-mode) :is(.sheet,.historydetail){background:var(--gui-surface);color:var(--gui-ink);border-color:var(--gui-line);border-radius:12px}
body:not(.table-mode) :is(th,.pairhead){background:var(--gui-soft);color:var(--gui-ink)}
body:not(.table-mode) :is(td,.seatline,.scoreline){color:var(--gui-ink);border-color:var(--gui-line)}
body:not(.table-mode) :is(.seatcell.free,.seatcell.mine){background:var(--gui-soft);color:var(--gui-ink);border-color:var(--gui-line)}
body:not(.table-mode) :is(.seatcell,.seatcell.away){background:var(--gui-surface);color:var(--gui-ink);border-color:var(--gui-line)}
body:not(.table-mode) .seatcell .sn{color:var(--gui-ink)}
/* Public sign-in retains the branded background defined in presentation.css. */
body:not(.table-mode) #profile-screen{background:var(--gui-bg)}
.benito-mark{width:28px;height:28px;vertical-align:middle;object-fit:contain;margin-inline-end:6px}
.gui-score-scroll{overflow:auto;max-width:100%}.gui-match-scores{width:100%;border-collapse:collapse;white-space:nowrap}
.gui-match-scores :is(th,td){padding:10px 12px;text-align:start}.gui-match-scores .num{text-align:end;font-variant-numeric:tabular-nums}
.gui-match-scores .match-history{color:var(--gui-accent);text-decoration:underline;text-underline-offset:3px;min-height:36px}
.gui-score-details{margin-top:12px}.gui-score-details summary,.gui-replay-options summary{cursor:pointer;padding:8px;color:var(--gui-accent)}
.gui-replay-header{display:flex;gap:20px;align-items:center}.gui-replay-board{display:grid;gap:5px;min-width:180px;padding:10px 12px;border:1px solid #d4bb64;border-radius:9px;background:#fff8dd;color:#4d421e;font-size:var(--gui-font)}
#history-detail>h2{margin:0}.replaytable{background:radial-gradient(ellipse at 50% 40%,var(--gui-felt),var(--gui-felt2));border:0;border-radius:18px}
.replaytable .dealhand{color:var(--gui-ink)}.replaytable .lbl{background:var(--gui-surface);color:var(--gui-ink);border-radius:7px;font:800 var(--gui-font)/1.2 var(--gui-face),system-ui;padding:6px}
.replaytable .diagramhand{background:var(--gui-surface);border:1px solid var(--gui-line);border-radius:8px;color:var(--gui-ink);padding:calc(9px * var(--gui-scale))}
.replaytable .diagramrow{min-height:calc(30px * var(--gui-scale));gap:2px}.replaytable .diagramrank{font:800 var(--gui-rank)/1.2 Georgia,serif;color:var(--gui-ink);min-width:26px;padding:2px}
.replaytable .slbl{font-size:calc(var(--gui-rank) + 3px)}.replaytable .card{width:calc(54px * var(--gui-scale));height:calc(78px * var(--gui-scale));--card-rank-size:var(--gui-rank);--card-suit-size:calc(var(--gui-rank) + 3px)}
.replaytable .replay-auction{background:var(--gui-surface);color:var(--gui-ink);border-radius:9px}.replaytable .auction td{color:var(--gui-ink)}
.replaytable .replay-empty{color:white}.replaytable .dealhand.focus{outline-color:#e5c34b}
.gui-replay-options{position:relative}.gui-replay-options[open]{z-index:5}.gui-replay-options[open] .replay-auction-actions{position:absolute;bottom:100%;background:var(--gui-surface);border:1px solid var(--gui-line);border-radius:8px;padding:12px;box-shadow:var(--shadow)}
.gui-map-scroll{overflow:auto;max-width:100%}.gui-table-map{border-collapse:collapse;white-space:nowrap;width:100%}.gui-table-map :is(td,th){padding:12px;border:1px solid var(--gui-line);text-align:center}
@media(max-width:700px){.gui-replay-header{gap:8px;align-items:start}.gui-replay-board{min-width:140px}.gui-replay-header>div:last-child{font-size:14px}.gui-score-scroll{width:100%}body:not(.table-mode) .roomgrid{grid-template-columns:1fr}body:not(.table-mode) .formgrid{grid-template-columns:1fr}body:not(.table-mode) .tnsection{padding:12px}}
/* Overlapping bidding cards retain the existing grid, legal calls and focus order. */
body.table-mode #gui-bid-grid{--bid-pitch:calc(var(--gui-font) + 17px);grid-auto-rows:var(--bid-pitch);row-gap:0;column-gap:4px;padding-bottom:20px}
body.table-mode #gui-bid-grid button{position:relative;display:block;height:calc(var(--bid-pitch) + 20px);min-height:0;align-self:start;overflow:hidden;border:1px solid #afbeb3;border-radius:9px 9px 6px 6px;background:linear-gradient(110deg,#fffefb,#f4f1e7);box-shadow:0 -2px 4px #143c2b12;padding:0;opacity:1;color:#172b25}
body.table-mode #gui-bid-grid .gui-bid-symbol{position:absolute;top:5px;left:0;right:0;font-weight:850;font-size:var(--gui-font);line-height:1.2}
body.table-mode #gui-bid-grid .gui-bid-echo{position:absolute;bottom:0;right:4px;opacity:.12;font:900 29px/1 Georgia;pointer-events:none}
body.table-mode #gui-bid-grid button:disabled{background:#e7e9e3;color:#939d96}
body.table-mode #gui-bid-grid button:hover:not(:disabled){background:#fff0b3;border-color:#b49831}
body.table-mode #gui-bid-grid button:focus-visible{outline:3px solid #bb8e13;outline-offset:-4px}
body.table-mode #gui-bid-grid .gui-bid-level{align-self:start;padding-top:5px;line-height:1.2}
body:not(.table-mode) :is(th,.pairhead,.cap){text-transform:none;letter-spacing:normal}
body:not(.table-mode) :is(#lobby,#admin,#tourneys,#tn-detail,#match-detail,#people-screen,#history-screen){background:var(--gui-bg)}
body:not(.table-mode) :is(#lobby,#admin,#tourneys,#tn-detail,#match-detail){padding-top:calc(var(--topbar-clearance) + 24px)}
body:not(.table-mode) #tb-player-id{color:var(--gui-ink);background:var(--gui-soft);border-color:var(--gui-line)}
body:not(.table-mode) :is(.replay-status,.replaytable .dealhand){background:transparent;color:var(--gui-ink);border:0;box-shadow:none}
body:not(.table-mode) .replaytable .dealhand.focus{outline:2px solid #e5c34b;border-radius:8px}
body:not(.table-mode) .replaytable{gap:14px;padding:14px}
body:not(.table-mode) .replaytable .diagramrow .slbl{font-size:calc(var(--gui-rank) + 3px);width:30px;flex-basis:30px}
body:not(.table-mode) input[type=checkbox]{width:20px;height:20px;min-height:20px;padding:0;margin:0 8px 0 0;vertical-align:middle;accent-color:var(--gui-accent)}
body:not(.table-mode) label:has(>input[type=checkbox]){display:flex;align-items:center;gap:5px}
@media(max-width:700px){#history-screen{overflow:auto;min-height:0}#history-screen .lobby-inner{height:auto;min-height:100%}.historyworkspace,.historydetail{overflow:visible}.replaytable{min-height:540px}.gui-replay-header{flex-wrap:wrap}.replay-actions{flex-wrap:wrap}.replay-actions .btn{flex-basis:40%}}
body:not(.table-mode) #people-list table.users{background:var(--gui-surface);border:1px solid var(--gui-line);border-radius:10px;font-size:var(--gui-font)}
body:not(.table-mode) #people-list table.users th{background:var(--gui-soft);color:var(--gui-ink);font-size:.85em;padding:12px;text-transform:none;letter-spacing:normal}
body:not(.table-mode) #people-list table.users td{padding:12px;font-size:.9em}
body:not(.table-mode) :is(.tnmeta,.meta,.byline){font-family:var(--gui-face),system-ui,sans-serif;font-size:.85em;letter-spacing:normal}
body:not(.table-mode) #match-detail .lobby-inner{width:min(1180px,100%)}
body:not(.table-mode) #match-detail{padding:calc(var(--topbar-clearance) + 10px) 18px 14px}
body:not(.table-mode) #match-detail .time-zone-context{margin:5px 2px;font-size:.78em}
body:not(.table-mode) #match-detail .match-progress-room{background:var(--gui-surface);color:var(--gui-ink);border-color:var(--gui-line)}
body:not(.table-mode) #match-detail .match-current-board{color:var(--gui-accent)}
body:not(.table-mode) #match-detail .match-room-pair{border-color:var(--gui-line)}
body:not(.table-mode) #match-detail .match-room-management{border-top:1px solid var(--gui-line);padding-top:7px}
@media(max-width:700px){body:not(.table-mode) #match-detail{padding-inline:10px}.match-summary-primary{grid-template-columns:1fr}.match-room-pair{grid-template-columns:1fr;gap:3px}.match-room-pair span{white-space:normal}.match-current-board{white-space:normal;text-align:right}}
body:not(.table-mode) table.gui-match-scores{font:var(--gui-font)/1.4 var(--gui-face),system-ui,sans-serif}
body:not(.table-mode) table.gui-match-scores :is(th,td,button){font-size:inherit;letter-spacing:normal}
body:not(.table-mode) h1 .byline{font-size:1rem;font-weight:500;text-transform:none}
body:not(.table-mode) .pairbox{border-color:var(--gui-line);border-radius:7px}

/* Review round 3: distinct top-level destinations and functional score grids. */
#lobby :is(#lobby-play,#lobby-teams,.lobby-aside)[hidden]{display:none!important}
#lobby .lobby-workspace{grid-template-columns:minmax(0,1fr)}
body:not(.table-mode) :is(.sub,.note,.lede,.seatcell .sn,.seatcell .who,.formgrid p,.roomgrid p){font-size:var(--gui-font)}
body:not(.table-mode) h1{font-size:clamp(32.5px,3.9vw,46.8px)}
body:not(.table-mode) :is(h2,h3){font-size:1.3em}
body:not(.table-mode) #topbar button{font-size:var(--gui-font)}
body:not(.table-mode) table.gui-match-scores :is(th,td){border:1px solid #83988d;padding:8px;text-align:center}
body:not(.table-mode) table.gui-match-scores .num{text-align:right}
.gui-match-scores tfoot{font-weight:800}
.gui-match-scores .gui-vp-total{font-size:1.15em;font-weight:900}
body:not(.table-mode) .sheet:has(.gui-match-scores){width:calc(100vw - 32px);max-width:1600px}

/* Live-table compass layout; Board and replay controls use the felt corners. */
body:not(.table-mode) #history-screen.replaying{height:auto;min-height:100dvh;overflow:visible}
#history-screen.replaying .lobby-inner{height:auto;min-height:0;max-width:1532px}
#history-screen.replaying .historyworkspace{overflow:visible;display:block}
#history-screen.replaying .historydetail{overflow:visible;padding:0;border:0;background:transparent;box-shadow:none}
body:not(.table-mode) .replaytable{grid-template-areas:'board north options' 'west center east' '. south actions';grid-template-columns:minmax(220px,1fr) minmax(300px,1.4fr) minmax(220px,1fr);grid-template-rows:repeat(3,minmax(min-content,1fr));align-items:center;gap:16px;padding:16px;max-width:1500px;min-width:760px;min-height:max(650px,calc(100dvh - var(--history-top) - 90px));height:auto;flex:none}
body:not(.table-mode) .replaytable .dealhand{overflow:visible;max-height:none;padding:0;width:100%;min-width:0;justify-self:center}
body:not(.table-mode) .replaytable .lbl{white-space:normal;letter-spacing:normal;font-size:var(--gui-font)}
body:not(.table-mode) .replaytable .replayhand{zoom:1;max-width:100%}
body:not(.table-mode) .replaytable .diagramrow{flex-wrap:wrap;white-space:normal;min-height:calc(30px * var(--gui-scale))}
body:not(.table-mode) .replaytable .gui-replay-board{grid-area:board;align-self:start;min-width:0;max-width:280px}
body:not(.table-mode) .replaytable .replay-status{font-size:.85em;max-height:none;overflow:visible;color:var(--gui-ink)}
body:not(.table-mode) .replay-auction-actions{grid-area:options;display:flex;flex-direction:column;align-self:start}
body:not(.table-mode) .replay-actions{grid-area:actions;display:grid;grid-template-columns:1fr 1fr;align-self:end}
body:not(.table-mode) .replaytable :is(.replay-actions,.replay-auction-actions) .btn{font-size:var(--gui-font);min-height:44px;flex-basis:auto}
body:not(.table-mode) .replaycenter{min-height:190px;align-self:stretch;overflow:hidden;border-radius:10px}
body:not(.table-mode) .replaytable .auction,body:not(.table-mode) .replaytable .auction :is(th,td,button){font-size:var(--gui-font)}
body:not(.table-mode) .replaytable .hand.horizontal{flex-wrap:wrap;justify-content:center}
body:not(.table-mode) .replaytable .hand.tight .card+.card{margin-left:calc(-20px * var(--gui-scale))}
body:not(.table-mode) .replaytable .suitrow .card+.card{margin-left:calc(-20px * var(--gui-scale))}
@media(max-width:800px){#history-screen.replaying{overflow:auto}body:not(.table-mode) .replaytable{height:auto;min-height:800px}}

body:not(.table-mode) :is(.seatline,.pairline,.pairhead,.seatline .sid,.seatline .here,.seatline .away,.status,.pill-sm,.rolechip,.uid,.umail,.err,.idhint,.empty,.tn-back-sm,.replay-empty){font-size:var(--gui-font);letter-spacing:normal}
body:not(.table-mode) :is(.formgrid,.roomgrid,.roombox){font-size:var(--gui-font)}
body:not(.table-mode) :is(table.sheet,table.tn,table.users){font-size:var(--gui-font)}
body:not(.table-mode) :is(table.sheet,table.tn,table.users) :is(th,td){font-size:inherit;letter-spacing:normal}
body:not(.table-mode) :is(.seatcell .sid,.seatcell .st,.seatcell .sp){font-size:.85em;letter-spacing:normal}
body:not(.table-mode) .creation-diamond{max-width:540px;grid-template-columns:repeat(3,minmax(0,1fr))}
body:not(.table-mode) .creation-diamond label{font-size:var(--gui-font)}
body:not(.table-mode) #history-screen .lobby-inner{width:min(1500px,100%)}

body:not(.table-mode) #history-screen.replaying{height:calc(100dvh - var(--history-top));min-height:0;overflow:auto}

body:not(.table-mode) .replaytable{grid-template-areas:'board north options' 'west center east' 'status south actions';grid-template-rows:auto auto auto;align-content:space-between}
body:not(.table-mode) .replaytable>.replay-status{grid-area:status;align-self:end;color:white;font-size:var(--gui-font)}

/* History uses the live table's compact, non-displacing menu. */
body.history-replay-mode #topbar{flex-wrap:nowrap;left:0;right:0;min-height:64px;padding:5px 12px}
body.history-replay-mode #topbar .topbar-menu{display:block;margin-left:auto}
body.history-replay-mode #topbar #topbar-navigation{display:none}
body.history-replay-mode #topbar .topbar-account{display:flex}
body.history-replay-mode #topbar .topbar-account>:not(#tb-notifications){display:none!important}
body.history-replay-mode #topbar.menu-open #topbar-navigation{display:grid;position:absolute;right:12px;top:100%;width:280px;max-height:calc(100dvh - 90px);overflow:auto;background:var(--gui-surface);padding:8px;border:1px solid var(--gui-line);box-shadow:var(--shadow)}
body.history-replay-mode .gui-menu-account{display:grid;gap:6px}
body.history-mode #history-screen.replaying{padding:6px 12px}
body.history-mode #history-screen .history-heading{min-height:44px}
body.history-mode[data-history-scroll=no] #history-screen.replaying{overflow:hidden}
body.history-mode[data-history-scroll=no] .replaytable{position:relative;min-width:0;min-height:0;height:calc(100dvh - var(--history-top) - 68px);margin:0;grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) minmax(0,1fr);align-content:normal;gap:12px;padding:12px}
body.history-mode[data-history-scroll=no] .replaytable .dealhand.n{align-self:start}
body.history-mode[data-history-scroll=no] .replaytable .dealhand.s{align-self:end}
body.history-mode[data-history-scroll=no] .replaytable .gui-replay-board{gap:2px;padding:6px 9px;font-size:.85em}
body.history-mode[data-history-scroll=no] .replaytable .replay-auction-actions{grid-area:status;align-self:end;display:grid;grid-template-columns:1fr 1fr}
body.history-mode[data-history-scroll=no] .replaytable #replay-boards{grid-column:1/-1}
body.history-mode[data-history-scroll=no] .replaytable .replaycenter:has(.replay-auction){grid-area:options;align-self:start;min-height:0;height:var(--replay-corner-height,150px)}
body.history-mode[data-history-scroll=no] .replaytable>.replay-status{grid-area:center;align-self:center;font-size:.8em;z-index:1;pointer-events:none}
body.history-mode[data-history-scroll=no] .replaytable .replaycenter:not(:has(.replay-auction)){grid-area:center;position:absolute;left:0;right:0;top:0;bottom:0;min-height:0}
body.history-mode[data-history-scroll=no] .replaytable:has(.replaycenter .card)>.replay-status{display:none}
body.history-mode[data-history-scroll=no] .replaytable .replay-actions{gap:5px}
body.history-mode[data-history-scroll=no] .replaytable :is(.replay-actions,.replay-auction-actions) .btn{padding:5px;font-size:.85em;white-space:normal}
body.history-mode[data-history-scroll=allowed] #history-screen.replaying{overflow:auto}

body.history-mode[data-history-scroll=no] .replaytable .gui-replay-board{grid-template-columns:1fr auto;line-height:1.2;font-size:var(--gui-font);max-width:none}
body.history-mode[data-history-scroll=no] .gui-replay-board :is(.gui-replay-dealer,.gui-replay-contract,.gui-replay-score){grid-column:1/-1}
body.history-mode[data-history-scroll=no] .gui-replay-board-title{align-self:center}
/* Place played tricks in the measured gap between partner and own hand. */
body.history-mode[data-history-scroll=no] .replaytable .replaycenter:not(:has(.replay-auction)){grid-area:auto;position:absolute;left:30%;right:30%;top:var(--replay-mid-top);bottom:auto;height:var(--replay-mid-height)}
@media(max-height:820px){
 body.history-mode[data-history-scroll=no] .replaytable{grid-template-rows:minmax(0,1.16fr) minmax(100px,.68fr) minmax(0,1.16fr)}
 body.history-mode[data-history-scroll=no] .replaytable :is(.dealhand.n,.dealhand.s) .diagramhand{display:flex;flex-direction:column;gap:0;padding:3px 6px}
 body.history-mode[data-history-scroll=no] .replaytable :is(.dealhand.n,.dealhand.s) .diagramrow{min-height:calc(25px * var(--gui-scale));line-height:1}
 body.history-mode[data-history-scroll=no] .replaytable :is(.dealhand.n,.dealhand.s) .diagramrank{line-height:1;padding-block:0}
 body.history-mode[data-history-scroll=no] .replaytable :is(.dealhand.n,.dealhand.s) .lbl{padding-block:3px}
 body.history-mode[data-history-scroll=no] .replay-hcp-layer>.replay-hcp-value{grid-template-columns:auto auto auto;gap:0 3px;min-width:0;padding:2px 4px}
 body.history-mode[data-history-scroll=no] .replay-hcp-value strong{font-size:1em}
 body.history-mode[data-history-scroll=no] .replay-hcp-value small{grid-column:auto;font-size:.6em}
}

/* BUG-175: let waves show through the form while keeping text readable. */
body:not(.table-mode) #gate .gate-card{background:rgba(255,255,255,.78);border:0;box-shadow:none}
body:not(.table-mode) #gate :is(label,.note,.idhint){color:#173846}

/* Pilot review: consistent readable dialogs, compact grouped results and replay controls. */
body .sheet.gui-appearance,body .sheet.gui-appearance :is(label,select,button,p){font-family:var(--gui-face),system-ui,sans-serif;font-size:var(--gui-font)}
body .replay-actions{display:flex!important;flex-direction:column;gap:4px}
.replay-transport{display:grid;grid-template-columns:repeat(4,minmax(40px,1fr));gap:4px}
.replay-actions .replay-transport .btn{min-width:40px;min-height:40px;padding:3px;font-size:18px;line-height:1}
.replay-actions .replay-other{width:100%;min-height:32px;padding:3px;font-size:.78em}
@media(min-width:801px){
 body.history-mode[data-history-scroll=no] .replay-dd-inline{position:fixed;left:20px;bottom:14px;z-index:6}
 body.history-mode[data-history-scroll=no] .replay-actions{position:fixed;right:12px;bottom:12px;z-index:6;width:min(230px,22vw);padding:5px;border:1px solid rgba(255,255,255,.45);border-radius:8px;background:rgba(5,38,28,.9)}
 body.history-mode[data-history-scroll=no] #direct-chat-host{bottom:104px}
}
.benito-identity{display:inline-flex;align-items:center;gap:3px}.benito-identity>span:not(.sr-only){font-family:Georgia,serif;font-style:italic;font-weight:700}
.presence-dot{color:#b32632}.on .presence-dot{color:#167444}
.match-grid{border-collapse:collapse;width:100%;font-size:.9em}.match-grid :is(td,th){padding:7px;border-bottom:1px solid var(--gui-line);text-align:left}.match-grid .historyrow{display:inline;padding:0;background:none;border:0;box-shadow:none;font:inherit}
.time-zone-context{margin:6px 0 10px;color:var(--gui-muted);font-size:.86em;line-height:1.35;overflow-wrap:anywhere}
.match-lifecycle-times{margin:6px 0 10px}
.match-score-identity{margin:0 0 8px;padding:0 2px 8px;border-bottom:2px solid var(--gui-line);color:var(--gui-ink)}
.match-score-title-line{display:grid;grid-template-columns:minmax(190px,1fr) minmax(220px,1.2fr) minmax(310px,1fr);align-items:center;gap:14px}
.match-score-title-line h2{margin:0;text-align:center;font-size:clamp(22px,2.5vw,32px);line-height:1.1}
.match-score-title-line p{margin:0;line-height:1.35}
.match-score-creator{justify-self:start}.match-score-creator small{font-size:.72em;font-weight:500;color:var(--gui-muted)}
.match-score-creator strong{font-size:1em}.match-score-timing{display:flex;justify-content:flex-end;gap:5px 12px;flex-wrap:wrap;text-align:right;font-size:.82em;font-variant-numeric:tabular-nums}
.match-score-summary-line{display:grid;grid-template-columns:minmax(190px,1fr) minmax(220px,1.2fr) minmax(310px,1fr);align-items:baseline;gap:14px;margin:6px 0 0}
.match-score-summary-line p{margin:0}.match-score-boards{justify-self:start}.match-score-scoring{justify-self:end;text-align:right}
.match-score-versus{display:flex;justify-content:center;align-items:baseline;gap:12px;font-family:var(--serif);font-size:clamp(21px,2.4vw,30px);line-height:1.15;text-align:center}
.match-score-versus span{font:700 .62em/1 var(--sans);color:var(--gui-muted);letter-spacing:.08em}
.match-list-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:10px}.match-list-tools label{display:flex;align-items:center;gap:8px}
.gui-match-scores :is(td,th){border-right:1px solid var(--gui-line)}
.gui-match-scores{min-width:960px;font-size:14px}
.gui-match-scores thead th{padding:8px 7px;font-size:11px;vertical-align:middle}
.gui-match-scores tbody td,.gui-match-scores tfoot :is(td,th){padding-block:4px}
.gui-match-scores th small{font-size:11px}
.gui-score-table-heading{gap:12px;align-items:center}
.gui-score-table-heading>strong{font-size:17px;white-space:nowrap}
.gui-score-table-heading b{font-size:13px;line-height:1.2;white-space:normal}
.gui-score-table-heading b em{font-style:normal;font-size:1.08em;color:var(--gui-ink);letter-spacing:0;text-transform:none}
.gui-score-table-heading small{font-size:11px;white-space:nowrap}
.gui-match-scores thead tr:nth-child(2) th span{font-size:12px}
.gui-match-scores thead tr:nth-child(2) th small{font-size:12px;font-weight:800;color:var(--gui-ink)}
.gui-match-scores tbody td:is(:nth-child(1),:nth-child(6),:nth-child(11),:nth-child(13),:nth-child(15)){border-right:3px solid #83988d}
.gui-match-scores thead tr:first-child th{border:3px solid #83988d}
#sheet.match-create-dialog{max-height:calc(100dvh - 32px);overflow:auto;width:min(1050px,calc(100vw - 40px));box-sizing:border-box}
.match-create-dialog>.tnsection{padding:8px}.match-create-dialog .formgrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.match-create-dialog .formgrid>.full{grid-column:auto}
.match-create-dialog .roombox{padding:8px}.match-create-dialog .creation-diamond{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.match-create-dialog .creation-diamond label{grid-area:auto!important}
.match-create-dialog :is(input,select){min-height:34px;padding:5px}.match-create-dialog .btnrow{position:sticky;bottom:0;background:var(--gui-surface);padding:8px 0}.match-create-dialog h2{margin:0 0 8px}
#lobby-list .tablecard{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(0,4fr);gap:8px;padding:8px}
#lobby-list .tablecard header{display:block}#lobby-list .tablecard h2{font-size:1em}#lobby-list .seatgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}#lobby-list .seatcell{padding:6px;min-width:0}#lobby-list .sid{font-size:.75em}#lobby-list .meta{font-size:.7em}
@media(max-width:700px){.match-grid{font-size:.75em}.match-grid :is(td,th){padding:4px;overflow-wrap:anywhere}.match-create-dialog .formgrid{grid-template-columns:1fr 1fr}#lobby-list .tablecard{grid-template-columns:1fr}#lobby-list .seatgrid{grid-template-columns:1fr 1fr}.match-score-title-line{grid-template-columns:1fr;gap:7px}.match-score-title-line h2{grid-row:1}.match-score-creator{grid-row:2;justify-self:center;text-align:center}.match-score-timing{grid-row:3;justify-content:center;text-align:center}.match-score-summary-line{grid-template-columns:auto minmax(0,1fr) auto;gap:10px;margin-top:7px;font-size:.75em}.match-score-summary-line>p{white-space:nowrap}.match-score-versus{gap:4px;font-size:clamp(16px,4.3vw,19px)}.gui-score-scroll{max-height:58vh}}
body .sheet.match-create-dialog .creation-diamond{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:none;gap:6px;margin:6px 0}
body .sheet.match-create-dialog .creation-diamond label{grid-area:auto!important;text-align:left;margin:0}
body .sheet.match-create-dialog .roombox{padding:8px}
body .sheet.match-create-dialog .roomgrid{gap:8px}
body .sheet.match-create-dialog .fill-benito{font-size:.85em;min-height:38px;padding:5px}
body .sheet.match-create-dialog label{margin:0 0 3px}
body .sheet.match-create-dialog :is(input,select){margin:0;min-height:38px;padding:5px 7px}
body .sheet.match-create-dialog .creation-diamond{grid-template-rows:auto auto;align-items:start}
body .sheet.match-create-dialog .creation-diamond label{align-items:stretch;gap:3px}
body .sheet.match-create-dialog .formgrid{margin-bottom:8px}
body .sheet.match-create-dialog .fill-benito{margin:6px 0 0;width:100%}

/* ENH-178: History leader/winner marker stays in the hand-to-felt gap. */
body:not(.table-mode) .replaytable{position:relative}
body:not(.table-mode) .replaytable .dealhand.focus{outline:4px solid #e5c34b;transform:none}
.replay-hcp-layer{position:absolute!important;inset:0;pointer-events:none}
.replay-hcp-layer>.replay-hcp-value{position:absolute;display:grid;grid-template-columns:auto auto;align-items:center;gap:0 5px;min-width:58px;padding:4px 7px;border:1px solid rgba(247,244,236,.55);border-radius:8px;background:rgba(5,38,28,.88);color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.replay-hcp-value span{font-weight:800}.replay-hcp-value strong{font-size:1.2em}.replay-hcp-value small{grid-column:1/-1;font-size:.7em;letter-spacing:.06em;text-align:center}
.replay-hcp-layer>.n{top:7px;left:50%;transform:translateX(-50%)}.replay-hcp-layer>.e{right:7px;top:50%;transform:translateY(-50%)}
.replay-hcp-layer>.s{bottom:7px;left:50%;transform:translateX(-50%)}.replay-hcp-layer>.w{left:7px;top:50%;transform:translateY(-50%)}
.replay-dd-inline{grid-area:status;align-self:end;justify-self:start;z-index:2;width:min(210px,100%);box-sizing:border-box;padding:4px 6px;border:1px solid rgba(255,255,255,.5);border-radius:7px;background:rgba(247,244,236,.95);color:var(--gui-ink);font:800 clamp(11px,calc(var(--gui-font) * .72),14px)/1.05 var(--gui-face),system-ui,sans-serif}
body:not(.table-mode) .replay-dd-inline>.replay-dd-title{margin:0 0 4px;font:inherit;color:inherit;text-align:left}
.replay-dd-inline .empty{margin:0;padding:5px;font-size:inherit}.replay-dd-table{width:100%;table-layout:fixed;border-collapse:collapse;margin:0}.replay-dd-table :is(th,td){border:0;padding:2px 4px;text-align:center;font-variant-numeric:tabular-nums}.replay-dd-table thead th{border-bottom:1px solid var(--gui-line);background:transparent}.replay-dd-table tbody th{background:transparent}.replay-dd-table .red{color:#b4232e}
.replay-leader-marker{position:absolute;width:14px;height:14px;border-radius:50%;background:#f2c744;border:1px solid #fff2b4;box-shadow:0 1px 3px #0005;transform:translate(-50%,-50%);pointer-events:none;z-index:3}
@media(forced-colors:active){.replay-leader-marker{background:Highlight;border:2px solid CanvasText}}
/* A narrow replay must scroll rather than collapse the hands into the felt. */
@media(max-width:800px){
 body.history-mode[data-history-scroll=no] #history-screen.replaying{overflow:auto}
 body.history-mode[data-history-scroll=no] .replaytable{min-width:760px;height:auto;min-height:900px;grid-template-columns:minmax(220px,1fr) minmax(280px,1.4fr) minmax(220px,1fr);grid-template-rows:auto auto auto;gap:20px}
 body.history-mode[data-history-scroll=no] .replaytable .replaycenter:not(:has(.replay-auction)){grid-area:center;position:relative;left:auto;right:auto;top:auto;bottom:auto;min-height:240px;height:auto}
}