:root{--bf-bg:#0b1220;--bf-panel:#111b2e;--bf-panel2:#0e1829;--bf-line:#2e425f;--bf-text:#e8f1ff;--bf-muted:#9db0c8;--bf-blue:#5ba6ff;--bf-green:#55e6a5;--bf-red:#ff6b78;--bf-orange:#ffbd66;--bf-yellow:#ffd66f}
*{box-sizing:border-box}body{margin:0;background:var(--bf-bg);color:var(--bf-text);font-family:Meiryo,"Yu Gothic",sans-serif;font-size:14px;line-height:1.55}.bf-page{width:min(1400px,calc(100% - 28px));margin:18px auto 40px}.bf-header,.bf-section{border:1px solid var(--bf-line);background:var(--bf-panel);border-radius:12px;padding:18px;margin-bottom:14px}.bf-header-top{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap}.bf-header h1{margin:0 0 7px;font-size:25px}.bf-header p,.section-note{margin:0;color:var(--bf-muted)}.bf-actions,.qa-actions,.lifecycle-actions,.security-actions,.delivery-actions{display:flex;gap:8px;flex-wrap:wrap}.bf-btn{border:1px solid #476789;background:#16243a;color:var(--bf-text);padding:8px 12px;border-radius:7px;font-weight:700;cursor:pointer;text-decoration:none}.bf-btn:hover{border-color:var(--bf-blue)}.bf-btn.ok{border-color:#1e8d59;background:#103527}.bf-btn.danger{border-color:#85404a;background:#35151c}.bf-status-badges{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.bf-badge{font-size:12px;border:1px solid var(--bf-line);border-radius:999px;padding:5px 9px}.bf-badge.dev{color:#ffe0a3;border-color:#735d30}.bf-badge.num{color:#cfe5ff}h2{font-size:18px;margin:0 0 13px}h3{font-size:15px;margin:0 0 10px}.bf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}.dep,.panel,.target-card,.relation-card{border:1px solid var(--bf-line);border-radius:9px;padding:12px;background:var(--bf-panel2)}.dep strong{display:block;margin-bottom:5px}.dep small{color:var(--bf-muted)}.bf-two{display:grid;grid-template-columns:minmax(350px,.9fr) minmax(500px,1.4fr);gap:14px}.field{display:grid;grid-template-columns:165px minmax(0,1fr);gap:9px;align-items:center;margin:9px 0}.field label{font-weight:700}.field input,.field select{display:block;width:100%;min-width:0;box-sizing:border-box;background:#0a1322;border:1px solid #405674;color:var(--bf-text);padding:8px 9px;border-radius:6px}.field small{grid-column:2;color:var(--bf-muted);font-size:11px}.property-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}.property-language-actions{display:flex;gap:6px}.property-language-actions .is-active{border-color:var(--bf-blue);background:#18395a}.preview-stage{min-height:340px;border:1px dashed #45607d;border-radius:10px;background:#0b1525;padding:22px;display:grid;place-items:center;overflow:hidden}.target-card{min-width:360px;min-height:160px;display:grid;place-items:center;position:relative}.preview-button{font:700 18px Meiryo;border:1px solid #5b7699;background:#17304e;color:#fff;border-radius:9px;padding:14px 24px;position:relative}.preview-button [data-ui-part="button-text"]{display:inline-block}.preview-text,.preview-label{font-size:28px;font-weight:800;display:inline-block}.preview-icon{font-size:42px;display:inline-block}.preview-panel,.preview-box{width:280px;height:120px;border:1px solid #54769b;border-radius:12px;background:#17304e;display:grid;place-items:center;font-weight:800}.preview-progress{width:340px;height:24px;background:#142033;border:1px solid #48647f;border-radius:999px;overflow:hidden;position:relative}.preview-fill{height:100%;width:62%;background:#4ba6ff}.preview-slider{width:340px;height:44px;position:relative}.preview-track{position:absolute;left:0;right:0;top:19px;height:6px;background:#243b58;border-radius:9px}.preview-thumb{position:absolute;left:58%;top:8px;width:28px;height:28px;border-radius:50%;background:#6bc4ff;border:3px solid #d8f0ff}.preview-meta{margin-top:10px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.preview-meta div{border:1px solid var(--bf-line);border-radius:7px;padding:8px}.preview-meta span{display:block;color:var(--bf-muted);font-size:11px}.preview-meta b{font-size:12px;word-break:break-word}.html-sample{border:1px solid var(--bf-line);border-radius:8px;background:#08111f;padding:12px;overflow:auto}.html-sample code{white-space:pre;color:#d6e7ff;font-family:Consolas,monospace}.animation-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.animation-item{border:1px solid var(--bf-line);border-radius:8px;padding:10px;background:#0c1728}.animation-item b{display:block}.animation-item small{color:var(--bf-muted)}.relation-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.relation-card.wide{grid-column:1/-1}.joint-stage{position:relative;height:155px;border:1px dashed #405b78;border-radius:8px;overflow:visible}.joint-stage .joint-base,.joint-stage .joint-overlay{position:absolute;inset:0;width:100%;height:100%}.joint-stage .joint-base{z-index:1}.joint-node{position:absolute;z-index:2;top:50px;width:150px;padding:9px;border:1px solid #42678e;background:#10233a;border-radius:8px;text-align:center}.joint-node.left{left:12px}.joint-node.center{left:50%;transform:translateX(-50%)}.joint-node.right{right:12px}.joint-node.missing{border-style:dashed;color:#ffabb3}.joint-stage .joint-overlay{z-index:3;pointer-events:none}.joint-diagnostic{margin-top:8px;font-size:12px;color:var(--bf-muted)}.joint-diagnostic>div{display:grid;grid-template-columns:165px minmax(0,1fr);gap:8px}.legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;color:var(--bf-muted)}.legend span::before{content:"";display:inline-block;width:26px;height:3px;margin-right:6px;vertical-align:middle}.legend .blue::before{background:#5ba6ff}.legend .green::before{background:#55e6a5}.legend .orange::before{background:#ffbd66}.legend .red::before{background:#ff6b78}.state-separation{display:grid;grid-template-columns:1fr 1fr;gap:10px}.state-box{border:1px solid var(--bf-line);border-radius:9px;padding:12px;background:#0a1424}.result-box{border:1px solid var(--bf-line);border-radius:8px;padding:10px;background:#07101c;min-height:72px;white-space:pre-wrap;font-family:Consolas,monospace;font-size:12px}.qa-summary{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:12px 0}.qa-summary div{border:1px solid var(--bf-line);padding:9px;border-radius:8px}.qa-summary span{display:block;color:var(--bf-muted);font-size:11px}.qa-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.qa-row{border:1px solid var(--bf-line);border-radius:7px;padding:9px;display:flex;gap:8px}.qa-row.pass strong{color:var(--bf-green)}.qa-row.fail{border-color:#733642;background:#2b1016}.qa-row.fail strong{color:var(--bf-red)}.completion-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:10px}.completion-grid div{border:1px solid var(--bf-line);border-radius:8px;padding:8px}.completion-grid span{display:block;color:var(--bf-muted);font-size:11px}.class-bar{position:relative;border:1px solid #4a6a8c;border-radius:10px;padding:12px 14px;background:#0a1728;font-family:Consolas,monospace}.bone-animation-flow-overlay{will-change:background-position}.bone-animation-active{will-change:transform,opacity,background-position,text-shadow,box-shadow}.copy-row{display:flex;justify-content:flex-end;margin-top:6px}.copy-status{font-size:12px;color:var(--bf-muted);margin-left:8px}.visual-checks{display:flex;gap:14px;flex-wrap:wrap;margin:10px 0}.visual-checks label{display:flex;align-items:center;gap:6px}.runtime-console{max-height:220px;overflow:auto}.guide-hint{border-left:3px solid var(--bf-blue);padding:8px 10px;background:#0b1b2f;color:#cde5ff;margin:10px 0}@media(max-width:900px){.bf-two,.relation-grid,.state-separation{grid-template-columns:1fr}.relation-card.wide{grid-column:auto}.field{grid-template-columns:1fr}.field small{grid-column:1}.animation-list{grid-template-columns:1fr 1fr}.qa-results{grid-template-columns:1fr}.qa-summary,.completion-grid{grid-template-columns:1fr 1fr}.preview-meta{grid-template-columns:1fr 1fr}}

.animation-specific{margin:10px 0;padding:10px;border:1px solid var(--bf-line);border-radius:8px;background:#0a1628}.animation-specific[hidden],#distance-field[hidden]{display:none}.animation-specific h3{margin:0 0 8px;color:#9dccff}.animation-specific .field{margin:8px 0}

/* v3.0.9 formal OUT WAIT / BLOCKED - #002 Joint v1.1.36 Integration */
.bf-delivery-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0}
.bf-delivery-pill{display:inline-flex;align-items:center;min-height:30px;padding:4px 10px;border:1px solid var(--bf-line);border-radius:999px;font-weight:800}
.bf-delivery-pill.is-ready{border-color:#21875b;background:#103a2c;color:#7ff0bc}
.bf-delivery-pill.is-waiting{border-color:#8a6b23;background:#342b11;color:#ffe08a}
.bf-delivery-pill.is-blocked{border-color:#8a3744;background:#35141c;color:#ff9da7}
.bf-delivery-stage{position:relative;height:200px;border:1px solid var(--bf-line);border-radius:9px;background:#07101c;margin:10px 0;overflow:hidden}
.bf-delivery-node{position:absolute;z-index:2;top:48px;width:170px;min-height:64px;padding:10px;border:1px solid #42678e;border-radius:8px;background:#10233a;text-align:center}
.bf-delivery-node--source{left:48px}.bf-delivery-node--target{right:48px}
.bf-delivery-node small{display:block;margin-top:4px;color:#9dccff}
.bf-delivery-svg{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.bf-delivery-overlay{z-index:3}
.bf-target-log,.bf-visual-status{border:1px solid var(--bf-line);border-radius:6px;background:#07101c;padding:6px 8px;margin-top:7px;font-size:12px;white-space:pre-wrap}
.bf-visual-confirm{display:flex;align-items:flex-start;gap:8px;border:1px solid var(--bf-line);border-radius:7px;padding:9px 10px;margin-top:8px;background:#0a1424}
.bf-visual-confirm input{margin-top:3px}