._settings_b28n3_1 {
  --settings-col: 560px;
  display: grid;
  grid-template-rows: auto 1fr;
  min-height: 0;
  background: var(--bg);
}

/* The border spans the full width; its contents sit in the centred column. */
._head_b28n3_10 {
  padding: 14px 18px 12px;
  border-bottom: 1px solid var(--bd);
}

._headInner_b28n3_15 {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  max-width: var(--settings-col);
  margin: 0 auto;
}

._head_b28n3_10 h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.02em;
}

._close_b28n3_31 {
  margin-left: auto;
  width: 24px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: var(--r-sm);
  color: var(--tx-3);
}

._close_b28n3_31:hover {
  background: var(--s3);
  color: var(--tx);
}

._pane_b28n3_46 {
  overflow-y: auto;
  padding: 16px 18px 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
  max-width: var(--settings-col);
  margin: 0 auto;
}

._section_b28n3_57 {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tx-3);
  padding-bottom: 7px;
  border-bottom: 1px solid var(--bd);
}

._sectionHint_b28n3_67 {
  margin-left: 8px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--tx-3);
  opacity: 0.8;
}

/* ---------- instance pool ---------- */
._pool_b28n3_77 {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

._slot_b28n3_83 {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 11px;
  border-radius: var(--r-md);
  background: var(--s2);
  border: 1px solid var(--bd);
}

._slotDot_b28n3_93 {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mute);
  flex: none;
}

._slotDot_b28n3_93[data-state='ready'] {
  background: var(--ok);
}

._slotDot_b28n3_93[data-state='failed'] {
  background: var(--err);
}

._slotDot_b28n3_93[data-state='preparing'],
._slotBody_b28n3_110 {
  min-width: 0;
  flex: 1;
}

._slotBranch_b28n3_115 {
  font-family: var(--font-mono);
  font-size: 11.5px;
  color: var(--tx);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._slotMeta_b28n3_124 {
  font-size: 10.5px;
  color: var(--tx-3);
  margin-top: 2px;
}

._slotRemove_b28n3_130 {
  height: 24px;
  padding: 0 10px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  color: var(--tx-2);
  font-size: 11px;
  font-weight: 550;
  flex: none;
}

._slotRemove_b28n3_130:hover:not(:disabled) {
  border-color: var(--err);
  color: var(--err);
}

._slotRemove_b28n3_130:disabled {
  opacity: 0.4;
  cursor: default;
}

._add_b28n3_151 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  height: 30px;
  border-radius: var(--r-sm);
  border: 1px dashed var(--bd-3);
  color: var(--tx-2);
  font-size: 11.5px;
  font-weight: 550;
  transition:
    background var(--dur),
    color var(--dur);
}

._add_b28n3_151:hover {
  background: var(--s2);
  color: var(--tx);
}

._field_b28n3_172 {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

._field_b28n3_172 > label {
  font-size: 11px;
  font-weight: 600;
  color: var(--tx-2);
  display: flex;
  align-items: center;
  gap: 6px;
}

._hint_b28n3_187 {
  font-size: 10.5px;
  color: var(--tx-3);
  font-weight: 400;
}

/* Same segmented control as app Settings, sized for this pane's fields. */
._seg_b28n3_194 {
  display: flex;
  padding: 2px;
  gap: 2px;
  background: var(--s3);
  border-radius: var(--r-sm);
}

._seg_b28n3_194 button {
  flex: 1;
  height: 24px;
  border-radius: 5px;
  font-size: 11.5px;
  font-weight: 500;
  color: var(--tx-3);
  transition:
    background var(--dur),
    color var(--dur);
}

._seg_b28n3_194 button:hover {
  color: var(--tx);
}

._seg_b28n3_194 button[data-on='true'] {
  background: var(--s1);
  color: var(--tx);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

._input_b28n3_225 {
  height: 30px;
  border: 1px solid var(--bd-2);
  border-radius: var(--r-sm);
  background: var(--s2);
  padding: 0 9px;
  font-size: 12.5px;
}

._input_b28n3_225:focus {
  outline: none;
  border-color: var(--accent-line);
  background: var(--s1);
}

._readonly_b28n3_240 {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border-radius: var(--r-sm);
  background: var(--s2);
  border: 1px solid var(--bd);
  color: var(--tx-3);
}

._path_b28n3_251 {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--tx-2);
  overflow-wrap: anywhere;
}

/* ---------- remove ---------- */
._remove_b28n3_259 {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 11px 12px;
  border-radius: var(--r-md);
  background: var(--s2);
  border: 1px solid var(--bd);
}

._removeTitle_b28n3_269 {
  font-size: 12px;
  font-weight: 550;
}

._removeSub_b28n3_274 {
  font-size: 10.5px;
  color: var(--tx-3);
  margin-top: 2px;
  line-height: 1.45;
}

._confirm_b28n3_281 {
  display: flex;
  gap: 6px;
  margin-left: auto;
}

._danger_b28n3_287 {
  margin-left: auto;
  height: 27px;
  padding: 0 13px;
  border-radius: var(--r-sm);
  border: 1px solid var(--err);
  background: transparent;
  color: var(--err);
  font-size: 11.5px;
  font-weight: 550;
  white-space: nowrap;
  flex: none;
}

._danger_b28n3_287:hover {
  background: var(--err-soft);
}

._confirm_b28n3_281 ._danger_b28n3_287 {
  margin-left: 0;
}

._ghost_b28n3_309 {
  height: 27px;
  padding: 0 13px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  background: var(--s1);
  color: var(--tx-2);
  font-size: 11.5px;
  font-weight: 550;
  white-space: nowrap;
}

._ghost_b28n3_309:hover {
  background: var(--s3);
  color: var(--tx);
}
._blank_14bkw_1 {
  display: grid;
  place-items: center;
  background: var(--page);
  min-height: 0;
}

._card_14bkw_8 {
  text-align: center;
  padding: 0 24px;
}

._mark_14bkw_13 {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--tx-3);
  opacity: 0.6;
  margin-bottom: 10px;
}

._line_14bkw_22 {
  margin: 0 0 18px;
  font-size: 12.5px;
  color: var(--tx-3);
}

._button_14bkw_28 {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 30px;
  padding: 0 15px;
  border-radius: var(--r-sm);
  background: var(--accent);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  transition: background var(--dur);
}

._button_14bkw_28:hover {
  background: var(--accent-hi);
}
/* Clawd, four states.

   Idle keeps the original treatment: one held pose, a slow breath, and eyes
   squashed to slits by transform. The other three cut between two poses, which
   keeps their edges crisp — a hard swap can't produce a half-pixel. */
._clawd_3xsrp_6 {
  overflow: visible;
  flex: none;
}

/* Every transform is measured against the element's own box, not the whole
   canvas. Without this the eyes scale about the middle of the viewBox and fly
   out of the head, and the breathing body anchors to the bottom of the canvas
   instead of its own base — lifting it clear of the legs. */
._clawd_3xsrp_6 * {
  transform-box: fill-box;
}

._torso_3xsrp_19,
._arm_3xsrp_20,
._leg_3xsrp_21 {
  fill: var(--clawd, #d97757);
}

._eye_3xsrp_25 {
  fill: #1b1b1b;
}

/* ---------------------------------------------------------------- idle --
   Asleep: eyes squashed to slits, a slow breath, and the sleep marks
   drifting up. Deliberately the quietest state — "nothing is happening"
   should not compete for attention. */
._clawd_3xsrp_6[data-status='idle'] ._body_3xsrp_33 {
  animation: _breathe_3xsrp_1 3.4s ease-in-out infinite;
  transform-origin: bottom;
}

._clawd_3xsrp_6[data-status='idle'] ._eye_3xsrp_25 {
  transform: translateY(0.7px) scaleY(0.25);
}

._zzz_3xsrp_42 rect {
  fill: var(--tx-3);
  opacity: 0;
}

._clawd_3xsrp_6[data-status='idle'] ._zzz_3xsrp_42 ._z1_3xsrp_47 {
  animation: _drift_3xsrp_1 3.4s ease-out infinite;
}

._clawd_3xsrp_6[data-status='idle'] ._zzz_3xsrp_42 ._z2_3xsrp_51 {
  animation: _drift_3xsrp_1 3.4s ease-out infinite 0.7s;
}

@keyframes _breathe_3xsrp_1 {
  0%,
  100% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(1.05);
  }
}

@keyframes _drift_3xsrp_1 {
  0% {
    opacity: 0;
    transform: translate(0, 2px);
  }
  30% {
    opacity: 0.7;
  }
  100% {
    opacity: 0;
    transform: translate(2px, -4px);
  }
}

/* ------------------------------------------------------- the other three --
   Only one frame is visible at a time. Each runs the same keyframes with a
   negative delay of its share of the cycle, so they hand over in order and
   none is blank on the first paint.

   Two frames everywhere, so each is visible for half the cycle. */
._frame_3xsrp_85 {
  opacity: 0;
  animation-name: _flip_3xsrp_1;
  animation-iteration-count: infinite;
  animation-timing-function: steps(1, end);
  /* The fallback matters: a frame with no duration never animates, and since
     these start at opacity 0 that means it never appears at all. */
  animation-duration: var(--cycle, 0.5s);
}

/* Frame 2 runs the same keyframes half a cycle behind, so it takes over
   exactly as frame 1 hides. */
._frame_3xsrp_85[data-frame='1'] {
  animation-delay: calc(var(--cycle, 0.5s) * -0.5);
}

@keyframes _flip_3xsrp_1 {
  0%,
  49.999% {
    opacity: 1;
  }
  50%,
  100% {
    opacity: 0;
  }
}

/* -- working: quick enough to read as a walk. */
._clawd_3xsrp_6[data-status='working'] {
  --cycle: 0.5s;
}

/* -- waiting: the state that costs you money while it sits there. */
._clawd_3xsrp_6[data-status='waiting'] {
  --cycle: 0.86s;
}

/* -- error: slow enough to read as "stopped" rather than "busy". */
._clawd_3xsrp_6[data-status='error'] {
  --cycle: 1.9s;
}

._clawd_3xsrp_6[data-status='error'] ._torso_3xsrp_19,
._clawd_3xsrp_6[data-status='error'] ._arm_3xsrp_20,
._clawd_3xsrp_6[data-status='error'] ._leg_3xsrp_21 {
  fill: var(--err);
}

/* Posture and colour still carry the state without the movement. */
@media (prefers-reduced-motion: reduce) {
  ._clawd_3xsrp_6 ._frame_3xsrp_85,
  ._clawd_3xsrp_6 ._body_3xsrp_33,
  ._clawd_3xsrp_6 ._zzz_3xsrp_42 rect {
    animation: none;
  }

  ._clawd_3xsrp_6 ._frame_3xsrp_85 {
    opacity: 0;
  }

  ._clawd_3xsrp_6 ._frame_3xsrp_85[data-frame='0'] {
    opacity: 1;
  }
}
._card_1fwfu_1 {
  border: 1px solid var(--bd-2);
  border-radius: var(--r-md);
  background: var(--s2);
  overflow: hidden;
}

._card_1fwfu_1[data-kind='question'] {
  border-color: var(--accent-line);
}

._card_1fwfu_1[data-resolved='true'] {
  border-color: var(--bd);
  background: var(--s1);
  opacity: 0.85;
}

/* Just arrived while you were looking at the list. */
._card_1fwfu_1[data-new='true'] {
  animation: _arrive_1fwfu_1 1.6s ease-out;
}

@keyframes _arrive_1fwfu_1 {
  0%,
  40% {
    box-shadow: 0 0 0 2px var(--accent-line);
  }
  100% {
    box-shadow: 0 0 0 2px transparent;
  }
}

/* ---------- which chat ---------- */
._from_1fwfu_34 {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 6px 11px;
  border-bottom: 1px solid var(--bd);
  background: var(--s1);
  text-align: left;
  font-size: 11px;
  transition: background var(--dur);
}

._from_1fwfu_34:not(:disabled):hover {
  background: var(--s3);
}

._from_1fwfu_34:disabled {
  cursor: default;
}

._fromName_1fwfu_55 {
  color: var(--tx-2);
  font-weight: 550;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

._fromGo_1fwfu_64 {
  margin-left: auto;
  color: var(--accent-hi);
  font-size: 10.5px;
  font-weight: 600;
  white-space: nowrap;
  flex: none;
}

/* ---------- head ---------- */
._head_1fwfu_74 {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
  border-bottom: 1px solid var(--bd);
  background: var(--warn-soft);
  font-size: 11.5px;
}

._card_1fwfu_1[data-kind='question'] ._head_1fwfu_74 {
  background: var(--accent-soft);
}

._card_1fwfu_1[data-resolved='true'] ._head_1fwfu_74 {
  background: var(--s2);
}

._title_1fwfu_92 {
  font-weight: 600;
}

._card_1fwfu_1[data-kind='question'] ._title_1fwfu_92 {
  color: var(--accent-hi);
}

._card_1fwfu_1[data-kind='permission'] ._title_1fwfu_92 {
  color: var(--warn);
}

._card_1fwfu_1[data-resolved='true'] ._title_1fwfu_92 {
  color: var(--tx-3);
  font-weight: 550;
}

._tool_1fwfu_109 {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--tx-2);
}

._outcome_1fwfu_115 {
  margin-left: auto;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--ok);
  white-space: nowrap;
}

._later_1fwfu_123 {
  margin-left: auto;
  font-size: 9.5px;
  font-weight: 650;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--tx-3);
  background: var(--s4);
  border-radius: 20px;
  padding: 1px 7px;
}

/* ---------- body ---------- */
._body_1fwfu_136 {
  padding: 11px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

._detail_1fwfu_143 {
  margin: 0;
  padding: 8px 9px;
  border-radius: var(--r-sm);
  background: var(--code-bg);
  border: 1px solid var(--bd);
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 1.5;
  color: var(--tx-2);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  max-height: 200px;
  overflow-y: auto;
}

._resolvedQuestions_1fwfu_159 {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

._resolvedQ_1fwfu_159 {
  font-size: 11.5px;
  color: var(--tx-3);
  line-height: 1.5;
}

/* ---------- questions ---------- */
._question_1fwfu_172 {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

._qHead_1fwfu_178 {
  display: flex;
  align-items: center;
  gap: 7px;
}

._chip_1fwfu_184 {
  padding: 1px 7px;
  border-radius: 20px;
  background: var(--s4);
  color: var(--tx-2);
  font-size: 9.5px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

._multi_1fwfu_195 {
  font-size: 10px;
  color: var(--tx-3);
}

._qText_1fwfu_200 {
  font-size: 12.5px;
  font-weight: 550;
  line-height: 1.5;
}

._options_1fwfu_206 {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

._option_1fwfu_206 {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
  text-align: left;
  padding: 7px 9px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  background: var(--s1);
  transition:
    background var(--dur),
    border-color var(--dur);
}

._option_1fwfu_206:hover {
  border-color: var(--bd-3);
  background: var(--s3);
}

._option_1fwfu_206[data-on='true'] {
  border-color: var(--accent);
  background: var(--accent-soft);
}

._optLabel_1fwfu_237 {
  font-size: 11.5px;
  font-weight: 600;
}

._optDesc_1fwfu_242 {
  font-size: 10.5px;
  color: var(--tx-3);
  line-height: 1.45;
}

._other_1fwfu_248 {
  height: 27px;
  border: 1px solid var(--bd-2);
  border-radius: var(--r-sm);
  background: var(--s1);
  padding: 0 9px;
  font-size: 11.5px;
}

._other_1fwfu_248:focus {
  outline: none;
  border-color: var(--accent-line);
}

/* ---------- actions ---------- */
._actions_1fwfu_263 {
  display: flex;
  gap: 7px;
  align-items: center;
}

._primary_1fwfu_269 {
  height: 27px;
  padding: 0 13px;
  border-radius: var(--r-sm);
  background: var(--accent);
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
  transition:
    background var(--dur),
    opacity var(--dur);
}

._primary_1fwfu_269:hover:not(:disabled) {
  background: var(--accent-hi);
}

._primary_1fwfu_269:disabled {
  opacity: 0.45;
  cursor: default;
}

._ghost_1fwfu_291 {
  height: 27px;
  padding: 0 13px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  background: var(--s1);
  color: var(--tx-2);
  font-size: 11.5px;
  font-weight: 550;
  transition:
    background var(--dur),
    color var(--dur),
    border-color var(--dur);
}

._ghost_1fwfu_291:hover {
  border-color: var(--err);
  color: var(--err);
}
/* Assistant markdown. Uses the same code tokens as the diff viewer so a
   snippet in the conversation and the same code in Review look identical. */
._md_1q7p1_3 {
  font-size: 13px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

/* The thread already spaces messages apart; only *internal* gaps belong here,
   so the first and last block sit flush with the row. */
._md_1q7p1_3 > :first-child {
  margin-top: 0;
}

._md_1q7p1_3 > :last-child {
  margin-bottom: 0;
}

._p_1q7p1_19 {
  margin: 0 0 8px;
}

._strong_1q7p1_23 {
  font-weight: 650;
  color: var(--tx);
}

._em_1q7p1_28 {
  font-style: italic;
}

._h_1q7p1_32 {
  margin: 14px 0 6px;
  font-size: 13px;
  font-weight: 650;
  color: var(--tx);
}

._hSmall_1q7p1_39 {
  margin: 12px 0 5px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--tx-2);
}

._hr_1q7p1_46 {
  margin: 12px 0;
  border: 0;
  border-top: 1px solid var(--bd);
}

._list_1q7p1_52 {
  margin: 0 0 8px;
  padding-left: 20px;
}

._li_1q7p1_52 {
  margin: 2px 0;
}

/* Nested lists shouldn't inherit the outer list's bottom gap. */
._li_1q7p1_52 > ._list_1q7p1_52 {
  margin: 2px 0 0;
}

/* Inline code. Inside a `pre` the block's own styling wins — see below. */
._code_1q7p1_67 {
  font-family: var(--font-mono);
  font-size: 11.5px;
  background: var(--s3);
  border-radius: var(--r-xs);
  padding: 1px 4px;
}

._pre_1q7p1_75 {
  margin: 0 0 8px;
  padding: 9px 11px;
  background: var(--code-bg);
  border: 1px solid var(--bd);
  border-radius: var(--r-sm);
  overflow-x: auto;
}

/* A fenced block's body is a `code` element too, so the inline pill styling
   has to be undone rather than avoided. */
._pre_1q7p1_75 ._code_1q7p1_67 {
  background: none;
  border-radius: 0;
  padding: 0;
  font-size: 11.5px;
  line-height: 1.55;
  white-space: pre;
}

._tableWrap_1q7p1_95 {
  margin: 0 0 8px;
  overflow-x: auto;
}

._table_1q7p1_95 {
  border-collapse: collapse;
  font-size: 12px;
}

._th_1q7p1_105,
._td_1q7p1_106 {
  border: 1px solid var(--bd);
  padding: 4px 8px;
  text-align: left;
}

._th_1q7p1_105 {
  background: var(--s2);
  font-weight: 600;
  color: var(--tx);
  white-space: nowrap;
}

._link_1q7p1_119 {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Shiki writes both palettes into one render as CSS variables, so switching
   appearance never re-highlights — it just reads the other variable. */
._shiki_1q7p1_127 .shiki,
._shiki_1q7p1_127 .shiki span {
  color: var(--shiki-light);
  background: transparent !important;
}

[data-theme='dark'] ._shiki_1q7p1_127 .shiki,
[data-theme='dark'] ._shiki_1q7p1_127 .shiki span {
  color: var(--shiki-dark);
}

._shiki_1q7p1_127 pre.shiki {
  margin: 0;
  padding: 0;
  background: transparent !important;
  font-family: var(--font-mono);
  font-size: 11.5px;
  line-height: 1.55;
  overflow-x: auto;
}

._shiki_1q7p1_127 code {
  font-family: var(--font-mono);
}
/* Rows of a conversation. Owned here rather than by the chat, because the
   History screen renders the same rows for a chat that is no longer running —
   two copies of this would be two conversations that slowly stopped matching. */

._thread_sisku_5 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px 20px 24px;
}

._message_sisku_12[data-role='user'] {
  align-self: flex-start;
  max-width: 100%;
  padding: 9px 12px;
  border-radius: var(--r-md);
  background: var(--s3);
  border: 1px solid var(--bd-2);
}

._text_sisku_21 {
  font-size: 13px;
  line-height: 1.6;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

._message_sisku_12[data-role='assistant'] ._text_sisku_21 {
  color: var(--tx);
}

/* ---------- tool calls ---------- */
._tool_sisku_33 {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 5px 10px;
  border-radius: var(--r-sm);
  background: var(--s2);
  border: 1px solid var(--bd);
  font-size: 11px;
  min-width: 0;
}

._toolName_sisku_45 {
  font-weight: 650;
  color: var(--accent-hi);
  flex: none;
}

._toolDetail_sisku_51 {
  font-family: var(--font-mono);
  color: var(--tx-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._notice_sisku_59 {
  padding: 7px 10px;
  border-radius: var(--r-sm);
  font-size: 11.5px;
  line-height: 1.5;
}

._notice_sisku_59[data-tone='error'] {
  background: var(--err-soft);
  color: var(--err);
}

._notice_sisku_59[data-tone='warn'] {
  background: var(--warn-soft);
  color: var(--warn);
}

._notice_sisku_59[data-tone='info'] {
  background: var(--s2);
  color: var(--tx-2);
}

/* Inline attention request — narrower than the thread so it reads as an
   interjection rather than a message. */
._attention_sisku_83 {
  max-width: 460px;
}

._compacted_sisku_87 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 4px 0;
  font-size: 10.5px;
  color: var(--tx-3);
  white-space: nowrap;
}

._compacted_sisku_87::before,
._compacted_sisku_87::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--bd);
}
/* Flex column, not a fixed grid template: the auth warning row is conditional,
   and a fixed template made the composer inherit the 1fr row when absent. */
._main_1ewzl_3 {
  /* Fills the column below the tab strip. Required because this is a flex item
     now — as a grid item it stretched by default, and without it an empty
     transcript collapses the section and lifts the composer to the top. */
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  background: var(--bg);
}

@keyframes _pulse_1ewzl_1 {
  50% {
    opacity: 0.35;
  }
}

._dirty_1ewzl_21 span {
  flex: 1;
}

._dirty_1ewzl_21 code {
  font-family: var(--font-mono);
}

._dirtyCancel_1ewzl_29,
._authWarning_1ewzl_30 {
  padding: 7px 12px;
  border-bottom: 1px solid var(--bd);
  background: var(--warn-soft);
  color: var(--warn);
  font-size: 11px;
  line-height: 1.5;
}

/* ---------- transcript ---------- */
._scroll_1ewzl_40 {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}

._blank_1ewzl_46 {
  /* `flex: 1` was inert here — .scroll is a block container, so this sized to
     its content and sat at the top rather than centring. Filling the scroll
     area's height is what makes `justify-content` mean anything. */
  min-height: 100%;
  box-sizing: border-box;
  padding: 24px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  color: var(--tx-3);
  font-size: 12.5px;
}

/* ---------- composer ---------- */
._composer_1ewzl_63 {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  flex: none;
  padding: 10px 12px;
  border-top: 1px solid var(--bd);
  background: var(--s1);
}

/* What the agent may do without asking, in the composer row where a send
   button would sit. Bottom-aligned so it stays level with the last line as a
   long draft grows the input upward. */
._mode_1ewzl_76 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: none;
  height: 38px;
  padding: 0 10px;
  border-radius: var(--r-md);
  border: 1px solid var(--bd-2);
  background: var(--s2);
  color: var(--tx-2);
  font-size: 11.5px;
  font-family: var(--font-ui);
  cursor: pointer;
  transition:
    border-color var(--dur),
    color var(--dur);
}

._mode_1ewzl_76:hover {
  border-color: var(--bd-3);
  color: var(--tx);
}

._modeDot_1ewzl_100 {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--mute);
}

/* Colour carries the leash, so the mode is legible without reading the word:
   planning is inert, asking is the accent, edits are a warning, auto is live. */
._mode_1ewzl_76[data-mode='plan'] ._modeDot_1ewzl_100 {
  background: var(--info);
}

._mode_1ewzl_76[data-mode='default'] ._modeDot_1ewzl_100 {
  background: var(--accent);
}

._mode_1ewzl_76[data-mode='acceptEdits'] ._modeDot_1ewzl_100 {
  background: var(--warn);
}

._mode_1ewzl_76[data-mode='auto'] ._modeDot_1ewzl_100 {
  background: var(--ok);
}

/* No send button: Enter sends, and the placeholder says so. Bounded so a long
   draft scrolls instead of eating the transcript. */
._input_1ewzl_127 {
  flex: 1;
  resize: none;
  min-height: 38px;
  max-height: 180px;
  overflow-y: auto;
  padding: 8px 10px;
  border-radius: var(--r-md);
  border: 1px solid var(--bd-2);
  background: var(--s2);
  font-size: 12.5px;
  line-height: 1.5;
  font-family: var(--font-ui);
}

._input_1ewzl_127:focus {
  outline: none;
  border-color: var(--accent-line);
  background: var(--s1);
}

._blankLine_1ewzl_148 code {
  font-family: var(--font-mono);
  font-size: 11.5px;
  color: var(--tx-2);
}

/* Trails the conversation rather than sitting in a fixed corner. */
._mascot_1ewzl_155 {
  display: flex;
  padding: 2px 0 6px 2px;
}

/* What the worktree already holds, under the branch line. */
._blankCarry_1ewzl_161 {
  font-size: 11.5px;
  color: var(--tx-3);
}

/* A compaction boundary: the agent folded the earlier conversation into a
   summary to stay inside its context. Drawn as a hairline with a label rather
   than a card — there is nothing to act on, and it should read as a seam in
   the transcript, not as a message in it. */
/* Conversations open in one worktree — modelled on `.dt-tabs` in the
   prototype, which is the app's existing small-tab pattern. */
._tabs_8wtud_3 {
  display: flex;
  align-items: center;
  /* The surfaces now carry their own outline, so they no longer need a rule
     between them and the conversations to say they are a different kind of
     thing — the shape does it. A little more air instead. */
  gap: 4px;
  padding: 5px 8px;
  border-bottom: 1px solid var(--bd);
  background: var(--s1);
  overflow-x: auto;
  scrollbar-width: none;
  flex: none;
}

._tabs_8wtud_3::-webkit-scrollbar {
  display: none;
}

._tab_8wtud_3 {
  display: flex;
  align-items: center;
  height: 21px;
  border-radius: var(--r-md);
  border: 1px solid transparent;
  color: var(--tx-3);
  white-space: nowrap;
  transition:
    background var(--dur),
    color var(--dur);
}

._tab_8wtud_3:hover {
  background: var(--s2);
  color: var(--tx-2);
}

._tab_8wtud_3[data-on='true'] {
  background: var(--s3);
  border-color: var(--bd-2);
  color: var(--tx);
}

._label_8wtud_46 {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 21px;
  padding: 0 4px 0 8px;
  font-size: 11px;
  font-weight: 550;
  color: inherit;
  max-width: 240px;
}

._name_8wtud_58 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* The chat's own status, next to its name — this is what the conversation's
   header bar used to say. */
._state_8wtud_66 {
  font-size: 10px;
  font-weight: 500;
  color: var(--tx-3);
  white-space: nowrap;
}

._tab_8wtud_3[data-status='waiting'] ._state_8wtud_66 {
  color: var(--warn);
}

._tab_8wtud_3[data-status='working'] ._state_8wtud_66 {
  color: var(--accent);
}

._rename_8wtud_81 {
  height: 19px;
  margin: 0 2px 0 6px;
  padding: 0 5px;
  width: 120px;
  border-radius: var(--r-xs);
  border: 1px solid var(--accent);
  background: var(--s1);
  color: var(--tx);
  font-size: 11px;
  font-weight: 550;
}

/* Same status vocabulary as the sidebar, so a colour means one thing. */
._dot_8wtud_95 {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--tx-3);
  flex: none;
}

/* Idle means the chat is ready for you — green, as everywhere else in the app.
   The bare `.dot` grey is only for a state we don't have a colour for. */
._dot_8wtud_95[data-status='idle'] {
  background: var(--ok);
}

._dot_8wtud_95[data-status='working'] {
  background: var(--accent);
  animation: _pulse_8wtud_1 1.2s ease-in-out infinite;
}

/* Keyframes are scoped per CSS module, so the sidebar's copy isn't reachable
   here — same timing, declared locally. */
@keyframes _pulse_8wtud_1 {
  50% {
    opacity: 0.35;
  }
}

._dot_8wtud_95[data-status='waiting'] {
  background: var(--warn);
}

._dot_8wtud_95[data-status='error'] {
  background: var(--err);
}

._pending_8wtud_130 {
  min-width: 14px;
  height: 14px;
  padding: 0 4px;
  border-radius: 7px;
  background: var(--warn);
  color: #fff;
  font-size: 9.5px;
  font-weight: 700;
  display: grid;
  place-items: center;
  font-variant-numeric: tabular-nums;
}

._close_8wtud_144 {
  width: 17px;
  height: 17px;
  margin-right: 3px;
  display: grid;
  place-items: center;
  border-radius: var(--r-xs);
  color: var(--tx-3);
  flex: none;
  opacity: 0;
}

/* Revealed on hover or when the tab is current, so idle tabs stay quiet but
   the close affordance is never more than a pointer away. */
._tab_8wtud_3:hover ._close_8wtud_144,
._tab_8wtud_3[data-on='true'] ._close_8wtud_144 {
  opacity: 1;
}

._close_8wtud_144:hover {
  background: var(--s4);
  color: var(--tx);
}

._add_8wtud_168 {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 21px;
  padding: 0 8px;
  /* Same shape as its neighbours: it sits in the row with them, and an odd
     one out reads as something that got left behind. */
  border-radius: var(--r-md);
  border: 1px solid var(--bd-2);
  color: var(--tx-3);
  font-size: 11px;
  font-weight: 550;
  flex: none;
}

._add_8wtud_168:hover {
  background: var(--s3);
  color: var(--tx);
}

/* Branch and instance actions, pushed to the far end of the same bar. */
._right_8wtud_190 {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
  padding-left: 10px;
}

._branch_8wtud_198 {
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--tx-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 220px;
}

._action_8wtud_208 {
  height: 20px;
  padding: 0 8px;
  border-radius: var(--r-xs);
  border: 1px solid var(--bd-2);
  color: var(--tx-2);
  font-size: 10.5px;
  font-weight: 550;
  white-space: nowrap;
  flex: none;
}

._action_8wtud_208:hover {
  background: var(--s3);
  color: var(--tx);
}

/* Separates the worktree's fixed surfaces from its conversations. */
/* Matches `.tab` + `.label` exactly — same height, type and padding — so the
   two sit on one line rather than one pill standing taller than its
   neighbours. A chat pill's right padding is smaller because its close button
   supplies the rest; this has no close button, so it's even. */
._surface_8wtud_230 {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 21px;
  padding: 0 8px;
  /* Matches the composer's input and mode chip — the strip and the box you
     type into are the two things framing a conversation, and they should be
     cut the same way. */
  border-radius: var(--r-md);
  /* A resting fill rather than a bare glyph. Selection is then a change of
     fill on something already there, instead of a box appearing out of the
     background — and on a phone, where the labels are gone, it is the only
     thing giving an icon an edge to be tapped. */
  border: 1px solid var(--bd-2);
  background: var(--s2);
  color: var(--tx-3);
  font-size: 11px;
  font-weight: 550;
  white-space: nowrap;
  flex: none;
  transition:
    background var(--dur),
    border-color var(--dur),
    color var(--dur);
}

._surface_8wtud_230:hover {
  color: var(--tx-2);
  border-color: var(--bd-3);
  background: var(--s3);
}

/* No weight change on selection: `.tab` doesn't do it either, and a pill that
   grows bolder shifts the ones beside it. */
._surface_8wtud_230[data-on='true'] {
  background: var(--accent-soft);
  border-color: var(--accent-line);
  color: var(--accent-hi);
}

/* ---------------------------------------------------------------------------
   Narrow screens. The strip already scrolls sideways; what it needs is less to
   scroll. Same 820px as the shell.
   --------------------------------------------------------------------------- */
/* How many files changed, or commits unpushed — a qualifier on the label
   beside it, not a badge. Referenced by the strip since it was written and
   never defined, so it had been rendering as bare unstyled digits. */
._count_8wtud_278 {
  min-width: 14px;
  padding: 0 4px;
  border-radius: 7px;
  background: var(--s4);
  color: var(--tx-2);
  font-size: 9.5px;
  font-weight: 700;
  line-height: 14px;
  text-align: center;
}

._surface_8wtud_230[data-on='true'] ._count_8wtud_278 {
  background: var(--accent-soft);
  color: var(--accent-hi);
}

@media (max-width: 820px) {
  ._surfaceLabel_8wtud_296 {
    /* Kept for assistive tech; the icon and the tooltip carry it visually. */
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  ._surface_8wtud_230 {
    gap: 0;
  }

  /* The count goes with the label it was qualifying. On its own beside an
     icon it reads as a number about the icon rather than a file count — so
     the number goes and a dot takes over. You lose how many and keep the only
     part that makes you look: that there is something there. */
  ._surface_8wtud_230 ._count_8wtud_278 {
    display: none;
  }

  ._surface_8wtud_230[data-flag='true'] {
    position: relative;
  }

  ._surface_8wtud_230[data-flag='true']::after {
    content: '';
    position: absolute;
    top: 3px;
    right: 3px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent);
    /* Ringed in the strip's own background so it reads as sitting on the tab
       rather than as part of the glyph underneath it. */
    box-shadow: 0 0 0 2px var(--s1);
  }

  /* The branch is on the Ship tab and in the empty chat already; here it is
     the widest thing competing with the chat names for a phone's worth of room. */
  ._branch_8wtud_198 {
    display: none;
  }

  ._tabs_8wtud_3 {
    /* Momentum scrolling, and a tap target that clears the 44px guidance. */
    -webkit-overflow-scrolling: touch;
    padding: 7px 8px;
  }

  ._tab_8wtud_3,
  ._surface_8wtud_230,
  ._add_8wtud_168 {
    height: 28px;
  }

  ._surface_8wtud_230 {
    padding: 0 9px;
  }
}
/* The shell fills the conversation column when its tab is selected. */
._wrap_1aust_2 {
  flex: 1;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  background: var(--bg);
  /* Room for the terminal's own edge, so glyphs don't touch the panel border. */
  padding: 6px 0 0 8px;
}

/* Hidden rather than unmounted: the xterm instance keeps its viewport and
   scroll position, and re-attaching would mean replaying the whole buffer for
   a tab switch. `display: none` is safe here because nothing else depends on
   this element's box — the visibility effect re-fits when it comes back. */
._wrap_1aust_2[data-visible='false'] {
  display: none;
}

._host_1aust_21 {
  flex: 1;
  min-height: 0;
  min-width: 0;
}

/* xterm sizes its own canvas; this keeps its scrollbar in the app's idiom. */
._host_1aust_21 .xterm-viewport {
  scrollbar-width: thin;
  background: transparent !important;
}

._host_1aust_21 .xterm-viewport::-webkit-scrollbar {
  width: 9px;
}

._host_1aust_21 .xterm-viewport::-webkit-scrollbar-thumb {
  background: var(--bd-2);
  border-radius: 5px;
}

._ended_1aust_42 {
  flex: none;
  padding: 6px 10px;
  border-top: 1px solid var(--bd);
  font-size: 11px;
  color: var(--tx-3);
}
/**
 * Copyright (c) 2014 The xterm.js authors. All rights reserved.
 * Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)
 * https://github.com/chjj/term.js
 * @license MIT
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 * THE SOFTWARE.
 *
 * Originally forked from (with the author's permission):
 *   Fabrice Bellard's javascript vt100 for jslinux:
 *   http://bellard.org/jslinux/
 *   Copyright (c) 2011 Fabrice Bellard
 *   The original design remains. The terminal itself
 *   has been extended to include xterm CSI codes, among
 *   other features.
 */

/**
 *  Default styles for xterm.js
 */

.xterm {
    cursor: text;
    position: relative;
    user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
}

.xterm.focus,
.xterm:focus {
    outline: none;
}

.xterm .xterm-helpers {
    position: absolute;
    top: 0;
    /**
     * The z-index of the helpers must be higher than the canvases in order for
     * IMEs to appear on top.
     */
    z-index: 5;
}

.xterm .xterm-helper-textarea {
    padding: 0;
    border: 0;
    margin: 0;
    /* Move textarea out of the screen to the far left, so that the cursor is not visible */
    position: absolute;
    opacity: 0;
    left: -9999em;
    top: 0;
    width: 0;
    height: 0;
    z-index: -5;
    /** Prevent wrapping so the IME appears against the textarea at the correct position */
    white-space: nowrap;
    overflow: hidden;
    resize: none;
}

.xterm .composition-view {
    /* TODO: Composition position got messed up somewhere */
    background: #000;
    color: #FFF;
    display: none;
    position: absolute;
    white-space: nowrap;
    z-index: 1;
}

.xterm .composition-view.active {
    display: block;
}

.xterm .xterm-viewport {
    /* On OS X this is required in order for the scroll bar to appear fully opaque */
    background-color: #000;
    overflow-y: scroll;
    cursor: default;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
}

.xterm .xterm-screen {
    position: relative;
}

.xterm .xterm-screen canvas {
    position: absolute;
    left: 0;
    top: 0;
}

.xterm-char-measure-element {
    display: inline-block;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: -9999em;
    line-height: normal;
}

.xterm.enable-mouse-events {
    /* When mouse events are enabled (eg. tmux), revert to the standard pointer cursor */
    cursor: default;
}

.xterm.xterm-cursor-pointer,
.xterm .xterm-cursor-pointer {
    cursor: pointer;
}

.xterm.column-select.focus {
    /* Column selection mode */
    cursor: crosshair;
}

.xterm .xterm-accessibility:not(.debug),
.xterm .xterm-message {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 10;
    color: transparent;
    pointer-events: none;
}

.xterm .xterm-accessibility-tree:not(.debug) *::selection {
  color: transparent;
}

.xterm .xterm-accessibility-tree {
  font-family: monospace;
  user-select: text;
  white-space: pre;
}

.xterm .xterm-accessibility-tree > div {
  transform-origin: left;
  width: fit-content;
}

.xterm .live-region {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.xterm-dim {
    /* Dim should not apply to background, so the opacity of the foreground color is applied
     * explicitly in the generated class and reset to 1 here */
    opacity: 1 !important;
}

.xterm-underline-1 { text-decoration: underline; }
.xterm-underline-2 { text-decoration: double underline; }
.xterm-underline-3 { text-decoration: wavy underline; }
.xterm-underline-4 { text-decoration: dotted underline; }
.xterm-underline-5 { text-decoration: dashed underline; }

.xterm-overline {
    text-decoration: overline;
}

.xterm-overline.xterm-underline-1 { text-decoration: overline underline; }
.xterm-overline.xterm-underline-2 { text-decoration: overline double underline; }
.xterm-overline.xterm-underline-3 { text-decoration: overline wavy underline; }
.xterm-overline.xterm-underline-4 { text-decoration: overline dotted underline; }
.xterm-overline.xterm-underline-5 { text-decoration: overline dashed underline; }

.xterm-strikethrough {
    text-decoration: line-through;
}

.xterm-screen .xterm-decoration-container .xterm-decoration {
	z-index: 6;
	position: absolute;
}

.xterm-screen .xterm-decoration-container .xterm-decoration.xterm-decoration-top-layer {
	z-index: 7;
}

.xterm-decoration-overview-ruler {
    z-index: 8;
    position: absolute;
    top: 0;
    right: 0;
    pointer-events: none;
}

.xterm-decoration-top {
    z-index: 2;
    position: relative;
}



/* Derived from vs/base/browser/ui/scrollbar/media/scrollbar.css */

/* xterm.js customization: Override xterm's cursor style */
.xterm .xterm-scrollable-element > .scrollbar {
    cursor: default;
}

/* Arrows */
.xterm .xterm-scrollable-element > .scrollbar > .scra {
	cursor: pointer;
	font-size: 11px !important;
}

.xterm .xterm-scrollable-element > .visible {
	opacity: 1;

	/* Background rule added for IE9 - to allow clicks on dom node */
	background:rgba(0,0,0,0);

	transition: opacity 100ms linear;
	/* In front of peek view */
	z-index: 11;
}
.xterm .xterm-scrollable-element > .invisible {
	opacity: 0;
	pointer-events: none;
}
.xterm .xterm-scrollable-element > .invisible.fade {
	transition: opacity 800ms linear;
}

/* Scrollable Content Inset Shadow */
.xterm .xterm-scrollable-element > .shadow {
	position: absolute;
	display: none;
}
.xterm .xterm-scrollable-element > .shadow.top {
	display: block;
	top: 0;
	left: 3px;
	height: 3px;
	width: 100%;
	box-shadow: var(--vscode-scrollbar-shadow, #000) 0 6px 6px -6px inset;
}
.xterm .xterm-scrollable-element > .shadow.left {
	display: block;
	top: 3px;
	left: 0;
	height: 100%;
	width: 3px;
	box-shadow: var(--vscode-scrollbar-shadow, #000) 6px 0 6px -6px inset;
}
.xterm .xterm-scrollable-element > .shadow.top-left-corner {
	display: block;
	top: 0;
	left: 0;
	height: 3px;
	width: 3px;
}
.xterm .xterm-scrollable-element > .shadow.top.left {
	box-shadow: var(--vscode-scrollbar-shadow, #000) 6px 0 6px -6px inset;
}
/* Mirrors `.flist` / `.stgsec` / `.frow` in prototype/orc.html. */
._list_12qkw_2 {
  overflow-y: auto;
  padding: 4px 7px 14px;
  min-height: 0;
}

._empty_12qkw_8 {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 14px 6px;
  font-size: 11.5px;
  color: var(--tx-3);
  line-height: 1.5;
}

._section_12qkw_18 {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 6px 5px;
}

._sectionLabel_12qkw_25 {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

._section_12qkw_18[data-tone='staged'] ._sectionLabel_12qkw_25 {
  color: var(--git-add);
}

._section_12qkw_18[data-tone='unstaged'] ._sectionLabel_12qkw_25 {
  color: var(--git-mod);
}

._sectionCount_12qkw_40 {
  font-size: 10px;
  color: var(--tx-3);
  font-variant-numeric: tabular-nums;
}

._file_12qkw_46 {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  width: 100%;
  padding: 6px 8px;
  border-radius: var(--r-sm);
  text-align: left;
  transition: background var(--dur);
}

._file_12qkw_46:hover {
  background: var(--s2);
}

._file_12qkw_46[data-on='true'] {
  background: var(--s3);
}

._kind_12qkw_66 {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  opacity: 0.85;
  text-align: center;
}

._kind_12qkw_66[data-status='M'] {
  color: var(--git-mod);
}

._kind_12qkw_66[data-status='A'] {
  color: var(--git-add);
}

._kind_12qkw_66[data-status='D'] {
  color: var(--git-del);
}

/* Clip the start of the path, not the filename. */
._path_12qkw_87 {
  font-family: var(--font-mono);
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  direction: rtl;
  unicode-bidi: plaintext;
  text-align: left;
  min-width: 0;
}

._counts_12qkw_99 {
  display: flex;
  gap: 5px;
  font-family: var(--font-mono);
  font-size: 10px;
  flex: none;
}

._plus_12qkw_107 {
  color: var(--git-add);
}

._minus_12qkw_111 {
  color: var(--git-del);
}

._binary_12qkw_115 {
  color: var(--tx-3);
}

/* The changed set was capped. Said out loud rather than silently trimmed —
   a short list that looks complete is worse than no list. */
._capped_12qkw_121 {
  padding: 8px 10px;
  font-size: 10.5px;
  line-height: 1.5;
  color: var(--warn);
  background: var(--warn-soft);
  border-top: 1px solid var(--bd);
}

/* A row is a select button plus its actions, so the actions can't live inside
   the button itself. */
._row_12qkw_132 {
  display: flex;
  align-items: center;
  border-radius: var(--r-xs);
}

._row_12qkw_132:hover {
  background: var(--s2);
}

._row_12qkw_132[data-on='true'] {
  background: var(--s3);
}

._actions_12qkw_146,
._confirm_12qkw_147 {
  display: flex;
  align-items: center;
  gap: 1px;
  padding-right: 4px;
  flex: none;
}

/* Quiet until you're on the row — the file list is for reading first. */
._actions_12qkw_146 {
  opacity: 0;
}

._row_12qkw_132:hover ._actions_12qkw_146,
._row_12qkw_132[data-on='true'] ._actions_12qkw_146 {
  opacity: 1;
}

._action_12qkw_146 {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: var(--r-xs);
  color: var(--tx-3);
}

._action_12qkw_146:hover {
  background: var(--s4);
  color: var(--tx);
}

._danger_12qkw_179:hover {
  background: var(--err-soft, var(--s4));
  color: var(--err);
}

._confirmNo_12qkw_184,
._confirmYes_12qkw_185 {
  height: 19px;
  padding: 0 7px;
  border-radius: var(--r-xs);
  font-size: 10.5px;
  font-weight: 550;
}

._confirmNo_12qkw_184 {
  color: var(--tx-2);
  border: 1px solid var(--bd-2);
}

._confirmYes_12qkw_185 {
  background: var(--err);
  color: #fff;
}

._stageAll_12qkw_203 {
  margin-left: auto;
  height: 18px;
  padding: 0 7px;
  border-radius: var(--r-xs);
  font-size: 10px;
  font-weight: 600;
  color: var(--tx-3);
}

._stageAll_12qkw_203:hover {
  background: var(--s3);
  color: var(--tx);
}
/* Unified diff rendering — `.dwrap` in prototype/orc.html. */
._diff_gwijq_2 {
  min-height: 0;
  background: var(--code-bg);
}

._placeholder_gwijq_7 {
  padding: 24px;
  font-size: 12px;
  color: var(--tx-3);
}

._fileHead_gwijq_13 {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--s2);
  border-bottom: 1px solid var(--bd);
  padding: 7px 12px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--tx);
}

._hunkHead_gwijq_25 {
  padding: 3px 12px;
  background: var(--s2);
  color: var(--tx-3);
  font-family: var(--font-mono);
  font-size: 10.5px;
  border-top: 1px solid var(--bd);
}

._line_gwijq_34 {
  display: grid;
  grid-template-columns: 44px 44px 14px minmax(0, 1fr);
  font-family: var(--font-mono);
  font-size: 11.5px;
  line-height: 1.65;
}

._line_gwijq_34[data-kind='add'] {
  background: var(--add);
}

._line_gwijq_34[data-kind='del'] {
  background: var(--del);
}

._gutter_gwijq_50 {
  text-align: right;
  padding-right: 10px;
  color: var(--tx-3);
  opacity: 0.65;
  user-select: none;
  font-variant-numeric: tabular-nums;
}

._sign_gwijq_59 {
  text-align: center;
  user-select: none;
  color: var(--tx-3);
}

._line_gwijq_34[data-kind='add'] ._sign_gwijq_59 {
  color: var(--git-add);
}

._line_gwijq_34[data-kind='del'] ._sign_gwijq_59 {
  color: var(--git-del);
}

._code_gwijq_73 {
  padding-right: 14px;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  -webkit-user-select: text;
  user-select: text;
}

._truncated_gwijq_81 {
  padding: 10px 12px;
  font-size: 11px;
  color: var(--warn);
  background: var(--warn-soft);
}

/* Side-by-side. Each row is a grid of two halves, and each half its own
   gutter+code grid, so a line that wraps on one side grows the whole row and
   the two sides stay aligned without any scroll syncing. */
._srow_gwijq_91 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  font-family: var(--font-mono);
  font-size: 11.5px;
  line-height: 1.65;
}

._half_gwijq_99 {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  min-width: 0;
}

._half_gwijq_99[data-side='new'] {
  border-left: 1px solid var(--bd);
}

._half_gwijq_99[data-kind='del'] {
  background: var(--del);
}

._half_gwijq_99[data-kind='add'] {
  background: var(--add);
}

/* Filler opposite an insertion or a deletion — deliberately inert, so the eye
   reads it as "nothing here" rather than as an unchanged line. */
._half_gwijq_99[data-kind='empty'] {
  background: var(--s2);
}

/* The line the editor button would jump to. Marked on both layouts, since the
   button's target has to be visible wherever you picked it. */
._line_gwijq_34[data-active='true'],
._srow_gwijq_91[data-active='true'] {
  box-shadow: inset 2px 0 0 var(--accent);
}

._line_gwijq_34,
._srow_gwijq_91 {
  cursor: default;
}
/* The commit composer. Mounted under the staged files in Review and on the
   Ship tab's commit step; the styles travel with the component. */
._commit_12ofb_3 {
  border-top: 1px solid var(--bd);
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: none;
}

._message_12ofb_12 {
  width: 100%;
  resize: vertical;
  padding: 6px 8px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  background: var(--s1);
  color: var(--tx);
  font-size: 11.5px;
  line-height: 1.5;
  font-family: inherit;
}

._message_12ofb_12:focus {
  outline: none;
  border-color: var(--accent);
}

._row_12ofb_30 {
  display: flex;
  align-items: center;
  gap: 6px;
}

._reroll_12ofb_36 {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: var(--r-xs);
  border: 1px solid var(--bd-2);
  color: var(--tx-3);
  flex: none;
}

._reroll_12ofb_36:hover:not(:disabled) {
  background: var(--s3);
  color: var(--tx);
}

._reroll_12ofb_36:disabled {
  opacity: 0.5;
}

._go_12ofb_56 {
  flex: 1;
  height: 24px;
  border-radius: var(--r-xs);
  background: var(--accent);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
}

._go_12ofb_56:disabled {
  opacity: 0.45;
}
/* Mirrors `.stepper` / `.stg` / `.sdet` in prototype/orc.html. */
._ship_3xtqo_2 {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow-y: auto;
}

/* ------------------------------------------------------------- the steps -- */
._stepper_3xtqo_1 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  margin: 0;
  padding: 11px 8px 9px;
  list-style: none;
  flex: none;
}

._slot_3xtqo_20 {
  display: flex;
  min-width: 0;
}

._step_3xtqo_1 {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 5px 3px;
  border-radius: 8px;
}

._step_3xtqo_1:hover,
._step_3xtqo_1[data-on='true'] {
  background: var(--s3);
}

/* The rail between nodes, drawn leftward from each step's own centre so it
   always lands on its neighbour whatever the column width turns out to be. */
._step_3xtqo_1::before {
  content: '';
  position: absolute;
  top: 14px;
  right: 50%;
  left: -50%;
  height: 1.5px;
  background: var(--bd-2);
  z-index: 0;
}

._slot_3xtqo_20:first-child ._step_3xtqo_1::before {
  display: none;
}

._step_3xtqo_1[data-state='done']::before {
  background: var(--ok);
}

._node_3xtqo_63 {
  width: 19px;
  height: 19px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--s4);
  color: var(--tx-3);
  border: 1.5px solid var(--bd-2);
  position: relative;
  z-index: 1;
}

._step_3xtqo_1[data-state='done'] ._node_3xtqo_63 {
  background: var(--ok);
  border-color: var(--ok);
  color: #08130a;
}

._step_3xtqo_1[data-state='now'] ._node_3xtqo_63 {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  box-shadow: 0 0 0 3px var(--accent-soft);
}

._stepLabel_3xtqo_89 {
  font-size: 10.5px;
  font-weight: 600;
  color: var(--tx-2);
  white-space: nowrap;
}

._step_3xtqo_1[data-on='true'] ._stepLabel_3xtqo_89 {
  color: var(--tx);
}

._stepNote_3xtqo_100 {
  font-size: 9.5px;
  color: var(--tx-3);
  text-align: center;
  line-height: 1.25;
  /* One line, ellipsised: notes vary in length and a wrapping one would shift
     every other node's label down with it. */
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ----------------------------------------------------- the open step's pane -- */
._detail_3xtqo_114 {
  border-top: 1px solid var(--bd);
  background: var(--s1);
  padding: 10px 11px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
  min-height: 0;
}

._head_3xtqo_125 {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tx-3);
}

._headRight_3xtqo_136 {
  margin-left: auto;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
  font-size: 10.5px;
  font-family: var(--font-mono);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

._line_3xtqo_149 {
  margin: 0;
  font-size: 11.5px;
  line-height: 1.55;
  color: var(--tx-2);
}

._line_3xtqo_149 code {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--tx);
}

._acts_3xtqo_162 {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

._btn_3xtqo_168 {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px;
  border: 1px solid var(--bd-2);
  border-radius: var(--r-xs);
  font-size: 11.5px;
  color: var(--tx);
  text-decoration: none;
}

._btn_3xtqo_168:hover {
  background: var(--s3);
  border-color: var(--accent);
}

._go_3xtqo_186 {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 12px;
  border-radius: var(--r-xs);
  background: var(--accent);
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
}

._go_3xtqo_186:disabled {
  opacity: 0.5;
}

/* ------------------------------------------------------------- commits -- */
._commits_3xtqo_204 {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  min-height: 0;
}

._commit_3xtqo_204 {
  display: flex;
  align-items: baseline;
  gap: 9px;
  padding: 5px 0;
  font-size: 11px;
  min-width: 0;
  border-bottom: 1px solid var(--bd);
}

._commit_3xtqo_204:last-child {
  border-bottom: 0;
}

._sha_3xtqo_228 {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--tx-3);
  flex: none;
}

._subject_3xtqo_235 {
  color: var(--tx-2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  /* The subject absorbs the spare width, so the date stays pinned right and a
     long subject truncates rather than pushing it off the row. */
  flex: 1;
  min-width: 0;
}

._when_3xtqo_246 {
  font-size: 10px;
  color: var(--tx-3);
  white-space: nowrap;
  flex: none;
}

/* ---------------------------------------------------------- push result --
   git narrates a push across half a dozen `remote:` lines. This says what it
   did in one, and keeps the narration behind a disclosure for when the summary
   isn't enough. */
._outcome_3xtqo_257 {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

._chk_3xtqo_263 {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11.5px;
  color: var(--tx-2);
}

._ok_3xtqo_271 {
  color: var(--ok);
  display: flex;
}

._bad_3xtqo_276 {
  color: var(--err);
  display: flex;
}

/* Pushed as far right as it goes: it's a confirmation you glance at, not part
   of the sentence. */
._remote_3xtqo_283 {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--tx-3);
}

._rawWrap_3xtqo_290 {
  font-size: 11px;
}

._rawToggle_3xtqo_294 {
  cursor: pointer;
  color: var(--tx-3);
  font-size: 10.5px;
  list-style: none;
}

._rawToggle_3xtqo_294::-webkit-details-marker {
  display: none;
}

._rawToggle_3xtqo_294::before {
  content: '▸ ';
}

._rawWrap_3xtqo_290[open] ._rawToggle_3xtqo_294::before {
  content: '▾ ';
}

._rawWrap_3xtqo_290[open] ._rawToggle_3xtqo_294 {
  margin-bottom: 6px;
}

/* git's own words, kept verbatim. */
._raw_3xtqo_290 {
  margin: 0;
  padding: 8px 10px;
  border-radius: var(--r-sm);
  background: var(--s2);
  border: 1px solid var(--bd);
  font-family: var(--font-mono);
  font-size: 10.5px;
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--tx-2);
}

._raw_3xtqo_290[data-bad='true'] {
  border-color: var(--err);
  color: var(--err);
}

/* Marks the odd one out in the commit list: work that arrived rather than work
   that was written here. */
._badge_3xtqo_339 {
  flex: none;
  padding: 0 5px;
  height: 14px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: var(--s4);
  color: var(--tx-3);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

._inlineSha_3xtqo_354 {
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--tx);
}

._right_3xtqo_360 {
  margin-left: auto;
  font-size: 10px;
  color: var(--tx-3);
}

/* ------------------------------------------------------------ pull requests --
   A found pull request is the answer this step exists for, so it's a card:
   tinted, bordered and clickable as a whole. As plain rows it read like more
   explanatory text and got lost among the caveats. */
._prs_3xtqo_370 {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 7px;
  overflow-y: auto;
  min-height: 0;
}

._prCard_3xtqo_381 {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border-radius: var(--r-sm);
  border: 1px solid var(--accent);
  background: var(--accent-soft);
  text-decoration: none;
  min-width: 0;
}

._prCard_3xtqo_381:hover {
  background: var(--s3);
}

._prIcon_3xtqo_397 {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  flex: none;
}

._prMain_3xtqo_408 {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  flex: 1;
}

._prTop_3xtqo_416 {
  display: flex;
  align-items: center;
  gap: 6px;
}

._prNum_3xtqo_422 {
  font-family: var(--font-mono);
  font-size: 12.5px;
  font-weight: 700;
  color: var(--accent-hi, var(--accent));
}

._prTitle_3xtqo_429 {
  font-size: 11.5px;
  color: var(--tx);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Where it merges to. The branch alone doesn't say that, and with several PRs
   open from one branch it's the only thing telling them apart. */
._prBase_3xtqo_439 {
  font-size: 10.5px;
  color: var(--tx-3);
  font-family: var(--font-mono);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

._prGo_3xtqo_448 {
  color: var(--tx-3);
  display: flex;
  flex: none;
}

._prCard_3xtqo_381:hover ._prGo_3xtqo_448 {
  color: var(--accent);
}

/* The limits of a partial match, once the card has already said the useful
   part. Quieter than a standalone message would be. */
._footnote_3xtqo_460 {
  margin: 0;
  font-size: 10.5px;
  line-height: 1.5;
  color: var(--tx-3);
}

._pill_3xtqo_467 {
  flex: none;
  padding: 0 6px;
  height: 15px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: var(--s4);
  color: var(--tx-3);
}

._pill_3xtqo_467[data-state='open'] {
  background: var(--ok-soft, rgba(74, 176, 108, 0.16));
  color: var(--ok);
}

._pill_3xtqo_467[data-state='merged'] {
  background: rgba(167, 139, 250, 0.16);
  color: #a78bfa;
}

._pill_3xtqo_467[data-state='closed'] {
  background: var(--err-soft);
  color: var(--err);
}

/* Opening a new pull request: source, target, go. */
._create_3xtqo_498 {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}

._createLine_3xtqo_505 {
  font-size: 11.5px;
  color: var(--tx-2);
}

._createLine_3xtqo_505 code {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--tx);
}

._select_3xtqo_516 {
  height: 26px;
  padding: 0 6px;
  border-radius: var(--r-xs);
  border: 1px solid var(--bd-2);
  background: var(--s2);
  color: var(--tx);
  font-family: var(--font-mono);
  font-size: 11px;
  max-width: 190px;
}

._select_3xtqo_516:focus {
  outline: none;
  border-color: var(--accent);
}

/* The create button is an anchor, so it needs the link reset too. */
._go_3xtqo_186 {
  text-decoration: none;
}
/* Review and Ship, as a surface rather than a side panel — so no left border
   and no background of its own; it fills the column like every other surface. */
._panel_1yo4f_3 {
  flex: 1;
  /* Flex, not fixed grid rows: the notice is conditional, so a three-row
     template puts the body in the wrong row whenever it's absent — squashing
     it to its content height and leaving the rest of the panel empty. */
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}

/* What this surface is, stated once. It no longer switches anything — the
   strip above does that — so it reads as a heading, not a control. */
._title_1yo4f_16 {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 4px;
  color: var(--tx-2);
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
}

._tabs_1yo4f_28 {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 0 8px;
  height: 34px;
  flex: none;
  border-bottom: 1px solid var(--bd);
  overflow-x: auto;
  scrollbar-width: none;
}

._tabs_1yo4f_28::-webkit-scrollbar {
  display: none;
}

._tab_1yo4f_28 {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 26px;
  padding: 0 10px;
  border-radius: var(--r-sm);
  color: var(--tx-3);
  font-size: 11.5px;
  font-weight: 550;
  white-space: nowrap;
  transition:
    background var(--dur),
    color var(--dur);
}

._tab_1yo4f_28:hover {
  color: var(--tx-2);
  background: var(--s2);
}

._tab_1yo4f_28[data-on='true'] {
  background: var(--s3);
  color: var(--tx);
  font-weight: 600;
}

/* Dimmer than the label: the icon aids scanning, it isn't the thing you read. */
._tab_1yo4f_28 svg {
  opacity: 0.7;
  flex: none;
}

._tab_1yo4f_28[data-on='true'] svg {
  opacity: 1;
}

._count_1yo4f_81 {
  min-width: 15px;
  height: 15px;
  padding: 0 4px;
  border-radius: 8px;
  background: var(--s4);
  color: var(--tx-2);
  font-size: 9.5px;
  font-weight: 700;
  display: grid;
  place-items: center;
  font-variant-numeric: tabular-nums;
}

._right_1yo4f_95 {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 2px;
}

._icon_1yo4f_102 {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: var(--r-xs);
  color: var(--tx-3);
  flex: none;
}

._icon_1yo4f_102:hover {
  background: var(--s3);
  color: var(--tx);
}

._branch_1yo4f_117 {
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--tx-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

/* Narrow: files only. Wide: files beside the diff — the same layout the
   prototype's full-window review uses. */
._body_1yo4f_129 {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

._body_1yo4f_129[data-wide='true'] {
  grid-template-columns: 288px minmax(0, 1fr);
}

._list_1yo4f_140 {
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

._body_1yo4f_129[data-wide='true'] ._list_1yo4f_140 {
  border-right: 1px solid var(--bd);
}

._pane_1yo4f_3 {
  min-height: 0;
  overflow: auto;
  background: var(--code-bg);
}

._notice_1yo4f_157 {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  flex: none;
  border-bottom: 1px solid var(--bd);
  background: var(--warn-soft);
  color: var(--warn);
  font-size: 10.5px;
  line-height: 1.45;
}

._notice_1yo4f_157 span {
  flex: 1;
}

._dismiss_1yo4f_174 {
  height: 20px;
  padding: 0 8px;
  border-radius: var(--r-xs);
  border: 1px solid var(--bd-2);
  color: var(--tx-2);
  font-size: 10.5px;
  font-weight: 550;
  flex: none;
}

._dismiss_1yo4f_174:hover {
  background: var(--s3);
  color: var(--tx);
}

._icon_1yo4f_102[data-on='true'] {
  background: var(--s3);
  color: var(--tx);
}

/* The way back out of a file, on a screen too narrow to show the list beside
   it. Sticky, because a long diff would otherwise scroll the only exit away. */
._back_1yo4f_197 {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 7px;
  width: 100%;
  height: 34px;
  padding: 0 10px;
  flex: none;
  border-bottom: 1px solid var(--bd);
  background: var(--s1);
  color: var(--tx-2);
  font-size: 12px;
  font-family: var(--font-ui);
  text-align: left;
}

._back_1yo4f_197:hover {
  color: var(--tx);
}

._backName_1yo4f_220 {
  min-width: 0;
  font-family: var(--font-mono);
  font-size: 11.5px;
  /* The end of a path identifies the file; the start of it is repetition. */
  direction: rtl;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* One worktree, one column: the strip, then whichever surface it selected.
   Replaces the old `.split` grid — there is no second column to size, no
   divider to drag, and nothing to expand into, because a surface already has
   the whole window. */
._column_1m6hl_5 {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

/* One of the surfaces. Kept mounted while hidden so the conversation's scroll
   position and half-typed message survive a look at the terminal. */
._surface_1m6hl_15 {
  flex: 1;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

._surface_1m6hl_15[data-visible='false'] {
  display: none;
}
._backdrop_i6a40_1 {
  position: absolute;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: start center;
  padding-top: 12vh;
  background: rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(3px);
  animation: _fade_i6a40_1 0.14s ease;
}

@keyframes _fade_i6a40_1 {
  from {
    opacity: 0;
  }
}

/* Mirrors .modal / .m-hd / .m-bd / .m-ft in prototype/orc.html. */
._modal_i6a40_19 {
  width: 520px;
  max-width: calc(100% - 40px);
  background: var(--s1);
  border: 1px solid var(--bd-2);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
  animation: _pop_i6a40_1 0.17s cubic-bezier(0.2, 0.9, 0.3, 1);
}

@keyframes _pop_i6a40_1 {
  from {
    transform: translateY(-6px) scale(0.985);
    opacity: 0;
  }
}

._head_i6a40_38 {
  display: flex;
  align-items: center;
  padding: 13px 15px;
  border-bottom: 1px solid var(--bd);
}

._title_i6a40_45 {
  font-size: 14px;
  font-weight: 650;
  letter-spacing: -0.015em;
}

._close_i6a40_51 {
  margin-left: auto;
  width: 24px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: var(--r-sm);
  color: var(--tx-3);
}

._close_i6a40_51:hover {
  background: var(--s3);
  color: var(--tx);
}

._body_i6a40_66 {
  padding: 14px 15px;
  display: flex;
  flex-direction: column;
  gap: 13px;
}

._field_i6a40_73 {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

._field_i6a40_73 > label {
  font-size: 11px;
  font-weight: 600;
  color: var(--tx-2);
}

._folder_i6a40_85 {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 34px;
  padding: 0 10px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  background: var(--s2);
  color: var(--tx-3);
  text-align: left;
  transition:
    border-color var(--dur),
    background var(--dur);
}

._folder_i6a40_85:hover {
  border-color: var(--bd-3);
  background: var(--s3);
}

._path_i6a40_106 {
  font-family: var(--font-mono);
  font-size: 11.5px;
  color: var(--tx);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  direction: rtl;
  text-align: left;
  min-width: 0;
  flex: 1;
}

._change_i6a40_119 {
  font-size: 11px;
  color: var(--accent-hi);
  font-weight: 600;
  flex: none;
}

._input_i6a40_126 {
  height: 32px;
  border: 1px solid var(--bd-2);
  border-radius: var(--r-sm);
  background: var(--s2);
  padding: 0 10px;
  font-size: 12.5px;
}

._input_i6a40_126:focus {
  outline: none;
  border-color: var(--accent-line);
  background: var(--s1);
}

._seg_i6a40_141 {
  display: flex;
  padding: 2px;
  background: var(--s3);
  border-radius: var(--r-sm);
  gap: 2px;
}

._seg_i6a40_141 button {
  flex: 1;
  height: 26px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 550;
  color: var(--tx-3);
  font-variant-numeric: tabular-nums;
  transition:
    background var(--dur),
    color var(--dur);
}

._seg_i6a40_141 button:hover {
  color: var(--tx);
}

._seg_i6a40_141 button[data-on='true'] {
  background: var(--s1);
  color: var(--tx);
  font-weight: 650;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

._hint_i6a40_173 {
  font-size: 10.5px;
  color: var(--tx-3);
  line-height: 1.45;
}

._error_i6a40_179 {
  font-size: 11px;
  line-height: 1.5;
  color: var(--err);
}

._error_i6a40_179 code {
  font-family: var(--font-mono);
}

._foot_i6a40_189 {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 15px;
  border-top: 1px solid var(--bd);
  background: var(--s2);
}

._note_i6a40_198 {
  font-size: 10.5px;
  color: var(--tx-3);
  margin-right: auto;
}

._primary_i6a40_204 {
  height: 30px;
  padding: 0 15px;
  border-radius: var(--r-sm);
  background: var(--accent);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  transition:
    background var(--dur),
    opacity var(--dur);
}

._primary_i6a40_204:hover:not(:disabled) {
  background: var(--accent-hi);
}

._primary_i6a40_204:disabled {
  opacity: 0.4;
  cursor: default;
}

._ghost_i6a40_226 {
  height: 30px;
  padding: 0 13px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  background: var(--s1);
  color: var(--tx-2);
  font-size: 12px;
  font-weight: 550;
}

._ghost_i6a40_226:hover {
  background: var(--s3);
  color: var(--tx);
}
._history_1gyzu_1 {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  min-width: 0;
  background: var(--bg);
}

/* ---------- header ---------- */
._head_1gyzu_11 {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 20px 14px;
  border-bottom: 1px solid var(--bd);
  flex: none;
}

._head_1gyzu_11 h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.02em;
}

._head_1gyzu_11 p {
  margin: 4px 0 0;
  font-size: 11.5px;
  color: var(--tx-3);
  max-width: 560px;
  line-height: 1.55;
}

._search_1gyzu_35 {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 30px;
  padding: 0 11px;
  flex: none;
  border-radius: var(--r-sm);
  background: var(--s2);
  width: 280px;
  color: var(--tx-3);
}

._search_1gyzu_35 input {
  flex: 1;
  min-width: 0;
  background: none;
  border: 0;
  outline: 0;
  font-size: 12px;
  font-family: var(--font-ui);
  color: var(--tx);
}

._close_1gyzu_60 {
  flex: none;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: var(--r-sm);
  color: var(--tx-3);
}

._close_1gyzu_60:hover {
  background: var(--s2);
  color: var(--tx);
}

/* ---------- filters ---------- */
._filters_1gyzu_76 {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 9px 20px;
  border-bottom: 1px solid var(--bd);
  flex: none;
}

._qf_1gyzu_85 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  padding: 0 9px;
  border-radius: var(--r-sm);
  color: var(--tx-3);
  font-size: 11.5px;
  font-family: var(--font-ui);
}

._qf_1gyzu_85:hover {
  background: var(--s2);
  color: var(--tx);
}

._qf_1gyzu_85[data-on='true'] {
  background: var(--s3);
  color: var(--tx);
  font-weight: 550;
}

._qf_1gyzu_85 b {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--tx-3);
}

._sep_1gyzu_114 {
  width: 1px;
  height: 15px;
  margin: 0 4px;
  background: var(--bd-2);
  flex: none;
}

._tally_1gyzu_122 {
  margin-left: auto;
  font-size: 10.5px;
  color: var(--tx-3);
}

/* ---------- rows ---------- */
._body_1gyzu_129 {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 6px 12px 18px;
}

._row_1gyzu_136 {
  display: grid;
  grid-template-columns: 84px minmax(180px, 1.4fr) minmax(130px, 1fr) 74px 66px 84px;
  gap: 11px;
  align-items: center;
  width: 100%;
  padding: 8px;
  border-radius: var(--r-sm);
  font-size: 12px;
  text-align: left;
}

._row_1gyzu_136:not(._headRow_1gyzu_148):hover {
  background: var(--s2);
}

._headRow_1gyzu_148 {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tx-3);
  padding-bottom: 6px;
  border-bottom: 1px solid var(--bd);
  margin-bottom: 4px;
  border-radius: 0;
}

._agent_1gyzu_164,
._when_1gyzu_165 {
  color: var(--tx-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._when_1gyzu_165 {
  font-variant-numeric: tabular-nums;
  font-size: 11px;
}

._name_1gyzu_177 {
  min-width: 0;
}

._nameLine_1gyzu_181 {
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._preview_1gyzu_188 {
  margin-top: 2px;
  font-size: 10.5px;
  color: var(--tx-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._branch_1gyzu_197 {
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--tx-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._state_1gyzu_209 {
  display: flex;
  align-items: center;
  white-space: nowrap;
}

._pill_1gyzu_215 {
  display: inline-flex;
  align-items: center;
  height: 18px;
  padding: 0 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 600;
}

._pill_1gyzu_215[data-kind='open'] {
  background: var(--ok-soft);
  color: var(--ok);
}

._pill_1gyzu_215[data-kind='closed'] {
  background: var(--s4);
  color: var(--tx-3);
}

._pill_1gyzu_215[data-kind='archived'] {
  color: var(--tx-3);
  border: 1px solid var(--bd-2);
}

._turns_1gyzu_240 {
  font-size: 11px;
  color: var(--tx-3);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

._acts_1gyzu_247 {
  display: flex;
  gap: 4px;
  justify-content: flex-end;
  opacity: 0;
  transition: opacity var(--dur);
}

._row_1gyzu_136:hover ._acts_1gyzu_247,
._row_1gyzu_136:focus-within ._acts_1gyzu_247 {
  opacity: 1;
}

._mini_1gyzu_260 {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: var(--r-xs);
  color: var(--tx-3);
}

._mini_1gyzu_260:hover:not(:disabled) {
  background: var(--s4);
  color: var(--tx);
}

._mini_1gyzu_260:disabled {
  opacity: 0.3;
  cursor: default;
}

._empty_1gyzu_279 {
  padding: 40px 20px;
  text-align: center;
  color: var(--tx-3);
  font-size: 12.5px;
}

/* ---------- read-only transcript ---------- */
._detail_1gyzu_287 {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  background: var(--bg);
  z-index: 5;
}

._detailHead_1gyzu_296 {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--bd);
  background: var(--s1);
  flex: none;
}

._detailTitle_1gyzu_306 {
  min-width: 0;
}

._detailName_1gyzu_310 {
  font-size: 13px;
  font-weight: 650;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._detailMeta_1gyzu_318 {
  margin-top: 2px;
  font-size: 10.5px;
  color: var(--tx-3);
  font-family: var(--font-mono);
}

._detailActs_1gyzu_325 {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
  flex: none;
}

._btn_1gyzu_333 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  background: var(--s2);
  color: var(--tx-2);
  font-size: 11.5px;
  font-family: var(--font-ui);
}

._btn_1gyzu_333:hover:not(:disabled) {
  border-color: var(--bd-3);
  color: var(--tx);
}

._btn_1gyzu_333:disabled {
  opacity: 0.45;
  cursor: default;
}

._btnPrimary_1gyzu_357 {
  background: var(--accent-soft);
  border-color: var(--accent-line);
  color: var(--accent-hi);
}

._detailBody_1gyzu_363 {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}

/* Why this one can be read but not continued. */
._blocked_1gyzu_370 {
  padding: 8px 16px;
  border-bottom: 1px solid var(--bd);
  background: var(--warn-soft);
  color: var(--warn);
  font-size: 11px;
  line-height: 1.5;
  flex: none;
}

/* ---------------------------------------------------------------------------
   Narrow screens. The table stops being a table: a row keeps the name it is
   identified by and the state you are filtering on, and drops the columns that
   only make sense when they line up with each other.
   --------------------------------------------------------------------------- */
@media (max-width: 820px) {
  ._head_1gyzu_11 {
    flex-wrap: wrap;
  }

  ._search_1gyzu_35 {
    order: 3;
    width: 100%;
    margin-left: 0;
  }

  ._filters_1gyzu_76 {
    overflow-x: auto;
    scrollbar-width: none;
  }

  ._filters_1gyzu_76::-webkit-scrollbar {
    display: none;
  }

  ._tally_1gyzu_122 {
    display: none;
  }

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

  /* Agent, branch and turn count all read off the chat once it is open. The
     name is the only column that identifies the row. */
  ._headRow_1gyzu_148,
  ._agent_1gyzu_164,
  ._branch_1gyzu_197,
  ._turns_1gyzu_240 {
    display: none;
  }

  /* No hover to reveal them on a touch screen, so they are simply there. */
  ._acts_1gyzu_247 {
    opacity: 1;
  }
}
/* Mirrors `.queue` in prototype/orc.html — a slide-over, not a docked column. */
._panel_verqu_2 {
  position: absolute;
  top: var(--titlebar-h);
  right: 0;
  bottom: 0;
  /* Never wider than the screen it is sliding over. On a phone that makes it
     the whole width, which is right — it is the thing you opened. */
  width: min(392px, 100%);
  z-index: 50;
  background: var(--s1);
  border-left: 1px solid var(--bd-2);
  box-shadow: -24px 0 60px -20px rgba(0, 0, 0, 0.55);
  display: grid;
  grid-template-rows: auto 1fr;
  animation: _slide_verqu_1 0.18s cubic-bezier(0.22, 0.8, 0.3, 1);
}

@keyframes _slide_verqu_1 {
  from {
    transform: translateX(18px);
    opacity: 0;
  }
  to {
    transform: none;
    opacity: 1;
  }
}

._head_verqu_30 {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--bd);
}

._hand_verqu_38 {
  color: var(--warn);
  display: grid;
  place-items: center;
  flex: none;
}

._title_verqu_45 {
  font-size: 13px;
  font-weight: 650;
  letter-spacing: -0.01em;
}

._count_verqu_51 {
  font-size: 11px;
  color: var(--tx-3);
  font-variant-numeric: tabular-nums;
}

._close_verqu_57 {
  margin-left: auto;
  width: 24px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: var(--r-sm);
  color: var(--tx-3);
  flex: none;
}

._close_verqu_57:hover {
  background: var(--s3);
  color: var(--tx);
}

._list_verqu_73 {
  overflow-y: auto;
  padding: 8px 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

._section_verqu_81 {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--tx-3);
  padding: 6px 2px 0;
}

._empty_verqu_90 {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 14px 4px;
  font-size: 11.5px;
  color: var(--tx-3);
}

._empty_verqu_90 span {
  opacity: 0.75;
  line-height: 1.5;
}

/* On a phone the panel is the screen, so the drop shadow and the left border
   are framing nothing. */
@media (max-width: 820px) {
  ._panel_verqu_2 {
    border-left: 0;
    box-shadow: none;
  }
}
/* Structure mirrors .settings / .set-nav / .set-pane in prototype/orc.html. */
._settings_10rpj_1 {
  display: grid;
  grid-template-columns: 196px 1fr;
  min-height: 0;
  background: var(--page);
}

/* ---------- nav ---------- */
._nav_10rpj_10 {
  border-right: 1px solid var(--bd);
  background: var(--s1);
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
}

._navTitle_10rpj_18 {
  /* Indented past the tabs' icons so it reads as their heading rather than as
     one of them: 9px of their padding plus the 13px glyph and its 8px gap. */
  padding: 6px 9px 9px 30px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tx-3);
}

._navItem_10rpj_29 {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 28px;
  padding: 0 9px;
  width: 100%;
  border-radius: var(--r-sm);
  color: var(--tx-2);
  font-size: 12px;
  transition:
    background var(--dur),
    color var(--dur);
}

._navItem_10rpj_29:hover {
  background: var(--s2);
}

._navItem_10rpj_29[data-on='true'] {
  background: var(--s3);
  color: var(--tx);
  font-weight: 550;
}

._navFoot_10rpj_54 {
  margin-top: 14px;
  padding-top: 10px;
  border-top: 1px solid var(--bd);
}

/* ---------- body ---------- */
._body_10rpj_61 {
  min-height: 0;
  display: grid;
  grid-template-rows: auto 1fr;
  overflow: hidden;
}

._head_10rpj_68 {
  padding: 14px 18px 12px;
  border-bottom: 1px solid var(--bd);
  background: var(--bg);
}

._head_10rpj_68 h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.02em;
}

._head_10rpj_68 p {
  margin: 4px 0 0;
  font-size: 11.5px;
  color: var(--tx-3);
  max-width: 640px;
  line-height: 1.55;
}

._pane_10rpj_89 {
  overflow-y: auto;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 720px;
}

/* ---------- setting rows ---------- */
._matrix_10rpj_99 {
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--s2);
}

._row_10rpj_105 {
  display: grid;
  grid-template-columns: 1fr 216px;
  gap: 12px;
  align-items: center;
  padding: 9px 11px;
  border-bottom: 1px solid var(--bd);
}

._row_10rpj_105:last-child {
  border-bottom: 0;
}

._rowName_10rpj_118 {
  font-size: 12px;
  font-weight: 550;
}

._rowSub_10rpj_123 {
  font-size: 10.5px;
  color: var(--tx-3);
  margin-top: 1px;
}

._seg_10rpj_129 {
  display: flex;
  padding: 2px;
  background: var(--s3);
  border-radius: var(--r-sm);
  gap: 2px;
}

._seg_10rpj_129 button {
  flex: 1;
  height: 24px;
  border-radius: 5px;
  font-size: 11.5px;
  font-weight: 500;
  color: var(--tx-3);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  transition:
    background var(--dur),
    color var(--dur);
}

._seg_10rpj_129 button:hover:not(:disabled) {
  color: var(--tx);
}

._seg_10rpj_129 button[data-on='true'] {
  background: var(--s1);
  color: var(--tx);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

._seg_10rpj_129 button:disabled {
  cursor: default;
  opacity: 0.6;
}

/* ---------- remote access ---------- */
._remote_10rpj_170 {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

._remote_10rpj_170 code {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--tx-2);
}

._section_10rpj_182 {
  /* Matches `.row`'s 11px so headings line up with the rows beneath them —
     these all sit inside `.matrix`, which supplies the card and no padding. */
  margin: 6px 0 0;
  padding: 14px 11px 7px;
  border-bottom: 1px solid var(--bd);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tx-3);
}

/* The code and its QR, while one is live. Centred because it is the only
   thing on screen anyone is looking at while they hold up a phone, and
   full-bleed inside the card rather than a second box drawn inside a box. */
._pairing_10rpj_198 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 22px 16px;
  border-bottom: 1px solid var(--bd);
  background: var(--accent-soft);
}

._qr_10rpj_208 {
  width: 200px;
  height: 200px;
  border-radius: var(--r-sm);
  /* The generator draws black on white; a dark theme must not invert it, or
     scanners lose the contrast they rely on. */
  background: #fff;
  padding: 8px;
}

._code_10rpj_218 {
  font-family: var(--font-mono);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: 0.22em;
  color: var(--tx);
  /* The letter-spacing pads the right edge; this pulls the block back centre. */
  text-indent: 0.22em;
}

._countdown_10rpj_228 {
  font-size: 11px;
  color: var(--tx-3);
  font-variant-numeric: tabular-nums;
}

._device_10rpj_234 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 11px;
  border-bottom: 1px solid var(--bd);
}

/* The last row ends the card; a rule there would float above nothing. */
._device_10rpj_234:last-child {
  border-bottom: 0;
}

._none_10rpj_248 {
  padding: 13px 11px 15px;
  font-size: 11.5px;
  color: var(--tx-3);
}

._confirm_10rpj_254 {
  display: flex;
  gap: 6px;
  flex: none;
}

._primary_10rpj_260,
._ghost_10rpj_261,
._danger_10rpj_262 {
  height: 26px;
  padding: 0 11px;
  border-radius: var(--r-sm);
  font-size: 11.5px;
  font-family: var(--font-ui);
  flex: none;
}

._primary_10rpj_260 {
  background: var(--accent);
  color: #fff;
  font-weight: 600;
}

._ghost_10rpj_261 {
  border: 1px solid var(--bd-2);
  background: var(--s2);
  color: var(--tx-2);
}

._ghost_10rpj_261:hover {
  color: var(--tx);
  border-color: var(--bd-3);
}

._danger_10rpj_262 {
  background: var(--err-soft);
  color: var(--err);
  font-weight: 600;
}

/* Copy, copy link, cancel — under the countdown, wrapping on a narrow pane. */
._pairActs_10rpj_295 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin-top: 2px;
}

._pairActs_10rpj_295 ._ghost_10rpj_261 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* ---------------------------------------------------------------------------
   Narrow screens. The two-column settings become one: the sections move to a
   scrolling row on top, the way a phone's tab bar works, and the pane below
   gets the whole width.
   --------------------------------------------------------------------------- */
@media (max-width: 820px) {
  ._settings_10rpj_1 {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }

  ._nav_10rpj_10 {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px;
    border-right: 0;
    border-bottom: 1px solid var(--bd);
    overflow-x: auto;
    scrollbar-width: none;
  }

  ._nav_10rpj_10::-webkit-scrollbar {
    display: none;
  }

  /* The heading and Back are a column's furniture; in a row they would be two
     more things to scroll past to reach the section you wanted. */
  ._navTitle_10rpj_18 {
    display: none;
  }

  ._navFoot_10rpj_54 {
    margin-left: auto;
    padding: 0;
    border: 0;
  }

  ._navItem_10rpj_29 {
    width: auto;
    height: 30px;
    white-space: nowrap;
    flex: none;
  }

  ._pane_10rpj_89 {
    padding: 14px;
  }

  /* Label above control rather than beside it: 216px of segmented buttons and
     a sentence of explanation do not share a phone's width. */
  ._row_10rpj_105 {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  ._qr_10rpj_208 {
    width: 168px;
    height: 168px;
  }
}

._input_10rpj_371 {
  height: 28px;
  padding: 0 9px;
  border: 1px solid var(--bd-2);
  border-radius: var(--r-sm);
  background: var(--s1);
  color: var(--tx);
  font-family: var(--font-mono);
  font-size: 12px;
}

._input_10rpj_371:focus {
  outline: none;
  border-color: var(--accent-line);
}

._primary_10rpj_260:disabled {
  opacity: 0.4;
  cursor: default;
}
/* Mirrors `.rail` in prototype/orc.html. */
._rail_1c23s_1 {
  background: var(--s1);
  border-right: 1px solid var(--bd);
  display: grid;
  grid-template-rows: auto 1fr;
  min-height: 0;
  min-width: 0;
}

._head_1c23s_11 {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 9px 8px 5px 12px;
}

._label_1c23s_18 {
  font-size: 10.5px;
  font-weight: 650;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--tx-3);
}

._add_1c23s_26 {
  margin-left: auto;
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: var(--r-xs);
  color: var(--tx-2);
}

._add_1c23s_26:hover {
  background: var(--s3);
  color: var(--tx);
}

._list_1c23s_41 {
  overflow-y: auto;
  padding: 2px 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
}

._empty_1c23s_50 {
  padding: 8px 4px;
  font-size: 11px;
  color: var(--tx-3);
}

/* ---------- agent ---------- */
._group_1c23s_57 {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

._agent_1c23s_63 {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 9px 4px;
}

._name_1c23s_70 {
  font-size: 12px;
  font-weight: 650;
  letter-spacing: -0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1;
}

._gear_1c23s_81 {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: var(--r-xs);
  color: var(--tx-3);
  flex: none;
  opacity: 0;
  transition:
    opacity var(--dur),
    background var(--dur),
    color var(--dur);
}

._group_1c23s_57:hover ._gear_1c23s_81 {
  opacity: 1;
}

._gear_1c23s_81:hover {
  background: var(--s4);
  color: var(--tx);
}

/* ---------- instance (a pool slot) ---------- */
._instance_1c23s_106 {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 6px 9px 6px 10px;
  border-radius: var(--r-md);
  position: relative;
  text-align: left;
  transition: background var(--dur);
}

._instance_1c23s_106:not(:disabled):hover {
  background: var(--s2);
}

._instance_1c23s_106:disabled {
  cursor: default;
  opacity: 0.55;
}

._instance_1c23s_106[data-on='true'] {
  background: var(--s3);
}

._instance_1c23s_106[data-on='true']::before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  bottom: 7px;
  width: 2.5px;
  border-radius: 0 2px 2px 0;
  background: var(--accent);
}

._dot_1c23s_142 {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mute);
  flex: none;
}

._dot_1c23s_142[data-state='ready'] {
  background: var(--ok);
}

._dot_1c23s_142[data-state='preparing'],
._dot_1c23s_142[data-state='failed'] {
  background: var(--err);
}

/* An active instance reports its conversation status instead. */
@keyframes _pulse_1c23s_1 {
  50% {
    opacity: 0.35;
  }
}

._slot_1c23s_166 {
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--tx-2);
  flex: none;
}

._meta_1c23s_173 {
  font-size: 10.5px;
  color: var(--tx-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1;
}

._pending_1c23s_183 {
  min-width: 15px;
  height: 15px;
  padding: 0 4px;
  border-radius: 8px;
  background: var(--warn-soft);
  color: var(--warn);
  font-size: 9.5px;
  font-weight: 700;
  display: grid;
  place-items: center;
  flex: none;
  font-variant-numeric: tabular-nums;
}

/* What a worktree is carrying — changed files, then commits ahead. Muted:
   it's context for a decision, not an alert. */
._carry_1c23s_200 {
  font-size: 9.5px;
  font-weight: 600;
  color: var(--tx-3);
  font-variant-numeric: tabular-nums;
  flex: none;
}

/* One flex item holding all the numbers. The row itself has an 8px gap, and
   leaving these as separate children put that gap on the left of the separator
   and nothing on the right — the dot sat against the second number. */
._carrySet_1c23s_211 {
  display: inline-flex;
  align-items: baseline;
  flex: none;
}

/* A separator only where two numbers actually meet, so "1 8" can't be misread
   as eighteen. Nothing trails a lone number — the colour already says which
   kind it is, and a dot on the end of every chip was noise. */
._carry_1c23s_200 + ._carry_1c23s_200::before {
  content: '·';
  margin: 0 3px;
  color: var(--tx-3);
  font-weight: 400;
}

/* Staged reads as ready, unstaged as still moving — same vocabulary as the
   review panel, so a colour means one thing across the app. */
._carry_1c23s_200[data-kind='staged'] {
  color: var(--git-add);
}

._carry_1c23s_200[data-kind='unstaged'] {
  color: var(--git-mod);
}

/* Unpushed commits — the accent, since pushing is the next action rather than
   a state of the files. */
._carry_1c23s_200[data-kind='unpushed'] {
  color: var(--accent);
}
._app_139l3_1 {
  height: 100%;
  display: grid;
  grid-template-rows: var(--titlebar-h) 1fr;
  background: var(--bg);
  min-height: 0;
}

/* ---------- titlebar ---------- */
._titlebar_139l3_10 {
  display: flex;
  align-items: center;
  gap: 10px;
  /* left padding clears the macOS traffic lights drawn over the window */
  padding: 0 10px 0 78px;
  border-bottom: 1px solid var(--bd);
  background: var(--s1);
  -webkit-app-region: drag;
}

._titlebar_139l3_10 button {
  -webkit-app-region: no-drag;
}

._brand_139l3_25 {
  font-size: 12.5px;
  font-weight: 650;
  letter-spacing: -0.01em;
}

._tbRight_139l3_31 {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 4px;
}

/* matches .tb-btn in the prototype */
._tbBtn_139l3_39 {
  width: 26px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: var(--r-sm);
  color: var(--tx-2);
  position: relative;
  transition:
    background var(--dur),
    color var(--dur);
}

._tbBtn_139l3_39:hover {
  background: var(--s3);
  color: var(--tx);
}

._tbBtn_139l3_39[data-on='true'] {
  background: var(--accent-soft);
  color: var(--accent-hi);
}

/* A badged button reads as "live" even when the panel is closed. */
._tbBtn_139l3_39[data-badged='true'] {
  color: var(--tx);
}

/* matches .cbadge in the prototype */
._badge_139l3_68 {
  position: absolute;
  top: -3px;
  right: -4px;
  min-width: 15px;
  height: 15px;
  padding: 0 3.5px;
  border-radius: 8px;
  background: var(--err);
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  line-height: 1;
  display: grid;
  place-items: center;
  border: 1.5px solid var(--s1);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}

/* Positioning context for the slide-over, which docks under the titlebar. */
._stage_139l3_89 {
  position: relative;
  min-height: 0;
  display: grid;
}

/* Thin left rail + main pane (spec 2.1.3). */
._shell_139l3_96 {
  display: grid;
  grid-template-columns: 232px 1fr;
  min-height: 0;
}

/* Both exist only below the breakpoint. Declared here so the wide layout is
   explicit about not having them rather than inheriting their absence. */
._hamburger_139l3_104 {
  display: none;
}

._scrim_139l3_108 {
  display: none;
}

/* Browser-only: the connection to the machine orc runs on has dropped. */
._offline_139l3_113 {
  flex: none;
  padding: 6px 12px;
  background: var(--warn-soft);
  color: var(--warn);
  font-size: 11.5px;
  text-align: center;
}

/* ---------------------------------------------------------------------------
   Narrow screens — a phone, or the window dragged small.

   One breakpoint, not a scale of them. The layout has exactly two states: the
   rail sits beside the work, or it slides over it. Anything between those is a
   third design nobody asked for.
   --------------------------------------------------------------------------- */
@media (max-width: 820px) {
  ._shell_139l3_96 {
    /* One column. The rail is taken out of flow below and laid over it. */
    grid-template-columns: 1fr;
  }

  /* The rail is the shell's only <nav>. Targeted by element rather than by
     position: the scrim sits before it, and a selector that counts children
     breaks the moment anything else is added to the shell. */
  ._shell_139l3_96 > nav {
    position: fixed;
    /* Fixed positioning ignores the body's safe-area padding, so the inset has
       to be added back or the drawer starts under the notch. */
    top: calc(var(--titlebar-h) + env(safe-area-inset-top));
    bottom: 0;
    left: 0;
    width: min(280px, 82vw);
    z-index: 30;
    transform: translateX(-100%);
    transition: transform var(--dur) ease;
    box-shadow: var(--shadow);
  }

  ._shell_139l3_96[data-rail='true'] > nav {
    transform: translateX(0);
  }

  ._scrim_139l3_108 {
    display: block;
    position: fixed;
    inset: calc(var(--titlebar-h) + env(safe-area-inset-top)) 0 0 0;
    z-index: 29;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--dur) ease;
  }

  ._shell_139l3_96[data-rail='true'] ._scrim_139l3_108 {
    opacity: 1;
    pointer-events: auto;
  }

  ._hamburger_139l3_104 {
    display: grid;
    place-items: center;
    width: 28px;
    height: 24px;
    margin-right: 2px;
    border-radius: var(--r-sm);
    color: var(--tx-2);
  }

  ._hamburger_139l3_104:hover {
    background: var(--s2);
    color: var(--tx);
  }

  /* Same reasoning as the tab strip: bigger targets, bigger glyphs. */
  ._tbBtn_139l3_39 {
    width: 28px;
    height: 24px;
  }
}

/* In a browser there are no traffic lights to clear, so the 78px reserved for
   them is dead space — and on a phone it is most of the row. */
:root[data-remote='true'] ._titlebar_139l3_10 {
  padding-left: 8px;
}

/* No hover states on a touch screen: `:hover` sticks after a tap, leaving
   whatever you last touched looking permanently focused. */
@media (hover: none) {
  ._hamburger_139l3_104:hover {
    background: none;
  }
}
/* The first thing a phone sees. Centred and narrow: it is one decision, and
   the surrounding app is deliberately not rendered behind it. */
._pair_s10m4_3 {
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--bg);
  overflow-y: auto;
}

._card_s10m4_13 {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 340px;
  padding: 24px;
  border: 1px solid var(--bd-2);
  border-radius: var(--r-lg);
  background: var(--s1);
  box-shadow: var(--shadow);
}

._mark_s10m4_25 {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--accent-hi);
}

._card_s10m4_13 h1 {
  margin: 10px 0 0;
  font-size: 18px;
  font-weight: 650;
  letter-spacing: -0.02em;
}

._blurb_s10m4_39 {
  margin: 8px 0 20px;
  font-size: 12px;
  line-height: 1.55;
  color: var(--tx-3);
}

._label_s10m4_46 {
  font-size: 11px;
  font-weight: 600;
  color: var(--tx-2);
  margin-bottom: 6px;
}

._hint_s10m4_53 {
  font-weight: 400;
  color: var(--tx-3);
}

/* Wide-spaced and monospaced: it is read off another screen a character at a
   time, and grouping is what stops a transposed pair. */
._code_s10m4_60 {
  height: 44px;
  margin-bottom: 16px;
  padding: 0 12px;
  border: 1px solid var(--bd-2);
  border-radius: var(--r-md);
  background: var(--s2);
  color: var(--tx);
  font-family: var(--font-mono);
  font-size: 19px;
  letter-spacing: 0.22em;
  text-align: center;
}

._name_s10m4_74 {
  height: 36px;
  margin-bottom: 18px;
  padding: 0 11px;
  border: 1px solid var(--bd-2);
  border-radius: var(--r-md);
  background: var(--s2);
  color: var(--tx);
  font-size: 13px;
  font-family: var(--font-ui);
}

._code_s10m4_60:focus,
._name_s10m4_74:focus {
  outline: none;
  border-color: var(--accent-line);
  background: var(--s1);
}

._error_s10m4_93 {
  margin-bottom: 14px;
  padding: 8px 10px;
  border-radius: var(--r-sm);
  background: var(--err-soft);
  color: var(--err);
  font-size: 11.5px;
  line-height: 1.5;
}

._submit_s10m4_103 {
  height: 42px;
  border-radius: var(--r-md);
  background: var(--accent);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  font-family: var(--font-ui);
}

._submit_s10m4_103:disabled {
  opacity: 0.4;
  cursor: default;
}

/* Said plainly, on the screen where the decision is actually made. */
._foot_s10m4_119 {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--bd);
  color: var(--tx-3);
  font-size: 10.5px;
  line-height: 1.5;
}
/* Mirrors .modal / .m-hd / .m-bd / .m-ft from prototype/orc.html. */
._window_ny5ri_2 {
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
  background: var(--s1);
  border: 1px solid var(--bd-2);
  border-radius: var(--r-lg);
  overflow: hidden;
}

._bar_ny5ri_12 {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 11px 13px;
  border-bottom: 1px solid var(--bd);
  background: var(--warn-soft);
  /* The window is frameless — this row is the drag handle. */
  -webkit-app-region: drag;
}

._bar_ny5ri_12 button {
  -webkit-app-region: no-drag;
}

._hand_ny5ri_27 {
  color: var(--warn);
  display: grid;
  place-items: center;
  flex: none;
}

._heading_ny5ri_34 {
  min-width: 0;
}

._title_ny5ri_38 {
  font-size: 13px;
  font-weight: 650;
  letter-spacing: -0.015em;
}

._sub_ny5ri_44 {
  font-size: 10.5px;
  color: var(--tx-3);
  margin-top: 1px;
}

._close_ny5ri_50 {
  margin-left: auto;
  width: 24px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: var(--r-sm);
  color: var(--tx-3);
  flex: none;
}

._close_ny5ri_50:hover {
  background: var(--s3);
  color: var(--tx);
}

._body_ny5ri_66 {
  overflow-y: auto;
  padding: 13px;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

._none_ny5ri_75 {
  padding: 24px 4px;
  text-align: center;
  font-size: 12px;
  color: var(--tx-3);
}

._foot_ny5ri_82 {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border-top: 1px solid var(--bd);
  background: var(--s2);
}

._note_ny5ri_91 {
  font-size: 10.5px;
  color: var(--tx-3);
  line-height: 1.45;
}

._later_ny5ri_97 {
  height: 27px;
  padding: 0 12px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  background: var(--s1);
  color: var(--tx-2);
  font-size: 11.5px;
  font-weight: 550;
  white-space: nowrap;
  flex: none;
  transition:
    background var(--dur),
    color var(--dur),
    border-color var(--dur);
}

._later_ny5ri_97:hover:not(:disabled) {
  background: var(--s3);
  color: var(--tx);
  border-color: var(--bd-3);
}

._later_ny5ri_97:disabled {
  opacity: 0.4;
  cursor: default;
}
/* Bundled rather than fetched: the CSP allows `font-src 'self'`, and a local
   app shouldn't need the network to render its own text. Variable weights, so
   one file per family covers every weight the UI uses. */
/* inter-cyrillic-ext-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-cyrillic-ext-wght-normal-BOeWTOD4.woff2) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* inter-cyrillic-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-cyrillic-wght-normal-DqGufNeO.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* inter-greek-ext-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-greek-ext-wght-normal-DlzME5K_.woff2) format('woff2-variations');
  unicode-range: U+1F00-1FFF;
}

/* inter-greek-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-greek-wght-normal-CkhJZR-_.woff2) format('woff2-variations');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* inter-vietnamese-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-vietnamese-wght-normal-CBcvBZtf.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* inter-latin-ext-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-latin-ext-wght-normal-DO1Apj_S.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* inter-latin-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(./inter-latin-wght-normal-Dx4kXJAl.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* jetbrains-mono-cyrillic-ext-wght-normal */
@font-face {
  font-family: 'JetBrains Mono Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url(data:font/woff2;base64,d09GMgABAAAAAAfsABQAAAAAEAwAAAeCAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGhwbHhwoP0hWQVJbBmA/U1RBVIFiJyYAdC9qEQgKhGSEAAsgADCGCAE2AiQDOgQgBYlMB4EUDAcbLQ4onoexrSC/2ZyLAa8p8VHB8/x3Vue+V0hVJalMJg2nx/TCrQXxBeqLjQG7FyM1WEa/X1tEXN7cFz9EJEMmMUz3RihWSSKeQCbcIou0izz/C8v+fq3VfajEa9gDD11CImXS7qL/RJFVzC1qiB6KmKeD6TZdQ6IRGv78dL6uSVVCfgni5mzu7kcgQBgAEAQTQRCoL++STTYybkJxNfQxAAIAGu8OdEB9teW2jh4BpgDqFjAeSEByW3zFP0CBBgNMsMCGEDjgggdhiEAUAeIIED7ABTDUEnkIE9Q9ahFgKttcVhApo4ACB4qobHaccgDfEjFO6aaWUhjMLt2SyIvHKoDqoA4CSUwEIYQCEjhAO9R1G6keDeDZGjNo+AhxOjCEGTr1WeIF3kYBiLAOKvkJSMiKX0VdAyQt3SDJClCkxJCHkCzfqyVTriJZLcolS32JZHUekq2TYNkYtCtjYHMQXSxGjXDz2t/yLWXzDzxz+o3zFwDEaN23F+13pyMdQAEaSKAR9vcGq4A4MTSKCElGW+M7UcY7xqkggITb28ZJhlqc9q2twYKTt0NjixBgYvO9BIihEBLYuOFXQzfIQ7dXGUEEEgFDooBfAzqiQbpJrhiWSuKJCRFKYbHCyJKI2G5GiZbNAvgAu5pc3vwx4G+g3aDkhklABiSz0BICXrYghtYhx/cdJ+44rY2oZ0aMNRFz3VZjb6W33F3gzltqtOCV8tTHSpOeXuItfvr5lCdfzFpqtEitvqdcdGGFd28ZqqC0tPbeChGXgrIlnhSWu/eUso4uKWFLugyDzQJhflY4659+WjQ++6x72WUMv9G8mw6QJl7BVxX5fe/kpUsOvnZwee9uQ0cGXYd0o89XB2748sDSnt8d2VphdOTTgceDVvOds0v9P/s7HPq15aGun/6Vllb56f1dl0t1LejqrNkpdRZsG8TOnM5vkBG5oiVyVGnS8LHps5cfNWJs6qKPfaNSxiQNBUm3cKNWROr0GSur7Za31k1vieq7LH11VF+jXdRIasRKflc7jkobm1Z9te1IyZA0pDkhLR98+H37Zf1c/8at+dB7x+7GfVyTfJMPiYztsnl59Y5l4j+0n1RXlpHnF3Tq7HecmNF/CJodEMAikruxiyJaGLvHOdAfoA+oDvpjBm2b91cHGRZMU9n25xEU0A8fgEEAdKI3Q1iDtc034sug5YVMkE2jsE+BIkwSoQ3gxXMqz9tELp48bd0cFKOKS7xYjEuXBnZP5ia7DyiO/X/YI+PQSbt2uSdqAkWL9nQbV1XB94/+uPfdZz8dnXYFBYrcTl2SIR/ybxJNJPz/Gupb0JaZeens2ekC7EKr8t+Ls/P5VJPYJdHKyqfg2nqU6bhlidzcddQV/7MmecTzJ5VPcKXkNKSEogHjYFx6QZ7rQ+FSe8njaiNuOnXS8H2ScQ619c2mC3VTtauL0rRbXd/CkSOP37FY9Zkjz8+GibYUMOEWF+RdrFS8Ecv1SHOpPUPZGEIpjPvFyU5cXKjd6OXqorTqy9GwRd++HVufPGnVsW+aO3vggKZ18jR9sXaTC1PWTEsVUaK0FkNySbTQDqlm2PfDjZcu4aalnSLKjnOoYQ0nUlqqXcGpPu/4VgV/xU2pAqW4BW3qzhQ8/hFKhV2qE3+BKAtDqBXjfgnVdH4y0wg5tbVNRenNdTWOrenWLcupQdmsbq5b+18piTe/xRdp1xbILxNPJGInm2z6hoB21Lal0i+ePTtd7B45+3XhFJ329evskXm7qurUVREotqSluSo/L29d3qDhI4YOQqWhI4YNvBNfsMHeXKemXrxQfKeuPOGRVayA3JtkJKEgbPp+dXUDluddutRYLFoXGXWX6N3WFaGLbQtRSitVYNacTNSdy7AaG/HSaUEANcBoGXNdcZvZsOqQ1icBDv21/gzAoYPHH/WDW0qNR3QTYKEAEHig6o13NXbND06CQPlRtYjGNnSktRc09k1mAMDvAlDKfQjgy6fssInlfzmNAjKkDxoxHOBLdVRAIVt9j4qo+hA1w9T1aNBNTUOTTNUHLbqokE+UAfJXCIGw/IxCSL5GRUJeR40rL/UxTm4Q08H6MbCs70ObuNyIIXrINHQYInF06UUlevTjbQzTh5upiDMzMMogUtEnjPs/Y7jAHCJeB0GBHh04tC6FiB6ZFB1oArUSIoFoqhzCeAN6lHwm0T4C3VVPWvjpSMXReuWesMEcoqrmgtNBGd2noWeV0hNAz9rFeShNJxHGsPa3HXeKTk8b55hahySYHaYKKFFLpCfN8rsoaJn01CR04Gkc+5k7KVTCmClX8Q10HCrUEkVlSX+XO33oQR9609tJ516H497WSobWs5Up6TLaS10/dessIskgJSLiDlWvHVUywpkQ7hdPZqGyiEF0uVQerVcPamT1A3eKXdyI1vG9OoflrSXihZ1qqGE3nhmAgiIbRCQgPLEPtOM3UQwTLYaYYomNlpA44opnjV6jkD6id80OOrzf6BzmMD6eEa1zKyeYG1fzfEf16V6jw9XYOaar1/b2kP/IYX8oR2mcFvv2GtBV3JXgd437AQAA) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* jetbrains-mono-cyrillic-wght-normal */
@font-face {
  font-family: 'JetBrains Mono Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url(./jetbrains-mono-cyrillic-wght-normal-D73BlboJ.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* jetbrains-mono-greek-wght-normal */
@font-face {
  font-family: 'JetBrains Mono Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url(./jetbrains-mono-greek-wght-normal-Bw9x6K1M.woff2) format('woff2-variations');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* jetbrains-mono-vietnamese-wght-normal */
@font-face {
  font-family: 'JetBrains Mono Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url(./jetbrains-mono-vietnamese-wght-normal-Bt-aOZkq.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* jetbrains-mono-latin-ext-wght-normal */
@font-face {
  font-family: 'JetBrains Mono Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url(./jetbrains-mono-latin-ext-wght-normal-DBQx-q_a.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* jetbrains-mono-latin-wght-normal */
@font-face {
  font-family: 'JetBrains Mono Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url(./jetbrains-mono-latin-wght-normal-B9CIFXIH.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* ============================================================
   TOKENS — lifted verbatim from prototype/orc.html so the real app
   and the prototype stay pixel-identical. Change values here, never
   in component modules.
   ============================================================ */
:root {
  --font-ui:
    'Inter Variable', 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI',
    sans-serif;
  --font-mono:
    'JetBrains Mono Variable', 'JetBrains Mono', 'SF Mono', ui-monospace, Menlo, monospace;

  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --dur: 0.16s;

  --accent: #6e7aff;
  --accent-hi: #8b94ff;
  --accent-soft: rgba(110, 122, 255, 0.14);
  --accent-line: rgba(110, 122, 255, 0.38);

  --ok: #3fb950;
  --ok-soft: rgba(63, 185, 80, 0.13);
  --warn: #d9a21b;
  --warn-soft: rgba(217, 162, 27, 0.14);
  --err: #f05252;
  --err-soft: rgba(240, 82, 82, 0.13);

  /* Git decoration colours, kept apart from the alert palette above.
     A modified file isn't a warning and a deletion isn't an error — they're
     just what the diff says — so they don't borrow the alert palette.

     Pastel rather than desaturated: around 45–55% saturation at a high
     lightness reads as a solid colour that happens to be soft, where merely
     dropping the saturation just looked washed out. The light theme keeps
     darker, deeper versions — a pastel on white is invisible. */
  --git-add: #7bd6a0;
  --git-mod: #e6c56d;
  --git-del: #f09283;
  --info: #4c9aff;
  --info-soft: rgba(76, 154, 255, 0.13);
  --mute: #6b7280;

  /* Height of the custom titlebar; macOS traffic lights are positioned to match
     (see trafficLightPosition in src/main/index.ts). */
  --titlebar-h: 32px;
}

:root[data-theme='dark'] {
  --page: #08090b;
  --bg: #0b0c0e;
  --s1: #0f1113;
  --s2: #141619;
  --s3: #1a1d21;
  --s4: #22262b;
  --bd: #17191c;
  --bd-2: #202327;
  --bd-3: #2c3036;
  --tx: #e7e9ed;
  --tx-2: #98a0ab;
  --tx-3: #6a727d;
  --shadow: 0 24px 70px -20px rgba(0, 0, 0, 0.75), 0 2px 8px rgba(0, 0, 0, 0.4);
  --code-bg: #0d0f11;
  --add: rgba(63, 185, 80, 0.1);
  --del: rgba(240, 82, 82, 0.09);
}

:root[data-theme='light'] {
  --page: #edeef1;
  --bg: #fbfbfc;
  --s1: #ffffff;
  --s2: #f6f7f9;
  --s3: #eff1f4;
  --s4: #e5e8ed;
  --bd: #eceef1;
  --bd-2: #dfe3e8;
  --bd-3: #cbd1d9;
  --tx: #14161a;
  --tx-2: #596170;
  --tx-3: #858c99;
  --shadow: 0 24px 60px -24px rgba(20, 25, 40, 0.32), 0 1px 3px rgba(20, 25, 40, 0.1);
  --code-bg: #f7f8fa;
  --add: rgba(63, 185, 80, 0.13);
  --del: rgba(240, 82, 82, 0.11);
  --git-add: #2a744b;
  --git-mod: #86651a;
  --git-del: #a4483a;
  --accent: #5461e8;
}

/* ============================================================
   BASE — reset + primitives shared by every component module.
   Component-specific styles belong in *.module.css, not here.
   ============================================================ */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body,
#root {
  height: 100%;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--tx);
  font-family: var(--font-ui);
  font-size: 13px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  font-feature-settings:
    'cv05' 1,
    'cv09' 1,
    'ss03' 1;
  overflow: hidden;
}

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 0;
}

input,
textarea,
select {
  font: inherit;
  color: inherit;
}

svg {
  display: block;
  flex: none;
}

/* Nothing in a desktop shell should be text-selectable by default; opt back in
   per component (terminal output, diffs, logs) with .selectable. */
body {
  -webkit-user-select: none;
  user-select: none;
}

.selectable {
  -webkit-user-select: text;
  user-select: text;
  cursor: auto;
}

::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

::-webkit-scrollbar-thumb {
  background: var(--bd-2);
  border-radius: 10px;
  border: 2px solid transparent;
  background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--bd-3);
  background-clip: content-box;
}

::-webkit-scrollbar-track {
  background: transparent;
}

/* Keep the app clear of a notch and a home indicator. Zero everywhere else,
   so this costs nothing on a desktop. */
body {
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom)
    env(safe-area-inset-left);
  box-sizing: border-box;
}

/* A phone zooming in on every tap of a text field is a rejection of the layout
   above, not a convenience. 16px is the threshold Safari uses. */
@media (max-width: 820px) {
  input,
  textarea,
  select {
    font-size: 16px;
  }
}