/* Exact APEX media only: preserve the existing card and modal frame dimensions. */
.apex-media-frame { position: relative; }
.apex-media-host { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; padding: 0; border: 0; border-radius: inherit; background: transparent; z-index: 1; }
.apex-media-host canvas { display: block; width: 100%; height: 100%; max-width: none; padding: 0; border: 0; background: transparent; }
.apex-media-frame:not(.apex-media-ready) > .apex-media-host { visibility: hidden; }
.apex-media-ready > img { opacity: 0; }
#app .product-card .product-art.apex-media-ready, .product-sheet-image.apex-media-ready { background: transparent; }
.apex-media-ready > .premium-electric-pulse { display: none; }
.apex-media-inline .apex-media-host { pointer-events: none; }
.apex-media-inline canvas { touch-action: pan-y; }
.apex-media-open { position: absolute; z-index: 5; right: 8px; top: 8px; min-height: 30px; padding: 5px 9px; border: 1px solid #abc1b7; border-radius: 999px; background: #fffffff0; color: var(--forest-2,#215b48); font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; }
.apex-media-open-mobile { display: none; }
@media (max-width: 600px) { .apex-media-open-desktop { display: none; } .apex-media-open-mobile { display: inline; } .apex-media-open { padding: 5px 8px; } }
.apex-media-modal .apex-media-host { z-index: 1; }
.apex-media-modal canvas { touch-action: none; cursor: grab; }
.apex-media-modal canvas.is-dragging { cursor: grabbing; }
.apex-media-modal.apex-media-ready { border-color: transparent; }
.apex-media-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -6px 0 14px; }
.apex-media-toolbar button { min-height: 36px; padding: 7px 10px; border: 1px solid var(--line,#cad9ce); border-radius: 10px; background: var(--paper,#fff); color: var(--forest-2,#215b48); font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.apex-media-toolbar button:disabled { opacity: .5; cursor: default; }
.apex-media-toolbar button[aria-pressed="true"] { background: #e9f1eb; }
.apex-media-hint { flex: 1 1 145px; color: var(--muted,#586a60); font-size: 11px; line-height: 1.4; }
.apex-media-open:focus-visible, .apex-media-toolbar button:focus-visible, .apex-media-host canvas:focus-visible { outline: 3px solid var(--forest-2,#215b48); outline-offset: -3px; }
.apex-media-frame > .photo-facts { z-index: 4; }
