/* Shared playing-card shell for every non-game Shuflr surface.
   The page still has a native scroll position for accessibility and history,
   but the only visible movement is the deck timeline controlled by GSAP. */

:root {
  --site-bg: #060604;
  --site-bg-soft: #151106;
  --site-card: #0e0d09;
  --site-card-soft: #17140c;
  --site-edge: #d8ae50;
  --site-edge-hi: #f4d98f;
  --site-copy: #f5eedb;
  --site-copy-dim: rgba(245, 238, 219, .65);
  --site-red: #db6258;
  --site-glow: rgba(216, 174, 80, .18);
  --site-pattern: rgba(216, 174, 80, .3);
  --site-logo-primary: var(--site-edge-hi);
  --site-logo-accent: var(--site-red);
  --site-logo-light: color-mix(in srgb, var(--site-copy) 96%, white);
  --site-logo-muted: color-mix(in srgb, var(--site-edge) 58%, var(--site-copy));
  --site-card-width-cap: 660px;
  --site-card-inline-bound: calc(100vw - 52px);
  --site-card-height-bound: calc(71.428571svh - 110px);
  --site-card-width: min(
    var(--site-card-width-cap),
    var(--site-card-inline-bound),
    var(--site-card-height-bound)
  );
}

html[data-site-theme="classic"] {
  --site-bg: #07130c; --site-bg-soft: #102c1b; --site-card: #102319;
  --site-card-soft: #173825; --site-edge: #9acb9e; --site-edge-hi: #d5ecd5;
  --site-copy: #f2f5ec; --site-copy-dim: rgba(232, 242, 232, .66);
  --site-glow: rgba(87, 174, 112, .2); --site-pattern: rgba(190, 229, 196, .24);
}
html[data-site-theme="midnight"] {
  --site-bg: #060b16; --site-bg-soft: #10274a; --site-card: #0d192b;
  --site-card-soft: #152b4b; --site-edge: #7fa7d8; --site-edge-hi: #c8dcf4;
  --site-copy: #edf4ff; --site-copy-dim: rgba(223, 235, 252, .66);
  --site-glow: rgba(69, 125, 196, .22); --site-pattern: rgba(168, 202, 242, .25);
}
html[data-site-theme="merlot"] {
  --site-bg: #140609; --site-bg-soft: #45121b; --site-card: #261015;
  --site-card-soft: #451923; --site-edge: #cf8990; --site-edge-hi: #f0c5c9;
  --site-copy: #fff1f1; --site-copy-dim: rgba(250, 225, 227, .67);
  --site-glow: rgba(173, 48, 65, .22); --site-pattern: rgba(236, 174, 181, .24);
}
html[data-site-theme="violet"] {
  --site-bg: #0d0817; --site-bg-soft: #331d53; --site-card: #1c102d;
  --site-card-soft: #352052; --site-edge: #b697d7; --site-edge-hi: #e0cbed;
  --site-copy: #f8efff; --site-copy-dim: rgba(238, 224, 249, .66);
  --site-glow: rgba(129, 78, 181, .24); --site-pattern: rgba(213, 181, 240, .25);
}
html[data-site-theme="slate"] {
  --site-bg: #090b0e; --site-bg-soft: #252c38; --site-card: #171b21;
  --site-card-soft: #292f39; --site-edge: #a8b2c0; --site-edge-hi: #e0e5eb;
  --site-copy: #f1f3f6; --site-copy-dim: rgba(226, 231, 237, .65);
  --site-glow: rgba(117, 130, 148, .2); --site-pattern: rgba(200, 209, 220, .22);
}
html[data-site-theme="ocean"] {
  --site-bg: #041211; --site-bg-soft: #0e3a38; --site-card: #092421;
  --site-card-soft: #0e3c38; --site-edge: #76c6bd; --site-edge-hi: #bdece5;
  --site-copy: #edfffc; --site-copy-dim: rgba(218, 243, 239, .65);
  --site-glow: rgba(35, 142, 133, .23); --site-pattern: rgba(169, 230, 222, .23);
}
html[data-site-theme="aurora"] {
  --site-bg: #080716; --site-bg-soft: #241c55; --site-card: #14112f;
  --site-card-soft: #272060; --site-edge: #9bb0ff; --site-edge-hi: #d0daff;
  --site-copy: #f2f3ff; --site-copy-dim: rgba(226, 228, 252, .66);
  --site-glow: rgba(94, 78, 207, .24); --site-pattern: rgba(187, 198, 255, .23);
}
html[data-site-theme="casino"] {
  --site-bg: #170507; --site-bg-soft: #4a0e15; --site-card: #2a0c11;
  --site-card-soft: #4e131c; --site-edge: #e6b65b; --site-edge-hi: #ffe3a5;
  --site-copy: #fff6e7; --site-copy-dim: rgba(248, 231, 207, .66);
  --site-glow: rgba(202, 45, 59, .23); --site-pattern: rgba(240, 197, 108, .25);
}
html[data-site-theme="ivory"] {
  --site-bg: #17120a; --site-bg-soft: #493b24; --site-card: #f0e6cc;
  --site-card-soft: #ded0aa; --site-edge: #765d2f; --site-edge-hi: #a8894c;
  --site-copy: #241c10; --site-copy-dim: rgba(44, 33, 17, .64);
  --site-red: #a43b35; --site-glow: rgba(184, 151, 86, .25);
  --site-pattern: rgba(92, 68, 29, .2);
  --site-logo-primary: #f3e4bd; --site-logo-accent: #d36c5d;
  --site-logo-light: #fff9e9; --site-logo-muted: #c9ad73;
}

html.site-deck-enabled {
  min-height: 100%;
  background: var(--site-bg);
  scrollbar-width: none;
}
html.site-deck-enabled::-webkit-scrollbar { display: none; }

body.site-deck-ready {
  min-height: 100svh;
  display: block;
  color: var(--site-copy);
  background:
    radial-gradient(52% 58% at 14% 12%, var(--site-glow), transparent 72%),
    radial-gradient(46% 54% at 88% 10%, color-mix(in srgb, var(--site-edge) 12%, transparent), transparent 74%),
    radial-gradient(62% 52% at 50% 108%, color-mix(in srgb, var(--site-card-soft) 72%, transparent), transparent 75%),
    linear-gradient(180deg, var(--site-bg-soft), var(--site-bg) 58%);
  background-attachment: fixed;
  overflow-x: clip;
}
body.site-deck-ready::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .25;
  background-image:
    linear-gradient(115deg, transparent 0 48%, var(--site-pattern) 49% 50%, transparent 51%),
    linear-gradient(25deg, transparent 0 48%, var(--site-pattern) 49% 50%, transparent 51%);
  background-size: 38px 66px;
  -webkit-mask-image: radial-gradient(circle at center, #000, transparent 80%);
  mask-image: radial-gradient(circle at center, #000, transparent 80%);
}

body.site-deck-ready a { color: var(--site-edge-hi); }
body.site-deck-ready p,
body.site-deck-ready li { color: color-mix(in srgb, var(--site-copy) 88%, transparent); }
body.site-deck-ready .lede,
body.site-deck-ready small,
body.site-deck-ready .updated { color: var(--site-copy-dim); }

body.site-deck-ready .site-head {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 400;
  width: 100%;
  max-width: none;
  min-height: 74px;
  margin: 0;
  padding: 14px clamp(18px, 3vw, 34px);
  transform: none;
  flex-wrap: nowrap;
  background: linear-gradient(180deg, color-mix(in srgb, var(--site-bg) 92%, transparent), transparent);
}
body.site-deck-ready .site-logo { width: clamp(126px, 15vw, 172px); flex: none; }
body.site-deck-ready .site-logo img,
body.site-deck-ready .site-logo-svg {
  display: block;
  width: 100%;
  height: auto;
}
body.site-deck-ready .site-logo-svg {
  filter: drop-shadow(0 4px 16px color-mix(in srgb, var(--site-bg) 58%, transparent));
}
body.site-deck-ready .site-logo-svg .s0 { fill: var(--site-logo-primary); }
body.site-deck-ready .site-logo-svg .s1 { fill: var(--site-logo-accent); }
body.site-deck-ready .site-logo-svg .s2 { fill: var(--site-logo-light); }
body.site-deck-ready .site-logo-svg .s3 { fill: var(--site-logo-muted); }
body.site-deck-ready .site-logo-svg :is(.s0, .s1, .s2, .s3) {
  transition: fill .36s ease;
}
body.site-deck-ready .site-head nav {
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
}
body.site-deck-ready .site-head nav::-webkit-scrollbar { display: none; }
body.site-deck-ready .site-head nav a {
  flex: none;
  color: var(--site-copy-dim);
  border-color: transparent;
  white-space: nowrap;
}
body.site-deck-ready .site-head nav a:hover,
body.site-deck-ready .site-head nav a.active {
  color: var(--site-copy);
  text-decoration: none;
  background: color-mix(in srgb, var(--site-card-soft) 78%, transparent);
  border-color: color-mix(in srgb, var(--site-edge) 32%, transparent);
}

.site-theme-wrap { position: relative; flex: none; }
.site-theme-button {
  min-width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, var(--site-edge) 42%, transparent);
  border-radius: 999px;
  color: var(--site-edge-hi);
  background: color-mix(in srgb, var(--site-card) 86%, transparent);
  box-shadow: 0 10px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.08);
  font: 800 11px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}
.site-theme-button:hover { filter: brightness(1.12); }
.site-theme-button .theme-suit { font: 22px/1 Georgia, serif; }
.site-theme-popover {
  position: absolute;
  top: 50px;
  right: 0;
  width: min(340px, calc(100vw - 24px));
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--site-edge) 38%, transparent);
  border-radius: 20px;
  color: var(--site-copy);
  background: color-mix(in srgb, var(--site-card) 96%, transparent);
  box-shadow: 0 24px 80px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter: blur(18px);
}
.site-theme-popover[hidden] { display: none; }
.site-theme-popover header { display: block; margin-bottom: 10px; }
.site-theme-popover header b,
.site-theme-popover header span { display: block; }
.site-theme-popover header b { font: 800 15px/1.2 Georgia, serif; }
.site-theme-popover header span { margin-top: 3px; color: var(--site-copy-dim); font-size: 10px; }
.site-theme-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 7px; }
.site-theme-choice {
  position: relative;
  min-height: 62px;
  display: grid;
  grid-template-rows: 28px auto;
  gap: 4px;
  padding: 7px;
  border: 1px solid color-mix(in srgb, var(--site-copy) 12%, transparent);
  border-radius: 12px;
  color: var(--site-copy-dim);
  background: rgba(255,255,255,.035);
  font: 750 9px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  cursor: pointer;
}
.site-theme-choice:hover { color: var(--site-copy); border-color: color-mix(in srgb, var(--site-edge) 50%, transparent); }
.site-theme-choice[aria-pressed="true"] {
  color: var(--site-copy);
  border-color: var(--site-edge);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--site-edge) 16%, transparent);
}
.site-theme-choice.is-locked { opacity: .56; filter: saturate(.55); }
.site-theme-choice.is-locked::after {
  content: "PRO";
  position: absolute;
  top: 4px;
  right: 4px;
  padding: 2px 4px;
  border-radius: 5px;
  color: var(--site-edge-hi);
  background: color-mix(in srgb, var(--site-bg) 88%, transparent);
  font-size: 6px;
  letter-spacing: .1em;
}
.site-theme-swatch {
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 7px;
  background: linear-gradient(145deg, var(--swatch-hi), var(--swatch));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2);
}
.site-theme-note {
  min-height: 18px;
  margin-top: 9px;
  color: var(--site-copy-dim);
  font-size: 9px;
  line-height: 1.4;
}
.site-theme-note a { font-weight: 800; }

.site-deck-host,
main.site-deck-main {
  width: 100%;
  max-width: none;
  min-height: 100svh;
  margin: 0;
  padding: 0;
}
.site-deck-host.hidden { display: none !important; }
.site-deck-stage {
  position: sticky;
  top: 0;
  z-index: 20;
  width: 100%;
  height: 100svh;
  display: grid;
  place-items: center;
  padding: 78px 18px 66px;
  perspective: 1500px;
  overflow: hidden;
}
.site-deck-stack {
  position: relative;
  width: var(--site-card-width);
  height: auto;
  aspect-ratio: 5 / 7;
  transform-origin: 50% 54%;
  transform-style: preserve-3d;
  will-change: transform;
}

.site-playing-card {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform-origin: 50% 52%;
  transform-style: preserve-3d;
  will-change: transform;
  visibility: hidden;
}
.site-playing-card.source-hidden { display: none !important; }
.site-card-inner {
  position: absolute;
  inset: 0;
  transform-style: preserve-3d;
  will-change: transform;
}
.site-card-face {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border: 2px solid var(--site-edge);
  border-radius: clamp(25px, 4vw, 38px);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  box-shadow:
    0 32px 80px rgba(0,0,0,.48),
    0 0 48px var(--site-glow),
    inset 0 1px 0 rgba(255,255,255,.11);
}
.site-card-front {
  color: var(--site-copy);
  background:
    radial-gradient(80% 65% at 50% 10%, color-mix(in srgb, var(--site-card-soft) 86%, transparent), transparent 72%),
    linear-gradient(150deg, color-mix(in srgb, var(--site-card-soft) 65%, var(--site-card)), var(--site-card) 58%);
}
.site-card-front::before,
.site-card-back::before {
  content: "";
  position: absolute;
  inset: 10px;
  z-index: 0;
  pointer-events: none;
  border: 1px solid color-mix(in srgb, var(--site-edge-hi) 70%, transparent);
  border-radius: calc(clamp(25px, 4vw, 38px) - 9px);
  box-shadow: inset 0 0 0 4px color-mix(in srgb, var(--site-edge) 7%, transparent);
}
.site-card-front::after {
  content: "";
  position: absolute;
  inset: 20px;
  z-index: 0;
  pointer-events: none;
  opacity: .22;
  background-image:
    radial-gradient(circle at 50% 50%, var(--site-pattern) 0 1px, transparent 1.5px);
  background-size: 12px 12px;
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 38%, transparent 62%, #000);
  mask-image: linear-gradient(180deg, #000, transparent 38%, transparent 62%, #000);
}
.site-card-back {
  transform: rotateY(180deg);
  background:
    radial-gradient(circle at center, transparent 0 16%, var(--site-pattern) 16.5% 17%, transparent 17.5% 26%, var(--site-pattern) 26.5% 27%, transparent 27.5%),
    repeating-conic-gradient(from 45deg at center, var(--site-card) 0 8deg, var(--site-card-soft) 8deg 16deg);
}
.site-card-back::after {
  content: "♠";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 104px;
  height: 104px;
  display: grid;
  place-items: center;
  border: 1px solid var(--site-edge);
  border-radius: 50%;
  color: var(--site-edge-hi);
  background: var(--site-card);
  box-shadow: 0 0 0 9px color-mix(in srgb, var(--site-edge) 14%, transparent), 0 12px 30px rgba(0,0,0,.28);
  transform: translate(-50%, -50%) rotate(-8deg);
  font: 64px/1 Georgia, "Times New Roman", serif;
}
.site-card-corner {
  position: absolute;
  z-index: 3;
  width: 44px;
  display: grid;
  justify-items: center;
  color: var(--site-edge-hi);
  font-family: Georgia, "Times New Roman", serif;
  line-height: .86;
  text-shadow: 0 2px 12px color-mix(in srgb, var(--site-edge) 30%, transparent);
  pointer-events: none;
}
.site-card-corner b { font-size: clamp(18px, 3vw, 24px); font-weight: 700; }
.site-card-corner i { font-size: clamp(20px, 3.3vw, 28px); font-style: normal; }
.site-card-corner.red { color: var(--site-red); }
.site-card-corner.top { top: 27px; left: 26px; }
.site-card-corner.bottom { right: 26px; bottom: 27px; transform: rotate(180deg); }
.site-card-middle {
  position: absolute;
  inset: 62px 55px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: auto;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--site-edge) 72%, transparent) transparent;
  touch-action: pan-y;
}
.site-card-middle::-webkit-scrollbar { width: 6px; }
.site-card-middle::-webkit-scrollbar-track { background: transparent; }
.site-card-middle::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: color-mix(in srgb, var(--site-edge) 72%, transparent);
}
.site-playing-card.is-copy .site-card-middle,
.site-playing-card.is-workspace .site-card-middle { justify-content: flex-start; text-align: left; }
.site-playing-card.is-option .site-card-middle,
.site-playing-card.is-hero .site-card-middle,
.site-playing-card.is-footer .site-card-middle { align-items: center; text-align: center; }
.site-card-middle > :first-child { margin-top: auto; }
.site-card-middle > :last-child { margin-bottom: auto; }
.site-playing-card.is-copy .site-card-middle > :first-child,
.site-playing-card.is-workspace .site-card-middle > :first-child { margin-top: 0; }
.site-playing-card.is-copy .site-card-middle > :last-child,
.site-playing-card.is-workspace .site-card-middle > :last-child { margin-bottom: 0; }

body.site-deck-ready .site-card-middle h1 {
  margin: 0 0 8px;
  color: var(--site-copy);
  font: 600 clamp(31px, 5.2vw, 54px)/.98 Georgia, "Times New Roman", serif;
  letter-spacing: -.035em;
}
body.site-deck-ready .site-card-middle h2 {
  margin: 0 0 10px;
  color: var(--site-copy);
  font: 600 clamp(27px, 4.2vw, 43px)/1.03 Georgia, "Times New Roman", serif;
  letter-spacing: -.025em;
}
body.site-deck-ready .site-card-middle h3 {
  margin: 0 0 9px;
  color: var(--site-copy);
  font: 600 clamp(23px, 3.4vw, 34px)/1.08 Georgia, "Times New Roman", serif;
}
body.site-deck-ready .site-card-middle h4 {
  margin: 0 0 8px;
  color: var(--site-edge-hi);
  font: 600 clamp(20px, 3vw, 28px)/1.1 Georgia, "Times New Roman", serif;
}
body.site-deck-ready .site-card-middle p,
body.site-deck-ready .site-card-middle li {
  font-size: clamp(13.5px, 1.8vw, 15.5px);
  line-height: 1.58;
}
body.site-deck-ready .site-card-middle p { margin: 7px 0; }
body.site-deck-ready .site-card-middle ul,
body.site-deck-ready .site-card-middle ol { margin: 9px 0 9px 20px; }
body.site-deck-ready .site-card-middle li { margin: 5px 0; }

body.site-deck-ready .page-card,
body.site-deck-ready .landing-card,
body.site-deck-ready .plan-card {
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: inherit;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}
body.site-deck-ready .page-card::before,
body.site-deck-ready .page-card::after { content: none; }

body.site-deck-ready .landing-hero {
  max-width: 540px;
  margin: 0;
}
body.site-deck-ready .landing-hero h1 { font-size: clamp(38px, 7vw, 66px); }
body.site-deck-ready .landing-hero p { color: var(--site-copy-dim); }
body.site-deck-ready .landing-card {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
body.site-deck-ready .landing-card:hover { transform: none; }
body.site-deck-ready .landing-icon {
  width: 76px;
  height: 76px;
  border-radius: 24px;
  color: var(--site-edge-hi);
  background: color-mix(in srgb, var(--site-edge) 10%, transparent);
  border-color: color-mix(in srgb, var(--site-edge) 34%, transparent);
  font-size: 38px;
}
body.site-deck-ready .landing-card b {
  font: 600 clamp(28px, 4.5vw, 42px)/1 Georgia, serif;
}
body.site-deck-ready .landing-card small {
  max-width: 420px;
  margin: 8px auto 0;
  color: var(--site-copy-dim);
  font-size: clamp(13px, 1.8vw, 15px);
}
body.site-deck-ready .landing-card i { margin-top: 4px; color: var(--site-edge-hi); }
body.site-deck-ready .landing-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  width: 100%;
}
body.site-deck-ready .landing-links a { color: var(--site-copy-dim); }
body.site-deck-ready .landing-links a:hover { color: var(--site-copy); }

body.site-deck-ready .games-grid { display: contents; }
body.site-deck-ready .game-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}
body.site-deck-ready .game-card b {
  font: 600 clamp(27px, 4.5vw, 43px)/1.08 Georgia, serif;
}
body.site-deck-ready .game-card span { max-width: 470px; color: var(--site-copy-dim); font-size: clamp(14px, 2vw, 17px); }
body.site-deck-ready .game-card .meta {
  display: inline-block;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--site-edge) 32%, transparent);
  border-radius: 999px;
  color: var(--site-edge-hi);
  font-size: 10px;
  text-transform: uppercase;
}

body.site-deck-ready .premium-hero { max-width: 560px; margin: 0; }
body.site-deck-ready .premium-hero h1 { font: 600 clamp(37px, 6vw, 60px)/.98 Georgia, serif; }
body.site-deck-ready .plan-card { width: 100%; gap: 14px; }
body.site-deck-ready .plan-card h2 { font-family: Georgia, serif; }
body.site-deck-ready .plan-card ul { max-height: none; padding-right: 5px; overflow: visible; }
body.site-deck-ready .plan-card li::before { color: var(--site-edge-hi); }
body.site-deck-ready .plan-price b { color: var(--site-edge-hi); font-family: Georgia, serif; }
body.site-deck-ready .plan-action,
body.site-deck-ready .btn-play,
body.site-deck-ready .landing-primary {
  color: color-mix(in srgb, var(--site-card) 88%, #000);
  background: linear-gradient(150deg, var(--site-edge-hi), var(--site-edge));
}
body.site-deck-ready .plan-state,
body.site-deck-ready .club-create-form,
body.site-deck-ready .club-create-form input[type="text"],
body.site-deck-ready .club-create-form textarea,
body.site-deck-ready .club-create-slug,
body.site-deck-ready .club-picker select {
  color: var(--site-copy);
  background: color-mix(in srgb, var(--site-bg) 72%, transparent);
  border-color: color-mix(in srgb, var(--site-copy) 14%, transparent);
}

body.site-deck-ready .club-mark {
  color: var(--site-edge-hi);
  background: color-mix(in srgb, var(--site-edge) 12%, transparent);
  border-color: color-mix(in srgb, var(--site-edge) 38%, transparent);
}
body.site-deck-ready .club-workspace,
body.site-deck-ready .club-active-games,
body.site-deck-ready .club-hero,
body.site-deck-ready .club-gate,
body.site-deck-ready .club-loading { width: 100%; }
body.site-deck-ready .club-workspace-tabs { background: color-mix(in srgb, var(--site-bg) 70%, transparent); }
body.site-deck-ready .club-workspace-tabs button.active {
  color: var(--site-copy);
  background: color-mix(in srgb, var(--site-edge) 14%, transparent);
}
body.site-deck-ready .club-workspace-pane { max-height: none; }

body.site-deck-ready .site-foot {
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--site-copy-dim);
}
body.site-deck-ready .site-foot nav { margin: 16px 0; }
body.site-deck-ready .site-foot a { color: var(--site-copy-dim); }
body.site-deck-ready .site-foot a:hover { color: var(--site-copy); }

.site-deck-hint {
  position: fixed;
  right: 22px;
  bottom: 23px;
  z-index: 405;
  color: var(--site-copy-dim);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.site-deck-live {
  position: fixed;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

@media (max-width: 820px) {
  body.site-deck-ready .site-head nav a { padding: 6px 9px; font-size: 12px; }
  .site-theme-button .theme-label { display: none; }
  .site-theme-button { padding: 0 9px; }
}

@media (max-width: 620px) {
  :root {
    --site-card-width-cap: 560px;
    --site-card-inline-bound: 92vw;
    --site-card-height-bound: calc(71.428571svh - 128.571429px);
  }
  body.site-deck-ready .site-head {
    min-height: 98px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "logo theme"
      "nav nav";
    gap: 4px 10px;
    padding: 8px 12px 6px;
  }
  body.site-deck-ready .site-logo { grid-area: logo; width: 116px; }
  body.site-deck-ready .site-head nav {
    grid-area: nav;
    width: 100%;
    justify-content: flex-start;
    gap: 2px;
  }
  body.site-deck-ready .site-head nav a {
    display: block;
    padding: 5px 8px;
    font-size: 11px;
  }
  body.site-deck-ready .site-theme-wrap { grid-area: theme; justify-self: end; }
  .site-deck-stage { padding: 98px 10px 60px; }
  .site-card-face { border-radius: 26px; }
  .site-card-front::before, .site-card-back::before { inset: 8px; border-radius: 18px; }
  .site-card-middle { inset: 56px 37px; }
  .site-card-corner.top { top: 23px; left: 21px; }
  .site-card-corner.bottom { right: 21px; bottom: 23px; }
  body.site-deck-ready .landing-links { grid-template-columns: 1fr; gap: 14px; }
  body.site-deck-ready .landing-links div { gap: 2px; }
  body.site-deck-ready .landing-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  body.site-deck-ready .landing-actions a { width: 100%; min-width: 0; }
  body.site-deck-ready .plan-card ul { max-height: 220px; }
  body.site-deck-ready .club-hero { grid-template-columns: 1fr; text-align: center; }
  .site-deck-hint { display: none; }
}

@media (max-height: 700px) {
  :root { --site-card-height-bound: calc(71.428571svh - 90px); }
  .site-deck-stage { padding-top: 62px; padding-bottom: 54px; }
  body.site-deck-ready .site-head { padding-top: 8px; padding-bottom: 8px; }
  .site-card-middle { inset-block: 50px; }
  .site-card-corner.top { top: 19px; }
  .site-card-corner.bottom { bottom: 19px; }
}

@media (max-width: 620px) and (max-height: 700px) {
  :root { --site-card-height-bound: calc(71.428571svh - 121.428571px); }
  .site-deck-stage { padding-top: 98px; }
}

@media (prefers-reduced-motion: reduce) {
  .site-deck-stack,
  .site-playing-card,
  .site-card-inner { will-change: auto; }
  body.site-deck-ready .site-logo-svg :is(.s0, .s1, .s2, .s3) { transition: none; }
  * { scroll-behavior: auto !important; }
}
