/* El altavoz de la ilustración recibe un control real en escritorio. */
.cover-mute{position:absolute;pointer-events:auto;left:63.7%;top:51.8%;width:2.5%;height:4.1%;border:0;padding:0;background:transparent;color:#ff9a51;border-radius:3px;cursor:pointer}
.cover-mute span{display:none}
.cover-mute.is-muted span{display:grid;place-items:center;height:100%;background:#061014;font-size:2cqw;font-weight:bold;color:var(--orange)}
.home-sound{display:none}
.radio-button{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid var(--blue);border-radius:5px;padding:10px 14px;background:#102733;color:var(--blue);font:600 14px Arial,sans-serif;cursor:pointer;touch-action:manipulation}
.radio-button:hover{background:#1a3949}
.radio-play{border-color:var(--orange);color:#ffcfaa;background:#302015}
.radio-button.is-muted{color:#ffca9e;border-color:var(--orange);background:#312217}

/* Fondo exterior: el iframe conserva su documento y opacidad originales. */
#chat{background-color:#080f15;background-image:linear-gradient(180deg,#03091066,#02070a26),url('../assets/portada-aprobada.png');background-size:cover;background-position:center 42%;background-repeat:no-repeat;padding:22px clamp(16px,4vw,60px) 32px;border-bottom:1px solid #35606d}
#chat .chat-toolbar{align-items:center;justify-content:space-between;flex-wrap:wrap;min-height:56px;gap:8px 16px;margin:0 0 6px;padding:10px 12px;background:#08121cf2;border:1px solid #2d5362;border-radius:5px}
.chat-connection-info{min-width:0;color:var(--muted);font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.chat-connection-info p{margin:0}
.chat-connection-info a{display:inline-flex;align-items:center;min-height:32px;font-size:11px}
.chat-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;max-width:100%}
.compact-player{padding:5px 6px;border:1px solid #2b5e73;border-top:2px solid var(--orange);border-radius:5px;background:#0b1b25}
.compact-controls{display:flex;align-items:center;gap:6px;min-width:0}
.compact-controls .radio-button{width:44px;min-height:44px;padding:8px;gap:0;font-size:18px;flex-shrink:0}
.compact-volume{display:flex;align-items:center;min-width:0}
.compact-volume input{width:104px;min-width:64px;height:44px;margin:0;accent-color:var(--blue);cursor:pointer;touch-action:pan-y}
#chat .chat-help{display:table;max-width:100%;background:#08121cf2;padding:0 12px;border:1px solid #254553;border-radius:4px;margin:0 0 16px}
#chat .chat-help .chat-note{max-width:620px}
#chat .chat-container{height:clamp(500px,68dvh,850px);min-height:500px;border:1px solid #46c9ee;box-shadow:0 0 0 5px #06131dcc,0 0 24px #0009;background:#101821}
#chat .chat-disconnected{min-height:500px;background:#101b24f5;border-color:var(--blue)}
#chat>.chat-note{display:table;max-width:100%;padding:8px 12px;background:#08121cf2;border-radius:3px;font-size:12px;margin:18px 0 0}
@media(max-width:1024px){
  /* En pantallas táctiles no se superpone Mute al estrecho hueco del altavoz:
     se ofrece un botón separado de 44 px para no invadir el deslizador. */
  .cover-mute{display:none}
  .home-sound{display:flex;align-items:center;justify-content:center;gap:14px;padding:10px 4%;border-bottom:1px solid #244452;background:#0b1821}
  .home-sound output{font-size:12px;color:var(--muted)}
}

@media(max-width:800px){
  #chat .chat-toolbar{padding:8px;gap:8px}
  #chat .chat-toolbar .chat-button{padding:10px 12px;font-size:12px;min-width:110px}
  .chat-connection-info{font-size:11px}
  .compact-volume input{width:84px}
}
@media(max-width:600px){
  #chat:not([hidden]){display:block;height:auto;min-height:0;padding:12px 12px 24px;background-position:36% center}
  #chat .chat-toolbar{padding:8px;gap:6px}
  .chat-connection-info{flex-basis:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px}
  .chat-connection-info a{font-size:10px;min-height:36px;white-space:nowrap}
  .chat-actions{flex-wrap:wrap;width:100%;gap:6px}
  .compact-player{padding:3px 4px}
  .compact-controls{gap:4px}
  .compact-volume input{width:74px}
  #chat .chat-toolbar .chat-button{min-width:104px;padding:10px 8px;font-size:11px}
  #chat .chat-help{margin-bottom:16px}
  #chat .chat-container{height:64vh;height:64dvh;min-height:380px}
  #chat .chat-disconnected{min-height:380px}
  #chat>.chat-note{display:none}
}

/* Portada polar aprobada: zonas reales alineadas al recurso de 1672 x 941.
   Los botones transparentes aprovechan los dibujos sin repetir su interfaz. */
.cover-play{left:calc(29.45% - max(2.75%,22px));top:calc(56.1% - max(4.9%,22px));width:max(5.5%,44px);height:max(9.8%,44px);min-width:0;min-height:0;border:0;background:transparent;box-shadow:none}
.cover-play::before{display:none;content:none}
.is-playing .cover-play .pause-symbol{position:absolute;left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%);display:grid;place-items:center;width:5.5cqw;height:5.5cqw;font-size:3.3cqw;background:radial-gradient(#083144,#03131e 65%,#4ce7ff 70%,#123e4c 75%,transparent 79%)}
.cover-mute{left:calc(62.6% - 22px);top:calc(58.13% - 22px);width:44px;height:44px;min-width:0;min-height:0;border:0;background:transparent;transform:none}
.cover-mute::before{content:none;display:none}
.cover-mute.is-muted span{position:absolute;inset:25% 10%;display:grid;font-size:20px;background:#010b10}
.cover-chat{left:26.5%;top:67.2%;width:45.7%;height:15.9%;min-height:44px;background:transparent;border:0;border-radius:0;clip-path:polygon(10% 0,90% 0,100% 50%,90% 100%,10% 100%,0 50%)}
.cover-volume{left:calc(68.54% - max(4.225%,22px));top:calc(58.13% - 22px);width:max(8.45%,44px);height:44px;min-height:0;background:transparent;border-radius:0}
.cover-volume::before{content:'';position:absolute;inset:auto 0;top:50%;transform:translateY(-50%);height:1.8cqw;min-height:10px;background:#010b10;pointer-events:none}
.cover-volume input{position:relative;width:100%;height:44px;z-index:1}
.cover-volume input::-webkit-slider-runnable-track{transform:none}
.cover-volume input::-moz-range-track{transform:none}
#programacion{background:linear-gradient(#030d1be6,#030d1be6),url('../assets/portada-aprobada.png') center/cover no-repeat}
@media(max-width:600px){
  .cover-play:before{display:none}
  /* Ampliar el objetivo hacia arriba evita invadir el boton de chat. */
  .cover-volume{top:calc(58.13% - 44px)}
  .cover-volume:before{display:block;top:100%}
  .cover-volume input::-webkit-slider-runnable-track{transform:translateY(22px)}
  .cover-volume input::-moz-range-track{transform:translateY(22px)}
  .cover-chat{clip-path:none}
  #programacion{background-position:45% center}
}
