/* CODER'S SCREEN (2026-11-05): its own file, apart from styles.css. A chat,
   like a code editor's agent panel: the person's messages as bubbles, the AI's
   words as plain text, every command a quiet row that opens to its output. */
.cd { flex: 1; min-height: 0; display: flex; flex-direction: column; background: #faf9f7; color: #0d1b2a; font: 14px/1.55 Inter, -apple-system, system-ui, sans-serif; }
.cd code, .cd pre { font-family: "Geist Mono", ui-monospace, Menlo, monospace; }

/* The bar on top: the repository, its branch, the pull request. */
.cd-head { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 96px; padding: 10px 20px; border-bottom: 1px solid #ece8e1; flex-wrap: wrap; }
.cd-proj { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #e6e2db; background: #fff; border-radius: 9px; padding: 5px 10px; }
.cd-proj select { border: 0; background: transparent; font: 600 13px Inter, system-ui, sans-serif; color: #0d1b2a; outline: none; max-width: 260px; cursor: pointer; }
.cd-branch { display: inline-flex; align-items: center; gap: 5px; color: #6b7280; font: 12px "Geist Mono", ui-monospace, Menlo, monospace; }
.cd-pr { font-size: 12.5px; font-weight: 600; color: #0f766e; text-decoration: none; border: 1px solid #b7e0d9; background: #effaf7; border-radius: 999px; padding: 4px 11px; }
.cd-pr:hover { background: #e0f5f0; }

/* The conversation. */
.cd-log { flex: 1; min-height: 0; overflow-y: auto; padding: 22px 20px 8px; }
.cd-thread { max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; gap: 10px; }
.cd-user { display: flex; justify-content: flex-end; margin-top: 8px; }
.cd-bubble { background: #0d1b2a; color: #fff; border-radius: 16px 16px 4px 16px; padding: 9px 14px; max-width: 78%; white-space: pre-wrap; word-wrap: break-word; }
.cd-ai p { margin: 0 0 8px; }
.cd-ai p:last-child { margin-bottom: 0; }
.cd-ai code, .cd-done code { background: #f0ede7; border-radius: 5px; padding: 1px 5px; font-size: 12.5px; }
.cd-ai a, .cd-done a, .cd-gh a { color: #0f766e; }
.cd-pre { background: #0f1720; color: #e6edf3; border-radius: 10px; padding: 12px 14px; overflow-x: auto; font-size: 12.5px; line-height: 1.5; margin: 6px 0; }

/* A command: one row, its output under it when opened. */
.cd-step { border: 1px solid #ebe7e0; background: #fff; border-radius: 10px; overflow: hidden; }
.cd-step-row { width: 100%; display: flex; align-items: center; gap: 8px; border: 0; background: transparent; padding: 7px 11px; cursor: pointer; color: #6b7280; text-align: left; font: inherit; }
.cd-step-row:disabled { cursor: default; }
.cd-step-row:hover:not(:disabled) { background: #faf8f5; }
.cd-step-chev { width: 12px; display: inline-grid; place-items: center; transition: transform .15s; }
.cd-step.is-open .cd-step-chev { transform: rotate(90deg); }
.cd-step-cmd { flex: 1; min-width: 0; color: #0d1b2a; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-ok { color: #11845b; font-weight: 700; font-size: 13px; }
.cd-bad { color: #b42318; background: #fdecea; border-radius: 999px; padding: 1px 8px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.cd-out { margin: 0; border-top: 1px solid #ebe7e0; background: #0f1720; color: #d1d9e0; padding: 10px 14px; max-height: 320px; overflow: auto; font-size: 12px; line-height: 1.5; white-space: pre-wrap; word-break: break-word; }

.cd-start { border: 1px solid #d9d4cb; background: #fff; border-radius: 999px; padding: 6px 13px; font: 13px Inter, system-ui, sans-serif; color: #0d1b2a; cursor: pointer; }
.cd-start:hover { border-color: #0d1b2a; }

/* The end of a piece of work, and what went to GitHub. */
.cd-done { display: flex; gap: 10px; align-items: flex-start; border-left: 3px solid #11845b; padding: 4px 0 4px 12px; }
.cd-done p { margin: 0 0 6px; }
.cd-done-dot { display: none; }
.cd-gh { display: flex; gap: 8px; align-items: center; color: #374151; font-size: 13px; background: #f3f1ed; border-radius: 10px; padding: 8px 12px; overflow-wrap: anywhere; }
.cd-err, .cd-errbar { color: #b42318; background: #fdecea; border-radius: 10px; padding: 8px 12px; font-size: 13px; }
.cd-errbar { max-width: 760px; margin: 0 auto 6px; width: calc(100% - 40px); box-sizing: border-box; }
.cd-note { color: #9ca3af; font-size: 12.5px; text-align: center; }

/* Working. */
.cd-thinking { display: flex; gap: 4px; padding: 6px 2px; }
.cd-thinking span { width: 6px; height: 6px; border-radius: 50%; background: #b5b1aa; animation: cd-blink 1.2s infinite ease-in-out; }
.cd-thinking span:nth-child(2) { animation-delay: .15s; }
.cd-thinking span:nth-child(3) { animation-delay: .3s; }
@keyframes cd-blink { 0%, 80%, 100% { opacity: .25; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-2px); } }
.cd-spin { width: 12px; height: 12px; border: 2px solid #ddd8cf; border-top-color: #0d1b2a; border-radius: 50%; animation: cd-turn .8s linear infinite; flex: none; }
.cd-spin-lg { width: 22px; height: 22px; }
@keyframes cd-turn { to { transform: rotate(360deg); } }

/* The box to write in. */
.cd-compose { display: flex; flex-direction: column; gap: 4px; max-width: 760px; width: calc(100% - 40px); margin: 6px auto 18px; box-sizing: border-box; background: #fff; border: 1px solid #e0dbd2; border-radius: 16px; padding: 10px 8px 8px 14px; box-shadow: 0 1px 2px rgba(13,27,42,.04), 0 4px 16px rgba(13,27,42,.04); }
.cd-compose:focus-within { border-color: #0d1b2a; }
.cd-compose textarea { border: 0; outline: none; resize: none; background: transparent; font: 14px/1.5 Inter, system-ui, sans-serif; color: #0d1b2a; padding: 2px 0; max-height: 200px; }
.cd-compose textarea::placeholder { color: #a8a39b; }
/* The model and its effort, under the text, like a code editor's chat box. */
.cd-bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cd-picks { display: flex; gap: 4px; margin-left: -6px; min-width: 0; }
.cd-pick select { appearance: none; -webkit-appearance: none; border: 0; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 7px center; border-radius: 8px; padding: 4px 22px 4px 8px; font: 500 12.5px Inter, system-ui, sans-serif; color: #4b5563; cursor: pointer; }
.cd-pick select:hover { background-color: #f3f1ed; color: #0d1b2a; }
.cd-send { width: 32px; height: 32px; border-radius: 10px; border: 0; background: #0d1b2a; color: #fff; display: grid; place-items: center; cursor: pointer; flex: none; }
.cd-send:disabled { opacity: .4; cursor: default; }
.cd-stop { background: #fff; color: #0d1b2a; border: 1px solid #d9d4cb; }

/* Empty chat, sign-in and picking a repository. */
.cd-empty { max-width: 560px; margin: 8vh auto 20px; text-align: center; }
.cd-empty b { font-size: 19px; }
.cd-empty p { color: #6b7280; margin: 8px 0 18px; }
.cd-starts { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.cd-center { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 24px; text-align: center; overflow-y: auto; }
.cd-mark { color: #0d1b2a; }
.cd-title { font-size: 21px; }
.cd-sub { color: #6b7280; max-width: 440px; margin: 0; }
.cd-btn { display: inline-flex; align-items: center; gap: 8px; border: 0; background: #0d1b2a; color: #fff; border-radius: 999px; padding: 10px 20px; font: 600 14px Inter, system-ui, sans-serif; cursor: pointer; margin-top: 6px; }
.cd-btn-2 { border: 1px solid #d9d4cb; background: #fff; color: #0d1b2a; border-radius: 999px; padding: 7px 16px; font: 13px Inter, system-ui, sans-serif; text-decoration: none; cursor: pointer; }
.cd-link { border: 0; background: none; color: #6b7280; text-decoration: underline; cursor: pointer; font: 13px Inter, system-ui, sans-serif; }
.cd-errline { color: #b42318; margin: 0; font-size: 13px; }
.cd-repos { display: flex; flex-direction: column; gap: 6px; width: 100%; max-width: 420px; max-height: 46vh; overflow-y: auto; margin: 6px 0; }
.cd-repo { display: flex; align-items: center; gap: 9px; border: 1px solid #e6e2db; background: #fff; border-radius: 10px; padding: 10px 12px; cursor: pointer; text-align: left; font: 14px Inter, system-ui, sans-serif; color: #0d1b2a; }
.cd-repo:hover { border-color: #0d1b2a; }
.cd-repo span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cd-repo em { font-style: normal; font-size: 11px; color: #6b7280; border: 1px solid #e6e2db; border-radius: 999px; padding: 1px 7px; }

@media (max-width: 760px) { .cd-head { margin-top: 0; } }
@media (max-width: 640px) {
  .cd-head { padding: 8px 14px; }
  .cd-log { padding: 16px 14px 6px; }
  .cd-compose { width: calc(100% - 28px); margin-bottom: 12px; }
  .cd-bubble { max-width: 88%; }
  .cd-pr { margin-left: 0; }
}

/* THE CLAUDE-APP LOOK (owner, 2026-11-05: "look at the frontend of this"):
   light grey bubbles, commands as quiet "Ran …" lines, several in a row in one
   box, the answer as plain text, the model and effort under the box. */
.cd-bubble { background: #efece7; color: #0d1b2a; border-radius: 18px; padding: 10px 16px; }
.cd-thread { gap: 12px; }
.cd-ai { line-height: 1.6; }
.cd-cmd-row { display: flex; align-items: center; gap: 6px; width: 100%; border: 0; background: none; padding: 4px 0; font: 14px Inter, system-ui, sans-serif; color: #8a857d; cursor: pointer; text-align: left; min-width: 0; }
.cd-cmd-row:disabled { cursor: default; }
.cd-cmd-row:hover:not(:disabled) { color: #4b5563; }
.cd-cmd-verb { flex: none; }
.cd-cmd-text { font: 14px Inter, system-ui, sans-serif; color: inherit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.cd-caret { flex: none; font-size: 10px; }
/* The picture a Read step opened, small, under the step (the owner, 2026-11-08: "Fix those 3"; like Claude Code's). */
.cd-cmd-pics { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 0 8px 21px; }
.cd-cmd-pics img { display: block; max-width: min(260px, 100%); max-height: 180px; border: 1px solid #ebe7e0; border-radius: 8px; background: #fff; }
/* WHAT A WRITE CHANGED, under its step (the owner, 2026-11-09): numbered lines, folded after the first few. */
.cd-wcount { display: inline-flex; align-items: center; margin-left: 2px; }
.cd-wcount .cd-add, .cd-wcount .cd-del { margin-left: 6px; font-size: 12.5px; }
.cd-wchg { margin: 0 0 8px 21px; border: 1px solid #ebe7e0; border-radius: 8px; background: #fbfaf8; overflow: hidden; }
.cd-wchg pre { margin: 0; padding: 6px 0; font: 12px/1.55 "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace; overflow-x: auto; tab-size: 4; } /* tab-indented code at its usual width (Claude Code 2.1.181 fixed its Write preview's tabs) */
.cd-wchg pre span { display: block; padding: 0 12px 0 0; white-space: pre; }
.cd-wchg .cd-dl-hunk { padding-left: 12px; }
.cd-wl i { display: inline-block; min-width: 3.4em; padding-right: 12px; text-align: right; color: #a19c94; font-style: normal; user-select: none; }
.cd-wchg-more { display: block; width: 100%; border: 0; border-top: 1px solid #efece7; background: #fff; padding: 6px 12px; font: 500 12.5px Inter, system-ui, sans-serif; color: #0f766e; cursor: pointer; text-align: left; }
.cd-wchg-more:hover { background: #f7f5f1; }
.cd-wchg-note { margin: 0; padding: 6px 12px; border-top: 1px solid #efece7; font-size: 12.5px; color: #6b7280; }
/* THE FILES A COMMAND CHANGED (Claude Code's "Updated path (+N -M)" after the command), each with its lines below. */
.cd-files { margin: 0 0 8px 21px; }
.cd-fchg-head { margin: 2px 0 4px; font-size: 13px; color: #374151; display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.cd-fchg-head b { font-weight: 600; color: #1f2937; }
.cd-fchg-head code { font: 12.5px "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace; color: #1f2937; overflow-wrap: anywhere; }
.cd-fchg-bin { margin-left: 6px; font-size: 12px; color: #6b7280; }
.cd-files .cd-wchg { margin-left: 0; }
.cd-fchg-note { margin: 2px 0 6px; font-size: 12.5px; color: #6b7280; }
.cd-fchg-note code { font: 12px "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace; color: #374151; }
/* THE NEW PROBLEMS A WRITE MADE (the owner, 2026-11-09): one line under the step, the list a tap away. */
.cd-probs { margin: -2px 0 8px 21px; }
.cd-probs-row { display: inline-flex; align-items: center; gap: 10px; border: 1px solid #f3d9a4; background: #fffaf0; color: #92400e; border-radius: 999px; padding: 3px 12px; font: 500 12.5px Inter, system-ui, sans-serif; cursor: pointer; }
.cd-probs-row span { color: #0f766e; }
.cd-probs-list { margin: 6px 0 0; padding: 8px 12px; border: 1px solid #f3d9a4; border-radius: 8px; background: #fffdf7; color: #7c2d12; font: 12px/1.55 "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; overflow-x: auto; }
.cd-cmd .cd-out { margin: 4px 0 8px; border: 1px solid #ebe7e0; border-radius: 10px; background: #fff; color: #4b5563; max-height: 260px; }
.cd-group-head { display: flex; align-items: center; gap: 6px; border: 0; background: none; padding: 4px 0; font: 14px Inter, system-ui, sans-serif; color: #8a857d; cursor: pointer; }
.cd-group-head:hover { color: #4b5563; }
.cd-group-box { border: 1px solid #e6e2db; border-radius: 12px; background: #fff; margin-top: 6px; }
.cd-group-box .cd-cmd { padding: 0 16px; }
.cd-group-box .cd-cmd + .cd-cmd { border-top: 1px solid #efece7; }
.cd-group-box .cd-cmd-row { padding: 12px 0; }
.cd-bad { margin-left: 6px; color: #b42318; background: #fdecea; border-radius: 999px; padding: 1px 8px; font-size: 11.5px; font-weight: 600; flex: none; }
/* The box: rounded, the model and effort under it on the right. */
.cd-composewrap { max-width: 760px; width: calc(100% - 40px); margin: 6px auto 14px; }
.cd-compose { flex-direction: row; align-items: center; width: 100%; margin: 0; border-radius: 22px; padding: 10px 10px 10px 18px; }
.cd-compose textarea { padding: 4px 0; }
.cd-send { border-radius: 50%; }
.cd-picks { display: flex; justify-content: flex-end; gap: 2px; margin: 6px 4px 0 0; }
.cd-pick select { background-color: transparent; color: #6b7280; font-size: 12.5px; }
@media (max-width: 640px) { .cd-composewrap { width: calc(100% - 28px); margin-bottom: 10px; } }
.cd-compose textarea { flex: 1; min-width: 0; }
.cd .cd-cmd-text { font-family: Inter, -apple-system, system-ui, sans-serif; }

/* The two buttons in the top bar, and the changes panel under it. */
.cd-hbtn { border: 1px solid #e0dbd2; background: #fff; color: #0d1b2a; border-radius: 999px; padding: 4px 12px; font: 600 12.5px Inter, system-ui, sans-serif; cursor: pointer; }
.cd-hbtn:hover { border-color: #0d1b2a; }
.cd-hbtn[aria-pressed="true"] { background: #0d1b2a; color: #fff; border-color: #0d1b2a; }
.cd-changes { max-width: 760px; margin: 12px auto 0; width: calc(100% - 40px); border: 1px solid #e6e2db; border-radius: 12px; background: #fff; max-height: 42vh; overflow: auto; }
.cd-changes-sum { padding: 10px 16px; font-size: 13px; color: #4b5563; border-bottom: 1px solid #efece7; }
.cd-compare { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-bottom: 1px solid #efece7; font-size: 13px; color: #4b5563; }
.cd-compare select { font: inherit; font-size: 13px; padding: 4px 8px; border: 1px solid #ddd8d0; border-radius: 8px; background: #fff; color: #1f2937; max-width: 60%; }
.cd-compare-vs { color: #6b7280; margin-left: 6px; }
.cd-changes-none { margin: 0; padding: 14px 16px; color: #6b7280; }
.cd-add { color: #11845b; font-weight: 600; margin-left: 6px; font-size: 12.5px; }
.cd-del { color: #b42318; font-weight: 600; margin-left: 4px; font-size: 12.5px; }
.cd-file + .cd-file { border-top: 1px solid #efece7; }
.cd-file summary { display: flex; align-items: center; gap: 4px; padding: 9px 16px; cursor: pointer; list-style: none; }
.cd-file summary code { flex: 1; min-width: 0; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cd-diff { margin: 0; padding: 8px 0; background: #fbfaf8; border-top: 1px solid #efece7; font-size: 12px; line-height: 1.55; overflow-x: auto; }
.cd-diff span { display: block; padding: 0 16px; white-space: pre; }
.cd-dl-add { background: #e9f7ef; color: #0f5132; }
/* An edit's change on the card for a protected file (edit, tool 3): one line each, coloured edge to edge. */
.cd-writeask .cd-envchange-pre .cd-wl { display: block; margin: 0 -12px; padding: 0 12px; white-space: pre-wrap; }
/* A LONG LINE ON THE CARD WRAPS, so the "…" that shows it was cut is in view (live test, 2026-11-09: a 380-character line
   ran past the card's right edge and its "…" was seen only by scrolling sideways; the owner: "Yes fix"). */
.cd-writeask .cd-envchange-pre { overflow-wrap: anywhere; }
.cd-dl-del { background: #fdecea; color: #842029; }
.cd-dl-hunk { color: #8a857d; }

/* THE CHAT'S BAR (title, repository, branch, pull request, See changes). */
.gf-app .cd-head { justify-content: flex-start; padding: 12px 24px; }
.cd-title-bar { font-size: 14.5px; font-weight: 600; max-width: 34ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cd-repo-bar { display: inline-flex; align-items: center; gap: 5px; color: #6b7280; font-size: 13px; }
.cd-head .cd-pr { margin-left: auto; }
.cd-menu { display: none; border: 1px solid #e0dbd2; background: #fff; border-radius: 9px; width: 34px; height: 32px; font-size: 16px; cursor: pointer; color: #0d1b2a; }
.cd-head-min { display: none; border-bottom: 0; }
/* ONE LINE ON A COMPUTER (owner, 2026-11-06): a long branch or title is
   shortened with "…" (the whole name shows on hover) instead of pushing the
   buttons onto a second line. The branch gives way first, then the title; the
   repository stays whole unless the window is narrow. */
.cd-ell { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
@media (min-width: 761px) {
  .gf-app .cd-head { flex-wrap: nowrap; }
  .gf-app .cd-head > * { flex: none; }
  .gf-app .cd-head > .cd-branch { flex: 0 3 auto; min-width: 7ch; }
  .gf-app .cd-head > .cd-title-bar { flex: 0 2 auto; min-width: 8ch; }
}
@media (min-width: 761px) and (max-width: 1099px) {
  .gf-app .cd-head > .cd-repo-bar { flex: 0 1 auto; min-width: 8ch; }
}
@media (max-width: 760px) {
  .cd-menu { display: inline-block; }
  .cd-head-min { display: flex; }
  .gf-app .cd-head { padding: 10px 14px; }
  .cd-head .cd-pr { margin-left: 0; }
  .cd-title-bar { max-width: 60vw; }
}

/* A long command still running, in the background. */
.cd-bgchip { margin-left: 6px; color: #6b7280; background: #efece7; border-radius: 999px; padding: 1px 8px; font-size: 11.5px; font-weight: 600; flex: none; }
.cd-cmd.is-bg .cd-cmd-verb { color: #b07a1a; }
/* Comments on the changes: tap a line, write, it goes with the next message. */
.cd-dl { cursor: pointer; }
.cd-dl:hover { outline: 1px solid #cfc8bd; outline-offset: -1px; }
.cd-cbox { display: flex !important; gap: 6px; padding: 6px 16px 8px !important; background: #fff; white-space: normal !important; }
.cd-cbox input { flex: 1; border: 1px solid #d9d4cb; border-radius: 8px; padding: 6px 10px; font: 13px Inter, system-ui, sans-serif; outline: none; }
.cd-cbox input:focus { border-color: #0d1b2a; }
.cd-cbox button { border: 1px solid #d9d4cb; background: #fff; border-radius: 8px; padding: 4px 10px; font: 600 12.5px Inter, system-ui, sans-serif; cursor: pointer; }
.cd-cbox button:first-of-type { background: #0d1b2a; color: #fff; border-color: #0d1b2a; }
.cd-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.cd-chip { display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1px solid #e0dbd2; border-radius: 999px; padding: 3px 6px 3px 10px; font-size: 12.5px; color: #374151; max-width: 100%; }
.cd-chip button { border: 0; background: none; color: #8a857d; cursor: pointer; font-size: 15px; line-height: 1; }
/* Slash commands: the menu above the box. */
.cd-composewrap { position: relative; }
.cd-localnote { color: #6b7280; font-size: 13px; background: #f3f1ed; border-radius: 10px; padding: 8px 12px; white-space: pre-wrap; }

/* Coder's own "are you sure?" */
.cd-sure{position:fixed;inset:0;z-index:100;background:rgba(20,20,19,.35);display:flex;align-items:center;justify-content:center;padding:16px}
.cd-sure-box{background:#fff;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.18);width:100%;max-width:400px;padding:20px 20px 16px}
.cd-sure-title{font-size:16px;font-weight:600;color:#1f1e1d;margin-bottom:6px;overflow-wrap:anywhere}
.cd-sure-text{font-size:14px;color:#6b6a68;line-height:1.45}
.cd-sure-row{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.cd-sure-row button{font:inherit;font-size:14px;border-radius:10px;padding:8px 14px;cursor:pointer;border:1px solid #e5e3dd;background:#fff;color:#1f1e1d}
.cd-sure-row .cd-sure-yes{background:#b3261e;border-color:#b3261e;color:#fff}
.cd-sure-row button:hover{filter:brightness(.96)}

/* Coder's checklist (the todo tool), only the latest one is shown. */
.cd-todo{border:1px solid #e5e3dd;border-radius:12px;padding:10px 14px;margin:8px 0;background:#fff;font-size:14px}
.cd-todo b{display:block;font-size:12px;color:#6b6a68;font-weight:600;margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em}
.cd-todo-i{display:flex;gap:8px;align-items:flex-start;padding:3px 0;color:#1f1e1d}
.cd-todo-box{flex:none;width:16px;height:16px;border:1.5px solid #c9c6bf;border-radius:4px;display:grid;place-items:center;font-size:11px;line-height:1;margin-top:2px}
.cd-todo-i.is-done{color:#8a8884;text-decoration:line-through}
.cd-todo-i.is-done .cd-todo-box{background:#1f6f5c;border-color:#1f6f5c;color:#fff}
.cd-todo-i.is-in_progress .cd-todo-box{border-color:#1f1e1d;font-weight:700}

/* Coder's question (ask_user): the options are buttons. */
/* CODER'S QUESTION, LIKE CLAUDE CODE'S (owner, 2026-11-06, "2"): the question on
   top, each choice with its explanation, Other with a box to type, Skip and Submit. */
.cd-ask{border:1px solid #e5e3dd;border-radius:14px;margin:8px 0;background:#fff;overflow:hidden;max-width:480px}
.cd-ask-q{font-size:14.5px;font-weight:600;color:#1f1e1d;line-height:1.45;padding:12px 16px;background:#f7f6f2;border-bottom:1px solid #ece9e2}
.cd-ask.is-many{max-width:520px}
.cd-ask-one+.cd-ask-one .cd-ask-q{border-top:1px solid #ece9e2}
.cd-ask-h{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.02em;color:#5b4a2e;background:#f1e7d3;border-radius:999px;padding:2px 9px;margin:0 8px 0 0;vertical-align:1px}
.cd-ask-multi{display:inline-block;font-size:11.5px;font-weight:500;color:#6b6a66;margin-left:8px}
.cd-ask-list{display:flex;flex-direction:column}
.cd-ask-row{display:flex;gap:12px;align-items:flex-start;padding:12px 16px;border-bottom:1px solid #f0eee8;cursor:pointer}
.cd-ask-row:last-child{border-bottom:0}
.cd-ask-row input[type="radio"],.cd-ask-row input[type="checkbox"]{margin:2px 0 0;width:17px;height:17px;flex:none;accent-color:#1f1e1d;cursor:pointer}
.cd-ask-t{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.cd-ask-t b{font-size:14.5px;font-weight:600;color:#1f1e1d}
.cd-ask-t small{font-size:13px;color:#6b6a66;line-height:1.45}
.cd-ask-in{font:inherit;font-size:14px;color:#1f1e1d;border:1px solid #d9d6cf;border-radius:8px;padding:7px 10px;margin-top:6px;width:100%;box-sizing:border-box;background:#fff}
.cd-ask-in:focus{outline:none;border-color:#1f1e1d}
.cd-ask-btns{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid #ece9e2}
.cd-ask-btns button{font:inherit;font-size:14px;font-weight:600;border-radius:999px;padding:8px 16px;cursor:pointer}
.cd-ask-skip{border:1px solid #d9d6cf;background:#fff;color:#1f1e1d}
.cd-ask-go{border:1px solid #1f1e1d;background:#1f1e1d;color:#fff}
.cd-ask-go kbd{font:inherit;font-size:11px;font-weight:500;opacity:.7;margin-left:6px}
.cd-ask:not(.is-live) .cd-ask-row{cursor:default;opacity:.6}
.cd-ask-wait{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:#9a5b00;background:#fdf1d8;border-radius:999px;padding:3px 10px;margin:0 0 10px}
.cd-ask-wait::before{content:"";width:8px;height:8px;border-radius:50%;background:#e8a10c}
/* THE SECRET CARD (owner, 2026-11-06): Claude Code's network-secret card, in Coder's colours. */
.cd-secret{border:1px solid #e5e3dd;border-radius:18px;padding:22px 20px 18px;margin:10px 0;background:#faf9f5;text-align:center}
.cd-secret-icon{width:52px;height:52px;margin:0 auto 12px;border-radius:12px;background:#1f1e1d;color:#fff;display:flex;align-items:center;justify-content:center}
.cd-secret-t{display:block;font-size:16px;color:#1f1e1d;margin-bottom:8px}
.cd-secret-why{font-size:14px;color:#1f1e1d;margin:0 0 6px;line-height:1.45}
.cd-secret-how{font-size:12.5px;color:#6b6a66;margin:0 0 8px}.cd-secret-how code{background:#f0ede7;border-radius:5px;padding:1px 6px}
.cd-secret-p{font-size:13.5px;color:#6b6a66;margin:0 0 14px;line-height:1.5;text-align:left}
.cd-secret-l{display:block;text-align:left;font-size:13px;color:#6b6a66;margin:0 0 6px 4px}
.cd-secret-in{width:100%;box-sizing:border-box;font:inherit;font-size:15px;border:1px solid #d9d6cf;border-radius:999px;padding:11px 16px;background:#fff;color:#1f1e1d;outline:none}
.cd-secret-in:focus{border-color:#1f1e1d}
.cd-secret-err{color:#b3261e;font-size:13px;text-align:left;margin:8px 4px 0}
.cd-secret-btns{display:flex;gap:10px;margin-top:16px}
.cd-secret-btns button{flex:1;font:inherit;font-size:15px;font-weight:600;border-radius:999px;padding:11px 0;cursor:pointer}
.cd-secret-no{border:1px solid #d9d6cf;background:#fff;color:#1f1e1d}
.cd-secret-save{border:1px solid #1f1e1d;background:#1f1e1d;color:#fff}
.cd-secret-save:disabled{background:#a9a7a1;border-color:#a9a7a1;cursor:default}

/* Pictures in the chat box and in your messages; @ file suggestions. */
.cd-compose{position:relative}
.cd-attach{position:absolute;left:8px;bottom:8px;border:0;background:transparent;color:#6b6a68;cursor:pointer;padding:6px;border-radius:8px}
.cd-attach:hover{background:#f3f1ec;color:#1f1e1d}
.cd-compose textarea{margin-bottom:30px}
.cd-pics{display:flex;gap:8px;max-width:760px;width:calc(100% - 40px);margin:6px auto 0;flex-wrap:wrap}
.cd-pic{position:relative;width:64px;height:64px;border-radius:10px;overflow:hidden;border:1px solid #e0dbd2;background:#fff}
.cd-pic img{width:100%;height:100%;object-fit:cover}
.cd-pic button{position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;font-size:13px;line-height:20px;padding:0;cursor:pointer}
.cd-user{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.cd-thumbs{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.cd-thumbs img{max-width:180px;max-height:140px;border-radius:12px;border:1px solid #e0dbd2}
.cd-imgnote{font-size:12px;color:#8a8884}
.cd-mention{max-width:760px;width:calc(100% - 40px);margin:6px auto 0;background:#fff;border:1px solid #e0dbd2;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.08);overflow:hidden}
.cd-mention-i{display:block;width:100%;text-align:left;border:0;background:#fff;padding:8px 14px;font:13px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#1f1e1d;cursor:pointer}
.cd-mention-i.on,.cd-mention-i:hover{background:#f3f1ec}

/* Review menu */
.cd-revwrap{position:relative;display:inline-block}
.cd-revmenu{position:absolute;top:calc(100% + 6px);right:0;z-index:20;background:#fff;border:1px solid #e0dbd2;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.12);padding:6px;min-width:240px;display:flex;flex-direction:column}
.cd-revmenu button{border:0;background:#fff;text-align:left;padding:8px 10px;border-radius:8px;cursor:pointer;font:inherit;display:flex;flex-direction:column;gap:2px}
.cd-revmenu button:hover{background:#f3f1ec}
.cd-revmenu b{font-size:14px;color:#1f1e1d;font-weight:600}
.cd-revmenu small{font-size:12px;color:#6b6a68}

/* The repo's environment panel */
.cd-envp{max-width:760px;width:calc(100% - 40px);margin:12px auto;background:#fff;border:1px solid #e0dbd2;border-radius:14px;padding:16px 18px;box-sizing:border-box}
.cd-envp h3{margin:0 0 10px;font-size:15px;color:#1f1e1d}
.cd-envl{display:block;font-size:13px;font-weight:600;color:#1f1e1d;margin:12px 0 6px}
.cd-envl small{display:block;font-weight:400;color:#6b6a68;margin-top:2px}
.cd-envp textarea{width:100%;box-sizing:border-box;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;border:1px solid #e0dbd2;border-radius:10px;padding:8px 10px;resize:vertical}
.cd-envrow{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid #f0eee8;font-size:13px}
.cd-envrow code{font-weight:600}.cd-envrow span{color:#6b6a68;flex:1}
.cd-envrow button{border:0;background:transparent;color:#b3261e;font-size:16px;cursor:pointer}
.cd-envadd{display:flex;gap:8px;margin-top:8px}
.cd-envadd input{flex:1;min-width:0;border:1px solid #e0dbd2;border-radius:10px;padding:7px 10px;font:13px ui-monospace,SFMono-Regular,Menlo,monospace}
.cd-envfoot{display:flex;align-items:center;gap:12px;margin-top:14px}
.cd-muted{color:#6b6a68;font-size:13px;margin:0}

.cd-autofix.on{background:#e8f5ef;border-color:#a7d7c2;color:#145a43}

/* STEPS, option A without colours (owner, 2026-11-05): grey icon tile, dark verb, code-type target, status on the right. */
.cd-sic{flex:none;width:26px;height:26px;border-radius:8px;background:#f1efea;color:#57534e;display:grid;place-items:center;margin-right:4px}
.cd .cd-cmd-row{gap:8px;color:#1f1e1d}
.cd .cd-cmd-verb{font-weight:600;color:#1f1e1d}
.cd .cd-cmd-text{font:13px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#44403c}
/* A COMMAND'S DESCRIPTION as its step's title (tool 4, like Claude Code's app), and the command itself, as typed at a
   terminal, above its output when the step is opened. */
.cd .cd-cmd-desc{font:14px/1.4 Inter,system-ui,sans-serif;color:#1f1e1d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.cd-cmd .cd-cmd-in{margin:4px 0 0;padding:8px 12px;border:1px solid #ebe7e0;border-radius:10px;background:#faf9f7;color:#1f1e1d;font:12.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere;max-height:160px;overflow:auto}
.cd-st{margin-left:auto;flex:none;font-size:12px;color:#8a8884;display:inline-flex;align-items:center;gap:5px;padding-left:10px}
.cd-st-ok{color:#57534e;font-size:13px}
.cd-st-bad{color:#b3261e;font-weight:600}
.cd-st-bg i{width:8px;height:8px;border-radius:50%;background:#a8a29e;display:inline-block}
.cd-group-box .cd-cmd-row{padding:9px 0}

.cd .cd-cmd.is-bg .cd-cmd-row, .cd .cd-cmd.is-bg .cd-cmd-verb { color: #1f1e1d; }

/* ENVIRONMENT CHANGE CARD and the network switch (owner, 2026-11-06). */
.cd-envchange-pre{text-align:left;background:#fff;border:1px solid #e5e3dd;border-radius:10px;padding:10px 12px;font-size:12.5px;line-height:1.5;max-height:240px;overflow:auto;white-space:pre-wrap;margin:0 0 4px}
.cd-envnet{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:#1f1e1d;margin:2px 0 8px;line-height:1.4}
.cd-envnet input{margin-top:3px}
.cd-secret-icon svg{width:26px;height:26px}
/* ANSWERS, formatted (owner, 2026-11-06). */
.cd-ai ul, .cd-ai ol { margin: 4px 0 10px; padding-left: 22px; }
.cd-ai li { margin: 3px 0; }
.cd-ai h4 { font-size: 15px; margin: 12px 0 6px; }
.cd-ai .cd-cite { display: inline-block; font-size: 11px; line-height: 16px; min-width: 16px; padding: 0 4px; margin: 0 1px; text-align: center; border-radius: 8px; background: #f0ede7; color: #4a4945; text-decoration: none; vertical-align: 1px; }
.cd-ai .cd-cite:hover { background: #e5e1d8; }
/* THE ENVIRONMENT WINDOW (owner, 2026-11-06: like Claude Code's "Edit cloud environment"). */
.cd-em{position:fixed;inset:0;z-index:90;background:rgba(20,20,19,.35);display:flex;align-items:center;justify-content:center;padding:16px}
.cd-em-box{background:#fff;border-radius:18px;box-shadow:0 12px 40px rgba(0,0,0,.18);width:100%;max-width:640px;max-height:calc(100vh - 32px);overflow:auto;padding:20px 22px 18px;text-align:left}
.cd-em-head{display:flex;align-items:center;gap:8px;margin-bottom:16px}
.cd-em-head b{flex:1;font-size:17px;color:#1f1e1d;font-weight:600}
.cd-em-x{border:0;background:none;font-size:24px;line-height:1;color:#1f1e1d;cursor:pointer;padding:2px 6px;border-radius:8px}
.cd-em-x:hover{background:#f0eee8}
.cd-em-rows{display:flex;flex-direction:column;gap:12px}
.cd-em-row{display:flex;align-items:center;justify-content:space-between;text-align:left;font:inherit;border:1px solid #e5e3dd;border-radius:14px;background:#fff;padding:16px 18px;cursor:pointer;color:#1f1e1d}
.cd-em-row:hover{background:#faf9f5}
.cd-em-row span:first-child{display:flex;flex-direction:column;gap:3px;min-width:0}
.cd-em-row b{font-size:15px;font-weight:500}
.cd-em-row small{font-size:13.5px;color:#6b6a66;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-em-row span:last-child{font-size:22px;color:#6b6a66}
.cd-em-opts{display:flex;flex-direction:column;border:1px solid #e5e3dd;border-radius:14px;overflow:hidden}
.cd-em-opt{position:relative;display:flex;flex-direction:column;gap:3px;text-align:left;font:inherit;border:0;border-bottom:1px solid #f0eee8;background:#fff;padding:12px 44px 12px 16px;cursor:pointer;color:#1f1e1d}
.cd-em-opt:last-child{border-bottom:0}
.cd-em-opt.on{background:#f0eee8}
.cd-em-opt b{font-size:15px;font-weight:500}
.cd-em-opt small{font-size:13.5px;color:#6b6a66}
.cd-em-opt span{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#2563eb;font-size:18px}
.cd-em-l{display:block;font-size:14px;font-weight:500;color:#1f1e1d;margin:16px 0 6px}
.cd-em-in{width:100%;box-sizing:border-box;font:inherit;font-size:14.5px;border:1px solid #e5e3dd;border-radius:10px;padding:10px 12px;background:#fff;color:#1f1e1d}
.cd-em-help{font-size:13px;color:#6b6a66;line-height:1.45;margin:6px 0 0}
.cd-em-list{display:flex;flex-direction:column;gap:6px;margin:4px 0 10px}
.cd-em-li{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid #e5e3dd;border-radius:10px;padding:8px 12px}
.cd-em-li span{display:flex;flex-direction:column;min-width:0}
.cd-em-li small{font-size:12.5px;color:#6b6a66;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-em-li button{border:0;background:none;font-size:18px;color:#6b6a66;cursor:pointer}
.cd-em-addrow{display:flex;gap:8px}
.cd-em-addrow input{flex:1;font:inherit;font-size:14px;border:1px solid #e5e3dd;border-radius:10px;padding:9px 12px}
.cd-em-hdrs{display:grid;grid-template-columns:1.3fr 1fr 1.4fr 28px;gap:6px 8px;align-items:center;margin-top:8px}
.cd-em-hdrs>span{font-size:12.5px;color:#6b6a66}
.cd-em-hdrs input,.cd-em-hdrs select{min-width:0;font:inherit;font-size:14px;border:1px solid #e5e3dd;border-radius:10px;padding:8px 10px;background:#fff}
.cd-em-hdrs button{border:0;background:none;font-size:18px;color:#6b6a66;cursor:pointer}
.cd-em-hdrs button:disabled{opacity:.3}
.cd-em-plus{margin-top:10px}
.cd-em-curl{margin-top:12px;font-size:13.5px;color:#1f1e1d}
.cd-em-curl pre{background:#faf9f5;border:1px solid #e5e3dd;border-radius:10px;padding:10px;font-size:12.5px;white-space:pre-wrap;margin-top:6px}
.cd-em-code{border:1px solid #e5e3dd;border-radius:14px;overflow:hidden}
.cd-em-codebar{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid #f0eee8}
.cd-em-tag{font-size:12.5px;border:1px solid #e5e3dd;border-radius:999px;padding:2px 10px;margin-right:auto}
.cd-em-file{font-size:13.5px;cursor:pointer}
.cd-em-codebar button{border:0;background:none;cursor:pointer;font-size:15px;color:#6b6a66}
.cd-em-code textarea{display:block;width:100%;box-sizing:border-box;min-height:220px;border:0;outline:none;resize:vertical;font:13.5px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;padding:12px 14px;color:#1f1e1d}
.cd-em-codefoot{font-size:12.5px;color:#6b6a66;border-top:1px solid #f0eee8;padding:6px 12px;background:#faf9f5}
.cd-em-vars{display:block;width:100%;box-sizing:border-box;min-height:170px;font:13.5px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;border:1px solid #e5e3dd;border-radius:12px;padding:12px 14px;resize:vertical;color:#1f1e1d}
.cd-em-foot{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:20px}
.cd-em-err{margin-right:auto;font-size:13px;color:#b3261e}
.cd-em-cancel,.cd-em-yes{font:inherit;font-size:14.5px;border-radius:10px;padding:9px 16px;cursor:pointer;border:1px solid #e5e3dd;background:#f5f4f0;color:#1f1e1d}
.cd-em-yes{background:#1f1e1d;border-color:#1f1e1d;color:#fff}
.cd-em-yes:disabled{opacity:.5}
.cd-em-area{min-height:120px;font:12.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;resize:vertical}

/* ENVIRONMENTS LIKE CLAUDE CODE'S (owner, 2026-11-06): the picker under the box
   (before the first message), the name box, Archive, and the new-environment card. */
.cd-picks .cd-pick-env { display: inline-flex; align-items: center; gap: 3px; margin-right: auto; padding-left: 8px; color: #6b7280; }
.cd-picks .cd-pick-env svg { flex: none; }
.cd-pick-env select { max-width: 200px; text-overflow: ellipsis; }
/* The starting branch (2026-11-06, like Claude Code), before the environment. */
.cd-picks .cd-pick-branch { display: inline-flex; align-items: center; gap: 3px; padding-left: 8px; color: #6b7280; }
.cd-picks .cd-pick-branch svg { flex: none; }
.cd-pick-branch select { max-width: 160px; text-overflow: ellipsis; }
.cd-em-top { margin: -4px 0 12px; }
.cd-em-archive { display: block; margin: 14px auto 0; border: 0; background: none; color: #b3261e; font: inherit; font-size: 13.5px; cursor: pointer; padding: 6px 10px; border-radius: 8px; }
.cd-em-archive:hover { background: #fbeeed; }
.cd-sure-in { display: block; width: 100%; box-sizing: border-box; margin-top: 12px; font: inherit; font-size: 14px; border: 1px solid #d9d6cf; border-radius: 10px; padding: 9px 12px; color: #1f1e1d; }
.cd-sure-in:focus { outline: none; border-color: #1f1e1d; }
.cd-sure-box.is-text .cd-sure-row .cd-sure-yes { background: #1f1e1d; border-color: #1f1e1d; }
.cd-ne { text-align: left; border: 1px solid #e5e3dd; border-radius: 12px; background: #fff; padding: 12px 14px; margin: 10px 0 8px; }
.cd-ne-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 8px; border-bottom: 1px solid #f0eee8; }
.cd-ne-head b { font-size: 14.5px; color: #1f1e1d; }
.cd-ne-head span { font-size: 12.5px; color: #6b6a66; }
.cd-ne-sec { padding-top: 10px; }
.cd-ne-sec small { display: block; font-size: 12.5px; color: #6b6a66; margin-bottom: 4px; }
.cd-ne-sec > div { font-size: 13.5px; color: #1f1e1d; }
.cd-ne-plus { color: #1a7f37; font-weight: 700; margin-right: 8px; }
.cd-ne-n { display: inline-block; width: 1.8em; color: #a9a7a1; user-select: none; }

/* REWIND (2026-11-06, like Claude Code): a small button on your messages, and its three choices. */
.cd-user{position:relative}
.cd-rewind{display:block;margin:0 0 4px auto;font:inherit;font-size:12px;color:#6b7280;background:none;border:0;padding:2px 4px;cursor:pointer;opacity:.75}
.cd-rewind:hover,.cd-rewind:focus{opacity:1;text-decoration:underline}
.cd-pick-col{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.cd-pick-col button{font:inherit;font-size:14px;border-radius:10px;padding:9px 14px;cursor:pointer;border:1px solid #e5e3dd;background:#fff;color:#1f1e1d;text-align:left}
.cd-pick-col button:hover{filter:brightness(.96)}
.cd-pick-col .cd-sure-no{text-align:center;color:#6b7280}

/* SEVERAL REPOSITORIES IN ONE CHAT (2026-11-06, like Claude Code): the menu to add one, and a tag for each. */
.cd-picks .cd-pick-repo { display: inline-flex; align-items: center; gap: 3px; padding-left: 8px; color: #6b7280; }
.cd-picks .cd-pick-repo svg { flex: none; }
.cd-pick-repo select { max-width: 150px; text-overflow: ellipsis; }
.cd-repo-chip { display: inline-flex; align-items: center; gap: 2px; margin-left: 6px; padding: 2px 4px 2px 9px; border: 1px solid #e5e3dd; border-radius: 999px; font-size: 12px; color: #4b5563; background: #fff; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cd-repo-chip button { font: inherit; border: 0; background: none; color: #6b7280; cursor: pointer; padding: 0 4px; }
/* A READ-ONLY REPOSITORY (owner item 5): its label, the box to open any public repository, the patch download. */
.cd-ro { display: inline-flex; align-items: center; font-size: 11px; color: #92400e; background: #fef3c7; border: 1px solid #fde68a; border-radius: 999px; padding: 1px 8px; white-space: nowrap; }
.cd-open { display: flex; flex-direction: column; gap: 6px; width: 100%; max-width: 440px; margin: 4px 0 2px; text-align: left; }
.cd-open label { font-size: 13px; color: #4b5563; }
.cd-open-row { display: flex; gap: 8px; }
.cd-open-row input { flex: 1; min-width: 0; border: 1px solid #ddd8d0; border-radius: 10px; padding: 9px 12px; font: 14px Inter, system-ui, sans-serif; color: #0d1b2a; background: #fff; }
.cd-open-row input:focus { outline: none; border-color: #0d1b2a; }
.cd-open-note { margin: 0; font-size: 12px; color: #6b7280; }
.cd-patch { margin-left: 8px; }
/* CODE REVIEW, PER REPOSITORY (owner item 11): on the Repositories screen. */
.cd-repo-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.cd-repo-row .cd-repo { flex: 1 1 260px; min-width: 0; }
.cd-review { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #4b5563; }
.cd-review label { display: flex; align-items: center; gap: 6px; }
.cd-review select { font: inherit; font-size: 12px; padding: 4px 6px; border: 1px solid #ddd8d0; border-radius: 8px; background: #fff; color: #1f2937; }
.cd-review-note code { font-size: 12px; background: #f1eee9; border-radius: 4px; padding: 1px 4px; }
/* NOTIFICATIONS (owner item 8): the panel from the account menu. */
.cd-notify { max-width: 440px; }
.cd-notify-device { margin: 14px 0 6px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; color: #4b5563; }
.cd-notify-device button { font: inherit; font-size: 14px; border-radius: 10px; padding: 8px 14px; cursor: pointer; border: 1px solid #e5e3dd; background: #fff; color: #1f1e1d; }
.cd-notify-device .cd-notify-go { background: #1f1e1d; border-color: #1f1e1d; color: #fff; }
.cd-notify-on { color: #166534; font-weight: 600; }
.cd-notify-sw { display: flex; gap: 10px; align-items: flex-start; margin-top: 10px; font-size: 13px; color: #6b6a68; line-height: 1.4; cursor: pointer; }
.cd-notify-sw b { color: #1f1e1d; font-weight: 600; }
.cd-notify-sw input { margin-top: 3px; }
.cd-notify-note { margin-top: 10px; font-size: 13px; color: #1f1e1d; }
.cd-sure-row .cd-notify-done { background: #1f1e1d; border-color: #1f1e1d; color: #fff; }
.cd-notify-hint { flex-basis: 100%; font-size: 12px; color: #6b7280; }

/* CONNECTORS (MCP, 2026-11-10; the look of Claude's connectors page, 2026-11-11): a page over the app. */
.cx { position: fixed; inset: 0; z-index: 90; background: #faf9f7; overflow-y: auto; font-family: Inter, system-ui, sans-serif; color: #1f1e1d; }
.cx-in { max-width: 860px; margin: 0 auto; padding: 28px 24px 60px; }
.cx-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cx-h { font-size: 22px; font-weight: 600; }
.cx-x { border: 0; background: none; color: #6b6a68; cursor: pointer; padding: 6px; border-radius: 8px; display: flex; }
.cx-x:hover, .cx-backb:hover { background: #efede8; }
.cx-sub, .cx-desc { font-size: 14px; color: #6b6a68; line-height: 1.5; margin: 8px 0 0; }
.cx-bar { display: flex; align-items: center; gap: 10px; margin: 20px 0 14px; flex-wrap: wrap; }
.cx-seg { display: flex; background: #efede8; border-radius: 10px; padding: 3px; }
.cx-seg button { font: inherit; font-size: 14px; border: 0; background: none; padding: 6px 14px; border-radius: 8px; cursor: pointer; color: #6b6a68; }
.cx-seg button.on { background: #fff; color: #1f1e1d; box-shadow: 0 1px 2px rgba(0,0,0,.08); font-weight: 500; }
.cx-search { flex: 1 1 200px; display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid #e5e3dd; border-radius: 10px; padding: 0 12px; color: #8b8a86; min-width: 0; }
.cx-search input { flex: 1; border: 0; outline: 0; font: inherit; font-size: 14px; padding: 8px 0; background: none; color: #1f1e1d; min-width: 0; }
.cx-btn { font: inherit; font-size: 13px; border-radius: 9px; padding: 6px 12px; cursor: pointer; border: 1px solid #e5e3dd; background: #fff; color: #1f1e1d; white-space: nowrap; }
.cx-btn:hover { background: #f4f2ee; }
.cx-btn[disabled] { opacity: .6; cursor: default; }
.cx-btn-dark, .cx-add { background: #1f1e1d; border-color: #1f1e1d; color: #fff; }
.cx-btn-dark:hover, .cx-add:hover { background: #33322f; }
.cx-note { margin: 0 0 12px; font-size: 13px; background: #f1eee9; border-radius: 9px; padding: 8px 12px; }
.cx-table { border-top: 1px solid #e5e3dd; }
.cx-row { display: grid; grid-template-columns: 1fr 140px 150px; align-items: center; gap: 12px; padding: 12px 6px; border-bottom: 1px solid #e5e3dd; }
.cx-head { font-size: 13px; color: #8b8a86; font-weight: 500; padding: 10px 6px; }
.cx-click { cursor: pointer; border-radius: 0; }
.cx-click:hover, .cx-click:focus-visible { background: #f4f2ee; outline: none; }
.cx-name { display: flex; align-items: center; gap: 12px; font-size: 15px; min-width: 0; }
.cx-name > span:last-child { min-width: 0; display: flex; flex-direction: column; }
.cx-about { font-size: 12.5px; color: #8b8a86; margin-top: 2px; }
.cx-badge { flex: none; width: 30px; height: 30px; border-radius: 8px; display: inline-flex !important; align-items: center; justify-content: center; font-weight: 600; font-size: 14px; flex-direction: row !important; }
.cx-tcol { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #6b6a68; }
.cx-pill { font-size: 11px; border: 1px solid #d9d6cf; border-radius: 999px; padding: 1px 7px; color: #6b6a68; }
.cx-scol { display: flex; align-items: center; gap: 8px; justify-content: flex-start; }
.cx-ok { color: #1f1e1d; display: flex; }
.cx-warn { display: flex; }
.cx-empty { padding: 24px 6px; font-size: 14px; color: #8b8a86; }
.cx-backb { font: inherit; font-size: 14px; font-weight: 500; border: 0; background: none; cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 6px 8px; margin-left: -8px; border-radius: 8px; color: #1f1e1d; }
.cx-dhead { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; flex-wrap: wrap; }
.cx-dname { font-size: 20px; font-weight: 600; }
.cx-dacts { display: flex; gap: 8px; }
.cx-url { font-size: 12.5px; color: #8b8a86; margin: 6px 0 0; overflow-wrap: anywhere; }
.cx-bad { color: #b42318; }
.cx-ph { font-size: 16px; font-weight: 600; margin-top: 26px; }
.cx-group { margin-top: 16px; }
.cx-ghead { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 0; }
.cx-gtoggle { font: inherit; font-size: 14px; font-weight: 600; border: 0; background: none; cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 0; color: #1f1e1d; }
.cx-chev { display: flex; transition: transform .15s; }
.cx-chev.shut { transform: rotate(-90deg); }
.cx-count { font-size: 12px; font-weight: 500; border: 1px solid #d9d6cf; border-radius: 999px; padding: 0 7px; color: #6b6a68; }
.cx-gsel { font: inherit; font-size: 13px; padding: 5px 8px; border: 1px solid #e5e3dd; border-radius: 9px; background: #fff; color: #1f1e1d; }
.cx-tool { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0 10px 22px; border-bottom: 1px solid #efede8; }
.cx-tname { font-size: 14px; display: flex; align-items: center; gap: 8px; min-width: 0; overflow-wrap: anywhere; }
.cx-info { flex: none; width: 16px; height: 16px; border-radius: 50%; border: 1px solid #b9b6af; color: #8b8a86; font-size: 10px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; cursor: help; }
.cx-perms { flex: none; display: flex; background: #efede8; border-radius: 10px; padding: 2px; }
.cx-perms button { border: 0; background: none; color: #8b8a86; width: 32px; height: 28px; border-radius: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.cx-perms button.on { background: #fff; color: #1f1e1d; box-shadow: 0 1px 2px rgba(0,0,0,.1); }
.cx-addbox .cx-addnote { margin-top: 8px; font-size: 13px; color: #b42318; }
@media (max-width: 600px) {
  .cx-in { padding: 18px 16px 48px; }
  .cx-row { grid-template-columns: 1fr auto; }
  .cx-tcol { display: none; }
  .cx-head .cx-tcol { display: none; }
  .cx-scol { justify-content: flex-end; }
  .cx-about { display: none; }
}

/* ITS BACKGROUND COMMANDS STILL RUNNING (tool 4, part 2), above the message box, each with a Stop. */
.cd-bg { border: 1px solid #e6e2db; border-radius: 12px; background: #fff; margin: 0 0 8px; padding: 6px 12px; font: 13px Inter, system-ui, sans-serif; color: #374151; }
.cd-bg-head { font-size: 11.5px; font-weight: 600; color: #6b7280; text-transform: uppercase; letter-spacing: .04em; padding: 2px 0 4px; }
.cd-bg-row { display: flex; align-items: center; gap: 8px; padding: 4px 0; min-width: 0; }
.cd-bg-row + .cd-bg-row { border-top: 1px solid #f1eee9; }
.cd-bg-dot { width: 7px; height: 7px; border-radius: 50%; background: #16a34a; flex: none; animation: cd-bg-pulse 1.6s ease-in-out infinite; }
@keyframes cd-bg-pulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .cd-bg-dot { animation: none; } }
.cd-bg-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #1f2937; }
.cd-bg-time { color: #6b7280; font-size: 12px; flex: none; font-variant-numeric: tabular-nums; }
.cd-bg-stop { border: 1px solid #e0dbd2; background: #fff; color: #0d1b2a; border-radius: 999px; padding: 2px 10px; font: 600 12px Inter, system-ui, sans-serif; cursor: pointer; flex: none; }
.cd-bg-stop:hover { border-color: #b42318; color: #b42318; }
.cd-bg-stop:disabled { opacity: .6; cursor: default; }
.cd-st-stopped { color: #6b7280; font-size: 12px; }
.cd-bg-outbtn:hover { border-color: #0d1b2a; color: #0d1b2a; }
.cd-bg-out { margin: 2px 0 6px 15px; min-width: 0; }
.cd-bg-outlines { margin: 0; max-height: 220px; overflow: auto; background: #0d1b2a; color: #e5e7eb; border-radius: 8px; padding: 8px 10px; font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.cd-bg-outnote { color: #6b7280; font-size: 12.5px; padding: 2px 0; }
.cd-bg-file { color: #6b7280; font-size: 12px; padding-top: 4px; overflow-wrap: anywhere; }
.cd-bg-file code { font: 11.5px ui-monospace, SFMono-Regular, Menlo, monospace; color: #374151; }

/* SHELL MODE (tool 4, part 3, like Claude Code's "!"): the box, the hint under it, and the owner's command in the chat. */
.cd-compose.is-shell { border-color: #b45309; box-shadow: 0 0 0 1px #b45309 inset; }
.cd-compose.is-shell textarea { font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13.5px; }
.cd-shellhint { display: none; margin: 6px 6px 0; font: 12px Inter, system-ui, sans-serif; color: #b45309; }
.cd-compose.is-shell + .cd-shellhint { display: block; }
.cd-bubble.cd-bubble-shell { font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; white-space: pre-wrap; }
.cd-bgmove { margin: -4px 0 10px 30px; border: 1px solid #e0dbd2; background: #fff; color: #0d1b2a; border-radius: 999px; padding: 2px 10px; font: 600 12px Inter, system-ui, sans-serif; cursor: pointer; }
.cd-bgmove:hover { border-color: #0d1b2a; }
.cd-bgmove:disabled { opacity: .6; cursor: default; }
.cd-run-info { margin: -4px 0 6px 30px; font: 12px Inter, system-ui, sans-serif; color: #6b7280; font-variant-numeric: tabular-nums; }
/* A step auto mode's checker blocked (like Claude Code's "Blocked by auto mode" and "Auto mode: <reason>" under the call). */
.cd-autoblock { margin: -2px 0 8px 30px; font: 13px/1.45 Inter, system-ui, sans-serif; }
.cd-autoblock-head { color: #b3261e; font-weight: 600; }
.cd-autoblock-why { color: #6b7280; overflow-wrap: anywhere; }
.cd-progress { margin: 0 0 8px 30px; padding: 6px 10px; background: #f7f5f1; border: 1px solid #eee9e1; border-radius: 8px; font: 12px "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; color: #374151; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 8.5em; overflow: hidden; }

/* MESSAGES WAITING FOR CODER (Claude Code's queue): grey, at the end of the chat, each with ✕ to take it back. */
.cd-queued .cd-bubble { background: #f1efeb; color: #6b7280; border: 1px dashed #d8d3ca; }
.cd-queued-label { display: flex; justify-content: flex-end; align-items: center; gap: 6px; font: 12px Inter, system-ui, sans-serif; color: #6b7280; margin-bottom: 4px; }
.cd-queued-x { border: 0; background: transparent; color: #6b7280; font-size: 13px; line-height: 1; padding: 2px 4px; border-radius: 6px; cursor: pointer; }
.cd-queued-x:hover { background: #ece8e1; color: #0d1b2a; }
.cd-queue-send { margin-right: 6px; }

/* THE PERMISSION MODE (the owner, 2026-11-09, the Claude app's menu): the mode's chip beside the model and effort, and its
   menu above it: each mode with its line, a check on the one in use, its number key. */
.cd-mode-wrap { position: relative; display: inline-flex; }
.cd-mode-btn { display: inline-flex; align-items: center; gap: 5px; border: 0; background: transparent; border-radius: 8px; padding: 4px 8px; font: 500 12.5px Inter, system-ui, sans-serif; color: #6b7280; cursor: pointer; white-space: nowrap; }
.cd-mode-btn:hover, .cd-mode-btn[aria-expanded="true"] { background: #f3f1ed; color: #0d1b2a; }
.cd-mode-btn svg { flex: none; }
.cd-mode-btn svg:last-child { opacity: .7; transform: rotate(90deg); }
.cd-mode-btn.is-plan { color: #2f5d8a; }
.cd-mode-btn.is-acceptEdits { color: #6b4fa0; }
.cd-modes { position: absolute; right: 0; bottom: calc(100% + 8px); z-index: 30; width: 320px; max-width: calc(100vw - 32px); background: #fff; border: 1px solid #e5e3dd; border-radius: 14px; box-shadow: 0 10px 32px rgba(0,0,0,.14); padding: 6px; }
.cd-mode-row { display: flex; align-items: flex-start; gap: 10px; width: 100%; border: 0; background: transparent; border-radius: 10px; padding: 9px 10px; text-align: left; cursor: pointer; font: inherit; color: #1f1e1d; }
.cd-mode-row:hover, .cd-mode-row:focus-visible { background: #f5f3ee; outline: none; }
.cd-mode-ic { flex: none; width: 18px; display: inline-flex; justify-content: center; padding-top: 2px; color: #57534e; }
.cd-mode-t { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.cd-mode-t b { font-size: 14px; font-weight: 600; }
.cd-mode-t small { font-size: 12.5px; color: #6b6a66; line-height: 1.35; }
.cd-mode-ck { flex: none; width: 14px; font-size: 13px; color: #1f1e1d; padding-top: 1px; }
.cd-mode-row kbd, .cd-perm-opt kbd { flex: none; font: 500 11px Inter, system-ui, sans-serif; color: #8a8884; border: 1px solid #e5e3dd; border-radius: 5px; min-width: 18px; text-align: center; padding: 1px 4px; background: #faf9f6; }
.cd-modes-sep { height: 1px; background: #ece9e2; margin: 4px 6px; }
.cd-mode-rules { display: block; width: 100%; border: 0; background: transparent; border-radius: 10px; padding: 8px 10px 8px 38px; text-align: left; font: 500 13px Inter, system-ui, sans-serif; color: #57534e; cursor: pointer; }
.cd-mode-rules:hover { background: #f5f3ee; color: #1f1e1d; }

/* A STEP WAITING ON THE OWNER (Claude Code's permission prompt): what Coder wants to do, why it asks, the numbered choices, a
   note; once answered, the answer in one line. A plan's card shows the plan itself. */
.cd-perm { border: 1px solid #e5e3dd; border-radius: 14px; background: #fff; margin: 8px 0; padding: 14px 16px; max-width: 560px; outline: none; }
.cd-perm.is-live { border-color: #d6c9a8; box-shadow: 0 1px 0 rgba(0,0,0,.02), 0 0 0 3px #fbf3e2; }
.cd-perm-head { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #1f1e1d; margin-bottom: 8px; }
.cd-perm-ic { display: inline-flex; width: 26px; height: 26px; border-radius: 7px; background: #1f1e1d; color: #fff; align-items: center; justify-content: center; flex: none; }
.cd-perm-desc { font-size: 13.5px; color: #1f1e1d; margin: 0 0 6px; overflow-wrap: anywhere; }
.cd-perm-pre { background: #faf9f6; border: 1px solid #ece9e2; border-radius: 10px; padding: 9px 12px; font: 12.5px/1.5 "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 260px; overflow: auto; margin: 0 0 8px; color: #1f1e1d; }
.cd-perm-pre .cd-wl { display: block; margin: 0 -12px; padding: 0 12px; white-space: pre-wrap; }
.cd-perm-why { font-size: 12.5px; color: #6b6a66; margin: 0 0 8px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.cd-perm-q { font-size: 13.5px; font-weight: 600; color: #1f1e1d; margin: 10px 0 6px; }
.cd-perm-opts { display: flex; flex-direction: column; gap: 4px; }
.cd-perm-opt { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; border: 1px solid #ece9e2; background: #fff; border-radius: 10px; padding: 8px 10px; font: 500 13.5px Inter, system-ui, sans-serif; color: #1f1e1d; cursor: pointer; }
.cd-perm-opt:hover:not(:disabled), .cd-perm-opt:focus-visible { background: #f5f3ee; border-color: #d9d6cf; outline: none; }
.cd-perm-opt code, .cd-perm-done code { background: #f0ede7; border-radius: 5px; padding: 1px 6px; font-size: 12.5px; }
.cd-perm-opt.is-sent { background: #1f1e1d; border-color: #1f1e1d; color: #fff; }
.cd-perm-opt.is-sent kbd { background: transparent; color: #d6d3cc; border-color: #57534e; }
.cd-perm-opt:disabled { cursor: default; }
.cd-perm-opt:disabled:not(.is-sent) { opacity: .55; }
.cd-perm-note { display: block; width: 100%; box-sizing: border-box; margin-top: 8px; font: inherit; font-size: 13.5px; color: #1f1e1d; border: 1px solid #d9d6cf; border-radius: 10px; padding: 8px 10px; background: #fff; }
.cd-perm-note:focus { outline: none; border-color: #1f1e1d; }
.cd-perm-done { font-size: 13px; color: #57534e; margin-top: 4px; overflow-wrap: anywhere; }
.cd-perm-ok { color: #1d6b3a; font-weight: 600; }
.cd-perm-no { color: #b3261e; font-weight: 600; }
.cd-plan .cd-perm-ic { background: #2f5d8a; }
.cd-plan-body { border: 1px solid #ece9e2; border-radius: 10px; padding: 4px 14px; background: #fdfcfa; max-height: 420px; overflow: auto; font-size: 14px; }
.cd-st-wait { color: #9a5b00; font-weight: 600; }

/* THE OWNER'S RULES FOR A REPOSITORY (Claude Code's /permissions). */
.cd-rules { max-width: 520px; }
.cd-rules-k { margin-top: 14px; }
.cd-rules-h { font-size: 13.5px; color: #1f1e1d; }
.cd-rules-h span { color: #6b6a66; font-size: 12.5px; }
.cd-rules-k ul { list-style: none; margin: 6px 0 0; padding: 0; }
.cd-rules-k li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 8px; border: 1px solid #ece9e2; border-radius: 8px; margin-bottom: 4px; font-size: 13px; overflow-wrap: anywhere; }
.cd-rules-k li button { border: 0; background: transparent; color: #6b6a66; font-size: 16px; line-height: 1; cursor: pointer; border-radius: 6px; padding: 2px 6px; }
.cd-rules-k li button:hover { background: #f3f1ed; color: #b3261e; }
.cd-rules-none { font-size: 12.5px; color: #a19c94; margin: 4px 0 0; }
/* A rule Claude Code keeps but warns about: its short row under the rule, and its full warning once it is added (Bash docs pass 5). */
.cd-rules-r { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cd-rules-note { font-size: 12px; color: #9a5b00; }
.cd-rules-warn { font-size: 12.5px; line-height: 1.45; color: #7a4800; background: #fff6e5; border: 1px solid #f1d9a8; border-radius: 8px; padding: 8px 10px; margin: 10px 0 0; overflow-wrap: anywhere; }
.cd-rules-add { display: flex; gap: 6px; margin-top: 16px; }
.cd-rules-add select, .cd-rules-add input { font: inherit; font-size: 13.5px; border: 1px solid #d9d6cf; border-radius: 8px; padding: 7px 9px; background: #fff; color: #1f1e1d; }
.cd-rules-add input { flex: 1; min-width: 0; font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; }
.cd-rules-add button { font: inherit; font-size: 13.5px; font-weight: 600; border: 1px solid #1f1e1d; background: #1f1e1d; color: #fff; border-radius: 8px; padding: 7px 14px; cursor: pointer; }
.cd-rules .cd-sure-row .cd-sure-yes { background: #1f1e1d; border-color: #1f1e1d; }
.cd-sure-text code { background: #f0ede7; border-radius: 5px; padding: 1px 5px; font-size: 12.5px; }