*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;height:100vh;display:flex;flex-direction:column;background:#fafafa;color:#1a1a1a}header{padding:12px 20px;background:#fff;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center}header h1{font-size:16px;font-weight:600}header .tag{font-size:11px;color:#999;font-weight:400;margin-left:6px}header .actions{display:flex;gap:8px}header select,header button{font-size:12px;padding:4px 10px;border:1px solid #d1d5db;border-radius:4px;background:#fff;cursor:pointer}header button:hover{background:#f3f4f6}main{flex:1;display:grid;grid-template-columns:380px 1fr;gap:1px;background:#e5e7eb;min-height:0}#editor{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;padding:14px;border:0;resize:none;outline:none;background:#fff;line-height:1.5}#preview{background:#fff;overflow:auto;padding:20px;display:flex;align-items:flex-start;justify-content:center}#preview svg{max-width:100%;height:auto}#preview.error{background:#fef2f2;color:#991b1b;font-family:ui-monospace,monospace;font-size:12px;white-space:pre-wrap;text-align:left;justify-content:flex-start}footer{padding:6px 20px;background:#fff;border-top:1px solid #e5e7eb;display:flex;justify-content:space-between;font-size:11px;color:#6b7280}footer a{color:#2563eb;text-decoration:none}footer a:hover{text-decoration:underline}#status.ok{color:#059669}#status.error{color:#dc2626}