@charset "UTF-8";
:root { color-scheme: dark; --bg:#102b24; --panel:#18362d; --gold:#d9b77d; --gold-dark:#b89b69; --text:#f4f0e6; --muted:#a3b6aa; --line:rgba(205,220,206,.13); --red:#da897a; --green:#8bc5a1; font-family:"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; color:var(--text); background:var(--bg); min-width:320px; min-height:100dvh; background-image:radial-gradient(ellipse at 12% 30%,#20463577,transparent 60%); }
button,input,select { font:inherit; }
button,a,input,select { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
button { color:inherit; }
button:disabled { cursor:default; opacity:.38; }
button:not(:disabled):active { transform:scale(.97); }
button { transition:background .16s,transform .16s,opacity .16s; }
a { color:inherit; text-decoration:none; }
button:focus-visible,a:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
[hidden] { display:none !important; }
.app-shell { max-width:1280px; margin:auto; padding:0 max(28px,env(safe-area-inset-left)) 0 max(28px,env(safe-area-inset-right)); }
.app-header { height:100px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--line); }
.brand { display:flex; gap:14px; align-items:center; font-size:22px; font-weight:650; letter-spacing:3px; }
.brand small { display:block; font:9px/1.7 "Segoe UI",sans-serif; letter-spacing:1.6px; color:var(--muted); margin-top:4px; }
.brand-symbol { position:relative; display:block; width:46px; height:44px; }
.brand-symbol i { position:absolute; display:grid; place-items:center; width:28px; height:38px; top:3px; left:11px; border-radius:5px; background:var(--gold); transform:rotate(19deg); }
.brand-symbol i:nth-child(2) { background:#7c9e83; transform:rotate(-17deg); left:3px; }
.brand-symbol i:nth-child(3) { color:#244735; background:#f4edde; font-style:normal; font-size:24px; transform:rotate(-3deg); left:10px; }
.header-tools { display:flex; align-items:center; gap:20px; }
.connection { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--muted); white-space:nowrap; }
.connection i,.lobby-features i { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--gold); }
.connection.online i { background:var(--green); }
.connection.offline i { background:var(--red); }
.icon-button { border:1px solid var(--line); background:transparent; width:44px; min-width:44px; height:44px; border-radius:50%; display:grid; place-items:center; font-size:20px; }
.icon-button:hover { background:#ffffff09; }
.lobby-screen { display:grid; grid-template-columns:minmax(0,1fr) 400px; column-gap:70px; align-items:center; min-height:calc(100dvh - 100px); padding-top:45px; }
.eyebrow { color:var(--gold); font-size:10px; font-weight:600; letter-spacing:2.6px; display:flex; align-items:center; gap:12px; }
.tiny-line { display:inline-block; width:25px; height:1px; background:var(--gold); }
h1 { font-size:clamp(42px,4.5vw,64px); font-weight:600; letter-spacing:1px; line-height:1.35; margin:24px 0 18px; }
h1 span { color:var(--gold); }
.intro-copy { font-size:15px; line-height:1.9; color:var(--muted); margin:0; }
.hero-cards { position:relative; height:230px; width:345px; max-width:100%; margin-top:22px; }
.hero-card { position:absolute; top:16px; width:116px; height:167px; border-radius:10px; background:#f6f0e3; color:#223e32; border:1px solid #eee5d1; padding:12px 14px; box-shadow:0 16px 24px #081a2350; }
.hero-card b { display:block; font:36px/1 Georgia,serif; }
.hero-card span { display:block; font-size:23px; }
.hero-card em { font-size:72px; position:absolute; bottom:19px; right:15px; font-style:normal; }
.hero-card.red { color:#a64b3f; }
.card-one { transform:rotate(-19deg); left:33px; top:29px; }
.card-two { transform:rotate(-3deg); left:106px; }
.card-three { transform:rotate(15deg); left:179px; top:28px; }
.hero-chip { position:absolute; display:grid; place-items:center; border:5px dashed #dbc28d; border-radius:50%; background:#8e6f41; width:57px; height:57px; font-size:18px; color:#f2deb0; box-shadow:0 4px 0 #57482e,0 8px 12px #0c211c88; font-family:Georgia,serif; }
.chip-one { left:15px; top:171px; transform:rotate(-13deg); }
.chip-two { left:258px; top:170px; background:#355a48; border-color:#8fa98e; color:#d1dec4; transform:rotate(15deg); }
.lobby-features { display:flex; gap:20px; font-size:12px; color:var(--muted); padding-top:12px; }
.lobby-features span { display:flex; align-items:center; gap:7px; white-space:nowrap; }
.lobby-features span+span:before { content:""; width:3px; height:3px; border-radius:50%; background:#698273; margin-right:4px; }
.entry-panel { border:1px solid #b9c9b525; border-radius:20px; padding:30px; background:linear-gradient(145deg,#22443775,#1a382de0); box-shadow:0 18px 65px #081c2026; }
.entry-topline { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.seat-count { font-size:10px; color:var(--muted); border:1px solid var(--line); padding:4px 8px; border-radius:4px; }
.entry-panel h2 { font-size:27px; font-weight:600; margin:23px 0 9px; letter-spacing:1px; }
.entry-caption { color:var(--muted); font-size:12px; margin:0 0 28px; }
.mode-tabs { display:grid; grid-template-columns:1fr 1fr; background:#0d2b23; padding:4px; gap:4px; border-radius:9px; margin-bottom:25px; }
.mode-tabs button { border:0; min-height:42px; background:transparent; border-radius:6px; color:var(--muted); font-size:14px; }
.mode-tabs button[aria-selected="true"] { background:#355444; color:var(--text); box-shadow:0 2px 4px #0002; }
label { display:flex; justify-content:space-between; gap:6px; color:#d2dcd0; font-size:12px; margin:19px 0 9px; }
label span { color:#819e8a; font-size:10px; }
input,select { width:100%; min-width:0; height:48px; border-radius:8px; border:1px solid #88a18b37; background:#112d24; color:var(--text); padding:0 13px; outline:none; font-size:16px; }
input:focus,select:focus { border-color:var(--gold-dark); box-shadow:0 0 0 3px #d9b77d10; }
input::placeholder { color:#75917f; font-size:13px; }
select { font-size:14px; }
.settings-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.button { border:1px solid var(--line); border-radius:8px; min-height:46px; padding:11px 16px; background:#244635; display:flex; justify-content:center; align-items:center; gap:8px; font-size:14px; font-weight:550; }
.button:hover { background:#31543e; }
.button.gold { background:var(--gold); color:#263c2c; border-color:var(--gold); }
.button.gold:hover { background:#e5c691; }
.entry-submit { width:100%; justify-content:space-between; margin:6px 0 20px; height:51px; }
.entry-submit span:last-child { font-size:22px; font-weight:400; }
.entry-note { border-top:1px solid var(--line); display:flex; align-items:center; gap:9px; padding-top:17px; font-size:10px; color:var(--muted); line-height:1.7; }
.note-icon { font-size:20px; }
.form-error { color:#e9a594; font-size:12px; min-height:17px; line-height:1.5; margin:12px 0 8px; }
.lobby-footer { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:35px 0 25px; font-size:11px; color:#789683; }
.text-button { background:transparent; border:0; min-height:44px; padding:0 6px; color:var(--muted); font-size:12px; }
.text-button:hover { color:var(--gold); }

/* Shared room layout; the compact landscape layout is below. */
.room-screen { padding:22px 0 20px; }
.room-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.room-heading { display:flex; align-items:center; gap:13px; min-width:0; }
.room-number { font-size:22px; font-variant-numeric:tabular-nums; letter-spacing:3px; color:var(--gold); font-weight:600; }
.room-label { font-size:10px; color:var(--muted); letter-spacing:1px; }
.room-actions { display:flex; gap:8px; }
.small-button { min-height:44px; border:1px solid var(--line); border-radius:8px; background:transparent; padding:7px 12px; color:#c3d0c0; font-size:12px; }
.small-button:hover { background:#ffffff08; }
.game-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:20px; align-items:stretch; }
.arena { position:relative; background:#0c261e; border:1px solid var(--line); border-radius:22px; min-height:480px; overflow:hidden; }
.arena-meta { display:flex; position:absolute; top:17px; left:20px; right:20px; justify-content:space-between; z-index:2; gap:12px; font-size:11px; color:#91aa93; }
.arena-meta b { color:#c8d5be; font-weight:500; }
.table-oval { position:absolute; inset:80px 63px 62px; border:1px solid #bca46a35; border-radius:46%; background:radial-gradient(ellipse at center,#315d3e88,#1e49328c); box-shadow:0 0 0 8px #132f23,0 0 0 9px #bca46a20,inset 0 0 65px #0c251980; }
.table-oval:after { content:""; position:absolute; inset:10px; border:1px solid #aec5a31a; border-radius:inherit; }
.table-center { position:absolute; top:45%; left:50%; transform:translate(-50%,-50%); text-align:center; width:170px; }
.table-wordmark { color:#9eaf8655; font-weight:600; font-size:14px; letter-spacing:5px; margin-bottom:18px; }
.arena.playing .table-wordmark { display:none; }
.pot-label { color:#a6bc9d; font-size:10px; letter-spacing:2px; }
.pot-value { color:#ead5a2; font-size:40px; font-weight:500; font-variant-numeric:tabular-nums; line-height:1.3; }
.pot-value small { font-size:10px; margin-left:5px; color:#9fb293; }
.bet-tag { font-size:10px; color:#94b093; margin-top:6px; }
.waiting-copy { color:#c6d0b9; font-size:16px; line-height:1.8; }
.waiting-copy small { display:block; color:#8ca88b; font-size:10px; }
.seat { position:absolute; width:96px; text-align:center; z-index:3; transform:translate(-50%,-50%); }
.seat-0 { left:50%; top:19%; }
.seat-1 { left:84%; top:35%; }
.seat-2 { left:80%; top:72%; }
.seat-3 { left:20%; top:72%; }
.seat-4 { left:16%; top:35%; }
.avatar { display:grid; place-items:center; width:43px; height:43px; margin:auto; border-radius:15px; background:#395c45; color:#e2dfc3; border:1px solid #95ae7e44; font-size:17px; font-weight:600; position:relative; }
.avatar.tone-1 { background:#5b5140; }.avatar.tone-2 { background:#3d5153; }.avatar.tone-3 { background:#5a4540; }.avatar.tone-4 { background:#4a4f35; }
.seat.current .avatar { outline:2px solid var(--gold); outline-offset:4px; }
.seat.current .seat-status { color:var(--gold); }
.seat.offline .avatar { opacity:.5; }
.seat.inactive .avatar { filter:saturate(.3); }
.seat-name { display:block; font-size:11px; color:#e0e6d3; max-width:96px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:7px auto 3px; }
.host-crown { color:var(--gold); font-size:9px; margin-right:3px; }
.seat-balance { font-size:11px; font-variant-numeric:tabular-nums; color:#c8d2b6; }
.seat-status { display:block; font-size:9px; color:#8eaa8d; margin-top:5px; white-space:nowrap; }
.empty-seat .avatar { background:#17322280; border:1px dashed #829a6d42; color:#789069; font-size:22px; font-weight:300; }
.empty-seat .seat-name { color:#78916f; font-size:10px; }
.mini-hand { display:flex; justify-content:center; gap:2px; margin-top:5px; }
.mini-card { width:14px; height:19px; border:1px solid #9cac7555; border-radius:3px; background:repeating-linear-gradient(45deg,#607951 0 1px,#496342 1px 4px); }
.mini-card.face { color:#214733; background:#f0ead9; font-size:9px; display:grid; place-items:center; width:17px; }
.mini-card.face.red { color:#a14a3f; }
.arena-status { position:absolute; bottom:18px; left:12px; right:12px; text-align:center; font-size:11px; color:#a9bf9d; z-index:2; }
.arena-status .turn-clock { color:var(--gold); margin-left:6px; font-variant-numeric:tabular-nums; }
.turn-clock.urgent { color:#f3a18b; }
.your-panel { display:flex; flex-direction:column; background:#1b372c; border:1px solid var(--line); border-radius:18px; padding:20px; min-width:0; }
.your-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--muted); font-size:11px; }
.your-heading strong { font-size:14px; color:#e1e4d4; font-weight:550; }
.your-balance { color:var(--gold); font-variant-numeric:tabular-nums; font-size:19px; }
.your-balance small { color:var(--muted); font-size:9px; margin-left:3px; }
.hand-caption { display:flex; justify-content:space-between; font-size:10px; color:#8fa58c; padding:15px 0 5px; }
.hand-caption b { font-weight:500; color:#c5d4b3; }
.your-hand { display:flex; justify-content:center; align-items:center; gap:8px; min-height:143px; padding:12px 0; }
.playing-card { position:relative; width:65px; height:94px; border-radius:7px; background:#f7f0e2; color:#234434; box-shadow:0 5px 8px #071d1733; text-align:left; padding:7px 8px; animation:deal .25s ease-out both; }
.playing-card:nth-child(2) { animation-delay:.04s; }.playing-card:nth-child(3) { animation-delay:.08s; }
.playing-card b { display:block; font:25px/1 Georgia,serif; }
.playing-card span { font-size:17px; line-height:1.2; }
.playing-card em { font-style:normal; position:absolute; right:7px; bottom:5px; font-size:32px; }
.playing-card.red { color:#a9493e; }
.playing-card.back { background:#4b6948; border:3px solid #c7bf9366; display:grid; place-items:center; padding:4px; }
.playing-card.back:before { content:""; position:absolute; inset:4px; border:1px solid #bdc89755; border-radius:3px; background:repeating-linear-gradient(45deg,transparent 0 4px,#b4c19718 4px 5px); }
.playing-card.back span { font-size:23px; color:#d5d8b4; z-index:1; }
.hand-empty { width:100%; padding:25px 0; text-align:center; font-size:12px; color:#91a68b; line-height:1.9; }
.action-status { min-height:34px; text-align:center; font-size:12px; line-height:1.6; color:var(--muted); margin:3px 0 11px; }
.action-status.active { color:var(--gold); }
.actions-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:auto; }
.actions-grid button { flex-direction:column; gap:3px; min-height:54px; padding:8px 6px; font-size:13px; }
.actions-grid button small { font-size:9px; font-weight:400; opacity:.65; }
.actions-grid .fold { background:transparent; color:#b8c2ae; }
.actions-grid .wide { grid-column:1/-1; min-height:46px; }
.panel-footnote { font-size:9px; color:#849e82; text-align:center; margin:15px 0 0; }
.activity { margin-top:16px; display:flex; gap:15px; align-items:center; font-size:11px; padding:13px 3px; border-bottom:1px solid var(--line); color:#96ab90; }
.activity-label { font-size:10px; letter-spacing:1px; color:#687f69; white-space:nowrap; }
.activity-text { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.room-footnote { text-align:center; font-size:10px; color:#6f8974; margin-top:17px; }
.result-callout { padding:13px 10px; border:1px solid #d9b77d40; background:#d9b77d0b; border-radius:8px; font-size:12px; color:var(--gold); text-align:center; margin-bottom:14px; line-height:1.8; }
.result-callout small { display:block; font-size:10px; color:var(--muted); }
.toast { position:fixed; left:50%; transform:translateX(-50%); bottom:max(30px,env(safe-area-inset-bottom)); padding:13px 20px; background:#efe6d5; color:#2c4130; max-width:calc(100vw - 32px); font-size:13px; line-height:1.6; border-radius:9px; box-shadow:0 8px 40px #07190d77; z-index:20; text-align:center; }
.sheet { color:var(--text); background:#1b382d; border:1px solid #607b5d66; border-radius:18px; padding:0; width:450px; max-width:calc(100vw - 24px); max-height:85dvh; box-shadow:0 30px 100px #071c18aa; }
.sheet::backdrop { background:#041511b8; backdrop-filter:blur(5px); }
.sheet-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 20px; border-bottom:1px solid var(--line); }
.sheet-header h2 { font-size:18px; margin:0; font-weight:550; }
.sheet-header .icon-button { border:0; }
.sheet-body { padding:20px; }
.sheet-body p { color:#adbfa8; font-size:13px; line-height:1.9; margin:0 0 15px; }
.rules-list { margin:0; padding:0; list-style:none; }
.rules-list li { padding:12px 0; border-top:1px solid var(--line); font-size:12px; line-height:1.8; color:#b5c5af; }
.rules-list li b { display:block; color:#e4e6d2; margin-bottom:4px; font-weight:550; }
.rank-order { font-size:14px !important; color:var(--gold) !important; line-height:2 !important; }
.sheet-options { display:grid; gap:9px; }
.sheet-options .button { justify-content:space-between; min-height:48px; }
.stat-table { width:100%; border-collapse:collapse; font-size:12px; }
.stat-table th { text-align:left; color:#829a7f; font-weight:400; padding:0 0 12px; }
.stat-table th:not(:first-child),.stat-table td:not(:first-child) { text-align:right; }
.stat-table td { padding:14px 0; border-top:1px solid var(--line); }
.positive { color:var(--gold); }.negative { color:#bc9d8a; }
.history-title { font-size:12px; color:#a9bfa1; margin:24px 0 12px; }
.history-item { font-size:11px; color:#94ae8c; border-top:1px solid var(--line); padding:12px 0; line-height:1.8; }
.invite-input { font-size:12px; margin-bottom:15px; }
.dialog-actions { display:flex; gap:10px; margin-top:20px; }
.dialog-actions .button { flex:1; }
@keyframes deal { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@media (min-width:1100px) { .lobby-screen { padding-left:35px; padding-right:35px; } }
@media (max-width:900px) {
  .lobby-screen { grid-template-columns:minmax(0,1fr) 350px; gap:25px; }
  .entry-panel { padding:24px; }.hero-cards { transform:scale(.85); transform-origin:left center; }
  .lobby-features { gap:10px; font-size:10px; }.lobby-features span+span:before { margin-right:0; }
  .game-layout { grid-template-columns:minmax(0,1fr) 270px; gap:12px; }.your-panel { padding:16px; }
  .table-oval { left:46px; right:46px; }
}
@media (max-width:650px) and (orientation:portrait), (max-width:550px) {
  .app-shell { padding-left:max(18px,env(safe-area-inset-left)); padding-right:max(18px,env(safe-area-inset-right)); }
  .app-header { height:77px; }.brand { font-size:19px; gap:9px; letter-spacing:2px; }.brand small { font-size:7px; letter-spacing:1px; }.brand-symbol { transform:scale(.86); width:41px; }
  .header-tools { gap:10px; }.connection { font-size:10px; gap:5px; }.icon-button { width:44px; min-width:44px; height:44px; }
  .lobby-screen { display:flex; flex-direction:column; align-items:stretch; gap:0; padding-top:29px; min-height:calc(100dvh - 77px); }
  .lobby-intro { position:relative; padding-bottom:25px; }.eyebrow { font-size:9px; letter-spacing:2px; gap:9px; }
  h1 { font-size:38px; line-height:1.38; margin:17px 0 10px; letter-spacing:1px; }
  .intro-copy { font-size:11px; line-height:1.9; }.hero-cards { position:absolute; top:58px; right:-3px; width:165px; height:147px; margin:0; transform:none; }
  .hero-card { width:65px; height:95px; padding:8px; border-radius:6px; }.hero-card b { font-size:23px; }.hero-card span { font-size:13px; }.hero-card em { font-size:40px; right:8px; bottom:8px; }
  .card-one { left:6px; top:12px; transform:rotate(-16deg); }.card-two { left:47px; top:2px; }.card-three { left:88px; top:12px; transform:rotate(15deg); }
  .hero-chip { width:33px; height:33px; border-width:3px; font-size:12px; }.chip-one { top:103px; left:3px; }.chip-two { top:104px; left:131px; }
  .lobby-features { font-size:10px; gap:12px; padding-top:22px; }.entry-panel { padding:23px; border-radius:15px; }.entry-panel h2 { margin-top:18px; font-size:23px; }.entry-caption { margin-bottom:22px; }
  .mode-tabs { margin-bottom:20px; }.entry-note { font-size:10px; }.entry-submit { margin-bottom:17px; }
  .lobby-footer { padding:20px 0 max(18px,env(safe-area-inset-bottom)); font-size:9px; gap:3px; }.lobby-footer .text-button { font-size:10px; }
  .room-screen { padding-top:13px; padding-bottom:max(12px,env(safe-area-inset-bottom)); }.room-bar { margin-bottom:12px; gap:8px; }.room-number { font-size:20px; letter-spacing:2px; }.room-label { font-size:9px; }.room-heading { gap:9px; }
  .room-actions { gap:5px; }.small-button { font-size:11px; padding:7px 9px; }.game-layout { display:flex; flex-direction:column; gap:12px; }
  .arena { min-height:365px; border-radius:17px; }.arena-meta { top:14px; left:15px; right:15px; font-size:10px; }.table-oval { inset:72px 42px 54px; }.table-center { top:47%; width:145px; }.table-wordmark { font-size:12px; margin-bottom:13px; }.pot-value { font-size:33px; }.pot-label { font-size:9px; }.waiting-copy { font-size:14px; }
  .seat { width:79px; }.avatar { width:35px; height:35px; border-radius:12px; font-size:14px; }.seat-name { font-size:10px; max-width:79px; margin-top:5px; }.seat-balance { font-size:10px; }.seat-status { font-size:8px; margin-top:3px; }.mini-card { width:11px; height:15px; }.mini-card.face { width:15px; font-size:8px; }.mini-hand { margin-top:4px; }
  .seat-0 { top:21%; }.seat-1,.seat-4 { top:39%; }.seat-1 { left:84%; }.seat-4 { left:16%; }.seat-2,.seat-3 { top:73%; }.seat-2 { left:82%; }.seat-3 { left:18%; }
  .arena-status { bottom:15px; font-size:10px; }.your-panel { border-radius:14px; padding:15px; }.your-heading strong { font-size:13px; }.your-balance { font-size:18px; }
  .hand-caption { padding-top:10px; }.your-hand { min-height:115px; padding:8px 0; gap:10px; }.playing-card { width:62px; height:88px; }.playing-card b { font-size:24px; }.playing-card em { font-size:30px; }
  .action-status { min-height:20px; margin:2px 0 11px; font-size:11px; }.actions-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }.actions-grid button { min-height:51px; font-size:12px; }.actions-grid .wide { grid-column:1/-1; }.panel-footnote { margin-top:11px; }.activity { margin-top:5px; padding:12px 1px; font-size:10px; gap:10px; }.room-footnote { font-size:9px; margin-top:11px; }.result-callout { margin-bottom:10px; padding:10px; }
  .sheet { align-self:end; margin:auto auto 0; border-radius:18px 18px 0 0; max-width:100vw; width:100%; padding-bottom:env(safe-area-inset-bottom); max-height:86dvh; }
  .in-room .app-header { height:64px; }
  .in-room .arena { min-height:clamp(275px,40dvh,365px); }
  .in-room .your-hand { min-height:103px; }
}
@media (max-width:360px) and (orientation:portrait) {
  .app-shell { padding-left:12px; padding-right:12px; }.brand small { font-size:6px; }.connection { font-size:9px; }.header-tools { gap:3px; }
  h1 { font-size:30px; }.hero-cards { transform:scale(.67); transform-origin:right center; right:0; }.entry-panel { padding:19px; }.lobby-features { font-size:9px; gap:9px; }.room-number { font-size:17px; }.small-button { padding:6px; font-size:10px; }
}
@media (orientation:landscape) and (max-height:600px) {
  .app-shell { max-width:1200px; padding-left:max(14px,env(safe-area-inset-left)); padding-right:max(14px,env(safe-area-inset-right)); }
  .app-header { height:54px; }.brand { font-size:17px; gap:7px; letter-spacing:2px; }.brand-symbol { transform:scale(.72); height:42px; width:38px; }.brand small { display:none; }.header-tools { gap:10px; }.connection { font-size:10px; }
  .lobby-screen { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,360px); gap:25px; padding-top:23px; min-height:calc(100dvh - 54px); }.lobby-intro { align-self:center; padding:0; }h1 { font-size:36px; margin-top:16px; }.intro-copy { font-size:12px; }.hero-cards { height:155px; margin:0; transform:scale(.69); transform-origin:left top; }.lobby-features { font-size:9px; gap:8px; }.entry-panel { padding:20px; }.entry-panel h2 { font-size:22px; margin-top:13px; }.entry-caption { margin-bottom:16px; }.mode-tabs { margin-bottom:14px; }.lobby-footer { padding:18px 0; }
  .room-screen { padding:6px 0 8px; }.room-bar { height:43px; margin:0 0 5px; }.room-heading { gap:9px; }.room-label { font-size:9px; }.room-number { font-size:19px; }.small-button { font-size:10px; min-height:40px; padding:6px 10px; }
  .game-layout { display:grid; grid-template-columns:minmax(0,1fr) 252px; gap:10px; height:calc(100dvh - 116px); min-height:250px; }.arena { min-height:0; height:100%; border-radius:14px; }.arena-meta { top:10px; left:12px; right:12px; font-size:9px; }.table-oval { inset:48px 40px 35px; }.table-center { top:48%; width:130px; }.table-wordmark { font-size:10px; letter-spacing:4px; margin-bottom:9px; }.pot-value { font-size:28px; }.pot-label,.bet-tag { font-size:8px; }.waiting-copy { font-size:13px; }.waiting-copy small { font-size:9px; }.arena-status { font-size:9px; bottom:10px; }
  .seat { width:74px; }.avatar { width:28px; height:28px; font-size:12px; border-radius:10px; }.seat-name { font-size:9px; max-width:74px; margin:4px auto 2px; }.seat-balance { font-size:9px; }.seat-status { font-size:8px; margin-top:3px; }.mini-hand { margin-top:3px; }.mini-card { width:10px; height:13px; }.mini-card.face { width:12px; font-size:7px; }.seat-0 { top:20%; }.seat-1,.seat-4 { top:38%; }.seat-2,.seat-3 { top:74%; }
  .your-panel { padding:12px; overflow-y:auto; min-height:0; border-radius:12px; }.your-heading { font-size:10px; }.your-heading strong { font-size:12px; }.your-balance { font-size:16px; }.hand-caption { padding:8px 0 0; font-size:9px; }.your-hand { min-height:81px; padding:7px 0; gap:7px; }.playing-card { width:45px; height:65px; border-radius:5px; padding:5px; }.playing-card b { font-size:19px; }.playing-card span { font-size:12px; }.playing-card em { font-size:23px; right:5px; bottom:3px; }.playing-card.back span { font-size:18px; }.hand-empty { padding:14px 0; font-size:10px; }
  .action-status { font-size:10px; min-height:17px; margin:0 0 7px; }.actions-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }.actions-grid button { font-size:10px; min-height:44px; padding:6px 2px; gap:2px; }.actions-grid button small { font-size:8px; }.actions-grid .wide { min-height:44px; }.panel-footnote { margin-top:7px; font-size:8px; }.activity,.room-footnote { display:none; }.result-callout { padding:6px; margin:7px 0; font-size:10px; }.result-callout small { font-size:8px; }.sheet { max-height:92dvh; }.sheet-header { padding:10px 18px; }.sheet-body { padding:15px 18px; }
}
@media (prefers-reduced-motion:reduce) { *,*:before,*:after { animation:none !important; transition:none !important; } }