#ofpo-modal-overlay {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.5);
    display: flex; align-items: center; justify-content: center;
    z-index: 9999; visibility: hidden; opacity: 0;
    transition: 0.3s;
}

#ofpo-modal-overlay.active { visibility: visible; opacity: 1; }

.ofpo-modal-card {
    background: #fff;
    width: 100%; max-width: 450px;
    padding: 40px; border-radius: 4px;
    position: relative; box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

.ofpo-title { font-family: 'Oswald', sans-serif; font-size: 32px; margin-bottom: 20px; }

.ofpo-field { margin-bottom: 20px; }
.ofpo-field label { display: block; font-weight: bold; margin-bottom: 8px; font-size: 14px; }
.ofpo-field input { width: 100%; padding: 12px; border: 1px solid #ccc; background: #f5f5f5; border-radius: 4px; }

.ofpo-btn-main {
    width: 100%; padding: 15px; background: #fff; border: 2px solid #333;
    font-weight: bold; cursor: pointer; transition: 0.2s; letter-spacing: 1px;
}

.ofpo-btn-main:hover { background: #333; color: #fff; }

.ofpo-close { position: absolute; top: 15px; right: 15px; cursor: pointer; border: none; background: none; font-size: 20px; }