/*########################################################################
    MANIFEST
########################################################################*/

#manifest-section .button-wrapper {
    background: rgba(255, 255, 255, 0.1);
    gap: 2em;
    padding: 1em;
    margin: 1em 0;
    border-radius: var(--border-radius-md);
}

#manifest-section .i-feel-lucky-btn.roll { animation: spinClockwise 0.9s var(--timing-function-snappy) both; }
#manifest-section #quote-wrapper { 
    overflow: hidden;
    padding: 2em 0;
    min-height: 12em;
}

#manifest-section blockquote { 
    gap: 0.5em;
    grid-row: 1;
    grid-column: 1;
}
#manifest-section blockquote.move-out {animation: fadeOutTop 0.5s var(--timing-function-snappy) forwards;}
#manifest-section blockquote.move-in {animation: fadeInScale 0.5s var(--timing-function-snappy) forwards;}

#manifest-section .meaning-lapse-nr-wrapper { color: var(--color-5); }
#manifest-section .meaning-lapse-text {
    font-size: var(--font-size-body-2xl);
    line-height: var(--line-height-sm);
}

@media (min-width: 48rem) { /* md: 48em */
    #manifest-section #quote-wrapper { min-height: 18em; }
    #manifest-section .meaning-lapse-text { font-size: var(--font-size-body-3xl); }
}