/* Bone Flow #119 State test UI / Package 1.0.26 */
:root{
  color-scheme:dark;
  --bf-bg:#0b1220;--bf-page:#0f1729;--bf-panel:#101b2d;--bf-panel-2:#0d1727;
  --bf-line:#344866;--bf-line-soft:#263a57;--bf-text:#eef4ff;--bf-muted:#9fb0c7;
  --bf-blue:#5ba6ff;--bf-green:#43d19e;--bf-yellow:#f4c95d;--bf-orange:#f5a623;--bf-red:#ff7185;
  --bf-button:#17263b;--bf-input:#0a1424;--bf-radius:11px;
}
*{box-sizing:border-box}html{background:var(--bf-bg)}body{margin:0;background:var(--bf-bg);color:var(--bf-text);font-family:Inter,"Segoe UI","Yu Gothic UI","Meiryo",sans-serif;font-size:14px;line-height:1.55}
button,input,select{font:inherit}.bf-page{width:min(1120px,calc(100% - 44px));margin:24px auto 52px}.bf-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:start;padding:18px 0 20px;border-bottom:1px solid var(--bf-line-soft);margin-bottom:18px}.bf-header h1{font-size:25px;line-height:1.2;margin:0 0 7px;font-weight:800;letter-spacing:.01em}.bf-header p{margin:0;color:var(--bf-muted);max-width:760px}.bf-header-side{display:grid;gap:11px;justify-items:end}.bf-header-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.bf-header-button,.bf-actions button,.bf-guide-close,.bf-guide-nav button,.bf-state-buttons button{border:1px solid #405675;background:var(--bf-button);color:var(--bf-text);border-radius:6px;min-height:34px;padding:7px 11px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-weight:650}.bf-header-button:hover,.bf-actions button:hover,.bf-guide-nav button:hover,.bf-state-buttons button:hover{border-color:var(--bf-blue);background:#1b304b}.bf-actions button:disabled{opacity:.45;cursor:not-allowed}.bf-actions .primary{background:#176bb0;border-color:#3f9be4}.bf-actions .ok{background:#166f4d;border-color:#34b984}.bf-actions .danger{background:#793343;border-color:#bd5066}.bf-meta-row{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.bf-badge{display:inline-flex;align-items:center;min-height:24px;border:1px solid #405675;background:#0c1626;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:750;color:#dfeaff;white-space:nowrap}.bf-badge.dev{border-color:#6e7d91}.bf-badge.pass{border-color:#238e67;color:#74e5b6}.bf-badge.fail{border-color:#b54a5f;color:#ff9bab}.bf-badge.wait{border-color:#ae8b32;color:#ffe395}

.bf-dependency-strip{border:1px solid #2f4562;border-radius:8px;background:#0c1728;padding:9px 11px;margin:0 0 12px;display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:11px}.bf-dependency-strip>strong{font-size:12px}.bf-dependency-strip a{color:#dceaff;text-decoration:none;border:1px solid #334b69;border-radius:6px;padding:4px 7px;background:#101d30}.bf-dependency-strip a:hover{border-color:var(--bf-blue)}.bf-dependency-strip a span,.bf-dependency-health{color:var(--bf-muted)}.bf-dependency-health b{color:#dceaff;margin-left:3px}.bf-dependency-health b.is-ready{color:var(--bf-green)}.bf-dependency-health b.is-error{color:var(--bf-red)}
.bf-panel{background:var(--bf-panel);border:1px solid var(--bf-line);border-radius:var(--bf-radius);padding:16px;margin:12px 0}.bf-panel h2{font-size:18px;margin:0 0 12px;line-height:1.3}.bf-panel h2 small{font-size:11px;color:var(--bf-muted);font-weight:500}.bf-panel h3{font-size:14px;margin:0 0 9px}.bf-help,.bf-note{color:var(--bf-muted);margin:7px 0 12px}.bf-note{background:#0c1728;border-left:3px solid var(--bf-blue);padding:9px 11px;border-radius:4px}.bf-layout{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:14px}.bf-subpanel{background:var(--bf-panel-2);border:1px solid var(--bf-line-soft);border-radius:9px;padding:12px}.bf-subpanel>h3{font-size:15px;margin-bottom:10px}.bf-component-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.bf-component-card{border:1px solid var(--bf-line-soft);background:var(--bf-panel-2);border-radius:8px;padding:10px 11px;display:grid;gap:4px;min-height:70px}.bf-component-card strong{font-size:13px}.bf-component-card span{color:var(--bf-muted);font-size:12px}.bf-component-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.bf-component-heading a{color:#edf5ff;text-decoration:none;font-weight:800}.bf-component-heading a:hover{color:#83bfff}.bf-use-badge{border:1px solid #247c5d;border-radius:999px;padding:1px 7px;color:#79e2b8!important;font-size:9px!important;font-weight:800}.bf-component-detail{display:grid;grid-template-columns:.8fr .8fr .8fr 2.6fr;gap:6px;margin-top:3px}.bf-component-detail>span{border-top:1px solid #213552;padding-top:5px;display:grid;gap:1px;font-size:9px!important}.bf-component-detail b{font-size:10px;color:#dceaff;overflow-wrap:anywhere}.bf-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.bf-form-grid label{display:grid;gap:5px;color:#c7d5e7;font-size:12px;font-weight:650}.bf-form-grid input,.bf-form-grid select{width:100%;min-height:38px;border:1px solid #425879;border-radius:6px;background:var(--bf-input);color:var(--bf-text);padding:7px 9px;outline:none}.bf-form-grid input:focus,.bf-form-grid select:focus{border-color:var(--bf-blue);box-shadow:0 0 0 2px rgba(91,166,255,.12)}.bf-span-2{grid-column:1/-1}.bf-actions{display:flex;gap:7px;flex-wrap:wrap;align-items:center}.bf-actions button{min-height:33px;font-size:12px}.bf-state-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:11px}.bf-state-buttons button{min-height:31px;padding:5px 6px;font-size:11px}.bf-preview-stage{min-height:210px;border:1px dashed #49627f;border-radius:8px;display:grid;place-items:center;padding:20px;background:#0a1423}.bf-preview-target{width:min(330px,92%);min-height:104px;border:1px solid var(--bf-blue);border-radius:9px;background:#16304a;display:grid;place-items:center;align-content:center;gap:7px;padding:16px;text-align:center;transition:border-color .12s,box-shadow .12s,opacity .12s,transform .12s}.bf-preview-target>[data-bf-part="label"]{display:inline-block;font-size:16px;font-weight:750}.bf-preview-target small{color:#b7c7dc}.bf-preview-target[data-bf-state="Hover"]{box-shadow:0 0 0 2px rgba(91,166,255,.25)}.bf-preview-target[data-bf-state="Focus"]{box-shadow:0 0 0 3px rgba(91,166,255,.38)}.bf-preview-target[data-bf-state="Active"]{transform:translateY(1px)}.bf-preview-target[data-bf-state="Disabled"]{opacity:.45}.bf-preview-target[data-bf-state="Selected"],.bf-preview-target[data-bf-state="Checked"]{border-color:var(--bf-green);box-shadow:0 0 0 2px rgba(67,209,158,.2)}.bf-preview-target[data-bf-state="Error"]{border-color:var(--bf-red);box-shadow:0 0 0 2px rgba(255,113,133,.2)}.bf-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:9px}.bf-stat{border:1px solid var(--bf-line-soft);border-radius:7px;background:#0b1626;padding:7px 9px;display:grid;gap:2px}.bf-stat span{font-size:10px;color:var(--bf-muted)}.bf-stat strong{font-size:12px;overflow-wrap:anywhere}.bf-code,pre{margin:9px 0 0;background:#07111f;border:1px solid #314965;border-radius:7px;padding:10px;color:#d7e7fb;font-family:"Cascadia Code",Consolas,monospace;font-size:11px;line-height:1.5;white-space:pre-wrap;overflow:auto;max-height:240px}
.bf-functional-live{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:12px}.bf-functional-live .bf-code{margin:0}.bf-fc-result{display:grid;gap:7px}.bf-fc-row{display:grid;grid-template-columns:125px 1fr;gap:9px;border-bottom:1px solid #203552;padding:6px 0}.bf-fc-row:last-child{border-bottom:0}.bf-fc-row span{color:var(--bf-muted);font-size:11px}.bf-fc-row strong{font-size:12px;overflow-wrap:anywhere}.bf-controller-chip{display:inline-flex;border:1px solid #7655c7;background:#171b38;border-radius:6px;padding:5px 8px;font-size:11px;color:#dbcfff}
.bf-connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.bf-connection-card{border:1px solid var(--bf-line-soft);border-radius:9px;background:var(--bf-panel-2);padding:10px;min-width:0}.bf-connection-card.normal{grid-column:1/-1}.bf-connection-card h3{font-size:13px;margin-bottom:8px}.bf-connection-stage{position:relative;height:138px;border:1px solid #2d435f;border-radius:7px;background:#091423;overflow:hidden}.bf-connection-stage svg{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}.bf-node{position:absolute;z-index:2;top:39px;width:130px;min-height:58px;border:1px solid #466486;border-radius:7px;background:#102239;padding:7px 8px;display:grid;place-items:center;align-content:center;text-align:center;font-size:11px;line-height:1.35}.bf-node.source{left:4.5%}.bf-node.component{left:50%;transform:translateX(-50%)}.bf-node.target{right:4.5%}.bf-node b{font-size:12px}.bf-node small{color:#7fc1ff}.bf-node.error{border-color:#b7485c;color:#ffd4db}.bf-node.mismatch{border-color:#b77a21;color:#ffe2aa}.bf-diagnostic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-top:7px}.bf-diagnostic.eight{grid-template-columns:repeat(4,minmax(0,1fr))}.bf-diag{background:#0a1628;border:1px solid #213754;border-radius:5px;padding:5px 7px;display:flex;justify-content:space-between;gap:6px;font-size:10px}.bf-diag span{color:#9fb4cc}.bf-diag strong{font-size:10px}.bf-diag .ok{color:#9ff0cb}.bf-diag .bad{color:#ff9bac}.bf-diag .warn{color:#ffd48a}.bf-legend{display:flex;gap:14px;flex-wrap:wrap;color:var(--bf-muted);font-size:11px;margin-top:10px}.bf-legend span::before{content:"";display:inline-block;width:20px;height:3px;border-radius:2px;vertical-align:middle;margin-right:5px}.bf-legend .in::before{background:var(--bf-blue)}.bf-legend .out::before{background:var(--bf-green)}.bf-legend .mismatch::before{background:var(--bf-orange)}.bf-legend .error::before{background:var(--bf-red)}
.bf-security-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:12px}.bf-security-status{margin-top:10px;border:1px solid var(--bf-line-soft);border-radius:7px;background:#0a1626;padding:8px;display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;font-size:11px}.bf-security-status strong.block{color:var(--bf-red)}.bf-security-status strong.pass{color:var(--bf-green)}
.bf-delivery-stage{position:relative;height:125px;border:1px solid #2d435f;border-radius:8px;background:#091423;overflow:hidden;margin:10px 0}.bf-delivery-stage svg{position:absolute;inset:0;width:100%;height:100%;z-index:1}.bf-delivery-node{position:absolute;z-index:2;top:31px;width:145px;min-height:62px;border:1px solid #466486;border-radius:7px;background:#102239;padding:7px;text-align:center;display:grid;place-items:center;align-content:center;font-size:11px}.bf-delivery-node.source{left:7%}.bf-delivery-node.target{right:7%}.bf-delivery-node b{font-size:12px}.bf-delivery-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:8px 0}.bf-delivery-summary .bf-stat{min-height:55px}.bf-confirm-list{display:grid;gap:6px;margin-top:9px}.bf-confirm-list label{display:flex;gap:8px;align-items:flex-start;border:1px solid #203552;border-radius:6px;background:#0b1728;padding:7px 8px;font-size:11px}.bf-confirm-list input{margin-top:2px}.bf-confirm-list .bf-confirm-mirror{color:var(--bf-muted);background:#0a1525}.bf-confirm-list .bf-confirm-mirror>span[aria-hidden="true"]{color:var(--bf-blue);font-weight:900}.bf-preview-contract{margin:8px 0 0;padding:7px 9px;border-left:3px solid #6d5bd0;background:#0d1729;border-radius:4px;font-size:10px}
.bf-qa-actions{margin-bottom:10px}.bf-report-summary{display:grid;grid-template-columns:1.05fr 1.55fr repeat(7,.72fr);gap:6px}.bf-report-summary>div{border:1px solid var(--bf-line-soft);background:#0b1728;border-radius:7px;min-height:58px;padding:7px 9px;display:grid;align-content:center;gap:2px}.bf-report-summary span{font-size:10px;color:var(--bf-muted)}.bf-report-summary strong{font-size:14px}.bf-qa-layout{margin-top:10px}.bf-result-header{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:7px}.bf-results{display:grid;grid-template-columns:1fr 1fr;gap:6px}.bf-result{border:1px solid #2a4262;background:#0a1627;border-radius:6px;padding:7px 8px;display:grid;grid-template-columns:auto 1fr auto;gap:7px;align-items:start;min-height:49px}.bf-result .id{font-size:10px;font-weight:800;color:#8bbff5}.bf-result .name{font-size:11px}.bf-result .message{grid-column:2/4;color:var(--bf-muted);font-size:9px;line-height:1.35}.bf-result .status{font-size:9px;font-weight:900}.bf-result.pass{border-color:#245e4b}.bf-result.pass .status{color:var(--bf-green)}.bf-result.fail{border-color:#7d3445}.bf-result.fail .status{color:var(--bf-red)}.bf-runtime-console{margin-top:10px}.bf-runtime-title{display:flex;justify-content:space-between;align-items:center;gap:8px}
.bf-completion{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:8px 0 10px}.bf-completion>div{border:1px solid var(--bf-line-soft);background:#0b1728;border-radius:7px;padding:7px 8px;font-size:10px;color:var(--bf-muted)}.bf-completion strong{display:block;color:var(--bf-text);font-size:12px;margin-top:2px;overflow-wrap:anywhere}.bf-functional-bar{margin-top:14px;border:1px solid #3a5272;border-radius:8px;background:#0c1728;padding:10px 12px;display:flex;justify-content:space-between;gap:14px;align-items:center}.bf-functional-bar span{display:grid;gap:2px}.bf-functional-bar small{color:var(--bf-muted);font-size:10px}.bf-functional-bar code{font-family:"Cascadia Code",Consolas,monospace;color:#d9c9ff;overflow-wrap:anywhere}
.bf-guide-modal[hidden]{display:none}.bf-guide-modal{position:fixed;inset:0;z-index:9999;background:rgba(3,7,14,.78);display:grid;place-items:center;padding:24px}.bf-guide-dialog{width:min(980px,96vw);height:min(760px,90vh);background:#0f192a;border:1px solid #48617f;border-radius:12px;box-shadow:0 24px 80px rgba(0,0,0,.45);display:grid;grid-template-rows:auto 1fr;overflow:hidden}.bf-guide-head{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:13px 15px;border-bottom:1px solid #2f4562;background:#111d30}.bf-guide-head h2{font-size:17px;margin:0}.bf-guide-head p{margin:2px 0 0;color:var(--bf-muted);font-size:11px}.bf-guide-close{min-width:38px;min-height:32px}.bf-guide-body{min-height:0;display:grid;grid-template-columns:220px 1fr}.bf-guide-nav{border-right:1px solid #2a405d;padding:10px;background:#0b1524;overflow:auto;display:grid;align-content:start;gap:5px}.bf-guide-nav button{justify-content:flex-start;text-align:left;width:100%;font-size:11px}.bf-guide-nav button.is-active{border-color:var(--bf-blue);background:#17304b}.bf-guide-content{padding:18px 20px;overflow:auto}.bf-guide-content h3{font-size:17px;margin:0 0 10px}.bf-guide-content h4{font-size:13px;margin:16px 0 6px}.bf-guide-content p,.bf-guide-content li{color:#c6d3e4;font-size:12px}.bf-guide-content table{width:100%;border-collapse:collapse;margin:8px 0;font-size:11px}.bf-guide-content th,.bf-guide-content td{border:1px solid #304865;padding:6px 8px;text-align:left}.bf-guide-content th{background:#14243a}.bf-guide-content code{font-family:"Cascadia Code",Consolas,monospace;color:#d9c9ff}.bf-guide-content pre{max-height:none}
.ja,.en{display:none}body[data-lang="ja"] .ja{display:initial}body[data-lang="en"] .en{display:initial}body[data-lang="ja"] span.ja,body[data-lang="en"] span.en{display:inline}body[data-lang="ja"] p.ja,body[data-lang="en"] p.en{display:block}

@media(max-width:980px){.bf-report-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.bf-component-detail{grid-template-columns:1fr 1fr}}
@media(max-width:820px){.bf-page{width:min(100% - 24px,1120px)}.bf-header{grid-template-columns:1fr}.bf-header-side{justify-items:start}.bf-header-actions,.bf-meta-row{justify-content:flex-start}.bf-layout,.bf-functional-live,.bf-security-grid{grid-template-columns:1fr}.bf-component-grid{grid-template-columns:1fr}.bf-connection-grid{grid-template-columns:1fr}.bf-connection-card.normal{grid-column:auto}.bf-diagnostic,.bf-diagnostic.eight{grid-template-columns:1fr 1fr}.bf-report-summary{grid-template-columns:1fr 1fr 1fr}.bf-results{grid-template-columns:1fr}.bf-completion{grid-template-columns:1fr 1fr 1fr}.bf-guide-body{grid-template-columns:160px 1fr}.bf-delivery-summary{grid-template-columns:1fr 1fr 1fr}.bf-state-buttons{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.bf-form-grid{grid-template-columns:1fr}.bf-span-2{grid-column:auto}.bf-connection-stage{height:280px}.bf-node{width:122px}.bf-node.source{top:16px;left:50%;transform:translateX(-50%)}.bf-node.component{top:105px}.bf-node.target{top:194px;right:auto;left:50%;transform:translateX(-50%)}.bf-report-summary{grid-template-columns:1fr 1fr}.bf-completion{grid-template-columns:1fr 1fr}.bf-guide-modal{padding:8px}.bf-guide-body{grid-template-columns:1fr;grid-template-rows:auto 1fr}.bf-guide-nav{border-right:0;border-bottom:1px solid #2a405d;display:flex;overflow:auto}.bf-guide-nav button{width:auto;white-space:nowrap}.bf-functional-bar{display:grid}.bf-delivery-stage{height:200px}.bf-delivery-node.source{left:50%;top:18px;transform:translateX(-50%)}.bf-delivery-node.target{right:auto;left:50%;top:116px;transform:translateX(-50%)}.bf-delivery-status{top:93px}.bf-delivery-summary{grid-template-columns:1fr 1fr}}

/* v1.0.5 State Relation presentation: Motion UI controller -> Target UI / Part. */
.bf-fc-relation{display:grid;grid-template-columns:minmax(150px,1fr) 32px minmax(150px,1fr);gap:10px;align-items:center;margin-bottom:8px}
.bf-fc-controller{min-height:48px;border:1px solid #7557bd;border-radius:7px;background:#151b35;padding:8px 10px;display:grid;align-content:center;gap:2px;text-align:left}
.bf-fc-controller strong{font-size:12px;color:#eadfff}.bf-fc-controller small{font-size:10px;color:#bcaee0}
.bf-relation-arrow{font-size:21px;font-weight:900;color:var(--bf-blue);text-align:center}
.bf-fc-demo{min-height:48px;border:1px solid #4b6a8f;border-radius:7px;background:#15314b;color:var(--bf-text);font-weight:750}
.bf-relation-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bf-relation-card{border:1px solid var(--bf-line-soft);border-radius:9px;background:var(--bf-panel-2);padding:10px;min-width:0}
.bf-relation-card.ok{grid-column:1/-1}.bf-relation-card h3{font-size:13px;margin:0 0 8px}
.bf-relation-stage{min-height:118px;border:1px solid #2d435f;border-radius:7px;background:#091423;padding:18px 28px;display:grid;grid-template-columns:minmax(150px,1fr) minmax(70px,.55fr) minmax(150px,1fr);align-items:center;gap:12px;overflow:hidden}
.bf-relation-node{min-height:64px;border:1px solid #466486;border-radius:7px;background:#102239;padding:8px 10px;display:grid;place-items:center;align-content:center;text-align:center;line-height:1.35}
.bf-relation-node.controller{border-color:#7557bd;background:#151b35}.bf-relation-node.target{border-color:#397ca8}.bf-relation-node.missing{border-color:#a84458;background:#291621}
.bf-relation-node b{font-size:12px}.bf-relation-node small{font-size:10px;color:#91b9df;margin-top:3px}.bf-relation-node.controller small{color:#c7b9e9}.bf-relation-node.missing small{color:#ffadb9}
.bf-relation-detail{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin-top:7px}
.bf-relation-detail>span{border:1px solid #213754;border-radius:5px;background:#0a1628;padding:5px 7px;display:grid;gap:1px;color:#9fb4cc;font-size:9px;min-width:0}
.bf-relation-detail b{font-size:10px;color:#dceaff;overflow-wrap:anywhere}.bf-relation-card.ok .bf-relation-detail b{color:#9ff0cb}.bf-relation-card.error .bf-relation-detail span:last-child b{color:#ff9bac}
@media(max-width:820px){.bf-relation-grid{grid-template-columns:1fr}.bf-relation-card.ok{grid-column:auto}.bf-relation-detail{grid-template-columns:repeat(3,minmax(0,1fr))}}


/* v1.0.6 usage-first State explanation and live Preview. */
.bf-section-intro,.bf-purpose-head,.bf-preview-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.bf-section-intro h2,.bf-purpose-head h2{margin-bottom:5px}.bf-purpose-now{min-width:150px;border:1px solid #5b50a2;border-radius:8px;background:#151a34;padding:9px 12px;display:grid;gap:2px;text-align:right}.bf-purpose-now span{font-size:10px;color:var(--bf-muted)}.bf-purpose-now strong{font-size:20px;color:#e5dfff}.bf-purpose-flow{display:grid;grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr) 42px minmax(0,1.22fr);gap:8px;align-items:center;margin:13px 0}.bf-purpose-node{min-height:94px;border:1px solid var(--bf-line-soft);border-radius:9px;background:#0b1728;padding:11px 12px;display:grid;align-content:center;gap:4px}.bf-purpose-node.target{border-color:#397ca8}.bf-purpose-node.state{border-color:#7557bd;background:#151b35}.bf-purpose-node.consumer{border-color:#3c775f}.bf-purpose-node strong{font-size:14px}.bf-purpose-node small{color:var(--bf-muted);font-size:10px}.bf-purpose-kicker{font-size:9px;font-weight:900;letter-spacing:.08em;color:#88bce9}.bf-purpose-node.state .bf-purpose-kicker{color:#c7b9e9}.bf-purpose-node.consumer .bf-purpose-kicker{color:#8dd9ba}.bf-purpose-arrow{font-size:24px;text-align:center;color:var(--bf-blue);font-weight:900}.bf-purpose-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.bf-purpose-card{border:1px solid var(--bf-line-soft);border-radius:8px;background:#0c1728;padding:10px 12px}.bf-purpose-card.do{border-left:3px solid var(--bf-green)}.bf-purpose-card.dont{border-left:3px solid var(--bf-yellow)}.bf-purpose-card h3{margin-bottom:5px}.bf-purpose-card ul{margin:0;padding-left:18px;color:#cbd8e8;font-size:11px}.bf-purpose-card li{margin:2px 0}.bf-usage-steps,.bf-class-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}.bf-usage-steps>div,.bf-class-steps>div{border:1px solid #2d4564;border-radius:8px;background:#0a1626;padding:8px 9px;display:flex;align-items:center;gap:8px}.bf-usage-steps b,.bf-class-steps b{width:25px;height:25px;border-radius:50%;background:#1b5d92;display:grid;place-items:center;font-size:11px}.bf-usage-steps span,.bf-class-steps span{display:grid;gap:1px}.bf-usage-steps strong,.bf-class-steps strong{font-size:11px}.bf-usage-steps small,.bf-class-steps small{color:var(--bf-muted);font-size:9px}.bf-state-change{min-width:180px;border:1px solid #334d70;border-radius:8px;background:#0a1626;padding:8px 10px;display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;text-align:center}.bf-state-change span{color:var(--bf-muted);font-size:12px}.bf-state-change b{color:var(--bf-blue)}.bf-state-change strong{color:#fff;font-size:15px}.bf-use-case-box{margin-top:10px;border:1px solid #2e4f73;border-radius:7px;background:#0b1b2f;padding:8px 9px;display:grid;gap:2px;font-size:10px}.bf-use-case-box strong{color:#93c9ff}.bf-mini-title{font-size:11px!important;margin:12px 0 5px!important;color:#dce9f8}.bf-state-buttons button.is-current{border-color:#7d68d7;background:#28214e;box-shadow:0 0 0 1px rgba(125,104,215,.22)}.bf-preview-heading{align-items:center;margin-bottom:8px}.bf-preview-heading h3{margin:0}.bf-live-state{border:1px solid #5b50a2;background:#171b38;color:#eadfff;border-radius:999px;padding:3px 9px;font-size:10px;font-weight:900}.bf-preview-stage{min-height:285px}.bf-preview-target{width:min(390px,94%);min-height:190px;place-items:stretch;align-content:center;text-align:left;padding:17px 18px}.bf-demo-component-name{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:11px;color:#9bcaff;border-bottom:1px solid #2b4563;padding-bottom:7px}.bf-demo-component-name small{font-size:9px}.bf-demo-label{font-size:11px!important;color:#dce8f7;margin-top:4px}.bf-demo-field{min-height:43px;border:1px solid #5d7697;border-radius:6px;background:#0a1524;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:10px}.bf-demo-field span{font-size:13px;font-weight:700}.bf-demo-field em{font-style:normal;border:1px solid #405a78;border-radius:999px;padding:2px 7px;font-size:9px;color:#b9cbe0}.bf-demo-message{display:block;min-height:36px;color:#aebed2!important;font-size:10px;line-height:1.45}.bf-demo-state-line{font-family:"Cascadia Code",Consolas,monospace;color:#8fbef0!important;font-size:10px}.bf-preview-target[data-bf-state="Error"] .bf-demo-field{border-color:var(--bf-red)}.bf-preview-target[data-bf-state="Error"] .bf-demo-message,.bf-preview-target[data-bf-state="Error"] .bf-demo-field em{color:#ff9bac!important;border-color:#9f4556}.bf-preview-target[data-bf-state="Focus"] .bf-demo-field{border-color:var(--bf-blue);box-shadow:0 0 0 2px rgba(91,166,255,.15)}.bf-preview-target[data-bf-state="Disabled"] .bf-demo-field{opacity:.48}.bf-preview-target[data-bf-state="Selected"] .bf-demo-field,.bf-preview-target[data-bf-state="Checked"] .bf-demo-field{border-color:var(--bf-green)}.bf-preview-target[data-bf-state="Active"] .bf-demo-field{transform:translateY(1px)}.bf-output-caption,.bf-fc-explain{margin-top:9px;border:1px solid #263d5a;border-radius:7px;background:#0a1626;padding:7px 9px;display:flex;justify-content:space-between;gap:10px;align-items:center}.bf-output-caption strong,.bf-fc-explain strong{font-size:10px;color:#9ac9f4}.bf-output-caption small,.bf-fc-explain span{font-size:9px;color:var(--bf-muted)}.bf-fc-demo{display:grid;align-content:center;gap:1px}.bf-fc-demo small{font-size:9px;color:#b8c9dd}.bf-fc-explain{display:grid;justify-content:stretch}.bf-relation-card{opacity:.96}
@media(max-width:820px){.bf-purpose-flow{grid-template-columns:1fr}.bf-purpose-arrow{transform:rotate(90deg)}.bf-purpose-grid,.bf-usage-steps,.bf-class-steps{grid-template-columns:1fr}.bf-section-intro,.bf-purpose-head{display:grid}.bf-purpose-now{min-width:0;text-align:left}.bf-state-change{min-width:0}}

.bf-preview-target[data-preview-state="Hover"]{box-shadow:0 0 0 2px rgba(91,166,255,.25)}
.bf-preview-target[data-preview-state="Focus"]{box-shadow:0 0 0 3px rgba(91,166,255,.38)}
.bf-preview-target[data-preview-state="Active"]{transform:translateY(1px)}
.bf-preview-target[data-preview-state="Disabled"]{opacity:.45}
.bf-preview-target[data-preview-state="Selected"],.bf-preview-target[data-preview-state="Checked"]{border-color:var(--bf-green);box-shadow:0 0 0 2px rgba(67,209,158,.2)}
.bf-preview-target[data-preview-state="Error"]{border-color:var(--bf-red);box-shadow:0 0 0 2px rgba(255,113,133,.2)}
.bf-preview-target[data-preview-state="Error"] .bf-demo-field{border-color:var(--bf-red)}
.bf-preview-target[data-preview-state="Error"] .bf-demo-message,.bf-preview-target[data-preview-state="Error"] .bf-demo-field em{color:#ff9bac!important;border-color:#9f4556}
.bf-preview-target[data-preview-state="Focus"] .bf-demo-field{border-color:var(--bf-blue);box-shadow:0 0 0 2px rgba(91,166,255,.15)}
.bf-preview-target[data-preview-state="Disabled"] .bf-demo-field{opacity:.48}
.bf-preview-target[data-preview-state="Selected"] .bf-demo-field,.bf-preview-target[data-preview-state="Checked"] .bf-demo-field{border-color:var(--bf-green)}
.bf-preview-target[data-preview-state="Active"] .bf-demo-field{transform:translateY(1px)}

/* v1.0.22 formal language / #002 Joint relation / #017-style QA */
.bf-property-language{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px;padding:0 0 10px;border-bottom:1px solid var(--bf-line-soft);font-size:11px}.bf-property-language strong{color:var(--bf-muted);margin-right:2px}.bf-lang-btn{border:1px solid #405675;background:#0b1626;color:var(--bf-text);border-radius:6px;min-height:30px;padding:4px 12px;cursor:pointer;font-weight:700}.bf-lang-btn.is-active{border-color:var(--bf-blue);background:#17304b;color:#e7f2ff}.bf-functional-compact{padding:12px 16px}.bf-functional-compact-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.bf-functional-compact-head h2{margin:0}.bf-fc-relation{display:grid;grid-template-columns:minmax(130px,1fr) 34px minmax(130px,1fr);gap:8px;align-items:center;margin-top:10px}.bf-fc-controller,.bf-fc-demo{min-height:58px;border:1px solid #5e55a7;background:#171b38;border-radius:7px;padding:8px;text-align:center;display:grid;place-items:center;align-content:center;color:var(--bf-text)}.bf-fc-demo{border-color:#3e779c;background:#10243a}.bf-fc-controller small,.bf-fc-demo small{color:var(--bf-muted);font-size:9px}.bf-fc-compact-status{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:8px}.bf-fc-compact-status span{border:1px solid var(--bf-line-soft);background:#0b1728;border-radius:6px;padding:6px 8px;color:var(--bf-muted);font-size:9px}.bf-fc-compact-status b{display:block;color:var(--bf-text);font-size:10px;overflow-wrap:anywhere}.bf-relation-stage{position:relative;height:110px;border:1px solid #2d435f;border-radius:7px;background:#091423;overflow:hidden;display:block!important}.bf-state-relation-svg{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}.bf-relation-node{position:absolute;z-index:2;top:25px;width:135px;min-height:58px;border:1px solid #466486;border-radius:7px;background:#102239;padding:7px;text-align:center;display:grid;place-items:center;align-content:center;font-size:10px}.bf-relation-node.controller{left:5%}.bf-relation-node.target,.bf-relation-node.missing{right:5%}.bf-relation-node.missing{border-color:#b7485c;color:#ffd4db}.bf-relation-node small{color:#8fbef0}.bf-state-relation-joint-line{pointer-events:none}.bf-security-actions{margin-bottom:10px}.bf-security-stage{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px;align-items:stretch;border:1px solid #293b52;border-radius:9px;background:#08111f;padding:12px;min-height:96px;overflow:hidden}.bf-security-node{position:relative;z-index:2;min-width:0;border:1px solid #466481;border-radius:7px;background:#10243a;padding:8px;display:grid;gap:3px;align-content:center;text-align:center}.bf-security-node span,.bf-security-node small{font-size:9px;color:var(--bf-muted)}.bf-security-node strong{font-size:11px;overflow-wrap:anywhere}.bf-security-gate{border-color:#5b6f88;background:#0d1e30}.bf-security-joint-line-layer,.bf-security-joint-marker-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.bf-security-joint-line-layer{z-index:1}.bf-security-joint-marker-layer{z-index:3;overflow:visible}.bf-security-joint-line{pointer-events:none}.bf-qa-statebar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0 12px}.bf-qa-stat{border:1px solid var(--bf-line-soft);background:#0b1728;border-radius:7px;padding:8px 9px;font-size:11px}.bf-qa-stat span{display:block;color:var(--bf-muted);margin-bottom:3px}.bf-qa-stat b{font-size:13px}.status-pass{color:var(--bf-green)}.status-fail{color:var(--bf-red)}.status-notrun{color:var(--bf-yellow)}.bf-functional-bar{justify-content:flex-start}.bf-functional-bar span{display:inline}.bf-functional-bar code{font-size:12px}@media(max-width:820px){.bf-fc-compact-status{grid-template-columns:1fr 1fr}.bf-security-stage{grid-template-columns:1fr;gap:34px;min-height:330px}.bf-qa-statebar{grid-template-columns:1fr 1fr}}@media(max-width:560px){.bf-fc-relation{grid-template-columns:1fr}.bf-relation-arrow{transform:rotate(90deg)}.bf-fc-compact-status,.bf-qa-statebar{grid-template-columns:1fr}.bf-relation-node{width:118px}}
.bf-fc-separator{font-size:9px;font-weight:800;color:var(--bf-muted);text-align:center}.bf-fc-relation{grid-template-columns:minmax(130px,1fr) 54px minmax(130px,1fr)}@media(max-width:560px){.bf-fc-relation{grid-template-columns:1fr}.bf-fc-separator{padding:2px 0}}


/* v1.0.26 - #017-referenced OUT WAIT/FIFO/BLOCKED flow and formal #002 layer order */
.bf-relation-card.error{grid-column:1/-1}
.bf-relation-card.error .bf-relation-stage{min-height:124px}
.bf-relation-node.controller{left:7%}
.bf-relation-node.target,.bf-relation-node.missing{right:7%}
.bf-security-stage{grid-template-columns:repeat(3,minmax(0,1fr));gap:88px;min-height:108px;padding:14px 18px;overflow:hidden}
.bf-security-joint-marker-layer{overflow:visible}
.bf-delivery-status-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0 6px}
.bf-delivery-pill{display:inline-flex;align-items:center;justify-content:center;min-width:90px;min-height:28px;border:1px solid #365272;border-radius:999px;background:#0c1b2d;padding:3px 9px;font-size:11px;font-weight:900}
.bf-delivery-pill.is-ready{color:var(--bf-green);border-color:#245e4b}.bf-delivery-pill.is-waiting{color:var(--bf-yellow);border-color:#806927}.bf-delivery-pill.is-blocked{color:var(--bf-red);border-color:#7d3445}
#delivery-stage{position:relative;min-height:180px;height:auto;margin:10px 0;border:1px solid #31516b;border-radius:9px;background:#061523;display:flex;align-items:center;justify-content:space-between;padding:36px 110px;overflow:hidden}
#delivery-stage .bf-delivery-node{position:relative;z-index:2;top:auto;left:auto;right:auto;transform:none;width:152px;min-height:62px}
#delivery-stage .bf-delivery-node.source,#delivery-stage .bf-delivery-node.target{left:auto;right:auto}
#delivery-stage svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#delivery-stage .joint-line-layer{z-index:1}
#delivery-stage .joint-marker-layer{z-index:3;overflow:visible}
#delivery-stage .bf-joint-waiting-spinner,#delivery-stage .bf-joint-blocked-ban,#delivery-stage .bf-joint-error-marker,#delivery-stage .bf-joint-compatibility-error{position:relative;z-index:3}
.bf-delivery-statebar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0}
.bf-delivery-stat{background:#07131f;border:1px solid #2d4c65;border-radius:8px;padding:8px;text-align:center;color:#a8bdcf;font-size:11px}
.bf-delivery-stat b{display:block;margin-top:4px;font-size:15px;color:#f0f7fe;overflow-wrap:anywhere}
.bf-delivery-log,.bf-delivery-render-status{border:1px solid #263d5a;border-radius:6px;background:#091522;padding:8px 10px;margin-top:6px;font-size:11px;color:var(--bf-muted);white-space:pre-wrap}
#delivery-actions{margin-top:10px}
#delivery-integration .bf-confirm-list{margin-top:9px}
@media(max-width:820px){.bf-security-stage{gap:58px}.bf-relation-card.error{grid-column:auto}.bf-relation-grid{grid-template-columns:1fr}.bf-delivery-statebar{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.bf-security-stage{grid-template-columns:1fr;gap:46px;min-height:350px}.bf-security-node{min-height:72px}#delivery-stage{min-height:300px;flex-direction:column;justify-content:center;gap:92px;padding:34px 24px}#delivery-stage .bf-delivery-node{width:152px}.bf-delivery-statebar{grid-template-columns:1fr 1fr}}