/* Music player: compact strip at the very top. Never grow to eat the page. */
.player-bar,
.player-bar.is-expanded,
.player-bar.is-expand-leaving,
.player-bar.is-live {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  z-index: 10050 !important;
  height: auto !important;
  max-height: 148px !important;
  overflow: hidden !important;
  border-top: none !important;
  border-bottom: 1px solid rgba(0, 255, 102, 0.4) !important;
  box-shadow: 0 8px 40px rgba(0, 255, 102, 0.12) !important;
  padding-top: max(6px, env(safe-area-inset-top, 0px)) !important;
  padding-bottom: 6px !important;
  transform: none !important;
}
.player-expand {
  display: none !important;
}
body {
  padding-top: 0;
}
.links-rail:not(.is-collapsed),
.now-rail:not(.is-collapsed) {
  top: 148px !important;
}
.app-shell {
  padding-bottom: 0.5rem !important;
}
.page {
  padding-bottom: 2rem !important;
}

/* Collapsed Links must stay clickable, never display:none, never under the player */
.links-rail.is-collapsed,
.app-shell.links-collapsed .links-rail {
  display: flex !important;
  flex-direction: column !important;
  position: fixed !important;
  left: 0 !important;
  top: var(--player-h, 132px) !important;
  width: 52px !important;
  min-width: 52px !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  z-index: 10060 !important;
  pointer-events: auto !important;
}
.links-rail.is-collapsed .rail-toggle,
.app-shell.links-collapsed .rail-toggle {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px;
  min-height: 44px;
  font-size: 1.15rem !important;
  z-index: 10061;
}
#nex-links-fab {
  position: fixed;
  left: 8px;
  top: calc(var(--player-h, 132px) + 10px);
  z-index: 10070;
  appearance: none;
  border: 1px solid #39ff14;
  background: #06140c;
  color: #b8ff9a;
  font: 700 11px/1 "IBM Plex Sans", system-ui, sans-serif;
  letter-spacing: 0.1em;
  padding: 10px 8px;
  cursor: pointer;
}
.tutorial-btn {
  bottom: 18px !important;
}
.override-terminal,
.override-terminal.is-bottom {
  bottom: 18px !important;
}

/* EAFF x20 NEX / grey alien interactions */
@keyframes nex-bob {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -7px; }
}
@keyframes nex-spin {
  from { rotate: 0deg; }
  to { rotate: 360deg; }
}
@keyframes nex-jump {
  0% { translate: 0 0; }
  35% { translate: 0 -42px; }
  100% { translate: 0 0; }
}
@keyframes nex-glow {
  0%, 100% { filter: drop-shadow(0 0 10px rgba(0,255,102,.35)); }
  50% { filter: drop-shadow(0 0 22px rgba(180,255,80,.7)) drop-shadow(0 0 8px rgba(176,38,255,.4)); }
}
@keyframes nex-dust {
  0% { opacity: .6; transform: scale(.4) translateY(0); }
  100% { opacity: 0; transform: scale(1.4) translateY(10px); }
}
@keyframes nex-pop {
  from { opacity: 0; transform: translate(-50%, 8px) scale(.92); }
  to { opacity: 1; transform: translate(-50%, 0) scale(1); }
}
.alien-guide.nex-eaff-bob:not(.alien-guide--moving):not(.nex-busy) {
  animation: nex-bob 2.4s ease-in-out infinite;
}
.alien-guide.nex-eaff-glow {
  animation: nex-glow 1.6s ease-in-out infinite;
}
.alien-guide.nex-spin { animation: nex-spin .7s cubic-bezier(.22,1,.36,1); }
.alien-guide.nex-jump { animation: nex-jump .55s cubic-bezier(.22,1,.36,1); }
.alien-guide.nex-hover .alien-guide__hit { transform: scale(1.06); }
.alien-guide.nex-drag { cursor: grabbing !important; z-index: 80 !important; }
.nex-dust {
  position: absolute; bottom: 6px; left: 50%; width: 28px; height: 10px; margin-left: -14px;
  border-radius: 50%; background: radial-gradient(ellipse, rgba(0,255,102,.45), transparent 70%);
  pointer-events: none; animation: nex-dust .45s ease-out forwards;
}
.nex-menu {
  position: fixed; z-index: 90; min-width: 180px; padding: .35rem;
  background: rgba(8,12,18,.94); border: 1px solid rgba(0,255,102,.4);
  color: #e8ffe8; font: 600 12px/1.3 "IBM Plex Sans", system-ui, sans-serif;
  box-shadow: 0 10px 28px rgba(0,0,0,.45);
}
.nex-menu button {
  display: block; width: 100%; text-align: left; background: none; border: 0;
  color: inherit; padding: .45rem .55rem; cursor: pointer; font: inherit;
}
.nex-menu button:hover, .nex-menu button:focus-visible { background: rgba(0,255,102,.15); outline: none; }
.nex-hint {
  position: absolute; top: -1.4rem; left: 50%; transform: translateX(-50%);
  font: 600 10px/1 "IBM Plex Sans", system-ui, sans-serif; color: #9f6; letter-spacing: .08em;
  white-space: nowrap; pointer-events: none; opacity: .85;
}
.nex-extra-bubble {
  position: absolute; bottom: calc(100% + 8px); left: 50%;
  transform: translateX(-50%); max-width: min(240px, 70vw);
  padding: 8px 12px; border-radius: 12px; background: rgba(12,18,28,.94);
  color: #e8f4ff; font: 600 13px/1.35 "IBM Plex Sans", system-ui, sans-serif;
  border: 1px solid rgba(176,38,255,.45); pointer-events: none;
  animation: nex-pop .2s ease; z-index: 3;
}
.nex-confetti {
  position: absolute; inset: 0; pointer-events: none; overflow: visible;
}
.nex-confetti i {
  position: absolute; left: 50%; top: 20%; width: 6px; height: 6px; border-radius: 1px;
  animation: nex-jump .7s ease-out forwards;
}
@media (prefers-reduced-motion: reduce) {
  .alien-guide.nex-eaff-bob, .alien-guide.nex-eaff-glow, .alien-guide.nex-spin, .alien-guide.nex-jump { animation: none; }
}