/* ═══════ 交互层（2026-08-20，Jack：功能 1:1 还原截图） ═══════
   面板上的按钮、三张整页弹层（房价/排班/复盘）、toast。
   逻辑全在 js/hos-demo.js；这里只管长相。
   弹层是屏幕空间的 fixed 层，不进 3D——放进 .world 会被 transform 劫走。 */

/* ── 命中修复（没有这三行，下面所有按钮都是摆设） ──
   .world/.rig 是 preserve-3d 容器，它们自己那层透明平面挂在 z=0；
   面板全被推到 z=-640 一带。3D 命中测试按深度排序——容器平面比面板离相机近，
   于是每一次点击都被透明容器吃掉，永远落不到按钮上。
   让射线穿过容器（pointer-events:none），再在面板上把点击接回来。 */


/* 半步之外的卡片整块可点（点了走过去），给手型；铭牌任何时候点都回全景 */
.hp.is-rest, .hp.is-edge, .hp-hub.hp { cursor: pointer; }

/* ── 面板上的可点元素 ── */
.hp button { font: inherit; cursor: pointer; }
.hp-btns { display: flex; gap: 9px; }
.hp-btn {
  flex: 1; text-align: center; border-radius: 999px; padding: 10px 12px;
  font-size: 13px; font-weight: 600; color: #101725; background: var(--gp, #c2a166);
  font-family: inherit; cursor: pointer;
}
.hp-btn.no { flex: 0 0 96px; background: transparent; color: var(--dim, rgba(246,243,236,.78)); border: 1px solid rgba(255, 255, 255, 0.24); }
.hp-btn {
  appearance: none; border: 0;
  transition: transform 0.18s ease, filter 0.18s ease, background 0.25s ease, color 0.25s ease;
}
.hp-btn:hover { filter: brightness(1.08); }
.hp-btn:active { transform: scale(0.97); }
.hp-btn:focus-visible { outline: 2px solid var(--gp); outline-offset: 2px; }
.hp-btn.no:hover { color: var(--ink); border-color: rgba(255, 255, 255, 0.44); filter: none; }
/* 否决理由那两颗：描边款，文字多，别撑破胶囊 */
.hp-btn.ghost {
  flex: 1 1 100%; background: transparent; color: var(--dim);
  border: 1px solid rgba(255, 255, 255, 0.24); font-weight: 400; font-size: 12.5px;
}
.hp-btn.ghost:hover { color: var(--ink); border-color: rgba(194, 161, 102, 0.6); filter: none; }
.hp-btns { flex-wrap: wrap; }
/* 拍板之后按钮区换成的那行交代 */
.hp-after { margin: 0; font-size: 12px; line-height: 1.7; color: var(--dim); }
/* 批完/否完给按钮区一个明确的着色：金 = 已批，灰 = 已否 */
[data-rate-act].is-ok { border-color: rgba(131, 216, 166, 0.38); }
[data-rate-act].is-ok .note::before { background: #83d8a6; box-shadow: 0 0 8px #83d8a6; }
[data-rate-act].is-no { border-color: rgba(255, 255, 255, 0.16); }
[data-rate-act].is-no .note::before { background: rgba(246, 243, 236, 0.4); box-shadow: none; }

/* 「看完整建议」这类文字入口 */
.hp-link {
  appearance: none; border: 0; background: none; padding: 0; margin: 10px 2px 0;
  font-size: 11.5px; color: rgba(194, 161, 102, 0.95); cursor: pointer;
  transition: color 0.2s ease;
}
.hp-link:hover { color: #d9bd85; }
.hp-link:focus-visible { outline: 2px solid var(--gp); outline-offset: 3px; border-radius: 4px; }

/* 今日运营底下那行「昨天 …」现在是个按钮：样子照旧，加个手型和箭头 */
.hp-foot {
  appearance: none; background: none; border: 0; border-top: 1px solid rgba(255, 255, 255, 0.09);
  width: 100%; text-align: left; cursor: pointer; display: block;
}
.hp-foot i { font-style: normal; color: rgba(194, 161, 102, 0.95); margin-left: 8px; white-space: nowrap; }
.hp-foot:hover i { color: #d9bd85; }
.hp-foot:focus-visible { outline: 2px solid var(--gp); outline-offset: 2px; border-radius: 6px; }

/* 派活面板：等你拍板计数 + 卡片右侧的「去办」按钮 */
.hp-sub { margin: 0 0 8px; font-size: 11.5px; color: var(--dim); display: flex; align-items: center; gap: 7px; }
.hp-badge {
  min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px;
  background: #b0662a; color: #f6f3ec; font-size: 11.5px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
}
.hp-badge.zero { background: rgba(255, 255, 255, 0.16); color: var(--dim); }
.hp-ask p { flex: 1; }
.hp-go {
  flex: none; appearance: none; border: 0; cursor: pointer;
  border-radius: 999px; padding: 8px 14px; font-size: 12px; font-weight: 600;
  color: var(--ink); background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.18);
  transition: background 0.2s ease, border-color 0.2s ease;
}
.hp-go:hover { background: rgba(194, 161, 102, 0.24); border-color: rgba(194, 161, 102, 0.5); }
.hp-go:focus-visible { outline: 2px solid var(--gp); outline-offset: 2px; }
.hp-ask li.done { border-color: rgba(131, 216, 166, 0.32); }
.hp-ask li.done .hp-tag { background: #83d8a6; }
.hp-tag.dim { background: rgba(255, 255, 255, 0.16); color: var(--dim); }

/* AI 对话：预置问题 + 真输入条 */
.hp-chat { max-height: 200px; overflow-y: auto; scrollbar-width: thin; }
.hp-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 10px; }
.hp-chips button {
  appearance: none; cursor: pointer; border-radius: 999px; padding: 6px 12px;
  font-size: 11.5px; color: var(--dim);
  background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.14);
  transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
.hp-chips button:hover { color: var(--ink); border-color: rgba(194, 161, 102, 0.5); background: rgba(194, 161, 102, 0.14); }
.hp-input { margin: 0; }
.hp-input input {
  flex: 1; min-width: 0; appearance: none; background: none; border: 0; outline: none;
  font: inherit; font-size: 12px; color: var(--ink);
}
.hp-input input::placeholder { color: var(--faint); }
.hp-input button {
  flex: none; appearance: none; border: 0; padding: 0; cursor: pointer;
  width: 24px; height: 24px; border-radius: 50%; background: var(--gp); position: relative;
  transition: filter 0.18s ease, transform 0.18s ease;
}
.hp-input button:hover { filter: brightness(1.1); }
.hp-input button:active { transform: scale(0.94); }
.hp-input button i { position: absolute; inset: 0; }
.hp-input:focus-within { border-color: rgba(194, 161, 102, 0.55); }

/* 「重置演示」：动过状态才显形，挂在「演示数据」那行小字后面 */
.hos-reset {
  appearance: none; cursor: pointer; margin-left: 10px;
  border-radius: 999px; padding: 3px 10px; font-size: 10.5px;
  color: rgba(246, 243, 236, 0.8); background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.2);
  transition: color 0.2s ease, border-color 0.2s ease;
}
.hos-reset:hover { color: #f6f3ec; border-color: rgba(194, 161, 102, 0.6); }

/* ── toast ── */
.hos-toast {
  position: fixed; left: 50%; bottom: 5.4rem; transform: translate(-50%, 10px);
  z-index: 90; pointer-events: none;
  max-width: min(30rem, 86vw);
  padding: 10px 18px; border-radius: 999px;
  font-family:var(--tevo-cjk); font-size: 12.5px; color: #f6f3ec;
  background: linear-gradient(158deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.03)), rgba(8, 13, 26, 0.88);
  border: 1px solid rgba(194, 161, 102, 0.4);
  box-shadow: 0 18px 50px -20px rgba(0, 0, 0, 0.9);
  opacity: 0; transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.hos-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ── 整页弹层：面前再升起一块更大的玻璃 ── */
/* 色板变量原本定义在 .cam 上，弹层活在 .cam 外面拿不到——这里再发一份，
   面板上那套 .hp-btn/.hp-btns 的样式才能原样在弹层里生效 */
.hs, .hos-toast {
  --ink: #f6f3ec;
  --dim: rgba(246, 243, 236, 0.78);
  --faint: rgba(246, 243, 236, 0.56);
  --gp: #c2a166;
}
.hs-dim {
  position: fixed; inset: 0; z-index: 80;
  /* 只轻轻压一下，客厅和后面那几块玻璃都还看得见 */
  background: rgba(4, 7, 13, 0.16);
  -webkit-backdrop-filter: blur(1.5px); backdrop-filter: blur(1.5px);
  opacity: 0; transition: opacity 0.3s ease;
}
.hs-dim.show { opacity: 1; }
.hs {
  position: fixed; left: 50%; top: 50%; z-index: 81;
  width: min(42rem, 94vw); max-height: min(82vh, 46rem);
  display: flex; flex-direction: column;
  /* 像从桌面上抬起一块玻璃：带一点点仰角从下方升上来，不是凭空弹出 */
  transform: translate(-50%, -50%) translate(var(--fx, 0px), var(--fy, 36px)) scale(var(--fs, 0.965));
  opacity: 0; transition: opacity 0.34s ease, transform 0.72s cubic-bezier(0.16, 1, 0.3, 1);
  border-radius: 22px; overflow: hidden;
  color: var(--ink, #f6f3ec);
  font-family:var(--tevo-cjk);
  /* 和首屏面板同一种磨砂玻璃（spatial.css .glass 的配方），只比它稍微深一点，小字才看得清 */
  background:
    linear-gradient(158deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.03) 42%, rgba(255, 255, 255, 0.06)),
    rgba(8, 13, 26, 0.66);
  -webkit-backdrop-filter: blur(28px) saturate(150%); backdrop-filter: blur(26px) saturate(150%);
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 60px 130px -50px rgba(0, 0, 0, 0.95);
}
.hs.show { opacity: 1; transform: translate(-50%, -50%) translate(0, 0) scale(1); }
/* 关的时候：先透明再缩回起点，别让内容在半路还清清楚楚 */
.hs:not(.show) { transition: opacity 0.26s ease, transform 0.5s cubic-bezier(0.5, 0, 0.2, 1); }
/* ⚠️ 别删：.hs 的 display:flex 会顶掉浏览器给 [hidden] 的 display:none——
   不补这条，三张关着的弹层就是三块看不见的玻璃，悬在屏幕中央吃掉所有点击 */
.hs[hidden] { display: none; }
/* 关闭动画那 300ms 里弹层还在场上，透明但不该再挡点击 */
.hs:not(.show), .hs-dim:not(.show) { pointer-events: none; }
body.hs-open { overflow: hidden; }

.hs-head {
  flex: none; display: flex; align-items: center; gap: 12px;
  padding: 15px 18px 13px; border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.hs-key { font-size: 12px; letter-spacing: 0.14em; color: rgba(194, 161, 102, 0.95); white-space: nowrap; }
.hs-when { margin-left: auto; font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); text-align: right; }
.hs-x {
  flex: none; appearance: none; border: 0; cursor: pointer;
  width: 28px; height: 28px; border-radius: 50%;
  font-size: 17px; line-height: 1; color: var(--dim, rgba(246,243,236,.78));
  background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.16);
  transition: color 0.2s ease, border-color 0.2s ease;
}
.hs-x:hover { color: #f6f3ec; border-color: rgba(194, 161, 102, 0.6); }
.hs-x:focus-visible { outline: 2px solid var(--gp); outline-offset: 2px; }
.hs-body { overflow-y: auto; padding: 16px 18px 18px; scrollbar-width: thin; }

/* 房价弹层 */
.hs-quote { display: flex; align-items: center; gap: 18px; margin-bottom: 14px; flex-wrap: wrap; }
.hs-q-l { display: flex; align-items: baseline; gap: 12px; }
.hs-q-l i { font-style: normal; color: var(--faint, rgba(246,243,236,.56)); font-size: 18px; }
.hs-was { font-size: 20px; color: var(--faint, rgba(246,243,236,.56)); text-decoration: line-through; font-family:"Cinzel",Georgia,var(--tevo-cjk); }
.hs-now { font-size: 54px; font-weight: 600; line-height: 0.9; font-family:"Cinzel",Georgia,var(--tevo-cjk); }
.hs-now sup { font-size: 22px; vertical-align: 0.42em; margin-right: 2px; }
.hs-gauge { margin-left: auto; position: relative; width: 120px; text-align: center; }
.hs-gauge svg { display: block; width: 120px; height: 66px; }
.hs-gauge b { position: absolute; left: 0; right: 0; top: 30px; font-size: 20px; font-family:"Cinzel",Georgia,var(--tevo-cjk); }
.hs-gauge span { display: block; font-size: 10.5px; color: var(--faint, rgba(246,243,236,.56)); margin-top: 2px; }
.hs-do {
  background: rgba(255, 255, 255, 0.075); border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 11px; padding: 10px 12px; font-size: 12.5px; line-height: 1.7; margin: 0 0 10px;
}
.hs-do b { color: var(--gp, #c2a166); font-weight: 600; }
.hs-meta { font-size: 12px; line-height: 1.8; color: var(--dim, rgba(246,243,236,.78)); margin: 0 0 14px; }
.hs-meta b { color: #f6f3ec; }

.hs-block {
  background: rgba(255, 255, 255, 0.045); border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px; padding: 13px 14px; margin-bottom: 12px;
}
.hs-block > p { margin: 0 0 8px; font-size: 12.5px; line-height: 1.85; color: var(--dim, rgba(246,243,236,.78)); }
.hs-block > p:last-child { margin-bottom: 0; }
.hs-b-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.hs-pill {
  font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em;
  color: #101725; background: var(--gp, #c2a166); border-radius: 6px; padding: 3px 8px;
}
.hs-b-r { margin-left: auto; font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); }
.hs-fine { font-size: 11px; line-height: 1.75; color: var(--faint, rgba(246,243,236,.56)); margin: 8px 0 0; }
.hs-note { font-size: 10.5px; color: var(--faint, rgba(246,243,236,.56)); margin: 12px 0 0; text-align: center; }
.hs-warn {
  font-size: 11.5px; line-height: 1.7; color: #e8c98d; margin: 0 0 12px;
  background: rgba(194, 161, 102, 0.1); border: 1px solid rgba(194, 161, 102, 0.3);
  border-radius: 11px; padding: 9px 12px;
}

.hs-act {
  background: rgba(6, 10, 20, 0.42); border: 1px solid rgba(194, 161, 102, 0.26);
  border-radius: 13px; padding: 11px 12px 12px; margin-bottom: 12px;
}
.hs-act .note { font-size: 11.5px; color: var(--dim, rgba(246,243,236,.78)); margin: 0 0 10px; display: flex; align-items: center; gap: 7px; }
.hs-act .note::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--gp, #c2a166); flex: none; }
.hs-act.is-ok { border-color: rgba(131, 216, 166, 0.38); }
.hs-act.is-ok .note::before { background: #83d8a6; box-shadow: 0 0 8px #83d8a6; }
.hs-act.is-no { border-color: rgba(255, 255, 255, 0.16); }
.hs-act .hp-btns { display: flex; gap: 9px; }

/* 抽屉 */
.hs-fold { border-top: 1px solid rgba(255, 255, 255, 0.09); }
.hs-fold:last-of-type { border-bottom: 1px solid rgba(255, 255, 255, 0.09); }
.hs-f-head {
  appearance: none; background: none; border: 0; cursor: pointer;
  display: flex; align-items: center; width: 100%; padding: 13px 2px;
  font: inherit; font-size: 13px; font-weight: 600; color: #f6f3ec; text-align: left;
}
.hs-f-head i { font-style: normal; margin-left: auto; font-size: 11px; font-weight: 400; color: var(--faint, rgba(246,243,236,.56)); }
.hs-f-head:hover i { color: var(--gp, #c2a166); }
.hs-f-head:focus-visible { outline: 2px solid var(--gp); outline-offset: -2px; border-radius: 8px; }
.hs-fold.is-flat .hs-f-head { cursor: default; }
.hs-f-body { padding: 0 2px 13px; }
.hs-f-body p { margin: 0 0 6px; font-size: 12px; line-height: 1.8; color: var(--dim, rgba(246,243,236,.78)); }

/* 拍板台账那几行 */
.hs-log { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hs-log li {
  display: flex; align-items: flex-start; gap: 10px;
  background: rgba(6, 10, 20, 0.34); border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 11px; padding: 10px 12px;
}
.hs-log span { flex: none; font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); padding-top: 2px; font-family:"Cinzel",Georgia,var(--tevo-cjk); }
.hs-log p { flex: 1; margin: 0; font-size: 12.5px; line-height: 1.6; color: var(--dim, rgba(246,243,236,.78)); }
.hs-log p b { color: #f6f3ec; }
.hs-log small { display: block; font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); margin-top: 3px; }
.hs-log em {
  flex: none; font-style: normal; font-size: 10.5px; font-weight: 600;
  color: #83d8a6; border: 1px solid rgba(131, 216, 166, 0.4); border-radius: 6px; padding: 3px 7px;
}
.hs-log em.warn { color: #e8c98d; border-color: rgba(194, 161, 102, 0.45); }
.hs-log li.today { border-color: rgba(194, 161, 102, 0.34); }

/* 排班表：真产品那三张格子表 */
.hs-week { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.hs-w-l b { font-size: 17px; font-weight: 600; margin-right: 10px; }
.hs-w-l span { font-size: 11.5px; color: var(--faint, rgba(246,243,236,.56)); }
.hs-w-tabs { margin-left: auto; display: flex; gap: 4px; padding: 3px; border-radius: 999px; background: rgba(255, 255, 255, 0.07); }
.hs-w-tabs button {
  appearance: none; border: 0; cursor: pointer; border-radius: 999px; padding: 5px 13px;
  font: inherit; font-size: 11.5px; color: var(--dim, rgba(246,243,236,.78)); background: transparent;
  transition: background 0.2s ease, color 0.2s ease;
}
.hs-w-tabs button.on { background: var(--gp, #c2a166); color: #101725; font-weight: 600; }
.hs-dept { margin-bottom: 14px; }
.hs-dept > b { display: block; font-size: 13px; margin-bottom: 7px; }
.hs-row { display: grid; grid-template-columns: 4.6em repeat(7, 1fr); gap: 4px; margin-bottom: 4px; align-items: center; }
.hs-name { font-size: 11.5px; color: var(--dim, rgba(246,243,236,.78)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hs-day { font-size: 10px; line-height: 1.25; text-align: center; color: var(--faint, rgba(246,243,236,.56)); }
.hs-cell {
  appearance: none; cursor: pointer; border-radius: 8px; padding: 7px 0; text-align: center;
  font: inherit; font-size: 12px; color: var(--dim, rgba(246,243,236,.78));
  background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.1);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  display: block; width: 100%;
}
button.hs-cell:hover { border-color: rgba(194, 161, 102, 0.55); color: #f6f3ec; }
.hs-cell.off { background: rgba(194, 161, 102, 0.2); border-color: rgba(194, 161, 102, 0.5); color: #e8c98d; font-weight: 600; }
.hs-cell.lock { cursor: default; opacity: 0.75; }
.hs-cell:focus-visible { outline: 2px solid var(--gp); outline-offset: 1px; }

/* 复盘弹层：KPI、客源结构条、未来在手、月度考核表、给业主的话 */
.hs-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-bottom: 10px; }
.hs-kpi div {
  background: rgba(6, 10, 20, 0.38); border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 13px; padding: 11px 12px;
}
.hs-kpi b { display: block; font-size: 23px; font-weight: 600; line-height: 1.05; font-family:"Cinzel",Georgia,var(--tevo-cjk); }
.hs-kpi span { font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); }
.hs-src-bar { display: flex; height: 8px; border-radius: 4px; overflow: hidden; gap: 2px; margin-bottom: 10px; }
.hs-src-bar i { display: block; width: var(--w); background: var(--gp, #c2a166); }
.hs-src-bar i.b { background: #8fa3c8; }
.hs-src-bar i.c { background: rgba(255, 255, 255, 0.22); }
.hs-src { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.hs-src li { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--dim, rgba(246,243,236,.78)); }
.hs-src i { width: 7px; height: 7px; border-radius: 50%; background: var(--gp, #c2a166); flex: none; }
.hs-src i.b { background: #8fa3c8; }
.hs-src i.c { background: rgba(255, 255, 255, 0.3); }
.hs-src b { margin-left: auto; font-weight: 500; color: #f6f3ec; font-size: 11.5px; }
.hs-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 7px; align-items: end; }
.hs-days div { text-align: center; }
.hs-days b { display: block; font-size: 10.5px; font-weight: 500; color: var(--dim, rgba(246,243,236,.78)); margin-bottom: 4px; }
.hs-days i {
  display: block; height: 52px; border-radius: 7px;
  background:
    linear-gradient(180deg, transparent calc(100% - var(--h)), rgba(194, 161, 102, 0.75) calc(100% - var(--h))),
    rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.hs-days span { display: block; font-size: 10px; color: var(--faint, rgba(246,243,236,.56)); margin-top: 4px; }
.hs-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.hs-table th, .hs-table td { padding: 7px 6px; text-align: right; border-bottom: 1px solid rgba(255, 255, 255, 0.07); }
.hs-table th:first-child, .hs-table td:first-child { text-align: left; }
.hs-table th { font-weight: 400; font-size: 10.5px; color: var(--faint, rgba(246,243,236,.56)); }
.hs-table td { color: var(--dim, rgba(246,243,236,.78)); }
.hs-table td:first-child { color: #f6f3ec; }
.hs-table td.warn { color: #e8c98d; }
.hs-say {
  width: 100%; resize: none; border-radius: 11px; padding: 10px 12px;
  font: inherit; font-size: 12.5px; line-height: 1.7; color: #f6f3ec;
  background: rgba(6, 10, 20, 0.38); border: 1px solid rgba(255, 255, 255, 0.13);
  outline: none; transition: border-color 0.2s ease;
}
.hs-say:focus { border-color: rgba(194, 161, 102, 0.55); }
.hs-say::placeholder { color: var(--faint, rgba(246,243,236,.56)); }
.hs-say-act { display: flex; margin-top: 9px; }
.hs-say-act .hp-btn { flex: none; padding: 8px 16px; font-size: 12px; }

/* ── 手机 / 摊平：弹层改成从底下升起来的整张 ── */
@media (max-width: 640px) {
  .hs {
    left: 0; right: 0; top: auto; bottom: 0; width: auto; max-height: 88vh;
    transform: translateY(24px); border-radius: 20px 20px 0 0;
  }
  .hs.show { transform: translateY(0); }
  .hs-quote { gap: 10px; }
  .hs-now { font-size: 44px; }
  .hs-gauge { margin: 0 auto; }
  .hs-row { grid-template-columns: 4em repeat(7, 1fr); gap: 3px; }
  .hs-cell { padding: 6px 0; font-size: 11px; }
  /* iOS：输入框字号 <16px 会触发整页放大 */
  .hp-input input, .hs-say { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .hs, .hs-dim, .hos-toast { transition-duration: 0.01ms; }
}

/* 补两条：表头那行姓名/星期 + 「待回」那张卡不带金边（拍板的才带） */
.hs-days-row .hs-name { font-size: 10px; color: var(--faint, rgba(246,243,236,.56)); }
.hp-ask li:not(.act) { border-color: rgba(255, 255, 255, 0.12); background: rgba(6, 10, 20, 0.3); }

/* ═══════ 字要读得动（2026-08-20 夜，Jack：「里面字不够突出，让用户看清楚才行」）═══════
   三管齐下，全部只覆盖、不动上面的原始定义（回滚就是删掉这一整段）：
   ① 相机走近那一步真走近了（js/hos.js 的 WZ/LAND），面板整体放大约 15%；
   ② 面板文字的两档辅助色各提一档亮度——原 0.78/0.56 在深底玻璃上是"雅"，
      隔着一层透视缩放就是"糊"；
   ③ 逐个抬字号：10.5/11px 那批是在设计稿 1:1 下定的，经过透视缩放后
      实际只剩八九像素，这里统一抬到 12px 上下的地板。 */
.hos-pin .cam {
  --dim: rgba(246, 243, 236, 0.88);
  --faint: rgba(246, 243, 236, 0.7);
}
/* 静息的板也别暗过头：0.62 → 0.72，"没轮到你读"和"读不见"是两回事 */
.hp.is-rest { opacity: 0.72; }
/* 相机走近一块板时，比它更浅的板会被放得巨大糊在眼角（.is-near 由 js 打）：
   压到近乎不可见，并让点击穿透——那个位置上它就是一团玻璃雾，不该接事件 */
.hp.is-near { opacity: 0.08; pointer-events: none; -webkit-backdrop-filter: none; backdrop-filter: none; }

.hp-key { font-size: 12px; }
.hp-when { font-size: 12px; }
.hp-prog span { font-size: 14px; }
.hp-tiles b { font-size: 23px; }
.hp-tiles span { font-size: 12.5px; }
.hp-tag { font-size: 11.5px; }
.hp-ask p { font-size: 15px; }
.hp-ask small { font-size: 12.5px; }
.hp-was { font-size: 20px; }
.hp-now { font-size: 54px; }
.hp-conf { font-size: 12.5px; }
.hp-conf b { font-size: 17px; }
.hp-do { font-size: 13.5px; }
.hp-why { font-size: 13.5px; }
.hp-act .note { font-size: 12.5px; }
.hp-btn { font-size: 14px; }
.hp-chat p { font-size: 14px; }
.hp-input { font-size: 13px; }
.hp-note { font-size: 11.5px; }
.hp-foot { font-size: 12.5px; }
.hp-kpi b { font-size: 26px; }
.hp-kpi span { font-size: 12.5px; }
.hp-run { font-size: 12.5px; }
.hp-hub .hh-en { font-size: 12.5px; }
.hp-hub .hh-cn { font-size: 32px; }
.hp-hub .hh-meta { font-size: 12px; }
/* 交互层（按钮/角标/输入框）同一批地板抬高 */
.hp-btn.ghost { font-size: 13.5px; }
.hp-after { font-size: 13px; }
.hp-link { font-size: 12.5px; }
.hp-sub { font-size: 12.5px; }
.hp-badge { font-size: 12px; }
.hp-go { font-size: 13px; }
.hp-chips button { font-size: 12.5px; }
.hp-input input { font-size: 13px; }

/* ═══════ 卡片拿近 + 回门（2026-08-20 第三版）═══════
   第一版相机飞过去：矮屏上五块玻璃挤满画面，一飞全是互相穿过的乱影子（Jack：「飞来飞去」）；
   第二版黑幕眨眼：每点一下黑一次（Jack：「按一下他黑屏一次这个就问题很大了」）。
   现在相机进场后钉死不动，点哪块卡片哪块自己滑到正中放大（js/hos.js 的 liftTarget），
   其余原地退暗；屏幕永远不黑。回去靠按钮（.hos-back，举起任何一块时出现在底部正中）。 */
.hos-back {
  position: absolute; left: 50%; transform: translateX(-50%); bottom: 1.7rem; z-index: 6;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 22px; border-radius: 999px; cursor: pointer;
  font-size: 13.5px; letter-spacing: 0.04em; color: #f6f3ec;
  background: rgba(10, 16, 30, 0.55); border: 1px solid rgba(255, 255, 255, 0.28);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 8px 30px rgba(3, 6, 12, 0.45);
  transition: border-color 0.25s ease, background 0.25s ease;
}
.hos-back:hover { border-color: rgba(194, 161, 102, 0.85); background: rgba(14, 22, 40, 0.72); }
.hos-back:focus-visible { outline: 2px solid #c2a166; outline-offset: 3px; }
/* 上面的 display:flex 会压过 hidden 属性的默认隐藏——这条把权还给 hidden，全景时按钮必须真的消失 */
.hos-back[hidden] { display: none; }

/* 走近一块板时，其余的板退得更深：矮屏上它们几乎叠在当前这块上，
   0.72 的静息亮度会分不清"手边这块"是哪块。全景时仍是 0.72。 */
.hos-pin.is-deep .hp.is-rest { opacity: 0.3; }

/* 摊平模式没有相机，这两样都不存在 */
@media (max-width: 1080px), (max-height: 620px), (prefers-reduced-motion: reduce) {
  .hos-back { display: none !important; }
}
/* 贴脸板的隐身要压过上面那条退深（同为四个 class，靠书写顺序取胜）：糊在眼角的板永远近乎不可见 */
.hos-pin.is-deep .hp.is-near { opacity: 0.08; }

/* ═══════ 补厚（2026-08-22，Jack：「页面还是有点单薄了，你去一个一个按钮看 hos 是干啥的」）═══════
   真产品 12 个模块，屋子里原来只演了 3 个半。这一段是补上去的部件：
   面板上的「系统正在替你干活」和「军师」；房价弹层的竞集 / 漏斗 / 热度 / 流失 / 铺排；
   派活弹层的三个页签（点将 / 排班 / 验收）；新的业主报告弹层。
   全部只加类、不改上面任何一条（回滚 = 删掉这一整段 + 还原 hos.html / js/hos-demo.js）。 */

/* ── 面板：今日运营的三条动态 ── */
.hp-sub-r { margin-left: auto; font-size: 11.5px; color: var(--faint); font-weight: 400; }
.hp-feed { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 5px; }
.hp-feed li { display: flex; align-items: flex-start; gap: 9px; font-size: 12px; line-height: 1.5; }
.hp-feed span { flex: none; font-family:"Cinzel",Georgia,var(--tevo-cjk); font-size: 11px; color: var(--faint); padding-top: 2px; }
.hp-feed p { margin: 0; color: var(--dim); }
.hp-feed p b { color: var(--ink); font-weight: 600; }
.hp-feed li:first-child p { color: var(--ink); }
.hp-feed li:first-child span { color: var(--gp); }

/* ── 面板：军师一句话 ── */
.hp-brief, .hs-brief {
  display: flex; gap: 9px; align-items: flex-start; margin: 0 0 12px;
  font-size: 12.5px; line-height: 1.65; color: var(--dim);
  background: rgba(194, 161, 102, 0.09); border: 1px solid rgba(194, 161, 102, 0.24);
  border-radius: 10px; padding: 8px 11px;
}
.hp-brief > b, .hs-brief > b {
  flex: none; font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em;
  color: #101725; background: var(--gp); border-radius: 5px; padding: 2px 6px; margin-top: 2px;
}
.hs-brief { font-size: 12.5px; margin-bottom: 14px; }
.hs-brief b[data-moved] { color: #f6f3ec; }

/* ── 弹层：三个页签 ── */
.hs-tabs {
  flex: none; display: flex; gap: 4px; padding: 9px 18px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.hs-tabs button {
  appearance: none; background: none; border: 0; cursor: pointer;
  padding: 8px 14px 10px; margin-bottom: -1px;
  font: inherit; font-size: 13px; color: var(--dim, rgba(246,243,236,.78));
  border-bottom: 2px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.hs-tabs button:hover { color: #f6f3ec; }
.hs-tabs button.on { color: #f6f3ec; font-weight: 600; border-bottom-color: var(--gp, #c2a166); }
.hs-tabs button:focus-visible { outline: 2px solid var(--gp); outline-offset: -2px; border-radius: 6px; }
.hs-pill.ok { background: #83d8a6; }

/* ── 房价弹层：竞集 ── */
.hs-comp { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.hs-comp li {
  display: grid; grid-template-columns: 6.6em 1fr 4em 3.4em; align-items: center; gap: 10px;
  font-size: 12.5px; color: var(--dim, rgba(246,243,236,.78));
  padding: 6px 10px; border-radius: 9px; background: rgba(255, 255, 255, 0.04);
}
.hs-comp li.me { background: rgba(194, 161, 102, 0.12); border: 1px solid rgba(194, 161, 102, 0.3); }
.hs-comp li.me .hs-c-n, .hs-comp li.me b { color: #f6f3ec; }
.hs-comp b { text-align: right; font-weight: 600; color: #f6f3ec; font-family:"Cinzel",Georgia,var(--tevo-cjk); font-size: 13px; }
.hs-comp em { font-style: normal; font-size: 11px; text-align: right; color: var(--faint, rgba(246,243,236,.56)); }
.hs-comp em.up { color: #e8c98d; }
.hs-comp em.dn { color: #8fa3c8; }
.hs-spark { width: 100%; height: 20px; display: block; }
.hs-spark polyline { fill: none; stroke: rgba(246, 243, 236, 0.5); stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.hs-comp li.me .hs-spark polyline { stroke: var(--gp, #c2a166); }

/* ── 房价弹层：漏斗 / 三格 / 热度 ── */
.hs-funnel { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.hs-funnel li { display: grid; grid-template-columns: 6.4em 1fr 3em 6.2em; align-items: center; gap: 10px; font-size: 12px; color: var(--dim, rgba(246,243,236,.78)); }
.hs-funnel div { display: grid; gap: 3px; }
.hs-funnel i { display: block; height: 6px; width: var(--w); border-radius: 3px; background: var(--gp, #c2a166); }
.hs-funnel i.avg { background: rgba(255, 255, 255, 0.22); }
.hs-funnel b { text-align: right; font-family:"Cinzel",Georgia,var(--tevo-cjk); color: #f6f3ec; font-size: 13px; }
.hs-funnel small { font-size: 10.5px; color: var(--faint, rgba(246,243,236,.56)); }
.hs-funnel li.low small { color: #e8c98d; }
.hs-mini { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0 0 14px; }
.hs-mini div { background: rgba(6, 10, 20, 0.34); border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 11px; padding: 9px 10px; }
.hs-mini b { display: block; font-size: 19px; font-family:"Cinzel",Georgia,var(--tevo-cjk); font-weight: 600; line-height: 1.1; }
.hs-mini span { font-size: 10.5px; color: var(--faint, rgba(246,243,236,.56)); }
.hs-trend svg { display: block; width: 100%; height: 44px; }
.hs-trend.tall svg { height: 64px; }
.hs-trend polyline { fill: none; stroke: var(--gp, #c2a166); stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.hs-trend polyline.avg { stroke: rgba(246, 243, 236, 0.35); stroke-dasharray: 3 3; }
.hs-trend p { margin: 6px 0 0; font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); display: flex; gap: 14px; }
.hs-trend i { display: inline-block; width: 14px; height: 2px; background: var(--gp, #c2a166); vertical-align: middle; margin-right: 5px; }
.hs-trend i.avg { background: rgba(246, 243, 236, 0.4); }

/* ── 房价弹层：流失去向 ── */
.hs-leak { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.hs-leak li { display: flex; align-items: center; gap: 10px; font-size: 12.5px; padding: 7px 10px; border-radius: 9px; background: rgba(255, 255, 255, 0.04); }
.hs-leak b { color: #f6f3ec; font-weight: 500; }
.hs-leak span { color: var(--faint, rgba(246,243,236,.56)); font-size: 11.5px; }
.hs-leak em { margin-left: auto; font-style: normal; font-size: 11.5px; color: #e8c98d; }

/* ── 房价弹层：未来 30 天铺排 ── */
.hs-plan { list-style: none; margin: 0 0 4px; padding: 0; display: grid; gap: 5px; }
.hs-plan li {
  display: grid; grid-template-columns: 5.2em 1fr auto; align-items: center; gap: 10px;
  padding: 6px 10px; border-radius: 9px; background: rgba(255, 255, 255, 0.04);
  font-size: 12.5px; color: var(--dim, rgba(246,243,236,.78));
}
.hs-plan li.wk { background: rgba(194, 161, 102, 0.09); }
.hs-plan li.ed { border: 1px solid rgba(194, 161, 102, 0.4); }
.hs-p-d { color: #f6f3ec; font-family:"Cinzel",Georgia,var(--tevo-cjk); font-size: 12px; }
.hs-p-d small { display: block; font-family:var(--tevo-cjk); font-size: 10.5px; color: var(--faint, rgba(246,243,236,.56)); }
.hs-p-tag { font-size: 11.5px; }
.hs-p-tag em { font-style: normal; color: #e8c98d; }
.hs-p-ctl { display: inline-flex; align-items: center; gap: 6px; }
.hs-p-ctl b { min-width: 3.6em; text-align: center; font-family:"Cinzel",Georgia,var(--tevo-cjk); font-size: 13.5px; color: #f6f3ec; }
.hs-p-ctl button {
  appearance: none; cursor: pointer; width: 22px; height: 22px; border-radius: 50%; padding: 0;
  font: inherit; font-size: 14px; line-height: 1; color: var(--dim, rgba(246,243,236,.78));
  background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.18);
  transition: border-color 0.2s ease, color 0.2s ease;
}
.hs-p-ctl button:hover { color: #f6f3ec; border-color: rgba(194, 161, 102, 0.6); }
.hs-p-ctl button:focus-visible { outline: 2px solid var(--gp); outline-offset: 1px; }

/* ── 派活弹层：点将台 ── */
.hs-crew { display: grid; gap: 10px; margin-bottom: 12px; }
.hs-person { background: rgba(6, 10, 20, 0.34); border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 13px; padding: 11px 12px; }
.hs-p-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.hs-ring {
  flex: none; width: 40px; height: 40px; border-radius: 50%; position: relative;
  background: conic-gradient(var(--gp, #c2a166) calc(var(--v, 50) * 1%), rgba(255, 255, 255, 0.12) 0);
}
.hs-ring::before { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: rgb(12, 18, 32); }
.hs-ring b { position: absolute; inset: 0; display: grid; place-items: center; font-family:"Cinzel",Georgia,var(--tevo-cjk); font-size: 13px; color: #f6f3ec; }
.hs-p-name b { display: block; font-size: 13.5px; color: #f6f3ec; }
.hs-p-name span { font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); }
.hs-p-tags { margin-left: auto; display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.hs-p-tags i { font-style: normal; font-size: 10.5px; color: var(--dim, rgba(246,243,236,.78)); border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 5px; padding: 2px 6px; }
.hs-load { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); margin-bottom: 9px; }
.hs-load i { flex: 1; height: 4px; border-radius: 2px; background: rgba(255, 255, 255, 0.12); position: relative; overflow: hidden; }
.hs-load i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--w, 40%); background: var(--gp, #c2a166); border-radius: 2px; }
.hs-load b { font-weight: 500; color: var(--dim, rgba(246,243,236,.78)); }
.hs-tasks { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.hs-tasks li {
  display: flex; align-items: flex-start; gap: 9px;
  padding: 7px 9px; border-radius: 9px; background: rgba(255, 255, 255, 0.045);
  border: 1px solid transparent; transition: border-color 0.25s ease, background 0.25s ease;
}
.hs-tasks li.moved { border-color: rgba(194, 161, 102, 0.4); background: rgba(194, 161, 102, 0.08); }
.hs-tasks li > span { flex: none; font-family:"Cinzel",Georgia,var(--tevo-cjk); font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); padding-top: 2px; }
.hs-tasks p { flex: 1; margin: 0; font-size: 12.5px; color: #f6f3ec; line-height: 1.4; }
.hs-tasks small { display: block; font-size: 10.5px; color: var(--faint, rgba(246,243,236,.56)); margin-top: 2px; }
.hs-tasks li.moved small { color: #e8c98d; }
.hs-tasks p { position: relative; padding-right: 20px; }
.hs-tasks li.photo p::after { content: "📷"; position: absolute; right: 0; top: 1px; font-size: 11px; opacity: 0.8; }
.hs-lift {
  flex: none; appearance: none; cursor: pointer; width: 24px; height: 24px; border-radius: 50%; padding: 0;
  font-size: 13px; line-height: 1; color: var(--dim, rgba(246,243,236,.78));
  background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.16);
  transition: border-color 0.2s ease, color 0.2s ease;
}
.hs-lift:hover { color: #f6f3ec; border-color: rgba(194, 161, 102, 0.6); }
.hs-lift:focus-visible { outline: 2px solid var(--gp); outline-offset: 1px; }

/* ── 派活弹层：申诉台 ── */
.hs-case { background: rgba(6, 10, 20, 0.34); border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 13px; padding: 11px 12px; margin-bottom: 10px; transition: border-color 0.25s ease; }
.hs-c-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.hs-c-head b { font-size: 13.5px; color: #f6f3ec; }
.hs-c-head span { font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); }
.hs-c-head em { margin-left: auto; font-style: normal; font-size: 10.5px; font-weight: 600; color: #e8c98d; border: 1px solid rgba(194, 161, 102, 0.45); border-radius: 6px; padding: 3px 7px; }
.hs-case.is-pass { border-color: rgba(131, 216, 166, 0.38); }
.hs-case.is-pass .hs-c-head em { color: #83d8a6; border-color: rgba(131, 216, 166, 0.4); }
.hs-case.is-redo { border-color: rgba(255, 255, 255, 0.16); opacity: 0.8; }
.hs-case.is-redo .hs-c-head em { color: var(--dim, rgba(246,243,236,.78)); border-color: rgba(255, 255, 255, 0.2); }
.hs-said, .hs-ai { margin: 0 0 8px; font-size: 12.5px; line-height: 1.7; color: var(--dim, rgba(246,243,236,.78)); }
.hs-said span, .hs-ai span {
  display: inline-block; font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; margin-right: 7px;
  border-radius: 5px; padding: 2px 6px; vertical-align: 1px;
  color: var(--dim, rgba(246,243,236,.78)); border: 1px solid rgba(255, 255, 255, 0.18);
}
.hs-ai span { color: #101725; background: #e8c98d; border-color: #e8c98d; }
.hs-check { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 5px; }
.hs-check label { display: flex; align-items: center; gap: 9px; font-size: 12.5px; color: var(--dim, rgba(246,243,236,.78)); cursor: pointer; padding: 6px 9px; border-radius: 8px; background: rgba(255, 255, 255, 0.04); }
.hs-check label:hover { color: #f6f3ec; }
.hs-check input { appearance: none; width: 16px; height: 16px; border-radius: 4px; border: 1px solid rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.05); margin: 0; flex: none; cursor: pointer; position: relative; }
.hs-check input:checked { background: var(--gp, #c2a166); border-color: var(--gp, #c2a166); }
.hs-check input:checked::after { content: ""; position: absolute; left: 5px; top: 2px; width: 4px; height: 8px; border: solid #101725; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.hs-check input:focus-visible { outline: 2px solid var(--gp); outline-offset: 1px; }
.hs-case-act .hp-btn[disabled] { opacity: 0.45; cursor: default; filter: none; transform: none; }

/* ── 业主报告 ── */
.hs-headline { margin: 0 0 14px; font-size: 15.5px; line-height: 1.75; color: #f6f3ec; }
.hs-owner-a { margin: 10px 0 0; font-size: 12.5px; line-height: 1.75; color: var(--dim, rgba(246,243,236,.78)); border-top: 1px solid rgba(255, 255, 255, 0.09); padding-top: 9px; }
.hs-owner-a span { display: block; font-size: 11px; color: var(--faint, rgba(246,243,236,.56)); margin-bottom: 3px; }
[data-owner-say].has { color: #f6f3ec; font-size: 13px; }

/* 手机上那几张表格的列别挤破 */
@media (max-width: 640px) {
  .hs-comp li { grid-template-columns: 5.4em 1fr 3.6em 3.2em; gap: 6px; font-size: 12px; }
  .hs-funnel li { grid-template-columns: 5.6em 1fr 2.6em 5.4em; gap: 6px; }
  .hs-plan li { grid-template-columns: 4.6em 1fr auto; gap: 6px; }
  .hs-tabs { padding: 6px 10px 0; }
  .hs-tabs button { padding: 8px 10px 9px; }
  .hs-p-tags { display: none; }
}

/* 弹层头是个 <header>，会吃到 pages.css 里给站点顶栏写的 position:fixed（.hs 有 transform，
   于是它钉在弹层顶上、不占位）。以前三张弹层没页签，被它压住的是 hs-body 最上面那 57px，
   刚好是 hs-quote 的留白，没露馅；加了页签就叠在一起了。这里把它放回文档流。 */
.hs > .hs-head {
  position: static; z-index: auto; background: none; box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none; transition: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* ── 工作台块（从 css/hos-vr.css 搬来，一行没改）── */
.hv-w-head {
  flex: none; display: flex; align-items: baseline; gap: 12px;
  padding: 15px 20px 13px; border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.hv-w-k { font-family:var(--tevo-cjk); font-size: 13.5px; font-weight: 600; color: var(--ink); }
.hv-w-when { font-size: 10.5px; color: var(--faint); }
.hv-w-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px 20px 20px; }
.hv-w-note { margin: 16px 0 0; font-size: 10px; color: var(--faint); }
.hv-fine { margin: 8px 0 0; font-size: 10.5px; line-height: 1.8; color: var(--faint); }
.hv-w-block { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, 0.07); }
.hv-w-bh { display: flex; align-items: center; gap: 10px; margin-bottom: 11px; }
.hv-w-br { font-size: 10.5px; color: var(--faint); }
.hv-pill {
  font-size: 10px; letter-spacing: 0.1em; padding: 3px 9px; border-radius: 999px;
  color: var(--brass); border: 1px solid var(--edge-brass); background: rgba(194, 161, 102, 0.07);
}

/* 今日进度 + 四个数 */
.hv-today-top { display: grid; grid-template-columns: 1.15fr 1fr; gap: 16px 18px; align-items: start; }
.hv-prog-n { margin: 0 0 8px; display: flex; align-items: baseline; gap: 7px; }
.hv-prog-n b { font-family:"Cinzel",Georgia,var(--tevo-cjk); font-size: 30px; font-weight: 500; line-height: 1; color: var(--ink); }
.hv-prog-n span { font-size: 11px; color: var(--faint); }
.hv-prog-bar { height: 3px; border-radius: 3px; background: rgba(255, 255, 255, 0.11); overflow: hidden; }
.hv-prog-bar i { display: block; height: 100%; width: var(--w); border-radius: 3px; background: linear-gradient(90deg, #c2a166, #e8c98d); }
.hv-four { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.hv-four li { text-align: center; padding: 8px 2px 7px; border-radius: 9px; border: 1px solid rgba(255, 255, 255, 0.09); background: rgba(255, 255, 255, 0.028); }
.hv-four b { display: block; font-size: 17px; font-weight: 600; color: var(--ink); line-height: 1.1; }
.hv-four span { display: block; margin-top: 2px; font-size: 9.5px; color: var(--faint); }

/* 动态横轴 */
.hv-live { list-style: none; margin: 0; padding: 0; }
.hv-live li { display: flex; align-items: center; gap: 10px; padding: 5px 0; }
.hv-live li > span { flex: 0 0 4.6em; font-size: 11px; color: var(--dim); }
.hv-live li > div { position: relative; flex: 1; height: 16px; border-radius: 8px; background: rgba(255, 255, 255, 0.055); }
.hv-live li > div::after {
  content: ""; position: absolute; left: var(--now, 47%); top: -3px; bottom: -3px; width: 1px;
  background: rgba(224, 96, 84, 0.85);
}
.hv-live i { position: absolute; left: var(--x); top: 50%; width: 7px; height: 7px; margin: -3.5px 0 0 -3.5px; border-radius: 50%; }
.hv-live i.todo, .hv-legend i.todo { background: rgba(246, 243, 236, 0.42); }
.hv-live i.ok,   .hv-legend i.ok   { background: #83d8a6; }
.hv-live i.wait, .hv-legend i.wait { background: #c2a166; }
.hv-live i.late, .hv-legend i.late { background: #e06054; }
.hv-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 14px; margin: 9px 0 0; font-size: 10px; color: var(--faint); }
.hv-legend i { width: 7px; height: 7px; border-radius: 50%; display: inline-block; margin-right: 4px; }

/* 系统动态流水 */
.hv-feed { list-style: none; margin: 0; padding: 0; }
.hv-feed li { display: flex; gap: 11px; padding: 8px 0; border-top: 1px solid rgba(255, 255, 255, 0.06); }
.hv-feed li:first-child { border-top: 0; padding-top: 0; }
.hv-feed span { flex: 0 0 3.4em; font-size: 10.5px; color: var(--faint); padding-top: 1px; }
.hv-feed p { margin: 0; font-size: 12px; line-height: 1.5; color: var(--dim); }
.hv-feed b { color: var(--brass); }
.hv-feed small { display: block; margin-top: 2px; font-size: 10.5px; color: var(--faint); }

/* ── 待你拍板：搬进客厅工作面，桌面上常开 ── */
.hv-decide { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, 0.07); }
.hv-decbtn {
  appearance: none; border: 0; background: transparent; cursor: pointer; font-family: inherit;
  display: flex; align-items: center; gap: 8px; padding: 0 0 11px; margin: 0;
  font-size: 12px; font-weight: 600; color: var(--ink);
}
.hv-decbtn i {
  width: 7px; height: 7px; border-radius: 50%; background: var(--gp);
  box-shadow: 0 0 0 0 rgba(194, 161, 102, 0.6); animation: hvPing 2.6s ease-out infinite;
}
@keyframes hvPing { 0% { box-shadow: 0 0 0 0 rgba(194, 161, 102, 0.55); } 70%, 100% { box-shadow: 0 0 0 9px rgba(194, 161, 102, 0); } }
.hv-decbtn:focus-visible { outline: 2px solid var(--gp); outline-offset: 3px; }
.hv-decbtn .hp-badge { color: #101725; background: var(--brass); border-radius: 999px; padding: 1px 7px; font-size: 11px; }
.hv-chips { list-style: none; margin: 0; padding: 0; }
.hv-chips li { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border-radius: 11px;
  border: 1px solid rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.032); }
.hv-chips li + li { margin-top: 7px; }
.hv-chips li.done { border-color: rgba(131, 216, 166, 0.32); }
.hv-chips li.done .hp-tag { background: #83d8a6; }
.hv-chips p { flex: 1; min-width: 0; margin: 0; font-size: 12.5px; font-weight: 600; line-height: 1.35; }
.hv-chips small { display: block; margin-top: 1px; font-size: 10.5px; font-weight: 400; color: var(--faint); }
.hv-chips .hp-go { flex: none; }
.hv-verifyline { margin: 10px 0 0; font-size: 11px; color: var(--faint); display: flex; align-items: center; gap: 8px; }
.hv-verifyline b { color: var(--brass); }


/* ── 弹层配色变量在 .hs 上已发过；工作台块住在 .hero-cam 里，用 spatial.css 的同名变量。--brass 补一份 ── */
.hs, .hero-cam { --brass: #e8c98d; }
/* ── 收益台：桌面上横向展开成宽工作面，左结论动作 / 右依据（照 css/hos-twin.css）── */
@media (min-width: 1024px) {
  #hsRate { width: min(76rem, 92vw); max-height: 87vh; }
  #hsRate .hs-body { display: grid; grid-template-columns: 1.12fr 1fr; gap: 0 30px; align-items: start; }
  #hsRate .hs-col-a, #hsRate .hs-col-b { min-width: 0; }
  #hsRate .hs-col-c, #hsRate .hs-note { grid-column: 1 / -1; }
}
.hs-views { display: flex; gap: 6px; margin-left: 10px; }
.hs-views button { appearance: none; cursor: pointer; border-radius: 999px; padding: 4px 12px; font-family: inherit;
  font-size: 11px; color: var(--dim); background: transparent; border: 1px solid rgba(255, 255, 255, 0.2); }
.hs-views button.on { color: #101725; background: var(--gp); border-color: var(--gp); font-weight: 600; }
.hs-views button:focus-visible { outline: 2px solid var(--gp); outline-offset: 2px; }
#hsRate.view-plan .hs-col-a, #hsRate.view-plan .hs-col-b { display: none; }
/* ── 设置 / 装配 / 开店向导 ── */
.hs-kv { list-style: none; margin: 10px 0 0; padding: 0; }
.hs-kv li { display: flex; justify-content: space-between; gap: 14px; padding: 7px 0; border-top: 1px solid rgba(255,255,255,0.07); font-size: 12px; }
.hs-kv li:first-child { border-top: 0; }
.hs-kv span { color: var(--faint); flex: none; }
.hs-kv b { font-weight: 500; color: var(--ink); text-align: right; }
.hs-steps { list-style: none; margin: 4px 0 8px; padding: 0; display: flex; gap: 6px; counter-reset: st; }
.hs-steps li { flex: 1; text-align: center; padding: 7px 4px; border-radius: 8px; font-size: 11.5px; color: var(--faint); border: 1px solid rgba(255,255,255,0.1); }
.hs-steps li.done { color: var(--ink); border-color: rgba(131,216,166,0.4); }
.hs-steps li.now { color: #101725; background: var(--gp); border-color: var(--gp); font-weight: 600; }
.hs-gate { margin: 18px 0 0; padding: 12px 14px; border-radius: 10px; background: rgba(194,161,102,0.1); border: 1px solid rgba(194,161,102,0.28); font-size: 12px; line-height: 1.8; color: var(--dim); }
/* ── AI 随时问：小一块，靠右下 ── */
.hs-ask { width: min(26rem, 92vw); }
@media (min-width: 1024px) { .hs-ask { left: auto; right: 3vw; top: auto; bottom: 4vh; transform: translateY(20px) scale(0.98); } .hs-ask.show { transform: none; } }
/* 首屏角落那行「演示数据」 */
.st-demo { position: absolute; z-index: 4; left: clamp(20px, 4vw, 60px); bottom: 1rem; margin: 0; font-size: 10.5px; color: rgba(246,243,236,0.5); display: flex; gap: 10px; align-items: center; }