:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);--bg:#e6e9ee;--panel:#fff;--ink:#17202b;--mut:#5b6877;--line:#d3dae3;--gold:#d9a93a;--rail:#4a2a17;--rail2:#8a5a32;--felt:radial-gradient(ellipse at 50% 40%,#1f8a55,#0f5c38 60%,#0a3f27);--ring:#ffffff22;--back:repeating-linear-gradient(45deg,#8a1c2a 0 4px,#5e0f1b 4px 8px);--backb:#f4efe6;--plate:linear-gradient(#1f2b38,#0f161e);--msg:#f6e3a1;--wm:"POKER";--wmc:#ffffff10}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#090c10;--panel:#131a22;--ink:#e8edf3;--mut:#8896a6;--line:#232e3a}}
:root[data-theme=dark]{--bg:#090c10;--panel:#131a22;--ink:#e8edf3;--mut:#8896a6;--line:#232e3a}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.4 "Trebuchet MS",system-ui,sans-serif}
.wrap{max-width:1100px;margin:0 auto;padding:12px;zoom:.92}@media(max-height:820px){.wrap{zoom:.84}}@media(max-height:700px){.wrap{zoom:.76}}@media(max-width:700px){.wrap{zoom:1}.stage{min-height:540px}}
header{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
h1{font:700 22px Georgia,serif;margin:0;letter-spacing:.3px}header span{color:var(--mut);font-size:12px}
.stage{position:relative;height:min(600px,70vw);min-height:500px}
.felt{position:absolute;inset:8% 1% 8%;border-radius:999px;border:16px solid var(--rail);background:var(--felt);box-shadow:inset 0 0 60px #000a,0 0 0 3px var(--rail2),0 18px 40px #0008,var(--glow,0 0 0 #0000)}.felt:before{content:var(--wm);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:900 clamp(28px,7vw,76px) Georgia,serif;letter-spacing:.12em;color:var(--wmc);pointer-events:none}
.felt:after{content:"";position:absolute;inset:7%;border-radius:999px;border:2px solid var(--ring)}
.seat{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:4px;z-index:3;transition:opacity .3s}
.hc{display:flex;gap:3px;--w:38px}.hc .big{--w:58px}.hc .card+.card{margin-left:-6px}
.plate{background:var(--plate);color:#fff;border:1px solid #ffffff2a;border-radius:12px;padding:4px 10px;min-width:92px;text-align:center;line-height:1.25;transition:box-shadow .3s}
.plate small{display:block;color:#b8c4d2;font-size:12px}.plate strong{color:var(--gold);font-size:15px}.plate strong.rb1{color:#4ade80}.plate strong.rb2{color:#ff5d5d}.plate em{font-style:normal;font-size:11px}.plate small.need{font-size:11px}.plate small.need.rb1{color:#4ade80}.plate small.need.rb2{color:#ff5d5d}
.turn .plate{box-shadow:0 0 0 2px var(--gold),0 0 20px #d9a93aaa}.win .plate{box-shadow:0 0 0 2px #5ee08a,0 0 24px #5ee08a}.fold .plate{opacity:.5}.fold .hc{filter:grayscale(1) brightness(.65);transform:perspective(260px) rotateX(42deg) scale(.88);opacity:.85;margin-bottom:-8px}.drop .hc{animation:mk .55s ease-out}@keyframes mk{from{transform:translateY(-26px) scale(1.2);filter:none;opacity:1}}
.tag{position:absolute;bottom:-17px;background:#000b;color:#fff;font-size:11px;padding:1px 8px;border-radius:9px;white-space:nowrap}
.dlr{position:absolute;right:-12px;top:8px;width:22px;height:22px;border-radius:50%;background:#fff;color:#111;font:700 12px/22px Georgia;text-align:center;box-shadow:0 2px 5px #0009}
.bet{position:absolute;transform:translate(-50%,-50%);z-index:2;display:flex;align-items:center;gap:4px;color:#fff;font-weight:700;text-shadow:0 1px 3px #000}
.chip{display:block;width:20px;height:20px;border-radius:50%;border:3px dashed #fffc;box-shadow:0 2px 0 #0007;margin-bottom:-14px}
.bet span{margin-left:8px}
.center{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;--w:48px}
.pot{display:flex;align-items:center;gap:10px;color:#fff;font-weight:700;background:#0007;padding:3px 14px;border-radius:14px}
.pot .chip{margin:0}.board{display:flex;gap:6px}.slot{width:var(--w);aspect-ratio:5/7;border:2px dashed #ffffff33;border-radius:6px}
.msg{color:var(--msg);font:italic 15px Georgia,serif;text-align:center;max-width:300px;min-height:20px;text-shadow:0 1px 3px #000}
.card{position:relative;width:var(--w,44px);aspect-ratio:5/7;border-radius:6px;background:linear-gradient(#fff,#ececec);color:#14181d;box-shadow:0 2px 7px #000a;font-family:Georgia,serif;flex:none}
.card.red{color:#c4262e}.card b{position:absolute;left:11%;top:4%;font-size:calc(var(--w,44px)*.38);line-height:1}
.card i{position:absolute;left:13%;top:36%;font-style:normal;font-size:calc(var(--w,44px)*.28);line-height:1}
.card u{position:absolute;right:9%;bottom:5%;text-decoration:none;font-size:calc(var(--w,44px)*.55);line-height:1}
.card.back{background:var(--back);border:3px solid var(--backb)}.card.back *{display:none}
.deal{animation:deal .5s cubic-bezier(.2,.8,.2,1) both}@keyframes deal{from{transform:translateY(-70px) scale(.5) rotate(-14deg);opacity:0}}
.ctl{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px;margin-top:10px}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:4px 0}
button{font:inherit;border:0;border-radius:10px;padding:11px 18px;font-weight:700;cursor:pointer;color:#fff}
button:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.fo{background:#b3362f}.ca{background:#23804e}.ra{background:#b97d0e}.nx{background:#2563eb}.q{background:var(--line);color:var(--ink);padding:6px 11px;font-size:13px}
.info{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}@media(max-width:700px){.info{grid-template-columns:1fr}}
.pn{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px;min-height:90px}.pn h2{font:700 15px Georgia,serif;margin:0 0 6px}
#log{max-height:130px;overflow:auto;color:var(--mut);font-size:13px}.hint{color:var(--mut)}
@media(max-width:560px){.hc{--w:30px}.hc .big{--w:48px}.center{--w:38px}.plate{min-width:76px;padding:3px 6px}.felt{border-width:10px}}
@media(prefers-reduced-motion:reduce){.deal{animation:none}}
.sw{position:relative}#ov{position:absolute;inset:0;z-index:20;display:flex;visibility:hidden;opacity:0;transition:opacity .5s,visibility .5s;align-items:center;justify-content:center;background:#05080ccc;backdrop-filter:blur(8px);border-radius:18px;padding:12px}#ov.on{visibility:visible;opacity:1}
.dlg{animation:rise .6s ease both}@keyframes rise{from{transform:translateY(16px);opacity:0}}@media(prefers-reduced-motion:reduce){.drop .hc{animation:none}.dlg{animation:none}#ov{transition:none}}
.dlg{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;max-width:460px;width:100%;max-height:100%;overflow:auto}.dlg h2{font:700 20px Georgia,serif;margin:0 0 8px}.dlg label{display:block;margin:10px 0 3px;color:var(--mut);font-size:13px}
.dlg input,.dlg select,header select{font:inherit;padding:7px 9px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);width:100%}header select{width:auto}.g2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.pn input{font:inherit;padding:8px 10px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}.go{width:100%;margin-top:14px;font-size:16px}.spd{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--mut)}.spd input{width:90px}

html[data-th=vegas]:root{--bg:#0a0612;--panel:#150b24;--ink:#f3e9ff;--mut:#a995c9;--line:#2c1a47;--gold:#ffd23f;--rail:#1a1026;--rail2:#ff2bd6;--glow:0 0 30px #ff2bd699;--felt:radial-gradient(ellipse at 50% 35%,#5b1a8f,#2a0b52 62%,#14052b);--ring:#25f4ee99;--back:repeating-linear-gradient(45deg,#ff2bd6 0 3px,#1a0830 3px 8px);--backb:#25f4ee;--plate:linear-gradient(#2a0f4a,#12061f);--msg:#7ffcf6;--wm:"VEGAS";--wmc:#ff2bd62e}
html[data-th=vegas] .plate{border-color:#ff2bd699}html[data-th=vegas] h1{color:#ffd23f;text-shadow:0 0 14px #ff2bd6}
html[data-th=garage]:root{--bg:#14161a;--panel:#1f2327;--ink:#eceff1;--mut:#9aa3ab;--line:#343a40;--gold:#ff8a1f;--rail:#3a3f45;--rail2:#ff8a1f;--felt:radial-gradient(ellipse at 50% 40%,#ffffff14,#0000 65%),repeating-linear-gradient(45deg,#2e3338 0 6px,#262a2e 6px 12px);--ring:#ff8a1f77;--back:repeating-conic-gradient(#111 0 25%,#f5f5f5 0 50%) 0 0/12px 12px;--backb:#e53935;--plate:linear-gradient(#3b4046,#1b1e21);--msg:#ffc58a;--wm:"GARAGE";--wmc:#ff8a1f1f}
html[data-th=royal]:root{--bg:#140a0d;--panel:#211015;--ink:#f6ecdf;--mut:#b49a92;--line:#3a1d25;--gold:#e8c15a;--rail:#2a1209;--rail2:#c9a23c;--felt:radial-gradient(ellipse at 50% 40%,#8a1f33,#5e1022 60%,#3a0914);--ring:#e8c15a66;--back:repeating-linear-gradient(45deg,#1b2a5a 0 4px,#101a3d 4px 8px);--backb:#e8c15a;--plate:linear-gradient(#34131b,#180a0e);--msg:#f6e3a1;--wm:"ROYAL";--wmc:#e8c15a1c}
html[data-th=midnight]:root{--bg:#070b12;--panel:#101823;--ink:#e6eef8;--mut:#8aa0b8;--line:#223044;--gold:#6cc4ff;--rail:#10151d;--rail2:#5b7fb8;--felt:radial-gradient(ellipse at 50% 40%,#1d4f9c,#123672 60%,#0a2150);--ring:#9cc8ff44;--back:repeating-linear-gradient(45deg,#2a6fdb 0 4px,#173f85 4px 8px);--backb:#e8f1ff;--plate:linear-gradient(#1b2a40,#0d1522);--msg:#bfe3ff;--wm:"MIDNIGHT";--wmc:#9cc8ff18}
.stk{position:absolute;bottom:2px;display:flex;align-items:flex-end;gap:2px;pointer-events:none}.stk.r{left:100%;margin-left:6px}.stk.l{right:100%;margin-right:6px}
.stk .col{display:flex;flex-direction:column-reverse;align-items:center}.stk .col i{display:block;width:20px;height:7px;border-radius:50%;border:2px dashed #fffb;margin-top:-4px;box-shadow:0 1px 0 #0008}.stk .col b{font-size:9px;color:#fff;text-shadow:0 1px 2px #000;margin-bottom:2px}
html.nostk .stk{display:none}#fly{position:absolute;inset:0;pointer-events:none;z-index:15;overflow:hidden}
.fc{position:absolute;left:0;top:0;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;border:3px dashed #fffc;box-shadow:0 2px 3px #000a}
.adv{margin-top:10px;border:1px solid var(--line);border-radius:10px;padding:8px 10px}.adv summary{cursor:pointer;font-weight:700}.roster{font-size:13px;margin:8px 0;display:grid;grid-template-columns:1fr 1fr;gap:2px 10px}

.hr{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}.opts{margin:0}.av,.tabs,.gear{display:none}
/* ===================== NEW UI ===================== */
html[data-ui=new]:root:not([data-th]),html[data-ui=new][data-th=casino]:root{--bg:#090c10;--panel:#131a22;--ink:#e8edf3;--mut:#8896a6;--line:#232e3a}
html[data-ui=new]{--glass:color-mix(in srgb,var(--panel) 62%,transparent);--edge:color-mix(in srgb,var(--ink) 16%,transparent);--acc:var(--gold)}
html[data-ui=new] body{min-height:100dvh;font-family:Inter,"SF Pro Text",system-ui,-apple-system,"Segoe UI",sans-serif;background:radial-gradient(1100px 650px at 12% -10%,color-mix(in srgb,var(--acc) 22%,transparent),transparent 60%),radial-gradient(900px 600px at 105% 110%,color-mix(in srgb,var(--acc) 14%,transparent),transparent 60%),var(--bg)}
html[data-ui=new] .wrap{zoom:1;max-width:1280px;padding:10px 12px;min-height:100dvh;display:flex;flex-direction:column;gap:10px}
html[data-ui=new] header{position:relative;z-index:25;margin:0;padding:8px 14px;border:1px solid var(--edge);border-radius:18px;background:var(--glass);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%)}
html[data-ui=new] h1{font:800 21px/1.1 Inter,system-ui,sans-serif;background:linear-gradient(90deg,var(--ink),var(--acc));-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-ui=new] .gear{display:inline-flex;align-items:center}
html[data-ui=new] .opts{display:none;position:absolute;right:0;top:calc(100% + 8px);width:min(340px,92vw);padding:12px;border-radius:18px;background:var(--panel);border:1px solid var(--edge);box-shadow:0 24px 60px #000c;flex-direction:column;align-items:stretch;gap:8px}
html[data-ui=new] header.open .opts{display:flex}html[data-ui=new] .opts select,html[data-ui=new] .opts button{width:100%}html[data-ui=new] .spd{justify-content:space-between}
html[data-ui=new] select,html[data-ui=new] input{border-radius:12px}
html[data-ui=new] .sw{flex:1;min-height:440px}html[data-ui=new] .stage{position:absolute;inset:0;height:auto;min-height:0}
html[data-ui=new] .felt{inset:7% 2% 9%;border:1px solid color-mix(in srgb,var(--acc) 55%,transparent);box-shadow:inset 0 0 90px #000b,inset 0 0 0 10px #0004,0 0 0 6px #ffffff0a,0 30px 80px #000a,0 0 70px color-mix(in srgb,var(--acc) 18%,transparent)}
html[data-ui=new] .felt:after{inset:5%;border:1px solid var(--ring)}html[data-ui=new] .felt:before{opacity:.5;font-size:clamp(22px,5vw,58px)}
html[data-ui=new] .seat{gap:6px;transition:opacity .4s,filter .4s}html[data-ui=new] .seat.turn{filter:drop-shadow(0 0 14px color-mix(in srgb,var(--acc) 80%,transparent))}html[data-ui=new] .seat.fold{filter:grayscale(.55)}
html[data-ui=new] .plate{display:grid;grid-template-columns:auto 1fr;column-gap:9px;align-items:center;text-align:left;min-width:116px;padding:6px 13px 6px 7px;border-radius:16px;background:linear-gradient(180deg,#ffffff1f,#ffffff08),#0b1118cc;border:1px solid #ffffff28;backdrop-filter:blur(12px);box-shadow:0 8px 24px #0007}
html[data-ui=new] .plate .av{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;font:800 13px/1 sans-serif;color:#fff;grid-row:1/3;box-shadow:inset 0 0 0 2px #ffffff40}
html[data-ui=new] .plate small,html[data-ui=new] .plate strong{grid-column:2}html[data-ui=new] .plate small{color:#c6d1de;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:92px}html[data-ui=new] .plate small.need{grid-column:1/-1;max-width:none}
html[data-ui=new] .tag{position:static;border:1px solid #ffffff26;background:#000a;backdrop-filter:blur(8px)}
html[data-ui=new] .card{border-radius:9px;box-shadow:0 6px 16px #000a,inset 0 0 0 1px #0001}html[data-ui=new] .card.back{border:2px solid #ffffffd0}
html[data-ui=new] .pot{background:#0008;backdrop-filter:blur(10px);border:1px solid #ffffff22;padding:5px 16px}html[data-ui=new] .msg{font:600 15px Inter,system-ui,sans-serif;font-style:normal}
.pop{animation:popin .35s cubic-bezier(.2,.9,.3,1.3)}@keyframes popin{from{transform:translate(-50%,-50%) scale(.6);opacity:0}}
html[data-ui=new] .ctl{position:sticky;bottom:calc(env(safe-area-inset-bottom,0px) + 4px);z-index:12;margin:0;padding:10px;border-radius:20px;background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--edge);box-shadow:0 14px 40px #0008}html[data-ui=new] .ctl .row{justify-content:center;gap:10px}
html[data-ui=new] button{border-radius:14px;min-height:46px;padding:0 22px;font-weight:700;letter-spacing:.2px;transition:transform .15s,filter .15s;box-shadow:0 6px 16px #0006}html[data-ui=new] button:active{transform:scale(.97)}html[data-ui=new] button:hover:not(:disabled){filter:brightness(1.12)}
html[data-ui=new] .fo{background:linear-gradient(180deg,#e0524a,#a82a24)}html[data-ui=new] .ca{background:linear-gradient(180deg,#2fae6b,#1c7a4a)}html[data-ui=new] .ra{background:linear-gradient(180deg,#e0a21b,#a8730a)}html[data-ui=new] .nx{background:linear-gradient(180deg,#3b82f6,#1d4ed8)}
html[data-ui=new] .q{min-height:38px;padding:0 14px;background:#ffffff14;color:var(--ink);border:1px solid var(--edge);box-shadow:none}html[data-ui=new] input[type=range]{accent-color:var(--acc);height:28px;padding:0}
html[data-ui=new] .tabs{display:flex;gap:6px;padding:4px;border-radius:14px;background:var(--glass);border:1px solid var(--edge);backdrop-filter:blur(12px);align-self:flex-start}
html[data-ui=new] .tabs button{min-height:34px;padding:0 14px;background:transparent;color:var(--mut);box-shadow:none;border-radius:10px;position:relative}
html[data-ui=new][data-tab=coach] #tabcoach,html[data-ui=new][data-tab=log] #tablog,html[data-ui=new][data-tab=chat] #tabchat{background:var(--acc);color:#111}
html[data-ui=new] .tabs .dot::after{content:"";position:absolute;top:5px;right:5px;width:8px;height:8px;border-radius:50%;background:#ff4d6d}
html[data-ui=new] .info{display:block;margin:0}html[data-ui=new] .pn{display:none;max-height:200px;overflow:auto;background:var(--glass);backdrop-filter:blur(14px);border-radius:18px;border-color:var(--edge)}
html[data-ui=new][data-tab=coach] #pcoach,html[data-ui=new][data-tab=log] #plog,html[data-ui=new][data-tab=chat] #chat{display:block}html[data-ui=new] #chat{margin-top:0!important}html[data-ui=new] #log{max-height:none}
html[data-ui=new] #ov{background:radial-gradient(800px 500px at 50% 30%,color-mix(in srgb,var(--acc) 18%,transparent),#05070bd9);backdrop-filter:blur(14px)}
html[data-ui=new] .dlg{border-radius:24px;padding:24px;max-width:480px;background:var(--glass);border:1px solid var(--edge);box-shadow:0 30px 80px #000b;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);color:var(--ink)}
html[data-ui=new] .dlg h2{font:800 24px/1.15 Inter,system-ui,sans-serif;background:linear-gradient(90deg,var(--ink),var(--acc));-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-ui=new] .dlg input,html[data-ui=new] .dlg select{padding:10px 12px;background:#ffffff0f;border-color:var(--edge)}html[data-ui=new] .go{min-height:52px;border-radius:16px;font-size:16px}html[data-ui=new] .adv{border-radius:14px;background:#ffffff08}
@media(max-width:700px){html[data-ui=new] .wrap{padding:8px}html[data-ui=new] header{padding:6px 10px}html[data-ui=new] header span{display:none}html[data-ui=new] h1{font-size:18px}
 html[data-ui=new] .plate{min-width:0;padding:4px 9px 4px 5px}html[data-ui=new] .plate .av{width:24px;height:24px;font-size:11px}html[data-ui=new] .plate small{max-width:60px;font-size:11px}html[data-ui=new] .plate strong{font-size:13px}
 html[data-ui=new] .stk{position:static;margin:0;justify-content:center;transform:scale(.8)}html[data-ui=new] .hc{--w:30px}html[data-ui=new] .hc .big{--w:46px}html[data-ui=new] .center{--w:36px}html[data-ui=new] .ctl .row button{flex:1}html[data-ui=new] .sw{min-height:400px}}
@media(prefers-reduced-motion:reduce){.pop{animation:none}html[data-ui=new] .seat{transition:none}}
