:root{--bg:#fff;--fg:#2c2c2c;--muted:#787774;--border:#e4e4e2;--accent:#2e7dd1;--danger:#d44c47;--code-bg:#f5f5f4;--hover-bg:#f1f1ef;--sidebar-bg:#fbfbfa;--sidebar-width:260px;--header-height:52px;--max-width:860px}*{box-sizing:border-box}html,body,#root{height:100%}body{color:var(--fg);background:var(--bg);margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,sans-serif;line-height:1.6}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.app{flex-direction:column;min-height:100%;display:flex}.app-header{height:var(--header-height);border-bottom:1px solid var(--border);background:var(--bg);z-index:30;align-items:center;gap:1rem;padding:0 1rem;display:flex;position:sticky;top:0}.app-title{color:var(--fg);white-space:nowrap;font-size:1.05rem;font-weight:700}.app-nav{flex:1;gap:1rem;display:flex}.app-user{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;max-width:40vw;font-size:.85rem;overflow:hidden}.hamburger{cursor:pointer;color:var(--fg);background:0 0;border:none;padding:.25rem .4rem;font-size:1.3rem;line-height:1;display:none}.app-body{flex:1;min-height:0;display:flex}.app-main{min-width:0;max-width:var(--max-width);flex:1;width:100%;margin:0 auto;padding:1.75rem 1.5rem 4rem}.app-error{text-align:center;max-width:600px;margin:4rem auto;padding:0 1.5rem}.app-sidebar{width:var(--sidebar-width);border-right:1px solid var(--border);background:var(--sidebar-bg);height:calc(100vh - var(--header-height));top:var(--header-height);flex-shrink:0;position:sticky;overflow-y:auto}.sidebar{padding:.75rem .5rem 2rem}.sidebar-head{justify-content:space-between;align-items:center;padding:.25rem .5rem .5rem;display:flex}.sidebar-title{color:var(--muted);letter-spacing:.05em;font-size:.75rem;font-weight:700}.sidebar-add-root{cursor:pointer;color:var(--muted);background:0 0;border:none;border-radius:4px;padding:.1rem .35rem;font-size:1rem}.sidebar-add-root:hover{background:var(--hover-bg);color:var(--fg)}.sidebar-status{color:var(--muted);padding:.5rem .75rem;font-size:.85rem}.sidebar-status--error{color:var(--danger)}.sidebar-tree,.sidebar-tree ul{margin:0;padding:0;list-style:none}.sidebar-row{cursor:pointer;border-radius:5px;align-items:center;gap:.1rem;min-height:30px;padding-right:.35rem;display:flex}.sidebar-row:hover{background:var(--hover-bg)}.sidebar-row--current{background:#e8eef6}.sidebar-row--dragover{outline:2px solid var(--accent);outline-offset:-2px}.sidebar-twisty{cursor:pointer;color:var(--muted);background:0 0;border:none;flex-shrink:0;width:18px;padding:0;font-size:.65rem;line-height:1}.sidebar-twisty--leaf{cursor:default;opacity:.35}.sidebar-label{text-align:left;cursor:pointer;color:var(--fg);white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;flex:1;min-width:0;padding:.35rem .25rem;font-size:.9rem;overflow:hidden}.sidebar-action{cursor:pointer;color:var(--muted);opacity:0;background:0 0;border:none;border-radius:4px;flex-shrink:0;padding:.1rem .3rem;font-size:.95rem}.sidebar-row:hover .sidebar-action{opacity:1}.sidebar-action:hover{color:var(--fg);background:#dededc}.sidebar-menu-wrap{position:relative}.sidebar-menu-backdrop{z-index:40;position:fixed;inset:0}.sidebar-menu{z-index:41;background:var(--bg);border:1px solid var(--border);border-radius:6px;flex-direction:column;min-width:160px;padding:.25rem;display:flex;position:absolute;top:100%;right:0;box-shadow:0 6px 18px #0000001f}.sidebar-menu button{text-align:left;cursor:pointer;color:var(--fg);background:0 0;border:none;border-radius:4px;padding:.5rem .6rem;font-size:.88rem}.sidebar-menu button:hover{background:var(--hover-bg)}.sidebar-menu-danger{color:var(--danger)!important}.sidebar-root-drop{text-align:center;color:var(--muted);border-radius:6px;min-height:.5rem;margin-top:.5rem;padding:.5rem;font-size:.75rem}.drawer-overlay{z-index:50;background:#00000059;display:flex;position:fixed;inset:0}.app-sidebar--drawer{width:82vw;max-width:320px;height:100%;animation:.18s ease-out drawer-in;position:relative;top:0;box-shadow:4px 0 16px #0000002e}.drawer-close{cursor:pointer;color:var(--muted);z-index:1;background:0 0;border:none;font-size:1.1rem;position:absolute;top:.5rem;right:.5rem}.app-sidebar--drawer .sidebar-head{justify-content:flex-start;gap:.5rem;padding-right:2.25rem}@keyframes drawer-in{0%{transform:translate(-100%)}to{transform:translate(0)}}.btn{border:1px solid var(--border);background:var(--bg);color:var(--fg);cursor:pointer;border-radius:6px;padding:.4rem .9rem;font-size:.9rem;text-decoration:none;display:inline-block}.btn:hover{background:var(--code-bg);text-decoration:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--danger{color:var(--danger);border-color:var(--danger)}.btn--ghost{color:var(--muted);border-color:#0000}.btn--sm{padding:.2rem .6rem;font-size:.8rem}.link-button{cursor:pointer;color:var(--accent);font:inherit;background:0 0;border:none;padding:0}.link-button:hover{text-decoration:underline}.spinner{text-align:center;color:var(--muted);padding:2rem}.error-banner{border:1px solid var(--danger);color:var(--danger);background:#fdf2f1;border-radius:6px;margin:0 0 1rem;padding:.75rem 1rem}.empty,.home-lead{color:var(--muted)}.home-recent{margin-top:2rem}.home-recent h2{color:var(--muted);font-size:1rem}.article-list{margin:1rem 0 0;padding:0;list-style:none}.article-list-item{border-bottom:1px solid var(--border);padding:.75rem 0}.article-list-title{font-size:1.05rem;font-weight:600}.article-list-meta{color:var(--muted);gap:1rem;margin-top:.2rem;font-size:.85rem;display:flex}.article-page{width:100%}.article-toolbar-top{justify-content:flex-end;align-items:center;min-height:1.5rem;margin-bottom:.5rem;display:flex}.save-indicator{color:var(--muted);font-size:.8rem}.save-indicator--saved{color:#4a9d5b}.save-indicator--error{color:var(--danger)}.readonly-badge{color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:.1rem .6rem;font-size:.78rem}.page-title-input{width:100%;color:var(--fg);background:0 0;border:none;outline:none;margin-bottom:.75rem;padding:.25rem 0;font-size:2rem;font-weight:700}.page-title-input::placeholder{color:#c4c4c2}.page-title-input:disabled{color:var(--fg)}.upload-status{color:var(--muted);margin:0 0 .5rem;font-size:.85rem}.wysiwyg{position:relative}.editor-toolbar{border:1px solid var(--border);top:var(--header-height);background:var(--bg);z-index:5;border-radius:8px;flex-wrap:wrap;align-items:center;gap:.15rem;margin-bottom:.75rem;padding:.35rem .4rem;display:flex;position:sticky}.tb-btn{cursor:pointer;min-width:32px;height:32px;color:var(--fg);background:0 0;border:none;border-radius:5px;padding:0 .4rem;font-size:.9rem}.tb-btn:hover{background:var(--hover-bg)}.tb-btn--active{color:var(--accent);background:#e8eef6}.tb-sep{background:var(--border);width:1px;height:20px;margin:0 .25rem}.wysiwyg-editor .ProseMirror{outline:none;min-height:50vh;padding:.25rem 0}.wysiwyg-editor .ProseMirror:focus{outline:none}.wysiwyg-editor .ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);float:left;color:#c4c4c2;pointer-events:none;height:0}.slash-menu{z-index:20;background:var(--bg);border:1px solid var(--border);border-radius:8px;min-width:200px;max-height:280px;margin:0;padding:.25rem;list-style:none;position:absolute;overflow-y:auto;box-shadow:0 8px 24px #00000024}.slash-item{text-align:left;cursor:pointer;width:100%;color:var(--fg);background:0 0;border:none;border-radius:5px;padding:.5rem .6rem;font-size:.88rem;display:block}.slash-item--active,.slash-item:hover{background:var(--hover-bg)}.wysiwyg-content,.markdown-body{word-wrap:break-word}.wysiwyg-content h1,.markdown-body h1,.wysiwyg-content h2,.markdown-body h2,.wysiwyg-content h3,.markdown-body h3{margin-top:1.4rem;line-height:1.3}.wysiwyg-content img,.markdown-body img{border-radius:4px;max-width:100%;height:auto}.wysiwyg-content pre,.markdown-body pre{background:var(--code-bg);border-radius:6px;padding:.75rem 1rem;overflow-x:auto}.wysiwyg-content code,.markdown-body code{background:var(--code-bg);border-radius:4px;padding:.1rem .3rem;font-size:.9em}.wysiwyg-content pre code,.markdown-body pre code{background:0 0;padding:0}.wysiwyg-content blockquote,.markdown-body blockquote{border-left:3px solid var(--border);color:var(--muted);margin:1rem 0;padding-left:1rem}.wysiwyg-content table,.markdown-body table{border-collapse:collapse;max-width:100%;display:block;overflow-x:auto}.wysiwyg-content th,.markdown-body th,.wysiwyg-content td,.markdown-body td{border:1px solid var(--border);min-width:3rem;padding:.4rem .6rem}.wysiwyg-content ul[data-type=taskList]{padding-left:.25rem;list-style:none}.markdown-body ul:has(>li.task-list-item){padding-left:.25rem;list-style:none}.wysiwyg-content ul[data-type=taskList] li,.markdown-body li.task-list-item{align-items:flex-start;gap:.4rem;display:flex}.wysiwyg-content ul[data-type=taskList] li>label,.markdown-body li.task-list-item>input[type=checkbox]{flex:none;margin-top:.25em}.wysiwyg-content ul[data-type=taskList] li>div{flex:auto;min-width:0}.wysiwyg-content ul[data-type=taskList] li>div>p{margin:0}.user-add{flex-wrap:wrap;gap:.5rem;margin:1.5rem 0;display:flex}.user-add input,.user-add select,.user-table select{border:1px solid var(--border);border-radius:6px;padding:.4rem .6rem}.user-add input{flex:1;min-width:12rem}.user-table-wrap{overflow-x:auto}.user-table{border-collapse:collapse;width:100%}.user-table th,.user-table td{text-align:left;border-bottom:1px solid var(--border);white-space:nowrap;padding:.6rem .5rem;font-size:.9rem}.user-table th{color:var(--muted);font-weight:600}@media (width<=768px){.hamburger{display:block}.app-sidebar--desktop{display:none}.app-main{padding:1.25rem 1rem 6rem}.app-user{display:none}.page-title-input{font-size:1.6rem}.editor-toolbar{z-index:45;padding:.4rem .5rem;padding-bottom:calc(.4rem + env(safe-area-inset-bottom,0px));border-bottom:none;border-left:none;border-right:none;border-radius:0;flex-wrap:nowrap;margin:0;position:fixed;inset:auto 0 0;overflow-x:auto;box-shadow:0 -2px 10px #00000014}.tb-btn{min-width:38px;height:38px}}