/* =============================================================================
   Pages — page composition + composite-control styles.
   Reuses controls.css classes; colour only from tokens.
   ========================================================================== */

/* ── page-state (loading / error / empty) ────────────────────────────────── */

.page-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  padding: var(--space-10) var(--space-6);
  text-align: center;
  color: var(--text-muted);
}
.page-state__icon { font-size: 2rem; color: var(--text-muted); }
.page-state--error .page-state__icon { color: var(--status-danger); }
.page-state__title { font-family: var(--font-display); font-weight: 700; font-size: 1.1rem; color: var(--text-primary); }
.page-state__detail { font-size: var(--text-body-sm); max-width: 44ch; }

/* ── styleguide (dev) ────────────────────────────────────────────────────── */

.sg { display: flex; flex-direction: column; gap: var(--space-7); }
.sg-section {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding-bottom: var(--space-6);
  border-bottom: 1px solid var(--hairline);
}
.sg-section:last-child { border-bottom: none; }
.sg-section__head { display: flex; align-items: baseline; gap: var(--space-3); }
.sg-section__title { font-size: var(--text-h3); }
.sg-section__body { display: flex; flex-direction: column; gap: var(--space-4); }
.sg-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); }
.sg-stack { display: flex; flex-direction: column; gap: var(--space-3); max-width: 480px; }
.sg-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.sg-cite-demo { color: var(--text-secondary); }

/* ── pipeline ────────────────────────────────────────────────────────────── */

.pipeline { display: flex; flex-direction: column; gap: var(--space-6); }
.pipeline__table { margin-top: var(--space-2); }
.deal-cell { display: flex; flex-direction: column; gap: 1px; }
.deal-cell__codename { font-weight: 600; color: var(--text-primary); }
.deal-cell__name { font-size: var(--text-caption); color: var(--text-muted); }

/* "How the platform reads a deal" — dashed explainer panel */
.reads-panel {
  background: transparent;
  border-style: dashed;
  box-shadow: none;
}
.reads-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--space-5);
}
.reads-col { display: flex; flex-direction: column; gap: var(--space-2); }
.reads-col__no {
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: var(--text-caption);
  letter-spacing: 0.1em;
  color: var(--accent-emphasis);
}
.reads-col__name { font-size: var(--text-h4); color: var(--text-primary); }
.reads-col__body { font-size: var(--text-body-xs); color: var(--text-secondary); line-height: 1.6; }

/* mini stages */
.mini-stages { display: inline-flex; gap: 3px; }
.mini-stages__seg { width: 16px; height: 6px; border-radius: var(--radius-pill); background: var(--hairline-strong); }
.mini-stages__seg--done { background: var(--status-success); }
.mini-stages__seg--review { background: var(--status-warning); }
.mini-stages__seg--pending { background: var(--hairline-strong); }
.mini-stages__seg--skipped { background: transparent; box-shadow: inset 0 0 0 1px var(--hairline-strong); }

/* recommendation cell */
.rec-cell { display: flex; align-items: center; gap: var(--space-2); }
.rec-cell__note { font-size: var(--text-caption); color: var(--text-muted); }

/* risk tag */
.risk-tag {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-caption);
  font-weight: 500;
}
.risk-tag__dot { width: 8px; height: 8px; border-radius: var(--radius-pill); background: currentColor; }
.risk-tag--success { color: var(--status-success); }
.risk-tag--warning { color: var(--status-warning); }
.risk-tag--danger { color: var(--status-danger); }
.risk-tag--neutral { color: var(--text-muted); }

/* ── assessment mark ─────────────────────────────────────────────────────────
   A colored square standing in for the dimension score — conveys standing
   (full / partial / low / not assessed) without surfacing the raw number. */

.assess-mark {
  display: inline-block;
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  background: currentColor;
}
.assess-mark--full { color: var(--status-success); }
.assess-mark--part { color: var(--status-warning); }
.assess-mark--none { color: var(--status-danger); }
.assess-mark--na {
  background: transparent;
  border: 1px solid var(--hairline-strong);
}

/* ── deal page / rail ────────────────────────────────────────────────────── */

.deal-page { flex: 1; display: flex; flex-direction: column; }

.deal-rail { display: flex; flex-direction: column; gap: var(--space-2); }
.deal-rail__back {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.deal-rail__back:hover { color: var(--accent-emphasis); }

/* deal block — codename + three meta lines */
.deal-rail__deal {
  padding-bottom: var(--space-4);
  margin-bottom: var(--space-2);
  border-bottom: 1px dashed var(--hairline);
}
.deal-rail__name { font-family: var(--font-display); font-weight: 700; font-size: 1.05rem; color: var(--text-primary); }
.deal-rail__meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: var(--space-2);
}
.deal-rail__meta-line {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  letter-spacing: 0.05em;
  color: var(--text-muted);
}

/* deal block — discuss-with-Claude CTA */
.deal-rail__rule {
  height: 1px;
  margin: var(--space-4) var(--space-4) var(--space-4) 0;
  background: var(--hairline);
}
.deal-rail__claude {
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: center;
  column-gap: var(--space-3);
  width: 100%;
  padding: var(--space-3) var(--space-4) var(--space-3) 0;
  background: transparent;
  border: 0;
  cursor: pointer;
  text-align: left;
  color: var(--text-secondary);
  transition: color var(--dur) var(--ease);
}
.deal-rail__claude:hover { color: var(--text-primary); }
.deal-rail__claude-mark {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid var(--hairline-strong);
  color: var(--accent-emphasis);
  font-size: 0.9rem;
  transition: color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.deal-rail__claude:hover .deal-rail__claude-mark {
  color: var(--cta);
  border-color: var(--cta);
}
.deal-rail__claude-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.deal-rail__claude-title { font-family: var(--font-display); font-weight: 600; font-size: 0.875rem; color: inherit; }
.deal-rail__claude-sub {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}

/* ── deal header ─────────────────────────────────────────────────────────── */

.deal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: var(--space-6);
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--hairline);
  margin-bottom: var(--space-5);
}
.deal-header__main { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.deal-header__eyebrow {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--accent-emphasis);
}
.deal-header__name { font-size: var(--text-h1); }
.deal-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-5);
  margin-top: var(--space-2);
}
.deal-header__meta-item {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.deal-header__meta-label { color: var(--text-secondary); font-weight: 500; }
.deal-header__rec { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-2); flex: 0 0 auto; }
.deal-header__rec-label {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}

/* ── stage layout ────────────────────────────────────────────────────────── */

.stage { display: flex; flex-direction: column; gap: var(--space-5); }
.stage__summary { margin-bottom: var(--space-1); }

/* ── assessment explorer ─────────────────────────────────────────────────── */

.asm { display: flex; flex-direction: column; gap: var(--space-4); }
.asm__toolbar { display: flex; gap: var(--space-3); flex-wrap: wrap; align-items: center; }
.asm__search { flex: 1; min-width: 220px; }
.asm__count {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  color: var(--text-muted);
  margin-bottom: var(--space-2);
}
.asm__list { display: flex; flex-direction: column; gap: var(--space-2); }

.asm-pillar { border: 1px solid var(--hairline); border-radius: var(--radius-md); overflow: hidden; }
.asm-pillar__head {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  padding: var(--space-3) var(--space-4);
  cursor: pointer;
  background: color-mix(in srgb, var(--surface-deep) 30%, transparent);
}
.asm-pillar__head:hover { background: color-mix(in srgb, var(--text-primary) 5%, transparent); }
.asm-pillar__caret { font-size: 0.75rem; color: var(--text-muted); }
.asm-pillar__name { flex: 1; text-align: left; font-weight: 600; color: var(--text-primary); }
.asm-pillar__body { padding: var(--space-3) var(--space-4); display: flex; flex-direction: column; gap: var(--space-4); }

.asm-comp { display: flex; flex-direction: column; gap: var(--space-2); }
.asm-comp__name {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-muted);
}
.asm-comp__rows { display: flex; flex-direction: column; gap: 2px; }

.asm-row {
  display: grid;
  grid-template-columns: auto 4.5rem 1fr auto auto;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  text-align: left;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease);
}
.asm-row:hover { background: color-mix(in srgb, var(--text-primary) 6%, transparent); }
.asm-row__code { font-family: var(--font-mono); font-size: var(--text-caption); color: var(--accent-emphasis); }
.asm-row__query { font-size: var(--text-body-sm); color: var(--text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asm-row__conf { font-family: var(--font-mono); font-size: var(--text-caption); color: var(--text-muted); }
.asm-row__chevron { font-size: 0.7rem; color: var(--text-muted); }

/* assessment detail (drawer) */
.asm-detail { display: flex; flex-direction: column; gap: var(--space-4); }
.asm-detail__loading { color: var(--text-muted); font-family: var(--font-mono); font-size: var(--text-caption); }
.asm-detail__top { display: flex; align-items: center; gap: var(--space-3); }
.asm-detail__code { font-family: var(--font-mono); font-size: var(--text-body-sm); color: var(--accent-emphasis); }
.asm-detail__query { color: var(--text-primary); font-weight: 500; line-height: 1.5; }
.asm-detail__stats { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.asm-detail__stat {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  color: var(--text-muted);
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--hairline);
  border-radius: var(--radius-sm);
}
.asm-detail__section { display: flex; flex-direction: column; gap: var(--space-2); }
.asm-detail__section-title {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-muted);
}
.asm-detail__prose { color: var(--text-secondary); line-height: 1.65; white-space: pre-wrap; font-size: var(--text-body-sm); }

/* ── wave gallery ────────────────────────────────────────────────────────── */

.wave-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--space-3); }
.wave-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md);
  cursor: pointer;
  text-align: left;
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.wave-card:hover { border-color: var(--accent-emphasis); box-shadow: var(--glow-hover); }
.wave-card__name { font-weight: 600; font-size: var(--text-body-sm); color: var(--text-primary); }

/* ── result tree (wave / delta / composition results) ────────────────────── */

.rtree__obj { display: flex; flex-direction: column; gap: var(--space-3); }
.rtree__obj--root { gap: var(--space-4); }
.rtree__field { display: flex; flex-direction: column; gap: var(--space-1); }
.rtree__key {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}
.rtree__val { padding-left: var(--space-3); border-left: 1px solid var(--hairline); }
.rtree__scalar { color: var(--text-secondary); font-size: var(--text-body-sm); line-height: 1.6; white-space: pre-wrap; }
.rtree__list { display: flex; flex-direction: column; gap: var(--space-2); }
.rtree__item { padding-left: var(--space-2); }
.rtree__empty { color: var(--text-muted); font-style: italic; font-size: var(--text-body-sm); }

/* ── memo blocks ─────────────────────────────────────────────────────────── */

.memo-blocks { display: flex; flex-direction: column; gap: var(--space-2); }
.memo-block { border: 1px solid var(--hairline); border-radius: var(--radius-md); overflow: hidden; }
.memo-block__head {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  padding: var(--space-3) var(--space-4);
  cursor: pointer;
  background: color-mix(in srgb, var(--surface-deep) 30%, transparent);
}
.memo-block__head:hover { background: color-mix(in srgb, var(--text-primary) 5%, transparent); }
.memo-block__caret { font-size: 0.75rem; color: var(--text-muted); }
.memo-block__label { flex: 1; text-align: left; font-weight: 600; color: var(--text-primary); }
.memo-block__body { padding: var(--space-4) var(--space-5); }

/* ── comparison: delta view + sources ────────────────────────────────────── */

.delta-view { display: flex; flex-direction: column; gap: var(--space-4); margin-top: var(--space-4); }
.cmp-sources { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.asm-row--cmp { grid-template-columns: 4.5rem 1fr auto auto auto; }

/* ── contracts (pending) ─────────────────────────────────────────────────── */

.contracts-pending { display: flex; flex-direction: column; gap: var(--space-5); }
.contracts-planned {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-5);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--surface-deep) 30%, transparent);
}
.contracts-planned__label {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-muted);
}
.contracts-planned__list { display: flex; flex-direction: column; gap: var(--space-2); }
.contracts-planned__item {
  position: relative;
  padding-left: var(--space-4);
  color: var(--text-secondary);
  font-size: var(--text-body-sm);
  line-height: 1.5;
}
.contracts-planned__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 6px;
  height: 6px;
  border-radius: var(--radius-pill);
  background: var(--accent);
}

/* ── stage tabs spacing ──────────────────────────────────────────────────── */

.stage .tabs { margin-bottom: 0; }

/* ── library ─────────────────────────────────────────────────────────────── */

.library__toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}
.library__seg { flex-wrap: wrap; }
.library__search { width: 320px; }
.library-seg__count { margin-left: var(--space-2); font-size: 0.625rem; opacity: 0.6; }
.lib-title { display: flex; flex-direction: column; gap: var(--space-1); }
.lib-title__main {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.9375rem;
  color: var(--text-primary);
}
.lib-title__sub {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  color: var(--text-muted);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.lib-source {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.lib-source--generated { color: var(--accent-emphasis); }

/* ── models ──────────────────────────────────────────────────────────────── */

.models__controls {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-3); flex-wrap: wrap;
}
.models__framework {
  font-family: var(--font-mono); font-size: var(--text-caption);
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted);
}
.models__sets { display: flex; flex-direction: column; gap: var(--space-5); }
.set-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--space-4); }

/* set card / set-detail shared stat blocks */
.set-card { display: flex; flex-direction: column; gap: var(--space-3); }
.set-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.set-card__tags { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.set-card__name { font-family: var(--font-display); font-weight: 700; color: var(--text-primary); }
.set-card__desc { font-size: var(--text-body-sm); color: var(--text-secondary); line-height: 1.55; }
.set-card__version {
  font-family: var(--font-mono); font-size: var(--text-caption);
  color: var(--text-muted);
}
.set-card__stats,
.set-detail__stats {
  display: grid; gap: var(--space-3);
  padding-top: var(--space-3); border-top: 1px solid var(--hairline);
}
.set-card__stats { grid-template-columns: repeat(3, 1fr); }
.set-detail__stats { grid-template-columns: repeat(4, 1fr); }
.set-stat { display: flex; flex-direction: column; gap: var(--space-1); }
.set-stat__label {
  font-family: var(--font-mono); font-size: 0.625rem;
  text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-muted);
}
.set-stat__value {
  font-family: var(--font-display); font-weight: 700; font-size: 1.5rem;
  color: var(--text-primary); line-height: 1;
}
.set-stat__value--accent { color: var(--accent-emphasis); }
.set-stat__bound { font-size: var(--text-body-sm); color: var(--text-primary); }
.set-card__used { display: flex; align-items: center; gap: var(--space-3); }
.set-card__used-label {
  font-family: var(--font-mono); font-size: 0.625rem;
  text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-muted);
}

/* set detail */
.set-detail { display: flex; flex-direction: column; gap: var(--space-5); }
.set-detail__back {
  display: inline-flex; align-items: center; gap: var(--space-2);
  align-self: flex-start; background: transparent; border: 0; cursor: pointer;
  font-family: var(--font-mono); font-size: var(--text-caption);
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted);
  transition: color var(--dur) var(--ease);
}
.set-detail__back:hover { color: var(--accent-emphasis); }
.set-detail__head-inner { display: flex; flex-direction: column; gap: var(--space-3); }
.set-detail__tags { display: flex; gap: var(--space-2); flex-wrap: wrap; align-items: center; }
.set-detail__version {
  font-family: var(--font-mono); font-size: var(--text-caption); color: var(--text-muted);
}
.set-detail__name { font-family: var(--font-display); color: var(--text-primary); }
.set-detail__desc { color: var(--text-secondary); line-height: 1.6; }

/* inline rubric expansion inside the dimension accordion */
.asm-detail--inline { padding: var(--space-2) var(--space-3) var(--space-3) 5.5rem; }

/* workflow bindings table */
.wf-table { display: flex; flex-direction: column; }
.wf-table__head,
.wf-table__row {
  display: grid;
  grid-template-columns: 12rem 1.4fr 1.8fr 7rem 7rem;
  gap: var(--space-3);
}
.wf-table__head { padding: var(--space-3) 0; border-bottom: 1px solid var(--hairline); }
.wf-table__th {
  font-family: var(--font-mono); font-size: 0.625rem;
  text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted);
}
.wf-table__row {
  padding: var(--space-4) 0; border-bottom: 1px solid var(--hairline);
  align-items: start;
}
.wf-table__cell { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.wf-table__stage-no {
  font-family: var(--font-mono); font-size: var(--text-caption);
  color: var(--accent-emphasis); letter-spacing: 0.08em;
}
.wf-table__stage-name { font-weight: 700; color: var(--text-primary); }
.wf-table__set-name { font-weight: 600; color: var(--text-primary); }
.wf-table__set-version {
  font-family: var(--font-mono); font-size: var(--text-caption); color: var(--text-muted);
}
.wf-table__rationale {
  font-size: var(--text-body-sm); color: var(--text-secondary); line-height: 1.55;
}
.wf-table__dims {
  font-family: var(--font-mono); font-size: var(--text-body-sm); color: var(--text-primary);
}
.wf-table__foot {
  padding-top: var(--space-3);
  font-family: var(--font-mono); font-size: var(--text-caption);
  color: var(--text-muted); line-height: 1.6;
}

/* ── settings ────────────────────────────────────────────────────────────── */

.settings-page { flex: 1; display: flex; flex-direction: column; }

/* two-column shell */
.set-shell { display: flex; gap: var(--space-7); align-items: flex-start; }
.set-shell__nav { flex: 0 0 var(--sidebar-w); position: sticky; top: var(--space-6); }
.set-shell__content { flex: 1; min-width: 0; }

/* grouped section nav */
.set-nav { display: flex; flex-direction: column; gap: var(--space-5); }
.set-nav__head { padding-bottom: var(--space-4); border-bottom: 1px solid var(--hairline); }
.set-nav__title { font-family: var(--font-display); font-weight: 700; font-size: 1.05rem; color: var(--text-primary); }
.set-nav__meta { font-size: var(--text-caption); color: var(--text-muted); margin-top: var(--space-1); }
.set-nav__group { display: flex; flex-direction: column; gap: var(--space-2); }
.set-nav__group-label {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--text-muted);
  padding: 0 var(--space-3);
}

/* section header */
.set-section { display: flex; flex-direction: column; }
.set-section__head { margin-bottom: var(--space-6); }
.set-section__title { font-size: var(--text-h1); margin-top: var(--space-2); }
.set-section__lede {
  font-size: var(--text-body);
  color: var(--text-secondary);
  margin-top: var(--space-2);
  max-width: 60ch;
}

/* panel variants */
.set-panel--gap { margin-top: var(--space-4); }
.set-panel--flush .panel__body { padding: 0; }
.set-panel--dashed { margin-top: var(--space-4); border-style: dashed; }

/* labelled field rows */
.set-field {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: var(--space-5);
  padding: var(--space-4) 0;
  border-top: 1px solid var(--hairline);
  align-items: start;
}
.set-field:first-child { border-top: none; padding-top: 0; }
.set-field__label-text {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
}
.set-field__foot {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  margin-top: var(--space-1);
}
.set-field__plain { font-size: var(--text-body-sm); color: var(--text-primary); }

/* chip rows */
.set-chips { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.set-note { font-family: var(--font-mono); font-size: var(--text-caption); color: var(--text-muted); }
.set-note--block { display: block; margin-top: var(--space-2); line-height: 1.5; }

/* mono on/off pill */
.set-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 0.3rem 0.5rem;
  border: 1px solid var(--hairline);
  font-family: var(--font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.set-toggle__dot { width: 6px; height: 6px; background: var(--text-muted); }
.set-toggle--on { border-color: var(--accent); color: var(--accent-emphasis); }
.set-toggle--on .set-toggle__dot { background: var(--accent); }

/* grid table (notifications / members) */
.set-table { display: flex; flex-direction: column; }
.set-table__head,
.set-table__row {
  display: grid;
  grid-template-columns: 1fr 90px 90px 90px;
  align-items: center;
  gap: 0;
}
.set-table--members .set-table__head,
.set-table--members .set-table__row {
  grid-template-columns: 1.4fr 1.6fr 1fr;
}
.set-table__head {
  padding: var(--space-3) var(--space-5);
  background: color-mix(in srgb, var(--surface-deep) 40%, transparent);
  border-bottom: 1px solid var(--hairline);
}
.set-table__h {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--text-muted);
}
.set-table__h--c { text-align: center; }
.set-table__row {
  padding: var(--space-4) var(--space-5);
  border-bottom: 1px solid var(--hairline);
}
.set-table__row:last-child { border-bottom: none; }
.set-table__event,
.set-table__name { font-size: var(--text-body-sm); color: var(--text-primary); }
.set-table__name { font-family: var(--font-display); font-weight: 600; }
.set-table__email { font-size: var(--text-caption); color: var(--text-secondary); }
.set-table__c { text-align: center; }
.set-table__c--l { display: inline-flex; }

/* mono code value */
.set-mono {
  font-family: var(--font-mono);
  font-size: var(--text-body-sm);
  color: var(--accent-emphasis);
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--hairline);
}

/* document source rows */
.set-source {
  display: grid;
  grid-template-columns: 260px 1fr auto auto;
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-4) var(--space-5);
}
.set-source--div { border-top: 1px solid var(--hairline); }
.set-source__main { font-family: var(--font-display); font-weight: 700; font-size: var(--text-body); color: var(--text-primary); }
.set-source__kind {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  margin-top: var(--space-1);
}
.set-source__desc { font-size: var(--text-body-sm); color: var(--text-muted); }
.set-source__action { text-align: right; }

.deflist { display: flex; flex-direction: column; gap: var(--space-3); }
.deflist__row { display: flex; gap: var(--space-4); }
.deflist__key {
  flex: 0 0 9rem;
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}
.deflist__val { color: var(--text-primary); }

/* ── print / IC pack ─────────────────────────────────────────────────────── */

.print-doc {
  flex: 1;
  max-width: 880px;
  margin: 0 auto;
  padding: var(--space-7) var(--space-6);
  width: 100%;
}
.print-cover {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding-bottom: var(--space-7);
  border-bottom: 2px solid var(--hairline-strong);
  margin-bottom: var(--space-7);
}
.print-cover__mark { color: var(--logo-color); }
.print-cover__eyebrow {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--accent-emphasis);
}
.print-cover__name { font-size: var(--text-h1); }
.print-cover__sub { color: var(--text-secondary); }
.print-cover__facts { display: flex; flex-wrap: wrap; gap: var(--space-6); margin-top: var(--space-4); }
.print-fact { display: flex; flex-direction: column; gap: var(--space-1); }
.print-fact__label {
  font-family: var(--font-mono);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
}
.print-fact__value { font-family: var(--font-display); font-weight: 700; font-size: 1.1rem; color: var(--text-primary); }
.print-cover__date { font-family: var(--font-mono); font-size: var(--text-caption); color: var(--text-muted); margin-top: var(--space-3); }

.print-page { padding: var(--space-6) 0; border-bottom: 1px solid var(--hairline); }
.print-page:last-child { border-bottom: none; }
.print-mark { display: flex; align-items: baseline; gap: var(--space-3); margin-bottom: var(--space-4); }
.print-mark__no {
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--accent-emphasis);
}
.print-mark__title { font-size: var(--text-h2); }
.print-prose { color: var(--text-secondary); line-height: 1.7; }
.print-block { margin-top: var(--space-5); }
.print-block__title {
  font-family: var(--font-mono);
  font-size: var(--text-caption);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-muted);
  margin-bottom: var(--space-3);
}

@media print {
  .topbar,
  .toast-host { display: none !important; }
  body { background: #fff; color: #000; }
  body::before { display: none; }
  .print-doc { max-width: none; padding: 0; }
  .print-page { break-inside: avoid-page; }
  .print-cover { break-after: page; }
}

/* ── stage tab toolbars ──────────────────────────────────────────────────────
   The Seg-as-tabs toolbar on every stage page (Proposal / Memo / Comparison).
   Generous separation from the content above, and a larger heading paired
   with the tab buttons. */
.prop-tabbar,
.memo-toolbar,
.cmp-tabbar {
  margin-top: var(--space-8);
}
.prop-tabbar .kicker,
.prop-tabbar .eyebrow,
.memo-toolbar .kicker,
.memo-toolbar .eyebrow,
.cmp-tabbar .kicker,
.cmp-tabbar .eyebrow {
  font-size: var(--text-body);
  color: var(--text-primary);
}

/* ── misc ────────────────────────────────────────────────────────────────── */

.placeholder__note { font-family: var(--font-mono); font-size: var(--text-caption); color: var(--text-muted); }
