/* User-approved illustration set v2. The PNGs already include the typography. */
.disc-face.illustrated-disc{
  container-type:inline-size;
  background:transparent;
  border:0;
  box-shadow:none;
  -webkit-mask-image:radial-gradient(circle closest-side,transparent 0 16.7%,#000 17% 98.4%,transparent 98.6%);
  mask-image:radial-gradient(circle closest-side,transparent 0 16.7%,#000 17% 98.4%,transparent 98.6%);
}
.disc-art-image{display:block;width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none}
/* Keep the back's hole aligned: opaque RGB artwork also needs a real aperture. */
.disc-back{
  inset:0;
  -webkit-mask-image:radial-gradient(circle closest-side,transparent 0 16.7%,#000 17% 98.4%,transparent 98.6%);
  mask-image:radial-gradient(circle closest-side,transparent 0 16.7%,#000 17% 98.4%,transparent 98.6%);
}
.disc-shell .disc-edge{inset:.7%;opacity:.6}
.disc-shell.active .disc-face{filter:none}
.disc-shell:not(.active) .disc-face{filter:brightness(.84)}
.reader-cover .disc-face{animation:record-playing 45s linear infinite;animation-play-state:paused;will-change:transform}
#reader[open] .reader-cover .disc-face{animation-play-state:running}
body.space-motion-off #reader .reader-cover .disc-face,body.page-inactive #reader .reader-cover .disc-face{animation-play-state:paused}
@keyframes record-playing{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media(max-width:700px){.reader-cover{width:104px;--disc-size:104px}.reader-sidebar{grid-template-columns:104px 1fr}.editorial-note{bottom:21.5%}}
@media(prefers-reduced-motion:reduce){#reader .reader-cover .disc-face{animation:none!important}}
.article-content img{display:block;max-width:100%;height:auto;margin:1.2em auto;border-radius:4px}