.flow-tab { --flow-gap: clamp(14px, 1.9vw, 30px); max-width: 1520px; margin: 0 auto; }
.flow-pagehead,.flow-sectionhead,.flow-formfoot { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.flow-pagehead { margin: 24px 0 var(--flow-gap); }
.flow-pagehead h1 { font-size:clamp(27px,3vw,44px); font-weight:620; letter-spacing:-.05em; line-height:1.12; margin:4px 0 9px; color:var(--ink,var(--text)); }
.flow-eyebrow { color:var(--forest,#325947); letter-spacing:.13em; text-transform:uppercase; font-weight:700; font-size:10px; }
.flow-intro,.flow-sectionhead p,.flow-hint,.flow-count,.flow-empty p,.flow-dialog > form > p { color:var(--muted); font-size:13px; line-height:1.5; }
.flow-actions,.flow-aux { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.flow-action,.flow-close { display:inline-flex; gap:7px; align-items:center; justify-content:center; }
.flow-register,.flow-editor { background:var(--surface,var(--card)); color:var(--ink,var(--text)); border:1px solid var(--line,var(--border)); border-radius:var(--radius,14px); margin:0 0 var(--flow-gap); min-width:0; }
.flow-register { overflow:hidden; }
.flow-editor,.flow-subeditor,.flow-sectionhead,.flow-toolbar { padding:clamp(14px,1.6vw,23px); }
.flow-editor[hidden] { display:none!important; }
.flow-sectionhead h2,.flow-editor h2,.flow-dialog h2 { margin:0; font-size:19px; font-weight:620; letter-spacing:-.025em; color:var(--ink,var(--text)); }
.flow-editor > .flow-sectionhead { padding:0; margin:0 0 16px; }
.flow-register > .flow-sectionhead,.flow-register > .flow-toolbar { border-bottom:1px solid var(--line,var(--border)); }
.flow-toolbar,.flow-inline,.flow-options { display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; }
.flow-toolbar .wide { flex:1 1 220px; }
.flow-fields { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr)); gap:12px 16px; }
.flow-field { display:flex; flex-direction:column; align-items:stretch; gap:5px; min-width:0; }
.flow-field > span,.flow-scope,.flow-check { font-weight:550; font-size:12px; color:var(--ink,var(--text)); }
.flow-field input,.flow-field select,.flow-field textarea { max-width:100%; min-width:0; width:100%; }
.flow-field input::placeholder,.flow-dialog input::placeholder { opacity:1; }
.flow-inline > .flow-field { flex:1 1 170px; }
.flow-details { border-top:1px solid var(--line,var(--border)); margin-top:15px; }
.flow-details > summary { padding:10px 0; cursor:pointer; font-size:13px; font-weight:600; }
.flow-details > summary .flow-hint { margin-left:8px; font-size:11px; font-weight:400; }
.flow-filter { margin:0; border:0; }
.flow-filter > summary { border:1px solid var(--line,var(--border)); padding:8px 12px; border-radius:8px; }
.flow-filter[open] { flex:1 1 100%; }
.flow-filter[open] > summary { width:max-content; }
.flow-options { padding:12px 0 0; align-items:center; }
.flow-check,.flow-scope { display:inline-flex; align-items:center; gap:7px; }
.flow-formfoot { margin-top:16px; border-top:1px solid var(--line,var(--border)); padding-top:14px; }
.flow-formfoot > p { flex:1 1 220px; max-width:70ch; }
.flow-formfoot .primary { margin-left:auto; }
.flow-feedback:not(:empty) { margin-top:12px; }
.flow-register > .scrollwrap { margin:0; border:0; border-radius:0; }
.flow-empty { text-align:center; padding:38px 20px; }
.flow-empty h3 { margin:0 0 5px; font-size:16px; letter-spacing:-.02em; }
.flow-empty p { margin:0 auto 14px; max-width:55ch; }
.flow-register .flow-no-rows > table { display:none; }
.flow-dialog { inset:0; margin:auto; width:min(620px,calc(100vw - 24px)); padding:24px; border:1px solid var(--line,var(--border)); border-radius:var(--radius,14px); color:var(--ink,var(--text)); background:var(--surface,var(--card)); max-height:88dvh; overflow:auto; }
.flow-dialog::backdrop { background:rgb(16 38 31/.55); }
.flow-dialog .flow-fields { margin-top:16px; }
.flow-register .flow-count { font-variant-numeric:tabular-nums; }
.flow-check input { accent-color:var(--forest); }
@container (max-width: 600px) {
  .flow-pagehead { margin-top:16px; }
  .flow-toolbar > .flow-field,.flow-toolbar > details { flex:1 1 100%; }
  .flow-pagehead .flow-actions { width:100%; }
  .flow-fields { grid-template-columns:1fr; }
}
