:root {
  color-scheme: light;
  --ink: #1f2933;
  --muted: #667085;
  --line: #d7dde6;
  --bg: #f4f7fb;
  --panel: #ffffff;
  --teal: #087f8c;
  --blue: #2f5fbb;
  --green: #2f7d4f;
  --amber: #9a5b00;
  --red: #a33a3a;
  --violet: #6c4aa5;
  --shadow: 0 12px 34px rgba(31, 41, 51, 0.12);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--ink);
}

.shell {
  min-height: 100vh;
}

.topbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  padding: 28px clamp(18px, 4vw, 48px) 18px;
  border-bottom: 1px solid var(--line);
  background: #fbfcfe;
}

.eyebrow {
  margin: 0 0 5px;
  color: var(--teal);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

h1,
h2,
p {
  margin: 0;
}

h1 {
  font-size: clamp(34px, 5vw, 72px);
  font-weight: 760;
  letter-spacing: 0;
  line-height: 1;
}

h2 {
  font-size: 16px;
  font-weight: 760;
}

.status-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  max-width: 620px;
}

.top-actions {
  display: grid;
  justify-items: end;
  gap: 8px;
}

.goal-subtitle {
  max-width: min(900px, 70vw);
  margin-top: 10px;
  color: var(--muted);
  font-size: clamp(14px, 1.45vw, 18px);
  font-weight: 720;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.mode-toggle {
  display: inline-flex;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
}

.mode-toggle button {
  min-height: 32px;
  padding: 0 12px;
  border: 0;
  border-right: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
}

.mode-toggle button:last-child {
  border-right: 0;
}

.mode-toggle button[aria-pressed="true"] {
  background: var(--ink);
  color: #fff;
}

.live-status {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
  color: var(--ink);
  font-size: 13px;
  font-weight: 650;
  white-space: nowrap;
}

.dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--muted);
}

.dot.clear,
.dot.closed,
.dot.released,
.dot.pass,
.dot.installed,
.dot.running {
  background: var(--green);
}

.dot.accepted,
.dot.active,
.dot.sent,
.dot.collected {
  background: var(--blue);
}

.dot.hold,
.dot.held,
.dot.attention,
.dot.escalated {
  background: var(--amber);
}

.dot.failed,
.dot.stopped,
.dot.missing {
  background: var(--red);
}

.map-band {
  padding: 22px clamp(18px, 4vw, 48px);
}

.loop-map {
  display: grid;
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  gap: 10px;
  align-items: stretch;
}

.loop-node {
  position: relative;
  min-height: 138px;
  padding: 14px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--teal);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.loop-node:nth-child(2) {
  border-left-color: var(--green);
}

.loop-node:nth-child(3) {
  border-left-color: var(--violet);
}

.loop-node:nth-child(4) {
  border-left-color: var(--blue);
}

.loop-node:nth-child(5) {
  border-left-color: var(--amber);
}

.loop-node b {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
}

.loop-node span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}

.workgrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 0 clamp(18px, 4vw, 48px) 40px;
}

.simple-dashboard {
  display: none;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 22px clamp(18px, 4vw, 48px) 40px;
}

.simple-dashboard > div {
  min-height: 180px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.simple-dashboard h2 {
  margin-bottom: 12px;
  font-size: 18px;
}

.simple-dashboard p {
  color: var(--ink);
  font-size: 26px;
  font-weight: 720;
  line-height: 1.18;
}

.simple-mode .simple-dashboard {
  display: grid;
}

.session-band {
  padding: 26px clamp(18px, 4vw, 48px);
  border-bottom: 1px solid var(--line);
  background: #f8fbff;
}

.session-form {
  display: grid;
  grid-template-columns: minmax(170px, 0.28fr) minmax(320px, 1fr) minmax(160px, 220px);
  gap: 14px;
  align-items: end;
}

.session-copy h2 {
  max-width: 250px;
  font-size: clamp(28px, 3.4vw, 48px);
  line-height: 1.04;
}

.session-field,
.session-contract {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.session-field span,
.session-contract span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.session-field textarea,
.session-contract input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.session-field textarea {
  min-height: 128px;
  resize: vertical;
  padding: 12px;
  line-height: 1.35;
}

.session-contract input {
  min-height: 42px;
  padding: 0 11px;
}

.session-field textarea:focus,
.session-contract input:focus {
  outline: 3px solid rgba(47, 95, 187, 0.14);
  border-color: var(--blue);
}

.session-controls {
  display: grid;
  gap: 10px;
}

.session-controls button {
  min-height: 44px;
  padding: 0 16px;
  border: 0;
  border-radius: 8px;
  background: var(--ink);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.session-controls button:disabled {
  cursor: wait;
  opacity: 0.62;
}

.session-status {
  grid-column: 2;
  min-height: 22px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
}

.session-result {
  grid-column: 2 / span 2;
  display: grid;
  gap: 8px;
}

.agent-work-band {
  display: grid;
  gap: 14px;
  padding: 22px clamp(18px, 4vw, 48px) 26px;
  border-bottom: 1px solid var(--line);
  background: #ffffff;
}

.agent-work-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
}

.agent-work-head h2 {
  max-width: 960px;
  font-size: clamp(22px, 2.7vw, 38px);
  line-height: 1.08;
  overflow-wrap: anywhere;
}

.agent-work-head > span {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.agent-role-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.agent-card {
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 9px;
  min-height: 132px;
  padding: 12px;
  border: 1px solid var(--line);
  border-top: 5px solid var(--teal);
  border-radius: 8px;
  background: #fbfcfe;
}

.agent-card.memory {
  border-top-color: var(--green);
}

.agent-card.capability {
  border-top-color: var(--violet);
}

.agent-card.hive {
  border-top-color: var(--blue);
}

.agent-card.executor {
  border-top-color: var(--amber);
}

.agent-card strong {
  font-size: 18px;
}

.agent-card span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.artifact-lane {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.artifact-item {
  display: grid;
  gap: 5px;
  min-height: 118px;
  padding: 9px 10px;
  border: 1px solid #dfe6ee;
  border-radius: 6px;
  background: #fbfcfe;
}

.artifact-item strong {
  font-size: 12px;
  text-transform: uppercase;
}

.artifact-item span,
.artifact-item p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.32;
  overflow-wrap: anywhere;
}

.artifact-item p {
  margin: 0;
}

.artifact-path {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.artifact-preview {
  max-height: 64px;
  overflow: hidden;
}

.artifact-open-control,
.session-artifact-open,
.promotion-artifact-open,
.agent-artifact-open,
.artifact-lane-open,
.hive-artifact-open {
  display: grid;
  gap: 5px;
}

.artifact-open-actions,
.chat-artifact-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.authority-badge {
  width: fit-content;
  border: 1px solid #d8e0ea;
  border-radius: 999px;
  background: #f6f8fb;
  color: #475569;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.2;
  padding: 3px 7px;
}

.artifact-open,
.artifact-copy {
  width: fit-content;
  min-height: 26px;
  border: 1px solid #cfd9e6;
  border-radius: 6px;
  background: #fff;
  color: #334155;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  padding: 3px 8px;
}

.artifact-copy-status,
.chat-copy-status {
  color: #718096;
  font-size: 11px;
  font-weight: 750;
}

.artifact-open-preview {
  max-height: 220px;
  overflow: auto;
  margin: 0;
  padding: 8px;
  border: 1px solid #d9e1ec;
  border-radius: 6px;
  background: #f8fafc;
  color: #263449;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  line-height: 1.35;
}

.artifact-hash-panel {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 40;
  display: grid;
  gap: 8px;
  width: min(560px, calc(100vw - 32px));
  max-height: min(70vh, 640px);
  padding: 12px;
  border: 1px solid #cfd9e6;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.18);
}

.artifact-hash-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.artifact-hash-head strong,
.artifact-hash-path {
  overflow-wrap: anywhere;
}

.artifact-hash-path {
  color: #526174;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
}

.artifact-hash-close {
  flex: 0 0 auto;
  min-height: 28px;
  border: 1px solid #cfd9e6;
  border-radius: 6px;
  background: #f8fafc;
  color: #334155;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  padding: 4px 9px;
}

.artifact-hash-preview {
  max-height: min(54vh, 500px);
  overflow: auto;
  margin: 0;
  padding: 10px;
  border: 1px solid #d9e1ec;
  border-radius: 6px;
  background: #f8fafc;
  color: #263449;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  line-height: 1.35;
}

.work-timeline {
  display: grid;
  gap: 7px;
}

.timeline-row {
  display: grid;
  grid-template-columns: 130px 150px minmax(0, 1fr) 128px;
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid #e3e8ef;
  border-radius: 6px;
  background: #ffffff;
}

.timeline-row strong,
.timeline-row span {
  overflow-wrap: anywhere;
}

.timeline-row span {
  color: var(--muted);
  font-size: 12px;
}

.session-summary,
.session-envelope {
  display: grid;
  grid-template-columns: 170px repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #d8e3f3;
  border-radius: 6px;
  background: #fff;
}

.session-envelope {
  grid-template-columns: 110px minmax(0, 1fr);
}

.session-role-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.session-role {
  display: grid;
  gap: 8px;
  min-height: 122px;
  padding: 10px;
  border: 1px solid #d8e3f3;
  border-radius: 6px;
  background: #fff;
}

.session-summary span,
.session-envelope span,
.session-role span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.session-promotion {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #d8e3f3;
  border-left: 4px solid var(--blue);
  border-radius: 6px;
  background: #fff;
}

.session-promotion-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.session-promotion-copy span,
.promotion-status,
.promotion-result-row span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.promotion-confirm {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 760;
  white-space: nowrap;
}

.promotion-confirm input {
  width: 17px;
  height: 17px;
  accent-color: var(--blue);
}

.session-promotion button {
  min-height: 38px;
  padding: 0 14px;
  border: 0;
  border-radius: 8px;
  background: var(--blue);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.session-promotion button:disabled {
  cursor: wait;
  opacity: 0.62;
}

.promotion-result {
  grid-column: 1 / -1;
  display: grid;
  gap: 6px;
}

.promotion-result-row {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid #e1e8f0;
  border-radius: 6px;
  background: #fbfcfe;
  font-size: 12px;
}

.goal-bar-band {
  padding: 16px clamp(18px, 4vw, 48px);
  border-bottom: 1px solid var(--line);
  background: #ffffff;
}

.goal-bar-form {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto auto;
  gap: 10px;
  align-items: end;
}

.goal-bar-field {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.goal-bar-field span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.goal-bar-field input {
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.goal-bar-field input:focus {
  outline: 3px solid rgba(8, 127, 140, 0.16);
  border-color: var(--teal);
}

.goal-bar-form button {
  min-height: 44px;
  padding: 0 16px;
  border: 0;
  border-radius: 8px;
  background: var(--ink);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.goal-bar-form button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.goal-bar-status {
  grid-column: 1 / -1;
  min-height: 18px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.goal-bar-result {
  grid-column: 1 / -1;
  display: grid;
  gap: 6px;
}

.goal-bar-row {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid #e1e8f0;
  border-radius: 6px;
  background: #fbfcfe;
  font-size: 12px;
}

.goal-bar-row span {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.ask-band {
  padding: 22px clamp(18px, 4vw, 48px);
  background: #eef5f8;
  border-bottom: 1px solid var(--line);
}

.ask-form {
  display: grid;
  grid-template-columns: minmax(180px, 0.42fr) minmax(260px, 1fr) auto;
  gap: 14px;
  align-items: end;
}

.ask-copy h2 {
  max-width: 340px;
  font-size: clamp(22px, 2.5vw, 34px);
  line-height: 1.05;
}

.ask-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.ask-field span,
.check-row {
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
}

.ask-field textarea {
  width: 100%;
  min-height: 112px;
  resize: vertical;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  line-height: 1.35;
}

.ask-field textarea:focus {
  outline: 3px solid rgba(8, 127, 140, 0.16);
  border-color: var(--teal);
}

.ask-controls {
  display: grid;
  gap: 10px;
  min-width: 148px;
}

.check-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
}

.check-row input {
  width: 18px;
  height: 18px;
  accent-color: var(--teal);
}

.ask-controls button {
  min-height: 44px;
  padding: 0 16px;
  border: 0;
  border-radius: 8px;
  background: var(--ink);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.ask-controls button:disabled {
  cursor: wait;
  opacity: 0.62;
}

.ask-status {
  grid-column: 2;
  min-height: 22px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
}

.ask-result {
  grid-column: 2 / span 2;
  display: grid;
  gap: 6px;
}

.ask-result-row {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid #d7e4ea;
  border-radius: 6px;
  background: #fbfcfe;
  font-size: 12px;
}

.ask-result-row strong {
  color: var(--ink);
}

.ask-result-row span {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.chat-shell {
  min-height: 100vh;
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  max-width: 1180px;
  margin: 0 auto;
  padding-bottom: 20px;
}

.chat-subtitle-wrap {
  border-bottom: 1px solid var(--line);
  background: #fbfcfe;
  color: var(--muted);
  font-size: 13px;
  padding: 0 clamp(18px, 4vw, 48px) 16px;
}

.chat-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 22px clamp(18px, 4vw, 48px);
  background: #fbfcfe;
}

.chat-topbar h1 {
  font-size: 30px;
}

.chat-link {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.chat-link-muted {
  border-color: #e0e7ef;
  color: var(--muted);
}

.visual-workflow {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 10px clamp(18px, 4vw, 48px);
  border-bottom: 1px solid var(--line);
  background: #f6f8fb;
}

.visual-workflow-step,
.visual-workflow-evidence {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  max-width: 100%;
  padding: 4px 9px;
  border: 1px solid #d6e0ec;
  border-radius: 6px;
  background: #ffffff;
  color: #42526a;
  font-size: 11px;
  font-weight: 850;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.visual-workflow-step {
  cursor: pointer;
  font: inherit;
}

.visual-workflow-step:disabled {
  cursor: not-allowed;
  opacity: 0.52;
}

.visual-workflow-step.active {
  border-color: #9cc2d1;
  background: #ecf8fb;
  color: #087083;
}

.visual-workflow-evidence {
  margin-left: auto;
  border-color: #d7dfcb;
  background: #f8fbf1;
  color: #5d6b39;
}

.visual-workflow-preview {
  display: inline-grid;
  grid-template-columns: 74px minmax(0, 150px);
  align-items: center;
  gap: 8px;
  margin: 0 0 0 4px;
  min-width: 0;
}

.visual-workflow-preview[hidden] {
  display: none;
}

.visual-workflow-preview img {
  width: 74px;
  height: 42px;
  border: 1px solid #ccd8e6;
  border-radius: 6px;
  object-fit: cover;
  background: #ffffff;
}

.visual-workflow-preview figcaption {
  color: #617189;
  font-size: 11px;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.control-visual-workflow {
  width: min(100%, 1540px);
  margin: 0 auto 12px;
  padding-left: 32px;
  padding-right: 32px;
  border: 0;
  background: transparent;
}

.control-visual-preview {
  grid-template-columns: 112px minmax(0, 260px);
  padding: 5px;
  border: 1px solid #d6e0ec;
  border-radius: 8px;
  background: #ffffff;
}

.control-visual-preview img {
  width: 112px;
  height: 64px;
}

.control-visual-receipt {
  max-width: 360px;
  max-height: 74px;
  margin: 0;
  padding: 8px;
  border: 1px solid #d6e0ec;
  border-radius: 8px;
  background: #ffffff;
  color: #42526a;
  overflow: auto;
  font-size: 11px;
  line-height: 1.35;
}

.control-visual-receipt[hidden] {
  display: none;
}

.visual-fix-work-item {
  border-color: #d8b46a;
  background: #fff8ed;
}

.visual-fix-button {
  justify-self: start;
  min-height: 28px;
  padding: 0 11px;
  border: 1px solid #d8b46a;
  border-radius: 7px;
  background: #fff7e6;
  color: #7a4a00;
  font-size: 12px;
  font-weight: 850;
}

.visual-fix-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}

.visual-fix-confirm {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #d7dfeb;
  font-size: 11px;
  font-weight: 760;
}

.visual-fix-status {
  color: #d7dfeb;
  font-size: 11px;
  overflow-wrap: anywhere;
}

.chat-layout {
  display: grid;
  grid-template-columns: minmax(240px, 0.32fr) minmax(0, 1fr) minmax(320px, 0.42fr);
  grid-template-areas:
    "quick quick quick"
    "decision decision decision"
    "offline offline offline"
    "history thread evidence"
    "history compose evidence";
  align-items: stretch;
  gap: 12px;
  padding: 14px clamp(18px, 4vw, 48px) 34px;
}

.quick-questions {
  grid-area: quick;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.quick-questions button {
  border: 1px solid #dce5f0;
  border-radius: 8px;
  padding: 7px 12px;
  color: var(--ink);
  background: #f7f9fc;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.artifact-summary {
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid #dbe5ef;
  border-radius: 7px;
  background: #ffffff;
  color: #526174;
  font-size: 12px;
  line-height: 1.35;
}

.artifact-summary-head {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}

.artifact-summary-head strong {
  color: var(--ink);
  font-size: 14px;
}

.artifact-summary-state {
  width: fit-content;
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border: 1px solid #d7e2ed;
  border-radius: 999px;
  background: #f8fafc;
  color: #334155;
  font-size: 11px;
  font-weight: 850;
}

.artifact-summary-state.passed,
.artifact-summary-state.success,
.artifact-summary-state.recorded {
  border-color: #cce4d4;
  background: #f3fbf6;
  color: #286043;
}

.artifact-summary-state.degraded,
.artifact-summary-state.failed,
.artifact-summary-state.browser_timeout {
  border-color: #eadfca;
  background: #fffaf0;
  color: #74511a;
}

.artifact-summary-facts {
  display: grid;
  gap: 4px;
}

.artifact-summary-facts span,
.artifact-summary-action {
  min-width: 0;
  color: #526174;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.artifact-summary-facts strong {
  color: #334155;
}

.artifact-desk-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}

.artifact-desk-actions button {
  min-height: 30px;
  border: 1px solid #cfd9e6;
  border-radius: 7px;
  background: #ffffff;
  color: #334155;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  padding: 4px 9px;
}

.artifact-desk-actions button:hover {
  border-color: #bcd2ff;
  background: #edf3ff;
}

.artifact-desk-actions small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 760;
}

.quick-questions button:hover {
  border-color: #b8c8df;
  background: #eef4ff;
}

.chat-history-panel {
  grid-area: history;
  align-self: start;
  max-height: calc(100vh - 210px);
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfe;
  overflow: auto;
}

.artifact-evidence-desk {
  grid-area: evidence;
  position: sticky;
  top: 14px;
  align-self: start;
  max-height: calc(100vh - 210px);
  display: grid;
  grid-template-rows: auto auto auto auto minmax(0, 1fr);
  gap: 9px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfe;
  overflow: hidden;
}

.artifact-evidence-desk.active {
  border-color: #bdd7ff;
  background: #f8fbff;
}

.artifact-evidence-desk .artifact-hash-preview {
  min-height: 340px;
  max-height: none;
}

.chat-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.chat-history-head strong {
  font-size: 13px;
  font-weight: 850;
}

.chat-history-head button,
.chat-history-filters button,
.chat-history-artifacts button {
  min-height: 28px;
  border: 1px solid #cfd9e6;
  border-radius: 6px;
  background: #ffffff;
  color: #334155;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  padding: 3px 8px;
}

.chat-history-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.chat-history-filters button[aria-pressed="true"] {
  border-color: #bcd2ff;
  background: #edf3ff;
  color: var(--blue);
}

.chat-history-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.chat-history-card {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 9px;
  border: 1px solid #e0e7ef;
  border-radius: 8px;
  background: #ffffff;
}

.chat-history-title {
  width: fit-content;
  max-width: 100%;
  border: 0;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-history-card p {
  min-height: 34px;
  color: #526176;
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.chat-history-chips,
.chat-history-artifacts {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.chat-history-chips span,
.chat-history-empty {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  max-width: 100%;
  padding: 3px 7px;
  border: 1px solid #d8e2ee;
  border-radius: 6px;
  background: #f7f9fc;
  color: #526176;
  font-size: 11px;
  font-weight: 720;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-thread {
  grid-area: thread;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: min(64vh, 620px);
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.chat-message {
  display: grid;
  gap: 6px;
  max-width: min(780px, 86%);
  padding: 8px 12px;
  border: 1px solid #dbe4ef;
  border-radius: 8px;
  background: #f9fbff;
}

.chat-message.user {
  margin-left: auto;
  border-color: #bfd1f7;
  background: #edf3ff;
}

.chat-message.assistant {
  margin-right: auto;
}

.chat-message-body {
  display: grid;
  gap: 8px;
}

.chat-message-body h3 {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.25;
}

.chat-message-body p,
.chat-message-body li {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 14px;
  line-height: 1.42;
  margin: 0;
}

.chat-message-body ul {
  display: grid;
  gap: 3px;
  margin: 0;
  padding-left: 18px;
}

.chat-decision-map {
  grid-area: decision;
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #d7e0ec;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.chat-decision-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.chat-decision-head strong {
  color: var(--ink);
  font-size: 13px;
}

.chat-decision-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.chat-decision-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.chat-decision-node {
  position: relative;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 2px 8px;
  min-height: 60px;
  align-content: center;
  padding: 8px;
  border: 1px solid #dce5f0;
  border-radius: 9px;
  background: #f8fbff;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.chat-decision-node:disabled {
  cursor: default;
}

.chat-decision-node.has-artifact:hover {
  border-color: #9cc2d1;
  background: #eff8fb;
}

.chat-decision-node:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 24px;
  right: -9px;
  z-index: 2;
  width: 10px;
  height: 2px;
  background: rgba(8, 127, 140, 0.42);
}

.chat-decision-node i {
  grid-row: 1 / 4;
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid rgba(8, 127, 140, 0.42);
  border-radius: 999px;
  color: var(--teal);
  font-size: 11px;
  font-style: normal;
  font-weight: 850;
}

.chat-decision-node strong,
.chat-decision-node span,
.chat-decision-node small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-decision-node strong {
  color: var(--ink);
  font-size: 12px;
}

.chat-decision-node span {
  color: var(--teal);
  font-size: 11px;
  font-weight: 850;
}

.chat-decision-node small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.15;
}

.chat-decision-node.waiting,
.chat-decision-node.internal,
.chat-decision-node.speculative,
.chat-decision-node.speculative_only {
  background: #fffaf0;
}

.chat-decision-node.routed,
.chat-decision-node.selected,
.chat-decision-node.available,
.chat-decision-node.passed,
.chat-decision-node.success {
  background: #f3fbf6;
}

.offline-user-panel {
  grid-area: offline;
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 12px;
  border: 1px solid #d9e5ed;
  border-radius: 10px;
  background: #fbfdf9;
}

.offline-user-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.offline-user-head strong {
  color: var(--ink);
  font-size: 13px;
}

.offline-user-head span,
.offline-user-body small,
.offline-user-boundary {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.offline-user-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 7px;
  align-items: stretch;
}

.offline-user-body strong,
.offline-user-boundary {
  min-width: 0;
  overflow-wrap: anywhere;
}

.offline-user-body strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
}

.offline-user-boundary {
  padding: 7px 9px;
  border: 1px solid #dde8d7;
  border-radius: 8px;
  background: #ffffff;
}

.offline-user-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  gap: 6px;
}

.offline-user-actions button {
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #cddfd1;
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
}

.offline-user-review-status {
  align-self: center;
  max-width: 180px;
}

.offline-user-evidence-form {
  margin-top: 4px;
}

.chat-status,
.chat-meta-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.chat-meta-label {
  opacity: 0.88;
}

.chat-meta-detail {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  color: #8391aa;
  font-size: 11px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.chat-runtime-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  min-width: 0;
}

.chat-runtime-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  min-height: 24px;
  padding: 3px 7px;
  border: 1px solid #d8e2ee;
  border-radius: 6px;
  background: #ffffff;
  color: #526176;
  font-size: 11px;
  font-weight: 720;
  line-height: 1.2;
}

.chat-runtime-chip strong,
.chat-runtime-chip span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-runtime-chip strong {
  color: var(--ink);
  font-weight: 850;
}

.chat-runtime-chip.success,
.chat-runtime-chip.available,
.chat-runtime-chip.routed,
.chat-runtime-chip.passed {
  border-color: #cfe4d8;
  background: #f3fbf6;
}

.chat-runtime-chip.not_attempted,
.chat-runtime-chip.speculative_only,
.chat-runtime-chip.speculative {
  border-color: #eadfca;
  background: #fffaf0;
}

.chat-evidence,
.inline-chat-evidence {
  border-top: 1px solid #e2e8f0;
  padding-top: 6px;
}

.chat-evidence summary,
.inline-chat-evidence summary {
  width: fit-content;
  color: #5e6f89;
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
}

.chat-evidence-list,
.inline-chat-artifacts {
  display: grid;
  gap: 5px;
  margin-top: 6px;
}

.chat-evidence-item,
.inline-chat-artifact {
  overflow-wrap: anywhere;
  color: #6f7f97;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  line-height: 1.35;
}

.chat-evidence-item,
.inline-chat-artifact {
  display: grid;
  gap: 5px;
}

.chat-evidence-open,
.inline-chat-open {
  width: fit-content;
  min-height: 26px;
  border: 1px solid #cfd9e6;
  border-radius: 6px;
  background: #fff;
  color: #334155;
  cursor: pointer;
  font: inherit;
  font-family: inherit;
  font-size: 11px;
  font-weight: 800;
  padding: 3px 8px;
}

.chat-artifact-preview,
.inline-chat-preview {
  max-height: 220px;
  overflow: auto;
  margin: 0;
  padding: 8px;
  border: 1px solid #d9e1ec;
  border-radius: 6px;
  background: #f8fafc;
  color: #263449;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 11px;
  line-height: 1.35;
}

.chat-empty {
  margin: auto;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
}

.chat-compose {
  grid-area: compose;
  display: grid;
  gap: 8px;
}

.chat-compose textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.chat-compose textarea {
  min-height: 74px;
  max-height: 170px;
  resize: vertical;
  padding: 12px;
  line-height: 1.35;
}

.chat-compose-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.chat-compose button {
  min-height: 42px;
  min-width: 98px;
  border: 0;
  border-radius: 8px;
  background: var(--ink);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.chat-materialize-contract {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.chat-materialize-contract input {
  width: 104px;
  min-height: 28px;
  padding: 0 8px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  font: inherit;
  font-size: 11px;
  font-weight: 800;
}

@media (max-width: 980px) {
  .chat-layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "quick"
      "decision"
      "offline"
      "thread"
      "compose"
      "evidence"
      "history";
  }

  .chat-decision-flow {
    grid-template-columns: minmax(0, 1fr);
  }

  .chat-decision-node {
    grid-template-columns: 24px minmax(72px, auto) minmax(0, 1fr);
    min-height: 44px;
    align-items: center;
  }

  .chat-decision-node:not(:last-child)::after {
    top: auto;
    right: auto;
    bottom: -8px;
    left: 19px;
    width: 2px;
    height: 8px;
  }

  .chat-decision-node i {
    grid-row: auto;
  }

  .offline-user-body {
    grid-template-columns: minmax(0, 1fr);
  }

  .offline-user-actions {
    justify-content: start;
  }

  .chat-history-panel,
  .artifact-evidence-desk {
    max-height: none;
  }

  .artifact-evidence-desk {
    position: static;
  }
}

@media (max-width: 640px) {
  .visual-workflow {
    flex-wrap: wrap;
  }

  .visual-workflow-evidence {
    margin-left: 0;
  }

  .chat-compose-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .chat-thread {
    min-height: 42vh;
  }
}

.simple-mode .map-band,
.simple-mode .workgrid,
.simple-mode .status-strip {
  display: none;
}

.simple-mode #runtime-band,
.simple-mode #workbench-band,
.simple-mode .execution-lens-band,
.simple-mode .hive-tui-band,
.simple-mode .session-band,
.simple-mode .promotion-band,
.simple-mode .capability-router-band,
.simple-mode .memory-library-band,
.simple-mode .memory-draft-band,
.simple-mode .friction-radar-band,
.simple-mode .os-observatory-band,
.simple-mode .genesis-lens-band,
.simple-mode .agent-work-band,
.simple-mode .goal-bar-band,
.simple-mode .ask-band {
  display: none;
}

.panel {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.span-2 {
  grid-column: span 2;
}

.span-3 {
  grid-column: span 3;
}

.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.panel-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.flow-list,
.meter-list,
.repo-list,
.route-lanes,
.stop-list,
.dispatch-table,
.live-events {
  display: grid;
  gap: 8px;
}

.flow-row,
.repo-row,
.stop-row,
.dispatch-row,
.route-row,
.live-event {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid #e3e8ef;
  border-radius: 6px;
  background: #fbfcfe;
}

.flow-row {
  grid-template-columns: 92px minmax(0, 1fr) minmax(136px, 0.7fr);
  align-items: center;
}

.flow-row.contract-weak {
  border-color: #d97706;
  background: #fff8ed;
}

.contract-quality {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.contract-review-action {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.contract-review-confirm {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 760;
}

.contract-supersede-button {
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid #d8b46a;
  border-radius: 6px;
  background: #fff7e6;
  color: #7a4a00;
  font-size: 11px;
  font-weight: 840;
}

.contract-review-status {
  color: var(--muted);
  font-size: 11px;
}

.visual-focus-mode {
  background: #eef3f8;
}

.visual-focus-mode .shell > :not(.visual-focus-harness) {
  display: none !important;
}

.visual-focus-harness {
  width: min(1180px, calc(100vw - 48px));
  margin: 32px auto;
  padding: 18px;
  border: 1px solid #cad7e6;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.12);
}

.visual-focus-harness > h2 {
  margin-bottom: 12px;
  font-size: 24px;
}

.visual-focus-harness .panel,
.visual-focus-harness section {
  margin: 0;
  width: 100%;
  box-shadow: none;
}

.repo-row {
  grid-template-columns: 1fr auto;
  align-items: center;
}

.dispatch-row {
  grid-template-columns: 128px 1fr 92px 130px;
  align-items: center;
}

.route-row strong,
.flow-row strong,
.repo-row strong,
.dispatch-row strong,
.live-event strong {
  overflow-wrap: anywhere;
  font-size: 13px;
}

.small,
.flow-row span,
.repo-row span,
.dispatch-row span,
.stop-row span,
.route-row span,
.live-event span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.meter {
  display: grid;
  grid-template-columns: 100px 1fr 36px;
  align-items: center;
  gap: 9px;
}

.bar {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: #e7edf4;
}

.bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--teal);
}

@media (max-width: 980px) {
  .topbar {
    align-items: start;
    flex-direction: column;
  }

  .status-strip {
    justify-content: flex-start;
  }

  .top-actions {
    justify-items: start;
  }

  .loop-map,
  .workgrid,
  .simple-dashboard,
  .runtime-grid,
  .session-form,
  .session-role-grid,
  .agent-role-grid,
  .artifact-lane,
  .ask-form {
    grid-template-columns: 1fr;
  }

  .span-2,
  .span-3,
  .session-status,
  .session-result,
  .ask-status,
  .ask-result {
    grid-column: auto;
  }

  .flow-row,
  .dispatch-row,
  .session-summary,
  .session-envelope,
  .session-promotion,
  .promotion-result-row,
  .timeline-row,
  .ask-result-row,
  .chat-actions {
    grid-template-columns: 1fr;
  }

  .goal-subtitle {
    max-width: 100%;
  }

  .agent-work-head {
    align-items: start;
    flex-direction: column;
  }
}

/* ASC-0147 end-user visual target: sidebar + work console. */
body {
  background:
    radial-gradient(circle at top left, rgba(47, 95, 187, 0.08), transparent 28%),
    linear-gradient(180deg, #fbfdff 0%, #f5f8fc 48%, #eef3f8 100%);
}

.app-frame {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 224px minmax(0, 1fr);
}

.side-rail {
  position: sticky;
  top: 0;
  min-width: 0;
  height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 18px;
  padding: 24px 14px;
  border-right: 1px solid rgba(203, 213, 225, 0.72);
  background: rgba(250, 252, 255, 0.9);
  backdrop-filter: blur(14px);
}

.brand-block {
  position: relative;
  display: grid;
  gap: 4px;
  padding: 0 8px 0 44px;
}

.brand-block::before {
  content: "AI";
  position: absolute;
  left: 8px;
  top: 0;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #1959c8;
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
}

.brand-block strong {
  color: #101828;
  font-size: 26px;
  line-height: 1;
}

.brand-block span {
  color: #334155;
  font-size: 15px;
  font-weight: 650;
}

.brand-block small,
.side-goal small {
  color: #667085;
  font-size: 12px;
}

.side-nav {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 4px;
}

.side-nav a {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 11px;
  border: 1px solid transparent;
  border-radius: 9px;
  color: #1f2937;
  font-size: 13px;
  font-weight: 720;
  text-decoration: none;
}

.side-nav a.active,
.side-nav a:hover {
  border-color: #cfe0ff;
  background: #eef5ff;
  color: #175cd3;
}

.side-goal {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid #dfe5ee;
  border-radius: 8px;
  background: #ffffff;
}

.side-goal span {
  color: #101828;
  font-size: 13px;
  font-weight: 800;
}

.side-goal strong {
  color: #1f2937;
  font-size: 13px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.shell {
  min-width: 0;
  background: transparent;
}

.topbar {
  align-items: center;
  padding: 20px 28px 10px;
  border-bottom: 0;
  background: transparent;
}

.topbar h1 {
  font-size: 17px;
  font-weight: 840;
}

.topbar .eyebrow {
  margin-bottom: 8px;
  color: #101828;
}

.goal-subtitle {
  max-width: 780px;
  margin-top: 7px;
  font-size: 13px;
  font-weight: 650;
}

.top-actions {
  grid-template-columns: auto;
  justify-items: end;
}

.status-strip {
  max-width: 920px;
  gap: 8px;
}

.pill {
  min-height: 28px;
  border-color: #d9e1ec;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.03);
}

.mode-toggle {
  border-radius: 8px;
}

.session-band,
.runtime-band,
.agent-work-band,
.promotion-band,
.goal-bar-band,
.ask-band,
.map-band,
.workgrid {
  width: min(100%, 1540px);
  margin: 0 auto;
  padding-left: 28px;
  padding-right: 28px;
}

.session-band {
  padding-top: 0;
  padding-bottom: 14px;
  border-bottom: 0;
  background: transparent;
}

.runtime-band {
  display: grid;
  gap: 0;
  padding-top: 0;
  padding-bottom: 14px;
}

.runtime-head,
.runtime-grid {
  border: 1px solid #dfe5ee;
  background: #ffffff;
}

.runtime-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px 0;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}

.runtime-head h2 {
  font-size: 21px;
}

.runtime-head > span {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid #d9e1ec;
  border-radius: 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.runtime-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 18px 18px;
  border-top: 0;
  border-radius: 0 0 8px 8px;
}

.runtime-card {
  min-width: 0;
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 9px;
  min-height: 120px;
  padding: 12px;
  border: 1px solid #dfe6ee;
  border-top: 4px solid var(--blue);
  border-radius: 8px;
  background: #fcfdff;
}

.runtime-card.running,
.runtime-card.installed {
  border-top-color: var(--green);
}

.runtime-card.held {
  border-top-color: var(--amber);
}

.runtime-card.readiness-blocker-card {
  grid-column: span 2;
}

.runtime-card.missing {
  border-top-color: var(--red);
}

.runtime-card strong {
  font-size: 16px;
  line-height: 1.2;
}

.runtime-card span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.34;
  overflow-wrap: anywhere;
}

.readiness-blocker-list {
  display: grid;
  gap: 7px;
}

.readiness-blocker-row {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(86px, 0.28fr) minmax(0, 1fr);
  gap: 7px 9px;
  align-items: start;
  padding: 8px;
  border: 1px solid #e2e8f1;
  border-left: 4px solid var(--amber);
  border-radius: 7px;
  background: #fffdf7;
}

.readiness-blocker-row.info {
  border-left-color: var(--blue);
  background: #f7fbff;
}

.readiness-blocker-row.high,
.readiness-blocker-row.failed {
  border-left-color: var(--red);
  background: #fff8f8;
}

.readiness-blocker-row .pill {
  min-height: 24px;
  padding: 3px 7px;
  font-size: 11px;
}

.readiness-blocker-row strong {
  font-size: 12px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.readiness-blocker-row span,
.readiness-blocker-row small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.32;
  overflow-wrap: anywhere;
}

.readiness-blocker-row small {
  grid-column: 2 / -1;
  color: #475569;
}

.runtime-command-row {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.runtime-command-row code {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid #d9e1ec;
  border-radius: 7px;
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
  font-weight: 760;
}

.runtime-probe-button {
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #0f172a;
  color: #ffffff;
  font-size: 12px;
  font-weight: 760;
  cursor: pointer;
}

.runtime-probe-button:disabled {
  cursor: progress;
  opacity: 0.64;
}

.runtime-probe-status {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  color: var(--muted);
  font-size: 12px;
  font-weight: 720;
}

.runtime-eval-report {
  flex-basis: 100%;
}

.runtime-eval-reason {
  display: block;
  margin: 2px 0 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.runtime-candidate-list {
  display: grid;
  gap: 4px;
  margin-top: 4px;
}

.runtime-eval-open {
  margin-top: 4px;
}

.session-form {
  grid-template-columns: 1fr auto;
  gap: 10px 12px;
  align-items: center;
  padding: 22px;
  border: 1px solid #dfe5ee;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.05);
}

.session-copy {
  grid-column: 1 / -1;
}

.session-copy h2 {
  max-width: none;
  font-size: 21px;
}

.session-field {
  gap: 7px;
}

.session-field textarea {
  min-height: 64px;
  height: 64px;
  resize: none;
  border-color: #1d5fd6;
  box-shadow: 0 0 0 2px rgba(29, 95, 214, 0.13);
}

.session-contract {
  display: none;
}

.session-controls {
  align-self: end;
}

.session-controls button {
  min-width: 96px;
  background: #1d5fd6;
}

.session-status {
  grid-column: 1 / -1;
}

.session-result {
  grid-column: 1 / -1;
}

.agent-work-band {
  gap: 14px;
  padding-top: 0;
  padding-bottom: 14px;
  border-bottom: 0;
  background: transparent;
}

.conversation-band {
  width: min(100%, 1540px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.58fr);
  align-items: start;
  gap: 10px 14px;
  margin: 0 auto;
  padding: 0 28px 18px;
}

.command-chat-column {
  min-width: 0;
  display: grid;
  gap: 0;
}

.friction-radar-band,
.os-observatory-band,
.genesis-lens-band,
.execution-lens-band,
.capability-router-band,
.memory-library-band,
.memory-draft-band,
.promotion-band {
  width: min(100%, 1540px);
  display: grid;
  gap: 0;
  margin: 0 auto;
  padding: 0 28px 14px;
}

.friction-radar-head,
.friction-grid,
.os-observatory-head,
.os-orbit,
.os-lane-grid,
.genesis-lens-head,
.genesis-cycle-grid,
.genesis-branch-grid,
.execution-lens-head,
.execution-lens-grid,
.capability-router-head,
.capability-router-grid,
.memory-library-head,
.memory-library-grid,
.memory-draft-head,
.memory-draft-grid,
.promotion-head,
.promotion-queue-grid {
  border: 1px solid #dfe5ee;
  background: #ffffff;
}

.friction-radar-head,
.os-observatory-head,
.genesis-lens-head,
.execution-lens-head,
.capability-router-head,
.memory-library-head,
.memory-draft-head,
.promotion-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px 0;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}

.friction-radar-head h2,
.os-observatory-head h2,
.genesis-lens-head h2,
.execution-lens-head h2,
.capability-router-head h2,
.memory-library-head h2,
.memory-draft-head h2,
.promotion-head h2 {
  font-size: 21px;
}

.friction-radar-head > span,
.os-observatory-head > span,
.genesis-lens-head > span,
.execution-lens-head > span,
.capability-router-head > span,
.memory-library-head > span,
.memory-draft-head > span,
.promotion-head > span {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid #d9e1ec;
  border-radius: 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.os-orbit {
  display: grid;
  grid-template-columns: minmax(180px, 0.8fr) repeat(5, minmax(0, 1fr));
  gap: 10px;
  padding: 14px 18px;
  border-top: 0;
  border-bottom: 0;
}

.os-orbit-center,
.os-orbit-node {
  min-width: 0;
  display: grid;
  gap: 6px;
  min-height: 108px;
  padding: 12px;
  border: 1px solid #dfe6ee;
  border-radius: 8px;
  background: #fbfcfe;
}

.os-orbit-center {
  border-color: #bed1f5;
  background: #f0f6ff;
}

.execution-lens-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 18px 18px;
  border-top: 0;
  border-radius: 0 0 8px 8px;
}

.execution-lens-card {
  min-width: 0;
  display: grid;
  gap: 8px;
  min-height: 118px;
  padding: 12px;
  border: 1px solid #dfe6ee;
  border-top: 4px solid var(--blue);
  border-radius: 8px;
  background: #fcfdff;
}

.execution-lens-card-title {
  font-size: 11px;
  text-transform: uppercase;
}

.execution-lens-card-value {
  color: var(--ink);
  font-size: 15px;
  line-height: 1.27;
  overflow-wrap: anywhere;
}

.execution-lens-card-detail {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.hive-tui-band {
  width: min(100%, 1540px);
  display: grid;
  gap: 0;
  margin: 0 auto;
  padding: 0 28px 14px;
}

.hive-tui-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px 0;
  border: 1px solid #dfe5ee;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: #ffffff;
}

.hive-tui-head h2 {
  font-size: 21px;
}

.hive-tui-head > span {
  min-width: 0;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid #d9e1ec;
  border-radius: 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.hive-board-overview {
  display: grid;
  gap: 6px;
  padding: 12px 18px;
  border: 1px solid #dfe5ee;
  border-top: 0;
  border-bottom: 0;
  background: #ffffff;
}

.hive-board-overview-title {
  margin: 0;
  font-size: 16px;
  line-height: 1.25;
  font-weight: 760;
  overflow-wrap: anywhere;
}

.hive-board-overview-meta,
.hive-board-overview-task,
.hive-board-overview-note {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.34;
  overflow-wrap: anywhere;
}

.hive-board-lane {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 0 18px 18px;
  border: 1px solid #dfe5ee;
  border-top: 0;
  border-radius: 0 0 8px 8px;
  background: #ffffff;
}

.hive-board-card {
  min-width: 0;
}

.hive-board-card h3 {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.2;
}

.hive-board-list {
  display: grid;
  gap: 8px;
}

.hive-board-item {
  display: grid;
  gap: 4px;
  min-height: 52px;
  padding: 9px 10px;
  border: 1px solid #dfe6ee;
  border-left: 5px solid #c9d5e2;
  border-radius: 7px;
  background: #fcfdff;
}

.hive-board-item strong {
  font-size: 13px;
  line-height: 1.2;
}

.hive-board-item span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.34;
  overflow-wrap: anywhere;
}

.hive-board-item.status-done {
  border-left-color: var(--green);
}

.hive-board-item.status-pending {
  border-left-color: var(--amber);
}

.hive-board-item.status-empty {
  border-left-color: var(--blue);
}

.hive-board-item.status-initial {
  border-left-color: var(--teal);
}

.hive-board-item.status-missing,
.hive-board-item.status-failed {
  border-left-color: var(--red);
}

.execution-detail {
  margin-top: 2px;
  padding: 8px;
  border: 1px solid #e2e8f1;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  white-space: pre-wrap;
}

.os-orbit-center span,
.os-orbit-node span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 820;
  text-transform: uppercase;
}

.os-orbit-center strong,
.os-orbit-node strong {
  font-size: 16px;
  line-height: 1.24;
}

.os-orbit-center small,
.os-orbit-node small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.32;
  overflow-wrap: anywhere;
}

.os-lane-grid {
  display: grid;
  grid-template-columns: 1.25fr 1fr 1fr 1fr 1fr;
  gap: 12px;
  padding: 14px 18px 18px;
  border-top: 0;
  border-radius: 0 0 8px 8px;
}

.os-lane-card {
  min-width: 0;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 10px;
  min-height: 238px;
  padding: 12px;
  border: 1px solid #dfe6ee;
  border-top: 4px solid var(--blue);
  border-radius: 8px;
  background: #fcfdff;
}

.os-lane-card.memory {
  border-top-color: var(--green);
}

.os-lane-card.capability {
  border-top-color: var(--violet);
}

.os-lane-card.genesis {
  border-top-color: var(--teal);
}

.os-lane-card.hive {
  border-top-color: var(--blue);
}

.os-lane-card.myworld {
  border-top-color: var(--amber);
}

.os-lane-card-head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.os-lane-card-head > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 760;
}

.os-lane-headline {
  font-size: 14px;
  line-height: 1.32;
  overflow-wrap: anywhere;
}

.os-metric-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.os-signal {
  display: grid;
  gap: 6px;
  padding: 9px;
  border: 1px solid #dfe6ee;
  border-radius: 7px;
  background: #ffffff;
}

.os-signal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.os-signal-head span {
  color: #334155;
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.os-signal-head strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1;
}

.os-signal-track {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8edf5;
}

.os-signal-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--teal), var(--blue));
}

.os-signal small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.32;
  overflow-wrap: anywhere;
}

.os-metric {
  min-width: 0;
  display: grid;
  gap: 3px;
  min-height: 54px;
  padding: 8px;
  border: 1px solid #e2e8f1;
  border-radius: 7px;
  background: #ffffff;
}

.os-metric strong {
  font-size: 16px;
  line-height: 1.1;
}

.os-metric span,
.os-lane-detail {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.34;
  overflow-wrap: anywhere;
}

.os-lane-detail {
  margin: 0;
}

.friction-grid,
.genesis-cycle-grid,
.genesis-branch-grid,
.capability-router-grid,
.memory-library-grid,
.memory-draft-grid,
.promotion-queue-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 18px 18px;
  border-top: 0;
  border-radius: 0 0 8px 8px;
}

.genesis-branch-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.genesis-cycle-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-bottom: 0;
  border-radius: 0;
}

.promotion-queue-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.memory-draft-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.memory-library-grid {
  grid-template-columns: 0.92fr 1.18fr 1.35fr;
  align-items: start;
}

.capability-router-grid {
  grid-template-columns: 0.85fr 0.85fr 1.25fr;
  align-items: start;
}

.friction-card,
.genesis-cycle-card,
.genesis-branch,
.capability-router-card,
.memory-library-card,
.memory-draft-card,
.promotion-queue-card {
  display: grid;
  grid-template-rows: auto auto auto 1fr auto;
  gap: 8px;
  min-height: 198px;
  padding: 12px;
  border: 1px solid #dfe6ee;
  border-top: 4px solid var(--violet);
  border-radius: 8px;
  background: #fcfdff;
}

.friction-card {
  min-height: 142px;
  border-top-color: var(--amber);
}

.genesis-cycle-card {
  min-height: 128px;
  border-top-color: var(--violet);
}

.genesis-cycle-card.attention {
  border-top-color: var(--amber);
}

.genesis-cycle-card.active {
  border-top-color: var(--teal);
}

.genesis-cycle-card.held {
  border-top-color: var(--blue);
}

.promotion-queue-card {
  min-height: 210px;
  border-top-color: var(--teal);
}

.memory-draft-card {
  min-height: 238px;
  border-top-color: var(--green);
}

.memory-library-card {
  grid-template-rows: none;
  align-content: start;
  min-height: 186px;
  border-top-color: var(--blue);
}

.memory-library-card.map {
  min-height: 320px;
}

.capability-router-card {
  grid-template-rows: none;
  align-content: start;
  min-height: 206px;
  border-top-color: var(--teal);
}

.capability-router-card.summary {
  border-top-color: var(--blue);
}

.capability-router-card.route-board {
  grid-column: span 2;
  border-top-color: var(--violet);
}

.capability-router-card.route-map {
  grid-column: span 2;
  border-top-color: var(--teal);
}

.capability-router-card.attention {
  border-top-color: var(--amber);
}

.capability-router-card.source-cockpit {
  grid-column: span 2;
  border-top-color: var(--green);
}

.capability-router-card.provider-board {
  border-top-color: var(--blue);
}

.capability-router-card.web-policy {
  grid-column: 1 / -1;
  border-top-color: var(--amber);
}

.capability-router-card.empty {
  min-height: 120px;
  border-top-color: var(--amber);
}

.memory-library-card.summary {
  border-top-color: var(--green);
}

.memory-library-card.user-board,
.capability-router-card.user-board,
.genesis-cycle-card.user-board {
  grid-column: 1 / -1;
  min-height: 172px;
  border-top-color: var(--blue);
  background:
    linear-gradient(135deg, rgba(36, 95, 199, 0.08), transparent 38%),
    #ffffff;
}

.capability-router-card.user-board {
  border-top-color: var(--teal);
  background:
    linear-gradient(135deg, rgba(8, 127, 140, 0.08), transparent 38%),
    #ffffff;
}

.genesis-cycle-card.user-board {
  border-top-color: var(--violet);
  background:
    linear-gradient(135deg, rgba(138, 63, 252, 0.08), transparent 38%),
    #ffffff;
}

.os-product-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.os-product-metrics .os-metric {
  min-height: 66px;
}

.os-product-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.os-product-actions .aios-inline-action {
  width: fit-content;
}

.memory-library-card.graph {
  border-top-color: var(--teal);
}

.memory-library-card.graph-control {
  border-top-color: var(--amber);
  background:
    linear-gradient(145deg, rgba(255, 207, 94, 0.12), rgba(255, 255, 255, 0.03)),
    rgba(11, 14, 23, 0.84);
}

.memory-library-card.retrieval-board {
  grid-column: span 2;
  border-top-color: var(--violet);
}

.memory-library-card.empty {
  min-height: 120px;
  border-top-color: var(--amber);
}

.memory-draft-card.genesis_friction_signal {
  border-top-color: var(--teal);
}

.promotion-queue-card.empty {
  min-height: 120px;
  border-top-color: var(--amber);
}

.memory-draft-card.empty {
  min-height: 120px;
  border-top-color: var(--amber);
}

.promotion-queue-rows {
  display: grid;
  gap: 6px;
}

.promotion-queue-row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 8px;
  padding-top: 6px;
  border-top: 1px solid #e5ebf3;
}

.promotion-queue-row strong {
  color: #334155;
  font-size: 12px;
}

.promotion-queue-row span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.34;
  overflow-wrap: anywhere;
}

.promotion-next-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.promotion-quality {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid #d7e5d4;
  border-radius: 8px;
  background: #f4fbf3;
}

.promotion-quality span,
.promotion-quality small,
.promotion-materialize-held {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.promotion-quality.mitigated_by_visual_focus,
.promotion-quality.solved_by_later_receipt {
  border-color: #b9dac2;
  background: #effaf2;
}

.promotion-materialize-held {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 28px;
  padding: 5px 9px;
  border: 1px solid #d7e5d4;
  border-radius: 7px;
  background: #f4fbf3;
  font-weight: 800;
}

.promotion-materialize {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.promotion-materialize input {
  width: 108px;
  min-height: 32px;
  padding: 0 9px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.promotion-materialize-button,
.promotion-contract-open {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.promotion-materialize-button:disabled {
  cursor: default;
  color: var(--muted);
  background: #f3f6fa;
}

.promotion-materialize-status {
  min-width: 0;
  overflow-wrap: anywhere;
}

.friction-card.info {
  border-top-color: var(--blue);
}

.friction-card.medium,
.friction-card.attention {
  border-top-color: var(--amber);
}

.friction-card.high,
.friction-card.failed {
  border-top-color: var(--red);
}

.genesis-branch.alien_domain {
  border-top-color: var(--green);
}

.genesis-branch.failure_as_feature {
  border-top-color: var(--amber);
}

.genesis-branch.constraint_removal {
  border-top-color: var(--blue);
}

.genesis-branch.anti_user_prompt {
  border-top-color: var(--teal);
}

.friction-card strong,
.genesis-cycle-card strong,
.genesis-branch strong,
.capability-router-card > strong,
.memory-library-card > strong,
.memory-draft-card > strong,
.promotion-queue-card > strong {
  font-size: 14px;
  line-height: 1.32;
}

.friction-card span,
.friction-card small,
.genesis-cycle-card span,
.capability-router-card span,
.capability-router-card small,
.memory-library-card span,
.memory-library-card small,
.memory-draft-card span,
.memory-draft-card small,
.promotion-queue-card small,
.genesis-branch span,
.genesis-branch p,
.genesis-branch small,
.genesis-empty {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.friction-contract-list,
.friction-dispatch-list,
.friction-entry-list,
.friction-persona-list,
.friction-action-row {
  display: grid;
  gap: 7px;
}

.friction-contract-row,
.friction-dispatch-row {
  display: grid;
  gap: 5px;
  padding: 9px;
  border: 1px solid #dce7f3;
  border-radius: 8px;
  background: #f8fbff;
}

.friction-contract-row > strong,
.friction-dispatch-row > strong {
  font-size: 13px;
}

.friction-entry-list code {
  padding: 6px 8px;
  border: 1px solid #dce7f3;
  border-radius: 6px;
  background: #f8fbff;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.friction-action-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.friction-open-contract,
.friction-break-frame,
.friction-propose-contract {
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #cdd9e8;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 820;
}

.friction-break-frame {
  border-color: #d8c7ff;
  background: #f5f0ff;
  color: #5a28a8;
}

.friction-propose-contract {
  border-color: #b9d8c7;
  background: #effaf4;
  color: #176846;
}

.friction-propose-contract:disabled {
  cursor: default;
  opacity: 0.62;
}

.friction-propose-status {
  color: var(--muted);
  font-size: 11px;
  font-weight: 760;
}

.friction-materialization-result {
  display: grid;
  gap: 7px;
  margin-top: 7px;
  padding: 8px;
  border: 1px solid #cde9d8;
  border-radius: 8px;
  background: #f4fcf7;
}

.friction-open-contract {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.friction-open-contract .artifact-authority-badge {
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.friction-open-contract .artifact-open-actions {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 5px;
}

.friction-open-contract .artifact-open,
.friction-open-contract .artifact-copy {
  min-height: 28px;
  padding: 0 8px;
  font-size: 11px;
}

.friction-open-contract .artifact-copy-status,
.friction-open-contract .artifact-open-preview:empty {
  display: none;
}

.friction-persona-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.friction-persona-list span {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 4px 7px;
  border: 1px solid #e2d8ff;
  border-radius: 999px;
  background: #faf7ff;
  color: #6c3ac6;
  font-size: 11px;
  font-weight: 820;
}

.capability-router-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.capability-router-meter,
.capability-route-score {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8edf5;
}

.capability-router-meter i,
.capability-route-score i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--teal), var(--blue));
}

.capability-router-card.attention .capability-router-meter i {
  background: linear-gradient(90deg, var(--amber), var(--red));
}

.capability-route-row,
.capability-provider-row,
.capability-policy-row {
  display: grid;
  gap: 5px;
  padding-top: 8px;
  border-top: 1px solid #e5ebf3;
}

.capability-route-row strong,
.capability-provider-row strong,
.capability-policy-row strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.capability-route-map {
  position: relative;
  min-height: 230px;
  overflow: hidden;
  border: 1px solid #dfe6ee;
  border-radius: 10px;
  background:
    linear-gradient(90deg, rgba(203, 213, 225, 0.26) 1px, transparent 1px),
    linear-gradient(180deg, rgba(203, 213, 225, 0.24) 1px, transparent 1px),
    #f8fbff;
  background-size: 28px 28px;
}

.capability-route-node {
  position: absolute;
  z-index: 2;
  display: grid;
  gap: 2px;
  width: 150px;
  min-height: 42px;
  padding: 6px 7px;
  transform: translate(-50%, -50%);
  overflow: hidden;
  border: 1px solid #cdd9e8;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.capability-route-node strong,
.capability-route-node span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.capability-route-node strong {
  color: var(--ink);
  font-size: 11px;
}

.capability-route-node span {
  color: var(--muted);
  font-size: 10px;
}

.capability-route-node.route {
  border-color: #9dc5ff;
  background: #f4f9ff;
}

.capability-route-node.fallback {
  border-color: #c7b7ff;
  background: #f8f5ff;
}

.capability-route-node.evidence {
  border-color: #a8dbc2;
  background: #f6fcf8;
}

.capability-route-node.gap,
.capability-route-node.attention {
  border-color: #f2c48f;
  background: #fff8ed;
}

.capability-route-node.provider {
  border-color: #b8d2f3;
  background: #f7fbff;
}

.capability-route-edge {
  position: absolute;
  z-index: 1;
  height: 2px;
  transform-origin: left center;
  background: rgba(47, 95, 187, 0.24);
}

.capability-route-edge.fallback {
  background: rgba(127, 104, 255, 0.34);
}

.capability-route-edge.evidence {
  background: rgba(32, 178, 170, 0.36);
}

.capability-route-edge.blocked_by {
  background: rgba(239, 68, 68, 0.35);
}

.capability-route-map-empty {
  display: block;
  padding: 16px;
  color: var(--muted);
  font-size: 12px;
}

.capability-gap-actions,
.capability-source-grid {
  display: grid;
  gap: 7px;
}

.capability-gap-row {
  display: grid;
  gap: 4px;
  padding-top: 7px;
  border-top: 1px solid #e5ebf3;
}

.capability-gap-row strong {
  color: #5f4b10;
  font-size: 12px;
}

.capability-gap-row.sample strong {
  color: var(--red);
}

.capability-source-chip {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid #dfe6ee;
  border-radius: 8px;
  background: #ffffff;
}

.capability-source-chip.local-os,
.capability-source-chip.provider-llm,
.capability-source-chip.skill-plugin {
  border-color: #b9dac8;
  background: #f6fcf8;
}

.capability-source-chip.web,
.capability-source-chip.api,
.capability-source-chip.mcp {
  border-color: #f1d49b;
  background: #fffaf0;
}

.capability-source-chip strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
}

.capability-policy-row.permission {
  border-color: #ead2c8;
}

.capability-route-open {
  width: fit-content;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.aios-inline-action {
  width: fit-content;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.aios-inline-action:hover {
  border-color: #9bb4d5;
  background: #f6faff;
}

.memory-library-strip,
.memory-library-metrics {
  display: grid;
  gap: 7px;
}

.memory-library-strip {
  display: flex;
  flex-wrap: wrap;
}

.memory-library-strip span {
  flex: 1 1 88px;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  border: 1px solid #dfe6ee;
  border-radius: 7px;
  background: #ffffff;
  color: #334155;
  font-size: 11px;
  font-weight: 800;
}

.memory-library-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.memory-graph-map {
  position: relative;
  min-height: 148px;
  overflow: hidden;
  border: 1px solid #dfe6ee;
  border-radius: 10px;
  background:
    linear-gradient(90deg, rgba(203, 213, 225, 0.32) 1px, transparent 1px),
    linear-gradient(180deg, rgba(203, 213, 225, 0.32) 1px, transparent 1px),
    #f8fbff;
  background-size: 28px 28px;
}

.memory-graph-node {
  position: absolute;
  z-index: 2;
  width: 11px;
  height: 11px;
  border: 2px solid #ffffff;
  border-radius: 999px;
  background: var(--blue);
  box-shadow: 0 2px 7px rgba(15, 23, 42, 0.18);
}

.memory-graph-node.accepted {
  background: var(--green);
}

.memory-graph-node.draft {
  background: var(--amber);
}

.memory-graph-node.source {
  background: var(--teal);
}

.memory-graph-edge {
  position: absolute;
  z-index: 1;
  height: 1px;
  transform-origin: left center;
  background: rgba(47, 95, 187, 0.24);
}

.memory-library-meter {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8edf5;
}

.memory-library-meter i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--blue), var(--green));
}

.memory-library-signal {
  display: grid;
  grid-template-columns: minmax(64px, auto) minmax(0, 1fr);
  gap: 8px;
  align-items: baseline;
  padding-top: 6px;
  border-top: 1px solid #e5ebf3;
}

.memory-library-signal strong {
  color: var(--ink);
  font-size: 15px;
}

.memory-trace-box {
  display: grid;
  gap: 6px;
  padding: 9px;
  border: 1px solid #dfe6ee;
  border-radius: 8px;
  background: #ffffff;
}

.memory-trace-box strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.memory-trace-box span {
  max-height: 72px;
  overflow: hidden;
}

.memory-trace-open {
  width: fit-content;
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #fbfcfe;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.memory-retrieval-row {
  display: grid;
  gap: 7px;
  padding-top: 8px;
  border-top: 1px solid #e5ebf3;
}

.memory-retrieval-row > strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.memory-selected-card {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid #dfe6ee;
  border-radius: 8px;
  background: #ffffff;
}

.memory-selected-card strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.memory-selected-card span {
  display: -webkit-box;
  max-height: 50px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.memory-selected-source {
  display: block;
  overflow: hidden;
  color: #526174;
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.memory-selected-empty {
  padding: 8px;
  border: 1px dashed #cbd8e7;
  border-radius: 8px;
  background: #f8fbff;
}

.memory-draft-ref {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.memory-draft-review-reason,
.memory-draft-next-evidence {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.memory-draft-next-evidence {
  padding: 8px;
  border: 1px solid #dbe5ef;
  border-left: 3px solid var(--amber);
  border-radius: 7px;
  background: #fffdf7;
  color: #5f4b10;
}

.memory-draft-evidence-summary {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.memory-draft-evidence-form {
  display: grid;
  gap: 6px;
}

.memory-draft-evidence-form textarea,
.memory-draft-evidence-form input {
  width: 100%;
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  resize: vertical;
}

.memory-draft-evidence-button,
.memory-draft-evidence-open {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.memory-draft-evidence-button:disabled {
  cursor: default;
  color: var(--muted);
  background: #f3f6fa;
}

.memory-draft-evidence-status {
  color: var(--muted);
  font-size: 12px;
  overflow-wrap: anywhere;
}

.memory-draft-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.memory-draft-review {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #ffffff;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.memory-draft-review:disabled {
  cursor: default;
  color: var(--muted);
  background: #f3f6fa;
}

.memory-draft-review-status {
  color: var(--muted);
  font-size: 12px;
  overflow-wrap: anywhere;
}

.genesis-branch p {
  margin: 0;
}

.branch-break {
  font-weight: 760;
}

.conversation-head,
.quick-action-row,
.anticipatory-surface,
.intent-lens,
.inline-chat-thread,
.inline-chat-form,
.command-evidence-desk {
  border: 1px solid rgba(203, 213, 225, 0.78);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 12px 34px rgba(15, 23, 42, 0.05);
}

.quick-action-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 9px 14px;
  border-top: 0;
  border-bottom: 0;
}

.quick-action-row button {
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #d9e1ec;
  border-radius: 7px;
  background: #fbfcfe;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.quick-action-row button:hover {
  border-color: #bcd2ff;
  background: #f0f6ff;
}

.anticipatory-surface {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 14px;
  align-items: center;
  padding: 12px 18px;
  border-top: 0;
  border-bottom: 0;
  background:
    linear-gradient(135deg, rgba(8, 19, 36, 0.97), rgba(17, 34, 55, 0.94)),
    #0f172a;
  color: #f8fbff;
}

.anticipatory-head {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
}

.anticipatory-head > span {
  color: #67e8f9;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.anticipatory-body {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.anticipatory-body strong {
  overflow: hidden;
  color: #ffffff;
  font-size: 15px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.anticipatory-body p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: #b7c7dc;
  font-size: 12px;
  line-height: 1.45;
}

.anticipatory-facts {
  grid-column: 1 / -1;
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 6px;
}

.anticipatory-facts span {
  max-width: min(100%, 260px);
  overflow: hidden;
  padding: 5px 8px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: #cbd5e1;
  font-size: 11px;
  font-weight: 760;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.anticipatory-actions {
  grid-row: 1 / span 2;
  grid-column: 2;
  display: flex;
  gap: 7px;
  justify-content: end;
}

.anticipatory-action {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid rgba(203, 213, 225, 0.24);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #f8fbff;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
}

.anticipatory-action.primary {
  border-color: rgba(45, 212, 191, 0.52);
  background: rgba(20, 184, 166, 0.18);
  color: #ccfbf1;
}

.intent-lens {
  display: grid;
  grid-template-columns: 1.15fr 0.72fr 0.82fr;
  gap: 8px;
  padding: 0 18px 12px;
  border-top: 0;
  border-bottom: 0;
}

.intent-lens-card {
  min-width: 0;
  display: grid;
  gap: 4px;
  min-height: 76px;
  padding: 10px 11px;
  border: 1px solid #e1e8f0;
  border-radius: 9px;
  background: #fbfcff;
}

.intent-lens-card span {
  color: var(--teal);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.intent-lens-card strong,
.intent-lens-card small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.intent-lens-card strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
  white-space: nowrap;
}

.intent-lens-card small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.conversation-head {
  align-self: start;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 18px 10px;
  border-bottom: 0;
  border-radius: 12px 12px 0 0;
}

.conversation-head h2 {
  font-size: 23px;
}

.conversation-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.conversation-link,
.conversation-head > span,
.conversation-actions > span {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid #d9e1ec;
  border-radius: 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.conversation-link {
  color: var(--ink);
  background: #fbfcfe;
  text-decoration: none;
}

.conversation-link:hover {
  border-color: #bcd2ff;
  background: #f0f6ff;
}

.inline-chat-thread {
  align-self: stretch;
  min-height: 230px;
  max-height: 440px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px 18px;
  border-top: 0;
  border-bottom: 0;
}

.inline-chat-message {
  max-width: min(720px, 92%);
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid #dfe6ee;
  border-radius: 12px;
  background: #fbfcfe;
}

.inline-chat-message.user {
  align-self: end;
  border-color: #c9dcff;
  background: #f0f6ff;
}

.inline-chat-message.assistant {
  align-self: start;
  background: #ffffff;
}

.inline-chat-message p {
  white-space: pre-wrap;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.5;
}

.inline-chat-role {
  color: var(--muted);
  font-size: 11px;
  font-weight: 820;
}

.inline-chat-meta,
.inline-chat-artifact {
  color: var(--muted);
  font-size: 11px;
  font-weight: 680;
}

.inline-chat-meta {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.inline-chat-form {
  align-self: start;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  padding: 12px 18px 18px;
  border-top: 0;
  border-radius: 0 0 12px 12px;
}

.inline-chat-field {
  display: grid;
  gap: 7px;
}

.inline-chat-field span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.inline-chat-field textarea,
.inline-chat-actions input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  font: inherit;
}

.inline-chat-field textarea {
  min-height: 46px;
  max-height: 180px;
  resize: vertical;
  padding: 12px 13px;
  line-height: 1.35;
  overflow-y: auto;
}

.inline-chat-actions {
  display: grid;
  gap: 6px;
}

.inline-chat-actions input {
  min-height: 28px;
  padding: 0 8px;
  font-size: 11px;
}

.inline-chat-actions button {
  min-height: 46px;
  padding: 0 16px;
  border: 0;
  border-radius: 8px;
  background: var(--ink);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.command-evidence-desk {
  align-self: start;
  display: grid;
  align-content: start;
  gap: 12px;
  min-height: 100%;
  max-height: 560px;
  overflow: auto;
  padding: 18px;
  border-radius: 12px;
}

.command-evidence-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.command-evidence-head h3 {
  margin: 0;
  font-size: 17px;
  line-height: 1.2;
}

.command-evidence-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.command-evidence-stat {
  min-width: 0;
  display: grid;
  gap: 4px;
  min-height: 82px;
  padding: 10px;
  border: 1px solid #e1e8f0;
  border-radius: 10px;
  background: #fbfcff;
}

.command-evidence-stat strong {
  color: var(--ink);
  font-size: 19px;
  line-height: 1;
}

.command-evidence-stat span,
.command-evidence-stat small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.command-receipt-list {
  display: grid;
  gap: 7px;
}

.command-governed-ask {
  display: grid;
  gap: 7px;
}

.command-governed-ask[hidden] {
  display: none;
}

.offline-user-row {
  border-color: #d7e6d0;
  background: #fbfdf9;
}

.offline-user-facts span {
  border-color: #d7e6d0;
  background: #ffffff;
}

.offline-user-actions {
  align-items: center;
}

.command-route-rail {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e1e8f0;
  border-radius: 9px;
  background: #ffffff;
}

.command-route-head {
  min-width: 0;
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.command-route-head strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.2;
}

.command-route-head span {
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.command-route-list {
  display: grid;
  gap: 7px;
}

.command-route-step {
  min-width: 0;
  display: grid;
  grid-template-columns: 24px minmax(0, 0.8fr) minmax(0, 0.72fr);
  gap: 6px 8px;
  align-items: center;
  padding: 7px;
  border: 1px solid #e1e8f0;
  border-radius: 8px;
  background: #fbfcff;
}

.command-route-step i {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 1px solid #d8e2ee;
  border-radius: 999px;
  color: var(--teal);
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.command-route-step strong,
.command-route-step span,
.command-route-step small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.command-route-step strong {
  color: var(--ink);
  font-size: 12px;
}

.command-route-step span {
  color: var(--green);
  font-size: 11px;
  font-weight: 850;
}

.command-route-step small {
  grid-column: 2 / -1;
  color: var(--muted);
  font-size: 11px;
}

.command-receipt-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 7px;
  padding: 9px 10px;
  border: 1px solid #e1e8f0;
  border-radius: 9px;
  background: #ffffff;
}

.command-receipt-row-head {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.command-receipt-row-head strong {
  min-width: 0;
  font-size: 12px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.command-receipt-row-head .pill {
  min-height: 24px;
  padding: 4px 8px;
  font-size: 11px;
}

.command-receipt-path {
  display: block;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: 11px;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.command-receipt-open {
  width: fit-content;
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  background: #fbfcfe;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

.inline-chat-actions button:disabled {
  cursor: wait;
  opacity: 0.62;
}

.agent-work-head,
.agent-role-grid,
.artifact-lane,
.work-timeline {
  border: 1px solid #dfe5ee;
  background: #ffffff;
}

.agent-work-head {
  padding: 18px 18px 0;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}

.agent-work-head h2 {
  font-size: 21px;
}

.agent-role-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 18px;
  border-top: 0;
  border-bottom: 0;
}

.agent-card {
  grid-template-rows: auto auto auto auto 1fr;
  min-height: 230px;
  padding: 14px;
  border-top-width: 4px;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04), inset 0 0 0 1px rgba(255, 255, 255, 0.65);
}

.agent-card strong {
  font-size: 17px;
}

.agent-card span {
  font-size: 12px;
}

.agent-progress {
  display: grid;
  gap: 5px;
}

.agent-progress-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.agent-progress-head strong {
  color: var(--ink);
  font-size: 11px;
}

.agent-progress-track {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8edf5;
}

.agent-progress-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--teal), var(--blue));
}

.agent-preview {
  max-height: 86px;
  margin: 0;
  overflow: hidden;
  padding: 9px;
  border: 1px solid #e1e8f0;
  border-radius: 7px;
  background: #ffffff;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.artifact-lane {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 0;
}

.artifact-item {
  min-height: 132px;
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.035);
}

.artifact-preview {
  max-height: 78px;
}

.work-timeline {
  gap: 0;
  padding: 0 18px 16px;
  border-top: 0;
  border-radius: 0 0 12px 12px;
}

.timeline-row {
  min-height: 43px;
  border-width: 1px 0 0;
  border-radius: 0;
  background: #ffffff;
}

.goal-bar-band,
.ask-band {
  border-bottom: 0;
  background: transparent;
}

.goal-bar-form,
.ask-form,
.panel {
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(16, 24, 40, 0.04);
}

@media (max-width: 1180px) {
  .app-frame {
    grid-template-columns: 1fr;
  }

  .side-rail {
    position: static;
    height: auto;
    grid-template-rows: auto;
  }

  .side-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .conversation-band {
    grid-template-columns: minmax(0, 1fr);
  }

  .command-evidence-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .agent-role-grid,
  .capability-router-grid,
  .memory-library-grid,
  .memory-draft-grid,
  .promotion-queue-grid,
  .os-orbit,
  .os-lane-grid,
  .execution-lens-grid,
  .artifact-lane {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hive-board-lane {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .side-rail {
    gap: 12px;
    padding: 14px;
    border-right: 0;
    border-bottom: 1px solid #dfe5ee;
  }

  .brand-block {
    align-items: baseline;
    gap: 8px;
    padding: 0 2px 0 40px;
  }

  .brand-block strong {
    font-size: 24px;
  }

  .brand-block span {
    font-size: 13px;
  }

  .side-nav {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }

  .side-nav a {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 0 11px;
    border-color: #dbe5ef;
    background: #ffffff;
    font-size: 13px;
  }

  .side-goal {
    display: none;
  }

  .topbar,
  .runtime-band,
  .session-band,
  .conversation-band,
  .friction-radar-band,
  .os-observatory-band,
  .genesis-lens-band,
  .execution-lens-band,
  .capability-router-band,
  .memory-library-band,
  .memory-draft-band,
  .promotion-band,
  .agent-work-band,
  .hive-tui-band,
  .goal-bar-band,
  .ask-band,
  .map-band,
  .workgrid {
    padding-left: 14px;
    padding-right: 14px;
  }

  .session-form,
  .inline-chat-form,
  .intent-lens,
  .goal-bar-form,
  .command-evidence-grid,
  .runtime-grid,
  .os-orbit,
  .hive-board-lane,
  .os-lane-grid,
  .friction-grid,
  .genesis-cycle-grid,
  .genesis-branch-grid,
  .capability-router-grid,
  .memory-library-grid,
  .memory-draft-grid,
  .promotion-queue-grid,
  .execution-lens-grid,
  .agent-role-grid,
  .artifact-lane {
    grid-template-columns: 1fr;
  }

  .runtime-card.readiness-blocker-card {
    grid-column: auto;
  }

  .readiness-blocker-row {
    grid-template-columns: 1fr;
  }

  .readiness-blocker-row small {
    grid-column: auto;
  }

  .runtime-head {
    display: grid;
    align-items: start;
  }

  .runtime-head > span {
    width: fit-content;
  }

  .goal-bar-form button {
    width: 100%;
  }

  .command-receipt-row {
    grid-template-columns: 1fr;
  }

  .hive-tui-head {
    display: grid;
    align-items: start;
  }

  .hive-tui-head > span {
    width: 100%;
    display: block;
    white-space: normal;
  }
}

/* AIOS visual reboot v2: image-board led provider-grade control surface. */
:root {
  --ink: #e8eef7;
  --muted: #9aa8ba;
  --line: #26303d;
  --bg: #080a0d;
  --panel: #11161d;
  --panel-2: #161c24;
  --panel-3: #0d1117;
  --teal: #31d0bd;
  --blue: #57a6ff;
  --green: #4bd184;
  --amber: #f3b84d;
  --red: #ff6b6b;
  --violet: #b794ff;
  --shadow: 0 18px 42px rgba(0, 0, 0, 0.34);
}

html {
  overflow-x: clip;
  background: var(--bg);
}

body {
  overflow-x: clip;
  background:
    linear-gradient(180deg, #0b0d10 0%, #090b0e 44%, #07090b 100%);
  color: var(--ink);
}

.app-frame {
  width: 100%;
  max-width: 100vw;
  min-width: 0;
  grid-template-columns: 232px minmax(0, 1fr);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.014) 1px, transparent 1px),
    var(--bg);
  background-size: 28px 28px;
}

.shell {
  min-width: 0;
  overflow-x: clip;
}

.side-rail {
  border-right-color: #1d2530;
  background: rgba(10, 13, 17, 0.94);
  box-shadow: inset -1px 0 rgba(255, 255, 255, 0.025);
}

.brand-block::before {
  background: #1c6fd8;
  color: #f8fbff;
  box-shadow: 0 0 0 1px rgba(87, 166, 255, 0.36), 0 10px 24px rgba(28, 111, 216, 0.28);
}

.brand-block strong,
.brand-block span,
.side-goal span,
.side-goal strong,
.topbar h1,
.topbar .eyebrow,
h1,
h2,
h3,
.runtime-card strong,
.agent-role-card strong,
.artifact-item strong,
.capability-router-card > strong,
.memory-library-card > strong,
.memory-draft-card > strong,
.promotion-queue-card > strong,
.inline-chat-message p,
.chat-message-body h3 {
  color: var(--ink);
}

.brand-block small,
.side-goal small,
.goal-subtitle,
.chat-status,
.chat-meta-label,
.inline-chat-role,
.inline-chat-meta,
.inline-chat-artifact,
.runtime-card span,
.capability-router-card span,
.capability-router-card small,
.memory-library-card span,
.memory-library-card small,
.memory-draft-card span,
.memory-draft-card small,
.promotion-queue-card small,
.genesis-branch span,
.genesis-branch p,
.genesis-branch small,
.os-metric span,
.os-lane-detail,
.command-receipt-path,
.command-evidence-stat span,
.command-evidence-stat small {
  color: var(--muted);
}

.side-nav a,
.conversation-link,
.quick-action-row button,
.command-receipt-open,
.artifact-open,
.artifact-copy,
.memory-draft-review,
.chat-link,
.pill {
  border-color: #283241;
  background: #111821;
  color: #cbd6e3;
}

.side-nav a:hover,
.side-nav a.active,
.conversation-link:hover,
.quick-action-row button:hover {
  border-color: rgba(87, 166, 255, 0.72);
  background: #14263a;
  color: #f8fbff;
}

.side-goal,
.mode-toggle,
.status-strip .pill {
  border-color: #252f3c;
  background: #0f151d;
}

.mode-toggle button {
  color: #cbd6e3;
}

.mode-toggle button[aria-pressed="true"] {
  background: #1f7ae0;
  color: #ffffff;
}

.topbar {
  padding: 18px 28px 8px;
  background: transparent;
}

.topbar h1 {
  font-size: 18px;
  letter-spacing: 0.01em;
}

.eyebrow {
  color: var(--teal);
  letter-spacing: 0.05em;
}

.conversation-band,
.session-band,
.runtime-band,
.agent-work-band,
.promotion-band,
.friction-radar-band,
.os-observatory-band,
.genesis-lens-band,
.execution-lens-band,
.capability-router-band,
.memory-library-band,
.memory-draft-band,
.hive-tui-band,
.goal-bar-band,
.ask-band,
.map-band,
.workgrid {
  width: 100%;
  max-width: 1540px;
  min-width: 0;
}

.conversation-band {
  grid-template-columns: minmax(0, 1.35fr) minmax(330px, 0.72fr);
  gap: 16px;
  padding-top: 6px;
  padding-bottom: 18px;
}

.conversation-head,
.quick-action-row,
.intent-lens,
.inline-chat-thread,
.inline-chat-form,
.command-evidence-desk,
.runtime-head,
.runtime-grid,
.agent-work-head,
.agent-role-grid,
.artifact-lane,
.work-timeline,
.promotion-head,
.promotion-queue-grid,
.friction-radar-head,
.friction-grid,
.os-observatory-head,
.os-orbit,
.os-lane-grid,
.genesis-lens-head,
.genesis-cycle-grid,
.genesis-branch-grid,
.execution-lens-head,
.execution-lens-grid,
.capability-router-head,
.capability-router-grid,
.memory-library-head,
.memory-library-grid,
.memory-draft-head,
.memory-draft-grid,
.hive-tui-head,
.hive-board-overview,
.hive-board-card,
.session-form,
.goal-bar-form,
.ask-form,
.panel {
  border-color: #26303d;
  background: rgba(17, 22, 29, 0.96);
  box-shadow: var(--shadow);
}

.conversation-head {
  padding: 18px 20px 12px;
  border-radius: 10px 10px 0 0;
}

.conversation-head h2 {
  font-size: 25px;
  line-height: 1.05;
}

.quick-action-row {
  gap: 8px;
  padding: 11px 20px;
}

.quick-action-row button {
  min-height: 32px;
  border-radius: 8px;
}

.inline-chat-thread {
  min-height: min(52vh, 520px);
  max-height: 560px;
  background:
    linear-gradient(180deg, rgba(49, 208, 189, 0.035), transparent 26%),
    rgba(13, 17, 23, 0.98);
}

.inline-chat-message {
  border-color: #2b3543;
  background: #151b24;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.22);
}

.inline-chat-message.user {
  border-color: rgba(87, 166, 255, 0.52);
  background: #152236;
}

.inline-chat-message.assistant {
  border-color: rgba(49, 208, 189, 0.36);
  background: #101820;
}

.inline-chat-form {
  border-radius: 0 0 10px 10px;
  background: #11161d;
}

.inline-chat-field textarea,
.inline-chat-actions input,
.ask-field textarea,
.session-field textarea,
.session-contract input {
  border-color: #2b3543;
  background: #080d13;
  color: var(--ink);
}

.inline-chat-field textarea:focus,
.ask-field textarea:focus,
.session-field textarea:focus,
.session-contract input:focus {
  outline: 3px solid rgba(49, 208, 189, 0.16);
  border-color: rgba(49, 208, 189, 0.78);
}

.inline-chat-actions button,
.session-controls button,
.ask-controls button {
  background: #1f7ae0;
  color: #ffffff;
  box-shadow: 0 10px 26px rgba(31, 122, 224, 0.25);
}

.command-evidence-desk {
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(87, 166, 255, 0.055), transparent 42%),
    #10161e;
}

.command-evidence-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.command-evidence-stat,
.intent-lens-card,
.command-route-rail,
.command-route-step,
.command-receipt-row,
.runtime-card,
.agent-role-card,
.artifact-item,
.timeline-row,
.hive-board-item,
.capability-router-card,
.memory-library-card,
.memory-draft-card,
.promotion-queue-card,
.genesis-cycle-card,
.genesis-branch,
.friction-card,
.repo-row,
.dispatch-row,
.flow-row,
.route-row,
.stop-row {
  border-color: #2b3543;
  background: #151b24;
}

.command-evidence-stat strong {
  color: var(--ink);
}

.intent-lens-card {
  background: #101820;
}

.command-route-rail {
  background: #101820;
}

.command-route-step {
  background: #0d131a;
}

.command-route-step i {
  border-color: rgba(49, 208, 189, 0.45);
  background: rgba(49, 208, 189, 0.08);
}

.command-route-step span {
  color: var(--green);
}

.runtime-head,
.agent-work-head,
.promotion-head,
.friction-radar-head,
.os-observatory-head,
.genesis-lens-head,
.execution-lens-head,
.capability-router-head,
.memory-library-head,
.memory-draft-head,
.hive-tui-head {
  padding: 16px 18px 2px;
}

.runtime-head > span,
.agent-work-head > span,
.promotion-head > span,
.friction-radar-head > span,
.os-observatory-head > span,
.genesis-lens-head > span,
.execution-lens-head > span,
.capability-router-head > span,
.memory-library-head > span,
.memory-draft-head > span,
.hive-tui-head > span,
.conversation-actions > span {
  border-color: #2c3746;
  background: #0d131a;
  color: #b7c4d4;
}

.runtime-grid,
.agent-role-grid,
.artifact-lane,
.work-timeline,
.promotion-queue-grid,
.friction-grid,
.os-orbit,
.os-lane-grid,
.genesis-cycle-grid,
.genesis-branch-grid,
.execution-lens-grid,
.capability-router-grid,
.memory-library-grid,
.memory-draft-grid,
.hive-board-lane,
.hive-board-overview {
  background: #0d1117;
}

.capability-router-grid {
  grid-template-columns: 0.9fr 0.9fr 1.2fr;
}

.memory-graph-map {
  contain: paint;
  border-color: #2b3543;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    #0c1219;
  background-size: 28px 28px;
}

.memory-graph-node {
  border-color: #0d1117;
}

.memory-graph-edge {
  background: rgba(87, 166, 255, 0.28);
}

.capability-router-meter,
.capability-route-score,
.memory-library-meter {
  background: #242d39;
}

.chat-runtime-chip,
.capability-chip,
.memory-chip {
  border-color: #2b3543;
  background: #101720;
  color: #c0ccda;
}

.chat-artifact-preview,
.inline-chat-preview,
.artifact-open-preview,
.artifact-hash-preview {
  border-color: #2b3543;
  background: #080d13;
  color: #d6e1ef;
}

@media (max-width: 1180px) {
  .app-frame {
    grid-template-columns: minmax(0, 1fr);
  }

  .side-rail {
    position: static;
    height: auto;
  }

  .conversation-band {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 760px) {
  .app-frame {
    grid-template-columns: minmax(0, 1fr);
  }

  .app-frame,
  .shell,
  .side-rail,
  .topbar,
  .conversation-band,
  .session-band,
  .runtime-band,
  .agent-work-band,
  .promotion-band,
  .friction-radar-band,
  .os-observatory-band,
  .genesis-lens-band,
  .execution-lens-band,
  .capability-router-band,
  .memory-library-band,
  .memory-draft-band,
  .hive-tui-band,
  .goal-bar-band,
  .ask-band,
  .map-band,
  .workgrid {
    max-width: 100%;
    min-width: 0;
  }

  .topbar,
  .conversation-band,
  .session-band,
  .runtime-band,
  .agent-work-band,
  .promotion-band,
  .friction-radar-band,
  .os-observatory-band,
  .genesis-lens-band,
  .execution-lens-band,
  .capability-router-band,
  .memory-library-band,
  .memory-draft-band,
  .hive-tui-band,
  .goal-bar-band,
  .ask-band,
  .map-band,
  .workgrid {
    padding-left: 12px;
    padding-right: 12px;
  }

  .side-nav {
    max-width: 100%;
  }

  .side-nav {
    scrollbar-width: none;
  }

  .side-nav::-webkit-scrollbar {
    display: none;
  }

  .conversation-head,
  .command-evidence-head,
  .runtime-head,
  .agent-work-head,
  .promotion-head,
  .friction-radar-head,
  .os-observatory-head,
  .genesis-lens-head,
  .execution-lens-head,
  .capability-router-head,
  .memory-library-head,
  .memory-draft-head,
  .hive-tui-head {
    display: grid;
    align-items: start;
  }

  .conversation-actions,
  .command-evidence-head .conversation-link {
    justify-content: start;
  }

  .inline-chat-thread {
    min-height: 360px;
  }

  .inline-chat-form {
    grid-template-columns: 1fr;
  }

  .intent-lens {
    padding-left: 18px;
    padding-right: 18px;
  }

  .inline-chat-actions {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .capability-router-card.route-board,
  .capability-router-card.source-cockpit,
  .memory-library-card.retrieval-board {
    grid-column: auto;
  }
}

/* AIOS visual reboot v3 final override: generated image-board reference, chat-first cockpit. */
:root {
  color-scheme: light;
  --ink: #101827;
  --muted: #657286;
  --line: #d7dfeb;
  --bg: #edf2f7;
  --panel: #ffffff;
  --panel-soft: #f8fafc;
  --console: #0a1018;
  --console-2: #111923;
  --teal: #087f8c;
  --blue: #245fc7;
  --green: #1f8a55;
  --amber: #a16605;
  --red: #b23b48;
  --violet: #8a3ffc;
  --shadow: 0 18px 48px rgba(15, 23, 42, 0.12);
}

body {
  background:
    linear-gradient(180deg, #f7fafc 0%, #edf2f7 34%, #e7edf5 100%);
  color: var(--ink);
}

.app-frame {
  grid-template-columns: 252px minmax(0, 1fr);
  background:
    linear-gradient(90deg, rgba(36, 95, 199, 0.045) 1px, transparent 1px),
    linear-gradient(180deg, rgba(16, 24, 39, 0.04) 1px, transparent 1px),
    var(--bg);
  background-size: 32px 32px;
}

.side-rail {
  background: #f6f8fb;
  border-right: 1px solid #dce4ef;
  box-shadow: 10px 0 36px rgba(15, 23, 42, 0.04);
}

.brand-block {
  gap: 5px;
}

.brand-block::before {
  width: 32px;
  height: 32px;
  background: var(--blue);
  box-shadow: 0 10px 24px rgba(36, 95, 199, 0.22);
}

.brand-block strong {
  font-size: 30px;
  line-height: 0.95;
}

.brand-block span,
.side-goal strong,
.topbar h1,
.topbar h2,
.conversation-head h2,
.command-evidence-head h3,
.runtime-head h2,
.agent-work-head h2,
.promotion-head h2,
.friction-radar-head h2,
.os-observatory-head h2,
.genesis-lens-head h2,
.execution-lens-head h2,
.capability-router-head h2,
.memory-library-head h2,
.memory-draft-head h2,
.hive-tui-head h2,
.panel-head h2 {
  color: var(--ink);
}

.brand-block small,
.side-goal span,
.side-goal small,
.goal-subtitle,
.command-receipt-path,
.runtime-card span,
.capability-router-card span,
.capability-router-card small,
.memory-library-card span,
.memory-library-card small,
.memory-draft-card span,
.memory-draft-card small {
  color: var(--muted);
}

.side-nav {
  gap: 6px;
}

.side-nav a {
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: #263244;
}

.side-nav a:hover,
.side-nav a.active {
  border-color: #c9dbff;
  background: #eaf2ff;
  color: #144ca8;
}

.side-goal {
  border: 1px solid #d8e1ee;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}

.shell {
  padding-bottom: 40px;
}

.topbar {
  max-width: 1580px;
  margin: 0 auto;
  padding: 26px 32px 12px;
  border: 0;
  background: transparent;
}

.topbar h1 {
  font-size: clamp(38px, 5.6vw, 72px);
  letter-spacing: 0;
}

.top-actions {
  align-self: start;
}

.status-strip {
  gap: 10px;
}

.pill,
.status-strip .pill,
.mode-toggle,
.mode-toggle button,
.conversation-link,
.quick-action-row button,
.command-receipt-open,
.artifact-open,
.artifact-copy,
.memory-draft-review,
.memory-draft-evidence-button,
.chat-link {
  border-color: #d5dfec;
  background: #ffffff;
  color: #172033;
}

.mode-toggle {
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}

.mode-toggle button[aria-pressed="true"] {
  background: #111827;
  color: #ffffff;
}

.conversation-band {
  grid-template-columns: minmax(0, 1.48fr) minmax(370px, 0.74fr);
  gap: 16px;
  max-width: 1580px;
  padding: 14px 32px 18px;
}

.command-chat-column {
  min-width: 0;
  min-height: clamp(620px, calc(100vh - 156px), 820px);
  display: grid;
  grid-template-rows: auto auto auto minmax(330px, 1fr) auto;
  overflow: hidden;
  border: 1px solid #ccd8e7;
  border-radius: 14px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.conversation-head,
.quick-action-row,
.intent-lens,
.inline-chat-thread,
.inline-chat-form {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.conversation-head {
  padding: 24px 24px 12px;
  align-items: center;
}

.conversation-head h2 {
  font-size: clamp(28px, 3.1vw, 46px);
  line-height: 1;
}

.conversation-actions > span {
  background: #eef7f5;
  border-color: #c8e9e3;
  color: #0d655f;
}

.quick-action-row {
  padding: 8px 24px 14px;
}

.quick-action-row button {
  min-height: 34px;
  border-radius: 8px;
  background: #f8fafc;
}

.quick-action-row button:hover {
  border-color: #b8ccf7;
  background: #eef5ff;
}

.intent-lens {
  grid-template-columns: 1.1fr 0.82fr 0.9fr;
  padding: 0 24px 14px;
}

.intent-lens-card {
  min-height: 86px;
  border-color: #dce5f0;
  background: #f8fbff;
}

.inline-chat-thread {
  min-height: 0;
  max-height: none;
  padding: 18px 24px;
  background:
    radial-gradient(circle at 20% 0%, rgba(36, 95, 199, 0.08), transparent 32%),
    linear-gradient(180deg, #f9fbfe, #f4f7fb 58%, #ffffff);
}

.inline-chat-message {
  max-width: min(780px, 92%);
  border-color: #d9e3ef;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.inline-chat-message.user {
  border-color: #bad2ff;
  background: #edf4ff;
}

.inline-chat-message.assistant {
  border-color: #cde8e3;
  background: #ffffff;
}

.inline-chat-message p {
  color: var(--ink);
  font-size: 15px;
}

.inline-chat-role,
.inline-chat-meta,
.inline-chat-artifact {
  color: var(--muted);
}

.inline-chat-form {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 16px 24px 20px;
  border-top: 1px solid #dce5f0;
  background: #ffffff;
}

.inline-chat-field textarea {
  min-height: 58px;
  border: 1px solid #cfd9e6;
  border-radius: 11px;
  background: #fbfcfe;
  color: var(--ink);
}

.inline-chat-actions {
  align-self: end;
  grid-template-columns: auto;
}

.inline-chat-actions input {
  display: none;
}

.inline-chat-actions button {
  min-width: 88px;
  min-height: 48px;
  border-radius: 10px;
  background: #111827;
  color: #ffffff;
  box-shadow: 0 14px 28px rgba(17, 24, 39, 0.22);
}

.command-evidence-desk {
  min-height: clamp(620px, calc(100vh - 156px), 820px);
  border: 1px solid #182233;
  border-radius: 14px;
  background:
    radial-gradient(circle at 24% 0%, rgba(36, 95, 199, 0.28), transparent 32%),
    linear-gradient(180deg, #111923, #0b1119 60%, #090e15);
  box-shadow: var(--shadow);
}

.os-live-loop {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(215, 225, 238, 0.14);
  border-radius: 12px;
  background:
    radial-gradient(circle at center, rgba(138, 63, 252, 0.22), transparent 34%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    rgba(255, 255, 255, 0.055);
  background-size: auto, 26px 26px, 26px 26px, auto;
}

.os-live-loop-surface {
  position: relative;
  min-height: 270px;
  overflow: hidden;
  border: 1px solid rgba(215, 225, 238, 0.1);
  border-radius: 10px;
  background:
    radial-gradient(circle at center, transparent 0 30%, rgba(94, 234, 212, 0.08) 30.4% 31%, transparent 31.4% 44%, rgba(87, 166, 255, 0.08) 44.4% 45%, transparent 45.4%),
    rgba(5, 10, 17, 0.38);
}

.os-live-loop-center,
.os-live-loop-node {
  position: absolute;
  display: grid;
  min-width: 0;
  border: 1px solid rgba(215, 225, 238, 0.16);
  background: rgba(9, 14, 21, 0.88);
  color: #f8fbff;
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.22);
}

.os-live-loop-center {
  top: 50%;
  left: 50%;
  width: 148px;
  min-height: 112px;
  place-items: center;
  gap: 4px;
  padding: 14px;
  border-color: rgba(138, 63, 252, 0.58);
  border-radius: 28px;
  transform: translate(-50%, -50%);
  text-align: center;
}

.os-live-loop-center span,
.os-live-loop-center small,
.os-live-loop-node span,
.os-live-loop-node small,
.os-live-loop-footer span {
  overflow: hidden;
  color: #aebed0;
  font-size: 11px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.os-live-loop-center strong {
  max-width: 100%;
  overflow: hidden;
  color: #ffffff;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.os-live-loop-node {
  width: min(188px, calc(50% - 24px));
  min-height: 74px;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 2px 8px;
  align-content: center;
  padding: 9px 10px;
  border-radius: 12px;
}

.os-live-loop-node::before {
  content: "";
  position: absolute;
  width: 46px;
  height: 2px;
  background: rgba(94, 234, 212, 0.42);
}

.os-live-loop-node.memory {
  top: 24px;
  left: 18px;
  border-color: rgba(77, 201, 122, 0.44);
}

.os-live-loop-node.memory::before {
  right: -39px;
  bottom: 18px;
  transform: rotate(17deg);
}

.os-live-loop-node.capability {
  top: 24px;
  right: 18px;
  border-color: rgba(87, 166, 255, 0.48);
}

.os-live-loop-node.capability::before {
  left: -39px;
  bottom: 18px;
  transform: rotate(-17deg);
}

.os-live-loop-node.genesis {
  bottom: 24px;
  left: 18px;
  border-color: rgba(245, 158, 11, 0.5);
}

.os-live-loop-node.genesis::before {
  right: -39px;
  top: 18px;
  transform: rotate(-17deg);
}

.os-live-loop-node.myworld {
  right: 18px;
  bottom: 24px;
  border-color: rgba(94, 234, 212, 0.5);
}

.os-live-loop-node.myworld::before {
  left: -39px;
  top: 18px;
  transform: rotate(17deg);
}

.os-live-loop-node i {
  grid-row: 1 / 4;
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid rgba(94, 234, 212, 0.4);
  border-radius: 999px;
  color: #5eead4;
  font-size: 11px;
  font-style: normal;
  font-weight: 850;
}

.os-live-loop-node strong {
  overflow: hidden;
  color: #f8fbff;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.os-live-loop-node span,
.os-live-loop-node small {
  grid-column: 2;
}

.os-live-loop-node small {
  max-width: 100%;
}

.os-live-loop-footer {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.os-live-loop-footer .pill {
  min-height: 28px;
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.07);
  color: #f8fbff;
}

.command-evidence-head h3,
.command-evidence-head .eyebrow,
.command-route-head strong,
.command-receipt-row strong,
.command-evidence-stat strong {
  color: #f8fbff;
}

.command-evidence-head .conversation-link {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.07);
  color: #f8fbff;
}

.command-evidence-stat,
.command-decision-map,
.command-route-rail,
.command-receipt-row {
  border-color: rgba(215, 225, 238, 0.14);
  background: rgba(255, 255, 255, 0.055);
}

.command-evidence-stat span,
.command-evidence-stat small,
.command-decision-head span,
.command-decision-node small,
.command-route-head span,
.command-route-step small,
.command-receipt-path {
  color: #aebed0;
}

.command-decision-map {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(215, 225, 238, 0.14);
  border-radius: 10px;
}

.command-decision-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.command-decision-head strong {
  color: #f8fbff;
  font-size: 13px;
}

.command-decision-head span {
  font-size: 11px;
  font-weight: 750;
}

.command-decision-flow {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
}

.command-decision-node {
  position: relative;
  display: grid;
  grid-template-columns: 24px minmax(76px, auto) minmax(0, 1fr);
  min-height: 44px;
  align-items: center;
  column-gap: 8px;
  padding: 7px 8px;
  border: 1px solid rgba(215, 225, 238, 0.12);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.045);
}

.command-decision-node:not(:last-child)::after {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 19px;
  z-index: 2;
  width: 2px;
  height: 8px;
  background: rgba(94, 234, 212, 0.54);
}

.command-decision-node i {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid rgba(94, 234, 212, 0.4);
  border-radius: 999px;
  color: #5eead4;
  font-size: 11px;
  font-style: normal;
  font-weight: 850;
}

.command-decision-node strong {
  overflow: hidden;
  color: #f2f7ff;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.command-decision-node span {
  overflow: hidden;
  color: #5eead4;
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.command-decision-node small {
  grid-column: 3;
  overflow: hidden;
  font-size: 10px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.command-decision-node.fallback,
.command-decision-node.held,
.command-decision-node.watch {
  background: rgba(251, 191, 36, 0.08);
}

.command-route-step {
  border-color: rgba(215, 225, 238, 0.12);
  background: rgba(255, 255, 255, 0.045);
}

.command-route-step strong {
  color: #f2f7ff;
}

.command-route-step span {
  color: #5eead4;
}

.command-receipt-open {
  border-color: rgba(255, 255, 255, 0.17);
  background: rgba(255, 255, 255, 0.06);
  color: #f8fbff;
}

.governed-ask-row {
  border-color: rgba(94, 234, 212, 0.28);
  background:
    linear-gradient(135deg, rgba(94, 234, 212, 0.1), rgba(255, 255, 255, 0.045) 42%),
    rgba(255, 255, 255, 0.055);
}

.governed-ask-facts,
.governed-ask-actions {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 6px;
}

.governed-ask-facts span {
  display: inline-flex;
  max-width: 100%;
  min-height: 24px;
  align-items: center;
  padding: 3px 7px;
  overflow: hidden;
  border: 1px solid rgba(215, 225, 238, 0.14);
  border-radius: 999px;
  color: #b9c8d8;
  font-size: 11px;
  font-weight: 780;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.governed-ask-open {
  display: grid;
  gap: 4px;
}

.governed-ask-materialize {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  align-items: end;
  gap: 6px;
}

.governed-ask-materialize input {
  width: 104px;
  min-height: 30px;
  padding: 0 8px;
  border: 1px solid rgba(215, 225, 238, 0.22);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.08);
  color: #f8fbff;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
}

.governed-ask-open small,
.governed-ask-status,
.governed-ask-materialize small {
  color: #aebed0;
  font-size: 10px;
  font-weight: 800;
}

.runtime-band,
.agent-work-band,
.promotion-band,
.friction-radar-band,
.os-observatory-band,
.genesis-lens-band,
.execution-lens-band,
.capability-router-band,
.memory-library-band,
.memory-draft-band,
.hive-tui-band,
.session-band,
.goal-bar-band,
.ask-band,
.map-band,
.workgrid {
  max-width: 1580px;
  padding-left: 32px;
  padding-right: 32px;
}

.runtime-head,
.agent-work-head,
.promotion-head,
.friction-radar-head,
.os-observatory-head,
.genesis-lens-head,
.execution-lens-head,
.capability-router-head,
.memory-library-head,
.memory-draft-head,
.hive-tui-head,
.runtime-grid,
.agent-role-grid,
.artifact-lane,
.work-timeline,
.promotion-queue-grid,
.friction-grid,
.os-orbit,
.os-lane-grid,
.genesis-cycle-grid,
.genesis-branch-grid,
.execution-lens-grid,
.capability-router-grid,
.memory-library-grid,
.memory-draft-grid,
.hive-board-overview,
.hive-board-card,
.session-form,
.goal-bar-form,
.ask-form,
.panel {
  border-color: #d4deeb;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 34px rgba(15, 23, 42, 0.07);
}

.runtime-grid,
.agent-role-grid,
.artifact-lane,
.work-timeline,
.promotion-queue-grid,
.friction-grid,
.os-lane-grid,
.genesis-cycle-grid,
.genesis-branch-grid,
.execution-lens-grid,
.capability-router-grid,
.memory-library-grid,
.memory-draft-grid,
.hive-board-lane,
.hive-board-overview {
  background: #f6f8fb;
}

.runtime-card,
.agent-role-card,
.agent-card,
.artifact-item,
.timeline-row,
.hive-board-item,
.capability-router-card,
.memory-library-card,
.memory-draft-card,
.promotion-queue-card,
.genesis-cycle-card,
.genesis-branch,
.friction-card,
.repo-row,
.dispatch-row,
.flow-row,
.route-row,
.stop-row {
  border-color: #dbe5f1;
  background: #ffffff;
}

.os-orbit {
  background:
    radial-gradient(circle at center, rgba(36, 95, 199, 0.11), transparent 36%),
    #0b1119;
}

.os-orbit-center,
.os-orbit-node {
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.22);
}

.memory-graph-map {
  background:
    linear-gradient(90deg, rgba(16, 24, 39, 0.05) 1px, transparent 1px),
    linear-gradient(180deg, rgba(16, 24, 39, 0.045) 1px, transparent 1px),
    #fbfdff;
  background-size: 28px 28px;
}

.memory-graph-node {
  transform: translate(-50%, -50%);
}

.memory-graph-node.trace {
  width: 14px;
  height: 14px;
  background: var(--violet);
}

.memory-graph-node.source {
  width: 14px;
  height: 14px;
  background: var(--teal);
}

.memory-graph-node.rejected {
  background: #ef4444;
}

.memory-graph-node span {
  position: absolute;
  top: 15px;
  left: 50%;
  max-width: 96px;
  padding: 2px 5px;
  transform: translateX(-50%);
  overflow: hidden;
  border: 1px solid #d7e0ec;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #273344;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.memory-graph-node.memory span {
  display: none;
}

.memory-graph-edge.retrieved {
  background: rgba(127, 104, 255, 0.35);
}

.memory-graph-edge.provenance {
  background: rgba(32, 178, 170, 0.36);
}

.capability-router-grid {
  grid-template-columns: minmax(260px, 0.95fr) minmax(260px, 0.95fr) minmax(340px, 1.15fr);
}

.dispatch-memory-trace {
  grid-column: 1 / -1;
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  min-height: 26px;
  align-items: center;
  padding: 4px 8px;
  border: 1px solid #cce8dd;
  border-radius: 999px;
  background: #eefaf5;
  color: #176846;
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: 11px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

@media (max-width: 1180px) {
  .app-frame {
    grid-template-columns: minmax(0, 1fr);
  }

  .side-rail {
    background: #ffffff;
  }

  .conversation-band {
    grid-template-columns: minmax(0, 1fr);
  }

  .command-chat-column,
  .command-evidence-desk {
    min-height: auto;
  }

  .os-live-loop-surface {
    min-height: 250px;
  }
}

@media (max-width: 760px) {
  .topbar,
  .conversation-band,
  .runtime-band,
  .agent-work-band,
  .promotion-band,
  .friction-radar-band,
  .os-observatory-band,
  .genesis-lens-band,
  .execution-lens-band,
  .capability-router-band,
  .memory-library-band,
  .memory-draft-band,
  .hive-tui-band,
  .session-band,
  .goal-bar-band,
  .ask-band,
  .map-band,
  .workgrid {
    padding-left: 12px;
    padding-right: 12px;
  }

  .conversation-head,
  .inline-chat-form,
  .command-evidence-head {
    grid-template-columns: minmax(0, 1fr);
  }

  .conversation-head {
    align-items: start;
  }

  .conversation-head h2 {
    font-size: 32px;
  }

  .anticipatory-surface {
    grid-template-columns: minmax(0, 1fr);
  }

  .anticipatory-actions {
    grid-row: auto;
    grid-column: 1;
    justify-content: start;
  }

  .intent-lens,
  .command-decision-flow,
  .command-evidence-grid,
  .os-product-metrics,
  .capability-router-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .inline-chat-thread {
    min-height: 360px;
    padding: 14px;
  }

  .inline-chat-form {
    padding: 14px;
  }

  .os-live-loop-surface {
    min-height: 490px;
  }

  .os-live-loop-center {
    top: 242px;
  }

  .os-live-loop-node {
    left: 50%;
    right: auto;
    width: min(260px, calc(100% - 28px));
    transform: translateX(-50%);
  }

  .os-live-loop-node.memory {
    top: 14px;
  }

  .os-live-loop-node.capability {
    top: 104px;
  }

  .os-live-loop-node.genesis {
    top: 314px;
    bottom: auto;
  }

  .os-live-loop-node.myworld {
    top: 404px;
    bottom: auto;
  }

  .os-live-loop-node::before {
    display: none;
  }
}

/* GenesisOS worldline evidence map. */
.genesis-worldline-map {
  margin-top: 14px;
}

.genesis-worldline-card {
  display: grid;
  gap: 12px;
  min-height: 360px;
  padding: 16px;
  border: 1px solid rgba(71, 85, 105, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(15, 118, 110, 0.08) 0 1px, transparent 1px),
    linear-gradient(0deg, rgba(15, 118, 110, 0.06) 0 1px, transparent 1px),
    #f8fafc;
  background-size: 32px 32px;
}

.genesis-worldline-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #0f172a;
}

.genesis-worldline-head strong {
  font-size: 14px;
}

.genesis-worldline-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 750;
}

.genesis-worldline-surface {
  position: relative;
  min-height: 286px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
}

.genesis-worldline-edge {
  position: absolute;
  z-index: 1;
  height: 2px;
  transform-origin: 0 50%;
  opacity: 0.72;
  background: #64748b;
}

.genesis-worldline-edge.provokes {
  background: #dc2626;
}

.genesis-worldline-edge.invents {
  background: #0f766e;
}

.genesis-worldline-edge.evidence {
  background: #2563eb;
  opacity: 0.55;
}

.genesis-worldline-node {
  position: absolute;
  z-index: 2;
  display: grid;
  gap: 2px;
  width: min(174px, 24%);
  min-height: 52px;
  padding: 8px 10px;
  border: 1px solid rgba(15, 23, 42, 0.16);
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  text-align: left;
  cursor: pointer;
  transform: translate(-50%, -50%);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

.genesis-worldline-node strong {
  overflow: hidden;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.genesis-worldline-node span {
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.genesis-worldline-node.discomfort {
  border-color: rgba(220, 38, 38, 0.34);
  background: #fff7ed;
}

.genesis-worldline-node.branch {
  border-color: rgba(124, 58, 237, 0.32);
  background: #faf5ff;
}

.genesis-worldline-node.seed {
  border-color: rgba(15, 118, 110, 0.34);
  background: #f0fdfa;
}

.genesis-worldline-node.source {
  border-color: rgba(37, 99, 235, 0.32);
  background: #eff6ff;
  cursor: default;
}

.genesis-worldline-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 720px) {
  .genesis-worldline-card {
    min-height: 430px;
  }

  .genesis-worldline-surface {
    min-height: 350px;
  }

  .genesis-worldline-node {
    width: min(150px, 34%);
  }
}

/* Gate Chair provider/runtime evidence map. */
.runtime-flow-card {
  grid-column: 1 / -1;
  display: grid;
  gap: 12px;
  min-height: 270px;
  padding: 14px;
  border: 1px solid #dbe5f1;
  border-radius: 8px;
  background: #ffffff;
}

.runtime-flow-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.runtime-flow-head strong {
  font-size: 14px;
}

.runtime-flow-head span {
  color: #667085;
  font-size: 12px;
  font-weight: 750;
}

.runtime-flow-surface {
  position: relative;
  min-height: 210px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.44);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(15, 23, 42, 0.045) 0 1px, transparent 1px),
    linear-gradient(0deg, rgba(15, 23, 42, 0.045) 0 1px, transparent 1px),
    #f8fafc;
  background-size: 30px 30px;
}

.runtime-flow-edge {
  position: absolute;
  z-index: 1;
  height: 2px;
  transform-origin: 0 50%;
  background: rgba(100, 116, 139, 0.58);
}

.runtime-flow-edge.selects,
.runtime-flow-edge.produces {
  background: rgba(37, 99, 235, 0.62);
}

.runtime-flow-edge.demotes {
  background: rgba(220, 38, 38, 0.68);
}

.runtime-flow-edge.recovers {
  background: rgba(22, 163, 74, 0.68);
}

.runtime-flow-edge.candidate {
  background: rgba(124, 58, 237, 0.58);
}

.runtime-flow-node {
  position: absolute;
  z-index: 2;
  display: grid;
  gap: 2px;
  width: min(176px, 24%);
  min-height: 50px;
  padding: 8px 10px;
  border: 1px solid rgba(15, 23, 42, 0.16);
  border-radius: 8px;
  background: #ffffff;
  transform: translate(-50%, -50%);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.11);
}

.runtime-flow-node strong {
  overflow: hidden;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.runtime-flow-node span {
  color: #667085;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.runtime-flow-node.config,
.runtime-flow-node.candidate {
  background: #f5f3ff;
}

.runtime-flow-node.effective.internal {
  background: #ecfeff;
}

.runtime-flow-node.effective.external,
.runtime-flow-node.turn.active,
.runtime-flow-node.recovery {
  background: #f0fdf4;
}

.runtime-flow-node.failure,
.runtime-flow-node.attention,
.runtime-flow-node.turn.attention {
  background: #fff7ed;
  border-color: rgba(220, 38, 38, 0.32);
}

.runtime-flow-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

/* ASC-0204 — multi-agent roster + contract-lifecycle board */
.roster-band {
  display: grid;
  gap: 0;
  padding-bottom: 14px;
}
.roster-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 18px;
  border: 1px solid var(--line);
  border-top: 0;
  background: var(--panel);
}
.roster-board-head {
  margin-top: 10px;
}
.roster-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--muted);
  border-radius: 8px;
  background: var(--panel);
}
.roster-card.working { border-left-color: var(--blue); }
.roster-card.blocked { border-left-color: var(--red); }
.roster-card.needs_input { border-left-color: var(--amber); }
.roster-card.idle { border-left-color: var(--line); }
.roster-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.roster-repo {
  font-size: 12px;
  color: var(--muted);
  font-weight: 700;
}
.roster-digest {
  font-size: 12px;
  color: var(--ink);
}
.contract-board {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  padding: 14px 18px 18px;
  border: 1px solid var(--line);
  border-top: 0;
  border-radius: 0 0 8px 8px;
  background: var(--panel);
}
.board-column {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.board-column-head {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  padding-bottom: 4px;
  border-bottom: 1px solid var(--line);
}
.board-card {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--bg);
}
.board-card strong { font-size: 12px; }
.board-card-title {
  font-size: 11px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.board-card-more {
  font-size: 11px;
  color: var(--muted);
  padding: 4px 2px;
}
.dot.blocked { background: var(--red); }
.dot.working { background: var(--blue); }
.dot.needs_input { background: var(--amber); }
.dot.idle { background: var(--muted); }
