:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#005cc5}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-comment,.hljs-code,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0}:root{--primary: #2563eb;--primary-hover: #1d4ed8;--border: #e5e7eb;--text-main: #111827;--text-muted: #6b7280;--bg: #ffffff;--bg-secondary: #f9fafb;--code-bg: #f3f4f6;--success: #10b981;--font-sans: "Inter", system-ui, -apple-system, sans-serif;--font-serif: "Merriweather", serif;--font-mono: "Fira Code", "Consolas", monospace;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1)}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:var(--font-sans);background:var(--bg-secondary);color:var(--text-main);-webkit-font-smoothing:antialiased}#root{max-width:100%;margin:0;padding:0;width:100%;height:100vh;display:flex;flex-direction:column}.container{display:flex;flex-direction:column;height:100vh;width:100%}.header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:var(--bg);border-bottom:1px solid var(--border);box-shadow:var(--shadow-sm)}.header-left{display:flex;align-items:center;gap:.75rem}.logo-icon{color:var(--primary)}.header-left h1{font-size:1.5rem;font-weight:700;margin:0;color:var(--text-main);letter-spacing:-.025em}.header-right{display:flex;gap:.75rem;align-items:center}.filename-input{padding:.5rem .75rem;border:1px solid var(--border);border-radius:8px;font-family:var(--font-mono);font-size:.875rem;width:200px;outline:none;transition:all .2s}.filename-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #2563eb1a}.main-content{display:grid;grid-template-columns:1fr 1fr;gap:0;flex:1;min-height:0;overflow:hidden}.pane{background:var(--bg);border-right:1px solid var(--border);padding:1.5rem;display:flex;flex-direction:column;overflow:hidden}.pane:last-child{border-right:none}.editor-pane{overflow:hidden}.editor-pane textarea{width:100%;height:100%;background:transparent;border:none;color:var(--text-main);font-family:var(--font-mono);font-size:.9rem;resize:none;outline:none;line-height:1.7}.preview-pane{overflow-y:auto;background:var(--bg)}button{background:var(--primary);color:#fff;border:none;padding:.5rem 1rem;border-radius:8px;font-weight:500;font-size:.875rem;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.5rem}button:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}button.secondary{background:transparent;color:var(--text-muted);border:1px solid var(--border)}button.secondary:hover{background:var(--bg-secondary);border-color:var(--text-muted);transform:none;box-shadow:none}.upload-zone{border:2px dashed var(--border);border-radius:12px;padding:3rem;text-align:center;cursor:pointer;transition:all .2s;color:var(--text-muted)}.upload-zone:hover,.upload-zone.drag-active{background:var(--bg-secondary);border-color:var(--primary);color:var(--primary)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.markdown-body{font-size:1rem;line-height:1.7;color:var(--text-main)}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6{margin-top:1.5em;margin-bottom:.5em;font-weight:700;line-height:1.25;letter-spacing:-.025em}.markdown-body h1{font-size:2em;border-bottom:1px solid var(--border);padding-bottom:.3em}.markdown-body h2{font-size:1.5em;border-bottom:1px solid var(--border);padding-bottom:.3em}.markdown-body h3{font-size:1.25em}.markdown-body pre{background:var(--code-bg);padding:1rem;border-radius:8px;overflow-x:auto;border:1px solid var(--border)}.markdown-body code{background:var(--code-bg);padding:.2em .4em;border-radius:4px;font-family:var(--font-mono);font-size:.875em}.markdown-body pre code{background:transparent;padding:0}.markdown-body table{border-collapse:collapse;width:100%;margin:1em 0;border:1px solid var(--border);border-radius:8px;overflow:hidden}.markdown-body th,.markdown-body td{padding:.75rem;border:1px solid var(--border);text-align:left}.markdown-body th{background:var(--bg-secondary);font-weight:600}.markdown-body tr:hover{background:var(--bg-secondary)}.markdown-body blockquote{border-left:4px solid var(--primary);padding-left:1rem;margin-left:0;color:var(--text-muted);font-style:italic}.markdown-body a{color:var(--primary);text-decoration:none}.markdown-body a:hover{text-decoration:underline}.markdown-body ul,.markdown-body ol{padding-left:2em}.markdown-body li{margin:.25em 0}.mermaid-diagram{background:var(--bg);padding:1.5rem;border-radius:8px;text-align:center;margin:1.5rem 0;border:1px solid var(--border)}.mermaid-diagram svg{max-width:100%;height:auto}.markdown-body input[type=checkbox]{margin-right:.5em}@media(max-width:768px){.main-content{grid-template-columns:1fr}.header{flex-direction:column;gap:1rem;align-items:stretch}.header-right{justify-content:stretch;flex-wrap:wrap}.filename-input{width:100%}}