/* VARELIO product system --------------------------------------------------- */
:root {
  color-scheme: dark;
  --midnight: #0b1020;
  --deep: #070b16;
  --surface: #111827;
  --surface-raised: #172033;
  --surface-soft: #1d2940;
  --text: #f9fafb;
  --text-secondary: #cbd5e1;
  --muted: #8e9aaf;
  --gold: #d4af37;
  --gold-warm: #e7c65c;
  --teal: #0ea5a4;
  --on-teal: #031716;
  --teal-hover: #29b9b0;
  --focus: #4f8cff;
  --danger: #ef4444;
  --success: #22c55e;
  --warning: #f59e0b;
  --line: rgba(203, 213, 225, 0.14);
  --line-strong: rgba(203, 213, 225, 0.24);
  --shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.18);
  --shadow-lg: 0 30px 80px rgba(0, 0, 0, 0.32);
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --motion-micro: 140ms;
  --motion-standard: 220ms;
  --motion-drawer: 280ms;
  --sidebar-width: 244px;
  --topbar-height: 76px;
  --page-width: 1500px;
  --font-ui: Inter, "Segoe UI", Arial, sans-serif;
  --font-display: Manrope, Inter, "Segoe UI", Arial, sans-serif;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--midnight);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 16px;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.mode-midnight {
  background:
    radial-gradient(circle at 76% -12%, rgba(14, 165, 164, 0.11), transparent 32rem),
    radial-gradient(circle at 45% 35%, rgba(79, 140, 255, 0.035), transparent 38rem),
    var(--midnight);
}

.mode-trust {
  --midnight: #08140d;
  --deep: #050e09;
  --surface: #0f1f15;
  --surface-raised: #14291b;
  --surface-soft: #193521;
  --line: rgba(163, 230, 53, 0.12);
  --line-strong: rgba(163, 230, 53, 0.25);
  background:
    radial-gradient(circle at 76% -8%, rgba(34, 197, 94, 0.13), transparent 32rem),
    #08140d;
}

.mode-ice {
  color-scheme: light;
  --midnight: #f7fafc;
  --deep: #eef3f8;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --surface-soft: #eff5f9;
  --text: #0f172a;
  --text-secondary: #475569;
  --muted: #64748b;
  --teal: #0f766e;
  --on-teal: #ffffff;
  --teal-hover: #0b5f59;
  --gold: #a87f13;
  --danger: #b91c1c;
  --success: #15803d;
  --warning: #a14b06;
  --line: #dbe4ed;
  --line-strong: #c6d2de;
  --shadow-sm: 0 8px 28px rgba(15, 23, 42, 0.07);
  --shadow-lg: 0 24px 70px rgba(15, 23, 42, 0.12);
  background:
    radial-gradient(circle at 70% -15%, rgba(37, 99, 235, 0.07), transparent 30rem),
    #f7fafc;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: 0.025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { overflow-wrap: break-word; }
h1, h2, h3 { font-family: var(--font-display); line-height: 1.08; }
h1 { margin: 0; font-size: clamp(2.35rem, 5vw, 5rem); letter-spacing: 0; }
h2 { margin: 0; font-size: clamp(1.65rem, 2.5vw, 2.55rem); letter-spacing: 0; }
h3 { margin: 0; font-size: 1.12rem; letter-spacing: 0; }
p { color: var(--text-secondary); }
small { color: var(--muted); }
strong, .balance-pill, .stat, .table-statuses, .game-meta, .tournament-stats,
.session-clock, .ledger-amount, .net-position { font-variant-numeric: tabular-nums; }

:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
  border-radius: 5px;
}

::selection { color: #061112; background: #77e2dc; }
[hidden] { display: none !important; }

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 500;
  padding: 12px 16px;
  border-radius: var(--radius-sm);
  background: var(--focus);
  color: white;
  transform: translateY(-160%);
  transition: transform var(--motion-micro);
}
.skip-link:focus { transform: translateY(0); }

.demo-boundary {
  position: relative;
  z-index: 120;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 30px;
  padding: 5px 16px;
  border-bottom: 1px solid rgba(212, 175, 55, 0.18);
  background: #080c16;
  color: #dfe6ef;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}
.mode-ice .demo-boundary { background: #0f172a; color: #f8fafc; }
.status-dot {
  width: 6px;
  height: 6px;
  margin-right: 9px;
  border-radius: 50%;
  background: var(--teal);
  box-shadow: 0 0 0 4px rgba(14, 165, 164, 0.12);
}

/* Shell ------------------------------------------------------------------ */
.app-shell {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  min-height: calc(100vh - 30px);
}

.desktop-sidebar {
  position: sticky;
  top: 0;
  z-index: 60;
  display: flex;
  flex-direction: column;
  height: calc(100vh - 30px);
  padding: 28px 20px 22px;
  border-right: 1px solid var(--line);
  background: color-mix(in srgb, var(--deep) 92%, transparent);
  backdrop-filter: blur(18px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: fit-content;
  color: var(--text);
  font-family: var(--font-display);
  font-size: 0.96rem;
  font-weight: 800;
  letter-spacing: 0.18em;
}
.brand > span:last-child { display: grid; gap: 2px; }
.brand small {
  font-family: var(--font-ui);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
}
.brand-mark {
  position: relative;
  display: inline-flex;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  overflow: hidden;
  border: 1px solid rgba(212, 175, 55, 0.38);
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(212, 175, 55, 0.12), rgba(14, 165, 164, 0.06));
}
.brand-mark i {
  position: absolute;
  top: 7px;
  width: 4px;
  height: 19px;
  border-radius: 4px;
  background: var(--gold);
}
.brand-mark i:first-child { left: 10px; transform: rotate(-25deg); }
.brand-mark i:last-child { right: 10px; transform: rotate(25deg); background: var(--teal); }

.side-nav {
  display: grid;
  gap: 4px;
  margin-top: 48px;
}
.side-nav a {
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 650;
  transition: color var(--motion-micro), background var(--motion-micro), border-color var(--motion-micro);
}
.side-nav a span {
  display: grid;
  width: 28px;
  place-items: center;
  margin-right: 8px;
  color: currentColor;
  font-size: 1rem;
}
.side-nav a:hover { color: var(--text); background: rgba(255, 255, 255, 0.035); }
.side-nav a.is-active {
  border-color: rgba(14, 165, 164, 0.22);
  background: linear-gradient(90deg, rgba(14, 165, 164, 0.14), rgba(14, 165, 164, 0.035));
  color: var(--text);
}
.side-nav a.is-active span { color: var(--teal); }

.sidebar-trust {
  display: grid;
  gap: 3px;
  margin-top: auto;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.025);
}
.trust-kicker { color: var(--muted); font-size: .75rem; text-transform: uppercase; letter-spacing: 0.08em; }
.sidebar-trust strong { font-size: 1.45rem; font-weight: 600; }
.sidebar-trust a { margin-top: 6px; color: var(--teal); font-size: .75rem; font-weight: 700; }

.app-column { min-width: 0; }
.product-topbar {
  position: sticky;
  top: 0;
  z-index: 55;
  display: flex;
  align-items: center;
  min-height: var(--topbar-height);
  padding: 10px clamp(18px, 3vw, 44px);
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--midnight) 82%, transparent);
  backdrop-filter: blur(22px) saturate(135%);
}
.product-topbar > * { min-width: 0; }
.mobile-brand { display: none; }
.global-search {
  display: flex;
  align-items: center;
  width: min(420px, 35vw);
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.035);
  color: var(--muted);
}
.mode-ice .global-search { background: var(--surface); }
.global-search:focus-within { border-color: var(--focus); box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 18%, transparent); }
.global-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
}
.global-search-submit {
  width: auto;
  min-width: 0;
  margin-right: 9px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 1.15rem;
}
.account-cluster {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  max-width: 100%;
  margin-left: auto;
}
.guest-auth-actions { display: none; align-items: center; gap: 7px; }
html[data-signed-in="false"] .guest-auth-actions { display: flex; }
html[data-signed-in="false"] .account-cluster > .balance-pill,
html[data-signed-in="false"] .account-cluster > .session-pill,
html[data-signed-in="false"] .account-cluster > .icon-button,
html[data-signed-in="false"] .account-cluster > .avatar-link { display: none; }
.balance-pill {
  display: grid;
  min-width: 150px;
  padding: 7px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.035);
}
.balance-pill span { color: var(--muted); font-size: .75rem; }
.balance-pill strong { font-size: 0.82rem; }
.session-pill {
  display:grid;
  min-width:72px;
  min-height:44px;
  padding:6px 10px;
  place-content:center;
  border:1px solid var(--line);
  border-radius:999px;
  text-align:center;
}
.session-pill span { color:var(--muted);font-size:.75rem; }
.session-pill strong { font-size:.75rem;font-variant-numeric:tabular-nums; }
.icon-button, .avatar-link {
  position: relative;
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  flex: 0 0 44px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.035);
  color: var(--text);
  transition: border-color var(--motion-micro), background var(--motion-micro), transform var(--motion-micro);
}
button.icon-button { appearance: none; }
.icon-button:hover, .avatar-link:hover { border-color: var(--line-strong); background: rgba(14, 165, 164, 0.09); }
.icon-button:active, .avatar-link:active { transform: scale(0.96); }
.icon-button.is-active { color: var(--teal); border-color: rgba(14, 165, 164, 0.34); }
.avatar-link {
  border-color: rgba(212, 175, 55, 0.35);
  background: linear-gradient(145deg, rgba(212, 175, 55, 0.19), rgba(14, 165, 164, 0.09));
  font-weight: 800;
}
.icon-button i {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--danger);
}

.network-state {
  position: sticky;
  top: var(--topbar-height);
  z-index: 54;
  padding: 10px 24px;
  border-bottom: 1px solid rgba(245, 158, 11, 0.35);
  background: #3a2907;
  color: #fff4cc;
  text-align: center;
  font-size: 0.84rem;
}

.page {
  width: min(100%, var(--page-width));
  min-height: 68vh;
  margin: 0 auto;
  padding: clamp(26px, 4vw, 62px) clamp(18px, 3.5vw, 56px) 72px;
}
.product-footer {
  display: grid;
  grid-template-columns: 1.7fr repeat(3, 1fr);
  gap: 44px;
  padding: 52px clamp(22px, 4vw, 64px) 66px;
  border-top: 1px solid var(--line);
  background: color-mix(in srgb, var(--deep) 74%, transparent);
}
.product-footer > div p { max-width: 420px; font-size: 0.82rem; }
.product-footer nav { display: grid; align-content: start; gap: 9px; font-size: 0.78rem; }
.product-footer nav strong { margin-bottom: 5px; color: var(--text); }
.product-footer nav a, .product-footer nav button {
  display: flex;
  min-height: 44px;
  align-items: center;
  color: var(--muted);
}
.product-footer nav a:hover, .product-footer nav button:hover { color: var(--teal); }
.footer-language { margin-top:5px;font-size:.75rem; }
.footer-language select { min-height:44px;padding:5px 8px;font-size:.75rem; }
.footer-brand { margin-bottom: 14px; }
.bottom-nav { display: none; }

/* Common components ------------------------------------------------------ */
.eyebrow, .card-kicker {
  display: block;
  margin-bottom: 10px;
  color: var(--teal);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.mode-trust .eyebrow { color: #7ee8a0; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.button, button.button, a.button {
  display: inline-flex;
  min-height: 44px;
  padding: 10px 17px;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--teal);
  color: var(--on-teal);
  font-weight: 750;
  line-height: 1.2;
  transition: transform var(--motion-micro), background var(--motion-micro), border-color var(--motion-micro), box-shadow var(--motion-micro);
}
.button:hover { background: var(--teal-hover); box-shadow: 0 9px 28px rgba(14, 165, 164, 0.16); transform: translateY(-1px); }
.button:active { transform: translateY(0); }
.button.secondary { background: var(--surface-soft); border-color: var(--line); color: var(--text); }
.button.secondary:hover, .button.ghost:hover { border-color: var(--line-strong); background: color-mix(in srgb, var(--surface-soft) 82%, var(--teal)); }
.button.ghost, .ghost {
  border-color: var(--line);
  background: transparent;
  color: var(--text);
}
.ghost-on-dark {
  border: 1px solid rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.04);
  color: white;
}
.ghost-on-dark:hover { border-color: rgba(255, 255, 255, 0.46); background: rgba(255, 255, 255, 0.08); }
.button.small { min-height: 38px; padding: 7px 12px; font-size: 0.77rem; }
.full-width { width: 100%; }
button:disabled, .button:disabled { opacity: 0.48; cursor: not-allowed; transform: none; box-shadow: none; }
.text-link, .back-link { color: var(--teal); font-size: 0.84rem; font-weight: 750; }
.text-link:hover, .back-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.text-button {
  min-height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--teal);
  text-align: left;
}

.panel {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  padding: clamp(18px, 2.5vw, 28px);
}
.grid { display: grid; gap: 18px; margin-top: 18px; }
.grid.two, .two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid.three, .three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid.four, .four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.page-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 32px;
}
.page-intro h1 { max-width: 920px; font-size: clamp(2.35rem, 4.2vw, 4.8rem); }
.page-intro p { max-width: 710px; margin: 14px 0 0; }
.section-block { margin-top: clamp(52px, 7vw, 96px); }
.section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 26px;
}
.section-header p { max-width: 680px; margin: 9px 0 0; }
.section-header.compact { align-items: center; margin-bottom: 18px; }
.section-header.compact h2 { font-size: 1.55rem; }
.section-header.compact p { font-size: 0.84rem; }
.badge, .demo-chip {
  display: inline-flex;
  width: fit-content;
  padding: 4px 8px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-secondary);
  font-size: .75rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.flash, .form-message, .notice {
  min-height: 24px;
  color: var(--text-secondary);
  font-size: 0.84rem;
  font-weight: 650;
}
.flash {
  margin-bottom: 18px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--teal);
  border-radius: var(--radius);
  background: var(--surface);
}
.flash-error, .form-message.error { border-color: var(--danger); color: var(--danger); }
.muted { color: var(--muted); }
.positive, .ok { color: var(--success); }
.negative { color: var(--danger); }

label {
  display: grid;
  gap: 7px;
  color: var(--text-secondary);
  font-size: 0.78rem;
  font-weight: 700;
}
input, select, textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--line-strong);
  border-radius: 9px;
  outline: 0;
  background: color-mix(in srgb, var(--surface-raised) 88%, var(--deep));
  color: var(--text);
  transition: border-color var(--motion-micro), box-shadow var(--motion-micro);
}
textarea { resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 0.82; }
input:focus, select:focus, textarea:focus { border-color: var(--focus); box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 15%, transparent); }
input[type="checkbox"], input[type="radio"] { width: 20px; min-height: 20px; accent-color: var(--teal); }
input[type="range"] { padding: 0; border: 0; accent-color: var(--teal); box-shadow: none; }
.input-with-unit { position: relative; display: flex; align-items: center; }
.input-with-unit input { padding-right: 46px; }
.input-with-unit em { position: absolute; right: 13px; color: var(--muted); font-size: .75rem; font-style: normal; }
.check-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-height: 36px;
  font-weight: 550;
}
.check-row input { margin-top: 2px; flex: 0 0 20px; }
.compact-check { min-height: 44px; align-items: center; }
.switch-row {
  display: flex;
  min-height: 74px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.switch-row span { display: grid; gap: 3px; }
.switch-row strong { color: var(--text); }
.switch-row input {
  position: relative;
  width: 48px;
  min-height: 26px;
  flex: 0 0 48px;
  appearance: none;
  border: 0;
  border-radius: 99px;
  background: var(--surface-soft);
}
.switch-row input::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.22);
  transition: transform var(--motion-micro);
}
.switch-row input:checked { background: var(--teal); }
.switch-row input:checked::after { transform: translateX(22px); }

.state-card {
  display: grid;
  min-height: 280px;
  padding: 36px;
  place-items: center;
  align-content: center;
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius-lg);
  background: var(--surface);
  text-align: center;
}
.state-card > span:first-child { color: var(--teal); font-size: 2.2rem; }
.state-card h3, .state-card h2 { margin-top: 12px; }
.state-card p { max-width: 530px; margin: 10px auto 20px; }
.error-state > span:first-child { color: var(--warning); }
.empty-copy { color: var(--muted); font-size: 0.84rem; }
.skeleton-stack, .skeleton-card, .skeleton-line {
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--surface);
}
.skeleton-stack { display: grid; gap: 12px; }
.skeleton-stack span { height: 118px; border: 1px solid var(--line); border-radius: var(--radius); }
.skeleton-card { min-height: 220px; border: 1px solid var(--line); }
.skeleton-line { height: 64px; margin: 8px 0; border: 1px solid var(--line); }
.skeleton-stack span, .skeleton-card, .skeleton-line {
  background-image: linear-gradient(100deg, transparent 25%, rgba(255,255,255,.06) 45%, transparent 65%);
  background-size: 250% 100%;
  animation: skeleton 1.8s ease-in-out infinite;
}
@keyframes skeleton { to { background-position: -150% 0; } }

.toast-region {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 400;
  display: grid;
  width: min(380px, calc(100vw - 32px));
  gap: 10px;
}
.toast {
  display: grid;
  grid-template-columns: 28px 1fr 30px;
  gap: 9px;
  align-items: center;
  padding: 13px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: var(--surface-raised);
  box-shadow: var(--shadow-lg);
  color: var(--text);
}
.toast p { margin: 0; font-size: 0.79rem; }
.toast-mark { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 50%; background: rgba(34,197,94,.13); color: var(--success); }
.toast-error .toast-mark { background: rgba(239,68,68,.12); color: var(--danger); }
.toast-close { min-height: 30px; border: 0; background: transparent; color: var(--muted); font-size: 1.2rem; }

/* Home ------------------------------------------------------------------- */
.home-hero {
  position: relative;
  display: grid;
  min-height: 590px;
  grid-template-columns: 1.05fr 0.95fr;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background:
    linear-gradient(115deg, rgba(8, 13, 27, 0.98) 25%, rgba(11, 18, 36, 0.82)),
    var(--surface);
  box-shadow: var(--shadow-lg);
}
.home-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,175,55,.45), rgba(14,165,164,.4), transparent);
}
.hero-copy-column {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(38px, 6vw, 86px);
}
.hero-copy-column h1 span {
  color: transparent;
  background: linear-gradient(90deg, #f9fafb, #ccd8e4 55%, #94c8c7);
  -webkit-background-clip: text;
  background-clip: text;
}
.hero-copy-column > p { max-width: 650px; margin: 22px 0 0; font-size: clamp(1rem, 1.35vw, 1.19rem); line-height: 1.65; }
.hero-secondary-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 8px;
  color: var(--text-secondary);
  font-weight: 750;
}
small { font-size: .75rem; }
.hero-secondary-link:hover { color: var(--teal-hover); }
.hero-trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 22px;
  margin-top: 40px;
  color: var(--muted);
  font-size: 0.75rem;
}
.hero-trust-row span::before { content: "✓"; margin-right: 7px; color: var(--teal); }
.hero-world {
  position: relative;
  min-height: 560px;
  overflow: hidden;
  isolation: isolate;
  perspective: 800px;
}
.hero-world::before {
  content: "";
  position: absolute;
  inset: 7% -12% -22% 3%;
  border-radius: 50% 50% 20% 20%;
  background:
    radial-gradient(ellipse at 50% 42%, rgba(14, 165, 164, 0.3), transparent 5%),
    repeating-radial-gradient(ellipse at 50% 43%, transparent 0 27px, rgba(99, 139, 152, 0.11) 28px 29px),
    linear-gradient(160deg, #121b32, #090d18 64%);
  transform: rotateX(62deg) rotateZ(-4deg);
  box-shadow: inset 0 0 60px rgba(14,165,164,.08), 0 0 120px rgba(14,165,164,.08);
}
.hero-halo {
  position: absolute;
  top: 8%;
  left: 8%;
  width: 76%;
  aspect-ratio: 1;
  border: 1px solid rgba(14,165,164,.18);
  border-radius: 50%;
  box-shadow: inset 0 0 80px rgba(14,165,164,.055), 0 0 90px rgba(14,165,164,.08);
}
.hero-card {
  position: absolute;
  z-index: 3;
  width: 150px;
  height: 218px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.16), transparent 35%),
    linear-gradient(145deg, #28354f, #0b1020 68%);
  box-shadow: 0 34px 60px rgba(0,0,0,.36), inset 0 0 0 5px rgba(255,255,255,.025);
}
.hero-card i { position: absolute; top: 18px; left: 18px; color: var(--gold-warm); font-family: Georgia, serif; font-size: 2.8rem; font-style: normal; }
.hero-card::after { content:""; position:absolute; inset:36%; border:1px solid rgba(212,175,55,.3); transform:rotate(45deg); }
.hero-card-one { top: 23%; left: 24%; transform: rotate(-15deg) translateZ(70px); animation: card-float 8s ease-in-out infinite; }
.hero-card-two { top: 17%; left: 51%; transform: rotate(9deg) translateZ(45px); animation: card-float-two 9s ease-in-out infinite; }
.hero-card-two i { color: #89d7d4; }
.hero-chip {
  position: absolute;
  z-index: 4;
  top: 59%;
  left: 44%;
  display: grid;
  width: 94px;
  height: 94px;
  place-items: center;
  border: 3px dashed rgba(212,175,55,.72);
  border-radius: 50%;
  background: radial-gradient(circle, #24354b 35%, #101727 37% 63%, #10131d 65%);
  color: var(--gold-warm);
  box-shadow: 0 24px 38px rgba(0,0,0,.4), 0 0 44px rgba(212,175,55,.08);
  transform: rotateX(55deg) rotateZ(9deg);
}
.hero-chip span { font-size: 1.4rem; font-weight: 800; }
.hero-table-line { position:absolute; inset:72% 4% auto 3%; height:1px; background:linear-gradient(90deg,transparent,var(--teal),var(--gold),transparent); opacity:.45; }
.hero-caption { position:absolute; right:8%; bottom:6%; color:var(--muted); font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; }
.hero-caption span { display:inline-block; width:26px; height:1px; margin-right:8px; vertical-align:middle; background:var(--gold); }
@keyframes card-float { 50% { transform: rotate(-12deg) translateY(-10px) translateZ(70px); } }
@keyframes card-float-two { 50% { transform: rotate(6deg) translateY(9px) translateZ(45px); } }

.continuation-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin-top: 20px;
  padding: 20px 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: linear-gradient(90deg, rgba(14,165,164,.055), transparent 35%), var(--surface);
}
.continuation-panel > * { min-width:0;max-width:100%; }
.continuation-panel h2 { font-size: 1.35rem; }
.continuation-panel h2 { overflow-wrap:anywhere; }
.continuation-panel p { margin: 6px 0 0; font-size: 0.82rem; }
.continuation-actions { display: flex; align-items: center; justify-content:flex-end; flex-wrap:wrap; gap: 8px; font-size: 0.75rem; font-weight: 700; }
.continuation-actions a:not(.button) { display:grid;min-height:36px;padding:7px 10px;place-items:center;border:1px solid var(--line);border-radius:8px;color:var(--muted); }
.continuation-actions a:hover { color: var(--teal); }

.spotlight-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.poker-spotlight {
  margin-top: clamp(58px, 8vw, 110px);
  padding: clamp(26px, 4vw, 48px);
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background:
    radial-gradient(circle at 90% 0, rgba(212,175,55,.08), transparent 26rem),
    linear-gradient(145deg, #111a2b, #090e1b);
}
.trust-layer { margin-top: clamp(58px, 8vw, 110px); }
.trust-layer > header { display:grid; grid-template-columns:1fr 1.5fr; gap:28px; align-items:end; }
.trust-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:30px; }
.trust-grid a {
  min-height: 210px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  transition: transform var(--motion-standard), border-color var(--motion-standard);
}
.trust-grid a:hover { border-color:rgba(14,165,164,.36); transform:translateY(-4px); }
.trust-grid a > span { color:var(--gold); font-size:.75rem; }
.trust-grid strong { display:block; margin-top:36px; }
.trust-grid p { margin:8px 0 0; font-size:.78rem; }
.education-strip {
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:36px;
  margin-top:clamp(58px,8vw,110px);
  padding:clamp(26px,4vw,48px);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.education-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.education-links a { display:flex; align-items:center; min-height:56px; padding:10px 14px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.025); font-size:.8rem; font-weight:700; }
.education-links span { margin-right:12px; color:var(--teal); font-size:.75rem; }

/* Game catalog and visual art -------------------------------------------- */
.game-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.game-grid.compact-density { grid-template-columns:repeat(4,minmax(0,1fr)); }
.game-card {
  position:relative;
  min-width:0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-sm);
  transition:transform var(--motion-standard),border-color var(--motion-standard),box-shadow var(--motion-standard);
}
.game-card:hover { border-color:rgba(14,165,164,.32); box-shadow:0 22px 48px rgba(0,0,0,.22); transform:translateY(-4px); }
.game-card[hidden] { display:none; }
.game-art {
  --art-a:#0e3141; --art-b:#10162a; --art-c:#d4af37; --art-angle:135deg;
  position:relative;
  display:block;
  aspect-ratio:1.58;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 68% 32%, color-mix(in srgb,var(--art-c) 38%,transparent) 0 2%,transparent 3%),
    radial-gradient(circle at 68% 32%, transparent 0 15%, color-mix(in srgb,var(--art-c) 20%,transparent) 16% 17%, transparent 18% 29%, color-mix(in srgb,var(--art-c) 10%,transparent) 30% 31%,transparent 32%),
    linear-gradient(var(--art-angle),var(--art-a),var(--art-b));
  isolation:isolate;
}
.game-art::before {
  content:"";
  position:absolute;
  inset:18% 15%;
  border:1px solid color-mix(in srgb,var(--art-c) 45%,transparent);
  transform:rotate(28deg) skew(-8deg);
  box-shadow:18px 12px 0 -17px var(--art-c),-28px 18px 0 -27px var(--art-c);
  opacity:.7;
}
.game-art::after {
  content:"";
  position:absolute;
  inset:auto -15% -55% -15%;
  height:80%;
  border:1px solid color-mix(in srgb,var(--art-c) 22%,transparent);
  border-radius:50%;
  background:repeating-radial-gradient(circle at 50% 0,transparent 0 12px,color-mix(in srgb,var(--art-c) 9%,transparent) 13px 14px);
  transform:rotateX(60deg);
}
.art-orbit { position:absolute; z-index:2; top:20%; left:18%; width:44%; aspect-ratio:1; border:1px solid color-mix(in srgb,var(--art-c) 38%,transparent); border-radius:50%; box-shadow:inset 0 0 30px color-mix(in srgb,var(--art-c) 10%,transparent); }
.art-plane { position:absolute; z-index:1; right:-5%; bottom:8%; width:62%; height:42%; border-top:1px solid color-mix(in srgb,var(--art-c) 30%,transparent); transform:skew(-30deg); background:linear-gradient(180deg,color-mix(in srgb,var(--art-c) 7%,transparent),transparent); }
.demo-chip { position:absolute; z-index:5; top:12px; left:12px; border-color:rgba(255,255,255,.2); color:#fff; background:rgba(5,9,18,.55); backdrop-filter:blur(7px); }
.game-preview { position:absolute; z-index:5; right:12px; bottom:12px; display:grid; min-height:36px; padding:6px 12px; place-items:center; border:1px solid rgba(255,255,255,.2); border-radius:999px; background:rgba(5,9,18,.62); color:white; font-size:.75rem; font-weight:750; opacity:0; transform:translateY(5px); transition:opacity var(--motion-micro),transform var(--motion-micro); }
.game-card:hover .game-preview,.game-art:focus-visible .game-preview { opacity:1; transform:none; }
.game-card-body { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:16px 16px 6px; }
.game-card-body .card-kicker { margin-bottom:5px; }
.game-card-body h3 a:hover { color:var(--teal); }
.game-card > p { min-height:44px; margin:4px 16px 12px; font-size:.76rem; }
.favorite-button { color:var(--muted); }
.favorite-button.is-active { color:var(--gold-warm); border-color:rgba(212,175,55,.35); }
.game-card .favorite-button { display:grid; width:44px; height:44px; min-height:44px; flex:0 0 44px; place-items:center; border:0; border-radius:50%; background:transparent; color:var(--muted); font-size:1.25rem; }
.game-card .favorite-button:hover { background:var(--surface-soft); }
.game-card .favorite-button.is-active { color:var(--gold-warm); }
.game-meta { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 10px; padding:10px 16px 14px; border-top:1px solid var(--line); color:var(--muted); font-size:.75rem; }
.game-meta span:first-child { flex-basis:100%;color:var(--text-secondary); }
.game-card-compact > p,.game-card-compact .game-meta { display:none; }

.art-01{--art-a:#092f3b;--art-b:#070b16;--art-c:#48c6c2;--art-angle:145deg}
.art-02{--art-a:#30250f;--art-b:#0b1020;--art-c:#e7c65c;--art-angle:120deg}
.art-03{--art-a:#162d4e;--art-b:#090e1c;--art-c:#82aefd;--art-angle:155deg}
.art-04{--art-a:#34243a;--art-b:#0c1220;--art-c:#d99be7;--art-angle:132deg}
.art-05{--art-a:#123f47;--art-b:#071018;--art-c:#8eeae7;--art-angle:165deg}
.art-06{--art-a:#3c182d;--art-b:#110d19;--art-c:#d8a4b5;--art-angle:112deg}
.art-07{--art-a:#113a29;--art-b:#07130d;--art-c:#65e8a0;--art-angle:148deg}
.art-08{--art-a:#282d3c;--art-b:#070911;--art-c:#9ba8c4;--art-angle:136deg}
.art-09{--art-a:#113648;--art-b:#09111c;--art-c:#75c5eb;--art-angle:175deg}
.art-10{--art-a:#29244a;--art-b:#0b0a17;--art-c:#b7a2ff;--art-angle:122deg}
.art-11{--art-a:#3d3118;--art-b:#0d101a;--art-c:#f2d675;--art-angle:158deg}
.art-12{--art-a:#183249;--art-b:#0a101a;--art-c:#9ed8f3;--art-angle:105deg}
.art-13{--art-a:#13333b;--art-b:#070c17;--art-c:#55c5bc;--art-angle:152deg}
.art-14{--art-a:#2d263b;--art-b:#0b0e18;--art-c:#bea8df;--art-angle:168deg}
.art-15{--art-a:#173851;--art-b:#07101b;--art-c:#5fa8ef;--art-angle:128deg}
.art-16{--art-a:#3b2818;--art-b:#100c0b;--art-c:#d7a45f;--art-angle:142deg}
.art-17{--art-a:#222f4a;--art-b:#080c16;--art-c:#8da7ed;--art-angle:116deg}
.art-18{--art-a:#173b39;--art-b:#07110f;--art-c:#78dfd0;--art-angle:162deg}
.art-19{--art-a:#2c3038;--art-b:#080a0e;--art-c:#c9d0db;--art-angle:135deg}
.art-20{--art-a:#1e2d50;--art-b:#090d19;--art-c:#75a3fa;--art-angle:172deg}
.art-21{--art-a:#372b18;--art-b:#0c101b;--art-c:#e2c35d;--art-angle:124deg}
.art-22{--art-a:#17344a;--art-b:#071019;--art-c:#79caef;--art-angle:147deg}
.art-23{--art-a:#153835;--art-b:#07110f;--art-c:#69d4bf;--art-angle:108deg}
.art-24{--art-a:#342238;--art-b:#0d0c17;--art-c:#df9fd4;--art-angle:156deg}
.art-03::before,.art-08::before,.art-13::before,.art-18::before,.art-23::before{border-radius:50%;transform:rotate(18deg) scale(.72)}
.art-04::before,.art-09::before,.art-14::before,.art-19::before,.art-24::before{transform:rotate(45deg) skew(12deg);inset:25% 30%}
.art-02::after,.art-07::after,.art-12::after,.art-17::after,.art-22::after{border-radius:8%;transform:rotate(-12deg) skew(-24deg);bottom:-35%}

.casino-intro { align-items:center; }
.intro-stat { display:grid; min-width:180px; padding:16px 18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.intro-stat span { color:var(--muted); font-size:.75rem; }
.intro-stat strong { font-size:1.5rem; }
.intro-stat a { display:flex; min-height:44px; align-items:center; color:var(--teal); font-size:.75rem; }
.casino-toolbar {
  position:sticky;
  top:calc(var(--topbar-height) + 10px);
  z-index:40;
  display:grid;
  grid-template-columns:minmax(240px,1fr) auto 190px auto;
  gap:10px;
  align-items:end;
  margin-bottom:18px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:color-mix(in srgb,var(--midnight) 80%,transparent);
  backdrop-filter:blur(20px);
}
.search-field { display:flex; align-items:center; min-height:44px; padding:0 12px; border:1px solid var(--line); border-radius:9px; background:var(--surface); }
.search-field input { min-height:40px; border:0; background:transparent; box-shadow:none; }
.search-field span { color:var(--muted); }
.filter-drawer-toggle { display:none; min-height:44px; padding:8px 12px; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--text); }
.filter-count { display:inline-grid; min-width:22px; height:22px; margin-left:7px; place-items:center; border-radius:50%; background:var(--teal); color:var(--on-teal); font-size:.75rem; }
.sort-control { display:grid; grid-template-columns:1fr; gap:2px; }
.sort-control select { min-height:44px; }
.density-control { display:flex; gap:4px; }
.density-control button { width:44px; height:44px; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--muted); }
.density-control button.is-active { color:var(--teal); border-color:rgba(14,165,164,.35); }
.casino-layout { display:grid; grid-template-columns:230px minmax(0,1fr); gap:24px; }
.filter-panel {
  position:sticky;
  top:calc(var(--topbar-height) + 84px);
  align-self:start;
  max-height:calc(100vh - var(--topbar-height) - 110px);
  overflow:auto;
  padding:18px;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:var(--surface);
}
.filter-panel-head { display:flex; align-items:center; justify-content:space-between; }
.filter-panel-actions { display:flex;align-items:center;gap:10px; }
.filter-close { display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:9px;background:var(--surface-soft);color:var(--text);font-size:1.35rem; }
.filter-backdrop { display:none; }
.filter-panel h2 { font-size:1rem; }
.filter-panel fieldset { display:grid; gap:5px; margin:18px 0 0; padding:0 0 16px; border:0; border-bottom:1px solid var(--line); }
.filter-panel legend { margin-bottom:9px; color:var(--text); font-size:.75rem; font-weight:800; text-transform:uppercase; letter-spacing:.07em; }
.results-head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:18px; }
.results-head h2 { font-size:1.35rem; }
.active-chips { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.filter-chip { padding:5px 9px; border:1px solid rgba(14,165,164,.24); border-radius:999px; background:rgba(14,165,164,.08); color:var(--text-secondary); font-size:.75rem; }

/* Mechanic discovery and mobile catalogue disclosure -------------------- */
.mechanic-discovery {
  margin: 18px 0 30px;
  padding: 4px 0 28px;
  border-bottom: 1px solid var(--line);
  scroll-margin-top: calc(var(--topbar-height) + 24px);
}
.mechanic-discovery-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 16px;
}
.mechanic-discovery-head h2 { font-size: 1.45rem; }
.mechanic-discovery-head p { max-width: 620px;margin:0;font-size:.82rem; }
.mechanic-preview-list {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  scrollbar-color: var(--line-strong) transparent;
  scrollbar-width: thin;
}
.mechanic-preview-list::-webkit-scrollbar { height:6px; }
.mechanic-preview-list::-webkit-scrollbar-track { background:transparent; }
.mechanic-preview-list::-webkit-scrollbar-thumb { border-radius:6px;background:var(--line-strong); }
.mechanic-preview-trigger {
  display: grid;
  min-width: 0;
  min-height: 88px;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  text-align: left;
  transition: border-color var(--motion-micro), background var(--motion-micro);
}
.mechanic-preview-trigger:hover { border-color:rgba(14,165,164,.45);background:var(--surface-raised); }
.mechanic-preview-trigger > span:last-child { display:grid;min-width:0;gap:2px; }
.mechanic-preview-trigger strong,.mechanic-preview-trigger small { overflow-wrap:anywhere; }
.mechanic-preview-trigger small { font-size:.75rem;line-height:1.25; }
.mechanic-thumb {
  position: relative;
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  background: linear-gradient(145deg,#152840,#0a1020);
  color: var(--teal-hover);
}
.mechanic-thumb-crash i { width:38px;height:2px;background:var(--teal-hover);transform:rotate(-28deg);transform-origin:left center; }
.mechanic-thumb-crash i::after { content:"";position:absolute;right:-3px;top:-3px;width:8px;height:8px;border-radius:50%;background:var(--gold-warm);box-shadow:0 0 0 5px rgba(212,175,55,.12); }
.mechanic-thumb-wheel i { width:38px;height:38px;border:3px solid #111827;border-radius:50%;background:conic-gradient(var(--teal) 0 22%,var(--gold) 22% 43%,#64748b 43% 63%,var(--teal-hover) 63% 82%,#25324a 82%);box-shadow:0 0 0 1px rgba(255,255,255,.2); }
.mechanic-thumb-wheel::after { content:"";position:absolute;top:7px;border:5px solid transparent;border-top-color:white; }
.mechanic-thumb-dice i { display:grid;width:34px;height:34px;place-items:center;border-radius:7px;background:#e8edf2;color:#102030;font-style:normal;font-weight:900; }
.mechanic-thumb-coinflip i { display:grid;width:38px;height:38px;place-items:center;border:3px double #fde68a;border-radius:50%;background:#665114;color:#fff4bf;font-family:Georgia,serif;font-style:normal;font-weight:800; }
.mechanic-thumb-plinko i { width:5px;height:5px;border-radius:50%;background:#9ac9c6;box-shadow:-14px 10px #9ac9c6,14px 10px #9ac9c6,-21px 20px #9ac9c6,-7px 20px #9ac9c6,7px 20px #9ac9c6,21px 20px #9ac9c6; }
.mechanic-thumb-plinko::after { content:"";position:absolute;top:8px;width:8px;height:8px;border-radius:50%;background:var(--gold-warm); }
.mechanic-noscript { margin:12px 0 0;font-size:.75rem; }
.catalog-disclosure {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 18px;
  padding: 14px 0;
  border-top: 1px solid var(--line);
}
.catalog-disclosure p { margin:0;font-size:.82rem; }

.mechanic-preview-dialog {
  width: min(720px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  padding: 0;
  overflow: auto;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow-lg);
}
.mechanic-preview-dialog::backdrop { background:rgba(3,7,16,.78);backdrop-filter:blur(4px); }
.mechanic-dialog-shell { position:relative;padding:28px; }
.mechanic-dialog-close { position:absolute;top:12px;right:12px; }
.mechanic-dialog-close .icon-button { border-color:var(--line);background:var(--surface-soft);font-size:1.3rem; }
.mechanic-dialog-shell h2 { margin-top:8px;font-size:2rem; }
.mechanic-dialog-shell > p { max-width:600px; }
.mechanic-demo-stage {
  position: relative;
  display: grid;
  min-height: 260px;
  margin-top: 22px;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 50%,rgba(14,165,164,.12),transparent 16rem),
    #090f1d;
}
.mechanic-demo-stage::before { content:"";position:absolute;inset:12%;border:1px solid rgba(255,255,255,.06);border-radius:8px; }
.mechanic-demo-stage strong { position:absolute;right:22px;bottom:18px;color:white;font-size:1.35rem; }
.demo-crash-track { width:65%;height:3px;background:linear-gradient(90deg,rgba(14,165,164,.2),var(--teal-hover));transform:rotate(-20deg); }
.demo-crash { position:absolute;inset:0;display:grid;place-items:center; }
.demo-crash-marker { position:absolute;left:23%;bottom:27%;width:16px;height:16px;border:3px solid #07111b;border-radius:50%;background:var(--gold-warm);box-shadow:0 0 0 7px rgba(212,175,55,.12); }
.mechanic-demo-stage.is-running .demo-crash-marker { animation:preview-crash 1.35s cubic-bezier(.2,.8,.2,1) both; }
.demo-wheel { width:170px;height:170px;border:8px solid #1e293b;border-radius:50%;background:conic-gradient(var(--teal) 0 16%,#30435c 16% 33%,var(--gold) 33% 48%,#596579 48% 67%,var(--teal-hover) 67% 82%,#27354b 82%);box-shadow:0 0 0 2px rgba(255,255,255,.18),0 24px 50px rgba(0,0,0,.35); }
.demo-wheel::after { content:"V";display:grid;position:absolute;inset:calc(50% - 22px);place-items:center;border-radius:50%;background:#101827;color:var(--gold-warm);font-weight:900; }
.demo-wheel-pointer { position:absolute;top:34px;border:11px solid transparent;border-top-color:white; }
.mechanic-demo-stage.is-running .demo-wheel { animation:preview-wheel 1.55s cubic-bezier(.15,.7,.2,1) both; }
.demo-die { display:grid;width:130px;height:130px;place-items:center;border-radius:18px;background:#edf2f7;color:#0f172a;font-size:3.7rem;font-weight:900;box-shadow:0 24px 50px rgba(0,0,0,.35); }
.mechanic-demo-stage.is-running .demo-die { animation:preview-die .9s ease-out both; }
.demo-coin { position:relative;width:142px;height:142px;transform-style:preserve-3d; }
.demo-coin-face { display:grid;position:absolute;inset:0;place-items:center;border:8px double #fde68a;border-radius:50%;backface-visibility:hidden;background:radial-gradient(circle,#8b6f1f,#45360c);color:#fff4bf;font-family:Georgia,serif;font-size:3.2rem;font-weight:900;box-shadow:0 22px 45px rgba(0,0,0,.4); }
.demo-coin-face.back { transform:rotateY(180deg); }
.mechanic-demo-stage.is-running .demo-coin { animation:preview-coin 1.25s ease-in-out both; }
.demo-plinko-board { position:relative;width:230px;height:190px; }
.demo-plinko-board i { position:absolute;width:7px;height:7px;border-radius:50%;background:#9ac9c6; }
.demo-plinko-token { position:absolute;z-index:2;top:6px;left:111px;width:14px;height:14px;border-radius:50%;background:var(--gold-warm);box-shadow:0 0 0 6px rgba(212,175,55,.11); }
.demo-plinko-slots { position:absolute;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(5,1fr);gap:4px; }
.demo-plinko-slots span { min-height:28px;border:1px solid rgba(255,255,255,.14);border-radius:5px;background:#142238; }
.mechanic-demo-stage.is-running .demo-plinko-token { animation:preview-plinko 1.45s ease-in both; }
.mechanic-demo-outcome { min-height:26px;margin:14px 0 0;color:var(--text);font-weight:750; }
.mechanic-dialog-actions { display:flex;flex-wrap:wrap;gap:10px;margin-top:18px; }
@keyframes preview-crash { from{transform:translate(0,0)} to{transform:translate(270px,-94px)} }
@keyframes preview-crash-mobile { from{transform:translate(0,0)} to{transform:translate(155px,-58px)} }
@keyframes preview-wheel { from{transform:rotate(0)} to{transform:rotate(905deg)} }
@keyframes preview-die { 0%{transform:rotate(0) scale(.88)} 60%{transform:rotate(320deg) scale(1.05)} 100%{transform:rotate(360deg) scale(1)} }
@keyframes preview-coin { from{transform:rotateY(0)} to{transform:rotateY(720deg)} }
@keyframes preview-plinko { 0%{transform:translate(0,0)} 24%{transform:translate(-28px,35px)} 50%{transform:translate(20px,75px)} 75%{transform:translate(-8px,116px)} 100%{transform:translate(0,145px)} }

/* Casino game ------------------------------------------------------------ */
.game-page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:20px; }
.game-page-head h1 { margin-top:5px; font-size:clamp(2rem,4vw,3.6rem); }
.game-page-head .eyebrow { margin:14px 0 5px; }
.game-head-actions { display:flex; gap:8px; }
.game-shell-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:18px; }
.game-viewport {
  position:relative;
  min-height:620px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius-xl);
  background:
    radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--art-c) 16%,transparent),transparent 21rem),
    linear-gradient(var(--art-angle),var(--art-a),var(--art-b));
  box-shadow:var(--shadow-lg);
  isolation:isolate;
}
.game-viewport::before { content:""; position:absolute; inset:13% 20% 30%; border:1px solid color-mix(in srgb,var(--art-c) 25%,transparent); border-radius:50%; box-shadow:0 0 80px color-mix(in srgb,var(--art-c) 9%,transparent); }
.viewport-status { position:absolute; z-index:4; top:18px; left:20px; right:20px; display:flex; justify-content:space-between; color:rgba(255,255,255,.72); font-size:.75rem; }
.viewport-status i,.connection-label i { display:inline-block; width:7px; height:7px; margin-right:6px; border-radius:50%; background:var(--teal); box-shadow:0 0 0 4px rgba(14,165,164,.12); }
.game-stage { position:absolute; z-index:3; inset:70px 22px 210px; display:grid; place-content:center; text-align:center; }
.game-stage strong { color:white; font-family:var(--font-display); font-size:clamp(2.2rem,7vw,6.5rem); letter-spacing:0; text-shadow:0 12px 50px rgba(0,0,0,.5); }
.game-stage p { max-width:530px; margin:12px auto 0; color:rgba(255,255,255,.66); }
.stage-geometry { position:absolute; inset:0; z-index:-1; }
.stage-geometry i { position:absolute; width:9px; height:9px; border:1px solid color-mix(in srgb,var(--art-c) 68%,transparent); border-radius:50%; box-shadow:0 0 20px color-mix(in srgb,var(--art-c) 40%,transparent); }
.stage-geometry i:nth-child(1){top:18%;left:14%}.stage-geometry i:nth-child(2){top:37%;right:10%}.stage-geometry i:nth-child(3){bottom:16%;left:26%}.stage-geometry i:nth-child(4){top:9%;right:32%}.stage-geometry i:nth-child(5){bottom:4%;right:18%}
.game-controls {
  position:absolute;
  z-index:5;
  left:18px;
  right:18px;
  bottom:18px;
  display:flex;
  gap:10px;
  align-items:end;
  padding:14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius-lg);
  background:rgba(5,9,17,.78);
  backdrop-filter:blur(20px);
}
.game-controls label { min-width:130px; flex:1; color:rgba(255,255,255,.72); }
.game-controls input,.game-controls select { border-color:rgba(255,255,255,.18); background:rgba(255,255,255,.08); color:white; }
.game-play-button { min-width:190px; }
.game-message { position:absolute; z-index:6; left:32px; right:32px; bottom:126px; min-height:24px; color:rgba(255,255,255,.7); text-align:center; font-size:.76rem; }
.game-message.is-positive { color:#91efaf; }.game-message.is-error { color:#fda4af; }
.game-info-rail { display:grid; align-content:start; gap:12px; }
.balance-card { display:grid; padding:22px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); }
.balance-card > span { color:var(--muted); font-size:.75rem; }.balance-card > strong { margin:5px 0 1px; font-size:2rem; }.balance-card > a { margin-top:15px; color:var(--teal); font-size:.76rem; font-weight:700; }
.dark-balance { background:linear-gradient(145deg,#17233a,#0c111f); border-color:rgba(212,175,55,.2); }
.dark-balance > strong { color:var(--gold-warm); }
.info-card,.info-disclosure,.limit-shortcut { padding:18px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); }
.info-card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }.info-card h2 { font-size:1.18rem; }.info-card p { font-size:.78rem; }
.compact-facts { display:grid; gap:8px; margin:16px 0 0; }
.compact-facts div { display:flex; justify-content:space-between; gap:12px; padding-top:8px; border-top:1px solid var(--line); font-size:.75rem; }.compact-facts dt{color:var(--muted)}.compact-facts dd{margin:0;font-weight:750;text-align:right}
.info-disclosure summary { min-height:30px; cursor:pointer; font-size:.8rem; font-weight:750; }.info-disclosure p { margin:10px 0 0; font-size:.75rem; }
.limit-shortcut { display:flex; align-items:center; gap:12px; }.limit-shortcut > span:first-child { color:var(--teal); font-size:1.3rem; }.limit-shortcut span:last-child{display:grid}.limit-shortcut small{font-size:.75rem}
.recent-results-panel { margin-top:18px; }
.result-list { display:grid; gap:6px; }
.result-row { display:grid; grid-template-columns:130px 1fr auto; gap:14px; align-items:center; min-height:48px; padding:8px 10px; border-top:1px solid var(--line); font-size:.75rem; }
.result-state { color:var(--muted); }.result-row.is-positive .result-state,.result-row.is-positive > strong { color:var(--success); }

/* Poker lobby ------------------------------------------------------------ */
.poker-intro { align-items:center; }
.subnav {
  display:flex;
  gap:6px;
  overflow:auto;
  margin-bottom:22px;
  padding:6px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface);
  scrollbar-width:none;
}
.subnav a { min-height:40px; padding:9px 14px; border-radius:8px; color:var(--muted); font-size:.77rem; font-weight:700; white-space:nowrap; }
.subnav a:hover { color:var(--text); }.subnav a[aria-current="page"] { background:var(--surface-soft); color:var(--text); }
.poker-filterbar { display:grid; grid-template-columns:1.3fr 1fr 1fr .8fr; gap:10px; align-items:end; margin-bottom:30px; padding:14px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); }
.tournament-stack { display:grid; gap:10px; }
.tournament-card {
  display:grid;
  grid-template-columns:145px minmax(0,1fr) 170px;
  gap:20px;
  align-items:center;
  min-height:118px;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:var(--surface);
  transition:border-color var(--motion-micro),transform var(--motion-micro);
}
.tournament-card:hover { border-color:rgba(212,175,55,.26); transform:translateX(2px); }
.tournament-time { display:grid; gap:7px; align-content:center; color:var(--text-secondary); font-size:.76rem; }
.tournament-time em { width:fit-content; padding:3px 7px; border-radius:999px; background:rgba(14,165,164,.09); color:var(--teal); font-size:.75rem; font-style:normal; }
.tournament-main h3 { font-size:1.08rem; }.tournament-main .card-kicker{margin-bottom:4px}
.tournament-stats { display:flex; flex-wrap:wrap; gap:24px; margin-top:10px; }.tournament-stats span{display:grid}.tournament-stats small{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em}.tournament-stats strong{font-size:.75rem}
.connection-label { color:var(--muted); font-size:.75rem; }
.poker-integrity-strip,.activity-strip {
  display:grid;
  grid-template-columns:1fr 1fr auto;
  gap:20px;
  align-items:center;
  margin-top:30px;
  padding:20px;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:linear-gradient(90deg,rgba(14,165,164,.055),transparent),var(--surface);
}
.poker-integrity-strip > div,.activity-strip > div { display:grid; grid-template-columns:32px 1fr; column-gap:8px; }.poker-integrity-strip > div>span,.activity-strip > div>span { grid-row:1/3;color:var(--teal);font-size:1.2rem}.poker-integrity-strip p,.activity-strip p{margin:3px 0 0;font-size:.75rem}
.leaderboard-layout { display:grid; grid-template-columns:1fr 330px; gap:18px; }
.leaderboard-list { list-style:none; margin:0; padding:0; }.leaderboard-list li{display:grid;grid-template-columns:30px 42px 1fr auto;gap:12px;align-items:center;min-height:64px;border-top:1px solid var(--line)}.leaderboard-list>li>span{color:var(--gold);font-size:.75rem}.leaderboard-list em{color:var(--text-secondary);font-size:.76rem;font-style:normal}
.player-avatar { display:grid;width:38px;height:38px;place-items:center;border-radius:50%;background:var(--surface-soft);color:var(--text);font-size:.75rem;font-style:normal}
.data-table { display:grid; }.table-row{display:grid;grid-template-columns:1.2fr repeat(4,1fr) auto;gap:12px;align-items:center;min-height:58px;padding:9px 0;border-top:1px solid var(--line);font-size:.77rem}.table-head{min-height:36px;color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em}

/* Poker table ------------------------------------------------------------ */
.poker-table-page { padding-bottom:114px; }
.table-topline { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:14px; }
.table-topline h1 { margin-top:5px;font-size:clamp(1.7rem,3.5vw,3rem) }.table-topline .eyebrow{margin:12px 0 4px}
.table-statuses { display:flex; gap:16px; align-items:center; }.table-statuses>span:not(.connection-label){display:grid;padding-left:16px;border-left:1px solid var(--line)}.table-statuses small{font-size:.75rem}.table-statuses strong{font-size:.75rem}
.table-workspace { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:14px; }
.poker-felt {
  position:relative;
  min-height:650px;
  overflow:hidden;
  border:1px solid rgba(14,165,164,.22);
  border-radius:38% / 45%;
  background:
    radial-gradient(ellipse at 50% 45%,rgba(37,119,111,.5),transparent 9%),
    repeating-radial-gradient(ellipse at 50% 48%,transparent 0 62px,rgba(126,226,216,.055) 63px 64px),
    linear-gradient(145deg,#123c3a,#0b2727 55%,#07191a);
  box-shadow:inset 0 0 0 12px #15202a,inset 0 0 0 14px rgba(212,175,55,.2),inset 0 0 100px rgba(0,0,0,.38),var(--shadow-lg);
}
.table-rim { position:absolute;inset:5%;border:1px solid rgba(255,255,255,.08);border-radius:38% / 45%;pointer-events:none}
.poker-seat {
  position:absolute;
  z-index:5;
  display:grid;
  grid-template-columns:36px auto;
  grid-template-rows:1fr 1fr;
  min-width:130px;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  background:rgba(5,10,16,.78);
  box-shadow:0 10px 24px rgba(0,0,0,.28);
  color:white;
}
.seat-avatar { grid-row:1/3;display:grid;width:30px;height:30px;margin-right:7px;place-items:center;align-self:center;border-radius:50%;background:linear-gradient(145deg,#314a5b,#18232d);font-size:.75rem;font-weight:800}
.poker-seat strong{font-size:.75rem}.poker-seat small{color:rgba(255,255,255,.62);font-size:.75rem}.dealer-chip{position:absolute;right:-7px;top:-7px;display:grid;width:20px;height:20px;place-items:center;border-radius:50%;background:#e7e8eb;color:#141920;font-size:.75rem;font-style:normal;font-weight:900}
.seat-1{top:8%;left:15%}.seat-2{top:7%;right:15%}.seat-3{top:43%;right:3%}.seat-4{bottom:8%;right:17%}.seat-5{bottom:8%;left:17%}.hero-seat{left:3%;top:43%;border-color:rgba(212,175,55,.48)}
.turn-ring { position:absolute;inset:-5px;border:2px solid transparent;border-radius:15px;pointer-events:none}.turn-ring.is-active{border-color:var(--gold);box-shadow:0 0 18px rgba(212,175,55,.28)}
.table-center { position:absolute;z-index:3;inset:31% 27%;display:grid;place-content:center;text-align:center}.pot-label{margin-bottom:14px;color:rgba(255,255,255,.7);font-size:.75rem}.pot-label strong{color:white}
.community-cards { display:flex;justify-content:center;gap:7px; }
.playing-card { display:grid;width:50px;height:70px;padding:6px;place-items:center;border:1px solid rgba(255,255,255,.5);border-radius:7px;background:linear-gradient(145deg,#fff,#dce4eb);color:#111827;font-family:Georgia,serif;font-size:1rem;font-weight:800;box-shadow:0 8px 20px rgba(0,0,0,.22)}
.playing-card.red{color:#b42335}.playing-card b{font-size:1.05rem;line-height:1}.playing-card i{font-size:.9rem;font-style:normal}.card-back{background:repeating-linear-gradient(45deg,#162a3c 0 4px,#1d3b4b 5px 8px);color:rgba(255,255,255,.68)}.card-placeholder{border-style:dashed;background:rgba(255,255,255,.035);box-shadow:none}
.table-center p{margin:14px auto 0;max-width:330px;color:rgba(255,255,255,.65);font-size:.75rem}
.hole-cards { position:absolute;z-index:4;left:21%;top:48%;display:flex;transform:rotate(-4deg)}.hole-cards .playing-card:last-child{margin-left:-13px;transform:rotate(8deg)}
.action-timer { position:absolute;z-index:5;left:5%;top:57%;width:120px}.action-timer span{display:block;width:0;height:3px;border-radius:3px;background:var(--gold);transition:width 1s linear}.action-timer strong{color:white;font-size:.75rem}
.opponent-cards { position:absolute;top:16%;left:50%;display:flex;min-height:58px;transform:translateX(-50%); }
.opponent-cards .playing-card { width:40px;height:58px; }
.opponent-cards .playing-card:last-child { margin-left:-10px;transform:rotate(5deg); }
.table-side-panel { min-height:650px;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface); }
.side-tabs { display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:5px;border-bottom:1px solid var(--line)}.side-tabs button{min-height:40px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:.75rem}.side-tabs button[aria-selected=true]{background:var(--surface-soft);color:var(--text)}
.action-log,.chat-panel,.help-panel { max-height:570px;overflow:auto;padding:14px}.action-log p{display:grid;grid-template-columns:75px 1fr;margin:0;padding:8px 0;border-bottom:1px solid var(--line);font-size:.75rem}.action-log span{color:var(--teal)}.help-panel h2{font-size:1.15rem}.help-panel p,.chat-panel p{font-size:.75rem}.help-panel a{color:var(--teal);font-size:.75rem}
.inline-form{display:flex;gap:6px}.inline-form button{width:44px;min-height:44px;border:0;border-radius:8px;background:var(--teal);color:var(--on-teal)}
.poker-action-dock {
  position:fixed;
  z-index:90;
  right:clamp(18px,3.5vw,56px);
  bottom:14px;
  left:calc(var(--sidebar-width) + clamp(18px,3.5vw,56px));
  display:grid;
  grid-template-columns:110px 110px 130px minmax(190px,1fr) 100px 110px 120px;
  gap:8px;
  align-items:stretch;
  padding:10px;
  border:1px solid var(--line-strong);
  border-radius:var(--radius-lg);
  background:rgba(7,11,22,.92);
  box-shadow:0 18px 50px rgba(0,0,0,.42);
  backdrop-filter:blur(22px);
}
.poker-action { min-height:62px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#202b3b;color:white;font-weight:800}.poker-action span,.poker-action small{display:block;margin-top:2px;color:rgba(255,255,255,.55);font-size:.75rem}.poker-action kbd{margin-left:4px;color:rgba(255,255,255,.45);font:inherit;font-size:.75rem}.poker-action.fold{background:#2b2630}.poker-action.call{background:#153c3c}.poker-action.bet,.poker-action.raise{background:#0d7776}.poker-action.all-in{border-color:rgba(212,175,55,.38);background:#3a3015}
.table-actions { display:flex;flex-wrap:wrap;gap:6px; }
.table-actions button { min-height:36px;padding:7px 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface-soft);color:var(--text); }
.raise-control{display:grid;gap:2px;padding:5px 8px}.raise-control label{display:flex;justify-content:space-between;color:white;font-size:.75rem}.raise-control>div{display:flex;gap:4px}.raise-control>div button{min-height:44px;flex:1;border:1px solid rgba(255,255,255,.18);border-radius:7px;background:rgba(255,255,255,.07);color:#f8fafc;font-size:.75rem}
.start-hand { grid-column:1/-1;min-height:62px}.table-demo-note{margin:10px 0 0;text-align:center;font-size:.75rem}.table-demo-note a{color:var(--teal)}

/* Auth/account/wallet/transactional -------------------------------------- */
.auth-layout { display:grid;grid-template-columns:1fr minmax(340px,480px);gap:clamp(40px,8vw,130px);align-items:center;min-width:0;max-width:100%;min-height:680px }
.auth-layout > * { min-width:0;max-width:100%; }
.auth-story { display:flex;min-height:560px;flex-direction:column;justify-content:space-between;padding:20px 0}.auth-story h1{max-width:760px;font-size:clamp(2.7rem,5.5vw,5.6rem)}.auth-story>div>p{max-width:600px;font-size:1rem}
.auth-benefits{display:flex;flex-wrap:wrap;gap:14px 24px;margin:0;padding:0;list-style:none;color:var(--text-secondary);font-size:.76rem}.auth-benefits span{margin-right:6px;color:var(--teal)}
.auth-card { padding:clamp(25px,4vw,40px);border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-lg)}.auth-card h2{font-size:1.8rem}.auth-card form{display:grid;gap:16px;margin-top:26px}.auth-card label small{font-weight:500}.form-between{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:.75rem}.form-between a,.auth-switch a{color:#2563eb;font-weight:700}.auth-switch{margin:22px 0 0;text-align:center;font-size:.75rem}
.planned-notice { margin:24px 0;padding:16px;border:1px solid #f1d895;border-radius:var(--radius);background:#fff9e8;color:#4b3912}.planned-notice p{margin:6px 0 0;color:#705b2e;font-size:.78rem}.auth-card>.button+.button{margin-top:9px}
.ice-subnav { box-shadow:var(--shadow-sm) }
.account-overview-grid { display:grid;grid-template-columns:1.4fr .8fr;gap:18px}.profile-summary{display:grid;grid-template-columns:70px 1fr auto;gap:18px;align-items:center}.large-avatar{display:grid;width:64px;height:64px;place-items:center;border-radius:18px;background:linear-gradient(145deg,#dbeafe,#ccfbf1);color:#0f766e;font-size:1.4rem;font-weight:900}.profile-summary h2{font-size:1.5rem}.profile-summary p{margin:5px 0 0;font-size:.75rem}
.ice-balance{background:linear-gradient(145deg,#0f2740,#0c1726);color:white}.ice-balance>span,.ice-balance>small{color:#a8b8c9}.ice-balance>strong{color:white}.progress-panel p{font-size:.78rem}.progress-track,.tier-progress>div,.mission-progress>div{height:7px;overflow:hidden;border-radius:99px;background:var(--surface-soft)}.progress-track i,.tier-progress i,.mission-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--teal),#64d3c8)}
.quick-settings{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.quick-settings>.eyebrow{grid-column:1/-1}.quick-settings a{display:grid;gap:4px;padding:15px;border:1px solid var(--line);border-radius:10px}.quick-settings a:hover{border-color:#93c5fd}.quick-settings span{color:var(--muted);font-size:.75rem}
.settings-layout { display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px}.settings-form-panel form{display:grid;gap:16px;margin-top:24px}.settings-form-panel header p{font-size:.82rem}.data-note p,.security-status p{font-size:.8rem}.security-status ul{padding-left:20px;color:var(--text-secondary);font-size:.78rem}.status-icon{display:grid;width:46px;height:46px;place-items:center;border-radius:50%;background:#dcfce7;color:#15803d;font-size:1.4rem}.planned-label{padding:9px;border-radius:8px;background:#f1f5f9}.preference-list header{margin-bottom:12px}
.session-list{display:grid}.session-item{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;min-height:78px;padding:10px 0;border-top:1px solid var(--line)}.session-device{display:grid;width:38px;height:38px;place-items:center;border-radius:10px;background:var(--surface-soft);color:var(--muted)}.session-item.current .session-device{color:var(--teal)}.session-item>div{display:grid}.session-item>div span,.session-item>div small{font-size:.75rem}
.wallet-intro{align-items:center}.demo-finance-badge{padding:9px 12px;border:1px solid #c7d2e0;border-radius:999px;background:white;color:#334155;font-size:.75rem;font-weight:800;letter-spacing:.07em}
.wallet-summary{display:grid;grid-template-columns:.72fr 1.28fr;gap:18px;margin-bottom:20px}.total-balance-card{display:flex;min-height:300px;flex-direction:column;justify-content:center;padding:32px;border-radius:var(--radius-xl);background:linear-gradient(145deg,#102a43,#0f172a);color:white;box-shadow:var(--shadow-lg)}.total-balance-card>span{color:#a9bac9;font-size:.75rem}.total-balance-card>strong{margin:7px 0;font-size:3.2rem}.total-balance-card>small{color:#9db0c0}.total-balance-card>p{margin:10px 0 0;color:#94a7b7;font-size:.75rem}
.disabled-money-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:28px}.disabled-money-actions button{min-height:44px;border:1px solid rgba(255,255,255,.13);border-radius:9px;background:rgba(255,255,255,.06);color:#9aacbb}
.balance-breakdown{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.balance-breakdown article{position:relative;padding:18px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}.balance-breakdown article:last-child{grid-column:1/-1}.balance-breakdown small{display:block}.balance-breakdown strong{display:block;margin:8px 0;font-size:1.4rem}.balance-breakdown p{margin:0;font-size:.75rem}.balance-dot{position:absolute;top:18px;right:18px;width:9px;height:9px;border-radius:50%;background:#2563eb}.balance-dot.bonus{background:#14b8a6}.balance-dot.ticket{background:#d4af37}.balance-dot.pending{background:#8b5cf6}.balance-dot.locked{background:#94a3b8}
.ledger-filters{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:10px;margin:18px 0}.ledger-row{display:grid;grid-template-columns:40px minmax(180px,1fr) 100px 120px 110px;gap:12px;align-items:center;min-height:72px;border-top:1px solid var(--line);font-size:.75rem}.ledger-icon{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:#f1f5f9}.ledger-icon.credit{color:#15803d;background:#dcfce7}.ledger-icon.debit{color:#b91c1c;background:#fee2e2}.ledger-main{display:grid}.ledger-main span,.ledger-main small{font-size:.75rem}.ledger-status{width:fit-content;padding:4px 7px;border-radius:999px;background:#ecfdf5;color:#047857;font-size:.75rem}.ledger-amount.credit{color:#15803d}.ledger-amount.debit{color:#b91c1c}.ledger-balance{text-align:right}

/* Rewards ---------------------------------------------------------------- */
.rewards-intro{align-items:center}.tier-card{display:grid;grid-template-columns:.7fr 1fr .8fr;gap:28px;align-items:center;padding:26px;border:1px solid rgba(212,175,55,.24);border-radius:var(--radius-xl);background:radial-gradient(circle at 7% 50%,rgba(212,175,55,.12),transparent 18rem),var(--surface)}.tier-card h2{color:var(--gold-warm);font-size:2.3rem}.tier-card p{font-size:.75rem}.tier-progress{display:grid;gap:8px}.tier-progress span{color:var(--muted);font-size:.75rem}.mission-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.mission-card{display:flex;min-height:250px;flex-direction:column;padding:20px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}.mission-top{display:flex;justify-content:space-between}.mission-icon{display:grid;width:40px;height:40px;place-items:center;border-radius:12px;background:rgba(14,165,164,.09);color:var(--teal);font-size:1.2rem}.mission-card h3{margin-top:22px}.mission-card p{font-size:.75rem}.mission-progress{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin:auto 0 18px}.mission-progress span{color:var(--muted);font-size:.75rem}.mission-claimed{min-height:44px;display:grid;place-items:center;color:var(--success);font-size:.75rem;font-weight:750}
.promo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.promo-card{position:relative;min-height:300px;overflow:hidden;padding:28px;border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--surface)}.promo-card::before{content:"";position:absolute;right:-30%;bottom:-38%;width:80%;aspect-ratio:1;border:1px solid var(--promo);border-radius:50%;box-shadow:inset 0 0 50px color-mix(in srgb,var(--promo) 12%,transparent)}.promo-card>span{color:var(--promo);font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.promo-card h3{max-width:260px;margin-top:55px;font-size:1.7rem}.promo-card p{max-width:300px;font-size:.75rem}.promo-card a{position:absolute;bottom:24px;color:var(--promo);font-size:.75rem;font-weight:750}.promo-a{--promo:#76d8d2}.promo-b{--promo:#e2c45e}.promo-c{--promo:#8da7ed}

/* Trust pages ------------------------------------------------------------ */
.trust-hero {
  display:grid;
  grid-template-columns:1fr 310px;
  gap:40px;
  align-items:center;
  min-height:330px;
  padding:clamp(28px,5vw,60px);
  border:1px solid var(--line);
  border-radius:var(--radius-xl);
  background:radial-gradient(circle at 85% 20%,rgba(34,197,94,.14),transparent 18rem),var(--surface);
}
.trust-hero p{max-width:760px;font-size:1rem}.session-clock,.support-response{display:grid;padding:24px;border:1px solid var(--line-strong);border-radius:var(--radius-lg);background:rgba(5,15,9,.42)}.session-clock span,.support-response span{color:#9ab4a2;font-size:.75rem}.session-clock strong,.support-response strong{font-size:2.4rem;color:#eaffef}.session-clock small,.support-response small{margin-top:5px;color:#8fa598}
.responsible-dashboard{display:grid;grid-template-columns:1fr 360px;gap:18px;margin-top:20px}.limit-editor form{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:24px}.limit-editor form label:first-child{grid-column:1/-1}.limit-editor form .button,.limit-editor form .form-message{grid-column:1/-1}.responsible-side{display:grid;gap:12px}.net-position{display:block;margin:12px 0;font-size:2.3rem}.break-controls>div{display:flex;gap:8px}.danger-zone{border-color:rgba(245,158,11,.2)}
.fair-hero{grid-template-columns:1fr 280px}.integrity-mark{position:relative;display:grid;width:210px;aspect-ratio:1;margin:auto;place-items:center;border:1px solid rgba(163,230,53,.2);border-radius:50%;box-shadow:inset 0 0 60px rgba(34,197,94,.08),0 0 80px rgba(34,197,94,.05)}.integrity-mark span{font-size:4rem;font-weight:800;color:#a3e635}.integrity-mark i{position:absolute;width:7px;height:7px;border-radius:50%;background:#a3e635}.integrity-mark i:nth-child(2){top:12%;left:50%}.integrity-mark i:nth-child(3){right:9%;bottom:28%}.integrity-mark i:nth-child(4){left:12%;bottom:22%}
.integrity-status-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.integrity-status-grid article{padding:22px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}.integrity-status-grid h2{margin-top:28px;font-size:1.25rem}.integrity-status-grid p{font-size:.75rem}.status-badge{display:inline-flex;width:fit-content;padding:5px 8px;border-radius:999px;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.07em}.status-badge.implemented{background:rgba(34,197,94,.12);color:#71e596}.status-badge.simulated{background:rgba(79,140,255,.12);color:#8bb6ff}.status-badge.planned{background:rgba(245,158,11,.12);color:#f7c15c}
.fair-layout{display:grid;grid-template-columns:1fr 350px;gap:18px;margin-top:20px}.verifier-panel form{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;margin:22px 0}.verifier-panel pre{min-height:150px;margin:0;padding:18px;overflow:auto;border:1px solid var(--line);border-radius:10px;background:#06110b;color:#bde9c8;white-space:pre-wrap}.fair-rules ul{padding-left:19px;color:var(--text-secondary);font-size:.78rem}.fair-rules li{margin:9px 0}.dispute-path{margin-top:20px;padding:28px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}.dispute-path ol{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:20px 0 0;padding:0;list-style:none}.dispute-path li{display:grid;grid-template-columns:36px 1fr;column-gap:10px}.dispute-path li>span{grid-row:1/3;display:grid;width:30px;height:30px;place-items:center;border-radius:50%;background:rgba(34,197,94,.1);color:#72e396;font-size:.75rem}.dispute-path p{margin:4px 0 0;font-size:.75rem}
.support-grid{display:grid;grid-template-columns:1fr 360px;gap:18px;margin-top:20px}.support-form-panel form{display:grid;gap:15px;margin-top:22px}.support-auth-state{display:grid;gap:14px;margin-top:22px;padding:20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-soft)}.support-auth-state p,.support-auth-state small{margin:0}.support-auth-state .actions{margin-top:2px}.support-links{display:grid;gap:10px}.support-links a{display:grid;grid-template-columns:42px 1fr;column-gap:10px;padding:18px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}.support-links a>span{grid-row:1/3;display:grid;width:38px;height:38px;place-items:center;border-radius:11px;background:rgba(34,197,94,.09);color:#72e396}.support-links p{margin:4px 0 0;font-size:.75rem}

/* Editorial/notifications/history --------------------------------------- */
.editorial-page{max-width:1160px;margin:0 auto}.editorial-hero{padding:clamp(28px,6vw,76px) 0;border-bottom:1px solid var(--line)}.editorial-hero h1{max-width:950px}.editorial-hero p{max-width:780px;margin-top:20px;font-size:1.05rem}.editorial-sections{display:grid;margin-top:12px}.editorial-sections section{display:grid;grid-template-columns:90px 1fr;gap:20px;padding:38px 0;border-bottom:1px solid var(--line)}.section-number{color:var(--gold);font-size:.75rem}.editorial-sections h2{font-size:1.65rem}.editorial-sections p{max-width:760px}.trust-contact,.education-next,.document-meta{display:flex;align-items:center;gap:14px;margin-top:32px;padding:24px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}.trust-contact>div,.education-next>div{margin-right:auto}.document-meta{color:var(--muted);font-size:.75rem}.document-meta a{margin-left:auto;color:#2563eb}
.not-found{display:grid;min-height:62vh;max-width:820px;margin:0 auto;align-content:center;justify-items:start}.not-found-code{margin:8px 0;color:var(--gold);font-family:var(--font-display);font-size:clamp(5rem,16vw,10rem);font-weight:800;line-height:.85}.not-found>p:not(.not-found-code){max-width:620px;margin:20px 0}.not-found-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.notification-panel{padding-top:12px}.notification-filters{display:flex;gap:6px;padding-bottom:12px;border-bottom:1px solid var(--line)}.notification-filters button{min-height:40px;padding:7px 12px;border:0;border-radius:8px;background:transparent;color:var(--muted)}.notification-filters button[aria-pressed=true]{background:var(--surface-soft);color:var(--text)}.notification-item{display:grid;grid-template-columns:44px 1fr;gap:13px;min-height:90px;padding:16px 6px;border-bottom:1px solid var(--line)}.notification-item.unread{background:linear-gradient(90deg,rgba(37,99,235,.05),transparent)}.notification-icon{display:grid;width:40px;height:40px;place-items:center;border-radius:12px;background:var(--surface-soft);color:#2563eb}.notification-item div{display:grid}.notification-item p{margin:4px 0;font-size:.75rem}
.history-layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:18px}.history-sidebar{align-self:start}.history-filters{display:grid;gap:10px;margin-bottom:15px}.hand-history-list{display:grid;gap:6px}.hand-list-item{display:grid;grid-template-columns:1fr auto;gap:3px;width:100%;min-height:90px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);text-align:left}.hand-list-item:hover{border-color:#93c5fd}.hand-list-item .card-kicker{grid-column:1/-1;margin:0}.hand-list-item small{grid-column:1/-1}.replay-head{display:flex;align-items:start;justify-content:space-between;gap:16px}.replay-head h2{font-size:1.45rem}.mini-poker-table{display:grid;min-height:300px;margin:20px 0;padding:30px;place-content:center;border:12px solid #1e293b;border-radius:38% / 48%;background:radial-gradient(ellipse,#17645d,#0e403d);box-shadow:inset 0 0 80px rgba(0,0,0,.22)}.mini-pot{text-align:center;color:white;font-size:.75rem}.mini-poker-table .community-cards{margin:18px 0}.replay-controls{display:flex;gap:8px;align-items:end}.replay-controls>button:not(.button){width:44px;height:44px;border:1px solid var(--line);border-radius:8px;background:var(--surface-soft);color:var(--text)}.replay-controls label{margin-left:auto}.replay-controls select{min-height:40px}.replay-timeline{max-height:220px;overflow:auto;margin:18px 0;padding:0;list-style:none}.replay-timeline li{display:grid;grid-template-columns:80px 1fr auto;gap:8px;min-height:42px;padding:8px;border-left:2px solid var(--line);font-size:.75rem}.replay-timeline li.is-current{border-color:#2563eb;background:#eff6ff}.replay-timeline span{color:var(--muted)}.replay-timeline em{font-style:normal}

/* Legacy admin ----------------------------------------------------------- */
.admin-surface { background:#f4f7fa;color:#0f172a;--text:#0f172a;--text-secondary:#475569;--muted:#64748b;--surface:#fff;--surface-raised:#fff;--surface-soft:#eef3f7;--line:#dbe3ea;--line-strong:#c7d2dc;color-scheme:light }
.admin-topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:70px;padding:12px clamp(18px,4vw,48px);border-bottom:1px solid var(--line);background:#fff}.admin-global-nav{display:flex;flex-wrap:wrap;gap:16px;color:#526071;font-size:.76rem;font-weight:700}.admin-main{min-height:80vh;padding:28px clamp(18px,4vw,48px)}.admin-footer{padding:24px;border-top:1px solid var(--line);color:#64748b;text-align:center;font-size:.75rem}
.admin-title{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.admin-tabs{display:flex;flex-wrap:wrap;gap:6px}.admin-tabs a{min-height:38px;padding:8px 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface-soft);font-size:.75rem}.admin-surface .page-title,.admin-surface .hero{padding:24px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}.admin-surface h1{font-size:2.3rem}.admin-surface h2{font-size:1.2rem}.admin-surface table{width:100%;border-collapse:collapse;font-size:.75rem}.admin-surface th,.admin-surface td{padding:9px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.admin-surface th{color:var(--muted);text-transform:uppercase;font-size:.75rem}.admin-surface pre{max-height:300px;overflow:auto;padding:12px;border-radius:8px;background:#0f172a;color:#dce6ef}.table-wrap{overflow:auto}.flag-list{display:grid;gap:6px}.flag-list div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}.flag-list dt{color:var(--muted)}.flag-list dd{margin:0;font-weight:750}.stat{display:flex;justify-content:space-between;gap:12px}.stat-card{display:grid;min-height:98px;align-content:center;gap:8px}.stat-card span{display:block;color:var(--muted);font-size:.78rem}.stat strong,.stat-card strong{display:block;font-size:1.7rem;line-height:1}.auth-shell{display:grid;min-height:68vh;place-items:center}.auth-panel{width:min(460px,100%)}.filters{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:10px;align-items:end}.breakdown{display:grid;gap:8px}.bar{overflow:hidden;border-radius:6px;background:var(--surface-soft)}.bar span{display:block;min-width:44px;padding:7px;background:var(--teal);color:white}
.admin-topbar > *,
.admin-main,
.admin-main .grid,
.admin-main .grid > *,
.flag-list,
.flag-list > div {
  min-width: 0;
  max-width: 100%;
}
.admin-global-nav { max-width:100%;min-width:0; }
.admin-surface pre,.table-wrap { max-width:100%; }
.flag-list dt,.flag-list dd { min-width:0;overflow-wrap:anywhere; }
.flag-list dd { text-align:right; }

/* Responsive ------------------------------------------------------------- */
@media (max-width: 1199px) {
  :root { --sidebar-width: 204px; }
  .desktop-sidebar { padding-inline:14px; }
  .side-nav a { font-size:.8rem; }
  .page { padding-inline:24px; }
  .home-hero { min-height:540px; }
  .hero-copy-column { padding:44px; }
  .hero-card { width:125px;height:185px; }
  .mechanic-preview-list { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .game-grid,.spotlight-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .trust-grid { grid-template-columns:repeat(2,1fr); }
  .product-footer { grid-template-columns:1.5fr repeat(3,1fr); gap:24px; }
  .game-shell-layout { grid-template-columns:minmax(0,1fr) 270px; }
  .game-controls { flex-wrap:wrap; }
  .game-play-button { flex:1; }
  .poker-action-dock { grid-template-columns:86px 86px 105px minmax(150px,1fr) 90px 96px; left:calc(var(--sidebar-width) + 24px);right:24px; }
  .poker-action kbd { display:none; }
  .table-workspace { grid-template-columns:minmax(0,1fr) 230px; }
  .poker-seat { min-width:112px; }
}

@media (max-width: 920px) {
  .app-shell { grid-template-columns:1fr; }
  .desktop-sidebar { display:none; }
  .product-topbar { padding-inline:18px; }
  .mobile-brand { display:inline-flex; }
  .mobile-brand .brand-mark { width:30px;height:30px;flex-basis:30px; }
  .global-search { width:auto; min-width:120px; flex:1; margin:0 14px; }
  .account-cluster .icon-button:nth-of-type(2) { display:none; }
  .session-pill { display:none; }
  .balance-pill { min-width:128px; }
  .page { padding:26px 20px 82px; }
  .product-footer { margin-bottom:70px;grid-template-columns:1fr 1fr; }
  .product-footer>div { grid-column:1/-1; }
  .bottom-nav {
    position:fixed;
    z-index:100;
    right:0;
    bottom:0;
    left:0;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    min-height:68px;
    padding:6px max(6px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));
    border-top:1px solid var(--line);
    background:color-mix(in srgb,var(--deep) 91%,transparent);
    backdrop-filter:blur(22px);
  }
  .mode-ice .bottom-nav { background:rgba(255,255,255,.93); }
  .bottom-nav a { display:grid;min-width:0;place-items:center;align-content:center;gap:1px;border-radius:9px;color:var(--muted);font-size:.75rem;font-weight:650; }
  .bottom-nav a span { font-size:1rem; }
  .bottom-nav a.is-active { background:rgba(14,165,164,.09);color:var(--teal); }
  .home-hero { min-height:0;grid-template-columns:1fr; }
  .hero-copy-column { min-height:0;padding:44px; }
  .hero-world { display:none; }
  .continuation-panel { align-items:flex-start;flex-direction:column; }
  .continuation-actions { width:100%;flex-wrap:wrap;white-space:normal; }
  .spotlight-grid,.game-grid,.game-grid.compact-density { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .casino-layout { grid-template-columns:1fr; }
  .filter-drawer-toggle { display:inline-flex;align-items:center; }
  .casino-toolbar { grid-template-columns:minmax(180px,1fr) auto 170px auto;top:calc(var(--topbar-height) + 5px); }
  .filter-panel { position:fixed;z-index:140;top:0;right:0;bottom:0;width:min(360px,92vw);max-height:none;border-radius:0;visibility:hidden;pointer-events:none;transform:translateX(105%);transition:transform var(--motion-drawer),visibility 0s linear var(--motion-drawer);box-shadow:var(--shadow-lg);padding-top:calc(24px + env(safe-area-inset-top)); }
  .filter-panel.is-open { visibility:visible;pointer-events:auto;transition-delay:0s; }
  .filter-panel.is-open { transform:none; }
  .filter-close { display:grid;place-items:center; }
  .filter-backdrop { position:fixed;z-index:130;inset:0;display:block;border:0;background:rgba(3,7,16,.62); }
  .filter-backdrop[hidden] { display:none; }
  body.filter-drawer-open { overflow:hidden; }
  .game-shell-layout { grid-template-columns:1fr; }
  .game-info-rail { grid-template-columns:repeat(2,1fr); }
  .game-info-rail .dark-balance { grid-column:1/-1; }
  .poker-filterbar { grid-template-columns:repeat(2,1fr); }
  .tournament-card { grid-template-columns:130px 1fr 160px; }
  .table-workspace { grid-template-columns:1fr; }
  .table-side-panel { min-height:230px; }
  .action-log,.chat-panel,.help-panel { max-height:210px; }
  .poker-action-dock { left:14px;right:14px;bottom:78px;grid-template-columns:repeat(5,1fr); }
  .raise-control { grid-column:1/-1;grid-row:1; }
  .start-hand { grid-column:1/-1; }
  .poker-table-page { padding-bottom:210px; }
  .account-overview-grid,.settings-layout,.wallet-summary,.responsible-dashboard,.fair-layout,.support-grid,.history-layout { grid-template-columns:1fr; }
  .quick-settings { grid-template-columns:1fr; }
  .settings-layout>aside,.responsible-side,.support-links { display:grid;grid-template-columns:repeat(2,1fr); }
  .support-links a:last-child,.responsible-side article:last-child { grid-column:1/-1; }
  .mission-grid,.promo-grid { grid-template-columns:repeat(2,1fr); }
  .leaderboard-layout { grid-template-columns:1fr; }
  .auth-layout { grid-template-columns:1fr; }
  .auth-story { min-height:380px; }
  .trust-hero { grid-template-columns:1fr 260px; }
}

@media (max-width: 767px) {
  :root { --topbar-height: 64px; }
  body { font-size:15px; }
  .demo-boundary {
    min-height: 34px;
    padding: 6px max(12px, env(safe-area-inset-right)) 6px max(12px, env(safe-area-inset-left));
    justify-content: center;
    font-size: .75rem;
    line-height: 1.25;
    text-align: center;
    white-space: normal;
  }
  .product-topbar { min-height:64px;padding:8px 12px; }
  .mobile-brand { min-height:44px;gap:7px;align-items:center;font-size:.75rem;letter-spacing:.1em; }
  .mobile-brand .brand-mark { width:28px;height:28px;flex-basis:28px;border-radius:8px; }
  .mobile-brand .brand-mark i { top:6px;height:17px; }
  .global-search { margin:0 8px;padding:0 10px; }
  .global-search input { font-size:.8rem; }
  .balance-pill { display:flex;min-width:0;min-height:44px;padding:7px 10px;align-items:center; }
  .balance-pill span { display:none; }
  .balance-pill strong { max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem; }
  .account-cluster { gap:5px; }
  .account-cluster .icon-button { display:grid; }
  #soundToggle,.avatar-link { display:none; }
  .avatar-link { width:40px;height:40px;flex-basis:40px; }
  .page { padding:22px 14px 88px; }
  h1 { font-size:clamp(2.2rem,12vw,3.5rem); }
  h2 { font-size:1.6rem; }
  .page-intro { align-items:flex-start;flex-direction:column;margin-bottom:24px; }
  .page-intro h1 { font-size:2.5rem; }
  .section-header { align-items:flex-start;flex-direction:column; }
  .product-footer { grid-template-columns:1fr;padding:38px 20px 102px; }
  .product-footer>div { grid-column:auto; }
  .home-hero { min-height:0;border-radius:8px; }
  .hero-copy-column { min-height:0;padding:22px 20px; }
  .hero-copy-column h1 { max-width:100%;font-size:clamp(2.15rem,10vw,2.7rem);line-height:1.02; }
  .hero-copy-column>p { margin-top:12px;font-size:.94rem;line-height:1.48; }
  .hero-copy-column .actions { margin-top:16px; }
  .hero-trust-row { display:flex;gap:8px 16px;margin-top:14px; }
  .continuation-panel { gap:14px;margin-top:14px;padding:16px; }
  .continuation-panel h2 { font-size:1.2rem; }
  .continuation-panel p { display:none; }
  .continuation-actions { display:flex;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding-bottom:3px;scrollbar-width:thin;white-space:nowrap; }
  .continuation-actions a { flex:0 0 auto; }
  .section-block { margin-top:34px; }
  .mechanic-discovery-head { align-items:flex-start;flex-direction:column;gap:8px; }
  .mechanic-preview-list {
    grid-template-columns:none;
    grid-auto-columns:minmax(184px,72vw);
    grid-auto-flow:column;
    overflow-x:auto;
    padding-bottom:8px;
    scroll-snap-type:x proximity;
  }
  .mechanic-preview-trigger { scroll-snap-align:start; }
  .catalog-disclosure { align-items:stretch;flex-direction:column; }
  .mechanic-dialog-shell { padding:24px 18px 20px; }
  .mechanic-dialog-shell h2 { padding-right:40px;font-size:1.65rem; }
  .mechanic-demo-stage { min-height:220px; }
  .mechanic-dialog-actions { align-items:stretch;flex-direction:column; }
  .mechanic-dialog-actions .button { width:100%; }
  .mechanic-demo-stage.is-running .demo-crash-marker { animation-name:preview-crash-mobile; }
  .demo-wheel { width:142px;height:142px; }
  .demo-die { width:112px;height:112px;font-size:3rem; }
  .demo-coin { width:118px;height:118px; }
  .spotlight-grid,.game-grid,.game-grid.compact-density { grid-template-columns:1fr; }
  .trust-layer>header,.education-strip { grid-template-columns:1fr; }
  .trust-grid,.education-links { grid-template-columns:1fr; }
  .trust-grid a { min-height:170px; }
  .poker-spotlight { padding:22px 14px; }
  .casino-toolbar { position:relative;top:auto;grid-template-columns:1fr auto; }
  .search-field { grid-column:1/-1; }
  .sort-control { grid-column:1/-1; }
  .density-control { display:none; }
  .results-head { align-items:flex-start;flex-direction:column; }
  .active-chips { justify-content:flex-start; }
  .game-card>p { min-height:0; }
  .game-page-head { align-items:flex-start;flex-direction:column; }
  .game-head-actions { width:100%;justify-content:flex-end; }
  .game-viewport { min-height:690px;border-radius:18px; }
  .game-stage { inset:70px 12px 330px; }
  .game-stage strong { font-size:3.7rem; }
  .game-controls { left:10px;right:10px;bottom:10px;display:grid;grid-template-columns:1fr 1fr;padding:11px; }
  .game-controls label { min-width:0; }
  .game-controls>label:first-child { grid-column:1/-1; }
  .game-play-button { grid-column:1/-1; }
  .game-message { bottom:280px;left:18px;right:18px; }
  .game-info-rail { grid-template-columns:1fr; }
  .game-info-rail .dark-balance { grid-column:auto; }
  .result-row { grid-template-columns:1fr auto; }.result-description{grid-row:2;grid-column:1/-1}
  .subnav { margin-inline:-14px;border-right:0;border-left:0;border-radius:0;padding-inline:14px; }
  .poker-filterbar { grid-template-columns:1fr; }
  .tournament-card { grid-template-columns:1fr;padding:16px; }
  .tournament-time { display:flex;justify-content:space-between; }
  .tournament-card>.button { width:100%; }
  .tournament-stats { justify-content:space-between;gap:10px; }
  .poker-integrity-strip,.activity-strip { grid-template-columns:1fr; }
  .table-row { grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:10px;padding:12px;margin:6px 0; }
  .table-row span::before,.table-row strong::before { content:attr(data-label);display:block;color:var(--muted);font-size:.75rem;font-weight:600; }
  .table-head { display:none; }
  .table-topline { align-items:flex-start;flex-direction:column; }
  .table-statuses { width:100%;justify-content:space-between; }
  .poker-felt { min-height:580px;border-radius:24% / 28%; }
  .poker-seat { min-width:86px;padding:6px;grid-template-columns:28px auto; }
  .seat-avatar { width:25px;height:25px; }
  .poker-seat strong { font-size:.75rem; }.poker-seat small{font-size:.75rem}
  .seat-1{top:8%;left:9%}.seat-2{top:8%;right:9%}.seat-3{top:42%;right:1%}.seat-4{bottom:8%;right:9%}.seat-5{bottom:8%;left:9%}.hero-seat{left:1%;top:42%}
  .table-center { inset:29% 17%; }
  .playing-card { width:40px;height:58px;padding:4px; }
  .hole-cards { left:18%;top:49%; }
  .action-timer { left:2%;top:58%;width:90px; }
  .poker-action-dock { grid-template-columns:repeat(3,1fr);padding:8px;gap:6px;bottom:77px; }
  .raise-control { grid-column:1/-1; }
  .poker-action.bet,.poker-action.raise,.poker-action.all-in { grid-row:3; }
  .poker-action { min-height:52px;font-size:.75rem; }
  .poker-action-dock .fold,.poker-action-dock [data-poker-action=check],.poker-action-dock .call { grid-row:2; }
  .start-hand { min-height:54px; }
  .poker-table-page { padding-bottom:310px; }
  .table-demo-note { display:none; }
  .auth-story { min-height:330px;padding:0; }
  .auth-story h1 { font-size:2.7rem; }
  .auth-benefits { display:none; }
  .auth-card { padding:24px 18px;border-radius:16px; }
  .profile-summary { grid-template-columns:56px 1fr; }
  .profile-summary .text-link { grid-column:1/-1; }
  .settings-layout>aside,.responsible-side,.support-links { grid-template-columns:1fr; }
  .support-links a:last-child,.responsible-side article:last-child { grid-column:auto; }
  .wallet-summary { grid-template-columns:1fr; }
  .balance-breakdown { grid-template-columns:1fr; }
  .balance-breakdown article:last-child { grid-column:auto; }
  .total-balance-card { min-height:260px;padding:24px; }
  .total-balance-card>strong { font-size:2.6rem; }
  .ledger-filters { grid-template-columns:1fr; }
  .ledger-row { grid-template-columns:38px 1fr auto;padding:12px 0; }
  .ledger-status,.ledger-balance { display:none; }
  .mission-grid,.promo-grid { grid-template-columns:1fr; }
  .tier-card { grid-template-columns:1fr; }
  .trust-hero,.fair-hero { grid-template-columns:1fr;min-height:0;padding:26px 20px; }
  .session-clock,.support-response { padding:18px; }
  .integrity-mark { width:150px; }
  .limit-editor form { grid-template-columns:1fr; }
  .limit-editor form label:first-child { grid-column:auto; }
  .integrity-status-grid { grid-template-columns:1fr; }
  .verifier-panel form { grid-template-columns:1fr; }
  .dispute-path ol { grid-template-columns:1fr; }
  .editorial-sections section { grid-template-columns:40px 1fr;padding:28px 0; }
  .trust-contact,.education-next,.document-meta { align-items:flex-start;flex-direction:column; }
  .document-meta a { margin-left:0; }
  .notification-filters { overflow:auto; }
  .history-layout { grid-template-columns:1fr; }
  .replay-head { flex-direction:column; }
  .mini-poker-table { min-height:230px;padding:16px;border-width:8px; }
  .replay-controls { flex-wrap:wrap; }
  .admin-title { align-items:flex-start;flex-direction:column; }
  .admin-title > * { width:100%;min-width:0;max-width:100%; }
  .admin-title h1 { overflow-wrap:anywhere; }
  .filters,.grid.two,.grid.three,.grid.four,.two,.three,.four { grid-template-columns:1fr; }
}

@media (max-width: 480px) {
  .product-topbar { gap:8px; }
  .mobile-brand { flex:0 0 auto; }
  .global-search {
    width:44px;
    min-width:44px;
    flex:0 0 44px;
    margin:0;
    padding:0;
    justify-content:center;
    border-radius:50%;
  }
  .global-search-submit {
    width:42px;
    height:42px;
    margin:0;
  }
  .global-search input { display:none; }
  .account-cluster { flex:0 1 auto; }
  .balance-pill { max-width:86px; }
  .balance-pill strong { max-width:66px; }
  .account-cluster > .icon-button { display:none; }
  .guest-auth-actions .button:last-child { display:none; }
  .not-found { min-height:54vh; }
  .not-found-actions { align-items:stretch;flex-direction:column;width:100%; }
  .not-found-actions .button { width:100%; }
}

@media (orientation: landscape) and (max-height: 560px) and (max-width: 920px) {
  .poker-felt { min-height:460px;border-radius:22% / 30%; }
  .poker-action-dock { left:46%;right:10px;bottom:10px;grid-template-columns:repeat(3,1fr); }
  .poker-table-page { padding-bottom:30px; }
  .table-side-panel { display:none; }
  .table-workspace { grid-template-columns:1fr; }
  .bottom-nav { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important; }
}

.reduced-sensory .hero-card,
.reduced-sensory .skeleton-stack span,
.reduced-sensory .skeleton-card,
.reduced-sensory .skeleton-line { animation:none; }
.reduced-sensory .game-card:hover,.reduced-sensory .trust-grid a:hover { transform:none; }
.low-bandwidth body::after,.low-bandwidth::after { display:none; }
.low-bandwidth .hero-world { background:#0b1423; }
.low-bandwidth .hero-halo,.low-bandwidth .hero-card,.low-bandwidth .hero-chip { box-shadow:none;animation:none; }
.low-bandwidth .game-art { background:linear-gradient(var(--art-angle),var(--art-a),var(--art-b)); }
.is-offline .register-tournament,.is-offline .game-play-button,.is-offline .poker-action { opacity:.52;pointer-events:none; }

@media print {
  .demo-boundary,.desktop-sidebar,.product-topbar,.bottom-nav,.product-footer,.poker-action-dock,.toast-region { display:none !important; }
  .app-shell { display:block; }
  .page { width:100%;max-width:none;padding:20px; }
  body { background:white;color:black; }
}
