@font-face { font-family:"DM Sans"; font-style:normal; font-weight:400 700; font-display:swap; src:url("assets/fonts/dm-sans-latin-ext.woff2") format("woff2"); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:"DM Sans"; font-style:normal; font-weight:400 700; font-display:swap; src:url("assets/fonts/dm-sans-latin.woff2") format("woff2"); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:"Playfair Display"; font-style:normal; font-weight:700 800; font-display:swap; src:url("assets/fonts/playfair-display-latin-ext.woff2") format("woff2"); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:"Playfair Display"; font-style:normal; font-weight:700 800; font-display:swap; src:url("assets/fonts/playfair-display-latin.woff2") format("woff2"); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root {
  --ink: #f6f2e9;
  --muted: #a8b2aa;
  --green: #0d7a50;
  --green-bright: #19a56d;
  --green-dark: #061b14;
  --gold: #d8ad57;
  --gold-light: #f3d58e;
  --red: #a53a42;
  --surface: rgba(13, 29, 23, 0.88);
  --surface-2: rgba(19, 40, 32, 0.94);
  --line: rgba(216, 173, 87, 0.19);
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.38);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 50% -10%, #15382a 0, transparent 38rem),
    linear-gradient(145deg, #050a08, #07130f 45%, #050907);
  font: 16px/1.5 "DM Sans", system-ui, sans-serif;
  overflow-x: hidden;
}
body.is-loading { overflow: hidden; }
button, input { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible { outline: 3px solid rgba(243, 213, 142, .75); outline-offset: 3px; }

.loading-screen { position:fixed; z-index:300; inset:0; display:grid; place-items:center; min-height:100dvh; padding:24px; background:radial-gradient(circle at 50% 40%,rgba(20,83,58,.72),transparent 34%),radial-gradient(circle at 50% 120%,rgba(165,58,66,.28),transparent 46%),#030806; opacity:1; visibility:visible; transition:opacity .4s ease,visibility .4s ease; }
.loading-screen::before { content:""; position:absolute; inset:clamp(20px,5vw,70px); border:1px solid rgba(216,173,87,.16); border-radius:40px; box-shadow:inset 0 0 80px rgba(216,173,87,.04); }
.loading-halo { position:absolute; width:min(72vw,480px); aspect-ratio:1; border-radius:50%; border:1px solid rgba(216,173,87,.12); box-shadow:0 0 0 35px rgba(216,173,87,.025),0 0 0 80px rgba(216,173,87,.015); animation:loading-breathe 2.2s ease-in-out infinite; }
.loading-content { position:relative; z-index:2; display:grid; justify-items:center; gap:22px; text-align:center; }
.loading-brand .brand-word { font-size:clamp(3rem,11vw,6rem); text-shadow:0 10px 36px rgba(0,0,0,.55); }
.loading-brand > small { font-size:clamp(.58rem,2vw,.88rem); color:var(--gold-light); }
.loading-suits { display:flex; gap:18px; color:rgba(246,242,233,.42); font:700 1.15rem/1 serif; }
.loading-suits span:nth-child(2),.loading-suits span:nth-child(3) { color:rgba(214,77,88,.72); }
.loading-chips { position:relative; width:54px; height:26px; }
.loading-chips i { position:absolute; left:8px; width:38px; height:12px; border:2px dashed #f3d58e; border-radius:50%; background:#942e38; box-shadow:0 3px 8px rgba(0,0,0,.45); animation:loading-chip 1.25s ease-in-out infinite; }
.loading-chips i:nth-child(1) { top:14px; animation-delay:-.2s; }
.loading-chips i:nth-child(2) { top:7px; background:#185b91; animation-delay:-.1s; }
.loading-chips i:nth-child(3) { top:0; }
.loading-content p { margin:0; color:var(--muted); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; }
body.app-ready .loading-screen { opacity:0; visibility:hidden; pointer-events:none; }
body.is-loading .app-shell,body.is-loading > .modal-backdrop { visibility:hidden; }
@keyframes loading-breathe { 0%,100% { transform:scale(.96); opacity:.6; } 50% { transform:scale(1.04); opacity:1; } }
@keyframes loading-chip { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-3px); } }

.ambient { position: fixed; pointer-events: none; filter: blur(1px); opacity: .45; z-index: -1; }
.ambient-one { width: 28rem; height: 28rem; top: 8rem; left: -18rem; background: #0c744b; border-radius: 50%; filter: blur(120px); }
.ambient-two { width: 24rem; height: 24rem; right: -14rem; top: 45%; background: #7d2d32; border-radius: 50%; filter: blur(130px); }
.app-shell { width: min(1440px, 100%); margin: 0 auto; min-height: 100vh; display: flex; flex-direction: column; }

.topbar {
  min-height: 94px;
  display: grid;
  grid-template-columns: 250px 1fr 250px;
  align-items: center;
  gap: 20px;
  padding: 18px clamp(20px, 4vw, 64px);
  border-bottom: 1px solid var(--line);
  background: rgba(4, 11, 8, .72);
  backdrop-filter: blur(18px);
  position: sticky;
  top: 0;
  z-index: 30;
}
.brand { border: 0; background: transparent; padding: 0; display: inline-flex; align-items: center; gap: 13px; text-align: left; cursor: pointer; }
.brand-lockup { display: grid; justify-items: center; line-height: 1; }
.brand-lockup > small { color: var(--gold-light); font-size: .46rem; font-weight: 800; letter-spacing: .45em; margin: 0 0 3px .45em; }
.brand-word { font: 800 2rem/1 "Playfair Display", serif; letter-spacing: .09em; white-space: nowrap; }
.brand-o { width: 1.12em; height: 1.12em; margin: 0 .03em; display: inline-grid; place-items: center; border: .09em solid var(--gold); border-radius: 50%; vertical-align: -.09em; color: var(--gold-light); box-shadow: inset 0 0 .18em rgba(216,173,87,.18), 0 0 0 .055em rgba(216,173,87,.12); overflow: hidden; }
.brand-o > span { width: 100%; height: 100%; display: grid; place-items: center; font: 900 1em/.72 "DM Sans", sans-serif; letter-spacing: -.2em; text-indent: -.2em; transform: scaleX(1.22) translateY(-.01em); }
.brand-sub { color: var(--muted); font-size: .67rem; letter-spacing: .12em; text-transform: uppercase; max-width: 70px; line-height: 1.3; }
.desktop-nav { justify-self: center; display: flex; align-items: center; gap: 4px; background: rgba(255,255,255,.035); padding: 5px; border: 1px solid rgba(255,255,255,.05); border-radius: 999px; }
.nav-link { border: 0; background: transparent; color: var(--muted); padding: 10px 15px; border-radius: 999px; font-size: .88rem; font-weight: 600; cursor: pointer; transition: .2s ease; }
.nav-link:hover { color: var(--ink); }
.nav-link.active { color: #07130f; background: var(--gold-light); box-shadow: 0 4px 18px rgba(216,173,87,.18); }
.profile-chip { justify-self: end; min-width: 168px; border: 1px solid var(--line); background: rgba(255,255,255,.045); border-radius: 14px; padding: 7px 10px 7px 7px; display: flex; align-items: center; gap: 10px; cursor: pointer; text-align: left; transition: .2s ease; }
.profile-chip:hover { border-color: rgba(216,173,87,.5); transform: translateY(-1px); }
.profile-chip img { width: 42px; height: 42px; border-radius: 10px; object-fit: cover; border: 1px solid rgba(216,173,87,.45); }
.profile-chip span { display: grid; overflow: hidden; }
.profile-chip strong { font-size: .88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.profile-chip small { color: var(--gold-light); font-weight: 700; }

main { flex: 1; padding: 40px clamp(20px, 4vw, 64px) 70px; }
.view { display: none; animation: reveal .35s ease both; }
.view.active { display: block; }
@keyframes reveal { from { opacity: 0; transform: translateY(8px); } }
.panel { background: linear-gradient(145deg, rgba(20,43,34,.92), rgba(8,22,16,.94)); border: 1px solid var(--line); box-shadow: var(--shadow); }
.eyebrow { color: var(--gold-light); text-transform: uppercase; letter-spacing: .15em; font-weight: 700; font-size: .72rem; display: inline-flex; align-items: center; gap: 8px; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: #3fe196; box-shadow: 0 0 12px #3fe196; }
h1, h2, p { margin-top: 0; }
h1, h2 { font-family: "Playfair Display", serif; }
h1 { font-size: clamp(2.35rem, 5vw, 4.4rem); line-height: 1.02; letter-spacing: -.035em; margin: 13px 0 16px; }
h2 { font-size: clamp(1.65rem, 3vw, 2.3rem); line-height: 1.12; margin-bottom: 10px; }
p { color: var(--muted); }

.lobby-grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(420px, .88fr); gap: 22px; }
.welcome-card { min-height: 450px; border-radius: 30px; padding: clamp(28px, 5vw, 64px); position: relative; overflow: hidden; }
.welcome-card::after { content: "♠"; position: absolute; right: 2%; bottom: -32%; font: 800 28rem/1 serif; color: rgba(216,173,87,.035); transform: rotate(12deg); }
.welcome-card h1 span { color: var(--gold-light); }
.welcome-card > p { max-width: 590px; font-size: 1.05rem; }
.quick-stats { display: flex; gap: 42px; margin: 40px 0 32px; position: relative; z-index: 1; }
.quick-stats > div { display: grid; gap: 4px; }
.quick-stats span { color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; }
.quick-stats strong { font: 700 1.35rem/1.2 "Playfair Display", serif; }
.welcome-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; position: relative; z-index: 2; }
.primary-btn, .secondary-btn, .wheel-button { border: 0; cursor: pointer; font-weight: 700; transition: .2s ease; }
.primary-btn { background: linear-gradient(135deg, var(--gold-light), var(--gold)); color: #0a1711; padding: 14px 20px; border-radius: 12px; box-shadow: 0 10px 28px rgba(216,173,87,.19); position: relative; z-index: 2; }
.primary-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(216,173,87,.28); }
.primary-btn:disabled { cursor: not-allowed; opacity: .42; transform: none; }
.secondary-btn { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.15); padding: 13px 18px; border-radius: 12px; }
.secondary-btn:hover { border-color: var(--gold); color: var(--gold-light); }
.full { width: 100%; }

.wheel-card { border-radius: 30px; padding: 30px; display: grid; grid-template-columns: .75fr 1.25fr; gap: 10px; align-items: center; overflow: hidden; position: relative; }
.wheel-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 70% 50%, rgba(216,173,87,.12), transparent 48%); }
.wheel-copy { position: relative; z-index: 2; }
.wheel-copy h2 { margin-top: 10px; }
.wheel-zone { display: grid; justify-items: center; position: relative; z-index: 2; }
.wheel { width: min(250px, 26vw); aspect-ratio: 1; border-radius: 50%; background: conic-gradient(#11583d 0 45deg,#8f3137 45deg 90deg,#174c39 90deg 135deg,#b08236 135deg 180deg,#0b6241 180deg 225deg,#7e2730 225deg 270deg,#1d5943 270deg 315deg,#c39c4e 315deg); border: 7px solid #d9b35f; box-shadow: 0 0 0 7px #4d371c, 0 20px 50px rgba(0,0,0,.5), inset 0 0 0 2px rgba(255,255,255,.15); display: grid; place-items: center; position: relative; transition: transform 4s cubic-bezier(.12,.72,.12,1); }
.wheel-labels { position: absolute; inset: 0; border-radius: 50%; }
.wheel-label { position: absolute; inset: 50% auto auto 50%; width: 48px; margin-left: -24px; margin-top: -.65rem; color: #fff9e9; font-size: .72rem; line-height: 1; font-weight: 800; text-align: center; text-shadow: 0 1px 3px #000; transform: rotate(var(--angle)) translateY(-86px) rotate(var(--counter-angle)); transform-origin: center; }
.wheel-center { width: 55px; height: 55px; border-radius: 50%; display: grid; place-items: center; background: #08150f; color: var(--gold-light); border: 3px solid var(--gold); font: 800 1.25rem "Playfair Display", serif; z-index: 2; }
.wheel-pointer { width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 22px solid var(--gold-light); position: absolute; top: -4px; z-index: 4; filter: drop-shadow(0 3px 4px #000); }
.wheel-button { background: #f5f0e6; color: #07130f; border-radius: 999px; padding: 10px 18px; margin-top: -10px; z-index: 4; }
.wheel-button:hover { transform: scale(1.03); }
.wheel-button:disabled { opacity: .48; cursor: not-allowed; }

.section-block { padding-top: 54px; }
.section-heading, .page-heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 24px; }
.section-heading h2 { margin-top: 8px; margin-bottom: 0; }
.text-btn { border: 0; background: transparent; color: var(--gold-light); cursor: pointer; font-weight: 700; padding: 8px 0; }
.featured-tables { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.table-card { min-height: 250px; border-radius: 22px; padding: 22px; position: relative; overflow: hidden; border: 1px solid color-mix(in srgb, var(--table-accent) 55%, transparent); background: linear-gradient(90deg, rgba(3,8,7,.94), rgba(3,8,7,.73) 58%, rgba(3,8,7,.32)), linear-gradient(145deg, color-mix(in srgb, var(--table-color) 45%, transparent), transparent 70%), var(--table-image) center / cover no-repeat; transition: .25s ease; isolation: isolate; }
.table-card::before { content:""; position:absolute; inset:0; z-index:0; background:linear-gradient(180deg, color-mix(in srgb, var(--table-color) 24%, transparent), transparent 48%, rgba(0,0,0,.45)); }
.table-card > * { position: relative; z-index: 2; }
.table-card:hover { transform: translateY(-4px); border-color: var(--table-accent); box-shadow: 0 22px 50px rgba(0,0,0,.32), 0 0 28px color-mix(in srgb, var(--table-color) 30%, transparent); }
.table-card::after { content: attr(data-code); position: absolute; right: 7px; bottom: -20px; font: 800 6rem/1 "Playfair Display", serif; color: rgba(255,255,255,.035); }
.table-card.locked { filter: saturate(.42); opacity: .66; }
.table-card.locked:hover { transform: none; border-color: rgba(255,255,255,.12); box-shadow: none; }
.table-card.next-destination { border-color: rgba(216,173,87,.52); box-shadow: inset 0 0 35px rgba(216,173,87,.06); }
.table-card.playable { cursor: pointer; }
.lock-badge { display: inline-flex; align-items: center; gap: 5px; color: #a8b2aa; font-size: .76rem; font-weight: 700; }
.city-row { display: flex; justify-content: space-between; align-items: start; }
.city-row h3 { margin: 4px 0 2px; font: 700 1.55rem "Playfair Display", serif; }
.city-row p { font-size: .78rem; }
.city-marker { width: 43px; height: 43px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: color-mix(in srgb, var(--table-color) 74%, #080b0a); border: 1px solid var(--table-accent); box-shadow: 0 0 24px color-mix(in srgb, var(--table-color) 55%, transparent); font-weight: 800; }
.table-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 18px 0; }
.table-meta span { font-size: .76rem; color: var(--muted); }
.table-meta strong { display: block; color: var(--ink); font-size: .96rem; margin-top: 2px; }
.table-action { display: flex; justify-content: flex-end; align-items: center; gap: 12px; position: relative; z-index: 2; }
.unlock-requirement { margin-right: auto; color: var(--muted); font-size: .76rem; }
.join-btn { border: 1px solid rgba(216,173,87,.34); background: rgba(216,173,87,.08); color: var(--gold-light); border-radius: 9px; padding: 9px 13px; cursor: pointer; font-weight: 700; }
.join-btn:hover { background: var(--gold); color: #07130f; }
.join-btn.registered { background: rgba(25,165,109,.16); color: #67dda2; border-color: rgba(25,165,109,.45); }
.join-btn:disabled:not(.registered) { opacity: .35; cursor: not-allowed; }

.world-cup-banner { margin-top: 54px; padding: 30px 34px; border-radius: 24px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 25px; border: 1px solid rgba(216,173,87,.3); background: linear-gradient(105deg, rgba(110,37,43,.52), rgba(18,40,31,.95) 60%, rgba(171,126,47,.2)); }
.world-cup-banner h2 { margin: 6px 0; }
.world-cup-banner p { margin: 0; }
.cup-icon { width: 68px; height: 68px; border: 1px solid rgba(216,173,87,.55); border-radius: 18px; display: grid; place-items: center; color: var(--gold-light); font-size: 2rem; transform: rotate(8deg); }

.page-heading { align-items: center; }
.page-heading h1 { font-size: clamp(2.2rem, 4.5vw, 3.7rem); margin-bottom: 10px; }
.page-heading p { margin-bottom: 0; }
.balance-card, .season-badge { flex: 0 0 auto; border: 1px solid var(--line); background: rgba(255,255,255,.04); border-radius: 14px; padding: 12px 18px; }
.balance-card { display: grid; min-width: 150px; }
.balance-card span { color: var(--muted); font-size: .75rem; }
.balance-card strong { color: var(--gold-light); font-size: 1.25rem; }
.season-badge { color: var(--gold-light); font-weight: 600; }
.table-filters { display: flex; gap: 7px; margin: 28px 0 22px; }
.filter-btn { border: 1px solid rgba(255,255,255,.09); background: rgba(255,255,255,.035); color: var(--muted); padding: 9px 14px; border-radius: 9px; cursor: pointer; }
.filter-btn.active { color: #07130f; background: var(--gold-light); border-color: transparent; font-weight: 700; }
.tables-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.progression-line { margin-bottom: 20px; padding: 13px 16px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.03); color: var(--muted); }
.progression-line strong { color: var(--gold-light); }
.empty-state { grid-column: 1 / -1; border: 1px dashed var(--line); border-radius: 20px; padding: 50px; text-align: center; color: var(--muted); }

.game-view.active { animation: reveal .25s ease both; }
.game-topbar { display: grid; grid-template-columns: 190px 1fr 190px; align-items: center; gap: 20px; margin-bottom: 20px; }
.game-topbar h1 { margin: 2px 0 0; font-size: clamp(1.8rem,4vw,3rem); text-align: center; }
.game-topbar .eyebrow { display: flex; justify-content: center; }
.game-back { border: 1px solid var(--line); background: rgba(255,255,255,.04); border-radius: 11px; padding: 11px 14px; cursor: pointer; justify-self: start; }
.game-back:hover { border-color: var(--gold); color: var(--gold-light); }
.game-bankroll { display: grid; text-align: right; }
.game-bankroll span { color: var(--muted); font-size: .73rem; text-transform: uppercase; letter-spacing: .07em; }
.game-bankroll strong { color: var(--gold-light); font: 700 1.25rem "Playfair Display",serif; }
.poker-room { max-width: 1120px; margin: 0 auto; }
.game-hud { display: grid; grid-template-columns: repeat(4,1fr); max-width: 720px; margin: 0 auto 13px; border: 1px solid var(--line); background: rgba(6,20,14,.78); border-radius: 13px; overflow: hidden; }
.game-hud > div { display: grid; justify-items: center; padding: 8px 12px; border-right: 1px solid var(--line); }
.game-hud > div:last-child { border-right: 0; }
.game-hud span { color: var(--muted); font-size: .67rem; text-transform: uppercase; letter-spacing: .08em; }
.game-hud strong { color: var(--ink); }
.poker-table { --table-color:#0d7a50; --table-accent:#d8ad57; --table-image:url('assets/tables/dakar.webp'); height: 590px; position: relative; border-radius: 48% / 40%; background: linear-gradient(rgba(1,5,4,.08), rgba(1,5,4,.2)), var(--table-image) center / cover no-repeat; border: 3px solid var(--table-accent); box-shadow: inset 0 0 95px rgba(0,0,0,.38),0 35px 70px rgba(0,0,0,.42),0 0 40px color-mix(in srgb, var(--table-color) 30%, transparent); overflow: visible; }
.poker-table::before { content:""; position:absolute; inset:7%; border:1px solid color-mix(in srgb, var(--table-accent) 55%, transparent); border-radius:48% / 40%; box-shadow:inset 0 0 80px rgba(0,0,0,.18); }
.table-felt-brand { position: absolute; z-index:2; inset: 57% auto auto 50%; transform: translate(-50%,-50%); display: grid; place-items: center; color: color-mix(in srgb, var(--table-accent) 30%, transparent); font: 800 1.35rem "Playfair Display",serif; letter-spacing:.18em; text-shadow:0 2px 6px rgba(0,0,0,.4); }
.table-felt-brand small { font:800 .55rem "DM Sans",sans-serif; letter-spacing:.35em; }
.table-felt-brand > span > span { display:inline-grid; place-items:center; width:1.1em; height:1.1em; margin:0 .02em; border:.09em solid currentColor; border-radius:50%; font-family:"DM Sans",sans-serif; letter-spacing:-.18em; text-indent:-.18em; transform:scaleX(1.06); }
.community-area { position: absolute; z-index: 3; inset: 43% auto auto 50%; transform: translate(-50%,-50%); display:grid; justify-items:center; gap:10px; width: 430px; }
.community-cards { display:flex; justify-content:center; gap:7px; min-height:79px; }
.playing-card { width:56px; height:78px; flex:0 0 auto; overflow:visible; border-radius:8px; background:linear-gradient(145deg,#fffdf7,#e8e3d9); border:1px solid #b8ad98; color:#111; box-shadow:0 6px 12px rgba(0,0,0,.28); display:grid; align-content:space-between; padding:5px; font-weight:800; line-height:1; }
.playing-card.red { color:#b21f31; }
.playing-card .card-suit { font-size:1.45rem; text-align:center; }
.playing-card.back { place-items:center; align-content:center; color:var(--gold-light); background:repeating-linear-gradient(45deg,#102c4b 0 5px,#173c61 5px 10px); border:2px solid #e1c277; font:800 1.2rem "Playfair Display",serif; }
.playing-card.empty { background:rgba(0,0,0,.12); border:1px dashed rgba(255,255,255,.18); box-shadow:none; }
.pot-chip { border-radius:999px; background:rgba(4,20,13,.78); border:1px solid rgba(216,173,87,.35); padding:5px 13px; color:var(--muted); font-size:.76rem; }
.pot-chip strong { color:var(--gold-light); margin-left:4px; }
.game-seats { position:absolute; inset:0; z-index:4; overflow:visible; }
.game-seat { position:absolute; width:164px; min-height:104px; overflow:visible; text-align:center; transform:translate(-50%,-50%); }
.game-seat .seat-avatar { width:54px; height:54px; border-radius:50%; object-fit:cover; border:2px solid #9e8250; box-shadow:0 7px 16px rgba(0,0,0,.45); background:#102119; }
.game-seat.current-turn .seat-avatar { border-color:#69e0a6; box-shadow:0 0 0 4px rgba(51,216,139,.18),0 7px 18px #000; }
.game-seat.eliminated { filter:grayscale(1); opacity:.42; }
.game-seat.folded { opacity:.58; }
.seat-name { display:block; max-width:145px; margin:1px auto 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:700; text-shadow:0 2px 4px #000; }
.seat-stack { color:var(--gold-light); font-size:.76rem; text-shadow:0 2px 4px #000; }
.seat-status { display:inline-block; margin-left:4px; color:#83e3ae; font-size:.66rem; text-transform:uppercase; }
.seat-wager { position:absolute; z-index:6; display:flex; align-items:center; gap:5px; padding:3px 7px 3px 4px; border:1px solid rgba(243,213,142,.55); border-radius:999px; background:rgba(5,14,10,.88); box-shadow:0 5px 14px rgba(0,0,0,.46); color:#fff5d8; font-size:.68rem; line-height:1; white-space:nowrap; pointer-events:none; }
.chip-stack { position:relative; width:24px; height:18px; flex:0 0 24px; }
.chip-stack i { position:absolute; left:1px; width:21px; height:8px; border:2px dashed #f6d98f; border-radius:50%; background:#a52f3b; box-shadow:0 1px 2px rgba(0,0,0,.45); }
.chip-stack i:nth-child(1) { top:8px; }
.chip-stack i:nth-child(2) { top:4px; background:#174f8a; }
.chip-stack i:nth-child(3) { top:0; background:#a52f3b; }
.game-seat.seat-0 .seat-wager { left:50%; top:-50px; transform:translateX(-50%); }
.game-seat.seat-3 .seat-wager { left:50%; top:calc(100% + 8px); transform:translateX(-50%); }
.game-seat.seat-1 .seat-wager,
.game-seat.seat-2 .seat-wager { left:calc(100% - 10px); top:48%; transform:translateY(-50%); }
.game-seat.seat-4 .seat-wager,
.game-seat.seat-5 .seat-wager { right:calc(100% - 10px); top:48%; transform:translateY(-50%); }
.poker-table.collecting-bets .pot-chip { animation:pot-collect .44s ease both; }
@keyframes pot-collect { 0% { transform:scale(1); box-shadow:0 0 0 rgba(243,213,142,0); } 45% { transform:scale(1.18); box-shadow:0 0 22px rgba(243,213,142,.5); } 100% { transform:scale(1); box-shadow:0 0 0 rgba(243,213,142,0); } }
.seat-cards { position:relative; z-index:5; width:100%; height:auto; min-height:50px; display:flex; flex:0 0 auto; align-items:flex-start; justify-content:center; gap:4px; margin-top:-13px; overflow:visible; }
.seat-cards .playing-card { width:35px; height:49px; border-radius:5px; padding:3px; font-size:.66rem; }
.seat-cards .playing-card .card-suit { font-size:.88rem; }
.game-seat.seat-0 { left:50%; top:84%; }
.game-seat.seat-1 { left:18%; top:68%; }
.game-seat.seat-2 { left:20%; top:28%; }
.game-seat.seat-3 { left:50%; top:17%; }
.game-seat.seat-4 { left:80%; top:28%; }
.game-seat.seat-5 { left:82%; top:68%; }
.dealer-button { display:inline-grid; place-items:center; width:19px; height:19px; margin-left:3px; border-radius:50%; background:#f4eee0; color:#18231e; font-size:.62rem; font-weight:900; vertical-align:middle; }
.hand-summary { min-height:56px; margin:14px auto 10px; display:flex; align-items:center; justify-content:space-between; gap:18px; max-width:850px; padding:10px 16px; border:1px solid var(--line); border-radius:12px; background:rgba(6,19,14,.78); }
.hand-summary span { color:var(--muted); }
.hand-summary strong { color:var(--gold-light); }
.game-actions { display:grid; grid-template-columns:repeat(2,minmax(120px,1fr)) minmax(210px,1.4fr) repeat(2,minmax(110px,1fr)); gap:9px; max-width:920px; margin:0 auto; }
.player-hole-card-panel { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:14px; min-height:112px; padding:8px 14px; border:1px solid rgba(216,173,87,.24); border-radius:14px; background:radial-gradient(circle at 50% 35%,rgba(216,173,87,.1),rgba(0,0,0,.18)); }
.player-hole-card-panel > span { color:var(--gold-light); font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.player-hole-cards { display:flex; justify-content:center; gap:8px; min-width:132px; }
.player-hole-cards .playing-card { width:58px; height:82px; padding:6px; font-size:1rem; }
.player-hole-cards .playing-card .card-suit { font-size:1.55rem; }
.poker-action { min-height:48px; border-radius:11px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.055); cursor:pointer; font-weight:800; }
.poker-action:hover:not(:disabled) { transform:translateY(-2px); }
.poker-action.fold { color:#ff9ba2; border-color:rgba(181,64,73,.4); }
.poker-action.call { color:#dcf7e8; border-color:rgba(53,175,111,.38); }
.poker-action.raise { color:#1a160d; background:var(--gold); border-color:var(--gold-light); }
.poker-action.allin { color:#fff; background:#882f38; border-color:#c65861; }
.poker-action.next { grid-column:1/-1; color:#07130f; background:var(--gold-light); }
.poker-action:disabled { opacity:.35; cursor:not-allowed; }
.raise-control { min-height:48px; border:1px solid var(--line); background:rgba(0,0,0,.16); border-radius:11px; padding:5px 10px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:8px; color:var(--muted); font-size:.72rem; }
.raise-control input { min-width:80px; accent-color:var(--gold); }
.raise-control output { color:var(--gold-light); font-weight:800; }
.hidden { display:none !important; }
.game-log-wrap { max-width:920px; margin:16px auto 0; }
.game-log { height:110px; overflow-y:auto; margin-top:7px; padding:11px 14px; border-radius:12px; background:rgba(0,0,0,.24); border:1px solid rgba(255,255,255,.06); color:var(--muted); font-size:.78rem; }
.game-log p { margin:0 0 3px; color:inherit; }
.game-log p:last-child { color:var(--ink); }
.result-overlay { position:fixed; z-index:120; inset:0; padding:22px; display:grid; place-items:center; background:rgba(1,7,4,.86); backdrop-filter:blur(12px); }
.result-card { width:min(520px,100%); padding:38px; border-radius:25px; text-align:center; background:linear-gradient(145deg,#153428,#07140f); border:1px solid rgba(216,173,87,.48); box-shadow:0 35px 100px #000; }
.result-card .result-place { font:800 4rem "Playfair Display",serif; color:var(--gold-light); }
.result-card h2 { margin:4px 0 10px; }
.result-card .primary-btn { margin-top:12px; }

.podium { display: grid; grid-template-columns: repeat(3, 1fr); align-items: end; gap: 14px; max-width: 850px; margin: 38px auto 32px; }
.podium-card { text-align: center; padding: 25px 18px; border: 1px solid var(--line); background: linear-gradient(180deg, rgba(216,173,87,.13), rgba(13,29,23,.84)); border-radius: 20px 20px 5px 5px; }
.podium-card.first { min-height: 240px; order: 2; background: linear-gradient(180deg, rgba(216,173,87,.25), rgba(13,29,23,.92)); }
.podium-card.second { min-height: 205px; order: 1; }
.podium-card.third { min-height: 190px; order: 3; }
.podium-card img { width: 78px; height: 78px; border-radius: 50%; object-fit: cover; border: 3px solid var(--gold); }
.podium-card strong { display: block; font: 700 1.15rem "Playfair Display", serif; margin: 9px 0 2px; }
.podium-card small { color: var(--gold-light); }
.podium-rank { width: 30px; height: 30px; margin: -12px auto 5px; border-radius: 50%; background: var(--gold-light); color: #07130f; display: grid; place-items: center; font-weight: 800; }
.ranking-panel { border-radius: 22px; overflow: hidden; box-shadow: none; }
.ranking-head, .rank-row { display: grid; grid-template-columns: 70px minmax(170px, 1fr) 120px 150px; align-items: center; gap: 12px; padding: 12px 22px; }
.ranking-head { color: var(--muted); text-transform: uppercase; font-size: .68rem; letter-spacing: .1em; border-bottom: 1px solid var(--line); }
.ranking-list { max-height: 630px; overflow: auto; scrollbar-color: rgba(216,173,87,.5) transparent; }
.rank-row { min-height: 64px; border-bottom: 1px solid rgba(255,255,255,.045); }
.rank-row:last-child { border-bottom: 0; }
.rank-row.qualifier { background: rgba(216,173,87,.04); }
.rank-row.current { background: rgba(25,165,109,.12); box-shadow: inset 3px 0 var(--green-bright); }
.rank-number { font: 700 1.06rem "Playfair Display", serif; color: var(--muted); }
.qualifier .rank-number { color: var(--gold-light); }
.rank-player { display: flex; align-items: center; gap: 11px; min-width: 0; }
.rank-player img { width: 39px; height: 39px; border-radius: 10px; object-fit: cover; }
.rank-player span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.rank-player small { display:block; margin-top:2px; color:var(--muted); font-size:.66rem; font-weight:500; }
.rank-row > span:last-child { color: var(--gold-light); font-weight: 700; }

.cup-hero { display: grid; grid-template-columns: auto 1fr auto; gap: 30px; align-items: center; padding: 30px 0 40px; }
.cup-hero h1 { margin-bottom: 9px; }
.cup-hero p { margin-bottom: 0; }
.cup-emblem { width: 110px; height: 110px; border-radius: 50%; border: 2px solid var(--gold); box-shadow: inset 0 0 0 7px rgba(216,173,87,.08), 0 0 55px rgba(216,173,87,.13); display: grid; place-items: center; position: relative; }
.cup-emblem span { font: 800 3.1rem "Playfair Display", serif; color: var(--gold-light); }
.cup-emblem small { position: absolute; right: 12px; bottom: 6px; color: var(--red); font-size: 1.45rem; }
.prize-block { display: grid; text-align: right; }
.prize-block span, .prize-block small { color: var(--muted); }
.prize-block strong { font: 700 clamp(1.8rem,3vw,2.8rem) "Playfair Display", serif; color: var(--gold-light); }
.final-table { min-height: 540px; border-radius: 40px; position: relative; display: grid; place-items: center; background: radial-gradient(ellipse, #126843 0 34%, #0c452f 35% 53%, #3a2917 54% 57%, #0b1913 58%); overflow: hidden; }
.final-table::after { content: ""; position: absolute; width: 55%; height: 47%; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; }
.felt-ring { color: rgba(216,173,87,.3); text-align: center; line-height: 1; letter-spacing: .18em; font: 700 1.5rem "Playfair Display", serif; z-index: 2; }
.felt-ring b { color: rgba(216,173,87,.45); font-size: 3rem; }
.qualifier-seat { position: absolute; z-index: 3; width: 135px; text-align: center; }
.qualifier-seat img { width: 76px; height: 76px; border-radius: 50%; object-fit: cover; border: 3px solid var(--gold); box-shadow: 0 8px 20px rgba(0,0,0,.5); }
.qualifier-seat strong { display: block; margin-top: 5px; text-shadow: 0 2px 5px #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qualifier-seat small { color: var(--gold-light); }
.qualifier-seat.seat-1 { top: 25px; left: 50%; transform: translateX(-50%); }
.qualifier-seat.seat-2 { top: 120px; right: 8%; }
.qualifier-seat.seat-3 { bottom: 55px; right: 17%; }
.qualifier-seat.seat-4 { bottom: 25px; left: 50%; transform: translateX(-50%); }
.qualifier-seat.seat-5 { bottom: 55px; left: 17%; }
.qualifier-seat.seat-6 { top: 120px; left: 8%; }
.qualification-note { margin-top: 20px; padding: 16px 20px; border-radius: 12px; border-left: 3px solid var(--gold); background: rgba(216,173,87,.07); color: var(--muted); }
.world-cup-rules { margin-top:20px; padding:26px; display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,.45fr); gap:28px; align-items:center; }
.world-cup-rules h2 { margin:7px 0 8px; }
.world-cup-rules p { margin:0; }
.world-cup-rules ol { margin:17px 0 0; padding-left:20px; color:var(--muted); display:grid; gap:7px; }
.world-cup-action { display:grid; gap:9px; padding:18px; border:1px solid var(--line); border-radius:15px; background:rgba(0,0,0,.16); }
.world-cup-action label { color:var(--muted); font-size:.78rem; }
.world-cup-action select { width:100%; padding:11px; border:1px solid rgba(255,255,255,.13); border-radius:10px; color:var(--ink); background:#0b2118; }
.world-cup-action small { color:var(--muted); line-height:1.35; }

.stats-profile { padding: 23px 28px; border-radius: 22px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; margin-bottom: 20px; box-shadow: none; }
.stats-profile img { width: 80px; height: 80px; border-radius: 18px; object-fit: cover; border: 2px solid var(--gold); }
.stats-profile span, .rank-medallion small { color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; }
.stats-profile h2 { margin: 1px 0; }
.stats-profile p { margin: 0; }
.rank-medallion { text-align: right; display: grid; }
.rank-medallion strong { color: var(--gold-light); font: 700 2rem "Playfair Display", serif; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.stat-card { min-height: 180px; padding: 24px; border: 1px solid var(--line); background: rgba(13,29,23,.73); border-radius: 20px; display: flex; flex-direction: column; }
.stat-card.highlight { background: linear-gradient(145deg, rgba(110,37,43,.43), rgba(13,29,23,.9)); }
.stat-card.wide { grid-column: span 2; }
.stat-card small { color: var(--muted); text-transform: uppercase; font-size: .69rem; letter-spacing: .09em; }
.stat-card strong { font: 700 2rem "Playfair Display", serif; margin: 9px 0 3px; }
.stat-card p { margin: auto 0 0; font-size: .82rem; }
.stat-symbol { color: var(--gold-light); font-size: 1.4rem; margin-bottom: 18px; }
.progress-track, .style-bars span { height: 7px; background: rgba(255,255,255,.07); border-radius: 999px; overflow: hidden; }
.progress-track { margin-top: 12px; }
.progress-track span, .style-bars i { height: 100%; display: block; background: linear-gradient(90deg, var(--green-bright), var(--gold)); border-radius: inherit; }
.style-bars { display: grid; gap: 5px; margin-top: 10px; }

footer { display: flex; justify-content: center; align-items: center; gap: 18px; padding: 24px clamp(20px,4vw,64px); color: #6f7e75; border-top: 1px solid rgba(255,255,255,.05); font-size: .76rem; }
footer strong { color: var(--gold-light); font: 700 1rem "Playfair Display", serif; letter-spacing: .12em; }
footer a { color: #9aa89f; text-decoration: none; }
footer a:hover, footer a:focus-visible { color: var(--gold-light); text-decoration: underline; text-underline-offset: 3px; }
.install-app { border:1px solid rgba(216,173,87,.28); background:rgba(216,173,87,.06); color:var(--gold-light); border-radius:999px; padding:8px 13px; cursor:pointer; font-size:.72rem; font-weight:700; }
.install-app.ready { background:var(--gold-light); color:#07130f; box-shadow:0 6px 22px rgba(216,173,87,.18); }
.install-app:disabled { cursor: default; opacity: .68; }
.install-app-primary { min-height: 46px; padding: 12px 18px; border-radius: 12px; font-size: .88rem; }
.mobile-nav { display: none; }

.modal-backdrop { position: fixed; inset: 0; z-index: 100; background: rgba(1,7,4,.87); backdrop-filter: blur(14px); padding: 24px; display: grid; place-items: center; overflow-y: auto; }
.modal-backdrop.hidden { display: none; }
.profile-modal-card { width: min(720px, 100%); max-height: calc(100vh - 48px); overflow-y: auto; background: linear-gradient(145deg,#132c22,#07140f); border: 1px solid rgba(216,173,87,.34); border-radius: 28px; padding: clamp(26px,5vw,48px); box-shadow: 0 40px 100px #000; position: relative; }
.profile-modal-card h1 { font-size: clamp(2.1rem,6vw,3.4rem); }
.install-modal-card { width: min(540px, 100%); }
.install-modal-card h2 { margin-top: 14px; font-size: clamp(1.9rem, 6vw, 2.8rem); }
.install-mark { width: 64px; height: 64px; display: grid; place-items: center; border: 2px solid var(--gold); border-radius: 18px; background: radial-gradient(circle at 35% 25%, #1b4938, #08150f 70%); color: var(--gold-light); font: 800 1.8rem "Playfair Display", serif; box-shadow: 0 14px 35px rgba(0,0,0,.35); margin-bottom: 24px; }
.install-steps { display: grid; gap: 12px; margin: 24px 0; padding: 0; list-style: none; counter-reset: install-step; }
.install-steps li { counter-increment: install-step; display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: center; color: var(--ink); line-height: 1.45; }
.install-steps li::before { content: counter(install-step); width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: rgba(216,173,87,.14); border: 1px solid rgba(216,173,87,.35); color: var(--gold-light); font-weight: 800; }
.install-note { min-height: 1.5em; padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,.045); font-size: .88rem; }
.featured-player-card { width:min(480px,100%); text-align:center; }
.featured-player-card > img { width:112px; height:112px; margin:16px auto; display:block; object-fit:cover; border-radius:50%; border:3px solid var(--gold); box-shadow:0 15px 45px rgba(0,0,0,.5); }
.featured-player-card h2 { margin-bottom:10px; }
.modal-brand { position: absolute; right: 35px; top: 30px; opacity: .14; }
.modal-close { position: absolute; right: 17px; top: 14px; width: 36px; height: 36px; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.04); border-radius: 50%; cursor: pointer; font-size: 1.4rem; z-index: 3; }
.name-field { display: grid; gap: 7px; margin: 25px 0 20px; color: var(--muted); font-size: .82rem; }
.name-field input { background: rgba(0,0,0,.25); color: var(--ink); border: 1px solid rgba(255,255,255,.14); border-radius: 11px; padding: 13px 15px; font-size: 1rem; }
.name-field input::placeholder { color: #647269; }
fieldset { border: 0; padding: 0; margin: 0 0 24px; }
legend { color: var(--muted); font-size: .82rem; margin-bottom: 10px; }
.avatar-grid { display: grid; grid-template-columns: repeat(10, 1fr); gap: 8px; }
.avatar-option { aspect-ratio: 1; border: 2px solid transparent; padding: 0; border-radius: 11px; overflow: hidden; background: transparent; cursor: pointer; transition: .18s ease; }
.avatar-option img { width: 100%; height: 100%; object-fit: cover; display: block; }
.avatar-option:hover { transform: scale(1.07); }
.avatar-option.selected { border-color: var(--gold-light); box-shadow: 0 0 0 3px rgba(216,173,87,.16); transform: scale(1.07); }
.form-error { color: #ff9199; min-height: 1.5em; margin: 8px 0 0; text-align: center; font-size: .82rem; }
.toast-region { position: fixed; z-index: 150; right: 22px; bottom: 22px; display: grid; gap: 8px; }
.toast { color: var(--ink); background: #17392c; border: 1px solid rgba(216,173,87,.35); border-radius: 12px; padding: 13px 17px; box-shadow: 0 15px 45px rgba(0,0,0,.45); animation: toast-in .25s ease both; }
@keyframes toast-in { from { opacity: 0; transform: translateY(10px); } }

@media (max-width: 1080px) {
  .topbar { grid-template-columns: 220px 1fr auto; }
  .desktop-nav { gap: 0; }
  .nav-link { padding-inline: 10px; }
  .profile-chip { min-width: 0; }
  .profile-chip span { display: none; }
  .lobby-grid { grid-template-columns: 1fr; }
  .wheel-card { min-height: 380px; }
  .wheel { width: 250px; }
  .tables-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
  body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .topbar { min-height: calc(76px + env(safe-area-inset-top)); grid-template-columns: 1fr auto; padding: calc(12px + env(safe-area-inset-top)) 18px 12px; }
  .brand-word { font-size: 1.65rem; }
  .brand-sub, .desktop-nav { display: none; }
  main { padding: 26px 16px 50px; }
  .welcome-card { min-height: auto; padding: 28px 22px; }
  .welcome-actions { display: grid; grid-template-columns: 1fr; }
  .welcome-actions > button { width: 100%; }
  .quick-stats { gap: 20px; justify-content: space-between; margin: 30px 0; }
  .quick-stats strong { font-size: 1.08rem; }
  .wheel-card { grid-template-columns: 1fr; text-align: center; padding: 28px 20px; }
  .wheel { width: 225px; }
  .featured-tables, .tables-grid { grid-template-columns: 1fr; }
  .section-heading, .page-heading { align-items: start; flex-direction: column; }
  .world-cup-banner { grid-template-columns: auto 1fr; padding: 24px; }
  .world-cup-banner .secondary-btn { grid-column: 1 / -1; }
  .podium { gap: 6px; }
  .podium-card { padding: 19px 7px; }
  .podium-card img { width: 58px; height: 58px; }
  .podium-card strong { font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ranking-head, .rank-row { grid-template-columns: 46px minmax(150px,1fr) 90px; padding-inline: 13px; }
  .ranking-head span:nth-child(3), .rank-row > span:nth-child(3) { display: none; }
  .ranking-head span:last-child, .rank-row > span:last-child { text-align: right; }
  .cup-hero { grid-template-columns: auto 1fr; gap: 16px; }
  .cup-emblem { width: 75px; height: 75px; }
  .cup-emblem span { font-size: 2.1rem; }
  .prize-block { grid-column: 1 / -1; text-align: left; }
  .world-cup-rules { grid-template-columns:1fr; padding:20px; }
  .final-table { min-height: 500px; }
  .qualifier-seat { width: 100px; }
  .qualifier-seat img { width: 58px; height: 58px; }
  .qualifier-seat.seat-2 { right: 2%; }.qualifier-seat.seat-3 { right: 7%; }.qualifier-seat.seat-5 { left: 7%; }.qualifier-seat.seat-6 { left: 2%; }
  .stats-profile { grid-template-columns: auto 1fr; padding: 18px; }
  .rank-medallion { grid-column: 1 / -1; text-align: left; border-top: 1px solid var(--line); padding-top: 10px; }
  .stats-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .stat-card { padding: 18px; min-height: 160px; }
  .stat-card strong { font-size: 1.45rem; }
  .stat-card.wide { grid-column: span 2; }
  footer { display: grid; text-align: center; justify-content: center; }
  .mobile-nav { position: fixed; z-index: 40; bottom: 0; left: 0; right: 0; height: calc(70px + env(safe-area-inset-bottom)); padding-bottom:env(safe-area-inset-bottom); display: grid; grid-template-columns: repeat(4,1fr); background: rgba(4,12,8,.95); backdrop-filter: blur(18px); border-top: 1px solid var(--line); }
  .mobile-nav button { border: 0; background: transparent; color: #819087; display: grid; place-items: center; align-content: center; gap: 1px; font-size: .67rem; cursor: pointer; }
  .mobile-nav button span { font-size: 1.1rem; }
  .mobile-nav button.active { color: var(--gold-light); }
  .avatar-grid { grid-template-columns: repeat(5, 1fr); }
  .profile-modal-card { max-height: calc(100vh - 24px); padding: 34px 20px 24px; }
  .game-topbar { grid-template-columns:auto 1fr; }
  .game-topbar > div:nth-child(2) { order:-1; grid-column:1/-1; }
  .game-topbar h1 { font-size:2rem; }
  .game-bankroll { text-align:right; }
  .game-hud { grid-template-columns:repeat(2,1fr); }
  .game-hud > div:nth-child(2) { border-right:0; }
  .game-hud > div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .poker-table { height:520px; border-radius:42% / 25%; overflow:visible; margin:35px 0 55px; }
  .community-area { width:310px; top:45%; }
  .playing-card { width:47px; height:67px; }
  .game-seat { width:118px; }
  .game-seat .seat-avatar { width:46px; height:46px; }
  .seat-name { max-width:105px; font-size:.76rem; }
  .game-seat.seat-0 { left:50%; top:91%; }
  .game-seat.seat-1 { left:15%; top:70%; }
  .game-seat.seat-2 { left:17%; top:28%; }
  .game-seat.seat-3 { left:50%; top:11%; }
  .game-seat.seat-4 { left:83%; top:28%; }
  .game-seat.seat-5 { left:85%; top:70%; }
  .game-actions { grid-template-columns:repeat(2,1fr); }
  .player-hole-card-panel { min-height:105px; }
  .raise-control { grid-column:1/-1; order:-1; }
  .poker-action.next { grid-column:1/-1; }
  .hand-summary { align-items:flex-start; flex-direction:column; gap:2px; }
  .game-log { height:95px; }
}

@media (max-width: 430px) {
  h1 { font-size: 2.25rem; }
  .quick-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; }
  .quick-stats span { font-size: .64rem; }
  .table-filters { overflow-x: auto; padding-bottom: 5px; }
  .filter-btn { white-space: nowrap; }
  .stats-grid { grid-template-columns: 1fr; }
  .stat-card.wide { grid-column: span 1; }
  .final-table { min-height: 470px; }
  .qualifier-seat strong { font-size: .72rem; }
  .community-area { width:275px; }
  .community-cards { gap:3px; }
  .playing-card { width:42px; height:61px; }
  .game-seat { width:102px; }
  .game-seat.seat-1 { left:12%; }.game-seat.seat-2 { left:14%; }.game-seat.seat-4 { left:86%; }.game-seat.seat-5 { left:88%; }
}

@media (orientation: landscape) and (max-width: 1280px) {
  body.game-mode { height: 100dvh; min-height: 0; padding: 0; overflow: hidden; }
  body.game-mode .ambient,
  body.game-mode .topbar,
  body.game-mode .mobile-nav,
  body.game-mode footer { display: none; }
  body.game-mode .app-shell { width: 100%; height: 100dvh; min-height: 0; overflow: hidden; }
  body.game-mode main { height: 100dvh; min-height: 0; padding: max(5px, env(safe-area-inset-top)) max(7px, env(safe-area-inset-right)) max(5px, env(safe-area-inset-bottom)) max(7px, env(safe-area-inset-left)); overflow: hidden; }
  body.game-mode .game-view.active { height: 100%; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
  body.game-mode .game-topbar { flex: 0 0 40px; grid-template-columns: 155px 1fr 135px; gap: 8px; margin: 0 0 5px; }
  body.game-mode .game-back { min-height: 36px; padding: 6px 10px; font-size: .75rem; }
  body.game-mode .game-topbar h1 { margin: 0; font-size: 1.2rem; line-height: 1; }
  body.game-mode .game-topbar .eyebrow { display: none; }
  body.game-mode .game-bankroll span { font-size: .58rem; }
  body.game-mode .game-bankroll strong { font-size: .92rem; }
  body.game-mode .poker-room { flex: 1 1 auto; width: 100%; max-width: none; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) clamp(184px, 29vw, 245px); grid-template-rows: 34px minmax(0, 1fr); gap: 5px 8px; }
  body.game-mode .game-hud { grid-column: 1; grid-row: 1; width: 100%; max-width: none; height: 34px; margin: 0; grid-template-columns: repeat(4, 1fr); border-radius: 9px; }
  body.game-mode .game-hud > div { padding: 2px 5px; border-right: 1px solid var(--line); border-bottom: 0; }
  body.game-mode .game-hud span { font-size: .5rem; line-height: 1; }
  body.game-mode .game-hud strong { font-size: .7rem; line-height: 1; }
  body.game-mode .poker-table { grid-column: 1; grid-row: 2; width: 100%; height: 100%; min-height: 0; margin: 0; overflow: visible; border-width: 2px; border-radius: 46% / 38%; box-shadow: inset 0 0 55px rgba(0,0,0,.34), 0 10px 28px rgba(0,0,0,.4), 0 0 24px color-mix(in srgb, var(--table-color) 25%, transparent); }
  body.game-mode .hand-summary { grid-column: 2; grid-row: 1; width: 100%; min-height: 34px; max-width: none; margin: 0; padding: 4px 8px; gap: 2px; flex-direction: column; align-items: flex-start; justify-content: center; border-radius: 9px; font-size: .63rem; line-height: 1.1; overflow: hidden; }
  body.game-mode .hand-summary span,
  body.game-mode .hand-summary strong { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.game-mode .game-actions { grid-column: 2; grid-row: 2; width: 100%; max-width: none; margin: 0; grid-template-columns: 1fr 1fr; align-content: center; gap: 5px; }
  body.game-mode .player-hole-card-panel { grid-column:1/-1; min-height:82px; padding:3px 7px; gap:8px; border-radius:9px; }
  body.game-mode .player-hole-card-panel > span { font-size:.55rem; }
  body.game-mode .player-hole-cards { min-width:112px; gap:6px; }
  body.game-mode .player-hole-cards .playing-card { width:48px; height:68px; padding:4px; border-radius:6px; font-size:.78rem; }
  body.game-mode .player-hole-cards .playing-card .card-suit { font-size:1.15rem; }
  body.game-mode .poker-action { min-height: 36px; padding: 5px; border-radius: 8px; font-size: .72rem; }
  body.game-mode .raise-control { grid-column: 1 / -1; order: 0; min-height: 36px; padding: 3px 6px; gap: 5px; border-radius: 8px; font-size: .6rem; }
  body.game-mode .raise-control input { min-width: 45px; width: 100%; }
  body.game-mode .poker-action.next { grid-column: 1 / -1; }
  body.game-mode .game-log-wrap { display: none; }
  body.game-mode .community-area { top: 44%; width: min(42vw, 330px); gap: 4px; }
  body.game-mode .community-cards { min-height: 45px; gap: 4px; }
  body.game-mode .playing-card { width: 34px; height: 47px; padding: 3px; border-radius: 5px; font-size: .65rem; }
  body.game-mode .playing-card .card-suit { font-size: .95rem; }
  body.game-mode .pot-chip { padding: 2px 8px; font-size: .58rem; }
  body.game-mode .table-felt-brand { top: 63%; font-size: .78rem; }
  body.game-mode .table-felt-brand small { font-size: .36rem; }
  body.game-mode .game-seat { width: 104px; min-height: 76px; }
  body.game-mode .game-seat .seat-avatar { width: 31px; height: 31px; border-width: 1px; }
  body.game-mode .seat-name { max-width: 88px; margin-top: 0; font-size: .58rem; line-height: 1.1; }
  body.game-mode .seat-stack { font-size: .55rem; line-height: 1; }
  body.game-mode .seat-status { font-size: .48rem; }
  body.game-mode .seat-wager { gap: 3px; padding: 2px 5px 2px 3px; font-size: .52rem; }
  body.game-mode .chip-stack { width: 18px; height: 14px; flex-basis: 18px; }
  body.game-mode .chip-stack i { width: 16px; height: 6px; border-width: 1px; }
  body.game-mode .chip-stack i:nth-child(1) { top: 7px; }
  body.game-mode .chip-stack i:nth-child(2) { top: 4px; }
  body.game-mode .chip-stack i:nth-child(3) { top: 1px; }
  body.game-mode .game-seat.seat-0 .seat-wager { top: -43px; }
  body.game-mode .game-seat.seat-3 .seat-wager { top: calc(100% + 1px); }
  body.game-mode .game-seat.seat-1 .seat-wager,
  body.game-mode .game-seat.seat-2 .seat-wager { left: calc(100% - 5px); }
  body.game-mode .game-seat.seat-4 .seat-wager,
  body.game-mode .game-seat.seat-5 .seat-wager { right: calc(100% - 5px); }
  body.game-mode .seat-cards { height:auto; min-height:38px; gap:3px; margin-top:-9px; overflow:visible; }
  body.game-mode .seat-cards .playing-card { width: 27px; height: 37px; padding: 2px; font-size: .5rem; }
  body.game-mode .seat-cards .playing-card .card-suit { font-size: .67rem; }
  body.game-mode .dealer-button { width: 14px; height: 14px; font-size: .48rem; }
  body.game-mode .game-seat.seat-0 { left: 50%; top: 82%; }
  body.game-mode .game-seat.seat-1 { left: 15%; top: 69%; }
  body.game-mode .game-seat.seat-2 { left: 17%; top: 28%; }
  body.game-mode .game-seat.seat-3 { left: 50%; top: 18%; }
  body.game-mode .game-seat.seat-4 { left: 83%; top: 28%; }
  body.game-mode .game-seat.seat-5 { left: 85%; top: 69%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Information visible in the lobby, at the table, and before creating a profile. */
.fiction-notice { position:relative; z-index:2; padding:12px 14px; border:1px solid var(--line); border-radius:12px; font-size:.85rem; }
.fiction-notice a,.profile-legal a,.game-help { color:var(--gold-light); }
.game-help { display:block; font-size:.7rem; text-decoration:underline; text-underline-offset:3px; }
footer { flex-wrap:wrap; }
footer nav { display:flex; flex-wrap:wrap; justify-content:center; gap:10px 18px; }
.profile-legal { margin:18px 0 10px; font-size:.78rem; }
.loading-content .loading-publisher { color:var(--gold-light); letter-spacing:.1em; }
@media (prefers-reduced-motion:reduce) { .loading-halo,.loading-chips i { animation:none; } }

.publisher-screen { position:fixed; inset:0; z-index:400; display:grid; place-items:center; padding:clamp(16px,4vw,48px); min-height:100dvh; background:#fcfaf5; }
.publisher-screen img { display:block; width:min(90vw,850px); height:auto; max-height:85dvh; object-fit:contain; }
body.publisher-ready .publisher-screen { display:none; }
body:not(.publisher-ready) .loading-screen { visibility:hidden; }

.publisher-signature { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:center; gap:6px 12px; }
.publisher-signature span { color:var(--muted); font-size:.72rem; }
.publisher-screen { align-content:center; gap:8px; }
.publisher-screen img { max-height:calc(100dvh - 112px); }
.publisher-screen .publisher-rights { margin:0; color:#25231e; font-size:clamp(.7rem,2vw,.85rem); text-align:center; }