:root {
  --bg: #061a0f;
  --panel: #102a1c;
  --panel-2: #0d2317;
  --line: #1d4630;
  --text: #eaf3ec;
  --muted: #9fb6a8;
  --gold: #d8b54a;
  --gold-2: #f0d27a;
  --red: #e0473e;
  --radius: 14px;
  --font-display: 'Cinzel', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.5;
  color: var(--text);
  background:
    radial-gradient(140% 120% at 50% -20%, #11341f 0%, #0b2417 45%, #061a0f 100%) no-repeat fixed,
    var(--bg);
  min-height: 100vh;
}
h1, h2, .brand { font-family: var(--font-display); letter-spacing: .02em; }
h1 { font-size: clamp(1.6rem, 4.5vw, 2.2rem); margin: 0 0 1rem; }
h2 { font-size: 1.1rem; margin: 0 0 .6rem; color: var(--gold-2); }
a { color: var(--gold-2); text-decoration: none; }
a:hover { text-decoration: underline; }
code { background: #0a1d12; padding: .12rem .4rem; border-radius: 4px; border: 1px solid var(--line); font-size: .9em; }

/* suits */
.suit { font-style: normal; }
.suit.s, .suit.c { color: #f3f6f1; }
.suit.h, .suit.d { color: var(--red); }
.suit.gold { color: var(--gold); }

/* top bar */
.topbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem;
  padding: .7rem 1rem;
  background: linear-gradient(180deg, #0c2417, #0a1f13);
  border-bottom: 2px solid var(--gold);
  box-shadow: 0 2px 18px rgba(0,0,0,.4);
}
.brand { font-weight: 700; color: var(--gold-2); font-size: 1.15rem; }
.mainnav { display: flex; flex-wrap: wrap; gap: .2rem; align-items: center; margin-left: auto; }
.mainnav a, .mainnav .linklike { padding: .35rem .6rem; border-radius: 6px; color: var(--muted); }
.mainnav a.active { color: #06140c; background: var(--gold); }
.mainnav a:hover { text-decoration: none; color: var(--text); }
.whoami { color: var(--gold-2); font-weight: 600; font-size: .8rem; padding: .2rem .55rem; border: 1px solid var(--line); border-radius: 999px; background: rgba(216,181,74,.08); }
.inline-logout { margin: 0; display: inline; }
.linklike { background: none; border: 0; color: var(--muted); cursor: pointer; font: inherit; padding: .35rem .6rem; }
.linklike:hover { color: var(--text); }

/* layout */
.container { max-width: 880px; margin: 0 auto; padding: 1.25rem 1rem 3rem; }
.muted { color: var(--muted); }
.error { color: var(--red); font-weight: 600; }

/* hero / felt */
.hero.felt {
  text-align: center;
  padding: 2.2rem 1rem 1.8rem;
  margin-bottom: 1.6rem;
  border-radius: 20px;
  border: 1px solid #1c5a38;
  background:
    radial-gradient(80% 120% at 50% -10%, rgba(255,255,255,.07), transparent 60%),
    radial-gradient(120% 130% at 50% 18%, #18613a 0%, #0e3f25 55%, #0a3420 100%);
  box-shadow: inset 0 0 70px rgba(0,0,0,.45), 0 12px 30px rgba(0,0,0,.4);
}
.hero h1 { color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.45); margin: .7rem 0 .2rem; }
.hero .lede { color: #d7e6da; font-size: 1.05rem; margin: 0; }
.suits-row { font-size: 1.3rem; letter-spacing: .45rem; margin: .6rem 0 0; }

.hero-cards { margin: 0 auto 1.4rem; line-height: 0; position: relative; z-index: 0; }
.hero-cards .deal { display: inline-block; transform-origin: bottom center; margin: 0 -10px; }
.hero-cards .deal:nth-child(1) { transform: rotate(-15deg) translateY(10px); }
.hero-cards .deal:nth-child(2) { transform: rotate(-7deg) translateY(3px); }
.hero-cards .deal:nth-child(3) { transform: rotate(0); position: relative; z-index: 2; }
.hero-cards .deal:nth-child(4) { transform: rotate(7deg) translateY(3px); }
.hero-cards .deal:nth-child(5) { transform: rotate(15deg) translateY(10px); }
.hero-cards .pcard {
  width: clamp(44px, 11.5vw, 72px); height: auto; display: block;
  filter: drop-shadow(0 7px 9px rgba(0,0,0,.45));
  animation: deal-in .55s cubic-bezier(.2,.75,.3,1) both;
}
.hero-cards .deal:nth-child(1) .pcard { animation-delay: .05s; }
.hero-cards .deal:nth-child(2) .pcard { animation-delay: .15s; }
.hero-cards .deal:nth-child(3) .pcard { animation-delay: .25s; }
.hero-cards .deal:nth-child(4) .pcard { animation-delay: .35s; }
.hero-cards .deal:nth-child(5) .pcard { animation-delay: .45s; }
@keyframes deal-in {
  from { opacity: 0; transform: translateY(-34px) rotate(-12deg) scale(.9); }
  to   { opacity: 1; transform: translateY(0) rotate(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) { .hero-cards .pcard { animation: none; } }

/* keep hero text above the dealt cards */
.hero-eyebrow, .hero h1, .hero .lede, .hero .cheeky, .chip-row { position: relative; z-index: 1; }

/* cards / panels */
.cards { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 680px) { .cards { grid-template-columns: 1fr 1fr 1fr; } }
.card {
  background: linear-gradient(180deg, var(--panel), var(--panel-2));
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.1rem 1.2rem;
  box-shadow: 0 6px 18px rgba(0,0,0,.28);
}
.card ul { margin: .25rem 0 0; padding-left: 1.1rem; }
.card li { margin: .3rem 0; }

/* rules */
.rules-block { margin: 1.6rem 0; }
.tbl { border-collapse: collapse; width: 100%; max-width: 320px; }
.tbl th, .tbl td { text-align: left; padding: .45rem .7rem; border-bottom: 1px solid var(--line); }
.tbl th { color: var(--gold-2); font-family: var(--font-display); font-weight: 600; }
.decisions dt { font-weight: 600; margin-top: 1rem; display: flex; gap: .5rem; align-items: center; }
.decisions dd { margin: .25rem 0 0; }
.by { color: var(--gold-2); font-size: .85rem; margin-left: .3rem; }

/* pills */
.pill {
  font-size: .68rem; text-transform: uppercase; letter-spacing: .05em;
  padding: .14rem .5rem; border-radius: 999px;
  background: var(--panel-2); color: var(--muted); border: 1px solid var(--line);
}
.pill.ok { background: rgba(216,181,74,.15); color: var(--gold-2); border-color: var(--gold); }

/* forms */
.form label, .qcard label { display: block; margin: .65rem 0; font-weight: 600; }
input[type=text], input[type=password], input[type=date], input[type=time], input[type=number], textarea {
  display: block; width: 100%; margin-top: .3rem;
  background: #0a1d12; color: var(--text);
  border: 1px solid #214a32; border-radius: 8px; padding: .6rem .7rem; font: inherit;
}
input:focus, textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(216,181,74,.18); }
textarea { resize: vertical; }
button {
  background: linear-gradient(180deg, var(--gold-2), var(--gold));
  color: #2a1e00; border: 0; border-radius: 8px;
  padding: .6rem 1.15rem; font-family: var(--font-body); font-weight: 700; letter-spacing: .02em; cursor: pointer;
}
button:hover { filter: brightness(1.06); }
.form.narrow { max-width: 380px; }

/* auth */
.auth { max-width: 400px; margin: 1.5rem auto; text-align: center; }
.auth-suit .suit { font-size: 3rem; line-height: 1; }
.auth .form { text-align: left; margin-top: 1rem; }

/* reject (7-2 offsuit) */
.reject { text-align: center; max-width: 580px; margin: 1.5rem auto 3rem; }
.reject-cards { display: flex; justify-content: center; gap: 1.4rem; margin-bottom: 1.3rem; }
.reject-cards .pcard { width: clamp(92px, 26vw, 132px); height: auto; filter: drop-shadow(0 10px 16px rgba(0,0,0,.55)); }
.tilt-l .pcard { transform: rotate(-10deg); }
.tilt-r .pcard { transform: rotate(10deg); }
.reject h1 { color: #fff; }
.reject .lede { color: #d7e6da; font-size: 1.1rem; }
.reject-msg { font-size: 1.15rem; margin-top: .7rem; }
.reject strong { color: var(--red); }

/* admin board */
.admin-head { margin-bottom: 1.2rem; }
.qcard { margin: 0 0 1rem; }
.qcard-head { display: flex; align-items: center; gap: .5rem; }
.qcard-head h2 { margin: 0; color: var(--gold-2); }
.qcard.decided { border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold), 0 6px 18px rgba(0,0,0,.28); }
.prompt { margin: .4rem 0 .2rem; }
.suggested { color: var(--muted); font-size: .92rem; margin: .2rem 0; }
.suggested span { color: var(--gold-2); font-weight: 600; }
.qcard-foot { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: .6rem; }
.check { display: inline-flex !important; align-items: center; gap: .4rem; font-weight: 600; margin: 0 !important; }
.check input { width: auto; margin: 0; }
.ts { font-size: .8rem; }

/* footer */
.foot { border-top: 1px solid var(--line); color: var(--muted); padding: 1.2rem; text-align: center; font-size: .85rem; }
.pcard { display: inline-block; vertical-align: bottom; }

/* thoughts board */
.thoughts { margin: .7rem 0 .2rem; display: grid; gap: .7rem; }
.thought-other { background: #0a1d12; border: 1px solid var(--line); border-radius: 8px; padding: .55rem .7rem; }
.thought-by { color: var(--gold-2); font-weight: 600; font-size: .85rem; display: block; margin-bottom: .15rem; }
.thought-other p { margin: 0; }
.thought-mine .you { color: var(--gold-2); font-weight: 600; font-size: .8rem; }
.thought-form { margin: 0; }
.thought-form button { margin-top: .35rem; }

/* voting */
.vote-box { margin-top: .85rem; border-top: 1px dashed var(--line); padding-top: .75rem; }
.vote-box h3 { font-family: var(--font-display); color: var(--gold-2); font-size: .95rem; margin: 0 0 .55rem; }
.vote-form { display: grid; gap: .4rem; }
.vote-opt {
  display: flex !important; align-items: center; gap: .55rem; margin: 0 !important; font-weight: 500 !important;
  background: #0a1d12; border: 1px solid var(--line); border-radius: 8px; padding: .45rem .65rem; cursor: pointer;
}
.vote-opt input { width: auto !important; margin: 0 !important; }
.vote-opt .backers { margin-left: auto; font-size: .78rem; color: var(--gold-2); }
.vote-form button { justify-self: start; margin-top: .25rem; }
.outcome { margin: .65rem 0 0; font-weight: 600; }
.outcome.status-decided { color: var(--gold-2); }
.outcome.status-leading { color: var(--text); }
.outcome.status-split { color: var(--red); }
.outcome.status-awaiting { color: var(--muted); }

/* ---- Dar All-In Freaks: brand, chips, table ---- */

/* poker chip (pure CSS) */
.chip {
  --sz: 56px; --c: #bf2f2f;
  width: var(--sz); height: var(--sz); border-radius: 50%;
  display: inline-block; position: relative; vertical-align: middle;
  background: var(--c);
  background-image: repeating-conic-gradient(from 0deg, rgba(255,255,255,.92) 0 7deg, rgba(0,0,0,0) 7deg 30deg);
  box-shadow: 0 5px 12px rgba(0,0,0,.45), inset 0 0 0 3px rgba(0,0,0,.18);
}
.chip::before {
  content: ""; position: absolute; inset: 21%; border-radius: 50%;
  background: radial-gradient(circle at 50% 38%, #fffdf5, #ece2c8);
  box-shadow: inset 0 0 0 2px var(--c);
}
.chip::after {
  content: attr(data-mark); position: absolute; inset: 0;
  display: grid; place-items: center;
  color: var(--c); font-family: var(--font-display); font-weight: 700;
  font-size: calc(var(--sz) * .34); line-height: 1;
}

/* brand wordmark in the top bar */
.brand { display: inline-flex; align-items: center; gap: .5rem; }
.brand .chip { --sz: 26px; }
.brand-name { font-family: var(--font-display); color: var(--gold-2); letter-spacing: .03em; }

/* hero styled as a poker table (felt + leather rail + gold trim) */
.hero.felt {
  position: relative;
  border-radius: 30px;
  border: 14px solid #241712;
  background:
    radial-gradient(rgba(255,255,255,.025) 1px, transparent 1px) 0 0 / 16px 16px,
    radial-gradient(80% 120% at 50% -10%, rgba(255,255,255,.08), transparent 60%),
    radial-gradient(120% 130% at 50% 18%, #18613a 0%, #0e3f25 55%, #0a3420 100%);
  box-shadow:
    inset 0 0 0 3px rgba(212,181,74,.32),
    inset 0 2px 0 rgba(255,255,255,.05),
    inset 0 0 90px rgba(0,0,0,.55),
    0 18px 40px rgba(0,0,0,.55);
  padding: 2.4rem 1.2rem 2rem;
}
.hero h1 {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(2rem, 7vw, 3.4rem); line-height: 1.05;
  color: #fff; margin: .1rem 0 .3rem;
  text-shadow: 0 2px 0 rgba(0,0,0,.35), 0 0 22px rgba(212,181,74,.25);
}
.hero-eyebrow {
  text-transform: uppercase; letter-spacing: .28em; font-size: .72rem;
  color: var(--gold-2); margin: .2rem 0 .1rem;
}
.chip-row { display: flex; justify-content: center; gap: .6rem; margin-top: 1rem; }
.chip-row .chip { --sz: 52px; }

/* footer flourish */
.foot-brand { font-family: var(--font-display); color: var(--gold-2); letter-spacing: .04em; margin: 0 0 .2rem; font-size: 1.05rem; }
.suits-row.tiny { font-size: 1rem; letter-spacing: .35rem; margin: .1rem 0 .4rem; }

/* cheeky hero line + footer 7-2 flourish */
.hero .cheeky { color: #cfe3d4; font-style: italic; opacity: .92; font-size: .95rem; margin: .45rem 0 0; }
.seven-deuce { display: flex; flex-direction: column; align-items: center; gap: .35rem; margin: .2rem 0 .55rem; }
.seven-deuce .sd-cards .pcard { width: 38px; height: auto; filter: drop-shadow(0 4px 7px rgba(0,0,0,.5)); }
.seven-deuce .sd-cards .pcard:first-child { transform: rotate(-9deg); margin-right: -3px; }
.seven-deuce .sd-cards .pcard:last-child { transform: rotate(9deg); }
.seven-deuce .sd-cap { color: var(--muted); font-size: .8rem; font-style: italic; }
.foot-meta { display: block; }

/* ---- Watermelon Crew collab ---- */
.melon { width: 34px; height: auto; vertical-align: middle; }
.collab { margin: .85rem 0 0; color: #d7e6da; display: inline-flex; align-items: center; gap: .5rem; font-size: .95rem; }
.collab .melon { width: 30px; }
.collab strong { color: #ff6b8a; }

.melon-banner {
  position: relative; border-radius: 16px; overflow: hidden; height: 130px; margin: 0 0 1.6rem;
  background-image: linear-gradient(rgba(6,20,13,.50), rgba(6,20,13,.64)), url(watermelon.jpg);
  background-size: cover; background-position: center;
  border: 1px solid var(--line); box-shadow: 0 8px 22px rgba(0,0,0,.4);
  display: grid; place-items: center;
}
.melon-banner-inner { font-family: var(--font-display); text-align: center; padding: 0 1rem; line-height: 1.2; }
.melon-banner-inner span { font-size: clamp(1rem, 4.2vw, 1.5rem); text-shadow: 0 2px 8px rgba(0,0,0,.6); }
.mb-a { color: var(--gold-2); }
.mb-x { color: #ff6b8a; margin: 0 .5rem; }
.mb-b { color: #8fe39a; }

.melon-burst { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; margin: 0 0 1rem; }
.melon-burst .melon { width: clamp(40px, 12vw, 64px); filter: drop-shadow(0 4px 7px rgba(0,0,0,.4)); }

.hosts { color: var(--muted); font-size: .85rem; margin: .35rem 0; }
.hosts .aka { color: #8fe39a; }

/* login celebration: chips burst from centre, scatter, then fade */
.chip-burst {
  position: fixed; inset: 0; z-index: 60; pointer-events: none;
  display: grid; place-items: center;
  animation: chip-burst-out .35s ease-in 2.1s forwards;
}
.chip-burst .chip {
  --sz: 56px; position: absolute;
  opacity: 0; transform: translate(0, 0) scale(.2) rotate(0deg);
  animation: chip-fly 2.2s cubic-bezier(.18,.7,.3,1) forwards;
  filter: drop-shadow(0 8px 16px rgba(0,0,0,.5));
}
.chip-burst .chip:nth-child(1) { --tx: -240px; --ty: -140px; --rot: -220deg; animation-delay: 0s; }
.chip-burst .chip:nth-child(2) { --tx:  220px; --ty: -170px; --rot:  260deg; animation-delay: .05s; }
.chip-burst .chip:nth-child(3) { --tx: -300px; --ty:   60px; --rot: -180deg; animation-delay: .1s; }
.chip-burst .chip:nth-child(4) { --tx:  300px; --ty:   90px; --rot:  200deg; animation-delay: .07s; }
.chip-burst .chip:nth-child(5) { --tx:  -90px; --ty: -230px; --rot: -300deg; animation-delay: .12s; }
.chip-burst .chip:nth-child(6) { --tx:  120px; --ty:  210px; --rot:  240deg; animation-delay: .03s; }
.chip-burst .chip:nth-child(7) { --tx: -160px; --ty:  200px; --rot: -260deg; animation-delay: .15s; }
.chip-burst .chip:nth-child(8) { --tx:  180px; --ty: -110px; --rot:  320deg; animation-delay: .09s; }

@keyframes chip-fly {
  0%   { opacity: 0; transform: translate(0,0) scale(.2) rotate(0deg); }
  18%  { opacity: 1; transform: translate(calc(var(--tx) * .55), calc(var(--ty) * .55)) scale(1.1) rotate(calc(var(--rot) * .5)); }
  70%  { opacity: 1; transform: translate(var(--tx), var(--ty)) scale(1) rotate(var(--rot)); }
  100% { opacity: 0; transform: translate(var(--tx), calc(var(--ty) + 80px)) scale(.85) rotate(var(--rot)); }
}
@keyframes chip-burst-out { to { opacity: 0; visibility: hidden; } }

@media (prefers-reduced-motion: reduce) {
  .chip-burst { display: none; }
}

/* ---- Birthday blowout (only the birthday user, on their day) ---- */
.bday {
  position: fixed; inset: 0; z-index: 80; pointer-events: none;
  display: grid; place-items: center;
  background: radial-gradient(120% 90% at 50% 30%, rgba(0,0,0,.62), rgba(0,0,0,.32) 60%, transparent 100%);
  animation: bday-backdrop .5s ease-out, bday-fade .8s ease-in 6.2s forwards;
}
.bday-confetti {
  position: fixed; inset: 0 0 auto 0; height: 0; display: flex;
  justify-content: space-around; flex-wrap: wrap;
}
.bday-confetti .chip {
  --sz: 30px; margin: 0 .4vw; opacity: 0;
  animation: confetti-fall 2.8s linear infinite;
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.45));
}
.bday-confetti .chip:nth-child(6n+1) { --sz: 22px; animation-duration: 3.4s; animation-delay: 0s; }
.bday-confetti .chip:nth-child(6n+2) { --sz: 34px; animation-duration: 2.6s; animation-delay: .5s; }
.bday-confetti .chip:nth-child(6n+3) { --sz: 26px; animation-duration: 3.1s; animation-delay: .9s; }
.bday-confetti .chip:nth-child(6n+4) { --sz: 38px; animation-duration: 2.9s; animation-delay: .2s; }
.bday-confetti .chip:nth-child(6n+5) { --sz: 24px; animation-duration: 3.6s; animation-delay: 1.2s; }
.bday-confetti .chip:nth-child(6n)   { --sz: 32px; animation-duration: 2.4s; animation-delay: .7s; }

.bday-card {
  position: relative; text-align: center; max-width: 92vw;
  padding: 1.6rem 1.5rem 1.8rem; border-radius: 22px;
  border: 3px solid rgba(212,181,74,.7);
  background: linear-gradient(180deg, rgba(28,22,16,.96), rgba(14,11,8,.96));
  box-shadow: 0 24px 60px rgba(0,0,0,.6), inset 0 0 0 2px rgba(255,255,255,.05), 0 0 50px rgba(212,181,74,.25);
  animation: bday-pop .7s cubic-bezier(.2,1.4,.4,1) both;
}
.bday-fanfare { font-size: 1.8rem; margin: 0 0 .2rem; animation: bday-wiggle 1.1s ease-in-out infinite; }
.bday-title {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(1.7rem, 6.5vw, 3rem); line-height: 1.04; margin: .1rem 0 .6rem;
  color: #fff; text-shadow: 0 2px 0 rgba(0,0,0,.4), 0 0 26px rgba(212,181,74,.45);
}
.bday-aces { display: flex; justify-content: center; gap: .15rem; margin: .3rem 0 .7rem; }
.bday-aces .pcard { width: clamp(48px, 14vw, 78px); height: auto; filter: drop-shadow(0 8px 14px rgba(0,0,0,.55)); }
.bday-aces span { display: inline-block; transform-origin: bottom center; opacity: 0; animation: ace-deal .55s ease-out both; }
.bday-aces span:nth-child(1) { animation-delay: .45s; --tilt: -12deg; }
.bday-aces span:nth-child(2) { animation-delay: .60s; --tilt:  -4deg; }
.bday-aces span:nth-child(3) { animation-delay: .75s; --tilt:   4deg; }
.bday-aces span:nth-child(4) { animation-delay: .90s; --tilt:  12deg; }
.bday-sub { color: var(--gold-2); font-weight: 600; margin: .2rem 0 .35rem; }
.bday-pun { color: #cfe3d4; font-style: italic; margin: 0; font-size: .95rem; }

@keyframes bday-backdrop { from { opacity: 0; } to { opacity: 1; } }
@keyframes bday-fade { to { opacity: 0; visibility: hidden; } }
@keyframes bday-pop {
  0%   { opacity: 0; transform: scale(.5) translateY(20px); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes bday-wiggle {
  0%, 100% { transform: rotate(-6deg) scale(1); }
  50%      { transform: rotate(6deg) scale(1.12); }
}
@keyframes ace-deal {
  0%   { opacity: 0; transform: translateY(-40px) rotate(0deg) scale(.6); }
  100% { opacity: 1; transform: translateY(0) rotate(var(--tilt)) scale(1); }
}
@keyframes confetti-fall {
  0%   { opacity: 0; transform: translateY(-12vh) rotate(0deg); }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { opacity: .9; transform: translateY(104vh) rotate(540deg); }
}

@media (prefers-reduced-motion: reduce) {
  .bday-confetti { display: none; }
  .bday { animation: none; background: rgba(0,0,0,.5); }
  .bday-card, .bday-fanfare, .bday-aces span { animation: none; opacity: 1; transform: none; }
}

/* ---- Landing (the gate) ---- */
body.bare { background:
  radial-gradient(120% 95% at 50% -10%, #163a23 0%, #081f13 55%, #03100a 100%) no-repeat fixed,
  var(--bg);
}
.container-bare { max-width: 640px; padding-top: clamp(2rem, 7vh, 5rem); padding-bottom: 3rem; }

.landing { display: flex; flex-direction: column; align-items: center; text-align: center; }

/* aces resting on the rail: the best hand greets you (the 7-2 sends you off in the footer) */
.landing-fan { line-height: 0; margin-bottom: -1.5rem; position: relative; z-index: 2; }
.landing-fan .deal { display: inline-block; transform-origin: bottom center; }
.landing-fan .deal:nth-child(1) { transform: rotate(-12deg) translateX(10px); }
.landing-fan .deal:nth-child(2) { transform: rotate(12deg) translateX(-10px); }
.landing-fan .pcard {
  width: clamp(54px, 15vw, 78px); height: auto; display: inline-block;
  filter: drop-shadow(0 9px 13px rgba(0,0,0,.55));
  animation: deal-in .6s cubic-bezier(.2,.75,.3,1) both;
}
.landing-fan .deal:nth-child(1) .pcard { animation-delay: .12s; }
.landing-fan .deal:nth-child(2) .pcard { animation-delay: .28s; }

/* gold-trimmed felt plaque: the members' door */
.landing-plaque {
  position: relative; width: min(560px, 92vw);
  padding: 2.6rem 1.8rem 2.1rem; border-radius: 24px;
  border: 1px solid #1c5a38;
  background:
    radial-gradient(rgba(255,255,255,.022) 1px, transparent 1px) 0 0 / 15px 15px,
    radial-gradient(90% 120% at 50% -10%, rgba(255,255,255,.07), transparent 60%),
    radial-gradient(120% 135% at 50% 14%, #155836 0%, #0e3f25 55%, #0a3119 100%);
  box-shadow:
    inset 0 0 0 3px rgba(216,181,74,.30),
    inset 0 2px 0 rgba(255,255,255,.05),
    inset 0 0 80px rgba(0,0,0,.5),
    0 18px 44px rgba(0,0,0,.55);
}
.landing-eyebrow {
  text-transform: uppercase; letter-spacing: .34em; font-size: .68rem;
  color: var(--gold-2); margin: .1rem 0 .55rem;
}
.landing-brand {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(2rem, 6.8vw, 3rem);
  color: #fff; margin: 0; letter-spacing: .03em;
  text-shadow: 0 2px 0 rgba(0,0,0,.4), 0 0 28px rgba(216,181,74,.32);
}
.landing-notice {
  max-width: 48ch; margin: 1rem auto 0;
  color: #cfe3d4; line-height: 1.65;
  font-size: clamp(.95rem, 2.3vw, 1.03rem);
}
.landing-notice strong { color: var(--gold-2); font-weight: 600; }

.landing-form { width: min(340px, 86%); margin: 1.7rem auto 0; }
.landing-prompt { color: var(--gold-2); font-size: .9rem; margin: 0 0 1.1rem; letter-spacing: .02em; }
.landing-form .landing-field + .landing-field { margin-top: 1rem; }
.landing-form button { margin-top: 1.1rem; }
.landing-field {
  position: relative;
  border-bottom: 2px solid rgba(216,181,74,.4);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.landing-field:focus-within {
  border-bottom-color: var(--gold-2);
  box-shadow: 0 3px 18px -4px rgba(216,181,74,.55);
}
.landing-field::before, .landing-field::after {
  position: absolute; top: 50%; transform: translateY(-58%);
  font-size: .82rem; pointer-events: none;
}
.landing-field::before { content: "\2660"; left: .15rem; color: rgba(216,181,74,.5); }
.landing-field::after  { content: "\2666"; right: .15rem; color: rgba(224,71,62,.6); }
.landing-field .landing-input {
  width: 100%; padding: .7rem 1.5rem; margin: 0;
  background: transparent; border: 0; border-radius: 0;
  color: #fff;
  font: 700 1.2rem var(--font-display); letter-spacing: .14em; text-align: center;
  outline: none; caret-color: var(--gold-2);
}
.landing-field .landing-input:focus { box-shadow: none; }
.landing-field .landing-input::placeholder { color: rgba(255,255,255,.16); }
.landing-field .landing-input[type="password"] { letter-spacing: .4em; }

.landing-error {
  margin: .9rem 0 0; color: #f6a5a0; font-size: .85rem; font-style: italic;
}

@media (prefers-reduced-motion: reduce) {
  .landing-fan .pcard { animation: none; }
}

/* ---- Step away (dramatic CRT shut-off) ---- */
.stepaway {
  position: fixed; inset: 0; z-index: 200;
  background: #000;
  display: grid; place-items: center;
  overflow: hidden;
  animation: stepaway-darken 4.2s ease-in forwards;
}
.stepaway-stage {
  text-align: center; color: #f4ece0;
  transform-origin: center;
  animation: crt-collapse-y .45s cubic-bezier(.55,.1,.7,.1) 2.5s forwards;
}
.stepaway-line {
  margin: 0;
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(2rem, 9vw, 4.6rem); line-height: 1;
  letter-spacing: .02em;
  text-shadow: 0 0 18px rgba(255,255,255,.18);
  opacity: 0; animation: stepaway-in .55s ease-out forwards;
}
.stepaway-line-1 { animation-delay: .15s; }
.stepaway-line-2 { animation-delay: 1.0s; }
.stepaway-sub {
  margin: .9rem 0 0; color: var(--muted);
  font-size: clamp(.9rem, 2.3vw, 1.05rem); font-style: italic;
  opacity: 0; animation: stepaway-in .6s ease-out 1.8s forwards;
}
.stepaway-crt {
  position: absolute; left: 50%; top: 50%;
  width: 96vw; height: 2px;
  background: linear-gradient(90deg, transparent, #ffffff 20%, #ffffff 80%, transparent);
  box-shadow: 0 0 16px rgba(255,255,255,.7), 0 0 32px rgba(255,255,255,.4);
  transform: translate(-50%, -50%) scaleX(0);
  opacity: 0;
  animation:
    crt-line-show .04s linear 2.94s forwards,
    crt-line-shrink .35s cubic-bezier(.55,.1,.7,.1) 2.98s forwards,
    crt-line-fade .35s ease-out 3.35s forwards;
}
.stepaway-void {
  position: absolute; inset: 0; background: #000;
  opacity: 0;
  animation: stepaway-void-in .6s ease-in 3.55s forwards;
}

@keyframes stepaway-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes crt-collapse-y {
  from { transform: scaleY(1);   opacity: 1; }
  to   { transform: scaleY(.01); opacity: .9; }
}
@keyframes crt-line-show {
  from { opacity: 0; transform: translate(-50%, -50%) scaleX(0); }
  to   { opacity: 1; transform: translate(-50%, -50%) scaleX(1); }
}
@keyframes crt-line-shrink {
  from { transform: translate(-50%, -50%) scaleX(1); }
  to   { transform: translate(-50%, -50%) scaleX(.005); }
}
@keyframes crt-line-fade {
  from { opacity: 1; }
  to   { opacity: 0; }
}
@keyframes stepaway-void-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes stepaway-darken {
  0%   { background: #0b1a12; }
  60%  { background: #050a07; }
  100% { background: #000; }
}

@media (prefers-reduced-motion: reduce) {
  .stepaway { animation: none; background: #000; }
  .stepaway-stage, .stepaway-line, .stepaway-sub { animation: none; opacity: 1; transform: none; }
  .stepaway-crt, .stepaway-void { display: none; }
}

/* ---- Bankroll Analyzer (PBT CSV upload) ---- */
.small { font-size: .85rem; }
.analyzer-form .form-row { display: flex; gap: 1rem; flex-wrap: wrap; }
.analyzer-form .form-row label { flex: 1 1 180px; }
.analyzer-form select {
  display: block; width: 100%; margin-top: .3rem;
  background: #0a1d12; color: var(--text);
  border: 1px solid #214a32; border-radius: 8px; padding: .6rem .7rem; font: inherit;
}
.analyzer-form input[type=file] { margin-top: .3rem; color: var(--muted); }

.stat-cards { margin: 1rem 0 1.2rem; }
.card.stat { display: flex; flex-direction: column; gap: .15rem; padding: .8rem 1rem; }
.card.stat .k { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.card.stat .v { font-size: 1.5rem; font-weight: 700; font-family: var(--font-display); }

.table-scroll { overflow-x: auto; margin: .4rem 0 1.4rem; }
.rtbl { max-width: none; width: 100%; font-size: .92rem; }
.rtbl th, .rtbl td { white-space: nowrap; }
.tbl td.num, .tbl th.num { text-align: right; font-variant-numeric: tabular-nums; }
.pos { color: #58c98b; }
.neg { color: var(--red); }
.zero { color: var(--muted); }
.pill.cg  { background: rgba(88,201,139,.14); color: #58c98b; border-color: #2f7a51; }
.pill.mtt { background: rgba(224,71,62,.14);  color: #ef8079; border-color: #7a322f; }
.card.warn { border-color: var(--gold); background: rgba(216,181,74,.06); margin: 1rem 0; }
.report-actions { margin-top: 1.2rem; }

/* home games: calendar + booking form */
.hg-head { margin-bottom: 1rem; }
.hg-nav { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.hg-nav strong { font-family: var(--font-display); color: var(--gold-2); }
.hg-new { font-weight: 700; }
.hg-cal { border-collapse: collapse; width: 100%; min-width: 560px; table-layout: fixed; }
.hg-cal th { color: var(--gold-2); font-family: var(--font-display); font-weight: 600; padding: .4rem; text-align: center; border-bottom: 1px solid var(--line); }
.hg-cal td { border: 1px solid var(--line); vertical-align: top; height: 4.4rem; padding: .3rem; }
.hg-cal td.hg-blank { background: rgba(255,255,255,.02); border-color: rgba(29,70,48,.4); }
.hg-date { display: block; font-size: .8rem; color: var(--muted); margin-bottom: .25rem; }
.hg-dot { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; margin: 0 .18rem .18rem 0; border: 1px solid rgba(0,0,0,.3); }
.hg-dot.sched { background: var(--gold); }
.hg-dot.played { background: #58c98b; }
.hg-dot.others { opacity: .55; }
.hg-legend { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; margin: .6rem 0 1.4rem; }
.hg-legend .hg-dot { margin: 0 .15rem 0 .7rem; }
.hg-fieldset { border: 1px solid var(--line); border-radius: 10px; padding: .8rem 1rem; margin: 1rem 0; }
.hg-fieldset legend { color: var(--gold-2); font-family: var(--font-display); padding: 0 .4rem; }
.hg-seg { display: inline-block !important; margin-right: 1.2rem !important; }
.hg-check { font-weight: 600; }
.hg-form .form-row { display: flex; gap: 1rem; flex-wrap: wrap; }
.hg-form .form-row label { flex: 1 1 160px; }
.hg-actions { margin-top: 1.2rem; }
.hg-delete-form { margin-top: 1.4rem; }
.hg-danger { background: linear-gradient(180deg, #e0473e, #b8332b); color: #fff; }
.hg-danger.small { font-size: .8rem; padding: .35rem .7rem; min-height: 0; opacity: .85; }
.hg-remove-player { margin-top: .8rem; }

/* ---- Live ledger (iPad at the table): big touch targets, generous spacing ---- */
.hg-live-start { margin: 0 0 1.2rem; }
.hg-big {
  font-size: 1.05rem; padding: .75rem 1.25rem; border-radius: 10px; min-height: 3rem;
}
button.secondary, .hg-big.secondary, .hg-toggle {
  background: var(--panel); color: var(--gold-2); border: 1px solid var(--line);
}
button.secondary:hover, .hg-toggle:hover { filter: brightness(1.1); }
.inline { display: inline; margin: 0; }

.hg-live-summary { margin: 1rem 0 1.6rem; }

.hg-players { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 720px) { .hg-players { grid-template-columns: 1fr 1fr; } }
.hg-player { display: flex; flex-direction: column; gap: .6rem; }
.hg-player.out { border-color: var(--gold); }
.hg-player-head { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.hg-player-name { font-family: var(--font-display); font-size: 1.2rem; color: var(--gold-2); }
.hg-player-nums { display: flex; gap: 1.2rem; flex-wrap: wrap; font-size: 1rem; }
.hg-player-actions { display: flex; gap: .55rem; flex-wrap: wrap; align-items: center; }
.hg-amt { width: 8.5rem; font-size: 1.05rem; padding: .6rem .7rem; }
.hg-custom, .hg-cashout { display: inline-flex; gap: .4rem; align-items: center; }
.hg-buyin-list { margin-top: .3rem; }
.hg-buyin-list summary { cursor: pointer; color: var(--muted); padding: .4rem 0; }
.hg-buyin-row { display: flex; gap: .55rem; align-items: center; flex-wrap: wrap; margin: .35rem 0; }

.hg-add-player { margin: 1.6rem 0 2rem; }
.hg-add-player .form-row { display: flex; gap: 1rem; flex-wrap: wrap; align-items: end; }
.hg-add-player .form-row label { flex: 1 1 180px; }

.hg-settle { display: grid; gap: .8rem; grid-template-columns: 1fr; margin-bottom: 1.2rem; }
.hg-transfer { display: flex; flex-direction: column; gap: .6rem; }
.hg-transfer.paid { border-color: #58c98b; }
.hg-transfer-line { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; font-size: 1.1rem; }
.hg-from, .hg-to { font-family: var(--font-display); color: var(--gold-2); }
.hg-arrow { color: var(--muted); }
.hg-amt-out { margin-left: auto; font-weight: 700; }
.hg-transfer-toggles { display: flex; gap: .5rem; flex-wrap: wrap; }
.hg-toggle { padding: .5rem .9rem; border-radius: 8px; min-height: 2.6rem; }
.hg-toggle.on { background: var(--gold); color: #06140c; border-color: var(--gold); }
.hg-settle-totals { margin: 1rem 0 1.6rem; }
.hg-mark-settled { margin: 1rem 0 2rem; }
.ok-note { border-color: #58c98b; }

@media print {
  .topbar, .foot, .analyzer-form, .report-actions { display: none !important; }
  body { background: #fff; color: #111; }
  .card, .rtbl { box-shadow: none; }
  .card.stat .v, .pos { color: #137333 !important; }
  .neg { color: #b00020 !important; }
}

/* Open-table-view link on the live ledger */
.hg-tableview{ margin:.6rem 0 1rem; display:flex; flex-direction:column; gap:.25rem; }
.hg-big-link{
  display:inline-block; align-self:flex-start; background:linear-gradient(180deg,#e9c75a,#caa62f);
  color:#1A1200; font-weight:800; text-decoration:none; border-radius:999px;
  padding:.55em 1.4em; font-size:1.05rem; box-shadow:0 6px 16px rgba(0,0,0,.3);
}


/* Game status pills + end-of-game recap on the live ledger. */
.pill.sched { background: rgba(216,181,74,.14); color: var(--gold-2); border-color: var(--gold); }
.pill.live  { background: rgba(88,201,139,.16); color: #58c98b; border-color: #2f7a51; }
.pill.ended { background: rgba(150,160,170,.16); color: #b8c2cc; border-color: #5a6570; }
.hg-recap { margin: 0 0 1.2rem; }
.hg-recap-banner { display: flex; align-items: center; gap: .55rem; margin: 0 0 .7rem; color: #cfd8e0; }
.hg-recap-stats .card.stat .v.pos { color: #58c98b; }
.hg-recap-stats .card.stat .v.neg { color: var(--red); }