:root {
  --ink: #15232d;
  --panel: #2f4d62;
  --panel-deep: #1b3e51;
  --panel-light: #65839a;
  --line: #87a0b3;
  --paper: #edf1ef;
  --cream: #fff6d8;
  --gold: #ffbf55;
  --gold-deep: #dd922c;
  --pink: #d47bb0;
  --green: #245b4f;
  --green-2: #173f37;
  --red: #bd3d43;
  --blue: #36a4cf;
  --shadow: 0 12px 30px rgba(10, 23, 31, .22);
  --radius: 4px;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font-family: Verdana, Arial, sans-serif;
  background: linear-gradient(#dde6e8 0 64%, #f6f2db 64% 100%);
  color: #f7fbfd;
  font-size: 13px;
}
a { color: inherit; }
button, input, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .42; filter: grayscale(.35); }
.hidden { display: none !important; }
.muted { color: #bdccd5; line-height: 1.55; }

.topbar {
  height: 66px;
  padding: 0 18px;
  background: #2f4d62;
  border-bottom: 2px solid #1f3848;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  box-shadow: 0 2px 0 rgba(255,255,255,.15) inset;
}
.brand-lockup { display: flex; align-items: center; gap: 11px; }
.brand-lockup strong { display: block; font-family: Georgia, serif; font-size: 20px; letter-spacing: .2px; text-shadow: 1px 1px 0 #173243; }
.brand-lockup small { display: block; color: #ffcf62; letter-spacing: 2px; font-size: 9px; margin-top: 2px; }
.brand-orb {
  width: 46px; height: 46px; border-radius: 50%;
  background: #4dbd84; border: 4px solid #dff4e8;
  display: grid; place-items: center; color: white; font: 700 28px/1 Georgia, serif;
  text-decoration: none; box-shadow: 0 1px 0 rgba(0,0,0,.35);
}
.brand-lockup.compact .brand-orb { width: 40px; height: 40px; font-size: 23px; }
.top-stats { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.stat-pill, .top-link {
  min-height: 30px; padding: 6px 11px; border: 1px solid #1d3a4b; background: #f8fbf8; color: #294456;
  border-radius: 2px; text-decoration: none; box-shadow: inset 0 1px rgba(255,255,255,.8); display: inline-flex; align-items: center;
}
.stat-pill b { color: #8d641b; margin-right: 4px; }
.stat-pill.player { background: #e5edf0; font-weight: 700; }
.top-link { background: #ffc95d; border-color: #d69f3f; }
.top-link.logout { background: #ffdd99; }
.danger-link { background: #efaaaa; color: #6f1f22; border-color: #bb6c6f; }

.navstrip {
  height: 34px; padding: 0 18px; display: flex; align-items: center; gap: 6px;
  background: #23465b; border-bottom: 1px solid #173444; box-shadow: inset 0 1px #547185;
}
.nav-chip { padding: 5px 12px; color: #183444; background: #9ec48a; border: 1px solid #1b4253; border-radius: 2px 2px 0 0; }
.nav-chip:nth-child(2) { background: #d8d49d; }
.nav-chip:nth-child(3) { background: #dc8dbb; }
.nav-chip.active { box-shadow: 0 -2px 0 rgba(255,255,255,.3) inset; }
.nav-spacer { flex: 1; }
.online-dot { width: 8px; height: 8px; background: #58d885; border-radius: 50%; box-shadow: 0 0 0 2px #1a3444; }

.hh-panel {
  background: var(--panel);
  border: 1px solid #1d3d50;
  border-radius: var(--radius);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.17), var(--shadow);
}

.lobby-shell { width: min(1160px, calc(100% - 28px)); margin: 20px auto 90px; position: relative; z-index: 2; }
.lobby-hero { min-height: 150px; padding: 23px 26px; display: flex; align-items: center; justify-content: space-between; gap: 28px; background: linear-gradient(120deg, #2f4d62, #274457 65%, #1d3d50); }
.lobby-hero h1 { margin: 5px 0 9px; font-family: Georgia, serif; font-size: clamp(30px, 5vw, 48px); text-shadow: 2px 2px 0 #173243; }
.lobby-hero p { max-width: 670px; margin: 0; color: #d7e2e8; line-height: 1.55; }
.eyebrow { color: #ffcf65; text-transform: uppercase; font-weight: 700; letter-spacing: 1.5px; font-size: 10px; }
.cashier-card { width: 245px; padding: 15px; background: #f1f3ee; color: #29475a; border: 1px solid #9cafba; box-shadow: 5px 5px 0 #19394a; flex: 0 0 auto; }
.cashier-card small { display: block; text-transform: uppercase; color: #788b96; letter-spacing: 1px; }
.cashier-card strong { display: block; font-size: 20px; color: #bf7726; margin: 5px 0; }
.cashier-card span { font-size: 11px; line-height: 1.4; }

.tables-grid { margin-top: 14px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; align-items: stretch; }
.table-card { min-width: 0; padding: 12px; transition: transform .18s ease, box-shadow .18s ease; position: relative; overflow: hidden; }
.table-card:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.19), 0 17px 32px rgba(10,23,31,.28); }
.table-card::after { content: ''; position: absolute; width: 90px; height: 90px; right: -35px; top: -45px; border-radius: 50%; background: rgba(255,255,255,.04); }
.table-card-top { display: flex; justify-content: space-between; align-items: center; }
.floor-badge { display: grid; place-items: center; width: 34px; height: 28px; color: #24475a; font-weight: 900; background: #ffcb5d; border: 1px solid #d39c3b; }
.table-state { font-size: 10px; color: #cfdae0; }
.table-state.playing, .table-state.dealer { color: #ffcf65; }
.table-state.betting { color: #88e5ac; }
.table-illustration { height: 92px; margin: 10px -5px 5px; position: relative; display: grid; place-items: center; }
.mini-felt { width: 142px; height: 72px; border-radius: 50%; background: radial-gradient(circle at 50% 40%, #2f7b68, #1a4b41); border: 5px solid #b87f42; box-shadow: 0 6px 0 #593a23, inset 0 0 0 2px rgba(255,255,255,.08); display: grid; place-items: center; }
.mini-felt span { font: 700 32px Georgia, serif; color: rgba(255,244,199,.86); transform: rotate(-5deg); }
.mini-chairs i { width: 18px; height: 18px; border-radius: 50%; background: #1c3340; border: 2px solid #668297; position: absolute; }
.mini-chairs i:nth-child(1){left:20px;top:42px}.mini-chairs i:nth-child(2){left:52px;top:70px}.mini-chairs i:nth-child(3){left:93px;top:77px}.mini-chairs i:nth-child(4){right:52px;top:70px}.mini-chairs i:nth-child(5){right:20px;top:42px}
.table-card h2 { font: 700 19px Georgia, serif; margin: 4px 0 10px; }
.table-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; text-align: center; font-size: 9px; color: #c7d4da; }
.table-meta b { display: block; color: white; font-size: 12px; margin-bottom: 2px; }
.occupancy { height: 5px; margin: 10px 0; background: #1b3d50; border: 1px solid #173344; overflow: hidden; }
.occupancy span { display: block; height: 100%; background: #ffbe4f; width: 0; transition: width .3s ease; }
.occupancy-1 span{width:14.28%}.occupancy-2 span{width:28.57%}.occupancy-3 span{width:42.85%}.occupancy-4 span{width:57.14%}.occupancy-5 span{width:71.42%}.occupancy-6 span{width:85.71%}.occupancy-7 span{width:100%}
.table-card-actions { display: flex; gap: 8px; align-items: center; }
.joined-note { font-size: 9px; color: #8ce1aa; }

.btn { border: 1px solid #193b4d; min-height: 34px; padding: 7px 13px; border-radius: 3px; font-weight: 700; color: #213f51; background: #dce6e8; box-shadow: inset 0 1px rgba(255,255,255,.75), 0 1px 0 rgba(0,0,0,.18); transition: transform .1s ease, filter .15s ease, box-shadow .15s ease; }
.btn:hover:not(:disabled) { filter: brightness(1.06); box-shadow: inset 0 1px rgba(255,255,255,.85), 0 2px 4px rgba(0,0,0,.2); }
.btn:active:not(:disabled) { transform: translateY(1px); }
.btn.primary { background: #82bd68; border-color: #4e8240; color: #15380f; }
.btn.gold { background: #ffc55c; border-color: #c8882f; color: #59370b; }
.btn.ghost { background: #d8e1e4; color: #415965; }
.btn.danger { background: #d56f73; border-color: #9c4448; color: #4c1216; }
.btn.action { min-width: 85px; background: #dce8eb; }
.table-open {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  min-width: 92px;
}
.rules-strip { margin-top: 12px; padding: 10px; display: grid; grid-template-columns: repeat(5,1fr); gap: 6px; }
.rules-strip div { background: #25465a; border: 1px solid #173b4e; padding: 9px 10px; text-align: center; }
.rules-strip b, .rules-strip span { display: block; }
.rules-strip span { color: #c6d5dc; margin-top: 3px; font-size: 10px; }

.skyline { position: fixed; left: 0; right: 0; bottom: 0; height: 82px; background: #fcf8d6; display: flex; align-items: flex-end; gap: 0; z-index: 0; overflow: hidden; }
.skyline::before { content:''; position:absolute; inset:auto 0 0; height:15px; background:#173f52; }
.skyline i { display: block; width: 9%; background: #254d5f; margin-right: 4px; position: relative; }
.skyline i:nth-child(1){height:45px}.skyline i:nth-child(2){height:68px}.skyline i:nth-child(3){height:50px}.skyline i:nth-child(4){height:74px}.skyline i:nth-child(5){height:38px}.skyline i:nth-child(6){height:62px}.skyline i:nth-child(7){height:80px}.skyline i:nth-child(8){height:53px}.skyline i:nth-child(9){height:70px}.skyline i:nth-child(10){height:42px}.skyline i:nth-child(11){height:77px}.skyline i:nth-child(12){height:58px}
.skyline i::after { content:''; position:absolute; width:28%; height:100%; right:0; background:#183b4b; opacity:.65; }

/* Auth */
.auth-page { min-height: 100vh; display: grid; place-items: center; background: linear-gradient(155deg,#dbe6e6 0 55%,#fff5d4 55%); }
.auth-shell { width: min(420px, calc(100% - 30px)); }
.auth-card { padding: 26px; }
.auth-card h1 { font: 700 30px Georgia, serif; margin: 25px 0 5px; }
.stack-form { display: grid; gap: 12px; margin-top: 18px; }
.stack-form label, .admin-form label { display: grid; gap: 5px; color: #d4dfe4; font-size: 11px; font-weight: 700; }
input, select { width: 100%; background: #f5f6f2; border: 1px solid #8ba0ae; border-radius: 2px; min-height: 37px; padding: 8px 9px; color: #203a4a; outline: none; }
input:focus, select:focus { border-color: #ffbd4d; box-shadow: 0 0 0 2px rgba(255,189,77,.18); }
.auth-foot { margin: 18px 0 0; color: #c7d4da; }
.auth-foot a { color: #ffd06e; }
.alert { padding: 9px 11px; border-radius: 2px; margin: 12px 0; }
.alert.error { background: #793b40; border: 1px solid #a96165; color: #fff0f0; }
.alert.success { background: #356949; border: 1px solid #62a17a; color: #eefbf2; }

/* Blackjack table */
.table-page { height: 100vh; overflow: hidden; background: #223c4d; }
.game-layout { height: calc(100vh - 66px); display: grid; grid-template-columns: minmax(0,1fr) 300px; }
.game-stage { min-width: 0; display: grid; grid-template-rows: minmax(0,1fr) auto; background: linear-gradient(#d9e1e2, #f7f0d5); }
.table-chrome { margin: 8px 8px 0; min-height: 0; border: 1px solid #1d3d50; background: #2d4c61; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); display: grid; grid-template-rows: 38px minmax(0,1fr); }
.phasebar { padding: 0 12px; display: flex; align-items: center; justify-content: space-between; background: linear-gradient(#6f8da2,#58798f); border-bottom: 1px solid #25485c; text-shadow: 1px 1px 0 #39566a; }
.phasebar b { background: #274b5f; border: 1px solid #15394b; min-width: 46px; text-align: center; padding: 5px; color: #ffdb7b; font-size: 14px; }
.phasebar b.urgent { background: #8e4146; color: #fff; animation: pulse .65s infinite alternate; }
.felt-table { position: relative; min-height: 500px; overflow: hidden; background:
  radial-gradient(ellipse at 50% 43%, rgba(255,255,255,.08), transparent 40%),
  repeating-linear-gradient(135deg, rgba(255,255,255,.012) 0 2px, rgba(0,0,0,.014) 2px 4px),
  linear-gradient(#286456,#17473e);
  border: 14px solid #735033; box-shadow: inset 0 0 0 5px #ad7c49, inset 0 0 40px rgba(0,0,0,.25);
  border-radius: 0 0 46% 46% / 0 0 17% 17%;
}
.felt-table::before { content:''; position:absolute; inset:15px; border:2px solid rgba(232,205,134,.35); border-radius:0 0 48% 48%/0 0 18% 18%; pointer-events:none; }
.dealer-zone { position: absolute; left: 50%; top: 22px; transform: translateX(-50%); min-width: 280px; text-align: center; z-index: 4; }
.zone-label { display:block; color:#e6d6a9; font-size:10px; letter-spacing:3px; margin-bottom:7px; }
.cards-row, .hand-cards { display: flex; justify-content: center; align-items: flex-start; min-height: 88px; }
.playing-card {
  width: 58px; height: 82px; margin-left: -20px; background: #fffdf4; color: #17262e; border: 1px solid #a8a59b; border-radius: 5px;
  box-shadow: 0 4px 8px rgba(0,0,0,.26); position: relative; transform-origin: 50% 100%; flex: 0 0 auto;
}
.playing-card:first-child { margin-left: 0; }
.playing-card.red { color: #c53842; }
.corner { position: absolute; left: 4px; top: 3px; display:grid; justify-items:center; line-height:1; font-family: Georgia, serif; }
.corner b { font-size: 14px; }.corner span { font-size: 11px; }
.corner.bottom { left:auto; top:auto; right:4px; bottom:3px; transform:rotate(180deg); }
.suit-big { position:absolute; inset:0; display:grid; place-items:center; font-size:31px; }
.card-back { background: #f4eee1; border: 3px solid #f8f5ea; box-shadow: inset 0 0 0 2px #2f5670, inset 0 0 0 5px #d7a945, 0 4px 8px rgba(0,0,0,.26); }
.card-pattern { position:absolute; inset:8px; display:grid; place-items:center; background:repeating-linear-gradient(45deg,#274f67 0 3px,#416d86 3px 6px); color:#ffcc61; font:700 27px Georgia,serif; border:1px solid #173b50; }
.deal-in { animation: deal .32s cubic-bezier(.18,.82,.3,1.08) both; }
.score-badge { display:inline-grid; min-width:28px; height:23px; margin-top:5px; place-items:center; opacity:0; background:#f4e8bc; color:#2c493e; border:1px solid #a58b4d; font-weight:900; }
.score-badge.visible { opacity:1; }
.felt-logo { position:absolute; top:36%; left:50%; transform:translate(-50%,-50%); text-align:center; color:rgba(240,218,159,.56); pointer-events:none; }
.felt-logo span { width:54px; height:54px; margin:0 auto 6px; border:3px solid rgba(240,218,159,.48); border-radius:50%; display:grid; place-items:center; font:700 34px Georgia,serif; }
.felt-logo b { display:block; font:700 22px Georgia,serif; letter-spacing:3px; }
.felt-logo small { display:block; margin-top:7px; font-size:8px; letter-spacing:1px; }
.seats { position:absolute; inset:0; z-index:5; }
.seat { position:absolute; width:170px; text-align:center; transform:translate(-50%,-50%); }
.seat-1{left:90%;top:47%}.seat-2{left:81%;top:71%}.seat-3{left:63%;top:84%}.seat-4{left:50%;top:87%}.seat-5{left:37%;top:84%}.seat-6{left:19%;top:71%}.seat-7{left:10%;top:47%}
.avatar-chair { width:46px; height:46px; margin:0 auto 4px; border-radius:50% 50% 42% 42%; background:linear-gradient(#4b6f84,#2c4b5d); border:3px solid #9bb0bc; display:grid; place-items:center; position:relative; box-shadow:0 4px 0 #182e39; color:#ffe48c; font:700 19px Georgia,serif; }
.seat.you .avatar-chair { border-color:#ffc753; box-shadow:0 0 0 3px rgba(255,199,83,.18),0 4px 0 #182e39; }
.seat.empty { opacity:.48; }
.seat.empty .avatar-chair { border-style:dashed; box-shadow:none; }
.seat > strong { font-size:10px; text-shadow:1px 1px 1px #132b2a; max-width:150px; display:inline-block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.seat > small, .leaving { display:block; font-size:8px; color:#bed0d2; }
.leaving { color:#f3bb71; }
.pending-chip, .wager-chip { min-width:32px; height:22px; padding:4px 6px; border-radius:50%; background:#e4bb3f; color:#60410a; border:2px dashed #a57a1f; display:inline-grid; place-items:center; font-size:9px; font-weight:900; box-shadow:0 2px 3px rgba(0,0,0,.25); }
.pending-chip { position:absolute; right:-11px; top:-5px; }
.hands-wrap { min-height:95px; display:flex; justify-content:center; align-items:flex-end; gap:4px; margin-bottom:-3px; }
.player-hand { min-width:65px; position:relative; transition:filter .2s ease, transform .2s ease; }
.player-hand.current-hand { transform:translateY(-8px); filter:drop-shadow(0 0 7px rgba(255,215,91,.7)); }
.player-hand.lost, .player-hand.bust { filter:saturate(.6) brightness(.75); }
.player-hand.won, .player-hand.blackjack_win { filter:drop-shadow(0 0 6px rgba(122,243,158,.7)); }
.player-hand .playing-card { width:45px; height:65px; margin-left:-25px; border-radius:4px; }
.player-hand .playing-card:first-child { margin-left:0; }
.player-hand .corner b { font-size:11px; }.player-hand .corner span { font-size:9px; }.player-hand .suit-big { font-size:23px; }
.hand-meta { height:22px; margin-top:-2px; display:flex; align-items:center; justify-content:center; gap:3px; }
.hand-score { background:#243f4d; border:1px solid #132f3b; padding:2px 4px; font-weight:900; }
.hand-status { font-size:8px; background:rgba(19,46,52,.8); padding:2px 4px; color:#d7e3df; }
.result-credit { color:#8ff2aa; font-size:9px; font-weight:900; }

.action-dock { margin: 8px; min-height: 76px; padding: 10px; display:flex; align-items:center; justify-content:center; background:#2e4d62; }
.bet-controls, .play-controls, .insurance-controls { display:none; align-items:center; justify-content:center; gap:7px; flex-wrap:wrap; width:100%; }
.bet-controls.visible, .play-controls.visible, .insurance-controls.visible { display:flex; }
.chip { width:45px; height:45px; border-radius:50%; border:3px dashed #a9701c; background:#ffc34f; color:#5b3c0d; font-weight:900; box-shadow:0 3px 0 #72501f; }
.chip:nth-child(2){background:#e5797d;border-color:#a6484c}.chip:nth-child(3){background:#69b98f;border-color:#337854}.chip:nth-child(4){background:#77a9d7;border-color:#3b6f9e}.chip:nth-child(5){background:#d389c0;border-color:#95568a}
.chip.selected { transform:translateY(-4px); box-shadow:0 0 0 3px #fff0b3,0 5px 0 #72501f; }
.custom-bet { display:flex; align-items:center; gap:6px; color:#d3e0e6; font-size:10px; }
.custom-bet input { width:74px; min-height:34px; }

.side-panel { background:#23465a; border-left:1px solid #142f3e; display:grid; grid-template-rows:42px minmax(0,1fr) auto; min-height:0; }
.side-title { display:grid; place-items:center; font:700 18px Georgia,serif; background:#1f4053; border-bottom:1px solid #173546; box-shadow:inset 0 1px rgba(255,255,255,.12); }
.event-log { overflow:auto; padding:7px; min-height:0; }
.event-row { display:grid; grid-template-columns:60px 1fr; gap:7px; padding:7px 5px; border-bottom:1px solid rgba(255,255,255,.08); }
.event-row time { color:#b8d0dc; font-size:9px; text-align:right; }
.event-row span { line-height:1.35; }
.side-cashier { margin:8px; padding:11px; background:#f0f0e9; color:#2a495b; border:1px solid #8da4b2; }
.side-cashier b,.side-cashier span,.side-cashier strong { display:block; }
.side-cashier span { font-size:10px; margin:4px 0; color:#647d8a; }
.side-cashier strong { color:#b67222; font-size:16px; }
.toast { position:fixed; left:50%; bottom:96px; transform:translate(-50%,16px); padding:10px 14px; background:#173b4e; color:white; border:1px solid #7190a2; box-shadow:var(--shadow); opacity:0; pointer-events:none; transition:.2s ease; z-index:50; }
.toast.show { opacity:1; transform:translate(-50%,0); }.toast.error { background:#7b383e; border-color:#b66b70; }

/* Admin */
.admin-shell { width:min(1100px,calc(100% - 28px)); margin:18px auto 60px; display:grid; gap:14px; }
.admin-card { padding:18px; }.admin-card h1,.admin-card h2 { font-family:Georgia,serif; margin-top:0; }
.admin-form { display:grid; grid-template-columns:2fr 1fr 1fr 2fr auto; gap:8px; align-items:end; }
.admin-table-wrap { overflow:auto; }.admin-table { width:100%; border-collapse:collapse; background:#f3f4ef; color:#274657; }
.admin-table th,.admin-table td { padding:8px 9px; border:1px solid #a7b4bc; text-align:left; white-space:nowrap; }.admin-table th{background:#628096;color:white;}

@keyframes deal { from { opacity:0; transform:translate(120px,-130px) rotate(18deg) scale(.7); } to { opacity:1; transform:translate(0,0) rotate(0) scale(1); } }
@keyframes pulse { from { transform:scale(1); } to { transform:scale(1.08); } }

@media (max-width: 1120px) {
  .tables-grid { grid-template-columns: repeat(3,1fr); }
  .game-layout { grid-template-columns: minmax(0,1fr) 240px; }
  .seat { width:145px; }.seat-1{left:92%}.seat-7{left:8%}
  .admin-form { grid-template-columns:1fr 1fr; }.admin-form .btn{align-self:end}
}
@media (max-width: 820px) {
  body { font-size:12px; }
  .topbar { height:auto; min-height:60px; padding:8px 10px; }
  .brand-lockup strong { font-size:16px; }.stat-pill.player{display:none}
  .lobby-hero { flex-direction:column; align-items:stretch; }.cashier-card{width:auto}
  .tables-grid { grid-template-columns: repeat(2,1fr); }
  .rules-strip { grid-template-columns:repeat(2,1fr); }
  .table-page { height:auto; overflow:auto; }
  .game-layout { height:auto; display:block; }
  .game-stage { min-height:820px; }
  .side-panel { min-height:230px; }
  .felt-table { min-height:620px; border-width:9px; }
  .seat { width:110px; }.seat-1{left:90%;top:46%}.seat-2{left:82%;top:68%}.seat-3{left:66%;top:81%}.seat-4{left:50%;top:84%}.seat-5{left:34%;top:81%}.seat-6{left:18%;top:68%}.seat-7{left:10%;top:46%}
  .player-hand .playing-card { width:36px; height:53px; margin-left:-24px; }.hands-wrap{min-height:76px}.avatar-chair{width:38px;height:38px}
  .felt-logo small { display:none; }
}
@media (max-width: 560px) {
  .tables-grid { grid-template-columns:1fr; }
  .navstrip { display:none; }
  .lobby-shell { margin-top:10px; }
  .top-stats .stat-pill { padding:5px 7px; }.top-link{padding:5px 7px}
  .felt-table { min-height:690px; }
  .dealer-zone { top:14px; min-width:220px; }
  .felt-logo { top:30%; }.felt-logo b{font-size:17px}
  .seat { width:88px; }
  .seat-1{left:88%;top:44%}.seat-2{left:84%;top:63%}.seat-3{left:71%;top:78%}.seat-4{left:50%;top:84%}.seat-5{left:29%;top:78%}.seat-6{left:16%;top:63%}.seat-7{left:12%;top:44%}
  .seat > strong { max-width:82px; font-size:8px; }.hand-status{display:none}.result-credit{position:absolute;top:-8px;left:50%;transform:translateX(-50%)}
  .playing-card { width:50px;height:72px; }.action-dock{margin:6px}.btn.action{min-width:68px}
  .admin-form { grid-template-columns:1fr; }
}

/* --- Table chat + chip betting upgrade --- */
.chip-rack { display:flex; align-items:center; justify-content:center; gap:7px; }
.chip { position:relative; flex:0 0 auto; transition:transform .12s ease, box-shadow .12s ease, filter .12s ease; }
.chip-10 { background:#ffc34f !important; border-color:#a9701c !important; color:#5b3c0d !important; }
.chip-25 { background:#e5797d !important; border-color:#a6484c !important; color:#5b1e22 !important; }
.chip-50 { background:#69b98f !important; border-color:#337854 !important; color:#173f2a !important; }
.chip-100 { background:#77a9d7 !important; border-color:#3b6f9e !important; color:#183f66 !important; }
.chip-250 { background:#d389c0 !important; border-color:#95568a !important; color:#5f3159 !important; }
.chip-500 { background:#ef9a55 !important; border-color:#a85f29 !important; color:#5a2d0d !important; }
.chip-1000 { background:#8d83c7 !important; border-color:#574b91 !important; color:#282052 !important; }
.chip-2500 { background:#58b8b0 !important; border-color:#267a74 !important; color:#123e3a !important; }
.chip-5000 { background:#3d4650 !important; border-color:#d0a64c !important; color:#ffe291 !important; }
.chip-10000 { background:#eee5cf !important; border-color:#8f3f48 !important; color:#6c2730 !important; }
.chip[data-bet="1000"], .chip[data-bet="2500"], .chip[data-bet="5000"], .chip[data-bet="10000"] { font-size:9px; letter-spacing:-.35px; }
.mini-chip.chip-1000, .mini-chip.chip-2500, .mini-chip.chip-5000, .mini-chip.chip-10000 { font-size:5.5px; letter-spacing:-.35px; }
.chip.selected { transform:translateY(-5px) scale(1.04); box-shadow:0 0 0 3px #fff0b3,0 6px 0 #72501f; }
.chip:disabled.selected { transform:none; box-shadow:0 3px 0 #72501f; }

.bet-summary { min-width:82px; height:44px; padding:5px 10px; display:grid; place-items:center; align-content:center; background:#1f4053; border:1px solid #163446; box-shadow:inset 0 1px rgba(255,255,255,.08); }
.bet-summary small { font-size:7px; letter-spacing:1px; color:#a9c0cb; }
.bet-summary strong { color:#ffd064; font-size:16px; line-height:1.1; }

.chip-stack { display:flex; flex-direction:column; align-items:center; justify-content:center; pointer-events:none; }
.chip-pile { display:flex; align-items:center; justify-content:center; min-height:26px; }
.mini-chip { width:27px; height:27px; border-radius:50%; border:2px dashed rgba(65,43,15,.48); display:grid; place-items:center; flex:0 0 auto; font-size:7px; font-weight:900; box-shadow:0 2px 3px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.28); }
.mini-chip + .mini-chip { margin-left:-10px; }
.chip-overflow { min-width:24px; height:20px; margin-left:-8px; padding:0 4px; border-radius:10px; display:grid; place-items:center; background:#203f50; border:1px solid #7e9baa; color:#fff4c8; font-size:7px; font-weight:900; z-index:3; }
.chip-stack-total { margin-top:1px; padding:1px 4px; color:#ffe082; background:rgba(20,49,56,.9); border:1px solid rgba(255,218,123,.25); border-radius:2px; font-size:8px; line-height:1.25; font-weight:900; text-shadow:1px 1px #17312e; }
.seat-bet-stack { position:absolute; left:50%; bottom:43px; transform:translateX(-50%); z-index:9; min-width:88px; filter:drop-shadow(0 3px 2px rgba(0,0,0,.26)); }
.seat-bet-stack .chip-pile { animation:chip-stack-in .18s ease-out both; }
.hand-wager-stack { margin-right:2px; min-width:43px; }
.hand-wager-stack .mini-chip { width:20px; height:20px; font-size:6px; border-width:1px; }
.hand-wager-stack .mini-chip + .mini-chip { margin-left:-8px; }
.hand-wager-stack .chip-pile { min-height:20px; }
.hand-wager-stack .chip-stack-total { font-size:7px; }
.hand-meta { height:auto; min-height:28px; align-items:center; }

.side-tabs { display:grid; grid-template-columns:1fr 1fr; background:#1f4053; border-bottom:1px solid #173546; box-shadow:inset 0 1px rgba(255,255,255,.12); }
.side-tab { position:relative; border:0; border-right:1px solid rgba(255,255,255,.08); background:transparent; color:#b9ced8; font:700 14px Georgia,serif; transition:background .15s ease,color .15s ease; }
.side-tab:last-child { border-right:0; }
.side-tab:hover { background:rgba(255,255,255,.05); color:white; }
.side-tab.active { background:#2b5369; color:white; box-shadow:inset 0 -3px #ffc75a; }
.chat-unread { position:absolute; top:5px; right:7px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; display:none; place-items:center; background:#e36f77; border:1px solid #8d3f45; color:white; font:700 9px Verdana,Arial,sans-serif; }
.chat-unread.visible { display:grid; }
.side-content { min-height:0; overflow:hidden; position:relative; }
.side-view { display:none; width:100%; height:100%; }
.side-view.active { display:block; animation:side-view-in .14s ease both; }
.event-log.side-view { overflow:auto; padding:7px; min-height:0; }
.table-chat { overflow:auto; padding:7px 7px 10px; background:linear-gradient(rgba(255,255,255,.015),rgba(0,0,0,.035)); }
.chat-empty { padding:18px 10px; text-align:center; color:#9bb4c0; font-size:10px; }
.chat-row { padding:7px 7px 8px; border-bottom:1px solid rgba(255,255,255,.07); }
.chat-row.mine { background:rgba(255,199,83,.045); }
.chat-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:3px; }
.chat-meta strong { max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#ffd06b; font-size:10px; }
.chat-row.mine .chat-meta strong { color:#8de1aa; }
.chat-meta time { color:#8fa9b5; font-size:8px; }
.chat-message { color:#eef5f6; font-size:11px; line-height:1.4; overflow-wrap:anywhere; white-space:normal; }
.chat-composer { display:grid; grid-template-columns:minmax(0,1fr) 58px; gap:5px; padding:7px; background:#1d3d50; border-top:1px solid #153140; }
.chat-composer input { min-height:34px; height:34px; padding:6px 8px; font-size:10px; background:#f4f4ef; }
.chat-send { min-height:34px; border:1px solid #c88c31; background:#ffc65d; color:#5c3a0b; font-weight:900; box-shadow:inset 0 1px rgba(255,255,255,.5); }
.chat-send:hover:not(:disabled) { filter:brightness(1.05); }

@keyframes chip-stack-in { from { opacity:0; transform:translateY(5px) scale(.92); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes side-view-in { from { opacity:.35; transform:translateX(4px); } to { opacity:1; transform:translateX(0); } }

@media (max-width: 820px) {
  .chip-rack { gap:4px; }
  .chip { width:41px; height:41px; }
  .bet-summary { min-width:70px; }
  .chat-composer { grid-template-columns:minmax(0,1fr) 54px; }
}

@media (max-width: 560px) {
  .bet-controls { gap:5px; }
  .chip-rack { width:100%; }
  .chip { width:39px; height:39px; font-size:9px; }
  .bet-summary { height:38px; }
  .seat-bet-stack { bottom:37px; transform:translateX(-50%) scale(.86); }
}

/* --- Popup tables + tydelig håndafregning v2.3 --- */
.result-net {
  min-width:38px;
  padding:2px 5px;
  border-radius:2px;
  font-size:9px;
  font-weight:900;
  line-height:1.2;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 1px 3px rgba(0,0,0,.28);
}
.result-net.result-win { background:#247447; color:#eafff0; border-color:#67c986; text-shadow:1px 1px #155032; }
.result-net.result-loss { background:#963f45; color:#fff0f0; border-color:#dd777d; text-shadow:1px 1px #61282c; }
.result-net.result-push { background:#755f2d; color:#fff0bd; border-color:#c7a954; text-shadow:1px 1px #4b3c1c; }

.player-hand.outcome-win {
  filter:drop-shadow(0 0 9px rgba(72,224,122,.96));
  animation:hand-result-win .72s ease-in-out 2 alternate;
}
.player-hand.outcome-loss {
  filter:drop-shadow(0 0 9px rgba(239,82,90,.95)) saturate(.78) brightness(.9);
  animation:hand-result-loss .72s ease-in-out 2 alternate;
}
.player-hand.outcome-push {
  filter:drop-shadow(0 0 6px rgba(255,207,89,.72));
}
.player-hand.outcome-win .hand-status { background:#21683f; color:#eaffef; border:1px solid rgba(117,224,149,.45); }
.player-hand.outcome-loss .hand-status { background:#7e353b; color:#fff0f1; border:1px solid rgba(224,111,118,.45); }
.player-hand.outcome-push .hand-status { background:#69572d; color:#fff1bd; border:1px solid rgba(218,186,96,.4); }

.seat.seat-outcome-win .avatar-chair {
  border-color:#61d987;
  box-shadow:0 0 0 4px rgba(65,211,111,.18),0 0 16px rgba(65,211,111,.55),0 4px 0 #182e39;
}
.seat.seat-outcome-loss .avatar-chair {
  border-color:#e46e74;
  box-shadow:0 0 0 4px rgba(225,78,88,.16),0 0 16px rgba(225,78,88,.48),0 4px 0 #182e39;
}
.seat.seat-outcome-push .avatar-chair {
  border-color:#e0be63;
  box-shadow:0 0 0 3px rgba(226,190,89,.14),0 4px 0 #182e39;
}

.felt-table.round-win::after,
.felt-table.round-loss::after,
.felt-table.round-push::after {
  content:'';
  position:absolute;
  inset:8px;
  z-index:3;
  pointer-events:none;
  border-radius:0 0 47% 47% / 0 0 17% 17%;
  animation:table-result-flash .7s ease-in-out 2 alternate;
}
.felt-table.round-win::after { border:3px solid rgba(72,225,124,.68); box-shadow:inset 0 0 38px rgba(49,202,100,.18),0 0 18px rgba(49,202,100,.22); }
.felt-table.round-loss::after { border:3px solid rgba(237,88,96,.66); box-shadow:inset 0 0 38px rgba(211,58,68,.16),0 0 18px rgba(211,58,68,.2); }
.felt-table.round-push::after { border:2px solid rgba(234,197,94,.48); box-shadow:inset 0 0 30px rgba(224,182,64,.1); }

.round-result {
  position:absolute;
  left:50%;
  top:54%;
  z-index:12;
  min-width:220px;
  padding:10px 20px 11px;
  transform:translate(-50%,-50%) scale(.9);
  opacity:0;
  pointer-events:none;
  text-align:center;
  border:2px solid transparent;
  border-radius:4px;
  box-shadow:0 12px 28px rgba(5,24,25,.35);
  transition:opacity .18s ease,transform .18s cubic-bezier(.2,.9,.3,1.1);
}
.round-result.show { opacity:1; transform:translate(-50%,-50%) scale(1); }
.round-result strong { display:block; font:700 13px Georgia,serif; letter-spacing:2px; }
.round-result b { display:block; margin-top:2px; font:700 30px Georgia,serif; line-height:1.05; }
.round-result small { display:block; margin-top:4px; font-size:8px; letter-spacing:.5px; opacity:.85; }
.round-result.win { background:rgba(29,102,62,.96); border-color:#70dc91; color:#effff3; text-shadow:1px 1px #164f30; }
.round-result.loss { background:rgba(132,51,57,.96); border-color:#eb8388; color:#fff2f2; text-shadow:1px 1px #5e2529; }
.round-result.push { background:rgba(99,80,38,.96); border-color:#dfbf67; color:#fff3c6; text-shadow:1px 1px #463819; }

@keyframes hand-result-win { from { transform:translateY(0) scale(1); } to { transform:translateY(-3px) scale(1.035); } }
@keyframes hand-result-loss { from { transform:translateY(0); } to { transform:translateY(1px) scale(.985); } }
@keyframes table-result-flash { from { opacity:.42; } to { opacity:1; } }

@media (max-width:820px) {
  .round-result { top:47%; min-width:190px; padding:8px 14px; }
  .round-result b { font-size:24px; }
}

/* --- Responsiv multi-table visning + kompakt popup-layout v2.4 --- */
/*
   Et bord skal kunne spilles i et Windows-snap-vindue uden at blive klippet.
   De eksisterende mobile regler er lavet til en høj telefon. Når vinduet både
   er smalt OG lavt, beholder vi derfor desktop-layoutet og komprimerer det.
*/
@media (max-height: 720px) {
  .table-page {
    height: 100vh;
    min-height: 0;
    overflow: hidden;
    font-size: 11px;
  }

  .table-page .topbar {
    height: 50px;
    min-height: 50px;
    padding: 0 9px;
    gap: 8px;
    flex-wrap: nowrap;
  }
  .table-page .brand-lockup { gap: 7px; min-width: 0; }
  .table-page .brand-lockup.compact .brand-orb {
    width: 34px;
    height: 34px;
    border-width: 3px;
    font-size: 20px;
    flex: 0 0 auto;
  }
  .table-page .brand-lockup strong {
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 15px;
  }
  .table-page .brand-lockup small { font-size: 6px; letter-spacing: 1.35px; }
  .table-page .top-stats { gap: 5px; flex-wrap: nowrap; }
  .table-page .top-stats .stat-pill,
  .table-page .top-stats .top-link {
    min-height: 26px;
    padding: 4px 7px;
    font-size: 10px;
    white-space: nowrap;
  }
  .table-page .top-stats .stat-pill.player { display: none; }

  .table-page .game-layout {
    height: calc(100vh - 50px);
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(150px, 21vw, 220px);
    overflow: hidden;
  }
  .table-page .game-stage {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
  }
  .table-page .table-chrome {
    min-height: 0;
    margin: 4px 4px 0;
    grid-template-rows: 28px minmax(0, 1fr);
  }
  .table-page .phasebar { padding: 0 7px; font-size: 9px; }
  .table-page .phasebar b { min-width: 34px; padding: 2px 4px; font-size: 10px; }

  .table-page .felt-table {
    height: 100%;
    min-height: 0;
    border-width: 7px;
    border-radius: 0 0 42% 42% / 0 0 13% 13%;
  }
  .table-page .felt-table::before { inset: 7px; border-width: 1px; }
  .table-page .dealer-zone { top: 6px; min-width: 145px; }
  .table-page .zone-label { margin-bottom: 2px; font-size: 6px; letter-spacing: 2px; }
  .table-page .cards-row { min-height: 59px; }
  .table-page .dealer-zone .playing-card {
    width: 40px;
    height: 57px;
    margin-left: -14px;
    border-radius: 4px;
  }
  .table-page .dealer-zone .corner b { font-size: 10px; }
  .table-page .dealer-zone .corner span { font-size: 8px; }
  .table-page .dealer-zone .suit-big { font-size: 20px; }
  .table-page .dealer-zone .card-pattern { inset: 5px; font-size: 18px; }
  .table-page .score-badge { min-width: 23px; height: 18px; margin-top: 1px; font-size: 9px; }

  .table-page .felt-logo { top: 40%; transform: translate(-50%, -50%) scale(.72); }
  .table-page .felt-logo small { display: none; }

  .table-page .seat { width: 92px; }
  .table-page .seat-1 { left: 91%; top: 48%; }
  .table-page .seat-2 { left: 82%; top: 64%; }
  .table-page .seat-3 { left: 65%; top: 74%; }
  .table-page .seat-4 { left: 50%; top: 78%; }
  .table-page .seat-5 { left: 35%; top: 74%; }
  .table-page .seat-6 { left: 18%; top: 64%; }
  .table-page .seat-7 { left: 9%; top: 48%; }
  .table-page .avatar-chair {
    width: 30px;
    height: 30px;
    margin-bottom: 2px;
    border-width: 2px;
    font-size: 13px;
    box-shadow: 0 2px 0 #182e39;
  }
  .table-page .seat > strong {
    max-width: 88px;
    font-size: 7px;
    line-height: 1.1;
  }
  .table-page .seat > small,
  .table-page .leaving { font-size: 6px; }
  .table-page .hands-wrap { min-height: 50px; gap: 2px; margin-bottom: -2px; }
  .table-page .player-hand { min-width: 43px; }
  .table-page .player-hand.current-hand { transform: translateY(-4px); }
  .table-page .player-hand .playing-card {
    width: 29px;
    height: 42px;
    margin-left: -17px;
    border-radius: 3px;
  }
  .table-page .player-hand .corner { left: 2px; top: 2px; }
  .table-page .player-hand .corner.bottom { left: auto; top: auto; right: 2px; bottom: 2px; }
  .table-page .player-hand .corner b { font-size: 8px; }
  .table-page .player-hand .corner span { font-size: 7px; }
  .table-page .player-hand .suit-big { font-size: 15px; }
  .table-page .hand-meta { min-height: 17px; height: auto; gap: 2px; }
  .table-page .hand-score,
  .table-page .hand-status,
  .table-page .result-net { padding: 1px 3px; font-size: 6px; min-width: 0; }
  .table-page .seat-bet-stack {
    bottom: 29px;
    min-width: 62px;
    transform: translateX(-50%) scale(.68);
    transform-origin: 50% 100%;
  }
  .table-page .hand-wager-stack { transform: scale(.72); transform-origin: right center; margin-right: -5px; }

  .table-page .action-dock {
    min-height: 50px;
    margin: 4px;
    padding: 4px;
  }
  .table-page .bet-controls,
  .table-page .play-controls,
  .table-page .insurance-controls { gap: 4px; flex-wrap: nowrap; }
  .table-page .chip-rack { gap: 2px; flex-wrap: nowrap; }
  .table-page .chip {
    width: 30px;
    height: 30px;
    border-width: 2px;
    font-size: 7px;
    box-shadow: 0 2px 0 #72501f;
  }
  .table-page .chip[data-bet="1000"],
  .table-page .chip[data-bet="2500"],
  .table-page .chip[data-bet="5000"],
  .table-page .chip[data-bet="10000"] { font-size: 6px; letter-spacing: -.45px; }
  .table-page .chip.selected { transform: translateY(-2px) scale(1.03); box-shadow: 0 0 0 2px #fff0b3, 0 3px 0 #72501f; }
  .table-page .bet-summary { min-width: 50px; height: 31px; padding: 2px 5px; }
  .table-page .bet-summary small { font-size: 5px; letter-spacing: .5px; }
  .table-page .bet-summary strong { font-size: 10px; }
  .table-page .action-dock .btn {
    min-height: 28px;
    padding: 4px 7px;
    font-size: 8px;
    white-space: nowrap;
  }
  .table-page .btn.action { min-width: 50px; }
  .table-page .custom-bet { gap: 3px; font-size: 8px; }
  .table-page .custom-bet input { width: 54px; min-height: 27px; height: 27px; padding: 3px 4px; }

  .table-page .side-panel {
    min-height: 0;
    height: 100%;
    grid-template-rows: 31px minmax(0, 1fr) auto;
  }
  .table-page .side-tabs { min-height: 31px; }
  .table-page .side-tab { font-size: 10px; }
  .table-page .event-log.side-view,
  .table-page .table-chat { padding: 4px; }
  .table-page .event-row {
    grid-template-columns: 42px 1fr;
    gap: 4px;
    padding: 4px 2px;
    font-size: 8px;
  }
  .table-page .event-row time { font-size: 6px; }
  .table-page .chat-row { padding: 4px; }
  .table-page .chat-meta strong,
  .table-page .chat-message { font-size: 8px; }
  .table-page .chat-meta time { font-size: 6px; }
  .table-page .chat-composer {
    grid-template-columns: minmax(0, 1fr) 44px;
    gap: 3px;
    padding: 4px;
  }
  .table-page .chat-composer input,
  .table-page .chat-send { min-height: 28px; height: 28px; font-size: 8px; padding: 3px 5px; }

  .table-page .round-result {
    top: 47%;
    min-width: 145px;
    padding: 6px 10px;
  }
  .table-page .round-result strong { font-size: 9px; letter-spacing: 1px; }
  .table-page .round-result b { font-size: 18px; }
  .table-page .round-result small { font-size: 6px; }
}

/* Ekstra kompakt til Windows' kvart-skærm / lave laptop-vinduer. */
@media (max-height: 520px) {
  .table-page .topbar {
    height: 42px;
    min-height: 42px;
    padding: 0 7px;
  }
  .table-page .brand-lockup.compact .brand-orb { width: 29px; height: 29px; font-size: 17px; }
  .table-page .brand-lockup strong { max-width: 150px; font-size: 13px; }
  .table-page .brand-lockup small { display: none; }
  .table-page .top-stats .stat-pill,
  .table-page .top-stats .top-link { min-height: 24px; padding: 3px 5px; font-size: 9px; }

  .table-page .game-layout {
    height: calc(100vh - 42px);
    grid-template-columns: minmax(0, 1fr) clamp(140px, 20vw, 190px);
  }
  .table-page .table-chrome { margin: 3px 3px 0; grid-template-rows: 24px minmax(0, 1fr); }
  .table-page .phasebar { font-size: 8px; }
  .table-page .phasebar b { min-width: 30px; font-size: 9px; }
  .table-page .felt-table { border-width: 6px; }
  .table-page .felt-table::before { inset: 5px; }

  .table-page .dealer-zone { top: 3px; min-width: 120px; }
  .table-page .dealer-zone .playing-card { width: 34px; height: 48px; margin-left: -12px; }
  .table-page .dealer-zone .suit-big { font-size: 17px; }
  .table-page .dealer-zone .corner b { font-size: 9px; }
  .table-page .dealer-zone .corner span { font-size: 7px; }
  .table-page .cards-row { min-height: 49px; }
  .table-page .score-badge { height: 16px; min-width: 20px; font-size: 8px; }
  .table-page .felt-logo { top: 42%; transform: translate(-50%, -50%) scale(.58); }

  .table-page .seat { width: 78px; }
  .table-page .seat-1 { left: 91%; top: 50%; }
  .table-page .seat-2 { left: 82%; top: 65%; }
  .table-page .seat-3 { left: 65%; top: 73%; }
  .table-page .seat-4 { left: 50%; top: 77%; }
  .table-page .seat-5 { left: 35%; top: 73%; }
  .table-page .seat-6 { left: 18%; top: 65%; }
  .table-page .seat-7 { left: 9%; top: 50%; }
  .table-page .avatar-chair { width: 26px; height: 26px; font-size: 11px; }
  .table-page .seat > strong { max-width: 74px; font-size: 6px; }
  .table-page .hands-wrap { min-height: 42px; }
  .table-page .player-hand { min-width: 37px; }
  .table-page .player-hand .playing-card { width: 25px; height: 36px; margin-left: -15px; }
  .table-page .player-hand .suit-big { font-size: 12px; }
  .table-page .player-hand .corner b { font-size: 7px; }
  .table-page .player-hand .corner span { font-size: 6px; }
  .table-page .seat-bet-stack { bottom: 25px; transform: translateX(-50%) scale(.58); }

  .table-page .action-dock { min-height: 43px; margin: 3px; padding: 3px; }
  .table-page .chip { width: 26px; height: 26px; font-size: 6px; }
  .table-page .chip[data-bet="1000"],
  .table-page .chip[data-bet="2500"],
  .table-page .chip[data-bet="5000"],
  .table-page .chip[data-bet="10000"] { font-size: 5px; }
  .table-page .bet-summary { min-width: 43px; height: 27px; }
  .table-page .action-dock .btn { min-height: 25px; padding: 3px 5px; font-size: 7px; }
  .table-page .btn.action { min-width: 44px; }

  .table-page .side-panel { grid-template-rows: 27px minmax(0, 1fr) auto; }
  .table-page .side-tab { font-size: 9px; }
  .table-page .chat-composer { padding: 3px; }
  .table-page .chat-composer input,
  .table-page .chat-send { min-height: 25px; height: 25px; font-size: 7px; }
}

/* Hvis et bord bliver ekstremt smalt men stadig lavt, prioriter selve spillet.
   Log/chat forbliver tilgængelig, men får en mindre kolonne. */
@media (max-width: 720px) and (max-height: 720px) {
  .table-page .game-layout { grid-template-columns: minmax(0, 1fr) 138px; }
  .table-page .brand-lockup strong { max-width: 125px; }
  .table-page .top-stats .stat-pill { display: none; }
  .table-page .seat-1 { left: 90%; }
  .table-page .seat-7 { left: 10%; }
  .table-page .chip { width: 27px; height: 27px; }
  .table-page .action-dock .btn { padding-left: 5px; padding-right: 5px; }
}

/* Smalle desktop-popupvinduer med normal højde skal heller ikke skifte til telefon-layout. */
@media (max-width: 820px) and (min-height: 721px) and (hover: hover) and (pointer: fine) {
  .table-page { height: 100vh; overflow: hidden; }
  .table-page .game-layout {
    height: calc(100vh - 60px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(160px, 23vw, 205px);
    overflow: hidden;
  }
  .table-page .game-stage { min-height: 0; height: 100%; }
  .table-page .side-panel { min-height: 0; height: 100%; }
  .table-page .felt-table { min-height: 0; height: 100%; }
  .table-page .table-chrome { min-height: 0; }
  .table-page .seat { width: 100px; }
  .table-page .seat > strong { max-width: 94px; font-size: 8px; }
  .table-page .action-dock { min-height: 64px; padding: 6px; }
  .table-page .chip-rack { gap: 4px; }
  .table-page .chip { width: 36px; height: 36px; font-size: 8px; }
  .table-page .bet-summary { min-width: 62px; height: 36px; }
  .table-page .action-dock .btn { min-height: 30px; padding: 5px 8px; font-size: 9px; }
}

/* ============================================================
   v2.5 — spectator seating, multi-seat UX og tydeligere chips
   ============================================================ */
.spectator-controls {
  display:none;
  width:100%;
  min-height:48px;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#d8e6ec;
  text-align:center;
}
.spectator-controls.visible { display:flex; }
.spectator-controls > span { font-size:18px; opacity:.8; }
.spectator-controls strong { color:#ffe083; font-size:12px; }
.spectator-controls small { color:#b9cdd6; font-size:9px; }

.seat-selection {
  min-width:70px;
  height:44px;
  padding:5px 8px;
  display:grid;
  place-items:center;
  align-content:center;
  background:#17384b;
  border:1px solid #0f2b3b;
  box-shadow:inset 0 1px rgba(255,255,255,.08);
}
.seat-selection small { font-size:6px; letter-spacing:.9px; color:#9fb8c4; }
.seat-selection strong { font-size:11px; color:#fff0b3; white-space:nowrap; }

/* Seats er nu interaktive direkte på filten. */
button.seat {
  appearance:none;
  border:0;
  padding:0;
  background:transparent;
  color:inherit;
  font:inherit;
}
.seat.empty { cursor:pointer; transition:opacity .14s ease, filter .14s ease, transform .14s ease; }
.seat.empty:hover,
.seat.empty:focus-visible { opacity:.9; filter:drop-shadow(0 0 7px rgba(255,211,102,.55)); outline:none; }
.seat.empty:hover .avatar-chair,
.seat.empty:focus-visible .avatar-chair { border-color:#ffd363; color:#ffd363; background:linear-gradient(#557d8e,#315466); }
.seat.own-seat { cursor:pointer; }
.seat.own-seat.selected-seat .avatar-chair {
  border-color:#79d59a;
  box-shadow:0 0 0 4px rgba(71,201,121,.2),0 0 14px rgba(71,201,121,.32),0 4px 0 #182e39;
}
.seat.own-seat.selected-seat > strong { color:#baf5cc; }
.seat-anchor {
  position:relative;
  width:72px;
  margin:0 auto 4px;
}
.seat-anchor .avatar-chair { margin:0 auto; }
.seat-number {
  position:absolute;
  top:-8px;
  left:-6px;
  transform:none;
  min-width:16px;
  padding:1px 4px;
  border-radius:8px;
  background:rgba(17,48,58,.92);
  color:#d8edf2;
  font-size:8px;
  line-height:1.2;
  font-weight:800;
  opacity:0;
  transition:opacity .12s ease;
  z-index:26;
}
.seat.own-seat:hover .seat-number,
.seat.own-seat.selected-seat .seat-number { opacity:1; }
.seat-leave {
  position:absolute;
  z-index:25;
  top:-10px;
  right:-6px;
  width:18px;
  height:18px;
  padding:0;
  border:1px solid #7e343a;
  border-radius:50%;
  background:#a94d55;
  color:#fff;
  font:700 13px/15px Arial,sans-serif;
  cursor:pointer;
  opacity:0;
  transform:scale(.85);
  transition:opacity .12s ease, transform .12s ease, background .12s ease;
}
.seat.own-seat:hover .seat-leave,
.seat.own-seat:focus-within .seat-leave,
.seat.own-seat.selected-seat .seat-leave { opacity:1; transform:scale(1); }
.seat-leave:hover { background:#ca5b64; }

/* Chips på selve bordet skal kunne aflæses uden at zoome. */
.seat > strong { font-size:12px; max-width:165px; }
.mini-chip {
  width:31px;
  height:31px;
  font-size:9px;
  border-width:2px;
}
.mini-chip + .mini-chip { margin-left:-11px; }
.mini-chip.chip-1000,
.mini-chip.chip-2500,
.mini-chip.chip-5000,
.mini-chip.chip-10000 { font-size:8px; letter-spacing:-.25px; }
.chip-stack-total {
  margin-top:2px;
  padding:2px 6px;
  font-size:11px;
  line-height:1.2;
}
.seat-bet-stack { bottom:47px; min-width:100px; }
.hand-wager-stack .mini-chip { width:23px; height:23px; font-size:7px; }
.hand-wager-stack .mini-chip.chip-1000,
.hand-wager-stack .mini-chip.chip-2500,
.hand-wager-stack .mini-chip.chip-5000,
.hand-wager-stack .mini-chip.chip-10000 { font-size:6.5px; }
.hand-wager-stack .chip-stack-total { font-size:9px; padding:1px 4px; }

.spectator-note {
  display:inline-flex;
  align-items:center;
  min-height:24px;
  color:#a9c1cc;
  font-size:8px;
}

/* Lave/snap'ede desktopvinduer: behold læsbarheden på chips/navne. */
@media (max-height: 720px) {
  .table-page .seat > strong { max-width:92px; font-size:8.5px; }
  .table-page .seat-bet-stack { bottom:31px; transform:translateX(-50%) scale(.82); }
  .table-page .hand-wager-stack { transform:scale(.82); }
  .table-page .seat-number { top:-7px; left:-5px; font-size:6px; }
  .table-page .seat-leave { top:-8px; right:-5px; width:15px; height:15px; font-size:11px; line-height:12px; }
  .table-page .seat-selection { min-width:55px; height:31px; padding:2px 4px; }
  .table-page .seat-selection small { font-size:4.5px; }
  .table-page .seat-selection strong { font-size:8px; }
  .table-page .spectator-controls { min-height:34px; gap:5px; }
  .table-page .spectator-controls > span { font-size:13px; }
  .table-page .spectator-controls strong { font-size:9px; }
  .table-page .spectator-controls small { font-size:7px; }
}

@media (max-height: 520px) {
  .table-page .seat > strong { max-width:78px; font-size:7.5px; }
  .table-page .seat-bet-stack { bottom:27px; transform:translateX(-50%) scale(.76); }
  .table-page .seat-number { top:-6px; left:-4px; }
  .table-page .seat-leave { top:-7px; right:-4px; }
  .table-page .seat-selection { min-width:48px; height:27px; }
  .table-page .seat-selection strong { font-size:7px; }
  .table-page .spectator-controls small { display:none; }
}

@media (max-width: 820px) and (min-height: 721px) and (hover: hover) and (pointer: fine) {
  .table-page .seat > strong { font-size:9px; }
  .table-page .seat-bet-stack { transform:translateX(-50%) scale(.88); }
  .table-page .seat-selection { min-width:58px; height:36px; }
  .table-page .seat-selection strong { font-size:9px; }
}

/* --- v2.5.3: Seat-positionen er avatarens faste ankerpunkt -----------------
   En tom plads og en optaget plads skal have avatarens centrum på præcis
   samme koordinat. Hænder, navn, seatnummer og leave-knap må aldrig påvirke
   selve seat-positionen. */
.table-page .seat {
  --seat-avatar-half: 23px;
  height: 0;
}

/* Tom plads: + cirklen forankres direkte i seat-koordinatet. */
.table-page .seat.empty > .avatar-chair {
  position: absolute;
  left: 50%;
  top: 0;
  margin: 0;
  transform: translate(-50%, -50%);
}
.table-page .seat.empty > small {
  position: absolute;
  left: 50%;
  top: calc(var(--seat-avatar-half) + 6px);
  width: 100%;
  transform: translateX(-50%);
  white-space: nowrap;
}

/* Optaget plads: avatar-anchor ligger på nøjagtig samme koordinat. */
.table-page .seat.occupied .seat-anchor {
  position: absolute;
  left: 50%;
  top: 0;
  margin: 0;
  transform: translate(-50%, -50%);
}
.table-page .seat.occupied .hands-wrap {
  position: absolute;
  left: 50%;
  bottom: calc(var(--seat-avatar-half) + 2px);
  width: max-content;
  min-width: 100%;
  margin: 0;
  transform: translateX(-50%);
}
.table-page .seat.occupied > strong {
  position: absolute;
  left: 50%;
  top: calc(var(--seat-avatar-half) + 6px);
  width: 100%;
  margin: 0;
  transform: translateX(-50%);
}
.table-page .seat.occupied > .leaving {
  position: absolute;
  left: 50%;
  top: calc(var(--seat-avatar-half) + 22px);
  width: 100%;
  margin: 0;
  transform: translateX(-50%);
}

/* Samme invariant i responsive layouts. */
@media (max-width: 820px) {
  .table-page .seat { --seat-avatar-half: 19px; }
}
@media (max-height: 720px) {
  .table-page .seat { --seat-avatar-half: 15px; }
}
@media (max-height: 520px) {
  .table-page .seat { --seat-avatar-half: 13px; }
}
