/* TopPodcasters Network UI */
:root{
	--ink:#000;--paper:#fff;--fog:#F2F2F2;--rule:#D9D9D9;--mute:#5A5A5A;--link:#1F47D6;
	--g:#000;--gi:#fff;
	--f-display:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;
	--f-body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
	--wrap:1280px;--gut:clamp(16px,4vw,40px);
}
body.tpn{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--f-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.tpn *,.tpn *::before,.tpn *::after{box-sizing:border-box}
:where(.tpn) a{color:inherit}
.tpn img{max-width:100%;height:auto;display:block}
.tpn :focus-visible{outline:3px solid var(--link);outline-offset:3px}
.tpn .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.tpn-skip{position:absolute;left:-9999px;top:8px;z-index:1000;background:#fff;color:#000;padding:10px 14px;font-weight:600}
.tpn-skip:focus{left:8px}
.tpn-wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.tpn-center{text-align:center;padding-top:40px}
.tpn-main{display:block;min-height:50vh}

/* ---------- masthead */
.tpn-mast{background:#000;color:#fff;position:sticky;top:0;z-index:100}
.admin-bar .tpn-mast{top:32px}
@media (max-width:782px){.admin-bar .tpn-mast{top:46px}}
@media (max-width:600px){.admin-bar .tpn-mast{top:0}}
.tpn-mast__in{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut);display:flex;align-items:center;gap:20px;min-height:64px}
.tpn-logo{font:900 32px/1 var(--f-display);text-transform:uppercase;text-decoration:none;white-space:nowrap;letter-spacing:.005em}
.tpn-nav{flex:1;min-width:0}
.tpn-nav>ul{display:flex;list-style:none;margin:0;padding:0}
.tpn-nav__item{position:relative}
.tpn-nav__link{display:block;padding:23px 11px 19px;font:600 15px/1 var(--f-body);text-decoration:none;white-space:nowrap;border-bottom:4px solid transparent}
.tpn-nav__item:hover>.tpn-nav__link,.tpn-nav__item:focus-within>.tpn-nav__link{border-bottom-color:var(--g)}
.tpn-nav__sub{display:none;position:absolute;left:0;top:100%;min-width:270px;margin:0;padding:8px 0;list-style:none;background:#fff;color:#000;border-top:4px solid var(--g);box-shadow:0 18px 40px rgba(0,0,0,.28)}
.tpn-nav__item:hover>.tpn-nav__sub,.tpn-nav__item:focus-within>.tpn-nav__sub{display:block}
.tpn-nav__sub a{display:block;padding:9px 18px;text-decoration:none;font-weight:500;font-size:15px}
.tpn-nav__sub a:hover{background:var(--fog)}
.tpn-nav__sub-toggle,.tpn-navtoggle{display:none}
.tpn-search{display:flex}
.tpn-search--mast{display:none;flex-basis:100%;padding:0 0 16px}
.tpn-mast.is-search .tpn-search--mast{display:flex}
.tpn-search--mast input{flex:1}
.tpn-searchtoggle{margin-left:auto;display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:none;border:0;color:#fff;cursor:pointer;border-radius:4px}
.tpn-searchtoggle:hover{background:#1C1C1C}
.tpn-searchtoggle svg{width:22px;height:22px}
.tpn-mast__in{flex-wrap:wrap}
.tpn-search input{min-width:0;background:#1C1C1C;border:1px solid #3A3A3A;border-right:0;color:#fff;padding:9px 12px;font:400 15px var(--f-body);border-radius:4px 0 0 4px}
.tpn-search input::placeholder{color:#9A9A9A}
.tpn-search button{background:#fff;color:#000;border:0;padding:0 14px;font:600 14px var(--f-body);border-radius:0 4px 4px 0;cursor:pointer}
.tpn-search--light{max-width:560px;margin:18px 0 8px}
.tpn-search--light input{flex:1;width:auto;background:#fff;color:#000;border:2px solid #000;border-right:0;padding:12px 14px;font-size:17px}
.tpn-search--light input::placeholder{color:#767676}
.tpn-search--light button{background:#000;color:#fff;padding:0 20px;font-size:15px}

@media (max-width:1180px){
	.tpn-mast__in{flex-wrap:wrap;gap:0 16px}
	.tpn-searchtoggle{display:none}
	.tpn-navtoggle{display:block;margin-left:auto;background:none;border:2px solid #fff;color:#fff;font:600 14px var(--f-body);padding:8px 14px;border-radius:4px;cursor:pointer}
	.tpn-nav,.tpn-search--mast{display:none;flex-basis:100%}
	.tpn-mast.is-open .tpn-nav{display:block}
	.tpn-mast.is-open .tpn-search--mast{display:flex;padding:12px 0 18px}
	.tpn-nav>ul{flex-direction:column}
	.tpn-nav__item{display:flex;flex-wrap:wrap;align-items:center;border-top:1px solid #262626}
	.tpn-nav__link{flex:1;padding:15px 0 15px 14px;border:0;border-left:6px solid var(--g);font-size:17px}
	.tpn-nav__sub-toggle{display:block;background:none;border:0;color:#fff;font:400 26px/1 var(--f-body);width:52px;height:52px;cursor:pointer}
	.tpn-nav__item:hover>.tpn-nav__sub,.tpn-nav__item:focus-within>.tpn-nav__sub{display:none}
	.tpn-nav__item.is-open>.tpn-nav__sub{display:block}
	.tpn-nav__sub{position:static;flex-basis:100%;box-shadow:none;background:#141414;color:#fff;border:0;padding:4px 0 10px}
	.tpn-nav__sub a{padding:10px 20px 10px 26px}
	.tpn-nav__sub a:hover{background:#222}
}

/* ---------- buttons + chips */
.tpn-btn{display:inline-flex;align-items:center;justify-content:center;background:#fff;color:#000;font:700 16px/1 var(--f-body);padding:15px 22px;border-radius:4px;text-decoration:none;border:2px solid transparent}
.tpn-btn:hover{text-decoration:underline;text-underline-offset:3px}
.tpn-btn--dark{background:#000;color:#fff}
.tpn-btn--g{background:var(--gi);color:var(--g)}
.tpn-btn--ghost{background:transparent;color:inherit;border-color:currentColor}
.tpn-chip{display:inline-block;background:var(--g);color:var(--gi);font:800 20px/1 var(--f-display);padding:8px 12px 7px;border-radius:3px;text-decoration:none}
.tpn-chip:hover{text-decoration:underline}

/* ---------- episode cards */
.tpn-card{min-width:0}
.tpn-card__media{display:block;aspect-ratio:16/9;overflow:hidden;border-radius:4px;background:#E6E6E6}
.tpn-card__media img{width:100%;height:100%;object-fit:cover}
.tpn-card__show{display:inline-flex;align-items:center;gap:8px;margin-top:12px;font:600 13px/1.25 var(--f-body);color:var(--mute);text-decoration:none}
.tpn-card__show::before{content:"";flex:none;width:10px;height:10px;border-radius:2px;background:var(--g)}
.tpn-card__show:hover{text-decoration:underline}
.tpn-card__title{margin:5px 0 4px;font:600 17px/1.3 var(--f-body);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tpn-card__title a{text-decoration:none}
.tpn-card__title a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.tpn-card__date{font-size:13px;color:var(--mute)}
.tpn-grid{display:grid;gap:36px 24px;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.tpn-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1000px){.tpn-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){
	.tpn-grid--4{grid-template-columns:1fr;gap:18px}
	.tpn-grid--4 .tpn-card{display:grid;grid-template-columns:132px minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:14px;align-items:start}
	.tpn-grid--4 .tpn-card__media{grid-row:1/4}
	.tpn-grid--4 .tpn-card__show{margin-top:0}
	.tpn-grid--4 .tpn-card__title{font-size:15px}
}
.tpn-rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 72px)/4);gap:24px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding-bottom:14px;scrollbar-width:thin}
.tpn-rail>*{scroll-snap-align:start}
@media (max-width:1000px){.tpn-rail{grid-auto-columns:calc((100% - 24px)/2.3)}}
@media (max-width:560px){.tpn-rail{grid-auto-columns:80%}}

/* ---------- hero */
.tpn-hero{background:#000;color:#fff;padding:32px 0 44px}
.tpn-hero__grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:36px;align-items:end}
.tpn-hero__media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:6px;background:#1A1A1A}
.tpn-hero__media img{width:100%;height:100%;object-fit:cover}
.tpn-play{position:absolute;left:20px;bottom:20px;width:68px;height:68px;border-radius:50%;background:var(--g)}
.tpn-play::after{content:"";position:absolute;left:27px;top:21px;border-style:solid;border-width:13px 0 13px 21px;border-color:transparent transparent transparent var(--gi)}
.tpn-hero__title{font:900 clamp(38px,4.8vw,70px)/.92 var(--f-display);text-transform:uppercase;margin:18px 0 14px;overflow-wrap:anywhere}
.tpn-hero__title a{text-decoration:none}
.tpn-hero__title a:hover{text-decoration:underline;text-decoration-thickness:4px;text-underline-offset:6px}
.tpn-hero__date{display:block;color:#BDBDBD;font-size:15px;margin-bottom:22px}
.tpn-hero .tpn-h2{color:#fff}
.tpn-hero .tpn-card__show,.tpn-hero .tpn-card__date{color:#BDBDBD}
.tpn-hero .tpn-card__media{background:#1A1A1A}
@media (max-width:860px){.tpn-hero__grid{grid-template-columns:1fr;gap:18px}.tpn-hero{padding-top:18px}}

/* ---------- section heads */
.tpn-h2{font:900 32px/1 var(--f-display);text-transform:uppercase;margin:40px 0 20px}
.tpn-sec{padding:44px 0 4px}
.tpn-sec__head{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:6px 20px;margin-bottom:22px;padding-top:14px;border-top:8px solid var(--g)}
.tpn-sec__head--plain{border-top-color:#000}
.tpn-sec__title{margin:0;font:900 clamp(32px,3.6vw,48px)/1 var(--f-display);text-transform:uppercase}
.tpn-sec__title a{text-decoration:none}
.tpn-sec__title a:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px}
.tpn-sec__blurb{margin:0;color:var(--mute);font-size:15px}
.tpn-sec__all{font-weight:600;font-size:15px;white-space:nowrap}
@media (max-width:700px){.tpn-sec__head{grid-template-columns:1fr auto}.tpn-sec__blurb{grid-column:1/-1;grid-row:2}}

/* ---------- show tiles (the loud part) */
.tpn-shows{padding:48px 0 8px}
.tpn-shows--tight{padding:32px 0 0}
.tpn-tiles{display:grid;grid-auto-flow:column;grid-auto-columns:204px;gap:16px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:4px 4px 16px;margin:0 -4px;scrollbar-width:thin}
.tpn-tiles--wrap{grid-auto-flow:row;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));overflow:visible}
.tpn-tile{scroll-snap-align:start;aspect-ratio:1/1;display:flex;flex-direction:column;justify-content:space-between;padding:14px 14px 12px;background:var(--g);color:var(--gi);text-decoration:none;border-radius:6px;overflow:hidden}
.tpn-tile__count{font:600 13px/1 var(--f-body)}
.tpn-tile__name{font:900 44px/.86 var(--f-display);text-transform:uppercase;overflow-wrap:anywhere;hyphens:auto}
.tpn-tile--l .tpn-tile__name{font-size:34px}
.tpn-tile--m .tpn-tile__name{font-size:27px}
.tpn-tile:hover,.tpn-tile:focus-visible{outline:3px solid #000;outline-offset:3px}

/* ---------- banners: show + genre pages */
.tpn-banner{background:var(--g);color:var(--gi);padding:44px 0 40px}
.tpn-banner__genre{font:600 15px/1 var(--f-body);text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:2px}
.tpn-banner__name{font:900 clamp(52px,9.5vw,136px)/.84 var(--f-display);text-transform:uppercase;margin:18px 0 14px;max-width:15ch;overflow-wrap:anywhere}
.tpn-banner__count{font:600 16px/1.4 var(--f-body);margin:0 0 16px;max-width:60ch}
.tpn-banner__desc{max-width:66ch;font-size:16px}
.tpn-banner__desc p{margin:0 0 .8em}
.tpn-banner__desc a{overflow-wrap:anywhere}
.tpn-banner__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.tpn-banner__actions:empty{display:none}
.tpn-list{padding-top:8px}
.tpn-list>.tpn-grid{margin-top:40px}

/* ---------- description clamp */
.tpn-clamp.is-clamped .tpn-clamp__in{max-height:11em;overflow:hidden;-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.tpn-more{margin-top:10px;background:none;border:0;padding:0;font:600 15px var(--f-body);color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* ---------- episode page */
.tpn-stage{background:#000;padding:24px 0;border-bottom:8px solid var(--g)}
.tpn-stage__in{max-width:1140px}
.tpn-player{position:relative;aspect-ratio:16/9;background:#111}
.tpn-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.tpn-stage__img{width:100%;aspect-ratio:16/9;object-fit:cover}
.tpn-ep{max-width:1140px}
.tpn-ep__head{padding:30px 0 10px}
.tpn-ep__title{font:900 clamp(36px,5.2vw,68px)/.93 var(--f-display);text-transform:uppercase;margin:18px 0 16px;max-width:22ch;overflow-wrap:anywhere}
.tpn-ep__meta{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center;color:var(--mute);font-size:15px}
.tpn-ep__meta a{color:var(--link);font-weight:600}
.tpn-ep__desc{max-width:72ch;padding:14px 0 6px}
.tpn-ep__desc a{color:var(--link);overflow-wrap:anywhere}
.tpn-ep__desc p{margin:0 0 1em}
.tpn-adj{display:grid;grid-template-columns:1fr 1fr;gap:20px;border-top:1px solid var(--rule);margin-top:28px;padding-top:20px}
.tpn-adj a{display:block;text-decoration:none}
.tpn-adj small{display:block;color:var(--mute);font-size:13px;margin-bottom:4px}
.tpn-adj span{font-weight:600;line-height:1.3}
.tpn-adj a:hover span{text-decoration:underline}
.tpn-adj__next{text-align:right}
.tpn-comments{max-width:1140px;padding-top:32px}

/* ---------- pages, archives */
.tpn-pagehead{padding:40px 0 22px;border-bottom:8px solid #000;margin-bottom:34px}
.tpn-pagehead h1{font:900 clamp(44px,6.5vw,88px)/.9 var(--f-display);text-transform:uppercase;margin:0}
.tpn-prose{max-width:72ch}
.tpn-empty{font-size:18px;max-width:60ch;margin:8px 0 24px}
.tpn-pag ul{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:48px 0 0}
.tpn-pag a,.tpn-pag span{display:block;min-width:44px;text-align:center;padding:10px 14px;border:2px solid #000;border-radius:4px;text-decoration:none;font-weight:600}
.tpn-pag a:hover{background:var(--fog)}
.tpn-pag .current{background:#000;color:#fff}
.tpn-pag .dots{border-color:transparent}

/* ---------- footer */
.tpn-foot{background:#000;color:#fff;margin-top:72px;padding:52px 0 32px}
.tpn-foot__cols{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:32px 28px}
@media (min-width:1100px){.tpn-foot__cols{grid-template-columns:repeat(6,minmax(0,1fr))}}
.tpn-foot h2{font:900 24px/1 var(--f-display);text-transform:uppercase;margin:0 0 12px;padding-top:10px;border-top:4px solid var(--g)}
.tpn-foot h2 a{text-decoration:none}
.tpn-foot ul{list-style:none;margin:0;padding:0}
.tpn-foot li{margin:0 0 7px}
.tpn-foot li a{color:#C8C8C8;text-decoration:none;font-size:15px}
.tpn-foot a:hover{color:#fff;text-decoration:underline}
.tpn-foot__base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:44px;padding-top:20px;border-top:1px solid #333;font-size:14px;color:#A8A8A8}
.tpn-foot__base a{color:#C8C8C8}

@media (prefers-reduced-motion:reduce){.tpn *{scroll-behavior:auto!important;transition:none!important}}
