.modal .modal__trigger{background-color:var(--trigger-btn-bg,#3b82f6);border:none;border-radius:6px;color:var(--trigger-btn-color,#fff);cursor:pointer;font-size:var(--btn-font-size,16px);font-weight:600;padding:12px 24px;transition:all .3s ease}.modal .modal__trigger:hover{opacity:.9;transform:translateY(-2px)}.modal .modal__overlay,.modal .modal__preview{align-items:center;background-color:var(--overlay-color,rgba(0,0,0,.5));display:flex;height:100%;justify-content:center;left:0;opacity:0;padding:1rem;position:fixed;top:0;transition:opacity .3s ease;width:100%;z-index:9999}.modal .modal__preview{opacity:1;pointer-events:auto;position:relative}.modal .modal__preview-overlay{align-items:center;background-color:var(--overlay-color,rgba(0,0,0,.5));display:flex;height:100%;justify-content:center;position:relative;width:100%}.modal .modal__overlay--active{opacity:1}.modal .modal__content{background-color:var(--modal-bg,#fff);border-radius:12px;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);max-height:90vh;max-width:var(--modal-width,600px);overflow-y:auto;transform:scale(.95);transition:transform .3s ease;width:100%}.modal__overlay--active .modal .modal__content{transform:scale(1)}@media(max-width:767px){.modal .modal__content{max-width:95%}}.modal .modal__header{align-items:center;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;padding:1.5rem}.modal .modal__title{color:var(--modal-title-color,#1f2937);flex:1;font-size:var(--title-font-size,24px);font-weight:700;margin:0}.modal .modal__close{align-items:center;background:none;border:none;border-radius:4px;color:#6b7280;cursor:pointer;display:flex;font-size:28px;height:32px;justify-content:center;line-height:1;padding:0;transition:all .2s ease;width:32px}.modal .modal__close:hover{background-color:#f3f4f6;color:#1f2937}.modal .modal__body{padding:1.5rem}