:root {
  color-scheme:dark;
  --ink:#090b0b;
  --panel:#121514;
  --gold:#d8b467;
  --gold-light:#f4dfaa;
  --gold-dark:#89612b;
  --cream:#f5edda;
  --muted:#9c9e96;
  --line:rgba(216,180,103,.2);
  --serif:Georgia,'Times New Roman',serif;
  --sans:Arial,Helvetica,sans-serif;
  --card-w:68px;
  --card-h:96px
}
* {
  box-sizing:border-box
}
html {
  min-width:320px;
  background:var(--ink);
  scroll-behavior:smooth
}
body {
  margin:0;
  min-height:100svh;
  color:var(--cream);
  font-family:var(--sans);
  font-size:15px;
  line-height:1.5;
  background:radial-gradient(ellipse at 75% 30%,rgba(92,76,37,.13),transparent 48%),radial-gradient(ellipse at 20% 100%,rgba(24,49,38,.2),transparent 45%),#090b0b
}
button,a {
  -webkit-tap-highlight-color:transparent
}
button {
  font:inherit;
  cursor:pointer
}
button:disabled {
  cursor:wait
}
button:focus-visible,a:focus-visible {
  outline:2px solid var(--gold-light);
  outline-offset:6px
}
button {
  touch-action:manipulation
}
img {
  display:block;
  max-width:100%
}
[hidden] {
  display:none!important
}
h1,h2,h3,p {
  margin-top:0
}
h1,h2,h3 {
  font-weight:400
}
h1 {
  font-family:var(--serif);
  font-size:clamp(54px,7vw,102px);
  line-height:1.02;
  letter-spacing:-.055em
}
h2 {
  font-family:var(--serif);
  font-size:34px;
  line-height:1.15;
  letter-spacing:-.035em
}
.gold {
  color:var(--gold-light)
}
.app-shell {
  position:relative;
  max-width:1600px;
  min-height:100svh;
  margin:auto;
  padding:0 5.2%
}
.site-header {
  position:relative;
  z-index:10;
  height:106px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid rgba(216,180,103,.13)
}
.brand-mark {
  display:flex;
  gap:13px;
  align-items:center;
  text-decoration:none;
  color:var(--cream)
}
.brand-mark img {
  width:48px;
  height:48px;
  object-fit:contain
}
.brand-wordmark {
  font-family:var(--serif);
  font-size:13px;
  letter-spacing:.17em;
  line-height:1.55
}
.brand-wordmark strong {
  display:block;
  font-weight:400;
  color:var(--gold-light);
  font-size:15px;
  letter-spacing:.22em
}
.brand-wordmark span {
  display:block;
  font-size:10px;
  letter-spacing:.19em;
  color:#bbb4a2
}
.header-right {
  display:flex;
  align-items:center;
  gap:27px
}
.private-tag {
  font-size:9px;
  font-weight:600;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--muted)
}
.private-tag:before {
  content:'';
  display:inline-block;
  vertical-align:middle;
  width:5px;
  height:5px;
  margin-right:9px;
  background:var(--gold);
  border-radius:50%;
  box-shadow:0 0 12px rgba(216,180,103,.3)
}
.icon-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  color:var(--gold);
  background:transparent;
  border:1px solid var(--line);
  border-radius:50%;
  transition:border-color .2s,background .2s
}
.icon-button:hover {
  background:rgba(216,180,103,.07);
  border-color:var(--gold)
}
.icon-button svg {
  width:18px;
  height:18px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.5
}
.screen {
  position:relative;
  animation:screen-enter .7s ease both
}
.eyebrow,.phase-label {
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--gold);
  font-weight:600
}
.eyebrow {
  display:flex;
  gap:13px;
  align-items:center;
  margin-bottom:26px
}
.eyebrow:before {
  content:'';
  width:26px;
  height:1px;
  background:var(--gold-dark)
}
.button {
  border:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  padding:18px 28px;
  min-height:58px;
  text-decoration:none;
  font-weight:600;
  font-size:12px;
  letter-spacing:.045em;
  position:relative;
  isolation:isolate;
  transition:transform .2s,box-shadow .2s,filter .2s
}
.button-gold {
  color:#211a0b;
  background:linear-gradient(115deg,#b98c42 0%,#e5c780 45%,#d0a554 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 8px 22px rgba(0,0,0,.25);
  border:1px solid #e5c780
}
.button-gold:hover:not(:disabled) {
  transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 9px 30px rgba(216,180,103,.16);
  filter:brightness(1.08)
}
.button-gold:active:not(:disabled) {
  transform:translateY(0)
}
.button-gold:disabled {
  filter:saturate(.4);
  opacity:.65
}
.button svg {
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5
}
.button-quiet {
  display:inline-flex;
  background:none;
  color:var(--muted);
  border:0;
  border-bottom:1px solid rgba(216,180,103,.2);
  padding:8px 0;
  font-size:11px;
  letter-spacing:.05em
}
.button-quiet:hover {
  color:var(--gold-light)
}
.welcome-layout {
  min-height:calc(100svh - 185px);
  display:grid;
  grid-template-columns:.92fr 1.08fr;
  align-items:center;
  gap:4%;
  padding:50px 0 45px
}
.welcome-copy {
  padding-left:2%;
  padding-bottom:4%
}
.welcome-copy h1 {
  margin-bottom:26px
}
.welcome-copy h1 .gold {
  display:block;
  font-style:italic
}
.lead {
  font-size:15px;
  line-height:1.85;
  max-width:340px;
  color:#a9aba2;
  margin-bottom:32px
}
.welcome-details {
  display:flex;
  align-items:center;
  gap:20px;
  margin-top:32px;
  color:#7f837b;
  font-size:9px;
  letter-spacing:.15em;
  text-transform:uppercase
}
.welcome-details span+span {
  border-left:1px solid var(--line);
  padding-left:20px
}
.logo-stage {
  position:relative;
  align-self:center;
  text-align:center;
  max-width:600px;
  width:100%;
  justify-self:center;
  padding:24px 0
}
.logo-halo {
  position:absolute;
  inset:5%;
  border:1px solid rgba(216,180,103,.11);
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(162,111,34,.15),transparent 65%);
  box-shadow:0 0 120px rgba(127,90,28,.08)
}
.logo-halo:before {
  content:'';
  position:absolute;
  inset:18px;
  border:1px solid rgba(216,180,103,.045);
  border-radius:50%
}
.hero-logo {
  position:relative;
  width:min(100%,550px);
  margin:auto;
  filter:drop-shadow(0 20px 45px rgba(0,0,0,.65));
  animation:logo-arrive 1s ease both
}
.hero-logo img {
  width:100%;
  height:auto
}
.stage-caption {
  position:relative;
  margin-top:15px;
  color:#a89163;
  font-size:9px;
  letter-spacing:.3em;
  text-transform:uppercase
}
.stage-caption:before,.stage-caption:after {
  content:'◆';
  font-size:6px;
  vertical-align:middle;
  margin:0 16px;
  color:var(--gold-dark)
}
.welcome-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:68px;
  border-top:1px solid rgba(216,180,103,.13);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:#777e74
}
.welcome-footer button {
  border:0;
  background:none;
  color:#9c9e96;
  font-size:10px;
  padding:14px 0
}
.welcome-footer button:hover {
  color:var(--gold-light)
}
.intro-screen {
  min-height:calc(100svh - 106px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:46px 0 65px
}
.intro-emblem {
  font-family:var(--serif);
  font-size:45px;
  color:var(--gold);
  margin-bottom:23px;
  line-height:1
}
.intro-screen .eyebrow {
  justify-content:center
}
.intro-screen .eyebrow:before {
  display:none
}
.intro-screen h1 {
  font-size:clamp(44px,6vw,76px);
  margin-bottom:24px
}
.intro-lines {
  color:#a7aca1;
  font-size:15px;
  line-height:1.8
}
.intro-lines p {
  margin-bottom:5px;
  animation:intro-line .7s both
}
.intro-lines p:nth-child(2) {
  animation-delay:.18s
}
.intro-lines p:nth-child(3) {
  animation-delay:.36s
}
.seat-preview {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:40px;
  margin:35px 0 37px
}
.seat-preview-player {
  width:95px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px
}
.portrait {
  position:relative;
  overflow:hidden;
  border-radius:50%;
  background:#141713;
  border:1px solid #a28142;
  width:70px;
  height:70px;
  box-shadow:inset 0 0 0 3px #171a14,0 0 0 4px rgba(216,180,103,.035)
}
.portrait img {
  position:absolute;
  width:160%;
  max-width:none;
  left:-30%;
  top:-3%;
  height:auto
}
.seat-preview-player:nth-child(3) .portrait {
  filter:saturate(.35) brightness(.75)
}
.player-name {
  font-size:11px;
  letter-spacing:.1em;
  color:#c7c8bd
}
.seat-preview-divider {
  color:#665b40;
  font-family:var(--serif);
  font-style:italic;
  font-size:20px
}
.table-screen {
  padding:29px 0 22px
}
.table-topline {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:16px
}
.table-topline .eyebrow {
  margin:0
}
.round-badge {
  font-size:9px;
  color:#999e91;
  border:1px solid rgba(216,180,103,.17);
  border-radius:20px;
  padding:6px 12px;
  letter-spacing:.12em;
  text-transform:uppercase
}
.game-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 265px;
  gap:50px;
  align-items:center
}
.table-wrap {
  position:relative;
  min-width:0;
  width:100%;
  padding:0
}
.poker-table {
  height:590px;
  position:relative;
  isolation:isolate
}
.table-rail {
  position:absolute;
  inset:48px 0;
  border-radius:46%;
  background:repeating-linear-gradient(2deg,rgba(77,62,40,.13) 0,rgba(77,62,40,.13) 1px,transparent 1px,transparent 4px),linear-gradient(160deg,#40372b,#1a1714 20%,#30281f 54%,#4a3b2b 76%,#171613);
  box-shadow:0 24px 40px -8px #000,0 6px 4px #000,inset 0 2px 2px rgba(226,196,137,.22),inset 0 -4px 5px #080909;
  border:1px solid #5e4a2c;
  padding:28px
}
.table-rail:before {
  content:'';
  position:absolute;
  inset:9px;
  border:1px solid rgba(216,180,103,.12);
  border-radius:46%;
  pointer-events:none
}
.table-felt {
  position:absolute;
  inset:27px;
  border-radius:44%;
  background:radial-gradient(ellipse at 50% 40%,rgba(79,107,80,.18),transparent 60%),repeating-linear-gradient(32deg,rgba(177,184,140,.022) 0,rgba(177,184,140,.022) 1px,transparent 1px,transparent 3px),repeating-linear-gradient(-32deg,rgba(177,184,140,.018) 0,rgba(177,184,140,.018) 1px,transparent 1px,transparent 3px),#142a21;
  box-shadow:inset 0 7px 21px #060f0c,inset 0 0 0 2px rgba(186,152,88,.3),inset 0 0 0 7px rgba(0,0,0,.12);
  border:1px solid #96703a
}
.table-felt:after {
  content:'';
  position:absolute;
  inset:19px;
  border:1px dashed rgba(216,180,103,.16);
  border-radius:43%;
  pointer-events:none
}
.felt-brand {
  position:absolute;
  left:50%;
  top:67%;
  transform:translateX(-50%);
  font-family:var(--serif);
  font-size:13px;
  letter-spacing:.2em;
  color:rgba(208,185,129,.17);
  white-space:nowrap;
  text-transform:uppercase;
  z-index:1
}
.felt-brand img {
  width:90px;
  opacity:.09
}
.table-ornament {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:70%;
  height:38%;
  border:1px solid rgba(212,182,105,.07);
  border-radius:46%;
  pointer-events:none
}
.seat {
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  z-index:8;
  display:flex;
  gap:12px;
  align-items:center;
  min-width:152px;
  padding:7px 18px 7px 8px;
  border:1px solid #685536;
  background:linear-gradient(120deg,#20271e,#111811);
  border-radius:48px;
  box-shadow:0 5px 20px rgba(0,0,0,.5)
}
.seat-opponent {
  top:1px;
  background:linear-gradient(120deg,#1c211f,#101514);
  border-color:#434b44
}
.seat-player {
  bottom:1px;
  border-color:#b29553
}
.seat .portrait {
  width:47px;
  height:47px;
  flex-shrink:0
}
.seat-opponent .portrait {
  filter:saturate(.35) brightness(.76);
  border-color:#64705e
}
.seat-info {
  min-width:65px
}
.seat-name {
  font-size:12px;
  color:#ece4d1;
  letter-spacing:.04em
}
.seat-name small {
  font-size:8px;
  text-transform:uppercase;
  margin-left:6px;
  color:var(--gold);
  letter-spacing:.1em
}
.seat-stack {
  font-size:12px;
  font-variant-numeric:tabular-nums;
  color:#c5b88f;
  letter-spacing:.04em
}
.seat-status {
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
  bottom:-22px;
  font-size:8px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#a6ad9a;
  line-height:1
}
.seat-player .seat-status {
  bottom:auto;
  top:-19px;
  color:var(--gold-light)
}
.seat-status:empty {
  display:none
}
.hole-cards {
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:8px;
  z-index:5;
  min-height:var(--card-h)
}
#opponent-cards {
  top:105px
}
#player-cards {
  bottom:104px
}
.community {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-15%);
  display:flex;
  align-items:center;
  gap:9px;
  z-index:5
}
.card-slot {
  width:var(--card-w);
  height:var(--card-h);
  border-radius:6px;
  border:1px solid rgba(215,192,132,.16);
  background:rgba(0,0,0,.05)
}
.card {
  width:var(--card-w);
  height:var(--card-h);
  position:relative;
  flex:0 0 var(--card-w);
  perspective:700px;
  border-radius:6px;
  transition:filter .4s,transform .4s;
  transform-style:preserve-3d
}
.card-inner {
  position:relative;
  width:100%;
  height:100%;
  transform-style:preserve-3d;
  transition:transform .65s cubic-bezier(.2,.65,.25,1)
}
.card.face-down .card-inner {
  transform:rotateY(180deg)
}
.card-front,.card-back {
  position:absolute;
  inset:0;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 5px 7px rgba(0,0,0,.28)
}
.card-front {
  background:linear-gradient(125deg,#fffdf4,#efe7d1);
  border:1px solid #d8c89f;
  color:#202822
}
.card.red .card-front {
  color:#9a3633
}
.card-corner {
  position:absolute;
  display:flex;
  flex-direction:column;
  align-items:center;
  font-family:var(--serif);
  font-weight:bold;
  line-height:1;
  gap:2px
}
.card-corner.top {
  top:7px;
  left:7px
}
.card-corner.bottom {
  bottom:7px;
  right:7px;
  transform:rotate(180deg)
}
.card-corner .rank {
  font-size:18px;
  letter-spacing:-.08em
}
.card-corner .suit {
  font-size:14px
}
.card-center {
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--serif)
}
.card-center .suit {
  font-size:35px
}
.card-back {
  transform:rotateY(180deg);
  background:repeating-linear-gradient(45deg,rgba(216,180,103,.07) 0,rgba(216,180,103,.07) 1px,transparent 1px,transparent 5px),linear-gradient(130deg,#24291e,#0c1410);
  border:1px solid #bd9953;
  padding:5px
}
.back-frame {
  height:100%;
  width:100%;
  border:1px solid #8f733b;
  outline:1px solid rgba(143,115,59,.3);
  outline-offset:-4px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  position:relative;
  color:var(--gold)
}
.back-frame:before,.back-frame:after {
  content:'◆';
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  font-size:5px
}
.back-frame:before {
  top:5px
}
.back-frame:after {
  bottom:5px
}
.back-frame span {
  font-family:var(--serif);
  font-size:31px;
  line-height:1.1;
  text-shadow:0 1px #000
}
.back-frame small {
  font-family:var(--serif);
  font-size:8px;
  letter-spacing:.12em;
  margin-top:3px
}
.card.winner-card {
  filter:drop-shadow(0 0 8px rgba(255,211,109,.55));
  transform:translateY(-6px)
}
.card.winner-card .card-front {
  border-color:#f6d283;
  box-shadow:0 0 0 1px #c49a46,0 5px 12px rgba(0,0,0,.25)
}
.card.quad-card .card-front {
  box-shadow:0 0 0 1px rgba(255,225,155,.7),0 0 13px rgba(216,180,103,.23)
}
.card.dealing {
  animation:card-arrive .5s ease both
}
.pot-display {
  position:absolute;
  top:225px;
  left:50%;
  transform:translateX(-50%);
  text-align:center;
  z-index:6;
  min-width:150px
}
.pot-label {
  display:block;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.2em;
  color:#adb699;
  margin-bottom:3px
}
#pot-value {
  font-size:20px;
  letter-spacing:.03em;
  font-family:var(--serif);
  font-variant-numeric:tabular-nums;
  color:#eee4c4
}
.pot-chips {
  height:15px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:2px;
  margin-bottom:2px
}
.pot-chips .chip {
  width:21px;
  height:9px
}
.chip {
  display:inline-block;
  width:26px;
  height:12px;
  border-radius:50%;
  border:2px dashed #d4b66c;
  background:linear-gradient(#433c25,#95804b 45%,#241f13 55%);
  box-shadow:0 2px 0 #080b08,0 3px 0 #b69b59,0 4px 0 #080b08;
  position:relative
}
.chip:after {
  content:'';
  position:absolute;
  inset:1px 4px;
  border:1px solid rgba(235,209,145,.5);
  border-radius:50%
}
.chip:nth-child(2) {
  background:linear-gradient(#1f3630,#365d4d 45%,#172a23 55%);
  border-color:#b8c0a0
}
.table-chips {
  position:absolute;
  z-index:4;
  display:flex;
  gap:3px;
  left:64%
}
.opponent-chips {
  top:155px
}
.player-chips {
  bottom:155px
}
.deck {
  position:absolute;
  left:12%;
  top:44%;
  z-index:7;
  width:50px;
  height:73px;
  transform:rotate(-13deg)
}
.deck-card,.deck-top {
  position:absolute;
  inset:0;
  border:1px solid #9c7a3b;
  border-radius:4px;
  background:repeating-linear-gradient(45deg,rgba(216,180,103,.07) 0,rgba(216,180,103,.07) 1px,transparent 1px,transparent 5px),#17231b;
  box-shadow:0 1px 0 #e7dfc6
}
.deck-card:nth-child(1) {
  transform:translate(2px,5px)
}
.deck-card:nth-child(2) {
  transform:translate(1px,3px)
}
.deck-card:nth-child(3) {
  transform:translate(0,1px)
}
.deck-top {
  display:flex;
  align-items:center;
  justify-content:center;
  outline:1px solid #6d592f;
  outline-offset:-5px
}
.deck-top span {
  font-size:29px;
  font-family:var(--serif);
  color:#b79650
}
.is-shuffling .deck-card:nth-child(1) {
  animation:shuffle-left .4s ease-in-out 4
}
.is-shuffling .deck-card:nth-child(2) {
  animation:shuffle-right .4s ease-in-out 4
}
.is-shuffling .deck-top {
  animation:shuffle-top .4s ease-in-out 4
}
.dealer-button {
  position:absolute;
  left:65%;
  bottom:94px;
  width:25px;
  height:25px;
  border-radius:50%;
  background:#eee5cc;
  border:2px solid #bca971;
  color:#1e241d;
  box-shadow:0 2px 3px #080d09;
  display:grid;
  place-items:center;
  font-size:10px;
  font-weight:bold;
  z-index:5
}
.game-panel {
  padding:0 0 25px
}
.phase-label {
  margin-bottom:15px;
  display:block;
  font-size:9px
}
.game-panel h2 {
  font-size:40px;
  line-height:1.08;
  max-width:290px;
  margin-bottom:18px
}
.game-panel p {
  font-size:13px;
  line-height:1.85;
  color:#a8aea1;
  min-height:74px;
  margin-bottom:25px
}
.game-panel .button {
  width:100%;
  gap:15px;
  min-height:56px;
  padding-left:17px;
  padding-right:17px
}
.action-hint {
  display:block;
  margin-top:13px;
  text-align:center;
  color:#727d6f;
  font-size:9px;
  letter-spacing:.03em
}
.hand-status {
  margin-top:22px;
  min-height:26px;
  font-size:9px;
  color:var(--gold);
  letter-spacing:.13em;
  text-transform:uppercase;
  line-height:1.8
}
.hand-status:empty {
  display:none
}
.table-bottom {
  border-top:1px solid rgba(216,180,103,.12);
  margin-top:18px;
  padding:22px 0 6px;
  display:flex;
  justify-content:space-between;
  align-items:center
}
.progress-track {
  display:flex;
  gap:28px
}
.progress-step {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:9px;
  letter-spacing:.1em;
  color:#5d695d;
  text-transform:uppercase
}
.progress-step:before {
  content:'';
  height:5px;
  width:5px;
  border-radius:50%;
  border:1px solid #566152
}
.progress-step.active {
  color:var(--gold-light)
}
.progress-step.active:before {
  background:var(--gold);
  border-color:var(--gold);
  box-shadow:0 0 8px rgba(216,180,103,.4)
}
.progress-step.complete {
  color:#949d87
}
.progress-step.complete:before {
  border-color:#a19b76;
  background:#a19b76
}
.table-note {
  font-size:8px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:#596455
}
.finale-screen {
  min-height:calc(100svh - 106px);
  padding:52px 0 65px;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center
}
.finale-layout {
  width:100%;
  max-width:850px
}
.finale-layout .eyebrow {
  justify-content:center;
  margin-bottom:16px
}
.finale-layout .eyebrow:before {
  display:none
}
.finale-layout h1 {
  font-size:clamp(56px,8vw,96px);
  letter-spacing:-.045em;
  margin-bottom:10px;
  color:var(--gold-light)
}
.winner-chip {
  color:#b9bea9;
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  margin-bottom:33px
}
.finale-cards {
  display:flex;
  justify-content:center;
  gap:12px;
  margin:30px auto 33px;
  --card-w:89px;
  --card-h:125px;
  perspective:1000px
}
.finale-cards .card {
  animation:final-card .8s cubic-bezier(.2,.65,.25,1) both;
  animation-delay:calc(var(--i,0)*.13s)
}
.finale-cards .card:nth-child(1) {
  transform:translateY(11px) rotate(-9deg)
}
.finale-cards .card:nth-child(2) {
  transform:translateY(3px) rotate(-4deg)
}
.finale-cards .card:nth-child(4) {
  transform:translateY(3px) rotate(4deg)
}
.finale-cards .card:nth-child(5) {
  transform:translateY(11px) rotate(9deg)
}
.finale-cards .card-corner .rank {
  font-size:23px
}
.finale-cards .card-corner .suit {
  font-size:18px
}
.finale-cards .card-center .suit {
  font-size:49px
}
.finale-message {
  color:#a9ad9f;
  font-size:14px;
  line-height:1.8;
  margin:0 auto 28px;
  max-width:430px
}
.prize-prompt {
  position:relative;
  margin:33px auto 25px;
  padding:25px 35px 28px;
  max-width:560px;
  border-top:1px solid rgba(216,180,103,.34);
  border-bottom:1px solid rgba(216,180,103,.34);
  background:linear-gradient(90deg,transparent,rgba(191,144,54,.055),transparent)
}
.prize-prompt:before {
  content:'◆';
  position:absolute;
  left:50%;
  top:-7px;
  transform:translateX(-50%);
  padding:0 12px;
  background:#0d100d;
  color:var(--gold);
  font-size:9px
}
.prize-prompt>span {
  display:block;
  color:var(--gold);
  font-size:22px;
  line-height:1;
  margin-bottom:16px
}
.prize-prompt h2 {
  font-size:clamp(28px,4vw,43px);
  line-height:1.18;
  max-width:460px;
  margin:0 auto;
  color:#f1dbab
}
.prize-prompt p {
  font-size:11px;
  line-height:1.8;
  color:#8f9889;
  margin:14px 0 0
}
.celebrating {
  background:radial-gradient(ellipse at 50% 40%,rgba(133,96,29,.19),transparent 65%),#090b0b
}
.ambient-glow {
  position:fixed;
  inset:0;
  pointer-events:none;
  background:radial-gradient(ellipse at 70% 40%,rgba(192,143,51,.035),transparent 65%);
  z-index:0
}
.grain {
  position:fixed;
  inset:0;
  opacity:.025;
  pointer-events:none;
  z-index:20;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.5' d='M0 0h180v180H0z'/%3E%3C/svg%3E")
}
.vignette {
  position:fixed;
  inset:0;
  pointer-events:none;
  box-shadow:inset 0 0 150px rgba(0,0,0,.25);
  z-index:1
}
.modal {
  position:fixed;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.76);
  backdrop-filter:blur(10px);
  padding:22px
}
.modal-panel {
  position:relative;
  max-width:460px;
  width:100%;
  padding:44px 36px;
  background:linear-gradient(135deg,#1b211a,#10150f);
  border:1px solid #6c5935;
  box-shadow:0 30px 100px #000
}
.modal-panel h2 {
  font-size:37px;
  color:var(--gold-light)
}
.modal-panel p,.modal-panel li {
  font-size:13px;
  line-height:1.8;
  color:#aeb6a5
}
.modal-panel ul {
  padding-left:20px
}
.modal-close {
  position:absolute;
  right:12px;
  top:12px;
  background:none;
  border:0;
  color:var(--gold);
  font-size:25px;
  width:32px;
  height:32px
}
.toast {
  position:fixed;
  bottom:25px;
  left:50%;
  transform:translateX(-50%);
  max-width:calc(100% - 35px);
  padding:13px 21px;
  background:#272b20;
  border:1px solid #8c733e;
  color:#f1e0b6;
  box-shadow:0 5px 25px #000;
  z-index:150;
  font-size:12px;
  text-align:center
}
.card-flight {
  position:absolute;
  width:var(--card-w);
  height:var(--card-h);
  pointer-events:none;
  z-index:40
}
.chip-flying {
  position:absolute;
  pointer-events:none;
  z-index:40
}
.flight-layer,#flight-layer {
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:30
}
.screen-enter {
  animation:screen-enter .6s ease both
}
.phase-flash {
  animation:phase-flash .7s ease
}
.royal-glow {
  filter:drop-shadow(0 0 18px rgba(240,194,91,.5))
}
.pulse-gold {
  animation:pulse-gold 1.8s ease-in-out infinite
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
@keyframes screen-enter {
  from {
    opacity:0;
    transform:translateY(12px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }
}
@keyframes logo-arrive {
  from {
    opacity:0;
    transform:translateY(20px) scale(.96)
  }
  to {
    opacity:1;
    transform:translateY(0) scale(1)
  }
}
@keyframes intro-line {
  from {
    opacity:0;
    transform:translateY(8px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }
}
@keyframes card-arrive {
  from {
    opacity:0;
    transform:translateY(-15px) rotate(-4deg)
  }
  to {
    opacity:1;
    transform:translateY(0) rotate(0)
  }
}
@keyframes shuffle-left {
  0%,100% {
    transform:translate(2px,5px)
  }
  50% {
    transform:translate(-25px,-11px) rotate(-16deg)
  }
}
@keyframes shuffle-right {
  0%,100% {
    transform:translate(1px,3px)
  }
  50% {
    transform:translate(25px,-5px) rotate(13deg)
  }
}
@keyframes shuffle-top {
  0%,100% {
    transform:translate(0,0)
  }
  50% {
    transform:translate(3px,-13px) rotate(6deg)
  }
}
@keyframes final-card {
  from {
    opacity:0;
    translate:0 30px
  }
  to {
    opacity:1;
    translate:0 0
  }
}
@keyframes phase-flash {
  0%,100% {
    opacity:1
  }
  45% {
    opacity:.3
  }
}
@keyframes pulse-gold {
  0%,100% {
    box-shadow:0 0 0 rgba(216,180,103,0)
  }
  50% {
    box-shadow:0 0 32px rgba(216,180,103,.16)
  }
}
@media(min-width:1450px) {
  .game-layout {
    grid-template-columns:minmax(0,1fr) 300px;
    gap:70px
  }
  .poker-table {
    height:630px
  }
  .pot-display {
    top:245px
  }
  #opponent-cards {
    top:116px
  }
  #player-cards {
    bottom:116px
  }
  .seat .portrait {
    width:54px;
    height:54px
  }
  .seat {
    min-width:170px
  }
  .deck {
    left:13%
  }
}
@media(max-width:1120px) {
  .app-shell {
    padding:0 4%
  }
  .game-layout {
    gap:28px;
    grid-template-columns:minmax(0,1fr) 230px;
    --card-w:59px;
    --card-h:85px
  }
  .poker-table {
    height:560px
  }
  .community {
    gap:7px
  }
  .pot-display {
    top:213px
  }
  .game-panel h2 {
    font-size:34px
  }
  .deck {
    width:44px;
    height:64px;
    left:11%
  }
  .table-rail {
    padding:23px
  }
  .table-felt {
    inset:23px
  }
  .felt-brand {
    font-size:10px;
    top:65%
  }
  #opponent-cards {
    top:101px
  }
  #player-cards {
    bottom:102px
  }
}
@media(max-width:900px) {
  .site-header {
    height:86px
  }
  .welcome-layout {
    min-height:calc(100svh - 160px);
    gap:0
  }
  .welcome-copy h1 {
    font-size:76px
  }
  .welcome-copy .lead {
    font-size:13px;
    max-width:285px
  }
  .welcome-details {
    font-size:8px;
    gap:12px
  }
  .welcome-details span+span {
    padding-left:12px
  }
  .stage-caption {
    font-size:7px;
    letter-spacing:.2em
  }
  .game-layout {
    display:flex;
    flex-direction:column;
    gap:6px;
    --card-w:67px;
    --card-h:94px
  }
  .table-wrap {
    max-width:720px
  }
  .poker-table {
    height:570px
  }
  .pot-display {
    top:217px
  }
  .community {
    gap:9px
  }
  .game-panel {
    width:100%;
    max-width:600px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 36px;
    padding:15px 0 0;
    align-items:center
  }
  .game-panel .phase-label {
    grid-column:1/2;
    margin-bottom:9px
  }
  .game-panel h2 {
    grid-column:1/2;
    font-size:32px;
    margin-bottom:12px
  }
  .game-panel p {
    grid-column:1/2;
    min-height:0;
    margin-bottom:0;
    font-size:12px
  }
  .game-panel .action-area {
    grid-column:2/3;
    grid-row:1/5
  }
  .game-panel .hand-status {
    grid-column:1/2;
    margin:9px 0 0
  }
  .table-bottom {
    margin-top:25px
  }
  .table-screen {
    padding-top:25px
  }
  .intro-screen {
    min-height:calc(100svh - 86px)
  }
  .finale-screen {
    min-height:calc(100svh - 86px)
  }
  .progress-track {
    gap:24px
  }
}
@media(max-width:650px) {
  .app-shell {
    padding:0 22px
  }
  .site-header {
    height:80px
  }
  .brand-mark {
    gap:9px
  }
  .brand-mark img {
    height:39px;
    width:39px
  }
  .brand-wordmark strong {
    font-size:12px
  }
  .brand-wordmark span {
    font-size:8px
  }
  .header-right {
    gap:12px
  }
  .private-tag {
    display:none
  }
  .icon-button {
    width:36px;
    height:36px
  }
  .welcome-layout {
    min-height:0;
    grid-template-columns:1fr;
    display:flex;
    flex-direction:column-reverse;
    padding:21px 0 30px;
    gap:18px
  }
  .logo-stage {
    width:min(80%,350px);
    padding:8px 0 0
  }
  .logo-halo {
    inset:6%
  }
  .hero-logo {
    width:100%
  }
  .stage-caption {
    margin-top:6px;
    font-size:7px
  }
  .welcome-copy {
    padding:0;
    text-align:center
  }
  .welcome-copy .eyebrow {
    justify-content:center;
    margin-bottom:15px;
    font-size:8px;
    letter-spacing:.22em
  }
  .welcome-copy .eyebrow:before {
    display:none
  }
  .welcome-copy h1 {
    font-size:58px;
    line-height:1.02;
    margin-bottom:17px
  }
  .welcome-copy h1 .gold {
    display:inline
  }
  .welcome-copy .lead {
    font-size:12px;
    line-height:1.8;
    max-width:285px;
    margin:0 auto 23px
  }
  .welcome-copy .button {
    min-width:210px;
    min-height:53px;
    padding-top:15px;
    padding-bottom:15px
  }
  .welcome-details {
    justify-content:center;
    margin-top:21px;
    font-size:8px
  }
  .welcome-footer {
    min-height:61px;
    font-size:7px;
    letter-spacing:.07em
  }
  .welcome-footer button {
    font-size:9px
  }
  .intro-screen {
    min-height:calc(100svh - 80px);
    padding:38px 0 50px
  }
  .intro-emblem {
    font-size:35px;
    margin-bottom:25px
  }
  .intro-screen .eyebrow {
    font-size:8px;
    margin-bottom:18px
  }
  .intro-screen h1 {
    font-size:49px;
    margin-bottom:22px
  }
  .intro-lines {
    font-size:13px
  }
  .seat-preview {
    gap:27px;
    margin:29px 0
  }
  .portrait {
    width:64px;
    height:64px
  }
  .table-screen {
    padding-top:20px
  }
  .table-topline {
    margin-bottom:10px
  }
  .table-topline .eyebrow {
    font-size:8px;
    letter-spacing:.13em;
    gap:8px
  }
  .table-topline .eyebrow:before {
    width:14px
  }
  .round-badge {
    font-size:7px;
    padding:5px 8px;
    letter-spacing:.07em
  }
  .game-layout {
    --card-w:47px;
    --card-h:68px;
    gap:0
  }
  .table-wrap {
    width:calc(100% + 18px);
    margin:0 -9px
  }
  .poker-table {
    height:530px
  }
  .table-rail {
    inset:47px 0;
    border-radius:44%;
    padding:20px;
    background:repeating-linear-gradient(2deg,rgba(77,62,40,.13) 0,rgba(77,62,40,.13) 1px,transparent 1px,transparent 4px),linear-gradient(160deg,#40372b,#1a1714 20%,#30281f 54%,#4a3b2b 76%,#171613)
  }
  .table-rail:before {
    inset:7px;
    border-radius:44%
  }
  .table-felt {
    inset:18px;
    border-radius:43%
  }
  .table-felt:after {
    inset:12px
  }
  .seat {
    min-width:140px;
    gap:9px;
    padding:6px 15px 6px 6px
  }
  .seat .portrait {
    width:42px;
    height:42px
  }
  .seat-name {
    font-size:11px
  }
  .seat-stack {
    font-size:11px
  }
  .seat-status {
    font-size:7px;
    bottom:-17px
  }
  .seat-player .seat-status {
    top:-16px
  }
  .seat-opponent {
    top:0
  }
  .seat-player {
    bottom:0
  }
  #opponent-cards {
    top:97px
  }
  #player-cards {
    bottom:96px
  }
  .hole-cards {
    gap:6px
  }
  .community {
    top:51%;
    transform:translate(-50%,-5%);
    gap:6px
  }
  .card,.card-front,.card-back,.card-slot {
    border-radius:4px
  }
  .card-corner.top {
    top:5px;
    left:4px
  }
  .card-corner.bottom {
    bottom:5px;
    right:4px
  }
  .card-corner {
    gap:1px
  }
  .card-corner .rank {
    font-size:14px
  }
  .card-corner .suit {
    font-size:10px
  }
  .card-center .suit {
    font-size:24px
  }
  .card-back {
    padding:4px
  }
  .back-frame {
    outline-offset:-3px
  }
  .back-frame span {
    font-size:24px
  }
  .back-frame small {
    font-size:6px
  }
  .pot-display {
    top:208px;
    min-width:100px
  }
  #pot-value {
    font-size:19px
  }
  .pot-label {
    font-size:7px
  }
  .pot-chips {
    height:11px
  }
  .pot-chips .chip {
    width:18px;
    height:7px
  }
  .deck {
    width:34px;
    height:49px;
    left:13%;
    top:37%;
    transform:rotate(-15deg)
  }
  .deck-top {
    outline-offset:-4px
  }
  .deck-top span {
    font-size:23px
  }
  .dealer-button {
    width:21px;
    height:21px;
    font-size:8px;
    bottom:105px;
    left:74%
  }
  .table-chips {
    left:72%;
    gap:1px
  }
  .table-chips .chip {
    width:20px;
    height:9px
  }
  .opponent-chips {
    top:128px
  }
  .player-chips {
    bottom:128px
  }
  .felt-brand {
    top:66.5%;
    font-size:8px;
    letter-spacing:.13em
  }
  .felt-brand img {
    width:68px
  }
  .game-panel {
    display:flex;
    flex-direction:column;
    text-align:center;
    padding-top:16px;
    gap:0;
    max-width:350px
  }
  .game-panel .phase-label {
    font-size:8px;
    margin-bottom:10px
  }
  .game-panel h2 {
    font-size:34px;
    max-width:320px;
    margin-bottom:12px
  }
  .game-panel p {
    font-size:12px;
    line-height:1.75;
    max-width:315px;
    min-height:0;
    margin-bottom:19px
  }
  .game-panel .action-area {
    width:100%
  }
  .game-panel .button {
    min-height:53px;
    font-size:12px
  }
  .action-hint {
    margin-top:10px;
    font-size:8px
  }
  .hand-status {
    font-size:8px;
    letter-spacing:.09em
  }
  .game-panel .hand-status {
    margin-top:15px
  }
  .table-bottom {
    margin-top:22px;
    padding-top:17px;
    justify-content:center
  }
  .progress-track {
    gap:17px
  }
  .progress-step {
    gap:5px;
    font-size:7px;
    letter-spacing:.05em
  }
  .progress-step:before {
    width:4px;
    height:4px
  }
  .table-note {
    display:none
  }
  .finale-screen {
    padding-top:42px;
    min-height:calc(100svh - 80px)
  }
  .finale-layout .eyebrow {
    font-size:8px;
    letter-spacing:.2em
  }
  .finale-layout h1 {
    font-size:56px
  }
  .winner-chip {
    font-size:8px;
    margin-bottom:25px
  }
  .finale-cards {
    --card-w:52px;
    --card-h:75px;
    gap:6px;
    margin:30px auto 31px
  }
  .finale-cards .card-corner .rank {
    font-size:16px
  }
  .finale-cards .card-corner .suit {
    font-size:11px
  }
  .finale-cards .card-center .suit {
    font-size:29px
  }
  .finale-message {
    font-size:12px;
    max-width:285px
  }
  .prize-prompt {
    padding:25px 8px 26px;
    margin-top:29px
  }
  .prize-prompt h2 {
    font-size:34px;
    max-width:320px
  }
  .prize-prompt p {
    font-size:10px
  }
  .prize-prompt>span {
    font-size:20px
  }
  .modal-panel {
    padding:39px 25px 28px
  }
  .modal-panel h2 {
    font-size:32px
  }
  .modal-panel p,.modal-panel li {
    font-size:12px
  }
}
@media(max-width:370px) {
  .app-shell {
    padding:0 16px
  }
  .welcome-copy h1 {
    font-size:51px
  }
  .welcome-footer {
    font-size:6px
  }
  .game-layout {
    --card-w:43px;
    --card-h:63px
  }
  .community {
    gap:5px
  }
  .table-wrap {
    width:calc(100% + 12px);
    margin:0 -6px
  }
  .poker-table {
    height:510px
  }
  .pot-display {
    top:200px
  }
  .table-felt {
    inset:16px
  }
  .table-rail {
    padding:17px
  }
  .deck {
    left:12%;
    top:37%
  }
  #opponent-cards {
    top:94px
  }
  #player-cards {
    bottom:93px
  }
  .table-chips {
    left:74%
  }
  .finale-cards {
    --card-w:47px;
    --card-h:68px;
    gap:5px
  }
  .finale-layout h1 {
    font-size:49px
  }
  .progress-track {
    gap:12px
  }
}
@media(max-height:760px) and (min-width:901px) {
  .site-header {
    height:84px
  }
  .welcome-layout {
    min-height:calc(100svh - 148px);
    padding:27px 0
  }
  .hero-logo {
    max-width:450px
  }
  .welcome-copy h1 {
    font-size:78px
  }
  .welcome-footer {
    min-height:60px
  }
  .table-screen {
    padding-top:18px
  }
  .poker-table {
    height:520px
  }
  .table-rail {
    inset:42px 0
  }
  #opponent-cards {
    top:91px
  }
  #player-cards {
    bottom:91px
  }
  .pot-display {
    top:194px
  }
  .table-bottom {
    margin-top:10px;
    padding-top:15px
  }
  .game-panel h2 {
    font-size:35px
  }
  .opponent-chips {
    top:133px
  }
  .player-chips {
    bottom:133px
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important
  }
  .card-inner {
    transition:none
  }
  .logo-halo {
    animation:none
  }
}
/* Small component details shared by the PHP screens. */
.brand-wordmark {
  display:block;
  color:var(--gold-light)
}
.load-status {
  font-size:10px;
  line-height:1.6;
  color:#8b957e;
  margin:15px 0 0
}
.load-status:empty {
  display:none
}
.welcome-details i {
  height:3px;
  width:3px;
  border-radius:50%;
  background:#806a3d
}
.welcome-details i+span {
  border:0;
  padding-left:0
}
.footer-diamond {
  font-size:6px;
  color:#a58a50;
  padding:0 9px
}
.stage-caption>span {
  display:none
}
.seat-preview-player small {
  font-size:9px;
  color:#777f70;
  margin-top:-7px;
  letter-spacing:.025em
}
.seat-info .seat-name,.seat-info .seat-stack {
  display:block
}
.seat-name small {
  font-size:6px;
  letter-spacing:.05em
}
.table-topline h1 {
  font-size:27px;
  line-height:1.1;
  letter-spacing:-.025em;
  margin:8px 0 0
}
.table-topline .eyebrow {
  font-size:8px;
  letter-spacing:.2em
}
.round-badge i {
  display:inline-block;
  width:4px;
  height:4px;
  margin-right:6px;
  background:#a3b18b;
  border-radius:50%
}
.round-badge>span {
  margin:0 6px;
  color:#625d44
}
.table-ornament {
  display:flex;
  justify-content:center;
  align-items:center;
  color:rgba(208,185,129,.035);
  font-size:145px;
  border:0
}
.felt-brand {
  display:flex;
  flex-direction:column;
  align-items:center;
  line-height:1.4;
  gap:2px;
  top:70%;
  color:rgba(208,185,129,.16)
}
.felt-brand>span {
  font-size:8px;
  letter-spacing:.3em
}
.felt-brand>strong {
  font-weight:400;
  font-size:12px;
  letter-spacing:.12em
}
.felt-brand>small {
  font-family:var(--sans);
  font-size:5px;
  letter-spacing:.2em;
  margin-top:3px
}
.panel-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-top:1px solid rgba(216,180,103,.24);
  padding-top:19px;
  margin-bottom:15px
}
.panel-top .phase-label {
  margin:0
}
.panel-suit {
  font-family:var(--serif);
  color:#ad9255;
  font-size:24px;
  line-height:1
}
.panel-bottom {
  display:flex;
  align-items:center;
  gap:7px;
  font-size:7px;
  letter-spacing:.13em;
  color:#596a56;
  margin-top:29px
}
.live-dot {
  display:inline-block;
  width:4px;
  height:4px;
  background:#768966;
  border-radius:50%
}
.game-panel .action-hint {
  font-size:9px;
  line-height:1.6;
  min-height:0;
  margin:12px 0 0;
  color:#7f8c75
}
.progress-step b {
  font-weight:400
}
.progress-track>i {
  width:22px;
  height:1px;
  background:rgba(216,180,103,.1);
  align-self:center
}
.bottom-note {
  font-size:8px;
  letter-spacing:.1em;
  color:#66735f
}
.deck-top small {
  position:absolute;
  bottom:8px;
  left:50%;
  translate:-50% 0;
  font-family:var(--serif);
  color:#a99051;
  font-size:6px;
  letter-spacing:.1em
}
.finale-logo {
  height:90px;
  width:90px;
  object-fit:contain;
  margin:0 auto 25px
}
.prize-prompt .prize-divider {
  display:none
}
.modal {
  margin:0;
  width:100vw;
  max-width:none;
  height:100svh;
  max-height:none;
  border:0;
  color:var(--cream)
}
.modal:not([open]) {
  display:none
}
.modal::backdrop {
  background:transparent
}
.modal-panel .eyebrow {
  font-size:8px;
  margin-bottom:18px
}
.modal-panel .button {
  width:100%;
  margin-top:15px
}
.modal-panel .help-foot {
  font-size:10px;
  color:#7c8974
}
.modal-panel .modal-close {
  width:30px;
  height:30px;
  border:0;
  font-size:22px
}
.noscript-message {
  position:fixed;
  inset:auto 20px 20px;
  padding:20px;
  background:#3c2d14;
  border:1px solid #a18445;
  z-index:999;
  text-align:center;
  color:#fff1ce
}
.sound-waves {
  display:none
}
.sound-slash {
  display:block
}
#sound-toggle[aria-pressed=true] .sound-waves {
  display:block
}
#sound-toggle[aria-pressed=true] .sound-slash {
  display:none
}
@media(max-width:900px) {
  .game-panel .panel-top {
    grid-column:1/2;
    margin:0 0 12px;
    padding-top:14px
  }
  .game-panel .panel-bottom {
    grid-column:2/3;
    grid-row:5;
    margin-top:15px;
    justify-content:center
  }
  .progress-track {
    gap:14px
  }
  .progress-track>i {
    width:12px
  }
  .felt-brand {
    top:70%
  }
  .table-topline h1 {
    font-size:26px
  }
}
@media(max-width:650px) {
  .table-topline h1 {
    font-size:24px;
    margin-top:6px
  }
  .table-topline .eyebrow {
    font-size:7px;
    letter-spacing:.12em
  }
  .round-badge {
    max-width:122px;
    text-align:center;
    font-size:6px;
    line-height:1.9;
    padding:4px 7px
  }
  .round-badge>span {
    margin:0 3px
  }
  .game-panel .panel-top {
    width:100%;
    max-width:210px;
    justify-content:center;
    gap:15px;
    border-top:0;
    padding-top:0;
    margin-bottom:8px
  }
  .panel-suit {
    font-size:15px
  }
  .game-panel .panel-top .phase-label {
    margin:0
  }
  .game-panel .panel-bottom {
    margin-top:20px;
    font-size:6px
  }
  .game-panel .action-hint {
    font-size:8px;
    margin-top:10px
  }
  .table-bottom .bottom-note {
    display:none
  }
  .progress-track {
    gap:9px
  }
  .progress-track>i {
    width:12px
  }
  .felt-brand {
    top:68.5%
  }
  .felt-brand>strong {
    font-size:9px
  }
  .felt-brand>span {
    font-size:6px
  }
  .felt-brand>small {
    font-size:4px
  }
  .deck-top small {
    bottom:6px;
    font-size:4px
  }
  .finale-logo {
    width:75px;
    height:75px;
    margin-bottom:20px
  }
  .seat-name small {
    font-size:5px
  }
  .modal-panel .eyebrow {
    font-size:7px
  }
  .load-status {
    font-size:9px
  }
  .table-ornament {
    font-size:110px
  }
}
/* Runtime states and natural logo proportions. */
.hero-logo {
  height:auto;
  aspect-ratio:1;
  object-fit:contain
}
.table-chips.is-empty {
  visibility:hidden
}
.pot-chips {
  opacity:0;
  transition:opacity .3s
}
.pot-chips.has-pot {
  opacity:1
}
.progress-step.is-current {
  color:var(--gold-light)
}
.progress-step.is-current:before {
  background:var(--gold);
  border-color:var(--gold);
  box-shadow:0 0 8px rgba(216,180,103,.4)
}
.progress-step.is-complete {
  color:#949d87
}
.progress-step.is-complete:before {
  border-color:#a19b76;
  background:#a19b76
}
.river-suspense .table-felt {
  filter:brightness(.8)
}
.river-suspense .deck {
  filter:drop-shadow(0 0 14px rgba(216,180,103,.25))
}
.hand-status.hero-hand {
  color:#f4dfaa;
  border-color:#c8a253;
  background:rgba(216,180,103,.1)
}
.phase-label {
  display:block
}
.screen:focus {
  outline:0
}
h1[tabindex]:focus {
  outline:none
}

/* Casino signage and tactile game controls. */
body,
body.celebrating {
  background: #0e100e;
}
h1, h2 {
  font-weight: 700;
  letter-spacing: -.025em;
}
.site-header {
  border-bottom: 2px solid #414335;
}
.header-right {
  gap: 12px;
}
.private-tag {
  font-size: 11px;
  letter-spacing: .06em;
  color: #cbc5b5;
  margin-right: 12px;
}
.private-tag:before,
.eyebrow:before {
  display: none;
}
.icon-button {
  width: 46px;
  height: 46px;
  border: 2px solid #6a6754;
  border-radius: 3px;
  background: #191c17;
  color: #ead7aa;
  box-shadow: 0 3px 0 #050604;
}
.icon-button:hover {
  background: #282d23;
  border-color: #d6b368;
}
.icon-button svg {
  width: 23px;
  height: 23px;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.button,
.game-panel .button,
.welcome-copy .button {
  min-height: 64px;
  padding: 17px 23px;
  gap: 32px;
  border-radius: 3px;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .01em;
  justify-content: space-between;
  transition: background-color .15s, transform .12s, box-shadow .12s;
}
.button-gold {
  background: #d5b069;
  border: 2px solid #efd59d;
  border-bottom-color: #a47b38;
  color: #17190f;
  box-shadow: 0 5px 0 #735022, 0 7px 0 #050604;
}
.button-gold:hover:not(:disabled) {
  background: #e8c583;
  transform: translateY(-1px);
  box-shadow: 0 6px 0 #735022, 0 8px 0 #050604;
  filter: none;
}
.button-gold:active:not(:disabled) {
  transform: translateY(4px);
  box-shadow: 0 1px 0 #735022, 0 3px 0 #050604;
}
.button-gold:disabled {
  opacity: 1;
  filter: none;
  color: #a19b87;
  background: #353a2e;
  border-color: #5a604c;
  box-shadow: 0 3px 0 #151a12;
}
.button .action-arrow {
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.5;
  stroke-linecap: square;
  stroke-linejoin: miter;
  transition: transform .15s;
}
.button:hover:not(:disabled) .action-arrow {
  transform: translateX(3px);
}
.button-quiet {
  min-height: 48px;
  padding: 12px 18px;
  gap: 16px;
  border: 2px solid #77735d;
  border-radius: 3px;
  color: #d3cebe;
  background: #191d16;
  font-size: 12px;
  font-weight: 700;
}
.button-quiet:hover {
  color: #f4dfaa;
  background: #272c21;
  border-color: #d5b069;
}
.replay-icon {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.eyebrow,
.phase-label,
.game-panel .phase-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
}
.welcome-copy h1 {
  font-size: clamp(68px, 7.2vw, 104px);
  line-height: .99;
  margin-bottom: 29px;
}
.welcome-copy h1 .gold {
  font-style: normal;
  display: inline;
  color: #d5b069;
}
.welcome-copy .lead {
  color: #c2c4b7;
  font-size: 17px;
  line-height: 1.65;
  max-width: 390px;
}
.welcome-copy .button {
  min-width: 265px;
}
.welcome-details {
  font-size: 12px;
  text-transform: none;
  letter-spacing: 0;
  color: #b6bcaa;
  gap: 14px;
  margin-top: 27px;
}
.hero-logo {
  filter: none;
}
.welcome-footer {
  border-top: 2px solid #414335;
  font-size: 10px;
  letter-spacing: .06em;
  color: #a6ac9a;
}
.intro-screen h1,
.finale-layout h1 {
  font-weight: 700;
  letter-spacing: -.025em;
}
.intro-lines {
  font-size: 16px;
  color: #c2c4b7;
}
.seat {
  min-width: 194px;
  border: 2px solid #68705c;
  border-radius: 5px;
  padding: 8px 12px 8px 8px;
  background: #20261c;
  box-shadow: 0 5px 0 #070a06;
}
.seat-player {
  border-color: #d5b069;
  background: #262b1c;
}
.seat-opponent {
  background: #1d2520;
}
.seat-info {
  min-width: 105px;
}
.seat-name {
  font-size: 14px;
  font-weight: 700;
}
.seat-name small {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0;
}
.seat-stack {
  font: 800 18px/1.4 var(--sans);
  color: #f3e6bf;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}
.seat-status {
  font-size: 9px;
  letter-spacing: .04em;
  font-weight: 700;
}
.game-panel h2 {
  font-weight: 700;
  font-size: 36px;
}
.game-panel p {
  font-size: 14px;
  line-height: 1.7;
  color: #c0c6b6;
}
.game-panel .action-hint {
  font-size: 11px;
  color: #a6af98;
  letter-spacing: 0;
}
.panel-top {
  border-top: 3px solid #a38347;
}
.round-badge {
  border: 0;
  border-radius: 0;
  padding: 0;
  color: #c6ccb9;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .01em;
}
.round-badge i {
  display: none;
}
.progress-step {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .025em;
  color: #a5ae99;
}
.progress-step b {
  font-weight: 700;
}
.progress-step:before,
.progress-track > i {
  display: none;
}
.progress-step.is-current {
  border-bottom: 3px solid #d5b069;
  padding-bottom: 7px;
}
.hand-status {
  border-radius: 2px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
}
.prize-prompt {
  border: 2px solid #b08b45;
  border-radius: 3px;
  background: #1d2318;
  padding: 32px;
  box-shadow: 0 7px 0 #070a06;
}
.prize-prompt:before,
.prize-prompt:after {
  display: none;
}
.prize-prompt h2 {
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -.025em;
}
.prize-prompt p {
  font-size: 13px;
  color: #bec5b0;
}
.modal-panel {
  border: 2px solid #b08b45;
  border-radius: 4px;
  max-height: calc(100svh - 44px);
  overflow: auto;
}
.modal-panel .modal-close {
  width: 40px;
  height: 40px;
  border: 2px solid #77735d;
}
@media (max-width: 900px) {
  .game-panel .panel-top {
    border-top: 3px solid #a38347;
  }
}
@media (max-width: 650px) {
  .header-right { gap: 8px; }
  .icon-button { width: 42px; height: 42px; }
  .welcome-copy .eyebrow { font-size: 11px; letter-spacing: .06em; }
  .welcome-copy h1 { font-size: 66px; line-height: 1; }
  .welcome-copy .lead { font-size: 15px; max-width: 320px; }
  .welcome-copy .button { width: 100%; min-width: 260px; }
  .welcome-details { font-size: 12px; }
  .welcome-footer { font-size: 8px; letter-spacing: .02em; }
  .intro-screen .eyebrow { font-size: 11px; letter-spacing: .06em; }
  .intro-screen h1 { font-size: 48px; }
  .intro-lines { font-size: 15px; }
  .table-topline .eyebrow { display: none; }
  .table-topline h1 { font-size: 26px; font-weight: 700; }
  .round-badge { max-width: 130px; font-size: 10px; line-height: 1.6; }
  .seat { min-width: 186px; padding: 7px 10px 7px 7px; }
  .seat-name { font-size: 13px; }
  .seat-name small { font-size: 9px; }
  .seat-stack { font-size: 17px; }
  .seat-status { font-size: 9px; }
  .game-panel .panel-top { padding-top: 13px; max-width: none; }
  .game-panel .phase-label { font-size: 11px; }
  .game-panel h2 { font-size: 32px; }
  .game-panel p { font-size: 14px; max-width: 340px; }
  .game-panel .button { font-size: 15px; min-height: 64px; }
  .game-panel .action-hint { font-size: 11px; }
  .progress-track { width: 100%; justify-content: space-between; gap: 7px; }
  .progress-step { font-size: 10px; letter-spacing: 0; }
  .hand-status { font-size: 10px; }
  .finale-layout h1 { font-size: 51px; }
  .finale-message { font-size: 14px; }
  .prize-prompt { padding: 28px 16px; }
  .prize-prompt h2 { font-size: 34px; }
  .prize-prompt p { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .button, .button .action-arrow { transition: none; }
}
.round-badge { display: flex; align-items: center; gap: 12px; }
.round-badge > span { margin: 0; color: inherit; white-space: nowrap; }
@media (max-width: 650px) {
  .round-badge { flex-direction: column; align-items: flex-end; gap: 1px; }
}