body[data-page="canvas"]{overflow:hidden;background:var(--canvas)}
.canvas-app{margin:0;padding:0;max-width:none;height:100dvh;display:flex;flex-direction:column;position:relative}
.canvas-header{display:flex;align-items:center;gap:30px;min-height:76px;padding:var(--space-3-half) 26px;border-bottom:1px solid var(--border);background:var(--surface);z-index:5;flex-shrink:0}
.canvas-header .brand{font-size:26px}.canvas-document{font-size:var(--type-body-size);font-weight:var(--font-weight-semibold)}.canvas-document .pill{margin-left:var(--space-2)}.canvas-header-actions{display:flex;gap:var(--space-3-half);align-items:center;margin-left:auto}.canvas-header-actions .text-link{white-space:nowrap}
.canvas-toolbar{display:flex;align-items:center;gap:var(--space-5);padding:var(--space-3) var(--space-6);border-bottom:1px solid var(--border);background:var(--canvas);z-index:4;flex-shrink:0}.canvas-tools,.zoom-tools{display:flex;align-items:center;gap:5px}.zoom-tools{margin-left:auto}.tool-button{border:1px solid transparent;background:transparent;border-radius:var(--radius-card);padding:var(--space-2) var(--space-2-half);font:var(--type-label-weight) var(--type-label-size)/var(--type-label-line) var(--font-sans);white-space:nowrap}.tool-button:hover{background:#e7eae2}.tool-button.active{background:var(--ink);color:var(--color-white)}.tool-button .ui-icon{margin:0 5px 0 0}.zoom-tools output{font-size:var(--font-size-xs);min-width:42px;text-align:center}#canvas-selection-status{font-size:var(--font-size-xs);color:var(--muted)}
.canvas-viewport{position:relative;flex:1;min-height:0;overflow:hidden;background-color:#efeee8;background-image:radial-gradient(#c2c9bd .8px,transparent .8px);background-size:22px 22px;touch-action:none;outline:none}.canvas-viewport:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}.canvas-viewport[data-mode="pan"]{cursor:grab}.canvas-viewport[data-mode="connect"]{cursor:crosshair}#canvas-world{position:absolute;inset:0 auto auto 0;width:1px;height:1px;transform-origin:0 0}#canvas-edges{position:absolute;left:-10000px;top:-10000px;width:20000px;height:20000px;overflow:visible;pointer-events:none}#canvas-edges .edge-hit{pointer-events:stroke;cursor:pointer}#canvas-edge-labels{position:absolute;inset:0;pointer-events:none}.canvas-edge-label{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;pointer-events:auto;background:var(--logic-soft);color:var(--logic);border:1px solid #b7cec1;border-radius:var(--radius-badge);font:500 12px/18px var(--font-sans);padding:var(--space-1-half) var(--space-2-half);box-shadow:0 2px 8px #263a2510}.canvas-edge-label.selected{background:var(--focus);color:var(--color-white);border-color:var(--focus)}
.canvas-app #workspace-nodes{position:absolute;left:0;top:0;display:block;padding:0;overflow:visible;max-height:none}.canvas-app .workspace-node{position:absolute;width:240px;padding:0;overflow:hidden;border-radius:var(--radius-large);box-shadow:0 8px 22px #263a2515;touch-action:none;user-select:none;cursor:grab;text-align:left;border:1px solid #cbd2c6;background:var(--color-white)}.canvas-app .workspace-node:active{cursor:grabbing}.canvas-app .workspace-node.selected{border-color:var(--focus);box-shadow:0 0 0 2px var(--focus),0 8px 22px #263a2515}.canvas-app .workspace-node strong{font:600 16px/24px var(--font-sans);padding:var(--space-3-half) var(--space-4) 0}.canvas-app .workspace-node p{padding:0 var(--space-4);margin:var(--space-2) 0;font:400 14px/22px var(--font-sans);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.canvas-app .workspace-node small{display:block;padding:var(--space-1) var(--space-4) var(--space-3-half);color:var(--muted);font:400 12px/18px var(--font-sans)}.canvas-app .workspace-node img{height:140px;max-height:none;object-fit:contain;border-radius:0;margin:0;pointer-events:none}.canvas-placeholder{height:140px;display:grid;place-items:center;position:relative;background:linear-gradient(135deg,#dce5d3,#b9cbb4);overflow:hidden}.canvas-placeholder svg{width:100%;height:100%}.canvas-placeholder small{position:absolute;bottom:0;left:0;padding:var(--space-1) 9px!important;font-size:10px!important}.canvas-bottom-note{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);padding:var(--space-2) var(--space-3-half);background:#ffffffde;border:1px solid #dbe1d5;border-radius:var(--radius-badge);font-size:var(--font-size-xs);color:var(--muted);white-space:nowrap;pointer-events:none}
.canvas-statusbar{margin:0;padding:var(--space-1-half) var(--space-5-half);min-height:32px;font-size:var(--font-size-xs);flex-shrink:0;background:var(--color-white);border-top:1px solid var(--border)}.canvas-statusbar #storage-status{margin:0;font-size:var(--font-size-xs)}
.canvas-inspector{position:absolute;right:0;top:136px;bottom:32px;width:390px;max-width:100%;z-index:6;background:var(--surface);box-shadow:-8px 0 30px #263a2512;border-left:1px solid var(--border);display:flex;flex-direction:column}.inspector-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-5);border-bottom:1px solid var(--border);flex-shrink:0}.inspector-panel{padding:var(--space-5);overflow:auto;min-height:0;flex:1}.inspector-panel .section{padding:0;border:0}.inspector-panel .section-heading{margin-bottom:var(--space-5)}.inspector-panel .section-heading h2{font-size:var(--font-size-lead);line-height:26px}.inspector-panel .section-heading>p,.inspector-panel .section-heading .eyebrow{display:none}.inspector-panel .node-editor{border:0;padding:0}.inspector-panel .relationship-panel{display:block;border:0}.inspector-panel .relation-picker,.inspector-panel .relation-detail{padding:var(--space-3) 0}.inspector-panel .relation-detail{border:0;background:transparent}.inspector-panel .link-summary{padding:var(--space-2-half);gap:var(--space-2)}.inspector-panel .link-summary strong{font-size:var(--font-size-ui)}.inspector-panel .link-summary>.pill{display:none}.inspector-panel .workspace-toolbar{display:grid;grid-template-columns:1fr}.inspector-panel .workspace-toolbar input{max-width:100%}.inspector-panel .workspace-toolbar>*{width:100%}.inspector-panel .workspace-link-form{display:block}.inspector-panel .workspace-link-form>span{display:none}.inspector-panel #connect-from-node{margin-top:15px;width:100%}.canvas-inspector.writing-open{width:min(820px,64vw)}.writing-open .writing-workbench{grid-template-columns:minmax(190px,.7fr) minmax(0,1.3fr)}.writing-open .writing-flow{display:none}.writing-open .writing-principles{display:none}.writing-open .evidence-panel{grid-template-columns:1fr}.writing-open .writing-materials,.writing-open .writing-controls,.writing-open .draft-paper{padding:var(--space-4-half)}.writing-open .writing-node-pair{flex-wrap:wrap}.writing-open .writing-node-pair>div{min-width:140px}.canvas-viewport.drag-over{box-shadow:inset 0 0 0 4px var(--focus)}
@media(max-width:1000px){.canvas-document{display:none}.canvas-header{padding:var(--space-2-half) var(--space-4);gap:15px}.canvas-header-actions{gap:var(--space-2-half)}.canvas-toolbar{padding:var(--space-2) var(--space-3);gap:var(--space-2);flex-wrap:wrap}.canvas-toolbar #canvas-selection-status{display:none}.canvas-inspector{top:128px}.canvas-inspector.writing-open{width:min(760px,85vw)}}
@media(max-width:650px){.canvas-header{flex-wrap:wrap;min-height:110px;gap:var(--space-2)}.canvas-header .brand{font-size:23px}.canvas-header-actions{display:contents}.canvas-header-actions .primary-button{margin-left:auto}.canvas-header-actions .text-link{font-size:var(--font-size-xs)}.canvas-toolbar{min-height:90px}.canvas-tools{width:100%;justify-content:space-between}.zoom-tools{margin:auto}.canvas-bottom-note{max-width:94%;white-space:normal;text-align:center;bottom:10px;font-size:11px}.canvas-inspector,.canvas-inspector.writing-open{top:200px;bottom:32px;width:100%;max-height:65dvh}.writing-open .writing-workbench{grid-template-columns:1fr}.canvas-statusbar{padding:var(--space-1-half) var(--space-2-half)}.canvas-statusbar #canvas-count{display:none}.canvas-header .text-link{padding:var(--space-half)}.canvas-toolbar .tool-button{padding:var(--space-1-half) var(--space-2)}}
#canvas-edge-labels{z-index:2}#workspace-nodes{z-index:1}.canvas-header-actions .primary-button .ui-icon{margin-right:5px}
.canvas-delete-tools{display:flex;align-items:center;gap:var(--space-1)}.canvas-delete-tools .ui-icon{margin:0 5px 0 0}#canvas-delete:not(:disabled){color:#9c3631}.canvas-toolbar{flex-wrap:wrap}#canvas-selection-status{flex:1;min-width:100px}body[data-page="canvas"] .canvas-inspector{top:var(--canvas-panel-top,136px)}@media(max-width:650px){.canvas-delete-tools{margin:auto}.canvas-tools{flex-wrap:wrap}.canvas-toolbar{gap:3px}.canvas-inspector,.canvas-inspector.writing-open{top:var(--canvas-panel-top,236px)}}
.canvas-viewport,.canvas-viewport *{-webkit-user-select:none;user-select:none}

.canvas-app .workspace-node.image-drop-target{outline:3px dashed var(--focus);outline-offset:5px}.node-editor #node-preview{width:100%;max-height:240px;object-fit:contain;border-radius:var(--radius-panel);margin-bottom:var(--space-4)}

#relationship-panel .section-heading{margin-bottom:var(--space-4)}#relationship-panel .section-heading h2{font-size:var(--type-section-size)}#relationship-panel .relation-top,#relationship-panel .opinion-summary{display:none}#relationship-panel .proposal-form{margin:0 0 var(--space-6)}#relationship-panel .relation-picker{display:flex;flex-direction:column}#relationship-panel .proposal-form{order:-1}#relationship-panel .link-summary{margin-bottom:var(--space-4)}

#relationship-panel .section-heading,#relationship-panel .relation-picker>.component-note{display:none}#relationship-panel #proposal-list{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}#relationship-panel .proposal-card{flex:1 1 120px;width:auto;gap:var(--space-2);padding:var(--space-3)}#relationship-panel .proposal-excerpt,#relationship-panel .proposal-counts{display:none}#relationship-panel .relation-detail{margin-top:var(--space-4);border-top:1px solid var(--border)}

#writing-panel .draft-paper,#writing-panel .evidence-panel,#writing-panel .writing-flow,#writing-panel .writing-principles,#writing-panel .writing-proposal input{display:none}#writing-panel .writing-editor{display:block}#writing-panel .writing-controls{border-bottom:0}#writing-panel .writing-config-row{display:flex;flex-direction:column;align-items:stretch;gap:var(--space-4)}.writing-guide-settings>label{display:block;margin:var(--space-4) 0 var(--space-2)}.writing-guide-settings input,.writing-guide-settings select,.writing-guide-settings textarea{width:100%;padding:var(--space-2-half);border:1px solid var(--border);border-radius:var(--radius-card);font:inherit;background:var(--surface);color:var(--ink)}.guide-rules{margin:var(--space-6) 0 0;padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-panel)}.guide-rules label{display:flex;align-items:flex-start;gap:var(--space-2);margin:var(--space-3) 0}.guide-rules input{width:auto;flex-shrink:0;margin-top:var(--space-1)}.writing-guide-output{padding:var(--space-4);border-top:1px solid var(--border)}.guide-output-actions{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-4)}#guide-preview{width:100%;font-size:var(--type-body-size);line-height:var(--type-body-line)}

.canvas-app #canvas-inspector.floating-editor{left:var(--editor-left,24px);top:var(--editor-top,150px);right:auto;bottom:auto;width:var(--editor-width,370px);height:auto;max-height:var(--editor-max-height,620px);border:1px solid var(--border);border-radius:var(--radius-large);box-shadow:0 12px 40px #20252226;overflow:hidden;z-index:8}.floating-editor .inspector-header{padding:var(--space-3) var(--space-4);background:var(--surface)}.floating-editor .inspector-panel{flex:0 1 auto;padding:var(--space-4);overscroll-behavior:contain}.floating-editor #node-preview{max-height:110px;margin-bottom:var(--space-2)}.floating-editor #node-text{min-height:88px}.editor-tether{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:7;overflow:hidden}
.canvas-app{overflow:hidden}.canvas-app #canvas-inspector.floating-editor{max-width:calc(100vw - 24px);left:clamp(12px,var(--editor-left,24px),max(12px,calc(100vw - min(var(--editor-width,370px),calc(100vw - 24px)) - 12px)))}

/* Writing is a full-height drawer; canvas view coordinates remain untouched. */
.canvas-app{--writing-drawer-width:75vw}
.canvas-viewport{transition:transform 280ms cubic-bezier(.2,.7,.2,1)}
.canvas-app.writing-revealed .canvas-viewport{transform:translateX(calc(var(--writing-drawer-width) / -2))}
.canvas-app #canvas-inspector.writing-open{top:var(--canvas-header-height,76px);bottom:0;left:auto;right:0;width:var(--writing-drawer-width);max-width:100%;max-height:none;border-radius:0;z-index:10;box-shadow:-12px 0 36px #20252220}
.writing-open .inspector-header{padding:var(--space-4) var(--space-7)}.writing-open #writing-panel{padding:var(--space-6) var(--space-7) var(--space-9)}
.writing-open .writing-workbench{grid-template-columns:minmax(220px,.7fr) minmax(0,1.5fr)}
.writing-open .writing-materials,.writing-open .writing-controls,.writing-open .writing-guide-output{padding:var(--space-6)}
@media(max-width:800px){.canvas-app{--writing-drawer-width:100vw}.writing-open #writing-panel{padding:var(--space-4)}.writing-open .inspector-header{padding:var(--space-3) var(--space-4)}.writing-open .writing-workbench{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.canvas-viewport{transition:none}}
.writing-guide-settings .guide-rules label{justify-content:flex-start}
#author-dialog{padding:0;width:440px;max-width:calc(100vw - 32px);border:1px solid var(--border);border-radius:var(--radius-large);color:var(--ink);background:var(--surface)}#author-dialog::backdrop{background:#20252266}#author-dialog .workspace{padding:var(--space-6)}#author-dialog label{display:grid;gap:var(--space-2)}#author-dialog input{width:100%;padding:var(--space-2-half);border:1px solid var(--border);border-radius:var(--radius-card);font:inherit}#author-dialog .workspace-note{margin-top:var(--space-4)}#files-panel .workspace-toolbar{display:flex;flex-direction:column;align-items:stretch;gap:var(--space-4)}#files-panel .workspace-note{margin:0 0 var(--space-5)}#files-panel fieldset{min-width:0}

.writing-tabs{display:flex;gap:var(--space-2);position:sticky;top:-24px;background:var(--surface);z-index:2;padding:0 0 var(--space-3);border-bottom:1px solid var(--border);margin-bottom:var(--space-6)}.writing-tab{border:0;border-radius:var(--radius-card);background:transparent;padding:var(--space-2-half) var(--space-5);font:inherit}.writing-tab[aria-selected=true]{background:var(--ink);color:var(--color-white)}.writing-tab-pane[hidden]{display:none!important}.api-settings,.ai-result{max-width:860px;margin:0 auto}.api-settings form{max-width:640px}.api-settings label{display:block;margin:var(--space-4) 0 var(--space-2)}.api-settings input,.api-settings select{width:100%;padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-card);font:inherit;background:var(--surface);color:var(--ink)}.ai-actions{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:var(--space-4) 0}.api-settings #ai-list-models{margin-top:var(--space-3)}#ai-result-text{white-space:pre-wrap;overflow-wrap:anywhere;font:400 var(--type-input-size)/1.9 var(--font-sans);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-large);padding:var(--space-6)}#ai-config-status,#ai-result-status{white-space:pre-wrap;color:var(--muted);font-size:var(--type-body-size)}@media(max-width:800px){.writing-tabs{top:-16px}.writing-tab{padding:var(--space-2-half) var(--space-3-half)}#ai-result-text{padding:var(--space-4)}}

#files-panel .workspace-toolbar{margin-bottom:var(--space-5)}

#canvas-files:disabled,#canvas-connect:disabled{opacity:.5;cursor:not-allowed}

@media(max-width:420px){.writing-tabs{gap:var(--space-1)}.writing-tab{flex:1;min-width:0;padding:var(--space-2-half) var(--space-1-half);white-space:nowrap;font-size:var(--type-label-size);line-height:var(--type-label-line)}}

#canvas-new{white-space:nowrap}
#canvas-library{position:absolute;left:12px;top:calc(var(--canvas-panel-top,136px) + 12px);z-index:5;max-height:calc(100% - var(--canvas-panel-top,136px) - 64px);width:180px;overflow:auto;padding:var(--space-2);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-large);box-shadow:0 4px 16px #20252212}
.canvas-library-title{font-size:var(--type-caption-size);color:var(--muted);margin:var(--space-1) var(--space-2) var(--space-2-half)}.canvas-chip{display:flex;align-items:center;gap:var(--space-1);margin:var(--space-1-half) 0}.canvas-chip button{border:1px solid var(--border);border-radius:var(--radius-badge);background:var(--surface);padding:var(--space-2);font:inherit;font-size:var(--type-label-size)}.canvas-chip-open{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.canvas-chip-open[aria-current=true]{background:var(--ink);color:var(--color-white)}.canvas-chip-delete{flex:none}.canvas-chip-delete .ui-icon{margin:0;width:16px;height:16px}.canvas-header-actions{flex-wrap:wrap}.canvas-header{gap:var(--space-4)}body[data-canvas-locked="true"] #canvas-library{display:none}
@media(max-width:650px){#canvas-library{width:145px}.canvas-header-actions #canvas-new{margin-left:auto}.canvas-header-actions #canvas-writing{margin-left:0}}

#canvas-library{display:block}#canvas-library[hidden]{display:none!important}#canvas-library .canvas-library-title{display:block;white-space:nowrap}#canvas-library .canvas-chip{display:flex;width:100%}

#canvas-library{width:246px}#canvas-library .canvas-chip-open{font-variant-numeric:tabular-nums;white-space:normal;overflow-wrap:normal;line-height:1.5}@media(max-width:650px){#canvas-library{width:224px;max-width:calc(100vw - 24px)}}

/* Runtime geometry stays separate from component presentation. */
#canvas-world{transform:translate(var(--canvas-x,0px),var(--canvas-y,0px)) scale(var(--canvas-scale,1))}
#workspace-nodes .workspace-node,.canvas-edge-label{left:var(--canvas-left,0px);top:var(--canvas-top,0px)}
.editor-tether{display:none}.editor-tether.is-visible{display:block}

.canvas-edge-line{fill:none;stroke:var(--logic);stroke-width:2}.canvas-edge-line.selected{stroke:var(--focus);stroke-width:3}
.edge-hit{fill:none;stroke:transparent;stroke-width:18}
.editor-tether-path{fill:none;stroke:var(--muted);stroke-width:1.5;stroke-dasharray:4 4}