/*
 * Original anime visual-director banner.
 * The artwork stays atmospheric; navigation and account controls remain the top layer.
 */
body.theme-neofuture .app-header {
  isolation: isolate;
  overflow: hidden;
}

body.theme-neofuture .app-header::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(
      90deg,
      rgba(8, 12, 19, 1) 0%,
      rgba(8, 12, 19, .98) 28%,
      rgba(8, 12, 19, .72) 49%,
      rgba(8, 12, 19, .3) 67%,
      rgba(8, 12, 19, .82) 86%,
      rgba(8, 12, 19, .98) 100%
    ),
    url("/static/aiwp-anime-banner-v1.webp");
  background-repeat: no-repeat;
  background-position:
    center,
    right clamp(210px, 19vw, 365px) top 23%;
  background-size:
    100% 100%,
    clamp(760px, 52vw, 1030px) auto;
  opacity: .9;
  filter: saturate(1.08) contrast(1.06);
  transform: scale(1.012);
  transform-origin: 70% 38%;
}

body.theme-neofuture .app-header::after {
  z-index: 3;
}

body.theme-neofuture .app-header > * {
  position: relative;
  z-index: 2;
}

body.theme-neofuture .app-header h1 {
  text-shadow: 0 2px 14px rgba(0, 0, 0, .78);
}

body.theme-neofuture .app-header .header-navigation {
  border-color: rgba(112, 228, 247, .2);
  background: rgba(10, 16, 24, .88);
  box-shadow:
    inset 0 1px rgba(255, 255, 255, .035),
    0 8px 24px rgba(0, 0, 0, .2);
  backdrop-filter: blur(14px);
}

body.theme-neofuture .app-header .header-actions {
  text-shadow: 0 1px 10px rgba(0, 0, 0, .86);
}

body.theme-neofuture .video-quick-empty.with-case-art {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  align-self: stretch;
  width: 100%;
  max-width: none;
  min-height: 548px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  background-image:
    linear-gradient(
      180deg,
      rgba(6, 10, 16, .16) 0%,
      rgba(6, 10, 16, .38) 50%,
      rgba(6, 10, 16, .82) 100%
    ),
    var(--video-case-art);
  background-position: center;
  background-size: cover;
  color: #f4f8fb;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .88);
}

body.theme-neofuture .video-quick-empty.with-case-art::before {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: -1;
  height: 46%;
  background: linear-gradient(180deg, transparent, rgba(4, 8, 13, .88));
  pointer-events: none;
}

body.theme-neofuture .video-quick-empty.with-case-art > span {
  border-color: rgba(112, 228, 247, .58);
  background: rgba(7, 14, 22, .76);
  color: #70e4f7;
  backdrop-filter: blur(10px);
}

body.theme-neofuture .video-quick-empty.with-case-art strong,
body.theme-neofuture .video-quick-empty.with-case-art p {
  color: inherit;
}

body.theme-neofuture .video-quick-empty.with-case-art p {
  max-width: 320px;
}

@media (min-width: 761px) {
  body.theme-neofuture .app-header {
    height: 84px;
    min-height: 84px;
  }

  body.theme-neofuture .app-body.studio-v5,
  body.theme-neofuture .video-workspace.canvas-v5,
  body.theme-neofuture .video-workspace.canvas-v5.quick-mode,
  body.theme-neofuture .video-workspace.canvas-v5.library-mode,
  body.theme-neofuture .professional-workspace {
    height: calc(100vh - 84px);
  }

  body.theme-neofuture .app-header::before {
    background-position:
      center,
      right clamp(210px, 19vw, 365px) top 19%;
  }
}

@media (prefers-reduced-motion: no-preference) {
  body.theme-neofuture .app-header::before {
    animation: aiwp-anime-banner-breathe 14s ease-in-out infinite alternate;
  }
}

@keyframes aiwp-anime-banner-breathe {
  from {
    transform: scale(1.012) translate3d(0, 0, 0);
  }
  to {
    transform: scale(1.026) translate3d(-3px, 1px, 0);
  }
}

@media (max-width: 1320px) {
  body.theme-neofuture .app-header::before {
    background-position:
      center,
      right 210px top 22%;
    background-size:
      100% 100%,
      760px auto;
    opacity: .72;
  }
}

@media (max-width: 1060px) {
  body.theme-neofuture .app-header::before {
    background-image:
      linear-gradient(
        90deg,
        rgba(8, 12, 19, .98) 0%,
        rgba(8, 12, 19, .9) 45%,
        rgba(8, 12, 19, .55) 72%,
        rgba(8, 12, 19, .92) 100%
      ),
      url("/static/aiwp-anime-banner-v1.webp");
    background-position:
      center,
      right 90px top 22%;
    background-size:
      100% 100%,
      640px auto;
    opacity: .56;
  }
}

@media (max-width: 980px) {
  body.theme-neofuture .video-quick-empty.with-case-art {
    min-height: 400px;
  }
}

@media (max-width: 760px) {
  body.theme-neofuture .app-header::before {
    background-image:
      linear-gradient(
        90deg,
        rgba(8, 12, 19, .98) 0%,
        rgba(8, 12, 19, .92) 54%,
        rgba(8, 12, 19, .62) 78%,
        rgba(8, 12, 19, .82) 100%
      ),
      url("/static/aiwp-anime-banner-v1.webp");
    background-position:
      center,
      right -88px top 20%;
    background-size:
      100% 100%,
      520px auto;
    opacity: .42;
    animation: none;
    transform: none;
  }

  body.theme-neofuture .video-quick-empty.with-case-art {
    min-height: 300px;
    padding: 22px 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.theme-neofuture .app-header::before {
    animation: none;
    transform: none;
  }
}
