:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}#app{width:100%;max-width:1400px;margin:0 auto;padding:2rem;text-align:center}h1{font-size:3.2em;line-height:1.1;margin-bottom:.5em;background:linear-gradient(to right,#646cff,#a46bf5);-webkit-background-clip:text;background-clip:text;color:transparent}.description{margin-bottom:2rem;color:#888;font-size:1.1rem}.container{display:grid;grid-template-columns:1fr 1fr;gap:2rem;height:70vh}.panel{display:flex;flex-direction:column;gap:1rem}.label{font-weight:700;text-align:left;font-size:1.2rem;color:#a4a4a4;display:flex;justify-content:space-between;align-items:center}.action-btn{font-size:.9rem;padding:.4em .8em;border-radius:8px;border:1px solid transparent;background-color:#1a1a1a;color:#a4a4a4;cursor:pointer;transition:border-color .25s,color .25s}.action-btn:hover{border-color:#646cff;color:#646cff}textarea{width:100%;height:100%;padding:1rem;border-radius:12px;border:1px solid #3a3a3a;background-color:#1a1a1a;color:#e0e0e0;font-family:Menlo,Monaco,Courier New,monospace;font-size:.95rem;resize:none;transition:border-color .25s,box-shadow .25s;box-shadow:0 4px 6px #0000001a;box-sizing:border-box}textarea:focus{outline:none;border-color:#646cff;box-shadow:0 0 0 4px #646cff1a}@media(max-width:768px){.container{grid-template-columns:1fr;height:auto}textarea{min-height:300px}}