.app{color:#000;background-color:#fff;min-height:100vh;padding:1rem;font-family:sans-serif;transition:background-color .3s,color .3s}.app.dark{color:#fff;background-color:#121212}h1{margin-bottom:1rem}textarea{color:#000;resize:vertical;box-sizing:border-box;background-color:#f0f0f0;border:1px solid #ccc;border-radius:4px;width:100%;height:600px;padding:.5rem;font-family:monospace;font-size:1rem}.app.dark textarea{color:#eee;background-color:#1e1e1e;border:1px solid #444}.toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.language-select select{color:#000;cursor:pointer;background-color:#fff;border:1px solid #ccc;border-radius:6px;padding:.3rem .5rem;font-size:1rem}.app.dark .language-select select{color:#eee;background-color:#1e1e1e;border:1px solid #444}.textareas-container{flex-wrap:wrap;gap:1rem;display:flex}.editor{flex-direction:column;flex:300px;min-width:0;display:flex}.editor-header{justify-content:space-between;align-items:center;margin-bottom:.3rem;display:flex}.editor-label{font-family:monospace;font-weight:700}.copy-btn{margin:0;padding:.25rem .6rem;font-size:.85rem}.copy-btn:disabled{opacity:.5;cursor:not-allowed}@media (width<=768px){.editor{flex:100%}}button{cursor:pointer;border-radius:7px;margin:.5rem .5rem .5rem 0;padding:.5rem 1rem;font-size:1rem}.button-container{margin-top:1rem}footer{text-align:left;margin-top:2rem;font-size:1rem}footer p{color:#555;margin:.5rem 0}footer a{color:#007bff;font-weight:700;text-decoration:none}footer a:hover{color:#0056b3}footer a.link{text-decoration:underline}.app.dark footer a{color:#ffd54f}.app.dark footer a:hover{color:#ffe082}.version{opacity:.7;font-size:.8rem}