/* Ajustes de jingles e leitura do Almanaque. */
@media (min-width:901px) {
  /* O aparelho pode ser mais largo que a janela e é centralizado. Ancorar na área visível. */
  .player-panel .participation-poster {
    left:auto;
    right:calc(50% - 48.5vw);
    top:1.5%;
    width:min(19.2vw, calc(50svh - 55px));
    max-width:none;
    gap:6px;
  }
  .player-panel .participation-poster .participation-button--glow {
    box-sizing:border-box;
    width:100%;
    max-width:100%;
    min-height:44px;
    padding:8px 6px;
    font-size:clamp(11px,.95vw,18px);
  }
}
/* As capas ficam no lugar; só o foco cresce para permitir enxergar e tocar. */
.sponsor-card:hover,.sponsor-card:focus-visible { z-index: 26; transform: scale(1.5); }
.sponsor-card:hover .sponsor-card__veil,
.sponsor-card:focus-visible .sponsor-card__veil { opacity: 1; }
.sponsor-card__play { width: clamp(24px,2.8vw,48px); background: #21130dc9; color: #fff; }
.jingle-stop,
.sponsors-section.is-playing .jingle-stop {
  width: clamp(35px,3.2vw,57px); border: 2px solid #ffd7ba;
  background: radial-gradient(circle at 32% 25%,#ff7164,#b51512 56%,#640b0a);
  color: #fff; font-size: clamp(14px,1.3vw,22px);
  box-shadow: 0 0 10px #f51f1a, inset 0 1px #fff8;
}
.sponsors-section.is-playing .jingle-stop { animation: cmwr-stop-glow 1.5s ease-in-out infinite; }
@keyframes cmwr-stop-glow { 50% { box-shadow: 0 0 24px #ff4132,0 0 8px #fff8,inset 0 1px #fff8; } }
@media(max-width:900px) {
  .participation-poster { width: min(360px,calc(100% - 24px)); }
  .sponsor-card:hover,.sponsor-card:focus-visible { transform: scale(1.3); }
  .jingle-stop,.sponsors-section.is-playing .jingle-stop {
    width: 44px !important; height: 44px !important;
    background: radial-gradient(circle at 32% 25%,#ff7164,#b51512 56%,#640b0a) !important;
    color: white !important; font-size: 17px !important;
  }
}
@media(prefers-reduced-motion:reduce){.sponsors-section.is-playing .jingle-stop{animation:none}}
.participation-poster__face { position:relative; width:100%; }
/* A rolagem da gôndola e do encarte termina na própria janela. */
.archive-dialog[open],
.archive-dialog #archive-options,
.archive-dialog .archive-preview { overscroll-behavior: contain; }

/* Página 10: crônica acima, ilustração completa abaixo. */
.article-page--chronicle .article-page__body {
  flex:1; min-height:0; column-count:2; column-gap:1rem;
  padding:.4rem .5rem; overflow:auto;
  background:rgba(248,245,251,.76); font-size:clamp(11px,.78vw,14px);
}
.article-page--chronicle .article-page__body p { break-inside:avoid; }
.article-page--chronicle>.article-page__visual {
  flex:0 0 23%; width:94%; align-self:center; border:0;
  background:transparent; overflow:visible;
}
.article-page--chronicle>.article-page__visual img { object-fit:contain; object-position:center bottom; }
.article-page--chronicle .article-signature {
  margin-top:.7em; text-align:right; font:italic 700 1.1em/1.3 Georgia,serif;
}
@media(max-width:900px){
  .article-page--chronicle .article-page__body { column-count:1; font-size:clamp(12px,3.2vw,15px); }
  .article-page--chronicle>.article-page__visual { flex-basis:21%; width:100%; }
}