/* Navbar image slot */
.nav-img-slot {
  width:50px; height:50px; border-radius:8px; overflow:hidden;
  border:1px solid var(--border); background:var(--panel);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.nav-img-slot img { width:100%; height:100%; object-fit:cover; border-radius:7px; }
.nav-img-slot-ph {
  width:36px; height:36px; border-radius:8px;
  border:1px dashed rgba(0,212,255,.2); background:rgba(0,212,255,.04);
  display:flex; align-items:center; justify-content:center;
  font-family:'VT323',monospace; font-size:8px; color:var(--dim);
  text-align:center; line-height:1.1; flex-shrink:0;
}

/* Floating side objects */
.shrimp-wrap {
  position:fixed; right:16px; top:50%; transform:translateY(-50%);
  z-index:var(--z-decoration); pointer-events:none; animation:shrimpFloat 5s ease-in-out infinite;
}
.shrimp-wrap img {
  width:100px; height:120px; object-fit:contain;
  animation:shrimpSpin 9s linear infinite;
  filter:drop-shadow(0 0 10px rgba(0,212,255,.4));
}
.shrimp-ph {
  width:56px; height:56px; border-radius:50%;
  background:rgba(168,85,247,.07); border:1px dashed rgba(168,85,247,.25);
  display:flex; align-items:center; justify-content:center;
  font-family:'VT323',monospace; font-size:9px; color:var(--dim);
  text-align:center; line-height:1.2; padding:4px;
}
.tall-wrap {
  position:fixed; left:12px; top:55%; transform:translateY(-50%);
  z-index:var(--z-decoration); pointer-events:none;
}
.tall-wrap img {
  width:200px; height:520px; object-fit:contain;
  filter:drop-shadow(0 0 12px rgba(168,85,247,.35));
}
.tall-ph {
  width:150px; height:400px; border-radius:12px;
  background:rgba(168,85,247,.05); border:1px dashed rgba(168,85,247,.2);
  display:flex; align-items:center; justify-content:center;
  font-family:'VT323',monospace; font-size:9px; color:var(--dim);
  text-align:center; line-height:1.5; padding:6px;
}

/* Mid-scroll VOTV banner */
.hero-banner {
  position:relative; z-index:var(--z-content); display:flex; justify-content:center;
  padding:14px 0 0; pointer-events:none;
}
.hero-banner img {
  max-height:300px; max-width:320px; object-fit:contain;
  animation:bannerLev 4s ease-in-out infinite;
  filter:drop-shadow(0 0 20px rgba(0,212,255,.22));
}
.hero-banner-ph {
  display:flex; align-items:center; justify-content:center;
  height:70px; width:280px; margin:0 auto;
  border:1px dashed rgba(0,212,255,.14); border-radius:8px;
  font-family:'VT323',monospace; font-size:12px; color:var(--dim); letter-spacing:2px;
}

@keyframes shrimpFloat {
  0%,100% { transform:translateY(0) rotate(-3deg); }
  33% { transform:translateY(-14px) rotate(8deg); }
  66% { transform:translateY(-5px) rotate(-8deg); }
}
@keyframes shrimpSpin { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); } }
@keyframes bannerLev { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }

@media (max-width:1400px) {
  .tall-wrap img { width:150px; height:420px; opacity:.82; }
  .shrimp-wrap img { width:82px; height:98px; }
}
@media (max-width:1180px) {
  .tall-wrap { display:none; }
  .shrimp-wrap { right:8px; opacity:.78; }
}
@media (max-width:767px) {
  .shrimp-wrap { display:none; }
  .nav-img-slot { width:38px; height:38px; }
}