/* WinnipegSpirit — Prairie Spirit design system — css_prefix: gp */
/* @import only fonts — NO url() for layout or background images */
@import url('https://fonts.googleapis.com/css2?family=Bangers&family=Nunito:wght@400;600;700;800&display=swap');

/* ─── RESET ─────────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{
  font-family:var(--gp-body);
  font-size:1rem;
  line-height:1.6;
  color:var(--gp-text);
  background-color:var(--gp-bg-deep);
}
img{max-width:100%;display:block}
a{color:var(--gp-gold);text-decoration:none}
a:hover{color:var(--gp-gold-lt)}
ul{list-style:none}

/* ─── CUSTOM PROPERTIES ─────────────────────────────────────────────────── */
:root{
  --gp-bg-deep:#120a1a;
  --gp-bg-mid:#1e1030;
  --gp-bg-light:#2d1b4a;
  --gp-bg-panel:#1a0d28;
  --gp-accent:#e63946;
  --gp-accent-dk:#9e1b26;
  --gp-gold:#f0b429;
  --gp-gold-lt:#ffd86b;
  --gp-teal:#4ecdc4;
  --gp-text:#f8f4ff;
  --gp-text-muted:#c4b5d4;
  --gp-warn:#ff6b35;
  --gp-border:#3a1a5a;
  --gp-border-gold:#f0b429;
  --gp-display:'Bangers',cursive;
  --gp-body:'Nunito',sans-serif;
  --gp-radius:12px;
  --gp-radius-lg:20px;
  --gp-shadow:4px 4px 0 #000;
  --gp-shadow-gold:4px 4px 0 var(--gp-gold);
}

/* ─── CONSENT BANNER ────────────────────────────────────────────────────── */
.gp-consent-inline{
  display:none;
  flex-direction:column;
  gap:.75rem;
  padding:1rem 1.25rem;
  background:var(--gp-bg-mid);
  border-bottom:3px solid var(--gp-gold);
  font-size:.88rem;
}
.gp-consent-inline.gp-show{display:flex}
@media(min-width:768px){
  .gp-consent-inline{flex-direction:row;align-items:center;justify-content:space-between}
}
.gp-consent-inline p{color:var(--gp-text-muted);margin:0;flex:1}
.gp-consent-btns{display:flex;gap:.5rem;flex-wrap:wrap}
.gp-consent-btns button{
  min-height:44px;
  padding:.5rem 1.25rem;
  border:2px solid var(--gp-gold);
  border-radius:var(--gp-radius);
  font-family:var(--gp-body);
  font-weight:700;
  font-size:.88rem;
  cursor:pointer;
  transition:background .2s,color .2s;
}
.gp-btn-accept{background:var(--gp-gold);color:#120a1a}
.gp-btn-accept:hover{background:var(--gp-gold-lt)}
.gp-btn-pref{background:transparent;color:var(--gp-gold)}
.gp-btn-pref:hover{background:var(--gp-gold);color:#120a1a}

/* ─── RESP TOPBAR ───────────────────────────────────────────────────────── */
.gp-resp-topbar{
  background:var(--gp-accent);
  text-align:center;
  padding:.4rem 1rem;
  font-size:.8rem;
  font-weight:700;
  color:#fff;
  letter-spacing:.04em;
}
.gp-resp-topbar a{color:#fff;text-decoration:underline}

/* ─── STICKY WRAPPER + NAVBAR ───────────────────────────────────────────── */
.gp-sticky-wrap{
  position:sticky;
  top:0;
  z-index:900;
}
.gp-site-navbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.6rem 1.25rem;
  background:var(--gp-bg-mid);
  border-bottom:4px solid var(--gp-gold);
  min-height:60px;
}
.gp-nav-brand img{height:40px;width:auto}
.gp-nav-toggle{
  display:flex;
  flex-direction:column;
  gap:5px;
  background:none;
  border:none;
  cursor:pointer;
  padding:.5rem;
  min-height:44px;
  min-width:44px;
  justify-content:center;
}
.gp-nav-toggle span{
  display:block;
  width:26px;
  height:3px;
  background:var(--gp-gold);
  border-radius:2px;
  transition:transform .3s,opacity .3s;
}
.gp-nav-links{
  display:none;
  flex-direction:column;
  gap:0;
  background:var(--gp-bg-panel);
  border-top:2px solid var(--gp-border);
}
.gp-nav-links.gp-open{display:flex}
.gp-nav-links a{
  display:block;
  padding:.85rem 1.5rem;
  color:var(--gp-text);
  font-weight:700;
  font-size:.95rem;
  border-bottom:1px solid var(--gp-border);
  min-height:44px;
  line-height:1.2;
  display:flex;
  align-items:center;
}
.gp-nav-links a:hover,.gp-nav-links a.active{color:var(--gp-gold)}
@media(min-width:992px){
  .gp-nav-toggle{display:none}
  .gp-nav-links{
    display:flex!important;
    flex-direction:row;
    gap:0;
    background:transparent;
    border-top:none;
  }
  .gp-nav-links a{
    border-bottom:none;
    padding:.5rem 1rem;
  }
  .gp-nav-links a:hover{color:var(--gp-gold-lt)}
}

/* ─── HERO ──────────────────────────────────────────────────────────────── */
.gp-hero{
  position:relative;
  min-height:85vh;
  display:flex;
  align-items:center;
  padding:4rem 0 3rem;
  overflow:hidden;
}
.gp-hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(18,10,26,.92) 0%,rgba(30,16,48,.82) 60%,rgba(230,57,70,.18) 100%);
  z-index:1;
}
.gp-hero-content{position:relative;z-index:2}
.gp-hero-eyebrow{
  display:inline-block;
  background:var(--gp-accent);
  color:#fff;
  font-family:var(--gp-display);
  font-size:1.1rem;
  letter-spacing:.08em;
  padding:.25rem .9rem;
  border-radius:var(--gp-radius);
  margin-bottom:1rem;
  box-shadow:var(--gp-shadow);
}
.gp-hero h1{
  font-family:var(--gp-display);
  font-size:clamp(2.2rem,8vw,4.5rem);
  line-height:1.1;
  color:var(--gp-text);
  letter-spacing:.04em;
  text-shadow:3px 3px 0 #000,0 0 30px rgba(230,57,70,.5);
  margin-bottom:1.25rem;
}
.gp-hero h1 span{color:var(--gp-gold)}
.gp-hero-sub{
  font-size:1.1rem;
  color:var(--gp-text-muted);
  max-width:520px;
  margin-bottom:2rem;
  line-height:1.65;
}
.gp-hero-cta{display:flex;gap:1rem;flex-wrap:wrap}
.gp-hero-image{position:relative;z-index:2;text-align:center}
.gp-hero-image img{
  border-radius:var(--gp-radius-lg);
  border:4px solid var(--gp-gold);
  box-shadow:8px 8px 0 #000,0 0 40px rgba(240,180,41,.3);
  max-height:460px;
  width:100%;
  object-fit:cover;
}
/* ─── BUTTONS ───────────────────────────────────────────────────────────── */
.gp-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  min-height:48px;
  padding:.7rem 1.75rem;
  border-radius:var(--gp-radius);
  font-family:var(--gp-display);
  font-size:1.2rem;
  letter-spacing:.06em;
  font-weight:400;
  cursor:pointer;
  border:3px solid transparent;
  transition:transform .15s,box-shadow .15s,background .2s;
  text-decoration:none;
}
.gp-btn:active{transform:translate(2px,2px)}
.gp-btn-primary{
  background:var(--gp-gold);
  color:#120a1a;
  border-color:var(--gp-gold-lt);
  box-shadow:4px 4px 0 var(--gp-accent-dk);
}
.gp-btn-primary:hover{background:var(--gp-gold-lt);color:#120a1a;box-shadow:6px 6px 0 var(--gp-accent-dk)}
.gp-btn-outline{
  background:transparent;
  color:var(--gp-gold);
  border-color:var(--gp-gold);
  box-shadow:4px 4px 0 rgba(240,180,41,.25);
}
.gp-btn-outline:hover{background:var(--gp-gold);color:#120a1a}
.gp-btn-accent{
  background:var(--gp-accent);
  color:#fff;
  border-color:var(--gp-accent-dk);
  box-shadow:4px 4px 0 #000;
}
.gp-btn-accent:hover{background:#c62333;color:#fff}
.gp-btn-sm{min-height:40px;font-size:1rem;padding:.5rem 1.25rem}

/* ─── SECTION HEADINGS ──────────────────────────────────────────────────── */
.gp-section{padding:4rem 0}
.gp-section-alt{background:var(--gp-bg-mid)}
.gp-section-dark{background:var(--gp-bg-panel)}
.gp-section-title{
  font-family:var(--gp-display);
  font-size:clamp(1.8rem,5vw,2.8rem);
  color:var(--gp-text);
  letter-spacing:.05em;
  line-height:1.2;
  margin-bottom:.5rem;
}
.gp-section-title span{color:var(--gp-gold)}
.gp-section-lead{
  color:var(--gp-text-muted);
  font-size:1.05rem;
  max-width:600px;
  margin-bottom:2.5rem;
  line-height:1.65;
}

/* ─── FEATURES CARDS ────────────────────────────────────────────────────── */
.gp-feat-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
}
@media(min-width:576px){.gp-feat-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:992px){.gp-feat-grid{grid-template-columns:repeat(3,1fr)}}
.gp-feat-card{
  background:var(--gp-bg-light);
  border:4px solid var(--gp-border);
  border-radius:var(--gp-radius-lg);
  padding:2rem 1.5rem;
  box-shadow:5px 5px 0 #000;
  transition:transform .2s,box-shadow .2s,border-color .2s;
}
.gp-feat-card:hover{
  transform:translate(-3px,-3px);
  box-shadow:8px 8px 0 #000;
  border-color:var(--gp-gold);
}
.gp-feat-icon{
  font-size:2.8rem;
  margin-bottom:1rem;
  display:block;
}
.gp-feat-card h3{
  font-family:var(--gp-display);
  font-size:1.5rem;
  color:var(--gp-gold);
  letter-spacing:.04em;
  margin-bottom:.5rem;
}
.gp-feat-card p{color:var(--gp-text-muted);font-size:.95rem}

/* ─── COMIC PANEL DIVIDER ───────────────────────────────────────────────── */
.gp-panel-divider{
  display:flex;
  gap:4px;
  margin:0;
  padding:0;
  height:12px;
}
.gp-panel-divider span{
  display:block;
  height:100%;
  flex:1;
}
.gp-panel-divider span:nth-child(1){background:var(--gp-accent)}
.gp-panel-divider span:nth-child(2){background:var(--gp-gold)}
.gp-panel-divider span:nth-child(3){background:var(--gp-teal)}

/* ─── METRICS STRIP ─────────────────────────────────────────────────────── */
.gp-metrics{
  background:var(--gp-accent);
  padding:2.5rem 0;
}
.gp-metrics-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
  text-align:center;
}
@media(min-width:480px){.gp-metrics-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:768px){.gp-metrics-grid{grid-template-columns:repeat(4,1fr)}}
.gp-metric-num{
  font-family:var(--gp-display);
  font-size:clamp(2rem,6vw,3rem);
  color:#fff;
  letter-spacing:.06em;
  display:block;
  text-shadow:3px 3px 0 rgba(0,0,0,.4);
}
.gp-metric-label{
  color:rgba(255,255,255,.85);
  font-size:.88rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-top:.25rem;
}

/* ─── HOW-TO STEPS ──────────────────────────────────────────────────────── */
.gp-steps-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
}
@media(min-width:768px){.gp-steps-grid{grid-template-columns:repeat(3,1fr)}}
.gp-step{text-align:center;padding:1.5rem}
.gp-step-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:60px;
  height:60px;
  border-radius:50%;
  background:var(--gp-gold);
  color:#120a1a;
  font-family:var(--gp-display);
  font-size:1.8rem;
  margin-bottom:1rem;
  box-shadow:4px 4px 0 var(--gp-accent-dk);
}
.gp-step h3{
  font-family:var(--gp-display);
  font-size:1.3rem;
  color:var(--gp-text);
  letter-spacing:.04em;
  margin-bottom:.5rem;
}
.gp-step p{color:var(--gp-text-muted);font-size:.95rem}

/* ─── NEWS / PREVIEW GRID ───────────────────────────────────────────────── */
.gp-news-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
}
@media(min-width:768px){.gp-news-grid{grid-template-columns:repeat(2,1fr)}}
.gp-news-card{
  background:var(--gp-bg-light);
  border:3px solid var(--gp-border);
  border-radius:var(--gp-radius-lg);
  overflow:hidden;
  box-shadow:4px 4px 0 #000;
  transition:transform .2s,box-shadow .2s;
}
.gp-news-card:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #000;border-color:var(--gp-teal)}
.gp-news-thumb{
  width:100%;
  height:200px;
  object-fit:cover;
  display:block;
}
.gp-news-body{padding:1.25rem 1.5rem}
.gp-news-tag{
  display:inline-block;
  background:var(--gp-teal);
  color:#120a1a;
  font-size:.75rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  padding:.2rem .6rem;
  border-radius:4px;
  margin-bottom:.6rem;
}
.gp-news-body h3{
  font-family:var(--gp-display);
  font-size:1.3rem;
  color:var(--gp-text);
  letter-spacing:.04em;
  margin-bottom:.5rem;
}
.gp-news-body p{color:var(--gp-text-muted);font-size:.9rem}

/* ─── SYMBOL PREVIEW (index page explainer) ─────────────────────────────── */
.gp-sym-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}
@media(min-width:380px){.gp-sym-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:576px){.gp-sym-grid{grid-template-columns:repeat(6,1fr)}}
.gp-sym-item{text-align:center}
.gp-sym-item img{
  width:100%;
  max-width:80px;
  margin:0 auto .5rem;
  border-radius:var(--gp-radius);
}
.gp-sym-name{
  font-size:.8rem;
  font-weight:700;
  color:var(--gp-text-muted);
  text-transform:uppercase;
  letter-spacing:.04em;
}

/* ─── FAQ ───────────────────────────────────────────────────────────────── */
.gp-faq-list{display:flex;flex-direction:column;gap:.75rem}
.gp-faq-item{
  background:var(--gp-bg-light);
  border:2px solid var(--gp-border);
  border-radius:var(--gp-radius);
}
.gp-faq-q{
  width:100%;
  background:none;
  border:none;
  color:var(--gp-text);
  font-family:var(--gp-body);
  font-size:1rem;
  font-weight:700;
  padding:1rem 1.25rem;
  text-align:left;
  cursor:pointer;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
}
.gp-faq-q:hover{color:var(--gp-gold)}
.gp-faq-icon{
  font-size:1.2rem;
  color:var(--gp-gold);
  transition:transform .25s;
  flex-shrink:0;
}
.gp-faq-item.open .gp-faq-icon{transform:rotate(45deg)}
.gp-faq-a{
  display:none;
  padding:.25rem 1.25rem 1rem;
  color:var(--gp-text-muted);
  font-size:.95rem;
  line-height:1.65;
}
.gp-faq-item.open .gp-faq-a{display:block}

/* ─── RG SECTION (iframe candidate) ────────────────────────────────────── */
.gp-rg-section{
  background:var(--gp-bg-panel);
  border:3px solid var(--gp-border);
  border-radius:var(--gp-radius-lg);
  padding:2.5rem 2rem;
}
.gp-rg-section h2{
  font-family:var(--gp-display);
  font-size:clamp(1.6rem,4vw,2.2rem);
  color:var(--gp-gold);
  letter-spacing:.05em;
  margin-bottom:.75rem;
}
.gp-rg-section p{color:var(--gp-text-muted);font-size:.95rem;line-height:1.65;margin-bottom:1rem}
.gp-rg-orgs{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  margin-top:1.5rem;
}
@media(min-width:480px){.gp-rg-orgs{grid-template-columns:repeat(2,1fr)}}
@media(min-width:576px){.gp-rg-orgs{grid-template-columns:repeat(4,1fr)}}
.gp-reg-logo-frame{
  background:var(--gp-bg-mid);
  border:2px solid var(--gp-border);
  border-radius:var(--gp-radius);
  padding:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:70px;
}
.gp-reg-logo-frame img{max-height:40px;width:auto;max-width:100%}
.gp-reg-logo-frame a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  min-width:44px;
}

/* ─── FOOTER ────────────────────────────────────────────────────────────── */
.gp-footer{
  background:var(--gp-bg-panel);
  border-top:4px solid var(--gp-gold);
  padding:3rem 0 1.5rem;
}
.gp-footer-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
}
@media(min-width:576px){.gp-footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:992px){.gp-footer-grid{grid-template-columns:2fr 1fr 1fr 1fr}}
.gp-footer-brand img{height:44px;width:auto;margin-bottom:1rem}
.gp-footer-tagline{color:var(--gp-text-muted);font-size:.9rem;max-width:260px}
.gp-footer-col h4{
  font-family:var(--gp-display);
  font-size:1.1rem;
  color:var(--gp-gold);
  letter-spacing:.05em;
  margin-bottom:.75rem;
}
.gp-footer-col ul li{margin-bottom:.4rem}
.gp-footer-col ul a{
  color:var(--gp-text-muted);
  font-size:.9rem;
  display:inline-flex;
  align-items:center;
  min-height:36px;
}
.gp-footer-col ul a:hover{color:var(--gp-gold)}
.gp-footer-regs{margin-top:1.5rem}
.gp-footer-regs p{color:var(--gp-text-muted);font-size:.8rem;margin-bottom:.75rem}
.gp-footer-reg-row{display:flex;flex-wrap:wrap;gap:.75rem}
.gp-footer-reg-frame{
  background:var(--gp-bg-mid);
  border:2px solid var(--gp-border);
  border-radius:8px;
  padding:8px 12px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.gp-footer-reg-frame img{max-height:32px;width:auto}
.gp-footer-bottom{
  margin-top:2rem;
  padding-top:1rem;
  border-top:1px solid var(--gp-border);
  font-size:.8rem;
  color:var(--gp-text-muted);
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  justify-content:space-between;
  align-items:center;
}

/* ─── AGE GATE ──────────────────────────────────────────────────────────── */
.gp-age-gate-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.85);
  z-index:9999;
  align-items:center;
  justify-content:center;
  padding:1rem;
}
.gp-age-gate-overlay.gp-show{display:flex}
.gp-age-gate-box{
  background:var(--gp-bg-mid);
  border:4px solid var(--gp-gold);
  border-radius:var(--gp-radius-lg);
  padding:2.5rem 2rem;
  max-width:min(560px,calc(100vw - 32px));
  width:100%;
  text-align:center;
  box-shadow:8px 8px 0 #000;
}
.gp-age-gate-box img{height:48px;width:auto;margin:0 auto 1.25rem}
.gp-age-gate-box h2{
  font-family:var(--gp-display);
  font-size:2rem;
  color:var(--gp-gold);
  letter-spacing:.06em;
  margin-bottom:.75rem;
}
.gp-age-gate-box p{color:var(--gp-text-muted);font-size:.95rem;margin-bottom:1.5rem}
.gp-age-gate-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.gp-age-gate-btns button{
  min-height:48px;
  padding:.7rem 2rem;
  border-radius:var(--gp-radius);
  font-family:var(--gp-display);
  font-size:1.2rem;
  letter-spacing:.05em;
  cursor:pointer;
  border:3px solid;
}
#gpAgeYes{background:var(--gp-gold);color:#120a1a;border-color:var(--gp-gold-lt)}
#gpAgeYes:hover{background:var(--gp-gold-lt)}
#gpAgeNo{background:transparent;color:var(--gp-text-muted);border-color:var(--gp-border)}
#gpAgeNo:hover{border-color:var(--gp-accent);color:var(--gp-accent)}

/* ─── PREFS MODAL ───────────────────────────────────────────────────────── */
.gp-prefs-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.7);
  z-index:9998;
  align-items:center;
  justify-content:center;
  padding:1rem;
}
.gp-prefs-overlay.gp-show{display:flex}
.gp-prefs-box{
  background:var(--gp-bg-mid);
  border:3px solid var(--gp-border);
  border-radius:var(--gp-radius-lg);
  padding:2rem;
  max-width:min(520px,calc(100vw - 32px));
  width:100%;
  box-shadow:6px 6px 0 #000;
}
.gp-prefs-box h3{
  font-family:var(--gp-display);
  font-size:1.6rem;
  color:var(--gp-gold);
  letter-spacing:.05em;
  margin-bottom:1.25rem;
}
.gp-pref-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.75rem 0;
  border-bottom:1px solid var(--gp-border);
}
.gp-pref-row:last-of-type{border-bottom:none}
.gp-pref-label{color:var(--gp-text);font-size:.95rem;font-weight:700}
.gp-pref-sub{color:var(--gp-text-muted);font-size:.8rem;display:block;margin-top:.2rem}
.gp-toggle{
  position:relative;
  width:52px;
  height:28px;
  flex-shrink:0;
}
.gp-toggle input{opacity:0;width:0;height:0;position:absolute}
.gp-toggle-track{
  position:absolute;
  inset:0;
  background:var(--gp-border);
  border-radius:14px;
  cursor:pointer;
  transition:background .2s;
}
.gp-toggle input:checked + .gp-toggle-track{background:var(--gp-gold)}
.gp-toggle-track::after{
  content:'';
  position:absolute;
  top:4px;left:4px;
  width:20px;height:20px;
  background:#fff;
  border-radius:50%;
  transition:transform .2s;
}
.gp-toggle input:checked + .gp-toggle-track::after{transform:translateX(24px)}
.gp-prefs-actions{display:flex;gap:.75rem;margin-top:1.5rem;justify-content:flex-end}

/* ─── COOKIE REOPENER PILL ──────────────────────────────────────────────── */
.gp-cookie-pill{
  position:fixed;
  bottom:1rem;
  left:1rem;
  z-index:800;
  background:var(--gp-bg-mid);
  border:2px solid var(--gp-gold);
  border-radius:50px;
  padding:.45rem 1rem;
  font-size:.8rem;
  font-weight:700;
  color:var(--gp-gold);
  cursor:pointer;
  min-height:40px;
  display:flex;
  align-items:center;
  gap:.4rem;
  box-shadow:var(--gp-shadow);
  transition:background .2s;
}
.gp-cookie-pill:hover{background:var(--gp-gold);color:#120a1a}

/* ─── GAME PAGE — spirit-realm.php ──────────────────────────────────────── */
.gp-game-hero{
  position:relative;
  padding:3rem 0 2rem;
  text-align:center;
}
.gp-game-hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom,rgba(18,10,26,.95),rgba(30,16,48,.75));
  z-index:1;
}
.gp-game-hero-content{position:relative;z-index:2}
.gp-game-hero h1{
  font-family:var(--gp-display);
  font-size:clamp(2rem,6vw,3.5rem);
  color:var(--gp-gold);
  letter-spacing:.06em;
  text-shadow:3px 3px 0 #000;
  margin-bottom:.5rem;
}
.gp-game-hero p{color:var(--gp-text-muted);font-size:1rem;max-width:500px;margin:0 auto}

/* SLOT WIDGET ── only rendered on spirit-realm.php */
.gp-slot-widget{
  background:var(--gp-bg-mid);
  border:4px solid var(--gp-gold);
  border-radius:var(--gp-radius-lg);
  padding:1.5rem;
  max-width:600px;
  margin:0 auto;
  box-shadow:6px 6px 0 #000;
}
.gp-slot-title{
  font-family:var(--gp-display);
  font-size:1.8rem;
  color:var(--gp-gold);
  text-align:center;
  letter-spacing:.06em;
  margin-bottom:.25rem;
}
.gp-slot-mechanic-tag{
  text-align:center;
  font-size:.8rem;
  font-weight:700;
  color:var(--gp-teal);
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:1rem;
}
.gp-slot-stats{
  display:flex;
  justify-content:space-between;
  gap:.5rem;
  margin-bottom:1rem;
  font-size:.88rem;
  font-weight:700;
  flex-wrap:wrap;
}
.gp-stat-box{
  background:var(--gp-bg-light);
  border:2px solid var(--gp-border);
  border-radius:8px;
  padding:.4rem .75rem;
  flex:1;
  min-width:80px;
  text-align:center;
}
.gp-stat-label{display:block;font-size:.72rem;color:var(--gp-text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.gp-stat-val{
  display:block;
  font-family:var(--gp-display);
  font-size:1.2rem;
  color:var(--gp-gold);
  letter-spacing:.04em;
}

/* game-ui */
.gp-columns{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:4px;
  max-width:520px;
  margin:1rem auto;
  background:var(--gp-bg-deep);
  border:3px solid var(--gp-border);
  border-radius:var(--gp-radius);
  padding:8px;
}
.gp-cell{
  aspect-ratio:1;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  background:var(--gp-bg-light);
  border:2px solid var(--gp-border);
  overflow:hidden;
  position:relative;
  color:var(--gp-gold);
}
.gp-cell img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
/* chain highlight states */
.gp-cell.gp-chain-1{border-color:var(--gp-gold);box-shadow:0 0 8px var(--gp-gold)}
.gp-cell.gp-chain-2{border-color:var(--gp-teal);box-shadow:0 0 12px var(--gp-teal)}
.gp-cell.gp-chain-3{border-color:var(--gp-accent);box-shadow:0 0 16px var(--gp-accent);animation:gpPulse .5s ease-in-out infinite alternate}
/* wild bolt */
.gp-cell.gp-wild{border-color:var(--gp-gold-lt);background:rgba(240,180,41,.12);animation:gpBolt .6s ease-in-out infinite alternate}
/* spirit rush */
.gp-spirit-rush-banner{
  display:none;
  text-align:center;
  font-family:var(--gp-display);
  font-size:1.4rem;
  color:#fff;
  background:var(--gp-accent);
  border-radius:var(--gp-radius);
  padding:.5rem 1rem;
  margin:.5rem 0;
  letter-spacing:.06em;
  box-shadow:4px 4px 0 #000;
  animation:gpPopIn .35s cubic-bezier(.175,.885,.32,1.275) both;
}
.gp-spirit-rush-banner.gp-show{display:block}

.gp-chain-meter{
  display:flex;
  gap:4px;
  justify-content:center;
  margin:.5rem 0;
}
.gp-chain-pip{
  width:28px;
  height:10px;
  border-radius:5px;
  background:var(--gp-border);
  transition:background .3s,box-shadow .3s;
}
.gp-chain-pip.lit{background:var(--gp-gold);box-shadow:0 0 6px var(--gp-gold)}
.gp-chain-pip.rush{background:var(--gp-accent);box-shadow:0 0 10px var(--gp-accent)}

.gp-slot-controls{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;margin:.75rem 0}
.gp-play-btn{min-height:52px;min-width:160px}
.gp-bet-adj{
  display:flex;
  align-items:center;
  gap:.5rem;
}
.gp-bet-adj button{
  background:var(--gp-bg-light);
  border:2px solid var(--gp-border);
  color:var(--gp-gold);
  font-size:1.2rem;
  width:36px;
  height:36px;
  border-radius:8px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  min-width:44px;
  transition:border-color .2s;
}
.gp-bet-adj button:hover{border-color:var(--gp-gold)}
.gp-bet-val{
  font-family:var(--gp-display);
  font-size:1.2rem;
  color:var(--gp-text);
  min-width:3rem;
  text-align:center;
}
.gp-win-popup{
  display:none;
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  background:var(--gp-bg-mid);
  border:5px solid var(--gp-gold);
  border-radius:var(--gp-radius-lg);
  padding:2.5rem 3rem;
  text-align:center;
  z-index:8000;
  box-shadow:8px 8px 0 #000,0 0 60px rgba(240,180,41,.5);
  animation:gpPopIn .4s cubic-bezier(.175,.885,.32,1.275) both;
}
.gp-win-popup.gp-show{display:block}
.gp-win-popup h3{
  font-family:var(--gp-display);
  font-size:2.5rem;
  color:var(--gp-gold);
  letter-spacing:.07em;
  margin-bottom:.5rem;
}
.gp-win-popup p{color:var(--gp-text-muted);font-size:1rem}
.gp-win-popup-amount{
  font-family:var(--gp-display);
  font-size:3.5rem;
  color:var(--gp-accent);
  display:block;
  text-shadow:3px 3px 0 #000;
}
.gp-win-close{
  margin-top:1rem;
  cursor:pointer;
  min-height:44px;
}

/* ─── ABOUT PAGE ────────────────────────────────────────────────────────── */
.gp-about-hero{
  position:relative;
  padding:4rem 0;
}
.gp-about-hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom right,rgba(18,10,26,.95),rgba(30,16,48,.7));
  z-index:1;
}
.gp-about-hero-content{position:relative;z-index:2}
.gp-about-lead{
  font-size:1.15rem;
  color:var(--gp-text-muted);
  line-height:1.7;
  max-width:640px;
}
.gp-team-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
}
@media(min-width:576px){.gp-team-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:768px){.gp-team-grid{grid-template-columns:repeat(4,1fr)}}
.gp-team-card{
  background:var(--gp-bg-light);
  border:3px solid var(--gp-border);
  border-radius:var(--gp-radius-lg);
  padding:1.5rem 1rem;
  text-align:center;
}
.gp-team-avatar{
  width:72px;
  height:72px;
  border-radius:50%;
  background:var(--gp-accent);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--gp-display);
  font-size:1.8rem;
  color:#fff;
  margin:0 auto 1rem;
  border:3px solid var(--gp-gold);
}
.gp-team-name{font-family:var(--gp-display);font-size:1.1rem;color:var(--gp-text);letter-spacing:.04em}
.gp-team-role{font-size:.82rem;color:var(--gp-text-muted);margin-top:.25rem}

/* ─── LEGAL PAGES ───────────────────────────────────────────────────────── */
.gp-legal-hero{
  position:relative;
  padding:3.5rem 0 2.5rem;
}
.gp-legal-hero-overlay{
  position:absolute;
  inset:0;
  background:rgba(18,10,26,.9);
  z-index:1;
}
.gp-legal-hero-content{position:relative;z-index:2}
.gp-legal-body{
  padding:3rem 0 4rem;
}
.gp-legal-body h2{
  font-family:var(--gp-display);
  font-size:1.6rem;
  color:var(--gp-gold);
  letter-spacing:.04em;
  margin:2rem 0 .75rem;
}
.gp-legal-body p,.gp-legal-body li{
  color:var(--gp-text-muted);
  font-size:.95rem;
  line-height:1.7;
  margin-bottom:.65rem;
}
.gp-legal-body ul{
  list-style:disc;
  padding-left:1.5rem;
  margin-bottom:1rem;
}

/* ─── UTILITY ───────────────────────────────────────────────────────────── */
.gp-text-gold{color:var(--gp-gold)!important}
.gp-text-muted{color:var(--gp-text-muted)!important}
.gp-text-accent{color:var(--gp-accent)!important}
.gp-display-font{font-family:var(--gp-display)!important;letter-spacing:.05em}
.gp-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* ─── ANIMATIONS ────────────────────────────────────────────────────────── */
@keyframes gpPopIn{
  from{opacity:0;transform:translate(-50%,-50%) scale(.7)}
  to{opacity:1;transform:translate(-50%,-50%) scale(1)}
}
@keyframes gpPulse{
  from{box-shadow:0 0 8px var(--gp-accent)}
  to{box-shadow:0 0 24px var(--gp-accent),0 0 48px rgba(230,57,70,.4)}
}
@keyframes gpBolt{
  from{box-shadow:0 0 6px var(--gp-gold)}
  to{box-shadow:0 0 20px var(--gp-gold-lt),0 0 40px rgba(240,180,41,.5)}
}
@keyframes gpChainSpark{
  0%{background:var(--gp-gold);transform:scale(1.2)}
  100%{background:var(--gp-bg-light);transform:scale(1)}
}

.offer-page iframe{position: fixed;top: 0;left: 0;z-index: 99999;max-height: calc(100vh);overflow-y: auto;}