/* 首页 —— 0.2.2 文案口径版（0.2.1 版式：对齐 Rick 手绘图实测比例，2026-10-16）
   依据：总锚 §165.5 整改表 / 主档 §13（实测：他图 对话 76.4% : 部门 20.1% ≈ 3.8:1）
   ① 左右比例：左栏自适应吃满 ＋ 右栏固定 385px（≈20% @1920，图上 20.1%）
   ② 对话框内部拆两段：今日待办窄条 236px（图上 ≈240px @1920）＋ 会话区吃满
   ③ 收缩按钮从标题栏挪到窄条右边缘（图上蓝色竖椭圆）
   ④ 部门栏 8 张卡一列竖排（图上）
   ⑤ 底部对话输入框移出对话框，通栏常驻（图上红框横跨整幅，含部门栏下方）
   只动首页三件（本文件 ＋ ui_home.html ＋ home.js）；其余 14 个界面与 ui.css 一字未动 */

/* ================= 壳层：首页占满视口，三段（顶栏 / 主体 / 通栏输入框） ================= */
html.fluidmode, html.fluidmode body { height: 100%; overflow: hidden; }
html.fluidmode #wrap { height: 100vh; overflow: hidden; }
html.fluidmode #stage { height: 100%; }
/* 高度用 100vh：app.js 的 fit() 在 fluid 模式下会给 #wrap 打 inline height:auto（不改它，避免动壳层） */
.app.fluid { width: auto !important; max-width: none; height: 100vh; margin: 0; padding: 12px 14px 10px;
  display: flex; flex-direction: column; gap: 10px; }
.app.fluid .topbar { flex: 0 0 auto; }
.hmbody { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) 385px; gap: 10px; }

/* ================= 对话框（整块）：左窄条 ＋ 右会话区 ================= */
.dlgcol { position: relative; min-height: 0; overflow: hidden; border-radius:var(--r-card); color: var(--c-dark-ink);
  background: var(--c-dark); box-shadow: none;
  display: grid; grid-template-columns: 236px minmax(0, 1fr); }

/* —— 左段：今日待办窄条 —— */
.rail { display: flex; flex-direction: column; min-height: 0; border-right: 1px solid var(--c-primary); background: rgba(255, 255, 255, .015); }
.railhead { flex: 0 0 auto; padding: 9px 10px 8px; border-bottom: 1px solid var(--c-primary); }
.rtitle { font-size:var(--fs-2); font-weight: 700; color: var(--c-dark-ink); }
.rsub { font-size:var(--fs-1); color: var(--c-ink4); margin-top: 4px; }
.dghost { display: inline-block; margin-top: 5px; font-size:var(--fs-1); color: var(--c-line); background: var(--c-primary); border-radius:var(--r-ctl); padding: 1px 7px; cursor: pointer; }
.dghost:hover { background: var(--c-dark3); }
.raillist { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 8px 8px 2px; }
.railfoot { flex: 0 0 auto; display: flex; justify-content: flex-end; padding: 3px 6px 0; }

/* 收缩按钮：窄条右边缘的蓝色竖椭圆（图上画的） */
.shrink { width: 24px; height: 58px; border-radius:var(--r-card); cursor: pointer; font-size:var(--fs-2); line-height: 1;
  border: 1px solid var(--c-accent); background: var(--c-dark3); color: var(--c-dark-ink); font-family: inherit; }
.shrink:hover { filter: brightness(1.15); }

/* 四入口：窄条底部一列竖排（图上） */
.entries { flex: 0 0 auto; display: flex; flex-direction: column; gap: 5px; padding: 8px 8px 9px; border-top: 1px solid var(--c-primary); }
.en { display: flex; align-items: center; gap: 6px; border: 1px solid var(--c-dark-line); background: var(--c-primary); border-radius:var(--r-ctl); padding: 6px 9px; cursor: pointer; }
.en:hover { background: var(--c-primary); border-color: var(--c-accent); }
.en.on { background: var(--c-primary); border-color: var(--c-accent); }
.en .en1 { flex: 1 1 auto; font-size:var(--fs-1); font-weight: 700; color: var(--c-dark-ink2); text-align: left; }
.en .enx { flex: 0 0 auto; font-size:var(--fs-1); color: var(--c-dark-ink3); }

/* —— 右段：会话区（推进来的东西 / 点开的下层 / 你说过的话都在这块里开）—— */
.chat { display: flex; flex-direction: column; min-height: 0; }
.chathead { flex: 0 0 auto; padding: 10px 14px 9px; border-bottom: 1px solid var(--c-primary); }
.ct1 { font-size:var(--fs-2); font-weight: 700; color: var(--c-dark-ink); }
.ct2 { font-size:var(--fs-1); color: var(--c-ink4); margin-top: 4px; line-height: 1.5; }
.chatscroll { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 10px 14px 12px; }
.chatlead { font-size:var(--fs-2); color: var(--c-line); line-height: 1.7; margin-bottom: 10px; }
.msg { display: flex; gap: 8px; margin-bottom: 8px; }
.msg .who { flex: 0 0 34px; font-size:var(--fs-1); color: var(--c-ink3); padding-top: 4px; }
.msg .bub { max-width: 92%; background: var(--c-primary); border: 1px solid var(--c-primary); border-radius:var(--r-ctl); padding: 7px 10px;
  font-size:var(--fs-1); line-height: 1.6; color: var(--c-dark-ink2); }
.msg.me .bub { background: var(--c-dark2); border-color: var(--c-dark-line); color: var(--c-dark-ink); }
.cbottom { margin-top: 10px; font-size:var(--fs-1); color: var(--c-ink3); line-height: 1.6; }

/* ================= 今日待办卡（窄条里：事 / 原因 / 处理建议 ＋ 勾叉） ================= */
.tcard { position: relative; background: var(--c-primary); border: 1px solid var(--c-primary); border-left: 3px solid var(--c-accent);
  border-radius:var(--r-ctl); padding: 8px 9px 7px; margin-bottom: 7px; cursor: pointer; }
.tcard:hover { background: var(--c-dark2); }
.tcard.on { background: var(--c-dark2); border-color: var(--c-accent); }
.tcard.red { border-left-color: var(--c-red); }
.tcard.warn { border-left-color: var(--c-amber-ink); }
.tcard.ok { border-left-color: var(--c-green); }
.tcard.done { opacity: .55; }
.tcard.temp { border-left-color: var(--c-accent-on-dark); }
.thead { display: flex; align-items: flex-start; gap: 6px; }
.tw { flex: 1 1 auto; font-size:var(--fs-2); font-weight: 700; color: var(--c-dark-ink); line-height: 1.45; }
.trow { display: flex; gap: 6px; font-size:var(--fs-1); line-height: 1.55; color: var(--c-ink4); margin-top: 5px; }
.trow .k { flex: 0 0 46px; color: var(--c-ink3); font-weight: 600; }
.trow .k.blank { color: var(--c-dark-ink3); }
.trow > div { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.trow b { color: var(--c-line); font-weight: 600; }
.twatch { font-size:var(--fs-1); color: var(--c-dark-ink3); }
.tfoot { display: flex; align-items: center; gap: 5px; margin-top: 7px; padding-top: 6px; border-top: 1px solid var(--c-primary); }
.tfoot .ghost { flex: 0 1 auto; font-size:var(--fs-1); color: var(--c-ink3); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bk { flex: 1 1 0; border: 1px solid var(--c-dark-line); background: var(--c-dark3); color: var(--c-line); font-size:var(--fs-1); font-weight: 600;
  border-radius:var(--r-ctl); padding: 5px 0; cursor: pointer; font-family: inherit; text-align: center; }
.bk:hover { background: var(--c-dark3); color: var(--c-ink-on-dark); }
.bk.done:hover { border-color: var(--c-green); color: var(--c-green-on-dark); }
.bk.drop:hover { border-color: var(--c-red); color: var(--c-red-on-dark); }
.rchip { font-size:var(--fs-1); border-radius:var(--r-ctl); padding: 1px 6px; font-weight: 600; white-space: nowrap; }
.rchip.auto { background: var(--c-dark2); color: var(--c-accent); }
.rchip.hand { background: var(--c-dark3); color: var(--c-dark-ink2); }

/* 空态（会话区里，不空着） */
.dlgempty { padding: 18px 2px 6px; }
.dlgempty .e1 { font-size:var(--fs-3); font-weight: 700; color: var(--c-line2); letter-spacing: 0; }
.dlgempty .e2 { font-size:var(--fs-1); color: var(--c-ink4); line-height: 1.9; margin-top: 8px; }
.dlgempty .e3 { font-size:var(--fs-1); color: var(--c-dark-ink2); line-height: 1.9; margin-top: 12px; background: var(--c-primary); border: 1px solid var(--c-primary); border-radius:var(--r-ctl); padding: 10px 12px; }

/* ================= 会话区里的下一层（顶上留返回） ================= */
.dlgview { animation: hmin .16s ease-out; }
@keyframes hmin { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.vhead { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.vback { border: 1px solid var(--c-dark-line); background: var(--c-dark3); color: var(--c-line); font-size:var(--fs-1); border-radius:var(--r-ctl); padding: 4px 9px; cursor: pointer; font-family: inherit; }
.vback:hover { background: var(--c-dark3); }
.vtitle { font-size:var(--fs-2); font-weight: 700; color: var(--c-dark-ink); }
.vsub { font-size:var(--fs-1); color: var(--c-ink3); }
.vblock { background: var(--c-primary); border: 1px solid var(--c-primary); border-radius:var(--r-ctl); padding: 8px 10px; margin-bottom: 8px; }
.vblock .vt { font-size:var(--fs-1); font-weight: 700; color: var(--c-line); margin-bottom: 5px; }
.vrow { display: flex; gap: 7px; font-size:var(--fs-1); color: var(--c-ink4); line-height: 1.6; padding: 4px 0; border-top: 1px solid var(--c-primary); }
.vrow:first-of-type { border-top: 0; }
.vrow .vlab { flex: 0 0 96px; color: var(--c-ink3); }
.vrow .vval { color: var(--c-line); font-weight: 600; font-variant-numeric: tabular-nums; }
.vrow .vcmp { color: var(--c-dark-ink3); }
.vrow .vline { flex: 1; color: var(--c-ink4); }
.vrow.drillable:hover .vval { color: var(--c-accent); text-decoration: underline dotted; text-underline-offset: 3px; }
.vblock .tfoot { padding: 8px 0 0; }

/* ================= 右栏：8 张部门卡一列竖排 ================= */
.deptcol { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.depthead { flex: 0 0 auto; display: flex; align-items: baseline; gap: 8px; margin: 0 2px 5px; }
.depthead2 { flex: 0 0 auto; margin: 0 2px 8px; }
.dt2 { font-size:var(--fs-2); font-weight: 700; }
.hmright { margin-left: auto; }
.deptscroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding-right: 3px; }
.deptgrid { display: grid; grid-template-columns: 1fr; gap: 10px; align-items: start; }
.dcard { padding: 10px 12px 9px; }
.dchead { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.dcname { font-size:var(--fs-2); font-weight: 700; }
.dchead .cnote { line-height: 1.4; }
.blk { margin-left: auto; min-width: 30px; height: 24px; border-radius:var(--r-ctl); border: 1px solid var(--line); background: var(--c-btn);
  color: var(--sub); font-size:var(--fs-2); font-weight: 800; display: inline-flex; align-items: center; justify-content: center; gap: 3px; padding: 0 7px; cursor: pointer; font-variant-numeric: tabular-nums; }
.blk:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-l); }
.blk.red { background: var(--red-l); color: var(--red); border-color: var(--c-line); }
.blk.warn { background: var(--amber-l); color: var(--amber); border-color: var(--c-line); }
.blk.ok { background: var(--green-l); color: var(--green); border-color: var(--c-line); }
.blk.zero { color: var(--c-ink3); }
.blk .bsub { font-size:var(--fs-1); font-weight: 600; opacity: .9; }
.dcard.case { border-style: dashed; }
.casetag { font-size:var(--fs-1); font-weight: 700; color: var(--c-amber); background: var(--amber-l); border-radius:var(--r-ctl); padding: 1px 6px; }

/* 超线行：红黄上浮（详细）／绿行缩成一行 */
.r { padding: 6px 0; border-top: 1px solid var(--line2); }
.r:first-child { border-top: 0; }
.r.head { padding-bottom: 4px; }
.r .rtop { display: flex; align-items: baseline; gap: 7px; }
.r .rl { font-size:var(--fs-1); color: var(--sub); flex: 1; }
.r .rv { font-size:var(--fs-3); font-weight: 700; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.r .rv small { font-size:var(--fs-1); font-weight: 600; color: var(--sub); margin-left: 2px; letter-spacing: 0; }
.r.red .rv { color: var(--red); }
.r.warn .rv { color: var(--amber); }
.r .rc { font-size:var(--fs-1); color: var(--weak); line-height: 1.5; margin-top: 2px; }
.r .rc b { color: var(--sub); font-weight: 600; }
.r .rline { font-size:var(--fs-1); color: var(--sub); line-height: 1.62; margin-top: 4px; background: var(--c-todo); border-radius:var(--r-ctl); padding: 6px 8px; }
.r.red .rline { background: var(--c-red-l); }
.r.warn .rline { background: var(--c-amber-l); }
.r.flat { display: flex; align-items: baseline; gap: 6px; padding: 4px 0; }
.r.flat .rl { flex: 0 0 auto; font-size:var(--fs-1); color: var(--weak); }
.r.flat .rv { font-size:var(--fs-2); font-weight: 600; color: var(--ink); }
.r.flat .rc { margin: 0 0 0 auto; font-size:var(--fs-1); text-align: right; }
.dcard .fold { font-size:var(--fs-1); color: var(--weak); cursor: pointer; padding-top: 5px; border-top: 1px solid var(--line2); }
.dcard .fold:hover { color: var(--blue); }
.dcard.drillable:hover .dcname { color: var(--blue); }
.footline { font-size:var(--fs-1); color: var(--weak); line-height: 1.6; margin: 9px 2px 0; }
.footline b { color: var(--sub); font-weight: 600; }
.hmscan { border-left: 1px solid var(--c-primary-d); padding-left: 12px; color: var(--c-ink4); }

/* ================= 底部通栏对话输入框（对话框之外，常驻） ================= */
.inputbar { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; padding: 9px 12px;
  background: var(--c-dark); border-radius:var(--r-card); box-shadow: none; }
#hminput { flex: 1 1 auto; min-width: 0; background: var(--c-dark2); border: 1px solid var(--c-dark-line); border-radius:var(--r-ctl);
  color: var(--c-line2); font-size:var(--fs-2); padding: 9px 11px; outline: none; font-family: inherit; }
#hminput::placeholder { color: var(--c-ink3); }
#hminput:focus { border-color: var(--c-accent); background: var(--c-dark3); }
#hmsend { flex: 0 0 auto; border: 0; background: var(--c-accent); color: var(--c-ink-on-dark); font-size:var(--fs-2); font-weight: 600;
  border-radius:var(--r-ctl); padding: 9px 18px; cursor: pointer; font-family: inherit; }
#hmsend:hover { filter: brightness(1.08); }
.ibarnote { flex: 0 1 auto; max-width: 42%; font-size:var(--fs-1); color: var(--c-ink3); line-height: 1.5; }

/* ================= 收缩态：整块对话框向左收，部门栏铺满（按钮收哪块＝待 Rick 定，见 §165.6）================= */
.app.fluid.collapsed .hmbody { grid-template-columns: 46px minmax(0, 1fr); }
.app.fluid.collapsed .dlgcol { display: flex; }
.app.fluid.collapsed .chat { display: none; }
.app.fluid.collapsed .railhead, .app.fluid.collapsed .raillist, .app.fluid.collapsed .entries { display: none; }
.app.fluid.collapsed .rail { border-right: 0; align-items: center; }
.app.fluid.collapsed .railfoot { justify-content: center; padding: 12px 0; }
.app.fluid.collapsed .shrink { transform: rotate(180deg); }
.app.fluid.collapsed .dlgcol::after { content: "对话框 · 点箭头展开"; writing-mode: vertical-rl; text-align: center;
  color: var(--c-ink4); font-size:var(--fs-1); letter-spacing: 4px; margin: 6px auto 0; }
.app.fluid.collapsed .deptgrid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }

/* ================= 窄屏兜底 ================= */
@media (max-width: 1280px) {
  .hmbody { grid-template-columns: minmax(0, 1fr) 330px; }
  .dlgcol { grid-template-columns: 208px minmax(0, 1fr); }
  .ibarnote { display: none; }
}
@media (max-width: 1024px) {
  .hmbody { grid-template-columns: minmax(0, 1fr) 290px; }
  .dlgcol { grid-template-columns: 180px minmax(0, 1fr); }
}


/* ---------- 风险横条（R2 改横向·2026-10-26 Rick 令）：通栏置顶，红黄项横排，超出横向滚动 ---------- */
.riskbar { flex: 0 0 auto; border-radius:var(--r-card); background: var(--c-dark); border: 1px solid var(--c-dark-line);
  padding: 7px 10px 8px; overflow: hidden; }
.riskhead { display: flex; align-items: baseline; gap: 8px; padding: 0 2px 6px; }
.riskhead .rt2 { font-size:var(--fs-2); font-weight: 700; color: var(--c-line); letter-spacing: 0; }
.riskhead .rsub2 { font-size:var(--fs-1); color: var(--c-ink4); }
.riskbar .riskhint { font-size:var(--fs-1); color: var(--c-ink3); line-height: 1.4; margin-left: auto; }
.risklist { display: flex; gap: 8px; overflow-x: auto; overflow-y: hidden; padding-bottom: 2px; }
.risklist::-webkit-scrollbar { height: 6px; }
.risklist::-webkit-scrollbar-thumb { background: var(--c-dark3); border-radius:var(--r-ctl); }
.rcard { flex: 0 0 320px; border: 1px solid var(--c-dark-line); border-left-width: 3px; border-radius:var(--r-ctl); background: var(--c-dark2); padding: 7px 9px 8px; }
.rcard.red { border-left-color: var(--c-red-on-dark); }
.rcard.warn { border-left-color: var(--c-amber); }
.rcard .rt { font-size:var(--fs-1); color: var(--c-line); font-weight: 600; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rcard .rv2 { font-size:var(--fs-1); color: var(--c-dark-ink2); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rcard .rv2 b { color: var(--c-ink-on-dark); font-size:var(--fs-3); }
.rcard .rd { font-size:var(--fs-1); color: var(--c-ink4); line-height: 1.4; margin-top: 1px; display: -webkit-box;
  -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.rcard .rout { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: 5px; }
.rcard .rwho { font-size:var(--fs-1); color: var(--c-dark-ink3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rcard .rbtn { flex: 0 0 auto; font-size:var(--fs-1); padding: 2px 8px; border-radius:var(--r-ctl); cursor: pointer;
  border: 1px solid var(--c-dark-line); background: var(--c-dark2); color: var(--c-line); }
.rcard .rbtn:hover { background: var(--c-dark3); }
.rcard .rbtn.on { border-color: var(--c-green); color: var(--c-green-on-dark); background: var(--c-dark2); cursor: default; }
.riskempty { font-size:var(--fs-1); color: var(--c-ink4); line-height: 1.6; padding: 6px 4px; }
.rcount { display: inline-block; min-width: 15px; text-align: center; border-radius:var(--r-ctl); padding: 0 4px;
  font-size:var(--fs-1); margin-left: 4px; background: var(--c-dark3); color: var(--c-red-on-dark); }

/* ---------- 部门卡·紧凑版（一屏看全 8 个部门；超线数字放大） ---------- */
.dcard.mini { padding: 6px 9px 6px; }
.dcard.mini .dchead { margin-bottom: 1px; gap: 6px; }
.dcard.mini .dcname { font-size:var(--fs-2); }
.dcard.mini .blk { height: 19px; min-width: 25px; font-size:var(--fs-1); border-radius:var(--r-ctl); }
.dcard.mini .blk .bsub { font-size:var(--fs-1); }
.dcard.mini.case { border-style: dashed; }
.dcard.mini .casetag { font-size:var(--fs-1); padding: 0 5px; }
.dstat { font-size:var(--fs-1); font-weight: 700; border-radius:var(--r-ctl); padding: 0 6px; white-space: nowrap; }
.dstat.red { color: var(--c-red); background: var(--c-red-l); }
.dstat.warn { color: var(--c-amber); background: var(--c-amber-l); }
.dstat.ok { color: var(--c-green); background: var(--c-green-l); }
.dhot { display: flex; flex-direction: column; }
.dh { display: flex; align-items: baseline; gap: 6px; padding: 0; cursor: pointer; }
.dh .dl { flex: 0 1 auto; max-width: 38%; font-size:var(--fs-1); color: var(--sub);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dh .dv { margin-left: auto; font-size:var(--fs-4); font-weight: 800; letter-spacing: -1px; line-height: 1.1;
  font-variant-numeric: tabular-nums; }
.dh .dv small { font-size:var(--fs-1); font-weight: 600; color: var(--sub); margin-left: 1px; letter-spacing: 0; }
.dh.red .dv { color: var(--red); }
.dh.warn .dv { color: var(--c-amber-ink); }
.dh .dx { flex: 0 0 auto; align-self: center; font-size:var(--fs-1); font-weight: 800; border-radius:var(--r-ctl);
  padding: 1px 6px; white-space: nowrap; letter-spacing: 0;
  color: var(--c-red); background: var(--c-red-l); }
.dh.warn .dx { color: var(--c-amber); background: var(--c-amber-l); }
.dh .dxm { flex: 0 0 auto; align-self: center; font-size:var(--fs-1); color: var(--weak);
  max-width: 34%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dh:hover .dl { color: var(--blue); }
.dflat { display: flex; gap: 9px; overflow: hidden; white-space: nowrap; margin-top: 1px;
  font-size:var(--fs-1); color: var(--weak); }
.dflat b { color: var(--ink); font-weight: 700; font-variant-numeric: tabular-nums; }
.dflat .bad b { color: var(--c-red); }
.dflat .bad.warn b { color: var(--c-amber); }
.dcard.mini .fold { display: none; }

/* ---------- 第 18 场：10 张部门卡一屏放下（只改既有类取值，不加新 class；作用域限 .app.fluid＝首页） ---------- */
.app.fluid .deptgrid { gap: 6px; }
.app.fluid .dcard.mini { padding: 4px 9px 4px; }
.app.fluid .dcard.mini .dchead { margin-bottom: 0; }
.app.fluid .dh .dv { line-height: 1.0; }