/* Graph workspace only: preserve existing navigation and legacy/research pages. */
.atomic-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:6px 12px;background:#fff;border-bottom:1px solid #dbe2dc;flex:none;font-size:12px}
.atomic-controls button{min-height:36px;border:1px solid #c6d0c9;border-radius:5px;background:#f5f8f5;padding:6px 10px}
.atomic-empty{position:absolute;left:32px;top:40px;width:min(420px,calc(100vw - 64px));padding:24px;background:white;border:1px solid #c6d0c9;border-radius:12px;box-sizing:border-box}
.atomic-empty button{min-height:44px;padding:10px;background:#197a42;color:white;border:0;border-radius:5px}
.graph-mode .flow-modifier{--node-accent:#526dc4;border-color:#8294cf;background:#f7f9ff}
.graph-mode .flow-modifier .flow-handle{background:#eef2ff;color:#3d54a0}
.graph-mode .flow-modifier [data-port=attach]{color:#3d54a0;border-style:dashed}
.graph-mode .flow-modifier .flow-input,.graph-mode .flow-modifier [data-start-node]{display:none}
@media(max-width:900px){.atomic-controls{max-height:100px;overflow:auto;font-size:11px}.atomic-controls button{min-height:44px}.atomic-controls small{display:none}}

body:has(#research-view:not([hidden]) .graph-mode:not(.research-details)) .sidebar{left:0;right:auto;width:240px;z-index:20}
body:has(#research-view:not([hidden]) .graph-mode:not(.research-details)) .topbar{position:fixed;top:0;left:240px;right:0;height:64px;z-index:5;background:#fff}
#research-view:not([hidden]) .graph-mode:not(.research-details){position:fixed;inset:64px 0 0 240px;margin:0;border:0;border-radius:0;z-index:6;display:flex;flex-direction:column;background:#fafbf8}
.graph-mode .maker-heading{display:none}.graph-mode .maker-toolbar{padding:10px 14px;gap:8px;flex:none;align-items:end;background:#fff;max-height:180px;overflow:auto}.graph-mode .maker-toolbar label{min-width:150px;flex:1}.graph-mode .maker-toolbar button{font-size:12px;min-height:38px;padding:8px 12px}.graph-mode .maker-toolbar #recipe-save,.graph-mode .maker-toolbar #recipe-load{font-size:10px}
.graph-mode .maker-grid{position:relative;display:block;flex:1;min-height:0}.graph-mode .recipe-canvas{height:100%;padding:0;border:0;display:flex;flex-direction:column}.graph-mode .canvas-heading,.graph-mode .recipe-canvas>.quiet{display:none}.graph-mode #recipe-chain{height:100%;display:flex;flex-direction:column;min-height:0}.graph-mode .flow-navigation{flex:none;gap:8px;margin:0;padding:8px 12px;background:#f8faf6;border-bottom:1px solid var(--line)}.graph-mode .flow-navigation button{padding:6px 10px}.graph-mode .flow-scroll{flex:1;min-height:0;max-height:none;border:0;border-radius:0;background-image:radial-gradient(#cad5cd 1px,transparent 1px);background-size:20px 20px;overscroll-behavior:contain;touch-action:none}.graph-mode .flow-hint{position:absolute;bottom:8px;left:12px;background:white;padding:4px 8px;pointer-events:none;max-width:70%}.graph-mode .flow-hint button{pointer-events:auto}
.graph-mode .block-shelf,.graph-mode .recipe-guide{position:absolute;right:16px;top:68px;width:270px;max-height:calc(100% - 84px);overflow:auto;padding:12px;display:block;border:1px solid #c0cec2;border-radius:10px;background:#fff;box-shadow:0 8px 30px #203b2924;z-index:8}.graph-mode .recipe-guide{top:auto;bottom:16px;width:330px;max-height:65%;z-index:9}.graph-mode .block-shelf>h3,.graph-mode .block-shelf>.muted,.graph-mode .block-shelf>.quiet{display:none}.floating-handle{display:none}.graph-mode .floating-handle{display:flex;justify-content:space-between;align-items:center;gap:8px;cursor:grab;touch-action:none;font-size:12px;margin:-4px -4px 10px;padding:5px;background:#f3f7f1;border-radius:6px;position:sticky;top:-12px;z-index:1}.floating-handle button{min-width:32px;min-height:32px;background:white;border:1px solid var(--line);border-radius:4px}.graph-mode .panel-collapsed>:not(.floating-handle){display:none!important}.graph-mode .panel-collapsed .floating-handle{margin-bottom:-4px}.graph-mode .tool-tabs{grid-template-columns:1fr 1fr}.graph-mode #recipe-status{margin:10px 0}.graph-mode .recipe-files{display:block}.graph-mode .recipe-files label{display:block}.graph-mode .shelf-block{background:#f4f8f2;border:1px solid #d5e0d4;color:#284b31}.graph-mode .maker-toolbar .file-button{min-width:0;flex:none;font-size:12px;cursor:pointer}
.graph-mode.research-details{position:relative;display:flex;flex-direction:column;height:1000px;overflow:hidden}.graph-mode.research-details #recipe-research{position:fixed;bottom:20px;right:20px;z-index:30;background:var(--green);color:white;box-shadow:0 4px 20px #0003}
@media(max-width:900px){body:has(#research-view:not([hidden]) .graph-mode:not(.research-details)) .sidebar{position:fixed;inset:0 0 auto;width:100%;height:54px;padding:4px;background:white;overflow:auto}body:has(#research-view:not([hidden]) .graph-mode:not(.research-details)) .sidebar>.brand,body:has(#research-view:not([hidden]) .graph-mode:not(.research-details)) .sidebar>.nav-label,body:has(#research-view:not([hidden]) .graph-mode:not(.research-details)) .side-bottom{display:none}body:has(#research-view:not([hidden]) .graph-mode:not(.research-details)) .sidebar nav{display:flex;white-space:nowrap;gap:2px}body:has(#research-view:not([hidden]) .graph-mode:not(.research-details)) .sidebar .nav{min-width:max-content;margin:0;padding:10px;font-size:11px}body:has(#research-view:not([hidden]) .graph-mode:not(.research-details)) .topbar{display:none}#research-view:not([hidden]) .graph-mode:not(.research-details){inset:54px 0 0}.graph-mode .maker-toolbar{flex-wrap:nowrap;align-items:end;max-height:110px;padding:8px;overflow:auto}.graph-mode .maker-toolbar label{min-width:170px;width:170px;flex:none}.graph-mode .maker-toolbar button{flex:none;white-space:nowrap}.graph-mode .flow-navigation{flex-wrap:nowrap;overflow:auto;white-space:nowrap;font-size:11px}.graph-mode .flow-navigation label{flex:none}.graph-mode .flow-navigation select{max-width:140px}.graph-mode .flow-navigation button{flex:none}.graph-mode .block-shelf{width:250px;right:8px;top:62px}.graph-mode .recipe-guide{width:280px;right:8px}.graph-mode .flow-node{width:calc(100vw - 40px)}.graph-mode #block-shelf{display:block}.graph-mode .recipe-canvas{max-width:none;padding:0}}

/* Align workspace navigation without inheriting account-form label margins. */
.graph-mode .flow-navigation label{margin:0;line-height:20px;white-space:nowrap;flex:none}
.graph-mode .flow-navigation select{margin:0;min-height:36px;height:36px;padding:6px 8px}
.graph-mode .flow-navigation button{min-height:36px;height:36px}
/* Keep recovery controls visible, with compact bottom panel docks on phones/tablets. */
.graph-mode .flow-scroll{overflow-anchor:none}
.graph-mode [data-toolbar-toggle]{display:none}
@media(max-width:900px){
 .graph-mode:not(.toolbar-open) .maker-toolbar{display:none}
 .graph-mode [data-toolbar-toggle]{display:block}
 .graph-mode .flow-node{width:440px}
}
@media(min-width:701px) and (max-width:900px){.graph-mode .flow-navigation label{width:auto!important;order:0!important}.graph-mode .flow-navigation [data-focus-start]{order:0!important}}

.graph-mode .block-shelf,.graph-mode .recipe-guide{overscroll-behavior:contain;box-sizing:border-box}
@media(max-width:900px){
 .graph-mode .flow-navigation{flex-wrap:wrap;gap:4px;overflow:visible;padding:4px 8px}
 .graph-mode .flow-navigation label{order:2;width:calc(100% - 110px)}
 .graph-mode .flow-navigation [data-focus-start]{order:2}
 .graph-mode .flow-navigation>.quiet{display:none}
 .graph-mode .flow-navigation button,.graph-mode .flow-navigation select,.graph-mode .floating-handle button,.graph-mode .maker-toolbar button,.graph-mode .tool-tabs button{height:44px;min-height:44px;min-width:44px}
 .graph-mode .flow-navigation [data-zoom-value]{min-width:44px;text-align:center}
 .graph-mode .block-shelf,.graph-mode .recipe-guide{width:min(330px,calc(100% - 16px));max-width:calc(100% - 16px);max-height:calc(100% - 108px);top:auto;bottom:8px;right:8px;padding:8px}
 .graph-mode .panel-collapsed{width:calc(50% - 12px);max-height:64px}
 .graph-mode .block-shelf.panel-collapsed{left:8px;right:auto}
 .graph-mode .recipe-guide.panel-collapsed{left:auto;right:8px}
 .graph-mode .floating-handle{font-size:10px;line-height:14px;gap:2px;margin:0;padding:0;top:-8px}
 .graph-mode .panel-collapsed .floating-handle{margin:0}
 .graph-mode .flow-hint{display:none}
 .graph-mode .flow-node .flow-handle,.graph-mode .flow-node summary{min-height:44px;box-sizing:border-box}
 .graph-mode .flow-node input:not([type=range]):not([type=checkbox]),.graph-mode .flow-node select{font-size:16px;min-height:44px;height:44px}
}
.graph-mode .floating-handle:focus-visible{outline:2px solid #1d4ed8;outline-offset:2px}
.graph-mode .shelf-block[data-flow-add=read_candle],.graph-mode .shelf-block[data-reference]{color:#1d4ed8;background:#eff6ff;border-color:#bfdbfe}
.graph-mode .shelf-block[data-flow-add=set_variable],.graph-mode .shelf-block[data-function]{color:#6d28d9;background:#f5f3ff;border-color:#ddd6fe}
.graph-mode .shelf-block[data-flow-add=condition],.graph-mode .shelf-block[data-logic]{color:#92400e;background:#fffbeb;border-color:#fde68a}
.graph-mode .shelf-block[data-flow-add=buy_option]{color:#166534;background:#f0fdf4;border-color:#bbf7d0}
.graph-mode .shelf-block[data-flow-add=sell_to_close]{color:#991b1b;background:#fef2f2;border-color:#fecaca}
.graph-mode .shelf-block[data-flow-add=do_nothing]{color:#475569;background:#f1f5f9;border-color:#cbd5e1}
/* Fullscreen edit is a top-layer modal, independent of canvas zoom. */
html.flow-modal-open,html.flow-modal-open body{overflow:hidden;overscroll-behavior:none}
.graph-mode .flow-mobile-editor[open]{position:fixed;inset:auto;margin:0;top:var(--flow-visible-top,0px);left:var(--flow-visible-left,0px);width:var(--flow-visible-width,100vw);height:var(--flow-visible-height,100dvh);max-width:none;max-height:none;box-sizing:border-box;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);border:0;border-radius:0;background:#f4f7f3;color:#16251c;display:flex;flex-direction:column;overflow:hidden;overscroll-behavior:none;touch-action:pan-y}
.flow-mobile-editor::backdrop{background:#13271fcc}
.graph-mode .flow-mobile-editor .flow-node.is-editing{position:relative;inset:auto!important;width:100%;max-width:none;margin:0;min-height:0;flex:1;display:flex;flex-direction:column;border:0;border-radius:0;box-shadow:none;overflow:hidden}
.graph-mode .flow-mobile-editor .flow-handle,.graph-mode .flow-mobile-editor .flow-input,.graph-mode .flow-mobile-editor .flow-ports{display:none}
.graph-mode .flow-mobile-editor h4{flex:none;margin:0;padding:12px 16px;background:#fff}
.graph-mode .flow-mobile-editor .flow-edit-fields{flex:1;min-height:0;max-height:none;overflow:auto;padding:8px;scroll-padding:16px;touch-action:pan-y;overscroll-behavior:contain}
.graph-mode .flow-mobile-editor .flow-edit-actions{flex:none;margin:0;padding:8px 12px;border-top:1px solid #bdc9bf;border-bottom:0;max-height:45%;overflow:auto}
.graph-mode .flow-mobile-editor .flow-edit-actions strong{display:none}
.graph-mode .flow-mobile-editor .flow-edit-actions button{min-height:44px}
.graph-mode .flow-mobile-editor .flow-sentence{overflow-wrap:anywhere}
.graph-mode .flow-mobile-editor input,.graph-mode .flow-mobile-editor select{min-height:44px;font-size:16px;max-width:100%;box-sizing:border-box}
.graph-mode .flow-mobile-editor .inline-field{display:flex;flex-direction:column;align-items:stretch;width:100%;max-width:100%;margin:8px 0}
.graph-mode .flow-mobile-editor .inline-field input,.graph-mode .flow-mobile-editor .inline-field select{width:100%}
/* Sentence editor: same horizontal label/control centers at every width. */
.graph-mode .is-editing .flow-sentence{display:flex;flex-wrap:wrap;align-items:center;gap:8px;line-height:1.5}
.graph-mode .is-editing .inline-field,.graph-mode .flow-mobile-editor .inline-field{display:inline-flex;flex-direction:row;align-items:center;gap:8px;width:auto;max-width:100%;margin:0;flex-wrap:nowrap}
.graph-mode .is-editing .inline-field span{flex:none;font-size:13px}
.graph-mode .is-editing .inline-field input,.graph-mode .is-editing .inline-field select{margin:0;width:auto;min-width:0;max-width:230px;min-height:44px;height:44px}
.graph-mode .flow-mobile-editor .inline-field input,.graph-mode .flow-mobile-editor .inline-field select{max-width:200px;width:auto}
.graph-mode .is-editing .flow-advanced{flex-basis:100%;max-width:100%;font-size:13px}
.graph-mode .is-editing .flow-advanced[open]>.inline-field{display:flex;margin:8px 0;flex-wrap:wrap}
.graph-mode .is-editing .expression{display:inline-flex;align-items:center;flex-wrap:wrap;gap:8px;max-width:100%}
.graph-mode .is-editing .expression input,.graph-mode .is-editing .expression select{margin:0;max-width:100%;min-height:44px}
.graph-mode .is-editing .flow-advanced summary{cursor:pointer;min-height:44px;display:flex;align-items:center}
/* View mode contains prose, not miniature form controls. */
.graph-mode .flow-node:not(.is-editing) .flow-sentence{font-size:15px;line-height:1.6;padding:4px 14px 16px}
.flow-node h4{display:flex;justify-content:space-between;align-items:center;gap:10px}
.flow-edit-button{font-size:13px;min-height:36px;padding:6px 14px;border:1px solid currentColor;background:white;color:var(--node-accent);border-radius:5px}
.flow-edit-actions{flex:none;display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:8px 12px;background:#fff;border-bottom:2px solid #197a42;z-index:12}
.flow-edit-actions button{min-height:44px;min-width:64px;padding:8px 12px;border:1px solid #bdc9bf;border-radius:5px;background:#f4f7f3}
.flow-edit-actions [data-save-edit]{background:#197a42;color:white}
.flow-edit-actions [data-edit-error]:not(:empty),.flow-edit-actions [data-switch-edit]{width:100%;font-size:13px;color:#991b1b}
.flow-edit-actions [data-switch-edit] button{margin:4px}
.flow-edit-fields{max-height: min(600px,calc(100dvh - 360px));overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
.graph-mode .is-editing{z-index:4}
.graph-mode.card-editing .flow-handle{cursor:default}
@media(max-width:900px){
 .graph-mode .is-editing{width:calc(100vw - 40px)}
 .graph-mode .flow-edit-button{min-height:44px;min-width:64px}
 .graph-mode .flow-edit-actions{padding:4px 8px;gap:6px}
 .graph-mode .flow-edit-actions strong{font-size:12px}
 .graph-mode .flow-edit-fields{max-height:calc(var(--flow-visible-height,100dvh) - 340px);min-height:90px}
 .graph-mode.card-editing .panel-collapsed{display:none}
 .graph-mode.card-editing .flow-scroll{touch-action:pan-y}
}

