/* Layout: one portrait app column (max 540px). Calm slate-and-lapis look modelled on the big tournament apps: dark slate panels, blue for actions, orange for numbers that matter. */
:root{
  --ink:#161a23; --panel:#212633; --panel2:#2a303e; --line:#373e4f;
  --blue:#4a90f5; --blue-deep:#2e6bcf; --red:#e5484d; --red-deep:#a3262b;
  --gold:#f2a93b; --text:#e8ebf1; --muted:#97a0b2; --good:#4fd1a1;
  --felt:#0d4a33; --felt-hi:#1b7a52; --rail:#0e1219; --trim:#3a4a64;
  --display:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --cond:"IBM Plex Sans Condensed","IBM Plex Sans",system-ui,sans-serif;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--body);font-size:15px;overflow:hidden;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
button{font-family:inherit;cursor:pointer;border:0;color:inherit}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
.app{position:relative;height:100%;max-width:540px;margin:0 auto;overflow:hidden}
.screen{position:absolute;inset:0;display:flex;flex-direction:column}

/* ---------- start ---------- */
#start,.start-like{background:linear-gradient(180deg,#d8d5d5 0%,#bdb7b5 34%,#6c5c57 68%,#2b2321 100%);color:#222;align-items:center;justify-content:center;padding:16px;gap:14px;overflow-y:auto}
#globe{position:absolute;left:50%;top:60%;width:160%;max-width:none;aspect-ratio:1;transform:translateX(-50%);pointer-events:none}
.chip{position:absolute;width:var(--s);aspect-ratio:1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,#211b1b 0 47%,#f1eeee 47.5% 50%,#211b1b 50.5% 63%,transparent 63.5%),repeating-conic-gradient(from 8deg,#b4151f 0 18deg,#f3f0f0 18deg 36deg,#b4151f 36deg 60deg);
  box-shadow:0 12px 30px rgba(0,0,0,.45);display:grid;place-items:center}
.chip span{font-family:var(--display);color:#f3f0f0;font-size:calc(var(--s)*.15);transform:rotate(-24deg);line-height:.9;text-align:center}
.chip span em{display:block;font-style:normal;color:var(--red);font-size:.55em;letter-spacing:.12em}
.c1{--s:min(40vmin,200px);left:-5%;bottom:2%;transform:rotate(-12deg)}
.c2{--s:min(24vmin,120px);right:-4%;top:52%;transform:rotate(14deg)}
.c3{--s:min(18vmin,90px);left:10%;top:8%;filter:blur(2.5px) grayscale(.5);opacity:.55}
.logo{position:relative;text-align:center;display:grid;justify-items:center;gap:4px;z-index:2}
.logo b{font-family:var(--display);font-size:clamp(58px,19vw,104px);line-height:.9;color:#141012;transform:scaleY(1.12);display:block}
.pill{display:inline-block;background:linear-gradient(#e2303a,#a8121b);color:#fff;font-family:var(--display);letter-spacing:.14em;padding:3px 20px 2px;border-radius:999px;border:3px solid #fff;box-shadow:0 0 0 2px #b1141e;font-size:clamp(18px,5.5vw,28px)}
.glass{position:relative;z-index:3;width:min(440px,100%);background:rgba(246,243,243,.84);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:16px;padding:18px 16px 16px;display:grid;gap:12px;box-shadow:0 18px 40px rgba(0,0,0,.25);color:#2e2829}
.glass h2{margin:0;font-size:20px;font-weight:700;text-align:center;text-wrap:balance}
.glass p{margin:0;color:#5f5658;font-size:15px;line-height:1.4;text-align:center}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;font-size:14px}
.facts div{display:grid}
.facts small{font-family:var(--cond);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#7b7173}
.facts b{font-weight:700}
.field{display:grid;gap:4px}
.field label{font-family:var(--cond);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#7b7173}
.glass input,.glass select{width:100%;font:inherit;font-size:16px;padding:11px 12px;border-radius:10px;border:1px solid #cfc7c8;background:#fff;color:#222}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.btn-red{background:linear-gradient(#df2b37,#b8161f);color:#fff;font-weight:700;font-size:17px;padding:14px;border-radius:10px;width:100%}
.btn-red:active{filter:brightness(.9)}
.btn-ghost{background:#e6e1e1;color:#3d3637;font-weight:600;font-size:16px;padding:13px;border-radius:10px;width:100%}
.fine{font-size:12px;color:#7a7072;text-align:center}

/* ---------- table screen ---------- */
#game{background:radial-gradient(100% 60% at 50% 45%,#2a2124 0%,#0d0b0c 75%)}
.clock{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:8px 12px 6px;background:linear-gradient(#1d1517,#141012);border-bottom:1px solid var(--line)}
.lvl{display:grid;justify-items:center;background:var(--red-deep);border-radius:8px;padding:4px 8px;min-width:52px}
.lvl small{font-family:var(--cond);font-size:10px;letter-spacing:.12em;text-transform:uppercase;opacity:.8}
.lvl b{font-family:var(--display);font-size:22px;line-height:1;font-weight:700}
.blinds{min-width:0}
.blinds b{display:block;font-size:17px;font-weight:700;white-space:nowrap}
.blinds small{display:block;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.time{text-align:right}
.time b{display:block;font-family:var(--display);font-weight:700;font-size:26px;line-height:1;color:var(--gold)}
.time small{font-family:var(--cond);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.stats{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:6px;padding:6px 12px;font-family:var(--cond);border-bottom:1px solid rgba(255,255,255,.05);align-items:center}
.stats div{display:grid;gap:0}
.stats small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.stats b{font-size:15px;font-weight:600}
.menu-btn{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-family:var(--cond);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:13px}
.bubble-tag{display:inline-block;background:var(--red);color:#fff;font-size:10px;letter-spacing:.1em;padding:1px 5px;border-radius:4px;margin-left:4px;vertical-align:2px}
.itm-tag{background:#1f6b4f}
.table-area{position:relative;flex:1;min-height:0;margin:2px 4px}
.felt{--rw:14px;position:absolute;inset:11% 9% 15%;border-radius:999px;background:linear-gradient(var(--panel2),var(--rail) 45%,var(--rail) 70%,var(--panel));box-shadow:0 0 0 1px var(--line),0 18px 44px rgba(0,0,0,.7),0 4px 10px rgba(0,0,0,.5),inset 0 2px 1px rgba(255,255,255,.12),inset 0 -3px 6px rgba(0,0,0,.6)}
.felt::before{content:"";position:absolute;inset:var(--rw);border-radius:999px;background:radial-gradient(ellipse 70% 60% at 50% 42%,var(--felt-hi),var(--felt) 78%);box-shadow:0 0 0 1.5px rgba(242,169,59,.4),inset 0 0 0 7px rgba(0,0,0,.08),inset 0 0 0 8px rgba(255,255,255,.07),inset 0 8px 24px rgba(0,0,0,.45),inset 0 0 60px rgba(0,0,0,.35)}
.felt::after{content:"BLINDRISE";position:absolute;left:50%;top:74%;transform:translate(-50%,-50%);font-family:var(--display);font-size:clamp(14px,4.4vw,26px);color:rgba(255,255,255,.07);letter-spacing:.08em;white-space:nowrap}
.table-area.tall .felt::after{top:71%}
.table-area.compact .seat:not(.hero){width:76px}
.table-area.compact .seat:not(.hero) .av{width:32px;height:32px;font-size:12px}
.table-area.compact .seat:not(.hero) .plate{min-width:70px;padding:5px 5px 2px}
.table-area.compact .seat:not(.hero) .nm{font-size:11px;max-width:68px}
.table-area.compact .seat:not(.hero) .st{font-size:12px}
.table-area.compact .seat .badge{font-size:9px;bottom:-16px}
/* the smallest seats, for a full table in a short area (iPhone SE class) */
.table-area.mini .seat:not(.hero){width:66px}
.table-area.mini .seat:not(.hero) .av{width:26px;height:26px;font-size:11px;border-width:1.5px}
.table-area.mini .seat:not(.hero) .plate{min-width:60px;padding:4px 4px 2px;border-radius:7px;margin-top:-5px}
.table-area.mini .seat:not(.hero) .nm{font-size:10px;max-width:58px}
.table-area.mini .seat:not(.hero) .st{font-size:11px}
.table-area.mini .seat .badge{font-size:8.5px;padding:1px 4px;bottom:-14px}
.table-area.mini .card.mini{--w:13px}
.table-area.mini .hole:not(.shown){margin-bottom:-8px}
.table-area.mini .seat.hero{width:104px}
.table-area.mini .seat.hero .plate{min-width:98px;padding:3px 6px 3px 4px;gap:5px}
.table-area.mini .seat.hero .av{width:26px;height:26px;font-size:11px}
.table-area.mini .seat.hero .nm{font-size:10.5px}
.table-area.mini .seat.hero .st{font-size:12px}
/* the last resort of a full table on the smallest screens ('micro', tried only when the mini seats don't fit): the
   mini seats a little narrower, without another player's two card backs over the avatar: a small card mark on the
   plate's top edge, beside the avatar, says they're still in the hand (only your own cards matter; names stay
   10 px, stacks 11 px); the chips in front of the seats are the mini table's smaller labels, a little slimmer */
.table-area.micro .seat:not(.hero){width:58px}
.table-area.micro .seat:not(.hero) .plate{min-width:54px}
.table-area.micro .seat:not(.hero) .nm{max-width:52px}
.table-area.micro .seat:not(.hero)>.hole:not(.shown){display:none}
#game .table-area.micro .bet,#game .table-area.micro .bet.tight{font-size:9.5px;gap:3px;padding:0 5px 0 1px}
#game .table-area.micro .bet .chips,#game .table-area.micro .bet .chips i{width:11px;height:11px}
.table-area.micro .seat:not(.hero):not(.folded):has(>.hole:not(.shown) .card) .plate::after{content:'';position:absolute;top:-11px;right:6px;width:6px;height:8px;border-radius:1.5px;
  background:linear-gradient(135deg,#2c3a5a,#1a2238);box-shadow:0 0 0 1px var(--gold,#c9a45c),2px -1px 0 0 #1a2238,2px -1px 0 1px var(--gold,#c9a45c)}
.table-area.mini .pot{font-size:12px;min-height:20px;padding:2px 9px 2px 4px;gap:4px}
.table-area.mini .pot .chips,.table-area.mini .pot .chips i{width:13px;height:13px}
.table-area.mini .msg{font-size:10.5px;line-height:1.3}
.table-area.mini .bet{font-size:10.5px;gap:3px;padding:1px 6px 1px 2px}
.table-area.mini .bet .chips,.table-area.mini .bet .chips i{width:13px;height:13px}
.table-area.mini .bet.tight,.table-area.mini.tight .bet{font-size:9.5px;padding:1px 5px 1px 1px}
.table-area.mini .bet.tight .chips,.table-area.mini .bet.tight .chips i,.table-area.mini.tight .bet .chips,.table-area.mini.tight .bet .chips i{width:11px;height:11px}
.table-area.mini .dealer{width:18px;height:18px;font-size:9px}
.table-area.tight .bet,.bet.tight{font-size:10.5px;gap:3px;padding:1px 6px 1px 2px}
.table-area.tight .bet .chips,.table-area.tight .bet .chips i,.bet.tight .chips,.bet.tight .chips i{width:13px;height:13px}
.center{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);display:grid;justify-items:center;width:70%;z-index:4}
/* the board sits exactly where the layout puts it; the pot rides above it and the message below, at their own size */
.center .pot{position:absolute;left:50%;bottom:100%;margin-bottom:6px;transform:translateX(-50%);width:max-content}
.center .msg{position:absolute;left:50%;top:100%;margin-top:6px;transform:translateX(-50%);width:max-content}
/* (a felt too short for the pot above the board: the pot at the board's left, 8 px from it, as the layout placed it) */
.table-area.pot-side .center .pot{bottom:auto;top:50%;left:auto;right:calc(50% + var(--bw) * 2.5 + 14px);margin:0;transform:translateY(-50%)}
.pot{display:flex;align-items:center;gap:6px;background:rgba(0,0,0,.38);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);padding:3px 12px 3px 5px;border-radius:99px;font-weight:700;font-size:14px;color:var(--gold);min-height:24px}
.board{display:flex;gap:3px}
.slot{width:var(--bw);height:calc(var(--bw)*1.4);border-radius:5px;border:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.08)}
.msg{font-size:12px;font-weight:600;text-align:center;min-height:16px;color:#fff;text-shadow:0 1px 3px #000;line-height:1.35;max-width:100%;text-wrap:balance}
.msg div+div{color:#e9e0c7}
.seat{position:absolute;transform:translate(-50%,-50%);display:grid;justify-items:center;width:84px;z-index:5;transition:opacity .3s}
.seat.out{opacity:.4}
.seat.folded .av,.seat.folded .plate{opacity:.45}
.hole{display:flex;gap:2px;justify-content:center;min-height:6px;margin-bottom:-10px;position:relative;z-index:3}
.av{position:relative;width:40px;height:40px;border-radius:50%;background:var(--c,#555);display:grid;place-items:center;font-weight:700;font-size:14px;color:#fff;border:2px solid #1a1517;box-shadow:0 3px 8px rgba(0,0,0,.5);z-index:2}
.seat.acting .av{box-shadow:0 0 0 3px var(--gold),0 0 16px rgba(230,187,104,.6)}
.plate{position:relative;margin-top:-6px;z-index:1;background:linear-gradient(#2c272b,#161316);border:1px solid #4a4248;border-radius:9px;padding:6px 6px 3px;min-width:78px;text-align:center;box-shadow:0 4px 12px rgba(0,0,0,.5)}
.seat.win .plate{border-color:var(--good);box-shadow:0 0 0 2px var(--good),0 0 22px rgba(111,220,171,.55)}
.nm{font-size:11.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:76px;color:#e9e3e4}
.st{font-size:13px;font-weight:700;color:var(--gold)}
.badge{position:absolute;left:50%;bottom:-17px;transform:translateX(-50%);background:#4d4549;color:#fff;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 6px;border-radius:4px;white-space:nowrap;z-index:4}
.badge.act-raise,.badge.act-bet,.badge.act-all-in{background:var(--red)}
.badge.act-call,.badge.act-check{background:#2f6f57}
.badge.hand{background:#3a3236;color:#f0e6c8}
.badge.won{background:var(--good);color:#0c2a1e}
.seat.hero{width:120px}
.seat.hero .hole{margin-bottom:-2px}
.seat.hero .plate{display:flex;align-items:center;gap:6px;padding:5px 8px 5px 5px;min-width:112px}
.seat.hero .av{width:30px;height:30px;font-size:12px;flex:none;border-width:1px}
.seat.hero .pl-txt{text-align:left;min-width:0}
.shot{position:absolute;left:6px;right:6px;bottom:2px;height:3px;border-radius:2px;background:rgba(255,255,255,.12);overflow:hidden}
.shot i{display:block;height:100%;background:var(--gold);transform-origin:left;transition:transform .1s linear}
.empty-seat{position:absolute;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;border:1px dashed rgba(255,255,255,.18);display:grid;place-items:center;font-size:9px;color:rgba(255,255,255,.3);letter-spacing:.06em;z-index:2}
.bet{position:absolute;display:flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;background:rgba(0,0,0,.45);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);padding:2px 7px 2px 2px;border-radius:99px;transform:translate(-50%,-50%);white-space:nowrap;z-index:6;transition:transform .38s ease-in,opacity .38s ease-in}
.chips{position:relative;width:16px;height:16px;flex:none}
.chips i{position:absolute;left:0;width:16px;height:16px;border-radius:50%;background:repeating-conic-gradient(var(--cc,#c61a26) 0 30deg,#f2eeee 30deg 60deg);box-shadow:inset 0 0 0 3px rgba(0,0,0,.25),0 1px 1px rgba(0,0,0,.5)}
.chips i:nth-child(2){top:-3px;--cc:#1f5fbf}
.chips i:nth-child(3){top:-6px;--cc:#222}
.dealer{position:absolute;transform:translate(-50%,-50%);width:20px;height:20px;border-radius:50%;background:#f5f1e6;box-shadow:0 2px 4px rgba(0,0,0,.5);display:grid;place-items:center;font-size:10px;font-weight:800;color:#222;z-index:6;transition:left .5s,top .5s}
.card{--w:var(--cw);position:relative;width:var(--w);height:calc(var(--w)*1.4);border-radius:calc(var(--w)*.12);background:#fbfaf6;color:#1b1b1b;box-shadow:0 2px 5px rgba(0,0,0,.45);font-weight:700;line-height:1;flex:none}
.card .r{position:absolute;left:calc(var(--w)*.09);top:calc(var(--w)*.07);font-size:calc(var(--w)*.4);letter-spacing:-.04em}
.card .s1{position:absolute;left:calc(var(--w)*.1);top:calc(var(--w)*.48);font-size:calc(var(--w)*.3)}
.card .s2{position:absolute;right:calc(var(--w)*.06);bottom:calc(var(--w)*.04);font-size:calc(var(--w)*.62)}
.card.red{color:#c8141f}
.card.back{background:repeating-linear-gradient(45deg,#b4151f 0 3px,#8f1018 3px 6px);border:2px solid #f3f0f0}
.card.mini{--w:16px;border-width:1.5px}
.card.mini+.card.mini{margin-left:-9px;transform:rotate(8deg)}
.card.show{--w:calc(var(--cw)*.74)}
.hole.shown{margin-bottom:-24px}
.hole.shown .card.show+.card.show{margin-left:-4px;transform:rotate(5deg)}
.hole.shown .card.show:first-child{transform:rotate(-4deg)}
.hole.shown .card.show.wincard{transform:translateY(-3px)}
.card.hero{--w:calc(var(--cw)*1.18)}
.card.board{--w:var(--bw)}
.card.wincard{box-shadow:0 0 0 2px var(--good),0 0 14px rgba(111,220,171,.7);transform:translateY(-3px)}
.card.dim{filter:brightness(.55)}
.card.dl{animation:deal .42s cubic-bezier(.2,.7,.3,1) both}
.card.flip{animation:flip .38s ease-out both}
.chipin{animation:chipin .3s ease-out both}
@keyframes deal{from{transform:translate(var(--fx),var(--fy)) scale(.4) rotate(-20deg);opacity:.3}to{transform:none;opacity:1}}
@keyframes flip{from{transform:rotateY(90deg) translateY(-6px)}to{transform:none}}
@keyframes chipin{from{transform:translate(calc(-50% + var(--fx)),calc(-50% + var(--fy)));opacity:0}to{transform:translate(-50%,-50%);opacity:1}}
.fly{position:absolute;z-index:30;transform:translate(-50%,-50%);transition:left .6s cubic-bezier(.3,.6,.3,1),top .6s cubic-bezier(.3,.6,.3,1),opacity .2s .55s}
@media (prefers-reduced-motion:reduce){.card.dl,.card.flip,.chipin{animation:none}.fly,.bet{transition:none}}
.banner{position:absolute;left:50%;top:63%;transform:translateX(-50%);background:rgba(10,8,9,.92);border:1px solid var(--gold);color:var(--gold);padding:7px 14px;border-radius:99px;font-family:var(--cond);font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:13px;white-space:nowrap;z-index:20;pointer-events:none;transition:opacity .4s;max-width:94%;overflow:hidden;text-overflow:ellipsis}
.banner.alert{border-color:var(--red);color:#fff;background:rgba(120,10,18,.94)}

/* ---------- controls ---------- */
.controls{padding:6px 12px calc(10px + env(safe-area-inset-bottom,0px));display:grid;gap:7px;background:linear-gradient(transparent,rgba(0,0,0,.65) 25%);min-height:132px;align-content:end}
.presets{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.presets button{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:8px 0;font-family:var(--cond);font-weight:700;font-size:14px;letter-spacing:.04em}
.presets button:active{background:#3a3438}
.slider-row{display:flex;align-items:center;gap:8px}
.slider-row input{flex:1;accent-color:var(--red);height:28px;min-width:0}
.step{width:34px;height:32px;border-radius:8px;background:var(--panel2);border:1px solid var(--line);font-size:18px;font-weight:700}
.slider-row output{min-width:74px;text-align:right;font-weight:700;color:var(--gold)}
.actions{display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:8px}
.actions button{border-radius:11px;padding:13px 4px;font-weight:700;font-size:15px;color:#fff;line-height:1.15;min-height:54px}
.a-fold{background:#4a4448}
.a-call{background:#2f6f57}
.a-raise{background:linear-gradient(#df2b37,#b8161f)}
.info-line{text-align:center;color:var(--muted);font-size:14px;padding:8px 4px;line-height:1.4}
.info-line b{color:var(--text)}

/* ---------- sheets & modals ---------- */
.modal{position:fixed;inset:0;background:rgba(15,12,13,.6);display:grid;place-items:center;padding:16px;z-index:60}
.modal .glass{max-height:88vh;overflow:auto}
.modal .row{display:flex;gap:10px}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{font-family:var(--cond);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#7b7173;text-align:left;padding:4px 4px}
.tbl td{padding:6px 4px;border-top:1px solid #ddd5d6}
.tbl td:last-child,.tbl th:last-child{text-align:right}
.tbl tr.me td{color:var(--red);font-weight:700}
.tbl tr.gone td{color:#9a9093}
.seg{display:flex;gap:6px}
.seg button{flex:1;padding:10px;border-radius:9px;background:#e6e1e1;color:#3d3637;font-weight:600}
.seg button[aria-pressed="true"]{background:#2e2829;color:#fff}

/* ---------- results ---------- */
#results{background:radial-gradient(90% 55% at 50% 20%,#5b1218 0%,#1a0f11 55%,#0d0b0c 100%);overflow-y:auto;align-items:center;padding:28px 16px 24px;gap:14px}
#confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:70}
.trophy{width:96px;height:96px}
.champ-eyebrow{font-family:var(--cond);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:700;font-size:14px}
.champ-name{font-family:var(--display);font-size:clamp(40px,12vw,64px);line-height:1;text-align:center;font-weight:700;margin:0;text-wrap:balance}
.champ-sub{color:#e9d9da;text-align:center;margin:0;max-width:34ch;line-height:1.45}
.podium{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;width:min(460px,100%);align-items:end}
.pod{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 6px;text-align:center;display:grid;gap:2px}
.pod.p1{background:linear-gradient(#5a4214,#2a1e0a);border-color:var(--gold);padding-block:18px}
.pod .pl{font-family:var(--display);font-size:24px;color:var(--gold);font-weight:700}
.pod b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pod span{color:var(--good);font-weight:700}
.order{width:min(460px,100%);background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:6px 12px}
.order .tbl td{border-color:var(--line);color:var(--text)}
.order .tbl th{color:var(--muted)}
.order .tbl tr.me td{color:var(--gold)}
#results .btn-red{width:min(460px,100%)}


/* ---------- club additions ---------- */
#lobby{background:radial-gradient(120% 55% at 50% -10%,#3b1216 0%,var(--ink) 62%)}
.topbar{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line)}
.mini-logo{font-family:var(--display);font-size:23px;line-height:1;display:flex;align-items:center;gap:6px;font-weight:700}
.mini-logo i{font-style:normal;font-size:10px;background:var(--red);padding:3px 7px 2px;border-radius:99px;letter-spacing:.14em}
.spacer{flex:1}
.me-chip{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);min-width:0}
.me-chip img{width:28px;height:28px;border-radius:50%;flex:none}
.me-chip span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}

.tabs{display:flex;gap:4px;padding:6px 16px 0}
.tabs button{flex:1 1 auto;min-width:0;background:transparent;color:var(--muted);font-family:var(--cond);font-size:15px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:10px 4px;border-bottom:3px solid transparent}
.tabs button[aria-selected="true"]{color:var(--text);border-color:var(--red)}
.scroll{flex:1;overflow-y:auto;padding:14px 16px 28px;display:flex;flex-direction:column;gap:12px;user-select:text;-webkit-user-select:text}
.card-box{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px;display:grid;gap:12px}
.card-box h3{margin:0;font-size:19px;font-weight:700;text-wrap:balance}
.card-box p{margin:0;color:var(--muted);line-height:1.45;font-size:14px}
.eyebrow{font-family:var(--cond);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:700}
.status-pill{display:inline-block;font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:5px;background:#173a2e;color:var(--good)}
.status-pill.live{background:var(--red);color:#fff}
.status-pill.idle{background:var(--panel2);color:var(--muted)}
.kv{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.kv div{display:grid;gap:1px}
.kv small{font-family:var(--cond);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.kv b{font-size:15px;font-weight:600}
.plist{display:flex;flex-wrap:wrap;gap:6px}
.pchip{display:flex;align-items:center;gap:6px;background:var(--panel2);border:1px solid var(--line);border-radius:99px;padding:3px 10px 3px 3px;font-size:13px}
.pchip img{width:22px;height:22px;border-radius:50%}
.pchip button{background:transparent;color:var(--muted);font-size:15px;padding:0 0 0 4px;line-height:1}
.pchip.me{border-color:var(--gold)}
.btn{border-radius:10px;padding:12px 14px;font-weight:700;font-size:15px;color:#fff;background:var(--panel2);border:1px solid var(--line)}
.btn.red{background:linear-gradient(#df2b37,#b8161f);border:0}
.btn.green{background:#2f6f57;border:0}
.btn-row{display:flex;gap:8px;flex-wrap:wrap}
.btn-row .btn{flex:1;min-width:120px}
.form{display:grid;gap:10px}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form label{display:grid;gap:4px;font-family:var(--cond);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.form input,.form select{font:inherit;font-size:16px;padding:10px 12px;border-radius:9px;border:1px solid var(--line);background:#141113;color:var(--text);text-transform:none;letter-spacing:0;width:100%}
.tbl.dark td{border-color:var(--line);color:var(--text)}
.tbl.dark th{color:var(--muted)}
.tbl.dark tr.me td{color:var(--gold)}
.table-list{display:grid;gap:8px}
.trow{display:flex;align-items:center;gap:10px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.trow b{flex:1}
.trow small{color:var(--muted)}
.note{font-size:13px;color:var(--muted);line-height:1.45;border-left:3px solid var(--gold);padding-left:10px}
.warn{background:#3a1216;border:1px solid var(--red);border-radius:10px;padding:10px 12px;font-size:13px;line-height:1.45}
.seg2{display:flex;gap:6px}
.seg2 button{flex:1;padding:8px;border-radius:8px;background:var(--panel2);border:1px solid var(--line);font-weight:600;font-size:13px;color:var(--muted)}
.seg2 button[aria-pressed="true"]{color:var(--text);border-color:var(--gold)}
.tname{font-family:var(--cond);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:12px;color:var(--muted)}
.back{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-weight:600;font-size:13px}
.empty{color:var(--muted);text-align:center;padding:30px 10px;line-height:1.5}
.dealer-bar{background:#3a2a0e;color:var(--gold);font-size:12px;padding:5px 12px;text-align:center;font-weight:600}

/* ---------- auth ---------- */
#auth .glass{max-width:420px}
.err{color:#b8161f;font-size:14px;text-align:center;min-height:18px}
.linkbtn{background:none;color:#5f5658;text-decoration:underline;font-size:13px;padding:4px}
.copy-row{display:flex;gap:8px;align-items:center}
.copy-row input{flex:1;min-width:0;font:inherit;font-size:13px;padding:9px 10px;border-radius:8px;border:1px solid var(--line);background:#141113;color:var(--text)}
.offline{position:fixed;left:50%;top:8px;transform:translateX(-50%);background:var(--red);color:#fff;padding:6px 14px;border-radius:99px;font-size:13px;font-weight:600;z-index:80}
.share-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.share-row a{display:flex;align-items:center;justify-content:center;text-decoration:none;padding:10px 6px;font-size:14px}
/* learn */
.seg2.small button{padding:6px;font-size:12px}
.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}
.statgrid div{background:var(--panel2);border-radius:10px;padding:8px 4px}
.statgrid b{display:block;font-family:var(--display);font-weight:700;font-size:22px;color:var(--gold)}
.statgrid small{font-size:11px;color:var(--muted)}
.hand-list{display:grid;gap:6px}
.hrow{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px;width:100%;color:var(--text)}
.hrow .hm small{display:block;color:var(--muted);font-size:12px}
.hc{display:inline-flex;gap:3px;white-space:nowrap}
.mc{display:inline-block;background:#f5f0f0;color:#1b1718;border-radius:4px;padding:1px 4px;font-weight:700;font-size:13px;min-width:26px;text-align:center}
.mc.red{color:#c4161f}
.hn{font-weight:700;font-variant-numeric:tabular-nums;color:var(--muted);text-align:right}
.hn small{display:block;font-size:11px;font-weight:500;color:var(--muted)}
.hn.pos{color:var(--good)} .hn.neg{color:#ff7a7f}
.hb{display:flex;gap:3px}
.nk{display:inline-block;font-style:normal;font-family:var(--cond);font-weight:700;font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:2px 6px;border-radius:5px;background:var(--panel2);color:var(--muted)}
.nk.mistake{background:#4a1418;color:#ff9da1} .nk.tip{background:#45371a;color:var(--gold)} .nk.good{background:#173a2e;color:var(--good)} .nk.luck,.nk.info{background:#1f2f45;color:#9cc6ff}
.back-link{background:none;color:var(--gold);font-weight:600;text-align:left;padding:0}
.hhead{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}
.hhead small{color:var(--muted)}
.hcards{display:flex;gap:4px}
.hcards .card{position:relative;width:42px;height:58px}
.sthead{display:flex;justify-content:space-between;align-items:center}
.acts{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:14px}
.acts li{padding:4px 8px;border-radius:6px}
.acts li.me{background:rgba(230,187,104,.12)}
.acts li small{color:var(--muted);font-size:11px}
.acts .ai{color:#ff9da1}
.acts .muted{color:var(--muted)}
.cnote{border-radius:10px;padding:10px;background:var(--panel2);display:grid;gap:4px}
.cnote b{font-size:14px} .cnote p{margin:0;font-size:13px;color:var(--muted);line-height:1.45}
.cnote.mistake{border-left:3px solid #ff7a7f} .cnote.tip{border-left:3px solid var(--gold)} .cnote.good{border-left:3px solid var(--good)} .cnote.luck,.cnote.info{border-left:3px solid #9cc6ff}
details.lesson{padding:0;gap:0}
details.lesson summary{list-style:none;display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:10px;padding:14px;cursor:pointer}
details.lesson summary::-webkit-details-marker{display:none}
details.lesson summary small{color:var(--muted)}
.ln{width:26px;height:26px;border-radius:50%;background:var(--panel2);display:grid;place-items:center;font-weight:700;color:var(--gold);font-size:13px}
details.lesson[open] summary{border-bottom:1px solid var(--line)}
.lbody{padding:4px 14px 14px;font-size:14px;line-height:1.55;color:var(--text)}
.card-box.lbody{padding:14px}
.lbody p,.lbody li{color:#ddd5d7}
.lbody h4{margin:14px 0 6px;font-family:var(--cond);letter-spacing:.06em;text-transform:uppercase;color:var(--gold);font-size:14px}
.lbody ul,.lbody ol{padding-left:20px;margin:6px 0;display:grid;gap:6px}
.ltable{width:100%;border-collapse:collapse;font-size:13px;margin:8px 0}
.ltable th{text-align:left;color:var(--muted);font-weight:600;font-size:12px;padding:6px;border-bottom:1px solid var(--line)}
.ltable td{padding:7px 6px;border-bottom:1px solid var(--line);vertical-align:top}
.ltable td.cards{white-space:nowrap;font-weight:700}
.tipbox{background:rgba(230,187,104,.1);border-left:3px solid var(--gold);padding:10px 12px;border-radius:8px}
.row-btns{display:flex;gap:6px}
.card-box.warn{border-color:#8a5a12;background:#2a2114}
.sel{width:100%;padding:10px;border-radius:10px;border:1px solid #ccc;font-size:16px;margin-top:8px}
.hc.big .mc{font-size:20px;padding:6px 8px;min-width:42px}
.agree{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:1.4;color:#4a4244;text-align:left}
.agree input{margin-top:3px;width:18px;height:18px;flex:none}
.agree .linkbtn{display:inline;padding:0;font-size:13px}
.terms-modal{text-align:left;font-size:13px;line-height:1.45;max-height:55vh;overflow:auto}
.terms-modal ol{padding-left:18px;display:grid;gap:6px}
.terms{padding-left:18px;display:grid;gap:8px}
details.terms-d summary{cursor:pointer;color:var(--gold);font-weight:600;margin:6px 0}
.bigpts{font-family:var(--display);font-size:44px;color:var(--gold);line-height:1}
.bigpts small{display:block;font-family:var(--body,inherit);font-size:13px;color:var(--muted);margin-top:4px}
.trow.prize{justify-content:space-between}
.trow.prize small{display:block}
.trow.prize .btn{width:auto;flex:none;padding:8px 12px}
.skillq{font-size:28px;font-weight:700;text-align:center;margin:10px 0}

.btn:disabled,.btn[disabled]{opacity:.4;cursor:not-allowed;filter:grayscale(1)}
.warn-note{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:rgba(255,190,60,.12);color:#ffcf70;font-size:14px;line-height:1.4}
/* table chat */
.stats .hdr-btns{display:flex;gap:6px}
.chat-btn{position:relative;padding:6px 9px;font-size:15px;letter-spacing:0}
.chat-btn i{position:absolute;top:-3px;right:-3px;width:10px;height:10px;border-radius:50%;background:var(--red);border:2px solid var(--bg,#111)}
.chat-btn i[hidden]{display:none}
#fx{position:absolute;inset:0;pointer-events:none;z-index:20;overflow:visible}
.bubble{position:absolute;transform:translate(-50%,-135%);max-width:min(60%,220px);background:#fff;color:#1b1718;font-size:14px;line-height:1.3;padding:6px 10px;border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.35);animation:bubIn .18s ease-out, bubOut .4s ease-in 4.1s forwards;word-wrap:break-word;text-align:center}
.bubble::after{content:'';position:absolute;left:calc(50% + var(--tail,0px));bottom:-6px;transform:translateX(-50%);border:6px solid transparent;border-top-color:#fff;border-bottom:0}
@keyframes bubIn{from{opacity:0;transform:translate(-50%,-110%) scale(.85)}}
@keyframes bubOut{to{opacity:0}}
.throw{position:absolute;font-size:34px;transform:translate(-50%,-50%);filter:drop-shadow(0 4px 6px rgba(0,0,0,.4))}
.throw.splat{animation:splat 1.4s ease-out forwards}
@keyframes splat{0%{scale:1}20%{scale:1.6}100%{scale:1.2;opacity:0}}
.chat-sheet{position:fixed;left:0;right:0;bottom:0;z-index:50;max-height:58vh;display:flex;flex-direction:column;gap:8px;background:#17131a;border-top:1px solid var(--line);border-radius:16px 16px 0 0;padding:12px 12px calc(12px + env(safe-area-inset-bottom));box-shadow:0 -12px 30px rgba(0,0,0,.5)}
.chat-sheet[hidden]{display:none}
.chat-head{display:flex;justify-content:space-between;align-items:center}
.chat-log{flex:1;overflow:auto;min-height:90px;display:grid;gap:6px;align-content:start;font-size:15px;line-height:1.35}
.chat-log .cm b{margin-right:4px}
.chat-quick{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.chat-quick[hidden]{display:none}
.chat-quick button{flex:none;background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:14px}
.chat-form{display:flex;gap:8px}
.chat-form[hidden]{display:none}
.chat-form input{flex:1;min-width:0;font:inherit;font-size:16px;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:#0e0c10;color:inherit}
.chat-note{margin:0;font-size:12px;color:var(--muted)}
.throw-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.throw-grid button{font-size:30px;padding:10px 0;border-radius:12px;background:#fff;border:1px solid #ddd}
.seat[data-uid]{cursor:pointer}
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:#2a2329;color:#fff;padding:10px 16px;border-radius:999px;z-index:80;font-size:14px;box-shadow:0 8px 20px rgba(0,0,0,.4)}
/* fair deal */
.fair-steps{display:grid;gap:10px;padding-left:20px;line-height:1.45}
.sealcode{word-break:break-all;font-size:12px}
.seal code{font-size:12px}
.glass .good{color:#1d7a3e;font-weight:600;text-align:left}
.glass .bad{color:#b8161f;font-weight:600;text-align:left}
.fair-list{display:grid;gap:4px;text-align:left;max-height:40vh;overflow:auto}
.fh{background:#fff;border-radius:8px;padding:6px 8px;font-size:13px;color:#2e2829}
.fh.bad{border:2px solid #b8161f}
.fh summary{cursor:pointer;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.fh summary span .mc,.fh div .mc{font-size:12px;min-width:22px;margin-right:2px;border:1px solid #ddd}
.fh div{display:grid;gap:3px;margin-top:6px}
/* ---------- action panel (pro layout) ---------- */
.turnbar{position:relative;height:6px;border-radius:3px;background:rgba(255,255,255,.08);overflow:visible;margin-bottom:2px}
.turnbar i{position:absolute;inset:0;border-radius:3px;background:linear-gradient(90deg,#3fae7a,#6fdcab);transform-origin:left;transition:transform .25s linear}
.turnbar i.low{background:linear-gradient(90deg,#b8161f,#ff4d57)}
.turnbar span{position:absolute;right:0;top:-18px;font-size:12px;color:var(--muted);font-weight:600}
.act-main{display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:8px}
.act-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:62px;border-radius:14px;color:#fff;border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 6px 14px rgba(0,0,0,.35);transition:transform .08s,filter .15s;-webkit-tap-highlight-color:transparent}
.act-btn:active{transform:scale(.97);filter:brightness(1.15)}
.act-btn b{font-family:var(--cond);font-size:19px;letter-spacing:.06em;text-transform:uppercase;font-weight:700}
.act-btn span{font-size:15px;font-weight:700;opacity:.95}
.act-btn.fold{background:linear-gradient(#5a5357,#3b3539)}
.act-btn.call{background:linear-gradient(#2f9a6e,#1d6b4b)}
.act-btn.raise{background:linear-gradient(#e2323e,#a5121b)}
.act-btn.raise.allin{background:linear-gradient(#f0c35a,#c48a1c);color:#1b1407}
.act-btn.back{background:linear-gradient(#3a3438,#2a2528)}
.act-btn.raise span:not(.num){font-size:12px;font-weight:600;opacity:.8;text-transform:none}
.sizing{display:grid;gap:9px;background:rgba(20,16,19,.92);border:1px solid var(--line);border-radius:14px;padding:10px}
.sizing .amt{display:flex;align-items:baseline;justify-content:center;gap:10px}
.sizing .amt small{font-family:var(--cond);text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-size:12px}
.sizing .amt b{font-size:28px;color:var(--gold);font-weight:800}
.sizing .amt span{color:var(--muted);font-size:14px;font-weight:600}
.sz-presets{display:grid;grid-template-columns:repeat(auto-fit,minmax(56px,1fr));gap:6px}
.sz-presets button{background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:9px 0;font-family:var(--cond);font-weight:700;font-size:14px;letter-spacing:.03em}
.sz-presets button[aria-pressed=true]{background:var(--gold);color:#1b1407;border-color:var(--gold)}
.sz-presets button:last-child{border-color:#c48a1c;color:#f0c35a}
.sz-presets button:last-child[aria-pressed=true]{color:#1b1407}
.sz-slider{display:flex;align-items:center;gap:10px}
.sz-slider input{flex:1;min-width:0;-webkit-appearance:none;appearance:none;height:8px;border-radius:4px;background:linear-gradient(90deg,#a5121b,#f0c35a);outline:none}
.sz-slider input::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;border-radius:50%;background:#fff;border:3px solid var(--gold);box-shadow:0 3px 8px rgba(0,0,0,.5)}
.sz-slider input::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#fff;border:3px solid var(--gold)}
.sz-slider .step{width:42px;height:42px;border-radius:50%;font-size:22px}
.preacts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.preacts button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--line);font-size:14px;font-weight:600;color:var(--muted)}
.preacts button i{width:16px;height:16px;border-radius:4px;border:2px solid currentColor;flex:none;display:grid;place-items:center}
.preacts button[aria-pressed=true]{background:rgba(63,174,122,.18);border-color:#3fae7a;color:#fff}
.preacts button[aria-pressed=true] i{background:#3fae7a;border-color:#3fae7a}
.preacts button[aria-pressed=true] i::after{content:'✓';font-size:11px;font-style:normal;color:#fff;font-weight:900}

.next-box{border-color:rgba(230,187,104,.45);background:linear-gradient(160deg,rgba(184,22,31,.18),rgba(20,16,19,.9))}
.btn.big{padding:14px 22px;font-size:17px}
.owner-row{display:grid;grid-template-columns:1fr 1.4fr;gap:8px;margin-top:6px}
.turnbar i.bank{background:linear-gradient(90deg,#c48a1c,#f0c35a)}

.news summary{cursor:pointer;display:grid;gap:4px;list-style:none}
.news summary::-webkit-details-marker{display:none}
.news summary b::after{content:' ▾';color:var(--muted)}
.news[open] summary b::after{content:' ▴'}
.news h4{margin:14px 0 6px;color:var(--gold);font-family:var(--cond);letter-spacing:.06em}
.news ul{margin:0;padding-left:18px;display:grid;gap:6px;line-height:1.45;font-size:14px}
.demo-box{border-color:rgba(63,174,122,.45);background:linear-gradient(160deg,rgba(29,107,75,.25),rgba(20,16,19,.9))}

/* hand helper */
.helper{margin:0 12px 6px;padding:8px 12px;border-radius:12px;background:rgba(20,16,19,.88);border:1px solid var(--line);display:grid;gap:5px;cursor:pointer;font-size:13px}
.helper[hidden]{display:none}
.h-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.h-name{font-size:15px;color:#fff}
.h-eq{font-weight:800;font-size:17px;white-space:nowrap}
.h-eq small{font-size:11px;font-weight:600;color:var(--muted)}
/* "Win" names the figure where the "to win vs N" words after it are left out (short screens, sideways) */
.h-eq .h-w{display:none;font-style:normal;font-size:max(11px,.72em);font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-right:4px;opacity:.85}
#game.h600 .h-eq .h-w{display:inline}
.h-eq.good{color:#6fdcab}.h-eq.mid{color:var(--gold)}.h-eq.bad{color:#ff6b74}
.h-bar{height:5px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden}
.h-bar i{display:block;height:100%;background:linear-gradient(90deg,#b8161f,#e6bb68 45%,#3fae7a);transition:width .4s}
.h-line{color:var(--muted);line-height:1.35}
.h-line.good{color:#9be8c4}.h-line.mid{color:#f3d48f}.h-line.bad{color:#ff9aa1}

/* ---------- calm slate & lapis theme (overrides) ---------- */
body{font-size:15px;letter-spacing:0}
.stats small,.kv small,.form label,.eyebrow,.time small,.lvl small,.tname,.tbl th,.facts small,.field label,.menu-btn,.status-pill,.nk,.banner,.sizing .amt small,.champ-eyebrow,.lbody h4,.news h4,.presets button,.sz-presets button{text-transform:none;letter-spacing:0}
.stats small,.kv small,.time small,.facts small,.tbl th{font-size:12px;font-weight:500}
.form label,.field label{font-size:13px;font-weight:500}
.eyebrow{font-size:13px;font-weight:600}
.tabs button{text-transform:none;letter-spacing:0;font-family:var(--body);font-weight:600;font-size:15px}
.tabs button[aria-selected="true"]{color:var(--text);border-color:var(--blue)}
.tabs{background:var(--panel);padding-top:0;gap:0}
.topbar{background:var(--panel)}
#lobby{background:var(--ink)}
.mini-logo{font-weight:700;letter-spacing:.01em}
.mini-logo i{background:var(--blue);font-weight:600}
.card-box{background:var(--panel);border-color:var(--line);border-radius:12px}
.status-pill{background:rgba(79,209,161,.14)}
.status-pill.live{background:var(--blue);color:#fff}
.status-pill.reg{background:rgba(79,209,161,.22);color:var(--good);margin-left:6px}
.btn{background:var(--panel2);border-color:var(--line)}
.btn.red,.btn-red{background:var(--blue);border:0;color:#fff}
.btn.red:active,.btn-red:active{background:var(--blue-deep)}
.btn.green{background:#2f8f6a}
.form input,.form select,.copy-row input,.chat-form input{background:#151922;border-color:var(--line)}
.warn{background:rgba(229,72,77,.12)}
.dealer-bar{background:rgba(242,169,59,.12)}
.next-box{border-color:rgba(74,144,245,.45);background:linear-gradient(160deg,rgba(74,144,245,.14),var(--panel))}
.demo-box{border-color:rgba(79,209,161,.4);background:linear-gradient(160deg,rgba(79,209,161,.12),var(--panel))}
.card-box.warn{border-color:rgba(242,169,59,.5);background:rgba(242,169,59,.08)}
.pchip.me,.seg2 button[aria-pressed="true"]{border-color:var(--blue)}
.note{border-left-color:var(--blue)}
.statgrid b,.bigpts{font-weight:600}
.acts li.me{background:rgba(74,144,245,.12)}
.tipbox{background:rgba(74,144,245,.1);border-left-color:var(--blue)}
.nk.tip{background:rgba(242,169,59,.14)} .nk.good{background:rgba(79,209,161,.14)} .nk.mistake{background:rgba(229,72,77,.16)} .nk.luck,.nk.info{background:rgba(74,144,245,.16)}
.lbody p,.lbody li{color:#cfd5e0}
.offline,.chat-btn i{background:var(--red)}

/* start / sign-in */
#start,.start-like{background:radial-gradient(120% 70% at 50% 0%,#24365a 0%,#182033 45%,var(--ink) 100%);color:var(--text)}
.chip{background:radial-gradient(circle,#1b2333 0 47%,#e8ebf1 47.5% 50%,#1b2333 50.5% 63%,transparent 63.5%),repeating-conic-gradient(from 8deg,#2e6bcf 0 18deg,#e8ebf1 18deg 36deg,#2e6bcf 36deg 60deg)}
.chip span{font-weight:700}
.chip span em{color:var(--gold)}
.logo b{color:#fff;transform:none;font-weight:700;letter-spacing:-.02em;font-size:clamp(50px,16vw,88px)}
.pill{background:var(--blue);border:0;box-shadow:none;font-family:var(--body);font-weight:600;letter-spacing:.2em;padding:5px 18px 4px}
.glass{background:rgba(33,38,51,.96);color:var(--text);border:1px solid var(--line);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.glass p,.fine,.facts small,.field label,.linkbtn{color:var(--muted)}
.glass input,.glass select,.sel{background:#151922;border:1px solid var(--line);color:var(--text)}
.btn-ghost{background:var(--panel2);color:var(--text)}
.seg button{background:var(--panel2);color:var(--muted)}
.seg button[aria-pressed="true"]{background:var(--blue);color:#fff}
.tbl td{border-top-color:var(--line)}
.tbl tr.me td{color:var(--gold)}
.agree{color:var(--muted)}
.err,.glass .bad{color:#ff7b7f}
.glass .good{color:var(--good)}
.fh{background:var(--panel2);color:var(--text)}
.fh.bad{border-color:var(--red)}
.fh summary span .mc,.fh div .mc,.throw-grid button{border-color:var(--line)}
.throw-grid button{background:var(--panel2)}
.modal{background:rgba(10,13,19,.7)}

/* table */
#game{background:radial-gradient(100% 60% at 50% 45%,#1f2a40 0%,#12161e 75%)}
.clock{background:var(--panel);border-bottom-color:var(--line)}
.lvl{background:var(--blue-deep)}
.lvl b{font-weight:700}
.time b{font-weight:600;letter-spacing:-.01em}
.stats{background:#1b202b}
.felt::after{font-weight:700;letter-spacing:.14em;color:rgba(255,255,255,.075)}
.plate{background:linear-gradient(#2b3242,#1a1f2a);border-color:#465068}
.nm{color:#dfe4ee}
.av{border-color:#151922}
.seat.acting .av{box-shadow:0 0 0 3px var(--blue),0 0 16px rgba(74,144,245,.6)}
.shot i{background:var(--blue)}
.badge{background:#3c4558}
.badge.act-raise,.badge.act-bet,.badge.act-all-in{background:#d9822b}
.badge.act-call,.badge.act-check{background:#2f8f6a}
.badge.hand{background:#2f3a52;color:#dbe7ff}
.card.back{background:repeating-linear-gradient(45deg,#2e6bcf 0 3px,#1e4f9e 3px 6px);border-color:#e8ebf1}
.card.red{color:#d62a33}
.mc.red{color:#d62a33}
.banner{background:rgba(18,22,30,.94)}
.banner.alert{background:rgba(163,38,43,.94)}
.controls{background:linear-gradient(transparent,rgba(12,15,21,.85) 25%)}
.act-btn{border-radius:12px;box-shadow:0 6px 14px rgba(0,0,0,.3)}
.act-btn b{letter-spacing:.04em;font-weight:600}
.act-btn.fold{background:#3a4152}
.act-btn.call{background:linear-gradient(#2f9e74,#227a59)}
.act-btn.raise{background:linear-gradient(#4a90f5,#2e6bcf)}
.act-btn.raise.allin{background:linear-gradient(#f5b54f,#d98a1f);color:#1d1404}
.act-btn.back{background:#2a303e}
.sizing,.helper{background:rgba(27,32,43,.95)}
.sz-slider input{background:linear-gradient(90deg,#2e6bcf,#f2a93b)}
.sz-slider input::-webkit-slider-thumb{border-color:var(--blue)}
.sz-slider input::-moz-range-thumb{border-color:var(--blue)}
.turnbar i{background:linear-gradient(90deg,#2e6bcf,#4a90f5)}
.turnbar i.low{background:linear-gradient(90deg,#c0392b,#e5484d)}
.preacts button[aria-pressed=true]{background:rgba(74,144,245,.16);border-color:var(--blue)}
.preacts button[aria-pressed=true] i{background:var(--blue);border-color:var(--blue)}
.h-bar i{background:linear-gradient(90deg,#e5484d,#f2a93b 45%,#4fd1a1)}
.chat-sheet{background:#1b202b}
.toast{background:#2a303e}

/* results */
#results{background:radial-gradient(90% 55% at 50% 20%,#22385f 0%,#171d2a 55%,var(--ink) 100%)}
.pod.p1{background:linear-gradient(rgba(242,169,59,.22),var(--panel))}
.champ-sub{color:#cfd5e0}
.throw-who{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.chat-head .hdr-btns{display:flex;gap:6px}

/* avatars, tiers, profiles */
.av{overflow:visible}
.av img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.av .emo{font-size:1.25em;line-height:1}
.av.tiered{box-shadow:0 0 0 2px var(--ring),0 3px 8px rgba(0,0,0,.5)}
.seat.acting .av.tiered{box-shadow:0 0 0 2px var(--ring),0 0 0 5px var(--blue),0 0 16px rgba(74,144,245,.6)}
.tier-ic{position:absolute;right:-6px;bottom:-4px;font-style:normal;font-size:12px;line-height:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.av.xs{width:22px;height:22px;font-size:10px;border-width:1px;flex:none}
.av.xs .emo{font-size:13px}.av.xs .tier-ic{font-size:9px;right:-4px;bottom:-3px}
.av.sm{width:28px;height:28px;font-size:11px;border-width:1px;flex:none}
.av.big{width:64px;height:64px;font-size:22px;flex:none}
.av.big.tiered{box-shadow:0 0 0 3px var(--ring),0 6px 16px rgba(0,0,0,.4)}
.av.big .tier-ic{font-size:20px;right:-8px;bottom:-6px}
.pchip{cursor:pointer;padding-left:3px}
.lb-name{display:inline-flex;align-items:center;gap:7px;cursor:pointer}
.me-btn{display:flex;align-items:center;gap:8px;background:none;color:var(--text);font-size:14px;font-weight:600;padding:0;min-width:0}
.me-btn span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}
.tier-pill{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;padding:2px 8px;border-radius:99px;color:var(--tc);background:color-mix(in srgb,var(--tc) 16%,transparent);border:1px solid color-mix(in srgb,var(--tc) 45%,transparent);white-space:nowrap}
.prof{display:grid;gap:10px;text-align:left}
.prof-head{display:flex;align-items:center;gap:14px}
.prof-head h2{text-align:left;margin:0 0 4px}
.prof-head small{display:block;color:var(--muted);margin-top:6px;font-size:13px}
.prof-head small b{color:var(--text)}
.prof .eyebrow{margin-top:4px}
.prof .statgrid b{font-size:20px}
.prof-list{display:grid;gap:4px}
.prof-list div{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--panel2);border-radius:8px;padding:7px 10px;font-size:14px}
.prof-list small{display:block;color:var(--muted);font-size:12px}
.prof-list b{white-space:nowrap;font-size:14px}
.prof-list b.gold{color:var(--gold)}.prof-list b.cash{color:var(--good)}
.tiers-d summary{cursor:pointer;color:var(--blue);font-weight:600;font-size:14px}
.tier-list{display:grid;gap:6px;margin:8px 0}
.tier-list div{display:flex;align-items:center;gap:10px}
.tier-list small{color:var(--muted);font-size:12px}
.av-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.av-grid button{aspect-ratio:1;border-radius:50%;background:var(--c);font-size:22px;display:grid;place-items:center;border:2px solid transparent}
.av-grid button[aria-pressed=true]{border-color:#fff}
.upload{display:block;text-align:center;cursor:pointer}
.pic-nudge{display:flex;gap:14px;align-items:flex-start}
.pic-nudge p{margin:4px 0 10px}
.prof p,.prof .note{text-align:left}

/* coach tip, report card */
.coachtip{position:absolute;left:6px;right:6px;bottom:4px;z-index:30;box-shadow:0 10px 30px rgba(0,0,0,.55);padding:9px 10px 9px 12px;border-radius:12px;background:rgba(27,32,43,.97);border:1px solid var(--line);border-left:4px solid var(--blue);display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.4;cursor:pointer;animation:bubIn .2s ease-out}
.coachtip[hidden]{display:none}
.coachtip.mistake{border-left-color:var(--red)}.coachtip.mind{border-left-color:#b57cff}.coachtip.good{border-left-color:var(--good)}.coachtip.luck{border-left-color:var(--gold)}
.coachtip .ct-ic{font-size:18px;line-height:1.2}
.coachtip b{font-size:14px}.coachtip p{margin:2px 0 0;color:#cfd5e0}
.coachtip button{background:none;color:var(--muted);font-size:18px;line-height:1;padding:0 2px;margin-left:auto}
.statgrid.three{grid-template-columns:repeat(3,1fr)}
.rc-head{display:flex;gap:14px;align-items:center}
.rc-head h2{margin:0;text-align:left}.rc-head small{color:var(--muted)}
.rc-grade{width:64px;height:64px;border-radius:16px;display:grid;place-items:center;font-size:38px;font-weight:700;color:var(--g);background:color-mix(in srgb,var(--g) 15%,transparent);border:2px solid var(--g);flex:none}
.rc-list{display:grid;gap:4px}
.rc-row{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--panel2);border-radius:8px;padding:8px 10px}
.rc-row small{display:block;color:var(--muted);font-size:12px}
.rc-row b{font-size:16px;white-space:nowrap}
.rc-row .bad{color:#ff7b7f}.rc-row .ok{color:var(--good)}
.rc-ul{margin:0;padding-left:18px;display:grid;gap:4px;font-size:14px;line-height:1.4;text-align:left}

.start-pick{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted)}
.start-pick select{flex:1;font:inherit;font-size:16px;padding:10px 12px;border-radius:9px;border:1px solid var(--line);background:#151922;color:var(--text)}
.btn-row .status-pill{display:flex;align-items:center;justify-content:center;flex:1;min-width:120px;font-size:13px;padding:10px}

/* Blindrise brand */
.logo b span,.mini-logo span{color:var(--gold)}
.logo b{letter-spacing:-.03em;font-size:clamp(46px,14vw,80px)}
.logo .tagline{color:#cfd5e0;font-size:15px;margin-top:6px;letter-spacing:.02em}
.pill{font-size:clamp(13px,3.6vw,17px);letter-spacing:.24em}
.mini-logo{font-size:21px;letter-spacing:-.01em}
.chip span{font-size:calc(var(--s)*.12);line-height:1}
.mini-logo{gap:0}

.turnrow{display:flex;align-items:flex-end;gap:12px;min-height:30px}
.turnrow .turnbar{flex:1;margin-bottom:4px}
.xtime{background:rgba(240,195,90,.12);color:#f0c35a;border:1px solid rgba(240,195,90,.4);border-radius:999px;padding:6px 12px;font:inherit;font-size:13px;font-weight:600;display:inline-flex;gap:6px;align-items:baseline}
.xtime small{color:var(--muted);font-weight:500}
.xtime:disabled{opacity:.45}

/* chat stays a slim strip at the very bottom so the table stays in view */
.chat-sheet{max-height:34vh;gap:6px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(27,32,43,.96)}
.chat-log{min-height:0;max-height:13vh;font-size:14px}
.chat-head b{font-size:14px}
.chat-head .menu-btn{padding:5px 10px;font-size:13px}
.chat-quick button{padding:4px 10px;font-size:13px}
.chat-form input{padding:8px 10px}
.chat-note:empty{display:none}

/* winning a pot: chips glide to the winner and settle as a small stack in front of the seat */
.winpile{position:absolute;transform:translate(-50%,-50%);z-index:9;display:flex;flex-direction:column;align-items:center;pointer-events:none;transition:opacity .4s}
.winpile.gone{opacity:0}
.wstack{display:flex;gap:2px;align-items:flex-end;height:26px;position:relative;z-index:1}
.wcol{display:flex;flex-direction:column-reverse;width:18px}
.wcol i{display:block;width:18px;height:5px;margin-top:-1px;border-radius:50%/60%;background:linear-gradient(90deg,var(--cc,#c61a26) 0 18%,#f2eeee 18% 30%,var(--cc,#c61a26) 30% 70%,#f2eeee 70% 82%,var(--cc,#c61a26) 82%);box-shadow:0 1px 0 rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.35)}
.wcol:nth-child(2) i{--cc:#1f5fbf}.wcol:nth-child(3) i{--cc:#262a33}
.wcol i:nth-child(even){filter:brightness(.92)}
.wamt{margin-top:3px;font-size:12.5px;font-weight:800;color:var(--gold);background:rgba(0,0,0,.55);padding:1px 8px;border-radius:99px;box-shadow:inset 0 0 0 1px rgba(242,169,59,.35);white-space:nowrap;opacity:0;transform:translateY(-3px);transition:opacity .35s,transform .35s}
.wglow{position:absolute;left:50%;top:40%;width:88px;height:56px;transform:translate(-50%,-50%) scale(.6);border-radius:50%;background:radial-gradient(closest-side,rgba(242,169,59,.45),rgba(242,169,59,0));opacity:0;transition:opacity .6s,transform .6s}
.winpile.settled .wamt{opacity:1;transform:none}
.winpile.settled .wglow{opacity:1;transform:translate(-50%,-50%) scale(1);animation:wglow 2.4s ease-in-out .6s infinite alternate}
@keyframes wglow{to{opacity:.55}}
.seat.win .av{animation:winring .6s ease-out var(--wd,0ms) both}
@keyframes winring{from{box-shadow:0 0 0 0 rgba(242,169,59,0)}to{box-shadow:0 0 0 3px var(--gold),0 0 22px 4px rgba(242,169,59,.55)}}
.seat.win .plate{border-color:var(--gold);box-shadow:0 0 0 1.5px var(--gold),0 0 22px rgba(242,169,59,.4)}
.badge.won{background:var(--gold);color:var(--ink);letter-spacing:.06em;box-shadow:0 2px 8px rgba(242,169,59,.45);animation:winbadge .45s cubic-bezier(.2,1.2,.4,1) var(--wd,0ms) both}
@keyframes winbadge{from{opacity:0;transform:translateX(-50%) scale(.6)}to{opacity:1;transform:translateX(-50%) scale(1)}}
@media (prefers-reduced-motion:reduce){.seat.win .av,.badge.won{animation-duration:.01s;animation-delay:0s}.winpile.settled .wglow{animation:none}.wamt,.wglow{transition:none}}

/* egg and tomato splats on the target's avatar */
.splatfx{position:absolute;transform:translate(-50%,-50%);z-index:12;pointer-events:none;transition:opacity .5s}
.splatfx svg{width:100%;height:100%;overflow:visible;display:block}
.splatfx.fade{opacity:0}
.splatfx .spread{transform-origin:0 0;animation:sp-in .28s cubic-bezier(.2,1.5,.5,1) both}
.splatfx .drops circle{animation:sp-drop .35s ease-out both}
.splatfx .drip{transform-origin:0 8px;animation:sp-drip 1.3s cubic-bezier(.5,0,.6,1) .25s both}
.splatfx.egg .white{fill:#f7f4ea;fill-opacity:.94;stroke:rgba(0,0,0,.12);stroke-width:.6}
.splatfx.egg .yolk{fill:#f7b21b;stroke:#d98a0a;stroke-width:.8}
.splatfx.egg .shine{fill:rgba(255,255,255,.75)}
.splatfx.egg .drops circle{fill:#f7f4ea}
.splatfx.egg .drip{fill:#f5ad19;opacity:.95}
.splatfx.egg .shell{fill:#fbf6ec;stroke:#c9bfae;stroke-width:.7;animation:sp-shell .55s cubic-bezier(.2,.8,.4,1) both}
.splatfx.egg .s1{--sx:-16px;--sy:-14px;--sr:-50deg}.splatfx.egg .s2{--sx:16px;--sy:-8px;--sr:60deg}.splatfx.egg .s3{--sx:-12px;--sy:14px;--sr:-30deg}
.splatfx.tomato .pulp{fill:#d8231f;fill-opacity:.92}
.splatfx.tomato .juice{fill:#ff4a3a;fill-opacity:.85}
.splatfx.tomato .gel{fill:#f0703a;fill-opacity:.9}
.splatfx.tomato .seed{fill:#f6dc8c}
.splatfx.tomato .skin{fill:#a8140f}
.splatfx.tomato .drops circle{fill:#d8231f}
.splatfx.tomato .drip{fill:#c81d1a;opacity:.92}
@keyframes sp-in{from{transform:scale(.25);opacity:.3}to{transform:scale(1);opacity:1}}
@keyframes sp-drop{from{transform:translate(var(--dx),var(--dy)) scale(.3);opacity:0}to{transform:none;opacity:1}}
@keyframes sp-drip{from{transform:scaleY(.1);opacity:0}15%{opacity:1}to{transform:scaleY(1)}}
@keyframes sp-shell{from{transform:none;opacity:1}to{transform:translate(var(--sx),var(--sy)) rotate(var(--sr));opacity:.95}}
@media (prefers-reduced-motion:reduce){.splatfx .spread,.splatfx .drops circle,.splatfx .drip,.splatfx.egg .shell{animation-duration:.01s;animation-delay:0s}.splatfx{transition:none}}

/* welcome + sign-in: private-members look (midnight navy, champagne gold, glass). Scoped to #auth only. */
#auth.lux{--g:#d8b46a;--g2:#f1dfb0;--gd:#9c7a3c;--iv:#f4eee2;--mu:#a3abbb;--serif:"Cormorant Garamond","Iowan Old Style","Palatino Linotype",Georgia,serif;
  position:fixed;inset:0;display:block;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;color:var(--iv);
  background:radial-gradient(120% 60% at 50% -8%,#1b2a4a 0%,#0d1527 46%,#070a12 100%);user-select:text;-webkit-user-select:text}
#auth .lux-glow{position:fixed;inset:0;pointer-events:none;
  background:radial-gradient(60% 34% at 50% 14%,rgba(216,180,106,.16),transparent 70%),radial-gradient(50% 40% at 85% 105%,rgba(216,180,106,.08),transparent 70%),radial-gradient(40% 30% at 0% 70%,rgba(70,110,190,.10),transparent 70%)}
#auth .lux-glow::after{content:"";position:absolute;inset:0;opacity:.018;background-image:repeating-linear-gradient(115deg,#fff 0 1px,transparent 1px 3px)}
#auth .lux-wrap{position:relative;min-height:100%;width:min(460px,100%);margin:0 auto;display:flex;flex-direction:column;justify-content:center;gap:22px;
  padding:max(28px,env(safe-area-inset-top)) 20px max(24px,env(safe-area-inset-bottom))}
#auth .lux-brand{text-align:center;display:grid;justify-items:center;gap:6px}
#auth .lux-mark{width:44px;height:44px;color:var(--g);filter:drop-shadow(0 0 14px rgba(216,180,106,.35));margin-bottom:6px}
#auth .lux-word{margin:0;font-family:var(--body);font-weight:500;font-size:clamp(30px,9.4vw,44px);letter-spacing:.32em;margin-right:-.32em;line-height:1;
  background:linear-gradient(180deg,#fbf3dc 0%,var(--g2) 38%,var(--g) 70%,var(--gd) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
#auth .lux-tag{margin:6px 0 0;font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(24px,7vw,32px);line-height:1.1;color:var(--iv)}
#auth .lux-tag::after{content:"";display:block;width:56px;height:1px;margin:14px auto 0;background:linear-gradient(90deg,transparent,var(--g),transparent)}
#auth .lux-sub{margin:6px 0 0;color:var(--mu);font-size:14px;line-height:1.55;letter-spacing:.02em;max-width:30ch;text-wrap:balance}
#auth .lux-welcome{display:grid;gap:18px}
#auth .lux-invite{margin:0;text-align:center;color:var(--iv);font-size:15px;padding:12px 14px;border-radius:14px;border:1px solid rgba(216,180,106,.38);background:rgba(216,180,106,.07)}
#auth .lux-invite span{display:block;font-family:var(--cond);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--g);margin-bottom:3px}
#auth .lux-cards{list-style:none;margin:0;padding:0;display:grid;gap:10px}
#auth .lux-card{position:relative;display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:center;padding:14px 16px;border-radius:16px;
  background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.02));border:1px solid rgba(241,223,176,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 30px rgba(0,0,0,.28);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#auth .lux-card svg{width:40px;height:40px;padding:9px;border-radius:12px;border:1px solid rgba(216,180,106,.35);background:rgba(216,180,106,.08);fill:none;stroke:var(--g);stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
#auth .lux-card:first-child svg{fill:var(--g);stroke:none}
#auth .lux-card div{display:grid;gap:2px;min-width:0}
#auth .lux-card b{font-family:var(--serif);font-weight:600;font-size:21px;line-height:1.15;color:var(--iv);letter-spacing:.01em}
#auth .lux-card span{color:var(--mu);font-size:13.5px;line-height:1.4}
#auth .lux-card em{display:inline-block;vertical-align:4px;margin-left:2px;font-style:normal;font-family:var(--cond);font-weight:500;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--g);border:1px solid rgba(216,180,106,.4);border-radius:999px;padding:2px 7px 1px;white-space:nowrap}
#auth .lux-ctas{display:grid;gap:10px;margin-top:4px}
#auth .lux-btn{width:100%;min-height:52px;border-radius:999px;font-size:16px;font-weight:600;letter-spacing:.04em;color:#1a1408;
  background:linear-gradient(180deg,#f3e2b6 0%,#ddb96f 52%,#c09a52 100%);box-shadow:0 10px 28px rgba(216,180,106,.25),inset 0 1px 0 rgba(255,255,255,.55);transition:transform .15s ease,filter .15s ease}
#auth .lux-btn:active{transform:scale(.985);filter:brightness(.95)}
#auth .lux-btn.ghost{background:transparent;color:var(--iv);font-weight:500;border:1px solid rgba(241,223,176,.3);box-shadow:none}
#auth .lux-btn.ghost b{color:var(--g2);font-weight:600}
#auth .lux-note{margin:0;text-align:center;font-size:14px;line-height:1.45;color:var(--iv);padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
#auth .lux-foot{margin:2px 0 0;text-align:center;font-family:var(--cond);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:rgba(163,171,187,.7)}
/* the sign-in / join form, in the same glass */
#auth .glass{width:100%;padding:22px 18px 18px;gap:13px;border-radius:20px;color:var(--iv);
  background:linear-gradient(165deg,rgba(28,38,62,.86),rgba(12,18,32,.9));border:1px solid rgba(241,223,176,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 60px rgba(0,0,0,.45);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
#auth .glass h2{font-family:var(--serif);font-weight:600;font-size:28px;letter-spacing:.01em;color:var(--iv)}
#auth .glass p{color:var(--mu);font-size:14.5px}
#auth .field label{color:var(--g);font-size:11px;letter-spacing:.18em}
#auth .glass input:not([type=checkbox]){background:rgba(5,8,15,.6);border:1px solid rgba(241,223,176,.18);border-radius:12px;color:var(--iv);padding:13px 14px;transition:border-color .15s,box-shadow .15s}
#auth .glass input:not([type=checkbox]):focus{outline:none;border-color:var(--g);box-shadow:0 0 0 3px rgba(216,180,106,.18)}
#auth .glass input::placeholder{color:rgba(163,171,187,.6)}
#auth .agree{color:var(--mu)}
#auth .agree input{accent-color:var(--g)}
#auth .btn-red{border-radius:999px;min-height:52px;color:#1a1408;font-weight:600;letter-spacing:.04em;background:linear-gradient(180deg,#f3e2b6 0%,#ddb96f 52%,#c09a52 100%);box-shadow:0 10px 28px rgba(216,180,106,.22),inset 0 1px 0 rgba(255,255,255,.55)}
#auth .linkbtn{color:var(--mu);text-underline-offset:3px}
#auth .agree .linkbtn{color:var(--g2)}
#auth .linkbtn.back{justify-self:center;text-decoration:none;color:var(--g2);font-size:14px;padding:8px 14px;border:0;background:none}
#auth .fine{color:rgba(163,171,187,.8)}
#auth .err{color:#ff8a8f}
/* with a form open the brand steps back so the keyboard never hides the fields */
#auth.form-open .lux-wrap{gap:18px}
#auth.form-open .lux-sub{display:none}
#auth.form-open .lux-mark{width:34px;height:34px;margin-bottom:2px}
#auth.form-open .lux-word{font-size:clamp(24px,7vw,32px)}
#auth.form-open .lux-tag{font-size:20px}
#auth.form-open .lux-tag::after{display:none}
/* entrance */
@keyframes luxUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#auth .lux-brand,#auth .lux-card,#auth .lux-ctas,#auth .glass,#auth .lux-invite{animation:luxUp .6s cubic-bezier(.2,.7,.2,1) both}
#auth .lux-invite{animation-delay:.08s}
#auth .lux-card:nth-child(1){animation-delay:.12s}
#auth .lux-card:nth-child(2){animation-delay:.2s}
#auth .lux-card:nth-child(3){animation-delay:.28s}
#auth .lux-ctas{animation-delay:.36s}
@media (prefers-reduced-motion:reduce){#auth *{animation:none!important;transition:none!important}}
/* small phones (iPhone SE 1st gen, 320 wide / short screens) */
@media (max-width:360px){
  #auth .lux-wrap{padding-left:14px;padding-right:14px;gap:16px}
  #auth .lux-card{padding:12px;gap:12px;grid-template-columns:36px 1fr}
  #auth .lux-card svg{width:36px;height:36px;padding:8px}
  #auth .lux-card b{font-size:19px}
  #auth .glass{padding:18px 14px 14px}
}
@media (max-height:700px){
  #auth .lux-wrap{gap:14px;padding-top:max(18px,env(safe-area-inset-top))}
  #auth .lux-mark{display:none}
  #auth .lux-tag::after{margin-top:10px}
  #auth .lux-cards{gap:8px}
  #auth .lux-card{padding:11px 14px}
  #auth .lux-card span{font-size:12.5px}
  #auth.form-open .lux-tag{display:none}
}
/* wide screens: brand on the left, content on the right */
@media (min-width:860px) and (min-height:560px){
  #auth .lux-wrap{width:min(1040px,100%);display:grid;grid-template-columns:1fr minmax(380px,440px);align-content:center;column-gap:clamp(40px,7vw,100px);padding:40px}
  #auth .lux-brand{justify-items:start;text-align:left}
  #auth .lux-word{font-size:46px}
  #auth .lux-tag{font-size:40px;white-space:nowrap}
  #auth .lux-tag::after{margin-left:0}
  #auth .lux-sub{font-size:16px;max-width:34ch}
  #auth.form-open .lux-word{font-size:46px}
  #auth.form-open .lux-tag{font-size:40px;display:block}
  #auth.form-open .lux-sub{display:block}
  #auth.form-open .lux-mark{width:44px;height:44px}
}

/* ---------- a club's public join page (/join/<club-slug>): the club's own name leads, the Blindrise brand steps aside ---------- */
#auth.club-join .lux-brand{display:none}
#auth.club-join .lux-wrap{display:flex;width:min(440px,100%);padding-top:max(28px,env(safe-area-inset-top));padding-bottom:28px}
#auth .club-join-box{display:grid}
#auth .cj-load{text-align:center;color:var(--mu)}
#auth .cj-card{display:grid;gap:14px;justify-items:center;text-align:center;padding:26px 20px 18px;border-radius:22px;color:var(--iv);
  background:linear-gradient(165deg,rgba(28,38,62,.86),rgba(12,18,32,.9));border:1px solid rgba(241,223,176,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 60px rgba(0,0,0,.45);animation:luxUp .6s cubic-bezier(.2,.7,.2,1) both}
#auth .cj-av{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-weight:600;font-size:32px;color:#1a1408;letter-spacing:.02em;
  background:linear-gradient(180deg,#f3e2b6 0%,#ddb96f 52%,#c09a52 100%);box-shadow:0 0 0 1px rgba(241,223,176,.5),0 0 0 6px rgba(216,180,106,.12),0 12px 30px rgba(216,180,106,.25)}
#auth .cj-eyebrow{font-family:var(--cond);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--g)}
#auth .cj-title{margin:0;font-family:var(--serif);font-weight:600;font-size:clamp(28px,8.4vw,36px);line-height:1.1;color:var(--iv);text-wrap:balance}
#auth .cj-title em{font-style:italic;color:var(--g2)}
#auth .cj-lead{margin:0;color:var(--mu);font-size:14.5px}
#auth .cj-perks{list-style:none;margin:0;padding:0;display:grid;gap:8px;width:100%;text-align:left}
#auth .cj-perks li{position:relative;padding:10px 12px 10px 36px;border-radius:12px;font-size:14px;line-height:1.35;color:var(--iv);background:rgba(255,255,255,.035);border:1px solid rgba(241,223,176,.1)}
#auth .cj-perks li::before{content:"";position:absolute;left:14px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--g);box-shadow:0 0 10px rgba(216,180,106,.6)}
#auth .cj-form{display:grid;gap:12px;width:100%;text-align:left}
#auth .cj-field{display:grid;gap:6px}
#auth .cj-field span{font-family:var(--cond);color:var(--g);font-size:11px;letter-spacing:.18em;text-transform:uppercase}
#auth .cj-field input{width:100%;font-size:16px;background:rgba(5,8,15,.6);border:1px solid rgba(241,223,176,.18);border-radius:12px;color:var(--iv);padding:13px 14px}
#auth .cj-field input:focus{outline:none;border-color:var(--g);box-shadow:0 0 0 3px rgba(216,180,106,.18)}
#auth .cj-field input::placeholder{color:rgba(163,171,187,.6)}
#auth .cj-agree{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.45;color:var(--mu)}
#auth .cj-agree input{margin-top:2px;width:20px;height:20px;flex:none;accent-color:var(--g)}
#auth .cj-form .err{min-height:0}
#auth .cj-form .err:empty{display:none}
#auth .cj-form .lux-btn{letter-spacing:.14em}
#auth .cj-form .lux-btn:disabled{opacity:.6}
#auth .cj-done{display:grid;gap:4px;width:100%;padding:16px;border-radius:14px;border:1px solid rgba(216,180,106,.38);background:rgba(216,180,106,.08)}
#auth .cj-done b{font-family:var(--serif);font-size:24px;font-weight:600;color:var(--g2)}
#auth .cj-done span{color:var(--iv);font-size:14px}
#auth .cj-fine{margin:0;font-family:var(--cond);font-size:11.5px;letter-spacing:.06em;color:rgba(163,171,187,.85);line-height:1.4}
#auth .cj-fine + .cj-fine{margin-top:-8px}

/* ---------- the owner's join QR card (Director) ---------- */
.qr-card .qr-club{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center}
.qr-card .qr-club div{display:grid;gap:2px;min-width:0}
.qr-card .qr-club b{font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qr-card .qr-club small{color:var(--muted)}
.qr-card .qr-av{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:18px;color:#1a1408;background:linear-gradient(180deg,#f3e2b6,#c09a52)}
#lobby .qr-card .status-pill.live{background:rgba(79,209,161,.12);border-color:rgba(79,209,161,.55);color:var(--good)}
.qr-card .qr-box{justify-self:center;padding:10px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px rgba(216,180,106,.45),0 10px 30px rgba(0,0,0,.35)}
.qr-card .qr-box canvas{display:block;width:min(240px,62vw);height:auto;image-rendering:pixelated}
.qr-card .qr-url{margin:0;text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;word-break:break-all;color:var(--gold)}
.qr-card .qr-acts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.qr-card .qr-acts .btn{width:100%;min-width:0;margin:0;padding-left:6px;padding-right:6px}
.qr-card .qr-leads summary{cursor:pointer;color:var(--muted);font-size:14px}
.qr-card .qr-leads .table-list{margin-top:8px}

/* printing the join QR: only the sheet goes to paper */
.qr-print{display:none}
@media print{
  body.print-qr > *:not(.qr-print){display:none !important}
  body.print-qr{background:#fff !important;padding:0 !important}
  body.print-qr .qr-print{display:block;text-align:center}
  body.print-qr .qr-print img{width:100%;max-width:16cm;height:auto}
}

.staging-banner{position:fixed;top:0;left:50%;transform:translateX(-50%);z-index:99;background:#b8161f;color:#fff;font:600 11px/1 system-ui,sans-serif;letter-spacing:.08em;padding:4px 10px;border-radius:0 0 8px 8px;pointer-events:none}

/* ---------- Business Club: members' businesses. Champagne-gold accent inside the slate palette ---------- */
:root{--biz:#d9b26f;--biz-hi:#f0d9a6;--biz-deep:#8f6a2e;--biz-soft:rgba(217,178,111,.1);--biz-line:rgba(217,178,111,.38)}
.tabs .biz-tab{color:var(--biz)}
.tabs .biz-tab[aria-selected="true"]{color:var(--biz-hi);border-color:var(--biz)}
.bz-eyebrow{color:var(--biz)!important;letter-spacing:.06em!important;text-transform:uppercase!important;font-size:12px!important}
.btn.bz-gold{background:linear-gradient(180deg,#e6c381,#c99a4e);color:#1d1710;border:0}
.btn.bz-gold:active{filter:brightness(.92)}
.btn.big,.bz-stack .btn{min-height:50px}
.btn.danger{color:#ff9aa1}
.btn.ghost{background:transparent;color:var(--muted)}
label.btn{display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;text-align:center}
.bz-stack{display:grid;gap:10px}
.bz-muted,.card-box p.bz-muted{color:var(--muted);font-size:13px}
.bz-head{background:radial-gradient(120% 140% at 100% 0%,rgba(217,178,111,.16),transparent 55%),var(--panel);border-color:var(--biz-line)}
.bz-head h2{margin:0;font-size:24px;letter-spacing:-.01em}
.bz-back{align-self:flex-start;background:transparent;color:var(--biz);font-weight:600;font-size:15px;padding:10px 4px;min-height:44px}
/* logo tile: the member's logo, or a monogram on a deep gradient */
.bz-logo{flex:none;width:52px;height:52px;border-radius:12px;display:grid;place-items:center;overflow:hidden;border:1px solid var(--biz-line);background:linear-gradient(145deg,#2b2f3c,#1a1d26);color:var(--biz-hi);font-weight:700;font-size:18px;letter-spacing:.02em}
.bz-logo img{width:100%;height:100%;object-fit:cover;background:#fff}
.bz-logo.h1{background:linear-gradient(145deg,#24324d,#151b2a)}.bz-logo.h2{background:linear-gradient(145deg,#2d2a3f,#18161f)}
.bz-logo.h3{background:linear-gradient(145deg,#1f3a36,#121d1c)}.bz-logo.h4{background:linear-gradient(145deg,#3b2a22,#1d1512)}.bz-logo.h5{background:linear-gradient(145deg,#33243a,#1a1320)}
.bz-logo.sm{width:40px;height:40px;font-size:14px;border-radius:10px}
.bz-logo.lg{width:64px;height:64px;font-size:22px;border-radius:14px}
.bz-logo.xl{width:76px;height:76px;font-size:26px;border-radius:16px}
.bz-card{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px;min-height:76px;position:relative}
.bz-card:hover,.bz-mini:hover,.bz-row:hover{border-color:var(--biz-line)}
.bz-card-txt{display:grid;gap:3px;min-width:0;flex:1}
.bz-card-txt b{font-size:16px;line-height:1.25;overflow-wrap:anywhere}
.bz-card-txt small,.bz-mini small,.bz-row small{color:var(--muted);font-size:13px;line-height:1.3}
.bz-by{color:#b9c0cd!important}
.bz-new{position:absolute;top:8px;right:8px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#1d1710;background:var(--biz);border-radius:99px;padding:2px 7px}
.bz-spot{border-color:var(--biz);background:linear-gradient(160deg,rgba(217,178,111,.2),rgba(217,178,111,.04) 60%),var(--panel);box-shadow:0 10px 30px rgba(0,0,0,.25),inset 0 1px 0 rgba(240,217,166,.18)}
.bz-spot-main{display:flex;gap:14px;align-items:flex-start;text-align:left;background:transparent;padding:0;min-height:44px}
.bz-spot-main b{font-size:20px}
.bz-spot-desc{color:#cfd5e0;font-size:14px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bz-empty{text-align:center;justify-items:center;padding:26px 16px}
.bz-empty .btn-row{width:100%}
.bz-empty-art{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:26px;color:var(--biz);background:var(--biz-soft);border:1px solid var(--biz-line)}
.bz-find{display:grid;gap:10px;position:sticky;top:-14px;z-index:5;background:var(--ink);padding:6px 0}
.bz-search{width:100%;font:inherit;font-size:16px;padding:13px 14px 13px 40px;border-radius:12px;border:1px solid var(--line);background:#151922 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%2397a0b2' stroke-width='2'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E") 13px 50%/18px no-repeat;color:var(--text);min-height:48px}
.bz-search:focus{border-color:var(--biz);outline:none}
.bz-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;margin:0 -16px;padding-left:16px;padding-right:16px}
.bz-chips::-webkit-scrollbar,.bz-rail::-webkit-scrollbar{display:none}
.bz-chip{flex:none;min-height:40px;padding:8px 14px;border-radius:99px;background:var(--panel2);border:1px solid var(--line);color:var(--muted);font-weight:600;font-size:14px;white-space:nowrap}
.bz-chip[aria-pressed="true"]{background:var(--biz-soft);border-color:var(--biz);color:var(--biz-hi)}
.bz-count{color:var(--muted);font-size:13px;margin:2px 2px -4px}
.bz-grid{display:grid;gap:10px}
.bz-nomatch{display:grid;gap:10px;justify-items:center}
.bz-rail{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -14px;padding:2px 14px 4px;scroll-padding:0 14px;overscroll-behavior-x:contain}
.bz-mini{position:relative;flex:0 0 152px;scroll-snap-align:start;display:grid;justify-items:start;gap:4px;text-align:left;background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:12px;min-height:44px}
.bz-mini b{font-size:15px;line-height:1.25;margin-top:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bz-mini .bz-new{top:10px;right:10px}
.bz-mini.spot{border-color:var(--biz);background:linear-gradient(170deg,rgba(217,178,111,.2),var(--panel2) 70%)}
.bz-star{position:absolute;top:8px;right:10px;color:var(--biz-hi);font-size:16px}
.bz-mini.spot .bz-new{top:30px}
.bz-home{border-color:var(--biz-line);background:linear-gradient(180deg,rgba(217,178,111,.08),transparent 120px),var(--panel)}
.bz-home-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.bz-home-head h3{margin-top:2px}
.bz-link{background:transparent;color:var(--biz);font-weight:600;font-size:14px;min-height:44px;padding:0 4px;white-space:nowrap}
.bz-newlist{display:grid;gap:8px;border-top:1px solid var(--line);padding-top:12px}
.bz-row{display:flex;align-items:center;gap:12px;text-align:left;background:transparent;border:1px solid transparent;border-radius:12px;padding:6px 4px;min-height:52px}
.bz-row span:nth-child(2){display:grid;gap:2px;flex:1;min-width:0}
.bz-row b{font-size:15px}
.bz-chev{color:var(--muted);font-size:22px}
.bz-homewrap{display:grid;gap:12px}
.bz-homewrap:empty{display:none}
.bz-intro{position:relative;border-color:var(--biz-line);background:radial-gradient(100% 120% at 0% 0%,rgba(217,178,111,.15),transparent 60%),var(--panel)}
.bz-x{position:absolute;top:4px;right:4px;width:44px;height:44px;border-radius:50%;background:transparent;color:var(--muted);font-size:24px;line-height:1}
.bz-detail .bz-hero h2,.bz-mine .bz-hero h2{margin:0 0 6px;font-size:22px;line-height:1.2;overflow-wrap:anywhere}
.bz-hero{display:flex;gap:14px;align-items:center}
.bz-hero small{color:var(--muted);font-size:13px}
.bz-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.bz-tag{font-size:12px;font-weight:600;padding:3px 9px;border-radius:99px;background:var(--biz-soft);color:var(--biz-hi);border:1px solid var(--biz-line)}
.bz-tag.good{background:rgba(79,209,161,.12);color:var(--good);border-color:rgba(79,209,161,.35)}
.bz-sect{display:grid;gap:6px;border-top:1px solid var(--line);padding-top:12px}
.card-box p.bz-pre{white-space:pre-line;color:#d5dae3;font-size:15px;overflow-wrap:anywhere}
.bz-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bz-act{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;border-radius:12px;background:var(--panel2);border:1px solid var(--line);color:var(--text);text-decoration:none;font-weight:600;font-size:15px;padding:8px 10px;text-align:center;overflow-wrap:anywhere}
.bz-act.primary{grid-column:1/-1;background:linear-gradient(180deg,#e6c381,#c99a4e);color:#1d1710;border:0}
.bz-ic{font-size:16px}
.bz-form fieldset{border:1px solid var(--line);border-radius:12px;padding:12px;margin:0;display:grid;gap:12px}
.bz-form legend{padding:0 6px;color:var(--biz);font-weight:600;font-size:13px}
.bz-field{display:grid;gap:5px}
.bz-field>span{font-size:13px;color:var(--muted)}
.bz-field>span i{font-style:normal;color:var(--biz);font-size:12px}
.bz-form textarea{font:inherit;font-size:16px;padding:10px 12px;border-radius:9px;border:1px solid var(--line);background:#151922;color:var(--text);width:100%;resize:vertical;min-height:48px}
.bz-form input,.bz-form select{min-height:48px}
.bz-field.missing input,.bz-field.missing textarea,.bz-field.missing select{border-style:dashed;border-color:rgba(242,169,59,.7);background:rgba(242,169,59,.06)}
.bz-field.missing>span::after{content:" · not found on the card";color:var(--gold);font-size:12px}
.bz-contact{display:grid;gap:6px}
.bz-switch{display:flex!important;align-items:center;gap:10px;min-height:44px;font-size:14px!important;color:var(--text)!important;cursor:pointer}
.bz-switch input{appearance:none;-webkit-appearance:none;flex:none;width:44px!important;height:26px;min-height:0!important;padding:0!important;border-radius:99px!important;background:#3a4152!important;border:0!important;position:relative;transition:background .15s}
.bz-switch input::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#e8ebf1;transition:transform .15s}
.bz-switch input:checked{background:var(--biz)!important}
.bz-switch input:checked::after{transform:translateX(18px)}
.bz-switch.big{font-size:15px!important}
.bz-logo-row{display:flex;align-items:center;gap:14px}
.bz-logo-row .bz-stack{flex:1}
.bz-err:empty{display:none}
.bz-err{color:#ff9aa1;background:rgba(229,72,77,.12);border:1px solid rgba(229,72,77,.4);border-radius:10px;padding:10px 12px;font-size:14px}
.bz-scan-note{display:grid;gap:4px;background:var(--biz-soft);border:1px solid var(--biz-line);border-radius:12px;padding:12px;font-size:14px;line-height:1.45;color:#d5dae3}
.bz-scan-note b{color:var(--biz-hi)}
.bz-scan h2{margin:0;font-size:22px}
.bz-warn{background:rgba(242,169,59,.12);border:1px solid rgba(242,169,59,.5);border-radius:12px;padding:12px;color:#f6d79b;font-size:15px;line-height:1.45}
.bz-tips{margin:0;padding-left:20px;color:#cfd5e0;font-size:14px;line-height:1.7}
.bz-cardart{position:relative;margin:4px auto;width:200px;aspect-ratio:1.75;border-radius:12px;border:1px solid var(--biz-line);background:linear-gradient(135deg,#2d3242,#1b1f29);box-shadow:0 12px 30px rgba(0,0,0,.35);display:grid;align-content:center;gap:9px;padding:0 22px}
.bz-cardart i{display:block;height:8px;border-radius:4px;background:rgba(232,235,241,.25)}
.bz-cardart i:first-child{width:60%;height:12px;background:var(--biz)}
.bz-cardart i:nth-child(2){width:80%}.bz-cardart i:nth-child(3){width:45%}
.bz-cardart::before,.bz-cardart::after{content:"";position:absolute;width:22px;height:22px;border:2px solid var(--biz);opacity:.8}
.bz-cardart::before{top:-8px;left:-8px;border-right:0;border-bottom:0;border-radius:6px 0 0 0}
.bz-cardart::after{bottom:-8px;right:-8px;border-left:0;border-top:0;border-radius:0 0 6px 0}
.bz-reading .bz-cardart{overflow:visible}
.bz-reading .bz-cardart i:first-child{animation:bzpulse 1.2s ease-in-out infinite}
@keyframes bzpulse{50%{opacity:.4}}
.bz-progress{height:8px;border-radius:99px;background:var(--panel2);overflow:hidden}
.bz-progress i{display:block;height:100%;background:linear-gradient(90deg,#c99a4e,#f0d9a6);transition:width .3s}
.bz-progress-lbl{text-align:center;color:var(--text)!important;font-weight:600}
@media (prefers-reduced-motion:reduce){.bz-reading .bz-cardart i:first-child{animation:none}}
/* desktop: the Business Club tab uses the width it gets */
@media (min-width:900px){
  .app.wide{max-width:1120px}
  .app.wide .scroll{padding:20px 28px 40px}
  .app.wide .bz-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .app.wide .bz-detail,.app.wide .bz-mine,.app.wide .bz-scan,.app.wide .bz-form,.app.wide .bz-dir{max-width:760px}
  .app.wide .card-box:has(.bz-form){max-width:760px}
  .app.wide .bz-chips{margin:0;padding:0;flex-wrap:wrap}
  .app.wide .bz-acts{grid-template-columns:repeat(3,1fr)}
  .app.wide .bz-find{top:-20px}
}
@media (min-width:600px) and (max-width:899px){ .app.wide .bz-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
.bz-person{font-size:14px;color:#d5dae3;margin-bottom:2px}
/* very narrow phones: the tab row scrolls instead of squeezing five tabs */
@media (max-width:380px){.tabs{overflow-x:auto;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tabs button{flex:1 0 auto;padding-left:9px;padding-right:9px}}
/* mouse and trackpad: a slim scrollbar shows the rails scroll sideways */
@media (hover:hover) and (pointer:fine){.bz-rail{scrollbar-width:thin;scrollbar-color:var(--biz-line) transparent;padding-bottom:10px}.bz-rail::-webkit-scrollbar{display:block;height:6px}.bz-rail::-webkit-scrollbar-thumb{background:var(--biz-line);border-radius:3px}}

/* ---------- Opportunity Club: "I need help" / "I can help" inside Business Club ---------- */
:root{--need:#7fb2ff;--need-soft:rgba(127,178,255,.12);--need-line:rgba(127,178,255,.4);--offer:#4fd1a1;--offer-soft:rgba(79,209,161,.12);--offer-line:rgba(79,209,161,.4)}
.tabs .biz-tab{position:relative}
.op-tabdot{display:inline-block;vertical-align:2px;margin-left:5px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--biz);color:#1d1710;font-size:11px;font-weight:700;line-height:18px;text-align:center}
.op-top{display:grid;gap:10px}
.op-entry{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.op-big{display:flex;align-items:center;gap:10px;min-height:64px;padding:10px 12px;border-radius:14px;text-align:left;color:var(--text);border:1px solid}
.op-big b{display:block;font-size:17px;line-height:1.2}
.op-big small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.op-big-ic{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:20px;font-weight:700}
.op-big.need{background:linear-gradient(160deg,var(--need-soft),transparent 80%),var(--panel);border-color:var(--need-line)}
.op-big.need .op-big-ic{background:var(--need);color:#0f1a2e}
.op-big.offer{background:linear-gradient(160deg,var(--offer-soft),transparent 80%),var(--panel);border-color:var(--offer-line)}
.op-big.offer .op-big-ic{background:var(--offer);color:#0c2a1e}
.op-big:active{filter:brightness(.9)}
.op-seg{display:grid;grid-template-columns:1fr 1fr;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:4px;gap:4px}
.op-seg button{min-height:44px;border-radius:9px;background:transparent;color:var(--muted);font-weight:600;font-size:15px;display:flex;align-items:center;justify-content:center;gap:6px}
.op-seg button[aria-selected="true"]{background:var(--ink);color:var(--biz-hi);box-shadow:inset 0 0 0 1px var(--biz-line)}
.op-seg.small button{font-size:14px}
.op-dot{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--biz);color:#1d1710;font-size:12px;font-weight:700}
.op-dot.big{min-width:26px;height:26px;font-size:13px}
.op-dot.warn{background:#f2a93b}
.op-tools{display:grid;gap:8px}
.op-row{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px;min-height:56px;color:var(--text)}
.op-row>span:first-child{display:grid;gap:2px;flex:1;min-width:0}
.op-row b{font-size:15px}
.op-row small{color:var(--muted);font-size:13px}
.op-row.dir{border-style:dashed}
.op-row:hover,.op-card:hover{border-color:var(--biz-line)}
.op-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.op-filters .bz-chips{flex:1 1 auto}
.op-select{font:inherit;font-size:15px;min-height:42px;padding:8px 12px;border-radius:99px;border:1px solid var(--line);background:var(--panel2);color:var(--text);max-width:100%}
.op-all{font-size:13px!important;color:var(--muted)!important}
.op-grid{display:grid;gap:10px}
.op-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.op-card-top small{color:var(--muted);font-size:12px}
.op-snip{color:#cfd5e0;font-size:14px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.op-meta{color:var(--muted);font-size:13px}
.op-type{display:inline-block;font-size:12px;font-weight:700;padding:3px 9px;border-radius:99px;border:1px solid}
.op-type.need{color:var(--need);background:var(--need-soft);border-color:var(--need-line)}
.op-type.offer{color:var(--offer);background:var(--offer-soft);border-color:var(--offer-line)}
.op-state{display:inline-block;font-size:12px;font-weight:600;padding:3px 9px;border-radius:99px;background:var(--biz-soft);color:var(--biz-hi);border:1px solid var(--biz-line)}
.op-state.idle{background:var(--panel2);color:var(--muted);border-color:var(--line)}
.op-state.warn{background:rgba(242,169,59,.12);color:#f6d79b;border-color:rgba(242,169,59,.5)}
.op-state.good{background:var(--offer-soft);color:var(--offer);border-color:var(--offer-line)}
.op-mini-state{justify-self:start;font-size:12px;font-weight:600;color:var(--biz-hi)}
.op-mini-state.warn{color:#f6d79b}
.op-detail h2{margin:0;font-size:22px;line-height:1.25;overflow-wrap:anywhere}
.op-by{color:var(--muted);font-size:14px;margin:0}
.op-by b{color:var(--text)}
.op-cta{min-height:56px!important;font-size:17px}
.op-status{border-radius:12px;padding:12px;font-size:14px;line-height:1.45;background:var(--biz-soft);border:1px solid var(--biz-line);color:#e7dcc3;margin:0;overflow-wrap:anywhere}
.op-status.shared{background:var(--offer-soft);border-color:var(--offer-line);color:#c9f1e1}
.op-status.declined{background:var(--panel2);border-color:var(--line);color:var(--muted)}
.op-report{justify-self:start;background:transparent;color:var(--muted);text-decoration:underline;font-size:14px;min-height:44px;padding:0 4px}
.op-reported{text-align:center}
.op-privacy{margin:0;font-size:13px;line-height:1.45;color:#cfd5e0;background:var(--panel2);border-radius:10px;padding:10px 12px}
.op-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.op-count{justify-self:end;color:var(--muted);font-size:12px}
.op-count.over{color:#ff9aa1}
.op-tsels{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.op-tsel{display:grid;gap:2px;text-align:left;min-height:64px;padding:10px 12px;border-radius:12px;background:var(--panel2);border:1px solid var(--line);color:var(--text)}
.op-tsel b{font-size:16px}
.op-tsel small{color:var(--muted);font-size:12px}
.op-tsel.need[aria-checked="true"]{background:var(--need-soft);border-color:var(--need);box-shadow:inset 0 0 0 1px var(--need)}
.op-tsel.offer[aria-checked="true"]{background:var(--offer-soft);border-color:var(--offer);box-shadow:inset 0 0 0 1px var(--offer)}
.op-mine,.op-sent,.op-q{gap:10px}
.op-title-btn{display:grid;gap:3px;text-align:left;background:transparent;padding:0;min-height:44px;color:var(--text)}
.op-title-btn b{font-size:17px;line-height:1.3;overflow-wrap:anywhere}
.op-title-btn small{color:var(--muted);font-size:13px}
.op-reqs{display:grid;gap:8px;border-top:1px solid var(--line);padding-top:10px}
.op-req{display:grid;gap:6px;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.op-req.sent{border-color:var(--biz-line);background:linear-gradient(160deg,rgba(217,178,111,.08),transparent 70%),var(--panel2)}
.op-req-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.op-req-head small{color:var(--muted);font-size:12px}
.op-req p.bz-pre,.op-about p.bz-pre{margin:0;font-size:15px;color:#d5dae3;white-space:pre-line;overflow-wrap:anywhere}
.op-mymsg{margin:0;font-size:14px;color:var(--muted);overflow-wrap:anywhere}
.op-mymsg span{color:#d5dae3;white-space:pre-line}
.op-replist{margin:0;padding-left:18px;display:grid;gap:6px;font-size:14px;color:#cfd5e0}
.op-note{display:block;color:var(--muted);font-style:italic;overflow-wrap:anywhere}
.op-q.review,.op-q.hidden{border-color:rgba(242,169,59,.5)}
/* bottom sheet: phones slide it up from the bottom; wide screens get a centered panel */
.op-sheet-wrap{position:fixed;inset:0;z-index:70;background:rgba(6,8,12,.62);display:flex;align-items:flex-end;justify-content:center}
.op-sheet{width:100%;max-width:540px;max-height:92vh;max-height:92dvh;overflow:auto;background:var(--panel);border:1px solid var(--line);border-bottom:0;border-radius:18px 18px 0 0;padding:8px 16px calc(16px + env(safe-area-inset-bottom));box-shadow:0 -12px 40px rgba(0,0,0,.45);animation:opup .18s ease-out;user-select:text;-webkit-user-select:text}
@keyframes opup{from{transform:translateY(30px);opacity:.4}}
@media (prefers-reduced-motion:reduce){.op-sheet{animation:none}}
.op-grab{width:40px;height:4px;border-radius:2px;background:var(--line);margin:4px auto 6px}
.op-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:8px;position:relative;min-height:44px}
.op-sheet-head h3{margin:0;font-size:19px}
.op-sheet-head .bz-x{position:static}
.op-form{display:grid;gap:12px}
.op-about{display:grid;gap:4px;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.op-about b{font-size:15px;overflow-wrap:anywhere}
.op-about small{color:var(--muted);font-size:13px}
.op-about .op-type{justify-self:start}
.op-form input:disabled{opacity:.45}
.op-radios{display:grid;gap:6px}
.op-radio{display:flex;align-items:center;gap:10px;min-height:46px;padding:6px 12px;border-radius:10px;background:var(--panel2);border:1px solid var(--line);font-size:15px;cursor:pointer}
.op-radio input{width:20px;height:20px;accent-color:var(--biz);min-height:0!important}
.op-radio:has(input:checked){border-color:var(--biz);background:var(--biz-soft)}
@media (min-width:900px){
  .op-sheet-wrap{align-items:center}
  .op-sheet{border-radius:18px;border-bottom:1px solid var(--line);padding-bottom:18px}
  .app.wide .op-top{max-width:820px}
  .app.wide .op-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .app.wide .op-detail,.app.wide .op-mine,.app.wide .op-sent,.app.wide .op-q,.app.wide .op-tools,.app.wide .card-box:has(.op-tsels){max-width:760px}
  .app.wide .op-filters .bz-chips{flex:0 1 auto}
}
@media (max-width:360px){.op-big small{display:none}.op-two{grid-template-columns:1fr}}
.op-home{border-color:var(--biz-line);background:linear-gradient(180deg,rgba(127,178,255,.06),transparent 120px),var(--panel)}
.op-homelist{display:grid;gap:6px;border-top:1px solid var(--line);padding-top:10px}
.op-hrow{display:flex;align-items:center;gap:10px;text-align:left;background:transparent;border:1px solid transparent;border-radius:12px;padding:8px 4px;min-height:56px;color:var(--text)}
.op-hrow>span:first-child{display:grid;gap:3px;flex:1;min-width:0;justify-items:start}
.op-hrow b{font-size:15px;line-height:1.3;overflow-wrap:anywhere}
.op-hrow small{color:var(--muted);font-size:13px}
.op-hrow:hover{border-color:var(--biz-line)}
.op-catchips{display:flex;flex-wrap:wrap;gap:6px}
.op-catchips .bz-chip{min-height:38px;padding:6px 12px;font-size:13px}
.op-starters{display:flex;flex-wrap:wrap;gap:6px}
.op-starter{min-height:36px;padding:6px 12px;border-radius:99px;background:transparent;border:1px dashed var(--biz-line);color:var(--biz-hi);font-size:13px;font-weight:600}
.op-form input:not([type=checkbox]):not([type=radio]){font:inherit;font-size:16px;padding:10px 12px;border-radius:9px;border:1px solid var(--line);background:#151922;color:var(--text);width:100%;min-height:48px}
.op-form input:focus,.op-form textarea:focus{border-color:var(--biz);outline:none}


/* ---------- Release 1 Home: Poker | Business | Opportunities ---------- */
.ic{width:1em;height:1em;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.14em}
/* industry colours for covers, monograms and icons */
.c-realestate{--cc:#5b8def}.c-trades{--cc:#e08a3c}.c-home{--cc:#3fb7a7}.c-food{--cc:#e0664f}.c-health{--cc:#e45d7f}.c-beauty{--cc:#c56ad8}
.c-fitness{--cc:#48c26b}.c-professional{--cc:#8f9bd6}.c-finance{--cc:#3fae7a}.c-tech{--cc:#4aa8f5}.c-creative{--cc:#f06aa0}.c-retail{--cc:#d9b26f}
.c-auto{--cc:#8d9bb5}.c-events{--cc:#b57cff}.c-education{--cc:#f2a93b}.c-travel{--cc:#36b5d8}.c-other{--cc:#8a93a6}

/* section switcher: sticky at the top of Home */
.home-nav{position:sticky;top:-14px;z-index:8;flex:none;margin:-14px -16px 0;padding:10px 16px;display:flex;gap:6px;
  background:rgba(22,26,35,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(55,62,79,.6)}
.home-nav button{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:center;gap:5px;min-height:44px;padding:6px 10px;border-radius:99px;background:var(--panel);border:1px solid var(--line);color:#c3c9d6;font-weight:600;font-size:14px;white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
.home-nav button .ic{font-size:16px}
.home-nav button span{overflow:hidden;text-overflow:ellipsis}
.home-nav .hn-poker[aria-current="true"]{background:rgba(74,144,245,.16);border-color:var(--blue);color:#fff}
.home-nav .hn-biz[aria-current="true"]{background:var(--biz-soft);border-color:var(--biz);color:var(--biz-hi)}
.home-nav .hn-opp[aria-current="true"]{background:var(--offer-soft);border-color:var(--offer);color:#b9f0dc}
.home-nav .hn-biz .ic{color:var(--biz)}.home-nav .hn-opp .ic{color:var(--offer)}.home-nav .hn-poker .ic{color:var(--blue)}

/* Home children never shrink in the scrolling column (cards with overflow:hidden would otherwise collapse) */
.scroll>*{flex-shrink:0}
/* section headers */
.hsec{display:grid;gap:12px;min-width:0}
.hsec:empty{display:none}
.hsec-head{display:flex;align-items:center;gap:12px;margin-top:10px;scroll-margin-top:70px}
.scroll>.hsec-head:first-child,.home-nav+.hsec-head{margin-top:4px}
.hsec-ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:21px;border:1px solid}
.hsec-ic.poker{color:#cfe0ff;background:linear-gradient(145deg,#2e6bcf,#1d3f7a);border-color:rgba(127,178,255,.45)}
.hsec-ic.biz{color:#1d1710;background:linear-gradient(145deg,#f0d9a6,#c99a4e);border-color:rgba(240,217,166,.6)}
.hsec-ic.opp{color:#0c2a1e;background:linear-gradient(145deg,#8fe6c4,#3fae7a);border-color:rgba(143,230,196,.6)}
.hsec-t{flex:1;min-width:0;display:grid;gap:1px}
.hsec-t h2{margin:0;font-size:21px;line-height:1.15;font-weight:700;letter-spacing:-.01em}
.hsec-t small{color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hsec-t small.live{color:#9cc4ff;font-weight:600}
.hsec-t small.live::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--red);margin-right:6px;vertical-align:1px;animation:livedot 1.6s ease-in-out infinite}
@keyframes livedot{50%{opacity:.35}}
.hsec-link{display:inline-flex;align-items:center;gap:2px;background:transparent;color:var(--blue);font-weight:600;font-size:14px;min-height:44px;padding:0 2px 0 8px;white-space:nowrap}
.hsec-biz .hsec-link,.bz-head .hsec-link{color:var(--biz)}
.hsec-opp .hsec-link{color:var(--offer)}

/* poker hero: the tournament card */
.card-box.poker-hero{position:relative;overflow:hidden;padding:18px 16px 16px;border-color:rgba(74,144,245,.45);
  background:radial-gradient(90% 120% at 100% 0%,rgba(74,144,245,.32),transparent 60%),radial-gradient(70% 90% at 0% 100%,rgba(22,58,108,.55),transparent 70%),linear-gradient(160deg,#1f3156,#1a2234 55%,#1b202c);
  box-shadow:0 14px 34px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.06)}
.poker-hero .hero-art{position:absolute;top:10px;right:6px;width:112px;height:auto;filter:drop-shadow(0 8px 14px rgba(0,0,0,.45));pointer-events:none}
.poker-hero>.status-pill{justify-self:start}
.poker-hero>h3{font-size:23px;line-height:1.2;padding-right:108px;letter-spacing:-.01em}
.poker-hero .kv{background:rgba(10,14,22,.35);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:10px 12px}
.poker-hero .kv b{font-size:17px}
.poker-hero .btn.red{min-height:50px;font-size:16px;box-shadow:0 8px 20px rgba(46,107,207,.35)}
.poker-hero p,.poker-hero .note{color:#c3cad8}

/* business: visual cards */
.bz-rail.home{margin:0 -16px;padding:4px 16px 6px;scroll-padding:0 16px;gap:12px}
.bz-vcard{position:relative;flex:0 0 168px;scroll-snap-align:start;display:flex;flex-direction:column;align-items:stretch;text-align:left;min-height:226px;padding:0;overflow:hidden;
  background:linear-gradient(180deg,var(--panel2),#232836);border:1px solid var(--line);border-radius:16px;color:var(--text);
  box-shadow:0 6px 18px rgba(0,0,0,.22);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.bz-vcard:active{transform:scale(.98)}
@media (hover:hover){.bz-vcard:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--cc,var(--biz)) 60%,var(--line));box-shadow:0 12px 26px rgba(0,0,0,.35)}}
.bz-cover{position:relative;display:block;height:70px;flex:none;overflow:hidden;
  background:radial-gradient(120% 160% at 100% 0%,color-mix(in srgb,var(--cc) 62%,transparent),transparent 62%),linear-gradient(150deg,color-mix(in srgb,var(--cc) 34%,#1b2030),#1b2030 85%)}
.bz-cover::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 2px,transparent 2px 9px)}
.bz-cover-ic{position:absolute;right:10px;top:9px;font-size:46px;color:color-mix(in srgb,var(--cc) 45%,#fff);opacity:.5;stroke-width:1.5}
.bz-vcard .bz-logo,.bz-detail .bz-logo,.bz-spot-main .bz-logo{background:linear-gradient(145deg,color-mix(in srgb,var(--cc,#3a4152) 55%,#1d2230),#151922);color:#fff;border:2px solid rgba(255,255,255,.14);font-weight:700;letter-spacing:.03em}
.bz-vlogo{position:relative;z-index:1;margin:-30px 0 0 12px;width:58px;height:58px;font-size:20px;border-radius:14px;box-shadow:0 6px 14px rgba(0,0,0,.4);border-color:var(--panel2)!important}
.bz-vbody{display:grid;gap:5px;padding:8px 12px 12px;min-width:0;align-content:start}
.bz-vname{font-size:15.5px;line-height:1.25;font-weight:700;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.bz-vcat{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:color-mix(in srgb,var(--cc) 50%,#fff);min-width:0}
.bz-vcat span,.bz-varea span,.bz-vcard .bz-by span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.bz-vcat .ic{font-size:15px}
.bz-varea,.bz-vcard .bz-by{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#b9c0cd;min-width:0}
.bz-vcard .bz-by{margin-top:auto}
.bz-vbody{flex:1}
.bz-vcard .bz-new{top:8px;right:auto;left:8px;z-index:2}
.bz-ribbon{position:absolute;top:8px;left:8px;z-index:2;display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#1d1710;background:linear-gradient(180deg,#f0d9a6,#d9b26f);border-radius:99px;padding:3px 8px 3px 6px;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.bz-ribbon .ic{font-size:12px}
.bz-vcard.spot{border-color:var(--biz);box-shadow:0 8px 22px rgba(0,0,0,.3),0 0 0 1px rgba(217,178,111,.25)}
.bz-vcard.add{align-items:center;justify-content:center;text-align:center;gap:8px;padding:16px 14px;border-style:dashed;border-color:var(--biz-line);background:var(--biz-soft);box-shadow:none}
.bz-vcard.add b{font-size:15px;line-height:1.25;color:var(--biz-hi)}
.bz-vcard.add small{color:#c3c9d6;font-size:12.5px;line-height:1.35}
.bz-add-ic{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:24px;color:#1d1710;background:linear-gradient(145deg,#f0d9a6,#c99a4e)}
.bz-vcard.sk,.op-card.sk{pointer-events:none;border-color:transparent;box-shadow:none;background:linear-gradient(100deg,var(--panel) 30%,var(--panel2) 50%,var(--panel) 70%) 0 0/300% 100%;animation:skel 1.4s ease-in-out infinite}
.op-card.sk{min-height:96px}
@keyframes skel{from{background-position:100% 0}to{background-position:0 0}}
.bz-empty.sm{padding:14px 16px;grid-template-columns:auto 1fr;align-items:center;justify-items:stretch;text-align:left;gap:12px 14px}
.bz-empty.sm .bz-empty-art{width:48px;height:48px}
.bz-empty.sm .bz-empty-art .ic{font-size:22px}
.bz-empty.sm>.btn{grid-column:1/-1}
.bz-empty.sm p b{color:var(--text)}
.bz-nomatch.bz-empty{justify-items:center}
.bz-empty-art .ic{font-size:28px}
.btn-ic{display:inline-flex!important;align-items:center;justify-content:center;gap:10px}
.btn-ic .ic{font-size:20px}
.bz-eyeic{display:inline-flex;align-items:center;gap:6px}
.bz-head-t{display:flex;align-items:center;gap:12px}
.bz-head-t>div{display:grid;gap:2px}
/* directory: the same cards in a grid */
.bz-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.bz-grid .bz-vcard,.bz-rail .bz-vcard{min-width:0}
.bz-grid .bz-nomatch{grid-column:1/-1}
.bz-recent .bz-rail{margin:0 -14px;padding:4px 14px 6px}
/* spotlight and detail covers */
.bz-spot-main .bz-logo{border-color:rgba(240,217,166,.35)}
.bz-detail{position:relative;overflow:hidden;padding-top:0}
.bz-dcover{position:relative;margin:0 -14px;height:96px;
  background:radial-gradient(120% 160% at 100% 0%,color-mix(in srgb,var(--cc) 62%,transparent),transparent 62%),linear-gradient(150deg,color-mix(in srgb,var(--cc) 34%,#1b2030),#1b2030 85%)}
.bz-dcover::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 2px,transparent 2px 9px)}
.bz-dcover .bz-cover-ic{font-size:72px;right:16px;top:12px}
.bz-detail .bz-hero{align-items:flex-start;margin-top:-52px;position:relative;z-index:1}
.bz-detail .bz-hero .bz-logo{width:88px;height:88px;font-size:30px;border-radius:20px;border:3px solid var(--panel);box-shadow:0 8px 20px rgba(0,0,0,.45)}
.bz-detail .bz-hero>div:not(.bz-logo){padding-top:58px;min-width:0}
.bz-detail.spot .bz-dcover{height:96px}
.bz-detail>.bz-eyeic{position:absolute;top:12px;left:14px;z-index:2;background:rgba(22,26,35,.75);padding:4px 10px;border-radius:99px}
.bz-tag.cat{display:inline-flex;align-items:center;gap:5px}
.bz-tag.cat .ic{font-size:14px}
.bz-act .bz-ic{display:inline-flex;font-size:18px}
.bz-act .bz-ic .ic{font-size:18px}

/* opportunities: visual listing cards */
.op-card{display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;padding:14px;min-height:88px;border-radius:16px;color:var(--text);border:1px solid var(--need-line);
  background:linear-gradient(135deg,rgba(127,178,255,.13),transparent 55%),var(--panel);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.op-card.offer{border-color:var(--offer-line);background:linear-gradient(135deg,rgba(79,209,161,.13),transparent 55%),var(--panel)}
.op-card:active{transform:scale(.985)}
@media (hover:hover){.op-card:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(0,0,0,.3)}.op-card.need:hover{border-color:var(--need)}.op-card.offer:hover{border-color:var(--offer)}}
.op-card-ic{flex:none;width:44px;height:44px;border-radius:13px;display:grid;place-items:center;font-size:23px;color:#0f1a2e;background:linear-gradient(145deg,#b5d1ff,#5d97f0);box-shadow:0 4px 12px rgba(0,0,0,.3)}
.offer>.op-card-ic,.op-dhead .op-card-ic.offer,.op-detail.offer .op-card-ic{color:#0c2a1e;background:linear-gradient(145deg,#a5efd2,#3fae7a)}
.op-card-ic.big{width:52px;height:52px;font-size:27px;border-radius:15px}
.op-card-body{display:grid;gap:7px;flex:1;min-width:0}
.op-card-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.op-ago{margin-left:auto;color:var(--muted);font-size:12px;white-space:nowrap}
.op-title{font-size:16px;line-height:1.3;font-weight:700;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.op-meta{display:flex;flex-wrap:wrap;gap:4px 12px;color:#c3c9d6;font-size:13px}
.op-cat,.op-by-line{display:inline-flex;align-items:center;gap:5px;min-width:0}
.op-cat .ic{font-size:14px;color:var(--muted)}
.op-by-line{color:var(--muted);font-size:12.5px}
.op-by-line span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.op-type{display:inline-flex;align-items:center;gap:5px}
.op-type .ic{font-size:13px}
.op-state.open{background:rgba(79,209,161,.12);color:#9be8c4;border-color:rgba(79,209,161,.4)}
.op-big-ic .ic{font-size:20px}
.op-big-ic{width:40px;height:40px}
.op-big{min-height:72px;box-shadow:0 6px 16px rgba(0,0,0,.2);transition:transform .15s ease,filter .15s}
.op-big:active{transform:scale(.98)}
.op-big.need{background:linear-gradient(150deg,rgba(127,178,255,.24),rgba(127,178,255,.04) 75%),var(--panel)}
.op-big.offer{background:linear-gradient(150deg,rgba(79,209,161,.24),rgba(79,209,161,.04) 75%),var(--panel)}
.op-big small{color:#c3c9d6}
.op-homelist{display:grid;gap:10px;border-top:0;padding-top:0}
.op-none{margin:0}
.op-waiting{border-color:var(--biz-line);background:linear-gradient(160deg,rgba(217,178,111,.12),transparent 70%),var(--panel)}
.op-dhead{display:flex;align-items:center;gap:12px}
.op-dhead .op-card-top{flex:1}
.op-detail{border-color:var(--need-line);background:linear-gradient(160deg,rgba(127,178,255,.12),transparent 45%),var(--panel)}
.op-detail.offer{border-color:var(--offer-line);background:linear-gradient(160deg,rgba(79,209,161,.12),transparent 45%),var(--panel)}
.op-grid{gap:12px}

@media (prefers-reduced-motion:reduce){
  .bz-vcard,.op-card,.op-big,.home-nav button{transition:none}
  .bz-vcard.sk,.op-card.sk,.hsec-t small.live::before{animation:none}
}
@media (max-width:370px){
  .home-nav button{font-size:13px;gap:4px;padding:6px 4px}
  .home-nav .hn-poker .ic,.home-nav .hn-biz .ic,.home-nav .hn-opp .ic{display:none}
  .poker-hero .hero-art{width:88px}
  .poker-hero>h3{padding-right:84px}
  .bz-grid{grid-template-columns:1fr}
}

/* wide screens: Home and the Business tab use the room */
@media (min-width:900px){
  .app.wide .home-nav{top:-20px;margin:-20px -28px 0;padding:12px 28px}
  .app.wide .home-nav button{flex:0 0 200px}
  .app.wide .bz-rail.home{margin:0 -28px;padding:4px 28px 12px;scroll-padding:0 28px}
  .app.wide .bz-vcard{flex-basis:200px}
  .app.wide .op-homelist{grid-template-columns:repeat(2,minmax(0,1fr))}
  .app.wide .op-entry,.app.wide .hsec>.card-box,.app.wide .op-waiting{max-width:820px}
  .app.wide .poker-hero{padding:24px 28px}
  .app.wide .poker-hero .hero-art{width:150px;right:24px;top:16px}
  .app.wide .poker-hero>h3{font-size:28px}
  .app.wide .poker-hero .kv{max-width:640px}
  .app.wide .scroll>.card-box:not(.poker-hero){max-width:820px}
  .app.wide .bz-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .app.wide .bz-detail{max-width:760px}
  .app.wide .hsec-head{margin-top:18px}
}
@media (min-width:600px) and (max-width:899px){ .app.wide .bz-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
.demo-tag{display:inline-flex;align-items:center;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:2px 7px;border-radius:6px;color:#f6d79b;background:rgba(242,169,59,.14);border:1px dashed rgba(242,169,59,.6)}
.bz-demo{position:absolute;top:42px;right:8px;z-index:2;background:rgba(22,26,35,.82)}
.bz-chip,.op-select{min-height:44px}
.me-chip .back{white-space:nowrap}

/* ---------- the table on short phones: a slimmer header and action bar leave the felt more room ---------- */
/* (was @media (max-height:700px): now a class app.js sets on #game when a hand starts, so these sizes hold for the hand) */
  :where(#game.h700) .clock{padding:5px 12px 4px}
  :where(#game.h700) .lvl{padding:2px 8px}
  :where(#game.h700) .lvl b{font-size:18px}
  :where(#game.h700) .time b{font-size:22px}
  :where(#game.h700) .blinds b{font-size:15px}
  :where(#game.h700) .stats{padding:3px 12px}
  :where(#game.h700) .stats .menu-btn{padding:4px 9px}
  :where(#game.h700) .act-btn{min-height:50px}
  :where(#game.h700) .act-btn b{font-size:17px}
  :where(#game.h700) .act-btn span{font-size:14px}
  :where(#game.h700) .sizing{padding:7px 8px;gap:7px}
  :where(#game.h700) .sizing .amt b{font-size:20px}
  :where(#game.h700) .sz-presets button{padding:6px 0}
  :where(#game.h700) .sz-slider .step{width:36px;height:36px;font-size:20px}
  :where(#game.h700) .stats b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  :where(#game.h700) .controls{min-height:96px;padding-top:4px}
  :where(#game.h700) .helper{padding:6px 10px;gap:4px;font-size:12.5px}
  /* the raise amount still shows on the Raise button */
  :where(#game.h700) .sizing .amt{display:none}
/* iPhone SE (1st gen) class */
/* (was @media (max-height:600px): now a class app.js sets on #game when a hand starts, so these sizes hold for the hand) */
  /* the hand helper in one row: its advice (or the hand's name) beside the chance to win */
  :where(#game.h600) .helper{grid-template-columns:minmax(0,1fr) auto;align-items:baseline;column-gap:8px}
  :where(#game.h600) .helper .h-top{display:contents}
  :where(#game.h600) .helper .h-bar,:where(#game.h600) .helper .h-eq small,:where(#game.h600) .helper:has(.h-line) .h-name{display:none}
  :where(#game.h600) .helper .h-name{font-size:13px}
  :where(#game.h600) .helper .h-eq{grid-column:2;grid-row:1;font-size:15px}
  :where(#game.h600) .helper .h-line{grid-column:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  :where(#game.h600) .helper .h-line+.h-line{display:none}
  :where(#game.h600) .act-btn{min-height:46px}
  :where(#game.h600) .xtime{padding:4px 10px}
  :where(#game.h600) .turnrow{min-height:26px}
@media (max-width:360px){
  .sz-presets{grid-template-columns:repeat(auto-fit,minmax(46px,1fr));gap:5px}
  .sz-presets button{font-size:13px}
  .act-btn.raise span:not(.num){font-size:11px;white-space:nowrap}
  .blinds b{font-size:14px}
}

/* small phones: your name wraps onto two short lines instead of turning into "Test…" */
@media (max-width:380px){
  .topbar{padding-left:12px;padding-right:12px;gap:8px}
  .me-chip{gap:6px}
  .me-chip .me-btn{gap:6px}
  .me-chip .me-btn span{white-space:normal;line-height:1.15;max-width:84px;font-size:12.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere;text-align:left}
  .me-chip .back{padding-left:10px;padding-right:10px}
}

/* ==========================================================================================================
   Premium internal look (r2-premium-ui): the Welcome screen's midnight navy, champagne gold and glass, carried
   through every signed-in screen. Presentation only. The sign-in screen (#auth) keeps its own rules above.
   ========================================================================================================== */
:root{
  /* palette */
  --lx-ink:#070b14; --lx-ink2:#0b1222; --lx-navy:#111a2e; --lx-navy2:#17223b; --lx-navy3:#1e2a47;
  --lx-gold:#d8b46a; --lx-gold-hi:#f1dfb0; --lx-gold-deep:#9c7a3c; --lx-ivory:#f4eee2; --lx-mute:#a3abbb; --lx-mute2:#7d879b;
  --lx-hair:rgba(241,223,176,.13); --lx-hair2:rgba(241,223,176,.26); --lx-glass:linear-gradient(160deg,rgba(255,255,255,.065),rgba(255,255,255,.018));
  --lx-stone:#b9b1a3; --lx-stone-deep:#8a8377; --lx-emerald:#3fae7a; --lx-garnet:#b3343c;
  --lx-gold-grad:linear-gradient(180deg,#f3e2b6 0%,#ddb96f 52%,#c09a52 100%);
  /* type */
  --lx-serif:"Cormorant Garamond","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --lx-t-xs:11px; --lx-t-sm:13px; --lx-t-md:15px; --lx-t-lg:17px; --lx-t-xl:22px; --lx-t-2xl:27px;
  /* shape and rhythm */
  --lx-r-sm:10px; --lx-r-md:14px; --lx-r-lg:18px; --lx-r-pill:999px;
  --lx-s1:4px; --lx-s2:8px; --lx-s3:12px; --lx-s4:16px; --lx-s5:20px; --lx-s6:28px;
  --lx-tap:44px; --lx-nav-h:60px;
  --lx-shadow:0 10px 30px rgba(0,0,0,.28);
}
/* the older slate tokens, re-pointed inside the signed-in app (not on the sign-in screen) */
#lobby,#game,#modalRoot,.toast,.offline{
  --ink:var(--lx-ink); --panel:var(--lx-navy); --panel2:var(--lx-navy2); --line:var(--lx-hair);
  --blue:var(--lx-gold); --blue-deep:var(--lx-gold-deep); --gold:var(--lx-gold); --text:var(--lx-ivory); --muted:var(--lx-mute);
  --rail:#0a0f1b; --trim:#3a4a64;
}
body{background:var(--lx-ink)}

/* ---------- lobby frame: top bar, bottom tab bar ---------- */
#lobby{background:radial-gradient(120% 50% at 50% -6%,#1b2a4a 0%,#0d1527 44%,var(--lx-ink) 100%)}
#lobby::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 26% at 50% 0%,rgba(216,180,106,.11),transparent 70%)}
#lobby .topbar{position:relative;z-index:2;gap:var(--lx-s2);padding:var(--lx-s2) var(--lx-s4);min-height:60px;background:rgba(7,11,20,.55);border-bottom:1px solid var(--lx-hair)}
#lobby .mini-logo{font-family:var(--body);font-weight:500;font-size:14px;letter-spacing:.2em;gap:8px;color:var(--lx-gold-hi);white-space:nowrap}
#lobby .mini-logo span{color:inherit}
#lobby .mini-logo .lx-mark{width:22px;height:22px;flex:none;color:var(--lx-gold)}
#lobby .mini-logo .lx-word{background:linear-gradient(180deg,#fbf3dc 0%,var(--lx-gold-hi) 38%,var(--lx-gold) 70%,var(--lx-gold-deep) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
#lobby .me-chip{gap:6px}
#lobby .me-btn{min-height:var(--lx-tap);padding:0 6px 0 2px;border-radius:var(--lx-r-pill);color:var(--lx-ivory);font-size:14px;font-weight:500}
#lobby .me-chip .back,#outBtn{min-height:var(--lx-tap);padding:0 12px;white-space:nowrap;border-radius:var(--lx-r-pill);background:transparent;border:1px solid var(--lx-hair2);color:var(--lx-mute);font-size:13px;font-weight:500}
/* the five sections sit in a tab bar at the bottom, in thumb reach; the same buttons, ids and order as before */
#lobby .tabs{order:3;position:relative;z-index:9;flex:none;display:flex;gap:0;padding:4px 6px calc(4px + env(safe-area-inset-bottom));min-height:var(--lx-nav-h);
  background:rgba(7,11,20,.94);border-top:1px solid var(--lx-hair);border-bottom:0;box-shadow:0 -10px 30px rgba(0,0,0,.35)}
#lobby .tabs button{flex:1 1 0;min-width:0;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:4px 2px;border:0;border-radius:var(--lx-r-md);
  font-family:var(--cond);font-weight:500;font-size:var(--lx-t-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--lx-mute2);background:transparent;white-space:nowrap;transition:color .2s}
#lobby .tabs button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
#lobby .tabs button[aria-selected="true"]{color:var(--lx-gold-hi)}
#lobby .tabs button[aria-selected="true"] svg{color:var(--lx-gold);filter:drop-shadow(0 0 8px rgba(216,180,106,.45))}
#lobby .tabs button[aria-selected="true"]::before{content:"";position:absolute;top:-1px;width:28px;height:2px;border-radius:2px;background:var(--lx-gold)}
#lobby .tabs button{position:relative}
#lobby .tabs .biz-tab,#lobby .tabs .biz-tab[aria-selected="true"]{color:inherit}
#lobby .tabs .biz-tab:not([aria-selected="true"]){color:var(--lx-mute2)}
#lobby .tabs .biz-tab[aria-selected="true"]{color:var(--lx-gold-hi)}
#lobby .op-tabdot{position:absolute;top:2px;left:calc(50% + 6px);margin:0}
#lobby .scroll{order:2;padding:var(--lx-s4) var(--lx-s4) var(--lx-s6);gap:var(--lx-s3)}

/* ---------- cards and type ---------- */
#lobby .card-box,#lobby .bz-home,#lobby .op-home{background:var(--lx-glass),var(--lx-navy);border:1px solid var(--lx-hair);border-radius:var(--lx-r-lg);padding:var(--lx-s4);gap:var(--lx-s3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),var(--lx-shadow)}
#lobby .card-box h3{font-family:var(--lx-serif);font-weight:600;font-size:var(--lx-t-2xl);line-height:1.08;letter-spacing:.005em;color:var(--lx-ivory)}
#lobby .card-box p{color:var(--lx-mute);font-size:14.5px;line-height:1.5}
#lobby .eyebrow,#modalRoot .eyebrow{font-family:var(--cond);font-weight:600;font-size:var(--lx-t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--lx-gold)}
#lobby .note{border-left:1px solid var(--lx-gold);color:var(--lx-mute);padding-left:12px}
#lobby .empty{color:var(--lx-mute);font-family:var(--lx-serif);font-style:italic;font-size:19px;line-height:1.35}
#lobby .warn{background:rgba(179,52,60,.12);border-color:rgba(179,52,60,.5);border-radius:var(--lx-r-md)}
#lobby .card-box.warn{background:rgba(216,180,106,.07);border-color:rgba(216,180,106,.4)}
#lobby .next-box{background:linear-gradient(160deg,rgba(216,180,106,.13),rgba(216,180,106,.02) 60%),var(--lx-navy);border-color:rgba(216,180,106,.38)}
#lobby .demo-box{background:linear-gradient(160deg,rgba(63,174,122,.12),rgba(63,174,122,.02) 60%),var(--lx-navy);border-color:rgba(63,174,122,.32)}
#lobby .dealer-bar{background:rgba(216,180,106,.1);color:var(--lx-gold-hi)}
#lobby .status-pill,#modalRoot .status-pill{font-family:var(--cond);font-size:var(--lx-t-xs);font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:4px 10px 3px;border-radius:var(--lx-r-pill);
  background:transparent;border:1px solid rgba(63,174,122,.5);color:#8fe6c4}
#lobby .status-pill.live{background:rgba(179,52,60,.16);border-color:rgba(229,72,77,.6);color:#ffb3b6}
#lobby .status-pill.idle{border-color:var(--lx-hair2);color:var(--lx-mute)}
#lobby .status-pill.reg{border-color:rgba(63,174,122,.5);color:#8fe6c4;background:transparent}
#lobby .kv{gap:var(--lx-s2)}
#lobby .kv small{font-family:var(--cond);font-size:var(--lx-t-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-mute2)}
#lobby .kv b{font-size:16px;color:var(--lx-ivory)}

/* ---------- buttons and fields ---------- */
#lobby .btn,#modalRoot .btn,#game .btn{min-height:var(--lx-tap);border-radius:var(--lx-r-md);background:rgba(255,255,255,.035);border:1px solid var(--lx-hair2);color:var(--lx-ivory);font-weight:600;letter-spacing:.01em}
#lobby .btn:active,#modalRoot .btn:active{background:rgba(216,180,106,.1)}
#lobby .btn.red,#modalRoot .btn.red,#modalRoot .btn-red,#lobby .btn-red,#lobby .btn.bz-gold,#modalRoot .btn.bz-gold{border:0;border-radius:var(--lx-r-pill);color:#1a1408;background:var(--lx-gold-grad);
  box-shadow:0 8px 22px rgba(216,180,106,.2),inset 0 1px 0 rgba(255,255,255,.55)}
#lobby .btn.red:active,#modalRoot .btn-red:active,#lobby .btn.bz-gold:active{filter:brightness(.94);background:var(--lx-gold-grad)}
#lobby .btn.green,#game .btn.green{border:0;color:#eafff5;background:linear-gradient(180deg,#3fae7a,#2a8a5e)}
#lobby .btn.danger{color:#ffb3b6;border-color:rgba(229,72,77,.45)}
#lobby .btn.big{min-height:52px}
#lobby .back,#lobby .bz-back,#lobby .back-link{min-height:var(--lx-tap);padding:0 14px;border-radius:var(--lx-r-pill);background:transparent;border:1px solid var(--lx-hair2);color:var(--lx-gold-hi);font-weight:500}
#lobby .linkbtn{color:var(--lx-gold-hi)}
#lobby .seg2{gap:6px;padding:4px;border-radius:var(--lx-r-pill);background:rgba(7,11,20,.5);border:1px solid var(--lx-hair)}
#lobby .seg2 button{min-height:var(--lx-tap);border-radius:var(--lx-r-pill);border:0;background:transparent;color:var(--lx-mute);font-size:14px;font-weight:500;padding:6px 8px}
#lobby .seg2 button[aria-pressed="true"]{background:rgba(216,180,106,.14);color:var(--lx-gold-hi);box-shadow:inset 0 0 0 1px rgba(216,180,106,.45)}
#lobby .seg2.small button{font-size:13px;padding:6px 4px;min-width:0}
#lobby .form label{font-family:var(--cond);font-size:var(--lx-t-xs);letter-spacing:.16em;text-transform:uppercase;color:var(--lx-gold)}
#lobby input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),#lobby select,#lobby textarea,#modalRoot input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),#modalRoot select,#modalRoot textarea{
  min-height:var(--lx-tap);background-color:rgba(5,8,15,.6);border:1px solid var(--lx-hair2);border-radius:12px;color:var(--lx-ivory)}
#lobby input:focus,#lobby select:focus,#lobby textarea:focus,#modalRoot input:focus,#modalRoot select:focus,#modalRoot textarea:focus{outline:none;border-color:var(--lx-gold);box-shadow:0 0 0 3px rgba(216,180,106,.18)}
#lobby details>summary,#modalRoot details>summary{min-height:var(--lx-tap)}
#lobby .row-btns,#lobby .btn-row{gap:var(--lx-s2)}
#lobby .owner-row{gap:var(--lx-s2)}
#lobby .copy-row input{min-width:0}

/* ---------- Home ---------- */
#lobby .home-nav{background:rgba(9,14,26,.9);border-bottom:1px solid var(--lx-hair)}
#lobby .home-nav button{background:transparent;border:1px solid var(--lx-hair);color:var(--lx-mute);font-weight:500}
#lobby .home-nav .hn-poker[aria-current="true"],#lobby .home-nav .hn-biz[aria-current="true"],#lobby .home-nav .hn-opp[aria-current="true"]{background:rgba(216,180,106,.12);border-color:rgba(216,180,106,.5);color:var(--lx-gold-hi)}
#lobby .home-nav .hn-poker .ic,#lobby .home-nav .hn-biz .ic,#lobby .home-nav .hn-opp .ic{color:var(--lx-gold)}
#lobby .hsec-head{scroll-margin-top:70px}
#lobby .hsec-ic{width:42px;height:42px;border-radius:13px;background:rgba(216,180,106,.08);border:1px solid rgba(216,180,106,.35)}
#lobby .hsec-ic.poker,#lobby .hsec-ic.biz,#lobby .hsec-ic.opp{color:var(--lx-gold);background:rgba(216,180,106,.08);border-color:rgba(216,180,106,.35)}
#lobby .hsec-t h2{font-family:var(--lx-serif);font-weight:600;font-size:26px;letter-spacing:.005em;color:var(--lx-ivory)}
#lobby .hsec-t small{color:var(--lx-mute2)}
#lobby .hsec-t small.live{color:#ffb3b6}
#lobby .hsec-link,#lobby .hsec-biz .hsec-link,#lobby .hsec-opp .hsec-link,#lobby .bz-head .hsec-link{color:var(--lx-gold-hi);font-weight:500}
#lobby .card-box.poker-hero{background:radial-gradient(90% 80% at 100% 0%,rgba(216,180,106,.16),transparent 60%),linear-gradient(165deg,#1b2a4a,#0e1730 70%);border-color:rgba(216,180,106,.32)}
#lobby .poker-hero>h3{font-size:30px}
#lobby .poker-hero .kv{background:rgba(7,11,20,.45);border:1px solid var(--lx-hair);border-radius:var(--lx-r-md)}
#lobby .poker-hero p,#lobby .poker-hero .note{color:#c9cfdb}
#lobby .pchip{min-height:36px;background:rgba(255,255,255,.04);border-color:var(--lx-hair)}
#lobby .pchip.me{border-color:rgba(216,180,106,.6)}
#lobby .pchip button{min-width:var(--lx-tap);min-height:var(--lx-tap);margin:-4px -10px -4px -4px;display:inline-grid;place-items:center}
#lobby .pic-nudge{border-color:var(--lx-hair)}

/* ---------- Leaderboard and results tables ---------- */
#lobby .tbl{border-collapse:separate;border-spacing:0;width:100%}
#lobby .card-box{grid-template-columns:minmax(0,1fr)}
#lobby .tbl th{font-family:var(--cond);font-size:var(--lx-t-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--lx-mute2);font-weight:500;padding:6px 4px;border-bottom:1px solid var(--lx-hair2)}
#lobby .tbl td{border-top:1px solid var(--lx-hair);padding:4px;color:var(--lx-ivory);font-size:14px;height:48px;vertical-align:middle}
#lobby .tbl tbody tr:first-child td{border-top:0}
#lobby .tbl td:first-child{font-family:var(--lx-serif);font-weight:600;font-size:19px;color:var(--lx-mute);width:30px}
#lobby .tbl tbody tr:nth-child(-n+3) td:first-child{color:var(--lx-gold)}
#lobby .tbl tr.me td{color:var(--lx-gold-hi);background:rgba(216,180,106,.07)}
#lobby .tbl td:last-child{font-weight:600}
#lobby .lb-name{min-height:var(--lx-tap);display:inline-flex;align-items:center;gap:8px}
#lobby .trow{min-height:52px;background:rgba(255,255,255,.03);border:1px solid var(--lx-hair);border-radius:var(--lx-r-md)}
#lobby .trow b{color:var(--lx-ivory);font-weight:600}
#lobby .trow small{color:var(--lx-mute2)}
#lobby .bigpts{font-family:var(--lx-serif);color:var(--lx-gold)}

/* ---------- Learn ---------- */
#lobby .statgrid div{background:rgba(255,255,255,.035);border:1px solid var(--lx-hair);border-radius:var(--lx-r-md)}
#lobby .statgrid b{font-family:var(--lx-serif);font-weight:600;font-size:28px;color:var(--lx-gold)}
#lobby .statgrid small{font-size:var(--lx-t-xs)}
#lobby .hrow{min-height:56px;background:var(--lx-glass),var(--lx-navy);border-color:var(--lx-hair);border-radius:var(--lx-r-md)}
#lobby details.lesson{border-radius:var(--lx-r-lg)}
#lobby details.lesson summary{min-height:56px}
#lobby details.lesson[open] summary{border-bottom-color:var(--lx-hair)}
#lobby .ln{border-color:rgba(216,180,106,.45);color:var(--lx-gold);background:rgba(216,180,106,.08)}
#lobby .lbody h4{font-family:var(--lx-serif);font-size:20px;font-weight:600;color:var(--lx-gold-hi);letter-spacing:.005em}
#lobby .lbody p,#lobby .lbody li{color:#cfd4de}
#lobby .tipbox{background:rgba(216,180,106,.07);border-left-color:var(--lx-gold)}
#lobby .ltable th{color:var(--lx-mute2)}
#lobby .ltable td{border-color:var(--lx-hair)}
#lobby .acts li.me{background:rgba(216,180,106,.08)}
#lobby .fh{background:rgba(255,255,255,.03);border-color:var(--lx-hair)}
#lobby .fh summary{min-height:var(--lx-tap);display:flex;align-items:center}

/* ---------- Director ---------- */
#lobby .tname{font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-gold);font-size:var(--lx-t-xs)}
#lobby .news summary{min-height:var(--lx-tap)}
#lobby .news h4{color:var(--lx-gold);font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;font-size:12px}
#lobby .trow .back{flex:none}
#lobby .trow{flex-wrap:wrap}
#lobby .trow b{min-width:0;overflow-wrap:anywhere}
/* invite rows (group, member and single links): name and buttons on the first line, the count or date below,
   so the name is never squeezed to one letter per line on a phone */
#lobby .trow:has(> [data-copy]) b{flex:1 1 0;min-width:min(6em,100%);overflow-wrap:normal}
#lobby .trow:has(> [data-copy]) small{order:3;flex:1 0 100%}

/* ---------- Business Club and Opportunity Club ---------- */
#lobby .bz-head,#lobby .op-detail,#lobby .bz-detail,#lobby .bz-mine{border-radius:var(--lx-r-lg)}
#lobby .bz-head h2,#lobby .bz-detail .bz-hero h2,#lobby .bz-mine .bz-hero h2,#lobby .op-detail h2,#lobby .bz-scan h2{font-family:var(--lx-serif);font-weight:600;letter-spacing:.005em;color:var(--lx-ivory)}
#lobby .bz-head h2{font-size:30px}
#lobby .bz-vcard,#lobby .op-card{background:var(--lx-glass),var(--lx-navy);border:1px solid var(--lx-hair);border-radius:var(--lx-r-lg);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),var(--lx-shadow)}
#lobby .bz-vcard.spot,#lobby .bz-spot{border-color:rgba(216,180,106,.55)}
#lobby .bz-vname,#lobby .op-title{font-family:var(--lx-serif);font-weight:600;font-size:21px;line-height:1.12;letter-spacing:.005em;color:var(--lx-ivory)}
#lobby .bz-spot-main b{font-family:var(--lx-serif);font-weight:600;font-size:25px}
#lobby .bz-search{min-height:48px;border-radius:var(--lx-r-pill)!important}
#lobby .bz-chip{min-height:var(--lx-tap);background:transparent;border:1px solid var(--lx-hair2);color:var(--lx-mute)}
#lobby .bz-chip[aria-pressed="true"]{background:rgba(216,180,106,.14);border-color:rgba(216,180,106,.6);color:var(--lx-gold-hi)}
#lobby .op-seg{background:rgba(7,11,20,.5);border:1px solid var(--lx-hair);border-radius:var(--lx-r-pill);padding:4px}
#lobby .op-seg button{min-height:var(--lx-tap);border-radius:var(--lx-r-pill);border:0;color:var(--lx-mute);font-weight:500}
#lobby .op-seg button[aria-selected="true"]{background:rgba(216,180,106,.14);color:var(--lx-gold-hi);box-shadow:inset 0 0 0 1px rgba(216,180,106,.5)}
#lobby .op-big{border-radius:var(--lx-r-lg);min-height:68px;box-shadow:var(--lx-shadow)}
#lobby .op-big.need{background:linear-gradient(160deg,rgba(216,180,106,.14),rgba(216,180,106,.03)),var(--lx-navy);border:1px solid rgba(216,180,106,.4)}
#lobby .op-big.offer{background:linear-gradient(160deg,rgba(63,174,122,.16),rgba(63,174,122,.03)),var(--lx-navy);border:1px solid rgba(63,174,122,.4)}
#lobby .op-big b{font-family:var(--lx-serif);font-weight:600;font-size:22px;letter-spacing:.005em}
#lobby .op-big.need .op-big-ic{background:rgba(216,180,106,.16);color:var(--lx-gold);border:1px solid rgba(216,180,106,.45)}
#lobby .op-big.offer .op-big-ic{background:rgba(63,174,122,.16);color:#8fe6c4;border:1px solid rgba(63,174,122,.45)}
#lobby .bz-form fieldset{border-color:var(--lx-hair);border-radius:var(--lx-r-lg)}
#lobby .bz-form legend{font-family:var(--lx-serif);font-weight:600;font-size:20px;color:var(--lx-gold-hi)}
#lobby .bz-field>span{color:var(--lx-mute)}
#lobby .bz-scan-note{border-color:rgba(216,180,106,.4);background:rgba(216,180,106,.06);border-radius:var(--lx-r-lg)}
#lobby .bz-act{min-height:52px;border-radius:var(--lx-r-md)}
#lobby .bz-row,#lobby .op-row,#lobby .op-hrow{min-height:52px}
#lobby .bz-link{min-height:var(--lx-tap)}
#lobby .bz-x{min-width:var(--lx-tap);min-height:var(--lx-tap)}
#lobby label.btn{min-height:var(--lx-tap)}

/* ---------- sheets and dialogs (profile, confirmations) ---------- */
#modalRoot .modal{background:rgba(4,7,13,.72)}
#modalRoot .glass{color:var(--lx-ivory);border-radius:22px;background:linear-gradient(165deg,rgba(28,38,62,.98),rgba(12,18,32,.98));border:1px solid rgba(241,223,176,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 60px rgba(0,0,0,.55)}
#modalRoot .glass h2{font-family:var(--lx-serif);font-weight:600;font-size:28px;letter-spacing:.005em;color:var(--lx-ivory)}
#modalRoot .glass p,#modalRoot .fine{color:var(--lx-mute)}
#modalRoot .btn-red{min-height:48px;border-radius:var(--lx-r-pill);font-weight:600}
#modalRoot .btn-ghost{min-height:48px;border-radius:var(--lx-r-pill);background:transparent;border:1px solid var(--lx-hair2);color:var(--lx-ivory);font-weight:500}
#modalRoot .seg button{min-height:var(--lx-tap)}
#modalRoot .seg button[aria-pressed="true"]{background:rgba(216,180,106,.16);color:var(--lx-gold-hi);box-shadow:inset 0 0 0 1px rgba(216,180,106,.5)}
#modalRoot .tbl tr.me td{color:var(--lx-gold-hi)}
#modalRoot .prof-head small b,#modalRoot .prof-list b.gold{color:var(--lx-gold)}
#modalRoot .prof .statgrid div{background:rgba(255,255,255,.035);border:1px solid var(--lx-hair)}
#modalRoot .prof .statgrid b{font-family:var(--lx-serif);color:var(--lx-gold)}
#modalRoot .tiers-d summary,#modalRoot details>summary{display:flex;align-items:center}
#modalRoot .av-grid button[aria-pressed=true]{border-color:var(--lx-gold)}
#modalRoot .linkbtn{color:var(--lx-gold-hi);min-height:var(--lx-tap)}
.toast{background:rgba(23,34,59,.97);color:var(--lx-ivory);border:1px solid var(--lx-hair2);bottom:calc(var(--lx-nav-h) + 22px + env(safe-area-inset-bottom))}

/* ---------- the table: navy and gold chrome around the same felt; no blur, nothing animated added ---------- */
#game{background:radial-gradient(110% 60% at 50% 42%,#14213d 0%,#0a1020 60%,var(--lx-ink) 100%)}
#game .clock{background:rgba(7,11,20,.7);border-bottom:1px solid var(--lx-hair)}
#game .lvl{background:transparent;border:1px solid rgba(216,180,106,.55);color:var(--lx-gold-hi);border-radius:12px}
#game .lvl small{font-size:var(--lx-t-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--lx-gold)}
#game .lvl b{font-family:var(--lx-serif);font-weight:600;color:var(--lx-ivory)}
#game:where(:not(.h700)) .lvl b{font-size:26px}
#game .blinds b{color:var(--lx-ivory)}
#game .time b{color:var(--lx-gold-hi);font-weight:500}
#game .time small,#game .stats small{color:var(--lx-mute2)}
#game .stats{background:rgba(7,11,20,.45);border-bottom:1px solid var(--lx-hair)}
#game .menu-btn{position:relative;min-height:32px;min-width:var(--lx-tap);border-radius:var(--lx-r-pill);background:transparent;border:1px solid var(--lx-hair2);color:var(--lx-ivory);font-family:var(--cond);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:13px;padding:0 14px}
#game .chat-btn{padding:0}
#game .felt{background:linear-gradient(#1e2a47,var(--rail) 45%,var(--rail) 70%,#111a2e);box-shadow:0 0 0 1px rgba(216,180,106,.22),0 18px 44px rgba(0,0,0,.7),0 4px 10px rgba(0,0,0,.5),inset 0 2px 1px rgba(255,255,255,.1),inset 0 -3px 6px rgba(0,0,0,.6)}
#game .felt::before{box-shadow:0 0 0 1.5px rgba(216,180,106,.5),inset 0 0 0 7px rgba(0,0,0,.08),inset 0 0 0 8px rgba(255,255,255,.07),inset 0 8px 24px rgba(0,0,0,.45),inset 0 0 60px rgba(0,0,0,.35)}
#game .felt::after{font-family:var(--body);font-weight:500;letter-spacing:.32em;color:rgba(241,223,176,.09)}
#game .plate{background:linear-gradient(#1b2643,#0f172b);border-color:rgba(216,180,106,.3)}
#game .nm{color:#e6e1d6}
#game .seat.acting .av{box-shadow:0 0 0 3px var(--lx-gold),0 0 16px rgba(216,180,106,.55)}
#game .seat.win .plate{border-color:var(--lx-gold)}
#game .shot i{background:var(--lx-gold)}
#game .badge.act-raise,#game .badge.act-bet,#game .badge.act-all-in{background:#c9953f;color:#1a1408}
#game .card.back{background:repeating-linear-gradient(45deg,#1e2a47 0 3px,#121b31 3px 6px);border-color:var(--lx-gold-hi);box-shadow:inset 0 0 0 2px rgba(216,180,106,.55)}
#game .banner{background:rgba(11,18,34,.95);border-color:var(--lx-hair2)}
#game .controls{background:linear-gradient(transparent,rgba(7,11,20,.9) 25%)}
#game .act-btn{border-radius:var(--lx-r-md)}
#game .act-btn b{font-family:var(--cond);font-weight:600;letter-spacing:.1em;text-transform:uppercase}
#game .act-btn.fold{background:rgba(255,255,255,.04);border:1px solid var(--lx-hair2);color:var(--lx-ivory);box-shadow:none}
#game .act-btn.call{background:linear-gradient(180deg,#3fae7a,#277a55);color:#f2fff8}
#game .act-btn.raise{background:var(--lx-gold-grad);color:#1a1408;box-shadow:0 8px 20px rgba(216,180,106,.22),inset 0 1px 0 rgba(255,255,255,.5)}
#game .act-btn.raise span{color:rgba(26,20,8,.75)}
#game .act-btn.raise.allin{background:linear-gradient(180deg,#c9434b,#8f2128);color:#fff2f2;box-shadow:0 8px 20px rgba(179,52,60,.3)}
#game .act-btn.raise.allin span{color:rgba(255,242,242,.85)}
#game .act-btn.back{background:transparent;border:1px solid var(--lx-hair2);color:var(--lx-ivory)}
#game .sizing,#game .helper{background:rgba(13,20,37,.96);border:1px solid var(--lx-hair);border-radius:var(--lx-r-lg)}
#game .sz-presets button{position:relative;border-radius:var(--lx-r-pill);background:transparent;border:1px solid var(--lx-hair2);color:var(--lx-ivory)}
#game .sz-presets button[aria-pressed=true]{background:rgba(216,180,106,.16);border-color:rgba(216,180,106,.6);color:var(--lx-gold-hi)}
#game .sz-slider .step{position:relative;border-radius:50%;border:1px solid var(--lx-hair2);background:transparent;color:var(--lx-ivory)}
#game .sz-slider input{background:linear-gradient(90deg,#9c7a3c,#f1dfb0)}
#game .sz-slider input::-webkit-slider-thumb{border-color:var(--lx-gold)}
#game .sz-slider input::-moz-range-thumb{border-color:var(--lx-gold)}
#game .sizing .amt b{color:var(--lx-ivory)}
#game .turnbar i{background:linear-gradient(90deg,#9c7a3c,#f1dfb0)}
#game .turnbar i.low{background:linear-gradient(90deg,#8f2128,#e5484d)}
#game .xtime{position:relative;border-radius:var(--lx-r-pill);background:transparent;border:1px solid rgba(216,180,106,.45);color:var(--lx-gold-hi)}
#game .xtime small{font-size:var(--lx-t-xs);color:var(--lx-mute)}
#game .preacts button{min-height:var(--lx-tap);border-radius:var(--lx-r-md);border-color:var(--lx-hair2)}
#game .preacts button[aria-pressed=true]{background:rgba(216,180,106,.14);border-color:rgba(216,180,106,.6)}
#game .preacts button[aria-pressed=true] i{background:var(--lx-gold);border-color:var(--lx-gold)}
#game .chat-sheet{background:rgba(11,18,34,.98);border-color:var(--lx-hair2)}
#game .chat-quick button{min-height:var(--lx-tap)}
#game .coachtip{background:rgba(13,20,37,.97);border-color:var(--lx-hair2);border-left-color:var(--lx-gold)}
#game .coachtip button{min-width:var(--lx-tap);min-height:var(--lx-tap)}
/* the coach's tips sit in the bar under the table, just above the action buttons (the helper's place), not over the seats and cards */
#game .dock>.coachtip{top:auto;bottom:calc(var(--ctl-h, 0px) + 4px);padding:7px 8px 7px 10px;font-size:12.5px;line-height:1.35}
#game .dock>.coachtip b{font-size:13px}
#game .dock>.coachtip button{min-height:32px}
#game .h-eq.mid{color:var(--lx-gold)}
/* the table keeps its room on short phones: these controls stay visually compact, and an invisible margin around each
   makes the touch area at least 44 px (tested by t_premium_ui with real hit-testing) */
#game .menu-btn::after,#game .xtime::after,#game .sz-presets button::after,#game .sz-slider .step::after{content:"";position:absolute;inset:-10px -2px}
#game .sz-slider .step::after{inset:-6px}

/* small phones */
@media (max-width:360px){
  #lobby .topbar{padding:var(--lx-s2) 12px}
  #lobby .mini-logo .lx-mark{width:26px;height:26px}
  #lobby .me-chip .back,#outBtn{padding:0 10px}
  #lobby .tabs button{font-size:11px;letter-spacing:0}
  #lobby .card-box h3{font-size:24px}
  #lobby .tbl td{font-size:13px;padding:4px 3px}
  #lobby .tbl th{padding:6px 3px;letter-spacing:.02em}
  #lobby .lb-name{gap:5px}
  #lobby .hsec-t h2{font-size:23px}
}
/* narrow phones: the gold crest alone, so your whole name fits beside it */
@media (max-width:400px){#lobby .mini-logo .lx-word{display:none}}
@media (prefers-reduced-motion:reduce){#lobby *,#modalRoot *{transition:none!important}}
#lobby .av.xs,#modalRoot .av.xs{font-size:11px}

/* ---------- Member Home: personal welcome and the club's four doors ---------- */
#lobby .lx-hello{display:grid;gap:var(--lx-s4);padding:var(--lx-s2) 0 var(--lx-s2)}
#lobby .lx-id{display:flex;align-items:center;gap:var(--lx-s4)}
#lobby .lx-id .av.big{width:64px;height:64px;font-size:22px;flex:none;box-shadow:0 0 0 1px rgba(216,180,106,.55),0 0 0 5px rgba(216,180,106,.08),0 10px 24px rgba(0,0,0,.4)}
#lobby .lx-id-t{min-width:0;display:grid;gap:2px}
#lobby .lx-greet{font-family:var(--lx-serif);font-style:italic;font-size:19px;color:var(--lx-mute);line-height:1.1}
#lobby .lx-id-t h2{margin:0;font-family:var(--lx-serif);font-weight:600;font-size:36px;line-height:1.02;color:var(--lx-ivory);letter-spacing:.005em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#lobby .lx-id-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:4px;font-size:13px;color:var(--lx-mute)}
#lobby .lx-role{font-family:var(--cond);font-size:var(--lx-t-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--lx-gold)}
#lobby .lx-pts b{color:var(--lx-gold-hi);font-weight:600}
#lobby .lx-doors{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#lobby .lx-door{position:relative;display:grid;align-content:space-between;gap:14px;min-height:128px;padding:14px;border-radius:var(--lx-r-lg);text-align:left;color:var(--lx-ivory);
  background:var(--lx-glass),var(--lx-navy);border:1px solid var(--lx-hair);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),var(--lx-shadow);overflow:hidden;transition:transform .18s ease,border-color .18s ease}
#lobby .lx-door::after{content:"";position:absolute;inset:auto -30% -60% auto;width:80%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(216,180,106,.14),transparent 70%);pointer-events:none}
#lobby button.lx-door:active{transform:scale(.985);border-color:rgba(216,180,106,.5)}
#lobby .lx-door.lx-poker{grid-column:1/-1;min-height:112px;grid-template-columns:auto 1fr auto;align-items:center;align-content:center;
  background:radial-gradient(90% 120% at 100% 0%,rgba(216,180,106,.2),transparent 60%),linear-gradient(165deg,#1b2a4a,#0e1730 75%);border-color:rgba(216,180,106,.4)}
#lobby .lx-door-ic{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;border:1px solid rgba(216,180,106,.4);background:rgba(216,180,106,.09);color:var(--lx-gold)}
#lobby .lx-door-ic svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
#lobby .lx-poker .lx-door-ic{width:52px;height:52px;border-radius:50%;background:var(--lx-gold-grad);color:#1a1408;border:0;box-shadow:0 6px 18px rgba(216,180,106,.3)}
#lobby .lx-door-t{display:grid;gap:3px;min-width:0}
#lobby .lx-door-t b{font-family:var(--lx-serif);font-weight:600;font-size:21px;line-height:1.08;letter-spacing:.005em}
#lobby .lx-poker .lx-door-t b{font-size:26px}
#lobby .lx-door-t small{font-size:12.5px;line-height:1.35;color:var(--lx-mute)}
#lobby .lx-poker .lx-door-t small{color:var(--lx-gold-hi);font-size:13.5px}
#lobby .lx-chev{width:20px;height:20px;fill:none;stroke:var(--lx-gold);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;display:none}
#lobby .lx-poker .lx-chev{display:block}
#lobby .lx-door.soon{opacity:.62}
#lobby .lx-door.soon em{position:absolute;top:12px;right:12px;font-style:normal;font-family:var(--cond);font-size:var(--lx-t-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-gold);border:1px solid rgba(216,180,106,.4);border-radius:var(--lx-r-pill);padding:2px 8px 1px}
@media (max-width:360px){
  #lobby .lx-id-t h2{font-size:30px}
  #lobby .lx-door{min-height:118px;padding:12px}
  #lobby .lx-door-t b{font-size:19px}
}
#game .turnrow{position:relative;z-index:3}
#modalRoot .glass{grid-template-columns:minmax(0,1fr)}

/* ---------- brand direction: The Lounge, ivory and stone accents, editorial type, calm (nothing pulses) ---------- */
#lobby,#modalRoot{--need:#e6d3a8;--need-soft:rgba(230,211,168,.1);--need-line:rgba(230,211,168,.4)}
#lobby .op-card-ic,#lobby .op-dhead .op-card-ic{background:rgba(230,211,168,.1);color:var(--lx-gold-hi);border:1px solid rgba(230,211,168,.35)}
#lobby .offer>.op-card-ic,#lobby .op-dhead .op-card-ic.offer,#lobby .op-detail.offer .op-card-ic{background:rgba(63,174,122,.12);color:#8fe6c4;border-color:rgba(63,174,122,.4)}
#lobby .hsec-t small.live::before{animation:none}
#lobby .lx-hello{gap:20px;padding-top:4px}
#lobby .lx-brandline{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--lx-hair)}
#lobby .lx-brandline .eyebrow{color:var(--lx-stone);letter-spacing:.18em}
#lobby .lx-lounge{font-family:var(--lx-serif);font-style:italic;font-size:17px;color:var(--lx-gold-hi);white-space:nowrap}
#lobby .lx-greet{color:var(--lx-stone)}
#lobby .lx-door-t small{color:var(--lx-stone)}
#lobby .lx-door.lx-poker,#lobby .lx-door.lx-scan{grid-column:1/-1;grid-template-columns:auto 1fr auto;align-items:center;align-content:center}
#lobby .lx-door.lx-scan{min-height:76px}
#lobby .lx-scan .lx-chev{display:block}
#lobby .lx-door{min-height:116px}
#lobby .lx-motto{margin:4px 0 0;text-align:center;font-size:13px;letter-spacing:.04em;color:var(--lx-stone)}
#lobby .lx-motto b{display:block;font-family:var(--lx-serif);font-style:italic;font-weight:500;font-size:24px;letter-spacing:.01em;color:var(--lx-ivory);margin-bottom:2px}
#lobby .lx-motto::before{content:"";display:block;width:56px;height:1px;margin:0 auto 14px;background:linear-gradient(90deg,transparent,var(--lx-gold),transparent)}
#lobby .lx-pagehead{display:grid;gap:2px;padding:4px 2px 6px}
#lobby .lx-pagehead .eyebrow{color:var(--lx-stone)}
#lobby .lx-pagehead h2{margin:0;font-family:var(--lx-serif);font-weight:600;font-size:34px;line-height:1.05;color:var(--lx-ivory);letter-spacing:.005em}
#lobby .lx-pagehead h2::after{content:"";display:block;width:44px;height:1px;margin-top:10px;background:var(--lx-gold)}
#lobby .note{border-left-color:var(--lx-stone-deep)}
#lobby .card-box p,#lobby .hsec-t small{color:#b3b6bd}
/* table seats: monogram avatars with a lit face and a gold hairline, refined plates, clear but calm status colours
   (sizes unchanged, so the seat layout solver is unaffected) */
#game .av{border-color:#0a0f1b;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.26),rgba(255,255,255,0) 58%),var(--c,#555);box-shadow:0 0 0 1px rgba(216,180,106,.55),0 4px 10px rgba(0,0,0,.55);letter-spacing:.02em}
#game .av.tiered{box-shadow:0 0 0 2px var(--ring),0 4px 10px rgba(0,0,0,.55)}
#game .plate{border-radius:10px;box-shadow:inset 0 1px 0 rgba(241,223,176,.14),0 4px 12px rgba(0,0,0,.5)}
#game .nm{letter-spacing:.01em}
#game .st{color:var(--lx-gold-hi)}
#game .seat.hero .plate{border-color:rgba(216,180,106,.6)}
/* your own cards sit just above your plate and never on it: the name, stack and badge stay fully readable */
#game .seat.hero .plate{margin-top:0}
#game .seat.hero>.hole{margin-bottom:2px}
#game .seat.folded .av,#game .seat.folded .plate{filter:grayscale(.7)}
#game .badge{background:#24304f;color:var(--lx-ivory);box-shadow:inset 0 0 0 1px rgba(241,223,176,.2)}
#game .badge.act-call,#game .badge.act-check{background:#2a7a56;color:#effff7;box-shadow:none}
#game .badge.act-all-in{background:#9e2a31;color:#fff2f2;box-shadow:none}
#game .badge.hand{background:#1b2643;color:var(--lx-gold-hi);box-shadow:inset 0 0 0 1px rgba(216,180,106,.4)}
#game .badge.won{background:var(--lx-gold-grad);color:#1a1408;box-shadow:none}
#game .pot{color:var(--lx-gold-hi)}
#lobby .tbl td:first-child,#lobby .statgrid b,#lobby .bigpts,#game .lvl b,#modalRoot .prof .statgrid b{font-variant-numeric:lining-nums tabular-nums}
/* "Opening soon" doors (members, clubs closed): the label sits in the flow, never over the icon or title (as Shape A) */
#lobby .lx-door.soon em{position:static;justify-self:start;align-self:center;white-space:nowrap}
/* 320 px fixes (Muse MINOR-1/2): the Opportunities chip row stays inside its column; dialog buttons wrap instead of overflowing */
.op-filters .bz-chips{margin:0;padding-left:0;padding-right:0;min-width:0;max-width:100%}
.modal .row{flex-wrap:wrap}
.modal .row>button{flex:1 1 auto;width:auto;min-width:0}
/* 320 px (ux-fonts follow-up 30853e1): the logo and Sign out give up a little width so "Player 07" never has to break mid-word.
   The premium rules above set these more specifically inside #lobby, so this is a fallback outside the lobby. */
@media (max-width:340px){
  .topbar .mini-logo{font-size:18px}
  .me-chip .back{padding-left:8px;padding-right:8px}
}

/* ---------- a steady table on phones (mobile-stability) ----------
   The felt is laid out for the room the table area has, so that room must not change during a hand. The header
   rows keep one line each, and the bottom dock (hand helper + action bar) keeps the height app.js reserves for it
   (reserveDock): its contents sit at its bottom, and a taller panel (choosing a raise amount) grows upward over
   the table instead of pushing it. The page height follows the visible screen (dvh) where the browser knows it. */
@supports (height:100dvh){ html,body{height:100dvh} }
#game .dock{flex:none;margin-top:auto;display:flex;flex-direction:column;justify-content:flex-end;position:relative;z-index:25;min-height:0}
#game .dock .controls{flex:none;min-height:var(--ctl-h,0)}
#game .dock .helper{flex:none;height:var(--hlp-h,auto);align-content:start;overflow:hidden}
#game:has(.sizing) .helper{visibility:hidden}
#game:not(.land):has(.sizing) #dock>.helper{display:none}
#game .stats small,#game .stats b,#game .blinds b,#game .blinds small,#game .time small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
#game .stats>div,#game .clock>div{min-width:0}
/* the helper shows one hint (your turn's advice, else a draw) in up to two full lines, on short screens too (the
   dock keeps room for both); short screens give a draw's chance to hit as "~N%" so the hint fits */
#game .helper .h-line{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
#game.h600 .helper .h-line,#game.row1 .helper .h-line{white-space:normal}
#game .helper .h-odds-s,#game.h700 .helper .h-odds{display:none}
#game.h700 .helper .h-odds-s{display:inline}
/* the chat sheet never gets too short for its message box (a short screen with the keyboard open) */
.chat-sheet{max-height:max(34vh,190px);max-height:max(34dvh,190px)}
.chat-log{max-height:13dvh}
.modal .glass{max-height:88dvh}
/* a seat is anchored by its avatar and name plate: the hole cards sit above it out of the flow, so a seat doesn't
   move when its cards are dealt, folded away or turned face up at showdown */
#game .seat>.hole{position:absolute;left:50%;bottom:100%;transform:translateX(-50%);width:max-content}
/* the line under the board has one line of room on the felt; more would run into the seats below (a finished
   hand's whole result is written in the bar under the table) */
#game .center .msg{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
#game .center .msg>div{display:inline}
/* (the tall stadium keeps two lines for it, see tableGeo) */
#game .table-area.stad .center .msg{-webkit-line-clamp:2}
#game .center .msg>div+div::before{content:' · '}
/* the shortest screens (iPhone SE 1st gen, phones held sideways): one header row, the clock with the chat and Lobby
   buttons beside it, so the table gets the room of the second row (table, average stack, rank) for the whole game */
#game.row1 .stats{display:none}
#game.row1 .clock{grid-template-columns:auto minmax(0,1fr) auto auto}
#game.row1 .clock{gap:6px;padding-left:8px;padding-right:8px}
#game.row1 .clock .hdr-btns{display:flex;gap:6px}
#game.row1 .clock .menu-btn{padding:0 8px;font-size:12px;letter-spacing:.04em}
#game.h600 .lvl{min-width:44px}
#game.h600 .blinds b{font-size:14px}
#game.h600 .time b{font-size:20px}
#game.h600 .lvl{min-width:40px;padding:2px 6px}
/* ---------- table redesign: a phone held sideways ----------
   The table takes the whole width on the left (not the 540 px column) and the dock (helper + action bar) stands
   in a compact column on the right, so the felt gets the full height under the one-row header. The game keeps
   clear of the iPhone's safe areas: the notch / Dynamic Island side and the home bar (env() values, held in
   --sa-* so a test can set them). */
:root{--sa-l:env(safe-area-inset-left,0px);--sa-r:env(safe-area-inset-right,0px);--sa-b:env(safe-area-inset-bottom,0px)}
.app:has(> #game.land:not([hidden])){max-width:none}
#game.land{display:grid;grid-template-columns:minmax(0,1fr) clamp(210px,27vw,260px);grid-template-rows:auto auto minmax(0,1fr);
  padding:0 var(--sa-r) var(--sa-b) var(--sa-l)}
#game.land .clock{grid-column:1/-1;grid-row:1}
/* a slim one-line header (about 36 px): "Level 3", the blinds with the ante beside them, the clock, chat, Lobby */
#game.land .clock{padding:2px 8px;min-height:0}
#game.land .lvl{display:flex;align-items:baseline;gap:5px;padding:1px 8px;border-radius:9px}
#game.land .blinds{display:flex;align-items:baseline;gap:8px;min-width:0}
#game.land .time{display:flex;align-items:baseline;gap:6px}
#game.land .time small{display:none}
#game.land .clock .menu-btn{min-height:30px}
#game.land .table-area{grid-column:1;grid-row:3}
#game.land .dock{grid-column:2;grid-row:3;align-self:end;margin-top:0;padding-left:2px;min-width:0}
#game.land .dock .turnrow{gap:8px;min-width:0}
#game.land .dock .xtime{padding:5px 9px;font-size:12px;white-space:nowrap}
#game.land .dock .act-main{gap:6px}
#game.land .dock .act-btn{min-width:0}
#game.land .dock .controls{padding:4px 8px 8px 4px}
#game.land .dock .helper{margin:0 8px 4px 4px;padding:6px 9px;gap:3px;font-size:12px}
/* the narrow column's line under the table (watching: who's acting, who won) keeps the two lines the dock holds */
#game.land .dock .info-line{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
/* your own cards sit beside your name plate, not on top of it: the plate, the stack and the badge stay readable and
   the seat needs less height at the bottom of a short table */
#game.land .seat.hero>.hole{bottom:auto;top:50%;left:auto;right:100%;transform:translateY(-50%);margin:0 4px 0 0}
#game.land .seat.hero .card.hero{--w:var(--cw)}
/* the plate moves right by half the cards' width, so your cards and plate together sit in the middle of the table */
#game.land .seat.hero{margin-left:calc(var(--cw) + 3px)}
#game.land.land-s .seat.hero{margin-left:0}
#game.land.land-s .seat.hero>.hole{top:auto;bottom:100%;right:auto;left:50%;transform:translateX(-50%);margin:0 0 2px}
#game.land.land-s .seat.hero .card.hero{--w:calc(var(--cw)*.9)}
/* sideways, the dock column is narrow but tall: the helper keeps its hand name and chance to win on the first row and
   its advice gets up to three full lines under them, instead of one line cut off mid-sentence. On short screens
   (and sideways) the chance to win sits right above or beside the advice, so the advice drops its own "you have N%"
   and the figure shows once. */
#game.land .helper{grid-template-columns:minmax(0,1fr) auto}
#game.land .helper .h-name{display:block;grid-column:1;grid-row:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#game.land .helper .h-line{grid-column:1/-1;grid-row:2;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
#game.land .helper .h-odds{display:inline}
#game.land .helper .h-odds-s{display:none}
#game.h700 .helper .h-have{display:none}
/* table extras: rabbit-hunt cards read as "never dealt"; show/muck buttons use four columns */
.card.board.rabbit{opacity:.5;filter:saturate(.6);outline:1px dashed rgba(214,180,106,.7);outline-offset:-1px}
.preacts.showmuck{grid-template-columns:repeat(4,1fr)}
.preacts.showmuck.n3{grid-template-columns:repeat(3,1fr)}
.preacts.showmuck.n1{grid-template-columns:1fr}
.preacts.showmuck button{color:var(--text,#fff)}
.preacts.showmuck button:disabled{opacity:.45}
/* on a phone held upright the "Raise to" line is left out of the raise panel (the amount is on the Raise button), so
   the panel is barely taller than the helper and action bar it replaces; the dock keeps room for it (reserveDock) */
@media (max-width:599px){ #game:not(.land) .sizing .amt{display:none} }
/* upright on a phone the raise panel keeps to the compact size of the short screens (h700), so the room the dock
   keeps for it stays small and the long table above it gets that height */
@media (max-width:599px){
  #game.row1:not(.land) .sizing{padding:7px 8px;gap:7px}
  #game.row1:not(.land) .sz-presets button{padding:6px 0}
  #game.row1:not(.land) .sz-slider .step{width:36px;height:36px;font-size:20px}
}
/* ---------- the WPT table (a phone held upright, not the shortest screens) ----------
   The table area runs from the header to the bottom of the screen and the felt spans its width, its lower end going
   on past the screen's edge. Your seat stands at the bottom left; the dock (helper and action buttons) is a narrow
   column at the bottom right, over the felt, as tall as app.js reserves for it, and the seats are laid out round it
   (tableGeo), so it never covers a seat, a card or the board. Colours and type stay as they are. */
#game.wpt .table-area{margin:2px 0 0;overflow:hidden}
#game.wpt .dock{position:absolute;right:calc(6px + var(--sa-r));bottom:calc(6px + var(--sa-b));width:var(--dock-w,184px);margin:0;padding:0;height:auto;justify-content:flex-end;pointer-events:none}
#game.wpt .dock>*{pointer-events:auto}
#game.wpt .dock .controls{min-height:0;padding:0;gap:6px;background:none}
#game.wpt .dock .helper{height:auto;margin:0 0 6px;padding:6px 9px;font-size:12px;position:relative}
#game.wpt .helper .h-top{gap:6px;align-items:center}
#game.wpt .helper .h-name{font-size:12.5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#game.wpt .helper .h-eq{font-size:14px}
#game.wpt .helper .h-eq small{display:none}
#game.wpt .helper .h-more{font-style:normal;color:var(--lx-gold,#d8b46a);font-size:13px;line-height:1}
#game.wpt .dock .helper.open{position:absolute;right:0;bottom:calc(100% + 6px);width:min(280px,calc(100vw - 12px));margin:0;gap:5px;font-size:12.5px;box-shadow:0 10px 26px rgba(0,0,0,.55);z-index:2}
#game.wpt .dock .helper.open .h-eq small{display:inline}
#game.wpt .dock .helper.open .h-line{-webkit-line-clamp:4}
#game.wpt .turnrow{min-height:44px;gap:6px;align-items:center}
#game.wpt .xtime{min-height:44px;padding:0 9px;font-size:12px;align-items:center}
#game.wpt .act-main{grid-template-columns:1fr;gap:6px}
#game.wpt .act-btn{min-height:44px;flex-direction:row;justify-content:space-between;padding:0 12px;border-radius:12px}
#game.wpt .act-btn b{font-size:16px}
#game.wpt .act-btn span{font-size:14px}
#game.wpt .act-btn.raise span:not(.num){font-size:11px}
#game.wpt .sizing~.act-main{grid-template-columns:1fr 1fr}
#game.wpt .sizing~.act-main .act-btn{flex-direction:column;justify-content:center;gap:0;padding:0 6px}
#game.wpt .sizing{padding:6px;gap:6px}
#game.wpt .sz-presets{grid-template-columns:1fr 1fr;gap:5px}
#game.wpt .sz-presets button{min-height:44px;padding:0;font-size:13px}
#game.wpt .sz-presets button:last-child:nth-child(odd){grid-column:1/-1}
#game.wpt .sz-slider{gap:6px}
#game.wpt .sz-slider .step{width:44px;height:44px;font-size:20px;flex:none}
#game.wpt .info-line{font-size:12.5px;padding:4px 6px;line-height:1.35;background:rgba(7,11,20,.8);border:1px solid var(--lx-hair,rgba(255,255,255,.1));border-radius:10px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
#game.wpt .preacts,#game.wpt .preacts.showmuck.n1{grid-template-columns:1fr;gap:5px}
#game.wpt .preacts.showmuck{grid-template-columns:1fr 1fr}
#game.wpt .preacts button{min-height:44px;font-size:13px}
#game.wpt .dock .controls,#game.wpt .sizing{grid-template-columns:minmax(0,1fr)}
#game.wpt .sz-slider input{min-width:0;width:100%;flex:1}
#game.wpt .turnrow .turnbar{min-width:0}
#game.wpt .sizing~.act-main{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
#game.wpt .sizing~.act-main .act-btn b{font-size:14px;white-space:nowrap}
#game .center .msg.up{top:auto;bottom:100%;margin:0 0 6px}
/* ---------- free social play: the start-of-game notice and the line under the table ----------
   The line sits in the dock between the helper and the action bar, and app.js counts it in the dock's reserved
   height, so it is never over the table. Upright and seated it takes exactly the gap that was already there (the
   helper's bottom margin and the bar's top padding, 6 + 6 px, or 6 + 4 px on short screens), and the 1 px (3 px on
   short screens) more that its 11 px text needs comes out of the helper's own padding, so the table keeps its size
   to the pixel. Watching, it sits over the
   bar's top padding, above the status line's own padding (6 + 8 px; 5 + 8 px on short screens, 1 px more than before).
   Sideways it is one more row of the dock column, which has room to spare. The notice covers only the board's
   empty slots before the flop (placed by app.js). */
#game .playline{flex:none;position:relative;z-index:4;height:13px;padding:0 8px;text-align:center;font-size:11px;line-height:13px;
  letter-spacing:.02em;color:rgba(216,180,106,.66);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;user-select:none}
#game .playline span{white-space:nowrap}
#game.seated:not(.land) .dock .helper{margin-bottom:0;padding-bottom:7px}
#game.seated.h700:not(.land) .dock .helper{padding-top:5px;padding-bottom:4px}
#game.seated:not(.land) .dock .controls{padding-top:0}
#game:not(.seated):not(.land) .playline{position:absolute;top:0;left:0;right:0}
#game.h700:not(.seated):not(.land) .dock .controls{padding-top:5px}
#game.land .playline{height:auto;margin:0 0 3px;padding:0 8px 0 4px;white-space:normal}
.playnote{position:absolute;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  box-sizing:border-box;padding:2px 14px;overflow:hidden;text-align:center;line-height:1.15;font-size:13px;cursor:pointer;
  border-radius:10px;background:rgba(10,16,30,.94);border:1px solid var(--lx-hair2,rgba(241,223,176,.26));
  box-shadow:0 0 0 1px rgba(0,0,0,.35),0 6px 18px rgba(0,0,0,.45);animation:pnIn .3s ease-out}
@keyframes pnIn{from{opacity:0}}
.playnote[hidden]{display:none}
.playnote b{color:var(--lx-gold,#d8b46a);font-weight:600;letter-spacing:.04em;white-space:nowrap}
.playnote span{color:var(--lx-ivory,#f4eee2);white-space:nowrap}
.playnote.wrap span{white-space:normal}
.playnote i{position:absolute;top:1px;right:5px;font-style:normal;font-size:12px;line-height:1;color:var(--lx-mute,#a3abbb)}
@media (prefers-reduced-motion:reduce){.playnote{animation:none}}
/* in the WPT column the free-play line takes two short lines above the buttons (counted in the column's height) */
#game.wpt .playline,#game.wpt:not(.seated) .playline{position:static;height:auto;margin:6px 0 0;padding:0 4px;white-space:normal;line-height:13px}
#game.wpt .dock .controls{flex:1 1 auto;align-content:end}
/* the column is a grid of three rows: the helper's line (its height kept when the helper is hidden: folded, the hand
   over), the buttons, and the free-play line at its foot, so nothing in it moves mid-hand; the raise panel takes the
   helper's row too (the helper is hidden while it is open), so the column is no taller for it */
#game.wpt .dock{display:grid;grid-template-rows:var(--hlp-h,0px) minmax(0,1fr) auto}
#game.wpt .dock .helper{grid-row:1;align-self:start}
#game.wpt .dock .controls{grid-row:2}
#game.wpt .dock .controls:has(.sizing){grid-row:1/3}
#game.wpt .dock .playline{grid-row:3}
/* last hand's coach tip opens just above the column (as the open helper does), over the felt, never over the buttons */
#game.wpt .dock>.coachtip{left:auto;right:0;top:auto;bottom:calc(100% + 6px);width:min(300px,calc(100vw - 12px));grid-row:auto}
/* the extra-time button keeps a 44 px tap target in the column while its pill stays the usual slim size */
#game.wpt .xtime,#game.wpt .xtime:disabled{background:none;border-color:transparent;position:relative;isolation:isolate}
#game.wpt .xtime::before{content:'';position:absolute;inset:8px 0;z-index:-1;border-radius:999px;background:rgba(240,195,90,.12);border:1px solid rgba(240,195,90,.4)}
#game.wpt .felt::after{top:var(--wm,50%)}
/* the WPT table, closer to WPT: the helper is a small line under the board (centred, like WPT's pot line) and opens
   there on a tap; while the raise panel is open the clock row gives it its place (your plate's own time bar keeps
   running) */
#game.wpt .center>.helper{position:absolute;left:50%;top:100%;transform:translateX(-50%);width:max-content;max-width:min(300px,calc(100vw - 24px));margin:6px 0 0;padding:5px 10px;font-size:12px;z-index:6;height:auto}
#game.wpt .center>.helper.open{width:min(280px,calc(100vw - 24px));box-shadow:0 10px 26px rgba(0,0,0,.55);z-index:30;gap:5px}
#game.wpt .center>.helper.open .h-eq small{display:inline}
#game.wpt .center>.helper.open .h-line{-webkit-line-clamp:4}
#game.wpt .controls:has(.sizing) .turnrow{display:none}
/* the compact WPT pill: the other seats a little smaller, so 6 to 9 of them fit round it without crowding the pot */
/* the oval table, upright on a phone (as WPT and WSOP): each seat on the rail, its avatar in the middle of the rail,
   its two cards fanned behind the avatar and its name plate off the felt, under the avatar and out to its side on the
   sides, over it at the top; --sx/--sy move the plate further out where the felt curves under it */
#game .seat[data-side]{width:auto;display:block}
#game .seat[data-side] .av{width:36px;height:36px;font-size:13px;z-index:2}
#game .seat[data-side] .plate{position:absolute;top:calc(100% - 5px);margin:0;min-width:0;width:max-content;padding:4px 6px 2px;transform:translate(var(--sx,0px),var(--sy,0px))}
#game .seat[data-side] .nm{font-size:10px;max-width:54px}
#game .seat[data-side] .st{font-size:11px}
#game .seat[data-side=l] .plate{right:calc(50% - 7px)}
#game .seat[data-side=r] .plate{left:calc(50% - 7px)}
#game .seat[data-side^=t] .plate{top:auto;bottom:calc(100% + 4px);left:50%;transform:translate(calc(-50% + var(--sx,0px)),var(--sy,0px))}
#game .seat[data-side] .badge{font-size:8px;letter-spacing:.02em;padding:1px 3px;bottom:-14px}
#game .seat[data-side^=t] .badge{bottom:auto;top:-14px}
#game .seat[data-side=l] .badge{left:auto;right:0;transform:none}
#game .seat[data-side=r] .badge{left:0;transform:none}
#game .seat[data-side]>.hole{display:flex;left:50%;bottom:42%;transform:translateX(-50%);margin:0;z-index:0}
#game .seat[data-side=l]>.hole:not(.shown){left:auto;right:26%;bottom:60%;transform:none}
#game .seat[data-side=r]>.hole:not(.shown){left:26%;bottom:60%;transform:none}
#game .seat[data-side] .card.mini{--w:23px}
#game .seat[data-side=t] .card.mini{--w:19px}
#game .seat[data-side]>.hole:not(.shown) .card.mini:first-child{transform:rotate(-10deg)}
#game .seat[data-side]>.hole:not(.shown) .card.mini+.card.mini{margin-left:-8px;transform:rotate(10deg)}
#game .seat[data-side=t]>.hole:not(.shown){bottom:auto;top:45%;transform:translate(-50%,-50%);width:58px;justify-content:space-between}
#game .seat[data-side=t]>.hole:not(.shown) .card.mini:first-child{transform:rotate(-24deg)}
#game .seat[data-side=t]>.hole:not(.shown) .card.mini+.card.mini{margin-left:0;transform:rotate(24deg)}
#game .seat[data-side] .plate::after{display:none}
#game .table-area.mini .seat[data-side] .av{width:30px;height:30px;font-size:11px}
#game .table-area.mini .seat[data-side] .nm{font-size:9.5px;max-width:48px}
#game .table-area.mini .seat[data-side] .st{font-size:10.5px}
#game .table-area.mini .seat[data-side] .card.mini{--w:20px}
#game .table-area.mini .seat[data-side=t] .card.mini{--w:16px}
#game .seat[data-side=tl]>.hole:not(.shown){left:auto;right:46%;bottom:auto;top:8%;transform:none}
#game .seat[data-side=tr]>.hole:not(.shown){left:46%;bottom:auto;top:8%;transform:none}
#game .table-area.micro .seat[data-side] .av{width:26px;height:26px;font-size:10px}
#game .table-area.micro .seat[data-side] .nm{font-size:9px;max-width:44px}
#game .table-area.micro .seat[data-side] .st{font-size:10px}
#game .table-area.micro .seat[data-side] .card.mini{--w:16px}
/* (the smallest seats keep their cards beside the avatar, outward, which takes no height between seats) */
#game .table-area.micro .seat[data-side=l]>.hole:not(.shown){right:42%;bottom:26%}
#game .table-area.micro .seat[data-side=r]>.hole:not(.shown){left:42%;bottom:26%}
#game .table-area.micro .seat[data-side=t] .card.mini{--w:14px}
#game .seat[data-side]>.hole.shown{bottom:88%;z-index:3}
#game .seat[data-side^=t]>.hole.shown{bottom:auto;top:88%}

/* (the oval's dock: the raise panel takes the timer's row and the helper's line, the timer a thin line along its top
   edge and its amount on the Raise button, so the dock is no taller with it open and the table keeps the room) */
#game.ovl .sizing{grid-template-columns:44px minmax(0,1fr) 44px;grid-template-rows:44px 26px;padding:5px 6px 2px;gap:4px 6px}
#game.ovl .sz-slider{display:contents}
#game.ovl .sz-slider .step:first-child{grid-column:1;grid-row:1}
#game.ovl .sz-presets{grid-column:2;grid-row:1}
#game.ovl .sz-slider .step:last-child{grid-column:3;grid-row:1}
#game.ovl .sz-slider input{grid-column:1/4;grid-row:2;align-self:center}
#game.ovl .sz-slider input::-webkit-slider-thumb{width:24px;height:24px}
#game.ovl .sizing .amt{display:none}
#game.ovl .controls:has(.sizing){position:relative}
#game.ovl .controls:has(.sizing) .turnrow{position:absolute;left:14px;right:14px;top:-1px;min-height:0;z-index:2;pointer-events:none}
#game.ovl .controls:has(.sizing) .turnrow .xtime{display:none}
#game.ovl .controls:has(.sizing) .turnbar{height:3px;margin:0}
#game.ovl .controls:has(.sizing) .turnbar span{display:none}
#game.ovl .sz-presets button{min-height:44px;padding:0}
#game.ovl .sz-slider .step{width:44px;height:44px}
/* (your seat on the oval, as WPT draws it: your cards smaller, overlapping a little and tilted, their lower
   edge tucked behind your plate, so your seat is one compact unit) */
#game.ovl .seat.hero>.hole{gap:0;margin-bottom:-8px;z-index:1}
#game.ovl .seat.hero .plate{position:relative;z-index:2}
#game.ovl .seat.hero .card.hero{--w:calc(var(--cw)*1.05)}
#game.ovl .seat.hero .card.hero:first-child{transform:rotate(-4deg);margin-right:-6px}
#game.ovl .seat.hero .card.hero+.card.hero{transform:rotate(4deg)}
#game.ovl .seat.hero .badge{left:calc(100% + 6px);bottom:auto;top:50%;transform:translateY(-50%)}
#game .table-area.oval .felt::after{top:var(--wm,74%)}
/* (the raise panel's presets, five of them with All-in, stay one row between the - and + steps) */
#game.ovl .sz-presets{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px}
#game.ovl .sz-presets button{font-size:clamp(11px,3.3vw,12.5px);line-height:1.05;white-space:normal;letter-spacing:0;padding:0 2px}
/* the felt's name gives way to the line written over it (a result, a note) */
#game .table-area .felt::after{transition:opacity .25s}
#game .table-area.msg-on .felt::after{opacity:0}
/* between your turns, a lone status line (the result, waiting for the deal, folded) stands as a quiet panel in the
   middle of the buttons' place, not alone at the foot of an empty bar */
#game.ovl .dock .controls:not(:has(button,.sizing)),#game.land .dock .controls:not(:has(button,.sizing)){align-content:center}
#game.ovl .dock .controls:not(:has(button,.sizing))>.info-line:not(:empty),#game.land .dock .controls:not(:has(button,.sizing))>.info-line:not(:empty){border:1px solid rgba(216,180,106,.2);border-radius:16px;background:rgba(255,255,255,.03);padding:12px 14px}
/* sideways the helper is as tall as what it says, just above the buttons (its room is still kept, so nothing moves) */
#game.land .dock .helper{height:auto;max-height:var(--hlp-h,none)}

/* ---------- club switching (only shown when the server has it on and you belong to more than one club) ---------- */
.club-btn{flex:none;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:rgba(230,187,104,.1);color:var(--lx-gold,#e6bb68);border:1px solid rgba(230,187,104,.45);border-radius:99px;padding:5px 12px;font-size:12px;font-weight:700;letter-spacing:.02em}
.club-btn::after{content:' ▾';opacity:.8}
.club-list{display:flex;flex-direction:column;gap:8px;margin:12px 0}
.club-pick{text-align:left;background:rgba(255,255,255,.04);color:var(--text);border:1px solid rgba(230,187,104,.25);border-radius:12px;padding:12px 14px;font-size:15px;font-weight:600}
.club-pick.on{border-color:var(--lx-gold,#e6bb68);box-shadow:inset 0 0 0 1px var(--lx-gold,#e6bb68)}
.club-pick.on::after{content:' · current';color:var(--muted);font-weight:500;font-size:13px}