/* PEV Labs ambient circuit artwork.
   A static layer sits behind the document, not over text, photographs or controls.
   isolation creates a paint boundary only: fixed navigation keeps its viewport
   containing block because neither body nor this layer is transformed. */
body {
  --pev-circuit-ink: linear-gradient(28deg, #67e8a6 2%, #17a2ff 62%, #75bcdb 100%);
  --pev-circuit-opacity: .19;
  isolation: isolate;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  user-select: none;
  background: var(--pev-circuit-ink);
  opacity: var(--pev-circuit-opacity);
  -webkit-mask: url("assets/brand-circuit.svg") left bottom / min(92vw, 1120px) auto no-repeat;
  mask: url("assets/brand-circuit.svg") left bottom / min(92vw, 1120px) auto no-repeat;
}

/* Support explicit light themes without overriding the page's own palette.
   The illustration's alpha fade lives in the SVG and is shared by both themes. */
:is(html, body)[data-theme="light"] {
  --pev-circuit-ink: linear-gradient(28deg, #287665 2%, #176996 62%, #386b84 100%);
  --pev-circuit-opacity: .13;
}
html[data-theme="light"] body {
  --pev-circuit-ink: linear-gradient(28deg, #287665 2%, #176996 62%, #386b84 100%);
  --pev-circuit-opacity: .13;
}

@media (max-width: 700px) {
  body::before {
    opacity: calc(var(--pev-circuit-opacity) * .8);
    -webkit-mask-size: min(140vw, 680px) auto;
    mask-size: min(140vw, 680px) auto;
  }
}

/* No mask support must never produce a solid tinted layer. */
@supports not ((mask-image: url("assets/brand-circuit.svg")) or (-webkit-mask-image: url("assets/brand-circuit.svg"))) {
  body::before { content: none; }
}

/* Ambient decoration is optional; there is no animation to pause. */
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more), (forced-colors: active), print {
  body::before { content: none; }
}