/* Vault Pop Frontend */
.vault-pop {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 999999;
    display: none;
    align-items: center;
    justify-content: center;
}
.vault-pop.vault-pop-open { display: flex; }

.vault-pop[data-position="top"] { align-items: flex-start; padding-top: 5vh; }
.vault-pop[data-position="bottom"] { align-items: flex-end; padding-bottom: 5vh; }

.vault-pop-overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: var(--vp-overlay, rgba(0,0,0,0.7));
}

.vault-pop-box {
    position: relative;
    max-width: var(--vp-max-width, 600px);
    width: 90%;
    max-height: 90vh;
    overflow: auto;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 25px 50px rgba(0,0,0,0.25);
}

.vault-pop-x {
    position: absolute;
    top: 10px; right: 10px;
    width: 32px; height: 32px;
    border: none;
    background: rgba(0,0,0,0.05);
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    z-index: 10;
}
.vault-pop-x:hover { background: rgba(0,0,0,0.1); }

/* Animations */
.vault-pop[data-animation="fade"] .vault-pop-box { opacity: 0; transition: opacity 0.3s; }
.vault-pop[data-animation="fade"].vault-pop-open .vault-pop-box { opacity: 1; }

.vault-pop[data-animation="scale"] .vault-pop-box { opacity: 0; transform: scale(0.9); transition: opacity 0.3s, transform 0.3s; }
.vault-pop[data-animation="scale"].vault-pop-open .vault-pop-box { opacity: 1; transform: scale(1); }

.vault-pop[data-animation="slide"] .vault-pop-box { opacity: 0; transform: translateY(30px); transition: opacity 0.3s, transform 0.3s; }
.vault-pop[data-animation="slide"].vault-pop-open .vault-pop-box { opacity: 1; transform: translateY(0); }

/* Close animation */
.vault-pop.vault-pop-closing .vault-pop-box { opacity: 0 !important; transform: scale(0.95) !important; }
.vault-pop.vault-pop-closing .vault-pop-overlay { opacity: 0; transition: opacity 0.2s; }