:root{--sidebar-bg:#2b3138;--sidebar-fg:#c7ced6;--sidebar-muted:#8b95a1;--sidebar-sel:#3a424b;--list-bg:#f4f5f7;--list-border:#e2e4e8;--editor-bg:#fff;--text:#222831;--accent:#2f6fde;--danger:#d23f3f;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}.app{flex-direction:column;height:100dvh;display:flex}.app-body{flex:1;min-height:0;display:flex}.sidebar{background:var(--sidebar-bg);width:250px;color:var(--sidebar-fg);flex-direction:column;padding:8px;display:flex;overflow-y:auto}.sidebar-header{letter-spacing:1px;color:var(--sidebar-muted);justify-content:space-between;align-items:center;padding:6px 4px;font-size:11px;display:flex}.sidebar-section{letter-spacing:1px;color:var(--sidebar-muted);padding:12px 4px 4px;font-size:11px}.icon-btn{color:var(--sidebar-fg);cursor:pointer;background:0 0;border:none;font-size:16px}.nb-tree{flex-direction:column;display:flex}.nb-item,.tag-item{cursor:pointer;border-radius:4px;align-items:center;gap:6px;padding:5px 6px;font-size:14px;display:flex}.nb-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.nb-item:hover,.tag-item:hover,.nb-item.selected,.tag-item.selected{background:var(--sidebar-sel)}.nb-icon{flex:none}.nb-count{color:var(--sidebar-muted);flex:none;margin-left:6px;font-size:12px}.sync-btn{border:1px solid var(--sidebar-muted);color:var(--sidebar-fg);cursor:pointer;background:0 0;border-radius:6px;margin-top:auto;padding:8px}.sync-btn:hover{background:var(--sidebar-sel)}.notelist,.trashview{background:var(--list-bg);border-right:1px solid var(--list-border);flex-direction:column;width:280px;display:flex}.notelist-head{gap:6px;padding:8px;display:flex}.new-note-btn{background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:5px;padding:6px 10px}.search-box{flex:1;display:flex;position:relative}.search-input{border:1px solid var(--list-border);border-radius:5px;flex:1;width:100%;padding:6px 26px 6px 6px}.search-clear{color:#999;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:13px;line-height:1;position:absolute;top:50%;right:4px;transform:translateY(-50%)}.search-clear:hover{color:#333;background:#e3e6ea}.notelist-title{color:#555;padding:6px 12px;font-weight:600}.notes{margin:0;padding:0;list-style:none;overflow-y:auto}.note-row{cursor:pointer;border-bottom:1px solid #eceef1;padding:9px 12px}.note-row:hover{background:#e9ecf1}.note-row.selected{background:#dfe6f3}.notes-empty{color:#999;padding:16px 12px}.trash-row{border-bottom:1px solid #eceef1;flex-direction:column;gap:4px;padding:9px 12px;display:flex}.trash-actions button{cursor:pointer;margin-right:6px;font-size:12px}.editor{background:var(--editor-bg);flex-direction:column;flex:1;min-width:0;padding:10px 16px;display:flex}.editor-empty{color:#aaa;justify-content:center;align-items:center}.editor-title{color:var(--text);border:none;outline:none;padding:6px 0;font-size:20px;font-weight:700}.editor-meta{color:#68717d;flex-wrap:wrap;gap:4px 18px;padding:2px 0 8px;font-size:12px;line-height:1.5;display:flex}.editor-notebook{overflow-wrap:anywhere}.editor-toolbar{border-bottom:1px solid var(--list-border);gap:6px;padding:6px 0;display:flex}.editor-toolbar button{border:1px solid var(--list-border);cursor:pointer;background:#f4f5f7;border-radius:5px;padding:4px 10px}.editor-body{resize:none;border:none;outline:none;flex:1;padding:10px 0;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:15px;line-height:1.6}.editor-preview{flex:1;padding:10px 0;line-height:1.6;overflow-y:auto}.editor-tags{border:1px solid var(--list-border);border-radius:5px;margin-top:6px;padding:6px}.login{background:var(--sidebar-bg);justify-content:center;align-items:center;height:100vh;display:flex}.login-card{background:#fff;border-radius:10px;flex-direction:column;gap:6px;width:300px;padding:28px;display:flex}.login-card h1{text-align:center;margin:0 0 10px}.login-card label{color:#666;font-size:12px}.login-card input{border:1px solid var(--list-border);border-radius:5px;padding:8px}.login-card button{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;margin-top:12px;padding:10px}.login-error{color:var(--danger);font-size:13px}.app-statusbar{background:var(--sidebar-bg);color:var(--sidebar-fg);flex:none;justify-content:space-between;align-items:center;padding:4px 12px;font-size:13px;display:flex}.logout-btn{color:var(--sidebar-muted);cursor:pointer;background:0 0;border:none}.error-banner{color:#a12020;text-align:center;background:#ffe2e2;padding:8px 12px;font-size:14px}.editor-savestate{color:var(--sidebar-muted);align-self:center;margin-left:auto;font-size:12px}.notelist-subhead{justify-content:space-between;align-items:center;gap:8px;padding:6px 12px;display:flex}.notelist-subhead .notelist-title{padding:0}.sort-select{border:1px solid var(--list-border);color:#555;cursor:pointer;background:#fff;border-radius:5px;padding:3px 6px;font-size:12px}.sort-btn{border:1px solid var(--list-border);color:#444;cursor:pointer;background:#fff;border-radius:5px;flex:none;justify-content:center;align-items:center;width:32px;height:30px;font-size:15px;font-weight:700;display:flex}.sort-btn:hover{background:#eef1f6}.sync-icon{display:inline-block}.sync-icon.spinning{animation:.9s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.sync-btn:disabled{opacity:.7;cursor:default}.sync-banner{color:#1c6b2e;text-align:center;background:#dff3e0;padding:6px 12px;font-size:14px}.context-menu{z-index:1000;border:1px solid var(--list-border);background:#fff;border-radius:8px;min-width:180px;margin:0;padding:4px;list-style:none;position:fixed;box-shadow:0 6px 24px #0000002e}.context-item{cursor:pointer;color:var(--text);border-radius:5px;padding:8px 12px;font-size:14px}.context-item:hover{background:#eef1f6}.context-item.danger{color:var(--danger)}.context-item.danger:hover{background:#fdecec}.login-toggle{color:var(--accent);cursor:pointer;background:0 0;border:none;margin-top:4px;font-size:13px}.statusbar-actions{gap:12px;display:flex}.modal-overlay{z-index:2000;background:#00000073;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-card{color:var(--text);background:#fff;border-radius:10px;flex-direction:column;gap:6px;width:320px;padding:24px;display:flex}.modal-card h2{margin:0 0 8px}.modal-card label{color:#666;font-size:12px}.modal-card input{border:1px solid var(--list-border);border-radius:5px;padding:8px}.modal-actions{justify-content:flex-end;gap:8px;margin-top:12px;display:flex}.modal-actions button{cursor:pointer;border:1px solid var(--list-border);background:#f4f5f7;border-radius:6px;padding:8px 14px}.modal-actions button[type=submit]{background:var(--accent);color:#fff;border:none}.modal-success{color:#1c6b2e;font-size:13px}.sidebar,.notelist,.trashview{flex:none}.notelist-head{align-items:center}.resizer{cursor:col-resize;background:0 0;flex:0 0 5px;align-self:stretch}.resizer:hover{background:var(--accent)}.mobile-topbar{background:var(--sidebar-bg);color:var(--sidebar-fg);flex:none;align-items:center;gap:8px;padding:6px 10px;display:flex}.mobile-nav-btn{color:var(--sidebar-fg);cursor:pointer;background:0 0;border:none;padding:4px 8px;font-size:18px}.drawer-overlay{z-index:2900;background:#00000073;position:fixed;inset:0}@media (width<=760px){.app.mobile .resizer{display:none}.app.mobile .sidebar{z-index:3000;max-width:300px;transition:transform .2s;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);width:82%!important}.app.mobile.drawer-open .sidebar{transform:translate(0)}.app.mobile .notelist,.app.mobile .trashview,.app.mobile .editor{flex:auto;min-width:0;min-height:0;width:auto!important}}.notewindow{flex-direction:column;height:100dvh;display:flex}.notewindow-loading{color:#888;padding:20px}