@import url('styles.css?v=41');
.back { color:var(--muted); text-decoration:none; font-size:0; }
.back::after { content:'← FELLAS CARD ROOM'; color:var(--gold); font-size:.7rem; font-weight:800; letter-spacing:.2em; }
header { position:relative; }
.room-grid { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:20px; }
.board { position:relative; border:1px solid var(--line); border-radius:20px; background:rgba(15,19,19,.88); overflow:hidden; }
.players-list { display:flex; flex-wrap:wrap; gap:8px; min-height:54px; padding:10px; border-bottom:1px solid var(--line); }
.player-chip { flex:1; min-width:110px; padding:9px 11px; border-radius:8px; color:var(--muted); background:rgba(255,255,255,.05); font-size:.75rem; }
.player-chip.active { color:var(--ink); box-shadow:inset 0 0 0 1px var(--gold); }
.player-chip strong { float:right; color:var(--ink); }
.player-chip em { display:inline-block; margin-left:7px; padding:2px 5px; border-radius:999px; font-size:.56rem; font-style:normal; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.dealer-badge { color:var(--muted); border:1px solid var(--line); }
.winner-badge { color:#15130e; background:var(--gold); box-shadow:0 0 12px rgba(224,184,108,.45); }
.player-chip.match-winner { outline:3px solid var(--gold); outline-offset:3px; }
.turn-badge { color:#15130e; background:var(--gold); }
.playfield { position:relative; height:600px; padding:80px 150px; overflow:hidden; background:radial-gradient(ellipse,#216e5d 0%,var(--felt) 56%,var(--felt-dark) 100%); box-shadow:inset 0 0 80px rgba(0,0,0,.5); text-align:center; }
.table-players { position:absolute; z-index:3; inset:0; min-height:0; padding:0; border:0; pointer-events:none; }
.table-players .player-zone { position:absolute; z-index:20; width:150px; min-height:74px; transform:translate(-50%,-50%); text-align:center; background:rgba(8,28,24,.9); box-shadow:0 8px 22px rgba(0,0,0,.25); }
.ohhell-game .table-players .player-zone.active:not(.self-player) { outline:3px solid var(--gold); outline-offset:3px; box-shadow:0 8px 22px rgba(0,0,0,.25); }
.pinochle-game .table-players .player-zone.active:not(.self-player) { outline:3px solid var(--gold); outline-offset:3px; box-shadow:0 8px 22px rgba(0,0,0,.25); }
.table-players .self-player { min-height:0; padding:0; background:transparent; box-shadow:none; }
.table-players .self-player .player-info,.table-players .self-player .opponent-hand { display:none; }
.player-info { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:3px; }
.player-info strong { flex-basis:100%; float:none; font-size:.62rem; }
.opponent-hand { display:flex; justify-content:center; min-height:34px; margin-top:5px; }
.opponent-hand .playing-card { flex:0 0 24px; width:24px; height:34px; margin-left:-15px; padding:0; border-width:2px; border-radius:3px; }
.opponent-hand .playing-card:first-child { margin-left:0; }
.side-player .opponent-hand { position:absolute; top:50%; height:170px; margin:0; flex-direction:column; align-items:center; transform:translateY(-50%); }
.left-player .opponent-hand { left:calc(100% + 7px); }
.right-player .opponent-hand { right:calc(100% + 7px); }
.side-player .opponent-hand .playing-card { flex:0 0 34px; margin-left:0; margin-top:-22px; }
.side-player .opponent-hand .playing-card:first-child { margin-top:0; }
.played-slot { position:absolute; z-index:100; left:50%; top:50%; width:58px; min-height:82px; transform:translate(calc(-50% + var(--play-x,0px)),calc(-50% + var(--play-y,0px))); }
.played-slot .playing-card { width:58px; height:82px; padding:6px; font-size:1rem; }
.played-slot .lead-card-badge { display:block; width:max-content; margin:7px auto 0; }
.player-hand-title { margin:10px 0 0; text-align:center; }
.player-hand-row { position:relative; z-index:8; min-height:82px; padding:3px 16px 5px; border-top:1px solid var(--line); background:rgba(16,34,31,.96); }
.player-hand-row.hand { overflow:visible; }
.player-hand-row.hand .playing-card:hover,.player-hand-row.hand .playing-card.selected { position:relative; z-index:50; }
.ohhell-game .hand-card-group { display:flex; gap:5px; border-radius:11px; }
.ninety-nine-game .hand-card-group { display:flex; gap:5px; border-radius:11px; }
.ohhell-game .bid-button-group { display:flex; gap:7px; border-radius:11px; }
.ohhell-game .player-hand-row.active-turn .hand-card-group,.ohhell-game .board > .bid-buttons.active-turn .bid-button-group { outline:3px solid var(--gold); outline-offset:4px; }
.ninety-nine-game .player-hand-row.active-turn .hand-card-group { outline:3px solid var(--gold); outline-offset:4px; }
.pinochle-game .player-hand-row.active-turn .hand-card-group,.pinochle-game .phase-controls.active-turn .phase-control-group { outline:3px solid var(--gold); outline-offset:4px; }
#round-label,#deal-label { position:absolute; z-index:7; left:14px; bottom:14px; margin:0; color:rgba(255,255,255,.7); font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; }
.table-cards { display:flex; justify-content:center; align-items:center; min-height:135px; gap:8px; }
.trick-play { display:flex; flex-direction:column; align-items:center; gap:6px; color:var(--ink); font-size:.68rem; font-weight:700; }
.trick-play.led { box-shadow:0 0 0 2px var(--gold); border-radius:10px; padding:4px; }
.lead-badge { display:inline-block; padding:1px 6px; border-radius:999px; font-size:.56rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#15130e; background:var(--gold); }
.dealer { margin:4px 0 12px; color:var(--gold); }
.playing-card.card-back {
  border: 5px solid #f4ead3;
  background-color: #173f66;
  background-image: repeating-linear-gradient(45deg,transparent 0 7px,rgba(255,255,255,.2) 7px 9px),repeating-linear-gradient(-45deg,transparent 0 7px,rgba(255,255,255,.12) 7px 9px);
  box-shadow: inset 0 0 0 2px #173f66,0 7px 17px rgba(0,0,0,.35);
}
.controls { display:flex; justify-content:center; gap:10px; min-height:45px; margin:10px 0; }
.blackjack-controls.actions-active { display:grid; grid-template-columns:88px 96px 180px 90px; justify-content:center; align-items:stretch; }
.blackjack-controls.actions-active #hit { grid-column:1; }
.blackjack-controls.actions-active #stand { grid-column:2; }
.blackjack-controls.actions-active #double { grid-column:3; }
.blackjack-controls.actions-active #split { grid-column:4; }
.config { width:min(560px,100%); margin:18px auto; border-collapse:collapse; text-align:left; background:rgba(0,0,0,.18); }
.config th,.config td { padding:12px; border-bottom:1px solid var(--line); }
.config th { color:var(--muted); font-size:.75rem; font-weight:500; }
.choice { display:flex; flex-wrap:wrap; gap:7px; }
.choice label { margin:0; padding:8px 10px; border:1px solid var(--line); border-radius:7px; cursor:pointer; }
.choice input { min-width:auto; margin-right:6px; }
.bid-buttons { display:flex; justify-content:center; flex-wrap:wrap; gap:7px; }
.bid-buttons button:disabled { opacity:.25; cursor:not-allowed; }
.ohhell-game .bid-button-group .selected-bid:disabled { opacity:1; }
.board > .bid-buttons { height:64px; min-height:64px; padding:8px 16px; align-items:center; border-top:1px solid var(--line); background:rgba(16,34,31,.96); }
.trump { display:inline-flex; vertical-align:middle; margin-left:8px; }
.trump .playing-card { width:45px;height:64px;font-size:.9rem; }
.result-table { width:min(600px,100%); margin:15px auto; border-collapse:collapse; }
.result-table td { padding:7px; border-bottom:1px solid rgba(255,255,255,.08); }
.blackjack-results { position:absolute; z-index:5; top:50%; right:18px; width:min(340px,calc(100% - 36px)); max-height:calc(100% - 36px); margin:0; padding:16px; overflow-y:auto; border:1px solid rgba(255,255,255,.18); border-radius:12px; background:rgba(8,24,21,.82); box-shadow:0 16px 45px rgba(0,0,0,.35); backdrop-filter:blur(9px); transform:translateY(-50%); text-align:left; pointer-events:none; }
.blackjack-results h2 { margin:0; font-size:1.35rem; }
.result-dealer { margin:3px 0 12px; color:var(--muted); font-size:.8rem; }
.result-row { display:grid; grid-template-columns:1fr 42px 94px; align-items:center; gap:9px; padding:9px 0; border-top:1px solid rgba(255,255,255,.09); }
.result-row.me { color:var(--gold); }
.outcome { padding:5px 8px; border-radius:999px; text-align:center; font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; }
.outcome.win { color:#b8f0d2; background:rgba(50,160,105,.2); }
.outcome.loss { color:#ffb5b2; background:rgba(205,75,72,.2); }
.outcome.push { color:#eee3c5; background:rgba(224,184,108,.18); }
.bid-panel { width:min(620px,100%); margin:10px auto; padding:14px; border:1px solid var(--line); border-radius:12px; background:rgba(0,0,0,.18); }
.bid-panel p { margin-bottom:9px; }
.board > .bid-panel { width:100%; margin:0; border-width:1px 0 0; border-radius:0; background:rgba(16,34,31,.96); }
.board > .bid-panel:not(.hidden) { display:grid; grid-template-columns:minmax(190px,1fr) auto minmax(360px,1fr); align-items:center; gap:18px; padding-block:8px; }
.board > .bid-panel .bid-summary { display:flex; align-items:center; gap:12px; min-width:max-content; text-align:left; white-space:nowrap; }
.board > .bid-panel .bid-summary p { display:block; margin:0; }
.board > .bid-panel .bid-summary .bid-total { white-space:nowrap; }
.board > .bid-panel .bid-ten-toggle { display:inline-flex; align-items:center; margin:0; padding:6px 8px; border:1px solid var(--line); border-radius:7px; color:var(--muted); cursor:pointer; white-space:nowrap; }
.board > .bid-panel .bid-ten-toggle input { min-width:auto; margin:0 6px 0 0; }
.board > .bid-panel #submit-bid { justify-self:center; }
.board > .bid-panel #submit-bid:disabled { color:var(--muted); background:rgba(255,255,255,.12); opacity:.65; cursor:not-allowed; }
#submit-pass:disabled { color:var(--muted); background:rgba(255,255,255,.12); opacity:.65; cursor:not-allowed; }
.bid-code { display:flex; justify-content:center; gap:14px; color:var(--muted); font-size:.75rem; }
.bid-total { margin-top:10px; color:var(--gold); }
.premium-choice { justify-content:center; margin:10px 0; }
.board > .bid-panel .premium-choice { justify-content:flex-end; margin:0; }
.board > .bid-panel .premium-choice label { padding:7px 8px; white-space:nowrap; }
.hand .playing-card.selected { transform:translateY(-12px); box-shadow:0 0 0 3px #5aa9ff,0 14px 22px rgba(0,0,0,.45); }
.table-cards.compact { min-height:80px; }
.table-cards.compact .playing-card { width:44px; height:64px; font-size:.85rem; }
.target-setup { display:flex; justify-content:center; align-items:end; gap:8px; margin:12px 0; }
.target-setup label { margin:0 0 11px; }
.target-setup input { flex:0 0 100px; }
.setup-actions { display:flex; justify-content:center; gap:9px; }
.compact-number { flex:0 0 74px; width:74px; padding:9px; }
#setup > label[for="max-rounds"] { display:inline-block; margin:8px 8px 4px; }
#setup > #max-rounds { display:inline-block; vertical-align:middle; }
.corner-leaderboard { position:absolute; z-index:6; right:14px; bottom:14px; width:150px; padding:8px 10px; border:1px solid var(--line); border-radius:9px; background:rgba(7,23,20,.88); font-size:.67rem; text-align:left; }
.corner-leaderboard::before { content:"Points"; display:block; margin-bottom:4px; color:var(--gold); font-size:.58rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.corner-leaderboard > div { display:flex; justify-content:space-between; gap:8px; padding:2px 0; }
.corner-leaderboard strong { color:var(--ink); }
.match-history-panel { position:absolute; z-index:9; top:14px; right:14px; width:min(310px,calc(100% - 28px)); padding:10px; border:1px solid rgba(224,184,108,.65); border-radius:10px; color:var(--ink); background:rgba(7,23,20,.94); box-shadow:0 12px 34px rgba(0,0,0,.36); text-align:left; }
.match-history-heading { display:flex; justify-content:space-between; align-items:center; color:var(--gold); font-size:.65rem; letter-spacing:.09em; text-transform:uppercase; }
.match-history-toggle { padding:0; border:0; color:var(--gold); background:transparent; box-shadow:none; font:inherit; letter-spacing:inherit; text-transform:inherit; }
.match-history-heading span { color:var(--muted); font-size:.55rem; }
.match-history-tabs { display:flex; gap:5px; margin:8px 0; overflow-x:auto; }
.match-history-tabs button { min-width:max-content; padding:4px 7px; border:1px solid var(--line); color:var(--muted); background:rgba(255,255,255,.05); font-size:.62rem; }
.match-history-tabs button.selected { color:#15130e; background:var(--gold); }
.match-history-detail .result-row { grid-template-columns:1fr 36px 72px; padding:5px 0; font-size:.68rem; }
.match-history-detail .outcome { padding:3px 5px; font-size:.55rem; }
.match-history-detail .result-dealer { margin:6px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.match-history-panel.collapsed { width:auto; }
.match-history-panel.collapsed .match-history-tabs,.match-history-panel.collapsed .match-history-detail,.match-history-panel.collapsed .match-history-heading span { display:none; }
.ohhell-game.game-finished #setup { position:absolute; z-index:10; top:14px; left:50%; transform:translateX(-50%); }
.ohhell-game.game-finished #setup .config,.ohhell-game.game-finished #fill-bots,.ohhell-game.game-finished #setup > label,.ohhell-game.game-finished #setup > input { display:none; }
.corner-round-tally { position:absolute; z-index:6; left:14px; bottom:38px; width:190px; padding:7px 9px; border:1px solid var(--line); border-radius:9px; background:rgba(7,23,20,.88); font-size:.64rem; text-align:left; }
.round-tally-title { display:block; margin-bottom:3px; color:var(--gold); font-size:.56rem; letter-spacing:.1em; text-transform:uppercase; }
.round-tally-row { display:grid; grid-template-columns:minmax(0,1fr) 45px 34px; gap:5px; padding:1px 0; color:var(--ink); }
.round-tally-row span:first-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.round-tally-row span:not(:first-child) { text-align:right; font-weight:800; }
.round-tally-header { color:var(--muted); font-size:.54rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.pinochle-game .corner-round-tally { width:230px; }
.chat-panel #notice { order:0; min-height:0; margin:0; padding:10px 14px; border-bottom:1px solid var(--line); color:var(--muted); font-size:.75rem; }
.chat-panel #notice::before { content:'Dealer: '; color:var(--gold); font-weight:700; }
.mobile-game-status { display:none; }
.game-text-toggle { color:var(--muted); font-size:.68rem; white-space:nowrap; }
.game-text-toggle input { min-width:auto; margin-right:4px; }
#trump { position:absolute; z-index:6; top:14px; left:14px; min-width:44px; color:var(--gold); font-size:2.2rem; line-height:1; text-align:left; }
#trump .trump-label { display:block; margin-bottom:3px; font-size:.58rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
#trump .playing-card { width:44px; height:62px; padding:4px; font-size:.82rem; }
.contract-piles { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin:12px 0; }
.contract-piles:empty { display:none; }
.contract-pile { min-width:112px; padding:7px; border:1px solid var(--line); border-radius:9px; background:rgba(0,0,0,.16); color:var(--muted); font-size:.66rem; }
.player-contract { position:absolute; z-index:30; top:calc(100% + 4px); left:50%; width:max-content; margin:0; transform:translateX(-50%); }
.table-players .self-player .player-contract { top:auto; bottom:-68px; left:50%; transform:translate(-50%,-100%); }
.ninety-nine-game .table-players .self-player .player-contract { bottom:-132px; }
.table-bid-code { display:block; color:var(--gold); font-size:.72rem; font-weight:800; line-height:1.5; white-space:nowrap; }
.contract-cards { display:flex; justify-content:center; margin-top:6px; }
.contract-cards .playing-card { width:34px; height:49px; margin-left:-10px; padding:4px; font-size:.65rem; }
.contract-cards .playing-card:first-child { margin-left:0; }
.table-hands { display:flex; justify-content:center; flex-wrap:wrap; gap:9px; margin:12px 0; }
.table-hand { position:relative; min-width:130px; margin-top:20px; padding:8px; border:1px solid var(--line); border-radius:10px; color:var(--muted); background:rgba(0,0,0,.16); font-size:.68rem; }
.table-hand > span { position:absolute; bottom:calc(100% + 5px); left:0; width:100%; color:var(--ink); text-align:center; }
.table-hand.active { border-color:var(--gold); color:var(--ink); }
.blackjack-hand { position:relative; min-width:58px; padding:4px 6px 6px; border:1px solid transparent; border-radius:8px; }
.blackjack-hands { display:flex; justify-content:center; gap:6px; }
#hand .blackjack-hand.active { border-color:var(--gold); box-shadow:0 0 0 2px rgba(224,184,108,.16); }
.blackjack-hand.bust { border-color:rgba(205,75,72,.75); }
.blackjack-hand-label { display:flex; justify-content:center; gap:6px; min-height:16px; color:var(--muted); font-size:.62rem; }
.hand-score { color:var(--gold); font-weight:800; white-space:nowrap; }
.hand-score.bust { color:#ff8f89; }
#hand { gap:10px; }
#hand .blackjack-hand { padding:5px 9px 8px; }
#hand .blackjack-hand .table-cards { min-height:0; }
.mini-cards { display:flex; justify-content:center; margin-top:7px; }
.mini-cards .playing-card { width:38px; height:55px; margin-left:-13px; padding:4px; font-size:.72rem; }
.mini-cards .playing-card:first-child { margin-left:0; }
.last-trick { min-height:70px; margin:6px auto 12px; color:var(--muted); font-size:.66rem; }
.last-trick-cards { display:flex; justify-content:center; gap:4px; margin-top:5px; }
.last-trick-card { display:flex; flex-direction:column; align-items:center; gap:3px; }
.last-trick-card .playing-card { width:32px; height:46px; padding:3px; font-size:.62rem; }
.shell:has(> .room-grid:not(.hidden)) { height:100dvh; display:flex; flex-direction:column; overflow:hidden; }
.shell:has(> .room-grid:not(.hidden)) > header { flex:0 0 auto; }
.room-grid:not(.hidden) { flex:1 1 auto; min-height:0; }
.room-grid:not(.hidden) > .board { display:flex; min-height:0; flex-direction:column; }
.room-grid:not(.hidden) .playfield { flex:1 1 auto; min-height:0; height:auto; }
.room-grid:not(.hidden) .player-hand-row,.room-grid:not(.hidden) .board > .bid-buttons,.room-grid:not(.hidden) .board > .bid-panel { flex:0 0 auto; }
.room-grid:not(.hidden) > .chat-panel { min-height:0; }
.room-grid:not(.hidden) > .chat-panel .messages { min-height:0; max-height:none; }
@media(max-width:900px){.room-grid{grid-template-columns:1fr}.chat-panel{min-height:350px}.playfield{padding-inline:130px}.table-players .player-zone{width:125px}}
.phase-controls { min-height:64px; padding:8px 16px; border-top:1px solid var(--line); background:rgba(16,34,31,.96); display:flex; align-items:center; justify-content:center; }
.phase-control-group { display:flex; align-items:center; justify-content:center; gap:8px; width:max-content; border-radius:11px; }
.phase-control-group button { padding:9px 14px; }
.phase-control-group .pass-button { color:var(--ink); background:#d7d4ca; }
.pinochle-game .phase-control-group .pass-button { color:var(--muted); border:1px solid var(--line); background:rgba(255,255,255,.06); box-shadow:none; }
.pinochle-game .hand-card-group { display:flex; gap:5px; border-radius:11px; }
.pinochle-game .team-label { color:var(--gold); font-size:.58rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.pinochle-game .auction-status { flex-basis:100%; color:var(--ink); font-size:.68rem; }
.pinochle-game .meld-summary { position:absolute; z-index:6; top:14px; left:14px; max-width:270px; color:var(--gold); font-size:.66rem; text-align:left; }
.pinochle-game .meld-summary strong { display:block; margin-bottom:3px; text-transform:uppercase; letter-spacing:.1em; }
.pinochle-game .meld-summary span { display:block; color:var(--muted); }
.pinochle-game .received-card { border-color:#63d69a; box-shadow:0 0 0 2px #63d69a,0 7px 17px rgba(0,0,0,.35); }
.meld-guide { position:absolute; z-index:8; top:64px; right:14px; width:82px; height:116px; padding:8px; overflow:hidden; border:1px solid var(--line); border-radius:9px; color:var(--muted); background:rgba(7,23,20,.92); box-shadow:0 8px 22px rgba(0,0,0,.25); text-align:left; transition:width .16s ease,height .16s ease; }
.meld-guide.expanded { width:270px; height:282px; }
.meld-guide-heading { display:flex; align-items:center; gap:4px; }
.meld-guide-heading strong { flex:1; color:var(--gold); font-size:.56rem; line-height:1.2; letter-spacing:.08em; text-transform:uppercase; }
.meld-guide-heading button { min-width:22px; padding:2px 5px; border:1px solid var(--line); color:var(--muted); background:rgba(255,255,255,.06); font-size:.75rem; }
.meld-guide:not(.expanded) #meld-collapse,.meld-guide.expanded #meld-expand { display:none; }
.meld-guide-body { display:none; margin-top:7px; font-size:.66rem; }
.meld-guide.expanded .meld-guide-body { display:grid; gap:4px; }
.meld-guide-body span { display:flex; justify-content:space-between; gap:10px; }
.meld-guide-body b { color:var(--ink); white-space:nowrap; }

/* Whether trump has been broken yet, alongside the trump card itself. */
#broken { display:inline-block; margin-left:10px; font:800 .68rem/1.4 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.08em; text-transform:uppercase; }
#broken.broken-yes { color:#63df8a; }
#broken.broken-no { color:#e0b86c; opacity:.85; }

/* Mobile tables trade the radial desktop diagram for a vertical, touch-safe flow. */
@media (max-width:820px) {
  .shell:has(> .room-grid:not(.hidden)) { width:100%; height:auto; min-height:100dvh; padding:8px; overflow:visible; display:block; }
  .room-grid,.room-grid:not(.hidden) { display:block; }
  .room-grid:not(.hidden) > .board { display:block; overflow:visible; border-radius:12px; }
  .playfield,.room-grid:not(.hidden) .playfield { display:flex; flex-direction:column; gap:8px; width:100%; height:auto; min-height:0; padding:10px; overflow:visible; }
  .players-list:not(.table-players) { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:8px; }
  .players-list:not(.table-players) .player-chip { min-width:0; padding:8px; }
  .table-players {
    position:relative;
    order:7;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    inset:auto;
    width:100%;
    padding:0;
    pointer-events:none;
  }
  .table-players .player-zone {
    position:relative !important;
    left:auto !important;
    top:auto !important;
    display:flex;
    flex-direction:column;
    width:100%;
    min-height:116px;
    padding:7px;
    overflow:visible;
    transform:none !important;
  }
  .table-players .self-player { min-height:116px; padding:7px; color:var(--ink); background:rgba(8,28,24,.9); box-shadow:0 8px 22px rgba(0,0,0,.25); }
  .table-players .self-player .player-info { display:flex; }
  .table-players .self-player .opponent-hand { display:none; }
  .player-info { min-height:30px; align-content:flex-start; }
  .opponent-hand,.side-player .opponent-hand { position:static; display:flex; flex-direction:row; align-items:center; justify-content:center; width:100%; height:30px; min-height:30px; margin:4px 0 0; overflow:hidden; transform:none; }
  .left-player .opponent-hand,.right-player .opponent-hand { left:auto; right:auto; }
  .opponent-hand .playing-card,.side-player .opponent-hand .playing-card { flex:0 0 20px; width:20px; height:28px; margin:0 0 0 -12px; padding:0; }
  .opponent-hand .playing-card:first-child,.side-player .opponent-hand .playing-card:first-child { margin-left:0; margin-top:0; }
  .played-slot {
    position:static;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    width:100%;
    min-height:62px;
    margin-top:4px;
    transform:none;
  }
  .played-slot .playing-card { width:42px; height:59px; padding:4px; font-size:.78rem; }
  .played-slot .lead-card-badge { margin-top:3px; }
  .player-contract,.table-players .self-player .player-contract,.ninety-nine-game .table-players .self-player .player-contract { position:static; width:100%; margin:5px 0 0; transform:none; }
  .contract-cards { margin-top:3px; }
  .turn-status { position:static; order:1; width:100%; min-width:0; padding:8px 10px; border-radius:8px; }
  .mobile-game-status { display:block; order:2; min-height:34px; padding:8px 10px; border:1px solid rgba(255,255,255,.1); border-radius:8px; color:var(--muted); background:rgba(7,23,20,.8); font-size:.72rem; line-height:1.35; text-align:center; }
  #round-label,#deal-label { position:static; order:3; margin:0; text-align:left; }
  #trump { position:static; order:4; display:flex; align-items:center; gap:8px; min-height:32px; font-size:1rem; text-align:left; }
  #trump .trump-label { margin:0; }
  #broken { position:static; order:4; align-self:flex-start; margin:0; }
  .player-chip.active,.table-players .player-zone.active { outline:3px solid var(--gold); outline-offset:2px; box-shadow:none; }
  .pinochle-game .meld-summary { position:static; order:4; max-width:none; text-align:left; }
  .corner-leaderboard { position:static; order:5; width:100%; }
  .corner-round-tally,.pinochle-game .corner-round-tally { position:static; order:6; width:100%; }
  #setup,#game-setup { order:8; }
  .ohhell-game.game-finished #setup { position:static; transform:none; }
  #trick,#dealer-hand,#table-hands,#revealed,#contracts,.last-trick { order:9; }
  .table-cards { justify-content:flex-start; min-height:92px; padding:5px; overflow-x:auto; overflow-y:visible; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
  .table-cards .playing-card { flex:0 0 54px; width:54px; height:78px; padding:6px; font-size:1rem; scroll-snap-align:center; }
  .table-hands { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin:0; }
  .table-hand { min-width:0; padding:6px; }
  .mini-cards { overflow:hidden; }
  .controls,.target-setup,.setup-actions { flex-wrap:wrap; width:100%; }
  .controls { order:10; margin:3px 0; }
  .controls button,.target-setup button,.setup-actions button,.phase-controls button { min-height:44px; }
  .config { margin:4px 0; }
  .config tr { display:block; }
  .config th,.config td { display:block; padding:8px; }
  .choice { display:grid; grid-template-columns:1fr; }
  .choice label { min-height:44px; }
  .match-history-panel { position:static; order:11; width:100%; }
  .blackjack-results { position:static; order:12; width:100%; margin:0; padding:12px; transform:none; pointer-events:auto; }
  .result-row { grid-template-columns:minmax(0,1fr) 36px 78px; gap:6px; }
  .board > .bid-panel:not(.hidden) { display:flex; flex-direction:column; align-items:stretch; gap:9px; padding:9px; }
  .board > .bid-panel .bid-summary { display:flex; flex-wrap:wrap; min-width:0; white-space:normal; }
  .board > .bid-panel .premium-choice { display:grid; grid-template-columns:1fr; width:100%; }
  .board > .bid-panel #submit-bid { align-self:stretch; }
  .board > .bid-buttons { justify-content:flex-start; flex-wrap:nowrap; height:auto; min-height:60px; overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; }
  .ohhell-game .bid-button-group { flex:0 0 max-content; width:max-content; padding:5px; }
  .phase-controls { min-height:60px; padding:8px; overflow-x:auto; justify-content:flex-start; }
  .phase-control-group { flex:0 0 max-content; width:max-content; margin:auto; }
  .player-hand-row { position:sticky; z-index:150; bottom:0; width:100%; min-height:96px; padding:5px 10px max(8px,env(safe-area-inset-bottom)); overflow-x:auto !important; overflow-y:visible !important; overscroll-behavior-x:contain; scrollbar-width:thin; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; box-shadow:0 -10px 24px rgba(0,0,0,.35); }
  .player-hand-row .hand-card-group { flex:0 0 max-content; width:max-content; padding:5px; }
  .player-hand-row .playing-card { flex:0 0 58px; width:58px; height:84px; scroll-snap-align:center; }
  .player-hand-row .playing-card:hover { transform:none; }
  .player-hand-row .playing-card:active:not(:disabled),.player-hand-row .playing-card.selected { transform:translateY(-6px); }
  .chat-panel { min-height:0; margin-top:10px; }
  .chat-heading { padding:10px 12px; }
  .messages { min-height:80px; max-height:180px !important; padding:10px 12px; }
  .chat-form { position:sticky; bottom:0; padding:8px; background:rgba(15,19,19,.98); }
  .meld-guide,.meld-guide.expanded { position:static; order:4; width:100%; height:auto; max-height:none; }
  .meld-guide:not(.expanded) .meld-guide-body { display:none; }
  .meld-guide.expanded .meld-guide-body { display:grid; }
}

@media (max-width:430px) {
  .table-players .player-zone { min-height:110px; font-size:.68rem; }
  .player-hand-row .playing-card { flex-basis:56px; width:56px; height:82px; }
  .table-hands { grid-template-columns:1fr; }
}