/* C01/07: actual flowchart forms, with readable labels in every theme. */
.visual[data-visual="flow-symbols"],.visual[data-visual="flow"]{--flow-fill:var(--soft,#e9f5f1);--flow-line:var(--accent,#14766e);--flow-ink:var(--ink,#193345)}
.flow-symbols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;list-style:none;padding:0;margin:22px 0 0}
.flow-symbol-card{min-width:0;margin:0;padding:18px;border:1px solid var(--line,#dce5e9);border-radius:10px;background:var(--paper,#fff);break-inside:avoid;overflow-wrap:anywhere}
.flow-symbol-card h4{margin:0;font-size:17px;line-height:1.4;font-weight:700}
.visual .flow-diagram{display:block;width:100%;max-width:280px;height:auto;margin:8px auto 16px;background:transparent;border-radius:0}
.flow-diagram .flow-shape{fill:var(--flow-fill);stroke:var(--flow-line);stroke-width:2}
.flow-diagram .flow-label{fill:var(--flow-ink);font-family:'Segoe UI',system-ui,sans-serif}
.flow-diagram .flow-connector{fill:none;stroke:var(--flow-line);stroke-width:2.5;stroke-linecap:round}
.flow-diagram .flow-arrowhead{fill:var(--flow-line);stroke:none}
.flow-symbol-card p{margin:0 0 12px;font-size:15px;line-height:1.6}
.flow-symbol-card .flow-symbol-example{margin:0;padding-top:12px;border-top:1px solid var(--line,#dce5e9);font-size:14px}
.visual[data-visual="flow"]>.flow-diagram{max-width:360px;margin:20px auto}
@media(max-width:640px){.flow-symbols{grid-template-columns:1fr;gap:14px}.flow-symbol-card{padding:16px}.flow-symbol-card p{font-size:16px}.flow-symbol-card .flow-symbol-example{font-size:15px}}
@media print{.visual[data-visual="flow-symbols"],.visual[data-visual="flow"]{--flow-fill:#fff;--flow-line:#222;--flow-ink:#111;background:#fff;color:#111}.visual[data-visual="flow-symbols"]{break-inside:auto;overflow:visible}.flow-symbols{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.flow-symbol-card{background:#fff;color:#111;border-color:#bbb;break-inside:avoid}.flow-symbol-card h4{font-size:12pt}.flow-symbol-card p,.flow-symbol-card .flow-symbol-example{font-size:10pt}.visual .flow-diagram{max-width:235px}.visual[data-visual="flow"]>.flow-diagram{max-width:260px}}