/* Player da área do Rosto Desperto. Cores da marca: verde-noite #13201C, rosa-músculo #FFB3C0, sálvia #E6ECE9.
   Botões com pelo menos 48 px e palavra escrita (nunca só ícone). */
.rdp { --rdp-noite: #13201C; --rdp-rosa: #FFB3C0; --rdp-salvia: #E6ECE9; background: var(--rdp-noite); color: #fff; border-radius: 16px; overflow: hidden; font-family: inherit; -webkit-user-select: none; user-select: none; }
.rdp-palco { position: relative; background: #0b1411; aspect-ratio: 16 / 9; }
.rdp-audio .rdp-palco { aspect-ratio: auto; min-height: 250px; }
.rdp-audio .rdp-capa { padding-bottom: 84px; }
.rdp-audio .rdp-centro { top: auto; bottom: 16px; transform: translateX(-50%); }
.rdp-empe .rdp-palco { max-height: 64vh; margin: 0 auto; }
.rdp-video { display: block; width: 100%; height: 100%; object-fit: contain; background: #0b1411; }
.rdp-audio .rdp-video { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.rdp-video::cue { font-size: 1.1em; background: rgba(19, 32, 28, .85); color: #fff; }

.rdp-capa { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 20px; text-align: center; background: var(--rdp-noite); }
.rdp-capa-ic { width: 64px; height: 64px; border-radius: 50%; background: var(--rdp-rosa); color: var(--rdp-noite); font-size: 30px; display: flex; align-items: center; justify-content: center; }
.rdp-capa-titulo { font-size: 20px; font-weight: 800; }
.rdp-capa-dica { font-size: 15px; color: var(--rdp-salvia); opacity: .85; }

.rdp-bt { -webkit-appearance: none; appearance: none; border: 0; cursor: pointer; font: inherit; color: inherit; background: rgba(255, 255, 255, .12); border-radius: 12px; min-height: 52px; min-width: 52px; padding: 6px 10px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 15px; font-weight: 700; line-height: 1.1; }
.rdp-bt:active { transform: scale(.97); }
.rdp-bt:focus-visible { outline: 3px solid var(--rdp-rosa); outline-offset: 2px; }
.rdp-bt[hidden] { display: none; }
.rdp-ic { font-size: 18px; }
.rdp-ligado { background: var(--rdp-rosa); color: var(--rdp-noite); }

.rdp-centro { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: var(--rdp-rosa); color: var(--rdp-noite); border-radius: 40px; padding: 14px 26px; font-size: 19px; font-weight: 800; box-shadow: 0 4px 18px rgba(0, 0, 0, .35); }
.rdp-centro .rdp-ic { font-size: 22px; }

.rdp-carregando { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); background: rgba(0, 0, 0, .6); padding: 6px 12px; border-radius: 8px; font-size: 14px; }
.rdp-carregando[hidden] { display: none; }

.rdp-aviso { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 20px; background: rgba(19, 32, 28, .94); font-size: 17px; font-weight: 600; line-height: 1.4; }
.rdp-aviso[hidden] { display: none; }
.rdp-aviso-toque { cursor: pointer; text-decoration: underline; text-decoration-color: var(--rdp-rosa); text-underline-offset: 4px; }

.rdp-continuar { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 16px; background: rgba(19, 32, 28, .88); }
.rdp-continuar[hidden] { display: none; }
.rdp-cont-texto { margin: 0; font-size: 17px; font-weight: 600; }
.rdp-cont-sim { background: var(--rdp-rosa); color: var(--rdp-noite); min-width: 220px; font-size: 17px; }
.rdp-cont-nao { min-width: 220px; }

.rdp-controles { padding: 10px 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.rdp-barra { display: flex; align-items: center; gap: 10px; }
.rdp-tempo { font-size: 14px; font-variant-numeric: tabular-nums; min-width: 42px; text-align: center; color: var(--rdp-salvia); }
.rdp-trilho { flex: 1; height: 32px; margin: 0; background: transparent; -webkit-appearance: none; appearance: none; }
.rdp-trilho::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .25); }
.rdp-trilho::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; margin-top: -9px; border-radius: 50%; background: var(--rdp-rosa); border: 0; }
.rdp-trilho::-moz-range-track { height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .25); }
.rdp-trilho::-moz-range-progress { height: 6px; border-radius: 3px; background: var(--rdp-rosa); }
.rdp-trilho::-moz-range-thumb { width: 24px; height: 24px; border-radius: 50%; background: var(--rdp-rosa); border: 0; }
.rdp-linha { display: flex; gap: 8px; }
.rdp-linha .rdp-bt { flex: 1; }
.rdp-tocar { background: var(--rdp-rosa); color: var(--rdp-noite); }

/* Tela cheia: o vídeo ocupa tudo e os controles ficam embaixo. */
.rdp-cheia { display: flex; flex-direction: column; width: 100vw; height: 100vh; border-radius: 0; }
.rdp-cheia .rdp-palco { flex: 1; aspect-ratio: auto; min-height: 0; }
.rdp-cheia .rdp-controles { max-width: 720px; width: 100%; margin: 0 auto; }

@media (max-width: 360px) {
  .rdp-bt { font-size: 14px; padding: 6px; }
  .rdp-ic { font-size: 16px; }
}
@media (orientation: landscape) and (max-height: 500px) {
  .rdp-cheia .rdp-linha { display: none; }
  .rdp-cheia.rdp:not(.rdp-tocando) .rdp-linha { display: flex; }
}

/* Rótulos curtos numa linha só, mesmo em celular estreito (pedido do central, 30/10/2026). */
.rdp-rot { white-space: nowrap; }
