:root{--bg: #ffffff;--bg-elev: #f6f8fa;--bg-surface: #ffffff;--text: #1f2328;--text-muted: #59636e;--border: #d1d9e0;--accent: #0969da;--accent-hover: #075cb8;--accent-text: #ffffff;--danger: #d1242f;--editor-bg: #fbfcfd;--preview-bg: #ffffff;--code-bg: #f6f8fa;--selection: #b6e3ff;--shadow: 0 2px 8px rgba(0, 0, 0, .12);--hl-comment: #6e7781;--hl-keyword: #cf222e;--hl-string: #0a3069;--hl-number: #0550ae;--hl-title: #8250df;--hl-tag: #116329;--hl-builtin: #953800;--hl-meta: #8250df;--hl-attr: #953800}[data-theme=dark]{--bg: #0d1117;--bg-elev: #161b22;--bg-surface: #0d1117;--text: #e6edf3;--text-muted: #8b949e;--border: #30363d;--accent: #4493f8;--accent-hover: #5ca3ff;--accent-text: #0d1117;--danger: #f85149;--editor-bg: #0d1117;--preview-bg: #0d1117;--code-bg: #161b22;--selection: #1f6feb66;--shadow: 0 2px 8px rgba(0, 0, 0, .5);--hl-comment: #8b949e;--hl-keyword: #ff7b72;--hl-string: #a5d6ff;--hl-number: #79c0ff;--hl-title: #d2a8ff;--hl-tag: #7ee787;--hl-builtin: #ffa657;--hl-meta: #d2a8ff;--hl-attr: #ffa657}[data-theme=forest]{--bg: #141a17;--bg-elev: #1a211d;--bg-surface: #141a17;--text: #d6e0d6;--text-muted: #8a9a8a;--border: #2f3a33;--accent: #3fb950;--accent-hover: #56d364;--accent-text: #0d1117;--danger: #f85149;--editor-bg: #141a17;--preview-bg: #141a17;--code-bg: #1a211d;--selection: #2ea04355;--shadow: 0 2px 8px rgba(0, 0, 0, .5);--hl-comment: #8a9a8a;--hl-keyword: #7ee787;--hl-string: #a5d6ff;--hl-number: #ffa657;--hl-title: #d2a8ff;--hl-tag: #7ee787;--hl-builtin: #ffa657;--hl-meta: #d2a8ff;--hl-attr: #ffa657}[data-theme=neutral]{--bg: #ffffff;--bg-elev: #f6f7f8;--bg-surface: #ffffff;--text: #24292f;--text-muted: #6e7781;--border: #d0d7de;--accent: #57606a;--accent-hover: #424a53;--accent-text: #ffffff;--danger: #cf222e;--editor-bg: #ffffff;--preview-bg: #ffffff;--code-bg: #f6f8fa;--selection: #d0d7de;--shadow: 0 2px 8px rgba(0, 0, 0, .12);--hl-comment: #6e7781;--hl-keyword: #57606a;--hl-string: #3b4856;--hl-number: #424a53;--hl-title: #24292f;--hl-tag: #424a53;--hl-builtin: #57606a;--hl-meta: #57606a;--hl-attr: #424a53}*{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text)}#app{display:flex;flex-direction:column;height:100vh}.toolbar{display:flex;align-items:center;justify-content:space-between;height:48px;padding:0 12px;background:var(--bg-elev);border-bottom:1px solid var(--border);flex:0 0 auto}.toolbar-left,.toolbar-right{display:flex;align-items:center;gap:8px}.logo{font-weight:700;font-size:16px;letter-spacing:.3px}.subtitle{color:var(--text-muted);font-size:12px}.counts{color:var(--text-muted);font-size:12px;margin-right:8px;white-space:nowrap}.theme-select{font-family:inherit;font-size:13px;color:var(--text);background:var(--bg-surface);border:1px solid var(--border);border-radius:6px;padding:6px 8px;cursor:pointer;outline:none}.theme-select:focus{border-color:var(--accent)}.btn,.icon-btn{font-family:inherit;font-size:13px;color:var(--text);background:var(--bg-surface);border:1px solid var(--border);border-radius:6px;padding:6px 12px;cursor:pointer;transition:background .15s,border-color .15s;white-space:nowrap}.btn:hover,.icon-btn:hover{border-color:var(--accent)}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.btn-primary:hover{background:var(--accent-hover)}.icon-btn{padding:6px 9px;line-height:1}.icon-btn.small{padding:3px 7px;font-size:13px}.icon-btn.danger:hover{border-color:var(--danger);color:var(--danger)}.workspace{flex:1 1 auto;display:flex;min-height:0}.sidebar{flex:0 0 260px;width:260px;background:var(--bg-elev);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;transition:flex-basis .2s ease}.sidebar:not(.open){flex-basis:0;width:0;border-right:none}.sidebar-head{padding:12px;border-bottom:1px solid var(--border);flex:0 0 auto}.sidebar-head input{width:100%;padding:7px 10px;font-family:inherit;font-size:13px;color:var(--text);background:var(--bg-surface);border:1px solid var(--border);border-radius:6px;outline:none}.sidebar-head input:focus{border-color:var(--accent)}.snippet-list{list-style:none;margin:0;padding:8px;overflow-y:auto;flex:1 1 auto}.snippet-item{display:flex;align-items:center;gap:6px;padding:6px;border-radius:6px;margin-bottom:4px}.snippet-item.active,.snippet-item:hover{background:var(--selection)}.snippet-info{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:4px 6px;font-family:inherit;font-size:13px;color:var(--text);background:none;border:none;cursor:pointer;text-align:left}.snippet-name{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.snippet-date{color:var(--text-muted);font-size:11px}.snippet-actions{display:flex;gap:2px;flex:0 0 auto}.snippet-empty{padding:16px;color:var(--text-muted);font-size:13px;text-align:center}.panes{flex:1 1 auto;display:flex;min-width:0}.pane{min-width:0;display:flex}.editor-pane{flex:0 0 50%}.preview-pane{flex:1 1 0;background:var(--preview-bg)}.resizer{flex:0 0 6px;cursor:col-resize;background:var(--border)}.resizer:hover{background:var(--accent)}body.resizing{cursor:col-resize;-webkit-user-select:none;user-select:none}#editor{flex:1 1 auto;width:100%;height:100%;border:none;resize:none;padding:16px 20px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px;line-height:1.6;color:var(--text);background:var(--editor-bg);outline:none}#editor::placeholder{color:var(--text-muted)}.preview{flex:1 1 auto;height:100%;overflow-y:auto;padding:16px 28px 48px;font-size:16px;line-height:1.6;overflow-wrap:break-word}.preview h1,.preview h2,.preview h3,.preview h4,.preview h5,.preview h6{margin-top:24px;margin-bottom:16px;font-weight:600;line-height:1.25}.preview h1,.preview h2{padding-bottom:.3em;border-bottom:1px solid var(--border)}.preview h1{font-size:2em}.preview h2{font-size:1.5em}.preview h3{font-size:1.25em}.preview h4{font-size:1em}.preview p{margin:0 0 16px}.preview a{color:var(--accent);text-decoration:none}.preview a:hover{text-decoration:underline}.preview img{max-width:100%}.preview hr{border:none;border-top:1px solid var(--border);margin:24px 0}.preview blockquote{margin:0 0 16px;padding:0 1em;color:var(--text-muted);border-left:4px solid var(--border)}.preview ul,.preview ol{margin:0 0 16px;padding-left:2em}.preview li+li{margin-top:.25em}.preview code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:85%;background:var(--code-bg);padding:.2em .4em;border-radius:3px}.preview pre{position:relative;background:var(--code-bg);padding:16px;border-radius:6px;overflow:auto;line-height:1.45;margin:0 0 16px}.preview pre code{background:none;padding:0;font-size:100%}.code-lang{position:absolute;top:6px;right:10px;font-size:11px;color:var(--text-muted);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.preview table{border-collapse:collapse;margin:0 0 16px;display:block;overflow-x:auto}.preview th,.preview td{border:1px solid var(--border);padding:6px 13px}.preview th{background:var(--bg-elev);font-weight:600}.preview .task-list-item{list-style:none}.preview .task-list-item input{margin-right:.4em}.preview .mermaid{margin:16px 0;text-align:center;overflow-x:auto}.preview .mermaid.rendered svg{max-width:100%;height:auto}.preview .mermaid-error{color:var(--danger);background:var(--code-bg);padding:12px;border-radius:6px;overflow:auto;white-space:pre-wrap;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px}.hljs-comment,.hljs-quote{color:var(--hl-comment)}.hljs-keyword,.hljs-selector-tag,.hljs-literal,.hljs-doctag,.hljs-section{color:var(--hl-keyword)}.hljs-string,.hljs-regexp,.hljs-addition,.hljs-meta .hljs-string{color:var(--hl-string)}.hljs-number,.hljs-symbol,.hljs-bullet,.hljs-attr,.hljs-attribute,.hljs-variable,.hljs-template-variable,.hljs-type,.hljs-link{color:var(--hl-number)}.hljs-title,.hljs-name,.hljs-function .hljs-title,.hljs-title.function_{color:var(--hl-title)}.hljs-tag,.hljs-selector-id,.hljs-selector-class{color:var(--hl-tag)}.hljs-built_in,.hljs-builtin-name{color:var(--hl-builtin)}.hljs-meta,.hljs-meta-keyword{color:var(--hl-meta)}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:var(--bg-elev);color:var(--text);border:1px solid var(--border);padding:8px 16px;border-radius:8px;box-shadow:var(--shadow);font-size:13px;z-index:100}
