/* Shared Ledger skin. The root canvas also paints uncovered PWA safe areas. */
:root { background: #000; color-scheme: dark; }
/* The table owns horizontal gestures, including at its edges in mobile Safari. */
html:has(body.ledger[data-page="chat"]) {
  overflow-x: clip;
  overscroll-behavior-x: none;
}
.ledger {
  --lg-bg: #000;
  --lg-panel: #0d0d0d;
  --lg-blk: #161616;
  --lg-blk-2: #242424;
  --lg-line: #222;
  --lg-line-2: #4a4a4a;
  --lg-ink: #ffffff;
  --lg-muted: #8a8a8a;
  --lg-dim: #5c5c5c;
  --lg-ok: #8fd694;
  --lg-danger: #ff5d5d;
  --line: #222;
  --line-strong: #4a4a4a;
  --panel: #000;
  --surface: #000;
}

body.ledger {
  background: var(--lg-bg);
  color: var(--lg-ink);
  font-size: 13px;
  overflow: hidden;
}

.ledger button { border-radius: 0; }
.ledger .visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ledger .lg-dim { color: var(--lg-dim); }
.ledger .terminal-panel { background: var(--lg-bg); border-color: var(--lg-line); }
.ledger .terminal-panel::before,
.ledger .terminal-panel::after,
.ledger .section-label::before,
.ledger .panel-title::before { display: none; }
@keyframes lg-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.2; } }
@keyframes lg-fade { from { opacity: 0; } to { opacity: 1; } }

/* ---------- Shell ---------- */
.ledger .lg-shell {
  display: grid;
  grid-template-columns: 236px minmax(0, 1fr);
  gap: 0;
  padding: 0;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
}
body.ledger[data-page="chat"] .lg-shell { grid-template-columns: 236px minmax(0, 1fr); }

.ledger .lg-side {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
  min-height: 0;
  overflow: hidden;
  border-right: 1px solid var(--lg-line);
  background: var(--lg-bg);
}

.ledger .lg-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 44px;
  flex: 0 0 44px;
  padding: 0 14px;
  border-bottom: 1px solid var(--lg-line);
}

.ledger[data-page="chat"] .lg-brand { height: 46px; flex-basis: 46px; }

.ledger .lg-logo { width: 34px; height: 20px; object-fit: contain; display: block; }
.ledger .lg-brand-name { flex: 1; font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--lg-ink); }
.ledger .lg-side-close { display: none; }

.ledger .lg-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  padding: 0;
  border: 1px solid var(--lg-line);
  background: none;
  color: var(--lg-muted);
  cursor: pointer;
  transition: color 0.14s ease, border-color 0.14s ease, background 0.14s ease;
}
.ledger .lg-icon svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: square; stroke-linejoin: miter; }
.ledger .lg-icon:hover { background: none; color: var(--lg-ink); border-color: var(--lg-line-2); }
.ledger .lg-icon:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ledger .lg-icon:disabled { opacity: 0.55; cursor: default; }
.ledger .lg-icon:active { background: var(--lg-ink); color: #000; }
.ledger .lg-reload { margin: 0; }

.ledger .lg-blk {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 36px;
  padding: 0 14px;
  border: 1px solid var(--lg-line);
  background: var(--lg-blk);
  color: var(--lg-ink);
  font: inherit;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.14s ease, border-color 0.14s ease, color 0.14s ease, transform 0.08s ease;
}
.ledger .lg-blk svg { width: 14px; height: 14px; flex: 0 0 14px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: square; stroke-linejoin: miter; }
.ledger .lg-blk:hover { background: var(--lg-blk-2); border-color: var(--lg-line-2); }
.ledger .lg-blk:active { transform: translateY(1px); }
.ledger .lg-blk.is-active, .ledger .lg-blk.is-enabled { color: var(--accent); border-color: var(--accent); }
.ledger .lg-blk:disabled { opacity: 0.45; cursor: default; }
.ledger .lg-blk-primary { background: var(--lg-ink); border-color: var(--lg-ink); color: #000; font-weight: 600; }
.ledger .lg-blk-primary:hover { background: #d9d9d9; border-color: #d9d9d9; }
.ledger .lg-row { width: 100%; justify-content: flex-start; }
.ledger .lg-notify-state { margin-left: auto; font-size: 10px; letter-spacing: 0.14em; color: var(--lg-dim); }
.ledger .lg-notify-state::after { content: "OFF"; }
.ledger .lg-notify[aria-pressed="true"] .lg-notify-state::after { content: "ON"; color: var(--accent); }
.ledger .lg-notify:disabled .lg-notify-state::after { content: "N/A"; }

.ledger .lg-side-actions { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px 12px; border-bottom: 1px solid var(--lg-line); }
.ledger .lg-side-label { padding: 10px 14px 6px; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--lg-muted); }

.ledger .lg-chat-list {
  flex: 1;
  min-height: 132px;
  overflow-y: auto;
  display: block;
  scrollbar-width: thin;
  scrollbar-color: var(--lg-line-2) transparent;
}
.ledger .lg-chat-list::-webkit-scrollbar { width: 8px; }
.ledger .lg-chat-list::-webkit-scrollbar-thumb { background: var(--lg-line-2); border: 0; }
.ledger .lg-chat-list::-webkit-scrollbar-track { background: transparent; border: 0; }
.ledger .lg-chat-group { padding: 14px 16px 6px; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--lg-dim); }

.ledger .chat-link {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 8px;
  min-height: 36px;
  margin: 0;
  padding: 8px 12px 8px 16px;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--lg-muted);
  font-size: 12px;
  line-height: 1.35;
  transition: background 0.14s ease, color 0.14s ease;
}
.ledger .chat-link::before,
.ledger .chat-link.is-running::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: auto;
  width: 2px;
  height: auto;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
  background: transparent;
  animation: none;
}
.ledger .chat-link::after { display: none; }
.ledger .chat-link:hover { background: var(--lg-panel); color: var(--lg-ink); }
.ledger .chat-link.is-active { background: var(--lg-panel); color: var(--lg-ink); }
.ledger .chat-link.is-active::before { background: var(--accent); }
.ledger .chat-link.is-running::before { background: var(--lg-ink); animation: lg-blink 1s ease-in-out infinite; }
.ledger .chat-link-title {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: inherit;
  font-size: 12px;
  font-weight: 400;
}
.ledger .chat-link.has-unread-terminal .chat-link-title { color: var(--lg-ink); font-weight: 500; }
.ledger .chat-unread-indicator {
  width: auto;
  height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--accent);
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
}
.ledger .chat-link-meta { font-size: 10px; color: var(--lg-dim); white-space: nowrap; letter-spacing: 0.02em; }
.ledger .sidebar-empty { padding: 12px 16px; font-size: 11px; color: var(--lg-dim); }

.ledger .lg-ws { flex: 0 0 auto; }
.ledger .lg-ws-summary { display: flex; align-items: center; justify-content: space-between; list-style: none; cursor: pointer; border-top: 1px solid var(--lg-line); padding: 9px 16px; transition: color 0.14s ease; }
.ledger .lg-ws-summary::-webkit-details-marker { display: none; }
.ledger .lg-ws-summary:hover { color: var(--lg-ink); }
.ledger .lg-ws-summary svg { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 1.8; transition: transform 0.16s ease; }
.ledger .lg-ws[open] .lg-ws-summary svg { transform: rotate(180deg); }
.ledger .lg-ws-nav { display: flex; flex-direction: column; border-top: 1px solid var(--lg-line); }
.ledger .lg-ws-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  height: 34px;
  padding: 0 16px;
  border-bottom: 1px solid var(--lg-line);
  font-size: 10.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lg-muted);
  white-space: nowrap;
  transition: background 0.14s ease, color 0.14s ease;
}
.ledger .lg-ws-item:last-child { border-bottom: 0; }
.ledger .lg-ws-item:hover { background: var(--lg-panel); color: var(--lg-ink); }
.ledger .lg-ws-item.is-active { color: var(--lg-ink); box-shadow: inset 2px 0 0 var(--accent); }
.ledger .lg-ws-item svg { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 1.8; color: var(--lg-dim); }
.ledger .lg-arr { color: var(--lg-dim); transition: transform 0.14s ease, color 0.14s ease; }
.ledger .lg-ws-item:hover .lg-arr { color: var(--accent); transform: translateX(2px); }
.ledger .lg-ws-dim { color: var(--lg-dim); }

.ledger .lg-scrim { display: none; }

.ledger .lg-main {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  gap: 0;
  padding: 0;
  background: var(--lg-bg);
}

.ledger .lg-pagebar {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 44px;
  flex: 0 0 44px;
  padding: 0 16px;
  border-bottom: 1px solid var(--lg-line);
}
.ledger .lg-pagebar-title { font-size: 11px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; }
.ledger .lg-pagebar-model { margin-left: auto; font-size: 11px; color: var(--lg-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ledger .lg-burger { display: none; }

.ledger .content-shell {
  flex: 1;
  min-height: 0;
  padding: 16px;
  overflow: auto;
  gap: 16px;
}
.ledger[data-page="chat"] .lg-content { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.ledger .flash-stack { padding: 12px 16px 0; }

/* ---------- Chat ---------- */
.ledger .lg-chat {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  min-width: 0;
  gap: 0;
  padding: 0;
  border: 0;
  background: none;
  grid-template-columns: none;
}

.ledger .lg-head {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 46px;
  flex: 0 0 46px;
  padding: 0 12px 0 16px;
  border-bottom: 1px solid var(--lg-line);
}
.ledger .lg-head-main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 14px; }
.ledger .lg-title {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 42%;
  flex: 0 1 auto;
}
.ledger .lg-model { position: relative; min-width: 0; flex: 0 1 auto; }
.ledger .lg-model-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  height: 30px;
  padding: 0 10px;
  border: 1px solid var(--lg-line);
  background: none;
  color: var(--lg-ink);
  font: inherit;
  font-size: 11px;
  cursor: pointer;
  transition: border-color 0.14s ease, background 0.14s ease;
}
.ledger .lg-model-trigger:hover { border-color: var(--lg-line-2); background: var(--lg-panel); }
.ledger .chat-model-picker.is-open .lg-model-trigger { border-color: var(--accent); }
.ledger .lg-model-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 240px; }
.ledger .lg-model-part { white-space: nowrap; padding-left: 8px; border-left: 1px solid var(--lg-line); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--lg-ink); }
.ledger .lg-caret { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 1.8; color: var(--lg-muted); }
.ledger .lg-model-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 60;
  width: 320px;
  max-width: calc(100vw - 24px);
  padding: 12px 14px 14px;
  border: 1px solid var(--lg-line-2);
  background: var(--lg-bg);
  box-shadow: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  animation: lg-fade 0.15s ease;
}
.ledger .lg-model-menu.is-hidden { display: none; }
.ledger .lg-menu-title { padding-bottom: 8px; border-bottom: 1px solid var(--lg-line); font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--lg-muted); }
.ledger .lg-model-menu label { display: grid; gap: 4px; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--lg-muted); }
.ledger .lg-model-menu select {
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--lg-line);
  border-radius: 0;
  background: var(--lg-bg);
  color: var(--lg-ink);
  font: inherit;
  font-size: 12px;
  text-transform: none;
  letter-spacing: 0;
}
.ledger .lg-model-menu select:hover { border-color: var(--lg-line-2); }
.ledger .lg-model-menu select:focus { outline: 1px solid var(--accent); outline-offset: 0; }
.ledger .lg-model-menu select:disabled { color: var(--lg-dim); }
.ledger .lg-menu-status { min-height: 14px; font-size: 11px; color: var(--lg-muted); }
.ledger .lg-menu-link { font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent); text-decoration: none; }
.ledger .lg-menu-link:hover { color: var(--lg-ink); }

.ledger .lg-gauge-wrap { position: relative; margin-left: auto; flex: 0 0 auto; }
.ledger .lg-gauge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 30px;
  padding: 0 10px;
  border: 1px solid var(--lg-line);
  background: none;
  color: var(--lg-ink);
  font: inherit;
  font-size: 11px;
  cursor: pointer;
  transition: border-color 0.14s ease, background 0.14s ease;
}
.ledger .lg-gauge:hover { border-color: var(--lg-line-2); background: var(--lg-panel); }
.ledger .lg-gauge[aria-expanded="true"] { border-color: var(--accent); }
.ledger .lg-gauge-track { position: relative; width: 64px; height: 6px; background: #262626; }
.ledger .lg-gauge-track i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: var(--lg-ink); transition: width 0.4s ease; }
.ledger .lg-gauge-track em { position: absolute; top: -3px; bottom: -3px; width: 1px; background: var(--accent); }
.ledger .lg-gauge.is-warn .lg-gauge-track i { background: var(--accent); }
.ledger .lg-gauge.is-danger .lg-gauge-track i { background: var(--lg-danger); }
.ledger .lg-gauge-pct { min-width: 32px; text-align: right; font-variant-numeric: tabular-nums; }
.ledger .lg-gauge-pop {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 60;
  width: 280px;
  padding: 12px 14px;
  border: 1px solid var(--lg-line-2);
  background: var(--lg-bg);
  display: grid;
  gap: 6px;
  animation: lg-fade 0.15s ease;
}
.ledger .lg-gauge-pop.is-hidden { display: none; }
.ledger .lg-gauge-row { display: flex; justify-content: space-between; gap: 12px; font-size: 11px; color: var(--lg-muted); }
.ledger .lg-gauge-row b { color: var(--lg-ink); font-weight: 500; font-variant-numeric: tabular-nums; }
.ledger .lg-gauge-note { margin-top: 4px; font-size: 10.5px; line-height: 1.45; color: var(--lg-dim); }

.ledger .lg-chat-status { display: flex; justify-content: flex-end; align-items: center; flex: 0 0 auto; min-height: 22px; padding: 3px 16px; }
.ledger .lg-live {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--lg-muted);
}
.ledger .lg-live::before { content: ""; position: static; display: inline-block; width: 7px; height: 7px; border: 0; border-radius: 0; background: var(--lg-dim); transform: none; animation: none; box-shadow: none; }
.ledger .lg-live::after { display: none; }
.ledger .lg-live[data-state="live"] { color: var(--accent); border-color: var(--accent); }
.ledger .lg-live[data-state="live"]::before { background: var(--accent); animation: lg-blink 0.9s ease-in-out infinite; }
.ledger .lg-live[data-state="fault"] { color: var(--lg-danger); border-color: var(--lg-danger); }
.ledger .lg-live[data-state="fault"]::before { background: var(--lg-danger); }

/* Messages: stacked blocks, no rules between them. The user turn sits on a slightly lighter block. */
.ledger .lg-messages {
  /* Normal flow keeps expanded details in the native scroll extent as they grow. */
  display: block;
  flex: 1;
  min-height: 0;
  min-width: 0;
  padding: 6px 0 14px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: var(--lg-line-2) transparent;
}
/* Keep empty-state sizing with its scroll container, including cached Mini skins. */
.ledger .lg-messages > .mini-welcome {
  width: 100%;
  min-height: 100%;
  display: grid;
  place-content: center;
  margin: 0;
  padding: 24px;
  color: var(--lg-muted);
  text-align: center;
}
/* Shared 10% watermark stays centered in the visible chat or board viewport,
   including while task lanes scroll horizontally on mobile. */
.ledger .lg-messages,
.ledger .lg-lanes {
  background-image: url("brand/zuza-chat-watermark.svg");
  background-position: center;
  background-size: min(70%, 560px) min(70%, 420px);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-origin: border-box;
}
.ledger .lg-messages::-webkit-scrollbar { width: 10px; }
.ledger .lg-messages::-webkit-scrollbar-thumb { background: var(--lg-line-2); border: 0; }
.ledger .lg-messages::-webkit-scrollbar-track { background: transparent; border: 0; }

.ledger .mini-message {
  display: block;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 16px 28px;
  border: 0;
  background: none;
  align-items: stretch;
}
.ledger .mini-message-user { background: var(--lg-panel); }
.ledger .mini-message + .mini-message { margin-top: 4px; }
.ledger .mini-message > .message-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
  margin: 0 0 8px;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.5;
  color: var(--lg-muted);
}
.ledger .mini-message-user > .message-meta { color: var(--accent); }
.ledger .lg-zuza-meta [data-assistant-meta] { color: #d4d4d4; }
.ledger .lg-time { color: var(--lg-dim); }
.ledger .mini-message > :not(.message-meta) { width: auto; max-width: none; }

.ledger .message-body,
.ledger .message-box,
.ledger .message-body pre,
.ledger .message-body-user pre,
.ledger .markdown-output { font-size: 14px; line-height: 1.6; }
.ledger .markdown-output :is(h1, h2, h3, h4, h5, h6) { font-size: calc(1em + 2pt); }
.ledger .mini-message-user .message-body-user,
.ledger[data-page="chat"] .message-user .message-body-user {
  background: none;
  border: 0;
  padding: 0;
  color: var(--lg-ink);
  box-shadow: none;
  white-space: normal;
  text-align: left;
  font-size: 14px;
  line-height: 1.6;
}
.ledger .mini-message-user, .ledger .mini-message-user .message-meta { text-align: left; align-items: start; justify-content: flex-start; }
.ledger[data-page="chat"] .message-user .message-body-user pre,
.ledger .message-body-user pre { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: 14px; line-height: 1.6; text-align: left; }
.ledger .mini-bubble-text, .ledger .markdown-output { min-width: 0; overflow-wrap: anywhere; }
.ledger .message-attachments { margin-top: 10px; }
.ledger .attachment-tile { border-radius: 0; }

.ledger .message-actions { display: inline-flex; align-items: center; gap: 2px; margin: 6px 0 0; }
.ledger .message-actions.is-hidden { display: none; }
.ledger .message-action { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 4px; border: 0; background: none; color: var(--lg-dim); cursor: pointer; transition: color 0.14s ease; }
.ledger .message-action svg { width: 13px; height: 13px; }
.ledger .message-action:hover { color: var(--accent); }
.ledger .message-action:disabled { opacity: 0.35; cursor: default; }
.ledger .message-action-status { margin-left: 6px; font-size: 10.5px; color: var(--lg-muted); }
.ledger .message-copy-buffer { position: fixed; left: -9999px; top: 0; }

/* Work log: a collapsible line list, indented, without frames. */
.ledger .assistant-stack { display: flex; flex-direction: column; gap: 0; min-width: 0; }
.ledger .message-work { width: 100%; min-width: 0; margin: 0 0 10px; border: 0; }
.ledger .message-work > summary {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 28px;
  padding: 0;
  list-style: none;
  cursor: pointer;
  user-select: none;
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lg-muted);
  transition: color 0.14s ease;
}
.ledger .message-work > summary::-webkit-details-marker { display: none; }
.ledger .message-work > summary::before { content: "›"; display: inline-block; width: 10px; font-size: 14px; line-height: 1; transition: transform 0.16s ease; }
.ledger .message-work[open] > summary::before { transform: rotate(90deg); }
.ledger .message-work > summary:hover { color: var(--lg-ink); }
.ledger .message-work.is-working > summary { color: var(--accent); }
.ledger .message-work-tokens {
  color: var(--lg-muted);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
  white-space: nowrap;
  text-transform: none;
}
.ledger .message-work > [data-mini-trace],
.ledger .message-work > [data-orchestration-trace],
.ledger .message-work > [data-work-legacy] {
  box-sizing: border-box;
  width: auto;
  margin: 2px 0 0;
  padding: 2px 0 4px 16px;
  border: 0;
}
.ledger .stage-block { margin: 0; }
.ledger .stage-block + .stage-block { margin-top: 8px; }
.ledger .stage-header { margin-bottom: 4px; }
.ledger .stage-title { font-size: 10px; letter-spacing: 0.1em; color: var(--lg-muted); }
.ledger .stage-model-meta { font-size: 10px; }
.ledger .stage-status { font-size: 10px; }
.ledger .stage-block-sequence,
.ledger .stage-prompt-processing { margin: 0; padding: 0; border: 0; }
.ledger .stage-sub-block + .stage-sub-block { margin-top: 2px; }
.ledger .tool-call-panel { margin: 0; }
.ledger .stream-panel summary,
.ledger .tool-call-panel summary,
.ledger .stream-panel-compaction .stream-summary,
.ledger .stream-panel-prompt-processing .stream-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 26px;
  padding: 0 6px 0 0;
  font-size: 12px;
  color: var(--lg-muted);
  transition: color 0.14s ease;
}
.ledger .tool-call-panel summary { color: #d4d4d4; }
.ledger .stream-panel summary:hover,
.ledger .tool-call-panel summary:hover { color: var(--lg-ink); }
.ledger .stream-panel summary::before,
.ledger .tool-call-panel summary::before,
.ledger .stream-panel-compaction .stream-summary::before,
.ledger .stream-panel-prompt-processing .stream-summary::before { color: var(--lg-dim); }
.ledger .stream-panel .markdown-output,
.ledger .tool-call-body,
.ledger .stage-block-note { margin: 2px 0 8px 16px; padding: 10px 12px; background: var(--lg-panel); font-size: 12.5px; line-height: 1.6; color: #bdbdbd; }
.ledger .tool-call-body { display: flex; flex-direction: column; gap: 10px; }
.ledger .tool-call-section .stage-subtitle { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--lg-dim); margin-bottom: 4px; }
.ledger .tool-call-input-pre,
.ledger .tool-call-model-view-pre,
.ledger .tool-call-output-pre { font-size: 11.5px; line-height: 1.55; padding: 0; border: 0; background: none; color: #d4d4d4; max-height: 320px; overflow: auto; overscroll-behavior-y: auto; }
.ledger .inline-zuza-update, .ledger .inline-user-update { margin: 4px 0 8px; padding: 0; }
.ledger .inline-zuza-update .message-meta, .ledger .inline-user-update .message-meta { font-size: 10px; letter-spacing: 0.1em; margin-bottom: 4px; }
.ledger .inline-zuza-update .message-body, .ledger .inline-user-update .message-body { font-size: 12.5px; color: #bdbdbd; padding: 0; }
.ledger .stage-loaded-context { margin: 4px 0 6px; font-size: 11px; }
.ledger .stage-loaded-context code { border-radius: 0; border-color: var(--lg-line-2); background: none; }
.ledger .file-change-badge { display: inline-flex; gap: 6px; padding: 1px 6px; border: 1px solid var(--lg-line-2); border-radius: 0; background: none; font-size: 10.5px; cursor: pointer; transition: border-color 0.14s ease; }
.ledger .file-change-badge:hover { border-color: var(--lg-ink); }
.ledger .file-change-added { color: var(--lg-ok); }
.ledger .file-change-removed { color: var(--lg-danger); }

.ledger .assistant-final-shell { margin: 0; padding: 0; gap: 8px; }
.ledger .assistant-final-response { padding: 0; }
.ledger .runtime-strip { font-size: 11px; color: var(--lg-muted); }
.ledger .generated-files { margin-top: 10px; }

.ledger .message-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  width: 100%;
  margin-top: 10px;
  padding: 0;
  border: 0;
  font-size: 10.5px;
  letter-spacing: 0.04em;
  color: var(--lg-dim);
}
.ledger .message-footer.is-hidden { display: none; }
.ledger .message-footer > .message-performance { display: contents; }
.ledger .message-footer > .message-performance.is-hidden { display: none; }
.ledger .message-performance-separator { display: none; }
.ledger .message-performance-item { gap: 5px; }
.ledger .message-performance-icon { color: var(--lg-dim); }
.ledger .message-footer .message-actions { margin: 0 0 0 auto; }

/* Bottom stack: plan, status line, composer */
.ledger .lg-bottom { flex: 0 0 auto; display: flex; flex-direction: column; border-top: 1px solid var(--lg-line); }
.ledger .lg-plan { border-bottom: 1px solid var(--lg-line); }
.ledger .lg-plan.is-hidden { display: none; }
.ledger .lg-plan-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  height: 34px;
  padding: 0 16px;
  border: 0;
  background: none;
  color: var(--lg-ink);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 0.14s ease;
}
.ledger .lg-plan-bar:hover { background: var(--lg-panel); }
.ledger .lg-plan-kicker { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--lg-muted); }
.ledger .lg-plan-progress { font-size: 11px; color: var(--accent); font-variant-numeric: tabular-nums; }
.ledger .lg-plan-label { flex: 1; min-width: 0; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ledger .lg-plan-chevron { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 1.8; color: var(--lg-muted); transition: transform 0.2s ease; }
.ledger .lg-plan.is-expanded .lg-plan-chevron { transform: rotate(180deg); }
.ledger .lg-plan-details { display: none; border-top: 1px solid var(--lg-line); max-height: 44vh; overflow: auto; }
.ledger .lg-plan.is-expanded .lg-plan-details { display: block; animation: lg-fade 0.15s ease; }
.ledger .lg-plan-head { padding: 8px 16px; font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; }
.ledger .lg-tabs { display: flex; gap: 0; margin: 0; padding: 0; border: 0; border-bottom: 1px solid var(--lg-line); }
.ledger .plan-tab {
  position: relative;
  height: 32px;
  padding: 0 16px;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--lg-muted);
  font: inherit;
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color 0.14s ease, background 0.14s ease;
}
.ledger .plan-tab:hover { color: var(--lg-ink); background: var(--lg-panel); }
.ledger .plan-tab.is-active { color: var(--lg-ink); background: none; }
.ledger .plan-tab.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--accent); }
.ledger .plan-tab-view { display: none; }
.ledger .plan-tab-view.is-active { display: block; }
.ledger .plan-scroll, .ledger .files-scroll { max-height: none; overflow: visible; padding: 10px 16px 12px; }
.ledger .plan-summary { margin: 0 0 8px; font-size: 12px; color: #d4d4d4; }
.ledger .plan-list { display: flex; flex-direction: column; gap: 6px; }
.ledger .plan-step { padding: 8px 10px 8px 12px; background: var(--lg-panel); }
.ledger .plan-step::before { top: 8px; bottom: 8px; width: 2px; border-radius: 0; }
.ledger .plan-step-status { font-size: 9.5px; letter-spacing: 0.14em; color: var(--lg-muted); }
.ledger .plan-step-title { font-size: 12.5px; color: var(--lg-ink); }
.ledger .plan-step-objective { font-size: 11.5px; color: var(--lg-muted); }
.ledger .plan-step-meta { font-size: 10px; }
.ledger .plan-tag { border-radius: 0; }
.ledger .task-file-list { display: flex; flex-direction: column; gap: 6px; }
.ledger .task-file { padding: 8px 10px; background: var(--lg-panel); font-size: 12px; }
.ledger .task-file-source { font-size: 10px; letter-spacing: 0.1em; color: var(--accent); }
.ledger .task-file-meta { font-size: 10.5px; color: var(--lg-dim); }

.ledger .lg-status-line { padding: 8px 16px 0; font-size: 11px; color: var(--accent); }
.ledger .lg-status-line.is-idle { display: none; }

.ledger .lg-composer { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 10px 12px 12px; border: 0; background: none; }
.ledger .lg-attachments { margin: 0; }
.ledger .lg-attachments.is-hidden { display: none; }
.ledger .chat-runtime-selector { position: static; }
.ledger[data-page="chat"] .lg-pop {
  position: absolute;
  left: 12px;
  right: auto;
  bottom: calc(100% - 2px);
  width: 280px;
  max-height: 320px;
  overflow-y: auto;
  padding: 8px;
  border: 1px solid var(--lg-line-2);
  background: var(--lg-bg);
  box-shadow: none;
  z-index: 60;
  animation: lg-fade 0.15s ease;
}
.ledger[data-page="chat"] .lg-pop[data-runtime-popover="tools"] { left: 52px; }
.ledger .lg-pop.is-hidden { display: none; }
.ledger .chat-runtime-menu-title { font-size: 10.5px; letter-spacing: 0.1em; }
.ledger .chat-runtime-option { font-size: 11.5px; text-transform: none; min-height: 30px; }
.ledger .chat-runtime-option:hover { background: var(--lg-panel); }
.ledger .lg-compose-row {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  padding: 6px;
  border: 1px solid var(--lg-line);
  background: var(--lg-bg);
  transition: border-color 0.14s ease;
}
.ledger .lg-compose-row:focus-within { border-color: var(--lg-line-2); }
.ledger .lg-compose-row > .lg-icon { width: var(--lg-touch-size, 36px); height: var(--lg-touch-size, 36px); flex: 0 0 var(--lg-touch-size, 36px); }
.ledger .lg-rt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  padding: 0;
  border: 1px solid var(--lg-line);
  background: var(--lg-blk);
  color: #d4d4d4;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.14s ease, border-color 0.14s ease, color 0.14s ease;
}
.ledger .lg-rt svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: square; stroke-linejoin: miter; }
.ledger .lg-rt:hover { background: var(--lg-blk-2); border-color: var(--lg-line-2); color: var(--lg-ink); }
.ledger .lg-rt[aria-expanded="true"] { border-color: var(--accent); color: var(--accent); }
.ledger .lg-rt:disabled { opacity: 0.4; cursor: default; }
.ledger .lg-compose-row textarea {
  flex: 1;
  min-width: 0;
  min-height: 36px;
  max-height: 200px;
  padding: 8px 10px;
  border: 0;
  background: none;
  color: var(--lg-ink);
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  resize: none;
  outline: none;
}
.ledger .lg-compose-row textarea::placeholder { color: var(--lg-dim); }
.ledger .lg-send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  width: 36px;
  min-width: 36px;
  flex: 0 0 36px;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.14s ease, color 0.14s ease;
}
.ledger .lg-send { background: var(--lg-ink); color: #000; }
.ledger .lg-send:hover { background: #d9d9d9; }
.ledger .lg-send:active { background: var(--accent); }
.ledger .lg-send.is-stop-mode { background: var(--lg-blk); color: var(--accent); border: 1px solid var(--lg-line-2); }
.ledger .lg-send.is-stop-mode:hover { background: var(--lg-blk-2); }
.ledger .lg-send svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ledger .lg-send .composer-stop-icon { display: none; fill: currentColor; stroke: none; }
.ledger .lg-send.is-stop-mode .composer-send-icon { display: none; }
.ledger .lg-send.is-stop-mode .composer-stop-icon { display: block; }
.ledger .lg-send:disabled { opacity: .4; cursor: default; }

.ledger .lg-empty { display: flex; flex-direction: column; gap: 16px; padding: 24px; }
.ledger .lg-empty-copy { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.ledger .lg-empty-copy p { margin: 0; font-size: 13px; color: var(--lg-muted); }

/* File diff drawer */
.ledger .file-diff-drawer { background: var(--lg-bg); box-shadow: none; border-left: 1px solid var(--lg-line-2); }
.ledger .file-diff-header { padding: 12px 16px; }
.ledger .file-diff-title { font-size: 12.5px; }

/* ---------- Task board and other pages ---------- */
.ledger .scheduler-heading { align-items: flex-end; margin-bottom: 4px; }
.ledger .scheduler-heading h1 { margin: 2px 0 4px; font-size: 15px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; }
.ledger .scheduler-heading .eyebrow { font-size: 10px; letter-spacing: 0.12em; color: var(--lg-muted); }
.ledger .scheduler-heading p, .ledger .scheduler-column-header p { font-size: 11px; color: var(--lg-muted); }
.ledger .scheduler-archive-toggle { font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--lg-muted); }
.ledger .scheduler-lane-nav button { border: 1px solid var(--lg-line); border-radius: 0; background: none; color: var(--lg-muted); font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; }
.ledger .scheduler-lane-nav button:hover { color: var(--lg-ink); border-color: var(--lg-line-2); }
.ledger .scheduler-lane-nav button.is-active { color: var(--accent); border-color: var(--accent); background: none; }
.ledger .scheduler-column { border: 1px solid var(--lg-line); background: var(--lg-bg); border-radius: 0; }
.ledger .scheduler-column-header { border-bottom: 1px solid var(--lg-line); }
.ledger .scheduler-column-header h2 { font-size: 11px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; }
.ledger .scheduler-count { color: var(--accent); background: none; border: 0; font-size: 11px; }
.ledger .scheduler-card { border: 0; border-radius: 0; background: var(--lg-panel); box-shadow: none; transition: background 0.14s ease; }
.ledger .scheduler-card:hover { background: var(--lg-blk); }
.ledger .scheduler-card.is-running { box-shadow: inset 2px 0 0 var(--accent); }
.ledger .scheduler-card.is-failed { box-shadow: inset 2px 0 0 var(--lg-danger); }
.ledger .scheduler-card.is-completed { box-shadow: inset 2px 0 0 var(--lg-line-2); }
.ledger .scheduler-card-status { font-size: 9.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--lg-muted); }
.ledger .scheduler-card-prompt { font-size: 12px; line-height: 1.5; color: var(--lg-ink); }
.ledger .scheduler-card a, .ledger .scheduler-card button { border: 0; border-bottom: 1px solid transparent; border-radius: 0; background: none; padding: 0; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--lg-muted); }
.ledger .scheduler-card a:hover, .ledger .scheduler-card button:hover { color: var(--lg-ink); border-bottom-color: var(--lg-ink); background: none; }
.ledger .scheduler-add { border: 1px solid var(--lg-line); border-radius: 0; background: none; color: var(--lg-muted); font-size: 14px; }
.ledger .scheduler-add:hover { color: #000; background: var(--accent); border-color: var(--accent); }
.ledger .scheduler-modal, .ledger .scheduler-move-modal { border-radius: 0; }
.ledger .panel-title { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; }
.ledger .action-button { border-radius: 0; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; }
.ledger .action-button-primary { background: var(--lg-ink); border-color: var(--lg-ink); color: #000; }
.ledger .action-button-primary:hover { background: #d9d9d9; border-color: #d9d9d9; }
.ledger .context-menu, .ledger .modal-panel { border-radius: 0; background: var(--lg-bg); }

/* ---------- Mobile ---------- */
@media (max-width: 900px) {
  .ledger {
    --lg-touch-size: 44px;
    /* Control + composer inner padding/border + outer padding. */
    --lg-mobile-bar-height: calc(var(--lg-touch-size) + 30px);
    --lg-safe-top: env(safe-area-inset-top, 0px);
    --lg-safe-right: env(safe-area-inset-right, 0px);
    --lg-safe-left: env(safe-area-inset-left, 0px);
  }
  .ledger .lg-shell { grid-template-columns: minmax(0, 1fr); }
  body.ledger[data-page] .lg-shell { grid-template-columns: minmax(0, 1fr); padding: var(--lg-safe-top) var(--lg-safe-right) 0 var(--lg-safe-left); gap: 0; }
  body.ledger[data-page="chat"] .lg-main { height: 100%; }
  .ledger .lg-side,
  body.ledger[data-page="chat"] .sidebar[data-admin-sidebar] {
    position: fixed;
    inset: var(--lg-safe-top) auto 0 var(--lg-safe-left);
    width: min(288px, 86vw);
    height: auto;
    display: flex;
    z-index: 90;
    transform: translateX(-100%);
    transition: transform 0.2s ease;
    border: 0;
    border-right: 1px solid var(--lg-line-2);
    padding: 0 0 env(safe-area-inset-bottom);
  }
  body.ledger.is-admin-sidebar-open .lg-side,
  body.ledger[data-page="chat"].is-admin-sidebar-open .sidebar[data-admin-sidebar] { transform: translateX(0); }
  .ledger .lg-side-close { display: inline-flex; }
  .ledger .lg-scrim {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 85;
    background: rgba(0, 0, 0, 0.62);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
  }
  body.ledger.is-admin-sidebar-open .lg-scrim { opacity: 1; pointer-events: auto; }
  .ledger .lg-burger { display: inline-flex; }
  .ledger .lg-icon,
  .ledger .lg-rt { width: var(--lg-touch-size); height: var(--lg-touch-size); flex: 0 0 var(--lg-touch-size); }
  .ledger .lg-brand,
  .ledger[data-page="chat"] .lg-brand,
  .ledger .lg-pagebar,
  .ledger .lg-head { height: var(--lg-mobile-bar-height); min-height: var(--lg-mobile-bar-height); flex: 0 0 var(--lg-mobile-bar-height); padding: 0 15px; gap: 8px; }

  .ledger .lg-head-main { flex-direction: column; align-items: flex-start; gap: 1px; }
  .ledger .lg-title { max-width: 100%; font-size: 11.5px; }
  .ledger .lg-model { max-width: 100%; }
  .ledger .lg-model-trigger { height: var(--lg-touch-size); padding: 0 10px; gap: 5px; font-size: 10.5px; }
  .ledger .lg-model-name { max-width: 170px; }
  .ledger .lg-model-part { display: none; }
  .ledger .lg-model-menu { position: fixed; top: calc(var(--lg-safe-top) + var(--lg-mobile-bar-height) + 6px); left: calc(var(--lg-safe-left) + 8px); right: calc(var(--lg-safe-right) + 8px); width: auto; max-width: none; }
  .ledger .lg-model-menu select { height: var(--lg-touch-size); }
  .ledger .lg-gauge { height: var(--lg-touch-size); padding: 0 8px; gap: 6px; }
  .ledger .lg-gauge-track { width: 36px; }
  .ledger .lg-gauge-pct { min-width: 30px; font-size: 10.5px; }
  .ledger .lg-gauge-pop { position: fixed; top: calc(var(--lg-safe-top) + var(--lg-mobile-bar-height) + 6px); left: calc(var(--lg-safe-left) + 8px); right: calc(var(--lg-safe-right) + 8px); width: auto; }
  .ledger .lg-chat-status { padding-inline: 15px; }

  .ledger .mini-message { padding: 14px 16px; }
  .ledger .message-body, .ledger .message-body pre, .ledger .message-body-user pre, .ledger .markdown-output { font-size: 13.5px; }
  .ledger .message-work > [data-mini-trace],
  .ledger .message-work > [data-orchestration-trace],
  .ledger .message-work > [data-work-legacy] { padding-left: 8px; }
  .ledger .stream-panel .markdown-output, .ledger .tool-call-body, .ledger .stage-block-note { margin-left: 8px; padding: 8px 10px; }

  .ledger .lg-plan-bar { padding: 0 12px; }
  .ledger .lg-composer { padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); }
  .ledger[data-page="chat"] .lg-pop { left: 8px; width: calc(100% - 16px); }
  .ledger[data-page="chat"] .lg-pop[data-runtime-popover="tools"] { left: 8px; }
  .ledger .lg-send { height: var(--lg-touch-size); width: var(--lg-touch-size); min-width: var(--lg-touch-size); flex-basis: var(--lg-touch-size); }
  .ledger .lg-compose-row textarea { min-height: var(--lg-touch-size); padding-block: 12px; font-size: 16px; }
  .ledger .lg-side-actions .lg-blk,
  .ledger .lg-side-foot [data-install-app],
  .ledger .lg-side-foot .lg-notify { min-height: var(--lg-touch-size); }
  .ledger .content-shell { padding: 10px; }
}

/* ---------- v2 round 3: side panel, collapse, header, bottom stack ---------- */
.ledger .lg-side-close { display: inline-flex; }
.ledger .lg-side-foot { padding: 10px 12px; border-top: 1px solid var(--lg-line); }
.ledger .lg-side-foot .lg-notify { background: none; border-color: transparent; color: var(--lg-muted); }
.ledger .lg-side-foot .lg-notify:hover { background: var(--lg-panel); color: var(--lg-ink); }
.ledger .lg-chat-list { border-top: 0; }
body.ledger.is-lg-side-collapsed .lg-shell { grid-template-columns: minmax(0, 1fr); }
body.ledger[data-page="chat"].is-lg-side-collapsed .lg-shell { grid-template-columns: minmax(0, 1fr); }
body.ledger.is-lg-side-collapsed .lg-side { display: none; }
body.ledger.is-lg-side-collapsed .lg-burger { display: inline-flex; }
.ledger .lg-head-main { gap: 0; }
.ledger .lg-plan-details .plan-scroll { padding: 8px 16px 12px; }
.ledger .plan-step-meta, .ledger .plan-tag-memory { display: none; }
.ledger .lg-compose-row .lg-rt:first-child { margin-right: 2px; }
@media (max-width: 900px) {
  body.ledger.is-lg-side-collapsed .lg-side { display: flex; }
}
.ledger .plan-step-placeholder .plan-step-status { display: none; }
.ledger .plan-step-placeholder { padding-left: 0; }
.ledger .plan-step-placeholder::before { display: none; }