.modal-overlay{background:var(--modal-backdrop-bg);z-index:var(--z-modal-backdrop);position:fixed;inset:0}.modal-content{width:var(--modal-width);max-width:var(--modal-max-width);max-height:var(--modal-max-height);padding:var(--modal-padding);background:var(--modal-bg);color:var(--modal-fg);border-radius:var(--modal-border-radius);box-shadow:var(--modal-shadow), inset 0 0 0 1px color-mix(in srgb, var(--surface-glass-reflex-light-color) calc(var(--surface-glass-reflex-light) * 10%), transparent), inset 1.8px 3px var(--surface-glass-reflex-blur) -2px color-mix(in srgb, var(--surface-glass-reflex-light-color) calc(var(--surface-glass-reflex-light) * 80%), transparent), inset -2px -2px var(--surface-glass-reflex-blur) -2px color-mix(in srgb, var(--surface-glass-reflex-light-color) calc(var(--surface-glass-reflex-light) * 70%), transparent), inset -3px -8px 1px -6px color-mix(in srgb, var(--surface-glass-reflex-light-color) calc(var(--surface-glass-reflex-light) * 50%), transparent), inset -.3px -1px 4px 0 color-mix(in srgb, var(--surface-glass-reflex-dark-color) calc(var(--surface-glass-reflex-dark) * 12%), transparent), inset -1.5px 2.5px var(--surface-glass-reflex-blur) -2px color-mix(in srgb, var(--surface-glass-reflex-dark-color) calc(var(--surface-glass-reflex-dark) * 20%), transparent), inset 0 3px 4px -2px color-mix(in srgb, var(--surface-glass-reflex-dark-color) calc(var(--surface-glass-reflex-dark) * 20%), transparent), 0 1px 5px 0 color-mix(in srgb, var(--surface-glass-reflex-dark-color) calc(var(--surface-glass-reflex-dark) * 10%), transparent), 0 6px 16px 0 color-mix(in srgb, var(--surface-glass-reflex-dark-color) calc(var(--surface-glass-reflex-dark) * 8%), transparent);z-index:var(--z-modal);border:none;outline:none;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.modal-content{-webkit-backdrop-filter:blur(var(--modal-blur)) saturate(var(--surface-glass-saturation))}}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.modal-content{background:var(--modal-bg-solid)}}.modal-title{margin:0 0 var(--modal-title-margin);font-size:var(--heading-size-xl);font-weight:var(--heading-weight);color:var(--modal-fg)}.modal-description{margin:0 0 var(--modal-description-margin);font-size:var(--modal-description-font-size);color:var(--modal-description-color)}.modal-body{margin-bottom:var(--modal-body-margin)}.modal-footer{gap:var(--modal-footer-gap);padding-top:var(--modal-footer-padding);box-shadow:var(--modal-footer-shadow);justify-content:flex-end;display:flex}.modal-close{top:var(--modal-close-offset);right:var(--modal-close-offset);padding:var(--modal-close-padding);border-radius:var(--rounded);cursor:pointer;color:var(--modal-close-color);transition:background-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out);background:0 0;border:none;position:absolute}.modal-close:hover{background:var(--modal-close-bg-hover);color:var(--modal-close-color-hover)}
