/* Independent DHMZ discharges block. All rules scoped to avoid changing bilten styles. */
.vp-flow {margin:30px 0 16px;padding:27px 0 28px;border-top:1px solid #dce8ec;color:#1b394b;min-width:0}
.vp-flow * {box-sizing:border-box}
.vp-flow-head {display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:15px;margin-bottom:18px}
.vp-flow-head small,.vp-flow-eyebrow{color:#47728b;font-weight:700;letter-spacing:1.5px;font-size:12px}
.vp-flow-head h2 {margin:5px 0 6px;font-size:27px;line-height:1.2;color:#133b50}
.vp-flow-head p {margin:0;color:#526d7b;font-size:14px;max-width:600px}
.vp-flow-head a {font-size:14px;text-decoration:underline;text-underline-offset:3px}
.vp-flow-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
.vp-flow button {cursor:pointer;font:inherit}
.vp-flow button:focus-visible{outline:3px solid #bd7b29;outline-offset:2px}
.vp-flow-tabs button{border:1px solid #cbdde6;background:#fff;color:#24536a;border-radius:9px;padding:9px 15px;font-weight:700}
.vp-flow-tabs button span{font-size:12px;font-weight:500;opacity:.75;margin-left:5px}
.vp-flow-tabs button[aria-pressed="true"]{background:#0e5975;color:#fff;border-color:#0e5975}
.vp-flow-tabs button:disabled{opacity:.4;cursor:default}
.vp-flow-workspace {display:grid;grid-template-columns:minmax(245px, .85fr) minmax(0, 1.65fr);gap:16px;align-items:start}
.vp-flow-stations,.vp-flow-detail {background:#fff;border:1px solid #dce8ec;border-radius:12px;padding:18px;min-width:0}
.vp-flow-stations h3{font-size:16px;margin:0 0 13px;color:#18465c}
.vp-flow-list{display:flex;flex-direction:column;gap:5px;max-height:480px;overflow-y:auto}
.vp-flow-list button{background:#fff;border:1px solid transparent;border-radius:9px;padding:11px 10px;display:flex;justify-content:space-between;align-items:center;text-align:left;gap:12px;color:#1b394b;width:100%}
.vp-flow-list button:hover{background:#f1f8fa}
.vp-flow-list button[aria-pressed="true"]{background:#e6f2f6;border:1px solid #b3d5e2}
.vp-flow-list strong{font-size:14px;display:block}
.vp-flow-list small{display:block;color:#647d8a;font-size:12px;margin-top:3px}
.vp-flow-list b{font-size:14px;white-space:nowrap;color:#0c6986;font-variant-numeric:tabular-nums}
.vp-flow-detail h3{font-size:23px;margin:6px 0 9px;color:#133b50}
.vp-flow-big{font-size:31px;color:#096883;line-height:1.15;display:block;font-variant-numeric:tabular-nums}
.vp-flow-timestamp{font-size:13px;color:#4f6b7a;margin:12px 0 10px}
.vp-flow-timestamp strong{color:#1e4255}
.vp-flow-warning{font-size:13px;color:#9a4a18;font-weight:600;margin:8px 0}
.vp-flow-range{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:19px 0 9px}
.vp-flow-range span{font-size:13px;font-weight:600;margin-right:7px}
.vp-flow-range button{border:1px solid #cadae2;border-radius:7px;background:white;color:#27546a;padding:5px 9px;font-size:12px}
.vp-flow-range button[aria-pressed="true"]{background:#0e5975;color:white;border-color:#0e5975}
.vp-flow-graph{border-top:1px solid #e7eef1;padding-top:12px;min-height:210px}
.vp-flow-graph svg{display:block;width:100%;max-height:340px;touch-action:pan-y}
.vp-flow-chart-caption{font-size:12px;color:#617a87;margin:4px 0 0}
.vp-flow-empty{background:#f5f9fa;color:#5e7480;font-size:14px;padding:16px;border-radius:8px;margin:0}
.vp-flow-foot{color:#69808d;font-size:12px;line-height:1.55;margin:16px 0 0}
@media(max-width:850px){.vp-flow-workspace{grid-template-columns:1fr}.vp-flow-list{max-height:240px}.vp-flow-detail{padding:15px}.vp-flow-head h2{font-size:24px}}
@media(max-width:500px){.vp-flow-list button{align-items:flex-start}.vp-flow-list b{font-size:13px}.vp-flow-big{font-size:28px}}

/* Server-rendered fallback: remains visible if JS does not load. */
.vp-flow-fallback {display:flex;flex-direction:column;gap:6px;max-height:460px;overflow-y:auto}
.vp-flow-fallback-row {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 3px;border-bottom:1px solid #e8eff2}
.vp-flow-fallback-row b {font-size:14px;display:block;color:#214456}
.vp-flow-fallback-row small {font-size:12px;display:block;color:#647d8a;margin-top:3px}
.vp-flow-fallback-row strong {font-size:14px;color:#0c6986;white-space:nowrap}

/* Metadata aligned with existing water-level cards, without changing their CSS. */
.vp-flow .vp-flow-meta {display:block;font-size:11px;line-height:1.55;color:#617e90;margin-top:4px;font-weight:400;}
.vp-flow .vp-flow-meta b {font-size:inherit;font-weight:600;color:inherit;}
.vp-flow .vp-flow-detail-meta {display:flex;gap:5px 14px;align-items:center;flex-wrap:wrap;margin:4px 0 12px;}
.vp-flow .vp-flow-detail-meta>.vp-flow-meta {margin:0;}
.vp-flow .vp-flow-detail-meta>small {font-size:11px;color:#617e90;}
.vp-flow .vp-flow-fallback-row>span small {display:block;}