.settings-theme-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; }
  .settings-theme-option { width: 100%; min-width: 0; display: flex; flex-direction: column; align-items: stretch; gap: 0.65rem; padding: 0.65rem; text-align: left; box-shadow: none; }
  .settings-theme-option[aria-checked="true"] { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 1px var(--accent); }
  .settings-theme-preview { height: 5.25rem; display: flex; overflow: hidden; border: 1px solid var(--line); border-radius: 5px; background: var(--canvas); pointer-events: none; }
  .settings-theme-preview-side { width: 28%; display: flex; flex-direction: column; gap: 0.4rem; padding: 0.6rem 0.35rem; border-right: 1px solid var(--line); background: var(--surface); }
  .settings-theme-preview-side > span { height: 0.25rem; border-radius: 2px; background: var(--ink-3); opacity: 0.35; }
  .settings-theme-preview-side > span:first-child { width: 70%; background: var(--accent); opacity: 1; }
  .settings-theme-preview-main { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 0.4rem; padding: 0.65rem; }
  .settings-theme-preview-main > span { width: 80%; height: 0.3rem; border-radius: 2px; background: var(--ink-3); opacity: 0.4; }
  .settings-theme-preview-main > span:first-child { width: 45%; background: var(--ink); opacity: 0.7; }
  .settings-theme-preview-main > span:last-child { align-self: flex-end; width: 65%; height: 1.2rem; margin-top: auto; border: 1px solid var(--line); border-radius: 4px; background: var(--accent-soft); opacity: 1; }
  .settings-theme-caption { display: flex; align-items: center; gap: 0.5rem; min-width: 0; }
  .settings-theme-copy { flex: 1; min-width: 0; display: grid; gap: 0.2rem; }
  .settings-theme-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.82rem; font-weight: 600; }
  .settings-theme-copy small { color: var(--ink-3); font-size: 0.7rem; }
  .settings-theme-check { width: 1.1rem; height: 1.1rem; flex-shrink: 0; display: grid; place-items: center; border: 1px solid var(--line-2); border-radius: 50%; color: transparent; font-size: 0.7rem; }
  [aria-checked="true"] > .settings-theme-caption .settings-theme-check { border-color: var(--accent); background: var(--accent); color: var(--primary-fg); }
  .theme-actions, .theme-editor-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.7rem; }
  .theme-editor-actions { justify-content: flex-end; }
  .settings-panel.theme-editor-panel { width: min(54rem, calc(100vw - 2rem)); }
  #themeJson { width: 100%; min-height: min(22rem, 42dvh); resize: vertical; padding: 0.65rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--input-bg); font: 0.8rem/1.5 ui-monospace, monospace; tab-size: 2; }
  #themeJson[aria-invalid="true"] { border-color: var(--theme-error-border); }
  #themeColorSearch { width: 100%; margin-top: 0.5rem; padding: 0.4rem; background: var(--input-bg); border: 1px solid var(--line-2); }
  #themeColorReference { max-height: 13rem; overflow: auto; }
  .theme-color-reference { display: flex; align-items: center; width: 100%; gap: 0.5rem; text-align: left; padding: 0.35rem; box-shadow: none; border: 0; }
  .theme-color-reference code { overflow-wrap: anywhere; }
  .theme-color-reference small { margin-left: auto; color: var(--ink-3); }
  .theme-color-dot { width: 1rem; height: 1rem; flex-shrink: 0; border: 1px solid var(--line-2); border-radius: 3px; }
  .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

  :root {color-scheme: light; --priority-1-fg: #b91c1c; --priority-1-bg: #fef2f2; --priority-2-fg: #b45309; --priority-2-bg: #fffbeb; --priority-3-fg: #0f766e; --priority-3-bg: #ecfdf5; --priority-4-fg: #2563eb; --priority-4-bg: #eff6ff; --priority-5-fg: #64748b; --priority-5-bg: #f1f5f9; --accent: #4f46e5; --accent-soft: #eef2ff; --accent-ring: rgba(99,102,241,0.35); --ink: #111827; --ink-2: #374151; --ink-3: #6b7280; --ink-4: #9ca3af; --line: #e5e7eb; --line-2: #d1d5db; --surface: #fbf9f4; --surface-2: #f6f3ec; --canvas: #eeece4; --button-hover: #f1eee6; --button-hover-border: #cfc9bd; --scroll-thumb: #d4d8e0; --scroll-thumb-hover: #b9bfcc; --resizer-hover: #c7d2fe; --panel-gradient-color-1: #fffdf8; --newbox-gradient-color-1: var(--new-session-background); --latest-gradient-color-1: var(--chat-pinned-background); --floating-panel-background: #f8fbff; --floating-panel-border: #94a3b8; --floating-panel-shadow: rgba(15,23,42,0.26); --new-session-background: var(--floating-panel-background); --new-session-border: var(--floating-panel-border); --new-session-shadow: var(--floating-panel-shadow); --list-panel-background: var(--floating-panel-background); --list-panel-border: var(--floating-panel-border); --list-panel-shadow: var(--floating-panel-shadow); --comment-background: var(--floating-panel-background); --comment-border: var(--floating-panel-border); --comment-shadow: var(--floating-panel-shadow); --chat-pinned-background: #fff1c9; --chat-pinned-border: #e3c378; --chat-pinned-hover-background: #f9e5ac; --row-line: #f1f2f4; --item-hover: #f1f5f9; --pin-row-start: rgba(79,70,229,0.085); --pin-row-end: rgba(99,102,241,0.025); --pin-row-hover-start: rgba(79,70,229,0.13); --pin-row-hover-end: rgba(99,102,241,0.055); --pin-card-start: #f0f1ff; --pin-card-end: #faf8f4; --pin-card-edge: rgba(79,70,229,0.2); --pin-drop-bg: rgba(99,102,241,0.08); --item-selected-row-start: #bae6fd; --item-selected-row-end: #e0f2fe; --item-selected-card-start: #bae6fd; --item-selected-card-end: #e0f2fe; --item-selected-marker: #0284c7; --item-selected-row-ring: rgba(2,132,199,0.3); --soft-card: #f6f3ec; --assistant-bg: #f1eee6; --assistant-border: #ded8cc; --user-msg-bg: #e0e7ff; --user-msg-border: #c7d2fe; --user-msg-fg: #1e1b4b; --user-msg-link: #4338ca; --user-msg-code-bg: rgba(79,70,229,0.10); --msg-control-bg: rgba(255,253,248,0.72); --msg-control-hover-bg: #f1eee6; --msg-control-border: rgba(148,163,184,0.3); --msg-control-active-bg: #eef2ff; --msg-control-active-border: #c7d2fe; --code-bg: #e8e4da; --input-bg: #fffdf8; --danger-soft: #fef2f2; --warning: #f59e0b; --warning-ring: rgba(245,158,11,0.24); --warning-soft: #fffbeb; --tabtip-bg: rgba(255,253,248,0.96); --tabtip-border: rgba(207,201,189,0.95); --drop-bg: #f7f4ed; --primary-bg: #4f46e5; --primary-fg: #ffffff; --primary-hover: #4338ca; --status-generating: #7e22ce; --status-generating-soft: rgba(126,34,206,0.22); --status-unread: #059669; --status-unread-soft: rgba(16,185,129,0.24); --status-seen: #0284c7; --status-seen-soft: rgba(14,165,233,0.18); --status-read: #cbd5e1; --tool-bg: #fbf9f4; --tool-body-bg: #f6f3ec; --tool-border: #d5cfc2; --tool-border-strong: #aaa292; --tool-divider: #e5e0d6; --tool-fg: #5d5a52; --tool-icon: #9b9488; --vendor-claude-fg: #c2410c; --vendor-claude-bg: #fff7ed; --vendor-claude-border: #fdba74; --vendor-claude-hover-bg: #ffedd5; --vendor-claude-hover-border: #fb923c; --vendor-claude-action-bg: #c2410c; --vendor-claude-action-hover: #9a3412; --vendor-claude-action-fg: #ffffff; --vendor-claude-action-ring: rgba(194,65,12,0.32); --vendor-codex-fg: #3730a3; --vendor-codex-bg: #eef2ff; --vendor-codex-border: #a5b4fc; --vendor-codex-hover-bg: #e0e7ff; --vendor-codex-hover-border: #818cf8; --vendor-codex-action-bg: #4f46e5; --vendor-codex-action-hover: #4338ca; --vendor-codex-action-fg: #ffffff; --vendor-codex-action-ring: rgba(79,70,229,0.32); --vendor-cursor-fg: #18181b; --vendor-cursor-bg: #f4f4f5; --vendor-cursor-border: #a1a1aa; --vendor-cursor-action-bg: #18181b; --vendor-cursor-action-hover: #3f3f46; --vendor-cursor-action-fg: #ffffff; --vendor-cursor-action-ring: rgba(24,24,27,0.28); --vendor-antigravity-fg: #7c3aed; --vendor-antigravity-bg: #f3e8ff; --vendor-antigravity-border: #c4b5fd; --vendor-antigravity-action-bg: #6d28d9; --vendor-antigravity-action-hover: #5b21b6; --vendor-antigravity-action-fg: #ffffff; --vendor-antigravity-action-ring: rgba(109,40,217,0.3); --vendor-copilot-fg: #6e40c9; --vendor-copilot-bg: #f5f0ff; --vendor-copilot-border: #b392f0; --vendor-copilot-action-bg: #6e40c9; --vendor-copilot-action-hover: #5936a2; --vendor-copilot-action-fg: #ffffff; --vendor-copilot-action-ring: rgba(110,64,201,0.3); --vendor-opencode-fg: #656363; --vendor-opencode-bg: #f5f4f4; --vendor-opencode-border: #cfcecd; --vendor-opencode-action-bg: #4b4646; --vendor-opencode-action-hover: #656363; --vendor-opencode-action-fg: #ffffff; --vendor-opencode-action-ring: rgba(75,70,70,0.3); --vendor-action-bg: var(--primary-bg); --vendor-action-hover: var(--primary-hover); --vendor-action-fg: var(--primary-fg); --vendor-action-ring: var(--accent-ring); --todo-fg: #b45309; --todo-bg: #fffbeb; --todo-border: #fde68a; --shadow-sm-color-1: rgba(15,23,42,0.06); --shadow-md-color-2: rgba(15,23,42,0.06); --shadow-md-color-1: rgba(15,23,42,0.10); --shadow-pop-color-2: rgba(15,23,42,0.08); --shadow-pop-color-1: rgba(15,23,42,0.16); --theme-search-error-foreground: #b91c1c; --theme-search-error-border: #fecaca; --theme-search-error-background: #fef2f2; --theme-search-error-search-error-foreground: #991b1b; --theme-overlay-background: rgba(0,0,0,0.3); --theme-button-delete-hover-foreground: #ef4444; --theme-settings-switch-shadow: rgba(0,0,0,0.2); --theme-tab-active-active-foreground: #3730a3; --theme-tab-active-active-background: #eef2ff; --theme-tab-active-active-border: #a5b4fc; --theme-tab-active-active-shadow: rgba(165,180,252,0.56); --theme-archive-foreground: #be123c; --theme-archive-hover-foreground: #9f1239; --theme-tab-group-active-border: #818cf8; --theme-tab-group-active-background: #eef2ff; --theme-tab-group-active-shadow: rgba(129,140,248,0.22); --theme-tab-active-viewtabgroup-on-viewtab-active-shadow: rgba(129,140,248,0.22); --theme-tab-close-active-shadow: rgba(129,140,248,0.22); --theme-tab-close-active-border: rgba(99,102,241,0.28); --theme-tab-close-hover-foreground: #b91c1c; --theme-tab-close-hover-background: #fef2f2; --theme-tag-active-border: #0f766e; --theme-tag-active-background: #ccfbf1; --theme-tag-active-shadow: #0f766e; --theme-tag-label-foreground: #0f172a; --theme-tag-label-active-foreground: #115e59; --theme-tag-label-active-border: rgba(15,118,110,0.24); --theme-tag-delete-hover-background: #fef2f2; --theme-tag-delete-hover-foreground: #b91c1c; --theme-tag-activeuntagged-border: #475569; --theme-tag-activeuntagged-background: #475569; --theme-tag-activeuntagged-shadow: #475569; --theme-tag-label-activeuntagged-foreground: #ffffff; --theme-tag-label-gtag-auto-on-gtagbtn-active-foreground: #0f766e; --theme-tag-add-foreground: #0f766e; --theme-tag-add-hover-background: #f0fdfa; --theme-attachment-drop-drop-border: #818cf8; --theme-attachment-drop-drop-shadow: rgba(99,102,241,0.12); --theme-new-session-close-hover-foreground: #b91c1c; --theme-chooser-note-foreground: #0f766e; --theme-chooser-note-background: #ccfbf1; --theme-tag-new-border: rgba(13,148,136,0.35); --theme-tag-new-foreground: #0f766e; --theme-tag-option-hover-foreground: #3730a3; --theme-tag-option-active-foreground: #3730a3; --theme-tag-option-selected-foreground: #0f766e; --theme-tag-option-hoverselected-background: #14b8a6; --theme-tag-option-hoverselected-foreground: #0f766e; --theme-tag-option-activeselected-background: #14b8a6; --theme-tag-option-activeselected-foreground: #0f766e; --theme-error-border: #fecaca; --theme-error-foreground: #991b1b; --theme-session-session-panel-item-avoidance-background: #f59e0b; --theme-session-background-color2: #e9d5ff; --theme-session-background-color1: #e9d5ff; --theme-session-border: #f59e0b; --theme-session-age-foreground: #9ca3af; --theme-session-queue-background: #eef2ff; --theme-session-queue-foreground: #4f46e5; --theme-session-queue-parked-background: #fffbeb; --theme-session-queue-parked-foreground: #b45309; --theme-status-stopped-foreground: #b45309; --theme-status-failed-foreground: #dc2626; --theme-status-quiet-warm-foreground: #b45309; --theme-status-quiet-hot-foreground: #dc2626; --theme-draft-edit-foreground: #dc2626; --theme-draft-edit-hover-foreground: #b91c1c; --theme-search-match-foreground: #4338ca; --theme-session-metadata-foreground: #6b7280; --theme-tag-foreground: #115e59; --theme-tag-background: #ccfbf1; --theme-tag-border: #99f6e4; --theme-tag-it-tag-auto-foreground: #0f766e; --theme-tag-it-tag-foreground: #0f766e; --theme-tag-hover-foreground: #b91c1c; --theme-project-foreground: #64748b; --theme-tag-new-background: #ccfbf1; --theme-state-default-background: #f8fafc; --theme-state-default-foreground: #475569; --theme-state-default-border: #64748b; --theme-state-default-shadow: rgba(100,116,139,0.16); --theme-state-continue-ready-background: #ecfdf5; --theme-state-continue-ready-foreground: #059669; --theme-state-continue-ready-border: #047857; --theme-state-continue-ready-shadow: rgba(4,120,87,0.18); --theme-state-needs-decision-background: #fff7ed; --theme-state-needs-decision-foreground: #ea580c; --theme-state-needs-decision-border: #c2410c; --theme-state-needs-decision-shadow: rgba(194,65,12,0.18); --theme-state-needs-input-background: #fffbeb; --theme-state-needs-input-foreground: #b45309; --theme-state-needs-input-border: #92400e; --theme-state-needs-input-shadow: rgba(146,64,14,0.18); --theme-state-blocked-background: #fef2f2; --theme-state-blocked-foreground: #dc2626; --theme-state-blocked-border: #b91c1c; --theme-state-blocked-shadow: rgba(185,28,28,0.18); --theme-state-needs-review-background: #ecfdf5; --theme-state-needs-review-foreground: #0f766e; --theme-state-needs-review-border: #0f766e; --theme-state-needs-review-shadow: rgba(15,118,110,0.18); --theme-state-followup-suggested-background: #eff6ff; --theme-state-followup-suggested-foreground: #0284c7; --theme-state-followup-suggested-border: #0369a1; --theme-state-followup-suggested-shadow: rgba(3,105,161,0.18); --theme-state-done-done-background: #f1f5f9; --theme-state-done-done-foreground: #475569; --theme-state-done-done-border: #64748b; --theme-state-done-done-shadow: rgba(100,116,139,0.18); --theme-session-title-pending-foreground: #9ca3af; --theme-eta-foreground: #b45309; --theme-eta-background: #fffbeb; --theme-eta-hover-background: #fef3c7; --theme-badge-edit-border: #6366f1; --theme-menu-option-hover-foreground: #3730a3; --theme-menu-option-active-foreground: #3730a3; --theme-menu-title-foreground: #b45309; --theme-avoidance-border: #f59e0b; --theme-avoidance-title-foreground: #b45309; --theme-avoidance-button-foreground: #0f766e; --theme-avoidance-button-background: #ccfbf1; --theme-avoidance-button-border: #99f6e4; --theme-avoidance-button-hover-foreground: #115e59; --theme-avoidance-button-hover-background: #99f6e4; --theme-avoidance-button-hover-border: #5eead4; --theme-avoidance-clear-hover-foreground: #b91c1c; --theme-avoidance-clear-hover-background: #fef2f2; --theme-chat-header-foreground: #6b7280; --theme-chat-header-shadow: rgba(15,23,42,0.28); --theme-chat-pinned-arrow-foreground: #64748b; --theme-chat-pinned-role-foreground: #64748b; --theme-chat-pinned-close-hover-foreground: #b91c1c; --theme-chat-pinned-icon-active-foreground: rgba(79,70,229,0.16); --theme-comment-overlay-background: rgba(15,23,42,0.24); --theme-chat-markdown-border: rgba(148, 163, 184, 0.65); --theme-diagram-border: rgba(148, 163, 184, 0.38); --theme-diagram-background: #fff; --theme-diagram-status-foreground: #6b7280; --theme-diagram-error-foreground: #b91c1c; --theme-diagram-button-border: rgba(148,163,184,0.5); --theme-diagram-button-background: rgba(148,163,184,0.12); --theme-diagram-button-foreground: #374151; --theme-diagram-button-hover-background: rgba(148,163,184,0.24); --theme-chat-assistant-link-foreground: #4338ca; --theme-chat-markdown-msg-bubble-border: rgba(148, 163, 184, 0.5); --theme-chat-markdown-background: rgba(148, 163, 184, 0.18); --theme-link-file-foreground: #1d4ed8; --theme-link-file-msg-bubble-filepath-badpath-foreground: #b91c1c; --theme-error-command-border: rgba(153,27,27,0.22); --theme-error-command-background: rgba(255,255,255,0.6); --theme-error-button-border: rgba(153,27,27,0.3); --theme-error-button-background: rgba(255,255,255,0.72); --theme-error-button-foreground: #991b1b; --theme-error-button-hover-border: #dc2626; --theme-error-button-hover-background: #ffffff; --theme-error-button-hover-foreground: #7f1d1d; --theme-chat-fold-border: rgba(99,102,241,0.52); --theme-chat-fold-background: rgba(99,102,241,0.07); --theme-chat-fold-hover-background: rgba(99,102,241,0.11); --theme-notification-warning-border: #f59e0b; --theme-notification-warning-background: #fffbeb; --theme-notification-warning-foreground: #92400e; --theme-notification-error-border: #ef4444; --theme-notification-error-background: #fef2f2; --theme-notification-error-foreground: #991b1b; --theme-notification-success-border: #34d399; --theme-notification-success-background: #ecfdf5; --theme-notification-success-foreground: #065f46; --theme-unlock-error-foreground: #b91c1c; --theme-tool-toolc-border: #dc2626; --theme-tool-error-foreground: #991b1b; --theme-tool-error-background: #fef2f2; --theme-diff-added-background: #e6f7ec; --theme-diff-added-foreground: #14532d; --theme-diff-added-sign-foreground: #15803d; --theme-diff-removed-background: #fde8e8; --theme-diff-removed-foreground: #7f1d1d; --theme-diff-removed-sign-foreground: #b91c1c; --theme-diff-context-foreground: #6b7280; --theme-tool-note-foreground: #6b7280; --theme-todo-text-done-foreground: #9ca3af; --theme-todo-icon-done-foreground: #16a34a; --theme-todo-icon-doing-foreground: #2563eb; --theme-todo-icon-foreground: #9ca3af; --theme-question-title-foreground: #6366f1; --theme-question-error-foreground: #b91c1c; --theme-input-placeholder-foreground: #9ca3af; --theme-input-drop-drop-border: #818cf8; --theme-input-drop-drop-shadow-color2: #818cf8; --theme-input-drop-drop-shadow-color1: rgba(99,102,241,0.12); --theme-attachment-foreground: #4338ca; --theme-attachment-background: #eef2ff; --theme-attachment-attachchip-foreground: #64748b; --theme-attachment-hover-foreground: #b91c1c; --theme-attachment-message-foreground: #64748b; --theme-attachment-message-attachmsg-err-foreground: #b91c1c; --theme-attachment-card-border: rgba(148, 163, 184, 0.42); --theme-attachment-card-background: rgba(255,255,255,0.14); --theme-attachment-card-hover-border: rgba(99,102,241,0.62); --theme-attachment-card-foreground: #4338ca; --theme-attachment-card-msg-attcard-kind-background: #eef2ff; --theme-attachment-card-msg-attcard-image-background: rgba(15,23,42,0.12); --theme-image-preview-background: rgba(2,6,23,0.82); --theme-image-preview-imgpreview-background: rgba(255,255,255,0.04); --theme-image-preview-shadow: rgba(0,0,0,0.46); --theme-image-preview-imgpreview-html-background: #fff; --theme-image-preview-toolbar-foreground: #e5e7eb; --theme-statistics-overlay-background: rgba(2,6,23,0.58); --theme-tag-overlay-background: rgba(2,6,23,0.58); --theme-button-delete-foreground: #fff; --theme-button-delete-border: #b91c1c; --theme-button-delete-background: #b91c1c; --theme-button-delete-hover-border: #991b1b; --theme-button-delete-hover-background: #991b1b; --theme-statistics-error-foreground: #b91c1c; --theme-fork-overlay-background: rgba(2,6,23,0.62); --theme-button-stop-background: #b91c1c; --theme-button-stop-border: #b91c1c; --theme-button-stop-hover-background: #991b1b; --theme-button-run-foreground: #334155; --theme-button-run-border: #cbd5e1; --theme-button-run-hover-border: #94a3b8; --theme-button-run-dirty-foreground: #3730a3; --theme-button-run-dirty-border: #a5b4fc; --theme-button-run-dirty-background: #eef2ff; --theme-button-run-hoverdirty-foreground: #312e81; --theme-button-run-hoverdirty-border: #818cf8; --theme-button-run-hoverdirty-background: #e0e7ff; --theme-button-run-hoverdirty-shadow: rgba(99,102,241,0.14); --theme-button-run-disabled-foreground: #cbd5e1; --theme-queue-background: #eef2ff; --theme-queue-border: #c7d2fe; --theme-queue-tag-foreground: #4338ca; --theme-queue-tag-background: #e0e7ff; --theme-queue-foreground: #312e81; --theme-queue-waiting-foreground: #6366f1; --theme-queue-scheduled-background: #eef2ff; --theme-queue-action-foreground: #6366f1; --theme-queue-action-hover-foreground: #4338ca; --theme-queue-action-hover-background: rgba(99,102,241,0.12); --theme-queue-delete-foreground: #dc2626; --theme-queue-delete-hover-foreground: #b91c1c; --theme-queue-delete-hover-background: #fef2f2; --theme-fork-error-foreground: #b91c1c; --theme-badge-background: #ede9fe; --theme-badge-foreground: #5b21b6; --theme-tab-group-active-foreground: #c7d2fe; --theme-tab-close-hoveractive-foreground: #fecdd3; --theme-tab-close-hoveractive-background: rgba(127,29,29,0.28); --theme-tooltip-metadata-background: rgba(148,163,184,0.08); --theme-tooltip-metadata-border: rgba(148,163,184,0.22); --theme-tooltip-value-foreground: #dbe4ee; --theme-tool-error-border: #7f1d1d; --theme-button-run-background: #172033; --theme-button-run-hover-background: #1e293b; --theme-chat-pinned-foreground: var(--ink-2); --theme-tag-delete-hover-border: #7f1d1d; --theme-tag-hover-background: #451a1a; --theme-tag-hover-border: #7f1d1d; --theme-queue-delete-hover-border: #7f1d1d; --theme-tag-add-hover-foreground: #99f6e4; --chat-background: var(--surface); --session-panel-background: var(--surface-2); --input-foreground: #000000; --input-placeholder-foreground: var(--ink-4); --assistant-fg: var(--ink); --code-foreground: var(--ink); --menu-background: var(--surface); --menu-foreground: var(--ink); --menu-border: var(--line-2); --selection-background: #c7d2fe; --selection-foreground: #111827; --panel-gradient-color-2: var(--surface); --latest-gradient-color-2: var(--chat-pinned-background); --project-1-fg: #9a3412; --project-1-bg: #fff7ed; --project-1-border: #fdba74; --project-2-fg: #0f766e; --project-2-bg: #f0fdfa; --project-2-border: #99f6e4; --project-3-fg: #1d4ed8; --project-3-bg: #eff6ff; --project-3-border: #93c5fd; --project-4-fg: #7c2d12; --project-4-bg: #fef2f2; --project-4-border: #fca5a5; --project-5-fg: #5b21b6; --project-5-bg: #f5f3ff; --project-5-border: #c4b5fd; --project-6-fg: #166534; --project-6-bg: #f0fdf4; --project-6-border: #86efac; --project-7-fg: #9d174d; --project-7-bg: #fdf2f8; --project-7-border: #f9a8d4; --project-8-fg: #92400e; --project-8-bg: #fffbeb; --project-8-border: #fcd34d; --project-9-fg: #0f766e; --project-9-bg: #ecfeff; --project-9-border: #67e8f9; --project-10-fg: #334155; --project-10-bg: #f8fafc; --project-10-border: #cbd5e1; --project-11-fg: #0f766e; --project-11-bg: #f0fdfa; --project-11-border: #5eead4; --project-12-fg: #3730a3; --project-12-bg: #eef2ff; --project-12-border: #a5b4fc; --tag-heat-low: #ffff00; --tag-heat-high: #ff0000; --tag-selected-foreground: #ffffff; --chat-error-background: #fef2f2; --markdown-separator: rgba(148, 163, 184, 0.45); --user-error-foreground: #b91c1c; --new-session-tag-add-foreground: #0f766e; --menu-option-foreground: var(--ink-2); --priority-selection-border: rgba(100,116,139,0.2); --header-tag-remove-hover-foreground: #b91c1c; }
html[data-theme="dark"] {color-scheme: dark; --priority-1-fg: #fca5a5; --priority-1-bg: rgba(220,38,38,0.14); --priority-2-fg: #fbbf24; --priority-2-bg: rgba(245,158,11,0.14); --priority-3-fg: #5eead4; --priority-3-bg: rgba(16,185,129,0.14); --priority-4-fg: #93c5fd; --priority-4-bg: rgba(37,99,235,0.14); --priority-5-fg: #cbd5e1; --priority-5-bg: rgba(100,116,139,0.16); --accent: #818cf8; --accent-soft: #1e1b4b; --accent-ring: rgba(129,140,248,0.34); --ink: #f8fafc; --ink-2: #dbe4ee; --ink-3: #a7b4c4; --ink-4: #748196; --line: #263241; --line-2: #3a4657; --surface: #111827; --surface-2: #0f172a; --canvas: #07101f; --button-hover: #1e293b; --button-hover-border: #4b5563; --scroll-thumb: #465468; --scroll-thumb-hover: #64748b; --resizer-hover: #374151; --panel-gradient-color-1: #151f31; --newbox-gradient-color-1: var(--new-session-background); --latest-gradient-color-1: var(--chat-pinned-background); --floating-panel-background: #1e2b40; --floating-panel-border: #657b99; --floating-panel-shadow: rgba(0,0,0,0.62); --new-session-background: var(--floating-panel-background); --new-session-border: var(--floating-panel-border); --new-session-shadow: var(--floating-panel-shadow); --list-panel-background: var(--floating-panel-background); --list-panel-border: var(--floating-panel-border); --list-panel-shadow: var(--floating-panel-shadow); --comment-background: var(--floating-panel-background); --comment-border: var(--floating-panel-border); --comment-shadow: var(--floating-panel-shadow); --chat-pinned-background: #182334; --chat-pinned-border: #344154; --chat-pinned-hover-background: #202d40; --row-line: #1f2937; --item-hover: #172033; --pin-row-start: rgba(99,102,241,0.18); --pin-row-end: rgba(79,70,229,0.055); --pin-row-hover-start: rgba(129,140,248,0.24); --pin-row-hover-end: rgba(79,70,229,0.09); --pin-card-start: #1b2140; --pin-card-end: #121a2c; --pin-card-edge: rgba(165,180,252,0.26); --pin-drop-bg: rgba(129,140,248,0.12); --item-selected-row-start: #164e70; --item-selected-row-end: #15354f; --item-selected-card-start: #164e70; --item-selected-card-end: #15354f; --item-selected-marker: #38bdf8; --item-selected-row-ring: rgba(56,189,248,0.4); --soft-card: #172033; --assistant-bg: #1e293b; --assistant-border: #334155; --user-msg-bg: #3730a3; --user-msg-border: #4f46e5; --user-msg-fg: #f8fafc; --user-msg-link: #e0e7ff; --user-msg-code-bg: rgba(2,6,23,0.30); --msg-control-bg: rgba(15,23,42,0.52); --msg-control-hover-bg: #172033; --msg-control-border: rgba(148,163,184,0.22); --msg-control-active-bg: rgba(99,102,241,0.2); --msg-control-active-border: rgba(129,140,248,0.44); --code-bg: #0b1220; --input-bg: #0f172a; --danger-soft: #3b121a; --warning: #fbbf24; --warning-ring: rgba(251,191,36,0.22); --warning-soft: #2f2410; --tabtip-bg: rgba(17,24,39,0.96); --tabtip-border: rgba(71,85,105,0.9); --drop-bg: #151f31; --primary-bg: #4f46e5; --primary-fg: #ffffff; --primary-hover: #5b5ee8; --status-generating: #c084fc; --status-generating-soft: rgba(192,132,252,0.28); --status-unread: #34d399; --status-unread-soft: rgba(52,211,153,0.24); --status-seen: #38bdf8; --status-seen-soft: rgba(56,189,248,0.2); --status-read: #475569; --tool-bg: #0b1220; --tool-body-bg: #0f172a; --tool-border: #334155; --tool-border-strong: #64748b; --tool-divider: #263241; --tool-fg: #a7b4c4; --tool-icon: #64748b; --vendor-claude-fg: #f0ab8a; --vendor-claude-bg: rgba(194,65,12,0.16); --vendor-claude-border: #9a3412; --vendor-claude-hover-bg: rgba(194,65,12,0.26); --vendor-claude-hover-border: #c2410c; --vendor-claude-action-bg: #f0ab8a; --vendor-claude-action-hover: #f7bea5; --vendor-claude-action-fg: #431407; --vendor-claude-action-ring: rgba(240,171,138,0.34); --vendor-codex-fg: #c4b5fd; --vendor-codex-bg: rgba(79,70,229,0.18); --vendor-codex-border: #6366f1; --vendor-codex-hover-bg: rgba(79,70,229,0.3); --vendor-codex-hover-border: #818cf8; --vendor-codex-action-bg: #c4b5fd; --vendor-codex-action-hover: #ddd6fe; --vendor-codex-action-fg: #1e1b4b; --vendor-codex-action-ring: rgba(196,181,253,0.34); --vendor-cursor-fg: #f4f4f5; --vendor-cursor-bg: #27272a; --vendor-cursor-border: #71717a; --vendor-cursor-action-bg: #f4f4f5; --vendor-cursor-action-hover: #ffffff; --vendor-cursor-action-fg: #18181b; --vendor-cursor-action-ring: rgba(244,244,245,0.3); --vendor-antigravity-fg: #c4b5fd; --vendor-antigravity-bg: rgba(124,58,237,0.18); --vendor-antigravity-border: #8b5cf6; --vendor-antigravity-action-bg: #c4b5fd; --vendor-antigravity-action-hover: #ddd6fe; --vendor-antigravity-action-fg: #2e1065; --vendor-antigravity-action-ring: rgba(196,181,253,0.34); --vendor-copilot-fg: #d2a8ff; --vendor-copilot-bg: rgba(110,64,201,0.2); --vendor-copilot-border: #8957e5; --vendor-copilot-action-bg: #d2a8ff; --vendor-copilot-action-hover: #e2c5ff; --vendor-copilot-action-fg: #21103f; --vendor-copilot-action-ring: rgba(210,168,255,0.34); --vendor-opencode-fg: #cfcecd; --vendor-opencode-bg: rgba(183,177,177,0.14); --vendor-opencode-border: #7d7878; --vendor-opencode-action-bg: #cfcecd; --vendor-opencode-action-hover: #e5e3e2; --vendor-opencode-action-fg: #2b2828; --vendor-opencode-action-ring: rgba(207,206,205,0.3); --vendor-action-bg: var(--primary-bg); --vendor-action-hover: var(--primary-hover); --vendor-action-fg: var(--primary-fg); --vendor-action-ring: var(--accent-ring); --todo-fg: #fbbf24; --todo-bg: rgba(245,158,11,0.14); --todo-border: rgba(245,158,11,0.48); --shadow-sm-color-1: rgba(0,0,0,0.28); --shadow-md-color-2: rgba(0,0,0,0.28); --shadow-md-color-1: rgba(0,0,0,0.34); --shadow-pop-color-2: rgba(0,0,0,0.34); --shadow-pop-color-1: rgba(0,0,0,0.48); --theme-search-error-foreground: #fca5a5; --theme-search-error-border: #fecaca; --theme-search-error-background: #fef2f2; --theme-search-error-search-error-foreground: #991b1b; --theme-overlay-background: rgba(0,0,0,0.3); --theme-button-delete-hover-foreground: #ef4444; --theme-settings-switch-shadow: rgba(0,0,0,0.2); --theme-tab-active-active-foreground: #c7d2fe; --theme-tab-active-active-background: #1e1b4b; --theme-tab-active-active-border: #6366f1; --theme-tab-active-active-shadow: rgba(165,180,252,0.56); --theme-archive-foreground: #fda4af; --theme-archive-hover-foreground: #fecdd3; --theme-tab-group-active-border: #6366f1; --theme-tab-group-active-background: #1e1b4b; --theme-tab-group-active-shadow: rgba(129,140,248,0.24); --theme-tab-active-viewtabgroup-on-viewtab-active-shadow: rgba(129,140,248,0.22); --theme-tab-close-active-shadow: rgba(129,140,248,0.22); --theme-tab-close-active-border: rgba(129,140,248,0.26); --theme-tab-close-hover-foreground: #b91c1c; --theme-tab-close-hover-background: #fef2f2; --theme-tag-active-border: #0f766e; --theme-tag-active-background: #ccfbf1; --theme-tag-active-shadow: #0f766e; --theme-tag-label-foreground: #0f172a; --theme-tag-label-active-foreground: #115e59; --theme-tag-label-active-border: rgba(15,118,110,0.24); --theme-tag-delete-hover-background: #451a1a; --theme-tag-delete-hover-foreground: #fecaca; --theme-tag-activeuntagged-border: #475569; --theme-tag-activeuntagged-background: #475569; --theme-tag-activeuntagged-shadow: #475569; --theme-tag-label-activeuntagged-foreground: #ffffff; --theme-tag-label-gtag-auto-on-gtagbtn-active-foreground: #5eead4; --theme-tag-add-foreground: #5eead4; --theme-tag-add-hover-background: rgba(20,184,166,0.16); --theme-attachment-drop-drop-border: #818cf8; --theme-attachment-drop-drop-shadow: rgba(99,102,241,0.12); --theme-new-session-close-hover-foreground: #b91c1c; --theme-chooser-note-foreground: #0f766e; --theme-chooser-note-background: #ccfbf1; --theme-tag-new-border: rgba(13,148,136,0.35); --theme-tag-new-foreground: #0f766e; --theme-tag-option-hover-foreground: #3730a3; --theme-tag-option-active-foreground: #3730a3; --theme-tag-option-selected-foreground: #0f766e; --theme-tag-option-hoverselected-background: #14b8a6; --theme-tag-option-hoverselected-foreground: #0f766e; --theme-tag-option-activeselected-background: #14b8a6; --theme-tag-option-activeselected-foreground: #0f766e; --theme-error-border: #7f1d1d; --theme-error-foreground: #fecaca; --theme-session-session-panel-item-avoidance-background: #f59e0b; --theme-session-background-color2: #e9d5ff; --theme-session-background-color1: #e9d5ff; --theme-session-border: #f59e0b; --theme-session-age-foreground: #9ca3af; --theme-session-queue-background: rgba(99,102,241,0.16); --theme-session-queue-foreground: #c4b5fd; --theme-session-queue-parked-background: rgba(245,158,11,0.14); --theme-session-queue-parked-foreground: #fbbf24; --theme-status-stopped-foreground: #fbbf24; --theme-status-failed-foreground: #f87171; --theme-status-quiet-warm-foreground: #fbbf24; --theme-status-quiet-hot-foreground: #f87171; --theme-draft-edit-foreground: #dc2626; --theme-draft-edit-hover-foreground: #b91c1c; --theme-search-match-foreground: #4338ca; --theme-session-metadata-foreground: #6b7280; --theme-tag-foreground: #115e59; --theme-tag-background: #ccfbf1; --theme-tag-border: #99f6e4; --theme-tag-it-tag-auto-foreground: #5eead4; --theme-tag-it-tag-foreground: #0f766e; --theme-tag-hover-foreground: #fecaca; --theme-project-foreground: #cbd5e1; --theme-tag-new-background: #ccfbf1; --theme-state-default-background: rgba(100,116,139,0.16); --theme-state-default-foreground: #cbd5e1; --theme-state-default-border: #64748b; --theme-state-default-shadow: rgba(148,163,184,0.18); --theme-state-continue-ready-background: rgba(16,185,129,0.14); --theme-state-continue-ready-foreground: #34d399; --theme-state-continue-ready-border: #0f766e; --theme-state-continue-ready-shadow: rgba(45,212,191,0.16); --theme-state-needs-decision-background: rgba(249,115,22,0.14); --theme-state-needs-decision-foreground: #fdba74; --theme-state-needs-decision-border: #c2410c; --theme-state-needs-decision-shadow: rgba(251,146,60,0.16); --theme-state-needs-input-background: rgba(245,158,11,0.14); --theme-state-needs-input-foreground: #fbbf24; --theme-state-needs-input-border: #b45309; --theme-state-needs-input-shadow: rgba(251,191,36,0.16); --theme-state-blocked-background: rgba(220,38,38,0.14); --theme-state-blocked-foreground: #fca5a5; --theme-state-blocked-border: #b91c1c; --theme-state-blocked-shadow: rgba(248,113,113,0.16); --theme-state-needs-review-background: rgba(20,184,166,0.14); --theme-state-needs-review-foreground: #5eead4; --theme-state-needs-review-border: #0f766e; --theme-state-needs-review-shadow: rgba(94,234,212,0.16); --theme-state-followup-suggested-background: rgba(14,165,233,0.14); --theme-state-followup-suggested-foreground: #38bdf8; --theme-state-followup-suggested-border: #0369a1; --theme-state-followup-suggested-shadow: rgba(56,189,248,0.16); --theme-state-done-done-background: rgba(100,116,139,0.16); --theme-state-done-done-foreground: #94a3b8; --theme-state-done-done-border: #64748b; --theme-state-done-done-shadow: rgba(148,163,184,0.16); --theme-session-title-pending-foreground: #9ca3af; --theme-eta-foreground: #fde68a; --theme-eta-background: #3a2608; --theme-eta-hover-background: #fef3c7; --theme-badge-edit-border: #6366f1; --theme-menu-option-hover-foreground: #3730a3; --theme-menu-option-active-foreground: #3730a3; --theme-menu-title-foreground: #b45309; --theme-avoidance-border: #f59e0b; --theme-avoidance-title-foreground: #b45309; --theme-avoidance-button-foreground: #0f766e; --theme-avoidance-button-background: #ccfbf1; --theme-avoidance-button-border: #99f6e4; --theme-avoidance-button-hover-foreground: #115e59; --theme-avoidance-button-hover-background: #99f6e4; --theme-avoidance-button-hover-border: #5eead4; --theme-avoidance-clear-hover-foreground: #b91c1c; --theme-avoidance-clear-hover-background: #fef2f2; --theme-chat-header-foreground: #6b7280; --theme-chat-header-shadow: rgba(0,0,0,0.72); --theme-chat-pinned-arrow-foreground: #94a3b8; --theme-chat-pinned-role-foreground: #94a3b8; --theme-chat-pinned-close-hover-foreground: #b91c1c; --theme-chat-pinned-icon-active-foreground: rgba(129,140,248,0.2); --theme-comment-overlay-background: rgba(15,23,42,0.24); --theme-chat-markdown-border: rgba(148, 163, 184, 0.65); --theme-diagram-border: rgba(148, 163, 184, 0.38); --theme-diagram-background: #fff; --theme-diagram-status-foreground: #6b7280; --theme-diagram-error-foreground: #b91c1c; --theme-diagram-button-border: rgba(148,163,184,0.5); --theme-diagram-button-background: rgba(148,163,184,0.12); --theme-diagram-button-foreground: #374151; --theme-diagram-button-hover-background: rgba(148,163,184,0.24); --theme-chat-assistant-link-foreground: #4338ca; --theme-chat-markdown-msg-bubble-border: rgba(148, 163, 184, 0.5); --theme-chat-markdown-background: rgba(148, 163, 184, 0.18); --theme-link-file-foreground: #1d4ed8; --theme-link-file-msg-bubble-filepath-badpath-foreground: #b91c1c; --theme-error-command-border: rgba(254,202,202,0.2); --theme-error-command-background: rgba(15,23,42,0.35); --theme-error-button-border: rgba(254,202,202,0.28); --theme-error-button-background: rgba(15,23,42,0.35); --theme-error-button-foreground: #fecaca; --theme-error-button-hover-border: #f87171; --theme-error-button-hover-background: rgba(15,23,42,0.65); --theme-error-button-hover-foreground: #ffffff; --theme-chat-fold-border: rgba(99,102,241,0.52); --theme-chat-fold-background: rgba(99,102,241,0.07); --theme-chat-fold-hover-background: rgba(99,102,241,0.11); --theme-notification-warning-border: #f59e0b; --theme-notification-warning-background: #fffbeb; --theme-notification-warning-foreground: #92400e; --theme-notification-error-border: #ef4444; --theme-notification-error-background: #fef2f2; --theme-notification-error-foreground: #991b1b; --theme-notification-success-border: #34d399; --theme-notification-success-background: #ecfdf5; --theme-notification-success-foreground: #065f46; --theme-unlock-error-foreground: #b91c1c; --theme-tool-toolc-border: #f87171; --theme-tool-error-foreground: #fecaca; --theme-tool-error-background: #451a1a; --theme-diff-added-background: #052e1c; --theme-diff-added-foreground: #bbf7d0; --theme-diff-added-sign-foreground: #15803d; --theme-diff-removed-background: #451a1a; --theme-diff-removed-foreground: #fecaca; --theme-diff-removed-sign-foreground: #b91c1c; --theme-diff-context-foreground: #6b7280; --theme-tool-note-foreground: #6b7280; --theme-todo-text-done-foreground: #9ca3af; --theme-todo-icon-done-foreground: #16a34a; --theme-todo-icon-doing-foreground: #2563eb; --theme-todo-icon-foreground: #9ca3af; --theme-question-title-foreground: #6366f1; --theme-question-error-foreground: #b91c1c; --theme-input-placeholder-foreground: #9ca3af; --theme-input-drop-drop-border: #818cf8; --theme-input-drop-drop-shadow-color2: #818cf8; --theme-input-drop-drop-shadow-color1: rgba(99,102,241,0.12); --theme-attachment-foreground: #4338ca; --theme-attachment-background: #eef2ff; --theme-attachment-attachchip-foreground: #64748b; --theme-attachment-hover-foreground: #b91c1c; --theme-attachment-message-foreground: #64748b; --theme-attachment-message-attachmsg-err-foreground: #b91c1c; --theme-attachment-card-border: rgba(148, 163, 184, 0.42); --theme-attachment-card-background: rgba(255,255,255,0.14); --theme-attachment-card-hover-border: rgba(99,102,241,0.62); --theme-attachment-card-foreground: #4338ca; --theme-attachment-card-msg-attcard-kind-background: #eef2ff; --theme-attachment-card-msg-attcard-image-background: rgba(15,23,42,0.12); --theme-image-preview-background: rgba(2,6,23,0.82); --theme-image-preview-imgpreview-background: rgba(255,255,255,0.04); --theme-image-preview-shadow: rgba(0,0,0,0.46); --theme-image-preview-imgpreview-html-background: #fff; --theme-image-preview-toolbar-foreground: #e5e7eb; --theme-statistics-overlay-background: rgba(2,6,23,0.58); --theme-tag-overlay-background: rgba(2,6,23,0.58); --theme-button-delete-foreground: #fff; --theme-button-delete-border: #b91c1c; --theme-button-delete-background: #b91c1c; --theme-button-delete-hover-border: #991b1b; --theme-button-delete-hover-background: #991b1b; --theme-statistics-error-foreground: #b91c1c; --theme-fork-overlay-background: rgba(2,6,23,0.62); --theme-button-stop-background: #b91c1c; --theme-button-stop-border: #b91c1c; --theme-button-stop-hover-background: #991b1b; --theme-button-run-foreground: #cbd5e1; --theme-button-run-border: #475569; --theme-button-run-hover-border: #64748b; --theme-button-run-dirty-foreground: #dbe4ff; --theme-button-run-dirty-border: #818cf8; --theme-button-run-dirty-background: rgba(99,102,241,0.22); --theme-button-run-hoverdirty-foreground: #eef2ff; --theme-button-run-hoverdirty-border: #a5b4fc; --theme-button-run-hoverdirty-background: rgba(99,102,241,0.36); --theme-button-run-hoverdirty-shadow: rgba(129,140,248,0.18); --theme-button-run-disabled-foreground: #cbd5e1; --theme-queue-background: #1e1b4b; --theme-queue-border: #4f46e5; --theme-queue-tag-foreground: #c7d2fe; --theme-queue-tag-background: #312e81; --theme-queue-foreground: #ddd6fe; --theme-queue-waiting-foreground: #a5b4fc; --theme-queue-scheduled-background: #eef2ff; --theme-queue-action-foreground: #a5b4fc; --theme-queue-action-hover-foreground: #c7d2fe; --theme-queue-action-hover-background: rgba(129,140,248,0.16); --theme-queue-delete-foreground: #fca5a5; --theme-queue-delete-hover-foreground: #fecaca; --theme-queue-delete-hover-background: #451a1a; --theme-fork-error-foreground: #b91c1c; --theme-badge-background: #ede9fe; --theme-badge-foreground: #5b21b6; --theme-tab-group-active-foreground: #c7d2fe; --theme-tab-close-hoveractive-foreground: #fecdd3; --theme-tab-close-hoveractive-background: rgba(127,29,29,0.28); --theme-tooltip-metadata-background: rgba(148,163,184,0.08); --theme-tooltip-metadata-border: rgba(148,163,184,0.22); --theme-tooltip-value-foreground: #dbe4ee; --theme-tool-error-border: #7f1d1d; --theme-button-run-background: #172033; --theme-button-run-hover-background: #1e293b; --theme-chat-pinned-foreground: var(--ink-2); --theme-tag-delete-hover-border: #7f1d1d; --theme-tag-hover-background: #451a1a; --theme-tag-hover-border: #7f1d1d; --theme-queue-delete-hover-border: #7f1d1d; --theme-tag-add-hover-foreground: #99f6e4; --chat-background: var(--surface); --session-panel-background: var(--surface-2); --input-foreground: #ffffff; --input-placeholder-foreground: var(--ink-4); --assistant-fg: var(--ink); --code-foreground: var(--ink); --menu-background: var(--surface); --menu-foreground: var(--ink); --menu-border: var(--line-2); --selection-background: #3730a3; --selection-foreground: #f8fafc; --panel-gradient-color-2: #111827; --latest-gradient-color-2: var(--chat-pinned-background); --project-1-fg: #9a3412; --project-1-bg: #fff7ed; --project-1-border: #fdba74; --project-2-fg: #0f766e; --project-2-bg: #f0fdfa; --project-2-border: #99f6e4; --project-3-fg: #1d4ed8; --project-3-bg: #eff6ff; --project-3-border: #93c5fd; --project-4-fg: #7c2d12; --project-4-bg: #fef2f2; --project-4-border: #fca5a5; --project-5-fg: #5b21b6; --project-5-bg: #f5f3ff; --project-5-border: #c4b5fd; --project-6-fg: #166534; --project-6-bg: #f0fdf4; --project-6-border: #86efac; --project-7-fg: #9d174d; --project-7-bg: #fdf2f8; --project-7-border: #f9a8d4; --project-8-fg: #92400e; --project-8-bg: #fffbeb; --project-8-border: #fcd34d; --project-9-fg: #0f766e; --project-9-bg: #ecfeff; --project-9-border: #67e8f9; --project-10-fg: #334155; --project-10-bg: #f8fafc; --project-10-border: #cbd5e1; --project-11-fg: #0f766e; --project-11-bg: #f0fdfa; --project-11-border: #5eead4; --project-12-fg: #3730a3; --project-12-bg: #eef2ff; --project-12-border: #a5b4fc; --tag-heat-low: #ffff00; --tag-heat-high: #ff0000; --tag-selected-foreground: #ffffff; --chat-error-background: #451a1a; --markdown-separator: rgba(148, 163, 184, 0.45); --user-error-foreground: #fca5a5; --new-session-tag-add-foreground: #0f766e; --menu-option-foreground: var(--ink-2); --priority-selection-border: rgba(100,116,139,0.2); --header-tag-remove-hover-foreground: #b91c1c; }
  :root { --radius: 8px; --radius-sm: 6px; --radius-pill: 999px; --panel-gradient: linear-gradient(180deg, var(--panel-gradient-color-1) 0%, var(--surface) 100%); --newbox-gradient: linear-gradient(180deg, var(--newbox-gradient-color-1) 0%, var(--new-session-background) 100%); --latest-gradient: linear-gradient(180deg, var(--latest-gradient-color-1) 0%, var(--latest-gradient-color-2) 100%); --shadow-sm: 0 1px 2px var(--shadow-sm-color-1); --shadow-md: 0 6px 18px var(--shadow-md-color-1), 0 2px 6px var(--shadow-md-color-2); --shadow-pop: 0 14px 34px var(--shadow-pop-color-1), 0 4px 12px var(--shadow-pop-color-2); }
  html[data-theme="dark"] { --panel-gradient: linear-gradient(180deg, var(--panel-gradient-color-1) 0%, var(--panel-gradient-color-2) 100%); --newbox-gradient: linear-gradient(180deg, var(--newbox-gradient-color-1) 0%, var(--new-session-background) 100%); --latest-gradient: linear-gradient(180deg, var(--latest-gradient-color-1) 0%, var(--latest-gradient-color-2) 100%); --shadow-sm: 0 1px 2px var(--shadow-sm-color-1); --shadow-md: 0 8px 22px var(--shadow-md-color-1), 0 2px 8px var(--shadow-md-color-2); --shadow-pop: 0 18px 40px var(--shadow-pop-color-1), 0 6px 16px var(--shadow-pop-color-2); }
  * { box-sizing: border-box; }
  html, body { height: 100%; margin: 0; overflow: hidden; }
  body { font-family: ui-sans-serif, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
    color: var(--ink-2); background: var(--canvas); display: flex; position: fixed; width: 100%; top: var(--app-viewport-top, 0px); height: 100vh; height: var(--app-viewport-height, 100dvh); overflow: hidden;
    -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
  button { cursor: pointer; border-radius: var(--radius-sm); border: 1px solid var(--line-2); background: var(--surface);
    color: var(--ink-2); font-size: 0.8rem; font-weight: 500; padding: 0.3rem 0.65rem;
    box-shadow: var(--shadow-sm); transition: background 0.15s, border-color 0.15s, box-shadow 0.15s, color 0.15s, transform 0.05s; }
  button:hover { background: var(--button-hover); border-color: var(--button-hover-border); }
  button:active { transform: translateY(0.5px); }
  button:focus-visible { outline: 2px solid var(--accent-ring); outline-offset: 1px; }
  button:disabled { cursor: default; box-shadow: none; opacity: 0.6; }
  [data-vendor="claude"] { --vendor-action-bg: var(--vendor-claude-action-bg); --vendor-action-hover: var(--vendor-claude-action-hover); --vendor-action-fg: var(--vendor-claude-action-fg); --vendor-action-ring: var(--vendor-claude-action-ring); }
  [data-vendor="codex"] { --vendor-action-bg: var(--vendor-codex-action-bg); --vendor-action-hover: var(--vendor-codex-action-hover); --vendor-action-fg: var(--vendor-codex-action-fg); --vendor-action-ring: var(--vendor-codex-action-ring); }
  [data-vendor="cursor"] { --vendor-action-bg: var(--vendor-cursor-action-bg); --vendor-action-hover: var(--vendor-cursor-action-hover); --vendor-action-fg: var(--vendor-cursor-action-fg); --vendor-action-ring: var(--vendor-cursor-action-ring); }
  [data-vendor="antigravity"] { --vendor-action-bg: var(--vendor-antigravity-action-bg); --vendor-action-hover: var(--vendor-antigravity-action-hover); --vendor-action-fg: var(--vendor-antigravity-action-fg); --vendor-action-ring: var(--vendor-antigravity-action-ring); }
  [data-vendor="copilot"] { --vendor-action-bg: var(--vendor-copilot-action-bg); --vendor-action-hover: var(--vendor-copilot-action-hover); --vendor-action-fg: var(--vendor-copilot-action-fg); --vendor-action-ring: var(--vendor-copilot-action-ring); }
  [data-vendor="opencode"] { --vendor-action-bg: var(--vendor-opencode-action-bg); --vendor-action-hover: var(--vendor-opencode-action-hover); --vendor-action-fg: var(--vendor-opencode-action-fg); --vendor-action-ring: var(--vendor-opencode-action-ring); }
  button[data-vendor]:focus-visible { outline-color: var(--vendor-action-ring); }
  input, textarea, select { font-family: inherit; }
  input:focus, textarea:focus, select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
  ::-webkit-scrollbar { width: 10px; height: 10px; }
  ::-webkit-scrollbar-thumb { background: var(--scroll-thumb); border-radius: 999px; border: 2px solid transparent; background-clip: content-box; }
  ::-webkit-scrollbar-thumb:hover { background: var(--scroll-thumb-hover); background-clip: content-box; }
  ::-webkit-scrollbar-track { background: transparent; }
  * { scrollbar-width: thin; scrollbar-color: var(--scroll-thumb) transparent; }
  /* sidebar */
  .side { position: relative; width: 320px; flex-shrink: 0; background: var(--surface-2); border-right: 1px solid var(--line); display: flex; flex-direction: column; container-type: inline-size; }
  /* draggable divider to widen/narrow the sidebar */
  .resizer { width: 6px; flex-shrink: 0; cursor: col-resize; touch-action: none; background: transparent; transition: background 0.15s; }
  .resizer:hover, .resizer.dragging { background: var(--resizer-hover); }
  /* brand header */
  .side .brand { flex-shrink: 0; display: flex; align-items: center; gap: 0.5rem; padding: 0.72rem 0.85rem 0.68rem; }
  .brand-id { flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 0.5rem; overflow: hidden; }
  .brand-name { flex-shrink: 0; font-size: 1.32rem; font-weight: 800; letter-spacing: 0; color: var(--ink); line-height: 1; }
  .brand-scope { display: none; min-width: 0; max-width: 14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.8rem; font-weight: 600; color: var(--ink-4); }
  .side .brand #settingsToggle { margin-left: auto; }
  /* compact throughput stats */
  .brand-stats { appearance: none; flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 0.55rem; overflow: visible; padding: 0.2rem 0.25rem; margin: -0.2rem -0.25rem; border: 0; border-radius: 4px; background: transparent; box-shadow: none; font: inherit; text-align: left; cursor: pointer; }
  .brand-stats:hover { background: var(--accent-soft); }
  .brand-stats:hover .statval { color: var(--accent); }
  .brand-stats:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
  .statcard { flex-shrink: 0; min-width: 0; display: inline-flex; align-items: baseline; gap: 0.2rem; color: var(--ink-4); }
  .statval { font-size: 0.78rem; font-weight: 760; letter-spacing: 0; color: var(--ink-2); line-height: 1; font-variant-numeric: tabular-nums; }
  .statlbl { font-size: 0.64rem; font-weight: 600; letter-spacing: 0; color: var(--ink-4); white-space: nowrap; }
  .side .topnav { padding: 0.75rem 1rem 0.85rem; display: flex; flex-wrap: wrap; gap: 0.55rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .side .topnav a { font-size: 0.78rem; color: var(--accent); text-decoration: none; align-self: center; margin-left: auto; }
  .session-searchwrap { flex: 0 0 auto; }
  .topnav-actions { display: flex; flex-wrap: nowrap; align-items: center; gap: 0.75rem; width: 100%; min-width: 0; }
  .hub-entries { display: flex; flex: 0 0 auto; align-items: center; gap: 0.08rem; min-width: 0; white-space: nowrap; }
  .hub-entries > span { color: var(--line-2); font-size: 0.65rem; }
  .hub-entry { display: inline-flex; align-items: center; gap: 0.2rem; padding: 0.3rem 0.18rem; border: 0; background: transparent; color: var(--ink-3); box-shadow: none; font-size: 0.68rem; }
  .hub-entry:hover, .hub-entry[aria-expanded="true"] { background: var(--accent-soft); color: var(--accent); box-shadow: none; }
  .searchwrap { --search-range-width: 5rem; position: relative; flex: 1; min-width: 0; display: flex; align-items: center; }
  .search-ico { position: absolute; left: 0.7rem; width: 0.9rem; height: 0.9rem; stroke: var(--ink-4); stroke-width: 1.7; fill: none; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
  .search-clear { position: absolute; right: calc(var(--search-range-width) + 0.18rem); width: 1.25rem; height: 1.25rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: none; color: var(--ink-4); font-size: 0.9rem; line-height: 1; }
  .search-clear:hover { color: var(--ink); background: var(--button-hover); box-shadow: none; }
  .search-clear[hidden] { display: none; }
  .search-range-button { position: absolute; z-index: 2; right: 0.25rem; width: var(--search-range-width); height: 1.55rem; display: flex; align-items: center; justify-content: center; gap: 0.28rem; padding: 0.12rem 0.52rem 0.12rem 0.42rem; border: 0; border-left: 1px solid var(--line); border-radius: 0 4px 4px 0; color: var(--ink-4); background: transparent; box-shadow: none; font-size: 0.64rem; font-weight: 650; white-space: nowrap; }
  .search-range-button:hover, .search-range-button[aria-expanded="true"] { color: var(--ink-2); background: color-mix(in srgb, var(--surface-2) 72%, transparent); box-shadow: none; }
  .search-range-button.active { color: var(--warning); border-left-color: color-mix(in srgb, var(--warning) 38%, var(--line)); }
  .search-range-button svg { width: 0.62rem; height: 0.62rem; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
  .search-range-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .search-range-clock { display: none; }
  .search-range-menu { position: absolute; z-index: 66; top: calc(100% + 0.34rem); left: 0; width: min(11rem, calc(100vw - 2rem)); padding: 0.3rem; border: 1px solid color-mix(in srgb, var(--menu-border) 72%, transparent); border-radius: 10px; color: var(--menu-foreground); background: color-mix(in srgb, var(--menu-background) 96%, transparent); box-shadow: var(--shadow-pop); backdrop-filter: blur(12px) saturate(1.08); }
  .search-range-menu.custom { width: min(20rem, calc(100vw - 2rem)); padding: 0.42rem; }
  .search-range-menu[hidden] { display: none; }
  .search-range-option { width: 100%; min-height: 1.9rem; display: flex; align-items: center; gap: 0.45rem; padding: 0.32rem 0.48rem; border: 0; border-radius: 6px; color: var(--ink-2); background: transparent; box-shadow: none; font-size: 0.73rem; text-align: left; }
  .search-range-option + .search-range-option { margin-top: 0.05rem; }
  .search-range-option:hover, .search-range-option.on { color: var(--ink); background: color-mix(in srgb, var(--surface-2) 78%, transparent); box-shadow: none; }
  .search-range-option[aria-selected="true"] { color: var(--ink); background: var(--accent-soft); font-weight: 600; }
  .search-range-option[aria-selected="true"]:hover, .search-range-option[aria-selected="true"].on { background: var(--accent-soft); }
  .search-range-option-label { flex: 1; min-width: 0; }
  .search-range-option-check { flex-shrink: 0; color: var(--accent); font-size: 0.7rem; font-weight: 800; }
  .search-range-custom-head { display: grid; grid-template-columns: 1.7rem minmax(0,1fr) 1.7rem; align-items: center; min-height: 1.8rem; margin-bottom: 0.28rem; }
  .search-range-custom-back { width: 1.7rem; height: 1.7rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 6px; color: var(--ink-3); background: transparent; box-shadow: none; font-size: 1rem; }
  .search-range-custom-back:hover { color: var(--ink); background: var(--button-hover); box-shadow: none; }
  .search-range-custom-title { color: var(--ink); font-size: 0.73rem; font-weight: 700; text-align: center; }
  .search-range-custom-fields { display: grid; gap: 0.34rem; padding: 0.08rem; }
  .search-range-custom-field { display: grid; grid-template-columns: 2.25rem minmax(0,1fr); align-items: center; gap: 0.4rem; }
  .search-range-custom-field > span { color: var(--ink-4); font-size: 0.65rem; font-weight: 650; }
  .search-range-custom-field .scheduledatetime { min-width: 0; height: 1.9rem; }
  .search-range-custom-field .scheduledatetime input { font-size: 0.68rem; }
  .search-range-custom-picker { margin: 0.12rem 0.08rem 0; }
  .search-range-custom-error { min-height: 1rem; padding: 0.2rem 0.1rem 0; color: var(--theme-search-error-foreground); font-size: 0.62rem; line-height: 1.25; }
  html[data-theme="dark"] .search-range-custom-error { color: var(--theme-search-error-foreground); }
  .search-range-custom-error:empty { visibility: hidden; }
  .search-range-custom-actions { display: flex; justify-content: flex-end; padding: 0.14rem 0.08rem 0.04rem; }
  .search-range-custom-apply { min-height: 1.75rem; padding: 0.26rem 0.68rem; border-color: var(--primary-bg); border-radius: 7px; color: var(--primary-fg); background: var(--primary-bg); box-shadow: none; font-size: 0.68rem; font-weight: 700; }
  .search-range-custom-apply:hover { border-color: var(--primary-hover); background: var(--primary-hover); box-shadow: none; }
  .search-error { position: absolute; z-index: 65; left: 0; top: calc(100% + 0.3rem); max-width: 22rem; padding: 0.3rem 0.45rem; border: 1px solid var(--theme-search-error-border); border-radius: var(--radius-sm); background: var(--theme-search-error-background); color: var(--theme-search-error-search-error-foreground); box-shadow: var(--shadow-md); font-size: 0.66rem; line-height: 1.3; }
  .search-error[hidden] { display: none; }
  #newToggle { container: new-action / inline-size; box-sizing: border-box; flex: 1 1 4.5rem; min-width: 2rem; max-width: 4.5rem; margin-left: auto; display: inline-flex; align-items: center; justify-content: center; gap: 0.2rem; white-space: nowrap; font-weight: 700; color: var(--vendor-action-fg); border-color: var(--vendor-action-bg); background: var(--vendor-action-bg); box-shadow: var(--shadow-sm); padding: 0.4rem 0.5rem; }
  #newToggle:hover { background: var(--vendor-action-hover); border-color: var(--vendor-action-hover); box-shadow: 0 4px 14px var(--vendor-action-ring); }
  @container new-action (max-width: 2.4rem) {
    .new-toggle-label { display: none; }
  }
  .todohub-count { color: var(--todo-fg); font-size: 0.58rem; font-weight: 800; font-variant-numeric: tabular-nums; }
  .todohub-count[hidden] { display: none; }
  .settings-panel { box-sizing: border-box; width: min(24rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); overflow-y: auto; padding: 1rem; border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--floating-panel-background); color: var(--ink); border-color: var(--floating-panel-border); box-shadow: 0 18px 44px -10px var(--floating-panel-shadow), 0 6px 16px -8px var(--floating-panel-shadow); }
  .settings-panel::backdrop { background: var(--theme-overlay-background); }
  .settings-panel.settings-workspace { width: min(60rem, calc(100vw - 3rem)); max-width: none; max-height: calc(100dvh - 3rem); padding: 0; overflow: hidden; border-radius: 14px; }
  .settings-workspace[open] { display: flex; flex-direction: column; }
  .settings-workspace > .settings-head { flex-shrink: 0; align-items: flex-start; margin: 0; padding: 1.4rem 1.6rem 1.2rem; border-bottom: 1px solid var(--line); }
  .settings-workspace .settings-head h2 { font-size: 1.25rem; letter-spacing: -0.025em; }
  .settings-intro { margin: 0.4rem 0 0; color: var(--ink-3); font-size: 0.8rem; line-height: 1.5; }
  .settings-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 1.4rem 1.6rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .settings-group { min-width: 0; padding: 1.1rem; border: 1px solid var(--line); border-radius: 10px; }
  .settings-appearance { grid-column: 1 / -1; }
  .settings-group h3 { margin: 0; font-size: 0.9rem; font-weight: 650; }
  .settings-group-description { margin: 0.35rem 0 1rem; color: var(--ink-3); font-size: 0.76rem; line-height: 1.5; }
  .settings-theme-tools { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0.6rem; margin-top: 1rem; padding-top: 0.85rem; border-top: 1px solid var(--line); }
  .settings-theme-tools .theme-actions { margin: 0; }
  .settings-theme-tools button { min-height: 2rem; font-size: 0.74rem; box-shadow: none; }
  .settings-theme-tools #themeDelete { color: var(--theme-error-foreground); }
  .settings-control-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(6rem, 8.5rem); align-items: center; gap: 1rem; }
  .settings-control-copy { display: grid; gap: 0.35rem; font-size: 0.8rem; font-weight: 600; }
  .settings-control-copy .settings-note { margin: 0; font-weight: 400; line-height: 1.5; }
  .settings-workspace .settings-field { margin-top: 0; }
  .settings-workspace .settings-field select, .settings-workspace .settings-field input { min-height: 2.3rem; font-weight: 400; }
  .settings-workspace .settings-custom-columns { margin-top: 0.9rem; padding-top: 0.9rem; border-top: 1px solid var(--line); }
  .settings-custom-columns input[aria-invalid="true"] { border-color: var(--theme-error-border); }
  .settings-custom-columns:has(input[aria-invalid="true"]) .settings-note { color: var(--theme-error-foreground); }
  .settings-workspace .settings-daemon { grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; }
  .settings-workspace .settings-daemon input { width: 2.5rem; height: 1.5rem; min-height: 0; }
  .settings-workspace .settings-daemon input::before { width: 1.2rem; height: 1.2rem; }
  .settings-workspace .settings-daemon input:checked::before { transform: translateX(1rem); }
  .settings-feedback:not(:empty) { margin: 0.8rem 0 0; line-height: 1.5; }
  .settings-feedback:empty { margin: 0; }
  .settings-footer { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.6rem; border-top: 1px solid var(--line); background: var(--surface); }
  .settings-footer p { margin: 0; color: var(--ink-3); font-size: 0.73rem; }
  .settings-done { min-height: 2.25rem; min-width: 5rem; color: var(--primary-fg); background: var(--primary-bg); border-color: var(--primary-bg); box-shadow: none; }
  .settings-done:hover { color: var(--primary-fg); background: var(--primary-hover); border-color: var(--primary-hover); }
  @media (max-width: 680px) {
    .settings-panel.settings-workspace { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); border-radius: 12px; }
    .settings-workspace > .settings-head { padding: 1.1rem; }
    .settings-body { grid-template-columns: minmax(0, 1fr); padding: 1rem; gap: 0.85rem; }
    .settings-group { padding: 0.9rem; }
    .settings-theme-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem; }
    .settings-theme-preview { height: 4.25rem; }
    .settings-theme-tools button, .settings-done { min-height: 2.5rem; }
    .settings-workspace .theme-toggle { width: 2.5rem; height: 2.5rem; }
    .settings-footer { padding: 0.85rem 1.1rem; }
  }
  @media (max-width: 360px) {
    .settings-theme-list { grid-template-columns: minmax(0, 1fr); }
    .settings-theme-option { flex-direction: row; align-items: center; }
    .settings-theme-preview { width: 5rem; flex-shrink: 0; }
    .settings-theme-caption { flex: 1; }
    .settings-control-row { grid-template-columns: minmax(0, 1fr); gap: 0.65rem; }
  }
  .preset-form { display: grid; gap: 0.8rem; }
  .preset-form label { display: grid; gap: 0.3rem; font-size: 0.74rem; color: var(--ink-3); }
  .preset-form input, .preset-form select { width: 100%; box-sizing: border-box; padding: 0.5rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); }
  .preset-actions { display: flex; justify-content: flex-end; gap: 0.4rem; }
  .preset-section { margin-top: 0.35rem; padding-top: 0.35rem; border-top: 1px solid var(--line); }
  .preset-section-title { padding: 0.25rem 0.48rem 0.35rem; color: var(--ink-3); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; }
  .preset-row { display: flex; align-items: center; border-radius: 6px; }
  .preset-row:hover, .preset-row:focus-within { background: var(--button-hover); }
  .preset-row:has([aria-selected="true"]), .preset-row:has([aria-current="true"]) { background: var(--accent-soft); }
  .preset-section .preset-pick { flex: 1; min-width: 0; width: auto; display: block; padding: 0.5rem 0.48rem; border: 0; border-radius: 6px; background: transparent; color: var(--ink-2); box-shadow: none; text-align: left; font-size: 0.73rem; line-height: 1.35; }
  .preset-section .preset-pick:hover, .preset-section .preset-pick.on { background: transparent; box-shadow: none; }
  .preset-section .preset-pick:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
  .preset-heading { display: flex; align-items: center; gap: 0.4rem; min-width: 0; }
  .preset-label, .preset-detail { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .preset-label { font-weight: 600; }
  .preset-command { flex-shrink: 0; max-width: 45%; overflow: hidden; text-overflow: ellipsis; color: var(--ink-3); font-size: 0.61rem; font-weight: 400; }
  .preset-detail { margin-top: 0.2rem; color: var(--ink-3); font-size: 0.65rem; line-height: 1.4; }
  .preset-edit, .preset-delete { flex-shrink: 0; width: 1.65rem; height: 1.8rem; display: grid; place-items: center; padding: 0; border: 0; border-radius: 5px; background: transparent; color: var(--ink-4); box-shadow: none; }
  .preset-edit:hover, .preset-delete:hover { background: var(--surface); color: var(--ink); box-shadow: none; }
  .preset-delete:hover { color: var(--theme-button-delete-hover-foreground); }
  .preset-delete { margin-right: 0.2rem; }
  .preset-edit svg, .preset-delete svg, .preset-add svg { width: 0.85rem; height: 0.85rem; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
  .preset-section button.preset-add { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 0.45rem; width: 100%; margin-top: 0.2rem; padding: 0.45rem 0.48rem; border: 0; border-radius: 6px; background: transparent; color: var(--ink-3); box-shadow: none; font-size: 0.71rem; font-weight: 500; text-align: left; }
  .preset-section .preset-add:hover, .preset-section .preset-add.on { color: var(--ink); background: var(--button-hover); box-shadow: none; }
  .settings-head { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 1rem; }
  .settings-head h2 { margin: 0; font-size: 0.95rem; }
  .settings-field { display: grid; gap: 0.45rem; margin-top: 1rem; font-size: 0.76rem; font-weight: 600; }
  .settings-themes { display: flex; gap: 0.4rem; }
  .settings-themes button { flex: 1; font-size: 0.76rem; }
  .settings-themes button[aria-pressed="true"] { color: var(--accent); border-color: var(--accent); background: var(--accent-soft); }
  .settings-field select, .settings-field input { box-sizing: border-box; width: 100%; min-width: 0; padding: 0.5rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); color: var(--ink); background: var(--input-bg); font: inherit; }
  .settings-field[hidden] { display: none; }
  .settings-daemon { grid-template-columns: 1fr auto; align-items: center; }
  .settings-daemon input { appearance: none; width: 2.2rem; height: 1.3rem; padding: 0; margin: 0; border: 0; border-radius: 1rem; background: var(--line-2); cursor: pointer; transition: background 0.15s; }
  .settings-daemon input::before { content: ''; display: block; width: 1rem; height: 1rem; margin: 0.15rem; border-radius: 50%; background: var(--surface); box-shadow: 0 1px 3px var(--theme-settings-switch-shadow); transition: transform 0.15s; }
  .settings-daemon input:checked { background: var(--accent); }
  .settings-daemon input:checked::before { transform: translateX(0.9rem); }
  .settings-daemon input:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
  .settings-daemon input:disabled { opacity: 0.5; cursor: wait; }
  .settings-note { margin: 0.4rem 0 0; font-size: 0.7rem; color: var(--ink-3); }
  .it-meta[hidden] { display: none; }
  .theme-toggle { width: 2rem; height: 2rem; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0; color: var(--ink-3); background: transparent; border: 0; border-radius: var(--radius); box-shadow: none; }
  .theme-toggle:hover { color: var(--ink); background: var(--button-hover); box-shadow: none; }
  .theme-toggle svg { width: 0.88rem; height: 0.88rem; stroke: currentColor; stroke-width: 1.9; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .panel-toggle.on { color: var(--accent); background: var(--accent-soft); }
  .panel-toggle svg { fill: none; }
  @container (min-width: 420px) {
    .brand-scope { display: inline-block; flex: 0 1 auto; }
  }
  @container (max-width: 360px) {
    .it-live-label { display: none; }
  }
  .tagbar { flex: 0 1 auto; min-height: 0; padding: 0.7rem 0.95rem; border-bottom: 1px solid var(--line); background: var(--surface); display: flex; flex-direction: column; gap: 0.5rem; }
  .tagbar > * { flex: 0 0 auto; }
  .tagbar.overflowing { overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
  .tagbar .taghead { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
  .tagbar .tagttl { font-size: 0.66rem; font-weight: 700; color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.06em; }
  .taghead-label { display: contents; }
  .tagsearchwrap { display: flex; align-items: center; flex: 0 1 7.5rem; min-width: 5rem; max-width: 8rem; }
  .tagsearchwrap .searchbox { width: 100%; height: 1.25rem; box-sizing: border-box; padding: 0.08rem 1.65rem 0.08rem 0.6rem; border-radius: var(--radius-pill); font-size: 0.65rem; line-height: 1; }
  .tagsearchwrap .search-ico { display: none; }
  .tagsearchwrap .search-clear { right: 0.16rem; width: 0.95rem; height: 0.95rem; font-size: 0.72rem; }
  .tagmode-toggle { appearance: none; align-self: center; min-width: 0; padding: 0.05rem 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--ink-4); font-size: 0.61rem; line-height: normal; text-transform: lowercase; cursor: pointer; flex-shrink: 0; white-space: nowrap; }
  .tagmode-toggle:hover { color: var(--ink); background: transparent; box-shadow: none; text-decoration: underline; text-underline-offset: 2px; }
  .tagmode-toggle:focus-visible { outline: 1px solid var(--focus); outline-offset: 2px; }
  .tagorder-toggle { white-space: nowrap; }
  .instant-tip { position: relative; }
  .instant-tip::after { content: attr(data-tooltip); position: absolute; z-index: 80; top: calc(100% + 0.4rem); width: max-content; max-width: min(19rem, calc(100vw - 2rem)); padding: 0.38rem 0.5rem; border: 1px solid var(--tabtip-border); border-radius: var(--radius); background: var(--tabtip-bg); box-shadow: var(--shadow-md); color: var(--ink-2); font-size: 0.67rem; font-weight: 500; line-height: 1.35; text-align: left; text-transform: none; white-space: normal; opacity: 0; visibility: hidden; pointer-events: none; }
  .instant-tip:hover::after, .instant-tip:focus-visible::after { opacity: 1; visibility: visible; }
  .instant-tip-left::after { left: 0; }
  .instant-tip-right::after { right: 0; }
  .hover-tip { position: fixed; z-index: 160; width: max-content; max-width: min(34rem, calc(100vw - 1.5rem)); padding: 0.38rem 0.5rem; border: 1px solid var(--tabtip-border); border-radius: var(--radius); background: var(--tabtip-bg); box-shadow: var(--shadow-md); color: var(--ink-2); font-size: 0.67rem; font-weight: 500; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; pointer-events: none; opacity: 0; transform: translateY(3px); transition: opacity 0.08s ease, transform 0.08s ease; }
  .hover-tip[hidden] { display: none; }
  .hover-tip.show { opacity: 1; transform: translateY(0); }
  .viewrow { display: flex; align-items: center; }
  .viewtabs { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; }
  .viewtab { font-size: 0.68rem; color: var(--ink-3); padding: 0.16rem 0.58rem; border-radius: var(--radius-pill); box-shadow: none; background: var(--surface); border: 1px solid var(--line-2); }
  .viewtab:hover { color: var(--ink); background: var(--button-hover); }
  .viewtab.on { color: var(--theme-tab-active-active-foreground); background: var(--theme-tab-active-active-background); border-color: var(--theme-tab-active-active-border); box-shadow: 0 0 0 1px var(--theme-tab-active-active-shadow); }
  .viewtabcount { margin-left: 0.32rem; font-size: 0.58rem; font-weight: 650; line-height: 1; opacity: 0.58; font-variant-numeric: tabular-nums; }
  .bulkarchive { align-self: center; flex-shrink: 0; min-width: 0; font-size: 0.62rem; font-weight: 740; color: var(--theme-archive-foreground); padding: 0.05rem 0; border: 0; background: transparent; box-shadow: none; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; margin-left: auto; }
  .bulkarchive:hover:not(:disabled) { color: var(--theme-archive-hover-foreground); background: transparent; text-decoration: underline; text-underline-offset: 2px; box-shadow: none; }
  .bulkarchive:disabled { color: var(--ink-4); background: transparent; box-shadow: none; opacity: 0.62; cursor: default; }
  .viewtabgroup { display: inline-flex; align-items: stretch; border: 1px solid var(--line-2); border-radius: var(--radius-pill); overflow: hidden; background: var(--surface); }
  .viewtabgroup .viewtab { border: 0; border-radius: 0; }
  .viewtabgroup .viewtab:focus-visible, .viewtabgroup .viewtabx:focus-visible { outline: none; }
  .viewtabgroup:has(.viewtab:focus-visible), .viewtabgroup:has(.viewtabx:focus-visible) { box-shadow: 0 0 0 3px var(--accent-ring); }
  .viewtabgroup.on { border-color: var(--theme-tab-group-active-border); background: var(--theme-tab-group-active-background); box-shadow: 0 0 0 1px var(--theme-tab-group-active-shadow); }
  .viewtabgroup.on:has(.viewtab:focus-visible) { box-shadow: 0 0 0 1px var(--theme-tab-active-viewtabgroup-on-viewtab-active-shadow), 0 0 0 4px var(--accent-ring); }

  .viewtabgroup.on:has(.viewtabx:focus-visible) { box-shadow: 0 0 0 1px var(--theme-tab-close-active-shadow), 0 0 0 4px var(--accent-ring); }
  .viewtabgroup.on .viewtab.on { background: transparent; box-shadow: none; }
  .viewtabgroup.on .viewtabx { border-left-color: var(--theme-tab-close-active-border); }
  .viewtabx { border: 0; border-left: 1px solid var(--line); border-radius: 0; color: var(--ink-4); background: transparent; padding: 0.16rem 0.4rem; box-shadow: none; }
  .viewtabx:hover { color: var(--theme-tab-close-hover-foreground); background: var(--theme-tab-close-hover-background); }
  .tagchips { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; }
  .tagempty { font-size: 0.72rem; color: var(--ink-4); }
  .gtag { display: inline-flex; align-items: stretch; min-height: 1.35rem; border: 1px solid var(--line-2); border-radius: var(--radius-pill); overflow: hidden; background: var(--surface); box-shadow: var(--shadow-sm); transition: box-shadow 0.15s, transform 0.05s; }
  .gtag:hover { box-shadow: var(--shadow-md); }
  .gtag[draggable="true"] { cursor: grab; }
  .gtag[draggable="true"]:active { cursor: grabbing; }
  .gtag.dragging { opacity: 0.38; }
  .gtag.drag-layout-source { position: absolute; visibility: hidden; pointer-events: none; }
  #tagFilters .tag-drag-placeholder { box-sizing: border-box; pointer-events: none; border: 1px dashed var(--accent); background: transparent; opacity: 0.55; box-shadow: none; }
  #tagFilters .tag-drag-placeholder .gtagbtn { color: var(--accent); white-space: nowrap; }
  .tag-pin-empty { display: inline-flex; align-items: center; padding: 0.18rem 0.3rem; border: 0; border-radius: 4px; color: var(--ink-4); background: transparent; box-shadow: none; font-size: 0.62rem; line-height: 1; white-space: nowrap; user-select: none; }
  .tag-pin-empty.drag-over { display: none; }
  .tag-pin-divider { position: relative; flex: 0 0 0.7rem; align-self: stretch; min-height: 1.35rem; }
  .tag-pin-divider::before { content: ''; position: absolute; top: 0.08rem; bottom: 0.08rem; left: 50%; width: 1px; border-radius: 1px; background: var(--ink-3); opacity: 0.82; transform: translateX(-50%); transition: width 0.15s, background 0.15s, box-shadow 0.15s; }
  .tag-hidden-divider { flex: 1 0 100%; min-width: 0; display: grid; grid-template-columns: minmax(1rem, 1fr) auto minmax(1rem, 1fr); align-items: center; gap: 0.5rem; min-height: 1rem; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--ink-4); font-size: 0.58rem; line-height: 1; letter-spacing: 0.04em; text-transform: uppercase; }
  .tag-hidden-divider::before, .tag-hidden-divider::after { content: ''; height: 1px; background: var(--line); transition: height 0.12s, background 0.12s, box-shadow 0.12s; }
  .tag-hidden-divider:hover { border: 0; background: transparent; color: var(--ink-2); box-shadow: none; }
  .tag-hidden-divider:hover::before, .tag-hidden-divider:hover::after { background: var(--line-2); }
  .tag-hidden-divider[aria-expanded="true"] { color: var(--ink-3); }
  .tag-hidden-divider.drag-over { border: 0; background: transparent; color: var(--accent); box-shadow: none; }
  .tag-hidden-divider.drag-over::before, .tag-hidden-divider.drag-over::after { height: 2px; background: var(--accent); box-shadow: 0 0 0 2px var(--accent-ring); }
  .tag-hidden-shelf { flex: 1 0 100%; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; padding: 0.02rem 0 0.08rem; }
  .gtag.on { border-color: var(--theme-tag-active-border); background: var(--theme-tag-active-background); box-shadow: inset 0 0 0 1px var(--theme-tag-active-shadow); }
  .gtagbtn, .gtagdel { border: 0; border-radius: 0; font-size: 0.7rem; background: transparent; padding: 0.18rem 0.55rem; box-shadow: none; }
  .gtagbtn { color: var(--theme-tag-label-foreground); display: inline-flex; align-items: center; }
  .gtagcount { margin-left: 0.32rem; font-size: 0.58rem; font-weight: 650; line-height: 1; opacity: 0.58; font-variant-numeric: tabular-nums; }
  .gtag.deletable .gtagbtn { padding-right: 0.18rem; }
  .gtag.on .gtagbtn { background: transparent; color: var(--theme-tag-label-active-foreground); }
  .gtagdel { color: var(--ink-4); padding: 0.18rem 0.4rem 0.18rem 0.24rem; margin-left: 0; }
  .gtag.on.deletable .gtagbtn { border-right: 1px solid var(--theme-tag-label-active-border); }
  .gtagdel:hover { background: var(--theme-tag-delete-hover-background); color: var(--theme-tag-delete-hover-foreground); }
  .gtag.auto .gtagbtn { font-weight: 600; }
  .prioritytag { position: relative; overflow: visible; }
  .prioritytag .gtagbtn::after { content: '⌄'; margin-left: 0.32rem; font-size: 0.62rem; opacity: 0.66; }
  .prioritytagmenu { position: absolute; z-index: 55; top: calc(100% + 5px); left: 0; min-width: 7.25rem; padding: 0.3rem; border: 1px solid var(--menu-border); border-radius: var(--radius); background: var(--menu-background); box-shadow: var(--shadow-pop); }
  .prioritytagopt { display: flex; align-items: center; gap: 0.45rem; width: 100%; padding: 0.32rem 0.48rem; border: 0; border-radius: var(--radius-sm); background: transparent; box-shadow: none; color: var(--ink-2); font-size: 0.72rem; text-align: left; }
  .prioritytagopt:hover { background: var(--button-hover); }
  .prioritytagopt input { margin: 0; pointer-events: none; }
  .prioritytagopt .prilabel { margin-left: 0.05rem; cursor: default; }
  /* "untagged" is a system filter, not a user tag: the dashed empty-slot
     treatment keeps it useful without competing with the colored taxonomy. */
  .gtag.untagged { border-style: dashed; background: transparent; box-shadow: none; }
  .gtag.untagged .gtagbtn { color: var(--ink-3); font-weight: 500; }
  .gtag.untagged:hover { background: var(--button-hover); box-shadow: none; }
  .gtag.untagged.on { border-style: solid; border-color: var(--theme-tag-activeuntagged-border); background: var(--theme-tag-activeuntagged-background); box-shadow: inset 0 0 0 1px var(--theme-tag-activeuntagged-shadow); }
  .gtag.untagged.on .gtagbtn { color: var(--theme-tag-label-activeuntagged-foreground); }
  /* custom (user) filter tags stay quiet until selected; heat is a soft wash. */
  .gtag:not(.auto):not(.on) { border-style: solid; border-color: var(--line-2); background: transparent; box-shadow: none; }
  .gtag:not(.auto):not(.on) .gtagbtn { color: var(--theme-tag-label-gtag-auto-on-gtagbtn-active-foreground); }
  .gtag:not(.auto):not(.on):hover { background: var(--button-hover); box-shadow: none; }
  .gtag.tag-hidden:not(.on) { border-style: dashed; opacity: 0.74; }
  .gtag.tag-hidden:not(.on):hover { opacity: 1; }
  .gtag.hot:not(.on) { background: linear-gradient(90deg, var(--tag-heat-soft), var(--tag-heat-fade) 58%, transparent); }
  .gtag.hot:not(.on):hover { background: linear-gradient(90deg, var(--tag-heat-soft), var(--tag-heat-fade) 58%, transparent), var(--button-hover); }
  .tagadd-compact { font-size: 0.66rem; border: 1px solid transparent; color: var(--theme-tag-add-foreground); padding: 0.1rem 0.46rem; border-radius: var(--radius-pill); box-shadow: none; background: transparent; }
  .tagadd-compact:hover { background: var(--theme-tag-add-hover-background); border-color: transparent; }
  .tagcreate-inline { position: relative; flex: 1 1 14rem; min-width: min(14rem, 100%); }
  .tagcreate-inline .tagedit-row { align-items: stretch; }
  .tagcreate-inline .tagedit-input { font-size: 0.74rem; }
  .searchbox { flex: 1; min-width: 0; font-size: 0.8rem; padding: 0.5rem calc(var(--search-range-width) + 0.4rem) 0.5rem 2.1rem; border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--input-bg); color: var(--ink-2); }
  .session-searchwrap.filtering .searchbox { padding-right: calc(var(--search-range-width) + 1.65rem); }
  .searchbox.filtering { border-color: var(--warning); background: var(--warning-soft); box-shadow: 0 0 0 1px var(--warning-ring); }
  .searchbox.filtering:focus { border-color: var(--warning); box-shadow: 0 0 0 3px var(--warning-ring); }
  .searchwrap.filtering .search-ico { stroke: var(--warning); }
  @container (max-width: 280px) {
    .session-searchwrap { --search-range-width: 1.85rem; }
    .session-searchwrap .search-range-text { display: none; }
    .session-searchwrap .search-range-button { padding: 0; }
    .session-searchwrap .search-range-button svg { width: 0.72rem; height: 0.72rem; }
    .session-searchwrap .search-range-button .search-range-clock { display: block; }
    .session-searchwrap .search-range-button .search-range-chevron { display: none; }
  }
  .newsession-anchor { position: relative; z-index: 70; flex-shrink: 0; }
  .side.newsession-panel-active { z-index: 70; }
  .newbox { position: absolute; z-index: 70; top: calc(100% + 0.4rem); left: 1rem; right: 1rem; max-height: calc(100dvh - 8rem); overflow-y: auto; padding: 0.9rem; border: 1px solid var(--new-session-border); border-radius: var(--radius); display: none; flex-direction: column; gap: 0.6rem; background: var(--newbox-gradient); box-shadow: 0 18px 44px -10px var(--new-session-shadow), 0 6px 16px -8px var(--new-session-shadow); }
  .newbox.panel-hosted { position: fixed; right: auto; max-width: 36rem; }
  .newbox.open { display: flex; animation: newboxIn 0.18s ease; }
  .todohub-box { position: fixed; z-index: 70; top: 50%; left: 50%; right: auto; box-sizing: border-box; width: min(32rem, calc(100vw - 1rem)); min-width: min(17.5rem, calc(100vw - 1rem)); min-height: min(11.25rem, calc(100dvh - 1rem)); max-width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); overflow: hidden; padding: 0.75rem; border: 1px solid var(--list-panel-border); border-radius: var(--radius); display: none; flex-direction: column; gap: 0.55rem; background: var(--list-panel-background); box-shadow: 0 18px 44px -10px var(--list-panel-shadow), 0 6px 16px -8px var(--list-panel-shadow); transform: translate(-50%, -50%); }
  .todohub-box.drag-positioned { transform: none; }
  .todohub-box.open { display: flex; animation: todohubIn 0.18s ease; }
  .todohub-head { gap: 0.18rem; }
  .todohub-drag-handle { align-self: stretch; flex: 1 1 auto; min-width: 1.4rem; display: flex; align-items: center; justify-content: center; color: var(--ink-4); cursor: grab; touch-action: none; user-select: none; }
  .todohub-drag-handle::before { content: ""; width: 1.35rem; height: 0.34rem; opacity: 0.62; background: radial-gradient(circle, currentColor 1px, transparent 1.4px) 0 0 / 0.34rem 0.34rem; }
  .todohub-drag-handle.dragging { cursor: grabbing; }
  .todohub-head-actions { display: flex; align-items: center; gap: 0.04rem; }
  .todohub-pin { width: 1.75rem; height: 1.75rem; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--ink-3); box-shadow: none; }
  .todohub-pin:hover { border: 0; background: var(--button-hover); color: var(--ink); box-shadow: none; }
  .todohub-pin[aria-pressed="true"] { background: var(--accent-soft); color: var(--accent); }
  .todohub-pin svg { width: 0.82rem; height: 0.82rem; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; transform: rotate(-38deg); transition: transform 0.14s ease; }
  .todohub-pin[aria-pressed="true"] svg { transform: none; }
  .todohub-pin[aria-pressed="true"] .pin-body { fill: color-mix(in srgb, var(--accent) 16%, transparent); }
  .todohub-resize-handle { position: absolute; right: 0; bottom: 0; width: 1.15rem; height: 1.15rem; color: var(--ink-4); cursor: nwse-resize; touch-action: none; user-select: none; }
  .todohub-resize-handle::after { content: ""; position: absolute; right: 0.24rem; bottom: 0.24rem; width: 0.48rem; height: 0.48rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; opacity: 0.72; }
  .todohub-tabs { min-width: 0; display: flex; align-items: center; gap: 0.08rem; }
  .todohub-tab { display: inline-flex; align-items: baseline; gap: 0.22rem; padding: 0.2rem 0.42rem; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--ink-4); box-shadow: none; font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.66rem; font-weight: 700; }
  .todohub-tab:hover { border: 0; background: var(--button-hover); color: var(--ink-2); box-shadow: none; }
  .todohub-tab[aria-selected="true"] { background: var(--accent-soft); color: var(--accent); }
  .todohub-tab-count { font-size: 0.58rem; font-weight: 820; opacity: 0.78; font-variant-numeric: tabular-nums; }
  .todohub-tab-count[hidden] { display: none; }
  .todohub-add { display: flex; align-items: stretch; gap: 0.38rem; }
  .todohub-add input:disabled { opacity: 0.62; }
  .todohub-add input { flex: 1; min-width: 0; padding: 0.45rem 0.58rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--input-bg); color: var(--ink-2); font: inherit; font-size: 0.76rem; }
  .todohub-add button { flex-shrink: 0; min-width: 3.3rem; border-color: var(--primary-bg); background: var(--primary-bg); color: var(--primary-fg); font-size: 0.7rem; font-weight: 700; }
  .todohub-add button:hover:not(:disabled) { border-color: var(--primary-hover); background: var(--primary-hover); }
  .todohub-add button:disabled { opacity: 0.48; }
  .todohub-body { flex: 1 1 auto; min-height: 5rem; overflow-y: auto; overscroll-behavior: contain; margin: 0 -0.25rem -0.2rem; padding: 0 0.25rem 0.2rem; }
  .todohub-items { display: flex; flex-direction: column; gap: 0.14rem; }
  /* content + actions; only a completable list (todo) prepends a checkbox column */
  .todohub-item { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 0.4rem; padding: 0.42rem 0.38rem; border: 1px solid transparent; border-radius: 8px; }
  .todohub-item.checkable { grid-template-columns: 1.15rem minmax(0,1fr) auto; }
  .todohub-item:hover, .todohub-item:focus-within { border-color: color-mix(in srgb, var(--line-2) 72%, transparent); background: color-mix(in srgb, var(--surface) 76%, transparent); }
  .todohub-item.done { opacity: 0.68; }
  .rail-todo-check.todohub-check { margin: 0.13rem 0 0; }
  .todohub-content { min-width: 0; }
  .todohub-text { width: 100%; display: -webkit-box; overflow: hidden; padding: 0; border: 0; background: transparent; color: var(--ink-2); box-shadow: none; text-align: left; font-size: 0.75rem; line-height: 1.38; word-break: break-word; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .todohub-text:hover { border: 0; background: transparent; color: var(--ink); box-shadow: none; }
  .todohub-item.done .todohub-text { color: var(--ink-4); text-decoration: line-through; }
  .todohub-meta { min-width: 0; display: flex; align-items: center; gap: 0.28rem; margin-top: 0.18rem; color: var(--ink-4); font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.59rem; }
  .todohub-scope { max-width: 100%; overflow: hidden; padding: 0; border: 0; background: transparent; color: var(--ink-4); box-shadow: none; text-overflow: ellipsis; white-space: nowrap; }
  .todohub-scope:hover { border: 0; background: transparent; color: var(--accent); box-shadow: none; }
  .todohub-actions { display: flex; align-items: center; gap: 0.04rem; opacity: 0; transition: opacity 0.12s; }
  .todohub-item:hover .todohub-actions, .todohub-item:focus-within .todohub-actions { opacity: 1; }
  .todohub-edit { grid-column: 1 / 3; display: flex; align-items: center; gap: 0.35rem; }
  .todohub-item.checkable .todohub-edit { grid-column: 2 / 4; }
  .todohub-edit input { flex: 1; min-width: 0; padding: 0.36rem 0.5rem; border: 1px solid var(--accent); border-radius: var(--radius-sm); background: var(--input-bg); color: var(--ink); font: inherit; font-size: 0.74rem; }
  .todohub-edit button { min-height: 1.75rem; padding: 0.25rem 0.52rem; font-size: 0.65rem; }
  .todohub-empty { padding: 1.2rem 0.6rem; color: var(--ink-4); font-size: 0.72rem; line-height: 1.45; text-align: center; }
  .todohub-completed-row { display: flex; align-items: center; gap: 0.28rem; margin-top: 0.32rem; }
  .todohub-completed { flex: 1; min-width: 0; padding: 0.34rem 0.42rem; border: 0; background: transparent; color: var(--ink-4); box-shadow: none; text-align: left; font-size: 0.65rem; font-weight: 650; }
  .todohub-completed:hover { border: 0; background: var(--button-hover); color: var(--ink-2); box-shadow: none; }
  .todohub-clear-completed { flex-shrink: 0; padding: 0.26rem 0.42rem; border: 0; background: transparent; color: var(--ink-4); box-shadow: none; font-size: 0.62rem; font-weight: 650; }
  .todohub-clear-completed:hover { border: 0; background: var(--button-hover); color: var(--danger); box-shadow: none; }
  @media (max-width: 760px), (hover: none) {
    .todohub-actions { opacity: 1; }
  }
  @keyframes todohubIn { from { opacity: 0; } to { opacity: 1; } }
  @keyframes newboxIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
  .newbox input, .newbox textarea, .newbox select { font-size: 0.8rem; padding: 0.4rem 0.55rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); width: 100%; box-sizing: border-box; background-color: var(--surface); color: var(--ink-2); }
  .newbox textarea { resize: none; min-height: 2.4rem; font: inherit; font-size: 0.8rem; }
  .newattach { display: flex; flex-direction: column; gap: 0.35rem; padding: 0.35rem; margin: -0.35rem; border: 1px dashed transparent; border-radius: var(--radius); transition: border-color 0.15s, background 0.15s, box-shadow 0.15s; }
  .newattach.drop { border-color: var(--theme-attachment-drop-drop-border); background: var(--drop-bg); box-shadow: 0 0 0 4px var(--theme-attachment-drop-drop-shadow); }
  /* the row is the input surface (border + fill) so the transparent textarea can float over the
     shortcut-completion ghost behind it — mirrors .composer-surface / transparent composer textarea */
  .newmsgrow { position: relative; display: flex; align-items: stretch; min-height: 3.85rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--surface); transition: border-color 0.15s, box-shadow 0.15s; }
  .newmsgrow:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
  .newmsgrow textarea { position: relative; z-index: 1; flex: 1; min-width: 0; height: 3.85rem; min-height: 3.85rem; padding: 0.4rem 0.55rem 1.78rem; line-height: 1.4; border: 0; background: transparent; }
  .newmsgrow textarea:focus { box-shadow: none; }
  .newmsg-shortcut-ghost { padding: 0.4rem 0.55rem 1.78rem; font-size: 0.8rem; line-height: 1.4; }
  .newmsgrow .attachtray, .newmsgrow .attachmsg { position: absolute; z-index: 1; left: 0.55rem; right: 6.35rem; bottom: 0.34rem; min-width: 0; max-width: none; }
  .newmsgrow .attachtray { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .newmsgrow .attachtray::-webkit-scrollbar { display: none; }
  .newmsgrow .attachmsg { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; pointer-events: none; }
  .newmsgactions { position: absolute; z-index: 2; right: 0.35rem; bottom: 0.24rem; display: flex; align-items: center; gap: 0.24rem; }
  .newmsgactions .attachpick { position: static; transform: none; flex-shrink: 0; }
  .newmsgactions .attachpick:active { transform: translateY(0.5px); }
  .newmsgactions .goal-toggle { min-height: 1.5rem; }
  .attachpick { position: absolute; right: 0.35rem; top: 50%; transform: translateY(-50%); width: 1.5rem; height: 1.5rem; padding: 0; display: inline-flex; align-items: center; justify-content: center; color: var(--ink-3); background: transparent; border-color: transparent; box-shadow: none; }
  .attachpick:hover { color: var(--ink); background: transparent; border-color: transparent; box-shadow: none; }
  .attachpick:active { transform: translateY(-50%); }
  .attachpick svg { width: 0.74rem; height: 0.74rem; stroke: currentColor; stroke-width: 1.65; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .newhead { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
  .newttl { font-size: 0.95rem; font-weight: 700; color: var(--ink); letter-spacing: -0.01em; }
  .newclose { width: 1.75rem; height: 1.75rem; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0; color: var(--ink-3); border: 0; background: transparent; box-shadow: none; }
  .newclose:hover { color: var(--theme-new-session-close-hover-foreground); background: transparent; }
  .newrow { display: flex; gap: 0.5rem; align-items: flex-end; }
  .newrow .pickgrp { flex: 1; min-width: 0; }
  .newrow .pickgrp.vendor { flex: 1.35; }
  .newrow .pickgrp.effort, .newrow .pickgrp.speed { max-width: 8.25rem; }
  .pickgrp { display: flex; flex-direction: column; gap: 0.25rem; }
  .picklbl { font-size: 0.68rem; font-weight: 700; color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.05em; }
  .chooser, .selectwrap { position: relative; }
  .chooser-row { display: flex; gap: 0; }
  .chooser-input, .selectbtn { min-height: 2.05rem; font-size: 0.8rem; padding: 0.4rem 1.65rem 0.4rem 0.55rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink-2); box-sizing: border-box; }
  .chooser-input { flex: 1; min-width: 0; }
  .selectbtn { position: relative; width: 100%; display: flex; align-items: center; min-width: 0; text-align: left; box-shadow: none; cursor: pointer; }
  .selectbtn::after { content: ""; position: absolute; right: 0.62rem; top: 50%; width: 0.42rem; height: 0.42rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-62%) rotate(45deg); color: var(--ink-4); pointer-events: none; }
  .selectbtn:hover { background: var(--surface); border-color: var(--line-2); }
  .selectbtn:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
  .selecttxt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .chooser-select.is-enhanced { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
  .chooser-drop { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 50; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-pop); padding: 0.25rem; max-height: 15rem; overflow-y: auto; }
  .chooser-drop.dir-portal { position: fixed; z-index: 90; right: auto; top: auto; }
  /* New Session's config controls can become very narrow with a resized sidebar.
     Config menus live at the viewport level so width and clipping are independent
     from the form, while using the same floating surface as the composer rail. */
  .configmenu { position: fixed; z-index: 90; right: auto; bottom: auto; box-sizing: border-box; min-height: 0; max-height: min(38vh, 18rem); overflow-y: auto; padding: 0.3rem; border: 1px solid color-mix(in srgb, var(--menu-border) 72%, transparent); border-radius: 10px; background: color-mix(in srgb, var(--menu-background) 96%, transparent); color: var(--menu-foreground); box-shadow: var(--shadow-pop); backdrop-filter: blur(12px) saturate(1.08); }
  .chooser-drop[hidden], .selectmenu[hidden] { display: none; }
  .chooser-opt { display: flex; flex-direction: column; gap: 0.12rem; padding: 0.38rem 0.5rem; cursor: pointer; color: var(--ink-2); }
  .chooser-opt { border-radius: 0; }
  .selectopt { width: 100%; min-height: 1.9rem; display: flex; align-items: center; gap: 0.4rem; box-sizing: border-box; padding: 0.32rem 0.48rem; border: 0; border-radius: 6px; background: transparent; color: var(--ink-2); box-shadow: none; cursor: pointer; font-size: 0.73rem; line-height: 1.3; }
  .selectopt + .selectopt { margin-top: 0.05rem; }
  .selectopt-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .selectopt-check { flex-shrink: 0; color: var(--accent); font-size: 0.7rem; font-weight: 800; line-height: 1; }
  .selectopt[aria-selected="true"] { color: var(--ink); background: var(--accent-soft); font-weight: 600; }
  .chooser-opt:hover, .chooser-opt.on { background: var(--accent-soft); }
  .selectopt:hover, .selectopt.on { background: color-mix(in srgb, var(--surface-2) 78%, transparent); color: var(--ink); }
  .selectopt[aria-selected="true"]:hover, .selectopt[aria-selected="true"].on { background: var(--accent-soft); }
  .chooser-opt:hover .chooser-opt-label, .chooser-opt.on .chooser-opt-label { color: inherit; }
  .chooser-opt:hover .chooser-opt-meta, .chooser-opt.on .chooser-opt-meta { color: inherit; opacity: 0.76; }
  .chooser-more { display: block; width: 100%; margin-top: 0.2rem; padding: 0.48rem 0.5rem; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; color: var(--accent); font-size: 0.72rem; font-weight: 650; text-align: center; }
  .chooser-more:hover:not(:disabled) { background: var(--accent-soft); box-shadow: none; }
  .chooser-opt.unavailable { cursor: not-allowed; opacity: 0.68; }
  .chooser-opt.unavailable:hover, .chooser-opt.unavailable.on { background: var(--warning-soft); }
  .chooser-opt.unavailable .chooser-opt-meta { white-space: normal; line-height: 1.35; }
  .chooser-opt.unavailable .chooser-opt-note { color: var(--warning); background: var(--warning-soft); }
  .chooser-opt-line { display: flex; align-items: center; gap: 0.38rem; min-width: 0; }
  .chooser-opt-label { font-size: 0.78rem; color: inherit; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .chooser-opt-meta { font-size: 0.68rem; color: inherit; opacity: 0.72; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .chooser-opt-note { flex-shrink: 0; font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--theme-chooser-note-foreground); background: var(--theme-chooser-note-background); border-radius: 3px; padding: 0.04rem 0.34rem; }
  .chooser-empty { padding: 0.45rem 0.5rem; font-size: 0.74rem; color: var(--ink-4); }
  .vendor-portal .chooser-opt { min-height: 1.9rem; justify-content: center; padding: 0.32rem 0.48rem; border-radius: 6px; }
  .vendor-portal .chooser-opt + .chooser-opt { margin-top: 0.05rem; }
  .vendor-portal .chooser-opt-line { width: 100%; }
  .vendor-portal .chooser-opt-label { flex: 1; font-size: 0.73rem; }
  .chooser-vendor-mark { width: 0.46rem; height: 0.46rem; flex-shrink: 0; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 18%, transparent); }
  .vendor-portal .chooser-opt:hover, .vendor-portal .chooser-opt.on { background: color-mix(in srgb, var(--surface-2) 78%, transparent); }
  .vendor-portal .chooser-opt.selected, .vendor-portal .chooser-opt.selected:hover, .vendor-portal .chooser-opt.selected.on { background: var(--accent-soft); }
  .vendor-portal .chooser-opt.unavailable:hover, .vendor-portal .chooser-opt.unavailable.on { background: var(--warning-soft); }
  .newactions { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 0.65rem; min-height: 2rem; }
  .newaction-end { display: flex; align-items: center; flex-shrink: 0; }
  .newtagpick { position: relative; flex: 1; min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 0.3rem; }
  .newtags { display: contents; }
  .newtagchip { display: inline-flex; align-items: center; gap: 0.15rem; max-width: 8rem; padding: 0.12rem 0.2rem 0.12rem 0.48rem; border: 1px solid var(--theme-tag-new-border); border-radius: var(--radius-pill); color: var(--theme-tag-new-foreground); background: var(--surface); font-size: 0.68rem; }
  .newtagchip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .newtagchip button { width: 1rem; height: 1rem; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: none; color: currentColor; line-height: 1; }
  .newtagadd { padding: 0.18rem 0.45rem; border-color: transparent; background: transparent; box-shadow: none; color: var(--new-session-tag-add-foreground); font-size: 0.7rem; }
  .newtagadd:hover { border-color: transparent; background: var(--button-hover); }
  .newtagmenu { position: absolute; z-index: 75; left: 0; bottom: calc(100% + 0.35rem); width: min(16rem, calc(100vw - 4rem)); padding: 0.35rem; border: 1px solid var(--menu-border); border-radius: var(--radius); background: var(--menu-background); box-shadow: var(--shadow-pop); }
  .newtagmenu[hidden] { display: none; }
  .newtagmenu input { margin-bottom: 0.3rem; }
  .newtagsug { max-height: 9rem; overflow-y: auto; }
  .newtagopt { width: 100%; display: flex; align-items: center; gap: 0.4rem; padding: 0.32rem 0.45rem; border: 0; background: transparent; box-shadow: none; text-align: left; font-size: 0.72rem; }
  .newtagopt:hover, .newtagopt.on { background: var(--accent-soft); }
  .sessiontag-popover { position: fixed; z-index: 110; width: min(17rem, calc(100vw - 1rem)); padding: 0.35rem; border: 1px solid var(--menu-border); border-radius: var(--radius); background: var(--menu-background); box-shadow: var(--shadow-pop); }
  .sessiontag-popover[hidden] { display: none; }
  .sessiontag-search { position: relative; }
  .sessiontag-input { display: block; width: 100%; min-width: 0; padding: 0.38rem 2rem 0.38rem 0.58rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--input-bg); color: var(--ink-2); font-size: 0.74rem; }
  .sessiontag-close { position: absolute; z-index: 1; top: 50%; right: 0.24rem; transform: translateY(-50%); }
  .sessiontag-close:active { transform: translateY(calc(-50% + 0.5px)); }
  .sessiontag-list { max-height: 13rem; margin-top: 0.3rem; overflow-y: auto; }
  .sessiontag-option { width: 100%; display: flex; align-items: center; gap: 0.4rem; padding: 0.34rem 0.45rem; border: 0; border-radius: var(--radius-sm); background: transparent; box-shadow: none; color: var(--ink-2); text-align: left; font-size: 0.74rem; }
  .sessiontag-option:hover { background: var(--accent-soft); color: var(--theme-tag-option-hover-foreground); }

  .sessiontag-option.on { background: var(--accent-soft); color: var(--theme-tag-option-active-foreground); }
  .sessiontag-option.selected { color: var(--theme-tag-option-selected-foreground); }
  .sessiontag-option.selected:hover { background: color-mix(in srgb, var(--theme-tag-option-hoverselected-background) 14%, transparent); color: var(--theme-tag-option-hoverselected-foreground); }

  .sessiontag-option.selected.on { background: color-mix(in srgb, var(--theme-tag-option-activeselected-background) 14%, transparent); color: var(--theme-tag-option-activeselected-foreground); }
  .sessiontag-check { width: 1rem; flex-shrink: 0; color: currentColor; font-weight: 800; text-align: center; }
  .newbox .nmsg { font-size: 0.72rem; color: var(--ink-4); }
  .newbox .nmsg:empty { display: none; }
  .newbox .nmsg.provider-error-host { color: inherit; }
  .newbox .nmsg .provider-error-card { max-width: none; padding: 0.7rem 0.75rem; border: 1px solid var(--theme-error-border); border-radius: var(--radius); background: var(--chat-error-background); color: var(--theme-error-foreground); }
  .modelwarn { padding: 0.42rem 0.55rem; border: 1px solid var(--warning); border-radius: var(--radius-sm); background: var(--warning-soft); color: var(--warning); font-size: 0.7rem; line-height: 1.4; }
  .modelwarn[hidden] { display: none; }
  .nbtn-primary { flex: 0 0 auto; width: auto; min-width: 7.75rem; color: var(--vendor-action-fg); background: var(--vendor-action-bg); border-color: var(--vendor-action-bg); box-shadow: var(--shadow-sm); }
  .nbtn-primary:hover:not(:disabled) { background: var(--vendor-action-hover); border-color: var(--vendor-action-hover); box-shadow: 0 4px 14px var(--vendor-action-ring); }
  .session-list-region { flex: 1 0 0; min-height: 0; overflow: hidden; }
  #list { height: 100%; box-sizing: border-box; overflow-y: auto; padding: 0.3rem 0; }
  #list.virtualized { overflow-anchor: none; contain: strict; }
  #list > .session-pin-divider { position: relative; height: 8px; pointer-events: none; background: transparent; }
  .sidebar-spacer { width: 1px; height: 0; pointer-events: none; }
  #list .empty { padding: 1.2rem 0.9rem; color: var(--ink-4); font-size: 0.8rem; text-align: center; }
  .session-panel { --session-panel-selection-rail-size: 3px; --session-panel-turn-rail-size: 3px; width: 660px; flex: 0 0 auto; overflow-y: auto; background: var(--session-panel-background); border-right: 1px solid var(--line); }
  .session-panel[hidden], .session-panel-resizer[hidden] { display: none; }
  .session-panel-list { min-height: 100%; display: grid; grid-template-columns: var(--session-panel-grid-columns, repeat(auto-fill, minmax(300px, 1fr))); align-content: start; align-items: start; gap: 0.55rem; padding: 0.55rem; }
  .session-panel-list.virtualized { display: block; min-height: 0; padding: 0; overflow-anchor: none; contain: layout style; }
  .session-panel-virtual-spacer { width: 100%; height: 0; pointer-events: none; }
  .session-panel-virtual-row { width: 100%; display: grid; grid-template-columns: repeat(var(--session-panel-columns, 1), minmax(0, 1fr)); align-items: start; gap: 0.55rem; padding: 0.55rem 0.55rem 0; box-sizing: border-box; }
  .session-panel-virtual-divider { position: relative; width: 100%; height: 8px; pointer-events: none; background: transparent; }
  .session-panel-list .empty { grid-column: 1 / -1; padding: 1.2rem 0.9rem; color: var(--ink-4); font-size: 0.8rem; text-align: center; }
  .session-panel-list > .session-pin-divider { grid-column: 1 / -1; width: 100%; height: 1px; margin: -0.25rem 0; background: transparent; pointer-events: none; }
  .session-panel .item { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); content-visibility: auto; contain-intrinsic-size: auto 9rem; }
  .session-panel .item.tag-editing { z-index: 45; content-visibility: visible; }
  .session-panel .item.tag-editing .tagsug { z-index: 80; }
  .session-panel .item.avoidance { border-left-color: var(--line); }
  .session-panel .item:hover { background: var(--item-hover); }
  /* Generation, unread, and avoidance own the left rail on every card.
     Seen only adds a blue rail when selected; archived stays quiet. */
  .session-panel .item::before {
    content: "";
    position: absolute;
    z-index: 2;
    top: -1px;
    bottom: -1px;
    left: -1px;
    width: var(--session-panel-selection-rail-size);
    border-radius: var(--radius) 0 0 var(--radius);
    background: transparent;
    pointer-events: none;
  }
  .session-panel .item.session-status-seen.active:not(.avoidance)::before { background: var(--status-seen); }
  .session-panel .item.avoidance::before { background: var(--theme-session-session-panel-item-avoidance-background); }
  .session-panel .item.session-status-unread::before {
    background: var(--status-unread);
    box-shadow: 2px 0 9px var(--status-unread-soft);
  }
  .session-panel .item.session-status-generating::before {
    background: linear-gradient(180deg, var(--status-generating-soft) 0%, var(--status-generating-soft) 15%, var(--status-generating) 22%, var(--theme-session-background-color1) 25%, var(--status-generating) 28%, var(--status-generating-soft) 35%, var(--status-generating-soft) 50%, var(--status-generating-soft) 65%, var(--status-generating) 72%, var(--theme-session-background-color2) 75%, var(--status-generating) 78%, var(--status-generating-soft) 85%, var(--status-generating-soft) 100%);
    background-color: var(--status-generating);
    background-size: 100% 200%;
    box-shadow: 2px 0 9px var(--status-generating-soft);
    animation: sessionAttentionRail 1.45s linear infinite;
    animation-delay: var(--session-attention-delay, 0ms);
  }
  @keyframes sessionAttentionRail { from { background-position: 0 100%; } to { background-position: 0 0%; } }
  @media (prefers-reduced-motion: reduce) { .session-panel .item.session-status-generating::before { animation: none; background-position: 0 0; } }
  .session-panel .item.active {
    border-color: var(--line);
    background: linear-gradient(90deg, var(--item-selected-card-start), var(--item-selected-card-end) 52%);
    box-shadow: none;
  }
  .session-panel-resizer { width: 6px; flex-shrink: 0; cursor: col-resize; touch-action: none; background: transparent; transition: background 0.15s; }
  @media (pointer: coarse) {
    .resizer, .session-panel-resizer { width: 14px; }
  }
  .session-panel-resizer:hover, .session-panel-resizer.dragging { background: var(--resizer-hover); }
  .item { position: relative; padding: 0.6rem 0.95rem; border-bottom: 1px solid var(--row-line); cursor: pointer; border-left: 3px solid transparent; transition: background 0.12s, border-color 0.12s, opacity 0.14s ease, outline-color 0.14s ease; }
  /* Relation preview follows the trigger's identity color without replacing status or selection styling. */
  .item.tag-preview-match::after { content: ''; position: absolute; z-index: 3; inset: 3px; border: 2px solid var(--tag-preview-color); border-radius: max(2px, calc(var(--radius) - 3px)); pointer-events: none; }
  .item.tag-preview-dim { opacity: 0.38; }
  .item.tag-preview-dim.active, .item.tag-preview-dim.tag-preview-live { opacity: 0.68; }
  .item.tag-preview-dim:hover, .item.tag-preview-dim:focus-within { opacity: 0.88; }
  @media (prefers-reduced-motion: reduce) { .item { transition: none; } }
  .item:hover { background: var(--item-hover); }
  .item.active {
    background: linear-gradient(90deg, var(--item-selected-row-start), var(--item-selected-row-end));
    box-shadow: inset 3px 0 0 var(--item-selected-marker), inset 0 0 0 1px var(--item-selected-row-ring);
  }
  #list .item.avoidance.active { border-left-color: var(--theme-session-border); }
  .item.session-pinned { cursor: grab; }
  .item.session-pinned:active { cursor: grabbing; }
  #list .item.session-pinned { background: linear-gradient(90deg, var(--pin-row-start), var(--pin-row-end)); border-bottom-color: color-mix(in srgb, var(--pin-card-edge) 42%, var(--row-line)); }
  #list .item.session-pinned:hover { background: linear-gradient(90deg, var(--pin-row-hover-start), var(--pin-row-hover-end)); }
  #list .item.session-pinned.active { background: linear-gradient(90deg, var(--item-selected-row-start), var(--item-selected-row-end)); box-shadow: inset 3px 0 0 var(--item-selected-marker), inset 0 0 0 1px var(--item-selected-row-ring), inset 0 -1px 0 var(--pin-card-edge); }
  .session-panel .item.session-pinned { background: linear-gradient(145deg, var(--pin-card-start), var(--pin-card-end)); box-shadow: inset 0 1px 0 var(--pin-card-edge), 0 7px 18px -17px var(--accent); }
  .session-panel .item.session-pinned:hover { background: linear-gradient(145deg, var(--pin-row-hover-start), var(--pin-card-end)); box-shadow: inset 0 1px 0 var(--pin-card-edge), 0 9px 20px -16px var(--accent); }
  .session-panel .item.session-pinned.active { border-color: var(--line); background: linear-gradient(90deg, var(--item-selected-card-start), var(--item-selected-card-end) 52%); box-shadow: inset 0 1px 0 var(--pin-card-edge); }
  .session-pinned .it-pin.on { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .item.session-card-dragging { opacity: 0.32; filter: saturate(0.72); transform: scale(0.988); }
  .session-panel .item.session-card-dragging { transform: none; }
  .item.session-pin-drag-peer { opacity: 0.3; filter: saturate(0.72); }
  .item.session-pin-drag-layout-source { position: absolute !important; visibility: hidden !important; pointer-events: none !important; }
  .session-pin-drop-placeholder { min-width: 0; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 1px dashed var(--accent); border-radius: var(--radius); background: var(--pin-drop-bg); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 8%, transparent); color: var(--accent); pointer-events: none; animation: sessionPinDropIn 0.14s cubic-bezier(0.2,0.8,0.2,1); }
  #list > .session-pin-drop-placeholder { width: calc(100% - 1rem); margin: 3px 0.5rem; border-radius: 7px; }
  .session-panel-list > .session-pin-drop-placeholder, .session-panel-virtual-row > .session-pin-drop-placeholder { width: 100%; }
  .session-pin-drop-label { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.25rem 0.48rem; border-radius: var(--radius-pill); background: color-mix(in srgb, var(--surface) 72%, transparent); font-size: 0.65rem; font-weight: 700; letter-spacing: 0.01em; opacity: 0.82; }
  .session-pin-drop-label svg { width: 0.68rem; height: 0.68rem; stroke: currentColor; stroke-width: 1.7; fill: currentColor; }
  @keyframes sessionPinDropIn { from { opacity: 0; transform: scale(0.985); } to { opacity: 1; transform: scale(1); } }
  .session-read-progress { position: absolute; z-index: 2; right: 0; bottom: 0; width: 3px; min-height: 2px; border-radius: 3px 0 0 3px; background: var(--status-unread); opacity: 0.82; pointer-events: none; }
  /* The right-side turn rail grows out of the bottom-right corner and reaches
     the top-right corner at 100%. */
  .session-panel .session-read-progress { right: -1px; bottom: -1px; width: var(--session-panel-turn-rail-size); max-height: calc(100% + 2px); border-radius: 0 var(--radius) var(--radius) 0; }
  .session-read-progress[hidden] { display: none; }
  .it-titlerow { display: flex; align-items: center; gap: 0.45rem; }
  .it-title { font-size: 0.84rem; font-weight: 600; color: var(--ink); letter-spacing: -0.005em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; min-width: 0; }
  .session-title { display: flex; align-items: baseline; gap: 0.4rem; min-width: 0; overflow: hidden; white-space: nowrap; }
  .session-title-main { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .session-title:not(.has-aux) .session-title-main { flex: 1 1 auto; }
  .session-title.has-aux .session-title-main { flex: 0 1 auto; max-width: 68%; }
  .session-title-aux { flex: 1 1 auto; min-width: 2rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.78em; font-weight: 600; color: var(--ink-4); letter-spacing: 0; }
  .it-title.session-title.has-aux .session-title-main { max-width: 62%; }
  .it-age { flex-shrink: 0; font-size: 0.62rem; color: var(--theme-session-age-foreground); font-family: ui-monospace, monospace; letter-spacing: -0.025em; white-space: nowrap; }
  .it-pin { flex-shrink: 0; width: 1.35rem; height: 1.35rem; display: inline-flex; align-items: center; justify-content: center; margin: -0.2rem -0.28rem -0.2rem -0.28rem; padding: 0; border: 0; border-radius: 4px; background: transparent; box-shadow: none; color: var(--ink-4); opacity: 0.62; transform: none; }
  .it-pin:hover { color: var(--accent); background: var(--accent-soft); box-shadow: none; opacity: 1; transform: none; }
  .it-pin svg { width: 0.72rem; height: 0.72rem; stroke: currentColor; stroke-width: 1.7; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .it-pin.on { color: var(--accent); opacity: 1; }
  .it-pin.on svg { fill: currentColor; }
  .prompt-line.with-tail { display: flex; align-items: baseline; min-width: 0; }
  .prompt-line.with-tail .prompt-line-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .it-queue { flex-shrink: 0; display: inline-flex; align-items: baseline; gap: 0.18rem; margin-left: auto; padding: 0.04rem 0.3rem; border-radius: var(--radius-pill); background: var(--theme-session-queue-background); color: var(--theme-session-queue-foreground); font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.58rem; line-height: 1.15; font-variant-numeric: tabular-nums; }
  .it-queue[hidden] { display: none; }
  .it-queue-label { font-weight: 680; opacity: 0.76; }
  .it-queue-count { font-weight: 820; }
  .it-queue.parked { background: var(--theme-session-queue-parked-background); color: var(--theme-session-queue-parked-foreground); }
  .it-workbadges { flex-shrink: 0; display: inline-flex; align-items: baseline; gap: 0.28rem; margin-left: auto; }
  .it-workbadges .it-queue { margin-left: 0; }
  .it-todo { flex-shrink: 0; display: inline-flex; align-items: baseline; gap: 0.18rem; padding: 0.04rem 0.3rem; border: 0; border-radius: var(--radius-pill); background: var(--todo-bg); color: var(--todo-fg); font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.58rem; line-height: 1.15; font-variant-numeric: tabular-nums; }
  .it-todo[hidden] { display: none; }
  .it-todo-count { font-weight: 820; }
  .it-todo-label { font-weight: 680; opacity: 0.76; }
  .it-comment { flex-shrink: 0; display: inline-flex; align-items: center; gap: 0.16rem; min-height: 1.12rem; padding: 0.08rem 0.28rem; border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--status-seen); font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.6rem; font-weight: 720; line-height: 1; letter-spacing: 0.01em; font-variant-numeric: tabular-nums; white-space: nowrap; box-shadow: none; cursor: pointer; transition: color 0.12s, background 0.12s; }
  .it-comment[hidden] { display: none; }
  .comment-action-icon { width: 0.72rem; height: 0.72rem; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  .comment-action-spinner { width: 0.58rem; height: 0.58rem; flex-shrink: 0; box-sizing: border-box; border: 1.4px solid var(--status-generating-soft); border-top-color: currentColor; border-right-color: currentColor; border-radius: 50%; animation: statusSpin 0.82s linear infinite; }
  /* A read comment still exists and remains actionable: use the breathing light's
     blue tracked/seen state, not the gray archived/read state. */
  .it-comment.read { color: var(--status-seen); }
  .it-comment.unread { color: var(--status-unread); }
  .it-comment.generating { color: var(--status-generating); }
  .it-comment:hover, .it-comment:focus-visible { color: var(--status-seen); background: var(--status-seen-soft); outline: none; }
  .it-comment.unread:hover, .it-comment.unread:focus-visible { color: var(--status-unread); background: var(--status-unread-soft); }
  .it-comment.generating:hover, .it-comment.generating:focus-visible { color: var(--status-generating); background: var(--status-generating-soft); }
  .it-comment-count { font-weight: 820; }
  .forktree-trigger { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; background: transparent; color: var(--ink-4); box-shadow: none; }
  .forktree-trigger:hover { color: var(--accent); background: transparent; }
  .forktree-trigger[hidden] { display: none; }
  .it-forktree { width: 2rem; height: 1.3rem; border-radius: 4px; }
  .forktree-mini { width: 1.65rem; height: 0.9rem; overflow: visible; }
  .forktree-mini path { fill: none; stroke: currentColor; stroke-width: 1.15; stroke-linecap: round; stroke-linejoin: round; opacity: 0.58; }
  .forktree-mini circle { fill: currentColor; opacity: 0.72; }
  .forktree-mini circle.current { fill: var(--ink); opacity: 1; stroke: var(--surface); stroke-width: 1.2; }
  /* Muted text colors identify relations without competing with live status. */
  .item { --session-relation-lightness: 40%; }
  html[data-theme="dark"] .item { --session-relation-lightness: 64%; }
  .item .it-title[data-session-relation-key] .session-title-main { color: hsl(var(--session-group-hue) 42% var(--session-relation-lightness)); }
  .item .it-forktree[data-session-relation-key], .item .it-forktree[data-session-relation-key] .current { color: hsl(var(--session-fork-hue) 42% var(--session-relation-lightness)); fill: currentColor; }
  .it-status { flex-shrink: 0; width: 0.58rem; height: 0.58rem; border-radius: 50%; border: 1.5px solid transparent; background: var(--status-read); cursor: pointer; transition: transform 0.1s, background 0.15s, border-color 0.15s, box-shadow 0.15s; }
  .it-status:hover { transform: scale(1.45); }
  .it-status.generating { background: transparent; border-color: var(--status-generating-soft); border-top-color: var(--status-generating); border-right-color: var(--status-generating); box-shadow: 0 0 0 2px var(--status-generating-soft); animation: statusSpin 0.82s linear infinite; }
  .it-status.unread { background: var(--status-unread); border-color: var(--status-unread); box-shadow: 0 0 0 3px var(--status-unread-soft), 0 0 12px var(--status-unread-soft); }
  /* seen = you opened it but haven't replied: calm sky hollow ring = still open. */
  .it-status.seen { background: transparent; border-color: var(--status-seen); box-shadow: none; }
  .it-status.read { background: var(--status-read); border-color: transparent; box-shadow: none; opacity: 0.72; }
  .it-live { flex-shrink: 0; min-width: 0; display: inline-flex; align-items: center; gap: 0.32rem; overflow: hidden; white-space: nowrap; font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.62rem; font-variant-numeric: tabular-nums; }
  .it-live[hidden] { display: none; }
  .it-live-total { color: var(--status-generating); font-weight: 750; }
  .it-live.generated .it-live-total { color: var(--status-unread); }
  .it-live.stopped .it-live-total { color: var(--theme-status-stopped-foreground); }
  .it-live.failed .it-live-total { color: var(--theme-status-failed-foreground); }
  .it-live-label { margin-right: 0.22rem; }
  .analysis-pending { color: var(--ink-4); font-size: 0.66rem; font-style: italic; }
  .it-live-sep { color: var(--ink-4); opacity: 0.72; }
  .it-live-quiet { color: var(--ink-3); font-weight: 650; transition: color 0.15s; }
  .it-live-quiet.warm { color: var(--theme-status-quiet-warm-foreground); }
  .it-live-quiet.hot { color: var(--theme-status-quiet-hot-foreground); font-weight: 750; }
  .it-firstline { font-size: 0.72rem; color: var(--ink-3); margin-top: 0.1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .prompt-line-label { color: var(--ink-4); font-weight: 700; }
  .prompt-line-latest ~ .prompt-line-text, .prompt-line-draft ~ .prompt-line-text { font-style: italic; }
  .draft-edit { display: inline-flex; align-items: center; justify-content: center; vertical-align: -0.12rem; width: 1rem; height: 1rem; margin: 0 0.18rem 0 0; padding: 0; border: 0; border-radius: 3px; background: transparent; color: var(--theme-draft-edit-foreground); box-shadow: none; }
  .draft-edit svg { width: 0.72rem; height: 0.72rem; stroke: currentColor; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .draft-edit:hover { color: var(--theme-draft-edit-hover-foreground); background: var(--danger-soft); box-shadow: none; }
  .it-searchhit { font-size: 0.72rem; color: var(--theme-search-match-foreground); margin-top: 0.12rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .it-meta { font-size: 0.7rem; color: var(--theme-session-metadata-foreground); margin-top: 0.2rem; font-family: ui-monospace, monospace; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; align-items: center; gap: 0.35rem; }
  .it-footrow { margin-top: 0.4rem; display: flex; align-items: center; gap: 0.45rem; min-width: 0; }
  .it-tags { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem; }
  .session-panel .item .it-tags { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .session-panel .item .it-tags::-webkit-scrollbar { display: none; }
  .session-panel .item .it-tags > .it-tag, .session-panel .item .it-tags > .it-tagadd { flex: 0 0 auto; white-space: nowrap; }
  .it-tag { display: inline-flex; align-items: center; gap: 0.24rem; font-size: 0.66rem; color: var(--theme-tag-foreground); background: var(--theme-tag-background); border: 1px solid var(--theme-tag-border); border-radius: var(--radius-pill); padding: 0.1rem 0.46rem; }
  .it-tag.auto { font-weight: 600; }
  .it-tag:not(.auto) { border-style: solid; border-color: var(--line-2); background: transparent; color: var(--theme-tag-it-tag-auto-foreground); }
  .it-tag.hot:not(.auto) { background: linear-gradient(90deg, var(--tag-heat-soft), var(--tag-heat-fade) 58%, transparent); }
  .it-tag > button { border: 0; background: transparent; color: var(--theme-tag-it-tag-foreground); font-size: 0.78rem; padding: 0; line-height: 1; box-shadow: none; }
  .it-tag > button:hover { color: var(--theme-tag-hover-foreground); background: transparent; }
  .it-tagadd { font-size: 0.66rem; border: 1px solid transparent; color: var(--theme-tag-add-foreground); padding: 0.1rem 0.46rem; border-radius: var(--radius-pill); box-shadow: none; background: transparent; }
  .it-tagadd:hover { background: var(--theme-tag-add-hover-background); border-color: transparent; }
  .it-context { margin-left: auto; min-width: 0; max-width: 58%; display: inline-flex; align-items: center; justify-content: flex-end; gap: 0.34rem; overflow: hidden; white-space: nowrap; font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.68rem; font-weight: 700; }
  .it-context .ctx-sep { color: var(--ink-4); flex-shrink: 0; opacity: 0.72; }
  .it-context .ctx-prompts { color: var(--ink-4); flex-shrink: 0; }
  .it-context .ctx-tokens { color: var(--ink-4); flex-shrink: 0; }
  .it-context .vtag, .it-context .ptag { padding: 0; border: 0; background: transparent; border-radius: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .it-context .vtag.claude { color: var(--vendor-claude-fg); background: transparent; border-color: transparent; }
  .it-context .vtag.codex { color: var(--vendor-codex-fg); background: transparent; border-color: transparent; }
  .it-context .vtag.cursor { color: var(--vendor-cursor-fg); background: transparent; border-color: transparent; }
  .it-context .vtag.antigravity { color: var(--vendor-antigravity-fg); background: transparent; border-color: transparent; }
  .it-context .vtag.copilot { color: var(--vendor-copilot-fg); background: transparent; border-color: transparent; }
  .it-context .vtag.opencode { color: var(--vendor-opencode-fg); background: transparent; border-color: transparent; }
  .it-context .ptag { color: var(--project-fg, var(--theme-project-foreground)); font-weight: 700; }
  /* per-tab tag editor + custom suggestion dropdown (replaces the native datalist) */
  .tagedit { position: relative; margin-top: 0.4rem; }
  .tagedit-row { position: relative; }
  .tagedit-input { display: block; width: 100%; min-width: 0; font-size: 0.74rem; padding: 0.34rem 2rem 0.34rem 0.58rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--input-bg); color: var(--ink-2); }
  .edit-cancel { flex-shrink: 0; width: 1.35rem; height: 1.35rem; padding: 0; display: inline-flex; align-items: center; justify-content: center; color: var(--ink-4); background: transparent; border: 1px solid transparent; border-radius: 999px; box-shadow: none; opacity: 0.72; }
  .edit-cancel:hover { color: var(--ink-2); background: var(--button-hover); border-color: transparent; box-shadow: none; opacity: 1; }
  .edit-cancel svg { width: 0.72rem; height: 0.72rem; stroke: currentColor; stroke-width: 2; fill: none; stroke-linecap: round; }
  .tagedit-row > .edit-cancel { position: absolute; z-index: 1; top: 50%; right: 0.24rem; transform: translateY(-50%); }
  .tagedit-row > .edit-cancel:active { transform: translateY(calc(-50% + 0.5px)); }
  .tagsug { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 40; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-pop); padding: 0.25rem; max-height: 13rem; overflow-y: auto; }
  .tagsug[hidden] { display: none; }
  .tagsug-opt { display: flex; align-items: center; gap: 0.4rem; font-size: 0.76rem; color: var(--ink-2); padding: 0.3rem 0.5rem; border-radius: var(--radius-sm); cursor: pointer; }
  .tagsug-opt:hover { background: var(--accent-soft); color: var(--theme-tag-option-hover-foreground); }

  .tagsug-opt.on { background: var(--accent-soft); color: var(--theme-tag-option-active-foreground); }
  .tag-option-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tag-option-pin { width: 0.72rem; height: 0.72rem; flex-shrink: 0; fill: none; stroke: var(--ink-3); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .tagsug-create { color: var(--ink-3); }
  .tagsug-new { font-size: 0.6rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--theme-tag-new-foreground); background: var(--theme-tag-new-background); border-radius: 3px; padding: 0.04rem 0.34rem; }
  .state { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; min-height: 1.28rem; font-size: 0.68rem; line-height: 1; font-weight: 800; letter-spacing: 0; padding: 0.18rem 0.55rem 0.16rem; border-radius: 7px; background: var(--theme-state-default-background); color: var(--theme-state-default-foreground); border: 1px solid var(--theme-state-default-border); font-family: ui-monospace, "Cascadia Mono", monospace; text-decoration: underline; text-underline-offset: 2px; box-shadow: inset 0 0 0 1px var(--theme-state-default-shadow); transition: none; }
  .state.editable { cursor: pointer; }
  .state.editable:hover { filter: brightness(0.96); transform: none; }
  .state.continue_ready { background: var(--theme-state-continue-ready-background); color: var(--theme-state-continue-ready-foreground); border-color: var(--theme-state-continue-ready-border); box-shadow: inset 0 0 0 1px var(--theme-state-continue-ready-shadow); }
  .state.needs_decision { background: var(--theme-state-needs-decision-background); color: var(--theme-state-needs-decision-foreground); border-color: var(--theme-state-needs-decision-border); box-shadow: inset 0 0 0 1px var(--theme-state-needs-decision-shadow); }
  .state.needs_input { background: var(--theme-state-needs-input-background); color: var(--theme-state-needs-input-foreground); border-color: var(--theme-state-needs-input-border); box-shadow: inset 0 0 0 1px var(--theme-state-needs-input-shadow); }
  .state.blocked { background: var(--theme-state-blocked-background); color: var(--theme-state-blocked-foreground); border-color: var(--theme-state-blocked-border); box-shadow: inset 0 0 0 1px var(--theme-state-blocked-shadow); }
  .state.needs_review { background: var(--theme-state-needs-review-background); color: var(--theme-state-needs-review-foreground); border-color: var(--theme-state-needs-review-border); box-shadow: inset 0 0 0 1px var(--theme-state-needs-review-shadow); }
  .state.followup_suggested { background: var(--theme-state-followup-suggested-background); color: var(--theme-state-followup-suggested-foreground); border-color: var(--theme-state-followup-suggested-border); box-shadow: inset 0 0 0 1px var(--theme-state-followup-suggested-shadow); }
  .state.done { background: var(--theme-state-done-done-background); color: var(--theme-state-done-done-foreground); border-color: var(--theme-state-done-done-border); box-shadow: inset 0 0 0 1px var(--theme-state-done-done-shadow); }
  /* Reason is the current-state explanation, not disposable metadata. Keep it
     quieter than the title, but readable; italic and underline already carry
     latest/draft and editable/manual semantics elsewhere in the row. */
  .it-reason { flex: 1 1 5rem; min-width: 3rem; font-size: 0.68rem; color: var(--ink-3); font-weight: 550; font-style: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .it-title.pending { color: var(--theme-session-title-pending-foreground); font-weight: 500; }
  .prilabel { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; min-height: 1.08rem; min-width: 1.7rem; padding: 0.08rem 0.28rem; border-radius: 4px; background: transparent; color: var(--ink-3); cursor: pointer; font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.68rem; line-height: 1; font-weight: 800; letter-spacing: 0; font-variant-numeric: tabular-nums; transition: none; }
  .prilabel.l1 { color: var(--priority-1-fg); background: var(--priority-1-bg); }
  .prilabel.l2 { color: var(--priority-2-fg); background: var(--priority-2-bg); }
  .prilabel.l3 { color: var(--priority-3-fg); background: var(--priority-3-bg); }
  .prilabel.l4 { color: var(--priority-4-fg); background: var(--priority-4-bg); }
  .prilabel.l5 { color: var(--priority-5-fg); background: var(--priority-5-bg); }
  .prilabel:hover { filter: brightness(0.96); transform: none; }
  .b-eta { flex-shrink: 0; color: var(--theme-eta-foreground); background: var(--theme-eta-background); padding: 0.04rem 0.36rem; border-radius: 4px; cursor: pointer; font-variant-numeric: tabular-nums; transition: none; }
  .b-eta:hover { background: var(--theme-eta-hover-background); }
  .vtag, .ptag { flex-shrink: 0; display: inline-flex; align-items: center; border-radius: 999px; padding: 0.06rem 0.46rem; font-size: 0.66rem; font-family: ui-sans-serif, -apple-system, "Segoe UI", sans-serif; border: 1px solid transparent; }
  .vtag { font-weight: 700; letter-spacing: 0.01em; }
  .vtag.claude { color: var(--vendor-claude-fg); background: var(--vendor-claude-bg); border-color: var(--vendor-claude-border); }
  .vtag.codex { color: var(--vendor-codex-fg); background: var(--vendor-codex-bg); border-color: var(--vendor-codex-border); }
  .vtag.cursor { color: var(--vendor-cursor-fg); background: var(--vendor-cursor-bg); border-color: var(--vendor-cursor-border); }
  .vtag.antigravity { color: var(--vendor-antigravity-fg); background: var(--vendor-antigravity-bg); border-color: var(--vendor-antigravity-border); }
  .vtag.copilot { color: var(--vendor-copilot-fg); background: var(--vendor-copilot-bg); border-color: var(--vendor-copilot-border); }
  .vtag.opencode { color: var(--vendor-opencode-fg); background: var(--vendor-opencode-bg); border-color: var(--vendor-opencode-border); }
  .ptag { font-weight: 600; }
  #h-sig .score, #h-sig .eta { cursor: pointer; }
  /* a manually-pinned priority/ETA: dashed underline marks it as user-set */
  .prilabel.edited, .b-eta.edited, #h-sig .score.edited, #h-sig .eta.edited, .state.edited { text-decoration: underline dashed; text-underline-offset: 2px; }
  .badge-edit { width: 3rem; font-size: 0.7rem; padding: 0 0.25rem; border: 1px solid var(--theme-badge-edit-border); border-radius: 3px; background: var(--input-bg); color: var(--ink); }
  .sigmenu { position: fixed; z-index: 80; width: min(9.75rem, calc(100vw - 20px)); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-pop); padding: 0.25rem; }
  .sigmenu.info { width: min(24rem, calc(100vw - 20px)); }
  .sigmenu.state-menu { width: min(17.5rem, calc(100vw - 20px)); padding: 0.375rem; box-sizing: border-box; max-height: calc(100dvh - 20px); overflow-y: auto; }
  .state-menu .sigmenu-opt { padding: 0.375rem 0.5rem; }
  .state-menu .sigmenu-opt.on::after { content: '✓'; margin-left: auto; font-size: 0.75rem; color: var(--accent); }
  .sigmenu-custom { margin: 0.375rem 0.125rem 0; padding: 0.75rem 0.375rem 0.375rem; border-top: 1px solid var(--line); }
  .state-editor-label { display: block; margin-bottom: 0.5rem; color: var(--ink-3); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.025em; }
  .state-editor-input { display: block; box-sizing: border-box; width: 100%; min-width: 0; height: 2.125rem; padding: 0.375rem 0.625rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--input-bg); color: var(--ink); font: inherit; font-size: 0.78rem; outline: none; transition: border-color 120ms, box-shadow 120ms; }
  .state-editor-input:focus { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-ring); }
  .state-editor-footer { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-top: 0.625rem; }
  .state-editor-colors { display: flex; align-items: center; gap: 0.3rem; }
  .state-color-swatch { appearance: none; position: relative; display: block; flex: 0 0 1.125rem; width: 1.125rem; height: 1.125rem; padding: 0; border: 2px solid var(--surface); border-radius: 50%; background: var(--swatch); box-shadow: 0 0 0 1px transparent; cursor: pointer; }
  .state-color-swatch:hover { box-shadow: 0 0 0 1px var(--ink-3); }
  .state-color-swatch[aria-pressed="true"] { box-shadow: 0 0 0 1px var(--ink-2); }
  .state-color-swatch:focus-visible, .state-color-picker:focus-within { outline: 2px solid var(--accent); outline-offset: 3px; }
  .state-color-picker { position: relative; display: block; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: conic-gradient(#f87171, #facc15, #4ade80, #60a5fa, #c084fc, #f87171); box-shadow: inset 0 0 0 3px var(--surface); cursor: pointer; }
  .state-color-picker input { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; opacity: 0; cursor: pointer; }
  .state-editor-save { appearance: none; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--button-hover); color: var(--ink); padding: 0.375rem 0.75rem; font: inherit; font-size: 0.72rem; font-weight: 600; cursor: pointer; }
  .state-editor-save:hover { border-color: var(--accent); color: var(--accent); }
  .state-editor-save:disabled { opacity: 0.4; cursor: default; }

  .sigmenu-opt { display: flex; align-items: center; gap: 0.45rem; min-width: 0; font-size: 0.76rem; color: var(--menu-option-foreground); padding: 0.35rem 0.5rem; border-radius: var(--radius-sm); cursor: pointer; }
  .sigmenu-opt:hover { background: var(--accent-soft); color: var(--theme-menu-option-hover-foreground); }

  .sigmenu-opt.on { background: var(--accent-soft); color: var(--theme-menu-option-active-foreground); }
  .sigmenu-opt .prilabel { cursor: pointer; }
  .sigmenu-title { font-size: 0.7rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: var(--theme-menu-title-foreground); padding: 0.35rem 0.45rem 0.15rem; }
  .sigmenu-line { font-size: 0.74rem; line-height: 1.45; color: var(--ink-2); padding: 0.28rem 0.45rem 0.4rem; max-width: 24rem; white-space: normal; }
  .avoid-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.35rem; padding: 0.38rem 0.45rem 0.3rem; }
  .avoid-stat { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 0.32rem 0.36rem; background: var(--surface-2); }
  .avoid-stat-k { font-size: 0.58rem; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-4); }
  .avoid-stat-v { margin-top: 0.1rem; font-size: 0.82rem; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #avoidPanel:not([hidden]) { flex: 0 0 auto; }
  .avoidpanel { margin: 0 1.1rem; border: 1px solid var(--line); border-left: 3px solid var(--theme-avoidance-border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); padding: 0.38rem 0.5rem; display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; align-items: center; gap: 0.55rem; }
  .avoidpanel-title { font-size: 0.62rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--theme-avoidance-title-foreground); white-space: nowrap; }
  .avoidpanel .avoid-stats { display: flex; gap: 0.45rem; padding: 0; }
  .avoidpanel .avoid-stat { display: inline-flex; align-items: baseline; gap: 0.18rem; border: 0; background: transparent; padding: 0; }
  .avoidpanel .avoid-stat-k { font-size: 0.58rem; color: var(--ink-4); }
  .avoidpanel .avoid-stat-v { margin: 0; font-size: 0.72rem; font-weight: 800; color: var(--ink-2); }
  .avoidpanel-draft { min-width: 0; padding: 0.26rem 0.42rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-2); color: var(--ink-2); font-size: 0.72rem; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .avoidpanel-actions { display: flex; justify-content: flex-end; align-items: center; gap: 0.35rem; }
  .avoidpanel-draftbtn { font-size: 0.7rem; color: var(--theme-avoidance-button-foreground); background: var(--theme-avoidance-button-background); border-color: var(--theme-avoidance-button-border); box-shadow: none; padding: 0.18rem 0.5rem; }
  .avoidpanel-draftbtn:hover { color: var(--theme-avoidance-button-hover-foreground); background: var(--theme-avoidance-button-hover-background); border-color: var(--theme-avoidance-button-hover-border); }
  .avoidpanel-clear { font-size: 0.7rem; color: var(--ink-3); background: transparent; border-color: transparent; box-shadow: none; padding: 0.18rem 0.45rem; }
  .avoidpanel-clear:hover { color: var(--theme-avoidance-clear-hover-foreground); background: var(--theme-avoidance-clear-hover-background); border-color: transparent; }
  .b-ctx { overflow: hidden; text-overflow: ellipsis; }
  .sortsel { font-size: 0.72rem; border: 1px solid var(--line-2); border-radius: 4px; padding: 0.1rem 0.3rem; background: var(--input-bg); color: var(--ink-2); }
  /* main */
  .main { --composer-overlay-height: 6.5rem; --queue-overlay-height: 0px; --avoid-overlay-height: 0px; --chat-scrollbar-width: 0px; position: relative; flex: 1; display: flex; flex-direction: column; min-width: 0; background: var(--chat-background); }
  .main.session-drop-target { box-shadow: inset 0 0 0 2px var(--accent); }
  .main.session-drop-target::after { content: '↳  Drop to add as chat tab'; position: absolute; z-index: 45; top: 0.72rem; left: 50%; transform: translateX(-50%); pointer-events: none; color: var(--accent); font-size: 0.68rem; font-weight: 650; letter-spacing: 0.015em; white-space: nowrap; }
  .chat-tabs { flex: 0 0 auto; min-width: 0; display: flex; align-items: flex-end; gap: 0.2rem; padding: 0.35rem 0.55rem 0; overflow-x: auto; overflow-y: hidden; border-bottom: 1px solid var(--row-line); background: var(--surface-2); scrollbar-width: thin; }
  .chat-tabs[hidden] { display: none; }
  .chat-tab { flex: 0 0 auto; min-width: 7rem; max-width: 14rem; height: 2rem; display: flex; align-items: center; gap: 0.15rem; border: 1px solid transparent; border-bottom: 0; border-radius: 7px 7px 0 0; color: var(--ink-3); background: transparent; }
  .chat-tab:hover { color: var(--ink); background: var(--button-hover); }
  .chat-tab.on { color: var(--ink); border-color: var(--row-line); background: var(--surface); }
  .chat-tab-main { flex: 1; min-width: 0; height: 100%; display: flex; align-items: center; gap: 0.4rem; padding: 0 0.28rem 0 0.55rem; border: 0; border-radius: inherit; color: inherit; background: transparent; box-shadow: none; }
  .chat-tab-main:hover { color: inherit; background: transparent; box-shadow: none; }
  .chat-tab-status { width: 0.48rem; height: 0.48rem; flex-shrink: 0; box-sizing: border-box; border: 1.3px solid transparent; border-radius: 50%; background: var(--status-read); }
  .chat-tab-status.generating { background: transparent; border-color: var(--status-generating-soft); border-top-color: var(--status-generating); border-right-color: var(--status-generating); animation: statusSpin 0.82s linear infinite; }
  .chat-tab-status.unread { background: var(--status-unread); }
  .chat-tab-status.seen { background: transparent; border-color: var(--status-seen); }
  .chat-tab-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.72rem; font-weight: 650; }
  .chat-tab-close { width: 1.35rem; height: 1.35rem; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; margin-right: 0.18rem; padding: 0; border: 0; border-radius: 4px; color: var(--ink-4); background: transparent; box-shadow: none; font-size: 0.92rem; line-height: 1; }
  .chat-tab-close:hover { color: var(--theme-tab-close-hover-foreground); background: var(--danger-soft); box-shadow: none; }
  .head { padding: 0.6rem 0.95rem; border-bottom: 1px solid var(--row-line); display: flex; justify-content: flex-start; gap: 0.6rem; align-items: center; background: var(--surface); }
  .backbtn { display: none; flex-shrink: 0; color: var(--ink-3); }
  .headmain { min-width: 0; flex: 1; display: flex; flex-direction: column; }
  .headrow { min-width: 0; }
  .head-titlegroup { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 0.22rem; }
  .head-titlegroup .it-title { flex: 0 1 auto; max-width: 100%; }
  .head-titlegroup .title-editing { flex: 1 1 auto; max-width: min(34rem, 100%); }
  .head-actions { flex-shrink: 0; display: flex; align-items: center; gap: 0.18rem; }
  .headbtn { width: 1.7rem; height: 1.7rem; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; color: var(--ink-3); border: 0; background: transparent; padding: 0; line-height: 1; border-radius: 4px; box-shadow: none; }
  .headbtn:hover:not(:disabled) { color: var(--accent); background: transparent; }
  .headbtn:disabled { color: var(--ink-4); background: transparent; }
  .headbtn svg { width: 1.08rem; height: 1.08rem; stroke: currentColor; stroke-width: 1.45; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .title-edit-btn { width: 1.3rem; height: 1.3rem; }
  .title-edit-btn svg { width: 0.68rem; height: 0.68rem; stroke-width: 1.55; }
  .headbtn.forktree-trigger { color: var(--ink-4); }
  .headbtn.forktree-trigger:hover { color: var(--accent); background: transparent; }
  .headbtn .forktree-mini { width: 1.5rem; height: 1rem; stroke: none; }
  .headbtn.busy svg { animation: spin 0.85s linear infinite; }
  .headbtn.head-pin.on { color: var(--accent); }
  .headbtn.head-pin svg { width: 0.7rem; height: 0.7rem; stroke-width: 1.75; }
  .headbtn.head-pin.on svg { fill: currentColor; }
  @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
  @keyframes statusSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
  .title-editing { overflow: visible; }
  .title-edit-input { width: 100%; box-sizing: border-box; font: inherit; font-size: 0.84rem; font-weight: 600; color: var(--ink); padding: 0.18rem 0.4rem; border: 1px solid var(--accent); border-radius: var(--radius-sm); background: var(--input-bg); box-shadow: 0 0 0 3px var(--accent-ring); }
  .head .s { font-size: 0.72rem; color: var(--theme-chat-header-foreground); }
  .head .s .sub-line { margin-top: 0.1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .head .s .sub-line + .sub-line { margin-top: 0.1rem; }
  .head .prompt-line-jump { cursor: pointer; border-radius: 3px; outline: none; }
  .head .prompt-line-jump:hover { color: var(--ink-2); }
  .head .prompt-line-jump:hover .prompt-line-text { text-decoration: underline; text-decoration-color: color-mix(in srgb, currentColor 38%, transparent); text-underline-offset: 2px; }
  .head .prompt-line-jump:focus-visible { box-shadow: 0 0 0 2px var(--focus); }
  .head .s.brief { font-family: inherit; color: var(--ink-3); font-size: 0.78rem; max-width: 70ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #h-tags { display: flex; flex-direction: column; gap: 0.35rem; }
  .headtag-row { display: flex; align-items: center; gap: 0.45rem; min-width: 0; }
  .headtag-row .it-tags { flex-wrap: wrap; }
  .headtag-row .it-tag { position: relative; margin: 0; }
  .headtag-row .it-tag.auto { font-weight: 600; }
  .headtag-row .it-tag > button { border: 0; background: transparent; color: inherit; font-size: 0.78rem; padding: 0; line-height: 1; box-shadow: none; }
  .headtag-row .it-tag > button:hover { color: var(--header-tag-remove-hover-foreground); background: transparent; }
  .headtag-nav { cursor: pointer; border-radius: var(--radius-pill); outline: none; }
  .it-tag:has(.headtag-nav):hover { background: var(--button-hover); }
  .it-tag.hot:has(.headtag-nav):hover { background: linear-gradient(90deg, var(--tag-heat-soft), var(--tag-heat-fade) 58%, transparent), var(--button-hover); }
  .headtag-nav:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
  .headtag-session-menu { position: fixed; z-index: 82; width: min(20rem, calc(100vw - 2rem)); max-height: min(22rem, 52vh); overflow-y: auto; padding: 0.3rem; border: 1px solid color-mix(in srgb, var(--menu-border) 72%, transparent); border-radius: 10px; background: color-mix(in srgb, var(--menu-background) 96%, transparent); color: var(--menu-foreground); box-shadow: var(--shadow-pop); backdrop-filter: blur(12px) saturate(1.08); }
  .headtag-session-option { width: 100%; min-width: 0; min-height: 2.8rem; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 0.5rem; padding: 0.42rem 0.5rem; border: 0; border-radius: 6px; color: var(--ink-2); background: transparent; box-shadow: none; text-align: left; }
  .headtag-session-option + .headtag-session-option { margin-top: 0.05rem; }
  .headtag-session-option:hover { color: var(--ink); background: color-mix(in srgb, var(--surface-2) 78%, transparent); box-shadow: none; }
  .headtag-session-option.on { color: var(--ink); background: var(--accent-soft); }
  .headtag-session-copy { min-width: 0; display: flex; flex-direction: column; gap: 0.16rem; }
  .headtag-session-heading { min-width: 0; display: flex; align-items: center; gap: 0.5rem; }
  .headtag-session-heading .chat-tab-status { flex-shrink: 0; }
  .headtag-session-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.73rem; font-weight: 650; line-height: 1.25; }
  .headtag-session-meta { min-width: 0; margin-left: calc(0.48rem + 0.5rem); overflow: hidden; text-overflow: ellipsis; color: var(--ink-4); font-size: 0.62rem; font-family: ui-monospace, "Cascadia Mono", monospace; line-height: 1.2; white-space: nowrap; }
  .headtag-session-current { align-self: start; margin-top: 0.08rem; color: var(--accent); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; }
  .headtag-row .it-context { max-width: min(38rem, 58%); }
  .headtagedit { max-width: 28rem; }
  .topstack { display: none; margin: 0.65rem 1.1rem 0.5rem; padding: 0.35rem; border: 1px solid var(--chat-pinned-border); border-radius: 11px; background: var(--latest-gradient); box-shadow: 0 8px 18px -16px var(--theme-chat-header-shadow); flex-direction: column; gap: 0.12rem; }
  html[data-theme="dark"] .topstack { box-shadow: 0 8px 20px -16px var(--theme-chat-header-shadow); }
  .topstack.show { display: flex; }
  .latestpin { display: none; border: 0; border-radius: 7px; background: transparent; padding: 0.55rem 0.65rem; cursor: pointer; box-shadow: none; }
  .latestpin.show { display: flex; }
  .latestpin:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
  .latestpin-body { flex: 1; min-width: 0; display: flex; align-items: center; gap: 0.65rem; overflow: hidden; }
  .latestpin-k { flex-shrink: 0; color: var(--ink-3); border: 0; background: transparent; padding: 0; font-size: 0.64rem; line-height: 1; font-weight: 850; letter-spacing: 0.11em; text-transform: uppercase; font-family: ui-monospace, "Cascadia Mono", monospace; }
  .latestpin-arrow { margin-left: auto; flex-shrink: 0; color: var(--theme-chat-pinned-arrow-foreground); font-family: ui-monospace, "Cascadia Mono", monospace; }
  .latestpin-text { flex: 1; min-width: 0; max-width: none; background: transparent; color: var(--theme-chat-pinned-foreground); border: 0; border-radius: 0; box-shadow: none; padding: 0; font-family: inherit; font-size: 0.86rem; font-style: normal; font-weight: 400; line-height: 1.45; letter-spacing: 0; text-transform: none; font-variant: normal; text-rendering: optimizeLegibility; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  /* Back-compat for previews rendered by an older open tab before the next refresh. */
  .latestpin-body .bubble { flex: 1; min-width: 0; max-width: none; background: transparent; color: var(--theme-chat-pinned-foreground); border: 0; border-radius: 0; box-shadow: none; padding: 0; font-family: inherit; font-size: 0.86rem; line-height: 1.45; font-weight: 400; font-variant: normal; text-rendering: optimizeLegibility; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .latestpin:hover { background: var(--chat-pinned-hover-background); }
  .latestpin-body .bubble > :first-child { margin-top: 0; }
  .latestpin-body .bubble > :last-child { margin-bottom: 0; }
  .latestpin-body .bubble p { margin: 0; }
  .latestpin-body .bubble p + p { margin-top: 0.5em; }
  .latestpin-body .bubble a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
  .latestpin-body .bubble code { font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.92em; background: var(--accent-soft); color: var(--accent); border-radius: 4px; padding: 0.05em 0.3em; }
  .latestpin-body .bubble .filepath { color: var(--accent); }
  .pintray { display: none; flex-direction: column; gap: 0.05rem; }
  .pintray.show { display: flex; }
  .pinitem { width: 100%; min-width: 0; display: flex; align-items: center; gap: 0.55rem; border: 0; border-radius: 7px; background: transparent; padding: 0.45rem 0.58rem; cursor: pointer; box-shadow: none; }
  .pinitem:hover { background: var(--chat-pinned-hover-background); }
  .pinitem-icon { width: 0.72rem; height: 0.72rem; flex-shrink: 0; fill: none; stroke: var(--ink-4); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
  .pinrole { flex-shrink: 0; font-size: 0.66rem; line-height: 1; font-weight: 850; letter-spacing: 0.09em; text-transform: uppercase; color: var(--theme-chat-pinned-role-foreground); border: 0; background: transparent; padding: 0; font-family: ui-monospace, "Cascadia Mono", monospace; }
  .pintext { flex: 1; min-width: 0; max-width: none; font-family: inherit; font-size: 0.86rem; font-style: normal; line-height: 1.45; font-weight: 400; letter-spacing: 0; text-transform: none; font-variant: normal; text-rendering: optimizeLegibility; color: var(--theme-chat-pinned-foreground); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .pinx { flex-shrink: 0; border: 0; background: transparent; color: var(--ink-4); box-shadow: none; padding: 0.08rem 0.22rem; line-height: 1; font-size: 1.1rem; }
  .pinx:hover { color: var(--theme-chat-pinned-close-hover-foreground); background: transparent; }
  #msgs { --msg-float-actions-space: 7rem; flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 1rem 1rem 1.5rem; display: flex; flex-direction: column; gap: 0.6rem; }
  .msgs-pane[hidden] { display: none !important; }
  #msgs.transcript-virtualized { gap: 0; overflow-anchor: none; contain: layout style; }
  .history-loader { flex: 0 0 auto; display: flex; justify-content: center; padding: 0 0 0.7rem; }
  .history-loader-button { min-height: 1.8rem; border: 1px solid var(--line-2); border-radius: 999px; background: var(--surface); color: var(--ink-3); padding: 0.25rem 0.75rem; font-size: 0.72rem; box-shadow: none; }
  .history-loader-button:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
  .history-loader-button:disabled { opacity: 0.58; cursor: default; }
  .transcript-turn { flex: 0 0 auto; min-width: 0; display: flex; flex-direction: column; gap: 0.6rem; padding-bottom: 0.6rem; }
  .transcript-virtual-spacer { flex: 0 0 auto; width: 1px; height: 0; pointer-events: none; }
  .transcript-live-tail { flex: 0 0 auto; min-width: 0; display: flex; flex-direction: column; gap: 0.6rem; }
  .msg { display: flex; align-items: center; gap: 0.28rem; }
  .msg.user { justify-content: flex-end; align-items: center; gap: 0.28rem; }
  /* hover-revealed controls for user/assistant bubbles */
  .msg-edit, .msg-pin, .msg-fold, .msg-comment { flex-shrink: 0; opacity: 0; pointer-events: none; width: 1.72rem; height: 1.72rem; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 7px; background: var(--msg-control-bg); color: var(--ink-4); padding: 0; box-shadow: none; line-height: 1; transition: opacity 0.12s, color 0.12s, border-color 0.12s, background 0.12s, box-shadow 0.12s; }
  .msg-edit { order: -3; }
  .msg-fold { order: -1; }
  .msg-pin { order: 1; }
  .msg-comment { order: 2; position: relative; }
  .msg.user .msg-pin { order: -2; }
  .msg.user .msg-comment { order: -1; }
  .msg.assistant .msg-pin { order: 1; }
  .msg-edit svg, .msg-pin svg, .msg-fold svg, .msg-comment svg { width: 0.98rem; height: 0.98rem; stroke: currentColor; stroke-width: 1.9; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .msg-pin .pin-body { fill: transparent; transition: fill 0.12s; }
  .msg:hover .msg-edit, .msg:hover .msg-pin, .msg:hover .msg-fold, .msg:hover .msg-comment, .msg:focus-within .msg-edit, .msg:focus-within .msg-pin, .msg:focus-within .msg-fold, .msg:focus-within .msg-comment, .msg-pin.on, .msg-comment.has-comments { opacity: 1; pointer-events: auto; }
  .msg-edit:hover, .msg-pin:hover, .msg-fold:hover, .msg-comment:hover { color: var(--ink); border-color: var(--msg-control-border); background: var(--msg-control-hover-bg); box-shadow: var(--shadow-sm); }
  .comment-msg-edit[hidden] { display: none; }
  .msg-comment.has-comments { color: var(--accent); }
  .msg-comment-count { position: absolute; right: -0.18rem; top: -0.24rem; min-width: 0.82rem; height: 0.82rem; padding: 0 0.16rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: var(--accent); color: white; font-size: 0.52rem; font-weight: 700; line-height: 1; }
  .msg-pin.on { color: var(--accent); border-color: var(--msg-control-active-border); background: var(--msg-control-active-bg); }
  .msg-pin.on .pin-body { fill: var(--theme-chat-pinned-icon-active-foreground); }
  .msg-float-actions { position: fixed; z-index: 48; display: flex; align-items: center; gap: 0.18rem; padding: 0; border: 0; background: transparent; box-shadow: none; transform: translateY(-50%); opacity: 0; pointer-events: none; transition: opacity 0.1s; }
  .msg-float-actions.show { opacity: 1; pointer-events: auto; }
  .msg-float-actions button { position: relative; width: 1.72rem; height: 1.72rem; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 7px; background: var(--msg-control-bg); color: var(--ink-4); padding: 0; box-shadow: none; line-height: 1; transition: color 0.12s, border-color 0.12s, background 0.12s, box-shadow 0.12s; }
  .msg-float-actions.has-selection button::after { content: ""; position: absolute; top: -0.22rem; right: -0.22rem; width: 0.42rem; height: 0.42rem; border: 2px solid var(--surface); border-radius: 50%; background: var(--accent); box-sizing: border-box; }
  .msg-float-actions button:hover { color: var(--ink); border-color: var(--msg-control-border); background: var(--msg-control-hover-bg); }
  .msg-float-actions button.on { color: var(--accent); background: var(--msg-control-active-bg); }
  .msg-float-actions svg { width: 0.98rem; height: 0.98rem; stroke: currentColor; stroke-width: 1.9; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .msg-float-actions.has-selection button { color: var(--accent); background: var(--msg-control-active-bg); }
  #msgFloatReference, #commentMsgFloatReference { font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.94rem; font-weight: 850; }
  .msg-reference-composer { position: fixed; z-index: 125; width: min(21rem, calc(100vw - 1rem)); padding: 0.48rem; border: 1px solid var(--line-2); border-radius: 10px; background: color-mix(in srgb, var(--surface) 96%, transparent); box-shadow: var(--shadow-pop); backdrop-filter: blur(12px) saturate(1.08); }
  .msg-reference-composer[hidden] { display: none; }
  .msg-reference-head { display: flex; align-items: center; gap: 0.45rem; min-width: 0; padding: 0.05rem 0.08rem 0.38rem; }
  .msg-reference-mark { flex-shrink: 0; color: var(--accent); font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.78rem; font-weight: 850; }
  .msg-reference-preview { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-3); font-size: 0.68rem; }
  .msg-reference-close { width: 1.35rem; height: 1.35rem; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 50%; color: var(--ink-4); background: transparent; box-shadow: none; }
  .msg-reference-close:hover { color: var(--ink); background: var(--button-hover); box-shadow: none; }
  .msg-reference-close svg { width: 0.7rem; height: 0.7rem; stroke: currentColor; stroke-width: 2; fill: none; stroke-linecap: round; }
  .msg-reference-input { display: block; width: 100%; height: 2.15rem; min-height: 2.15rem; padding: 0.42rem 0.58rem; border: 1px solid var(--line-2); border-radius: 7px; color: var(--ink); background: var(--input-bg); font-size: 0.78rem; line-height: 1.3; }
  .msg-reference-actions { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; padding-top: 0.42rem; }
  .msg-reference-hint { min-width: 0; color: var(--ink-4); font-size: 0.61rem; }
  .msg-reference-add { flex-shrink: 0; min-height: 1.75rem; padding: 0.26rem 0.68rem; border-color: var(--primary-bg); color: var(--primary-fg); background: var(--primary-bg); box-shadow: none; font-size: 0.68rem; font-weight: 700; }
  .msg-reference-add:hover { border-color: var(--primary-hover); background: var(--primary-hover); box-shadow: none; }
  .comment-msg-float-actions { z-index: 110; }
  .comment-msg-reference-composer { z-index: 126; width: min(19rem, calc(92vw - 1rem)); }
  @media (hover: none), (pointer: coarse) {
    #msgs { --msg-float-actions-space: 2.4rem; }
    .msg-float-actions { display: none; }
  }
  .msg.editing { justify-content: stretch; }
  .msg.editing .msg-edit { display: none; }
  .msg.editing .msg-pin { display: none; }
  .msg.editing .msg-fold { display: none; }
  .msg.editing .msg-comment { display: none; }
  .pincomment { flex-shrink: 0; min-height: 1.12rem; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: var(--radius-pill); padding: 0.16rem 0.42rem; background: transparent; color: var(--status-seen); font-size: 0.62rem; font-weight: 700; box-shadow: none; transition: color 0.12s, background 0.12s; }
  .pincomment:hover:not(:disabled), .pincomment:focus-visible:not(:disabled) { color: var(--status-seen); background: var(--status-seen-soft); outline: none; }
  .pincomment.idle { background: transparent; color: var(--ink-4); }
  .pincomment.generating { color: var(--status-generating); min-width: 1.3rem; padding: 0.16rem 0.36rem; }
  .pincomment.generating:hover, .pincomment.generating:focus-visible { color: var(--status-generating); background: var(--status-generating-soft); }
  .pincomment.unread { color: var(--status-unread); }
  .pincomment.unread:hover, .pincomment.unread:focus-visible { color: var(--status-unread); background: var(--status-unread-soft); }
  .commentdrawer { position: absolute; inset: 0; z-index: 95; display: flex; justify-content: flex-end; background: var(--theme-comment-overlay-background); }
  .commentdrawer[hidden] { display: none; }
  .commentpanel { --comment-composer-overlay-height: 4rem; --comment-queue-overlay-height: 0px; --comment-scrollbar-width: 0px; position: relative; width: min(34rem, 92vw); height: 100%; display: flex; flex-direction: column; background: var(--comment-background); border-left: 1px solid var(--comment-border); box-shadow: -18px 0 44px -10px var(--comment-shadow), -6px 0 16px -8px var(--comment-shadow); }
  .commenthead { flex: 0 0 3rem; height: 3rem; display: flex; align-items: center; gap: 0.65rem; padding: 0 0.65rem 0 0.9rem; border-bottom: 1px solid var(--comment-border); }
  .commenttitle { flex: 1; min-width: 0; color: var(--ink); font-size: 0.84rem; line-height: 1; font-weight: 750; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .commentstatus { flex-shrink: 0; }
  .commentstatus[hidden] { display: none; }
  .commentactions { flex-shrink: 0; display: flex; align-items: center; gap: 0.14rem; }
  .commentpromote { height: 1.75rem; min-height: 1.75rem; padding: 0 0.5rem; border-color: color-mix(in srgb, var(--vendor-action-bg) 38%, transparent); background: color-mix(in srgb, var(--vendor-action-bg) 10%, transparent); color: var(--vendor-action-bg); box-shadow: none; font-size: 0.68rem; line-height: 1; font-weight: 700; }
  .commentpromote:hover:not(:disabled) { border-color: color-mix(in srgb, var(--vendor-action-bg) 56%, transparent); background: color-mix(in srgb, var(--vendor-action-bg) 18%, transparent); color: var(--vendor-action-bg); box-shadow: none; }
  .commentpromote:disabled { border-color: transparent; background: transparent; }
  .commentclose { width: 1.75rem; height: 1.75rem; min-height: 1.75rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; border-color: transparent; background: transparent; color: var(--ink-3); box-shadow: none; font-size: 1.05rem; line-height: 1; }
  .commentclose:hover { border-color: transparent; background: var(--button-hover); color: var(--ink); box-shadow: none; }
  .commentanchor { margin: 0 0 0.2rem; min-width: 0; }
  .commentanchor-head { display: flex; align-items: center; gap: 0.55rem; margin-bottom: 0.38rem; }
  .commentanchor-label { flex: 1; min-width: 0; color: var(--ink-4); font-size: 0.59rem; line-height: 1; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }
  .commentanchor-content { min-width: 0; max-height: 35vh; overflow: auto; }
  .commentanchor-content > .msg { align-items: center; }
  .commentanchor-content > .msg .bubble { max-width: 100%; }
  .commentanchor-content > .toolc { max-width: 100%; }
  .commenttopstack { margin: 0.55rem 0.9rem 0; }
  .commentmsgs { --msg-float-actions-space: 5rem; flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0.8rem 0.9rem; display: flex; flex-direction: column; gap: 0.6rem; }
  #commentQueue { flex: 0 0 auto; z-index: 21; display: flex; flex-direction: column; gap: 0.3rem; max-height: 30vh; overflow-y: auto; padding: 0.4rem 0.9rem 0; }
  #commentQueue:empty { display: none; }
  .commentfoot { position: relative; flex: 0 0 auto; z-index: 20; margin-right: var(--comment-scrollbar-width); padding: 0 0.9rem 0.75rem; border-top: 0; background: var(--comment-background); }
  .commentcomposer { width: 100%; box-sizing: border-box; }
  .commentcomposer .composerrow { min-height: 2.15rem; }
  .commentcomposer .composer-shortcut-ghost { height: 2.15rem; padding: 0.42rem 5.2rem 0.42rem 0.35rem; }
  .commentfoot .commentcomposer textarea { height: 2.15rem; min-height: 2.15rem; max-height: 2.15rem; padding: 0.42rem 5.2rem 0.42rem 0.35rem; overflow-y: auto; }
  .scrollbottom { position: absolute; z-index: 24; width: 2rem; height: 2rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 1px solid var(--line-2); border-radius: 50%; background: var(--surface); color: var(--ink-3); box-shadow: var(--shadow-md); }
  .scrollbottom:hover { color: var(--accent); border-color: var(--accent); background: var(--surface); }
  .scrollbottom[hidden] { display: none; }
  .scrollbottom svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  .chat-scrollbottom { right: 1.55rem; bottom: calc(var(--composer-overlay-height) + var(--queue-overlay-height) + var(--avoid-overlay-height) + 0.55rem); }
  .comment-scrollbottom { right: 1.35rem; bottom: calc(var(--comment-composer-overlay-height) + var(--comment-queue-overlay-height) + 0.55rem); }
  .msg.editing .inline-edit { width: 100%; }
  /* shared in-place editor (sent-message resend + queued-draft edit) */
  .inline-edit { position: relative; width: 100%; --inline-edit-actions-space: 9rem; }
  .inline-edit-ta { display: block; width: 100%; box-sizing: border-box; resize: none; min-height: 2.2rem; font: inherit; font-size: 0.86rem; line-height: 1.5; padding: 0.5rem var(--inline-edit-actions-space) 0.5rem 0.65rem; border: 1px solid var(--accent); border-radius: var(--radius-sm); background: var(--input-bg); color: var(--ink); box-shadow: 0 0 0 3px var(--accent-ring); }
  .inline-edit.single-line .inline-edit-ta { min-height: calc(1.55em + 1.1rem); font-size: 0.88rem; line-height: 1.55; padding: calc(0.55rem - 1px) var(--inline-edit-actions-space) calc(0.55rem - 1px) 0.8rem; border-radius: 12px; border-bottom-right-radius: 4px; }
  .inline-edit-bar { position: absolute; right: 0.45rem; top: 50%; transform: translateY(-50%); display: flex; gap: 0.35rem; align-items: center; justify-content: flex-end; max-width: calc(100% - 0.9rem); }
  .inline-edit .inline-edit-save { height: 1.62rem; min-height: 1.62rem; padding: 0 0.58rem; font-size: 0.78rem; line-height: 1; white-space: nowrap; box-shadow: var(--shadow-sm); }
  .inline-edit .schedulebtn { width: 1.62rem; height: 1.62rem; min-height: 1.62rem; flex-basis: 1.62rem; }
  .inline-edit .inline-edit-save { color: var(--vendor-action-fg); background: var(--vendor-action-bg); border-color: var(--vendor-action-bg); font-weight: 600; }
  .inline-edit .inline-edit-save:hover:not(:disabled) { background: var(--vendor-action-hover); border-color: var(--vendor-action-hover); box-shadow: 0 4px 14px var(--vendor-action-ring); }
  .msg .bubble { min-width: 0; max-width: 76%; padding: 0.55rem 0.8rem; border-radius: 12px; font-size: 0.88rem; line-height: 1.55; white-space: normal; word-break: break-word; overflow-wrap: anywhere; box-shadow: var(--shadow-sm); }
  .msg.user .bubble { background: var(--user-msg-bg); color: var(--user-msg-fg); border: 1px solid var(--user-msg-border); border-bottom-right-radius: 4px; }
  .msg.assistant .bubble { max-width: calc(100% - var(--msg-float-actions-space)); background: var(--assistant-bg); color: var(--ink); border: 1px solid var(--assistant-border); border-bottom-left-radius: 4px; }
  .streaming-tail { white-space: pre-wrap; }
  .msg.anchor-arrived .bubble, .toolrow.anchor-arrived > .toolc { animation: anchorArrive 0.9s ease-out; }
  @keyframes anchorArrive {
    0% { box-shadow: 0 0 0 3px var(--accent-ring), var(--shadow-sm); }
    100% { box-shadow: var(--shadow-sm); }
  }
  .msg .bubble > :first-child { margin-top: 0; }
  .msg .bubble > :last-child { margin-bottom: 0; }
  .msg .bubble p { margin: 0; }
  .msg .bubble p + p { margin-top: 0.7em; }
  .msg .bubble ul, .msg .bubble ol { margin: 0.55em 0 0 1.2em; padding: 0; }
  .msg .bubble li + li { margin-top: 0.22em; }
  .msg .bubble blockquote { margin: 0.7em 0 0; padding-left: 0.8em; border-left: 3px solid var(--theme-chat-markdown-border); color: inherit; opacity: 0.92; }
  .msg .bubble pre { margin: 0.7em 0 0; padding: 0.65em 0.8em; border-radius: 8px; overflow: auto; white-space: pre-wrap; word-break: break-word; }
  .msg.assistant .bubble pre { background: var(--code-bg); color: var(--ink); }
  .msg.user .bubble pre { background: var(--user-msg-code-bg); color: var(--user-msg-fg); }
  .msg .bubble code { font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.92em; border-radius: 4px; padding: 0.08em 0.28em; }
  .msg.assistant .bubble code { background: var(--code-bg); color: var(--ink); }
  .msg.user .bubble code { background: var(--user-msg-code-bg); color: var(--user-msg-fg); }
  .msg .bubble pre code { background: transparent; padding: 0; border-radius: 0; }
  .msg .bubble .diagram { position: relative; margin: 0.7em 0 0; padding: 0.65em 0.8em; border-radius: 8px; border: 1px solid var(--theme-diagram-border); background: var(--theme-diagram-background); overflow: auto; }
  .msg .bubble .diagram[data-rendered="ok"] { cursor: zoom-in; }
  .msg.user .bubble .diagram { border-color: var(--user-msg-border); background: var(--surface); }
  .msg .bubble .diagram svg, .msg .bubble .diagram img { display: block; max-width: 100%; height: auto; }
  .msg .bubble .diagram-status { color: var(--theme-diagram-status-foreground); font-size: 0.78rem; font-style: italic; }

  .msg .bubble .diagram-error { color: var(--theme-diagram-error-foreground); font-size: 0.78rem; font-style: italic; }
  .msg .bubble .diagram-status { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4em; }
  .msg.user .bubble .diagram-status, .msg.user .bubble .diagram-error { color: var(--ink-3); }
  .msg .bubble .diagram-btn { font-style: normal; font-size: 0.72rem; line-height: 1.2; padding: 0.14em 0.55em; border: 1px solid var(--theme-diagram-button-border); border-radius: 5px; background: var(--theme-diagram-button-background); color: var(--theme-diagram-button-foreground); cursor: pointer; }
  .msg .bubble .diagram-btn:hover { background: var(--theme-diagram-button-hover-background); }
  .msg .bubble .diagram-btn:disabled { opacity: 0.6; cursor: default; }
  .msg.user .bubble .diagram-btn { color: var(--ink-2); }
  .msg .bubble .diagram-note { font-size: 0.72rem; }
  .msg .bubble .diagram-src { margin: 0.5em 0 0; max-height: 24em; overflow: auto; font-style: normal; }
  .msg .bubble .diagram-error { color: var(--theme-diagram-error-foreground); }
  .msg.user .bubble .diagram-error { color: var(--user-error-foreground); }
  .msg .bubble .diagram-fallback { margin-top: 0.45em; }
  .msg .bubble a { text-decoration: underline; text-underline-offset: 2px; }
  .msg.assistant .bubble a { color: var(--theme-chat-assistant-link-foreground); }
  .msg.user .bubble a { color: var(--user-msg-link); }
  .msg .bubble h1, .msg .bubble h2, .msg .bubble h3, .msg .bubble h4, .msg .bubble h5, .msg .bubble h6 { margin: 0.85em 0 0.35em; line-height: 1.25; }
  .msg .bubble h1 { font-size: 1.25em; }
  .msg .bubble h2 { font-size: 1.15em; }
  .msg .bubble h3 { font-size: 1.05em; }
  .msg .bubble hr { border: 0; border-top: 1px solid var(--markdown-separator); margin: 0.75em 0; }
  .msg .bubble table { border-collapse: collapse; margin: 0.7em 0 0; font-size: 0.92em; display: block; max-width: 100%; overflow-x: auto; }
  .msg .bubble th { border: 1px solid var(--theme-chat-markdown-msg-bubble-border); padding: 0.3em 0.55em; text-align: left; vertical-align: top; }

  .msg .bubble td { border: 1px solid var(--theme-chat-markdown-msg-bubble-border); padding: 0.3em 0.55em; text-align: left; vertical-align: top; }
  .msg .bubble thead th { background: var(--theme-chat-markdown-background); font-weight: 600; }
  .msg.user .bubble th, .msg.user .bubble td { border-color: var(--user-msg-border); }
  .msg.user .bubble thead th { background: var(--user-msg-code-bg); }
  /* file paths mentioned in a message → click to reveal in Finder/Explorer */
  .msg .bubble .filepath { cursor: pointer; text-decoration: underline dotted; text-underline-offset: 2px; }
  .msg.assistant .bubble .filepath { color: var(--theme-link-file-foreground); }
  .msg.user .bubble .filepath { color: var(--user-msg-link); }
  .msg .bubble .filepath:hover { text-decoration: underline; }
  .msg .bubble .filepath.badpath { color: var(--theme-link-file-msg-bubble-filepath-badpath-foreground); text-decoration: line-through; }
  .msg.thinking .bubble { max-width: none; padding: 0.08rem 0; border: 0; border-radius: 0; background: transparent; color: var(--ink-3); box-shadow: none; font-size: 0.78rem; line-height: 1.25; font-style: italic; }
  .msg.thinking .bubble::after { content: ""; display: inline-block; width: 0.42em; height: 0.42em; margin-left: 0.38em; border-radius: 50%; background: var(--status-generating); animation: gpulse 1s ease-in-out infinite; }
  @keyframes gpulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.2; } }
  .msg.error .bubble { background: var(--chat-error-background); color: var(--theme-error-foreground); border: 1px solid var(--theme-error-border); }
  .msg.error.provider-error .bubble { width: min(34rem, calc(100% - var(--msg-float-actions-space))); max-width: min(34rem, calc(100% - var(--msg-float-actions-space))); }
  .provider-error-title { font-size: 0.9rem; line-height: 1.3; font-weight: 750; }
  .provider-error-message { margin-top: 0.28rem; color: currentColor; font-size: 0.8rem; line-height: 1.45; opacity: 0.9; }
  .provider-error-command { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.6rem; }
  .provider-error-command code { flex: 1; min-width: 0; overflow-x: auto; padding: 0.38rem 0.5rem; border: 1px solid var(--theme-error-command-border); border-radius: var(--radius-sm); background: var(--theme-error-command-background); color: inherit; font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.78rem; line-height: 1.25; white-space: nowrap; }
  .provider-error-actions { display: flex; flex-wrap: wrap; gap: 0.42rem; margin-top: 0.62rem; }
  .provider-error-button { min-height: 1.75rem; padding: 0.28rem 0.58rem; border: 1px solid var(--theme-error-button-border); border-radius: var(--radius-sm); background: var(--theme-error-button-background); color: var(--theme-error-button-foreground); font-size: 0.72rem; line-height: 1; font-weight: 700; box-shadow: none; }
  .provider-error-button:hover:not(:disabled) { border-color: var(--theme-error-button-hover-border); background: var(--theme-error-button-hover-background); color: var(--theme-error-button-hover-foreground); box-shadow: none; }
  .folded-away { display: none !important; }
  .turnfold-row { display: flex; justify-content: flex-end; }
  .turnfold-card { max-width: min(34rem, 76%); min-width: min(18rem, 76%); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.55rem; padding: 0.46rem 0.62rem; border: 1px dashed var(--theme-chat-fold-border); border-radius: 10px; background: var(--theme-chat-fold-background); color: var(--ink-2); box-shadow: none; text-align: left; }
  .turnfold-card:hover { border-color: var(--accent); background: var(--theme-chat-fold-hover-background); }
  .turnfold-card:focus-visible { outline: 2px solid var(--accent-ring); outline-offset: -2px; }
  .turnfold-ico { color: var(--accent); font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.86rem; line-height: 1; }
  .turnfold-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.82rem; line-height: 1.35; font-weight: 650; color: var(--ink); }
  .turnfold-meta { flex-shrink: 0; font-size: 0.64rem; line-height: 1; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-4); font-family: ui-monospace, "Cascadia Mono", monospace; white-space: nowrap; }
  .toast-host { position: fixed; right: 1rem; bottom: 1rem; z-index: 140; display: flex; flex-direction: column; gap: 0.45rem; align-items: flex-end; pointer-events: none; }
  .toast { max-width: min(24rem, calc(100vw - 2rem)); border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--surface); color: var(--ink); box-shadow: var(--shadow-pop); padding: 0.62rem 0.75rem; font-size: 0.78rem; line-height: 1.35; opacity: 0.98; transform: translateY(0); transition: opacity 0.18s, transform 0.18s; }
  .toast.warn { border-color: var(--theme-notification-warning-border); background: var(--theme-notification-warning-background); color: var(--theme-notification-warning-foreground); }
  .toast.error { position: fixed; top: 1rem; left: 50%; z-index: 150; width: max-content; max-width: calc(100vw - 2rem); transform: translateX(-50%); border-color: var(--theme-notification-error-border); background: var(--theme-notification-error-background); color: var(--theme-notification-error-foreground); font-size: 0.86rem; font-weight: 800; text-align: center; }
  .toast.ok { border-color: var(--theme-notification-success-border); background: var(--theme-notification-success-background); color: var(--theme-notification-success-foreground); }
  .toast.live-restored { position: fixed; top: 1rem; left: 50%; z-index: 150; width: max-content; max-width: calc(100vw - 2rem); transform: translateX(-50%); border-color: var(--theme-notification-success-border); background: var(--theme-notification-success-background); color: var(--theme-notification-success-foreground); font-size: 0.86rem; font-weight: 800; text-align: center; }
  .toast.hide { opacity: 0; transform: translateY(0.35rem); }
  .toast.live-restored.hide { transform: translate(-50%, 0.35rem); }
  .unlock { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; background: var(--canvas); color: var(--ink); padding: 1rem; }
  .unlock[hidden] { display: none; }
  .unlock-panel { width: min(25rem, 100%); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-pop); padding: 1rem; }
  .unlock-title { font-size: 1rem; font-weight: 800; margin-bottom: 0.35rem; }
  .unlock-sub { font-size: 0.78rem; line-height: 1.4; color: var(--ink-3); margin-bottom: 0.75rem; }
  .unlock-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.5rem; }
  .unlock-input { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); padding: 0.55rem 0.65rem; font-size: 0.88rem; }
  .unlock-btn { border: 1px solid var(--primary-bg); border-radius: var(--radius-sm); background: var(--primary-bg); color: var(--primary-fg); padding: 0.55rem 0.75rem; font-weight: 800; cursor: pointer; }
  .unlock-btn:hover { border-color: var(--primary-hover); background: var(--primary-hover); }
  .unlock-msg { min-height: 1.1rem; margin-top: 0.55rem; color: var(--theme-unlock-error-foreground); font-size: 0.76rem; }
  .tool { align-self: flex-start; font-family: ui-monospace, monospace; font-size: 0.72rem; color: var(--tool-fg); background: var(--tool-bg); border: 1px solid var(--tool-border); border-radius: 6px; padding: 0.2rem 0.5rem; }
  .toolrow { align-self: stretch; width: 100%; min-width: 0; display: flex; align-items: flex-start; }
  .toolrow > .toolc { width: fit-content; min-width: 0; max-width: calc(100% - var(--msg-float-actions-space)); }
  .toolc { align-self: flex-start; max-width: 88%; font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.74rem; background: var(--tool-bg); border: 1px solid var(--tool-border); border-radius: 6px; }
  .toolc > summary { cursor: pointer; padding: 0.28rem 0.6rem; color: var(--tool-fg); list-style: none; user-select: none; display: flex; align-items: center; min-width: 0; }
  .toolc > summary:hover { color: var(--ink); }
  .toolc > summary:focus-visible { outline: 1px solid var(--tool-border-strong); outline-offset: -1px; border-radius: 5px; }
  .tool-summary-text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .toolrow:hover > .msg-pin, .toolrow:hover > .msg-comment, .toolrow:focus-within > .msg-pin, .toolrow:focus-within > .msg-comment, .toolrow > .msg-pin.on, .toolrow > .msg-comment.has-comments { opacity: 1; pointer-events: auto; }
  .toolc > summary::-webkit-details-marker { display: none; }
  .toolc > summary::before { content: "▸ "; color: var(--tool-icon); }
  .toolc[data-tool-pending="true"] { border-color: var(--status-generating); box-shadow: 0 0 0 2px var(--status-generating-soft); }
  .toolc[data-tool-pending="true"] > summary::after { content: ""; width: 0.42rem; height: 0.42rem; flex-shrink: 0; margin-left: 0.5rem; border-radius: 50%; background: var(--status-generating); animation: gpulse 1s ease-in-out infinite; }
  .toolc[data-tool-error="true"] { border-color: var(--theme-tool-toolc-border); box-shadow: none; }
  .toolc[open] > summary::before { content: "▾ "; }
  .toolc[open] > summary { border-bottom: 1px solid var(--tool-divider); }
  .toolc pre { margin: 0; padding: 0.45rem 0.6rem; white-space: pre-wrap; word-break: break-word; max-height: 340px; overflow: auto; }
  .toolc .tool-in { color: var(--ink-2); background: var(--tool-body-bg); }
  .toolc .tool-out { color: var(--ink); background: var(--tool-body-bg); border-top: 1px solid var(--tool-divider); }
  .toolc .tool-out.err { color: var(--theme-tool-error-foreground); background: var(--theme-tool-error-background); }
  /* git-diff-style rendering for Edit / MultiEdit / Write (expanded by default) */
  .toolc .diff { background: var(--tool-body-bg); border-top: 1px solid var(--tool-divider); overflow: auto; max-height: 460px; font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.74rem; }
  .toolc .diff-file { padding: 0.38rem 0.6rem 0.34rem; background: var(--tool-bg); border-bottom: 1px solid var(--tool-divider); }
  .toolc .diff-file + .diff-file { border-top: 1px dashed var(--tool-divider); }
  .toolc .diff-file-title { font-weight: 700; color: var(--tool-fg); }
  .toolc .diff-file-meta { margin-top: 0.16rem; font-size: 0.68rem; color: var(--ink-3); }
  .toolc .diff-sep { height: 0.45rem; background: var(--tool-bg); border-top: 1px dashed var(--tool-divider); border-bottom: 1px dashed var(--tool-divider); }
  .dline { display: flex; align-items: flex-start; padding: 0 0.4rem; line-height: 1.45; }
  .dline .dsign { width: 1.4ch; flex-shrink: 0; text-align: center; user-select: none; opacity: 0.7; }
  .dline .dtext { white-space: pre-wrap; word-break: break-word; flex: 1; min-width: 0; }
  .dline.add { background: var(--theme-diff-added-background); color: var(--theme-diff-added-foreground); }
  .dline.add .dsign { color: var(--theme-diff-added-sign-foreground); }
  .dline.del { background: var(--theme-diff-removed-background); color: var(--theme-diff-removed-foreground); }
  .dline.del .dsign { color: var(--theme-diff-removed-sign-foreground); }
  .dline.ctx { color: var(--theme-diff-context-foreground); }
  .dline.meta { background: var(--tool-bg); color: var(--ink-3); }
  .dline.meta .dsign { color: var(--tool-icon); }
  /* rich renders for interactive tools: todos / plan / questions */
  .rt, .rq, .rplan { background: var(--tool-body-bg); border-top: 1px solid var(--tool-divider); padding: 0.45rem 0.65rem; }
  .rt { display: flex; flex-direction: column; gap: 0.18rem; }
  .rt-note { font-size: 0.74rem; color: var(--theme-tool-note-foreground); font-style: italic; margin-bottom: 0.2rem; }
  .todo-row { display: flex; gap: 0.45rem; align-items: flex-start; font-size: 0.8rem; line-height: 1.45; font-family: ui-sans-serif, -apple-system, sans-serif; }
  .todo-ic { flex-shrink: 0; width: 1em; text-align: center; }
  .todo-row.done .todo-tx { color: var(--theme-todo-text-done-foreground); text-decoration: line-through; }
  .todo-row.done .todo-ic { color: var(--theme-todo-icon-done-foreground); }
  .todo-row.doing .todo-tx { color: var(--ink); font-weight: 600; }
  .todo-row.doing .todo-ic { color: var(--theme-todo-icon-doing-foreground); }
  .todo-row.todo .todo-ic { color: var(--theme-todo-icon-foreground); }
  .rq { display: flex; flex-direction: column; gap: 0.3rem; }
  .q-card { border: 1px solid var(--line); border-radius: 8px; background: var(--soft-card); padding: 0.45rem 0.5rem; display: flex; flex-direction: column; gap: 0.35rem; }
  .q-head { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--theme-question-title-foreground); font-weight: 700; }
  .q-text { font-size: 0.82rem; color: var(--ink); line-height: 1.45; }
  .q-opt { border: 1px solid var(--line); border-radius: 6px; padding: 0.3rem 0.5rem; background: var(--surface); }
  .q-choice { display: flex; gap: 0.45rem; align-items: flex-start; cursor: pointer; }
  .q-choice input { margin-top: 0.18rem; }
  .q-choice-body { display: block; flex: 1; min-width: 0; }
  .q-opt-label { font-weight: 600; font-size: 0.8rem; color: var(--ink); display: block; }
  .q-opt-desc { font-size: 0.74rem; color: var(--ink-3); display: block; margin-top: 0.12rem; line-height: 1.4; }
  .q-free { width: 100%; box-sizing: border-box; border: 1px solid var(--line-2); border-radius: 6px; padding: 0.38rem 0.5rem; font: inherit; font-size: 0.78rem; background: var(--input-bg); color: var(--ink); }
  .q-actions { display: flex; gap: 0.45rem; align-items: center; flex-wrap: wrap; }
  .q-submit { background: var(--primary-bg); color: var(--primary-fg); border: 1px solid var(--primary-bg); border-radius: 6px; padding: 0.34rem 0.7rem; font: inherit; font-size: 0.76rem; cursor: pointer; }
  .q-submit:hover:not(:disabled) { background: var(--primary-hover); border-color: var(--primary-hover); }
  .q-submit:disabled { opacity: 0.65; cursor: default; }
  .q-err { font-size: 0.74rem; color: var(--theme-question-error-foreground); }
  .rq.busy { opacity: 0.8; }
  .rplan { white-space: pre-wrap; word-break: break-word; font-size: 0.8rem; line-height: 1.5; color: var(--ink-2); max-height: 420px; overflow: auto; }
  .placeholder { margin: auto; color: var(--theme-input-placeholder-foreground); text-align: center; font-size: 0.9rem; max-width: 32ch; line-height: 1.5; }
  .changelog { width: min(38rem, calc(100% - 2rem)); margin: auto; color: var(--ink); }
  .changelog-kicker { color: var(--accent); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }
  .changelog-content > h1 { margin: 0.35rem 0 0; font-size: 1.45rem; line-height: 1.2; letter-spacing: -0.025em; }
  .changelog-content > p { margin: 0.45rem 0 0; color: var(--ink-3); font-size: 0.78rem; line-height: 1.55; }
  .changelog-content h2 { margin: 1.25rem 0 0; padding-top: 1rem; border-top: 1px solid var(--line); font-size: 1rem; line-height: 1.35; }
  .changelog-content h3 { margin: 0.9rem 0 0; color: var(--ink-2); font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; }
  .changelog-content ul { margin: 0.55rem 0 0; padding-left: 1.15rem; color: var(--ink-3); font-size: 0.78rem; line-height: 1.55; }
  .changelog-content li + li { margin-top: 0.35rem; }
  .changelog-hint { margin-top: 1rem; color: var(--ink-4); font-size: 0.72rem; line-height: 1.5; }
  @media (max-width: 620px) {
    .changelog { width: calc(100% - 1rem); }
  }
  .foot { position: relative; flex: 0 0 auto; z-index: 20; margin-right: var(--chat-scrollbar-width); border-top: 0; padding: 0 1rem 1rem; background: var(--surface); }
  .foot.rail-open, .foot.pinref-open { z-index: 28; }
  body.no-session #queue, body.no-session .foot, body.no-session .chat-scrollbottom { display: none; }
  .composer { --composer-focus-border: color-mix(in srgb, var(--accent) 68%, var(--line-2)); min-width: 0; display: flex; flex-direction: column; gap: 0; }
  .composer-surface { position: relative; z-index: 1; min-width: 0; border: 1px solid var(--line-2); border-radius: 13px; padding: 0.45rem; background: var(--input-bg); box-shadow: var(--shadow-sm); transition: background 0.15s, box-shadow 0.15s, border-color 0.15s; }
  .composer-surface:focus-within { border-color: var(--composer-focus-border); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 12%, transparent), var(--shadow-sm); }
  .commentcomposer-surface { position: relative; z-index: 1; min-width: 0; border: 1px solid var(--line-2); border-radius: 13px; padding: 0.45rem; background: var(--input-bg); box-shadow: var(--shadow-sm); transition: background 0.15s, box-shadow 0.15s, border-color 0.15s; }
  .commentcomposer-surface:focus-within { border-color: var(--composer-focus-border); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 12%, transparent), var(--shadow-sm); }
  .composer.drop .composer-surface { border-color: var(--theme-input-drop-drop-border); background: var(--drop-bg); box-shadow: 0 0 0 4px var(--theme-input-drop-drop-shadow-color1), 0 0 0 1px var(--theme-input-drop-drop-shadow-color2); }
  /* One composer surface, with a compact context ribbon inside it. The ribbon is deliberately
     neutral: accent belongs to active controls and state, not to a second container outline. */
  .composerrail { position: relative; width: fit-content; max-width: 100%; min-width: 0; display: flex; align-items: center; margin: 0 0 0.12rem; padding: 0.12rem 0.24rem; border: 0; border-radius: 7px; background: color-mix(in srgb, var(--input-bg) 96%, var(--ink)); box-shadow: none; }
  .composerrail-controls { width: auto; max-width: 100%; min-width: 0; display: flex; align-items: center; gap: 0.2rem; overflow-x: auto; scrollbar-width: none; }
  .composerrail-controls::-webkit-scrollbar { display: none; }
  .rail-divider { flex: 0 0 1px; align-self: stretch; max-height: 1.2rem; margin: auto 0.18rem; background: var(--line); }
  .railbtn { flex-shrink: 0; max-width: 10rem; min-height: 1.5rem; display: inline-flex; align-items: center; gap: 0.22rem; padding: 0.1rem 0.34rem; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--ink-3); box-shadow: none; font-size: 0.67rem; line-height: 1.2; white-space: nowrap; }
  .railbtn:hover:not(:disabled) { color: var(--ink); border-color: transparent; background: color-mix(in srgb, var(--surface-2) 75%, transparent); box-shadow: none; }
  .railbtn.active, .railbtn.active:hover:not(:disabled) { color: var(--ink); border-color: transparent; background: var(--accent-soft); }
  .railbtn:disabled { color: var(--ink-4); background: transparent; }
  .railbtn-value { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  /* U+2303 sits superscript-high by default; nudge it to optical center */
  .railbtn > span[aria-hidden="true"] { display: inline-block; transform: translateY(0.14em); }
  #railVendor[data-vendor="claude"] { color: var(--vendor-claude-fg); }
  #railVendor[data-vendor="codex"] { color: var(--vendor-codex-fg); }
  #railVendor[data-vendor="cursor"] { color: var(--vendor-cursor-fg); }
  #railVendor[data-vendor="antigravity"] { color: var(--vendor-antigravity-fg); }
  #railVendor[data-vendor="copilot"] { color: var(--vendor-copilot-fg); }
  #railVendor[data-vendor="opencode"] { color: var(--vendor-opencode-fg); }
  #railModel { flex: 0 1 auto; min-width: 0; }
  #railModel .railbtn-value { max-width: 8rem; }
  /* only when open todos exist: label + count carry the sidebar todo marker's amber (.it-todo); 0 stays neutral */
  #railTodos.rail-has-count .railbtn-value, #railTodos.rail-has-count .railbtn-count { color: var(--todo-fg); }
  .railbtn-count { min-width: 1rem; padding: 0.02rem 0.28rem; border-radius: 999px; background: var(--surface-2); color: var(--ink-3); font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.61rem; font-weight: 760; text-align: center; }
  /* Daemon's suggested next message — a click drops it into the composer (fill, not send). */
  /* Lane B — the daemon's scrutiny probe: a muted, read-only-looking text that fills
     the rail's remaining width; click fills it into the composer (never sends). */
  .rail-probe { max-width: none; color: var(--ink-3); border-color: transparent; background: transparent; font-style: italic; }
  .rail-probe:hover:not(:disabled) { color: var(--ink-2); border-color: transparent; background: color-mix(in srgb, var(--surface-2) 75%, transparent); }
  .rail-probe .railbtn-value { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .rail-probe-ico { flex-shrink: 0; color: var(--ink-4); font-size: 0.72rem; font-style: normal; }
  .rail-probe[hidden] { display: none; }
  /* When a probe is present, the rail spans the composer width and the probe grows to
     fill whatever space the control buttons leave, ellipsizing at the composer edge. */
  .composerrail.rail-full { width: 100%; }
  .composerrail.rail-full .composerrail-controls { width: 100%; }
  .composerrail.rail-full .rail-probe { flex: 1 1 0; min-width: 0; max-width: none; justify-content: flex-start; }
  .composerrail.rail-full .rail-probe .railbtn-value { flex: 1 1 auto; max-width: none; text-align: left; }
  /* Hide the native placeholder while the empty composer shows the nextStep ghost (Lane A). */
  #input.nextstep-ghosting::placeholder { color: transparent; }
  .railpop { position: absolute; left: 0; bottom: calc(100% + 0.55rem); z-index: 60; width: min(20rem, calc(100vw - 1.25rem)); max-height: min(42vh, 20rem); display: flex; flex-direction: column; gap: 0.22rem; overflow: visible; border: 0; border-radius: 0; background: transparent; color: var(--ink); box-shadow: none; pointer-events: none; }
  .railpop > * { pointer-events: auto; }
  .railpop[hidden] { display: none; }
  .railpop.kind-vendor { width: min(20rem, calc(100vw - 1.25rem)); max-height: min(55vh, 25rem); }
  .railpop.kind-effort, .railpop.kind-speed { width: min(6rem, calc(100vw - 1.25rem)); }
  .railpop.kind-model { width: min(10.5rem, calc(100vw - 1.25rem)); }
  .railpop-body { min-height: 0; max-height: min(38vh, 18rem); overflow-y: auto; padding: 0.3rem; border: 1px solid color-mix(in srgb, var(--menu-border) 72%, transparent); border-radius: 10px; background: color-mix(in srgb, var(--menu-background) 96%, transparent); box-shadow: var(--shadow-pop); backdrop-filter: blur(12px) saturate(1.08); }
  .kind-vendor .railpop-body { max-height: min(55vh, 25rem); }
  .rail-option { width: 100%; min-height: 1.9rem; display: flex; align-items: center; gap: 0.4rem; padding: 0.32rem 0.48rem; border: 0; border-radius: 6px; background: transparent; color: var(--ink-2); box-shadow: none; text-align: left; font-size: 0.73rem; }
  .rail-option + .rail-option { margin-top: 0.05rem; }
  .rail-option:hover { background: color-mix(in srgb, var(--surface-2) 78%, transparent); box-shadow: none; }
  .rail-option.on { color: var(--ink); background: var(--accent-soft); }
  .rail-option-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .rail-option-vendor-mark { width: 0.46rem; height: 0.46rem; flex-shrink: 0; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 18%, transparent); }
  .rail-option[data-vendor="claude"] .rail-option-label, .rail-option[data-vendor="claude"] .rail-option-vendor-mark { color: var(--vendor-claude-fg); }
  .rail-option[data-vendor="codex"] .rail-option-label, .rail-option[data-vendor="codex"] .rail-option-vendor-mark { color: var(--vendor-codex-fg); }
  .rail-option[data-vendor="cursor"] .rail-option-label, .rail-option[data-vendor="cursor"] .rail-option-vendor-mark { color: var(--vendor-cursor-fg); }
  .rail-option[data-vendor="antigravity"] .rail-option-label, .rail-option[data-vendor="antigravity"] .rail-option-vendor-mark { color: var(--vendor-antigravity-fg); }
  .rail-option[data-vendor="copilot"] .rail-option-label, .rail-option[data-vendor="copilot"] .rail-option-vendor-mark { color: var(--vendor-copilot-fg); }
  .rail-option[data-vendor="opencode"] .rail-option-label, .rail-option[data-vendor="opencode"] .rail-option-vendor-mark { color: var(--vendor-opencode-fg); }
  .rail-option-note { flex-shrink: 0; color: var(--ink-4); font-size: 0.62rem; }
  .rail-empty { padding: 0.85rem 0.65rem; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink-4); box-shadow: var(--shadow-sm); font-size: 0.74rem; text-align: center; }
  .rail-items { display: flex; flex-direction: column; gap: 0.05rem; }
  .rail-item { min-width: 0; display: flex; align-items: center; gap: 0.42rem; padding: 0.38rem 0.4rem; border: 0; border-radius: 6px; background: transparent; box-shadow: none; }
  .rail-item:hover { background: color-mix(in srgb, var(--surface-2) 78%, transparent); box-shadow: none; }
  .rail-item.done .rail-item-text { color: var(--ink-4); text-decoration: line-through; }
  .rail-todo-check { appearance: none; width: 0.78rem; height: 0.78rem; margin: 0 0.04rem; flex-shrink: 0; display: grid; place-content: center; border: 1px solid var(--todo-border); border-radius: 3px; background: transparent; cursor: pointer; transition: background 0.12s, border-color 0.12s, box-shadow 0.12s; }
  .rail-todo-check::before { content: ''; width: 0.24rem; height: 0.4rem; border: solid var(--surface); border-width: 0 1.5px 1.5px 0; opacity: 0; transform: translateY(-0.04rem) rotate(45deg) scale(0.7); transition: opacity 0.1s, transform 0.1s; }
  .rail-todo-check:hover { border-color: var(--todo-fg); background: var(--todo-bg); }
  .rail-todo-check:checked { border-color: var(--todo-fg); background: var(--todo-fg); }
  .rail-todo-check:checked::before { opacity: 1; transform: translateY(-0.04rem) rotate(45deg) scale(1); }
  .rail-todo-check:focus-visible { outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--todo-fg) 22%, transparent); }
  .rail-item-text { flex: 1; min-width: 0; min-height: 1.45rem; display: flex; align-items: center; padding: 0; border: 0; background: transparent; color: var(--ink-2); box-shadow: none; font: inherit; font-size: 0.77rem; line-height: 1.35; text-align: left; white-space: pre-wrap; overflow-wrap: anywhere; }
  .rail-item-text:hover { color: var(--ink); background: transparent; }
  .rail-item-order { flex-shrink: 0; display: inline-flex; align-items: center; }
  .rail-item-order .qaction:disabled { color: var(--ink-4); background: transparent; opacity: 0.42; }
  .rail-item-edit { width: 100%; min-width: 0; display: flex; align-items: flex-end; gap: 0.38rem; }
  .composer .rail-item-edit textarea, .composer .rail-add textarea { flex: 1; width: auto; min-width: 0; height: auto; min-height: 1.8rem; max-height: 6rem; resize: none; overflow-y: hidden; font: inherit; font-size: 0.77rem; line-height: 1.35; }
  .composer .rail-item-edit textarea { padding: 0.34rem 0.46rem; border: 1px solid var(--accent); border-radius: 6px; background: var(--input-bg); color: var(--ink); box-shadow: 0 0 0 2px var(--accent-ring); }
  .rail-add { flex-shrink: 0; display: flex; align-items: flex-end; gap: 0.4rem; padding: 0.08rem; border: 0; background: transparent; }
  .rail-items + .rail-add { margin-top: 0.12rem; padding-top: 0.3rem; border-top: 1px solid var(--row-line); }
  .composer .rail-add textarea { padding: 0.42rem 0.55rem; border: 1px solid var(--line-2); border-radius: 8px; background: var(--surface); color: var(--ink); box-shadow: var(--shadow-sm); }
  .rail-add > button { align-self: stretch; display: inline-flex; align-items: center; justify-content: center; }
  .composer .rail-item-edit textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-ring); }
  .composer .rail-add textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
  .rail-add button, .rail-item-edit-save { flex-shrink: 0; min-height: 1.72rem; padding: 0 0.55rem; border-color: var(--primary-bg); background: var(--primary-bg); color: var(--primary-fg); font-size: 0.7rem; }
  .rail-add button:hover:not(:disabled), .rail-item-edit-save:hover:not(:disabled) { border-color: var(--primary-hover); background: var(--primary-hover); }
  .composerrow { position: relative; display: flex; flex-direction: column; align-items: stretch; min-height: 4.55rem; }
  .pinref-picker { position: absolute; left: 0; right: 0; bottom: calc(100% + 0.42rem); z-index: 12; max-height: min(42dvh, 21rem); overflow-y: auto; padding: 0.34rem; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow-pop); }
  .pinref-picker[hidden] { display: none; }
  .pinref-picker-head { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; padding: 0.18rem 0.35rem 0.32rem; color: var(--ink-4); font-size: 0.65rem; }
  .pinref-picker-list { display: flex; flex-direction: column; gap: 0.08rem; }
  .pinref-option { width: 100%; min-width: 0; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 0.46rem; padding: 0.46rem 0.52rem; border: 0; border-radius: 7px; background: transparent; color: var(--ink-2); box-shadow: none; text-align: left; }
  .pinref-option:hover, .pinref-option.active { background: var(--accent-soft); color: var(--ink); box-shadow: none; }
  .pinref-option-icon { width: 0.72rem; height: 0.72rem; color: var(--ink-4); }
  .pinref-option-copy { min-width: 0; }
  .pinref-option-meta { display: flex; align-items: center; gap: 0.38rem; margin-bottom: 0.08rem; color: var(--ink-4); font-size: 0.62rem; }
  .pinref-option-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.76rem; }
  .pinref-option-comments { flex-shrink: 0; padding: 0.08rem 0.32rem; border-radius: 999px; background: var(--accent-soft); color: var(--accent); font-size: 0.6rem; }
  .pinref-empty { padding: 0.82rem 0.6rem; color: var(--ink-4); font-size: 0.74rem; text-align: center; }
  .composer-shortcut-ghost { position: absolute; inset: 0; z-index: 0; box-sizing: border-box; width: 100%; height: 100%; padding: 0.3rem 0.35rem 2.55rem; border: 0; border-radius: var(--radius-sm); font: inherit; font-size: 0.88rem; line-height: 1.45; white-space: pre-wrap; overflow-wrap: break-word; overflow: hidden; color: transparent; pointer-events: none; }
  .composer-shortcut-ghost[hidden] { display: none; }
  .composer-shortcut-ghost-suffix { color: color-mix(in srgb, var(--ink-4) 78%, transparent); }
  .composer-shortcut-ghost-key { display: inline-block; margin-left: 0.45em; padding: 0.02em 0.34em; border: 1px solid color-mix(in srgb, var(--ink-4) 38%, transparent); border-radius: 4px; color: color-mix(in srgb, var(--ink-4) 72%, transparent); font-size: 0.68em; line-height: 1.25; vertical-align: 0.08em; }
  .composerrow > textarea { position: relative; z-index: 1; }
  .composer textarea { flex: 0 0 auto; min-width: 0; width: 100%; resize: none; height: 4.55rem; min-height: 4.55rem; max-height: 12rem; padding: 0.3rem 0.35rem 2.55rem; border: 0; border-radius: var(--radius-sm); font: inherit; font-size: 0.88rem; line-height: 1.45; overflow-wrap: break-word; background: transparent; color: var(--ink); box-shadow: none; overflow-y: hidden; }
  .composer textarea:focus { box-shadow: none; }
  .composeractions { position: absolute; left: 0.35rem; right: 0.35rem; bottom: 0.18rem; z-index: 2; display: flex; justify-content: flex-end; align-items: center; gap: 0.32rem; min-width: 0; pointer-events: none; }
  .composeractions > * { pointer-events: auto; }
  .actiongroup { flex: 0 0 auto; display: inline-flex; align-items: stretch; gap: 0; }
  .actiongroup > button { margin: 0; border-radius: 0; }
  .actiongroup > button + button { margin-left: -1px; }
  .actiongroup > button:first-child { border-top-left-radius: var(--radius-sm); border-bottom-left-radius: var(--radius-sm); }
  .actiongroup > button:last-child { border-top-right-radius: var(--radius-sm); border-bottom-right-radius: var(--radius-sm); }
  .actiongroup .splitbtn-ico { margin-left: 0.18rem; }
  .schedulebtn { width: 1.8rem; height: 1.8rem; min-height: 1.8rem; flex: 0 0 1.8rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; border-color: var(--line-2); background: var(--surface); color: var(--ink-3); box-shadow: var(--shadow-sm); }
  .schedulebtn:hover:not(:disabled), .schedulebtn[aria-expanded="true"] { color: var(--accent); border-color: var(--accent); background: var(--accent-soft); box-shadow: none; z-index: 1; }
  .schedulebtn svg { width: 0.88rem; height: 0.88rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .schedulepop { position: fixed; z-index: 180; width: min(22.5rem, calc(100vw - 1.5rem)); box-sizing: border-box; padding: 0.55rem; border: 1px solid color-mix(in srgb, var(--menu-border) 72%, transparent); border-radius: 12px; background: color-mix(in srgb, var(--menu-background) 97%, transparent); color: var(--menu-foreground); box-shadow: var(--shadow-pop); backdrop-filter: blur(14px) saturate(1.08); }
  .schedulepop[hidden] { display: none; }
  .schedulepop-head { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin: 0.05rem 0.1rem 0.48rem; }
  .schedulepop-title { font-size: 0.75rem; font-weight: 750; color: var(--ink); }
  .schedulepop-zone { font-size: 0.64rem; color: var(--ink-4); }
  .scheduleactions { flex: 0 0 auto; display: flex; justify-content: flex-end; align-items: center; gap: 0.32rem; }
  .scheduleactions:empty { display: none; }
  .scheduleaction { flex: 0 0 auto; min-height: 1.9rem; padding: 0 0.7rem; font-size: 0.72rem; }
  .scheduleaction.primary { color: var(--vendor-action-fg); border-color: var(--vendor-action-bg); background: var(--vendor-action-bg); font-weight: 650; }
  .scheduleaction.primary:hover:not(:disabled) { border-color: var(--vendor-action-hover); background: var(--vendor-action-hover); }
  .schedulerow { display: flex; align-items: center; gap: 0.38rem; }
  .scheduledatetime { flex: 1 1 auto; min-width: 8.6rem; height: 2rem; display: inline-flex; align-items: center; gap: 0.34rem; padding-left: 0.52rem; overflow: hidden; border: 1px solid var(--line-2); border-radius: 8px; background: var(--input-bg); color: var(--ink-3); }
  .scheduledatetime:hover, .scheduledatetime:focus-within { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-ring); color: var(--ink); }
  .scheduledatetime svg { width: 0.82rem; height: 0.82rem; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .scheduledatetime input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; background: transparent; box-shadow: none; color: var(--ink); font: inherit; font-size: 0.7rem; font-variant-numeric: tabular-nums; }
  .scheduledatetime input:focus { border: 0; box-shadow: none; }
  .scheduledatetime-toggle { width: 1.7rem; height: 100%; flex-shrink: 0; padding: 0; border: 0; border-left: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; color: var(--ink-4); }
  .scheduledatetime-toggle:hover, .scheduledatetime-toggle[aria-expanded="true"] { border-color: var(--line); background: var(--button-hover); color: var(--ink); }
  .schedulepicker { margin-top: 0.48rem; padding: 0.42rem; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); }
  .schedulepicker[hidden] { display: none; }
  .schedulepicker-head { display: grid; grid-template-columns: 1.8rem minmax(0,1fr) 1.8rem; align-items: center; margin-bottom: 0.28rem; }
  .schedulepicker-nav { width: 1.8rem; height: 1.7rem; padding: 0; border-color: transparent; background: transparent; box-shadow: none; color: var(--ink-3); font-size: 1.05rem; }
  .schedulepicker-nav:hover { border-color: transparent; background: var(--button-hover); color: var(--ink); }
  .schedulepicker-month { text-align: center; color: var(--ink); font-size: 0.72rem; font-weight: 700; }
  .schedulepicker-week, .schedulepicker-days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 0.12rem; }
  .schedulepicker-week span { padding: 0.18rem 0; color: var(--ink-4); font-size: 0.58rem; font-weight: 650; text-align: center; }
  .schedulepicker-day { min-width: 0; height: 1.72rem; padding: 0; border-color: transparent; background: transparent; box-shadow: none; color: var(--ink-2); font-size: 0.68rem; }
  .schedulepicker-day:hover:not(:disabled) { border-color: transparent; background: var(--button-hover); color: var(--ink); }
  .schedulepicker-day.today { color: var(--accent); font-weight: 750; }
  .schedulepicker-day.selected { border-color: var(--accent); background: var(--accent); color: white; font-weight: 750; }
  .schedulepicker-day:disabled { opacity: 0.22; }
  .schedulepicker-empty { height: 1.72rem; }
  .scheduletime { display: flex; align-items: center; justify-content: center; gap: 0.24rem; margin-top: 0.38rem; padding-top: 0.42rem; border-top: 1px solid var(--line); }
  .scheduletime-label { margin-right: 0.25rem; color: var(--ink-4); font-size: 0.64rem; }
  .scheduletime input { width: 2.35rem; height: 1.72rem; padding: 0.18rem 0.28rem; border: 1px solid var(--line-2); border-radius: 6px; background: var(--input-bg); color: var(--ink); font: inherit; font-size: 0.72rem; font-variant-numeric: tabular-nums; text-align: center; }
  .scheduletime-sep { color: var(--ink-4); font-size: 0.72rem; }
  .scheduletime-choices { display: grid; grid-template-columns: minmax(0,1fr) 5.8rem; gap: 0.45rem; margin-top: 0.42rem; }
  .scheduletime-choice-label { display: block; margin-bottom: 0.2rem; color: var(--ink-4); font-size: 0.58rem; font-weight: 650; }
  .scheduletime-hours { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 0.1rem; }
  .scheduletime-minutes { display: grid; grid-template-columns: minmax(0,1fr); gap: 0.1rem; }
  .scheduletime-option { min-width: 0; height: 1.42rem; padding: 0; border-color: transparent; background: transparent; box-shadow: none; color: var(--ink-3); font-size: 0.61rem; font-variant-numeric: tabular-nums; }
  .scheduletime-option:hover:not(:disabled) { border-color: transparent; background: var(--button-hover); color: var(--ink); }
  .scheduletime-option.selected { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); font-weight: 750; }
  .schedulemsg { min-height: 0.9rem; margin: 0.35rem 0.1rem 0; color: var(--warning); font-size: 0.66rem; }
  /* attachments live as chips in the input's bottom-left corner; click a chip to preview it */
  .composeractions .attachtray { flex: 1 1 auto; min-width: 0; margin: 0; justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .composeractions .attachtray::-webkit-scrollbar { display: none; }
  .composeractions .attachchip { flex: 0 1 auto; }
  .composeractions .attachmsg { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .runconfig-anchor { position: relative; flex: 1 1 7rem; min-width: 0; max-width: 13rem; }
  .composer .attachpick { position: static; transform: none; width: 1.5rem; height: 1.5rem; flex-shrink: 0; color: var(--ink-3); }
  .composer .attachpick svg { width: 0.74rem; height: 0.74rem; stroke-width: 1.65; }
  .composer .attachpick:active { transform: translateY(0.5px); }
  /* goal rests as a plain railbtn with a hollow target glyph; armed/active layer the session
     vendor's tint on top and light the target's center. While a turn runs, an active goal's dot
     breathes with gpulse (the same "generating" language as thinking bubbles and pending tools);
     with no goal the toggle waits — dimmed but legible, never invisible. */
  .goal-toggle .goal-ico { width: 0.72rem; height: 0.72rem; flex-shrink: 0; }
  .goal-toggle[hidden] { display: none; }
  .goal-toggle .goal-ring { fill: none; stroke: currentColor; stroke-width: 1.5; }
  .goal-toggle .goal-dot { fill: currentColor; opacity: 0; transition: opacity 0.15s; }
  .goal-toggle[data-vendor="claude"] { --goal-fg: var(--vendor-claude-fg); --goal-bg: var(--vendor-claude-bg); --goal-border: var(--vendor-claude-border); --goal-hover-bg: var(--vendor-claude-hover-bg); --goal-hover-border: var(--vendor-claude-hover-border); }
  .goal-toggle[data-vendor="codex"] { --goal-fg: var(--vendor-codex-fg); --goal-bg: var(--vendor-codex-bg); --goal-border: var(--vendor-codex-border); --goal-hover-bg: var(--vendor-codex-hover-bg); --goal-hover-border: var(--vendor-codex-hover-border); }
  .goal-toggle.armed, .goal-toggle.armed:hover:not(:disabled), .goal-toggle.active, .goal-toggle.active:hover:not(:disabled) { color: var(--goal-fg); border-color: var(--goal-border); background: var(--goal-bg); }
  .goal-toggle.active, .goal-toggle.active:hover:not(:disabled) { border-color: var(--goal-hover-border); background: var(--goal-hover-bg); box-shadow: 0 0 0 2px color-mix(in srgb, var(--goal-border) 22%, transparent); }
  .goal-toggle.armed .goal-dot, .goal-toggle.active .goal-dot { opacity: 1; }
  .goal-toggle.pursuing .goal-dot { animation: gpulse 1.6s ease-in-out infinite; }
  @media (prefers-reduced-motion: reduce) { .goal-toggle.pursuing .goal-dot { animation: none; } }
  .goal-toggle:disabled { opacity: 0.5; cursor: default; }
  .attachtray { display: none; flex-wrap: wrap; gap: 0.35rem; }
  .attachtray.show { display: flex; }
  .attachchip { display: inline-flex; align-items: center; gap: 0.34rem; min-width: 0; max-width: 100%; padding: 0.18rem 0.45rem; border-radius: 999px; border: 1px solid var(--line-2); background: var(--surface); color: var(--ink-2); font-size: 0.72rem; box-shadow: var(--shadow-sm); }
  .attachchip[role="button"] { cursor: pointer; }
  .attachchip[role="button"]:hover { border-color: var(--accent); color: var(--ink); }
  .attachchip .kind { flex-shrink: 0; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--theme-attachment-foreground); background: var(--theme-attachment-background); border-radius: 999px; padding: 0.04rem 0.28rem; }
  .attachchip .name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .attachchip button { border: 0; background: transparent; color: var(--theme-attachment-attachchip-foreground); box-shadow: none; padding: 0; font-size: 0.88rem; line-height: 1; }
  .attachchip button:hover { color: var(--theme-attachment-hover-foreground); background: transparent; }
  .attachchip.pinrefchip { border-color: color-mix(in srgb, var(--accent) 32%, var(--line-2)); background: color-mix(in srgb, var(--accent-soft) 58%, var(--surface)); }
  .attachchip.pinrefchip .kind { color: var(--accent); background: transparent; padding: 0; font-size: 0.82rem; text-transform: none; }
  .attachchip.pinrefchip .commentmark { flex-shrink: 0; color: var(--accent); font-size: 0.62rem; }
  .msgrefs { display: flex; flex-wrap: wrap; gap: 0.28rem; margin-top: 0.48rem; padding-top: 0.42rem; border-top: 1px solid color-mix(in srgb, currentColor 16%, transparent); }
  .msgref { display: inline-flex; align-items: center; gap: 0.26rem; min-width: 0; max-width: 100%; padding: 0.14rem 0.4rem; border: 1px solid color-mix(in srgb, currentColor 24%, transparent); border-radius: var(--radius-pill); background: color-mix(in srgb, var(--surface) 46%, transparent); font-size: 0.66rem; line-height: 1.25; }
  .msgref-kind { flex-shrink: 0; color: var(--accent); font-size: 0.76rem; font-weight: 800; }
  .msgref-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .msgref-comments { flex-shrink: 0; color: var(--accent); font-size: 0.6rem; font-weight: 700; }
  .memory-citation-footer { display: flex; align-items: center; margin-top: 0.52rem; padding-top: 0.42rem; border-top: 1px solid color-mix(in srgb, currentColor 14%, transparent); }
  .memory-citation-trigger { min-height: 1.5rem; display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.12rem 0.4rem 0.12rem 0.28rem; border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--ink-4); box-shadow: none; font-size: 0.65rem; line-height: 1; font-weight: 700; }
  .memory-citation-trigger:hover, .memory-citation-trigger[aria-expanded="true"] { border: 0; background: var(--button-hover); color: var(--accent); box-shadow: none; }
  .memory-citation-trigger svg { width: 0.88rem; height: 0.88rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .memory-citation-popover { position: fixed; z-index: 128; width: min(27rem, calc(100vw - 1rem)); max-height: min(30rem, calc(100dvh - 1rem)); overflow: auto; padding: 0.58rem; border: 1px solid var(--menu-border); border-radius: 12px; background: color-mix(in srgb, var(--menu-background) 97%, transparent); color: var(--menu-foreground); box-shadow: var(--shadow-pop); backdrop-filter: blur(14px) saturate(1.08); }
  .memory-citation-popover[hidden] { display: none; }
  .memory-citation-head { display: flex; align-items: center; gap: 0.5rem; padding: 0.08rem 0.12rem 0.48rem; }
  .memory-citation-title { flex: 1; min-width: 0; font-size: 0.78rem; line-height: 1.2; font-weight: 780; }
  .memory-citation-close { width: 1.45rem; height: 1.45rem; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--ink-4); box-shadow: none; }
  .memory-citation-close:hover { border: 0; background: var(--button-hover); color: var(--ink); box-shadow: none; }
  .memory-citation-close svg { width: 0.72rem; height: 0.72rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
  .memory-citation-list { display: flex; flex-direction: column; gap: 0.34rem; }
  .memory-citation-item { min-width: 0; padding: 0.48rem 0.55rem; border: 1px solid var(--line-2); border-radius: 9px; background: var(--surface-2); }
  .memory-citation-note { color: var(--ink-2); font-size: 0.75rem; line-height: 1.42; }
  .memory-citation-source { margin-top: 0.24rem; overflow: hidden; color: var(--ink-4); font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.59rem; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
  .memory-rollouts { display: flex; flex-wrap: wrap; align-items: center; gap: 0.28rem; margin-top: 0.5rem; padding: 0.45rem 0.08rem 0.02rem; border-top: 1px solid var(--line-2); }
  .memory-rollouts-label { margin-right: 0.08rem; color: var(--ink-4); font-size: 0.6rem; font-weight: 720; }
  .memory-rollout { min-height: 1.45rem; max-width: 100%; padding: 0.16rem 0.42rem; border: 1px solid var(--line-2); border-radius: var(--radius-pill); background: transparent; color: var(--ink-3); box-shadow: none; font-family: ui-monospace, "Cascadia Mono", monospace; font-size: 0.58rem; line-height: 1; }
  .memory-rollout:hover { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); box-shadow: none; }
  @media (max-width: 600px) {
    .memory-citation-popover { left: 0.5rem !important; right: 0.5rem; bottom: 0.5rem; top: auto !important; width: auto; max-height: min(70dvh, 30rem); }
  }
  .attachmsg { display: none; font-size: 0.72rem; line-height: 1.4; color: var(--theme-attachment-message-foreground); }
  .attachmsg.show { display: block; }
  .attachmsg.err { color: var(--theme-attachment-message-attachmsg-err-foreground); }
  .msg .attachments { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-top: 0.55rem; }
  .msg .attcard { display: inline-flex; align-items: center; gap: 0.45rem; max-width: min(18rem, 100%); min-width: 0; border: 1px solid var(--theme-attachment-card-border); border-radius: 8px; padding: 0.36rem 0.48rem; color: inherit; text-decoration: none; background: var(--theme-attachment-card-background); }
  .msg.assistant .attcard { background: var(--surface); color: var(--ink-2); }
  .msg .attcard:hover { border-color: var(--theme-attachment-card-hover-border); }
  .msg .attcard .kind { flex-shrink: 0; font-size: 0.62rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; color: var(--theme-attachment-card-foreground); background: var(--theme-attachment-card-msg-attcard-kind-background); border-radius: 999px; padding: 0.08rem 0.32rem; }
  .msg .attcard .name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.76rem; }
  .msg .attcard.image { flex-direction: column; align-items: flex-start; gap: 0.32rem; width: 10.5rem; padding: 0.38rem; cursor: zoom-in; }
  .msg .attcard.image img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 6px; background: var(--theme-attachment-card-msg-attcard-image-background); }
  .msg .attcard.image .attmeta { display: flex; align-items: center; gap: 0.35rem; width: 100%; min-width: 0; }
  .imgpreview { position: fixed; inset: 0; z-index: 120; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.65rem; padding: 1.25rem; background: var(--theme-image-preview-background); }
  .imgpreview[hidden] { display: none; }
  .imgpreview-viewport { width: min(96vw, 1280px); height: min(82vh, calc(100vh - 5.5rem)); overflow: hidden; display: flex; align-items: center; justify-content: center; cursor: grab; touch-action: none; }
  .imgpreview-viewport.dragging { cursor: grabbing; }
  .imgpreview-stage { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; max-width: 100%; max-height: 100%; transform-origin: center center; will-change: transform; }
  .imgpreview-html { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; max-width: 100%; max-height: 100%; }
  .imgpreview img { display: block; max-width: min(96vw, 1280px); max-height: min(82vh, calc(100vh - 5.5rem)); width: auto; height: auto; object-fit: contain; border-radius: 8px; background: var(--theme-image-preview-imgpreview-background); box-shadow: 0 22px 60px var(--theme-image-preview-shadow); -webkit-user-drag: none; user-select: none; }

  .imgpreview-html > svg { display: block; max-width: min(96vw, 1280px); max-height: min(82vh, calc(100vh - 5.5rem)); width: auto; height: auto; object-fit: contain; border-radius: 8px; background: var(--theme-image-preview-imgpreview-html-background); box-shadow: 0 22px 60px var(--theme-image-preview-shadow); -webkit-user-drag: none; user-select: none; }
  .imgpreview img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; }
  .imgpreview img[hidden], .imgpreview-html[hidden] { display: none; }
  .imgpreview-html:empty { display: none; }
  .imgpreview-html > svg { width: 100% !important; height: 100% !important; max-width: 100% !important; max-height: 100% !important; background: var(--theme-image-preview-imgpreview-html-background); padding: 0.5rem; box-sizing: border-box; }
  .imgpreview-bar { width: min(96vw, 1280px); display: flex; align-items: center; gap: 0.75rem; color: var(--theme-image-preview-toolbar-foreground); }
  .imgpreview-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.82rem; }
  .workstats { position: fixed; inset: 0; z-index: 130; display: grid; place-items: center; padding: 1rem; background: var(--theme-statistics-overlay-background); }
  .workstats[hidden] { display: none; }
  .tagaction { position: fixed; inset: 0; z-index: 150; display: grid; place-items: center; padding: 1rem; background: var(--theme-tag-overlay-background); }
  .tagaction[hidden] { display: none; }
  .tagaction-panel { width: min(28rem, calc(100vw - 2rem)); padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); color: var(--ink); box-shadow: var(--shadow-pop); }
  .tagbar button.tagttl { padding: 0; border: 0; background: transparent; cursor: pointer; }
  .tagbar button.tagttl:hover { color: var(--ink); text-decoration: underline; }
  .settings-panel.tagmanager-panel { width: min(56rem, calc(100vw - 2rem)); padding: 0; overflow: hidden; }
  .tagmanager-panel[open] { display: flex; flex-direction: column; }
  .tagmanager-header, .tagmanager-footer { flex-shrink: 0; }
  .tagmanager-filters { display: flex; flex-direction: column; gap: 0.6rem; margin-bottom: 0.75rem; }
  .tagmanager-bind-options { display: flex; flex-wrap: wrap; gap: 0.35rem; max-height: 6rem; overflow-y: auto; padding: 2px; }
  .tagmanager-bind-options button { padding: 0.3rem 0.55rem; box-shadow: none; font-size: 0.72rem; }
  .tagmanager-bind-options button[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); color: var(--ink); }
  .tagmanager-range { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; font-size: 0.75rem; color: var(--ink-3); }
  .tagmanager-range[hidden] { display: none; }
  .tagmanager-range input { width: 5rem; min-width: 0; padding: 0.3rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--input-bg); color: var(--ink); }
  .tagmanager-range input[aria-invalid="true"] { border-color: var(--theme-error-border); }
  .tagmanager-filter-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem; color: var(--ink-3); font-size: 0.72rem; }
  .tagmanager-filter-summary select { max-width: 100%; padding: 0.3rem; background: var(--input-bg); color: var(--ink); border: 1px solid var(--line-2); border-radius: var(--radius-sm); }
  .tagmanager-filter-summary button { font-size: 0.72rem; box-shadow: none; }
  .tagmanager-header { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.25rem; border-bottom: 1px solid var(--line); }
  .tagmanager-heading { flex: 1; }
  .tagmanager-subtitle { margin-top: 0.25rem; font-size: 0.75rem; color: var(--ink-3); }
  .tagmanager-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 1rem 1.25rem 1.25rem; }
  .tagmanager-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin-bottom: 1rem; }
  .tagmanager-toolbar .searchbox { flex: 1; min-width: 10rem; height: 2.1rem; border-radius: var(--radius-sm); padding: 0.4rem 0.7rem; }
  .tagmanager-toolbar button { padding: 0.4rem 0.6rem; border-color: transparent; background: transparent; color: var(--ink-3); box-shadow: none; font-size: 0.72rem; }
  .tagmanager-toolbar button:hover { color: var(--ink); background: var(--button-hover); }
  .tagmanager-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(10rem, 100%), 1fr)); align-content: start; gap: 0.5rem; max-height: min(55vh, 30rem); min-height: 6rem; overflow-y: auto; padding: 2px; }
  button.tagmanager-row { display: flex; align-items: center; gap: 0.5rem; min-width: 0; padding: 0.55rem 0.65rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: transparent; color: var(--ink-2); box-shadow: none; font-size: 0.76rem; font-weight: 500; text-align: left; cursor: pointer; transition: background 120ms, border-color 120ms; }
  button.tagmanager-row:not([aria-pressed="true"]):hover:not(:disabled) { background: var(--button-hover); border-color: var(--line-2); box-shadow: none; }
  button.tagmanager-row[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); color: var(--ink); }
  .tagmanager-mark { display: grid; place-items: center; flex: 0 0 1rem; width: 1rem; height: 1rem; color: var(--ink-3); }
  .tagmanager-mark svg { width: 0.9rem; height: 0.9rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
  [aria-pressed="true"] > .tagmanager-mark { color: var(--accent); }
  .tagmanager-count { flex: 0 0 auto; font-size: 0.65rem; color: var(--ink-3); font-variant-numeric: tabular-nums; }
  .tagmanager-name { flex: 1; min-width: 0; overflow-wrap: anywhere; }
  .tagmanager-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; padding: 0.85rem 1.25rem; border-top: 1px solid var(--line); background: var(--floating-panel-background); }
  .tagmanager-footer .tagaction-actions { margin: 0 0 0 auto; }
  .tagmanager-help { color: var(--ink-3); font-size: 0.72rem; margin: 0; }
  .tagmanager-help strong { display: block; color: var(--ink-2); font-weight: 600; margin-bottom: 0.2rem; }
  #tagManager button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
  .tagaction-title { font-size: 0.92rem; font-weight: 800; }
  .tagaction-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.45rem; margin-top: 1rem; }
  .tagaction-actions button { font-size: 0.72rem; }
  .tagaction-clear { color: var(--ink-2); background: var(--surface-2); }
  .tagaction-delete { color: var(--theme-button-delete-foreground); border-color: var(--theme-button-delete-border); background: var(--theme-button-delete-background); }
  .tagaction-delete:hover { border-color: var(--theme-button-delete-hover-border); background: var(--theme-button-delete-hover-background); }
  .workstats-panel { width: min(1040px, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); overflow-y: auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); color: var(--ink); box-shadow: var(--shadow-pop); }
  .workstats-head { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 0.8rem; padding: 0.85rem 1rem; border-bottom: 1px solid var(--line); background: var(--surface); }
  .workstats-heading { flex: 1; min-width: 0; }
  .workstats-title { font-size: 1rem; font-weight: 800; }
  .workstats-sub { margin-top: 0.15rem; color: var(--ink-3); font-size: 0.72rem; }
  .workstats-periods { display: inline-flex; flex-wrap: wrap; padding: 0.15rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-2); }
  .workstats-period { min-width: 2.7rem; padding: 0.3rem 0.5rem; border: 0; border-radius: 4px; background: transparent; color: var(--ink-3); box-shadow: none; font-size: 0.72rem; font-weight: 700; }
  .workstats-period[aria-pressed="true"] { background: var(--primary-bg); color: var(--primary-fg); }
  .workstats-close { width: 1.9rem; height: 1.9rem; padding: 0; display: inline-flex; align-items: center; justify-content: center; color: var(--ink-3); background: transparent; box-shadow: none; }
  .workstats-close svg { width: 0.85rem; height: 0.85rem; stroke: currentColor; stroke-width: 1.8; fill: none; stroke-linecap: round; }
  .workstats-body { padding: 1rem; }
  .workstats-loading, .workstats-error, .workstats-empty { padding: 2.5rem 1rem; text-align: center; color: var(--ink-3); font-size: 0.82rem; }
  .workstats-error { color: var(--theme-statistics-error-foreground); }
  .forktree-overlay { position: fixed; inset: 0; z-index: 135; display: grid; place-items: center; padding: 1rem; background: var(--theme-fork-overlay-background); }
  .forktree-overlay[hidden] { display: none; }
  .forktree-panel { width: min(1100px, calc(100vw - 2rem)); height: min(70dvh, 640px); min-height: 22rem; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-pop); }
  .forktree-head { flex-shrink: 0; display: flex; align-items: center; gap: 0.75rem; padding: 0.7rem 0.8rem 0.7rem 1rem; border-bottom: 1px solid var(--line); }
  .forktree-heading { flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 0.55rem; }
  .forktree-title { color: var(--ink); font-size: 0.9rem; font-weight: 800; }
  .forktree-count { color: var(--ink-4); font-size: 0.68rem; font-family: ui-monospace, monospace; }
  .forktree-controls { display: flex; align-items: center; gap: 0.2rem; }
  .forktree-control { width: 1.9rem; height: 1.9rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; color: var(--ink-3); background: transparent; border-color: transparent; box-shadow: none; }
  .forktree-control:hover { color: var(--accent); background: var(--accent-soft); border-color: transparent; }
  .forktree-control svg { width: 0.9rem; height: 0.9rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .forktree-viewport { position: relative; flex: 1; min-height: 0; overflow: hidden; background: var(--surface-2); cursor: grab; touch-action: none; }
  .forktree-viewport.dragging { cursor: grabbing; }
  .forktree-pan { position: absolute; left: 0; top: 0; will-change: transform; }
  .forktree-stage { position: relative; left: 0; top: 0; transform-origin: 0 0; }
  .forktree-edges { position: absolute; inset: 0; overflow: visible; pointer-events: none; }
  .forktree-edge { fill: none; stroke: var(--line-2); stroke-width: 1.5; }
  .forktree-node { position: absolute; width: 300px; height: 112px; box-sizing: border-box; padding: 0; overflow: hidden; text-align: left; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink-2); box-shadow: var(--shadow-sm); }
  .forktree-node:hover { border-color: var(--accent); background: var(--surface); box-shadow: var(--shadow-md); }
  .forktree-node.current { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-ring), var(--shadow-md); }
  .forktree-node.missing { cursor: default; opacity: 0.64; }
  .forktree-node-content { width: var(--forktree-content-size, 100%); height: var(--forktree-content-size, 100%); box-sizing: border-box; display: flex; flex-direction: column; padding: 0.38rem 0.65rem; transform: scale(var(--forktree-content-scale, 1)); transform-origin: left top; }
  .forktree-node-head { display: flex; align-items: center; gap: 0.45rem; min-width: 0; }
  .forktree-node-dot { align-self: center; width: 0.56rem; height: 0.56rem; cursor: default; }
  .forktree-node-dot.it-status:hover { transform: none; }
  .forktree-node-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); font-size: 0.82rem; font-weight: 700; }
  .forktree-node-title.session-title.has-aux .session-title-main { max-width: 62%; }
  .forktree-node-age { flex-shrink: 0; color: var(--ink-4); font-size: 0.62rem; font-family: ui-monospace, monospace; white-space: nowrap; }
  .forktree-node-signals.it-meta { min-height: 0.85rem; margin-top: 0.18rem; font-size: 0.66rem; }
  .forktree-node .it-firstline { margin-top: 0.16rem; font-size: 0.68rem; }
  .forktree-node-foot { margin-top: auto; padding-top: 0.22rem; border-top: 1px solid var(--row-line); }
  .forktree-node-foot .it-tags { flex-wrap: nowrap; overflow: hidden; }
  .forktree-node-foot .it-tag { flex-shrink: 0; font-size: 0.61rem; padding: 0.06rem 0.34rem; }
  .forktree-node-foot .it-context { max-width: 64%; font-size: 0.62rem; }
  .forktree-node-missing { margin: auto 0; color: var(--ink-4); font-size: 0.68rem; font-family: ui-monospace, monospace; }
  .work-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
  .work-kpi { min-width: 0; padding: 0 0.8rem 0.85rem; border-right: 1px solid var(--line); }
  .work-kpi:first-child { padding-left: 0; }
  .work-kpi:last-child { border-right: 0; }
  .work-kpi-value { color: var(--ink); font-size: 1.35rem; font-weight: 800; font-variant-numeric: tabular-nums; }
  .work-kpi-label { margin-top: 0.15rem; color: var(--ink-3); font-size: 0.7rem; line-height: 1.35; }
  .work-resource { display: flex; align-items: baseline; gap: 0.55rem; flex-wrap: wrap; padding: 0.7rem 0; color: var(--ink-3); font-size: 0.74rem; }
  .work-resource strong { color: var(--ink-2); font-weight: 700; }
  .work-section { padding: 0.9rem 0; border-top: 1px solid var(--line); }
  .work-section:first-of-type { border-top: 0; }
  .work-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 0.8rem; margin-bottom: 0.65rem; }
  .work-section-title { font-size: 0.84rem; font-weight: 800; color: var(--ink); }
  .work-section-note { color: var(--ink-4); font-size: 0.68rem; text-align: right; }
  .work-distribution { display: grid; gap: 0.45rem; }
  .work-distributions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 1.5rem; }
  .work-distribution-row { display: grid; grid-template-columns: minmax(7rem, 0.45fr) minmax(8rem, 1fr) auto; align-items: center; gap: 0.65rem; color: var(--ink-2); font-size: 0.72rem; }
  .work-distribution-track { height: 0.42rem; overflow: hidden; border-radius: 999px; background: var(--surface-3); }
  .work-distribution-fill { height: 100%; min-width: 2px; border-radius: inherit; background: var(--accent); }
  .work-distribution-value { color: var(--ink-3); font-variant-numeric: tabular-nums; }
  .work-line-scroll { overflow-x: auto; padding-bottom: 0.15rem; }
  .work-line-chart { min-width: 100%; height: 9rem; display: block; overflow: visible; border-bottom: 1px solid var(--line-2); }
  .work-line-grid { stroke: var(--line-2); stroke-width: 1; }
  .work-line-path { fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
  .work-line-path.focus, .work-line-point.focus { stroke: var(--priority-3-fg); fill: var(--priority-3-fg); }
  .work-line-path.balanced, .work-line-point.balanced { stroke: var(--accent); fill: var(--accent); }
  .work-line-path.parallel, .work-line-point.parallel { stroke: var(--warning); fill: var(--warning); }
  .work-line-point { stroke: var(--surface); stroke-width: 1.5; }
  .work-line-labels { display: flex; justify-content: space-between; margin-top: 0.28rem; color: var(--ink-4); font-size: 0.62rem; white-space: nowrap; }
  .work-legend { display: flex; align-items: center; gap: 0.85rem; flex-wrap: wrap; margin-top: 0.55rem; color: var(--ink-3); font-size: 0.68rem; }
  .work-legend-item { display: inline-flex; align-items: center; gap: 0.3rem; }
  .work-swatch { width: 0.55rem; height: 0.55rem; border-radius: 2px; background: var(--status-read); }
  .work-swatch.focus { background: var(--priority-3-fg); }
  .work-swatch.balanced { background: var(--accent); }
  .work-swatch.parallel { background: var(--warning); }
  .work-table-wrap { overflow-x: auto; }
  .work-table { width: 100%; border-collapse: collapse; font-size: 0.74rem; }
  .work-table th, .work-table td { padding: 0.5rem 0.55rem; border-bottom: 1px solid var(--row-line); text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
  .work-table th { color: var(--ink-4); font-size: 0.64rem; font-weight: 700; }
  .work-table th:first-child, .work-table td:first-child { padding-left: 0; text-align: left; }
  .work-mode-name { display: inline-flex; align-items: center; gap: 0.4rem; color: var(--ink-2); font-weight: 700; }
  .work-mode-name .work-swatch { flex-shrink: 0; }
  .work-readout { margin-top: 0.65rem; color: var(--ink-3); font-size: 0.72rem; line-height: 1.5; }
  @media (min-width: 761px) and (max-height: 1100px) {
    .workstats { padding: 0.5rem; }
    .workstats-panel { max-height: calc(100dvh - 1rem); }
    .workstats-head { padding: 0.6rem 0.8rem; }
    .workstats-body { padding: 0.7rem 0.8rem; }
    .work-kpi { padding-bottom: 0.55rem; }
    .work-kpi-value { font-size: 1.15rem; }
    .work-resource { padding: 0.45rem 0; }
    .work-section { padding: 0.55rem 0; }
    .work-section-head { margin-bottom: 0.4rem; }
    .work-distribution { gap: 0.22rem; }
    .work-distribution-row { gap: 0.45rem; font-size: 0.68rem; }
    .work-distribution-track { height: 0.34rem; }
    .work-line-chart { height: 6rem; }
    .work-legend { margin-top: 0.35rem; }
    .work-table th, .work-table td { padding-top: 0.32rem; padding-bottom: 0.32rem; }
    .work-readout { margin-top: 0.4rem; line-height: 1.35; }
  }
  .foot button.send, .commentfoot button.send { height: 1.8rem; min-height: 1.8rem; background: var(--vendor-action-bg); color: var(--vendor-action-fg); border-color: var(--vendor-action-bg); padding: 0 0.78rem; font-weight: 600; box-shadow: var(--shadow-sm); }
  .foot button.send:hover:not(:disabled), .commentfoot button.send:hover:not(:disabled) { background: var(--vendor-action-hover); border-color: var(--vendor-action-hover); box-shadow: 0 4px 14px var(--vendor-action-ring); }
  .foot button.send.stopping { background: var(--theme-button-stop-background); border-color: var(--theme-button-stop-border); }

  .commentfoot button.send.stopping { background: var(--theme-button-stop-background); border-color: var(--theme-button-stop-border); }
  .foot button.send.stopping:hover { background: var(--theme-button-stop-hover-background); }

  .commentfoot button.send.stopping:hover { background: var(--theme-button-stop-hover-background); }
  .foot button.runbtn { width: 100%; height: 1.8rem; min-height: 1.8rem; max-width: 13rem; color: var(--theme-button-run-foreground); border-color: var(--theme-button-run-border); background: var(--surface); padding: 0 0.58rem; font-size: 0.72rem; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .foot button.runbtn:hover:not(:disabled) { background: var(--surface-2); border-color: var(--theme-button-run-hover-border); }
  .foot button.runbtn.dirty { color: var(--theme-button-run-dirty-foreground); border-color: var(--theme-button-run-dirty-border); background: var(--theme-button-run-dirty-background); }
  .foot button.runbtn.dirty:hover:not(:disabled) { color: var(--theme-button-run-hoverdirty-foreground); border-color: var(--theme-button-run-hoverdirty-border); background: var(--theme-button-run-hoverdirty-background); box-shadow: 0 0 0 2px var(--theme-button-run-hoverdirty-shadow); }
  .foot button.runbtn:disabled { color: var(--theme-button-run-disabled-foreground); background: var(--surface-2); cursor: default; }
  /* messages typed mid-turn: queued client-side, pinned above the composer
   *  (Codex-style), each editable/removable, and sendable on demand. */
  #queue { flex: 0 0 auto; z-index: 21; display: flex; flex-direction: column; gap: 0.3rem; max-height: 30vh; overflow-y: auto; padding: 0.4rem 1rem 0; }
  #queue:empty { display: none; }
  .qitem { display: flex; align-items: center; gap: 0.45rem; background: var(--theme-queue-background); border: 1px solid var(--theme-queue-border); border-radius: 8px; padding: 0.3rem 0.4rem 0.3rem 0.55rem; }
  .qitem .qtag { font-size: 0.62rem; color: var(--theme-queue-tag-foreground); background: var(--theme-queue-tag-background); border-radius: 3px; padding: 0.05rem 0.32rem; flex-shrink: 0; }
  .qitem .qtext { flex: 1; min-width: 0; font-size: 0.82rem; color: var(--theme-queue-foreground); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .qitem button { flex-shrink: 0; }
  .qitem .qdispatch { width: 3.4rem; box-sizing: border-box; flex-shrink: 0; font-size: 0.72rem; text-align: center; }
  .qitem .qwaiting { color: var(--theme-queue-waiting-foreground); font-weight: 650; }
  .qitem.scheduled { background: color-mix(in srgb, var(--surface) 78%, var(--theme-queue-scheduled-background)); }
  .qitem.blocked { border-color: var(--warning); background: var(--warning-soft); }
  .qitem .qtime { flex-shrink: 0; color: var(--ink-4); font-size: 0.68rem; font-variant-numeric: tabular-nums; }
  .qitem button.qsend { padding: 0.1rem 0.45rem; color: var(--vendor-action-fg); background: var(--vendor-action-bg); border-color: var(--vendor-action-bg); font-weight: 600; }
  .qitem button.qsend:hover:not(:disabled) { background: var(--vendor-action-hover); border-color: var(--vendor-action-hover); }
  .qaction { width: 1.7rem; height: 1.7rem; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0; border-color: transparent; background: transparent; box-shadow: none; color: var(--theme-queue-action-foreground); }
  .qaction:hover { color: var(--theme-queue-action-hover-foreground); border-color: transparent; background: var(--theme-queue-action-hover-background); box-shadow: none; }
  .qaction svg { width: 0.82rem; height: 0.82rem; stroke: currentColor; stroke-width: 1.9; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  button.qdel { color: var(--theme-queue-delete-foreground); }
  button.qdel:hover { color: var(--theme-queue-delete-hover-foreground); background: var(--theme-queue-delete-hover-background); }
  .qitem.editing .qeditbox { width: 100%; min-width: 0; display: flex; align-items: center; gap: 0.45rem; }
  .qitem.editing .qeditta { flex: 1; min-width: 0; height: 1.7rem; box-sizing: border-box; font: inherit; font-size: 0.82rem; line-height: 1.2; padding: 0.22rem 0.45rem; border: 1px solid var(--accent); border-radius: var(--radius-sm); background: var(--input-bg); color: var(--ink); box-shadow: 0 0 0 2px var(--accent-ring); }
  .foot button.splitbtn { height: 1.8rem; min-height: 1.8rem; padding: 0 0.68rem; }
  .foot button.splitbtn[data-vendor] { color: var(--vendor-action-bg); border-color: color-mix(in srgb, var(--vendor-action-bg) 46%, var(--line)); background: color-mix(in srgb, var(--vendor-action-bg) 9%, var(--surface)); }
  .foot button.splitbtn[data-vendor]:hover:not(:disabled) { color: var(--vendor-action-bg); border-color: var(--vendor-action-bg); background: color-mix(in srgb, var(--vendor-action-bg) 16%, var(--surface)); box-shadow: 0 0 0 2px var(--vendor-action-ring); }
  .qitem button.qfork[data-vendor] { color: var(--vendor-action-bg); }
  .qitem button.qfork[data-vendor]:hover:not(:disabled) { color: var(--vendor-action-hover); background: color-mix(in srgb, var(--vendor-action-bg) 14%, transparent); }
  .splitbtn-ico { width: 0.82rem; height: 0.82rem; margin-left: 0.22rem; stroke: currentColor; stroke-width: 1.9; fill: none; stroke-linecap: round; stroke-linejoin: round; vertical-align: -0.15em; }
  .forkpop { position: absolute; right: 1.1rem; bottom: calc(100% + 0.55rem); z-index: 55; width: min(390px, calc(100vw - 2rem)); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-pop); padding: 0.75rem; display: flex; flex-direction: column; gap: 0.55rem; }
  .forkpop[hidden] { display: none; }
  .forkpop::after { content: ""; position: absolute; right: 2.1rem; bottom: -0.42rem; width: 0.75rem; height: 0.75rem; background: var(--surface); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transform: rotate(45deg); }
  .forkhead { display: flex; align-items: baseline; justify-content: space-between; gap: 0.5rem; }
  .forkttl { font-size: 0.72rem; font-weight: 700; color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.05em; }
  .forkhint { font-size: 0.7rem; color: var(--ink-4); text-align: right; line-height: 1.35; }
  .forkpop select { font-size: 0.8rem; padding: 0.4rem 0.55rem; border: 1px solid var(--line-2); border-radius: var(--radius-sm); width: 100%; background-color: var(--surface); color: var(--ink-2); }
  .forkpop .newrow { align-items: flex-end; }
  .forkpop .pickgrp.vendor { flex: 1.15; }
  .forkmsg { min-height: 1rem; font-size: 0.72rem; color: var(--ink-4); line-height: 1.35; }
  .forkmsg.err { color: var(--theme-fork-error-foreground); }
  .forkactions { display: flex; gap: 0.45rem; justify-content: flex-end; }
  .forkprimary { color: var(--primary-fg); background: var(--primary-bg); border-color: var(--primary-bg); font-weight: 600; }
  .forkprimary:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
  .runpop { right: 0; width: min(330px, calc(100vw - 2rem)); }
  .runpop::after { right: 2.2rem; }
  .runpop .selectmenu { top: auto; bottom: calc(100% + 4px); }
  .pill { font-size: 0.66rem; padding: 0.05rem 0.4rem; border-radius: 3px; background: var(--theme-badge-background); color: var(--theme-badge-foreground); }
  html[data-theme="dark"] .viewtab.on { color: var(--theme-tab-active-active-foreground); background: var(--theme-tab-active-active-background); border-color: var(--theme-tab-active-active-border); }

  html[data-theme="dark"] .viewtabgroup.on { color: var(--theme-tab-group-active-foreground); background: var(--theme-tab-group-active-background); border-color: var(--theme-tab-group-active-border); }
  html[data-theme="dark"] .viewtabgroup.on { box-shadow: 0 0 0 1px var(--theme-tab-group-active-shadow); }
  html[data-theme="dark"] .viewtabgroup.on .viewtab.on { background: transparent; box-shadow: none; }
  html[data-theme="dark"] .viewtabgroup.on .viewtabx { border-left-color: var(--theme-tab-close-active-border); }
  html[data-theme="dark"] .viewtabgroup.on .viewtabx:hover { color: var(--theme-tab-close-hoveractive-foreground); background: var(--theme-tab-close-hoveractive-background); }
  html[data-theme="dark"] .prilabel:hover { filter: brightness(1.08); box-shadow: none; }
  html[data-theme="dark"] .prilabel.l1 { color: var(--priority-1-fg); background: var(--priority-1-bg); }
  html[data-theme="dark"] .prilabel.l2 { color: var(--priority-2-fg); background: var(--priority-2-bg); }
  html[data-theme="dark"] .prilabel.l3 { color: var(--priority-3-fg); background: var(--priority-3-bg); }
  html[data-theme="dark"] .prilabel.l4 { color: var(--priority-4-fg); background: var(--priority-4-bg); }
  html[data-theme="dark"] .prilabel.l5 { color: var(--priority-5-fg); background: var(--priority-5-bg); }
  html[data-theme="dark"] .b-eta { color: var(--theme-eta-foreground); background: var(--theme-eta-background); }
  html[data-theme="dark"] .state { background: var(--theme-state-default-background); color: var(--theme-state-default-foreground); border-color: var(--theme-state-default-border); box-shadow: inset 0 0 0 1px var(--theme-state-default-shadow); }
  html[data-theme="dark"] .state.continue_ready { background: var(--theme-state-continue-ready-background); color: var(--theme-state-continue-ready-foreground); border-color: var(--theme-state-continue-ready-border); box-shadow: inset 0 0 0 1px var(--theme-state-continue-ready-shadow); }
  html[data-theme="dark"] .state.needs_decision { background: var(--theme-state-needs-decision-background); color: var(--theme-state-needs-decision-foreground); border-color: var(--theme-state-needs-decision-border); box-shadow: inset 0 0 0 1px var(--theme-state-needs-decision-shadow); }
  html[data-theme="dark"] .state.needs_input { background: var(--theme-state-needs-input-background); color: var(--theme-state-needs-input-foreground); border-color: var(--theme-state-needs-input-border); box-shadow: inset 0 0 0 1px var(--theme-state-needs-input-shadow); }
  html[data-theme="dark"] .state.blocked { background: var(--theme-state-blocked-background); color: var(--theme-state-blocked-foreground); border-color: var(--theme-state-blocked-border); box-shadow: inset 0 0 0 1px var(--theme-state-blocked-shadow); }
  html[data-theme="dark"] .state.needs_review { background: var(--theme-state-needs-review-background); color: var(--theme-state-needs-review-foreground); border-color: var(--theme-state-needs-review-border); box-shadow: inset 0 0 0 1px var(--theme-state-needs-review-shadow); }
  html[data-theme="dark"] .state.followup_suggested { background: var(--theme-state-followup-suggested-background); color: var(--theme-state-followup-suggested-foreground); border-color: var(--theme-state-followup-suggested-border); box-shadow: inset 0 0 0 1px var(--theme-state-followup-suggested-shadow); }
  html[data-theme="dark"] .state.done { background: var(--theme-state-done-done-background); color: var(--theme-state-done-done-foreground); border-color: var(--theme-state-done-done-border); box-shadow: inset 0 0 0 1px var(--theme-state-done-done-shadow); }
  html[data-theme="dark"] .bulkarchive { color: var(--theme-archive-foreground); background: transparent; box-shadow: none; }
  html[data-theme="dark"] .bulkarchive:hover:not(:disabled) { color: var(--theme-archive-hover-foreground); background: transparent; box-shadow: none; }
  html[data-theme="dark"] .bulkarchive:disabled { color: var(--ink-4); background: transparent; box-shadow: none; }
  html[data-theme="dark"] .it-context .vtag.claude { color: var(--vendor-claude-fg); }
  html[data-theme="dark"] .it-context .vtag.codex { color: var(--vendor-codex-fg); }
  html[data-theme="dark"] .it-context .vtag.cursor { color: var(--vendor-cursor-fg); }
  html[data-theme="dark"] .it-context .vtag.antigravity { color: var(--vendor-antigravity-fg); }
  html[data-theme="dark"] .it-context .vtag.copilot { color: var(--vendor-copilot-fg); }
  html[data-theme="dark"] .it-context .vtag.opencode { color: var(--vendor-opencode-fg); }
  html[data-theme="dark"] .it-context .ptag { color: var(--project-fg-dark, var(--theme-project-foreground)); }
  html[data-theme="dark"] .it-live-total { color: var(--status-generating); }
  html[data-theme="dark"] .it-live.generated .it-live-total { color: var(--status-unread); }
  html[data-theme="dark"] .it-live.stopped .it-live-total { color: var(--theme-status-stopped-foreground); }
  html[data-theme="dark"] .it-live.failed .it-live-total { color: var(--theme-status-failed-foreground); }
  html[data-theme="dark"] .it-live-quiet.warm { color: var(--theme-status-quiet-warm-foreground); }
  html[data-theme="dark"] .it-live-quiet.hot { color: var(--theme-status-quiet-hot-foreground); }
  html[data-theme="dark"] .it-queue { color: var(--theme-session-queue-foreground); background: var(--theme-session-queue-background); }
  html[data-theme="dark"] .it-queue.parked { color: var(--theme-session-queue-parked-foreground); background: var(--theme-session-queue-parked-background); }
  html[data-theme="dark"] .tipmeta { background: var(--theme-tooltip-metadata-background); border-color: var(--theme-tooltip-metadata-border); }
  html[data-theme="dark"] .tipmeta-v { color: var(--theme-tooltip-value-foreground); }
  html[data-theme="dark"] .tipmeta .vtag.claude { color: var(--vendor-claude-fg); background: transparent; border-color: transparent; }
  html[data-theme="dark"] .tipmeta .vtag.codex { color: var(--vendor-codex-fg); background: transparent; border-color: transparent; }
  html[data-theme="dark"] .tipmeta .vtag.cursor { color: var(--vendor-cursor-fg); background: transparent; border-color: transparent; }
  html[data-theme="dark"] .tipmeta .vtag.antigravity { color: var(--vendor-antigravity-fg); background: transparent; border-color: transparent; }
  html[data-theme="dark"] .tipmeta .vtag.copilot { color: var(--vendor-copilot-fg); background: transparent; border-color: transparent; }
  html[data-theme="dark"] .tipmeta .vtag.opencode { color: var(--vendor-opencode-fg); background: transparent; border-color: transparent; }
  html[data-theme="dark"] .tipmeta .ptag { color: var(--project-fg-dark, var(--theme-project-foreground)); }
  html[data-theme="dark"] .msg.error .bubble { background: var(--chat-error-background); color: var(--theme-error-foreground); border-color: var(--theme-error-border); }

  html[data-theme="dark"] .newbox .nmsg .provider-error-card { background: var(--chat-error-background); color: var(--theme-error-foreground); border-color: var(--theme-error-border); }

  html[data-theme="dark"] .toolc .tool-out.err { background: var(--theme-tool-error-background); color: var(--theme-tool-error-foreground); border-color: var(--theme-tool-error-border); }
  html[data-theme="dark"] .provider-error-command code { border-color: var(--theme-error-command-border); background: var(--theme-error-command-background); }
  html[data-theme="dark"] .provider-error-button { border-color: var(--theme-error-button-border); background: var(--theme-error-button-background); color: var(--theme-error-button-foreground); }
  html[data-theme="dark"] .provider-error-button:hover:not(:disabled) { border-color: var(--theme-error-button-hover-border); background: var(--theme-error-button-hover-background); color: var(--theme-error-button-hover-foreground); }
  html[data-theme="dark"] .msg.user .bubble .diagram-error { color: var(--user-error-foreground); }

  html[data-theme="dark"] .msg.user .bubble .filepath.badpath { color: var(--user-error-foreground); }
  html[data-theme="dark"] .toolc[data-tool-error="true"] { border-color: var(--theme-tool-toolc-border); box-shadow: none; }
  html[data-theme="dark"] .dline.add { background: var(--theme-diff-added-background); color: var(--theme-diff-added-foreground); }
  html[data-theme="dark"] .dline.del { background: var(--theme-diff-removed-background); color: var(--theme-diff-removed-foreground); }
  html[data-theme="dark"] .dline.ctx { color: var(--ink-3); }
  html[data-theme="dark"] .qitem { background: var(--theme-queue-background); border-color: var(--theme-queue-border); }
  html[data-theme="dark"] .qitem .qtag { color: var(--theme-queue-tag-foreground); background: var(--theme-queue-tag-background); }
  html[data-theme="dark"] .qitem .qtext { color: var(--theme-queue-foreground); }
  html[data-theme="dark"] .qitem .qwaiting { color: var(--theme-queue-waiting-foreground); }
  #queue .qitem.todo { background: var(--todo-bg); border-color: var(--todo-border); }
  #queue .qitem.todo .qtag { color: var(--todo-fg); background: transparent; }
  #queue .qitem.todo .qtext { color: var(--ink-2); }
  html[data-theme="dark"] .qaction { color: var(--theme-queue-action-foreground); }
  html[data-theme="dark"] .qaction:hover { color: var(--theme-queue-action-hover-foreground); background: var(--theme-queue-action-hover-background); }
  html[data-theme="dark"] button.qdel { color: var(--theme-queue-delete-foreground); }
  html[data-theme="dark"] .foot button.runbtn { color: var(--theme-button-run-foreground); border-color: var(--theme-button-run-border); background: var(--theme-button-run-background); }
  html[data-theme="dark"] .foot button.runbtn:hover:not(:disabled) { background: var(--theme-button-run-hover-background); border-color: var(--theme-button-run-hover-border); }
  html[data-theme="dark"] .foot button.runbtn.dirty { color: var(--theme-button-run-dirty-foreground); border-color: var(--theme-button-run-dirty-border); background: var(--theme-button-run-dirty-background); }
  html[data-theme="dark"] .foot button.runbtn.dirty:hover:not(:disabled) { color: var(--theme-button-run-hoverdirty-foreground); border-color: var(--theme-button-run-hoverdirty-border); background: var(--theme-button-run-hoverdirty-background); box-shadow: 0 0 0 2px var(--theme-button-run-hoverdirty-shadow); }
  html[data-theme="dark"] .latestpin-arrow { color: var(--theme-chat-pinned-arrow-foreground); }
  html[data-theme="dark"] .pinrole { color: var(--theme-chat-pinned-role-foreground); border-color: transparent; background: transparent; }
  html[data-theme="dark"] .pintext { color: var(--theme-chat-pinned-foreground); }
  html[data-theme="dark"] .msg-pin.on .pin-body { fill: var(--theme-chat-pinned-icon-active-foreground); }
  html[data-theme="dark"] .gtagdel:hover { background: var(--theme-tag-delete-hover-background); color: var(--theme-tag-delete-hover-foreground); border-color: var(--theme-tag-delete-hover-border); }

  html[data-theme="dark"] .it-tag > button:hover { background: var(--theme-tag-hover-background); color: var(--theme-tag-hover-foreground); border-color: var(--theme-tag-hover-border); }

  html[data-theme="dark"] button.qdel:hover { background: var(--theme-queue-delete-hover-background); color: var(--theme-queue-delete-hover-foreground); border-color: var(--theme-queue-delete-hover-border); }
  html[data-theme="dark"] .gtag:not(.auto):not(.on) .gtagbtn { color: var(--theme-tag-label-gtag-auto-on-gtagbtn-active-foreground); }

  html[data-theme="dark"] .it-tag:not(.auto) { color: var(--theme-tag-it-tag-auto-foreground); }

  html[data-theme="dark"] .tagadd-compact { color: var(--theme-tag-add-foreground); }

  html[data-theme="dark"] .it-tagadd { color: var(--theme-tag-add-foreground); }
  html[data-theme="dark"] .tagadd-compact:hover { color: var(--theme-tag-add-hover-foreground); background: var(--theme-tag-add-hover-background); border-color: transparent; }

  html[data-theme="dark"] .it-tagadd:hover { color: var(--theme-tag-add-hover-foreground); background: var(--theme-tag-add-hover-background); border-color: transparent; }
  /* Mobile: one page at a time — the session list, or the chat. Selecting a
     session slides to chat (body.show-chat); the back button returns to the list. */
  @media (max-width: 760px) {
    .resizer, .session-panel, .session-panel-resizer, .panel-toggle { display: none !important; }
    .side { width: 100% !important; }          /* beat the resizer's inline width */
    .main { background: var(--chat-background); width: 100%; display: none; }       /* chat hidden until a session opens */
    body.show-chat .side { display: none; }
    body.show-chat .main { background: var(--chat-background); display: flex; }
    .chat-tabs { display: none !important; }
    .newrow { flex-direction: column; align-items: stretch; }
    .newrow .pickgrp.effort, .newrow .pickgrp.speed { max-width: none; }
    .forkpop { right: 1rem; left: 1rem; width: auto; }
    .runpop { right: 0; left: auto; width: min(330px, calc(100vw - 2rem)); }
    .forkpop::after { right: 5.6rem; }
    .runpop::after { right: 9.6rem; }
    .head { padding: 0.38rem 0.95rem 0.6rem; flex-direction: column; align-items: stretch; gap: 0.15rem; }
    .backbtn { width: 1.75rem; height: 1.5rem; align-self: flex-start; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 4px; background: transparent; box-shadow: none; }
    .backbtn:hover { color: var(--accent); background: transparent; box-shadow: none; }
    .backbtn svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
    .head .s .sub-line { max-height: 3rem; }
    .msg .bubble { max-width: 88%; }
    .msg.assistant .bubble { max-width: calc(100% - var(--msg-float-actions-space)); }
    .turnfold-card { max-width: 88%; min-width: min(18rem, 88%); }
    .workstats { padding: 0.5rem; }
    .workstats-panel { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); }
    .workstats-head { align-items: flex-start; flex-wrap: wrap; }
    .workstats-periods { order: 3; width: 100%; }
    .workstats-period { flex: 1 0 calc(20% - 0.3rem); }
    .forktree-overlay { padding: 0.5rem; }
    .forktree-panel { width: calc(100vw - 1rem); height: calc(100dvh - 1rem); min-height: 0; }
    .forktree-head { padding-left: 0.75rem; }
    .forktree-heading { display: block; }
    .forktree-count { display: block; margin-top: 0.12rem; }
    .work-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .work-kpi { padding: 0.65rem; border-bottom: 1px solid var(--line); }
    .work-kpi:nth-child(2) { border-right: 0; }
    .work-kpi:nth-child(3), .work-kpi:nth-child(4) { border-bottom: 0; }
    .work-kpi:first-child { padding-left: 0.65rem; }
    .work-distribution-row { grid-template-columns: minmax(6rem, 0.6fr) minmax(5rem, 1fr) auto; }
    .work-distributions { grid-template-columns: 1fr; gap: 0.8rem; }
  }
  input, textarea, select { color: var(--input-foreground); }
  input::placeholder, textarea::placeholder { color: var(--input-placeholder-foreground); }
  .msg.assistant .bubble { color: var(--assistant-fg); }
  .msg.assistant .bubble pre, .msg.assistant .bubble code { color: var(--code-foreground); }
  ::selection { background: var(--selection-background); color: var(--selection-foreground); }