symphony-code 0.0.1__py3-none-any.whl

coding_agent/tui/theme/theme.toml

@@ -0,0 +1,1687 @@
+# Symphony TUI theme — palette tokens and Textual CSS.
+#
+# Packaged default for the dark theme. At runtime the TUI reads
+# ~/.symphony/theme.toml when that file exists; otherwise this copy is
+# used in memory. Copy this file to ~/.symphony/theme.toml to edit.
+#
+# [css.variables] maps Textual `$name` declarations onto [colors] keys so
+# chrome CSS and Rich tokens stay on one palette.
+#
+# [css.spacing] holds the TUI spacing scale in terminal cells. Each key
+# becomes a Textual `$space-<key>` variable; chrome, tools, and composer CSS
+# use those variables instead of literal margin/padding numbers.
+
+[colors]
+background = "#0A0A0A"
+foreground = "#EDEDED"
+accent = "#A371F7"
+muted = "#737373"
+muted_dim = "#737373"
+edge = "#262626"
+comment = "#737373"
+keyword = "#db6767"
+type_keywords = "#db6767"
+string = "#799e7c"
+function = "#6374d0"
+variable = "#EDEDED"
+number = "#d08a61"
+operator = "#6b6b6b"
+punctuation = "#525252"
+type = "#cda059"
+tag = "#5a9a95"
+attribute = "#8ca0cc"
+constant = "#d08a61"
+surface = "#171717"
+overlay = "#262626"
+subtext = "#A3A3A3"
+panel_edge_focus = "#484F58"
+
+[css.variables]
+background = "background"
+foreground = "foreground"
+accent = "accent"
+muted = "muted"
+muted-dim = "muted_dim"
+foreground-muted = "subtext"
+string = "string"
+panel = "surface"
+panel-light = "overlay"
+panel-edge = "edge"
+panel-edge-focus = "panel_edge_focus"
+danger = "keyword"
+
+[css.spacing]
+# Left/right inset of the top bar, transcript, composer, and footer.
+page = 3
+# Indent of timeline text: the column after the `>` prompt glyph.
+gutter = 3
+# Blank rows between transcript blocks (messages, tools, thoughts).
+block = 1
+# Blank rows before a run summary card.
+section = 2
+# Inner padding of compact controls (composer, menus, labels).
+inset = 1
+# Inner padding of panels (composer overlay, run summary).
+inset-wide = 2
+
+[css]
+chrome = '''
+Screen {
+    layout: vertical;
+    background: $background;
+    color: $foreground;
+}
+
+#topbar {
+    width: 100%;
+    height: 2;
+    padding: $space-block $space-page 0 $space-page;
+    color: $foreground;
+    background: $background;
+}
+
+#transcript {
+    width: 100%;
+    height: 1fr;
+    padding: 0 $space-page $space-block $space-page;
+    /* Keep scrollbars out of the way until the user interacts with them. */
+    scrollbar-size: 1 1;
+    scrollbar-size-vertical: 1;
+    scrollbar-color: transparent;
+    scrollbar-color-hover: $panel-edge;
+    scrollbar-color-active: $panel-edge-focus;
+    scrollbar-background: transparent;
+    scrollbar-background-hover: transparent;
+    scrollbar-background-active: transparent;
+}
+
+.welcome {
+    width: 100%;
+    height: 1fr;
+    min-height: 10;
+    margin: 0;
+    padding: 0 $space-inset-wide;
+    color: $muted;
+}
+
+.message {
+    width: 100%;
+    height: auto;
+    margin: 0;
+    padding: 0 0 0 $space-gutter;
+}
+
+/* Textual spacing is measured in terminal cells rather than pixels. Blocks
+   use $space-block above and below; Textual collapses adjacent vertical
+   margins, so neighbouring blocks share one blank row instead of stacking. */
+.user-message {
+    margin: $space-block 0 0 0;
+    background: $background;
+    /* The `>` occupies the shared 3-cell gutter; prompt text starts with tools. */
+    padding: 0;
+}
+
+.run-summary {
+    margin: $space-section 0 0 $space-inset;
+    background: $background;
+    border-left: solid #9b7bc3;
+    padding: $space-inset $space-inset-wide;
+    color: #c2b5cf;
+}
+
+.assistant-message {
+    margin: $space-block 0;
+    background: $background;
+    color: $foreground;
+}
+
+.thinking-status {
+    width: auto;
+    max-width: 72;
+    height: 1;
+    margin: 0;
+    padding: 0 0 0 $space-gutter;
+    color: $muted;
+}
+
+.run-process {
+    width: 100%;
+    height: auto;
+    margin: 0;
+    padding: 0;
+    background: $background;
+}
+
+.process-complete {
+    width: auto;
+    height: 1;
+    margin: 0;
+    padding: 0 0 0 $space-gutter;
+    color: #5f6a62;
+}
+
+/* Live "Thinking…" and completed "Thought" blocks get the same block margin
+   as tool rows. */
+.reasoning-block {
+    width: 100%;
+    height: auto;
+    min-width: 100%;
+    margin: $space-block 0;
+    padding: 0;
+    color: #5b9bd5;
+    background: $background;
+    border: none;
+    border-top: none;
+    pointer: pointer;
+}
+
+.reasoning-block:focus-within {
+    background: $background;
+}
+
+.reasoning-block > CollapsibleTitle {
+    width: 1;
+    height: 0;
+    padding: 0;
+    color: transparent;
+    background: transparent;
+}
+
+.reasoning-header {
+    width: auto;
+    height: 1;
+    padding: 0 0 0 $space-gutter;
+    background: transparent;
+    pointer: pointer;
+}
+
+.reasoning-header:hover,
+.reasoning-header:focus {
+    background: transparent;
+}
+
+.reasoning-header:hover .reasoning-label,
+.reasoning-header:hover .reasoning-status,
+.reasoning-header:focus .reasoning-label,
+.reasoning-header:focus .reasoning-status {
+    color: #8ab4cf;
+    text-style: bold;
+}
+
+.reasoning-label {
+    width: auto;
+    height: 1;
+    padding-right: $space-inset;
+    color: #5b9bd5;
+    background: transparent;
+}
+
+.reasoning-status {
+    width: auto;
+    height: 1;
+    color: #5b9bd5;
+    text-align: left;
+    background: transparent;
+}
+
+.reasoning-block.is-complete {
+    opacity: 1;
+}
+
+.reasoning-block.is-complete .reasoning-label,
+.reasoning-block.is-complete .reasoning-status {
+    opacity: 0.85;
+}
+
+.reasoning-block.is-complete:hover .reasoning-label,
+.reasoning-block.is-complete:hover .reasoning-status,
+.reasoning-block.is-complete:focus .reasoning-label,
+.reasoning-block.is-complete:focus .reasoning-status {
+    opacity: 1;
+}
+
+.reasoning-block > Contents {
+    padding: 0;
+}
+
+.reasoning-scroll {
+    width: 100%;
+    height: auto;
+    max-height: 12;
+    padding: 0;
+    scrollbar-size: 1 1;
+    scrollbar-color: transparent;
+    scrollbar-color-hover: #606060;
+    scrollbar-color-active: #707070;
+    scrollbar-background: transparent;
+    scrollbar-background-hover: transparent;
+    scrollbar-background-active: transparent;
+}
+
+.reasoning-text {
+    width: 100%;
+    height: auto;
+    padding: 0 0 0 $space-gutter;
+    color: #6e6e6e;
+}
+
+.reasoning-block.is-complete .reasoning-text {
+    /* Keep the reasoning subordinate to the header without losing legibility. */
+    color: #858585;
+    opacity: 0.85;
+}
+
+/* Inline and fenced code inside thinking markdown: a step brighter than the
+   muted prose on the panel tone. Bold, italics, and headers add emphasis
+   only, so they keep the thinking colour above. */
+.reasoning-text > .reasoning-text--code {
+    color: $foreground-muted;
+    background: $panel;
+}
+'''
+tools = '''
+.tool-call {
+    width: 100%;
+    height: auto;
+    min-height: 1;
+    margin: $space-block 0;
+    padding: 0;
+    padding-bottom: 0;
+    padding-left: 0;
+    background: $background;
+    border: none;
+    border-top: none;
+    pointer: pointer;
+}
+
+.tool-call:focus-within {
+    background: $background;
+}
+
+.tool-call > CollapsibleTitle {
+    width: 1;
+    height: 0;
+    padding: 0;
+    color: transparent;
+    background: transparent;
+}
+
+.bash-tool > CollapsibleTitle {
+    display: none;
+}
+
+.tool-call-header {
+    width: auto;
+    height: 1;
+    padding: 0 0 0 $space-gutter;
+    background: transparent;
+    pointer: pointer;
+}
+
+.tool-call-header:hover,
+.tool-call-header:focus {
+    background: transparent;
+}
+
+.tool-call-header:hover .tool-call-label,
+.tool-call-header:focus .tool-call-label {
+    text-style: bold;
+}
+
+.tool-call-label {
+    width: auto;
+    height: 1;
+    color: #9aa7b2;
+    background: transparent;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.tool-call.status-preparing .tool-call-label,
+.tool-call.status-running .tool-call-label {
+    color: #d7a84b;
+}
+
+.tool-call.status-done .tool-call-label {
+    color: #72a57a;
+}
+
+.tool-call.status-failed .tool-call-label {
+    color: #d66b73;
+}
+
+.tool-call.status-preparing > CollapsibleTitle,
+.tool-call.status-running > CollapsibleTitle {
+    color: #d7a84b;
+}
+
+.tool-call.status-done > CollapsibleTitle {
+    color: #72a57a;
+}
+
+.tool-call.status-failed > CollapsibleTitle {
+    color: #d66b73;
+}
+
+.tool-call > Contents {
+    /* Align expanded output with the opening bracket in the tool header. */
+    padding: 0 0 0 $space-gutter;
+}
+
+.bash-tool {
+    padding: 0;
+    padding-bottom: 0;
+    border: none;
+    border-top: none;
+}
+
+.bash-tool-header {
+    width: auto;
+    height: 1;
+    padding: 0 0 0 $space-gutter;
+    background: transparent;
+    pointer: pointer;
+}
+
+.bash-tool-header:hover,
+.bash-tool-header:focus {
+    background: transparent;
+}
+
+.bash-tool-header:hover .bash-tool-label,
+.bash-tool-header:focus .bash-tool-label {
+    text-style: bold;
+}
+
+.bash-tool-label {
+    width: auto;
+    height: 1;
+    color: #9aa7b2;
+    background: transparent;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.bash-tool.status-preparing .bash-tool-label,
+.bash-tool.status-running .bash-tool-label {
+    color: #d7a84b;
+}
+
+.bash-tool.status-done .bash-tool-label {
+    color: #72a57a;
+}
+
+.bash-tool.status-failed .bash-tool-label {
+    color: #d66b73;
+}
+
+/* A running Bash card's streamed output tail, under its header. Its height
+   is the fixed LIVE_OUTPUT_TAIL_LINES window set in tools/calls.py. */
+.bash-tool-tail {
+    width: 100%;
+    overflow: hidden;
+    text-wrap: nowrap;
+    text-overflow: ellipsis;
+    padding: 0 $space-inset 0 $space-gutter;
+    color: $muted;
+    background: transparent;
+}
+
+.bash-tool-body {
+    width: 100%;
+    height: auto;
+    padding: 0 $space-inset 0 $space-gutter;
+    color: #777777;
+    background: $background;
+}
+
+.bash-tool.-collapsed .bash-tool-body {
+    display: none;
+}
+
+.diff-tool {
+    padding: 0;
+    padding-bottom: 0;
+    background: $background;
+    border: none;
+    border-top: none;
+}
+
+/* Keep collapsed Update cards visually consistent with the timeline while
+   retaining strong line-level colors when the diff is expanded. */
+.diff-tool > Contents,
+.diff-tool .tool-call-header {
+    background: $background;
+}
+
+.diff-tool .tool-call-header:hover,
+.diff-tool .tool-call-header:focus {
+    background: transparent;
+}
+
+.tool-call-summary {
+    width: 1fr;
+    height: auto;
+    margin: $space-block 0;
+    padding: 0 0 0 $space-gutter;
+    color: #a2adb8;
+    background: transparent;
+    pointer: pointer;
+    border: none;
+}
+
+.tool-call-summary:hover,
+.tool-call-summary:focus {
+    background: transparent;
+    text-style: bold;
+}
+
+/* Rows nested inside an expanded Explored or completed-run group start at
+   the group header's left edge and read smaller: one compact, dimmed line
+   each in muted theme colours. */
+/* Expanded group rows follow fx's grouped tool rows: a tree guide in the
+   row tone, then the verb (danger when the call failed) and the arguments. */
+.tool-call-summary > .tool-call-summary--guide {
+    color: $muted;
+}
+
+.tool-call-summary > .tool-call-summary--verb {
+    color: $foreground-muted;
+}
+
+.tool-call-summary > .tool-call-summary--args {
+    color: $muted;
+}
+
+.tool-call-summary > .tool-call-summary--verb-failed {
+    color: $danger;
+}
+
+/* A grouped call still running keeps the live card's warning tone. */
+.tool-call-summary > .tool-call-summary--verb-running {
+    color: $warning;
+}
+
+.tool-call-summary > .tool-call-summary--detail {
+    color: $muted;
+    text-style: italic;
+}
+'''
+composer = '''
+.notice {
+    width: 100%;
+    height: auto;
+    min-height: 1;
+    margin: $space-block 0 0 0;
+    padding: 0 0 0 $space-gutter;
+    color: $muted;
+}
+
+/* Composer: a visibly rounded input container. */
+#composer {
+    width: 1fr;
+    height: auto;
+    min-height: 3;
+    margin: 0 $space-page;
+    padding: 0 $space-inset;
+    layout: vertical;
+    background: $background;
+    border: round $panel-edge;
+}
+
+#composer:focus-within {
+    border: round $panel-edge-focus;
+}
+
+#composer-row {
+    width: 100%;
+    height: auto;
+    min-height: 1;
+    layout: horizontal;
+    background: $background;
+}
+
+#prompt {
+    width: 1fr;
+    max-width: 100%;
+    height: auto;
+    min-height: 1;
+    max-height: 10;
+    padding: 0 $space-inset;
+    border: none;
+    background: $background;
+    color: $foreground;
+    pointer: text;
+}
+
+#prompt:focus {
+    border: none;
+}
+
+#prompt.-disabled {
+    color: $muted-dim;
+}
+
+#prompt .text-area--placeholder {
+    color: $muted;
+}
+
+#prompt .text-area--cursor-line {
+    background: $background;
+}
+
+/* The caret is a one-cell block. Without its own colors it inherits the
+   prompt background after a stylesheet refresh (tool events, theme reload)
+   and disappears. */
+#prompt .text-area--cursor {
+    color: $background;
+    background: $foreground;
+    text-style: none;
+}
+
+
+
+#queued-prompt-row {
+    display: none;
+    width: 100%;
+    height: 1;
+    min-height: 1;
+    margin: 0;
+    padding: 0;
+    border: none;
+    background: $background;
+    layout: horizontal;
+    align: left middle;
+}
+
+#queued-prompt-text {
+    width: 1fr;
+    height: 1;
+    color: $muted;
+    overflow-x: hidden;
+    content-align: left middle;
+}
+
+#queued-send-now, #queued-edit {
+    width: auto;
+    height: 1fr;
+    min-width: 9;
+    padding: 0 $space-inset;
+    border: none;
+    background: $background;
+    color: $accent;
+}
+
+#queued-send-now:hover, #queued-edit:hover {
+    background: $panel-edge;
+}
+
+#composer-overlay {
+    display: none;
+    width: 1fr;
+    height: auto;
+    min-height: 4;
+    margin: 0 $space-page $space-block $space-page;
+    padding: $space-inset $space-inset-wide;
+    background: $panel-light;
+    border-left: thick $string;
+    color: $foreground;
+}
+
+#slash-menu {
+    display: none;
+    width: 1fr;
+    height: auto;
+    max-height: 12;
+    margin: 0 $space-page;
+    padding: $space-inset $space-inset 0 $space-inset;
+    background: $panel;
+    border: round $panel-edge;
+    overflow-y: auto;
+    /* A one-cell thumb. The track stays the panel color so it does not read
+       as the black gutter in the screenshot. */
+    scrollbar-size-vertical: 1;
+    scrollbar-color: $accent;
+    scrollbar-color-hover: $accent;
+    scrollbar-color-active: $foreground;
+    scrollbar-background: $panel;
+    scrollbar-background-hover: $panel;
+    scrollbar-background-active: $panel;
+}
+
+#approval-menu {
+    display: none;
+    width: 1fr;
+    height: auto;
+    max-height: 8;
+    margin: 0 $space-page $space-block $space-page;
+    padding: 0 $space-inset;
+    background: $panel;
+    border: round $panel-edge;
+}
+
+#slash-menu > .option-list--option {
+    padding: 0;
+    background: $panel;
+}
+
+#slash-menu > .option-list--option-highlighted {
+    background: $panel-light;
+    text-style: bold;
+}
+
+#slash-menu > .option-list--option-hover {
+    background: $panel-light;
+}
+
+#slash-menu > .option-list--option-disabled {
+    padding: 0;
+    background: $panel;
+}
+
+#transcript ScrollBar {
+    pointer: pointer;
+}
+
+/* Footer: workspace and context meter on the left, keyboard hint on the right. */
+#status {
+    width: 100%;
+    height: 2;
+    padding: $space-block $space-page 0 $space-page;
+    background: $background;
+    color: $foreground;
+}
+
+/* Voice mode preserves the composer's dimensions and focus behavior. */
+#composer.voice-light, #composer.voice-light:focus-within {
+    border: round #D7C4FB;
+}
+
+#composer.voice-dark, #composer.voice-dark:focus-within {
+    border: round #A371F7;
+}
+
+#approval-menu.permission-menu {
+    width: 100%;
+    max-width: 100%;
+    height: auto;
+    max-height: 14;
+    margin: 0 0 $space-block 0;
+    offset-x: 0;
+    padding: $space-inset $space-inset 0 $space-inset;
+    border: round $panel-edge;
+    background: $background;
+}
+
+#approval-menu.permission-menu > .option-list--option {
+    padding: 0 $space-inset;
+    background: $background;
+}
+
+#approval-menu.permission-menu > .option-list--option-disabled {
+    background: $background;
+}
+
+#approval-menu.permission-menu > .option-list--option-highlighted {
+    background: $panel-light;
+}
+
+#approval-menu.permission-menu > .option-list--option-hover {
+    background: $panel-light;
+}
+
+#slash-menu.file-menu {
+    width: 1fr;
+    max-height: 12;
+    margin: 0 $space-page $space-block $space-page;
+    padding: $space-inset $space-inset 0 $space-inset;
+    background: $panel;
+    border: round $panel-edge;
+}
+
+#slash-menu.file-menu > .option-list--option,
+#slash-menu.file-menu > .option-list--option-disabled {
+    padding: 0 $space-inset;
+    background: $panel;
+}
+
+#slash-menu.file-menu > .option-list--option-highlighted,
+#slash-menu.file-menu > .option-list--option-hover {
+    color: $foreground;
+    background: $panel-light;
+}
+'''
+resume = '''
+ResumeApp {
+    background: #0a0a0a;
+    color: #d0d0d0;
+}
+
+#resume-page {
+    width: 100%;
+    height: 100%;
+    padding: 1 2 0 2;
+    background: #0a0a0a;
+}
+
+#resume-title {
+    height: 1;
+    color: #ededed;
+    text-style: bold;
+}
+
+#resume-subtitle {
+    height: 2;
+    padding-top: 1;
+    color: #737373;
+}
+
+#resume-list {
+    width: 100%;
+    height: 1fr;
+    margin-top: 1;
+    background: #0a0a0a;
+    border: none;
+    scrollbar-size: 1 1;
+    scrollbar-color: #484848;
+    scrollbar-background: #0a0a0a;
+}
+
+#resume-list:focus {
+    border: none;
+}
+
+#resume-list > .option-list--option {
+    height: 2;
+    padding: 0 2;
+    background: #0a0a0a;
+}
+
+#resume-list > .option-list--option-highlighted {
+    background: #1c1b17;
+    color: #e1c16e;
+}
+
+#resume-hint {
+    height: 1;
+    color: #656565;
+    text-align: right;
+}
+'''
+onboard = '''
+OnboardApp {
+    background: #0a0a0a;
+    color: #d0d0d0;
+}
+
+#onboard-page {
+    width: 100%;
+    height: 100%;
+    padding: 1 2 0 2;
+    background: #0a0a0a;
+}
+
+ProviderWizard {
+    width: 100%;
+    height: 1fr;
+}
+
+#onboard-title {
+    height: 1;
+    color: #ededed;
+    text-style: bold;
+}
+
+#onboard-subtitle {
+    height: 2;
+    padding-top: 1;
+    color: #737373;
+}
+
+#onboard-detail {
+    height: auto;
+    margin-top: 1;
+    color: #737373;
+}
+
+#provider-list {
+    width: 100%;
+    height: 1fr;
+    margin-top: 1;
+    background: #0a0a0a;
+    border: none;
+    scrollbar-size: 1 1;
+    scrollbar-color: #484848;
+    scrollbar-background: #0a0a0a;
+}
+
+#provider-list:focus {
+    border: none;
+}
+
+#provider-list > .option-list--option {
+    height: 3;
+    padding: 0 2;
+    background: #0a0a0a;
+}
+
+#provider-list > .option-list--option-highlighted {
+    background: #1c1b17;
+    color: #e1c16e;
+}
+
+#provider-key {
+    width: 100%;
+    height: 3;
+    margin-top: 2;
+    background: #141414;
+    color: #ededed;
+    border: tall #2a2a2a;
+    padding: 0 1;
+}
+
+#provider-key:focus {
+    border: tall #e1c16e;
+}
+
+#onboard-error {
+    height: 1;
+    margin-top: 1;
+    color: #db6767;
+}
+
+#onboard-hint {
+    height: 1;
+    color: #656565;
+    text-align: right;
+}
+'''
+
+[css.modal]
+base = '''
+#modal-close {
+    dock: right;
+    width: 7;
+    height: 1;
+    color: #737373;
+    content-align: right middle;
+    background: #0A0A0A;
+}
+
+#modal-close:hover,
+#modal-close:focus {
+    color: #f2d675;
+    text-style: bold;
+    background: #0A0A0A;
+}
+
+.modal-pane {
+    width: 86%;
+    max-width: 132;
+    height: 84%;
+    padding: 2 3;
+    background: #0A0A0A;
+    border: round #383838;
+}
+
+.modal-body {
+    width: 100%;
+    height: 1fr;
+    padding: 1 1 2 1;
+    scrollbar-size: 1 1;
+    scrollbar-color: #343434;
+    scrollbar-color-active: #525252;
+    scrollbar-color-hover: #484848;
+    scrollbar-background: #0A0A0A;
+    scrollbar-background-active: #0A0A0A;
+    scrollbar-background-hover: #0A0A0A;
+}
+
+.content-card {
+    width: 100%;
+    height: auto;
+    margin-bottom: 2;
+    padding: 1 2 2 2;
+    color: #bdbdbd;
+    background: #121212;
+    border-top: solid #303030;
+}
+
+.empty-state {
+    width: 100%;
+    height: auto;
+    padding: 4 5;
+    margin: 2 0;
+    content-align: center middle;
+    text-align: center;
+    background: #121212;
+}
+
+.modal-footer {
+    width: 100%;
+    height: 2;
+    padding: 1 1 0 1;
+    color: #686868;
+    background: #0A0A0A;
+}
+'''
+content = '''
+ContentModal {
+    align: center middle;
+    background: rgba(0, 0, 0, 0.52);
+}
+
+#content-pane {
+    width: 98%;
+    max-width: 180;
+    height: 94%;
+    padding: 0 1;
+    border: round #262626;
+}
+
+#content-body {
+    padding: 0;
+    background: #0A0A0A;
+}
+
+#content-pane .modal-footer {
+    padding-left: 1;
+}
+
+#content-title {
+    width: 100%;
+    height: auto;
+    padding: 0 1 1 1;
+    color: #d0d0d0;
+    text-style: bold;
+    background: #0A0A0A;
+}
+
+#content-text {
+    display: none;
+}
+
+#content-numbered {
+    width: 100%;
+    height: auto;
+    padding: 1 2;
+    color: #d0d0d0;
+    background: #0d0d0d;
+}
+'''
+image = '''
+ImageModal {
+    align: center middle;
+    background: rgba(0, 0, 0, 0.52);
+}
+
+#content-pane {
+    width: 98%;
+    max-width: 180;
+    height: 94%;
+    padding: 0 1;
+    border: round #262626;
+}
+
+#content-body {
+    padding: 0;
+    background: #0A0A0A;
+}
+
+#content-pane .modal-footer {
+    padding-left: 1;
+}
+
+#image-title {
+    width: 100%;
+    height: auto;
+    padding: 0 1 1 1;
+    color: #d0d0d0;
+    background: #0A0A0A;
+}
+
+#image-preview {
+    width: 100%;
+    height: auto;
+    padding: 1 1;
+    background: #0d0d0d;
+}
+'''
+diff = '''
+DiffModal {
+    align: center middle;
+    background: rgba(0, 0, 0, 0.52);
+}
+
+#diff-pane {
+    width: 98%;
+    max-width: 180;
+    height: 94%;
+    padding: 0 1;
+    background: #0A0A0A;
+    border: round #262626;
+}
+
+#diff-header {
+    width: 100%;
+    height: 3;
+    min-height: 3;
+    padding: 1 1 0 1;
+    border-bottom: solid #262626;
+    background: #0A0A0A;
+}
+
+#diff-pane > #modal-close {
+    display: none;
+}
+
+
+#diff-title {
+    width: auto;
+    color: #d9dde0;
+    text-style: bold;
+    background: #0A0A0A;
+}
+
+#diff-path {
+    width: auto;
+    padding-left: 2;
+    color: #aeb8bc;
+    background: #0A0A0A;
+}
+
+#diff-header-spacer {
+    width: 1fr;
+    background: #0A0A0A;
+}
+
+#diff-total-stats {
+    width: auto;
+    margin-left: 2;
+    background: #0A0A0A;
+}
+
+#diff-file-counter {
+    width: auto;
+    margin-left: 2;
+    color: #858d91;
+    content-align: right middle;
+    background: #0A0A0A;
+}
+
+#diff-header #modal-close {
+    dock: none;
+    width: auto;
+    min-width: 11;
+    margin-left: 2;
+    color: #858d91;
+    background: #0A0A0A;
+}
+
+#diff-pane #modal-close:hover,
+#diff-pane #modal-close:focus {
+    color: #f2d675;
+    background: #171b1c;
+}
+
+#diff-body {
+    height: 1fr;
+    padding: 0;
+    background: #0A0A0A;
+    scrollbar-color: #343434;
+    scrollbar-color-active: #525252;
+    scrollbar-color-hover: #484848;
+    scrollbar-background: #0A0A0A;
+    scrollbar-background-active: #0A0A0A;
+    scrollbar-background-hover: #0A0A0A;
+}
+
+#diff-hint {
+    width: 100%;
+    height: 2;
+    content-align: center middle;
+    color: #737b7f;
+    background: #0A0A0A;
+}
+
+.diff-file-card {
+    width: 100%;
+    height: auto;
+    margin-bottom: 1;
+    padding: 0;
+    background: #0A0A0A;
+    border-top: solid #262626;
+}
+
+.diff-file-card.inactive {
+    display: none;
+}
+
+.diff-file-card.collapsed .diff-patch {
+    display: none;
+}
+
+.diff-file-card:hover {
+    border-top: solid #687b83;
+}
+
+.diff-file-header {
+    width: 100%;
+    height: 1;
+    padding: 0 1;
+    background: #171717;
+}
+
+.diff-file-chevron {
+    width: 3;
+    color: #8ca0a8;
+    content-align: center middle;
+    background: #171717;
+}
+
+.diff-file-path {
+    width: 1fr;
+    height: 1;
+    content-align: left middle;
+    color: #d0d0d0;
+    background: #171717;
+}
+
+.diff-file-card.selected {
+    border-top: solid #f2d675;
+}
+
+.diff-file-card.selected .diff-file-chevron {
+    color: #f2d675;
+}
+
+.diff-file-card.selected .diff-file-path {
+    color: #f2d675;
+}
+
+.diff-file-stats {
+    width: auto;
+    height: 1;
+    content-align: right middle;
+    color: #737373;
+    background: #171717;
+}
+
+.diff-patch {
+    width: 100%;
+    height: auto;
+    margin: 0;
+    padding: 0 1 1 1;
+    color: #b8bec1;
+    background: #080a0b;
+}
+'''
+extensions = '''
+ExtensionsModal {
+    align: center middle;
+    background: rgba(0, 0, 0, 0.68);
+}
+#extensions-pane {
+    width: 86%;
+    max-width: 128;
+    height: 82%;
+    padding: 0 2;
+    background: #0a0a0a;
+    border: round #353535;
+}
+#extensions-header {
+    width: 100%;
+    height: 4;
+    min-height: 4;
+    padding: 1 1 0 1;
+    border-bottom: solid #2b2b2b;
+    background: #0a0a0a;
+}
+#extensions-title {
+    width: 1fr;
+    color: #e0e0e0;
+    text-style: bold;
+}
+#extensions-counter {
+    width: auto;
+    padding-right: 2;
+    color: #818181;
+}
+#extensions-header #modal-close {
+    dock: none;
+    width: auto;
+    min-width: 11;
+    color: #818181;
+    background: #0a0a0a;
+}
+#extensions-header #modal-close:hover,
+#extensions-header #modal-close:focus {
+    color: #f2d675;
+    background: #171717;
+}
+#extensions-subtitle {
+    width: 100%;
+    height: 2;
+    padding: 0 1;
+    color: #737373;
+    background: #0a0a0a;
+}
+#extensions-body {
+    padding: 0 1 1 1;
+    background: #0a0a0a;
+}
+.extensions-section {
+    width: 100%;
+    height: 2;
+    margin: 1 0 0 0;
+    padding: 0 1;
+    color: #f2d675;
+    text-style: bold;
+    background: #0a0a0a;
+}
+.extension-card {
+    width: 100%;
+    height: auto;
+    min-height: 6;
+    margin-bottom: 1;
+    padding: 1 2;
+    background: #151515;
+    border-left: thick #343434;
+}
+.extension-card:hover {
+    border-left: thick #f2d675;
+    background: #191919;
+}
+.extension-card-header {
+    width: 100%;
+    height: 2;
+}
+.extension-name {
+    width: 1fr;
+    color: #dedede;
+    text-style: bold;
+}
+.extension-origin,
+.extension-status {
+    width: auto;
+    color: #f2d675;
+    text-style: bold;
+}
+.extension-status.disabled {
+    color: #a06b6b;
+}
+.extension-description {
+    width: 100%;
+    height: auto;
+    color: #bdbdbd;
+}
+.extension-path {
+    width: 100%;
+    height: auto;
+    margin-top: 1;
+    color: #707070;
+}
+'''
+learning = '''
+LearningModal {
+    align: center middle;
+    background: rgba(0, 0, 0, 0.52);
+}
+
+#learning-pane {
+    width: 98%;
+    max-width: 180;
+    height: 94%;
+    padding: 0 1;
+    background: #0A0A0A;
+    border: round #262626;
+}
+
+#learning-pane > #modal-close {
+    display: none;
+}
+
+#learning-header {
+    width: 100%;
+    height: 3;
+    min-height: 3;
+    padding: 1 1 0 1;
+    border-bottom: solid #262626;
+    background: #0A0A0A;
+}
+
+#learning-title {
+    width: auto;
+    color: #d9dde0;
+    text-style: bold;
+    background: #0A0A0A;
+}
+
+#learning-counter {
+    width: 1fr;
+    padding-left: 2;
+    color: #858d91;
+    background: #0A0A0A;
+}
+
+#learning-header #modal-close {
+    dock: none;
+    width: auto;
+    min-width: 11;
+    color: #858d91;
+    background: #0A0A0A;
+}
+
+#learning-header #modal-close:hover,
+#learning-header #modal-close:focus {
+    color: #f2d675;
+    background: #171b1c;
+}
+
+#learning-tabs {
+    height: 1fr;
+    background: #0A0A0A;
+}
+
+#learning-tabs ContentSwitcher {
+    height: 1fr;
+}
+
+#learning-tabs TabPane {
+    height: 1fr;
+    padding: 0;
+}
+
+#session-memory-body, #global-memory-body {
+    height: 1fr;
+    padding: 0;
+    background: #0A0A0A;
+}
+
+#learning-hint {
+    width: 100%;
+    height: 2;
+    content-align: center middle;
+    color: #737b7f;
+    background: #0A0A0A;
+}
+
+.learning-section {
+    width: 100%;
+    height: auto;
+    margin: 1 1 0 1;
+    color: #8eafc2;
+    text-style: bold;
+    background: #0A0A0A;
+}
+
+.learning-content {
+    width: 100%;
+    height: auto;
+    margin: 0 1 1 1;
+    padding: 0 1;
+    color: #bdbdbd;
+    background: #0A0A0A;
+}
+
+.learning-card {
+    width: 100%;
+    height: auto;
+    margin-bottom: 1;
+    padding: 0;
+    background: #0A0A0A;
+    border-top: solid #262626;
+}
+
+.learning-card:hover {
+    border-top: solid #687b83;
+}
+
+.learning-card-header {
+    width: 100%;
+    height: 1;
+    padding: 0 1;
+    background: #171717;
+}
+
+.learning-marker {
+    width: 3;
+    color: #c5a9e6;
+    content-align: center middle;
+    background: #171717;
+}
+
+.learning-card-title {
+    width: 1fr;
+    color: #d0d0d0;
+    background: #171717;
+}
+
+.learning-meta {
+    width: auto;
+    background: #171717;
+}
+
+.learning-body-content {
+    width: 100%;
+    height: auto;
+    padding: 1 2 2 2;
+    color: #bdbdbd;
+    background: #0A0A0A;
+}
+
+'''
+context = '''
+ContextModal {
+    align: center middle;
+    background: rgba(0, 0, 0, 0.52);
+}
+
+#context-pane {
+    width: 82%;
+    max-width: 118;
+    height: 78%;
+    max-height: 44;
+    padding: 1 2;
+    background: #0A0A0A;
+    border: round #38474a;
+}
+
+#context-header {
+    width: 100%;
+    height: 2;
+    background: #0A0A0A;
+}
+
+#context-title {
+    width: 1fr;
+    height: 1;
+    color: #d8d8d8;
+    text-style: bold;
+    background: #0A0A0A;
+}
+
+#context-meters {
+    width: 100%;
+    height: auto;
+    margin-bottom: 1;
+    padding: 1 2;
+    background: #0d0d0d;
+    border-top: solid #2a2a2a;
+}
+
+#context-buckets {
+    width: 100%;
+    height: 3;
+    margin-bottom: 1;
+    background: #0A0A0A;
+    border-bottom: solid #252525;
+}
+
+.context-chip {
+    width: auto;
+    height: 3;
+    margin-right: 2;
+    padding: 0 1 1 1;
+    color: #9a9a9a;
+    content-align: center middle;
+    background: #0A0A0A;
+}
+
+.context-chip:hover,
+.context-chip:focus {
+    color: #e6e6e6;
+    background: #161616;
+}
+
+.context-chip-active {
+    color: #f2d675;
+    text-style: bold;
+    background: #0A0A0A;
+    border-bottom: heavy #8f835a;
+}
+
+#context-meta {
+    width: 100%;
+    height: 2;
+    padding: 0 1 1 1;
+    color: #686868;
+    background: #0A0A0A;
+}
+
+#context-body {
+    padding: 0;
+    background: #0A0A0A;
+}
+
+#context-list {
+    width: 100%;
+    height: auto;
+    padding: 1 2;
+    background: #0d0d0d;
+    border-top: solid #252525;
+}
+
+.context-row {
+    width: 100%;
+    height: auto;
+}
+
+#context-hint {
+    text-align: right;
+    padding-right: 0;
+}
+'''
+provider = '''
+ProviderOnboardScreen {
+    align: center middle;
+    background: rgba(0, 0, 0, 0.52);
+}
+
+/* Keep provider setup on the same full-size modal chrome as text, image,
+   and diff previews. The old fixed 28-row pane clipped the key step on
+   smaller terminals and made this screen look like a separate dialog. */
+#provider-pane {
+    width: 98%;
+    max-width: 180;
+    height: 94%;
+    padding: 0 1;
+    background: #0A0A0A;
+    border: round #262626;
+}
+
+#provider-pane > #modal-close {
+    background: #0A0A0A;
+}
+
+#provider-pane ProviderWizard {
+    width: 100%;
+    height: 1fr;
+}
+
+#provider-pane #onboard-title {
+    width: 100%;
+    height: 3;
+    min-height: 3;
+    padding: 1 8 0 1;
+    color: #d9dde0;
+    text-style: bold;
+    background: #0A0A0A;
+    border-bottom: solid #262626;
+}
+
+#provider-pane #onboard-subtitle {
+    width: 100%;
+    height: 2;
+    padding: 1 1 0 1;
+    color: #858d91;
+    background: #0A0A0A;
+}
+
+#provider-pane #onboard-detail {
+    width: 100%;
+    height: auto;
+    margin-top: 1;
+    padding: 0 1;
+    color: #858d91;
+    background: #0A0A0A;
+}
+
+#provider-pane #provider-list {
+    width: 100%;
+    height: 1fr;
+    margin-top: 1;
+    padding: 0;
+    background: #0d0d0d;
+    border: none;
+    scrollbar-size: 1 1;
+    scrollbar-color: #343434;
+    scrollbar-background: #0d0d0d;
+}
+
+#provider-pane #provider-list:focus {
+    border: none;
+}
+
+#provider-pane #provider-list > .option-list--option {
+    height: 3;
+    padding: 0 2;
+    background: #0d0d0d;
+    color: #bdbdbd;
+}
+
+#provider-pane #provider-list > .option-list--option-highlighted {
+    background: #1c1b17;
+    color: #e1c16e;
+    border-left: wide #e1c16e;
+    padding-left: 1;
+}
+
+#provider-pane #provider-key {
+    width: 100%;
+    height: 3;
+    margin: 1 1 0 1;
+    background: #141414;
+    color: #ededed;
+    border: tall #2a2a2a;
+}
+
+#provider-pane #provider-key:focus {
+    border: tall #e1c16e;
+}
+
+#provider-pane #onboard-error {
+    height: 1;
+    margin: 1 1 0 1;
+    color: #db6767;
+}
+
+#provider-pane #onboard-hint {
+    width: 100%;
+    height: 2;
+    padding: 1 1 0 1;
+    color: #686868;
+    background: #0A0A0A;
+    border-top: solid #262626;
+}
+'''