/* Live scene, paper interaction and a restrained brass/leather control system. */
:root { --saloon-brass:#d7b378; --saloon-ink:#17100c; }
.button,.small-button,.reveal-all { border-radius:10px; border:1px solid #ab86513b; background:linear-gradient(145deg,#3a2e25,#221a15); color:#e8dcc8; box-shadow:inset 0 1px #fff1d311,0 3px 0 #100c09,0 8px 16px #0a07051c; font-weight:500; letter-spacing:.4px; transition:background .16s,transform .16s,box-shadow .16s; }
.button:before { content:none; }
.button:hover:not(:disabled),.small-button:hover,.reveal-all:hover:not(:disabled) { background:linear-gradient(145deg,#4d3b2c,#2d2119); border-color:#d5b37577; }
.button.gold { color:#2b2117; background:linear-gradient(145deg,#e4c996,#bd955b); border-color:#edcf965c; box-shadow:inset 0 1px #fff3d291,0 3px 0 #785a33,0 9px 22px #08050255; font-weight:650; }
.button.gold:hover:not(:disabled) { background:linear-gradient(145deg,#edd6ad,#cba66d); }
.button:active:not(:disabled),.small-button:active,.reveal-all:active:not(:disabled) { transform:translateY(2px); box-shadow:inset 0 2px 6px #08050333,0 1px 0 #0c0806; }
.button:focus-visible,.reveal-all:focus-visible,.physical-card:focus-visible { outline:2px solid #f3d8a5;outline-offset:4px; }
.actions-grid .fold { color:#b4a18b; border-color:#a4856030; background:#1a130ed9; box-shadow:inset 0 1px #c9ab7310,0 2px 0 #0e0907; }
.actions-grid button:disabled { opacity:.4; filter:saturate(.4); cursor:default; }
.actions-grid small { font-size:9px; letter-spacing:0; opacity:.65; }
.prepare-table .arena { background:linear-gradient(#160e0b99,#1e140fcc),url('/assets/western-saloon.webp') center 32%/cover; }
.prepare-table .table-oval { opacity:.22; filter:blur(3px); }
.prepare-table .waiting-copy { font-size:20px; color:#f2d9ad; text-shadow:0 2px 12px #000; }
.prepare-table .waiting-copy small { font-size:11px;line-height:1.8;color:#c0a680; }
.prepare-table .table-wordmark { color:#d5b582; }
.prepare-table .arena:after { content:'THE SALOON · 准备室';position:absolute;bottom:43px;left:0;right:0;text-align:center;font-size:9px;letter-spacing:3px;color:#a98d69; }
.reveal-tools { display:flex;align-items:center;justify-content:center;gap:15px;margin:-3px 0 12px;min-height:44px; }
.reveal-tools .peel-hint { margin:0;min-height:0;font-size:10px;max-width:190px; }
.reveal-all { min-height:44px;padding:0 16px;white-space:nowrap;font-size:11px;background:#1c1510d9;cursor:pointer; }
.reveal-all span { color:#b69562;margin-left:5px; }.reveal-all:disabled { opacity:.3;cursor:default; }
.physical-card { overflow:visible!important; }.physical-card.locked { cursor:default; }
.physical-card.locked:active { transform:rotate(var(--fan,0deg))!important; }
.physical-card .paper-surface { position:absolute;width:300%;height:300%;left:-100%;top:-100%;pointer-events:none;z-index:8;display:none;filter:drop-shadow(1px 3px 3px #1009054d); }
.physical-card.mesh-active .paper-surface { display:block; }
.physical-card.mesh-active>.card-front,.physical-card.mesh-active>.card-back-sheet { visibility:hidden; }
.physical-card .card-curl,.physical-card .peel-grip { display:none; }
.physical-card .card-number { position:absolute;left:0;right:0;bottom:-21px;color:#c6b28f;font:9px Georgia,serif;letter-spacing:1px;pointer-events:none;opacity:.6; }
.physical-card.fully-open>.card-back-sheet { visibility:hidden; }
.physical-card:not(.fully-open)>.card-front { visibility:hidden; }
.physical-card.mesh-active>.card-front { visibility:hidden; }
.physical-card:not(.mesh-active):not(.fully-open) .card-back-sheet { clip-path:none;transform-origin:50% 50%;transform:perspective(700px) rotateY(var(--flip,0deg)); }
.physical-card:hover { z-index:10; }
.in-game .app-shell { max-width:none;padding:0;width:100%; }
.in-game .app-header { display:none; }
.in-game .room-screen { padding:0; }
.in-game .room-bar { height:52px;min-height:52px;margin:0;padding:0 22px;background:#1b130ff5;border-bottom:1px solid #d6ac6321; }
.in-game .room-number { font-size:21px;letter-spacing:3px; }.in-game .room-label { font-size:10px; }
.in-game .activity,.in-game .room-footnote { display:none; }
.live-table { display:block;height:calc(100dvh - 52px);min-height:600px;position:relative;isolation:isolate;overflow:hidden;gap:0;background:#22170e; }
.live-table .arena { position:absolute;inset:0;width:100%;height:100%;min-height:0!important;border:0;border-radius:0;background:linear-gradient(0deg,#0f090700 35%,#100a0733),url('/assets/western-saloon.webp') center center/cover;box-shadow:inset 0 0 100px #0c07076b; }
.live-table .arena:before { content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 49%,transparent 25%,#0c080540 100%);pointer-events:none; }
.live-table .table-oval { display:none; }
.live-table .arena-meta { top:15px;left:23px;right:23px;z-index:6;color:#d7c5a6;text-shadow:0 1px 5px #000;font-size:10px; }
.live-table .table-center { top:52%;width:210px;z-index:3;pointer-events:none;text-shadow:0 2px 10px #211208; }
.live-table .table-wordmark { color:#b08c4c88;font-size:23px;margin-bottom:10px;letter-spacing:6px; }
.live-table .table-wordmark small { font-size:5px;letter-spacing:2px; }
.live-table .pot-value { color:#f2d6a1;font-size:36px;line-height:1.1; }.live-table .pot-label { color:#c1ab80;font-size:9px; }
.live-table .bet-tag { font-size:10px;color:#d1bb94;margin-top:5px; }
.live-table .seat { width:154px;z-index:5;text-align:center; }
.live-table .seat-0 { left:50%;top:23%; }.live-table .seat-1 { left:77%;top:31%; }.live-table .seat-2 { left:89%;top:51%; }.live-table .seat-3 { left:11%;top:51%; }.live-table .seat-4 { left:23%;top:31%; }
.live-table .seat:not(.empty-seat) .avatar { width:150px;height:155px;border:0;outline:0;border-radius:0;box-shadow:none;background-color:transparent;background-image:url('/assets/western-characters.webp');background-size:300% 200%;filter:drop-shadow(0 8px 7px #150a05b3);position:relative;margin:auto; }
.live-table .seat.current .avatar { filter:drop-shadow(0 0 15px #efc87666) drop-shadow(0 8px 7px #150a05b3);animation:character-breathe 2.6s ease-in-out infinite; }
.live-table .seat.inactive { opacity:1; }
.live-table .seat.inactive .avatar { filter:brightness(.8) saturate(.65) drop-shadow(0 8px 7px #150a05b3); }
.live-table .seat-name { display:block;background:linear-gradient(#2c211bed,#19120ff2);border:1px solid #b48d5155;border-radius:5px;max-width:146px;font-size:11px;margin:-10px auto 3px;padding:5px 8px;position:relative;box-shadow:0 5px 10px #140b0755; }
.live-table .seat-balance { font-size:11px;color:#edd5ab;text-shadow:0 2px 5px #0a0503; }.live-table .seat-status { font-size:9px;color:#c6b393;text-shadow:0 2px 5px #0a0503; }
.live-table .mini-hand { margin:4px 0 0; }.live-table .mini-card { width:13px;height:18px; }.live-table .mini-card.face { width:15px;font-size:10px; }
.live-table .empty-seat { display:none; }.live-table .empty-seat .avatar { width:35px;height:35px;font-size:17px;margin:auto; }.live-table .empty-seat .seat-name { border:0;background:none;font-size:9px;margin-top:4px;box-shadow:none; }
.live-table .banker-badge { right:13px;bottom:12px;z-index:3; }
.live-table .arena-status { top:15px;bottom:auto;left:50%;transform:translateX(-50%);width:max-content;background:#17110cc9;padding:7px 15px;border:1px solid #c4a46635;border-radius:30px;z-index:6;font-size:10px;color:#d8c09b; }
.live-table .your-panel { position:absolute;left:0;right:0;bottom:0;z-index:12;background:linear-gradient(0deg,#100b08f5 0%,#1d140bd9 45%,#1a100600 100%);border:0;border-radius:0;box-shadow:none;padding:24px 30px 18px;display:grid;grid-template-columns:minmax(150px,1fr) minmax(240px,2fr) minmax(150px,1fr);grid-template-areas:'identity hand status' '. tools .' 'actions actions actions';column-gap:15px;row-gap:7px;pointer-events:none;overflow:visible; }
.live-table .your-panel>* { pointer-events:auto; }
.live-table .your-heading { grid-area:identity;flex-direction:column;align-items:flex-start;gap:12px;align-self:center; }
.live-table .your-heading .your-balance { font-size:25px; }.live-table .your-balance small { display:inline;font-size:9px;margin-left:8px; }
.live-table .my-id strong { font-size:13px; }.live-table .my-id .room-label { font-size:9px; }
.live-table .my-portrait { width:36px;height:36px;min-width:36px; }
.live-table .hand-caption { position:absolute;top:9px;left:50%;transform:translateX(-50%);padding:0;display:flex;gap:10px;justify-content:center;white-space:nowrap;color:#c6b18e;font-size:9px; }
.live-table .your-hand { grid-area:hand;min-height:144px;padding:10px 0 20px;align-self:end; }
.live-table .physical-card { width:80px;height:117px; }.live-table .five-cards .physical-card { width:65px;height:97px;margin-left:-9px; }
.live-table .five-cards .physical-card:first-child { margin-left:0; }
.live-table .reveal-tools,.live-table .result-callout { grid-area:tools;min-height:36px;margin:0; }
.live-table .reveal-tools .peel-hint { color:#c4ae88;font-size:9px;max-width:180px;white-space:nowrap; }
.live-table .reveal-all { font-size:10px;min-height:36px;padding:0 12px;background:#271b12e8; }
.live-table .action-status { grid-area:status;align-self:center;text-align:right;font-size:12px;color:#d0b791;margin:0;line-height:1.8;max-width:220px;justify-self:end; }
.live-table .actions-grid { grid-area:actions;grid-template-columns:repeat(6,minmax(0,1fr));width:100%;max-width:820px;justify-self:center;margin:0;gap:10px; }
.live-table .actions-grid button { min-height:53px;min-width:0;font-size:14px; }.live-table .actions-grid .wide { grid-column:auto; }
.live-table .actions-grid.niu-actions { grid-template-columns:repeat(3,minmax(0,1fr));max-width:540px; }
.live-table .actions-grid.niu-actions:has([data-do="niu-bet"]) { grid-template-columns:repeat(4,minmax(0,1fr));max-width:640px; }
.live-table .actions-grid.idle-actions { grid-template-columns:repeat(3,minmax(0,1fr));max-width:540px; }
.live-table .result-callout { font-size:11px;background:#281e13d9;border:1px solid #d3b07a3d;padding:5px 12px;white-space:nowrap;min-height:0;align-self:center; }
.live-table .result-callout small { font-size:10px;display:inline;margin-left:8px; }.live-table .result-callout .text-button { font-size:10px; }
.live-table .panel-footnote,.live-table .bot-invite-button { display:none; }
.chip-bank { position:absolute;left:50%;top:63%;transform:translate(-50%,-50%);width:190px;height:55px;z-index:4;pointer-events:none; }
.real-chip { display:grid;place-items:center;width:25px;height:14px;border:2px dashed #dfd1aa;border-radius:50%;background:#923e32;color:#f4e6c7;font:7px/1 Georgia,serif;box-shadow:0 3px 0 #5c271f,0 4px 0 #b49b70,0 6px 5px #1d110955;text-shadow:0 1px #0005;font-style:normal; }
.chip-bank .real-chip { position:absolute;left:calc(50% + var(--chip-x));top:calc(16px + var(--chip-y));transform:rotate(var(--chip-angle)); }
.chip-blue { background:#365864;box-shadow:0 3px #203c47,0 4px #a5b5b5,0 6px 5px #1d110966; }.chip-ivory { background:#cbbd9d;color:#4e3d29;box-shadow:0 3px #8f8067,0 4px #decba8,0 6px 5px #1d110966;border-color:#f3e4c2; }.chip-onyx { background:#363431;box-shadow:0 3px #1b1c1b,0 4px #b49c74,0 6px 5px #1d110966; }
.chip-flight { position:absolute;z-index:9;left:50%;top:63%;display:flex;pointer-events:none;animation:chip-toss 950ms cubic-bezier(.2,.75,.3,1) both;animation-delay:var(--flight-elapsed);--start-x:50%;--start-y:23%; }
.chip-from-1 { --start-x:77%;--start-y:31%; }.chip-from-2 { --start-x:89%;--start-y:51%; }.chip-from-3 { --start-x:11%;--start-y:51%; }.chip-from-4 { --start-x:23%;--start-y:31%; }.chip-from-me { --start-x:50%;--start-y:89%; }
.flying-chip { margin-left:-10px;width:27px;height:17px; }.chip-flight>span { position:absolute;top:-20px;color:#f5dfaf;white-space:nowrap;font:13px Georgia,serif;text-shadow:0 2px 5px #000; }
.prepare-table .chip-bank { display:none; }
.table-entry { position:absolute;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse,#25180ee6,#100b08f5);color:#ebd4ac;pointer-events:none;animation:enter-title 1500ms both;animation-delay:var(--entry-elapsed); }
.table-entry>span { font:10px Georgia,serif;letter-spacing:8px;color:#ab8754; }.table-entry strong { font:42px/1.5 'KaiTi','Microsoft YaHei',sans-serif;letter-spacing:8px;margin:20px 0; }.table-entry i { width:90px;height:1px;background:linear-gradient(90deg,transparent,#d0a76c,transparent); }.table-entry small { font-size:10px;letter-spacing:3px;margin-top:16px;color:#b4986d; }
.entering-table .arena { animation:enter-camera 1500ms cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--entry-elapsed); }
@keyframes enter-title { 0%{opacity:1} 28%{opacity:1} 85%,100%{opacity:0} }
@keyframes enter-camera { 0%,20%{transform:scale(1.17);filter:blur(7px) brightness(.45)} 100%{transform:scale(1);filter:blur(0) brightness(1)} }
@keyframes chip-toss { 0%{left:var(--start-x);top:var(--start-y);opacity:0;transform:translate(-50%,-50%) scale(1.2)} 12%{opacity:1} 48%{transform:translate(-50%,calc(-50% - 35px)) scale(1.05)} 85%{opacity:1} 100%{left:50%;top:63%;opacity:0;transform:translate(-50%,-50%) scale(.8)} }
@keyframes character-breathe { 50%{transform:translateY(-3px)} }
@media(max-width:650px) and (orientation:portrait),(max-width:550px) {
  .in-game .room-bar { padding:0 12px; }.in-game .room-number { font-size:18px;letter-spacing:2px; }.in-game .room-actions .small-button { padding:6px 9px;font-size:9px; }
  .live-table { min-height:650px;height:calc(100dvh - 52px); }
  .live-table .arena { background-position:50% 35%;background-size:auto 100%; }
  .live-table .arena-meta { left:12px;right:12px;top:12px;font-size:8px; }
  .live-table .arena-status { top:33px;font-size:9px;padding:5px 10px; }
  .live-table .table-center { top:47%;width:150px; }.live-table .table-wordmark { font-size:18px;letter-spacing:4px;margin-bottom:7px; }.live-table .table-wordmark small { font-size:4px; }.live-table .pot-value { font-size:29px; }.live-table .pot-label,.live-table .bet-tag { font-size:8px; }
  .live-table .seat { width:100px; }.live-table .seat:not(.empty-seat) .avatar { width:100px;height:107px; }
  .live-table .seat-0 { left:50%;top:21%; }.live-table .seat-1 { left:81%;top:29%; }.live-table .seat-2 { left:85%;top:47%; }.live-table .seat-3 { left:15%;top:47%; }.live-table .seat-4 { left:19%;top:29%; }
  .live-table .seat-name { max-width:94px;font-size:8px;padding:3px 3px;margin:-7px auto 3px; }.live-table .seat-balance { font-size:9px; }.live-table .seat-status { font-size:7px; }.live-table .mini-card { width:9px;height:13px; }.live-table .mini-card.face { width:10px;font-size:7px; }
  .live-table .your-panel { padding:20px 12px 16px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'identity status' 'hand hand' 'tools tools' 'actions actions';column-gap:6px;row-gap:5px; }
  .live-table .your-heading { flex-direction:row;gap:6px;align-items:center; }.live-table .my-portrait { width:29px;height:29px;min-width:29px; }.live-table .my-id { gap:6px; }.live-table .my-id strong { font-size:10px; }.live-table .my-id .room-label { font-size:7px; }.live-table .your-heading .your-balance { font-size:14px;margin-left:8px; }.live-table .your-balance small { display:block;font-size:7px;margin:0; }
  .live-table .hand-caption { top:58px;font-size:8px;gap:8px; }
  .live-table .your-hand { min-height:144px;padding:18px 0 20px; }.live-table .physical-card { width:75px;height:109px; }.live-table .five-cards .physical-card { width:57px;height:85px; }
  .live-table .action-status { font-size:9px;max-width:160px; }.live-table .actions-grid { grid-template-columns:repeat(3,minmax(0,1fr));gap:7px; }.live-table .actions-grid button { min-height:48px;font-size:12px;padding:6px 3px; }.live-table .actions-grid small { font-size:8px; }
  .live-table .actions-grid .wide { grid-column:1/-1; }.live-table .actions-grid.niu-actions { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .live-table .actions-grid.idle-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .live-table .reveal-tools { gap:10px;min-height:40px; }.live-table .reveal-tools .peel-hint { font-size:8px;max-width:170px; }.live-table .reveal-all { min-height:40px;font-size:10px;padding:0 11px; }
  .live-table .result-callout { font-size:10px;white-space:normal;padding:7px; }.live-table .result-callout small { font-size:9px; }
  .chip-bank { top:57%;transform:translate(-50%,-50%) scale(.85); }.live-table .niu-stage-title { font-size:21px;margin:8px 0; }.table-entry strong { font-size:31px; }
}
@media(orientation:landscape) and (max-height:600px) {
  .in-game .room-bar { height:41px;min-height:41px;padding:0 14px; }.in-game .room-number { font-size:18px; }.in-game .room-actions .small-button { min-height:30px;padding:3px 9px;font-size:9px; }
  .live-table { min-height:279px;height:calc(100dvh - 41px); }
  .live-table .arena-meta { font-size:8px;top:9px;left:15px;right:15px; }.live-table .arena-status { top:7px;font-size:8px;padding:5px 10px; }
  .live-table .table-center { top:46%;width:155px; }.live-table .table-wordmark { font-size:15px;letter-spacing:3px;margin-bottom:4px; }.live-table .table-wordmark small { display:none; }.live-table .pot-value { font-size:23px; }.live-table .pot-label,.live-table .bet-tag { font-size:7px; }.live-table .niu-stage-title { font-size:19px;margin:6px 0; }
  .live-table .seat { width:90px; }.live-table .seat:not(.empty-seat) .avatar { width:82px;height:86px; }
  .live-table .seat-0 { left:50%;top:25%; }.live-table .seat-1 { left:76%;top:29%; }.live-table .seat-2 { left:89%;top:46%; }.live-table .seat-3 { left:11%;top:46%; }.live-table .seat-4 { left:24%;top:29%; }
  .live-table .seat-name { max-width:92px;font-size:7px;padding:2px 4px;margin:-12px auto 2px; }.live-table .seat-balance { font-size:8px; }.live-table .seat-status { font-size:6px; }.live-table .mini-hand { margin-top:2px; }.live-table .mini-card { width:8px;height:11px; }.live-table .mini-card.face { width:9px;font-size:6px; }
  .live-table .your-panel { padding:8px 20px 10px;grid-template-columns:minmax(90px,1fr) minmax(180px,2fr) minmax(90px,1fr);column-gap:5px;row-gap:3px; }
  .live-table .your-heading { gap:3px; }.live-table .my-portrait { width:25px;height:25px;min-width:25px; }.live-table .my-id { gap:5px; }.live-table .my-id strong { font-size:9px; }.live-table .my-id .room-label { font-size:6px; }.live-table .your-heading .your-balance { font-size:17px; }.live-table .your-balance small { font-size:7px; }
  .live-table .your-hand { min-height:79px;padding:6px 0 17px; }.live-table .physical-card { width:42px;height:62px; }.live-table .five-cards .physical-card { width:37px;height:55px; }
  .live-table .hand-caption { top:0;font-size:6px; }.live-table .physical-card .card-number { bottom:-13px;font-size:6px; }
  .live-table .reveal-tools,.live-table .result-callout { min-height:24px; }.live-table .reveal-tools { gap:8px; }.live-table .reveal-tools .peel-hint { font-size:6px; }.live-table .reveal-all { min-height:28px;font-size:8px;padding:0 9px; }
  .live-table .actions-grid { max-width:620px;gap:7px; }.live-table .actions-grid button { min-height:44px;font-size:10px;padding:5px 2px; }.live-table .actions-grid small { font-size:7px; }
  .live-table .action-status { font-size:8px;max-width:150px; }.live-table .result-callout { font-size:8px;padding:3px 7px; }.live-table .result-callout small,.live-table .result-callout .text-button { font-size:7px; }
  .chip-bank { top:58%;transform:translate(-50%,-50%) scale(.65); }.live-table .empty-seat .avatar { width:23px;height:23px;font-size:12px; }.live-table .empty-seat .seat-name { font-size:7px; }.table-entry strong { font-size:29px;margin:12px 0; }
}
@media(prefers-reduced-motion:reduce) {
  .table-entry,.chip-flight { display:none!important; }.entering-table .arena,.live-table .seat.current .avatar { animation:none!important; }.button,.small-button,.reveal-all { transition:none; }
}
@media(orientation:landscape) and (max-height:340px) {
  .live-table .seat:not(.empty-seat) .avatar { width:68px;height:71px; }
  .live-table .mini-hand,.live-table .seat-status { display:none; }
}

/* Scene anchors share the exact cover projection of the background table. */
.projected-scene .arena { background-position:center center;background-size:cover; }
.projected-scene .seat { left:var(--actor-x);top:var(--actor-y);width:var(--actor-width);height:var(--actor-height);transform:translate(-50%,-100%); }
.projected-scene .seat-0 { --actor-x:var(--seat-0-x);--actor-y:var(--seat-0-y);--actor-width:var(--seat-0-width);--actor-height:var(--seat-0-height); }
.projected-scene .seat-1 { --actor-x:var(--seat-1-x);--actor-y:var(--seat-1-y);--actor-width:var(--seat-1-width);--actor-height:var(--seat-1-height); }
.projected-scene .seat-2 { --actor-x:var(--seat-2-x);--actor-y:var(--seat-2-y);--actor-width:var(--seat-2-width);--actor-height:var(--seat-2-height); }
.projected-scene .seat-3 { --actor-x:var(--seat-3-x);--actor-y:var(--seat-3-y);--actor-width:var(--seat-3-width);--actor-height:var(--seat-3-height); }
.projected-scene .seat-4 { --actor-x:var(--seat-4-x);--actor-y:var(--seat-4-y);--actor-width:var(--seat-4-width);--actor-height:var(--seat-4-height); }
.projected-scene .seat:not(.empty-seat) .avatar { width:100%;height:100%;margin:0;transform:translateY(2px);clip-path:inset(0 0 3px); }
.projected-scene .seat:after { content:'';position:absolute;bottom:-5px;left:10%;right:10%;height:8px;background:radial-gradient(ellipse,#180a0877,transparent 72%);z-index:-1;pointer-events:none; }
.projected-scene .seat.current .avatar { animation:none; }
.projected-scene .seat-info { position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);width:100%;font-size:10px; }
.projected-scene .seat-name { width:100%;max-width:100%;margin:0 auto 3px;padding:4px 3px;font-size:10px; }
.projected-scene .seat-balance { display:block;font-size:10px;line-height:1.4; }
.projected-scene .seat-status { margin:2px 0 0;font-size:8px;line-height:1.3; }
.projected-scene .mini-hand { margin-top:3px; }
.projected-scene .mini-card { width:10px;height:14px; }.projected-scene .mini-card.face { width:11px;font-size:8px; }
.projected-scene .table-center { left:var(--pool-x,43%);top:var(--pool-y,52%);width:var(--pool-width,140px); }
.projected-scene .table-wordmark { display:none; }
.projected-scene .pot-value { font-size:30px;line-height:1.15; }.projected-scene .pot-label { font-size:8px;letter-spacing:1px; }.projected-scene .bet-tag { font-size:8px;white-space:nowrap; }
.projected-scene .niu-stage-title { font-size:21px;line-height:1.2;margin:6px 0;white-space:nowrap; }

/* Spin the circular artwork inside a fixed table plane, never a screen ellipse. */
.projected-scene .chip-bank { left:var(--chips-x,60%);top:var(--chips-y,60%);width:120px;height:62px;perspective:600px;transform-style:preserve-3d;transform:translate(-50%,-50%) scale(var(--chip-scale,1)); }
.projected-scene .chip-bank:before { content:'';position:absolute;left:4px;right:4px;bottom:11px;height:17px;background:radial-gradient(ellipse,#25110966,transparent 70%); }
.projected-scene .real-chip { display:block;width:28px;height:28px;border:0;border-radius:50%;background:none;box-shadow:none;transform-style:preserve-3d;--chip-color:#923e32;--chip-side:#55251d;--chip-ink:#f4e6c7; }
.projected-scene .chip-bank .real-chip { position:absolute;left:calc(50% + var(--chip-x));top:calc(50% + var(--chip-y));transform:translate(-50%,-50%) rotateX(var(--chip-tilt,58deg)); }
.projected-scene .chip-face,.projected-scene .chip-edge { position:absolute;inset:0;border-radius:50%; }
.projected-scene .chip-edge { background:var(--chip-side);box-shadow:0 1px #e8cba090,0 2px var(--chip-side);transform:translateZ(-4px); }
.projected-scene .chip-face { display:grid;place-items:center;border:2px dashed #e8d6ad;background:radial-gradient(circle,transparent 48%,#e9d4aa99 49% 52%,transparent 53%),var(--chip-color);font:8px/1 Georgia,serif;color:var(--chip-ink);box-shadow:inset 0 0 0 1px #28140c55;transform:rotateZ(var(--chip-angle)); }
.projected-scene .chip-blue { --chip-color:#365864;--chip-side:#203c47; }
.projected-scene .chip-ivory { --chip-color:#cbbd9d;--chip-side:#8f8067;--chip-ink:#4e3d29; }
.projected-scene .chip-onyx { --chip-color:#363431;--chip-side:#1b1c1b; }
.projected-scene .chip-flight { perspective:600px;--start-x:var(--from-x,50%);--start-y:var(--from-y,30%);align-items:center; }
.projected-scene .flying-chip { margin-left:-7px;flex-shrink:0;transform:rotateX(var(--chip-tilt,58deg)); }
@keyframes chip-toss {
  0% {left:var(--start-x);top:var(--start-y);opacity:0;transform:translate(-50%,-50%) scale(1.15)}
  12% {opacity:1} 48% {transform:translate(-50%,calc(-50% - 25px)) scale(1.05)} 85% {opacity:1}
  100% {left:var(--chips-x,50%);top:var(--chips-y,63%);opacity:0;transform:translate(-50%,-50%) scale(var(--chip-scale,1))}
}

/* User reference: three upright, separate rectangles instead of a fanned hand. */
.projected-scene .your-hand { gap:28px;min-height:160px;padding:9px 0 21px; }
.projected-scene .your-hand .physical-card { --fan:0deg;width:84px;height:130px;margin:0;top:0;transform:none; }
.projected-scene .your-hand .physical-card:active { transform:none!important; }
.projected-scene .your-heading { justify-content:flex-start; }
.projected-scene .hand-caption { grid-area:hand;position:static;align-self:end;justify-self:center;transform:none;left:auto;top:auto;padding:0;margin:0 0 2px;z-index:14; }
.projected-scene .five-cards { gap:12px; }
.projected-scene .five-cards .physical-card { width:54px;height:84px;margin:0;top:0; }
.projected-scene .physical-card:not(.mesh-active)>.card-front { visibility:visible;backface-visibility:hidden;transform:perspective(700px) rotateY(var(--paper-turn,180deg)); }
.projected-scene .physical-card:not(.mesh-active)>.card-back-sheet { backface-visibility:hidden;transform:perspective(700px) rotateY(var(--flip,0deg)); }
.projected-scene .physical-card.mesh-active>.card-front { visibility:hidden; }
.projected-scene .physical-card .card-number { display:none; }
@media(max-width:650px) and (orientation:portrait),(max-width:550px) {
  .projected-scene .your-hand { --hand-width:clamp(68px,13.5vw,90px);gap:clamp(16px,4vw,28px);min-height:calc(var(--hand-width)*1.55 + 42px);padding:18px 0 24px; }
  .projected-scene .your-hand .physical-card { width:var(--hand-width);height:calc(var(--hand-width)*1.55); }
  .projected-scene .your-hand.five-cards { gap:8px; }
  .projected-scene .your-hand.five-cards .physical-card { width:min(54px,calc((100vw - 72px)/5));height:min(84px,calc((100vw - 72px)*.31)); }
  .projected-scene .seat-name { padding:3px 2px;font-size:9px; }.projected-scene .seat-balance { font-size:9px; }.projected-scene .seat-status { font-size:7px; }
}
.projected-scene.compact-scene .your-hand { gap:18px;min-height:96px;padding:17px 0 5px; }
.projected-scene.compact-scene .your-hand .physical-card { width:48px;height:74px; }
.projected-scene.compact-scene .five-cards { gap:10px; }
.projected-scene.compact-scene .your-hand.five-cards .physical-card { width:34px;height:53px; }
.projected-scene.compact-scene .your-heading { grid-area:auto;position:absolute;left:14px;bottom:58px;flex-direction:row;align-items:center;gap:8px; }
.projected-scene.compact-scene .your-heading .your-balance { font-size:14px;margin:0; }
.projected-scene.compact-scene .action-status { grid-area:auto;position:absolute;right:14px;bottom:61px;max-width:155px; }
.projected-scene.compact-scene .hand-caption { display:none; }
.projected-scene.compact-scene .result-callout .text-button { min-height:22px;padding:0 3px; }
.projected-scene.compact-scene .seat-info { top:calc(100% + 4px); }
.projected-scene.compact-scene .seat-name { padding:2px 2px;margin:0;font-size:8px;line-height:1.25; }
.projected-scene.compact-scene .seat-balance { display:inline;font-size:8px;line-height:1.25; }.projected-scene.compact-scene .seat-status { display:inline;font-size:6px;line-height:1.2;margin:0 0 0 3px; }
.projected-scene.compact-scene .seat-status:before { content:'·';margin-right:3px; }
.projected-scene.compact-scene .mini-hand { display:none; }
.projected-scene.compact-scene .pot-value { font-size:21px; }.projected-scene.compact-scene .pot-label,.projected-scene.compact-scene .bet-tag { font-size:7px; }
.projected-scene.compact-scene .niu-stage-title { font-size:16px; }

/* ===== UI polish v3 (keeps the original saloon look) ===== */
/* -- Characters: graded to the room's lamp light, shadowed by the table, sized by depth -- */
.animal-fox { --sprite-pos:0% 0%; }.animal-panda { --sprite-pos:50% 0%; }.animal-wolf { --sprite-pos:100% 0%; }
.animal-cat { --sprite-pos:0% 100%; }.animal-raccoon { --sprite-pos:50% 100%; }.animal-stag { --sprite-pos:100% 100%; }
.live-table { --grade:saturate(.84) sepia(.16) brightness(.9) contrast(1.06); }
.live-table .seat:not(.empty-seat) .avatar {
  filter:var(--grade) drop-shadow(0 0 1px #ffd9a03a) drop-shadow(0 12px 10px #170a04a6);
  -webkit-mask-image:linear-gradient(#000 0 84%,#000c 93%,#0006 100%);mask-image:linear-gradient(#000 0 84%,#000c 93%,#0006 100%);
}
.live-table .seat.current .avatar { filter:var(--grade) brightness(1.06) drop-shadow(0 0 2px #ffd38c88) drop-shadow(0 0 14px #efc87655) drop-shadow(0 12px 10px #170a04a6); }
.live-table .seat.inactive .avatar { filter:var(--grade) brightness(.72) saturate(.6) drop-shadow(0 12px 10px #170a04a6); }
/* Lamp light from above and behind, table shadow across the lower body - clipped to the character's own silhouette. */
.live-table .seat:not(.empty-seat) .avatar:before {
  content:'';position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(120% 70% at 50% -8%,#ffd7942e,#0000 60%),linear-gradient(#0000 52%,#2a12063d 76%,#1a0a04a8 100%);
  -webkit-mask:url('/assets/western-characters.webp') var(--sprite-pos,0 0)/300% 200% no-repeat;mask:url('/assets/western-characters.webp') var(--sprite-pos,0 0)/300% 200% no-repeat;
}
.projected-scene .seat:after { bottom:-12px;left:-6%;right:-6%;height:24px;background:radial-gradient(ellipse at 50% 35%,#1a0b04b3,#1a0b0440 45%,transparent 72%); }
.projected-scene .seat { transform:translate(-50%,-100%); }
.projected-scene .seat-0 .avatar,.projected-scene .seat-1 .avatar,.projected-scene .seat-2 .avatar,.projected-scene .seat-3 .avatar,.projected-scene .seat-4 .avatar { opacity:1; }
.live-table .seat-name { background:linear-gradient(#2c211bf2,#18110df5);border-color:#c79f6152; }

/* -- Pot and chips: side by side in the open felt (placement computed in app.js) -- */
.projected-scene .table-center { width:var(--pool-width,130px); }
.projected-scene .pot-label { font-size:10px;letter-spacing:2px; }
.projected-scene .bet-tag { font-size:10px;color:#dcc59c; }
.projected-scene .pot-value { font-size:32px; }

/* -- Readability -- */
.live-table .actions-grid small { font-size:10px;opacity:.72; }
.live-table .reveal-tools .peel-hint { font-size:10px; }
.live-table .reveal-all:disabled { opacity:.5;border-style:dashed; }
.live-table .hand-caption { font-size:10px; }

/* -- Phone portrait: scene on top, hand panel underneath (no overlap), cards are the hero -- */
@media (max-width:650px) and (orientation:portrait) {
  .game-layout.live-table { --layout-split:1;display:flex;flex-direction:column;min-height:0;height:calc(100dvh - 52px); }
  .game-layout.live-table .arena { position:relative;inset:auto;flex:1 1 auto;min-height:190px!important;height:auto; }
  .game-layout.live-table .your-panel { position:relative;flex:0 0 auto;margin-top:-22px;padding:16px 12px calc(10px + env(safe-area-inset-bottom));row-gap:6px;
    background:linear-gradient(#120c0800,#140d09f2 22px,#110b08 60px);grid-template-areas:'identity status' 'hand hand' 'tools tools' 'actions actions'; }
  .game-layout.live-table .your-heading { align-self:center; }
  .game-layout.live-table .my-id strong { font-size:12px; }.game-layout.live-table .my-id .room-label { font-size:9px; }
  .game-layout.live-table .your-heading .your-balance { font-size:17px; }.game-layout.live-table .your-balance small { font-size:9px; }
  .game-layout.live-table .action-status { font-size:11px;line-height:1.4;max-width:190px;align-self:center; }
  .game-layout.live-table.projected-scene .your-hand { --hand-width:clamp(60px,min(25vw,13.5svh),106px);gap:clamp(12px,4.5vw,26px);min-height:0;padding:2px 0 20px; }
  .game-layout.live-table.projected-scene .your-hand .physical-card { width:var(--hand-width);height:calc(var(--hand-width)*1.45); }
  .game-layout.live-table.projected-scene .your-hand.five-cards { gap:7px; }
  .game-layout.live-table.projected-scene .your-hand.five-cards .physical-card { width:min(calc((100vw - 52px)/5),calc(var(--hand-width)*.78));height:calc(min(calc((100vw - 52px)/5),calc(var(--hand-width)*.78))*1.45); }
  .game-layout.live-table .reveal-tools { min-height:32px; }.game-layout.live-table .reveal-all { min-height:34px; }
  .game-layout.live-table .actions-grid { gap:6px; }
  .game-layout.live-table .actions-grid button { min-height:clamp(40px,5.6svh,48px);font-size:13px;padding:4px 3px;line-height:1.25; }
  .game-layout.live-table .actions-grid small { font-size:10px; }
  .game-layout.live-table .result-callout { align-self:center; }
}

/* -- Short landscape phones: scene on the left, hand + controls in a column on the right -- */
@media (orientation:landscape) and (max-height:600px) {
  .game-layout.live-table { --layout-split:1;display:flex;flex-direction:row;min-height:0;height:calc(100dvh - 41px); }
  .game-layout.live-table .arena { position:relative;inset:auto;flex:1 1 auto;min-width:0;min-height:0!important;height:auto; }
  .game-layout.live-table .your-panel { position:relative;flex:0 0 clamp(250px,38vw,360px);margin-left:-18px;padding:10px 12px calc(8px + env(safe-area-inset-bottom)) 26px;
    display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'identity status' 'hand hand' 'tools tools' 'actions actions';grid-template-rows:auto 1fr auto auto;row-gap:5px;column-gap:6px;align-content:stretch;
    background:linear-gradient(90deg,#120c0800,#140d09f0 18px,#110b08 48px); }
  .game-layout.live-table .your-heading { flex-direction:row;align-items:center;gap:8px;align-self:center; }
  .game-layout.live-table .my-portrait { width:28px;height:28px;min-width:28px; }
  .game-layout.live-table .my-id strong { font-size:11px; }.game-layout.live-table .my-id .room-label { font-size:8px; }
  .game-layout.live-table .your-heading .your-balance { font-size:16px; }.game-layout.live-table .your-balance small { font-size:8px; }
  .game-layout.live-table .action-status { font-size:10px;line-height:1.3;max-width:150px; }
  .game-layout.live-table.projected-scene .your-hand { --hand-width:clamp(48px,min(8.6vw,19svh),82px);gap:clamp(8px,1.8vw,16px);min-height:0;padding:0 0 18px;align-self:center; }
  .game-layout.live-table.projected-scene .your-hand .physical-card { width:var(--hand-width);height:calc(var(--hand-width)*1.45); }
  .game-layout.live-table.projected-scene .your-hand.five-cards { gap:5px; }
  .game-layout.live-table.projected-scene .your-hand.five-cards .physical-card { width:calc(var(--hand-width)*.74);height:calc(var(--hand-width)*1.07); }
  .game-layout.live-table .hand-caption { font-size:9px; }
  .game-layout.live-table .reveal-tools,.game-layout.live-table .result-callout { min-height:28px; }
  .game-layout.live-table .reveal-tools .peel-hint { font-size:9px;max-width:none; }
  .game-layout.live-table .reveal-all { min-height:30px;font-size:10px; }
  .game-layout.live-table .actions-grid,.game-layout.live-table .actions-grid.niu-actions { grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;max-width:none; }
  .game-layout.live-table .actions-grid.idle-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .game-layout.live-table .actions-grid .wide { grid-column:1/-1; }
  .game-layout.live-table .actions-grid button { min-height:clamp(36px,10.5svh,46px);font-size:12px;padding:3px 2px;line-height:1.2; }
  .game-layout.live-table .actions-grid small { font-size:9px; }
}
/* -- Tablet / desktop: keep the original overlay, just give the cards a little more presence -- */
@media (min-width:651px) and (min-height:601px), (orientation:portrait) and (min-width:651px) {
  .game-layout.live-table.projected-scene .your-hand .physical-card { width:92px;height:134px; }
}

/* -- Card face scales with the card, and matches the paper mesh texture in paper-card.js exactly -- */
.your-hand .physical-card { container-type:inline-size; }
.your-hand .physical-card .card-front { padding:0; }
.your-hand .physical-card .card-front > b { position:absolute;left:9cqw;top:8cqw;font:700 32cqw/1 Georgia,serif; }
.your-hand .physical-card .card-front > span { position:absolute;left:10cqw;top:42cqw;font-size:22cqw;line-height:1; }
.your-hand .physical-card .card-front > em { position:absolute;left:50%;top:56%;right:auto;bottom:auto;transform:translate(-50%,-50%);font-size:52cqw;line-height:1;font-style:normal; }
.your-hand .physical-card .card-bottom { position:absolute;right:9cqw;bottom:8cqw;left:auto;top:auto;transform:rotate(180deg);transform-origin:50% 50%;display:block;text-align:left; }
.your-hand .physical-card .card-bottom b { display:block;font:700 18cqw/1 Georgia,serif; }
.your-hand .physical-card .card-bottom span { display:block;font-size:13cqw;line-height:1;margin-top:1cqw; }

/* -- Tight table: one-line pot, smaller pile -- */
.ledger-tight .table-center .pot-label,.ledger-tight .table-center .bet-tag,.ledger-tight .table-center .niu-stage-title+.bet-tag { display:none; }
.ledger-tight.projected-scene .pot-value { font-size:22px; }
.ledger-tight.projected-scene .chip-bank { transform:translate(-50%,-50%) scale(calc(var(--chip-scale,1)*.7)); }
.ledger-tight.projected-scene .niu-stage-title { font-size:16px;margin:2px 0; }
/* -- Button captions never wrap; identity keeps its line -- */
.live-table .actions-grid small { display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%; }
.live-table .my-id strong,.live-table .my-id .room-label { white-space:nowrap; }
.live-table .your-heading { min-width:0; }
@media (orientation:landscape) and (max-height:600px) {
  .game-layout.live-table .your-panel { grid-template-columns:minmax(0,1fr) minmax(0,.9fr); }
  .game-layout.live-table .action-status { max-width:none;text-align:right; }
}
@media (max-width:650px) and (orientation:portrait) {
  .game-layout.live-table .actions-grid.idle-actions button { min-height:clamp(40px,6svh,50px); }
  .game-layout.live-table .result-callout { padding:6px 8px;font-size:11px; }
}
@media (max-width:650px) and (orientation:portrait) and (max-height:700px) {
  .game-layout.live-table.projected-scene .your-hand { --hand-width:clamp(56px,min(22vw,12svh),90px); }
  .game-layout.live-table .your-panel { row-gap:4px;padding-top:12px; }
}

/* -- Prep room -- */
.actions-grid button.wide { flex-direction:row;gap:10px; }
.prepare-table .your-hand { min-height:0;padding:6px 0; }
.prepare-table .hand-empty { padding:8px 0;font-size:15px; }
.prepare-table .hand-empty .empty-spade { font-size:26px;margin-bottom:4px; }
.prepare-table .hand-empty small { margin-top:4px; }
@media (orientation:landscape) and (max-height:600px) {
  .prepare-table .table-center { top:63%; }
  .prepare-table .waiting-copy { font-size:14px;line-height:1.5;white-space:nowrap; }
  .prepare-table .waiting-copy small { font-size:9px;max-width:none;line-height:1.5;white-space:normal; }
  .prepare-table .arena:after { bottom:24px; }
  .prepare-table .your-panel { overflow-y:auto;overscroll-behavior:contain; }
  .prepare-table .hand-empty { font-size:13px;padding:4px 0; }.prepare-table .hand-empty .empty-spade,.prepare-table .hand-empty small { display:none; }
  .prepare-table .action-status { margin:2px 0; }
}
@media (max-width:650px) and (orientation:portrait) {
  .prepare-table .hand-empty .empty-spade { display:none; }
}
@media (max-width:650px) and (orientation:portrait) {
  .prepare-table .table-wordmark { display:none; }
  .prepare-table .table-center { top:55%;width:58%; }
  .prepare-table .waiting-copy { font-size:17px;line-height:1.5; }
}

/* ===== One deck: the DOM back, DOM face and paper-mesh textures share these exact proportions (cqw of card width) ===== */
.your-hand .physical-card > .card-back-sheet,.your-hand .physical-card > .card-front { border:3cqw solid #e4d7b9;border-radius:6cqw; }
.your-hand .physical-card > .card-back-sheet { background:linear-gradient(135deg,#2a414b,#132630); }
.your-hand .physical-card .card-back-pattern { inset:3.5cqw;border:max(1px,.8cqw) solid #d0b56c8c;border-radius:2.5cqw;
  background:repeating-linear-gradient(45deg,transparent 0 6cqw,#cfb16d26 6cqw 7cqw),repeating-linear-gradient(-45deg,transparent 0 6cqw,#cfb16d16 6cqw 7cqw); }
.your-hand .physical-card .card-seal { left:50%;top:44%;transform:translate(-50%,-50%);width:42cqw;height:54cqw;font-size:30cqw;line-height:1;
  border:max(1px,.9cqw) solid #c0a2639c;background:#1b303b;box-shadow:0 0 0 2.5cqw #172c3488,0 0 0 3.4cqw #c0a26340; }
.your-hand .physical-card .back-caption { bottom:11cqw;font-size:7cqw;letter-spacing:2cqw;line-height:1;text-indent:2cqw; }
/* The face shares the back's cream border plus a fine gold inner frame, so both sides read as the same deck. */
.your-hand .physical-card > .card-front { background:linear-gradient(115deg,#fff8e8,#e7decd);box-shadow:inset 0 0 0 max(1px,.6cqw) #f6eedb,0 4px 1px #9a8c6c,0 9px 13px #0c08068f; }
.your-hand .physical-card > .card-front:before { content:'';position:absolute;inset:3.5cqw;border:max(1px,.8cqw) solid #c9a96a55;border-radius:2.5cqw;pointer-events:none; }
.your-hand .physical-card .card-front > b { left:7cqw;top:6cqw; }
.your-hand .physical-card .card-front > span { left:8cqw;top:40cqw; }
.your-hand .physical-card .card-bottom { right:7cqw;bottom:6cqw; }

/* ===== Table talk & settlement ===== */
.react-button { flex:0 0 auto;width:34px;height:34px;min-width:34px;margin-left:auto;border-radius:50%;border:1px solid #c79f6155;background:#21170fd9;font-size:17px;line-height:1;display:grid;place-items:center;cursor:pointer;box-shadow:inset 0 1px #fff1d30f; }
.react-button:active { transform:scale(.94); }
.your-heading { display:flex;align-items:center;gap:8px; }
.react-bar { position:fixed;z-index:60;display:flex;flex-wrap:wrap;gap:4px;max-width:min(330px,calc(100vw - 16px));padding:7px;border-radius:14px;background:#1c140ef7;border:1px solid #c79f6166;box-shadow:0 14px 34px #000a;animation:react-in .16s ease-out; }
.react-bar button { width:38px;height:38px;border:0;border-radius:10px;background:#2b2016;font-size:21px;cursor:pointer; }
.react-bar button:hover,.react-bar button:focus-visible { background:#3d2d1f; }
.react-bar .nudge { width:auto;padding:0 12px;font-size:13px;color:#2b2117;background:linear-gradient(145deg,#e4c996,#bd955b);font-weight:650; }
.reaction-bubble { position:fixed;z-index:55;transform:translate(-50%,-100%);pointer-events:none;font-size:30px;line-height:1;padding:8px 10px;border-radius:16px 16px 16px 4px;background:#fff7e6f2;box-shadow:0 8px 20px #0007;animation:bubble 2.6s ease-out both; }
.reaction-bubble.nudge { font-size:14px;font-weight:650;color:#5a2f17;padding:8px 12px; }
@keyframes bubble { 0%{opacity:0;transform:translate(-50%,-70%) scale(.6)} 12%{opacity:1;transform:translate(-50%,-100%) scale(1.08)} 20%{transform:translate(-50%,-100%) scale(1)} 80%{opacity:1} 100%{opacity:0;transform:translate(-50%,-135%)} }
@keyframes react-in { from{opacity:0;transform:translateY(6px)} }

.settle-card { position:fixed;z-index:50;left:50%;top:50%;transform:translate(-50%,-50%);width:min(340px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto;padding:14px 16px 12px;border-radius:16px;
  background:linear-gradient(#2a1d13f7,#18110cf9);border:1px solid #d3b07a66;box-shadow:0 24px 60px #000c,inset 0 1px #fff3d214;color:#ead7b2;animation:settle-in .38s cubic-bezier(.2,.8,.2,1) both; }
.settle-card.leaving { animation:settle-out .5s ease-in both; }
.settle-card header { display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#b99a6c;letter-spacing:1px; }
.settle-card header .icon-button { width:30px;height:30px;min-height:30px;font-size:18px; }
.settle-card h3 { margin:6px 0 10px;font:600 19px/1.3 'KaiTi','Microsoft YaHei',sans-serif;color:#f3d9a6;letter-spacing:1px; }
.settle-card ul { list-style:none;margin:0;padding:0;display:grid;gap:6px; }
.settle-card li { display:grid;grid-template-columns:30px 1fr auto;grid-template-areas:'av name delta' 'av cat delta';column-gap:9px;align-items:center;padding:6px 8px;border-radius:10px;background:#ffffff08; }
.settle-card li.me { background:#d3b07a1f;outline:1px solid #d3b07a55; }
.settle-card .settle-avatar { grid-area:av;width:30px;height:30px;border-radius:50%;background-image:url('/assets/tavern-animals.webp');background-size:300% 200%;border:1px solid #c79f6166; }
.settle-card li b { grid-area:name;font-size:13px;font-weight:600; }.settle-card li b em { font-style:normal;font-size:10px;margin-left:6px;padding:1px 5px;border-radius:6px;background:#d3b07a33;color:#f0d29b; }
.settle-card li small { grid-area:cat;font-size:10px;color:#b49a72;min-height:12px; }
.settle-card li strong { grid-area:delta;font:600 18px Georgia,serif; }
.settle-card li.up strong { color:#8fd18b; }.settle-card li.down strong { color:#e6907e; }
.settle-card footer { margin-top:10px;font-size:11px;color:#a58c66;text-align:center; }
@keyframes settle-in { from{opacity:0;transform:translate(-50%,-44%) scale(.94)} }
@keyframes settle-out { to{opacity:0;transform:translate(-50%,-56%) scale(.97)} }
@media (prefers-reduced-motion:reduce) { .settle-card,.settle-card.leaving,.reaction-bubble,.react-bar { animation:none; } }

/* ===== What just happened: action labels + turn countdown ===== */
.action-cue { position:fixed;z-index:54;transform:translate(-50%,-100%);pointer-events:none;white-space:nowrap;padding:5px 11px;border-radius:999px;font:650 13px/1.2 'Microsoft YaHei',sans-serif;letter-spacing:.5px;
  color:#2b2117;background:linear-gradient(145deg,#f1dcb0,#cfa96c);box-shadow:0 6px 16px #0009,inset 0 1px #fff6;animation:cue-pop 1.9s cubic-bezier(.2,.8,.2,1) both; }
.action-cue.tone-hot { background:linear-gradient(145deg,#ffb36b,#e0663f);color:#2a0f05; }
.action-cue.tone-alert { background:linear-gradient(145deg,#f5d36e,#d79a2b);color:#2b1a05; }
.action-cue.tone-info { background:#1d2c33f2;color:#dce9ea;box-shadow:0 6px 16px #0009,inset 0 0 0 1px #8fb2b866; }
.action-cue.tone-muted { background:#2a2420f0;color:#b9aa95;box-shadow:0 6px 16px #0008,inset 0 0 0 1px #ffffff1a; }
@keyframes cue-pop { 0%{opacity:0;transform:translate(-50%,-60%) scale(.7)} 12%{opacity:1;transform:translate(-50%,-110%) scale(1.06)} 22%{transform:translate(-50%,-110%) scale(1)} 78%{opacity:1} 100%{opacity:0;transform:translate(-50%,-150%)} }

/* Acting player's nameplate: glow + draining countdown bar */
.live-table .seat.current .seat-name { border-color:#f0cf8acc;box-shadow:0 0 0 1px #f0cf8a66,0 0 16px #f0cf8a55,0 5px 10px #140b0755;overflow:hidden; }
.live-table.timed .seat.current .seat-name:after { content:'';position:absolute;left:0;bottom:0;height:3px;width:100%;transform-origin:left center;transform:scaleX(var(--turn-left,1));
  background:linear-gradient(90deg,#f0cf8a,#ffe7b0);transition:transform .5s linear,background .3s; }
.live-table.turn-urgent .seat.current .seat-name:after { background:linear-gradient(90deg,#e0663f,#ff9a6b); }
.live-table.turn-urgent .seat.current .seat-name { animation:urgent-pulse 1s ease-in-out infinite; }
@keyframes urgent-pulse { 50%{box-shadow:0 0 0 1px #e0663f99,0 0 18px #e0663f88,0 5px 10px #140b0755} }
/* My turn: the controls light up and carry the same countdown */
.live-table.my-turn .actions-grid { position:relative; }
.live-table.my-turn.timed .actions-grid:before { content:'';position:absolute;left:0;right:0;top:-6px;height:3px;border-radius:2px;transform-origin:left center;transform:scaleX(var(--turn-left,1));background:linear-gradient(90deg,#f0cf8a,#ffe7b0);transition:transform .5s linear; }
.live-table.my-turn.turn-urgent .actions-grid:before { background:linear-gradient(90deg,#e0663f,#ff9a6b); }
.live-table.my-turn .actions-grid .button.gold:not(:disabled) { animation:gold-breathe 1.8s ease-in-out infinite; }
@keyframes gold-breathe { 50%{box-shadow:inset 0 1px #fff3d291,0 3px 0 #785a33,0 0 22px #f0cf8a88} }
@media (prefers-reduced-motion:reduce) { .action-cue,.live-table.turn-urgent .seat.current .seat-name,.live-table.my-turn .actions-grid .button.gold { animation:none; } }

/* ===== Prep room = the same saloon table; open chairs invite friends ===== */
.live-table.waiting-table .open-seat { display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0;border:0;background:none;color:inherit;cursor:pointer;font:inherit; }
.live-table.waiting-table .open-seat .avatar { position:relative;display:grid;place-items:center;width:62%;height:auto;aspect-ratio:1/1.05;margin:0 auto -2px;border-radius:46% 46% 10px 10px;
  border:1.5px dashed #e6c58a77;background:radial-gradient(circle at 50% 40%,#f2d09a1f,#1a100866 70%);box-shadow:inset 0 0 18px #0008;color:#f0d29b;font-size:clamp(16px,4vw,26px);transition:transform .2s,border-color .2s; }
.live-table.waiting-table .open-seat .avatar i { font-style:normal;opacity:.85; }
.live-table.waiting-table .open-seat:hover .avatar,.live-table.waiting-table .open-seat:focus-visible .avatar { transform:translateY(-3px);border-color:#f0d29bcc; }
.live-table.waiting-table .open-seat .seat-name { position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);width:max-content;max-width:120%;margin:0;padding:3px 8px;font-size:10px;color:#cdb58c;background:#1b130dcc;border:1px dashed #c79f6155;border-radius:5px;box-shadow:none; }
.live-table.waiting-table .open-seat:after { opacity:.5; }
.live-table.waiting-table .waiting-copy { font:600 clamp(16px,4.6vw,22px)/1.45 'KaiTi','Microsoft YaHei',serif;color:#f2d9ad;text-shadow:0 2px 12px #000;letter-spacing:2px;white-space:nowrap; }
.live-table.waiting-table .waiting-copy small { display:block;font:400 11px/1.6 'Microsoft YaHei',sans-serif;letter-spacing:1px;color:#d2b88f;white-space:nowrap; }
.live-table.waiting-table .your-hand,.live-table.waiting-table .hand-caption,.live-table.waiting-table .reveal-tools { display:none; }
.live-table.waiting-table .bot-invite-button { display:flex;grid-column:1/-1;align-items:center;justify-content:center;gap:8px;min-height:40px; }
.live-table .result-callout { display:none; }
@media (orientation:landscape) and (max-height:600px) {
  .game-layout.live-table.waiting-table .your-panel,.game-layout.live-table:not(.waiting-table) .your-panel:not(:has(.your-hand .physical-card)) { grid-template-rows:auto;align-content:end;row-gap:7px; }
}
.live-table.waiting-table .bot-invite-button { align-self:start; }
@media (min-width:651px) and (min-height:601px) {
  .live-table .your-heading .react-button { margin-left:0;align-self:flex-start; }
}
@media (orientation:landscape) and (max-height:600px) and (max-width:760px) {
  .game-layout.live-table .my-id .room-label { display:none; }
  .game-layout.live-table .your-heading { gap:6px; }
  .game-layout.live-table .your-heading .your-balance { font-size:14px;white-space:nowrap; }
  .game-layout.live-table .react-button { width:30px;height:30px;min-width:30px;font-size:15px; }
}
.live-table .my-id { flex-shrink:0;min-width:0; }
@media (orientation:landscape) and (max-height:600px) {
  .game-layout.live-table .your-panel { grid-template-columns:minmax(0,1fr);grid-template-areas:'identity' 'status' 'hand' 'tools' 'actions'; }
  .game-layout.live-table .action-status { justify-self:start;text-align:left;font-size:10px; }
}

/* ===== Lobby: on phones the first screen is "pick a character, name, open a room" ===== */
@media (max-width:650px) {
  .lobby-screen { display:flex;flex-direction:column;gap:12px;padding-top:6px; }
  .lobby-intro { position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 10px;padding:8px 2px 2px;min-height:0; }
  .lobby-intro .eyebrow { grid-column:1/-1;margin:0;font-size:10px; }
  .lobby-intro h1 { margin:0;font-size:clamp(26px,8vw,34px);line-height:1.12; }
  .lobby-intro .intro-copy,.lobby-intro .hero-cards,.lobby-intro .lobby-features { display:none; }
  .lobby-intro .tavern-cast { position:static;transform:none;margin:0;grid-row:2;grid-column:2;display:flex;gap:0; }
  .lobby-intro .tavern-cast i { display:none; }
  .lobby-intro .tavern-cast .cast-portrait { width:46px;height:62px;margin-left:-14px;border-radius:24px 24px 8px 8px; }
  .entry-panel { padding:16px 14px 14px; }
  .entry-panel .entry-topline,.entry-panel .entry-caption { display:none; }
  .entry-panel h2 { margin:0 0 10px;font-size:20px; }
  .entry-panel .mode-tabs { margin-bottom:10px; }
  .entry-panel #entry-form label { margin-top:10px; }
  .entry-panel .avatar-picker { gap:6px; }
  .entry-panel .game-picker button { padding:8px 4px; }
  .entry-panel .game-picker small { display:block;white-space:normal;font-size:9px;line-height:1.3;margin-top:3px; }
  /* The main action stays reachable while scrolling the form. */
  .entry-panel .entry-submit { position:sticky;bottom:calc(10px + env(safe-area-inset-bottom));z-index:5;margin-top:14px;box-shadow:inset 0 1px #fff3d291,0 3px 0 #785a33,0 12px 26px #000c; }
  .entry-note { margin-top:10px; }
}
@media (max-width:380px) {
  .entry-panel .avatar-picker { grid-template-columns:repeat(6,minmax(0,1fr));gap:3px; }
  .entry-panel .character-choice { flex-direction:column;min-height:56px;padding:4px 1px;gap:3px;font-size:9px; }
  .lobby-intro .tavern-cast { display:none; }
  .lobby-intro { grid-template-columns:1fr; }
  .lobby-intro h1 { font-size:26px; }
  .lobby-intro h1 br { display:none; }
}

/* ===== Sheets: rules with real hands, leaderboard, grouped menu ===== */
.rules-lead,.stats-lead,.menu-summary { font-size:13px;line-height:1.7;color:#d8c4a2; }
.rules-lead b { color:#f0d29b;font-weight:600; }
.rules-h,.menu-h { margin:16px 0 8px;font:600 12px/1 'Microsoft YaHei',sans-serif;letter-spacing:2px;color:#b9996a; }
.hand-ladder { list-style:none;margin:0;padding:0;display:grid;gap:6px;counter-reset:rank; }
.hand-ladder li { display:grid;grid-template-columns:auto 52px 1fr;align-items:center;gap:10px;padding:7px 9px;border-radius:10px;background:#ffffff08;border:1px solid #ffffff0d; }
.hand-ladder li:first-child { background:linear-gradient(90deg,#d3b07a26,#ffffff08);border-color:#d3b07a44; }
.hand-ladder b { font:600 15px 'KaiTi','Microsoft YaHei',serif;color:#f2d9ad; }
.hand-ladder small { font-size:11px;color:#a99172; }
.demo-hand { display:flex;gap:3px; }
.demo-hand i { display:grid;place-items:center;width:30px;height:42px;border-radius:4px;background:linear-gradient(115deg,#fff8e8,#e7decd);border:2px solid #e4d7b9;color:#234434;font:600 11px/1 Georgia,serif;font-style:normal;box-shadow:0 2px 4px #0006; }
.demo-hand i.red { color:#a9493e; }
.rules-cards { list-style:none;margin:0;padding:0;display:grid;gap:7px; }
.rules-cards li { padding:9px 11px;border-radius:10px;background:#ffffff08;font-size:12px;line-height:1.65;color:#cdb898; }
.rules-cards li b { display:block;font-size:13px;color:#f0d29b;margin-bottom:2px; }
.rules-cards li em { font-style:normal;color:#ffb36b;font-weight:600; }
.rules-cards.compact li { padding:7px 11px; }

.leaderboard { list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px; }
.leaderboard li { display:grid;grid-template-columns:28px 34px 1fr auto;align-items:center;gap:9px;padding:8px 10px;border-radius:12px;background:#ffffff08; }
.leaderboard li.me { background:#d3b07a1f;outline:1px solid #d3b07a55; }
.leaderboard .rank { font-size:18px;text-align:center;color:#b9996a; }
.leaderboard .settle-avatar { width:34px;height:34px;border-radius:50%;background-image:url('/assets/tavern-animals.webp');background-size:300% 200%;border:1px solid #c79f6166; }
.leaderboard .who { display:grid;gap:2px;min-width:0; }
.leaderboard .who b { font-size:14px;color:#f1dfbd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.leaderboard .who b em { font-style:normal;font-size:10px;margin-left:6px;padding:1px 5px;border-radius:6px;background:#d3b07a33;color:#f0d29b; }
.leaderboard .who b em.bot { background:#8fb2b833;color:#cfe3e6; }
.leaderboard .who small { font-size:11px;color:#a99172; }
.leaderboard .net-bar { display:block;height:3px;border-radius:2px;width:var(--w);min-width:2px;background:#8fd18b; }
.leaderboard .net-bar.down { background:#e6907e; }
.leaderboard strong { font:600 17px Georgia,serif; }
.leaderboard strong.positive,.history-list i.positive { color:#8fd18b; }.leaderboard strong.negative,.history-list i.negative { color:#e6907e; }
.history-list { list-style:none;margin:0 0 12px;padding:0;display:grid;gap:5px; }
.history-list li { display:grid;grid-template-columns:auto 1fr;gap:2px 10px;padding:7px 10px;border-radius:9px;background:#ffffff06;font-size:12px;color:#cdb898; }
.history-list .hn { color:#a99172; }.history-list .hw b { color:#8fd18b;font-weight:600; }
.history-list .hr { grid-column:1/-1;font-size:11px;color:#a08a6b; }.history-list i { font-style:normal; }

.menu-summary b { color:#f0d29b;font-weight:600; }
.sheet-options .menu-row { justify-content:space-between; }
.sheet-options .menu-row.toggle .switch { position:relative;width:38px;height:22px;border-radius:11px;background:#3a2e25;box-shadow:inset 0 0 0 1px #ab865155;transition:background .2s; }
.sheet-options .menu-row.toggle .switch:after { content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#bfa983;transition:transform .2s,background .2s; }
.sheet-options .menu-row.toggle.on .switch { background:#bd955b; }
.sheet-options .menu-row.toggle.on .switch:after { transform:translateX(16px);background:#fff3d6; }
.sheet-options.leave-row { margin-top:16px; }

/* ===== Leave button (top right) and room score history ===== */
.room-actions .leave-button { color:#e6b4a4;border-color:#d0806a55;background:#2a1712cc; }
.room-actions .leave-button:hover { background:#3a1d16; }
.score-chart { display:block;width:100%;height:auto;margin:4px 0 6px;overflow:visible; }
.score-chart line.grid { stroke:#ffffff14;stroke-width:1; }
.score-chart line.zero { stroke:#d3b07a55;stroke-width:1;stroke-dasharray:3 3; }
.score-chart text { fill:#a58c66;font-size:9px;font-family:Georgia,serif; }
.score-chart polyline { fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;opacity:.85; }
.score-chart polyline.me { stroke-width:3.2;opacity:1; }
.score-legend { display:flex;flex-wrap:wrap;gap:6px 12px;margin-bottom:6px;font-size:12px;color:#d8c4a2; }
.score-legend span { display:inline-flex;align-items:center;gap:5px; }
.score-legend span.me { font-weight:600;color:#f1dfbd; }
.score-legend i,.hand-table th i { display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:3px;vertical-align:middle; }
.score-legend b { font:600 12px Georgia,serif; }
.score-legend .positive,.hand-table .positive { color:#8fd18b; }.score-legend .negative,.hand-table .negative { color:#e6907e; }
.hand-table-wrap { max-height:240px;overflow:auto;border-radius:10px;background:#ffffff06;margin-bottom:12px; }
.hand-table { width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap; }
.hand-table th,.hand-table td { padding:6px 8px;text-align:right; }
.hand-table thead th { position:sticky;top:0;background:#241a12;color:#b9996a;font-weight:500;font-size:11px;text-align:right; }
.hand-table tbody th { text-align:left;color:#a58c66;font-weight:400; }
.hand-table tbody tr:nth-child(odd) { background:#ffffff05; }
.hand-table td { font-family:Georgia,serif; }.hand-table td.none { color:#6d5a44; }
.hand-table tfoot th,.hand-table tfoot td { position:sticky;bottom:0;background:#241a12;font-weight:600;border-top:1px solid #d3b07a33; }

/* ===== Look status badges, peek button/panel, custom points ===== */
.look-badge { display:inline-flex;align-items:center;justify-content:center;gap:3px;margin:0 auto 4px;padding:3px 9px;border-radius:999px;font:700 12px/1.1 'Microsoft YaHei',sans-serif;letter-spacing:.5px;white-space:nowrap;box-shadow:0 3px 8px #0008; }
.look-badge.blind { background:#1c2a31f2;color:#cfe3e6;border:1px solid #8fb2b888;min-width:30px; }
.look-badge.seen { background:linear-gradient(145deg,#f3d9a2,#cfa865);color:#2b1d0d;border:1px solid #fff2cf88; }
.look-badge.out { background:#2a2420e8;color:#9d8e7a;border:1px solid #ffffff22; }
.look-badge.peek { background:linear-gradient(145deg,#ffb36b,#e0663f);color:#2a0f05;animation:peek-blink 1.6s ease-in-out infinite; }
@keyframes peek-blink { 50%{ box-shadow:0 0 0 3px #e0663f55,0 3px 8px #0008; } }
.projected-scene .seat-info { display:flex;flex-direction:column;align-items:center; }
.your-heading .look-badge { margin:0 0 0 2px;font-size:12px; }
@media (max-width:650px) and (orientation:portrait) { .look-badge { font-size:11px;padding:2px 7px; } }
.peek-button { grid-column:1/-1;width:100%;min-height:46px;flex-direction:column;gap:2px;background:linear-gradient(145deg,#ffb36b,#e0663f)!important;color:#2a0f05!important;font-weight:700; }
.peek-button small { font-size:10px;opacity:.8;font-weight:500; }
.peek-panel { grid-column:1/-1;border-radius:12px;padding:8px 10px;background:#1b130df2;border:1px solid #e0663f66;max-height:40vh;overflow:auto; }
.peek-panel h4 { margin:0 0 6px;font-size:13px;color:#ffc58f; }.peek-panel h4 small { font-size:10px;color:#b49a72;font-weight:400;margin-left:6px; }
.peek-panel ul { list-style:none;margin:0;padding:0;display:grid;gap:6px; }
.peek-panel li { display:grid;grid-template-columns:28px 1fr auto auto;align-items:center;gap:8px; }
.peek-panel li.out { opacity:.6; }
.peek-panel .settle-avatar { width:28px;height:28px;border-radius:50%;background-image:url('/assets/tavern-animals.webp');background-size:300% 200%; }
.peek-panel b { font-size:13px;color:#f1dfbd;display:grid; }.peek-panel b small { font-size:10px;color:#a99172;font-weight:400; }
.peek-panel em { font-style:normal;font-size:12px;color:#f0d29b;min-width:34px;text-align:right; }
.peek-panel .demo-hand i { width:26px;height:36px;font-size:10px; }
.initial-custom { margin-top:6px;width:100%; }
.check-row { display:flex;gap:10px;align-items:flex-start;margin:14px 0 4px;padding:10px;border-radius:10px;background:#ffffff08;cursor:pointer; }
.check-row input { width:20px;height:20px;margin-top:2px;accent-color:#d3a55d;flex:0 0 auto; }
.check-row b { display:block;font-size:13px;color:#f0d29b; }.check-row small { display:block;font-size:11px;color:#a99172;line-height:1.5;margin-top:2px; }

/* ===== Card reveal v2: DOM "squeeze" peel (replaces the WebGL paper mesh) ===== */
.your-hand .physical-card.peel2 { overflow:visible!important;transform-style:flat; }
.your-hand .physical-card.peel2 > .card-front { visibility:visible!important;transform:none!important;z-index:1;backface-visibility:visible; }
.your-hand .physical-card.peel2.peel-idle:not(.fully-open) > .card-front { visibility:hidden!important; }
.your-hand .physical-card.peel2 > .card-back-sheet { visibility:visible!important;transform:none!important;z-index:3;backface-visibility:visible; }
.your-hand .physical-card.peel2.fully-open > .card-back-sheet,.your-hand .physical-card.peel2.fully-open .peel-flap,.your-hand .physical-card.peel2.fully-open .peel-shade { display:none; }
.your-hand .physical-card.peel2 .paper-surface { display:none!important; }
.peel-shade { position:absolute;inset:0;z-index:2;border-radius:6cqw;pointer-events:none;opacity:0; }
.peel-flap { position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0; }
.peel-flap-paper { position:absolute;inset:0;border-radius:6cqw;transform-origin:0 0;box-shadow:inset 0 0 0 max(1px,.8cqw) #fff8e6aa; }
.your-hand .physical-card.peel2.fully-open { animation:card-settle .38s cubic-bezier(.2,1.4,.4,1); }
@keyframes card-settle { 0%{transform:translateY(-6px) scale(1.04)} 100%{transform:none} }
@media (prefers-reduced-motion:reduce) { .your-hand .physical-card.peel2.fully-open { animation:none; } }

/* ===== Thrown props + 2.5D hit reactions ===== */
.live-table .seat[data-do="prop-open"] { cursor:pointer; }
.flying-prop { position:fixed;z-index:58;width:46px;height:46px;pointer-events:none;transform:translate(-50%,-50%);filter:drop-shadow(0 8px 6px #0007); }
.flying-prop svg,.prop-row svg { width:100%;height:100%;display:block; }
.impact-dot { position:fixed;z-index:57;width:8px;height:8px;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%); }
.bomb-flash { position:fixed;z-index:56;width:240px;height:240px;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%) scale(.2);background:radial-gradient(circle,#fff8d6 0%,#ffd34dcc 25%,#ff8a3d66 50%,transparent 70%);animation:bomb-flash .7s ease-out forwards; }
@keyframes bomb-flash { 0%{transform:translate(-50%,-50%) scale(.2);opacity:1} 60%{opacity:.9} 100%{transform:translate(-50%,-50%) scale(1.3);opacity:0} }

/* The character reacts in 3D: knocked back, twisted toward the hit, squashed, then wobbles back. */
.hit { --hit-dir:1;transform-origin:50% 92%; }
.live-table .seat .avatar.hit,.my-portrait.hit { animation-duration:1s;animation-delay:var(--hit-t,0ms);animation-fill-mode:both;animation-timing-function:cubic-bezier(.2,.8,.3,1); }
.avatar.hit-knock,.my-portrait.hit-knock { animation-name:hit-knock; }
.avatar.hit-soak,.my-portrait.hit-soak { animation-name:hit-soak; }
.avatar.hit-cheer,.my-portrait.hit-cheer { animation-name:hit-cheer; }
.avatar.hit-blush,.my-portrait.hit-blush { animation-name:hit-blush; }
.avatar.hit-blast,.my-portrait.hit-blast { animation-name:hit-blast;animation-duration:1.4s; }
@keyframes hit-knock {
  0%   { transform:perspective(520px) translateY(2px); }
  9%   { transform:perspective(520px) translate(calc(var(--hit-dir) * 7px),2px) rotateY(calc(var(--hit-dir) * -30deg)) rotateX(10deg) rotateZ(calc(var(--hit-dir) * 9deg)) scale(1.08,.86); }
  26%  { transform:perspective(520px) translate(calc(var(--hit-dir) * -3px),0) rotateY(calc(var(--hit-dir) * 14deg)) rotateZ(calc(var(--hit-dir) * -6deg)) scale(.95,1.07); }
  44%  { transform:perspective(520px) rotateY(calc(var(--hit-dir) * -6deg)) rotateZ(calc(var(--hit-dir) * 3deg)) scale(1.02,.98); }
  64%  { transform:perspective(520px) rotateZ(calc(var(--hit-dir) * -1.5deg)); }
  100% { transform:perspective(520px) translateY(2px); }
}
@keyframes hit-soak {
  0%,100% { transform:perspective(520px) translateY(2px); }
  8%  { transform:perspective(520px) rotateX(14deg) scale(1.04,.9) translateY(4px); }
  20% { transform:perspective(520px) translateX(-3px) rotateZ(-2deg) scale(.98,1.03); }
  30% { transform:perspective(520px) translateX(3px) rotateZ(2deg); }
  40% { transform:perspective(520px) translateX(-3px) rotateZ(-1.5deg); }
  50% { transform:perspective(520px) translateX(2px) rotateZ(1deg); }
  62% { transform:perspective(520px) translateX(-1px); }
}
@keyframes hit-cheer {
  0%,100% { transform:perspective(520px) translateY(2px); }
  20% { transform:perspective(520px) translateY(-14px) rotateZ(-4deg) scale(1.05); }
  38% { transform:perspective(520px) translateY(0) scale(1.03,.96); }
  56% { transform:perspective(520px) translateY(-8px) rotateZ(4deg); }
  74% { transform:perspective(520px) translateY(1px); }
}
@keyframes hit-blush {
  0%,100% { transform:perspective(520px) translateY(2px); }
  18% { transform:perspective(520px) rotateY(calc(var(--hit-dir) * 18deg)) scale(1.06); filter:var(--grade) brightness(1.12) saturate(1.3) drop-shadow(0 0 14px #ff7aa088); }
  45% { transform:perspective(520px) rotateY(calc(var(--hit-dir) * -10deg)) translateY(-6px); filter:var(--grade) brightness(1.08) saturate(1.2) drop-shadow(0 0 10px #ff7aa066); }
  70% { transform:perspective(520px) translateY(0); }
}
@keyframes hit-blast {
  0%   { transform:perspective(520px) translateY(2px); }
  6%   { transform:perspective(520px) translateY(-18px) rotateX(-18deg) scale(1.12,.9); filter:brightness(2.2) saturate(.3); }
  16%  { transform:perspective(520px) translate(5px,-4px) rotateZ(5deg); filter:brightness(.32) contrast(1.5) sepia(.4); }
  24%  { transform:perspective(520px) translate(-5px,0) rotateZ(-5deg); }
  32%  { transform:perspective(520px) translate(4px,0) rotateZ(3deg); }
  40%  { transform:perspective(520px) translate(-2px,0) rotateZ(-1deg); filter:brightness(.4) contrast(1.4) sepia(.4); }
  85%  { filter:brightness(.75) sepia(.2); }
  100% { transform:perspective(520px) translateY(2px); }
}
/* Decals stick to the character's face, then slide down and fade. */
.hit-decal { position:absolute;left:50%;top:14%;width:56%;aspect-ratio:1;transform:translateX(-50%);pointer-events:none;z-index:2;
  animation:decal-life 4.6s cubic-bezier(.2,.7,.3,1) both;animation-delay:var(--hit-t,0ms);filter:drop-shadow(0 2px 2px #0005); }
.hit-decal svg { width:100%;height:100%;display:block; }
.decal-water { width:80%;top:6%; }
.decal-bomb { width:90%;top:0;filter:blur(1px); }
.my-portrait { position:relative; }
.my-portrait .hit-decal { width:90%;top:5%; }
@keyframes decal-life {
  0%   { transform:translateX(-50%) scale(.2) rotate(-12deg);opacity:0; }
  6%   { transform:translateX(-50%) scale(1.18) rotate(4deg);opacity:1; }
  12%  { transform:translateX(-50%) scale(1) rotate(0);opacity:1; }
  70%  { transform:translateX(-50%) translateY(10%) scale(1,1.06);opacity:.95; }
  100% { transform:translateX(-50%) translateY(26%) scale(.96,1.14);opacity:0; }
}

/* Prop picker and voice list */
.react-bar { display:flex;flex-direction:column;gap:6px; }
.react-bar .react-row { display:flex;flex-wrap:wrap;gap:4px; }
.react-bar .voice-list { display:grid;grid-template-columns:1fr 1fr;gap:4px;max-height:180px;overflow:auto; }
.react-bar .voice-list button { width:auto;height:auto;min-height:34px;padding:6px 8px;font-size:12px;text-align:left;color:#ead7b2;line-height:1.3; }
.react-tip { margin:0;font-size:11px;color:#b49a72;text-align:center; }.react-tip b { color:#f0d29b; }
.prop-bar .prop-row { display:grid;grid-template-columns:repeat(6,1fr);gap:4px; }
.prop-bar .prop-row button { width:auto;height:auto;display:grid;justify-items:center;gap:2px;padding:6px 2px;background:#2b2016;border:0;border-radius:10px;color:#ead7b2;cursor:pointer; }
.prop-bar .prop-row button span { width:34px;height:34px; }
.prop-bar .prop-row button small { font-size:10px; }
.prop-bar .prop-row button:active { transform:scale(.92); }
.reaction-bubble.voice { font-size:13px;font-weight:600;color:#3a2410;max-width:190px;line-height:1.35;white-space:normal;text-align:center;animation-duration:3.3s; }
@media (prefers-reduced-motion:reduce) { .hit,.hit-decal,.bomb-flash { animation:none!important; } }

/* ===== Strong-hand effects ===== */
.hand-fx { position:fixed;z-index:59;transform:translate(-50%,-50%);pointer-events:none;display:grid;place-items:center;text-align:center;animation:fx-pop 2.4s cubic-bezier(.2,.9,.3,1.2) both; }
.hand-fx.tier-3 { animation-duration:3.2s; }
.hand-fx::before { content:'';position:absolute;z-index:1;width:230px;height:120px;border-radius:50%;background:radial-gradient(closest-side,#120b06e6,#120b0699 60%,transparent); }
.hand-fx.tier-3::before { width:300px;height:150px;background:radial-gradient(closest-side,#4a0f08ee,#2a0805aa 60%,transparent); }
.hand-fx b { position:relative;z-index:2;font:900 46px/1.1 'STKaiti','KaiTi','Microsoft YaHei',serif;letter-spacing:6px;background:linear-gradient(180deg,#fffdf2 0%,#fff0b8 35%,#ffd060 62%,#f5a623 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-stroke:.6px #7a4a0c;filter:drop-shadow(0 3px 0 #5a2e04) drop-shadow(0 0 14px #ffd36acc); }
.hand-fx.tier-1 b { font-size:34px; }.hand-fx.tier-3 b { font-size:60px; }
.hand-fx small { position:relative;z-index:2;margin-top:8px;padding:3px 12px;border-radius:999px;background:#1b130de6;border:1px solid #f0c36a88;color:#ffe3a3;font:600 12px 'Microsoft YaHei',sans-serif;letter-spacing:2px; }
.hand-fx .rays { position:absolute;width:280px;height:280px;border-radius:50%;background:repeating-conic-gradient(from 0deg,#ffe28a55 0deg 8deg,transparent 8deg 24deg);-webkit-mask:radial-gradient(circle,#000 20%,transparent 68%);mask:radial-gradient(circle,#000 20%,transparent 68%);animation:fx-spin 3.2s linear both; }
.hand-fx.tier-1 .rays { width:190px;height:190px;opacity:.7; }
.hand-fx .ring { position:absolute;width:120px;height:120px;border-radius:50%;border:3px solid #ffe28acc;animation:fx-ring 1s ease-out both; }
@keyframes fx-pop { 0%{opacity:0;transform:translate(-50%,-50%) scale(.3)} 12%{opacity:1;transform:translate(-50%,-50%) scale(1.15)} 20%{transform:translate(-50%,-50%) scale(1)} 80%{opacity:1;transform:translate(-50%,-50%) scale(1)} 100%{opacity:0;transform:translate(-50%,-62%) scale(.96)} }
@keyframes fx-spin { from{transform:rotate(0) scale(.6)} 20%{transform:rotate(40deg) scale(1)} to{transform:rotate(160deg) scale(1.1)} }
@keyframes fx-ring { from{transform:scale(.3);opacity:1} to{transform:scale(2.6);opacity:0} }
.legend-flash { position:fixed;inset:0;z-index:58;pointer-events:none;background:radial-gradient(circle at 50% 55%,#fff3c4cc,#ffd34d55 35%,transparent 70%);animation:legend-flash .9s ease-out forwards; }
@keyframes legend-flash { from{opacity:1} to{opacity:0} }
.screen-shake .live-table { animation:screen-shake .6s cubic-bezier(.36,.07,.19,.97); }
@keyframes screen-shake { 10%,90%{transform:translate(-2px,1px)} 20%,80%{transform:translate(4px,-2px)} 30%,50%,70%{transform:translate(-6px,2px)} 40%,60%{transform:translate(6px,-1px)} }
@media (prefers-reduced-motion:reduce) { .hand-fx,.hand-fx .rays,.hand-fx .ring,.legend-flash,.screen-shake .live-table { animation:none!important; } }

/* ===== 西部酒馆·精修: lamp light, dust in the beam, sliding chips ===== */
.fly-chip { position:fixed;z-index:57;width:20px;height:20px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,#0000 34%,#fff8 35% 41%,#0000 42%),repeating-conic-gradient(var(--chip) 0 30deg,#f6ecd6 30deg 45deg);
  box-shadow:0 2px 0 #0007,inset 0 0 0 2px #0004,0 0 8px #ffd56a55; --chip:#b8322a; }
.fly-chip.c1 { --chip:#2b5d9c; } .fly-chip.c2 { --chip:#1f7a4a; }
.live-table .arena { isolation:isolate; }
.live-table .arena::after { content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(ellipse 55% 42% at 50% 46%,#ffd99030,#ffc87012 45%,transparent 72%),
             linear-gradient(180deg,#ffe2a00d,transparent 30%);
  mix-blend-mode:screen;animation:lamp-flicker 7s steps(1,end) infinite; }
@keyframes lamp-flicker { 0%,100%{opacity:1} 41%{opacity:.86} 42%{opacity:1} 43%{opacity:.9} 44%{opacity:1} 77%{opacity:.94} 78%{opacity:1} }
.lamp-dust { position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden; }
.lamp-dust i { position:absolute;width:3px;height:3px;border-radius:50%;background:#ffe6b0;opacity:0;filter:blur(.4px);animation:dust-float var(--d,14s) linear infinite;animation-delay:var(--w,0s); }
@keyframes dust-float { 0%{transform:translate(0,0);opacity:0} 15%{opacity:.55} 85%{opacity:.4} 100%{transform:translate(var(--x,20px),-120px);opacity:0} }
.live-table .table-center .pot-value { text-shadow:0 0 18px #ffcf6a66,0 2px 0 #3a1f05; }
.live-table .seat.winner, .live-table .seat.is-winner { filter:drop-shadow(0 0 14px #ffd36a99); }
@media (prefers-reduced-motion:reduce) { .live-table .arena::after,.lamp-dust i { animation:none!important; } .lamp-dust { display:none; } }

/* A folded or beaten hand reads as out of play. */
.your-hand.hand-out .physical-card { filter:grayscale(.65) brightness(.55);transition:filter .4s; }
/* Five open chairs on a narrow phone: keep their labels from running into each other. */
@media (max-width:430px) {
  .live-table .empty-seat .seat-name { font-size:8px;padding:2px 3px;white-space:nowrap;letter-spacing:0; }
}
/* Big screens (the host's computer or a TV): the table text was sized for phones and read tiny here. */
@media (min-width:1100px) and (min-height:650px) {
  .game-layout.live-table .seat-name { font-size:14px;max-width:none;padding:4px 14px; }
  .game-layout.live-table .seat-balance { font-size:13px; }
  .game-layout.live-table .seat-status { font-size:11px; }
  .game-layout.live-table .look-badge { font-size:12px; }
  .game-layout.live-table .table-center .pot-label,.game-layout.live-table .table-center .bet-tag { font-size:13px; }
  .game-layout.live-table .waiting-copy small { font-size:12px; }
  .game-layout.live-table .hand-caption { font-size:12px; }
  .game-layout.live-table .arena-meta { font-size:12px; }
  .game-layout.live-table .actions-grid button small { font-size:11px; }
  .game-layout.live-table .peel-hint,.game-layout.live-table .reveal-all { font-size:12px; }
  .game-layout.live-table .my-id .room-label { font-size:11px; }
}
/* The pot sits on the brightest, lamp-lit part of the felt: a dark halo keeps its text readable at any size. */
.live-table .table-center .pot-label,.live-table .table-center .bet-tag,.live-table .table-center .waiting-copy,.live-table .table-center .niu-stage-title { text-shadow:0 1px 2px #1a0d04e6,0 0 10px #1a0d04b3; }
.live-table .table-center .pot-value { text-shadow:0 0 18px #ffcf6a66,0 2px 0 #3a1f05,0 0 12px #1a0d04cc; }

/* ---------- Cards: simple modern faces that turn over in 3D like real cards ----------
   app.js sets per card: --axis-x/--axis-y (the in-plane turning axis), --turn (0..180deg) and --rise (0..1, peaks mid-turn). */
.your-hand .physical-card.flip3d { position:relative;perspective:650px;transform-style:flat;overflow:visible!important;border-radius:9cqw; }
.your-hand .physical-card.flip3d.is-turning { z-index:20; }
.flip3d .card-body { position:absolute;inset:0;transform-style:preserve-3d;transform:translateY(calc(var(--rise,0) * -10cqw)) translateZ(calc(var(--rise,0) * 28px)) rotate3d(var(--axis-x,0),var(--axis-y,1),0,var(--turn,0deg)); }
.flip3d .card-face { position:absolute;inset:0;border-radius:9cqw;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden; }
.flip3d .card-face { background:transparent center/100% 100% no-repeat;border-radius:6cqw; }
.flip3d .card-front-face { transform:rotate3d(var(--axis-x,0),var(--axis-y,1),0,180deg); }
/* While the paper bends, the WebGL canvas (three cards wide, card in its middle third) draws the card and its own shadow. */
.your-hand .physical-card.flip3d .paper-surface { position:absolute;left:-100%;top:-100%;width:300%;height:300%;pointer-events:none;z-index:8;display:none;filter:none; }
.your-hand .physical-card.flip3d.mesh-active .paper-surface { display:block; }
.your-hand .physical-card.flip3d.mesh-active .card-body,.your-hand .physical-card.flip3d.mesh-active .card-shadow { visibility:hidden; }
.your-hand .physical-card.flip3d.mesh-active { z-index:20; }
/* The shadow on the felt grows softer and drifts away as the card lifts. */
.flip3d .card-shadow { position:absolute;inset:4% 4% 0;border-radius:9cqw;background:#0a0503;pointer-events:none;opacity:calc(.5 - var(--rise,0) * .25);filter:blur(calc(3px + var(--rise,0) * 10px));transform:translate(calc(var(--rise,0) * 5px),calc(5px + var(--rise,0) * 16px)) scale(calc(1 - var(--rise,0) * .1)); }
.flip3d.just-landed .card-body { animation:flip-land .3s cubic-bezier(.2,1.6,.4,1); }
@keyframes flip-land { 0% { scale:1.07; } 100% { scale:1; } }
@media (prefers-reduced-motion:reduce) { .flip3d.just-landed .card-body { animation:none; } }

/* -- Short landscape phones: the hand lies on the felt, bottom centre of the table; the right column is
   just you, the status and big buttons. The pot (placeTableLedger) settles between the seats and the hand. -- */
@media (orientation:landscape) and (max-height:600px) {
  .game-layout.live-table { --panel-width:clamp(230px,34vw,330px);position:relative; }
  .game-layout.live-table .your-panel { position:static;flex-basis:var(--panel-width);
    grid-template-areas:'identity identity' 'status status' 'tools tools' 'actions actions';grid-template-rows:auto auto auto 1fr;row-gap:6px; }
  .game-layout.live-table .action-status { text-align:left; }
  .game-layout.live-table.projected-scene .your-hand { position:absolute;z-index:6;bottom:calc(4px + env(safe-area-inset-bottom));
    left:calc((100% - var(--panel-width) + 18px)/2);transform:translateX(-50%);
    --hand-width:clamp(44px,min(8vw,16svh),92px);padding:0 0 16px;width:max-content;max-width:calc(100% - var(--panel-width)); }
  .game-layout.live-table .hand-caption { position:absolute;z-index:7;bottom:calc(2px + env(safe-area-inset-bottom));left:calc((100% - var(--panel-width) + 18px)/2);
    transform:translateX(-50%);white-space:nowrap;text-shadow:0 1px 3px #000c;pointer-events:none; }
  .game-layout.live-table .actions-grid { align-content:center;grid-auto-rows:minmax(0,1fr);max-height:min(100%,260px); }
  .game-layout.live-table .actions-grid button { min-height:clamp(38px,12svh,58px);font-size:13px; }
  .game-layout.live-table .actions-grid small { font-size:10px; }
  .prepare-table.game-layout.live-table .your-hand { display:none; }
}

/* -- Simple view, for friends playing face to face: no scene and no portraits. A score board of the table,
   then your own hand and big buttons. Toggled per phone with the room bar's 简洁版 / 完整版 button. -- */
.game-layout.live-table.simple-view { display:flex;flex-direction:column;gap:0;height:calc(100dvh - 52px);min-height:0;
  background:radial-gradient(130% 70% at 50% 100%,#3b2516 0%,#1b120c 62%,#130d09 100%); }
.simple-view .simple-board { flex:0 0 auto;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:'pot turn' 'players players';gap:8px 12px;
  padding:10px max(14px,env(safe-area-inset-right)) 4px max(14px,env(safe-area-inset-left)); }
.simple-pot { grid-area:pot;display:flex;flex-direction:column;gap:3px;color:#c9b08a;font-size:11px; }
.simple-pot b { font:700 30px/1 Georgia,serif;color:#f0c36a; }.simple-pot b small { font-size:13px;margin-left:3px;color:#c9a46a; }
.simple-pot em { font-style:normal;font-size:10px;color:#a8916f; }
.simple-turn { grid-area:turn;align-self:center;justify-self:end;text-align:center;font-size:13px;color:#e8d7b5;padding:7px 14px;border-radius:999px;
  background:#ffffff0d;border:1px solid #d6ac6333;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.simple-turn.mine { background:#f0c36a;color:#2a1a0c;font-weight:700;border-color:#f0c36a;animation:simple-turn 1.4s ease-in-out infinite; }
@keyframes simple-turn { 0%,100% { box-shadow:0 0 18px #f0c36a99; } 50% { box-shadow:0 0 4px #f0c36a33; } }
.simple-players { grid-area:players;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px; }
.simple-player { display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'name badge' 'balance status';align-items:center;gap:3px 6px;min-width:0;
  padding:7px 10px;border-radius:10px;background:#ffffff0a;border:1px solid #d6ac6322;color:#e8d7b5;font-size:13px; }
.simple-player b { grid-area:name;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.simple-player .look-badge { grid-area:badge;position:static;transform:none;margin:0;font-size:10px;padding:1px 7px; }
.simple-player .banker-badge { position:static;display:inline-grid;place-items:center;width:18px;height:18px;margin-right:5px;font-size:10px;font-style:normal;vertical-align:1px; }
.simple-player .bot-mark { margin-left:4px; }
.simple-balance { grid-area:balance;font:600 15px Georgia,serif;color:#e3be7e; }.simple-balance::after { content:' 分';font:10px sans-serif;color:#9a8362; }
.simple-player small { grid-area:status;font-size:10px;color:#a8916f;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.simple-player.current { border-color:#f0c36a;background:#f0c36a1f;box-shadow:inset 0 0 0 1px #f0c36a55; }
.simple-player.inactive,.simple-player.offline { opacity:.5; }
.simple-empty { grid-column:1/-1;color:#a8916f;font-size:12px;padding:6px 0; }
.game-layout.live-table.simple-view .your-panel { position:relative;inset:auto;flex:1 1 auto;margin:0;min-height:0;pointer-events:auto;background:none;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'identity status' 'hand hand' 'caption caption' 'tools tools' 'actions actions';
  grid-template-rows:auto minmax(0,1fr) auto auto auto;row-gap:8px;column-gap:8px;align-content:stretch;
  padding:6px max(14px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); }
.simple-view .my-portrait,.simple-view .react-button,.simple-view .panel-footnote { display:none; }
.game-layout.live-table.simple-view .your-heading .your-balance { font-size:24px; }
.game-layout.live-table.simple-view .action-status { font-size:12px;text-align:right;max-width:none;align-self:center;margin:0; }
.game-layout.live-table.simple-view .hand-caption { grid-area:caption;position:static;transform:none;text-align:center;padding:0;font-size:11px; }
.game-layout.live-table.simple-view .your-hand { grid-area:hand;position:static;transform:none;align-self:center;justify-content:center;width:auto;max-width:none;min-height:0;padding:0;
  --hand-width:min(27vw,17svh,150px);gap:min(4vw,22px); }
.game-layout.live-table.simple-view .your-hand .physical-card { width:var(--hand-width);height:calc(var(--hand-width)*1.45); }
.game-layout.live-table.simple-view .your-hand.five-cards { gap:6px; }
.game-layout.live-table.simple-view .your-hand.five-cards .physical-card { --five:min(calc((100vw - 60px)/5),calc(var(--hand-width)*.8));width:var(--five);height:calc(var(--five)*1.45);margin-left:0; }
.game-layout.live-table.simple-view .actions-grid { grid-area:actions;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:none;align-content:end; }
.game-layout.live-table.simple-view .actions-grid.idle-actions,.game-layout.live-table.simple-view .actions-grid.niu-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
.game-layout.live-table.simple-view .actions-grid .wide { grid-column:1/-1; }
.game-layout.live-table.simple-view .actions-grid button { min-height:56px;font-size:15px; }
.game-layout.live-table.simple-view .actions-grid small { font-size:11px; }
.game-layout.live-table.simple-view .result-callout,.game-layout.live-table.simple-view .bot-invite-button,.game-layout.live-table.simple-view .peek-panel { grid-column:1/-1;margin:0; }
@media (orientation:landscape) and (max-height:600px) {
  .game-layout.live-table.simple-view { flex-direction:row;height:calc(100dvh - 41px); }
  .simple-view .simple-board { flex:0 0 clamp(190px,28vw,270px);grid-template-columns:minmax(0,1fr);grid-template-areas:'pot' 'turn' 'players';align-content:start;
    overflow-y:auto;border-right:1px solid #d6ac6322;padding:8px 10px calc(8px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left)); }
  .simple-pot b { font-size:26px; }
  .simple-turn { justify-self:stretch;padding:5px 10px;font-size:12px; }
  .simple-players { grid-template-columns:minmax(0,1fr);gap:4px; }
  .simple-player { padding:4px 8px;font-size:12px; }
  .game-layout.live-table.simple-view .your-panel { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-areas:'hand identity' 'hand status' 'hand tools' 'hand actions' 'caption actions';
    grid-template-rows:auto auto auto minmax(0,1fr) auto;padding:8px max(12px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) 12px;row-gap:6px; }
  .game-layout.live-table.simple-view .your-hand { --hand-width:min(12.5vw,27svh,130px);gap:min(2vw,16px); }
  /* Five cards share the hand column (about half of what the score board leaves). */
  .game-layout.live-table.simple-view .your-hand.five-cards .physical-card { --five:min(calc(var(--hand-width)*.78),calc((100vw - clamp(190px,28vw,270px) - 40px)*.52/5 - 6px)); }
  .game-layout.live-table.simple-view .hand-caption { align-self:end; }
  .game-layout.live-table.simple-view .actions-grid button { min-height:clamp(40px,13svh,60px);font-size:14px; }
  .game-layout.live-table.simple-view .result-callout,.game-layout.live-table.simple-view .bot-invite-button,.game-layout.live-table.simple-view .peek-panel { grid-column:2; }
}

/* Room bar on narrow iPhones: one line, labels never wrap. */
@media (max-width:440px) {
  .in-game .room-heading { min-width:0;flex-wrap:nowrap; }.in-game .room-label,.in-game .room-number { white-space:nowrap; }
  .in-game .room-actions { gap:4px;flex-wrap:nowrap; }.in-game .room-actions .small-button { white-space:nowrap;padding:6px 7px; }
}

/* Short landscape, full view: the hand lies on the felt, so nameplates drop the tiny card backs (the 闷/已看 badge says it)
   and keep to one status line, leaving the bottom of the table to the hand and the pot. */
@media (orientation:landscape) and (max-height:600px) {
  .game-layout.live-table.projected-scene .seat .mini-hand { display:none; }
  .game-layout.live-table.projected-scene .seat .seat-status { margin-top:1px;line-height:1.2; }
}

/* Settlement card on short landscape phones: wider, two columns of players, so six players fit without scrolling. */
@media (orientation:landscape) and (max-height:600px) {
  .settle-card { width:min(560px,calc(100vw - 32px));padding:10px 14px 8px; }
  .settle-card h3 { margin:2px 0 6px;font-size:16px; }
  .settle-card ul { grid-template-columns:repeat(2,minmax(0,1fr));gap:5px; }
  .settle-card li { padding:4px 8px; }
  .settle-card footer { margin-top:6px; }
}