/* Symbols extracted from the supplied Asiah-mobile-screen.pdf. */
.asiah-selection {
    width: 100%;
    min-height: 100vh;
    min-height: 100svh;
    color: #0000ff;
    font-family: Arial, Helvetica, sans-serif;
}
.asiah-selection__panel {
    position: relative;
    height: 50vh;
    height: 50svh;
    min-height: 280px;
    background: #ffff66;
}
.asiah-selection__panel--cake {
    background: #ffccff;
}
.asiah-selection__link {
    position: absolute;
    inset: 0;
    display: block;
    color: inherit;
    text-decoration: none;
}
.asiah-selection__icon {
    position: absolute;
    top: 18.5%;
    left: 50%;
    transform: translateX(-50%);
    height: 53%;
    width: auto;
    max-width: 80%;
    object-fit: contain;
}
.asiah-selection__panel--cake .asiah-selection__icon {
    top: 17%;
    height: 49%;
}
.asiah-selection__button {
    position: absolute;
    top: 78%;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 55%;
    max-width: 460px;
    height: 14%;
    min-height: 44px;
    border-radius: 999px;
    background: #fff;
    color: #0000ff;
    font-size: clamp(24px, 5.5svh, 48px);
    font-weight: 400;
    line-height: 1;
}
.asiah-selection__link:hover .asiah-selection__button {
    box-shadow: 0 0 0 3px #0000ff;
}
.asiah-selection__link:focus-visible {
    outline: 4px solid #0000ff;
    outline-offset: -8px;
}
@media (max-height: 560px) {
    .asiah-selection__button { font-size: 28px; }
}

/* Keep the full-screen preview unobstructed in the local dev environment. */
.asiah-selection-page .sf-toolbar { display: none !important; }
