/* ============================================
   NIKAMEN — ULTRA 7D SCENE & CASCADE MENU
   ============================================ */

/* ── EXTRA ORBS ── */
.orb-4 { width:250px;height:250px;background:rgba(255,215,0,0.08);top:30%;right:10%;animation-delay:2s; }
.orb-5 { width:350px;height:350px;background:rgba(0,200,255,0.07);bottom:20%;right:30%;animation-delay:4s; }

/* ── STAR CANVAS ── */
#starCanvas {
  position:absolute;inset:0;width:100%;height:100%;
  opacity:.6;
}

/* ── LASER GRID ── */
.laser-grid {
  position:absolute;inset:0;overflow:hidden;pointer-events:none;
  perspective:800px;
}
.lg-h,.lg-v {
  position:absolute;
  background:linear-gradient(90deg,transparent,rgba(108,99,255,.15),transparent);
}
.lg-h {
  left:0;right:0;height:1px;
  animation:lgH 6s linear infinite;
}
.lg-h:nth-child(1){top:20%;animation-delay:0s;}
.lg-h:nth-child(2){top:45%;animation-delay:2s;}
.lg-h:nth-child(3){top:70%;animation-delay:4s;}
.lg-h:nth-child(4){top:85%;animation-delay:1s;}
.lg-h:nth-child(5){top:10%;animation-delay:3s;}
.lg-h:nth-child(6){top:60%;animation-delay:5s;}
.lg-v {
  top:0;bottom:0;width:1px;
  background:linear-gradient(180deg,transparent,rgba(108,99,255,.15),transparent);
  animation:lgV 8s linear infinite;
}
.lg-v:nth-child(7){left:15%;animation-delay:0s;}
.lg-v:nth-child(8){left:35%;animation-delay:2.5s;}
.lg-v:nth-child(9){left:55%;animation-delay:5s;}
.lg-v:nth-child(10){left:75%;animation-delay:1s;}
.lg-v:nth-child(11){left:90%;animation-delay:3.5s;}
.lg-v:nth-child(12){left:5%;animation-delay:6s;}
@keyframes lgH{0%{opacity:0;transform:scaleX(0)}30%{opacity:1}70%{opacity:1}100%{opacity:0;transform:scaleX(1)}}
@keyframes lgV{0%{opacity:0;transform:scaleY(0)}30%{opacity:1}70%{opacity:1}100%{opacity:0;transform:scaleY(1)}}

/* ── WARP TUNNEL ── */
.warp-tunnel {
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:900px;height:900px;
  pointer-events:none;
}
.warp-ring {
  position:absolute;top:50%;left:50%;
  border-radius:50%;
  border:1px solid rgba(108,99,255,.25);
  animation:warpPulse linear infinite;
  transform:translate(-50%,-50%) scale(0);
}
@keyframes warpPulse{
  0%{transform:translate(-50%,-50%) scale(0);opacity:.8;}
  100%{transform:translate(-50%,-50%) scale(1);opacity:0;}
}

/* ── DNA HELIX ── */
.dna-container {
  position:absolute;
  right:5%;top:10%;
  width:60px;height:80vh;
  pointer-events:none;
  opacity:.35;
}
.dna-node {
  position:absolute;
  width:12px;height:12px;
  border-radius:50%;
  background:radial-gradient(circle,#9B95FF,#6C63FF);
  box-shadow:0 0 10px #6C63FF;
}
.dna-node-b {
  background:radial-gradient(circle,#FF6B9B,#FF6B6B);
  box-shadow:0 0 10px #FF6B6B;
}
.dna-bar {
  position:absolute;
  height:1px;
  background:linear-gradient(90deg,rgba(108,99,255,.6),rgba(255,107,107,.6));
  transform-origin:right center;
}

/* ── HYPERSPHERE ── */
.hypersphere-wrap {
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  pointer-events:none;
  perspective:1200px;
}
.hypersphere {
  position:relative;
  width:600px;height:600px;
  transform-style:preserve-3d;
  animation:hyperSpin 80s linear infinite;
}
@keyframes hyperSpin{
  0%{transform:rotateX(10deg) rotateY(0deg) rotateZ(0deg);}
  33%{transform:rotateX(30deg) rotateY(120deg) rotateZ(15deg);}
  66%{transform:rotateX(-10deg) rotateY(240deg) rotateZ(-10deg);}
  100%{transform:rotateX(10deg) rotateY(360deg) rotateZ(0deg);}
}

/* 7 rings */
.hs-ring {
  position:absolute;top:50%;left:50%;
  border-radius:50%;
  transform-style:preserve-3d;
}
.hs-r1{width:160px;height:160px;margin:-80px 0 0 -80px;border:1.5px solid rgba(108,99,255,.7);animation:hsR1 9s linear infinite;}
.hs-r2{width:230px;height:230px;margin:-115px 0 0 -115px;border:1.5px solid rgba(155,149,255,.5);animation:hsR2 14s linear infinite;}
.hs-r3{width:300px;height:300px;margin:-150px 0 0 -150px;border:1.5px solid rgba(255,107,107,.4);animation:hsR3 18s linear infinite;}
.hs-r4{width:370px;height:370px;margin:-185px 0 0 -185px;border:1.5px solid rgba(255,215,0,.35);animation:hsR4 22s linear infinite reverse;}
.hs-r5{width:440px;height:440px;margin:-220px 0 0 -220px;border:1.5px solid rgba(107,203,119,.3);animation:hsR5 28s linear infinite;}
.hs-r6{width:510px;height:510px;margin:-255px 0 0 -255px;border:1px solid rgba(0,200,255,.25);animation:hsR6 34s linear infinite reverse;}
.hs-r7{width:580px;height:580px;margin:-290px 0 0 -290px;border:1px solid rgba(255,100,200,.2);animation:hsR7 42s linear infinite;}

@keyframes hsR1{from{transform:rotateX(0deg)}to{transform:rotateX(360deg)}}
@keyframes hsR2{from{transform:rotateY(0deg)}to{transform:rotateY(360deg)}}
@keyframes hsR3{from{transform:rotateZ(0deg)}to{transform:rotateZ(360deg)}}
@keyframes hsR4{from{transform:rotateX(60deg) rotateY(0deg)}to{transform:rotateX(60deg) rotateY(360deg)}}
@keyframes hsR5{from{transform:rotateX(0deg) rotateZ(30deg)}to{transform:rotateX(360deg) rotateZ(30deg)}}
@keyframes hsR6{from{transform:rotateY(45deg) rotateZ(0deg)}to{transform:rotateY(45deg) rotateZ(360deg)}}
@keyframes hsR7{from{transform:rotateX(20deg) rotateY(20deg) rotateZ(0deg)}to{transform:rotateX(20deg) rotateY(20deg) rotateZ(360deg)}}

.hs-dot {
  position:absolute;top:-7px;left:50%;margin-left:-7px;
  width:14px;height:14px;border-radius:50%;
  background:var(--primary-light);
  box-shadow:0 0 20px var(--primary),0 0 40px var(--primary);
}
.hs-dot2{top:auto;bottom:-7px;}
.hs-r1 .hs-dot{background:#9B95FF;box-shadow:0 0 20px #6C63FF,0 0 40px #6C63FF;}
.hs-r2 .hs-dot{background:#FF9B9B;box-shadow:0 0 20px #FF6B6B,0 0 40px #FF6B6B;}
.hs-r3 .hs-dot{background:#FFE066;box-shadow:0 0 20px gold,0 0 40px gold;}
.hs-r4 .hs-dot{background:#6BFFA8;box-shadow:0 0 20px #6BCB77,0 0 40px #6BCB77;}
.hs-r5 .hs-dot{background:#66D9FF;box-shadow:0 0 20px #00C8FF,0 0 40px #00C8FF;}
.hs-r6 .hs-dot{background:#FF99DD;box-shadow:0 0 20px #FF64C8,0 0 40px #FF64C8;}
.hs-r7 .hs-dot{background:#FFAA66;box-shadow:0 0 20px #FF8800,0 0 40px #FF8800;}

.hs-core {
  position:absolute;top:50%;left:50%;
  width:100px;height:100px;
  transform:translate(-50%,-50%);
}
.hs-inner {
  width:100%;height:100%;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,rgba(180,170,255,.9),rgba(80,60,200,.5));
  border:2px solid rgba(108,99,255,.8);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 40px rgba(108,99,255,.8),inset 0 0 30px rgba(0,0,0,.4);
  position:relative;overflow:hidden;
}
.hs-pulse {
  position:absolute;inset:-50%;
  background:radial-gradient(circle,rgba(108,99,255,.3),transparent 70%);
  animation:hsPulse 2s ease-in-out infinite;
}
@keyframes hsPulse{0%,100%{transform:scale(.8);opacity:.5;}50%{transform:scale(1.2);opacity:1;}}
.hs-letter{font-size:42px;font-weight:900;color:white;z-index:1;text-shadow:0 0 20px rgba(108,99,255,1);}

/* icosahedron-like faces */
.hs-face {
  position:absolute;top:50%;left:50%;
  width:80px;height:80px;
  background:rgba(108,99,255,.06);
  border:1px solid rgba(108,99,255,.2);
  transform-style:preserve-3d;
}
.f1{transform:translate(-50%,-50%) rotateY(0deg) translateZ(200px);}
.f2{transform:translate(-50%,-50%) rotateY(60deg) translateZ(200px);}
.f3{transform:translate(-50%,-50%) rotateY(120deg) translateZ(200px);}
.f4{transform:translate(-50%,-50%) rotateY(180deg) translateZ(200px);}
.f5{transform:translate(-50%,-50%) rotateX(90deg) translateZ(200px);}
.f6{transform:translate(-50%,-50%) rotateX(-90deg) translateZ(200px);}

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .cascade-menu{display:none;}
  .hypersphere-wrap{opacity:.3;}
  .dna-container{display:none;}
}