/* Blueprint diagrams: colors distinguish business roles, not readiness claims. */
.presentation-page { --bp-blue:#2456cc; --bp-green:#1c8254; --bp-amber:#b66c1e; --bp-purple:#7754a0; --bp-ink:#243447; --bp-muted:#65748a; --bp-line:#e2e8ef; }
.bp-panel { position:relative; border:1px solid var(--bp-line); border-radius:8px; padding:13px 16px 10px; background:#fff; box-shadow:0 3px 14px #203b5c07; }
.bp-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; padding:0 0 10px !important; }
.bp-heading > div { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.bp-heading b { color:var(--bp-ink); font-size:15px; }
.bp-heading > div > span { color:var(--bp-muted); font-size:11px; }
.bp-board { position:relative; width:100%; max-height:320px; isolation:isolate; }
.service-deck.is-playing .deck-slide:has(.bp-panel) > header { padding-top:20px; }
.service-deck.is-playing .deck-slide:has(.bp-panel) :is(h1,h2) { font-size:36px; }
.service-deck.is-playing .deck-slide:has(.bp-panel) .deck-lead { font-size:15px; margin-top:12px; }
.bp-connectors { position:absolute; inset:0; width:100%; height:100%; overflow:visible; z-index:0; }
.bp-link { fill:none; stroke:#57677b; stroke-width:1.4; stroke-linejoin:round; }
.bp-feedback { fill:none; stroke:#4265a4; stroke-width:1.3; stroke-dasharray:5 4; }
.bp-conditional { stroke-dasharray:4 3; }
.bp-fill-blue { fill:#eff5ff; }
.bp-fill-green { fill:#f0f9f4; }
.bp-fill-amber { fill:#fff7ec; }
.bp-fill-purple { fill:#f7f3fc; }
.bp-lane-label { position:absolute; z-index:2; display:flex; flex-direction:column; justify-content:center; gap:5px; box-sizing:border-box; padding:6px 11px; border-radius:5px; color:#fff; }
.bp-lane-label b { font-size:15px; line-height:1.5; }
.bp-lane-label small { font-size:10px; line-height:1.5; opacity:.86; }
.bp-tone-blue { background:var(--bp-blue); }
.bp-tone-green { background:var(--bp-green); }
.bp-tone-amber { background:var(--bp-amber); }
.bp-tone-purple { background:var(--bp-purple); }
.bp-board > .bp-node { position:absolute; z-index:2; display:flex; flex-direction:column; justify-content:center; align-items:center; box-sizing:border-box; padding:5px 9px; margin:0; background:#fff; border:1px solid; border-radius:5px; text-align:center; color:var(--bp-ink); cursor:pointer; font:inherit; box-shadow:0 2px 4px #213b5105; min-width:0; }
.bp-board > .bp-node > strong { font-size:15px; line-height:1.45; font-weight:600; }
.bp-board > .bp-node > p { font-size:11px; line-height:1.5; color:var(--bp-muted); margin:4px 0 0; }
.bp-board > .bp-border-blue { border-color:#7197dc; }
.bp-board > .bp-border-green { border-color:#68a98a; }
.bp-board > .bp-border-amber { border-color:#c79757; }
.bp-board > .bp-border-purple { border-color:#a28abd; }
.bp-board > .bp-optional { border-style:dashed; }
.bp-board > .bp-node[aria-pressed="true"], .bp-board > .bp-node.is-signal-active { box-shadow:0 0 0 3px #2374e51c; background:#f5f9ff; }
.bp-feedback-label { position:absolute; z-index:3; left:39%; top:0; transform:translateY(-12%); background:#edf4ff; color:#4e70a5; padding:2px 10px; border-radius:999px; font-size:10px; white-space:nowrap; }
.bp-legend { display:flex; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap; color:#748093; font-size:9px; line-height:1.7; padding-top:5px; }
.bp-legend > span { display:inline-flex; align-items:center; gap:5px; }
.bp-legend i { width:5px; height:5px; border-radius:50%; }
.bp-dot-blue { background:var(--bp-blue); }
.bp-dot-green { background:var(--bp-green); }
.bp-dot-amber { background:var(--bp-amber); }
.bp-dot-purple { background:var(--bp-purple); }
.bp-concept { position:relative; flex-shrink:0; z-index:10; font-size:10px; color:#456897; }
.bp-concept summary { padding:3px 8px; cursor:pointer; border:1px solid #c8d9ee; border-radius:4px; }
.bp-concept figure { position:absolute; width:340px; max-width:75vw; right:0; top:24px; margin:0; padding:10px; border:1px solid #dce4ed; border-radius:5px; background:#fff; box-shadow:0 12px 30px #17345e20; }
.bp-concept img { display:block; width:100%; height:auto; }
.bp-concept figcaption { font-size:9px; color:#7b879a; margin-top:5px; }
.bp-panel .deck-flow-canvas { z-index:1; }
.bp-panel .deck-flow-controls { padding:5px 8px 0; font-size:9px; }
.bp-panel .deck-flow-controls button { font-size:9px; padding:3px 8px; }
.service-deck.is-reading .bp-panel { margin-block:8px; }
.service-deck.is-reading .bp-board { max-height:360px; }
.deck-slide--architecture .bp-board { max-height:330px; }
.service-deck.is-reading .deck-slide--architecture .bp-board { max-height:390px; }
.deck-slide--architecture .deck-diagram { gap:10px; }
.deck-slide--architecture .bp-board > .bp-node > strong { font-size:14px; }
.deck-slide--architecture .bp-board > .bp-node > p { font-size:10px; margin-top:2px; }
.bp-caption { position:absolute; z-index:3; color:#63758c; font-size:11px; line-height:1.5; text-align:center; }
.bp-caption--left { text-align:left; color:#3e68a1; font-weight:600; }
.bp-caption--governance { color:#725397; font-weight:600; }
.bp-caption--feedback { color:#5476a9; background:#f4f8fe; }
.bp-scene-note { margin:5px 0 0; color:#748093; font-size:10px; line-height:1.6; text-align:center; }
.bp-board > .bp-node--bare, .bp-board > .bp-node--diamond { border:0; background:transparent; box-shadow:none; }
.bp-board > .bp-node--diamond > strong { font-size:15px; }
.bp-board > .bp-node--compact { padding:4px 7px; }
.bp-board > .bp-node--compact > strong { font-size:14px; }
.bp-board > .bp-node--compact > p { font-size:10px; margin-top:2px; }
.bp-board > .bp-node--wide { flex-direction:row; gap:15px; padding:4px 8px; }
.bp-board > .bp-node--wide > strong { font-size:14px; }
.bp-board > .bp-node--wide > p { font-size:10px; margin:0; }
.bp-node--document::after { content:''; position:absolute; top:-1px; right:-1px; width:10px; height:10px; background:linear-gradient(45deg,#edf6f0 49%,#fff 51%); border-left:1px solid #87b49b; border-bottom:1px solid #87b49b; }
.bp-scene--loop > .bp-node--bare > strong { color:#2456cc; }
.bp-node:focus-visible { outline:2px solid #0879ef; outline-offset:3px; }
.bp-node:hover { filter:brightness(.985); }
/* The remaining small linear diagrams share the same bordered-node vocabulary. */
.deck-flow:not(.bp-board) > .deck-node { border:1px solid #8da9d0; border-radius:5px; background:#fff; }
.deck-flow:not(.bp-board) > .deck-node::after { color:#536b88; }
.deck-flow:not(.bp-board) > .deck-node > span { color:var(--bp-blue); }
@media(max-width:900px) {
  .service-deck.is-reading .bp-panel { padding:14px 12px; }
  .service-deck.is-reading .bp-heading > div { display:block; }
  .service-deck.is-reading .bp-heading > div > span { display:block; margin-top:5px; }
  .service-deck.is-reading .bp-board { aspect-ratio:auto !important; max-height:none; display:flex; flex-direction:column; gap:10px; }
  .service-deck.is-reading .bp-connectors, .service-deck.is-reading .bp-feedback-label, .service-deck.is-reading .bp-board > canvas { display:none; }
  .service-deck.is-reading .bp-lane-label { position:static; width:100% !important; height:auto !important; padding:10px 12px; flex-direction:row; align-items:center; justify-content:space-between; }
  .service-deck.is-reading .bp-board > .bp-node { position:static; width:100% !important; height:auto !important; min-height:65px; padding:12px; }
  .service-deck.is-reading .bp-board > .bp-node > strong { font-size:16px; }
  .service-deck.is-reading .bp-board > .bp-node > p { font-size:12px; }
  .service-deck.is-reading .bp-legend { font-size:10px; justify-content:flex-start; gap:8px 14px; padding-top:14px; }
  .service-deck.is-reading .bp-panel .deck-flow-controls { font-size:11px; flex-wrap:wrap; }
  .service-deck.is-reading .bp-panel .deck-flow-controls button { font-size:11px; }
  .service-deck.is-reading .bp-caption { display:none; }
  .service-deck.is-reading :is(.bp-scene--journey,.bp-scene--timeline) > .bp-caption--governance { display:block; position:static; width:100% !important; order:1; padding:12px; box-sizing:border-box; background:#f7f3fc; text-align:left; font-size:12px; }
  .service-deck.is-reading .bp-scene > .bp-node--bare, .service-deck.is-reading .bp-scene > .bp-node--diamond { border:1px solid #9bb7df; background:#f5f9ff; }
  .service-deck.is-reading .bp-scene > .bp-node--wide { flex-direction:column; gap:5px; }
  .service-deck.is-reading .bp-scene > .bp-node--wide > p { font-size:12px; }
  .service-deck.is-reading .bp-scene-note { padding-top:10px; font-size:12px; text-align:left; }
}