.↗ {
    padding-top: var(--eo0);
    align-items: flex-start;
    justify-content: center;
}

.↗>div {
    background: rgb(var(--crB));
    width: 90%;
    max-height: 95%;
    max-width: 760px;
    box-shadow: var(--saM);
    transition: var(--AnVm);
    top: -100vh;
}

.vMmostrar>div {
    transition: var(--AnM0);
    top: 0vh;
}

.↗ .header {
    box-shadow: var(--saN);
    background: rgb(var(--crB));
    padding: var(--eo0) var(--gap);
    flex-flow: column;
    z-index: var(--ziN);
}

.↗ .header>button {
    color: rgb(var(--crS0));
}

.↗ .main {
    /* margin-top: var(--eo1); */
    padding: 0 var(--gap) var(--gap) var(--gap);
}

.↗ .footer {
    display: flex;
    justify-content: space-around;
    gap: var(--gap);
    padding: var(--eo1) var(--gap);
    border-top: solid var(--beI) rgb(var(--crG3));
    /* margin-top: 10px; */
    flex-wrap: wrap;
}

.↗ .footer [class*="bt"] {
    min-width: var(--eo8);
    width: auto;
}

.❓ .header {
    height: var(--eo5);
}

.❓ .main {
    margin-top: var(--eo2);
    display: grid;
    grid-template-columns: 1fr 3fr;
    gap: var(--gap);
}
.❓ .main h4{
    grid-column: 1/-1;
}
.❓ .main div{
    font-size: var(--fs5);
}

.❓ > div {
    width: 500px;
    max-height: 90%;
    max-width: 90%;
    box-shadow: var(--saM);
    transition: var(--AnVm);
}