/* Product UI 0.2.0: shared neutral + logo-orange primitives from ../components/tokens.css.
   Loaded after style.css so legacy layout rules keep working while color, control and
   state recipes come from one place. No business behavior and no persisted settings. */

:root {
  --bg: var(--ui-bg);
  --panel: var(--ui-panel);
  --subtle: var(--ui-subtle);
  --line: var(--ui-border);
  --line-strong: var(--ui-border-strong);
  --text: var(--ui-text);
  --muted: var(--ui-muted);
  --brand: var(--ui-accent);
  --brand-dark: var(--ui-accent);
  --brand-logo: var(--ui-brand-logo);
  --user-bubble: var(--ui-accent-soft);
  --code-bg: var(--ui-subtle);
  --danger: var(--ui-danger);
  --danger-soft: var(--ui-danger-soft);
  --success: var(--ui-success);
  --warning: var(--ui-warning);
  --focus-ring: 0 0 0 3px color-mix(in srgb, var(--ui-accent) 16%, transparent);
}

html, body { background: var(--ui-bg); }
body { color: var(--ui-text); font-family: var(--ui-font); }
::selection { background: color-mix(in srgb, var(--ui-brand-logo) 32%, transparent); }
button, input, select, textarea { font-family: inherit; }
input::placeholder, textarea::placeholder { color: var(--ui-muted); opacity: .86; }

/* Shared icon and menu recipes */
.gg-icon { display: inline-block; width: 16px; height: 16px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; line-height: 0; }
.gg-action-menu { position: fixed; z-index: 95; min-width: 178px; padding: 5px; border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-panel); box-shadow: var(--ui-shadow); }
.gg-action-menu button { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 34px; padding: 7px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--ui-text); font-size: var(--ui-font-caption); text-align: left; }
.gg-action-menu button:hover, .gg-action-menu button:focus-visible { background: var(--ui-subtle); outline: none; }
.gg-action-menu button.danger { color: var(--ui-danger); }
.gg-action-menu button:disabled { opacity: .42; }
.gg-action-menu hr { margin: 5px 4px; border: 0; border-top: 1px solid var(--ui-border); }

/* Login */
.login-wrap { background: radial-gradient(circle at 50% 18%, color-mix(in srgb, var(--ui-brand-logo) 14%, transparent), transparent 34%), var(--ui-bg); }
.login-card { width: min(400px, calc(100vw - 32px)); padding: 36px 30px 32px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-lg); background: var(--ui-panel); box-shadow: var(--ui-shadow); }
.login-card h1 { color: var(--ui-text); font-size: var(--ui-font-title); font-weight: 600; line-height: var(--ui-leading-title); letter-spacing: -.02em; }
.login-card .sub { color: var(--ui-muted); font-size: var(--ui-font-ui); line-height: var(--ui-leading-ui); }
.login-scope { color: var(--ui-muted); font-size: var(--ui-font-caption); line-height: 1.75; text-wrap: pretty; }
.login-scope b { color: var(--ui-accent); }
.login-card input { min-height: var(--ui-control); padding: 8px 11px; margin-bottom: 11px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); font-size: var(--ui-font-ui); }
.login-card input:hover { border-color: var(--ui-border-strong); }
.login-card input:focus { border-color: var(--ui-accent); box-shadow: var(--focus-ring); }
.login-card button { min-height: 40px; border: 1px solid var(--ui-accent); border-radius: var(--ui-radius); background: var(--ui-accent); color: var(--ui-on-accent); font-size: var(--ui-font-body); font-weight: 500; box-shadow: none; }
.login-card button:hover { background: var(--ui-accent-hover); filter: none; }
.error, .form-error { color: var(--ui-danger); }

/* Shell and sidebar */
.chat { background: var(--ui-bg); }
.sidebar { width: var(--sidebar-width, 268px); padding: 15px 12px 12px; border-right: 1px solid var(--ui-border); background: var(--ui-bg); }
.brand { gap: 10px; padding: 4px 6px 16px; color: var(--ui-text); font-size: var(--ui-font-subtitle); font-weight: 600; line-height: var(--ui-leading-title); }
.brand-logo { width: 34px; height: 34px; border-radius: 0; background: transparent; object-fit: contain; }
.brand .gg-icon, #sidebar-close .gg-icon { width: 15px; height: 15px; }
#new-conv { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 8px 12px; border: 1px solid var(--ui-accent); border-radius: var(--ui-radius); background: var(--ui-accent); color: var(--ui-on-accent); font-size: var(--ui-font-ui); font-weight: 500; box-shadow: 0 1px 2px color-mix(in srgb, var(--ui-accent) 22%, transparent); }
#new-conv:hover { background: var(--ui-accent-hover); filter: none; }
#new-conv:active { background: var(--ui-accent-pressed); }
.sidebar-tools { display: flex; gap: 6px; margin-top: 10px; }
.conv-search-wrap { display: flex; align-items: center; gap: 7px; flex: 1; min-width: 0; height: var(--ui-control); padding: 0 9px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-muted); overflow: hidden; }
.conv-search-wrap:focus-within { border-color: var(--ui-accent); box-shadow: var(--focus-ring); }
.conv-search-wrap .gg-icon { width: 14px; height: 14px; }
.conv-search { width: 100%; min-width: 0; height: 100%; margin: 0; padding: 0; border: 0; outline: 0; background: transparent; color: var(--ui-text); font: var(--ui-font-ui)/normal var(--ui-font); line-height: calc(var(--ui-control) - 2px); }
.conv-search::-webkit-search-cancel-button { width: 14px; height: 14px; }
/* Shared icon-input recipe from components/topic.css (.input-with-icon): the icon is
   positioned inside the field and the input owns its left inset. */
.input-with-icon { position: relative; display: flex; align-items: center; min-height: var(--ui-control); color: var(--ui-muted); }
.input-with-icon > span { position: absolute; left: 10px; top: 50%; z-index: 1; display: block; width: 16px; height: 16px; transform: translateY(-50%); color: var(--ui-muted); pointer-events: none; }
.input-with-icon > span > .gg-icon { display: block; width: 16px; height: 16px; }
.conv-search-wrap.input-with-icon { gap: 0; padding: 0; }
.conv-search-wrap.input-with-icon .conv-search { height: var(--ui-control); padding-left: 34px; }
.sidebar-tool-button { display: grid; place-items: center; flex-shrink: 0; width: var(--ui-control); height: var(--ui-control); border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-muted); }
.sidebar-tool-button:hover { background: var(--ui-subtle); color: var(--ui-text); }
.sidebar-tool-button .gg-icon { width: 15px; height: 15px; }
/* 中文字形在行框里略偏高：按实测把这一行的图标与文字做 1px 级光学对齐，
   使标题文字、展开/收起图标和加号在同一视觉中心线上。 */
.tree-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 15px 5px 5px; color: var(--ui-muted); font-size: var(--ui-font-micro); letter-spacing: .02em; line-height: 1; }
/* 中文字形墨迹比图标高约 0.5px：用亚像素位移对齐，padding 会被取整反而偏。 */
.tree-heading > span:first-child { transform: translateY(.5px); }
.tree-add { display: grid; place-items: center; width: 24px; height: 24px; margin: -4px -2px -4px 0; padding: 0; border: 0; border-radius: 5px; background: transparent; color: var(--ui-muted); }
.tree-add:hover { background: var(--ui-hover); color: var(--ui-text); }
/* 图标被包在行内 span 里时会带 1px 级行框偏移，使加号比文字和展开图标低；
   span 改为网格并去掉行高后，所有图标都落在按钮的同一中心线上。 */
.tree-add > span{display:grid;place-items:center;line-height:0}
.tree-add .gg-icon { width: 15px; height: 15px; }
.tree-heading-actions{display:flex;align-items:center;gap:2px}
.tree-heading-actions .tree-add{margin:0}
.folder-row .folder-label { cursor: pointer; }
.folder-toolbar { color: var(--ui-muted); }
.folder-toolbar button { display: grid; place-items: center; width: 28px; height: 28px; color: var(--ui-muted); }
.folder-toolbar button .gg-icon { width: 15px; height: 15px; }
.folder-toolbar button:hover { background: var(--ui-hover); color: var(--ui-text); }
.new-conv-folder { padding: 1px 6px 6px; color: var(--ui-muted); }

.conv-list { margin-top: 4px; scrollbar-width: thin; scrollbar-color: var(--ui-border-strong) transparent; }
.folder-row, .conv-item { min-height: var(--ui-row); border-radius: 6px; color: var(--ui-text); }
.folder-row { cursor: default; }
.folder-label { cursor: default; }
.folder-row { margin-top: 2px; padding: 0 3px; }
.conv-item { margin-top: 3px; padding: 2px 2px 2px 4px; }
.folder-row { margin-top: 3px; }
.folder-row:hover, .conv-item:hover { background: var(--ui-subtle); }
.folder-row.selected, .conv-item.active { background: var(--ui-accent-soft); color: var(--ui-accent); }
.folder-label, .conv-open { padding: 7px 2px; color: inherit; font-size: var(--ui-font-caption); line-height: 20px; }
.conv-open { padding: 8px 1px; }
.conv-item.active .conv-open { font-weight: 500; }
.folder-count { color: var(--ui-muted); font-size: var(--ui-font-micro); font-variant-numeric: tabular-nums; }
/* Selected C: keep the filled row, but separate it from a current child by a real gap. */
.folder-contents { margin-top: 5px; margin-left: 10px; padding-top: 4px; padding-left: 10px; border-left: 1px solid var(--ui-border); }
.conv-list > .conv-item + .conv-item { margin-top: 3px; }
.root-divider { height: 1px; margin: 12px 5px 9px; background: var(--ui-border); }
.conv-item .conv-quick { width: 26px; min-width: 26px; }
.folder-toggle, .folder-icon, .tree-grip { color: var(--ui-muted); }
.folder-icon { display: inline-grid; place-items: center; }
.folder-icon:hover { background: var(--ui-hover); color: var(--ui-text); }
.folder-toggle .gg-icon, .folder-icon .gg-icon { width: 15px; height: 15px; }
.tree-grip .gg-icon { width: 14px; height: 14px; }
.folder-toggle:hover, .folder-icon:hover, .tree-grip:hover { background: var(--ui-hover); color: var(--ui-text); }
.tree-grip { opacity: .45; }
.folder-row:hover .tree-grip, .conv-item:hover .tree-grip, .tree-grip:focus-visible { opacity: 1; }
.tree-section-label { color: var(--ui-muted); }
.folder-empty { color: var(--ui-muted); }

#sidebar-resizer { background: transparent; }
#sidebar-resizer:hover, #sidebar-resizer:focus-visible, .sidebar-resizing #sidebar-resizer { background: color-mix(in srgb, var(--ui-accent) 35%, transparent); }
[data-drop=inside] { background: var(--ui-accent-soft) !important; box-shadow: inset 0 0 0 1.5px var(--ui-accent); }
[data-drop=before]::before, [data-drop=after]::after { background: var(--ui-accent); }
[data-drop=invalid] { box-shadow: inset 0 0 0 1.5px var(--ui-danger); }

/* Account footer */
.sidebar-foot { margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--ui-border); }
.account-row { padding: 2px 6px 10px; }
.account-avatar { width: 31px; height: 31px; border: 1px solid color-mix(in srgb, var(--ui-brand-logo) 22%, var(--ui-border)); background: color-mix(in srgb, var(--ui-brand-logo) 14%, var(--ui-panel)); color: color-mix(in srgb, var(--ui-brand-logo) 62%, var(--ui-text)); font-size: var(--ui-font-caption); }
#whoami { color: var(--ui-text); }
.account-text small { color: var(--ui-muted); }
.sidebar-foot .sidebar-action { gap: 10px; min-height: 36px; padding: 7px 8px; border-radius: 6px; color: var(--ui-muted); font-size: var(--ui-font-caption); }
.sidebar-foot .sidebar-action svg { width: 16px; height: 16px; }
.sidebar-foot .sidebar-action:hover { background: var(--ui-subtle); color: var(--ui-text); }
.archive-count { border: 1px solid var(--ui-border); background: var(--ui-panel); color: var(--ui-muted); font-variant-numeric: tabular-nums; }

/* Main header and conversation surface */
.main { position: relative; background: var(--ui-panel); }
.chat-head { min-height: 57px; padding: 10px 20px; border-bottom: 1px solid var(--ui-border); background: var(--ui-panel); }
.head-title .title { color: var(--ui-text); font-size: var(--ui-font-body); font-weight: 600; }
#scope-line { color: var(--ui-muted); }
#sidebar-toggle { display: none; }
@media (max-width: 960px) {
  #sidebar-toggle { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); }
  #sidebar-toggle:hover { background: var(--ui-subtle); }
  #sidebar-close { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; margin-left: auto; border: 0; border-radius: 6px; background: transparent; color: var(--ui-muted); }
  #sidebar-close:hover { background: var(--ui-hover); color: var(--ui-text); }
  .sidebar { width: min(286px, 84vw); border-right: 1px solid var(--ui-border); background: var(--ui-bg); box-shadow: 0 12px 40px #0003; }
  .sidebar-scrim { background: color-mix(in srgb, var(--ui-text) 26%, transparent); }
}

.messages-wrap, .messages { background: var(--ui-panel); }
.msg-row { padding: 16px 24px; }
.msg.user { padding: 9px 13px; border: 1px solid color-mix(in srgb, var(--ui-accent) 12%, var(--ui-border)); border-radius: 12px 4px 12px 12px; background: var(--ui-accent-soft); color: var(--ui-text); }
.msg.assistant { color: var(--ui-text); line-height: 1.8; }
.avatar { display: grid; place-items: center; width: 32px; height: 32px; overflow: visible; border: 0; border-radius: 0; background: transparent; color: var(--ui-accent); font-size: var(--ui-font-ui); }
.avatar img { width: 100%; height: 100%; object-fit: contain; }
.msg.assistant h1, .msg.assistant h2, .msg.assistant h3, .msg.assistant h4 { color: var(--ui-text); }
.msg.assistant blockquote { border-left-color: var(--ui-brand-logo); color: var(--ui-muted); }
.msg.assistant code { background: var(--ui-subtle); color: var(--ui-text); }
.msg.assistant hr { border-top-color: var(--ui-border); }
.msg.assistant table { border-color: var(--ui-border); }
.msg.assistant th, .msg.assistant td { border-bottom-color: var(--ui-border); }
.msg.assistant th { background: var(--ui-subtle); color: var(--ui-text); font-weight: 500; }
.msg.assistant tr:nth-child(even) td { background: color-mix(in srgb, var(--ui-subtle) 55%, var(--ui-panel)); }
.msg .tool-line, .meta, .usage-line { color: var(--ui-muted); }

.tool-wrap { border-color: var(--ui-border); background: var(--ui-subtle); }
.tool-toggle { color: var(--ui-muted); }
.tool-toggle:hover { background: var(--ui-hover); color: var(--ui-text); }
.tool-body { border-top-color: var(--ui-border); }
.ans-actions { gap: 4px; margin-top: 9px; }
.icon-btn { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; padding: 3px 7px; border-radius: 6px; color: var(--ui-muted); }
.icon-btn:hover { background: var(--ui-subtle); color: var(--ui-text); }
.query-detail { border-color: var(--ui-border); background: var(--ui-subtle); color: var(--ui-muted); }
.qd-item + .qd-item { border-top-color: var(--ui-border); }
.qd-head { color: var(--ui-text); }
.qd-sql { padding: 8px 10px; border: 1px solid var(--ui-border); border-radius: 6px; background: var(--ui-panel); color: var(--ui-text); }
.typing span { background: var(--ui-accent); }

/* Welcome and suggestions */
.welcome { margin-top: 7vh; }
.welcome h2 { color: var(--ui-text); font-size: var(--ui-font-title); font-weight: 600; letter-spacing: -.02em; }
.welcome .muted { color: var(--ui-muted); }
.suggest { min-height: 56px; padding: 12px 14px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); font-size: var(--ui-font-ui); box-shadow: none; }
.suggest:hover { transform: none; border-color: color-mix(in srgb, var(--ui-accent) 38%, var(--ui-border)); background: color-mix(in srgb, var(--ui-accent-soft) 45%, var(--ui-panel)); box-shadow: 0 2px 8px color-mix(in srgb, var(--ui-text) 7%, transparent); }
.s-ico { display: grid; place-items: center; width: 28px; height: 28px; flex-shrink: 0; border-radius: 6px; background: var(--ui-accent-soft); color: var(--ui-accent); }
.s-ico svg { width: 16px; height: 16px; }
.scroll-bottom { display: grid; place-items: center; border-color: var(--ui-border); background: var(--ui-panel); color: var(--ui-muted); box-shadow: var(--ui-shadow); }
.scroll-bottom:hover { color: var(--ui-accent); }

/* Composer */
.composer-wrap { background: linear-gradient(to top, var(--ui-panel) 74%, transparent); }
.composer { gap: 6px; padding: 8px 9px 8px 11px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-panel); box-shadow: 0 2px 8px color-mix(in srgb, var(--ui-text) 7%, transparent); }
.composer:hover { border-color: var(--ui-border-strong); }
.composer:focus-within { border-color: var(--ui-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-accent) 13%, transparent); }
.composer.dragover { border-color: var(--ui-accent); background: var(--ui-accent-soft); }
#ask-input { color: var(--ui-text); font-size: var(--ui-font-ui); }
#attach-btn { display: grid; place-items: center; width: 34px; height: 34px; padding: 7px; border-radius: 7px; color: var(--ui-muted); }
#attach-btn:hover { background: var(--ui-subtle); color: var(--ui-text); }
.send-btn { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--ui-accent); border-radius: 8px; background: var(--ui-accent); color: var(--ui-on-accent); }
.send-btn:hover { background: var(--ui-accent-hover); }
.send-btn:disabled { border-color: var(--ui-border); background: var(--ui-subtle); color: var(--ui-muted); }
.send-btn.stop { border-color: var(--ui-text); background: var(--ui-text); color: var(--ui-panel); }
.composer-hint { color: var(--ui-muted); }
.attach-zone { margin-top: 2px; }
.attach-chip { gap: 6px; padding: 4px 8px; border: 1px solid var(--ui-border); border-radius: 6px; background: var(--ui-panel); color: var(--ui-text); }
.attach-chip.uploading { color: var(--ui-muted); }
.attach-chip.error { border-color: color-mix(in srgb, var(--ui-danger) 34%, var(--ui-border)); background: var(--ui-danger-soft); color: var(--ui-danger); }
.attach-chip svg { color: var(--ui-accent); }
.attach-chip.error svg { color: var(--ui-danger); }
.attach-remove { display: inline-grid; place-items: center; width: 24px; height: 24px; margin-left: 1px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: var(--ui-muted); }
.attach-remove:hover { background: var(--ui-hover); color: var(--ui-text); }
.attach-remove .gg-icon { width: 13px; height: 13px; }

/* Reports and answer actions */
.artifact-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 7px 11px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); font-size: var(--ui-font-caption); }
.artifact-chip:hover { border-color: var(--ui-accent); background: var(--ui-accent-soft); }
.artifact-chip svg { color: var(--ui-accent); align-self: center; transform: translateY(-.4px); }

/* Usage */
.modal { background: color-mix(in srgb, var(--ui-text) 30%, transparent); }
.modal-card { width: min(var(--ui-layout-content), 92vw); padding: 20px 21px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-lg); background: var(--ui-panel); color: var(--ui-text); box-shadow: var(--ui-shadow); }
.modal-head { color: var(--ui-text); font-size: var(--ui-font-subtitle); font-weight: 600; line-height: var(--ui-leading-title); }
.modal-head .muted { color: var(--ui-muted); }
.usage-card { border-color: var(--ui-border); background: var(--ui-subtle); }
.usage-label, .usage-sub, .bar-day { color: var(--ui-muted); }
.usage-num { color: var(--ui-accent); font-size: var(--ui-font-title); font-weight: 600; line-height: 1.3; }
.usage-split { color: var(--ui-muted); }
.usage-section { color: var(--ui-text); }
.bar { background: linear-gradient(to top, var(--ui-brand-logo), var(--ui-accent)); }
.usage-table th, .usage-table td { border-bottom-color: var(--ui-border); }
.usage-table th { color: var(--ui-muted); }
.tag { border: 1px solid color-mix(in srgb, var(--ui-success) 22%, var(--ui-border)); background: var(--ui-success-soft); color: var(--ui-success); }
.tag.failed { border-color: color-mix(in srgb, var(--ui-danger) 24%, var(--ui-border)); background: var(--ui-danger-soft); color: var(--ui-danger); }
.tag.cancelled { border-color: var(--ui-border); background: var(--ui-subtle); color: var(--ui-muted); }
.usage-note { color: var(--ui-muted); }

/* Archive workspace */
.archive-workspace { background: var(--ui-bg); color: var(--ui-text); }
.archive-page-header { padding: 18px 26px; border-bottom: 1px solid var(--ui-border); background: var(--ui-panel); }
.archive-page-header h1 { color: var(--ui-text); font-size: var(--ui-font-title); font-weight: 600; }
#archive-title:focus { outline: none; }
.archive-page-header p { color: var(--ui-muted); }
.archive-page-brand img { width: 32px; height: 34px; }
.back-chat { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 6px 11px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); font-size: var(--ui-font-caption); }
.back-chat:hover { background: var(--ui-subtle); }
.back-chat .gg-icon { width: 14px; height: 14px; color: var(--ui-muted); }
.archive-layout { grid-template-columns: 212px minmax(0, 1fr); }
.archive-folder-panel { border-right: 1px solid var(--ui-border); background: var(--ui-bg); }
.archive-tree-row { min-height: var(--ui-row); border-radius: 6px; color: var(--ui-muted); }
.archive-tree-row:hover { background: var(--ui-subtle); color: var(--ui-text); }
.archive-tree-row.selected { background: var(--ui-accent-soft); color: var(--ui-accent); }
.archive-tree-label { padding: 6px 0; font-size: var(--ui-font-caption); color: inherit; }
.archive-content { background: var(--ui-panel); }
.archive-content-header h2 { color: var(--ui-text); font-size: var(--ui-font-title); }
.folder-breadcrumb, .archive-content-header p { color: var(--ui-muted); }
.archive-search { min-height: var(--ui-control); padding: 7px 10px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); }
.archive-search:hover { border-color: var(--ui-border-strong); }
.archive-search:focus { border-color: var(--ui-accent); box-shadow: var(--focus-ring); }
.archive-bulk { border-color: var(--ui-border); color: var(--ui-muted); }
.archive-bulk input, .archive-name input { accent-color: var(--ui-accent); }
.archive-bulk-actions button { min-height: 30px; padding: 5px 9px; border: 1px solid var(--ui-border); border-radius: 6px; background: var(--ui-panel); color: var(--ui-text); }
.archive-bulk-actions button:hover:not(:disabled) { background: var(--ui-subtle); }
.archive-feedback { color: var(--ui-accent); }
.archive-table-head { border-bottom-color: var(--ui-border); color: var(--ui-muted); }
.archive-row { border-bottom-color: var(--ui-border); }
.archive-row:hover { background: color-mix(in srgb, var(--ui-subtle) 55%, var(--ui-panel)); }
.archive-row.is-selected { background: var(--ui-accent-soft); }
.archive-name strong { color: var(--ui-text); }
.archive-row-text span { color: var(--ui-muted); }
.archive-row-text .archive-folder-path { color: var(--ui-text); }
.archive-row-actions button { min-height: 28px; padding: 4px 6px; border-radius: 5px; color: var(--ui-accent); }
.archive-row-actions button:hover { background: var(--ui-subtle); }
.danger-text, .archive-row-actions .danger-text, .archive-bulk-actions .danger-text { color: var(--ui-danger); }
.archive-hint, .archive-empty p { color: var(--ui-muted); }
.archive-empty strong { color: var(--ui-text); }

/* Management dialogs */
.management-dialog { padding: 22px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-lg); background: var(--ui-panel); color: var(--ui-text); box-shadow: var(--ui-shadow); }
.management-dialog::backdrop { background: color-mix(in srgb, var(--ui-text) 34%, transparent); }
.management-heading h2 { color: var(--ui-text); font-size: var(--ui-font-subtitle); }
.management-heading button { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border-radius: 6px; color: var(--ui-muted); }
.management-heading button:hover { background: var(--ui-subtle); color: var(--ui-text); }
.management-dialog label { color: var(--ui-text); font-weight: 500; }
.management-dialog input, .management-dialog select { min-height: var(--ui-control); padding: 7px 10px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); font-size: var(--ui-font-ui); }
.management-dialog input:hover, .management-dialog select:hover { border-color: var(--ui-border-strong); }
.management-dialog input:focus, .management-dialog select:focus { border-color: var(--ui-accent); box-shadow: var(--focus-ring); }
.field-hint { color: var(--ui-muted); }
.order-controls button { min-height: 30px; padding: 5px 11px; border: 1px solid var(--ui-border); border-radius: 6px; background: var(--ui-panel); color: var(--ui-text); }
.order-controls button:hover:not(:disabled) { background: var(--ui-subtle); }
.folder-secondary button { color: var(--ui-muted); }
.folder-secondary button:hover:not(:disabled) { color: var(--ui-text); }
.dialog-actions button { min-height: 34px; padding: 6px 13px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); }
.dialog-actions button:hover:not(:disabled) { background: var(--ui-subtle); }
.dialog-actions .primary-action { border-color: var(--ui-accent); background: var(--ui-accent); color: var(--ui-on-accent); }
.dialog-actions .primary-action:hover:not(:disabled) { background: var(--ui-accent-hover); }
.dialog-actions .danger-action { border-color: var(--ui-danger); background: var(--ui-danger); color: var(--ui-panel); }
.dialog-actions .danger-action:hover:not(:disabled) { background: color-mix(in srgb, var(--ui-danger) 84%, var(--ui-text)); }

/* Feedback and mascot */
.archive-toast, .tree-drag-feedback { border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); box-shadow: var(--ui-shadow); }
.tree-drag-feedback { border-color: var(--ui-accent); color: var(--ui-accent); }
.tree-drag-feedback.is-invalid { border-color: var(--ui-danger); color: var(--ui-danger); }
#archive-undo { color: var(--ui-accent); }
.gg-mascot-reply { border-color: var(--ui-border); background: var(--ui-panel); color: var(--ui-text); box-shadow: var(--ui-shadow); }
.gg-mascot-reply::before { border-color: var(--ui-border); background: var(--ui-panel); }
.gg-mascot-reply:hover { border-color: var(--ui-accent); background: var(--ui-accent-soft); }
.gg-mascot-reply small { color: var(--ui-muted); }
.gg-mascot-trigger:hover .gg-mascot-figure { filter: drop-shadow(0 7px 11px color-mix(in srgb, var(--ui-brand-logo) 24%, transparent)); }
.gg-mascot-trigger:focus-visible { outline-color: var(--ui-accent); }
#review-notice { border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-panel); color: var(--ui-text); box-shadow: var(--ui-shadow); }

/* Density and radius follow the shared review tokens. */
:root[data-pr-density=compact] .msg-row { padding-top: 9px; padding-bottom: 9px; }
:root[data-pr-density=compact] .chat-head { min-height: 46px; padding-top: 6px; padding-bottom: 6px; }
:root[data-pr-density=compact] .conv-search, :root[data-pr-density=compact] #new-conv { min-height: var(--ui-control); }
:root[data-pr-density=compact] .login-card { padding-top: 28px; padding-bottom: 24px; }
:root[data-pr-density=compact] .sidebar { padding-top: 11px; }
:root[data-pr-density=compact] .suggest { min-height: 48px; padding-top: 9px; padding-bottom: 9px; }
:root[data-pr-density=compact] .folder-label, :root[data-pr-density=compact] .conv-open { padding-top: 4px; padding-bottom: 4px; }
:root[data-pr-density=compact] .tree-grip, :root[data-pr-density=compact] .folder-toggle, :root[data-pr-density=compact] .folder-icon { height: 26px; }
:root[data-pr-style=soft] .login-card, :root[data-pr-style=soft] .modal-card, :root[data-pr-style=soft] .management-dialog { border-radius: 16px; }

@media (max-width: 960px) {
  .msg-row { padding: 11px 16px; }
  .composer-wrap { padding: 6px 14px calc(14px + env(safe-area-inset-bottom, 0px)); }
  .welcome { margin-top: 4.5vh; }
  .usage-cards { grid-template-columns: repeat(2, 1fr); }
  .archive-layout { grid-template-columns: 190px minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .login-card { width: 100%; padding: 32px 22px; border: 0; border-radius: 0; box-shadow: none; }
  .login-wrap { background: var(--ui-panel); }
  .archive-page-header { padding: 13px 14px; }
  .archive-content { background: var(--ui-panel); }
  .modal-card { border: 0; border-radius: 0; }
  .management-dialog { padding: 19px; }
  .dialog-actions { flex-wrap: wrap; }
  .dialog-actions button { min-height: 38px; }
}
@media (pointer: coarse) {
  .gg-action-menu button { min-height: 42px; }
  .folder-icon, .tree-grip, .folder-toggle { min-width: 30px; }
}

/* In-product single-button theme control. */
.brand #theme-toggle { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; min-height: 28px; padding: 0 6px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--ui-muted); font-size: var(--ui-font-micro); }
.brand #theme-toggle span { white-space: nowrap; }
.brand #theme-toggle:hover { background: var(--ui-hover); color: var(--ui-text); }
.brand #theme-toggle .gg-icon { width: 16px; height: 16px; }
:root[data-ui-theme=dark] { color-scheme: dark; --ui-bg:#1b1c1a; --ui-panel:#232521; --ui-subtle:#2b2e28; --ui-hover:#363a31; --ui-text:#eeefe9; --ui-muted:#afb5a6; --ui-border:#42473b; --ui-border-strong:#78836d; --ui-success:#8bd2aa; --ui-success-soft:#253b2d; --ui-warning:#edc97c; --ui-warning-soft:#3b331e; --ui-danger:#f3a3a3; --ui-danger-soft:#432b2a; --ui-info:#a7bfeb; --ui-shadow:0 10px 36px #0006,0 1px 4px #0004; }
:root[data-ui-theme=dark] body { background: var(--ui-bg); }
:root[data-ui-theme=dark] .brand #theme-toggle { color: var(--ui-muted); }
:root[data-ui-theme=dark] .brand #theme-toggle:hover { color: var(--ui-text); }
:root[data-ui-theme=dark] .folder-toggle, :root[data-ui-theme=dark] .folder-icon, :root[data-ui-theme=dark] .tree-grip, :root[data-ui-theme=dark] .tree-add { color: var(--ui-muted); }
:root[data-ui-theme=dark] .conv-item.active { background: color-mix(in srgb, var(--ui-accent) 18%, var(--ui-panel)); }
:root[data-ui-theme=dark] .conv-item.active .conv-open, :root[data-ui-theme=dark] .conv-item.active .conv-quick { color: color-mix(in srgb, var(--ui-accent) 42%, #fff); }


/* Product control icons share the component optical sizes. */
#new-conv .gg-icon, .sidebar-tool-button .gg-icon, .tree-add .gg-icon { width: 15px; height: 15px; }
#new-conv .gg-icon { transform: none; }
.brand #theme-toggle .gg-icon { width: 15px; height: 15px; }

/* Shared icon + label controls, mirrored from components/topic.css. */
#new-conv { line-height: 1; }
.back-chat, .artifact-chip, .tool-toggle, .icon-btn, .gg-action-menu button { line-height: 20px; }
#new-conv .gg-icon, .back-chat .gg-icon, .artifact-chip svg, .tool-toggle .gg-icon, .icon-btn .gg-icon { align-self: center; }
#new-conv .gg-icon { transform: none; }
.back-chat .gg-icon, .tool-toggle .gg-icon, .icon-btn .gg-icon { transform: translateY(-1.3px); }
.attach-chip { display: inline-flex; align-items: center; line-height: 20px; }
.attach-chip > svg { align-self: center; transform: translateY(-.1px); }
.attach-remove { align-self: center; }
.conv-search-wrap .gg-icon { position: relative; top: 0; align-self: center; }
.archive-search { height: var(--ui-control); margin: 0; line-height: calc(var(--ui-control) - 2px); }
/* Upload policy hint: anchored to the attach button, shown on hover or keyboard focus. */
.composer-wrap { position: relative; }
.upload-policy { position:absolute; left:calc(var(--ui-layout-gutter) + max(0px,(100% - 2 * var(--ui-layout-gutter) - var(--ui-layout-content)) / 2)); bottom:calc(100% - 2px); z-index:24; display:block; width:max-content; max-width:min(460px,calc(100vw - 2 * var(--ui-layout-gutter))); margin:0; padding:8px 11px; border:1px solid var(--ui-border); border-radius:8px; background:var(--ui-panel); color:var(--ui-muted); font-size:var(--ui-font-micro); line-height:1.7; text-align:left; box-shadow:var(--ui-shadow); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(4px); transition:opacity .14s ease, transform .14s ease, visibility .14s; box-sizing:border-box; overflow-wrap:anywhere; }
.upload-policy::after { content:""; position:absolute; left:0; right:0; top:100%; height:10px; }
.composer:has(#attach-btn:hover) ~ .upload-policy,
.composer:has(#attach-btn:focus-visible) ~ .upload-policy,
.upload-policy:hover,
.upload-policy:focus-within,
.upload-policy.is-open { opacity:1; visibility:visible; pointer-events:auto; transform:none; }
.upload-policy b { color:var(--ui-text); font-weight:500; }
.upload-policy-text { display:inline; }
.upload-policy button { display:inline-grid; place-items:center; width:16px; height:16px; margin:0 6px 0 0; padding:0; border:1px solid var(--ui-border); border-radius:50%; background:var(--ui-panel); color:var(--ui-muted); font-size:var(--ui-font-micro); line-height:1; vertical-align:middle; }
.upload-policy button:hover { border-color:var(--ui-border-strong); color:var(--ui-text); }
.upload-policy-detail { display:block; margin-top:6px; padding:6px 8px; border:1px solid var(--ui-border); border-radius:6px; background:var(--ui-subtle); color:var(--ui-muted); text-align:left; line-height:1.65; }
.upload-policy-detail[hidden] { display:none; }
/* Touch devices have no hover, so keep the policy visible in the composer flow. */
@media (hover:none),(pointer:coarse) {
  /* 触摸设备没有 hover，提示常驻在输入框下方。
     宽度要用“容器宽度”而不是 auto：auto 会按最长一行内容撑开，
     390px 手机上实测到 408px，整页横向溢出 30px。 */
  .upload-policy { position:static; width:min(var(--ui-layout-content),calc(100% - 2 * var(--ui-layout-gutter))); max-width:calc(100% - 2 * var(--ui-layout-gutter)); margin:6px auto 0; padding:0; border:0; background:transparent; box-shadow:none; opacity:1; visibility:visible; pointer-events:auto; transform:none; text-align:left; box-sizing:border-box; overflow-wrap:anywhere; }
  .upload-policy::after { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .upload-policy { transition:none; }
}


/* Conversation references: copy an ID or drag a conversation into the composer. */
.conv-reference-zone { display:flex; flex-wrap:wrap; gap:6px; max-width:var(--ui-layout-content); margin:0 auto 6px; }
.conv-reference-zone.hidden { display:none; }
.conv-reference-chip { display:inline-flex; align-items:center; gap:6px; min-height:28px; padding:4px 8px; border:1px solid var(--ui-border); border-radius:6px; background:var(--ui-panel); color:var(--ui-text); font-size:var(--ui-font-micro); }
.conv-reference-icon { display:inline-flex; color:var(--ui-accent); }
.conv-reference-icon .gg-icon { width:14px; height:14px; }
.conv-reference-label { max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.conv-reference-id { color:var(--ui-muted); font:var(--ui-font-micro) var(--ui-code); }
.conv-reference-remove { display:grid; place-items:center; width:18px; height:18px; padding:0; border:0; border-radius:50%; background:transparent; color:var(--ui-muted); cursor:pointer; }
.conv-reference-remove:hover { background:var(--ui-hover); color:var(--ui-text); }
.referenced-conversations { display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; }
.referenced-conversations .conv-reference-chip { min-height:24px; padding:2px 7px; }
#ask-form.dragover-ref { border-color:var(--ui-accent); background:var(--ui-accent-soft); }


/* Unified notification host and inline region. */
.notification-host{position:relative;z-index:120}
.notification-inline-host{position:absolute;top:64px;left:50%;transform:translateX(-50%);z-index:110;width:360px;max-width:calc(100% - 40px)}
.notification-inline-host[hidden]{display:none}
.notification-msg{position:relative;display:flex;flex-direction:column;gap:4px;padding:11px 12px 11px 13px;border:1px solid var(--ui-border-strong);border-radius:10px;background:color-mix(in srgb,var(--ui-panel) 80%,transparent);color:var(--ui-text);font-size:var(--ui-font-ui);line-height:1.6;overflow:hidden;box-shadow:0 8px 22px color-mix(in srgb,var(--ui-text) 14%,transparent)}
.notification-msg-head{display:flex;align-items:center;gap:9px;min-width:0}
.notification-msg-mark{display:grid;place-items:center;flex-shrink:0;width:22px;height:22px;border-radius:50%;background:var(--ui-subtle);color:var(--ui-muted)}
.notification-msg-mark svg{width:13px;height:13px}
.notification-msg-title{min-width:0;flex:1;margin:0;font-size:var(--ui-font-ui);font-weight:500;line-height:1.5;overflow-wrap:anywhere}
.notification-msg-detail{margin:0;padding-left:31px;font-size:var(--ui-font-caption);line-height:1.65;color:var(--ui-muted);overflow-wrap:anywhere}
.notification-msg-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-top:1px}
.notification-msg-action{min-height:28px;padding:3px 10px;border:1px solid var(--ui-border);border-radius:6px;background:var(--ui-panel);color:var(--ui-text);font:inherit;font-size:var(--ui-font-caption);line-height:20px;font-weight:500;white-space:nowrap;cursor:pointer}
.notification-msg-action:hover{border-color:var(--ui-border-strong);background:var(--ui-subtle)}
.notification-msg-action[data-variant=primary]{background:var(--ui-accent);border-color:var(--ui-accent);color:var(--ui-on-accent)}
.notification-msg-action[data-variant=primary]:hover{background:var(--ui-accent-hover);border-color:var(--ui-accent-hover)}
.notification-msg-action[data-variant=success]{background:var(--ui-success-soft);border-color:color-mix(in srgb,var(--ui-success) 38%,var(--ui-border));color:var(--ui-success)}
.notification-msg-action[data-variant=danger]{background:var(--ui-danger-soft);border-color:color-mix(in srgb,var(--ui-danger) 38%,var(--ui-border));color:var(--ui-danger)}
.notification-msg-action[data-variant=warning]{background:var(--ui-warning-soft);border-color:color-mix(in srgb,var(--ui-warning) 38%,var(--ui-border));color:var(--ui-warning)}
.notification-msg-close{display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;margin:-3px -4px -3px 0;padding:0;border:0;border-radius:6px;background:transparent;color:var(--ui-muted);cursor:pointer}
.notification-msg-close:hover{background:var(--ui-hover);color:var(--ui-text)}
.notification-msg-close svg{width:13px;height:13px}
.notification-msg[data-tone=success]{border-color:color-mix(in srgb,var(--ui-success) 32%,var(--ui-border))}
.notification-msg[data-tone=success] .notification-msg-mark{background:var(--ui-success-soft);color:var(--ui-success)}
.notification-msg[data-tone=danger]{border-color:color-mix(in srgb,var(--ui-danger) 34%,var(--ui-border))}
.notification-msg[data-tone=danger] .notification-msg-mark{background:var(--ui-danger-soft);color:var(--ui-danger)}
.notification-msg[data-tone=warning]{border-color:color-mix(in srgb,var(--ui-warning) 34%,var(--ui-border))}
.notification-msg[data-tone=warning] .notification-msg-mark{background:var(--ui-warning-soft);color:var(--ui-warning)}
.notification-msg[data-tone=info]{border-color:color-mix(in srgb,var(--ui-info) 30%,var(--ui-border))}
.notification-msg[data-tone=info] .notification-msg-mark{background:color-mix(in srgb,var(--ui-info) 12%,var(--ui-panel));color:var(--ui-info)}
.notification-msg-progress{position:absolute;left:1px;bottom:1px;width:calc(100% - 2px);height:3px;border-radius:2px;background:var(--ui-accent);opacity:.85;pointer-events:none;transition:width .1s linear}
.notification-msg[data-tone=success] .notification-msg-progress{background:var(--ui-success)}
.notification-msg[data-tone=danger] .notification-msg-progress{background:var(--ui-danger)}
.notification-msg[data-tone=warning] .notification-msg-progress{background:var(--ui-warning)}
.notification-toast{position:absolute;top:64px;left:50%;z-index:120;width:360px;max-width:calc(100% - 40px);transform:translateX(-50%);animation:notification-msg-in .16s ease-out}
.notification-toast[hidden]{display:none}
.notification-badge{padding:6px 8px 6px 10px;border-radius:999px;box-shadow:none;gap:0}
.notification-badge .notification-msg-head{gap:7px}
.notification-badge .notification-msg-mark{width:18px;height:18px}
.notification-badge .notification-msg-mark svg{width:11px;height:11px}
.notification-badge .notification-msg-title{font-size:var(--ui-font-caption);font-weight:400}
.notification-badge .notification-msg-close{width:24px;height:24px;margin:-2px -2px -2px 0}
.notice-empty-inline{padding:18px 12px;text-align:center;border:1px dashed var(--ui-border);border-radius:8px;background:var(--ui-bg);margin-top:8px}
.notice-empty-inline strong{display:block;font-size:var(--ui-font-ui);font-weight:500}
.notice-empty-inline p{margin:6px 0 0;font-size:var(--ui-font-caption);line-height:1.7;color:var(--ui-muted)}
.notification-banner{position:absolute;top:64px;left:50%;transform:translateX(-50%);z-index:118;width:360px;max-width:calc(100% - 40px);padding:10px 12px 11px 13px}
.notification-banner .notification-msg-detail{padding-left:31px}
.notification-toast .notification-msg,.notification-banner .notification-msg{backdrop-filter:blur(6px)}
.notification-inline{width:100%}
/* Keep the first readable row clear of the floating notice while it is on screen. */

#chat-view .messages .welcome{padding-top:0}
#chat-view.has-floating-notice .messages .welcome{padding-top:var(--notice-space, 150px)}
#chat-view.has-floating-notice .messages{scroll-padding-top:var(--notice-space, 150px)}
@keyframes notification-msg-in{from{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%,0)}}
@media(max-width:560px){.notification-toast{width:calc(100vw - 24px)}}
@media(prefers-reduced-motion:reduce){.notification-toast{animation:none}.notification-msg-progress{transition:none}}

/* Notification inspection workspace */




/* Apply the type and layout standard to the active product. */
body{font-size:var(--ui-font-body);line-height:var(--ui-leading-body)}
.brand{font-size:var(--ui-font-subtitle);font-weight:600;line-height:var(--ui-leading-title)}
.sidebar{width:var(--ui-layout-sidebar);padding:14px 14px 12px}
@media(min-width:961px){.sidebar{width:var(--sidebar-width,var(--ui-layout-sidebar))}}
#sidebar-resizer{left:var(--sidebar-width,var(--ui-layout-sidebar))}
#new-conv{min-height:40px;font-size:var(--ui-font-ui)}
.conv-search{font-size:var(--ui-font-ui)}
.tree-heading{font-size:var(--ui-font-micro);margin:16px 6px 6px}
.folder-label,.conv-open{font-size:var(--ui-font-ui);line-height:var(--ui-leading-ui);padding:8px 2px}
.conv-open{padding:9px 1px}
.sidebar-foot .sidebar-action{font-size:var(--ui-font-ui);min-height:38px;padding:8px 9px}
.account-text small{font-size:var(--ui-font-micro)}
#whoami{font-size:var(--ui-font-caption)}
.head-title .title{font-size:var(--ui-font-heading)}
#scope-line{font-size:var(--ui-font-caption)}
.msg-row{max-width:var(--ui-layout-content);padding:18px var(--ui-layout-gutter);gap:12px}
.msg.assistant{font-size:var(--ui-font-body);line-height:var(--ui-leading-body)}
.msg.assistant h1,.msg.assistant h2,.msg.assistant h3,.msg.assistant h4{font-size:var(--ui-font-heading);line-height:1.5;margin:16px 0 8px}
.msg.assistant p{margin:10px 0}
.msg.assistant table{font-size:var(--ui-font-ui)}
.msg.assistant th,.msg.assistant td{padding:9px 13px;line-height:1.6}
.msg.user{padding:10px 14px;font-size:var(--ui-font-body);line-height:var(--ui-leading-ui)}
.meta,.usage-line,.tool-line{font-size:var(--ui-font-micro);line-height:var(--ui-leading-caption)}
.tool-toggle{font-size:var(--ui-font-caption);min-height:34px}
.query-detail{font-size:var(--ui-font-caption)}
.qd-sql{font-size:var(--ui-font-micro);line-height:1.65}
.artifact-chip{font-size:var(--ui-font-caption);min-height:40px;padding:8px 12px}
.icon-btn{font-size:var(--ui-font-caption);min-height:30px}
.welcome{max-width:var(--ui-layout-content)}
.welcome h2{font-size:var(--ui-font-title);line-height:var(--ui-leading-title);margin:0 0 10px}
.welcome .muted{font-size:var(--ui-font-ui);line-height:var(--ui-leading-ui);margin:0 0 28px}
.suggest{font-size:var(--ui-font-ui);padding:14px 16px;min-height:58px;box-sizing:border-box}
.composer-wrap{padding:10px var(--ui-layout-gutter) 16px}
.composer{max-width:var(--ui-layout-content);padding:9px 10px 9px 12px}
#ask-input{font-size:var(--ui-font-body);line-height:var(--ui-leading-ui)}
.composer-hint,.upload-policy{max-width:var(--ui-layout-content);font-size:var(--ui-font-micro);line-height:var(--ui-leading-caption)}
.upload-policy{font-size:var(--ui-font-micro)}
.conv-reference-zone,.attach-zone{max-width:var(--ui-layout-content)}
.conv-reference-chip{font-size:var(--ui-font-caption);min-height:32px;padding:5px 9px}
.attach-chip{font-size:var(--ui-font-caption)}
.modal-card{max-width:min(820px,92vw)}
.usage-label,.usage-sub,.bar-day{font-size:var(--ui-font-caption)}
.usage-num{font-size:var(--ui-font-title);font-weight:600;line-height:1.35}
.usage-section{font-size:var(--ui-font-ui)}
.usage-table{font-size:var(--ui-font-caption)}
.usage-note{font-size:var(--ui-font-caption);line-height:var(--ui-leading-caption)}
.management-dialog input,.management-dialog select{font-size:var(--ui-font-ui)}
.management-heading h2{font-size:var(--ui-font-subtitle);line-height:var(--ui-leading-title)}
.field-hint,.form-error{font-size:var(--ui-font-caption)}
.archive-page-header h1{font-size:var(--ui-font-title)}
.archive-content-header h2{font-size:var(--ui-font-title)}
.archive-tree-label{font-size:var(--ui-font-ui)}
.archive-search{font-size:var(--ui-font-caption)}
.archive-name strong{font-size:var(--ui-font-ui);line-height:1.65}
.archive-row-text span{font-size:var(--ui-font-micro);line-height:1.7}
.archive-bulk,.archive-bulk-actions button,.archive-row-actions button{font-size:var(--ui-font-caption)}
.dialog-actions button{font-size:var(--ui-font-ui)}
@media(max-width:960px){.msg-row{padding:14px 18px}.composer-wrap{padding:8px 18px 14px}.sidebar{width:min(300px,86vw)}}
/* iOS zooms the page when a focused field is below 16px; keep the input at 16px on phones. */
@media(max-width:960px){#ask-input,#login-username,#login-password,.conv-search,.archive-search{font-size:16px;line-height:1.5}}
/* The footer hint wraps to two lines on narrow phones; swap in the short copy instead. */
.hint-short{display:none}
@media(max-width:560px){.composer-hint{padding:0 2px;white-space:nowrap;max-width:100%}.hint-full{display:none}.hint-short{display:inline}}
@media(max-width:560px){.msg-row{padding:12px 16px}.composer-wrap{padding:8px 12px 12px}.suggest{font-size:var(--ui-font-ui)}.msg.assistant{font-size:var(--ui-font-heading)}}
/* 手机上输入框紧贴最后一行内容，常驻角色没有可站的位置；它在欢迎页和回答头像里
   仍然出现，这里只收起这一个装饰层，避免遮挡执行状态与提示文字。 */
@media(max-width:560px){.gg-perch{display:none}}

/* Keep the upload tooltip inside the composer gutter and clear of the late max-width rule. */
.upload-policy{max-width:min(460px,calc(100vw - 2 * var(--ui-layout-gutter)))}
/* 这段提示是绝对定位：它的包含块是 .composer-wrap 的定位盒，
   用 100% 会算成“容器宽 - 边距”再叠加 left，390px 手机上实测越界 30px。
   改成按视口宽度算，任何手机上都不会越过右边。 */
@media(max-width:960px){.upload-policy{left:18px;max-width:calc(100vw - 36px)}}
@media(max-width:560px){.upload-policy{left:12px;width:calc(100vw - 24px);max-width:calc(100vw - 24px)}}


/* 0.3.0 product workflow additions. */
.sso-button{width:100%;min-height:38px;margin-top:2px;border:1px solid var(--ui-border)!important;border-radius:var(--ui-radius)!important;background:var(--ui-panel)!important;color:var(--ui-text)!important;font-size:var(--ui-font-ui)!important;font-weight:500!important;box-shadow:none!important}
.sso-button:hover{background:var(--ui-subtle)!important;border-color:var(--ui-border-strong)!important}
.login-card .login-submit{margin-top:10px}
.login-status{padding:9px 10px;margin:0 0 10px;border:1px solid color-mix(in srgb,var(--ui-accent) 28%,var(--ui-border));border-radius:7px;background:var(--ui-accent-soft);color:var(--ui-text);font-size:var(--ui-font-caption);line-height:1.7;text-align:left}
.login-status[data-tone=danger]{border-color:color-mix(in srgb,var(--ui-danger) 34%,var(--ui-border));background:var(--ui-danger-soft);color:var(--ui-danger)}
.login-status[data-tone=warning]{border-color:color-mix(in srgb,var(--ui-warning) 34%,var(--ui-border));background:var(--ui-warning-soft);color:var(--ui-text)}
.login-status[data-tone=success]{border-color:color-mix(in srgb,var(--ui-success) 34%,var(--ui-border));background:var(--ui-success-soft);color:var(--ui-text)}
.login-status[data-tone=info]{border-color:var(--ui-border);background:var(--ui-subtle);color:var(--ui-text)}
.login-status strong{display:block;font-size:var(--ui-font-ui);font-weight:600;line-height:var(--ui-leading-ui)}
.login-status p{margin:4px 0 0;color:var(--ui-muted);line-height:var(--ui-leading-caption)}
.usage-unavailable{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:16px;border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);background:var(--ui-subtle);}
.usage-unavailable strong{font-size:var(--ui-font-heading)}
.usage-unavailable p{margin:0;font-size:var(--ui-font-caption);line-height:var(--ui-leading-caption)}
.report-state{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:14px auto 0;padding:13px 15px;max-width:var(--ui-layout-content);border:1px solid color-mix(in srgb,var(--ui-accent) 30%,var(--ui-border));border-radius:var(--ui-radius-lg);background:var(--ui-accent-soft)}
.report-state.is-failed{border-color:color-mix(in srgb,var(--ui-danger) 34%,var(--ui-border));background:var(--ui-danger-soft)}
.report-state strong{font-size:var(--ui-font-ui);font-weight:600}
.report-state p{margin:0;color:var(--ui-muted);font-size:var(--ui-font-caption);line-height:var(--ui-leading-caption)}
.report-state button{min-height:28px;padding:3px 10px;border:1px solid var(--ui-border);border-radius:var(--ui-radius);background:var(--ui-panel);color:var(--ui-text);font-size:var(--ui-font-caption)}
.login-status button{width:auto!important;min-height:28px!important;margin-top:7px!important;padding:3px 9px!important;border:1px solid var(--ui-border)!important;border-radius:6px!important;background:var(--ui-panel)!important;color:var(--ui-text)!important;font-size:var(--ui-font-caption)!important}
.analysis-context{display:flex;flex-wrap:wrap;align-items:center;gap:7px;width:min(var(--ui-layout-content),calc(100% - 2*var(--ui-layout-gutter)));margin:0 auto 7px;padding:7px 9px;border:1px solid var(--ui-border);border-radius:7px;background:var(--ui-panel);font-size:var(--ui-font-caption);color:var(--ui-muted)}
.analysis-context strong{font-size:var(--ui-font-caption);font-weight:500;color:var(--ui-text)}
.analysis-context button{margin-left:auto;border:0;background:transparent;color:var(--ui-accent);font-size:var(--ui-font-caption);padding:4px 3px}
.composer-tools{display:flex;flex-wrap:wrap;align-items:center;gap:5px;max-width:var(--ui-layout-content);margin:5px auto 0}
.composer-tool{min-height:25px;padding:2px 7px;border:1px solid transparent;border-radius:5px;background:transparent;color:var(--ui-muted);font-size:var(--ui-font-micro)}
.composer-tool:hover,.composer-tool:focus-visible{border-color:var(--ui-border);background:var(--ui-panel);color:var(--ui-text)}
.analysis-context-chip{font-size:var(--ui-font-micro);color:var(--ui-accent);overflow-wrap:anywhere}
.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.management-dialog.wide-dialog{width:min(560px,calc(100vw - 32px))}
.template-list{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.template-item{display:flex;align-items:flex-start;gap:10px;padding:11px;border:1px solid var(--ui-border);border-radius:8px;background:var(--ui-bg)}
.template-item div{min-width:0;flex:1}.template-item strong{display:block;font-size:var(--ui-font-ui);font-weight:500}.template-item small{display:block;margin-top:3px;font-size:var(--ui-font-micro);line-height:1.7;color:var(--ui-muted)}
.template-item button{min-height:28px;padding:4px 9px;border:1px solid var(--ui-border);border-radius:6px;background:var(--ui-panel);color:var(--ui-text);font-size:var(--ui-font-micro);white-space:nowrap}
.template-create{padding-top:12px;border-top:1px solid var(--ui-border)}.template-create summary{cursor:pointer;font-size:var(--ui-font-caption);color:var(--ui-accent)}.template-create form{display:flex;flex-direction:column;gap:10px;margin-top:12px}.template-create textarea{width:100%;padding:7px 10px;border:1px solid var(--ui-border);border-radius:var(--ui-radius);background:var(--ui-panel);color:var(--ui-text);resize:vertical;font:inherit;font-size:var(--ui-font-ui)}
.source-body{display:flex;flex-direction:column;gap:10px;margin-top:14px}.source-card{padding:12px;border:1px solid var(--ui-border);border-radius:8px;background:var(--ui-bg)}.source-card h3{margin:0 0 5px;font-size:var(--ui-font-ui)}.source-card p{margin:0;color:var(--ui-muted);font-size:var(--ui-font-caption);line-height:1.75}.source-card code{display:block;margin-top:8px;padding:8px;border-radius:6px;background:var(--ui-subtle);font:11px/1.7 var(--ui-code);white-space:pre-wrap;overflow-wrap:anywhere}
.report-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.report-actions button{border:1px solid var(--ui-border);border-radius:6px;background:var(--ui-panel);color:var(--ui-text);font-size:var(--ui-font-micro);padding:5px 8px}
.result-status{position:relative;align-items:center;background:var(--ui-subtle);border-color:var(--ui-border);color:var(--ui-text)}.result-status .rs-text{flex:1 1 auto;min-width:0}.result-status .rs-actions{display:flex;flex:0 0 auto;flex-wrap:nowrap;gap:6px;margin-top:0}.result-status .rs-actions button{min-height:26px;padding:3px 9px;border:1px solid var(--ui-border);border-radius:5px;background:var(--ui-panel);color:var(--ui-text);font-size:var(--ui-font-micro);white-space:nowrap}
/* 窄屏时状态区改为整行堆叠：说明占满一行，操作按钮再单独一行，按钮不被压成竖排。 */
@media(max-width:560px){.result-status{align-items:flex-start;flex-wrap:wrap;gap:4px 8px}.result-status .rs-text{flex:1 1 100%;order:2}.result-status .rs-actions{flex:1 1 100%;order:3;flex-wrap:wrap;margin-top:2px}.result-status .rs-actions button{flex:0 0 auto}}

.result-status[data-kind=empty]{border-color:color-mix(in srgb,var(--ui-warning) 40%,var(--ui-border))}
.result-status[data-kind=truncated]{border-color:color-mix(in srgb,var(--ui-warning) 55%,var(--ui-border))}
.result-status[data-kind=cached]{border-color:color-mix(in srgb,var(--ui-info) 45%,var(--ui-border))}
.result-status.is-refreshing{opacity:.86}.result-status.is-refreshing::after{content:"";display:inline-block;width:12px;height:12px;margin-left:8px;border:1.5px solid var(--ui-accent);border-right-color:transparent;border-radius:50%;vertical-align:-2px;animation:gg-spin .8s linear infinite}
.msg.assistant .table-scroll{width:100%;max-width:100%;overflow:auto;border:1px solid var(--ui-border);border-radius:7px;margin:10px 0}.msg.assistant .table-scroll table{width:100%;min-width:100%;border-collapse:collapse;margin:0}.msg.assistant .table-scroll th,.msg.assistant .table-scroll td{padding:8px 10px;border-bottom:1px solid var(--ui-border);text-align:left}.msg.assistant .table-scroll th,.msg.assistant .table-scroll td{white-space:nowrap;overflow-wrap:normal}.msg.assistant .table-scroll table{width:max-content;min-width:100%}.msg.assistant .table-scroll th{background:var(--ui-subtle);font-weight:500}
.notification-msg-detail{font-size:var(--ui-font-ui)}.notification-toast{top:83px;overflow:hidden}.notification-banner{top:83px;overflow:hidden}.notification-inline-host{top:83px}
.generation-strip{display:flex;align-items:center;gap:9px;min-height:34px;padding:5px 20px;border-bottom:1px solid var(--ui-border);background:var(--ui-panel);color:var(--ui-text);font-size:var(--ui-font-caption)}
.generation-strip[hidden]{display:none}
.generation-strip strong{font-size:var(--ui-font-caption);font-weight:500}.generation-strip small{margin-left:7px;color:var(--ui-muted);font-size:var(--ui-font-micro)}.generation-spinner{display:block;width:13px;height:13px;flex-shrink:0;border:1.5px solid var(--ui-accent);border-right-color:transparent;border-radius:50%;animation:gg-spin .95s linear infinite}
.notification-msg{background:color-mix(in srgb,var(--ui-panel) 80%,transparent)!important;backdrop-filter:blur(12px)}
/* 提示行：问号在文字前、与首行文字垂直对齐，整体左对齐。
   这里曾用 flex 容器 + 居中，手机上图省先居中再折行，与原型“左对齐、图标行内”不一致。 */
.upload-policy .upload-policy-text{line-height:1.55}
.upload-policy{display:block;text-align:left}
.upload-policy .policy-toggle{display:inline-grid;place-items:center;vertical-align:-3px}
.msg.assistant .md p{overflow-wrap:anywhere}
@media(max-width:560px){.field-pair{grid-template-columns:1fr}.composer-tools{margin-top:5px}.analysis-context{width:calc(100% - 20px);margin-bottom:5px}.sso-button{min-height:40px}}