html,body{padding:0;margin:0;width:100%;height:100%}a{color:inherit;text-decoration:none}*{box-sizing:border-box}canvas{display:block;height:100vh;width:100vw}input{position:absolute;top:0;z-index:-1;opacity:0}.lil-gui.root>.children{overflow:hidden!important}p{text-align:center;padding:.2em}button{font-weight:600;border:solid 2px black;outline:0;padding:1rem 4rem;font-size:1.5rem;letter-spacing:.08rem;background-color:#fff;border-radius:.35rem;position:relative;cursor:pointer;margin-top:4em;margin-bottom:.5em;width:100%}button:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:pink;z-index:-1;border-radius:.35rem;border:solid 2px black;transition:all .3s ease-in-out}button#hide-modal:after{border:0;box-shadow:0 0 0 2px #000;top:.5rem;left:.5rem}button#hide-modal:hover:after{top:-.5rem;left:-.5rem;width:calc(100% + 1rem);height:calc(100% + 1rem)}.header-text{font-size:2em;margin-bottom:2em}#modal{display:block;opacity:0;pointer-events:none;border:2px solid black;top:50px;border-radius:10px}#modal[open]{opacity:1;pointer-events:auto;animation:slidein .5s forwards}#modal::backdrop{background-color:#0009;animation:fadein .5s forwards}#modal.close[open]{animation:slideout .5s forwards}#modal.close::backdrop{animation:fadeout .5s forwards}@keyframes fadein{0%{opacity:0}to{opacity:1}}@keyframes fadeout{0%{opacity:1}to{opacity:0}}@keyframes slidein{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideout{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:0}}@media screen and (max-width: 675px){.header-text{font-size:1.6em}}
