/* lead-control screens. Visual direction from the visual-inventory defaults:
   theme-01 (Graphite), layout-06 (centred column), motion-02 (fade and rise),
   diagram-05 (flow steps, used by the run screens later), type-01 (Geist tight).
   Token values are copied exactly from those entries; do not change a hex. */

/* theme-01 tokens */
:root {
  --t-surface: #111318;
  --t-surface-2: #1a1d24;
  --t-text: #e8eaee;
  --t-muted: #9aa1ad;
  --t-accent: #5b8def;
  --t-accent-text: #0f1115;
  --t-line: #2a2f3a;
  --t-line-w: 1px;
  --t-radius: 8px;
  --t-shadow: none;
  --t-scrim: rgba(17,19,24,0.86);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

/* type-01 tokens */
:root {
  --f-display: Geist, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-display-w: 700;
  --f-display-ls: -0.03em;
  --f-display-size: 32px;
  --f-body: Geist, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-body-w: 400;
  --f-body-size: 16px;
  --f-label: "Geist Mono", ui-monospace, "Cascadia Mono", Consolas, Menlo, monospace;
  --f-label-w: 500;
  --f-label-tt: uppercase;
  --f-label-ls: 0.08em;
}

html { background: var(--t-surface); color-scheme: dark; }
body {
  margin: 0;
  background: var(--t-surface);
  color: var(--t-text);
  font-family: var(--f-body);
  font-weight: var(--f-body-w);
  font-size: var(--f-body-size);
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
}
a { color: var(--t-accent); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid var(--t-accent);
  outline-offset: 2px;
}

/* type-01 roles */
.stage-display, .lay-title, .mo-h, .ty-h, .th-h {
  font-family: var(--f-display);
  font-weight: var(--f-display-w);
  letter-spacing: var(--f-display-ls);
  font-size: var(--f-display-size);
  line-height: 1.1;
  margin: 0 0 12px;
}
.stage-body, .lay-body, .ty-p, .th-p, .stage-body p { font-size: var(--f-body-size); margin: 0 0 12px; }
.stage-label {
  font-family: var(--f-label);
  font-weight: var(--f-label-w);
  text-transform: var(--f-label-tt);
  letter-spacing: var(--f-label-ls);
  font-size: 12px;
  color: var(--t-muted);
}

/* layout-06 (centred reading column) */
[data-entry=layout-06] .col { max-width: 60ch; margin: 0 auto; padding: 48px 16px; }
@media (min-width: 768px) {
  .topbar .topbar-inner { max-width: 1600px; padding: 12px 24px; flex-wrap: nowrap; }
  [data-entry=layout-06] .col { max-width: 1600px; padding: 32px 24px 48px; }
}
/* a form or long text keeps a readable inner width inside the wide shell */
.reading { max-width: 760px; }
[data-entry=layout-06] .col .lay-visual { height: 160px; margin: 16px 0 48px; }

/* motion-02 (fade and rise). Armed by the page script only when motion is allowed; without
   script the content is in its finished state. */
[data-entry=motion-02] .swatch-stage.is-armed .m-el { opacity: 0; transform: translateY(24px); transition: none; }
[data-entry=motion-02] .swatch-stage.is-armed.is-played .m-el { opacity: 1; transform: none; transition: opacity 600ms var(--ease-out), transform 600ms var(--ease-out); transition-delay: calc(var(--i) * 60ms); }

/* diagram-05 (flow steps; the run screens use it in M4-S2) */
[data-entry=diagram-05] .fl { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; align-items: center; margin-top: 40px; }
[data-entry=diagram-05] .fl-box { border: var(--t-line-w) solid var(--t-line); border-radius: var(--t-radius); background: var(--t-surface-2); padding: 20px 6px; text-align: center; transition: border-color 250ms var(--ease-out); }
[data-entry=diagram-05] .fl-box .stage-label { transition: color 250ms var(--ease-out); }
[data-entry=diagram-05] .fl-svg { position: absolute; inset: 0; pointer-events: none; }
[data-entry=diagram-05] .fl-line, [data-entry=diagram-05] .fl-chev { stroke: var(--t-line); stroke-width: 1; fill: none; }
[data-entry=diagram-05] .fl-tok { position: absolute; top: -28px; left: calc(12.5% - 6px); width: 12px; height: 12px; border-radius: 999px; background: var(--t-accent); }
[data-entry=diagram-05] .tok--end { left: calc(87.5% - 6px); }
[data-entry=diagram-05] .fl-box.is-done { border-color: var(--t-accent); }
[data-entry=diagram-05] .fl-box.is-current .stage-label { color: var(--t-text); }

@media (prefers-reduced-motion: reduce) {
  [data-entry=motion-02] .swatch-stage.is-armed .m-el { opacity: 1; transform: none; transition: none; }
  * { transition-duration: 0ms !important; animation-duration: 0ms !important; }
}

/* -- chrome: top bar, nav, user and role -- */
.topbar {
  border-bottom: var(--t-line-w) solid var(--t-line);
  background: var(--t-surface);
}
.topbar-inner {
  max-width: 60ch;
  margin: 0 auto;
  padding: 12px 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
}
.brand {
  font-family: var(--f-display);
  font-weight: var(--f-display-w);
  letter-spacing: var(--f-display-ls);
  color: var(--t-text);
  text-decoration: none;
  font-size: 18px;
  margin-right: auto;
}
.nav { display: flex; flex-wrap: wrap; gap: 4px 12px; }
@media (min-width: 1280px) {
  .nav { flex-wrap: nowrap; gap: 4px 10px; }
  .nav a { white-space: nowrap; }
  .whoami { flex-shrink: 0; white-space: nowrap; }
}
.nav a, .nav .nav-soon {
  font-family: var(--f-label);
  text-transform: var(--f-label-tt);
  letter-spacing: var(--f-label-ls);
  font-size: 12px;
  padding: 6px 0;
  text-decoration: none;
  color: var(--t-muted);
}
.nav a[aria-current="page"] { color: var(--t-text); border-bottom: 1px solid var(--t-accent); }
.nav .nav-soon { opacity: 0.6; cursor: default; }
.whoami { font-size: 13px; color: var(--t-muted); display: flex; gap: 8px; align-items: center; }
.role-chip {
  font-family: var(--f-label);
  text-transform: uppercase;
  letter-spacing: var(--f-label-ls);
  font-size: 12px;
  border: var(--t-line-w) solid var(--t-line);
  border-radius: 999px;
  padding: 2px 8px;
  color: var(--t-muted);
}

/* -- controls -- */
.btn {
  font: inherit;
  font-size: 15px;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: var(--t-radius);
  border: var(--t-line-w) solid var(--t-accent);
  background: var(--t-accent);
  color: var(--t-accent-text);
  cursor: pointer;
}
.btn-quiet {
  background: transparent;
  color: var(--t-text);
  border-color: var(--t-line);
}
.field { display: block; margin: 0 0 16px; }
.field > span { display: block; margin-bottom: 6px; }
input[type=text], input[type=search], input[type=email], input[type=password], select {
  font: inherit;
  width: 100%;
  box-sizing: border-box;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: var(--t-radius);
  border: var(--t-line-w) solid var(--t-line);
  background: var(--t-surface-2);
  color: var(--t-text);
}
.filters { display: grid; gap: 8px; grid-template-columns: 1fr; margin: 16px 0 24px; }
@media (min-width: 768px) {
  .filters { grid-template-columns: 2fr 1fr 1fr 1fr; }
}

/* -- lists and details -- */
.muted { color: var(--t-muted); }
.hair { border: 0; border-top: var(--t-line-w) solid var(--t-line); margin: 24px 0; }
.card {
  display: block;
  text-decoration: none;
  color: inherit;
  border: var(--t-line-w) solid var(--t-line);
  border-radius: var(--t-radius);
  background: var(--t-surface-2);
  padding: 14px 16px;
  margin: 0 0 12px;
  overflow-wrap: anywhere;
}
a.card:hover { border-color: var(--t-accent); }
.card h3 { margin: 0 0 4px; font-size: 17px; font-weight: 600; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; padding: 0; list-style: none; }
.chip {
  font-family: var(--f-label);
  text-transform: uppercase;
  letter-spacing: var(--f-label-ls);
  font-size: 12px;
  border: var(--t-line-w) solid var(--t-line);
  border-radius: 999px;
  padding: 2px 8px;
  color: var(--t-muted);
  overflow-wrap: anywhere;
}
.verdict-kept { color: var(--t-accent); border-color: var(--t-accent); }
.kv { display: grid; grid-template-columns: 1fr; gap: 2px 12px; margin: 0; }
.kv dt { color: var(--t-muted); font-size: 13px; }
.kv dd { margin: 0 0 10px; overflow-wrap: anywhere; }
@media (min-width: 560px) {
  .kv { grid-template-columns: 180px 1fr; }
  .kv dd { margin: 0 0 6px; }
}
.section-title { margin: 32px 0 12px; font-size: 20px; font-family: var(--f-display); font-weight: 700; letter-spacing: -0.02em; }
.bar-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 8px 0 16px; }
.bar { flex: 1 1 160px; height: 10px; background: var(--t-surface-2); border: var(--t-line-w) solid var(--t-line); border-radius: var(--t-radius); overflow: hidden; }
.bar > span { display: block; height: 100%; background: var(--t-accent); }
.bar-value { font-family: var(--f-label); font-size: 13px; color: var(--t-muted); overflow-wrap: anywhere; }
.alerts { list-style: none; margin: 0; padding: 0; }
.alerts li { margin: 0 0 8px; }
.history { margin: 8px 0 0; padding-left: 18px; }
.history li { margin: 0 0 4px; overflow-wrap: anywhere; }
pre.mono { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; }
.pager { display: flex; justify-content: space-between; gap: 12px; margin: 16px 0 0; }
.pager a { min-height: 44px; display: inline-flex; align-items: center; }
.empty { border: var(--t-line-w) dashed var(--t-line); border-radius: var(--t-radius); padding: 20px 16px; color: var(--t-muted); }
.crumb { font-size: 13px; margin: 0 0 12px; }
.crumb a { color: var(--t-muted); }
.feedback-body { white-space: pre-wrap; overflow-wrap: anywhere; margin: 4px 0 0; }
.error-page h1 { font-size: 28px; }
.login-box { max-width: 420px; }
.form-error { color: var(--t-text); border: var(--t-line-w) solid var(--t-accent); border-radius: var(--t-radius); padding: 10px 12px; margin: 0 0 16px; }

table.plain { width: 100%; border-collapse: collapse; font-size: 14px; }
table.plain th, table.plain td { text-align: left; padding: 8px 6px; border-bottom: var(--t-line-w) solid var(--t-line); vertical-align: top; overflow-wrap: anywhere; }
table.plain th { color: var(--t-muted); font-weight: 500; font-size: 12px; text-transform: uppercase; letter-spacing: var(--f-label-ls); }

/* htmx request state */
.htmx-request .results-area { opacity: 0.6; }
.results-area { transition: opacity 150ms var(--ease-out); }

/* phone first: nothing wider than the screen */
img, svg, table { max-width: 100%; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; }

/* M4-S2: text areas take the theme field style; params are monospace and full width */
textarea {
  font: inherit;
  width: 100%;
  box-sizing: border-box;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: var(--t-radius);
  border: var(--t-line-w) solid var(--t-line);
  background: var(--t-surface-2);
  color: var(--t-text);
}
textarea.mono {
  font-family: ui-monospace, "Cascadia Mono", Consolas, Menlo, monospace;
  font-size: 14px;
  line-height: 1.5;
}
select {
  font: inherit;
  width: 100%;
  box-sizing: border-box;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: var(--t-radius);
  border: var(--t-line-w) solid var(--t-line);
  background: var(--t-surface-2);
  color: var(--t-text);
}

/* M4-S2: stage rows and fieldsets use the theme hairline, not the browser default */
fieldset.stage-row {
  border: var(--t-line-w) solid var(--t-line);
  border-radius: var(--t-radius);
  padding: 12px 16px 4px;
  margin: 0 0 16px;
  min-width: 0;
}
fieldset.stage-row legend { padding: 0 6px; }
.stage-help { margin: 0 0 16px; }
.check { display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 0 0 12px; }
.check input { width: 20px; height: 20px; margin: 0; accent-color: var(--t-accent); }
.warning { color: var(--t-muted); border: var(--t-line-w) solid var(--t-line); border-radius: var(--t-radius); padding: 8px 12px; margin: 0 0 16px; }
.notice { color: var(--t-text); border: var(--t-line-w) solid var(--t-accent); border-radius: var(--t-radius); padding: 10px 12px; margin: 0 0 16px; }
.head-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.actions { margin: 16px 0; }
.inline-form { display: inline; }
.inline-edit { display: flex; flex-wrap: wrap; gap: 8px; align-items: stretch; margin: 8px 0; }
.inline-edit input, .inline-edit select { flex: 1 1 180px; width: auto; }
.setting .btn, .setting form button { margin-top: 4px; }
.status-running, .status-queued { color: var(--t-accent); border-color: var(--t-accent); }
.status-failed, .status-blocked { color: var(--t-text); border-style: dashed; }
.event p { margin: 4px 0 0; }
.secret-value { display: block; font-family: ui-monospace, Consolas, monospace; overflow-wrap: anywhere; padding: 10px 12px; border: var(--t-line-w) solid var(--t-line); border-radius: var(--t-radius); background: var(--t-surface-2); margin: 8px 0; }
.reveal { margin: 8px 0; }

/* M7-S3 tables */
.table-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin: 8px 0 12px; }
.table-count { margin: 0; }
.table-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.col-picker { position: relative; }
.col-picker > summary { min-height: 44px; display: inline-flex; align-items: center; padding: 10px 16px; cursor: pointer; list-style: none; }
.col-picker > summary::-webkit-details-marker { display: none; }
.col-picker-pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; min-width: 220px; max-height: 70vh; overflow: auto; background: var(--t-surface-2); border: var(--t-line-w) solid var(--t-line); border-radius: var(--t-radius); padding: 12px 14px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4); }
.col-picker-pop .check { min-height: 34px; margin-bottom: 6px; }
.col-picker-pop .check span { font-size: 14px; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (min-width: 721px) { .table-scroll { overflow: visible; } }  /* keeps the sticky header working */
table.table-view { width: 100%; border-collapse: collapse; font-size: 14px; white-space: nowrap; }
table.table-view th, table.table-view td { text-align: left; padding: 8px 10px; border-bottom: var(--t-line-w) solid var(--t-line); vertical-align: top; }
table.table-view thead th { position: sticky; top: 0; background: var(--t-surface); z-index: 1; }
table.table-view th { color: var(--t-muted); font-weight: 500; font-size: 12px; text-transform: uppercase; letter-spacing: var(--f-label-ls); white-space: nowrap; }
.th-sort { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.th-sort:hover { color: var(--t-text); }
.th-sort.is-sorted { color: var(--t-accent); }
.sort-arrow { font-size: 12px; }
table.table-view td { color: var(--t-text); overflow-wrap: anywhere; max-width: 320px; }
table.table-view tr.table-row:hover { background: var(--t-surface-2); }
table.table-view tr.table-row[data-href] { cursor: pointer; }
table.table-view td.num, table.table-view th.num { text-align: right; font-variant-numeric: tabular-nums; }
.empty-cell { color: var(--t-muted); padding: 16px 10px !important; }
.table-actions a.btn, a.btn { text-decoration: none; }
/* the whole page is a dense table now, not a reading column */
[data-entry=layout-06] .col.table-wide { max-width: 1600px; }
@media (max-width: 720px) {
  table.table-view { font-size: 13px; }
  table.table-view th, table.table-view td { padding: 8px 8px; }
  .table-toolbar { flex-direction: column; align-items: stretch; }
  .table-actions { justify-content: flex-start; }
}

/* M7-S3 desktop: the filters, Columns and export share one row; long cells stay short */
.filter-bar { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 12px 16px; }
.filter-bar > .filters { flex: 1 1 560px; min-width: 0; margin: 16px 0 24px; }
.filter-bar > .table-actions { margin: 0 0 24px; }
@media (max-width: 720px) {
  .filter-bar > .table-actions { margin: 0 0 16px; }
}
.name-clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; max-width: 34ch; overflow-wrap: anywhere; }
details.long-text { max-width: 60ch; white-space: normal; overflow-wrap: anywhere; }
details.long-text summary { cursor: pointer; }
details.long-text p { margin: 4px 0 0; }
/* P-4 #21: an open note shows its preview and rest as one run of text, not twice. */
details.long-text[open] > p { display: inline; }
details.long-text[open] > summary .more { display: none; }
.comment-clamp { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; max-width: 60ch; overflow-wrap: anywhere; }
.cell-trunc { display: inline-block; max-width: 22ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }

/* M7-S4 */
.run-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px 24px; margin: 8px 0 0; }
.run-facts > div { min-width: 0; }
.run-facts dt { color: var(--t-muted); font-size: 12px; text-transform: uppercase; letter-spacing: var(--f-label-ls); }
.run-facts dd { margin: 2px 0 0; color: var(--t-text); overflow-wrap: anywhere; }
.run-section { margin-bottom: 8px; }
.funnel { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.funnel-row { display: grid; grid-template-columns: minmax(150px, 220px) 96px 1fr; align-items: center; gap: 12px; }
.funnel-label { color: var(--t-muted); font-size: 14px; }
.funnel-count { min-height: 44px; display: inline-flex; align-items: center; font-variant-numeric: tabular-nums; font-weight: 500; color: var(--t-text); text-decoration: none; }
.funnel-count:hover { color: var(--t-accent); }
.funnel-track { display: block; height: 10px; background: var(--t-surface-2); border-radius: var(--t-radius); overflow: hidden; }
.funnel-fill { display: block; height: 100%; background: var(--t-accent); }
.run-filter { margin: 8px 0 12px; }
.run-filter .field input { min-width: 120px; }
@media (max-width: 720px) {
  .funnel-row { grid-template-columns: 1fr auto; }
  .funnel-track { grid-column: 1 / -1; }
}
.subnav { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 8px 0 12px; }
.subnav a { min-height: 44px; display: inline-flex; align-items: center; color: var(--t-muted); text-decoration: none; }
.subnav a[aria-current="page"] { color: var(--t-text); box-shadow: inset 0 -2px 0 var(--t-accent); }
.analysis-intro { max-width: 80ch; margin: 0 0 12px; }
.analysis-filter { margin: 8px 0 4px; }
.places-note { color: var(--t-muted); font-size: 12px; white-space: nowrap; }
/* end M7-S4 */

/* M7-S2 dashboard */
.dash { display: flex; flex-direction: column; gap: 20px; }
.dash-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.dash-head .stage-display { margin: 0; font-size: 26px; }
.dash-sub { margin: 0; font-size: 13px; }
.dash-num, .dash-num-sm, .dash-table td, .dash-list .dash-num-sm { font-variant-numeric: tabular-nums; }
.dash-num { font-family: var(--f-display); font-weight: 600; font-size: 30px; line-height: 1.1; letter-spacing: -0.02em; color: var(--t-text); }
.dash-num-sm { font-weight: 500; font-size: 14px; color: var(--t-text); }
.dash-lab { font-family: var(--f-label); font-size: 12px; text-transform: uppercase; letter-spacing: var(--f-label-ls); color: var(--t-muted); }
.dash-note { font-size: 12px; color: var(--t-muted); }

/* tiles: one row of six on a PC, two columns on a phone */
.dash-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.dash-tile {
  display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; min-width: 0;
  border: var(--t-line-w) solid var(--t-line); border-radius: var(--t-radius);
  background: var(--t-surface-2); color: var(--t-text); text-decoration: none;
}
.dash-tile:hover, .dash-tile:focus-visible { border-color: var(--t-accent); }
@media (min-width: 768px) { .dash-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .dash-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); } }

/* blocks */
.dash-block { border: var(--t-line-w) solid var(--t-line); border-radius: var(--t-radius); background: var(--t-surface-2); padding: 14px 16px; min-width: 0; }
.dash-h { margin: 0 0 10px; font-family: var(--f-label); font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: var(--f-label-ls); color: var(--t-muted); }
.dash-foot { margin: 10px 0 0; font-size: 12px; }
.dash-table-wrap { overflow-x: auto; }
.dash-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.dash-table th, .dash-table td { text-align: left; padding: 9px 8px; border-bottom: var(--t-line-w) solid var(--t-line); vertical-align: middle; }
.dash-table thead th { font-family: var(--f-label); font-weight: 500; font-size: 12px; text-transform: uppercase; letter-spacing: var(--f-label-ls); color: var(--t-muted); padding-top: 0; white-space: nowrap; }
.dash-table tbody tr:last-child th, .dash-table tbody tr:last-child td { border-bottom: 0; }
.dash-table .num { text-align: right; }
.dash-client { min-width: 9em; }
.dash-name { display: block; font-weight: 500; color: var(--t-text); }
.dash-rules, .dash-sub { display: block; font-size: 12px; color: var(--t-muted); font-weight: 400; }
.dash-cell { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 4px; min-width: 64px; text-decoration: none; color: var(--t-text); }
.dash-cell:hover .dash-num-sm { color: var(--t-accent); }
.dash-bar { display: block; width: 100%; min-width: 64px; height: 3px; background: var(--t-line); border-radius: 2px; overflow: hidden; }
.dash-bar > span { display: block; height: 100%; background: var(--t-accent); }
.dash-table a { color: var(--t-text); text-decoration: none; }
.dash-table a:hover { color: var(--t-accent); }

/* three short lists side by side on a PC */
.dash-split { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
@media (min-width: 1024px) { .dash-split { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.dash-list { list-style: none; margin: 0; padding: 0; }
.dash-list li + li { border-top: var(--t-line-w) solid var(--t-line); }
.dash-list a { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 8px 0; color: var(--t-text); text-decoration: none; font-size: 14px; min-width: 0; }
.dash-list a > span:first-child { overflow-wrap: anywhere; }
.dash-list a:hover { color: var(--t-accent); }
.dash-list .muted { font-size: 14px; }
.dash-go { font-family: var(--f-label); font-size: 12px; text-transform: uppercase; letter-spacing: var(--f-label-ls); color: var(--t-muted); }
.dash-attention { border-color: var(--t-accent); }

/* phone: the wide tables become rows of label and value */
@media (max-width: 639px) {
  .dash-block { padding: 12px; }
  .dash-table-wrap { overflow: visible; }
  .dash-table thead { display: none; }
  .dash-table, .dash-table tbody, .dash-table tr { display: block; width: 100%; }
  .dash-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; padding: 10px 0; border-bottom: var(--t-line-w) solid var(--t-line); }
  .dash-table tr:last-child { border-bottom: 0; }
  .dash-table th, .dash-table td { border: 0; padding: 0; }
  .dash-table th.dash-client { grid-column: 1 / -1; }
  .dash-table td[data-label]::before { content: attr(data-label); display: block; font-family: var(--f-label); font-size: 12px; text-transform: uppercase; letter-spacing: var(--f-label-ls); color: var(--t-muted); margin-bottom: 2px; }
  .dash-table td.num { text-align: left; }
  .dash-table td:not([data-label]) { grid-column: 1 / -1; }
  .dash-cell { align-items: flex-start; }
  .dash-table td[data-label="Found by runs"] { grid-column: 1 / -1; }
  .dash-bar { min-width: 0; }
}