:root{--bg: #1b1a18;--bg-alt: #242220;--bg-sidebar: #131211;--border: #34322e;--text: #e7e3da;--text-dim: #998f82;--accent: #5aa0d8;--accent-fg: #0e1b27;--accent-dim: #233038;--link: #7fb1e6;--line-active: rgba(120,170,220,.08);--warn: #d8a657;--danger: #e06c6c;--syn-key: #e0a96d;--syn-str: #9fc78a;--syn-com: #7d756a;--syn-num: #d8a657;--syn-fn: #6cb6e0;--syn-attr: #c39ac9;--paper: #201e1b;--paper-shadow: rgba(0,0,0,.45)}:root[data-theme=light]{--bg: #f6f7f9;--bg-alt: #ececef;--bg-sidebar: #f1f2f5;--border: #e4e5ea;--text: #1a1b1f;--text-dim: #6c6e78;--accent: #6366f1;--accent-fg: #ffffff;--accent-dim: #e7e7fb;--link: #5650e0;--line-active: rgba(99,102,241,.06);--warn: #b45309;--danger: #dc2626;--syn-key: #7c3aed;--syn-str: #16a34a;--syn-com: #9aa0ad;--syn-num: #b45309;--syn-fn: #2563eb;--syn-attr: #0891b2;--paper: #ffffff;--paper-shadow: rgba(18,22,40,.1)}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;overflow-x:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);font-size:15px}#app{display:flex;height:100vh;height:100dvh;overflow:hidden}#sidebar{width:260px;flex-shrink:0;background:var(--bg-sidebar);border-right:1px solid var(--border);display:flex;flex-direction:column}#sidebar-head{padding:14px 16px 10px;display:flex;align-items:center;justify-content:space-between}#sidebar-head h1{font-size:16px;margin:0;font-weight:600;letter-spacing:.3px;display:flex;align-items:center;gap:7px}.quill{color:var(--accent)}#new-btn{background:var(--accent);color:var(--accent-fg);border:none;width:28px;height:28px;border-radius:7px;cursor:pointer;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center}#new-btn:hover{filter:brightness(1.15)}#search{margin:0 12px 10px;padding:7px 10px;background:var(--bg-alt);border:1px solid var(--border);border-radius:7px;color:var(--text);font-size:13px;outline:none}#search:focus{border-color:var(--accent)}#note-list{flex:1;overflow-y:auto;padding:0 8px 12px}.note-item{padding:8px 10px;border-radius:7px;cursor:pointer;margin-bottom:2px;overflow:hidden}.note-item:hover{background:var(--bg-alt)}.note-item.active{background:var(--accent-dim)}.note-item .title{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center}.note-dot{flex-shrink:0;width:8px;height:8px;border-radius:50%;margin-right:8px}.dot-green{background:#28c840}.dot-blue{background:#2f7cf6}.dot-grey{background:#6f6c66}:root[data-theme=light] .dot-grey{background:#c9bcae}.note-item .meta{font-size:11px;color:var(--text-dim);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#sidebar-foot{padding:10px 16px;border-top:1px solid var(--border);font-size:11px;color:var(--text-dim);display:flex;justify-content:space-between;align-items:center;gap:8px}#sidebar-foot a{color:var(--text-dim);cursor:pointer}#sidebar-foot a:hover{color:var(--accent)}#main{flex:1;display:flex;flex-direction:column;min-width:0}#toolbar{position:relative;height:46px;flex-shrink:0;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 16px;gap:12px}.toolbar-actions{display:flex;align-items:center;gap:8px}.kebab{display:none;background:transparent;border:none;color:var(--text);font-size:20px;line-height:1;cursor:pointer;padding:4px 8px;border-radius:6px}.kebab:hover{background:var(--bg-alt)}#note-title{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:17px;font-weight:600}#note-title::placeholder{color:var(--text-dim)}.tbtn{background:var(--bg-alt);border:1px solid var(--border);color:var(--text-dim);border-radius:6px;padding:5px 10px;cursor:pointer;font-size:12px}.tbtn:hover{color:var(--text);border-color:var(--accent)}.tbtn.active{color:var(--accent-fg);background:var(--accent);border-color:var(--accent)}.charcount{font-size:11px;color:var(--text-dim);white-space:nowrap;font-variant-numeric:tabular-nums}.charcount.warn{color:var(--warn)}.charcount.over{color:var(--danger);font-weight:600}#formatbar{flex-shrink:0;display:flex;gap:3px;align-items:center;padding:6px 12px;border-bottom:1px solid var(--border);overflow:visible;scrollbar-width:none}#formatbar::-webkit-scrollbar{display:none}.fmt-btn{position:relative;flex-shrink:0;min-width:30px;height:28px;padding:0 8px;background:transparent;border:1px solid transparent;border-radius:6px;color:var(--text-dim);font-size:13px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.fmt-btn:hover{background:var(--bg-alt);color:var(--text)}.fmt-btn:active{background:var(--accent);color:var(--accent-fg)}.fmt-bold{font-weight:700}.fmt-italic{font-style:italic}.fmt-btn:after{content:attr(data-tip);position:absolute;top:calc(100% + 7px);left:50%;transform:translate(-50%);background:var(--text);color:var(--bg);font-size:11px;line-height:1;padding:5px 8px;border-radius:5px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s ease .15s;box-shadow:0 4px 12px #00000040;z-index:80}.fmt-btn:hover:after{opacity:1}.fmt-group{position:relative;display:inline-flex}.fmt-trigger .caret{font-size:9px;opacity:.55;margin-left:2px}.fmt-menu{position:absolute;top:calc(100% + 5px);left:0;z-index:80;min-width:150px;padding:5px;background:var(--bg-sidebar);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px #00000059;display:flex;flex-direction:column;gap:2px}.fmt-menu-item{text-align:left;background:transparent;border:none;border-radius:5px;padding:7px 10px;color:var(--text);font-size:13px;cursor:pointer;white-space:nowrap}.fmt-menu-item:hover{background:var(--bg-alt)}#editor-wrap{flex:1;min-height:0;overflow-y:auto;background:var(--bg)}#editor{outline:none;color:var(--text);width:100%;max-width:820px;margin:0 auto;padding:28px 32px;font-size:16px;line-height:1.75}#pages{padding:28px 0 36px}.page{color:var(--text);width:100%;max-width:794px;height:1123px;overflow:hidden;margin:0 auto 26px;background:var(--paper);padding:24px 48px 44px;border-radius:2px;box-shadow:0 1px 2px var(--paper-shadow),0 10px 30px var(--paper-shadow)}.page.measure{position:absolute;left:-10000px;top:0;height:auto;overflow:visible;visibility:hidden;margin:0;box-shadow:none}#editor .ln{padding:1px 6px;margin:0 -6px;border-radius:5px;white-space:pre-wrap;overflow-wrap:anywhere;min-height:1.2em}#editor .ln.active{background:var(--line-active)}#editor .r-h1{font-size:1.9em;font-weight:700;line-height:1.3;margin-top:.2em}#editor .r-h2{font-size:1.5em;font-weight:700}#editor .r-h3{font-size:1.22em;font-weight:700}#editor .r-h4,#editor .r-h5,#editor .r-h6{font-weight:700}#editor .r-quote{border-left:3px solid var(--accent);color:var(--text-dim);padding-left:14px!important}#editor .r-hr .hr{display:block;border-top:1px solid var(--border)}#editor .r-li .bullet{color:var(--accent);display:inline-block;min-width:1em}#editor .r-code{font-family:ui-monospace,Menlo,monospace;font-size:.9em;background:var(--bg-alt)}#editor .r-code.r-fencemark{color:var(--text-dim)}#editor strong{font-weight:700}#editor em{font-style:italic}#editor del{text-decoration:line-through;color:var(--text-dim)}#editor a{color:var(--link);text-decoration:none}#editor code{background:var(--bg-alt);padding:2px 6px;border-radius:4px;font-family:ui-monospace,Menlo,monospace;font-size:.88em}#editor .wikilink{color:var(--accent);cursor:pointer}#editor .wikilink:hover{text-decoration:underline}#editor .wikilink.missing{color:var(--text-dim);border-bottom:1px dashed var(--text-dim)}#editor img{max-width:100%}.task-check{cursor:pointer}.page{line-height:1.7}.page h1,.page h2,.page h3{line-height:1.3;margin:1.2em 0 .5em}.page>:first-child{margin-top:0}.page h1{font-size:1.9em;border-bottom:1px solid var(--border);padding-bottom:.25em}.page h2{font-size:1.5em}.page h3{font-size:1.2em}.page p{margin:.6em 0}.page a{color:var(--link);text-decoration:none}.page a:hover{text-decoration:underline}.page .wikilink{color:var(--accent);cursor:pointer;text-decoration:none}.page .wikilink.missing{color:var(--text-dim);border-bottom:1px dashed var(--text-dim)}.page code{background:var(--bg-alt);padding:2px 6px;border-radius:4px;font-family:ui-monospace,Menlo,monospace;font-size:.88em}.page pre{background:var(--bg-alt);padding:14px 16px;border-radius:8px;overflow-x:auto;margin:0}.page pre code{background:none;padding:0}.page .codeblock{position:relative;margin:.8em 0}.page .codeblock pre{padding-top:30px}.page .codeblock .code-lang{position:absolute;top:7px;left:12px;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-dim)}.page .codeblock .copy-code{position:absolute;top:5px;right:6px;background:var(--bg);border:1px solid var(--border);color:var(--text-dim);font-size:11px;padding:3px 8px;border-radius:5px;cursor:pointer}.page .codeblock .copy-code:hover{color:var(--text);border-color:var(--accent)}.page .hljs{background:var(--bg-alt);color:var(--text);padding:0}.page .hljs-keyword,.page .hljs-built_in,.page .hljs-literal,.page .hljs-type,.page .hljs-selector-tag{color:var(--syn-key)}.page .hljs-string,.page .hljs-meta .hljs-string,.page .hljs-regexp{color:var(--syn-str)}.page .hljs-comment,.page .hljs-quote{color:var(--syn-com);font-style:italic}.page .hljs-number,.page .hljs-symbol,.page .hljs-bullet{color:var(--syn-num)}.page .hljs-title,.page .hljs-section,.page .hljs-name,.page .hljs-selector-id,.page .hljs-selector-class{color:var(--syn-fn)}.page .hljs-attr,.page .hljs-attribute,.page .hljs-variable,.page .hljs-template-variable,.page .hljs-params{color:var(--syn-attr)}.page blockquote{border-left:3px solid var(--accent);margin:.8em 0;padding:2px 0 2px 16px;color:var(--text-dim)}.page ul,.page ol{padding-left:1.6em;margin:.5em 0}.page li{margin:.2em 0}.page hr{border:none;border-top:1px solid var(--border);margin:1.4em 0}.page input[type=checkbox]{margin-right:6px;cursor:pointer}.page li.task{list-style:none;margin-left:-1.3em}.page table{border-collapse:collapse;margin:.8em 0}.page th,.page td{border:1px solid var(--border);padding:6px 12px}#empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--text-dim);flex-direction:column;gap:10px}#empty .big{font-size:40px}.auth-screen{height:100vh;display:flex;align-items:center;justify-content:center}.auth-card{width:340px;max-width:90vw;background:var(--bg-sidebar);border:1px solid var(--border);border-radius:14px;padding:28px}.auth-card h1{margin:0 0 6px;font-size:22px;display:flex;align-items:center;gap:8px}.auth-sub{color:var(--text-dim);font-size:14px;margin:0 0 16px}.auth-sent{color:var(--text-dim);font-size:14px;line-height:1.6}.auth-card input{width:100%;padding:10px 12px;background:var(--bg-alt);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:14px;outline:none;margin-bottom:10px}.auth-card input:focus{border-color:var(--accent)}.auth-card button{width:100%;padding:10px;background:var(--accent);color:var(--accent-fg);border:none;border-radius:8px;font-size:14px;cursor:pointer}.auth-card button:disabled{opacity:.6;cursor:default}.auth-error{color:var(--danger);font-size:13px;margin:10px 0 0}.shared-badge{font-size:12px;color:var(--text-dim);white-space:nowrap}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px}.modal{width:430px;max-width:100%;background:var(--bg-sidebar);border:1px solid var(--border);border-radius:12px;padding:22px;max-height:90vh;overflow-y:auto}.modal h2{margin:0 0 18px;font-size:18px}.modal-section{margin-bottom:20px}.modal-section h3{margin:0 0 4px;font-size:14px}.modal-sub{margin:0 0 10px;font-size:13px;color:var(--text-dim);line-height:1.5}.link-row{display:flex;gap:8px;margin-top:10px}.link-row input{flex:1;min-width:0;padding:8px 10px;background:var(--bg-alt);border:1px solid var(--border);border-radius:7px;color:var(--text);font-size:13px;outline:none}.link-row input:focus{border-color:var(--accent)}.modal-err{color:var(--danger);font-size:13px;margin:8px 0 0}.share-list{list-style:none;padding:0;margin:12px 0 0;font-size:13px}.share-list li{display:flex;justify-content:space-between;padding:7px 0;border-top:1px solid var(--border)}.share-list a{color:var(--text-dim);cursor:pointer}.share-list a:hover{color:var(--danger)}.modal-done{margin-top:4px}#public-view{min-height:100dvh;background:var(--bg)}.public-head{padding:14px 20px;border-bottom:1px solid var(--border);font-weight:600;font-size:15px;display:flex;align-items:center;gap:7px}.public-msg{padding:64px 20px;text-align:center;color:var(--text-dim)}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:var(--border);border-radius:5px}.hamburger{display:none;background:transparent;border:none;color:var(--text);font-size:20px;line-height:1;cursor:pointer;padding:4px 6px;border-radius:6px}.hamburger:hover{background:var(--bg-alt)}.head-btns{display:flex;align-items:center;gap:6px}.close-btn{display:none;background:transparent;border:none;color:var(--text-dim);font-size:16px;cursor:pointer;padding:4px 6px}.close-btn:hover{color:var(--text)}.backdrop{display:none}@media (max-width: 768px){#sidebar{position:fixed;top:0;left:0;bottom:0;z-index:50;width:82vw;max-width:320px;transform:translate(-100%);transition:transform .25s ease;box-shadow:2px 0 16px #0006}#sidebar.open{transform:translate(0)}.close-btn{display:block}#app.sidebar-open .backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#00000080}.hamburger{display:flex;align-items:center;justify-content:center}.empty-hamburger{position:absolute;top:12px;left:12px}#editor{padding:20px 16px;max-width:100%}#pages{padding:0}.page{max-width:100%;padding:22px 18px 40px;margin:0 0 14px;border-radius:0;box-shadow:none}#toolbar{padding:0 10px;gap:8px}.charcount{display:none}#note-title{font-size:16px}.kebab{display:flex;align-items:center;justify-content:center}.toolbar-actions{display:none;position:absolute;top:46px;right:8px;z-index:60;flex-direction:column;align-items:stretch;gap:4px;min-width:150px;padding:6px;background:var(--bg-sidebar);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px #00000073}.toolbar-actions.open{display:flex}.toolbar-actions .tbtn{width:100%;text-align:left;border:none;background:transparent;padding:8px 10px;font-size:14px;border-radius:6px}.toolbar-actions .tbtn:hover{background:var(--bg-alt)}.toolbar-actions .tbtn.active{background:var(--accent);color:var(--accent-fg)}}
