/* V2.4.265: Platform boundaries and page-specific slots in the Seasons layout. */
@media (min-width: 960px) {
  html:not(.capacitor-shell) body #view-profile .profile-gm-hero {
    grid-template-columns: 118px minmax(0, 1fr) auto;
    grid-template-areas: "stats stats stats" "avatar identity aktionen";
    align-content: end;
    padding: 20px;
  }
  html:not(.capacitor-shell) body #view-profile .profile-gm-avatar-block {
    width: 118px;
    align-self: end;
  }
  html:not(.capacitor-shell) body #view-profile .profile-gm-avatar-edit {
    z-index: 2;
    position: absolute;
    right: 0;
    bottom: 0;
    margin: 0;
  }
  html:not(.capacitor-shell) body #view-profile .profile-gm-identity {
    margin-left: 20px;
    align-self: end;
  }
  html:not(.capacitor-shell) body #view-profile .profile-gm-name-row { flex-wrap: wrap; }
  html:not(.capacitor-shell) body #view-profile .profile-main-title { overflow-wrap: anywhere; }
  html:not(.capacitor-shell) body #view-profile .profile-gm-meta { margin-top: 6px; }
  html:not(.capacitor-shell) body #view-profile .profile-actions.profile-gm-hero-actions {
    grid-area: aktionen !important;
    justify-self: end;
    align-self: end;
    margin: 0 !important;
    padding: 0;
  }
  html:not(.capacitor-shell) body #view-profile .profile-gm-hero-stats:not(.is-hidden) { margin: 0 0 16px; }
}

@media (max-width: 959px) {
  html body dialog#authDialog.ag-2026 .ag-artwork {
    height: auto;
    justify-content: flex-start;
  }
  html body dialog#authDialog.ag-2026 .ag-artwork-media {
    position: relative;
    inset: auto;
    flex: 0 0 auto;
    width: clamp(96px, 26vw, 144px);
    max-width: calc(100% - 96px);
    aspect-ratio: 1;
    margin: 16px auto 12px;
    /* PV-069: hoechstens 144 px Kantenlaenge - die 480-px-Fassung reicht bis
       zur dreifachen Pixeldichte (Motiv und Seitenverhaeltnis unveraendert). */
    background: url("assets/splash/animeradar-radar-transparent-v1-480.webp") center / contain no-repeat;
  }
  html body dialog#authDialog.ag-2026 .ag-artwork-media::after { content: none; }
}
html.capacitor-shell body dialog#authDialog.ag-2026 .ag-artwork {
  height: auto;
  justify-content: flex-start;
}
html.capacitor-shell body dialog#authDialog.ag-2026 .ag-artwork-media {
  position: relative;
  inset: auto;
  flex: 0 0 auto;
  width: clamp(96px, 26vw, 144px);
  max-width: calc(100% - 96px);
  aspect-ratio: 1;
  margin: 16px auto 12px;
  /* PV-069: wie oben, hoechstens 144 px Kantenlaenge. */
  background: url("assets/splash/animeradar-radar-transparent-v1-480.webp") center / contain no-repeat;
}
html.capacitor-shell body dialog#authDialog.ag-2026 .ag-artwork-media::after { content: none; }

/* Only the two requested list modes receive the existing Seasons tokens. */
html body :is(#view-search #searchResults.search-results.is-list, #view-lists .library-list) {
  --season-ref-text: #f3f5f6;
  --season-ref-dim: #7f8a91;
  --season-ref-yellow: #ffc928;
  --season-ref-border: rgba(172, 187, 196, .16);
  --season-ref-border-strong: rgba(218, 227, 232, .26);
}
html body #view-search #searchResults.search-results.is-list,
html body #view-lists .library-list-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}
html body #view-lists .library-list-head.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  padding: 0;
  border: 0;
}
html body #view-lists .library-list-shell { border: 0; background: none; overflow: visible; }
html body #view-search #searchResults.search-results:not(.is-list) .ar-row-title-wrap { display: contents; }
html body #view-search #searchResults.search-results.is-list .seasons-card-title :is(a, h3) {
  margin: 0;
  padding: 0;
  font: inherit !important;
  color: inherit;
  line-height: inherit !important;
  white-space: normal;
  text-decoration: none;
}
html body #view-search #searchResults.search-results.is-list .search-card-subtitle {
  margin: 4px 0 0;
  color: #a9b0b6;
  font-size: 12.5px;
  line-height: 1.25;
  white-space: normal;
}
html body #view-search #searchResults.search-results.is-list .search-card-copy { padding: 0; }
html body #view-search #searchResults.search-results.is-list .search-card-bookmark {
  inset: auto !important;
  transform: none !important;
}
html body #view-search #searchResults.search-results.is-list .search-card-provider-slot {
  min-width: 0;
  max-width: 180px;
  flex-wrap: wrap;
}
html body #view-search #searchResults.search-results.is-list .seasons-card-rating { justify-content: flex-start; }
html body #view-lists #libraryGrid .library-list-row .library-list-cell::before { content: none !important; }
html body #view-lists #libraryGrid .library-list-row .library-list-cell { min-width: 0; }
html body #view-lists #libraryGrid .library-list-row .ar-row-progress { display: grid; gap: 4px; min-width: 80px; }
html body #view-lists #libraryGrid .library-list-row .progress-cell.seasons-card-providers {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}
html body #view-lists #libraryGrid .library-list-row .ar-row-updated { color: #a9b0b6; }
html body #view-lists #libraryGrid .library-list-row .seasons-card-meta { display: block !important; }
html body #view-lists #libraryGrid .library-list-row { margin: 0 !important; }
html body #view-lists #libraryGrid .library-list-row .seasons-card-art { border: 0 !important; }
html body :is(#view-search #searchResults.is-list, #view-lists #libraryGrid.library-list) .seasons-card-rating { line-height: 1.5 !important; }
html body :is(#view-search #searchResults.is-list, #view-lists #libraryGrid.library-list) .seasons-card-rating strong { font-size: inherit !important; line-height: inherit !important; }
html body #view-lists #libraryGrid .library-list-row .seasons-card-genres { color: #f3f5f6 !important; }
html body #view-lists #libraryGrid .library-list-row .seasons-card-genres > .list-name-badge {
  min-height: 0 !important;
  display: inline-block !important;
  font-weight: 400 !important;
}
html body #view-lists #libraryGrid .library-list-row .seasons-card-genres .tag-row {
  flex-basis: 100%;
  margin: 2px 0 0 !important;
  gap: 4px;
}
html body #view-lists #libraryGrid .library-list-row .seasons-card-genres .tag {
  min-height: 0 !important;
  height: auto !important;
  padding: 3px 7px !important;
  font-size: 11.5px !important;
  line-height: 1.3 !important;
  white-space: normal;
}
html body #view-lists #libraryGrid .library-list-row .ar-row-remove {
  grid-column: 6;
  grid-row: 1 / 3;
  justify-self: end;
}

/* V2.4.300: Streaminganbieter in der Listenzeile - Markup und Symbole aus
   Seasons (seasonProviderMarkup), Slot unter den Listen-Badges. Ein <div>,
   damit die Badge-Regeln fuer "> span" nicht greifen. */
html body #view-lists #libraryGrid .library-list-row .seasons-card-genres .library-list-providers {
  flex-basis: 100%;
  min-width: 0;
  margin: 6px 0 0;
}

html body #view-lists #libraryGrid .library-list-row .library-list-providers .seasons-card-providers {
  margin-top: 0 !important;
  padding-top: 0 !important;
  flex-wrap: wrap;
  min-height: 0 !important;
}

html body #view-lists #libraryGrid .library-list-row .library-list-providers .seasons-card-providers.is-empty {
  display: none !important;
}

@media (max-width: 760px) {
  html body #view-lists #libraryGrid .library-list-row .seasons-card-genres .library-list-providers {
    margin-top: 5px;
  }
}
html body #view-lists #libraryGrid .library-list-row:has(.ar-row-remove) {
  grid-template-columns: 58px minmax(0, 2fr) var(--ar-list-col-rating, 40px) minmax(90px, 1fr) var(--ar-list-col-tail) auto;
}

/* V2.4.301: In der Bibliothek steht in Spalte 5 nicht die Anbieterreihe,
   sondern die Fortschrittszelle. Gemessener Bedarf 90 px - deshalb hier ein
   eigener Wert statt der 115 px von Entdecken und Seasons. Die Anbieter der
   Bibliothek sitzen in Spalte 4 unter den Listen-Badges. */
html body #view-lists #libraryGrid.library-list {
  --ar-list-col-tail: 96px;
}

/* V2.4.301: Rasterkarten von Entdecken zeigen die Anbieter jetzt in derselben
   kompakten Fassung wie Seasons und Bibliothek. Die Listenansicht bringt ihre
   Werte schon aus material-season-list-reference-v2-4-265.css mit, deshalb
   hier ausdruecklich nur das Raster. Masse wie in
   material-reference-seasons-v2-4-213.css. */
html body #view-search #searchResults:not(.is-list) .seasons-card-providers {
  min-height: 27px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 7px;
  min-width: 0;
}

html body #view-search #searchResults:not(.is-list) .seasons-card-providers.is-empty {
  display: none;
}

html body #view-search #searchResults:not(.is-list) :is(.seasons-provider-logo, .seasons-provider-more) {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 6px;
  background: #080b0d;
  color: #c6cdd1;
  font-size: 9px;
  font-weight: 700;
}

html body #view-search #searchResults:not(.is-list) .seasons-provider-logo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

html body #view-search #searchResults:not(.is-list) .seasons-provider-more {
  background: #151b1f;
}

/* V2.4.302: styles-v2-4-141.css setzt fuer jedes Bild in einer
   Entdecken-Zeile das Posterformat: ".search-row img { aspect-ratio: 2/3 }".
   Gemeint ist das Cover, getroffen wird auch das Anbieterlogo. Die
   Logoregeln setzen Breite, Hoehe und object-fit, aber kein aspect-ratio -
   deshalb blieb 2/3 stehen und das quadratische Logo wurde im Rahmen oben
   und unten beschnitten (gemessen 23 x 34,5 statt 23 x 23 px). Gilt fuer
   Listenzeile und Rasterkarte, beide tragen .search-row. */
html body #view-search .search-row .seasons-provider-logo img {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: contain !important;
}

/* V2.4.302: Auf Telefonbreiten sind die Anbietersymbole ueberall kleiner -
   Seasons und die Listenansichten bringen das schon mit. Die Rasterkarten von
   Entdecken hatten noch keinen eigenen Wert und blieben bei 25 px. Gleiche
   Masse wie material-reference-seasons-v2-4-213.css im Block max-width 760. */
@media (max-width: 760px) {
  html body #view-search #searchResults:not(.is-list) .seasons-card-providers {
    min-height: 22px;
    gap: 4px;
  }

  html body #view-search #searchResults:not(.is-list) :is(.seasons-provider-logo, .seasons-provider-more) {
    width: 22px;
    height: 22px;
    border-radius: 5px;
    font-size: 8px;
  }
}
@media (max-width: 760px) {
  html body #view-lists #libraryGrid .library-list-row:has(.ar-row-remove) { grid-template-columns: 54px minmax(0, 1fr) auto; }
  html body #view-lists #libraryGrid .library-list-row .ar-row-remove { grid-column: 3; grid-row: 5; }
}
