:root{color-scheme:light;font-family:Arial,sans-serif;background:#f6f7fb;color:#1f2937}body{margin:0;padding:0;min-height:100vh;display:flex;justify-content:center;align-items:center}.page{width:min(100%,720px);margin:24px;padding:32px;border-radius:18px;background:#fff;box-shadow:0 20px 40px #0f172a14}h1{margin-top:0;font-size:2.4rem;letter-spacing:-.03em;color:#0f172a}form{display:grid;gap:18px}label{display:block;font-weight:600;margin-bottom:8px}input,textarea{width:100%;padding:12px 14px;border:1px solid #d1d5db;border-radius:12px;font-size:1rem;transition:border-color .2s ease}input:focus,textarea:focus{outline:none;border-color:#2563eb}button{padding:12px 18px;border:none;border-radius:10px;background:#2563eb;color:#fff;font-size:1rem;cursor:pointer}button[disabled]{opacity:.55;cursor:not-allowed}.message{margin-top:12px;font-size:.98rem;color:#065f46}.preview{margin-top:24px;padding:18px;background:#f3f4f6;border-radius:14px;overflow-x:auto;white-space:pre-wrap}