/* aupo fixed top→bottom gradient background (with grain) */
:root{
  --aupo-bg-top: #1f2d36;
  --aupo-bg-mid: #2b5d63;
  --aupo-bg-bot: #3d7472;
}

/* IMPORTANT: Root background must be the TOP (dark) color for iOS overscroll / URL bar */
html, body {
  background: var(--aupo-bg-top);
  min-height: 100%;
}

body::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg,
              var(--aupo-bg-top) 0%,
              var(--aupo-bg-mid) 55%,
              var(--aupo-bg-bot) 100%);
  will-change: transform;
}

body::after {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background-image: url('/noise.png');
  opacity: 0.05;
  mix-blend-mode: overlay;
  background-size: 300px 300px;
}

header, footer, .topbar, .hero, .page-header, .container-header {
  background: transparent !important;
}
.card, .panel, .section, .wrap, .wrap-admin, main {
  background: transparent;
}