@font-face{font-family:Satoshi;src:url('/fonts/Satoshi-Variable.ttf') format('truetype');font-display:swap}
:root{color-scheme:light;--paper:hsl(var(--background));--panel:hsl(var(--card));--ink:hsl(var(--foreground));--canvas-muted:hsl(var(--muted-foreground));--line:hsl(var(--border));--grid:hsl(var(--border)/.7);--canvas-accent:hsl(var(--primary));--soft:hsl(var(--secondary));--shadow:0 6px 24px hsl(var(--foreground)/.06);--side:260px;--sidebar-gutter:24px;--canvas-header-height:72px;--shell-bottom-gap:20px}
:root.dark{color-scheme:dark;--shadow:0 8px 28px #0003}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Satoshi,'PingFang SC','Microsoft YaHei',sans-serif;color:var(--ink);background:var(--paper);font-size:14px}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{touch-action:manipulation}button{color:inherit;cursor:pointer}a{color:inherit;text-decoration:none;transition:color .16s}a:hover{color:var(--canvas-accent)}button{border:0;background:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--canvas-accent);outline-offset:4px;border-radius:6px}[hidden]{display:none!important}.canvas-app{height:100dvh;display:flex}.sidebar{flex:0 0 var(--side);padding:0 var(--sidebar-gutter);background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:5;overflow:hidden}.brand{display:flex;align-items:center;gap:11px;font-size:17px;font-weight:700}.brand-mark{display:block;width:39px;height:39px;border-radius:12px;object-fit:contain;flex-shrink:0}.brand-caption{display:block;font-size:8px;letter-spacing:1.4px;color:var(--canvas-muted);margin-top:3px;font-weight:600}.sidebar-intro{margin:22px 0 16px}.eyebrow{font-size:10px;color:var(--canvas-muted);letter-spacing:1px}.sidebar-intro h1{font-size:32px;line-height:1.3;font-weight:600;letter-spacing:1px;margin:0}.sidebar-intro p{font-size:11px;color:var(--canvas-muted);margin:8px 0;letter-spacing:.3px}.search-box{display:flex;align-items:center;height:40px;flex-shrink:0;gap:8px;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:0 10px}.search-box svg{width:15px;height:15px;fill:none;stroke:var(--canvas-muted);stroke-width:1.7;flex-shrink:0}.search-box input{width:100%;min-width:0;background:none;border:0;outline:none!important;color:var(--ink);font-size:11px}.search-box input::placeholder{color:var(--canvas-muted)}.search-box kbd{font:11px Satoshi;color:var(--canvas-muted);border:1px solid var(--line);border-radius:3px;padding:1px 4px}.topic-nav{display:flex;flex-direction:column;gap:5px;margin-top:24px}.nav-caption{font-size:10px;color:var(--canvas-muted);letter-spacing:1px;margin-bottom:10px}.topic-button{display:flex;align-items:center;text-align:left;gap:10px;padding:11px 10px;border-radius:8px;font-size:12px;transition:background .15s;min-width:0}.topic-button>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topic-button:hover{background:var(--paper)}.topic-button.active{background:var(--soft);color:var(--canvas-accent);font-weight:600}.topic-icon{font-size:16px;line-height:10px;width:8px}.topic-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--topic-color,var(--canvas-accent));flex-shrink:0}.topic-count{margin-left:auto;color:var(--canvas-muted);font-size:10px;font-weight:500}.sidebar-bottom{margin-top:auto;padding:20px 0 var(--shell-bottom-gap)}.site-links{display:flex;flex-direction:column;gap:15px;font-size:11px;color:var(--canvas-muted)}.site-links a{display:flex;justify-content:space-between}.site-links a span{font-size:13px}.sidebar-footer{border-top:1px solid var(--line);margin-top:24px;padding-top:17px;display:flex;align-items:center;gap:7px;font-size:9px;color:var(--canvas-muted)}.online-dot,.help-dot,.workspace-dot{width:5px;height:5px;background:var(--canvas-accent);border-radius:50%;display:inline-block;flex-shrink:0}#theme-toggle{margin-left:auto;font-size:20px;padding:2px 4px;line-height:20px}.registration{font-size:9px;line-height:16px;color:var(--canvas-muted);display:block;margin-top:10px}.canvas-main{flex:1;min-width:0;position:relative;display:flex;flex-direction:column}.canvas-topbar{height:var(--canvas-header-height);flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid var(--line);background:var(--paper);z-index:4}.canvas-topbar>div:first-child{display:flex;align-items:center;gap:12px}.canvas-topbar strong{font-weight:600;font-size:12px;line-height:20px;letter-spacing:.5px}.canvas-count{font-size:10px;color:var(--canvas-muted)}.topbar-divider{color:var(--line)}.view-switch{display:flex;padding:3px;border:1px solid var(--line);background:var(--panel);border-radius:8px}.view-switch button{font-size:10px;padding:6px 12px;border-radius:5px;color:var(--canvas-muted)}.view-switch button.selected{background:var(--soft);color:var(--ink)}.canvas-viewport{position:relative;flex:1;overflow:hidden;outline:none;touch-action:none;cursor:grab;background-image:var(--knowledge-dot-pattern);background-size:var(--knowledge-dot-spacing) var(--knowledge-dot-spacing)}.canvas-viewport.panning{cursor:grabbing}.canvas-world{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0;will-change:transform}.connections{position:absolute;overflow:visible;left:0;top:0;width:1px;height:1px;pointer-events:none}.connections path{fill:none;stroke-width:1.6;opacity:.45}.connections circle{stroke:var(--paper);stroke-width:3}.canvas-node{position:absolute;cursor:default;transition:box-shadow .2s,border-color .2s;background:var(--panel);box-shadow:var(--shadow);border:1px solid var(--line);border-radius:14px}.canvas-node.dragging{cursor:grabbing;z-index:3;box-shadow:0 14px 35px hsl(var(--foreground)/.15)}.hub{width:240px;height:104px;padding:20px;display:flex;align-items:center;background:hsl(var(--primary));border-color:hsl(var(--primary));color:hsl(var(--primary-foreground));box-shadow:0 10px 30px hsl(var(--primary)/.15)}.hub-identity{display:flex;align-items:center;gap:14px}.hub-identity img{width:40px;height:40px;object-fit:cover;border-radius:50%;border:2px solid hsl(var(--primary-foreground)/.3)}.hub h2{margin:0;font-size:22px;line-height:1.3;font-weight:600;letter-spacing:.3px;white-space:nowrap}.hub a:hover{color:hsl(var(--primary-foreground)/.8)}.hub .drag-handle{position:absolute;top:12px;right:12px;color:hsl(var(--primary-foreground)/.8);padding:0}.post-node{width:300px;min-height:178px;padding:17px 20px 16px;border-top:3px solid var(--topic-color)}.post-node:hover{border-color:var(--topic-color);box-shadow:0 9px 25px hsl(var(--foreground)/.09)}.post-meta{display:flex;align-items:center;gap:8px;font-size:9px;color:var(--canvas-muted);margin-bottom:13px}.post-kind{font-weight:600;color:var(--topic-color)}.post-meta time{margin-left:auto;letter-spacing:.3px}.drag-handle{font-size:19px;color:var(--canvas-muted);line-height:16px;cursor:grab;padding:0 0 0 6px;touch-action:none}.drag-handle:active{cursor:grabbing}.post-title{display:flex;gap:12px;align-items:flex-start}.post-title h3{font-size:17px;line-height:1.65;margin:0;letter-spacing:.1px;font-weight:600;flex:1}.open-arrow{font-size:18px;color:var(--topic-color);line-height:26px;flex-shrink:0}.post-description{font-size:11px;line-height:1.75;color:var(--canvas-muted);margin:10px 0 14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.post-tags{display:flex;gap:9px;flex-wrap:wrap;font-size:9px;color:var(--topic-color)}.cluster-label{position:absolute;display:flex;gap:9px;align-items:center;white-space:nowrap}.cluster-label h2{font-size:13px;color:var(--topic-color);font-weight:600;letter-spacing:1px;margin:0}.cluster-label>span:last-child{font-size:10px;color:var(--canvas-muted);margin-left:6px}.canvas-bottom{position:absolute;bottom:var(--shell-bottom-gap);left:30px;right:30px;display:flex;justify-content:space-between;align-items:end;gap:16px;pointer-events:none;z-index:4}.canvas-help{font-size:10px;line-height:16px;color:var(--canvas-muted);display:flex;align-items:center;gap:8px;min-width:0;margin:0;background:var(--paper);padding:0 8px;border-radius:6px}.canvas-help-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.canvas-controls{flex-shrink:0}.canvas-controls{pointer-events:auto;display:flex;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:5px;box-shadow:0 4px 16px hsl(var(--foreground)/.04)}.canvas-controls button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:20px;border-radius:6px;color:var(--ink)}.canvas-controls button:hover{background:var(--soft)}#reset-layout{font-size:22px}.canvas-controls output{min-width:46px;text-align:center;font-size:10px;color:var(--canvas-muted);font-variant-numeric:tabular-nums}.canvas-controls svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5}.control-divider{height:15px;width:1px;background:var(--line);margin:0 4px}.empty-state{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;pointer-events:none}.empty-state>span{font-size:50px;color:var(--canvas-muted)}.empty-state h2{font-size:19px;font-weight:500;margin:12px}.empty-state p{font-size:12px;color:var(--canvas-muted)}.empty-state button{background:var(--ink);color:var(--panel);border-radius:8px;padding:10px 16px;margin:10px;pointer-events:auto;font-size:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.canvas-main.list-mode .canvas-viewport{overflow:auto;touch-action:pan-y;cursor:default;padding:36px 35px 110px}.list-mode .canvas-world{transform:none!important;position:static;width:auto;height:auto;will-change:auto}.list-mode .connections,.list-mode .hub,.list-mode .canvas-help,.list-mode .canvas-controls{display:none}.list-mode .topic-cluster{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px;margin-bottom:34px}.list-mode .cluster-label{position:static;grid-column:1/-1;margin-bottom:4px}.list-mode .post-node{position:relative;left:auto!important;top:auto!important;width:100%;min-height:184px}.list-mode .drag-handle{display:none}.list-mode .empty-state{min-height:350px;position:relative}.list-mode .canvas-viewport{background-image:none}
@media(min-width:1600px){:root{--side:285px;--sidebar-gutter:30px}.sidebar-intro h1{font-size:36px}}
@media(max-width:1050px){:root{--side:225px;--sidebar-gutter:18px}.sidebar-intro h1{font-size:29px}.canvas-topbar{padding:0 22px}.canvas-help{font-size:9px}}
@media(max-width:700px){html,body{overflow:hidden}.canvas-app{flex-direction:column}.sidebar{flex:none;width:100%;padding:15px 18px 11px;border-right:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:12px;overflow:visible}.brand{font-size:15px;gap:9px}.brand-mark{width:32px;height:32px;font-size:25px;border-radius:9px}.brand-caption{font-size:7px}.sidebar-intro,.sidebar-bottom,.nav-caption,.search-box kbd,.canvas-help{display:none}.sidebar-header,.sidebar-content{display:contents}.search-box{height:34px;max-width:220px;justify-self:end}.search-box input{font-size:10px}.topic-nav{grid-column:1/-1;flex-direction:row;overflow-x:auto;margin:0;gap:6px;padding:0 0 2px;scrollbar-width:none}.topic-button{flex-shrink:0;padding:8px 10px;font-size:10px;background:var(--paper);gap:7px;max-width:180px}.topic-button .topic-count{font-size:9px;margin-left:2px}.canvas-topbar{height:52px;padding:0 18px}.canvas-topbar>div:first-child{gap:8px}.canvas-topbar strong{font-size:11px}.canvas-count{font-size:9px}.view-switch button{padding:5px 9px;font-size:10px}.topbar-divider{display:none}.canvas-bottom{bottom:18px;left:18px;right:18px;justify-content:end}.canvas-controls button{width:36px;height:36px}.list-mode .canvas-viewport{padding:24px 18px 30px}.list-mode .topic-cluster{grid-template-columns:1fr}.list-mode .post-title h3{font-size:17px}.empty-state p{font-size:11px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.sidebar-header,.sidebar-intro,.topic-nav,.sidebar-bottom{flex-shrink:0}

@media(min-width:701px) and (max-height:760px){.sidebar-intro h1{font-size:27px}.topic-nav{margin-top:20px}.topic-button{padding:9px 10px}.sidebar-bottom{padding-top:16px}.site-links{gap:12px}.sidebar-footer{margin-top:18px;padding-top:12px}}
.post-title h3{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

.topic-node{width:220px;height:112px;padding:15px 18px;border-color:color-mix(in srgb,var(--topic-color) 42%,var(--line));background:color-mix(in srgb,var(--topic-color) 6%,var(--panel))}
.topic-node-meta{display:flex;align-items:center;gap:7px;font-size:9px;color:var(--canvas-muted);line-height:16px}.topic-node-meta .drag-handle{margin-left:auto}.topic-node h2{font-size:16px;line-height:23px;margin:8px 0 6px;font-weight:600;color:var(--topic-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topic-node-bottom{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:var(--canvas-muted)}.topic-focus{font-size:10px;color:var(--topic-color);padding:2px}.parent-note{border-top:1px solid var(--line);padding-top:8px;margin-top:10px;font-size:9px;color:var(--canvas-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.parent-note a{color:var(--topic-color)}.context-node{border-style:dashed;opacity:.72}.context-node::after{content:'上级文章';position:absolute;right:14px;bottom:-20px;color:var(--canvas-muted);font-size:10px}.list-mode .topic-node{position:static!important;width:100%;height:auto;grid-column:1/-1;box-shadow:none;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:0 0 12px}.list-mode .topic-node h2{margin:7px 0}.list-mode .topic-node-meta>span:nth-child(2){display:none}.list-mode .topic-node-bottom{max-width:220px}.list-mode .post-node{margin-left:clamp(0px,calc((var(--node-depth) - 2) * 18px),54px);width:calc(100% - clamp(0px,calc((var(--node-depth) - 2) * 18px),54px))}

.list-mode .topic-cluster{grid-template-columns:1fr;max-width:800px;margin-left:auto;margin-right:auto}.list-mode .context-node::after{display:none}

.topic-actions{display:flex;align-items:center;gap:3px}.topic-actions button{font-size:10px;padding:4px 5px;border-radius:5px;white-space:nowrap;color:var(--topic-color)}.topic-actions button:hover{background:var(--soft)}.topic-collapse[aria-expanded=false]{background:var(--soft);font-weight:600}.topic-is-hidden{opacity:.6;border:1px dashed var(--line)}.branch-status{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;font-size:10px;color:var(--canvas-muted)}.branch-status button{padding:5px 8px;border:1px solid var(--line);border-radius:6px;color:var(--canvas-accent);white-space:nowrap}.branch-status button:hover{background:var(--soft)}.list-mode .topic-node-bottom{max-width:none;justify-content:flex-start;gap:18px}
@media(max-width:700px){.branch-status{grid-column:1/-1;margin-top:0;justify-content:flex-end}.topic-actions button{padding:6px}.branch-status button{padding:5px 10px}}

@media(max-width:700px){.canvas-topbar>div:first-child{flex-wrap:wrap;row-gap:2px;min-width:0}.canvas-topbar strong{font-size:10px}.canvas-count{font-size:8px}.view-switch{flex-shrink:0}}

/* Shared header and footer anchors keep the sidebar aligned as the viewport changes. */
@media(min-width:701px){.sidebar-header{height:var(--canvas-header-height);display:flex;align-items:center;padding-top:13px}.sidebar-content{flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;padding-bottom:16px}.brand-copy{display:block;line-height:20px}.brand-name{display:block;line-height:20px}.brand-caption{margin-top:3px;line-height:10px;white-space:nowrap}}
