/* Leitor de Ondas (som ambiente do Daiki Circle) — partilhado por
   todas as páginas do Círculo (dashboard, conteudos, comunidade,
   cupoes, faturas), para o som continuar a tocar (e poder ser gerido)
   ao navegar entre elas. Nunca duplicar isto por página — ver
   assets/ondas-player.js para a lógica. Estilo do resto do conteúdo
   (variáveis --red/--black/etc.) vive em cada página; aqui usamos só
   cores fixas para não depender delas. */
#ondas-player{position:fixed;left:16px;right:16px;bottom:16px;z-index:1900;max-width:480px;margin:0 auto;background:#161412;border-radius:10px;padding:16px 18px;color:#F0EBE4;box-shadow:0 12px 32px rgba(0,0,0,.28)}
#ondas-player.inline{position:static;max-width:none;margin-bottom:26px;box-shadow:none;padding:20px 22px}
#ondas-player .op-empty{color:#B9B0A6;font-size:.85rem}
/* .op-meta é só um wrapper de conveniência em JS (ver ensureOndasYtTarget
   em ondas-player.js, que precisa de um irmão fixo para o vídeo do
   YouTube nunca ser destruído ao trocar de faixa) — display:contents
   fá-lo desaparecer da caixa, os filhos dela continuam a participar no
   flex de #ondas-player.compact tal como se não houvesse wrapper. */
#ondas-player .op-meta{display:contents}
#ondas-player .op-now{display:flex;align-items:center;gap:14px}
#ondas-player .op-now-title{font-family:'Cormorant Garamond',serif;font-size:1.2rem;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ondas-player .op-now-title .op-eyebrow{display:block;font-family:'Jost',sans-serif;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:#FF8A7A;margin-bottom:4px}
#ondas-player .op-close{background:none;border:1px solid rgba(255,255,255,.3);color:#fff;font-family:'Jost',sans-serif;font-size:.7rem;width:28px;height:28px;border-radius:50%;cursor:pointer;flex-shrink:0}
#ondas-player .op-close:hover{border-color:#fff}
#ondas-player .op-toggle{background:none;border:1px solid rgba(255,255,255,.3);color:#fff;font-size:.75rem;width:28px;height:28px;border-radius:50%;cursor:pointer;flex-shrink:0;line-height:1;transition:transform .25s ease}
#ondas-player .op-toggle:hover{border-color:#fff}
/* Anterior/seguinte — percorrem a lista de Ondas, disponível tanto na
   própria página de Ondas como no banner flutuante nas outras páginas
   do Círculo. Escondidos no estado compacto (barra simples). */
#ondas-player .op-nav{display:flex;gap:10px;margin-top:14px}
#ondas-player .op-nav-btn{flex:1;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);color:#F0EBE4;font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.03em;border-radius:6px;padding:8px 10px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}
#ondas-player .op-nav-btn:hover{border-color:#fff;background:rgba(255,255,255,.14)}
/* Diminui sozinho assim que se clica em qualquer parte da página (ver
   armOndasAutoCompact em ondas-player.js), para uma faixa bem fina,
   tudo numa única linha — play/pausa, barra de tempo, expandir e
   fechar (o título sai, não há espaço para ele). O botão de baixo (⌄)
   diminui; uma vez diminuído passa a apontar para cima (⌃, por
   rotação de CSS) para voltar a expandir. Aplica-se tanto ao banner
   flutuante (.minimized) das outras páginas do Círculo como à própria
   caixa "a tocar agora" da página de Ondas (.inline) — as duas
   diminuem da mesma forma. */
#ondas-player.compact{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:8px 14px}
#ondas-player.compact .op-nav{display:none}
#ondas-player.compact .op-now{flex:0 0 auto;gap:8px}
#ondas-player.compact .op-now-title{display:none}
#ondas-player.compact .op-controls{order:-1;flex:1;min-width:0;margin-top:0}
#ondas-player.compact .op-playpause{width:26px;height:26px;font-size:.7rem}
#ondas-player.compact .op-progress{flex:1;min-width:40px}
#ondas-player.compact .op-toggle{transform:rotate(180deg)}
/* Faixa de vídeo (YouTube) — nunca se vê nem se expande, por pedido
   explícito ("não deveria dar para expandir, nem dizer YouTube em lado
   nenhum"). Fica escondida visualmente mas continua a tocar (display:
   none pode fazer alguns browsers suspenderem o som; isto não). Em
   troca, ganha controlos próprios (pausa + barra de tempo) logo a
   seguir ao título. */
#ondas-player .op-frame.op-hidden-video{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0);white-space:nowrap;border:0;padding:0;margin:-1px}
#ondas-player .op-controls{display:flex;align-items:center;gap:10px;margin-top:14px}
#ondas-player .op-playpause{background:#fff;color:#161412;border:none;width:32px;height:32px;border-radius:50%;font-size:.8rem;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center}
#ondas-player .op-progress{flex:1;height:4px;background:rgba(255,255,255,.2);border-radius:2px;cursor:pointer;position:relative}
#ondas-player .op-progress-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:#FF8A7A;border-radius:2px}
#ondas-player .op-time{font-size:.66rem;color:#B9B0A6;flex-shrink:0;font-variant-numeric:tabular-nums}
@media(max-width:600px){#ondas-player{left:10px;right:10px;bottom:10px}}