/* line 3, app/assets/stylesheets/components/art.sass */
.Art {
  max-width: 200px;
  max-height: 200px;
  background-color: #191d23;
  position: relative;
}

/* line 9, app/assets/stylesheets/components/art.sass */
.Art--light {
  background-color: #e7e9ec;
}

/* line 12, app/assets/stylesheets/components/art.sass */
.Art__img {
  max-width: 200px;
  max-height: 100vh;
}

/* line 16, app/assets/stylesheets/components/art.sass */
.Art__img--hidden {
  display: none;
}

/* line 19, app/assets/stylesheets/components/art.sass */
.Art__logo-container {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  height: 200px;
}

/* line 26, app/assets/stylesheets/components/art.sass */
.Art__logo {
  opacity: 0.4;
}

/* line 29, app/assets/stylesheets/components/art.sass */
.Art__logo--light {
  opacity: 0.2;
}
/* line 3, app/assets/stylesheets/components/loading.sass */
.LoadingIndicatorOverlayed {
  align-items: center;
  background: transparent;
  display: flex;
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 2;
}

/* line 15, app/assets/stylesheets/components/loading.sass */
.LoadingIndicatorOverlayed circle {
  fill: #ffffff;
}

/* line 19, app/assets/stylesheets/components/loading.sass */
.LoadingIndicatorOverlayed--light circle {
  fill: #000000;
}
/* line 11, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container {
  position: absolute;
  bottom: calc(26px - 12.5em);
  z-index: 4;
  width: 100%;
  height: 12.5em;
  padding: 0 20px;
  background-color: #191d23;
  transition: bottom .25s;
}

/* line 21, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container--light {
  background-color: #e7e9ec;
}

/* line 23, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container--cadence {
  background-color: #f8f8f8;
  height: 10em;
  bottom: calc(26px - 10em);
}

/* line 28, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container.is-up {
  position: absolute;
  bottom: 0;
}

/* line 32, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar {
  font-size: 10px;
  color: #bababa;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  padding-top: 6px;
}

/* line 40, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar a {
  text-decoration: none;
  color: #bababa;
}

/* line 44, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar a:hover {
  color: #ffffff;
}

/* line 47, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar a.MenuBar__item--light {
  color: #232831;
}

/* line 49, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar a.MenuBar__item--light:hover {
  color: #555555;
}

/* line 52, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar a.MenuBar__item--cadence {
  color: #232831;
}

/* line 54, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar a.MenuBar__item--cadence:hover {
  color: #070707;
}

/* line 57, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar--light {
  color: #232831;
}

/* line 59, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar--cadence {
  color: #232831;
}

/* line 63, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar #subscribe:hover {
  cursor: pointer;
  color: #ffffff;
}

/* line 67, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__overlay-container__menu-bar #subscribe.is-hidden {
  visibility: hidden;
}

/* line 70, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__menubar-tab {
  display: none;
}

/* line 72, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__menubar-tab__title {
  height: 25px;
  margin: 25px 0 0 0;
  padding: 0;
  font-weight: inherit;
  color: #ffffff;
  font-size: 16px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

@media screen and (max-height: 199px) {
  /* line 72, app/assets/stylesheets/components/menu_bar.sass */
  .MenuBar__menubar-tab__title {
    margin-top: 12px;
  }
}

/* line 85, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__menubar-tab__title--light {
  color: #232831;
}

/* line 87, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__menubar-tab__title--cadence {
  color: #232831;
  margin-top: 15px;
}

/* line 90, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__menubar-tab__subtitle {
  min-height: 20px;
  max-height: 105px;
  overflow-x: none;
  overflow-y: auto;
  margin-bottom: 15px;
  color: #c3c3c3;
  font-size: 12px;
}

/* line 99, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__menubar-tab__subtitle--light {
  color: #232831;
}

/* line 101, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__menubar-tab__subtitle--cadence {
  color: #232831;
}

/* line 104, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__menubar-tab.is-visible {
  display: block;
}

/* line 107, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item, .MenuBar__icon {
  display: inline-block;
  color: #bababa;
}

/* line 111, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item:hover, .MenuBar__icon:hover {
  cursor: pointer;
  color: #ffffff;
}

/* line 115, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item--light, .MenuBar__icon--light {
  color: #232831;
}

/* line 117, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item--light:hover, .MenuBar__icon--light:hover {
  color: #555555;
}

/* line 119, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item--cadence, .MenuBar__icon--cadence {
  color: #232831;
}

/* line 121, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item--cadence:hover, .MenuBar__icon--cadence:hover {
  color: #070707;
}

/* line 124, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item {
  font-size: 10px;
  text-transform: uppercase;
  margin-right: 10px;
  font-weight: 600;
}

/* line 130, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item:focus-visible {
  outline: 3px solid #7474ec;
  outline-offset: 2px;
}

/* line 134, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item--with-icon {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* line 139, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__item--with-icon svg {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
}

/* line 144, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__icon {
  font-family: 'pnply-icons';
}

/* line 147, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__icon.is-hidden {
  display: none;
}

/* line 150, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__megaphone-wordmark {
  margin-left: auto;
}

/* line 152, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__megaphone-wordmark:focus-visible {
  outline: 3px solid #7474ec;
  outline-offset: 2px;
}

/* line 155, app/assets/stylesheets/components/menu_bar.sass */
.MenuBar__megaphone-wordmark img {
  height: 14px;
}

@media screen and (max-width: 410px) {
  /* line 155, app/assets/stylesheets/components/menu_bar.sass */
  .MenuBar__megaphone-wordmark img {
    width: 0;
  }
}
/* line 6, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__action-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: inline;
}

/* line 11, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__action-list li {
  display: inline;
}

/* line 14, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn {
  display: inline-block;
  margin-right: 0.75em;
}

/* line 18, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn:focus-visible {
  outline: 3px solid #7474ec;
  outline-offset: 2px;
}

/* line 22, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon {
  vertical-align: top;
  display: inline-block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #f5f6f7;
  color: #515151;
  text-align: center;
  line-height: 30px;
  font-size: 100%;
  font-family: 'pnply-icons';
  font-weight: 400;
  text-decoration: none;
}

/* line 37, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon img {
  width: 20px;
  vertical-align: top;
  vertical-align-margin: 6px 0;
}

/* line 42, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.rss {
  color: #ff6600;
  background-color: #ffffff;
}

/* line 46, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.itunes {
  background: url(/assets/apple-podcast-logo-color-73427b4e2f5057e639ad354810c97669b18463e9fef23d6a96e6b0760d853069.svg);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-color: #ffffff;
  background-position: center;
}

/* line 53, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.spotify {
  background: url(/assets/spotify-logo-03e394385a9b12f8c2ded2af8b6602305436718c4fbb3c3f651e31f96c855ab3.svg);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-color: #ffffff;
  background-position: center;
}

/* line 60, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.stitcher {
  background: url(/assets/stitcher-logo-651d826aea50c3a735364963676234fb196a5df2009ecd269953d32fed165421.svg);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-color: #ffffff;
  background-position: center;
}

/* line 67, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.iheart {
  background: url(/assets/iheart-logo-970cafc400f4ccb5cc4c87f16e707b20bc90a1879f65deb2e2e1c691baaca57a.svg);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-color: #ffffff;
  background-position: center;
}

/* line 74, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.twitter {
  background-color: #00aced;
  font-size: 20px;
}

/* line 77, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.twitter:before {
  content: '\e604';
  color: #ffffff;
}

/* line 81, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.facebook {
  background-color: #3b5998;
  font-size: 24px;
}

/* line 84, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.facebook:before {
  content: '\e605';
  color: #ffffff;
}

/* line 88, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.download {
  background-color: #ffffff;
  font-size: 20px;
}

/* line 91, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.download:before {
  content: '\e606';
  color: #515151;
}

/* line 95, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.link {
  background-color: #ffffff;
  font-size: 20px;
}

/* line 98, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.link:before {
  content: '\e603';
  color: #515151;
}

/* line 102, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.link.is-copied:before {
  content: '\e611';
  color: #65c06e;
}

/* line 106, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.embed {
  background-color: #ffffff;
  font-size: 20px;
}

/* line 109, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.embed:before {
  content: '\e900';
  color: #515151;
}

/* line 113, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon.embed.is-copied:before {
  content: '\e611';
  color: #65c06e;
}

/* line 117, app/assets/stylesheets/components/menu_bar_buttons.sass.erb */
.MenuBar__btn__icon:hover {
  cursor: pointer;
}
/* line 13, app/assets/stylesheets/components/player.sass */
.Player {
  position: relative;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 16px;
  width: 100%;
}

/* line 19, app/assets/stylesheets/components/player.sass */
.Player__playlist-container {
  position: relative;
}

/* line 22, app/assets/stylesheets/components/player.sass */
.Player__main {
  max-height: 200px;
  height: 100vh;
  display: flex;
}

/* line 26, app/assets/stylesheets/components/player.sass */
.Player__main--cadence {
  height: 160px;
}

/* line 29, app/assets/stylesheets/components/player.sass */
.Player__art {
  height: 100%;
  max-width: 200px;
}

/* line 33, app/assets/stylesheets/components/player.sass */
.Player__art--cadence {
  display: none;
}

@media screen and (max-width: 600px) {
  /* line 29, app/assets/stylesheets/components/player.sass */
  .Player__art {
    display: none;
  }
}

@media screen and (max-height: 199px) {
  /* line 40, app/assets/stylesheets/components/player.sass */
  .Player__art__img {
    width: 100vw;
    height: 100vh;
  }
}

/* line 45, app/assets/stylesheets/components/player.sass */
.Player__content {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  background-color: #232831;
  overflow: hidden;
  position: relative;
  padding-top: 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  max-height: 200px;
  height: 100vh;
}

/* line 62, app/assets/stylesheets/components/player.sass */
.Player__content__controls {
  padding: 0 24px;
  width: 100%;
}

@media screen and (min-width: 882px) {
  /* line 62, app/assets/stylesheets/components/player.sass */
  .Player__content__controls {
    padding-right: 32px;
  }
}

/* line 69, app/assets/stylesheets/components/player.sass */
.Player__content__jump {
  position: absolute;
  right: 0;
  font-size: 14px;
  color: #c3c3c3;
}

/* line 74, app/assets/stylesheets/components/player.sass */
.Player__content__jump--light {
  color: #555555;
}

/* line 78, app/assets/stylesheets/components/player.sass */
.Player__content__jump button:focus-visible {
  outline: 3px solid #7474ec;
  outline-offset: 2px;
}

/* line 82, app/assets/stylesheets/components/player.sass */
.Player__content__jump button:not(:focus) {
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
}

/* line 86, app/assets/stylesheets/components/player.sass */
.Player__content__scrub-bar-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-grow: 1;
}

/* line 92, app/assets/stylesheets/components/player.sass */
.Player__content__scrub-bar {
  margin: -34px 8px 0 24px;
  width: 100%;
}

@media screen and (min-width: 411px) {
  /* line 92, app/assets/stylesheets/components/player.sass */
  .Player__content__scrub-bar {
    margin-right: 24px;
  }
}

/* line 101, app/assets/stylesheets/components/player.sass */
.Player__content--light {
  background-color: #f5f6f7;
}

/* line 103, app/assets/stylesheets/components/player.sass */
.Player__content--cadence {
  background-color: #f8f8f8;
}

/* line 106, app/assets/stylesheets/components/player.sass */
.Player__play-btn {
  vertical-align: top;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #7474ec;
  position: relative;
}

/* line 114, app/assets/stylesheets/components/player.sass */
.Player__play-btn:focus-visible {
  outline: 3px solid #7474ec;
  outline-offset: 2px;
}

/* line 118, app/assets/stylesheets/components/player.sass */
.Player__play-btn:hover {
  cursor: pointer;
  background-color: #5a5abc;
}

/* line 122, app/assets/stylesheets/components/player.sass */
.Player__play-btn:active {
  background-color: #9595fb;
}

/* line 125, app/assets/stylesheets/components/player.sass */
.Player__play-btn--cadence {
  background-color: #000000;
}

/* line 127, app/assets/stylesheets/components/player.sass */
.Player__play-btn--cadence:active {
  background-color: #000000;
}

/* line 129, app/assets/stylesheets/components/player.sass */
.Player__play-btn--cadence:hover {
  cursor: pointer;
  background-color: #626262;
}

/* line 134, app/assets/stylesheets/components/player.sass */
.Player__play-icon {
  vertical-align: top;
  width: 18px;
  height: 18px;
  margin: 11px;
  padding-left: 2px;
}

/* line 141, app/assets/stylesheets/components/player.sass */
.Player__pause-icon {
  vertical-align: top;
  width: 18px;
  height: 18px;
  margin: 11px;
}

/* line 147, app/assets/stylesheets/components/player.sass */
.Player__spinner {
  position: absolute;
  top: -5px;
  left: -5px;
  height: 50px;
  width: 50px;
  border-top: 2px solid #ffffff;
  border-right: 2px solid rgba(255, 255, 255, 0.4);
  border-bottom: 2px solid rgba(255, 255, 255, 0.4);
  border-left: 2px solid #ffffff;
  border-radius: 50%;
  transform: translateZ(0);
  animation: spinner-loader 0.7s infinite linear;
}

@keyframes spinner-loader {
  to {
    transform: rotate(360deg);
  }
  from {
    transform: rotate(0deg);
  }
}

/* line 168, app/assets/stylesheets/components/player.sass */
.Player__episode-info {
  margin-left: 20px;
  margin-right: 32px;
  text-overflow: ellipsis;
  overflow: hidden;
}

@media screen and (max-width: 600px) {
  /* line 168, app/assets/stylesheets/components/player.sass */
  .Player__episode-info {
    margin-right: 10px;
  }
}

@media screen and (max-width: 410px) {
  /* line 168, app/assets/stylesheets/components/player.sass */
  .Player__episode-info {
    margin-right: 0;
  }
}

/* line 181, app/assets/stylesheets/components/player.sass */
.Player__podcast-title {
  height: 1.25em;
  font-size: 0.8em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #c3c3c3;
}

/* line 189, app/assets/stylesheets/components/player.sass */
.Player__podcast-title--light {
  color: #555555;
}

/* line 191, app/assets/stylesheets/components/player.sass */
.Player__podcast-title--cadence {
  color: #232831;
}

/* line 194, app/assets/stylesheets/components/player.sass */
.Player__episode-title {
  height: 1.25em;
  width: 100%;
  margin: 3px 0 0 0;
  color: #ffffff;
  font-size: 1em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* line 204, app/assets/stylesheets/components/player.sass */
.Player__episode-title--light {
  color: #232831;
}

/* line 206, app/assets/stylesheets/components/player.sass */
.Player__episode-title--cadence {
  color: #000000;
}

@media screen and (max-width: 410px) {
  /* line 194, app/assets/stylesheets/components/player.sass */
  .Player__episode-title {
    white-space: normal;
    height: 2.5em;
    font-size: .9em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
}

/* line 217, app/assets/stylesheets/components/player.sass */
.Player__episode-subtitle {
  margin-top: 3px;
  color: #c3c3c3;
  font-size: 0.75em;
  line-height: 1.2em;
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* line 230, app/assets/stylesheets/components/player.sass */
.Player__episode-subtitle--light {
  color: #555555;
}

/* line 232, app/assets/stylesheets/components/player.sass */
.Player__episode-subtitle--cadence {
  color: #070707;
  display: none;
}

@media screen and (max-width: 300px) {
  /* line 217, app/assets/stylesheets/components/player.sass */
  .Player__episode-subtitle {
    display: none;
  }
}

@media screen and (max-height: 189px) {
  /* line 217, app/assets/stylesheets/components/player.sass */
  .Player__episode-subtitle {
    display: none;
  }
}

/* line 243, app/assets/stylesheets/components/player.sass */
.Player__timer-top {
  display: none;
}

@media screen and (min-width: 411px) {
  /* line 243, app/assets/stylesheets/components/player.sass */
  .Player__timer-top {
    align-self: flex-end;
    display: inline-block;
    margin-left: auto;
  }
}

/* line 251, app/assets/stylesheets/components/player.sass */
.Player__timer-bottom {
  display: none;
}

@media screen and (max-width: 410px) {
  /* line 251, app/assets/stylesheets/components/player.sass */
  .Player__timer-bottom {
    max-width: 50px;
    text-align: right;
    display: block;
    margin-right: 24px;
    margin-bottom: 18px;
  }
}

/* line 261, app/assets/stylesheets/components/player.sass */
.Player__timer {
  font-size: 0.8em;
  color: #bababa;
}

/* line 265, app/assets/stylesheets/components/player.sass */
.Player__timer--light {
  color: #555555;
}

/* line 267, app/assets/stylesheets/components/player.sass */
.Player__timer--cadence {
  color: #000000;
}
/* line 10, app/assets/stylesheets/components/playlist.sass */
.Playlist {
  background-color: #232831;
  color: #c3c3c3;
}

/* line 14, app/assets/stylesheets/components/playlist.sass */
.Playlist--light {
  background-color: #f5f6f7;
  color: #555555;
}

/* line 17, app/assets/stylesheets/components/playlist.sass */
.Playlist--cadence {
  background-color: #363636;
  color: #fafafa;
}

/* line 21, app/assets/stylesheets/components/playlist.sass */
.Playlist__header {
  padding: 13px 25px;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: 600;
}

/* line 27, app/assets/stylesheets/components/playlist.sass */
.Playlist__header--cadence {
  background-color: #000000;
}

@media screen and (max-width: 410px) {
  /* line 21, app/assets/stylesheets/components/playlist.sass */
  .Playlist__header {
    font-size: 11px;
    padding: 8px 25px;
  }
}

/* line 34, app/assets/stylesheets/components/playlist.sass */
.Playlist__load-more {
  padding: 13px 25px;
  font-size: 13px;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: bold;
  color: #ffffff;
  width: 100%;
}

/* line 43, app/assets/stylesheets/components/playlist.sass */
.Playlist__load-more--light {
  color: #232831;
}

/* line 46, app/assets/stylesheets/components/playlist.sass */
.Playlist__load-more--cadence {
  background-color: #000000;
}

@media screen and (max-width: 410px) {
  /* line 34, app/assets/stylesheets/components/playlist.sass */
  .Playlist__load-more {
    font-size: 11px;
    padding: 8px 25px;
  }
}

/* line 53, app/assets/stylesheets/components/playlist.sass */
.Playlist__episode {
  cursor: pointer;
  padding: 13px 25px;
  font-size: 15px;
}

/* line 58, app/assets/stylesheets/components/playlist.sass */
.Playlist__episode:hover {
  background-color: #2c333f;
}

/* line 62, app/assets/stylesheets/components/playlist.sass */
.Playlist__episode--light:hover {
  background-color: #e7e9ec;
}

/* line 65, app/assets/stylesheets/components/playlist.sass */
.Playlist__episode--cadence:hover {
  background-color: #505050;
}

/* line 68, app/assets/stylesheets/components/playlist.sass */
.Playlist__episode--active {
  background-color: #2c333f;
  color: #ffffff;
  cursor: default;
}

/* line 72, app/assets/stylesheets/components/playlist.sass */
.Playlist__episode--active--light {
  background-color: #e7e9ec;
  color: #232831;
}

/* line 75, app/assets/stylesheets/components/playlist.sass */
.Playlist__episode--active--cadence {
  background-color: #505050;
  color: #fafafa;
}

@media screen and (max-width: 410px) {
  /* line 53, app/assets/stylesheets/components/playlist.sass */
  .Playlist__episode {
    font-size: 13px;
    padding: 8px 25px;
  }
}

/* line 83, app/assets/stylesheets/components/playlist.sass */
.Playlist__title-container {
  overflow: hidden;
}

/* line 86, app/assets/stylesheets/components/playlist.sass */
.Playlist__button {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #555555;
  padding-left: 4px;
  margin-right: 1em;
  flex-shrink: 0;
}

@media screen and (max-width: 410px) {
  /* line 86, app/assets/stylesheets/components/playlist.sass */
  .Playlist__button {
    display: none;
  }
}

/* line 97, app/assets/stylesheets/components/playlist.sass */
.Playlist__button--active {
  background-color: #7474ec;
}

/* line 100, app/assets/stylesheets/components/playlist.sass */
.Playlist__button--cadence {
  background-color: #5daef0;
}

/* line 102, app/assets/stylesheets/components/playlist.sass */
.Playlist__button--cadence--active {
  background-color: #6eb8fa;
}

/* line 105, app/assets/stylesheets/components/playlist.sass */
.Playlist__button img {
  height: 8px;
  width: auto;
  margin-left: 3px;
}

/* line 110, app/assets/stylesheets/components/playlist.sass */
.Playlist__title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* line 115, app/assets/stylesheets/components/playlist.sass */
.Playlist__duration {
  padding-top: 0.3em;
  white-space: nowrap;
}

/* line 119, app/assets/stylesheets/components/playlist.sass */
.Playlist__scroll-thumb {
  background-color: #ffffff;
  opacity: 0.25;
  border-radius: 10px;
  margin-right: 5px;
}

/* line 125, app/assets/stylesheets/components/playlist.sass */
.Playlist__scroll-thumb--light {
  background-color: #232831;
}

/* line 128, app/assets/stylesheets/components/playlist.sass */
.Playlist__scrollbars {
  max-height: 240px;
  height: calc(100vh - 242px) !important;
}

/* line 134, app/assets/stylesheets/components/playlist.sass */
.Playlist__scrollbars--cadence {
  height: calc(100vh - 202px) !important;
}
/* line 4, app/assets/stylesheets/components/scrub_bar.sass */
.ScrubBar__primary {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* line 14, app/assets/stylesheets/components/scrub_bar.sass */
.ScrubBar__primary--highlight {
  width: 0;
  background: #232831;
  opacity: 0.4;
  z-index: 3;
}

/* line 20, app/assets/stylesheets/components/scrub_bar.sass */
.ScrubBar__primary--highlight--light {
  background: #f5f6f7;
}

/* line 22, app/assets/stylesheets/components/scrub_bar.sass */
.ScrubBar__primary--highlight--cadence {
  background: #f8f8f8;
}

/* line 25, app/assets/stylesheets/components/scrub_bar.sass */
.ScrubBar__primary--progress {
  width: 0;
  transition: width 0.2s;
  z-index: 2;
}

/* line 30, app/assets/stylesheets/components/scrub_bar.sass */
.ScrubBar__primary--clip {
  z-index: 1;
}

/* line 33, app/assets/stylesheets/components/scrub_bar.sass */
.ScrubBar__left-bracket, .ScrubBar__right-bracket {
  border: 2px solid #fff;
  height: 100%;
  max-width: 10px;
  min-height: 30px;
  position: absolute;
  top: 50%;
  z-index: 4;
}

/* line 42, app/assets/stylesheets/components/scrub_bar.sass */
.ScrubBar__left-bracket {
  border-right: none;
  transform: translate(-1px, -50%);
}

/* line 46, app/assets/stylesheets/components/scrub_bar.sass */
.ScrubBar__right-bracket {
  border-left: none;
  transform: translate(1px, -50%);
}

/* line 50, app/assets/stylesheets/components/scrub_bar.sass */
#primary-top {
  position: relative;
  width: 100%;
  touch-action: none;
}

/* line 54, app/assets/stylesheets/components/scrub_bar.sass */
#primary-top:focus-visible {
  outline: 3px solid #7474ec;
  outline-offset: 2px;
}
/* line 5, app/assets/stylesheets/player.sass.erb */
html {
  box-sizing: border-box;
}

/* line 8, app/assets/stylesheets/player.sass.erb */
body {
  margin: 0px;
  font-weight: 500;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
}

/* line 16, app/assets/stylesheets/player.sass.erb */
body:not(.keyboard-user) * {
  outline: none;
}

/* line 19, app/assets/stylesheets/player.sass.erb */
*, *:before, *:after {
  box-sizing: inherit;
}

/* line 22, app/assets/stylesheets/player.sass.erb */
*:focus {
  outline: 3px auto #7474ec;
}

/* line 25, app/assets/stylesheets/player.sass.erb */
button {
  appearance: none;
  border: none;
  background: none;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
}

/* line 34, app/assets/stylesheets/player.sass.erb */
a {
  color: #bababa;
}

/* line 36, app/assets/stylesheets/player.sass.erb */
a:active, a:visited {
  color: #bababa;
}

/* line 39, app/assets/stylesheets/player.sass.erb */
.d-flex {
  display: flex;
}

/* line 42, app/assets/stylesheets/player.sass.erb */
.justify-end {
  justify-content: flex-end;
}

/* line 45, app/assets/stylesheets/player.sass.erb */
.justify-space-between {
  justify-content: space-between;
}

/* line 48, app/assets/stylesheets/player.sass.erb */
.align-items-center {
  align-items: center;
}

@font-face {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-style: normal;
  font-weight: 300;
}

@font-face {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-style: normal;
  font-weight: 500;
}

@font-face {
  font-family: 'pnply-icons';
  font-style: normal;
  font-weight: 400;
  src: url(/assets/fonts/pnply-icons-72a35f3d1cca8ea49fe6cc9e0f0545f671a02a5a78ca181123afa80ed51de9f1.eot);
  src: url(/assets/fonts/pnply-icons-72a35f3d1cca8ea49fe6cc9e0f0545f671a02a5a78ca181123afa80ed51de9f1.eot?#iefix) format("embedded-opentype"), url(/assets/fonts/pnply-icons-dc6472be6045d490471281743fc51d5146eba74762c673a12febbf11c01ee276.woff) format("woff"), url(/assets/fonts/pnply-icons-ca279779f8a5518f3d6098409110cfdeeac54cd2df15a74876604695928a80df.ttf) format("truetype"), url(/assets/fonts/pnply-icons-31bdd274191c618efa300dd8ec19dc4091598107c7b82122b06595085205cfc9.svg#pnply-icons) format("svg");
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */
