@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideIn{from{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);z-index:1000;animation:fadeIn .3s ease-out}.modal.is-open{display:flex;align-items:center;justify-content:center}.modal__content{background:#fff;padding:2rem;border-radius:8px;max-width:500px;width:90%;position:relative;max-height:90vh;overflow-y:auto;animation:slideIn .3s ease-out}@media(min-width: 576px){.modal__content{padding:3rem}}.modal__close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.5rem;cursor:pointer;color:#666;padding:.5rem;line-height:1;transition:color .2s ease}.modal__close:hover{color:hsl(0,0%,32%)}.modal__content::-webkit-scrollbar{width:8px}.modal__content::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.modal__content::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.modal__content::-webkit-scrollbar-thumb:hover{background:#555}.on_screen_popup__content{max-width:800px;padding:0}.on_screen_popup__content img{height:auto;display:block}/*# sourceMappingURL=modal.css.map */