/* Privé table language. Champagne replaces the old experimental lime accent. */
:root { --bg:#0a0b0d; --panel:#101113; --panel2:#191a1d; --ink:#f2f1ed; --dim:#aaa69e; --gold:#dbc18a; --gold-soft:#dbc18a55; --line:#ffffff16; color-scheme:dark; }
body { font-family:Figtree,Arial,sans-serif; }
button,input { -webkit-tap-highlight-color:transparent; }
button:focus-visible, summary:focus-visible, input:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
button:disabled { opacity:.36; }
.table-header { position:absolute; z-index:4; top:16px; left:4%; right:4%; display:flex; justify-content:space-between; align-items:flex-start; pointer-events:none; }
.brand-lockup { text-shadow:0 2px 8px #000b; }
.brand-name { display:flex; align-items:center; gap:0; font:600 clamp(16px,2.7dvh,24px) 'Space Grotesk',sans-serif; letter-spacing:-1px; }
.brand-name img { margin-right:7px; width:25px; }
.brand-name span { color:var(--gold); }
.brand-lockup p { font-size:8px; letter-spacing:.15em; margin:4px 0 9px; }
.brand-lockup p span { color:#d0ccc4; }
.dealer-badge { padding:4px 7px; border:1px solid #dbc18a55; border-radius:4px; font-size:8px; letter-spacing:.13em; color:var(--gold); background:#0a0b0d99; }
.table-settings { display:flex; gap:6px; pointer-events:auto; }
.icon-button,.audio-settings summary { list-style:none; display:grid; place-items:center; width:34px; height:34px; background:#0a0b0dcc; border:1px solid #ffffff24; color:var(--ink); border-radius:50%; font-size:19px; cursor:pointer; }
.audio-settings summary::-webkit-details-marker { display:none; }
.audio-settings[open] summary { color:var(--gold); border-color:var(--gold); }
.settings-popover { position:absolute; right:0; top:43px; width:245px; padding:18px; border:1px solid #dbc18a44; border-radius:14px; background:#111315f5; box-shadow:0 16px 40px #0009; backdrop-filter:blur(15px); }
.settings-popover h3 { margin:0 0 12px; font-size:14px; }
.settings-popover label { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:12px; margin:12px 0; }
.settings-popover input[type=range] { width:112px; accent-color:var(--gold); }
.settings-popover .auto-timeout { justify-content:flex-start; border-top:1px solid var(--line); padding-top:12px; }
.settings-popover input { accent-color:var(--gold); }
.settings-popover p { margin:0; font-size:10px; line-height:1.5; color:var(--dim); }
.game-controls { top:44%; left:4%; right:4%; transform:translateY(-50%); }
/* Keep decisions above the dealer landing while bets sit centrally in the open scene. */
.game-controls:not([data-phase="bets"]) { top:33.5%; }
.game-controls[data-phase="insurance"] #gameStatus { display:none; }
#gameStatus { font:600 clamp(11px,1.55dvh,14px) Figtree,sans-serif; letter-spacing:.02em; color:var(--ink); margin:0 0 8px; min-height:19px; }
.game-controls button { font-family:Figtree,sans-serif; }
.chip-rail { display:flex; align-items:center; justify-content:center; gap:10px; }
.chip-picker { gap:8px; align-items:center; }
.game-controls .rail-tool { border:1px solid #ffffff24; background:#0a0b0d99; width:30px; height:30px; min-height:30px; padding:0; border-radius:50%; color:#e4dccd; font-weight:700; font-size:14px; }
.game-controls #undoBet { font-size:23px; font-weight:400; }
/* Shared denomination palette for the rack, main wagers and side wagers. */
.chip-picker button,.chip-stack-layer { --chip-color:#1b7866; --chip-shade:#0e4138; --chip-rim:#eee8da; --chip-ink:#fff; }
.chip-picker button { position:relative; width:clamp(30px,5.4dvh,47px); min-width:0; height:clamp(30px,5.4dvh,47px); min-height:0; border:4px dashed var(--chip-rim); color:var(--chip-ink); font-size:clamp(10px,1.5dvh,13px); font-weight:800; padding:0; background:radial-gradient(ellipse 85% 85% at 45% 25%,var(--chip-color),var(--chip-shade) 100%)!important; box-shadow:0 3px 0 #0009,0 5px 9px #0006,inset 0 0 0 2px #ffffff28!important; transition:transform .15s,outline-color .15s; }
.chip-picker button[data-chip="10"],.chip-stack-layer[data-denomination="10"] { --chip-color:#b88441; --chip-shade:#5d3c1c; }
.chip-picker button[data-chip="25"],.chip-stack-layer[data-denomination="25"] { --chip-color:#c55b42; --chip-shade:#713227; }
.chip-picker button[data-chip="50"],.chip-stack-layer[data-denomination="50"] { --chip-color:#a85c9e; --chip-shade:#572c56; }
.chip-picker button[data-chip="100"],.chip-stack-layer[data-denomination="100"] { --chip-color:#424a51; --chip-shade:#181c20; }
.chip-picker button[data-chip="500"],.chip-stack-layer[data-denomination="500"] { --chip-color:#7852b3; --chip-shade:#402957; }
.chip-picker button[aria-pressed=true] { outline:2px solid var(--gold); outline-offset:3px; border-color:#fff5da; transform:translateY(-3px); }
.round-timer { --progress:1; --timer-color:var(--gold); display:grid; grid-template-columns:60px 34px 60px; grid-template-rows:34px 13px; justify-content:center; align-items:center; gap:0 10px; margin:9px auto 6px; color:var(--timer-color); }
.round-timer[data-urgent=true] { --timer-color:#ef9a84; }
.round-timer[data-waiting=true] { opacity:.55; }
.timer-dial { position:relative; display:grid; place-items:center; background:#101214e8; border-radius:50%; font:600 13px 'Space Grotesk',sans-serif; font-variant-numeric:tabular-nums; width:34px; height:34px; }
.timer-dial svg { position:absolute; inset:0; fill:none; stroke-width:1.6; }
.timer-base { stroke:#ffffff20; }
.timer-progress { stroke:var(--timer-color); stroke-dasharray:100; stroke-dashoffset:calc(100 * (1 - var(--progress))); transform:rotate(-90deg); transform-origin:center; }
.timer-track { height:2px; background:#ffffff18; border-radius:3px; overflow:hidden; }
.timer-track i { display:block; height:100%; background:var(--timer-color); transform:scaleX(var(--progress)); transform-origin:right; }
.timer-track:last-of-type i { transform-origin:left; }
.timer-label { grid-column:1 / -1; text-align:center; color:#e3d5bd; background:#101214db; border-radius:8px; padding:0 6px; justify-self:center; font-size:9px; letter-spacing:.035em; }
.game-controls button.primary { min-height:37px; border:1px solid #f1deaf; background:linear-gradient(160deg,#ead4a7,#c7a86c); color:#201c13; border-radius:22px; font-size:12px; font-weight:800; box-shadow:0 3px 12px #0004,inset 0 1px 0 #fff7; }
.game-buttons { gap:14px; margin-top:6px; }
#dealNow { min-width:140px; display:flex; align-items:center; justify-content:space-between; padding:8px 20px; }
.game-controls button.quiet { min-height:32px; background:#0a0b0d88; color:#e1d7c5; border:1px solid #dbc18a28; border-radius:22px; font-size:10px; padding:6px 10px; }
.game-controls .action-rail { display:flex; justify-content:center; gap:18px; }
.game-controls .action-rail button { padding:0; min-width:44px; border:0; background:none; display:grid; justify-items:center; gap:5px; }
.action-rail button span { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; border:1px solid #ffffff50; background:radial-gradient(circle at 45% 15%,#68747e,#293139 85%); box-shadow:inset 0 1px 3px #ffffff6a,0 5px 9px #0007; font:500 29px 'Space Grotesk',sans-serif; color:#fff; }
.action-rail button[data-action=double] span { background:radial-gradient(circle at 45% 15%,#e7b95e,#916022 85%); font-size:21px; }
.action-rail button[data-action=hit] span { background:radial-gradient(circle at 45% 15%,#49a27d,#205b47 85%); }
.action-rail button[data-action=stand] span { background:radial-gradient(circle at 45% 15%,#d57471,#873532 85%); }
.action-rail small { font-size:9px; text-transform:uppercase; letter-spacing:.09em; color:#f3e9d6; }
.insurance-panel { background:linear-gradient(135deg,#242016ed,#101113f0); border:1px solid #dbc18a55; border-radius:14px; padding:10px 12px; margin:3px auto; max-width:340px; box-shadow:0 8px 24px #0005; }
.insurance-panel p { font-weight:700; margin:0 0 6px; font-size:13px; }
.insurance-panel p span { display:block; font-weight:400; color:#beb7a9; font-size:10px; margin-top:2px; }
.insurance-panel small { display:block; font-size:9px; color:#c8bcaa; margin-top:6px; }
.hand-details { margin-top:8px; font-size:10px; color:#c8b793; }
.table-wallet { position:absolute; z-index:3; bottom:3%; left:4%; right:4%; pointer-events:none; }
.wallet { justify-content:space-between; gap:10px; padding:10px 12px; border-color:#dbc18a28; background:linear-gradient(110deg,#121314ed,#111215cc); border-radius:12px; box-shadow:0 6px 22px #0004; }
.wallet small { font-size:8px; letter-spacing:.1em; color:#b5aa96; }
.demo-refill { pointer-events:auto; justify-self:start; padding:4px 7px; margin-top:3px; color:var(--gold); background:#dbc18a10; border:1px solid #dbc18a55; border-radius:5px; font:600 10px Figtree,Arial,sans-serif; cursor:pointer; }
.demo-refill:hover:not(:disabled) { background:#dbc18a25; }
.wallet strong { font:600 16px 'Space Grotesk',sans-serif; font-variant-numeric:tabular-nums; }
.table-meta { display:flex; justify-content:space-between; color:#c1b9a9; font-size:8px; letter-spacing:.04em; margin-top:5px; }
.table-meta #here { text-transform:uppercase; }
.bet-ring, .seat-person { opacity:.5; }
.seat-number { opacity:.55; }
.side-bet { cursor:pointer; color:#b6a57c; }
.side-bet .side-hit { fill:transparent; pointer-events:all; }
.side-bet .side-outline { fill:none; stroke:currentColor; stroke-width:1.8; opacity:.5; }
.side-bet text { fill:currentColor; font:600 17px Figtree,Arial,sans-serif; pointer-events:none; }
.side-bet .side-label { opacity:.7; }
.side-bet:is(:hover,:focus-visible) .side-outline { stroke-width:3; opacity:1; }
.side-bet:focus { outline:none; }
.side-bet[data-field="pp"] .side-label { font-size:20px; }
.side-bet .side-chip { pointer-events:none; }
.side-bet[aria-disabled=true] { cursor:default; }
.side-chip .chip-value { fill:#fff6dc; font:700 16px Figtree,Arial,sans-serif; }
.chip-stack-layer { pointer-events:none; }
.chip-stack-layer .chip-edge { fill:var(--chip-shade); stroke:#080e0de0; stroke-width:1.2; }
.chip-stack-layer .chip-body { fill:var(--chip-face); stroke:#f5e3b285; stroke-width:1; }
.chip-stack-layer .chip-stitch { stroke:var(--chip-rim); stroke-width:3.5; stroke-dasharray:7 6; }
.side-chip .chip-stack-layer .chip-stitch { stroke-width:2.5; stroke-dasharray:4 4; }
.chip-face-light { stop-color:var(--chip-color); }
.chip-face-shade { stop-color:var(--chip-shade); }
.chip-inner-ring { fill:none; stroke:#f5e3b266; stroke-width:1; }
.chip-contact-shadow { fill:#000; opacity:.35; filter:blur(1.4px); pointer-events:none; }
.wager-chip > .chip-value,.side-chip > .chip-value { fill:#fff6dc; paint-order:stroke; stroke:#10241fd9; stroke-width:1.7; stroke-linejoin:round; }
.caption { top:23%; background:#0a0b0db0; border:1px solid #ffffff14; font-size:11px; }
#status { top:90px; }
.gate-kicker { color:var(--gold); }
.gate button,.compose button { background:linear-gradient(140deg,#ecd6ab,#c7a66c); color:#1b180f; }
.gate-card { max-width:350px; }
.gate h1 { font-size:54px; }
.gate-sub { font-size:14px; }
.playback-state { color:#aba59a; font-size:10px; }
@media (max-width:820px) {
  .table-header,.table-wallet { left:max(4%,calc((100% - 56.25dvh) / 2 + 16px)); right:max(4%,calc((100% - 56.25dvh) / 2 + 16px)); }
  .table-wallet { bottom:auto; top:min(86.8%,154.3vw); }
  .side-head { padding:7px 12px; }
  .playback-state { display:none; }
  .side { background:#0a0b0ded; border-top:1px solid #ffffff13; }
  .caption { top:23%; }
}
@media (max-height:760px) {
  #gameStatus { margin-bottom:3px; min-height:16px; }
  .round-timer { margin:6px auto 3px; grid-template-rows:29px 11px; }
  .timer-dial { width:29px; height:29px; font-size:12px; justify-self:center; }
  .game-buttons { margin-top:3px; }
  .hand-details { margin-top:5px; }
  .wallet { padding:7px 10px; }.wallet strong { font-size:14px; }
  .chip-rail,.chip-picker { gap:6px; }
  .action-rail button span { width:40px; height:40px; }
}
@media (max-width:380px) {
  .chip-picker,.chip-rail { gap:6px; }
  .chip-picker button { width:32px; height:32px; font-size:10px; }
  .game-controls .rail-tool { width:26px; height:26px; min-height:26px; }
  .brand-lockup p span { display:none; }
}
@media (prefers-reduced-motion:reduce) { .chip-picker button { transition:none; } }

.table-wallet { bottom:.8%; }
.sidebar-hands { padding:5px 16px; margin:0; }
#handList .hand-summary { border:0; border-bottom:1px solid #ffffff12; background:#171918; color:#ded6c5; display:block; width:100%; text-align:left; padding:8px 10px; font:12px Figtree,sans-serif; }
#handList .hand-summary.current { color:var(--gold); }
@media (max-width:820px) {
 .table-wallet { top:auto; bottom:55px; }
 .side:not(.chat-open) .sidebar-hands { display:none; }
}
@media (max-height:760px) {
 .game-buttons button.primary { min-height:33px; padding-top:6px; padding-bottom:6px; }
}

.main-bet:focus { outline:none; }
.main-bet:focus-visible .bet-ring { stroke:#f1d69c; stroke-width:4; opacity:1; }
@media (max-width:820px) {
 .chip-picker button { width:min(47px,5.4dvh,calc((100vw - 156px) / 6)); height:min(47px,5.4dvh,calc((100vw - 156px) / 6)); }
}

/* Short phones keep the source frame intact and scroll to the controls. */
@media (max-width:820px) and (max-height:700px) {
 html,body { height:auto; overflow:auto; }
 .app { height:auto; }.stage { height:780px; }
 .side { position:relative; bottom:auto; max-height:none; }
 .table-wallet { bottom:12px; }
}

/* Shared table entry uses the same quiet champagne finish as the felt UI. */
.gate { align-items:center; padding:24px 18px; overflow:auto; background:linear-gradient(180deg,#09090938,#090909ce 45%,#090909f2); backdrop-filter:blur(4px); }
.gate-card { width:100%; max-width:420px; padding:26px 20px; border:1px solid #dbc18a40; border-radius:20px; background:#101113ed; box-shadow:0 18px 70px #0008; }
.gate h1 { font-size:42px; letter-spacing:-.025em; margin:10px 0 2px; }
.gate h2 { margin:20px 0 5px; font:600 17px Figtree,sans-serif; }
.gate p { font-size:12px; color:#bdb7ad; }
.gate .gate-kicker { font-size:9px; color:var(--gold); }
#entryName { text-align:left; }
#entryName label { display:block; color:var(--gold); font-size:11px; margin:18px 0 6px; }
#playerName { width:100%; padding:13px 14px; border:1px solid #dbc18a66; border-radius:10px; font:18px Figtree,sans-serif; background:#080a0c; color:var(--ink); }
.gate .selected-boxes { color:var(--gold); font-size:11px; margin:16px 0 8px; }
#entryError { color:#e7a294; min-height:16px; margin:4px 0 8px; }
.entry-actions { display:flex; gap:9px; }.entry-actions #enter { flex:1; }
.gate .entry-actions .ghost { color:#d4c3a4; background:transparent; border:1px solid #dbc18a44; }
.entry-note { display:block; margin-top:17px; font-size:9px; color:#99938a; }
.table-company { padding:14px 16px; border-bottom:1px solid var(--line); }
.table-company header { display:flex; justify-content:space-between; align-items:center; margin-bottom:9px; }
.table-company h2 { margin:0; font-size:10px; text-transform:uppercase; letter-spacing:.13em; color:var(--gold); }
#copyTableLink { color:#d9c69f; border:1px solid #dbc18a40; background:transparent; padding:4px 8px; border-radius:12px; font-size:10px; }
#playersAtTable { display:flex; flex-wrap:wrap; gap:6px; font-size:11px; color:var(--dim); }
.player-tag { padding:4px 7px; border-radius:5px; background:#ffffff07; color:#c9c3b7; border:1px solid #ffffff12; }
.player-tag[data-mine=true] { border-color:#dbc18a55; color:var(--gold); }
.player-tag::before { content:''; display:inline-block; width:5px; height:5px; margin-right:5px; border-radius:50%; background:#666; }
.player-tag[data-online=true]::before { background:#bda878; }
.seat-owner { fill:#bdb5a6; font:500 15px Figtree,sans-serif; pointer-events:none; paint-order:stroke; stroke:#171414; stroke-width:1.5; }
.table-box[data-mine=true] .seat-owner { fill:#ebd3a3; }
#here { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:72%; }
@media(max-width:820px){.side:not(.chat-open) .table-company{display:none}.table-company{padding:10px 14px}.gate-card{max-width:390px}.app:has(.gate:not(.off)) .side{display:none}}
@media(max-height:700px){.gate-card{padding:16px}.gate h1{font-size:30px}.gate h2{margin-top:10px}.entry-note{margin-top:10px}}
.gate[data-step=boxes] { backdrop-filter:none; background:none; pointer-events:none; align-items:flex-start; padding-top:38dvh; }
.gate[data-step=boxes] .gate-card { pointer-events:auto; max-width:330px; width:90%; padding:14px 18px; background:#101113df; border-radius:14px; }
.gate[data-step=boxes] .gate-kicker,.gate[data-step=boxes] h1,.gate[data-step=boxes] .gate-sub,.gate[data-step=boxes] .entry-note { display:none; }
.gate[data-step=boxes] h2 { margin:0; font-size:17px; }
.gate[data-step=boxes] p { margin:4px 0; font-size:11px; }
.gate[data-step=boxes] #entryError:empty { display:none; }
.gate[data-step=boxes] #enter { padding:9px 14px; margin-top:7px; font-size:12px; }
.seat-check { display:none; fill:none; stroke:#efd5a0; stroke-width:4; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
.table-box.is-selected .seat-check { display:block; }
.table-box.is-selected .seat-person { visibility:hidden; }
.table-box.is-selected .bet-ring { stroke:#efd5a0; stroke-width:3; opacity:1; fill:#dbc18a24; }
.table-boxes[data-selecting=true] .side-bet { visibility:hidden; }
.table-boxes[data-selecting=true] .bet-ring { opacity:.85; }
@media(max-width:820px){.gate[data-step=boxes]{padding-top:min(38dvh,67vw)}}
