/* Media never participates in layout: the fixed copy defines one image-backed frame. */
.xb-closing-media { position: absolute; inset: 0; z-index: -2; overflow: hidden; background: #000; }
.xb-closing-slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 65%; opacity: 0; transition: opacity .7s ease; }
.xb-closing-slide.is-active { opacity: 1; }
.xb-closing-frame::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgb(0 0 0 / 30%); pointer-events: none; }
.xb-closing-copy { position: relative; }
.xb-closing-words { min-width: 0; }
@media (min-width: 901px) and (max-width: 1100px) {
  .xb-new-web .xb-closing-title { width: 36%; }
  .xb-new-web .xb-closing-words { width: 22%; }
}
@media (max-width: 900px) {
  .xb-new-web .xb-closing-copy { min-height: clamp(20rem, 58vw, 30rem); padding: 2rem 1.25rem; gap: 1rem; align-items: flex-end; }
  .xb-new-web .xb-closing-title,
  .xb-new-web.xb-day-closing:not(:lang(zh)) .xb-closing-title { width: 58%; font-size: clamp(1.25rem, 3.4vw, 2rem); line-height: 1.2; transform: rotate(-3deg); text-shadow: 0 1px 2px #000, 0 0 3px #000; }
  .xb-new-web .xb-closing-words { width: 38%; align-self: flex-end; padding-inline-start: .75rem; font-size: clamp(.75rem, 1.7vw, 1rem); text-shadow: 0 1px 2px #000, 0 0 3px #000; }
  .xb-new-web:lang(zh) .xb-closing-title { font-size: clamp(1.125rem, 3vw, 1.75rem); line-height: 1.5; }
}
@media (prefers-reduced-motion: reduce) {
  .xb-closing-slide { transition: none; }
}