/* Purpose: Full-screen video modal for the Museum of Sparkle showroom film. */

.modal { position: fixed; inset: 0; z-index: var(--z-modal); background: var(--color-modal-backdrop); display: none; place-items: center; padding: var(--space-6); }
.modal.open { display: grid; }
.modal video { width: min(1000px, 100%); max-height: 80vh; border: 1px solid var(--color-accent-line); background: var(--color-black); }
.modal .x { position: absolute; top: calc(16px + env(safe-area-inset-top, 0px)); right: var(--space-4); width: 46px; height: 46px; border: 1px solid var(--color-accent-line); background: transparent; color: var(--color-ivory); font-size: var(--text-2xl); cursor: pointer; }