/* Postell's Obituary Media Sync — front end. Inherits the theme's fonts/colors. */
.poms-media { margin: 0 0 2em; }
.poms-section { margin: 0 0 2em; }
.poms-heading { margin: 0 0 .6em; }
.poms-graphic { margin: 0 0 1em; text-align: center; }
.poms-graphic img { display: inline-block; width: 100%; max-width: 560px; height: auto; }
.poms-graphic figcaption { font-size: .85em; opacity: .8; }
.poms-event { margin: 0 0 1.5em; }
.poms-event__title { font-size: 1.15em; margin: 0 0 .5em; }
.poms-recording { margin: 0 0 1.25em; }
.poms-recording__part { font-size: 1em; margin: 0 0 .4em; }
.poms-status { margin: 0 0 .5em; font-weight: 600; }
.poms-badge--live { display: inline-block; padding: .1em .55em; border-radius: 3px; background: #b3261e; color: #fff; }

.poms-player { position: relative; width: 100%; max-width: 800px; aspect-ratio: 16 / 9; background: #1d1d1f; color: #fff; border-radius: 6px; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.poms-player__button { display: inline-flex; align-items: center; gap: .6em; padding: .8em 1.4em; font: inherit; font-size: 1.05em; font-weight: 600; color: #1d1d1f; background: #fff; border: 0; border-radius: 999px; cursor: pointer; min-height: 44px; }
.poms-player__button:hover { background: #f1ece2; }
.poms-player__button:focus-visible { outline: 3px solid #f0c75e; outline-offset: 3px; }
.poms-player__icon { width: 0; height: 0; border-style: solid; border-width: .5em 0 .5em .85em; border-color: transparent transparent transparent currentColor; }
.poms-player__note { margin: .8em 1em 0; font-size: .85em; opacity: .85; }
.poms-player__frame { position: absolute; inset: 0; }
.poms-player__frame iframe { width: 100%; height: 100%; border: 0; }
.poms-player__frame--fb { position: static; width: 100%; height: 100%; overflow: auto; background: #000; }

.poms-links { margin: .6em 0 0; display: flex; flex-wrap: wrap; gap: .5em 1em; }
.poms-link { font-weight: 600; }
.poms-preview-banner { padding: .6em .8em; background: #fff4ce; border-left: 4px solid #d9a400; color: #1d1d1f; }
.poms-graphic--preview { outline: 2px dashed #d9a400; outline-offset: 4px; }

@media (max-width: 600px) {
	.poms-player { border-radius: 0; }
	.poms-player__button { font-size: 1em; }
}
@media (prefers-reduced-motion: reduce) {
	.poms-player__button { transition: none; }
}
