:root {
  --bg: #0d1117;
  --panel: #121820;
  --panel-2: #171f29;
  --panel-3: #1d2732;
  --line: #2c3845;
  --line-soft: #222d38;
  --text: #e5edf4;
  --muted: #8fa0b1;
  --blue: #3b82f6;
  --blue-strong: #60a5fa;
  --green: #36c690;
  --amber: #efb45b;
  --red: #f17474;
  --paper: #cad5df;
}

/* User-selectable dark theme. */
.theme-toggle {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  padding: 0;
  border: 1px solid #dce5e0;
  border-radius: 50%;
  color: #506159;
  background: #fff;
  cursor: pointer;
  transition: color .22s ease, background-color .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
.theme-toggle:hover { border-color: #b9d5cb; color: #206b58; background: #edf7f3; transform: translateY(-1px) rotate(-7deg); box-shadow: 0 7px 18px rgba(38, 91, 71, .1); }
.theme-icon { grid-area: 1 / 1; font-family: Georgia, "Times New Roman", serif; font-size: 25px; font-weight: 400; line-height: 1; transition: opacity .2s ease, transform .28s ease; }
.theme-icon-sun { opacity: 0; transform: rotate(-35deg) scale(.72); }
html[data-theme="dark"] .theme-icon-moon { opacity: 0; transform: rotate(35deg) scale(.72); }
html[data-theme="dark"] .theme-icon-sun { opacity: 1; transform: rotate(0) scale(1); }

body, .app-shell, .global-header, .sidebar, .main-area, .context-bar, .topbar, .conversation-tools,
.chat-scroll, .composer-wrap, .composer, .module-card, .billing-section, .settings-layout,
.license-card, .dialog-card, .announcement-dialog, input, select, textarea {
  transition: color .28s ease, background-color .28s ease, border-color .28s ease, box-shadow .28s ease;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #101412;
  --panel: #171c1a;
  --panel-2: #1b211e;
  --panel-3: #222925;
  --line: #35403b;
  --line-soft: #29322e;
  --text: #e7eeea;
  --muted: #8f9b95;
  --blue: #65b49d;
  --blue-strong: #9ed7c6;
  --green: #65b49d;
  --amber: #e2b55f;
  --red: #e0847b;
  --paper: #cbd5d0;
}
html[data-theme="dark"] body { color: #e7eeea; background: #101412; }
html[data-theme="dark"] .app-shell { background: #101412; }
html[data-theme="dark"] .global-header { border-color: #28312d; background: rgba(20, 25, 23, .97); box-shadow: 0 5px 24px rgba(0, 0, 0, .16); }
html[data-theme="dark"] .global-brand { color: #edf3f0; }
html[data-theme="dark"] .global-brand small { color: #85918b; }
html[data-theme="dark"] .global-brand .brand-mark,
html[data-theme="dark"] .license-card .brand-mark { background: #1b2622; }
html[data-theme="dark"] .module-tab { color: #abb6b0; }
html[data-theme="dark"] .module-tab:hover { color: #8ed1be; background: #1b2823; }
html[data-theme="dark"] .module-tab.active { border-color: #34584d; color: #a9dfcf; background: #1c302a; box-shadow: 0 5px 16px rgba(0, 0, 0, .13); }
html[data-theme="dark"] .balance-tab { border-color: #594b30; background: #282217; }
html[data-theme="dark"] .balance-tab strong { color: #e2b55f; }
html[data-theme="dark"] .theme-toggle { border-color: #3a4641; color: #f0c66f; background: #1c2320; }
html[data-theme="dark"] .theme-toggle:hover { border-color: #6c5b36; color: #ffd584; background: #292419; box-shadow: 0 7px 18px rgba(0, 0, 0, .2); }

html[data-theme="dark"] .sidebar, html[data-theme="dark"] .context-bar { border-color: #29322e; background: #141917; }
html[data-theme="dark"] .main-area { background: #111513; }
html[data-theme="dark"] .dialogue-subnav { border-color: #303b36; background: #1b211e; }
html[data-theme="dark"] .dialogue-subnav .side-link { color: #8f9b95; }
html[data-theme="dark"] .dialogue-subnav .side-link:hover { color: #a9dccc; background: #202a26; }
html[data-theme="dark"] .dialogue-subnav .side-link.active { color: #b5e5d6; background: #26332e; box-shadow: 0 4px 12px rgba(0, 0, 0, .18); }
html[data-theme="dark"] .search-box, html[data-theme="dark"] .section-label { color: #7f8b85; }
html[data-theme="dark"] .search-box input,
html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea { border-color: #35413b; color: #e0e8e4; background: #171c1a; }
html[data-theme="dark"] input:focus, html[data-theme="dark"] select:focus, html[data-theme="dark"] textarea:focus { border-color: #4f9c86; box-shadow: 0 0 0 4px rgba(63, 151, 125, .12); }
html[data-theme="dark"] .conversation-item { color: #adb8b2; }
html[data-theme="dark"] .conversation-item:hover { border-color: #303b36; background: #1c2421; }
html[data-theme="dark"] .conversation-item.active { border-color: #355c50; color: #bce5d8; background: #1c302a; }
html[data-theme="dark"] .sidebar-foot, html[data-theme="dark"] .sidebar-account { border-color: #29322e; }
html[data-theme="dark"] .account-avatar { border-color: #3c6257; color: #a9dccc; background: #1d302a; }

html[data-theme="dark"] .topbar { border-color: #29322e; background: #151a18; }
html[data-theme="dark"] .topic h1, html[data-theme="dark"] .page-heading h2 { color: #eaf1ed; }
html[data-theme="dark"] .topic span { color: #849089; }
html[data-theme="dark"] .quiet-button, html[data-theme="dark"] .icon-button,
html[data-theme="dark"] .attach-button, html[data-theme="dark"] .stop-button { border-color: #35413b; color: #b8c3bd; background: #181e1b; }
html[data-theme="dark"] .quiet-button:hover, html[data-theme="dark"] .icon-button:hover,
html[data-theme="dark"] .attach-button:hover { border-color: #497667; color: #aee0d1; background: #1e2a26; }
html[data-theme="dark"] .conversation-tools { border-color: #28312d; background: #131816; }
html[data-theme="dark"] .field-inline, html[data-theme="dark"] .team-switch { color: #9da9a3; }
html[data-theme="dark"] .chat-scroll, html[data-theme="dark"] .composer-wrap { border-color: #29322e; background: #111513; }
html[data-theme="dark"] .empty-state h2 { color: #e8efeb; }
html[data-theme="dark"] .empty-state p, html[data-theme="dark"] .page-copy { color: #8e9a94; }
html[data-theme="dark"] .empty-index { color: #9ed7c6; background: #1c302a; }
html[data-theme="dark"] .starter-grid button { border-color: #303a35; color: #b7c2bc; background: #171c1a; }
html[data-theme="dark"] .starter-grid button:hover { border-color: #416c5f; color: #bce7da; background: #1c2925; }
html[data-theme="dark"] .composer { border-color: #36423c; background: #181d1b; box-shadow: 0 10px 32px rgba(0, 0, 0, .22); }
html[data-theme="dark"] .composer:focus-within { border-color: #4f9c86; box-shadow: 0 12px 36px rgba(0, 0, 0, .26); }
html[data-theme="dark"] .composer-actions { border-color: #2c3531; }

html[data-theme="dark"] .message-content, html[data-theme="dark"] .message.assistant .message-content { color: #d6dfda; }
html[data-theme="dark"] .message.user .message-content { border-color: #35413b; color: #e5ece8; background: #202825; }
html[data-theme="dark"] .message-content h1, html[data-theme="dark"] .message-content h2,
html[data-theme="dark"] .message-content h3, html[data-theme="dark"] .message-content h4,
html[data-theme="dark"] .message-content strong { color: #edf3f0; }
html[data-theme="dark"] .message-content code { color: #a9ddce; background: #1a2a25; }
html[data-theme="dark"] .message-content pre { border-color: #303b36; background: #121715; }
html[data-theme="dark"] .message-content pre code { color: #d6dfda; }
html[data-theme="dark"] .message-content th { color: #e7eeea; background: #1c2b26; }
html[data-theme="dark"] .message-thinking-body { border-color: #35403b; }
html[data-theme="dark"] .message-run-status, html[data-theme="dark"] .message-worklog-entry { color: #8f9b95; }
html[data-theme="dark"] .message-file-card, html[data-theme="dark"] .message.user .message-file-card,
html[data-theme="dark"] .files-list .message-file-card { border-color: #334039; color: #d6dfda; background: #181e1b; }
html[data-theme="dark"] .message-file-card:hover { border-color: #467263; background: #1d2824; }
html[data-theme="dark"] .message-file-copy strong { color: #e5ece8; }
html[data-theme="dark"] .message-file-copy small { color: #849089; }
html[data-theme="dark"] .message-file-icon { color: #9fd6c6; background: #20332d; }

html[data-theme="dark"] .home-kicker, html[data-theme="dark"] .status-pill { color: #a7ddcd; background: #1c302a; }
html[data-theme="dark"] .home-intro h1, html[data-theme="dark"] .development-view h2 { color: #edf3f0; }
html[data-theme="dark"] .home-intro p, html[data-theme="dark"] .development-view p { color: #929e98; }
html[data-theme="dark"] .module-card, html[data-theme="dark"] .resource-card,
html[data-theme="dark"] .agent-card, html[data-theme="dark"] .wallet-summary > div,
html[data-theme="dark"] .billing-section, html[data-theme="dark"] .settings-layout { border-color: #303a35; color: #dce5e0; background: #171c1a; box-shadow: 0 9px 25px rgba(0, 0, 0, .16); }
html[data-theme="dark"] .module-card:hover, html[data-theme="dark"] .resource-card:hover,
html[data-theme="dark"] .agent-card:hover { border-color: #416c5f; box-shadow: 0 17px 34px rgba(0, 0, 0, .22); }
html[data-theme="dark"] .module-card strong, html[data-theme="dark"] .resource-card h3,
html[data-theme="dark"] .agent-card h3 { color: #e7eeea; }
html[data-theme="dark"] .module-card p, html[data-theme="dark"] .resource-card p,
html[data-theme="dark"] .agent-card p { color: #8f9b95; }
html[data-theme="dark"] .development-icon { color: #a7ddcd; background: #1c302a; box-shadow: 0 12px 30px rgba(0, 0, 0, .18); }
html[data-theme="dark"] .development-view button { border-color: #3a4641; color: #addccc; background: #181e1b; }
html[data-theme="dark"] .development-view button:hover { border-color: #4b7568; background: #1d2925; }

html[data-theme="dark"] .wallet-summary span, html[data-theme="dark"] .setting-row span { color: #8f9b95; }
html[data-theme="dark"] .wallet-summary strong { color: #8ed2bd; }
html[data-theme="dark"] .setting-row, html[data-theme="dark"] .data-row { border-color: #2d3732; }
html[data-theme="dark"] .setting-row strong, html[data-theme="dark"] .data-row strong { color: #dbe4df; }
html[data-theme="dark"] .billing-mode-notice, html[data-theme="dark"] .billing-lock { color: #a9b5ae; background: #1c2421; }
html[data-theme="dark"] .team-person { color: #b7c3bd; background: #1c2824; }
html[data-theme="dark"] .context-heading { color: #abb7b1; }

html[data-theme="dark"] .modal-backdrop { background: rgba(3, 6, 5, .66); }
html[data-theme="dark"] .license-card, html[data-theme="dark"] .dialog-card,
html[data-theme="dark"] .announcement-dialog { border-color: #35403b; color: #dce5e0; background: #171c1a; box-shadow: 0 24px 70px rgba(0, 0, 0, .42); }
html[data-theme="dark"] .auth-tabs { background: #222925; }
html[data-theme="dark"] .auth-tabs button { color: #909c96; }
html[data-theme="dark"] .auth-tabs button.active { color: #afe0d1; background: #2a332f; }
html[data-theme="dark"] .announcement-header { border-color: #303a35; background: #1b211e; }
html[data-theme="dark"] .announcement-summary, html[data-theme="dark"] .announcement-item,
html[data-theme="dark"] .announcement-detail-meta, html[data-theme="dark"] .announcement-detail-foot { border-color: #303a35; }
html[data-theme="dark"] .announcement-item { color: #dce5e0; }
html[data-theme="dark"] .announcement-item:hover, html[data-theme="dark"] .announcement-item.unread { background: #1c2824; }
html[data-theme="dark"] .announcement-item.unread .announcement-copy strong { color: #edf3f0; }
html[data-theme="dark"] .announcement-detail-content { color: #cbd5d0; }
html[data-theme="dark"] .announcement-detail-foot { background: #171c1a; }

html[data-theme="dark"] * { scrollbar-color: #46534d transparent; }
html[data-theme="dark"] *::-webkit-scrollbar-thumb { border-color: transparent; background: #46534d; background-clip: padding-box; }
html[data-theme="dark"] *::-webkit-scrollbar-thumb:hover { background-color: #5b6962; }
html[data-theme="dark"] .run-option,
html[data-theme="dark"] .field-inline + .field-inline { border-color: #303a35; }
html[data-theme="dark"] .team-switch span { border-color: #3b4842; background: #252d29; }
html[data-theme="dark"] .team-switch span::after { background: #87938d; box-shadow: 0 2px 5px rgba(0, 0, 0, .28); }
html[data-theme="dark"] .team-switch input:checked + span { border-color: #4e9c86; background: #2e7f69; }
html[data-theme="dark"] .team-switch input:checked + span::after { background: #d5e9e2; }
html[data-theme="dark"] .conversation-delete { border-color: #653d3b; color: #f1a39c; background: #2c1d1c; }
html[data-theme="dark"] .conversation-delete:hover { border-color: #96504b; color: #ffd7d3; background: #482725; }
html[data-theme="dark"] .attachment-chip,
html[data-theme="dark"] .message-attachment { border-color: #36594f; color: #a7dacb; background: #1b2b26; }
html[data-theme="dark"] .attachment-chip button { color: #8dc8b7; }
html[data-theme="dark"] .run-progress { border-color: #35423c; color: #dce5e0; background: #181e1b; box-shadow: 0 8px 24px rgba(0, 0, 0, .2); }
html[data-theme="dark"] .run-progress-current { border-color: #303a35; background: #1b211e; }
html[data-theme="dark"] .run-progress-current strong { color: #e5ece8; }
html[data-theme="dark"] .run-progress-current div span { color: #8f9b95; }
html[data-theme="dark"] .run-progress-steps { background: #171c1a; }
html[data-theme="dark"] .run-progress-steps li { border-color: #3b4842; color: #7f8b85; }
html[data-theme="dark"] .run-progress-steps li.active { border-color: #65b49d; color: #b8e2d5; }
html[data-theme="dark"] .run-progress-steps li.complete { border-color: #65b49d; color: #8fc8b7; }
html[data-theme="dark"] .run-progress-steps li.blocked { border-color: #d77d75; color: #eaa39d; }
html[data-theme="dark"] .new-message-notice { border-color: #416d60; color: #b6e2d5; background: #1d302a; box-shadow: 0 7px 20px rgba(0, 0, 0, .2); }
html[data-theme="dark"] .context-bar section { border-color: #303a35; }
html[data-theme="dark"] .sidebar-foot > .side-link,
html[data-theme="dark"] .context-files { border-color: #303a35; }

@media (prefers-reduced-motion: reduce) {
  .theme-toggle, .theme-icon { transition: none; }
}

* {
  box-sizing: border-box;
  scrollbar-color: #465767 transparent;
  scrollbar-width: thin;
}

*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  min-height: 36px;
  border: 2px solid transparent;
  border-radius: 8px;
  background: #465767;
  background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover { background-color: #5b6f81; }
*::-webkit-scrollbar-corner { background: transparent; }

html, body { height: 100%; }

html[data-agent-theme="beige"] {
  --bg:#f3ead9; --panel:#fffaf0; --panel-2:#f7eddb; --panel-3:#ead9bd;
  --line:#d9c5a3; --line-soft:#eadcc3; --text:#3f3528; --muted:#806f59;
  --green:var(--agent-accent,#c89b5b); --blue:var(--agent-accent,#c89b5b);
}
html[data-agent-theme="beige"] body,
html[data-agent-theme="beige"] .app-shell,
html[data-agent-theme="beige"] .main-area { color:#3f3528; background:#f3ead9; }
html[data-agent-theme="beige"] .global-header,
html[data-agent-theme="beige"] .sidebar,
html[data-agent-theme="beige"] .context-bar,
html[data-agent-theme="beige"] .topbar { border-color:#d9c5a3; color:#3f3528; background:#fffaf0; }
html[data-agent-theme="beige"] .panel-view,
html[data-agent-theme="beige"] .chat-scroll,
html[data-agent-theme="beige"] .composer-wrap { background:#f8f0e2; }
html[data-agent-theme="beige"] .module-tab:hover,
html[data-agent-theme="beige"] .module-tab.active,
html[data-agent-theme="beige"] .side-link.active { color:#4a3926; background:#ead9bd; border-color:#cbae82; }
html[data-agent-theme="beige"] .primary-button { border-color:#9d7443; color:#fff; background:var(--agent-accent,#b7854d); }
html[data-agent-theme="beige"] .billing-section,
html[data-agent-theme="beige"] .wallet-summary > div,
html[data-agent-theme="beige"] .settings-layout,
html[data-agent-theme="beige"] .license-card { border-color:#d9c5a3; color:#3f3528; background:#fffaf0; }
html[data-agent-theme="beige"] input,
html[data-agent-theme="beige"] select,
html[data-agent-theme="beige"] textarea { border-color:#cfb790; color:#3f3528; background:#fffdf8; }
html[data-agent-theme="beige"] .star-field { opacity:.08; }

.agent-pool-summary { grid-template-columns:repeat(3,minmax(0,1fr)); }
.agent-users-section, .agent-ledger-section { margin-top:18px; }
.agent-user-table { overflow:auto; border:1px solid var(--line); }
.agent-user-table table { width:100%; min-width:900px; border-collapse:collapse; }
.agent-user-table th, .agent-user-table td { padding:12px; border-bottom:1px solid var(--line-soft); text-align:left; }
.agent-user-table th { color:var(--muted); font-size:11px; }
.agent-user-table td strong, .agent-user-table td small { display:block; }
.agent-user-table td small { margin-top:4px; color:var(--muted); }
.agent-recharge-inline { display:grid; width:250px; min-width:250px; grid-template-columns:minmax(0, 1fr) 78px; gap:7px; }
.agent-recharge-inline input { width:100%; min-width:0; }
.agent-recharge-inline .primary-button { width:100%; min-width:0; padding-inline:10px; }

html[data-agent-theme="beige"] .home-primary,
html[data-agent-theme="beige"] .send-button,
html[data-agent-theme="beige"] .primary-button { border-color:#9d7443; color:#fff; background:var(--agent-accent,#b7854d); box-shadow:none; }
html[data-agent-theme="beige"] .home-primary:hover,
html[data-agent-theme="beige"] .send-button:hover,
html[data-agent-theme="beige"] .primary-button:hover { background:#9f713d; }
html[data-agent-theme="beige"] .home-primary b,
html[data-agent-theme="beige"] .module-card-icon,
html[data-agent-theme="beige"] .module-card.ready .module-card-icon,
html[data-agent-theme="beige"] .empty-index,
html[data-agent-theme="beige"] .development-icon { color:#704d28; background:#f0dfc3; }
html[data-agent-theme="beige"] .module-card small,
html[data-agent-theme="beige"] .module-card.ready small,
html[data-agent-theme="beige"] .home-kicker,
html[data-agent-theme="beige"] .status-pill,
html[data-agent-theme="beige"] .count-badge { color:#704d28; background:#f4e5cc; }
html[data-agent-theme="beige"] .module-card b,
html[data-agent-theme="beige"] .balance-tab strong,
html[data-agent-theme="beige"] .text-button,
html[data-agent-theme="beige"] a { color:#7a542d; }
html[data-agent-theme="beige"] .module-card:hover,
html[data-agent-theme="beige"] .resource-card:hover,
html[data-agent-theme="beige"] .agent-card:hover { border-color:#c6a777; box-shadow:0 16px 34px rgba(111,77,40,.12); }
html[data-agent-theme="beige"] input:focus,
html[data-agent-theme="beige"] select:focus,
html[data-agent-theme="beige"] textarea:focus { border-color:var(--agent-accent,#b7854d); box-shadow:0 0 0 3px rgba(183,133,77,.14); }

body {
  margin: 0;
  color: var(--text);
  background: var(--bg);
  font-family: "Segoe UI", "Microsoft YaHei", system-ui, sans-serif;
  font-size: 14px;
  letter-spacing: 0;
}

button, input, select, textarea { font: inherit; }

button { color: inherit; }

.app-shell {
  display: grid;
  grid-template-columns: 252px minmax(0, 1fr) 290px;
  height: 100vh;
  overflow: hidden;
}

.sidebar, .context-bar {
  min-width: 0;
  background: #10161d;
}

.sidebar {
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--line);
  padding: 16px 12px 12px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 8px 18px;
}

.brand-mark {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  color: #dce9ff;
  background: #18345a;
  border: 1px solid #2a5c9b;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1px;
}

.brand strong { display: block; font-size: 14px; }
.brand span, .eyebrow { display: block; color: var(--muted); font-size: 10px; letter-spacing: 1px; }

.primary-button, .primary-small, .send-button {
  border: 1px solid #3f82d9;
  border-radius: 6px;
  color: white;
  background: #2869bd;
  cursor: pointer;
  font-weight: 650;
  transition: background .15s ease, opacity .15s ease;
}

.primary-button { width: 100%; padding: 10px 12px; }
.primary-small { padding: 8px 11px; }
.primary-button:hover, .primary-small:hover, .send-button:hover { background: #357bce; }
.primary-button:disabled, .primary-small:disabled, .send-button:disabled { cursor: wait; opacity: .55; }

.search-box {
  display: grid;
  gap: 5px;
  padding: 16px 4px 10px;
  color: var(--muted);
  font-size: 11px;
}

.search-box input, input, select, textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 5px;
  outline: none;
  color: var(--text);
  background: #0d1218;
}

.search-box input { padding: 8px 9px; }
input:focus, select:focus, textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 2px rgba(59, 130, 246, .12); }

.side-section { min-height: 0; flex: 1; overflow-y: auto; padding: 10px 0; }
.section-label { padding: 0 8px 8px; color: var(--muted); font-size: 11px; }

.conversation-list { display: grid; gap: 2px; }

.conversation-row { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; }

.conversation-item {
  display: block;
  min-width: 0;
  width: auto;
  padding: 9px 10px;
  overflow: hidden;
  border: 0;
  border-left: 2px solid transparent;
  color: var(--paper);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.conversation-item:hover { background: #18212a; }
.conversation-item.active { border-left-color: var(--blue-strong); background: #172332; color: white; }
.conversation-item strong, .conversation-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conversation-item strong { font-size: 13px; font-weight: 600; }
.conversation-item small { margin-top: 4px; color: var(--muted); font-size: 11px; }

.conversation-delete {
  align-self: center;
  margin-right: 6px;
  padding: 6px 8px;
  border: 1px solid #9d3c47;
  border-radius: 4px;
  color: #ffe2e5;
  background: #7b2d36;
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
}

.conversation-delete:hover { color: #fff; background: #a63a46; border-color: #d85363; }

.sidebar-foot { border-top: 1px solid var(--line-soft); padding-top: 8px; }
.side-link { display: block; width: 100%; padding: 7px 9px; border: 0; color: var(--muted); background: transparent; cursor: pointer; text-align: left; }
.side-link:hover, .side-link.active { color: var(--text); background: #18212a; }
.side-link { border-radius: 4px; text-decoration: none; }
.balance-link { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.balance-link strong { color: #7dd8ae; font-size: 11px; }
.sidebar-account { display: grid; grid-template-columns: 30px minmax(0, 1fr) 30px; align-items: center; gap: 8px; margin-top: 8px; padding: 10px 7px 2px; border-top: 1px solid var(--line-soft); }
.sidebar-account strong, .sidebar-account span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-account strong { font-size: 12px; }
.sidebar-account span { margin-top: 2px; color: var(--muted); font-size: 9px; }
.account-avatar { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid #3d6079; border-radius: 50%; color: #dceaf5; background: #1a2b38; font-weight: 700; }

.main-area { display: flex; min-width: 0; min-height: 0; height: 100vh; flex-direction: column; overflow: hidden; background: #111820; }

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 68px;
  padding: 12px 22px;
  border-bottom: 1px solid var(--line);
  background: #121820;
}

.topic { display: flex; min-width: 0; align-items: center; gap: 10px; }
.topic h1 { max-width: 580px; margin: 0; overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.topic span { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }

.engine-status { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.engine-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--amber); }
.engine-status.ready i { background: var(--green); box-shadow: 0 0 8px rgba(54, 198, 144, .7); }
.engine-status.error i { background: var(--red); }

.quiet-button, .text-button, .icon-button, .attach-button, .stop-button {
  border: 1px solid var(--line);
  border-radius: 5px;
  color: var(--paper);
  background: transparent;
  cursor: pointer;
}

.quiet-button { padding: 7px 9px; }
.quiet-button:hover, .icon-button:hover, .attach-button:hover { border-color: #52708e; background: #19232d; }
.text-button { padding: 0; border: 0; color: var(--blue-strong); font-size: 12px; }
.icon-button { padding: 6px 8px; font-size: 11px; }
.mobile-menu { display: none; }

.panel-view { display: none; min-height: 0; flex: 1; overflow: auto; }
.panel-view.active { display: flex; flex-direction: column; }
#workspace-panel { overflow: hidden; }

.conversation-tools {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 52px;
  padding: 9px 22px;
  border-bottom: 1px solid var(--line-soft);
  background: #111820;
}

.field-inline { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.field-inline select { width: 132px; padding: 6px; }
.run-option { padding-left: 12px; border-left: 1px solid var(--line-soft); }
.run-option select { width: 112px; color: var(--text); background: #151b22; cursor: pointer; }
#run-reasoning { width: 78px; }

.team-switch { display: inline-flex; align-items: center; gap: 7px; color: var(--paper); cursor: pointer; font-size: 12px; }
.team-switch input { position: absolute; width: 1px; opacity: 0; }
.team-switch span { width: 28px; height: 16px; padding: 1px; border: 1px solid #455461; border-radius: 8px; background: #0b1015; }
.team-switch span::after { display: block; width: 12px; height: 12px; border-radius: 50%; background: #90a0ae; content: ""; transition: transform .15s ease, background .15s ease; }
.team-switch input:checked + span { border-color: #2b75cd; background: #17477a; }
.team-switch input:checked + span::after { transform: translateX(12px); background: #dbeafe; }
.tool-hint { color: var(--muted); font-size: 12px; }

.chat-scroll { position: relative; min-height: 0; flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: 28px clamp(22px, 4vw, 54px); }
.new-message-notice { position: absolute; z-index: 4; right: clamp(22px, 4vw, 54px); bottom: 18px; padding: 7px 10px; border: 1px solid #3f7ec6; border-radius: 5px; color: #d9ebfa; background: #163049; box-shadow: 0 5px 18px rgba(0, 0, 0, .28); cursor: pointer; font-size: 12px; }
.new-message-notice.hidden { display: none; }
.empty-state { max-width: 650px; margin: 10vh auto; }
.empty-state.hidden { display: none; }
.empty-index { color: var(--blue-strong); font-family: Georgia, serif; font-size: 36px; }
.empty-state h2 { margin: 8px 0; font-size: 25px; font-weight: 640; }
.empty-state p { max-width: 560px; margin: 0; color: var(--muted); line-height: 1.7; }
.starter-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 24px; }
.starter-grid button { min-height: 62px; border: 1px solid var(--line); border-radius: 6px; color: var(--paper); background: #151e27; cursor: pointer; text-align: left; }
.starter-grid button:hover { border-color: #41668d; background: #172535; }

.message { display: flex; gap: 13px; max-width: 880px; margin: 0 auto 24px; }
.message-mark { flex: 0 0 auto; display: grid; width: 25px; height: 25px; place-items: center; border-radius: 5px; color: #dce9ff; background: #1d334c; font-size: 10px; font-weight: 800; }
.message.user .message-mark { color: #e6f7ff; background: #1a5e7c; }
.message-body { min-width: 0; flex: 1; }
.message-meta { margin-bottom: 7px; color: var(--muted); font-size: 11px; }
.message-content { color: #dbe5ed; line-height: 1.78; white-space: pre-wrap; word-break: break-word; }
.message.user .message-content { color: #f1f7fb; }
.message.pending .message-content { color: var(--muted); }
.message.error .message-content { color: #ffb1b1; }
.message-attachments { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.message-attachment { max-width: 100%; overflow: hidden; padding: 4px 7px; border: 1px solid #31516e; border-radius: 4px; color: #bcd7ec; background: #142536; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.agent-status-panel { margin-top: 13px; border: 1px solid #2c465f; border-radius: 6px; overflow: hidden; background: #101921; }
.agent-status-heading { padding: 8px 10px; border-bottom: 1px solid #263b4f; color: #bcdaf4; font-size: 11px; font-weight: 700; }
.agent-status-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: #263b4f; }
.agent-status-card { min-width: 0; padding: 9px 10px; background: #111c25; }
.agent-status-card > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.agent-status-card strong { min-width: 0; overflow: hidden; color: #dce7ef; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.agent-status-card span { flex: 0 0 auto; color: #9db4c7; font-size: 10px; }
.agent-status-card small { display: block; margin-top: 5px; overflow: hidden; color: #7f98ab; font-size: 11px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.agent-status-card.working { border-left: 2px solid #58a5f5; }
.agent-status-card.review { border-left: 2px solid #efb45b; }
.agent-status-card.completed { border-left: 2px solid #36c690; }
.agent-status-card.failed { border-left: 2px solid #f17474; }
.composer-wrap { flex: 0 0 auto; padding: 0 22px 14px; border-top: 1px solid var(--line); background: #121820; }
.attachment-list { display: flex; flex-wrap: wrap; gap: 6px; max-width: 880px; margin: 10px auto 7px; }
.attachment-chip { display: inline-flex; max-width: 100%; align-items: center; gap: 6px; padding: 4px 6px 4px 8px; border: 1px solid #31516e; border-radius: 5px; color: #bdcfdd; background: #142536; font-size: 12px; }
.attachment-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attachment-chip button { border: 0; color: #97b9d2; background: transparent; cursor: pointer; }

.run-progress { max-width: 880px; margin: 10px auto; border: 1px solid #31516e; border-radius: 6px; background: #101a23; }
.run-progress-current { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid #263b4f; }
.run-progress-current strong, .run-progress-current span { display: block; }
.run-progress-current strong { color: #d8e9f8; font-size: 12px; }
.run-progress-current div span { margin-top: 3px; color: #91adbf; font-size: 11px; }
.run-spinner { position: relative; width: 18px; height: 18px; flex: 0 0 18px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px rgba(54, 198, 144, .10); transition: background .24s ease, box-shadow .24s ease, transform .24s ease; }
.run-progress.working .run-spinner { background: transparent; box-shadow: none; }
.run-progress.working .run-spinner::before { content: ""; position: absolute; inset: 1px; border: 2px solid rgba(85, 163, 255, .20); border-top-color: #6ab3ff; border-right-color: #6ab3ff; border-radius: 50%; animation: run-spin .78s linear infinite; }
.run-progress.working .run-spinner::after { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: #6ab3ff; opacity: .8; transition: opacity .2s ease; }
.run-progress-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 9px 12px; list-style: none; }
.run-progress-steps li { min-width: 0; padding-left: 9px; border-left: 2px solid #314250; color: #718898; font-size: 10px; line-height: 1.35; }
.run-progress-steps li.active { border-left-color: #55a3ff; color: #d7ebff; }
.run-progress-steps li.complete { border-left-color: var(--green); color: #a8d5bd; }
.run-progress-steps li.blocked { border-left-color: var(--red); color: #ffb4bc; }

@keyframes run-spin { to { transform: rotate(360deg); } }

.composer { position: relative; max-width: 880px; margin: 0 auto; overflow: hidden; border: 1px solid #394958; border-radius: 7px; background: #0d1218; }
.composer:focus-within { border-color: #3f7ec6; }
.composer textarea { display: block; min-height: 70px; max-height: 210px; padding: 14px; resize: none; border: 0; background: transparent; box-shadow: none; line-height: 1.6; }
.composer-actions { display: flex; align-items: center; gap: 8px; padding: 8px; border-top: 1px solid #27333e; }
.attach-button { padding: 6px 8px; font-size: 12px; }
.upload-note { min-width: 0; flex: 1; overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.send-button { min-width: 63px; padding: 7px 11px; }
.stop-button { padding: 7px 10px; color: #ffb1b1; border-color: #7f3e3e; }
.composer-caption { max-width: 880px; margin: 8px auto 0; color: #718292; font-size: 11px; text-align: center; }

.context-bar { display: flex; min-width: 0; min-height: 0; height: 100vh; flex-direction: column; overflow: hidden; border-left: 1px solid var(--line); }
.context-bar section { padding: 17px 14px; border-bottom: 1px solid var(--line-soft); }
.context-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px; color: #aebdca; font-size: 12px; font-weight: 650; }
.team-summary { display: grid; gap: 6px; }
.team-person { display: flex; align-items: center; gap: 8px; padding: 7px; border-left: 2px solid #335d86; background: #151e26; color: #cbd8e3; font-size: 12px; }
.team-person i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.context-files { min-width: 0; min-height: 180px; max-height: 36%; overflow-x: hidden; overflow-y: auto; scrollbar-gutter: stable; }
.files-list { display: grid; gap: 5px; }
.file-item { display: grid; width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 7px; overflow: hidden; padding: 7px; border: 1px solid var(--line-soft); background: #151e26; }
.file-item span { min-width: 0; overflow: hidden; color: #cad8e4; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.file-item small { flex: 0 0 auto; color: var(--muted); font-size: 10px; white-space: nowrap; }
.file-item .text-button { flex: 0 0 auto; white-space: nowrap; }
.file-item a { color: var(--blue-strong); font-size: 11px; text-decoration: none; }
.activity-section { min-width: 0; min-height: 0; flex: 1; overflow-x: hidden; overflow-y: auto; scrollbar-gutter: stable; }
.activity-list { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; color: var(--muted); font-size: 12px; line-height: 1.45; }
.activity-list li { padding-left: 12px; border-left: 2px solid #324353; }
.activity-list li.latest { border-left-color: var(--blue-strong); color: #cad8e4; }
.muted { color: var(--muted); font-size: 12px; }

.page-heading { display: flex; align-items: end; justify-content: space-between; padding: 34px clamp(22px, 4vw, 54px) 12px; }
.page-heading h2 { margin: 4px 0 0; font-size: 22px; }
.page-copy { max-width: 760px; padding: 0 clamp(22px, 4vw, 54px) 25px; color: var(--muted); line-height: 1.7; }
.resource-grid, .agent-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 10px; padding: 0 clamp(22px, 4vw, 54px) 36px; }
.resource-card, .agent-card { display: flex; min-height: 154px; flex-direction: column; padding: 15px; border: 1px solid var(--line); border-radius: 6px; background: #151e27; }
.resource-card header, .agent-card header { display: flex; align-items: start; justify-content: space-between; gap: 10px; }
.resource-card h3, .agent-card h3 { margin: 0; font-size: 14px; }
.resource-card p, .agent-card p { margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.resource-card footer, .agent-card footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 13px; color: #7890a4; font-size: 11px; }
.toggle { display: inline-flex; align-items: center; gap: 6px; color: var(--paper); cursor: pointer; font-size: 12px; }
.toggle input { width: 14px; height: 14px; accent-color: var(--blue); }
.count-badge { padding: 4px 7px; border: 1px solid #31597b; border-radius: 4px; color: #a9cae8; background: #132536; font-size: 11px; }

.settings-layout { max-width: 760px; margin: 0 clamp(22px, 4vw, 54px); border-top: 1px solid var(--line); }
.setting-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 0; border-bottom: 1px solid var(--line); color: var(--muted); }
.setting-row strong { color: var(--paper); font-size: 13px; }
.card-binding { grid-template-columns: minmax(0, 1fr) 130px 100px; align-items: end; padding: 18px 0 4px; }
.card-binding .primary-button { height: 37px; padding: 8px; }

.wallet-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 clamp(22px, 4vw, 54px) 26px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.wallet-summary > div { min-width: 0; padding: 18px 16px; border-right: 1px solid var(--line); }
.wallet-summary > div:last-child { border-right: 0; }
.wallet-summary span, .wallet-summary strong { display: block; }
.wallet-summary span { color: var(--muted); font-size: 11px; }
.wallet-summary strong { margin-top: 8px; overflow: hidden; color: #dce8ef; font-size: 20px; text-overflow: ellipsis; }
.billing-layout { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(320px, 1fr) minmax(320px, 1fr); gap: 24px; padding: 0 clamp(22px, 4vw, 54px) 42px; }
.billing-section { min-width: 0; border-top: 2px solid #31556c; }
.billing-section h3 { margin: 0; padding: 13px 0; font-size: 14px; }
.billing-mode-notice, .billing-lock { margin: 0 clamp(22px, 4vw, 54px) 18px; padding: 11px 13px; border-left: 3px solid #4d8fe0; color: #a9bdc9; background: #14212b; font-size: 11px; line-height: 1.6; }
.billing-lock { margin: 14px 0 4px; border-left-color: #d7a84d; background: #241f15; }
body[data-billing-mode="wallet"] #card-binding-form, body[data-billing-mode="wallet"] #unbind-card { display: none; }
body[data-billing-mode="license"] #wallet-recharge-section, body[data-billing-mode="license"] #wallet-ledger-section, body[data-billing-mode="license"] .wallet-only, body[data-billing-mode="license"] #sidebar-balance { display: none; }
body[data-billing-mode="license"] .wallet-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body[data-billing-mode="license"] .billing-layout { grid-template-columns: minmax(320px, 560px); }
.recharge-form { grid-template-columns: minmax(0, 1fr) 140px; align-items: end; margin-bottom: 6px; }
.recharge-form .primary-button { height: 37px; padding: 8px; }
.data-list { display: grid; max-height: 420px; gap: 1px; overflow-y: auto; border-top: 1px solid var(--line-soft); }
.data-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 54px; padding: 9px 4px; border-bottom: 1px solid var(--line-soft); }
.data-row strong, .data-row span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.data-row strong { font-size: 12px; }
.data-row span { margin-top: 4px; color: var(--muted); font-size: 10px; }
.data-row b { color: #bdcbd6; font-size: 12px; white-space: nowrap; }
.data-row .compact { grid-column: 1 / -1; width: max-content; padding: 5px 9px; }

.modal-backdrop { position: fixed; z-index: 10; inset: 0; display: grid; place-items: center; padding: 18px; background: #0d1117; }
.modal-backdrop.hidden, .hidden { display: none !important; }
.license-card, .dialog-card { width: min(100%, 405px); border: 1px solid #324455; border-radius: 7px; background: #121a22; box-shadow: 0 20px 70px rgba(0, 0, 0, .42); }
.license-card { padding: 28px; }
.auth-card { width: min(100%, 470px); max-height: calc(100vh - 36px); overflow-y: auto; }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; margin: 18px 0; border-bottom: 1px solid var(--line); }
.auth-tabs button { padding: 10px; border: 0; border-bottom: 2px solid transparent; color: var(--muted); background: transparent; cursor: pointer; }
.auth-tabs button.active { border-bottom-color: var(--blue); color: var(--text); }
.auth-form { gap: 11px; }
.captcha-row { display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: end; gap: 10px; }
.captcha-row button { width: 180px; height: 38px; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 5px; background: #0d1218; cursor: pointer; }
.captcha-row img { display: block; width: 100%; height: 100%; object-fit: cover; }
.license-card .brand-mark { margin-bottom: 20px; }
.license-card h2, .dialog-card h2 { margin: 7px 0 8px; font-size: 20px; }
.license-card p { margin: 0 0 20px; color: var(--muted); line-height: 1.6; }
form { display: grid; gap: 13px; }
form label { display: grid; gap: 6px; color: #b8c6d2; font-size: 12px; }
form input, form textarea, form select { padding: 9px; }
form textarea { resize: vertical; }
.form-status { min-height: 18px; color: var(--amber); font-size: 12px; }
.license-card small { display: block; color: #718292; font-size: 11px; line-height: 1.5; }
.dialog-card { width: min(100%, 520px); padding: 18px; }
.dialog-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; }
.dialog-head h2 { margin: 0; }
.dialog-actions { display: flex; justify-content: end; gap: 8px; }
.feedback-dialog { width: min(100%, 680px); max-height: calc(100vh - 36px); overflow-y: auto; }
.feedback-template-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.feedback-dialog textarea { width:100%; height:112px !important; min-height:112px; max-height:112px; border-radius:8px; resize:none; }
.feedback-note { margin: -2px 0 0; padding: 10px 12px; border-left: 3px solid var(--amber); color: var(--muted); background: rgba(239, 180, 91, .08); font-size: 11px; line-height: 1.6; }

@media (max-width: 1080px) {
  .app-shell { grid-template-columns: 230px minmax(0, 1fr); }
  .context-bar { display: none; }
}

@media (max-width: 720px) {
  .app-shell { display: block; min-height: 0; overflow: visible; }
  .sidebar { position: fixed; z-index: 5; inset: 0 auto 0 0; width: 254px; transform: translateX(-100%); transition: transform .18s ease; box-shadow: 12px 0 30px rgba(0,0,0,.35); }
  .app-shell.nav-open .sidebar { transform: translateX(0); }
  .main-area { height: 100vh; }
  .mobile-menu { display: inline-block; }
  .topbar { padding: 10px 12px; }
  .topbar-actions .quiet-button { display: none; }
  .engine-status span { display: none; }
  .conversation-tools { flex-wrap: wrap; gap: 9px; padding: 9px 12px; }
  .run-option { padding-left: 0; border-left: 0; }
  .chat-scroll { padding: 18px 14px; }
  .empty-state { margin: 5vh auto; }
  .empty-state h2 { font-size: 21px; }
  .starter-grid { grid-template-columns: 1fr; }
  .composer-wrap { padding: 0 12px 10px; }
  .agent-status-grid { grid-template-columns: 1fr; }
  .page-heading { padding: 25px 18px 12px; }
  .page-copy { padding: 0 18px 22px; }
  .resource-grid, .agent-grid { padding: 0 18px 25px; }
  .settings-layout { margin: 0 18px; }
  .wallet-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 18px 22px; }
  .wallet-summary > div:nth-child(2) { border-right: 0; }
  .wallet-summary > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .billing-layout { grid-template-columns: 1fr; padding: 0 18px 28px; }
  .billing-mode-notice { margin: 0 18px 18px; }
  .card-binding, .recharge-form { grid-template-columns: 1fr; }
  .captcha-row { grid-template-columns: 1fr; }
}

/* Structured writing and non-chat task center */
.structured-shell, .task-center-shell { min-height: 100%; padding: 30px clamp(18px, 4vw, 58px) 70px; overflow: auto; color: #25312c; background: #f6f8f7; }
.structured-heading, .task-center-heading { display: flex; width: min(1280px, 100%); align-items: flex-end; justify-content: space-between; gap: 20px; margin: 0 auto 24px; }
.structured-heading h2, .task-center-heading h2 { margin: 5px 0; color: #17231d; font-size: 29px; letter-spacing: 0; }
.structured-heading p, .task-center-heading p { margin: 0; color: #77857e; }
.structured-steps { display: grid; width: min(900px, calc(100% - 30px)); grid-template-columns: repeat(4, 1fr); margin: 0 auto 30px; padding: 0; list-style: none; }
.structured-steps li { position: relative; display: grid; justify-items: center; gap: 8px; color: #97a19c; font-size: 12px; }
.structured-steps li::before { position: absolute; top: 17px; right: 50%; width: 100%; height: 1px; background: #d9e0dc; content: ""; }
.structured-steps li:first-child::before { display: none; }
.structured-steps b { z-index: 1; display: grid; width: 35px; height: 35px; place-items: center; border: 1px solid #d7dfda; border-radius: 50%; color: #8b9690; background: #f6f8f7; }
.structured-steps li.active, .structured-steps li.complete { color: #273a32; font-weight: 650; }
.structured-steps li.active b, .structured-steps li.complete b { border-color: #357963; color: #fff; background: #357963; }
.structured-form { width: min(1280px, 100%); margin: auto; padding: 28px 34px 22px; border: 1px solid #dce4e0; border-radius: 8px; background: #fff; box-shadow: 0 8px 24px rgba(29, 56, 43, .05); }
.structured-stage { display: none; }
.structured-stage.active { display: block; }
.structured-stage-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px; padding-bottom: 17px; border-bottom: 1px solid #e8edea; }
.structured-stage-head > span { padding: 4px 7px; border-radius: 4px; color: #2f6d5b; background: #eaf3ef; font-size: 11px; font-weight: 750; }
.structured-stage-head h3 { margin: 0; color: #24332c; font-size: 19px; }
.structured-stage-head p { margin: 5px 0 0; color: #8a9690; font-size: 12px; }
.structured-grid { display: grid; align-items:start; gap: 18px; margin-bottom: 21px; }
.structured-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.structured-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.structured-field { display: grid; min-width: 0; gap: 8px; margin-bottom: 20px; color: #3d4b44; font-size: 13px; font-weight: 650; }
.structured-field b, .deliverable-picker b { color: #cb4e47; }
.structured-field span small { margin-left: 5px; color: #95a09a; font-weight: 400; }
.structured-field input, .structured-field select, .structured-field textarea { width: 100%; min-width: 0; border: 1px solid #d9e2dd; border-radius: 7px; color: #26332d; background: #fff; box-shadow: none; }
.structured-field input, .structured-field select { height: 46px; padding: 0 14px; }
.structured-field textarea { padding: 13px 14px; resize: vertical; line-height: 1.7; }
.structured-field > small { color: #96a19b; font-size: 11px; font-weight: 400; }
.structured-field .char-count { text-align: right; }
.deliverable-picker { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 6px 0 24px; padding: 0; border: 0; }
.deliverable-picker legend { grid-column: 1 / -1; margin-bottom: 10px; color: #3d4b44; font-size: 13px; font-weight: 650; }
.deliverable-picker label { display: flex; min-height: 47px; align-items: center; justify-content: center; gap: 7px; border: 1px solid #dce4e0; border-radius: 7px; color: #4a5751; cursor: pointer; }
.deliverable-picker label:has(input:checked), .deliverable-picker label.selected { border-color: #4269f2; color: #3154d3; background: #f5f7ff; }
.deliverable-picker input { width: 15px; height: 15px; accent-color: #4269f2; }
.deliverable-picker small { padding: 2px 5px; border-radius: 3px; color: #3154d3; background: #e7ebff; font-size: 9px; }
.segmented-control { display: inline-flex; gap: 2px; margin-bottom: 20px; padding: 3px; border: 1px solid #dce4e0; border-radius: 7px; background: #f4f7f5; }
.segmented-control button { min-height: 34px; padding: 0 15px; border: 0; border-radius: 5px; color: #68756e; background: transparent; cursor: pointer; }
.segmented-control button.active { color: #245d4d; background: #fff; box-shadow: 0 1px 4px rgba(33, 56, 45, .12); }
.structured-upload { display: grid; min-height: 185px; place-items: center; align-content: center; gap: 9px; border: 1px dashed #748c82; border-radius: 8px; color: #607169; background: #edf2f0; cursor: pointer; }
.structured-upload.dragging { border-color: #3f7f6b; background: #e5f0eb; }
.structured-upload .upload-symbol { font-size: 29px; line-height: 1; }
.structured-upload strong { font-weight: 500; }
.structured-upload u { color: #315bd8; text-underline-offset: 2px; }
.structured-upload small { color: #829088; }
.structured-upload-list { display: grid; gap: 7px; margin-top: 10px; }
.structured-upload-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px; border: 1px solid #e0e7e3; border-radius: 6px; color: #526159; font-size: 12px; }
.structured-upload-item button { border: 0; color: #a24743; background: transparent; cursor: pointer; }
.outline-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.structured-review { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 24px; border-top: 1px solid #e4eae7; border-left: 1px solid #e4eae7; }
.structured-review div { padding: 14px; border-right: 1px solid #e4eae7; border-bottom: 1px solid #e4eae7; }
.structured-review span, .structured-review strong { display: block; }
.structured-review span { color: #8a9690; font-size: 11px; }
.structured-review strong { margin-top: 5px; color: #2e3b35; overflow-wrap: anywhere; }
.payment-confirm { display: flex; align-items: flex-start; gap: 10px; padding: 15px; border: 1px solid #ead8c7; border-radius: 7px; color: #66594c; background: #fffaf4; font-size: 13px; line-height: 1.6; }
.payment-confirm input { width: 16px; height: 16px; margin-top: 2px; accent-color: #3a765f; }
.payment-confirm strong { color: #be463d; }
.structured-actions { display: flex; min-height: 54px; align-items: center; justify-content: flex-end; gap: 12px; margin: 24px -34px -22px; padding: 16px 34px; border-top: 1px solid #e7ece9; }
.structured-actions .form-status { flex: 1; color: #a14843; }
.structured-actions .form-status.success { color: #287158; }
.structured-actions .form-status:empty { display: none; }
.structured-actions #structured-prev { display: inline-flex; width: 104px; min-width: 104px; height: 44px; flex: 0 0 104px; align-items: center; justify-content: center; padding: 0 15px; border-radius: 7px; }
.structured-actions #structured-next, .structured-actions #structured-submit { width: auto; min-width: 138px; height: 44px; flex: 1 1 auto; border-radius: 7px; }
.task-center-shell { width: 100%; }
.task-center-filters { display: flex; width: min(1280px, 100%); align-items: flex-end; gap: 10px; margin: 0 auto 18px; padding: 14px 16px; border: 1px solid #dce4e0; border-radius: 8px; background: #fff; box-shadow: 0 4px 12px rgba(31, 68, 50, .035); }
.task-center-filters label { position: relative; display: block; }
.task-center-filters label > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.task-center-filters select, .task-center-filters input { height: 42px; min-width: 0; padding: 0 13px; border: 1px solid #d8e1dc; border-radius: 7px; color: #34443c; background: #fff; box-shadow: none; font: inherit; font-size: 13px; outline: 0; }
.task-center-filters select { width: 170px; }
.task-center-filters .task-id-filter { width: 250px; }
.task-center-filters input { width: 100%; }
.task-center-filters select:focus, .task-center-filters input:focus { border-color: #3b8a65; box-shadow: 0 0 0 3px rgba(31, 133, 89, .09); }
.task-query-button { min-width: 82px; height: 42px; border: 0; border-radius: 7px; color: #fff; background: #1f8559; cursor: pointer; font-weight: 680; }
.task-query-button:hover { background: #176b47; }
.task-center-table { width: min(1280px, 100%); overflow: hidden; margin: auto; border: 1px solid #dce4e0; border-radius: 8px; background: #fff; box-shadow: 0 8px 24px rgba(27, 58, 43, .055); }
.task-table-head, .task-center-item { display: grid; grid-template-columns: minmax(260px, 2fr) 110px 88px 190px 92px 155px 150px; align-items: center; column-gap: 14px; }
.task-table-head { min-height: 49px; padding: 0 16px; border-bottom: 1px solid #dfe6e2; color: #85928b; background: #f1f5f3; font-size: 11px; font-weight: 650; }
.task-center-list { display: grid; }
.task-center-list > .muted { padding: 36px; text-align: center; }
.task-center-item { min-width: 0; padding: 14px 16px; border-bottom: 1px solid #e7ece9; background: #fff; }
.task-center-item:last-child { border-bottom: 0; }
.task-center-item:hover { background: #fbfdfc; }
.task-main-cell { min-width: 0; }
.task-main-cell strong, .task-main-cell span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-main-cell strong { color: #24342c; font-size: 13px; }
.task-main-cell span { margin-top: 5px; color: #86938c; font-size: 10px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.task-kind { display: inline-block; max-width: 100%; overflow: hidden; padding: 4px 7px; border-radius: 4px; color: #376b56; background: #e9f3ed; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.task-status { display: inline-block; padding: 4px 8px; border-radius: 12px; color: #5e6e66; background: #edf1ef; font-size: 10px; font-weight: 680; white-space: nowrap; }
.status-succeeded .task-status { color: #167047; background: #dff2e8; }
.status-running .task-status, .status-cancelling .task-status { color: #8a6120; background: #fbefd5; }
.status-failed .task-status { color: #a4403c; background: #f9e5e3; }
.status-cancelled .task-status { color: #6f7c75; background: #e9eeeb; }
.task-progress { min-width: 0; }
.task-progress > div { height: 3px; overflow: hidden; border-radius: 3px; background: #e4ebe7; }
.task-progress > div span { display: block; height: 100%; border-radius: inherit; background: #2e9668; }
.task-progress.is-indeterminate > div span { animation: task-progress-slide 1.35s ease-in-out infinite; }
@keyframes task-progress-slide { 0% { transform: translateX(-110%); } 100% { transform: translateX(245%); } }
.status-failed .task-progress > div span { background: #c65a53; }
.status-cancelled .task-progress > div span { background: #8fa198; }
.task-progress small { display: flex; justify-content: space-between; gap: 10px; margin-top: 6px; color: #929e98; font-size: 9px; }
.task-progress b { color: #277c59; font-size: 10px; }
.status-failed .task-progress b { color: #b24a45; }
.task-fee { color: #37463e; font-size: 12px; font-weight: 650; }
.task-center-item time { color: #7f8d85; font-size: 11px; white-space: nowrap; }
.task-center-actions { display: flex; min-width: 0; align-items: center; justify-content: flex-start; gap: 6px; flex-wrap: nowrap; }
.task-center-actions a, .task-center-actions button { display: inline-flex; min-width: 58px; min-height: 32px; align-items: center; justify-content: center; padding: 0 9px; border: 1px solid #d4dfd9; border-radius: 6px; color: #286b50; background: #fff; cursor: pointer; font-size: 11px; text-decoration: none; white-space: nowrap; }
.task-center-actions a:hover, .task-center-actions button:hover { border-color: #79ad94; background: #edf6f1; }
.task-center-actions .task-cancel { min-width: 42px; color: #a14d47; }
.task-row-detail { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px 28px; margin: 14px -16px -14px; padding: 15px 16px 17px; border-top: 1px solid #e4eae7; background: #f8faf9; }
.task-row-detail > div { min-width: 0; }
.task-row-detail span, .task-row-detail strong { display: block; }
.task-row-detail span { margin-bottom: 5px; color: #87938d; font-size: 9px; }
.task-row-detail strong { overflow-wrap: anywhere; color: #45544c; font-size: 11px; font-weight: 500; }
.task-row-detail .task-error strong { color: #b04440; }
.task-detail-files { display: flex; grid-column: 1 / -1; align-items: center; gap: 7px; flex-wrap: wrap; }
.task-detail-files > span { width: 100%; }
.task-detail-files a { padding: 5px 8px; border: 1px solid #d3dfd9; border-radius: 5px; color: #286b50; background: #fff; font-size: 10px; text-decoration: none; }
.task-empty { padding: 48px 20px; text-align: center; }
.task-empty strong { color: #526159; font-size: 13px; }
.task-empty p { margin: 7px 0 0; color: #96a19b; font-size: 11px; }
@media (max-width: 900px) { .structured-grid.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }.deliverable-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .structured-shell, .task-center-shell { padding: 20px 12px 50px; }.structured-heading, .task-center-heading { align-items: flex-start; }.structured-heading h2, .task-center-heading h2 { font-size: 23px; }.structured-form { padding: 20px 14px; }.structured-grid.two, .structured-grid.four { grid-template-columns: 1fr; }.structured-steps { width: 100%; }.structured-steps span { font-size: 10px; }.structured-actions { margin: 20px -14px -20px; padding: 14px; flex-wrap: wrap; }.structured-actions .form-status { flex-basis: 100%; }.structured-review { grid-template-columns: 1fr; }.task-center-tabs { overflow-x: auto; }.task-center-tabs button { white-space: nowrap; }.task-center-item { grid-template-columns: 1fr; }.task-center-actions { justify-content: flex-start; } }

/* 2026 modular white interface */
:root {
  --bg: #f7f9f8;
  --panel: #ffffff;
  --panel-2: #f4f7f5;
  --panel-3: #edf2ef;
  --line: #dde5e1;
  --line-soft: #e9eeeb;
  --text: #18211d;
  --muted: #748079;
  --blue: #2f8f78;
  --blue-strong: #20735f;
  --green: #33a284;
  --amber: #d29a3a;
  --red: #db6b61;
  --paper: #3e4a44;
}

* { scrollbar-color: #c8d5cf transparent; }
*::-webkit-scrollbar-thumb { background: #c8d5cf; }
body { color: var(--text); background: #f7f9f8; }
.star-field { display: none; }

.app-shell {
  display: grid;
  height: 100vh;
  grid-template-columns: 250px minmax(0, 1fr) 276px;
  grid-template-rows: 78px minmax(0, 1fr);
  overflow: hidden;
  background: #f7f9f8;
}

.global-header {
  z-index: 20;
  display: flex;
  min-width: 0;
  grid-column: 1 / -1;
  grid-row: 1;
  align-items: center;
  gap: 34px;
  padding: 12px 22px;
  border-bottom: 1px solid #e6ebe8;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 5px 24px rgba(32, 51, 43, .04);
}

.global-brand {
  display: flex;
  flex: 0 0 210px;
  align-items: center;
  gap: 11px;
  padding: 0;
  border: 0;
  color: #17201c;
  background: transparent;
  cursor: pointer;
  text-align: left;
}
.global-brand .brand-mark { width: 39px; height: 39px; border: 0; border-radius: 50%; background: #edf7f3; }
.global-brand strong, .global-brand small { display: block; }
.global-brand strong { font-size: 17px; font-weight: 750; }
.global-brand small { margin-top: 2px; color: #87918c; font-size: 10px; }

.module-nav { display: grid; min-width: 0; flex: 1; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: clamp(14px, 2vw, 34px); }
.module-nav-primary, .module-nav-account { display: flex; min-width: 0; align-items: center; gap: 6px; }
.module-nav-primary { justify-content: center; }
.module-nav-account { justify-content: flex-end; }
.logout-tab { color: #a33d3d; }
.profile-name-form { padding: 16px 0; border-bottom: 1px solid #e0e7e3; }

@media (max-width: 1600px) and (min-width: 721px) {
  .global-header { gap:12px; padding:10px 14px; }
  .global-brand { flex-basis:150px; }
  .global-brand small { display:none; }
  .module-nav { gap:8px; }
  .module-nav-primary, .module-nav-account { gap:2px; }
  .module-tab { padding:0 8px; font-size:12px; }
  .balance-tab { gap:4px; }
}

@media (max-width: 1200px) and (min-width: 721px) {
  .global-brand { flex-basis:42px; }
  .global-brand > span { display:none; }
  .module-nav-primary {
    justify-content:flex-start;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .module-nav-primary::-webkit-scrollbar { display:none; }
}

/* Survey workspace */
.survey-shell { min-height: 100%; padding: 30px clamp(18px, 3vw, 46px) 60px; color: #27342d; background: #f6f8f7; }
.survey-heading { display: flex; width: min(1380px, 100%); align-items: flex-end; justify-content: space-between; gap: 20px; margin: 0 auto 22px; }
.survey-heading h2 { margin: 5px 0; color: #17231d; font-size: 30px; letter-spacing: 0; }.survey-heading p { margin: 0; color: #7b8780; }
.survey-layout { display: grid; width: min(1380px, 100%); grid-template-columns: minmax(0, 1fr) 270px; gap: 24px; margin: auto; align-items: start; }
.survey-main { display: grid; gap: 18px; }.survey-card, .survey-submit-bar, .survey-aside section { border: 1px solid #dce5e0; border-radius: 8px; background: #fff; box-shadow: 0 6px 18px rgba(30, 66, 49, .045); }
.survey-card { padding: 20px; }.survey-card-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: -20px -20px 18px; padding: 15px 20px; border-bottom: 1px solid #e5ebe8; background: #fbfcfb; border-radius: 8px 8px 0 0; }
.survey-card-head h3 { margin: 0; color: #243129; font-size: 16px; }.survey-card-head > span { color: #839089; font-size: 12px; }
.survey-field { display: grid; gap: 8px; min-width: 0; }.survey-field > span, .survey-card legend { color: #3f4e46; font-size: 13px; font-weight: 650; }.survey-field b { color: #c54e4e; }.survey-field input, .survey-field select, .survey-card fieldset input { width: 100%; min-width: 0; height: 44px; padding: 0 14px; border: 1px solid #d9e3de; border-radius: 6px; }
.survey-field input[type="range"] { height: 28px; padding: 0; accent-color: #3d806e; box-shadow: none; }.survey-field output { float: right; color: #2b7b65; }
.survey-status { min-height: 18px; margin: 10px 0 0; color: #87928c; font-size: 12px; }.survey-status.working { color: #7a642c; }.survey-status.success { color: #287158; }.survey-status.error { color: #b54242; }
.survey-parameter-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }.survey-parameter-grid fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }.survey-parameter-grid legend { margin-bottom: 8px; }.survey-region { grid-column: 1 / -1; }.survey-region-options { display: flex; flex-wrap: wrap; gap: 8px; }.survey-region-option { min-width: 66px; height: 40px; padding: 0 13px; border: 1px solid #dce4e9; border-radius: 8px; color: #35424d; background: #fff; cursor: pointer; font-size: 14px; }.survey-region-option.selected { border-color: #4567ff; color: #2647dc; background: #f4f6ff; }.survey-region-option:hover { border-color: #8fa2ff; }
.range-pair { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 10px; }.range-pair span { color: #7e8a83; }
.survey-question-list { display: grid; gap: 12px; }.survey-question { padding: 16px; border: 1px solid #e0e7e3; border-radius: 6px; background: #fcfdfc; }.survey-question header { display: flex; align-items: flex-start; gap: 12px; }.survey-question header > span { display: grid; min-width: 34px; height: 28px; place-items: center; border-radius: 4px; color: #276b58; background: #e9f4ef; font-size: 11px; font-weight: 750; }.survey-question header strong, .survey-question header small { display: block; }.survey-question header strong { color: #27352d; line-height: 1.5; }.survey-question header small { margin-top: 3px; color: #859088; font-size: 11px; }
.survey-option-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 14px; margin-top: 14px; }.survey-option-grid label { display: grid; grid-template-columns: minmax(0, 1fr) 72px 14px; align-items: center; gap: 7px; }.survey-option-grid label > span { overflow: hidden; color: #5a675f; text-overflow: ellipsis; white-space: nowrap; }.survey-option-grid input { width: 72px; height: 34px; border-radius: 5px; }.survey-option-grid b { color: #839088; font-weight: 500; }
.survey-candidates { display: grid; gap: 7px; margin-top: 14px; color: #5d6a62; }.survey-candidates textarea { width: 100%; padding: 10px; border-radius: 5px; resize: vertical; }.survey-number-range { max-width: 430px; margin-top: 14px; }.survey-number-range input { width: 100%; height: 36px; border-radius: 5px; }
.survey-dimension { display: flex; align-items: flex-end; gap: 18px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #e8edea; }.survey-dimension label:first-child { display: grid; flex: 1; gap: 6px; color: #647169; }.survey-dimension input[type="text"] { height: 36px; border-radius: 5px; }.survey-check { display: flex; align-items: center; gap: 7px; padding-bottom: 8px; white-space: nowrap; }.survey-check input { accent-color: #367b67; }
.survey-submit-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 20px; }.survey-submit-bar strong, .survey-submit-bar span { display: block; }.survey-submit-bar strong { color: #26352d; }.survey-submit-bar span { margin-top: 4px; color: #829087; font-size: 12px; }.survey-submit-bar .send-button { min-width: 116px; min-height: 42px; border-radius: 6px; }.survey-submit-bar .send-button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.survey-aside { position: sticky; top: 20px; display: grid; gap: 14px; }.survey-aside section { padding: 18px; }.survey-aside h3 { margin: 0 0 13px; color: #29372f; font-size: 15px; }.survey-aside p { margin: 0; color: #7d8982; font-size: 12px; line-height: 1.75; }.survey-aside dl { margin: 0; }.survey-aside dl div { display: flex; justify-content: space-between; padding: 9px 0; border-bottom: 1px solid #e7ece9; }.survey-aside dl div:last-child { border: 0; }.survey-aside dt { color: #7c8881; }.survey-aside dd { margin: 0; color: #2b705d; font-weight: 650; }
.survey-task-list { display: grid; gap: 11px; }.survey-task { padding: 14px 16px; border: 1px solid #e0e7e3; border-left: 4px solid #7a9f93; border-radius: 6px; }.survey-task.status-succeeded { border-left-color: #32936d; }.survey-task.status-failed { border-left-color: #c45454; }.survey-task header { display: flex; justify-content: space-between; gap: 14px; }.survey-task header strong, .survey-task header span { display: block; }.survey-task header span { margin-top: 4px; color: #87928c; font-size: 11px; }.survey-task header b { color: #497466; font-size: 12px; }.survey-task-progress { height: 5px; margin-top: 13px; overflow: hidden; border-radius: 4px; background: #e9eeeb; }.survey-task-progress i { display: block; height: 100%; background: #3e9076; }.survey-task p { margin: 8px 0; color: #718078; font-size: 12px; overflow-wrap: anywhere; }.survey-task footer { display: flex; flex-wrap: wrap; gap: 8px; }.survey-task footer a { padding: 6px 9px; border-radius: 4px; color: #256d59; background: #eaf5f0; font-size: 11px; text-decoration: none; }.survey-task footer .quiet-button { min-height: 30px; padding: 0 11px; border-radius: 4px; font-size: 11px; }
html[data-theme="dark"] .survey-shell { color: #dce5e0; background: #111513; } html[data-theme="dark"] .survey-heading h2, html[data-theme="dark"] .survey-card-head h3, html[data-theme="dark"] .survey-aside h3, html[data-theme="dark"] .survey-question header strong, html[data-theme="dark"] .survey-submit-bar strong { color: #e4ebe7; } html[data-theme="dark"] .survey-card, html[data-theme="dark"] .survey-submit-bar, html[data-theme="dark"] .survey-aside section, html[data-theme="dark"] .survey-question, html[data-theme="dark"] .survey-task { border-color: #344039; background: #171c1a; } html[data-theme="dark"] .survey-card-head { border-color: #303a35; background: #1b211e; } html[data-theme="dark"] .survey-dimension { border-color: #303a35; } html[data-theme="dark"] .survey-region-option { border-color: #3b4841; color: #d7e0da; background: #1b211e; } html[data-theme="dark"] .survey-region-option.selected { border-color: #6b83ff; color: #c5ceff; background: #202744; }
@media (max-width: 900px) { .survey-layout { grid-template-columns: 1fr; }.survey-aside { position: static; grid-template-columns: repeat(3, minmax(0, 1fr)); }.survey-option-grid { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .survey-shell { padding: 20px 12px 40px; }.survey-heading, .survey-submit-bar { align-items: stretch; flex-direction: column; }.survey-parameter-grid, .survey-aside { grid-template-columns: 1fr; }.survey-card { padding: 15px; }.survey-card-head { margin: -15px -15px 15px; padding: 13px 15px; }.survey-dimension { align-items: stretch; flex-direction: column; gap: 8px; }.survey-check { padding: 0; } }
.module-tab {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 16px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #536059;
  background: transparent;
  cursor: pointer;
  font-size: 13px;
  font-weight: 620;
  white-space: nowrap;
  transition: color .22s ease, background .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
.module-tab:hover { color: #1f705d; background: #f1f7f4; transform: translateY(-1px); }
.module-tab.active { border-color: #cae2da; color: #176650; background: #eaf6f1; box-shadow: 0 5px 16px rgba(42, 113, 91, .08); }
.balance-tab { border-color: #eadfc7; background: #fffaf0; }
.balance-tab strong { color: #a87017; font-size: 12px; }

.sidebar { grid-column: 1; grid-row: 2; height: auto; padding: 18px 14px 14px; border-right: 1px solid #e5ebe7; background: #fbfcfb; }
.main-area { grid-column: 2; grid-row: 2; height: auto; background: #ffffff; }
.context-bar { grid-column: 3; grid-row: 2; height: auto; border-left: 1px solid #e5ebe7; background: #fbfcfb; }
.app-shell[data-layout="module"] .sidebar,
.app-shell[data-layout="module"] .context-bar,
.app-shell[data-layout="module"] .topbar { display: none; }
.app-shell[data-layout="module"] .main-area { grid-column: 1 / -1; }

.dialogue-subnav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; margin-bottom: 14px; padding: 5px; border: 1px solid #e2e9e5; border-radius: 999px; background: #f1f5f3; }
.dialogue-subnav .side-link { padding: 8px 7px; border-radius: 999px; color: #768079; text-align: center; transition: all .2s ease; }
.dialogue-subnav .side-link:hover { color: #276e5d; background: #f9fbfa; }
.dialogue-subnav .side-link.active { color: #175f4d; background: #ffffff; box-shadow: 0 4px 12px rgba(37, 69, 57, .09); }

.primary-button, .primary-small, .send-button, .quiet-button, .text-button, .icon-button, .attach-button, .stop-button {
  border-radius: 999px;
  transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.primary-button, .primary-small, .send-button { border-color: #2d8b73; color: #fff; background: #2d8b73; box-shadow: 0 7px 18px rgba(45, 139, 115, .15); }
.primary-button:hover, .primary-small:hover, .send-button:hover { background: #247660; transform: translateY(-1px); box-shadow: 0 9px 22px rgba(45, 139, 115, .22); }
.sidebar > .primary-button { min-height: 43px; }

.search-box { padding: 17px 4px 10px; color: #7c8781; }
.search-box input, input, select, textarea { border-color: #dce5e0; border-radius: 999px; color: #24302a; background: #ffffff; }
.search-box input { padding: 10px 14px; background: #f4f7f5; }
input:focus, select:focus, textarea:focus { border-color: #67ad9b; box-shadow: 0 0 0 4px rgba(64, 148, 126, .1); }
.section-label { color: #8b958f; }
.conversation-list { gap: 6px; }
.conversation-row { border-radius: 18px; }
.conversation-item { padding: 11px 13px; border: 1px solid transparent; border-radius: 18px; color: #445149; transition: all .2s ease; }
.conversation-item:hover { border-color: #e3eae6; background: #f3f7f5; transform: translateX(2px); }
.conversation-item.active { border-color: #cfe3dc; color: #1d5d4d; background: #eaf5f1; }
.conversation-delete { border-radius: 999px; color: #b5544c; background: #fff2f0; }
.sidebar-foot { border-color: #e7ece9; }
.sidebar-account { border-color: #e7ece9; }
.account-avatar { border-color: #cce1da; color: #236e5b; background: #eaf5f1; }

.topbar { min-height: 66px; padding: 11px 24px; border-color: #e8edea; background: #ffffff; }
.topic h1 { color: #1c2721; }
.topic span { color: #849088; }
.quiet-button, .icon-button, .attach-button { border-color: #dce4e0; color: #526058; background: #ffffff; }
.quiet-button:hover, .icon-button:hover, .attach-button:hover { border-color: #bcd5cc; color: #276f5d; background: #f1f7f4; transform: translateY(-1px); }
.text-button { color: #2b806a; }
.engine-status { color: #7c8881; }

.panel-view.active { animation: panel-enter .34s cubic-bezier(.2, .75, .25, 1) both; }
@keyframes panel-enter { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }

.conversation-tools { min-height: 58px; padding: 9px 24px; border-color: #edf1ef; background: #fbfcfb; }
.field-inline { color: #737f78; }
.field-inline select, .run-option select { padding: 8px 12px; border-radius: 999px; color: #334039; background: #ffffff; }
.run-option { border-color: #e4eae7; }
.team-switch { color: #4d5a53; }
.team-switch span { width: 34px; height: 20px; border-color: #cbd6d1; border-radius: 999px; background: #e6ece9; }
.team-switch span::after { width: 16px; height: 16px; background: #fff; box-shadow: 0 2px 5px rgba(34, 54, 45, .17); }
.team-switch input:checked + span { border-color: #348b74; background: #3b947c; }
.team-switch input:checked + span::after { transform: translateX(14px); background: #fff; }

.chat-scroll { background: #ffffff; }
.empty-index { display: inline-grid; width: 48px; height: 48px; place-items: center; border-radius: 50%; color: #24725f; background: #e9f5f0; font-family: inherit; font-size: 13px; font-weight: 750; }
.empty-state h2 { color: #1e2a24; }
.empty-state p { color: #7a867f; }
.starter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.starter-grid button { min-height: 58px; padding: 12px 17px; border-color: #e0e7e3; border-radius: 999px; color: #4d5a53; background: #fbfcfb; text-align: center; transition: all .2s ease; }
.starter-grid button:hover { border-color: #bdd9d0; color: #236d5a; background: #eff7f4; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(38, 92, 72, .08); }

.message-mark { border-radius: 50%; color: #226c59; background: #e5f3ee; }
.message.user .message-mark { color: #a84f47; background: #fff0ed; }
.message-content, .message.user .message-content { color: #354139; }
.message.user .message-content { border-radius: 20px; background: #f3f7f5; }
.message-meta { color: #8b958f; }
.message-thinking-body { border-color: #dfe6e2; }
.message-file-card, .message.user .message-file-card, .files-list .message-file-card { border-color: #dfe7e3; border-radius: 18px; color: #36433c; background: #ffffff; }
.message-file-card:hover { border-color: #bad6cd; background: #f4f9f7; }
.message-file-copy strong { color: #2d3933; }
.message-file-copy small { color: #849089; }
.message-file-icon { border-radius: 14px; color: #286e5d; background: #e6f2ee; }

.composer-wrap { padding: 0 24px 18px; border-color: #e9eeeb; background: #ffffff; }
.composer { border-color: #d9e3de; border-radius: 28px; background: #ffffff; box-shadow: 0 10px 32px rgba(31, 61, 48, .08); transition: border-color .2s ease, box-shadow .2s ease; }
.composer:focus-within { border-color: #69ad9b; box-shadow: 0 12px 36px rgba(31, 99, 80, .12); }
.composer textarea { color: #29352f; }
.composer-actions { border-color: #edf1ef; }
.attachment-chip, .message-attachment { border-color: #cfe2db; border-radius: 999px; color: #286e5d; background: #edf7f3; }
.run-progress { border-color: #d7e5df; border-radius: 22px; background: #f7faf8; }
.run-progress-current { border-color: #e4ebe7; }
.run-progress-current strong { color: #2a3a32; }
.run-progress-current div span { color: #728078; }
.new-message-notice { border-color: #82bbaa; border-radius: 999px; color: #245f50; background: #edf7f3; box-shadow: 0 7px 20px rgba(34, 86, 67, .12); }

.context-bar section { border-color: #e7ece9; }
.context-heading { color: #57645d; }
.team-person { border: 0; border-radius: 999px; color: #425047; background: #edf5f1; }
.files-list .message-file-card { box-shadow: 0 5px 15px rgba(33, 61, 49, .04); }

.page-heading { padding-top: 42px; }
.page-heading h2 { color: #1c2822; font-size: 27px; }
.eyebrow { color: #2f846d; font-weight: 700; }
.page-copy { color: #75827b; }
.resource-card, .agent-card { border-color: #e0e7e3; border-radius: 24px; color: #344038; background: #ffffff; box-shadow: 0 8px 22px rgba(35, 63, 51, .05); transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.resource-card:hover, .agent-card:hover { border-color: #c5ddd5; transform: translateY(-3px); box-shadow: 0 13px 30px rgba(35, 83, 63, .09); }
.resource-card h3, .agent-card h3 { color: #26332c; }
.resource-card p, .agent-card p { color: #76827b; }
.count-badge, .tag { border-radius: 999px; color: #286f5d; background: #eaf5f1; }

.wallet-summary { margin-bottom: 28px; border: 0; gap: 12px; }
.wallet-summary > div { border: 1px solid #e0e7e3; border-radius: 24px; background: #fff; box-shadow: 0 8px 22px rgba(35, 63, 51, .05); }
.wallet-summary span { color: #7a867f; }
.wallet-summary strong { color: #1d6b57; }
.billing-section { padding: 18px; border: 1px solid #e0e7e3; border-radius: 24px; background: #fff; box-shadow: 0 8px 22px rgba(35, 63, 51, .05); }
.billing-mode-notice, .billing-lock { border: 0; border-radius: 999px; color: #5d6a62; background: #f2f7f5; }
.data-row { border-color: #e8edea; }
.data-row strong { color: #35423b; }
.data-row span { color: #849088; }
.recharge-form input, .card-binding input { min-height: 42px; padding: 10px 15px; }

.settings-layout { padding: 22px; border: 1px solid #e0e7e3; border-radius: 26px; background: #fff; box-shadow: 0 10px 28px rgba(35, 63, 51, .06); }
.setting-row { border-color: #e9eeeb; }
.setting-row span { color: #77837c; }
.setting-row strong { color: #2e3b34; }

.home-view { width: min(1240px, calc(100% - 72px)); margin: auto; padding: 42px 0 56px; }
.home-intro { max-width: 710px; margin-bottom: 36px; }
.home-kicker { display: inline-flex; padding: 8px 13px; border-radius: 999px; color: #27745f; background: #e9f5f0; font-size: 10px; font-weight: 750; }
.home-intro h1 { margin: 17px 0 12px; color: #17231d; font-size: 42px; font-weight: 720; }
.home-intro p { margin: 0; color: #75827b; font-size: 16px; line-height: 1.75; }
.home-primary { display: inline-flex; min-height: 49px; align-items: center; gap: 22px; margin-top: 25px; padding: 0 9px 0 21px; border: 0; border-radius: 999px; color: #fff; background: #2f8f78; cursor: pointer; font-weight: 680; box-shadow: 0 10px 24px rgba(47, 143, 120, .2); transition: all .22s ease; }
.home-primary b { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: #2f8f78; background: #fff; }
.home-primary:hover { transform: translateY(-2px); background: #247660; box-shadow: 0 14px 30px rgba(47, 143, 120, .25); }
.module-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 15px; }
.module-card { position: relative; display: flex; min-height: 250px; flex-direction: column; align-items: flex-start; padding: 22px; border: 1px solid #e1e7e4; border-radius: 30px; color: #25322b; background: #fff; cursor: pointer; text-align: left; box-shadow: 0 9px 25px rgba(37, 64, 52, .05); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.module-card:hover { border-color: #c7dcd5; transform: translateY(-5px); box-shadow: 0 18px 38px rgba(37, 82, 63, .1); }
.module-card-icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 50%; color: #a66358; background: #fff0ed; font-size: 15px; font-weight: 750; }
.module-card:nth-child(3) .module-card-icon { color: #9a6e20; background: #fff6df; }
.module-card:nth-child(4) .module-card-icon { color: #596d9e; background: #eef2fb; }
.module-card:nth-child(5) .module-card-icon { color: #202020; background: #f0f0f0; }
.module-card.ready .module-card-icon { color: #25705d; background: #e7f4ef; }
.module-card small { position: absolute; top: 24px; right: 20px; padding: 6px 10px; border-radius: 999px; color: #a3685f; background: #fff2ef; font-size: 10px; }
.module-card.ready small { color: #26715e; background: #e8f5f0; }
.module-card strong { margin-top: 22px; font-size: 18px; }
.module-card p { margin: 9px 0 20px; color: #7a867f; font-size: 13px; line-height: 1.65; }
.module-card b { margin-top: auto; color: #367e6b; font-size: 12px; }

.development-view { display: flex; width: min(620px, calc(100% - 48px)); margin: auto; flex-direction: column; align-items: center; padding: 70px 30px; text-align: center; }
.development-icon { display: grid; width: 82px; height: 82px; place-items: center; border-radius: 50%; color: #2b7a66; background: #e8f5f0; box-shadow: 0 12px 30px rgba(47, 120, 96, .11); font-size: 24px; font-weight: 750; animation: gentle-float 3.2s ease-in-out infinite; }
.status-pill { margin-top: 24px; padding: 7px 13px; border-radius: 999px; color: #a46d1e; background: #fff5df; font-size: 11px; font-weight: 700; }
.development-view h2 { margin: 15px 0 9px; color: #1d2923; font-size: 31px; }
.development-view p { margin: 0; color: #7a867f; font-size: 14px; }
.development-view button { margin-top: 25px; padding: 11px 19px; border: 1px solid #d8e3de; border-radius: 999px; color: #356c5d; background: #fff; cursor: pointer; transition: all .2s ease; }
.development-view button:hover { border-color: #b9d4ca; background: #edf7f3; transform: translateY(-2px); }

/* Deterministic rewrite workspace */
.rewrite-shell { display: grid; min-height: 100%; grid-template-columns: 258px minmax(620px, 1fr) 330px; background: #f6f7f9; color: #202735; }
.rewrite-shell * { letter-spacing: 0; }
.rewrite-menu { border-right: 1px solid #e4e7ec; background: #fff; }
.rewrite-menu header { padding: 24px 18px 20px; border-bottom: 1px solid #eef0f4; }
.rewrite-menu header h2 { margin: 0 0 3px; font-size: 18px; letter-spacing: 0; }
.rewrite-menu header p { margin: 0; color: #8993a4; font-size: 12px; }
.rewrite-menu nav { display: grid; gap: 4px; padding: 18px 12px; }
.rewrite-menu nav button { display: grid; min-height: 48px; grid-template-columns: 25px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 8px 10px; border: 0; border-radius: 6px; color: #5d6778; text-align: left; background: transparent; }
.rewrite-menu nav button > span { display: grid; width: 24px; height: 24px; place-items: center; color: #67748b; font-size: 13px; font-weight: 700; }
.rewrite-menu nav button b { overflow: hidden; font-size: 14px; font-weight: 560; text-overflow: ellipsis; white-space: nowrap; }
.rewrite-menu nav button small { color: #9aa3b1; font-size: 10px; white-space: nowrap; }
.rewrite-menu nav button:hover { background: #eef6f1; }
.rewrite-menu nav button.active { color: #fff; background: #1f8559; box-shadow: 0 6px 14px rgba(31, 133, 89, .18); }
.rewrite-menu nav button.active > span, .rewrite-menu nav button.active small { color: #fff; }
.rewrite-workspace { min-width: 0; padding: 32px clamp(28px, 4vw, 64px) 54px; }
.rewrite-notice { display: flex; max-width: 1040px; min-height: 52px; align-items: center; gap: 12px; margin: 0 auto; padding: 11px 16px; border: 1px solid #e5c98c; border-radius: 8px; color: #596172; background: #fbf8f1; }
.rewrite-notice > span { color: #bd7c13; font-size: 19px; }
.rewrite-notice p { margin: 0; font-size: 12px; line-height: 1.7; }
.rewrite-notice strong { color: #a56a0b; }
.rewrite-heading { max-width: 1040px; margin: 24px auto 0; padding: 0 0 22px; border-bottom: 1px solid #dfe3e9; text-align: center; }
.rewrite-heading h2 { margin: 0 0 8px; color: #18202d; font-size: 27px; letter-spacing: 0; }
.rewrite-heading p { margin: 0; color: #99a3b4; font-size: 13px; }
.rewrite-tabs { display: flex; width: 250px; margin: 32px auto 8px 0; padding: 4px; border-radius: 8px; background: #e9ecf2; }
.rewrite-tabs button { min-height: 38px; flex: 1; border: 0; border-radius: 6px; color: #7c8698; background: transparent; font-weight: 650; }
.rewrite-tabs button.active { color: #176b47; background: #fff; box-shadow: 0 2px 7px rgba(26, 37, 62, .08); }
.rewrite-article-input, .rewrite-paragraph-input { max-width: 1040px; margin: 0 auto; }
.rewrite-field-label { display: flex; align-items: baseline; gap: 7px; margin: 8px 0 9px; }
.rewrite-field-label strong { font-size: 14px; }
.rewrite-field-label em { color: #d2564b; font-style: normal; }
.rewrite-field-label span { color: #9aa3b2; font-size: 11px; }
.rewrite-dropzone { display: flex; min-height: 202px; cursor: pointer; align-items: center; justify-content: center; flex-direction: column; padding: 24px; border: 1px dashed #4f7d68; border-radius: 8px; color: #c7ded2; background: #19382c; transition: border-color .16s, background .16s; }
.rewrite-dropzone:hover, .rewrite-dropzone.dragging { border-color: #68b38e; background: #204535; }
.rewrite-upload-icon { display: grid; width: 42px; height: 42px; place-items: center; margin-bottom: 10px; color: #b4d6c5; font-size: 31px; font-weight: 300; }
.rewrite-dropzone strong { font-size: 13px; font-weight: 450; }
.rewrite-dropzone u { display: inline-block; margin-left: 5px; padding: 7px 13px; border: 1px solid #31815d; border-radius: 6px; color: #84c7a6; text-decoration: none; }
.rewrite-dropzone small { margin-top: 12px; color: #9ebbad; font-size: 11px; }
.rewrite-selected { display: flex; min-height: 58px; align-items: center; justify-content: space-between; gap: 16px; margin-top: 10px; padding: 10px 14px; border: 1px solid #dfe4ed; border-radius: 7px; background: #fff; }
.rewrite-selected div { display: grid; min-width: 0; gap: 3px; }
.rewrite-selected strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.rewrite-selected span { color: #929cab; font-size: 11px; }
.rewrite-selected button { width: 32px; height: 32px; border: 0; border-radius: 50%; color: #8c96a5; background: #f0f2f6; font-size: 18px; }
.rewrite-paragraph-input > textarea, .rewrite-result textarea { width: 100%; min-height: 210px; resize: vertical; padding: 16px; border: 1px solid #d8dee8; border-radius: 8px; color: #263044; background: #fff; font: inherit; font-size: 14px; line-height: 1.8; outline: 0; }
.rewrite-paragraph-input > textarea:focus, .rewrite-result textarea:focus { border-color: #3a9068; box-shadow: 0 0 0 3px rgba(31, 133, 89, .10); }
.rewrite-result { margin-top: 18px; }
.rewrite-result header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.rewrite-result header button { min-height: 32px; padding: 0 11px; border: 1px solid #d7dce6; border-radius: 6px; color: #176b47; background: #fff; }
.rewrite-result textarea { min-height: 190px; background: #fbfcfe; }
.rewrite-submit-bar { display: flex; max-width: 1040px; align-items: center; justify-content: center; gap: 18px; margin: 34px auto 0; padding-top: 26px; border-top: 1px solid #e5e8ed; }
.rewrite-submit-bar p { max-width: 430px; margin: 0; color: #8993a3; font-size: 12px; }
.rewrite-submit-bar p.error { color: #b8453f; }
.rewrite-submit-bar p.success { color: #267559; }
.rewrite-submit-bar .send-button { min-width: 230px; min-height: 46px; justify-content: center; border: 0; background: #1f8559; }
.rewrite-submit-bar .send-button:disabled { color: #fff; background: #9ab5a8; opacity: 1; }
.rewrite-guide { margin: 32px 24px 32px 0; align-self: start; padding: 22px; border: 1px solid #e0e4eb; border-radius: 8px; background: #fff; box-shadow: 0 3px 9px rgba(27, 35, 51, .035); }
.rewrite-guide > h3 { margin: 0; padding-bottom: 15px; border-bottom: 1px solid #e5e8ed; font-size: 15px; }
.rewrite-guide ol { display: grid; gap: 21px; margin: 20px 0 0; padding: 0; list-style: none; }
.rewrite-guide li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 9px; }
.rewrite-guide li > span { display: grid; width: 28px; height: 25px; place-items: center; border-radius: 5px; color: #1f8559; background: #e5f3eb; font-size: 11px; font-weight: 750; }
.rewrite-guide li strong { color: #344055; font-size: 13px; }
.rewrite-guide li p, .rewrite-guide > section p { margin: 7px 0 0; color: #9aa3b2; font-size: 12px; line-height: 1.65; }
.rewrite-guide > section { margin-top: 22px; padding-top: 18px; border-top: 1px solid #e8ebf0; }
.rewrite-guide > section strong { color: #596477; font-size: 12px; }
html[data-theme="dark"] .rewrite-shell { color: #dce4df; background: #111513; }
html[data-theme="dark"] .rewrite-menu, html[data-theme="dark"] .rewrite-guide, html[data-theme="dark"] .rewrite-selected { border-color: #303934; background: #171c1a; }
html[data-theme="dark"] .rewrite-menu header, html[data-theme="dark"] .rewrite-heading, html[data-theme="dark"] .rewrite-guide > h3, html[data-theme="dark"] .rewrite-guide > section, html[data-theme="dark"] .rewrite-submit-bar { border-color: #303934; }
html[data-theme="dark"] .rewrite-heading h2, html[data-theme="dark"] .rewrite-menu header h2 { color: #edf3f0; }
html[data-theme="dark"] .rewrite-notice { border-color: #705c31; color: #c4bbb0; background: #262219; }
html[data-theme="dark"] .rewrite-tabs { background: #222925; }
html[data-theme="dark"] .rewrite-tabs button.active { color: #9ad5b5; background: #303936; }
html[data-theme="dark"] .rewrite-paragraph-input > textarea, html[data-theme="dark"] .rewrite-result textarea { border-color: #38423d; color: #e1e8e4; background: #171c1a; }
@keyframes gentle-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }

.modal-backdrop { background: rgba(31, 42, 36, .3); backdrop-filter: blur(8px); }
.license-card, .dialog-card, .announcement-dialog { border-color: #dfe7e3; border-radius: 30px; color: #2a362f; background: #fff; box-shadow: 0 24px 70px rgba(24, 48, 37, .16); }
.auth-tabs { border-radius: 999px; background: #f1f5f3; }
.auth-tabs button { border-radius: 999px; color: #6e7973; }
.auth-tabs button.active { color: #226a58; background: #fff; box-shadow: 0 4px 12px rgba(37, 69, 57, .09); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* 2026 visual refresh: dark stellar canvas with restrained glass surfaces. */
:root {
  --bg: #050607;
  --panel: rgba(14, 16, 18, .82);
  --panel-2: rgba(21, 24, 27, .86);
  --panel-3: #202429;
  --line: rgba(184, 205, 206, .14);
  --line-soft: rgba(184, 205, 206, .09);
  --text: #f3f5f3;
  --muted: #8e9997;
  --blue: #638b85;
  --blue-strong: #9abbb4;
  --green: #82ad94;
  --amber: #c4ad88;
  --red: #c18e8e;
  --paper: #d9e1df;
}

/* White palette corrections for legacy conversation and announcement rules. */
:root {
  --bg: #f7f9f8;
  --panel: #ffffff;
  --panel-2: #f4f7f5;
  --panel-3: #edf2ef;
  --line: #dde5e1;
  --line-soft: #e9eeeb;
  --text: #18211d;
  --muted: #748079;
  --blue: #2f8f78;
  --blue-strong: #20735f;
  --green: #33a284;
  --amber: #d29a3a;
  --red: #db6b61;
  --paper: #3e4a44;
}
body { color: var(--text); background: #f7f9f8; }
.star-field { display: none; }
.sidebar, .context-bar { border-color: #e5ebe7; background: #fbfcfb; backdrop-filter: none; }
.main-area { background: #fff; backdrop-filter: none; }
.global-brand .brand-mark, .license-card .brand-mark { width: 39px; height: 39px; padding: 0; border: 0; border-radius: 50%; background: #edf7f3; object-fit: contain; }
.primary-button, .primary-small, .send-button { border-color: #2d8b73; border-radius: 999px; color: #fff; background: #2d8b73; box-shadow: 0 7px 18px rgba(45, 139, 115, .15); }
.primary-button:hover, .primary-small:hover, .send-button:hover { background: #247660; }
.search-box input, input, select, textarea { border-color: #dce5e0; border-radius: 999px; color: #24302a; background: #fff; }
input:focus, select:focus, textarea:focus { border-color: #67ad9b; box-shadow: 0 0 0 4px rgba(64, 148, 126, .1); }
.conversation-item { border: 1px solid transparent; border-radius: 18px; color: #445149; }
.conversation-item:hover { background: #f3f7f5; }
.conversation-item.active { border-color: #cfe3dc; color: #1d5d4d; background: #eaf5f1; }
.side-link { border-radius: 999px; }
.side-link:hover, .side-link.active { color: #175f4d; background: #fff; }
.account-avatar { border-color: #cce1da; color: #236e5b; background: #eaf5f1; }
.topbar { border-color: #e8edea; background: #fff; }
.topic h1 { color: #1c2721; }
.quiet-button, .text-button, .icon-button, .attach-button, .stop-button { border-color: #dce4e0; border-radius: 999px; color: #526058; background: #fff; }
.quiet-button:hover, .icon-button:hover, .attach-button:hover { border-color: #bcd5cc; color: #276f5d; background: #f1f7f4; }
.conversation-tools { border-color: #edf1ef; background: #fbfcfb; }
.field-inline, .team-switch { color: #657169; }
.chat-scroll { background: #fff; }
.empty-index { color: #24725f; }
.empty-state p { color: #7a867f; }
.starter-grid button { border-color: #e0e7e3; border-radius: 999px; color: #4d5a53; background: #fbfcfb; }
.starter-grid button:hover { border-color: #bdd9d0; color: #236d5a; background: #eff7f4; }
.message { width: min(100%, 900px); max-width: 900px; gap: 0; align-items: flex-start; margin-bottom: 30px; }
.message-mark, .message-meta { display: none; }
.message-body { width: 100%; flex: 0 1 auto; }
.message.assistant .message-body { max-width: 100%; }
.message.user { justify-content: flex-end; }
.message.user .message-body {
  display: flex;
  width: auto;
  max-width: min(72%, 620px);
  flex: 0 1 auto;
  flex-direction: column;
  align-items: flex-end;
  gap: 9px;
}
.message-content, .message.assistant .message-content { color: #354139; }
.message.user .message-content { width: fit-content; max-width: 100%; border-color: #e3eae6; border-radius: 20px; color: #354139; background: #f3f7f5; }
.message-content h1, .message-content h2, .message-content h3, .message-content h4, .message-content strong { color: #202d26; }
.message-content a { color: #24745f; }
.message-content blockquote { border-color: #4c9b84; color: #647169; }
.message-content code { color: #266855; background: #edf6f2; }
.message-content pre { border-color: #dce5e0; background: #f5f8f6; }
.message-content pre code { color: #354139; }
.message-content th { color: #26332c; background: #edf6f2; }
.message-thinking-body { border-color: #dfe6e2; }
.message-run-status, .message-worklog-empty, .message-worklog-entry { color: #75817a; }
.message-worklog-entry + .message-worklog-entry { border-color: #e7ece9; }
.message-worklog-entry strong { color: #34423a; }
.message-worklog-entry code { color: #286b59; background: #edf6f2; }
.message-worklog-entry pre { border-color: #dfe7e3; background: #f6f9f7; }
.message-attachment { border-color: #cfe2db; border-radius: 999px; color: #286e5d; background: #edf7f3; }
.composer-wrap { border-color: #e9eeeb; background: #fff; }
.composer { border-color: #d9e3de; border-radius: 28px; background: #fff; box-shadow: 0 10px 32px rgba(31, 61, 48, .08); }
.composer:focus-within { border-color: #69ad9b; box-shadow: 0 12px 36px rgba(31, 99, 80, .12); }
.composer-actions { border-color: #edf1ef; }
.context-heading { color: #57645d; }
.resource-card, .agent-card { border-color: #e0e7e3; border-radius: 24px; color: #344038; background: #fff; }
.resource-card:hover, .agent-card:hover { border-color: #c5ddd5; }
.count-badge { border-color: #cfe2db; border-radius: 999px; color: #286f5d; background: #eaf5f1; }
.billing-section { border-color: #e0e7e3; }
.billing-mode-notice, .billing-lock { border: 0; color: #5d6a62; background: #f2f7f5; }
.modal-backdrop { background: rgba(31, 42, 36, .3); backdrop-filter: blur(8px); }
.license-card, .dialog-card { border-color: #dfe7e3; border-radius: 30px; color: #2a362f; background: #fff; box-shadow: 0 24px 70px rgba(24, 48, 37, .16); }
.license-card .brand-mark { margin-bottom: 12px; }
.auth-tabs button.active { color: #226a58; }
.announcement-trigger > span { color: #2f8f78; }
.announcement-dialog { border-color: #dfe7e3; border-radius: 28px; color: #2a362f; background: #fff; box-shadow: 0 24px 70px rgba(24, 48, 37, .16); }
.announcement-header { border-color: #e5ebe7; background: #f7faf8; }
.announcement-mark, .announcement-state { border-color: #cfe2db; border-radius: 50%; color: #27705e; background: #eaf5f1; }
.announcement-summary, .announcement-item, .announcement-detail-meta { border-color: #e8edea; }
.announcement-summary strong { color: #4e5d55; }
.announcement-item { color: #27342d; }
.announcement-item:hover, .announcement-item.unread { background: #f1f7f4; }
.announcement-item.unread .announcement-copy strong { color: #1f2c25; }
.announcement-detail-label { border-radius: 999px; color: #27705e; background: #eaf5f1; }
.announcement-detail-content { color: #3c4942; }
.announcement-detail-foot { border-color: #e5ebe7; background: #fff; }
.message-file-card, .message.user .message-file-card, .files-list .message-file-card { border-color: #dfe7e3; border-radius: 18px; color: #36433c; background: #fff; }
.message-file-card:hover { border-color: #bad6cd; background: #f4f9f7; }
.message-file-icon { border-radius: 14px; color: #286e5d; background: #e6f2ee; }
.message-file-copy strong { color: #2d3933; }
.message-file-copy small { color: #849089; }

@layer legacy-dark-theme {
body {
  background: #050607;
  color: var(--text);
  font-family: Inter, "Segoe UI", "Microsoft YaHei", system-ui, sans-serif;
}

.star-field {
  position: fixed;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background: transparent;
}

.app-shell { position: relative; z-index: 1; }
.sidebar, .context-bar {
  background: rgba(8, 10, 12, .74);
  border-color: var(--line);
  backdrop-filter: blur(18px) saturate(105%);
}
.main-area { background: rgba(9, 11, 13, .52); backdrop-filter: blur(7px); }
.sidebar { padding: 19px 13px 13px; }

.brand { gap: 11px; padding: 4px 8px 21px; }
.brand-mark {
  display: block;
  flex: 0 0 auto;
  width: 42px;
  height: 54px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  object-fit: contain;
  object-position: center;
}
.brand strong { font-size: 18px; font-weight: 740; letter-spacing: .4px; line-height: 1.2; }
.brand span, .eyebrow { color: #6f8985; letter-spacing: 1.35px; }

.primary-button, .primary-small, .send-button {
  border-color: rgba(174, 199, 193, .74);
  border-radius: 6px;
  color: #041110;
  background: #93afa9;
  box-shadow: 0 7px 22px rgba(103, 143, 136, .14);
}
.primary-button:hover, .primary-small:hover, .send-button:hover { background: #a8c1bc; }
.search-box input, input, select, textarea {
  border-color: var(--line);
  border-radius: 6px;
  background: rgba(3, 5, 6, .58);
}
input:focus, select:focus, textarea:focus { border-color: rgba(154, 187, 180, .72); box-shadow: 0 0 0 3px rgba(103, 143, 136, .11); }

.conversation-item { border-left-color: transparent; border-radius: 6px; }
.conversation-item:hover { background: rgba(113, 155, 152, .09); }
.conversation-item.active { border-left-color: #9abbb4; background: rgba(103, 143, 136, .14); }
.side-link { border-radius: 6px; transition: color .18s ease, background .18s ease; }
.side-link:hover, .side-link.active { color: #e8fbf8; background: rgba(115, 164, 158, .1); }
.account-avatar { border-color: rgba(154, 187, 180, .42); background: rgba(63, 91, 87, .32); }

.topbar { border-color: var(--line); background: rgba(8, 10, 12, .46); }
.topic h1 { font-weight: 650; letter-spacing: .15px; }
.engine-status i { background: var(--amber); box-shadow: 0 0 12px rgba(231, 180, 106, .45); }
.engine-status.ready i { background: var(--green); box-shadow: 0 0 11px rgba(105, 220, 167, .6); }
.quiet-button, .text-button, .icon-button, .attach-button, .stop-button {
  border-color: var(--line);
  border-radius: 6px;
  background: rgba(21, 25, 28, .62);
}
.quiet-button:hover, .icon-button:hover, .attach-button:hover { border-color: rgba(154, 187, 180, .45); background: rgba(103, 143, 136, .12); }
.conversation-tools { border-color: var(--line-soft); background: rgba(12, 14, 16, .38); }
.field-inline, .team-switch { color: #a7b4b1; }
.field-inline + .field-inline, .run-option { border-color: var(--line-soft); }

.chat-scroll { background: rgba(6, 8, 9, .16); }
.empty-state { max-width: 700px; margin: max(9vh, 68px) auto; }
.empty-index { color: #9abbb4; }
.empty-state h2 { font-size: 29px; font-weight: 650; letter-spacing: .2px; }
.empty-state p { color: #99a6a3; }
.starter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 660px; }
.starter-grid button {
  min-height: 68px;
  padding: 13px 14px;
  border-color: var(--line);
  border-radius: 6px;
  background: rgba(18, 22, 24, .58);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.starter-grid button:hover { border-color: rgba(154, 187, 180, .54); background: rgba(103, 143, 136, .12); transform: translateY(-2px); }
.message { max-width: 900px; }
.message-mark { border: 1px solid rgba(154, 187, 180, .36); border-radius: 6px; background: rgba(63, 91, 87, .33); }
.message.user .message-mark { background: rgba(29, 110, 128, .43); }
.message-content { color: #dbe4e1; }
.message-attachment { border-color: rgba(154, 187, 180, .26); color: #c2d6d1; background: rgba(45, 68, 65, .24); }

.composer-wrap { border-color: var(--line); background: rgba(8, 10, 12, .65); }
.composer { border-color: rgba(188, 209, 207, .22); border-radius: 8px; background: rgba(5, 7, 8, .7); box-shadow: 0 16px 34px rgba(0, 0, 0, .16); }
.composer:focus-within { border-color: rgba(154, 187, 180, .72); box-shadow: 0 0 0 3px rgba(103, 143, 136, .1), 0 16px 34px rgba(0, 0, 0, .18); }
.composer-actions { border-color: var(--line-soft); }
.send-button { min-width: 72px; }
.context-bar section { border-color: var(--line-soft); }
.context-heading { color: #b9c6c3; }

.resource-card, .agent-card { border-color: var(--line); border-radius: 7px; background: rgba(18, 22, 24, .66); }
.resource-card:hover, .agent-card:hover { border-color: rgba(154, 187, 180, .36); }
.count-badge { border-color: rgba(154, 187, 180, .32); color: #c3d7d2; background: rgba(103, 143, 136, .12); }
.wallet-summary, .settings-layout { border-color: var(--line); }
.wallet-summary > div, .setting-row { border-color: var(--line); }
.billing-section { border-top-color: rgba(154, 187, 180, .46); }
.billing-mode-notice, .billing-lock { border-left-color: #9abbb4; background: rgba(103, 143, 136, .1); }

.modal-backdrop { z-index: 10; background: rgba(2, 3, 4, .34); backdrop-filter: blur(3px); }
.license-card, .dialog-card { max-width: calc(100vw - 36px); border-color: rgba(188, 209, 207, .2); border-radius: 8px; background: rgba(13, 16, 18, .94); box-shadow: 0 28px 90px rgba(0, 0, 0, .58); }
.license-card .brand-mark { width: 58px; height: 82px; margin-bottom: 12px; }
.auth-tabs button.active { border-bottom-color: #9abbb4; color: #e8efed; }

@media (max-width: 720px) {
  .modal-backdrop { padding: 14px; }
  .license-card, .dialog-card, .auth-card { width: 100%; }
  .sidebar { background: rgba(8, 10, 12, .94); }
  .starter-grid { grid-template-columns: 1fr; }
  .empty-state { margin: 6vh auto; }
  .empty-state h2 { font-size: 24px; }
}

.announcement-trigger { position: relative; display: inline-flex; min-width: 78px; align-items: center; justify-content: center; gap: 7px; }
.announcement-trigger > span { color: #9abbb4; font-size: 9px; }
.announcement-trigger b { display: grid; min-width: 18px; height: 18px; place-items: center; padding: 0 5px; border-radius: 9px; color: #fff; background: #b44f59; font-size: 10px; line-height: 1; }
.announcement-backdrop { z-index: 12; }
.announcement-dialog { width: min(680px, calc(100vw - 48px)); max-height: min(760px, calc(100vh - 48px)); overflow: hidden; border: 1px solid rgba(188, 209, 207, .2); border-radius: 8px; background: #12181d; box-shadow: 0 28px 90px rgba(0, 0, 0, .64); }
.announcement-header { display: flex; min-height: 72px; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px; border-bottom: 1px solid var(--line); background: #172027; }
.announcement-header > div { display: flex; align-items: center; gap: 11px; }
.announcement-header h2 { margin: 0; font-size: 18px; }
.announcement-mark { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid rgba(154, 187, 180, .45); border-radius: 6px; color: #e9f5f2; background: rgba(103, 143, 136, .2); font-weight: 800; }
.announcement-summary { display: flex; align-items: center; justify-content: space-between; padding: 13px 20px; border-bottom: 1px solid var(--line-soft); color: var(--muted); font-size: 11px; }
.announcement-summary strong { color: #b9cac6; font-weight: 600; }
.announcement-list { max-height: min(610px, calc(100vh - 170px)); overflow-y: auto; }
.announcement-item { display: grid; width: 100%; min-height: 78px; grid-template-columns: 42px minmax(0, 1fr) 22px; align-items: center; gap: 12px; padding: 13px 20px; border: 0; border-bottom: 1px solid var(--line-soft); color: var(--text); background: transparent; cursor: pointer; text-align: left; }
.announcement-item:hover { background: rgba(103, 143, 136, .08); }
.announcement-item.unread { background: rgba(103, 143, 136, .055); }
.announcement-state { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid rgba(154, 187, 180, .18); border-radius: 6px; color: #9abbb4; background: rgba(103, 143, 136, .08); font-size: 12px; }
.announcement-item.unread .announcement-state::after { width: 8px; height: 8px; border-radius: 50%; background: #7fc7b8; content: ""; box-shadow: 0 0 10px rgba(127, 199, 184, .55); }
.announcement-copy { min-width: 0; }
.announcement-copy strong, .announcement-copy time { display: block; }
.announcement-copy strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.announcement-item.unread .announcement-copy strong { color: #f4f8f7; font-weight: 700; }
.announcement-copy time { margin-top: 7px; color: var(--muted); font-size: 10px; }
.announcement-arrow { color: #61716f; font-size: 24px; text-align: right; }
.announcement-empty { display: grid; min-height: 180px; place-items: center; margin: 0; color: var(--muted); }
.announcement-detail { max-height: calc(100vh - 120px); overflow-y: auto; padding: 26px 32px 0; }
.announcement-back { margin-bottom: 24px; }
.announcement-detail-label { display: inline-block; padding: 4px 8px; border-radius: 4px; color: #bcd2cd; background: rgba(103, 143, 136, .16); font-size: 10px; }
.announcement-detail h2 { margin: 12px 0 8px; font-size: 22px; line-height: 1.45; }
.announcement-detail-meta { padding-bottom: 22px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 11px; }
.announcement-detail-content { min-height: 150px; padding: 26px 0; color: #d3ddda; font-size: 14px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.announcement-detail-foot { display: flex; position: sticky; bottom: 0; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 0 18px; border-top: 1px solid var(--line); background: #12181d; color: var(--muted); font-size: 11px; }

/* Formatted conversation content, compact execution summaries, and in-thread files. */
.message { width: min(100%, 900px); max-width: 900px; gap: 0; align-items: flex-start; margin-bottom: 30px; }
.message-mark, .message-meta { display: none; }
.message-body { width: 100%; flex: 0 1 auto; }
.message.assistant .message-body { max-width: 100%; }
.message.user { justify-content: flex-end; }
.message.user .message-body {
  display: flex;
  width: auto;
  max-width: min(72%, 620px);
  flex-direction: column;
  align-items: flex-end;
  gap: 9px;
}
.message.user .message-content {
  width: fit-content;
  max-width: 100%;
  padding: 11px 15px;
  border: 1px solid rgba(255, 255, 255, .045);
  border-radius: 8px;
  color: #f3f4f2;
  background: #292b2c;
  line-height: 1.65;
  text-align: left;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.message.pending .message-content:empty { display: none; }
.message.assistant .message-content { color: #e0e3df; font-size: 14px; line-height: 1.65; white-space: normal; overflow-wrap: anywhere; }
.message.assistant .message-content > :first-child { margin-top: 0; }
.message.assistant .message-content > :last-child { margin-bottom: 0; }
.message-content h1, .message-content h2, .message-content h3, .message-content h4 {
  margin: .9em 0 .3em;
  color: #f5f6f4;
  font-weight: 680;
  line-height: 1.38;
  letter-spacing: 0;
}
.message-content h1 { font-size: 21px; }
.message-content h2 { font-size: 18px; }
.message-content h3 { font-size: 16px; }
.message-content h4 { font-size: 14px; }
.message-content p { margin: .4em 0; }
.message-content ul, .message-content ol { margin: .4em 0; padding-left: 1.55em; }
.message-content li { margin: .12em 0; padding-left: .2em; }
.message-content li > p { margin: .12em 0; }
.message-content li > ul, .message-content li > ol { margin: .18em 0; }
.message-content li::marker { color: #aeb7b4; }
.message-content strong { color: #f2f4f1; font-weight: 700; }
.message-content a { color: #9fc6be; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.message-content blockquote { margin: .65em 0; padding: 2px 0 2px 14px; border-left: 3px solid #638b85; color: #b7c0bd; }
.message-content code {
  padding: 2px 5px;
  border-radius: 4px;
  color: #d8e9e4;
  background: rgba(116, 151, 143, .14);
  font-family: "Cascadia Code", Consolas, monospace;
  font-size: .9em;
}
.message-content pre { max-width: 100%; margin: .65em 0; padding: 14px 16px; overflow: auto; border: 1px solid var(--line); border-radius: 6px; background: rgba(2, 4, 5, .72); }
.message-content pre code { padding: 0; color: #d8dedc; background: transparent; }
.message-content table { display: block; max-width: 100%; margin: .65em 0; overflow-x: auto; border-collapse: collapse; }
.message-content th, .message-content td { padding: 8px 10px; border: 1px solid var(--line); text-align: left; }
.message-content th { color: #f1f4f2; background: rgba(103, 143, 136, .12); }
.message-content hr { margin: .9em 0; border: 0; border-top: 1px solid var(--line); }

.message-thinking { margin: 1px 0 18px; }
.message-thinking summary {
  display: grid;
  width: fit-content;
  max-width: 100%;
  grid-template-columns: minmax(0, auto) 18px;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  list-style: none;
}
.message-thinking summary::-webkit-details-marker { display: none; }
.message-thinking summary::after { color: #69716f; content: "›"; font-size: 17px; line-height: 1; transition: transform .16s ease; }
.message-thinking[open] summary::after { transform: rotate(90deg); }
.message-run-status {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  color: #818a87;
  font-size: 11px;
  line-height: 1.5;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.message-run-status::before { margin-right: 6px; color: #93aaa5; content: "·"; }
.message-thinking-body { max-width: 780px; margin-top: 12px; padding-left: 17px; border-left: 1px solid rgba(173, 184, 181, .22); }
.message-worklog-empty { color: #767f7c; font-size: 11px; line-height: 1.7; }
.message-worklog-entry { padding: 0 0 13px; color: #929a97; font-size: 12px; line-height: 1.75; overflow-wrap: anywhere; }
.message-worklog-entry + .message-worklog-entry { padding-top: 13px; border-top: 1px solid rgba(173, 184, 181, .08); }
.message-worklog-entry > :first-child { margin-top: 0; }
.message-worklog-entry > :last-child { margin-bottom: 0; }
.message-worklog-entry p { margin: .45em 0; }
.message-worklog-entry ul, .message-worklog-entry ol { margin: .5em 0; padding-left: 1.4em; }
.message-worklog-entry strong { color: #abb3b0; }
.message-worklog-entry code { padding: 1px 4px; border-radius: 3px; color: #afc3be; background: rgba(103, 143, 136, .11); }
.message-worklog-entry pre { max-width: 100%; padding: 10px; overflow: auto; border: 1px solid var(--line-soft); border-radius: 5px; background: rgba(2, 4, 5, .45); }

.message-file-section { width: 100%; margin-top: 16px; }
.message-file-section.upload { width: auto; margin-top: 0; }
.message-file-label { margin-bottom: 8px; color: #8f9895; font-size: 12px; }
.message-file-section.upload .message-file-label { display: none; }
.message-file-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.message-file-section.upload .message-file-grid { grid-template-columns: minmax(0, 300px); }
.message-file-card {
  display: grid;
  width: 100%;
  min-width: 0;
  min-height: 66px;
  grid-template-columns: 42px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 10px;
  padding: 10px;
  overflow: hidden;
  border: 1px solid rgba(173, 187, 183, .18);
  border-radius: 8px;
  color: #e7eae7;
  background: #202324;
  cursor: pointer;
  text-align: left;
  transition: border-color .16s ease, background .16s ease;
}
.message-file-card:hover { border-color: rgba(154, 187, 180, .45); background: #25292a; }
.message-file-card:disabled { cursor: default; opacity: .62; }
.message-file-icon { display: grid; width: 38px; height: 42px; place-items: center; border-radius: 6px; color: #d8e8e4; background: rgba(90, 131, 124, .28); font-size: 9px; font-weight: 750; }
.message-file-copy { min-width: 0; }
.message-file-copy strong, .message-file-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.message-file-copy strong { color: #ecf0ed; font-size: 12px; font-weight: 600; }
.message-file-copy small { margin-top: 5px; color: #838c89; font-size: 10px; }
.message-file-action { color: #9abbb4; font-size: 18px; text-align: center; }
.message.user .message-file-card { background: #2a2c2d; }
.files-list { gap: 7px; }
.files-list .message-file-card { min-height: 58px; grid-template-columns: 34px minmax(0, 1fr) 18px; padding: 8px; border-radius: 6px; background: rgba(25, 29, 31, .72); }
.files-list .message-file-icon { width: 31px; height: 35px; font-size: 8px; }
.files-list .message-file-action { font-size: 15px; }

@media (max-width: 720px) {
  .message { margin-bottom: 24px; }
  .message.user .message-body { max-width: 88%; }
  .message.user .message-content { padding: 10px 12px; }
  .message-file-grid { grid-template-columns: 1fr; }
  .message-thinking summary { max-width: calc(100vw - 28px); }
  .message-thinking-body { padding-left: 12px; }
}
}

/* Markdown block separators must not inherit the legacy pre-wrap conversation rule. */
.message.assistant .message-content {
  line-height: 1.65;
  white-space: normal;
}

@media (max-width: 720px) {
  .app-shell, .app-shell[data-module] {
    display: grid;
    width: 100%;
    min-width: 0;
    height: 100vh;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 64px minmax(0, 1fr);
    overflow: hidden;
  }
  .global-header, .app-shell[data-module] .global-header {
    position: relative;
    width: 100%;
    min-width: 0;
    grid-column: 1;
    grid-row: 1;
    gap: 8px;
    padding: 8px 56px 8px 10px;
  }
  .global-brand, .app-shell[data-module] .global-brand { flex: 0 0 42px; }
  .global-brand > span, .app-shell[data-module] .global-brand > span { display: none; }
  .global-brand .brand-mark, .app-shell[data-module] .global-brand .brand-mark { width: 36px; height: 36px; }
  .module-nav, .app-shell[data-module] .module-nav {
    display: flex;
    min-width: 0;
    justify-content: flex-start;
    gap: 3px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }
  .module-nav-primary, .module-nav-account { flex: 0 0 auto; gap: 3px; }
  .module-nav-account { margin-left: 8px; }
  .module-nav::-webkit-scrollbar { display: none; }
  .module-tab, .app-shell[data-module] .module-tab { min-height: 38px; flex: 0 0 auto; padding: 0 9px; font-size: 12px; }
  .theme-toggle, .app-shell[data-module] .theme-toggle {
    position:absolute;
    top:13px;
    right:10px;
    z-index:2;
    width:38px;
    height:38px;
    flex:0 0 38px;
  }
  .sidebar { position: fixed; z-index: 30; inset: 64px auto 0 0; width: 254px; transform: translateX(-100%); }
  .app-shell.nav-open .sidebar { transform: translateX(0); }
  .main-area, .app-shell[data-module] .main-area { width: 100%; min-width: 0; height: auto; grid-column: 1; grid-row: 2; }
}

/* Structured writing and task center dark theme. These views are declared
   after the shared theme rules, so their module-specific colors live here. */
html[data-theme="dark"] .structured-shell,
html[data-theme="dark"] .task-center-shell {
  color: #dce5e0;
  background: #111513;
}
html[data-theme="dark"] .structured-heading h2,
html[data-theme="dark"] .task-center-heading h2 { color: #edf3f0; }
html[data-theme="dark"] .structured-heading p,
html[data-theme="dark"] .task-center-heading p { color: #8f9b95; }
html[data-theme="dark"] .structured-steps li { color: #7f8b85; }
html[data-theme="dark"] .structured-steps li::before { background: #35403b; }
html[data-theme="dark"] .structured-steps b {
  border-color: #3b4842;
  color: #9aa69f;
  background: #171c1a;
}
html[data-theme="dark"] .structured-steps li.active,
html[data-theme="dark"] .structured-steps li.complete { color: #b8e2d5; }
html[data-theme="dark"] .structured-steps li.active b,
html[data-theme="dark"] .structured-steps li.complete b {
  border-color: #65b49d;
  color: #10201b;
  background: #65b49d;
}
html[data-theme="dark"] .structured-form {
  border-color: #303a35;
  background: #171c1a;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .22);
}
html[data-theme="dark"] .structured-stage-head,
html[data-theme="dark"] .structured-actions { border-color: #303a35; }
html[data-theme="dark"] .structured-stage-head > span,
html[data-theme="dark"] .task-kind {
  color: #a9ddce;
  background: #20332d;
}
html[data-theme="dark"] .structured-stage-head h3 { color: #e7eeea; }
html[data-theme="dark"] .structured-stage-head p,
html[data-theme="dark"] .structured-field > small,
html[data-theme="dark"] .structured-field span small { color: #8f9b95; }
html[data-theme="dark"] .structured-field,
html[data-theme="dark"] .deliverable-picker legend { color: #cbd5d0; }
html[data-theme="dark"] .structured-field input,
html[data-theme="dark"] .structured-field select,
html[data-theme="dark"] .structured-field textarea {
  border-color: #3b4842;
  color: #e7eeea;
  background: #121715;
}
html[data-theme="dark"] .structured-field input:-webkit-autofill,
html[data-theme="dark"] .structured-field input:-webkit-autofill:hover,
html[data-theme="dark"] .structured-field input:-webkit-autofill:focus {
  -webkit-text-fill-color: #e7eeea;
  caret-color: #e7eeea;
  box-shadow: 0 0 0 1000px #121715 inset;
}
html[data-theme="dark"] .deliverable-picker label {
  border-color: #35413b;
  color: #b8c3bd;
  background: #181e1b;
}
html[data-theme="dark"] .deliverable-picker label:has(input:checked),
html[data-theme="dark"] .deliverable-picker label.selected {
  border-color: #65b49d;
  color: #b8e2d5;
  background: #1c302a;
}
html[data-theme="dark"] .deliverable-picker small {
  color: #a9ddce;
  background: #263a34;
}
html[data-theme="dark"] .segmented-control {
  border-color: #35413b;
  background: #121715;
}
html[data-theme="dark"] .segmented-control button { color: #909c96; }
html[data-theme="dark"] .segmented-control button.active {
  color: #b8e2d5;
  background: #26332e;
  box-shadow: 0 1px 5px rgba(0, 0, 0, .3);
}
html[data-theme="dark"] .structured-upload {
  border-color: #4b6259;
  color: #abb7b1;
  background: #1b211e;
}
html[data-theme="dark"] .structured-upload.dragging {
  border-color: #65b49d;
  background: #1d302a;
}
html[data-theme="dark"] .structured-upload u { color: #9ed7c6; }
html[data-theme="dark"] .structured-upload small { color: #849089; }
html[data-theme="dark"] .structured-upload-item {
  border-color: #303a35;
  color: #b7c3bd;
  background: #181e1b;
}
html[data-theme="dark"] .structured-review { border-color: #35403b; }
html[data-theme="dark"] .structured-review div { border-color: #35403b; }
html[data-theme="dark"] .structured-review span { color: #8f9b95; }
html[data-theme="dark"] .structured-review strong { color: #e0e8e4; }
html[data-theme="dark"] .payment-confirm {
  border-color: #594b30;
  color: #c9bda7;
  background: #282217;
}
html[data-theme="dark"] .payment-confirm strong { color: #eaa39d; }
html[data-theme="dark"] .task-center-filters,
html[data-theme="dark"] .task-center-table,
html[data-theme="dark"] .task-center-item { border-color: #303a35; background: #171c1a; }
html[data-theme="dark"] .task-center-filters select,
html[data-theme="dark"] .task-center-filters input { border-color: #3b4842; color: #e2ebe6; background: #121715; }
html[data-theme="dark"] .task-table-head { border-color: #303a35; color: #8f9b95; background: #202723; }
html[data-theme="dark"] .task-center-item { border-bottom-color: #303a35; }
html[data-theme="dark"] .task-center-item:hover { background: #1a231e; }
html[data-theme="dark"] .task-main-cell strong { color: #e7eeea; }
html[data-theme="dark"] .task-main-cell span,
html[data-theme="dark"] .task-center-item time { color: #8f9b95; }
html[data-theme="dark"] .task-status { color: #aebbb4; background: #29332e; }
html[data-theme="dark"] .status-succeeded .task-status { color: #9ed7b9; background: #1f3b2d; }
html[data-theme="dark"] .status-running .task-status,
html[data-theme="dark"] .status-cancelling .task-status { color: #e1c889; background: #3c321d; }
html[data-theme="dark"] .status-failed .task-status { color: #e2a19d; background: #402724; }
html[data-theme="dark"] .task-progress > div { background: #35423b; }
html[data-theme="dark"] .task-fee { color: #cbd7d0; }
html[data-theme="dark"] .task-center-actions a,
html[data-theme="dark"] .task-center-actions button {
  border-color: #3b4842;
  color: #b8e2d5;
  background: #181e1b;
}
html[data-theme="dark"] .task-row-detail { border-color: #303a35; background: #131916; }
html[data-theme="dark"] .task-row-detail strong { color: #c8d4cd; }
html[data-theme="dark"] .task-detail-files a { border-color: #3b4842; color: #b8e2d5; background: #181e1b; }

/* Product polish: compact Chinese-first controls and higher task readability. */
.eyebrow { display: none; }
.module-card-icon::before { font-size: 24px; font-weight: 500; line-height: 1; }
.icon-write::before { content: "✎"; }
.icon-structure::before { content: "▤"; }
.icon-survey::before { content: "◫"; }
.icon-rewrite::before { content: "↗"; }
.icon-diagram::before { content: "⌘"; }
.task-center-item { min-height: 86px; padding: 19px 16px; }
.task-main-cell strong { font-size: 15px; }
.task-main-cell span, .task-center-item time, .task-fee { font-size: 12px; }
.context-heading .text-button { color: #246b59; background: transparent; }
html[data-theme="dark"] {
  --bg: #080a09; --panel: #0d100f; --panel-2: #121614; --panel-3: #181d1a;
  --line: #27302b; --line-soft: #1c231f; --text: #eef3ef; --muted: #a0aaa4;
}
html[data-theme="dark"] body, html[data-theme="dark"] .app-shell,
html[data-theme="dark"] .main-area, html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .context-bar { background: #080a09; }
html[data-theme="dark"] .main-area { background: #0b0e0c; }
html[data-theme="dark"] .context-heading .text-button { color: #d9e7e1; background: #fff; border-color: #fff; }
html[data-theme="dark"] .context-heading .text-button:hover { color: #0b0e0c; background: #e8efeb; }

/* Keep the structured-writing form focused while leaving room for guidance. */
.structured-layout {
  display: grid;
  width: min(1540px, 100%);
  grid-template-columns: minmax(0, 1fr) 320px;
  align-items: start;
  gap: 30px;
  margin: 0 auto;
}
.structured-workspace { min-width: 0; }
.structured-workspace .structured-heading,
.structured-workspace .structured-form { width: 100%; }
.structured-workspace .structured-steps { width: min(900px, calc(100% - 30px)); }
.structured-help {
  position: sticky;
  top: 24px;
  padding: 22px;
  border: 1px solid #dce4e0;
  border-radius: 8px;
  color: #405048;
  background: #fff;
  box-shadow: 0 8px 24px rgba(29, 56, 43, .05);
}
.structured-help-head { padding-bottom: 18px; border-bottom: 1px solid #e6ece8; }
.structured-help-head > span {
  display: inline-flex;
  padding: 4px 7px;
  border-radius: 4px;
  color: #2f6d5b;
  background: #eaf3ef;
  font-size: 11px;
  font-weight: 750;
}
.structured-help h3 { margin: 10px 0 7px; color: #24332c; font-size: 17px; }
.structured-help p { margin: 0; color: #7f8c85; font-size: 12px; line-height: 1.65; }
.structured-help-steps { display: grid; gap: 18px; margin: 20px 0; padding: 0; list-style: none; }
.structured-help-steps li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; }
.structured-help-steps b {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border-radius: 50%;
  color: #2e6b59;
  background: #eaf3ef;
  font-size: 10px;
}
.structured-help-steps strong { display: block; margin-bottom: 4px; color: #35443c; font-size: 13px; }
.structured-help-note { padding: 14px; border: 1px solid #eadcc9; border-radius: 7px; background: #fffaf4; }
.structured-help-note strong { display: block; margin-bottom: 4px; color: #8d6033; font-size: 12px; }
.structured-help-note p { color: #806d5a; }
html[data-theme="dark"] .structured-help {
  border-color: #303a35;
  color: #dce5e0;
  background: #171c1a;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .22);
}
html[data-theme="dark"] .structured-help-head { border-color: #303a35; }
html[data-theme="dark"] .structured-help-head > span,
html[data-theme="dark"] .structured-help-steps b { color: #a9ddce; background: #20332d; }
html[data-theme="dark"] .structured-help h3,
html[data-theme="dark"] .structured-help-steps strong { color: #e7eeea; }
html[data-theme="dark"] .structured-help p { color: #8f9b95; }
html[data-theme="dark"] .structured-help-note { border-color: #594b30; background: #282217; }
html[data-theme="dark"] .structured-help-note strong { color: #e2b55f; }
html[data-theme="dark"] .structured-help-note p { color: #c9bda7; }

/* Diagram generation */
.diagram-shell { display: grid; min-height: 100%; grid-template-columns: 258px minmax(620px, 1fr) 330px; color: #202735; background: #f6f7f9; }
.diagram-shell * { letter-spacing: 0; }
.diagram-menu { border-right: 1px solid #e4e7ec; background: #fff; }
.diagram-menu header { padding: 24px 18px 20px; border-bottom: 1px solid #eef0f4; }
.diagram-menu header h2 { margin: 0 0 3px; color: #18202d; font-size: 18px; }
.diagram-menu header p { margin: 0; color: #8993a4; font-size: 12px; }
.diagram-type-tabs { display: grid; gap: 4px; padding: 18px 12px; }
.diagram-type-tabs button { display: grid; min-height: 48px; grid-template-columns: 25px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 8px 10px; border: 0; border-radius: 6px; color: #5d6778; text-align: left; background: transparent; cursor: pointer; }
.diagram-type-tabs button > span { display: grid; width: 24px; height: 24px; place-items: center; color: #67748b; font-size: 12px; font-weight: 750; }
.diagram-type-tabs button b { overflow: hidden; font-size: 14px; font-weight: 560; text-overflow: ellipsis; white-space: nowrap; }
.diagram-type-tabs button small { color: #9aa3b1; font-size: 10px; white-space: nowrap; }
.diagram-type-tabs button:hover { background: #eef6f1; }
.diagram-type-tabs button.active { color: #fff; background: #1f8559; box-shadow: 0 6px 14px rgba(31, 133, 89, .18); }
.diagram-type-tabs button.active > span, .diagram-type-tabs button.active small { color: #fff; }
.diagram-workspace { min-width: 0; padding: 32px clamp(28px, 4vw, 64px) 54px; }
.diagram-notice { display: flex; max-width: 1040px; min-height: 52px; align-items: center; gap: 12px; margin: 0 auto; padding: 11px 16px; border: 1px solid #e5c98c; border-radius: 8px; color: #596172; background: #fbf8f1; }
.diagram-notice > span { color: #bd7c13; font-size: 19px; }
.diagram-notice p { margin: 0; font-size: 12px; line-height: 1.7; }
.diagram-notice strong { color: #a56a0b; }
.diagram-heading { max-width: 1040px; margin: 24px auto 0; padding: 0 0 22px; border-bottom: 1px solid #dfe3e9; text-align: center; }
.diagram-heading h2 { margin: 0 0 8px; color: #18202d; font-size: 27px; }
.diagram-heading p { margin: 0; color: #99a3b4; font-size: 13px; }
.diagram-input-tabs { display: flex; width: min(390px, 100%); margin: 32px auto 8px 0; padding: 4px; border-radius: 8px; background: #e9ecf2; }
.diagram-input-tabs button { min-height: 38px; flex: 1; padding: 0 10px; border: 0; border-radius: 6px; color: #7c8698; background: transparent; font-weight: 650; cursor: pointer; }
.diagram-input-tabs button.active { color: #176b47; background: #fff; box-shadow: 0 2px 7px rgba(26, 37, 62, .08); }
.diagram-field { display: grid; max-width: 1040px; gap: 9px; margin: 0 auto; }
.diagram-field > span { font-size: 14px; font-weight: 700; }
.diagram-field b { color: #d2564b; }
.diagram-field textarea { width: 100%; min-height: 310px; resize: vertical; padding: 16px; border: 1px solid #d8dee8; border-radius: 8px; color: #263044; background: #fff; font: 14px/1.8 Consolas, "Microsoft YaHei", monospace; outline: 0; overflow-wrap: anywhere; }
.diagram-field textarea:focus { border-color: #3a9068; box-shadow: 0 0 0 3px rgba(31, 133, 89, .10); }
.diagram-field > small { justify-self: end; color: #9aa3b2; font-size: 10px; }
.diagram-submit-bar { display: flex; max-width: 1040px; align-items: center; justify-content: center; gap: 18px; margin: 26px auto 0; padding-top: 26px; border-top: 1px solid #e5e8ed; }
.diagram-submit-bar p { max-width: 430px; margin: 0; color: #8993a3; font-size: 12px; line-height: 1.6; }
.diagram-submit-bar p.success { color: #267559; }
.diagram-submit-bar p.error { color: #b8453f; }
.diagram-submit-bar .send-button { min-width: 230px; min-height: 46px; justify-content: center; border: 0; background: #1f8559; }
.diagram-guide { margin: 32px 24px 32px 0; align-self: start; padding: 22px; border: 1px solid #e0e4eb; border-radius: 8px; background: #fff; box-shadow: 0 3px 9px rgba(27, 35, 51, .035); }
.diagram-guide > h3 { margin: 0; padding-bottom: 15px; border-bottom: 1px solid #e5e8ed; font-size: 15px; }
.diagram-guide ol { display: grid; gap: 21px; margin: 20px 0 0; padding: 0; list-style: none; }
.diagram-guide li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 9px; }
.diagram-guide li > span { display: grid; width: 28px; height: 25px; place-items: center; border-radius: 5px; color: #1f8559; background: #e5f3eb; font-size: 11px; font-weight: 750; }
.diagram-guide li strong { color: #344055; font-size: 13px; }
.diagram-guide li p, .diagram-guide > section p { margin: 7px 0 0; color: #9aa3b2; font-size: 12px; line-height: 1.65; }
.diagram-guide > section { margin-top: 22px; padding-top: 18px; border-top: 1px solid #e8ebf0; }
.diagram-guide > section strong { color: #596477; font-size: 12px; }
html[data-theme="dark"] .diagram-shell { color: #dce4df; background: #111513; }
html[data-theme="dark"] .diagram-menu, html[data-theme="dark"] .diagram-guide { border-color: #303934; background: #171c1a; }
html[data-theme="dark"] .diagram-menu header, html[data-theme="dark"] .diagram-heading, html[data-theme="dark"] .diagram-guide > h3, html[data-theme="dark"] .diagram-guide > section, html[data-theme="dark"] .diagram-submit-bar { border-color: #303934; }
html[data-theme="dark"] .diagram-heading h2, html[data-theme="dark"] .diagram-menu header h2 { color: #edf3f0; }
html[data-theme="dark"] .diagram-notice { border-color: #705c31; color: #c4bbb0; background: #262219; }
html[data-theme="dark"] .diagram-input-tabs { background: #222925; }
html[data-theme="dark"] .diagram-input-tabs button.active { color: #9ad5b5; background: #303936; }
html[data-theme="dark"] .diagram-field textarea { border-color: #38423d; color: #e1e8e4; background: #171c1a; }
@media (max-width: 1240px) { .diagram-shell { grid-template-columns: 226px minmax(0, 1fr); }.diagram-guide { grid-column: 2; margin: 0 28px 32px; }.diagram-workspace { padding-bottom: 32px; } }
@media (max-width: 780px) { .module-grid { grid-template-columns: 1fr; }.diagram-shell { display: block; }.diagram-menu { border-right: 0; border-bottom: 1px solid #e4e7ec; }.diagram-menu header { padding: 18px 16px 14px; }.diagram-type-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; }.diagram-workspace { padding: 22px 16px 30px; }.diagram-guide { margin: 0 16px 30px; }.diagram-submit-bar { align-items: stretch; flex-direction: column; }.diagram-submit-bar .send-button { width: 100%; }.diagram-heading h2 { font-size: 24px; } }
@media (max-width: 460px) { .diagram-type-tabs { grid-template-columns: 1fr; }.diagram-input-tabs { width: 100%; }.diagram-input-tabs button { padding: 0 6px; font-size: 12px; }.diagram-field textarea { min-height: 260px; }.diagram-guide { padding: 18px; } }
@media (max-width: 1220px) {
  .structured-layout { grid-template-columns: minmax(0, 1fr); }
  .structured-help { position: static; }
}

/* Agent-site theme contract: canvases stay neutral; controls use the configured accent. */
html[data-agent-site="true"] {
  --agent-soft: color-mix(in srgb, var(--agent-accent) 14%, white);
  --agent-soft-strong: color-mix(in srgb, var(--agent-accent) 24%, white);
  --agent-border: color-mix(in srgb, var(--agent-accent) 48%, white);
  --agent-ink: color-mix(in srgb, var(--agent-accent) 68%, #251a0f);
}

html[data-agent-site="true"] .module-nav-account { flex-shrink:0; }
html[data-agent-site="true"] textarea { border-radius:8px; resize:none; }
html[data-agent-site="true"] .theme-toggle {
  display:grid !important;
  visibility:visible;
  opacity:1;
  border-color:var(--agent-border);
  color:var(--agent-ink);
  background:var(--agent-soft);
}
html[data-agent-site="true"] .theme-toggle:hover {
  border-color:var(--agent-accent);
  color:var(--agent-ink);
  background:var(--agent-soft-strong);
}

html[data-agent-site="true"]:not([data-theme="dark"]) body,
html[data-agent-site="true"]:not([data-theme="dark"]) .app-shell,
html[data-agent-site="true"]:not([data-theme="dark"]) .main-area,
html[data-agent-site="true"]:not([data-theme="dark"]) .panel-view,
html[data-agent-site="true"]:not([data-theme="dark"]) .chat-scroll,
html[data-agent-site="true"]:not([data-theme="dark"]) .composer-wrap,
html[data-agent-site="true"]:not([data-theme="dark"]) .survey-shell,
html[data-agent-site="true"]:not([data-theme="dark"]) .structured-shell,
html[data-agent-site="true"]:not([data-theme="dark"]) .task-center-shell,
html[data-agent-site="true"]:not([data-theme="dark"]) .rewrite-shell,
html[data-agent-site="true"]:not([data-theme="dark"]) .diagram-shell { background:#fff; }

html[data-agent-site="true"]:not([data-theme="dark"]) .sidebar,
html[data-agent-site="true"]:not([data-theme="dark"]) .context-bar,
html[data-agent-site="true"]:not([data-theme="dark"]) .global-header,
html[data-agent-site="true"]:not([data-theme="dark"]) .topbar,
html[data-agent-site="true"]:not([data-theme="dark"]) .conversation-tools { background:#fff; }

html[data-agent-site="true"] .primary-button,
html[data-agent-site="true"] .primary-small,
html[data-agent-site="true"] .send-button,
html[data-agent-site="true"] .home-primary,
html[data-agent-site="true"] .task-query-button,
html[data-agent-site="true"] .rewrite-submit-bar .send-button,
html[data-agent-site="true"] .diagram-submit-bar .send-button,
html[data-agent-site="true"] .rewrite-menu nav button.active,
html[data-agent-site="true"] .diagram-type-tabs button.active,
html[data-agent-site="true"] .structured-steps li.active b,
html[data-agent-site="true"] .structured-steps li.complete b {
  border-color:var(--agent-accent);
  color:var(--agent-accent-contrast);
  background:var(--agent-accent);
  box-shadow:none;
}

html[data-agent-site="true"] .primary-button:hover,
html[data-agent-site="true"] .primary-small:hover,
html[data-agent-site="true"] .send-button:hover,
html[data-agent-site="true"] .home-primary:hover,
html[data-agent-site="true"] .task-query-button:hover { background:color-mix(in srgb, var(--agent-accent) 82%, #24170c); }

html[data-agent-site="true"] .module-tab.active,
html[data-agent-site="true"] .dialogue-subnav .side-link.active,
html[data-agent-site="true"] .rewrite-tabs button.active,
html[data-agent-site="true"] .diagram-input-tabs button.active,
html[data-agent-site="true"] .segmented-control button.active,
html[data-agent-site="true"] .conversation-item.active {
  border-color:var(--agent-border);
  color:var(--agent-ink);
  background:var(--agent-soft);
}

html[data-agent-site="true"] .structured-stage-head > span,
html[data-agent-site="true"] .structured-help-head > span,
html[data-agent-site="true"] .structured-help-steps b,
html[data-agent-site="true"] .diagram-guide li > span,
html[data-agent-site="true"] .rewrite-guide li > span,
html[data-agent-site="true"] .task-kind,
html[data-agent-site="true"] .status-succeeded .task-status,
html[data-agent-site="true"] .module-card small,
html[data-agent-site="true"] .module-card.ready small,
html[data-agent-site="true"] .count-badge,
html[data-agent-site="true"] .tag,
html[data-agent-site="true"] .team-person,
html[data-agent-site="true"] .home-kicker,
html[data-agent-site="true"] .status-pill {
  color:var(--agent-ink);
  background:var(--agent-soft);
}

html[data-agent-site="true"] .module-card-icon,
html[data-agent-site="true"] .module-card.ready .module-card-icon,
html[data-agent-site="true"] .empty-index,
html[data-agent-site="true"] .development-icon,
html[data-agent-site="true"] .message-file-icon,
html[data-agent-site="true"] .account-avatar {
  border-color:var(--agent-border);
  color:var(--agent-ink);
  background:var(--agent-soft-strong);
}

html[data-agent-site="true"] .deliverable-picker label:has(input:checked),
html[data-agent-site="true"] .deliverable-picker label.selected {
  border-color:var(--agent-accent);
  color:var(--agent-ink);
  background:var(--agent-soft);
}
html[data-agent-site="true"] .deliverable-picker input,
html[data-agent-site="true"] .payment-confirm input { accent-color:var(--agent-accent); }
html[data-agent-site="true"] .deliverable-picker small { color:var(--agent-ink); background:var(--agent-soft); }
html[data-agent-site="true"] .team-switch input:checked + span { border-color:var(--agent-accent); background:var(--agent-accent); }

html[data-agent-site="true"] .rewrite-dropzone {
  border-color:var(--agent-border);
  color:var(--agent-ink);
  background:var(--agent-soft);
}
html[data-agent-site="true"] .rewrite-dropzone:hover,
html[data-agent-site="true"] .rewrite-dropzone.dragging,
html[data-agent-site="true"] .structured-upload.dragging { border-color:var(--agent-accent); background:var(--agent-soft-strong); }
html[data-agent-site="true"] .rewrite-dropzone u { border-color:var(--agent-accent); color:var(--agent-ink); background:#fff; }
html[data-agent-site="true"] .rewrite-dropzone small { color:color-mix(in srgb, var(--agent-ink) 72%, #777); }

html[data-agent-site="true"] .task-progress > div span,
html[data-agent-site="true"] .run-progress-steps li.active::before,
html[data-agent-site="true"] .run-progress-steps li.complete::before { background:var(--agent-accent); }
html[data-agent-site="true"] .task-center-filters select:focus,
html[data-agent-site="true"] .task-center-filters input:focus,
html[data-agent-site="true"] .diagram-field textarea:focus,
html[data-agent-site="true"] .rewrite-paragraph-input > textarea:focus,
html[data-agent-site="true"] .rewrite-result textarea:focus,
html[data-agent-site="true"] input:focus,
html[data-agent-site="true"] select:focus,
html[data-agent-site="true"] textarea:focus,
html[data-agent-site="true"] .composer:focus-within { border-color:var(--agent-accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--agent-accent) 18%, transparent); }

html[data-agent-site="true"] .wallet-summary strong,
html[data-agent-site="true"] .eyebrow,
html[data-agent-site="true"] .text-button,
html[data-agent-site="true"] .context-heading .text-button,
html[data-agent-site="true"] .module-card b,
html[data-agent-site="true"] .message-content a { color:var(--agent-ink); }

html[data-agent-site="true"][data-theme="dark"] {
  --agent-soft:color-mix(in srgb, var(--agent-accent) 18%, #050505);
  --agent-soft-strong:color-mix(in srgb, var(--agent-accent) 28%, #050505);
  --agent-border:color-mix(in srgb, var(--agent-accent) 58%, #111);
  --agent-ink:color-mix(in srgb, var(--agent-accent) 72%, white);
}
html[data-agent-site="true"][data-theme="dark"] body,
html[data-agent-site="true"][data-theme="dark"] .app-shell,
html[data-agent-site="true"][data-theme="dark"] .main-area,
html[data-agent-site="true"][data-theme="dark"] .panel-view,
html[data-agent-site="true"][data-theme="dark"] .chat-scroll,
html[data-agent-site="true"][data-theme="dark"] .composer-wrap,
html[data-agent-site="true"][data-theme="dark"] .survey-shell,
html[data-agent-site="true"][data-theme="dark"] .structured-shell,
html[data-agent-site="true"][data-theme="dark"] .task-center-shell,
html[data-agent-site="true"][data-theme="dark"] .rewrite-shell,
html[data-agent-site="true"][data-theme="dark"] .diagram-shell,
html[data-agent-site="true"][data-theme="dark"] .sidebar,
html[data-agent-site="true"][data-theme="dark"] .context-bar,
html[data-agent-site="true"][data-theme="dark"] .global-header,
html[data-agent-site="true"][data-theme="dark"] .topbar,
html[data-agent-site="true"][data-theme="dark"] .conversation-tools { color:#f3f3f3; background:#000; }

html[data-agent-site="true"][data-theme="dark"] .module-card,
html[data-agent-site="true"][data-theme="dark"] .billing-section,
html[data-agent-site="true"][data-theme="dark"] .wallet-summary > div,
html[data-agent-site="true"][data-theme="dark"] .settings-layout,
html[data-agent-site="true"][data-theme="dark"] .structured-form,
html[data-agent-site="true"][data-theme="dark"] .structured-help,
html[data-agent-site="true"][data-theme="dark"] .task-center-filters,
html[data-agent-site="true"][data-theme="dark"] .task-center-table,
html[data-agent-site="true"][data-theme="dark"] .task-center-item,
html[data-agent-site="true"][data-theme="dark"] .rewrite-menu,
html[data-agent-site="true"][data-theme="dark"] .rewrite-guide,
html[data-agent-site="true"][data-theme="dark"] .diagram-menu,
html[data-agent-site="true"][data-theme="dark"] .diagram-guide,
html[data-agent-site="true"][data-theme="dark"] .license-card,
html[data-agent-site="true"][data-theme="dark"] .dialog-card { border-color:#242424; color:#eee; background:#0a0a0a; }
html[data-agent-site="true"][data-theme="dark"] .rewrite-dropzone { color:var(--agent-ink); background:var(--agent-soft); }
html[data-agent-site="true"][data-theme="dark"] .rewrite-dropzone u { color:var(--agent-ink); background:#0a0a0a; }

html[data-agent-site="true"][data-theme="dark"] .global-header,
html[data-agent-site="true"][data-theme="dark"] .sidebar,
html[data-agent-site="true"][data-theme="dark"] .context-bar,
html[data-agent-site="true"][data-theme="dark"] .topbar,
html[data-agent-site="true"][data-theme="dark"] .conversation-tools,
html[data-agent-site="true"][data-theme="dark"] .chat-scroll,
html[data-agent-site="true"][data-theme="dark"] .composer-wrap,
html[data-agent-site="true"][data-theme="dark"] .composer,
html[data-agent-site="true"][data-theme="dark"] .composer-actions,
html[data-agent-site="true"][data-theme="dark"] .dialogue-subnav,
html[data-agent-site="true"][data-theme="dark"] .sidebar-foot,
html[data-agent-site="true"][data-theme="dark"] .sidebar-account,
html[data-agent-site="true"][data-theme="dark"] .context-bar section {
  border-color:#242424;
}

html[data-agent-site="true"][data-theme="dark"] input,
html[data-agent-site="true"][data-theme="dark"] select,
html[data-agent-site="true"][data-theme="dark"] textarea,
html[data-agent-site="true"][data-theme="dark"] .search-box input,
html[data-agent-site="true"][data-theme="dark"] .composer,
html[data-agent-site="true"][data-theme="dark"] .composer textarea,
html[data-agent-site="true"][data-theme="dark"] .composer-actions,
html[data-agent-site="true"][data-theme="dark"] .field-inline select,
html[data-agent-site="true"][data-theme="dark"] .run-option select,
html[data-agent-site="true"][data-theme="dark"] .starter-grid button,
html[data-agent-site="true"][data-theme="dark"] .run-progress,
html[data-agent-site="true"][data-theme="dark"] .dialog-card,
html[data-agent-site="true"][data-theme="dark"] .feedback-dialog,
html[data-agent-site="true"][data-theme="dark"] .announcement-dialog,
html[data-agent-site="true"][data-theme="dark"] .license-card {
  border-color:#2a2a2a;
  color:#f1f1f1;
  background:#090909;
}

html[data-agent-site="true"][data-theme="dark"] input::placeholder,
html[data-agent-site="true"][data-theme="dark"] textarea::placeholder { color:#777; }
html[data-agent-site="true"][data-theme="dark"] .modal-backdrop { background:#000; }
html[data-agent-site="true"][data-theme="dark"] .feedback-note,
html[data-agent-site="true"][data-theme="dark"] .announcement-detail-foot { border-color:#2a2a2a; background:#0d0d0d; }
