/* Shared light theme for all SpoofGlobal pages */
html.light{
  --bg:#f8f9fb;
  --bg2:#ffffff;
  --bg3:#f0f1f5;
  --surface:#ffffff;
  --border:rgba(0,0,0,0.08);
  --border2:rgba(0,0,0,0.12);
  --card-border:rgba(0,0,0,0.08);
  --accent:#636bff;
  --accent2:#4f54d9;
  --accent-dim:rgba(99,107,255,0.06);
  --accent-glow:rgba(99,107,255,0.1);
  --accent-glow2:rgba(99,107,255,0.04);
  --green:#16a34a;
  --amber:#d97706;
  --w95:rgba(0,0,0,0.95);
  --w80:rgba(0,0,0,0.85);
  --w70:rgba(0,0,0,0.7);
  --w60:rgba(0,0,0,0.7);
  --w50:rgba(0,0,0,0.55);
  --w40:rgba(0,0,0,0.55);
  --w30:rgba(0,0,0,0.3);
  --w20:rgba(0,0,0,0.18);
  --w15:rgba(0,0,0,0.1);
  --w10:rgba(0,0,0,0.08);
  --w08:rgba(0,0,0,0.06);
  --w05:rgba(0,0,0,0.04);
  --w04:rgba(0,0,0,0.03);
}
html.light body{background:var(--bg)}
html.light ::-webkit-scrollbar-track{background:var(--bg)}
html.light ::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.15)}
html.light .header-inner{background:rgba(255,255,255,0.8);border-color:var(--border2)}
html.light header.scrolled .header-inner{background:rgba(255,255,255,0.92);box-shadow:0 4px 20px rgba(0,0,0,0.06)}
html.light nav a{color:rgba(0,0,0,0.55);font-weight:500}
html.light nav a:hover{color:rgba(0,0,0,0.9);background:rgba(0,0,0,0.04)}
html.light .btn-secondary{color:rgba(0,0,0,0.6)}
html.light .btn-secondary:hover{color:rgba(0,0,0,0.9);background:rgba(0,0,0,0.04)}
html.light footer{border-color:var(--border)}
html.light .mob-menu{background:rgba(255,255,255,0.98)}
html.light .mob-menu a{color:rgba(0,0,0,0.7)}
html.light .mob-menu a:hover{color:rgba(0,0,0,0.95)}
html.light .mob-close{border-color:var(--border);color:rgba(0,0,0,0.6)}
/* Theme toggle */
.theme-btn{background:none;border:1px solid transparent;cursor:pointer;padding:6px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--w40);transition:all .2s}
.theme-btn:hover{background:var(--w05);color:var(--w80);border-color:var(--border)}
.theme-btn svg{width:16px;height:16px}
.theme-btn .sun{display:none}
.theme-btn .moon{display:block}
html.light .theme-btn .sun{display:block}
html.light .theme-btn .moon{display:none}
/* Font weight boost for small text in light mode */
html.light p,html.light li,html.light td,html.light span{font-weight:450}
html.light h1,html.light h2,html.light h3,html.light h4{font-weight:700}
html.light strong{font-weight:700}
/* Common page elements */
html.light .hero-btn.primary{box-shadow:0 0 20px rgba(99,107,255,0.15),0 4px 12px rgba(0,0,0,0.08)}
html.light .cta-band{border-color:var(--border)}
html.light .divider{background:linear-gradient(90deg,transparent,var(--border),transparent)}