/**
 * Sitewide neon backdrop — matches index.html atmosphere (cyan / magenta glow + grid).
 * Load after page-local <style> blocks so body backgrounds become transparent.
 */
html {
  background-color: #030308;
}

body.gccs-page-pad,
body.gccs-login-body {
  position: relative;
  background-color: transparent !important;
  background-image: none !important;
}

body.gccs-page-pad::before,
body.gccs-login-body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(ellipse 80% 52% at 50% 100%, rgba(0, 245, 255, 0.14) 0%, transparent 70%),
    radial-gradient(ellipse 48% 38% at 88% 8%, rgba(255, 46, 230, 0.11) 0%, transparent 62%),
    radial-gradient(ellipse 42% 34% at 8% 22%, rgba(0, 102, 255, 0.11) 0%, transparent 58%),
    linear-gradient(180deg, #030308 0%, #070712 48%, #0a0518 100%);
}

body.gccs-page-pad::after,
body.gccs-login-body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: 0.88;
  background-image:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E"),
    linear-gradient(rgba(0, 245, 255, 0.052) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 46, 230, 0.04) 1px, transparent 1px);
  background-size: auto, 56px 56px, 56px 56px;
  mask-image: radial-gradient(ellipse 88% 78% at 50% 32%, rgba(0, 0, 0, 0.5) 0%, transparent 72%);
}

/* Staff Hub (panel) — sidebar reads against the scene */
body.gccs-page-pad .layout > .sidebar {
  background: rgba(6, 8, 22, 0.88);
  backdrop-filter: blur(14px);
  border-right-color: rgba(0, 245, 255, 0.28) !important;
  box-shadow: inset -1px 0 0 rgba(255, 46, 230, 0.06);
}

body.gccs-page-pad .layout > .content {
  background: transparent;
}