#app *{box-sizing:border-box}#app{width:90%;max-width:1150px;margin:0 auto;padding-bottom:150px;font-family:"Exo 2",Helvetica,Arial,sans-serif;position:relative}@media (max-width:520px){#app{width:95%}}#app .result{background-color:#f5f5f5;border-radius:50px;margin-top:0;padding:.5rem 1rem}#app button{cursor:pointer;background-color:#0000;border:2px solid #000;border-radius:50px;padding:.5rem 1rem;transition:background .25s,color .25s,border-color .25s}@media (hover:hover){#app button:hover{color:#fff;background-color:#000}}#app button:active{background-color:#55b927;border-color:#55b927}#app .copy-button:before{content:"";z-index:1;cursor:pointer;width:100%;height:100%;position:absolute;top:0;left:0}#app .reset-button{z-index:2}#app .buttons-container{gap:.5rem;display:flex}#app .result{transition:transform .25s;display:inline-block}#app .result-viewer:has(.copy-button:active) .result{color:#55b927;transform:scale(.9)}#app header{padding:1rem 0}#app header h1{font-size:2.5rem}#app main{flex-wrap:wrap;display:flex}#app .result-viewer{z-index:1;background-color:#fff;width:100%;height:max-content;padding:1rem 2rem;position:fixed;bottom:0;left:0;box-shadow:0 0 10px #0000004d}#app .source-selector{width:100%}#app select{cursor:pointer;background-color:#0000;border:2px solid #000;border-radius:50px;outline:none;min-width:300px;padding:.5rem 1rem}@media (max-width:520px){#app select{min-width:unset;width:100%}}#app .source{background-color:#f5f5f5;border-radius:50px;width:100%;margin-top:1rem;padding:50px}@media (max-width:520px){#app .source{border-radius:25px;padding:25px}}#app .source h2{margin-top:0;margin-bottom:.25rem}#app .subtitle{margin:0}#app .input-group{margin-top:2rem}#app .input-group p{margin:.25rem 0}#app .source input{border:1px solid #0000004d;border-radius:50px;min-width:300px;margin-top:.5rem;padding:.5rem 1rem}@media (max-width:520px){#app .source input{min-width:unset;width:100%}}#app small{opacity:.5;z-index:0}