/* ViV's face circuits — ONE source for every page that shows her (index, open). The circuit art is the mask
   (viv-circuit.png, never larger); light runs along it: a steady low glow so it always reads "on", fast ice-blue
   current zipping one way, a slower violet/teal current the other, and a slow breath. Mostly blue — a tiny bit of color.
   Each moving layer shifts by whole repeats, so the loop never jumps. */
.viv-circuit.viv-circuit{ /* doubled: wins over each page's own .circuit / .face .cx sizing */
  -webkit-mask-image:url(/viv-circuit.png);mask-image:url(/viv-circuit.png);
  -webkit-mask-size:cover;mask-size:cover;-webkit-mask-position:50% 16%;mask-position:50% 16%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  background-image:
    repeating-linear-gradient(180deg,rgba(232,246,255,0) 0px,rgba(232,246,255,0) 62px,rgba(232,246,255,.95) 70px,rgba(127,203,255,.55) 76px,rgba(127,203,255,0) 84px,rgba(127,203,255,0) 96px),
    repeating-linear-gradient(90deg,rgba(150,120,255,0) 0px,rgba(150,120,255,0) 118px,rgba(183,156,255,.7) 126px,rgba(111,240,218,.55) 131px,rgba(111,240,218,0) 138px,rgba(111,240,218,0) 150px),
    linear-gradient(rgba(127,203,255,.30),rgba(127,203,255,.30));
  background-size:100% 960px,1500px 100%,cover; /* tiles are whole repeats (10×96, 10×150): no seam where they meet */
  mix-blend-mode:screen;filter:drop-shadow(0 0 5px rgba(92,184,255,.8));
  animation:viv-run 4.8s linear infinite,viv-breathe 5s ease-in-out infinite;
}
/* One animation moves both currents (two on one property would cancel): blue runs 2 repeats per loop (40px/s),
   violet/teal 1 repeat the other way across (31px/s). */
@keyframes viv-run{from{background-position:0 0,0 0,0 0}to{background-position:0 -192px,150px 0,0 0}}
@keyframes viv-breathe{0%,100%{opacity:.86}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.viv-circuit.viv-circuit{animation:none;opacity:.9}}