:root{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-tertiary: #0f0f23;--text-primary: #eee;--text-secondary: #aaa;--text-muted: #666;--accent: #e94560;--accent-hover: #ff6b6b;--border: #333;--success: #4ade80;--warning: #fbbf24;--error: #ef4444;--tab-bg: #252545;--tab-active: #1a1a2e}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary)}#app{display:flex;height:100vh;width:100vw}#sidebar{width:280px;min-width:280px;background:var(--bg-secondary);display:flex;flex-direction:column;border-right:1px solid var(--border)}.sidebar-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--border)}.sidebar-header h1{font-size:1.25rem;font-weight:600}.sidebar-header button{width:32px;height:32px;border:none;border-radius:6px;background:var(--accent);color:#fff;font-size:1.25rem;cursor:pointer;transition:background .2s}.sidebar-header button:hover{background:var(--accent-hover)}.sidebar-search{padding:12px 16px;border-bottom:1px solid var(--border)}.sidebar-search input{width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:6px;background:var(--bg-tertiary);color:var(--text-primary);font-size:.875rem}.sidebar-search input::placeholder{color:var(--text-muted)}#tags-filter{padding:8px 16px;display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid var(--border);max-height:80px;overflow-y:auto}.tag-chip{padding:4px 10px;background:var(--bg-tertiary);border-radius:12px;font-size:.75rem;color:var(--text-secondary);cursor:pointer;transition:all .2s}.tag-chip:hover,.tag-chip.active{background:var(--accent);color:#fff}#doc-list{flex:1;overflow-y:auto;list-style:none}.doc-item{padding:12px 16px;border-bottom:1px solid var(--border);cursor:pointer;transition:background .2s}.doc-item:hover{background:var(--bg-tertiary)}.doc-item.active{background:var(--bg-primary);border-left:3px solid var(--accent)}.doc-item-title{font-size:.9rem;font-weight:500;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.doc-item-meta{font-size:.75rem;color:var(--text-muted)}.doc-item{position:relative}.doc-item-delete{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:20px;height:20px;border:none;border-radius:50%;background:transparent;color:var(--text-muted);font-size:1rem;cursor:pointer;opacity:0;transition:all .2s}.doc-item:hover .doc-item-delete{opacity:1}.doc-item-delete:hover{background:var(--error);color:#fff}.sidebar-footer{padding:12px 16px;border-top:1px solid var(--border);display:flex;gap:8px}.sidebar-footer button{flex:1;padding:8px;border:1px solid var(--border);border-radius:6px;background:var(--bg-tertiary);color:var(--text-secondary);font-size:.8rem;cursor:pointer;transition:all .2s}.sidebar-footer button:hover{background:var(--bg-primary);color:var(--text-primary)}#main-content{flex:1;display:flex;flex-direction:column;overflow:hidden}#tabs-container{background:var(--bg-secondary);border-bottom:1px solid var(--border)}#tabs-list{display:flex;overflow-x:auto;padding:0 8px}.tab{display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--tab-bg);border:none;border-top:2px solid transparent;color:var(--text-secondary);font-size:.85rem;cursor:pointer;white-space:nowrap;transition:all .2s}.tab:hover{background:var(--tab-active);color:var(--text-primary)}.tab.active{background:var(--tab-active);border-top-color:var(--accent);color:var(--text-primary)}.tab-close{width:18px;height:18px;border:none;border-radius:50%;background:transparent;color:var(--text-muted);font-size:1rem;line-height:1;cursor:pointer;transition:all .2s}.tab-close:hover{background:var(--error);color:#fff}.tab-unsaved:after{content:"";width:8px;height:8px;background:var(--error);border-radius:50%}.tab-saved:after{content:"";width:8px;height:8px;background:var(--success);border-radius:50%}#editor-container{flex:1;overflow:hidden;position:relative}#editor{height:100%}.cm-editor{height:100%;font-family:Fira Code,Consolas,monospace;font-size:14px}.cm-editor .cm-scroller{padding:16px;padding-bottom:50vh}.cm-editor.cm-focused{outline:none}#status-bar{display:flex;justify-content:space-between;padding:6px 16px;background:var(--bg-secondary);border-top:1px solid var(--border);font-size:.75rem;color:var(--text-muted)}#sync-status.syncing{color:var(--warning)}#sync-status.synced{color:var(--success)}#sync-status.error{color:var(--error)}#modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}#modal-overlay.hidden{display:none}#modal-content{background:var(--bg-secondary);border-radius:12px;padding:24px;min-width:400px;max-width:90vw;max-height:90vh;overflow-y:auto}@media(max-width:768px){#sidebar{position:fixed;left:-280px;top:0;bottom:0;z-index:100;transition:left .3s}#sidebar.open{left:0}.mobile-menu-btn{display:block}}.drop-zone{position:fixed;inset:0;background:#e9456033;border:4px dashed var(--accent);display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:var(--accent);z-index:999;pointer-events:none}.drop-zone.hidden{display:none}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--text-muted);text-align:center;padding:40px}.empty-state h2{margin-bottom:8px;font-weight:500}.empty-state p{font-size:.9rem}.tags-editor{display:flex;flex-wrap:wrap;gap:6px;padding:8px 16px;background:var(--bg-tertiary);border-top:1px solid var(--border);align-items:center}.tags-editor-label{font-size:.75rem;color:var(--text-muted);margin-right:8px}.tag-editable{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;background:var(--bg-secondary);border-radius:12px;font-size:.75rem;color:var(--text-secondary)}.tag-editable .tag-remove{width:14px;height:14px;border:none;border-radius:50%;background:transparent;color:var(--text-muted);font-size:.8rem;cursor:pointer;display:flex;align-items:center;justify-content:center}.tag-editable .tag-remove:hover{background:var(--error);color:#fff}.tag-input{border:none;background:transparent;color:var(--text-primary);font-size:.75rem;width:80px;outline:none}.tag-input::placeholder{color:var(--text-muted)}.add-tag-btn{padding:4px 10px;background:var(--accent);border:none;border-radius:12px;color:#fff;font-size:.7rem;cursor:pointer}.add-tag-btn:hover{background:var(--accent-hover)}.header-buttons{display:flex;gap:8px}.header-buttons button{width:32px;height:32px}#editor-toolbar{display:flex;align-items:center;gap:4px;padding:0 8px;margin-left:auto}#editor-toolbar button{padding:6px 10px;border:none;border-radius:4px;background:transparent;color:var(--text-secondary);font-size:.9rem;cursor:pointer;transition:all .2s}#editor-toolbar button:hover{background:var(--bg-tertiary);color:var(--text-primary)}#editor-toolbar button.active{background:var(--accent);color:#fff}#tabs-container{display:flex;align-items:center}#offline-indicator{padding:4px 8px;background:var(--warning);color:#000;border-radius:4px;font-size:.75rem;font-weight:600}#offline-indicator.hidden{display:none}#preview{height:100%;overflow-y:auto;padding:20px;background:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}#preview.hidden{display:none}#editor-container.split-view{display:flex}#editor-container.split-view #editor{flex:1;border-right:1px solid var(--border)}#editor-container.split-view #preview{flex:1;display:block}#preview h1,#preview h2,#preview h3,#preview h4{margin:1em 0 .5em;color:var(--text-primary)}#preview h1{font-size:2em;border-bottom:1px solid var(--border);padding-bottom:.3em}#preview h2{font-size:1.5em;border-bottom:1px solid var(--border);padding-bottom:.3em}#preview h3{font-size:1.25em}#preview p{margin:1em 0}#preview code{background:var(--bg-tertiary);padding:2px 6px;border-radius:4px;font-family:Fira Code,Consolas,monospace;font-size:.9em}#preview pre{background:var(--bg-tertiary);padding:16px;border-radius:8px;overflow-x:auto;margin:1em 0}#preview pre code{background:none;padding:0}#preview blockquote{border-left:4px solid var(--accent);margin:1em 0;padding-left:16px;color:var(--text-secondary)}#preview ul,#preview ol{margin:1em 0;padding-left:2em}#preview li{margin:.5em 0}#preview a{color:var(--accent);text-decoration:none}#preview a:hover{text-decoration:underline}#preview img{max-width:100%;border-radius:8px}#preview table{width:100%;border-collapse:collapse;margin:1em 0}#preview th,#preview td{border:1px solid var(--border);padding:8px 12px;text-align:left}#preview th{background:var(--bg-secondary)}#preview hr{border:none;border-top:1px solid var(--border);margin:2em 0}.cm-panel.cm-search{background:var(--bg-secondary);border-bottom:1px solid var(--border);padding:8px}.cm-panel.cm-search input,.cm-panel.cm-search button{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border);border-radius:4px;padding:4px 8px;margin:2px}.cm-panel.cm-search button:hover{background:var(--bg-primary)}.cm-panel.cm-search label{color:var(--text-secondary)}.cm-searchMatch{background:#e945604d}.cm-searchMatch-selected{background:#e9456099}.favorite-star{position:absolute;left:4px;top:50%;transform:translateY(-50%);background:none;border:none;font-size:1rem;cursor:pointer;opacity:.3;transition:all .2s;padding:0;line-height:1}.doc-item:hover .favorite-star,.favorite-star.active{opacity:1}.favorite-star.active{color:var(--warning)}.doc-item.has-star{padding-left:28px}.favorites-section{border-bottom:2px solid var(--accent)}.section-header{padding:8px 16px;font-size:.7rem;text-transform:uppercase;color:var(--text-muted);background:var(--bg-tertiary);letter-spacing:.5px}.folder-item{padding:8px 16px;border-bottom:1px solid var(--border);cursor:pointer;display:flex;align-items:center;gap:8px;transition:background .2s}.folder-item:hover{background:var(--bg-tertiary)}.folder-toggle{width:16px;font-size:.7rem;color:var(--text-muted);transition:transform .2s}.folder-item.expanded .folder-toggle{transform:rotate(90deg)}.folder-icon{font-size:1rem}.folder-name{flex:1;font-size:.85rem;font-weight:500}.folder-actions{display:flex;gap:4px;opacity:0;transition:opacity .2s}.folder-item:hover .folder-actions{opacity:1}.folder-actions button{width:20px;height:20px;border:none;border-radius:4px;background:transparent;color:var(--text-muted);font-size:.8rem;cursor:pointer}.folder-actions button:hover{background:var(--bg-primary);color:var(--text-primary)}.folder-children{background:var(--bg-tertiary)}.folder-children .doc-item{padding-left:40px}.folder-item.collapsed+.folder-children{display:none}.uncategorized-section{margin-top:8px}