@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap');

:root {
  --ink: #10161f;
  --ink-soft: #55616f;
  --ink-faint: #8794a3;
  --surface: #ffffff;
  --canvas: #f4f6f8;
  --rail: #141c26;
  --rail-hover: #1f2a38;
  --line: #dce2e9;
  --line-strong: #c2ccd6;
  --steel: #2c5c8a;
  --steel-soft: #eaf1f8;
  --pass: #0e7a4b;
  --pass-bg: #e6f4ec;
  --warn: #a9691a;
  --warn-bg: #fdf2e0;
  --fail: #b3261e;
  --fail-bg: #fbe9e8;
  --row-h: 30px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  height: 100%;
  font-family: 'IBM Plex Sans', system-ui, sans-serif;
  font-size: 13px;
  color: var(--ink);
  background: var(--canvas);
}

body { display: block; }
[hidden] { display: none !important; }
.app-shell { height: 100%; display: grid; grid-template-columns: 208px 1fr; }

/* ------------------------------------------------------------ sign in */
.auth-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(360px, 1.15fr) minmax(380px, .85fr);
  background: #eef2f6;
}
.auth-story {
  color: #fff;
  padding: clamp(48px, 8vw, 110px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: radial-gradient(circle at 20% 12%, #3f719f 0, transparent 34%),
              linear-gradient(145deg, #15202c 0%, #1f3e5b 58%, #28618f 100%);
}
.auth-brand { font-weight: 700; letter-spacing: .08em; font-size: 14px; margin-bottom: 64px; }
.auth-story h1 { font-size: clamp(34px, 4vw, 58px); line-height: 1.07; letter-spacing: -.035em; max-width: 720px; }
.auth-story p { color: #d4e0eb; font-size: 16px; line-height: 1.65; max-width: 580px; margin: 24px 0 36px; }
.auth-flow { display: flex; gap: 14px; align-items: center; color: #c7d8e7; font-size: 12px; text-transform: uppercase; letter-spacing: .07em; }
.auth-flow span { border: 1px solid rgba(255,255,255,.22); padding: 8px 12px; border-radius: 4px; }
.auth-flow i { font-style: normal; opacity: .55; }
.auth-card { width: min(430px, calc(100% - 48px)); margin: auto; padding: 34px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: 0 18px 55px rgba(20,35,50,.12); }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 3px; background: #eef2f6; border-radius: 5px; margin-bottom: 30px; }
.auth-tabs button { border: 0; background: transparent; color: var(--ink-soft); padding: 9px; }
.auth-tabs button.on { background: #fff; color: var(--ink); font-weight: 600; box-shadow: 0 1px 4px rgba(20,35,50,.12); }
.auth-card form h2 { margin: 0 0 6px; font-size: 22px; }
.auth-card form > p { color: var(--ink-soft); margin: 0 0 24px; }
.auth-card form label { display: block; color: var(--ink-soft); font-size: 12px; margin: 0 0 16px; }
.auth-card form input { display: block; width: 100%; margin-top: 6px; padding: 10px 11px; font-size: 14px; }
.auth-card form small { display: block; color: var(--ink-faint); margin: -10px 0 16px; }
.auth-submit { width: 100%; padding: 11px; font-size: 14px; }
.auth-error { min-height: 20px; color: var(--fail); font-size: 12px; }
.auth-success { min-height:20px; margin-bottom:8px; color:var(--pass); font-size:12px; line-height:1.45; }
.auth-link,.auth-back { min-height:auto; padding:0; border:0; background:transparent; color:var(--steel); font-size:12px; }
.auth-link { display:block; margin:-8px 0 14px auto; }.auth-back { margin:0 0 22px; }
.auth-link:hover,.auth-back:hover { background:transparent; color:#1f4c75; text-decoration:underline; }
button.danger { background: var(--fail); border-color: var(--fail); color: #fff; }
button.danger:hover { filter: brightness(.92); }
.user-menu { display: flex; align-items: center; gap: 7px; padding-left: 12px; border-left: 1px solid var(--line); }
.user-menu span { color: var(--ink-soft); font-weight: 500; }
@media (max-width: 800px) {
  .auth-shell { grid-template-columns: 1fr; }
  .auth-story { padding: 36px 28px; min-height: 300px; }
  .auth-brand { margin-bottom: 32px; }
  .auth-card { margin: 32px auto; }
}

/* --------------------------------------------------------------- home */
.home-welcome { color:#fff; padding:26px 28px; border-radius:7px; margin-bottom:16px; display:flex; justify-content:space-between; gap:24px; align-items:center; background:linear-gradient(118deg,#182b3d,#2c5c8a); }
.home-welcome > div > span { font-size:10px; letter-spacing:.1em; color:#a9c7df; }
.home-welcome h1 { font-size:25px; margin:5px 0; }
.home-welcome p { margin:0; color:#d2e1ed; }
.home-actions { display:flex; gap:8px; white-space:nowrap; }
.home-actions button:not(.primary) { background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.32); color:#fff; }
.journey { display:flex; align-items:center; justify-content:center; gap:12px; background:#fff; border:1px solid var(--line); padding:13px; margin-bottom:16px; overflow:auto; }
.journey span { display:flex; align-items:center; gap:6px; white-space:nowrap; }
.journey i { display:inline-grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--steel-soft); color:var(--steel); font-style:normal; font-size:11px; font-weight:700; }
.journey em { color:var(--ink-faint); font-style:normal; }
.home-stats { margin-bottom:20px; }
.object-board { display:grid; grid-template-columns:repeat(auto-fit,minmax(275px,1fr)); gap:14px; }
.object-card { background:#fff; border:1px solid var(--line); border-radius:5px; padding:16px; }
.object-card > header { display:flex; justify-content:space-between; gap:12px; align-items:start; }
.object-card h3 { margin:3px 0 1px; font-size:16px; }
.object-card header div > span { color:var(--steel); font-size:10px; font-weight:700; }
.object-card code { color:var(--ink-faint); font-size:11px; }
.readiness { margin:18px 0 13px; }
.readiness > div { display:flex; justify-content:space-between; color:var(--ink-soft); font-size:11px; }
.readiness progress { width:100%; height:7px; accent-color:var(--steel); }
.object-facts { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:3px; margin-bottom:13px; }
.object-facts span { padding:8px; color:var(--ink-soft); font-size:10px; border-right:1px solid var(--line); }
.object-facts span:last-child { border:0; }
.object-facts b { display:block; color:var(--ink); font-size:13px; margin-bottom:2px; }
.object-next { width:100%; text-align:left; background:var(--steel-soft); color:var(--steel); border-color:#c6dcee; font-weight:600; }
.mapping-actions { display:flex; gap:7px; }
.rulebook-columns { display:grid; grid-template-columns:repeat(4,minmax(100px,1fr)); gap:6px; padding:12px; background:#f4f7fa; border:1px solid var(--line); border-radius:4px; }
.rulebook-columns b { grid-column:1/-1; font-size:11px; color:var(--ink-soft); }
.rulebook-columns code { background:#fff; border:1px solid var(--line); padding:5px; border-radius:3px; }
.download-link { color:var(--steel); font-weight:600; }
.drop-field { display:block; margin-top:15px; padding:18px; border:1px dashed var(--line-strong); background:#fafbfd; color:var(--ink-soft); }
.drop-field input { display:block; margin-top:8px; width:100%; }
@media (max-width:800px) { .home-welcome { align-items:flex-start; flex-direction:column; } .journey { justify-content:flex-start; } .home-stats { flex-wrap:wrap; } .rulebook-columns { grid-template-columns:1fr 1fr; } }
.mapping-builder-row { grid-template-columns:1.2fr 20px 1.2fr .8fr 1fr 68px 88px 90px 28px; }
.map-head-actions { display:flex; align-items:center; gap:9px; }
.draft-field { border:1px solid var(--line); background:#f9fbfc; padding:11px; margin-bottom:9px; border-radius:4px; }
.draft-field label { display:flex; flex-direction:column; gap:4px; color:var(--ink-soft); font-size:11px; }
.draft-field-main { display:grid; grid-template-columns:1fr 22px 1fr 1fr; gap:8px; align-items:end; }
.draft-field-main > span { text-align:center; padding-bottom:7px; color:var(--steel); }
.draft-field-options { display:grid; grid-template-columns:1fr 1fr 1fr .7fr 60px 75px auto; gap:7px; align-items:end; margin:8px 0; }
.draft-field-options .check { flex-direction:row; align-items:center; padding-bottom:7px; white-space:nowrap; }
@media(max-width:950px){.draft-field-main,.draft-field-options{grid-template-columns:1fr 1fr}.draft-field-main>span{display:none}}
.sheet-picker { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:7px; padding:0 13px 13px; }
.sheet-picker > b { grid-column:1/-1; font-size:11px; color:var(--ink-soft); }
.sheet-picker label { display:grid; grid-template-columns:auto 1fr; gap:2px 7px; align-items:center; border:1px solid var(--line); background:#f8fafc; padding:8px; border-radius:3px; }
.sheet-picker label small { grid-column:2; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.recommendation { display:flex; flex-direction:column; gap:4px; padding:11px 13px; margin-bottom:14px; background:var(--pass-bg); color:var(--pass); border-left:3px solid var(--pass); }
.recommendation.needs-action { background:var(--warn-bg); color:var(--warn); border-left-color:var(--warn); }
.recommendation span { color:var(--ink); line-height:1.45; }
.value-pair { display:grid; grid-template-columns:1fr 24px 1fr 30px; gap:7px; align-items:center; margin-bottom:7px; }
.value-pair span { text-align:center; color:var(--steel); }
.draft-field-main { grid-template-columns:1fr 1fr 22px 1fr 1fr; }

/* ----------------------------------------------------------- left rail */
.rail {
  background: var(--rail);
  color: #c8d2dd;
  display: flex;
  flex-direction: column;
  padding: 14px 0;
  overflow-y: auto;
}

.brand { padding: 4px 18px 18px; }
.brand b { display: block; font-size: 17px; letter-spacing: .01em; color: #fff; font-weight: 600; }
.brand span { font-size: 11px; color: #7d8b9b; }

.rail nav { display: flex; flex-direction: column; }
.rail a {
  padding: 8px 18px;
  color: #b6c2ce;
  text-decoration: none;
  border-left: 3px solid transparent;
  cursor: pointer;
  font-size: 13px;
}
.rail a:hover { background: var(--rail-hover); color: #fff; }
.rail a.on { background: var(--rail-hover); color: #fff; border-left-color: #62a0d8; font-weight: 500; }
.rail a:focus-visible { outline: 2px solid #62a0d8; outline-offset: -2px; }
.rail .group { padding: 16px 18px 5px; font-size: 10.5px; color: #66748a; letter-spacing: .06em; }

/* ------------------------------------------------------------ chrome */
.main { display: flex; flex-direction: column; min-width: 0; height: 100vh; }

.context {
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  padding: 8px 18px;
  display: flex;
  gap: 14px;
  align-items: center;
  flex-wrap: wrap;
}
.context label { font-size: 11px; color: var(--ink-faint); display: block; margin-bottom: 2px; }
.context select, .context input { min-width: 170px; }

select, input, textarea, button {
  font-family: inherit;
  font-size: 12.5px;
  padding: 5px 8px;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  background: #fff;
  color: var(--ink);
}
select:focus-visible, input:focus-visible, button:focus-visible {
  outline: 2px solid var(--steel);
  outline-offset: 1px;
}

button { cursor: pointer; }
button:hover { border-color: var(--steel); }
button.primary { background: var(--steel); border-color: var(--steel); color: #fff; font-weight: 500; }
button.primary:hover { background: #24507a; }
button:disabled { opacity: .5; cursor: not-allowed; }
button.ghost { background: transparent; border-color: transparent; color: var(--steel); padding: 3px 6px; }

.workspace { flex: 1; overflow: auto; padding: 16px 18px 40px; }

h1 { font-size: 19px; margin: 0 0 3px; font-weight: 600; }
h2 { font-size: 14px; margin: 22px 0 8px; font-weight: 600; }
.sub { color: var(--ink-soft); margin: 0 0 14px; max-width: 74ch; }

/* -------------------------------------------------------- stat strip */
.stats {
  display: flex;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 3px;
  overflow: hidden;
}
.stat { padding: 11px 16px; border-right: 1px solid var(--line); flex: 1; min-width: 108px; }
.stat:last-child { border-right: 0; }
.stat .k { font-size: 11px; color: var(--ink-soft); margin-bottom: 3px; }
.stat .v { font-size: 21px; font-weight: 600; font-family: 'IBM Plex Mono', monospace; font-variant-numeric: tabular-nums; }
.stat .v.pass { color: var(--pass); }
.stat .v.warn { color: var(--warn); }
.stat .v.fail { color: var(--fail); }

.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 3px;
  margin-bottom: 16px;
}
.panel > header {
  padding: 9px 13px;
  border-bottom: 1px solid var(--line);
  font-weight: 600;
  font-size: 12.5px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.panel > header .note { font-weight: 400; color: var(--ink-soft); font-size: 11.5px; }
.panel .body { padding: 13px; }
.cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
/* Panels stack before the rail does — a 64px rail with full-length labels
   ("Transformation Hub") wraps into an unreadable column, so the rail keeps a
   usable width down to tablet size and only then moves out of the way. */
@media (max-width: 1080px) { .cols { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .app-shell { grid-template-columns: 168px 1fr; }
  .rail a { padding: 7px 12px; font-size: 12px; }
  .brand { padding: 4px 12px 14px; } .rail .group { padding: 13px 12px 4px; } }
@media (max-width: 680px) {
  .app-shell { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .rail { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 2px;
          padding: 8px 10px; overflow-x: auto; }
  .rail .brand { padding: 0 12px 0 0; flex: none; }
  .rail nav { flex-direction: row; flex-wrap: wrap; gap: 2px; }
  .rail .group { display: none; }
  .rail a { border-left: 0; border-bottom: 2px solid transparent; padding: 5px 9px; }
  .rail a.on { border-left: 0; border-bottom-color: #62a0d8; }
  .main { height: auto; min-height: 0; }
}

/* --------------------------------------------------------- funnel */
.funnel { display: flex; align-items: stretch; padding: 6px 4px 2px; overflow-x: auto; }
.fstage { min-width: 152px; }
.fstage .bar {
  height: 46px;
  background: linear-gradient(180deg, #33648f, #24507a);
  border-radius: 2px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  color: #fff;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 17px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.fstage .nm { font-size: 11px; color: var(--ink-soft); margin-top: 5px; }
.fdrop {
  width: 132px;
  padding: 0 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-left: 1px dashed var(--line-strong);
  border-right: 1px dashed var(--line-strong);
  margin: 0 6px;
  text-align: center;
}
.fdrop .n { font-family: 'IBM Plex Mono', monospace; font-weight: 600; color: var(--fail); font-size: 14px; }
.fdrop .l { font-size: 10.5px; color: var(--ink-soft); line-height: 1.25; }

/* --------------------------------------------------------- tables */
.tablewrap { overflow: auto; max-height: 560px; border-top: 1px solid var(--line); }
table { width: 100%; border-collapse: collapse; }
th {
  position: sticky;
  top: 0;
  background: #eef1f5;
  text-align: left;
  padding: 6px 9px;
  font-weight: 600;
  font-size: 11.5px;
  border-bottom: 1px solid var(--line-strong);
  white-space: nowrap;
  z-index: 2;
}
td {
  padding: 4px 9px;
  border-bottom: 1px solid #eef1f4;
  height: var(--row-h);
  white-space: nowrap;
  max-width: 320px;
  overflow: hidden;
  text-overflow: ellipsis;
}
tbody tr:hover { background: #f7f9fb; }
tbody tr.clickable { cursor: pointer; }
td.data, th.data, .mono {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
td.num { text-align: right; font-family: 'IBM Plex Mono', monospace; font-variant-numeric: tabular-nums; }

.tag {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 2px;
  font-size: 11px;
  font-weight: 600;
  border: 1px solid transparent;
}
.tag.pass { background: var(--pass-bg); color: var(--pass); border-color: #bfe0cd; }
.tag.warn { background: var(--warn-bg); color: var(--warn); border-color: #f0d9ae; }
.tag.fail { background: var(--fail-bg); color: var(--fail); border-color: #f0c7c4; }
.tag.neutral { background: #eef1f5; color: var(--ink-soft); border-color: var(--line); }
.tag.info { background: var(--steel-soft); color: var(--steel); border-color: #c6dcee; }

.heat { display: inline-block; min-width: 62px; text-align: right; padding: 1px 6px; border-radius: 2px; font-family: 'IBM Plex Mono', monospace; font-variant-numeric: tabular-nums; }

/* --------------------------------------------------------- misc */
.kv { display: grid; grid-template-columns: 190px 1fr; gap: 5px 14px; }
.kv dt { color: var(--ink-soft); }
.kv dd { margin: 0; font-family: 'IBM Plex Mono', monospace; font-size: 12px; word-break: break-all; }

.tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--line); margin-bottom: 14px; flex-wrap: wrap; }
.tabs button {
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  padding: 7px 12px;
  border-radius: 0;
  color: var(--ink-soft);
}
.tabs button.on { border-bottom-color: var(--steel); color: var(--ink); font-weight: 600; }

.toolbar { display: flex; gap: 8px; padding: 9px 13px; flex-wrap: wrap; align-items: center; }
.empty { padding: 34px 16px; text-align: center; color: var(--ink-soft); }
.empty b { display: block; color: var(--ink); margin-bottom: 4px; font-size: 13.5px; }
.err { background: var(--fail-bg); border: 1px solid #f0c7c4; color: #8d1f19; padding: 9px 12px; border-radius: 3px; margin-bottom: 12px; }

.progress { height: 4px; background: var(--line); border-radius: 2px; overflow: hidden; }
.progress i { display: block; height: 100%; background: var(--steel); transition: width .25s; }

.wizard-step { display: flex; gap: 10px; align-items: baseline; padding: 9px 0; border-bottom: 1px solid #eef1f4; }
.wizard-step .n {
  font-family: 'IBM Plex Mono', monospace;
  color: var(--ink-faint);
  width: 22px;
  flex: none;
}
.wizard-step .f { flex: 1; }
.wizard-step label { display: block; font-size: 11.5px; color: var(--ink-soft); margin-bottom: 3px; }
.wizard-step select, .wizard-step input { width: 100%; max-width: 480px; }

dialog {
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  padding: 0;
  max-width: 780px;
  width: 92vw;
  box-shadow: 0 18px 48px rgba(16, 22, 31, .28);
}
dialog header { padding: 11px 15px; border-bottom: 1px solid var(--line); font-weight: 600; display: flex; justify-content: space-between; }
dialog .body { padding: 15px; max-height: 66vh; overflow: auto; }
dialog footer { padding: 11px 15px; border-top: 1px solid var(--line); display: flex; justify-content: flex-end; gap: 8px; }
::backdrop { background: rgba(16, 22, 31, .45); }

.toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  background: var(--rail);
  color: #fff;
  padding: 10px 15px;
  border-radius: 3px;
  z-index: 99;
  max-width: 420px;
}
.spin { color: var(--ink-soft); padding: 22px; text-align: center; }
.factors { font-size: 11.5px; color: var(--ink-soft); }
.bar-mini { height: 6px; background: #eef1f4; border-radius: 3px; overflow: hidden; min-width: 90px; }
.bar-mini i { display: block; height: 100%; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* ================================================= Consultant-first experience */
:root {
  --ink:#17211b; --ink-soft:#5c6961; --ink-faint:#859188;
  --canvas:#f3f6f3; --surface:#fff; --line:#dfe6df; --line-strong:#c8d4ca;
  --rail:#13251d; --rail-hover:#1d382b; --steel:#176b46; --steel-soft:#e9f4ed;
  --pass:#168052; --pass-bg:#e8f6ee; --warn:#a26518; --warn-bg:#fff5e5; --navy:#194f36;
}
html,body { font-size:14px; }
.app-shell { grid-template-columns:248px 1fr; }
.rail { padding:22px 12px; box-shadow:6px 0 24px rgba(15,38,27,.06); }
.brand { display:flex; align-items:center; gap:11px; padding:0 8px 25px; }
.brand-mark { width:34px; height:34px; display:grid; place-items:center; border-radius:10px;
  color:#123123; background:#93e5b8; font-weight:800; font-size:17px; }
.brand b { font-size:15px; letter-spacing:.06em; }
.brand span { color:#8eaa9b; font-size:10.5px; }
.rail .group { padding:20px 10px 7px; font-size:9.5px; color:#6e8a7b; font-weight:700; letter-spacing:.12em; }
.rail a { margin:2px 0; padding:10px 11px; border:0; border-radius:7px; font-size:12.5px; }
.rail a.on { border:0; color:#fff; background:#24503b; box-shadow:inset 3px 0 #91e6b7; }
.context { min-height:72px; padding:11px 24px; gap:16px; }
.context label { font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.context select { min-width:190px; border-color:transparent; background:#f3f6f3; padding:8px 10px; border-radius:7px; }
.workspace { padding:28px 30px 60px; }
h1 { font-size:26px; letter-spacing:-.025em; }
h2 { font-size:16px; }
button { border-radius:7px; padding:8px 12px; }
button.primary { background:var(--steel); border-color:var(--steel); }
button.primary:hover { background:#105b3a; }
.panel { border-radius:10px; box-shadow:0 2px 12px rgba(31,59,44,.035); }
.panel > header { padding:13px 16px; }

.control-hero { min-height:152px; display:flex; justify-content:space-between; align-items:center; gap:28px;
  color:white; padding:28px 30px; border-radius:16px; margin-bottom:18px;
  background:radial-gradient(circle at 82% 20%,rgba(137,230,180,.24),transparent 28%),linear-gradient(118deg,#173a29,#176b46); }
.control-hero h1 { font-size:30px; margin:3px 0 8px; }
.control-hero p { margin:0; color:#cfe5d8; font-size:14px; }
.control-hero .eyebrow { color:#9fe1bd; }
.home-actions button { padding:10px 15px; }
.control-hero .home-actions button:not(.primary) { background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.28); }
.control-hero .home-actions .primary { background:#a2e8c0; border-color:#a2e8c0; color:#123b28; }
.signal-strip { display:grid; grid-template-columns:repeat(4,1fr); background:#fff; border:1px solid var(--line);
  border-radius:12px; margin-bottom:24px; overflow:hidden; }
.signal-strip>div { padding:17px 19px; border-right:1px solid var(--line); display:grid; grid-template-columns:1fr auto; gap:3px 10px; }
.signal-strip>div:last-child { border:0; }
.signal-strip span { color:var(--ink-soft); font-size:11px; font-weight:600; }
.signal-strip b { grid-row:1/3; grid-column:2; font-size:27px; line-height:1; }
.signal-strip small { color:var(--ink-faint); font-size:10px; }
.signal-strip .needs b { color:var(--warn); } .signal-strip .good b { color:var(--pass); }
.desk-grid { display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:20px; align-items:start; }
.section-title { min-height:45px; display:flex; justify-content:space-between; align-items:start; gap:15px; margin-bottom:10px; }
.section-title h2 { margin:0 0 3px; }.section-title p { margin:0; color:var(--ink-soft); font-size:12px; }
.object-board { grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:12px; }
.object-card { border-radius:11px; padding:17px; transition:transform .15s,box-shadow .15s; }
.object-card:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(27,61,43,.08); }
.object-card h3 { font-size:16px; }.object-card header div>span { color:var(--steel); font-size:9px; letter-spacing:.08em; }
.object-meter { height:5px; overflow:hidden; border-radius:4px; background:#edf1ed; margin:18px 0 12px; }
.object-meter i { display:block; height:100%; background:var(--pass); }.object-card.attention .object-meter i { background:var(--warn); }.object-card.critical .object-meter i { background:var(--fail); }
.object-facts { border:0; margin-bottom:12px; }.object-facts span { padding:3px 8px 3px 0; border:0; }.object-facts b { font-size:14px; }
.object-next { display:flex; justify-content:space-between; align-items:center; border:0; padding:10px 11px; border-radius:7px; }
.object-next b { font-size:11px; }.object-card.attention .object-next { background:var(--warn-bg); color:#7a4b13; }.object-card.critical .object-next { background:var(--fail-bg); color:var(--fail); }
.desk-side { display:flex; flex-direction:column; gap:7px; }
.desk-side>button { display:flex; flex-direction:column; align-items:flex-start; text-align:left; padding:13px 14px; background:#fff; border:1px solid var(--line); }
.desk-side>button:hover { border-color:#94bca5; background:var(--steel-soft); }.desk-side>button b { font-size:12px; }.desk-side>button span { color:var(--ink-soft); font-size:10.5px; margin-top:3px; }

.validation-head { align-items:center; margin-bottom:20px; }
.validation-head h1 { margin:3px 0 5px; }.validation-head .sub { max-width:70ch; }
.assurance { display:flex; align-items:center; gap:9px; padding:10px 13px; border:1px solid #c6e1d1; background:var(--pass-bg); border-radius:9px; }
.assurance i { width:25px; height:25px; display:grid; place-items:center; border-radius:50%; background:var(--pass); color:#fff; font-style:normal; }
.assurance span { display:flex; flex-direction:column; font-size:10px; color:var(--ink-soft); }.assurance b { color:var(--pass); font-size:11px; }
.validation-layout { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:18px; align-items:start; }
.setup-card { margin-bottom:14px; }.validation-scope { grid-template-columns:1.2fr .8fr 1.3fr; }
.validation-scope label,.compare-files label,.compact-label { display:flex; flex-direction:column; gap:6px; font-size:11px; color:var(--ink-soft); }
.validation-scope select,.compare-files select,.compact-label select { padding:9px 10px; border-radius:7px; width:100%; }
.compare-files { display:grid; grid-template-columns:1fr 44px 1fr; gap:14px; align-items:center; }
.compare-files label>span { font-weight:700; color:var(--ink); font-size:12px; }.compare-files label>small { color:var(--ink-faint); min-height:28px; }
.compare-mark { width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:var(--steel-soft); color:var(--steel); font-weight:700; font-size:10px; }
.validation-options { position:sticky; top:12px; }.option-choice { display:grid; grid-template-columns:auto 1fr; gap:10px; padding:12px; background:var(--steel-soft); border:1px solid #c9e1d3; border-radius:8px; margin-bottom:16px; }
.option-choice input { margin-top:2px; accent-color:var(--steel); }.option-choice span { display:flex; flex-direction:column; gap:3px; }.option-choice small { color:var(--ink-soft); line-height:1.4; }
.compact-label { margin:13px 0; }.run-validation { width:100%; display:flex; justify-content:space-between; font-size:14px; padding:12px 15px; }
.run-note,.run-message { display:block; text-align:center; color:var(--ink-soft); font-size:10.5px; }.run-message { margin:8px 0; color:var(--steel); }

@media(max-width:1100px){.signal-strip{grid-template-columns:1fr 1fr}.signal-strip>div:nth-child(2){border-right:0}.desk-grid,.validation-layout{grid-template-columns:1fr}.validation-options{position:static}.app-shell{grid-template-columns:210px 1fr}}
@media(max-width:760px){.workspace{padding:18px 14px}.control-hero{align-items:flex-start;flex-direction:column}.signal-strip{grid-template-columns:1fr}.signal-strip>div{border-right:0;border-bottom:1px solid var(--line)}.validation-scope,.compare-files{grid-template-columns:1fr}.compare-mark{margin:auto}.context>div:nth-child(4){margin-left:0!important}.desk-grid{display:block}.desk-side{margin-top:22px}}

/* ================================================= One visual language everywhere */
#view { max-width:1600px; width:100%; margin:0 auto; }
#view > h1 { margin:0; padding-top:2px; }
#view > h1 + .sub { margin:7px 0 22px; font-size:13px; line-height:1.55; max-width:82ch; }
.page-head { margin-bottom:22px; }
.sub { line-height:1.55; }

/* Consistent content containers */
.panel { border:1px solid var(--line); border-radius:11px; overflow:hidden;
  box-shadow:0 2px 12px rgba(22,57,38,.035); margin-bottom:16px; }
.panel > header { min-height:47px; padding:13px 16px; background:#fff;
  border-bottom:1px solid var(--line); font-size:12.5px; }
.panel .body { padding:16px; }
.panel > header .note { color:var(--ink-faint); }
.cols { gap:16px; }

/* Controls */
select,input,textarea { min-height:36px; padding:8px 10px; border-radius:7px;
  border-color:var(--line-strong); transition:border-color .15s,box-shadow .15s; }
select:hover,input:hover,textarea:hover { border-color:#9eb4a4; }
select:focus-visible,input:focus-visible,textarea:focus-visible { outline:0;
  border-color:var(--steel); box-shadow:0 0 0 3px rgba(23,107,70,.12); }
button { min-height:36px; padding:8px 13px; font-weight:600; border-color:var(--line-strong);
  transition:background .15s,border-color .15s,transform .1s; }
button:active { transform:translateY(1px); }
button.ghost { min-height:auto; color:var(--steel); }
.toolbar { padding:14px 16px; gap:10px; background:#fbfcfb; }
.toolbar select { min-width:130px; }
.toolbar input[type=file] { background:#fff; flex:1; min-width:240px; }

/* Tables share the same rhythm and hierarchy */
.tablewrap { max-height:590px; border-top:0; }
table { background:#fff; }
th { height:39px; padding:9px 12px; background:#f0f5f1; color:#53645a;
  border-bottom:1px solid #d5e0d7; font-size:10.5px; letter-spacing:.035em; text-transform:uppercase; }
td { height:40px; padding:8px 12px; border-bottom:1px solid #edf1ee; }
tbody tr:hover { background:#f4f8f5; }
tbody tr.clickable:hover td:first-child { box-shadow:inset 3px 0 var(--steel); }
.mono,td.data,th.data { font-family:'IBM Plex Mono',monospace; font-size:11.5px; }
.tag { padding:3px 8px; border-radius:12px; font-size:10px; letter-spacing:.02em; }
.tag.neutral { background:#f0f3f1; }.tag.info { background:var(--steel-soft); color:var(--steel); border-color:#c9dfd1; }
.empty-value { color:#a1aaa4; font-family:'IBM Plex Sans',sans-serif; }

/* Action and summary surfaces */
.action-banner { padding:17px 18px; border-radius:11px; background:linear-gradient(110deg,#edf7f1,#e5f2e9);
  border-color:#c9dfd1; margin-bottom:16px; }
.action-banner b { font-size:13px; }.action-banner span { max-width:72ch; line-height:1.45; }
.stats { border-radius:11px; border-color:var(--line); box-shadow:0 2px 12px rgba(22,57,38,.035); }
.stat { padding:15px 17px; }.stat .k { font-size:10.5px; }.stat .v { font-size:24px; }
.hub-summary { border-radius:11px; overflow:hidden; border-color:var(--line); }
.hub-summary>div { padding:15px 17px; }.hub-summary span { letter-spacing:.05em; }
.governance-note { display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center;
  padding:13px 16px; background:#fff; border:1px solid var(--line); border-radius:10px; margin-bottom:16px; }
.governance-note>b { color:var(--steel); }.governance-note>span:nth-child(2) { color:var(--ink-soft); font-size:11.5px; }
.rule-catalog { gap:0; background:#fff; }.rule-catalog button { border-bottom:1px solid var(--line); border-right:1px solid var(--line); min-height:58px; }
.friendly-intro { border-radius:8px; border:1px solid #c9dfd1; border-left:4px solid var(--steel); }
.sheet-picker label,.draft-field,.mapping-builder-row { border-radius:8px; background:#f8faf8; }
.recommendation { border-radius:8px; }

/* Empty, loading and error states */
.empty { min-height:150px; display:flex; flex-direction:column; justify-content:center; align-items:center;
  padding:35px 20px; background:#fbfcfb; }
.empty b { font-size:14px; margin-bottom:6px; }
.spin { min-height:150px; display:grid; place-items:center; }
.err { border-radius:8px; padding:13px 15px; }
.state-page { min-height:420px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; color:var(--ink-soft); }
.state-page .state-icon { width:48px; height:48px; display:grid; place-items:center; border-radius:50%;
  background:var(--warn-bg); color:var(--warn); font-size:22px; }
.state-page h2 { color:var(--ink); margin:14px 0 4px; }.state-page p { margin:0 0 16px; max-width:52ch; }

/* Tabs, report cards and recommendations */
.tabs { gap:6px; border-bottom:1px solid var(--line); margin:18px 0; }
.tabs button { border-radius:7px 7px 0 0; padding:9px 13px; }.tabs button.on { background:var(--steel-soft); color:var(--steel); }
.tile { border-radius:10px; padding:15px 13px; }.tile b { font-size:25px; }
.pill,.keychip,.fchip { border-radius:8px; }
.reco-panel,.reco { border-radius:0; }.reco-panel { overflow:hidden; }
.reco-panel > .reco-head { background:var(--navy); }
.wb-filters { border-radius:10px; }.cluster { padding:15px 16px; }
dialog { border:0; border-radius:14px; box-shadow:0 24px 80px rgba(10,35,22,.24); }
dialog header { min-height:52px; align-items:center; padding:13px 17px; }
dialog .body { padding:18px; } dialog footer { padding:13px 17px; background:#f8faf8; }
.toast { border-radius:9px; box-shadow:0 12px 35px rgba(10,35,22,.22); }

/* Keep dense data usable without making the whole product feel dense */
#view[data-screen="mappings"] .tablewrap,
#view[data-screen="audit"] .tablewrap,
#view[data-screen="runs"] .tablewrap { max-height:620px; }
#view[data-screen="files"] .panel:first-of-type { border-color:#c9dfd1; }
#view[data-screen="transformations"] .hub-cols { margin-top:2px; }

@media(max-width:900px){
  .governance-note{grid-template-columns:1fr}.toolbar input[type=file]{min-width:100%}
  #view>h1+.sub{margin-bottom:16px}
}

/* Mapping creation and transformation hub */
.action-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;background:var(--steel-soft);border:1px solid #c6dcee;border-radius:3px;padding:13px 15px;margin-bottom:14px}.action-banner div{display:flex;flex-direction:column}.action-banner b{font-size:13px}.action-banner span{font-size:11.5px;color:var(--ink-soft);margin-top:3px}.friendly-intro{background:var(--steel-soft);border-left:3px solid var(--steel);padding:11px 13px;margin-bottom:14px;display:flex;flex-direction:column}.friendly-intro span{font-size:11.5px;color:var(--ink-soft);margin-top:3px}.form-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px}.form-grid label,.json-label{font-size:11.5px;color:var(--ink-soft);display:flex;flex-direction:column;gap:4px}.form-grid input,.form-grid select{width:100%}.builder-head{display:flex;align-items:center;justify-content:space-between;margin:18px 0 7px}.mapping-builder-row{display:grid;grid-template-columns:1.3fr 20px 1.3fr 1fr 68px 88px 90px 28px;gap:6px;align-items:center;padding:7px;background:#f8fafc;border:1px solid var(--line);border-radius:3px;margin-bottom:6px}.mapping-builder-row .check{display:flex;align-items:center;gap:4px;font-size:10.5px;color:var(--ink-soft)}.mapping-builder-row .check input{width:auto}.map-arrow{text-align:center;color:var(--steel)}.helper{font-size:11px;color:var(--ink-soft);line-height:1.5}.hub-summary{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);background:var(--surface);margin-bottom:16px}.hub-summary>div{padding:12px 15px;border-right:1px solid var(--line);display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:2px 9px}.hub-summary>div:last-child{border:0}.hub-summary span{font-size:10px;color:var(--ink-soft);grid-column:1/3}.hub-summary b{font:600 20px 'IBM Plex Mono',monospace}.hub-summary small{font-size:10px;color:var(--ink-faint)}.hub-cols{grid-template-columns:1.25fr .75fr}.hub-form{grid-template-columns:1fr 1fr 1.5fr;margin-bottom:13px}.json-label textarea{font:12px/1.5 'IBM Plex Mono',monospace;resize:vertical}.hub-actions{display:flex;gap:7px;margin:10px 0}.rule-catalog{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);max-height:430px;overflow:auto}.rule-catalog button{background:white;border:0;border-radius:0;text-align:left;padding:9px 11px;display:flex;flex-direction:column;align-items:flex-start}.rule-catalog button:hover{background:var(--steel-soft)}.rule-catalog b{font:600 11px 'IBM Plex Mono',monospace}.rule-catalog span{font-size:9.5px;color:var(--steel);margin-top:3px}.test-success{display:flex;flex-direction:column;background:var(--pass-bg);color:var(--pass);border:1px solid #bfe0cd;padding:9px 11px;margin-top:12px}.test-success span{font-size:10.5px;margin-top:2px}.lifecycle{display:flex;align-items:center;justify-content:center;gap:18px;padding:20px;overflow:auto}.lifecycle span{min-width:120px;display:grid;grid-template-columns:28px 1fr;align-items:center}.lifecycle span i{grid-row:1/3;width:24px;height:24px;border-radius:50%;background:var(--steel);color:white;display:grid;place-items:center;font-style:normal;font-size:10px}.lifecycle span b{font-size:11.5px}.lifecycle span small{font-size:9.5px;color:var(--ink-soft)}.lifecycle em{font-style:normal;color:var(--line-strong)}
@media(max-width:900px){.mapping-builder-row{grid-template-columns:1fr 18px 1fr}.mapping-builder-row select,.mapping-builder-row label,.mapping-builder-row button{grid-column:auto}.hub-cols{grid-template-columns:1fr}.form-grid,.hub-form{grid-template-columns:1fr}.lifecycle{justify-content:flex-start}}

/* ===================================================== knowledge screens */
.page-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.page-head .sub { margin-bottom: 0; }
.head-actions { display: flex; gap: 8px; flex: none; }

.panel.accent { border-left: 3px solid var(--steel); }

/* -------- suggestion cards: the label, the evidence, the decision */
.suggestion {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "main actions" "why actions";
  gap: 4px 16px;
  padding: 12px 13px;
  border-bottom: 1px solid var(--line);
  align-items: start;
}
.suggestion:last-child { border-bottom: 0; }
.suggestion:hover { background: #fafbfd; }
.sug-main { grid-area: main; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sug-name {
  font-weight: 600;
  min-width: 120px;
  padding: 3px 8px;
  background: #eef1f5;
  border-radius: 3px;
}
.sug-arrow { color: var(--ink-faint); }
.sug-input {
  min-width: 230px;
  font-weight: 500;
  border-color: var(--steel);
  background: #fff;
}
.sug-why {
  grid-area: why;
  font-size: 11.5px;
  color: var(--ink-soft);
  line-height: 1.5;
  padding-left: 2px;
}
.sug-rationale { color: var(--ink-faint); font-style: italic; margin-top: 2px; }
.sug-actions { grid-area: actions; display: flex; gap: 6px; align-self: center; }
@media (max-width: 820px) {
  .suggestion { grid-template-columns: 1fr; grid-template-areas: "main" "why" "actions"; }
  .sug-actions { justify-content: flex-end; }
}

.conf { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ink-soft); }

/* -------- field chips for switching value-mapping crosswalks */
.chipbar { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 14px; }
.chip {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 5px 11px;
  border: 1px solid var(--line-strong);
  border-radius: 14px;
  background: #fff;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  cursor: pointer;
}
.chip span { font-family: 'IBM Plex Sans', sans-serif; font-size: 11px; color: var(--ink-soft); }
.chip:hover { border-color: var(--steel); }
.chip.on { background: var(--steel); border-color: var(--steel); color: #fff; }
.chip.on span { color: #d5e4f2; }
.dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.dot.fail { background: var(--fail); }

textarea { border: 1px solid var(--line-strong); border-radius: 3px; padding: 7px 9px; font-size: 12.5px; }
textarea:focus-visible { outline: 2px solid var(--steel); outline-offset: 1px; }

/* -------- user menu in the context bar */
.user-menu { display: flex; align-items: center; gap: 8px; margin-left: 14px; }
.user-menu span { font-size: 12px; color: var(--ink-soft); }

/* ============================================ Failure Workbench & AI */
.wb-layout { display: grid; grid-template-columns: 232px 1fr; gap: 14px; align-items: start; }
.wb-filters { position: sticky; top: 0; }
.wb-label { display: block; font-size: 10.5px; letter-spacing: .06em;
  text-transform: uppercase; color: var(--ink-faint); margin: 12px 0 6px; }
.wb-label:first-child { margin-top: 0; }
.wb-facets { display: flex; flex-wrap: wrap; gap: 5px; }
.wb-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
@media (max-width: 1000px) { .wb-layout { grid-template-columns: 1fr; } .wb-filters { position: static; } }

.cluster { padding: 12px 14px; border-bottom: 1px solid var(--line); }
.cluster:last-child { border-bottom: 0; }
.cluster.decided { opacity: .62; }
.cl-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cl-ref { background: #eef1f5; padding: 2px 7px; border-radius: 3px; font-size: 11px; }
.cl-why { font-size: 12px; color: var(--ink-soft); margin: 6px 0 0; line-height: 1.55; }
.cl-fix { font-size: 12px; margin-top: 5px; }
.cl-fix b { color: var(--steel); margin-right: 6px; }
.cl-ex { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.cl-ex .mono { font-size: 11px; color: var(--ink-faint); background: #fafbfd;
  border: 1px solid var(--line); border-radius: 3px; padding: 1px 6px; }

.readiness { display: flex; align-items: center; gap: 20px; margin-bottom: 14px; }
.rd-score { display: flex; align-items: baseline; gap: 4px; }
.rd-score b { font-size: 40px; line-height: 1; letter-spacing: -.03em; }
.rd-score span { font-size: 13px; color: var(--ink-faint); }
.rd-score.pass b { color: var(--pass); }
.rd-score.warn b { color: var(--warn); }
.rd-score.fail b { color: var(--fail); }
.rd-status p { margin: 6px 0 0; max-width: 62ch; }

.chat { max-height: 420px; overflow-y: auto; padding: 14px; display: flex;
  flex-direction: column; gap: 12px; }
.msg { max-width: 88%; }
.msg.user { align-self: flex-end; }
.msg.user .msg-body { background: var(--steel); color: #fff; border-radius: 10px 10px 2px 10px; }
.msg.assistant .msg-body { background: #f2f5f8; border-radius: 10px 10px 10px 2px; }
.msg-body { padding: 9px 13px; font-size: 13px; line-height: 1.6; }
.msg-data { margin-top: 8px; }
.chat-input { display: flex; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--line); }
.chat-input input { flex: 1; }
.chat-hints { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 14px 12px; }

/* ==================================== Guided run detail (GenMove layout) */
.guided { padding: 16px 18px; }
.guided-head { display: flex; justify-content: space-between; align-items: flex-end;
  gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.eyebrow { display: block; font-size: 10px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-faint); margin-bottom: 3px; }
.guided-head h2 { margin: 0; font-size: 19px; letter-spacing: -.02em; }
.steps { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; }
@media (max-width: 1180px) { .steps { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 720px) { .steps { grid-template-columns: repeat(2, 1fr); } }
.step { display: flex; align-items: center; gap: 9px; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.step i { flex: none; width: 22px; height: 22px; border-radius: 50%;
  display: grid; place-items: center; font-style: normal; font-size: 11px;
  background: #eceff3; color: var(--ink-soft); }
.step.done i { background: var(--pass); color: #fff; }
.step.active { border-color: var(--steel); box-shadow: 0 0 0 1px var(--steel) inset; }
.step b { display: block; font-size: 12.5px; }
.step span { font-size: 10.5px; color: var(--ink-faint); }

.verdict { padding: 11px 14px; border-radius: 5px; font-size: 13px; margin: 14px 0; }
.verdict.fail { background: #fbe9e8; color: #8c1d18; border: 1px solid #f2c9c6; }
.verdict.pass { background: #e6f4ec; color: #0e5c3a; border: 1px solid #c3e3d1; }

.run-head { display: flex; justify-content: space-between; align-items: flex-start;
  gap: 18px; flex-wrap: wrap; padding: 16px 18px; }
.run-head h1 { margin: 0 0 4px; }
.run-head .sub { margin: 0; }
.run-head-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.review-submit-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:14px 0; }
.review-submit-summary span { padding:9px 11px; background:#f7f9fb; border:1px solid var(--line); border-radius:4px; color:var(--ink-soft); font-size:11px; }
.review-submit-summary b { display:block; margin-top:4px; color:var(--ink); font-size:12px; overflow-wrap:anywhere; }
.review-submit-caution { color:var(--warn); background:var(--warn-bg); padding:9px 11px; border-left:3px solid var(--warn); }
.run-business-status { margin:9px 0 3px; }
.run-card-actions { display:flex; gap:6px; flex-wrap:wrap; margin-top:4px; }
.run-card-actions button { flex:1 1 125px; }
.tag.big { font-size: 12px; padding: 5px 12px; }

.meta-row { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0 14px; }
.pill { background: #eef2f6; border: 1px solid var(--line); border-radius: 14px;
  padding: 4px 11px; font-size: 11.5px; color: var(--ink-soft); }

.sec-head { display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 12px 14px 0; }
.sec-head h3 { margin: 0; font-size: 11px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ink-faint); }
.panel > .sec-head { padding: 13px 14px 0; }

.keychip { display: inline-flex; align-items: baseline; gap: 7px; padding: 5px 11px;
  background: #e8f0f7; border: 1px solid #cfe0ee; border-radius: 4px;
  font-size: 12.5px; margin-right: 7px; }
.keychip em { font-family: 'IBM Plex Mono', monospace; font-size: 11px;
  font-style: normal; color: var(--ink-soft); }

.fchips { display: flex; flex-wrap: wrap; gap: 8px; }
.fchip { border: 1px solid var(--line-strong); border-radius: 4px; padding: 7px 10px;
  background: #fff; min-width: 132px; }
.fchip b { display: block; font-size: 12.5px; }
.fchip span { display: block; font-size: 10.5px; color: var(--ink-soft); margin-top: 1px; }
.fchip em { font-size: 10px; font-style: normal; color: var(--ink-faint); }
.fchip.plain { padding: 5px 9px; min-width: 0; font-size: 11.5px; color: var(--ink-soft); }

.tiles { display: grid; grid-template-columns: repeat(9, 1fr); gap: 8px; margin: 14px 0; }
@media (max-width: 1280px) { .tiles { grid-template-columns: repeat(5, 1fr); } }
@media (max-width: 760px) { .tiles { grid-template-columns: repeat(3, 1fr); } }
.tile { background: #fff; border: 1px solid var(--line); border-radius: 5px;
  padding: 13px 12px; }
.tile b { display: block; font-size: 24px; letter-spacing: -.03em; line-height: 1.1; }
.tile b.pass { color: var(--pass); } .tile b.fail { color: var(--fail); }
.tile span { display: block; font-size: 10.5px; color: var(--ink-faint); margin-top: 4px; }

.reco-panel > .reco-head { display: flex; align-items: center; gap: 9px;
  background: var(--navy, #1f3450); color: #fff; }
.reco-head .count { background: rgba(255,255,255,.18); border-radius: 10px;
  padding: 1px 8px; font-size: 11px; }
.reco-head .ghost { background: rgba(255,255,255,.14); color: #fff;
  border-color: rgba(255,255,255,.28); }
.reco { padding: 13px 15px; border-bottom: 1px solid var(--line);
  border-left: 3px solid var(--warn); }
.reco:last-child { border-bottom: 0; }
.reco.decided { opacity: .6; border-left-color: var(--line-strong); }
.reco-top { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.reco-meta { margin-left: auto; font-size: 11.5px; color: var(--ink-faint); }
.reco-why { font-size: 12.5px; color: var(--ink-soft); margin: 6px 0; }
.reco-ex { font-size: 11.5px; background: #f7f9fb; border: 1px solid var(--line);
  border-radius: 4px; padding: 6px 10px; margin-bottom: 9px; }
.reco-ex .ok { color: var(--pass); } .reco-ex .bad { color: var(--fail); }
.reco-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }

/* ================================================================
   GenMove V1 AI Diagnosis interface
   Faithful shell and visual language from the reference application.
   ================================================================ */
:root {
  --ink:#161c24; --ink-soft:#55616f; --ink-faint:#8b95a1;
  --canvas:#f4f6f9; --surface:#fff; --line:#e2e6ed; --line-strong:#cdd4dd;
  --rail:#141c26; --rail-hover:#1c2733; --steel:#2c5c8a; --steel-soft:#e8f0f7;
  --pass:#0e7a4b; --pass-bg:#e6f4ec; --warn:#a9691a; --warn-bg:#fdf2e0;
  --fail:#b3261e; --fail-bg:#fbe9e8; --navy:#141c26;
}
html,body { font-size:13px; background:var(--canvas); color:var(--ink); overflow:hidden; }
.app-shell { grid-template-columns:238px 1fr; }
.rail { padding:0; background:#141c26; border-right:1px solid #2a3846; box-shadow:none; overflow:hidden; }
.brand { display:flex; align-items:center; gap:10px; padding:16px 15px 13px; margin:0; text-decoration:none; cursor:pointer; }
.brand-symbol { width:26px; height:29px; flex:none; }
.brand b { color:#fff; font-size:15.5px; font-weight:600; line-height:1.15; letter-spacing:0; }
.brand span { display:block; color:#7c8ea1; font-size:9.5px; letter-spacing:.09em; text-transform:uppercase; }
.rail-cta { display:block; width:calc(100% - 20px); margin:0 10px 8px; min-height:34px; padding:8px 12px;
  border:0; border-radius:7px; background:#2c5c8a; color:#fff; font-size:12.5px; text-align:center; }
.rail-cta:hover { background:#24507a; }
.rail nav { flex:1 1 auto; overflow-y:auto; overflow-x:hidden; padding:2px 8px 12px; min-height:0; }
.rail nav { scrollbar-width:thin; scrollbar-color:rgba(124,142,161,.48) transparent; }
.rail nav::-webkit-scrollbar { width:7px; }
.rail nav::-webkit-scrollbar-track { background:transparent; }
.rail nav::-webkit-scrollbar-thumb { background:rgba(124,142,161,.38); border:2px solid #141c26; border-radius:999px; }
.rail nav::-webkit-scrollbar-thumb:hover { background:rgba(151,170,190,.62); }
.rail .group { padding:13px 10px 4px; font-size:9px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:#7c8ea1; }
.rail a { display:flex; align-items:center; gap:9px; width:100%; padding:8px 10px; margin:1px 0; border:0;
  border-left:3px solid transparent; border-radius:7px; color:#dce3ea; font-size:12.5px; line-height:1.3; }
.rail a i { width:15px; text-align:center; font-style:normal; opacity:.8; flex:none; }
.rail a:hover { background:rgba(255,255,255,.06); color:#fff; }
.rail a.on { background:rgba(44,92,138,.38); color:#fff; font-weight:600; border-left:3px solid #62a0d8; box-shadow:none; }
.rail-user { flex:0 0 auto; display:flex; align-items:center; gap:10px; padding:11px 13px; background:#0e141c; border-top:1px solid #2a3846; }
.rail-avatar { width:32px; height:32px; border-radius:50%; border:1px solid rgba(255,255,255,.3); display:grid; place-items:center;
  color:#fff; font-size:11px; font-weight:700; }
.rail-who { min-width:0; flex:1; }.rail-who b,.rail-who small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rail-who b { color:#fff; font-size:12.5px; }.rail-who small { color:#7c8ea1; font-size:10.5px; }
.rail-who #rail-user-role { color:#b8c9d8; font-weight:600; }
.rail-signout { border:0; background:transparent; color:#8b9bab; min-height:auto; padding:2px 4px; font-size:15px; }
.rail-signout:hover { color:#fff; background:transparent; }
.main { background:var(--canvas); }
.context.app-topbar { min-height:54px; padding:8px 22px; gap:12px; background:#fff; border-bottom:1px solid #e2e6ed; }
.topbar-title { margin-right:auto; font-size:14px; font-weight:600; white-space:nowrap; }
.context.app-topbar>div:not(.topbar-actions):not(.user-menu) label { display:none; }
.context.app-topbar select { min-width:128px; max-width:190px; min-height:32px; padding:6px 8px; border:1px solid #e2e6ed; border-radius:6px; background:#fff; }
.topbar-actions { display:flex; gap:7px; align-items:center; }
.context button { min-height:32px; padding:6px 13px; border-radius:6px; }
.workspace { padding:20px 24px 44px; }
h1 { font-size:19px; } h2 { font-size:14px; }
.panel,.stats,.object-card,.tablewrap { border-radius:6px; box-shadow:0 1px 2px rgba(20,28,38,.05),0 6px 18px rgba(20,28,38,.045); }
.panel>header { min-height:auto; padding:10px 14px; }.panel .body { padding:14px; }
select,input,textarea { min-height:32px; padding:6px 9px; border-radius:5px; }
button { min-height:32px; padding:6px 11px; border-radius:5px; font-weight:500; }
th { height:auto; padding:9px 12px; background:#eef1f5; color:#5f6b78; } td { height:auto; padding:9px 12px; }
.tag { border-radius:4px; text-transform:uppercase; font-weight:600; }

.reference-hero { position:relative; overflow:hidden; border-radius:10px; min-height:190px; padding:30px 34px; margin-bottom:16px;
  display:grid; grid-template-columns:1.5fr 1fr; align-items:center; color:#fff; background:#141c26; border:1px solid #2a3846;
  box-shadow:0 14px 40px rgba(20,28,38,.14); }
.reference-hero .eyebrow { color:#aab7c3; font-size:11px; letter-spacing:.12em; font-weight:700; }
.reference-hero h1 { color:#fff; font-size:31px; margin:8px 0; }
.reference-hero p { color:#d4dce4; font-size:14px; line-height:1.7; max-width:720px; margin:0; }
.hero-actions { display:flex; gap:9px; margin-top:20px; }.hero-actions button { min-height:36px; padding:8px 14px; }
.hero-actions button:not(.primary) { color:#fff; background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.28); }
.hero-info { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:8px; padding:17px; }
.hero-info b { font-size:14px; }.hero-info div { margin-top:10px; display:flex; gap:8px; align-items:center; font-size:12px; color:#dce3ea; }
.hero-info .dot { width:8px; height:8px; border-radius:50%; background:#57c99a; box-shadow:0 0 0 4px rgba(87,201,154,.14); }
.reference-metrics { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin:16px 0 20px; }
.reference-metric { position:relative; overflow:hidden; background:#fff; border:1px solid var(--line); border-radius:6px; padding:15px; box-shadow:0 1px 4px rgba(0,0,0,.06); }
.reference-metric:before { content:''; position:absolute; inset:0 auto 0 0; width:3px; background:#2c5c8a; }
.reference-metric.green:before { background:var(--pass); }.reference-metric.red:before { background:var(--fail); }
.reference-metric.amber:before { background:var(--warn); }.reference-metric.teal:before { background:#2c5c8a; }
.reference-metric span,.reference-metric small { display:block; }.reference-metric span { color:var(--ink-soft); font-size:10px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; }
.reference-metric b { display:block; font-size:25px; margin-top:6px; }.reference-metric small { color:var(--ink-soft); font-size:10px; margin-top:2px; }
.desk-grid { grid-template-columns:minmax(0,2fr) minmax(300px,1fr); gap:15px; }.desk-side>button { border-radius:6px; }
.object-card { border-radius:6px; }.object-card:hover { transform:none; box-shadow:0 1px 4px rgba(0,0,0,.08); }
.object-next { border-radius:5px; }.control-hero,.signal-strip,.journey { display:none; }

@media(max-width:1050px){.reference-metrics{grid-template-columns:repeat(3,1fr)}.reference-hero{grid-template-columns:1fr}.hero-info{display:none}}
@media(max-width:680px){.app-shell{grid-template-columns:1fr;grid-template-rows:auto 1fr}.rail{overflow:auto}.rail-user{display:none}.reference-metrics{grid-template-columns:repeat(2,1fr)}.reference-hero{padding:24px}.topbar-title{width:100%}}

/* Admin portal */
.admin-hero { display:flex; justify-content:space-between; gap:24px; align-items:center; padding:22px 24px; margin-bottom:15px;
  background:#fff; border:1px solid var(--line); border-radius:8px; box-shadow:0 1px 4px rgba(20,28,38,.06); }
.admin-hero .eyebrow { color:var(--steel); font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.admin-hero h1 { margin:5px 0; font-size:22px; }.admin-hero p { margin:0; color:var(--ink-soft); }
.admin-metrics { grid-template-columns:repeat(3,minmax(170px,1fr)); max-width:760px; }
.admin-layout { display:grid; grid-template-columns:minmax(620px,1fr) 300px; gap:15px; align-items:start; }
.panel>header>div span { display:block; margin-top:2px; color:var(--ink-soft); font-size:11px; font-weight:400; }
.admin-user-list { padding:0 14px 14px; }.admin-user-row { display:grid; grid-template-columns:minmax(205px,1.2fr) 92px 190px minmax(155px,1fr) 105px;
  gap:12px; align-items:center; min-height:64px; padding:9px 4px; border-bottom:1px solid var(--line); }
.admin-user-head { min-height:36px; color:var(--ink-soft); font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.admin-person { position:relative; min-width:0; }.admin-person b,.admin-person small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.admin-person small { margin-top:3px; color:var(--ink-soft); }.admin-person em { display:inline-block; margin-top:5px; padding:2px 6px; color:var(--steel);
  background:var(--steel-soft); border-radius:9px; font-size:9px; font-style:normal; font-weight:700; }
.admin-role { width:100%; }.admin-actions { display:flex; flex-direction:column; gap:5px; }.admin-actions button { width:100%; }
.admin-actions .reset-pending { color:var(--warn); border-color:#e5c58f; background:var(--warn-bg); font-weight:600; }
.admin-project-access b,.admin-project-access small { display:block; }.admin-project-access b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11.5px; }
.admin-project-access small { margin-top:3px; color:var(--ink-soft); font-size:10px; }
.admin-project-picker { display:grid; grid-template-columns:1fr 1fr; gap:8px; max-height:340px; overflow:auto; }
.admin-project-picker label { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:9px; padding:10px; border:1px solid var(--line); border-radius:6px; background:#f8fafc; cursor:pointer; }
.admin-project-picker input { min-height:auto; }.admin-project-picker b,.admin-project-picker small { display:block; }.admin-project-picker small { color:var(--ink-soft); margin-top:2px; }
.integration-card .body { text-align:center; }.integration-card h2 { margin:9px 0; }.integration-card p { color:var(--ink-soft); line-height:1.55; }
.integration-card button { width:100%; margin:8px 0; }.integration-card small { display:block; color:var(--ink-faint); line-height:1.45; }
.integration-mark { width:44px; height:44px; margin:4px auto; display:grid; place-items:center; color:#fff; background:#737373; font-size:22px; font-weight:700; }
@media(max-width:1050px){.admin-layout{grid-template-columns:1fr}.integration-card{max-width:none}}
@media(max-width:760px){.admin-metrics{grid-template-columns:1fr}.admin-user-row{grid-template-columns:1fr 1fr}.admin-user-head{display:none}}
.access-pending { max-width:660px; margin:8vh auto; padding:38px; text-align:center; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 10px 35px rgba(20,28,38,.08); }
.access-pending .access-icon { width:54px; height:54px; margin:0 auto 15px; display:grid; place-items:center; border-radius:50%; background:var(--steel-soft); color:var(--steel); font-size:24px; }
.access-pending h1 { font-size:24px; }.access-pending>p { color:var(--ink-soft); font-size:14px; line-height:1.55; }
.access-pending>div:not(.access-icon) { margin:24px 0 16px; padding:14px; text-align:left; background:#f8fafc; border:1px solid var(--line); border-radius:7px; }
.access-pending>div b,.access-pending>div span { display:block; }.access-pending>div span,.access-pending>small { margin-top:5px; color:var(--ink-soft); line-height:1.5; }

/* Diagnose V1 validation settings and join-key dialogs */
.dialog-info { display:flex; flex-direction:column; gap:4px; padding:12px 14px; margin-bottom:14px;
  color:var(--steel); background:var(--steel-soft); border:1px solid #cfe0ee; border-radius:7px; line-height:1.55; }
.dialog-info span { color:var(--ink-soft); font-size:11.5px; }
.dialog-label { margin:10px 0 6px; color:var(--ink-soft); font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.jk-selected { min-height:45px; display:flex; flex-wrap:wrap; align-items:center; gap:7px; padding:8px;
  background:#f8f9fb; border:1px solid var(--line); border-radius:7px; }
.jk-tag { display:inline-flex; align-items:center; gap:5px; padding:5px 7px; color:var(--steel); background:var(--steel-soft); border:1px solid #c6dcee; border-radius:6px; font-weight:600; }
.jk-tag>i { display:grid; place-items:center; width:17px; height:17px; color:#fff; background:var(--steel); border-radius:50%; font-style:normal; font-size:9px; }
.jk-tag small { color:var(--ink-soft); font:9.5px 'IBM Plex Mono',monospace; }.jk-tag button { min-height:auto; padding:0 2px; border:0; background:transparent; color:var(--ink-soft); }
.jk-uniqueness { display:flex; gap:14px; align-items:center; margin:9px 0; padding:8px 11px; background:#f8f9fb; border:1px solid var(--line); border-radius:6px; font-size:11px; }
.jk-uniqueness b { color:var(--pass); }.jk-toolbar { display:flex; gap:8px; margin:12px 0; }.jk-toolbar input { flex:1; }
.jk-grid { display:grid; grid-template-columns:1fr 1fr; gap:7px; max-height:300px; overflow:auto; }
.jk-option,.settings-fields label { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:8px; padding:8px 9px; background:#fff; border:1px solid var(--line); border-radius:6px; cursor:pointer; }
.jk-option.on { background:var(--steel-soft); border-color:#b9d1e5; }.jk-option input,.settings-fields input { min-height:auto; }
.jk-option span,.settings-fields label span { min-width:0; }.jk-option b,.settings-fields b { display:block; font-size:11.5px; }
.jk-option small,.settings-fields small { display:block; color:var(--ink-soft); font:9.5px 'IBM Plex Mono',monospace; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.jk-option>i { padding:2px 6px; color:#fff; background:var(--steel); border-radius:10px; font-style:normal; font-size:9px; }
.modal-message { min-height:20px; padding-top:9px; color:var(--steel); font-size:11.5px; }
.settings-threshold { display:block; padding:12px; background:#f8f9fb; border:1px solid var(--line); border-radius:6px; }
.settings-threshold>span { display:flex; justify-content:space-between; }.settings-threshold input { width:100%; accent-color:var(--steel); }
.settings-toggle { display:flex; gap:9px; align-items:start; margin:10px 0; padding:10px 12px; border:1px solid var(--line); border-radius:6px; }
.settings-toggle input { min-height:auto; }.settings-toggle b,.settings-toggle small { display:block; }.settings-toggle small { color:var(--ink-soft); margin-top:2px; }
.settings-field-head { display:flex; align-items:center; justify-content:space-between; }.settings-field-head button { min-height:27px; padding:4px 8px; margin-left:5px; }
.settings-fields { display:grid; grid-template-columns:1fr 1fr; gap:7px; max-height:330px; overflow:auto; }
.settings-fields label:has(input:checked) { background:var(--steel-soft); border-color:#b9d1e5; }
@media(max-width:700px){.jk-grid,.settings-fields{grid-template-columns:1fr}}

/* Initial validation field selection */
.field-selection-intro { display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:13px 14px; margin-bottom:13px; color:var(--steel); background:var(--steel-soft);
  border:1px solid #cfe0ee; border-radius:7px; }
.field-selection-intro>div { display:flex; flex-direction:column; gap:4px; }
.field-selection-intro span:not(.tag) { color:var(--ink-soft); font-size:11.5px; line-height:1.45; }
.field-mode-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:13px; }
.field-mode { display:grid; grid-template-columns:auto 1fr; gap:9px; padding:11px 12px;
  border:1px solid var(--line); border-radius:7px; background:#fff; cursor:pointer; }
.field-mode:has(input:checked) { border-color:#9bbbd7; background:var(--steel-soft); box-shadow:0 0 0 1px #d5e5f2 inset; }
.field-mode input { min-height:auto; margin-top:2px; accent-color:var(--steel); }
.field-mode b,.field-mode small { display:block; }.field-mode small { margin-top:3px; color:var(--ink-soft); line-height:1.4; }
.field-selection-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:9px 11px; background:#f8f9fb; border:1px solid var(--line); border-radius:6px 6px 0 0; }
.field-selection-toolbar>div { display:flex; flex-direction:column; gap:2px; }
.field-selection-toolbar span { color:var(--ink-soft); font-size:10.5px; }
.field-select-all { display:flex; align-items:center; gap:7px; padding:5px 9px; border:1px solid var(--line-strong);
  border-radius:5px; background:#fff; cursor:pointer; font-weight:600; }
.field-select-all input { min-height:auto; accent-color:var(--steel); }
.field-selection-list { display:grid; grid-template-columns:1fr 1fr; gap:7px; max-height:310px;
  overflow:auto; padding:9px; border:1px solid var(--line); border-top:0; border-radius:0 0 6px 6px; }
.field-select-row { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:8px;
  min-height:54px; padding:8px 9px; background:#fff; border:1px solid var(--line); border-radius:6px; cursor:pointer; }
.field-select-row.on { background:var(--steel-soft); border-color:#b9d1e5; }
.field-select-row input { min-height:auto; accent-color:var(--steel); }
.field-select-row>span { min-width:0; }.field-select-row b { display:block; font-size:11.5px; }
.field-select-row small { display:block; overflow:hidden; color:var(--ink-soft); font:9.5px 'IBM Plex Mono',monospace;
  text-overflow:ellipsis; white-space:nowrap; }
.field-select-row>i { display:flex; flex-direction:column; align-items:flex-end; gap:3px; font-style:normal; }
.field-badge { padding:2px 5px; border-radius:3px; font-size:8px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.field-badge.mandatory { color:#8b4d11; background:#fdf2e0; }.field-badge.optional { color:#66717e; background:#eef1f5; }
.field-badge.key { color:#24527c; background:#dceaf6; }
@media(max-width:700px){.field-mode-grid,.field-selection-list{grid-template-columns:1fr}.field-selection-intro{align-items:flex-start;flex-direction:column}}

/* Port 5050 Validation Runs card dashboard */
.runs-page-head { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; margin:2px 0 15px; }
.runs-page-head h1 { margin:0 0 4px; font-size:19px; }.runs-page-head h1 small { color:var(--ink-soft); font-size:11px; font-weight:500; }
.runs-page-head p { margin:0; color:var(--ink-soft); font-size:12px; }
.runs-page-actions { display:flex; align-items:center; gap:8px; color:var(--ink-soft); font-size:10.5px; }
.threshold-chip { padding:5px 10px; border-radius:16px; color:var(--steel); background:var(--steel-soft); border:1px solid #c6dcee; font-weight:600; }
.validation-card-grid { display:grid; grid-template-columns:repeat(3,minmax(260px,1fr)); gap:14px; align-items:stretch; }
.validation-run-card { min-height:252px; display:flex; flex-direction:column; padding:16px; background:#fff; border:1px solid var(--line); border-radius:7px;
  box-shadow:0 1px 3px rgba(20,28,38,.04); cursor:pointer; transition:border-color .15s,box-shadow .15s; }
.validation-run-card:hover { border-color:#aebdcb; box-shadow:0 5px 18px rgba(20,28,38,.08); }
.validation-run-card:focus-visible { outline:2px solid var(--steel); outline-offset:2px; }
.validation-run-card>header { display:flex; align-items:center; justify-content:space-between; gap:8px; }.validation-run-card>header>b { font-size:14px; min-width:0; overflow-wrap:anywhere; }
.run-files { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:7px; margin-top:9px; color:var(--ink-soft); font:10.5px 'IBM Plex Mono',monospace; }
.run-files span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.run-files i { color:var(--ink-faint); font-style:normal; }
.run-score { margin:20px 0 10px; color:var(--pass); font:600 30px 'IBM Plex Mono',monospace; }.run-score.fail { color:var(--fail); }.run-score small { font-size:13px; }
.run-card-metrics { display:grid; grid-template-columns:repeat(4,1fr); padding:9px 0; border-top:1px solid var(--line); gap:7px; }
.run-card-metrics span { color:var(--ink-soft); font-size:8.5px; letter-spacing:.04em; text-transform:uppercase; }

/* Governed transformation hub */
.tx-flow{display:flex;align-items:center;justify-content:space-between;gap:12px;overflow:auto;padding:8px 0}.tx-flow>span{min-width:145px;border:1px solid var(--line);border-radius:6px;padding:13px;background:#fff}.tx-flow i{display:inline-grid;place-items:center;width:22px;height:22px;margin-right:7px;border-radius:50%;background:var(--steel);color:#fff;font-style:normal}.tx-flow small{display:block;color:var(--ink-soft);margin:7px 0 0 29px}.compact{padding:5px 8px;font-size:11px}.wide{grid-column:1/-1}
.run-card-metrics b { display:block; margin-bottom:3px; color:var(--ink); font:600 13px 'IBM Plex Mono',monospace; }.run-card-metrics .bad b { color:var(--fail); }
.run-card-meta { color:var(--ink-soft); font-size:10px; margin-top:4px; }.run-card-meta b { font-family:'IBM Plex Mono',monospace; font-weight:500; }
.run-error { flex:1; margin:18px 0 8px; color:var(--fail); font-size:11.5px; line-height:1.5; }
.open-dashboard { align-self:flex-start; margin-top:auto; padding:6px 0; min-height:auto; color:var(--steel); background:transparent; border:0; font-size:11px; font-weight:600; }
.open-dashboard:hover { background:transparent; color:#234a70; }
@media(max-width:1100px){.validation-card-grid{grid-template-columns:repeat(2,minmax(260px,1fr))}.runs-page-head{flex-direction:column}.runs-page-actions{flex-wrap:wrap}}
@media(max-width:700px){.validation-card-grid{grid-template-columns:1fr}}

/* Business decisions in the consultant workspace. */
.context.app-topbar { position:relative; z-index:30; }
.consultant-notifications { position:relative; flex:none; }
.context .notification-bell { width:36px; height:34px; min-height:34px; padding:6px; display:grid; place-items:center;
  position:relative; border:1px solid var(--line); background:#fff; color:var(--ink-soft); }
.notification-bell:hover,.notification-bell.has-unread { color:var(--steel); border-color:#abc3db; background:var(--steel-soft); }
.notification-bell svg { width:18px; height:18px; }
.notification-count { position:absolute; top:-8px; right:-8px; min-width:18px; height:18px; padding:0 4px;
  display:grid; place-items:center; border-radius:12px; background:var(--fail); color:#fff;
  font-size:10px; font-weight:700; line-height:1; box-shadow:0 0 0 2px #fff; }
.notification-popover { position:absolute; right:0; top:calc(100% + 8px); width:min(380px,calc(100vw - 28px));
  max-height:460px; z-index:1000; background:#fff; border:1px solid var(--line); border-radius:9px;
  box-shadow:0 16px 45px rgba(16,25,38,.2); overflow:hidden; }
.notification-popover-head { display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:12px 14px; border-bottom:1px solid var(--line); }
.notification-popover-head b { font-size:13px; }
.notification-popover-head button { border:0; background:transparent; color:var(--ink-soft); font-size:19px; min-height:auto; padding:0 4px; }
.notification-list { overflow-y:auto; max-height:390px; scrollbar-width:thin; }
.context .notification-item { display:block; width:100%; height:auto; padding:12px 14px; border:0; border-left:3px solid transparent;
  border-bottom:1px solid var(--line); border-radius:0; background:#fff; text-align:left; white-space:normal; }
.notification-item:last-child { border-bottom:0; }
.notification-item:hover { background:#f7f9fc; }
.notification-item.unread { background:#f8fbff; }
.notification-item.returned.unread { border-left-color:var(--fail); }
.notification-item.approved.unread { border-left-color:var(--pass); }
.notification-item-top { display:flex; justify-content:space-between; align-items:center; gap:8px;
  color:var(--ink-soft); font-size:10px; text-transform:uppercase; letter-spacing:.04em; }
.notification-item-top i { font-style:normal; color:var(--steel); font-weight:700; }
.notification-item strong,.notification-item span:not(.notification-item-top),.notification-item small { display:block; margin-top:5px; }
.notification-item strong { font-size:12px; color:var(--ink); }
.notification-item span:not(.notification-item-top) { font-size:11px; color:var(--ink-soft); line-height:1.35; }
.notification-item small { font-size:10px; color:var(--ink-faint); }
.notification-empty { padding:28px 16px; text-align:center; color:var(--ink-soft); }
.business-update-banner { display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-bottom:16px; padding:11px 14px; border:1px solid #c6dcee; border-left:4px solid var(--steel);
  background:var(--steel-soft); border-radius:5px; color:#254a6c; }
.business-update-banner b { margin-right:8px; }
.business-update-banner button { flex:none; color:var(--steel); background:#fff; border-color:#b9d1e5; }
.object-status-stack { display:flex; flex-direction:column; align-items:flex-end; gap:5px; }
.object-card.business-returned,.validation-run-card.business-returned { border-color:#dfa9a5; background:#fffafa; }
.object-card.business-approved,.validation-run-card.business-approved { border-color:#a6cfb9; background:#fbfffc; }
.run-business-status { display:flex; flex-wrap:wrap; gap:5px; }
@media(max-width:680px){.notification-popover{right:-8px}.business-update-banner{align-items:flex-start;flex-direction:column}}
