/*
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Bone Flow Formal Component Header
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Component ID : 023
File         : bone-flow-editor.css
Version      : 1.0.83
Status       : Release Ready Candidate
Standard     : Bone Flow Development Standard v1.0
Description  : Flow Editor layout and UI styling. Dependency CSS remains isolated in adapter Shadow Roots.
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
*/
:root{color-scheme:dark;--bf023-bg:#08111d;--bf023-panel:#0e1928;--bf023-panel2:#111f31;--bf023-line:#263b53;--bf023-line2:#354e69;--bf023-text:#dbe7f4;--bf023-muted:#8398ae;--bf023-accent:#4ca8ff;--bf023-good:#46d39a;--bf023-warn:#f5bd4f;--bf023-bad:#ff6e78;--bf023-code:#091522;--bf023-toolbar-h:46px;font-family:Meiryo,"Segoe UI",sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bf023-bg);color:var(--bf023-text)}body{min-width:760px}.bf023-app{--bf023-editor-font-family:Consolas,"Cascadia Mono",monospace;--bf023-editor-font-size:12.5px;--bf023-property-font-size:11px;--bf023-source-fr:40fr;--bf023-preview-fr:44fr;--bf023-inspector-fr:16fr;min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#0a1522,#07101a 74%)}
.bf023-toolbar{height:var(--bf023-toolbar-h);display:flex;align-items:center;gap:5px;padding:5px 8px;border-bottom:1px solid var(--bf023-line);background:#0c1827;position:sticky;top:0;z-index:50;box-shadow:0 3px 10px #0006}.bf023-toolbar .spacer{flex:1}.bf023-toolbar .group{display:flex;align-items:center;gap:4px;padding-right:7px;margin-right:2px;border-right:1px solid #24364a}.bf023-toolbar button,.bf023-toolbar .tool{border:1px solid #31475e;background:#132337;color:#dbe7f4;border-radius:5px;height:30px;padding:0 9px;font:600 12px Meiryo,"Segoe UI",sans-serif;cursor:pointer}.bf023-toolbar button:hover{border-color:#4f7fa9;background:#18304a}.bf023-toolbar button:focus-visible,.bf023-app input:focus-visible,.bf023-app select:focus-visible,.bf023-app textarea:focus-visible{outline:2px solid var(--bf023-accent);outline-offset:1px}.bf023-brand{display:flex;align-items:center;gap:9px;padding:0 12px 0 2px;font-size:12px;white-space:nowrap}.bf023-brand strong{font-size:14px;letter-spacing:.2px}.bf023-version{font-size:10px;color:#7ea2c3;border:1px solid #2c4660;border-radius:10px;padding:2px 6px}.bf023-status-pill{border:1px solid #2c4660;border-radius:10px;padding:3px 8px;font-size:10px;color:#86c6ff;min-width:76px;text-align:center}.bf023-dirty{font-size:10px;color:var(--bf023-good)}.bf023-dirty.is-dirty{color:var(--bf023-warn)}.bf023-inline-label{font-size:10px;color:#90a7bc;white-space:nowrap}.bf023-toolbar select,.bf023-toolbar input{border:1px solid #31475e;background:#132337;color:#dbe7f4;border-radius:5px;height:30px;padding:0 9px;font:600 11px Meiryo,"Segoe UI",sans-serif}.bf023-toolbar-select{min-width:150px}.bf023-toolbar select:hover{border-color:#4f7fa9;background:#18304a}
.bf023-toolbar .bf023-export-actions{border-right-color:#315b76}.bf023-toolbar .bf023-export-actions button{border-color:#356787;background:#102b41;color:#dff6ff}.bf023-toolbar .bf023-export-actions button:hover{border-color:#61b8e6;background:#153b58}.bf023-toolbar .bf023-export-actions button:focus-visible{outline-color:#67c8f5}
.bf023-settings-pop{position:absolute;right:10px;top:44px;z-index:80;width:270px;background:#101e30;border:1px solid #35516d;border-radius:8px;box-shadow:0 12px 36px #0009;padding:12px}.bf023-settings-pop h3{font-size:12px;margin:0 0 9px}.bf023-settings-pop label{display:flex;justify-content:space-between;align-items:center;font-size:11px;padding:6px 0;color:#b8c8d8;gap:8px}.bf023-settings-pop input{accent-color:var(--bf023-accent)}.bf023-settings-pop select{min-width:120px;height:26px;background:#0b1725;color:#d0dfed;border:1px solid #304861;border-radius:4px;padding:0 6px;font-size:10px}.bf023-settings-divider{height:1px;background:#294055;margin:10px 0}
.bf023-main{position:relative;display:grid;grid-template-columns:minmax(280px,var(--bf023-source-fr)) minmax(340px,var(--bf023-preview-fr)) minmax(220px,var(--bf023-inspector-fr));grid-template-rows:minmax(420px,1fr) auto;gap:1px;background:var(--bf023-line);flex:1;min-height:700px}.bf023-panel{min-width:0;min-height:0;background:var(--bf023-panel);display:flex;flex-direction:column;position:relative}.bf023-panel-head{height:34px;display:flex;align-items:center;gap:7px;padding:0 9px;background:#112033;border-bottom:1px solid #2b4057;color:#c8d8e8;font-size:11px;font-weight:700;letter-spacing:.15px}.bf023-panel-head .grow{flex:1}.bf023-panel-head button{border:1px solid #304861;background:#14283e;color:#c9d9e9;border-radius:4px;padding:3px 7px;font-size:10px;cursor:pointer}.bf023-source-panel{grid-column:1;grid-row:1;overflow:hidden}.bf023-preview-panel{grid-column:2;grid-row:1}.bf023-inspector{grid-column:3;grid-row:1 / span 2}.bf023-validation-panel{grid-column:1;grid-row:2;align-self:start;height:clamp(180px,28vh,330px)}.bf023-definition-panel{grid-column:2;grid-row:2;align-self:start;height:clamp(180px,28vh,330px)}
.bf023-sample-info{display:flex;flex-direction:column;gap:3px;padding:7px 10px;background:#0c1b2b;border-bottom:1px solid #263b53;color:#91a9bf;font-size:10px;line-height:1.45;min-height:45px}.bf023-sample-info strong{color:#d0e2f2;font-size:10.5px}.bf023-sample-info span{color:#829bb2}.bf023-source-wrap{--bf023-editor-gutter:max(50px,calc(var(--bf023-editor-font-size) * 4));display:grid;grid-template-columns:var(--bf023-editor-gutter) 1fr;grid-template-rows:minmax(0,1fr);flex:1;min-height:0;overflow:hidden;contain:size layout paint;background:var(--bf023-code);position:relative}.bf023-line-numbers{grid-column:1;grid-row:1;min-height:0;height:100%;max-height:100%;margin:0;padding:10px 9px 20px 0;text-align:right;overflow:hidden;white-space:pre;color:#50667d;background:#07111c;border-right:1px solid #1d3045;font-size:var(--bf023-editor-font-size);line-height:calc(var(--bf023-editor-font-size) * 1.6);font-family:var(--bf023-editor-font-family);user-select:none}.bf023-highlight{grid-column:2;grid-row:1;min-height:0;height:100%;max-height:100%;margin:0;padding:10px 13px 40px;overflow:hidden;white-space:pre;color:#d7e5f4;font-size:var(--bf023-editor-font-size);line-height:calc(var(--bf023-editor-font-size) * 1.6);font-family:var(--bf023-editor-font-family);tab-size:4;pointer-events:none;z-index:1}.bf023-highlight .tok-directive{color:#6fc7ff}.bf023-highlight .tok-type{color:#c9a7ff}.bf023-highlight .tok-string{color:#9ddc9b}.bf023-highlight .tok-port{color:#f0ca73}.bf023-highlight .tok-joint{color:#ff99b7}.bf023-highlight .tok-comment{color:#667e94}.bf023-highlight .has-error{background:#7d1e2b33;text-decoration:underline wavy #ff6975;text-decoration-skip-ink:none}.bf023-source{grid-column:2;grid-row:1;z-index:2;min-height:0;height:100%;max-height:100%;margin:0;border:0;outline:0;resize:none;width:100%;height:100%;padding:10px 13px 40px;background:transparent;color:transparent;-webkit-text-fill-color:transparent;caret-color:#79bfff;font-size:var(--bf023-editor-font-size);line-height:calc(var(--bf023-editor-font-size) * 1.6);font-family:var(--bf023-editor-font-family);tab-size:4;white-space:pre;overflow:auto;overscroll-behavior:contain}.bf023-source::selection{background:rgba(36,84,125,.38)}html.bf023-ui-light .bf023-source::selection{background:rgba(0,111,190,.22)}.bf023-source-foot{position:absolute;left:var(--bf023-editor-gutter);right:0;bottom:0;height:26px;display:flex;align-items:center;gap:14px;padding:0 10px;border-top:1px solid #172a3f;background:#091522e8;color:#69829a;font:10px Consolas,monospace;pointer-events:none}.bf023-source-foot b{color:#89a8c5;font-weight:500}
.bf023-preview-tools{display:flex;gap:5px;align-items:center}.bf023-preview-tools label{display:flex;align-items:center;gap:4px;color:#9ab0c4;font-weight:500;font-size:10px}.bf023-preview-tools input{accent-color:var(--bf023-accent)}.bf023-preview{position:relative;flex:1;min-height:0;overflow:hidden;background:#0a1420;cursor:grab;touch-action:none}.bf023-preview.is-grid{background-image:linear-gradient(#1b2b3b66 1px,transparent 1px),linear-gradient(90deg,#1b2b3b66 1px,transparent 1px);background-size:20px 20px}.bf023-preview-canvas{position:absolute;inset:0;overflow:hidden}.bf023-style-host{position:absolute;inset:0;pointer-events:none}.bf023-shape-host{z-index:3;pointer-events:auto}.bf023-joint-host{z-index:2}.bf023-interaction-host{z-index:4;pointer-events:none}.bf023-minimap{position:absolute;right:10px;bottom:10px;width:190px;height:116px;border:1px solid #36506b;border-radius:6px;background:#0c1928e8;z-index:15;box-shadow:0 5px 15px #0007;overflow:hidden}.bf023-minimap svg{width:100%;height:100%}.bf023-minimap rect{fill:#4ca8ff55;stroke:#78bdff;stroke-width:.8}
.bf023-inspector-section{display:flex;flex-direction:column;min-height:0;border-bottom:1px solid var(--bf023-line)}.bf023-inspector-section.mini{height:180px;min-height:120px}.bf023-inspector-section.props{flex:1}.bf023-inspector-title{height:32px;padding:0 9px;display:flex;align-items:center;background:#112033;color:#c8d8e8;font-size:11px;font-weight:700;border-bottom:1px solid #293f55}.bf023-properties{overflow:auto;padding:10px;flex:1}.bf023-prop-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px 7px}.bf023-prop-grid label{display:flex;flex-direction:column;gap:4px;color:#8fa6bc;font-size:10px}.bf023-prop-grid label.wide,.bf023-readonly,.bf023-field-editor,.bf023-joint-browser{grid-column:1/-1}.bf023-prop-grid input,.bf023-prop-grid select,.bf023-prop-grid textarea{width:100%;border:1px solid #2e465f;border-radius:4px;background:#0a1725;color:#d5e4f3;padding:5px 6px;font:11px Meiryo,"Segoe UI",sans-serif}.bf023-prop-grid textarea{height:52px;resize:vertical}.bf023-prop-grid input[readonly]{background:#0b1420;color:#6f8499}.bf023-readonly{border:1px dashed #2a4057;border-radius:5px;padding:7px;color:#6f879d;font-size:10px}.bf023-field-editor{margin-top:5px;border-top:1px solid #2b4056;padding-top:8px}.bf023-field-editor h4,.bf023-joint-browser h4{margin:0 0 7px;font-size:10px;color:#b5c9dc}.bf023-field-row,.bf023-joint-row{border:1px solid #253b52;background:#0b1725;border-radius:5px;padding:6px;margin:5px 0}.bf023-field-row button,.bf023-joint-row button{border:1px solid #31506b;background:#14304b;color:#d0dfed;border-radius:4px;font-size:10px;padding:3px 6px;cursor:pointer}.bf023-field-row-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}.bf023-attrs{display:flex;gap:6px;flex-wrap:wrap;font-size:9px;color:#93a9bd}.bf023-attrs label{display:flex;flex-direction:row;align-items:center;gap:2px}.bf023-joint-row{cursor:pointer;color:#9fb4c7;font:10px Consolas,monospace}.bf023-joint-row:hover,.bf023-joint-row.is-selected{border-color:#4ca8ff;background:#10263b}
.bf023-table-wrap{overflow:auto;flex:1}.bf023-validation{width:100%;border-collapse:collapse;font-size:10px}.bf023-validation th{position:sticky;top:0;background:#112033;text-align:left;color:#8fa7bd;padding:6px 7px;border-bottom:1px solid #2c4259}.bf023-validation td{padding:5px 7px;border-bottom:1px solid #192d41;color:#b8cadb;vertical-align:top}.bf023-validation tr[data-i]{cursor:pointer}.bf023-validation tr:hover td{background:#122438}.bf023-validation tr.is-error td:first-child{color:var(--bf023-bad);font-weight:700}.bf023-validation tr.is-warning td:first-child{color:var(--bf023-warn);font-weight:700}.bf023-validation tr.is-info td:first-child{color:#70b8f5}.bf023-empty{text-align:center!important;color:#6e899f!important;padding:20px!important}.bf023-counter{font-size:10px;border:1px solid #324b63;border-radius:10px;padding:2px 6px;color:#91a9be}.bf023-counter.error{color:#ff8d95}.bf023-counter.warn{color:#efc66d}
.bf023-definition{margin:0;padding:10px 12px;overflow:auto;flex:1;background:#091522;color:#adc4d9;font:11px/17px Consolas,"Cascadia Mono",monospace;white-space:pre}.bf023-definition-tabs{display:flex;gap:3px}.bf023-definition-tabs button.is-active{border-color:#4ca8ff;color:#8ac8ff}
.bf023-console-panel{border-top:1px solid var(--bf023-line);height:170px;min-height:110px;background:#07111b;display:flex;flex-direction:column}.bf023-console{overflow:auto;flex:1;font:10px/17px Consolas,monospace;padding:5px 8px}.bf023-log{display:grid;grid-template-columns:62px 66px 90px 1fr;gap:8px;border-bottom:1px solid #112338;color:#8199ae}.bf023-log strong{font-weight:700}.bf023-log em{font-style:normal;color:#6995bd}.bf023-log.is-error strong{color:var(--bf023-bad)}.bf023-log.is-warning strong{color:var(--bf023-warn)}.bf023-log.is-info strong{color:#68b8ff}.bf023-log.is-debug{opacity:.72}
.bf023-test-panel{border-top:1px solid #243a50;background:#0b1724;padding:8px 10px;font-size:10px}.bf023-test-summary{display:flex;gap:8px;align-items:center}.bf023-test-summary strong.pass{color:var(--bf023-good)}.bf023-test-summary strong.fail{color:var(--bf023-bad)}.bf023-test-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px 12px;margin-top:5px}.bf023-test-result{font:10px Consolas,monospace;color:#93aabd}.bf023-test-result.pass::before{content:'PASS ';color:var(--bf023-good)}.bf023-test-result.fail::before{content:'FAIL ';color:var(--bf023-bad)}
html.bf023-ui-light{--bf023-bg:#dfe7ef;--bf023-panel:#f7fafc;--bf023-panel2:#fff;--bf023-line:#aebdca;--bf023-line2:#8fa4b6;--bf023-text:#172b3d;--bf023-muted:#4d6275;--bf023-accent:#006fbe;--bf023-good:#087f4d;--bf023-warn:#8a5a00;--bf023-bad:#b42332;--bf023-code:#fff;color-scheme:light}
html.bf023-ui-light .bf023-app{filter:none!important;background:linear-gradient(180deg,#edf3f8,#e3ebf2 74%);color:#172b3d}
html.bf023-ui-light .bf023-toolbar{background:#e8eef4;border-bottom-color:#9fb0bf;box-shadow:0 3px 10px #27435b22}
html.bf023-ui-light .bf023-toolbar .group{border-right-color:#b1bfcb}
html.bf023-ui-light .bf023-toolbar button,html.bf023-ui-light .bf023-toolbar .tool,html.bf023-ui-light .bf023-toolbar select,html.bf023-ui-light .bf023-toolbar input{background:#fff;color:#18344e;border-color:#879daf}
html.bf023-ui-light .bf023-toolbar button:hover,html.bf023-ui-light .bf023-toolbar select:hover{background:#dceaf5;border-color:#537c9e}
html.bf023-ui-light .bf023-version{color:#315c7d;border-color:#91a8ba}html.bf023-ui-light .bf023-status-pill{color:#005f9f;border-color:#91a8ba}html.bf023-ui-light .bf023-inline-label{color:#405b72}
html.bf023-ui-light .bf023-panel{background:#f7fafc}html.bf023-ui-light .bf023-panel-head,html.bf023-ui-light .bf023-inspector-title{background:#e7eef5;color:#18344e;border-color:#aebdca}html.bf023-ui-light .bf023-panel-head button{background:#fff;color:#18344e;border-color:#879daf}
html.bf023-ui-light .bf023-sample-info{background:#eef4f8;color:#405b72;border-color:#aebdca}html.bf023-ui-light .bf023-sample-info strong{color:#18344e}html.bf023-ui-light .bf023-sample-info span{color:#4b657a}
html.bf023-ui-light .bf023-source-wrap{background:#fff}html.bf023-ui-light .bf023-line-numbers{background:#edf3f7;color:#52687b;border-right-color:#b7c5d0}html.bf023-ui-light .bf023-highlight{color:#172b3d}html.bf023-ui-light .bf023-highlight .tok-directive{color:#005f9f}html.bf023-ui-light .bf023-highlight .tok-type{color:#613a91}html.bf023-ui-light .bf023-highlight .tok-string{color:#236a31}html.bf023-ui-light .bf023-highlight .tok-port{color:#7a4f00}html.bf023-ui-light .bf023-highlight .tok-joint{color:#963452}html.bf023-ui-light .bf023-highlight .tok-comment{color:#536678}html.bf023-ui-light .bf023-highlight .has-error{background:#d7424a22;text-decoration-color:#b42332}
html.bf023-ui-light .bf023-source{caret-color:#005f9f}html.bf023-ui-light .bf023-source-foot{background:#edf3f8;color:#405b72;border-top-color:#b7c5d0}html.bf023-ui-light .bf023-source-foot b{color:#294d6b}
html.bf023-ui-light .bf023-properties{background:#f7fafc;color:#172b3d}html.bf023-ui-light .bf023-prop-grid label{color:#324f68}html.bf023-ui-light .bf023-prop-grid input,html.bf023-ui-light .bf023-prop-grid select,html.bf023-ui-light .bf023-prop-grid textarea{background:#fff;color:#142d43;border-color:#91a6b8}html.bf023-ui-light .bf023-prop-grid input[readonly]{background:#edf2f6;color:#51687b}
html.bf023-ui-light .bf023-readonly{color:#476176;border-color:#9caebd}html.bf023-ui-light .bf023-field-editor{border-color:#aebdca}html.bf023-ui-light .bf023-field-editor h4,html.bf023-ui-light .bf023-joint-browser h4{color:#294d6b}html.bf023-ui-light .bf023-field-row,html.bf023-ui-light .bf023-joint-row{background:#fff;color:#29465e;border-color:#9eb0bf}html.bf023-ui-light .bf023-field-row button,html.bf023-ui-light .bf023-joint-row button{background:#e8f0f6;color:#17364f;border-color:#7894aa}html.bf023-ui-light .bf023-joint-row:hover,html.bf023-ui-light .bf023-joint-row.is-selected{background:#dcecf8;border-color:#087abd}
html.bf023-ui-light .bf023-validation th{background:#e7eef5;color:#304f68;border-color:#aebdca}html.bf023-ui-light .bf023-validation td{color:#2d465b;border-color:#d2dce4}html.bf023-ui-light .bf023-validation tr:hover td{background:#eaf3fa}html.bf023-ui-light .bf023-empty{color:#526a7d!important}html.bf023-ui-light .bf023-counter{color:#405b72;border-color:#91a8ba}
html.bf023-ui-light .bf023-definition{background:#fff;color:#213d55}html.bf023-ui-light .bf023-definition-tabs button.is-active{color:#005f9f;border-color:#087abd}
html.bf023-ui-light .bf023-console-panel{background:#edf3f7;border-color:#aebdca}html.bf023-ui-light .bf023-console{background:#f8fafc}html.bf023-ui-light .bf023-log{color:#425d73;border-color:#d5dee6}html.bf023-ui-light .bf023-log em{color:#315f83}html.bf023-ui-light .bf023-log.is-info strong{color:#006dab}
html.bf023-ui-light .bf023-test-panel{background:#edf3f7;border-color:#aebdca}html.bf023-ui-light .bf023-test-result{color:#3d566b}html.bf023-ui-light .bf023-test-summary button{background:#fff;color:#17364f;border-color:#7894aa}html.bf023-ui-light .bf023-test-result.fail{background:#fff2f3;color:#8d1e2b;border-color:#c98890}html.bf023-ui-light .bf023-test-result.fail pre{background:#fff;color:#263d50;border-color:#d4b0b4}
html.bf023-ui-light .bf023-settings-pop{background:#fff;color:#172b3d;border-color:#8198ab;box-shadow:0 12px 36px #27435b33}html.bf023-ui-light .bf023-settings-pop label{color:#324f68}html.bf023-ui-light .bf023-settings-pop select{background:#fff;color:#142d43;border-color:#91a6b8}html.bf023-ui-light .bf023-settings-divider{background:#c3cfd9}
html.bf023-ui-light .bf023-font-zoom span{color:#355d7d}
html.bf023-ui-light .bf023-vsplitter::after{background:#72899b77}

@media(max-width:1080px){body{min-width:620px}.bf023-main{grid-template-columns:minmax(300px,1fr) minmax(340px,1.15fr);grid-template-rows:minmax(390px,1fr) minmax(180px,28vh) auto}.bf023-inspector{grid-column:1 / span 2;grid-row:3;display:grid;grid-template-columns:220px 1fr;max-height:320px}.bf023-console-panel{height:150px}.bf023-toolbar .hide-narrow{display:none}}

.bf023-line-numbers .is-error-line{color:#ff7d88;font-weight:700}.bf023-line-numbers .is-warning-line{color:#e8bb62}

.bf023-preview.is-panning{cursor:grabbing;user-select:none}

.bf023-accordion-panel{overflow:hidden}.bf023-accordion-toggle{min-width:26px!important;padding:0 6px!important;font-size:14px!important;line-height:20px}.bf023-validation-panel.is-collapsed,.bf023-definition-panel.is-collapsed{height:34px}.bf023-console-panel.is-collapsed{height:34px;min-height:34px}.bf023-validation-panel.is-collapsed .bf023-table-wrap,.bf023-definition-panel.is-collapsed .bf023-definition,.bf023-console-panel.is-collapsed .bf023-console{display:none}.bf023-definition-panel.is-collapsed .bf023-panel-head>.bf023-definition-tabs,.bf023-definition-panel.is-collapsed .bf023-panel-head>button:not(.bf023-accordion-toggle){display:none}.bf023-validation-panel.is-collapsed .bf023-counter{display:none}

/* #023 v1.0.34 Joint quick edit menu */
.bf023-joint-mini-menu{position:absolute;z-index:40;width:min(300px,calc(100% - 16px));padding:0;border:1px solid #4e7697;border-radius:8px;background:#0d1b2aee;color:#eaf4ff;box-shadow:0 10px 28px #000a,0 0 0 1px #70d7ff22;backdrop-filter:blur(4px);font-size:11px;cursor:default;touch-action:auto}.bf023-joint-mini-menu[hidden]{display:none!important}.bf023-joint-mini-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:7px 8px;border-bottom:1px solid #304d67;background:#12283c;border-radius:8px 8px 0 0}.bf023-joint-mini-head strong{color:#8ce5ff;font-size:12px}.bf023-joint-mini-head span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#a9c1d6}.bf023-joint-mini-head button{width:24px;height:24px;padding:0;border:1px solid #47627c;border-radius:5px;background:#172d43;color:#eaf4ff;cursor:pointer}.bf023-joint-mini-grid{display:grid;gap:8px;padding:9px}.bf023-joint-mini-grid label{display:grid;gap:4px;color:#a9bfd3;font-weight:700}.bf023-joint-mini-grid select,.bf023-joint-mini-grid input[type="text"],.bf023-joint-mini-grid input[type="number"],.bf023-joint-mini-grid textarea{width:100%;min-width:0;border:1px solid #38536d;border-radius:5px;background:#081522;color:#eef7ff;padding:6px 7px;font:inherit}.bf023-joint-mini-grid textarea{resize:vertical;min-height:44px}.bf023-joint-mini-grid input.is-invalid{border-color:#ff667a;box-shadow:0 0 0 1px #ff667a66}.bf023-joint-mini-color{display:grid;grid-template-columns:38px 1fr;gap:6px}.bf023-joint-mini-color-trigger{width:38px;height:30px;padding:1px;border:1px solid #38536d;border-radius:5px;background:#55aaff;cursor:pointer;box-shadow:inset 0 0 0 2px #081522}.bf023-joint-mini-color-trigger:hover{border-color:#70d7ff}.bf023-joint-mini-color-trigger:focus-visible{outline:2px solid var(--bf023-accent);outline-offset:1px}.bf023-joint-mini-check{grid-template-columns:auto 1fr!important;align-items:center;justify-content:start}.bf023-joint-mini-check input{accent-color:#4ed8ff}.bf023-joint-mini-range{display:grid;grid-template-columns:minmax(90px,1fr) 64px auto;gap:6px;align-items:center}.bf023-joint-mini-range input[type="range"]{width:100%;accent-color:#52d7ff}.bf023-joint-mini-range span{color:#8faac0;font-weight:500}

/* v1.0.34: Joint mini menu is anchored beside the persistent selected-Joint ≡ affordance. */
.bf023-joint-mini-menu::before{content:"";position:absolute;left:-7px;top:var(--bf023-menu-arrow-y,50%);width:12px;height:12px;transform:translateY(-50%) rotate(45deg);background:#0d1b2a;border-left:1px solid #4e7697;border-bottom:1px solid #4e7697;pointer-events:none}
.bf023-joint-mini-menu.is-left-of-anchor::before{left:auto;right:-7px;border-left:0;border-bottom:0;border-right:1px solid #4e7697;border-top:1px solid #4e7697}

/* #023 v1.0.34 Joint reconnect interaction */
.bf023-preview.is-reconnecting{cursor:grabbing!important}

/* v1.0.34 Runtime QA failure diagnostics */
.bf023-test-summary .grow{flex:1}.bf023-test-summary button{border:1px solid #38536d;border-radius:4px;background:#10263b;color:#ccecff;padding:3px 7px;font:10px Meiryo,sans-serif;cursor:pointer}.bf023-test-summary button:disabled{opacity:.35;cursor:default}
.bf023-test-result.fail{grid-column:1/-1;border:1px solid #713746;border-radius:5px;background:#1a1118;padding:5px 7px;color:#ff9ba7}.bf023-test-result.fail::before{content:none}.bf023-test-result.fail summary{cursor:pointer;font-weight:700}.bf023-test-result.fail pre{margin:5px 0 0;padding:7px;overflow:auto;white-space:pre-wrap;word-break:break-word;background:#090d13;border:1px solid #392433;border-radius:4px;color:#d9e2ea;font:10px/15px Consolas,monospace}


/* #023 v1.0.34 Runtime QA accordion + flow settings mini menu */
.bf023-test-panel.is-collapsed .bf023-test-results{display:none}.bf023-test-panel.is-collapsed{padding-top:6px;padding-bottom:6px}.bf023-test-panel .bf023-accordion-toggle{margin-left:2px}
.bf023-source-panel{position:relative}.bf023-flow-settings-button{border-color:#3c607d!important;color:#bfe9ff!important}.bf023-flow-settings-menu{position:absolute;z-index:60;top:34px;right:8px;width:min(380px,calc(100% - 16px));border:1px solid #4d7597;border-radius:8px;background:#0c1a29f5;color:#e7f2fc;box-shadow:0 12px 30px #000a;backdrop-filter:blur(5px);font:11px Meiryo,"Segoe UI",sans-serif}.bf023-flow-settings-menu[hidden]{display:none!important}.bf023-flow-settings-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:8px 9px;border-bottom:1px solid #304a62;background:#12273a;border-radius:8px 8px 0 0}.bf023-flow-settings-head strong{font-size:12px;color:#8ee2ff}.bf023-flow-settings-head span{color:#7895ad;font-size:10px}.bf023-flow-settings-head button{width:24px;height:24px;padding:0}.bf023-flow-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px}.bf023-flow-settings-grid label{display:grid;gap:4px;color:#a8bdd0;font-weight:700}.bf023-flow-settings-grid input,.bf023-flow-settings-grid select{width:100%;min-width:0;border:1px solid #36536e;border-radius:5px;background:#071522;color:#eef7ff;padding:6px 7px;font:11px Meiryo,"Segoe UI",sans-serif}.bf023-flow-settings-error{min-height:18px;margin:0 10px;color:#ff8995;font-size:10px}.bf023-flow-settings-actions{display:flex;justify-content:flex-end;gap:7px;padding:8px 10px 10px;border-top:1px solid #233d54}.bf023-flow-settings-actions button{min-width:76px}.bf023-flow-settings-actions button.primary{border-color:#48aee6;background:#0f4b70;color:#eaf8ff}
@media(max-width:760px){.bf023-flow-settings-grid{grid-template-columns:1fr}}

/* #023 v1.0.34 resizable panes / accessibility font zoom */
.bf023-vsplitter{position:absolute;top:0;bottom:0;width:9px;transform:translateX(-4.5px);z-index:36;cursor:col-resize;touch-action:none;background:transparent}
.bf023-vsplitter::after{content:"";position:absolute;left:4px;top:0;bottom:0;width:1px;background:#46627d55;transition:background .12s,box-shadow .12s}
.bf023-vsplitter:hover::after,.bf023-vsplitter.is-dragging::after{background:#58bfff;box-shadow:0 0 6px #58bfffaa}
.bf023-app.is-resizing-panels,.bf023-app.is-resizing-panels *{cursor:col-resize!important;user-select:none!important}
.bf023-font-zoom{display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.bf023-font-zoom button{min-width:24px;height:22px!important;padding:0 5px!important;font-size:13px!important;line-height:20px}
.bf023-font-zoom span{min-width:42px;text-align:center;color:#9fc1dd;font:10px Consolas,monospace}
.bf023-inspector-title .grow{flex:1}
.bf023-properties{font-size:var(--bf023-property-font-size)}
.bf023-properties .bf023-prop-grid label{font-size:var(--bf023-property-font-size);line-height:1.35}
.bf023-properties .bf023-prop-grid input,.bf023-properties .bf023-prop-grid select,.bf023-properties .bf023-prop-grid textarea{font-size:var(--bf023-property-font-size);line-height:1.35}
.bf023-properties .bf023-readonly,.bf023-properties .bf023-field-editor h4,.bf023-properties .bf023-joint-browser h4,.bf023-properties .bf023-joint-row,.bf023-properties .bf023-field-row button,.bf023-properties .bf023-joint-row button{font-size:var(--bf023-property-font-size);line-height:1.35}
@media(max-width:1080px){.bf023-vsplitter{display:none}}


/* #023 v1.0.62 Source input guide / live #021 Shape catalog */
.bf023-input-guide-button{border-color:#5a7d44!important;background:#173022!important;color:#c9f6be!important}.bf023-input-guide-button:hover{border-color:#86c966!important;background:#21412f!important}
.bf023-guide-overlay{position:fixed;inset:0;z-index:140;background:#02070dcc;display:flex;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(4px)}.bf023-guide-overlay[hidden]{display:none!important}.bf023-guide-dialog{width:min(1180px,96vw);height:min(860px,94vh);display:grid;grid-template-rows:auto minmax(0,1fr) auto;border:1px solid #476884;border-radius:10px;background:#0a1725;color:#d9e8f5;box-shadow:0 20px 70px #000d;overflow:hidden}.bf023-guide-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border-bottom:1px solid #2b465e;background:#10243a}.bf023-guide-head>div{display:grid;gap:2px}.bf023-guide-head strong{font-size:16px;color:#b7e7ff}.bf023-guide-head span{font-size:10px;color:#7899b5}.bf023-guide-head button{width:32px;height:32px;border:1px solid #46647e;border-radius:6px;background:#152b40;color:#e7f5ff;font-size:18px;cursor:pointer}.bf023-guide-body{min-height:0;display:grid;grid-template-columns:170px minmax(0,1fr)}.bf023-guide-nav{padding:12px 9px;border-right:1px solid #243c53;background:#081421;overflow:auto}.bf023-guide-nav a{display:block;margin:0 0 5px;padding:7px 8px;border-radius:5px;color:#9db7cd;text-decoration:none;font-size:11px}.bf023-guide-nav a:hover{background:#122942;color:#dff4ff}.bf023-guide-content{padding:14px 18px 30px;overflow:auto;scroll-behavior:smooth}.bf023-guide-section{padding:2px 0 18px;border-bottom:1px solid #1e354a;margin-bottom:18px}.bf023-guide-section:last-child{border-bottom:0}.bf023-guide-section h2{margin:0 0 9px;color:#8fdcff;font-size:14px}.bf023-guide-section p{margin:7px 0;color:#a8bdcf;font-size:11px;line-height:1.75}.bf023-guide-section b{color:#dbeaf6}.bf023-guide-section code{padding:1px 4px;border:1px solid #28435b;border-radius:3px;background:#07121d;color:#ffd58b;font:10px Consolas,monospace}.bf023-guide-section table{width:100%;border-collapse:collapse;margin:8px 0 12px;font-size:10px}.bf023-guide-section th,.bf023-guide-section td{padding:7px 8px;border:1px solid #29445b;text-align:left;vertical-align:top}.bf023-guide-section th{background:#10253a;color:#9edfff}.bf023-guide-section td{color:#b5c7d6}.bf023-guide-code{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start;margin:8px 0;padding:8px;border:1px solid #28445b;border-radius:7px;background:#07131f}.bf023-guide-code pre{margin:0;min-width:0;overflow:auto;white-space:pre;color:#d8e8f5;font:10px/1.55 Consolas,"Cascadia Mono",monospace}.bf023-guide-code button,.bf023-guide-foot button{border:1px solid #3b7298;border-radius:5px;background:#103653;color:#dff5ff;padding:6px 9px;font:10px Meiryo,sans-serif;cursor:pointer}.bf023-guide-code button:hover,.bf023-guide-foot button:hover{border-color:#6ac4f1;background:#174c70}.bf023-guide-shape-host{display:block;min-height:110px;margin-top:9px;padding:8px;border:1px solid #26445c;border-radius:7px;background:#07131f}.bf023-guide-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 14px;border-top:1px solid #29445c;background:#0d1f31;color:#7894aa;font-size:10px}
html.bf023-ui-light .bf023-guide-overlay{background:#152c3d88}html.bf023-ui-light .bf023-guide-dialog{background:#f8fbfd;color:#17344b;border-color:#7894aa}html.bf023-ui-light .bf023-guide-head{background:#e9f1f6;border-color:#b7c7d4}html.bf023-ui-light .bf023-guide-head strong{color:#125c89}html.bf023-ui-light .bf023-guide-nav{background:#eef4f8;border-color:#c5d1db}html.bf023-ui-light .bf023-guide-nav a{color:#345b76}html.bf023-ui-light .bf023-guide-nav a:hover{background:#dcebf5;color:#124c70}html.bf023-ui-light .bf023-guide-section{border-color:#c8d5df}html.bf023-ui-light .bf023-guide-section h2{color:#00689f}html.bf023-ui-light .bf023-guide-section p{color:#38576e}html.bf023-ui-light .bf023-guide-section code{background:#fff;color:#8b5200;border-color:#b6c8d6}html.bf023-ui-light .bf023-guide-section th{background:#e7f1f7;color:#175777;border-color:#afc2d0}html.bf023-ui-light .bf023-guide-section td{color:#334f63;border-color:#c3d1db}html.bf023-ui-light .bf023-guide-code,html.bf023-ui-light .bf023-guide-shape-host{background:#fff;border-color:#b9cad6}html.bf023-ui-light .bf023-guide-code pre{color:#253f54}html.bf023-ui-light .bf023-guide-foot{background:#eaf2f7;color:#45657b;border-color:#bdccd7}
@media(max-width:820px){.bf023-guide-overlay{padding:8px}.bf023-guide-dialog{width:99vw;height:97vh}.bf023-guide-body{grid-template-columns:1fr}.bf023-guide-nav{display:flex;gap:4px;overflow:auto;border-right:0;border-bottom:1px solid #243c53;padding:6px}.bf023-guide-nav a{white-space:nowrap;margin:0}.bf023-guide-code{grid-template-columns:1fr}.bf023-guide-code button{justify-self:start}}


/* #023 v1.0.82 FIT-visible viewport / fixed Source header / no button text clipping */
.bf023-toolbar{height:var(--bf023-toolbar-h);min-height:var(--bf023-toolbar-h);flex:0 0 var(--bf023-toolbar-h);flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
.bf023-toolbar .group{flex:0 0 auto;min-width:max-content;flex-wrap:nowrap}
.bf023-toolbar button,.bf023-toolbar .tool,.bf023-toolbar select,.bf023-toolbar input,.bf023-dirty,.bf023-status-pill{flex:0 0 auto;white-space:nowrap}
.bf023-toolbar button,.bf023-toolbar .tool{min-width:max-content;line-height:1;padding-left:8px;padding-right:8px}
.bf023-toolbar .spacer{flex:1 0 6px;min-width:6px}
.bf023-panel-head{min-height:34px;flex:0 0 34px;white-space:nowrap}
.bf023-panel-head button{white-space:nowrap;line-height:1.2;min-width:max-content;flex:0 0 auto}
.bf023-source-panel{overflow:visible}
.bf023-source-panel>.bf023-panel-head{position:sticky;top:var(--bf023-toolbar-h);z-index:49;overflow:hidden;box-shadow:0 2px 7px #0007}
.bf023-source-panel>.bf023-panel-head>*{flex:0 0 auto}
.bf023-source-panel>.bf023-panel-head>.grow{flex:1 1 8px;min-width:8px}
.bf023-source-wrap{overflow:hidden}

.bf023-toolbar::-webkit-scrollbar{height:4px}.bf023-toolbar::-webkit-scrollbar-thumb{background:#35516d;border-radius:4px}


/* #023 v1.0.85 responsive two-row toolbar / dynamic sticky offset */
.bf023-toolbar{
  height:auto;
  min-height:46px;
  flex:0 0 auto;
  flex-wrap:wrap;
  align-content:center;
  row-gap:5px;
  overflow:visible;
  width:100%;
  max-width:100%;
}
.bf023-toolbar .group{flex:0 0 auto;min-width:0;max-width:100%;flex-wrap:nowrap}
.bf023-toolbar .spacer{flex:1 1 12px;min-width:12px}
.bf023-toolbar button,.bf023-toolbar .tool,.bf023-toolbar select,.bf023-toolbar input,.bf023-dirty,.bf023-status-pill{white-space:nowrap;max-width:100%}
.bf023-toolbar::-webkit-scrollbar{display:none}
.bf023-source-panel>.bf023-panel-head{top:var(--bf023-toolbar-h)}


/* #023 detached Preview: actual renderer in a resizable browser window; no surrounding editor card/frame. */
html.bf023-preview-only,html.bf023-preview-only body{width:100%;height:100%;min-width:0;min-height:0;overflow:hidden}
html.bf023-preview-only .bf023-app{height:100vh;min-height:0;background:#0a1420}
html.bf023-preview-only .bf023-toolbar,html.bf023-preview-only .bf023-test-panel,html.bf023-preview-only .bf023-guide-overlay,html.bf023-preview-only .bfhc-entry-panel{display:none!important}
html.bf023-preview-only .bf023-main{display:flex;flex:1;width:100%;height:100vh;min-height:0;background:#0a1420;gap:0}
html.bf023-preview-only .bf023-main>*{display:none!important}
html.bf023-preview-only .bf023-main>.bf023-preview-panel{display:flex!important;position:relative;flex:1;width:100%;height:100vh;min-width:0;min-height:0;border:0;border-radius:0;background:#0a1420}
html.bf023-preview-only .bf023-preview-panel>.bf023-panel-head{height:34px;min-height:34px;flex:0 0 34px;border:0;border-bottom:1px solid #263b53}
html.bf023-preview-only .bf023-preview-tools{display:none!important}
html.bf023-preview-only .bf023-preview{flex:1;width:100%;height:auto;min-height:0;border:0}
html.bf023-preview-only .bf023-minimap{display:none!important}
#bf023-detach-preview[data-active="1"]{border-color:#56b9ea;background:#16405c;color:#eaf8ff}

/* #023 v1.0.101 detached Preview controls: full viewport, no nested detach action, no Console / Log panel. */
.bf023-detached-zoom-controls{display:inline-flex;align-items:center;gap:5px}
.bf023-detached-zoom-controls[hidden]{display:none!important}
.bf023-detached-zoom-controls button{height:26px;min-width:32px;padding:0 8px;border:1px solid #36536d;border-radius:4px;background:#102437;color:#e6f3ff;font-weight:700}
.bf023-detached-zoom-controls output{min-width:48px;text-align:center;color:#b9d3e9;font:11px Consolas,monospace}
html.bf023-preview-only #bf023-detach-preview{display:none!important}
html.bf023-preview-only #bf023-console-accordion{display:none!important}
html.bf023-preview-only .bf023-preview-panel>.bf023-panel-head{padding:0 8px}