*,::before,::after{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{font-family:sans-serif;text-align:center;background-color:#f2f2f2;color:#333;padding:24px;padding-top:48px}#container{display:grid;place-content:center;gap:16px}h1{width:0;height:0;overflow:hidden}textarea{display:block;font-family:inherit;font-size:2rem;background-color:#fff;color:inherit;border-radius:20px;border:2px solid #ccc;max-width:100%;padding:.33em .5em;resize:vertical}textarea:focus-visible{outline:0;border:2px solid #333}textarea:disabled{background-color:inherit}textarea::-moz-placeholder{color:#ababab}textarea::placeholder{color:#ababab}#buttons{display:flex;justify-content:space-between;gap:16px;margin-top:32px}button{all:unset;background-color:#d9d9d9;border-radius:20px;padding:.5em 1em;cursor:pointer}button:focus-visible{outline:2px solid #333;outline-offset:2px}button:disabled{cursor:default;opacity:.5}#copy{background-color:#333;color:#fff}#output{color:#ababab;resize:none}#output:focus-visible{color:#333}#output::-moz-selection{background-color:#d9d9d9}#output::selection{background-color:#d9d9d9}@media (min-width:900px){body{text-align:left;padding-top:96px}#container{grid-template-rows:1fr auto}#input{grid-row:1/-1}#buttons,#output{grid-column:2}#buttons{grid-row:2;margin-top:0}}