body:has(.modal-open){overflow:hidden}.modal{&:not(dialog:not(.modal-open)),&::backdrop{background-color:#0006;transition:display .3s ease-out allow-discrete,opacity .3s ease-out allow-discrete,visibility .3s ease-out allow-discrete;@starting-style{opacity:0;visibility:hidden}}}.modal{&.modal-open,&[open],&:target{@starting-style{opacity:0}}}.modal{&.modal-open,&[open],&:target{@starting-style{visibility:hidden}}}.modal{&.modal-open,&[open],&:target{pointer-events:auto;visibility:visible;opacity:100%}}.modal{pointer-events:none;visibility:hidden;position:fixed;inset:0rem;margin:0rem;display:grid;height:100%;max-height:none;width:100%;max-width:none;align-items:center;justify-items:center;background-color:transparent;padding:0rem;color:inherit;overflow-x:hidden;transition:transform .3s ease-out allow-discrete,visibility .3s ease-out allow-discrete,opacity .1s ease-out allow-discrete;overflow-y:hidden;overscroll-behavior:contain;z-index:999}.modal-box{grid-column-start:1;grid-row-start:1;width:calc(11 / 12 * 100%);max-width:32rem;background-color:var(--color-background);padding:1.5rem;transition:translate .3s ease-out,scale .3s ease-out,opacity .2s ease-out .05s,box-shadow .3s ease-out;border-top-left-radius:var(--modal-tl, var(--radius-box));border-top-right-radius:var(--modal-tr, var(--radius-box));border-bottom-left-radius:var(--modal-bl, var(--radius-box));border-bottom-right-radius:var(--modal-br, var(--radius-box));scale:95%;opacity:0;box-shadow:#00000040 0 25px 50px -12px;overflow-y:auto;overscroll-behavior:contain}.modal{&.modal-open,&[open],&:target{.modal-box{translate:0 0;scale:1;opacity:1}}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.modal-title{font-size:1.5rem;font-weight:700;line-height:2rem;color:var(--color-accent)}.modal-close-button{padding-left:1rem;background:none;border:none;cursor:pointer;color:var(--color-accent)}.modal-close-button svg{stroke:currentColor}