
:root{--fundo:#0a1322;--fundo2:#12203a;--cartao:rgba(255,255,255,.045);--cartao-forte:rgba(217,178,95,.10);
--ouro:#d9b25f;--ouro-claro:#f1d898;--texto:#f4f1ea;--suave:#9fabbd;--linha:rgba(255,255,255,.08);
--borda:rgba(217,178,95,.28);--serif:Georgia,"Times New Roman",serif}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{min-height:100vh;color:var(--texto);font:16px/1.4 "Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
background:radial-gradient(120% 60% at 100% 0%,rgba(217,178,95,.14),transparent 55%),
radial-gradient(90% 50% at 0% 100%,rgba(40,80,140,.28),transparent 60%),
linear-gradient(170deg,var(--fundo2),var(--fundo) 55%) fixed;background-color:var(--fundo)}
body.tocando{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
a{color:var(--ouro-claro)}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
svg{display:block}
.conteudo{max-width:560px;margin:0 auto;padding:max(14px,env(safe-area-inset-top)) 18px 40px}
.topo{display:flex;align-items:center;justify-content:space-between;height:52px}
.topo img{height:44px;display:block;margin-left:-6px}
.topo a{text-decoration:none;font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--suave);
padding:8px 12px;border:1px solid var(--linha);border-radius:20px}
.olho{font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--ouro)}
h1{font-family:var(--serif);font-weight:700;letter-spacing:-.5px;line-height:1.1}
h2{font-size:13px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--suave);margin:34px 0 6px}

/* topo da edição: capa pequena + data, como a ficha de um episódio */
.hero{display:flex;gap:16px;align-items:center;margin-top:18px}
.hero img{width:112px;height:112px;border-radius:14px;flex:none;border:1px solid var(--borda);
box-shadow:0 14px 34px rgba(0,0,0,.5)}
.hero h1{font-size:26px;margin-top:6px}
.hero .meta{margin-top:6px;font-size:14px;color:var(--suave)}
.principal-btn{margin-top:22px;width:100%;display:flex;align-items:center;justify-content:center;gap:10px;
min-height:56px;border-radius:16px;background:linear-gradient(180deg,#e6c473,var(--ouro));color:#1a1405;
font-size:17px;font-weight:700;text-decoration:none;box-shadow:0 10px 28px rgba(217,178,95,.25)}
.principal-btn svg{width:20px;height:20px;fill:currentColor}
.principal-btn:active,.ep button:active{transform:scale(.97)}

/* partes como lista de episódios */
.eps{list-style:none}
.ep{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--linha)}
.ep:last-child{border-bottom:0}
.ep button.ouvir{width:48px;height:48px;border-radius:50%;flex:none;display:grid;place-items:center;
border:1.5px solid var(--ouro);color:var(--ouro);transition:transform .1s}
.ep button.ouvir svg{width:20px;height:20px;fill:currentColor}
.ep.ativa button.ouvir{background:var(--ouro);color:#1a1405}
.ep .txt{flex:1;min-width:0}
.ep h3{font-size:17px;font-weight:700}
.ep .estado{font-size:13px;color:var(--suave);margin-top:2px}
.ep.ativa .estado{color:var(--ouro-claro)}
.temas{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.temas span{font-size:12px;color:#c9d1dc;background:var(--cartao);border:1px solid var(--linha);border-radius:20px;
padding:4px 10px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ep .desc{font-size:14px;color:#c9d1dc;margin-top:8px}
.barra-parte{height:3px;border-radius:2px;background:var(--linha);margin-top:12px;overflow:hidden}
.barra-parte i{display:block;height:100%;background:var(--ouro);width:0}

.cartao{background:var(--cartao);border:1px solid var(--linha);border-radius:18px;padding:4px 16px}
.manchetes{list-style:none;counter-reset:m}
.manchetes li{counter-increment:m;display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--linha);
font-size:16px;line-height:1.4}
.manchetes li:last-child{border-bottom:0}
.manchetes li::before{content:counter(m);font-family:var(--serif);font-size:22px;font-weight:700;color:var(--ouro);
min-width:16px;line-height:1.1}
.capa-grande{display:block;width:100%;border-radius:18px;border:1px solid var(--borda);margin-top:10px}
.baixar{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.baixar a{font-size:14px;text-decoration:none;color:var(--texto);border:1px solid var(--linha);border-radius:20px;padding:8px 14px}
.aviso{color:var(--suave);font-style:italic;margin-top:16px}

/* player fixo */
.player{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:10;
max-width:560px;margin:0 auto;background:rgba(18,30,52,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
border:1px solid var(--borda);border-radius:18px;padding:8px 10px 10px;box-shadow:0 18px 40px rgba(0,0,0,.55)}
.player[hidden]{display:none}
.player input{width:100%;display:block;height:16px;margin:0 0 4px;accent-color:var(--ouro);background:transparent}
.player .linha{display:flex;align-items:center;gap:8px}
.player img{width:42px;height:42px;border-radius:8px;flex:none}
.player .info{flex:1;min-width:0}
.player .info b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player .info span{font-size:12px;color:var(--suave);font-variant-numeric:tabular-nums}
.player .btn{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;flex:none}
.player .btn svg{width:24px;height:24px;fill:var(--texto)}
.player .principal{width:46px;height:46px;background:var(--ouro)}
.player .principal svg{fill:#1a1405}
.player .vel{width:auto;min-width:42px;padding:0 6px;font-size:13px;font-weight:700;color:var(--ouro-claro);
border:1px solid var(--borda);border-radius:14px;height:30px}
@media (max-width:360px){.player img{display:none}}

/* página inicial */
.titulo-site{margin-top:18px}
.titulo-site h1{font-size:40px}
.titulo-site h1 span{color:var(--ouro)}
.titulo-site p{color:var(--suave);margin-top:6px}
.hoje{display:block;margin-top:22px;text-decoration:none;color:var(--texto);background:var(--cartao);
border:1px solid var(--borda);border-radius:22px;padding:14px;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.hoje img{display:block;width:100%;border-radius:14px}
.hoje .rodape-card{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}
.hoje .quando b{display:block;font-size:17px;margin-top:2px}
.hoje .play-redondo{width:54px;height:54px;border-radius:50%;background:var(--ouro);display:grid;place-items:center;flex:none;
box-shadow:0 8px 22px rgba(217,178,95,.3)}
.hoje .play-redondo svg{width:22px;height:22px;fill:#1a1405;margin-left:2px}
.edicoes{list-style:none}
.edicoes a{display:flex;gap:14px;align-items:center;text-decoration:none;color:var(--texto);padding:12px 0;
border-bottom:1px solid var(--linha)}
.edicoes li:last-child a{border-bottom:0}
.edicoes img{width:64px;height:64px;border-radius:12px;flex:none;border:1px solid var(--borda)}
.edicoes .txt{flex:1;min-width:0}
.edicoes small{display:block;font-size:12px;font-weight:700;letter-spacing:.5px;color:var(--ouro-claro);margin-bottom:3px}
.edicoes .txt span{font-size:15px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.edicoes em{flex:none;font-style:normal;font-size:12px;color:var(--suave)}
.topo a.logo{border:0;padding:0}
.hoje .dur{display:block;font-size:13px;color:var(--suave);margin-top:2px}
.acoes-topo{display:flex;gap:8px;align-items:center}
.icone{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--linha)}
.icone svg{width:18px;height:18px;fill:var(--texto)}
.icone.ok{border-color:var(--ouro)}
.icone.ok svg{fill:var(--ouro)}
.semana{display:flex;justify-content:space-between;gap:4px;margin-top:10px}
.semana .dia{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;color:var(--suave)}
.semana small{font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase}
.semana i{font-style:normal;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:14px;
font-weight:700;border:1.5px dashed rgba(255,255,255,.14);color:rgba(255,255,255,.3)}
.semana .livre i{border:1.5px solid var(--borda);color:var(--texto)}
.semana .meio i{border:2px solid var(--ouro);color:var(--ouro-claro);background:conic-gradient(rgba(217,178,95,.25) 0 50%,transparent 0)}
.semana .ouvido i{background:var(--ouro);border:0;color:#1a1405}
.semana .atual small{color:var(--ouro)}
.semana .atual i{box-shadow:0 0 0 3px rgba(217,178,95,.25)}
.player .abre{display:flex;align-items:center;gap:8px;flex:1;min-width:0;text-align:left}
body.travado{overflow:hidden}
.tela{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;padding:max(12px,env(safe-area-inset-top)) 22px
calc(22px + env(safe-area-inset-bottom));background:radial-gradient(100% 60% at 50% 0%,rgba(217,178,95,.22),transparent 60%),
linear-gradient(180deg,#16274a,var(--fundo) 70%);animation:sobe .25s ease-out}
.tela[hidden]{display:none}
@keyframes sobe{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}}
.tela-topo{display:flex;align-items:center;justify-content:space-between;height:48px;font-size:12px;font-weight:700;
letter-spacing:1.5px;text-transform:uppercase;color:var(--suave)}
.tela-topo button{width:40px;height:40px;display:grid;place-items:center}
.tela-topo svg{width:28px;height:28px;fill:var(--texto)}
.tela-capa{width:100%;max-width:min(360px,46vh);aspect-ratio:1;margin:auto auto 0;border-radius:18px;
border:1px solid var(--borda);box-shadow:0 30px 60px rgba(0,0,0,.55)}
.tela-info{margin-top:26px}
.tela-info h2{font-family:var(--serif);font-size:28px;color:var(--texto);text-transform:none;letter-spacing:-.3px;margin:4px 0 0}
.tela input{width:100%;margin-top:20px;accent-color:var(--ouro);height:20px}
.tempos{display:flex;justify-content:space-between;font-size:12px;color:var(--suave);font-variant-numeric:tabular-nums;margin-top:2px}
.controles{display:flex;align-items:center;justify-content:space-between;margin:18px 0 8px}
.controles button{width:56px;height:56px;display:grid;place-items:center;border-radius:50%}
.controles svg{width:34px;height:34px;fill:var(--texto)}
.controles .grande{width:78px;height:78px;background:var(--ouro);box-shadow:0 12px 30px rgba(217,178,95,.3)}
.controles .grande svg{width:34px;height:34px;fill:#1a1405}
.controles .vel{font-size:15px;font-weight:700;color:var(--ouro-claro);width:56px;height:36px;border:1px solid var(--borda);border-radius:18px}
.controles .vazio{width:56px}
.proxima{margin-top:10px;width:100%;padding:12px;border-radius:14px;border:1px solid var(--linha);font-size:14px;color:var(--suave)}
footer{margin-top:36px;text-align:center;font-size:12px;color:var(--suave);letter-spacing:.5px}
