.modal-overlay{align-items:center;background-color:#00000080;display:flex;justify-content:center;inset:0;opacity:0;position:fixed;transition:opacity .3s ease,visibility .3s ease;visibility:hidden;will-change:opacity,visibility;z-index:100}.modal-overlay.active{opacity:1;visibility:visible}.modal{background-color:var(--card-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;max-height:90vh;max-width:70vw;opacity:0;overflow:hidden;position:relative;transform:translateY(20px);transition:transform .3s ease,opacity .3s ease;width:90%;will-change:transform,opacity,height}.modal.alert-modal{max-width:40vw}.modal-overlay.active .modal{opacity:1;transform:translateY(0)}.modal-header{align-items:center;display:flex;flex-shrink:0;justify-content:space-between;padding:10px 20px}.modal-header .modal-title{font-size:var(--h5);font-weight:600}.modal-header .modal-close{background:none;border:none;color:var(--text-color);cursor:pointer;font-size:2rem;line-height:1;margin:0;padding:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.modal-body{flex-grow:1;overflow-y:auto;padding:20px;-webkit-overflow-scrolling:touch}.modal-footer{background-color:var(--card-bg);display:flex;flex-shrink:0;gap:10px;justify-content:flex-end;padding:15px 20px}.modal-handle-container{cursor:grab;display:none;flex-shrink:0;justify-content:center;padding:10px 0;touch-action:none;width:100%;z-index:10}.modal-handle{background-color:var(--text-color);border-radius:3px;height:5px;width:40px}@media(max-width:768px){.modal-overlay{align-items:flex-end}.modal-overlay .modal{border-radius:var(--radius-lg) var(--radius-lg) 0 0;height:auto;max-height:95vh;max-width:none;position:relative;transform:translateY(100%);transition:transform .4s cubic-bezier(.32,.72,0,1),height .4s cubic-bezier(.32,.72,0,1);width:100%}.modal-overlay.alert-mode{align-items:center}.modal.alert-modal{border-radius:var(--radius-lg);height:auto!important;max-height:90vh;max-width:80vw;transform:none!important;width:90%}.modal.alert-modal .modal-handle-container{display:none!important}.modal-overlay.active .modal{transform:translateY(0)}.modal-handle-container{display:flex}.modal-body{flex-grow:1;max-height:calc(100% - 130px);overflow-y:auto}.modal-footer{bottom:0;position:sticky;width:100%;z-index:5}.fullscreen-modal .modal{border-radius:0;height:100vh;max-height:100vh}.share-options{grid-template-columns:repeat(4,1fr)}}@media(max-width:480px){.share-options{grid-template-columns:repeat(3,1fr)}}.modal.dragging{transition:none!important}
