@layer components{:root{--podcast-heading-font-size:clamp(1.25rem,4vw,1.75rem);--podcast-gap:1rem;--podcast-list-gap:2rem;--podcast-play-size:3.4rem;--podcast-play-color:var(--text-color);--podcast-meta-color:var(--text-color);--podcast-border-color:color-mix(in oklch,var(--text-color),80% transparent);--podcast-maxwidth:var(--maxwidth-sm)}.podcast-container{margin:0 auto var(--podcast-list-gap);max-width:var(--podcast-maxwidth)}.podcast-search{flex:0 1 40rem;position:relative}.podcast-search-input{border:1px solid var(--podcast-border-color);border-radius:5rem;font-size:var(--font-size);padding:1rem 3.25rem 1rem 1.5rem;width:100%}.podcast-search-icon{display:grid;inset:0;padding-left:1.5rem;place-content:center;pointer-events:none;position:absolute}.podcast-search-icon svg{height:1.5rem;width:1.5rem}.podcast-filter{background:var(--section-background,transparent);border-radius:1rem;display:grid;gap:1.5rem;margin:0 auto var(--podcast-list-gap);max-width:40rem;padding:1.5rem}.podcast-filter[hidden]{display:none}.podcast-filter-group{display:flex;flex-direction:column;gap:.5rem}.podcast-filter-label{font-size:.875rem;font-weight:var(--font-weight-semibold,600)}.podcast-filter select{background:transparent;border-radius:.5rem;font-size:var(--font-size);padding:.75rem 1rem;width:100%}.podcast-list{border-top:1px solid var(--podcast-border-color);display:grid;grid-template-columns:repeat(1,1fr);list-style:none;margin:0;padding:0}.podcast-episode{align-items:center;border-bottom:1px solid var(--podcast-border-color);cursor:default;gap:var(--podcast-gap);padding:1.5rem 0;position:relative}.podcast-episode[hidden]{display:none}.podcast-episode-controls{align-items:flex-end;display:flex;gap:1rem;grid-column:span 5;@media screen and (min-width:640px){flex-direction:column;gap:0;grid-column:span 1}&>p{margin:0!important}}.podcast-episode-content{display:grid;flex:1 1 auto;grid-template-columns:repeat(5,1fr);min-width:0}.podcast-episode-title{flex:1 1 auto;grid-column:span 5;min-width:0;@media screen and (min-width:640px){grid-column:span 4}}.podcast-player{grid-column:span 5;margin-top:1rem;&[hidden]{display:none}&:not([hidden]){display:block}}.podcast-audio{width:100%}.podcast-no-audio{font-size:.875rem}.podcast-empty{color:var(--podcast-meta-color);padding:2rem 0;text-align:center;&[hidden]{display:none}}.podcast-load-more{display:flex;justify-content:center;margin-left:auto;margin-right:auto;margin-top:var(--podcast-list-gap);text-align:center;&[hidden]{display:none}}}