:root { font-family: "Segoe UI", "Microsoft YaHei", sans-serif; color: #24372f; background: #f5f6f2; font-size: 14px; line-height: 1.6; }
* { box-sizing: border-box; }
body { margin: 0; }
button, input, textarea, select { font: inherit; }
button { border: 1px solid transparent; border-radius: 7px; background: #256849; color: white; padding: 8px 13px; cursor: pointer; }
button:hover { filter: brightness(.94); }
button:disabled { opacity: .45; cursor: not-allowed; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible { outline: 2px solid #3e9773; outline-offset: 3px; }
.secondary { background: white; border-color: #d6ddd6; color: #344a3d; }
.text-button { background: transparent; color: #37694e; padding: 5px 0; text-align: left; font-size: 12px; }
.danger { color: #a54435; }
.button-row, .section-row { display: flex; align-items: center; gap: 8px; }
.section-row { justify-content: space-between; }
.full { width: 100%; margin-top: 10px; }
.topbar { min-height: 70px; padding: 16px 26px; border-bottom: 1px solid #dce2d9; background: #fff; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.brand { display: flex; align-items: center; gap: 12px; font-size: 17px; }
.brand-icon { display: grid; place-items: center; width: 32px; height: 32px; background: #256849; color: white; border-radius: 9px; }
.badge { display: inline-block; background: #eaf0e7; color: #52705c; font-size: 10px; letter-spacing: .06em; padding: 4px 8px; border-radius: 5px; }
#notice { padding: 10px 26px; border-bottom: 1px solid #dce2d9; min-height: 44px; font-size: 13px; overflow-wrap: anywhere; }
#notice.error { background: #fff0eb; color: #9b3c28; }
.layout { display: grid; grid-template-columns: 290px minmax(360px, 1fr) 330px; max-width: 1800px; margin: auto; min-height: calc(100vh - 114px); }
.sidebar, .inspector { padding: 18px; min-width: 0; }
.sidebar { border-right: 1px solid #dce2d9; }
.inspector { border-left: 1px solid #dce2d9; }
.panel { padding: 17px; border: 1px solid #dce2d9; background: #fff; border-radius: 10px; margin-bottom: 14px; min-width: 0; }
summary { cursor: pointer; font-weight: 600; }
h1, h2, p { margin-top: 0; }
h1 { font-size: 24px; letter-spacing: -.04em; margin-bottom: 0; }
h2 { font-size: 14px; margin-bottom: 12px; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
label { display: block; font-size: 12px; font-weight: 600; margin: 12px 0 5px; }
input, textarea, select { width: 100%; background: #fafbf9; color: #263b30; border: 1px solid #d6ddd6; border-radius: 6px; padding: 9px; }
input, select { font-size: 12px; }
fieldset .button-row { margin-top: 14px; }
.hint, .muted { color: #778276; font-size: 11px; }
.hint { margin: 10px 0 0; }
.workspace-name { font-family: monospace; font-size: 13px; overflow-wrap: anywhere; color: #256849; }
.section-row h2 { margin: 0; }
#folder-path { overflow-wrap: anywhere; font-size: 12px; }
.file-list { max-height: 230px; overflow-y: auto; margin-top: 8px; }
.file-button, .session-button { display: block; border: 0; width: 100%; padding: 7px; background: transparent; color: #4e6154; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; }
.session-button.active { background: #eaf0e7; color: #256849; }
.chat-panel { display: flex; flex-direction: column; min-width: 0; background: #fafbf8; }
.chat-heading { padding: 28px 28px 20px; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.eyebrow { font-size: 10px; letter-spacing: .12em; color: #8a998d; margin-bottom: 8px; }
.messages { flex: 1; padding: 8px 28px 28px; overflow-y: auto; min-height: 340px; max-height: calc(100vh - 380px); }
.empty { text-align: center; margin: 90px 0; color: #829184; }
.message { margin-bottom: 18px; }
.message-label { display: block; font-size: 11px; color: #7a8a7d; margin-bottom: 5px; }
.message pre { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; padding: 13px 16px; border-radius: 9px; background: #fff; border: 1px solid #e1e6dd; }
.message.user pre { background: #edf2e9; border-color: #e3e9df; }
.message.tool pre, .tool-call { font-family: Consolas, monospace; font-size: 11px; max-height: 220px; overflow: auto; }
.message details summary { font-size: 12px; color: #637868; margin-bottom: 5px; }
.execution-group { margin: 0 0 18px; border: 1px solid #dce3d7; border-radius: 8px; background: #f1f5ed; }
.execution-group > summary { padding: 10px 14px; font-size: 12px; color: #637868; }
.execution-group > summary:focus-visible { outline: 2px solid #3e9773; outline-offset: 2px; border-radius: 6px; }
.execution-body { padding: 4px 14px 12px; max-height: 360px; overflow-y: auto; }
.execution-body > .message:last-child { margin-bottom: 0; }
.composer { padding: 16px 28px 24px; border-top: 1px solid #e0e5da; background: white; }
.composer label { margin-top: 0; }
.composer textarea { resize: vertical; min-height: 88px; max-height: 260px; }
.composer-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 9px; }
.composer-footer .hint { margin: 0; }
.preview, .diff { font: 12px/1.7 Consolas, "Microsoft YaHei", monospace; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 360px; overflow: auto; background: #f6f8f3; padding: 12px; border-radius: 6px; }
.approval { border-color: #7da78b; }
.approval .button-row { margin-top: 14px; }
.diff .added { color: #23693f; background: #e8f3e4; }
.diff .removed { color: #a34835; background: #fcedea; }
.diff span { display: block; }
#backups .backup { padding: 8px 0; border-bottom: 1px solid #edf0e9; font-size: 11px; overflow-wrap: anywhere; }
[hidden] { display: none !important; }
.context-status { margin: -8px 28px 14px; font-size: 11px; color: #6b8171; }
.context-summary { margin: 0 28px 16px; padding: 10px 14px; background: #edf3e9; border-radius: 7px; font-size: 12px; }
#context-summary-content { max-height: 260px; overflow: auto; margin-top: 10px; }
.markdown-body { padding: 14px 18px; background: white; border: 1px solid #e1e6dd; border-radius: 9px; line-height: 1.8; overflow-wrap: anywhere; }
.markdown-body > :first-child { margin-top: 0; }
.markdown-body > :last-child { margin-bottom: 0; }
.markdown-body p { margin: 0 0 12px; }
.markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 { margin: 20px 0 10px; line-height: 1.45; letter-spacing: normal; }
.markdown-body h1 { font-size: 23px; }
.markdown-body h2 { font-size: 20px; }
.markdown-body h3 { font-size: 17px; }
.markdown-body h4, .markdown-body h5, .markdown-body h6 { font-size: 14px; }
.markdown-body ul, .markdown-body ol { padding-left: 24px; margin: 8px 0 14px; }
.markdown-body li { margin: 4px 0; }
.markdown-body li p { margin: 4px 0; }
.markdown-body blockquote { margin: 12px 0; border-left: 3px solid #95b79c; padding: 4px 14px; color: #647666; background: #f5f8f2; }
.markdown-body a { color: #256849; text-decoration: underline; text-underline-offset: 3px; }
.markdown-body code { font: 12px/1.7 Consolas, "Microsoft YaHei", monospace; background: #edf2e9; border-radius: 3px; padding: 2px 5px; }
.markdown-body .code-block { margin: 12px 0; border: 1px solid #d9e1d5; border-radius: 7px; overflow: hidden; }
.markdown-body .code-toolbar { display: flex; align-items: center; justify-content: space-between; padding: 5px 10px; background: #edf2e9; color: #6c7f70; font-size: 11px; }
.markdown-body .copy-code { background: transparent; color: #37694e; padding: 2px 6px; font-size: 11px; }
.message .markdown-body pre, .markdown-body pre { margin: 0; padding: 12px; background: #f6f8f3; border: 0; border-radius: 0; white-space: pre; overflow-x: auto; font: 12px/1.7 Consolas, monospace; }
.markdown-body pre code { padding: 0; background: transparent; font: inherit; }
.markdown-body table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: 12px 0; font-size: 13px; }
.markdown-body th, .markdown-body td { border: 1px solid #dce3d7; padding: 8px 12px; }
.markdown-body th { background: #edf2e9; font-weight: 600; }
.markdown-body hr { border: 0; border-top: 1px solid #dce3d7; margin: 18px 0; }
.markdown-fallback { white-space: pre-wrap; }
@media (max-width: 1150px) { .layout { grid-template-columns: 260px minmax(360px, 1fr); } .inspector { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; border-top: 1px solid #dce2d9; } }
@media (max-width: 680px) { .layout { display: block; } .sidebar, .inspector { display: block; border: 0; padding: 12px; } .topbar { padding: 14px; } .brand .badge, .topbar > .muted { display: none; } .chat-heading, .messages, .composer { padding-left: 18px; padding-right: 18px; } .messages { max-height: 65vh; } }