/* Flow Gears Framework page (/flow-gears/), Set Z Lane B, 5 Nov 2026.
   Page-scoped (fg-). Colours from the Registry: {gr} meta-gears #646476, sub-gears lighten along the flow.
   The closing band is styled by the shared .lc-close class (Lane E); nothing here colours it. */
.fg-loop { max-width: 420px; margin: 24px auto 0; }
.fg-loop svg { display: block; width: 100%; height: auto; }
.fg-loop text { fill: var(--fg); font-family: var(--font-body); }
.fg-loop .t { font-family: var(--font-heading); font-weight: 700; }
.fg-loop .s { fill: var(--fg-muted); }
.fg-loop .teeth { fill: none; stroke: var(--vc); stroke-width: 10; stroke-dasharray: 9 9; }
.fg-loop .body { fill: #fff; stroke: var(--vc); stroke-width: 3; }
.fg-loop .arc { fill: none; stroke: #D44040; stroke-width: 2.5; stroke-linecap: round; }
.fg-loop .hub { fill: #FFF6F7; stroke: #D44040; stroke-width: 2; }

.bsc2-c .fg-sub { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.bsc2-c .fg-sub li { margin: 0; padding: 10px 12px 10px 14px; border-left: 5px solid var(--sc); border-radius: 0 10px 10px 0; background: var(--bg-tint); font-size: .92rem; line-height: 1.4; }
.bsc2-c .fg-sub li b { display: block; font-family: var(--font-heading); color: var(--fg-heading); font-size: .98rem; }
.bsc2-c .fg-acr { margin: 0; font-size: .95rem; }
.bsc2-c .fg-acr b { color: var(--fg-heading); }
.bsc2-c .fg-with { margin: 14px 0 0; font-size: .9rem; color: var(--fg-muted); }

.fg-dg { max-width: 560px; margin: 24px auto 0; }
.fg-dg > svg { display: block; width: 100%; height: auto; }
.fg-dg .dgkey svg { flex: none; }
.fg-dg text { fill: var(--fg); font-family: var(--font-body); }
.fg-dg .t { font-family: var(--font-heading); font-weight: 700; }
.fg-dg .gb { stroke: #646476; stroke-width: 3; fill: #646476; fill-opacity: .12; }
.fg-dg .mb { fill: var(--bg-tint); stroke-width: 2; }
.fg-dg .l1 { fill: none; stroke: #646476; stroke-width: 3; stroke-linecap: round; }
.fg-dg .l2 { fill: none; stroke: #646476; stroke-width: 2; stroke-dasharray: 5 5; stroke-linecap: round; opacity: .85; }

/* nested solution word inside a step title stays inline (the base .steps li b is display:block) */
.steps li b b { display: inline; margin: 0; }
