/* Phase 12 — final release polish. Keep this layer last in the cascade. */
:root {
  --release-gutter: clamp(2rem, 8vw, 8rem);
  --release-dim: #686868;
  --release-subtle: #555;
  --release-poster-shadow: 0 18px 50px rgba(0, 0, 0, .36);
}

::selection { background: var(--color-red); color: var(--color-white); }
html { scrollbar-color: #333 var(--color-bg); scrollbar-width: thin; }
.app-view {
  width: 100%;
  max-width: none;
  margin: 0;
  align-items: normal;
  justify-items: normal;
}
.portal-shell[data-state="splash"] .app-view { position: absolute; }
.portal-shell[data-state="app"] .app-view { position: relative; inset: auto; }

.home-nav__link,
.movie-breadcrumb button,
.movie-save button,
.filter-studio__heading button,
.filter-chips button,
.active-filters button,
.explore-contexts button,
.search-contexts button,
.list-card__contexts button,
.list-card__remove,
.home-footer button,
.explore-footer button,
.search-footer button,
.list-footer button,
.movie-footer button,
.viewing-dialog__return { min-height: 2.75rem; }

.explore-movie-card__poster,
.search-movie-result__poster,
.list-card__poster,
.movie-poster {
  border-color: rgba(255, 255, 255, .14);
  box-shadow: var(--release-poster-shadow);
}

.home-footer,
.explore-footer,
.search-footer,
.list-footer,
.movie-footer { color: var(--release-subtle); }
.home-footer button,
.explore-footer button,
.search-footer button,
.list-footer button,
.movie-footer button { color: var(--release-dim); }

.viewing-dialog__panel { max-height: calc(100svh - 2rem); overflow-y: auto; }

@media (max-width: 430px) {
  .home-header,
  .explore-header,
  .search-header,
  .list-header {
    align-items: flex-start;
    min-height: auto;
    padding: 1.25rem 0;
    gap: 1rem;
  }
  .home-header .home-nav,
  .explore-header .home-nav,
  .search-header .home-nav,
  .list-header .home-nav {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .35rem 1rem;
  }
  .home-nav__link { display: inline-flex; align-items: center; }
  .filter-chips button,
  .active-filters button,
  .explore-contexts button,
  .search-contexts button,
  .list-card__contexts button,
  .list-card__remove { min-height: 2.75rem; }
  .viewing-dialog { padding: 1rem; }
  .viewing-dialog__panel { padding: 4rem 1.5rem 2rem; }
  .viewing-dialog h2 { font-size: clamp(2.15rem, 12vw, 3.25rem); }
}

@media (max-height: 780px) and (min-width: 769px) {
  .home-hero,
  .explore-hero,
  .list-hero { min-height: min(42rem, calc(100svh - 5.5rem)); }
  .selected-hero,
  .mechanism-hero,
  .movie-hero { padding-top: clamp(3rem, 8vh, 5rem); padding-bottom: clamp(3rem, 8vh, 5rem); }
  .search-hero { min-height: auto; padding-top: 4.5rem; padding-bottom: 4.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}