@font-face {
  font-family: BigPoolDisplay;
  src: url('/pool/css/Montserrat-Black.woff2') format('woff2');
  font-weight: 900;
  font-display: swap;
}

:root {
  --bg: #070908;
  --bg-soft: #0b0e0c;
  --surface: #101411;
  --surface-raised: #151a17;
  --surface-hover: #1a211d;
  --line: rgba(228, 238, 232, .10);
  --line-strong: rgba(228, 238, 232, .17);
  --text: #f5f7f5;
  --text-soft: #c9d0cc;
  --muted: #89948e;
  --green: #68d391;
  --green-bright: #8be3aa;
  --green-deep: #173b28;
  --gold: #d9b45d;
  --red: #f07d73;
  --blue: #76afe0;
  --shadow-sm: 0 8px 24px rgba(0, 0, 0, .18);
  --shadow-lg: 0 24px 80px rgba(0, 0, 0, .44);
  --font-body: 'DM Sans', Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading: Manrope, 'DM Sans', ui-sans-serif, system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); color-scheme: dark; }
body { min-height: 100%; margin: 0; min-width: 320px; background: var(--bg); color: var(--text); font-family: var(--font-body); font-size: 15px; letter-spacing: 0; -webkit-font-smoothing: antialiased; }
body::before { content: ''; position: fixed; z-index: -1; inset: 0; pointer-events: none; background: radial-gradient(circle at 88% 5%, rgba(74, 150, 103, .08), transparent 30%); }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
button, a { -webkit-tap-highlight-color: transparent; }
button, a, input, select, textarea { touch-action: manipulation; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }
h1, h2, h3, strong { font-family: var(--font-heading); }

.loading-screen { min-height: 100vh; display: grid; place-items: center; color: var(--muted); }
.spinner { width: 28px; height: 28px; border: 2px solid var(--line-strong); border-top-color: var(--green); border-radius: 50%; animation: spin .75s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 50% { opacity: .45; transform: scale(.85); } }

.brand { display: inline-flex; align-items: center; gap: 11px; font-family: var(--font-heading); font-size: 17px; font-weight: 800; letter-spacing: 0; }
.brand-mark { width: 38px; height: 38px; flex: 0 0 38px; object-fit: contain; filter: drop-shadow(0 5px 12px rgba(0, 255, 159, .12)); }

.landing { min-height: 100vh; background: var(--bg); }
.landing-hero { min-height: 820px; position: relative; display: flex; align-items: flex-end; overflow: hidden; background: #07100d url('/app-assets/assets/brand/bigpool-lobby-hero-v2.webp') center/cover no-repeat; }
.landing-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,6,5,.98) 0%, rgba(4,6,5,.88) 36%, rgba(4,6,5,.38) 64%, rgba(4,6,5,.12) 100%), linear-gradient(0deg, rgba(7,9,8,.98), transparent 42%); }
.landing-nav { position: absolute; z-index: 2; inset: 0 0 auto; height: 78px; display: flex; align-items: center; justify-content: space-between; padding: 0 max(24px, calc((100% - 1220px)/2)); border-bottom: 1px solid rgba(255,255,255,.10); background: rgba(5,8,6,.48); backdrop-filter: blur(12px); }
.landing-actions, .hero-actions { display: flex; gap: 10px; }
.hero-copy { position: relative; z-index: 1; width: min(1220px, calc(100% - 48px)); margin: 0 auto; padding-bottom: 88px; }
.eyebrow, .topbar-kicker, .sidebar-label { color: var(--green); font-family: var(--font-heading); font-size: 10px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
.hero-copy h1 { margin: 18px 0 4px; max-width: 700px; font-family: BigPoolDisplay, var(--font-heading); font-size: 112px; line-height: .84; }
.hero-statement { margin-bottom: 22px; color: var(--green-bright); font-family: var(--font-heading); font-size: 30px; font-weight: 800; }
.hero-copy p { max-width: 610px; margin: 0 0 30px; color: #d9dfdb; font-size: 19px; line-height: 1.6; text-shadow: 0 2px 14px rgba(0,0,0,.62); }
.hero-assurance { display: flex; flex-wrap: wrap; gap: 0; margin-top: 24px; color: #aab5ae; font-size: 12px; font-weight: 700; }
.hero-assurance span { padding: 0 15px; border-left: 1px solid rgba(255,255,255,.18); }
.hero-assurance span:first-child { padding-left: 0; border-left: 0; }
.landing-band { width: min(1220px, calc(100% - 48px)); margin: 0 auto; padding: 68px 0 104px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 42px; }
.landing-point { position: relative; border-top: 1px solid var(--line-strong); padding: 25px 0 0 22px; }
.landing-point::before { content: ''; position: absolute; top: 25px; left: 0; width: 2px; height: 34px; background: var(--green); }
.landing-point > span { display: block; margin-bottom: 13px; color: var(--gold); font-size: 11px; font-weight: 800; }
.landing-point strong { display: block; margin-bottom: 9px; font-size: 18px; }
.landing-point p { margin: 0; color: var(--muted); line-height: 1.65; }
.landing-section { width: min(1220px, calc(100% - 48px)); margin: 0 auto; padding: 108px 0; }
.landing-section-heading { display: grid; grid-template-columns: minmax(0, .8fr) minmax(320px, 1.2fr); gap: 52px; align-items: end; margin-bottom: 54px; }
.landing-section-heading .eyebrow { grid-column: 1 / -1; margin-bottom: -28px; }
.landing-section h2, .landing-feature h2, .landing-matchmaking h2, .landing-progression h2, .landing-stakes h2, .landing-final h2 { margin: 0; font-size: 52px; line-height: 1.02; }
.landing-section-heading > p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.7; }
.landing-arena-intro { border-top: 1px solid var(--line); padding-bottom: 78px; }
.landing-mode-line { display: flex; flex-wrap: wrap; border-block: 1px solid var(--line-strong); }
.landing-mode-line span { flex: 1 1 150px; padding: 18px 20px; border-right: 1px solid var(--line); color: var(--text-soft); font-size: 12px; font-weight: 800; text-align: center; text-transform: uppercase; }
.landing-mode-line span:last-child { border-right: 0; }
.landing-feature { min-height: 680px; position: relative; display: grid; align-items: stretch; overflow: hidden; border-top: 1px solid rgba(255,255,255,.1); background-color: #050807; background-position: center; background-size: cover; }
.landing-feature::before { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(90deg, rgba(3,5,4,.98) 0%, rgba(3,5,4,.92) 27%, rgba(3,5,4,.52) 48%, rgba(3,5,4,.05) 75%); }
.landing-feature-tournaments::before, .landing-feature-clubs::before { background: linear-gradient(270deg, rgba(3,5,4,.98) 0%, rgba(3,5,4,.92) 27%, rgba(3,5,4,.52) 48%, rgba(3,5,4,.05) 75%); }
.landing-feature-challenges { background-image: url('/app-assets/assets/landing/bigpool-challenges.webp'); }
.landing-feature-tournaments { background-image: url('/app-assets/assets/landing/bigpool-tournaments.webp'); }
.landing-feature-vault { background-image: url('/app-assets/assets/landing/bigpool-vault.webp'); }
.landing-feature-clubs { background-image: url('/app-assets/assets/landing/bigpool-clubs.webp'); }
.landing-feature-inner { position: relative; z-index: 1; width: min(1220px, calc(100% - 48px)); min-height: 680px; display: flex; align-items: center; margin: 0 auto; padding: 78px 0; }
.landing-feature-inner-right { justify-content: flex-end; }
.landing-feature-copy { width: min(500px, 45%); }
.landing-feature-number { display: block; margin-bottom: 46px; color: var(--gold); font-family: var(--font-heading); font-size: 12px; font-weight: 900; }
.landing-feature-copy .eyebrow { margin-bottom: 16px; }
.landing-feature-copy h2 { max-width: 500px; color: #fff; font-size: 56px; }
.landing-feature-copy > p { max-width: 490px; margin: 22px 0; color: #c4cdc7; font-size: 16px; line-height: 1.72; text-shadow: 0 2px 16px rgba(0,0,0,.72); }
.landing-feature-facts { display: flex; flex-wrap: wrap; margin: 0 0 28px; border-block: 1px solid rgba(255,255,255,.14); }
.landing-feature-facts span { padding: 12px 14px; border-right: 1px solid rgba(255,255,255,.12); color: #aab7af; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.landing-feature-facts span:first-child { padding-left: 0; }
.landing-feature-facts span:last-child { border-right: 0; }
.landing-feature .btn { min-width: 180px; }
.landing-matchmaking { min-height: 360px; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr); gap: 90px; align-items: center; padding: 72px max(24px, calc((100% - 1220px)/2)); border-block: 1px solid #284435; background: #0a110d; }
.landing-matchmaking h2 { max-width: 700px; margin-top: 14px; }
.landing-matchmaking p { margin: 0 0 26px; color: #aeb9b2; font-size: 16px; line-height: 1.7; }
.landing-text-link { display: inline-flex; align-items: center; gap: 12px; margin-top: 32px; color: var(--green); font-family: var(--font-heading); font-weight: 800; }
.landing-text-link span { font-size: 21px; transition: transform .18s; }
.landing-text-link:hover span { transform: translateX(4px); }
.landing-progression { min-height: 560px; display: grid; grid-template-columns: minmax(0, .9fr) minmax(440px, 1.1fr); gap: 80px; align-items: center; padding: 92px max(24px, calc((100% - 1220px)/2)); border-block: 1px solid var(--line); background: linear-gradient(90deg, rgba(5,8,6,.98) 0%, rgba(5,8,6,.89) 48%, rgba(5,8,6,.28) 100%), url('/app-assets/assets/brand/bigpool-og-1200x630.jpg') center/cover no-repeat, #07100d; }
.landing-progression-copy p { max-width: 560px; margin: 22px 0 28px; color: #b8c2bc; font-size: 16px; line-height: 1.7; }
.landing-scoreboard { border-top: 1px solid rgba(255,255,255,.22); background: rgba(7,12,9,.72); backdrop-filter: blur(12px); }
.landing-scoreboard div { display: grid; grid-template-columns: 130px 1fr; gap: 24px; padding: 22px 24px; border-bottom: 1px solid rgba(255,255,255,.13); }
.landing-scoreboard span { color: var(--green); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.landing-scoreboard strong { font-size: 16px; }
.landing-steps { padding-bottom: 120px; }
.landing-step-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 42px; }
.landing-step-grid article { padding-top: 28px; border-top: 1px solid var(--line-strong); }
.landing-step-grid b { width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: 48px; border: 1px solid rgba(104,211,145,.38); border-radius: 50%; color: var(--green); font-size: 13px; }
.landing-step-grid h3 { margin: 0 0 10px; font-size: 21px; }
.landing-step-grid p { margin: 0; color: var(--muted); line-height: 1.65; }
.landing-stakes { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, .85fr); gap: 90px; padding: 92px max(24px, calc((100% - 1220px)/2)); border-block: 1px solid #514525; background: #11120d; }
.landing-stakes p { margin: 0 0 18px; color: #c4c9c4; font-size: 16px; line-height: 1.75; }
.landing-stakes small { color: #9d987e; line-height: 1.6; }
.landing-final { min-height: 520px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 90px 24px; text-align: center; background: linear-gradient(0deg, rgba(5,8,6,.96), rgba(5,8,6,.74)), url('/app-assets/assets/brand/bigpool-lobby-hero-v2.webp') center 64%/cover no-repeat; }
.landing-final h2 { max-width: 830px; margin-top: 14px; font-size: 60px; }
.landing-final p { max-width: 620px; margin: 20px auto 30px; color: #bdc7c0; font-size: 17px; line-height: 1.7; }
.landing-final .hero-actions { justify-content: center; }
.landing-footer { width: min(1220px, calc(100% - 48px)); min-height: 112px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; margin: 0 auto; color: var(--muted); }
.landing-footer p { margin: 0; }
.landing-footer > div { display: flex; gap: 24px; color: var(--text-soft); font-weight: 700; }

.legal-page { min-height: 100vh; background: var(--bg); }
.legal-header { border-bottom: 1px solid var(--line); background: linear-gradient(115deg, #0b1711 0%, #080c0a 58%, #11130d 100%); }
.legal-nav { width: min(1120px, calc(100% - 48px)); min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 0 auto; border-bottom: 1px solid var(--line); }
.legal-nav > div { display: flex; align-items: center; gap: 22px; color: var(--text-soft); font-size: 13px; font-weight: 700; }
.legal-hero { width: min(1120px, calc(100% - 48px)); margin: 0 auto; padding: 88px 0 76px; }
.legal-hero h1 { max-width: 820px; margin: 16px 0; font-size: clamp(48px, 7vw, 82px); line-height: .98; }
.legal-hero p { max-width: 700px; margin: 0 0 24px; color: var(--text-soft); font-size: 18px; line-height: 1.7; }
.legal-hero > span { color: var(--gold); font-size: 12px; font-weight: 800; text-transform: uppercase; }
.legal-layout { width: min(1120px, calc(100% - 48px)); display: grid; grid-template-columns: 240px minmax(0, 760px); gap: 76px; justify-content: space-between; margin: 0 auto; padding: 72px 0 110px; }
.legal-toc { position: sticky; top: 28px; align-self: start; display: grid; gap: 0; border-top: 1px solid var(--line-strong); }
.legal-toc strong { padding: 18px 0 13px; color: var(--green); font-size: 11px; text-transform: uppercase; }
.legal-toc a { padding: 8px 0; color: var(--muted); font-size: 12px; line-height: 1.35; }
.legal-toc a:hover { color: var(--text); }
.legal-content { min-width: 0; }
.legal-content section { scroll-margin-top: 24px; padding: 0 0 52px; margin: 0 0 48px; border-bottom: 1px solid var(--line); }
.legal-content section:last-child { margin-bottom: 0; border-bottom: 0; }
.legal-content h2 { margin: 0 0 22px; color: var(--text); font-size: 27px; line-height: 1.25; }
.legal-content h3 { margin: 26px 0 10px; color: var(--text-soft); font-size: 15px; }
.legal-content p, .legal-content li { color: #aeb8b1; line-height: 1.78; }
.legal-content p { margin: 0 0 16px; }
.legal-content ul { display: grid; gap: 10px; margin: 0 0 18px; padding-left: 20px; }
.legal-content a, .legal-footer a { color: var(--green); text-decoration: underline; text-underline-offset: 3px; }
.legal-footer { width: min(1120px, calc(100% - 48px)); min-height: 112px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; margin: 0 auto; border-top: 1px solid var(--line); color: var(--muted); }
.legal-footer p { margin: 0; }
.legal-footer > div { display: flex; gap: 22px; }

.support-page { display: grid; gap: 42px; }
.support-hero { min-height: 310px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: end; padding: 58px; border: 1px solid rgba(104,211,145,.22); background: linear-gradient(90deg, rgba(5, 10, 8, .96), rgba(5, 10, 8, .68)), url('/app-assets/assets/brand/bigpool-clubhouse-bg-v1.webp') center/cover no-repeat; }
.support-hero h1 { max-width: 780px; margin: 12px 0 14px; font-size: clamp(42px, 6vw, 78px); line-height: .98; }
.support-hero p { max-width: 650px; margin: 0; color: var(--text-soft); font-size: 17px; line-height: 1.65; }
.support-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: 24px; align-items: start; }
.support-guide { padding: 24px; border: 1px solid var(--line); background: #0b100d; }
.support-guide h2 { margin: 0 0 18px; font-size: 22px; }
.support-guide ul { display: grid; gap: 12px; margin: 0; padding-left: 19px; color: var(--text-soft); line-height: 1.55; }
.support-ticket-list { display: grid; gap: 14px; }
.support-ticket-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: start; padding: 18px; border: 1px solid var(--line); background: #0c110e; }
.support-ticket-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; color: var(--muted); font-size: 12px; font-weight: 800; text-transform: uppercase; }
.support-ticket-head strong { color: var(--green); font-size: 13px; }
.support-ticket-row h3 { margin: 10px 0 8px; font-size: 18px; }
.support-ticket-row p { margin: 8px 0 10px; color: var(--text-soft); line-height: 1.6; white-space: pre-wrap; }
.support-ticket-row small { color: var(--muted); }

@media (max-width: 720px) {
  .support-page { gap: 24px; }
  .support-hero { min-height: 360px; grid-template-columns: 1fr; align-items: end; padding: 30px 20px; }
  .support-hero .btn { width: 100%; }
  .support-layout { grid-template-columns: 1fr; }
  .support-ticket-row { grid-template-columns: 1fr; }
}

.btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid transparent; border-radius: 6px; padding: 0 18px; background: var(--green); color: #07120b; box-shadow: 0 6px 20px rgba(104,211,145,.10); font-family: var(--font-heading); font-weight: 800; transition: background .18s, border-color .18s, transform .18s, color .18s; }
/* A glyph inside a button. Masked from currentColor like the sidebar icons,
   so a brand-coloured button gets a matching mark with no second rule. */
.btn-glyph { width: 17px; height: 17px; flex: 0 0 17px; background: currentColor; -webkit-mask: var(--glyph) center / contain no-repeat; mask: var(--glyph) center / contain no-repeat; }
.glyph-telegram { --glyph: url('/app-assets/assets/icons/telegram.svg'); }
.glyph-whatsapp { --glyph: url('/app-assets/assets/icons/whatsapp.svg'); }
.glyph-link { --glyph: url('/app-assets/assets/icons/link.svg'); }
.glyph-share { --glyph: url('/app-assets/assets/icons/share-2.svg'); }
.glyph-club { --glyph: url('/app-assets/assets/icons/user-round-plus.svg'); }
.glyph-x { --glyph: url('/app-assets/assets/icons/x.svg'); }

.btn:hover { background: var(--green-bright); transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn:disabled { cursor: not-allowed; opacity: .42; transform: none; }
.btn-secondary { background: var(--surface-hover); color: var(--text); border-color: var(--line); box-shadow: none; }
.btn-secondary:hover { background: #222a25; border-color: var(--line-strong); }
.btn-ghost { background: transparent; color: var(--text-soft); border-color: var(--line-strong); box-shadow: none; }
.btn-ghost:hover { background: rgba(255,255,255,.04); color: var(--text); }
.btn-danger { background: transparent; color: #ffaaa3; border-color: rgba(240,125,115,.28); box-shadow: none; }
.btn-small { min-height: 34px; padding: 0 12px; font-size: 12px; }
.btn-block { width: 100%; }

.auth-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(410px, 520px) 1fr; }
.auth-panel { display: flex; flex-direction: column; justify-content: center; padding: clamp(36px, 7vw, 84px); background: #0c100e; border-right: 1px solid var(--line); }
.auth-panel .brand { margin-bottom: 72px; }
.auth-panel h1 { margin: 0 0 10px; max-width: 380px; font-size: 38px; line-height: 1.15; }
.auth-panel > p { margin: 0 0 32px; color: var(--muted); line-height: 1.65; }
.auth-visual { min-height: 520px; position: relative; overflow: hidden; background: #050908 url('/app-assets/assets/brand/bigpool-auth-banner.webp?v=2') center/contain no-repeat; }
.auth-visual::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5, 9, 8, .28), transparent 16%); pointer-events: none; }
.auth-switch { margin-top: 25px; color: var(--muted); font-size: 13px; }
.auth-switch a { color: var(--green); font-weight: 700; }
.auth-legal { margin: -4px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; text-align: center; }
.auth-legal a { color: var(--green); font-weight: 700; }
.auth-provider-stack { display: grid; gap: 10px; margin-bottom: 13px; }
.google-auth, .wallet-auth { appearance: none; width: 100%; height: 52px; min-height: 52px; display: grid; grid-template-columns: 24px minmax(0,1fr) 18px; align-items: center; gap: 12px; overflow: hidden; padding: 0 16px; border-radius: 6px; box-shadow: 0 9px 28px rgba(0,0,0,.2); font-family: var(--font-heading); font-size: 14px; font-weight: 750; line-height: 1; text-align: center; transition: background .18s, border-color .18s, transform .18s, box-shadow .18s; }
.public-tournament{min-height:100vh;background:#050806;color:var(--text)}.public-tournament>.landing-nav{position:sticky;top:0;z-index:20;max-width:none;padding:18px clamp(20px,5vw,72px);border-bottom:1px solid var(--line);background:rgba(5,8,6,.94);backdrop-filter:blur(16px)}.public-tournament>.page{width:min(1320px,calc(100% - 40px));margin:0 auto;padding-top:46px;padding-bottom:72px}.public-tournament-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:28px clamp(20px,5vw,72px);border-top:1px solid var(--line);color:var(--muted);font-size:12px}.public-tournament-footer div{display:flex;gap:20px}.public-tournament-footer a{color:var(--text-soft)}
@media(max-width:700px){.public-tournament>.landing-nav{padding:14px 16px}.public-tournament>.landing-nav .landing-actions .btn-ghost{display:none}.public-tournament>.page{width:calc(100% - 24px);padding-top:20px}.public-tournament-footer{align-items:flex-start;flex-direction:column}}
.google-auth { border: 1px solid rgba(255,255,255,.2); background: #f5f7f6; color: #161a18; }
.google-auth:hover { transform: translateY(-1px); border-color: #fff; background: #fff; box-shadow: 0 12px 34px rgba(0,0,0,.28); }
.wallet-auth { border: 1px solid rgba(104,211,145,.45); background: #111a15; color: #f5f8f6; }
.wallet-auth:hover { transform: translateY(-1px); border-color: var(--green); background: #16231b; box-shadow: 0 12px 34px rgba(24,92,55,.2); }
.google-auth:active, .wallet-auth:active { transform: translateY(0); }
.google-auth:focus-visible, .wallet-auth:focus-visible { outline: 3px solid rgba(104,211,145,.28); outline-offset: 2px; }
.google-auth:disabled, .wallet-auth:disabled { cursor: not-allowed; opacity: .42; box-shadow: none; transform: none; }
.google-auth > span, .wallet-auth > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.google-auth i, .wallet-auth i { color: #66706a; font-family: var(--font-body); font-size: 14px; font-style: normal; }
.google-auth > .google-mark, .wallet-auth > .wallet-mark { display: block; width: 20px !important; height: 20px !important; max-width: 20px; max-height: 20px; justify-self: center; overflow: visible; }
.wallet-auth > .wallet-mark { fill: none !important; stroke: var(--green); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.wallet-assurance { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0 0 18px; color: #7f8d84; font-size: 10px; }
.wallet-assurance-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px rgba(104,211,145,.6); }
.auth-divider { display: flex; align-items: center; gap: 13px; margin-bottom: 20px; color: #68736c; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.auth-divider::before, .auth-divider::after { content: ''; height: 1px; flex: 1; background: var(--line); }
.auth-divider span { white-space: nowrap; }
.auth-inapp-note { margin: 0 0 18px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; background: rgba(104, 211, 145, .08); color: var(--text-soft); font-size: 13px; line-height: 1.45; }
.auth-inapp-note strong { color: var(--text); }
.auth-error { margin-bottom: 18px; }

.form { display: grid; gap: 18px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field { display: grid; gap: 8px; }
.field label { color: var(--text-soft); font-size: 12px; font-weight: 700; }
.input, .select, .textarea { width: 100%; min-height: 48px; border: 1px solid var(--line-strong); border-radius: 6px; background: #090c0a; color: var(--text); padding: 0 14px; outline: 0; transition: border-color .18s, box-shadow .18s, background .18s; }
.textarea { min-height: 110px; padding-top: 13px; resize: vertical; }
.input:hover, .select:hover, .textarea:hover { background: #0c100e; }
.input:focus, .select:focus, .textarea:focus { border-color: rgba(104,211,145,.7); box-shadow: 0 0 0 3px rgba(104,211,145,.09); }
.field-help { color: var(--muted); font-size: 11px; line-height: 1.5; }
.form-error { border: 1px solid rgba(240,125,115,.3); background: rgba(240,125,115,.07); color: #ffc0bb; border-radius: 6px; padding: 11px 13px; font-size: 12px; }
.paypal-card-shell { display: grid; gap: 14px; padding: 14px; border: 1px solid rgba(104,211,145,.22); border-radius: 7px; background: #090e0b; }
.paypal-card-shell[hidden], .paypal-card-fields[hidden], .paypal-basic-card-button[hidden], [data-paypal-card-submit][hidden], [data-deposit-redirect-submit][hidden] { display: none; }
.tournament-payment-summary { display: grid; grid-template-columns: 1fr auto; gap: 18px; padding: 16px; border: 1px solid var(--line); background: #0b110d; }
.tournament-payment-summary div { display: grid; gap: 4px; }
.tournament-payment-summary div:last-child { text-align: right; }
.tournament-payment-summary span, .tournament-payment-protection span { color: var(--muted); font-size: 13px; }
.tournament-payment-summary strong { font-size: 17px; }
.tournament-payment-protection { display: grid; gap: 5px; padding-left: 14px; border-left: 2px solid var(--green); }
.tournament-payment-protection strong { font-size: 14px; }
.quick-agreement { display: grid; gap: 18px; width: min(100%, 760px); margin: 24px auto 0; padding: 20px; border: 1px solid rgba(104,211,145,.28); background: #0a110d; text-align: left; }
.quick-agreement > div:first-child { display: grid; gap: 6px; }
.quick-agreement > div:first-child > strong { font-size: 24px; }
.quick-agreement p { margin: 0; color: var(--muted); }
.quick-agreement-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.agreement-readiness { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.agreement-readiness span { padding: 10px 12px; border: 1px solid var(--line); color: var(--muted); font-size: 13px; }
.agreement-readiness span.ready { border-color: rgba(104,211,145,.38); color: var(--green); background: rgba(104,211,145,.06); }
.quick-wager-balance { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--muted); }
.quick-wager-balance strong { color: var(--text); }
.paypal-card-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.paypal-card-field-wide { grid-column: 1 / -1; }
.paypal-card-field { height: 48px; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 6px; background: #070a08; padding: 2px 12px; transition: border-color .18s, box-shadow .18s, background .18s; }
.paypal-card-field:focus-within { border-color: rgba(104,211,145,.7); background: #0b100d; box-shadow: 0 0 0 3px rgba(104,211,145,.09); }
.paypal-card-loading { display: flex; align-items: center; gap: 8px; color: var(--green); font-size: 11px; font-weight: 750; }
.paypal-card-loading::before { content: ''; width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px rgba(104,211,145,.5); }
.paypal-card-loading.error { color: #ffc0bb; line-height: 1.5; }
.paypal-card-note { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.paypal-card-note a { color: var(--green); text-decoration: underline; text-underline-offset: 2px; }
.paypal-basic-card-button { min-height: 48px; position: relative; z-index: 0; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 248px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 27px 18px 20px; border-right: 1px solid var(--line); background: #0a0d0b; }
.sidebar .brand { padding: 0 10px 36px; }
.sidebar-label { margin: 0 11px 10px; color: #536059; font-size: 9px; }
.nav-list { display: grid; gap: 3px; }
.nav-link { position: relative; min-height: 43px; display: flex; align-items: center; gap: 11px; border-radius: 5px; padding: 0 12px; color: #949e98; font-size: 13px; font-weight: 600; transition: background .18s, color .18s; }
.nav-link::before { content: ''; position: absolute; left: 0; width: 2px; height: 20px; border-radius: 0 2px 2px 0; background: var(--green); opacity: 0; transform: scaleY(.45); transition: opacity .18s, transform .18s; }
.sidebar-nav-icon { width: 18px; height: 18px; flex: 0 0 18px; background: currentColor; -webkit-mask: var(--sidebar-icon) center / contain no-repeat; mask: var(--sidebar-icon) center / contain no-repeat; opacity: .82; transition: color .18s, opacity .18s, transform .18s; }
.sidebar-icon-home { --sidebar-icon: url('/app-assets/assets/icons/house.svg'); }
.sidebar-icon-challenges { --sidebar-icon: url('/app-assets/assets/icons/swords.svg'); }
.sidebar-icon-vault { --sidebar-icon: url('/app-assets/assets/icons/lock-keyhole.svg'); }
.sidebar-icon-store { --sidebar-icon: url('/app-assets/assets/icons/gem.svg'); }
.sidebar-icon-messages { --sidebar-icon: url('/app-assets/assets/icons/message-circle.svg'); }
.sidebar-icon-profile { --sidebar-icon: url('/app-assets/assets/icons/user-round.svg'); }
.sidebar-icon-notifications { --sidebar-icon: url('/app-assets/assets/icons/bell.svg'); }
.sidebar-icon-club { --sidebar-icon: url('/app-assets/assets/icons/users-round.svg'); }
.sidebar-icon-tournaments { --sidebar-icon: url('/app-assets/assets/icons/trophy.svg'); }
.sidebar-icon-leaderboard { --sidebar-icon: url('/app-assets/assets/icons/chart-no-axes-column-increasing.svg'); }
.sidebar-icon-friends { --sidebar-icon: url('/app-assets/assets/icons/user-round-check.svg'); }
.sidebar-icon-history { --sidebar-icon: url('/app-assets/assets/icons/history.svg'); }
.sidebar-icon-wallet { --sidebar-icon: url('/app-assets/assets/icons/wallet.svg'); }
.sidebar-icon-settings { --sidebar-icon: url('/app-assets/assets/icons/settings.svg'); }
.sidebar-icon-operations { --sidebar-icon: url('/app-assets/assets/icons/shield-check.svg'); }
.sidebar-icon-support { --sidebar-icon: url('/app-assets/assets/icons/circle-help.svg'); }
.nav-link-label { min-width: 0; }
.nav-link:hover { background: rgba(255,255,255,.025); color: var(--text); }
.nav-link:hover .sidebar-nav-icon { opacity: 1; transform: translateX(1px); }
.nav-link.active { background: #151b17; color: var(--text); }
.nav-link.active::before { opacity: 1; transform: scaleY(1); }
.nav-link.active .sidebar-nav-icon { color: var(--green); opacity: 1; }
.sidebar-user { margin-top: auto; border-top: 1px solid var(--line); padding: 18px 8px 0; display: flex; align-items: center; gap: 11px; }
.profile-chevron { margin-left: auto; color: #55615a; font-size: 20px; }
.app-main { min-width: 0; }
.topbar { position: sticky; z-index: 10; top: 0; height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 clamp(22px, 4vw, 50px); border-bottom: 1px solid var(--line); background: rgba(7,9,8,.86); backdrop-filter: blur(18px); }
.topbar-heading { min-width: 0; display: flex; align-items: center; }
.topbar-brand-mark { display: none; }
.topbar-kicker { margin-bottom: 3px; color: #59645e; font-size: 8px; }
.topbar-title { font-family: var(--font-heading); font-size: 16px; font-weight: 750; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.balance-pill { min-height: 38px; display: inline-flex; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid var(--line); border-radius: 6px; background: rgba(255,255,255,.02); color: var(--gold); font-family: var(--font-heading); font-size: 12px; font-weight: 800; }
.balance-pill span { color: var(--muted); font: 500 10px var(--font-body); }
.match-ready-link { min-height: 38px; display: inline-flex; align-items: center; gap: 8px; padding: 0 13px; border-radius: 6px; background: var(--green); color: #06100a; font-family: var(--font-heading); font-size: 11px; font-weight: 800; }
.live-pip { width: 6px; height: 6px; border-radius: 50%; background: #092010; animation: pulse 1.4s infinite; }
.topbar-profile { display: block; }
.notification-link { position: relative; }
.chat-link { position: relative; }
.chat-icon { position: relative; width: 17px; height: 13px; border: 1.5px solid currentColor; border-radius: 4px; }
.chat-icon::after { content: ''; position: absolute; left: 3px; bottom: -4px; width: 5px; height: 5px; border-left: 1.5px solid currentColor; transform: skewY(-38deg); }
.icon-count { position: absolute; top: -6px; right: -7px; min-width: 18px; height: 18px; display: grid; place-items: center; border: 2px solid var(--bg); border-radius: 9px; padding: 0 4px; background: var(--red); color: #170706; font-size: 9px; }
.icon-count[hidden] { display: none; }
.notification-dot { position: absolute; top: 7px; right: 7px; width: 6px; height: 6px; border: 2px solid var(--surface); background: var(--red); border-radius: 50%; box-sizing: content-box; }
.bell-icon { width: 14px; height: 14px; display: block; border: 1.5px solid currentColor; border-radius: 7px 7px 4px 4px; border-bottom: 0; opacity: .8; }
.page { width: min(1240px, 100%); margin: 0 auto; padding: 38px clamp(22px, 4vw, 50px) 104px; }
.page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 30px; }
.page-header h1 { margin: 0; font-size: clamp(29px, 3vw, 40px); line-height: 1.1; }
.page-header p { margin: 9px 0 0; color: var(--muted); line-height: 1.55; }
.section { margin-top: 42px; }
.section-heading { min-height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.section-heading h2 { margin: 0; font-size: 18px; }
.text-link { color: var(--green); font-size: 12px; font-weight: 700; }

.lobby-hero { min-height: clamp(350px, 32vw, 420px); display: grid; align-items: end; position: relative; overflow: hidden; padding: 38px; background: linear-gradient(90deg, rgba(5,9,7,.97) 0%, rgba(5,9,7,.9) 35%, rgba(5,9,7,.5) 58%, rgba(5,9,7,.12) 82%), linear-gradient(0deg, rgba(4,7,5,.62), transparent 58%), url('/app-assets/assets/brand/bigpool-lobby-hero-v3.webp') center 52%/cover no-repeat, #07100d; border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow-sm); }
.lobby-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3,6,5,.05), transparent 42%, rgba(3,6,5,.28)); pointer-events: none; }
.lobby-hero::after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 3px; background: var(--green); }
.lobby-hero-content { position: relative; z-index: 1; max-width: 610px; }
.lobby-hero h1 { margin: 9px 0 11px; font-size: clamp(34px, 4.2vw, 52px); line-height: 1.04; text-shadow: 0 2px 22px rgba(0,0,0,.52), 0 1px 4px rgba(0,0,0,.6); }
.lobby-hero p { margin: 0; color: #c4cdc7; font-size: 16px; text-shadow: 0 1px 12px rgba(0,0,0,.72); }
.quick-actions { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 9px; margin-top: 27px; }
.room-builder-form { gap: 16px; }
.room-builder-hero { min-height: 210px; position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 160px; align-items: end; gap: 24px; overflow: hidden; margin: -20px -20px 4px; padding: 28px; border-bottom: 1px solid rgba(104,211,145,.18); background: linear-gradient(90deg, rgba(5,9,7,.97), rgba(5,9,7,.72)), url('/app-assets/assets/brand/bigpool-clubhouse-bg-v1.webp') center/cover no-repeat; }
.room-builder-hero::after { content: ''; position: absolute; inset: auto 0 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(104,211,145,.8), transparent); }
.room-builder-hero > div:first-child { position: relative; z-index: 1; min-width: 0; }
.room-builder-hero h3 { max-width: 390px; margin: 10px 0 9px; font-size: 30px; line-height: 1.02; }
.room-builder-hero p { max-width: 430px; margin: 0; color: #b6c1ba; font-size: 13px; line-height: 1.55; }
.room-builder-table { position: relative; z-index: 1; width: 160px; aspect-ratio: 16 / 10; align-self: center; border: 1px solid rgba(104,211,145,.32); border-radius: 8px; background: radial-gradient(circle at 52% 50%, rgba(104,211,145,.18), transparent 42%), linear-gradient(135deg, #12391f, #07100b 64%); box-shadow: inset 0 0 0 8px rgba(7,11,8,.72), 0 18px 42px rgba(0,0,0,.36); }
.room-builder-table::before, .room-builder-table::after, .room-builder-table span, .room-builder-table i, .room-builder-table b { content: ''; position: absolute; border-radius: 50%; background: #020403; box-shadow: 0 0 0 1px rgba(255,255,255,.08); }
.room-builder-table::before { left: 9px; top: 9px; width: 18px; height: 18px; }
.room-builder-table::after { right: 9px; top: 9px; width: 18px; height: 18px; }
.room-builder-table span { left: 9px; bottom: 9px; width: 18px; height: 18px; }
.room-builder-table i { right: 9px; bottom: 9px; width: 18px; height: 18px; }
.room-builder-table b { left: 50%; bottom: 7px; width: 17px; height: 17px; transform: translateX(-50%); }
.room-builder-fields { display: grid; gap: 14px; }
.room-builder-fields .textarea { min-height: 104px; }
.room-asset-choice { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin: 0; padding: 14px; border: 1px solid var(--line); border-radius: 7px; background: #0b100d; }
.room-asset-choice legend { padding: 0 8px; color: var(--text-soft); font-size: 11px; font-weight: 800; }
.room-asset-choice label { min-width: 0; cursor: pointer; }
.room-asset-choice input { position: absolute; opacity: 0; pointer-events: none; }
.room-asset-choice span { min-height: 64px; display: grid; align-content: center; gap: 4px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 6px; background: #080c0a; transition: border-color .18s, background .18s, box-shadow .18s; }
.room-asset-choice strong, .room-asset-choice small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.room-asset-choice strong { color: var(--text); font-size: 16px; }
.room-asset-choice small { color: var(--muted); font-size: 10px; }
.room-asset-choice input:checked + span { border-color: rgba(104,211,145,.62); background: rgba(104,211,145,.09); box-shadow: inset 0 0 0 1px rgba(104,211,145,.08); }
.room-builder-note { display: grid; gap: 5px; padding: 14px 15px; border: 1px solid rgba(217,180,93,.24); border-radius: 7px; background: rgba(217,180,93,.055); }
.room-builder-note strong { color: #e4d2a4; font-size: 12px; }
.room-builder-note span { color: #b8ad8e; font-size: 11px; line-height: 1.48; }
.room-detail-page { max-width: 1320px; display: grid; gap: 24px; }
.room-detail-hero { min-height: 340px; position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 330px; align-items: end; gap: 30px; overflow: hidden; padding: clamp(28px, 5vw, 54px); border: 1px solid rgba(104,211,145,.22); border-radius: 8px; background: linear-gradient(90deg, rgba(4,7,5,.98) 0%, rgba(4,7,5,.88) 46%, rgba(4,7,5,.35) 78%), url('/app-assets/assets/brand/bigpool-clubhouse-bg-v1.webp') center 52%/cover no-repeat, #07100d; box-shadow: var(--shadow-sm); }
.room-detail-hero::after { content: ''; position: absolute; inset: auto 0 0; height: 3px; background: linear-gradient(90deg, var(--green), transparent 72%); }
.room-detail-copy, .room-detail-stats { position: relative; z-index: 1; }
.room-detail-copy h1 { max-width: 780px; margin: 12px 0 12px; font-size: clamp(54px, 7vw, 92px); line-height: .9; overflow-wrap: anywhere; }
.room-detail-copy p { max-width: 650px; margin: 0; color: #c1cac4; font-size: 17px; line-height: 1.6; text-shadow: 0 2px 18px rgba(0,0,0,.58); }
.room-detail-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; }
.room-detail-stats { align-self: stretch; display: grid; align-content: end; border: 1px solid rgba(255,255,255,.12); border-radius: 8px; background: rgba(6,10,8,.7); backdrop-filter: blur(14px); }
.room-detail-stats div { min-height: 86px; display: grid; align-content: center; gap: 7px; padding: 18px 20px; border-bottom: 1px solid rgba(255,255,255,.09); }
.room-detail-stats div:last-child { border-bottom: 0; }
.room-detail-stats span { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.room-detail-stats strong { color: var(--text); font-size: 24px; }
.room-detail-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr); gap: 22px; align-items: stretch; }
.room-chat-panel { min-width: 0; display: grid; grid-template-rows: auto minmax(360px, 1fr) auto; overflow: hidden; background: linear-gradient(180deg, #101612, #0b100d); }
.room-chat-panel > header { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; border-bottom: 1px solid var(--line); }
.room-chat-panel h2 { margin: 3px 0 0; font-size: 28px; }
.room-chat-panel > header > span { min-height: 30px; display: inline-flex; align-items: center; border: 1px solid rgba(104,211,145,.22); border-radius: 15px; padding: 0 11px; color: var(--green-bright); font-size: 10px; font-weight: 800; text-transform: uppercase; white-space: nowrap; }
.room-chat-feed { min-width: 0; overflow-x: hidden; overflow-y: auto; padding: 14px 20px; scrollbar-color: #354139 transparent; }
.room-chat-message { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.room-chat-message:last-child { border-bottom: 0; }
.room-chat-message > div { min-width: 0; }
.room-chat-message header { min-width: 0; display: flex; align-items: baseline; gap: 8px; }
.room-chat-message strong, .room-chat-message span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.room-chat-message strong { color: var(--text); font-size: 13px; }
.room-chat-message span { color: var(--muted); font-size: 10px; }
.room-chat-message p { margin: 5px 0 0; color: var(--text-soft); line-height: 1.55; overflow-wrap: anywhere; }
.room-empty-state { min-height: 320px; display: grid; place-items: center; align-content: center; gap: 7px; border: 1px dashed rgba(104,211,145,.18); border-radius: 7px; background: rgba(255,255,255,.012); text-align: center; }
.room-empty-state strong { font-size: 18px; }
.room-empty-state span { color: var(--muted); }
.room-chat-composer { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding: 14px; border-top: 1px solid var(--line); background: #0c120e; }
.room-chat-composer .input { min-width: 0; }
.room-play-panel { min-width: 0; display: grid; gap: 14px; align-content: start; }
.room-table-card { overflow: hidden; background: linear-gradient(180deg, #101612, #0b100d); }
.room-featured-table { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid rgba(104,211,145,.26); border-radius: 8px; background: #020604; box-shadow: inset 0 0 35px rgba(104,211,145,.08); }
.room-featured-table iframe { width: 100%; height: 100%; border: 0; display: block; pointer-events: none; }
.room-featured-loading { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 10px; padding: 24px; color: var(--muted); text-align: center; }
.room-featured-loading strong { color: var(--text); }
.room-live-badge { position: absolute; top: 10px; left: 10px; z-index: 2; padding: 5px 8px; border-radius: 4px; background: #e44242; color: #fff; font-size: 10px; font-weight: 900; letter-spacing: .12em; box-shadow: 0 5px 18px rgba(0,0,0,.45); }
.room-table-preview { height: 260px; position: relative; overflow: hidden; border-bottom: 1px solid var(--line); background: linear-gradient(0deg, rgba(5,9,7,.52), rgba(5,9,7,.04)), url('/app-assets/assets/brand/bigpool-clubhouse-bg-v1.webp') center/cover no-repeat; }
.room-table-preview::before { content: ''; position: absolute; left: 50%; top: 50%; width: min(78%, 390px); aspect-ratio: 16 / 8; border: 14px solid #3c2015; border-radius: 18px; background: radial-gradient(circle at 50% 48%, rgba(117,194,230,.55), transparent 50%), #2797c5; box-shadow: inset 0 0 0 6px #0b879f, 0 18px 46px rgba(0,0,0,.5); transform: translate(-50%, -50%); }
.room-table-preview span, .room-table-preview i, .room-table-preview b { position: absolute; z-index: 1; border-radius: 50%; }
.room-table-preview span { left: 34%; top: 42%; width: 13px; height: 13px; background: #fff; box-shadow: 88px 17px 0 #d33, 113px 27px 0 #263ed1, 136px 12px 0 #e1b737; }
.room-table-preview i { right: 15%; top: 17%; width: 42px; height: 42px; border: 1px solid rgba(217,180,93,.55); background: rgba(8,12,9,.78); }
.room-table-preview i::after { content: '8'; position: absolute; inset: 0; display: grid; place-items: center; color: var(--gold); font: 900 20px var(--font-heading); }
.room-table-preview b { left: 18px; bottom: 18px; width: 50px; height: 50px; background: url('/app-assets/assets/brand/bigpool-icon-192.png') center/contain no-repeat; filter: drop-shadow(0 10px 18px rgba(0,0,0,.5)); }
.room-table-card h2 { margin: 8px 0 9px; font-size: 26px; line-height: 1.05; }
.room-table-card p { margin: 0 0 20px; color: var(--muted); line-height: 1.6; }
.room-owner-card { padding: 20px; border-color: rgba(217,180,93,.22); background: rgba(217,180,93,.045); }
.room-owner-card h3 { margin: 0 0 8px; font-size: 17px; }
.room-owner-card p { margin: 0; color: #b9ad8e; font-size: 12px; line-height: 1.55; }

/* Room lounge: keep conversation and table actions within one screen. */
.page.room-detail-page { display: flex; flex-direction: column; gap: 24px; }
/* `flex-shrink: 0` is load-bearing. The page is a column flex container, so the
   hero is a flex item that the browser will happily squash down to its
   min-height when the content below it is tall — and the `overflow: hidden`
   that keeps the banner artwork in its box then clips the bottom of the action
   row without a scrollbar or any other sign. On a phone that silently ate
   "Copy invite" and the Telegram share button. */
.room-detail-page .room-detail-hero { flex-shrink: 0; min-height: 260px; display: flex; align-items: flex-end; justify-content: space-between; padding: 28px 32px; border: 0; border-radius: 0; background: linear-gradient(90deg, rgba(4,7,5,.88), rgba(4,7,5,.32)), url('/app-assets/assets/brand/bigpool-clubhouse-bg-v1.webp') center 48% / cover; }
.room-back-link { display: inline-block; color: #e3e9e5; font-size: 12px; margin-bottom: 24px; text-decoration: none; }
.room-detail-page .room-detail-copy { min-width: 0; }
.room-detail-page .room-detail-copy h1 { font-size: 40px; line-height: 1.1; margin: 10px 0; letter-spacing: 0; }
.room-detail-page .room-detail-copy p { font-size: 14px; max-width: 540px; }
.room-detail-page .room-detail-actions { margin-top: 20px; }
.room-detail-page .room-detail-actions [data-nav='/rooms'] { display: none; }
.room-detail-page .room-detail-stats { background: transparent; backdrop-filter: none; border: 0; align-self: flex-end; width: 170px; flex: 0 0 170px; }
.room-detail-page .room-detail-stats div { min-height: 58px; padding: 10px 0; }
.room-detail-page .room-detail-stats strong { font-size: 17px; overflow-wrap: anywhere; }
.room-detail-page .room-detail-grid { order: 1; grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr); gap: 24px; }
.room-detail-page .room-members-section { order: 2; margin-top: 0; }
.room-detail-page .room-chat-panel { height: 510px; grid-template-rows: auto minmax(0, 1fr) auto; background: #0e1412; border-color: #29372f; box-shadow: none; }
.room-detail-page .room-chat-panel h2 { font-size: 20px; }
.room-detail-page .room-chat-feed { min-height: 0; }
.room-detail-page .room-chat-message { padding: 16px 0; border: 0; }
.room-detail-page .room-chat-message p { font-size: 14px; color: #dce4df; }
.room-detail-page .room-chat-message .avatar { width: 36px; height: 36px; }
.room-detail-page .room-chat-composer { grid-template-columns: minmax(0, 1fr); gap: 10px; background: #121c17; }
.room-detail-page .room-chat-composer .input { width: 100%; min-height: 44px; background: #080e0b; border: 1px solid #33463b; border-radius: 6px; color: #fff; padding: 12px 14px; }
.store-item-cosmetic { margin: 6px 0 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.player-link { color: inherit; text-decoration: none; border-radius: 4px; }
.player-link:hover, .player-link:focus-visible { color: var(--green-bright); text-decoration: underline; text-underline-offset: 2px; }
.player-link:focus-visible { outline: 2px solid var(--green-bright); outline-offset: 2px; }
.room-chat-message a.player-link > .avatar { transition: transform .12s ease; }
.room-chat-message a.player-link:hover > .avatar { transform: scale(1.06); }
.room-chat-join { display: grid; gap: 8px; justify-items: start; padding: 18px 20px; border-top: 1px solid var(--line); background: #0c120e; }
.room-chat-join strong { color: var(--text); font-size: 15px; }
.room-chat-join span { color: var(--muted); font-size: 13px; line-height: 1.5; }
.room-chat-join .btn { margin-top: 4px; }
.room-chat-tools { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.room-chat-tools button { min-height: 36px; }
.room-chat-tools button[type='submit'] { margin-left: auto; min-width: 80px; }
.room-detail-page .room-table-card { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.room-detail-page .room-table-preview { height: 200px; border-radius: 8px; }
.room-detail-page .room-table-card .card-body { padding: 20px 0 0; }
.room-detail-page .room-table-card h2 { font-size: 22px; line-height: 1.2; }
.room-detail-page .room-table-card p { font-size: 13px; margin-bottom: 16px; }
.room-detail-page .room-owner-card { border: 0; border-top: 1px solid #394031; border-radius: 0; padding: 16px 0; background: transparent; box-shadow: none; }
.room-detail-page .room-owner-card h3 { font-size: 13px; color: #ddc27e; }
.room-detail-page .room-members-section h2 { font-size: 21px; }
.room-detail-page .room-empty-state { min-height: 100%; border: 0; background: transparent; }
@media (max-width: 1040px) {
  .room-detail-page .room-detail-grid { grid-template-columns: minmax(0, 1fr); }
  .room-detail-page .room-play-panel { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .room-detail-page .room-detail-hero { padding: 22px 18px; display: block; }
  .room-detail-page .room-detail-copy h1 { font-size: 30px; }
  .room-detail-page .room-detail-stats { display: flex; width: 100%; gap: 22px; margin-top: 20px; }
  .room-detail-page .room-detail-stats div { min-width: 0; flex: 1; border-bottom: 0; }
  .room-detail-page .room-detail-stats strong { font-size: 14px; }
  /* Tall enough to hold a conversation rather than a single line, but bounded
     so the composer never leaves the viewport on a short phone. */
  .room-detail-page .room-chat-panel { height: min(620px, 72dvh); min-height: 420px; }
  .room-detail-page .room-detail-actions .btn { flex: 1 1 130px; }
  .room-detail-page .room-chat-panel > header { padding: 16px; }
}
.home-vault-feature { min-height: 330px; position: relative; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); align-items: stretch; overflow: hidden; border: 1px solid #33473b; background: linear-gradient(112deg, #090e0b 0%, #101b14 54%, #09100c 100%); box-shadow: inset 0 0 70px rgba(0,0,0,.42), var(--shadow-sm); }
.home-vault-feature::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent 49.8%, rgba(255,255,255,.025) 50%, transparent 50.2%); }
.home-vault-copy { position: relative; z-index: 1; padding: clamp(30px, 5vw, 54px); }
.home-vault-heading { display: flex; align-items: center; gap: 12px; }
.home-vault-kicker { color: var(--green-bright); font-size: 10px; font-weight: 850; letter-spacing: 0; text-transform: uppercase; }
.home-vault-copy h2 { margin: 20px 0 18px; color: #fff; font-size: clamp(42px, 5.4vw, 72px); line-height: .94; }
.home-vault-copy h2 span { color: var(--green-bright); }
.home-vault-copy p { max-width: 590px; margin: 0; color: #aab7af; font-size: 15px; line-height: 1.68; }
.home-vault-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 27px; }
.home-vault-copy > small { display: block; margin-top: 13px; color: #718078; font-size: 9px; line-height: 1.5; }
.home-vault-visual { position: relative; z-index: 1; min-height: 330px; display: grid; grid-template-rows: minmax(0, 1fr) auto; place-items: center; padding: 28px 36px 0; border-left: 1px solid rgba(255,255,255,.035); background: repeating-conic-gradient(from 0deg at 50% 45%, rgba(255,255,255,.018) 0 2deg, transparent 2deg 30deg); }
.home-vault-seal { width: min(210px, 55%); aspect-ratio: 1; display: grid; place-items: center; border: 1px solid rgba(197,174,106,.42); border-radius: 50%; background: radial-gradient(circle, #13251a 0 23%, #080c09 24% 41%, #324139 42% 43%, #0d1510 44% 67%, #253029 68% 69%, #080c09 70%); box-shadow: inset 0 0 0 10px #080c09, inset 0 0 0 11px rgba(197,174,106,.18), 0 20px 60px rgba(0,0,0,.54); }
.home-vault-seal span { width: 70px; aspect-ratio: 1; display: grid; place-items: center; border: 2px solid var(--green); border-radius: 50%; background: #070a08; color: #fff; font: 800 38px var(--font-heading); box-shadow: 0 0 28px rgba(104,211,145,.2); }
.home-vault-facts { width: calc(100% + 72px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid rgba(255,255,255,.055); background: rgba(5,8,6,.72); }
.home-vault-facts div { min-width: 0; padding: 15px 14px; border-right: 1px solid rgba(255,255,255,.055); text-align: center; }
.home-vault-facts div:last-child { border: 0; }
.home-vault-facts span, .home-vault-facts strong { display: block; }
.home-vault-facts span { color: #708077; font-size: 8px; font-weight: 750; text-transform: uppercase; }
.home-vault-facts strong { margin-top: 5px; overflow: hidden; color: #f3f7f4; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }

.grid { display: grid; gap: 14px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card { border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: var(--shadow-sm); }
.card-body { padding: 20px; }
.card-title { margin: 0; font-size: 15px; }
.card-muted { color: var(--muted); font-size: 12px; }
/* Flex, not grid. As a grid the card's rows stretch to fill a row made tall
   by a sibling — an owner card whose share buttons wrap onto two lines — and
   the slack lands in the last row, so the Accept button on the cards beside
   it grew from 44px to 70px. Flex columns do not stretch on the main axis;
   the slack goes to the auto margin below, leaving the button its own size. */
.challenge-card { padding: 18px; display: flex; flex-direction: column; gap: 17px; transition: border-color .18s, transform .18s, background .18s; }
.challenge-card > .challenge-meta { margin-bottom: auto; }
.challenge-card:hover { border-color: var(--line-strong); background: var(--surface-raised); transform: translateY(-2px); }
.challenge-owner-actions { display: grid; grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr); gap: 8px; }
.btn-x { width: 44px; min-width: 44px; padding: 0; border-color: #343a37; background: #070908; color: #fff; }
.btn-x:hover { border-color: #727a76; background: #151816; }
.btn-x .btn-glyph { width: 15px; height: 15px; flex-basis: 15px; }
/* Telegram's own blue, so the button reads as "this goes to Telegram" at a
   glance rather than as another generic secondary action. */
.btn-telegram { width: 44px; min-width: 44px; padding: 0; border-color: #229ed9; background: #229ed9; color: #fff; }
.btn-telegram:hover { border-color: #2aa9e6; background: #2aa9e6; }
.btn-telegram .btn-glyph { width: 19px; height: 19px; flex-basis: 19px; }
.active-match-card { min-height: 92px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 18px; padding: 17px; border-color: rgba(104,211,145,.32); background: linear-gradient(110deg, #101612, #111512); }
.active-match-actions { display: grid; gap: 6px; }
.match-entry-actions { justify-content: center; margin-top: 30px; }
.admin-match-report { align-items: start; }
.admin-match-report p { max-width: 720px; margin: 8px 0 0; color: var(--text); line-height: 1.5; }
.admin-challenge-row { min-height: 82px; }
.admin-challenge-stake { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.admin-challenge-stake strong { color: var(--gold); font-size: 12px; }
.admin-tournament-row { min-height: 92px; }
.admin-tournament-main { min-width: 0; }
.admin-tournament-heading { display: flex; align-items: center; gap: 10px; }
.admin-tournament-heading strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-tournament-facts { display: flex; flex-wrap: wrap; gap: 6px 0; margin-top: 8px; color: var(--muted); font-size: 10px; }
.admin-tournament-facts span { padding: 0 10px; border-left: 1px solid var(--line); }
.admin-tournament-facts span:first-child { padding-left: 0; border-left: 0; }
.admin-tournament-actions { flex-wrap: wrap; justify-content: flex-end; }
.tournament-edit-form{display:grid;gap:18px}.tournament-edit-section{display:grid;gap:14px;padding:18px;border:1px solid var(--line);background:rgba(255,255,255,.015)}.tournament-edit-section>.eyebrow{margin-bottom:2px}.tournament-edit-total{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px;border:1px solid rgba(102,212,145,.3);background:rgba(102,212,145,.06)}.tournament-edit-total span{color:var(--muted);font-size:11px}.tournament-edit-total strong{color:var(--green);font-size:20px}
.input-suffix{position:relative}.input-suffix .input{padding-right:52px}.input-suffix>span{position:absolute;right:18px;top:50%;transform:translateY(-50%);color:var(--muted);font-weight:700;pointer-events:none}
.active-match-score { display: flex; align-items: center; gap: 8px; color: var(--muted); }
.active-match-score strong { color: var(--gold); font-size: 21px; }
.challenge-player { display: flex; align-items: center; gap: 12px; min-width: 0; }
.avatar { flex: 0 0 auto; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid rgba(104,211,145,.18); border-radius: 50%; background: #14241a; color: var(--green-bright); font: 800 12px var(--font-heading); overflow: hidden; }
.avatar img { width: 100%; height: 100%; object-fit: cover; }
.avatar-lg { width: 78px; height: 78px; font-size: 21px; }
.onboarding-panel { text-align: left; }
.onboarding-form { margin-top: 24px; }
.avatar-picker { display: grid; grid-template-columns: 88px minmax(0, 1fr); align-items: center; gap: 18px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.avatar-preview { width: 88px; height: 88px; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(104,211,145,.3); border-radius: 50%; background: #14241a; color: var(--green-bright); font: 800 23px var(--font-heading); box-shadow: 0 0 0 5px rgba(104,211,145,.045); }
.avatar-preview img { width: 100%; height: 100%; object-fit: cover; }
.avatar-picker p { margin: 5px 0 12px; color: var(--muted); font-size: 12px; }
.avatar-upload { cursor: pointer; }
.avatar-upload input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.player-name { min-width: 0; }
.player-name strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.player-name span { color: var(--muted); font-size: 11px; }
.challenge-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.meta-block { padding: 11px; border: 1px solid rgba(255,255,255,.035); border-radius: 5px; background: #0c100e; }
.meta-block span { display: block; color: #66716b; font-size: 9px; font-weight: 700; text-transform: uppercase; }
.meta-block strong { display: block; margin-top: 5px; font-size: 12px; }
.filters { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 19px; }
.filter { min-height: 35px; border: 1px solid var(--line); border-radius: 5px; padding: 0 13px; background: transparent; color: var(--muted); font-size: 12px; font-weight: 600; }
.filter:hover { color: var(--text); border-color: var(--line-strong); }
.filter.active { border-color: rgba(104,211,145,.32); background: rgba(104,211,145,.1); color: var(--green-bright); }
.pagination { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 22px; padding: 14px 0; border-top: 1px solid var(--line); }
.pagination-summary strong, .pagination-summary span { display: block; }
.pagination-summary strong { color: var(--text); font-size: 12px; }
.pagination-summary span { margin-top: 3px; color: var(--muted); font-size: 10px; }
.pagination-controls, .pagination-pages { display: flex; align-items: center; gap: 5px; }
.pagination-step, .pagination-page { min-width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid var(--line); border-radius: 5px; background: #0c100e; color: var(--text-soft); font-size: 11px; font-weight: 700; }
.pagination-step { padding: 0 11px; }
.pagination-step:hover, .pagination-page:hover { border-color: var(--line-strong); background: var(--surface-raised); color: var(--text); }
.pagination-page.active { border-color: rgba(104,211,145,.42); background: rgba(104,211,145,.11); color: var(--green-bright); }
.pagination-step.disabled { opacity: .35; cursor: default; }
.pagination-gap { width: 20px; color: var(--muted); text-align: center; }

.challenge-builder-page { max-width: 1180px; }
.challenge-builder-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 28px; }
.challenge-builder-header h1 { margin: 7px 0 8px; font-size: clamp(32px, 4vw, 48px); line-height: 1; }
.challenge-builder-header p { max-width: 650px; margin: 0; color: var(--muted); line-height: 1.55; }
.game-badge { min-width: 172px; display: flex; align-items: center; gap: 12px; padding: 11px 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.game-badge strong, .game-badge small { display: block; }
.game-badge small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.eight-ball { width: 38px; height: 38px; display: grid; place-items: center; border: 4px solid #222; border-radius: 50%; background: #f5f5f2; color: #090b0a; font: 900 15px var(--font-heading); box-shadow: inset 0 0 0 1px #fff, 0 5px 14px rgba(0,0,0,.28); }
.challenge-builder { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(310px, .75fr); align-items: start; gap: 22px; }
.challenge-controls { display: grid; gap: 14px; }
.builder-step { min-width: 0; margin: 0; padding: 22px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: var(--shadow-sm); }
.builder-step legend { width: 100%; display: flex; align-items: center; gap: 12px; padding: 0; margin-bottom: 18px; }
.builder-step legend > span { width: 28px; height: 28px; flex: 0 0 28px; display: grid; place-items: center; border: 1px solid rgba(104,211,145,.3); border-radius: 50%; background: rgba(104,211,145,.08); color: var(--green); font: 800 11px var(--font-heading); }
.builder-step legend strong, .builder-step legend small { display: block; }
.builder-step legend strong { font-size: 15px; }
.builder-step legend small { margin-top: 3px; color: var(--muted); font-size: 11px; font-weight: 400; }
.choice-grid { display: grid; gap: 9px; }
.choice-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.choice-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.choice-card, .format-card { position: relative; min-width: 0; border: 1px solid var(--line); border-radius: 6px; background: #0b0f0c; color: var(--text); transition: border-color .18s, background .18s, transform .18s, box-shadow .18s; }
.choice-card:hover, .format-card:hover { border-color: var(--line-strong); background: #101612; transform: translateY(-1px); }
.choice-card.selected, .format-card.selected { border-color: rgba(104,211,145,.55); background: #101a14; box-shadow: inset 0 0 0 1px rgba(104,211,145,.08), 0 8px 28px rgba(0,0,0,.14); }
.choice-card.selected::after, .format-card.selected::after { content: '✓'; position: absolute; top: 9px; right: 10px; width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: #07120b; font-size: 11px; font-weight: 900; }
.choice-card { min-height: 88px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 12px; padding: 14px; text-align: left; }
.choice-card strong, .choice-card small { display: block; }
.choice-card small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.choice-card i { position: absolute; top: 10px; right: 10px; color: var(--green); font-size: 8px; font-style: normal; font-weight: 800; text-transform: uppercase; }
.choice-card.selected i { display: none; }
.choice-icon { width: 34px; height: 34px; position: relative; display: block; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--green); }
.globe-icon::before { content: ''; position: absolute; inset: 7px 5px; border: 1.5px solid currentColor; border-radius: 50%; }
.globe-icon::after { content: ''; position: absolute; left: 7px; right: 7px; top: 16px; border-top: 1.5px solid currentColor; }
.player-icon::before { content: ''; position: absolute; top: 7px; left: 12px; width: 8px; height: 8px; border: 1.5px solid currentColor; border-radius: 50%; }
.player-icon::after { content: ''; position: absolute; left: 7px; bottom: 6px; width: 18px; height: 9px; border: 1.5px solid currentColor; border-radius: 10px 10px 5px 5px; }
.player-picker { margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--line); }
.player-picker[hidden] { display: none; }
.player-picker label { display: block; margin-bottom: 7px; color: var(--text-soft); font-size: 11px; font-weight: 700; }
.player-combobox { position: relative; }
.player-search-results { position: absolute; z-index: 20; top: calc(100% + 6px); left: 0; right: 0; max-height: 270px; overflow-y: auto; border: 1px solid var(--line-strong); border-radius: 6px; background: #101411; box-shadow: var(--shadow-lg); }
.player-search-option { width: 100%; min-height: 64px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 11px; border: 0; border-bottom: 1px solid var(--line); padding: 9px 12px; background: transparent; color: var(--text); text-align: left; }
.player-search-option[hidden] { display: none; }
.player-search-option:last-of-type { border-bottom: 0; }
.player-search-option:hover, .player-search-option.active { background: var(--surface-hover); }
.player-search-option .avatar { width: 38px; height: 38px; }
.player-search-option strong, .player-search-option small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.player-search-option small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.player-search-option b { color: var(--green); font-size: 11px; }
.player-search-empty { padding: 20px 14px; color: var(--muted); font-size: 12px; text-align: center; }
.format-card { min-height: 128px; display: flex; flex-direction: column; justify-content: flex-end; padding: 16px; cursor: pointer; }
.format-card input { position: absolute; opacity: 0; pointer-events: none; }
.format-card strong, .format-card small { display: block; }
.format-card small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.format-card i { position: absolute; top: 13px; left: 14px; color: var(--muted); font-size: 8px; font-style: normal; font-weight: 800; text-transform: uppercase; }
.format-racks { position: absolute; top: 35px; left: 14px; color: rgba(104,211,145,.22); font: 900 39px/1 var(--font-heading); }
.wager-presets { display: grid; grid-template-columns: repeat(4, minmax(66px, 1fr)) minmax(116px, 1.35fr); gap: 8px; }
.wager-chip, .custom-wager { min-height: 48px; border: 1px solid var(--line); border-radius: 6px; background: #0b0f0c; color: var(--text-soft); }
.wager-chip { font-weight: 750; }
.wager-chip:hover { border-color: var(--line-strong); color: var(--text); }
.wager-chip.selected { border-color: rgba(104,211,145,.55); background: rgba(104,211,145,.1); color: var(--green-bright); }
.wager-chip:disabled { opacity: .3; cursor: not-allowed; }
.custom-wager { display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: center; padding: 0 10px; }
.custom-wager span { color: var(--gold); font-weight: 800; }
.custom-wager input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--text); font-weight: 750; }
.wager-availability { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-top: 11px; color: var(--muted); font-size: 10px; }
.wager-availability strong { color: var(--text-soft); font-size: 10px; }
.availability-divider { width: 1px; height: 12px; margin: 0 4px; background: var(--line-strong); }
.match-ticket { position: sticky; top: 98px; overflow: hidden; border: 1px solid rgba(104,211,145,.24); border-radius: 7px; background: #0e1410; box-shadow: var(--shadow-lg); }
.ticket-top { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 18px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 10px; font-weight: 700; text-transform: uppercase; }
.ticket-top > div { display: flex; align-items: center; gap: 8px; color: var(--green); }
.ticket-versus { min-height: 104px; display: grid; grid-template-columns: minmax(0,1fr) 28px minmax(0,1fr); align-items: center; gap: 9px; padding: 18px; }
.ticket-versus > div { min-width: 0; display: flex; align-items: center; gap: 9px; }
.ticket-versus > div:last-child { flex-direction: row-reverse; text-align: right; }
.ticket-versus span { min-width: 0; }
.ticket-versus small, .ticket-versus strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ticket-versus small { color: var(--muted); font-size: 9px; }
.ticket-versus strong { max-width: 105px; margin-top: 2px; font-size: 11px; }
.ticket-versus > b { color: #546058; font-size: 10px; text-align: center; }
.ticket-anyone { border-style: dashed; background: transparent; color: var(--muted); }
.ticket-prize { padding: 24px 18px; border-block: 1px solid var(--line); background: rgba(104,211,145,.035); text-align: center; }
.ticket-prize span, .ticket-prize small { display: block; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.ticket-prize strong { display: block; margin: 6px 0 4px; color: var(--green-bright); font-size: 30px; }
.ticket-prize small { text-transform: none; }
.ticket-details { display: grid; grid-template-columns: repeat(3, 1fr); padding: 16px 18px; border-bottom: 1px solid var(--line); }
.ticket-details > div { text-align: center; border-right: 1px solid var(--line); }
.ticket-details > div:last-child { border: 0; }
.ticket-details span, .ticket-details strong { display: block; }
.ticket-details span { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.ticket-details strong { margin-top: 5px; font-size: 11px; }
.ticket-assurance { display: flex; align-items: flex-start; gap: 10px; margin: 16px 18px; color: var(--text-soft); }
.ticket-assurance strong, .ticket-assurance small { display: block; }
.ticket-assurance strong { font-size: 10px; }
.ticket-assurance small { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.shield-icon { width: 18px; height: 21px; flex: 0 0 18px; border: 1.5px solid var(--green); border-radius: 8px 8px 10px 10px; }
.challenge-submit { width: calc(100% - 36px); margin: 0 18px; }
.ticket-footnote { min-height: 43px; margin: 0; padding: 10px 18px; color: var(--muted); font-size: 9px; line-height: 1.45; text-align: center; }

.network-page { max-width: 1180px; }
.network-hero { min-height: 260px; display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: end; gap: 32px; position: relative; overflow: hidden; padding: 34px; border: 1px solid var(--line); border-radius: 8px; background: linear-gradient(100deg, #101713 0%, #101713 54%, rgba(16,23,19,.6) 100%), url('/pool/sprites/pool_table.png') calc(100% + 130px) 46%/58% auto no-repeat; box-shadow: var(--shadow-sm); }
.network-hero::after { content: ''; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--green); }
.network-hero > * { position: relative; z-index: 1; }
.network-hero h1 { margin: 8px 0 9px; font-size: clamp(34px, 5vw, 56px); line-height: 1; }
.network-hero p { max-width: 640px; margin: 0; color: var(--muted); line-height: 1.55; }
.network-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(152px, 1fr)); gap: 8px; margin-top: 24px; max-width: 780px; }
.network-actions .btn { text-decoration: none; }
.network-rank { display: grid; place-items: center; align-content: center; min-height: 166px; padding: 20px; border: 1px solid rgba(104,211,145,.3); background: rgba(7,12,9,.78); text-align: center; }
.network-rank span { color: var(--green); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.network-rank strong { display: block; margin: 9px 0 6px; color: var(--gold); font-size: 28px; }
.network-rank small { color: var(--muted); font-size: 9px; line-height: 1.4; }
.network-stats { margin-top: 14px; }
.tier-progress { display: grid; grid-template-columns: minmax(250px, .7fr) 1fr; align-items: center; gap: 28px; margin-top: 14px; padding: 18px 20px; border: 1px solid var(--line); background: var(--surface); }
.tier-progress strong, .tier-progress span { display: block; }
.tier-progress strong { font-size: 12px; }
.tier-progress span { margin-top: 4px; color: var(--muted); font-size: 10px; }
.network-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 38px; }
.network-levels { overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.network-level { min-height: 68px; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 13px; padding: 10px 15px; border-bottom: 1px solid var(--line); }
.network-level:last-child { border-bottom: 0; }
.network-level.locked { opacity: .42; }
.level-node { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--muted); font-weight: 800; }
.network-level.unlocked .level-node { border-color: rgba(104,211,145,.4); background: rgba(104,211,145,.08); color: var(--green); }
.network-level strong, .network-level small { display: block; }
.network-level small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.network-level > div:last-child { text-align: right; }
.club-rank { grid-template-columns: 35px minmax(0, 1fr) auto; }
.club-rank > strong:first-child { color: var(--gold); }
.positive-amount { color: var(--green); }
.network-disclosure { margin-top: 20px; padding: 15px 18px; border-left: 2px solid var(--gold); background: rgba(217,180,93,.05); color: #b9aa86; font-size: 10px; line-height: 1.55; }

.vault-page { --vault-metal: #c5ae6a; }
.vault-hero { position: relative; min-height: 430px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); align-items: center; gap: 48px; overflow: hidden; padding: clamp(34px, 6vw, 70px); border: 1px solid #30483a; border-radius: 8px; background: radial-gradient(circle at 78% 48%, rgba(104,211,145,.12), transparent 24%), linear-gradient(110deg, #0b100d 0%, #101b14 62%, #08100c 100%); box-shadow: inset 0 0 90px rgba(0,0,0,.55), var(--shadow-lg); }
.vault-hero::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent 49.8%, rgba(255,255,255,.025) 50%, transparent 50.2%); }
.vault-hero-copy, .vault-door { position: relative; z-index: 1; }
.vault-hero h1 { margin: 12px 0 16px; color: #fff; font-size: clamp(62px, 9vw, 118px); line-height: .82; }
.vault-hero p { max-width: 660px; margin: 0; color: #aebbb3; font-size: 16px; line-height: 1.7; }
.vault-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.vault-cta { min-height: 54px; padding-inline: 24px; box-shadow: 0 12px 34px rgba(104,211,145,.13); }
.vault-assurance { margin-top: 14px; color: #76857c; font-size: 10px; }
.vault-unavailable { max-width: 560px; display: grid; gap: 5px; margin-top: 18px; padding: 13px 15px; border-left: 2px solid var(--gold); background: rgba(217,180,93,.055); }
.vault-unavailable strong { color: #d6c58e; font-size: 12px; }
.vault-unavailable span { color: var(--muted); font-size: 10px; }
.vault-door { min-height: 285px; display: grid; place-items: center; align-content: center; gap: 22px; border: 1px solid rgba(197,174,106,.32); border-radius: 50%; background: repeating-conic-gradient(from 0deg, rgba(255,255,255,.025) 0 2deg, transparent 2deg 28deg), radial-gradient(circle, #1d2d23 0 25%, #0b120e 26% 48%, #415047 49% 50%, #111914 51% 69%, #222d26 70% 71%, #080d0a 72%); box-shadow: inset 0 0 0 13px #090e0b, inset 0 0 0 14px rgba(197,174,106,.23), 0 22px 65px rgba(0,0,0,.5); aspect-ratio: 1; }
.vault-ring { width: 102px; aspect-ratio: 1; display: grid; place-items: center; border: 2px solid var(--green); border-radius: 50%; background: #080b09; box-shadow: 0 0 34px rgba(104,211,145,.24); }
.vault-ring span { font-family: var(--font-heading); color: white; font-size: 48px; }
.vault-door small { color: var(--vault-metal); font-size: 8px; font-weight: 800; letter-spacing: 1.5px; }
.vault-overview { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); border-top: 0; background: #0b0f0c; }
.vault-metric { min-width: 0; padding: 19px 20px; border-right: 1px solid var(--line); }
.vault-metric:last-child { border: 0; }
.vault-metric span, .vault-metric strong, .vault-metric small { display: block; }
.vault-metric span { color: #708077; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.vault-metric strong { margin-top: 8px; font-size: 21px; }
.vault-metric small { margin-top: 5px; color: #5e6b63; font-size: 9px; }
.vault-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 34px; margin-top: 48px; }
.vault-prizes { overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.vault-prize-row { min-height: 68px; display: grid; grid-template-columns: 116px minmax(0,1fr) auto; align-items: center; gap: 16px; padding: 12px 17px; border-bottom: 1px solid var(--line); }
.vault-prize-row:last-child { border: 0; }
.vault-prize-row strong { font-size: 14px; }
.vault-prize-row small { color: var(--muted); font-size: 10px; }
.vault-tier { width: max-content; padding: 5px 8px; border: 1px solid var(--line-strong); border-radius: 3px; color: #b6c1ba; font-size: 9px; font-weight: 900; }
.vault-tier-epic, .vault-tier-jackpot { border-color: rgba(217,180,93,.45); color: #e1c878; }
.vault-disclosure { margin: 14px 0 0; color: #69766e; font-size: 10px; line-height: 1.6; }
.vault-record { display: grid; grid-template-columns: repeat(2, 1fr); border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.vault-record .vault-metric { border-bottom: 1px solid var(--line); }
.vault-record .vault-metric:nth-child(even) { border-right: 0; }
.vault-record .vault-metric:nth-last-child(-n+2) { border-bottom: 0; }
.vault-feed { overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.vault-feed-row { min-height: 66px; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.vault-feed-row:last-child { border: 0; }
.vault-feed-row strong, .vault-feed-row span { display: block; }
.vault-feed-row span { margin-top: 4px; color: var(--muted); font-size: 10px; }
.vault-feed-more { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
.vault-feed-more > span { color: var(--muted); font-size: 10px; }
.vault-rule-band { display: grid; grid-template-columns: repeat(4,1fr); margin-bottom: 40px; border: 1px solid var(--line); }
.vault-rule-band > div { padding: 18px; border-right: 1px solid var(--line); }
.vault-rule-band > div:last-child { border: 0; }
.vault-rule-band span, .vault-rule-band strong { display: block; }
.vault-rule-band span { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.vault-rule-band strong { margin-top: 7px; }
.vault-copy { max-width: 820px; }
.vault-copy h2 { margin: 38px 0 10px; }
.vault-copy p { color: var(--muted); line-height: 1.75; }
.vault-result { min-height: calc(100vh - 76px); display: grid; place-items: center; }
.vault-result-panel { width: min(720px, 100%); padding: clamp(34px,7vw,76px); border: 1px solid var(--line-strong); border-top: 3px solid var(--gold); border-radius: 8px; background: radial-gradient(circle at 50% 30%, rgba(217,180,93,.08), transparent 34%), var(--surface); text-align: center; box-shadow: var(--shadow-lg); }
.vault-result-panel.won { border-top-color: var(--green); background: radial-gradient(circle at 50% 30%, rgba(104,211,145,.09), transparent 34%), var(--surface); }
.vault-result-seal { width: 82px; height: 82px; display: grid; place-items: center; margin: 0 auto 25px; border: 1px solid var(--green); border-radius: 50%; font-family: var(--font-heading); font-size: 30px; box-shadow: 0 0 35px rgba(104,211,145,.13); }
.vault-result-panel h1 { margin: 12px 0; font-size: clamp(42px,7vw,72px); }
.vault-result-panel > p { color: var(--muted); line-height: 1.6; }
.vault-result-panel > small { display: block; margin-top: 26px; color: #5f6a64; }
.vault-result-summary { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 28px; border: 1px solid var(--line); }
.vault-result-summary div { padding: 14px; border-right: 1px solid var(--line); }
.vault-result-summary div:last-child { border: 0; }
.vault-result-summary span, .vault-result-summary strong { display: block; }
.vault-result-summary span { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.vault-result-summary strong { margin-top: 7px; }
.vault-admin-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 32px; }
.vault-simulation-output { display: grid; grid-template-columns: repeat(2,1fr); border: 1px solid var(--line); }

@media (max-width: 900px) {
  .vault-hero { grid-template-columns: 1fr; min-height: 0; padding: 38px 24px; }
  .vault-door { width: min(290px, 82vw); min-height: 0; margin: 0 auto; }
  .vault-overview { grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); margin-top: 12px; }
  .vault-overview .vault-metric:nth-child(even) { border-right: 0; }
  .vault-overview .vault-metric { border-bottom: 1px solid var(--line); }
  .vault-grid, .vault-admin-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .vault-hero h1 { font-size: 58px; }
  .vault-actions, .vault-actions .btn { width: 100%; }
  .vault-door { width: 220px; }
  .vault-prize-row { grid-template-columns: 88px 1fr; }
  .vault-prize-row small { grid-column: 2; }
  .vault-rule-band, .vault-result-summary { grid-template-columns: repeat(2,1fr); }
  .vault-result-summary div { border-bottom: 1px solid var(--line); }
  .vault-result-summary div:last-child { grid-column: 1 / -1; border-bottom: 0; }
}

.shared-challenge { min-height: 100vh; background: radial-gradient(circle at 50% 42%, rgba(104,211,145,.07), transparent 32%), #070908; }
.shared-challenge > header { height: 78px; display: flex; align-items: center; width: min(1060px, calc(100% - 40px)); margin: 0 auto; border-bottom: 1px solid var(--line); }
.shared-challenge > main { width: min(680px, calc(100% - 30px)); margin: 0 auto; padding: 64px 0 88px; text-align: center; }
.shared-challenge h1 { margin: 12px auto 13px; max-width: 650px; font-size: clamp(38px, 6vw, 66px); line-height: .98; }
.shared-challenge main > p { max-width: 540px; margin: 0 auto; color: var(--muted); font-size: 16px; line-height: 1.6; }
.share-matchup { display: grid; grid-template-columns: 1fr 52px 1fr; align-items: center; gap: 18px; margin: 38px 0 20px; padding: 28px; border: 1px solid var(--line); background: var(--surface); }
.share-matchup > div { min-width: 0; display: grid; justify-items: center; gap: 8px; }
.share-matchup small { color: var(--muted); font-size: 10px; }
.share-matchup > b { color: var(--gold); font-size: 14px; }
.share-seat { border-style: dashed; background: transparent; color: var(--muted); }
.shared-details { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 16px; border: 1px solid var(--line); background: #0b0f0c; }
.shared-details > div { padding: 16px 10px; border-right: 1px solid var(--line); }
.shared-details > div:last-child { border: 0; }
.shared-details span, .shared-details strong { display: block; }
.shared-details span { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.shared-details strong { margin-top: 6px; font-size: 13px; }
.shared-challenge main > .btn { margin-top: 9px; }
.share-notice { margin: 15px 0 4px; color: var(--muted); font-size: 11px; }
.shared-disclosure { display: block; max-width: 560px; margin: 20px auto 0; color: #68736c; font-size: 9px; line-height: 1.55; }
.shared-challenge-shell { padding-top: 0; }
.shared-challenge-shell .shared-challenge { min-height: 0; background: transparent; }
.shared-challenge-shell .shared-challenge > header { display: none; }
.shared-challenge-shell .shared-challenge > main { padding-top: 24px; }

.club-invite-page { min-height: 100dvh; position: relative; overflow: hidden; background: #07100b url('/app-assets/assets/brand/bigpool-clubhouse-bg-v1.webp') center/cover no-repeat; }
.club-invite-page::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,7,5,.98) 0%, rgba(4,7,5,.91) 44%, rgba(4,7,5,.48) 75%), linear-gradient(0deg, rgba(4,7,5,.97), transparent 45%); }
.club-invite-page > header { width: min(1180px, calc(100% - 48px)); height: 78px; position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; margin: 0 auto; border-bottom: 1px solid rgba(255,255,255,.1); }
.club-invite-login { color: var(--muted); font-size: 12px; }
.club-invite-login strong { margin-left: 4px; color: var(--green); }
.club-invite-page > main { width: min(1180px, calc(100% - 48px)); min-height: calc(100dvh - 78px); position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 58px 0 72px; }
.club-invite-eyebrow { color: var(--green); font-family: var(--font-heading); font-size: 10px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
.club-invite-owner { display: flex; align-items: center; gap: 11px; margin-top: 18px; }
.club-invite-owner .avatar { width: 44px; height: 44px; }
.club-invite-owner strong, .club-invite-owner small { display: block; }
.club-invite-owner small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.club-invite-page h1 { max-width: 850px; margin: 24px 0 17px; font-family: BigPoolDisplay, var(--font-heading); font-size: clamp(58px, 9vw, 112px); line-height: .82; text-transform: uppercase; }
.club-invite-page h1 span { color: var(--green); overflow-wrap: anywhere; }
.club-invite-page main > p { max-width: 600px; margin: 0; color: var(--text-soft); font-size: 17px; line-height: 1.6; }
.club-invite-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; }
.club-invite-proof { width: min(680px, 100%); display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 48px; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); }
.club-invite-proof > div { padding: 18px 18px 18px 0; border-right: 1px solid var(--line); }
.club-invite-proof > div:not(:first-child) { padding-left: 18px; }
.club-invite-proof > div:last-child { border-right: 0; }
.club-invite-proof strong, .club-invite-proof span { display: block; }
.club-invite-proof strong { font-size: 22px; }
.club-invite-proof span { margin-top: 4px; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.club-invite-disclosure { max-width: 680px; margin-top: 17px; color: #6f7a74; font-size: 9px; line-height: 1.55; }

.stat-card { position: relative; overflow: hidden; padding: 20px; }
.stat-card::after { content: ''; position: absolute; top: 0; right: 0; width: 38px; height: 1px; background: var(--green); opacity: .6; }
.stat-card span { color: var(--muted); font-size: 10px; font-weight: 600; text-transform: uppercase; }
.stat-card strong { display: block; margin-top: 10px; font-size: 27px; }
.status { min-height: 23px; display: inline-flex; align-items: center; border: 1px solid transparent; border-radius: 12px; padding: 0 8px; background: var(--surface-hover); color: var(--muted); font-size: 10px; font-weight: 700; text-transform: capitalize; white-space: nowrap; }
.status-open, .status-registration { border-color: rgba(104,211,145,.16); background: rgba(104,211,145,.08); color: var(--green-bright); }
.status-live, .status-in_progress { border-color: rgba(240,125,115,.15); background: rgba(240,125,115,.07); color: #f5a49d; }
.status-completed { border-color: rgba(118,175,224,.15); background: rgba(118,175,224,.07); color: #a8cff0; }

.list { border: 1px solid var(--line); border-radius: 7px; overflow: hidden; background: var(--surface); box-shadow: var(--shadow-sm); }
.list-row { min-height: 68px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 12px 17px; background: transparent; border-bottom: 1px solid var(--line); transition: background .16s; }
.list-row:hover { background: rgba(255,255,255,.018); }
.list-row:last-child { border-bottom: 0; }
.notification-row { width: 100%; border-width: 0 0 1px; color: var(--text); text-align: left; }
.clubhouse-chat .section-heading h2 { margin-top: 4px; }
.chat-panel { min-width: 0; max-width: 100%; overflow: hidden; }
.chat-feed { width: 100%; max-width: 100%; height: 440px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y; padding: 8px 18px; scrollbar-color: #354139 transparent; }
.chat-message { width: 100%; max-width: 100%; min-height: 72px; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 11px; overflow: hidden; padding: 13px 0; border-bottom: 1px solid var(--line); }
.chat-message:last-child { border-bottom: 0; }
.chat-message .avatar { width: 34px; height: 34px; }
.chat-message-body { min-width: 0; }
.chat-message-head { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.chat-message-head time, .dm-message time { min-width: 0; max-width: 112px; overflow: hidden; color: #66716b; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.chat-message p { margin: 6px 0 0; color: var(--text-soft); line-height: 1.5; overflow-wrap: anywhere; }
.chat-user { min-width: 0; max-width: 100%; position: relative; display: inline-flex; align-items: center; gap: 6px; font-weight: 800; }
.chat-user > a { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-user::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #435048; }
.chat-user.is-online::before { background: var(--green); box-shadow: 0 0 8px rgba(104,211,145,.6); }
.chat-user-actions { position: absolute; z-index: 4; top: calc(100% + 7px); left: 0; min-width: 220px; display: none; grid-template-columns: repeat(3, 1fr); overflow: hidden; border: 1px solid var(--line-strong); border-radius: 6px; background: #171d19; box-shadow: var(--shadow-lg); }
.chat-user:hover .chat-user-actions, .chat-user:focus-within .chat-user-actions { display: grid; }
.chat-user-actions a, .chat-user-actions button { min-height: 34px; display: grid; place-items: center; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--text-soft); font-size: 10px; font-weight: 700; }
.chat-user-actions :last-child { border-right: 0; }
.chat-user-actions a:hover, .chat-user-actions button:hover { background: var(--surface-hover); color: var(--green-bright); }
.chat-event { width: 100%; max-width: 100%; min-height: 70px; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 12px; overflow: hidden; margin: 10px 0; padding: 13px; border: 1px solid rgba(104,211,145,.13); border-left: 2px solid var(--green); border-radius: 6px; background: rgba(104,211,145,.035); }
.chat-event > div { min-width: 0; }
.chat-event > .avatar { width: 36px; height: 36px; }
.chat-event-title { min-width: 0; color: var(--text-soft); font-size: 13px; overflow-wrap: anywhere; }
.chat-event-meta { min-width: 0; margin-top: 5px; color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }
.chat-composer { min-height: 72px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 12px 14px; border-top: 1px solid var(--line); background: #0c100e; }
.chat-composer .input { min-height: 44px; }
.chat-empty { min-height: 150px; display: grid; place-items: center; color: var(--muted); text-align: center; }
.chat-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); gap: 28px; }
.conversation-list { overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.conversation-row { min-height: 76px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px 15px; border-bottom: 1px solid var(--line); }
.conversation-row:last-child { border-bottom: 0; }
.conversation-row:hover { background: rgba(255,255,255,.018); }
.conversation-row .player-name span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conversation-row > b { min-width: 22px; height: 22px; display: grid; place-items: center; border-radius: 11px; background: var(--green); color: #07120b; font-size: 10px; }
.conversation-unread { background: rgba(104,211,145,.035); }
.chat-directory-row { width: 100%; grid-template-columns: 34px minmax(0, 1fr) auto; border: 0; border-bottom: 1px solid var(--line); color: var(--text); text-align: left; }
.chat-directory-row:last-child { border-bottom: 0; }
.chat-directory-row .avatar { width: 34px; height: 34px; }
.chat-directory-row span { display: grid; gap: 3px; }
.chat-directory-row small { color: var(--muted); }
.chat-directory-row > b { color: var(--green); font-size: 10px; }
.dm-page { max-width: 980px; margin: 0 auto; }
.dm-header { display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; align-items: center; gap: 14px; margin-bottom: 20px; }
.dm-header h1 { margin: 0 0 4px; font-size: 24px; }
.dm-header span { color: var(--muted); font-size: 12px; }
.dm-shell { min-width: 0; max-width: 100%; overflow: hidden; }
.dm-thread { width: 100%; max-width: 100%; height: min(62vh, 650px); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y; display: grid; align-content: end; gap: 9px; padding: 24px; }
.dm-message { min-width: 0; max-width: 100%; display: flex; justify-content: flex-start; }
.dm-message > div { min-width: 0; max-width: min(72%, 560px); overflow: hidden; padding: 11px 13px 8px; border: 1px solid var(--line); border-radius: 7px 7px 7px 2px; background: var(--surface-raised); }
.dm-message p { margin: 0; color: var(--text-soft); line-height: 1.5; overflow-wrap: anywhere; }
.dm-message time { display: block; margin-top: 5px; }
.dm-own { justify-content: flex-end; }
.dm-own > div { border-color: rgba(104,211,145,.18); border-radius: 7px 7px 2px 7px; background: rgba(104,211,145,.09); }
.leaderboard-row { grid-template-columns: 40px minmax(0, 1fr) 90px 80px; }
.rank-number { color: var(--gold); font: 800 13px var(--font-heading); }
.leaderboard-player { gap: 10px; }
.player-tier-badge { width: 27px; height: 27px; flex: 0 0 27px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; background: rgba(255,255,255,.025); box-shadow: inset 0 0 10px rgba(255,255,255,.025); }
.player-tier-badge::before { content: ''; width: 15px; height: 15px; background: currentColor; -webkit-mask: url('/app-assets/assets/icons/medal.svg') center / contain no-repeat; mask: url('/app-assets/assets/icons/medal.svg') center / contain no-repeat; }
.player-tier-badge.tier-diamond { color: #8ee9f3; border-color: rgba(142,233,243,.42); background: rgba(77,188,207,.09); box-shadow: inset 0 0 11px rgba(109,224,239,.08), 0 0 10px rgba(109,224,239,.05); }
.player-tier-badge.tier-diamond::before { -webkit-mask-image: url('/app-assets/assets/icons/gem.svg'); mask-image: url('/app-assets/assets/icons/gem.svg'); }
.player-tier-badge.tier-gold { color: #e4bd58; border-color: rgba(228,189,88,.4); background: rgba(228,189,88,.08); }
.player-tier-badge.tier-silver { color: #bac5c1; border-color: rgba(186,197,193,.32); background: rgba(186,197,193,.055); }
.empty { min-height: 190px; display: grid; place-items: center; text-align: center; border: 1px dashed var(--line-strong); border-radius: 7px; color: var(--muted); padding: 28px; background: rgba(255,255,255,.012); }
.empty strong { display: block; margin-bottom: 7px; color: var(--text); font-size: 15px; }
.skeleton { height: 120px; border-radius: 7px; background: linear-gradient(90deg, var(--surface) 25%, var(--surface-raised) 50%, var(--surface) 75%); background-size: 200% 100%; animation: shimmer 1.2s infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }

.match-stage { min-height: calc(100vh - 155px); display: grid; place-items: center; text-align: center; }
.versus { width: min(790px, 100%); padding: 34px; border: 1px solid var(--line); border-radius: 8px; background: radial-gradient(circle at 50% 30%, rgba(104,211,145,.07), transparent 38%), var(--surface); box-shadow: var(--shadow-lg); }
.versus > h1 { margin: 12px 0 0; font-size: 40px; }
.versus-players { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 28px; margin: 36px 0; }
.versus-player { display: grid; justify-items: center; gap: 9px; }
.series-score { min-width: 38px; color: var(--gold); font: 800 25px var(--font-heading); }
.versus-mark { color: var(--gold); font: 900 22px BigPoolDisplay; }
.match-chat-trigger { position: relative; display: inline-flex; align-items: center; gap: 8px; }
.match-chat-icon { width: 17px; height: 17px; flex: 0 0 17px; background: currentColor; -webkit-mask: url('/app-assets/assets/icons/message-circle.svg') center / contain no-repeat; mask: url('/app-assets/assets/icons/message-circle.svg') center / contain no-repeat; }
.match-chat-badge { min-width: 18px; height: 18px; display: inline-grid; place-items: center; margin-left: -3px; border-radius: 50%; background: var(--green); color: #051009; font-size: 9px; font-weight: 900; }
.match-chat-badge[hidden], .match-chat-panel[hidden] { display: none; }
.match-chat-panel { position: fixed; z-index: 58; top: 88px; right: 24px; bottom: 24px; width: min(380px, calc(100vw - 48px)); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 8px; background: #0b100d; box-shadow: 0 24px 70px rgba(0,0,0,.55); text-align: left; }
.match-chat-panel > header { min-height: 68px; display: grid; grid-template-columns: 38px minmax(0, 1fr) 38px; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line); background: #0d1410; }
.match-chat-panel > header .avatar { width: 38px; height: 38px; }
.match-chat-panel > header > div { min-width: 0; display: grid; gap: 2px; }
.match-chat-panel > header strong, .match-chat-panel > header span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.match-chat-panel > header span { color: var(--muted); font-size: 10px; }
.match-chat-panel .icon-button { width: 36px; height: 36px; padding: 0; font-size: 22px; line-height: 1; }
.match-chat-thread { min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y; display: grid; align-content: end; gap: 8px; padding: 14px; }
.match-chat-thread .dm-message > div { max-width: 86%; }
.match-chat-loading { align-self: center; color: var(--muted); font-size: 11px; text-align: center; }
.match-chat-composer { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding: 12px; border-top: 1px solid var(--line); background: #0d1410; }
.match-chat-composer .input { min-width: 0; min-height: 44px; }
.match-chat-composer .btn { min-width: 68px; padding-inline: 14px; }
.match-chat-composer [data-form-error] { grid-column: 1 / -1; }
.result-brand { width: 86px; height: 86px; margin: 0 auto 16px; object-fit: contain; filter: drop-shadow(0 12px 28px rgba(0, 255, 159, .14)); }
.match-details { display: flex; justify-content: center; flex-wrap: wrap; gap: 9px 25px; color: var(--muted); font-size: 12px; }

.matchmaking-page { min-height: calc(100vh - 96px); display: grid; place-items: center; }
.matchmaking-stage { width: min(760px, 100%); padding: 54px 32px; text-align: center; }
.matchmaking-kicker { color: var(--green); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.matchmaking-stage h1 { margin: 28px 0 10px; font-size: 46px; }
.matchmaking-stage > p { max-width: 500px; min-height: 24px; margin: 0 auto 24px; color: var(--muted); line-height: 1.6; }
.matchmaking-orbit { display: grid; grid-template-columns: 112px minmax(150px, 240px) 112px; align-items: center; justify-content: center; gap: 20px; margin: 46px auto 18px; }
.matchmaking-avatar { width: 112px; height: 112px; display: grid; place-items: center; border: 1px solid rgba(104,211,145,.36); border-radius: 50%; background: #101713; box-shadow: 0 0 42px rgba(104,211,145,.08); }
.matchmaking-avatar .avatar { width: 92px; height: 92px; font-size: 24px; }
.matchmaking-opponent { border-style: dashed; color: var(--muted); font: 800 38px var(--font-heading); animation: opponentGlow 2.2s ease-in-out infinite; }
.matchmaking-search { position: relative; height: 70px; display: grid; place-items: center; overflow: hidden; }
.matchmaking-search::before { content: ''; width: 100%; height: 1px; background: linear-gradient(90deg, transparent, var(--green), transparent); }
.matchmaking-search span { position: absolute; width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; background: #0a0f0c; color: var(--gold); font: 900 12px var(--font-heading); }
.matchmaking-search i { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 14px var(--green); animation: matchmakingTravel 2.1s linear infinite; }
.matchmaking-search i:nth-child(2) { animation-delay: -.7s; }
.matchmaking-search i:nth-child(3) { animation-delay: -1.4s; }
.matchmaking-status { width: min(340px, 100%); min-height: 50px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; margin: 0 auto 22px; padding: 0 16px; border: 1px solid var(--line); background: rgba(255,255,255,.018); text-align: left; }
.matchmaking-status b { font-size: 11px; }
.matchmaking-status time { color: var(--muted); font-variant-numeric: tabular-nums; font-size: 11px; }
.matchmaking-pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 0 rgba(104,211,145,.38); animation: matchmakingPulse 1.7s infinite; }
.room-live-list { overflow: hidden; }
.room-live-list > header { padding: 18px; border-bottom: 1px solid var(--line); }
.room-live-list h3 { margin: 4px 0 0; }
.room-live-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.room-live-row:last-child { border-bottom: 0; }
.room-live-row.is-featured { background: rgba(104,211,145,.055); }
.room-live-row div { min-width: 0; display: grid; gap: 3px; }
.room-live-row small { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
[data-room-voice].is-live { border-color: var(--green); color: var(--green); box-shadow: 0 0 18px rgba(104,211,145,.12); }
@keyframes matchmakingTravel { from { transform: translateX(-115px); opacity: 0; } 15%, 85% { opacity: 1; } to { transform: translateX(115px); opacity: 0; } }
@keyframes matchmakingPulse { 70% { box-shadow: 0 0 0 9px rgba(104,211,145,0); } 100% { box-shadow: 0 0 0 0 rgba(104,211,145,0); } }
@keyframes opponentGlow { 50% { border-color: rgba(104,211,145,.6); box-shadow: 0 0 42px rgba(104,211,145,.15); } }

.tournament-page { display: grid; gap: 28px; }
.tournament-hero { min-height: 250px; display: grid; grid-template-columns: minmax(0, 1fr) 220px; align-items: end; gap: 36px; padding: 38px; border: 1px solid var(--line); background: linear-gradient(90deg, rgba(8,13,10,.97) 0%, rgba(8,13,10,.82) 44%, rgba(8,13,10,.2) 100%), url('/pool/sprites/pool_table.png') right 35%/58% auto no-repeat, #0b100d; }
.tournament-hero h1 { max-width: 680px; margin: 10px 0; font-size: 44px; line-height: 1.02; }
.tournament-hero p { max-width: 560px; margin: 0; color: var(--muted); }
.tournament-hero-stat { display: grid; gap: 5px; padding: 20px; border-left: 2px solid var(--green); background: rgba(7,11,8,.76); }
.tournament-hero-stat span, .tournament-hero-stat small { color: var(--muted); font-size: 11px; }
.tournament-hero-stat strong { font-size: 38px; }
.tournament-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.tournament-toolbar .filters { margin: 0; }
.tournament-grid { align-items: stretch; }
.tournament-card { height: 100%; display: flex; overflow: hidden; flex-direction: column; transition: transform .18s, border-color .18s; }
.tournament-card:hover { transform: translateY(-2px); border-color: var(--line-strong); }
.tournament-card .card-body { height: auto; display: flex; flex: 1; flex-direction: column; }
.tournament-card .card-body > .btn { margin-top: auto; }
.tournament-art { height: auto; aspect-ratio: 16 / 10; position: relative; display: flex; flex: 0 0 auto; align-items: flex-end; justify-content: space-between; overflow: hidden; padding: 14px; background: #050806 url('/pool/sprites/pool_table.png') center 39%/92% auto no-repeat; border-bottom: 1px solid var(--line); }
.tournament-art > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #050806; transition: filter .2s ease; }
.tournament-card:hover .tournament-art > img { filter: brightness(1.04); }
.tournament-art-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(5,9,7,.9), rgba(5,9,7,.03) 72%); }
.tournament-art span, .tournament-art b { position: relative; z-index: 1; padding: 6px 8px; background: rgba(7,12,9,.84); color: var(--muted); font-size: 9px; text-transform: uppercase; }
.tournament-art b { color: var(--green-bright); }
.tournament-card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tournament-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 16px 0 13px; }
.tournament-facts div { min-width: 0; display: grid; gap: 4px; padding: 9px; border-left: 1px solid var(--line); }
.tournament-facts span { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.tournament-facts strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.tournament-card .progress { margin-bottom: 18px; }
.tournament-detail-cover { min-height: clamp(300px, 31vw, 420px); position: relative; display: flex; align-items: flex-end; overflow: hidden; border: 1px solid var(--line); background: #0b100d url('/pool/sprites/pool_table.png') center 40%/cover no-repeat; }
.tournament-detail-cover > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tournament-cover-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,9,7,.96), rgba(5,9,7,.68) 52%, rgba(5,9,7,.2)), linear-gradient(0deg, rgba(5,9,7,.82), transparent 62%); }
.tournament-cover-content { position: relative; z-index: 1; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 28px; padding: 34px; }
.tournament-cover-content h1 { max-width: 720px; margin: 8px 0; font-size: 42px; }
.tournament-cover-content p { max-width: 620px; margin: 0; color: #bac5be; }
.tournament-cover-content .quick-actions { justify-content: flex-end; }
.tournament-stat-grid { margin-top: 18px; }
.tournament-date { font-size: 14px !important; }
.tournament-artwork-fields { display: grid; gap: 12px; margin: 0; padding: 14px; border: 1px solid var(--line); }
.tournament-artwork-fields legend { padding: 0 7px; color: var(--text); font-size: 11px; font-weight: 800; }
.tournament-image-picker { display: grid; grid-template-columns: 146px minmax(0, 1fr); align-items: center; gap: 14px; }
.tournament-image-picker > div:last-child { min-width: 0; }
.tournament-image-picker strong, .tournament-image-picker p { display: block; }
.tournament-image-picker p { margin: 4px 0 9px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.tournament-image-picker input[type="file"] { display: none; }
.tournament-image-preview { width: 146px; display: grid; place-items: center; overflow: hidden; border: 1px dashed var(--line-strong); background: #08100b url('/pool/sprites/pool_table.png') center/cover no-repeat; color: var(--green); font: 800 12px var(--font-heading); }
.tournament-image-card .tournament-image-preview { aspect-ratio: 16 / 10; }
.tournament-image-cover .tournament-image-preview { aspect-ratio: 3 / 1; }
.tournament-image-preview img { width: 100%; height: 100%; object-fit: cover; }
.tournament-image-card .tournament-image-preview img { object-fit: contain; background: #050806; }
.tournament-player-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.tournament-player { min-width: 0; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 11px; border: 1px solid var(--line); background: var(--surface); }
.tournament-player .avatar { width: 38px; height: 38px; }
.tournament-player > div { min-width: 0; display: grid; gap: 3px; }
.tournament-player strong, .tournament-player span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tournament-player span { color: var(--muted); font-size: 10px; }
.tournament-player > b { color: var(--muted); font-size: 11px; }
.tournament-player.is-eliminated { opacity: .52; }
.roster-overflow { margin: 14px 0 0; color: var(--muted); font-size: 11px; }
.prize-plan { padding: 24px; border: 1px solid var(--line); background: rgba(255,255,255,.012); }
.prize-tiers { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); }
.prize-tier { min-height: 72px; display: grid; align-content: center; gap: 5px; padding: 14px; border-right: 1px solid var(--line); }
.prize-tier:last-child { border-right: 0; }
.prize-tier span { color: var(--muted); font-size: 10px; text-transform: uppercase; }
.prize-tier strong { color: var(--green); font-size: 20px; }
.tournament-champion { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-top: 12px; padding: 14px; border: 1px solid rgba(217,180,93,.28); background: rgba(217,180,93,.055); }
.tournament-champion .avatar { width: 48px; height: 48px; }
.tournament-champion span, .tournament-champion strong { display: block; }
.tournament-champion span { color: var(--gold); font-size: 9px; text-transform: uppercase; }
.tournament-champion b { color: var(--gold); }
.payout-list { margin-top: 10px; border-top: 1px solid var(--line); }
.payout-list > div { display: flex; justify-content: space-between; gap: 20px; padding: 10px 2px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 11px; }
.payout-list strong { color: var(--text); }
.bracket-awaiting { min-height: 86px; display: grid; place-items: center; padding: 12px; border: 1px dashed var(--line-strong); color: var(--muted); font-size: 11px; text-align: center; }
.tournament-payout-fields { margin: 0; padding: 15px; border: 1px solid var(--line); }
.tournament-payout-fields legend { padding: 0 7px; color: var(--text); font-size: 11px; font-weight: 800; }
.tournament-form .field small { margin-top: 5px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.progress { height: 4px; overflow: hidden; border-radius: 2px; background: var(--surface-hover); }
.progress span { display: block; height: 100%; background: var(--green); }
.bracket { display: flex; gap: 18px; overflow-x: auto; padding: 12px 2px 26px; }
.bracket-round { flex: 0 0 230px; display: grid; align-content: center; gap: 13px; }
.bracket-round h3 { color: var(--muted); font-size: 10px; letter-spacing: 1px; text-transform: uppercase; }
.bracket-match { border: 1px solid var(--line); border-radius: 6px; background: var(--surface); overflow: hidden; }
.bracket-current { border-color: rgba(104,211,145,.48); box-shadow: 0 0 0 1px rgba(104,211,145,.1); }
.bracket-player { display: flex; justify-content: space-between; padding: 11px; border-bottom: 1px solid var(--line); font-size: 12px; }
.bracket-player:last-child { border-bottom: 0; }

.wallet-balance { position: relative; overflow: hidden; padding: 32px; border-bottom: 1px solid var(--line); }
.wallet-balance::after { content: '8'; position: absolute; right: 35px; top: -30px; color: rgba(104,211,145,.045); font: 900 180px BigPoolDisplay; }
.wallet-balance > span { color: var(--muted); font-size: 11px; text-transform: uppercase; }
.wallet-balance > strong { position: relative; z-index: 1; display: block; margin: 8px 0 21px; font-size: clamp(42px, 6vw, 66px); }
.wallet-breakdown { position: relative; z-index: 1; display: flex; gap: 34px; }
.wallet-breakdown div span { display: block; color: var(--muted); font-size: 10px; }
.wallet-breakdown div strong { font-size: 15px; }
.wallet-asset-grid { align-items: stretch; }
.wallet-asset-grid > .card { display: grid; grid-template-rows: 1fr auto; }
.pool-wallet-card { border-color: rgba(104,211,145,.3); background: linear-gradient(145deg, rgba(104,211,145,.045), var(--surface) 48%); }
.pool-wallet-card .wallet-balance::after { content: '$P'; right: 20px; top: 8px; font-size: 96px; }
.asset-switch { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-bottom: 12px; padding: 5px; border: 1px solid var(--line); border-radius: 7px; background: #090d0a; }
.asset-switch label { min-width: 0; }
.asset-switch input { position: absolute; opacity: 0; pointer-events: none; }
.asset-switch span { min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid transparent; border-radius: 5px; color: var(--muted); font-size: 12px; font-weight: 800; cursor: pointer; }
.asset-switch span small { color: var(--green); font-size: 8px; text-transform: uppercase; }
.asset-switch input:checked + span { border-color: rgba(104,211,145,.42); background: rgba(104,211,145,.09); color: var(--text); }
.asset-switch .is-disabled { opacity: .4; }
.asset-switch .is-disabled span { cursor: not-allowed; }
.custom-token-wager { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 12px; }
.custom-token-wager > span { color: var(--text-soft); font-size: 11px; font-weight: 800; white-space: nowrap; }
.wager-availability { display: flex; align-items: center; gap: 9px; margin-top: 12px; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.wager-availability strong { color: var(--text); font-size: 10px; }
.availability-divider { width: 1px; height: 15px; background: var(--line-strong); }
.pool-deposit-route { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 12px; padding: 14px; border: 1px solid rgba(104,211,145,.28); border-radius: 6px; background: rgba(104,211,145,.045); }
.pool-deposit-route > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: #07110b; font-weight: 900; }
.pool-deposit-route strong, .pool-deposit-route small { display: block; }
.pool-deposit-route small { margin-top: 4px; color: var(--muted); line-height: 1.45; }
.admin-user-row, .admin-withdrawal { min-height: 76px; }
.demo-notice { padding: 13px 15px; border: 1px solid rgba(217,180,93,.22); background: rgba(217,180,93,.055); color: #dfcc9f; border-radius: 6px; font-size: 12px; line-height: 1.5; }

.profile-hero { display: flex; align-items: center; gap: 21px; padding: 27px; background: linear-gradient(110deg, #131814, #0f1310); }
.profile-actions { margin-left: auto; display: flex; gap: 8px; }
.settings-grid { display: grid; grid-template-columns: 200px minmax(0, 680px); gap: 30px; }
.settings-menu { display: grid; align-content: start; gap: 4px; }
.settings-tab { min-height: 42px; display: flex; align-items: center; border-left: 2px solid transparent; padding: 0 14px; color: var(--muted); font-size: 13px; font-weight: 700; transition: background .18s, border-color .18s, color .18s; }
.settings-tab:hover { background: rgba(255,255,255,.025); color: var(--text); }
.settings-tab.active { border-left-color: var(--green); background: var(--surface-raised); color: var(--text); }
.settings-panel { min-height: 420px; }
.settings-panel-heading { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 26px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.settings-panel-heading h2 { margin: 6px 0 5px; font-size: 24px; }
.settings-panel-heading p { margin: 0; color: var(--muted); line-height: 1.55; }
.settings-rows { margin-bottom: 24px; border-top: 1px solid var(--line); }
.settings-account-action { margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--line); }
.privacy-list { margin-bottom: 26px; border-top: 1px solid var(--line); }
.privacy-row { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); }
.privacy-row strong, .privacy-row span { display: block; }
.privacy-row span { max-width: 480px; margin-top: 5px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.privacy-row b { color: var(--green); font-size: 11px; text-transform: uppercase; }
.responsible-note { padding: 14px 16px; border-left: 2px solid var(--gold); background: rgba(217,180,93,.055); color: #cbbb92; font-size: 12px; line-height: 1.55; }
.mobile-profile-account { display: none; }
.toggle-row { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); }
.toggle { width: 42px; height: 23px; padding: 2px; border: 0; border-radius: 12px; background: #242b27; }
.toggle::after { content: ''; display: block; width: 19px; height: 19px; border-radius: 50%; background: #77817b; transition: .2s; }
.toggle.on { background: var(--green-deep); }
.toggle.on::after { transform: translateX(19px); background: var(--green); }

.modal-backdrop { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(0,0,0,.78); backdrop-filter: blur(7px); }
.modal { width: min(500px, 100%); max-height: 88vh; overflow: auto; border: 1px solid var(--line-strong); border-radius: 8px; background: #111512; box-shadow: var(--shadow-lg); }
.modal:has(.room-builder-form) { width: min(650px, 100%); }
.modal-header, .modal-body, .modal-footer { padding: 20px; }
.modal-header { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.modal-header h2 { margin: 0; font-size: 18px; }
.modal-footer { display: flex; justify-content: flex-end; gap: 8px; border-top: 1px solid var(--line); }
.icon-button { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 6px; background: rgba(255,255,255,.025); color: var(--text-soft); }
.toast-root { position: fixed; z-index: 120; right: 20px; bottom: 20px; display: grid; gap: 8px; }
.toast { max-width: 370px; padding: 14px 16px; border: 1px solid var(--line-strong); border-left: 3px solid var(--green); border-radius: 6px; background: #151a17; box-shadow: var(--shadow-lg); font-size: 13px; }
.toast.error { border-left-color: var(--red); }
.mobile-nav { display: none; }
.mobile-more-backdrop, .mobile-more-sheet { display: none; }

@media (max-width: 1040px) {
  .landing-feature-copy { width: min(500px, 52%); }
  .landing-feature-copy h2 { font-size: 46px; }
  .landing-matchmaking { gap: 54px; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .app-shell { grid-template-columns: 82px minmax(0, 1fr); }
  .sidebar { padding-inline: 12px; }
  .sidebar .brand-name, .sidebar-label, .nav-link-label, .sidebar-user .player-name, .profile-chevron { display: none; }
  .sidebar .brand { justify-content: center; padding-inline: 0; }
  .nav-link { justify-content: center; padding: 0; }
  .sidebar-nav-icon { width: 20px; height: 20px; flex-basis: 20px; }
  .sidebar-user { justify-content: center; padding-inline: 0; }
  .chat-layout { grid-template-columns: 1fr; }
  .challenge-builder { grid-template-columns: minmax(0, 1.3fr) minmax(285px, .7fr); }
  .wager-presets { grid-template-columns: repeat(4, 1fr); }
  .custom-wager { grid-column: 1 / -1; }
  .network-grid { grid-template-columns: 1fr; }
  .tournament-cover-content { grid-template-columns: 1fr; gap: 20px; }
  .tournament-cover-content h1 { font-size: 36px; }
  .tournament-cover-content .quick-actions { width: 100%; justify-content: flex-start; }
  .room-detail-hero { grid-template-columns: 1fr; }
  .room-detail-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); align-self: auto; }
  .room-detail-stats div { min-height: 76px; border-right: 1px solid rgba(255,255,255,.09); border-bottom: 0; }
  .room-detail-stats div:last-child { border-right: 0; }
  .room-detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  html, body { height: 100%; overflow-x: hidden; overscroll-behavior-y: none; }
  body { min-height: 100dvh; }
  #app { min-height: 100%; }
  .landing-nav { height: 66px; padding: 0 18px; }
  .landing-nav .btn-ghost { display: none; }
  .landing-hero { min-height: 760px; background-image: url('/app-assets/assets/brand/bigpool-landing-hero-mobile-v1.webp'); background-position: center 62%; background-size: cover; }
  .landing-hero::before { background: linear-gradient(0deg, rgba(5,8,6,.98) 5%, rgba(5,8,6,.84) 38%, rgba(5,8,6,.48) 66%, rgba(5,8,6,.12) 100%); }
  .hero-copy { width: calc(100% - 36px); padding-bottom: 66px; }
  .hero-copy h1 { font-size: 58px; }
  .hero-statement { font-size: 24px; }
  .hero-copy p { font-size: 16px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-assurance { row-gap: 9px; }
  .hero-assurance span { width: 50%; padding-left: 10px; }
  .hero-assurance span:nth-child(odd) { padding-left: 0; border-left: 0; }
  .landing-band { width: calc(100% - 36px); grid-template-columns: 1fr; padding: 46px 0 76px; }
  .landing-section { width: calc(100% - 36px); padding: 76px 0; }
  .landing-section-heading { grid-template-columns: 1fr; gap: 20px; margin-bottom: 38px; }
  .landing-section-heading .eyebrow { grid-column: auto; margin-bottom: 0; }
  .landing-section h2, .landing-feature h2, .landing-matchmaking h2, .landing-progression h2, .landing-stakes h2, .landing-final h2 { font-size: 36px; }
  .landing-arena-intro { padding-bottom: 48px; }
  .landing-mode-line span { flex-basis: 50%; border-bottom: 1px solid var(--line); }
  .landing-mode-line span:last-child { flex-basis: 100%; border-bottom: 0; }
  .landing-feature { min-height: 720px; align-items: end; background-position: center top; }
  .landing-feature::before, .landing-feature-tournaments::before, .landing-feature-clubs::before { background: linear-gradient(0deg, rgba(3,5,4,1) 0%, rgba(3,5,4,.98) 38%, rgba(3,5,4,.58) 61%, rgba(3,5,4,.06) 88%); }
  .landing-feature-challenges { background-position: 68% top; }
  .landing-feature-tournaments { background-position: 35% top; }
  .landing-feature-vault { background-position: 72% top; }
  .landing-feature-clubs { background-position: 30% top; }
  .landing-feature-inner, .landing-feature-inner-right { min-height: 720px; align-items: flex-end; justify-content: flex-start; width: calc(100% - 36px); padding: 260px 0 48px; }
  .landing-feature-copy { width: 100%; }
  .landing-feature-number { margin-bottom: 26px; }
  .landing-feature-copy h2 { max-width: 520px; }
  .landing-feature-copy > p { margin: 18px 0; font-size: 15px; }
  .landing-feature-facts { margin-bottom: 24px; }
  .landing-feature-facts span { padding: 10px 9px; font-size: 9px; }
  .landing-feature .btn { width: 100%; }
  .landing-matchmaking { min-height: 0; grid-template-columns: 1fr; gap: 26px; padding: 70px 18px; }
  .landing-matchmaking h2 { margin-top: 12px; }
  .landing-progression { min-height: 0; grid-template-columns: 1fr; gap: 46px; padding: 76px 18px; background: linear-gradient(0deg, rgba(5,8,6,.99) 0%, rgba(5,8,6,.90) 60%, rgba(5,8,6,.54) 100%), url('/app-assets/assets/brand/bigpool-og-1200x630.jpg') 65% center/cover no-repeat, #07100d; }
  .landing-scoreboard div { grid-template-columns: 1fr; gap: 8px; padding: 19px 17px; }
  .landing-step-grid { grid-template-columns: 1fr; gap: 34px; }
  .landing-step-grid b { margin-bottom: 26px; }
  .landing-stakes { grid-template-columns: 1fr; gap: 28px; padding: 76px 18px; }
  .landing-final { min-height: 500px; padding-inline: 18px; }
  .landing-final h2 { font-size: 39px; }
  .landing-final .hero-actions { width: 100%; max-width: 360px; }
  .landing-footer { width: calc(100% - 36px); grid-template-columns: 1fr auto; padding: 30px 0 38px; }
  .landing-footer p { grid-column: 1 / -1; grid-row: 2; }
  .room-builder-hero { min-height: 250px; grid-template-columns: 1fr; gap: 18px; margin: -16px -16px 2px; padding: 22px 18px; }
  .room-builder-hero h3 { font-size: 26px; }
  .room-builder-table { width: min(210px, 100%); justify-self: start; }
  .room-asset-choice { grid-template-columns: 1fr; }
  .room-detail-page { gap: 16px; }
  .room-detail-hero { min-height: 520px; margin: -24px -15px 0; padding: 30px 18px; border-width: 0 0 1px; border-radius: 0; background: linear-gradient(0deg, rgba(5,9,7,.98) 8%, rgba(5,9,7,.78) 48%, rgba(5,9,7,.24) 100%), url('/app-assets/assets/brand/bigpool-clubhouse-bg-v1.webp') center/cover no-repeat, #07100d; }
  .room-detail-copy h1 { font-size: clamp(46px, 14vw, 68px); }
  .room-detail-copy p { font-size: 15px; }
  .room-detail-actions, .room-detail-actions .btn { width: 100%; }
  .room-detail-stats { grid-template-columns: 1fr; }
  .room-detail-stats div { min-height: 66px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.09); }
  .room-detail-stats div:last-child { border-bottom: 0; }
  .room-chat-panel { grid-template-rows: auto minmax(260px, 46dvh) auto; }
  .room-chat-panel > header { min-height: 68px; padding: 15px; }
  .room-chat-panel h2 { font-size: 23px; }
  .room-chat-feed { padding: 10px 14px; }
  .room-chat-composer { grid-template-columns: minmax(0, 1fr); }
  /* Only the full-width controls stretch. This used to be `.btn { width:100% }`
     for every button in the composer, which put the three reaction emoji on a
     row each: five stacked rows of buttons inside a fixed-height panel, leaving
     the message feed tall enough for exactly one message. */
  .room-chat-tools button[data-room-reaction] { flex: 0 0 auto; min-width: 52px; padding-left: 0; padding-right: 0; font-size: 17px; line-height: 1; }
  .room-chat-tools button[data-room-voice] { flex: 1 1 120px; }
  .room-chat-tools button[type='submit'] { flex: 1 1 auto; margin-left: 0; min-width: 92px; }
  .room-table-preview { height: 220px; }
  .legal-nav { width: calc(100% - 36px); min-height: 66px; }
  .legal-nav > div > a:first-child { display: none; }
  .legal-hero { width: calc(100% - 36px); padding: 64px 0 54px; }
  .legal-hero h1 { font-size: 46px; }
  .legal-hero p { font-size: 16px; }
  .legal-layout { width: calc(100% - 36px); grid-template-columns: 1fr; gap: 38px; padding: 48px 0 76px; }
  .legal-toc { position: static; grid-template-columns: 1fr 1fr; column-gap: 18px; }
  .legal-toc strong { grid-column: 1 / -1; }
  .legal-content section { padding-bottom: 38px; margin-bottom: 38px; }
  .legal-content h2 { font-size: 23px; }
  .legal-footer { width: calc(100% - 36px); grid-template-columns: 1fr auto; padding: 30px 0; }
  .legal-footer p { grid-column: 1 / -1; grid-row: 2; }
  .auth-layout { grid-template-columns: 1fr; }
  .auth-panel { min-height: 100vh; padding: 28px 20px 80px; }
  .auth-panel .brand { margin-bottom: 48px; }
  .auth-visual { display: none; }
  .form-row { grid-template-columns: 1fr; }
  .paypal-card-fields { grid-template-columns: 1fr; }
  .paypal-card-field-wide { grid-column: auto; }
  .input, .select, .textarea { font-size: 16px; }
  .app-shell { width: 100%; height: 100vh; height: 100dvh; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; }
  .sidebar { display: none; }
  .app-main { min-height: 0; display: contents; }
  .topbar { position: relative; grid-column: 1; grid-row: 1; height: calc(64px + env(safe-area-inset-top)); gap: 8px; padding: env(safe-area-inset-top) 12px 0; }
  .app-main > :not(.topbar) { grid-column: 1; grid-row: 2; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; }
  .topbar-heading { min-width: 0; gap: 8px; }
  .topbar-heading > div { min-width: 0; }
  .topbar-brand-mark { width: 32px; height: 32px; flex: 0 0 32px; display: block; overflow: hidden; border-radius: 7px; }
  .topbar-brand-mark img { width: 100%; height: 100%; display: block; object-fit: cover; }
  .topbar-actions { flex: 0 0 auto; gap: 5px; }
  .topbar-kicker { display: none; }
  .topbar-title { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
  .balance-pill { min-height: 34px; padding: 0 9px; font-size: 11px; white-space: nowrap; }
  .balance-pill span { display: none; }
  .match-ready-link { min-height: 34px; padding-inline: 9px; white-space: nowrap; }
  .topbar .icon-button { width: 34px; height: 34px; }
  .topbar-profile { display: none; }
  .page { padding: 24px 15px 30px; }
  .page-header { align-items: flex-start; flex-direction: column; margin-bottom: 25px; }
  .page-header > .btn { width: 100%; }
  .challenge-builder-page { padding-top: 18px; }
  .challenge-builder-header { align-items: flex-start; margin-bottom: 20px; }
  .challenge-builder-header h1 { font-size: 32px; }
  .challenge-builder-header p { font-size: 13px; }
  .game-badge { display: none; }
  .challenge-builder { grid-template-columns: 1fr; gap: 14px; }
  .challenge-controls { gap: 10px; }
  .builder-step { padding: 17px 14px; }
  .builder-step legend { margin-bottom: 15px; }
  .builder-step legend small { max-width: 270px; line-height: 1.4; }
  .choice-grid-2 { grid-template-columns: 1fr; }
  .choice-card { min-height: 76px; }
  .choice-grid-3 { gap: 6px; }
  .format-card { min-height: 116px; padding: 12px 10px; }
  .format-card i, .format-racks { left: 10px; }
  .format-card strong { font-size: 11px; }
  .format-card small { font-size: 9px; }
  .wager-presets { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .wager-chip { min-width: 0; padding-inline: 5px; font-size: 12px; }
  .custom-wager { grid-column: 1 / -1; }
  .match-ticket { position: relative; top: auto; }
  .ticket-versus strong { max-width: 100px; }
  /* The hero art sat behind the buttons at this width because the base
     gradient fades left-to-right, which is meaningless in a single column.
     Fade downward instead, so everything below the heading is on solid
     colour and the table reads as a header image. */
  .network-hero { min-height: 330px; grid-template-columns: 1fr; padding: 24px 17px; background: linear-gradient(180deg, rgba(16,23,19,.70) 0%, #101713 30%), url('/pool/sprites/pool_table.png') 55% -32%/165% auto no-repeat, #101713; }
  .network-hero h1 { font-size: 35px; }
  .network-rank { min-height: 112px; }
  /* Two even columns, with the primary invite across the top. The old rule
     here was `flex: 1 1 auto` on a wrapping flex row, so each row stretched
     its items to fill the remainder and no two rows matched. */
  .network-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: none; }
  .network-action-wide { grid-column: 1 / -1; }
  /* With the primary across the top, an odd number of remaining buttons
     leaves the last one alone in a half-width cell. Let it span instead. */
  .network-actions .btn:last-child:nth-child(even) { grid-column: 1 / -1; }
  .network-actions .btn { padding: 0 12px; font-size: 13px; }
  .network-invite-link { flex-direction: column; align-items: flex-start; gap: 6px; }
  .network-invite-value { max-width: 100%; }
  .tournament-page { gap: 20px; }
  .tournament-hero { min-height: 280px; grid-template-columns: 1fr; align-items: end; margin: -24px -15px 0; padding: 28px 17px; border-width: 0 0 1px; background: linear-gradient(0deg, #0b100d 5%, rgba(8,13,10,.84) 48%, rgba(8,13,10,.2)), url('/pool/sprites/pool_table.png') 70% 8%/125% auto no-repeat, #0b100d; }
  .tournament-hero h1 { font-size: 34px; }
  .tournament-hero-stat { grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding: 13px 15px; }
  .tournament-hero-stat strong { grid-row: 1 / span 2; grid-column: 2; font-size: 30px; }
  .tournament-card .card-body { height: auto; }
  .tournament-art { height: auto; aspect-ratio: 16 / 10; }
  .tournament-detail-cover { min-height: 390px; margin: -24px -15px 0; border-width: 0 0 1px; }
  .tournament-cover-shade { background: linear-gradient(0deg, rgba(5,9,7,.98) 8%, rgba(5,9,7,.68) 58%, rgba(5,9,7,.12)); }
  .tournament-cover-content { grid-template-columns: 1fr; gap: 20px; padding: 24px 17px; }
  .tournament-cover-content h1 { font-size: 32px; }
  .tournament-cover-content .quick-actions { width: 100%; justify-content: flex-start; }
  .tournament-cover-content .quick-actions .btn { flex: 1 1 auto; }
  .tournament-image-picker { grid-template-columns: 104px minmax(0, 1fr); }
  .tournament-image-preview { width: 104px; }
  .tournament-toolbar { align-items: stretch; flex-direction: column; }
  .tournament-toolbar > .btn { width: 100%; }
  .tournament-player-list { grid-template-columns: 1fr; }
  .tournament-detail-header .quick-actions { width: 100%; }
  .tournament-facts { gap: 2px; }
  .tournament-facts div { padding-inline: 7px; }
  .matchmaking-page { min-height: calc(100dvh - 150px); }
  .matchmaking-stage { padding: 30px 0; }
  .matchmaking-stage h1 { margin-top: 22px; font-size: 34px; }
  .matchmaking-orbit { grid-template-columns: 78px minmax(90px, 1fr) 78px; gap: 9px; margin: 34px auto 18px; }
  .matchmaking-avatar { width: 78px; height: 78px; }
  .matchmaking-avatar .avatar { width: 64px; height: 64px; font-size: 17px; }
  .matchmaking-search { height: 54px; }
  .matchmaking-search span { width: 40px; height: 40px; }
  .prize-plan { padding: 16px 14px; }
  .prize-tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .prize-tier:nth-child(2) { border-right: 0; }
  .prize-tier:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .tournament-champion { grid-template-columns: 42px minmax(0, 1fr); }
  .tournament-champion .avatar { width: 42px; height: 42px; }
  .tournament-champion b { grid-column: 2; }
  .tier-progress { grid-template-columns: 1fr; gap: 13px; }
  .network-grid { gap: 30px; margin-top: 30px; }
  .club-rank { grid-template-columns: 30px minmax(0, 1fr) auto; }
  .shared-challenge > header { height: 64px; width: calc(100% - 30px); }
  .shared-challenge > main { padding: 42px 0 70px; }
  .shared-challenge h1 { font-size: 39px; }
  .shared-challenge main > p { font-size: 14px; }
  .share-matchup { grid-template-columns: 1fr 30px 1fr; gap: 7px; padding: 22px 10px; }
  .share-matchup .avatar-lg { width: 64px; height: 64px; }
  .share-matchup strong { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .shared-details > div { padding-inline: 5px; }
  .shared-details strong { font-size: 11px; }
  .club-invite-page::before { background: linear-gradient(0deg, rgba(4,7,5,.99) 9%, rgba(4,7,5,.87) 62%, rgba(4,7,5,.52)); }
  .club-invite-page > header { width: calc(100% - 30px); height: 64px; }
  .club-invite-login { font-size: 0; }
  .club-invite-login strong { font-size: 11px; }
  .club-invite-page > main { width: calc(100% - 30px); min-height: calc(100dvh - 64px); justify-content: flex-end; padding: 70px 0 38px; }
  .club-invite-page h1 { margin-top: 20px; font-size: clamp(48px, 16vw, 70px); }
  .club-invite-page main > p { font-size: 14px; }
  .club-invite-actions { width: 100%; }
  .club-invite-actions .btn { width: 100%; }
  .club-invite-proof { margin-top: 30px; }
  .club-invite-proof > div { padding: 14px 7px 14px 0; }
  .club-invite-proof > div:not(:first-child) { padding-left: 9px; }
  .club-invite-proof strong { font-size: 17px; }
  .lobby-hero { min-height: 500px; margin: -24px -15px 0; padding: 25px 17px 30px; border-width: 0 0 1px; border-radius: 0; background: linear-gradient(0deg, rgba(5,9,7,.98) 0%, rgba(5,9,7,.93) 24%, rgba(5,9,7,.62) 44%, rgba(5,9,7,.22) 70%, rgba(5,9,7,0) 100%), url('/app-assets/assets/brand/bigpool-lobby-hero-v3.webp') 96% 100%/auto 150% no-repeat, #07100d; }
  .lobby-hero::before { background: none; }
  .lobby-hero h1 { font-size: 35px; }
  .home-vault-feature { min-height: 0; grid-template-columns: 1fr; }
  .home-vault-feature::before { display: none; }
  .home-vault-copy { padding: 26px 18px 22px; }
  .home-vault-copy h2 { margin: 17px 0 14px; font-size: 42px; }
  .home-vault-copy p { font-size: 13px; }
  .home-vault-actions .btn { flex: 1 1 auto; }
  .home-vault-visual { min-height: 230px; padding: 22px 22px 0; border-top: 1px solid rgba(255,255,255,.04); border-left: 0; }
  .home-vault-seal { width: 150px; }
  .home-vault-seal span { width: 54px; font-size: 28px; }
  .home-vault-facts { width: calc(100% + 44px); }
  .home-vault-facts div { padding: 13px 7px; }
  .home-vault-facts strong { font-size: 12px; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .home-competition-grid { row-gap: 34px; }
  .home-competition-grid .tournament-card, .home-competition-grid .tournament-card .card-body { height: auto; }
  .quick-actions { width: 100%; }
  .quick-actions .btn { flex: 1 1 auto; }
  .filters { max-width: calc(100vw - 30px); overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
  .filter { flex: 0 0 auto; }
  .pagination { align-items: stretch; flex-direction: column; gap: 11px; }
  .pagination-summary { display: flex; align-items: center; justify-content: space-between; }
  .pagination-summary span { margin: 0; }
  .pagination-controls { min-width: 0; justify-content: space-between; }
  .pagination-pages { min-width: 0; }
  .pagination-step { width: 42px; min-width: 42px; padding: 0; }
  .pagination-step b { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .pagination-page { min-width: 34px; }
  .pagination-gap { width: 12px; }
  .challenge-meta { grid-template-columns: repeat(3, 1fr); }
  .active-match-card { grid-template-columns: minmax(0, 1fr) auto; }
  .active-match-actions { min-width: 104px; }
  .active-match-score { display: none; }
  .leaderboard-row { grid-template-columns: 30px minmax(0, 1fr) 60px; }
  .leaderboard-row > :last-child { display: none; }
  .leaderboard-player { gap: 8px; }
  .player-tier-badge { width: 24px; height: 24px; flex-basis: 24px; }
  .player-tier-badge::before { width: 13px; height: 13px; }
  .versus { padding: 26px 16px; border: 0; background-color: transparent; box-shadow: none; }
  .versus-players { gap: 10px; }
  .match-chat-panel { top: auto; left: 8px; right: 8px; bottom: calc(78px + env(safe-area-inset-bottom)); width: auto; height: min(64dvh, 520px); border-radius: 8px; }
  body.match-chat-open { overflow: hidden; }
  .match-chat-panel > header { min-height: 62px; }
  .match-chat-thread { padding: 12px 10px; -webkit-overflow-scrolling: touch; }
  .match-chat-composer { padding: 10px; }
  .match-details { display: grid; gap: 8px; }
  .quick-agreement { padding: 16px; }
  .quick-agreement-actions { display: grid; grid-template-columns: 1fr; }
  .quick-agreement-actions .btn { width: 100%; }
  .agreement-readiness { grid-template-columns: 1fr; }
  .tournament-payment-summary { grid-template-columns: 1fr; }
  .tournament-payment-summary div:last-child { text-align: left; }
  .settings-grid { grid-template-columns: 1fr; }
  .settings-menu { max-width: calc(100vw - 30px); display: flex; gap: 4px; overflow-x: auto; padding-bottom: 5px; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
  .settings-tab { min-height: 40px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 6px; padding: 0 13px; white-space: nowrap; }
  .settings-tab.active { border-color: rgba(104,211,145,.45); }
  .settings-panel { min-height: 0; }
  .privacy-row { align-items: flex-start; }
  .mobile-profile-account { display: block; padding-bottom: 8px; }
  .mobile-profile-account .btn-danger { min-height: 50px; }
  .mobile-profile-links { display: grid; gap: 9px; }
  .wallet-balance { padding: 24px 18px; }
  .wallet-balance::after { right: 8px; }
  .wallet-breakdown { gap: 20px; flex-wrap: wrap; }
  .admin-user-row, .admin-withdrawal, .admin-match-report, .admin-challenge-row, .admin-tournament-row { align-items: start; grid-template-columns: 1fr; }
  .admin-tournament-actions { width: 100%; justify-content: flex-start; }
  .vault-feed-more { align-items: stretch; flex-direction: column; }
  .vault-feed-more .btn { width: 100%; }
  .profile-hero { align-items: flex-start; flex-wrap: wrap; }
  .profile-actions { width: 100%; margin: 4px 0 0; }
  .clubhouse-chat { min-width: 0; max-width: 100%; overflow: hidden; }
  .chat-panel { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; }
  .chat-feed { height: min(52dvh, 430px); padding-inline: 12px; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; }
  .chat-message-head { gap: 8px; }
  .chat-message-head time { max-width: 88px; font-size: 9px; }
  .chat-user { max-width: 100%; }
  .chat-event { grid-template-columns: 32px minmax(0, 1fr); }
  .chat-event > :last-child { grid-column: 2; justify-self: start; }
  .chat-composer { position: relative; z-index: 2; grid-template-columns: minmax(0, 1fr) auto; padding: 10px; }
  .chat-composer .btn { min-width: 68px; padding-inline: 12px; }
  .chat-user .chat-user-actions, .chat-user:hover .chat-user-actions, .chat-user:focus-within .chat-user-actions { display: none; }
  .dm-header { grid-template-columns: 46px minmax(0, 1fr); }
  .dm-header .quick-actions { grid-column: 1 / -1; }
  #app.route-dm .app-main > :not(.topbar) { overflow: hidden; }
  .dm-page { height: 100%; display: grid; grid-template-rows: auto minmax(0, 1fr); padding-top: 14px; padding-bottom: 10px; }
  .dm-header { margin-bottom: 12px; }
  .dm-shell { min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; }
  .dm-thread { height: auto; min-height: 0; padding: 14px 11px; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; }
  .dm-message > div { max-width: 86%; }
  .avatar-picker { grid-template-columns: 72px minmax(0, 1fr); gap: 14px; }
  .avatar-preview { width: 72px; height: 72px; }
  .modal-backdrop { align-items: end; padding: 12px 12px calc(12px + env(safe-area-inset-bottom)); }
  .modal { max-height: min(86dvh, 760px); }
  .modal-header, .modal-body, .modal-footer { padding: 16px; }
  .mobile-nav { position: relative; z-index: 40; grid-column: 1; grid-row: 3; width: 100%; height: calc(72px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 6px 4px env(safe-area-inset-bottom); border-top: 1px solid var(--line); background: rgba(10,13,11,.98); backdrop-filter: blur(18px); }
  .mobile-nav a, .mobile-nav button { min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border: 0; padding: 0; background: transparent; color: var(--muted); font-size: 9px; font-weight: 700; line-height: 1; }
  .mobile-nav a.active, .mobile-nav button.active { color: var(--green); }
  .mobile-nav-icon { width: 21px; height: 21px; flex: 0 0 21px; display: block; background: currentColor; mask: var(--mobile-nav-icon) center / contain no-repeat; -webkit-mask: var(--mobile-nav-icon) center / contain no-repeat; }
  .icon-home { --mobile-nav-icon: url('/app-assets/assets/icons/house.svg'); }
  .icon-challenges { --mobile-nav-icon: url('/app-assets/assets/icons/swords.svg'); }
  .icon-play { --mobile-nav-icon: url('/app-assets/assets/icons/circle-play.svg'); }
  .icon-messages { --mobile-nav-icon: url('/app-assets/assets/icons/message-circle.svg'); }
  .icon-profile { --mobile-nav-icon: url('/app-assets/assets/icons/user-round.svg'); }
  .icon-vault { --mobile-nav-icon: url('/app-assets/assets/icons/lock-keyhole.svg'); }
  .icon-more { --mobile-nav-icon: url('/app-assets/assets/icons/ellipsis.svg'); }
  .mobile-nav .play-link { align-self: center; justify-self: center; width: 54px; height: 54px; margin-top: -11px; border-radius: 50%; gap: 2px; background: var(--green); color: #07110b; box-shadow: 0 8px 24px rgba(104,211,145,.2); }
  .mobile-nav .play-link.active { color: #07110b; }
  .mobile-nav .play-link .mobile-nav-icon { width: 23px; height: 23px; flex-basis: 23px; }
  body.mobile-more-open { overflow: hidden; }
  .mobile-more-backdrop { position: fixed; z-index: 70; inset: 0; display: block; background: rgba(0,0,0,.68); backdrop-filter: blur(5px); }
  .mobile-more-backdrop[hidden], .mobile-more-sheet[hidden] { display: none; }
  .mobile-more-sheet { position: fixed; z-index: 80; left: 0; right: 0; bottom: 0; max-height: min(78dvh, 680px); display: block; overflow-y: auto; padding: 18px 16px calc(20px + env(safe-area-inset-bottom)); border: 1px solid var(--line-strong); border-bottom: 0; border-radius: 8px 8px 0 0; background: #101512; box-shadow: 0 -22px 70px rgba(0,0,0,.52); overscroll-behavior: contain; }
  .mobile-more-sheet header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; }
  .mobile-more-sheet header strong { display: block; margin-top: 3px; font-size: 21px; }
  .mobile-more-close { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: var(--surface-hover); color: var(--text); font-size: 27px; line-height: 1; }
  .mobile-more-sheet nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .mobile-more-sheet nav a { min-height: 56px; display: flex; align-items: center; gap: 11px; padding: 0 13px; border: 1px solid var(--line); border-radius: 6px; background: rgba(255,255,255,.018); color: var(--text-soft); font-size: 12px; font-weight: 700; }
  .mobile-more-sheet nav a.active { border-color: rgba(104,211,145,.42); background: rgba(104,211,145,.07); color: var(--green); }
  .mobile-more-icon { width: 20px; height: 20px; flex: 0 0 20px; background: currentColor; -webkit-mask: var(--sidebar-icon) center / contain no-repeat; mask: var(--sidebar-icon) center / contain no-repeat; }
  .mobile-more-logout { width: 100%; min-height: 48px; margin-top: 14px; border: 1px solid rgba(240,125,115,.25); border-radius: 6px; background: transparent; color: #ffaaa3; font-weight: 800; }
  .toast-root { left: 12px; right: 12px; bottom: calc(82px + env(safe-area-inset-bottom)); }
  .toast { max-width: none; }
}
/* Hourly faucet */
.faucet-page{min-height:100vh;background:#050806;color:var(--text)}
.faucet-nav{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,72px);border-bottom:1px solid var(--line);background:rgba(5,8,6,.94)}
.faucet-page main{max-width:1320px;margin:0 auto;padding:clamp(20px,4vw,54px)}
.faucet-hero{position:relative;min-height:560px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.55fr);align-items:end;gap:36px;padding:clamp(28px,6vw,80px);overflow:hidden;border:1px solid rgba(102,212,145,.35);border-radius:7px;background-image:linear-gradient(90deg,rgba(2,6,3,.98) 0%,rgba(2,6,3,.76) 54%,rgba(2,6,3,.36) 100%),var(--faucet-art);background-size:cover;background-position:center}
.faucet-copy{position:relative;z-index:1;max-width:730px}.faucet-copy h1{margin:14px 0;font-size:clamp(48px,6vw,84px);line-height:.98;letter-spacing:0}.faucet-copy h1 span{color:var(--green)}.faucet-copy p{max-width:620px;font-size:19px;line-height:1.65;color:#c1ccc4}.faucet-copy small{display:block;margin-top:18px;color:#91a097}
.faucet-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:30px}.faucet-primary{min-width:210px}
.faucet-prize{position:relative;z-index:1;padding:28px;border:1px solid rgba(102,212,145,.4);background:rgba(5,13,8,.88);backdrop-filter:blur(12px);border-radius:7px}.faucet-prize>span,.faucet-prize time{display:block;color:#91a097}.faucet-prize>strong{display:block;margin:8px 0 24px;font-size:40px;color:var(--green)}.faucet-prize div{display:flex;justify-content:space-between;padding:12px 0;border-top:1px solid var(--line)}.faucet-prize time{margin-top:18px}
.faucet-result{display:flex;flex-direction:column;gap:5px;padding:16px 20px;border:1px solid var(--line);background:rgba(7,12,9,.8)}.faucet-result.won{border-color:rgba(102,212,145,.5)}.faucet-result span{color:#a8b5ac}
.faucet-share-progress{width:min(100%,560px);display:flex;gap:18px;flex-wrap:wrap;color:#9caaa1;font-size:12px}.faucet-share-progress b{color:var(--green);font-size:14px}.faucet-share-gate,.faucet-share-confirm{width:min(100%,620px);display:grid;gap:14px;padding:18px;border:1px solid rgba(102,212,145,.35);border-radius:6px;background:rgba(5,13,8,.9);backdrop-filter:blur(12px)}.faucet-share-gate>div:first-child{display:grid;gap:5px}.faucet-share-gate span,.faucet-share-confirm span{color:#a8b5ac;font-size:13px;line-height:1.5}.faucet-share-buttons{display:flex;gap:8px;flex-wrap:wrap}.faucet-share-buttons .btn{min-width:112px}.faucet-share-confirm{grid-template-columns:minmax(0,1fr) auto;align-items:center}.faucet-share-admin{display:grid;gap:18px;padding:20px;border:1px solid var(--line);background:rgba(255,255,255,.012)}.faucet-intents{min-height:230px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.55}
.faucet-rules{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:32px;background:var(--line);border:1px solid var(--line)}.faucet-rules article{padding:30px;background:#0a0f0c}.faucet-rules b{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(102,212,145,.4);color:var(--green);border-radius:50%}.faucet-rules h2{margin:20px 0 8px;font-size:21px}.faucet-rules p{margin:0;color:#91a097;line-height:1.55}.faucet-admin-form{margin-top:26px}.faucet-admin-row{gap:18px}
.home-faucet-list{display:grid;gap:10px}.home-faucet-band{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 24px;border:1px solid rgba(102,212,145,.35);background:#0a120d}.home-faucet-band h3{margin:0 0 7px;font-size:21px}.home-faucet-band p{margin:0;color:#91a097}

/* Home discovery: editorial scale for featured play, dense controls elsewhere. */
.home-community-showcase { padding-top: 8px; }
.home-community-layout { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr); gap:20px; align-items:stretch; }
.home-tournament-feature,.home-room-feature { position:relative; min-width:0; overflow:hidden; border:1px solid #324138; border-radius:8px; background:#101713; }
.home-tournament-feature { min-height:440px; }
.home-tournament-feature>img,.home-room-feature>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.home-feature-shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(3,6,4,.03) 15%,rgba(4,8,6,.42) 52%,rgba(4,7,5,.98) 100%); }
.home-tournament-copy { position:absolute; inset:0; z-index:1; display:flex; flex-direction:column; justify-content:space-between; padding:28px; }
.home-feature-badges { display:flex; align-items:center; gap:9px; }
.home-feature-badges>span:last-child { padding:6px 9px; border:1px solid rgba(255,255,255,.18); border-radius:4px; background:rgba(5,10,7,.72); color:#fff; font-size:11px; font-weight:800; }
.home-tournament-copy h2 { max-width:650px; margin:8px 0 9px; color:#fff; font-size:clamp(32px,4vw,54px); line-height:1; }
.home-tournament-copy p { max-width:600px; margin:0; color:#c2ccc6; font-size:14px; line-height:1.55; }
.home-feature-footer { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding-top:20px; border-top:1px solid rgba(255,255,255,.12); }
.home-feature-footer div { display:grid; gap:4px; }
.home-feature-footer strong { color:#fff; font-size:13px; }
.home-feature-footer span { color:#9facA4; font-size:11px; }
.home-feature-empty { display:grid; place-items:end start; padding:30px; background:linear-gradient(135deg,#13251a,#080d0a); }
.home-feature-empty h2 { max-width:580px; margin:12px 0; font-size:38px; }
.home-feature-empty p { max-width:540px; color:var(--muted); }
.home-feature-empty .btn { margin-top:16px; }
.home-room-column { min-width:0; display:grid; grid-template-rows:auto minmax(0,1fr); gap:12px; }
.home-room-column-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:2px 2px 8px; }
.home-room-column-heading div { display:grid; gap:3px; }
.home-room-column-heading strong { color:#edf4ef; font-size:15px; }
.home-room-column-heading span { color:var(--muted); font-size:11px; }
.home-room-strip { min-height:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.home-room-feature { min-height:205px; }
.home-room-feature:first-child { grid-column:1/-1; }
.home-room-state { position:absolute; z-index:2; top:12px; left:12px; padding:5px 8px; border:1px solid rgba(255,255,255,.2); border-radius:4px; background:rgba(8,15,11,.86); color:#dce8e0; font-size:9px; font-weight:850; text-transform:uppercase; }
.home-room-state.is-live { border-color:#e85c68; background:#a92838; color:#fff; }
.home-room-copy { position:absolute; z-index:1; right:0; bottom:0; left:0; padding:17px; }
.home-room-copy>span { color:var(--green-bright); font-size:9px; font-weight:800; text-transform:uppercase; }
.home-room-copy h3 { margin:5px 0 4px; color:#fff; font-size:21px; }
.home-room-copy p { min-height:34px; margin:0 0 12px; overflow:hidden; color:#aebbb3; font-size:11px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.home-room-copy .btn { position:relative; z-index:3; }
.home-social-grid { align-items:start; gap:28px; }
.home-social-grid .clubhouse-chat { margin:0; }
.home-social-grid .chat-panel { height:430px; }

@media(max-width:1100px){
  .home-community-layout { grid-template-columns:1fr; }
  .home-tournament-feature { min-height:390px; }
  .home-room-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .home-room-feature:first-child { grid-column:auto; }
}
@media(max-width:760px){
  .home-community-layout { gap:24px; }
  .home-tournament-feature { min-height:390px; }
  .home-tournament-copy { padding:20px; }
  .home-tournament-copy h2 { font-size:34px; }
  .home-feature-footer { align-items:stretch; flex-direction:column; }
  .home-feature-footer .btn { width:100%; }
  .home-room-strip { display:flex; margin-right:-16px; padding-right:16px; overflow-x:auto; scroll-snap-type:x mandatory; }
  .home-room-feature,.home-room-feature:first-child { width:270px; min-width:270px; min-height:230px; grid-column:auto; scroll-snap-align:start; }
  .home-room-column-heading .btn { display:none; }
  .home-social-grid { grid-template-columns:1fr; }
}
.faucet-control-page{--faucet-gold:#e4bd5e}.faucet-control-status{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);background:#0b100d}.faucet-control-status article{min-width:0;padding:20px 22px;border-right:1px solid var(--line)}.faucet-control-status article:last-child{border-right:0}.faucet-control-status span,.faucet-control-status small{display:block;color:var(--muted);font-size:11px}.faucet-control-status strong{display:block;overflow:hidden;margin:7px 0 5px;color:var(--text);font-size:22px;text-overflow:ellipsis;white-space:nowrap}.faucet-builder-shell{margin-top:26px;border:1px solid rgba(102,212,145,.34);background:#0a100c}.faucet-builder{display:grid;grid-template-columns:minmax(0,1fr) 310px}.faucet-builder>header{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border-bottom:1px solid var(--line)}.faucet-builder header>div,.faucet-operation-card header,.faucet-sharing-card>header{display:flex;align-items:flex-start;gap:14px}.faucet-builder h2,.faucet-operation-card h2,.faucet-sharing-card h2{margin:0 0 5px;font-size:19px}.faucet-builder header p,.faucet-operation-card header p,.faucet-sharing-card header p{margin:0;color:var(--muted);font-size:12px}.faucet-step{width:30px;height:30px;display:grid;flex:0 0 30px;place-items:center;border:1px solid rgba(228,189,94,.35);border-radius:50%;color:var(--faucet-gold);font-size:10px;font-weight:800}.faucet-builder-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:26px}.faucet-fieldset{min-width:0;margin:0;padding:0;border:0}.faucet-fieldset legend{margin-bottom:9px;color:var(--text-soft);font-size:11px;font-weight:700}.faucet-segments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:4px;border:1px solid var(--line);border-radius:6px;background:#070a08}.faucet-segments label{cursor:pointer}.faucet-segments input{position:absolute;opacity:0;pointer-events:none}.faucet-segments span{min-height:40px;display:grid;place-items:center;border:1px solid transparent;border-radius:4px;color:var(--muted);font-size:11px;font-weight:800}.faucet-segments input:checked+span{border-color:rgba(102,212,145,.42);background:rgba(102,212,145,.1);color:var(--green)}.faucet-segments input:focus-visible+span{outline:2px solid var(--green);outline-offset:1px}.faucet-difficulty{grid-column:1/-1}.faucet-difficulty .faucet-segments{grid-template-columns:repeat(3,minmax(0,1fr))}.faucet-money-input,.faucet-unit-input{position:relative}.faucet-money-input>span,.faucet-unit-input>span{position:absolute;z-index:1;top:50%;transform:translateY(-50%);color:var(--muted);font-size:11px;font-weight:800}.faucet-money-input>span{left:14px}.faucet-money-input .input{padding-left:34px;font-size:19px;font-weight:750}.faucet-token-input>span,.faucet-unit-input>span{left:auto;right:14px}.faucet-token-input .input{padding-right:68px;padding-left:14px}.faucet-unit-input .input{padding-right:74px}.faucet-presets{display:flex;gap:5px;margin-top:7px}.faucet-preset{min-width:46px;min-height:28px;border:1px solid var(--line);border-radius:4px;background:transparent;color:var(--muted);font-size:10px;font-weight:700}.faucet-preset:hover,.faucet-preset.is-active{border-color:rgba(102,212,145,.4);color:var(--green)}.faucet-advanced{grid-column:1/-1;border-top:1px solid var(--line);padding-top:16px}.faucet-advanced summary{cursor:pointer;color:var(--text-soft);font-size:12px;font-weight:750}.faucet-advanced .field{margin-top:15px}.faucet-default-check{grid-column:1/-1;display:flex;align-items:flex-start;gap:11px;padding:14px;border:1px solid var(--line);border-radius:5px;background:rgba(255,255,255,.015)}.faucet-default-check input{margin-top:2px}.faucet-default-check span,.faucet-default-check small{display:block}.faucet-default-check strong{font-size:12px}.faucet-default-check small{margin-top:4px;color:var(--muted);font-size:10px}.faucet-builder-fields>[data-form-error]{grid-column:1/-1}.faucet-launch-preview{display:flex;flex-direction:column;padding:30px 24px;border-left:1px solid var(--line);background:linear-gradient(180deg,rgba(102,212,145,.06),transparent)}.faucet-launch-preview>strong{margin:13px 0 16px;color:var(--green);font-size:34px}.faucet-launch-preview>div:not(.eyebrow){display:flex;gap:10px;flex-wrap:wrap}.faucet-launch-preview>div span{padding:6px 8px;border:1px solid var(--line);border-radius:4px;color:var(--text-soft);font-size:10px}.faucet-launch-preview ul{display:grid;gap:10px;margin:24px 0 auto;padding:0;list-style:none;color:var(--muted);font-size:11px}.faucet-launch-preview li:before{content:"✓";margin-right:8px;color:var(--green);font-weight:900}.faucet-launch-preview .btn{margin-top:28px}.faucet-launch-preview>small{margin-top:10px;color:var(--muted);font-size:9px;line-height:1.5;text-align:center}.faucet-operations-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}.faucet-operation-card{display:flex;flex-direction:column;gap:18px}.faucet-operation-card .btn{align-self:flex-start}.faucet-operation-card .toggle-row{margin:0}.faucet-sharing-card{display:grid;gap:22px;margin-top:16px}.faucet-sharing-card>header{align-items:center}.faucet-inline-toggle{margin:0 0 0 auto;min-width:280px}.faucet-share-settings{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.faucet-message-head{display:flex;align-items:end;justify-content:space-between;gap:16px;padding-top:18px;border-top:1px solid var(--line)}.faucet-message-head strong,.faucet-message-head span{display:block}.faucet-message-head span{margin-top:4px;color:var(--muted);font-size:10px}.faucet-intent-list{display:grid;gap:7px}.faucet-intent-row{display:grid;grid-template-columns:28px 124px minmax(0,1fr) 38px;gap:7px;align-items:center}.faucet-intent-number{color:var(--muted);font-size:10px;text-align:center}.faucet-intent-row .input,.faucet-intent-row .select{min-height:42px}.faucet-intent-remove{width:38px;height:38px;color:#ffaaa3;font-size:20px}.faucet-sharing-card>.btn{justify-self:start}.faucet-rounds-section{margin-top:32px}.faucet-round-list{display:grid;border:1px solid var(--line)}.faucet-round-row{display:grid;grid-template-columns:145px minmax(180px,1fr) 120px auto;gap:20px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line);background:#0c110e}.faucet-round-row:last-child{border-bottom:0}.faucet-round-state small,.faucet-round-main span,.faucet-round-publish span{display:block;margin-top:5px;color:var(--muted);font-size:10px}.faucet-round-main strong{font-size:16px}.faucet-round-publish b{color:var(--green);font-size:16px}
@media(max-width:760px){.faucet-nav{height:70px;padding:0 16px}.faucet-page main{padding:0}.faucet-hero{min-height:calc(100svh - 140px);grid-template-columns:1fr;align-content:end;padding:30px 20px;border-width:0 0 1px;border-radius:0;background-image:linear-gradient(0deg,#030604 4%,rgba(3,6,4,.86) 50%,rgba(3,6,4,.25) 100%),var(--faucet-art);background-position:center}.faucet-copy h1{font-size:48px}.faucet-copy p{font-size:16px}.faucet-prize{padding:18px}.faucet-prize>strong{font-size:32px}.faucet-rules{grid-template-columns:1fr;margin:20px}.faucet-actions .btn,.faucet-share-buttons .btn{width:100%}.faucet-share-progress{justify-content:space-between}.faucet-share-gate,.faucet-share-confirm{grid-template-columns:1fr;padding:15px}.faucet-admin-row{align-items:flex-start;flex-direction:column}}
@media(max-width:980px){.faucet-control-status{grid-template-columns:repeat(2,minmax(0,1fr))}.faucet-control-status article:nth-child(2){border-right:0}.faucet-control-status article:nth-child(-n+2){border-bottom:1px solid var(--line)}.faucet-builder{grid-template-columns:1fr}.faucet-launch-preview{border-top:1px solid var(--line);border-left:0}.faucet-launch-preview ul{margin-bottom:8px}.faucet-share-settings{grid-template-columns:repeat(2,minmax(0,1fr))}.faucet-round-row{grid-template-columns:120px minmax(160px,1fr) auto}.faucet-round-publish{display:none}.faucet-round-row .quick-actions{grid-column:2/-1}}
@media(max-width:760px){.faucet-control-page .page-header{align-items:flex-start}.faucet-control-page .page-header>.btn{display:none}.faucet-control-status{grid-template-columns:1fr 1fr}.faucet-control-status article{padding:15px}.faucet-control-status strong{font-size:16px}.faucet-builder>header{align-items:flex-start;padding:18px}.faucet-builder>header>.status{display:none}.faucet-builder-fields{grid-template-columns:1fr;padding:18px}.faucet-difficulty,.faucet-advanced,.faucet-default-check,.faucet-builder-fields>[data-form-error]{grid-column:1}.faucet-launch-preview{padding:22px 18px}.faucet-operations-grid{grid-template-columns:1fr}.faucet-sharing-card>header{align-items:flex-start;flex-wrap:wrap}.faucet-inline-toggle{width:100%;min-width:0;margin:6px 0 0}.faucet-share-settings{grid-template-columns:1fr 1fr}.faucet-message-head{align-items:flex-start;flex-direction:column}.faucet-intent-row{grid-template-columns:24px minmax(0,1fr) 38px}.faucet-intent-row [data-faucet-intent-text]{grid-column:2/-1;grid-row:2}.faucet-intent-row .faucet-intent-remove{grid-column:3;grid-row:1}.faucet-round-row{grid-template-columns:1fr;padding:16px}.faucet-round-row .quick-actions{grid-column:1}.faucet-round-row .quick-actions .btn{flex:1}.faucet-round-state{display:flex;align-items:center;justify-content:space-between}.faucet-round-state small{margin:0}}
@media(max-width:760px){html.standalone-scroll,body.standalone-scroll{height:auto;min-height:100%;overflow-y:auto;overscroll-behavior-y:auto}}
@media(max-width:760px){.home-faucet-band{align-items:flex-start;flex-direction:column}.home-faucet-band .btn{width:100%}}
.faucet-operation-card .toggle-row>span,.faucet-inline-toggle>span{min-width:0}.faucet-operation-card .toggle-row strong,.faucet-operation-card .toggle-row small,.faucet-inline-toggle strong,.faucet-inline-toggle small{display:block}.faucet-operation-card .toggle-row small,.faucet-inline-toggle small{margin-top:4px;color:var(--muted);font-size:10px;line-height:1.45}

/* Quick Match AI agents */
.agent-avatar{color:#fff;border-color:rgba(255,255,255,.2);box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.agent-badge{display:inline-flex;padding:4px 7px;border:1px solid rgba(104,211,145,.38);border-radius:4px;color:var(--green);font-size:9px;font-weight:850;line-height:1}
.agent-admin-page .page-header{align-items:flex-end}.agent-policy{margin-top:24px}.agent-policy .section-heading{margin-bottom:22px}.agent-switch{display:flex;align-items:center;gap:9px;color:var(--text-soft);font-size:11px;font-weight:750}.agent-switch input{width:18px;height:18px;accent-color:var(--green)}
.agent-roster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.agent-card{min-width:0;padding:20px}.agent-card header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:13px;align-items:center}.agent-card header>div:nth-child(2){min-width:0}.agent-card header strong,.agent-card header span{display:block}.agent-card header strong{font-size:17px}.agent-card header span{margin-top:3px;color:var(--muted);font-size:10px}.agent-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:20px 0;border:1px solid var(--line)}.agent-metrics>div{min-width:0;padding:13px;border-right:1px solid var(--line)}.agent-metrics>div:last-child{border-right:0}.agent-metrics span,.agent-metrics small{display:block;color:var(--muted);font-size:9px}.agent-metrics strong{display:block;overflow:hidden;margin:5px 0 3px;font-size:15px;text-overflow:ellipsis;white-space:nowrap}.agent-color{min-height:48px;padding:5px}
@media(max-width:980px){.agent-roster{grid-template-columns:1fr}}
@media(max-width:620px){.agent-admin-page .page-header{align-items:flex-start}.agent-admin-page .page-header>.quick-actions{width:100%}.agent-admin-page .page-header>.quick-actions .btn{flex:1}.agent-policy .section-heading{align-items:flex-start;flex-direction:column}.agent-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.agent-metrics>div:nth-child(2){border-right:0}.agent-metrics>div:nth-child(-n+2){border-bottom:1px solid var(--line)}}

.home-community-shortcuts{border-top:1px solid var(--line);padding-top:30px}.home-shortcut-card{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;min-height:150px;padding:24px;background:linear-gradient(135deg,#0b1710,#111713);border-color:rgba(104,211,145,.24)}.home-shortcut-card h3{margin:8px 0 5px;font-size:22px}.home-shortcut-card p{margin:0;color:var(--muted)}
@media(max-width:620px){.home-shortcut-card{align-items:flex-start;flex-direction:column}.home-shortcut-card .btn{width:100%}}
.store-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end;padding:30px;border:1px solid var(--line);background:linear-gradient(120deg,#07150f,#151306 68%,#07100c);border-radius:8px}.store-hero h1{font-size:clamp(34px,4vw,62px);max-width:760px;margin:8px 0}.store-hero p{color:var(--muted);max-width:680px}.store-balance{min-width:210px;display:grid;gap:8px;padding:18px;border-left:2px solid var(--green)}.store-balance span{color:var(--muted);font-size:13px}.store-balance strong{font-size:30px;color:var(--gold)}.store-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.store-item{min-width:0;border:1px solid var(--line);background:var(--surface);border-radius:8px;overflow:hidden}.store-item.is-equipped{border-color:var(--green);box-shadow:0 0 0 1px color-mix(in srgb,var(--green) 35%,transparent)}.store-item-art{height:155px;position:relative;display:grid;place-items:center;background:radial-gradient(circle at 50% 45%,#26362f,#080d0a 72%);overflow:hidden}.store-item-art img{width:92%;height:82%;object-fit:contain;filter:drop-shadow(0 12px 14px #0009)}.store-item-art.is-table img{width:100%;height:100%;object-fit:contain}.store-item-art span{position:absolute;top:10px;left:10px;padding:5px 8px;background:#050806cc;border:1px solid #ffffff1a;color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase}.store-item-copy{padding:16px;display:grid;gap:14px}.store-item-copy h3{font-size:20px;margin:0 0 4px}.store-item-copy p{min-height:42px;margin:0;color:var(--muted);font-size:13px}.store-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}.store-stats span{display:grid;grid-template-columns:52px 1fr 16px;align-items:center;gap:6px;font-size:10px;text-transform:uppercase;color:var(--muted)}.store-stats i{height:4px;background:linear-gradient(90deg,var(--green) var(--value),#ffffff12 var(--value));border-radius:2px}.store-stats em{font-style:normal;color:var(--text)}.store-item footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.store-item footer>strong{font-size:18px;color:var(--gold)}
@media(max-width:1100px){.store-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.store-hero{grid-template-columns:1fr;padding:20px}.store-balance{border-left:0;border-top:2px solid var(--green);padding:14px 0 0}.store-grid{grid-template-columns:1fr}.store-item-art{height:175px}}
/* Every player's invite link, shareable straight to WhatsApp (the main channel for our players). */
.network-whatsapp { background: #25d366; border-color: #25d366; color: #06210f; }
.network-telegram { background: #229ed9; border-color: #229ed9; color: #fff; }
.network-telegram:hover { background: #2aa9e6; border-color: #2aa9e6; }
.network-whatsapp:hover { background: #3ee07a; border-color: #3ee07a; }
/* The link is one token: breaking it mid-URL reads as two broken lines, and
   nobody can tell where the link ends. It scrolls instead. */
.network-invite-link { display: flex; align-items: center; gap: 10px; margin: 16px 0 0; min-width: 0; }
.network-invite-label { flex: 0 0 auto; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.network-invite-value { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 6px; padding: 5px 10px; background: rgba(7,12,9,.6); color: var(--text-soft); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.network-invite-reward { margin: 8px 0 0; color: var(--text-soft); font-size: 13.5px; }
.network-invite-reward strong { color: var(--text); }
/* First-game hero: one clear next step for a player who has not played yet. */
.btn-large { min-height: 54px; padding: 0 30px; font-size: 16px; }
.lobby-hero-first { box-shadow: inset 3px 0 0 var(--green), var(--shadow-sm); }

/* The brag row under a result. Kept visually quieter than the match actions —
   it is an offer, not the next step, and a loud row of channel buttons reads
   as an ad on the screen where someone has just won. */
.brag-row { display: grid; gap: 10px; justify-items: center; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line); }
.brag-label { color: var(--muted); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }
.brag-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.brag-actions .btn { text-decoration: none; }

/* The invite sheet. Full-width stacked buttons: it is a chooser, and a row of
   small channel buttons is harder to hit on a phone, which is where nearly
   every invite is actually sent from. */
.invite-sheet { display: grid; gap: 14px; }
.invite-sheet > p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
/* The card itself, not a description of it. Fixed aspect so the sheet does
   not jump when the render arrives. */
.invite-sheet-card { width: 100%; height: auto; aspect-ratio: 1200 / 628; border-radius: 10px; border: 1px solid var(--line-strong); background: var(--bg-soft); object-fit: cover; }
.invite-sheet-actions { display: grid; gap: 8px; }
.invite-sheet-actions .btn { text-decoration: none; }
/* The link and its copy button read as one control, so there is no separate
   full-width "Copy link" row competing with the three real destinations. */
.invite-sheet-link { display: flex; align-items: center; gap: 8px; min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 4px 4px 4px 12px; background: var(--bg-soft); }
.invite-sheet-url { flex: 1; min-width: 0; overflow: hidden; color: var(--text-soft); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.invite-sheet-copy { flex: 0 0 auto; color: var(--muted); }
.invite-sheet-copy:hover { color: var(--green); }
.invite-sheet-reward { font-size: 13px; }

/* A challenge addressed to you. Given its own section at the top of the lobby
   because it is the one thing on that screen waiting on the player, and the
   Telegram notification promises somewhere to go and accept it. */
.challenges-for-you .section-heading h2 { color: var(--green-bright); }
.challenges-for-you .challenge-card { border-color: rgba(105, 224, 158, .45); box-shadow: 0 0 0 1px rgba(105, 224, 158, .12); }
.challenge-for-you { background: rgba(105, 224, 158, .16); border-color: rgba(105, 224, 158, .5); }

/* --- The slim challenge bar (phones) -------------------------------------
   On a phone the three-up card grid becomes three tall stacked cards, so one
   challenge fills the screen and the rest are a scroll away. A bar shows four
   in the same space. The markup is identical to the desktop card — only the
   arrangement changes, so there is no second thing to keep in step. */
.challenge-summary { display: none; }
/* Two labels ship on the accept button; only one is ever shown. A bar has
   room for a verdict, not a sentence, and a truncated "Insufficient USD
   bal…" tells the player less than "Low balance" does. */
.btn-text-short { display: none; }
.home-challenges-more { display: none; }

@media (max-width: 720px) {
  .home-challenges .grid-3 { grid-template-columns: 1fr; gap: 8px; }

  .home-challenges .challenge-card {
    position: relative;
    overflow: hidden;
    display: grid;
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    padding: 11px 13px;
    border-radius: 10px;
    background: linear-gradient(100deg, var(--surface-raised) 0%, var(--surface) 62%);
  }
  /* A green edge so a row of bars reads as a stack of tables, not a list. */
  .home-challenges .challenge-card::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg, var(--green-bright), var(--green-deep));
  }
  .home-challenges .challenge-card:hover { transform: none; }

  .home-challenges .challenge-player { gap: 10px; }
  .home-challenges .challenge-player .avatar { width: 36px; height: 36px; flex: 0 0 36px; font-size: 13px; }
  /* The rating line gives way to stake and format: on a bar, what the table
     costs and how long it runs decides the tap, not the opponent's record. */
  .home-challenges .player-name span { display: none; }
  .home-challenges .challenge-summary {
    display: block;
    margin-top: 1px;
    overflow: hidden;
    color: var(--green-bright);
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: .02em;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .home-challenges .challenge-player > .status { display: none; }
  .home-challenges .challenge-meta { display: none; }

  .home-challenges .challenge-card > .btn {
    width: auto;
    min-height: 36px;
    padding: 0 16px;
    border-radius: 8px;
    font-size: 12.5px;
  }
  .home-challenges .btn-text-full { display: none; }
  .home-challenges .btn-text-short { display: inline; }
  /* Decline, and an owner's share row, belong on the full card — a bar has
     room for exactly one decision. */
  .home-challenges .challenge-card > .btn-ghost,
  .home-challenges .challenge-owner-actions { display: none; }
  .home-challenges .challenge-card:has(.challenge-owner-actions) { grid-template-columns: minmax(0, 1fr); }

  /* Four bars, then a button. Any more and the section pushes everything
     below it off the screen, which is what the hot spot is for. */
  .home-challenges .challenge-card:nth-child(n+5) { display: none; }
  .home-challenges-more { display: block; margin-top: 10px; }
}

/* --- Player form, as one card -------------------------------------------
   Four separate stat cards became four full-height blocks on a phone, so
   reading your own form cost a scroll. A strip reads in one glance at every
   width, and the hairlines do the separating the card borders used to. */
.player-stats { overflow: hidden; padding: 0; }
.player-stats-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 18px; border-bottom: 1px solid var(--line); }
.player-stats-head .eyebrow { margin: 0; }
.player-stats-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.player-stats-strip > div { position: relative; padding: 20px 10px; text-align: center; }
/* An inset hairline rather than a full-height border: a rule that stops short
   of the edges reads as a divider, not as four boxes pushed together. */
.player-stats-strip > div + div::before { content: ''; position: absolute; top: 18%; bottom: 18%; left: 0; width: 1px; background: var(--line); }
.player-stats-strip strong { display: block; font-size: 27px; line-height: 1; letter-spacing: -.5px; }
.player-stats-strip span { display: block; margin-top: 9px; color: var(--muted); font-size: 9.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.player-stats-strip .is-primary strong { color: var(--green-bright); }

@media (max-width: 720px) {
  .player-stats-head { padding: 11px 14px; }
  .player-stats-strip > div { padding: 15px 6px; }
  .player-stats-strip strong { font-size: 21px; }
  .player-stats-strip span { margin-top: 7px; font-size: 8.5px; letter-spacing: .06em; }
}

/* A challenge link shared into Telegram unfurls to the card and lands here.
   The visitor should be able to stay in Telegram if that is where they were. */
.shared-challenge-telegram { text-decoration: none; }

/* The invite sheet's secondary line: the cosmetic reward, under the one that
   actually drives sharing. */
.invite-sheet-note { margin: -4px 0 0; color: var(--muted); font-size: 12.5px; line-height: 1.45; }

/* The guest claim prompt. It sits inline on the result page and the lobby, so
   it reads as part of the win rather than as an interruption — the gold edge
   is the only thing marking it out, because a guest who dismisses this once
   never comes back to it. */
.guest-claim-panel {
  position: relative; overflow: hidden; isolation: isolate; text-align: left;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 280px); gap: 32px; align-items: center;
  margin: 8px 0 24px; padding: 30px 32px; border-radius: 18px;
  border: 1px solid rgba(217, 180, 93, 0.28);
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(217, 180, 93, 0.14), transparent 55%),
    radial-gradient(90% 120% at 0% 100%, rgba(104, 211, 145, 0.08), transparent 60%),
    linear-gradient(160deg, #121813 0%, #0b0f0c 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 24px 60px -28px rgba(0, 0, 0, 0.8);
}
.guest-claim-panel::before { /* hairline gold sheen along the top edge */
  content: ""; position: absolute; inset: 0 0 auto 0; height: 1px; z-index: -1;
  background: linear-gradient(90deg, transparent, rgba(217, 180, 93, 0.75) 35%, rgba(217, 180, 93, 0.75) 65%, transparent);
}
.gc-body { min-width: 0; }
.gc-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--gold); font-family: var(--font-heading); font-size: 11px; font-weight: 800; letter-spacing: 1.8px; text-transform: uppercase; }
.gc-eyebrow svg { width: 14px; height: 14px; }
.guest-claim-panel h2 { margin: 12px 0 10px; font-family: BigPoolDisplay, var(--font-heading); font-size: clamp(24px, 2.6vw, 32px); font-weight: 900; line-height: 1.08; letter-spacing: -0.01em; color: var(--text); text-wrap: balance; }
.gc-lede { margin: 0; max-width: 54ch; color: var(--text-soft); font-size: 15px; line-height: 1.6; }
.guest-claim-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 24px; }
.guest-claim-actions .btn { min-height: 48px; border-radius: 12px; padding: 0 22px; }
.gc-primary { background: linear-gradient(180deg, #7fe0a3, var(--green)); box-shadow: 0 10px 28px -10px rgba(104, 211, 145, 0.7), 0 1px 0 rgba(255, 255, 255, 0.35) inset; }
.gc-primary svg { width: 16px; height: 16px; transition: transform .18s; }
.gc-primary:hover svg { transform: translateX(3px); }
.gc-secondary { border-color: rgba(255, 255, 255, 0.12); }
.gc-fine { margin: 14px 0 0; color: var(--muted); font-size: 12px; letter-spacing: 0.2px; }
.gc-keep { position: relative; padding: 22px 22px 18px; border-radius: 14px; background: rgba(255, 255, 255, 0.025); border: 1px solid rgba(255, 255, 255, 0.07); }
.gc-stat { display: grid; gap: 2px; padding-bottom: 16px; margin-bottom: 14px; border-bottom: 1px solid rgba(255, 255, 255, 0.07); }
.gc-stat-num { font-family: BigPoolDisplay, var(--font-heading); font-size: 44px; font-weight: 900; line-height: 1; color: var(--gold); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; text-shadow: 0 0 28px rgba(217, 180, 93, 0.35); }
.gc-plus { font-size: 0.62em; vertical-align: 0.32em; margin-right: 2px; }
.gc-stat-label { color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; }
.gc-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; }
.gc-list li { display: flex; align-items: center; gap: 10px; color: var(--text-soft); font-size: 14px; }
.gc-list svg { flex: none; width: 18px; height: 18px; padding: 3px; border-radius: 50%; color: var(--green-bright); background: rgba(104, 211, 145, 0.12); box-shadow: 0 0 0 1px rgba(104, 211, 145, 0.25) inset; }
.claim-form { margin-top: 14px; }

@media (max-width: 720px) {
  .guest-claim-panel { grid-template-columns: 1fr; gap: 22px; padding: 24px 20px; border-radius: 16px; }
  .gc-keep { order: -1; display: flex; align-items: center; gap: 14px; padding: 14px 16px; }
  .gc-stat { flex: none; padding: 0 14px 0 0; margin: 0; border-bottom: 0; border-right: 1px solid rgba(255, 255, 255, 0.07); }
  .gc-stat-num { font-size: 32px; }
  .gc-stat-label { font-size: 9.5px; letter-spacing: 1px; white-space: nowrap; }
  .gc-list { gap: 6px; min-width: 0; }
  .gc-list li { font-size: 12.5px; gap: 8px; white-space: nowrap; }
  .gc-list svg { width: 16px; height: 16px; }
  .guest-claim-actions { flex-direction: column; align-items: stretch; }
  .guest-claim-actions .btn { width: 100%; }
}

/* Why every stake chip above is greyed out. Without this the guest sees a
   disabled row and no way forward. */
.wager-guest-note { margin: 12px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.link-button { padding: 0; border: 0; background: none; color: var(--green-bright); font: inherit; font-weight: 600; text-decoration: underline; cursor: pointer; }
.link-button:hover { opacity: 0.85; }

/* The purchase sheet: a receipt that is also a brag card.
   It reuses the invite sheet's link row and note, because the link does the
   same job — the card is what differs, and it is the item rather than a name. */
.network-x { background: #0f1210; border-color: rgba(245,247,245,.45); color: #f5f7f5; }
.network-x:hover { background: #1a1f1b; border-color: #f5f7f5; }

.purchase-sheet { display: grid; gap: 14px; }
.purchase-sheet-head { display: grid; gap: 4px; }
.purchase-sheet-rarity { font-size: 11px; font-weight: 800; letter-spacing: 1.6px; text-transform: uppercase; color: var(--gold); }
.purchase-sheet-head h3 { margin: 0; font-size: 24px; line-height: 1.1; }
.purchase-sheet-head p { margin: 0; font-size: 13.5px; line-height: 1.5; }
.purchase-sheet-card { width: 100%; height: auto; aspect-ratio: 1200 / 628; border-radius: 10px; border: 1px solid var(--line-strong); background: var(--bg-soft); object-fit: cover; }
.purchase-sheet-stats { margin: 0; }
.purchase-sheet-actions { display: grid; gap: 8px; }
.purchase-sheet-share { display: grid; gap: 8px; }
.purchase-sheet-share .btn { text-decoration: none; }
/* A quiet divider, so the share block reads as a second step rather than more
   of the same stack of buttons. */
.purchase-sheet-share-label { padding-top: 10px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; }

@media (max-width: 720px) {
  .purchase-sheet-head h3 { font-size: 21px; }
}

/* Help sits under the player card rather than in the main nav: it is not
   somewhere you go to play, but it must be reachable from every screen
   without hunting. Muted until hovered, so it never competes with Play. */
.sidebar-support {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
  padding: 9px 12px;
  border-radius: 10px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.sidebar-support:hover { background: rgba(255,255,255,.04); color: var(--text); }
.sidebar-support .sidebar-nav-icon { opacity: .75; }
.sidebar-support:hover .sidebar-nav-icon { opacity: 1; }