body{font-family:Segoe UI,sans-serif;background-color:#eee;color:#333;margin:0;padding:0;transition:background-color .3s,color .3s}body.dark{background-color:#1e1e2f;color:#e0e0ff}.container{max-width:600px;margin:auto;padding:20px}main{display:flex;flex-direction:column;gap:15px}.header{justify-content:space-between;gap:10px;flex-wrap:wrap}.header,.title{display:flex;align-items:center}.title{font-size:1.75rem;font-weight:700;gap:6px}.controls{display:flex;gap:10px;flex-wrap:wrap}.input,select,textarea{width:100%;padding:10px;font-size:16px;border:1px solid #ccc;border-radius:6px;background:#fffaf0;color:#000;box-sizing:border-box}body.dark .input,body.dark select,body.dark textarea{background:#2c2c3a;border-color:#555;color:#e0e0ff}.button,.toggle{padding:10px 18px;font-size:15px;background:#0070f3;color:white;border:none;border-radius:6px;cursor:pointer;transition:background .2s;min-width:120px;text-align:center}.button:disabled{background:#888;cursor:not-allowed}.button:hover,.toggle:hover{background:#005ac1}.result-box{margin-top:10px;display:flex;flex-direction:column;gap:10px}.textarea{height:150px;resize:vertical}@media screen and (max-width:480px){.container{padding:15px}.button,.toggle{font-size:14px;width:100%}.header{flex-direction:column;align-items:stretch}.controls{width:100%;justify-content:center}.textarea{height:120px}}