@import url("https://fonts.googleapis.com/css2?family=Permanent+Marker&display=swap");body{margin:0}main{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:15px;background:linear-gradient(#08111b,#ef4209);color:#fefefe;font-size:22px;padding:20px;min-height:100vh}h1{text-shadow:1px 1px 2px #000;font-family:Permanent Marker,cursive;font-size:1.6rem;margin:0 0 .5rem}h2{font-size:1.2rem}h2,h3{text-shadow:1px 1px 2px #000;font-family:Permanent Marker,cursive;margin:0}h3{font-size:1rem}button,input{padding:8px 12px;border:1px solid #fefefe}button{color:#fefefe;cursor:pointer;background:#456789;border-radius:4px;font-weight:bolder;text-transform:uppercase}button:hover{background:#0f233a;transition:background .2s ease-in-out}button:disabled{background:#4e5d6d;color:#fefefe;cursor:not-allowed}textarea{min-width:300px;min-height:380px;padding:8px 12px;border:1px solid #fefefe;resize:none}.word-switcher-inputs{display:flex;flex-direction:column;justify-content:center;flex-wrap:wrap;gap:15px}.textarea-container,.word-switcher-input{gap:5px}.button-container,.textarea-container,.word-switcher-input{display:flex;flex-direction:column;justify-content:space-between}.button-container{gap:12px}.button-container button{min-width:300px}.preview{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:15px;font-family:Courier New,monospace!important}.preview,.preview div{width:100%}.preview div h2,.preview div h3{margin:0;text-align:center}.preview{font-family:Tahoma,sans-serif}@media screen and (min-width:992px){main{gap:10px;padding:.5rem 1.2rem 1rem;min-width:935px}h1,h2{font-size:3rem}.word-switcher-inputs{max-width:944px}.button-container,.textarea-container,.word-switcher-inputs{flex-direction:row;gap:10px}}