/* ============================================================
   Compliance surveys — the new look
   Surveys cabinet (#/survey-files, survey-cabinet.js), Survey Work
   (#/poc) and the citation case file (#/poc/<id>, survey-phase1.js).
   Loads after ivy-refresh.css and uses its tokens. Everything is
   scoped under .sv so the other screens are untouched. The few
   colors the refresh does not name are tokens here, so the screen
   files carry no colors.
   ============================================================ */

.sv {
  display: flex; flex-direction: column; gap: 20px;
  max-width: 1440px; min-width: 0; color: var(--fg);
  font-size: var(--fs-md);
}
.sv *, .sv *::before, .sv *::after { box-sizing: border-box; }
.sv [hidden] { display: none !important; }
.sv a { color: var(--teal); text-decoration: none; }
.sv a:hover { text-decoration: underline; }
.sv h1, .sv h2, .sv h3 { margin: 0; font-family: var(--font-display); color: var(--fg); letter-spacing: -0.012em; }
.sv p { margin: 0; }
.sv-i { width: 16px; height: 16px; flex: none; }
.sv-spacer { flex: 1 1 auto; }
.sv-muted { color: var(--muted); font-size: var(--fs-sm); }
.sv-fresh { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--muted); }
.sv-fresh::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--ok); }

/* ---------- page head ---------- */
.sv-head { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.sv-head-text { flex: 1 1 420px; min-width: 0; }
.sv-head h1 { margin-top: 2px; }
.sv-head p { margin-top: 6px; color: var(--fg-soft); max-width: 72ch; }
.sv-head-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 8px; color: var(--fg-soft); font-size: var(--fs-base); }
.sv-head-meta i { width: 3px; height: 3px; border-radius: 50%; background: var(--faint); }
.sv-head-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ---------- buttons ---------- */
.sv .sv-btn {
  box-shadow: none;
}
.sv .sv-btn:hover { background: var(--surface-hover); text-decoration: none; }
.sv .sv-btn:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
.sv .sv-btn[disabled] { opacity: .5; cursor: not-allowed; }
.sv .sv-btn .sv-i { width: 15px; height: 15px; }
.sv .sv-btn-primary { background: var(--teal); border-color: var(--teal); color: var(--on-solid); box-shadow: var(--shadow-sm); }
.sv .sv-btn-primary:hover { background: var(--teal-deep); border-color: var(--teal-deep); }
.sv .sv-btn-soft { background: var(--teal-soft); border-color: transparent; color: var(--brand-ink); }
.sv .sv-btn-soft:hover { background: var(--teal-line); }
.sv .sv-btn-ghost { background: transparent; border-color: transparent; color: var(--fg-soft); }
.sv .sv-btn-ghost:hover { background: var(--surface-hover); color: var(--fg); }
.sv .sv-btn-xs { height: var(--ctl-h-sm); padding: 0 var(--ctl-px-sm); font-size: var(--fs-sm); border-radius: var(--r-sm); box-sizing: border-box; }
.sv .sv-btn-ok { color: var(--ok-ink); border-color: var(--ok-line); background: var(--ok-soft); }
.sv .sv-btn-ok:hover { background: var(--ok-line); }
.sv .sv-btn-danger { color: var(--danger-ink); border-color: var(--danger-line); }
.sv .sv-btn-danger:hover { background: var(--danger-soft); }

/* ---------- chips, status words, tags, severity ---------- */
.sv-chip { border: 1px solid var(--line); background: var(--surface-sunk); color: var(--fg-soft); }
.sv-chip .sv-i { width: 13px; height: 13px; }
.sv-chip.is-critical { background: var(--danger-soft); border-color: var(--danger-line); color: var(--danger-ink); }
.sv-chip.is-warning { background: var(--warn-soft); border-color: var(--warn-line); color: var(--warn-ink); }
.sv-chip.is-success { background: var(--ok-soft); border-color: var(--ok-line); color: var(--ok-ink); }
.sv-chip.is-info { background: var(--info-soft); border-color: var(--info-line); color: var(--info-ink); }
.sv-chip.is-brand { background: var(--teal-soft); border-color: var(--teal-line); color: var(--brand-ink); }
.sv-status { align-items: center; white-space: nowrap; }
.sv-status .sv-i { width: 15px; height: 15px; }
.sv-status.is-critical { color: var(--danger-ink); } .sv-status.is-critical .sv-i { color: var(--danger); }
.sv-status.is-warning { color: var(--warn-ink); } .sv-status.is-warning .sv-i { color: var(--warn); }
.sv-status.is-success { color: var(--ok-ink); } .sv-status.is-success .sv-i { color: var(--ok); }
.sv-status.is-info { color: var(--info-ink); } .sv-status.is-info .sv-i { color: var(--info); }
.sv-status.is-neutral { color: var(--fg-soft); } .sv-status.is-neutral .sv-i { color: var(--muted); }
.sv-ftag { font-family: var(--font-display); font-weight: 750; letter-spacing: -.01em; color: var(--fg); }
.sv-ftag.is-lg { font-size: var(--fs-3xl); line-height: 1; }
.sv-ftag.is-xl { font-size: 34px; line-height: 1; }
.sv-sev {
  display: inline-grid; place-items: center; width: 26px; height: 26px; flex: none;
  border-radius: 7px; font-weight: 800; font-size: var(--fs-base); font-family: var(--font-display);
  border: 1.5px solid var(--line); background: var(--surface-sunk); color: var(--fg-soft);
}
.sv-sev-2 { border-color: var(--warn-line); background: var(--warn-soft); color: var(--warn-ink); }
.sv-sev-3 { border-color: var(--danger-line); background: var(--danger-soft); color: var(--danger-ink); }
.sv-sev-4 { border-color: var(--danger); background: var(--danger); color: var(--on-solid); border-radius: 50%; }
.sv-sev.is-big { width: 40px; height: 40px; font-size: var(--fs-2xl); border-radius: 10px; }
.sv-sev-4.is-big { border-radius: 50%; }
.sv-ss-grid { display: inline-grid; grid-template-columns: repeat(3, 8px); grid-template-rows: repeat(4, 8px); gap: 2px; }
.sv-ss-grid i { display: block; border-radius: 2px; background: var(--surface-sunk); }
.sv-ss-grid i.on { background: var(--danger); }
.sv-ij { display: inline-flex; align-items: center; gap: 4px; height: 22px; padding: 0 7px; border-radius: 5px; background: var(--danger); color: var(--on-solid); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .04em; }
.sv-ij .sv-i { width: 13px; height: 13px; }
.sv-pill { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 8px; border: 1px solid var(--line); border-radius: 7px; background: var(--card); font-size: var(--fs-sm); }
.sv-pill.is-more { color: var(--muted); font-weight: 600; }
.sv-bchip { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); font-weight: 600; color: var(--fg-soft); white-space: nowrap; }
.sv-dot { width: 8px; height: 8px; border-radius: 2px; background: var(--muted); flex: none; }
.sv-b-davenport { background: var(--bldg-davenport); }
.sv-b-angel-oak { background: var(--bldg-angel-oak); }
.sv-b-silver-oak { background: var(--bldg-silver-oak); }
.sv-av { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: var(--on-solid); font-size: var(--fs-2xs); font-weight: 700; flex: none; background: var(--av-0); }
.sv-av.a1 { background: var(--av-1); } .sv-av.a2 { background: var(--av-2); } .sv-av.a3 { background: var(--av-3); }
.sv-av.a4 { background: var(--av-4); } .sv-av.a5 { background: var(--av-5); }
.sv-owner { display: inline-flex; align-items: center; gap: 7px; font-size: var(--fs-base); font-weight: 600; color: var(--fg); min-width: 0; }
.sv-owner > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-noowner { display: inline-flex; align-items: center; gap: 5px; font-size: var(--fs-base); font-weight: 650; color: var(--warn-ink); }
.sv-noowner .sv-i { color: var(--warn); width: 15px; height: 15px; }
.sv-count { margin-left: 4px; background: var(--surface-sunk); color: var(--fg-soft); font-family: var(--font-sans); vertical-align: 2px; }

/* ---------- cards and layout ---------- */
.sv-card { min-width: 0; }
.sv-card-head { display: flex; align-items: center; gap: 10px; padding: 16px 18px 0; flex-wrap: wrap; }
.sv-card-head h2 { font-size: var(--fs-lg); font-weight: 700; display: flex; align-items: center; gap: 6px; }
.sv-card-head h2 .sv-i { color: var(--teal); }
.sv-card-sub { color: var(--muted); font-size: var(--fs-sm); margin-top: 2px; }
.sv-card-body { padding: 14px 18px 18px; }
.sv-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; align-items: start; }
.sv-main, .sv-rail { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.sv-sec-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.sv-sub-head { margin: 18px 0 10px; font-size: var(--fs-base); font-weight: 700; color: var(--fg); display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.sv-sub-head .sv-muted { font-weight: 500; }

.sv-empty { padding: 36px 24px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.sv-empty h2 { font-size: var(--fs-xl); }
.sv-empty p { color: var(--fg-soft); max-width: 560px; }
.sv-empty-ico { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--teal-soft); color: var(--teal); }
.sv-empty-ico .sv-i { width: 22px; height: 22px; }
.sv-empty-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin: 4px 0; }
.sv-loading { padding: 40px 24px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.sv-spin { width: 22px; height: 22px; border-radius: 50%; border: 2.5px solid var(--surface-sunk); border-top-color: var(--teal); animation: sv-spin .8s linear infinite; }
@keyframes sv-spin { to { transform: rotate(360deg); } }

/* ---------- enforcement clock ---------- */
.sv-clock { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden; box-shadow: var(--shadow-sm); }
.sv-clk { position: relative; display: flex; flex-direction: column; gap: 3px; padding: 14px 16px 15px; background: var(--card); color: inherit; min-width: 0; border: 0; text-align: left; font: inherit; }
button.sv-clk { cursor: pointer; }
button.sv-clk:hover { background: var(--surface-hover); }
button.sv-clk::after { content: ""; position: absolute; top: 16px; right: 16px; width: 6px; height: 6px; border-top: 1.5px solid var(--faint); border-right: 1.5px solid var(--faint); transform: rotate(45deg); }
.sv-clk-label { display: flex; align-items: center; gap: 6px; font-size: var(--fs-sm); font-weight: 600; color: var(--fg-soft); padding-right: 14px; }
.sv-clk-label .sv-i { width: 15px; height: 15px; color: var(--muted); }
.sv-clk-label span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-clk-value { font-family: var(--font-display); font-size: var(--fs-2xl); font-weight: 750; letter-spacing: -.01em; margin-top: 4px; }
.sv-clk-count { font-size: var(--fs-sm); font-weight: 600; color: var(--muted); }
.sv-clk.is-warning .sv-clk-label .sv-i, .sv-clk.is-warning .sv-clk-count { color: var(--warn-ink); }
.sv-clk.is-warning .sv-clk-label .sv-i { color: var(--warn); }
.sv-clk.is-critical .sv-clk-label .sv-i { color: var(--danger); }
.sv-clk.is-critical .sv-clk-count { color: var(--danger-ink); }
.sv-clk.is-info .sv-clk-label .sv-i { color: var(--teal); }
.sv-clk.is-info .sv-clk-count { color: var(--brand-ink); }
.sv-clock-empty { display: flex; align-items: center; gap: 10px; padding: 16px 18px; border: 1px dashed var(--line-strong); border-radius: var(--r-card); background: var(--card); color: var(--fg-soft); }
.sv-clock-empty .sv-i { color: var(--muted); }
.sv-clock.is-loading { min-height: 92px; }
.sv-clock.is-loading div { background: var(--card); min-height: 92px; }

/* ---------- Surveys cabinet ---------- */
.sc-wrap { padding: 0; }
.sc-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sc-stat { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); box-shadow: var(--shadow-sm); }
.sc-stat-value { margin-top: 4px; }
.sc-stat-hint { font-size: var(--fs-sm); color: var(--muted); margin-top: 2px; }
.sc-drop {
  display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 14px; align-items: center;
  border: 1.5px dashed var(--line-strong); border-radius: var(--r-card); padding: 16px 18px; background: var(--surface-2);
  cursor: pointer; transition: border-color 120ms, background 120ms;
}
.sc-drop:hover, .sc-drop.is-over { border-color: var(--teal); background: var(--teal-soft); }
.sc-drop input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.sc-drop:focus-within { outline: 2px solid var(--teal); outline-offset: 2px; }
.sc-drop-ico { grid-row: 1 / span 2; width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--card); border: 1px solid var(--line); color: var(--teal); }
.sc-drop-ico .sv-i { width: 20px; height: 20px; }
.sc-drop > span:nth-of-type(2) { font-size: var(--fs-md); color: var(--fg); }
.sc-drop-hint { font-size: var(--fs-sm); color: var(--muted); }
.sc-notice { padding: 10px 14px; border-radius: 10px; background: var(--surface-sunk); color: var(--fg-soft); font-size: var(--fs-base); font-weight: 600; }
.sc-notice.is-good { background: var(--ok-soft); color: var(--ok-ink); }
.sc-notice.is-warn { background: var(--warn-soft); color: var(--warn-ink); }
.sc-notice.is-bad { background: var(--danger-soft); color: var(--danger-ink); }
[data-sc-uploads]:empty { display: none; }
[data-sc-uploads] { display: flex; flex-direction: column; gap: 12px; }
.sc-card { overflow: hidden; }
.sc-card.is-saved { border-color: var(--ok-line); }
.sc-card-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: var(--surface-2); border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.sc-card-head h3 { font-size: var(--fs-lead); flex: 1 1 200px; min-width: 0; overflow-wrap: anywhere; }
.sc-card-ico { color: var(--teal); width: 18px; height: 18px; }
.sc-card.is-saved .sc-card-ico { color: var(--ok); }
.sc-text-btn { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--danger-line); background: var(--card); border-radius: var(--r-sm); height: var(--ctl-h-sm); padding: 0 var(--ctl-px-sm); font: inherit; font-size: var(--fs-sm); font-weight: 600; cursor: pointer; color: var(--danger-ink); box-sizing: border-box; }
.sc-text-btn .sv-i { width: 13px; height: 13px; }
.sc-fields { display: flex; gap: 14px; flex-wrap: wrap; padding: 14px 16px 0; }
.sc-fields label { display: flex; flex-direction: column; gap: 5px; font-size: var(--fs-sm); font-weight: 600; color: var(--fg-soft); min-width: 160px; flex: 1 1 160px; }
.sc-fields select, .sc-fields input, .sc-toolbar select { height: 36px; border: 1px solid var(--input-line); border-radius: 8px; padding: 0 10px; font: inherit; font-size: var(--fs-base); color: var(--fg); background: var(--card); }
.sc-check { display: flex; align-items: center; gap: 8px; padding: 0 16px 10px; font-size: var(--fs-base); color: var(--fg); }
.sc-hint { margin: 10px 16px !important; font-size: var(--fs-base); color: var(--fg-soft); }
.sc-warn { margin: 12px 16px !important; padding: 10px 12px 10px 28px; background: var(--warn-soft); border: 1px solid var(--warn-line); border-radius: 8px; color: var(--warn-ink); font-size: var(--fs-base); }
p.sc-warn { padding-left: 12px; }
.sc-steps { margin: 0; padding: 12px 16px 14px 34px; font-size: var(--fs-base); color: var(--fg-soft); }
.sc-card-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--line); background: var(--surface-2); flex-wrap: wrap; }
.sc-muted { color: var(--muted); font-size: var(--fs-sm); }
.sc-error { color: var(--danger-ink); font-size: var(--fs-base); font-weight: 600; }
.sc-pad { padding: 12px 18px 18px; }
.sc-pad-x { padding: 8px 18px 0; }
.sc-empty { text-align: center; color: var(--muted); padding: 28px 12px; }
.sc-toolbar label { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); font-weight: 600; color: var(--fg-soft); }
.sc-history .sv-card-head { padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.sc-hist-list { padding: 6px 0; }
.sc-hist { position: relative; display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding: 12px 18px; }
.sc-hist + .sc-hist::before { content: ""; position: absolute; left: 31px; top: -12px; height: 22px; width: 2px; background: var(--line); }
.sc-hist.is-open { background: var(--surface-2); }
.sc-hist-dot { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--teal-soft); color: var(--teal); position: relative; z-index: 1; }
.sc-hist-dot .sv-i { width: 14px; height: 14px; }
.sc-hist.is-cms .sc-hist-dot { background: var(--surface-sunk); color: var(--muted); }
.sc-hist-body { min-width: 0; }
.sc-hist-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-height: 28px; }
.sc-date { background: none; border: 0; padding: 0; font: inherit; font-family: var(--font-display); font-size: var(--fs-lead); font-weight: 750; color: var(--fg); cursor: pointer; text-align: left; }
.sc-date:hover { color: var(--teal); text-decoration: underline; }
.sc-hist-type { font-size: var(--fs-base); color: var(--fg-soft); font-weight: 600; }
.sc-hist-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin-top: 4px; font-size: var(--fs-sm); color: var(--muted); }
.sc-hist-meta b { color: var(--fg); font-weight: 650; }
.sc-hist-poc { margin-left: auto; }
.sc-hist-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.sc-hist-tags .sv-pill { height: 24px; font-size: var(--fs-sm); }
.sc-detail { margin-top: 10px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); font-size: var(--fs-base); color: var(--fg-soft); }
.sc-docs { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.sc-docs li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sc-docs .sv-i { color: var(--muted); }
.sc-open { display: inline-flex; align-items: center; gap: 4px; color: var(--teal); font-weight: 650; }
.sc-open .sv-i { width: 13px; height: 13px; }
.sc-pill { background: var(--surface-sunk); color: var(--fg-soft); border: 1px solid var(--line); }
.sc-pill.is-info { background: var(--info-soft); border-color: var(--info-line); color: var(--info-ink); }
.sc-pill.is-success, .sc-pill.is-good { background: var(--ok-soft); border-color: var(--ok-line); color: var(--ok-ink); }
.sc-pill.is-bad { background: var(--danger); border-color: var(--danger); color: var(--on-solid); }
.sc-packet-list { list-style: none; margin: 0; padding: 8px 10px 12px; display: grid; gap: 4px; }
.sc-packet-list li { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px; border-radius: 9px; }
.sc-packet-list li:hover { background: var(--surface-hover); }
.sc-packet-list strong { display: block; font-size: var(--fs-base); }
.sc-packet-list .sc-muted { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-packet-ico { width: 32px; height: 32px; border-radius: 8px; display: grid; place-items: center; background: var(--teal-soft); color: var(--teal); }
.sc-repeat { list-style: none; margin: 0; padding: 6px 0 10px; }
.sc-repeat li { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 18px; border-bottom: 1px solid var(--line-soft); font-size: var(--fs-base); }
.sc-repeat li:last-child { border-bottom: 0; }
.sc-repeat-title { color: var(--fg-soft); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-fines { padding: 18px; display: flex; flex-direction: column; gap: 6px; }
.sc-fine { font-family: var(--font-display); font-size: var(--fs-kpi); font-weight: 750; letter-spacing: -.01em; }

/* ---------- Survey Work: KPI tiles, filters, board ---------- */
.sv-work-app { display: flex; flex-direction: column; gap: 16px; }
.sv-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sv-filters { display: flex; gap: 6px; flex-wrap: wrap; }
.sv-fchip span { opacity: .7; font-variant-numeric: tabular-nums; }
.sv-tool-note { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-base); font-weight: 600; }
.sv-tool-note.is-warning { color: var(--warn-ink); } .sv-tool-note.is-warning .sv-i { color: var(--warn); }
.sv-tool-note.is-ok { color: var(--ok-ink); } .sv-tool-note.is-ok .sv-i { color: var(--ok); }
.sv-board { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: start; }
.sv-lane { display: flex; flex-direction: column; gap: 10px; padding: 12px; border-radius: var(--r-card); background: var(--surface-sunk); min-width: 0; }
.sv-lane-head { display: flex; align-items: center; gap: 8px; font-size: var(--fs-base); font-weight: 700; padding: 2px 4px 0; }
.sv-lane-hint { font-size: var(--fs-sm); color: var(--muted); padding: 0 4px; margin-top: -6px; }
.sv-lane-count { background: var(--card); color: var(--fg-soft); }
.sv-lane-count.is-warning { background: var(--warn-soft); color: var(--warn-ink); }
.sv-swatch { width: 9px; height: 9px; border-radius: 2px; background: var(--muted); flex: none; }
.sv-swatch.is-warning { background: var(--warn); } .sv-swatch.is-brand { background: var(--teal); }
.sv-swatch.is-info { background: var(--info); } .sv-swatch.is-success { background: var(--ok); }
.sv-lane-empty { display: none; align-items: center; gap: 6px; justify-content: center; padding: 18px 8px; border: 1px dashed var(--line-strong); border-radius: 10px; color: var(--muted); font-size: var(--fs-sm); text-align: center; }
.sv-lane-empty .sv-i { color: var(--ok); }
.sv-lane.is-empty .sv-lane-empty, .sv-lane.is-filtered-empty .sv-lane-empty { display: flex; }
.sv-qcard {
  display: flex; flex-direction: column; gap: 8px; width: 100%; text-align: left; font: inherit; color: var(--fg);
  padding: 14px 14px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); box-shadow: var(--shadow-sm);
  cursor: pointer; position: relative; transition: border-color 120ms, box-shadow 120ms;
}
.sv-qcard:hover { border-color: var(--teal-line); box-shadow: var(--shadow); }
.sv-qcard:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
.sv-qcard::before { content: ""; position: absolute; left: -1px; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: transparent; }
.sv-qcard.is-critical::before { background: var(--danger); }
.sv-qcard.is-warning::before { background: var(--warn); }
.sv-qcard.is-noowner { border-color: var(--warn-line); }
.sv-qcard-top { display: flex; align-items: center; gap: 8px; }
.sv-qcard-flags { margin-left: auto; display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.sv-qcard-title { font-weight: 650; font-size: var(--fs-base); line-height: 1.35; }
.sv-qcard-src { display: flex; align-items: center; gap: 5px; font-size: var(--fs-sm); color: var(--muted); }
.sv-qcard-src .sv-i { width: 13px; height: 13px; }
.sv-qcard-mid { display: flex; align-items: center; gap: 6px 10px; flex-wrap: wrap; font-size: var(--fs-sm); padding: 8px 0; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.sv-qcard-ws, .sv-ws { display: inline-flex; align-items: center; gap: 6px; font-weight: 650; color: var(--fg-soft); }
.sv-qcard-ws::before, .sv-ws::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.sv-qcard-ws.is-critical, .sv-ws.is-critical { color: var(--danger-ink); } .sv-qcard-ws.is-critical::before, .sv-ws.is-critical::before { background: var(--danger); }
.sv-qcard-ws.is-warning, .sv-ws.is-warning { color: var(--warn-ink); } .sv-qcard-ws.is-warning::before, .sv-ws.is-warning::before { background: var(--warn); }
.sv-qcard-ws.is-success, .sv-ws.is-success { color: var(--ok-ink); } .sv-qcard-ws.is-success::before, .sv-ws.is-success::before { background: var(--ok); }
.sv-qcard-ws.is-info, .sv-ws.is-info { color: var(--info-ink); } .sv-qcard-ws.is-info::before, .sv-ws.is-info::before { background: var(--info); }
.sv-qcard-ev { display: inline-flex; align-items: center; gap: 4px; color: var(--fg-soft); }
.sv-qcard-ev .sv-i { width: 13px; height: 13px; }
.sv-qcard-ev.is-none { color: var(--muted); }
.sv-qcard-foot { display: flex; align-items: center; gap: 8px; min-width: 0; }

/* ---------- citation case file ---------- */
.sv-crumbs { display: flex; align-items: center; gap: 6px; font-size: var(--fs-base); color: var(--muted); flex-wrap: wrap; }
.sv-crumbs a { color: var(--muted); }
.sv-crumbs span { color: var(--fg); font-weight: 600; }
.sv-crumbs .sv-i { width: 13px; height: 13px; color: var(--faint); }
[data-poc-page-root], #poc-phase1-detail { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.sv-case-head {
  position: sticky; top: calc(var(--topbar-h, 56px) + 8px); z-index: 20;
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 6px 18px; align-items: center;
  padding: 16px 20px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card);
  box-shadow: 0 1px 2px rgba(16, 32, 36, .05), 0 10px 24px -14px rgba(16, 32, 36, .22);
}
.sv-case-id { display: flex; align-items: center; gap: 12px; padding-right: 18px; border-right: 1px solid var(--line); align-self: stretch; }
.sv-case-sev { display: flex; align-items: center; gap: 8px; }
.sv-case-titles { min-width: 0; }
.sv-case-titles h1 { font-size: var(--fs-3xl); font-weight: 750; line-height: 1.25; margin: 2px 0 6px; }
.sv-case-meta { display: flex; align-items: center; gap: 6px 14px; flex-wrap: wrap; font-size: var(--fs-base); }
.sv-case-ev { display: inline-flex; align-items: center; gap: 5px; color: var(--fg-soft); font-weight: 600; font-size: var(--fs-sm); }
.sv-case-ev .sv-i { width: 14px; height: 14px; color: var(--muted); }
.sv-case-actions { display: flex; gap: 8px; align-self: start; }
.sv-case-msg { grid-column: 1 / -1; font-size: var(--fs-base); font-weight: 600; color: var(--brand-ink); }
.sv-case-msg:empty { display: none; }
.sv-stepper-card { padding: 18px 20px 14px; }
.sv-stepper { list-style: none; margin: 0; padding: 0; display: flex; align-items: flex-start; }
.sv-step { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; position: relative; padding-right: 8px; }
.sv-step::before { content: ""; position: absolute; top: 14px; left: 34px; right: 6px; height: 2px; background: var(--line); }
.sv-step:last-child::before { display: none; }
.sv-step-dot { position: relative; z-index: 1; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-size: var(--fs-sm); font-weight: 700; border: 2px solid var(--line-strong); background: var(--card); color: var(--muted); }
.sv-step-dot .sv-i { width: 15px; height: 15px; }
.sv-step-label { font-size: var(--fs-base); font-weight: 700; color: var(--fg-soft); }
.sv-step-sub { font-size: var(--fs-sm); color: var(--muted); margin-top: -3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.sv-step.is-done .sv-step-dot { background: var(--teal); border-color: var(--teal); color: var(--on-solid); }
.sv-step.is-done::before { background: var(--teal); }
.sv-step.is-current .sv-step-dot { border-color: var(--teal); color: var(--teal); box-shadow: 0 0 0 4px var(--teal-soft); }
.sv-step.is-current .sv-step-label { color: var(--fg); }
.sv-step.is-blocked .sv-step-dot { border-color: var(--warn); color: var(--warn); background: var(--warn-soft); box-shadow: none; }
.sv-step.is-blocked.is-current .sv-step-dot { box-shadow: 0 0 0 4px var(--warn-soft); }
.sv-step.is-blocked .sv-step-sub { color: var(--warn-ink); font-weight: 600; }
.sv-next { display: flex; align-items: center; gap: 8px; margin-top: 16px; padding: 10px 12px; border-radius: 9px; font-size: var(--fs-base); font-weight: 600; background: var(--surface-2); color: var(--fg-soft); border: 1px solid var(--line); }
.sv-next .sv-i { color: var(--teal); }
.sv-next.is-warning { background: var(--warn-soft); border-color: var(--warn-line); color: var(--warn-ink); } .sv-next.is-warning .sv-i { color: var(--warn); }
.sv-next.is-critical { background: var(--danger-soft); border-color: var(--danger-line); color: var(--danger-ink); } .sv-next.is-critical .sv-i { color: var(--danger); }
.sv-next.is-success { background: var(--ok-soft); border-color: var(--ok-line); color: var(--ok-ink); } .sv-next.is-success .sv-i { color: var(--ok); }
.sv-narrative { color: var(--fg-soft); line-height: 1.6; white-space: pre-wrap; }
.sv-narrative.is-clamped { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.sv-card-body > .sv-btn-ghost { margin-top: 6px; padding-left: 0; }

/* form fields */
.sv-parts { display: flex; flex-direction: column; gap: 12px; }
.sv-part { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; align-items: start; }
.sv-part-num { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--teal-soft); color: var(--brand-ink); font-weight: 750; font-family: var(--font-display); margin-top: 2px; }
.sv-part-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sv-part-label { font-weight: 700; font-size: var(--fs-base); }
.sv-part-hint { font-size: var(--fs-sm); color: var(--muted); margin-bottom: 6px; }
.sv textarea, .sv input[type=text], .sv input[type=email], .sv input[type=number], .sv input[type=date], .sv select {
  width: 100%; border: 1px solid var(--input-line); border-radius: 8px; background: var(--card); color: var(--fg);
  font: inherit; font-size: var(--fs-base); padding: 8px 10px; min-height: 36px; box-shadow: none;
}
.sv textarea { line-height: 1.5; resize: vertical; }
.sv textarea:focus, .sv input:focus, .sv select:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft); }
.sv-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.sv-field { display: flex; flex-direction: column; gap: 5px; font-size: var(--fs-sm); font-weight: 600; color: var(--fg-soft); min-width: 0; }
.sv-field-wide { grid-column: 1 / -1; }
.sv-field-end { justify-content: flex-end; }
.sv-field-hint { font-size: var(--fs-xs); font-weight: 500; color: var(--muted); }
.sv-field-date { max-width: 220px; }
.sv-fields-tight { grid-template-columns: minmax(0, 1fr) auto; }
.sv-req { color: var(--danger); }
.sv-template { margin-top: 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.sv-template summary { display: flex; align-items: center; gap: 10px; padding: 10px 12px; cursor: pointer; list-style: none; }
.sv-template summary::-webkit-details-marker { display: none; }
.sv-template summary > .sv-i { color: var(--teal); }
.sv-template summary > span { display: flex; flex-direction: column; }
.sv-template-body { padding: 0 14px 12px 40px; font-size: var(--fs-base); color: var(--fg-soft); }
.sv-template-body ul { margin: 8px 0; padding-left: 18px; }

/* evidence */
.sv-ev-list { display: flex; flex-direction: column; gap: 10px; }
.sv-ev { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; }
.sv-ev-ico { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: var(--surface-sunk); color: var(--fg-soft); }
.sv-ev-main { min-width: 0; }
.sv-ev-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sv-ev-top b { font-weight: 650; }
.sv-ev-meta { font-size: var(--fs-sm); color: var(--muted); margin-top: 2px; text-transform: none; }
.sv-ev-note { margin-top: 6px !important; color: var(--fg-soft); line-height: 1.5; white-space: pre-wrap; font-size: var(--fs-base); }
.sv-ev-file { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; font-size: var(--fs-sm); font-weight: 600; }
.sv-ev-file .sv-i { width: 13px; height: 13px; }
.sv-ev-review { margin-top: 8px; padding: 7px 10px; border-left: 3px solid var(--line-strong); background: var(--surface-2); border-radius: 0 6px 6px 0; font-size: var(--fs-sm); color: var(--fg-soft); }
.sv-ev-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.sv-ev-empty { padding: 16px; border: 1px dashed var(--line-strong); border-radius: 10px; color: var(--muted); text-align: center; font-size: var(--fs-base); }
.sv-audits { margin-top: 14px; }
.sv-audits ul { list-style: none; margin: 6px 0 0; padding: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.sv-audits li { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 12px; font-size: var(--fs-base); border-top: 1px solid var(--line-soft); }
.sv-audits li:first-child { border-top: 0; }
.sv-audit-date { color: var(--muted); font-size: var(--fs-sm); }
.sv-audit-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-comp { font-weight: 700; font-variant-numeric: tabular-nums; }
.sv-comp.is-success { color: var(--ok-ink); } .sv-comp.is-warning { color: var(--warn-ink); } .sv-comp.is-critical { color: var(--danger-ink); }
.sv-ev-form { margin-top: 16px; padding-top: 2px; border-top: 1px solid var(--line); }
.sv-file { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 12px 0; padding: 12px; border: 1.5px dashed var(--line-strong); border-radius: 10px; background: var(--surface-2); cursor: pointer; font-size: var(--fs-base); }
.sv-file:hover { border-color: var(--teal); }
.sv-file > .sv-i { color: var(--teal); }
.sv-file input[type=file] { font-size: var(--fs-sm); max-width: 100%; }
.sv-ev-form-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 10px; }

/* activity timeline */
.sv-timeline { list-style: none; margin: 0; padding: 0; }
.sv-timeline li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; position: relative; padding-bottom: 14px; }
.sv-timeline li:not(:last-child)::before { content: ""; position: absolute; left: 13px; top: 28px; bottom: 0; width: 2px; background: var(--line); }
.sv-tl-dot { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--surface-sunk); color: var(--fg-soft); }
.sv-tl-dot .sv-i { width: 14px; height: 14px; }
.sv-timeline .is-success .sv-tl-dot { background: var(--ok-soft); color: var(--ok); }
.sv-timeline .is-warning .sv-tl-dot { background: var(--warn-soft); color: var(--warn); }
.sv-timeline .is-info .sv-tl-dot { background: var(--info-soft); color: var(--info); }
.sv-timeline .is-brand .sv-tl-dot { background: var(--teal-soft); color: var(--teal); }
.sv-tl-body { min-width: 0; padding-top: 4px; }
.sv-tl-top { display: flex; gap: 4px 10px; flex-wrap: wrap; align-items: baseline; font-size: var(--fs-base); }
.sv-tl-body p { margin-top: 3px; color: var(--fg-soft); font-size: var(--fs-base); }

/* closure checklist */
.sv-closure { border-top: 3px solid var(--warn); }
.sv-closure.is-success { border-top-color: var(--ok); }
.sv-closure.is-info { border-top-color: var(--teal); }
.sv-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.sv-checks li { display: flex; align-items: flex-start; gap: 8px; font-size: var(--fs-base); color: var(--fg); }
.sv-check-ico { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--ok-soft); color: var(--ok); }
.sv-check-ico .sv-i { width: 12px; height: 12px; stroke-width: 2.4; }
.sv-checks li.is-warn .sv-check-ico { background: var(--warn-soft); color: var(--warn); }
.sv-checks li.is-block .sv-check-ico { background: var(--danger-soft); color: var(--danger); }
.sv-checks li.is-warn, .sv-checks li.is-block { color: var(--fg-soft); }
.sv-check-tag { margin-left: auto; font-size: var(--fs-xs); font-weight: 700; color: var(--danger-ink); text-transform: uppercase; letter-spacing: .04em; }
.sv-callout { margin-top: 12px; padding: 10px 12px; border-radius: 9px; border: 1px solid var(--line); font-size: var(--fs-sm); }
.sv-callout ul { margin: 4px 0 0; padding-left: 18px; }
.sv-callout p { margin-top: 4px; white-space: pre-wrap; }
.sv-callout-title { display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: var(--fs-sm); }
.sv-callout-title .sv-i { width: 14px; height: 14px; }
.sv-callout.is-critical { background: var(--danger-soft); border-color: var(--danger-line); color: var(--danger-ink); }
.sv-callout.is-warning { background: var(--warn-soft); border-color: var(--warn-line); color: var(--warn-ink); }
.sv-callout.is-success { background: var(--ok-soft); border-color: var(--ok-line); color: var(--ok-ink); }
.sv-closure .sv-field { margin-top: 12px; }
.sv-force { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-size: var(--fs-sm); color: var(--danger-ink); }
.sv-force input { width: auto; min-height: 0; }
.sv-close-row { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; margin-top: 12px; }

/* AI card */
.sv-ai-summary { font-weight: 600; line-height: 1.5; }
.sv-ai-conf { display: flex; align-items: center; gap: 10px; margin-top: 10px; font-size: var(--fs-sm); color: var(--muted); }
.sv-meter { flex: 1; height: 6px; border-radius: 999px; background: var(--surface-sunk); overflow: hidden; }
.sv-meter span { display: block; height: 100%; background: var(--teal); border-radius: 999px; }
.sv-ai-list { margin-top: 12px; font-size: var(--fs-base); }
.sv-ai-list ul { margin: 4px 0 0; padding-left: 18px; color: var(--fg-soft); }
.sv-ai-list.is-risk ul { color: var(--danger-ink); }
.sv-ai-history { margin-top: 12px; font-size: var(--fs-sm); }
.sv-ai-history summary { cursor: pointer; color: var(--teal); font-weight: 600; }
.sv-ai-old { padding: 8px 0; border-top: 1px solid var(--line-soft); display: flex; gap: 4px 10px; flex-wrap: wrap; }
.sv-ai-old p { flex-basis: 100%; color: var(--fg-soft); }
.sv-ai-foot { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: space-between; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line-soft); }
.sv-ai .sv-card-body > .sv-btn { margin-top: 10px; }

/* QAPI links, docs */
.sv-status-line { min-height: 18px; margin: 6px 0; }
.sv-links, .sv-docs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.sv-links li { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; }
.sv-links-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.sv-pips { margin-bottom: 10px; display: flex; flex-direction: column; gap: 6px; }
.sv-pip { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; border: 1px solid var(--info-line); background: var(--info-soft); border-radius: 9px; }
.sv-pip > div { display: flex; flex-direction: column; min-width: 0; }
.sv-docs li { display: flex; align-items: center; gap: 8px; font-size: var(--fs-base); padding: 6px 0; border-bottom: 1px solid var(--line-soft); }
.sv-docs li:last-child { border-bottom: 0; }
.sv-docs li > .sv-i { color: var(--muted); }
.sv-docs-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-icon-link { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 7px; color: var(--fg-soft) !important; }
.sv-icon-link:hover { background: var(--surface-hover); }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .sv-grid { grid-template-columns: minmax(0, 1fr) 320px; }
}
@media (max-width: 1100px) {
  .sv-grid { grid-template-columns: minmax(0, 1fr); }
  .sv-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .sv { gap: 16px; }
  .sv-head-actions { width: 100%; }
  .sv-head-actions .sv-btn { flex: 1 1 0; }
  .sv-clock { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sv-clk { padding: 12px; }
  .sv-clk-value { font-size: var(--fs-xl); }
  .sc-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .sc-stat-hint { display: none; }
  .sc-hist { padding: 12px 14px; gap: 10px; }
  .sc-hist + .sc-hist::before { left: 27px; }
  .sc-hist-poc { margin-left: 0; flex-basis: 100%; }
  .sc-history .sv-card-head { padding: 14px; }
  .sc-toolbar, .sc-toolbar label, .sc-toolbar select { width: 100%; }
  .sv-board { grid-template-columns: minmax(0, 1fr); }
  .sv-lane.is-empty { padding: 10px 12px; }
  .sv-lane.is-empty .sv-lane-hint { display: none; }
  .sv-case-head { position: static; grid-template-columns: minmax(0, 1fr); padding: 14px 16px; }
  .sv-case-id { border-right: 0; padding-right: 0; }
  .sv-case-titles h1 { font-size: var(--fs-2xl); }
  .sv-case-actions { width: 100%; }
  .sv-case-actions .sv-btn { flex: 1 1 0; }
  .sv-stepper-card { padding: 14px 12px 12px; }
  .sv-step { padding-right: 2px; align-items: center; text-align: center; }
  .sv-step::before { left: calc(50% + 16px); right: calc(-50% + 16px); }
  .sv-step-dot { width: 26px; height: 26px; }
  .sv-step::before { top: 12px; }
  .sv-step-label { font-size: var(--fs-xs); }
  .sv-step-sub { display: none; }
  .sv-card-head { padding: 14px 14px 0; }
  .sv-card-body { padding: 12px 14px 14px; }
  .sv-part { grid-template-columns: 24px minmax(0, 1fr); gap: 8px; }
  .sv-part-num { width: 24px; height: 24px; font-size: var(--fs-sm); }
  .sv-fields, .sv-fields-tight { grid-template-columns: minmax(0, 1fr); }
  .sv-audits li { grid-template-columns: minmax(0, 1fr) auto; }
  .sv-audit-date { grid-column: 1 / -1; }
}

/* Survey Work filter chips carry the bucket tone */
.sv-fchip::before { content: ""; width: 7px; height: 7px; border-radius: 2px; background: var(--muted); }
.sv-fchip.is-all::before { display: none; }
.sv-fchip.is-critical::before { background: var(--danger); }
.sv-fchip.is-warning::before { background: var(--warn); }
.sv-fchip.is-info::before { background: var(--info); }
.sv-fchip.is-critical:not(.is-zero):not(.is-selected) span { color: var(--danger-ink); opacity: 1; font-weight: 700; }
.sv-fchip.is-warning:not(.is-zero):not(.is-selected) span { color: var(--warn-ink); opacity: 1; font-weight: 700; }
.sv-fchip.is-selected::before { background: var(--on-solid); }
.sv-fchip.is-zero { color: var(--muted); }
@media (max-width: 720px) {
  .sv-clk-label span { white-space: normal; }
  .sv-filters { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px 2px; scrollbar-width: none; max-width: calc(100% + 32px); }
  .sv-fchip { flex: none; }
}