/* Reset theme spacing; use 12px between videos on desktop and 16px on mobile. */
.entry-content .daphne-works, .daphne-works { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; }
.entry-content .daphne-works .dw-work, .daphne-works .dw-work { display: block; position: relative; width: 100%; aspect-ratio: 16 / 9; margin: 0; padding: 0; border: 0; background: #000; overflow: hidden; }
.daphne-works .dw-play { position: absolute; inset: 0; display: block; color: inherit; }
.daphne-works .dw-play img { display: block; width: 100%; height: 100%; object-fit: cover; margin: 0; padding: 0; }
.daphne-works .dw-caption { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; opacity: 0; background: rgb(0 0 0 / 25%); }
/* Keep the original theme face explicit instead of inheriting link typography. */
.daphne-works .figcaption__main, .daphne-works .figcaption__sub { font-family: GalanoGrotesque-Medium, sans-serif; font-weight: 400; font-style: normal; }
.daphne-works .dw-play:hover .dw-caption, .daphne-works .dw-play:focus-visible .dw-caption { opacity: 1; }
.daphne-works .dw-play:focus-visible { outline: 3px solid #bfdfc3; outline-offset: -3px; }
.daphne-works .dw-work iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; }
@media (hover: none), (max-width: 750px) { .daphne-works .dw-caption { opacity: 1; } }
/* The preserved theme's mobile rules target .fig, which these overlays do not use. */
@media (max-width: 750px) {
  .entry-content .daphne-works, .daphne-works { gap: 16px; }
  .daphne-works .dw-caption { padding: 12px; }
  .daphne-works .figcaption__main { font-size: clamp(36px, 10vw, 48px); }
  .daphne-works .figcaption__sub { font-size: clamp(20px, 5vw, 22px); line-height: 1.4; }
  .daphne-works .figcaption__main, .daphne-works .figcaption__sub { max-width: 100%; overflow-wrap: anywhere; }
}