:root { color-scheme: light dark;
  --bg: #FBFAF8; --surface: #FFFFFF; --fg: #1D2321; --muted: #5F6866; --line: #DCDFDD; --band: #F2F3F1;
  --accent: #C93A55; --accent-soft: #FBE7EB; --lane: #F7F7F5; --lane-alt: #FFFFFF;
  --stock: #1E5C9E; --stock-bg: #E3ECF7; --money: #8A5600; --money-bg: #F7ECD5;
  --s-answered: #2E7D4F; --s-found_in_data: #0D6B71; --s-suggested: #3D5A80; --s-open: #A8650A;
  --s-conflicting: #B3261E; --s-needs_consultant: #4F46A5; --s-unsourced: #8A918E; --s-default: #8A918E;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", Consolas, monospace; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --bg: #141716; --surface: #1B1F1E; --fg: #E7EAE8; --muted: #9AA49F; --line: #2E3432; --band: #222826;
  --accent: #F0697F; --accent-soft: #3A1C23; --lane: #181C1B; --lane-alt: #1D2120;
  --stock: #8DB9EE; --stock-bg: #1B2838; --money: #E7BA62; --money-bg: #2E2615;
  --s-answered: #6CC791; --s-found_in_data: #52B9BE; --s-suggested: #8FB0DB; --s-open: #F0B35A;
  --s-conflicting: #F28B82; --s-needs_consultant: #A59CF2; --s-unsourced: #9AA49F; --s-default: #9AA49F; } }
:root[data-theme="dark"] {
  --bg: #141716; --surface: #1B1F1E; --fg: #E7EAE8; --muted: #9AA49F; --line: #2E3432; --band: #222826;
  --accent: #F0697F; --accent-soft: #3A1C23; --lane: #181C1B; --lane-alt: #1D2120;
  --stock: #8DB9EE; --stock-bg: #1B2838; --money: #E7BA62; --money-bg: #2E2615;
  --s-answered: #6CC791; --s-found_in_data: #52B9BE; --s-suggested: #8FB0DB; --s-open: #F0B35A;
  --s-conflicting: #F28B82; --s-needs_consultant: #A59CF2; --s-unsourced: #9AA49F; --s-default: #9AA49F; }

* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 15px/1.5 var(--font-body); }
a { color: var(--accent); }
code, .mono { font-family: var(--font-mono); font-size: 0.9em; }
h1, h2, h3 { font-family: var(--font-display); line-height: 1.2; letter-spacing: -0.01em; }
.muted { color: var(--muted); }
.pill { display: inline-block; font: 500 11.5px/1.6 var(--font-mono); padding: 0 8px; border-radius: 999px;
  border: 1px solid currentColor; white-space: nowrap; }
.st-answered { color: var(--s-answered); } .st-found_in_data { color: var(--s-found_in_data); }
.st-suggested { color: var(--s-suggested); } .st-open { color: var(--s-open); }
.st-conflicting { color: var(--s-conflicting); } .st-needs_consultant { color: var(--s-needs_consultant); }
.st-unsourced, .st-default { color: var(--s-unsourced); }
.stock { color: var(--stock); background: var(--stock-bg); border-color: var(--stock); }
.money { color: var(--money); background: var(--money-bg); border-color: var(--money); }

/* Process Map SVG */
.map-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
svg.pm { display: block; font-family: var(--font-body); }
svg.pm .lane { fill: var(--lane); } svg.pm .lane.alt { fill: var(--lane-alt); }
svg.pm .sep { stroke: var(--line); stroke-width: 1; }
svg.pm .lane-name { font: 600 13px var(--font-display); fill: var(--fg); text-transform: uppercase; letter-spacing: .06em; }
svg.pm .band { fill: var(--band); stroke: var(--line); stroke-width: 1; }
svg.pm .band.stage1 { fill: var(--accent-soft); stroke: var(--accent); }
svg.pm .band.open { fill: none; stroke: var(--s-open); stroke-dasharray: 5 4; }
svg.pm .band.unused { fill: none; stroke: var(--line); stroke-dasharray: 2 4; }
svg.pm .gl { font: 500 11px var(--font-mono); fill: var(--muted); }
svg.pm .gl.stage1 { fill: var(--accent); }
svg.pm .n { fill: var(--surface); stroke: var(--line); stroke-width: 1; }
svg.pm .n.stage1 { stroke: var(--accent); stroke-width: 1.5; }
svg.pm g.dim { opacity: .4; }
svg.pm .n.onpath { stroke: var(--fg); stroke-width: 2; }
svg.pm .sid { font: 500 10px var(--font-mono); fill: var(--muted); }
svg.pm .t { font: 600 12.5px var(--font-body); fill: var(--fg); }
svg.pm .r { font: 400 10.5px var(--font-mono); fill: var(--muted); }
svg.pm .r.open { fill: var(--s-open); font-weight: 600; }
svg.pm .who { fill: var(--band); stroke: var(--line); }
svg.pm .whot { font: 500 9.5px var(--font-body); fill: var(--muted); }
svg.pm .dot { stroke: var(--surface); stroke-width: 1.5; }
svg.pm .e { fill: none; stroke: var(--fg); stroke-width: 2; }
svg.pm .ah { fill: var(--fg); }
svg.pm .badge { stroke: var(--surface); stroke-width: 2; }
svg.pm .badget { font: 700 11px var(--font-body); fill: #fff; }
svg.pm .thr { font: 500 9px var(--font-mono); }
svg.pm g.step { cursor: pointer; }
svg.pm .e.skip { stroke-dasharray: 4 4; opacity: .5; }
svg.pm .thr-bg.stock { fill: var(--stock-bg); stroke: var(--stock); } svg.pm .thr.stock { fill: var(--stock); }
svg.pm .thr-bg.money { fill: var(--money-bg); stroke: var(--money); } svg.pm .thr.money { fill: var(--money); }
svg.pm .dot.s-answered, svg.pm .badge.o-ok { fill: var(--s-answered); }
svg.pm .dot.s-found_in_data { fill: var(--s-found_in_data); }
svg.pm .dot.s-suggested, svg.pm .badge.o-wait { fill: var(--s-suggested); }
svg.pm .dot.s-open, svg.pm .badge.o-warn, svg.pm .badge.o-hold, svg.pm .badge.o-stop { fill: var(--s-open); }
svg.pm .dot.s-conflicting, svg.pm .badge.o-reject, svg.pm .badge.o-blocked { fill: var(--s-conflicting); }
svg.pm .dot.s-needs_consultant, svg.pm .badge.o-approval { fill: var(--s-needs_consultant); }
svg.pm .badge.o-skip { fill: var(--s-default); }
.legend .sw.stage1 { background: var(--accent-soft); border: 1px solid var(--accent); }
.legend .sw.useopen { border: 1px dashed var(--s-open); }
.dot-answered { background: var(--s-answered); } .dot-found_in_data { background: var(--s-found_in_data); }
.dot-suggested { background: var(--s-suggested); } .dot-open { background: var(--s-open); }
.dot-conflicting { background: var(--s-conflicting); } .dot-needs_consultant { background: var(--s-needs_consultant); }
.stage1-pill { color: var(--accent); }
.out-ok { color: var(--s-answered); } .out-warn, .out-hold, .out-stop { color: var(--s-open); }
.out-reject, .out-blocked { color: var(--s-conflicting); } .out-approval { color: var(--s-needs_consultant); }
.out-wait { color: var(--s-suggested); } .out-skip { color: var(--s-default); }
svg.pm g.step:hover .n { stroke: var(--accent); }
svg.pm g.step.sel .n { stroke: var(--accent); stroke-width: 2.5; }
.legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--muted); margin: 10px 0; align-items: center; }
.legend i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 5px; vertical-align: -1px; }
.legend .sw { display: inline-block; width: 18px; height: 11px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }