:root{color-scheme:light;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f5f9fc;color:#15212a;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#f5f9fc}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.52}.app-shell{width:min(880px,calc(100vw - 32px));margin:0 auto;padding:48px 0 64px}.converter{display:grid;gap:28px}.page-heading{display:grid;gap:8px}.page-heading h1{margin:0;color:#0a1723;font-size:clamp(32px,6vw,52px);line-height:1.05;letter-spacing:-.05em}.page-heading p{max-width:52ch;margin:0;color:#4d5a65;font-size:17px;line-height:1.65}.form-section,.results{display:grid;gap:18px}.field{display:grid;gap:8px}.field span,.result-header strong{color:#1e2a35;font-weight:700}.field input{width:100%;border:1px solid oklch(.86 .015 245);border-radius:14px;padding:15px 16px;background:#fcfeff;color:#111c26;outline:none}.field input:focus{border-color:#3080bc;box-shadow:0 0 0 3px #c6e2fb}.format-row{display:flex;flex-wrap:wrap;gap:10px}.format-button,.preview-button,.result-header button{border:1px solid oklch(.82 .016 245);border-radius:999px;padding:10px 14px;background:#fcfeff;color:#1e2a35;font-weight:650}.format-button-active,.preview-button{border-color:#036eae;background:#036eae;color:#f5f9fc}.result-box{overflow:hidden;border:1px solid oklch(.87 .014 245);border-radius:16px;background:#fcfeff}.result-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 14px;border-bottom:1px solid oklch(.9 .012 245)}.result-header button{padding:7px 12px}.result-box code,.result-box pre,.preview{display:block;margin:0;padding:14px;color:#20303d;white-space:pre-wrap;overflow-wrap:anywhere;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:13px;line-height:1.65}.preview-button{justify-self:start;padding:11px 16px}.preview{max-height:320px;overflow:auto;border:1px solid oklch(.87 .014 245);border-radius:16px;background:#fcfeff}.preview-error{border-color:#e6857e;color:#892a29}@media(max-width:640px){.app-shell{width:min(100vw - 24px,880px);padding:28px 0 44px}.format-row{display:grid}.format-button,.preview-button{width:100%}}
