.starlite-movie-back {
    --starlite-ink: #11100f;
    --starlite-charcoal: #1c1918;
    --starlite-cream: #d8c39b;
    --starlite-paper: #cdb58a;
    --starlite-red: #b80f3b;
    --starlite-pink: #ef155b;
    --starlite-yellow: #d9a92d;
    --starlite-rule: #8f7c59;
    box-sizing: border-box;
    width: min(100%, 1080px);
    margin: 0 auto;
    color: var(--starlite-cream);
    background: #090909;
    border: 9px solid #171412;
    box-shadow: 0 0 0 2px #a78f64, 0 12px 28px rgba(0, 0, 0, .45), inset 0 0 0 2px #050505;
    font-family: "Arial Narrow", "Roboto Condensed", "Helvetica Neue", Arial, sans-serif;
    line-height: 1.3;
    overflow: hidden;
}

.starlite-movie-back *,
.starlite-movie-back *::before,
.starlite-movie-back *::after { box-sizing: border-box; }

.starlite-movie-back__print-frame {
    position: relative;
    padding: clamp(16px, 3vw, 34px);
    background:
        linear-gradient(93deg, transparent 0 47%, rgba(216, 195, 155, .035) 47.2% 47.6%, transparent 48%),
        repeating-linear-gradient(8deg, rgba(255,255,255,.015) 0 1px, transparent 1px 9px),
        radial-gradient(circle at 18% 16%, #292523 0, #11100f 43%, #080808 100%);
    isolation: isolate;
}

.starlite-movie-back__print-frame::after {
    content: "";
    position: absolute;
    inset: 7px;
    border: 1px solid rgba(216, 195, 155, .46);
    box-shadow: inset 0 0 26px rgba(0,0,0,.72);
    pointer-events: none;
    z-index: -1;
}

.starlite-movie-back__masthead {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(110px, .45fr) auto;
    align-items: center;
    gap: 24px;
    min-height: 120px;
    margin: 0 0 18px;
    padding: 4px 18px 12px;
    border-bottom: 7px solid var(--starlite-red);
    box-shadow: 0 4px 0 var(--starlite-pink);
}

.starlite-movie-back__brand { min-width: 0; }
.starlite-movie-back__brand-logo {
    display: block;
    width: min(100%, 460px);
    height: auto;
}
.starlite-movie-back__departments,
.starlite-movie-back__rewind,
.starlite-movie-back__tech-copy,
.starlite-movie-back__footer-rewind { margin: 0; }
.starlite-movie-back__departments { font-weight: 800; letter-spacing: .08em; line-height: 1.55; }
.starlite-movie-back__rewind {
    padding: 13px 18px;
    color: #17130f;
    background: var(--starlite-paper);
    box-shadow: 5px 6px 0 rgba(0,0,0,.5);
    font: italic 800 22px/1.35 "Trebuchet MS", sans-serif;
    text-align: center;
    transform: rotate(-4deg);
    clip-path: polygon(3% 3%, 97% 0, 100% 94%, 7% 100%, 0 14%);
}

.starlite-movie-back__images {
    display: grid;
    grid-template-columns: minmax(0, 1.85fr) minmax(220px, 1fr);
    grid-template-rows: repeat(2, minmax(150px, 1fr));
    gap: 12px;
    margin: 26px 10px 22px;
}
.starlite-movie-back__image {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    background: #171717;
    border: 4px solid var(--starlite-cream);
    outline: 2px solid #070707;
    box-shadow: 6px 7px 0 rgba(0,0,0,.6);
}
.starlite-movie-back__image--main { grid-column: 1; grid-row: 1 / 3; }
.starlite-movie-back__image--still-2 { grid-column: 2; grid-row: 1; }
.starlite-movie-back__image--still-3 { grid-column: 2; grid-row: 2; }
.starlite-movie-back__image-element {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    object-position: center;
    filter: saturate(.84) contrast(1.08);
}
.starlite-movie-back__images--count-1 { grid-template: minmax(260px, 52vw) / 1fr; }
.starlite-movie-back__images--count-3 { aspect-ratio: 16 / 8.6; }
.starlite-movie-back__images--count-1 .starlite-movie-back__image { grid-area: 1 / 1; }
.starlite-movie-back__images--count-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(230px, 36vw); }
.starlite-movie-back__images--count-2 .starlite-movie-back__image { grid-row: 1; }
.starlite-movie-back__images--count-2 .starlite-movie-back__image:first-child { grid-column: 1; }
.starlite-movie-back__images--count-2 .starlite-movie-back__image:last-child { grid-column: 2; }

.starlite-movie-back__title-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 250px;
    align-items: center;
    gap: 18px;
    margin: 0 8px 18px;
}
.starlite-movie-back__title-row--without-rating { grid-template-columns: minmax(0, 1fr); }
.starlite-movie-back__header {
    padding: 13px 24px 16px;
    color: #0b0a09;
    background: var(--starlite-cream);
    border-bottom: 9px solid var(--starlite-red);
    box-shadow: 5px 7px 0 #030303;
    clip-path: polygon(0 4%, 98% 0, 100% 87%, 3% 100%);
}
.starlite-movie-back__title {
    margin: 0 !important;
    color: #090909 !important;
    font: 900 clamp(40px, 7vw, 80px)/.88 Impact, Haettenschweiler, "Arial Black", sans-serif !important;
    letter-spacing: -.02em;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}
.starlite-movie-back__rating-sticker {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 5px;
    margin-left: -36px;
    padding: 18px 15px 14px;
    color: #17120a;
    background: var(--starlite-yellow);
    box-shadow: 5px 7px 0 rgba(0,0,0,.6);
    text-align: center;
    transform: rotate(4deg);
    clip-path: polygon(7% 0, 100% 7%, 95% 94%, 4% 100%, 0 16%);
}
.starlite-movie-back__rating-sticker strong { font: 900 18px/1 Impact, sans-serif; letter-spacing: .04em; }
.starlite-movie-back__rating-stars { font: 700 clamp(25px, 3.4vw, 38px)/1 Georgia, serif; letter-spacing: -.1em; white-space: nowrap; }
.starlite-movie-back__rating { font-weight: 900; }

.starlite-movie-back__paper-row {
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) minmax(220px, .8fr);
    align-items: start;
    gap: 28px;
    margin: 20px 16px 30px;
}
.starlite-movie-back__paper-row > :only-child { grid-column: 1 / -1; }
.starlite-movie-back__paper-row > .starlite-movie-back__note:only-child { width: min(100%, 560px); margin-left: auto; }
.starlite-movie-back__synopsis-section,
.starlite-movie-back__note {
    color: #17130f;
    background: var(--starlite-paper);
    box-shadow: 5px 7px 0 rgba(0,0,0,.55);
}
.starlite-movie-back__synopsis-section {
    min-height: 190px;
    padding: 24px 28px;
    clip-path: polygon(1% 2%, 99% 0, 100% 95%, 97% 100%, 0 97%);
}
.starlite-movie-back__note {
    margin-top: 34px;
    padding: 24px 24px 28px;
    font-family: "Comic Sans MS", "Bradley Hand", cursive;
    transform: rotate(-2.2deg);
    clip-path: polygon(5% 0, 96% 3%, 100% 90%, 92% 100%, 2% 95%, 0 10%);
}
.starlite-movie-back__heading {
    margin: 0 0 8px !important;
    color: inherit !important;
    font: 900 20px/1.05 "Arial Narrow", Impact, sans-serif !important;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.starlite-movie-back__synopsis,
.starlite-movie-back__note { font-size: clamp(15px, 1.8vw, 19px); }
.starlite-movie-back__synopsis p,
.starlite-movie-back__note p { margin: 0 0 .75em; }
.starlite-movie-back__synopsis p:last-child,
.starlite-movie-back__note p:last-child { margin-bottom: 0; }

.starlite-movie-back__lower {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(270px, .85fr);
    gap: 34px;
    align-items: end;
    margin: 0 18px 30px;
}
.starlite-movie-back__lower > .starlite-movie-back__information:only-child { grid-column: 1 / -1; }
.starlite-movie-back__information { min-width: 0; }
.starlite-movie-back__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 0;
    margin: 0 0 18px;
}
.starlite-movie-back__fact { display: grid; grid-template-rows: auto auto; padding: 0 20px; border-right: 2px solid var(--starlite-cream); }
.starlite-movie-back__fact:first-child { padding-left: 0; }
.starlite-movie-back__fact:last-child { border-right: 0; }
.starlite-movie-back__fact dt,
.starlite-movie-back__fact dd { margin: 0; }
.starlite-movie-back__fact dt { color: var(--starlite-paper); font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.starlite-movie-back__fact dd { font-size: 17px; }
.starlite-movie-back__section { margin: 0; }
.starlite-movie-back__information > .starlite-movie-back__section { padding: 12px 0; border-bottom: 1px solid var(--starlite-rule); }
.starlite-movie-back__list { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; padding: 0; list-style: none; }
.starlite-movie-back__item { margin: 0; }
.starlite-movie-back__item:not(:last-child)::after { content: " •"; color: var(--starlite-red); }

.starlite-movie-back__collection {
    position: relative;
    padding: 18px 20px 22px;
    border: 5px solid var(--starlite-red);
    outline: 2px solid var(--starlite-cream);
    background: #151313;
    box-shadow: 7px 8px 0 #050505;
    transform: rotate(-1.3deg);
}
.starlite-movie-back__collection > .starlite-movie-back__heading {
    margin: -10px -12px 15px !important;
    padding: 9px 12px;
    color: var(--starlite-cream) !important;
    background: var(--starlite-red);
    font-size: clamp(22px, 3vw, 34px) !important;
}
.starlite-movie-back__collection-states { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.starlite-movie-back__collection-state { margin: 0; font-size: 17px; }
.starlite-movie-back__collection-toggle { position: relative; display: flex; align-items: center; gap: 12px; cursor: pointer; }
.starlite-movie-back__collection-control { position: absolute; width: 1px; height: 1px; margin: -1px; opacity: 0; }
.starlite-movie-back__checkbox {
    display: inline-grid;
    place-items: center;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    border: 3px solid var(--starlite-cream);
    color: var(--starlite-yellow);
    font: 900 27px/1 sans-serif;
}
.starlite-movie-back__collection-control:checked + .starlite-movie-back__checkbox::after { content: "×"; }
.starlite-movie-back__collection-control:focus-visible + .starlite-movie-back__checkbox { outline: 3px solid var(--starlite-yellow); outline-offset: 4px; }
.starlite-movie-back__collection-control:disabled + .starlite-movie-back__checkbox { opacity: .55; }
.starlite-movie-back__collection-state.is-selected { color: #fff1cd; font-weight: 800; }
.starlite-movie-back__collection-feedback {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.starlite-movie-back__technical {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) auto minmax(130px, .65fr) minmax(150px, .75fr);
    align-items: center;
    gap: 18px;
    padding: 24px 24px 12px;
    border-top: 7px solid var(--starlite-red);
    box-shadow: inset 0 4px 0 var(--starlite-pink);
}
.starlite-movie-back__store-mark { display: grid; gap: 3px; }
.starlite-movie-back__store-logo { display: block; width: min(100%, 220px); height: auto; }
.starlite-movie-back__store-mark span { color: var(--starlite-yellow); font-size: 12px; letter-spacing: .1em; }
.starlite-movie-back__vhs-mark { padding: 5px 9px; border: 3px solid var(--starlite-cream); font: 900 37px/1 Impact, sans-serif; }
.starlite-movie-back__tech-copy { font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.starlite-movie-back__stock { display: grid; gap: 5px; padding: 10px; color: #17130f; background: var(--starlite-paper); text-align: center; transform: rotate(1deg); }
.starlite-movie-back__barcode { display: block; height: 54px; background: repeating-linear-gradient(90deg, #111 0 2px, transparent 2px 5px, #111 5px 6px, transparent 6px 9px, #111 9px 13px, transparent 13px 16px); }
.starlite-movie-back__stock small { font-weight: 900; letter-spacing: .1em; }
.starlite-movie-back__footer-rewind { display: none; }

.starlite-movie-back__status { margin: 0; padding: 16px; color: #222; background: #e3d2ac; font-family: sans-serif; }

@media (max-width: 760px) {
    .starlite-movie-back { border-width: 5px; }
    .starlite-movie-back__print-frame { padding: 15px; }
    .starlite-movie-back__masthead { grid-template-columns: 1fr auto; gap: 10px; min-height: 86px; padding: 0 5px 8px; border-bottom-width: 5px; }
    .starlite-movie-back__brand-logo { width: min(100%, 320px); }
    .starlite-movie-back__departments { display: none; }
    .starlite-movie-back__rewind { padding: 8px 10px; font-size: 14px; }

    .starlite-movie-back__images,
    .starlite-movie-back__images--count-2 {
        aspect-ratio: auto;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: auto auto;
        gap: 8px;
        margin: 20px 0 16px;
    }
    .starlite-movie-back__image--main { grid-column: 1 / -1 !important; grid-row: 1 !important; aspect-ratio: 16 / 10; }
    .starlite-movie-back__image--still-2 { grid-column: 1 !important; grid-row: 2 !important; aspect-ratio: 4 / 3; }
    .starlite-movie-back__image--still-3 { grid-column: 2 !important; grid-row: 2 !important; aspect-ratio: 4 / 3; }
    .starlite-movie-back__images--count-1 { display: block; }
    .starlite-movie-back__images--count-1 .starlite-movie-back__image { aspect-ratio: 16 / 10; }
    .starlite-movie-back__images--count-2:not(.starlite-movie-back__images--has-main) .starlite-movie-back__image:first-child { grid-column: 1 !important; grid-row: 1 !important; }
    .starlite-movie-back__images--count-2:not(.starlite-movie-back__images--has-main) .starlite-movie-back__image:last-child { grid-column: 2 !important; grid-row: 1 !important; }

    .starlite-movie-back__title-row,
    .starlite-movie-back__paper-row,
    .starlite-movie-back__lower { grid-template-columns: minmax(0, 1fr); }
    .starlite-movie-back__title-row { gap: 12px; margin: 0 0 18px; }
    .starlite-movie-back__header { padding: 12px 16px 15px; }
    .starlite-movie-back__title { font-size: clamp(37px, 13vw, 60px) !important; }
    .starlite-movie-back__rating-sticker { width: min(230px, 76%); margin: -7px 6px 0 auto; transform: rotate(2deg); }
    .starlite-movie-back__paper-row { gap: 16px; margin: 0 4px 25px; }
    .starlite-movie-back__synopsis-section { min-height: 0; padding: 20px; }
    .starlite-movie-back__note { width: 88%; margin: 0 0 0 auto; padding: 20px; }
    .starlite-movie-back__lower { gap: 24px; margin: 0 5px 28px; }
    .starlite-movie-back__fact { padding: 0 10px; }
    .starlite-movie-back__collection { width: 94%; margin: 0 auto; }

    .starlite-movie-back__technical { grid-template-columns: 1fr auto; gap: 15px 10px; padding: 20px 8px 8px; }
    .starlite-movie-back__store-mark { grid-column: 1 / -1; }
    .starlite-movie-back__vhs-mark { justify-self: start; }
    .starlite-movie-back__stock { grid-column: 1 / -1; width: min(230px, 80%); justify-self: end; }
    .starlite-movie-back__footer-rewind { display: block; grid-column: 1 / -1; color: var(--starlite-yellow); font-weight: 900; letter-spacing: .13em; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
    .starlite-movie-back__rewind,
    .starlite-movie-back__rating-sticker,
    .starlite-movie-back__note,
    .starlite-movie-back__collection,
    .starlite-movie-back__stock { transform: none; }
}
