/* Player-attached breadcrumb. Scoped to episode pages only.
   Original AnimePahe styles, player, menu and behavior are untouched. */
section.main .content-wrapper .theatre > .ap-episode-breadcrumb {
  box-sizing: border-box;
  width: 100%;
  max-width: 1100px;
  min-height: 43px;
  margin: 0 auto;
  padding: 10px 15px;
  background: #1b1d21;
  border: 1px solid #303137;
  border-bottom: 1px solid #34353b;
  border-radius: 4px 4px 0 0;
  color: #bfc0c6;
  font-size: 12px;
  line-height: 1.6;
}
section.main .content-wrapper .theatre > .ap-episode-breadcrumb ol {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 22px;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
section.main .content-wrapper .theatre > .ap-episode-breadcrumb a {
  color: #c3c4ca;
  transition: color .15s ease;
}
section.main .content-wrapper .theatre > .ap-episode-breadcrumb a:hover,
section.main .content-wrapper .theatre > .ap-episode-breadcrumb a:focus-visible {
  color: #e887ad;
}
section.main .content-wrapper .theatre > .ap-episode-breadcrumb .ap-crumb-current {
  color: #f0ebed;
  font-weight: 600;
}
/* Keep the player flush against the breadcrumb without altering its ratio. */
section.main .content-wrapper .theatre > .player {
  margin-top: 0;
}
@media (max-width: 600px) {
  section.main .content-wrapper .theatre > .ap-episode-breadcrumb {
    min-height: 40px;
    padding: 9px 10px;
    font-size: 11px;
    border-radius: 3px 3px 0 0;
  }
  section.main .content-wrapper .theatre > .ap-episode-breadcrumb .ap-crumb-series {
    max-width: 37vw;
  }
}
@media (prefers-reduced-motion: reduce) {
  section.main .content-wrapper .theatre > .ap-episode-breadcrumb a { transition: none; }
}