*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #f8fafc;--bg-toolbar: #f1f5f9;--bg-header: #e2e8f0;--bg-tabs: #e2e8f0;--border: #cbd5e1;--text: #0f172a;--text-muted: #64748b;--text-dim: #475569;--accent: #4f46e5;--accent-fg: #eef2ff;--accent-text:#4f46e5;--error-bg: #fef2f2;--error-text: #b91c1c;--error-border:#fecaca}[data-theme=dark]{--bg: #0f1117;--bg-toolbar: #1a1d27;--bg-header: #141720;--bg-tabs: #0f1117;--border: #2d3148;--text: #e2e8f0;--text-muted: #64748b;--text-dim: #94a3b8;--accent: #3730a3;--accent-fg: #e0e7ff;--accent-text:#a5b4fc;--error-bg: #450a0a;--error-text: #fca5a5;--error-border:#7f1d1d}body{font-family:system-ui,sans-serif;background:var(--bg);color:var(--text);height:100dvh;overflow:hidden}#root{display:flex;flex-direction:column;height:100dvh}.toolbar{display:flex;align-items:center;gap:12px;padding:8px 16px;background:var(--bg-toolbar);border-bottom:1px solid var(--border);flex-shrink:0}.toolbar h1{font-size:15px;font-weight:600;letter-spacing:.02em;color:var(--accent-text)}.toolbar .sep{flex:1}.format-tabs{display:flex;gap:2px;background:var(--bg-tabs);border-radius:6px;padding:2px}.format-tabs button{padding:4px 14px;border:none;border-radius:4px;background:transparent;color:var(--text-dim);font-size:13px;cursor:pointer;transition:background .15s,color .15s}.format-tabs button.active{background:var(--accent);color:var(--accent-fg)}.theme-btn{padding:4px 10px;border:1px solid var(--border);border-radius:4px;background:transparent;color:var(--text-dim);font-size:13px;cursor:pointer;transition:background .15s,color .15s}.theme-btn:hover{background:var(--bg-tabs)}.download-btn{padding:4px 14px;border:1px solid var(--accent);border-radius:4px;background:transparent;color:var(--accent-text);font-size:13px;cursor:pointer;transition:background .15s,color .15s}.download-btn:hover:not(:disabled){background:var(--accent);color:var(--accent-fg)}.download-btn:disabled{opacity:.35;cursor:not-allowed}.panels{display:grid;grid-template-columns:1fr 1fr;flex:1;min-height:0}.panel{display:flex;flex-direction:column;min-height:0}.panel:first-child{border-right:1px solid var(--border)}.panel-header{padding:6px 14px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);background:var(--bg-header);border-bottom:1px solid var(--border);flex-shrink:0}.editor-wrap{flex:1;min-height:0}.error-banner{padding:10px 14px;background:var(--error-bg);color:var(--error-text);font-size:12px;border-bottom:1px solid var(--error-border);font-family:monospace}