/*
 * Base comum aos cinco modelos do player. Mantém a identidade de cada modelo,
 * mas evita corte de texto e sobreposição em telas estreitas ou baixas.
 */
html, body { min-height: 100%; min-height: 100dvh; width: 100%; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, video, iframe { max-width: 100%; }
#player-app-, #conteudo_externo { min-height: 100dvh; }
#conteudo_externo { position: fixed !important; inset: 0; overflow: hidden; }
#iframe_conteudo_externo { width: 100% !important; height: calc(100dvh - 40px) !important; border: 0; }
.icone-menu { position: fixed !important; top: max(10px, env(safe-area-inset-top)) !important; left: max(10px, env(safe-area-inset-left)) !important; z-index: 1001 !important; }
#sidebar { width: min(86vw, 320px) !important; left: min(-86vw, -320px) !important; max-width: 320px; padding-bottom: env(safe-area-inset-bottom); overflow-y: auto !important; overscroll-behavior: contain; }
#sidebar.active { left: 0 !important; }
#sidebar .sidebar-header, #sidebar li, #sidebar a { overflow-wrap: anywhere; word-break: break-word; }
#anuncios { position: fixed !important; left: 0; right: 0; bottom: env(safe-area-inset-bottom); max-height: 72px; z-index: 950 !important; }
[id^="player-app-"] { max-width: 100%; }
#player-app-title, #player-app-artist, #player-app-texttitle, #player-app-textartist, .sg-noar3 h2, .sg-noar3 h3, .sg-noar3 h4 { overflow-wrap: anywhere; word-break: break-word; }
@media (max-width: 480px), (max-height: 620px) {
  #anuncios { max-height: 54px; }
  #anuncios img { max-height: 54px !important; object-fit: contain; }
  .icone-menu { transform: scale(.9); transform-origin: top left; }
}
