.ax-preview, .ax-preview * { box-sizing: border-box; }
.ax-preview button:focus-visible { outline: 3px solid #ffde90; outline-offset: 5px; }
.ax-preview { width: min(1100px, calc(100% - 40px)); max-width: none; padding: 0; border: 1px solid #6c8ab8; border-radius: 8px; background: #0c2248; color: #fff; }
.ax-preview::backdrop { background: #020c20d9; }
.ax-preview-heading { display: flex; align-items: center; gap: 24px; padding: 14px 20px; }
.ax-preview-heading h2 { flex: 1; margin: 0; font-size: 18px; line-height: 1.5; }
.ax-preview-heading button { flex: none; width: 44px; height: 44px; padding: 0; border: 1px solid #8ba4cb; border-radius: 4px; background: transparent; color: #fff; font-size: 30px; cursor: pointer; }
.ax-preview iframe { display: block; width: 100%; height: min(65vh, 660px); border: 0; background: #06152e; }
.ax-preview-photo { display: block; width: 100%; max-height: 75vh; object-fit: contain; }
.ax-preview-video { display: block; width: 100%; max-height: 75vh; background: #06152e; }
.ax-preview [hidden] { display: none; }
body:has(.ax-preview[open]) { overflow: hidden; }
@media (max-width: 767px) {
    .ax-preview { width: calc(100% - 24px); }
    .ax-preview-heading { padding: 10px 12px; gap: 12px; }
    .ax-preview-heading h2 { font-size: 14px; }
}