
/* Layout: one-screen app, top switcher; table = graphite rail around near-black felt, your hand + action dock below */
:root{
  --ink:#09090a; --coal:#121214; --raise:#1b1b1e; --lift:#242428;
  --champ:#d6b97f; --champ-d:#9c8456; --gold-hi:#f1d9a4;
  --ivory:#f4efe4; --text:#ece8df; --muted:#8a867d; --dim:#5b5852;
  --heart:#c2412f; --ok:#6aa57d;
  --display:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --body:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --sh-out:0 18px 40px -18px rgba(0,0,0,.9), 0 2px 6px rgba(0,0,0,.5);
  --sh-btn:inset 0 1px 0 rgba(255,255,255,.07), 0 10px 24px -12px rgba(0,0,0,.9);
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{background:var(--ink);color:var(--text);font-family:var(--body);font-size:15px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
  background-image:radial-gradient(1200px 600px at 50% -10%, #1a1814 0%, transparent 60%);}
button{font:inherit;color:inherit;border:0;cursor:pointer;background:none}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--champ);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
.wrap{max-width:1080px;margin:0 auto}

.proto{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-block:14px}
.brand img{display:block;height:28px;width:auto;max-width:none}
.brand{display:block;line-height:0;font-family:var(--display);font-size:24px;font-weight:700;letter-spacing:.02em}
.brand i{font-style:normal;color:var(--champ)}
.switch{display:flex;gap:4px;background:var(--coal);padding:4px;border-radius:999px;box-shadow:inset 0 2px 6px rgba(0,0,0,.6);flex-wrap:wrap}
.switch a{padding:8px 14px;border-radius:999px;color:var(--muted);text-decoration:none;font-weight:600;font-size:13px}
.switch a.on{background:var(--lift);color:var(--text);box-shadow:var(--sh-btn)}
.switch small{color:var(--dim);font-weight:600}
section.view{padding-block:8px 40px}

.panel{background:linear-gradient(180deg,var(--raise),var(--coal));border-radius:22px;box-shadow:var(--sh-out),inset 0 1px 0 rgba(255,255,255,.04)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 24px;border-radius:16px;text-decoration:none;
  font-weight:700;font-size:16px;background:linear-gradient(180deg,#2a2a2f,#1d1d21);box-shadow:var(--sh-btn);transition:transform .12s, filter .12s;white-space:nowrap}
.btn:hover{filter:brightness(1.12)} .btn:active{transform:translateY(1px)}
.btn.gold{background:linear-gradient(180deg,#e3c891,#b99a62);color:#1a150c}
.btn.red{background:linear-gradient(180deg,#b04535,#842d23);color:#fff3ef}
.btn.sm{height:38px;padding:0 14px;font-size:14px;border-radius:12px}
.btn.ghost{background:none;box-shadow:none;color:var(--muted);text-decoration:underline;text-underline-offset:3px;height:auto;padding:0;font-size:13px;font-weight:600}
.btn[disabled]{opacity:.35;pointer-events:none}
.label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
.h1{font-family:var(--display);font-size:clamp(34px,6vw,52px);font-weight:600;line-height:1;margin:0;text-wrap:balance}
.h2{font-family:var(--display);font-size:28px;font-weight:600;margin:0}
.muted{color:var(--muted)}
.coin{display:inline-block;flex:none;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f3dcaa,#b08d52 60%,#6f5629);box-shadow:0 1px 2px rgba(0,0,0,.6)}
.row{display:flex;gap:10px;flex-wrap:wrap}

/* balance plaque */
.stack{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 7px;border-radius:999px;font-weight:800;font-size:14px;color:var(--gold-hi);
  background:linear-gradient(180deg,#3a3122,#211c13);box-shadow:inset 0 1px 0 rgba(255,220,150,.18),0 6px 14px -6px rgba(0,0,0,.9)}
.stack.big{font-size:18px;padding:8px 14px 8px 10px}
.stack.big .coin{width:18px;height:18px}
.stack.zero{color:var(--dim);background:var(--raise)}

/* avatar */
.av{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:18px;position:relative;flex:none;background-size:cover;background-position:center;
  box-shadow:0 10px 22px -10px rgba(0,0,0,1),inset 0 2px 0 rgba(255,255,255,.12),inset 0 -6px 14px rgba(0,0,0,.35)}
.av.s{width:34px;height:34px;font-size:12px}
.av.l{width:84px;height:84px;font-size:26px}
.avpick{position:relative;cursor:pointer}
.avpick input{position:absolute;inset:0;opacity:0;cursor:pointer}
.avpick .plus{position:absolute;right:-2px;bottom:-2px;width:28px;height:28px;border-radius:50%;background:var(--champ);color:#1a150c;font-weight:800;display:grid;place-items:center;box-shadow:0 4px 10px rgba(0,0,0,.7)}

/* LOGIN */
.auth{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;align-items:stretch}
.auth-hero{padding:36px;display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:420px;overflow:hidden;position:relative}
.auth-hero .fan{position:relative;height:150px}
.auth-hero .fan .card{position:absolute;bottom:0;transform-origin:50% 120%}
.placeholder{border-radius:14px;padding:14px 16px;background:rgba(255,255,255,.03);color:var(--dim);font-size:14px;line-height:1.5}
.auth-form{padding:32px;display:flex;flex-direction:column;gap:16px}
.tabs{display:flex;gap:4px;background:var(--ink);padding:4px;border-radius:14px;box-shadow:inset 0 2px 6px rgba(0,0,0,.7)}
.tabs button{flex:1;height:42px;border-radius:11px;font-weight:700;color:var(--muted)}
.tabs button.on{background:var(--lift);color:var(--text);box-shadow:var(--sh-btn)}
.field{display:flex;flex-direction:column;gap:6px}
.field span{font-size:13px;color:var(--muted);font-weight:600}
.field input,.inp{height:52px;border:0;border-radius:14px;background:#0c0c0e;color:var(--text);padding:0 16px;font:inherit;font-size:16px;min-width:0;
  box-shadow:inset 0 2px 8px rgba(0,0,0,.8), inset 0 -1px 0 rgba(255,255,255,.04)}
.field input::placeholder{color:var(--dim)}
.hint{font-size:13px;color:var(--muted);line-height:1.5;margin:0}
.ok-note{background:rgba(106,165,125,.12);color:#a9d4b5;border-radius:14px;padding:14px 16px;font-size:14px;line-height:1.5}
.avrow{display:flex;align-items:center;gap:14px}

/* LOBBY */
.lobby{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}
.lobby .me{padding:30px;display:flex;flex-direction:column;gap:22px}
.who-row{display:flex;gap:16px;align-items:center}
.seatinfo{display:flex;gap:14px;align-items:center;background:var(--ink);border-radius:16px;padding:14px 16px;box-shadow:inset 0 2px 8px rgba(0,0,0,.7)}
.pulse{width:10px;height:10px;flex:none;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(106,165,125,.6);animation:pulse 1.8s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(106,165,125,0)}100%{box-shadow:0 0 0 0 rgba(106,165,125,0)}}
.side{padding:26px;display:flex;flex-direction:column;gap:14px}
.side p{margin:0;line-height:1.55;color:#cfcac0}
.side p b{color:var(--text)}
.full{grid-column:1/-1;padding:24px;display:flex;flex-direction:column;gap:16px;min-width:0}

/* tables (data) */
.scroll{overflow-x:auto}
table{width:100%;border-collapse:separate;border-spacing:0 6px}
th{text-align:left;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:0 12px;white-space:nowrap}
td{background:var(--ink);padding:10px 12px;font-size:14px;vertical-align:middle}
td:first-child{border-radius:12px 0 0 12px}td:last-child{border-radius:0 12px 12px 0}
td .acts{display:flex;gap:6px;justify-content:flex-end}
tr.dim td{opacity:.5}
tr.final td{background:linear-gradient(180deg,#221d14,#15120c)}
.who{display:flex;align-items:center;gap:10px;min-width:0}
.who b{white-space:nowrap}
.names{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:13px}
.names .x{color:var(--dim);text-decoration:line-through}
.names .w{color:var(--champ);font-weight:800}
.tag{display:inline-block;font-size:11px;font-weight:800;padding:4px 9px;border-radius:999px;background:var(--lift);white-space:nowrap}
.tag.live{background:rgba(106,165,125,.16);color:#9fd0ad}.tag.bad{background:#3a1814;color:#e49a8e}.tag.gold{background:#3a3020;color:var(--champ)}
.t-bracket{min-width:720px}.t-players{min-width:960px}

/* TABLE */
.tbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.tbar .l,.tbar .r{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ico{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(180deg,#26262a,#1a1a1d);box-shadow:var(--sh-btn);position:relative;flex:none;text-decoration:none;color:inherit}
.ico svg{width:20px;height:20px}
.ico.on{color:var(--champ)}
.ico.txt{width:auto;padding:0 14px;font-weight:700;font-size:14px;gap:8px;display:inline-flex;align-items:center}
.badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;border-radius:9px;background:var(--heart);font-size:11px;font-weight:800;display:grid;place-items:center;padding:0 5px}
.tname{font-weight:700}.tname small{display:block;color:var(--muted);font-weight:600;font-size:12px}
.blinds{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;background:var(--coal);height:44px;border-radius:14px;padding:0 14px;box-shadow:inset 0 2px 6px rgba(0,0,0,.7)}
.blinds span{color:var(--muted);font-weight:600}

.ring{position:relative;padding:96px 64px 112px;margin-top:8px}
.rail{position:relative;border-radius:999px;aspect-ratio:2.1/1;
  background:linear-gradient(180deg,#2a2a2e,#121214 70%);box-shadow:0 40px 80px -30px rgba(0,0,0,1),0 0 0 1px rgba(0,0,0,.6),inset 0 2px 0 rgba(255,255,255,.06)}
.felt{position:absolute;inset:16px;border-radius:999px;
  background:radial-gradient(ellipse 70% 60% at 50% 42%,#1b1f1d 0%,#111312 55%,#0a0b0b 100%);
  box-shadow:inset 0 10px 30px rgba(0,0,0,.9),inset 0 -2px 0 rgba(255,255,255,.03);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.felt::before{content:"";position:absolute;inset:22px;border-radius:999px;box-shadow:0 0 0 1px rgba(214,185,127,.07);pointer-events:none}
.pot{text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}
.pot b{font-family:var(--display);font-size:44px;font-weight:600;line-height:1;color:var(--champ)}
.board{display:flex;gap:8px}
.street{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.08em;text-transform:uppercase}

.card{width:56px;height:78px;border-radius:9px;background:linear-gradient(160deg,#fbf8f1,#e6dfcf);color:#17161a;
  box-shadow:0 8px 18px -8px rgba(0,0,0,.9),0 1px 2px rgba(0,0,0,.5);position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:6px 7px;flex:none}
.card .cr{font-family:var(--display);font-weight:700;font-size:24px;line-height:.9}
.card .cs{font-size:22px;line-height:1;align-self:flex-end}
.card.red{color:var(--heart)}
.card.back{background:linear-gradient(160deg,#25211a,#141210)}
.card.back::after{content:"";position:absolute;inset:5px;border-radius:5px;background:repeating-linear-gradient(45deg,rgba(214,185,127,.16) 0 2px,transparent 2px 7px)}
.card.slot{background:rgba(255,255,255,.025);box-shadow:inset 0 2px 8px rgba(0,0,0,.6)}
.card.deal{animation:deal .35s ease-out both}
@keyframes deal{from{transform:translateY(-16px) scale(.94);opacity:0}}
.card.xs{width:28px;height:40px;border-radius:5px;padding:3px 4px}
.card.xs .cr{font-size:14px}.card.xs .cs{font-size:12px}
.card.lg{width:92px;height:128px;border-radius:13px;padding:10px 11px}
.card.lg .cr{font-size:40px}.card.lg .cs{font-size:36px}
.card.mute{filter:brightness(.45)}

.seat{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:5px;width:108px;text-align:center;transition:opacity .3s}
.seat.folded{opacity:.45}.seat.out{opacity:.25}
.seat .hole{position:absolute;right:-22px;top:4px;display:flex}
.seat .hole .card{margin-left:-14px}
.seat .hole .card:first-child{transform:rotate(-8deg)}
.seat .hole .card:last-child{transform:rotate(7deg)}
.seat.turn .av::before{content:"";position:absolute;inset:-6px;border-radius:50%;
  background:conic-gradient(var(--champ) calc(var(--t,1)*360deg),rgba(255,255,255,.06) 0);
  -webkit-mask:radial-gradient(circle,transparent 31px,#000 32px);mask:radial-gradient(circle,transparent 31px,#000 32px)}
.seat.speak .av::after{content:"";position:absolute;inset:-4px;border-radius:50%;box-shadow:0 0 0 3px rgba(106,165,125,.75);animation:spk 1s infinite alternate}
@keyframes spk{to{box-shadow:0 0 0 6px rgba(106,165,125,.15)}}
.dealer{position:absolute;left:-6px;bottom:-4px;width:22px;height:22px;border-radius:50%;background:var(--ivory);color:#111;font-size:11px;font-weight:800;display:grid;place-items:center;box-shadow:0 3px 8px rgba(0,0,0,.7)}
.nm{font-weight:700;font-size:13px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st{font-size:11px;font-weight:800;padding:3px 9px;border-radius:999px;background:var(--lift);box-shadow:var(--sh-btn);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.st.fold{background:#3a1814;color:#e49a8e}.st.raise{background:#3a3020;color:var(--champ)}.st.win{background:var(--champ);color:#1a150c}
.st.empty{visibility:hidden}
.betpill{font-size:11px;font-weight:700;color:var(--muted)}
.betpill b{color:var(--text)}
.reveal{display:flex;gap:3px}
.s0{left:50%;top:calc(100% - 62px)}.s1{left:6%;top:74%}.s2{left:13%;top:84px}.s3{left:50%;top:62px}.s4{left:87%;top:84px}.s5{left:94%;top:74%}

.hand{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;margin-top:4px}
.mycards{display:flex;gap:10px}
.mycards .card:first-child{transform:rotate(-3deg)}
.mycards .card+.card{transform:rotate(3deg)}
.odds{font-weight:800;color:var(--champ);font-size:14px}
.combo{padding:16px 20px;border-radius:18px;background:var(--coal);box-shadow:inset 0 2px 8px rgba(0,0,0,.7);display:flex;flex-direction:column;gap:4px;min-width:0}
.combo b{font-family:var(--display);font-size:30px;font-weight:600;line-height:1}
.timer{font-family:var(--display);font-size:40px;color:var(--champ);line-height:1;text-align:center}
.timer small{display:block;font-family:var(--body);font-size:11px;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;font-weight:700}
.dock{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:10px;margin-top:16px}
.dock .btn{height:72px;font-size:18px;border-radius:20px;flex-direction:column;gap:2px;line-height:1.1;white-space:normal;text-align:center}
.dock .btn small{font-size:12px;font-weight:600;opacity:.65}
.raisebox{margin-top:12px;padding:16px;display:flex;flex-direction:column;gap:12px}
.raisebox .q{display:flex;gap:8px;flex-wrap:wrap}
input[type=range]{width:100%;accent-color:var(--champ);height:28px}
.result{margin-top:16px;padding:18px 20px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.result b{font-family:var(--display);font-size:26px;font-weight:600;color:var(--champ)}
.demo{margin-top:18px;display:flex;gap:16px;flex-wrap:wrap}

/* drawer */
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(380px,100%);background:linear-gradient(180deg,#17171a,#0e0e10);z-index:40;
  box-shadow:-30px 0 60px rgba(0,0,0,.7);display:flex;flex-direction:column;transform:translateX(105%);transition:transform .3s;
  padding:calc(16px + env(safe-area-inset-top,0px)) calc(16px + env(safe-area-inset-right,0px)) calc(16px + env(safe-area-inset-bottom,0px)) 16px}
.drawer.open{transform:none}
.msgs{flex:1;overflow:auto;display:flex;flex-direction:column;gap:10px;padding-block:14px}
.msg{background:var(--raise);border-radius:14px;padding:10px 12px;font-size:14px;line-height:1.4;max-width:88%}
.msg b{display:block;font-size:12px;color:var(--champ)}
.msg.me{align-self:flex-end;background:#2a2519}
.send{display:flex;gap:8px}
.send input{flex:1;height:48px;border:0;border-radius:14px;background:#0a0a0b;color:var(--text);padding:0 14px;font:inherit;box-shadow:inset 0 2px 8px rgba(0,0,0,.8);min-width:0}

/* modals */
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(6px);z-index:50;display:grid;place-items:center;padding:16px}
.modal{width:min(560px,100%);max-height:calc(100% - 20px);overflow:auto;padding:28px;display:flex;flex-direction:column;gap:18px}
.modal.center{text-align:center;align-items:center}
.mhead{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%}
.copyline{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--ink);border-radius:14px;padding:12px 12px 12px 16px;box-shadow:inset 0 2px 8px rgba(0,0,0,.7)}
.copyline code{font-family:var(--body);font-weight:800;font-size:18px;color:var(--champ);user-select:all;overflow-wrap:anywhere}
.steps{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;counter-reset:s}
.steps li{display:flex;gap:12px;line-height:1.45;counter-increment:s}
.steps li::before{content:counter(s);flex:none;width:26px;height:26px;border-radius:50%;background:var(--lift);display:grid;place-items:center;font-weight:800;font-size:13px;color:var(--champ)}
.combos{display:flex;flex-direction:column;gap:6px}
.cmb{display:grid;grid-template-columns:28px 1fr auto;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--ink)}
.cmb .n{font-family:var(--display);font-size:22px;color:var(--champ-d);text-align:center}
.cmb .tt{font-weight:800}.cmb .dd{font-size:12px;color:var(--muted)}
.cmb .cc{display:flex;gap:3px}
.rules h3{font-family:var(--display);font-size:22px;font-weight:600;margin:6px 0 0;color:var(--champ)}
.rules p{margin:0;line-height:1.55;color:#cfcac0}
.picklist{display:flex;flex-direction:column;gap:8px}
.pick{display:flex;align-items:center;gap:12px;background:var(--ink);border-radius:14px;padding:10px 12px;text-align:left;width:100%}
.pick:hover{background:#151517}
.pick .grow{flex:1;min-width:0}.pick .grow span{display:block;font-size:12px;color:var(--muted)}
.trophy{font-family:var(--display);font-size:64px;line-height:1;color:var(--champ)}

/* ADMIN */
.adm{display:flex;flex-direction:column;gap:20px}
.earn{padding:24px;display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center}
.earn .big{font-family:var(--display);font-size:64px;line-height:.9;font-weight:600;color:var(--champ)}
.earn .brk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.earn .brk div{background:var(--ink);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.earn .brk b{font-size:18px}
.price{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.price input{width:76px;height:34px;border:0;border-radius:10px;background:#0c0c0e;color:var(--text);padding:0 10px;font:inherit;font-weight:700;box-shadow:inset 0 2px 6px rgba(0,0,0,.8)}
.stats{display:flex;gap:28px;flex-wrap:wrap;padding:18px 24px}
.stats div{display:flex;flex-direction:column;gap:2px}
.stats b{font-family:var(--display);font-size:32px;font-weight:600;line-height:1}
.agrid{display:grid;grid-template-columns:1fr 1.2fr;gap:20px}
.ablock{padding:22px;display:flex;flex-direction:column;gap:14px;min-width:0}
.ahead{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.req{display:flex;align-items:center;gap:10px;background:var(--ink);border-radius:14px;padding:10px 10px 10px 12px;flex-wrap:wrap}
.req .grow{flex:1;min-width:120px}.req .grow b{display:block}.req .grow span{font-size:12px;color:var(--muted)}
select.sel{height:38px;border:0;border-radius:12px;background:var(--lift);color:var(--text);padding:0 10px;font:inherit;font-size:14px;font-weight:600;box-shadow:var(--sh-btn);max-width:100%}
.tables{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.tcard{background:var(--ink);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:12px;min-width:0}
.tcard .top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.tcard .cnt{font-family:var(--display);font-size:30px;line-height:1;font-weight:600}
.tcard .cnt small{font-family:var(--body);font-size:13px;color:var(--muted);font-weight:600}
.mini{display:flex;flex-direction:column;gap:6px}
.mini div{display:flex;justify-content:space-between;align-items:center;font-size:13px;gap:8px}
.mini .x{color:var(--dim)}
.mini .x span:first-child{text-decoration:line-through}
.tnew{background:none;border-radius:16px;box-shadow:inset 0 0 0 2px rgba(214,185,127,.18);color:var(--champ);font-weight:800;min-height:160px;display:grid;place-items:center}
.search{height:42px;border:0;border-radius:12px;background:var(--ink);color:var(--text);padding:0 14px;font:inherit;box-shadow:inset 0 2px 6px rgba(0,0,0,.7);min-width:0;width:220px;max-width:100%}

.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%,30px);opacity:0;transition:.3s;z-index:60;
  background:var(--lift);padding:12px 18px;border-radius:14px;font-weight:700;box-shadow:var(--sh-out);max-width:calc(100% - 32px);text-align:center;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}

tr.semi td{background:#15140f}
.log{max-height:440px;overflow:auto;display:flex;flex-direction:column;gap:6px}
.le{display:grid;grid-template-columns:62px 58px minmax(0,1fr);gap:10px;align-items:start;background:var(--ink);border-radius:12px;padding:9px 12px;font-size:13px;line-height:1.45}
.le .tm{color:var(--muted);font-variant-numeric:tabular-nums}
.le summary{cursor:pointer;list-style:none}.le summary::-webkit-details-marker{display:none}
.le summary::after{content:" ▾";color:var(--champ)}
.le ul{margin:6px 0 0;padding-left:16px;color:var(--muted)}
.le.money .tx b{color:var(--champ)}.le.mod .tx b{color:#e49a8e}
.offline{font-size:11px;font-weight:700;color:#e49a8e}
/* winning combo */
.card.hit{box-shadow:0 0 0 2px var(--champ),0 0 22px -2px rgba(214,185,127,.7),0 8px 18px -8px rgba(0,0,0,.9);transform:translateY(-4px)}
.card.miss{filter:brightness(.38)}
.winbox{display:flex;align-items:center;gap:16px;flex-wrap:wrap;min-width:0}
.winbox .cc{display:flex;gap:6px}
.winbox .who{font-size:13px;color:var(--muted);font-weight:600}
.winbox .who b{color:var(--text);font-family:var(--body);font-size:15px;font-weight:800}
.winbox.mine .who b{color:var(--champ)}
.cbtn.on{background:linear-gradient(180deg,#3a3122,#211c13);color:var(--gold-hi)}
/* leaderboard */
.lb{display:flex;flex-direction:column;gap:8px}
.lbr{display:grid;grid-template-columns:44px minmax(0,1.2fr) 24px minmax(0,1fr);gap:14px;align-items:center;background:var(--ink);border-radius:18px;padding:10px 16px 10px 10px}
.lbr .pl{font-family:var(--display);font-size:34px;font-weight:700;text-align:center;color:var(--champ-d);line-height:1}
.lbr:nth-child(1) .pl{color:var(--gold-hi)}
.lbr:nth-child(1){background:linear-gradient(90deg,#241e13,var(--ink) 70%)}
.prize{display:flex;gap:12px;align-items:center;min-width:0}
.prize img{width:56px;height:56px;border-radius:14px;flex:none;box-shadow:0 8px 16px -8px rgba(0,0,0,.9)}
.prize b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prize span{font-size:12px;color:var(--muted)}
.prize a{color:var(--champ);text-decoration:none;font-weight:700}
.prize a:hover{text-decoration:underline}
.lbr .sep{height:2px;background:linear-gradient(90deg,transparent,var(--lift));border-radius:2px}
.winner{display:flex;gap:10px;align-items:center;min-width:0}
.winner b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.winner span{font-size:12px;color:var(--muted)}
.winner.pending{color:var(--dim);font-size:14px;font-weight:600}
.watchlist{display:flex;flex-direction:column;gap:8px}
/* guest + chat meta */
.guestbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:8px;padding:16px 20px}
.guests{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 14px;border-radius:14px;background:var(--coal);box-shadow:inset 0 2px 6px rgba(0,0,0,.7);font-weight:700;font-size:13px}
.guests span{color:var(--muted);font-weight:600}
.msg .meta{display:flex;align-items:center;gap:6px;margin-bottom:3px;font-size:11px;color:var(--muted)}
.msg .meta b{display:inline;font-size:12px;color:var(--champ)}
.msg .role{padding:1px 7px;border-radius:999px;background:var(--lift);font-weight:700}
.msg .role.guest{background:#1f2a2e;color:#9fc0cc}
.msg .time{margin-left:auto}
.ico.lock{opacity:.4}
.chathead{font-size:13px;color:var(--muted);margin-top:4px}
@media (max-width:640px){.lbr{grid-template-columns:34px minmax(0,1fr);row-gap:10px}.lbr .sep{display:none}.lbr .winner{grid-column:2}.lbr .pl{font-size:28px}}
@media (max-width:860px){
  .auth,.lobby,.agrid{grid-template-columns:1fr}
  .auth-hero{min-height:0}
  .earn{grid-template-columns:1fr}
  .earn .brk{grid-template-columns:1fr}
}
@media (max-width:640px){
  .ring{padding:78px 50px 96px}
  .rail{aspect-ratio:3/4.2}
  .felt{inset:12px}
  .pot b{font-size:36px}
  .board{gap:4px}
  .board .card{width:40px;height:56px;padding:4px 5px}
  .board .card .cr{font-size:17px}.board .card .cs{font-size:15px}
  .seat{width:86px}
  .seat .av{width:48px;height:48px;font-size:15px}
  .seat.turn .av::before{-webkit-mask:radial-gradient(circle,transparent 26px,#000 27px);mask:radial-gradient(circle,transparent 26px,#000 27px)}
  .s0{left:50%;top:calc(100% - 54px)}.s1{left:4%;top:70%}.s2{left:4%;top:30%}.s3{left:50%;top:54px}.s4{left:96%;top:30%}.s5{left:96%;top:70%}
  .hand{grid-template-columns:auto 1fr}
  .timer{grid-column:1/-1;display:flex;gap:10px;align-items:baseline;justify-content:center}
  .card.lg{width:76px;height:106px}.card.lg .cr{font-size:32px}.card.lg .cs{font-size:28px}
  .dock{gap:6px}
  .dock .btn{height:66px;font-size:15px;padding:0 8px}
  .tbar .tname{order:-1;width:100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---- fit-to-screen table ---- */
html,body{height:100%}
body{display:flex;flex-direction:column}
.proto{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;flex:none;width:100%;max-width:1200px}
.proto .brand{justify-self:start}
.hdr-r{justify-self:end;display:flex;gap:8px;align-items:center}
.hdr-r .btn{height:44px}
main.wrap{flex:1;min-height:0;overflow:auto;width:100%;max-width:1200px}
main.fit{overflow:hidden;display:flex;flex-direction:column}
#v-table{flex:1;min-height:0;display:flex;flex-direction:column;gap:8px;padding-block:0 10px}
.tbar{margin:0;flex:none}
.ring{flex:1;min-height:120px;padding:0;margin:0;container-type:size;display:grid;place-items:center}
.stage{position:relative;width:min(100cqw,200cqh);height:min(100cqh,50cqw)}
.rail{position:absolute;inset:13% 8% 15%;aspect-ratio:auto}
.felt{gap:min(14px,2cqh)}
.pot b{font-size:clamp(26px,7cqh,44px)}
.board{gap:min(8px,1.2cqw)}
.board .card{width:clamp(30px,10cqh,56px);height:auto;aspect-ratio:56/78;padding:clamp(3px,1cqh,6px) clamp(4px,1cqh,7px)}
.board .card .cr{font-size:clamp(14px,4.2cqh,24px)}.board .card .cs{font-size:clamp(12px,3.8cqh,22px)}
.seat{width:clamp(80px,14cqw,110px);gap:clamp(2px,.6cqh,5px)}
.seat .av{width:clamp(38px,10cqh,58px);height:clamp(38px,10cqh,58px);font-size:clamp(13px,3cqh,18px)}
.seat.turn .av::before{-webkit-mask:radial-gradient(circle closest-side,transparent calc(100% - 5px),#000 calc(100% - 4px));mask:radial-gradient(circle closest-side,transparent calc(100% - 5px),#000 calc(100% - 4px))}
.s0{left:50%;top:86%}.s1{left:7%;top:70%}.s2{left:15%;top:16%}.s3{left:50%;top:9%}.s4{left:85%;top:16%}.s5{left:93%;top:70%}
.bottom{position:relative;flex:none;display:flex;flex-direction:column;gap:10px}
.hand{margin:0;gap:14px}
.combo{padding:10px 16px}
.combo b{font-size:clamp(22px,3.2vh,30px)}
.card.lg{width:clamp(52px,9.5vh,88px);height:auto;aspect-ratio:92/128;padding:clamp(5px,1vh,10px) clamp(6px,1vh,11px)}
.card.lg .cr{font-size:clamp(20px,4vh,38px)}.card.lg .cs{font-size:clamp(18px,3.6vh,34px)}
.dock{margin:0}
.dock .btn{height:clamp(52px,7.5vh,68px)}
.bottom:has(#result:not([hidden])) .dock{visibility:hidden}
.bottom .result{position:absolute;left:0;right:0;bottom:0;z-index:4}
.result{margin:0;padding:12px 16px}
.raisebox{position:absolute;left:0;right:0;bottom:calc(100% + 8px);margin:0;z-index:5}
.demo{margin:0;flex:none}
.guestbar{margin:0;flex:none}
@media (max-width:640px){
  .proto{grid-template-columns:1fr auto;row-gap:10px}
  .proto .switch{grid-column:1/-1;grid-row:2;justify-self:center}
  .stage{width:min(100cqw,75cqh);height:min(100cqh,133cqw)}
  .rail{inset:11% 15% 13%}
  .street{font-size:10px;letter-spacing:.04em;text-align:center;max-width:70%}
  .rail{inset:13% 14% 14%}
  .s0{left:50%;top:89%}.s1{left:11%;top:68%}.s2{left:11%;top:33%}.s3{left:50%;top:12%}.s4{left:89%;top:32%}.s5{left:89%;top:68%}
  .seat{width:clamp(70px,24cqw,92px)}
  .seat .av{width:clamp(34px,7cqh,48px);height:clamp(34px,7cqh,48px)}
  .board .card{width:clamp(28px,11cqw,44px)}
  .board .card .cr{font-size:clamp(13px,4.4cqw,18px)}.board .card .cs{font-size:clamp(11px,4cqw,16px)}
  .tbar .tname{order:0;width:auto}
  .tbar .r .ico.txt{display:none}
  .hand{grid-template-columns:auto 1fr auto}
  .timer{grid-column:auto;display:block;font-size:28px}
  .combo .muted{display:none}
  .brand img{height:22px}
  .hdr-r .stack.big{font-size:15px;padding:6px 10px 6px 8px}
  .hdr-r .btn{height:38px;padding:0 12px;font-size:13px}
  .switch a{padding:7px 11px;font-size:12px}
  .switch small{display:none}
  .tbar{flex-wrap:nowrap;gap:6px}
  .tbar .l,.tbar .r{flex-wrap:nowrap;gap:6px}
  .tbar .tname small{display:none}
  .tbar .tname{font-size:13px;white-space:nowrap}
  .tbar .guests{display:none}
  .blinds{height:38px;padding:0 10px;font-size:12px}
  .blinds span:first-child{display:none}
  .ico{width:38px;height:38px;border-radius:12px}
  .ico svg{width:18px;height:18px}
  .tbar .l .ico{width:38px}
  .hand{gap:8px}
  .mycards{gap:6px}
  .card.lg{width:clamp(42px,7.5vh,60px)}
  .card.lg .cr{font-size:clamp(17px,3vh,24px)}.card.lg .cs{font-size:clamp(15px,2.6vh,20px)}
  .combo{padding:8px 10px;gap:2px}
  .combo .label{font-size:10px}
  .combo b{font-size:20px}
  .odds{font-size:11px;line-height:1.3}
  .timer{font-size:26px}
  .timer small{font-size:9px;letter-spacing:.06em}
  .dock{gap:6px}
  .dock .btn{height:56px;font-size:14px;padding:0 6px;border-radius:16px}
  .dock .btn small{display:none}
  .demo{flex-wrap:nowrap;overflow-x:auto;gap:12px;white-space:nowrap}
  #v-table{gap:6px}
  .proto{padding-block:10px}
  .seat .hole{right:-14px}
  .seat .hole .card.xs{width:20px;height:28px}
}
html:has(main.fit){overflow:hidden}

/* ===== v9 visual pass ===== */
:root{--btn:#2A2A31;--btn-h:#34343C;--prime:#EFCF8F;--prime-h:#F7DEAA;--felt-1:#1f4a37;--felt-2:#143326;--felt-3:#0b1d16}
.pi{width:1.15em;height:1.15em;flex:none;display:block}
.coin{width:18px;height:18px;background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjIiIHZpZXdCb3g9IjAgMCAyMiAyMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CjxnIGZpbHRlcj0idXJsKCNmaWx0ZXIwX2lpXzI5XzE1OTkpIj4KPHVzZSB4bGluazpocmVmPSIjc3Ryb2tlMF8yOV8xNTk5IiBmaWxsPSIjRDlEOUQ5Ii8+Cjx1c2UgeGxpbms6aHJlZj0iI3N0cm9rZTBfMjlfMTU5OSIgZmlsbD0idXJsKCNwYWludDBfbGluZWFyXzI5XzE1OTkpIi8+CjwvZz4KPGRlZnM+CjxmaWx0ZXIgaWQ9ImZpbHRlcjBfaWlfMjlfMTU5OSIgeD0iMCIgeT0iLTEiIHdpZHRoPSIyMiIgaGVpZ2h0PSIyNCIgZmlsdGVyVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPgo8ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIwIiByZXN1bHQ9IkJhY2tncm91bmRJbWFnZUZpeCIvPgo8ZmVCbGVuZCBtb2RlPSJub3JtYWwiIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJzaGFwZSIvPgo8ZmVDb2xvck1hdHJpeCBpbj0iU291cmNlQWxwaGEiIHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAxMjcgMCIgcmVzdWx0PSJoYXJkQWxwaGEiLz4KPGZlT2Zmc2V0IGR5PSIxIi8+CjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjAuNSIvPgo8ZmVDb21wb3NpdGUgaW4yPSJoYXJkQWxwaGEiIG9wZXJhdG9yPSJhcml0aG1ldGljIiBrMj0iLTEiIGszPSIxIi8+CjxmZUNvbG9yTWF0cml4IHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDEgMCAwIDAgMCAxIDAgMCAwIDAgMSAwIDAgMCAwLjI1IDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9InNoYXBlIiByZXN1bHQ9ImVmZmVjdDFfaW5uZXJTaGFkb3dfMjlfMTU5OSIvPgo8ZmVDb2xvck1hdHJpeCBpbj0iU291cmNlQWxwaGEiIHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAxMjcgMCIgcmVzdWx0PSJoYXJkQWxwaGEiLz4KPGZlT2Zmc2V0IGR5PSItMSIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIwLjUiLz4KPGZlQ29tcG9zaXRlIGluMj0iaGFyZEFscGhhIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazI9Ii0xIiBrMz0iMSIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwLjY5NTk0MyAwIDAgMCAwIDAuMjIyMzg1IDAgMCAwIDAgMC4wMTk0MzEgMCAwIDAgMC4zMiAwIi8+CjxmZUJsZW5kIG1vZGU9Im5vcm1hbCIgaW4yPSJlZmZlY3QxX2lubmVyU2hhZG93XzI5XzE1OTkiIHJlc3VsdD0iZWZmZWN0Ml9pbm5lclNoYWRvd18yOV8xNTk5Ii8+CjwvZmlsdGVyPgo8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MF9saW5lYXJfMjlfMTU5OSIgeDE9IjExLjA1MjQiIHkxPSItNC45NTUyNyIgeDI9IjExLjA1MjQiIHkyPSIyNi43MzEyIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkM1MjQiLz4KPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjRkY5MzM0Ii8+CjwvbGluZWFyR3JhZGllbnQ+CjxwYXRoIGlkPSJzdHJva2UwXzI5XzE1OTkiIGQ9Ik0xMS4wMDAzIDBDMTcuMDc1MyAwLjAwMDE0NzI0OCAyMiA0LjkyNDcgMjIgMTAuOTk5N0MyMiAxNy4wNzQ4IDE3LjA3NTMgMjEuOTk5OSAxMS4wMDAzIDIyQzQuOTI1MTQgMjIgMCAxNy4wNzQ5IDAgMTAuOTk5N0MxLjg0MDZlLTA1IDQuOTI0NjEgNC45MjUxNSAwIDExLjAwMDMgMFpNMTAuOTg3NyAzLjgzNjIzQzEwLjI2NDUgNi40MzA1NyA4LjU1MTk3IDguNjM3MzMgNi4yMTg2MSA5Ljk4MTI3QzUuNTg4MzUgMTAuMzQzNCA0LjUyMzczIDEwLjgxOSAzLjgwMDgxIDEwLjk0NjNDNi44MTQwNCAxMS45NjE3IDguNzYwMDkgMTMuMzgwNyAxMC4yODk3IDE2LjI5MzFDMTAuNjg3NiAxNy4wNTA2IDEwLjc1ODUgMTcuNTEwNyAxMS4wMzI0IDE4LjE2MzJDMTIuMTg4NCAxNC4zNzg3IDE0LjQ2MDcgMTIuMTc1IDE4LjE5OTIgMTAuOTQ5QzE1LjAyMTMgMTAuMDY2NCAxMi41MTA1IDcuODU1OTggMTEuMzY3NSA0Ljc2NTg2QzExLjMwNTEgNC41OTcgMTEuMDcxMyAzLjkxNTM1IDEwLjk4NzcgMy44MzYyM1oiIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIi8+CjwvZGVmcz4KPC9zdmc+Cg==") center/contain no-repeat;box-shadow:none;border-radius:0}
.brand svg{display:block;height:28px;width:auto}
/* buttons: one flat family, primary brighter */
.btn,.ico{background:var(--btn);box-shadow:none;border-radius:14px;transition:background .15s,transform .12s,filter .15s}
.btn:hover,.ico:hover{background:var(--btn-h);filter:none}
.btn.gold,.btn.cbtn.on{background:var(--prime);color:#1b1608}
.btn.gold:hover{background:var(--prime-h)}
.btn.red{background:var(--btn);color:#FF8B78}
.btn.red:hover{background:#3a2a2a}
.btn.ghost{background:none}
.ico.on{color:var(--prime)}
.btn .pi{width:20px;height:20px}
/* nav */
.switch{background:var(--coal);box-shadow:none;padding:5px}
.switch a{font-size:14px;font-weight:600;color:var(--muted);padding:9px 16px}
.switch a:hover{color:var(--text)}
.switch a.on{background:var(--prime);color:#1b1608;box-shadow:none}
/* balance pill */
.balpill{display:flex;align-items:center;gap:10px;height:48px;padding:0 5px 0 14px;border-radius:999px;background:var(--coal)}
.balpill .coin{width:22px;height:22px}
.balpill b{font-size:19px;font-weight:700;color:var(--gold-hi);margin-right:4px}
.topup{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 16px 0 12px;border-radius:999px;background:#fff;color:#111;font-weight:700;font-size:14px}
.topup:hover{background:#ece8df}
.topup .pi{width:16px;height:16px}
/* table bar */
.blinds{height:48px;padding:0 18px;font-size:16px;gap:10px;background:var(--coal);box-shadow:none;border-radius:14px}
.blinds b{font-size:17px}
.bl-next{display:inline-flex;align-items:center;gap:5px;color:var(--muted)}
.bl-next .pi{width:16px;height:16px}
.guests{height:48px;padding:0 16px;gap:8px;background:var(--coal);box-shadow:none;font-size:14px}
.guests .pi{width:18px;height:18px;color:var(--muted)}
.ico{width:48px;height:48px}
.ico .pi,.ico svg{width:22px;height:22px}
/* felt */
.rail{background:linear-gradient(180deg,#2a2c2b,#141615 70%);box-shadow:0 40px 80px -30px rgba(0,0,0,1)}
.felt{background:radial-gradient(ellipse 70% 62% at 50% 42%,var(--felt-1) 0%,var(--felt-2) 55%,var(--felt-3) 100%);box-shadow:none;gap:clamp(10px,3.2cqh,22px)}
.felt::before{box-shadow:0 0 0 1px rgba(239,207,143,.10)}
.pot{gap:0;margin-top:-2cqh}
.pot .label{font-size:11px;margin-bottom:-2px}
.pot b{font-weight:700}
.card.slot{background:rgba(255,255,255,.06);box-shadow:none}
.board .card{width:clamp(36px,13cqh,74px)}
.board .card .cr{font-size:clamp(16px,5.2cqh,30px)}.board .card .cs{font-size:clamp(14px,4.6cqh,26px)}
.card .cr{font-weight:700;letter-spacing:-.02em}
/* seats */
.seat .av{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.nm{font-size:15px;font-weight:600}
.seat .stack{font-size:15px;padding:5px 12px 5px 8px}
.seat .stack .coin{width:18px;height:18px}
.betpill{font-size:13px;color:var(--muted)}
.betpill b{font-size:14px;color:var(--prime)}
/* hand plate */
.hand{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:24px;background:var(--coal);border-radius:22px;padding:18px 26px;height:clamp(118px,17vh,168px)}
.hand .combo{background:none;box-shadow:none;padding:0;min-width:0}
.combo b{font-size:clamp(22px,3.4vh,30px);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.odds{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:1.3em}
.turnbox{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:150px;text-align:right}
.tclock{font-size:clamp(30px,5vh,44px);font-weight:700;line-height:1;color:var(--muted)}
.turnbox.mine .tclock{color:var(--prime)}
.tlbl{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.turnbox.mine .tlbl{color:var(--prime)}
.tnick{font-size:19px;font-weight:700;color:var(--text);max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tnick:empty{display:none}
@media (max-width:640px){
  .brand svg{height:22px}
  .balpill{height:40px;gap:6px;padding-left:10px}
  .balpill b{font-size:15px}
  .topup{height:32px;padding:0 10px;font-size:12px}
  .switch a{padding:7px 11px;font-size:12px}
  .blinds{height:40px;font-size:13px;padding:0 12px}.blinds b{font-size:14px}
  .bl-next{display:none}
  .ico{width:40px;height:40px}
  .tbar .guests{display:inline-flex;height:40px;padding:0 10px}.guests>span{display:none}
  .hand{gap:12px;padding:12px 14px;height:clamp(96px,14vh,120px);border-radius:18px}
  .turnbox{min-width:0}
  .tclock{font-size:26px}.tlbl{font-size:9px;letter-spacing:.04em}.tnick{font-size:14px;max-width:90px}
  .nm{font-size:13px}.seat .stack{font-size:13px;padding:4px 9px 4px 6px}
  .board .card{width:clamp(30px,12cqw,52px)}
  .hand .combo .label{font-size:9px}
  .combo b{font-size:16px;white-space:normal;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .odds{font-size:10px}
  .hand .card.lg{width:44px}
}

/* ===== v10 ===== */
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}}
@keyframes fadeIn{from{opacity:0}}
@keyframes popIn{from{opacity:0;transform:translateY(8px) scale(.97)}}
.scrim:not([hidden]){animation:fadeIn .2s ease-out}
.scrim:not([hidden]) .modal{animation:popIn .28s cubic-bezier(.2,.8,.2,1)}
.result:not([hidden]),.guestbar:not([hidden]),.raisebox:not([hidden]){animation:fadeUp .3s cubic-bezier(.2,.8,.2,1)}
.view:not([hidden]){animation:fadeIn .25s ease-out}
.btn,.ico,.topup,.switch a{transition:background .18s,color .18s,transform .12s,opacity .2s}
.card.deal{animation:deal .45s cubic-bezier(.2,.8,.2,1) both}
.seat{transition:opacity .35s}
.seat .av{transition:box-shadow .3s}
/* nav */
.switch{background:rgba(255,255,255,.08)}
.balpill{background:rgba(255,255,255,.1)}
/* tbar */
.tbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding-top:6px}
.tbar .l{justify-self:start}.tbar .r{justify-self:end}
.tname{grid-column:2;text-align:center;font-size:20px;font-weight:600;line-height:1.2}
.tname small{display:block;font-size:18px;font-weight:400;color:var(--muted)}
.blinds,.guests{font-size:16px;font-weight:500;color:var(--muted)}
.blinds b,.guests b{font-size:16px;font-weight:600;color:var(--text)}
.bl-next{font-size:16px}
.guests>span{font-size:16px}
.badge{top:-5px;right:-5px}
#v-table{padding-inline:6px}
/* seats */
.seat{gap:4px}
.avw{position:relative;display:flex;justify-content:center;margin-bottom:10px}
.seat .av::before{display:none!important}
.seat.speak .av::after{display:none}
.seat.turn .av{box-shadow:0 0 0 3px var(--prime),0 0 22px rgba(239,207,143,.5)}
.st{position:absolute;left:50%;bottom:-11px;transform:translateX(-50%);font-size:12.5px;font-weight:500;padding:3px 10px;z-index:2;max-width:none;background:#2c2c33;box-shadow:0 4px 10px -4px rgba(0,0,0,.8)}
.st.pop{animation:stPop .3s cubic-bezier(.2,.8,.2,1)}
@keyframes stPop{from{opacity:0;transform:translate(-50%,5px) scale(.9)}}
.reveal{position:absolute;left:50%;bottom:calc(100% + 4px);transform:translateX(-50%);display:flex;gap:3px;z-index:3}
.reveal:empty{display:none}
.reveal .card{animation:popIn .3s ease-out}
.nm{width:100%;text-align:center}
.betpill{visibility:hidden}.betpill.on{visibility:visible}
.dealer{left:-4px;bottom:auto;top:-2px}
/* felt */
.felt{padding-bottom:9%}
.feltmsg{display:none;flex-direction:column;align-items:center;gap:10px;text-align:center;max-width:70%;animation:fadeUp .4s}
.feltmsg b{font-size:clamp(20px,5cqh,30px);font-weight:600}
.feltmsg p{margin:0;color:#c9d6cf;line-height:1.5;font-size:15px}
.ended .feltmsg{display:flex}
.ended .pot,.ended .board,.ended #seats,.ended .bottom,.ended .guestbar{display:none!important}
/* hand */
.mycards .card:first-child,.mycards .card+.card{transform:none}
.combo b{font-weight:400}
/* bottom stability */
.bottom .result{min-height:clamp(52px,7.5vh,68px)}
/* modals */
.mclose{position:absolute;top:14px;right:14px}
.modal{position:relative}
.modal .ico[data-close],.mhead .ico{width:36px;height:36px;border-radius:12px}
.modal .ico[data-close] .pi,.mhead .ico .pi{width:16px;height:16px}
.mtext{margin:0;font-size:16px;line-height:1.55;color:#d8d3c9}
.trophy .pi{width:56px;height:56px;color:var(--prime)}
.seatcard{display:flex;flex-direction:column;gap:4px;background:rgba(255,255,255,.06);border-radius:16px;padding:12px 18px}
.warn{display:flex;gap:10px;align-items:flex-start;background:rgba(239,190,80,.12);color:#f3d48a;border-radius:14px;padding:12px 14px;font-size:14px;line-height:1.45}
.warn .pi{width:20px;height:20px;flex:none;color:#f0c35c;margin-top:1px}
.copyline code{color:var(--prime)}
/* chat */
.msg .role{background:rgba(239,207,143,.18);color:var(--prime)}
.msg .role.guest{background:rgba(120,180,230,.2);color:#a8d4ff}
.msg{white-space:pre-wrap;overflow-wrap:anywhere}
.send{align-items:flex-end}
.send textarea{flex:1;min-width:0;resize:none;border:0;border-radius:14px;background:#0a0a0b;color:var(--text);padding:12px 14px;font:inherit;line-height:22px;height:46px;max-height:130px;overflow-y:hidden}
.sendbtn{width:46px;height:46px;padding:0}
.sendbtn .pi{width:20px;height:20px}
#chatClose{width:36px;height:36px}
#chatClose .pi{width:16px;height:16px}
@media (max-width:640px){
  .tbar{gap:6px}
  .tname{font-size:15px}.tname small{font-size:12px}
  .blinds,.guests,.blinds b,.guests b{font-size:13px}
}
a.btn{color:var(--text)}a.btn.gold{color:#1b1608}
.send textarea:focus-visible{outline:none;box-shadow:0 0 0 1.5px rgba(239,207,143,.55)}
.tbar{margin-bottom:6px}
.ring{padding-top:40px;padding-bottom:6px}
@media (max-width:640px){.ring{padding-top:24px}}
.rail{inset:17% 8% 14%}
.s3{top:10%}.s2,.s4{top:19%}.s1,.s5{top:71%}.s0{top:86%}
.felt{padding-bottom:7%}
@media (max-width:640px){.rail{inset:14% 14% 14%}.s3{top:10%}.s2,.s4{top:33%}.s1,.s5{top:68%}.s0{top:89%}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===== v11: unified surfaces ===== */
:root{--surface:#141417;--plate:#1e1e23;--btn:#2a2a30;--btn-h:#35353c}
.panel{background:var(--surface);box-shadow:none}
.switch,.balpill,.blinds,.guests,.hand,.seatinfo,.req,.tcard,.bt,.cmb,.copyline,.le,.wt,.lbr,td{background:var(--plate)!important;box-shadow:none}
.field input,.search,.inp,.send textarea,select.sel{background:var(--plate);box-shadow:none}
.btn,.ico{background:var(--btn)}
.btn:hover,.ico:hover{background:var(--btn-h)}
.btn.gold{background:var(--prime)}.btn.gold:hover{background:var(--prime-h)}
.btn.red{background:var(--btn)}
.stack,.stack.big{background:var(--plate);box-shadow:none;color:var(--gold-hi)}
.seat .stack{background:var(--btn)}
.stack.zero{color:var(--dim)}
.st{background:var(--btn)}
.tag{background:rgba(255,255,255,.08)}
.result,.guestbar{background:var(--plate)}
.h2{font-size:22px;font-weight:600}
#lobbyNick{font-size:26px}
/* lobby */
.balrow{align-items:center}
.balrow .btn{height:48px}
.prize{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:14px;align-items:center}
.prize .ton{display:block;font-size:17px;font-weight:600;color:var(--prime);margin-top:2px}
.prize b{font-weight:600}
.lbr.p1{background:linear-gradient(90deg,#3b2f17,var(--plate) 72%)!important}
.lbr.p2{background:linear-gradient(90deg,#2e3136,var(--plate) 72%)!important}
.lbr.p3{background:linear-gradient(90deg,#33231a,var(--plate) 72%)!important}
.lbr .pl{font-family:var(--body)}
.lbr.p1 .pl{color:#f1cf7f}.lbr.p2 .pl{color:#d3d8de}.lbr.p3 .pl{color:#d39a6a}
.lbr.p2 .prize .ton{color:#dfe3e8}.lbr.p3 .prize .ton{color:#e0a676}
.wt{border-radius:16px;padding:14px 16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;align-items:center}
.wt-h{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.wt-h b{font-size:17px}
.wt-s{grid-column:1;font-size:15px;color:var(--muted)}.wt-s b{color:var(--text);font-weight:600}
.wt .names{grid-column:1;font-size:14px;color:#cfcac0}
.wt .names .isme{color:#9fe0b4;font-weight:600}
.wt .btn{grid-column:2;grid-row:1/span 3}
.wt.mine{box-shadow:inset 0 0 0 1.5px rgba(106,190,130,.55)!important;background:linear-gradient(90deg,rgba(80,170,110,.16),var(--plate) 70%)!important}
.wt.done{opacity:.45}
.tag.live{background:rgba(106,190,130,.16);color:#a6e0b8}
/* bracket */
.t-bracket td{background:#18181c!important}
.t-bracket tr.semi td{background:#1a1916!important}
.t-bracket tr.final td{background:#1d1a14!important}
.t-bracket .tag{font-size:14px;padding:6px 12px;font-weight:600}
.t-bracket .tag.gold{background:rgba(239,207,143,.1);color:#f3d79c}
.t-bracket .tag.live{background:rgba(106,190,130,.1);color:#b4ebc4}
.t-bracket .names{font-size:14px}
.t-bracket .names .w{color:#f3d79c}
/* compact result row in dock slot */
.bottom .result{height:clamp(52px,7.5vh,68px);min-height:0;padding:0 10px 0 20px;display:flex;align-items:center;gap:16px;flex-wrap:nowrap}
.bottom .result>div:first-child{flex-direction:row!important;align-items:center;gap:16px!important;min-width:0;flex:1}
.bottom .result #resNext{display:none}
.bottom .result #resText{font-size:clamp(16px,2.4vh,22px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.bottom .result .winbox{flex-wrap:nowrap;flex:none}
.bottom .result .winbox .who{display:none}
.bottom .result .row{flex-wrap:nowrap;flex:none}
.bottom .result .btn{height:calc(100% - 14px);min-height:40px}
.s3 .reveal{bottom:auto;top:50%;left:calc(100% + 8px);transform:translateY(-50%)}
@media (max-width:640px){.bottom .result{padding:0 6px 0 12px;gap:8px}.bottom .result .winbox{display:none!important}.bottom .result #showCards{padding:0 10px;font-size:0}.bottom .result #showCards .pi{font-size:16px;width:20px;height:20px}}
/* hand out state */
#reBtn{align-self:flex-start;margin-top:6px}
.hand.isout #myCombo{color:var(--muted)}
.hand.isout .odds{color:var(--muted)}
.combo{display:flex;flex-direction:column;gap:2px}

/* ===== v12 ===== */
a.blinds{text-decoration:none;color:var(--muted)}
.btn.white{background:#fff;color:#111}.btn.white:hover{background:#ece8df}
.seatinfo{gap:14px}
.lobby .me>.btn.white{align-self:flex-start}
.side{display:flex;flex-direction:column}
#sndBtn.off{color:var(--muted)}
.turnbox.low .tclock{color:#ff6b5b!important}
.turnbox.low .tlbl{color:#ff8b7d!important}
.hand.isout .odds,.waiting .odds{font-weight:400}
.odds{font-weight:500}
/* bracket */
.stg{font-weight:700;font-size:15px;white-space:nowrap}
.stg.q{color:#cfcac0}.stg.sf{color:#8fc3ff}.stg.fn{color:#ffd26b}
.t-bracket tr.semi td{background:rgba(70,130,220,.08)!important}
.t-bracket tr.final td{background:rgba(255,200,80,.08)!important}
.t-bracket .tag{font-weight:500}
.t-bracket .names{font-weight:400}
.t-bracket .names .w{font-weight:500}
.adv{display:block;margin-top:6px;font-size:14px;color:var(--muted)}
/* waiting / ended felt */
.waiting .pot,.waiting .board{display:none!important}
.waiting .feltmsg,.ended .feltmsg{display:flex}
.waiting .felt,.ended .felt{padding-bottom:0}
.feltmsg{max-width:78%}
.feltmsg .copyline{background:rgba(0,0,0,.35)!important}
.seat.ph .av{background:rgba(255,255,255,.05);color:var(--dim);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.14);border:0}
.seat.ph .stack,.seat.ph .betpill{visibility:hidden}
.seat.ph .nm{color:var(--muted);font-weight:400;font-size:13px}
/* modal buttons equal width */
.modal .row{width:100%}
.modal .row>.btn,.modal .row>span>.btn{flex:1}
.modal .row>span{flex:1;display:flex}
/* rules page */
.rp{display:flex;flex-direction:column;gap:20px;padding-block:8px 40px}
.rp-head{display:flex;flex-direction:column;gap:8px}
.rp-head p{margin:0;font-size:16px}
.rp-sec{padding:26px 28px;display:flex;flex-direction:column;gap:12px}
.rp-sec p{margin:0;line-height:1.6;color:#d5d0c6;max-width:72ch}
.rp-sec .h2{margin-top:8px}.rp-sec .h2:first-child{margin-top:0}
.gls{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.gl{background:var(--plate);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}
.gl b{color:var(--prime);font-weight:600}.gl span{color:#cfcac0;font-size:14px;line-height:1.5}
.rcombos{display:flex;flex-direction:column;gap:8px}
.rc{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:16px;align-items:center;background:var(--plate);border-radius:16px;padding:12px 16px}
.rc .n{font-size:20px;font-weight:600;color:var(--champ-d);text-align:center}
.rc-t{display:flex;flex-direction:column;gap:2px}.rc-t b{font-size:17px;font-weight:600}.rc-t span{font-size:14px;color:var(--muted)}
.rc .cc{display:flex;gap:6px}
.card.md{width:46px;height:64px;border-radius:8px;padding:5px 6px}
.card.md .cr{font-size:20px}.card.md .cs{font-size:18px}
.rp{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:start}
.rp-head,.rp>.rp-sec:last-child{grid-column:1/-1}
.rp-head .h1{font-size:40px}
.rp .gls{grid-template-columns:1fr}
.rcombos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:960px){.rp{grid-template-columns:1fr}.rcombos{grid-template-columns:1fr}}
@media (max-width:640px){.rc{grid-template-columns:24px minmax(0,1fr);}.rc .cc{grid-column:1/-1}.card.md{width:40px;height:56px}.rp-sec{padding:20px}}

/* ===== v13 admin ===== */
.adm .label,.stats .label,.earn .label{font-weight:500;letter-spacing:.08em}
.stats{gap:36px}
.stats div{gap:10px}
.stats .label{font-size:10.5px}
.stats b{font-weight:600}
.earn{grid-template-columns:auto 1fr;align-items:stretch}
.earn-l{display:flex;flex-direction:column;gap:8px}
.earn .big{font-size:56px;font-weight:600;margin-top:4px;white-space:nowrap}
.earn-net{font-size:15px;color:var(--muted);margin-top:6px}.earn-net b{color:var(--text);font-weight:600}
.earn-fee{font-size:13px;color:var(--muted)}
.earn-fee input{width:52px;height:28px;border:0;border-radius:8px;background:var(--plate);color:var(--text);padding:0 8px;font:inherit;margin:0 2px}
.earn .brk b{font-weight:600}
.pausebar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:var(--plate);border-radius:18px;padding:14px 18px}
.pausebar b{display:block;font-size:16px;font-weight:600}.pausebar span{font-size:14px;color:var(--muted)}
.pausebar.on{background:rgba(255,120,90,.14);box-shadow:inset 0 0 0 1.5px rgba(255,120,90,.45)}
.pausebar.on b{color:#ffb4a2}
.lst{display:flex;flex-direction:column;gap:8px}
.req .grow b{font-size:16px;font-weight:600;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.req .grow span{font-size:14px}
.req .tag{font-weight:500}
.warnt{font-style:normal;color:#ffb07a}
.ico.sm{width:38px;height:38px;border-radius:12px}.ico.sm .pi{width:18px;height:18px}
.tag.bad{background:rgba(255,110,90,.14);color:#ffab9b}
.tg{color:#8fc3ff;text-decoration:none;font-size:13px}.tg:hover{text-decoration:underline}
.who-t{display:flex;flex-direction:column;gap:1px}
.t-players{min-width:1040px}
.t-players th,.t-bracket th{font-weight:500}
.tcard.done{opacity:.5}
.stages{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.tcard.stgcard.sf{box-shadow:inset 0 0 0 1.5px rgba(143,195,255,.3)!important}
.tcard.stgcard.fin{box-shadow:inset 0 0 0 1.5px rgba(255,210,107,.35)!important}
.tcard.stgcard .mini>div{align-items:center;min-height:38px}
.tcard.stgcard .mini .x2{color:var(--muted)}
.tcard.stgcard .acts{display:flex;gap:6px}
.chk{display:flex;gap:10px;align-items:center;font-size:14px;color:#d5d0c6}
.chk input{width:18px;height:18px;accent-color:var(--prime)}
.field textarea{border:0;border-radius:14px;background:var(--plate);color:var(--text);padding:12px 14px;font:inherit;resize:vertical;min-height:90px}
.btn.red.solid{background:#c9473a;color:#fff}.btn.red.solid:hover{background:#d65446}
#reqs{max-height:min(700px,calc(10 * 70px));overflow-y:auto;padding-right:4px;scrollbar-gutter:stable}
#wait .req{flex-wrap:nowrap}#wait .sel{max-width:230px;min-width:0}
.earn .big .star{font-size:.42em;margin-left:8px;vertical-align:.45em}
.price input{background:rgba(0,0,0,.3)!important}
.ico.danger{color:#ff8b78}.ico.danger:hover{background:#3a2a2a}
#msgIn:disabled{opacity:.6;cursor:not-allowed}
/* pause overlay on table */
.pausemsg{display:none;position:absolute;inset:0;z-index:20;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;background:rgba(9,9,10,.72);backdrop-filter:blur(3px);border-radius:24px;animation:fadeIn .3s}
.pausemsg b{font-size:26px;font-weight:600}.pausemsg p{margin:0;color:#cfcac0}
.paused .pausemsg{display:flex}
.ring{position:relative}

/* ===== v14 ===== */
.seat .av{width:clamp(46px,12cqh,70px);height:clamp(46px,12cqh,70px);font-size:clamp(15px,3.4cqh,21px)}
.st{font-size:14px;padding:4px 12px;bottom:-13px}
.avw{margin-bottom:14px}
.combo-l{display:flex;align-items:center;gap:10px}
.placepill{letter-spacing:0;text-transform:none;font-size:13px;font-weight:600;color:var(--text);background:var(--btn);padding:3px 10px;border-radius:999px}
.placepill.top{background:rgba(239,207,143,.18);color:var(--prime)}
.plimg img{width:96px;height:96px;border-radius:22px;box-shadow:0 14px 30px -12px rgba(0,0,0,.9)}
.bltab{display:flex;flex-direction:column;gap:8px}
.bltab div{background:var(--plate);border-radius:14px;padding:10px 14px;display:flex;gap:14px;flex-wrap:wrap}
.bltab b{min-width:96px;font-weight:600;color:var(--prime)}.bltab span{color:#d5d0c6;font-size:14px}
@media (max-width:640px){.seat .av{width:clamp(38px,8cqh,54px);height:clamp(38px,8cqh,54px)}.st{font-size:12px;padding:3px 9px}}

/* ===== v15 ===== */
.eq{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.price input{width:64px!important}
.ltag{display:inline-block;width:72px;text-align:center;padding-inline:0}
.le{grid-template-columns:62px 72px minmax(0,1fr)}
.modal.wide{width:min(1100px,100%);max-height:calc(100% - 20px)}
.rtabs{display:flex;gap:6px;flex-wrap:wrap}
.report{overflow:auto;max-height:55vh;background:var(--plate);border-radius:14px;padding:14px}
.report table{width:100%;border-collapse:collapse;font-size:13px}
.report th,.report td{text-align:left;padding:7px 9px;border-bottom:1px solid rgba(255,255,255,.07);background:none!important;border-radius:0!important;vertical-align:top}
.report th{color:var(--muted);font-weight:500;font-size:12px}
.report h3{font-size:15px;font-weight:600;margin:14px 0 6px;color:var(--prime)}
.report small{color:var(--muted)}
.mutegrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.msg{position:relative}
.msg{white-space:normal!important}
.msg .mt{white-space:pre-wrap}
.mhead .row>.btn{flex:none!important}
.mhead .row{width:auto!important}
.msg.del .mt{font-style:italic;color:var(--muted)}
.msg.sys{align-self:center;background:none;color:var(--muted);font-size:12.5px;padding:2px 8px;text-align:center}
.msg .quote{border-left:2px solid var(--prime);padding:3px 8px;margin:4px 0 6px;background:rgba(255,255,255,.05);border-radius:0 8px 8px 0;font-size:12.5px;color:#cfcac0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg .quote b{display:block;color:var(--prime);font-size:11.5px}
.mact{position:absolute;top:6px;right:6px;display:flex;gap:2px;opacity:0;transition:opacity .15s;background:var(--raise);border-radius:8px;padding:2px}
.msg:hover .mact,.msg:focus-within .mact{opacity:1}
@media (hover:none){.mact{opacity:.8}}
.mbtn{width:26px;height:26px;border-radius:7px;display:grid;place-items:center;color:var(--muted)}
.mbtn:hover{background:var(--btn);color:var(--text)}
.mbtn.adm:hover{color:#ff8b78}
.mbtn .pi{width:15px;height:15px}
.msg .role.muted{background:rgba(255,110,90,.16);color:#ffab9b}
.replybar{display:flex;align-items:center;gap:8px;background:var(--plate);border-left:2px solid var(--prime);border-radius:0 12px 12px 0;padding:8px 8px 8px 12px;margin-bottom:8px;font-size:13px}
.replybar>div{flex:1;min-width:0;display:flex;flex-direction:column}
.replybar b{color:var(--prime);font-size:12px}.replybar span{color:#cfcac0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== v16 registration ===== */
body.public .proto .switch,body.public #hdrBal{display:none!important}
body.public .proto{grid-template-columns:1fr auto}
.lg{display:flex;flex-direction:column;gap:20px;padding-block:8px 48px}
.lg-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:stretch}
.lg-art{border-radius:24px;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#1f4a37,#0e1c16 70%);min-height:520px;display:flex}
.lg-art img.full{width:100%;height:100%;object-fit:cover}
.lg-art-ph{flex:1;display:flex;flex-direction:column;gap:18px;padding:28px;justify-content:center}
.lg-gifts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.lgg{background:rgba(0,0,0,.28);border-radius:18px;padding:14px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.lgg img{width:72px;height:72px;border-radius:16px}
.lgg b{font-size:13px;color:var(--prime);font-weight:600}.lgg span{font-size:13px;color:#d5d0c6}
.lg-form{padding:30px;display:flex;flex-direction:column;gap:16px}
.lg-form .h1{font-size:36px}
.lg-when{display:flex;align-items:center;gap:8px;margin:10px 0 0;color:var(--muted);font-size:15px}
.lg-when .pi{width:18px;height:18px;color:var(--prime)}.lg-when b{color:var(--text);font-weight:600}
.pw{position:relative;display:flex}
.pw input{flex:1;padding-right:48px!important}
.pw .mbtn{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:32px;height:32px}
.field input.bad{box-shadow:inset 0 0 0 1.5px #ff7a66!important}
.ferr{background:rgba(255,110,90,.12);color:#ffb4a5;border-radius:12px;padding:10px 14px;font-size:14px}
.btn.big{height:56px;font-size:17px}
.regok{display:flex;flex-direction:column;gap:10px;background:rgba(106,190,130,.1);border-radius:16px;padding:16px}
.regok b{color:#a6e0b8;font-weight:600}.regok p{margin:0;color:#d5d0c6;line-height:1.5;font-size:14px}
.lg-demo{margin-top:auto}
.lg-info{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.lg-warn{flex:1;min-width:280px;display:flex;gap:12px;align-items:flex-start;background:rgba(239,190,80,.12);color:#f3d48a;border-radius:16px;padding:14px 18px;font-size:15px;line-height:1.5}
.lg-warn .pi{width:22px;height:22px;flex:none;color:#f0c35c}
.lg-warn b{color:#ffe3a3;font-weight:600}
.lg-info .btn{height:56px}
.lg-how{padding:24px 28px;display:flex;flex-direction:column;gap:14px}
.lg-how .steps li{font-size:15px}
.lg .rp{padding-block:0}
@media (max-width:860px){.lg-hero{grid-template-columns:1fr}.lg-art{min-height:320px;order:2}.lg-gifts{grid-template-columns:repeat(2,minmax(0,1fr))}}
.more{position:relative;display:inline-flex}
.more .menu{position:absolute;right:0;top:calc(100% + 6px);z-index:30;background:#202026;border-radius:14px;padding:6px;min-width:220px;box-shadow:0 18px 40px -12px rgba(0,0,0,.9);display:flex;flex-direction:column}
.more .menu[hidden]{display:none!important}
.more .menu button,.more .menu a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:var(--text);text-decoration:none;font-size:14px;text-align:left;width:100%}
.more .menu button:hover,.more .menu a:hover{background:var(--btn)}
.more .menu .pi{width:18px;height:18px;color:var(--muted)}
.t-players td:last-child{overflow:visible}
.scroll:has(.more .menu:not([hidden])){overflow:visible}

.lg-left{display:flex;flex-direction:column;gap:14px;min-width:0}
.lg-art{aspect-ratio:16/9;min-height:0!important;align-items:center;justify-content:center;color:rgba(255,255,255,.35)}
.lg-prizes{background:var(--surface);border-radius:22px;padding:18px;display:flex;flex-direction:column;gap:10px;flex:1}
.lgp-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.lgp{display:grid;grid-template-columns:22px 48px minmax(0,1fr) 18px;gap:12px;align-items:center;background:var(--plate);border-radius:14px;padding:8px 12px 8px 10px;color:var(--text);text-decoration:none;transition:background .15s}
.lgp:hover{background:var(--btn)}
.lgp .pl{font-size:18px;font-weight:600;color:var(--champ-d);text-align:center}
.lgp.p1 .pl{color:#f1cf7f}.lgp.p2 .pl{color:#d3d8de}.lgp.p3 .pl{color:#d39a6a}
.lgp img{width:48px;height:48px;border-radius:12px}
.lgp-t{min-width:0;display:flex;flex-direction:column}.lgp-t b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lgp-t span{font-size:13px;color:var(--muted)}
.lgp .pi{width:18px;height:18px;color:var(--muted)}
@media (max-width:860px){.lg-left{order:2}.lgp-list{grid-template-columns:1fr}}
.okt{order:-1}

/* ===== v17 telegram login ===== */
.lstep{display:flex;flex-direction:column;gap:14px}
.tgbtn{background:#2AABEE!important;color:#fff!important}.tgbtn:hover{background:#43b8f3!important}
.tgbtn .pi{width:22px;height:22px}
.hello{display:flex;gap:14px;align-items:center}
.hello b{display:block;font-size:18px;font-weight:600}.hello span{font-size:14px;color:var(--muted)}
.tgmodal{width:min(420px,100%)}
.tghead{display:flex;align-items:center;gap:10px;color:#2AABEE;font-size:18px}.tghead .pi{width:28px;height:28px}
.tghead b{color:var(--text)}
