:root {
  font: 14px/1.64 "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;
  color: #1a1c1f;
  background: #f5f5e1;
  --bg: #fff;
  --side: #fcfcf5;
  --rail: #f5f5e1;
  --inspector: #fafafa;
  --panel: #fff;
  --line: #eceee8;
  --muted: #9a9e97;
  --hover: #eff0e9;
  --accent: #303432;
  --chrome-height: 44px;
  --activity-rail-width: 52px;
  --chat-sidebar-width: 288px;
  --inspector-width: 344px;
  --conversation-header-height: 52px;
  --conversation-width: 736px;
}
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; overflow: hidden; }
body { margin: 0; }
button, input, select, textarea, a { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { border: 0; background: none; color: inherit; cursor: pointer; }
button:disabled { cursor: default; }
a { color: inherit; text-decoration: none; }
svg { display: block; flex-shrink: 0; }
.icon-definitions { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.ui-icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
button:focus-visible, a:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid #afb7ad; outline-offset: 2px;
}
[hidden] { display: none !important; }
.muted { color: var(--muted); }

/* CSS dimensions use the screenshot's measured 1.5 device-scale calibration. */
.app-chrome {
  height: var(--chrome-height); min-height: var(--chrome-height);
  display: flex; align-items: center; gap: 14px; padding: 0 10px;
  color: #92978b;
  background: linear-gradient(100deg, #f5f5e3 0%, #faf1ef 54%, #f5f6e2 100%);
  -webkit-app-region: drag; app-region: drag;
  user-select: none;
}
.chrome-nav, .chrome-menu, .chrome-window-controls, .chrome-right-controls {
  display: flex; align-items: center; gap: 4px; height: 100%;
}
.app-chrome button, .app-chrome a, .app-chrome input {
  -webkit-app-region: no-drag; app-region: no-drag;
}
.chrome-nav button { width: 26px; height: 28px; padding: 5px; border-radius: 6px; }
.chrome-nav button svg { width: 16px; height: 16px; }
.chrome-nav button:hover, .chrome-menu button:hover { background: #00000006; }
.chrome-nav button:disabled { opacity: .4; }
.chrome-menu { gap: 6px; }
.chrome-menu button { padding: 3px 9px; border-radius: 5px; font-size: 13px; }
.chrome-window-controls, .chrome-right-controls {
  margin-left: auto; flex: 0 0 138px; justify-content: flex-end; gap: 0;
}
.chrome-window-controls button, .chrome-right-controls button {
  width: 46px; height: 100%; display: grid; place-items: center; color: #3e423d;
}
.chrome-window-controls button:hover, .chrome-right-controls button:hover { background: #00000008; }
body.legacy-desktop { --chrome-height: 0px; }
.legacy-desktop .app-chrome { display: none; }

.shell, .codex-shell {
  display: grid;
  grid-template-columns: var(--activity-rail-width) var(--chat-sidebar-width) minmax(0, 1fr) var(--inspector-width);
  height: calc(100dvh - var(--chrome-height)); width: 100%; overflow: hidden;
  background: var(--rail);
}
.activity-rail {
  grid-column: 1; min-width: 0; min-height: 0; position: relative;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 8px 6px 9px; background: var(--rail); color: #949a8d;
}
.rail-primary, .rail-top, .rail-group, .rail-bottom { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 100%; }
.rail-bottom { margin-top: auto; }
.rail-button, .activity-rail > .icon, .activity-rail .rail-top > button, .activity-rail .rail-group > button {
  width: 36px; height: 36px; min-height: 36px; padding: 9px;
  display: grid; place-items: center; border-radius: 10px; color: inherit; position: relative;
}
.rail-button svg, .activity-rail > .icon svg, .rail-top > button svg, .rail-group > button svg { width: 19px; height: 19px; }
.rail-button:hover, .activity-rail .icon:hover, .rail-top > button:hover, .rail-group > button:hover { background: #e9ebd9; }
.rail-button.active, .rail-button[aria-current="page"], .rail-button[aria-pressed="true"] { color: #171b17; background: #e8ebd7; }
.rail-button.active:first-child .ui-icon { fill: currentColor; }
.activity-rail hr, .rail-divider { width: 28px; height: 1px; min-height: 1px; margin: 7px 0; border: 0; background: #e1e4cf; }
.rail-profile { margin-top: auto; display: grid; place-items: center; width: 26px; height: 26px; padding: 0; border-radius: 50%; background: #f4c4d9; color: #8f446b; font-size: 11px; }
.rail-avatar, .activity-rail .avatar { width: 25px; height: 25px; border-radius: 50%; font-size: 10px; margin: 4px auto; }

#sidebar, .chat-sidebar {
  grid-column: 2; min-width: 0; min-height: 0; width: var(--chat-sidebar-width);
  display: flex; flex-direction: column; padding: 0 8px 9px;
  background: var(--side); color: #3b3d3e; border-right: 1px solid #e5e4d0; border-radius: 13px 0 0 0;
  overflow: hidden;
}
.sidebar-header { height: 52px; min-height: 52px; display: flex; align-items: center; gap: 8px; padding: 0 8px; }
.brand { display: inline-flex; align-items: center; gap: 6px; min-width: 0; font-size: 18px; font-weight: 600; line-height: 24px; letter-spacing: -.35px; color: #454b46; }
.brand .mark, .brand small { display: none; }
.brand > svg, .brand .chevron { width: 12px; height: 12px; color: #91968c; font-size: 12px; font-weight: 400; }
.sidebar-header-tools, .sidebar-header .sidebar-actions, .sidebar-header .sidebar-controls { display: flex; gap: 3px; margin-left: auto; }
.sidebar-header .icon { width: 27px; height: 27px; font-size: 15px; color: #989e93; }
.sidebar-header .brand + .icon { margin-left: auto; }
.sidebar-shortcuts, .sidebar-projects { flex-shrink: 0; }
.sidebar-projects { padding: 5px 0 12px; }
.nav { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 32px; padding: 5px 9px; text-align: left; border-radius: 8px; font-size: 14px; line-height: 20px; min-width: 0; }
.nav:hover, .profile:hover, .history button:hover { background: var(--hover); }
.nav svg, .nav .nav-icon, .nav > span:first-child:not(.nav-label) { width: 16px; height: 16px; flex: 0 0 16px; color: #858e80; display: inline-grid; place-items: center; font-size: 17px; }
.nav .nav-label { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.nav kbd { margin-left: auto; color: #a8ada3; font-size: 10px; line-height: 1.4; white-space: nowrap; }
.nav.new { font-weight: 400; }
.sidebar-projects .nav { min-height: 31px; }
.project-empty { display: block; width: 100%; padding: 6px 9px 6px 34px; text-align: left; color: #929a8a; font-size: 12px; line-height: 20px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.project-empty:hover { background: var(--hover); border-radius: 7px; }
.sidebar-projects .project-title { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sidebar-projects .project-children { padding: 1px 0 5px 32px; }
.sidebar-projects .project-children button { display: block; width: 100%; min-height: 30px; text-align: left; color: #71786e; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.section-label { display: flex; align-items: center; justify-content: space-between; min-height: 33px; padding: 8px 9px 5px; color: #969d90; font-size: 13px; flex-shrink: 0; }
.section-label button { padding: 0 3px; font-size: 15px; line-height: 18px; }
.history { flex: 1; min-height: 0; overflow: auto; padding: 0 2px 0 0; }
.history button { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 30px; margin: 0 0 1px; padding: 4px 9px; border-radius: 8px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: left; font-size: 14px; line-height: 22px; }
.history button .history-title { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; flex: 1; }
.history .active { background: #eff0e9; }
.history p { padding: 0 9px; font-size: 12px; color: #a0a69b; }
.sidebar-bottom { border-top: 1px solid var(--line); margin-top: 8px; padding: 7px 0 0; flex-shrink: 0; }
.sidebar-bottom .nav { min-height: 30px; font-size: 12px; }
.profile { display: flex; align-items: center; gap: 8px; width: 100%; min-width: 0; text-align: left; padding: 7px 8px; border-radius: 8px; font-size: 12px; }
.profile small { display: block; color: var(--muted); font-size: 10px; }
.profile #account { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile > .ui-icon { width: 12px; height: 12px; margin-left: auto; }
.avatar { display: grid; place-items: center; background: #e5e8dc; color: #64705e; width: 27px; height: 27px; border-radius: 50%; font-size: 11px; flex-shrink: 0; }

.codex-shell > main, .conversation-pane {
  grid-column: 3; min-width: 0; min-height: 0; position: relative;
  display: flex; flex-direction: column; background: var(--bg); overflow: hidden;
}
.conversation-pane > header, .conversation-header {
  height: var(--conversation-header-height); min-height: var(--conversation-header-height);
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  border-bottom: 1px solid #f0f1ed; padding: 0 18px; flex-shrink: 0;
}
.conversation-pane > header > div, .conversation-header > div { display: flex; align-items: center; gap: 12px; min-width: 0; }
.conversation-heading, .conversation-header .header-leading { flex: 1; min-width: 0; }
.conversation-heading > svg, .conversation-header .header-leading > svg { width: 17px; height: 17px; color: #646e62; }
.chat-title, #chatTitle { margin: 0; min-width: 0; font-size: 14px; line-height: 22px; font-weight: 600; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.header-right { margin-left: auto; flex-shrink: 0; }
.mobile-sidebar-toggle { display: none !important; }
.icon { width: 28px; height: 28px; padding: 5px; display: inline-grid; place-items: center; border-radius: 7px; font-size: 17px; color: #92998c; }
.icon svg { width: 17px; height: 17px; }
.icon:hover { background: var(--hover); }
.quiet { color: var(--muted); font-size: 11px; }
.workspace-label { padding: 5px 18px; color: var(--muted); font-size: 10px; border-bottom: 1px solid var(--line); }
#messages { overflow: auto; flex: 1; min-height: 0; padding: 10px max(30px, calc((100% - var(--conversation-width))/2)) 16px; }
#messages:empty { display: none; }
.message { padding: 14px 0; line-height: 23px; overflow-wrap: anywhere; font-size: 14px; }
.message.user { margin: 10px 0 10px auto; max-width: 90%; width: fit-content; padding: 11px 15px; background: #f5f6f2; border-radius: 16px; white-space: pre-wrap; }
.message .author { margin-bottom: 8px; color: #737c6e; font-size: 11px; }
.message .content { white-space: pre-wrap; }
.message pre { padding: 14px; overflow: auto; white-space: pre; background: #f7f8f5; border: 1px solid var(--line); border-radius: 9px; font: 12px/1.8 Consolas, monospace; }
.message p { margin: 8px 0; }
.message .meta { margin-top: 10px; color: #a2a79d; font-size: 10px; }
.message .message-actions { display: flex; gap: 12px; margin-top: 6px; color: #959d8e; font-size: 11px; }
#welcome { flex: 1; min-height: 0; width: min(var(--conversation-width), calc(100% - 60px)); margin: 0 auto; padding: 24px 0; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: #a3aa9d; }
#welcome .eyebrow { display: none; }
#welcome h1, #welcome h2 { margin: 0 0 7px; font-size: 17px; font-weight: 500; letter-spacing: 0; color: #747e6d; }
#welcome .empty-icon { width: 23px; height: 23px; margin-bottom: 13px; color: #aeb5a6; stroke-width: 1.4; }
.empty-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 16px; }
.empty-actions button { padding: 6px 10px; border: 1px solid #e9ece4; border-radius: 7px; color: #7e8a74; font-size: 11px; }
.empty-actions button:hover { background: var(--hover); }
#welcome > p { margin: 0; font-size: 12px; }
.suggestions { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin-top: 17px; }
.suggestions button { padding: 6px 9px; border: 0; background: transparent; border-radius: 6px; text-align: left; color: #8a9484; }
.suggestions button:hover { background: #f5f6f1; }
.suggestions span, .suggestions small { display: none; }
.suggestions b { font-size: 11px; font-weight: 400; }
.composer-wrap { width: min(var(--conversation-width), calc(100% - 60px)); margin: auto auto 16px; position: relative; flex-shrink: 0; z-index: 2; }
.connection { min-height: 18px; padding: 0 2px 3px; font-size: 10px; line-height: 15px; color: #a2a99c; }
#composer { border: 1px solid #ededed; background: var(--panel); padding: 12px 13px 10px; border-radius: 20px; box-shadow: 0 2px 6px #00000003, 0 8px 32px #00000003; }
textarea { display: block; width: 100%; resize: none; background: none; border: 0; color: inherit; font-size: 14px; line-height: 23px; min-height: 64px; max-height: 420px; }
textarea::placeholder { color: #a4aa9f; }
#prompt { padding: 0; line-height: 20px; max-height: min(420px, 48dvh); outline: none; }
.composer-tools, .composer-tools > div { display: flex; align-items: center; gap: 8px; min-width: 0; }
.composer-tools { justify-content: space-between; padding-top: 8px; gap: 12px; }
.composer-tools .icon { width: 25px; height: 25px; color: #3d4638; }
.composer-tools .icon svg { width: 17px; height: 17px; }
.model-bolt { color: #a2aa9a; font-size: 18px; line-height: 18px; }
.model-button { display: inline-flex; align-items: center; gap: 5px; padding: 2px 0; color: #5b6356; min-width: 0; font-size: 12px; font-weight: 400; line-height: 22px; }
#modelName { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 240px; }
.chevron { font-size: 10px; color: #9ea697; }
.model-button .effort-level, .model-effort { color: #a082d1; }
.tag, #scopeTag { font-size: 11px; color: #d16b36; max-width: 175px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 0; background: none; padding: 0; }
.composer-access, .permission-button, .access-button { display: inline-flex; align-items: center; gap: 5px; color: #d16b36; font-size: 12px; padding: 0; }
.composer-access svg, .permission-button svg, .access-button svg { width: 15px; height: 15px; }
.composer-left-tools { flex-shrink: 0; }
.composer-right-tools { justify-content: flex-end; }
.composer-access { white-space: nowrap; }
.composer-note-separator { color: #c1c5bc; }
.tool, .effort-label { color: #929c89; font-size: 11px; }
.tool[aria-pressed="true"] { color: #4e5b46; background: #f0f3ea; border-radius: 5px; }
.effort-label select { border: 0; background: transparent; color: inherit; max-width: 100px; font-size: inherit; }
.send { width: 28px; height: 28px; flex: 0 0 28px; padding: 0; border-radius: 50%; display: inline-grid; place-items: center; background: #090a09; color: white; font-size: 19px; }
.send svg { width: 18px; height: 18px; }
.send:disabled { opacity: .33; }
.composer-note { position: absolute; top: 100%; left: 0; right: 0; padding-top: 3px; text-align: center; font-size: 9px; line-height: 10px; color: #aab0a4; }
.conversation-pane > footer { display: none; }
.conversation-footer button { padding: 0; font-size: inherit; }
.conversation-footer a:hover, .conversation-footer button:hover { color: #596950; }
#attachment { color: #8a9481; font-size: 10px; margin-bottom: 8px; max-height: 154px; overflow: auto; }
#attachment img, .attachment-preview { display: block; width: 120px; height: 120px; object-fit: contain; object-position: center; border: 1px solid #eceee3; border-radius: 6px; background: white; }
#attachment button { float: right; }

.inspector-pane { grid-column: 4; width: var(--inspector-width); min-width: 0; min-height: 0; display: flex; flex-direction: column; border-left: 1px solid #ededed; background: var(--inspector); border-radius: 0 13px 0 0; overflow: hidden; }
.inspector-tabbar { height: 52px; min-height: 52px; display: flex; align-items: center; gap: 7px; padding: 7px 8px; background: #fff; border-bottom: 1px solid #f1f2ef; }
.inspector-tab { display: flex; align-items: center; gap: 7px; flex: 1; min-width: 0; height: 32px; padding: 0 10px; border: 1px solid #e8eae5; border-radius: 10px; box-shadow: 0 1px 2px #00000003; font-size: 12px; color: #686f63; }
.inspector-tab > svg { width: 14px; height: 14px; }
.inspector-tab > span:first-of-type, .inspector-tab .tab-title { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; flex: 1; }
.inspector-tab .tab-close { margin-left: auto; padding-left: 7px; color: #9ba393; font-size: 17px; line-height: 20px; }
.inspector-tab .icon { width: 18px; height: 20px; padding: 1px; color: #a4aaa0; }
.inspector-tabbar > .icon { flex: 0 0 26px; color: #a3aa9c; }
.inspector-toolbar { height: 48px; min-height: 48px; padding: 8px; display: flex; align-items: center; gap: 5px; background: #fff; border-bottom: 1px solid #eeefec; }
.inspector-toolbar .icon { width: 25px; height: 28px; padding: 5px; }
.inspector-toolbar .browser-nav, .inspector-toolbar .browser-navigation { display: flex; align-items: center; height: 30px; border: 1px solid #eceee8; border-radius: 18px; padding: 1px 4px; }
.inspector-toolbar .browser-nav .icon, .inspector-toolbar .browser-navigation .icon { width: 24px; height: 26px; }
#inspectorNavigation { flex: 1; min-width: 0; margin: 0; }
.browser-nav { flex-shrink: 0; }
.browser-nav .icon:disabled { color: #c7cdc0; }
#inspectorAddress, .inspector-address { min-width: 0; width: 100%; flex: 1; height: 30px; border: 1px solid #e9ece5; border-radius: 18px; background: #fff; color: #737c6a; padding: 4px 10px; font-size: 12px; }
#inspectorAddress::placeholder { color: #afb7a6; }
.inspector-content { flex: 1; min-height: 0; overflow: auto; padding: 32px 20px 20px; background: var(--inspector); }
.inspector-section { margin: 0; }
.inspector-section + .inspector-section { margin-top: 38px; }
.inspector-section > h2, .inspector-section > h3, .inspector-section-title { margin: 0 0 14px; color: #333d2d; font-size: 13px; font-weight: 600; line-height: 20px; display: flex; align-items: center; justify-content: space-between; }
.tool-list { display: flex; flex-direction: column; gap: 4px; }
.tool-card { width: 100%; min-height: 40px; padding: 8px 12px; display: flex; align-items: center; gap: 9px; text-align: left; border-radius: 10px; background: #fff; color: #66735a; font-size: 13px; line-height: 20px; }
.tool-card:hover { background: #f1f3ed; }
.tool-card > svg, .tool-card .tool-icon { width: 17px; height: 17px; flex: 0 0 17px; color: #8f9986; }
.tool-card > span:not(.tool-icon) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tool-card kbd { margin-left: auto; color: #a3ac99; background: #f1f3ed; border-radius: 6px; padding: 0 5px; white-space: nowrap; font: 10px/18px "Segoe UI", sans-serif; }
.tool-card .chevron, .tool-card > .ui-icon:last-child, .tool-card > .icon:last-child { margin-left: auto; }
.inspector-recommendations, .recommended-tools { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.recommended-tools > button, .recommended-tools > a, .recommendation-card { min-width: 0; padding: 12px 3px; text-align: center; border-radius: 9px; font-size: 12px; }
.recommended-tools > button:hover, .recommended-tools > a:hover, .recommendation-card:hover { background: #eff2e9; }
.recommended-icon, .recommendation-card > svg, .recommendation-card > .recommendation-icon { width: 32px; height: 32px; display: grid; place-items: center; margin: 4px auto 16px; color: #6d7c5c; }
.recommended-tools > button > span:last-child, .recommended-tools > a > span:last-child, .recommendation-card > span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.recommended-icon { width: 38px; height: 38px; border-radius: 9px; }
.recommended-icon > .ui-icon { width: 28px; height: 28px; }
.terminal-icon { color: #6c785e; background: #e7ebdf; }
.asi-icon { color: #73814d; background: #f0f2d8; font-size: 18px; font-weight: 500; }
#recentTools { display: flex; flex-direction: column; gap: 6px; }
#recentTools > p { margin: 0; font-size: 12px; }
.recent-tool { display: flex; align-items: center; gap: 10px; min-width: 0; width: 100%; padding: 12px; border: 1px solid #eff1eb; border-radius: 12px; text-align: left; font-size: 12px; color: #7d8973; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.recent-tool:hover { background: #f1f3ed; }
.inspector-recent, .recent-list { display: flex; flex-direction: column; gap: 6px; }
.inspector-recent .empty-state, .inspector-content .empty-state { padding: 8px 0; margin: 0; color: #a3ac99; font-size: 12px; }
.recent-row { display: flex; align-items: center; gap: 10px; border: 1px solid #f0f2ec; border-radius: 12px; padding: 12px; font-size: 11px; }
.recent-row small { display: block; color: #a0a997; }

/* The side conversation uses the tool host, without sharing the main timeline. */
.inspector-chat-mode .inspector-content, .inspector-content.inspector-chat-mode { display: flex; flex-direction: column; padding: 16px 12px 12px; overflow: hidden; }
.side-chat { display: flex; flex-direction: column; width: 100%; height: 100%; min-height: 0; color: #515b49; font-size: 12px; }
.side-chat > h3 { margin: 0 0 8px; color: #404b38; font-size: 13px; line-height: 20px; font-weight: 600; flex-shrink: 0; }
.side-chat > .muted { margin: 6px 0 10px; font-size: 10px; line-height: 16px; flex-shrink: 0; }
.side-chat-scope { flex-shrink: 0; color: #859278; font-size: 10px; line-height: 16px; overflow-wrap: anywhere; }
.side-chat-messages { flex: 1; min-height: 0; overflow: auto; padding: 2px 3px 10px; overscroll-behavior: contain; }
.side-chat-message { padding: 12px 0; border-top: 1px solid #e9ede3; }
.side-chat-message:first-child { border-top: 0; }
.side-chat-message > strong { display: block; margin-bottom: 5px; font-size: 11px; font-weight: 500; color: #7e8c70; }
.side-chat-message .content { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 20px; }
.side-chat-message .meta { margin: 7px 0 0; font-size: 10px; line-height: 16px; color: #99a28e; overflow-wrap: anywhere; }
.side-chat-message.user .content { color: #768568; }
.side-chat-form { flex-shrink: 0; padding: 9px; border: 1px solid #e6ebe0; border-radius: 13px; background: var(--panel); }
.side-chat-prompt { min-height: 64px; max-height: 240px; padding: 0; font-size: 12px; line-height: 20px; }
.side-chat-tools { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 7px; }
.side-chat-tools button { font-size: 11px; }
.side-chat-tools .primary { padding: 5px 11px; border-radius: 8px; }
.side-chat-status { min-height: 17px; margin: 5px 2px 0; font-size: 10px; line-height: 16px; color: #919d85; flex-shrink: 0; overflow-wrap: anywhere; }

/* Functional dialogs, popovers and project tools retain their original hooks. */
dialog { width: min(560px, 94vw); max-height: 85dvh; padding: 22px; border: 1px solid var(--line); border-radius: 14px; color: inherit; background: var(--panel); box-shadow: 0 20px 80px #0002; overflow: auto; }
dialog::backdrop { background: #0004; backdrop-filter: blur(2px); }
.dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.dialog-head h2 { margin: 0; font-size: 18px; line-height: 26px; font-weight: 600; }
.dialog-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.model-list { max-height: 50dvh; overflow: auto; }
.model-row { display: flex; justify-content: space-between; gap: 12px; width: 100%; text-align: left; padding: 10px; border-radius: 7px; }
.model-row:hover, .model-row.selected { background: var(--hover); }
.model-row small { display: block; color: var(--muted); font-size: 10px; }
.model-row small.model-promo { color: #e8590c; font-weight: 600; }
.field { width: 100%; padding: 10px; margin: 9px 0; border: 1px solid var(--line); border-radius: 7px; background: var(--bg); color: inherit; }
.primary { display: inline-block; padding: 9px 16px; border-radius: 8px; background: #2b3027; color: #fff; text-align: center; }
.primary:disabled { opacity: .4; }
.shell-popover, .menu-popover, .rail-menu, .composer-popover, .floating-menu { position: fixed; z-index: 20; min-width: 210px; max-height: calc(100dvh - 16px); overflow: auto; max-width: min(340px, calc(100vw - 24px)); padding: 6px; border: 1px solid var(--line); border-radius: 11px; background: var(--panel); box-shadow: 0 8px 35px #00000014; color: #4d5945; }
.shell-popover button, .menu-popover button, .menu-popover a, .rail-menu button, .rail-menu a, .composer-popover button, .composer-popover a, .floating-menu button, .floating-menu a { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 10px; text-align: left; border-radius: 6px; font-size: 12px; }
.shell-popover button:hover, .menu-popover button:hover, .menu-popover a:hover, .rail-menu button:hover, .rail-menu a:hover, .composer-popover button:hover, .composer-popover a:hover, .floating-menu button:hover, .floating-menu a:hover { background: var(--hover); }
.shell-popover > p { margin: 8px 10px; max-width: 260px; font-size: 11px; line-height: 18px; }
.shell-popover button .ui-icon { width: 16px; height: 16px; }
.shell-popover button:disabled { color: var(--muted); }
.shell-popover button:disabled:hover { background: none; }
.shell-popover button small { margin-left: auto; font-size: 10px; color: var(--muted); }
.rail-menu { left: 45px; top: 205px; }
.composer-popover { left: 0; bottom: calc(100% + 7px); }
#toast { position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%); z-index: 40; max-width: 90vw; padding: 10px 18px; border-radius: 9px; color: #fff; background: #30362a; font-size: 12px; box-shadow: 0 4px 18px #0002; }
.history, #messages, .inspector-content, .model-list { scrollbar-width: thin; scrollbar-color: #e3e7db transparent; }
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-thumb { background: #e3e7db; border-radius: 5px; }
::-webkit-scrollbar-track { background: transparent; }

body.sidebar-hidden { --chat-sidebar-width: 0px; }
.sidebar-hidden #sidebar { display: none; }
body.inspector-wide { --inspector-width: min(520px, 44vw); }
body.inspector-hidden, body.inspector-closed { --inspector-width: 0px; }
.inspector-hidden .inspector-pane, .inspector-closed .inspector-pane { display: none; }
.dark { color: #dedfd9; --bg: #20221e; --side: #1c2019; --rail: #252b1d; --inspector: #20231e; --panel: #272b23; --line: #373d30; --muted: #8c9582; --hover: #30382a; --accent: #dedfd9; }
.dark .chat-sidebar { color: #c6ccbe; border-color: var(--line); }
.dark .app-chrome { background: #252a1e; color: #929d84; }
.dark .brand, .dark .model-button, .dark .chat-title { color: #d3dac9; }
.dark .rail-button.active, .dark .rail-button[aria-current="page"], .dark .history .active { color: #e2e9d7; background: #35422a; }
.dark .inspector-tabbar, .dark .inspector-toolbar, .dark .inspector-tab, .dark #inspectorAddress, .dark .tool-card { background: var(--panel); color: #c5cfbb; border-color: var(--line); }
.dark .inspector-section > h2, .dark .inspector-section > h3 { color: #d1dbc6; }
.dark .tool-card kbd, .dark .message.user, .dark .message pre { background: var(--hover); color: #b4bea9; }
.dark #composer { border-color: #383f30; }
.dark .send, .dark .primary { color: #22281d; background: #d7dece; }
.dark .avatar { background: #3a482e; color: #c5d6b6; }
.dark .shell-popover { color: #c3cdb7; }
.dark .recommended-icon, .dark .recent-tool:hover { background: #30392a; }
.dark .side-chat, .dark .side-chat > h3 { color: #c8d2bd; }
.dark .side-chat-form, .dark .side-chat-message { border-color: var(--line); }
.dark .empty-actions button { border-color: var(--line); }

@media (max-width: 1400px) { :root { --chat-sidebar-width: 260px; --inspector-width: 310px; } .composer-wrap { width: min(var(--conversation-width), calc(100% - 42px)); } #messages { padding-inline: max(21px, calc((100% - var(--conversation-width))/2)); } }
@media (max-width: 1120px) {
  :root { --inspector-width: 0px; --chat-sidebar-width: 250px; }
  body.inspector-wide { --inspector-width: 0px; }
  .inspector-pane { display: none; }
  body:not(.inspector-hidden):not(.inspector-closed) .inspector-pane { display: flex; position: fixed; right: 0; top: var(--chrome-height); bottom: 0; z-index: 9; width: min(344px, calc(100vw - 48px)); box-shadow: -8px 0 30px #0000000c; }
  body.inspector-wide:not(.inspector-hidden) .inspector-pane { width: min(520px, calc(100vw - 48px)); }
  .composer-wrap { width: calc(100% - 40px); }
}
@media (max-width: 760px) { :root { --activity-rail-width: 48px; --chat-sidebar-width: 0px; --conversation-header-height: 48px; } #sidebar { display: none; } .mobile-open #sidebar { display: flex; position: fixed; top: var(--chrome-height); bottom: 0; left: 48px; width: min(288px, calc(100vw - 48px)); z-index: 10; border-radius: 10px 0 0; box-shadow: 10px 0 35px #00000018; } .activity-rail { padding-inline: 4px; } .chrome-menu { gap: 0; } .chrome-menu button { padding-inline: 6px; font-size: 12px; } .chrome-window-controls, .chrome-right-controls { flex-basis: 110px; } .chrome-window-controls button, .chrome-right-controls button { width: 36px; } .conversation-pane > header, .conversation-header { padding-inline: 12px; } .conversation-header .quiet { display: none; } .chat-title, #chatTitle { font-size: 13px; } .composer-wrap { width: calc(100% - 24px); margin-bottom: 12px; } #messages { padding-inline: 15px; } #welcome { width: calc(100% - 28px); } #modelName { max-width: 150px; } #scopeTag { max-width: 120px; font-size: 10px; } .composer-tools { gap: 6px; } .composer-tools > div { gap: 5px; } .model-button { font-size: 11px; } main > footer, .composer-note { font-size: 8px; } .mobile-sidebar-toggle { display: inline-grid !important; } .conversation-folder { display: none; } }
@media (max-width: 480px) { .chrome-menu button { padding-inline: 5px; } .chrome-nav { gap: 0; } .chrome-nav button { width: 22px; } .chrome-window-controls, .chrome-right-controls { flex-basis: 68px; } .chrome-window-controls button, .chrome-right-controls button { width: 28px; } .composer-tools { flex-wrap: wrap; row-gap: 9px; } .composer-right-tools { width: 100%; } .composer-tools .model-button { max-width: 145px; } .composer-access span { max-width: 48px; overflow: hidden; text-overflow: ellipsis; } .effort-label select { max-width: 48px; } .composer-tools > div { gap: 3px; } #modelName { max-width: 110px; } #scopeTag { max-width: 98px; } .composer-tools .icon { width: 22px; padding-inline: 3px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }

:root .collaboration label{display:block;font-size:12px;margin:12px 0}.collaboration textarea{border:1px solid var(--line);border-radius:9px;padding:10px;margin-top:7px}.collab-role{display:grid;grid-template-columns:80px 1fr 42px;gap:6px;margin:9px 0}.collaboration select{background:var(--bg);color:inherit;border:1px solid var(--line);border-radius:7px;padding:8px;max-width:100%}.collab-role select{min-width:0;width:100%}.collab-role button{font-size:10px;color:var(--muted)}.collab-disclosure{font-size:11px;padding:12px;background:var(--side);border-radius:9px;color:var(--muted)}.collab-result{padding:14px 0;border-top:1px solid var(--line)}.collab-result h3{font-size:12px;color:var(--accent)}.collab-result pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.8;background:var(--side);padding:12px;border-radius:8px}.collaboration .meta{font-size:11px;color:var(--muted)}.collaboration .dialog-links button:not(.primary){font-size:11px;padding:8px;border:1px solid var(--line);border-radius:8px}.collaboration .dialog-links button:disabled{opacity:.4}
.creator-ide{position:absolute;inset:var(--conversation-header-height) 0 0;z-index:2;background:var(--bg);display:flex;flex-direction:column;border-top:1px solid var(--line)}.ide-top{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line)}.ide-top strong{flex:1;font-size:14px}.ide-top button{font-size:11px}.ide-status{font-size:11px;margin:0;padding:9px 18px;color:var(--muted);border-bottom:1px solid var(--line)}.ide-layout{display:grid;grid-template-columns:170px minmax(200px,1fr) 330px;flex:1;min-height:0}.creator-ide .ide-tree{display:block;width:auto;min-width:0;margin:0;padding:10px 7px;overflow:auto;background:var(--side);border-right:1px solid var(--line)}.ide-tree button{display:block;text-align:left;width:100%;padding:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px;line-height:1.6;border-radius:5px}.ide-tree button:hover{background:var(--hover)}.ide-editor-pane{display:flex;flex-direction:column;min-width:0;min-height:0}.ide-file-title{font-size:10px;padding:10px 12px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.ide-editor{font:12px/1.8 Consolas,monospace;flex:1;padding:15px;max-height:none;white-space:pre;overflow:auto;min-height:150px;tab-size:2}.ide-actions{display:flex;flex-wrap:wrap;gap:7px;border-top:1px solid var(--line);padding:8px}.ide-actions button{font-size:10px;padding:5px;border:1px solid var(--line);border-radius:6px}.ide-tasks{overflow:auto;padding:12px;border-left:1px solid var(--line);font-size:11px}.ide-tasks h3{font-size:12px;color:var(--accent);margin:12px 0 6px}.ide-tasks button{margin:4px 4px 4px 0;font-size:11px;border:1px solid var(--line);padding:7px;border-radius:7px}.ide-tasks button:disabled{opacity:.4}.ide-tasks .field{font-size:11px;min-height:65px}.ide-tasks .muted{font-size:10px}.ide-tasks pre{font:10px/1.7 Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;background:var(--side);padding:10px;border-radius:8px;max-height:280px;overflow:auto}.ide-consent{display:block;margin:10px 0}.ide-tasks .muted button{font-size:10px}.orchestrator{font-size:12px}.orchestrator textarea{min-height:100px;border:1px solid var(--line);padding:10px;border-radius:9px}.orchestrator pre{white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.8 Consolas,monospace;background:var(--side);padding:12px;border-radius:8px}@media(max-width:1200px){.ide-layout{grid-template-columns:155px minmax(200px,1fr);grid-template-rows:minmax(230px,1fr) minmax(210px,.7fr)}.ide-tasks{grid-column:1/3;border-left:0;border-top:1px solid var(--line)}.ide-tasks pre{max-height:150px}}@media(max-width:650px){.creator-ide{inset:var(--conversation-header-height) 0 0}.ide-layout{grid-template-columns:110px minmax(160px,1fr)}.ide-top{gap:5px;padding:10px}.ide-top .primary{padding:7px}}
#scopeTag{max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.personal-collaboration .collab-role{grid-template-columns:minmax(80px,1fr) minmax(100px,1.4fr);border:1px solid var(--line);border-radius:10px;padding:12px}.personal-collaboration .collab-role p,.personal-collaboration .collab-role input,.personal-collaboration select[aria-label="个人角色模型"],.personal-collaboration select[aria-label="个人汇总模型"]{grid-column:1/-1}.personal-collaboration .collab-role button{padding:7px;border:1px solid var(--line);border-radius:6px}.ide-actions input{flex:1;min-width:100px;padding:5px;border:1px solid var(--line);background:var(--bg);color:inherit;border-radius:6px;font-size:11px}@media(max-width:900px){header #scopeTag{display:inline-block;font-size:9px;max-width:150px}}@media(max-width:650px){.conversation-header>div{gap:7px}header .header-right .quiet{display:none}header .model-button{max-width:calc(100vw - 260px);font-size:12px}#modelName{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}header #scopeTag{max-width:112px}}
.creator-billing label{display:block;font-size:12px;margin:12px 0}.creator-billing .primary{margin-top:10px}.creator-billing p{font-size:12px}.creator-billing input[type=checkbox]{margin-right:7px}.creator-billing button:disabled{opacity:.4;cursor:default}footer button{padding:0;font-size:inherit}footer button:hover{color:var(--accent)}
/* Wish Machine: mode segmented control and expected all-star routing */
.wish-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px;margin:4px 0 12px;background:var(--side);border:1px solid var(--line);border-radius:8px}
.wish-mode{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;min-height:52px;padding:8px 10px;border-radius:6px;text-align:left;color:var(--muted);letter-spacing:0}
.wish-mode strong{font-size:12px;font-weight:600;color:inherit}
.wish-mode span{font-size:11px;line-height:1.4;overflow-wrap:anywhere}
.wish-mode:hover:not(:disabled){background:var(--hover)}
.wish-mode.active{background:var(--panel);color:var(--accent);box-shadow:0 0 0 1px var(--line),0 1px 3px #0000001a}
.wish-mode.active strong::before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:#1f9d6b;vertical-align:middle}
.wish-mode:disabled{opacity:.55;cursor:default}
.wish-mode:focus-visible{outline:2px solid #2f6fd6;outline-offset:1px}
.wish-routing{margin:0 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:8px}
.wish-routing p{margin:0 0 6px}
.wish-routing p:last-child{margin:6px 0 0}
.wish-routing ul{list-style:none;margin:0;padding:0}
.wish-routing li{display:grid;grid-template-columns:112px minmax(0,1fr);gap:10px;padding:6px 0;border-top:1px solid var(--line);font-size:12px;line-height:1.5}
.wish-routing li:first-child{border-top:0}
.wish-routing li strong{font-weight:600;color:var(--accent)}
.wish-routing li span{overflow-wrap:anywhere}
@media(max-width:520px){.wish-routing li{grid-template-columns:1fr;gap:2px}.wish-mode{min-height:48px;padding:7px 8px}}

/* 0.6.2 composer wish mode */
.wish-chip{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 9px;border-radius:12px;border:1px solid transparent;color:#5b6455;font-size:12px;white-space:nowrap;letter-spacing:0}
.wish-chip:hover{background:var(--hover)}
.wish-chip-mark{color:#d16b36;font-size:13px;line-height:1}
.wish-chip[aria-pressed="true"]{background:#eaf4ee;border-color:#cfe5d8;color:#17643f;font-weight:600}
.wish-chip[aria-pressed="true"] .wish-chip-mark{color:#17643f}
.wish-chip:focus-visible{outline:2px solid #2f6fd6;outline-offset:1px}
#composer.wish-on #effortTrigger,#composer.wish-on .effort-trigger,#composer.wish-on .model-options{display:none}
.wish-on .model-bolt{color:#d16b36}
.wish-quote{display:inline-flex;align-items:center;height:22px;padding:0 7px;border-radius:11px;background:var(--side);border:1px solid var(--line);color:#4c5546;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
.wish-quote.blocked{color:#b4382c;border-color:#efc9c3;background:#fdf2f0}
.wish-on .send{background:#17643f}
.wish-on .send:hover:not(:disabled){background:#125535}
.history button.wish-row .wish-row-mark{flex:0 0 auto;color:#d16b36;font-size:12px}
.wish-trace{margin:0 0 12px;border-left:2px solid var(--line);padding:0 0 0 12px;font-size:12px;color:#5f6859}
.wish-trace>summary{display:flex;align-items:center;gap:7px;min-height:24px;cursor:pointer;list-style:none;color:#4c5546}
.wish-trace>summary::-webkit-details-marker{display:none}
.wish-trace>summary::after{content:"";width:6px;height:6px;margin-left:2px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);transition:transform .15s}
.wish-trace[open]>summary::after{transform:rotate(45deg)}
.wish-trace-mark{color:#d16b36}
.wish-trace.running .wish-trace-mark{animation:wish-spin 2.4s linear infinite;display:inline-block}
.wish-trace-title{font-weight:600}
.wish-trace-tag{padding:1px 6px;border-radius:9px;background:var(--side);border:1px solid var(--line);font-size:10px;color:var(--muted)}
.wish-trace-body{padding:6px 0 2px}
.wish-trace-plan{margin:0 0 6px;color:#3d4638;overflow-wrap:anywhere}
.wish-steps{list-style:none;margin:0;padding:0}
.wish-step{padding:5px 0}
.wish-step-head{position:relative;display:flex;align-items:baseline;gap:2px 7px;flex-wrap:wrap;min-width:0;padding-left:14px}
.wish-step-title{color:#3d4638;overflow-wrap:anywhere}
.wish-step-model{color:var(--muted);font-size:11px;overflow-wrap:anywhere}
.wish-dot{position:absolute;left:0;top:6px;width:7px;height:7px;border-radius:50%;background:#c9cec3}
.wish-step.run .wish-dot{background:#e0a33a;animation:wish-pulse 1.2s ease-in-out infinite}
.wish-step.done .wish-dot{background:#1f9d6b}
.wish-step.fail .wish-dot{background:#c8473a}
.wish-step-out{margin:4px 0 0 14px}
.wish-step-out>summary{cursor:pointer;color:var(--muted);font-size:11px}
.wish-step-out pre{max-height:260px;overflow:auto;margin:6px 0 0;padding:8px 10px;border-radius:8px;background:var(--side);white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}
.wish-step-links,.wish-images{display:flex;flex-wrap:wrap;gap:4px 10px;margin:4px 0 0 14px;font-size:11px}
.wish-images{margin:6px 0 0}
.wish-step-links a,.wish-images a{color:#2f6fd6;overflow-wrap:anywhere}
.wish-review{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;padding:5px 0;color:#3d4638}
.wish-routing-list{list-style:none;margin:0 0 10px;padding:0}
.wish-routing-list li{display:grid;grid-template-columns:112px minmax(0,1fr);gap:10px;padding:6px 0;border-top:1px solid var(--line);font-size:12px;line-height:1.5}
.wish-routing-list li:first-child{border-top:0}
.wish-routing-list li strong{font-weight:600}
.wish-routing-list li span{overflow-wrap:anywhere;color:var(--muted)}
.wish-consent-quote{font-weight:600;font-variant-numeric:tabular-nums}
@keyframes wish-pulse{50%{opacity:.35}}
@keyframes wish-spin{to{transform:rotate(360deg)}}
.dark .wish-chip{color:#b8c2ad}
.dark .wish-chip[aria-pressed="true"]{background:#22392b;border-color:#2f5240;color:#9fdcb9}
.dark .wish-chip[aria-pressed="true"] .wish-chip-mark{color:#9fdcb9}
.dark .wish-quote{color:#c3cdb7}
.dark .wish-quote.blocked{color:#f0a49a;background:#3a2522;border-color:#5a332e}
.dark .wish-on .send{background:#7fd0a3;color:#14261b}
.dark .wish-trace,.dark .wish-trace>summary{color:#a9b39e}
.dark .wish-trace-plan,.dark .wish-step-title,.dark .wish-review{color:#cfd8c4}
.dark .wish-step-links a,.dark .wish-images a{color:#8db7f5}
@media(max-width:520px){.wish-routing-list li{grid-template-columns:1fr;gap:2px}}
@media(max-width:480px){.wish-chip{padding:0 7px}.wish-chip-label{max-width:56px;overflow:hidden;text-overflow:ellipsis}.composer-access span{display:none}.wish-quote{padding:0 5px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.wish-trace.running .wish-trace-mark,.wish-step.run .wish-dot{animation:none}}
.dark .nav,.dark .history button,.dark .composer-tools .icon,.dark .profile{color:#c6ccbe}
.dark .history p{color:#8c9582}

/* 0.7.0 龍華樹 Code composer mode */
.code-chip-mark{font:600 11px/1 Consolas,ui-monospace,monospace;color:#3b57b8;letter-spacing:-.5px}
.code-chip[aria-pressed="true"]{background:#eef1fb;border-color:#d3dbf4;color:#2b3f8f;font-weight:600}
.code-chip[aria-pressed="true"] .code-chip-mark{color:#2b3f8f}
.code-project-chip{display:inline-flex;align-items:center;gap:4px;height:24px;max-width:150px;padding:0 8px;border-radius:12px;border:1px dashed #cdd3c7;color:#4a5444;font-size:12px;white-space:nowrap}
.code-project-chip svg{width:14px;height:14px;flex:0 0 auto}
.code-project-chip span{overflow:hidden;text-overflow:ellipsis}
.code-project-chip:hover{background:var(--hover)}
#composer.code-on #effortTrigger,#composer.code-on .effort-trigger,#composer.code-on .model-options,#composer.code-on [data-action="attach"]{display:none}
#composer.code-on .model-bolt{color:#3b57b8}
.code-on .send{background:#2b3f8f}
.code-on .send:hover:not(:disabled){background:#22337a}
.code-symbol{font:600 11px/1 Consolas,ui-monospace,monospace;color:#3b57b8}
.sidebar-projects .project-current{display:flex;align-items:center;gap:8px;width:100%;min-width:0}
.sidebar-projects .project-current.active{background:var(--hover)}
.project-code-mark{flex:0 0 auto;font:600 10px/1 Consolas,ui-monospace,monospace;color:#3b57b8}
.message.code{padding-top:6px}
.code-trace{display:flex;flex-direction:column;gap:2px;font-size:13px;color:#3d4638}
.code-head{display:flex;align-items:center;gap:8px;margin:0 0 6px;min-width:0}
.code-mark{font:600 11px/1 Consolas,ui-monospace,monospace;color:#3b57b8;padding:3px 5px;border-radius:5px;background:#eef1fb}
.code-trace.running .code-mark{animation:code-pulse 1.4s ease-in-out infinite}
@keyframes code-pulse{50%{opacity:.45}}
.code-title{font-weight:600;font-size:12px}
.code-sub{color:var(--muted);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.code-text{padding:4px 0;line-height:23px}
.code-text .content{white-space:pre-wrap}
.code-think{margin:2px 0;color:#7b8374;font-size:12px}
.code-think>summary{cursor:pointer;list-style:none;color:#8d9488}
.code-think>summary::-webkit-details-marker{display:none}
.code-think pre{white-space:pre-wrap;max-height:240px;overflow:auto;margin:4px 0 6px;padding:8px 10px;border-left:2px solid var(--line);font:12px/1.6 inherit;background:none;border-radius:0}
.code-step{border-radius:8px;margin:1px 0}
.code-step>summary{display:flex;align-items:center;gap:8px;min-height:28px;padding:2px 8px;border-radius:8px;cursor:pointer;list-style:none;min-width:0}
.code-step>summary::-webkit-details-marker{display:none}
.code-step>summary:hover{background:var(--hover)}
.code-verb{flex:0 0 auto;color:#6c7566;font-size:12px}
.code-target{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:12px/1.5 Consolas,ui-monospace,monospace;color:#2f372b;background:none;padding:0}
.code-stat{flex:0 0 auto;font:11px/1 Consolas,ui-monospace,monospace;color:#6c7566}
.code-stat.good{color:#1f7a4d}.code-stat.bad{color:#b4382c}
.code-state{flex:0 0 auto;font-size:11px;color:#a06a12}
.code-step.err .code-state,.code-step.denied .code-state{color:#b4382c}
.code-step.confirm>summary{background:#fff7e8;box-shadow:inset 0 0 0 1px #f0dcb4}
.code-step.run .code-verb::before,.code-step.confirm .code-verb::before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:#d39b2a;vertical-align:middle;animation:code-pulse 1.2s ease-in-out infinite}
.code-step.ok .code-verb::before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:#2f9d68;vertical-align:middle}
.code-step.err .code-verb::before,.code-step.denied .code-verb::before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:#c4483b;vertical-align:middle}
.code-diff,.code-out{margin:4px 8px 8px;padding:10px 12px;max-height:340px;overflow:auto;white-space:pre;font:12px/1.65 Consolas,ui-monospace,monospace;background:#f7f8f5;border:1px solid var(--line);border-radius:8px}
.code-diff span{display:block}
.code-diff .add{background:#e8f6ee;color:#17643f}.code-diff .del{background:#fbecea;color:#9c2f24}.code-diff .hunk{color:#6a7bb8}
.code-undo{margin:0 8px 8px;padding:4px 10px;border:1px solid var(--line);border-radius:7px;font-size:12px;color:#4a5444}
.code-undo:hover{background:var(--hover)}
.code-note{margin:4px 0;color:var(--muted);font-size:12px}
.code-live{margin:6px 0 2px;color:#6c7566;font-size:12px}
.code-error{margin:6px 0;padding:8px 10px;border-radius:8px;background:#fdf2f0;border:1px solid #efc9c3;color:#9c2f24;font-size:12px}
.code-meta{margin-top:8px;color:#a2a79d;font-size:10px}
.code-model-list{display:flex;flex-direction:column;gap:4px;max-height:52vh;overflow:auto;margin:6px 0 12px}
.code-model-row{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 10px;border-radius:8px;border:1px solid transparent;text-align:left}
.code-model-row strong{font-size:13px;font-weight:600}
.code-model-row span{font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.code-model-row:hover{background:var(--hover)}
.code-model-row.active{border-color:#d3dbf4;background:#eef1fb}
.code-model-row.active strong{color:#2b3f8f}
.code-effort{display:flex;flex-wrap:wrap;gap:4px;padding:4px;background:var(--side);border:1px solid var(--line);border-radius:8px}
.code-effort-item{flex:1 1 0;min-width:52px;padding:6px 8px;border-radius:6px;font-size:12px;color:var(--muted)}
.code-effort-item.active{background:var(--panel);color:#2b3f8f;font-weight:600;box-shadow:0 0 0 1px var(--line),0 1px 3px #0000001a}
.dark .code-chip[aria-pressed="true"],.dark .code-mark,.dark .code-model-row.active{background:#252c45;border-color:#38426a;color:#c9d3ff}
.dark .code-chip-mark,.dark .code-symbol,.dark .project-code-mark,.dark .code-chip[aria-pressed="true"] .code-chip-mark{color:#9fb0f5}
.dark .code-target{color:#d5dccb}
.dark .code-diff,.dark .code-out{background:var(--hover);color:#c3ccb7}
.dark .code-diff .add{background:#1d3a2b;color:#9fdcb9}.dark .code-diff .del{background:#3f2320;color:#f0aaa1}
.dark .code-step.confirm>summary{background:#3a311f;box-shadow:inset 0 0 0 1px #5d4c27}
.dark .code-error{background:#3f2320;border-color:#6b342d;color:#f0aaa1}
.dark .code-on .send{background:#9fb0f5;color:#141a33}
.dark .code-model-row.active strong{color:#c9d3ff}
.dark .code-effort-item.active{color:#c9d3ff}
@media(max-width:480px){.code-project-chip{max-width:96px}.code-chip .wish-chip-label{display:none}.code-chip{padding:0 7px}}
.sidebar-shortcuts .nav>span.code-symbol,.sidebar-projects .nav.project-current>span.project-code-mark{font:700 9px/16px Consolas,ui-monospace,monospace;letter-spacing:-.8px;color:#3b57b8;overflow:visible;white-space:nowrap}
.content .inline-code{padding:1px 5px;border-radius:5px;background:#f1f3ee;border:1px solid var(--line);font:12px/1.5 Consolas,ui-monospace,monospace}
.content .md-h{display:inline-block;margin:4px 0 2px;font-size:14px}
.dark .content .inline-code{background:var(--hover);color:#d5dccb}
.dark .code-trace,.dark .code-title{color:#d5dccb}
.dark .code-verb,.dark .code-stat{color:#a9b39e}
.dark .code-undo,.dark .code-project-chip{color:#c3ccb7;border-color:#4a5340}
.dark .sidebar-shortcuts .nav>span.code-symbol,.dark .sidebar-projects .nav.project-current>span.project-code-mark{color:#9fb0f5}
.dark #composer.code-on .send{background:#9fb0f5;color:#141a33}
.dark .code-stat.good{color:#7fd0a3}.dark .code-stat.bad{color:#f0aaa1}
/* 0.7.2 Code task history + change summary */
.sidebar-projects .project-tasks{display:flex;flex-direction:column;gap:1px;margin:2px 0 0 18px}
.sidebar-projects .project-task{display:flex;align-items:center;min-height:28px;padding:4px 9px;border-radius:7px;font-size:13px;color:#4a5444;text-align:left;min-width:0}
.sidebar-projects .project-task .history-title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.sidebar-projects .project-task:hover,.sidebar-projects .project-task.active{background:var(--hover)}
.code-changes{margin:10px 0 2px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.code-changes-head{font-size:12px;font-weight:600;margin-bottom:6px}
.code-changes-row{display:flex;align-items:center;gap:10px;min-height:24px;min-width:0}
.code-changes-row.undone .code-target{text-decoration:line-through;color:var(--muted)}
.code-changes .code-undo{margin:8px 0 0}
.dark .sidebar-projects .project-task{color:#c3ccb7}
/* 主人专用快捷入口：Gemini 4（AI Studio）/ Muse（2026-11-01） */
.nav[hidden]{display:none!important}
a.nav.owner-link{color:inherit;text-decoration:none}
.nav.owner-link>.owner-link-mark{font-size:9px!important;font-weight:700;letter-spacing:-.03em;justify-content:center;text-align:center}