html,
body {
    width: 100%;
    height: 100%;
    min-width: 320px;
    min-height: 100%;
    margin: 0;
    overflow: hidden;
    background: #eee;
}

body::before {
    display: none;
}

.page-shell,
.hero,
.hero-copy {
    display: contents;
}

.brand,
.hero-copy > :not(#downloadBtn),
.visual,
.footer {
    display: none !important;
}

.poster-background {
    position: fixed;
    inset: 0;
    z-index: 0;
    display: flex;
    justify-content: center;
    overflow: hidden;
    background: #eee;
}

.poster-background img {
    width: min(100vw, 500px);
    height: 100%;
    object-fit: fill;
}

.download-button,
.download-button:hover {
    position: fixed;
    z-index: 2;
    right: 50%;
    bottom: max(22px, calc(env(safe-area-inset-bottom) + 12px));
    display: flex;
    width: min(30vw, 300px);
    min-height: 0;
    aspect-ratio: 475 / 132;
    justify-content: center;
    margin: 0;
    padding: 0 16px;
    transform: translateX(50%);
    border: 3px solid #16131d;
    border-radius: 30px;
    background: linear-gradient(180deg, #ef35ff 0%, #b94bff 45%, #57d8f5 100%);
    box-shadow: 0 2px 0 rgba(255, 255, 255, .8) inset, 0 3px 0 rgba(255, 255, 255, .45);
    color: #563a72;
    font-size: clamp(19px, 5vw, 26px);
    font-weight: 900;
    letter-spacing: .08em;
    text-shadow: 0 2px 0 rgba(255, 255, 255, .45);
}

.download-arrow {
    display: none;
}

@media (min-width: 601px) {
    .download-button,
    .download-button:hover {
        bottom: 22px;
        width: 190px;
    }
}

@media (max-width: 600px) {
    .download-button,
    .download-button:hover {
        width: min(160px, 60vw);
    }
}