:root{
  --bg:#19132B;
  --bg-2:#150f24;
  --surface:#231A37;
  --surface-2:#2a2043;
  --accent:#24F088;
  --accent-pink:#E94DB2;
  --accent-yellow:#FFD600;
  --accent-aqua:#00E1FF;
  --text:#FFFFFF;
  --text-muted:#BEB4E6;
  --border:#332D44;
  --border-bright:#502953;
  --radius:16px;
  --radius-sm:12px;
  --font-head:'Sora',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text-muted);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.7;
  max-width:100vw;
}
.page-wrapper{
  max-width:100vw;
  overflow-x:clip;
}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{font-family:var(--font-head);color:var(--text);line-height:1.2;margin:0 0 .5em;}

.eyebrow{
  display:inline-block;
  font-family:var(--font-head);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.5rem;
}
.section-title{font-size:1.7rem;font-weight:800;}
.section-lead{color:var(--text-muted);max-width:60ch;}
.section-head{margin-bottom:1.4rem;}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  font-family:var(--font-head);
  font-weight:700;
  font-size:.9rem;
  border-radius:999px;
  padding:10px 22px;
  cursor:pointer;
  border:1px solid transparent;
  transition:transform .15s,box-shadow .2s,background .2s,color .2s;
  min-height:34px;
}
.btn-primary{
  background:linear-gradient(135deg,#24F088,#1fd47a);
  color:#0c1b12;
  box-shadow:0 6px 18px rgba(36,240,136,.28);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(36,240,136,.4);}
.btn-primary:active{transform:translateY(0);}
.btn-outline{
  background:var(--surface);
  color:var(--text);
  border:1px solid var(--border);
}
.btn-outline:hover{border-color:var(--accent);color:var(--accent);}
.btn-lg{padding:13px 30px;font-size:1rem;}
.btn:focus-visible{outline:2px solid var(--accent-aqua);outline-offset:2px;}

/* Header */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(21,15,36,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.header-inner{
  max-width:1240px;margin:0 auto;
  display:flex;align-items:center;gap:1.2rem;
  padding:10px 20px;
}
.logo-img{height:38px;width:auto;display:block;}
.main-nav{
  display:flex;gap:1.1rem;flex-wrap:wrap;
  margin-right:auto;
}
.main-nav a{
  font-size:.86rem;font-weight:500;color:var(--text-muted);
  transition:color .15s;white-space:nowrap;
}
.main-nav a:hover{color:var(--accent);}
.header-actions{display:flex;align-items:center;gap:.6rem;}
.btn-login,.btn-signup{padding:8px 18px;font-size:.85rem;}
.btn-signup{background:var(--accent);color:#0c1b12;box-shadow:0 4px 14px rgba(36,240,136,.3);}
.avatar-btn{
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface);border:1px solid var(--border);color:var(--text);
  transition:border-color .15s;
}
.avatar-btn:hover{border-color:var(--accent);}

/* Main */
.main-content{
  max-width:1240px;margin:0 auto;
  padding:0 20px;
  min-width:0;
  overflow-x:clip;
}

/* Hero */
.hero{
  margin:24px 0;
  border-radius:var(--radius);
  overflow:hidden;
  background-image:url('../images/banner.png');
  background-size:cover;
  background-position:center right;
  border:1px solid var(--border-bright);
  min-height:340px;
  display:flex;
}
.hero-overlay{
  padding:44px 40px;
  max-width:620px;
  background:linear-gradient(90deg,rgba(21,15,36,.94) 0%,rgba(21,15,36,.82) 45%,rgba(21,15,36,0) 100%);
  display:flex;flex-direction:column;justify-content:center;
}
.hero-title{font-size:2.3rem;font-weight:800;margin-bottom:.6rem;}
.hero-title{color:var(--text);}
.hero-sub{color:var(--text-muted);margin-bottom:1.4rem;max-width:46ch;}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;}

/* Quick bar */
.quick-bar{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin:8px 0 28px;
}
.quick-item{
  display:flex;align-items:center;gap:.7rem;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:14px 16px;
  color:var(--text);
  font-family:var(--font-head);
  font-weight:600;font-size:.9rem;
  transition:transform .18s,border-color .18s;
}
.quick-item:hover{transform:translateY(-3px);border-color:var(--accent);}
.quick-icon{display:flex;color:var(--accent);flex-shrink:0;}

/* Sections shared */
.text-section{padding:38px 0;}

/* Steps */
.steps-split{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:36px;align-items:center;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:34px;
}
.steps-copy .btn{margin-top:1rem;}
.steps-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px;}
.step-row{display:flex;gap:16px;align-items:flex-start;}
.step-num{
  flex-shrink:0;width:40px;height:40px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--accent),var(--accent-aqua));
  color:#0c1b12;font-family:var(--font-head);font-weight:800;
}
.step-icon{display:inline-flex;color:var(--accent);margin-bottom:.2rem;}
.step-row h3{font-size:1.05rem;margin:0 0 .2rem;}
.step-row p{margin:0;font-size:.9rem;}

/* Game grid */
.game-section{padding:26px 0;}
.game-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:14px;
}
.game-tile{position:relative;border-radius:var(--radius-sm);overflow:hidden;background:var(--surface);border:1px solid var(--border);}
.game-tile img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;transition:transform .3s;}
.game-tile:hover img{transform:scale(1.05);}
.play-overlay{
  position:absolute;inset:0;
  background:rgba(12,8,24,.65);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  opacity:0;transition:opacity .2s;
}
.game-tile:hover .play-overlay{opacity:1;}
.game-tile.active .play-overlay{opacity:1;}
.play-btn{
  padding:9px 24px;border-radius:999px;font-size:.85rem;
  font-family:var(--font-head);font-weight:700;
  cursor:pointer;text-decoration:none;border:none;min-height:34px;
  background:var(--accent);color:#0c1b12;
  display:inline-flex;align-items:center;
}
.play-btn:hover{background:#1fd47a;}

/* Category cards */
.cat-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
}
.cat-card{
  background:var(--surface);
  border:1px solid var(--border-bright);
  border-radius:var(--radius);
  padding:26px 20px;
  display:flex;flex-direction:column;align-items:center;gap:.5rem;
  text-align:center;
  transition:transform .18s,box-shadow .2s;
}
.cat-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(0,0,0,.35);}
.cat-icon{
  width:56px;height:56px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(36,240,136,.12);color:var(--accent);margin-bottom:.3rem;
}
.cat-card h3{font-size:1.05rem;margin:0;}
.cat-link{font-size:.82rem;color:var(--accent);font-weight:600;}

/* Stats band */
.stats-band{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--border);
  border-radius:var(--radius);
  overflow:hidden;
  margin:28px 0;
  border:1px solid var(--border);
}
.stat{
  background:linear-gradient(160deg,var(--surface-2),var(--surface));
  padding:28px 16px;text-align:center;
}
.stat-num{
  display:block;font-family:var(--font-head);font-weight:800;
  font-size:2rem;color:var(--accent);
}
.stat-label{font-size:.85rem;color:var(--text-muted);}

/* Security list */
.sec-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;}
.sec-row{
  display:flex;gap:16px;align-items:flex-start;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:20px;
}
.sec-icon{
  flex-shrink:0;width:48px;height:48px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(0,225,255,.1);color:var(--accent-aqua);
}
.sec-row h3{font-size:1.05rem;margin:0 0 .3rem;}
.sec-row p{margin:0;font-size:.9rem;}

/* SEO content */
.content-seo{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:38px 40px;
  margin:38px 0;
}
.content-seo h1{font-size:2rem;margin-bottom:.7rem;}
.content-seo h2{
  font-size:1.5rem;margin:1.8rem 0 .7rem;padding-left:14px;
  border-left:4px solid var(--accent);
}
.content-seo h3{font-size:1.15rem;margin:1.3rem 0 .5rem;color:var(--accent-aqua);}
.content-seo p{max-width:74ch;margin:0 0 1rem;}
.content-seo p:first-of-type{font-size:1.08rem;color:#d7cffb;}
.content-seo ul{max-width:74ch;padding-left:1.2rem;margin:0 0 1rem;}
.content-seo li{margin-bottom:.4rem;}
.content-table,.content-seo table{
  width:100%;border-collapse:collapse;margin:1rem 0;font-size:.9rem;
  border-radius:var(--radius-sm);overflow:hidden;
}
.content-seo th{background:var(--surface-2);color:var(--text);padding:12px;text-align:left;}
.content-seo td{padding:12px;border-top:1px solid var(--border);}
.content-seo tr:nth-child(even) td{background:rgba(255,255,255,.02);}
.ul-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;}

/* Reviews / providers */
.reviews-section .section-title,
.providers-section .section-title{margin-bottom:1.2rem;}
.providers-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
  gap:14px;align-items:center;
}
.providers-grid img{
  max-width:100%;max-height:48px;object-fit:contain;
  opacity:.7;transition:opacity .2s;filter:grayscale(20%);
}
.providers-grid img:hover{opacity:1;}

/* FAQ */
.faq-list{display:flex;flex-direction:column;gap:12px;max-width:820px;}
.faq-item{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  overflow:hidden;
}
.faq-q{
  width:100%;background:none;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:18px 20px;
  font-family:var(--font-head);font-weight:600;font-size:1rem;color:var(--text);
  text-align:left;
}
.faq-chev{transition:transform .25s;color:var(--accent);flex-shrink:0;}
.faq-item.open .faq-chev{transform:rotate(180deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.faq-a p{padding:0 20px 18px;margin:0;font-size:.92rem;}

/* App promo */
.app-promo{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:linear-gradient(120deg,var(--accent-pink),#7a2ea8);
  border-radius:var(--radius);
  padding:36px 40px;margin:38px 0;
}
.app-copy{max-width:560px;}
.app-copy .section-title{color:#fff;}
.app-copy p{color:rgba(255,255,255,.9);}
.app-copy .eyebrow{color:var(--accent-yellow);}
.app-visual{color:rgba(255,255,255,.9);flex-shrink:0;}

/* Footer */
.site-footer{
  background:var(--bg-2);
  border-top:1px solid var(--border);
  padding:44px 20px 28px;margin-top:20px;
}
.footer-cols{
  max-width:1240px;margin:0 auto;
  display:grid;grid-template-columns:repeat(4,1fr);gap:28px;
}
.footer-col h4{font-size:.95rem;color:var(--text);margin-bottom:.8rem;}
.footer-col a{display:block;color:var(--text-muted);font-size:.88rem;padding:4px 0;transition:color .15s;}
.footer-col a:hover{color:var(--accent);}
.footer-bottom{
  max-width:1240px;margin:32px auto 0;
  padding-top:22px;border-top:1px solid var(--border);
  display:flex;gap:16px;align-items:flex-start;
}
.age-badge{
  flex-shrink:0;
  border:2px solid var(--accent-yellow);color:var(--accent-yellow);
  font-family:var(--font-head);font-weight:800;font-size:.85rem;
  padding:6px 10px;border-radius:8px;
}
.legal{font-size:.8rem;color:var(--text-muted);margin:0;line-height:1.6;}

/* Responsive */
@media (max-width:1024px){
  .main-nav{display:none;}
}
@media (max-width:900px){
  .quick-bar{grid-template-columns:repeat(2,1fr);}
  .steps-split{grid-template-columns:1fr;}
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .stats-band{grid-template-columns:repeat(2,1fr);}
  .footer-cols{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:768px){
  .header-inner{padding:10px 16px;gap:.6rem;}
  .text-section{padding:28px 16px;}
  .content-seo{padding:26px 18px;}
  .hero-overlay{padding:30px 20px;background:linear-gradient(90deg,rgba(21,15,36,.95) 0%,rgba(21,15,36,.85) 60%,rgba(21,15,36,.35) 100%);}
  .hero-title{font-size:1.7rem;}
  .app-promo{flex-direction:column;text-align:center;padding:28px 20px;}
  .app-visual{display:none;}
  .section-title{font-size:1.4rem;}
  .btn{padding:9px 18px;font-size:.85rem;min-height:34px;}
  .btn-lg{padding:11px 24px;}
  .hero-cta .btn{padding:9px 18px;font-size:.85rem;min-height:36px;}
  .footer-bottom{flex-direction:column;}
}
@media (max-width:480px){
  .btn-login{display:none;}
  .quick-bar{grid-template-columns:1fr;}
  .cat-grid{grid-template-columns:1fr;}
  .stats-band{grid-template-columns:1fr;}
  .footer-cols{grid-template-columns:1fr;}
}

/* content-interlink-fix: keep in-prose interlinks visible (buttons untouched) */
.content-seo a:not([class]){color:var(--accent,#f90);text-decoration:underline;text-underline-offset:2px}
.content-seo a:not([class]):hover{text-decoration:none;opacity:.85}


/* ── SEO Content block (injected by inject_slots.py) ─────────────────── */
/* Full SEO copy shown inline (no accordion) as one designed panel. */
.content-seo {
  max-width: 1100px;
  margin: 48px auto;
  padding: 40px clamp(20px, 4vw, 56px);
  background: var(--surface, rgba(255,255,255,0.03));
  border: 1px solid var(--border, rgba(255,255,255,0.08));
  border-radius: 16px;
}
.content-seo > h2,
.content-seo > .content-seo-title {
  margin: 0 0 24px; font-size: clamp(1.4rem, 2.4vw, 2rem); font-weight: 700;
}

.content-flat { margin: 0; font-size: 1.02rem; }
.content-block { margin: 0 0 8px; }
.content-block > h2 {
  margin: 1.4em 0 .5em; font-size: 1.4rem; font-weight: 700; line-height: 1.3;
}
.content-block:first-child > h2 { margin-top: 0; }
.content-flat p { margin: 0 0 1em; line-height: 1.8; }
.content-flat h1 { margin: 0 0 .5em; line-height: 1.25; }
.content-flat h2 { margin: 1.4em 0 .5em; font-size: 1.4rem; line-height: 1.3; }
.content-flat h3 { margin: 1.2em 0 .5em; font-size: 1.15rem; line-height: 1.3; }
.content-flat ul { padding-left: 1.25em; margin: 0 0 1em; }
.content-flat li { margin-bottom: .5em; line-height: 1.7; }
/* Only colour inline text links — must NOT hit the CTA button below. */
.content-flat p a, .content-flat li a, .content-flat td a,
.content-flat h2 a, .content-flat h3 a { color: var(--accent, #f90); }

/* CTA band woven into the long text so it doesn't read as one wall.
   One layout variant is used per site (picked from the brand name). */
.content-cta {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 18px; margin: 36px 0; padding: 24px 28px; border-radius: 14px;
}
.content-cta-body { display: flex; flex-direction: column; gap: 4px; flex: 1 1 auto; min-width: 0; }
.content-cta-text { margin: 0; font-size: 1.15rem; font-weight: 800; line-height: 1.25; }
.content-cta-sub  { margin: 0; font-size: .95rem; opacity: .8; }
/* The CTA button reuses the site's .btn/.btn-primary when present (correct on-accent
   contrast); this only handles layout + a readable fallback if it has neither.
   Keep it from stretching full-width when the site's .btn is display:block/100%. */
.content-cta .content-cta-btn { white-space: nowrap; flex: 0 0 auto; width: auto; align-self: center; }
.content-cta-btn--solid {
  background: var(--accent, #f90); color: var(--bg, #0b1018); text-decoration: none;
  padding: 12px 26px; border-radius: 8px; font-weight: 700;
  min-height: 34px; display: inline-flex; align-items: center;
}
.content-cta-btn--solid:hover { filter: brightness(1.08); }

/* Variant: bar — accent left rule, row layout */
.content-cta--bar {
  background: var(--surface-2, rgba(255,255,255,0.05));
  border: 1px solid var(--border, rgba(255,255,255,0.10));
  border-left: 4px solid var(--accent, #f90);
}
/* Variant: center — centered column, tinted panel */
.content-cta--center {
  flex-direction: column; text-align: center; gap: 14px;
  background: var(--surface, rgba(255,255,255,0.04));
  border: 1px solid var(--border, rgba(255,255,255,0.10));
  padding: 32px 28px;
}
.content-cta--center .content-cta-body { align-items: center; }
/* Variant: gradient — bold accent gradient, dark text */
.content-cta--gradient {
  background: linear-gradient(120deg, var(--accent, #f90), var(--accent-2, #00BBFF));
  box-shadow: 0 12px 30px rgba(0,0,0,0.28);
}
.content-cta--gradient .content-cta-text,
.content-cta--gradient .content-cta-sub { color: #07261a; }
.content-cta--gradient .content-cta-sub { opacity: .85; }
/* Variant: split — strong headline left + button right, ringed panel */
.content-cta--split {
  background: var(--surface-2, rgba(255,255,255,0.04));
  border: 1px solid color-mix(in srgb, var(--accent, #f90) 45%, transparent);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
}
.content-cta--split .content-cta-text { font-size: 1.35rem; }
@media (max-width: 600px) {
  .content-cta { flex-direction: column; align-items: flex-start; text-align: left; }
  .content-cta--center { align-items: center; text-align: center; }
}

/* Content tables (bonuses, payments, comparison) */
.content-table {
  width: 100%; border-collapse: collapse; margin: 1em 0;
  font-size: .95rem; overflow: hidden; border-radius: 8px;
}
.content-table th, .content-table td {
  padding: 10px 14px; text-align: left;
  border-bottom: 1px solid rgba(255,255,255,0.10);
}
.content-table thead th {
  background: rgba(255,255,255,0.06);
  font-weight: 700; color: var(--accent, #f90);
  white-space: nowrap;
}
.content-table tbody tr:hover { background: rgba(255,255,255,0.03); }
.content-table tbody tr:last-child td { border-bottom: none; }
/* Mobile: let wide tables scroll instead of breaking layout */
@media (max-width: 768px) {
  .content-table { display: block; overflow-x: auto; white-space: nowrap; }
  .content-seo { margin: 28px 12px; padding: 24px 18px; border-radius: 12px; }
  .content-flat h2, .content-block > h2 { font-size: 1.25rem; }
}


/* ── Player Reviews (injected by inject_slots.py) ────────────────────── */
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
  max-width: 1100px;
  margin: 0 auto;
}
.review-card {
  background: var(--surface, rgba(255,255,255,0.04));
  border: 1px solid var(--border, rgba(255,255,255,0.08));
  border-radius: 14px;
  padding: 24px;
  display: flex; flex-direction: column; gap: 14px;
  transition: transform .2s ease, box-shadow .2s ease;
}
.review-card:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(0,0,0,0.25); }
.review-stars { display: inline-flex; gap: 2px; }
.review-stars .star svg { fill: rgba(255,255,255,0.18); display: block; }
.review-stars .star.is-full svg { fill: var(--accent, #f5a623); }
.review-text { margin: 0; line-height: 1.7; font-size: 1rem; color: var(--text, inherit); }
.review-meta { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.review-avatar {
  width: 40px; height: 40px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: .95rem; flex-shrink: 0;
  /* dark text on the (usually bright) accent reads better than white */
  background: var(--accent, #f5a623); color: var(--bg, #0b1018);
}
.review-name { font-weight: 600; }
@media (max-width: 768px) {
  .reviews-grid { grid-template-columns: 1fr; }
  .review-card { padding: 20px; }
}


/* ── Mobile menu (injected by inject_slots.py) ───────────────────────── */
.nav-toggle {
  display: none; background: none; border: 0; cursor: pointer;
  color: inherit; padding: 8px; line-height: 0; align-items: center;
  margin-left: auto;  /* push the hamburger to the right edge of the header */
}
.nav-toggle svg { display: block; }
@media (max-width: 1024px) {
  .nav-toggle { display: inline-flex; }
  .main-nav {
    display: flex !important; flex-direction: column; align-items: stretch;
    position: fixed; left: 0; right: 0; top: var(--nav-top, 60px);
    gap: 0; margin: 0; padding: 6px 0;
    background: var(--surface, #14181f);
    border-top: 1px solid var(--border, rgba(255,255,255,0.10));
    box-shadow: 0 14px 30px rgba(0,0,0,0.4);
    max-height: 0; overflow: hidden; visibility: hidden; opacity: 0;
    transition: max-height .25s ease, opacity .2s ease;
    z-index: 1200;
  }
  body.nav-open .main-nav { max-height: 82vh; overflow: auto; visibility: visible; opacity: 1; }
  .main-nav a { padding: 14px 22px; width: 100%; min-height: 44px; display: flex; align-items: center; }
}


/* ── Mobile sticky CTA (injected by inject_slots.py) ─────────────────── */
.mobile-cta-bar { display: none; }
@media (max-width: 768px) {
  .mobile-cta-bar {
    display: block;
    position: fixed; left: 0; right: 0; bottom: 0;
    z-index: 1300;
    padding: 9px 14px;
    padding-bottom: calc(9px + env(safe-area-inset-bottom, 0px));
    background: var(--surface, #141821);
    border-top: 1px solid var(--border, rgba(255,255,255,0.10));
    box-shadow: 0 -6px 22px rgba(0,0,0,0.4);
  }
  .mobile-cta-bar__btn {
    display: flex; align-items: center; justify-content: center;
    width: 100%; min-height: 48px;
    font-family: var(--font-head, system-ui, sans-serif);
    font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
    font-size: 1rem; text-decoration: none;
    border-radius: var(--radius, 8px);
    background: var(--accent, #00F0B0);
    color: var(--bg, #0c1622);
  }
  .mobile-cta-bar__btn:active { filter: brightness(1.08); }
  /* keep the footer / page bottom clear of the fixed bar */
  body { padding-bottom: 76px; }
}
/* Regional language navigation and legal-localisation content */
.locale-switcher {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: auto;
  padding: 4px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.2);
}

.locale-switcher a {
  min-width: 34px;
  padding: 6px 8px;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  text-decoration: none;
}

.locale-switcher a:hover,
.locale-switcher a[aria-current="page"] {
  background: var(--accent);
  color: #151515;
}

.locale-hero .hero-overlay {
  max-width: 820px;
}

.locale-hero .hero-title {
  max-width: 780px;
}

.locale-notice-wrap {
  padding-top: 28px;
  padding-bottom: 0;
}

.location-notice {
  padding: 24px;
  border: 1px solid rgba(255, 204, 0, 0.34);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(255, 204, 0, 0.11), rgba(255, 255, 255, 0.035));
}

.location-notice strong {
  color: var(--accent);
  font-family: "Sora", sans-serif;
  font-size: 1.05rem;
}

.location-notice p {
  margin: 10px 0 16px;
}

.locale-page {
  padding-top: 52px;
}

.locale-page .location-notice {
  margin: 24px 0 30px;
}

.locale-grid .cat-card p {
  color: rgba(255, 255, 255, 0.68);
}

.verified-facts {
  border-left: 3px solid var(--accent-aqua);
}

.verified-facts .source-note {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-muted);
  font-size: 0.86rem;
}

.verified-facts .source-note a {
  white-space: nowrap;
}

@media (max-width: 1180px) {
  .header-inner .locale-switcher {
    order: 3;
  }
}

@media (max-width: 820px) {
  .header-inner {
    flex-wrap: wrap;
  }

  .header-inner .locale-switcher {
    order: 4;
    flex: 1 0 100%;
    justify-content: center;
    max-width: none;
    margin-left: 0;
    overflow: visible;
  }

  .locale-switcher a {
    min-width: 30px;
    padding: 6px;
  }

  .locale-page {
    padding-top: 28px;
  }
}

/* Keyboard users must be able to reveal and identify the game action. */
.game-tile:focus-within .play-overlay { opacity: 1; }
.play-btn:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
