/* MAIS TUNER 24.109 — página do programa (Podcasts) no computador, refeita.
   Antes: a capa virava uma faixa 16:9, o título caía por cima da borda da capa, os botões
   "Ouvir episódio mais recente" e "Ouvir a rádio" ficavam cinza e enormes (só tinham estilo no
   celular) e a página de trás aparecia embaixo.
   Agora, no padrão de página de programa da NRK Radio: capa quadrada à esquerda (fixa ao rolar),
   à direita o selo da rádio, título, descrição, apresentadores e ações; episódios em linhas; grade
   por rádio; player flutuante centralizado. Só a partir de 761 px — o celular continua como estava.
   Não muda a fonte dos elementos existentes (regra do projeto). Fica antes do user-2026.css. */
@media (min-width:761px){
  html body .podcast-detail-overlay.pp-v3{
    position:fixed!important;inset:0!important;z-index:1290;display:block!important;
    padding:0!important;margin:0!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain;
    background:#06162a!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  html body .podcast-detail-overlay.pp-v3:not(.show){display:none!important}
  /* fundo: cores da marca + capa desfocada no topo, desaparecendo no azul da página */
  html body .podcast-detail-overlay.pp-v3::before{content:"";position:absolute;left:0;right:0;top:0;height:560px;z-index:0;pointer-events:none;
    background:var(--pod-brand,linear-gradient(150deg,#16395f,#0a213d));opacity:.55}
  html body .podcast-detail-overlay.pp-v3::after{content:"";position:absolute;left:0;right:0;top:0;height:560px;z-index:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(6,22,42,.25) 0%,rgba(6,22,42,.72) 55%,#06162a 100%)}

  html body .podcast-detail-overlay.pp-v3 .podcast-detail{
    position:relative!important;z-index:1;display:grid!important;grid-template-columns:clamp(240px,24vw,320px) minmax(0,1fr)!important;
    column-gap:clamp(32px,4vw,56px)!important;align-items:start!important;
    width:min(1160px,calc(100% - 64px))!important;max-width:none!important;max-height:none!important;min-height:0!important;
    margin:0 auto!important;padding:100px 0 140px!important;
    background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important;
    transform:none!important;animation:none!important}

  /* capa quadrada, presa ao rolar */
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-visual{
    position:sticky!important;top:100px!important;grid-column:1!important;grid-row:1 / span 2!important;
    width:100%!important;height:auto!important;aspect-ratio:1/1!important;min-height:0!important;max-height:none!important;
    margin:0!important;padding:0!important;border-radius:20px!important;overflow:hidden!important;
    background:var(--pod-brand,#132f52)!important;box-shadow:0 34px 70px -30px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.08)!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-visual::before,
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-visual::after{display:none!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-visual img#podcastDetailImage{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;
    margin:0!important;padding:0!important;border-radius:0!important;object-fit:cover!important;box-shadow:none!important;background:none!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-visual .pod-fallback{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;margin:0!important;border-radius:0!important;box-shadow:none!important}

  /* voltar: círculo com seta, sempre visível no canto */
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-close{
    position:fixed!important;top:22px!important;left:24px!important;right:auto!important;z-index:20!important;
    display:block!important;width:46px!important;height:46px!important;padding:0!important;margin:0!important;
    border-radius:50%!important;border:1px solid rgba(255,255,255,.2)!important;background:rgba(6,22,42,.72)!important;
    -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:transparent!important;font-size:0!important;
    box-shadow:0 10px 24px -12px rgba(0,0,0,.8)!important;outline-offset:3px;cursor:pointer;transition:background .18s ease,transform .18s ease}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-close::before{content:"";position:absolute;left:50%;top:50%;width:11px;height:11px;border:solid #fff;border-width:0 0 2.6px 2.6px;transform:translate(-30%,-50%) rotate(45deg)}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-close:hover{background:rgba(20,48,84,.9)!important;transform:translateX(-2px)}

  /* texto e seções na coluna da direita */
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-copy{
    position:static!important;grid-column:2!important;grid-row:1!important;display:flex!important;flex-direction:column!important;
    min-width:0;margin:0!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;transform:none!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-copy > *{order:1}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-copy > .pp-acts{order:2}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-copy > .podcast-episode-base{order:3}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-copy > .podcast-schedule{order:4}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-copy > .podcast-availability{order:5}
  html body .podcast-detail-overlay.pp-v3 .podcast-actions{display:none!important}

  html body .podcast-detail-overlay.pp-v3 small#podcastDetailStation{
    position:static!important;display:inline-flex!important;align-self:flex-start;align-items:center;gap:8px;margin:6px 0 14px!important;padding:6px 12px!important;
    border-radius:999px;background:rgba(95,255,192,.12)!important;color:#5fffc0!important;
    font-size:11.5px!important;font-weight:800!important;letter-spacing:.14em!important;text-transform:uppercase;text-shadow:none!important}
  html body .podcast-detail-overlay.pp-v3 h2#podcastDetailTitle{
    position:static!important;margin:0 0 16px!important;padding:0!important;max-width:20ch;
    font-size:clamp(34px,3.5vw,54px)!important;line-height:1.04!important;letter-spacing:-.025em!important;
    color:#fff!important;text-shadow:none!important;overflow-wrap:anywhere;hyphens:auto;transform:none!important}
  html body .podcast-detail-overlay.pp-v3 #podcastDetailDescription{
    position:static!important;max-width:64ch;margin:0!important;padding:0!important;background:none!important;
    font-size:16.5px!important;line-height:1.6!important;color:#c3d1e3!important;text-shadow:none!important}
  html body .podcast-detail-overlay.pp-v3 .pod-more{align-self:flex-start;margin:6px 0 0;padding:4px 0;border:0;background:none;color:#5fffc0;font-weight:800;cursor:pointer}
  html body .podcast-detail-overlay.pp-v3 .pod-hosts{margin:20px 0 0!important}

  /* ações: azul NRK no principal, contorno no secundário */
  html body .podcast-detail-overlay.pp-v3 .pp-acts{display:flex!important;flex-wrap:wrap;gap:12px;margin:28px 0 6px!important;padding:0!important}
  html body .podcast-detail-overlay.pp-v3 .pp-acts > *{
    display:inline-flex!important;align-items:center;justify-content:center;gap:10px;flex:0 0 auto!important;
    width:auto!important;height:50px!important;min-height:0!important;margin:0!important;padding:0 24px 0 20px!important;
    border-radius:999px!important;font:850 15.5px/1 'NRK Sans','Reddit Sans',sans-serif!important;letter-spacing:0!important;
    text-decoration:none!important;white-space:nowrap;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .12s ease}
  html body .podcast-detail-overlay.pp-v3 .pp-acts > *:active{transform:scale(.97)}
  html body .podcast-detail-overlay.pp-v3 .pp-acts svg{width:20px!important;height:20px!important;flex:none}
  html body .podcast-detail-overlay.pp-v3 .pp-acts .pp-main{border:0!important;background:#0a64ff!important;color:#fff!important;box-shadow:0 14px 28px -14px rgba(10,100,255,.9)!important}
  html body .podcast-detail-overlay.pp-v3 .pp-acts .pp-main:hover{background:#2a7bff!important}
  html body .podcast-detail-overlay.pp-v3 .pp-acts .pp-main svg{fill:#fff!important;stroke:none!important}
  html body .podcast-detail-overlay.pp-v3 .pp-acts .pp-sec{border:1.5px solid rgba(255,255,255,.3)!important;background:rgba(255,255,255,.04)!important;color:#fff!important;box-shadow:none!important}
  html body .podcast-detail-overlay.pp-v3 .pp-acts .pp-sec:hover{border-color:rgba(255,255,255,.6)!important;background:rgba(255,255,255,.1)!important}
  html body .podcast-detail-overlay.pp-v3 .pp-acts .pp-sec svg{fill:none!important;stroke:currentColor!important;stroke-width:2!important;stroke-linecap:round}

  /* episódios em linhas */
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-base{margin:44px 0 0!important;padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-head{display:flex!important;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 10px!important;padding:0 0 12px!important;border-bottom:1px solid rgba(160,190,240,.14)}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-head strong{font-size:22px!important;color:#fff!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-head span{font-size:11px!important;letter-spacing:.12em;text-transform:uppercase;color:#7f97b7!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-status:empty{display:none}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-list{display:flex!important;flex-direction:column;gap:2px!important;max-height:none!important;overflow:visible!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item{
    position:relative;display:grid!important;grid-template-columns:64px minmax(0,1fr) 44px!important;align-items:center;gap:16px!important;
    width:100%;min-height:84px;margin:0!important;padding:10px 12px!important;border:0!important;border-radius:14px!important;
    background:transparent!important;box-shadow:none!important;text-align:left;color:#fff;cursor:pointer;transition:background .15s ease}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item:hover{background:rgba(255,255,255,.05)!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item.active{background:rgba(10,100,255,.12)!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item > img,
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item > .pod-fallback{display:block!important;width:64px!important;height:64px!important;margin:0!important;border-radius:10px!important;object-fit:cover;background:var(--pod-brand,#132f52)}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item-copy{min-width:0}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item-copy strong{display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:normal!important;font-size:16px!important;line-height:1.3!important;color:#fff!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item-copy span{display:block;margin-top:5px;font-size:13px!important;color:#93abc8!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item > i{
    position:relative!important;display:grid!important;place-items:center;width:44px;height:44px;border-radius:50%;
    border:0!important;background:#0a64ff!important;color:transparent!important;font-size:0!important;font-style:normal;box-shadow:none!important;overflow:hidden}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item > i::before{content:"";position:absolute!important;left:50%;top:50%;width:0;height:0;margin:0!important;
    border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent #fff;transform:translate(-38%,-50%)}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item.pp-playing > i::before{width:11px;height:13px;border-width:0 4px;border-color:#fff;transform:translate(-50%,-50%)}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-item > u.pod-ep-bar{left:92px!important;right:72px!important;bottom:8px!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-base > .podcast-native-player,
  html body .podcast-detail-overlay.pp-v3 .podcast-episode-base > .podcast-native-timeline{display:none!important}

  /* grade por rádio */
  html body .podcast-detail-overlay.pp-v3 .podcast-schedule{margin:44px 0 0!important;padding:20px!important;border:1px solid rgba(160,190,240,.12)!important;border-radius:20px!important;background:rgba(255,255,255,.03)!important;box-shadow:none!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-schedule-head{display:flex!important;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 14px!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-schedule-head strong{font-size:19px!important;color:#fff!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-schedule-head span{font-size:10.5px!important;letter-spacing:.1em;text-transform:uppercase;color:#7f97b7!important;text-align:right}
  html body .podcast-detail-overlay.pp-v3 .podcast-availability{margin:22px 0 0!important;padding:0!important;border:0!important;background:none!important;font-size:13px!important;line-height:1.5!important;color:#7f97b7!important;max-width:70ch}

  /* player flutuante, centralizado no pé da tela */
  html body .podcast-detail-overlay.pp-v3 .pp-dock:not(.is-full){
    position:fixed!important;left:50%!important;right:auto!important;bottom:18px!important;top:auto!important;z-index:30!important;
    width:min(760px,calc(100% - 48px))!important;max-width:none!important;margin:0!important;transform:translateX(-50%);
    padding:10px 12px 10px 10px!important;border:1px solid rgba(160,190,240,.18)!important;border-radius:20px!important;
    background:rgba(9,27,52,.94)!important;box-shadow:0 24px 50px -20px rgba(0,0,0,.9)!important}
  html body .podcast-detail-overlay.pp-v3 .pp-dock:not(.is-full)::before{left:20px;top:-1px;max-width:calc(100% - 40px);border-radius:2px}
}
/* telas largas: um pouco mais de ar */
@media (min-width:1400px){
  html body .podcast-detail-overlay.pp-v3 .podcast-detail{padding-top:120px!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-visual{top:120px!important}
}
/* computador baixo (notebook 1366×768): a capa não fica presa para não cobrir nada */
@media (min-width:761px) and (max-height:700px){
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-visual{position:relative!important;top:auto!important}
}
/* entre 761 e 980 px a capa vai para cima do texto, menor */
@media (min-width:761px) and (max-width:980px){
  html body .podcast-detail-overlay.pp-v3 .podcast-detail{grid-template-columns:minmax(0,1fr)!important;padding-top:88px!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-visual{position:relative!important;top:auto!important;grid-row:1!important;width:240px!important;margin:0 0 28px!important}
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-copy{grid-column:1!important;grid-row:2!important}
}
@media (prefers-reduced-motion:reduce){
  html body .podcast-detail-overlay.pp-v3 .podcast-detail-close,
  html body .podcast-detail-overlay.pp-v3 .pp-acts > *{transition:none}
}
/* celular: o botão principal acompanha o azul NRK dos plays de episódio (24.105) e a descrição
   não ganha mais a tarja escura atrás das linhas */
@media (max-width:760px){
  html body .podcast-detail-overlay.pp-v3 .pp-acts .pp-main{background:#0a64ff!important;box-shadow:0 12px 24px -12px rgba(10,100,255,.85)!important}
  html body .podcast-detail-overlay.pp-v3 #podcastDetailDescription{background:none!important;box-shadow:none!important;text-shadow:none!important}
  html body .podcast-detail-overlay.pp-v3 small#podcastDetailStation{align-self:flex-start}
}
