
/* flowchart styles — token-driven */
.flow{margin:28px 0 8px;padding-top:4px}
.flow h3{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-size:var(--uatr-font-size-xl)}
.fnum{display:inline-grid;place-items:center;min-width:28px;height:28px;padding:0 6px;border-radius:999px;background:var(--uatr-color-primary-default);color:#fff;font-size:14px}
.fmeta{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px 20px;margin:0 0 12px;font-size:13px}
.fmeta dt{font-weight:700;color:var(--uatr-color-text-secondary);font-size:12px;text-transform:uppercase;letter-spacing:.03em}.fmeta dd{margin:0}
.flscroll{overflow-x:auto;background:#fff;border:1px solid var(--uatr-color-border-default);border-radius:var(--uatr-radius-lg);padding:8px}
.flscroll:focus-visible{outline:2px solid var(--uatr-color-primary-strong);outline-offset:2px}
svg.fl{display:block;height:auto;max-width:none}
.fl-edge{fill:none;stroke:var(--uatr-color-text-secondary);stroke-width:1.5;stroke-linejoin:round}
.fl-edge.unv{stroke-dasharray:5 4;stroke:var(--uatr-color-text-muted)}
.fl-arrow{fill:var(--uatr-color-text-secondary)}
.fl-lab{font:var(--uatr-font-weight-bold) 11px var(--uatr-font-family-base);fill:var(--uatr-color-text-secondary);paint-order:stroke;stroke:#fff;stroke-width:3px}
.fl-n{stroke-width:1.5}
.fl-n.unv{stroke-dasharray:5 3}
.fl-n.start{fill:var(--uatr-color-primary-default);stroke:var(--uatr-color-primary-strong)}
.fl-n.end{fill:var(--uatr-color-bg-surface);stroke:var(--uatr-color-primary-default);stroke-width:2}
.fl-n.ref{fill:var(--uatr-color-primary-tint-1);stroke:var(--uatr-color-primary-default)}
.fl-n.screen{fill:var(--uatr-color-primary-tint-2);stroke:var(--uatr-color-primary-default)}
.fl-n.action{fill:var(--uatr-color-bg-surface);stroke:var(--uatr-color-border-strong)}
.fl-n.decision{fill:var(--uatr-color-warning-bg);stroke:var(--uatr-color-warning-default)}
.fl-n.modal{fill:var(--uatr-color-tog-bg);stroke:var(--uatr-color-tog-text)}
.fl-n.system{fill:var(--uatr-color-bg-sunken);stroke:var(--uatr-color-text-muted)}
.fl-n.error{fill:var(--uatr-color-danger-bg-subtle);stroke:var(--uatr-color-danger-default)}
.fl-t{font:var(--uatr-font-weight-regular) 12.5px var(--uatr-font-family-base);fill:var(--uatr-color-text-default)}
.fl-t.start{fill:#fff;font-weight:700}.fl-t.end,.fl-t.ref{font-weight:700;fill:var(--uatr-color-primary-strong)}.fl-t.screen{font-weight:700}.fl-t.system{font-style:italic;fill:var(--uatr-color-text-secondary)}
.fl-t.error{fill:var(--uatr-color-danger-text)}.fl-t.modal{fill:var(--uatr-color-tog-text);font-weight:700}
.fl-dag{font:700 12px var(--uatr-font-family-base);fill:var(--uatr-color-warning-text)}
svg.fl a{cursor:pointer}svg.fl a:hover .fl-n{filter:brightness(.97)}svg.fl a:focus-visible{outline:2px solid var(--uatr-color-primary-strong)}
.flow details{margin:10px 0 0;font-size:13px}.flow summary{cursor:pointer;font-weight:700;color:var(--uatr-color-primary-strong)}.flow ol{margin:8px 0 0;padding-left:22px;max-width:80ch}.flow li{margin:4px 0}
.gsec{margin-top:44px}.gsec>h2{border-top:3px solid var(--uatr-color-primary-default);padding-top:12px}
.fnav{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 16px}.fnav a{background:#fff;border:1px solid var(--uatr-color-border-default);border-radius:999px;padding:3px 12px;font-size:13px;text-decoration:none}
.callout{background:var(--uatr-color-warning-bg);border:1px solid var(--uatr-color-warning-border);color:var(--uatr-color-warning-text);border-radius:var(--uatr-radius-md);padding:10px 14px;font-size:13px;margin:12px 0}
