:root{--border: #e0e0e0;--bg: #ffffff;--panel: #ffffff;--toolbar-bg: #fafafa;--text: #0f172a;--muted: #475569;--font: -apple-system, "system-ui", "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"}.app-root[data-theme=dark]{--border: #3e3e3e;--bg: #1e1e1e;--panel: #1e1e1e;--toolbar-bg: #252526;--text: #d4d4d4;--muted: #a0a0a0;--active-btn-bg: #37373d}.app-root[data-theme=auto]{--bg: #ffffff;--panel: #ffffff;--toolbar-bg: #fafafa;--text: #0f172a;--muted: #475569;--active-btn-bg: #e2e8f0}@media (prefers-color-scheme: dark){.app-root[data-theme=auto]{--border: #3e3e3e;--bg: #1e1e1e;--panel: #1e1e1e;--toolbar-bg: #252526;--text: #d4d4d4;--muted: #a0a0a0;--active-btn-bg: #37373d}}.app-root{display:flex;flex-direction:column;height:100vh;width:100vw;background:var(--bg);color:var(--text);font-family:var(--font)}.header{min-height:48px;height:auto;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;border-bottom:1px solid var(--border);background:var(--toolbar-bg);font-weight:650;font-size:15px;flex-shrink:0}.header .title{font-size:16px;font-weight:700}.header-controls{display:flex;align-items:center;gap:12px}.button-group{display:flex;background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:2px;gap:2px}.button-group button{border:none;background:transparent;padding:4px 10px;font-size:13px;border-radius:4px;color:var(--muted);font-weight:500}.button-group button.active{background:var(--active-btn-bg);color:var(--text);font-weight:600}.button-group button:hover:not(.active){background:#94a3b81a;color:var(--text)}.separator{width:1px;height:24px;background:var(--border)}.workspace{flex:1;display:flex;min-height:0;overflow:hidden}.pane{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--panel)}.left{border-right:1px solid var(--border)}.divider{width:1px;background:var(--border)}.toolbar{height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--border);background:var(--toolbar-bg);font-weight:650;font-size:15px;letter-spacing:-.01em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.toolbar>span{font-size:16px}.toolbar-controls{display:flex;align-items:center;gap:10px;font-weight:550}.toolbar-label{font-size:13px;color:var(--muted)}select{border:1px solid var(--border);background:transparent;color:var(--text);border-radius:6px;padding:7px 10px;font:inherit;font-size:14px;line-height:1.2}button{border:1px solid var(--border);background:transparent;color:var(--text);border-radius:6px;padding:7px 12px;font:inherit;font-size:14px;line-height:1.2;cursor:pointer}button:hover{background:#94a3b824}textarea{flex:1;border:none;outline:none;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:14px;padding:12px;resize:none;background:transparent;color:var(--text)}.preview{flex:1;overflow:auto;padding:12px}@media (max-width: 768px){.header{min-height:48px;height:auto;padding:8px 12px;font-size:14px}.header .title{font-size:15px}.header-controls{gap:8px;flex-wrap:wrap}.separator,.export-btn{display:none}.theme-select{font-size:13px;padding:6px 8px}.button-group button{padding:4px 8px;font-size:12px}select{font-size:13px;padding:6px 8px}button{font-size:13px;padding:6px 10px}.workspace{flex-direction:column}.divider{width:100%;height:1px}.left{border-right:none;border-bottom:1px solid var(--border)}.pane.left{flex:none;height:40vh}.pane.right{flex:1;min-height:0}textarea{font-size:.95rem;padding:10px}.preview{padding:10px}}@media print{html,body{height:auto}.header,.pane.left,.divider{display:none!important}.app-root{display:block;height:auto;background:var(--bg);color:var(--text);-webkit-print-color-adjust:exact;print-color-adjust:exact}.workspace{display:block;height:auto;overflow:visible}.pane.right{height:auto}.preview{overflow:visible;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}}