/* ===== WOW LAYER — living mission control ===== */

/* living background sits behind everything */
#wowbg{position:fixed;inset:0;z-index:0;pointer-events:none}
.app,.land,.landwrap,.content,.topbar{position:relative;z-index:1}
.rail{z-index:2}
body{background:#20265c}

/* aurora drift under the canvas */
body::before{content:'';position:fixed;inset:-20%;z-index:0;pointer-events:none;
  background:
   radial-gradient(42% 34% at 18% 22%,rgba(127,192,255,.16),transparent 70%),
   radial-gradient(38% 30% at 82% 14%,rgba(63,224,192,.13),transparent 70%),
   radial-gradient(46% 38% at 70% 86%,rgba(127,192,255,.10),transparent 70%),
   radial-gradient(30% 26% at 8% 78%,rgba(63,224,192,.08),transparent 70%);
  animation:aurora 26s ease-in-out infinite alternate}
@keyframes aurora{0%{transform:translate3d(-2%,-1%,0) scale(1)}50%{transform:translate3d(2%,2%,0) scale(1.06)}100%{transform:translate3d(-1%,1%,0) scale(1.02)}}

/* glass panels over the living background */
.panel,.kpi,.acard,.ecard,.chartbox,.pnode,.player,.tblwrap,.pulse{
  background:rgba(52,62,150,.5)!important;
  backdrop-filter:blur(16px) saturate(1.25);
  -webkit-backdrop-filter:blur(16px) saturate(1.25);
  border:1px solid rgba(176,188,255,.22)!important;
  box-shadow:inset 0 1px 0 rgba(190,214,255,.10),0 18px 44px rgba(14,16,48,.45);
  transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s,border-color .28s}
.panel:hover,.kpi:hover,.acard:hover,.ecard:hover,.pnode:hover{
  transform:translateY(-4px);
  border-color:rgba(127,192,255,.45)!important;
  box-shadow:inset 0 1px 0 rgba(190,214,255,.14),0 26px 60px rgba(14,16,48,.55),0 0 42px rgba(127,192,255,.16)}

/* animated gradient edge on hero cards */
.ecard,.kpi.hot{position:relative;overflow:hidden}
.ecard::before,.kpi.hot::before{content:'';position:absolute;inset:0;padding:1px;border-radius:inherit;
  background:linear-gradient(120deg,rgba(127,192,255,.65),rgba(63,224,192,.65),rgba(127,192,255,.65));
  background-size:220% 220%;animation:edgeflow 7s linear infinite;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
@keyframes edgeflow{to{background-position:220% 0}}

/* numbers that feel alive */
.kpi .v,.kpi .big,.estat b,.h1{text-shadow:0 0 26px rgba(127,192,255,.35)}
.statusdot,.pulse-dot{box-shadow:0 0 12px currentColor,0 0 26px rgba(63,224,192,.5)}

/* staggered entrance */
.wow-in{opacity:0;transform:translateY(18px) scale(.985)}
.wow-in.go{opacity:1;transform:none;transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}

/* scan shimmer across feed */
.feed{position:relative;overflow:hidden}
.feed::after{content:'';position:absolute;left:-40%;top:0;bottom:0;width:32%;
  background:linear-gradient(105deg,transparent,rgba(127,192,255,.06),transparent);
  animation:scan 6.5s ease-in-out infinite}
@keyframes scan{0%,15%{left:-40%}55%,100%{left:110%}}

/* landing: cinematic */
.landhero .h1,.land .h1{background:linear-gradient(92deg,#f6f8ff 20%,#8fc2ff 55%,#4ff0b8 90%);
  -webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;
  filter:drop-shadow(0 0 30px rgba(127,192,255,.25))}
.landkick{letter-spacing:.34em}
.ecard{transform-style:preserve-3d}

@media (prefers-reduced-motion:reduce){
  body::before,.feed::after,.ecard::before,.kpi.hot::before{animation:none!important}
  .wow-in{opacity:1;transform:none}}


/* ===== landing v2: showcase ===== */
.land .landhero{position:relative}
.land .landhero::after{content:'';position:absolute;left:50%;top:-140px;transform:translateX(-50%);width:640px;height:640px;pointer-events:none;z-index:-1;
  background:conic-gradient(from 0deg,rgba(127,192,255,.16),rgba(63,224,192,.12),rgba(157,139,255,.14),rgba(127,192,255,.16));
  border-radius:50%;filter:blur(70px);animation:halo 18s linear infinite}
@keyframes halo{to{transform:translateX(-50%) rotate(360deg)}}
.ecard{will-change:transform;transition:transform .18s ease,box-shadow .28s,border-color .28s}
.ecard .estat b,.estat b{font-size:22px;text-shadow:0 0 22px rgba(127,192,255,.45)}
.landfoot{opacity:.85}
@media (prefers-reduced-motion:reduce){.land .landhero::after{animation:none}}
