/* ============================================================================
   有解 AI · 三端应用层（云工位 / 工作台 / 管理控制台共用）
   建立在 design-system/tokens.css + base.css 之上。规则：
     1. 容器一律用 base.css 的 .glass（.pad / .pad-sm），不另造平面卡。
     2. 状态一律 .badge（圆点 + 中文）；指标 .glass.metric / .glass.kpi；比例 .bars；
        图表 .chart（charts.md 的序列色顺序）；表格 .glass.table-card > .th + table.data。
     3. 本文件只补 base.css 没有的「应用骨架」：壳、工作台三栏、输入区、树、抽屉、
        页签、下拉、表单补充、桌面窗口壳、登录。不重新定义已有组件的观感。
     4. 密度：产品 UI 正文 13px（--fs-md）；卡片内距用 --space-4/5；按钮一律 btn-sm / btn-xs。
   ============================================================================ */

/* 0. 应用密度基线 ---------------------------------------------------------- */
body { font-size: var(--fs-md); line-height: var(--lh-normal); }
* { scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 999px; border: 2px solid transparent; background-clip: content-box; }
[hidden] { display: none !important; }
.u { font-size: .62em; color: var(--text-2); letter-spacing: 0; margin-left: .25em; font-weight: 500; }
.row { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.row.between { justify-content: space-between; }
.row.tight { gap: var(--space-2); }
.spacer { flex: 1; }
.stack { display: flex; flex-direction: column; gap: var(--space-4); }
.stack.tight { gap: var(--space-2); }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); }

/* 1. 壳：光斑底 + 侧栏 + 顶栏 --------------------------------------------- */
.app { position: relative; display: grid; grid-template-columns: 212px minmax(0, 1fr); min-height: 100vh; overflow: hidden; }
.app > .orb { position: fixed; z-index: 0; }
.app > * { position: relative; z-index: 1; }
.side { display: flex; flex-direction: column; gap: var(--space-5); height: 100vh; position: sticky; top: 0; padding: var(--space-4) var(--space-3); border-right: 1px solid var(--line); background: var(--bg-2); }
.side .brand { padding: 4px 8px var(--space-2); }
.side nav { display: flex; flex-direction: column; gap: var(--space-4); flex: 1; min-height: 0; overflow-y: auto; }
.side .side-h { margin-bottom: 4px; }
.side .side-list li { height: 34px; }
.side .side-list a { display: flex; align-items: center; gap: 9px; flex: 1; min-width: 0; height: 100%; }
.side .side-list li .meta { margin-left: auto; }
.side-foot { display: flex; flex-direction: column; gap: var(--space-2); padding-top: var(--space-3); border-top: 1px solid var(--line); }
.me { display: flex; align-items: center; gap: 10px; padding: 2px 6px; min-width: 0; }
.me .av { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: var(--surface-2); border: 1px solid var(--glass-border); font-family: var(--font-mono); font-size: 11px; flex: none; }
.me .who { display: flex; flex-direction: column; min-width: 0; flex: 1; line-height: 1.3; }
.me .who b { font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.me .who span { font-family: var(--font-mono); font-size: 10.5px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.main { min-width: 0; display: flex; flex-direction: column; }
.topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: var(--space-3); height: 52px; padding: 0 var(--space-6); border-bottom: 1px solid var(--line); background: var(--bg); }
.crumb { display: flex; align-items: center; gap: 8px; min-width: 0; font-family: var(--font-mono); font-size: var(--fs-sm); color: var(--text-2); min-width: 0; white-space: nowrap; overflow: hidden; }
.crumb b { color: var(--text); font-weight: 600; }
.crumb > span { overflow: hidden; text-overflow: ellipsis; }
.crumb i { color: var(--text-3); font-style: normal; }
.ask { display: flex; align-items: center; gap: 9px; height: 34px; flex: 1; max-width: 420px; padding: 0 12px; border-radius: var(--radius-pill); background: var(--surface-2); border: 1px solid var(--glass-border); color: var(--text-2); cursor: text; transition: border-color var(--dur) var(--ease); }
.ask:hover, .ask:focus-within { border-color: var(--primary-line); }
.ask .icon { width: 15px; height: 15px; color: var(--primary-strong); }
.ask input { flex: 1; min-width: 0; background: transparent; border: 0; outline: 0; font: inherit; font-size: var(--fs-sm); color: var(--text); }
.ask input::placeholder { color: var(--text-2); }
.bell { position: relative; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; border: 1px solid var(--glass-border); background: var(--surface-2); color: var(--text-2); }
.bell:hover { color: var(--text); }
.bell .cnt { position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: var(--warn); color: var(--on-primary); font-family: var(--font-mono); font-size: 10px; font-weight: 700; display: grid; place-items: center; }

.content { padding: var(--space-5) var(--space-6) var(--space-8); display: flex; flex-direction: column; gap: var(--space-5); max-width: 1320px; width: 100%; }
.content.flush { max-width: none; padding: var(--space-3); gap: var(--space-3); }
.page-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); }
.page-head h2 { font-size: var(--fs-xl); letter-spacing: -.01em; }
.page-head .n { font-family: var(--font-mono); font-size: var(--fs-md); color: var(--text-2); margin-left: 10px; font-weight: 500; }
.page-head .acts { display: flex; align-items: center; gap: var(--space-2); }

/* 2. 卡片补充：表格卡的紧凑表头、卡内标题行 ---------------------------------- */
.table-card .th { padding: 10px 14px; }
.table-card .th h4 { font-size: var(--fs-md); font-weight: var(--fw-black); }
.card-h { display: flex; align-items: baseline; gap: 10px; margin-bottom: var(--space-3); }
.card-h h4 { font-size: var(--fs-md); font-weight: var(--fw-black); min-width: 0; }
.card-h .n { font-family: var(--font-mono); font-size: var(--fs-sm); color: var(--text-2); font-weight: 500; }
.glass.pad-xs { padding: var(--space-3); }
table.data th, table.data td { padding: 9px 14px; }
table.data td.cell-main { font-weight: var(--fw-bold); max-width: 26em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
table.data td .sub { display: block; font-family: var(--font-mono); font-size: 10.5px; color: var(--text-2); margin-top: 1px; font-weight: 500; }
table.data tr.sel td, table.data tbody tr[aria-current="true"] td { background: var(--primary-soft); }
/* 可选中的行要有键盘焦点环：行本身不可聚焦，靠 mock.js 补 tabindex */
[data-select]:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }

table.data td .acts { display: flex; justify-content: flex-end; gap: 4px; }
table.data td .acts .btn { visibility: hidden; }
table.data tr:hover .acts .btn, table.data tr:focus-within .acts .btn { visibility: visible; }
/* 行动清单（简报 / 今天要管的事）里的按钮常显：悬停才出现等于没有入口 */
table.data td .acts.show .btn { visibility: visible; }
.table-wrap { overflow-x: auto; }
.metric .val .u { font-size: 12px; }
.kpi .big .u { font-size: .42em; color: var(--text-2); -webkit-text-fill-color: var(--text-2); }


/* base.css 的 .bar-row .fill 没有 display:block，用 <span> 时宽高不生效（用 <div> 才可见）；这里补上并给长标签一个宽档。 */
.bar-row .fill { display: block; }
.bars.wide .bar-row { grid-template-columns: 120px minmax(0, 1fr) 58px; }
.bars.wide .bar-row .lbl { font-size: var(--fs-sm); }

/* 3. 列表 ⇄ 抽屉 ----------------------------------------------------------- */
.split { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--space-4); align-items: start; }
.drawer { position: sticky; top: 68px; max-height: calc(100vh - 84px); display: flex; flex-direction: column; overflow: hidden; }
.drawer .dh { display: flex; align-items: flex-start; gap: var(--space-3); padding: var(--space-4) var(--space-4) var(--space-3); border-bottom: 1px solid var(--line); }
.drawer .dh .t { flex: 1; min-width: 0; }
.drawer .dh .t b { display: block; font-size: var(--fs-base); font-weight: var(--fw-black); }
.drawer .dh .t span { display: block; font-family: var(--font-mono); font-size: 10.5px; color: var(--text-2); margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.drawer .db { padding: var(--space-4); overflow-y: auto; display: flex; flex-direction: column; gap: var(--space-4); }
.drawer .df { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); border-top: 1px solid var(--line); }
.drawer .df .spacer { flex: 1; }

/* 键值表 */
.kv { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 7px var(--space-4); margin: 0; font-size: var(--fs-md); }
.kv dt { color: var(--text-2); font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; padding-top: 2px; }
.kv dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }

/* 4. 页签 ------------------------------------------------------------------ */
.tabs { display: flex; align-items: center; gap: 2px; border-bottom: 1px solid var(--line); }
.tab { height: 34px; padding: 0 12px; font-size: var(--fs-md); font-weight: var(--fw-semibold); color: var(--text-2); position: relative; display: inline-flex; align-items: center; gap: 7px; }
.tab .n { font-family: var(--font-mono); font-size: 10.5px; }
.tab:hover { color: var(--text); }
.tab[aria-selected="true"] { color: var(--text); }
.tab[aria-selected="true"]::after { content: ""; position: absolute; left: 6px; right: 6px; bottom: -1px; height: 2px; background: var(--primary); border-radius: 2px 2px 0 0; }
.tabs.pills { border: 0; gap: 6px; }
.tabs.pills .tab { height: 28px; border-radius: var(--radius-pill); border: 1px solid var(--glass-border); background: var(--glass-strong); font-size: var(--fs-sm); }
.tabs.pills .tab[aria-selected="true"] { background: var(--primary-soft); border-color: var(--primary-line); }
.tabs.pills .tab[aria-selected="true"]::after { display: none; }

/* 5. 图标按钮 / 下拉 -------------------------------------------------------- */
.icon-btn { width: 28px; height: 28px; display: inline-grid; place-items: center; border-radius: 8px; border: 1px solid transparent; color: var(--text-2); flex: none; }
.icon-btn:hover { background: var(--surface-2); color: var(--text); border-color: var(--glass-border); }
.icon-btn .icon { width: 15px; height: 15px; }
.icon-btn[aria-pressed="true"] { background: var(--primary-soft); color: var(--primary-strong); border-color: var(--primary-line); }
.dd { position: relative; display: inline-flex; }
/* 下拉菜单常盖在消息流文字上：底色用不透明的 --bg-2，嵌套在玻璃卡里时 backdrop-filter 不可靠 */
.dd-menu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 40; min-width: 220px; max-width: 340px; padding: 6px; border-radius: var(--radius-md); background: var(--bg-2); border: 1px solid var(--glass-border); box-shadow: var(--shadow); display: none; flex-direction: column; }
.dd-menu.left { right: auto; left: 0; }
.dd-menu.up { top: auto; bottom: calc(100% + 6px); }
.dd.open .dd-menu { display: flex; }
.dd-h { padding: 6px 10px 4px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-2); }
.dd-item { display: flex; align-items: center; gap: 9px; padding: 7px 10px; border-radius: var(--radius-sm); font-size: var(--fs-md); text-align: left; width: 100%; color: var(--text); }
.dd-item:hover { background: var(--surface-2); }
.dd-item .icon { width: 14px; height: 14px; color: var(--text-2); flex: none; }
.dd-item .t { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.dd-item .t span { font-size: 11px; color: var(--text-2); }
.dd-item[aria-checked="true"] { background: var(--primary-soft); }
.dd-item[aria-checked="true"] .icon { color: var(--primary); }
.dd-item[aria-disabled="true"] { opacity: .5; }
.dd-sep { height: 1px; background: var(--line); margin: 4px 6px; }

/* 6. 表单（components.md §6 / §9 的补充，只引用令牌） ------------------------- */
.input { height: 34px; border-radius: var(--radius-sm); }
.input .icon { width: 15px; height: 15px; }
.select { position: relative; display: flex; align-items: center; height: 34px; border-radius: var(--radius-sm); background: var(--surface-2); border: 1px solid var(--glass-border); color: var(--text); }
.select select { appearance: none; flex: 1; height: 100%; padding: 0 30px 0 11px; background: transparent; border: 0; outline: 0; font: inherit; color: inherit; cursor: pointer; }
.select .icon { position: absolute; right: 9px; pointer-events: none; color: var(--text-2); width: 14px; height: 14px; }
.select:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.textarea { width: 100%; min-height: 72px; padding: 9px 12px; border-radius: var(--radius-sm); background: var(--surface-2); border: 1px solid var(--glass-border); color: var(--text); font: inherit; line-height: 1.6; resize: vertical; }
.textarea:focus { outline: 0; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field > label { font-size: var(--fs-md); font-weight: var(--fw-bold); display: flex; align-items: center; gap: 6px; }
.field > label .req { color: var(--danger-text); }
.field .err { font-size: 11.5px; color: var(--danger-text); }
.field.invalid .input, .field.invalid .textarea, .field.invalid .select { border-color: var(--danger-text); }
.fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.fields .span { grid-column: 1 / -1; }
.switch-row { display: flex; align-items: center; gap: var(--space-3); padding: 9px 0; border-top: 1px solid var(--line); }
.switch-row:first-child { border-top: 0; }
.switch-row .t { flex: 1; min-width: 0; font-weight: var(--fw-semibold); }
.switch.sm { width: 34px; height: 20px; }
.switch.sm .track::after { width: 12px; height: 12px; }
.switch.sm input:checked + .track::after { transform: translateX(14px); }
.opts { display: flex; gap: 6px; flex-wrap: wrap; }
.opt { position: relative; display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 12px; border-radius: var(--radius-pill); border: 1px solid var(--glass-border); background: var(--glass-strong); font-size: var(--fs-md); font-weight: var(--fw-semibold); cursor: pointer; }
.opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.opt:has(input:checked) { background: var(--primary-soft); border-color: var(--primary-line); }
.opt:has(input:focus-visible) { outline: 2px solid var(--primary); outline-offset: 2px; }
.opt[data-locked] { opacity: .5; cursor: not-allowed; }
.lock { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-mono); font-size: 10px; color: var(--warn-text); }
.lock .icon { width: 11px; height: 11px; }

/* 7. 工作台三栏（两端同构；类名与桌面渲染层契约对齐） ------------------------- */
.wb { display: grid; grid-template-columns: 240px minmax(0, 1fr) 300px; gap: var(--space-3); height: calc(100vh - 52px - var(--space-3) * 2); min-height: 560px; }
.wb.panel-hidden { grid-template-columns: 240px minmax(0, 1fr); }
.wb.panel-hidden .wb-right { display: none; }
.wb.sidebar-hidden { grid-template-columns: minmax(0, 1fr) 300px; }
.wb.sidebar-hidden .wb-left { display: none; }
.wb > * { min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.wb-left .side-top { padding: 10px 10px 6px; }
.sess-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 12px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-2); }
.sess-list { flex: 1; overflow-y: auto; padding: 0 6px 8px; display: flex; flex-direction: column; gap: 1px; }
.proj-row { display: flex; align-items: center; gap: 2px; height: 30px; padding: 0 4px 0 6px; border-radius: var(--radius-sm); }
.proj-row:hover { background: var(--surface-2); }
.grow-btn { flex: 1; min-width: 0; display: flex; align-items: center; gap: 7px; height: 100%; padding: 0 4px; text-align: left; border-radius: 6px; }
.grow-btn .chev { width: 12px; height: 12px; color: var(--text-2); transition: transform var(--dur) var(--ease); flex: none; }
.proj-group.closed .chev { transform: rotate(-90deg); }
.proj-group.closed .proj-children { display: none; }
.proj-name { font-weight: var(--fw-bold); font-size: 12.5px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.proj-row[data-active="true"] .proj-name { color: var(--text); }
.proj-row .grow-btn > .icon { width: 14px; height: 14px; color: var(--text-2); flex: none; }
.proj-count { font-family: var(--font-mono); font-size: 10px; color: var(--text-2); padding: 0 4px; }
.row-actions { display: inline-flex; gap: 1px; }
.row-actions .icon-btn { width: 22px; height: 22px; visibility: hidden; }
.proj-row:hover .row-actions .icon-btn, .sess-item:hover .row-actions .icon-btn, .row-actions .dd.open .icon-btn { visibility: visible; }
.proj-children { display: flex; flex-direction: column; gap: 1px; padding-left: 10px; }
.sess-item { display: flex; align-items: center; height: 38px; padding: 0 4px 0 8px; border-radius: var(--radius-sm); }
.sess-item:hover { background: var(--surface-2); }
.sess-item[aria-current="true"] { background: var(--primary-soft); }
.sess-item .grow-btn { gap: 9px; }
.sess-item .t { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.sess-item .name { font-size: 12.5px; font-weight: var(--fw-semibold); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; align-items: center; gap: 5px; }
.sess-item .name .icon { width: 11px; height: 11px; color: var(--primary-strong); flex: none; }
.sess-item .meta { font-family: var(--font-mono); font-size: 10px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dot { width: 7px; height: 7px; border-radius: 50%; background: var(--text-3); flex: none; }
.dot.ok { background: var(--ok); } .dot.warn { background: var(--warn); } .dot.danger { background: var(--danger); } .dot.run { background: var(--primary); animation: yj-pulse 1.6s ease-in-out infinite; }
@keyframes yj-pulse { 0%, 100% { box-shadow: 0 0 0 3px var(--primary-soft); } 50% { box-shadow: 0 0 0 5px transparent; } }

.wb-center { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; grid-template-columns: minmax(0, 1fr); }
.wb-center > * { min-width: 0; }
.wb-topbar { display: flex; align-items: center; gap: 9px; height: 40px; padding: 0 var(--space-4); border-bottom: 1px solid var(--line); overflow: hidden; }
.wb-topbar > * { flex: none; }
.wb-topbar .t { flex: 0 1 auto; min-width: 7em; font-weight: var(--fw-black); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wb-topbar .crumb { flex: 0 1 auto; min-width: 3em; }
.wb-topbar .spacer { flex: 1 1 0; }
.stream { overflow-y: auto; padding: var(--space-4) var(--space-5); }
.stream-inner { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--space-3); }
.turn-sep { display: flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 10.5px; color: var(--text-2); margin-top: var(--space-2); }
.turn-sep::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.msg-user .meta, .msg-ai .who .num { font-family: var(--font-mono); font-size: 10.5px; color: var(--text-2); }
.msg-user .meta { margin-bottom: 4px; }
.tool summary { list-style: none; cursor: pointer; }
.tool summary::-webkit-details-marker { display: none; }
.tool .sum .spacer { flex: 1; }
.tool .sum .fail { color: var(--danger-text); }
.tool .sum .chev { width: 12px; height: 12px; transition: transform var(--dur) var(--ease); }
.tool[open] .sum .chev { transform: rotate(180deg); }
/* 工具卡的富内容体（记忆更新这类要放按钮的），与 .tool pre 同层 */
.tool .tb { border-top: 1px solid var(--line); padding: 10px 12px; display: grid; gap: 8px; }
.tool .tb .kv { margin: 0; }
/* 记忆条目列表（工作台右栏「记忆」页签，两端同构） */
.mem-list { display: grid; gap: 6px; }
.mem-list li { display: grid; gap: 2px; padding: 8px 10px; border: 1px solid var(--glass-border); border-radius: var(--radius-sm); background: var(--surface-2); }
.mem-list li b { font-size: 12px; font-weight: var(--fw-semibold); line-height: 1.45; }
.mem-list li span { font-family: var(--font-mono); font-size: 10.5px; color: var(--text-2); }
.diff { border: 1px solid var(--glass-border); border-radius: var(--radius-sm); overflow: hidden; font-family: var(--font-mono); font-size: 11px; line-height: 1.6; }
.diff .dh { display: flex; align-items: center; gap: 8px; padding: 6px 12px; border-bottom: 1px solid var(--line); background: var(--surface-2); color: var(--text-2); }
.diff .dh .f { color: var(--text); font-weight: 600; }
.diff .add-n { color: var(--ok-text); } .diff .del-n { color: var(--danger-text); }
.diff pre { padding: 8px 0; border-radius: 0; font-size: inherit; }
.diff .ln { display: block; padding: 0 12px; white-space: pre; color: var(--text-2); }
.diff .ln.add { background: var(--ok-soft); color: var(--text); } .diff .ln.del { background: var(--danger-soft); color: var(--text); } .diff .ln.hunk { color: var(--primary-strong); }
.approval .cmd { font-family: var(--font-mono); font-size: 11.5px; padding: 8px 10px; border-radius: var(--radius-sm); background: var(--code-bg); border: 1px solid var(--line); white-space: pre-wrap; overflow-wrap: anywhere; margin: 8px 0 10px; }
.approval.decided { border-color: var(--line-strong); background: var(--surface-2); }
.approval.decided::before { background: var(--ok); }
.artifact { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: var(--radius-sm); border: 1px solid var(--primary-line); background: var(--primary-soft); }
.artifact .t { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.artifact .t b { font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.artifact .t span { font-family: var(--font-mono); font-size: 10.5px; color: var(--text-2); }
.stream-end { display: flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 10.5px; color: var(--text-2); padding-top: var(--space-2); border-top: 1px dashed var(--line-strong); }
.working { display: flex; align-items: center; gap: 9px; font-family: var(--font-mono); font-size: 11px; color: var(--primary-strong); }
.working i { width: 7px; height: 7px; border-radius: 50%; background: var(--primary); animation: yj-pulse 1.4s ease-in-out infinite; }

.composer { border-top: 1px solid var(--line); padding: 10px var(--space-4) 12px; }
.composer-inner { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; gap: 8px; }
.composer .textarea { min-height: 58px; background: var(--surface); }
.composer-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.composer-bar .spacer { flex: 1; }
.pill { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 11px 0 9px; border-radius: var(--radius-pill); border: 1px solid var(--glass-border); background: var(--glass-strong); font-size: 11.5px; font-weight: var(--fw-bold); color: var(--text); white-space: nowrap; }
.pill:hover { border-color: var(--primary-line); }
.pill .icon { width: 13px; height: 13px; color: var(--text-2); }
.pill .sub { font-family: var(--font-mono); font-weight: 500; color: var(--text-2); font-size: 10.5px; }
.pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--tone, var(--primary)); flex: none; }
.pill.ro { --tone: var(--text-3); } .pill.ask { --tone: var(--warn); } .pill.auto { --tone: var(--primary); } .pill.full { --tone: var(--danger); }
.pill.on { background: var(--primary-soft); border-color: var(--primary-line); }
.pill.on .icon { color: var(--primary); }
.send { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: linear-gradient(135deg, var(--primary-strong), var(--primary-deep)); color: var(--on-primary); box-shadow: var(--shadow-primary); }
.send .icon { width: 15px; height: 15px; }
.send.stop { background: var(--danger-soft); color: var(--danger-text); border: 1px solid var(--danger-text); box-shadow: none; }
.ctx { display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-mono); font-size: 10px; color: var(--text-2); }
.ctx .track { width: 56px; height: 4px; border-radius: 2px; background: var(--track); overflow: hidden; }
.ctx .track i { display: block; height: 100%; width: var(--p); background: var(--primary); }

.wb-right .tabs { padding: 0 6px; }
.wb-right .tab { height: 36px; padding: 0 9px; }
.insp { flex: 1; overflow-y: auto; padding: var(--space-3); display: flex; flex-direction: column; gap: var(--space-3); }
.tree { display: flex; flex-direction: column; gap: 1px; }
.tree-row { display: flex; align-items: center; gap: 7px; height: 25px; padding: 0 6px 0 calc(6px + var(--d, 0) * 14px); border-radius: 6px; font-family: var(--font-mono); font-size: 11.5px; }
.tree-row:hover { background: var(--surface-2); }
.tree-row .icon { width: 13px; height: 13px; color: var(--text-2); flex: none; }
.tree-row .chev { width: 11px; height: 11px; }
.tree-row .n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-row .m { font-size: 10px; color: var(--text-2); }
.tree-row.changed .n { color: var(--primary-strong); }
.tree-row.new .n { color: var(--ok-text); }
.tree-row.dim { color: var(--text-3); }

/* 8. 桌面窗口壳 ------------------------------------------------------------ */
.win { --titlebar-h: 38px; --rail-w: 50px; position: relative; display: flex; flex-direction: column; height: 100vh; min-height: 700px; overflow: hidden; }
.win > .orb { position: absolute; z-index: 0; }
.win > *:not(.orb) { position: relative; z-index: 1; }
.titlebar { display: flex; align-items: center; height: var(--titlebar-h); padding: 0 12px; border-bottom: 1px solid var(--line); background: var(--bg-2); }
.titlebar .traffic { width: 62px; display: flex; gap: 8px; }
.titlebar .traffic i { width: 11px; height: 11px; border-radius: 50%; background: var(--track); }
.titlebar .title { flex: 1; text-align: center; font-family: var(--font-mono); font-size: 11px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.titlebar .title b { color: var(--text); font-weight: 600; }
.titlebar .acts { width: 62px; display: flex; justify-content: flex-end; }
.app-body { display: grid; grid-template-columns: var(--rail-w) minmax(0, 1fr); flex: 1; min-height: 0; }
.rail { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 0; border-right: 1px solid var(--line); background: var(--bg-2); }
.rail .logo { width: 30px; height: 30px; display: grid; place-items: center; margin-bottom: 6px; }
.rail .logo svg { width: 22px; height: 22px; }
.rail-btn { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; border: 1px solid transparent; color: var(--text-2); position: relative; }
.rail-btn:hover { background: var(--surface-2); color: var(--text); }
.rail-btn[aria-current="page"] { background: var(--primary-soft); color: var(--primary); border-color: var(--primary-line); }
.rail-btn .icon { width: 17px; height: 17px; }
.rail-btn .cnt { position: absolute; top: 1px; right: 1px; min-width: 14px; height: 14px; padding: 0 3px; border-radius: 999px; background: var(--warn); color: var(--on-primary); font-family: var(--font-mono); font-size: 9px; font-weight: 700; display: grid; place-items: center; }
.rail .spacer { flex: 1; }
.screens { min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; position: relative; }
.screen { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.scr { padding: var(--space-5) var(--space-6) var(--space-7); display: flex; flex-direction: column; gap: var(--space-5); overflow-y: auto; flex: 1; min-height: 0; }
.win .wb { height: auto; flex: 1; min-height: 0; gap: 0; }
.win .wb > * { border-radius: 0; border-top: 0; border-bottom: 0; box-shadow: none; background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
.win .wb > *::before { display: none; }
.win .wb-left { border-left: 0; border-right: 1px solid var(--line); }
.win .wb-right { border-right: 0; border-left: 1px solid var(--line); }
.win .wb-center { border: 0; }
.org-chip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 9px; border-radius: var(--radius-pill); border: 1px solid var(--glass-border); background: var(--glass-strong); font-size: 11px; font-weight: var(--fw-bold); }
.org-chip .icon { width: 12px; height: 12px; color: var(--text-2); }
.sheet-backdrop { position: absolute; inset: 0; z-index: 50; background: var(--bg); opacity: .6; }
/* 网页壳（.app）里改用视口定位：.app 比视口高时，绝对定位会把面板拉长到文档高度 */
.app > .sheet-backdrop { position: fixed; }
.app > .sheet { position: fixed; inset: 56px 44px; max-height: calc(100vh - 112px); }
.sheet { position: absolute; inset: 32px 44px; z-index: 60; display: flex; flex-direction: column; overflow: hidden; box-shadow: var(--shadow); }
.sheet .sh { display: flex; align-items: center; gap: 12px; padding: 12px var(--space-5); border-bottom: 1px solid var(--line); }
.sheet .sb { flex: 1; min-height: 0; overflow-y: auto; padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-4); }
.sheet .sf { display: flex; align-items: center; gap: var(--space-2); padding: 12px var(--space-5); border-top: 1px solid var(--line); }
.sheet .sf .spacer { flex: 1; }

/* 9. 登录 ------------------------------------------------------------------ */
.login { position: relative; min-height: 100vh; display: grid; place-items: center; overflow: hidden; }
.login .orb { position: absolute; }
.login .card { position: relative; z-index: 1; width: 380px; display: flex; flex-direction: column; gap: var(--space-4); }
.login .card h2 { font-size: var(--fs-2xl); }

/* 10. 响应式 --------------------------------------------------------------- */
@media (max-width: 1280px) { .split { grid-template-columns: minmax(0, 1fr) 320px; } .wb { grid-template-columns: 220px minmax(0, 1fr) 280px; } }
@media (max-width: 1100px) { .split { grid-template-columns: minmax(0, 1fr); } .drawer { position: static; max-height: none; } .wb { grid-template-columns: 220px minmax(0, 1fr); } .wb-right { display: none; } .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .app { grid-template-columns: 1fr; } .side { position: static; height: auto; } .grid-3, .grid-2, .fields { grid-template-columns: minmax(0, 1fr); } }
/* 手机：侧栏收成顶部横条，首屏先出内容；危险动作与指令条在手机上不渲染 */
@media (max-width: 640px) {
  .side { flex-direction: row; align-items: center; gap: var(--space-3); overflow-x: auto; padding: 8px 10px; }
  .side nav { flex-direction: row; gap: var(--space-3); overflow-x: auto; }
  .side nav > div { display: flex; align-items: center; gap: 6px; }
  .side .side-h, .side-foot { display: none; }
  .side .side-list { flex-direction: row; gap: 4px; }
  .side .side-list li { height: 30px; }
  .side .side-list a { padding: 0 8px; white-space: nowrap; }
  .topbar { padding: 0 var(--space-4); gap: var(--space-2); }
  .topbar .ask, .topbar .btn-danger { display: none; }
  .content { padding: var(--space-4) var(--space-4) var(--space-6); gap: var(--space-4); }
  .kpi-row, .kpi-row.three, .grid-2, .grid-3, .grid-4, .split { grid-template-columns: minmax(0, 1fr); }
  .kpi .big { font-size: var(--fs-xl); }
  .kpi .sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .page-head { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
  /* 工作台三栏在手机上只留会话：左栏收起，顶栏只留标题 / 状态 / 菜单 */
  .wb, .wb.panel-hidden, .wb.sidebar-hidden { grid-template-columns: minmax(0, 1fr); }
  .wb-left { display: none; }
  .wb-topbar .crumb, .wb-topbar .chip, .wb-topbar .org-chip { display: none; }
  .stream, .composer { padding-left: var(--space-3); padding-right: var(--space-3); }
}

/* ===== 2026-09-18 重设计新增：不重定义 base.css 已有组件 ===== */
/* 「回执未知」独立状态：不是失败、不是等待，虚线边 + 靛蓝色，与 ok / warn / danger / info 都区分开 */
.badge-unknown { background: var(--surface-2); color: var(--chart-2); border-color: var(--line-strong); border-style: dashed; }
/* 待处理收件箱：三端同一结构。.inbox > .grp（组头）+ .it（条目：点 · 主文 · 副文 · 时间 · 主动作） */
.inbox { display: grid; gap: var(--space-4); }
.inbox .grp { display: grid; gap: 6px; }
.inbox .grp > h5 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: var(--fs-sm); font-family: var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--text-2); }
.inbox .grp > h5 .n { color: var(--text); font-weight: var(--fw-black); }
.inbox .it { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto auto; gap: 4px 12px; align-items: center; padding: 9px 12px; border: 1px solid var(--glass-border); border-radius: var(--radius-sm); background: var(--surface-2); }
.inbox .it i { width: 8px; height: 8px; border-radius: 50%; background: var(--tone, var(--text-3)); }
.inbox .it.warn i { --tone: var(--warn); } .inbox .it.danger i { --tone: var(--danger); } .inbox .it.ok i { --tone: var(--ok); } .inbox .it.info i { --tone: var(--primary); } .inbox .it.unknown i { --tone: var(--chart-2); }
.inbox .it b { font-size: 12.5px; font-weight: var(--fw-semibold); line-height: 1.4; }
.inbox .it b + span { display: block; font-size: 11.5px; color: var(--text-2); margin-top: 1px; }
.inbox .it .when { font-family: var(--font-mono); font-size: 10.5px; color: var(--text-2); white-space: nowrap; }
.inbox .it .done { opacity: .55; }
/* 前置检查清单（发送到云端 / 发布 / 签发）：每行一个结论，图标说通过没通过 */
.checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.checks li { display: grid; grid-template-columns: 16px minmax(0, 1fr); gap: 10px; align-items: start; font-size: 12.5px; line-height: 1.45; }
.checks li .icon { width: 16px; height: 16px; margin-top: 1px; color: var(--ok); }
.checks li.warn .icon { color: var(--warn); } .checks li.danger .icon { color: var(--danger); } .checks li.off .icon { color: var(--text-3); }
.checks li span { color: var(--text-2); }
.checks li code { font-family: var(--font-mono); font-size: 11px; }
/* 弹层里的页签条 */
.sheet .sh .tabs { margin-left: auto; }