/* ============================================================
   v134 — NEON ARCADE TRIM
   A colorful animated frame around every page of the site.
   Pure CSS, zero HTML/JS changes:
     html::before / html::after = top / bottom neon bars
     body::before / body::after = left / right neon bars
   Fixed position + pointer-events:none: never blocks taps,
   never causes scrollbars, phone-safe. Respects reduced-motion.
   Palette: Levi Studios neon (teal / purple / magenta / gold).
   ============================================================ */
html::before,
html::after,
body::before,
body::after {
  content: "";
  position: fixed;
  z-index: 9999;
  pointer-events: none;
}

/* ---- top + bottom neon bars, with gold pixel rivets ---- */
html::before,
html::after {
  left: 0;
  right: 0;
  height: 7px;
  background-image:
    radial-gradient(circle, #ffe93c 0 3px, rgba(255,159,28,.95) 4px, rgba(255,159,28,0) 7px),
    radial-gradient(circle, #ffe93c 0 3px, rgba(255,159,28,.95) 4px, rgba(255,159,28,0) 7px),
    linear-gradient(90deg, #00e5ff, #7b5cff, #ff2d78, #ffc832, #00e5ff);
  background-size: 18px 18px, 18px 18px, 300% 100%;
  background-position: 4px center, calc(100% - 4px) center, 0 0;
  background-repeat: no-repeat, no-repeat, repeat;
  animation: ls-trim-h 9s linear infinite;
}
html::before {
  top: 0;
  box-shadow: 0 2px 16px rgba(0,229,255,.5);
}
html::after {
  bottom: 0;
  box-shadow: 0 -2px 16px rgba(255,45,120,.5);
}

/* ---- left + right neon bars ---- */
body::before,
body::after {
  top: 0;
  bottom: 0;
  width: 7px;
  background-image:
    linear-gradient(180deg, #00e5ff, #7b5cff, #ff2d78, #ffc832, #00e5ff);
  background-size: 100% 300%;
  background-position: 0 0;
  background-repeat: repeat;
  animation: ls-trim-v 9s linear infinite;
}
body::before {
  left: 0;
  box-shadow: 2px 0 16px rgba(123,92,255,.5);
}
body::after {
  right: 0;
  box-shadow: -2px 0 16px rgba(255,200,50,.5);
}

@keyframes ls-trim-h {
  from { background-position: 4px center, calc(100% - 4px) center, 0 0; }
  to   { background-position: 4px center, calc(100% - 4px) center, 100% 0; }
}
@keyframes ls-trim-v {
  from { background-position: 0 0; }
  to   { background-position: 0 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html::before,
  html::after,
  body::before,
  body::after {
    animation: none;
  }
}