:root {
  --bg: #100f0d;
  --bg-rail: #141210;
  --panel: #1c1a16;
  --ink: #f3ead8;
  --text: var(--ink);
  --muted: #8f8270;
  --strong: #e8dcc4;
  --bronze: #c9a66b;
  --bronze-soft: rgba(201, 166, 107, 0.14);
  --mint: #8fbfb2;
  --line: #2c2822;
  --track: rgba(243, 234, 216, 0.08);
  --danger: #c9896a;
  --ui: "Segoe UI", "Iowan Old Style", Palatino, Georgia, serif;
  --display: "Iowan Old Style", Palatino, "Palatino Linotype", Georgia, serif;
  --radius: 12px;
  --radius-deep: 18px;
  --shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.22), 0 8px 24px rgba(0, 0, 0, 0.18);
  --shadow-card: 0 1px 1px rgba(0, 0, 0, 0.16), 0 6px 18px rgba(0, 0, 0, 0.2);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.12);
  /* Calm mobile type scale (brand fonts; sizes from dense UI systems) */
  --type-title: 600 22px/28px var(--display);
  --type-section: 600 19px/24px var(--display);
  --type-body: 400 14.5px/18px var(--ui);
  --track-title: -0.7px;
  --track-section: 0.6px;
  --track-body: 0.3px;
  /* Micro-motion (transitions.dev energy: short, soft, no purple) */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
  --dur-fast: 140ms;
  --dur-med: 220ms;
  --dur-slow: 320ms;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; max-width: 100%; background: var(--bg); color: var(--ink); color-scheme: dark; overflow-x: hidden; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
body {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-width: 0;
  overflow: hidden;
  font-family: var(--ui);
  background:
    radial-gradient(1200px 420px at 50% -80px, rgba(201, 166, 107, 0.09), transparent 60%),
    var(--bg);
}
.bar {
  display: grid;
  grid-template-columns: minmax(168px, 1fr) auto minmax(168px, 1fr);
  gap: 16px;
  align-items: center;
  padding: 10px 20px;
  border-bottom: 1px solid var(--track);
  background: rgba(16, 15, 13, 0.96);
  min-width: 0;
  max-width: 100%;
}
.bar-left {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.mark-row { display: flex; gap: 12px; align-items: center; min-width: 0; }
.mark-gem {
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  object-fit: contain;
  display: block;
  flex: 0 0 auto;
  border-radius: 9px;
  background: #000;
}
.mark-type {
  display: grid;
  gap: 2px;
  min-width: 0;
  line-height: 1.05;
}
.mark-lockup {
  display: block;
  width: 220px;
  height: auto;
  margin: 0 auto;
}
.word {
  font-family: var(--display);
  letter-spacing: 0.06em;
  font-size: 15px;
  font-weight: 500;
  color: var(--ink);
  text-transform: lowercase;
}
.sub {
  letter-spacing: 0.02em;
  font-size: 11px;
  color: var(--muted);
}
.stages {
  display: flex;
  justify-content: center;
  justify-self: center;
  gap: 2px;
  padding: 3px;
  border: 0;
  box-shadow: inset 0 0 0 1px var(--track), var(--shadow-inset);
  border-radius: 999px;
  background: #161411;
  flex-wrap: nowrap;
  max-width: min(220px, 40vw);
}
.stage-btn, .drawer-tab, .ghost-btn, .chips button, .bot, .org-add, .lane, .route-btn {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  color: var(--ink);
  border: 1px solid transparent;
  padding: 7px 12px;
  cursor: pointer;
  font: inherit;
  line-height: 1.2;
  transition:
    color var(--dur-fast) var(--ease-out),
    background var(--dur-fast) var(--ease-out),
    border-color var(--dur-fast) var(--ease-out),
    box-shadow var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-out);
}
.stage-btn {
  border: 0;
  border-radius: 999px;
  padding: 6px 14px;
  color: var(--muted);
  white-space: nowrap;
}
.stage-btn:hover, .drawer-tab:hover, .ghost-btn:hover, .route-btn:hover, .bot:hover {
  color: var(--bronze);
}
.stage-btn:active, .ghost-btn:active, .send:active, .route-btn:active {
  transform: translateY(1px) scale(0.98);
}
.stage-btn.on, .drawer-tab.on, .bot.on {
  border-color: transparent;
  color: var(--bronze);
}
.stage-btn.on {
  background: var(--bronze-soft);
  color: var(--bronze);
  box-shadow: var(--shadow-inset);
}
.stage-short { display: none; }
.bar-right {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-self: end;
  justify-content: flex-end;
  min-width: 0;
  overflow: hidden;
  flex-shrink: 1;
}
.pulse {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 340px;
  padding: 5px 10px 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.2;
}
.pulse i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--muted);
  flex-shrink: 0;
}
.pulse.on {
  border-color: rgba(201, 166, 107, 0.45);
  color: var(--ink);
}
.pulse.on i {
  background: var(--bronze);
  box-shadow: 0 0 0 4px rgba(201, 166, 107, 0.16);
  animation: ceo-live-pulse 1.4s ease-in-out infinite;
}
.pulse.warn {
  border-color: rgba(201, 137, 106, 0.5);
  color: var(--ink);
}
.pulse.ok {
  border-color: rgba(143, 191, 178, 0.35);
  color: var(--mint);
}
.pulse.ok i {
  background: var(--mint);
  box-shadow: none;
  animation: none;
}
.pulse.ok small { display: none; }
.pulse.none { display: none; }
.pulse span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.pulse small {
  color: var(--muted);
  font-size: 10px;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.engine-hint {
  display: flex; align-items: center; gap: 8px;
  min-width: 0; max-width: 220px;
}
.engine-hint.hidden { display: none; }
.engine-hint p { margin: 0; font-size: 11px; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.engine-hint a { color: var(--bronze); }
.engine-hint .ghost-btn { padding: 4px 8px; font-size: 11px; height: auto; }
.meter {
  display: flex;
  align-items: center;
  background: transparent;
  border: 1px solid var(--line);
  color: var(--ink);
  padding: 6px 12px;
  cursor: pointer;
  min-width: 0;
  max-width: 240px;
  text-align: right;
  font: inherit;
  border-radius: 999px;
}
.meter-line { display: none; }
.meter-row {
  display: flex; justify-content: space-between; gap: 12px;
  font-size: 11px; color: var(--muted);
}
.meter-line span { white-space: nowrap; }
.meter-line i { font-style: normal; color: var(--bronze); font-variant-numeric: tabular-nums; }
.meter-row b { font-weight: 500; color: var(--ink); }
.meter-row i { font-style: normal; font-variant-numeric: tabular-nums; color: var(--bronze); }
.meter-total {
  font-size: 12px;
  color: var(--bronze);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.meter:hover { border-color: var(--bronze); }
.spend-break {
  display: grid; gap: 6px; padding: 10px 12px;
  border: 1px solid var(--line); background: var(--bg); font-size: 13px;
  border-radius: 10px;
  min-width: 0;
}
.spend-break > div:not(.usage-card):not(.spend-alerts) { display: flex; justify-content: space-between; gap: 12px; min-width: 0; }
/* The per-CEO table and trend are cards of their own: no box around the boxes, and never squeezed into a flex row. */
#spendBreak { border: 0; padding: 0; background: none; gap: 12px; }
#spendBreak:empty { display: none; }
.spend-break b { min-width: 0; overflow-wrap: anywhere; }
.profile-dock {
  border-top: 1px solid var(--line);
  padding: 10px 8px 12px;
  flex-shrink: 0;
  display: grid;
  gap: 8px;
  background: var(--bg-rail);
  z-index: 2;
}
.help-link {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  text-align: left;
  background: transparent;
  color: var(--muted);
  border: none;
  padding: 0 10px 2px;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  letter-spacing: 0.04em;
}
.help-link:hover { color: var(--bronze); }
.profile-card {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  width: 100%;
  text-align: left;
  background: transparent;
  color: var(--ink);
  border: 1px solid var(--line);
  padding: 8px 10px;
  cursor: pointer;
  font: inherit;
  border-radius: var(--radius);
}
.profile-card:hover { border-color: var(--bronze); }
.profile-mark {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #e0c089, var(--bronze));
  opacity: 0.92;
}
.profile-copy { display: grid; gap: 2px; min-width: 0; }
.profile-copy b {
  font-weight: 500;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.profile-copy small {
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.org-hint { padding: 8px 10px 12px; color: var(--muted); font-size: 11px; }
.org-add-slot {
  flex-shrink: 0;
  padding: 8px 8px 4px;
  background: var(--bg-rail);
}
.org-add {
  margin: 8px 6px 4px;
  width: calc(100% - 12px);
  border-radius: 10px;
  border: 1px dashed var(--bronze);
  color: var(--bronze);
  background: var(--bronze-soft);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 11px;
  height: 36px;
  flex-shrink: 0;
  display: block;
}
.org-add:hover { color: var(--bronze); border-color: var(--bronze); }
.org-hide-ceos {
  border-style: solid;
  color: var(--muted);
  background: transparent;
  border-color: var(--line);
}
.org-hide-ceos.on {
  color: var(--bronze);
  border-color: var(--bronze);
  background: var(--bronze-soft);
}
.git-card { display: grid; gap: 6px; padding: 12px 14px; border: 1px solid var(--line); background: var(--bg); border-radius: 10px; overflow-wrap: anywhere; }
#stage-chat.on {
  grid-template-columns: var(--rail-width, 252px) 5px minmax(0, 1fr);
  min-height: 0;
  height: 100%;
}
html.is-mobile #stage-chat.on { grid-template-columns: minmax(0, 1fr); }
.rail-scrim {
  display: none !important;
  pointer-events: none !important;
}
.rail {
  border-right: 1px solid var(--track);
  display: flex; flex-direction: column; min-height: 0; min-width: 0;
  background: var(--bg-rail);
  overflow: hidden;
  width: var(--rail-width, 252px);
  max-width: min(420px, 42vw);
  transition: transform var(--dur-slow) var(--ease-out), box-shadow var(--dur-med) var(--ease-out);
}
.rail-splitter {
  display: none;
  width: 5px;
  cursor: col-resize;
  background: transparent;
  touch-action: none;
  flex-shrink: 0;
}
.rail-splitter:hover,
.rail-splitter.dragging {
  background: color-mix(in srgb, var(--bronze) 35%, transparent);
}
html.is-desktop .rail-splitter:not([hidden]) { display: block; }
html.is-desktop.rail-dragging { cursor: col-resize; user-select: none; }
.work-sheet-glossary {
  margin: 0 0 8px;
  font-size: 11px;
  color: var(--muted);
}
.work-sheet-glossary summary {
  cursor: pointer;
  list-style: none;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.work-sheet-glossary summary::-webkit-details-marker { display: none; }
.work-sheet-glossary[open] .work-sheet-lead { margin-top: 6px; }
.work-ceo-wiring { margin-bottom: 6px; }
.org {
  display: flex; flex-direction: column; gap: 2px;
  padding: 12px 8px 8px; flex: 1; overflow: auto; min-height: 0;
}
.org-btn {
  text-align: left; width: 100%;
  background: transparent; color: var(--ink); border: 0;
  border-left: 2px solid transparent;
  padding: 8px 10px; cursor: pointer;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  font: inherit;
  min-width: 0;
  height: 72px;
  transition: background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
  min-height: 72px;
  box-sizing: border-box;
}
.org-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(201, 166, 107, 0.2), rgba(143, 191, 178, 0.2));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--bronze);
  flex-shrink: 0;
  border: 1px solid rgba(201, 166, 107, 0.3);
}
.org-btn-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.org-btn b {
  font-weight: 500;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.org-lamp {
  display: block;
  color: var(--sage, #8fbfb2);
  font-size: 10px;
  line-height: 1.3;
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.org-desk-card.has-blocker .org-lamp,
.org-desk-card.working .org-lamp { color: var(--bronze); }
.org-now {
  display: block;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.queue-chip {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  background: var(--bronze-soft);
  color: var(--bronze);
  font-size: 10px;
  font-weight: 600;
  border-radius: 10px;
  vertical-align: middle;
}
.active-chip {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  background: var(--bronze);
  color: #1a140c;
  font-size: 10px;
  font-weight: 600;
  border-radius: 10px;
  vertical-align: middle;
  animation: active-pulse 1.5s ease-in-out infinite;
}
@keyframes active-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
}
.org-btn.has-blocker .org-now {
  color: var(--danger);
}
.org-btn.on {
  background: var(--bronze-soft);
  border-left-color: var(--bronze);
  color: var(--bronze);
}
.org-btn.on .org-avatar {
  background: linear-gradient(135deg, var(--bronze), rgba(143, 191, 178, 0.4));
  border-color: var(--bronze);
  color: #1a140c;
}
.org-btn.ping { box-shadow: inset 3px 0 0 var(--bronze); }
.org-btn.working { color: var(--bronze); }
.org-btn.working .org-avatar {
  animation: avatar-pulse 1.5s ease-in-out infinite;
}
@keyframes avatar-pulse {
  0%, 100% { 
    border-color: rgba(201, 166, 107, 0.3);
    box-shadow: 0 0 0 0 rgba(201, 166, 107, 0.4);
  }
  50% { 
    border-color: var(--bronze);
    box-shadow: 0 0 0 3px rgba(201, 166, 107, 0.1);
  }
}
.org-inbox {
  display: grid;
  gap: 4px;
  margin: 6px 0 8px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--bg);
}
.org-inbox-head {
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--bronze);
}
.org-inbox-empty {
  margin: 0;
  font-size: 11px;
  color: var(--muted);
  line-height: 1.4;
}
.org-inbox.working-on {
  margin-top: 0;
}
.phase-chip {
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--bronze);
}
.suggest-form {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}
.suggest-form input,
.suggest-form textarea {
  width: 100%;
  font: inherit;
  font-size: 12px;
  background: var(--bg);
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 6px 8px;
}
.org-inbox-item {
  display: grid;
  gap: 2px;
  text-align: left;
  background: transparent;
  border: 0;
  color: var(--text);
  padding: 6px 4px;
  cursor: pointer;
  min-width: 0;
}
.org-inbox-item span {
  color: var(--muted);
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.org-inbox.handling {
  border-color: transparent;
  background: transparent;
  padding: 2px 0 8px;
}
.org-inbox.handling .org-inbox-head,
.org-inbox.adam .org-inbox-head {
  text-transform: none;
  letter-spacing: 0;
  font-size: 11px;
  color: var(--muted);
}
.org-inbox.adam {
  gap: 6px;
  padding: 8px 10px 10px;
}
.org-inbox.adam .org-inbox-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  padding: 4px 0 0;
}
.org-inbox.adam .org-inbox-item b {
  font-size: 13px;
}
.org-inbox.adam .org-inbox-item span {
  flex: 1 1 140px;
  white-space: normal;
  line-height: 1.35;
}
.org-inbox.adam .org-inbox-item .org-inbox-why {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  cursor: pointer;
}
.org-inbox.adam .org-inbox-item .org-inbox-why.is-open {
  display: block;
  -webkit-line-clamp: unset;
}
.org-inbox.adam .org-inbox-item .org-inbox-held {
  display: block;
  width: 100%;
  font-size: 12px;
  line-height: 1.4;
  color: var(--warn, #e0a85a);
}
.org-inbox.adam .org-inbox-actions {
  margin-left: auto;
}
.org-inbox-item.handling {
  width: 100%;
  padding: 8px 6px;
  border-radius: 8px;
  border: 1px solid var(--line);
  margin: 0;
}
.org-inbox-item.handling span {
  white-space: normal;
  line-height: 1.35;
}
.org-inbox-item.ping b::before {
  display: none;
}
details.cron-card.compact > .cron-glance {
  margin: 0;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.35;
}
details.cron-card.compact:not([open]) > .cron-next,
details.cron-card.compact:not([open]) > .cron-more {
  display: none;
}
details.cron-card.compact:not([open]) > .cron-glance,
details.cron-card.compact:not([open]) > .need-actions {
  display: flex;
}
details.cron-card.handled.compact.failed > .need-actions {
  margin-top: 4px;
}
details.cron-card.compact[open] > .cron-glance {
  display: block;
}
.org-inbox-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.org-inbox-actions .ghost-btn,
.org-inbox-actions .send {
  font-size: 11px;
  padding: 3px 8px;
}
.need-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.need-actions .send,
.need-actions .ghost-btn {
  font-size: 12px;
  padding: 5px 10px;
}
.need-actions .ghost-btn.danger {
  color: var(--danger, #d36b5b);
  border-color: var(--danger, #d36b5b);
}
.org-avatar[data-life="working"] {
  box-shadow: 0 0 0 2px var(--mint);
}
.org-avatar[data-life="blocked"] {
  box-shadow: 0 0 0 2px var(--bronze);
}
.org-avatar[data-life="offline"] {
  opacity: 0.45;
}
.pair-urls {
  display: grid;
  gap: 6px;
  margin: 8px 0;
}
.pair-url {
  text-align: left;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.login-form {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  max-width: 420px;
}
.login-saved { display: flex; flex-wrap: wrap; gap: 6px; }
.check-line {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--muted);
}
.check-line input { width: auto; }
.drawer-sub {
  margin: 18px 0 8px;
  font-size: 14px;
  font-weight: 600;
}
.org-btn:hover { color: var(--bronze); }
.org-staff { font-size: 13px; letter-spacing: 0.02em; padding: 10px; border-radius: 10px; height: 72px; }
.org-project { margin: 2px 0 8px; min-width: 0; position: relative; z-index: 0; }
.org-todos-slot {
  flex-shrink: 0;
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: var(--bg-rail);
  border-top: 1px solid var(--line);
  z-index: 2;
}
.org-todos-slot:has(.org-todos:not(.collapsed)) {
  max-height: min(40vh, 16rem);
  overflow: auto;
}
.org-todos {
  margin: 0;
  padding: 6px 8px 4px;
  border-top: 0;
  min-width: 0;
  position: relative;
  bottom: auto;
  background: transparent;
  z-index: 1;
  isolation: auto;
  box-shadow: none;
  overflow: auto;
  max-height: min(36vh, 14rem);
}
.org-todos.collapsed {
  max-height: none;
  overflow: visible;
}
.org-todos-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink);
  padding: 8px 10px;
  background: var(--bg-rail);
  border: 1px solid var(--line);
  border-radius: 8px;
  cursor: pointer;
  user-select: none;
  position: sticky;
  top: 0;
  bottom: auto;
  z-index: 2;
  flex-shrink: 0;
  transition: background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.org-todos-body {
  background: transparent;
  position: relative;
  z-index: 1;
}
.org-todos-head:hover {
  background: color-mix(in srgb, var(--bronze-soft) 30%, var(--bg) 70%);
  border-color: var(--bronze);
  color: var(--bronze);
}
.org-todos-head:focus-visible {
  outline: 2px solid var(--bronze);
  outline-offset: 2px;
}
.org-todos-chevron {
  display: inline-block;
  font-size: 11px;
  line-height: 1;
  transition: transform var(--dur-fast) var(--ease-out);
}
.org-todos.collapsed .org-todos-chevron {
  transform: rotate(-90deg);
}
.org-todos.collapsed .org-todos-body {
  display: none;
}
.org-todos-count {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--bronze);
  background: var(--bronze-soft);
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
}
.org-project-todo { margin-bottom: 4px; }
.org-project-todo .org-row {
  grid-template-columns: minmax(0, 1fr);
}
.org-project-todo .org-twist {
  display: none;
}
.org-project-todo .org-btn,
.org-project-todo .org-desk-card {
  height: auto;
  min-height: 48px;
  opacity: 1;
  border-color: var(--line);
  padding: 6px 8px;
}
.org-project-todo .org-btn-text { gap: 1px; min-width: 0; }
.org-project-todo .org-btn b,
.org-project-todo .org-lamp,
.org-project-todo .org-now {
  white-space: nowrap;
  display: block;
  -webkit-line-clamp: unset;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: normal;
  word-wrap: normal;
}
.org-project-todo .org-desk-card:hover,
.org-project-todo .org-desk-card.on {
  opacity: 1;
}
.org-project-todo .org-avatar { border-color: rgba(143, 191, 178, 0.25); }
.org-todos-empty {

  font-size: 11px;
  color: var(--muted);
  padding: 4px 10px 8px;
  opacity: 0.75;
}
.org-scratch {
  margin: 8px 0 4px;
  padding-top: 8px;
  border-top: 1px dashed var(--line);
}
.org-scratch summary {
  cursor: pointer;
  font-size: 11.5px;
  letter-spacing: 0.04em;
  color: var(--muted);
  padding: 4px 8px 8px;
  list-style: none;
}
.org-scratch summary::-webkit-details-marker { display: none; }
.org-scratch[open] summary { color: var(--ink); }
.org-role-todo {
  font-weight: 400;
  opacity: 0.7;
}
.org-row {
  display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: center;
  gap: 2px;
  min-width: 0;
}
.org-row .org-btn { 
  padding-left: 8px;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
}
.org-twist {
  background: transparent; color: var(--muted); border: 0;
  cursor: pointer; padding: 10px 0 0; font-size: 11px;
}
.org-role {
  display: none;
}
.org-x {
  background: transparent; color: var(--muted); border: 0;
  cursor: pointer; padding: 4px 6px;
}
.org-x:hover { color: var(--bronze); }
.org-workers { display: none; padding: 0 0 4px 22px; gap: 2px; }
.org-project.open .org-workers { display: grid; }
.worker-row { grid-template-columns: minmax(0, 1fr) auto; }
.org-row.worker-row { grid-template-columns: minmax(0, 1fr); padding-left: 0; }
.add-project { display: grid; gap: 4px; }
.node-menu {
  position: fixed;
  right: auto;
  top: auto;
  width: min(320px, calc(100vw - 16px));
  max-height: 80vh;
  overflow: auto;
  z-index: 40;
}
.node-menu.ceo-add {
  width: min(520px, calc(100vw - 24px));
  max-height: min(92vh, 780px);
  padding: 16px 14px 18px;
  overflow: auto;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45);
}
.node-menu.ceo-add .menu-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 4px;
  min-width: 0;
}
@media (max-width: 520px) {
  .node-menu.ceo-add .menu-grid-2 { grid-template-columns: 1fr; }
}
.node-menu.ceo-add .menu-field {
  padding: 6px 10px 8px;
}
.node-menu.ceo-add .menu-field input {
  padding: 9px 10px;
  font-size: 13px;
}
.node-menu .menu-head {
  margin: 0 10px 4px;
  font-family: var(--display);
  font-size: 18px;
  font-weight: 500;
  color: var(--ink);
}
.node-menu .menu-field {
  display: grid;
  gap: 6px;
  padding: 8px 10px 10px;
  min-width: 0;
}
.node-menu .menu-field.menu-actions {
  padding-top: 4px;
}
.node-menu .menu-field.menu-auth {
  border: 1px solid var(--line);
  border-radius: 12px;
  margin: 4px 10px 8px;
  padding: 10px 12px;
  gap: 8px;
}
.node-menu .menu-field.menu-auth legend {
  padding: 0 4px;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.node-menu .menu-field textarea {
  min-height: 88px;
  resize: vertical;
  font: inherit;
  font-size: 12px;
}
.node-menu .menu-field select { font: inherit; font-size: 12px; }
.node-menu .menu-field label {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.node-menu .menu-field input { padding: 7px 9px; font-size: 12px; }
.node-menu .menu-note {
  margin: 0 10px 8px;
  font-size: 11px;
  overflow-wrap: anywhere;
}
.node-menu .menu-danger {
  border-top: 1px solid var(--line);
  margin-top: 4px;
}
.node-menu .ghost-btn.danger {
  color: #f2c4c4;
  border-color: rgba(242, 196, 196, 0.35);
}
.channel-banner {
  margin: 2px 4px 8px;
  font-size: 11px;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.empty-stream b { color: var(--ink); font-weight: 600; }
.empty-wire {
  font-size: 12px !important;
  overflow-wrap: anywhere;
}
.wire-card {
  display: grid;
  gap: 8px;
  margin-bottom: 14px;
}
.wire-card div {
  display: grid;
  gap: 2px;
}
.wire-card dt {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.wire-card dd { margin: 0; overflow-wrap: anywhere; font-size: 13px; }
.bubble.from-telegram .bubble-text { opacity: 0.92; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;
}
.activity { display: grid; flex-shrink: 0; max-height: 40%; overflow: auto; }
.activity-job {
  display: grid; grid-template-columns: 8px 1fr auto; gap: 10px; align-items: center;
  width: 100%; text-align: left;
  background: transparent; color: var(--ink); border: 0;
  border-top: 1px solid var(--line); padding: 10px 14px; cursor: pointer;
}
.activity-job .pip {
  width: 6px; height: 6px; border-radius: 50%; background: var(--line);
}
.activity-job .pip.oc { background: var(--bronze); }
.activity-job .pip.ha { background: var(--mint); }
.activity-job b { font-weight: 500; font-size: 12px; }
.activity-job small { color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.activity-job:hover { background: rgba(196, 165, 116, 0.05); }
.chat-col {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  height: 100%;
  overflow: hidden;
}
.chat-shell {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 16px 12px;
}
.chat-context {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
  min-width: 0;
}
/* Activity open: stream + composer keep their size; sheet is a drawer over the thread */
.chat-shell.work-open .index,
.chat-shell.activity-open .index,
.chat-shell.work-open .chat-context,
.chat-shell.activity-open .chat-context,
.chat-shell.work-open .lanes,
.chat-shell.activity-open .lanes { display: none; }
.chat-shell.work-open .stream,
.chat-shell.activity-open .stream {
  display: flex;
  flex: 1 1 auto;
  min-height: 7rem;
}
.chat-shell.work-open .activity-sheet:not([hidden]),
.chat-shell.activity-open .activity-sheet:not([hidden]) {
  display: flex;
  background: var(--panel);
}
.work-status {
  display: grid;
  gap: 6px;
  flex-shrink: 0;
  min-width: 0;
  padding: 8px 14px 6px;
  border-top: 0;
  margin: 0;
}
.work-status[hidden] { display: none !important; }
.work-status-live {
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.work-status-live.on { color: #d8b36a; }
.work-status-live.warn { color: var(--danger); }
.work-status-live[hidden] { display: none !important; }
.work-status-index {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}
.work-status-index > div {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.work-status-index dt {
  margin: 0;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.work-status-index dd {
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  color: var(--ink);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.work-status-index dd.blocker { color: var(--danger); }
.work-status-index dd.empty { color: var(--muted); }
.diff-fold summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  cursor: pointer;
  color: var(--muted);
  font-size: 13px;
}
.chat-head {
  display: grid;
  gap: 2px;
  padding: 14px 4px 8px;
  flex-shrink: 0;
  min-width: 0;
}
.chat-head-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.work-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  flex-shrink: 0;
  justify-content: flex-end;
}
.work-peek {
  justify-content: flex-start;
  width: 100%;
  gap: 0 2px;
  padding: 2px 0 0;
}
.work-peek .work-tab {
  padding: 4px 8px;
  font-size: 11px;
}
.work-tab {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  border-radius: 999px;
  padding: 5px 10px;
  font: inherit;
  font-size: 12px;
  color: var(--muted);
  cursor: pointer;
  transition:
    color var(--dur-fast) var(--ease-out),
    background var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-spring);
}
.work-tab:hover { color: var(--bronze); }
.work-tab:active { transform: scale(0.97); }
.work-tab.on {
  background: var(--bronze-soft);
  color: var(--bronze);
}
.work-tab.hot { color: var(--ink); }
.work-tab.hot .n { color: var(--bronze); }
.work-tab.need .n { color: var(--danger); opacity: 1; }
.work-tab .n {
  margin-left: 4px;
  font-size: 11px;
  color: inherit;
  opacity: 0.8;
}
.work-tab .n.muted {
  opacity: 0.35;
  font-weight: 400;
}
.work-toggle-btn {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  border-radius: 999px;
  padding: 5px 12px;
  font: inherit;
  font-size: 12px;
  color: var(--muted);
  cursor: pointer;
  flex-shrink: 0;
  transition:
    color var(--dur-fast) var(--ease-out),
    background var(--dur-fast) var(--ease-out);
}
.work-toggle-btn:hover { color: var(--bronze); }
.work-toggle-btn.on {
  background: var(--bronze-soft);
  color: var(--bronze);
}
.work-toggle-btn.hot { color: var(--ink); }
.work-toggle-btn.need .n { color: var(--danger); opacity: 1; }
.work-toggle-btn .n {
  margin-left: 4px;
  font-size: 11px;
  color: inherit;
  opacity: 0.8;
}
.work-toggle-btn .n.muted {
  opacity: 0.35;
  font-weight: 400;
}
.activity-bar .work-tabs {
  flex: 1 1 auto;
  justify-content: flex-start;
  min-width: 0;
}
.work-peek[hidden] { display: none !important; }
/* Phase 1 desk — one fused ribbon + composer cluster (bronze/ink tokens only) */
.chat-dock {
  display: grid;
  gap: 8px;
  flex-shrink: 0;
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 10px 10px 12px;
  border: 1px solid var(--track);
  border-radius: 20px;
  background: color-mix(in srgb, var(--panel) 94%, #000);
  box-shadow: var(--shadow-soft), var(--shadow-inset);
  position: sticky;
  bottom: 0;
  z-index: 8;
}
.chat-dock .composer {
  position: static;
  z-index: auto;
  margin: 0;
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.chat-dock .composer:focus-within {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 0 0 1px color-mix(in srgb, var(--bronze) 34%, transparent);
}
.work-ribbon {
  display: flex;
  flex-shrink: 0;
  gap: 2px;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 4px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  border: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg) 82%, #000);
  box-shadow: inset 0 0 0 1px var(--track), inset 0 1px 2px rgba(0, 0, 0, 0.22);
}
.work-ribbon::-webkit-scrollbar { display: none; }
.work-ribbon .ribbon-seg {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  scroll-snap-align: start;
  white-space: nowrap;
  min-height: 32px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 12.5px;
  line-height: 1.2;
}
.work-ribbon .ribbon-seg.on {
  background: var(--bronze-soft);
  color: var(--bronze);
  box-shadow: var(--shadow-inset);
}
.work-ribbon .ribbon-seg.hot { color: var(--ink); }
.work-ribbon .ribbon-seg.stale { color: #c9a66b; }
.work-ribbon .ribbon-seg.stale .n {
  background: rgba(201, 166, 107, 0.25);
  color: #e8d4b0;
}
.work-ribbon .ribbon-seg.hot .n {
  color: var(--bronze);
  background: var(--bronze-soft);
  opacity: 1;
}
.work-ribbon .ribbon-seg.need { color: var(--ink); }
.work-ribbon .ribbon-seg.need .n {
  color: #f0b39e;
  background: rgba(201, 137, 106, 0.14);
  opacity: 1;
}
.work-ribbon .ribbon-seg.is-fail.need {
  background: rgba(201, 137, 106, 0.1);
  color: #f0b39e;
}
.work-ribbon .ribbon-seg.is-fail.need .n { color: #f0b39e; }
.work-ribbon .ribbon-seg .n {
  font-variant-numeric: tabular-nums;
  margin-left: 0;
  min-width: 1.4em;
  text-align: center;
  font-size: 11.5px;
  padding: 1px 7px;
  border-radius: 999px;
  background: rgba(243, 234, 216, 0.1);
}
.horizon-board { display: grid; gap: 10px; }
.horizon-row label {
  display: block;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 4px;
}
.horizon-row textarea {
  width: 100%;
  min-height: 52px;
  resize: vertical;
  font: inherit;
}
.wire-on { color: var(--mint, #8fbf9f); font-size: 11px; }
.wire-off { color: var(--muted); font-size: 11px; }
.wire-error {
  margin: 8px 0 0;
  color: var(--danger);
  font-size: 12px;
  line-height: 1.4;
}
.ceo-auth-wire {
  display: grid;
  gap: 8px;
}
.ceo-auth-wire h4 { margin: 0; }
#ceoToolsStatus.error { color: var(--danger); }
.tool-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  flex-shrink: 0;
}
.tool-tab {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  border-radius: 999px;
  padding: 5px 10px;
  font: inherit;
  font-size: 12px;
  color: var(--muted);
  cursor: pointer;
  transition:
    color var(--dur-fast) var(--ease-out),
    background var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-spring);
}
.tool-tab:hover { color: var(--bronze); }
.tool-tab:active { transform: scale(0.97); }
.tool-tab.on {
  background: var(--bronze-soft);
  color: var(--bronze);
}
.ceo-live {
  margin: 8px 0 2px;
  padding: 8px 2px 2px;
  border: 0;
  border-radius: 0;
  background: transparent;
  max-height: none;
  overflow: visible;
  cursor: pointer;
}
.ceo-pulse {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
}
.live-watch-btn {
  flex-shrink: 0;
  font-size: 11px;
  padding: 4px 10px;
  min-height: 32px;
}
.ceo-pulse-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
  flex: 1;
}
.ceo-pulse-copy b {
  font-weight: 500;
  font-size: 13px;
  color: var(--ink);
}
.ceo-pulse-copy span {
  font-size: 12px;
  color: var(--muted);
}
.ceo-pulse-result {
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink);
}
.ceo-pulse em {
  font-style: normal;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--danger);
  flex-shrink: 0;
}
.ceo-next {
  margin: 6px 0 0 17px;
  font-size: 12px;
  color: var(--muted);
}
.ceo-live[hidden] { display: none; }
.ceo-live.warn .ceo-pulse-copy b { color: var(--danger); }
.ceo-live-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
.ceo-live-head b {
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--bronze);
}
.ceo-live.on .ceo-live-head b { color: #d8b36a; }
.ceo-live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--muted);
  flex-shrink: 0;
}
.ceo-live.on .ceo-live-dot {
  background: #c9a227;
  box-shadow: 0 0 0 4px rgba(201, 162, 39, 0.18);
  animation: ceo-live-pulse 1.4s ease-in-out infinite;
}
@keyframes ceo-live-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}
.ceo-live p {
  margin: 0 0 4px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink);
}
.ceo-live p:last-child { margin-bottom: 0; color: var(--muted); }
.ceo-live-item {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 13px;
  line-height: 1.4;
  margin: 0 0 4px;
}
.ceo-live-item span { color: var(--muted); }
.ceo-lanes {
  display: grid;
  grid-template-columns: 1fr 1.3fr 1fr;
  gap: 10px;
  margin: 4px 0 8px;
}
.ceo-lanes.one { grid-template-columns: 1fr; }
.ceo-lane {
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #100f0d;
}
.ceo-lane.hot { border-color: #c9a227; }
.ceo-lane h3 {
  margin: 0 0 6px;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--bronze);
}
.ceo-lane-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin: 0 0 4px;
  font-size: 13px;
  line-height: 1.35;
}
.ceo-lane-row span { color: var(--muted); font-size: 12px; }
.ceo-lane-result {
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink);
}
.cron-empty {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--muted);
}
.gateway-off {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  background: #161411;
}
.gateway-off .cron-head span { color: var(--muted); }
.gateway-restart { margin-top: 8px; }
.cron-meta {
  margin: 0;
  font-size: 11px;
  color: var(--muted);
}
@media (max-width: 820px) {
  .ceo-lanes { grid-template-columns: 1fr; }
}
.ceo-brief {
  margin: 10px 0 4px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #161411;
}
.ceo-brief[hidden] { display: none; }
.ceo-brief p {
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink);
}
.ceo-brief p:last-child { margin-bottom: 0; color: var(--muted); }
.chat-schedule,
.activity-sheet {
  display: none;
  flex: 1;
  flex-direction: column;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: var(--bg);
  overflow: hidden;
}
/* Phase 1 desk — sheet is a drawer over the thread, not a second app.
   Absolute overlay: stream keeps its size and scroll position underneath,
   dock (z 8) stays tappable above the sheet (z 7). */
.activity-sheet:not([hidden]),
.chat-shell.activity-open .activity-sheet:not([hidden]) {
  display: flex;
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  top: auto;
  flex: none;
  max-height: min(62%, 26rem);
  border: 1px solid var(--track);
  border-radius: 18px;
  background: var(--panel);
  box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.45), var(--shadow-card);
  z-index: 7;
  overflow: hidden;
  animation: otto-rise-in var(--dur-slow) var(--ease-out);
}
.chat-shell.activity-open .activity-sheet:not([hidden]),
.chat-shell.work-open .activity-sheet:not([hidden]) {
  z-index: 35;
  bottom: calc(var(--chat-dock, 148px) + 10px);
}
.chat-shell.activity-open .chat-dock,
.chat-shell.work-open .chat-dock {
  z-index: 10;
}
.activity-sheet:not([hidden]):has(.truth-console) {
  max-height: min(88vh, calc(100vh - var(--chat-dock, 140px) - 20px));
}
@media (min-width: 1024px) {
  .activity-sheet:not([hidden]):has(.truth-console) {
    max-height: min(78vh, 44rem);
  }
}
.activity-sheet[hidden],
.chat-schedule[hidden] { display: none !important; }
.activity-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-shrink: 0;
  flex-wrap: wrap;
  min-height: 48px;
  padding: 8px 8px 8px 16px;
  border-bottom: 1px solid var(--track);
}
.activity-bar-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  margin-left: auto;
}
.activity-expand-chat {
  font-size: 11px;
  padding: 4px 8px;
  white-space: nowrap;
}
.activity-bar > span:not(#activityTitle) {
  font-size: 13px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bronze);
}
#activityTitle,
#activityTitle .activity-title-main,
#activityTitle .activity-title-sub {
  text-transform: none;
  letter-spacing: 0.02em;
  color: var(--ink);
}
.activity-close {
  appearance: none;
  border: 1px solid var(--track);
  background: color-mix(in srgb, var(--panel) 82%, #0a0908);
  color: var(--ink);
  font: inherit;
  font-size: 13px;
  min-height: 36px;
  padding: 6px 16px;
  cursor: pointer;
  border-radius: 999px;
  box-shadow: var(--shadow-soft), var(--shadow-inset);
}
.activity-close:hover { color: var(--bronze); border-color: var(--bronze); }
.activity-body {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 6px 16px 16px;
  display: grid;
  align-content: start;
  gap: 2px;
}
.activity-body .cron-meta { display: none; }
.activity-body .cron-card.schedule-roster .cron-meta { display: grid; }
.cron-story { display: none; }
.cron-section {
  margin: 8px 0 0;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bronze);
}
.cron-more { margin-top: 6px; }
.cron-more summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 12px;
}
.cron-card.live {
  border-left: 2px solid var(--bronze);
  padding-left: 10px;
}
.cron-card.live .cron-head span { color: var(--bronze); }
.cron-card.stuck {
  border-left: 2px solid var(--danger);
  padding-left: 10px;
}
.cron-card.stuck .cron-head span { color: var(--danger); }
.cron-card.failed .cron-head span { color: var(--danger); }
.cron-snip {
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 1.4;
  color: var(--muted);
  white-space: pre-wrap;
}
.cron-retry {
  justify-self: stretch;
  width: 100%;
  margin-top: 8px;
  min-height: 44px;
  border-radius: 999px;
}
.cron-stale {
  margin: 8px 0 0;
  border-top: 1px solid var(--line);
  padding-top: 8px;
}
.cron-stale summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  cursor: pointer;
  color: var(--muted);
  font-size: 13px;
}
.cron-cluster .cron-stale {
  border-top: 0;
  padding-top: 4px;
}
.cron-card {
  display: grid;
  gap: 4px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}
.cron-card:last-child { border-bottom: 0; }
details.cron-card > .cron-outcome,
details.cron-card > .cron-next,
details.cron-card > .cron-more,
details.cron-card > .cron-retry,
details.cron-card > .need-actions { display: none; }
details.cron-card[open] > .cron-outcome,
details.cron-card[open] > .cron-next,
details.cron-card[open] > .cron-more { display: block; }
details.cron-card[open] > .cron-retry,
details.cron-card[open] > .need-actions { display: flex; }
.cron-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  min-height: 44px;
  cursor: pointer;
  list-style: none;
}
.cron-head::-webkit-details-marker { display: none; }
.cron-head span { color: var(--muted); }
.cron-outcome, .cron-next {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}
.cron-card pre {
  white-space: pre-wrap;
  font-size: 11px;
  max-height: 220px;
  overflow: auto;
}
.chat-where {
  font-family: var(--display);
  font-size: 23px;
  letter-spacing: -0.01em;
  text-transform: none;
  text-wrap: balance;
  font-weight: 500;
  color: var(--ink);
  line-height: 1.15;
}
.chat-model {
  font-size: 12px;
  color: var(--muted);
}
.chat-folder {
  font-size: 13px;
  color: var(--muted);
  opacity: 0.92;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.45;
  margin-top: 3px;
  max-width: 60ch;
}
.lanes {
  display: none;
}
.lane,
.route-btn {
  appearance: none;
  -webkit-appearance: none;
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 12px;
  color: var(--muted);
  flex: 0 0 auto;
  position: relative;
  background: transparent;
  border: 0;
  cursor: pointer;
  font: inherit;
}
.lane:hover,
.route-btn:hover { color: var(--bronze); }
.lane.on,
.route-btn.on { background: var(--bronze-soft); color: var(--bronze); }
.lane.has::after {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--bronze);
  position: absolute;
  top: 5px;
  right: 6px;
}
.lane.working,
.route-btn.working {
  color: var(--ink);
  border-color: var(--bronze);
  box-shadow: 0 0 0 1px var(--bronze);
}
.lane-pill {
  justify-self: start;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bronze);
}
.stream .lane-focus {
  box-shadow: inset 3px 0 0 var(--bronze);
}
.reply-chip {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #161411;
  min-width: 0;
}
.reply-chip.hidden { display: none; }
.reply-chip-kicker {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bronze);
  white-space: nowrap;
}
.reply-chip-text {
  font-size: 12px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.reply-chip-clear {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 16px;
  line-height: 1;
  padding: 0 4px;
}
.reply-chip-clear:hover { color: var(--bronze); }
#queueChip .ghost-btn {
  height: auto;
  padding: 4px 8px;
  font-size: 12px;
}
.bubble-quote {
  margin: 0 0 6px;
  padding: 0 0 0 10px;
  border-left: 2px solid var(--bronze);
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.seats {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  padding: 0 0 12px;
  overflow-x: auto;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}
.bot {
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 12px;
  color: var(--muted);
  flex: 0 0 auto;
}
.bot:hover { color: var(--bronze); border-color: var(--bronze); }
.bot.on { background: var(--bronze-soft); }
.bot.working {
  color: var(--ink);
  border-color: var(--bronze);
  box-shadow: 0 0 0 1px var(--bronze);
}
.seat-hint {
  margin: -4px 0 8px;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
}
.index {
  margin: 0;
  padding: 4px 0 8px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid transparent;
  flex-shrink: 0;
  min-width: 0;
  position: relative;
  z-index: 0;
}
.index[open] { border-bottom-color: var(--line); }
.index summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0;
  display: block;
  padding: 2px 0 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.index summary::-webkit-details-marker { color: var(--muted); }
.status-card {
  margin: 8px 0 4px;
  min-width: 0;
}
.status-fields {
  display: grid;
  gap: 10px;
  margin: 0;
}
.status-row { display: grid; gap: 2px; min-width: 0; }
.status-row dt {
  margin: 0;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}
.status-row dd {
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.status-row.stuck dd { color: var(--danger); }
.status-row dd.empty { color: var(--muted); }
.status-hint {
  margin: 10px 0 0;
  font-size: 11px;
  color: var(--muted);
  line-height: 1.4;
}
.index pre {
  margin: 10px 0 8px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-size: 12px;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  max-height: 180px;
  overflow: auto;
}

.cron-card.late .cron-head span { color: var(--bronze); }
.cron-card.schedule-roster .cron-meta.schedule-row { display: grid; }
.activity-body .cron-card.schedule-roster .cron-meta { display: grid; }
.schedule-roster-head {
  margin: 0 0 8px;
  font-size: 12px;
  color: var(--muted);
}
.schedule { display: grid; gap: 4px; padding: 0 0 8px; }
.schedule[hidden] { display: none; }
.schedule-row {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px;
  font-size: 12px; color: var(--muted);
}
.schedule-row b { color: var(--ink); font-weight: 500; }
.composer {
  margin: 0;
  padding: 12px 16px;
  border: 0;
  background: rgba(28, 26, 22, 0.94);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "autocomplete" "reply" "queue" "attachments" "input" "hint";
  gap: 6px;
  border-radius: 22px;
  flex-shrink: 0;
  position: sticky;
  bottom: 0;
  z-index: 8;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  box-shadow: var(--shadow-soft), var(--shadow-inset);
  transition: box-shadow var(--dur-med) var(--ease-out);
}
.composer:focus-within {
  border-color: transparent;
  box-shadow: var(--shadow-soft), 0 0 0 1px color-mix(in srgb, var(--bronze) 34%, transparent);
}
.composer .seat-autocomplete { grid-area: autocomplete; }
.composer .reply-chip { grid-area: reply; }
.composer #queueChip { grid-area: queue; }
.composer .attachments-preview { grid-area: attachments; }
.composer .composer-input-row { grid-area: input; }
.composer-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  padding: 0 2px;
}
.composer-meta .route-select {
  width: 5.6rem;
  flex: 0 0 5.6rem;
  text-align: right;
}
.composer-who {
  margin: 0;
  padding: 0;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bronze);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.route {
  display: flex;
  flex-wrap: nowrap;
  gap: 2px;
  overflow-x: auto;
  min-width: 0;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #161411;
}
.route-btn { padding: 4px 10px; font-size: 11px; }
.composer-hint {
  grid-area: hint;
  margin: 0;
  padding: 0 4px 2px;
  font-size: 12px;
  color: var(--muted);
  min-width: 0;
  overflow-wrap: anywhere;
}
.composer-hint.hidden { display: none; }
.composer-input-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  min-width: 0;
}
.composer-input-row:has(.route-hatch:not([hidden])) {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}
.route-hatch {
  position: relative;
  align-self: center;
  min-width: 0;
}
.route-hatch[hidden] { display: none !important; }
.route-hatch summary {
  list-style: none;
  cursor: pointer;
  color: var(--muted);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 2px;
}
.route-hatch summary::-webkit-details-marker { display: none; }
.route-hatch summary.forced { color: var(--bronze); }
.route-menu {
  display: none;
  position: absolute;
  right: 0;
  bottom: calc(100% + 6px);
  min-width: 7.5rem;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #161411;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
  z-index: 9;
}
.route-hatch[open] .route-menu { display: grid; gap: 2px; }
.route-menu button {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  text-align: left;
  min-height: 36px;
  padding: 0 10px;
  border-radius: 8px;
  cursor: pointer;
}
.route-menu button:hover,
.route-menu button.on { color: var(--ink); background: var(--bronze-soft); }
.route-select {
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 5.6rem;
  width: 5.6rem;
  max-width: 5.6rem;
  background: transparent;
  color: var(--muted);
  border: 0;
  padding: 0 14px 0 0;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 0;
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg width="8" height="5" viewBox="0 0 10 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L5 5L9 1" stroke="%238a8176" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  background-repeat: no-repeat;
  background-position: right 0 center;
  min-width: 0;
}
.route-select:hover,
.route-select:focus {
  outline: none;
  color: var(--bronze);
  box-shadow: none;
  border: 0;
}
.route-select.working {
  color: var(--bronze);
  animation: select-pulse 1.5s ease-in-out infinite;
}
@keyframes select-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.75;
  }
}
.attach-btn {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 1px solid var(--line);
  color: var(--ink);
  padding: 10px 12px;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  border-radius: 8px;
  transition: all 0.15s;
}
.attach-btn:hover {
  border-color: var(--bronze);
  color: var(--bronze);
}
.attachments-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 4px 0;
}
.attachments-preview.hidden { display: none; }
.attachment-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  font-size: 13px;
  max-width: 280px;
}
.attachment-thumb {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 4px;
  flex-shrink: 0;
}
.attachment-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  background: var(--panel);
  font-size: 20px;
  flex-shrink: 0;
}
.attachment-info {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.attachment-name {
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
}
.attachment-size {
  color: var(--muted);
  font-size: 11px;
}
.attachment-remove {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  color: var(--muted);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  padding: 2px 4px;
  transition: color 0.15s;
}
.attachment-remove:hover {
  color: var(--danger);
}

.connector-matrix {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 1rem 0;
  font-size: 0.9rem;
}

.connector-row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(180px, 2fr) auto auto auto auto;
  gap: 0.5rem;
  align-items: center;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.375rem;
  background: var(--page);
}

.connector-row-header {
  background: transparent;
  border: none;
  font-weight: 600;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid var(--line);
}

.connector-row-popular {
  background: rgba(201, 166, 107, 0.06);
  border-color: rgba(201, 166, 107, 0.2);
}

.connector-name {
  font-weight: 500;
}

.connector-name-desc {
  color: var(--muted);
  font-size: 0.85rem;
}

.popular-skills-section {
  margin: 1rem 0 0.5rem 0;
}

.popular-skills-section h4 {
  margin: 0 0 0.25rem 0;
}

.popular-skills-divider {
  margin: 1.5rem 0 0.5rem 0;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
}

.popular-skills-divider h4 {
  margin: 0 0 0.5rem 0;
}

.connector-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 3.5rem;
}

.connector-cell label {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  cursor: pointer;
  user-select: none;
}

.connector-cell input[type="checkbox"] {
  margin: 0;
}

.connector-cell-disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.connector-cell-disabled label {
  cursor: not-allowed;
}

.composer.drag-over {
  border-color: var(--bronze);
  background: var(--bronze-soft);
}
.card .job-actions { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.card.live .meta { color: var(--bronze); }
.card.wall { border-left: 3px solid var(--danger); }
.ceo-tools { display: grid; gap: 10px; padding-top: 12px; border-top: 1px solid var(--line); }
.ceo-tools.hidden { display: none; }
.ceo-seats { align-items: end; }
.ceo-seats select { width: 100%; }
.composer textarea {
  min-height: 44px;
  max-height: 160px;
  resize: none;
  border: 0;
  background: transparent;
  padding: 8px 0;
  overflow-y: auto;
}
.seat-list { display: grid; gap: 12px; }
.seat-card {
  display: grid; gap: 10px;
  padding: 14px 16px; border: 1px solid var(--line); background: var(--bg);
  border-radius: var(--radius);
  min-width: 0;
}
.seat-card header {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  min-width: 0;
}
.seat-card h3 { margin: 0; font-size: 15px; font-weight: 500; }
.seat-card .engine {
  display: block; margin-top: 2px;
  color: var(--muted); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
}
.seat-card .price { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.seat-card select { padding: 10px 12px; max-width: 100%; }
.seat-card select:disabled { opacity: 0.72; }
.seat-guide { margin: 6px 0 0; font-size: 11px; color: var(--muted); line-height: 1.4; overflow-wrap: anywhere; }
.seat-check { margin: 0; font-size: 12px; color: var(--muted); line-height: 1.45; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.model-check {
  display: grid; gap: 8px;
  padding: 12px 14px; margin: 0 0 12px;
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg);
}
.model-check-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; min-width: 0; }
.model-check-head > div { min-width: 0; }
.model-check-head strong { font-size: 14px; font-weight: 500; }
.model-check-head p { margin: 2px 0 0; font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.model-check-head button { flex: none; }
.model-check-note { margin: 0; font-size: 12px; line-height: 1.45; color: var(--muted); overflow-wrap: anywhere; }
@media (max-width: 520px) {
  .model-check-head { flex-direction: column; }
}
.assign-map {
  display: grid; gap: 6px;
  padding: 10px 12px; margin: 0 0 12px;
  border: 1px solid var(--line); border-radius: var(--radius);
  font-size: 12px; line-height: 1.45;
}
.assign-map div { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 8px; }
.assign-map dt { color: var(--muted); letter-spacing: 0.08em; text-transform: uppercase; font-size: 11px; }
.assign-map dd { margin: 0; overflow-wrap: anywhere; }
#rankCite { margin: 8px 0 0; font-size: 11px; overflow-wrap: anywhere; }
.caps { display: flex; gap: 6px; flex-wrap: wrap; }
.menu button { padding: 9px 12px; height: auto; }
.menu small { display: none; }
.workspace { display: none; min-height: 0; min-width: 0; max-width: 100%; }
.workspace.on { display: grid; min-height: 0; height: 100%; max-width: 100%; }
#stage-opencode, #stage-hermes, #stage-openship {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  position: fixed;
  top: 52px;
  left: 0;
  right: 0;
  bottom: 32px;
  visibility: hidden;
  pointer-events: none;
  z-index: 2;
  background: var(--bg);
  min-height: 0;
  min-width: 0;
}
#stage-opencode.on, #stage-hermes.on, #stage-openship.on {
  visibility: visible;
  pointer-events: auto;
}
.engines { font-size: 12px; color: var(--muted); line-height: 1.5; }
.engines b { color: var(--bronze); }
.engines .missing b { color: var(--danger); }
.wizard-step { display: grid; gap: 10px; }
.wizard-step.hidden { display: none; }
.stream {
  flex: 1;
  overflow: auto;
  min-height: 160px;
  min-width: 0;
  padding: 16px 4px 18px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  width: 100%;
}
.empty-stream {
  margin: auto 0;
  padding: 56px 8px 72px;
  display: grid;
  gap: 10px;
  max-width: 28rem;
  min-width: 0;
}
.empty-stream .empty-mark {
  width: 44px;
  height: 44px;
  border-radius: 11px;
  display: block;
}
.empty-kicker {
  margin: 0;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 10px;
  color: var(--bronze);
}
.empty-stream h1 {
  margin: 0;
  font-family: var(--display);
  font-size: 36px;
  font-weight: 500;
  line-height: 1.1;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.empty-stream p {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.55;
}
.empty-now {
  color: var(--ink) !important;
}
.empty-block {
  color: var(--danger) !important;
}
.mobile-cta {
  display: none;
  margin-top: 16px;
  padding: 12px 18px;
  background: var(--bronze-soft);
  border: 1px solid var(--bronze);
  color: var(--bronze);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  text-align: center;
}
.card {
  background: var(--panel);
  border: 0;
  padding: 12px 14px;
  border-radius: var(--radius);
  min-width: 0;
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: box-shadow var(--dur-med) var(--ease-out), transform var(--dur-med) var(--ease-out);
}
.card.user {
  border-left: 0;
  box-shadow: var(--shadow-card), inset 3px 0 0 var(--bronze);
}
.card.brief {
  border-left: 0;
  background: rgba(34, 51, 44, 0.2);
  box-shadow: var(--shadow-card), inset 3px 0 0 var(--mint);
}
.card .meta { font-size: 11px; color: var(--muted); margin-bottom: 8px; overflow-wrap: anywhere; }
.card pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  margin: 0;
  font-size: 14px;
  max-width: 100%;
}
.bubble {
  width: 100%;
  max-width: 100%;
  display: grid;
  gap: 6px;
}
.bubble.user {
  align-self: flex-end;
  width: max-content;
  max-width: 78%;
  min-width: 8rem;
  margin-left: 0;
  background: rgba(201, 166, 107, 0.08);
  border: 0;
  box-shadow: var(--shadow-soft), inset 2px 0 0 var(--bronze);
  padding: 11px 16px;
  border-radius: 14px 14px 4px 14px;
  transition: box-shadow var(--dur-fast) var(--ease-out), opacity var(--dur-fast) var(--ease-out);
}
.bubble.user.queued {
  opacity: 0.78;
}
.bubble-queued {
  font-size: 11px;
  color: var(--muted);
}
.bubble-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.bubble-attachment {
  max-width: 200px;
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
}
.bubble-attachment img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 160px;
  object-fit: cover;
}
.bubble-attachment-file {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: var(--bg);
}
.bubble-attachment-icon {
  font-size: 20px;
}
.bubble-attachment-name {
  font-size: 12px;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bubble.bot {
  align-self: stretch;
  padding: 4px 4px 2px;
  background: transparent;
  border: 0;
  border-radius: 0;
  min-width: 0;
}
.receipt {
  margin: 6px 0 0;
  font-size: 11px;
  letter-spacing: 0.03em;
  color: var(--muted);
}
.receipt-line {
  margin-top: 8px;
  font-size: 12px;
  letter-spacing: 0.02em;
  color: var(--ink);
}
.receipt-line.warn { color: var(--danger); }
.receipt-line.on { color: var(--bronze); }
.receipt-go {
  margin-top: 6px;
  padding: 4px 10px;
  font-size: 12px;
  height: auto;
}
.receipt-fold {
  margin-top: 10px;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.04em;
}
.receipt-fold summary {
  cursor: pointer;
  color: var(--muted);
}
.receipt-fold pre {
  margin: 6px 0 0;
  white-space: pre-wrap;
  font-size: 12px;
  color: var(--ink);
}
.bubble.live .bubble-text { color: var(--muted); }
.bubble.live .bubble-text:empty { display: none; }
.thinking {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
  min-height: 22px;
  min-width: 0;
  margin-bottom: 6px;
}
.thinking.hidden { display: none; }
.thinking-label {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: normal;
}
.thinking-wrap { min-width: 0; }
.thinking-log {
  list-style: none;
  margin: 0 0 8px 26px;
  padding: 0;
  font-size: 12px;
  line-height: 1.4;
  color: var(--muted);
  min-width: 0;
}
.thinking-log[hidden] { display: none; }
.thinking-log li {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 0.7;
}
.thinking-log li:last-child {
  opacity: 1;
  color: var(--ink);
}
.thinking-dots {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  flex-shrink: 0;
}
.thinking-dots i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--bronze);
  animation: think-pulse 1.1s ease-in-out infinite;
}
.thinking-dots i:nth-child(2) { animation-delay: 0.18s; }
.thinking-dots i:nth-child(3) { animation-delay: 0.36s; }
@keyframes think-pulse {
  0%, 80%, 100% { opacity: 0.22; transform: scale(0.8); }
  40% { opacity: 1; transform: scale(1); }
}
.bubble-text {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
  min-width: 0;
  max-width: 100%;
}
.bubble-text p {
  margin: 0 0 0.7em;
  white-space: pre-wrap;
}
.bubble-text p:last-child { margin-bottom: 0; }
.bubble-text .bot-lead {
  color: var(--ink);
  font-size: 16px;
  line-height: 1.55;
}
.bubble-text h3 {
  margin: 0.85em 0 0.35em;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bronze);
  font-weight: 500;
}
.bubble-text ul,
.bubble-text ol {
  margin: 0 0 0.7em;
  padding-left: 1.2em;
}
.bubble-text li { margin: 0.25em 0; }
.bubble-text code {
  font-size: 0.92em;
  background: rgba(28, 26, 22, 0.7);
  padding: 0.05em 0.35em;
  border-radius: 4px;
}
.bot-stats {
  display: grid;
  gap: 8px;
  margin: 0 0 0.7em;
}
.bot-stats:last-child { margin-bottom: 0; }
.bot-stats > div {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}
.bot-stats dt {
  margin: 0;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bronze);
}
.bot-stats dd {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.45;
}
.bubble-work { margin-top: 2px; min-width: 0; }
.bubble-work summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.04em;
}
.bubble-work .muted { margin: 6px 0; font-size: 11px; overflow-wrap: anywhere; }
.bubble-work .ghost-btn { margin-top: 4px; padding: 4px 10px; font-size: 12px; height: auto; }
input, textarea, select {
  width: 100%; background: var(--panel); color: var(--ink);
  border: 1px solid var(--line); padding: 8px 10px; font: inherit;
  border-radius: 8px;
  min-width: 0;
  max-width: 100%;
}
.ghost-btn {
  height: 40px;
  border-radius: 999px;
  white-space: nowrap;
  border: 0;
  background: color-mix(in srgb, var(--panel) 82%, #0a0908);
  color: var(--strong);
  box-shadow: var(--shadow-soft), var(--shadow-inset);
}
.send {
  background: linear-gradient(180deg, color-mix(in srgb, var(--bronze) 90%, #fff) 0%, var(--bronze) 100%);
  color: #1a140c;
  border: 0;
  padding: 8px 14px;
  cursor: pointer;
  height: 40px;
  min-width: 76px;
  border-radius: 999px;
  font-weight: 600;
  letter-spacing: 0.04em;
  white-space: nowrap;
  box-shadow: var(--shadow-soft), var(--shadow-inset);
  transition:
    transform var(--dur-fast) var(--ease-out),
    box-shadow var(--dur-fast) var(--ease-out),
    opacity var(--dur-fast) var(--ease-out);
}
.composer .send {
  height: 44px;
  min-width: 84px;
  border-radius: 999px;
  align-self: end;
}
.send:disabled { opacity: 0.4; cursor: not-allowed; }
.send.stop {
  background: color-mix(in srgb, var(--panel) 80%, #0a0908);
  color: var(--ink);
  border: 0;
  box-shadow: var(--shadow-soft), var(--shadow-inset);
}
.embed-head {
  padding: 10px 16px 12px;
  border-bottom: 1px solid var(--track);
  min-width: 0;
  display: grid;
  gap: 6px;
}
.embed-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  flex-wrap: wrap;
}
.embed-tools {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  min-width: 0;
}
.embed-head .work-tabs { display: none; }
.tool-tabs {
  display: flex;
  gap: 2px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #161411;
}
.tool-tab {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  padding: 6px 12px;
  min-height: 32px;
  border-radius: 999px;
  cursor: pointer;
}
.tool-tab.on {
  background: var(--bronze-soft);
  color: var(--ink);
}
.embed-kicker {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bronze);
}
.embed-head h1 {
  margin: 2px 0 0;
  font-size: 18px;
  font-weight: 500;
  font-family: var(--display);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.embed-hint {
  margin: 0 16px 8px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--muted);
}
.embed-hint strong { color: var(--ink); font-weight: 600; }
.embed-aim {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.embed-aim.wall {
  color: var(--danger);
  border: 1px solid color-mix(in srgb, var(--danger) 45%, var(--line));
  border-radius: var(--radius);
  padding: 12px 14px;
  background: color-mix(in srgb, var(--danger) 8%, transparent);
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}
.embed-live {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--muted);
}
.embed-live[hidden] { display: none; }
.embed-live.on { color: var(--ink); }
.embed-live.warn { color: var(--danger); }
.embed-open {
  height: 32px;
  padding: 0 12px;
  font-size: 12px;
  flex-shrink: 0;
}
.embed { width: 100%; height: 100%; border: 0; background: #0b0a09; min-height: 0; }
.mobile-org-toggle { display: none; } /* Hidden on desktop */
.mobile-settings-btn { display: none; } /* Header gear — mobile only */
.overlay {
  position: fixed; inset: 0; background: rgba(10, 9, 8, 0.86);
  display: grid; place-items: center; z-index: 20; padding: 24px;
}
/* First run blocks the board: sit above the composer dock and work sheet on every width, scroll if tall. */
#firstRun { z-index: 200; overflow-y: auto; }
.overlay.hidden, .drawer.hidden, .menu.hidden, #stage-chat:not(.on), .usage-card.hidden { display: none; }
.drawer-tab.hidden { display: none; }
.stage-btn.hidden { display: none; }
.panel {
  padding: 24px; display: grid; gap: 12px; width: min(520px, 100%);
  background: var(--panel); border: 0;
  border-radius: var(--radius-deep);
  box-shadow: var(--shadow-card), 0 24px 60px rgba(0, 0, 0, 0.35);
  min-width: 0;
}
.panel h2 { margin: 0; font-weight: 500; font-family: var(--display); }
.share-banner { margin: 0 0 8px; color: var(--mint); }
.share-perm { display: grid; gap: 8px; margin: 12px 0; }
.share-perm label { display: flex; gap: 8px; align-items: center; font-size: 14px; }
.share-member { display: grid; gap: 4px; padding: 10px 0; border-top: 1px solid var(--line); }
.share-member b { font-weight: 600; }
.bubble .actor-tag { display: block; font-size: 11px; color: var(--muted); margin-bottom: 4px; }
.settings-wrap { position: relative; }
.menu {
  position: absolute; right: 0; top: calc(100% + 8px);
  width: 280px; z-index: 30; padding: 6px;
  background: var(--panel); border: 0;
  box-shadow: var(--shadow-card);
  border-radius: var(--radius-deep);
  animation: otto-rise-in var(--dur-fast) var(--ease-out);
}
.menu button {
  display: grid; gap: 2px; width: 100%; text-align: left;
  background: transparent; color: var(--ink); border: 0;
  padding: 10px 12px; cursor: pointer; font: inherit;
  border-radius: 8px;
}
.menu button:hover, .menu button:focus-visible { background: var(--bg); color: var(--bronze); outline: none; }
.menu small { color: var(--muted); font-size: 12px; }
.drawer {
  /* Above activity sheet + mobile rail (z=30) so Fix key → Keys is never swallowed */
  position: fixed; inset: 0; z-index: 40;
  display: grid; grid-template-columns: minmax(0, 1fr) min(780px, 100%);
  min-width: 0;
}
.drawer-scrim {
  background: rgba(10, 9, 8, 0.55);
  animation: otto-fade-in var(--dur-med) var(--ease-out);
}
.drawer-card {
  display: grid; grid-template-rows: auto minmax(0, 1fr);
  background: var(--panel); border-left: 1px solid var(--track);
  min-height: 0;
  min-width: 0;
  box-shadow: -12px 0 40px rgba(0, 0, 0, 0.28);
  animation: otto-slide-in var(--dur-slow) var(--ease-out);
}
@keyframes otto-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes otto-slide-in {
  from { transform: translateX(18px); opacity: 0.72; }
  to { transform: translateX(0); opacity: 1; }
}
@keyframes otto-rise-in {
  from { transform: translateY(10px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.drawer-top {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 12px;
  padding: 16px 20px; border-bottom: 1px solid var(--track);
}
.drawer-top h2 { margin: 2px 0 0; font-weight: 500; font-size: 22px; font-family: var(--display); }
.eyebrow { letter-spacing: 0.22em; font-size: 11px; color: var(--bronze); }
.drawer-grid { display: grid; grid-template-columns: 156px minmax(0, 1fr); min-height: 0; min-width: 0; }
.drawer-nav {
  display: flex; flex-direction: column; gap: 2px;
  padding: 12px 10px; border-right: 1px solid var(--track);
  overflow: auto;
}
.drawer-tab {
  text-align: left;
  border: 0;
  border-radius: 10px;
  height: 36px;
  padding: 8px 12px;
}
.drawer-tab.on { background: var(--bronze-soft); }
.drawer-body { overflow: auto; padding: 20px 24px 28px; min-width: 0; }
.drawer-panel { display: none; min-width: 0; }
.drawer-panel.on { display: grid; gap: 16px; align-content: start; }
.lede { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.field { display: grid; gap: 6px; min-width: 0; }
.field label { font-size: 13px; color: var(--bronze); }
.field-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; min-width: 0; }
.model-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.hint { margin: 0; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.actions .muted {
  flex: 1 1 100%;
  margin: 0;
}
.check { display: flex; gap: 8px; align-items: center; color: var(--muted); }
.check input { width: auto; }
.stats {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-size: 12px; color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  background: var(--bg); padding: 10px; border: 1px solid var(--line); margin: 0;
  border-radius: 10px;
  max-width: 100%;
  overflow: auto;
}
.job-log { display: grid; gap: 8px; }
.job-row {
  display: grid; gap: 4px; padding: 10px 12px;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: 10px;
  min-width: 0;
  overflow-wrap: anywhere;
}
.job-id { color: var(--bronze); font-size: 12px; letter-spacing: 0.04em; }
.provider {
  display: grid; gap: 8px;
  border: 1px solid var(--line); padding: 12px 14px; margin-bottom: 8px;
  background: var(--bg);
  border-radius: var(--radius);
  min-width: 0;
}
.provider-top { display: flex; justify-content: space-between; gap: 8px; align-items: center; flex-wrap: wrap; }
.provider .actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.provider .actions .ghost-btn {
  height: 32px;
  padding: 4px 10px;
  font-size: 12px;
}
.provider a { color: var(--bronze); font-size: 12px; }
.key-role {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.45;
}
.provider .key-order { font-variant-numeric: tabular-nums; }
.provider .ghost-btn:disabled {
  opacity: 0.4;
  pointer-events: none;
}
.keys-extra {
  margin-top: 16px;
}
.keys-extra summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 13px;
}
.pills { display: flex; gap: 6px; flex-wrap: wrap; }
.pill {
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  padding: 2px 8px; border: 1px solid var(--line); color: var(--muted);
  border-radius: 999px;
}
.pill.on { border-color: var(--bronze); color: var(--bronze); }
.pill.default { border-color: var(--bronze); color: var(--bronze); }
.usage-card { display: grid; gap: 8px; min-width: 0; }
.usage-card h4 { margin: 0; font-weight: 500; font-size: 13px; color: var(--bronze); }
.usage-card h5 { margin: 8px 0 4px; font-weight: 500; font-size: 12px; color: var(--ink); }

.spend-alerts { margin: 16px 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: rgba(201, 137, 106, 0.05); }
.spend-alert-warning { padding: 8px; margin: 4px 0; border-left: 3px solid #c9a66b; background: rgba(201, 166, 107, 0.1); font-size: 13px; }
.spend-alert-error { padding: 8px; margin: 4px 0; border-left: 3px solid #c9896a; background: rgba(201, 137, 106, 0.1); font-size: 13px; }

.spend-table { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 8px; }
.spend-table th { text-align: left; padding: 8px; border-bottom: 1px solid var(--line); color: var(--muted); font-weight: 500; }
.spend-table td { padding: 8px; border-bottom: 1px solid rgba(44, 40, 34, 0.3); }
.spend-table tr:hover { background: rgba(201, 166, 107, 0.05); }

.trend-chart { margin: 16px 0; }
.trend-svg { display: block; max-width: 100%; height: auto; }

.spend-alert-badge-warning, .spend-alert-badge-error {
  display: inline-block;
  margin-left: 4px;
  font-size: 12px;
  vertical-align: middle;
}
.spend-alert-badge-warning { opacity: 0.9; }
.spend-alert-badge-error { opacity: 1; }

.org-cap-notices { margin: 8px 0; }
.org-cap-notice { display: flex; align-items: center; gap: 8px; padding: 8px 12px; margin: 4px 0; border-radius: 6px; font-size: 12px; }
.cap-notice-warning { border-left: 3px solid #c9a66b; background: rgba(201, 166, 107, 0.1); }
.cap-notice-error { border-left: 3px solid #c9896a; background: rgba(201, 137, 106, 0.1); }
.cap-notice-badge { font-size: 14px; }
.kv { display: grid; gap: 6px; font-size: 13px; min-width: 0; }
.kv div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 8px; min-width: 0; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; color: var(--ink); overflow-wrap: anywhere; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; color: var(--bronze); }
.muted { color: var(--muted); margin: 4px 0 0; font-size: 13px; overflow-wrap: anywhere; }
.report-card {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
  margin: 10px 0 0;
  border: 1px solid var(--line);
  background: var(--bg);
  border-radius: 10px;
  font-size: 12px;
}
.report-card-header {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}
.report-card-header span {
  font-variant-numeric: tabular-nums;
  color: var(--muted);
}
.report-card-header b {
  color: var(--ink);
  font-weight: 500;
}
.report-card-header i {
  font-style: normal;
  color: var(--bronze);
  font-variant-numeric: tabular-nums;
}
.report-result {
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  line-height: 1.4;
  color: var(--muted);
  padding: 8px;
  background: rgba(16, 15, 13, 0.5);
  border-radius: 6px;
}
.report-result:empty::before {
  content: "(empty result)";
  color: var(--muted);
  opacity: 0.6;
}
.report-index-delta {
  display: grid;
  gap: 4px;
  font-size: 11px;
}
.report-index-delta div {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 8px;
}
.report-index-delta dt {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 10px;
}
.report-index-delta dd {
  margin: 0;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.report-index-delta dd.empty {
  color: var(--muted);
  opacity: 0.7;
}
.report-index-delta .blocker {
  color: var(--danger);
}
.credit { color: var(--muted); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.diff-wrap { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 10px; min-width: 0; }
.gate-line { font-size: 11px; color: var(--muted); margin: 8px 0 0; overflow-wrap: anywhere; }
.gate-line.approval { color: var(--bronze); }
.gate-line.blocked { color: #c45c4a; }
.diff { max-height: 280px; overflow: auto; font-size: 12px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--ink); overflow-wrap: anywhere; }
.diff-actions { display: flex; gap: 8px; margin-top: 8px; }
.card-blocker { border-left: 3px solid var(--danger); background: rgba(201, 137, 106, 0.08); }
.validation-error {
  max-height: 200px;
  overflow: auto;
  font-size: 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  color: var(--danger);
  background: rgba(0, 0, 0, 0.2);
  padding: 10px;
  border-radius: 6px;
  margin: 10px 0;
  overflow-wrap: anywhere;
}
.seat-autocomplete {
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  margin-bottom: 4px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  max-height: 240px;
  overflow: auto;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
  z-index: 100;
}
.seat-option {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 14px;
  cursor: pointer;
  border-bottom: 1px solid var(--line);
}
.seat-option:last-child { border-bottom: none; }
.seat-option:hover, .seat-option.selected {
  background: rgba(203, 159, 83, 0.1);
}
.seat-option-label {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
}
.seat-option-desc {
  font-size: 11px;
  color: var(--muted);
}
.handoff-card {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  margin: 12px 0 0;
  border: 1px solid var(--bronze);
  background: rgba(203, 159, 83, 0.05);
  border-radius: 10px;
  font-size: 12px;
}
.handoff-header {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(203, 159, 83, 0.2);
}
.handoff-header b {
  color: var(--bronze);
  font-weight: 500;
  font-size: 13px;
}
.handoff-route {
  font-size: 11px;
  color: var(--muted);
}
.handoff-body {
  display: grid;
  gap: 6px;
}
.handoff-row {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
}
.handoff-label {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 10px;
}
.handoff-value {
  color: var(--ink);
  overflow-wrap: anywhere;
}
.handoff-value.status-complete { color: var(--bronze); }
.handoff-value.status-blocked { color: var(--danger); }
footer {
  padding: 8px 16px;
  color: var(--muted);
  font-size: 11px;
  border-top: 1px solid var(--line);
  overflow: hidden;
  max-width: 100%;
}
.footer-lockup {
  display: grid;
  gap: 4px;
  min-width: 0;
}
#boardMark { font-weight: 600; letter-spacing: 0.04em; }
.engines-chip {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  max-width: 220px;
  margin: 0;
  padding: 5px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 11px;
  letter-spacing: 0.03em;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.engines-chip.warn { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 45%, var(--line)); }
.engines-chip.ok { color: color-mix(in srgb, var(--ink) 72%, var(--muted)); }
.engines-chip.ok,
.engines-chip[hidden] { display: none !important; }
.footer-credit, .credit-lines {
  margin: 0;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
footer a { color: var(--bronze); }
/* Mobile-first layout: phone ≤480px, usable ≤860px */
@media (max-width: 860px) {
  /* Calm dense mobile: tight type, track dividers, layered depth */
  html { overflow-x: hidden; max-width: 100%; }
  body {
    overflow: hidden;
    overflow-x: hidden;
    max-width: 100%;
    height: 100%;
    color: var(--text);
    letter-spacing: var(--track-body);
  }
  .bar {
    display: flex;
    flex-wrap: nowrap;
    grid-template-columns: none;
    padding: 8px 12px;
    gap: 8px;
    max-width: 100%;
    overflow: visible;
    border-bottom: 1px solid var(--track);
    background: rgba(16, 15, 13, 0.92);
  }
  .mobile-org-toggle {
    position: relative;
    z-index: 5;
  }
  .stages {
    position: relative;
    z-index: 1;
  }
  .drawer-top,
  .activity-bar,
  .embed-head,
  .drawer-nav {
    border-bottom-color: var(--track);
  }
  .panel h2,
  .drawer-top h2,
  .empty-stream h1,
  .embed-head h1 {
    font: var(--type-title);
    letter-spacing: var(--track-title);
    color: var(--text);
  }
  .cron-head b,
  .seat-card h3,
  .usage-card h4,
  .memory-card label {
    font: var(--type-section);
    letter-spacing: var(--track-section);
    color: var(--text);
  }
  .chat-where,
  .activity-bar span,
  .cron-section,
  .eyebrow {
    letter-spacing: var(--track-section);
    color: var(--bronze);
  }
  .bubble-text,
  .bubble-text .bot-lead,
  .card pre,
  .lede,
  .cron-outcome,
  .empty-stream p {
    font: var(--type-body);
    letter-spacing: var(--track-body);
    color: var(--text);
  }
  .card .meta,
  .muted,
  .composer-hint,
  .bubble .actor-tag {
    color: var(--muted);
    letter-spacing: var(--track-body);
  }
  .card {
    border: 0;
    border-radius: var(--radius);
    background: var(--panel);
    box-shadow: var(--shadow-card);
  }
  .card.user,
  .card.brief {
    border-left: 0;
    box-shadow: var(--shadow-card), inset 3px 0 0 var(--bronze);
  }
  .card.brief {
    background: color-mix(in srgb, var(--panel) 88%, #22332c);
    box-shadow: var(--shadow-card), inset 3px 0 0 var(--mint);
  }
  .bubble.user {
    border: 0;
    border-radius: 16px 16px 6px 16px;
    background: color-mix(in srgb, var(--panel) 70%, rgba(201, 166, 107, 0.12));
    box-shadow: var(--shadow-soft);
  }
  .composer {
    border: 0;
    border-radius: var(--radius-deep);
    background: color-mix(in srgb, var(--panel) 94%, transparent);
    box-shadow: var(--shadow-soft), var(--shadow-inset);
  }
  .composer:focus-within {
    border-color: transparent;
    box-shadow: var(--shadow-soft), 0 0 0 1px color-mix(in srgb, var(--bronze) 35%, transparent);
  }
  .mobile-org-toggle,
  .attach-btn,
  .activity-close {
    color: var(--strong);
  }
  .ghost-btn,
  .send,
  .attach-btn,
  .mobile-org-toggle,
  .route-btn,
  .stage-btn,
  .tool-tab,
  .work-tab {
    border: 0;
    box-shadow: var(--shadow-soft), var(--shadow-inset);
  }
  .ghost-btn,
  .attach-btn,
  .mobile-org-toggle {
    background: color-mix(in srgb, var(--panel) 80%, #0a0908);
    color: var(--strong);
    border-radius: 999px;
  }
  .send {
    border-radius: 999px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--bronze) 92%, #fff) 0%, var(--bronze) 100%);
    box-shadow: var(--shadow-soft), var(--shadow-inset);
  }
  .send.stop {
    background: color-mix(in srgb, var(--panel) 80%, #0a0908);
    color: var(--text);
    border: 0;
    box-shadow: var(--shadow-soft), var(--shadow-inset);
  }
  .route,
  .tool-tabs,
  .stages {
    border: 0;
    box-shadow: inset 0 0 0 1px var(--track), var(--shadow-inset);
    background: color-mix(in srgb, var(--bg) 88%, #000);
  }
  .seat-card,
  .usage-card,
  .memory-card,
  .cron-card {
    border: 0;
    border-radius: var(--radius-deep);
    box-shadow: var(--shadow-card);
    background: var(--panel);
  }
  .rail {
    box-shadow: 8px 0 28px rgba(0, 0, 0, 0.35);
    border-right: 0;
  }
  .panel {
    border: 0;
    border-radius: var(--radius-deep);
    box-shadow: var(--shadow-card);
  }
  input, textarea, select {
    border-color: var(--track);
    background: color-mix(in srgb, var(--bg) 70%, var(--panel));
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.18);
  }

  .bar-left { flex: 0 0 auto; }
  .bar-right { flex: 0 0 auto; min-width: 0; margin-left: auto; }
  /* Drop status chrome from the phone top bar — Engines lives in Settings */
  .bar-right .engines-chip,
  .bar-right .pulse,
  .bar-right .meter,
  .bar-right .engine-hint { display: none !important; }
  
  /* Compact header: mark + stages only */
  .sub { display: none; }
  .word { font-size: 13px; letter-spacing: 0.05em; }
  .mark-gem { width: 28px; height: 28px; border-radius: 7px; }
  .mark-row { gap: 10px; }
  .stages {
    margin: 0 auto;
    padding: 3px;
    gap: 2px;
  }
  .stage-btn {
    min-width: 4.2rem;
  }
  
  /* Keep composer-who screen-reader only — do not unclip sr-only on mobile */
  .composer-who.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    opacity: 1;
    font-size: 1px;
  }
  
  /* Stage tabs stay on the same row as the mark — do not crush Chat/Tools */
  .stages {
    flex: 0 0 auto;
    justify-self: center;
    justify-content: center;
    overflow: visible;
    grid-column: auto;
  }
  .stage-btn { 
    font-size: 12px;
    padding: 8px 12px;
    min-height: 44px;
    white-space: nowrap;
  }
  
  /* Hamburger sits with the mark — no boxed button */
  .mobile-org-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: transparent;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    color: var(--bronze);
    font-size: 18px;
    padding: 0;
    flex-shrink: 0;
  }
  .mobile-org-toggle:hover { color: var(--ink); }
  .meter {
    padding: 5px 10px;
    max-width: 112px;
  }
  .meter-total { font-size: 11px; }
  .pulse {
    max-width: min(46vw, 220px);
    padding: 4px 8px;
    align-items: flex-start;
  }
  .pulse span {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .pulse small { display: none; }
  .bot-stats > div {
    grid-template-columns: 1fr;
    gap: 2px;
  }
  .ceo-pulse-result {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .bubble-text .bot-lead {
    font-size: 15px;
    line-height: 1.5;
  }
  
  /* Chat stage: full-width chat, rail as overlay */
  #stage-chat.on { 
    grid-template-columns: minmax(0, 1fr);
    position: relative;
    max-width: 100%;
    overflow-x: hidden;
  }
  #stage-opencode,
  #stage-hermes,
  #stage-openship {
    top: 48px;
    bottom: 0;
  }
  .embed-head { padding: 8px 12px 10px; }
  .embed-head h1 { font-size: 16px; }
  .embed-aim {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .pulse.ok { display: flex; }
  .pulse.none,
  .pulse[hidden] { display: none; }
  .ceo-next { display: none; }
  .receipt-go { display: none; }
  .index { display: none; }
  .ceo-brief { display: none; }
  /* Phone: keep ceo-live as one line; hide the rest of chat-context */
  .chat-context {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 0;
  }
  .chat-context .index,
  .chat-context .ceo-brief { display: none !important; }
  .ceo-live:not([hidden]) {
    display: flex;
    margin: 0;
    padding: 2px 0 4px;
    max-width: 100%;
  }
  .ceo-live[hidden] { display: none !important; }
  .ceo-pulse {
    align-items: center;
    gap: 8px;
    min-width: 0;
    width: 100%;
  }
  .ceo-pulse-copy {
    min-width: 0;
    flex: 1;
  }
  .ceo-pulse-copy b {
    display: block;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .ceo-pulse-copy span,
  .ceo-pulse-result,
  .ceo-next { display: none; }
  .composer-who { display: none; }
  .chat-shell.work-open .stream,
  .chat-shell.activity-open .stream {
    display: flex;
    flex: 1 1 36%;
    min-height: 6rem;
  }
  .chat-shell.work-open .index,
  .chat-shell.activity-open .index,
  .chat-shell.work-open .chat-context,
  .chat-shell.activity-open .chat-context,
  .chat-shell.work-open .lanes,
  .chat-shell.activity-open .lanes { display: none; }
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) {
    display: flex;
    flex-direction: column;
    left: 8px;
    right: 8px;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    max-height: min(72vh, 34rem);
    z-index: 35;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.45);
  }
  .activity-sheet:not([hidden]) .activity-body {
    min-height: min(44vh, 20rem);
    flex: 1;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }
  .work-status-index {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .work-status-index > div {
    grid-template-columns: 4.5rem minmax(0, 1fr);
    align-items: baseline;
    gap: 8px;
  }
  .work-status-index dd {
    -webkit-line-clamp: 1;
  }
  /* calm phone: CEO name in head; Work ribbon above composer, not a 5-tab scroll */
  .chat-head-row {
    flex-direction: row;
    align-items: center;
    gap: 8px;
  }
  .chat-folder { display: none; }
  .chat-where {
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: var(--track-title);
    text-transform: none;
  }
  .work-tabs:not(.work-peek),
  .embed-head .work-tabs {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    gap: 4px;
    padding: 3px;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bg) 70%, #000);
    box-shadow: inset 0 0 0 1px var(--track), var(--shadow-inset);
    justify-content: flex-start;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
  }
  .work-peek {
    flex-wrap: wrap;
    width: 100%;
    gap: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
  }
  .activity-bar .work-tabs {
    order: 3;
    flex: 1 1 100%;
  }
  .work-toggle-btn {
    min-height: 40px;
    padding: 8px 14px;
    font-size: 13px;
  }
  .work-tabs::-webkit-scrollbar { display: none; }
  .work-tab,
  .stage-btn,
  .mobile-org-toggle {
    touch-action: manipulation;
  }
  .work-tab {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 4px;
    flex: 0 0 auto;
    padding: 9px 12px;
    min-height: 40px;
    font-size: 13px;
    border-radius: 999px;
    white-space: nowrap;
  }
  .work-peek .work-tab {
    padding: 4px 8px;
    min-height: 0;
    font-size: 12px;
  }
  .work-tab.on {
    background: var(--bronze-soft);
    color: var(--bronze);
  }
  .mobile-org-toggle {
    width: 44px;
    height: 44px;
  }
  .work-tab .n {
    margin-left: 0;
    font-size: 11px;
    opacity: 0.55;
    font-variant-numeric: tabular-nums;
  }
  .embed-head-row {
    flex-direction: column;
    align-items: stretch;
  }
  .embed-tools {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    gap: 8px;
  }
  .embed-open { align-self: flex-start; }
  
  /* Rail becomes overlay drawer */
  .rail {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(280px, 80vw);
    z-index: 30;
    transform: translateX(-100%);
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 4px 0 12px rgba(0, 0, 0, 0.3);
  }
  .rail.open { transform: translateX(0); }
  
  /* Rail scrim — mobile overlay only; never trap clicks when closed or on desktop */
  .rail-scrim {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(10, 9, 8, 0.7);
    z-index: 29;
    pointer-events: none;
  }
  .rail-scrim.open {
    display: block !important;
    pointer-events: auto !important;
  }
  .rail.open {
    z-index: 50;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  html.is-mobile.rail-drawer-open .chat-col .chat-dock {
    visibility: hidden;
    pointer-events: none;
  }
  html.is-mobile.rail-drawer-open .chat-col .activity-sheet:not([hidden]) {
    visibility: hidden;
    pointer-events: none;
  }
  
  /* Chat column full width */
  .chat-col { width: 100%; max-width: 100%; overflow-x: hidden; }
  .chat-shell { 
    width: 100%;
    max-width: 100%;
    padding: 0 10px 10px;
    overflow-x: hidden;
  }
  
  /* Tighter chat head */
  .chat-head {
    padding: 12px 2px 8px;
    gap: 8px;
  }
  .chat-where {
    font-size: 18px;
    letter-spacing: 0;
    text-transform: none;
  }
  .ceo-live {
    margin: 2px 0 0;
    padding: 4px 0 0;
  }
  .ceo-pulse-copy span { display: none; }
  .chat-schedule,
  .activity-sheet {
    margin: 0;
    padding: 0;
    border: 0;
    max-height: none;
    overflow: hidden;
  }
  .cron-story { display: none; }
  .cron-section {
    margin: 10px 0 0;
    font-size: 10px;
  }
  .cron-card {
    padding: 10px 0 12px;
    gap: 6px;
  }
  .cron-head {
    font-size: 13px;
    align-items: baseline;
  }
  .cron-head b {
    font-weight: 500;
    font-size: 15px;
    font-family: var(--display);
  }
  .cron-head span {
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    flex-shrink: 0;
  }
  .chat-schedule .cron-meta { display: none; }
  .cron-outcome {
    font-size: 13px;
    line-height: 1.45;
    color: var(--muted);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .chat-schedule .ghost-btn,
  .chat-schedule .cron-retry,
  .chat-schedule .need-actions button {
    min-height: 44px;
    padding: 10px 14px;
    font-size: 13px;
  }
  
  /* Tighter stream spacing with composer clearance */
  .stream {
    padding: 12px 4px 14px;
    gap: 10px;
    min-height: 140px;
    padding-bottom: 24px;
    max-width: 100%;
    overflow-x: hidden;
  }
  
  /* Compact bubbles */
  .bubble { gap: 4px; }
  .bubble.user {
    padding: 10px 13px;
    max-width: 90%;
  }
  .bubble.bot {
    padding: 10px 13px;
  }
  .bubble-text {
    font-size: 14px;
    line-height: 1.48;
  }
  .card {
    padding: 10px 12px;
  }
  .card .meta { font-size: 10px; margin-bottom: 6px; }
  
  /* Compact index */
  .index {
    padding: 8px 0 10px;
  }
  .index summary {
    font-size: 11px;
    padding: 1px 0 3px;
  }
  .index pre {
    font-size: 11px;
    max-height: 140px;
    margin: 8px 0 6px;
  }
  
  /* Lanes: horizontal scroll with better tap targets */
  .lanes { 
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 3px;
    margin-top: 6px;
    max-width: 100%;
  }
  .lane { 
    padding: 6px 10px;
    font-size: 10px;
    min-height: 34px;
    display: flex;
    align-items: center;
    white-space: nowrap;
  }
  
  /* Route buttons: better tap targets */
  .route { 
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .route-btn { 
    padding: 8px 14px;
    font-size: 12px;
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  
    /* Composer: thumb-first dock with safe area */
  .composer {
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    margin: 0;
    gap: 6px;
    max-width: 100%;
    overflow-x: hidden;
    border: 0;
    border-radius: 22px 22px 0 0;
    box-shadow: 0 -10px 28px rgba(0, 0, 0, 0.28), var(--shadow-inset);
    background: color-mix(in srgb, var(--panel) 96%, #000);
  }
  /* Phase 1 desk — dock owns the bottom-anchored shell on phone; composer is the inner card */
  .chat-dock {
    padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 0px));
    gap: 6px;
    border: 0;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -10px 28px rgba(0, 0, 0, 0.28), var(--shadow-inset);
    background: color-mix(in srgb, var(--panel) 96%, #000);
  }
  .chat-dock .composer {
    padding: 10px 12px;
    border-radius: 14px;
    background: rgba(28, 26, 22, 0.6);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  }
  .composer textarea {
    font-size: 16px;
    min-height: 44px;
    max-height: 132px;
    padding: 10px 0;
    font-family: var(--ui);
    letter-spacing: var(--track-body);
    line-height: 1.35;
  }
  .composer-input-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    align-items: end;
  }
  .route-select {
    font-size: 10px;
    padding: 0 12px 0 0;
    min-width: 0;
    height: auto;
    background-position: right 0 center;
  }
  .composer .send {
    height: 44px;
    min-width: 76px;
    min-height: 44px;
    padding: 8px 16px;
    font-size: 14px;
    border-radius: 999px;
  }
  .attach-btn {
    padding: 0;
    font-size: 16px;
    height: 44px;
    width: 44px;
    min-width: 44px;
    min-height: 44px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .stream {
    padding: 8px 14px max(132px, 24vh);
  }
  .bubble {
    gap: 8px;
  }
  .bubble.user {
    max-width: 88%;
    padding: 12px 14px;
  }
  .bubble-text .bot-lead {
    font-size: 15px;
    line-height: 1.55;
  }
  .empty-stream {
    margin: auto;
    padding: 28px 16px 24px;
    gap: 12px;
    max-width: 22rem;
  }
  .empty-stream.chair-empty {
    text-align: left;
    justify-items: start;
  }
  .empty-stream.chair-empty .empty-kicker {
    margin: 0 0 2px;
  }
  .empty-stream.chair-empty p {
    max-width: 18rem;
  }
  .empty-stream h1 {
    font: var(--type-title);
    letter-spacing: var(--track-title);
  }
  .empty-stream p {
    font: var(--type-body);
    letter-spacing: var(--track-body);
    line-height: 1.45;
  }
  .mobile-cta {
    display: block;
    width: 100%;
    margin-top: 8px;
    min-height: 44px;
    border-radius: 999px;
    box-shadow: var(--shadow-soft), var(--shadow-inset);
  }
  .chat-shell {
    padding: 0 0 0;
  }
  .chat-head {
    padding: 10px 14px 6px;
  }

  /* Credit stays in Settings / About on phone — free vertical space for chat */
  footer {
    display: none;
  }

/* Settings drawer — bottom sheet on phone (scrim + card stacked, not broken 1-col grid) */
  #settings.drawer {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
    align-items: end;
  }
  #settings .drawer-scrim {
    grid-row: 1 / span 2;
    grid-column: 1;
  }
  #settings .drawer-card {
    grid-row: 2;
    grid-column: 1;
    width: 100%;
    max-height: min(92vh, 100%);
    border-left: none;
    border-top: 1px solid var(--track);
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -16px 48px rgba(0, 0, 0, 0.45);
    animation: otto-rise-in var(--dur-slow) var(--ease-out);
  }
  .drawer-grid { 
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
  }
  .drawer-nav {
    border-right: none;
  }
  .drawer-nav {
    flex-direction: row;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-right: none;
    border-bottom: 1px solid var(--line);
    padding: 8px;
    gap: 4px;
  }
  .drawer-tab {
    white-space: nowrap;
    min-height: 44px;
    font-size: 12px;
    padding: 10px 14px;
  }
  .drawer-body {
    padding: 16px 16px 24px;
  }
  
  /* Form fields stack */
  .field-row, .model-grid { grid-template-columns: minmax(0, 1fr); }
  .kv div { grid-template-columns: minmax(0, 1fr); }
  
  /* Better input tap targets */
  input, textarea, select {
    font-size: 16px; /* Prevent iOS zoom */
    padding: 10px 12px;
    min-height: 44px;
  }
  
  /* Better button tap targets — 38–46px soft circular controls */
  .ghost-btn, .send {
    min-height: 42px;
    height: 42px;
    padding: 8px 16px;
    font-size: 14px;
    border-radius: 999px;
    border: 0;
    box-shadow: var(--shadow-soft), var(--shadow-inset);
  }
  .ghost-btn {
    background: color-mix(in srgb, var(--panel) 80%, #0a0908);
    color: var(--strong);
  }
  .mobile-cta {
    border: 0;
    border-radius: 999px;
    box-shadow: var(--shadow-soft), var(--shadow-inset);
    background: linear-gradient(180deg, color-mix(in srgb, var(--bronze) 88%, #fff) 0%, var(--bronze) 100%);
    color: #1a140c;
  }
  
  /* User bubbles full width on small screens */
  .bubble.user { max-width: 100%; }
  
  /* Meter compact: stack or single line */
  .bar-right {
    justify-self: end;
  }
  .meter { 
    padding: 6px 10px;
    font-size: 10px;
    max-width: 110px;
    gap: 4px;
  }
  .meter-line { 
    display: none; /* Hide breakdown on mobile, just show total */
  }
  .meter-total { font-size: 11px; }
  .engine-hint { display: none; } /* Hide on mobile */
  .pulse { max-width: min(48vw, 200px); }
  .pulse small { display: none; }
  .bar-right .engines-chip,
  .bar-right .pulse,
  .bar-right .meter { display: none !important; }
  .mobile-settings-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    min-width: 40px;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    flex-shrink: 0;
  }
  
  /* Wizard/first-run panels: phone-friendly */
  .overlay {
    padding: 16px;
    align-items: flex-start;
    padding-top: max(16px, env(safe-area-inset-top, 16px));
  }
  .panel {
    padding: 20px 16px;
    width: 100%;
    max-width: 100%;
    gap: 14px;
  }
  .panel h2 { font-size: 20px; }
  .panel .mark {
    text-align: center;
  }
  .mark-lockup {
    width: 180px;
    height: auto;
  }
  
  /* Unlock gate: phone-friendly */
  #unlockGate .panel {
    padding: 24px 20px;
  }
  #unlockPin {
    font-size: 20px; /* Bigger PIN input on phone */
    text-align: center;
    letter-spacing: 0.3em;
    padding: 14px;
  }
  
  /* Wizard inputs */
  .wizard-step input,
  .wizard-step select {
    font-size: 16px;
    padding: 12px;
  }
  
  /* Auth status cards */
  .auth-status-card {
    padding: 14px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .auth-status-icon {
    font-size: 32px;
    align-self: center;
  }
  
  /* Usage panel: spend breaks readable */
  .spend-break {
    padding: 12px;
    font-size: 12px;
    gap: 8px;
  }
  .spend-break > div:not(.usage-card):not(.spend-alerts) {
    flex-wrap: wrap;
    gap: 8px;
  }
  
  /* Job log */
  .job-log {
    gap: 10px;
  }
  .job-row {
    padding: 12px;
    gap: 6px;
    font-size: 12px;
  }
  
  /* Spend table */
  .spend-table {
    font-size: 12px;
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .spend-table th,
  .spend-table td {
    padding: 6px;
    white-space: nowrap;
  }
  
  /* Provider cards */
  .provider {
    padding: 12px;
    gap: 10px;
  }
  .provider-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  
  /* Seat cards */
  .seat-card {
    padding: 12px;
    gap: 10px;
  }
  .seat-card header {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  
  /* Memory cards */
  .memory-cards {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  
  /* Actions wrap on phone */
  .actions {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .actions button {
    width: 100%;
  }
  
  /* Empty state: show Open a CEO CTA on mobile */
  .mobile-cta {
    display: block;
  }
}

/* Phone-specific: ≤480px */

  /* first-run / unlock feel */
  .overlay {
    padding: max(12px, env(safe-area-inset-top, 12px)) 14px 14px;
    align-items: flex-end;
  }
  .overlay .panel {
    border: 0;
    border-radius: 22px 22px 0 0;
    box-shadow: 0 -12px 40px rgba(0,0,0,0.4);
    max-height: min(92vh, 760px);
    overflow: auto;
    padding: 20px 16px calc(18px + env(safe-area-inset-bottom, 0px));
  }
  .overlay .panel h2 {
    font: var(--type-title);
    letter-spacing: var(--track-title);
  }
  .overlay .ghost-btn {
    min-height: 44px;
  }

@media (max-width: 480px) {
  html { overflow-x: hidden; max-width: 100%; }
  body { overflow: hidden; overflow-x: hidden; max-width: 100%; height: 100%; }
  .bar { 
    padding: 6px 10px; 
    gap: 6px;
    max-width: 100%;
    overflow: hidden;
  }
  .mark-gem { width: 26px; height: 26px; border-radius: 7px; }
  .word { display: none; }
  .meter { display: none; }
  .stage-full { display: none; }
  .stage-short { display: inline; }
  .pulse { max-width: 100%; min-width: 0; }
  
  .mobile-org-toggle {
    width: 44px;
    height: 44px;
    font-size: 18px;
  }
  
  .stages { 
    font-size: 12px;
    padding: 3px;
  }
  .stage-btn { 
    font-size: 12px;
    padding: 8px 12px;
    min-height: 44px;
  }
  
  .rail { width: min(260px, 85vw); }
  
  .chat-shell { padding: 0 12px 10px; }
  .chat-head { padding: 12px 0 8px; gap: 8px; }
  .chat-where { font-size: 18px; letter-spacing: 0; text-transform: none; }
  .work-tab {
    padding: 9px 12px;
    min-height: 40px;
    font-size: 13px;
  }
  
  /* Tighter lane pills */
  .lane, .route-btn { 
    padding: 6px 10px;
    font-size: 11px;
    min-height: 36px;
  }
  
  /* Even more compact composer on phones */
  .composer {
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    gap: 6px;
  }
  .composer-who {
    font-size: 8px;
    letter-spacing: 0.04em;
    padding: 0 2px;
  }
  .composer textarea {
    min-height: 40px;
    max-height: 100px;
    font-size: 16px; /* Prevent iOS Safari auto-zoom on focus */
  }
  .composer-input-row {
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 5px;
  }
  .route-select {
    font-size: 10px;
    padding: 0 12px 0 0;
    min-width: 0;
    height: auto;
  }
  .composer .send {
    height: 44px;
    min-width: 72px;
    min-height: 44px;
    padding: 8px 14px;
    font-size: 14px;
  }
  .attach-btn {
    padding: 0;
    font-size: 16px;
    height: 44px;
    width: 44px;
    min-width: 44px;
    min-height: 44px;
  }
  
  /* Ensure stream has enough bottom padding */
  .stream {
    padding-bottom: max(120px, 22vh);
  }
  
  /* Tap target: minimum 44px for primary controls */
  button.send { min-height: 44px; padding: 10px 14px; }
  .attach-btn { min-height: 44px; min-width: 44px; padding: 0; }
  
  /* Wizard on phone */
  .overlay {
    padding: 12px;
  }
  .panel {
    padding: 18px 14px;
    gap: 12px;
  }
  .panel h2 { font-size: 18px; }
  .mark-lockup {
    width: 160px;
  }
  
  /* Unlock */
  #unlockGate .panel {
    padding: 20px 16px;
  }
  #unlockPin {
    font-size: 22px;
    padding: 16px;
    letter-spacing: 0.4em;
  }
  
  /* Meter even more compact */
  .meter {
    padding: 5px 8px;
    font-size: 9px;
    max-width: 90px;
  }
  .meter-total { font-size: 10px; }
  
  /* Drawer on phone */
  .drawer-nav {
    padding: 6px;
    gap: 3px;
  }
  .drawer-tab {
    font-size: 11px;
    padding: 8px 12px;
    min-height: 40px;
  }
  .drawer-body {
    padding: 14px 12px 20px;
  }
  .drawer-top {
    padding: 14px 16px;
  }
  .drawer-top h2 { font-size: 20px; }
  
  /* Form elements */
  input, textarea, select {
    font-size: 16px;
    padding: 10px;
  }
  
  /* Buttons */
  .ghost-btn, .send {
    min-height: 44px;
    padding: 10px 14px;
    font-size: 13px;
  }
  
  /* Spend UI */
  .spend-break {
    padding: 10px;
    font-size: 11px;
  }
  .job-row {
    padding: 10px;
    font-size: 11px;
  }
  
  /* Providers */
  .provider {
    padding: 10px;
  }
  
  /* Seat cards */
  .seat-card {
    padding: 10px;
  }
  
  /* Actions */
  .actions {
    gap: 8px;
  }
  
  /* Footer */
  footer { font-size: 9px; padding: 5px 10px; }
  
  /* Bubbles — keep calm body scale on narrow phones */
  .bubble {
    font: var(--type-body);
    letter-spacing: var(--track-body);
  }
  .bubble-text {
    font: var(--type-body);
    letter-spacing: var(--track-body);
  }
  .card {
    padding: 12px 14px;
    border-radius: var(--radius-deep);
    border: 0;
    box-shadow: var(--shadow-card);
  }
  .composer .send,
  .attach-btn,
  .ghost-btn {
    height: 44px;
    min-height: 44px;
    border-radius: 999px;
  }
  .attach-btn {
    width: 44px;
    min-width: 44px;
  }
  
  /* Index brief */
  .index {
    padding: 8px 0 10px;
  }
  .index pre {
    font-size: 11px;
    max-height: 140px;
  }
  
  /* Empty state on phone — fill the dead middle */
  .empty-stream {
    margin: auto;
    padding: 24px 18px 28px;
    gap: 12px;
    text-align: left;
    max-width: 22rem;
  }
  .empty-stream .empty-mark {
    width: 40px;
    height: 40px;
    border-radius: 10px;
  }
  .empty-stream h1 {
    font: var(--type-title);
    letter-spacing: var(--track-title);
  }
  .empty-stream p {
    font: var(--type-body);
    letter-spacing: var(--track-body);
  }
  .mobile-cta {
    display: block;
    border-radius: 999px;
    box-shadow: var(--shadow-soft), var(--shadow-inset);
  }
}

.memory-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin: 1rem 0;
}

.memory-card {
  background: var(--bg-2);
  border: 1px solid var(--bg-4);
  border-radius: 0.375rem;
  padding: 0.75rem;
}

.memory-card.blocked {
  border-color: var(--warn);
  background: var(--bg-1);
}

.memory-card label {
  display: block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-3);
  margin-bottom: 0.375rem;
}

.memory-card textarea {
  width: 100%;
  min-height: 3rem;
  margin: 0;
  padding: 0.5rem;
  color: var(--text-1);
  background: var(--bg-1);
  border: 1px solid var(--bg-4);
  border-radius: 0.25rem;
  font-size: 0.875rem;
  line-height: 1.4;
  font-family: var(--ui);
  resize: vertical;
}

.memory-card textarea:focus {
  outline: none;
  border-color: var(--bronze);
}

.memory-card.blocked label {
  color: var(--warn);
}

.memory-card.blocked textarea {
  border-color: var(--warn);
}

.memory-results {
  margin-top: 1.5rem;
}

.memory-results h4 {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text-2);
  margin-bottom: 0.75rem;
}

.memory-result {
  background: var(--bg-2);
  border: 1px solid var(--bg-4);
  border-radius: 0.375rem;
  padding: 0.75rem;
  margin-bottom: 0.5rem;
}

.memory-result-clickable {
  cursor: pointer;
  transition: all 0.15s ease;
}

.memory-result-clickable:hover {
  background: var(--bg-3);
  border-color: var(--bronze);
}

.memory-result-meta {
  font-size: 0.75rem;
  color: var(--text-3);
  margin-bottom: 0.375rem;
}

.memory-result-snippet {
  font-size: 0.875rem;
  color: var(--text-2);
  line-height: 1.4;
}

.memory-handoffs {
  margin-bottom: 1.5rem;
}

.create-handoff-form {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
  align-items: center;
}

.create-handoff-form input {
  flex: 1;
  min-width: 0;
}

.create-handoff-form select {
  width: auto;
  min-width: 120px;
}

.create-handoff-form button {
  white-space: nowrap;
}

.handoff-item {
  background: var(--bg-2);
  border: 1px solid var(--bg-4);
  border-radius: 0.375rem;
  padding: 0.75rem;
  margin-bottom: 0.5rem;
}

.handoff-item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5rem;
}

.handoff-item-id {
  font-size: 0.75rem;
  font-family: var(--font-mono);
  color: var(--text-3);
}

.handoff-item-status {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.125rem 0.5rem;
  border-radius: 0.25rem;
}

.status-open {
  background: var(--bg-4);
  color: var(--text-2);
}

.status-claimed {
  background: rgba(59, 130, 246, 0.1);
  color: rgb(96, 165, 250);
}

.status-blocked {
  background: rgba(239, 68, 68, 0.1);
  color: rgb(248, 113, 113);
}

.handoff-item-task {
  font-size: 0.875rem;
  color: var(--text);
  margin-bottom: 0.5rem;
  line-height: 1.4;
}

.handoff-item-meta {
  font-size: 0.75rem;
  color: var(--text-3);
  display: flex;
  gap: 1rem;
  margin-bottom: 0.5rem;
}

.claim-handoff {
  margin-top: 0.5rem;
  font-size: 0.75rem;
}

.bubble.highlight {
  animation: highlight-pulse 2s ease;
}

@keyframes highlight-pulse {
  0%, 100% { background: var(--bg); }
  50% { background: var(--bg-3); }
}

.auth-status-card {
  padding: 16px;
  background: var(--bg-rail);
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-bottom: 12px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.auth-status-icon {
  font-size: 24px;
  flex-shrink: 0;
}

.auth-status-content {
  flex: 1;
  min-width: 0;
}

.auth-status-label {
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 4px;
}

.auth-status-card .muted {
  margin-top: 8px;
  margin-bottom: 12px;
  font-size: 0.85rem;
}

.auth-status-card code {
  background: var(--bg);
  padding: 2px 6px;
  border-radius: 4px;
  font-family: ui-monospace, monospace;
  font-size: 0.85em;
}

.auth-status-card .ghost-btn {
  margin-top: 8px;
}

.done-fold {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
}
.done-fold summary {
  cursor: pointer;
  color: var(--muted);
  min-height: 32px;
  display: flex;
  align-items: center;
}
.done-fold .receipt-line { margin: 6px 0 0; }
#aboutCredit {
  margin-top: 12px;
  line-height: 1.5;
}

/* 1024+ desktop: fixed shell width; work desk slides in without resizing the board */
@media (min-width: 1024px) {
  .chat-shell {
    width: min(78rem, calc(100% - 32px));
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 20px 14px;
    box-sizing: border-box;
    transition: grid-template-columns var(--dur-slow) var(--ease-out);
  }
  .chat-shell:not(.work-open):not(.activity-open) .chat-head,
  .chat-shell:not(.work-open):not(.activity-open) .stream,
  .chat-shell:not(.work-open):not(.activity-open) .chat-dock {
    width: min(42rem, 100%);
    margin-left: auto;
    margin-right: auto;
  }
  .chat-shell.work-open,
  .chat-shell.activity-open {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(17rem, 22rem);
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    column-gap: 18px;
    align-content: stretch;
  }
  .chat-shell.work-open .today-dock,
  .chat-shell.activity-open .today-dock {
    grid-column: 1;
    grid-row: 2;
    z-index: 5;
    position: relative;
    align-self: start;
    max-width: none;
    margin: 0 0 8px;
  }
  .chat-shell.work-open:not(.activity-open) .chat-head,
  .chat-shell.activity-open:not(.work-open) .chat-head,
  .chat-shell.work-open .chat-head,
  .chat-shell.activity-open .chat-head,
  .chat-shell.work-open .stream,
  .chat-shell.activity-open .stream,
  .chat-shell.work-open .chat-dock,
  .chat-shell.activity-open .chat-dock {
    width: auto;
    margin-left: 0;
    margin-right: 0;
  }
  .chat-shell.work-open .chat-head,
  .chat-shell.activity-open .chat-head { grid-column: 1 / -1; grid-row: 1; }
  .chat-shell.work-open .stream,
  .chat-shell.activity-open .stream {
    grid-column: 1;
    grid-row: 3;
    min-height: 0;
    position: relative;
    overflow: auto;
    isolation: isolate;
  }
  .chat-shell.work-open .chat-dock,
  .chat-shell.activity-open .chat-dock {
    grid-column: 1;
    grid-row: 4;
  }
  .chat-shell.work-open .work-status,
  .chat-shell.activity-open .work-status {
    grid-column: 1;
    grid-row: 3;
    align-self: end;
    z-index: 6;
    pointer-events: none;
  }
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) {
    display: flex;
    position: static;
    grid-column: 2;
    grid-row: 2 / span 3;
    min-height: 0;
    flex: unset;
    left: auto;
    right: auto;
    bottom: auto;
    z-index: auto;
    max-height: none;
    border: 1px solid var(--track);
    border-radius: 16px;
    margin-bottom: 0;
    padding: 4px 0 8px 16px;
    background: var(--panel);
    box-shadow: var(--shadow-card);
    overflow: hidden auto;
    animation: otto-sheet-in var(--dur-slow) var(--ease-out);
  }
  .chat-shell.activity-open .stream::after,
  .chat-shell.work-open .stream::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 14px;
    background: color-mix(in srgb, var(--bg) 55%, transparent);
    pointer-events: none;
    z-index: 1;
  }
  .chat-shell.activity-open .stream > *,
  .chat-shell.work-open .stream > * {
    position: relative;
    z-index: 2;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .chat-shell {
    width: min(40rem, 100%);
    padding: 0 18px 12px;
  }
}

.card.msg-job {
  border: 1px solid color-mix(in srgb, var(--bronze) 22%, var(--track));
  border-radius: 14px;
  padding: 10px 12px 12px;
  background: color-mix(in srgb, var(--panel) 96%, #000);
}
.card.msg-job .job-stream-chrome {
  margin-bottom: 8px;
}
.card.msg-job .job-stream-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
.card.msg-job .job-stream-head b {
  flex: 1 1 8rem;
  min-width: 0;
  font-size: 13px;
}
.card.msg-job .job-watch-btn {
  margin-left: auto;
  font-size: 11px;
  min-height: 32px;
}
.card.msg-cron {
  border-left: 3px solid color-mix(in srgb, var(--bronze) 55%, transparent);
}
.card.msg-cron .bubble-text {
  font-size: 13px;
  line-height: 1.45;
  max-height: 10rem;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent);
  mask-image: linear-gradient(180deg, #000 72%, transparent);
}
.card.msg-cron .job-actions {
  margin-top: 8px;
}

.card.msg-job .job-stream-meta,
.card.msg-job .job-stream-step {
  margin: 4px 0 0;
  font-size: 11.5px;
  line-height: 1.35;
  color: var(--muted);
}
.card.msg-job .job-stream-meta span {
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 10px;
  margin-right: 4px;
}
.card.msg-job .job-stream-step { color: var(--ink); }
.thinking-log.has-steps {
  display: block;
  margin: 6px 0 0;
  padding: 0 0 0 14px;
  font-size: 11px;
  line-height: 1.35;
  color: var(--muted);
  max-height: 4.5em;
  overflow: auto;
}
.thinking-log.has-steps li { margin: 0 0 2px; }
.today-fleet { margin-top: 10px; }
.today-fleet-kicker {
  margin: 0 0 6px;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bronze);
  font-weight: 600;
}
.today-ceo-link {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
}
.today-ceo-link:hover { color: var(--bronze); }
.today-org-glance {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}
.today-org-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 12.5px;
  line-height: 1.35;
  min-width: 0;
}
.today-org-row b { font-family: var(--display); font-weight: 500; flex-shrink: 0; }
.today-org-row span { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.today-org-lamp {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 0.35em;
  background: var(--muted);
}
.today-org-lamp.live { background: var(--sage, #8fbfb2); }
.today-org-lamp.stuck { background: #c9a227; }
.today-org-lamp.fail { background: var(--danger, #c66); }
.today-org-lamp.gw-up { background: var(--sage, #8fbfb2); }
.today-org-lamp.gw-down { background: var(--danger, #c66); }
.today-org-lamp.gw-unk { background: var(--muted); }
.today-org-lamp.gw-host {
  background: color-mix(in srgb, var(--sage, #8fbfb2) 42%, var(--muted));
}
.cron-owner {
  margin: 0 0 8px;
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.45;
}
.fleet-gateways {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
  margin-top: 10px;
}
.fleet-gateways caption {
  text-align: left;
  font-weight: 600;
  margin: 0 0 6px;
}
.fleet-gateways th,
.fleet-gateways td {
  padding: 4px 6px 4px 0;
  text-align: left;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.today-org-badges {
  display: inline-flex;
  gap: 4px;
  margin-left: 4px;
  vertical-align: baseline;
}
.today-org-badge {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 1px 5px;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: var(--muted);
  flex-shrink: 0;
}
.today-org-badge.live { border-color: color-mix(in srgb, var(--sage, #8fbfb2) 55%, var(--line)); color: var(--ink); }
.today-org-badge.stuck { border-color: #c9a227; color: var(--ink); }
.today-org-badge.fail { border-color: var(--danger, #c66); color: var(--danger, #c66); }
.today-org-badge.due { border-color: var(--bronze); color: var(--bronze); }
.today-trust-strip {
  margin: 8px 0 0;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 92%, var(--bronze-soft));
  font-size: 11.5px;
  line-height: 1.45;
  color: var(--muted);
}
.today-trust-strip p { margin: 0; }
.today-trust-strip p + p { margin-top: 4px; }
.today-trust-strip strong { color: var(--ink); font-weight: 600; }
.org-desk-card .ceo-work-badges {
  display: inline-flex;
  gap: 3px;
  margin-left: 4px;
  vertical-align: middle;
}
.ceo-work-badge {
  font-size: 9px;
  font-weight: 700;
  min-width: 16px;
  text-align: center;
  padding: 1px 4px;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: var(--muted);
  line-height: 1.2;
}
.ceo-work-badge.live { border-color: color-mix(in srgb, var(--sage, #8fbfb2) 50%, var(--line)); }
.ceo-work-badge.stuck { border-color: #c9a227; }
.ceo-work-badge.fail { border-color: var(--danger, #c66); color: var(--danger, #c66); }
.ceo-work-badge.due { border-color: var(--bronze); color: var(--bronze); }
.org-inbox.adam .org-inbox-more {
  font-size: 11px;
  color: var(--bronze);
  margin-top: 4px;
  padding: 0 2px;
}
.today-details {
  margin-top: 8px;
  font-size: 12px;
}
.today-details summary {
  cursor: pointer;
  color: var(--bronze);
  font-weight: 600;
}
.today-detail-fields { margin: 6px 0 0; }
.today-detail-row {
  display: grid;
  grid-template-columns: 5.5rem 1fr;
  gap: 8px;
  margin-bottom: 4px;
}
.today-detail-row dt { color: var(--muted); font-weight: 600; }
.today-detail-row dd { margin: 0; color: var(--ink); overflow-wrap: anywhere; }
.embed-kicker.tools-scope {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--muted);
}

.provider.blocked-provider { opacity: 0.55; }
.provider .pill.warn { border-color: #a85; color: #c96; }

.usage-card .wire-bad { color: var(--danger, #c66); }
#ceoEngineHealthCard .kv dd { overflow-wrap: anywhere; }


/* P0 Handled + Visible — Outcome · Why · Next · Status */
.cron-k {
  display: inline-block;
  min-width: 3.4em;
  color: var(--muted);
  font-weight: 600;
  letter-spacing: 0.02em;
}
.cron-why, .cron-status {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}
.cron-roster-glance {
  margin: 0 0 4px;
  font-size: 11px;
  color: var(--muted);
  line-height: 1.35;
}
details.cron-card > .cron-why,
details.cron-card > .cron-status {
  display: none;
}
details.cron-card[open] > .cron-why,
details.cron-card[open] > .cron-status {
  display: block;
}

/* Collapsed schedule fail: primary CTA lives in summary (UA hides non-summary kids) */
.cron-card.schedule-roster.failed > .cron-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.cron-card.schedule-roster.failed > .cron-head .cron-roster-cta {
  display: inline-flex;
  margin-left: auto;
}
.cron-card.schedule-roster.failed > .cron-head .cron-roster-cta .send,
.cron-card.schedule-roster.failed > .cron-head .cron-roster-cta .ghost-btn {
  min-height: 28px;
  padding: 4px 10px;
  font-size: 11px;
}
.cron-card.schedule-roster.failed[open] > .cron-head .cron-roster-cta {
  /* Expanded: full CTAs below; keep glance CTA but softer */
  opacity: 0.85;
}
/* Schedule fail glance: Status + CTA visible without expand */
details.cron-card.schedule-roster.failed > .cron-roster-glance {
  display: block;
}
details.cron-card.schedule-roster.failed > .need-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
details.cron-card.handled.failed > .need-actions {
  display: flex;
}
details.cron-card.handled:not([open]) > .cron-outcome,
details.cron-card.handled:not([open]) > .cron-why,
details.cron-card.handled:not([open]) > .cron-next,
details.cron-card.handled:not([open]) > .cron-status {
  display: none;
}
details.cron-card.handled[open] > .cron-outcome,
details.cron-card.handled[open] > .cron-why,
details.cron-card.handled[open] > .cron-next,
details.cron-card.handled[open] > .cron-status {
  display: block;
}

/* Phase 2C — Today briefing: executive desk card (serif headline, brass kicker) */
.today-brief {
  margin: 2px 0 12px;
  padding: 14px 16px 13px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--bronze) 30%, transparent);
  border-left: 3px solid var(--bronze);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--bronze) 9%, transparent), transparent 70%),
    color-mix(in srgb, var(--panel) 94%, #000);
  box-shadow: var(--shadow-card);
}
.today-brief-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.today-kicker {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bronze);
}
.today-who {
  font-family: var(--display);
  font-size: 19px;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: var(--ink);
  overflow-wrap: anywhere;
  min-width: 0;
}
.today-lead {
  margin: 0 0 8px;
  font-family: var(--display);
  font-size: 15px;
  line-height: 1.45;
  color: color-mix(in srgb, var(--ink) 92%, var(--muted));
  overflow-wrap: anywhere;
}
.today-next-due {
  margin: 8px 0 0;
  font-size: 12.5px;
  color: var(--muted);
}
.today-stats {
  list-style: none;
  margin: 8px 0 4px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.today-stats li { margin: 0; min-width: 0; }
.today-stuck .today-link { color: #e8b4a0; }
.brief-ceo-list {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: grid;
  gap: 6px;
  font-size: 13px;
  line-height: 1.45;
}
.brief-ceo-list b { font-weight: 500; color: var(--ink); }
.brief-meta { color: var(--muted); font-size: 12.5px; }
.brief-stuck { color: var(--danger); }
.brief-lead { margin: 4px 0 0; font-size: 13px; line-height: 1.45; color: var(--ink); }
.bubble-more {
  margin-top: 8px;
  font-size: 12.5px;
  color: var(--muted);
}
.bubble-more summary {
  cursor: pointer;
  color: var(--bronze);
  min-height: 44px;
  display: flex;
  align-items: center;
}
.bubble-text-more {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
  max-height: 50vh;
  overflow: auto;
}
.chat-shell.work-open .stream {
  padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
}
.work-row-goal {
  margin: 0 0 4px;
  padding: 0 12px;
  font-size: 11.5px;
  color: var(--muted);
}
.cron-head-meta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.today-link {
  border: 1px solid var(--track);
  background: color-mix(in srgb, var(--bg) 60%, var(--panel));
  color: var(--ink);
  border-radius: 999px;
  padding: 6px 12px;
  min-height: 36px;
  font-size: 12.5px;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
  transition:
    border-color var(--dur-fast) var(--ease-out),
    color var(--dur-fast) var(--ease-out);
}
.today-link:hover { border-color: var(--bronze); color: var(--bronze); }
.today-needs .today-link {
  border-color: color-mix(in srgb, var(--danger) 55%, transparent);
  background: color-mix(in srgb, var(--danger) 13%, var(--panel));
  color: #f0c9bc;
  font-weight: 600;
}
.today-quiet { font-size: 12.5px; color: var(--muted); padding: 6px 2px; line-height: 1.4; }
.today-desk {
  margin: 8px 0 0;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.today-desk + .today-desk { margin-top: 6px; }
.today-desk span {
  display: block;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--bronze);
  margin-bottom: 1px;
}
.starter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
  justify-content: center;
}
.starter-chip {
  border: 1px solid color-mix(in srgb, var(--bronze) 38%, transparent);
  background: var(--bronze-soft);
  color: var(--strong);
  border-radius: 999px;
  padding: 8px 16px;
  font-size: 13px;
  line-height: 1.2;
  cursor: pointer;
  min-height: 44px;
  transition:
    border-color var(--dur-fast) var(--ease-out),
    color var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-spring);
}
.starter-chip:hover { border-color: var(--bronze); color: var(--bronze); }
.starter-chip:active { transform: scale(0.97); }
/* Phase 2C — message types: briefing / needs-you / answer read as three voices */
.bubble.msg-briefing {
  border: 1px solid color-mix(in srgb, var(--bronze) 32%, transparent);
  border-left: 3px solid var(--bronze);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--bronze) 7%, transparent), transparent 60%),
    color-mix(in srgb, var(--panel) 92%, #000);
  border-radius: 4px 14px 14px 14px;
  padding: 12px 14px;
  box-shadow: var(--shadow-card);
}
.bubble.msg-briefing .bubble-text {
  font-family: var(--display);
  font-size: 15.5px;
  line-height: 1.55;
}
.bubble.msg-briefing .status-fields { margin-top: 10px; }
.bubble.msg-needs-you {
  border: 1px solid color-mix(in srgb, var(--bronze) 55%, transparent);
  border-left: 3px solid var(--bronze);
  background: color-mix(in srgb, var(--bronze) 10%, var(--panel));
  border-radius: 4px 14px 14px 14px;
  padding: 12px 14px;
  box-shadow: var(--shadow-card), 0 0 0 1px color-mix(in srgb, var(--bronze) 18%, transparent);
}
.bubble.msg-answer .bubble-text { line-height: 1.55; max-width: 62ch; }
/* Phase 2C — work rows: one row pattern everywhere (one line desktop, stack phone) */
.work-row { border-bottom: 1px solid var(--line); }
.work-row:last-child { border-bottom: 0; }
.work-row-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
}
.work-row-head b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
  font-size: 13.5px;
  color: var(--ink);
}
.engine-pill {
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--bronze) 35%, transparent);
  background: var(--bronze-soft);
  color: var(--bronze);
  white-space: nowrap;
}
.work-row-state {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  white-space: nowrap;
}
.work-row.live .work-row-state { color: var(--mint); }
.work-row.failed .work-row-state,
.work-row.stuck .work-row-state { color: var(--danger); }
.work-row-ceo {
  margin: 2px 0 4px;
  font-size: 11.5px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cron-system-notes { margin-top: 8px; font-size: 12px; }
/* Phase 2C — Failed ribbon segment sits red-first whenever visible */
.work-ribbon .ribbon-seg.ribbon-fail { order: -1; color: #f0b39e; }
.work-ribbon .ribbon-seg.ribbon-fail .n {
  background: rgba(201, 137, 106, 0.16);
  color: #f0b39e;
  opacity: 1;
}
.work-ribbon .ribbon-seg.ribbon-fail.on {
  background: rgba(201, 137, 106, 0.16);
  color: #f0b39e;
  box-shadow: var(--shadow-inset);
}
.work-ribbon .ribbon-fail.need { order: -1; }
/* Phase 2C — live strip reads as part of the dock cluster, not a floating orphan */
.work-status.live-now-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 8px 8px 14px;
  margin: 0 0 8px;
  border: 1px solid color-mix(in srgb, var(--bronze) 30%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--panel) 90%, #000);
  box-shadow: inset 3px 0 0 var(--bronze), var(--shadow-soft);
  font-size: 12.5px;
}
#workStatusLive {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}
.live-now-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ink);
}
.live-watch-btn { flex: 0 0 auto; min-height: 36px; padding: 6px 14px; font-size: 12px; }
/* Phase 2C — settings top actions stay on one composed row */
.drawer-top-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin-left: auto;
}
.drawer-top-actions .ghost-btn {
  min-height: 40px;
  padding: 8px 14px;
  font-size: 13px;
  white-space: nowrap;
}
.ceo-switch-divider {
  text-align: center;
  font-size: 11px;
  color: var(--muted);
  padding: 10px 16px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  margin: 8px 0;
  animation: otto-fade-in var(--dur-med) var(--ease-out);
}
.chat-col.ceo-switching .stream {
  opacity: 0.72;
  transition: opacity 140ms var(--ease-out);
}
.chat-col:not(.ceo-switching) .stream {
  transition: opacity 220ms var(--ease-out);
}
.chat-col.ceo-switching .chat-head .chat-where {
  opacity: 0.85;
  transition: opacity 140ms var(--ease-out);
}
.settings-nav-label {
  margin: 10px 0 4px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}
.settings-nav-label:first-child {
  margin-top: 0;
}
#settings.settings-advanced-open .settings-nav-more {
  display: block;
}
.settings-nav-more {
  display: none;
}
/* Phase 2C — sheet chrome: dimmer sits under the sheet, dock stays tappable.
   Stack: thread < dimmer < sheet < dock. */
.chat-shell.activity-open::before,
.chat-shell.work-open::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(8, 7, 6, 0.5);
  z-index: 6;
  pointer-events: none;
  animation: otto-fade-in var(--dur-med) var(--ease-out);
}
@media (max-width: 1023px) {
  .activity-sheet:not([hidden]) { position: absolute; }
}
.activity-sheet:not([hidden])::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 4px;
  border-radius: 4px;
  background: color-mix(in srgb, var(--bronze) 45%, transparent);
  pointer-events: none;
  z-index: 2;
}
.activity-sheet:not([hidden]) .activity-bar {
  padding-top: 16px;
  cursor: ns-resize;
}
@media (min-width: 1024px) {
  /* Side-by-side desk — no overlay dimmer on desktop. */
  .chat-shell.activity-open::before,
  .chat-shell.work-open::before { display: none; }
}
@media (max-width: 480px) {
  .today-brief { padding: 12px 13px; margin: 0 0 10px; }
  .today-who { font-size: 17px; }
  .today-stats { gap: 6px; }
  .today-link { min-height: 44px; padding: 10px 14px; font-size: 13px; }
  .work-row-head { grid-template-columns: minmax(0, 1fr) auto; row-gap: 6px; }
  .work-row-head .work-row-state { grid-column: 1 / -1; justify-self: start; }
  .work-status.live-now-strip { margin: 0 0 6px; padding: 8px 8px 8px 12px; }
  .live-watch-btn { min-height: 44px; }
  .drawer-top-actions { gap: 6px; }
  .drawer-top-actions .ghost-btn { min-height: 44px; padding: 10px 12px; font-size: 12px; }
  /* Live sheet sits above composer when Work is open (monitoring holder builds). */
  .chat-shell.activity-open::before,
  .chat-shell.work-open::before { z-index: 40; }
  .activity-sheet:not([hidden]) {
    max-height: min(68vh, calc(100% - var(--chat-dock, 140px)));
  }
  .chat-shell.activity-open .chat-dock,
  .chat-shell.work-open .chat-dock { z-index: 10; position: relative; }
  .chat-shell.activity-open .activity-sheet:not([hidden]),
  .chat-shell.work-open .activity-sheet:not([hidden]) { z-index: 45; }
  .chat-dock { z-index: 8; position: relative; }
  .activity-sheet { z-index: 7; }
}
/* Phase 3 — rail desk cards + briefing-in-chat polish (tokens only, no logic) */
.org { gap: 6px; }
.org-desk-card {
  height: auto;
  min-height: 72px;
  border: 1px solid var(--line);
  border-left-width: 2px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg) 72%, var(--panel));
  box-shadow: var(--shadow-card);
  align-content: center;
}
.org-desk-card:hover { border-color: color-mix(in srgb, var(--bronze) 45%, var(--line)); }
.org-desk-card.on {
  border-color: color-mix(in srgb, var(--bronze) 55%, transparent);
  border-left-color: var(--bronze);
  background: var(--bronze-soft);
  color: var(--bronze);
  box-shadow: var(--shadow-card), var(--shadow-inset);
}
.org-desk-card.has-blocker { border-color: color-mix(in srgb, var(--danger) 40%, var(--line)); }
.org-staff {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg) 72%, var(--panel));
  min-height: 72px;
  height: auto;
  align-content: center;
}
.org-staff.on {
  border-color: color-mix(in srgb, var(--bronze) 55%, transparent);
  background: var(--bronze-soft);
}
.org-btn-text { gap: 3px; }
.org-lamp {
  color: var(--mint);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
}
.org-desk-card.has-blocker .org-lamp,
.org-desk-card.working .org-lamp { color: var(--bronze); }
.org-now { font-size: 11px; }
.org-avatar[data-life="working"] {
  border-color: var(--mint);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mint) 30%, transparent);
}
.org-avatar[data-life="blocked"] {
  border-color: var(--bronze);
  box-shadow: 0 0 0 2px rgba(201, 166, 107, 0.25);
}
.org-avatar[data-life="idle"] {
  border-color: var(--line);
  color: var(--muted);
  opacity: 1;
}
/* Stale Running reads amber-holding, never success green. */
.work-ribbon .ribbon-seg.stale {
  color: #e8d4b0;
  background: rgba(201, 166, 107, 0.12);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bronze) 38%, transparent);
}
.work-ribbon .ribbon-seg.stale .n {
  background: rgba(201, 166, 107, 0.25);
  color: #f3e3c8;
  opacity: 1;
}
/* Briefing in stream uses the Today card family — no second language. */
.briefing-card { font-family: var(--ui); }
.bubble.msg-briefing .briefing-card {
  margin: 0;
  padding: 0;
  border: 0;
  border-left: 0;
  background: transparent;
  box-shadow: none;
}
.brief-ceo-list { gap: 6px; }
.brief-ceo-list li { overflow-wrap: anywhere; }
.brief-meta { line-height: 1.45; }
/* Cron rows share the work-row rhythm: title + engine pill + state. */
.cron-head { gap: 8px; }
.cron-head b {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
  font-size: 13.5px;
  color: var(--ink);
}
.cron-head-meta {
  flex: 0 0 auto;
  gap: 6px;
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
}
.work-row-goal {
  margin: 2px 0 4px;
  font-size: 11.5px;
  color: var(--muted);
}
/* Live strip: Watch stays aligned, tappable, never wraps off at 390px. */
.ceo-pulse { align-items: center; }
.ceo-pulse-copy b {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.live-watch-btn {
  white-space: nowrap;
  min-width: 76px;
  min-height: 44px;
  align-self: center;
}
@media (max-width: 480px) {
  .org { padding: 10px 8px 12px; gap: 6px; }
  .org-desk-card, .org-staff { min-height: 72px; }
  .ceo-pulse { gap: 8px; }
  .live-watch-btn { min-width: 76px; }
}
/* Phase 4 — motion, sheet, prose, dock (tokens only, no logic) */
@keyframes otto-sheet-in {
  from { transform: translateY(26px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
/* 1. Sheet motion — drawer rise on open, dimmer fade, visible handle. */
.activity-sheet:not([hidden]),
.chat-shell.activity-open .activity-sheet:not([hidden]) {
  animation: otto-sheet-in var(--dur-slow) var(--ease-out);
  transition:
    transform var(--dur-med) var(--ease-out),
    opacity var(--dur-med) var(--ease-out);
}
.chat-shell.activity-open::before,
.chat-shell.work-open::before {
  transition: opacity var(--dur-med) var(--ease-out);
}
.activity-sheet:not([hidden])::before {
  width: 48px;
  height: 5px;
  background: color-mix(in srgb, var(--bronze) 60%, transparent);
}
.activity-sheet:not([hidden]) .activity-bar { cursor: grab; }
/* 2. Collision — mobile sheet sits above composer; desktop uses side desk. */
@media (max-width: 1023px) {
  .chat-shell.work-open .stream,
  .chat-shell.activity-open .stream {
    padding-bottom: calc(min(62%, 26rem) + 28px);
  }
  .chat-shell.work-panel-expanded .activity-sheet:not([hidden]),
  .chat-shell.work-panel-expanded.activity-open .activity-sheet:not([hidden]) {
    max-height: min(78vh, calc(100vh - var(--chat-dock, 140px) - 24px));
  }
}
.chat-dock {
  padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
}
/* 3. Live strip — fused with the dock cluster; Watch pinned right. */
.work-status.live-now-strip {
  padding: 10px 10px 10px 14px;
}
.live-now-text {
  color: var(--ink);
  font-size: 12.5px;
}
.live-now-sep {
  color: var(--muted);
  font-weight: 400;
}
.live-now-engine {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.work-status.live-now-strip .live-more-btn {
  margin-left: 4px;
  font-size: 11px;
  padding: 4px 8px;
  flex-shrink: 0;
}
.work-status.live-now-strip .live-watch-btn {
  margin-left: auto;
  align-self: center;
}
/* 4. Long prose — readable measure, expander in the briefing family. */
.bubble-text { max-width: 42rem; }
.bubble-more summary {
  font-size: 13px;
  font-weight: 500;
  width: fit-content;
  border-radius: 8px;
}
.bubble-more summary:hover { color: var(--ink); }
.bubble-text-more {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink);
}
/* 5. Message voices — briefing parchment, needs-you the only brass interrupt. */
.bubble.msg-needs-you { border-left-width: 4px; }
/* 6. Ribbon honesty — Live pulses mint, Stuck/Running holds amber, Failed untouched. */
.work-ribbon .ribbon-seg.hot { color: var(--mint); }
.work-ribbon .ribbon-seg.hot::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mint);
  animation: active-pulse 2s ease-in-out infinite;
}
.work-ribbon .ribbon-seg.hot .n {
  color: var(--mint);
  background: color-mix(in srgb, var(--mint) 16%, transparent);
  opacity: 1;
}
.work-ribbon .ribbon-seg.stale::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--bronze);
  opacity: 0.8;
}
@media (max-width: 480px) {
  .work-ribbon .ribbon-seg { min-height: 44px; padding: 10px 14px; font-size: 13px; }
  .activity-sheet:not([hidden])::before { width: 56px; }
  .chat-shell.work-open .stream,
  .chat-shell.activity-open .stream { padding-bottom: calc(68vh + 20px); }
}
@media (prefers-reduced-motion: reduce) {
  .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open::before,
  .chat-shell.work-open::before { animation: none; transition: none; }
  .work-ribbon .ribbon-seg.hot::before { animation: none; }
}
/* Phase 5 — transparency, desk side-sheet, job cards in chat, Tools scope (tokens only, no logic) */
/* 1. Side-sheet desktop: fixed desk panel in column 2; stream dim stays subtle. */
@media (min-width: 1024px) {
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) {
    position: sticky;
    top: 12px;
    max-height: calc(100vh - 220px);
    background:
      linear-gradient(180deg, color-mix(in srgb, var(--bronze) 6%, transparent), transparent 32%),
      var(--panel);
  }
  .chat-shell.work-open .activity-sheet:not([hidden]) .activity-bar,
  .chat-shell.activity-open .activity-sheet:not([hidden]) .activity-bar {
    position: sticky;
    top: 0;
    background: inherit;
    z-index: 2;
  }
  .chat-shell.activity-open .stream::after,
  .chat-shell.work-open .stream::after {
    background: color-mix(in srgb, var(--bg) 30%, transparent);
  }
}
/* 2. Job cards in chat: same work-row rhythm as the sheet; Watch 44px on mobile. */
.card.msg-job .job-stream-head .engine-pill { flex: 0 0 auto; }
.card.msg-job .job-stream-head .work-row-state {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  white-space: nowrap;
}
.card.msg-job .job-watch-btn {
  min-height: 44px;
  padding: 10px 14px;
  font-size: 12px;
  border-radius: 999px;
}
.card.msg-job .job-stream-meta {
  margin-top: 6px;
  font-size: 11.5px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 3. Tools inspector: kicker is the scope line; Code | Hermes tabs stay secondary. */
.embed-kicker.tools-scope {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.embed-kicker.tools-scope::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--bronze);
  margin-right: 8px;
  vertical-align: 1px;
}
.embed-head .tool-tabs {
  opacity: 0.85;
  box-shadow: none;
}
.embed-head .tool-tab { font-size: 11.5px; }
.embed-head h1 {
  font-size: 15px;
  font-weight: 500;
  color: var(--muted);
}
/* 4. Today lead: serif, readable at 390px; next-due reads tappable. */
.today-lead {
  font-size: 16px;
  line-height: 1.5;
  text-wrap: pretty;
}
.today-next-due .today-link,
button.today-next-due,
a.today-next-due {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--bronze) 60%, transparent);
  text-underline-offset: 3px;
}
/* 5. Briefing family: one parchment/brass language across thread + Today + cards. */
.msg-briefing,
.today-brief,
.briefing-card {
  --brief-tint: linear-gradient(180deg, color-mix(in srgb, var(--bronze) 9%, transparent), transparent 70%);
}
.today-brief,
.briefing-card {
  background:
    var(--brief-tint),
    color-mix(in srgb, var(--panel) 94%, #000);
  border: 1px solid color-mix(in srgb, var(--bronze) 30%, transparent);
  border-left: 3px solid var(--bronze);
  border-radius: 16px;
  box-shadow: var(--shadow-card);
}
.briefing-card {
  padding: 14px 16px 13px;
  font-family: var(--display);
  font-size: 15px;
  line-height: 1.5;
  color: color-mix(in srgb, var(--ink) 92%, var(--muted));
}
@media (max-width: 480px) {
  .today-lead { font-size: 16px; }
  .card.msg-job .job-watch-btn { min-width: 76px; }
  .embed-kicker.tools-scope { font-size: 12.5px; white-space: normal; }
}
/* Phase 6 — live transparency, org Today glance, progress log (tokens only, no logic) */
/* 1. Progress transparency — step log reads fully at 390px, never clipped sideways. */
.thinking-log.has-steps {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.thinking-log.has-steps li::marker { color: var(--bronze); }
@media (max-width: 480px) {
  .thinking-log.has-steps {
    font-size: 12px;
    line-height: 1.45;
    max-height: 9em;
    padding-right: 4px;
  }
}
/* Live strip — step text truncates on one line, engine stays muted. */
.live-now-text strong { font-weight: 600; }
.live-now-text .live-now-step { color: var(--muted); }
/* 2. Today org glance — lamp hierarchy over serif names, one-liner ellipsis. */
.today-org-row { align-items: center; }
.today-org-lamp.live { background: var(--mint, var(--sage, #8fbfb2)); }
.today-org-lamp.quiet { background: color-mix(in srgb, var(--muted) 60%, transparent); }
.today-org-row b { font-size: 13.5px; }
.today-org-row span { flex: 1 1 auto; }
@media (max-width: 480px) {
  .today-org-row { font-size: 13px; }
}
/* 3. Job card meta — hierarchy under the head; Watch keeps a 44px target on mobile. */
.card.msg-job .job-stream-meta { margin-top: 6px; }
.card.msg-job .job-stream-step {
  margin-top: 2px;
  overflow-wrap: anywhere;
}
@media (max-width: 480px) {
  .card.msg-job .job-watch-btn { min-height: 44px; }
  .live-watch-btn { min-height: 44px; }
}
/* 4. Today details — same parchment as the briefing family, not a second card. */
.today-details {
  background:
    var(--brief-tint, linear-gradient(180deg, color-mix(in srgb, var(--bronze) 9%, transparent), transparent 70%)),
    color-mix(in srgb, var(--panel) 94%, #000);
  border: 1px solid color-mix(in srgb, var(--bronze) 30%, transparent);
  border-left: 3px solid var(--bronze);
  border-radius: 12px;
  padding: 8px 12px 10px;
}
.today-details summary {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
/* Phase 7 — world-class program: settings calm, chat voices, header lamps,
   ribbon honesty, tools inspector, 390px rhythm (tokens only, no logic) */
/* 1. Settings drawer — default nav reads as 5–6 calm items; essentials lede first. */
.settings-essentials.lede {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--bronze) 8%, transparent), transparent 70%),
    color-mix(in srgb, var(--panel) 96%, #000);
  border: 1px solid color-mix(in srgb, var(--bronze) 26%, transparent);
  border-left: 3px solid var(--bronze);
  border-radius: 12px;
  padding: 10px 14px;
  color: color-mix(in srgb, var(--ink) 88%, var(--muted));
  font-size: 13.5px;
  line-height: 1.5;
}
.settings-essentials.lede strong { color: var(--bronze); font-weight: 600; }
.drawer-nav-compact { gap: 3px; padding: 12px 10px; }
.drawer-nav-compact .drawer-tab {
  min-height: 40px;
  display: flex;
  align-items: center;
  font-size: 13.5px;
  color: color-mix(in srgb, var(--ink) 82%, var(--muted));
  border-radius: 10px;
}
.drawer-nav-compact .drawer-tab.on {
  background: var(--bronze-soft);
  color: var(--ink);
  box-shadow: var(--shadow-inset);
}
/* Advanced revealed: nav compacts, non-active items step back. */
#settings.settings-advanced-open .drawer-nav-compact .drawer-tab:not(.on) {
  min-height: 36px;
  font-size: 12.5px;
  color: var(--muted);
}
#settings.settings-advanced-open #toggleSettingsAdvanced {
  background: var(--bronze-soft);
  color: var(--bronze);
  border: 1px solid color-mix(in srgb, var(--bronze) 40%, transparent);
}
/* Models panel: seat cards primary, advanced blocks muted/collapsed. */
.seat-list .seat-card {
  border: 1px solid color-mix(in srgb, var(--bronze) 30%, var(--line));
  box-shadow: var(--shadow-card);
}
[data-settings-adv] {
  opacity: 0.72;
  border-left: 2px dashed color-mix(in srgb, var(--bronze) 35%, transparent);
  padding-left: 10px;
  font-size: 12.5px;
}
#panel-you { gap: 14px; }
/* 2. Chat stream — answer voice + engine foot; scope hierarchy in the head. */
.chat-head-scope { display: grid; gap: 1px; min-width: 0; }
.bubble.msg-answer .bubble-text { line-height: 1.6; max-width: 62ch; }
.answer-engine-foot { margin: 8px 0 0; }
.answer-engine-foot .engine-pill { opacity: 0.9; }
/* 3. Header — engines chip carries a real lamp dot (mint/amber/red). */
.engines-chip::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--bronze);
  margin-right: 7px;
}
.engines-chip.ok::before {
  background: var(--mint);
  box-shadow: 0 0 6px color-mix(in srgb, var(--mint) 60%, transparent);
}
.engines-chip.warn::before {
  background: var(--danger);
  box-shadow: 0 0 6px color-mix(in srgb, var(--danger) 60%, transparent);
}
/* 4. Work + sheet — Failed stays red-first; dim stays subtle under the sheet. */
.work-ribbon .ribbon-seg.ribbon-fail {
  order: -1;
  border: 1px solid color-mix(in srgb, var(--danger) 45%, transparent);
}
.chat-shell.activity-open::before,
.chat-shell.work-open::before {
  background: rgba(8, 7, 6, 0.42);
}
/* 5. Tools inspector — scope kicker + aim + hints read as one line family. */
.embed-aim { max-width: 72ch; }
.embed-hint { max-width: 72ch; }
/* 6. 390px rhythm — dock fused unit tighter; ribbon snap-scrolls. */
@media (max-width: 480px) {
  .chat-dock { gap: 6px; padding: 8px 8px calc(10px + env(safe-area-inset-bottom, 0px)); }
  .work-ribbon {
    scroll-snap-type: x proximity;
    gap: 6px;
  }
  .work-ribbon .ribbon-seg { scroll-snap-align: start; }
  .settings-essentials.lede { font-size: 13px; }
  .answer-engine-foot .engine-pill { font-size: 10px; }
}

/* Phase 8 — one-column chat, clean chrome, fluid composer (Muse + Cursor) */
footer.footer-minimal {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 6px 14px calc(6px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid color-mix(in srgb, var(--ink) 6%, transparent);
  background: color-mix(in srgb, var(--bg) 92%, #000);
}
footer.footer-minimal #boardMark {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: lowercase;
  color: color-mix(in srgb, var(--muted) 88%, transparent);
}
.chat-dock .ceo-live.dock-live {
  margin: 0;
  padding: 0;
  border-radius: 12px;
  background: color-mix(in srgb, var(--mint) 8%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--mint) 22%, var(--track));
}
.chat-dock .ceo-live.dock-live .ceo-pulse {
  padding: 8px 10px;
  gap: 8px;
}
.chat-dock .ceo-live.dock-live .ceo-pulse-copy b {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
}
.composer textarea#msg {
  font-size: 16px;
  line-height: 1.45;
  min-height: 44px;
  max-height: 9rem;
  resize: none;
  field-sizing: content;
}
@supports not (field-sizing: content) {
  .composer textarea#msg { min-height: 44px; }
}
.chat-folder {
  font-size: 13px;
  line-height: 1.4;
  color: var(--muted);
  max-width: 36rem;
}
.chat-head-scope .chat-where {
  font-size: clamp(15px, 2.8vw, 18px);
}
.stream {
  padding: 0 2px;
  gap: 10px;
}
.bubble.bot .bubble-text {
  font-size: 15px;
  line-height: 1.5;
}
.today-brief {
  margin-bottom: 12px;
}
.chat-context { display: none !important; }
.today-autopilot {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--bronze) 22%, var(--track));
  background: color-mix(in srgb, var(--panel) 92%, #000);
}
.today-autopilot.ask {
  border-color: color-mix(in srgb, var(--bronze) 38%, var(--track));
}
.today-autopilot-kicker {
  margin: 0 0 4px;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bronze);
  font-weight: 600;
}
.today-autopilot-copy {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: color-mix(in srgb, var(--ink) 88%, var(--muted));
}
.today-autopilot-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.today-autopilot-actions .ghost-btn,
.today-autopilot-actions .send {
  min-height: 40px;
  font-size: 12px;
}
.today-decision {
  margin-top: 10px;
  border-color: color-mix(in srgb, var(--bronze) 48%, var(--track));
}
.today-decision .need-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.today-schedule-truth {
  margin: 8px 0 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--muted);
  max-width: 62ch;
}

/* Phase 8 — Muse pass: one-column calm (overrides stub above; tokens only) */
/* 1. Stream rhythm — one room, breathing thread, calm measure. */
.stream {
  padding: 18px 4px 20px;
  gap: 14px;
}
.bubble { gap: 6px; }
.bubble.bot {
  padding: 2px 4px;
  max-width: 100%;
}
.bubble.bot .bubble-text {
  font-size: 15.5px;
  line-height: 1.6;
  max-width: 44rem;
  overflow-wrap: anywhere;
}
.bubble.msg-answer .bubble-text {
  line-height: 1.6;
  max-width: 62ch;
  font-size: 15.5px;
}
.today-brief { margin: 4px 0 14px; }
.today-brief-head { gap: 8px 10px; }
.card.msg-job {
  padding: 12px 14px 13px;
  gap: 6px;
}
.card.msg-job .job-stream-meta { font-size: 12px; }
.starter-chips {
  gap: 8px;
  margin-top: 12px;
  justify-content: flex-start;
}
.empty-stream .starter-chips { justify-content: center; }
.starter-chip {
  min-height: 44px;
  padding: 10px 16px;
  font-size: 13.5px;
}
/* 2. Dock family — ribbon + live strip + composer read as one unit, no squeeze. */
.chat-dock {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  gap: 8px;
}
.chat-dock .ceo-live.dock-live { border-radius: 12px; }
.chat-dock .ceo-live.dock-live .ceo-pulse {
  padding: 8px 8px 8px 12px;
  align-items: center;
}
.chat-dock .ceo-live.dock-live .ceo-pulse-copy {
  min-width: 0;
  flex: 1 1 auto;
}
.chat-dock .ceo-live.dock-live .ceo-pulse-copy b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.composer-input-row {
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: end;
}
.composer-input-row .attach-btn {
  width: 44px;
  min-width: 44px;
  flex-shrink: 0;
}
.composer-input-row .send { flex-shrink: 0; }
.composer textarea#msg {
  min-width: 0;
  width: 100%;
}
/* 3. Chat head — scope breathes; buttons never crush the subline. */
.chat-head { padding: 16px 4px 10px; }
.chat-head-row { align-items: center; gap: 12px; }
.chat-head-scope {
  flex: 1 1 auto;
  min-width: 0;
}
.chat-head-scope .chat-where {
  font-size: clamp(19px, 1.2vw + 16px, 23px);
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
}
.chat-folder {
  margin-top: 2px;
  max-width: 60ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.chat-head-row .ghost-btn { flex-shrink: 0; align-self: center; }
/* 4. Work sheet — side desk from 1024 up; no dimmer when side-by-side. */
@media (min-width: 1024px) {
  .chat-shell.activity-open::before,
  .chat-shell.work-open::before { display: none; }
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) {
    border-radius: 16px;
  }
  .activity-body { padding: 8px 16px 18px; gap: 4px; }
}
@media (min-width: 1280px) {
  .chat-shell.work-open,
  .chat-shell.activity-open {
    width: min(80rem, calc(100% - 48px));
    column-gap: 22px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .chat-dock { gap: 8px; }
}
/* 5. Footer stays a whisper — BRAND credit is visible but small; full lockup in Settings → About. */
footer.footer-minimal { min-height: 0; flex-wrap: wrap; gap: 2px 12px; }
footer.footer-minimal .footer-credit {
  margin: 0;
  font-size: 11px;
  line-height: 1.35;
  text-align: center;
  color: color-mix(in srgb, var(--muted) 80%, transparent);
}
@media (max-width: 860px) {
  .stream { padding: 12px 4px 14px; gap: 10px; }
  .chat-head { padding: 12px 2px 8px; }
  .starter-chips { justify-content: center; }
}

/* Phase 9 — Autopilot / Think loop visible, executive Today (Muse, tokens only) */
/* 1. Autopilot reads as one inset band inside Today — same bronze family, quieter voice. */
.today-autopilot {
  margin: 10px 0 2px;
  padding: 10px 12px 12px;
  border: 1px solid color-mix(in srgb, var(--bronze) 24%, var(--track));
  border-left: 2px solid color-mix(in srgb, var(--bronze) 72%, transparent);
  border-radius: 12px;
  background:
    var(--brief-tint, linear-gradient(180deg, color-mix(in srgb, var(--bronze) 9%, transparent), transparent 70%)),
    color-mix(in srgb, var(--panel) 96%, #000);
  box-shadow: none;
}
.today-autopilot.on {
  border-color: color-mix(in srgb, var(--bronze) 22%, var(--track));
}
.today-autopilot.ask {
  border-color: color-mix(in srgb, var(--bronze) 40%, var(--track));
  border-left-color: var(--bronze);
}
.today-autopilot-org {
  margin: 10px 0 2px;
  border-left-width: 2px;
}
.today-autopilot-kicker {
  margin: 0 0 3px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--bronze);
}
.today-autopilot-copy {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: color-mix(in srgb, var(--ink) 86%, var(--muted));
  max-width: 62ch;
  overflow-wrap: anywhere;
}
.today-autopilot-copy strong {
  font-weight: 600;
  color: var(--ink);
}
.today-autopilot-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.today-autopilot-actions .ghost-btn,
.today-autopilot-actions .send {
  min-height: 40px;
  padding: 8px 14px;
  font-size: 12.5px;
  border-radius: 999px;
}
.today-autopilot.ask .today-autopilot-actions .send {
  background: var(--bronze-soft);
  border: 1px solid color-mix(in srgb, var(--bronze) 45%, transparent);
  color: var(--bronze);
}
/* 2. One family — desk detail, autopilot, next-due stack without clutter. */
.today-brief .today-desk + .today-autopilot { margin-top: 12px; }
.today-autopilot + .today-next-due {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
}
.today-next-due { font-size: 12.5px; line-height: 1.45; }
/* 3. Goals tab empty state — calmer read, same card language, no dashboard shout. */
.cron-empty {
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px dashed color-mix(in srgb, var(--bronze) 34%, var(--track));
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 96%, #000);
  font-size: 13.5px;
  line-height: 1.5;
  color: color-mix(in srgb, var(--ink) 86%, var(--muted));
}
.cron-story {
  margin: 10px 0 4px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
  max-width: 62ch;
}
.horizon-board { gap: 12px; margin-top: 6px; }
.horizon-row textarea {
  background: color-mix(in srgb, var(--bg) 60%, var(--panel));
  border: 1px solid var(--track);
  border-radius: 10px;
  padding: 9px 11px;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--ink);
}
.horizon-row textarea:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--bronze) 50%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--bronze) 28%, transparent);
}
@media (max-width: 480px) {
  .today-autopilot { padding: 10px 11px 12px; }
  .today-autopilot-actions .ghost-btn,
  .today-autopilot-actions .send { min-height: 44px; }
  .cron-empty { font-size: 13px; }
}

/* Phase 10 — CEO proposes + job cards in the stream (Muse, tokens only) */
/* 1. Decision moment — same bronze family as autopilot, warmer ask edge; primary Do-it vs ghost. */
.today-decision {
  margin: 10px 0 2px;
  padding: 10px 12px 12px;
  border: 1px solid color-mix(in srgb, var(--bronze) 40%, var(--track));
  border-left: 2px solid var(--bronze);
  border-radius: 12px;
  background:
    var(--brief-tint, linear-gradient(180deg, color-mix(in srgb, var(--bronze) 9%, transparent), transparent 70%)),
    color-mix(in srgb, var(--panel) 96%, #000);
  box-shadow: none;
}
.today-decision .today-autopilot-copy { max-width: 62ch; }
.today-decision .need-actions { margin-top: 10px; }
.today-decision .need-actions .send {
  background: var(--bronze-soft);
  border: 1px solid color-mix(in srgb, var(--bronze) 45%, transparent);
  color: var(--bronze);
}
.today-decision .need-actions .ghost-btn { opacity: 0.85; }
.today-brief .today-decision + .today-autopilot,
.today-brief .today-autopilot + .today-decision { margin-top: 10px; }
.today-decision + .today-next-due {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
}
/* 2. Schedule truth — muted sans line under the serif lead; never competes with it. */
.today-schedule-truth {
  margin: 6px 0 0;
  font-family: var(--ui);
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--muted);
  max-width: 62ch;
  overflow-wrap: anywhere;
}
.today-lead + .today-schedule-truth { margin-top: 6px; }
/* 3. Job cards in stream — calmer hierarchy (title / body / meta), engine pill kept visible. */
.card.msg-job { box-shadow: none; }
.card.msg-job .job-stream-head b {
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--ink);
}
.card.msg-job .job-stream-step {
  font-size: 12.5px;
  line-height: 1.5;
  color: color-mix(in srgb, var(--ink) 86%, var(--muted));
  max-width: 62ch;
  overflow-wrap: anywhere;
}
.card.msg-job .job-stream-head .engine-pill { flex: 0 0 auto; }
.card.msg-job .job-actions .ghost-btn,
.card.msg-job .job-actions .send {
  min-height: 40px;
  font-size: 12px;
  border-radius: 999px;
}
@media (max-width: 480px) {
  .today-decision { padding: 10px 11px 12px; }
  .today-decision .need-actions .ghost-btn,
  .today-decision .need-actions .send { min-height: 44px; }
  .card.msg-job .job-actions .ghost-btn,
  .card.msg-job .job-actions .send { min-height: 44px; }
}

/* Phase 11 — desktop frame + calmer job cards (Muse/Cursor) */
@media (min-width: 861px) {
  #stage-chat.on {
    display: grid;
    grid-template-columns: var(--rail-width, 252px) 5px minmax(0, 1fr);
    min-height: 0;
    height: 100%;
  }
  .rail {
    position: relative;
    top: auto;
    left: auto;
    bottom: auto;
    transform: none;
    width: 100%;
    max-width: none;
    min-width: 0;
    flex-shrink: 0;
    z-index: 1;
    box-shadow: none;
    grid-column: 1;
  }
  .rail-splitter {
    grid-column: 2;
  }
  .chat-col {
    grid-column: 3;
  }
  .rail-scrim {
    display: none !important;
    pointer-events: none !important;
    position: absolute;
    inset: 0;
    grid-column: 1 / -1;
    z-index: 0;
  }
  .mobile-org-toggle,
  .mobile-settings-btn { display: none !important; }
  .chat-col { width: 100%; max-width: none; min-width: 0; }
  .chat-shell.work-open .stream,
  .chat-shell.activity-open .stream { padding-bottom: 12px; }
  html.is-desktop #stage-chat.on {
    display: grid;
    grid-template-columns: var(--rail-width, 252px) 5px minmax(0, 1fr);
    min-height: 0;
    height: 100%;
  }
  html.is-desktop .bar {
    display: grid;
    grid-template-columns: minmax(168px, 1fr) auto minmax(168px, 1fr);
    padding: 10px 20px;
  }
  html.is-desktop .bar-right .engines-chip,
  html.is-desktop .bar-right .pulse,
  html.is-desktop .bar-right .meter,
  html.is-desktop .bar-right .engine-hint { display: flex !important; }
  html.is-desktop .sub { display: block; }
}
@media (min-width: 1024px) {
  .chat-shell {
    width: min(46rem, calc(100% - 24px));
    max-width: 46rem;
    margin: 0 auto;
  }
  .chat-shell.work-open,
  .chat-shell.activity-open {
    width: min(78rem, calc(100% - 32px));
    max-width: none;
    margin: 0 auto;
  }
  .stream {
    padding: 16px 6px 20px;
    gap: 14px;
  }
}
@media (min-width: 1280px) {
  .chat-shell:not(.work-open):not(.activity-open) {
    width: min(48rem, calc(100vw - 320px));
  }
}
.card.msg-job .lane-pill { display: none; }
.card.msg-job {
  border: 1px solid color-mix(in srgb, var(--bronze) 18%, var(--track));
  border-radius: 16px;
  background: color-mix(in srgb, var(--panel) 96%, #000);
  box-shadow: none;
  padding: 0;
  overflow: hidden;
}
.card.msg-job .job-stream-chrome {
  padding: 12px 14px 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--track) 80%, transparent);
  background: color-mix(in srgb, var(--bronze) 5%, transparent);
}
.card.msg-job .job-stream-head b {
  font-family: var(--display);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-transform: none;
}
.card.msg-job .bubble-text,
.card.msg-job > pre {
  padding: 12px 14px 10px;
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  max-width: 62ch;
}
.card.msg-job .meta { display: none; }
.card.msg-job .gate-line,
.card.msg-job .diff-wrap .meta {
  display: block;
  padding: 0 14px 8px;
  font-size: 11.5px;
  color: var(--muted);
}
.card.msg-job .diff-actions {
  padding: 0 14px 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.card.msg-job .diff-actions .send { min-width: 7rem; }

/* Phase 12 — stable work desk, ribbon without gutter, Tools watch (Muse, CSS only) */
/* 1. Desktop shell stays put: one 78rem frame always; thread column fixed 42rem
      so the sheet slides in beside it instead of resizing the room. */
@media (min-width: 1024px) {
  .chat-shell,
  .chat-shell:not(.work-open):not(.activity-open),
  .chat-shell.work-open,
  .chat-shell.activity-open {
    width: min(78rem, calc(100% - 32px));
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  .chat-shell.work-open,
  .chat-shell.activity-open {
    display: grid;
    grid-template-columns: minmax(0, 42rem) minmax(17rem, 22rem);
    justify-content: center;
    column-gap: 18px;
  }
  .chat-shell .chat-head,
  .chat-shell .stream,
  .chat-shell .chat-dock,
  .chat-shell .work-status {
    width: min(42rem, 100%);
    margin-left: auto;
    margin-right: auto;
  }
  .chat-shell.work-open .chat-head,
  .chat-shell.activity-open .chat-head,
  .chat-shell.work-open .stream,
  .chat-shell.activity-open .stream,
  .chat-shell.work-open .chat-dock,
  .chat-shell.activity-open .chat-dock,
  .chat-shell.work-open .work-status,
  .chat-shell.activity-open .work-status {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .chat-shell .stream { scrollbar-gutter: stable; }
  /* Sheet animates transform/opacity only — grid stays fixed, no teleport. */
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) {
    animation: otto-sheet-in var(--dur-slow) var(--ease-out);
    contain: layout style;
    will-change: transform, opacity;
  }
  /* Dimmer is mobile-only; side-by-side desk never dims the thread. */
  .chat-shell.activity-open::before,
  .chat-shell.work-open::before { display: none; }
  .chat-shell.activity-open .stream::after,
  .chat-shell.work-open .stream::after {
    background: color-mix(in srgb, var(--bg) 30%, transparent);
  }
}
/* 2. Ribbon is one full-width segmented control — no dead left gutter. */
.chat-dock .work-ribbon {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 4px;
}
@media (min-width: 1024px) {
  .chat-dock .work-ribbon {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    gap: 2px;
    overflow-x: visible;
  }
  .chat-dock .work-ribbon .ribbon-seg {
    justify-content: center;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 40px;
  }
}
.work-ribbon .ribbon-seg:first-child { margin-left: 0; }
#workFailed[hidden] { display: none !important; }
.work-ribbon .ribbon-seg.ribbon-fail { order: -1; }
/* 3. Dock is one fused pill with reserved heights — Running never shoves input. */
.chat-dock {
  min-height: 0;
  contain: layout style;
}
.chat-dock .work-ribbon { min-height: 48px; }
.chat-dock .ceo-live.dock-live:not([hidden]) { min-height: 44px; }
.chat-dock .composer textarea#msg { min-height: 44px; }
.chat-col.ceo-switching .stream { opacity: 0.72; }
.chat-col.ceo-switching .chat-dock { opacity: 1; }
/* 4. Tools reads as an inspector frame, never an empty void. */
#stage-opencode.on, #stage-hermes.on, #stage-openship.on {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  gap: 0;
}
.embed-head {
  margin: 14px 16px 10px;
  padding: 12px 14px 10px;
  border: 1px solid var(--track);
  border-radius: 16px;
  background: color-mix(in srgb, var(--panel) 94%, #000);
  box-shadow: var(--shadow-card);
}
.embed-aim:empty::after {
  content: "Watching this CEO — open any job Watch to focus it here.";
  color: var(--muted);
  font-size: 13px;
}
.embed-live:not([hidden]) {
  display: flex;
  align-items: center;
  gap: 8px;
}
.embed-live:not([hidden])::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--bronze);
  flex: 0 0 auto;
}
.embed-hint {
  margin: 0 16px 10px;
  padding: 8px 12px;
  max-width: 72ch;
  border: 0;
  border-left: 2px solid color-mix(in srgb, var(--bronze) 60%, transparent);
  border-radius: 0 10px 10px 0;
  background: color-mix(in srgb, var(--bronze) 7%, transparent);
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--muted);
}
.embed {
  flex: 1 1 auto;
  min-height: calc(100vh - 340px);
  margin: 0 16px 16px;
  width: auto;
  border: 1px solid var(--track);
  border-radius: 16px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--bronze) 5%, transparent), transparent 40%),
    #0b0a09;
}
/* 5. Settings grouped nav — Board vs This CEO vs More reads at a glance. */
.drawer-nav-compact .settings-nav-label {
  margin: 12px 0 4px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bronze);
  opacity: 0.85;
}
.drawer-nav-compact .settings-nav-label:first-child { margin-top: 2px; }
.drawer-nav-compact .settings-nav-ceo.drawer-tab {
  border-left: 2px solid color-mix(in srgb, var(--bronze) 55%, transparent);
  border-radius: 0 10px 10px 0;
  background: color-mix(in srgb, var(--bronze) 7%, transparent);
}
.drawer-nav-compact .settings-nav-ceo.drawer-tab.on {
  background: var(--bronze-soft);
  border-left-color: var(--bronze);
}
.drawer-nav-compact .settings-nav-more { opacity: 0.7; }
#settings:not(.settings-advanced-open) .drawer-nav-compact .settings-nav-more,
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="engines"],
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="keys"],
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="models"],
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="usage"],
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="folder"],
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="import"],
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="connectors"],
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="routines"],
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="git"],
#settings:not(.settings-advanced-open) .drawer-nav-compact [data-panel="advanced"] {
  display: none;
}
.settings-essentials.lede {
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--bronze) 24%, var(--track));
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 96%, #000);
  max-width: 62ch;
}
/* 6. Stream Watch stays secondary, calm, and tappable. */
.card.msg-job .job-watch-btn,
.live-watch-btn {
  min-height: 44px;
  min-width: 44px;
  padding: 10px 14px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 999px;
  border: 1px solid var(--track);
  background: transparent;
  color: var(--muted);
}
.card.msg-job .job-watch-btn:hover,
.live-watch-btn:hover {
  color: var(--bronze);
  border-color: color-mix(in srgb, var(--bronze) 45%, transparent);
}
@media (prefers-reduced-motion: reduce) {
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) { animation: none; }
}

/* Phase 13 — Flagship polish: one layout truth, executive hierarchy (Muse, CSS only) */
/* 1. Single desktop source of truth — this block wins over §§4728/6141/6393/6463.
      Shell is always one 78rem frame; thread column never teleports; sheet only
      animates transform/opacity beside it. Mobile bottom-sheet untouched. */
@media (min-width: 1024px) {
  .chat-shell,
  .chat-shell:not(.work-open):not(.activity-open),
  .chat-shell.work-open,
  .chat-shell.activity-open {
    width: min(78rem, calc(100% - 32px)) !important;
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 20px 14px;
    box-sizing: border-box;
  }
  .chat-shell.work-open,
  .chat-shell.activity-open {
    display: grid !important;
    grid-template-columns: minmax(0, 42rem) minmax(17rem, 22rem) !important;
    justify-content: center;
    column-gap: 18px;
    align-content: stretch;
  }
  .chat-shell:not(.work-open):not(.activity-open) .chat-head,
  .chat-shell:not(.work-open):not(.activity-open) .stream,
  .chat-shell:not(.work-open):not(.activity-open) .chat-dock,
  .chat-shell:not(.work-open):not(.activity-open) .work-status {
    width: min(42rem, 100%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .chat-shell.work-open .chat-head,
  .chat-shell.activity-open .chat-head { grid-column: 1 / -1; grid-row: 1; width: 100%; margin: 0; }
  .chat-shell.work-open .stream,
  .chat-shell.activity-open .stream { grid-column: 1; grid-row: 2; width: 100%; margin: 0; min-height: 0; position: relative; scrollbar-gutter: stable; }
  .chat-shell.work-open .chat-dock,
  .chat-shell.activity-open .chat-dock { grid-column: 1; grid-row: 3; width: 100%; margin: 0; }
  .chat-shell.work-open .work-status,
  .chat-shell.activity-open .work-status { grid-column: 1; grid-row: 2; align-self: end; width: 100%; margin: 0; z-index: 3; pointer-events: none; }
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) {
    display: flex !important;
    position: static !important;
    grid-column: 2; grid-row: 2 / span 2;
    left: auto; right: auto; bottom: auto;
    z-index: auto; max-height: none; min-height: 0;
    margin-bottom: 0; padding: 4px 0 8px 16px;
    border: 1px solid var(--track); border-radius: 16px;
    background: var(--panel); box-shadow: var(--shadow-card);
    overflow: hidden auto;
    contain: layout style; will-change: transform, opacity;
    animation: otto-sheet-in var(--dur-slow) var(--ease-out) !important;
  }
  /* Light scrim only — thread stays legible, never dimmed out. */
  .chat-shell.activity-open::before,
  .chat-shell.work-open::before { display: none !important; }
  .chat-shell.activity-open .stream::after,
  .chat-shell.work-open .stream::after {
    content: ""; position: absolute; inset: 0; border-radius: 14px;
    background: color-mix(in srgb, var(--bg) 30%, transparent) !important;
    pointer-events: none; z-index: 1;
  }
  .chat-shell.activity-open .stream > *,
  .chat-shell.work-open .stream > * { position: relative; z-index: 2; }
}
@keyframes otto-sheet-in {
  from { opacity: 0; transform: translateX(10px); }
  to { opacity: 1; transform: none; }
}
/* 2. Activity chrome — executive list: quiet title, hairline sections, dock-safe body. */
#activityTitle {
  font-family: var(--display); font-size: 15px; font-weight: 500;
  letter-spacing: 0.02em; text-transform: none; color: var(--ink);
}
.activity-bar { min-height: 52px; padding: 10px 8px 10px 16px; gap: 10px; }
.activity-bar span { font-size: 11px; letter-spacing: 0.14em; }
.activity-close { min-height: 40px; font-size: 12.5px; transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out); }
.activity-body { padding: 8px 16px calc(20px + env(safe-area-inset-bottom, 0px)); gap: 6px; }
.cron-section {
  margin: 12px 0 2px; padding-top: 10px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  font-size: 10.5px; letter-spacing: 0.14em; color: var(--bronze); opacity: 0.9;
}
.cron-section:first-child { margin-top: 4px; border-top: 0; padding-top: 0; }
.cron-card {
  border: 1px solid color-mix(in srgb, var(--track) 85%, transparent);
  border-radius: 12px; padding: 9px 12px;
  background: color-mix(in srgb, var(--panel) 96%, #000);
  transition: border-color var(--dur-fast) var(--ease-out);
}
.cron-card:hover { border-color: color-mix(in srgb, var(--bronze) 30%, var(--track)); }
/* 3. Today + stream — one parchment/bronze family, 62ch measure, work-row job cards. */
.today-brief { max-width: 62ch; }
.today-brief-head { align-items: baseline; }
.today-lead { font-size: 15.5px; line-height: 1.5; max-width: 62ch; }
.today-brief .brief-lead, .today-autopilot-copy, .today-next-due { max-width: 62ch; }
.bubble.bot .bubble-text, .bubble.msg-answer .bubble-text { max-width: 62ch; }
.card.msg-job .job-stream-chrome { background: color-mix(in srgb, var(--bronze) 6%, transparent); }
.card.msg-job .job-stream-meta { color: var(--muted); }
.card.msg-job .engine-pill {
  font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase;
  border: 1px solid var(--track); border-radius: 999px; padding: 2px 8px; color: var(--muted);
}
/* 4. Org rail — desk cards: selectable, alive, serif name + calm status. */
.org-desk-card, .org-btn {
  border-radius: 14px;
  transition: background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.org-desk-card b, .org-btn b { font-family: var(--display); font-weight: 500; font-size: 14px; letter-spacing: 0.01em; }
.org-desk-card .org-now, .org-btn .org-now { font-size: 11.5px; line-height: 1.4; }
.org-desk-card.on, .org-btn.on {
  background: color-mix(in srgb, var(--bronze) 10%, var(--panel));
  border-left: 2px solid var(--bronze);
  box-shadow: var(--shadow-card);
}
.org-desk-card.working .org-avatar, .org-btn.working .org-avatar { animation: avatar-pulse 1.6s var(--ease-out) infinite; }
.org-desk-card.has-blocker, .org-btn.has-blocker { border-color: color-mix(in srgb, var(--danger) 40%, var(--track)); }
.org-avatar {
  width: 34px; height: 34px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--track); background: var(--panel); flex-shrink: 0;
}
/* 5. Top chrome — Chat | Tools as one mode switch; bar balanced at 1280px. */
.bar { min-height: 56px; }
.stages { padding: 3px; }
.stage-btn { min-height: 36px; font-size: 13px; }
.stage-btn.on { background: var(--bronze-soft); color: var(--bronze); }
.engines-chip {
  font-size: 11.5px; border: 1px solid var(--track); border-radius: 999px;
  padding: 6px 12px; color: var(--muted); background: transparent; cursor: pointer;
  max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.engines-chip:hover { color: var(--bronze); border-color: color-mix(in srgb, var(--bronze) 45%, transparent); }
@media (min-width: 1280px) {
  .bar { padding: 10px 24px; }
  .chat-shell.work-open, .chat-shell.activity-open { column-gap: 22px !important; }
}
/* 6. Settings — Board / This CEO / More rhythm; panel bodies breathe; Advanced muted. */
#settings .drawer-nav-compact .settings-nav-label { margin: 14px 0 4px; }
#settings .drawer-panel.on#panel-you,
#settings .drawer-panel.on#panel-keys,
#settings .drawer-panel.on#panel-models { gap: 10px; max-width: 62ch; }
#settings .drawer-panel.on#panel-you .field,
#settings .drawer-panel.on#panel-keys .field,
#settings .drawer-panel.on#panel-models .field { display: grid; gap: 6px; }
#settings [data-settings-adv], #settings .settings-advanced { opacity: 0.75; }
#settings.settings-advanced-open [data-settings-adv], #settings.settings-advanced-open .settings-advanced { opacity: 1; }
/* 7. Motion — subtle entrances on existing tokens; reduced-motion already handled above. */
.stream > .ceo-switch-divider,
.stream > .today-brief {
  animation: otto-stream-in var(--dur-med) var(--ease-out);
}
@media (prefers-reduced-motion: reduce) {
  .stream > .ceo-switch-divider,
  .stream > .today-brief { animation: none; }
}
@keyframes otto-stream-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}
@media (max-width: 480px) {
  #activityTitle { font-size: 14px; }
  .activity-body { padding: 6px 12px calc(16px + env(safe-area-inset-bottom, 0px)); }
  .engines-chip { max-width: 140px; }
  .stage-btn { padding: 8px 12px; min-height: 44px; }
}

/* Phase 14 — queue-driven polish: zero-jump desk, one-product settings, single-chrome job cards (Muse, CSS only) */
/* 1. Zero layout jump at 1280: lock the Phase 13 grid — one gap, fixed sheet column,
      stable gutters, reserved heights. Later source order wins over §§6463/6675; no new system. */
@media (min-width: 1024px) {
  .chat-shell.work-open,
  .chat-shell.activity-open {
    grid-template-columns: minmax(0, 42rem) minmax(0, 22rem) !important;
    column-gap: 22px !important;
  }
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) {
    width: 100%;
    min-height: 420px;
    max-height: calc(100vh - 220px);
    scrollbar-gutter: stable;
    overscroll-behavior: contain;
  }
  /* Tab switches (Running/Due/Results/Schedule/Goals) never resize the frame. */
  .activity-bar { min-height: 52px; flex: 0 0 auto; }
  .activity-body { min-height: 320px; scrollbar-gutter: stable; }
  .activity-body > * { min-width: 0; overflow-wrap: anywhere; }
  /* CEO switches re-render the stream but never the columns. */
  .chat-shell .stream { scrollbar-gutter: stable; contain: layout style; }
  .chat-shell.work-open .stream,
  .chat-shell.activity-open .stream { min-height: 40vh; }
  /* Ribbon count changes never shove the composer. */
  .chat-dock .work-ribbon { min-height: 48px; align-content: center; }
  .chat-dock .work-ribbon .ribbon-seg { min-height: 40px; flex: 0 0 auto; }
}
@media (min-width: 1280px) {
  .chat-shell,
  .chat-shell:not(.work-open):not(.activity-open),
  .chat-shell.work-open,
  .chat-shell.activity-open { column-gap: 22px !important; }
}
/* 2. Settings reads as one product: Board / This CEO / More share one rhythm;
      panels breathe; Advanced stays muted until opened. */
#settings .drawer-nav-compact .settings-nav-label {
  margin: 16px 0 6px;
  padding: 10px 10px 0;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
}
#settings .drawer-nav-compact .settings-nav-label:first-child { border-top: 0; margin-top: 2px; }
#settings .drawer-body { display: grid; gap: 14px; align-content: start; }
#settings .drawer-panel.on#panel-you,
#settings .drawer-panel.on#panel-keys,
#settings .drawer-panel.on#panel-models { gap: 12px; }
#settings .drawer-panel { display: none; gap: 12px; align-content: start; max-width: 62ch; }
#settings .drawer-panel.on { display: grid; }
/* 3. Job cards in stream: one §4.3 work row — title + single meta + single outcome +
      engine pill + Watch. Kills the double-chrome (tinted header + bordered card). */
.card.msg-job { background: var(--panel); }
.card.msg-job .job-stream-chrome {
  background: transparent;
  border-bottom: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  padding: 10px 14px 8px;
}
.card.msg-job .job-stream-head { display: flex; align-items: center; gap: 8px; min-width: 0; }
.card.msg-job .job-stream-head b { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.card.msg-job .job-stream-meta,
.card.msg-job .gate-line {
  font-size: 12px; line-height: 1.5; color: var(--muted);
  max-width: 62ch; overflow-wrap: anywhere;
}
.card.msg-job .job-stream-step,
.card.msg-job .bubble-text,
.card.msg-job > pre { font-size: 13.5px; line-height: 1.6; max-width: 62ch; }
.card.msg-job .diff-wrap .meta { display: none; }
.card.msg-job .job-actions,
.card.msg-job .diff-actions { border-top: 0; padding-top: 0; }
@media (prefers-reduced-motion: reduce) {
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) { animation: none; }
}
@media (max-width: 480px) {
  #settings .drawer-card { padding: 14px 14px calc(18px + env(safe-area-inset-bottom, 0px)); }
  #settings .drawer-body { gap: 12px; }
  #settings .drawer-panel { gap: 10px; }
  #settings .drawer-nav-compact { gap: 2px; }
  #settings .drawer-nav-compact .drawer-tab { min-height: 44px; padding: 10px 12px; }
  #settings input, #settings select, #settings textarea { min-height: 44px; font-size: 16px; }
  #settings .settings-nav-label { margin: 12px 0 4px; }
}

/* Bus sheet — internal handoffs (files, not DM) */
.bus-trust { max-width: 62ch; line-height: 1.55; }
.bus-threads code, .bus-path { font-size: 12px; word-break: break-all; }
.bus-proposal { display: grid; gap: 8px; margin-bottom: 12px; }
.bus-rhythm { max-width: 62ch; line-height: 1.55; margin: 0 0 12px; }
.bus-rhythm strong { font-weight: 600; color: var(--ink); }
.menu-note { max-width: 62ch; line-height: 1.5; color: var(--muted); font-size: 13px; }

/* Goals sheet — trust + horizons (Cursor hooks; Muse Phase 15 polishes) */
.goals-sheet {
  display: grid;
  gap: 14px;
  padding: 4px 0 8px;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.goals-head { display: grid; gap: 8px; }
.goals-head-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.goals-title {
  margin: 0;
  font-family: var(--display);
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0.01em;
}
.goals-badge {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--bronze) 45%, var(--track));
  color: var(--bronze);
  background: color-mix(in srgb, var(--bronze) 10%, transparent);
}
.goals-trust {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  max-width: 62ch;
  color: color-mix(in srgb, var(--ink) 88%, var(--muted));
}
.goals-trust strong { color: var(--ink); font-weight: 600; }
.goals-format,
.goals-count {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--muted);
  max-width: 62ch;
}
.goals-form { margin-top: 4px; }
.goals-horizon { display: grid; gap: 6px; }
.goals-horizon-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.goals-horizon-head label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--bronze);
}
.goals-horizon-empty {
  font-size: 11px;
  color: var(--muted);
}
.goals-horizon.is-empty textarea {
  border-style: dashed;
  opacity: 0.92;
}
.goals-actions { margin-top: 8px; }
.goals-save-status { margin: 6px 0 0; min-height: 1.25em; }
.activity-body .goals-sheet .horizon-row textarea {
  min-height: 4.25rem;
  font-size: 14px;
  line-height: 1.5;
}

/* Phase 15 — Goals sheet: transparent, readable, executive (Muse, CSS only) */
/* 1. Sheet frame — transparent card in .activity-body; serif title, calm badge, 62ch measure. */
.activity-body .goals-sheet {
  min-width: 0;
  gap: 12px;
  padding: 6px 0 10px;
}
.goals-head { gap: 10px; }
.goals-head-row { align-items: center; }
.goals-title {
  font-size: clamp(17px, 1.1rem + 0.4vw, 19px);
  line-height: 1.3;
}
.goals-badge { flex: 0 0 auto; white-space: nowrap; }
/* 2. Trust strip — parchment/bronze inset, same family as .today-brief / .today-decision.
      Answers "how are these lines generated or changed" before the form. */
.goals-trust {
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--bronze) 32%, var(--track));
  border-left: 2px solid var(--bronze);
  border-radius: 12px;
  background:
    var(--brief-tint, linear-gradient(180deg, color-mix(in srgb, var(--bronze) 9%, transparent), transparent 70%)),
    color-mix(in srgb, var(--panel) 96%, #000);
  font-size: 13.5px;
}
.goals-format { font-size: 12.5px; }
.goals-count {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px;
}
.goals-count::before {
  content: "";
  width: 6px; height: 6px; border-radius: 50%; flex: 0 0 auto;
  background: var(--bronze); opacity: 0.7;
}
/* 3. Horizon rows — label + textarea rhythm, hairline-separated; empty rows muted. */
.goals-form {
  display: grid; gap: 4px;
  min-width: 0; min-height: 0;
  margin-top: 2px;
}
.goals-horizon { gap: 6px; padding: 10px 0 6px; }
.goals-horizon + .goals-horizon {
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  padding-top: 12px;
}
.goals-horizon-head { align-items: center; }
.goals-horizon-head label {
  font-size: 11px;
  letter-spacing: 0.08em;
}
.goals-horizon-empty {
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.goals-horizon.is-empty .goals-horizon-head label { color: var(--muted); }
.activity-body .goals-sheet .horizon-row textarea {
  min-height: 4.5rem;
  max-height: 12rem;
  overflow-y: auto;
  resize: vertical;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink);
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.activity-body .goals-sheet .horizon-row textarea::placeholder {
  color: var(--muted);
  opacity: 0.75;
  font-size: 13px;
  line-height: 1.5;
}
.goals-horizon.is-empty textarea { background: transparent; }
/* 4. Actions — 44px Save / Ask CEO; status line never collapses the form. */
.goals-actions {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
}
.goals-actions .send,
.goals-actions .ghost-btn {
  min-height: 44px;
  padding: 10px 18px;
  font-size: 13px;
  border-radius: 999px;
}
.goals-save-status {
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--muted);
  max-width: 62ch;
}
/* 5. Scroll — form scrolls inside .activity-body; the Close bar stays flex-shrink: 0
      upstream so it can never be crushed. Stable gutter keeps the 22rem side desk still. */
.activity-body:has(.goals-sheet) { overscroll-behavior: contain; }
@media (min-width: 1024px) {
  .activity-body .goals-sheet { padding: 8px 2px 12px; }
}
@media (max-width: 480px) {
  .goals-trust { padding: 10px 11px; font-size: 13px; }
  .activity-body .goals-sheet .horizon-row textarea { font-size: 16px; }
  .goals-actions .send,
  .goals-actions .ghost-btn { flex: 1 1 100%; }
}

/* Phase 17 — Add CEO + Goals + Bus + Settings (world-class clarity) (Muse, CSS only) */
/* 1. Goals badge states — CSS-only via :has (Draft keeps default bronze/amber).
      All horizons empty = Empty (muted); all filled = On desk (mint); mixed = in progress. */
.goals-sheet:not(:has(.goals-horizon:not(.is-empty))) .goals-badge {
  color: var(--muted);
  border-color: color-mix(in srgb, var(--muted) 45%, var(--track));
  background: color-mix(in srgb, var(--muted) 10%, transparent);
}
.goals-sheet:not(:has(.goals-horizon.is-empty)) .goals-badge {
  color: var(--mint);
  border-color: color-mix(in srgb, var(--mint) 45%, var(--track));
  background: color-mix(in srgb, var(--mint) 10%, transparent);
}
.activity-body .goals-sheet .horizon-row textarea:focus-visible {
  outline: none;
  border-color: color-mix(in srgb, var(--bronze) 60%, transparent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--bronze) 22%, transparent);
}
.goals-horizon:not(.is-empty) .goals-horizon-head label { color: var(--ink); }
/* 2. Bus sheet — internal mailroom, not a second chat. Trust strip matches
      .goals-trust family; handoffs are scannable rows; path stays muted. */
.bus-trust {
  margin: 0 0 10px;
  padding: 10px 12px;
  font-size: 13px;
  max-width: 62ch;
  color: color-mix(in srgb, var(--ink) 88%, var(--muted));
  border: 1px solid color-mix(in srgb, var(--bronze) 32%, var(--track));
  border-left: 2px solid var(--bronze);
  border-radius: 12px;
  background:
    var(--brief-tint, linear-gradient(180deg, color-mix(in srgb, var(--bronze) 9%, transparent), transparent 70%)),
    color-mix(in srgb, var(--panel) 96%, #000);
}
.bus-rhythm { font-size: 13px; max-width: 62ch; }
.bus-rhythm strong { color: var(--ink); }
.bus-threads { font-size: 12px; max-width: 62ch; }
.bus-threads code { font-size: 11.5px; overflow-wrap: anywhere; }
.bus-proposal {
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--bronze) 32%, var(--track));
  border-left: 2px solid var(--bronze);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 96%, #000);
  max-width: 62ch;
}
.bus-proposal .cron-section { margin: 0 0 4px; }
.bus-proposal .cron-outcome { margin: 0; font-size: 13.5px; line-height: 1.55; max-width: 62ch; }
.bus-proposal .muted { margin: 4px 0 0; font-size: 12.5px; max-width: 62ch; }
.bus-handoff { max-width: 62ch; }
.bus-handoff > summary { min-height: 44px; }
.bus-handoff .cron-outcome { font-size: 13px; line-height: 1.55; max-width: 62ch; }
.bus-path { margin: 2px 0 0; opacity: 0.75; }
/* 3. Add CEO ceremony — one flow: Goal lead reads first, What-you-want + Add CEO
      carry the ceremony; auth stays a quiet fieldset below. */
.node-menu .menu-note {
  font-size: 13px;
  line-height: 1.55;
  max-width: 62ch;
  color: color-mix(in srgb, var(--ink) 85%, var(--muted));
}
.node-menu.ceo-add #menuCeoGoals { font-size: 13px; }
.node-menu .menu-field.menu-actions .send {
  min-height: 44px;
  width: 100%;
  border-radius: 999px;
  font-size: 13px;
}
.org-add-slot .org-add { min-height: 36px; }
/* 4. Settings rhythm — Board / This CEO / More scan at a glance; Advanced muted;
      single visible panel guard reaffirmed (no stacked panels). */
#settings .drawer-panel { display: none; }
#settings .drawer-panel.on { display: grid; }
#settings .drawer-body .lede { max-width: 62ch; }
.drawer-nav-compact .drawer-tab.on {
  background: var(--bronze-soft);
  color: var(--bronze);
}
.settings-nav-ceo.settings-nav-label { color: var(--bronze); opacity: 0.9; }
#settings .keys-extra summary { color: var(--muted); font-size: 12.5px; }
@media (max-width: 480px) {
  .bus-trust { padding: 10px 11px; font-size: 13px; }
  .bus-handoff > summary { padding: 10px 12px; }
  .node-menu .menu-field.menu-actions .send { flex: 1 1 100%; }
  .node-menu.ceo-add .menu-field input { font-size: 16px; min-height: 44px; }
  .org-add-slot .org-add { min-height: 44px; }
}

/* Phase 18 — Work ribbon glossary, Errors tab, engine pills, chat capability strip (Muse, CSS only) */
/* 1. Ribbon glossary — native `title` tooltips (from WORK_VIEWS) stay the glossary;
      hover reads calm bronze, keyboard focus gets a visible ring. */
.work-ribbon .ribbon-seg { cursor: pointer; }
.work-ribbon .ribbon-seg:hover { color: var(--bronze); }
.work-ribbon .ribbon-seg:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--bronze) 65%, transparent);
  outline-offset: 2px;
}
/* 2. Errors tab reads as recovery, not a shout — red-first order kept, wash calmed.
      Default is transparent with a quiet danger edge + steady dot; soft wash only when open. */
.work-ribbon .ribbon-seg.ribbon-fail {
  order: -1;
  font-weight: 500;
  border: 1px solid color-mix(in srgb, var(--danger) 38%, transparent);
  background: transparent;
  color: color-mix(in srgb, var(--ink) 82%, var(--muted));
}
.work-ribbon .ribbon-seg.ribbon-fail::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--danger);
  opacity: 0.85;
}
.work-ribbon .ribbon-seg.ribbon-fail .n {
  background: rgba(201, 137, 106, 0.14);
  color: #f0b39e;
  opacity: 1;
}
.work-ribbon .ribbon-seg.ribbon-fail.on {
  background: rgba(201, 137, 106, 0.12);
  color: #f0b39e;
  box-shadow: var(--shadow-inset);
}
/* 3. 44px targets locked at 390px (reaffirms Phase 4; Errors included). */
@media (max-width: 480px) {
  .work-ribbon .ribbon-seg,
  .work-ribbon .ribbon-seg.ribbon-fail { min-height: 44px; }
}
/* 4. Engine pills — Routing is muted plumbing; named engines get their tints.
      app.js renders pill text only today, so the base is calm muted (Routing default);
      wiring `data-engine` (or .engine-routing / .engine-opencode / .engine-hermes)
      in the three render sites lights up the named tints — Cursor one-liner. */
.engine-pill {
  color: var(--muted);
  border: 1px solid var(--track);
  background: transparent;
}
.engine-pill[data-engine="board"],
.engine-pill.engine-routing {
  border-style: dashed;
  color: var(--muted);
  background: transparent;
  opacity: 0.85;
}
.engine-pill[data-engine="opencode"],
.engine-pill.engine-opencode {
  color: var(--bronze);
  border: 1px solid color-mix(in srgb, var(--bronze) 40%, transparent);
  background: var(--bronze-soft);
  opacity: 1;
}
.engine-pill[data-engine="hermes"],
.engine-pill.engine-hermes {
  color: var(--mint);
  border: 1px solid color-mix(in srgb, var(--mint) 40%, transparent);
  background: color-mix(in srgb, var(--mint) 10%, transparent);
  opacity: 1;
}
.engine-pill[data-engine="timer"] {
  color: var(--muted);
  border: 1px solid var(--track);
  background: color-mix(in srgb, var(--ink) 4%, transparent);
  opacity: 0.92;
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 0.06em;
}
/* 5. Chat capability whisper — sits under #chatFolder, 62ch, never competes
      with the composer; clamps on phone, hides when very small. */
.chat-capability {
  margin: 2px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--muted);
  opacity: 0.85;
  max-width: 62ch;
  overflow-wrap: anywhere;
}
@media (max-width: 480px) {
  .chat-capability {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}
@media (max-width: 360px) {
  .chat-capability { display: none; }
}
/* 6. Activity sheet titles — Errors / Bus / Goals share the one serif
      #activityTitle family; no per-view chrome, Close bar untouched. */
#activityTitle {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 62ch;
}

/* Phase 19 — Tools watch: live iframe or honest empty/error (Muse, CSS only) */
/* 1. .tools-watch seated — live engine fills the pane; chrome stays calm.
      Kicker "You're watching …" + Open in tab never compete with the session. */
.tools-watch.on {
  background: var(--bg);
}
.tools-watch {
  border-radius: var(--radius-deep);
  overflow: hidden;
  box-shadow: var(--shadow-card), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  border: 1px solid var(--track);
  background: var(--bg);
}
.tools-watch .embed-head {
  border-bottom: 1px solid var(--track);
  border-radius: var(--radius-deep) var(--radius-deep) 0 0;
  background: color-mix(in srgb, var(--panel) 92%, #000);
}
.tools-watch .embed {
  flex: 1 1 auto;
  min-height: min(58vh, 560px);
  width: auto;
  border-radius: 0 0 var(--radius-deep) var(--radius-deep);
  background: #0b0a09;
}
/* Hidden iframe must never leave a black hole under the wall. */
.tools-watch .embed[hidden] { display: none !important; }
.tools-watch .embed-head-row { align-items: flex-start; }
.tools-watch .tools-scope {
  color: var(--muted);
  opacity: 0.9;
  max-width: 62ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tools-watch .embed-open {
  border: 1px solid color-mix(in srgb, var(--bronze) 38%, var(--track));
  background: transparent;
  color: var(--ink);
  border-radius: 999px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  line-height: 1.2;
  white-space: nowrap;
}
.tools-watch .embed-open:hover { color: var(--bronze); }
.tools-watch .embed-open:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--bronze) 65%, transparent);
  outline-offset: 2px;
}
/* 2. .embed-aim.wall — honest empty/error, recovery not a shout.
      Quiet danger edge, ink-82 copy at 62ch, Open in tab stays the escape. */
.embed-aim.wall {
  color: color-mix(in srgb, var(--ink) 82%, var(--muted));
  border: 1px solid color-mix(in srgb, var(--danger) 38%, transparent);
  background: color-mix(in srgb, var(--panel) 96%, #000);
  max-width: 62ch;
  font-size: 13px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.embed-aim.wall strong { color: var(--ink); font-weight: 600; }
.embed-aim.wall a { color: var(--bronze); }
.embed-aim.wall:empty::after { content: none; }
/* 3. .embed-aim:empty — starting/idle whisper; never competes with the wall. */
.embed-aim:empty {
  border: 0;
  background: transparent;
  padding: 0;
  max-width: 62ch;
}
.embed-aim:empty::after {
  opacity: 0.8;
  max-width: 62ch;
  display: block;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
  line-height: 1.5;
}
/* 4. .bus-triggers / .bus-rhythm — weekday Think + Run Think now read as
      live (strong = ink); parked webhook line stays muted, not a teaser. */
.bus-triggers.bus-rhythm {
  font-size: 13px;
  line-height: 1.55;
  color: var(--muted);
  max-width: 62ch;
  overflow-wrap: anywhere;
  padding: 8px 12px;
  border-left: 2px solid color-mix(in srgb, var(--bronze) 55%, transparent);
  border-radius: 0 10px 10px 0;
  background: color-mix(in srgb, var(--bronze) 6%, transparent);
}
.bus-triggers.bus-rhythm strong { color: var(--ink); font-weight: 600; }
/* 5. 390px — Open in tab is a 44px target; head wraps, iframe keeps height. */
@media (max-width: 480px) {
  .tools-watch .embed-open {
    min-height: 44px;
    min-width: 44px;
    padding: 10px 16px;
    font-size: 13px;
  }
  .tools-watch .embed-head-row { flex-wrap: wrap; }
  .tools-watch .embed { min-height: 52vh; }
}

/* P3b — Dark matte theme bridge for Tools embed chrome */
.tools-watch .embed-head {
  background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 96%, #000) 0%, color-mix(in srgb, var(--bg) 98%, #000) 100%);
  border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent);
  box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--bronze) 8%, transparent);
}
.tools-watch .embed {
  background: #080706;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.35), inset 0 -1px 0 rgba(255, 255, 255, 0.02);
}
.tools-watch .tool-tabs {
  background: color-mix(in srgb, var(--bg) 92%, #000);
  border-color: color-mix(in srgb, var(--line) 50%, transparent);
}
.tools-watch .embed-kicker.tools-scope {
  color: color-mix(in srgb, var(--bronze) 85%, var(--muted));
}
.tools-watch .embed-hint {
  color: color-mix(in srgb, var(--muted) 85%, var(--bg));
}
.tools-watch .embed-open {
  border-color: color-mix(in srgb, var(--bronze) 30%, var(--track));
  background: color-mix(in srgb, var(--bg) 88%, transparent);
}

/* Phase 20 — Teamwork sheet (bus work view; bot-to-bot handoffs, not chat) */
.teamwork-head.handoffs-head,
.handoffs-head {
  margin: 0 0 16px;
  padding: 0 0 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
}
.handoffs-title {
  margin: 0 0 8px;
  font-family: var(--serif, Georgia, serif);
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.02em;
}
.handoffs-lead {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--muted);
  max-width: 62ch;
  overflow-wrap: anywhere;
}
.handoffs-lead strong { color: var(--ink); font-weight: 600; }
.handoffs-lead code {
  font-size: 12px;
  padding: 1px 6px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--ink) 6%, transparent);
}
.handoffs-empty {
  margin-top: 8px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--ink) 14%, transparent);
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  max-width: 62ch;
}
.handoffs-empty .cron-empty {
  margin: 0 0 8px;
  font-weight: 600;
  color: var(--ink);
}
.handoffs-empty .muted { margin: 0; font-size: 13px; line-height: 1.55; }
.bus-path-hint {
  margin: -4px 0 10px;
  font-size: 12px;
  opacity: 0.85;
}
@media (max-width: 480px) {
  .handoffs-title { font-size: 1.2rem; }
}

/* Phase 21 — Teamwork conversation (bot passes, not mailroom details) */
.teamwork-thread {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 62ch;
  margin: 0 0 18px;
}
.teamwork-history-kicker {
  margin: 16px 0 8px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}
.teamwork-pass {
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
  background: color-mix(in srgb, var(--panel) 94%, transparent);
}
.teamwork-pass.is-open {
  border-left: 2px solid color-mix(in srgb, var(--bronze) 70%, transparent);
}
.teamwork-pass.is-done {
  opacity: 0.88;
}
.teamwork-pass-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 28px;
}
.teamwork-pass-who {
  margin: 0;
  font-size: 14px;
  color: var(--ink);
}
.teamwork-arrow {
  margin: 0 8px;
  color: var(--muted);
  font-weight: 400;
}
.teamwork-pass-state {
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}
.teamwork-pass-task,
.teamwork-pass-said {
  margin: 8px 0 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.teamwork-pass-said { color: var(--muted); }
.teamwork-pass-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--muted);
}
/* Phase 21b — spoken-pass polish (Muse): open runs hotter, done goes quiet,
   said reads as a quote, history stays flat, engine pill never shouts. */
.teamwork-pass-task {
  max-width: 62ch;
  font-weight: 550;
}
.teamwork-pass-said {
  max-width: 62ch;
  padding-left: 10px;
  border-left: 2px solid color-mix(in srgb, var(--ink) 14%, transparent);
  font-style: normal;
}
.teamwork-pass.is-open {
  background: color-mix(in srgb, var(--bronze) 7%, var(--panel) 93%);
  border-left-width: 3px;
}
.teamwork-pass.is-open .teamwork-pass-state {
  color: var(--bronze);
  border: 1px solid color-mix(in srgb, var(--bronze) 45%, transparent);
  background: var(--bronze-soft);
  border-radius: 999px;
  padding: 2px 10px;
  font-weight: 600;
}
.teamwork-pass.is-done {
  opacity: 0.8;
  background: transparent;
  border-color: color-mix(in srgb, var(--ink) 7%, transparent);
}
.teamwork-pass.is-done .teamwork-pass-state {
  border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
  border-radius: 999px;
  padding: 2px 10px;
}
.teamwork-pass-meta .engine-pill {
  font-size: 11px;
  padding: 1px 8px;
  opacity: 0.9;
}
.teamwork-thread.teamwork-history .teamwork-pass {
  border-color: color-mix(in srgb, var(--ink) 7%, transparent);
  background: transparent;
  box-shadow: none;
}
.teamwork-history-kicker {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 62ch;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0.01em;
}
.teamwork-history-kicker::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: color-mix(in srgb, var(--ink) 9%, transparent);
}
.teamwork-empty.handoffs-empty {
  border-style: dashed;
  background: transparent;
  box-shadow: none;
}
.teamwork-empty .cron-empty { font-weight: 550; }
.teamwork-empty .muted { max-width: 62ch; }
.teamwork-empty .muted strong { color: var(--ink); font-weight: 600; }
@media (max-width: 480px) {
  .teamwork-pass-head { min-height: 44px; }
  .teamwork-pass-state {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
  .teamwork-pass-who { line-height: 1.4; }
}

/* Phase 22–24 — Goals function kits + Schedule kit groups (Cursor operator; Muse polish) */
.goals-kits {
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
  background: color-mix(in srgb, var(--wash) 55%, transparent);
  max-width: 62ch;
}
.goals-kits-title {
  margin: 0 0 6px;
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.goals-kits-lead {
  margin: 0 0 10px;
  font-size: 0.88rem;
  opacity: 0.82;
  line-height: 1.45;
}
.goals-kits-lanes {
  margin: 0 0 10px;
  font-size: 0.86rem;
  line-height: 1.4;
}
.goals-kits-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.goals-kit-chip {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  min-height: 44px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--bronze) 28%, transparent);
  background: color-mix(in srgb, var(--bronze) 6%, var(--paper));
}
.goals-kit-chip.is-off {
  opacity: 0.55;
  border-style: dashed;
}
.goals-kit-name {
  font-weight: 600;
  font-size: 0.88rem;
}
.goals-kit-blurb {
  font-size: 0.78rem;
  opacity: 0.78;
  max-width: 18ch;
}
.goals-draft-actions {
  margin-top: 12px;
}
.schedule-kit-group {
  margin-bottom: 12px;
}
.schedule-kit-head {
  margin: 10px 0 6px;
  font-size: 0.9rem;
  font-weight: 600;
  opacity: 0.88;
}
@media (max-width: 480px) {
  .goals-kit-chip { min-width: 44%; flex: 1 1 auto; }
}

/* Phase 24 — Goals ceremony + Schedule kit groups (final polish) */
.goals-kits {
  background: color-mix(in srgb, var(--bronze) 6%, var(--panel));
}
.goals-kits-title {
  font-family: var(--display);
  font-weight: 600;
  color: var(--ink);
}
.goals-kits-lead,
.goals-kits-lanes {
  max-width: 62ch;
  overflow-wrap: anywhere;
}
.goals-kits-lead {
  color: color-mix(in srgb, var(--ink) 82%, var(--muted));
}
.goals-kits-lanes {
  color: var(--muted);
}
.goals-kits-lanes .cron-k {
  color: var(--bronze);
  opacity: 0.9;
}
/* Bronze only on active kits — off kits go quiet ink, no bronze wash. */
.goals-kit-chip {
  border: 1px solid color-mix(in srgb, var(--bronze) 28%, transparent);
  background: var(--bronze-soft);
}
.goals-kit-chip .goals-kit-name {
  color: var(--ink);
}
.goals-kit-chip .goals-kit-blurb {
  color: color-mix(in srgb, var(--ink) 72%, var(--muted));
  max-width: 26ch;
  line-height: 1.4;
}
.goals-kit-chip.is-off {
  border: 1px dashed color-mix(in srgb, var(--ink) 16%, transparent);
  background: transparent;
}
.goals-kit-chip.is-off .goals-kit-name,
.goals-kit-chip.is-off .goals-kit-blurb {
  color: var(--muted);
}
/* Draft actions breathe below the kits strip; primary reads as Needs-you. */
.goals-draft-actions {
  margin: 14px 0 4px;
  padding-top: 12px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
}
.goals-draft-actions .send {
  background: var(--bronze-soft);
  border: 1px solid color-mix(in srgb, var(--bronze) 45%, transparent);
  color: var(--bronze);
  font-weight: 600;
}
.goals-draft-actions .ghost-btn { opacity: 0.85; }
/* Schedule kit heads are whisper labels, not a second ribbon. */
.schedule-kit-group {
  margin: 14px 0 4px;
}
.schedule-kit-group:first-child {
  margin-top: 4px;
}
.schedule-kit-head.cron-section {
  margin: 0 0 6px;
  padding-top: 0;
  border-top: 0;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  opacity: 0.8;
}
@media (max-width: 480px) {
  .goals-draft-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .goals-draft-actions .send,
  .goals-draft-actions .ghost-btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
  .schedule-kit-head.cron-section {
    min-height: 0;
  }
}

/* Phase 25 — Kit work sheet (Goals drill-down) */
.goals-kit-open {
  appearance: none;
  font: inherit;
  text-align: left;
  cursor: pointer;
  min-height: 44px;
  color: var(--ink);
}
.goals-kit-open:focus-visible {
  outline: 2px solid var(--bronze);
  outline-offset: 2px;
}
.goals-kit-chip.goals-kit-open.is-on {
  border: 1px solid color-mix(in srgb, var(--bronze) 55%, transparent);
  background: var(--bronze-soft);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--bronze) 45%, transparent);
}
.goals-kit-chip.goals-kit-open.is-on .goals-kit-name {
  color: var(--bronze);
}
.kit-sheet-host {
  margin-top: 12px;
}
.kit-sheet-host[hidden] {
  display: none;
}
.kit-sheet {
  margin: 0;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
  background: var(--panel);
  max-width: 62ch;
}
.kit-sheet-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
  margin-bottom: 6px;
}
.kit-sheet-title {
  margin: 0;
  font-family: var(--display);
  font-weight: 600;
  font-size: 1rem;
  color: var(--ink);
}
.kit-sheet-blurb {
  margin: 0;
  flex: 1 1 100%;
  font-size: 0.88rem;
  line-height: 1.45;
  color: color-mix(in srgb, var(--ink) 82%, var(--muted));
  max-width: 62ch;
  overflow-wrap: anywhere;
}
.kit-sheet-count {
  margin: 0;
  font-size: 0.8rem;
}
.kit-sheet-close {
  margin-left: auto;
  min-height: 44px;
  opacity: 0.85;
}
.kit-sheet-block {
  margin: 12px 0 0;
  padding-top: 10px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
}
.kit-sheet-block:first-of-type {
  margin-top: 8px;
}
.kit-sheet-kicker {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  opacity: 0.8;
}
.kit-sheet-row {
  margin: 0;
  padding: 8px 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 6%, transparent);
  max-width: 62ch;
}
.kit-sheet-row:first-of-type {
  border-top: 0;
  padding-top: 2px;
}
.kit-sheet-row b {
  font-weight: 600;
  font-size: 0.88rem;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.kit-sheet-row span {
  font-size: 0.8rem;
  line-height: 1.4;
  color: var(--muted);
  overflow-wrap: anywhere;
}
@media (max-width: 480px) {
  .goals-kit-open {
    min-height: 44px;
  }
  .kit-sheet-close {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}

/* Phase 26 — Work sheet truth (Cursor operator hooks; Muse polish) */
.activity-title-main {
  display: block;
  font-weight: 650;
}
.activity-title-sub {
  display: block;
  font-size: 0.82rem;
  font-weight: 450;
  color: var(--muted);
  max-width: 62ch;
}
.work-sheet-lead {
  margin: 0 0 10px;
  max-width: 62ch;
  font-size: 0.9rem;
  line-height: 1.45;
  color: color-mix(in srgb, var(--ink) 82%, var(--muted));
}
.work-desk-context {
  margin: 0 0 14px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
  background: var(--panel);
  max-width: 62ch;
}
.work-desk-row {
  margin: 0 0 6px;
  font-size: 0.88rem;
  line-height: 1.4;
}
.work-desk-row:last-child { margin-bottom: 0; }
.work-desk-k {
  color: var(--bronze);
  font-weight: 600;
  margin-right: 8px;
}
.work-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
}
.work-section-sub {
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--muted);
  opacity: 0.9;
}

/* Phase 26 — Work tabs tell the truth (Muse polish, CSS only) */
/* 1. Sheet header reads as human title + one-line purpose, not a ribbon. */
#activityTitle .activity-title-main {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--ink);
  white-space: normal;
}
#activityTitle .activity-title-sub {
  font-family: inherit;
  font-size: 0.8rem;
  font-weight: 450;
  letter-spacing: 0;
  text-transform: none;
  color: var(--muted);
  opacity: 0.92;
  white-space: normal;
  max-width: 62ch;
}
#activityTitle:has(.activity-title-main) {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.35;
}
/* 2. Glossary lead stays a whisper under the header. */
.work-sheet-lead {
  font-size: 0.84rem;
  color: var(--muted);
  opacity: 0.92;
}
/* 3. Desk context is the brain on the desk — CEO report, not log dump. */
.work-desk-context {
  background:
    linear-gradient(var(--bronze-soft), var(--bronze-soft)),
    var(--panel);
  border-left: 3px solid color-mix(in srgb, var(--bronze) 55%, transparent);
}
.work-desk-row {
  max-width: 62ch;
  overflow-wrap: anywhere;
}
.work-desk-k {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 700;
  min-width: 7.5em;
  display: inline-block;
}
.work-desk-row[data-desk="stuck"] {
  color: var(--ink);
}
/* 4. Section heads carry the count; subs whisper the split. */
.work-section-head {
  font-size: 0.95rem;
  font-weight: 650;
  color: var(--ink);
  max-width: 62ch;
}
/* 5. Kit sheet stays a nested sheet; selected chip gets bronze ring only. */
.kit-sheet {
  border-left: 3px solid color-mix(in srgb, var(--bronze) 45%, transparent);
}
.goals-kit-chip.goals-kit-open.is-on {
  border-color: color-mix(in srgb, var(--bronze) 60%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--bronze) 45%, transparent);
}
.kit-sheet:empty,
.kit-sheet-host:empty {
  display: none;
}
/* 6. Teamwork head + lead stack quiet; empty stays a calm desk. */
.teamwork-head + .work-sheet-lead {
  margin-top: -4px;
}
@media (max-width: 480px) {
  #activityTitle .activity-title-main { font-size: 0.98rem; }
  .work-desk-k { min-width: 0; }
  .goals-kit-open,
  .kit-sheet-close { min-height: 44px; }
}

/* Phase 27 — Ship glance + kit rollup + proposed timers (Muse polish, CSS only) */
/* 1. Engine-health Ship row whispers. Order in paintEngineHealthCard is
   Hermes · OpenCode · Ship · Wire · Steward, so Ship is the 3rd row. Red comes
   only from .wire-bad, which JS already gates (needed && !present) — a missing
   optional asc never shouts, and never reads as "Need ASC". */
#enginesHealth .kv > div:nth-child(3) > dt,
#ceoEngineHealth .kv > div:nth-child(3) > dt {
  font-weight: 500;
  opacity: 0.8;
}
#enginesHealth .kv > div:nth-child(3) > dd,
#ceoEngineHealth .kv > div:nth-child(3) > dd {
  font-size: 12px;
  color: var(--muted);
}
#enginesHealth .kv > div:nth-child(3) > dd.wire-bad,
#ceoEngineHealth .kv > div:nth-child(3) > dd.wire-bad {
  color: var(--danger, #c66);
  background: transparent; /* quiet recovery note, never a banner */
}
/* 2. Kit-sheet Ship note: one muted line under the head (prepare, never
   submit). No border, no wash, no warning banner. */
.kit-sheet-ship {
  margin: 2px 0 0;
  font-size: 0.8rem;
  line-height: 1.45;
  color: var(--muted);
  opacity: 0.9;
  max-width: 62ch;
  overflow-wrap: anywhere;
  border: 0;
  background: transparent;
}
/* 3. Proposed timers read parked/off, never broken. Same row rhythm as live
   routines — only tone shifts (dashed tick, softened title, no danger color).
   The positional rule covers the full roster (Scheduled · Routines · Proposed ·
   Skills · Teamwork, where Proposed is exactly the middle of five sections);
   .is-parked covers the short roster — Cursor one-liner can set it on the block
   whose kicker reads "Proposed timers". */
.kit-sheet > section.kit-sheet-block:nth-of-type(3):nth-last-of-type(3) .kit-sheet-row,
.kit-sheet-block.is-parked .kit-sheet-row,
.kit-sheet-row.is-parked {
  border-left: 2px dashed color-mix(in srgb, var(--muted) 45%, transparent);
  padding-left: 8px;
}
.kit-sheet > section.kit-sheet-block:nth-of-type(3):nth-last-of-type(3) .kit-sheet-row b,
.kit-sheet-block.is-parked .kit-sheet-row b,
.kit-sheet-row.is-parked b {
  font-weight: 500;
  color: color-mix(in srgb, var(--ink) 78%, var(--muted));
}
/* 4. Hot kit / Work areas share the Phase 26 bronze kicker — no new panel.
   Values wrap at the same 62ch measure as the rest of the desk report. */
.work-desk-v {
  overflow-wrap: anywhere;
  max-width: 62ch;
}
/* 5. Teamwork head is title + scope lead only; the desk report sits below it.
   No second large title, no double-lead shout. */
.teamwork-head + .work-desk-context {
  margin-top: 2px;
}

/* Phase 28–32 — Five-pass world-class sweep (work ribbon → schedule → goals/kits → settings/tools → chat) */
/* 28 — Work ribbon: calmer active tab, 44px taps, title stack breathes */
.work-tabs button {
  min-height: 44px;
  scroll-margin-top: 12px;
}
.work-tabs button[aria-selected="true"] {
  font-weight: 600;
  letter-spacing: 0.01em;
}
#activityTitle .activity-title-main {
  line-height: 1.25;
  max-width: 62ch;
}
.work-desk-context {
  padding-block: 6px 10px;
}
/* 29 — Schedule kit groups: scannable kit headers without shouting */
.schedule-kit-group {
  margin-top: 14px;
  padding-top: 2px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
}
.schedule-kit-group:first-child {
  border-top: none;
  margin-top: 0;
}
.schedule-kit-head.cron-section {
  font-size: 0.82rem;
  text-transform: none;
  letter-spacing: 0.02em;
  color: color-mix(in srgb, var(--ink) 72%, transparent);
  margin-bottom: 6px;
}
/* 30 — Goals + kit sheet: executive focus, close bar never crushed */
.goals-sheet,
.kit-sheet-host .kit-sheet {
  scroll-padding-bottom: 72px;
}
.kit-sheet-head h3 {
  line-height: 1.2;
  max-width: 28ch;
}
.goals-horizon textarea {
  line-height: 1.45;
}
/* 31 — Settings drawer + Tools: one panel rhythm, watch wall calm */
#settings .drawer-panel:not(.on) {
  display: none;
}
#toolsWatch .tools-watch-wall p {
  max-width: 62ch;
  line-height: 1.45;
}
/* 32 — Chat stream: capability strip + job cards readable at glance */
.chat-capability {
  font-size: 0.78rem;
  line-height: 1.45;
  max-width: 62ch;
  opacity: 0.88;
}
.card.msg-job .card-meta,
.bubble .msg-meta {
  font-size: 0.72rem;
  opacity: 0.85;
}
.teamwork-head + .work-sheet-lead {
  margin-top: 0;
  margin-bottom: 2px;
}

/* Phase 33 — Results rows: outcome visible without expand (mobile + a11y) */
.work-result {
  padding: 10px 12px 12px;
  border-bottom: 1px solid var(--line);
}
.work-result:last-child { border-bottom: 0; }
.work-result-head {
  grid-template-columns: minmax(0, 1fr) auto;
  row-gap: 6px;
}
.work-result-head .work-row-state {
  grid-column: 2;
  grid-row: 1;
}
.work-result-head .engine-pill {
  grid-column: 1 / -1;
  justify-self: start;
}
.work-result-meta {
  margin: 2px 0 4px;
  font-size: 0.78rem;
  line-height: 1.35;
}
.work-result-outcome {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.48;
  max-width: 62ch;
  overflow-wrap: anywhere;
  color: color-mix(in srgb, var(--ink) 90%, var(--muted));
}
.work-board-scope {
  border-style: dashed;
  opacity: 0.96;
}
@media (max-width: 480px) {
  .work-result { padding: 12px 10px 14px; }
  .work-result-head b {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    font-size: 0.95rem;
    line-height: 1.3;
  }
  .work-result-outcome { font-size: 0.92rem; }
  .work-sheet-lead { font-size: 0.86rem; line-height: 1.5; }
}

/* Phase 34 — Operator confidence + desktop layout (Muse polish, CSS only) */
/* 1. Fleet glance: lamp + stacked name/sub so badges never collide at 390px. */
.today-org-glance { gap: 8px; }
.today-org-row {
  display: grid;
  grid-template-columns: 7px minmax(0, 1fr);
  column-gap: 8px;
  row-gap: 1px;
  align-items: start;
}
.today-org-lamp {
  grid-column: 1;
  grid-row: 1 / span 2;
  margin-top: 5px;
}
.today-org-row b {
  grid-column: 2;
  min-width: 0;
  overflow-wrap: anywhere;
  line-height: 1.35;
}
.today-org-badges {
  margin-left: 6px;
  white-space: nowrap;
}
.today-org-row > span:last-child {
  grid-column: 2;
  min-width: 0;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
  line-height: 1.4;
}
/* 2. Trust strip: calm bronze panel, two lines readable on mobile, never a shout. */
.today-trust-strip {
  overflow-wrap: anywhere;
  max-width: 62ch;
}
.today-trust-strip strong { font-weight: 600; }
/* 3. Rail desk-card work counts: legible at a glance, never taller rows. */
.org-desk-card .ceo-work-badges {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 6px;
  vertical-align: 1px;
  white-space: nowrap;
  flex-shrink: 0;
}
.ceo-work-badge {
  font-size: 10px;
  min-width: 18px;
  padding: 1px 5px;
  line-height: 1.3;
}
/* 4. Inbox overflow: one muted-bronze line under Needs-you. */
.org-inbox.adam .org-inbox-more {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
  opacity: 0.9;
}
@media (max-width: 480px) {
  .today-org-glance { gap: 10px; }
  .today-org-row { font-size: 13px; }
  .today-org-row > span:last-child { -webkit-line-clamp: 2; }
  .today-trust-strip {
    font-size: 12px;
    line-height: 1.5;
    padding: 10px 12px;
  }
  .today-org-badge { padding: 2px 6px; }
}
/* 5. Desktop 1280px: chat fills beside the rail — no dead black band. */
@media (min-width: 1280px) {
  .chat-shell:not(.work-open):not(.activity-open) {
    width: min(100% - 40px, 64rem);
  }
  .chat-shell:not(.work-open):not(.activity-open) .chat-head,
  .chat-shell:not(.work-open):not(.activity-open) .stream,
  .chat-shell:not(.work-open):not(.activity-open) .chat-dock {
    width: min(52rem, 100%);
  }
}

/* Phase 35 — Quiet engines + fleet "what's going on" (Muse polish, CSS only) */
/* 1. Fleet block reads as a live status board, not a bullet list. */
.today-fleet {
  margin-top: 12px;
  padding: 10px 12px 12px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
  background: color-mix(in srgb, var(--panel) 94%, transparent);
  max-width: 62ch;
}
.today-fleet-kicker {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  font-size: 11px;
  letter-spacing: 0.08em;
}
.today-fleet-kicker::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: color-mix(in srgb, var(--bronze) 28%, transparent);
  opacity: 0.6;
}
.today-org-glance { gap: 2px; }
.today-org-row {
  padding: 7px 8px;
  margin: 0 -8px;
  border-radius: 9px;
  row-gap: 2px;
}
.today-org-row + .today-org-row {
  border-top: 1px solid color-mix(in srgb, var(--ink) 6%, transparent);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.today-org-row:first-child { padding-top: 4px; }
.today-org-lamp.live { box-shadow: 0 0 0 3px color-mix(in srgb, var(--sage, #8fbfb2) 22%, transparent); }
.today-org-lamp.stuck { box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.18); }
.today-org-lamp.fail { box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger, #c66) 20%, transparent); }
.today-org-lamp.gw-up { box-shadow: 0 0 0 3px color-mix(in srgb, var(--sage, #8fbfb2) 22%, transparent); }
.today-org-lamp.gw-down { box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger, #c66) 20%, transparent); }
.today-org-lamp.gw-host { box-shadow: 0 0 0 3px color-mix(in srgb, var(--bronze) 16%, transparent); }
.today-org-row b {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 2px 0;
  font-family: var(--display);
  font-size: 13.5px;
  line-height: 1.35;
}
.today-ceo-link {
  margin: -6px 0;
  padding: 6px 2px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  font-weight: 600;
  color: var(--ink);
  border-radius: 6px;
  text-decoration: none;
  text-underline-offset: 3px;
}
.today-ceo-link:hover {
  color: var(--bronze);
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--bronze) 60%, transparent);
}
.today-ceo-link:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--bronze) 65%, transparent);
  outline-offset: 2px;
}
.today-org-row > span:last-child {
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.45;
}
/* 2. Header bar without the engines chip: no awkward hole, pulse + spend align. */
#enginesChip[hidden] { display: none !important; }
.bar-right:has(#enginesChip[hidden]) { gap: 8px; }
.bar-right .pulse,
.bar-right .meter { align-self: center; flex-shrink: 0; }
.bar-right .meter { white-space: nowrap; }
/* 3. Handoffs sheet reads as bot passes, not email/tickets. */
.teamwork-head.handoffs-head,
.handoffs-head { margin-bottom: 14px; }
.handoffs-head .handoffs-lead { font-size: 12.5px; }
.teamwork-pass {
  border-left-width: 2px;
  border-left-color: color-mix(in srgb, var(--ink) 12%, transparent);
}
.teamwork-pass-who {
  font-size: 12.5px;
  letter-spacing: 0.01em;
  color: var(--muted);
}
.teamwork-pass-who b { color: var(--ink); font-weight: 600; }
.teamwork-arrow { margin: 0 6px; opacity: 0.8; }
.teamwork-pass-task { font-size: 13.5px; }
@media (max-width: 480px) {
  .today-fleet { padding: 10px 10px 12px; }
  .today-org-row { padding: 8px 6px; margin: 0 -6px; font-size: 13px; }
  .today-ceo-link { min-height: 44px; padding: 10px 4px; margin: -10px 0; }
  .today-org-badges { margin-left: 6px; }
}

/* Phase 36 — Pinned status board above chat (not buried in scroll) */
.today-dock {
  flex-shrink: 0;
  padding: 0 12px 8px;
  max-width: min(52rem, 100%);
  margin: 0 auto;
  width: 100%;
}
.today-dock:empty { display: none; }
.today-dock .today-brief {
  margin: 0;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ink) 6%, transparent);
}
.chat-shell:not(.work-open):not(.activity-open) .stream {
  flex: 1 1 auto;
  min-height: 0;
}
@media (max-width: 480px) {
  .today-dock { padding: 0 10px 6px; }
}

/* Phase 36 — Pinned "What's going on" + calm chat (Muse, CSS only) */
/* 1. .today-dock is the status board: one calm panel pinned above the
      scroll, visually separate from the message stream below. */
.today-dock:not(:empty) {
  background: var(--panel);
  border: 1px solid color-mix(in srgb, var(--bronze) 26%, var(--track));
  border-radius: 16px;
  box-shadow: var(--shadow-card);
  padding: 12px 14px 11px;
  margin-bottom: 10px;
  position: relative;
  z-index: 4;
  isolation: isolate;
}
.today-dock:not(:empty) .today-brief {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
}
.today-dock:not(:empty) + .stream {
  padding-top: 4px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 7%, transparent);
  position: relative;
  z-index: 1;
}
.chat-shell.activity-open .stream,
.chat-shell.work-open .stream {
  /* Mobile / narrow: keep chat readable while the work sheet is open. */
  opacity: 1;
  max-height: none;
  pointer-events: auto;
  user-select: text;
}
@media (min-width: 1024px) {
  .chat-shell.activity-open .stream,
  .chat-shell.work-open .stream {
    opacity: 0.72;
    pointer-events: auto;
    user-select: text;
  }
}
.chat-shell.activity-open .today-dock:not(:empty),
.chat-shell.work-open .today-dock:not(:empty) {
  opacity: 1;
  pointer-events: auto;
}
@media (max-width: 1023px) {
  .chat-shell.activity-open .today-dock:not(:empty),
  .chat-shell.work-open .today-dock:not(:empty) {
    display: none;
  }
}
/* 2. Sheet + Handoffs titles read as sentences, never ribbon shout. */
#activityTitle {
  font-size: 14px;
  letter-spacing: 0.01em;
  text-transform: none;
}
#activityTitle .activity-title-main {
  text-transform: none;
  letter-spacing: 0.01em;
}
#activityTitle .activity-title-sub {
  text-transform: none;
  letter-spacing: 0;
}
.handoffs-title {
  text-transform: none;
  letter-spacing: -0.01em;
}
/* 3. At home (dock pinned) the stream sits below status: clear rule,
      calm density, muted empty state — never competing with the board. */
.chat-shell:has(.today-dock:not(:empty)) .stream .cron-empty {
  border: 1px dashed color-mix(in srgb, var(--ink) 14%, transparent);
  border-radius: 12px;
  padding: 12px 14px;
  background: color-mix(in srgb, var(--panel) 92%, transparent);
}
@media (max-width: 480px) {
  .today-dock:not(:empty) { padding: 10px 12px 9px; margin-bottom: 8px; }
  .handoffs-title { font-size: 1.15rem; }
}

/* Phase 37 — No ghost chat behind status board (Muse, CSS only) */
/* 1. Status dock is opaque: solid panel, no backdrop bleed from #stream. */
.today-dock:not(:empty) {
  background-color: var(--panel);
  background-image: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  isolation: isolate;
}
/* 2. Sheet open = one calm desk: dock + sheet share panel language,
      stream steps back but keeps its scroll position underneath. */
.chat-shell.activity-open .stream,
.chat-shell.work-open .stream {
  overflow: hidden;
  scrollbar-width: none;
}
.chat-shell.activity-open .stream::-webkit-scrollbar,
.chat-shell.work-open .stream::-webkit-scrollbar { display: none; }
.chat-shell.activity-open .stream::after,
.chat-shell.work-open .stream::after {
  background: color-mix(in srgb, var(--bg) 62%, transparent);
}
@media (min-width: 1024px) {
  .chat-shell.activity-open .today-dock:not(:empty),
  .chat-shell.work-open .today-dock:not(:empty) {
    z-index: 5;
  }
  .chat-shell.activity-open .activity-sheet:not([hidden]),
  .chat-shell.work-open .activity-sheet:not([hidden]) {
    align-self: start;
    z-index: 4;
    isolation: isolate;
    max-height: calc(100vh - 220px);
    overflow: hidden auto;
    border-color: color-mix(in srgb, var(--bronze) 26%, var(--track));
  }
}
@media (max-width: 1023px) {
  .chat-shell.activity-open .today-dock:not(:empty),
  .chat-shell.work-open .today-dock:not(:empty) {
    position: relative;
    z-index: 45;
  }
}

/* Muse Phase 38 — Needs you panel on Today (not buried in Settings) */
.today-needs-panel {
  margin: 12px 0 10px;
  padding: 12px 14px;
  border-radius: var(--radius-md, 10px);
  border: 1px solid color-mix(in srgb, var(--bronze) 32%, var(--track));
  background: color-mix(in srgb, var(--bronze) 8%, var(--panel));
}
.today-needs-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--bronze);
}
.today-needs-panel .today-need-card {
  margin: 0 0 8px;
  border-color: color-mix(in srgb, var(--bronze) 22%, var(--track));
}
.today-needs-panel .today-need-card:last-of-type {
  margin-bottom: 0;
}
.today-needs-panel .need-plain {
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink-soft);
}
.today-needs-more {
  margin: 8px 0 0;
  font-size: 12px;
}

.teamwork-cluster-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6em;
  height: 1.6em;
  padding: 0 4px;
  margin-left: 6px;
  font-size: 10px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--bronze);
  background: var(--bronze-soft);
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--bronze) 30%, transparent);
}
.teamwork-pass.is-cluster .teamwork-pass-task {
  color: var(--muted);
}

.goals-empty .goals-head {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 12px;
}
.goals-empty .goals-count {
  color: var(--muted);
}
.goals-empty-actions {
  padding-top: 8px;
}

/* Muse Phase 39 — stable chat column: dock + ribbon stay pinned; sheet is a column on desktop */
:root {
  --chat-prose: min(42rem, 100%);
  --chat-dock: 148px;
}
@media (max-width: 1023px) {
  .chat-shell {
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
  }
  .chat-shell .stream {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
  }
  .chat-shell .chat-dock {
    flex-shrink: 0;
    position: sticky;
    bottom: 0;
    z-index: 60;
  }
  .chat-shell.work-open .activity-sheet:not([hidden]),
  .chat-shell.activity-open .activity-sheet:not([hidden]) {
    left: 10px;
    right: 10px;
    bottom: calc(var(--chat-dock) + 10px);
    max-height: min(58vh, calc(100% - var(--chat-dock) - 20px));
    z-index: 50;
  }
}
@media (min-width: 1024px) {
  .chat-shell {
    display: grid !important;
    flex: 1;
    min-height: 0;
    width: 100%;
    max-width: min(78rem, calc(100% - 32px));
    margin-inline: auto;
    padding: 0 20px 14px;
    box-sizing: border-box;
    grid-template-columns: minmax(0, var(--chat-prose));
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    column-gap: 0;
    align-content: stretch;
  }
  .chat-shell.work-open,
  .chat-shell.activity-open {
    grid-template-columns: minmax(0, var(--chat-prose)) minmax(17rem, 22rem);
    column-gap: 18px;
  }
  .chat-shell .chat-head,
  .chat-shell:not(.work-open):not(.activity-open) .chat-head {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    margin-inline: 0;
  }
  .chat-shell.work-open .chat-head,
  .chat-shell.activity-open .chat-head {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .chat-shell .today-dock {
    grid-column: 1;
    grid-row: 2;
    z-index: 5;
    position: relative;
    align-self: start;
    width: 100%;
    margin: 0 0 8px;
  }
  .chat-shell .stream {
    grid-column: 1;
    grid-row: 3;
    min-height: 0;
    overflow: auto;
    width: 100%;
    margin-inline: 0;
    position: relative;
    isolation: isolate;
  }
  .chat-shell .work-status {
    grid-column: 1;
    grid-row: 3;
    align-self: end;
    z-index: 6;
    pointer-events: none;
  }
  .chat-shell .chat-dock {
    grid-column: 1;
    grid-row: 4;
    position: relative !important;
    bottom: auto !important;
    top: auto !important;
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    z-index: 12;
    align-self: end;
  }
  .chat-shell:not(.work-open):not(.activity-open) .chat-head,
  .chat-shell:not(.work-open):not(.activity-open) .stream,
  .chat-shell:not(.work-open):not(.activity-open) .chat-dock {
    width: 100%;
    margin-inline: 0;
  }
  .chat-shell .activity-sheet:not([hidden]) {
    position: static !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    flex: unset;
    grid-column: 2;
    grid-row: 2 / span 3;
    min-height: 0;
    max-height: calc(100vh - 180px);
    align-self: stretch;
    z-index: auto;
    margin: 0;
    overflow: hidden auto;
  }
  .chat-shell:not(.work-open):not(.activity-open) .activity-sheet {
    display: none !important;
  }
}

/* Stream / OBS: one CEO on screen — backends unchanged */
body.hide-other-ceos .org-staff,
body.hide-other-ceos[data-stream-focus] .org-staff {
  display: none !important;
}

body.hide-other-ceos.stream-broadcast .today-fleet,
body.hide-other-ceos.stream-broadcast .today-trust-strip,
body.hide-other-ceos.stream-broadcast .today-autopilot-org {
  display: none !important;
}

body.hide-other-ceos .org-project:not([data-project-wrap]) {
  display: none;
}

body.hide-other-ceos .org-hide-ceos.on {
  box-shadow: 0 0 0 1px var(--accent, #c8fa2c);
}

/* Stream / OBS broadcast — one CEO, one column story (backends unchanged) */
body.stream-broadcast .today-lead,
body.stream-broadcast .today-schedule-truth,
body.stream-broadcast .today-needs-panel,
body.stream-broadcast .today-decision,
body.stream-broadcast .today-next-due,
body.stream-broadcast .today-autopilot,
body.stream-broadcast .today-details,
body.stream-broadcast .work-desk-context,
body.stream-broadcast .work-sheet-glossary,
body.stream-broadcast #chatCapability,
body.stream-broadcast .ceo-switch-divider {
  display: none !important;
}

body.stream-broadcast .today-brief {
  margin-bottom: 8px;
  padding: 10px 12px;
}

body.stream-broadcast .today-brief-head .today-who {
  font-size: 1.35rem;
}

body.stream-broadcast .chat-shell.work-open {
  grid-template-columns: minmax(0, 1fr) minmax(0, 20rem) !important;
}

body.stream-broadcast .activity-sheet {
  border-color: color-mix(in srgb, var(--bronze) 35%, var(--line));
}

body.stream-broadcast .stream {
  max-width: 52rem;
}

/* Operator truth console — Live / Results / Due receipts */
.truth-console {
  display: grid;
  gap: 10px;
  margin: 4px 0 8px;
  min-width: 0;
}
.truth-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  font-size: 12px;
  color: var(--muted);
}
.truth-pill {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 2px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
}
.truth-pill.is-live {
  border-color: color-mix(in srgb, var(--bronze) 55%, var(--line));
  color: var(--bronze);
  background: var(--bronze-soft);
}
.truth-meta { color: var(--muted); }
.truth-spotlight {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--panel) 88%, #0a0908);
  box-shadow: var(--shadow-inset);
}
.truth-spotlight.is-quiet { opacity: 0.92; }
.truth-kicker {
  margin: 0 0 4px;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--bronze);
  display: flex;
  align-items: center;
  gap: 8px;
}
.truth-title {
  margin: 0;
  font: 600 18px/24px var(--display);
  color: var(--ink);
}
.truth-body {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--muted);
}
.truth-bot {
  margin: 0;
  padding: 8px 12px;
  border-left: 2px solid var(--bronze);
  font-size: 13px;
  line-height: 1.45;
  color: var(--strong);
}
.truth-watch {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--muted);
}
.truth-pipeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}
.truth-step {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 8px;
  align-items: start;
  padding: 6px 8px;
  border: 1px solid rgba(243, 234, 216, 0.06);
  border-radius: 10px;
}
.truth-step.is-done { border-color: color-mix(in srgb, var(--mint) 35%, var(--line)); }
.truth-step.is-active {
  border-color: color-mix(in srgb, var(--bronze) 50%, var(--line));
  background: var(--bronze-soft);
}
.truth-step.is-failed { border-color: color-mix(in srgb, var(--danger) 50%, var(--line)); }
.truth-step-icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  background: var(--track);
}
.truth-step.is-done .truth-step-icon { background: var(--mint); color: #10201c; }
.truth-step.is-failed .truth-step-icon { background: var(--danger); color: #1a100c; }
.truth-step-copy { min-width: 0; display: grid; gap: 2px; }
.truth-step-copy b {
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: lowercase;
}
.truth-step-detail, .truth-step-links {
  font-size: 12px;
  color: var(--muted);
}
.truth-log-panel { min-width: 0; }
.truth-log-kicker {
  margin: 4px 0 6px;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--bronze);
}
.truth-log {
  list-style: none;
  margin: 0;
  padding: 0;
}
.truth-event {
  display: grid;
  grid-template-columns: 10px 1fr auto;
  gap: 8px 10px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(243, 234, 216, 0.06);
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
  font-size: 12px;
  color: var(--muted);
}
.truth-event:last-child { border-bottom: 0; }
.truth-marker {
  width: 8px;
  height: 8px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--bronze);
}
.truth-event.is-ok .truth-marker { background: var(--mint); }
.truth-event.is-bad .truth-marker { background: var(--danger); }
.truth-event-body { min-width: 0; display: grid; gap: 2px; }
.truth-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--strong);
}
.truth-text { line-height: 1.4; overflow-wrap: anywhere; color: var(--ink); }
.truth-when {
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
}
.truth-when-line {
  margin: 4px 0 0;
  font-size: 11px;
  color: var(--muted);
}
.truth-link {
  color: var(--bronze);
  font-weight: 700;
  text-decoration: none;
}
.truth-link:hover { text-decoration: underline; }
.truth-link-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  margin-top: 8px;
  font-size: 12px;
}
.truth-sep { color: var(--muted); }
.truth-ship, .truth-queue {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--panel) 88%, #0a0908);
  margin: 0 0 8px;
}
.truth-queue.is-next {
  border-color: color-mix(in srgb, var(--bronze) 45%, var(--line));
}
.truth-ship-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.truth-ship-head b { font: 600 15px/20px var(--display); }
.truth-cadence .work-desk-row { margin: 0; }
.truth-text code, .truth-link-row code {
  font-size: 11px;
  color: var(--bronze);
}

/* Phase 37b — No ghost chat behind status board, re-run hardening (Muse, CSS only) */
/* Status board is opaque: solid panel, isolated stacking context, no stream bleed. */
#todayDock.today-dock:not(:empty) {
  background: var(--panel);
  background-image: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  isolation: isolate;
  position: relative;
  z-index: 5;
}
@media (min-width: 1024px) {
  .chat-shell.activity-open #todayDock.today-dock:not(:empty),
  .chat-shell.work-open #todayDock.today-dock:not(:empty) {
    z-index: 5;
  }
  .chat-shell.activity-open .activity-sheet:not([hidden]),
  .chat-shell.work-open .activity-sheet:not([hidden]) {
    isolation: isolate;
    z-index: 4;
  }
  /* Sheet open = calm desk: stream locks scroll behind, hides scrollbars,
     keeps position; dim wash lives inside .stream only (never over dock). */
  .chat-shell.activity-open .stream,
  .chat-shell.work-open .stream {
    overflow: hidden;
    scrollbar-width: none;
  }
  .chat-shell.activity-open .stream::-webkit-scrollbar,
  .chat-shell.work-open .stream::-webkit-scrollbar {
    display: none;
  }
}
@media (max-width: 1023px) {
  /* No overlap on mobile: status board hides while the sheet is open;
     composer dock stays pinned above the sheet bottom edge (Phase 39). */
  .chat-shell.activity-open #todayDock.today-dock:not(:empty),
  .chat-shell.work-open #todayDock.today-dock:not(:empty) {
    display: none;
  }
}


/* Google key file: pick or drop the .json right inside the setup steps */
.gg-drop { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 8px; padding: 12px; border: 1px dashed var(--line, #c9ccd3); border-radius: 10px; }
.gg-drop.is-over { border-color: var(--accent, #3b6cf6); background: color-mix(in srgb, var(--accent, #3b6cf6) 8%, transparent); }
.gg-pick { cursor: pointer; display: inline-flex; align-items: center; }
.gg-file-status { flex-basis: 100%; }
.gg-file-status:empty { display: none; }
.ai-keys .ghost-btn.is-danger { color: var(--bad, #d9534f); border-color: currentColor; }

/* CEO setup: repo + hosting chosen from what the keys can see */
.src-pick { width: 100%; }
.src-pick.hidden, #ceoGithubRepo.hidden, #ceoHosting.hidden, .src-suggest.hidden { display: none; }
.src-pick + input:not(.hidden) { margin-top: 6px; }
.src-why:empty { display: none; }
.src-suggest { margin: 4px 0 14px; padding: 12px 14px; border: 1px solid var(--line, #c9ccd3); border-radius: 10px; }
.src-suggest p { margin: 0 0 8px; }
.src-suggest p:last-child { margin-bottom: 0; }
.stripe-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 14px; max-height: 220px; overflow: auto; }
.stripe-row { display: flex; align-items: center; gap: 8px; font-weight: 400; }
.stripe-row input { width: auto; }

/* Long replies: a small heading, short paragraphs, real lists — all in one box */
.bubble-text .bot-kicker { margin: 2px 0 6px; font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent, #c9a45c); font-weight: 600; }
.bubble-text p + p { margin-top: 0.6em; }
.bubble-text ul { margin: 0.5em 0 0.7em; padding-left: 1.2em; }
.bubble-text li + li { margin-top: 0.3em; }

/* SEO card: keyword universe clusters */
.table-scroll { overflow-x: auto; max-width: 100%; }
.mini-table { width: 100%; border-collapse: collapse; font-size: 0.85em; }
.mini-table th, .mini-table td { padding: 4px 6px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.mini-table th { font-weight: 600; white-space: nowrap; }

/* Settings → Auto-approve */
#panel-auto .check { align-items: flex-start; color: var(--text); }
#panel-auto .check input { margin-top: 3px; flex: 0 0 auto; width: 18px; height: 18px; }
#panel-auto .auto-master { padding: 12px 14px; border: 1px solid var(--line, rgba(127,127,127,.25)); border-radius: 12px; margin: 12px 0; }
#panel-auto .auto-kinds { display: grid; gap: 10px; margin: 8px 0 12px; }
#panel-auto .auto-log { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 10px; }
#panel-auto .auto-row { padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line, rgba(127,127,127,.25)); border-left-width: 3px; }
#panel-auto .auto-row.is-good { border-left-color: #2e9d5b; }
#panel-auto .auto-row.is-bad { border-left-color: #d0453a; }
#panel-auto .auto-row.is-held { border-left-color: #c9962b; }
#panel-auto .auto-row p { margin: 4px 0 0; overflow-wrap: anywhere; }
#panel-auto .auto-row-label { font-weight: 500; }
#panel-auto .auto-check.is-fix b { color: #d0453a; }
#panel-auto .auto-check.is-done b { color: #2e9d5b; }
#panel-auto .auto-reviewer { display: grid; gap: 8px; margin: 8px 0 12px; }
#panel-auto .auto-reviewer select { max-width: 100%; }
#panel-auto .auto-rules { display: grid; gap: 10px; margin: 8px 0 12px; }
#panel-auto .auto-rule { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; }
@media (max-width: 560px) { #panel-auto .auto-rule { grid-template-columns: 1fr; } }
#panel-auto .auto-waits { list-style: none; padding: 0; margin: 8px 0 12px; display: grid; gap: 8px; }
#panel-auto .auto-waits > li { padding: 8px 12px; border: 1px solid var(--line, rgba(127,127,127,.25)); border-radius: 10px; overflow-wrap: anywhere; }
#panel-auto .auto-waits > li > small { display: block; margin-top: 2px; }
#panel-auto .auto-waits details ul { margin: 6px 0 0; padding-left: 1.1em; }
.approval-brief { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 3px; font-size: 13px; }
.approval-brief li { overflow-wrap: anywhere; }
.approval-brief li > span { display: inline-block; min-width: 92px; color: var(--muted, #9a938a); font-weight: 500; }
.approval-brief li.is-money > span, .approval-brief li.is-outside > span, .approval-brief li.is-delete > span, .approval-brief li.is-legal > span { color: var(--bad, #d0453a); }
.approval-brief li.is-live > span, .approval-brief li.is-person > span { color: var(--warn, #c9962b); }
.auto-note { margin: 6px 0 0; font-size: .92em; }
.auto-note b { color: var(--text); }

/* How long a Needs-you card has waited, after its kicker. */
.desk-need-kicker .need-age { text-transform: none; letter-spacing: 0; font-weight: 400; opacity: 0.75; }

/* A card opened from a link (a notification, a shared URL) says which one it is for a moment. */
.desk-need.is-linked {
  outline: 2px solid var(--bronze);
  outline-offset: 3px;
  transition: outline-color 0.6s ease;
}

.push-kinds {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin: 10px 0 4px;
}
.push-kinds label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  white-space: nowrap;
}
.push-kinds input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 0;
  flex: 0 0 auto;
  accent-color: var(--bronze);
}

.devices-list {
  list-style: none;
  padding: 0;
  margin: 10px 0;
  display: grid;
  gap: 8px;
}
.devices-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
}
.devices-list .muted { flex: 1 1 100%; font-size: 0.86em; }
.device-code { margin-top: 12px; }
.device-code-value {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 1.9rem;
  letter-spacing: 0.12em;
  margin: 0 0 6px;
  color: var(--strong);
}
.unlock-code { margin-top: 14px; }
.unlock-code summary { cursor: pointer; color: var(--muted); min-height: 32px; display: flex; align-items: center; }
.unlock-code input { text-transform: uppercase; letter-spacing: 0.08em; }

/* Replies: code and tables keep their shape and scroll sideways inside the bubble, never the page. */
.bubble-text .bot-code {
  margin: 8px 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--track);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  font-size: 12.5px;
  line-height: 1.5;
  white-space: pre;
  max-width: 100%;
}
.bubble-text .bot-code code { background: none; padding: 0; font-size: inherit; white-space: inherit; }
.bubble-text .bot-table {
  margin: 8px 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}
.bubble-text .bot-table table { border-collapse: collapse; font-size: 13px; min-width: 100%; }
.bubble-text .bot-table th,
.bubble-text .bot-table td { padding: 6px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.bubble-text .bot-table th { color: var(--muted); font-weight: 600; white-space: nowrap; }
.bubble-text ol { padding-left: 1.4em; }

/* While a reply streams, the step it is on stays in view at the top of the chat, however long the reply grows. */
.bubble.live .thinking-wrap {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--bg);
  padding-top: 4px;
}
.help-ticket span {
  white-space: normal;
}
.help-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.help-stale {
  color: var(--warn, #e0a85a);
}
.help-group {
  margin-top: 6px;
  font-size: 11px;
  color: var(--muted);
}
.share-box {
  display: grid;
  gap: 4px;
}
.share-line {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}
.share-preview summary {
  font-size: 11px;
  color: var(--muted);
  cursor: pointer;
}
.share-preview pre {
  font-size: 10px;
  white-space: pre-wrap;
  word-break: break-word;
  margin: 4px 0 0;
}
.share-box.hidden,
#shareGithub.hidden { display: none; }
.suggest-form .share-line input { width: auto; margin: 0; }