/* ============================================================
 * 0. v2 自建令牌
 * 只新增，不改 styles.css。琥珀色用于「补录/在等」这类非错误提醒，
 * 与 --warning(#ff3b30 红) 严格区分：红是审判，琥珀是提醒。
 * ============================================================ */
:root {
  --wb-amber: #b45309;
  --wb-amber-dim: rgba(180, 83, 9, 0.10);
  --wb-amber-line: rgba(180, 83, 9, 0.24);
}
[data-theme="dark"] {
  --wb-amber: #e8a33d;
  --wb-amber-dim: rgba(232, 163, 61, 0.16);
  --wb-amber-line: rgba(232, 163, 61, 0.28);
}

/* ============================================================
 * 指挥中心 v2 · 增量样式层（20261021k）
 * ------------------------------------------------------------
 * 加载顺序在 styles.css 之后，只做「覆盖与追加」，不改原文件内部逻辑。
 * 内容分区：
 *   1. 滚动骨架（body 滚动 → 容器滚动）
 *   2. 三档导航（≥981 侧栏 / 641-980 rail / ≤640 底部 tab）
 *   3. 旋转与安全区
 *   4. 高度档（低高度压缩密度）
 *   5. 焦点可见性
 *   6. 撤销 Toast
 *   7. 全局捕捉浮层
 * ============================================================ */

/* ============================================================
 * 1. 滚动骨架
 * ------------------------------------------------------------
 * 旧结构：body 滚动 + sidebar fixed + main min-height:100vh
 *   → iOS 旋转后 scrollTop 按旧高度换算会跳走；fixed 元素滚动时漂移；
 *     键盘弹出顶起底部 bar；min-height:100vh 比可视区高，底部多一截空白。
 * 新结构：app-view 定高 + 中间滚动容器，topbar 用 flex 子项天然固定。
 * ============================================================ */
html, body { height: 100%; overflow: hidden; }

.app-view {
  height: 100dvh;
  height: 100vh;        /* 旧浏览器兜底，dvh 优先 */
  height: 100dvh;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.sidebar {
  position: relative;
  top: auto; bottom: auto; left: auto;
  height: 100%;
  flex: 0 0 var(--sidebar-w);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.main {
  margin-left: 0;
  height: 100%;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
}

.topbar {
  position: relative;
  top: auto;
  flex: 0 0 auto;
  min-height: var(--topbar-h);
  height: var(--topbar-h);
}

/* 新滚动容器：包住 .content，让滚动条贴在窗口最右而不是内容中线 */
.main-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
  scrollbar-gutter: stable;
}

.content {
  padding-bottom: var(--space-10);
}

/* ============================================================
 * 2. 三档导航
 * ============================================================ */

/* ---- 2.1 平板竖屏：窄侧栏轨道 68px（641–980） ---- */
body[data-nav="rail"] .sidebar {
  flex: 0 0 68px;
  width: 68px;
  transform: none;          /* 覆盖 styles.css 768px 断点的抽屉位移 */
  box-shadow: none;
  padding: var(--space-4) 8px;
  gap: var(--space-4);
  align-items: center;
  overflow: visible;
}
/* 导航文字是裸文本节点，用 font-size:0 收掉，图标内 svg 有固定尺寸不受影响 */
body[data-nav="rail"] .nav-item {
  font-size: 0;
  gap: 0;
  justify-content: center;
  padding: 0;
  height: 44px;
  width: 44px;
  border-radius: 10px;
}
body[data-nav="rail"] .nav-item.active::before {
  left: -12px;
  width: 2px;
  height: 20px;
}
body[data-nav="rail"] .nav-item .nav-icon { width: 20px; height: 20px; }
body[data-nav="rail"] .nav-item .nav-icon svg { width: 20px; height: 20px; }
body[data-nav="rail"] .nav-item .nav-icon svg { stroke-width: 1.6; }

body[data-nav="rail"] .sidebar-head { padding: 0; justify-content: center; }
body[data-nav="rail"] .sidebar-head > div:last-child { display: none; }
body[data-nav="rail"] .sidebar-logo { width: 34px; height: 34px; }

body[data-nav="rail"] .nav-label { display: none; }
body[data-nav="rail"] .sidebar-nav { align-items: center; gap: 2px; overflow: visible; }

body[data-nav="rail"] .sidebar-foot {
  padding: 0;
  background: transparent;
  border: none;
  align-items: center;
  gap: 6px;
}
body[data-nav="rail"] .mini-level { font-size: 10px; }
body[data-nav="rail"] .mini-level::before { display: none; }
body[data-nav="rail"] .btn-logout { font-size: 10px; text-align: center; }

/* rail 下 hover 才显示文字提示 */
body[data-nav="rail"] .nav-item::after {
  content: attr(data-label);
  position: absolute;
  left: 52px;
  top: 50%;
  transform: translateY(-50%) scale(0.96);
  padding: 4px 9px;
  border-radius: 6px;
  background: var(--bg-1);
  border: 1px solid var(--border-default);
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.10);
  transition: opacity 0.14s, transform 0.14s;
  z-index: 60;
}
body[data-nav="rail"] .nav-item:hover::after {
  opacity: 1;
  transform: translateY(-50%) scale(1);
}

/* ---- 2.2 手机：底部 tab bar（≤640） ---- */
.tabbar { display: none; }

body[data-nav="tab"] .app-view { flex-direction: column; }
body[data-nav="tab"] .sidebar {
  position: fixed;
  top: 0; bottom: 0; left: 0;
  width: 260px;
  height: 100dvh;
  height: 100vh;
  z-index: 90;
  transform: translateX(-100%);
  transition: transform 0.3s var(--ease-out-expo);
  box-shadow: 0 0 60px rgba(0, 0, 0, 0.18);
  padding-top: calc(var(--space-5) + env(safe-area-inset-top, 0px));
}
body[data-nav="tab"] .sidebar.open { transform: translateX(0); }
body[data-nav="tab"] .main { height: auto; flex: 1 1 auto; min-height: 0; }

body[data-nav="tab"] .tabbar {
  display: flex;
  flex: 0 0 auto;
  position: relative;
  z-index: 80;
  align-items: stretch;
  background: var(--bg-glass);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  border-top: 1px solid var(--border-default);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

.tab-item {
  flex: 1 1 0;
  min-width: 0;
  height: 56px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  border: none;
  background: transparent;
  color: var(--text-tertiary);
  font-family: inherit;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  cursor: pointer;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.18s;
}
.tab-item svg { width: 21px; height: 21px; }
.tab-item.on { color: var(--accent); font-weight: 600; }
.tab-item.on::before {
  content: '';
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: 20px; height: 2px;
  border-radius: 0 0 2px 2px;
  background: var(--accent);
  animation: tabBar 0.28s var(--ease-out-expo) backwards;
}
@keyframes tabBar { from { width: 0; } to { width: 20px; } }
.tab-item:active { background: var(--o03); }

.tab-add { color: var(--accent); }
.tab-add .tab-add-btn {
  width: 34px; height: 34px;
  border-radius: 10px;
  background: var(--accent);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0, 102, 204, 0.28);
  transition: transform 0.16s var(--ease-spring);
}
.tab-add svg { width: 19px; height: 19px; }
.tab-add:active .tab-add-btn { transform: scale(0.92); }

.tab-badge {
  position: absolute;
  top: 7px;
  left: 50%;
  margin-left: 6px;
  min-width: 15px; height: 15px;
  padding: 0 4px;
  border-radius: 8px;
  background: var(--accent);
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: 15px;
  text-align: center;
  display: none;
}
.tab-badge.show { display: block; }

/* 弹窗/浮层打开时隐藏 tab，避免误触 */
body.panel-open .tabbar { display: none; }

/* 有 tabbar 时内容底部要让出位置（tabbar 不是 fixed，只需少量留白） */
body[data-nav="tab"] .content { padding-bottom: var(--space-8); }

/* ============================================================
 * 3. 旋转 / 安全区
 * ============================================================ */
/* 横屏时刘海在侧边，内容左右都要让 */
.content {
  padding-left: max(var(--space-6), env(safe-area-inset-left, 0px));
  padding-right: max(var(--space-6), env(safe-area-inset-right, 0px));
}
@media (max-width: 1024px) {
  .content {
    padding-left: max(var(--space-4), env(safe-area-inset-left, 0px));
    padding-right: max(var(--space-4), env(safe-area-inset-right, 0px));
  }
}

/* 旋转中禁用过渡，避免导航形态切换时闪一帧 */
body.rotating *,
body.rotating *::before,
body.rotating *::after {
  transition: none !important;
  animation: none !important;
}

/* 顶栏快速记录按钮 */
.quick-add {
  flex: none;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.16s;
  -webkit-tap-highlight-color: transparent;
}
.quick-add svg { width: 16px; height: 16px; }
.quick-add:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-dim); }
.quick-add:active { transform: scale(0.94); }

/* 有底部 tab 时不再显示抽屉按钮（「更多」已承担） */
body[data-nav="tab"] .menu-btn { display: none; }
/* rail 常驻可见，不需要抽屉按钮 */
body[data-nav="rail"] .menu-btn { display: none; }

/* 登录页仍是自己的滚动上下文（body 已 overflow:hidden） */
.login-view {
  height: 100dvh;
  height: 100vh;
  height: 100dvh;
  min-height: 0;
  overflow-y: auto;
}

/* ============================================================
 * 4. 高度档（与宽度正交）
 * ============================================================ */
@media (max-height: 760px) {
  .content { padding-top: var(--space-4); }
  .card { padding: var(--space-4); }
  .hero { padding: var(--space-4); }
  :root { --topbar-h: 54px; }
}

/* 手机横屏 / 极矮视口：优先保住内容，图表折叠为一行文字 */
@media (max-height: 470px) {
  :root { --topbar-h: 46px; }
  body[data-nav="rail"] .nav-item { height: 38px; width: 38px; }
  body[data-nav="rail"] .sidebar { padding-top: 10px; gap: var(--space-2); }
  .topbar-title::after { display: none; }
  .content { padding-top: var(--space-3); }
  .card { padding: var(--space-3); margin-bottom: var(--space-3); }
  .chart-card, .chart-box { display: none; }
  .chart-collapsed-hint { display: block; }
}
.chart-collapsed-hint { display: none; }

/* ============================================================
 * 5. 焦点可见性（键盘可达）
 * ============================================================ */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}
button:focus:not(:focus-visible),
a:focus:not(:focus-visible) { outline: none; }

/* ============================================================
 * 6. 撤销 Toast
 * ============================================================ */
#toast.toast-act {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px 10px 14px;
  max-width: min(480px, calc(100vw - 32px));
}
#toast .toast-undo {
  flex: none;
  border: none;
  background: transparent;
  color: var(--accent);
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 6px;
  border-radius: 6px;
  cursor: pointer;
  white-space: nowrap;
}
#toast .toast-undo:hover { background: var(--accent-dim); }

/* ============================================================
 * 7. 全局捕捉浮层
 * ============================================================ */
.cap-mask {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 12vh var(--space-4) var(--space-4);
  background: rgba(0, 0, 0, 0.18);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.cap-mask.show { display: flex; animation: capIn 0.16s ease-out; }
@keyframes capIn { from { opacity: 0; } to { opacity: 1; } }

.cap-box {
  width: 100%;
  max-width: 560px;
  background: var(--bg-1);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.22);
  overflow: hidden;
  animation: capBox 0.24s var(--ease-out-expo);
  max-height: min(72dvh, 560px);
  display: flex;
  flex-direction: column;
}
@keyframes capBox { from { opacity: 0; transform: translateY(-8px) scale(0.99); } to { opacity: 1; transform: none; } }

.cap-input {
  width: 100%;
  border: none;
  outline: none;
  resize: none;
  background: transparent;
  color: var(--text-primary);
  font-family: inherit;
  font-size: 16px;      /* ≥16px 防 iOS 聚焦自动放大 */
  line-height: 1.5;
  padding: 16px 18px 8px;
  min-height: 58px;
  max-height: 200px;
}
.cap-input::placeholder { color: var(--text-muted); }

.cap-preview {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 0 18px 12px;
  min-height: 26px;
}
.cap-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 24px;
  padding: 0 9px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
  background: var(--accent-dim);
  color: var(--accent);
  border: 1px solid transparent;
}
.cap-chip.sub { background: var(--o04); color: var(--text-secondary); border-color: var(--border-subtle); font-weight: 400; }
.cap-chip.warn { background: var(--warning-dim, rgba(255, 159, 10, 0.14)); color: var(--warning); }

.cap-foot {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: 10px 14px;
  border-top: 1px solid var(--border-subtle);
  background: var(--o02);
}
.cap-hint {
  flex: 1;
  min-width: 0;
  font-size: 11px;
  color: var(--text-tertiary);
  line-height: 1.4;
}
.cap-hint b { color: var(--text-secondary); font-weight: 600; }
.cap-send {
  flex: none;
  height: 30px;
  padding: 0 14px;
  border: none;
  border-radius: 8px;
  background: var(--accent);
  color: #fff;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.cap-send:disabled { opacity: 0.45; cursor: default; }
.cap-recent {
  padding: 6px 18px 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.cap-recent button {
  border: 1px solid var(--border-subtle);
  background: transparent;
  color: var(--text-secondary);
  font-family: inherit;
  font-size: 11px;
  padding: 3px 9px;
  border-radius: 10px;
  cursor: pointer;
}
.cap-recent button:hover { border-color: var(--border-strong); color: var(--text-primary); }

/* 深色模式微调 */
[data-theme="dark"] .cap-mask { background: rgba(0, 0, 0, 0.5); }
[data-theme="dark"] .cap-box { background: #1c1c1e; }
[data-theme="dark"] body[data-nav="rail"] .nav-item::after { background: #2c2c2e; }

/* ============================================================
 * 8. 语义色补充：把「逾期」从审判色降为提醒色
 * ============================================================ */
.is-waiting { color: var(--warning); }
.is-waiting-soft {
  color: var(--warning);
  background: var(--warning-dim, rgba(255, 159, 10, 0.12));
  border-radius: 4px;
  padding: 0 5px;
}

/* ============================================================
 * 5. 今日累积条 M1 + 连击温和提示 F2
 * 设计约束：不占卡片、不加重、不加色 —— 一行字读得完，
 * 全为 0 时不说「暂无数据」，改成一句可执行的引导。
 * ============================================================ */
.today-tally {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  margin: var(--space-4) 0 0;
  font-size: var(--text-base);
  color: var(--text-secondary);
  letter-spacing: 0;
}
.today-tally > b {
  flex: none;
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--text-tertiary);
  letter-spacing: 0.06em;
}
.today-tally > span { display: inline-flex; align-items: baseline; gap: 0; }
.today-tally i {
  font-style: normal;
  color: var(--text-muted);
  margin: 0 8px;
}
.today-tally.is-quiet > span { color: var(--text-tertiary); }

/* 连击断裂：只陈述事实，不加图标、不用红色 */
.hero-soft {
  margin-top: 4px;
  font-size: var(--text-xs);
  color: var(--text-tertiary);
}

/* ============================================================
 * 6. 命令面板（F3 本地版）：Cmd/Ctrl + K
 * 只在已加载数据里找，不发请求 —— 零延迟、零后端。
 * ============================================================ */
.cmdk-mask {
  position: fixed; inset: 0; z-index: 900;
  background: rgba(0, 0, 0, 0.32);
  display: flex; align-items: flex-start; justify-content: center;
  padding-top: 14vh;
  animation: cmdkFade 0.14s ease-out;
}
@keyframes cmdkFade { from { opacity: 0 } to { opacity: 1 } }
.cmdk {
  width: min(560px, calc(100vw - 32px));
  max-height: min(60vh, 480px);
  background: var(--bg-1);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.18);
  overflow: hidden;
  display: flex; flex-direction: column;
  animation: cmdkPop 0.16s var(--ease-out-expo, ease-out);
}
@keyframes cmdkPop { from { opacity: 0; transform: translateY(-8px) scale(0.99) } to { opacity: 1; transform: none } }
.cmdk-in {
  border: none; outline: none; background: transparent;
  padding: 14px 16px; font-size: var(--text-md);
  color: var(--text-primary); width: 100%;
  border-bottom: 1px solid var(--border-subtle);
}
.cmdk-in::placeholder { color: var(--text-muted); }
.cmdk-list { overflow-y: auto; padding: 6px 0; }
.cmdk-grp {
  padding: 8px 16px 4px;
  font-size: var(--text-xs); font-weight: 600;
  color: var(--text-tertiary); letter-spacing: 0.06em;
}
.cmdk-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 16px; cursor: pointer;
  font-size: var(--text-base); color: var(--text-primary);
}
.cmdk-item .cmd-k {
  flex: none; width: 18px; text-align: center;
  font-size: var(--text-sm); color: var(--text-tertiary);
}
.cmdk-item .cmd-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmdk-item .cmd-m { flex: none; font-size: var(--text-xs); color: var(--text-tertiary); }
.cmdk-item.on { background: var(--accent-dim); }
.cmdk-item.on .cmd-t { color: var(--accent); }
.cmdk-empty { padding: 20px 16px; font-size: var(--text-sm); color: var(--text-tertiary); }
.cmdk-foot {
  flex: none; padding: 8px 16px;
  border-top: 1px solid var(--border-subtle);
  font-size: var(--text-xs); color: var(--text-tertiary);
  display: flex; gap: 14px;
}
.cmdk-foot kbd {
  font-family: inherit; font-size: var(--text-xs);
  border: 1px solid var(--border-default); border-radius: 4px;
  padding: 0 4px; margin-right: 3px;
}

/* 顶栏提示：首次可用 */
.cmdk-hint {
  flex: none;
  display: flex; align-items: center; gap: 4px;
  font-size: var(--text-xs); color: var(--text-tertiary);
  border: 1px solid var(--border-subtle); border-radius: var(--radius-sm);
  padding: 3px 7px; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.cmdk-hint:hover { border-color: var(--border-default); color: var(--text-secondary); }
body[data-nav="tab"] .cmdk-hint { display: none; }

@media (max-width: 640px) {
  .cmdk-mask { padding-top: 8vh; }
  .cmdk { max-height: 72vh; }
}

/* QA：禁用所有动画/过渡，供无头截图使用（?noanim） */
body.noanim *, body.noanim *::before, body.noanim *::after {
  animation-duration: 0.001s !important;
  animation-delay: 0s !important;
  transition-duration: 0.001s !important;
}

/* noanim 下强制结束入场动画的起始帧（无头 Chrome 不推进动画时间） */
body.noanim .cmdk-mask, body.noanim .cmdk {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

/* ============================================================
 * 7. 手写月历（替换原生 input[type=date]）
 * 宽度写死 276px：7 列 × 36 + 内边距 24。绝不用 1fr ——
 * 原型阶段用过 1fr + aspect-ratio，在宽容器里会膨胀成大方块。
 * ============================================================ */
.wbcal { display: inline-flex; width: 100%; }
.wbcal-native { display: none !important; }
.wbcal-btn {
  width: 100%;
  min-height: 34px;
  text-align: left;
  font-family: inherit;
  font-size: var(--text-base);
  line-height: 1.5;
  color: var(--text-primary);
  background: var(--bg-1);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: 7px 10px;
  cursor: pointer;
  transition: border-color .16s, background .16s;
  -webkit-tap-highlight-color: transparent;
}
.wbcal-btn:hover { border-color: var(--text-tertiary); }
.wbcal-btn.is-open { border-color: var(--accent); }
.wbcal-btn.is-backfill { color: var(--wb-amber); }

.cal-pop {
  position: fixed;
  z-index: 1700;
  width: 276px;
  padding: 10px;
  background: var(--bg-1);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg, 12px);
  box-shadow: 0 12px 36px rgba(0, 0, 0, .16);
  user-select: none;
  animation: calIn .14s var(--ease-out-expo, ease-out);
}
@keyframes calIn { from { opacity: 0; transform: translateY(-4px) } to { opacity: 1; transform: none } }

.cal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 2px 2px 8px;
}
.cal-title {
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--text-primary);
}
.cal-nav {
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  border: none; background: transparent;
  color: var(--text-secondary);
  font-size: 16px; line-height: 1;
  border-radius: var(--radius-sm);
  cursor: pointer;
}
.cal-nav:hover:not(:disabled) { background: var(--border-subtle); color: var(--text-primary); }
.cal-nav:disabled { opacity: .28; cursor: default; }

.cal-week, .cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 36px);
}
.cal-week { margin-bottom: 2px; }
.cal-week > span {
  height: 22px;
  display: flex; align-items: center; justify-content: center;
  font-size: var(--text-xs);
  color: var(--text-tertiary);
}

.cal-cell {
  width: 36px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  font-size: var(--text-sm);
  color: var(--text-primary);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background .12s;
}
.cal-cell:hover { background: var(--border-subtle); }
.cal-cell.is-blank { cursor: default; }
.cal-cell.is-blank:hover { background: transparent; }
.cal-cell.is-today { color: var(--accent); font-weight: 600; }
.cal-cell.is-off { color: var(--text-muted); cursor: default; }
.cal-cell.is-off:hover { background: transparent; }
.cal-cell.is-sel {
  background: var(--accent);
  color: #fff;
  font-weight: 600;
}
.cal-cell.is-sel:hover { background: var(--accent); }

.cal-foot {
  display: flex; gap: 6px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border-subtle);
}
.cal-quick {
  flex: 1;
  font-family: inherit;
  font-size: var(--text-sm);
  color: var(--text-secondary);
  background: transparent;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  padding: 5px 0;
  cursor: pointer;
  transition: all .14s;
}
.cal-quick:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-dim); }

/* hero 里的行内动作链接（补签）：像文字，可点，不抢视觉 */
.soft-link {
  font-family: inherit;
  font-size: inherit;
  color: var(--accent);
  background: transparent;
  border: none;
  padding: 0 2px;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}
.soft-link:hover { color: var(--accent); opacity: .75; }
.soft-hint { margin-left: 6px; color: var(--text-muted); }

/* ============================================================
 * 8. 胶囊选择器（替代原生 select）
 * 原生 select 的展开面板由系统绘制，样式完全碰不到 —— 与月历同理。
 * ============================================================ */
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip {
  font-family: inherit;
  font-size: var(--text-sm);
  line-height: 1.2;
  color: var(--text-secondary);
  background: transparent;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  padding: 5px 11px;
  cursor: pointer;
  transition: all .14s;
  -webkit-tap-highlight-color: transparent;
  white-space: nowrap;
}
.chip:hover { border-color: var(--border-default); color: var(--text-primary); }
.chip.on {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-dim);
}
.chip .chip-n { margin-left: 4px; color: var(--text-tertiary); }
.chip.on .chip-n { color: var(--accent); }

/* ============================================================
 * 9. Inbox 键盘流（E5）
 * 输入框是页面主角：无边框、大字号、无聚焦环，像一张纸。
 * ============================================================ */
.inbox-card { padding-bottom: 12px; }
.inbox-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; margin-bottom: 8px;
}
.inbox-hint {
  font-size: var(--text-xs);
  color: var(--text-muted);
  text-align: right;
}
.inbox-input {
  width: 100%;
  min-height: 62px;
  font-family: inherit;
  font-size: var(--text-md);
  line-height: 1.65;
  color: var(--text-primary);
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--border-subtle);
  border-radius: 0;
  padding: 4px 0 10px;
  resize: none;
  outline: none;
}
.inbox-input::placeholder { color: var(--text-muted); }
.inbox-input:focus { border-bottom-color: var(--accent); }
.inbox-foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-top: 12px;
}
.inbox-foot .chips { flex: 1; min-width: 0; }
.inbox-foot .btn-primary { flex: none; }

@media (max-width: 640px) {
  .inbox-head { display: block; }
  .inbox-hint { text-align: left; margin-top: 2px; }
  .inbox-foot { display: block; }
  .inbox-foot .chips { margin-bottom: 10px; }
  .inbox-foot .btn-primary { width: 100%; }
}

/* ============================================================
 * 10. 记一笔弹窗（行式布局：左标签右控件）
 * 为什么不用 .dy-form-grid 四列栅格：类目有 10 个胶囊，
 * 塞在 1/4 列里会变成两三行挤压；行式布局每个控件都能撑满。
 * ============================================================ */
.am-modal { max-width: 520px; }
.am-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.am-lbl {
  flex: none;
  width: 34px;
  padding-top: 6px;
  font-size: var(--text-sm);
  color: var(--text-tertiary);
}
.am-row > .chips { flex: 1; min-width: 0; }
.am-row > #am-cat-wrap { flex: 1; min-width: 0; }
.am-cat-grp { margin-bottom: 6px; }
.am-cat-grp:last-child { margin-bottom: 0; }
.am-cat-lbl {
  display: block;
  margin-bottom: 4px;
  font-size: var(--text-xs);
  color: var(--text-muted);
}
.chip.is-recent { border-color: var(--border-default); color: var(--text-primary); }
.chip.is-recent::after {
  content: '';
  display: inline-block;
  width: 4px; height: 4px;
  margin-left: 5px;
  vertical-align: middle;
  border-radius: 50%;
  background: var(--accent);
}

.am-amt-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: 0 10px;
  background: var(--bg-1);
}
.am-amt-wrap:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-dim); }
.am-amt-cur { flex: none; font-size: var(--text-md); color: var(--text-tertiary); }
.am-amt-wrap input {
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  font-family: inherit;
  font-size: var(--text-lg);
  font-weight: 600;
  color: var(--text-primary);
  padding: 5px 0;
  appearance: textfield;
  -moz-appearance: textfield;
}
/* 数字框的原生上下箭头由浏览器绘制，深浅色都不受控，直接去掉 */
.am-amt-wrap input::-webkit-outer-spin-button,
.am-amt-wrap input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.am-date-wrap { flex: 1; min-width: 0; }
.am-note {
  flex: 1;
  min-height: 34px;
  min-width: 0;
  font-family: inherit;
  font-size: var(--text-base);
  color: var(--text-primary);
  background: var(--bg-1);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: 7px 10px;
  outline: none;
}
.am-note:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-dim); }

@media (max-width: 640px) {
  .am-row { gap: 10px; }
  .am-lbl { width: 30px; font-size: var(--text-xs); }
}

/* ============================================================
 * 11. 粘贴拆解预览 + 批量处理面板（E6 / E7）
 * ============================================================ */
.td-bulk {
  margin: 4px 0 12px;
  padding: 12px;
  border: 1px solid var(--wb-amber-line);
  background: var(--wb-amber-dim);
  border-radius: var(--radius-sm);
}
.td-bulk-head {
  font-size: var(--text-sm);
  color: var(--text-primary);
  margin-bottom: 8px;
}
.td-bulk-head b { font-weight: 600; }
.td-bulk-sub {
  display: block;
  margin-top: 2px;
  font-size: var(--text-xs);
  color: var(--text-tertiary);
}
.td-bulk-list {
  max-height: 180px;
  overflow-y: auto;
  background: var(--bg-1);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  padding: 4px 0;
}
.td-bulk-item {
  display: flex;
  gap: 8px;
  padding: 4px 10px;
  font-size: var(--text-sm);
  color: var(--text-secondary);
}
.td-bulk-n {
  flex: none;
  width: 16px;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}
.td-bulk-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
}

.td-bulk-panel { max-width: 560px; }
.td-bulk-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 0 8px;
}
.td-bulk-tools .sec-note { margin-right: auto; }
.td-bulk-rows {
  max-height: min(52vh, 420px);
  overflow-y: auto;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
}
.td-bulk-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  cursor: pointer;
  border-bottom: 1px solid var(--border-subtle);
  font-size: var(--text-base);
}
.td-bulk-row:last-child { border-bottom: none; }
.td-bulk-row:hover { background: var(--bg-0); }
.td-bulk-row input { flex: none; width: 15px; height: 15px; accent-color: var(--accent); }
.td-bulk-t {
  flex: 1;
  min-width: 0;
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.td-bulk-m {
  flex: none;
  font-size: var(--text-xs);
  color: var(--text-tertiary);
}
.td-bulk-count {
  margin-right: auto;
  font-size: var(--text-sm);
  color: var(--text-tertiary);
}
.td-bulk-btn { flex: none; }

/* ============================================================
 * 12. 双端接力 / 收尾仪式 / 回看（E9 + M2 + M3）
 * 三者都很轻：一行字、一句话、一个数字。
 * 不加图标、不加进度环、不做「今日报告」—— 怕的是仪式感变负担。
 * ============================================================ */
.resume-bar {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-top: 12px;
  padding: 9px 12px;
  background: var(--accent-dim);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
}
.resume-k {
  flex: none;
  font-size: var(--text-xs);
  color: var(--accent);
  letter-spacing: 0.02em;
}
.resume-t {
  flex: 1;
  min-width: 0;
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.close-card {
  margin-top: 16px;
  padding: 16px 18px;
}
.close-head { margin-bottom: 10px; }
.close-h {
  font-size: var(--text-md);
  font-weight: 600;
  color: var(--text-primary);
}
.close-sub {
  margin-top: 2px;
  font-size: var(--text-xs);
  color: var(--text-tertiary);
}
.close-in {
  width: 100%;
  min-height: 36px;
  font-family: inherit;
  font-size: var(--text-base);
  color: var(--text-primary);
  background: var(--bg-0);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  padding: 8px 12px;
  outline: none;
}
.close-in:focus { border-color: var(--accent); background: var(--bg-1); }
.close-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
}

.review-card { padding: 16px 18px; }
.review-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.review-k { font-size: var(--text-sm); color: var(--text-tertiary); }
.review-v {
  font-size: var(--text-2xl);
  font-weight: 600;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.review-v .u { font-size: var(--text-sm); font-weight: 400; color: var(--text-tertiary); margin-left: 2px; }
.review-n { font-size: var(--text-sm); color: var(--text-secondary); }
.review-note {
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--border-subtle);
  font-size: var(--text-sm);
  color: var(--text-tertiary);
  line-height: 1.7;
}

/* ============================================================
 * 13. 决策面卡片（P1-1）
 * 全页只有一个视觉重心：这件事的标题。
 * 不用色条、不用徽章、不用进度环 —— 多一个视觉元素就多一次分心。
 * ============================================================ */
.next-card {
  margin-top: 16px;
  padding: 20px 22px;
}
.next-k {
  font-size: var(--text-xs);
  color: var(--text-tertiary);
  letter-spacing: 0.08em;
}
.next-t {
  margin-top: 6px;
  font-size: var(--text-2xl);
  font-weight: 600;
  line-height: 1.35;
  color: var(--text-primary);
  letter-spacing: -0.01em;
  word-break: break-word;
}
.next-m {
  margin-top: 8px;
  font-size: var(--text-sm);
  color: var(--text-tertiary);
  word-break: break-word;
}
.next-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
@media (max-width: 640px) {
  .next-card { padding: 16px; }
  .next-actions .btn-primary,
  .next-actions .btn-secondary { flex: 1 1 auto; }
}