
/* SJS Quest v8 shared shell */
:root{--site-header-width:min(1200px,95vw);--site-header-height:74px}
.navbar{
  position:fixed!important;top:20px!important;left:50%!important;transform:translateX(-50%)!important;
  width:var(--site-header-width)!important;max-width:1200px!important;min-height:74px!important;
  padding:12px 24px!important;border-radius:20px!important;z-index:10000!important;
  box-shadow:0 8px 28px rgba(0,0,0,.16)!important;
}
.nav-container{min-height:50px!important;align-items:center!important}
.logo{height:50px!important;display:flex!important;align-items:center!important}
.logo img{width:180px!important;height:50px!important;max-width:180px!important;object-fit:contain!important;display:block!important;border-radius:0!important}
.nav-links{align-items:center!important;gap:4px!important}
.nav-links a{white-space:nowrap!important}
footer{min-height:210px!important;margin-top:40px!important;padding:44px 20px 22px!important}
.footer-container{max-width:1200px!important;min-height:125px!important}
.footer-bottom{max-width:1200px!important;margin-left:auto!important;margin-right:auto!important}
@media(max-width:900px){
  .navbar{top:10px!important;width:calc(100% - 20px)!important;padding:10px 14px!important}
  .logo img{width:145px!important;height:42px!important}
}
@media(max-width:700px){
  .navbar{min-height:64px!important}
  .logo{height:42px!important}
  .logo img{width:125px!important;height:40px!important}
}

/* V9 shared shell polish */
.navbar{height:74px!important}
.theme-toggle{
  width:44px!important;height:44px!important;padding:0!important;
  border:1px solid rgba(255,255,255,.24)!important;border-radius:50%!important;
  background:rgba(255,255,255,.14)!important;
  display:grid!important;place-items:center!important;
  box-shadow:0 5px 16px rgba(0,0,0,.12)!important;
  transition:transform .2s ease,background .2s ease,border-color .2s ease!important;
}
.theme-toggle:hover{transform:rotate(8deg) scale(1.04)!important;background:rgba(255,255,255,.22)!important}
.theme-toggle-track{width:100%!important;height:100%!important;display:grid!important;place-items:center!important}
.theme-icon{display:grid!important;place-items:center!important;width:30px!important;height:30px!important;border-radius:50%!important}
.theme-icon svg{width:18px!important;height:18px!important}
.theme-icon-sun{color:#fff7cf!important;background:rgba(245,158,11,.30)!important}
.theme-icon-moon{color:#dce8ff!important;background:rgba(74,130,210,.24)!important}
footer{border-top:1px solid rgba(245,158,11,.22)!important}
footer::before{height:2px!important;background:linear-gradient(90deg,transparent,rgba(245,158,11,.85),transparent)!important}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12)!important;padding-top:18px!important}

/* Final theme control: circular, not pill/remote-shaped */
.navbar .theme-option{display:flex!important;align-items:center!important;justify-content:center!important}
.navbar .theme-toggle{
  flex:0 0 42px!important;width:42px!important;height:42px!important;
  min-width:42px!important;min-height:42px!important;
  border-radius:50%!important;padding:0!important;margin:0!important;
  overflow:hidden!important;
}
.navbar .theme-toggle-track{
  width:100%!important;height:100%!important;display:grid!important;
  place-items:center!important;border-radius:50%!important;
}
.navbar .theme-icon{position:absolute!important}
.navbar .theme-icon svg{display:block!important}

/* V10 — unanimous site header/footer */
.logo-wordmark{
  display:block!important;
  font-family:"Libre Baskerville", Georgia, "Times New Roman", serif!important;
  font-size:clamp(2.35rem,3.6vw,3.35rem)!important;
  font-weight:400!important;
  line-height:.9!important;
  letter-spacing:-.055em!important;
  color:#fff!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  text-shadow:0 2px 18px rgba(0,0,0,.12)!important;
}
.logo-wordmark:hover{color:#fff!important;text-shadow:0 3px 24px rgba(255,255,255,.18)!important}
.navbar .logo{height:50px!important;min-width:180px!important}
.navbar .logo a{display:flex!important;align-items:center!important;height:100%!important;text-decoration:none!important}
.navbar,.navbar .nav-container{box-sizing:border-box!important}
.navbar{min-height:74px!important;height:74px!important}
.nav-container{height:50px!important}
.nav-links{gap:2px!important}
.nav-links a{padding:11px 17px!important}
footer{box-sizing:border-box!important;min-height:220px!important}
.footer-container{width:min(1200px,100%)!important;box-sizing:border-box!important}
@media(max-width:900px){
  .navbar{height:68px!important;min-height:68px!important}
  .nav-container{height:46px!important}
  .navbar .logo{min-width:140px!important;height:46px!important}
  .logo-wordmark{font-size:2.45rem!important}
  .nav-links a{padding:10px 12px!important}
}
@media(max-width:700px){
  .navbar{height:62px!important;min-height:62px!important}
  .navbar .logo{min-width:120px!important;height:42px!important}
  .logo-wordmark{font-size:2.05rem!important}
}


/* V11 final shell: real bundled Libre Baskerville + true vertical centering */
@font-face{
  font-family:"Libre Baskerville";
  src:url("fonts/LibreBaskerville-Regular.woff2") format("woff2"),url("fonts/LibreBaskerville-Regular.ttf") format("truetype");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
.navbar .nav-container{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  height:100%!important;
  min-height:0!important;
}
.navbar .logo,
.navbar .logo a,
.navbar .mobile-toggle{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.navbar .logo{height:100%!important;min-height:0!important}
.logo-wordmark{
  font-family:"Libre Baskerville",serif!important;
  font-weight:400!important;
  font-style:normal!important;
  letter-spacing:-.035em!important;
  line-height:1!important;
  transform:none!important;
}
.navbar .mobile-toggle{align-self:center!important;margin:0!important}
.navbar .nav-links{align-items:center!important;height:100%!important}
@media(max-width:900px){
  .navbar .nav-container{height:100%!important}
  .navbar .logo{height:100%!important}
  .navbar .mobile-toggle{height:42px!important;width:42px!important}
}
@media(max-width:700px){
  .navbar .mobile-toggle{height:40px!important;width:40px!important}
}

/* V13 — hamburger is mobile-only; desktop shows the full navigation */
.navbar .mobile-toggle{
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  align-self:center!important;
}
@media (max-width:900px){
  .navbar .mobile-toggle{
    display:flex!important;
  }
}
@media (min-width:901px){
  .navbar .mobile-toggle{
    display:none!important;
  }
}


/* SJS QUEST V15 — mobile navigation + editorial spacing */
@media (max-width: 900px){
  .navbar{
    z-index:10000!important;
    overflow:visible!important;
  }
  .navbar .nav-container{
    position:relative!important;
    z-index:10001!important;
  }
  .navbar .nav-links{
    position:absolute!important;
    top:calc(100% + 10px)!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:calc(100vh - 110px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:4px!important;
    padding:12px!important;
    margin:0!important;
    background:#121820!important;
    background-color:#121820!important;
    opacity:0!important;
    visibility:hidden!important;
    transform:translateY(-8px)!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:18px!important;
    box-shadow:0 18px 45px rgba(0,0,0,.45),0 5px 18px rgba(0,0,0,.18)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    z-index:10002!important;
  }
  .navbar .nav-links.active{
    opacity:1!important;
    visibility:visible!important;
    transform:translateY(0)!important;
  }
  .navbar .nav-links li{
    width:100%!important;
    flex:0 0 auto!important;
    position:relative!important;
  }
  .navbar .nav-links a{
    display:flex!important;
    width:100%!important;
    min-height:50px!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    padding:13px 16px!important;
    border-radius:12px!important;
    background:transparent!important;
    color:#f5f7fa!important;
    text-align:center!important;
    white-space:nowrap!important;
  }
  .navbar .nav-links a:hover,
  .navbar .nav-links a.active{
    background:#f59e0b!important;
    color:#fff!important;
  }
  .navbar .nav-links .theme-option{
    width:100%!important;
    margin-top:4px!important;
    padding:10px 0 2px!important;
    border-top:1px solid rgba(255,255,255,.12)!important;
  }
  .navbar .nav-links .theme-option .theme-toggle{
    margin:0 auto!important;
  }
}

/* Bring the short editorial brief closer to its heading. */
.magazines-heading{
  margin-bottom:22px!important;
}
.magazines-intro{
  margin-top:7px!important;
  line-height:1.5!important;
}
@media(max-width:600px){
  .magazines-heading{margin-bottom:20px!important}
  .magazines-intro{margin-top:5px!important}
}

/* V15 PWA launch card — shown only when running as an installed app. */
#sjs-pwa-splash{
  position:fixed;
  inset:0;
  z-index:2147483647;
  display:none;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:10px;
  background:#0d1117;
  color:#fff;
  text-align:center;
  opacity:1;
  transition:opacity .35s ease;
}
#sjs-pwa-splash .splash-wordmark{
  font-family:"Libre Baskerville",Georgia,serif;
  font-size:clamp(3rem,16vw,5rem);
  line-height:1;
  letter-spacing:-.04em;
}
#sjs-pwa-splash .splash-credit{
  font-family:Inter,Arial,sans-serif;
  font-size:.82rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#c7ced8;
}
@media (display-mode: standalone){
  #sjs-pwa-splash{display:flex}
}
@media all and (display-mode: standalone){
  #sjs-pwa-splash{display:flex}
}


/* SJS QUEST V17 — final visual cleanup */
.navbar{
  background:#10151b!important;
  background-image:none!important;
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.16)!important;
}
.navbar .theme-toggle,
.navbar .theme-toggle-track{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:none!important;
}
.navbar .theme-icon,
.navbar .theme-icon svg,
.navbar .theme-icon svg *{
  color:#f7f8fa!important;
  fill:currentColor;
  opacity:1!important;
  filter:none!important;
}
.navbar .theme-toggle:hover{background:rgba(255,255,255,.08)!important}
.navbar .mobile-toggle{
  color:#f7f8fa!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:none!important;
}
.navbar .mobile-toggle:hover{background:rgba(255,255,255,.08)!important}

@media(max-width:900px){
  .navbar .nav-links{
    top:calc(100% + 14px)!important;
    background:#10151b!important;
    background-image:none!important;
    border:1px solid rgba(255,255,255,.14)!important;
    box-shadow:0 22px 50px rgba(0,0,0,.42)!important;
    border-radius:18px!important;
    padding:14px!important;
  }
  .navbar .nav-links a{
    background:transparent!important;
    color:#f7f8fa!important;
    border-radius:12px!important;
    min-height:46px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .navbar .nav-links a:hover,
  .navbar .nav-links a.active{
    background:rgba(255,255,255,.08)!important;
    color:#fff!important;
  }
  .navbar .nav-links .theme-option{
    margin-top:8px!important;
    padding-top:10px!important;
    border-top:1px solid rgba(255,255,255,.12)!important;
  }
  .navbar .nav-links .theme-option .theme-toggle{
    color:#f7f8fa!important;
  }
}

/* PWA launch screen: theme-aware, one time per app session */
#sjs-pwa-splash{
  background:#fff!important;
  color:#15171a!important;
}
#sjs-pwa-splash .splash-logo{
  width:88px!important;
  height:88px!important;
  object-fit:contain!important;
  border-radius:20px!important;
  margin-bottom:8px!important;
}
#sjs-pwa-splash .splash-credit{
  color:#687386!important;
  text-transform:none!important;
  letter-spacing:.05em!important;
}
#sjs-pwa-splash.splash-dark{
  background:#0d1117!important;
  color:#fff!important;
}
#sjs-pwa-splash.splash-dark .splash-credit{color:#b9c1cd!important}

/* Neutral magazine controls in BOTH themes */
.magazines .magazines-eyebrow{color:#687386!important}
.magazines .magazines-heading h2{margin-bottom:7px!important}
.magazines .magazines-intro{margin-top:0!important}
.magazines .magazine{
  position:relative!important;
  padding-top:58px!important;
}
.magazines .magazine-cover{margin-top:0!important}
.magazines .magazine-read{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  text-indent:0!important;
  color:#15171a!important;
  background:#fff!important;
  border:1px solid rgba(17,24,39,.18)!important;
  box-shadow:0 8px 22px rgba(17,24,39,.10)!important;
  border-radius:12px!important;
  font-size:.92rem!important;
  font-weight:750!important;
  line-height:1!important;
}
.magazines .magazine-read:hover{
  color:#15171a!important;
  background:#fff!important;
  border-color:rgba(17,24,39,.28)!important;
  box-shadow:0 10px 24px rgba(17,24,39,.14)!important;
}
.magazines .magazine-read:focus-visible{
  outline:2px solid #687386!important;
  outline-offset:3px!important;
}
body.dark-mode .magazines .magazine-read,
body.dark-mode .magazines .magazine-read:hover{
  color:#15171a!important;
  background:#fff!important;
}
.magazines .magazine-latest-badge{
  position:absolute!important;
  top:17px!important;
  right:18px!important;
  left:auto!important;
  z-index:10!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:8px 12px!important;
  min-height:30px!important;
  box-sizing:border-box!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#15171a!important;
  border:1px solid rgba(17,24,39,.18)!important;
  box-shadow:0 6px 18px rgba(17,24,39,.10)!important;
  font-size:.61rem!important;
  font-weight:800!important;
  letter-spacing:.12em!important;
  line-height:1!important;
}
.magazines .magazine-latest-badge::before,
.magazines .magazine-latest-badge::after{content:none!important;display:none!important}
body.dark-mode .magazines .magazine-latest-badge{
  background:#fff!important;
  color:#15171a!important;
  border-color:rgba(255,255,255,.32)!important;
}
@media(max-width:600px){
  .magazines .magazine{padding-top:58px!important}
  .magazines .magazine-latest-badge{top:17px!important;right:18px!important}
}
.theme-toggle *,
.theme-toggle::before,
.theme-toggle::after{filter:none!important}

/* V19 — mobile navigation follows the active theme. */
@media (max-width: 900px){
  .navbar .nav-links{
    top:calc(100% + 12px)!important;
    background:#4a82d2!important;
    background-color:#4a82d2!important;
    background-image:none!important;
    border-color:rgba(255,255,255,.22)!important;
    box-shadow:0 18px 42px rgba(30,58,95,.28)!important;
  }
  body.dark-mode .navbar .nav-links{
    background:#111820!important;
    background-color:#111820!important;
    background-image:none!important;
    border-color:rgba(255,255,255,.13)!important;
    box-shadow:0 18px 42px rgba(0,0,0,.42)!important;
  }
  .navbar .nav-links a,
  .navbar .nav-links a:hover,
  .navbar .nav-links a.active,
  .navbar .nav-links a:focus,
  .navbar .nav-links a:active{
    background:transparent!important;
    color:#fff!important;
    outline:none!important;
  }
  body.dark-mode .navbar .nav-links a,
  body.dark-mode .navbar .nav-links a:hover,
  body.dark-mode .navbar .nav-links a.active,
  body.dark-mode .navbar .nav-links a:focus,
  body.dark-mode .navbar .nav-links a:active{
    background:transparent!important;
    color:#f7f9fc!important;
  }
  .navbar .nav-links .theme-option{
    border-top-color:rgba(255,255,255,.22)!important;
  }
  body.dark-mode .navbar .nav-links .theme-option{
    border-top-color:rgba(255,255,255,.12)!important;
  }
}


/* =========================================================
   SJS QUEST V20 — final visual refinements
========================================================= */

/* Header theme control: translucent, quiet, no curved-square animation. */
.navbar .theme-toggle{
  width:42px!important;
  height:42px!important;
  padding:0!important;
  margin:0 0 0 6px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.10)!important;
  box-shadow:none!important;
  transform:none!important;
  transition:background .16s ease,opacity .16s ease!important;
}
.navbar .theme-toggle:hover,
.navbar .theme-toggle:active,
.navbar .theme-toggle:focus{
  transform:none!important;
  box-shadow:none!important;
}
.navbar .theme-toggle:hover{background:rgba(255,255,255,.15)!important}
.navbar .theme-toggle:focus-visible{
  outline:1px solid rgba(255,255,255,.55)!important;
  outline-offset:2px!important;
}
.navbar .theme-toggle .theme-icon{
  background:transparent!important;
  box-shadow:none!important;
  filter:none!important;
}
.navbar .theme-toggle .theme-icon-sun{
  color:#fff!important;
  background:transparent!important;
}
.navbar .theme-toggle .theme-icon-moon{
  color:#e7efff!important;
  background:transparent!important;
}
body:not(.dark-mode) .navbar .theme-toggle{
  border-color:rgba(20,35,55,.16)!important;
  background:rgba(255,255,255,.30)!important;
}
body:not(.dark-mode) .navbar .theme-toggle:hover{
  background:rgba(255,255,255,.46)!important;
}
body:not(.dark-mode) .navbar .theme-toggle .theme-icon-sun{color:#263b55!important}
body:not(.dark-mode) .navbar .theme-toggle .theme-icon-moon{color:#263b55!important}

/* Elegant magazine titles. */
.magazines .magazine h3{
  font-family:"Libre Baskerville",Georgia,serif!important;
  font-weight:400!important;
  font-size:1.22rem!important;
  letter-spacing:.01em!important;
  line-height:1.3!important;
  text-align:center!important;
  margin:18px 0 18px!important;
}
body.dark-mode .magazines .magazine h3{color:#f5f5f3!important}

/* Install toast copy. */
.install-app-copy span em{
  display:inline-block;
  margin-top:5px;
  font-style:normal;
  font-size:.82em;
  letter-spacing:.01em;
  opacity:.82;
}

/* Faster, smoother particle field. */
[data-particle-field] .particle-canvas{
  will-change:transform;
  transform:translateZ(0);
}


/* V35 CLEAN DELTA — preserve V34 baseline; only apply requested glass shell polish. */
.navbar{
  top:14px!important;
  width:min(1240px,calc(100% - 28px))!important;
  max-width:1240px!important;
  height:82px!important;
  min-height:82px!important;
  padding:12px 24px!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.42)!important;
  background-image:linear-gradient(135deg,rgba(255,255,255,.58),rgba(255,255,255,.16))!important;
  border:1px solid rgba(255,255,255,.62)!important;
  box-shadow:0 18px 52px rgba(18,38,65,.18),inset 0 1px 0 rgba(255,255,255,.72)!important;
  backdrop-filter:blur(22px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(150%)!important;
}
.navbar .nav-container{height:100%!important;min-height:0!important}
.navbar .logo{height:100%!important}
.navbar .nav-links{height:100%!important}
.navbar .nav-links a{color:#162234!important}
.navbar .nav-links a:hover,.navbar .nav-links a.active{background:rgba(20,39,62,.07)!important;color:#162234!important}
.navbar .theme-toggle{
  background:rgba(255,255,255,.36)!important;
  border:1px solid rgba(20,39,62,.13)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62),0 6px 18px rgba(20,39,62,.10)!important;
  transition:none!important;
}
.navbar .theme-toggle:hover{transform:none!important;background:rgba(255,255,255,.46)!important}
.navbar .theme-icon-sun,.navbar .theme-icon-moon{background:transparent!important;color:#243448!important}
body.dark-mode .navbar{
  background:rgba(13,19,27,.68)!important;
  background-image:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.025))!important;
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:0 18px 52px rgba(0,0,0,.40),inset 0 1px 0 rgba(255,255,255,.09)!important;
}
body.dark-mode .navbar .nav-links a{color:#f5f7fa!important}
body.dark-mode .navbar .nav-links a:hover,body.dark-mode .navbar .nav-links a.active{background:rgba(255,255,255,.09)!important;color:#fff!important}
body.dark-mode .navbar .theme-toggle{background:rgba(255,255,255,.075)!important;border-color:rgba(255,255,255,.14)!important}
body.dark-mode .navbar .theme-icon-sun,body.dark-mode .navbar .theme-icon-moon{color:#eef4fb!important}
footer{
  margin-top:0!important;
  border-top:1px solid rgba(40,72,108,.12)!important;
  background:#0a0f16!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
footer::before{height:2px!important;background:linear-gradient(90deg,transparent,rgba(142,183,226,.52),transparent)!important}
@media(max-width:900px){
  .navbar{top:9px!important;width:calc(100% - 18px)!important;height:74px!important;min-height:74px!important;padding:10px 13px!important;border-radius:20px!important}
  .navbar .nav-links{
    top:calc(100% + 12px)!important;
    background:rgba(255,255,255,.48)!important;
    background-image:linear-gradient(135deg,rgba(255,255,255,.60),rgba(255,255,255,.18))!important;
    border:1px solid rgba(255,255,255,.62)!important;
    border-radius:20px!important;
    box-shadow:0 22px 52px rgba(18,38,65,.20),inset 0 1px 0 rgba(255,255,255,.72)!important;
    backdrop-filter:blur(24px) saturate(150%)!important;
    -webkit-backdrop-filter:blur(24px) saturate(150%)!important;
  }
  .navbar .mobile-toggle{width:46px!important;height:46px!important;border-radius:14px!important;background:rgba(255,255,255,.34)!important;border:1px solid rgba(20,39,62,.13)!important;backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;transition:none!important;transform:none!important}
  .navbar .mobile-toggle:hover{transform:none!important;background:rgba(255,255,255,.44)!important}
  .navbar .nav-links a,.navbar .nav-links a:hover,.navbar .nav-links a.active{background:rgba(255,255,255,.16)!important;border:1px solid rgba(255,255,255,.34)!important;color:#162234!important}
  body.dark-mode .navbar .nav-links{background:rgba(13,19,27,.70)!important;background-image:linear-gradient(135deg,rgba(255,255,255,.085),rgba(255,255,255,.025))!important;border-color:rgba(255,255,255,.15)!important;box-shadow:0 22px 52px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.08)!important}
  body.dark-mode .navbar .mobile-toggle{background:rgba(255,255,255,.075)!important;border-color:rgba(255,255,255,.14)!important;color:#fff!important}
  body.dark-mode .navbar .nav-links a,body.dark-mode .navbar .nav-links a:hover,body.dark-mode .navbar .nav-links a.active{background:rgba(255,255,255,.065)!important;border-color:rgba(255,255,255,.10)!important;color:#f5f7fa!important}
}
@media(max-width:700px){.navbar{height:74px!important;min-height:74px!important}}


/* V36 FINAL REQUESTED SHELL — horizontal width, compact height, true glass, preserved light/dark accents. */
.navbar{
  top:12px!important;
  left:50%!important;
  width:min(1380px,calc(100% - 24px))!important;
  max-width:1380px!important;
  height:64px!important;
  min-height:64px!important;
  padding:8px 22px!important;
  border-radius:19px!important;
  z-index:10000!important;
  box-sizing:border-box!important;
  background:rgba(74,130,210,.78)!important;
  background-image:linear-gradient(135deg,rgba(92,151,231,.84),rgba(53,101,174,.68))!important;
  border:1px solid rgba(255,255,255,.28)!important;
  box-shadow:0 14px 38px rgba(28,61,103,.24),inset 0 1px 0 rgba(255,255,255,.30)!important;
  backdrop-filter:blur(22px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(145%)!important;
}
.navbar .nav-container{height:100%!important;min-height:0!important;align-items:center!important}
.navbar .logo{height:100%!important;min-width:170px!important;align-items:center!important}
.navbar .logo-wordmark{font-size:clamp(2rem,3vw,2.8rem)!important;line-height:1!important;color:#fff!important}
.navbar .nav-links{height:100%!important;align-items:center!important;gap:3px!important}
.navbar .nav-links a{
  color:#fff!important;
  padding:9px 15px!important;
  border-radius:10px!important;
  font-weight:600!important;
  line-height:1.1!important;
}
/* Light mode keeps the established yellow/orange action buttons and white text. */
body:not(.dark-mode) .navbar .nav-links a:hover,
body:not(.dark-mode) .navbar .nav-links a.active{
  background:#f59e0b!important;
  color:#fff!important;
  box-shadow:0 5px 14px rgba(245,158,11,.22)!important;
}
.navbar .theme-toggle{
  width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;
  border-radius:50%!important;padding:0!important;margin-left:5px!important;
  background:rgba(255,255,255,.14)!important;
  border:1px solid rgba(255,255,255,.24)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.20)!important;
  backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;
  transform:none!important;transition:background .18s ease,border-color .18s ease!important;
}
.navbar .theme-toggle:hover{background:rgba(255,255,255,.22)!important;transform:none!important}
.navbar .theme-icon-sun,.navbar .theme-icon-moon{background:transparent!important;color:#fff!important}
/* Dark mode = charcoal black glass, never grey. */
body.dark-mode .navbar{
  background:rgba(8,11,15,.86)!important;
  background-image:linear-gradient(135deg,rgba(18,22,28,.90),rgba(5,7,10,.76))!important;
  border-color:rgba(255,255,255,.13)!important;
  box-shadow:0 16px 42px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.075)!important;
}
body.dark-mode .navbar .nav-links a{color:#fff!important}
body.dark-mode .navbar .nav-links a:hover,
body.dark-mode .navbar .nav-links a.active{
  background:#f59e0b!important;color:#fff!important;
  box-shadow:0 5px 14px rgba(245,158,11,.18)!important;
}
body.dark-mode .navbar .theme-toggle{background:rgba(255,255,255,.07)!important;border-color:rgba(255,255,255,.13)!important}
/* Mobile hamburger and dropdown use the same glass language. */
@media(max-width:900px){
  .navbar{top:9px!important;width:calc(100% - 16px)!important;height:58px!important;min-height:58px!important;padding:7px 11px!important;border-radius:17px!important}
  .navbar .nav-container{height:100%!important}
  .navbar .logo{min-width:0!important;height:100%!important}
  .navbar .logo-wordmark{font-size:2rem!important}
  .navbar .mobile-toggle{
    display:flex!important;align-items:center!important;justify-content:center!important;
    width:40px!important;height:40px!important;min-width:40px!important;border-radius:12px!important;
    color:#fff!important;background:rgba(255,255,255,.13)!important;
    border:1px solid rgba(255,255,255,.22)!important;
    backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.16)!important;
  }
  .navbar .nav-links{
    top:calc(100% + 10px)!important;
    left:0!important;right:0!important;width:100%!important;height:auto!important;
    padding:10px!important;gap:5px!important;border-radius:18px!important;
    background:rgba(74,130,210,.76)!important;
    background-image:linear-gradient(135deg,rgba(92,151,231,.82),rgba(53,101,174,.68))!important;
    border:1px solid rgba(255,255,255,.27)!important;
    box-shadow:0 20px 46px rgba(21,47,80,.32),inset 0 1px 0 rgba(255,255,255,.28)!important;
    backdrop-filter:blur(24px) saturate(150%)!important;
    -webkit-backdrop-filter:blur(24px) saturate(150%)!important;
  }
  .navbar .nav-links a,.navbar .nav-links a:hover,.navbar .nav-links a.active{
    min-height:44px!important;padding:11px 14px!important;border-radius:11px!important;
    background:transparent!important;border:1px solid transparent!important;color:#fff!important;
    box-shadow:none!important;
  }
  .navbar .nav-links a:hover,.navbar .nav-links a.active{background:#f59e0b!important;border-color:rgba(255,255,255,.10)!important;color:#fff!important}
  body.dark-mode .navbar .nav-links{
    background:rgba(7,9,12,.86)!important;
    background-image:linear-gradient(135deg,rgba(18,22,28,.90),rgba(4,6,9,.80))!important;
    border-color:rgba(255,255,255,.13)!important;
    box-shadow:0 22px 52px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.07)!important;
  }
  body.dark-mode .navbar .nav-links a,
  body.dark-mode .navbar .nav-links a:hover,
  body.dark-mode .navbar .nav-links a.active{color:#fff!important}
  body.dark-mode .navbar .mobile-toggle{background:rgba(255,255,255,.065)!important;border-color:rgba(255,255,255,.13)!important}
}
@media(max-width:700px){
  .navbar{height:56px!important;min-height:56px!important}
  .navbar .logo-wordmark{font-size:1.88rem!important}
}
/* One consistent footer shell across the standard pages. */
footer{
  margin-top:0!important;
  min-height:220px!important;
  padding:42px 20px 20px!important;
  background:#090d12!important;
  border-top:1px solid rgba(245,158,11,.18)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
  color:#e9edf2!important;
}
footer::before{height:2px!important;background:linear-gradient(90deg,transparent,rgba(245,158,11,.72),transparent)!important}
footer .footer-container{width:min(1200px,100%)!important;margin:0 auto!important}
footer .footer-container h3{color:#fff!important}
footer .footer-container a,footer .footer-container p,footer .footer-bottom p{color:#c5ced9!important}
footer .footer-container a:hover,footer .footer-bottom a:hover{color:#f59e0b!important}
footer .footer-bottom{width:min(1200px,100%)!important;margin:18px auto 0!important;border-top:1px solid rgba(255,255,255,.11)!important;padding-top:16px!important}
