.node-space-wrap{
  position:relative;
  width:100%;
  min-height:0;
  height:100%;
  margin-inline:auto;
  perspective:1900px;
  perspective-origin:50% 48%;
  transform-style:preserve-3d;
  will-change:transform;
}

.node-space-wrap{
  position:relative;
  isolation:isolate;
}

.node-space-wrap.walking{
  perspective:1300px;
}

.node-lines{
  position:absolute;
  inset:0;
  z-index:1;
}

.node-space{
  position:relative;
  margin-top:0;
  width:min(1700px,100%);
  height:100%;
  margin-inline:auto;
  transform-style:preserve-3d;
  transform:translateZ(0) rotateX(3deg);
  will-change:transform;
  overflow:hidden;
}

.walk-cursor{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:6;
  opacity:0;
  transition:opacity .2s ease;
}

.walk-cursor::before,
.walk-cursor::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  background:rgba(130, 230, 255,.55);
  box-shadow:0 0 16px rgba(130, 230, 255,.42);
}

.walk-cursor::before{
  width:14px;
  height:1px;
  transform:translate(-50%, -50%);
}

.walk-cursor::after{
  width:1px;
  height:14px;
  transform:translate(-50%, -50%);
}

.node-space-wrap.walking .walk-cursor{
  opacity:1;
}

.node-space-wrap.walking .node,
.node-space-wrap.walking .node-lines,
.node-space-wrap.walking .node-matrix,
.node-space-wrap.walking .you-here{
  opacity:0;
  pointer-events:none;
  visibility:hidden;
}

.wolf-view{
  position:absolute;
  inset:0;
  z-index:4;
  display:none;
  overflow:hidden;
  pointer-events:none;
  transform-style:preserve-3d;
}

.node-space-wrap.walking .wolf-view,
.node-space-wrap.dive-hold .wolf-view{
  display:block;
}

.racer-view{
  position:absolute;
  inset:0;
  z-index:4;
  display:none;
  overflow:hidden;
  pointer-events:none;
  transform-style:preserve-3d;
  background:
    linear-gradient(180deg, rgba(2,4,10,0.9), rgba(0,0,0,0.84)),
    linear-gradient(90deg, rgba(0,255,255,.08), rgba(255,32,128,.04), rgba(255,32,128,.02));
}

.node-space-wrap.walking .racer-view{
  display:none;
}

.node-space-wrap.racing .wolf-view{
  display:none;
}

.node-space-wrap.racing .racer-view{
  display:block;
}

.racer-canvas{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
}

.racer-hud{
  position:absolute;
  left:10px;
  right:10px;
  bottom:8px;
  z-index:8;
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:10px;
  letter-spacing:.11em;
  color:rgba(190, 255, 250,.93);
  text-shadow:0 0 12px rgba(85, 240, 230,.4);
  pointer-events:none;
}

.racer-hud .racer-lane{
  color:rgba(255,255,255,.84);
}

.racer-lights{
  position:absolute;
  inset:-8% -2%;
  z-index:6;
  pointer-events:none;
  background:
    repeating-linear-gradient(
      90deg,
      rgba(0,255,255,.24) 0,
      rgba(0,255,255,.11) 6px,
      rgba(255,80,255,.2) 8px,
      rgba(255,80,255,.05) 12px
    ),
    linear-gradient(180deg, rgba(0,255,255,0) 72%, rgba(0,255,255,.12) 100%);
  mix-blend-mode:screen;
  opacity:.52;
}

.racer-fog{
  position:absolute;
  inset:0;
  z-index:7;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.2) 0, rgba(0,0,0,0) 62%, rgba(0,0,0,.28) 100%);
}

.wolf-canvas{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  display:block;
  filter:contrast(1.03) saturate(0.95);
}

.wolf-hud{
  position:absolute;
  z-index:5;
  left:10px;
  right:10px;
  bottom:10px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:10px;
  letter-spacing:.12em;
  color:rgba(142, 214, 255,.9);
  text-shadow:0 0 10px rgba(84, 198, 255,.35);
}

.wolf-crosshair{
  position:absolute;
  left:50%;
  top:50%;
  width:19px;
  height:19px;
  transform:translate(-50%, -50%);
  z-index:5;
  pointer-events:none;
  opacity:.95;
}

.wolf-crosshair::before,
.wolf-crosshair::after{
  content:"";
  position:absolute;
  background:rgba(150, 240, 255,.94);
  box-shadow:0 0 10px rgba(136, 220, 255,.35);
}

.wolf-crosshair::before{
  left:50%;
  top:2px;
  width:1px;
  height:15px;
  transform:translateX(-50%);
}

.wolf-crosshair::after{
  left:2px;
  top:50%;
  width:15px;
  height:1px;
  transform:translateY(-50%);
}

.wolf-gun{
  position:absolute;
  left:50%;
  bottom:12%;
  width:54px;
  height:36px;
  transform:translateX(-48%);
  z-index:4;
  pointer-events:none;
  opacity:0.72;
  mix-blend-mode:screen;
}

.wolf-gun::before{
  content:"";
  position:absolute;
  inset:0;
  border-left:2px solid rgba(122, 205, 250,.72);
  border-right:2px solid rgba(82, 186, 240,.24);
  border-top:2px solid rgba(82, 186, 240,.2);
  background:
    linear-gradient(120deg, rgba(112,200,255,.24) 0%, rgba(112,200,255,.06) 42%, rgba(112,200,255,.1) 100%);
  clip-path:polygon(0 100%, 34% 34%, 74% 22%, 100% 8%, 100% 100%);
}

.wolf-gun::after{
  content:"";
  position:absolute;
  left:4px;
  top:20px;
  width:12px;
  height:8px;
  background:linear-gradient(90deg, rgba(112,220,255,.32), rgba(112,220,255,.06));
  border-radius:8px;
  box-shadow:0 0 8px rgba(112,220,255,.3);
}

.wolf-fog{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:6;
  background:
    linear-gradient(180deg, rgba(0,0,0,.26) 0, rgba(0,0,0,0) 55%, rgba(102, 206, 255,.03) 100%);
}

/* Zoom INTO the terminal: the frozen walk frame accelerates toward the
   viewer and whites out green just as Win95 takes over (~760ms handoff). */
.wolf-view.dive{
  transform-origin:50% 46%;
  animation:dive-zoom .85s cubic-bezier(.5,0,.85,.4) forwards;
}

@keyframes dive-zoom{
  0%{transform:scale(1);filter:brightness(1) saturate(1);}
  55%{filter:brightness(1.3) saturate(1.2) contrast(1.06);}
  100%{transform:scale(2.7);filter:brightness(2.1) saturate(1.5) blur(2.2px);}
}

