/* SDZ Web App 页面样式（HUI-2824，app.html 专用追加层）。
 *
 * 纪律：
 *   - 只新增 sdz- 前缀类，不改写 style.css / app-shell.css / composer.css 任何既有规则；
 *   - 零新颜色：色值一律引用 style.css :root 令牌（--fg/--muted/--bg/--card/
 *     --border/--accent/--accent-dark/--accent-tint/--danger/--ok）；
 *   - 动效一律引用 motion.css 令牌（--sdz-motion-*/--sdz-ease-*），var() 不带
 *     字面量 fallback（SDZ-F2 收口：冻结值只在 motion.css 物化一次，token 缺失
 *     时声明按 unset 降级为无过渡，功能不受损）；
 *   - 布局变换统一用 width/opacity/visibility（app-shell.css 约定），不用独立变换属性；
 *   - 浏览器基线：现代常青浏览器（Chrome/Safari/Firefox 最近两年）。
 */

/* ---------- 登录面 ---------- */
.sdz-auth { max-width: 460px; margin: 8vh auto 0; }
.sdz-auth-foot { margin-top: 16px; }

/* ---------- Shell 布局（app-shell.css 的 .sdz-shell/.sdz-rail 骨架内） ---------- */
.sdz-rail {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px 12px;
  background: var(--card);
  border-right: 1px solid var(--border);
}
.sdz-rail__brand { display: flex; align-items: center; gap: 8px; padding: 0 4px; }
.sdz-rail__brandname { font-weight: 700; }
.sdz-rail__items { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.sdz-rail__foot { display: flex; align-items: center; gap: 8px; }

/* 折叠：标签淡出（app-shell.css 头注「标签由页面层淡出」——页面层挂类实现）。 */
.sdz-rail--collapsed .sdz-rail__label,
.sdz-rail--collapsed .sdz-rail__brandname {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity var(--sdz-motion-fast) var(--sdz-ease-standard),
    visibility 0s linear var(--sdz-motion-fast);
}
.sdz-rail__label { transition: opacity var(--sdz-motion-fast) var(--sdz-ease-standard); }

.sdz-shell-main { flex: 1; min-width: 0; padding: 0 24px; }
.sdz-face { max-width: 860px; margin: 0 auto; width: 100%; }

/* ---------- 模式切换（Chat | Work） ---------- */
.sdz-mode {
  display: flex;
  gap: 2px;
  padding: 2px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--bg);
}
.sdz-mode__btn {
  flex: 1;
  min-height: 36px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  cursor: pointer;
  transition:
    background var(--sdz-motion-fast) var(--sdz-ease-standard),
    color var(--sdz-motion-fast) var(--sdz-ease-standard);
}
.sdz-mode__btn:hover { color: var(--accent); }
.sdz-mode__btn[data-active="true"] {
  background: var(--card);
  border-color: var(--accent);
  color: var(--accent-dark);
}

/* ---------- Rail 一级项（Projects / Needs You / Account） ---------- */
.sdz-navitem {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: var(--muted);
  text-decoration: none;
  white-space: nowrap;
}
.sdz-navitem:hover { color: var(--accent); background: var(--card); border-color: var(--border); }
.sdz-navitem[data-active="true"] {
  color: var(--accent-dark);
  background: var(--accent-tint);
  border-color: var(--accent);
}
.sdz-rail__en { color: var(--muted); font-size: 0.8em; }
.sdz-navbadge {
  min-width: 22px;
  text-align: center;
  border-radius: 999px;
  padding: 0 7px;
  font-size: 0.78em;
  color: var(--accent-dark);
  background: var(--accent-tint);
  border: 1px solid var(--accent);
}

/* ---------- 四段 Work 桶 ---------- */
.sdz-bucket { margin-top: 16px; }
.sdz-bucket__head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px; }
.sdz-bucket__en { color: var(--muted); font-size: 0.82em; }
.sdz-bucket__count { color: var(--muted); font-size: 0.85em; margin-left: auto; }

.sdz-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.sdz-item:last-child { border-bottom: none; }
.sdz-item__title { font-weight: 600; overflow-wrap: anywhere; }
.sdz-item__meta { color: var(--muted); font-size: 0.82em; width: 100%; }
.sdz-item__guide { color: var(--muted); font-size: 0.84em; }

.sdz-chip {
  display: inline-block;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0 8px;
  font-size: 0.78em;
  color: var(--muted);
  background: var(--bg);
  white-space: nowrap;
}
.sdz-chip--hint {
  border-color: var(--accent);
  color: var(--accent-dark);
  background: var(--accent-tint);
}
.sdz-chip--raw { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
/* 队列托盘四态（Wave G）：sent=绿 / failed=红；色值只引 style.css 令牌，零新色板。 */
.sdz-chip--sent { border-color: var(--ok); color: var(--ok); }
.sdz-chip--failed { border-color: var(--danger); color: var(--danger); }
.sdz-dot--danger { background: var(--danger); flex: 0 0 auto; }

/* ---------- Account 设备段 skills 只读展开行（Wave G T2） ---------- */
.sdz-skills-row > td {
  background: var(--bg);
  border-top: 1px dashed var(--border);
  padding: 8px 6px;
}
.sdz-skills { display: flex; flex-direction: column; gap: 6px; }

.sdz-empty { color: var(--muted); font-size: 0.9em; padding: 6px 0; }

/* ---------- Chat Composer ---------- */
.sdz-composer-card { margin-top: 16px; }
.sdz-composer-pad { display: flex; gap: 10px; align-items: flex-end; }
/* ---------- B-8 运行控制位（Wave C · HUI-2859 P4）：busy composer 上方，
   三语义一排可分辨；steer/stop 置灰=通道未接诚实态；色板零新增（复用令牌）。 */
.sdz-control {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.sdz-control__mode {
  font: inherit;
  font-size: 0.9em;
  padding: 6px 12px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--card);
  color: var(--muted);
  cursor: pointer;
}
.sdz-control__mode[data-active="true"] {
  border-color: var(--accent);
  color: var(--accent-dark);
  background: var(--accent-tint);
}
.sdz-control__mode:disabled { cursor: not-allowed; opacity: 0.55; }
.sdz-control__spacer { flex: 1 1 auto; }
.sdz-control__stop:disabled { cursor: not-allowed; opacity: 0.55; }
.sdz-control__hint {
  margin: 0;
  padding: 6px 0;
  color: var(--muted);
  font-size: 0.85em;
  border-bottom: 1px solid var(--border);
}
textarea.sdz-composer__input {
  font: inherit;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--card);
  color: var(--fg);
  width: 100%;
  min-height: 88px;
}
.sdz-queue { border-bottom: 1px solid var(--border); }
.sdz-queue:empty { border-bottom: none; }
/* 托盘行布局基线在 composer.css（.sdz-queue__item flex 行 / __remove 44px 触达，
 * composer.css:42/51）；此处页面级显式固定同一契约，防装配面单独依赖 app.css
 * 时行布局退化（审查 R1 I-2）。色板零新增。 */
.sdz-queue__item {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
}
.sdz-queue__remove {
  min-width: 44px;
  min-height: 44px;
  flex: 0 0 auto;
}
.sdz-queue__retry {
  min-width: 44px;
  min-height: 44px;
  flex: 0 0 auto;
}
.sdz-queue__content { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sdz-queue__time { color: var(--muted); font-size: 0.8em; white-space: nowrap; }

/* ---------- 移动端：rail 转顶栏横排 ---------- */
@media (max-width: 720px) {
  .sdz-shell { flex-direction: column; }
  .sdz-rail {
    flex-direction: row;
    flex-wrap: wrap; /* 窄屏换行，不把「云电脑」入口推到横向滚动之外 */
    align-items: center;
    width: 100% !important; /* 覆盖 rail 宽度变量：移动端整宽 */
    border-right: none;
    border-bottom: 1px solid var(--border);
    gap: 6px 8px;
  }
  .sdz-rail__brand { flex: 0 0 auto; padding: 0; }
  .sdz-rail__brandname { display: none; } /* 品牌字竖排会挤压入口；移动端只留 logo */
  .sdz-mode { flex: 0 0 auto; }
  .sdz-mode__btn { white-space: nowrap; padding: 0 12px; }
  .sdz-rail__items { flex-direction: row; flex: 1 1 auto; flex-wrap: wrap; gap: 4px; }
  .sdz-navitem { flex: 0 0 auto; min-height: 34px; padding: 4px 10px; }
  .sdz-rail__foot { display: none; } /* 移动端无折叠语义；身份在账户页 */
  .sdz-rail__en, .sdz-rail__foot .hint { display: none; }
  .sdz-shell-main { padding: 0 14px; }
}

/* ---------- Wave B（HUI-2824 消费 HUI-2859）：Work composer 上下文折叠 /
 * 升级确认卡 / 五句 recovery 行 / 托盘句4 提示 ----------
 * 纪律：零新颜色（只引用 style.css :root 令牌）、零动效字面量（motion 纪律）。 */
.sdz-work-context { margin-top: 10px; border-top: 1px solid var(--border); padding-top: 8px; }
.sdz-work-context summary { cursor: pointer; color: var(--muted); font-size: 0.9em; }
.sdz-work-context__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 4px; }
.sdz-upgrade-card h2 { margin-top: 0; }
.sdz-upgrade__row { margin: 4px 0; }
.sdz-item__guide--recovery { display: block; }
.sdz-queue__hint { color: var(--muted); font-size: 0.8em; white-space: nowrap; }

/* ---------- Wave D（HUI-2824 消费 HUI-2859 · 台账 B-12）：验收要素卡 +
 * 批注只读展开容器 ----------
 * 纪律：零新颜色（只引用 style.css :root 令牌）、零动效字面量（motion 纪律）；
 * 只读——容器内由 renderReviewDetailHtml 产出，零 <button>。 */
.sdz-review-detail {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 8px 0 4px 14px;
  padding: 8px 10px;
  border-left: 2px solid var(--border);
}
.sdz-review-detail[hidden] { display: none; }
.sdz-review-detail__head { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.sdz-review-detail__label { font-weight: 600; margin: 6px 0 0; }
.sdz-review-detail__goal { margin: 2px 0; }
.sdz-review-artifact {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 6px 0;
  border-top: 1px dashed var(--border);
}
.sdz-review-artifact > div { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

/* ---------- Wave E（HUI-2824 消费 HUI-2859 · 台账 B-13）：Practice 建议行 +
 * 本地做法库清单 ----------
 * 纪律：零新颜色（只引用 style.css :root 令牌）、零动效字面量（motion 纪律）。 */
.sdz-practice {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-top: 6px;
}
.sdz-practice__ask { font-weight: 600; }
.sdz-practice__form {
  flex: 1 1 100%;
  margin: 4px 0 2px;
  padding: 8px 10px;
  border-left: 2px solid var(--border);
}
.sdz-practice__form[hidden] { display: none; }
.sdz-practice__input { width: 100%; max-width: 480px; }
.sdz-practice__err { color: var(--danger); font-size: 0.85em; }
.sdz-practice__saved { margin: 2px 0; }

/* ---------- Wave F（HUI-2824 消费 HUI-2859 · 台账 B-10）：旁边问问 Side Chat
 * 展开面板 ----------
 * 纪律：零新颜色（只引用 style.css :root 令牌）、零动效字面量（motion 纪律）。
 * 四不默认为结构：容器内由 renderSideChatPanelHtml 产出——零 Queue/Steer/Stop
 * 控件、零改写 Goal/Plan/WorkItem 路径；顶部固定提示常驻首个元素。 */
.sdz-side-chat {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 8px 0 4px 14px;
  padding: 8px 10px;
  border-left: 2px solid var(--border);
}
.sdz-side-chat[hidden] { display: none; }
.sdz-side-chat__notice {
  font-weight: 600;
  margin: 0;
  padding: 6px 8px;
  border-left: 3px solid var(--border);
  background: var(--bg);
}
.sdz-side-chat__anchor { margin: 0; color: var(--muted); font-size: 0.85em; }
.sdz-side-chat__msgs { display: flex; flex-direction: column; gap: 4px; }
.sdz-side-chat__msg { white-space: pre-wrap; word-break: break-word; }
.sdz-side-chat__run { margin: 0; color: var(--muted); font-size: 0.85em; }
.sdz-side-chat__err { color: var(--danger); font-size: 0.85em; margin: 0; }
.sdz-side-chat__err[hidden] { display: none; }
.sdz-side-chat__pad {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: flex-start;
}
.sdz-side-chat__input {
  flex: 1 1 240px;
  min-width: 200px;
  resize: vertical;
}
.sdz-side-chat__exit {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  border-top: 1px dashed var(--border);
  padding-top: 6px;
}
.sdz-side-chat__promote-form {
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 6px 8px;
  border-left: 2px solid var(--border);
}
.sdz-side-chat__promote-form[hidden] { display: none; }
.sdz-side-chat__promote-label {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  font-size: 0.85em;
}
.sdz-side-chat__exit-result { font-size: 0.85em; }

/* ---------- HUI-2926 · W（摘录继承 + 「记成变更」出口）：refs 引用行与变更区段
 * 纪律：零新颜色（只引用 style.css :root 令牌）、零动效字面量（motion 纪律）。
 * excerpt 单行截断省略号；change-zone 用 display:contents 让出口钮与
 * 「记成工作项」同行排布（不改变 flex 布局语义）。 */
.sdz-side-chat__change-zone { display: contents; }
.sdz-side-chat__refs {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 2px;
}
.sdz-side-chat__ref-row {
  display: flex;
  gap: 6px;
  align-items: center;
  min-width: 0;
}
.sdz-side-chat__ref-excerpt {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 0.85em;
}
.sdz-side-chat__change-form {
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: flex-start;
  padding: 6px 8px;
  border-left: 2px solid var(--border);
}
.sdz-side-chat__change-form[hidden] { display: none; }
.sdz-side-chat__change-ref {
  flex: 1 1 100%;
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: 9em;
  overflow-y: auto;
  padding: 4px 6px;
  border-left: 2px solid var(--border);
  color: var(--muted);
  font-size: 0.85em;
}
.sdz-side-chat__ref-line {
  display: flex;
  gap: 6px;
  align-items: baseline;
  min-width: 0;
}

/* ---------- 账户身份（HUI-2920：avatar 圆徽 + 身份卡横排） ----------
   纪律：零新颜色（只引用 style.css :root 令牌）、零动效字面量（motion 纪律）。 */
.sdz-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--accent-tint);
  color: var(--accent-dark);
  border: 1px solid var(--border);
  font-weight: 700;
  line-height: 1;
  user-select: none;
}
.sdz-avatar--rail { width: 24px; height: 24px; font-size: 12px; }
.sdz-identity { display: flex; align-items: center; gap: 12px; }

/* ---------- MB-02 · Bots / 我的计算机 / 屏幕查看器（HUI-3132） ----------
   纪律：沿用 Surface V3 壳与 tokens（HUI-2574 唯一视觉总控）——零新颜色（只引用 style.css :root 令牌）、
   零动效声明（状态一律徽章+时间戳，不做转圈）。 */
/* 壳修正（HUI-3132 走查发现的预存缺陷）：非激活面此前只淡出不脱离文档流，面按纵向堆叠，
   点「项目/账户」后真实内容落在首屏之外（Playwright 实测 y≈2000px）。非激活面不占布局。 */
.sdz-shell-main > .sdz-shell-face[data-face]:not([data-active="true"]) { display: none; }
.mb-badge { display: inline-block; padding: 1px 10px; border-radius: 999px; border: 1px solid var(--border); font-size: 0.88em; font-weight: 600; background: var(--card); }
.mb-badge__en { font-weight: 400; color: var(--muted); font-size: 0.9em; }
.mb-badge--ok { color: var(--ok); border-color: var(--ok); }
.mb-badge--pending { color: var(--accent-dark); border-color: var(--accent); background: var(--accent-tint); }
.mb-badge--asleep { color: var(--muted); }
.mb-badge--idle { color: var(--muted); border-style: dashed; }
.mb-chip { display: inline-block; padding: 0 8px; border-radius: 6px; border: 1px solid var(--border); font-size: 0.82em; color: var(--muted); }
.mb-chip--mock { color: var(--accent-dark); border-color: var(--accent); background: var(--accent-tint); }
.mb-chip--warn { color: var(--accent-dark); border-color: var(--accent); }
.mb-dot::before { content: "●"; margin-right: 4px; color: var(--muted); }
.mb-dot--ok::before { color: var(--ok); }
.mb-dot--pending::before { color: var(--accent); }
.mb-computer__head, .mb-bot__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.mb-computer__head h2, .mb-computer__head h3, .mb-bot__head h2, .mb-bot__head h3 { margin: 0; }
.mb-computer__meta { color: var(--muted); font-size: 0.92em; }
.mb-sleep { border: 1px dashed var(--border); border-radius: 8px; padding: 10px 14px; margin: 8px 0; background: var(--accent-tint); }
.mb-sleep__title { font-weight: 700; margin: 0; }
.mb-list { list-style: none; margin: 6px 0; padding: 0; }
.mb-list li { padding: 5px 0; border-bottom: 1px solid var(--border); }
.mb-list li:last-child { border-bottom: 0; }
.mb-memory--revoked { color: var(--muted); text-decoration: line-through; text-decoration-color: var(--border); }
.mb-warn { color: var(--danger); }
.mb-reddot { color: var(--danger); }
.mb-reddot::before { content: ""; display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--danger); vertical-align: middle; margin-right: 4px; }
.mb-disk--ok { color: var(--ok); }
.mb-disk--warn { color: var(--accent-dark); }
.mb-disk--critical { color: var(--danger); }
.mb-meter { height: 8px; border-radius: 4px; background: var(--border); overflow: hidden; margin: 4px 0 8px; }
.mb-meter__fill { display: block; height: 100%; background: var(--ok); }
.mb-meter__fill.mb-disk--warn { background: var(--accent); }
.mb-meter__fill.mb-disk--critical { background: var(--danger); }
.mb-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border); margin: 12px 0; flex-wrap: wrap; }
.mb-tabs a { padding: 6px 14px; text-decoration: none; color: var(--muted); border-bottom: 2px solid transparent; }
.mb-tabs a[aria-selected="true"] { color: var(--accent-dark); border-bottom-color: var(--accent); font-weight: 600; }
.mb-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.mb-form label { display: flex; flex-direction: column; font-size: 0.9em; gap: 2px; }
.mb-form input, .mb-form select, .mb-form textarea { font: inherit; padding: 4px 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--card); color: var(--fg); }
.mb-weekdays { border: 1px solid var(--border); border-radius: 6px; }
.mb-weekdays label { display: inline-flex; flex-direction: row; align-items: center; gap: 3px; margin-right: 6px; }
.mb-wizard { display: flex; flex-direction: column; gap: 10px; }
.mb-steps { display: flex; gap: 14px; list-style: none; padding: 0; margin: 0; color: var(--muted); }
.mb-steps li[aria-current="true"] { color: var(--accent-dark); font-weight: 700; }
.mb-choice { display: flex !important; flex-direction: row !important; align-items: center; gap: 6px; }
.mb-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.mb-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.mb-dialog { border: 1px solid var(--danger); border-radius: 8px; padding: 12px 16px; margin-top: 10px; background: var(--card); }
.mb-banner { padding: 8px 14px; border-radius: 8px; border: 1px solid var(--border); font-weight: 600; }
.mb-banner--takeover { border-color: var(--danger); color: var(--danger); background: var(--card); }
.mb-banner--present, .mb-banner--queued { border-color: var(--accent); color: var(--accent-dark); background: var(--accent-tint); }
.mb-banner--viewer { color: var(--ok); border-color: var(--ok); }
.mb-banner--returned, .mb-banner--released { color: var(--muted); }
.mb-stream { text-align: center; min-height: 160px; }
/* 实时画面（noVNC iframe）：iframe 是官方 noVNC UI，键盘/鼠标/触控/缩放由它负责。
   容器保持 16:10 办公比例；移动端降高并允许工具栏换行。 */
.mb-live { text-align: left; }
.mb-live__head { margin: 0 0 4px; }
.mb-live__frame { position: relative; width: 100%; background: var(--bg); border-radius: 8px; overflow: hidden; border: 1px solid var(--border); }
.mb-live__frame iframe { display: block; width: 100%; height: min(68vh, 660px); min-height: 320px; border: 0; background: var(--bg); }
.mb-live__frame:fullscreen { border-radius: 0; border: 0; }
.mb-live__frame:fullscreen iframe { height: 100vh; min-height: 0; }
.mb-live__toolbar { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.mb-frame-fallback { margin-top: 12px; }
@media (max-width: 720px) {
  .mb-live__frame iframe { height: 56vh; min-height: 300px; }
  .mb-live__toolbar .btn { min-height: 40px; }
}
.mb-proposal { border: 1px solid var(--accent); border-radius: 8px; padding: 8px 12px; background: var(--accent-tint); }
.mb-screen-overlay { position: fixed; inset: 0; z-index: 50; overflow: auto; background: var(--bg); padding: 24px; }
.mb-screen-overlay[hidden] { display: none; }
.mb-screen-overlay > [data-mb-content], .mb-screen-overlay > [data-mb-flash] { max-width: 860px; margin: 0 auto; }

/* HUI-3132：原生会话消息 / 任务卡（窄屏可读、长链接不断行溢出、屏幕阅读器诚实） */
.sdz-session-cards,
.sdz-work-cards {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 12px 0;
}
.sdz-session-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
  background: var(--card);
}
.sdz-session-row--history {
  opacity: 0.72;
}
.sdz-session-row__text {
  margin: 6px 0 0;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: pre-wrap;
}
.sdz-session-row__history {
  display: inline-block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
}
.sdz-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
  background: var(--card);
}
.sdz-card__title {
  margin: 0 0 6px;
  font-size: 14px;
}
.sdz-card__row {
  display: flex;
  gap: 8px;
  align-items: baseline;
  margin: 4px 0;
  overflow-wrap: anywhere;
}
.sdz-card__label {
  color: var(--muted);
  min-width: 4em;
}
.sdz-card__missing {
  color: var(--muted);
}
.sdz-card__link {
  overflow-wrap: anywhere;
  word-break: break-all;
}
.sdz-card__notice {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--muted);
}
.sdz-card__actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
@media (max-width: 640px) {
  .sdz-card,
  .sdz-session-row {
    padding: 8px;
    border-radius: 10px;
  }
  .sdz-card__row {
    flex-direction: column;
    gap: 2px;
  }
  .sdz-card__actions {
    flex-wrap: wrap;
  }
}