:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}html,body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden}#root{min-height:100vh}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}}*,*:before,*:after{box-sizing:border-box}:root{color-scheme:dark;--bg0: #06130f;--bg1: #071a14;--felt: #0f5132;--card: rgba(255, 255, 255, .06);--stroke: rgba(255, 255, 255, .12);--text: rgba(255, 255, 255, .92);--muted: rgba(255, 255, 255, .7);--gold: #f4c24f;--blue: #73c2ff;--red: #ff5a70;--shadow: 0 12px 45px rgba(0, 0, 0, .45);--font-body: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;--font-display: "Fraunces", ui-serif, Georgia, serif}html,body{width:100%;overflow-x:hidden}body{margin:0;color:var(--text);font-family:var(--font-body);background:radial-gradient(1000px 700px at 15% 10%,rgba(244,194,79,.16),transparent 55%),radial-gradient(900px 650px at 80% 25%,rgba(115,194,255,.12),transparent 60%),linear-gradient(180deg,var(--bg0),var(--bg1))}.shell{min-height:100vh;overflow-x:hidden;padding-bottom:0;overflow-y:hidden}.wrap{width:100%;max-width:none;margin:0;padding:0;position:relative;height:100vh;overflow:hidden}.toast{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:30;padding:14px 16px;border-radius:18px;border:1px solid rgba(255,255,255,.18);background:#0006;box-shadow:0 26px 120px #000000a6;color:#fffffff0;font-size:16px;font-weight:750;letter-spacing:-.01em;max-width:min(720px,calc(100vw - 28px));text-align:center}.toastError{border-color:#ff5a7066;box-shadow:0 0 0 4px #ff5a701a,0 26px 120px #000000a6}.toastSuccess{border-color:#78ffbe4d;box-shadow:0 0 0 4px #78ffbe1a,0 26px 120px #000000a6}@keyframes shakeX{0%{transform:translate(0)}16%{transform:translate(-10px)}33%{transform:translate(8px)}50%{transform:translate(-6px)}66%{transform:translate(4px)}83%{transform:translate(-2px)}to{transform:translate(0)}}.controlsShake .controlsInner{animation:shakeX .45s ease-in-out}@media(min-width:1100px){.wrap{padding:0}}.top{display:none}.topRight{display:flex;align-items:center;gap:10px}h1{margin:0;letter-spacing:-.03em;font-family:var(--font-display);font-weight:750}.sub{margin:8px 0 0;color:var(--muted);max-width:72ch}code{color:#ffffffd9}.pill{display:inline-flex;align-items:center;gap:10px;padding:10px 12px;border-radius:999px;border:1px solid var(--stroke);background:#ffffff0f;box-shadow:var(--shadow);color:#ffffffd6;white-space:nowrap}.dot{width:10px;height:10px;border-radius:50%;background:#f4c24fd9;box-shadow:0 0 0 6px #f4c24f1f}.grid{display:grid;grid-template-columns:1fr;gap:14px}.gridOne{grid-template-columns:1fr}.card{border:none;border-radius:0;background:transparent;box-shadow:none;overflow:visible}.cardHead{display:none}.cardHead h2{margin:0;font-size:15px;letter-spacing:.12em;text-transform:uppercase;color:#fffc}.muted{color:var(--muted);font-size:13px}.mutedSmall{color:#ffffffa6;font-size:13px;margin-top:10px;padding:0 16px 16px}.seats{padding:16px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}@media(max-width:600px){.wrap{padding:0}.top{flex-wrap:wrap;align-items:flex-start;gap:6px;margin-bottom:8px}.top>div:first-child{width:100%}h1{font-size:20px}.sub{display:none}.topRight{width:100%;justify-content:flex-end}.pill{max-width:130px;overflow:hidden;text-overflow:ellipsis}.seats{grid-template-columns:repeat(3,minmax(0,1fr));padding:10px;gap:8px}.seat{padding:8px}.seatTop{gap:4px}.seatNum{font-size:11px}.who{gap:6px;margin-top:6px}.avatar{width:30px;height:30px;font-size:15px}.nick{font-size:13px}.meta{font-size:11px}.empty{margin-top:8px;font-size:12px}.tag{font-size:10px;padding:3px 6px}.felt{height:100vh;min-height:100vh;max-height:none}.seatArcLayer{top:160px}.seatCard{padding:7px}.seatCardTop{grid-template-columns:34px 1fr auto;gap:6px}.seatAvatar{width:34px;height:34px;font-size:17px}.seatName{font-size:13px}.seatMeta{font-size:11px}.seatBadge{font-size:10px;padding:4px 7px}.seatArcHands{margin-top:0;margin-bottom:6px;gap:5px}.seatHand{padding:6px;border-radius:12px}.seatHandTop{margin-bottom:5px}.infoBar-insurance{display:none}}.seat{border-radius:16px;border:1px solid rgba(255,255,255,.1);background:#00000029;padding:12px;cursor:pointer;color:var(--text);text-align:left;transition:transform .12s ease,border-color .12s ease;min-width:0}.seat:disabled{cursor:not-allowed;opacity:.75}.seat:hover{transform:translateY(-1px);border-color:#ffffff2e}.seatEmpty{background:#0000001a}.seatTaken{background:#0000002e}.seatMine{border-color:#f4c24f59;box-shadow:0 0 0 4px #f4c24f1a}.seatTop{display:flex;justify-content:space-between;gap:10px;align-items:center}.seatNum{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#ffffffad}.tag{font-size:11px;padding:5px 8px;border-radius:999px;border:1px solid rgba(244,194,79,.35);background:#f4c24f1a}.who{display:flex;gap:10px;align-items:center;margin-top:10px}.avatar{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);font-size:20px}.nick{font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meta{margin-top:2px;font-size:12px;color:#ffffffa6}.empty{margin-top:16px;color:#ffffff8c}.actions{padding:0 16px 16px;display:flex;gap:10px;flex-wrap:wrap}.btn{border-radius:999px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:var(--text);padding:14px 14px;cursor:pointer}.btnPrimary{border-color:#f4c24f73;background:#f4c24f1f}.btn:disabled{opacity:.6;cursor:not-allowed}.btn:focus-visible,.chip:focus-visible,.av:focus-visible,.seatArc:focus-visible{outline:3px solid rgba(115,194,255,.75);outline-offset:2px}.err{margin:0 16px 16px;border-radius:14px;border:1px solid rgba(255,90,112,.28);background:#ff5a701a;padding:12px}.table{padding:0}.felt{height:100vh;border-radius:0;border:none;background:radial-gradient(900px 520px at 50% 0%,rgba(244,194,79,.1),transparent 62%),linear-gradient(180deg,#0f5132e6,#0a2c22e6);position:relative;overflow:hidden}@media(min-width:900px){.felt{overflow:visible}}.infoBar{position:absolute;left:14px;right:14px;top:12px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:#0003;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 48px 10px 12px;z-index:5}.phaseTitle{font-family:var(--font-display);letter-spacing:-.01em;font-weight:800}.phaseMeta{color:#ffffffb8;font-size:12px}.infoBar-betting{box-shadow:0 0 0 1px #ffc85a14 inset}.infoBar-player-turns{box-shadow:0 0 0 1px #78dcff14 inset}.infoBar-insurance{box-shadow:0 0 0 1px #ff78c814 inset}.infoBar-dealer-turn{box-shadow:0 0 0 1px #ffd77a14 inset}.welcome{display:none}.welcomeTitle{font-family:var(--font-display);font-weight:850;letter-spacing:-.02em;font-size:18px}.welcomeSub{margin-top:2px;color:#ffffffc7;font-size:13px}.dealer{position:absolute;left:50%;top:66px;transform:translate(-50%);padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:#0000002e;letter-spacing:.12em;text-transform:uppercase;font-size:12px}.dealerCards{position:absolute;left:50%;top:102px;transform:translate(-50%);display:flex;gap:0}.dealerCards .cardFace,.dealerCards .cardBack{width:100px;height:auto;aspect-ratio:243/356;flex:0 0 auto;margin-left:-42px}.dealerCards .cardFace:first-child,.dealerCards .cardBack:first-child{margin-left:0}.dealerTotal{position:absolute;left:50%;top:268px;transform:translate(-50%);font-size:12px;color:#ffffffbf}.cardFace,.cardBack{border-radius:10px}.deal{animation:dealIn .22s ease-out both}@keyframes dealIn{0%{opacity:0;transform:translate(-30px,-50px) rotate(-8deg) scale(.94)}to{opacity:1;transform:translate(0) rotate(0) scale(1)}}.pip{font-weight:750;font-size:16px}.cardImg{width:100%;height:100%;object-fit:contain;border-radius:inherit;display:block;image-rendering:auto}.red{color:#e04040}.seatHandBust{color:#e04040;opacity:.85}.charCount{text-align:right;margin-top:2px}.seatArcLayer{position:absolute;inset:0}.seatArc{position:absolute;width:220px;transform:translate(-50%,0);z-index:3;text-align:left;border:0;background:transparent;padding:0;display:flex;flex-direction:column-reverse;align-items:center}.seatArc:disabled{cursor:default}.seatArcClickable{cursor:pointer}.seatArc:nth-child(odd){z-index:4}.seatArcActive{filter:drop-shadow(0 12px 30px rgba(244,194,79,.18))}.seatCard{border-radius:18px;border:1px solid rgba(255,255,255,.14);background:#0000002e;box-shadow:0 14px 40px #00000052;padding:10px}.seatArcEmpty{opacity:.85}.seatArcClickable .seatCard{position:relative}.seatArcClickable .seatCard:after{content:"";position:absolute;inset:-6px;border-radius:22px;border:1px dashed rgba(255,255,255,.22);opacity:.55}.seatArcClickable:hover{transform:translate(-50%,0) scale(1.02)}@keyframes seatPulse{0%{box-shadow:0 0 #ffd77a00}50%{box-shadow:0 0 0 10px #ffd77a0f}to{box-shadow:0 0 #ffd77a00}}.seatArcClickable .seatCard{animation:seatPulse 1.8s ease-in-out infinite}.seatArcMine .seatCard{border-color:#ffd77a59;background:#140a0038}.seatArcActive .seatCard{border-color:#f4c24f66;box-shadow:0 0 0 4px #f4c24f1a,0 18px 55px #00000061}.seatCardTop{display:grid;grid-template-columns:46px 1fr auto;align-items:center;gap:10px}.seatAvatar{width:46px;height:46px;border-radius:999px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);background:#ffffff0f;font-size:22px;overflow:hidden}.seatAvatarMine{border-color:#ffd77a73;box-shadow:0 0 0 6px #ffd77a1a}.seatIdent{min-width:0}.seatName{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.seatMeta{margin-top:2px;font-size:12px;color:#ffffffb3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dotSep{margin:0 6px;opacity:.55}.seatBadge{font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:7px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:#0000002e;color:#ffffffc7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90px}.seatBadgeWaiting{border-color:#73c2ff47;color:#a0dcffd9}.seatBadgeBust{border-color:#ff5a7047;color:#ff9999d9}.seatBadgeEmpty{border-style:dashed;opacity:.7}.seatArcHands{margin-top:0;margin-bottom:8px;display:grid;gap:8px}.seatHand{border-radius:16px;border:1px solid rgba(255,255,255,.1);background:#00000024;padding:10px}.seatHandActive{border-color:#f4c24f59;box-shadow:0 0 0 4px #f4c24f1a}.seatHandTop{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:8px;color:#ffffffc7;font-size:12px;letter-spacing:.1em;text-transform:uppercase}.seatHandMeta{color:#ffffffad;font-size:12px;letter-spacing:0;text-transform:none}.seatHandCards{display:flex;gap:0;flex-wrap:nowrap}.seatArc0{left:12%;top:40%}.seatArc1{left:24%;top:56%}.seatArc2{left:40%;top:68%}.seatArc3{left:60%;top:68%}.seatArc4{left:76%;top:56%}.seatArc5{left:88%;top:40%}@media(max-width:980px){.seatArc{width:200px}.seatArc0{left:12%;top:40%}.seatArc1{left:24%;top:56%}.seatArc2{left:40%;top:68%}.seatArc3{left:60%;top:68%}.seatArc4{left:76%;top:56%}.seatArc5{left:88%;top:40%}}@media(max-width:820px){.welcome{display:none}.seatArcLayer{position:absolute;inset:230px 12px 12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-content:end;justify-items:stretch}.seatArc{position:relative;left:auto!important;top:auto!important;transform:none!important;width:100%}}@media(max-width:520px){.seatArcLayer{grid-template-columns:repeat(2,minmax(0,1fr))}}.panel{display:none}.panelInner{padding:0 0 8px}.panelTop{padding:12px 16px 0;display:flex;align-items:center;justify-content:space-between;gap:12px}.row{padding:12px 16px 10px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.statK{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#ffffffa6}.statV{font-weight:750;font-size:18px}.chipRow{padding:0 16px 12px;display:flex;gap:8px;flex-wrap:wrap}.chip{border-radius:999px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:var(--text);padding:14px 12px;cursor:pointer}.chip:hover{border-color:#f4c24f73}.ring{position:absolute;left:50%;top:92px;transform:translate(-50%);width:86%;height:270px;border-radius:999px;border:1px dashed rgba(255,255,255,.1);pointer-events:none}.overlay{position:fixed;inset:0;z-index:60;background:#0009;display:grid;place-items:center;padding:16px}.modal{width:min(560px,100%);border-radius:22px;border:1px solid rgba(255,255,255,.14);background:#071a14fa;box-shadow:0 20px 80px #0000008c;padding:16px}.rulesGrid{margin-top:10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}@media(max-width:720px){.rulesGrid{grid-template-columns:1fr}}.rulesCard{border-radius:18px;border:1px solid rgba(255,255,255,.1);background:#00000029;padding:12px}.rulesTitle{font-family:var(--font-display);font-weight:750;letter-spacing:-.01em;margin-bottom:6px}.rulesList{margin:0;padding-left:18px;color:#ffffffc7;line-height:1.5}.rulesBullets{display:grid;gap:6px;color:#ffffffc7;line-height:1.45}.rulesBullets code{color:#ffffffdb}.modalTop{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}.modalTitle{font-size:20px;font-weight:750;letter-spacing:-.01em}.field{display:grid;gap:8px;margin-bottom:12px}.field span{color:#ffffffb3;font-size:12px;letter-spacing:.12em;text-transform:uppercase}input{border-radius:14px;border:1px solid rgba(255,255,255,.14);background:#00000042;color:var(--text);padding:11px 12px}.avatars{display:flex;flex-wrap:wrap;gap:8px}.av{width:56px;height:56px;border-radius:14px;border:2px solid rgba(255,255,255,.14);background:#ffffff0f;color:var(--text);cursor:pointer;display:grid;place-items:center;font-size:20px;overflow:hidden;padding:0}.avImg{width:100%;height:100%;object-fit:cover;display:block}.avOn{border-color:#f4c24f73;background:#f4c24f1a}.history{margin:0 16px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:#00000024;overflow:hidden}.historySum{cursor:pointer;padding:12px;color:#ffffffc7;font-weight:700}.historyBody{padding:10px 12px 12px;display:grid;gap:6px;color:#ffffffb8;font-size:13px}.historyRow{padding-left:10px;border-left:2px solid rgba(244,194,79,.25)}.controls{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%);z-index:20;padding:14px;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;width:min(540px,85%)}.controlsInner{margin:0 auto;width:100%;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:#071a14c0;box-shadow:0 18px 70px #0000008c;padding:12px}.controlsTop{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}.controlsTitle{font-family:var(--font-display);font-weight:850;letter-spacing:-.02em}.controlsMeta{margin-top:2px;font-size:12px;color:#ffffffb8}.controlsHint{font-size:12px;color:#ffffffb3;padding-top:4px}.controlsActions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.controlsActions .btn{width:100%;justify-content:center}.chipRowControls{padding:0 0 10px}@media(max-width:720px){.controlsActions{grid-template-columns:repeat(2,minmax(0,1fr))}}.rulesIcon{position:absolute;top:16px;right:16px;z-index:10;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:#0000003d;color:#ffffffc7;cursor:pointer;display:grid;place-items:center;font-size:16px;font-weight:700}.rulesIcon:hover{background:#ffffff1a;border-color:#ffffff38}.resultOverlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:25;padding:20px 36px;border-radius:22px;font-family:var(--font-display);font-size:36px;font-weight:850;letter-spacing:-.02em;text-align:center;pointer-events:none;animation:overlayIn .35s ease-out;background:#00000055;border:1px solid rgba(255,255,255,.12)}.resultOverlay-success{color:#78ffbe;text-shadow:0 0 60px #78ffbe66,0 2px 0 #000}.resultOverlay-error{color:#ff7088;text-shadow:0 0 60px #ff5a7066,0 2px 0 #000}.resultOverlay-info{color:#9dd9ff;text-shadow:0 0 60px #73c2ff66,0 2px 0 #000}@keyframes overlayIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.7)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.turnTimer{position:absolute;left:50%;top:298px;transform:translate(-50%,0);z-index:8;display:grid;place-items:center;width:52px;height:52px}.turnTimer svg{position:absolute;width:100%;height:100%}.turnTimerBg{fill:none;stroke:#ffffff1a;stroke-width:3}.turnTimerFg{fill:none;stroke:#f4c24f;stroke-width:3;stroke-linecap:round;transition:stroke-dashoffset 1s linear}.turnTimerLow .turnTimerFg{stroke:#ff5a70}.turnTimerText{position:relative;font-size:16px;font-weight:750;color:#ffffffd6}@media(max-width:820px){.controls{position:fixed;left:0;right:0;bottom:0;top:auto;transform:none;width:100%;background:linear-gradient(180deg,#0000,#00000059 22%,#0009);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.seatArcHands{margin-bottom:4px}.seatHand{padding:6px}.seatHandCards .cardFace,.seatHandCards .cardBack{border-radius:8px}.seatHandCards .pip{font-size:13px}}

/* ── UX overrides (loaded after base, wins on conflicts) ── */

.seatArc {
  align-items: stretch;
  width: clamp(220px, 15vw, 260px);
}

/* Cards render as plain image containers — no background or border. */
.cardFace,
.cardBack {
  display: block;
  background: transparent;
  border: none;
}

/* Dealer cards: casino-style overlap */
.dealerCards {
  gap: 0;
}

.dealerCards .cardFace,
.dealerCards .cardBack {
  width: 100px;
  height: auto;
  aspect-ratio: 243 / 356;
  flex: 0 0 auto;
  margin-left: -42px;
}

.dealerCards .cardFace:first-child,
.dealerCards .cardBack:first-child {
  margin-left: 0;
}

.seatCard,
.seatArcHands {
  width: 100%;
}

.seatArcHands {
  margin-bottom: 10px;
}

.seatHand {
  display: grid;
  gap: 10px;
}

.seatHandTop {
  margin-bottom: 0;
  align-items: flex-start;
}

.seatHandCards {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0;
  overflow: hidden;
}

.seatHandCards .cardFace,
.seatHandCards .cardBack {
  flex: 0 0 auto;
  width: 100px;
  height: auto;
  aspect-ratio: 243 / 356;
  overflow: hidden;
  margin-left: -60px;
}

.seatHandCards .cardFace:first-child,
.seatHandCards .cardBack:first-child {
  margin-left: 0;
}

.seatHandCards .cardImg {
  object-fit: cover;
}

@media (min-width: 821px) {
  .felt.tableDense .seatArc {
    width: clamp(188px, 12vw, 228px);
  }

  .felt.tableDense .seatCard {
    padding: 8px;
  }

  .felt.tableDense .seatCardTop {
    grid-template-columns: 40px 1fr auto;
    gap: 8px;
  }

  .felt.tableDense .seatAvatar {
    width: 40px;
    height: 40px;
    font-size: 18px;
  }

  .felt.tableDense .seatBadge {
    max-width: 80px;
    padding: 5px 7px;
    font-size: 10px;
  }

  .felt.tableDense .seatHand {
    gap: 8px;
    padding: 8px;
  }

  .felt.tableDense .seatHandTop {
    gap: 8px;
    margin-bottom: 4px;
    font-size: 11px;
  }

  .felt.tableDense .seatHandMeta {
    font-size: 11px;
  }

  .felt.tableDense .seatHandCards {
    gap: 0;
  }


  .felt.tableDense .seatArcMine {
    z-index: 14;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) {
    width: clamp(156px, 10vw, 192px);
    z-index: 8;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatCard {
    padding: 7px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatCardTop {
    grid-template-columns: 34px 1fr auto;
    gap: 6px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatAvatar {
    width: 34px;
    height: 34px;
    font-size: 16px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatName {
    font-size: 13px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatMeta {
    font-size: 11px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatBadge {
    max-width: 72px;
    padding: 4px 6px;
    font-size: 9px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatArcHands {
    gap: 5px;
    margin-bottom: 6px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatHand {
    gap: 6px;
    padding: 6px;
    border-radius: 12px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatHandTop {
    gap: 6px;
    margin-bottom: 3px;
    font-size: 10px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatHandMeta {
    font-size: 10px;
  }

  .felt.tableDense .seatArc:not(.seatArcMine) .seatHandCards {
    gap: 0;
  }


  .felt.tableDenseFull .seatArc0 {
    left: 10%;
    top: 38%;
  }

  .felt.tableDenseFull .seatArc1 {
    left: 23%;
    top: 54%;
  }

  .felt.tableDenseFull .seatArc2 {
    left: 38%;
    top: 68%;
  }

  .felt.tableDenseFull .seatArc3 {
    left: 62%;
    top: 68%;
  }

  .felt.tableDenseFull .seatArc4 {
    left: 77%;
    top: 54%;
  }

  .felt.tableDenseFull .seatArc5 {
    left: 90%;
    top: 38%;
  }

  .felt.tableDenseSplit .seatArcMine {
    width: clamp(190px, 12.5vw, 230px);
  }

  .felt.tableDenseSplit .seatArcMine .seatHand {
    gap: 7px;
    padding: 7px;
  }


  .felt.tableDenseSplit .seatArc:not(.seatArcMine) {
    width: clamp(144px, 9vw, 176px);
  }

  .felt.tableDenseSplit .seatArc2,
  .felt.tableDenseSplit .seatArc3 {
    top: 60%;
  }

  .felt.tableDenseSplit .seatArcMine.seatArc2,
  .felt.tableDenseSplit .seatArcMine.seatArc3 {
    top: 50%;
  }

  .felt.tableDenseSplit .seatArc:not(.seatArcMine) .seatArcHands {
    gap: 4px;
    margin-bottom: 4px;
  }

  .felt.tableDenseSplit .seatArc:not(.seatArcMine) .seatHand {
    gap: 4px;
    padding: 5px;
  }

  .felt.tableDenseSplit .seatArc:not(.seatArcMine) .seatHandTop {
    gap: 5px;
    margin-bottom: 2px;
    font-size: 9px;
  }

  .felt.tableDenseSplit .seatArc:not(.seatArcMine) .seatHandMeta {
    font-size: 9px;
  }

}

.seatLeaveSourceHidden {
  display: none !important;
}

.seatLeaveDock {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 24;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(244, 194, 79, 0.42);
  background: rgba(7, 26, 20, 0.94);
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.34);
  color: rgba(255, 241, 196, 0.96);
  font: 600 12px/1 var(--font-body);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transform: translate(-9999px, -9999px);
  transition:
    background 0.14s ease,
    border-color 0.14s ease,
    box-shadow 0.14s ease;
}

.seatLeaveDock:hover {
  background: rgba(16, 44, 34, 0.98);
  border-color: rgba(244, 194, 79, 0.62);
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.38);
}

.seatLeaveDock:focus-visible {
  outline: 3px solid rgba(115, 194, 255, 0.75);
  outline-offset: 3px;
}

@media (max-width: 980px) {
  .seatArc {
    width: 220px;
  }
}

@media (max-width: 820px) {
  .seatArc {
    width: 100%;
  }

  .seatArcHands {
    margin-bottom: 6px;
  }

  .seatHand {
    gap: 8px;
  }

  .seatHandCards {
    gap: 0;
  }

  .seatLeaveDock {
    padding: 9px 12px;
    font-size: 11px;
  }
}

.rulesIcon {
  width: 44px;
  height: 44px;
}

@media (max-width: 520px) {
  .shell {
    min-height: 100vh;
    overflow-y: auto;
  }

  .wrap {
    height: auto;
    min-height: 100vh;
    overflow: visible;
  }

  .felt.mobilePlayLayout {
    min-height: 100vh;
    height: auto;
    overflow: visible;
    padding: 8px 10px 132px;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .felt.mobilePlayLayout .infoBar {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    order: 0;
    width: 100%;
    padding: 9px 44px 9px 10px;
    border-radius: 14px;
  }

  .felt.mobilePlayLayout .rulesIcon {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 44px;
    height: 44px;
  }

  .felt.mobilePlayLayout .soundIcon {
    position: absolute;
    top: 10px;
    right: 62px;
    width: 44px;
    height: 44px;
  }

  .felt.mobilePlayLayout .dealer {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    order: 1;
    align-self: center;
    padding: 5px 10px;
  }

  .felt.mobilePlayLayout .dealerCards {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    order: 2;
    justify-content: center;
    min-height: 38px;
  }

  .felt.mobilePlayLayout .dealerTotal {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    order: 3;
    text-align: center;
  }

  .felt.mobilePlayLayout .seatArcLayer {
    position: relative;
    inset: auto;
    order: 4;
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    align-content: stretch;
    justify-items: stretch;
  }

  .felt.mobilePlayLayout .seatArc {
    position: relative;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100%;
    min-width: 0;
    display: block;
    text-align: left;
  }

  .felt.mobilePlayLayout .seatArcMine {
    order: -1;
  }

  .felt.mobilePlayLayout .seatArcMine .seatCard {
    border-color: #ffd77a73;
    background: #140a0045;
    box-shadow: 0 0 0 3px #ffd77a1f, 0 14px 38px #0000004f;
  }

  .felt.mobilePlayLayout .seatCard {
    border-radius: 14px;
    padding: 8px;
  }

  .felt.mobilePlayLayout .seatArc:not(.seatArcMine) .seatCard {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .felt.mobilePlayLayout .seatCardTop {
    grid-template-columns: 36px 1fr auto;
    gap: 8px;
  }

  .felt.mobilePlayLayout .seatAvatar {
    width: 36px;
    height: 36px;
    font-size: 18px;
  }

  .felt.mobilePlayLayout .seatArcMine .seatAvatar {
    width: 42px;
    height: 42px;
  }

  .felt.mobilePlayLayout .controls {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    transform: none;
    z-index: 40;
    width: 100%;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    background: linear-gradient(180deg, rgba(6, 19, 15, 0), rgba(6, 19, 15, .92) 18%, rgba(6, 19, 15, .98));
  }

  .felt.mobilePlayLayout .controlsInner {
    border-radius: 16px;
    padding: 10px;
  }

  .felt.mobilePlayLayout .controlsTop {
    margin-bottom: 8px;
    gap: 8px;
  }

  .felt.mobilePlayLayout .controlsTitle {
    font-size: 15px;
    line-height: 1.1;
  }

  .felt.mobilePlayLayout .controlsMeta,
  .felt.mobilePlayLayout .controlsHint {
    font-size: 11px;
  }

  .felt.mobilePlayLayout .controlsActions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .felt.mobilePlayLayout .chipRowControls,
  .felt.mobilePlayLayout .chipRow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    padding: 0 0 8px;
  }

  .felt.mobilePlayLayout .chip {
    width: 100%;
    text-align: center;
  }

  .felt.mobilePlayLayout .btn,
  .felt.mobilePlayLayout .chip {
    min-height: 44px;
    padding: 10px 12px;
  }

  .felt.mobilePlayLayout .cardFace,
  .felt.mobilePlayLayout .cardBack,
  .felt.mobilePlayLayout .dealerCards .cardFace,
  .felt.mobilePlayLayout .dealerCards .cardBack {
    width: auto;
    min-width: 42px;
    height: 30px;
    aspect-ratio: auto;
    margin-left: 0;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, .18);
    background: #fffffff0;
    color: #161616;
    box-shadow: 0 6px 14px #00000030;
    overflow: hidden;
  }

  .felt.mobilePlayLayout .cardImg {
    display: none;
  }

  .felt.mobilePlayLayout .pip {
    display: none;
  }

  .felt.mobilePlayLayout .mobileCardToken {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    padding: 0 6px;
    font-size: 13px;
    line-height: 1;
    font-weight: 850;
    white-space: nowrap;
  }

  .felt.mobilePlayLayout .mobileCardRed .mobileCardToken {
    color: #c51f32;
  }

  .felt.mobilePlayLayout .mobileCardBlack .mobileCardToken {
    color: #151515;
  }

  .felt.mobilePlayLayout .mobileCardHidden {
    background: #183d31;
    color: #ffffffd9;
  }

  .felt.mobilePlayLayout .seatHandCards {
    gap: 4px;
    flex-wrap: wrap;
  }

  .felt.mobilePlayLayout .dealerCards {
    gap: 4px;
  }

  .felt.mobilePlayLayout.mobileHasActions {
    padding-bottom: 180px;
  }

  .felt.mobilePlayLayout .seatArcMine {
    margin-bottom: 8px;
  }

  .felt.mobilePlayLayout .seatArcMine .seatArcHands {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 8px;
  }

  .felt.mobilePlayLayout .seatArcMine .seatHand {
    width: 100%;
    padding: 8px;
    border-radius: 12px;
  }

  .felt.mobilePlayLayout .seatArcMine .seatHandTop {
    margin-bottom: 6px;
    font-size: 11px;
  }

  .felt.mobilePlayLayout .seatArcMine .seatHandActive,
  .felt.mobilePlayLayout .seatArcMine .mobileSeatHandActive {
    border-color: #f4c24f80;
    box-shadow: 0 0 0 3px #f4c24f1f;
  }

  .felt.mobilePlayLayout .seatArcMine .mobileSeatHandInactive {
    opacity: .78;
  }

  .felt.mobilePlayLayout .controlsActions .btn {
    width: 100%;
    min-width: 0;
    font-size: 13px;
    font-weight: 750;
  }

  .felt.mobilePlayLayout .seatHand:not(.seatHandActive) .seatHandTop {
    color: #ffffffa8;
  }

  .felt.mobilePlayLayout .seatHandBust {
    color: #ff8a9a;
  }

  .felt.mobilePlayLayout .seatArcEmpty .seatCard {
    min-height: 58px;
    border-style: dashed;
  }

  .felt.mobilePlayLayout .seatBadgeWaiting {
    border-color: #73c2ff66;
    background: #73c2ff1c;
  }

  .felt.mobilePlayLayout .seatArc:not(.seatArcMine) .seatArcHands {
    margin-bottom: 4px;
  }

  .felt.mobilePlayLayout .seatArc:not(.seatArcMine) .seatHand {
    padding: 5px;
    border-radius: 10px;
  }

  .felt.mobilePlayLayout .resultOverlay {
    position: fixed;
    top: 42%;
    max-width: calc(100vw - 32px);
    font-size: 24px;
    padding: 14px 20px;
  }

  .felt.mobilePlayLayout button {
    min-height: 44px;
  }

  .felt.mobilePlayLayout .seatArc {
    min-height: 44px;
  }

  .felt.mobilePlayLayout .seatBadge {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
  }

  .felt.mobilePlayLayout .seatLeaveDock {
    min-height: 44px;
    padding: 11px 14px;
  }
}

/* ── Sparse arc fix: seats 1–2 / 5–6 were 12% apart with 15vw tiles, guaranteeing
   overlap below ~2150px. Uniform 16% pitch + tile width derived from the pitch. ── */
@media (min-width: 821px) {
  .seatArc {
    width: clamp(140px, calc(16vw - 8px), 260px);
  }

  .seatArc0 { left: 10%; }
  .seatArc1 { left: 26%; }
  .seatArc2 { left: 42%; }
  .seatArc3 { left: 58%; }
  .seatArc4 { left: 74%; }
  .seatArc5 { left: 90%; }

  /* Reclaim row space so "🪙 1000 • Bet 50" and YOUR TURN fit untruncated. */
  .seatCardTop {
    grid-template-columns: 40px 1fr auto;
    gap: 8px;
  }

  .seatAvatar {
    width: 40px;
    height: 40px;
    font-size: 18px;
  }

  .seatBadge {
    letter-spacing: 0.06em;
    padding: 5px 7px;
    max-width: 96px;
  }

  .seatMeta .dotSep {
    margin: 0 4px;
  }
}

/* ── Quick-win polish: key hints on action buttons; timer pinned to the action
   panel instead of floating mid-felt (desktop arc layout only). ── */
.keyHint {
  display: inline-block;
  margin-left: 8px;
  padding: 1px 6px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(0, 0, 0, 0.25);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.62);
  vertical-align: 1px;
}

@media (min-width: 821px) {
  .turnTimer {
    left: calc(50% + min(270px, 42.5%) - 22px);
    top: calc(54% - 96px);
    transform: none;
    z-index: 22;
  }
}
