/* r22.5.21 — visual system; presentation-only, no external assets */
.bt-topology{--bt-ink:#173954;--bt-blue:#176b9f;--bt-muted:#587083;position:relative;isolation:isolate;overflow:hidden;margin:0 0 1.7rem;padding:clamp(1.15rem,3vw,2.1rem);border:1px solid #d8e6ef;border-radius:24px;background:radial-gradient(ellipse at 50% -24%,#d5ecfb 0,transparent 64%),linear-gradient(160deg,#f7fbff,#fff 75%);box-shadow:0 14px 48px rgba(23,65,99,.065)}
.bt-topology:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(#7ea9c8 0.8px,transparent 0.8px);background-size:22px 22px;opacity:.16;mask-image:linear-gradient(#000,transparent 85%)}
.bt-topology-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:1.3rem;flex-wrap:wrap}.bt-topology-heading h2{font-size:clamp(1.35rem,2.8vw,1.95rem);letter-spacing:-.025em;line-height:1.2;color:var(--bt-ink);margin:.3rem 0 .6rem;font-weight:750}.bt-topology-heading p{color:var(--bt-muted);margin:0;line-height:1.65}.bt-topology-kicker{font-size:.72rem;letter-spacing:.13em;font-weight:800;color:var(--bt-blue)!important}.bt-topology-live{display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;border:1px solid #d6e6ef;background:#fff;border-radius:30px;padding:.42rem .75rem;color:#46647a;font-size:.75rem;font-weight:650}.bt-topology-live span{width:7px;height:7px;background:#368aaf;border-radius:50%}
.bt-topology-canvas{position:relative;margin-top:1.65rem}.bt-topology-root{position:relative;z-index:1;display:flex;align-items:center;gap:.9rem;width:max-content;max-width:100%;margin:0 auto;padding:.85rem 1.4rem;background:#fff;border:1px solid #bfd9e8;border-radius:18px;box-shadow:0 10px 26px rgba(24,65,99,.085);overflow-wrap:anywhere}.bt-topology-root-icon{display:grid;place-items:center;width:2.8rem;height:2.8rem;flex:none;border-radius:13px;background:#e7f4fc;color:#126799}.bt-topology-root strong,.bt-topology-overline{display:block}.bt-topology-root strong{color:var(--bt-ink);font-size:1.08rem}.bt-topology-overline{font-size:.68rem;letter-spacing:.12em;color:#637e91;font-weight:750}
.bt-topology-branches{height:49px;position:relative;max-width:67%;margin:auto;border-bottom:1.5px solid #9dc5de}.bt-topology-branches:before{content:"";position:absolute;left:50%;top:0;height:100%;border-left:1.5px solid #9dc5de}.bt-topology-branches span{position:absolute;bottom:-12px;height:12px;border-left:1.5px solid #9dc5de}.bt-topology-branches span:nth-child(1){left:0}.bt-topology-branches span:nth-child(2){left:50%}.bt-topology-branches span:nth-child(3){right:0}
.bt-topology-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.7rem,1.5vw,1.1rem);margin-top:12px;align-items:stretch}.bt-topology-card{min-width:0;display:flex;flex-direction:column;border:1px solid #d9e7f0;border-radius:18px;background:#fff;box-shadow:0 5px 19px rgba(22,55,86,.045);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;overflow:hidden}.bt-topology-card:hover,.bt-topology-card:focus-within{transform:translateY(-4px);border-color:#90c1e0;box-shadow:0 15px 32px rgba(22,55,86,.10)}.bt-topology-card a{text-decoration:none!important}.bt-topology-card a:focus-visible{outline:3px solid #1683c6;outline-offset:-3px;border-radius:8px}.bt-topology-card-head{display:flex;align-items:center;gap:.75rem;padding:1.1rem .95rem .9rem;color:inherit}.bt-topology-node-icon{display:grid;place-items:center;flex:none;width:2.65rem;height:2.65rem;border-radius:13px;background:#eaf4fa;color:#176b9f}.bt-topology-node-text{min-width:0;flex:1}.bt-topology-node-text strong{display:block;color:var(--bt-ink);font-size:.93rem;line-height:1.3}.bt-topology-node-text small{display:block;color:var(--bt-muted);font-size:.74rem;line-height:1.4;margin-top:.24rem}.bt-topology-node-arrow{color:#287eaa;font-size:1.2rem;align-self:flex-start;transition:transform .2s ease}.bt-topology-card:hover .bt-topology-node-arrow{transform:translate(2px,-2px)}.bt-topology-card-rail{height:2px;background:linear-gradient(90deg,transparent,#93c4e0,transparent);margin:0 1rem}.bt-topology-signals{display:flex;flex-direction:column;gap:0;padding:.45rem .8rem .75rem;flex:1}.bt-topology-signal{display:flex;align-items:center;gap:.45rem;min-width:0;padding:.52rem .3rem;color:#244860;font-size:.8rem;border-bottom:1px solid #edf3f7;transition:background .2s ease}.bt-topology-signal:hover{background:#f4f9fd}.bt-topology-signal:last-child{border-bottom:0}.bt-topology-signal-indicator,.bt-topology-legend-dot{display:inline-block;flex:none;width:7px;height:7px;border-radius:50%;background:#c2d0da}.bt-topology-signal-indicator--found,.bt-topology-legend-dot.is-found{background:#298d77;box-shadow:0 0 0 3px #e8f5f0}.bt-topology-signal-value{font-size:.67rem;color:#668195;margin-left:auto;text-align:right}.bt-topology-card-footer{display:flex;align-items:center;justify-content:space-between;gap:.4rem;padding:.85rem 1rem;background:#f4f9fc;border-top:1px solid #e8f0f5;color:#126799;font-size:.77rem;font-weight:700}.bt-topology-card-footer span{font-size:1.1rem;transition:transform .2s}.bt-topology-card:hover .bt-topology-card-footer span{transform:translateX(4px)}
.bt-topology-legend{display:flex;flex-wrap:wrap;gap:.65rem 1.3rem;margin-top:1.15rem;color:#587083;font-size:.76rem}.bt-topology-legend>span{display:inline-flex;align-items:center;gap:.55rem}.bt-topology-footnote{font-size:.79rem;color:#5a7081;margin:.8rem 0 0;line-height:1.65}
@media(max-width:900px){.bt-topology-grid{grid-template-columns:1fr}.bt-topology-branches{display:none}.bt-topology-root{margin-bottom:1.2rem}.bt-topology-card-head{padding:1rem}.bt-topology-signals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 .7rem}.bt-topology-signal-value{font-size:.72rem}}
@media(max-width:480px){.bt-topology-signals{grid-template-columns:1fr}.bt-topology-live{display:none}.bt-topology{border-radius:17px}}
@media(prefers-reduced-motion:reduce){.bt-topology-card,.bt-topology-node-arrow,.bt-topology-card-footer span,.bt-topology-signal{transition:none!important}.bt-topology-card:hover,.bt-topology-card:focus-within{transform:none}.bt-topology-card:hover .bt-topology-node-arrow,.bt-topology-card:hover .bt-topology-card-footer span{transform:none}}

/* r22.5.43: give heading the usable row width; keep adaptive wrapping on narrow screens. */
@media(min-width:768px){.bt-topology-heading>div:first-child{flex:1 1 0;min-width:0}.bt-topology-heading h2{font-size:clamp(1.25rem,2.3vw,1.72rem)}.bt-topology-live{flex:0 0 auto}}
