.modal{background-color:var(--white);position:fixed;z-index:1000}.modal__overlay{display:none;width:100%;height:100%;background-color:var(--black);position:fixed;left:0;top:0;z-index:-1;opacity:0}.modal__header{display:flex;align-items:center;justify-content:center;height:50px;border-bottom:1px solid var(--lightgray);padding:var(--space-m) var(--space-m);position:relative}.modal__title{font-size:var(--font-l);font-weight:700;font-style:normal;line-height:1.5;letter-spacing:0;text-align:center}.modal__close{width:50px;height:50px;padding:15px;position:absolute;left:0;top:0;cursor:pointer}.modal__close__icon{width:100%;height:100%;fill:var(--black)}.modal__content{overflow:scroll}.modal.is-visible+.modal__overlay{display:block;z-index:999;opacity:.2}@media screen and (min-width:900px){.modal{display:none;width:500px;max-height:90vh;border-radius:var(--radius-l);left:50%;top:50%;transform:translate(-50%,-50%)}.modal__content{max-height:calc(90vh - 50px);padding:var(--space-m) var(--space-m) var(--space-m) var(--space-m)}.modal.is-visible{display:block}}@media screen and (max-width:900px){.modal{width:100%;height:calc(100% - 30px);border-radius:var(--radius-l) var(--radius-l) 0 0;left:0;bottom:-100vh;transition:bottom var(--duration) ease}.modal__content{height:calc(100% - 50px);padding:var(--page-padding-top) var(--page-padding-right) var(--page-padding-bottom) var(--page-padding-left)}.modal.is-visible{bottom:0}}