/*
 * EMS Map Preview Frame Proportion Standard
 *
 * The largest current EMS map artwork is 474 x 570.
 * All mission map preview frames use that same 474:570 proportion.
 *
 * object-fit: contain remains responsible for fitting smaller/square maps
 * without cropping or stretching them.
 */

:root {
    --ems-map-frame-width: 474;
    --ems-map-frame-height: 570;
    --ems-map-frame-aspect: 474 / 570;
}

/*
 * Shared rule for Basic, Advanced, and any Tier 3 map preview that uses the
 * standard EMS mission-map-preview-frame class.
 */
.mission-map-preview-frame {
    aspect-ratio: var(--ems-map-frame-aspect) !important;
    height: auto !important;
    max-height: none !important;
}

/*
 * Advanced already uses the full 474px large-map width. Keep that current
 * size while explicitly fixing the frame proportion.
 */
.advanced-mission-page .mission-map-preview-frame {
    width: min(100%, 474px) !important;
}

/*
 * Basic has been running close to a 400px-wide map frame. Preserve that width
 * and let the 474:570 aspect ratio determine the height.
 */
.basic-mission-page .basic-map-preview-cell {
    height: auto !important;
}

.basic-mission-page
    .basic-map-preview-cell
    .mission-map-preview-frame {
    width: min(100%, 400px) !important;
    aspect-ratio: var(--ems-map-frame-aspect) !important;
    height: auto !important;
    max-height: none !important;
}

/*
 * Tier 3 currently has no map-preview-frame markup in the supplied page.
 * This rule makes any standard Tier 3 map frame use the exact same
 * proportions without changing the current Tier 3 layout.
 */
.tier3-mission-page .mission-map-preview-frame {
    width: min(100%, 474px) !important;
    aspect-ratio: var(--ems-map-frame-aspect) !important;
    height: auto !important;
    max-height: none !important;
}