*,:after,:before{box-sizing:border-box;margin:0}:root{font-family:system-ui,sans-serif;font-size:10px;font-weight:400;line-height:1.5;overflow-y:scroll}body{color:#222;background-color:#fff;font-size:1.6rem}input,button{font-family:inherit;font-size:inherit}img{max-width:100%;height:auto}h1,button{line-height:1}:focus-visible{outline-offset:.3rem;outline:.2rem solid orange}.icon{fill:#fff;stroke:#0000;width:1em;height:1em}.page-container{grid-template-rows:auto 1fr auto;min-height:100dvh;display:grid}.main-content{place-items:center;padding:3rem 1rem 5rem;display:grid}.main-content>div{border:1px dotted #000;padding:3rem}.page-header{padding:2rem 3rem}.page-header h1{justify-content:center;align-items:center;gap:1.5rem;font-size:clamp(2rem,1.6348rem + 2.087vw,3.2rem);font-weight:400;display:flex}.page-header,.page-footer{color:#fff;background-color:#000}.page-footer{text-align:center;padding:2rem}.page-footer a{color:#fff;text-decoration:none}.page-footer a:hover{text-decoration:underline}.page-footer a:after{content:" ⟶"}.meme-form{flex-direction:column;gap:3rem;display:flex}.meme-form .inputs{text-align:center;flex-wrap:wrap;gap:3rem;display:flex}.meme-form .inputs>div{flex-direction:column;flex-grow:1;gap:.5rem;display:flex}.meme-form .inputs>div label{text-align:center;font-weight:500}.meme-form .inputs>div input{border:1px solid #d1d5db;padding:.7rem 1rem}.meme-form .new-meme-button{color:#fff;cursor:pointer;background:#405cf5;border:0;border-radius:1rem;width:100%;margin-block-end:3rem;padding:.5em;font-size:clamp(1.6rem,1.3261rem + 1.5652vw,2.5rem);line-height:1.8}.meme-form .new-meme-button:hover{opacity:.8}.meme-form .new-meme-button>span{justify-content:center;align-items:center;gap:1.5rem;display:flex}.meme-display{position:relative}.meme-display .meme-text{z-index:10;color:#fff;letter-spacing:2px;text-transform:uppercase;text-align:center;text-shadow:2px 2px #000,-2px -2px #000,2px -2px #000,-2px 2px #000,0 2px #000,2px 0 #000,0 -2px #000,-2px 0 #000,2px 2px 5px #000;width:100%;font-family:Impact,sans-serif;font-size:clamp(2rem,1.6348rem + 2.087vw,3.2rem);font-weight:700;line-height:.9;position:absolute}.meme-display .meme-text-top{top:1rem}.meme-display .meme-text-bottom{bottom:1rem}.meme-display .meme-image img{object-fit:cover;border:.2rem solid #000}