/* =====================================================================
   中控台 A 版外观（Material 3 官方感，石板蓝种子色）—— server/web/theme.css
   ---------------------------------------------------------------------
   来源：设计规范 C:/zdhwork/design/v3/system.css + 风格稿 design/v3/A/index.html。
   在 index.html 里**最后**引入，盖掉旧令牌与旧控件外观；不改任何页面的结构与逻辑。

   约定（后面几路改页面内部时请照着用）：
   1. 新令牌：--surface / --surface-2 / --surface-3 / --line / --line-2 / --line-strong
      / --accent / --accent-soft / --accent-ink / --ok|warn|crit|idle 加 -soft（底）与 -ink（字）。
      **状态色的字一律用 -ink，底一律用 -soft**；--warn 本色只给色点、色条，直接拿来当字对比度不够。
   2. 旧变量名照旧能用（别名）：--raise→surface-2，--sunk→surface-3，--rule→line，--hair→line-2。
   3. --brand 已改指主色（旧页面把它当「强调色」画图表、运行中）；Logo 那块绯红改用 --logo。
      红色只表示「出事 / 急停」，不做装饰。
   4. color-mix 一律 in oklab。in oklch 会沿色相环绕远路，状态色混中性色时混出紫 / 粉（旧版急停描边、
      手机安排工作时段的粉块都是这么来的）；本文件末尾把全站那几处统一改写了。
   5. 断点：手机 ≤720px（底部导航）；平板 721–1023px（左侧图标栏）；电脑 ≥1024px（完整左侧导航）。
   ===================================================================== */

/* ───────────── 1. 色板：浅色（默认） ───────────── */
:root {
  color-scheme: light;
  --bg:          oklch(0.985 0.006 258);  /* 页面底 */
  --surface:     oklch(1 0 0);            /* 卡片、表格、输入框 */
  --surface-2:   oklch(0.962 0.009 258);  /* 侧栏、卡片组、底部弹层 */
  --surface-3:   oklch(0.93 0.012 258);   /* 悬停底、轨道、骨架 */
  --line:        oklch(0.87 0.012 258);   /* 边框、分隔线 */
  --line-2:      oklch(0.925 0.009 258);  /* 表格行线 */
  --line-strong: oklch(0.7 0.014 258);    /* 描边按钮、分段按钮、输入框边 */
  --ink:         oklch(0.22 0.012 258);   /* 正文 */
  --ink-2:       oklch(0.44 0.015 258);   /* 次要文字（对白底 ≥ 7:1） */
  --ink-3:       oklch(0.56 0.012 258);   /* 弱化标签（对白底约 4.6:1，旧页面拿它写小字，所以比规范稿再压深一档） */
  --on-ink:      oklch(0.99 0 0);
  /* 主色：只给主操作、选中、焦点 */
  --accent:      oklch(0.47 0.12 258);
  --on-accent:   oklch(1 0 0);
  --accent-soft: oklch(0.915 0.04 258);   /* 选中底（Material 的 secondary-container） */
  --accent-ink:  oklch(0.3 0.075 258);    /* 选中底上的字 */
  --fab-bg:      oklch(0.895 0.055 258);
  --fab-ink:     oklch(0.27 0.1 258);
  /* 语义色：只表示健康度，永远和文字成对 */
  --ok:   oklch(0.56 0.13 155);  --ok-soft:   oklch(0.935 0.045 155); --ok-ink:   oklch(0.37 0.09 155);
  --warn: oklch(0.72 0.15 75);   --warn-soft: oklch(0.945 0.06 85);   --warn-ink: oklch(0.44 0.1 62);
  --crit: oklch(0.55 0.19 25);   --crit-soft: oklch(0.945 0.035 25);  --crit-ink: oklch(0.49 0.19 25);
  --idle: oklch(0.62 0.02 258);  --idle-soft: oklch(0.93 0.01 258);   --idle-ink: oklch(0.42 0.015 258);
  --focus: oklch(0.55 0.16 250);
  --logo:  oklch(0.591 0.172 24);         /* 只用于 Logo 方块 */
  --brand: var(--accent);                 /* 旧页面拿它画强调线 / 运行中：改指主色，不再用红 */
  --scrim: oklch(0.2 0.02 258 / .42);
  --row-hover: oklch(0.47 0.12 258 / .04);
  --row-sel:   oklch(0.47 0.12 258 / .08);
  --tabbar-bg: oklch(0.945 0.011 258);
  /* 作息色块（手机安排的时间条） */
  --k-work:  oklch(0.885 0.05 258); --k-work-ink:  oklch(0.32 0.08 258);
  --k-rest:  oklch(0.915 0.04 185); --k-rest-ink:  oklch(0.38 0.06 190);
  --k-sleep: oklch(0.905 0.01 258); --k-sleep-ink: oklch(0.44 0.015 258);
  /* 旧变量别名（app.css / console.css / daily-plan.css / action-console.css 里还在用） */
  --raise: var(--surface-2);
  --sunk:  var(--surface-3);
  --rule:  var(--line);
  --hair:  var(--line-2);

  /* ───────────── 2. 字体与字号 ───────────── */
  --sans: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB",
          "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Consolas, monospace;
  /* 固定 rem 阶梯（比例约 1.125）；字重只用 400 / 500 / 600 */
  --t-xs:   0.75rem;    /* 12  标签、表头、徽标 */
  --t-sm:   0.8125rem;  /* 13  表格次行、说明 */
  --t-base: 0.875rem;   /* 14  界面正文、按钮 */
  --t-md:   1rem;       /* 16  区块标题、卡片标题 */
  --t-lg:   1.375rem;   /* 22  手机顶栏标题、弹层标题 */
  --t-xl:   1.75rem;    /* 28  电脑页面标题 */
  --t-num:  1.25rem;    /* 20  卡片里的关键绝对数 */

  /* ───────────── 3. 间距、圆角、阴影、动效、层级、尺寸 ───────────── */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px;
  /* 圆角：可点的按钮 / 分段 / 导航指示条全圆；卡片 12；菜单 8；输入框 4；底部弹层 28 */
  --r-xs: 4px; --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 28px; --r-full: 999px;
  /* 阴影只给浮起来的东西（菜单、悬浮按钮、对话框），卡片不叠阴影 */
  --sh-1: 0 1px 2px oklch(0.2 0.03 258 / .28), 0 1px 3px 1px oklch(0.2 0.03 258 / .12);
  --sh-2: 0 1px 2px oklch(0.2 0.03 258 / .28), 0 2px 6px 2px oklch(0.2 0.03 258 / .13);
  --sh-3: 0 1px 3px oklch(0.2 0.03 258 / .28), 0 4px 8px 3px oklch(0.2 0.03 258 / .13);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 180ms;
  --z-dropdown: 10; --z-sticky: 20; --z-fab: 22; --z-backdrop: 30; --z-modal: 40; --z-menu: 45; --z-toast: 50; --z-tooltip: 60;
  --h-btn: 40px; --h-btn-sm: 32px; --h-btn-lg: 52px; --h-input: 40px; --h-row: 56px; --h-th: 44px;
  /* 外壳几何：--shell-left 是左侧导航占的宽度，固定在底部的条（手机安排的保存条）靠它让开侧栏 */
  --sn-w: 256px; --rail-w: 80px; --appbar-h: 64px; --tabbar-h: 80px;
  --shell-left: 0px;
}

/* ───────────── 1b. 色板：深色（跟随系统，或手动 data-theme="dark"） ───────────── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: oklch(0.175 0.01 258); --surface: oklch(0.215 0.012 258); --surface-2: oklch(0.235 0.013 258); --surface-3: oklch(0.285 0.014 258);
    --line: oklch(0.37 0.014 258); --line-2: oklch(0.29 0.012 258); --line-strong: oklch(0.56 0.014 258);
    --ink: oklch(0.92 0.008 258); --ink-2: oklch(0.78 0.012 258); --ink-3: oklch(0.66 0.012 258);
    --on-ink: oklch(0.17 0.01 258);
    --accent: oklch(0.82 0.08 258); --on-accent: oklch(0.29 0.08 258); --accent-soft: oklch(0.37 0.04 258); --accent-ink: oklch(0.9 0.035 258);
    --fab-bg: oklch(0.4 0.08 258); --fab-ink: oklch(0.92 0.04 258);
    --ok: oklch(0.75 0.14 155); --ok-soft: oklch(0.33 0.05 155); --ok-ink: oklch(0.86 0.1 155);
    --warn: oklch(0.8 0.14 80); --warn-soft: oklch(0.35 0.05 75); --warn-ink: oklch(0.88 0.1 85);
    --crit: oklch(0.7 0.17 25); --crit-soft: oklch(0.34 0.07 25); --crit-ink: oklch(0.84 0.1 25);
    --idle: oklch(0.6 0.02 258); --idle-soft: oklch(0.3 0.012 258); --idle-ink: oklch(0.82 0.012 258);
    --focus: oklch(0.72 0.14 250); --logo: oklch(0.62 0.17 24);
    /* app.css 的深色块也写了这几个（优先级更高），这里必须同样写一遍别名，否则深色下会退回旧色 */
    --brand: var(--accent); --raise: var(--surface-2); --sunk: var(--surface-3); --rule: var(--line); --hair: var(--line-2);
    --scrim: oklch(0.05 0 0 / .55);
    --row-hover: oklch(0.82 0.08 258 / .05); --row-sel: oklch(0.82 0.08 258 / .1);
    --tabbar-bg: oklch(0.225 0.013 258);
    --k-work: oklch(0.38 0.05 258); --k-work-ink: oklch(0.9 0.035 258);
    --k-rest: oklch(0.37 0.04 190); --k-rest-ink: oklch(0.88 0.05 190);
    --k-sleep: oklch(0.3 0.01 258); --k-sleep-ink: oklch(0.78 0.012 258);
    --sh-1: 0 1px 2px oklch(0 0 0 / .4), 0 1px 3px 1px oklch(0 0 0 / .2);
    --sh-2: 0 1px 2px oklch(0 0 0 / .4), 0 2px 6px 2px oklch(0 0 0 / .25);
    --sh-3: 0 1px 3px oklch(0 0 0 / .4), 0 4px 8px 3px oklch(0 0 0 / .25);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: oklch(0.175 0.01 258); --surface: oklch(0.215 0.012 258); --surface-2: oklch(0.235 0.013 258); --surface-3: oklch(0.285 0.014 258);
  --line: oklch(0.37 0.014 258); --line-2: oklch(0.29 0.012 258); --line-strong: oklch(0.56 0.014 258);
  --ink: oklch(0.92 0.008 258); --ink-2: oklch(0.78 0.012 258); --ink-3: oklch(0.66 0.012 258);
  --on-ink: oklch(0.17 0.01 258);
  --accent: oklch(0.82 0.08 258); --on-accent: oklch(0.29 0.08 258); --accent-soft: oklch(0.37 0.04 258); --accent-ink: oklch(0.9 0.035 258);
  --fab-bg: oklch(0.4 0.08 258); --fab-ink: oklch(0.92 0.04 258);
  --ok: oklch(0.75 0.14 155); --ok-soft: oklch(0.33 0.05 155); --ok-ink: oklch(0.86 0.1 155);
  --warn: oklch(0.8 0.14 80); --warn-soft: oklch(0.35 0.05 75); --warn-ink: oklch(0.88 0.1 85);
  --crit: oklch(0.7 0.17 25); --crit-soft: oklch(0.34 0.07 25); --crit-ink: oklch(0.84 0.1 25);
  --idle: oklch(0.6 0.02 258); --idle-soft: oklch(0.3 0.012 258); --idle-ink: oklch(0.82 0.012 258);
  --focus: oklch(0.72 0.14 250); --logo: oklch(0.62 0.17 24);
  --brand: var(--accent); --raise: var(--surface-2); --sunk: var(--surface-3); --rule: var(--line); --hair: var(--line-2);
  --scrim: oklch(0.05 0 0 / .55);
  --row-hover: oklch(0.82 0.08 258 / .05); --row-sel: oklch(0.82 0.08 258 / .1);
  --tabbar-bg: oklch(0.225 0.013 258);
  --k-work: oklch(0.38 0.05 258); --k-work-ink: oklch(0.9 0.035 258);
  --k-rest: oklch(0.37 0.04 190); --k-rest-ink: oklch(0.88 0.05 190);
  --k-sleep: oklch(0.3 0.01 258); --k-sleep-ink: oklch(0.78 0.012 258);
  --sh-1: 0 1px 2px oklch(0 0 0 / .4), 0 1px 3px 1px oklch(0 0 0 / .2);
  --sh-2: 0 1px 2px oklch(0 0 0 / .4), 0 2px 6px 2px oklch(0 0 0 / .25);
  --sh-3: 0 1px 3px oklch(0 0 0 / .4), 0 4px 8px 3px oklch(0 0 0 / .25);
}

/* 外壳几何随断点变 */
@media (min-width: 1024px) { :root { --shell-left: var(--sn-w); } }
@media (min-width: 721px) and (max-width: 1023px) { :root { --shell-left: var(--rail-w); } }

/* ───────────── 4. 基础 ───────────── */
html { -webkit-text-size-adjust: 100%; }
body { background: var(--bg); color: var(--ink); font: 400 var(--t-base)/1.6 var(--sans); -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
/* 外壳图标（24 格）：比页面里的旧小图标粗一点、大一点 */
svg.sic { width: 20px; height: 20px; stroke-width: 1.8; }
.skip { background: var(--accent); color: var(--on-accent); border-radius: var(--r-full); padding: 8px 16px; }

/* 状态层：悬停 7%、按下 12%，叠在任何底色上都成立（Material 的做法） */
.btn, .ac-btn, .chip, .fl-pile, .ac-chip, .seg > button, .daily-plan .dp-segmented button, .select, .menu > button,
.sn-item, .more-item, .fab, .dcard {
  --sl: 0%;
  background-image: linear-gradient(color-mix(in oklab, currentColor var(--sl), transparent), color-mix(in oklab, currentColor var(--sl), transparent));
}
:is(.btn, .ac-btn, .chip, .fl-pile, .ac-chip, .seg > button, .daily-plan .dp-segmented button, .select, .menu > button,
    .sn-item, .more-item, .fab, .dcard):hover { --sl: 7%; }
:is(.btn, .ac-btn, .chip, .fl-pile, .ac-chip, .seg > button, .daily-plan .dp-segmented button, .select, .menu > button,
    .sn-item, .more-item, .fab, .dcard):active { --sl: 12%; }

/* ───────────── 5. 按钮 ─────────────
   主（实底主色 .btn-primary）/ 次（描边，.btn 默认就是它）/ 浅底（.btn-tonal）
   / 文字（.btn-ghost）/ 危险（.btn-danger）/ 图标（.btn-icon）
   五态：悬停 = 状态层 7%；按下 = 12% + 下沉 1px；禁用 = 38% 透明；焦点 = 2px 蓝环 */
.btn, .ac-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: var(--h-btn); height: auto; padding: 0 20px; white-space: nowrap;
  border: 1px solid var(--line-strong); border-radius: var(--r-full);
  background-color: transparent; color: var(--ink);
  font: 500 var(--t-base)/1.2 var(--sans); letter-spacing: 0.01em; cursor: pointer; user-select: none;
  transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), transform 120ms var(--ease);
}
/* 盖掉 app.css 里 .btn:hover 的整块底色，改成同一套状态层 */
.btn:hover, .ac-btn:hover:not(:disabled) { background-color: transparent;
  background-image: linear-gradient(color-mix(in oklab, currentColor 7%, transparent), color-mix(in oklab, currentColor 7%, transparent)); }
.btn:active, .ac-btn:active { transform: translateY(1px); }
.btn .ic { width: 18px; height: 18px; margin-left: -4px; }
.btn:disabled, .btn[disabled], .btn[aria-disabled="true"], .ac-btn:disabled {
  opacity: .38; cursor: not-allowed; pointer-events: none; transform: none;
}
.btn[aria-busy="true"] { cursor: progress; }
/* 「正在看这一项」的按下态（日报今天 / 昨天这类切换）：浅底 + 字色加深，不淡 */
.btn[aria-pressed="true"] { opacity: 1; border-color: transparent; background-color: var(--accent-soft); color: var(--accent-ink); font-weight: 600; }
.btn-primary, .btn-primary:hover, .ac-btn-go, .ac-btn-go:hover:not(:disabled), .daily-plan .dp-primary {
  border-color: transparent; background-color: var(--accent); color: var(--on-accent);
}
.daily-plan .dp-primary:hover:not(:disabled) { background-color: var(--accent); }
.btn-tonal, .btn-tonal:hover { border-color: transparent; background-color: var(--accent-soft); color: var(--accent-ink); }
.btn-outline, .btn-outline:hover { border-color: var(--line-strong); color: var(--ink); }
.btn-ghost { padding: 0 12px; }
.btn-ghost, .btn-ghost:hover { border-color: transparent; background-color: transparent; color: var(--accent-ink); }
.btn-danger, .btn-danger:hover, .ac-btn-stop, .ac-btn-stop:hover:not(:disabled) {
  border-color: color-mix(in oklab, var(--crit) 55%, transparent); color: var(--crit-ink); background-color: transparent;
}
.btn-icon, .btn-icon:hover { border-color: transparent; color: var(--ink-2); }
.btn-icon { width: var(--h-btn); min-height: var(--h-btn); padding: 0; }
.btn-icon .ic { margin: 0; width: 22px; height: 22px; }
.btn-icon .sic { width: 22px; height: 22px; }
.btn-sm { min-height: var(--h-btn-sm); padding: 0 14px; font-size: var(--t-sm); }
.btn-sm .ic { width: 16px; height: 16px; }
.btn-icon.btn-sm { width: var(--h-btn-sm); padding: 0; }
.btn-lg { min-height: var(--h-btn-lg); padding: 0 28px; font-size: var(--t-md); }
.btn-block { width: 100%; }
.btn-group { display: inline-flex; }
.btn-group > .btn { border-radius: 0; }
.btn-group > .btn + .btn { margin-left: -1px; }
.btn-group > .btn:first-child { border-radius: var(--r-full) 0 0 var(--r-full); }
.btn-group > .btn:last-child { border-radius: 0 var(--r-full) var(--r-full) 0; }
.btn[aria-expanded="true"] { --sl: 10%; }
/* 每日计划页里的通用按钮：同一套描边按钮，表格内用小圆角 */
.daily-plan button { border-color: var(--line-strong); border-radius: var(--r-sm); }
.daily-plan button:hover:not(:disabled) { background-color: var(--surface-2); border-color: var(--line-strong); }

/* ───────────── 6. 状态点 / 标签 / 徽标 ───────────── */
.st { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.st-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--idle); }
.st[data-s="ok"] .st-dot   { background: var(--ok);   box-shadow: 0 0 0 3px var(--ok-soft); }
.st[data-s="warn"] .st-dot { background: var(--warn); box-shadow: 0 0 0 3px var(--warn-soft); }
.st[data-s="crit"] .st-dot { background: var(--crit); box-shadow: 0 0 0 3px var(--crit-soft); }
.st-txt { font-size: var(--t-sm); color: var(--ink); }
.daily-plan .dp-status[data-status="online"]::before { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-soft); }
.daily-plan .dp-status[data-status="attention"]::before { background: var(--warn); box-shadow: 0 0 0 3px var(--warn-soft); }

.tag, .cs-tag {
  display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 8px; vertical-align: middle;
  border: 0; border-radius: var(--r-sm); background: var(--idle-soft); color: var(--idle-ink);
  font: 500 var(--t-xs)/1 var(--sans); white-space: nowrap; margin-block: 2px;
}
.tag .ic { width: 14px; height: 14px; margin-left: -2px; }
:is(.tag, .cs-tag)[data-s="ok"]   { background: var(--ok-soft);   color: var(--ok-ink); }
:is(.tag, .cs-tag)[data-s="warn"] { background: var(--warn-soft); color: var(--warn-ink); }
:is(.tag, .cs-tag)[data-s="crit"] { background: var(--crit-soft); color: var(--crit-ink); }
:is(.tag, .cs-tag)[data-s="idle"] { background: var(--idle-soft); color: var(--idle-ink); }
/* 「测试」这类身份徽标：描边、不占颜色 */
.tag-test, .daily-plan .dp-badge, .daily-plan.dp-v3 .dp-badge {
  display: inline-flex; align-items: center; height: auto; min-height: 20px; padding: 0 6px; vertical-align: middle;
  border: 0; border-radius: var(--r-sm); background: transparent;
  box-shadow: inset 0 0 0 1px var(--line-strong); color: var(--ink-2); font: 500 11px/18px var(--sans);
}

/* ───────────── 7. 开关（只动 transform） ─────────────
   用法：<button class="switch" role="switch" aria-checked="true"><span class="switch-thumb"><svg class="ic">✓</svg></span></button> */
.switch { --sw-w: 52px; --sw-h: 32px; --th: 24px; --th-off: .667;
  position: relative; flex: none; width: var(--sw-w); height: var(--sw-h); padding: 0; border-radius: var(--r-full);
  border: 2px solid var(--line-strong); background: var(--surface-3); cursor: pointer;
  transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.switch-thumb { position: absolute; top: calc((var(--sw-h) - 4px - var(--th)) / 2); left: calc((var(--sw-h) - 4px - var(--th)) / 2);
  width: var(--th); height: var(--th); border-radius: 50%; display: grid; place-items: center;
  background: var(--ink-2); transform: scale(var(--th-off)); transition: transform var(--dur) var(--ease), background-color var(--dur) var(--ease); }
.switch-thumb .ic { width: 16px; height: 16px; stroke-width: 2.6; color: var(--accent); opacity: 0; transition: opacity var(--dur) var(--ease); }
.switch[aria-checked="true"] { background: var(--accent); border-color: var(--accent); }
.switch[aria-checked="true"] .switch-thumb { background: var(--on-accent); transform: translateX(calc(var(--sw-w) - var(--sw-h))) scale(1); }
.switch[aria-checked="true"] .switch-thumb .ic { opacity: 1; }
.switch:disabled { opacity: .38; cursor: not-allowed; }
.switch-sm { --sw-w: 40px; --sw-h: 24px; --th: 16px; --th-off: .75; }
.switch-sm .switch-thumb .ic { width: 12px; height: 12px; }

/* ───────────── 8. 勾选框 / 单选 ─────────────
   原生勾选框只换主色、给 18px；用 :where 不抬优先级，页面自己写了尺寸的照旧 */
:where(input[type="checkbox"], input[type="radio"]) { accent-color: var(--accent); width: 18px; height: 18px; }
.cbox { display: inline-grid; place-items: center; flex: none; width: 18px; height: 18px; border-radius: var(--r-xs);
        border: 2px solid var(--ink-2); color: transparent; cursor: pointer; transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.cbox .ic { width: 14px; height: 14px; stroke-width: 3; }
.cbox[aria-checked="true"], [aria-checked="true"] > .cbox { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.radio { position: relative; display: flex; align-items: center; gap: 14px; min-height: 48px; cursor: pointer; }
.radio input { position: absolute; opacity: 0; pointer-events: none; }
.radio-dot { position: relative; flex: none; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--ink-2); }
.radio input:checked + .radio-dot { border-color: var(--accent); }
.radio input:checked + .radio-dot::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--accent); }
.radio input:focus-visible + .radio-dot { outline: 2px solid var(--focus); outline-offset: 2px; }

/* ───────────── 9. 分段按钮（.seg / 每日计划的 .dp-segmented / .dp-reply-switch） ───────────── */
.seg, .daily-plan .dp-segmented, .daily-plan .dp-reply-switch {
  display: inline-flex; align-items: stretch; gap: 0; padding: 0; overflow: hidden;
  border: 1px solid var(--line-strong); border-radius: var(--r-full); background: transparent;
}
.seg > button, .daily-plan .dp-segmented button, .daily-plan .dp-reply-switch button {
  flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 40px; padding: 0 14px; margin: 0; border: 0; border-left: 1px solid var(--line-strong); border-radius: 0;
  background-color: transparent; color: var(--ink); font: 500 var(--t-sm)/1 var(--sans); white-space: nowrap; cursor: pointer;
}
:is(.seg > button, .daily-plan .dp-segmented button, .daily-plan .dp-reply-switch button):first-child { border-left: 0; }
:is(.seg > button, .daily-plan .dp-segmented button, .daily-plan .dp-reply-switch button)[aria-pressed="true"] {
  background-color: var(--accent-soft); color: var(--accent-ink); border-color: var(--line-strong);
}
.seg > button .ic { width: 18px; height: 18px; }
.seg-ck { display: none; width: 16px; height: 16px; stroke-width: 2.4; }
.seg > button[aria-pressed="true"] .seg-ck { display: block; }
.seg-full { display: flex; width: 100%; }
.seg-full > button { flex: 1 1 0; }
.seg-sm > button { min-height: 32px; padding: 0 12px; }
.seg-xs > button { min-height: 32px; padding: 0 10px; font-size: 12.5px; }
.seg-xs > button .ic { width: 16px; height: 16px; }

/* ───────────── 10. 筛选芯片（.chip / 手机总表的 .fl-pile / 动作台的 .ac-chip） ───────────── */
.chip, .fl-pile, .ac-chip {
  display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 12px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background-color: transparent;
  color: var(--ink-2); font: 500 var(--t-sm)/1.2 var(--sans); white-space: nowrap; cursor: pointer;
  transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.chip[aria-pressed="true"], .fl-pile[data-on="1"], .ac-chip-sel {
  border-color: transparent; background-color: var(--accent-soft); color: var(--accent-ink); box-shadow: none;
}
.fl-pile[data-on="1"] .fl-pile-c { color: var(--accent-ink); }
.fl-pile-c, .chip-n { font: 500 var(--t-xs)/1 var(--mono); color: inherit; }
.fl-pile[data-zero="1"] { color: var(--ink-3); border-style: dashed; }
.chip:disabled, .fl-pile[disabled], .ac-chip-off { opacity: .38; cursor: not-allowed; }
.fl-pile:hover, .ac-chip:hover { color: var(--ink); border-color: var(--line-strong); }

/* ───────────── 11. 输入框与下拉选择器 ─────────────
   项目里有类名的（.input .fl-inp .ac-input .fl-sel）用完整外观；
   没写类名的原生输入框 / 下拉用 :where 给一层打底（0 优先级，页面自己的样式照旧赢）。 */
.input, .fl-inp, .ac-input:not([type="checkbox"]), .fl-sel, select.input {
  min-height: var(--h-input); padding: 0 12px; border: 1px solid var(--line-strong); border-radius: var(--r-xs);
  background-color: var(--surface); color: var(--ink); font: 400 var(--t-base)/1.2 var(--sans);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
:is(.input, .fl-inp, .ac-input, .fl-sel):hover { border-color: var(--ink-2); }
:is(.input, .fl-inp, .ac-input, .fl-sel):focus { outline: none; border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.fl-sel, select.input {
  appearance: none; -webkit-appearance: none; padding-right: 36px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2344474e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 9.5 5.5 5.5 5.5-5.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 18px;
}
:root[data-theme="dark"] :is(.fl-sel, select.input) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c4c6d0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 9.5 5.5 5.5 5.5-5.5'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) :is(.fl-sel, select.input) {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c4c6d0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 9.5 5.5 5.5 5.5-5.5'/%3E%3C/svg%3E");
  }
}
:where(select, textarea,
  input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], [type="button"], [type="submit"], [type="reset"], [type="image"], [type="hidden"])) {
  min-height: 36px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: var(--r-xs);
  background-color: var(--surface); color: var(--ink); font: inherit; font-size: var(--t-base);
}
:where(textarea) { padding: 8px 10px; line-height: 1.6; }
:where(select, textarea, input):hover:not(:disabled):not(:focus) { border-color: var(--ink-2); }
:where(select, textarea, input:not([type="checkbox"], [type="radio"], [type="range"])):focus-visible {
  outline: none; border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent);
}
:where(input, textarea)::placeholder { color: var(--ink-2); opacity: 1; }
:where(select, textarea, input):disabled { opacity: .5; cursor: not-allowed; }
.select { display: inline-flex; align-items: center; gap: 8px; min-height: var(--h-input); padding: 0 8px 0 12px;
          border: 1px solid var(--line-strong); border-radius: var(--r-xs); background-color: var(--surface);
          color: var(--ink); font: 400 var(--t-base)/1 var(--sans); white-space: nowrap; cursor: pointer;
          transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.select-lb { color: var(--ink-2); }
.select-v { font-weight: 500; }
.select > .ic { width: 18px; height: 18px; color: var(--ink-2); transition: transform var(--dur) var(--ease); }
.select[aria-expanded="true"] { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.select[aria-expanded="true"] > .ic { transform: rotate(180deg); }
.select:disabled { opacity: .38; cursor: not-allowed; }

/* ───────────── 12. 弹出菜单 / 二级菜单（position: fixed，不会被表格裁掉） ───────────── */
.menu { position: fixed; z-index: var(--z-menu); min-width: 220px; max-width: 320px; padding: 8px 0;
        background: var(--surface); border-radius: var(--r-sm); box-shadow: var(--sh-2); animation: sys-menu-in 160ms var(--ease); }
@keyframes sys-menu-in { from { opacity: 0; transform: translateY(-4px); } }
.menu > button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 0 16px; border: 0;
                 background-color: transparent; color: var(--ink); font: 400 var(--t-base)/1.3 var(--sans); text-align: left; cursor: pointer; }
.menu > button > .ic { width: 20px; height: 20px; color: var(--ink-2); }
.menu-ck { visibility: hidden; color: var(--accent-ink) !important; }
.menu [aria-selected="true"] .menu-ck, .menu [aria-checked="true"] .menu-ck { visibility: visible; }
.menu [aria-selected="true"], .menu [aria-checked="true"] { font-weight: 500; }
.menu-n { margin-left: auto; font: 400 var(--t-xs)/1 var(--mono); color: var(--ink-3); }
.menu-hint { margin-left: auto; padding-left: 16px; font-size: var(--t-xs); color: var(--ink-3); }
.menu-chev { margin-left: auto; width: 18px !important; }
.menu hr { border: 0; border-top: 1px solid var(--line); margin: 6px 0; }
.menu-hd { margin: 0; padding: 6px 16px 8px; font-size: var(--t-xs); color: var(--ink-2); }
.menu-danger, .menu-danger > .ic { color: var(--crit-ink) !important; }
.menu [aria-disabled="true"] { opacity: .38; cursor: not-allowed; }
.menu [aria-expanded="true"] { --sl: 9%; }

/* ───────────── 13. 卡片 / 提示条 ───────────── */
.card, .cs-card, .daily-plan .dp-card {
  border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); box-shadow: none;
}
.card-filled { border: 0; background: var(--surface-2); }
/* 提示条：整块浅色底，不用左侧色条 */
.cs-banner, .fl-mode {
  display: flex; align-items: flex-start; gap: var(--s2); padding: 12px var(--s4); border: 0; border-radius: var(--r-md);
  background: var(--surface-2); color: var(--ink); font-size: var(--t-sm); line-height: 1.6;
}
.fl-mode { align-items: center; }
.daily-plan.dp-v3 .dp-auto-online { border: 0; border-radius: var(--r-md); background: var(--surface-2); }
.daily-plan.dp-v3 .dp-auto-online[data-tone="ok"] { background: var(--ok-soft); }
.daily-plan.dp-v3 .dp-auto-online[data-tone="warn"] { background: var(--warn-soft); }
.daily-plan.dp-v3 .dp-auto-online[data-tone="crit"] { background: var(--crit-soft); }
.cs-banner[data-s="crit"], .fl-mode[data-tone="crit"] { background: var(--crit-soft); color: var(--crit-ink); }
.cs-banner[data-s="warn"], .fl-mode[data-tone="warn"] { background: var(--warn-soft); color: var(--warn-ink); }
.fl-mode[data-tone="crit"] .fl-mode-t { color: var(--crit-ink); }
.fl-mode[data-tone="warn"] .fl-mode-t { color: var(--warn-ink); }
.fl-mode[data-tone="ok"] { background: var(--ok-soft); }
.fl-mode[data-tone="ok"] .fl-mode-t { color: var(--ok-ink); }
.fl-mode[data-tone="idle"] { background: var(--surface-2); }

/* ───────────── 14. 表格 ───────────── */
table.tbl { width: 100%; border-collapse: separate; border-spacing: 0; }
.tbl thead th {
  height: var(--h-th); padding: 0 var(--s4) 0 0; text-align: left; vertical-align: middle;
  font: 500 var(--t-sm)/1.2 var(--sans); color: var(--ink-2); border-bottom: 1px solid var(--line); white-space: nowrap;
}
.tbl tbody td { height: var(--h-row); padding: 6px var(--s4) 6px 0; border-bottom: 1px solid var(--line-2); font-size: var(--t-base); vertical-align: middle; }
.tbl :is(thead th, tbody td):first-child { padding-left: var(--s3); }
.tbl :is(thead th, tbody td):last-child { padding-right: var(--s3); }
.tbl-card .tbl :is(thead th, tbody td):first-child { padding-left: var(--s4); }
.tbl-card .tbl :is(thead th, tbody td):last-child { padding-right: var(--s4); }
.tbl tbody tr:hover { background: var(--row-hover); }
.tbl tbody tr[aria-selected="true"] { background: var(--row-sel); }
.tbl .sub, .td-dim { font-size: var(--t-sm); color: var(--ink-2); }
.td-sn { font-family: var(--mono); font-weight: 600; }
.tbl-card { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); overflow: hidden; }
.tbl-card .tbl tbody tr:last-child td { border-bottom: 0; }
.toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: var(--s4); border-bottom: 1px solid var(--line-2); }

/* ───────────── 15. 空状态 / 加载 ───────────── */
.empty, .daily-plan .dp-empty {
  display: flex; flex-direction: column; align-items: center; gap: var(--s2); padding: var(--s7) var(--s5); text-align: center;
  border: 1px dashed var(--line-strong); border-radius: var(--r-md); background: transparent;
}
.empty-t { font: 500 var(--t-md)/1.4 var(--sans); }
.empty-d { max-width: 50ch; font-size: var(--t-sm); line-height: 1.7; color: var(--ink-2); }
.empty-tag { padding: 4px 10px; border: 0; border-radius: var(--r-full); background: var(--surface-2); font: 400 var(--t-xs)/1 var(--mono); color: var(--ink-2); }
.cs-empty, .ac-empty { color: var(--ink-2); font-size: var(--t-sm); }
.sk { background: var(--surface-3); border-radius: var(--r-xs); }

/* ───────────── 16. 抽屉 / 确认框 / 提示 ───────────── */
.drawer-backdrop { background: var(--scrim); }
.drawer { background: var(--surface-2); border-left: 0; box-shadow: var(--sh-1); }
.drawer-head { border-bottom: 1px solid var(--line); }
.drawer-title { font: 500 var(--t-lg)/1.25 var(--sans); }
.drawer-sub { color: var(--ink-2); }
.confirm-root .confirm { border: 0; border-radius: var(--r-xl); background: var(--surface-2); padding: var(--s5); box-shadow: var(--sh-3); }
.confirm-title { font: 400 var(--t-lg)/1.3 var(--sans); }
.confirm-body { font-size: var(--t-base); color: var(--ink-2); }
.toast { border-radius: var(--r-xs); background: var(--ink); color: var(--on-ink); box-shadow: var(--sh-3); font-size: var(--t-base); }
.toast[data-s="bad"] { background: var(--crit); color: oklch(0.99 0 0); }

/* ───────────── 17. 页面通用排版（只调字号字重与分隔线，结构不动） ───────────── */
.lede { padding: var(--s5) 0; border-bottom: 1px solid var(--line-2); }
.lede h1 { font: 400 var(--t-xl)/1.3 var(--sans); letter-spacing: 0; max-width: 28ch; }
.lede h1 u { font-weight: 500; }
.lede p { margin-top: var(--s2); color: var(--ink-2); font-size: var(--t-base); line-height: 1.7; max-width: 60ch; }
.kicker { font: 500 var(--t-sm)/1.4 var(--sans); color: var(--ink-2); margin: 0 0 var(--s2); }
.cs-h1 { font: 400 var(--t-xl)/1.3 var(--sans); letter-spacing: 0; }
.daily-plan h1 { font-weight: 400; letter-spacing: 0; }
/* 旧版「报纸」式的 2px 黑粗线换成 1px 分隔线 */
.block, .navpanel, .sched-sec, .mat-sec, .upd-sec { border-top: 1px solid var(--line); }

/* ═════════════ 18. 外壳 ═════════════ */
.shell { display: grid; grid-template-columns: var(--shell-left) minmax(0, 1fr); min-height: 100vh; min-height: 100dvh; }
.shell-main { min-width: 0; display: flex; flex-direction: column; }
.main { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 var(--s6); }

/* ── 左侧导航 ── */
.sidenav {
  position: sticky; top: 0; z-index: var(--z-sticky); height: 100vh; height: 100dvh; min-width: 0;
  display: flex; flex-direction: column; gap: 2px; padding: 12px;
  background: var(--surface-2); overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: thin; scrollbar-color: var(--line) transparent;
}
.sn-brand { display: flex; align-items: center; gap: 12px; flex: none; height: 56px; padding: 0 12px; margin-bottom: 4px;
            border-radius: var(--r-full); color: var(--ink); }
.brand-mark { width: 30px; height: 30px; border-radius: 9px; display: inline-grid; place-items: center; flex: none; background: var(--logo); }
.brand-mark::after { content: "中"; color: oklch(1 0 0); font: 600 15px/1 var(--sans); }
.brand-name { font: 500 18px/1 var(--sans); letter-spacing: 0.01em; white-space: nowrap; }
.sn-nav { display: flex; flex-direction: column; gap: 2px; margin-bottom: var(--s3); }
.sn-gh { display: flex; align-items: center; gap: 8px; width: 100%; height: 36px; margin-top: 8px; padding: 0 12px 0 16px;
         border: 0; border-radius: var(--r-sm); background: transparent; color: var(--ink-2);
         font: 500 var(--t-sm)/1 var(--sans); text-align: left; cursor: pointer;
         transition: color var(--dur) var(--ease), background-color var(--dur) var(--ease); }
.sn-gh:hover { color: var(--ink); background-color: color-mix(in oklab, currentColor 6%, transparent); }
.sn-gh-t { flex: 1; min-width: 0; }
.sn-gh-n { font: 400 var(--t-xs)/1 var(--sans); color: var(--ink-3); }
.sn-group[data-open="true"] .sn-gh-n { display: none; }
.sn-chev { width: 16px !important; height: 16px !important; transition: transform var(--dur) var(--ease); }
.sn-group[data-open="false"] .sn-chev { transform: rotate(-90deg); }
.sn-group[data-open="false"] > .sn-sub { display: none; }
.sn-sub { display: flex; flex-direction: column; gap: 2px; }
.sn-item {
  position: relative; display: flex; align-items: center; gap: 12px; width: 100%; height: 44px; padding: 0 16px;
  border: 0; border-radius: var(--r-full); background-color: transparent; color: var(--ink-2);
  font: 500 var(--t-base)/1 var(--sans); text-align: left; white-space: nowrap; cursor: pointer;
  transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.sn-item:hover { color: var(--ink); }
.sn-item[aria-current="page"], .sn-item[aria-expanded="true"] { background-color: var(--accent-soft); color: var(--accent-ink); font-weight: 600; }
.sn-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.sn-n { font: 400 var(--t-xs)/1 var(--mono); color: var(--ink-3); }
.sn-item[aria-current="page"] .sn-n { color: var(--accent-ink); }
.sn-badge { min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--r-full); background: var(--warn-soft); color: var(--warn-ink);
            font: 600 11.5px/20px var(--mono); text-align: center; }
.sn-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex: none;
           margin-top: auto; padding: 12px 0 0 12px; border-top: 1px solid var(--line); }
.sn-foot-lb { font-size: var(--t-sm); color: var(--ink-2); }

/* ── 顶部应用栏（电脑 / 平板） ── */
.masthead {
  position: sticky; top: 0; z-index: var(--z-sticky); display: flex; align-items: center; gap: 12px;
  height: var(--appbar-h); padding: 0 var(--s6); background: var(--bg); border-bottom: 1px solid transparent;
  backdrop-filter: none; -webkit-backdrop-filter: none;
  transition: border-color var(--dur) var(--ease);
}
.masthead[data-scrolled="true"] { border-bottom-color: var(--line); }
.mast-title { flex: 1; min-width: 0; display: flex; align-items: center; gap: 4px; color: var(--ink-2); font-size: var(--t-base); }
.crumb-g { white-space: nowrap; }
.crumb-sep { width: 16px !important; height: 16px !important; color: var(--ink-3); }
.crumb-p { min-width: 0; margin: 0; color: var(--ink); font: 500 15px/1.3 var(--sans); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mast-date { display: none; }
.conn { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px; flex: none;
        border-radius: var(--r-full); background: var(--surface-2); color: var(--ink-2);
        font: 500 var(--t-sm)/1 var(--sans); white-space: nowrap; }
.conn-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--idle); flex: none; }
.conn[data-state="live"] { background: var(--ok-soft); color: var(--ok-ink); }
.conn[data-state="live"] .conn-dot { background: var(--ok); animation: none; }
.conn[data-state="connecting"] .conn-dot { background: var(--warn); animation: pulse 1.2s var(--ease) infinite; }
.conn[data-state="down"] { background: var(--warn-soft); color: var(--warn-ink); }
.conn[data-state="down"] .conn-dot { background: var(--crit); }
.conn .stamp { padding-left: 8px; border-left: 1px solid color-mix(in oklab, currentColor 30%, transparent);
               font: 400 var(--t-xs)/1 var(--mono); color: inherit; opacity: .85; }
.stamp:empty { display: none; }
.mast-right { display: flex; align-items: center; gap: 4px; flex: none; }
.mast-right #haltAllBtn { margin-left: 8px; }
.mast-right #haltAllBtn .sic { width: 18px; height: 18px; margin-left: -4px; }
/* 动作台入口改在左侧导航（电脑）和底栏（手机）；action-console.js 仍把老按钮插进这里，藏起来当「开关」用 */
.masthead #acEntry { display: none; }
.theme-ic-sun { display: none; }
:root[data-theme="dark"] .theme-ic-sun { display: block; }
:root[data-theme="dark"] .theme-ic-moon { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-ic-sun { display: block; }
  :root:not([data-theme="light"]) .theme-ic-moon { display: none; }
}
#refreshBtn[aria-busy="true"] .sic { animation: shell-spin 900ms linear infinite; }
@keyframes shell-spin { to { transform: rotate(360deg); } }

/* ── 「更多」底部弹层（手机） ── */
.sheet-root { position: fixed; inset: 0; z-index: var(--z-modal); }
.sheet-root > .scrim { position: absolute; inset: 0; background: var(--scrim); animation: sys-fade 200ms var(--ease); }
.sheet { position: absolute; left: 0; right: 0; bottom: 0; max-height: 88vh; max-height: 88dvh; display: flex; flex-direction: column;
         margin: 0 auto; max-width: 640px; background: var(--surface-2); border-radius: var(--r-xl) var(--r-xl) 0 0; outline: 0;
         box-shadow: var(--sh-1); animation: sys-sheet-in 280ms var(--ease); }
.sheet-handle { flex: none; width: 32px; height: 4px; margin: 14px auto 6px; border-radius: 2px; background: var(--ink-2); opacity: .45; }
.sheet-hd { display: flex; align-items: center; gap: 4px; flex: none; min-height: 52px; padding: 0 8px 0 24px; }
.sheet-hd h2 { flex: 1; font: 400 20px/1.3 var(--sans); }
.sheet-body { padding: 0 24px 16px; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; }
.sheet-ft { display: flex; gap: 12px; padding: 12px 24px calc(24px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line-2); }
.sheet-ft .btn { flex: 1; }
.more-list { gap: 2px; padding: 0 12px calc(20px + env(safe-area-inset-bottom)); }
.more-gh { margin: 14px 12px 4px; font: 500 var(--t-sm)/1.3 var(--sans); color: var(--ink-2); }
.more-gh:first-child { margin-top: 2px; }
.more-item { display: flex; align-items: center; gap: 16px; min-height: 60px; padding: 8px 12px; border-radius: var(--r-md);
             background-color: transparent; color: var(--ink); }
.more-item .sic { width: 24px; height: 24px; color: var(--ink-2); }
.more-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.more-t { font: 500 15px/1.3 var(--sans); }
.more-d { font-size: 12.5px; line-height: 1.4; color: var(--ink-2); }
.more-item[aria-current="page"] { background-color: var(--accent-soft); color: var(--accent-ink); }
.more-item[aria-current="page"] :is(.sic, .more-d) { color: var(--accent-ink); }
.more-list .seg { margin: 4px 0 0; }
.more-list .seg > button { min-height: 48px; }
html.is-sheet-open { overflow: hidden; }
@keyframes sys-fade { from { opacity: 0; } }
@keyframes sys-sheet-in { from { transform: translateY(24px); opacity: 0; } }

/* 底部导航：电脑和平板不显示 */
.tabbar { display: none; }

/* 悬浮按钮（加长型）/ 底部固定操作条：给页面那几路用 */
.fab { position: fixed; z-index: var(--z-fab); right: 16px; bottom: calc(var(--tabbar-h) + 16px + env(safe-area-inset-bottom));
       display: inline-flex; align-items: center; gap: 12px; height: 56px; padding: 0 20px 0 16px; border: 0; border-radius: var(--r-lg);
       background-color: var(--fab-bg); color: var(--fab-ink); font: 500 15px/1 var(--sans); box-shadow: var(--sh-3); cursor: pointer; }
.fab .ic { width: 22px; height: 22px; }
.actionbar { position: fixed; z-index: var(--z-sticky); left: var(--shell-left); right: 0; bottom: 0;
             display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--surface-2); border-top: 1px solid var(--line); }
.actionbar .btn-primary { min-height: var(--h-btn-lg); padding: 0 32px; font-size: var(--t-md); }

/* ── 图标栏（rail）：平板宽度（721–1023）自动用；电脑上点侧栏顶上的按钮也能收成它（记在本机），
   给手机安排、手机总表这类宽表格让出地方。两段规则内容相同，只是生效条件不同 ── */
.sn-top { display: flex; align-items: center; gap: 4px; flex: none; margin-bottom: 4px; }
.sn-top .sn-brand { flex: 1; min-width: 0; margin-bottom: 0; }
.sn-toggle { flex: none; }
/* 它的 aria-expanded 表示「侧栏展开着」，不是「菜单开着」：别套用按下态底色 */
.btn.sn-toggle[aria-expanded="true"] { --sl: 0%; }
.btn.sn-toggle:hover { --sl: 7%; }
.btn.sn-toggle:active { --sl: 12%; }
@media (max-width: 1023px) { .sn-toggle { display: none; } }
@media (min-width: 721px) and (max-width: 1023px) {
  .sidenav { padding: 8px 6px 16px; scrollbar-width: none; }
  .sidenav::-webkit-scrollbar { display: none; }
  .sn-top { flex-direction: column; gap: 2px; margin-bottom: 2px; }
  .sn-top .sn-brand { flex: none; justify-content: center; width: 100%; height: 52px; padding: 0; }
  .sn-brand .brand-name { display: none; }
  .sn-gh, .sn-foot { display: none; }
  .sn-group > .sn-sub, .sn-group[data-open="false"] > .sn-sub { display: flex; }
  .sn-group + .sn-group { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line); }
  .sn-item { flex-direction: column; justify-content: center; gap: 4px; height: auto; min-height: 54px; padding: 4px 0; border-radius: var(--r-md); font-size: 11.5px; font-weight: 500; line-height: 1.2; text-align: center; }
  .sn-item .sic { box-sizing: content-box; width: 22px; height: 22px; padding: 4px 16px; border-radius: var(--r-full); transition: background-color var(--dur) var(--ease); }
  .sn-item[aria-current="page"], .sn-item[aria-expanded="true"] { background-color: transparent; color: var(--ink); font-weight: 600; }
  .sn-item[aria-current="page"] .sic, .sn-item[aria-expanded="true"] .sic { background: var(--accent-soft); color: var(--accent-ink); }
  .sn-t { flex: none; overflow: visible; }
  .sn-n { display: none; }
  .sn-badge { position: absolute; top: 2px; left: calc(50% + 6px); min-width: 16px; height: 16px; padding: 0 4px; font-size: 10.5px; line-height: 16px; }
  .masthead { padding: 0 var(--s5); }
  .main { padding: 0 var(--s5); }
}
@media (min-width: 1024px) {
  :root[data-nav="rail"] { --shell-left: var(--rail-w); }
  :root[data-nav="rail"] .sidenav { padding: 8px 6px 16px; scrollbar-width: none; }
  :root[data-nav="rail"] .sidenav::-webkit-scrollbar { display: none; }
  :root[data-nav="rail"] .sn-top { flex-direction: column; gap: 2px; margin-bottom: 2px; }
  :root[data-nav="rail"] .sn-top .sn-brand { flex: none; justify-content: center; width: 100%; height: 52px; padding: 0; }
  :root[data-nav="rail"] .sn-brand .brand-name { display: none; }
  :root[data-nav="rail"] .sn-gh, :root[data-nav="rail"] .sn-foot { display: none; }
  :root[data-nav="rail"] .sn-group > .sn-sub, :root[data-nav="rail"] .sn-group[data-open="false"] > .sn-sub { display: flex; }
  :root[data-nav="rail"] .sn-group + .sn-group { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line); }
  :root[data-nav="rail"] .sn-item { flex-direction: column; justify-content: center; gap: 4px; height: auto; min-height: 54px; padding: 4px 0; border-radius: var(--r-md); font-size: 11.5px; font-weight: 500; line-height: 1.2; text-align: center; }
  :root[data-nav="rail"] .sn-item .sic { box-sizing: content-box; width: 22px; height: 22px; padding: 4px 16px; border-radius: var(--r-full); transition: background-color var(--dur) var(--ease); }
  :root[data-nav="rail"] .sn-item[aria-current="page"], :root[data-nav="rail"] .sn-item[aria-expanded="true"] { background-color: transparent; color: var(--ink); font-weight: 600; }
  :root[data-nav="rail"] .sn-item[aria-current="page"] .sic, :root[data-nav="rail"] .sn-item[aria-expanded="true"] .sic { background: var(--accent-soft); color: var(--accent-ink); }
  :root[data-nav="rail"] .sn-t { flex: none; overflow: visible; }
  :root[data-nav="rail"] .sn-n { display: none; }
  :root[data-nav="rail"] .sn-badge { position: absolute; top: 2px; left: calc(50% + 6px); min-width: 16px; height: 16px; padding: 0 4px; font-size: 10.5px; line-height: 16px; }
}

/* ── 手机（≤720）：顶部应用栏 + 底部导航 5 项 ── */
@media (max-width: 720px) {
  body { background: var(--bg); }
  .shell { display: block; }
  .sidenav { display: none; }
  .masthead {
    display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "title title right" "date conn right";
    align-items: center; column-gap: 8px; row-gap: 0;
    height: auto; min-height: var(--appbar-h); padding: calc(8px + env(safe-area-inset-top)) 4px 8px 16px;
    background: var(--bg); border-bottom: 1px solid transparent;
  }
  .mast-title { grid-area: title; align-self: end; }
  .crumb-g, .crumb-sep { display: none; }
  .crumb-p { font: 400 var(--t-lg)/1.25 var(--sans); }
  .mast-date { grid-area: date; display: block; margin: 0; font-size: var(--t-xs); line-height: 18px; color: var(--ink-2); white-space: nowrap; align-self: start; }
  .mast-date:not(:empty)::after { content: "·"; margin-left: 8px; color: var(--ink-3); }
  .conn { grid-area: conn; justify-self: start; align-self: start; height: 18px; padding: 0; gap: 5px;
          background: transparent !important; color: var(--ink-2); font: 400 var(--t-xs)/18px var(--sans); }
  .conn[data-state="down"] { color: var(--warn-ink); }
  .conn[data-state="live"] { color: var(--ok-ink); }
  .conn-dot { width: 7px; height: 7px; }
  .conn-text { display: inline; }
  .conn .stamp { display: none; }
  .mast-right { grid-area: right; gap: 0; }
  .masthead .btn-icon { width: 48px; min-height: 48px; }
  .mast-right #haltAllBtn { position: relative; min-height: 36px; margin-left: 4px; padding: 0 12px; font-size: var(--t-sm); }
  .mast-right #haltAllBtn::after { content: ""; position: absolute; inset: -6px -2px; }   /* 点击区补到 48px */
  .halt-pre { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

  .main { padding: 0 var(--s4); }
  .view { padding-bottom: calc(var(--tabbar-h) + 24px + env(safe-area-inset-bottom)); }

  .tabbar {
    position: fixed; z-index: var(--z-sticky); left: 0; right: 0; bottom: 0;
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
    height: calc(var(--tabbar-h) + env(safe-area-inset-bottom)); padding: 0 4px env(safe-area-inset-bottom);
    background: var(--tabbar-bg); border-top: 0; backdrop-filter: none; -webkit-backdrop-filter: none;
  }
  .tab { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-width: 0;
         height: var(--tabbar-h); min-height: 48px; margin: 0; padding: 0; border: 0; background: none;
         color: var(--ink-2); font: 500 var(--t-xs)/16px var(--sans); cursor: pointer; }
  .tab-ic { position: relative; display: grid; place-items: center; width: 64px; max-width: 100%; height: 32px;
            border-radius: var(--r-full); transition: background-color var(--dur) var(--ease); }
  .tab .tab-ic .sic { width: 24px; height: 24px; }
  .tab-t { white-space: nowrap; }
  .tab:hover:not([aria-current="page"]) .tab-ic { background-color: color-mix(in oklab, currentColor 8%, transparent); }
  .tab:active .tab-ic { background-color: color-mix(in oklab, currentColor 12%, transparent); }
  .tab[aria-current="page"], .tab[aria-expanded="true"] { color: var(--ink); font-weight: 600; }
  .tab[aria-current="page"] .tab-ic, .tab[aria-expanded="true"] .tab-ic { background: var(--accent-soft); color: var(--accent-ink); }
  .tab-badge { position: absolute; top: 0; left: calc(50% + 4px); min-width: 16px; height: 16px; padding: 0 4px; border-radius: var(--r-full);
               background: var(--warn); color: oklch(0.2 0.03 70); font: 700 10.5px/16px var(--mono); text-align: center; }

  .toasts { left: var(--s4); right: var(--s4); bottom: calc(var(--tabbar-h) + 12px + env(safe-area-inset-bottom)); }
  .fab { right: 16px; }
  .actionbar { left: 0; bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom)); }

  /* 页面通用：结论卡不再套框（页名已在顶栏），卡片列表一台一张 */
  .lede { margin-top: 0; padding: var(--s2) 0 var(--s4); border: 0; border-radius: 0; background: transparent; }
  .lede h1 { font: 500 20px/1.35 var(--sans); }
  .lede p { font-size: var(--t-base); }
  .dcard { border: 0; border-radius: var(--r-md) !important; background-color: var(--surface-2); margin-bottom: 8px; min-height: 72px; }
  .empty { background: transparent; border-radius: var(--r-md); }
  .item[data-t="crit"] .no { background: var(--crit-soft); color: var(--crit-ink); }
  /* 抽屉在手机上变成底部弹层 */
  .drawer { top: auto; bottom: 0; height: auto; max-height: 92dvh; border-radius: var(--r-xl) var(--r-xl) 0 0; animation: sys-sheet-in 280ms var(--ease); }
  .drawer::before { content: ""; display: block; width: 32px; height: 4px; margin: 12px auto 0; border-radius: 2px; background: var(--ink-2); opacity: .45; }
  .daily-plan.dp-v3 .dp-sheet-backdrop { place-items: end stretch; padding: 0; }
  .daily-plan.dp-v3 .dp-sheet { width: 100%; max-height: 90dvh; border-radius: var(--r-xl) var(--r-xl) 0 0; }
  /* 勾选后的批量条贴在底栏上面，拇指够得着 */
  .fl-batch { position: fixed; z-index: var(--z-sticky); left: 0; right: 0; bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom));
              margin: 0; padding: 12px 16px; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: var(--surface-2); }

  /* iPhone 上输入框字号小于 16px 一点就会自动放大整页：一律 16px */
  input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], [type="button"], [type="submit"], [type="reset"], [type="image"], [type="hidden"]),
  select, textarea { font-size: 16px !important; }
}

/* ═════════════ 19. 与页面衔接（只调位置 / 颜色，不动逻辑） ═════════════ */
/* 手机安排的固定保存条：让开左侧导航；手机上让开 80px 的新底栏 */
.daily-plan .dp-footer { left: var(--shell-left); }
.daily-plan.dp-v3 .dp-sheet { border: 0; border-radius: var(--r-xl); background: var(--surface-2); box-shadow: var(--sh-3); }
.daily-plan.dp-v3 .dp-sheet-backdrop { background: var(--scrim); }
@media (max-width: 720px) {
  .daily-plan .dp-footer { bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom)); }
  .daily-plan.dp-v3 { padding-bottom: calc(var(--dp-footer-height, 160px) + var(--tabbar-h) + env(safe-area-inset-bottom) + var(--dp-footer-gap)); }
  .daily-plan.dp-v3 .dp-footer.dp-footer-compact { bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom)); }
}
/* 手机安排的时间条：工作 / 休息 / 睡觉用作息色（旧写法 in oklch 混出粉色） */
.daily-plan.dp-v3 .dp-kind-work  { --dp-period-fill: var(--k-work);  border-color: color-mix(in oklab, var(--accent) 55%, var(--line)); }
.daily-plan.dp-v3 .dp-kind-rest  { --dp-period-fill: var(--k-rest);  border-color: color-mix(in oklab, var(--k-rest-ink) 45%, var(--line)); }
.daily-plan.dp-v3 .dp-kind-sleep { --dp-period-fill: var(--k-sleep); border-color: var(--line-strong); }
.daily-plan.dp-v3 .dp-kind-off   { --dp-period-fill: var(--surface); border-color: var(--line); }
#planEmergency { background: var(--bg); border-bottom-color: var(--line); }
/* 手机总表的批量条吸顶时让开顶栏 */
.fl-batch { top: var(--appbar-h); }

/* 任务页：外壳多了左侧导航，内容区变窄；窄到排不下七列（约 900px）就改用手机那套两列堆叠，不让整页横滚 */
.tasklist { container-type: inline-size; }
@container (max-width: 900px) {
  .task-head { display: none; }
  .task-row { grid-template-columns: 1fr auto; grid-template-areas: "dev status" "kind conf" "pages pages" "time thumb"; gap: var(--s2) var(--s3); }
  .t-status { justify-self: end; text-align: right; }
  .t-conf, .t-thumb { justify-self: end; }
  .t-pages { flex-wrap: wrap; white-space: normal; }
}

/* 旧页面里 color-mix(in oklch, 状态色, 中性色) 沿色相环绕远路，混出紫 / 粉：按 soft 令牌与 oklab 改写 */
.task-row[data-held="1"] { box-shadow: none; background: var(--warn-soft); }
.sched-err, .mat-err, .ov-halt-done { border-color: color-mix(in oklab, var(--crit) 35%, var(--line)); background: var(--crit-soft); }
.sched-state[data-s="live"] { border-color: color-mix(in oklab, var(--ok) 40%, var(--line)); background: var(--ok-soft); }
.sched-state[data-s="halt"] { border-color: color-mix(in oklab, var(--crit) 45%, var(--line)); background: var(--crit-soft); }
.dec-dry, .feat-tag, .mat-tag, .sc-tag[data-b="warn"], .ov-band-chip[data-b="watch"] { border-color: color-mix(in oklab, var(--warn) 50%, var(--line)); }
.ov-band-chip[data-b="healthy"] { border-color: color-mix(in oklab, var(--ok) 45%, var(--line)); }
.ov-band-chip[data-b="restricted"] { border-color: color-mix(in oklab, var(--crit) 45%, var(--line)); }
.mat-warn { border-color: color-mix(in oklab, var(--warn) 50%, var(--line)); background: var(--warn-soft); }
.acct-chip-vert { border-color: color-mix(in oklab, var(--ink) 25%, var(--line)); }
.sch-plan-seg, .sch-plan-leg i { background: color-mix(in oklab, var(--ok) 20%, transparent); }
.ov-issue-err { background: var(--warn-soft); }
.ac-entry-dot { box-shadow: 0 0 0 3px var(--ok-soft); }
.ac-notready { border-left: 0; background: var(--warn-soft); }

/* 状态色直接当字（color: var(--warn) / var(--ok)）在浅底上对比度不够：统一换成 -ink。
   前面加 :root 抬一级，盖得住页面脚本后注入的同名规则 */
:root .ac-notready, :root .ac-msg-warn, :root .nav-fail, :root .dec-dry, :root .feat-tag, :root .mat-tag,
:root .mat-warn, :root .acct-band[data-s="warn"] .st-txt, :root .ov-issue-err, :root .ov-band[data-b="watch"] .ov-band-n,
:root .ov-band-chip[data-b="watch"], :root .ov-patrol[data-s="warn"] .ov-patrol-v, :root .ov-patrol-note,
:root .acct-batch-warn, :root .lead-due-on, :root .lead-over, :root .sc-tag[data-b="warn"],
:root .sc-row[data-s="warn"] .sc-row-k, :root .sc-row[data-s="warn"] .sc-row-v, :root .cs-warn-t,
:root .daily-plan .dp-warn, :root .daily-plan.dp-v3 .dp-card-warnings > summary { color: var(--warn-ink); }
:root .nav-ok, :root .dec-i[data-a="start"] .dec-a, :root .sched-saved, :root .mat-res-i[data-s="ok"] .mat-res-m,
:root .mat-st[data-s="ok"] .mat-st-txt, :root .acct-band[data-s="ok"] .st-txt, :root .ov-band[data-b="healthy"] .ov-band-n,
:root .ov-band-chip[data-b="healthy"], :root .ov-patrol[data-s="ok"] .ov-patrol-v, :root .daily-plan .dp-ok { color: var(--ok-ink); }
:root .mat-st[data-s="live"] .mat-st-txt { color: var(--accent-ink); }
/* 红字（--crit）当小字写在浅红 / 浅黄底上不够 4.5:1：小字一律 --crit-ink；大号数字仍用 --crit */
:root .ac-req, :root .ac-dev-sum.ac-dev-none .ac-dev-sum-count, :root .sched-err, :root .sched-note.sched-bad,
:root .feat-msg, :root .mat-err, :root .mat-res-i[data-s="crit"] .mat-res-m,
:root .mat-st[data-s="crit"] .mat-st-txt, :root .acct-band[data-s="crit"] .st-txt, :root .cnt-vmsg,
:root .ov-band-chip[data-b="restricted"], :root .ov-halt-txt, :root .acct-today-over, :root .acct-batch-crit,
:root .acct-batch-halt, :root .mat-library .mat-device[data-s="crit"], :root .cs-crit-t, :root .daily-plan .dp-crit,
:root .kn-count[data-over="1"], :root .kn-err, :root .vt-err, :root .vt-cardmsg { color: var(--crit-ink); }
/* 链接原来用焦点蓝（--focus），落在浅色状态底上对比度不够：改用主色 */
:root .acct-link, :root .ov-issue-go, :root .ov-link, :root .fl-go, :root .daily-plan.dp-v3 .dp-auto-link,
:root .ac-link, :root .ac-back { color: var(--accent); }

/* ───────────── 20. 减少动态效果 ───────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; }
}