:root {
    --paper: oklch(0.97 0.012 75);
    --paper-edge: oklch(0.945 0.014 75);
    --cream: oklch(0.93 0.018 75);
    --ink: oklch(0.18 0.018 60);
    --ink-soft: oklch(0.34 0.014 60);
    --ink-mute: oklch(0.55 0.012 70);
    --ink-faint: oklch(0.72 0.01 70);
    --carmine: oklch(0.48 0.18 25);
    --carmine-deep: oklch(0.36 0.14 25);
    --rule: oklch(0.86 0.015 75);
    --rule-faint: oklch(0.91 0.013 75);

    /* 2026-06-29 字体统一:4 页一致 —— 正文/标题统一中文系统体(原 --serif 衬线、--sans Inter 起头
       导致助手页落到 Arial、各页不一);数字/计时统一单一 SF Mono(原 --mono 以 JetBrains 起头,与
       --al-mono/--mc7 的 SF Mono 打架)。改变量定义即全局生效,不动 168+85 处用法。 */
    --serif: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
    --sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
    --mono: "SF Mono", "SFMono-Regular", ui-monospace, "JetBrains Mono", Consolas, monospace;
  }
  body.dark {
    --paper: oklch(0.16 0.012 60);
    --paper-edge: oklch(0.2 0.012 60);
    --cream: oklch(0.22 0.012 60);
    --ink: oklch(0.96 0.012 75);
    --ink-soft: oklch(0.84 0.014 75);
    --ink-mute: oklch(0.65 0.012 70);
    --ink-faint: oklch(0.45 0.012 70);
    --carmine: oklch(0.72 0.18 25);
    --carmine-deep: oklch(0.58 0.16 25);
    --rule: oklch(0.32 0.012 70);
    --rule-faint: oklch(0.26 0.012 70);
  }

  *, *::before, *::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; overflow-x: hidden; }
  body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--sans);
    font-size: 16px;
    line-height: 1.6;
    transition: background 0.4s, color 0.4s;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;       /* 兜底：截住笔身 920px 幽灵 box 引起的横向滚动，但保留所有子元素阴影 */
  }
  a { color: inherit; text-decoration: none; }
  p { margin: 0; }
  h1, h2, h3, h4 {
    font-family: var(--serif); color: var(--ink); margin: 0;
    line-height: 1.12; font-weight: 700; letter-spacing: -0.01em;
  }
  h1 { font-weight: 900; }

  .shell { width: min(1240px, 92vw); margin: 0 auto; }
  .rule { border: 0; height: 1px; background: var(--rule); margin: 0; }
  .caption {
    font-family: var(--sans); font-size: 0.72rem; font-weight: 600;
    letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-mute);
  }
  .mono { font-family: var(--mono); }

  /* —— TAB NAV —— */
  .frame {
    position: sticky; top: 0; z-index: 50;
    background: color-mix(in oklch, var(--paper) 92%, transparent);
    backdrop-filter: blur(6px);
    border-bottom: 1px solid var(--rule-faint);
    transition: background 0.4s, border-color 0.4s;
  }
  .frame-inner {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 0; gap: 32px;
  }
  .mark {
    display: flex; align-items: baseline; gap: 10px;
    font-family: var(--serif); font-weight: 900; font-size: 1.1rem;
    white-space: nowrap; cursor: pointer;
  }
  .mark .dot {
    width: 7px; height: 7px; border-radius: 999px; background: var(--carmine);
    display: inline-block; transform: translateY(-2px);
  }
  .mark small {
    font-family: var(--mono); font-weight: 500; font-size: 0.7rem;
    color: var(--ink-mute); letter-spacing: 0.04em;
  }
  .tabs {
    display: flex; gap: 4px; list-style: none; padding: 0; margin: 0;
    flex-wrap: wrap;
  }
  .tab {
    background: transparent; border: 0; cursor: pointer;
    font-family: var(--sans); font-size: 0.88rem; color: var(--ink-soft);
    padding: 8px 14px; border-radius: 999px;
    transition: color 0.2s, background 0.2s;
    letter-spacing: 0.01em;
  }
  .tab:hover { color: var(--ink); background: color-mix(in oklch, var(--ink) 6%, transparent); }
  .tab.active {
    color: var(--paper); background: var(--carmine);
    font-weight: 600;
  }
  @media (max-width: 820px) {
    .mark small { display: none; }
    .frame-inner { gap: 14px; }
    .tab { padding: 6px 10px; font-size: 0.78rem; }
  }
  @media (max-width: 560px) {
    .frame-inner { flex-direction: column; align-items: flex-start; gap: 10px; padding: 12px 0; }
    .tabs { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  }

  /* —— PANELS —— */
  .panel { display: none; }
  .panel.active { display: block; animation: fadein 0.35s ease; }
  @keyframes fadein {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
  }

  /* —— HERO —— */
  .hero { padding: 80px 0 96px; }
  .hero-meta {
    display: flex; justify-content: space-between; gap: 24px;
    margin-bottom: 56px; font-size: 0.78rem; flex-wrap: wrap;
  }
  .hero-meta > div { color: var(--ink-mute); }
  .hero-meta b { color: var(--ink); font-weight: 600; font-family: var(--mono); letter-spacing: 0.02em; }
  .hero h1 {
    font-size: clamp(2.6rem, 6.8vw, 6rem);
    line-height: 0.98; letter-spacing: -0.02em;
  }
  .hero h1 .stroke { color: var(--carmine); font-style: italic; font-weight: 900; }
  .hero h1 .quiet { color: var(--ink-mute); font-weight: 500; }
  .hero-grid {
    display: grid; grid-template-columns: 1.55fr 1fr;
    gap: 64px; margin-top: 48px; align-items: end;
  }
  .hero-lead {
    font-size: 1.16rem; line-height: 1.55;
    color: var(--ink-soft); max-width: 42ch;
  }
  .hero-lead strong { color: var(--ink); font-weight: 600; }
  .hero-lead a.inline-link {
    color: var(--carmine); font-weight: 600;
    border-bottom: 1px solid currentColor; cursor: pointer;
  }
  .hero-index {
    border-top: 1px solid var(--ink); padding-top: 18px;
    font-size: 0.86rem;
  }
  .hero-index ol { margin: 0; padding: 0; list-style: none; counter-reset: idx; }
  .hero-index li {
    counter-increment: idx;
    display: grid; grid-template-columns: 44px 1fr auto;
    align-items: baseline; padding: 13px 0;
    border-bottom: 1px solid var(--rule-faint);
    color: var(--ink-soft);
  }
  .hero-index li::before {
    content: counter(idx, decimal-leading-zero);
    font-family: var(--mono); font-size: 0.75rem; color: var(--ink-mute);
  }
  .hero-index li b { color: var(--ink); font-weight: 600; font-family: var(--serif); font-size: 1rem; }
  .hero-index li span { font-family: var(--mono); font-size: 0.72rem; color: var(--ink-faint); }

  /* —— VS · 对标 prominent benchmark strip (above each product hero h1) —— */
  .vs-strip {
    display: grid; grid-template-columns: auto 1fr;
    gap: 22px; align-items: center;
    padding: 14px 18px 14px 20px;
    background: var(--paper);
    border: 1px solid var(--rule);
    border-left: 4px solid var(--carmine);
    border-radius: 5px;
    margin: -32px 0 30px 0;
    position: relative;
  }
  .vs-strip::after {
    content: ""; position: absolute;
    top: -1px; left: -1px; right: -1px; bottom: -1px;
    border-radius: 5px; pointer-events: none;
    box-shadow: 0 1px 3px rgba(20,30,60,0.04);
  }
  .vs-strip-left {
    display: flex; align-items: baseline; gap: 12px;
    padding-right: 18px;
    border-right: 1px solid var(--rule);
    white-space: nowrap;
  }
  .vs-mark {
    font-family: var(--serif); font-style: italic; font-weight: 900;
    font-size: 1.6rem; letter-spacing: 0.02em;
    color: var(--carmine); line-height: 0.9;
  }
  .vs-lab {
    font-family: var(--mono); font-size: 0.72rem; font-weight: 600;
    color: var(--ink-mute); letter-spacing: 0.22em;
    text-transform: uppercase;
  }
  .vs-target {
    font-family: var(--serif); font-size: 1.18rem; font-weight: 700;
    color: var(--ink); letter-spacing: 0.01em;
  }
  .vs-strip-right {
    display: flex; align-items: baseline; gap: 12px; min-width: 0;
  }
  .vs-arrow {
    font-family: var(--mono); font-size: 1rem; font-weight: 700;
    color: var(--carmine); flex-shrink: 0;
  }
  .vs-pos {
    font-size: 0.96rem; color: var(--ink-soft); line-height: 1.45;
  }
  .vs-pos b { color: var(--ink); font-weight: 700; }
  .vs-pos em { font-style: italic; color: var(--carmine); font-weight: 600; }

  /* —— Dual SKU variant (pen has 高端 + 基础 against same benchmark) —— */
  .vs-strip-skus { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
  .vs-sku {
    display: grid; grid-template-columns: 60px 1fr;
    align-items: baseline; gap: 12px;
    font-size: 0.94rem; line-height: 1.4; color: var(--ink-soft);
  }
  .vs-sku-tag {
    font-family: var(--mono); font-size: 0.68rem; font-weight: 700;
    letter-spacing: 0.14em; text-transform: uppercase;
    background: rgba(20,30,60,0.06); color: var(--ink-mute);
    padding: 3px 0; text-align: center; border-radius: 3px;
  }
  .vs-sku-tag--hi {
    background: oklch(0.48 0.18 25 / 0.12); color: var(--carmine);
  }
  .vs-sku-line b { color: var(--ink); font-weight: 700; }
  .vs-sku-line em { font-style: italic; color: var(--carmine); font-weight: 600; }

  @media (max-width: 820px) {
    .hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .hero { padding: 48px 0 64px; }
  }
  @media (max-width: 720px) {
    .vs-strip { grid-template-columns: 1fr; gap: 10px; padding: 12px 14px; margin: -16px 0 22px 0; }
    .vs-strip-left {
      padding-right: 0; padding-bottom: 8px;
      border-right: 0; border-bottom: 1px solid var(--rule);
    }
    .vs-strip-right { flex-wrap: wrap; }
    .vs-sku { grid-template-columns: 50px 1fr; gap: 8px; font-size: 0.88rem; }
  }

  /* —— SECTION FRAME —— */
  section.sec { padding: 88px 0; border-top: 1px solid var(--rule); }
  .section-tag { display: flex; align-items: baseline; gap: 14px; margin-bottom: 32px; }
  .section-tag .n { font-family: var(--mono); font-size: 0.78rem; color: var(--carmine); font-weight: 500; }
  .section-tag .l {
    font-family: var(--sans); font-size: 0.72rem; font-weight: 600;
    letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-mute);
  }
  .section-h {
    font-size: clamp(1.8rem, 3.6vw, 3rem);
    line-height: 1.08; max-width: 24ch; margin-bottom: 20px;
  }
  .section-h em { font-style: italic; color: var(--carmine); font-family: var(--serif); }
  .section-lead {
    font-size: 1.05rem; color: var(--ink-soft);
    max-width: 60ch; line-height: 1.6; margin-bottom: 48px;
  }

  /* —— DIAGNOSIS (痛点) —— */
  .diagnosis-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 0;
    border-top: 1px solid var(--ink);
  }
  .diagnosis-grid .pain {
    border-bottom: 1px solid var(--rule);
    padding: 32px 32px 36px 0;
    display: grid; grid-template-columns: 76px 1fr; gap: 16px;
    align-items: start;
  }
  .diagnosis-grid .pain:nth-child(odd) { border-right: 1px solid var(--rule); padding-right: 40px; }
  .diagnosis-grid .pain:nth-child(even) { padding-left: 40px; padding-right: 0; }
  .diagnosis-grid .pain .num {
    font-family: var(--serif); font-weight: 900; font-size: 2.6rem;
    line-height: 1; color: var(--carmine);
  }
  .pain h3 { font-size: 1.25rem; margin-bottom: 10px; font-family: var(--serif); }
  .pain p { color: var(--ink-soft); font-size: 0.96rem; line-height: 1.6; }
  .pain .quote {
    margin-top: 14px; padding-top: 14px;
    border-top: 1px dashed var(--rule);
    font-family: var(--mono); font-size: 0.78rem;
    color: var(--ink-mute);
  }
  @media (max-width: 720px) {
    .diagnosis-grid { grid-template-columns: 1fr; }
    .diagnosis-grid .pain { padding: 26px 0 28px !important; border-right: 0; }
  }
  .diagnosis-stripe {
    display: flex; justify-content: space-between;
    margin-top: 24px; color: var(--ink-mute);
    font-size: 0.8rem; flex-wrap: wrap; gap: 12px;
  }

  /* —— VS PAIN · 对位竞品实证痛点 + 我们的解 (§01.5 章节 · 不替换原 §01) —— */
  .vs-pain-grid {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 22px; margin-top: 30px;
  }
  .vs-pain {
    background: var(--paper);
    border: 1px solid var(--rule);
    border-radius: 6px;
    padding: 22px 24px 0;
    display: flex; flex-direction: column;
    position: relative; overflow: hidden;
  }
  .vs-pain-num {
    position: absolute; top: 14px; right: 18px;
    font-family: var(--mono); font-size: 0.72rem;
    color: var(--ink-faint); letter-spacing: 0.18em; font-weight: 600;
  }
  .vs-pain-tag {
    display: inline-block;
    font-family: var(--mono); font-size: 0.66rem;
    color: var(--carmine); letter-spacing: 0.18em;
    text-transform: uppercase; font-weight: 700;
    margin-bottom: 10px;
  }
  .vs-pain h4 {
    font-family: var(--serif); font-size: 1.14rem;
    color: var(--ink); line-height: 1.36;
    margin-bottom: 10px;
  }
  .vs-pain-body { flex: 1; }
  .vs-pain-body p {
    font-size: 0.94rem; color: var(--ink-soft);
    line-height: 1.6;
  }
  .vs-pain-body p b { color: var(--ink); font-weight: 700; }
  .vs-pain-quote {
    font-family: var(--serif); font-style: italic;
    font-size: 0.92rem; color: var(--ink-mute);
    margin: 12px 0 0;
    padding: 8px 12px;
    border-left: 2px solid var(--rule);
    background: rgba(0,0,0,0.025);
    border-radius: 0 4px 4px 0;
  }
  .vs-pain-fix {
    margin: 18px -24px 0;
    padding: 14px 24px 18px;
    background: oklch(0.48 0.18 25 / 0.06);
    border-top: 1px solid oklch(0.48 0.18 25 / 0.18);
  }
  .vs-pain-fix-h {
    font-family: var(--mono); font-size: 0.66rem;
    color: var(--carmine); letter-spacing: 0.18em;
    text-transform: uppercase; font-weight: 700;
    margin-bottom: 7px;
  }
  .vs-pain-fix-h::before { content: "▸ "; }
  .vs-pain-fix p {
    font-size: 0.92rem; color: var(--ink);
    line-height: 1.6;
  }
  .vs-pain-fix p b { color: var(--carmine); font-weight: 700; }
  .vs-pain-fix p em { font-style: italic; color: var(--carmine); font-weight: 600; }
  .vs-pain-fix .ref {
    display: block;
    margin-top: 8px;
    font-family: var(--mono); font-size: 0.72rem;
    color: var(--ink-mute);
    letter-spacing: 0.04em;
  }
  .vs-pain-meta {
    margin-top: 16px; font-family: var(--mono);
    font-size: 0.74rem; color: var(--ink-mute);
    letter-spacing: 0.04em;
  }
  .vs-pain-meta b { color: var(--ink); font-weight: 700; }

  @media (max-width: 980px) {
    .vs-pain-grid { grid-template-columns: 1fr; gap: 18px; }
  }

  /* —— VS OVERVIEW · 总览 tab 的"三巨头对位"摘要卡 (3 张, 每个产品 1 张) —— */
  .vs-overview-grid {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 22px; margin-top: 30px;
  }
  .vs-ov-card {
    background: var(--paper);
    border: 1px solid var(--rule);
    border-left: 3px solid var(--carmine);
    border-radius: 6px;
    padding: 20px 22px 18px;
    display: flex; flex-direction: column;
    cursor: pointer;
    transition: transform 0.18s, box-shadow 0.18s;
    position: relative; overflow: hidden;
  }
  .vs-ov-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(20, 25, 50, 0.10);
  }
  .vs-ov-tag {
    font-family: var(--mono); font-size: 0.7rem;
    color: var(--ink-mute); letter-spacing: 0.18em;
    text-transform: uppercase; font-weight: 700;
  }
  .vs-ov-vs {
    display: block;
    font-family: var(--mono); font-size: 0.72rem;
    color: var(--carmine); letter-spacing: 0.12em;
    font-weight: 700; margin-top: 4px;
  }
  .vs-ov-card h4 {
    font-family: var(--serif); font-size: 1.14rem;
    color: var(--ink); line-height: 1.36;
    margin: 12px 0 6px;
  }
  .vs-ov-card > p {
    font-size: 0.88rem; color: var(--ink-soft);
    line-height: 1.55; flex: 1;
  }
  .vs-ov-fix {
    margin: 14px -22px 0;
    padding: 13px 22px 10px;
    background: oklch(0.48 0.18 25 / 0.06);
    border-top: 1px solid oklch(0.48 0.18 25 / 0.18);
    font-size: 0.88rem; color: var(--ink);
    line-height: 1.55;
  }
  .vs-ov-fix-h {
    font-family: var(--mono); font-size: 0.66rem;
    color: var(--carmine); letter-spacing: 0.18em;
    text-transform: uppercase; font-weight: 700;
    margin-right: 4px; white-space: nowrap;
  }
  .vs-ov-fix b { color: var(--carmine); font-weight: 700; }
  .vs-ov-cta {
    display: inline-block; margin-top: 12px;
    font-family: var(--mono); font-size: 0.74rem;
    color: var(--carmine); font-weight: 700;
    letter-spacing: 0.08em;
  }
  @media (max-width: 980px) {
    .vs-overview-grid { grid-template-columns: 1fr; gap: 16px; }
  }

  /* —— LINEUP (overview product cards) —— */
  .lineup { display: flex; flex-direction: column; }
  .lineup-row {
    display: grid; grid-template-columns: 100px 1fr;
    gap: 28px; padding: 48px 0;
    border-top: 1px solid var(--ink);
    cursor: pointer;
    position: relative;
    transition: background 0.25s ease;
  }
  .lineup-row:last-child { border-bottom: 1px solid var(--ink); }
  .lineup-row:hover { background: linear-gradient(90deg, transparent 0%, color-mix(in oklch, var(--carmine) 6%, transparent) 100%); }
  .lineup-row:hover .lineup-cta { color: var(--carmine); transform: translateX(8px); }
  .lineup-row:hover .lineup-title { color: var(--carmine); }
  .lineup-num {
    font-family: var(--serif); font-weight: 900; font-style: italic;
    font-size: 4.5rem; line-height: 0.9; color: var(--ink); opacity: 0.92;
  }
  .lineup-body { display: grid; grid-template-columns: 2.2fr 1fr; gap: 56px; align-items: start; }
  .lineup-main { display: flex; flex-direction: column; gap: 16px; }
  .lineup-tag { font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.08em; color: var(--carmine); }
  .lineup-title { font-size: clamp(1.9rem, 3.8vw, 2.8rem); line-height: 1.04; transition: color 0.2s; }
  .lineup-tagline { font-family: var(--serif); font-style: italic; font-weight: 500; color: var(--ink-mute); font-size: 1.05rem; }
  .lineup-pos { color: var(--ink-soft); font-size: 0.98rem; line-height: 1.55; max-width: 52ch; }
  .lineup-bullets { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; padding: 0; list-style: none; }
  .lineup-bullets li {
    display: grid; grid-template-columns: 16px 1fr; gap: 12px;
    align-items: baseline; font-size: 0.92rem; color: var(--ink-soft);
  }
  .lineup-bullets li::before { content: "—"; color: var(--carmine); font-family: var(--mono); }
  .lineup-side {
    border-left: 1px solid var(--rule);
    padding-left: 28px; display: flex; flex-direction: column; gap: 18px;
    font-size: 0.86rem;
  }
  .lineup-side dt { color: var(--ink-mute); font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.04em; margin-bottom: 4px; }
  .lineup-side dd { margin: 0; color: var(--ink); font-family: var(--serif); font-weight: 700; font-size: 1.02rem; }
  .lineup-side dd small { display: block; font-family: var(--sans); font-weight: 400; font-size: 0.8rem; color: var(--ink-mute); margin-top: 4px; }
  .lineup-cta {
    margin-top: 14px;
    font-family: var(--mono); font-size: 0.82rem; letter-spacing: 0.04em;
    color: var(--ink); display: inline-flex; align-items: center; gap: 8px;
    transition: color 0.2s, transform 0.25s;
  }
  .lineup-cta::after { content: "→"; font-size: 1rem; }
  @media (max-width: 900px) {
    .lineup-row { grid-template-columns: 1fr; gap: 18px; padding: 36px 0; }
    .lineup-body { grid-template-columns: 1fr; gap: 24px; }
    .lineup-side { border-left: 0; border-top: 1px solid var(--rule); padding-left: 0; padding-top: 18px; }
    .lineup-num { font-size: 2.8rem; }
  }

  /* —— FEATURE LIST —— */
  .block-h {
    font-size: 0.74rem; font-weight: 600;
    letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-mute);
    margin-bottom: 16px; display: flex; align-items: center; gap: 12px;
  }
  .block-h::before { content: ""; width: 18px; height: 1px; background: var(--carmine); }
  .feature-list { display: flex; flex-direction: column; }
  .feature {
    display: grid; grid-template-columns: 160px 1fr;
    gap: 24px; padding: 22px 0;
    border-top: 1px solid var(--rule);
    align-items: baseline;
  }
  .feature:last-child { border-bottom: 1px solid var(--rule); }
  .feature .k { font-family: var(--serif); font-weight: 700; font-size: 1.08rem; color: var(--ink); }
  .feature .k small { display: block; font-family: var(--mono); font-weight: 500; font-size: 0.68rem; color: var(--ink-mute); margin-top: 4px; letter-spacing: 0.02em; }
  .feature .v { color: var(--ink-soft); font-size: 0.97rem; line-height: 1.6; }
  .feature .v strong { color: var(--ink); font-weight: 600; }
  @media (max-width: 720px) {
    .feature { grid-template-columns: 1fr; gap: 6px; padding: 18px 0; }
  }

  /* —— VS TABLE —— */
  .vs-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
  .vs-table th, .vs-table td {
    text-align: left; padding: 14px 18px 14px 0;
    border-bottom: 1px solid var(--rule); vertical-align: top;
  }
  .vs-table th {
    font-family: var(--mono); font-weight: 500; font-size: 0.72rem;
    color: var(--ink-mute); letter-spacing: 0.06em; text-transform: uppercase;
    border-bottom-color: var(--ink);
  }
  .vs-table td { color: var(--ink-soft); }
  .vs-table td strong { color: var(--ink); font-weight: 600; font-family: var(--serif); }
  .vs-table tr.us td { background: oklch(0.94 0.025 25 / 0.5); color: var(--ink); }
  body.dark .vs-table tr.us td { background: oklch(0.28 0.04 25 / 0.4); }
  .vs-table tr.us td strong { color: var(--carmine-deep); }
  .vs-table td .pill {
    display: inline-block; font-family: var(--mono); font-size: 0.7rem;
    padding: 2px 8px; border-radius: 999px;
    background: var(--cream); color: var(--ink-soft); margin-left: 8px;
  }

  /* —— TIER GRID —— */
  .tier-grid {
    display: grid; gap: 0;
    border-top: 1px solid var(--ink);
    border-bottom: 1px solid var(--ink);
  }
  .tier-grid.cols-2 { grid-template-columns: 1fr 1fr; }
  .tier-grid.cols-3 { grid-template-columns: 1fr 1fr 1fr; }
  .tier { padding: 28px 28px 30px 0; border-right: 1px solid var(--rule); }
  .tier:last-child { border-right: 0; padding-right: 0; padding-left: 28px; }
  .tier-grid.cols-3 .tier:not(:first-child):not(:last-child) { padding-left: 28px; padding-right: 28px; }
  .tier .level {
    font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.1em;
    text-transform: uppercase; color: var(--ink-mute); margin-bottom: 14px;
  }
  .tier h4 { font-size: 1.5rem; margin-bottom: 6px; }
  .tier .price { font-family: var(--mono); font-size: 0.92rem; color: var(--carmine); margin-bottom: 16px; }
  .tier ul { margin: 0; padding: 0; list-style: none; }
  .tier li { padding: 9px 0; color: var(--ink-soft); font-size: 0.94rem; border-top: 1px dashed var(--rule); }
  .tier li:first-child { border-top: 0; }
  .tier li b { color: var(--ink); font-weight: 600; }
  @media (max-width: 900px) {
    .tier-grid.cols-2, .tier-grid.cols-3 { grid-template-columns: 1fr; }
    .tier { border-right: 0; border-bottom: 1px solid var(--rule); padding: 22px 0 24px !important; }
    .tier:last-child { border-bottom: 0; }
  }

  /* —— SCENARIOS —— */
  .scenarios {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
    border-top: 1px solid var(--rule);
  }
  .scenario {
    padding: 24px 22px 28px 0;
    border-right: 1px solid var(--rule);
    border-bottom: 1px solid var(--rule);
  }
  .scenario:nth-child(3n) { border-right: 0; padding-right: 0; }
  .scenario:nth-child(3n+2), .scenario:nth-child(3n+3) { padding-left: 22px; }
  .scenario .when { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.06em; color: var(--carmine); margin-bottom: 10px; }
  .scenario h4 { font-size: 1.08rem; margin-bottom: 8px; font-family: var(--serif); }
  .scenario p { color: var(--ink-soft); font-size: 0.9rem; line-height: 1.55; }
  @media (max-width: 720px) {
    .scenarios { grid-template-columns: 1fr; }
    .scenario { border-right: 0; padding: 20px 0 24px !important; }
  }

  /* —— SPECS —— */
  .specs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--ink); }
  .spec { padding: 22px 18px 24px 0; border-right: 1px solid var(--rule); }
  .spec:last-child { border-right: 0; padding-right: 0; }
  .spec .label { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.04em; color: var(--ink-mute); margin-bottom: 8px; text-transform: uppercase; }
  .spec .value { font-family: var(--serif); font-weight: 700; font-size: 1.15rem; color: var(--ink); line-height: 1.2; }
  .spec .value small { display: block; margin-top: 4px; font-family: var(--sans); font-weight: 400; font-size: 0.76rem; color: var(--ink-mute); }
  @media (max-width: 720px) {
    .specs { grid-template-columns: 1fr 1fr; }
    .spec:nth-child(2n) { border-right: 0; padding-right: 0; }
    .spec:nth-child(2n+1) { border-right: 1px solid var(--rule); padding-right: 18px; }
  }

  /* —— ROADMAP —— */
  .roadmap { display: grid; grid-template-columns: repeat(6, 1fr); border-top: 1px solid var(--ink); margin-top: 24px; }
  .gate {
    grid-column: span 1; padding: 24px 16px 30px 0;
    border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
    min-height: 200px; display: flex; flex-direction: column;
  }
  .gate:last-child { border-right: 0; padding-right: 0; }
  .gate .stage { font-family: var(--mono); font-size: 0.7rem; color: var(--ink-mute); margin-bottom: 12px; letter-spacing: 0.06em; }
  .gate h4 { font-size: 1.02rem; margin-bottom: 8px; font-family: var(--serif); font-weight: 700; }
  .gate .body { font-size: 0.8rem; color: var(--ink-soft); line-height: 1.5; flex: 1; }
  .gate .marker { margin-top: 14px; display: flex; gap: 6px; flex-wrap: wrap; }
  .gate .chip {
    display: inline-block; font-family: var(--mono); font-size: 0.66rem;
    padding: 2px 7px; border-radius: 2px;
    background: var(--cream); color: var(--ink-soft);
  }
  .gate .chip.live { background: var(--carmine); color: var(--paper); }
  .gate .chip.next { background: oklch(0.88 0.04 165); color: var(--ink); }
  body.dark .gate .chip.next { background: oklch(0.5 0.08 165); color: var(--paper); }
  @media (max-width: 820px) {
    .roadmap { grid-template-columns: 1fr 1fr; }
    .gate { min-height: auto; padding: 20px 14px 24px 0; }
    .gate:nth-child(2n) { border-right: 0; padding-right: 0; }
    .gate:nth-child(2n+1) { padding-right: 14px; }
    .gate:nth-child(2n) { padding-left: 14px; }
  }

  /* —— PLATFORM SPECIAL —— */
  .cap-deck { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--ink); }
  .cap-deep {
    padding: 36px 32px 40px 0;
    border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
    display: flex; flex-direction: column; gap: 16px;
  }
  .cap-deck > .cap-deep:nth-child(2n) { border-right: 0; padding-right: 0; padding-left: 32px; }
  .cap-deck > .cap-deep:nth-child(2n+1) { padding-right: 32px; }
  .cap-deep .ix { font-family: var(--mono); font-size: 0.72rem; color: var(--carmine); letter-spacing: 0.05em; }
  .cap-deep h3 { font-size: 1.55rem; line-height: 1.12; }
  .cap-deep .one-liner { font-family: var(--serif); font-weight: 500; font-style: italic; color: var(--ink-soft); font-size: 1.02rem; line-height: 1.45; }
  .cap-deep dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 8px 18px; font-size: 0.86rem; }
  .cap-deep dt { font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.04em; color: var(--ink-mute); padding-top: 4px; text-transform: uppercase; }
  .cap-deep dd { margin: 0; color: var(--ink-soft); line-height: 1.55; }
  .cap-deep dd strong { color: var(--ink); font-weight: 600; }
  .cap-deep .use { margin-top: auto; padding-top: 14px; border-top: 1px dashed var(--rule); font-family: var(--mono); font-size: 0.7rem; color: var(--ink-mute); }
  .cap-deep .use b { color: var(--ink); font-weight: 500; }
  @media (max-width: 820px) {
    .cap-deck { grid-template-columns: 1fr; }
    .cap-deep { border-right: 0; padding: 28px 0 30px !important; }
  }
  .flow-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
  .flow-table th, .flow-table td { text-align: left; padding: 14px 18px 14px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
  .flow-table th { font-family: var(--mono); font-weight: 500; font-size: 0.7rem; color: var(--ink-mute); letter-spacing: 0.06em; text-transform: uppercase; border-bottom-color: var(--ink); }
  .flow-table td { color: var(--ink-soft); }
  .flow-table td strong { color: var(--ink); font-weight: 600; font-family: var(--serif); }
  .flow-table td.cap-pill { font-family: var(--mono); font-size: 0.78rem; color: var(--carmine); }
  .flow-table td .arrow { color: var(--carmine); font-family: var(--mono); padding: 0 6px; }
  .moat-lead { font-family: var(--serif); font-size: clamp(1.7rem, 3.2vw, 2.6rem); line-height: 1.22; max-width: 24ch; margin-bottom: 52px; }
  .moat-lead em { color: var(--carmine); font-style: italic; }
  .moat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--ink); }
  .moat-pillar { padding: 32px 32px 36px 0; border-bottom: 1px solid var(--rule); border-right: 1px solid var(--rule); }
  .moat-pillar:nth-child(3n) { border-right: 0; padding-right: 0; }
  .moat-pillar:nth-child(3n+2), .moat-pillar:nth-child(3n+3) { padding-left: 32px; }
  .moat-pillar .roman { font-family: var(--serif); font-style: italic; font-weight: 700; font-size: 1.5rem; color: var(--carmine); margin-bottom: 16px; }
  .moat-pillar h3 { font-size: 1.4rem; margin-bottom: 14px; line-height: 1.18; }
  .moat-pillar p { color: var(--ink-soft); line-height: 1.6; font-size: 0.95rem; }
  .moat-pillar p + p { margin-top: 12px; }
  @media (max-width: 820px) {
    .moat-grid { grid-template-columns: 1fr; }
    .moat-pillar { border-right: 0; padding: 26px 0 28px !important; }
  }

  /* —— FOOTER —— */
  footer {
    padding: 56px 0 40px; border-top: 1px solid var(--rule);
    color: var(--ink-mute); font-size: 0.85rem;
  }
  .foot-meta {
    display: flex; justify-content: space-between;
    font-family: var(--mono); font-size: 0.72rem;
    color: var(--ink-faint); flex-wrap: wrap; gap: 8px;
  }
  .foot-mark { font-family: var(--serif); font-weight: 900; font-size: 1.4rem; color: var(--ink); margin-bottom: 12px; }
  .foot-mark em { color: var(--carmine); font-style: italic; }

  .ledger { font-family: var(--mono); font-size: 0.72rem; color: var(--ink-mute); display: flex; gap: 14px; margin-top: 24px; flex-wrap: wrap; }
  .ledger span { display: inline-flex; align-items: center; gap: 6px; }
  .ledger span::before { content: ""; width: 6px; height: 6px; background: var(--carmine); display: inline-block; }
  .ledger span:nth-child(2)::before { background: oklch(0.88 0.04 165); }
  .ledger span:nth-child(3)::before { background: var(--ink-mute); }

  ::selection { background: var(--carmine); color: var(--paper); }

  /* ════════════════════════════════════════════════════════
     INTERACTIVE PROTOTYPES · 交互原型
     ════════════════════════════════════════════════════════ */

  /* —— Prototype band (shared shell) —— */
  .proto-band {
    background: oklch(0.94 0.018 75);
    border-bottom: 1px solid var(--rule);
    padding: 48px 0 64px;
    transition: background 0.4s;
  }
  body.dark .proto-band { background: oklch(0.21 0.012 60); }
  .proto-intro {
    display: flex; justify-content: space-between; align-items: flex-end;
    margin-bottom: 36px; gap: 32px; flex-wrap: wrap;
  }
  .proto-intro .lead { max-width: 56ch; }
  .proto-intro .lead .caption { margin-bottom: 6px; }
  .proto-intro .lead h2 {
    font-family: var(--serif); font-size: clamp(1.5rem, 2.8vw, 2.1rem);
    line-height: 1.15; margin-bottom: 10px;
  }
  .proto-intro .lead p { color: var(--ink-soft); font-size: 0.94rem; line-height: 1.55; }
  .proto-intro .lead p strong { color: var(--ink); font-weight: 600; }
  .proto-hint {
    font-family: var(--mono); font-size: 0.7rem; color: var(--ink-mute);
    letter-spacing: 0.04em; white-space: nowrap;
  }
  .proto-stage { display: flex; flex-direction: column; align-items: center; gap: 28px; }
  .proto-pills { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
  .proto-pill {
    background: var(--paper); border: 1px solid var(--rule);
    cursor: pointer; padding: 9px 16px; border-radius: 999px;
    font-family: var(--sans); font-size: 0.84rem; color: var(--ink-soft);
    transition: all 0.2s; font-weight: 500;
  }
  .proto-pill:hover { color: var(--ink); border-color: var(--ink-mute); }
  .proto-pill.active {
    background: var(--ink); color: var(--paper); border-color: var(--ink);
    font-weight: 600;
  }
  @keyframes protoFade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

  /* —— Tablet device (学而思 风) —— */
  .tablet-frame {
    width: min(720px, 92vw); aspect-ratio: 16 / 10;
    background: #1a1a1f; border-radius: 22px; padding: 14px;
    box-shadow: 0 24px 60px -20px rgba(0,0,0,0.45);
    position: relative;
  }
  .tablet-frame::before {
    content: ""; position: absolute; top: 8px; left: 50%; transform: translateX(-50%);
    width: 6px; height: 6px; background: #444; border-radius: 999px;
  }
  .tablet-screen {
    width: 100%; height: 100%;
    background: linear-gradient(180deg, #e8f1ff 0%, #f5f9ff 30%, #fff 100%);
    border-radius: 10px; overflow: hidden;
    display: flex; flex-direction: column; position: relative;
  }
  .tab-statusbar {
    display: flex; justify-content: space-between; padding: 6px 14px;
    font-size: 0.66rem; color: #555; font-family: var(--mono);
    background: rgba(255,255,255,0.5); backdrop-filter: blur(4px);
  }
  .tab-screen { display: none; padding: 14px 18px 50px; flex: 1; flex-direction: column; min-height: 0; }
  .tab-screen.active { display: flex; animation: protoFade 0.4s ease; }
  .tab-greet { margin-bottom: 12px; }
  .tab-greet div { font-family: var(--serif); font-weight: 700; font-size: 1rem; color: #1a1a2e; }
  .tab-greet small { display: block; margin-top: 2px; color: #666; font-size: 0.72rem; }
  .tab-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
  .tab-action {
    background: white; border-radius: 10px; padding: 12px 8px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.06); cursor: pointer;
    text-align: center; transition: transform 0.2s; border: 0; font-family: inherit;
  }
  .tab-action:hover { transform: translateY(-2px); }
  .tab-action .ico { font-size: 1.5rem; display: block; margin-bottom: 4px; }
  .tab-action .lab { font-family: var(--sans); font-size: 0.76rem; font-weight: 600; color: #1a1a2e; }
  .tab-action .sub { font-size: 0.62rem; color: #888; display: block; margin-top: 2px; }
  .tab-subjects { display: grid; grid-template-columns: repeat(9, 1fr); gap: 5px; flex: 1; }
  .tab-subject {
    background: white; border-radius: 6px; padding: 6px 2px;
    text-align: center; font-size: 0.62rem; font-weight: 600;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 2px; cursor: pointer; border: 0; font-family: inherit;
  }
  .tab-subject .sj-ico { font-size: 0.95rem; }
  .tab-bottombar {
    position: absolute; bottom: 0; left: 0; right: 0;
    background: rgba(255,255,255,0.95); backdrop-filter: blur(6px);
    display: flex; justify-content: space-around;
    padding: 6px 0 10px; font-size: 0.65rem; color: #888;
    border-top: 1px solid #eee;
  }
  .tab-bottombar span { font-weight: 600; }
  .tab-bottombar span.active { color: #FF6B6B; }
  .tab-grade-result {
    background: white; border-radius: 10px; padding: 12px 14px;
    margin-bottom: 10px; box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  }
  .tab-grade-result h4 { font-family: var(--serif); font-size: 0.88rem; margin-bottom: 6px; color: #1a1a2e; }
  .tab-grade-result .ann-row {
    display: grid; grid-template-columns: 22px 1fr; gap: 6px;
    padding: 5px 0; border-top: 1px solid #f0f0f0;
    font-size: 0.74rem; color: #444; line-height: 1.35;
  }
  .tab-grade-result .ann-row:first-of-type { border-top: 0; }
  .tab-grade-result .ok { color: #2ecc71; font-weight: 700; }
  .tab-grade-result .err { color: #e74c3c; font-weight: 700; }
  .tab-grade-result .warn { color: #f39c12; font-weight: 700; }
  .tab-grade-result strong { color: #1a1a2e; font-weight: 700; }
  .tab-grade-summary {
    background: linear-gradient(135deg, #FFF5F5, #FFFAFA);
    border-radius: 8px; padding: 10px 14px;
    font-size: 0.76rem; color: #555; line-height: 1.5;
  }
  .tab-grade-summary b { color: #FF6B6B; font-family: var(--serif); font-weight: 700; }
  .tab-grade-summary strong { color: #1a1a2e; font-weight: 600; }
  .tab-chat { display: flex; flex-direction: column; gap: 8px; padding-bottom: 4px; }
  .tab-bubble {
    border-radius: 12px; padding: 8px 12px;
    max-width: 78%; font-size: 0.78rem; line-height: 1.42;
  }
  .tab-bubble.user {
    background: #4ECDC4; color: white; align-self: flex-end;
    border-bottom-right-radius: 4px;
  }
  .tab-bubble.ai {
    background: white; color: #1a1a2e; align-self: flex-start;
    border-bottom-left-radius: 4px; box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  }
  .tab-bubble.ai .think {
    font-size: 0.66rem; color: #888; margin-top: 4px; font-style: italic;
  }
  .tab-typing {
    display: inline-flex; gap: 3px; align-self: flex-start;
    padding: 10px 14px; background: white; border-radius: 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  }
  .tab-typing span { width: 5px; height: 5px; background: #aaa; border-radius: 50%; animation: dotPulse 1.4s infinite; }
  .tab-typing span:nth-child(2) { animation-delay: 0.2s; }
  .tab-typing span:nth-child(3) { animation-delay: 0.4s; }
  @keyframes dotPulse { 0%, 80%, 100% { transform: scale(0.7); opacity: 0.5; } 40% { transform: scale(1); opacity: 1; } }
  .tab-speak-stage { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 4px 0; }
  .tab-mic {
    width: 64px; height: 64px; border-radius: 50%;
    background: #FFA94D; display: flex; align-items: center; justify-content: center;
    color: white; font-size: 1.6rem;
    margin-bottom: 12px;
    box-shadow: 0 0 0 0 rgba(255, 169, 77, 0.7);
    animation: micPulse 1.5s infinite;
  }
  @keyframes micPulse {
    0% { box-shadow: 0 0 0 0 rgba(255, 169, 77, 0.7); }
    70% { box-shadow: 0 0 0 18px rgba(255, 169, 77, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 169, 77, 0); }
  }
  .tab-speak-task {
    font-family: var(--serif); font-size: 0.82rem;
    color: #1a1a2e; margin-bottom: 8px; text-align: center;
  }
  .tab-speak-transcript {
    background: white; border-radius: 10px; padding: 10px 12px;
    font-size: 0.76rem; line-height: 1.45; color: #444;
    width: 100%; box-shadow: 0 1px 4px rgba(0,0,0,0.05);
  }
  .tab-speak-transcript .corr {
    text-decoration: underline; text-decoration-color: #e74c3c;
    text-decoration-style: wavy; cursor: help;
  }
  .tab-speak-stats {
    display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
    width: 100%; margin-top: 8px;
  }
  .tab-stat {
    background: white; border-radius: 8px; padding: 6px 8px;
    font-size: 0.7rem; color: #666; text-align: center;
  }
  .tab-stat b { display: block; color: #FFA94D; font-family: var(--mono); font-size: 0.95rem; margin-top: 2px; }

  /* —— Tablet grade · real-case 2-column layout —— */
  .tab-grade-case {
    flex: 1; display: grid; grid-template-columns: 46% 54%;
    gap: 10px; min-height: 0;
  }
  .grade-paper {
    background: linear-gradient(180deg, #fffef8 0%, #fff9e8 100%);
    border-radius: 8px; padding: 8px 10px;
    box-shadow: 0 2px 6px rgba(80,60,20,0.08), inset 0 0 0 1px rgba(180,140,60,0.18);
    display: flex; flex-direction: column; gap: 5px;
    font-family: var(--serif); position: relative; overflow: hidden;
  }
  .grade-paper::before {
    content: ""; position: absolute; top:0;right:0;bottom:0;left:0;
    background-image: linear-gradient(180deg, transparent 24px, rgba(180,140,60,0.08) 25px);
    background-size: 100% 25px;
    pointer-events: none;
  }
  .grade-paper > * { position: relative; z-index: 1; }
  .grade-paper .topic {
    font-family: var(--mono); font-size: 0.58rem;
    color: #c97c00; letter-spacing: 0.08em; font-weight: 700;
  }
  .grade-paper .qtext {
    font-size: 0.7rem; color: #1a1a2e; line-height: 1.45;
  }
  .grade-paper .qtext em { font-style: italic; color: #c97c00; font-weight: 700; }
  .grade-paper .stu-trace {
    background: rgba(255,255,255,0.55); border-radius: 5px;
    padding: 5px 8px; font-family: var(--mono); font-size: 0.62rem;
    color: #2a2a3a; line-height: 1.55; margin-top: 2px;
  }
  .grade-paper .stu-trace .strike {
    text-decoration: line-through;
    text-decoration-color: #e74c3c; text-decoration-thickness: 1.5px;
    color: #c0392b;
  }
  .grade-paper .stu-trace .ins {
    color: #5b6cff; font-weight: 700;
    background: rgba(37,99,235,0.08); padding: 0 3px; border-radius: 3px;
  }
  .grade-paper .stu-trace .note {
    display: inline-block;
    font-family: var(--sans); font-size: 0.52rem;
    color: #e74c3c; background: rgba(231,76,60,0.1);
    padding: 1px 5px; border-radius: 3px; margin-left: 4px;
    vertical-align: middle;
  }
  .grade-paper .answer-final {
    font-family: var(--sans); font-size: 0.62rem; color: #2ecc71;
    background: rgba(46,204,113,0.1); border-radius: 5px;
    padding: 4px 8px; line-height: 1.4;
  }
  .grade-paper .answer-final b { color: #1a1a2e; font-weight: 700; }
  .grade-diag { display: flex; flex-direction: column; gap: 6px; min-height: 0; }
  .grade-diag-card {
    background: white; border-radius: 7px; padding: 7px 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    font-size: 0.66rem; line-height: 1.4;
  }
  .grade-diag-card h5 {
    font-family: var(--sans); font-size: 0.6rem; font-weight: 700;
    letter-spacing: 0.08em; text-transform: uppercase;
    color: #888; margin-bottom: 3px; display: flex; align-items: baseline; gap: 6px;
  }
  .grade-diag-card h5 .badge {
    background: #FF6B6B; color: white; border-radius: 3px;
    padding: 1px 5px; font-size: 0.5rem; letter-spacing: 0;
  }
  .grade-diag-card .miscon { color: #1a1a2e; font-weight: 600; }
  .grade-diag-card .why { color: #666; margin-top: 2px; font-size: 0.62rem; }
  .grade-history {
    background: linear-gradient(135deg, #FFF5F0, #FFFAF5);
    border-radius: 7px; padding: 6px 9px;
    font-size: 0.62rem; color: #555; line-height: 1.4;
  }
  .grade-history b { color: #FF6B6B; font-family: var(--serif); }
  .grade-history .ts { font-family: var(--mono); color: #888; font-size: 0.54rem; }
  .grade-knode {
    display: flex; align-items: center; gap: 8px;
    background: white; border-radius: 7px; padding: 6px 9px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
  }
  .grade-knode .name { font-family: var(--serif); font-size: 0.68rem; color: #1a1a2e; font-weight: 700; flex: 1; }
  .grade-knode .bar { flex: 1; height: 5px; background: #f0f0f0; border-radius: 3px; overflow: hidden; position: relative; }
  .grade-knode .bar i { display: block; height: 100%; background: linear-gradient(90deg, #FFA94D, #FF6B6B); border-radius: 3px; }
  .grade-knode .pct { font-family: var(--mono); font-size: 0.6rem; color: #FF6B6B; font-weight: 700; min-width: 32px; text-align: right; }
  .grade-knode .delta { font-family: var(--mono); font-size: 0.54rem; color: #f39c12; }

  /* —— Tablet Q&A · real Socratic dialogue with problem card —— */
  .tab-qa-case { flex: 1; display: grid; grid-template-columns: 38% 62%; gap: 10px; min-height: 0; }
  .qa-problem {
    background: linear-gradient(180deg, #fff 0%, #fafbff 100%);
    border-radius: 8px; padding: 8px 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
    display: flex; flex-direction: column; gap: 6px;
    min-height: 0; overflow: hidden;
  }
  .qa-problem .topic {
    font-family: var(--mono); font-size: 0.56rem; font-weight: 700;
    color: #5b6cff; letter-spacing: 0.08em;
  }
  .qa-problem .qtext {
    font-family: var(--serif); font-size: 0.68rem; color: #1a1a2e;
    line-height: 1.5;
  }
  .qa-problem .qtext em { font-style: italic; color: #5b6cff; font-weight: 700; }
  .qa-problem .qfig {
    background: rgba(91, 108, 255,0.06);
    border-radius: 6px; padding: 8px 6px;
    text-align: center; font-family: var(--mono); font-size: 0.55rem;
    color: #555; line-height: 1.4;
  }
  .qa-problem .qfig svg { display: block; margin: 0 auto 3px; }
  .qa-problem .qkpoint {
    background: rgba(78,205,196,0.1); border-radius: 5px;
    padding: 5px 8px; font-size: 0.6rem; line-height: 1.4;
    color: #16847f; border-left: 2px solid #4ECDC4;
  }
  .qa-problem .qkpoint b { color: #0e6b65; }
  .qa-trace {
    display: flex; flex-direction: column; gap: 6px;
    min-height: 0;
  }
  .tab-chat-scroll {
    flex: 1; overflow: auto; padding-right: 4px;
    display: flex; flex-direction: column; gap: 6px;
    min-height: 0;
  }
  .tab-chat-scroll::-webkit-scrollbar { width: 4px; }
  .tab-chat-scroll::-webkit-scrollbar-thumb { background: rgba(78,205,196,0.4); border-radius: 2px; }
  .tab-bubble.ai .calc {
    font-family: var(--mono); font-size: 0.66rem;
    background: rgba(78,205,196,0.08); border-left: 2px solid #4ECDC4;
    padding: 3px 7px; border-radius: 3px;
    margin-top: 4px; color: #16847f; line-height: 1.5;
  }
  .tab-bubble.ai .calc b { color: #1a1a2e; }
  .tab-bubble.user.show-work {
    background: rgba(78,205,196,0.15); color: #1a1a2e;
    font-family: var(--mono); font-size: 0.7rem; line-height: 1.5;
  }
  .tab-bubble.ai .meta-tip {
    font-size: 0.62rem; color: #FF6B6B; margin-top: 4px;
    background: rgba(255,107,107,0.08); padding: 4px 6px; border-radius: 4px;
    border-left: 2px solid #FF6B6B;
  }
  .tab-bubble.ai .meta-tip b { color: #b53a3a; }

  /* —— Tablet · 步骤分判定 (step-credit, like 作业帮/学而思 真实判分粒度) —— */
  .grade-paper .grade-steps {
    display: flex; flex-direction: column; gap: 3px;
    margin-top: 6px;
    background: rgba(91, 108, 255,0.06); border-radius: 5px;
    padding: 5px 8px;
    border-left: 2px solid #5b6cff;
  }
  .grade-paper .grade-steps .step-h {
    font-family: var(--mono); font-size: 0.54rem; font-weight: 700;
    color: #5b6cff; letter-spacing: 0.08em;
    display: flex; align-items: baseline; gap: 6px;
  }
  .grade-paper .grade-steps .step-h .total {
    margin-left: auto; font-family: var(--mono); font-size: 0.62rem;
    color: #e74c3c; font-weight: 700; letter-spacing: 0.04em;
  }
  .grade-paper .grade-steps .step-row {
    display: grid; grid-template-columns: 14px 1fr auto;
    gap: 6px; align-items: baseline;
    font-size: 0.6rem; line-height: 1.4;
    padding: 1px 0;
  }
  .grade-paper .grade-steps .step-row .mark { font-weight: 700; }
  .grade-paper .grade-steps .step-row .mark.ok  { color: #2ecc71; }
  .grade-paper .grade-steps .step-row .mark.err { color: #e74c3c; }
  .grade-paper .grade-steps .step-row .lab b { color: #1a1a2e; font-weight: 700; }
  .grade-paper .grade-steps .step-row .score {
    font-family: var(--mono); font-size: 0.54rem; font-weight: 700;
    border-radius: 3px; padding: 1px 5px; letter-spacing: 0.02em;
  }
  .grade-paper .grade-steps .step-row .score.ok  { color: #2ecc71; background: rgba(46,204,113,0.12); }
  .grade-paper .grade-steps .step-row .score.err { color: #e74c3c; background: rgba(231,76,60,0.08); }

  /* —— Tablet · 批改 action chips (视频讲解 / 同类变式 / 知识图谱跳转) —— */
  .grade-actions {
    display: flex; gap: 5px; flex-wrap: wrap; margin-top: 6px;
  }
  .grade-action {
    background: white; border-radius: 14px;
    padding: 3px 9px 3px 7px; font-size: 0.58rem; line-height: 1.3;
    font-family: var(--sans); color: #1a1a2e; font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08), inset 0 0 0 1px rgba(20,30,60,0.08);
    display: inline-flex; align-items: center; gap: 5px;
    cursor: pointer; transition: all 0.15s;
    border: 0;
  }
  .grade-action:hover {
    box-shadow: 0 2px 6px rgba(91, 108, 255,0.18), inset 0 0 0 1px rgba(91, 108, 255,0.45);
    color: #5b6cff; transform: translateY(-1px);
  }
  .grade-action .ico { font-size: 0.7rem; }
  .grade-action .meta {
    font-family: var(--mono); font-size: 0.5rem; color: #888;
    font-weight: 600; margin-left: 2px;
  }

  /* —— Tablet · 答错分支 bubble (AI 不给答案，先点错点) —— */
  .tab-bubble.ai.branch-wrong {
    background: linear-gradient(135deg, #FFF5E6, #FFFAF0);
    border-left: 2px solid #FFA94D;
  }
  .tab-bubble.ai.branch-wrong b { color: #c97c00; font-weight: 700; }
  .tab-bubble.ai .branch-tag {
    font-size: 0.58rem; color: #c97c00; margin-top: 4px;
    background: rgba(255,169,77,0.14); padding: 3px 7px; border-radius: 4px;
    font-style: italic; line-height: 1.3;
    border-left: 2px solid #FFA94D;
  }
  .tab-bubble.user.show-work.wrong-attempt {
    background: rgba(255,169,77,0.16); color: #1a1a2e;
    border: 1px dashed rgba(255,169,77,0.5);
  }

  /* —— Tablet · Transfer test (变式题验证真懂，不只是听明白) —— */
  .tab-bubble.ai.transfer {
    background: linear-gradient(135deg, #EEF5FF, #F8FBFF);
    border-left: 2px solid #5b6cff;
    margin-top: 8px;
  }
  .tab-bubble.ai.transfer b { color: #5b6cff; font-weight: 700; }
  .tab-bubble.ai .transfer-tag {
    font-size: 0.58rem; color: #5b6cff; margin-top: 4px;
    background: rgba(91, 108, 255,0.08); padding: 3px 7px; border-radius: 4px;
    font-style: italic; line-height: 1.3;
    border-left: 2px solid #5b6cff;
  }

  /* —— Pen device (阿尔法蛋 风 · 真笔比例 ~6.5:1, 永远填满容器宽度) —— */
  .pen-stage-flex {
    display: flex; flex-direction: column;
    gap: 24px; align-items: center;
  }
  .pen-fit {
    container-type: inline-size;
    width: 100%; max-width: 1200px;     /* PC 上可拉到 1200，让笔身放大占满空间 */
    margin: 0 auto;
  }
  .pen-fit-spacer {
    width: 100%;
    height: 0;
    padding-bottom: 15.2174%;            /* 140/920 = 15.2174%, 维持 920:140 真笔比例 */
    position: relative;
  }
  .pen-frame {
    position: absolute; top: 0; left: 0;
    transform-origin: top left;
    /* CSS 媒体查询提供分档兜底（华为/老 WebView/iOS Safari 旧版都吃）·
       页面 JS 会在加载后用真实容器宽度精确覆盖此值 */
    transform: scale(0.4);
    width: 920px; height: 140px;
    background:
      linear-gradient(170deg,
        #ffffff 0%,
        #fcfdff 18%,
        #f5f6fa 55%,
        #e4e6ee 90%,
        #d4d7e0 100%);
    border-radius: 18px 6px 6px 18px;
    padding: 0;
    display: flex; flex-direction: row; align-items: stretch;
    box-shadow:
      0 32px 60px -18px rgba(20, 25, 50, 0.32),
      0 6px 14px -4px rgba(20, 25, 50, 0.08),
      inset 0 3px 8px -3px rgba(255,255,255,0.95),
      inset 0 -3px 8px -3px rgba(20, 25, 50, 0.12),
      inset 1px 0 0 rgba(255,255,255,0.95);
    overflow: visible;
  }
  /* 分档兜底（华为 / 老 Android WebView / iOS Safari 旧版 / 任何不支持 calc 除法的浏览器都吃）·
     JS 会在 load 时用真实 pen-fit 宽度精确覆盖，但这些档位保证页面首屏不会显示坏 */
  @media (min-width: 480px) { .pen-frame { transform: scale(0.45); } }
  @media (min-width: 600px) { .pen-frame { transform: scale(0.60); } }
  @media (min-width: 768px) { .pen-frame { transform: scale(0.78); } }
  @media (min-width: 920px) { .pen-frame { transform: scale(0.96); } }
  @media (min-width: 1100px){ .pen-frame { transform: scale(1.15); } }
  @media (min-width: 1240px){ .pen-frame { transform: scale(1.30); } }
  .pen-frame::before {
    content: ""; position: absolute;
    left: 70px; right: 110px; top: 6px; height: 1.5px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.85) 25%, rgba(255,255,255,0.85) 75%, transparent);
    border-radius: 1px; pointer-events: none;
  }
  .pen-frame::after {
    content: ""; position: absolute;
    left: 70px; right: 110px; bottom: 5px; height: 1.5px;
    background: linear-gradient(90deg, transparent, rgba(20, 25, 50, 0.1) 30%, rgba(20, 25, 50, 0.1) 70%, transparent);
    border-radius: 1px; pointer-events: none;
  }
  .pen-cap {
    width: 56px; flex-shrink: 0;
    background:
      linear-gradient(95deg, #2e2e3a 0%, #1a1a25 60%, #15151c 100%);
    border-radius: 18px 0 0 18px;
    position: relative;
    box-shadow:
      inset -2px 0 2px rgba(0,0,0,0.5),
      inset 2px 0 0 rgba(255,255,255,0.1),
      inset 0 0 12px rgba(0,0,0,0.3);
  }
  .pen-cap::before {
    content: ""; position: absolute;
    left: 14px; top: 50%; transform: translateY(-50%);
    width: 3px; height: 28px; background: #4a4a5a; border-radius: 2px;
    box-shadow: inset 1px 0 2px rgba(0,0,0,0.7), 1px 0 0 rgba(255,255,255,0.06);
  }
  .pen-cap::after {
    content: ""; position: absolute;
    right: 8px; top: 50%; transform: translateY(-50%);
    width: 4px; height: 4px; background: #5a5a6a; border-radius: 50%;
    box-shadow: 0 0 3px rgba(255,255,255,0.1);
  }
  .pen-cap-band {
    width: 8px; flex-shrink: 0;
    background:
      linear-gradient(95deg, #FFC44C 0%, #FFA02E 45%, #FF8A1F 70%, #E87010 100%);
    box-shadow:
      2px 0 4px rgba(255, 138, 31, 0.4),
      inset 1px 0 0 rgba(255,255,255,0.4),
      inset -1px 0 0 rgba(120, 50, 0, 0.25);
    position: relative; z-index: 1;
  }
  .pen-cap-band::after {
    content: ""; position: absolute;
    left: 1px; top: 8%; bottom: 8%; width: 1.5px;
    background: linear-gradient(180deg, transparent, rgba(255,255,255,0.6) 50%, transparent);
    border-radius: 1px;
  }
  .pen-screen-wrap { padding: 8px 8px; flex: 1; min-width: 0; display: flex; align-items: stretch; }
  .pen-screen {
    background: #fff8ee; border-radius: 7px;
    width: 100%; height: 100%;
    padding: 8px 10px;
    display: flex; flex-direction: column;
    font-size: 0.6rem; color: #2a2a3a;
    box-shadow:
      inset 0 0 0 2.5px #1a1a25,
      inset 0 0 0 5px #f5f0e0,
      0 2px 4px rgba(0,0,0,0.08);
    overflow: hidden; position: relative;
  }
  .pen-screen::before {
    content: ""; position: absolute;
    top: 8%; left: 6%; width: 40%; height: 12%;
    background: linear-gradient(135deg, rgba(255,255,255,0.45) 0%, transparent 70%);
    border-radius: 4px; pointer-events: none;
  }
  .pen-state { display: none; flex: 1; flex-direction: column; min-height: 0; position: relative; }
  .pen-state.active { display: flex; animation: protoFade 0.4s ease; }

  /* —— Pen status bar (top) —— */
  .pen-status-bar {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0 2px 4px;
    border-bottom: 1px solid rgba(20,30,60,0.08);
    margin-bottom: 5px;
    font-family: var(--mono); font-size: 0.5rem;
    color: #8088a0; flex-shrink: 0;
    letter-spacing: 0.04em;
  }
  .pen-status-bar .pen-mode-tag {
    font-family: var(--mono); font-size: 0.5rem; font-weight: 700;
    color: #FF7A1A; letter-spacing: 0.08em;
  }
  .pen-batt { font-weight: 700; color: #FF7A1A; }

  /* —— Page dots indicator —— */
  .pen-dots {
    display: flex; justify-content: center; gap: 4px;
    flex-shrink: 0; padding-top: 3px;
  }
  .pen-dots span {
    width: 4px; height: 4px; border-radius: 50%;
    background: rgba(20,30,60,0.18);
    transition: all 0.25s ease;
  }
  .pen-dots span.on {
    background: #FF7A1A; width: 12px; border-radius: 4px;
    box-shadow: 0 0 4px rgba(255,122,26,0.5);
  }

  /* —— Pen 主屏 · 横向 tile launcher (true 阿尔法蛋 范式：点击进入功能) —— */
  .pen-standby { padding: 0 !important; }
  .pen-home-bar {
    display: flex; align-items: baseline; justify-content: space-between;
    padding: 0 2px 4px; flex-shrink: 0;
    border-bottom: 1px solid rgba(20,30,60,0.06);
    margin-bottom: 5px;
  }
  .pen-home-bar .greet {
    font-family: var(--serif); font-size: 0.68rem; font-weight: 700;
    color: #2a2a3a;
  }
  .pen-home-bar .greet b { color: #FF7A1A; }
  .pen-home-bar .recent {
    font-family: var(--mono); font-size: 0.46rem; color: #8088a0;
    letter-spacing: 0.04em;
  }
  .pen-home-bar .recent b { color: #FF7A1A; font-family: var(--serif); font-size: 0.56rem; }
  .pen-home-tiles {
    flex: 1; display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 5px; align-content: center;
    padding: 1px 0;
  }
  .pen-tile {
    background: white; border: 0; cursor: pointer;
    border-radius: 8px; padding: 5px 3px 4px;
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    box-shadow:
      0 1px 3px rgba(20,30,60,0.08),
      inset 0 1px 0 rgba(255,255,255,1);
    transition: transform 0.12s, box-shadow 0.12s;
    font-family: inherit; position: relative;
  }
  .pen-tile:hover { transform: translateY(-1px); box-shadow: 0 3px 7px rgba(20,30,60,0.15), inset 0 1px 0 rgba(255,255,255,1); }
  .pen-tile:active { transform: scale(0.93); }
  .pen-tile-ico {
    width: 28px; height: 28px; border-radius: 7px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem; flex-shrink: 0;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), 0 1px 2px rgba(0,0,0,0.16);
  }
  .pen-tile-ico--scan  { background: linear-gradient(135deg, #FFE5C4, #FFB85C); }
  .pen-tile-ico--book  { background: linear-gradient(135deg, #D8F0C8, #79C268); }
  .pen-tile-ico--grade { background: linear-gradient(135deg, #FFD0D0, #FF7575); }
  .pen-tile-ico--qa    { background: linear-gradient(135deg, #C8E8FF, #4FA3E8); }
  .pen-tile-lab {
    font-family: var(--sans); font-size: 0.52rem; font-weight: 700;
    color: #2a2a3a; letter-spacing: 0.04em;
  }
  .pen-tile-sub {
    font-family: var(--mono); font-size: 0.42rem; color: #888;
    letter-spacing: 0.02em;
  }
  .pen-tile-badge {
    position: absolute; top: 3px; right: 3px;
    background: rgba(255,107,107,0.18); color: #c4252b;
    font-family: var(--mono); font-size: 0.4rem; font-weight: 700;
    padding: 0 3px; border-radius: 2px; letter-spacing: 0.06em;
    line-height: 1.3;
  }
  .pen-home-foot {
    display: flex; justify-content: space-between; align-items: baseline;
    padding-top: 3px; flex-shrink: 0;
    font-family: var(--mono); font-size: 0.42rem; color: #888;
    border-top: 1px dashed rgba(20,30,60,0.08);
  }
  .pen-home-foot b { color: #FF7A1A; font-weight: 700; }
  .pen-home-foot .due { color: #FF7A1A; font-weight: 700; }

  /* —— Pen back-bar · 简洁顶部导航条 (取代之前的彩色 banner) —— */
  .pen-back-bar {
    display: flex; align-items: center; gap: 6px;
    padding: 0 0 3px;
    border-bottom: 1px solid rgba(20,30,60,0.08);
    margin-bottom: 4px;
    flex-shrink: 0;
  }
  .pen-back-btn {
    background: 0; border: 0; cursor: pointer;
    font-family: var(--mono); font-size: 0.5rem; font-weight: 700;
    color: #FF7A1A; letter-spacing: 0.06em;
    padding: 0 4px 0 0; line-height: 1;
    transition: opacity 0.15s;
  }
  .pen-back-btn:hover { opacity: 0.75; }
  .pen-back-title {
    font-family: var(--serif); font-size: 0.66rem; font-weight: 700;
    color: #2a2a3a; flex: 1; line-height: 1;
  }
  .pen-back-tier {
    font-family: var(--mono); font-size: 0.4rem; font-weight: 700;
    letter-spacing: 0.1em; padding: 1px 4px; border-radius: 2px;
    background: rgba(179, 58, 58, 0.1); color: #c4252b;
  }
  .pen-back-meta {
    font-family: var(--mono); font-size: 0.46rem; color: #8088a0;
    letter-spacing: 0.06em;
  }

  /* —— Card 2 · Word result (landscape) —— */
  .pen-word-result { padding: 0 !important; }
  .pen-word-head {
    display: flex; align-items: center; gap: 6px;
    padding-bottom: 3px;
    border-bottom: 1px solid rgba(20,30,60,0.08);
    margin-bottom: 5px;
  }
  .pen-word-head .nav { font-family: var(--mono); font-size: 0.5rem; color: #888; cursor: pointer; padding: 0 4px; }
  .pen-word-head .word { font-family: var(--serif); font-weight: 700; font-size: 0.95rem; color: #FF7A1A; }
  .pen-word-head .speaker { font-size: 0.8rem; color: #FF7A1A; cursor: pointer; }
  .pen-word-head .phon { font-family: var(--mono); font-size: 0.54rem; color: #666; margin-left: 4px; }
  .pen-word-head .pageno { margin-left: auto; font-family: var(--mono); font-size: 0.5rem; color: #888; }
  .pen-word-body {
    flex: 1; display: grid; grid-template-columns: 1fr 90px; gap: 8px;
    min-height: 0;
  }
  .pen-word-body .senses { font-size: 0.6rem; line-height: 1.5; color: #2a2a3a; }
  .pen-word-body .senses .sense { padding: 1px 0; }
  .pen-word-body .senses .sense b { color: #FF7A1A; font-weight: 700; }
  .pen-word-body .eg { font-size: 0.56rem; color: #555; line-height: 1.35; font-style: italic; margin-top: 3px; }
  .pen-word-body .roots {
    display: flex; flex-direction: column; gap: 3px;
    border-left: 1px dashed rgba(20,30,60,0.15); padding-left: 6px;
  }
  .pen-word-body .roots .chip {
    background: rgba(255,138,31,0.1); border-radius: 4px;
    padding: 2px 5px; font-size: 0.5rem; line-height: 1.2;
  }
  .pen-word-body .roots .chip b { display: block; color: #FF7A1A; font-weight: 700; font-size: 0.46rem; }
  .pen-word-foot {
    display: flex; justify-content: space-between; align-items: center;
    padding-top: 4px; border-top: 1px dashed rgba(20,30,60,0.1);
    margin-top: 3px; flex-shrink: 0;
    font-family: var(--mono); font-size: 0.48rem; color: #888;
  }
  .pen-word-foot .dict { color: #FF7A1A; font-weight: 700; letter-spacing: 0.06em; }
  .pen-word-foot .nav-btn { cursor: pointer; padding: 2px 4px; }

  /* —— Card 3 · Bookmark list (2-column landscape) —— */
  .pen-bookmark { padding: 0 !important; }
  .pen-book-head {
    display: flex; align-items: center; gap: 6px;
    padding-bottom: 3px;
    border-bottom: 1px solid rgba(20,30,60,0.08);
    margin-bottom: 4px;
    font-family: var(--mono); font-size: 0.52rem; color: #2a2a3a;
  }
  .pen-book-head .ttl { font-family: var(--serif); font-weight: 700; font-size: 0.72rem; flex: 1; }
  .pen-book-head .filter { color: #FF7A1A; font-weight: 700; letter-spacing: 0.06em; }
  .pen-book-head .nav { cursor: pointer; font-size: 0.6rem; color: #888; padding: 0 4px; }
  .pen-book-grid {
    flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 3px 10px;
    align-content: start; min-height: 0;
  }
  .pen-book-row {
    display: grid; grid-template-columns: 1fr auto; gap: 6px;
    padding: 3px 0; border-bottom: 1px dashed rgba(20,30,60,0.08);
    align-items: baseline;
  }
  .pen-book-row .word { font-family: var(--serif); font-weight: 700; font-size: 0.62rem; color: #2a2a3a; }
  .pen-book-row .mean { font-size: 0.5rem; color: #666; }
  .pen-book-row .when { font-family: var(--mono); font-size: 0.46rem; color: #999; }
  .pen-book-foot {
    text-align: center; font-family: var(--mono); font-size: 0.48rem;
    color: #FF7A1A; font-weight: 700; padding-top: 3px;
  }

  /* —— Card 4 · Grade mini (4 题) —— */
  .pen-grade-mini { padding: 0 !important; }
  .pen-grade-mini .head {
    display: flex; align-items: center; gap: 6px;
    padding-bottom: 3px;
    border-bottom: 1px solid rgba(20,30,60,0.08);
    margin-bottom: 4px;
  }
  .pen-grade-mini .head .ttl { font-family: var(--serif); font-weight: 700; font-size: 0.72rem; color: #2a2a3a; flex: 1; }
  .pen-grade-mini .head .meta { font-family: var(--mono); font-size: 0.48rem; color: #FF7A1A; font-weight: 700; }
  .pen-grade-mini .stats {
    display: flex; gap: 6px; margin-bottom: 4px;
  }
  .pen-grade-mini .stat {
    flex: 1; background: white; border-radius: 5px;
    padding: 3px 5px; text-align: center;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  }
  .pen-grade-mini .stat .num { font-family: var(--mono); font-size: 0.66rem; font-weight: 700; color: #FF7A1A; }
  .pen-grade-mini .stat .lab { font-size: 0.42rem; color: #888; }
  .pen-grade-mini .rows {
    flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 1px 10px;
    align-content: start; min-height: 0;
  }
  .pen-grade-mini .row {
    display: grid; grid-template-columns: 12px 1fr; gap: 4px;
    padding: 2px 0; font-size: 0.52rem; line-height: 1.3;
    border-bottom: 1px dashed rgba(20,30,60,0.08);
  }
  .pen-grade-mini .ok { color: #2ecc71; font-weight: 700; }
  .pen-grade-mini .err { color: #e74c3c; font-weight: 700; }
  .pen-grade-mini .warn { color: #f39c12; font-weight: 700; }
  .pen-grade-mini .footer {
    font-family: var(--mono); font-size: 0.46rem; color: #888;
    text-align: center; padding-top: 3px; flex-shrink: 0;
  }
  .pen-grade-mini .footer b { color: #FF7A1A; font-weight: 700; }

  /* —— Card 5 · Voice Q&A mini —— */
  .pen-chat-mini { padding: 0 !important; }
  .pen-chat-mini .head {
    display: flex; align-items: center; gap: 6px;
    padding-bottom: 3px;
    border-bottom: 1px solid rgba(20,30,60,0.08);
    margin-bottom: 4px;
  }
  .pen-chat-mini .head .ttl { font-family: var(--serif); font-weight: 700; font-size: 0.7rem; color: #2a2a3a; flex: 1; }
  .pen-chat-mini .head .meta { font-family: var(--mono); font-size: 0.46rem; color: #FF7A1A; font-weight: 700; letter-spacing: 0.06em; }
  .pen-chat-mini .stream { flex: 1; display: flex; flex-direction: column; gap: 3px; font-size: 0.54rem; min-height: 0; overflow: hidden; }
  .pen-chat-mini .b { padding: 3px 6px; border-radius: 5px; max-width: 78%; line-height: 1.3; }
  .pen-chat-mini .b.user { background: #FF7A1A; color: white; align-self: flex-end; border-bottom-right-radius: 2px; }
  .pen-chat-mini .b.ai { background: white; align-self: flex-start; box-shadow: 0 1px 2px rgba(0,0,0,0.08); border-bottom-left-radius: 2px; }
  .pen-chat-mini .mic-state {
    display: flex; align-items: center; justify-content: center; gap: 5px;
    padding-top: 3px; border-top: 1px dashed rgba(20,30,60,0.1);
    font-family: var(--mono); font-size: 0.46rem; color: #FF7A1A; font-weight: 700;
    flex-shrink: 0;
  }
  .pen-chat-mini .mic-state::before {
    content: ""; width: 5px; height: 5px; border-radius: 50%;
    background: #ff3333; box-shadow: 0 0 4px #ff3333;
    animation: ledPulse 1.1s infinite;
  }

  /* —— Pen controls · T 圆键 home + 红色语音键 (阿尔法蛋 范式) —— */
  .pen-controls {
    display: flex; flex-direction: column; align-items: center; gap: 5px;
    padding: 0 7px; flex-shrink: 0;
    justify-content: center;
  }
  .pen-home-key {
    width: 26px; height: 26px;
    background:
      radial-gradient(circle at 32% 28%,
        #fafafa 0%, #d8d8e2 50%, #a8a8b8 100%);
    border-radius: 50%; border: 0; cursor: pointer;
    color: #2a2a3a;
    font-family: var(--serif); font-weight: 700; font-size: 0.78rem;
    font-style: italic;
    display: flex; align-items: center; justify-content: center;
    box-shadow:
      0 2px 5px rgba(0,0,0,0.22),
      inset 0 1px 1.5px rgba(255,255,255,0.85),
      inset 0 -1.5px 1.5px rgba(0,0,0,0.18);
    transition: transform 0.08s;
    padding: 0; line-height: 1;
  }
  .pen-home-key:hover {
    background: radial-gradient(circle at 32% 28%, #ffffff 0%, #e0e0ea 50%, #b0b0c0 100%);
  }
  .pen-home-key:active {
    transform: scale(0.92);
    box-shadow:
      0 1px 2px rgba(0,0,0,0.2),
      inset 0 -1.5px 1.5px rgba(0,0,0,0.18),
      inset 0 1px 1.5px rgba(255,255,255,0.6);
  }
  .pen-voice-key {
    width: 14px; height: 4px; border-radius: 2px;
    background: linear-gradient(180deg, #d44848, #a82020);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,0.35),
      0 1px 2px rgba(0,0,0,0.25);
    cursor: pointer;
  }
  .pen-led {
    width: 5px; height: 5px; border-radius: 50%;
    background: #FF7A1A;
    box-shadow:
      0 0 5px #FF7A1A,
      0 0 12px rgba(255, 122, 26, 0.55);
  }
  .pen-brand {
    font-family: var(--mono); font-size: 0.48rem;
    color: #8088a0; letter-spacing: 0.14em; font-weight: 700;
    flex-shrink: 0;
    writing-mode: vertical-rl; transform: rotate(180deg);
    padding: 6px 2px;
    text-shadow: 0 1px 0 rgba(255,255,255,0.6);
  }
  .pen-tip {
    width: 84px; flex-shrink: 0; align-self: stretch;
    background:
      linear-gradient(95deg, #2a2a3a 0%, #1a1a25 70%, #0a0a15 100%);
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    display: flex; align-items: center; justify-content: flex-end;
    padding-right: 4px;
    position: relative;
    box-shadow: 6px 0 12px -4px rgba(0,0,0,0.4);
  }
  .pen-tip::before {
    content: ""; position: absolute;
    top: 32%; bottom: 32%; left: 4px; width: 2px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.12) 50%, transparent);
    border-radius: 1px;
  }
  .pen-scan-glow {
    width: 6px; height: 6px; border-radius: 50%;
    background: radial-gradient(circle, #ff5050 0%, #ff3333 60%, #cc0000 100%);
    box-shadow:
      0 0 6px #ff3333,
      0 0 14px rgba(255, 51, 51, 0.65),
      0 0 26px rgba(255, 51, 51, 0.3);
    margin-right: 4px;
    animation: penTipPulse 2.2s ease-in-out infinite;
  }
  @keyframes penTipPulse {
    0%, 100% { opacity: 0.55; transform: scale(0.85); }
    50% { opacity: 1; transform: scale(1.05); }
  }
  .pen-notes {
    width: 100%; max-width: 640px; padding: 20px 24px;
    background: var(--paper); border-radius: 14px; border: 1px solid var(--rule);
    font-size: 0.9rem; color: var(--ink-soft); line-height: 1.55;
  }
  .pen-notes h4 { font-family: var(--serif); font-size: 1.1rem; color: var(--ink); margin-bottom: 8px; }
  .pen-notes p strong { color: var(--ink); font-weight: 600; }
  .pen-notes .gesture {
    display: grid; grid-template-columns: auto 1fr; gap: 8px 14px;
    margin-top: 14px;
  }
  .pen-notes .gesture dt {
    font-family: var(--mono); font-size: 0.74rem; color: var(--carmine);
    padding-top: 3px; white-space: nowrap;
  }
  .pen-notes .gesture dd { margin: 0; font-size: 0.85rem; padding: 2px 0; color: var(--ink); }

  /* —— Card + Phone device (钉钉 风) —— */
  .card-stage-flex {
    display: flex; gap: 44px; align-items: flex-start;
    justify-content: center; flex-wrap: wrap;
  }
  .card-device {
    width: 232px; height: 152px;
    background:
      linear-gradient(135deg, #fdfdff 0%, #f4f6fb 35%, #e6e9f1 75%, #d8dce6 100%);
    border-radius: 16px;
    padding: 14px 16px;
    box-shadow:
      0 22px 44px -14px rgba(20, 50, 100, 0.2),
      0 4px 10px -2px rgba(20, 50, 100, 0.08),
      inset 0 1px 0 rgba(255,255,255,1),
      inset 0 -1px 0 rgba(20, 30, 60, 0.08),
      inset 1.5px 0 0 rgba(255,255,255,0.7),
      inset -1.5px 0 0 rgba(20, 30, 60, 0.05);
    display: flex; flex-direction: column; justify-content: space-between;
    margin-top: 80px; position: relative;
  }
  .card-device::before {
    content: ""; position: absolute;
    top: 0; left: 16%; right: 16%; height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.95) 50%, transparent);
    pointer-events: none;
  }
  .card-device::after {
    content: ""; position: absolute;
    top:4px;right:4px;bottom:4px;left:4px; border-radius: 12px;
    box-shadow: inset 0 0 0 0.5px rgba(20, 30, 60, 0.05);
    pointer-events: none;
  }
  .card-top-row {
    display: flex; align-items: center; justify-content: space-between;
    position: relative; z-index: 1;
  }
  .card-led-cluster { display: flex; align-items: center; gap: 7px; }
  .card-led {
    width: 8px; height: 8px; border-radius: 50%;
    background: #c8ccd6;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
    transition: background 0.3s, box-shadow 0.3s;
  }
  .card-led.recording {
    background: #ff3333;
    box-shadow: 0 0 8px #ff3333, 0 0 16px rgba(255, 51, 51, 0.4);
    animation: ledPulse 1.2s infinite;
  }
  .card-led.confirming {
    background: #ffb800;
    box-shadow: 0 0 8px #ffb800, 0 0 16px rgba(255, 184, 0, 0.4);
    animation: ledPulse 0.8s infinite;
  }
  @keyframes ledPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(0.75); }
  }
  .card-led-label {
    font-family: var(--mono); font-size: 0.56rem;
    color: #8088a0; letter-spacing: 0.14em; font-weight: 700;
    text-shadow: 0 1px 0 rgba(255,255,255,0.6);
  }
  .card-mic-grille {
    width: 54px; height: 14px;
    background-image:
      radial-gradient(circle, #a8b0bc 1px, transparent 1.5px);
    background-size: 4px 4px;
    background-position: center;
    border-radius: 3px;
    box-shadow:
      inset 0 1px 2px rgba(20, 30, 60, 0.12),
      0 1px 0 rgba(255,255,255,0.6);
  }
  /* —— Card OLED strip + side keys —— */
  .card-oled-row {
    display: flex; align-items: center; gap: 8px;
    flex: 1; padding: 4px 0;
    position: relative; z-index: 1;
  }
  .card-key {
    width: 22px; height: 22px; flex-shrink: 0;
    border-radius: 50%; border: 0; cursor: pointer;
    background:
      radial-gradient(circle at 32% 30%, #ffffff 0%, #ebeef4 55%, #c8cdd6 100%);
    box-shadow:
      inset 0 1px 1px rgba(255,255,255,0.95),
      inset 0 -1px 2px rgba(20,30,60,0.18),
      0 1.5px 3px rgba(20,30,60,0.12);
    font-family: var(--sans); font-size: 0.6rem; font-weight: 700;
    color: #6a7280;
    display: flex; align-items: center; justify-content: center;
    transition: transform 0.15s, box-shadow 0.15s;
  }
  .card-key:hover { transform: scale(0.94); }
  .card-key:active {
    transform: scale(0.84);
    box-shadow:
      inset 0 2px 3px rgba(20,30,60,0.25),
      0 0.5px 1px rgba(20,30,60,0.08);
  }
  .card-key.card-key-up { color: #5b6cff; }
  .card-key.card-key-down { color: #8b94a1; }

  .card-oled {
    flex: 1; height: 38px;
    background: linear-gradient(180deg, #08080e 0%, #14141c 100%);
    border-radius: 5px; padding: 4px 10px;
    display: flex; align-items: center; justify-content: center;
    position: relative; overflow: hidden;
    box-shadow:
      inset 0 1.5px 2px rgba(0,0,0,0.65),
      inset 0 -1px 0 rgba(255,255,255,0.04),
      0 1px 0 rgba(255,255,255,0.55);
  }
  .card-oled::before {
    content: ""; position: absolute; top:0;right:0;bottom:0;left:0;
    background-image: repeating-linear-gradient(
      0deg, transparent 0, transparent 1.5px,
      rgba(255,255,255,0.022) 1.5px, rgba(255,255,255,0.022) 2px);
    pointer-events: none;
  }
  .card-oled::after {
    content: ""; position: absolute;
    top: -8px; left: -8px; width: 28px; height: 18px;
    background: radial-gradient(ellipse, rgba(255,255,255,0.06), transparent 70%);
    pointer-events: none;
  }
  .card-oled-content {
    display: flex; align-items: center; gap: 7px;
    position: relative; z-index: 1; width: 100%;
    justify-content: center; min-width: 0;
  }
  .oled-ico {
    font-size: 0.82rem; font-weight: 700;
    color: #FFB85C;
    text-shadow: 0 0 4px rgba(255, 184, 92, 0.6);
    flex-shrink: 0;
  }
  .oled-text {
    font-family: var(--mono); font-size: 0.66rem;
    color: #FFE0A0; letter-spacing: 0.06em;
    text-shadow: 0 0 4px rgba(255, 184, 92, 0.45);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .card-oled.recording .oled-ico { color: #ff5050; text-shadow: 0 0 4px rgba(255,80,80,0.6); animation: ledPulse 1.2s infinite; }
  .card-oled.recording .oled-text { color: #ff9090; text-shadow: 0 0 4px rgba(255,80,80,0.5); }
  .card-oled.confirming .oled-ico { color: #ffb800; text-shadow: 0 0 4px rgba(255,184,0,0.6); animation: ledPulse 0.8s infinite; }
  .card-oled.confirming .oled-text { color: #ffd060; text-shadow: 0 0 4px rgba(255,184,0,0.5); }
  .card-oled.active .oled-ico { color: #22c3ee; text-shadow: 0 0 4px rgba(77,156,255,0.6); }
  .card-oled.active .oled-text { color: #8FB8FF; text-shadow: 0 0 4px rgba(77,156,255,0.5); }

  /* —— Agent flow view (in phone APP) —— */
  .agent-role-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 8px;
  }
  .agent-role-switch {
    display: flex; gap: 2px;
    background: rgba(91, 108, 255, 0.1); border-radius: 999px;
    padding: 2px;
  }
  .agent-role {
    background: transparent; border: 0; cursor: pointer;
    padding: 3px 10px; border-radius: 999px;
    font-size: 0.6rem; color: #5b6cff;
    font-family: var(--sans); font-weight: 600;
    transition: all 0.25s ease;
  }
  .agent-role.active {
    background: linear-gradient(135deg, #5b6cff, #22c3ee);
    color: white;
    box-shadow: 0 2px 6px -2px rgba(91, 108, 255, 0.5);
  }
  .agent-content { display: none; flex-direction: column; gap: 7px; }
  .agent-content.active { display: flex; animation: protoFade 0.4s ease; }

  .agent-card {
    background: white; border-radius: 10px;
    padding: 10px 12px; font-size: 0.7rem; line-height: 1.5; color: #333;
  }
  .agent-card-head {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 5px;
  }
  .agent-step {
    font-family: var(--mono); font-size: 0.54rem; color: #8b94a1;
    letter-spacing: 0.08em; font-weight: 700;
  }
  .agent-status-tag {
    font-family: var(--mono); font-size: 0.52rem;
    padding: 2px 6px; border-radius: 4px; font-weight: 700;
    letter-spacing: 0.04em;
  }
  .agent-status-tag.done { background: #e8f5e9; color: #2ecc71; }
  .agent-status-tag.run { background: #e6f3ff; color: #5b6cff; animation: runShimmer 1.6s infinite; }
  .agent-status-tag.wait { background: #fff5e6; color: #ff9500; }
  .agent-status-tag.err { background: #fff0ee; color: #c4433a; }
  @keyframes runShimmer { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } }
  .agent-card h5 {
    font-family: var(--serif); font-size: 0.76rem;
    color: #1a1a2e; margin: 0 0 4px;
  }
  .agent-card .agent-blurb { font-size: 0.66rem; color: #444; line-height: 1.5; }
  .agent-card .agent-blurb strong { color: #5b6cff; font-weight: 600; }
  .agent-match-list {
    display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap;
  }
  .agent-match-list .m {
    font-family: var(--mono); font-size: 0.54rem; font-weight: 700;
    padding: 2px 6px; border-radius: 4px;
    background: #e6f3ff; color: #5b6cff;
    letter-spacing: 0.02em;
  }
  .agent-match-list .m strong { font-weight: 700; }
  .agent-match-list .m.mute { background: #f0f0f0; color: #999; }

  .agent-stream {
    display: flex; flex-direction: column; gap: 0;
    position: relative;
  }
  .agent-flow {
    display: grid; grid-template-columns: 18px 1fr; gap: 8px;
    align-items: start; position: relative;
    padding: 4px 0;
  }
  .agent-flow + .agent-flow::before {
    content: ""; position: absolute;
    left: 8px; top: -4px; height: 12px; width: 1.5px;
    background: rgba(20, 30, 60, 0.12);
    border-radius: 1px;
  }
  .agent-dot {
    width: 14px; height: 14px; border-radius: 50%;
    background: white;
    box-shadow: 0 0 0 2.5px white, 0 0 0 3.5px rgba(20,30,60,0.08);
    position: relative; flex-shrink: 0;
    margin-top: 5px;
  }
  .agent-dot::before {
    content: ""; position: absolute;
    top:3px;right:3px;bottom:3px;left:3px; border-radius: 50%;
  }
  .agent-flow.done .agent-dot::before { background: #2ecc71; }
  .agent-flow.run .agent-dot::before {
    background: #5b6cff;
    box-shadow: 0 0 6px rgba(91, 108, 255, 0.6);
    animation: dotPulse 1.4s infinite;
  }
  .agent-flow.pending .agent-dot::before {
    background: #ff9500;
    box-shadow: 0 0 6px rgba(255, 149, 0, 0.6);
    animation: dotPulse 1.4s infinite;
  }
  .agent-flow.err .agent-dot::before { background: #c4433a; box-shadow: 0 0 6px rgba(196, 67, 58, 0.6); }
  .agent-flow.err .agent-flow-body { background: #fff5f4; border: 1px solid #f5cdc7; }
  .agent-flow-body {
    background: white; border-radius: 10px;
    padding: 9px 11px; font-size: 0.7rem;
  }
  .agent-flow-title {
    font-family: var(--serif); font-weight: 700;
    font-size: 0.74rem; color: #1a1a2e;
    margin-bottom: 6px; line-height: 1.3;
  }
  .agent-flow-trace {
    display: flex; flex-direction: column; gap: 2px;
    margin-bottom: 5px;
  }
  .trace-step {
    font-size: 0.6rem; color: #999;
    font-family: var(--mono);
    display: grid; grid-template-columns: 10px 1fr; gap: 5px;
    align-items: baseline; padding: 1px 0;
  }
  .trace-step::before {
    content: "▸"; color: #ccc; font-size: 0.56rem;
  }
  .trace-step.done { color: #555; }
  .trace-step.done::before { content: "✓"; color: #2ecc71; font-weight: 700; }
  .trace-step.active { color: #5b6cff; font-weight: 600; }
  .trace-step.active::before { content: "●"; color: #5b6cff; animation: dotPulse 1.4s infinite; }

  .agent-result {
    display: block;
    background: linear-gradient(135deg, #e6f3ff 0%, #f0f8ff 100%);
    border-radius: 6px; padding: 6px 8px;
    font-size: 0.6rem; color: #5b6cff;
    font-family: var(--mono); font-weight: 600;
    margin-top: 4px;
    letter-spacing: 0.02em;
  }
  .agent-card-mirror {
    background: linear-gradient(180deg, #08080e, #14141c);
    border-radius: 6px;
    padding: 7px 9px; margin-top: 5px;
    display: flex; align-items: center; gap: 7px;
    position: relative; overflow: hidden;
  }
  .agent-card-mirror::after {
    content: ""; position: absolute; top:0;right:0;bottom:0;left:0;
    background-image: repeating-linear-gradient(
      0deg, transparent 0, transparent 1.5px,
      rgba(255,255,255,0.02) 1.5px, rgba(255,255,255,0.02) 2px);
    pointer-events: none;
  }
  .card-mini-label {
    font-family: var(--mono); font-size: 0.48rem;
    color: #8b94a1; letter-spacing: 0.08em;
    text-transform: uppercase; flex-shrink: 0;
  }
  .card-mini-led {
    width: 5px; height: 5px; border-radius: 50%; flex-shrink: 0;
    background: #ffb800; box-shadow: 0 0 4px #ffb800;
    animation: ledPulse 0.8s infinite;
  }
  .card-mini-text {
    font-family: var(--mono); font-size: 0.6rem;
    color: #ffd060; letter-spacing: 0.04em;
    text-shadow: 0 0 4px rgba(255, 184, 92, 0.5);
    flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    position: relative; z-index: 1;
  }
  .card-mini-keys {
    font-family: var(--mono); font-size: 0.5rem;
    color: #8b94a1; letter-spacing: 0.08em;
    flex-shrink: 0;
  }

  /* —— Agent progress bar (5 stages) —— */
  .agent-progress {
    margin-top: 8px; padding-top: 7px;
    border-top: 1px dashed #ebedf0;
  }
  .agent-progress-bar {
    display: grid; grid-template-columns: repeat(5, 1fr);
    gap: 2px; height: 4px;
    border-radius: 2px; overflow: hidden;
    margin-bottom: 4px;
  }
  .agent-progress-seg {
    background: #ebedf0;
    transition: background 0.3s;
    border-radius: 1px;
  }
  .agent-progress-seg.done { background: #2ecc71; }
  .agent-progress-seg.active {
    background: linear-gradient(90deg, #5b6cff, #22c3ee, #5b6cff);
    background-size: 200% 100%;
    animation: progressShimmer 1.6s linear infinite;
  }
  .agent-progress-seg.pending { background: #ffb964; }
  @keyframes progressShimmer {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
  }
  .agent-stage-labels {
    display: grid; grid-template-columns: repeat(5, 1fr); gap: 2px;
    font-family: var(--mono); font-size: 0.46rem;
    color: #b8bdc6; letter-spacing: 0.06em;
  }
  .agent-stage-labels span { text-align: center; padding: 0 1px; }
  .agent-stage-labels span.done { color: #2ecc71; font-weight: 700; }
  .agent-stage-labels span.active { color: #5b6cff; font-weight: 700; }
  .agent-stage-labels span.pending { color: #ff9500; font-weight: 700; }

  /* —— Role switcher: scrollable 6-role chips —— */
  .agent-role-row {
    display: flex; align-items: center;
    flex-wrap: wrap; gap: 6px;
  }
  .agent-role-switch {
    display: flex; gap: 3px;
    background: rgba(91, 108, 255, 0.08); border-radius: 999px;
    padding: 2px;
    overflow-x: auto;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .agent-role-switch::-webkit-scrollbar { display: none; }
  .agent-role {
    background: transparent; border: 0; cursor: pointer;
    padding: 4px 8px; border-radius: 999px;
    font-size: 0.58rem; color: #5b6cff;
    font-family: var(--sans); font-weight: 600;
    transition: all 0.25s ease;
    white-space: nowrap; flex-shrink: 0;
    position: relative;
  }
  .agent-role.active {
    background: linear-gradient(135deg, #5b6cff, #22c3ee);
    color: white;
    box-shadow: 0 2px 6px -2px rgba(91, 108, 255, 0.5);
  }
  .agent-role.learned::after {
    content: "★"; position: absolute;
    top: -1px; right: 0;
    font-size: 0.5rem; color: #FFB400;
    text-shadow: 0 1px 1px rgba(0,0,0,0.2);
  }

  /* —— Role learning placeholder (for not-yet-trained roles) —— */
  .agent-learning {
    background: white; border-radius: 10px;
    padding: 14px 14px 12px;
    text-align: left;
  }
  .agent-learning-head {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 8px;
  }
  .agent-learning-ico {
    width: 32px; height: 32px; border-radius: 50%;
    background: linear-gradient(135deg, #FFF5E0, #FFD18A);
    color: #B86500;
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem; flex-shrink: 0;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
  }
  .agent-learning h5 {
    font-family: var(--serif); font-size: 0.82rem;
    color: #1a1a2e; margin: 0 0 2px;
  }
  .agent-learning .sub {
    font-family: var(--mono); font-size: 0.54rem;
    color: #FFB400; letter-spacing: 0.04em; font-weight: 700;
  }
  .agent-learning p {
    font-size: 0.66rem; color: #444; line-height: 1.55;
    margin-bottom: 8px;
  }
  .agent-learning p strong { color: #5b6cff; font-weight: 600; }
  .agent-learning .preview {
    background: #f8f9fc; border-radius: 7px;
    padding: 8px 10px; margin: 8px 0;
    font-family: var(--mono); font-size: 0.58rem;
    color: #888; line-height: 1.6;
  }
  .agent-learning .preview b { color: #1a1a2e; }

  /* —— Memory view: enriched cards —— */
  .mem-decision-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
    margin-top: 4px;
  }
  .mem-decision-cell {
    background: linear-gradient(135deg, #f8f9fc 0%, #eef1f7 100%);
    border-radius: 7px; padding: 8px 10px;
    display: flex; flex-direction: column; gap: 2px;
  }
  .mem-decision-cell .lab {
    font-family: var(--mono); font-size: 0.5rem;
    color: #8088a0; letter-spacing: 0.06em;
    text-transform: uppercase;
  }
  .mem-decision-cell .val {
    font-family: var(--serif); font-weight: 700;
    font-size: 0.95rem; color: #5b6cff;
    line-height: 1.1;
  }
  .mem-decision-cell .val small {
    font-family: var(--sans); font-weight: 500;
    font-size: 0.56rem; color: #888; margin-left: 4px;
  }

  .mem-radar { display: flex; flex-direction: column; gap: 5px; margin-top: 4px; }
  .mem-radar-row {
    display: grid; grid-template-columns: 64px 1fr 30px;
    gap: 6px; align-items: center;
    font-size: 0.62rem;
  }
  .mem-radar-row .topic { color: #1a1a2e; font-weight: 600; font-size: 0.66rem; }
  .mem-radar-row .bar {
    height: 6px; background: #f0f0f0;
    border-radius: 3px; overflow: hidden;
    position: relative;
  }
  .mem-radar-row .bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #5b6cff, #22c3ee);
    border-radius: 3px;
    box-shadow: 0 0 4px rgba(91, 108, 255, 0.3);
  }
  .mem-radar-row .count {
    font-family: var(--mono); font-size: 0.6rem;
    color: #5b6cff; font-weight: 700; text-align: right;
  }

  .mem-thread {
    display: grid; grid-template-columns: 18px 1fr auto;
    gap: 8px; align-items: center;
    padding: 7px 0; border-top: 1px solid #f5f5f5;
    font-size: 0.7rem;
  }
  .mem-thread:first-of-type { border-top: 0; padding-top: 2px; }
  .mem-thread .ico {
    color: #5b6cff; font-size: 0.9rem;
    text-align: center;
  }
  .mem-thread .body .name { color: #1a1a2e; font-weight: 600; font-size: 0.7rem; }
  .mem-thread .body small {
    display: block; color: #888; font-size: 0.58rem;
    margin-top: 1px; font-family: var(--mono);
  }
  .mem-thread .count {
    font-family: var(--mono); font-size: 0.62rem;
    color: #5b6cff; font-weight: 700;
    background: #e6f3ff; padding: 3px 7px; border-radius: 4px;
    white-space: nowrap;
  }

  .mem-cohort-row {
    display: grid; grid-template-columns: 1fr auto;
    gap: 8px; align-items: baseline;
    padding: 7px 0; border-top: 1px solid #f5f5f5;
    font-size: 0.7rem;
  }
  .mem-cohort-row:first-of-type { border-top: 0; padding-top: 2px; }
  .mem-cohort-row .lab { color: #1a1a2e; font-weight: 600; }
  .mem-cohort-row .lab small {
    display: block; color: #888; font-size: 0.56rem;
    font-family: var(--mono); margin-top: 1px;
  }
  .mem-cohort-row .vs {
    text-align: right; font-family: var(--mono);
    display: flex; flex-direction: column; align-items: flex-end; gap: 1px;
  }
  .mem-cohort-row .vs b {
    color: #2ecc71; font-size: 0.86rem; font-weight: 700;
    font-family: var(--serif);
  }
  .mem-cohort-row .vs .mean {
    color: #999; font-size: 0.52rem;
    letter-spacing: 0.02em;
  }

  /* —— Tablet · grade accuracy banner + error category tags —— */
  .tab-grade-banner {
    display: grid; grid-template-columns: 1fr 1fr 1fr;
    gap: 6px; margin-bottom: 8px;
  }
  .tab-grade-stat {
    background: white; border-radius: 8px;
    padding: 7px 8px; text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  }
  .tab-grade-stat .num {
    font-family: var(--serif); font-weight: 900;
    font-size: 1.05rem; color: #FF6B6B; line-height: 1;
  }
  .tab-grade-stat .num.teal { color: #4ECDC4; }
  .tab-grade-stat .num.amber { color: #FFA94D; }
  .tab-grade-stat .lab {
    font-size: 0.56rem; color: #888;
    font-family: var(--mono); margin-top: 4px;
    letter-spacing: 0.04em;
  }
  .tab-grade-tags {
    display: flex; flex-wrap: wrap; gap: 4px;
    margin: 6px 0 8px;
  }
  .tab-grade-tags .tag {
    font-family: var(--mono); font-size: 0.6rem;
    padding: 2px 7px; border-radius: 4px;
    font-weight: 700; letter-spacing: 0.02em;
  }
  .tab-grade-tags .tag-审题 { background: #FFF1F1; color: #E74C3C; }
  .tab-grade-tags .tag-单位 { background: #FFF7E6; color: #F39C12; }
  .tab-grade-tags .tag-相关 { background: #E8F4FF; color: #5b6cff; }
  .tab-grade-tags .tag-知识 { background: #E8F8F7; color: #4ECDC4; }

  /* —— Tablet · Socratic phase stepper (Q&A screen) —— */
  .tab-socratic {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 5px; margin-bottom: 10px;
  }
  .tab-socratic .ph {
    background: white; border-radius: 7px;
    padding: 6px 4px 5px; text-align: center;
    font-family: var(--mono); font-size: 0.6rem; font-weight: 700;
    color: #aaa; box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    position: relative;
    letter-spacing: 0.04em;
  }
  .tab-socratic .ph::before {
    content: ""; display: block;
    width: 5px; height: 5px;
    background: #ddd; border-radius: 50%;
    margin: 0 auto 3px;
  }
  .tab-socratic .ph.done { color: #2ecc71; }
  .tab-socratic .ph.done::before { background: #2ecc71; }
  .tab-socratic .ph.active { color: #4ECDC4; }
  .tab-socratic .ph.active::before {
    background: #4ECDC4;
    box-shadow: 0 0 6px rgba(78, 205, 196, 0.7);
    animation: dotPulse 1.4s infinite;
  }

  /* —— Tablet · speak metacognition feedback card —— */
  .tab-speak-feedback {
    background: white; border-radius: 8px;
    margin-top: 6px; padding: 7px 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    width: 100%;
  }
  .tab-speak-feedback .fb-row {
    display: grid; grid-template-columns: 64px 1fr;
    gap: 8px; padding: 3px 0;
    align-items: baseline;
    font-size: 0.66rem;
  }
  .tab-speak-feedback .fb-lab {
    font-family: var(--mono); color: #FFA94D;
    font-weight: 700; font-size: 0.56rem;
    letter-spacing: 0.04em;
  }
  .tab-speak-feedback .fb-val { color: #333; line-height: 1.4; }
  .tab-speak-feedback .fb-val strong { color: #1a1a2e; font-weight: 700; }

  /* —— Tablet · 学习报告 screen (knowledge graph + spaced repetition) —— */
  .tab-mastery-h {
    font-family: var(--mono); font-size: 0.58rem;
    color: #888; letter-spacing: 0.08em;
    text-transform: uppercase; margin-bottom: 6px;
    font-weight: 700;
  }
  .tab-mastery {
    background: white; border-radius: 10px;
    padding: 10px 12px; margin-bottom: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
  }
  .tab-mastery-pulse {
    display: flex; gap: 8px;
    align-items: baseline; margin-bottom: 8px;
  }
  .tab-mastery-pulse .big {
    font-family: var(--serif); font-weight: 900;
    font-size: 1.5rem; color: #4ECDC4; line-height: 1;
  }
  .tab-mastery-pulse .lab {
    font-size: 0.66rem; color: #555;
  }
  .tab-mastery-pulse .delta {
    margin-left: auto;
    font-family: var(--mono); font-size: 0.66rem;
    color: #2ecc71; font-weight: 700;
  }
  .tab-graph {
    display: flex; flex-wrap: wrap; gap: 4px;
    padding-top: 6px;
    border-top: 1px solid #f5f5f5;
  }
  .tab-graph .node {
    font-family: var(--sans); font-size: 0.64rem; font-weight: 700;
    padding: 4px 8px; border-radius: 999px;
    background: #f0f0f0; color: #888;
  }
  .tab-graph .node.done {
    background: #E8F5E9; color: #2ecc71;
  }
  .tab-graph .node.active {
    background: linear-gradient(135deg, #4ECDC4, #44B5AB);
    color: white;
    box-shadow: 0 2px 6px -2px rgba(78, 205, 196, 0.5);
  }
  .tab-graph .node.weak {
    background: #FFF5F5; color: #E74C3C;
  }
  .tab-graph .node.weak::before {
    content: "⚠ "; font-size: 0.6em;
  }
  .tab-spaced {
    background: white; border-radius: 10px;
    padding: 10px 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
  }
  .tab-spaced-row {
    display: grid; grid-template-columns: 56px 1fr auto;
    gap: 8px; padding: 5px 0; align-items: baseline;
    font-size: 0.7rem;
    border-top: 1px dashed #f0f0f0;
  }
  .tab-spaced-row:first-of-type { border-top: 0; }
  .tab-spaced-row .when {
    font-family: var(--mono); font-size: 0.6rem;
    color: #FF6B6B; font-weight: 700;
    letter-spacing: 0.04em;
  }
  .tab-spaced-row .topic { color: #1a1a2e; font-weight: 600; }
  .tab-spaced-row .topic small {
    font-family: var(--mono); font-size: 0.54rem;
    color: #888; font-weight: 500; display: block; margin-top: 1px;
  }
  .tab-spaced-row .count {
    font-family: var(--mono); font-size: 0.58rem;
    color: #4ECDC4; font-weight: 700;
    background: #E8F8F7; padding: 2px 6px; border-radius: 4px;
  }

  /* —— Pen · word root chips —— */
  .pen-word-result .roots {
    display: flex; gap: 3px; flex-wrap: wrap;
    margin-top: 4px;
  }
  .pen-word-result .roots .chip {
    font-family: var(--mono); font-size: 0.5rem;
    padding: 1px 5px; border-radius: 3px;
    background: #fff3e0; color: #B86500;
    font-weight: 700; letter-spacing: 0.04em;
  }
  .pen-word-result .roots .chip b { color: #E87010; }

  /* —— Pen: scan-first home (replaces app grid) —— */
  .pen-mode-tag {
    background: #FFF1E0; color: #FF7A1A;
    padding: 1px 5px; border-radius: 3px;
    font-weight: 700; letter-spacing: 0.04em;
  }
  .pen-scan-call {
    flex: 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 5px;
    padding: 8px 0 4px;
  }
  .pen-scan-call .scan-target {
    width: 64px; height: 32px;
    border: 2px dashed #FF7A1A;
    border-radius: 4px;
    background: rgba(255, 122, 26, 0.05);
    position: relative; overflow: hidden;
    display: flex; align-items: center; justify-content: center;
  }
  .pen-scan-call .scan-target::before {
    content: "abc"; font-family: var(--serif);
    font-style: italic; font-size: 0.74rem; font-weight: 700;
    color: rgba(255, 122, 26, 0.55);
    letter-spacing: 0.04em;
  }
  .pen-scan-call .scan-target::after {
    content: ""; position: absolute;
    left: 2px; right: 2px; height: 2px;
    background: linear-gradient(90deg, transparent, #FF7A1A, transparent);
    box-shadow: 0 0 6px rgba(255, 122, 26, 0.6);
    animation: scanSweep 1.8s ease-in-out infinite;
  }
  @keyframes scanSweep {
    0%, 100% { top: 2px; opacity: 0.3; }
    50% { top: calc(100% - 4px); opacity: 1; }
  }
  .pen-scan-call .lab {
    font-family: var(--serif); font-weight: 700;
    font-size: 0.64rem; color: #2a2a3a; text-align: center;
    margin-top: 4px;
  }
  .pen-scan-call .sub {
    font-family: var(--mono); font-size: 0.48rem;
    color: #8088a0; letter-spacing: 0.04em;
    font-weight: 700;
  }
  .pen-recent {
    background: white; border-radius: 5px;
    padding: 4px 7px;
    display: grid; grid-template-columns: auto 1fr auto;
    gap: 6px; align-items: baseline;
    box-shadow: 0 1px 2px rgba(20,30,60,0.06);
    flex-shrink: 0; margin-bottom: 4px; cursor: pointer;
  }
  .pen-recent .lab {
    font-family: var(--mono); font-size: 0.46rem;
    color: #8088a0; font-weight: 700; letter-spacing: 0.04em;
  }
  .pen-recent .word {
    font-family: var(--serif); font-weight: 700;
    color: #FF7A1A; font-size: 0.62rem;
  }
  .pen-recent .arrow {
    color: #FF7A1A; font-size: 0.72rem;
    line-height: 1;
  }
  .pen-bottombar {
    display: flex; justify-content: space-around;
    padding-top: 4px;
    border-top: 1px solid rgba(20,30,60,0.08);
    font-family: var(--mono); font-size: 0.48rem;
    color: #8088a0; font-weight: 700;
    flex-shrink: 0; letter-spacing: 0.04em;
  }
  .pen-bottombar span { cursor: pointer; padding: 2px 3px; }
  .pen-bottombar span.active { color: #FF7A1A; }

  /* —— Pen word result refined (head + multi-sense + footer nav) —— */
  .word-head {
    display: flex; justify-content: space-between; align-items: center;
    padding-bottom: 3px;
    border-bottom: 1px dashed rgba(20,30,60,0.1);
    margin-bottom: 4px;
    font-family: var(--mono); font-size: 0.52rem;
    color: #8088a0; font-weight: 700; letter-spacing: 0.04em;
  }
  .word-head .ico {
    cursor: pointer; color: #FF7A1A;
    font-size: 0.86rem; line-height: 1;
  }
  .pen-word-result h4 {
    display: flex; justify-content: space-between; align-items: baseline;
  }
  .pen-word-result h4 .speaker {
    font-size: 0.74rem; color: #FF7A1A; cursor: pointer;
  }
  .pen-word-result .senses {
    display: flex; flex-direction: column; gap: 1px;
    margin: 4px 0 3px;
  }
  .pen-word-result .sense {
    font-size: 0.6rem; color: #2a2a3a;
    line-height: 1.4; font-weight: 500;
  }
  .word-nav {
    margin-top: auto; padding-top: 4px;
    border-top: 1px dashed rgba(20,30,60,0.1);
    display: flex; justify-content: space-between; align-items: center;
    font-family: var(--mono); font-size: 0.48rem;
    color: #8088a0; font-weight: 700; letter-spacing: 0.02em;
  }
  .word-nav .dict {
    background: #FFF1E0; color: #FF7A1A;
    padding: 1px 5px; border-radius: 3px; font-weight: 700;
  }
  .word-nav .nav-btn { cursor: pointer; }
  .word-nav .nav-btn:hover { color: #FF7A1A; }

  /* —— Pen wordbook list view —— */
  .pen-bookmark { padding: 0; }
  .book-head {
    display: flex; justify-content: space-between; align-items: center;
    padding-bottom: 5px;
    border-bottom: 1px solid rgba(20,30,60,0.1);
    margin-bottom: 4px; flex-shrink: 0;
  }
  .book-head .ico { cursor: pointer; color: #FF7A1A; font-size: 0.86rem; line-height: 1; }
  .book-head .ttl { font-family: var(--serif); font-size: 0.66rem; font-weight: 700; color: #2a2a3a; }
  .book-head .filter {
    background: #FFF1E0; color: #FF7A1A;
    padding: 1px 5px; border-radius: 3px;
    font-size: 0.46rem; font-weight: 700;
    font-family: var(--mono); letter-spacing: 0.04em;
  }
  .book-list {
    display: flex; flex-direction: column;
    flex: 1; overflow: hidden;
  }
  .book-row {
    display: grid; grid-template-columns: 1fr auto;
    gap: 4px; padding: 4px 0;
    border-bottom: 1px solid rgba(20,30,60,0.06);
    align-items: center;
  }
  .book-row:last-of-type { border-bottom: 0; }
  .book-row .book-word {
    font-family: var(--serif); font-weight: 700;
    color: #2a2a3a; font-size: 0.6rem;
    line-height: 1.1;
  }
  .book-row .book-mean {
    color: #666; font-size: 0.48rem;
    font-family: var(--sans); margin-top: 1px;
  }
  .book-row .book-when {
    font-family: var(--mono); font-size: 0.46rem;
    color: #FF7A1A; font-weight: 700;
  }
  .card-bottom-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 8px; position: relative; z-index: 1;
  }
  .card-brand {
    font-family: var(--mono); font-size: 0.55rem;
    color: #8088a0; letter-spacing: 0.14em; font-weight: 700;
    text-shadow: 0 1px 0 rgba(255,255,255,0.6);
  }
  .card-port {
    width: 24px; height: 5px;
    background:
      linear-gradient(180deg, #b8bdc8 0%, #98a0ac 100%);
    border-radius: 3px;
    box-shadow:
      inset 0 1px 2px rgba(0,0,0,0.3),
      inset 0 -0.5px 0 rgba(255,255,255,0.3),
      0 0.5px 0 rgba(255,255,255,0.5);
  }
  .phone-frame {
    width: 360px; height: 680px; background: #1a1a1f;
    border-radius: 36px; padding: 10px;
    box-shadow: 0 24px 60px -20px rgba(0,0,0,0.45); position: relative;
    max-width: 96vw;
  }
  .phone-notch {
    position: absolute; top: 10px; left: 50%; transform: translateX(-50%);
    width: 90px; height: 22px; background: #1a1a1f; border-radius: 0 0 12px 12px;
    z-index: 5;
  }
  .phone-screen {
    width: 100%; height: 100%; background: #f5f7fa;
    border-radius: 28px; overflow: hidden;
    display: flex; flex-direction: column; position: relative;
  }
  .phone-statusbar {
    display: flex; justify-content: space-between;
    padding: 14px 22px 6px;
    font-size: 0.62rem; color: #1a1a2e; font-family: var(--mono); font-weight: 600;
  }
  .phone-topbar {
    padding: 12px 16px 14px;
    background: linear-gradient(180deg, #5b6cff 0%, #22c3ee 100%);
    color: white;
  }
  .phone-topbar .title { font-family: var(--serif); font-weight: 700; font-size: 1rem; margin-bottom: 2px; }
  .phone-topbar .sub { font-size: 0.66rem; opacity: 0.88; }
  .phone-screen-content { flex: 1; overflow: hidden; position: relative; }
  .phone-view {
    display: none; padding: 14px 14px 60px;
    flex-direction: column; gap: 10px;
    height: 100%; overflow-y: auto;
  }
  .phone-view.active { display: flex; animation: protoFade 0.4s ease; }
  .phone-block-h {
    font-family: var(--mono); font-size: 0.6rem; color: #888;
    letter-spacing: 0.06em; text-transform: uppercase;
    margin-bottom: 2px;
  }
  .phone-recbtn {
    align-self: center; width: 76px; height: 76px; border-radius: 50%;
    background: linear-gradient(135deg, #ff5555, #ff3333); color: white;
    border: 0; cursor: pointer; font-size: 0.74rem; font-weight: 700;
    box-shadow: 0 8px 16px -4px rgba(255, 51, 51, 0.4);
    margin: 10px 0 4px; font-family: inherit;
    display: flex; align-items: center; justify-content: center;
  }
  .phone-recbtn:hover { transform: scale(1.04); transition: transform 0.2s; }
  .phone-rectimer { text-align: center; font-family: var(--mono); font-size: 0.95rem; color: #1a1a2e; font-weight: 600; }
  .phone-waveform {
    display: flex; gap: 2px; align-items: center; justify-content: center; height: 36px;
  }
  .phone-waveform .bar { width: 3px; background: #5b6cff; border-radius: 2px; animation: wave 1s infinite; }
  .phone-waveform .bar:nth-child(2n) { animation-delay: 0.1s; }
  .phone-waveform .bar:nth-child(3n) { animation-delay: 0.2s; }
  .phone-waveform .bar:nth-child(4n) { animation-delay: 0.15s; }
  .phone-waveform .bar:nth-child(5n) { animation-delay: 0.25s; }
  @keyframes wave { 0%, 100% { height: 5px; } 50% { height: 28px; } }
  .phone-rec-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
  .phone-rec-item {
    background: white; border-radius: 9px; padding: 10px 12px; font-size: 0.74rem;
  }
  .phone-rec-item .title { font-weight: 600; color: #1a1a2e; margin-bottom: 2px; }
  .phone-rec-item .meta { font-family: var(--mono); font-size: 0.6rem; color: #888; }
  .phone-transcript {
    background: white; border-radius: 9px; padding: 10px 12px;
    font-size: 0.72rem; line-height: 1.5; color: #333;
    display: flex; flex-direction: column; gap: 7px;
  }
  .phone-line .who {
    font-weight: 700; color: #5b6cff;
    display: block; margin-bottom: 1px; font-size: 0.62rem;
  }
  .phone-summary {
    background: white; border-radius: 9px; padding: 12px 14px;
    font-size: 0.72rem; line-height: 1.5; color: #333;
  }
  .phone-summary h4 { font-family: var(--serif); font-size: 0.84rem; color: #1a1a2e; margin-bottom: 8px; }
  .phone-summary .sec { border-top: 1px solid #f0f0f0; padding: 8px 0; }
  .phone-summary .sec:first-of-type { border-top: 0; padding-top: 0; }
  .phone-summary .sec b {
    display: block; color: #5b6cff; font-size: 0.62rem;
    margin-bottom: 4px; letter-spacing: 0.04em;
    text-transform: uppercase; font-family: var(--mono);
  }
  .phone-summary .sec ul { margin: 0; padding: 0; list-style: none; }
  .phone-summary .sec li { padding: 2px 0; }
  .phone-todos { display: flex; flex-direction: column; gap: 7px; }
  .phone-todo {
    background: white; border-radius: 9px; padding: 10px 12px;
    display: grid; grid-template-columns: 22px 1fr auto;
    gap: 9px; align-items: center; font-size: 0.72rem;
  }
  .phone-todo .check {
    width: 18px; height: 18px; border-radius: 5px;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.74rem; font-weight: 700;
  }
  .phone-todo .check.done { background: #2ecc71; color: white; }
  .phone-todo .check.pending { background: #f0f0f0; color: #888; border: 1px dashed #ccc; }
  .phone-todo .check.danger { background: #fff5e6; color: #ff9500; }
  .phone-todo .body .title { font-weight: 600; color: #1a1a2e; }
  .phone-todo .body .meta { font-family: var(--mono); font-size: 0.56rem; color: #888; margin-top: 2px; }
  .phone-todo .tag {
    font-family: var(--mono); font-size: 0.54rem;
    padding: 2px 6px; border-radius: 4px; font-weight: 600;
  }
  .phone-todo .tag.auto { background: #e8f5e9; color: #2ecc71; }
  .phone-todo .tag.ok { background: #e6f3ff; color: #5b6cff; }
  .phone-todo .tag.warn { background: #fff5e6; color: #ff9500; cursor: pointer; }
  .phone-todo[data-proto-go] { cursor: pointer; }
  .phone-todo[data-proto-go]:hover { transform: translateX(2px); transition: transform 0.2s; }
  .phone-confirm-card {
    background: white; border-radius: 12px; padding: 14px;
    border: 2px solid #ff9500;
  }
  .phone-confirm-card .warn-h {
    display: flex; align-items: center; gap: 6px;
    font-family: var(--serif); font-weight: 700; color: #ff9500;
    font-size: 0.86rem; margin-bottom: 6px;
  }
  .phone-confirm-card p { font-size: 0.7rem; color: #555; line-height: 1.5; }
  .phone-confirm-card p strong { color: #1a1a2e; font-weight: 600; }
  .phone-confirm-card .draft {
    background: #fafafa; border-radius: 8px; padding: 9px;
    font-size: 0.66rem; color: #555; line-height: 1.45; margin: 8px 0;
  }
  .phone-confirm-card .draft strong { color: #1a1a2e; }
  .phone-confirm-card .actions { display: flex; gap: 6px; margin-top: 8px; }
  .phone-confirm-card .actions button {
    flex: 1; padding: 8px; border: 0; border-radius: 999px;
    font-size: 0.68rem; cursor: pointer; font-weight: 600; font-family: inherit;
  }
  .phone-confirm-card .actions .approve { background: #ff9500; color: white; }
  .phone-confirm-card .actions .deny { background: #f0f0f0; color: #666; }
  .phone-mem { display: flex; flex-direction: column; gap: 10px; }
  .phone-mem-card { background: white; border-radius: 9px; padding: 11px 13px; }
  .phone-mem-card h5 {
    font-family: var(--mono); font-size: 0.58rem; color: #888;
    letter-spacing: 0.06em; text-transform: uppercase;
    margin: 0 0 8px;
  }
  .phone-mem-card .item {
    display: grid; grid-template-columns: 28px 1fr auto;
    gap: 9px; padding: 7px 0; border-top: 1px solid #f5f5f5;
    font-size: 0.7rem; align-items: center;
  }
  .phone-mem-card .item:first-of-type { border-top: 0; }
  .phone-mem-card .avatar {
    width: 26px; height: 26px; border-radius: 50%;
    background: linear-gradient(135deg, #5b6cff, #22c3ee); color: white;
    display: flex; align-items: center; justify-content: center;
    font-family: var(--serif); font-weight: 700; font-size: 0.72rem;
  }
  .phone-mem-card .who { font-weight: 600; color: #1a1a2e; }
  .phone-mem-card .meta { font-family: var(--mono); font-size: 0.56rem; color: #888; margin-top: 2px; }
  .phone-mem-card .count {
    font-family: var(--mono); font-size: 0.68rem; color: #5b6cff; font-weight: 700;
  }
  .phone-mem-card .blurb { font-size: 0.7rem; color: #444; line-height: 1.55; }
  .phone-mem-card .blurb strong { color: #5b6cff; font-weight: 600; }
  .phone-bottombar {
    position: absolute; bottom: 0; left: 0; right: 0;
    background: white; display: flex; justify-content: space-around;
    padding: 5px 0 12px; font-size: 0.58rem; color: #999;
    border-top: 1px solid #eee;
  }
  .phone-bottombar button {
    background: 0; border: 0; cursor: pointer;
    display: flex; flex-direction: column; align-items: center; gap: 1px;
    font-family: var(--sans); font-size: 0.56rem; color: inherit;
    padding: 3px 5px;
  }
  .phone-bottombar button .ico { font-size: 0.88rem; }
  .phone-bottombar button.active { color: #5b6cff; font-weight: 600; }

  @media (max-width: 1020px) {
    .pen-stage-flex { flex-direction: column; }
    .pen-notes { max-width: 100%; }
    .card-stage-flex { flex-direction: column; align-items: center; }
    .card-device { margin-top: 0; }
    .proto-intro { flex-direction: column; align-items: flex-start; }
    .proto-hint { display: none; }
  }
  /* Pen-fit container-query handles all responsive scaling automatically:
     笔身保持 920×140 真实比例，按容器宽度自动 transform: scale 缩放。
     从大屏(scale=1)一直到 320px 手机(scale≈0.36) 都保持笔形态. */

  /* ===== Memory drill-in bottom sheet ===== */
  #mc-sheet-host { display: none; position: fixed; top:0;right:0;bottom:0;left:0; z-index: 1000; }
  .mc-sheet-mask { position: absolute; top:0;right:0;bottom:0;left:0; background: rgba(0,0,0,0.4); backdrop-filter: blur(2px); }
  .mc-sheet-panel { position: absolute; left: 0; right: 0; bottom: 0; max-height: 85vh; background: var(--paper); border-radius: 18px 18px 0 0; padding: 18px 18px 32px; overflow-y: auto; box-shadow: 0 -12px 40px rgba(0,0,0,0.18); animation: mcSheetIn 0.28s cubic-bezier(.2,.7,.3,1); }
  @keyframes mcSheetIn { from { transform: translateY(40px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
  .mc-sheet-close { position: absolute; top: 12px; right: 14px; width: 30px; height: 30px; border-radius: 50%; background: rgba(0,0,0,0.06); border: 0; color: var(--ink); cursor: pointer; font-size: 14px; font-family: var(--mono); }
  .mc-sheet-h { font-family: var(--serif); font-size: 1.4rem; font-weight: 700; color: var(--ink); margin-bottom: 4px; padding-right: 40px; }
  .mc-sheet-sub { font-size: 0.78rem; color: var(--ink-mute); margin-bottom: 16px; }
  .mc-sheet-section { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--rule-faint); }
  .mc-sheet-section h6 { font-size: 0.66rem; font-weight: 600; color: var(--ink-mute); margin-bottom: 8px; letter-spacing: 0.04em; text-transform: uppercase; }
  .mc-chips { display: flex; flex-wrap: wrap; gap: 4px; }
  .mc-chip { display: inline-block; padding: 2px 8px; border-radius: 999px; background: rgba(91, 108, 255,0.08); color: #5b6cff; font-size: 0.7rem; font-weight: 500; }
  .mc-chip-sm { font-size: 0.62rem; padding: 1px 6px; background: rgba(0,0,0,0.05); color: var(--ink-soft); }
  .mc-row { display: flex; gap: 8px; padding: 6px 0; border-bottom: 1px dashed rgba(0,0,0,0.06); }
  .mc-row:last-child { border-bottom: 0; }
  .mc-row-body { flex: 1; font-size: 0.74rem; color: var(--ink); }
  .mc-row-body small { display: block; font-size: 0.62rem; color: var(--ink-mute); margin-top: 2px; }
  .mc-row-link { cursor: pointer; }
  .mc-row-link:hover { background: rgba(91, 108, 255,0.04); }
  .mc-row-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 18px; padding: 0 4px; border-radius: 4px; font-size: 0.58rem; font-family: var(--mono); font-weight: 700; color: white; }
  .mc-l0 { background: #2ecc71; }
  .mc-l1 { background: #f39c12; }
  .mc-l2 { background: #c4433a; }
  .mc-tl-item { display: flex; gap: 10px; padding: 8px 0; position: relative; }
  .mc-tl-item:not(:last-child)::after { content: ''; position: absolute; left: 14px; top: 32px; bottom: -8px; width: 1px; background: rgba(91, 108, 255,0.2); }
  .mc-tl-marker { width: 28px; height: 28px; border-radius: 50%; background: linear-gradient(135deg, #5b6cff, #22c3ee); color: white; font-family: var(--mono); font-weight: 700; font-size: 0.72rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
  .mc-tl-body { flex: 1; }
  .mc-tl-title { font-family: var(--serif); font-size: 0.82rem; font-weight: 700; color: var(--ink); }
  .mc-tl-time { font-size: 0.62rem; color: var(--ink-mute); font-family: var(--mono); margin-top: 1px; }
  .mc-tl-sum { font-size: 0.7rem; color: var(--ink-soft); margin-top: 4px; line-height: 1.5; }
  .mc-tl-deci { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
  .mc-btn-merge { font-size: 0.72rem; padding: 6px 12px; background: var(--carmine); color: white; border: 0; border-radius: 6px; cursor: pointer; font-weight: 600; }
  .mc-btn-merge:hover { background: var(--carmine-deep); }
  .mc-btn { font-size: 0.72rem; padding: 6px 12px; border: 0; border-radius: 6px; cursor: pointer; font-weight: 600; background: rgba(0,0,0,0.06); color: var(--ink); }
  .mc-btn:hover { background: rgba(0,0,0,0.1); }
  .mc-btn-primary { background: var(--carmine); color: white; }
  .mc-btn-primary:hover { background: var(--carmine-deep); }
  .mc-edit-area { width: 100%; min-height: 200px; max-height: 50vh; padding: 12px; font-family: var(--mono); font-size: 0.78rem; line-height: 1.55; border: 1px solid var(--rule); border-radius: 8px; resize: vertical; background: #fff; color: var(--ink); }
  .mc-edit-actions { display: flex; gap: 8px; margin-top: 10px; }
  .mc-md-view { font-family: var(--mono); font-size: 0.74rem; line-height: 1.6; white-space: pre-wrap; word-wrap: break-word; max-height: 60vh; overflow-y: auto; padding: 12px; background: rgba(0,0,0,0.03); border-radius: 8px; }

  /* ===== Workspace screens ===== */
  .mc-ws-hint { font-size: 0.58rem; color: #888; font-weight: 400; margin-left: 4px; letter-spacing: 0; }
  .mc-ws-list { display: flex; flex-direction: column; gap: 6px; padding: 4px 0; }
  .mc-ws-row { display: flex; gap: 8px; padding: 8px 10px; background: rgba(255,255,255,0.85); border: 1px solid rgba(0,0,0,0.06); border-radius: 8px; align-items: flex-start; }
  .mc-ws-row-clickable { cursor: pointer; transition: all 0.15s; }
  .mc-ws-row-clickable:hover { background: rgba(91, 108, 255,0.05); border-color: rgba(91, 108, 255,0.2); transform: translateX(2px); }
  .mc-ws-row-icon { font-size: 0.95rem; flex-shrink: 0; width: 22px; text-align: center; }
  .mc-ws-role-badge { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; color: white; font-size: 0.7rem; display: flex; align-items: center; justify-content: center; }
  .mc-ws-row-body { flex: 1; min-width: 0; }
  .mc-ws-row-title { font-family: var(--serif); font-size: 0.72rem; font-weight: 700; color: var(--ink); line-height: 1.3; }
  .mc-ws-row-meta { font-size: 0.58rem; color: var(--ink-mute); margin-top: 1px; line-height: 1.4; }
  .mc-ws-row-desc { font-size: 0.62rem; color: var(--ink-soft); margin-top: 4px; line-height: 1.5; }
  .mc-ws-row-src { font-size: 0.55rem; color: #aaa; margin-top: 2px; font-family: var(--mono); }
  .mc-ws-row-todos { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 4px; }
  .mc-ws-row-action { font-size: 0.6rem; color: #5b6cff; font-weight: 600; flex-shrink: 0; align-self: center; }
  .mc-ws-skel { padding: 24px 0; text-align: center; font-size: 0.7rem; color: #aaa; }
  .mc-ws-err { padding: 24px 0; text-align: center; font-size: 0.7rem; color: var(--carmine); }
  .mc-ws-filter { display: inline-flex; gap: 3px; margin-left: auto; }
  .mc-ws-fbtn { font-size: 0.55rem; padding: 2px 8px; background: transparent; border: 1px solid rgba(0,0,0,0.1); border-radius: 999px; cursor: pointer; color: var(--ink-mute); }
  .mc-ws-fbtn.active { background: var(--carmine); color: white; border-color: var(--carmine); }
  .mc-ws-status { padding: 1px 5px; border-radius: 3px; font-weight: 600; font-size: 0.55rem; }
  .mc-stat-done { background: rgba(46,204,113,0.15); color: #198754; }
  .mc-stat-awaiting_approval { background: rgba(243,156,18,0.15); color: #b8650a; }
  .mc-stat-error { background: rgba(196,67,58,0.15); color: var(--carmine); }
  .mc-stat-running { background: rgba(91, 108, 255,0.15); color: #5b6cff; }
  .mc-stat-aborted { background: rgba(0,0,0,0.08); color: #888; }
  .mc-empty { text-align: center; padding: 28px 12px; }
  .mc-empty-emoji { font-size: 2rem; opacity: 0.5; margin-bottom: 8px; }
  .mc-empty-title { font-family: var(--serif); font-size: 0.8rem; font-weight: 700; color: var(--ink); }
  .mc-empty-sub { font-size: 0.65rem; color: var(--ink-mute); margin-top: 6px; line-height: 1.5; }

  .mc-pills-row2 { margin-top: 8px; }
  .mc-pill-search kbd { display: inline-block; padding: 0 4px; margin-left: 4px; background: rgba(0,0,0,0.08); border-radius: 3px; font-family: var(--mono); font-size: 0.62em; }

  /* ===== Toast ===== */
  #mc-toast {
    position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%) translateY(20px); opacity: 0;
    padding: 10px 18px; background: #0E0E12; color: #F5F1EA; border-radius: 8px; font-size: 0.76rem; font-weight: 500;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3); z-index: 1500; pointer-events: none;
    transition: all 0.24s cubic-bezier(.2,.7,.3,1);
  }
  #mc-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

  /* ===== Global cmd+K search panel ===== */
  #mc-gsearch-host { position: fixed; top:0;right:0;bottom:0;left:0; z-index: 2000; display: flex; align-items: flex-start; justify-content: center; padding: 80px 16px 16px; }
  .mc-gsearch-mask { position: absolute; top:0;right:0;bottom:0;left:0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); }
  .mc-gsearch-panel { position: relative; width: min(640px, 100%); max-height: calc(100vh - 96px); background: var(--paper); border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,0.3); overflow: hidden; display: flex; flex-direction: column; animation: mcGsIn 0.22s ease-out; }
  @keyframes mcGsIn { from { transform: translateY(-12px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
  .mc-gsearch-inputwrap { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--rule-faint); }
  .mc-gsearch-icon { font-size: 1rem; color: var(--ink-mute); font-family: var(--mono); }
  #mc-gsearch-input { flex: 1; border: 0; outline: 0; background: transparent; font-size: 1rem; color: var(--ink); font-family: var(--sans); }
  .mc-gsearch-kbd { padding: 2px 6px; background: rgba(0,0,0,0.06); border-radius: 4px; font-family: var(--mono); font-size: 0.65rem; color: var(--ink-mute); }
  .mc-gsearch-results { flex: 1; overflow-y: auto; padding: 8px 0; }
  .mc-gsearch-tip { padding: 28px; text-align: center; color: var(--ink-mute); font-size: 0.78rem; }
  .mc-gsearch-section { padding: 8px 0; }
  .mc-gsearch-h { padding: 4px 18px; font-size: 0.62rem; font-weight: 600; color: var(--ink-mute); letter-spacing: 0.06em; text-transform: uppercase; }
  .mc-gsearch-item { padding: 10px 18px; cursor: pointer; transition: background 0.15s; border-left: 2px solid transparent; }
  .mc-gsearch-item:hover { background: rgba(91, 108, 255,0.06); border-left-color: #5b6cff; }
  .mc-gsearch-it-title { font-family: var(--serif); font-weight: 700; font-size: 0.86rem; color: var(--ink); }
  .mc-gsearch-it-sub { font-size: 0.66rem; color: var(--ink-mute); margin-top: 2px; }

  /* ===== Audio playback ===== */
  .mc-audio-wrap { display: flex; flex-direction: column; gap: 4px; padding: 6px 0; margin: 6px 0 4px; }
  .mc-audio-wrap audio { width: 100%; height: 32px; }
  .mc-audio-lab { font-size: 0.6rem; color: var(--ink-mute); font-family: var(--mono); }

  /* ===== Related/manual links in summary ===== */
  .mc-rel-link { cursor: pointer; color: #5b6cff; }
  .mc-rel-link:hover { text-decoration: underline; }
  .mc-anno-sec { margin-top: 12px; padding-top: 10px; border-top: 1px dashed rgba(0,0,0,0.08); }
  .mc-anno-area { width: 100%; min-height: 60px; padding: 8px; font-size: 0.7rem; font-family: var(--sans); border: 1px solid rgba(0,0,0,0.1); border-radius: 6px; resize: vertical; background: rgba(255,255,255,0.6); color: var(--ink); }
  .mc-anno-actions { display: flex; gap: 6px; margin-top: 6px; }

  /* ===== Timeline workspace ===== */
  .mc-tl-day { margin-bottom: 12px; }
  .mc-tl-day-head { font-family: var(--mono); font-size: 0.62rem; font-weight: 700; color: var(--carmine); letter-spacing: 0.04em; margin: 6px 0 4px; padding-bottom: 3px; border-bottom: 1px solid var(--rule-faint); }

  /* ===== Health workspace ===== */
  .mc-health-card { padding: 10px; background: rgba(255,255,255,0.85); border: 1px solid rgba(0,0,0,0.06); border-radius: 8px; margin-bottom: 8px; }
  .mc-health-h { font-family: var(--serif); font-size: 0.74rem; font-weight: 700; color: var(--ink); margin-bottom: 6px; }
  .mc-health-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(70px, 1fr)); gap: 6px; }
  .mc-health-cell { padding: 6px 4px; background: rgba(0,0,0,0.03); border-radius: 4px; text-align: center; }
  .mc-health-num { font-family: var(--serif); font-size: 0.95rem; font-weight: 700; color: var(--carmine-deep); }
  .mc-health-lab { font-size: 0.55rem; color: var(--ink-mute); margin-top: 2px; }

  /* ===== Cross-record agent trigger ===== */
  .mc-cross-trigger { width: 100%; padding: 8px 12px; margin: 6px 0 8px; background: linear-gradient(135deg, var(--carmine), var(--carmine-deep)); color: white; border: 0; border-radius: 8px; font-family: var(--sans); font-size: 0.7rem; font-weight: 600; cursor: pointer; box-shadow: 0 4px 12px -2px rgba(196,67,58,0.3); transition: all 0.15s; }
  .mc-cross-trigger:hover { transform: translateY(-1px); box-shadow: 0 6px 16px -2px rgba(196,67,58,0.4); }
  .mc-cross-trigger:active { transform: translateY(0); }
  .mc-cross-box { margin-bottom: 10px; border: 2px solid rgba(196,67,58,0.2); }

  /* ===== 跨录音动作 · sheet 流式面板（用户点哪个 sheet 从底部弹出哪个） ===== */
  .mc-cross-sheet { display: flex; flex-direction: column; gap: 12px; padding-right: 8px; }
  .mc-cross-sheet-head { display: flex; align-items: center; gap: 8px; padding-bottom: 10px; border-bottom: 1px solid rgba(0,0,0,0.06); }
  .mc-cross-sheet-ico { font-size: 1.3rem; line-height: 1; }
  .mc-cross-sheet-ttl { flex: 1; font-family: var(--serif); font-size: 1.05rem; font-weight: 700; color: var(--ink); letter-spacing: -0.01em; }
  .mc-cross-sheet-tag { flex-shrink: 0; }
  .mc-cross-sheet-stream { max-height: 60vh; overflow-y: auto; padding-right: 4px; }
  .mc-cross-sheet-stream .agent-flow { margin-bottom: 8px; }
  .mc-cross-sheet-stream .agent-flow-body { background: rgba(0,0,0,0.03); border-radius: 10px; padding: 10px 12px; }
  .mc-cross-sheet-stream .agent-flow.done .agent-flow-body { background: rgba(46,204,113,0.08); }
  .mc-cross-sheet-stream .agent-flow.err .agent-flow-body { background: rgba(196,67,58,0.08); }
  html.is-embed-android .mc-cross-sheet-ttl { font-size: 16px !important; }
  html.is-embed-android .mc-cross-sheet-stream { max-height: 65vh; }

  /* ===== Chat surface ===== */
  .mc-chat-msgs { display: flex; flex-direction: column; gap: 6px; max-height: 360px; overflow-y: auto; padding: 6px 0 80px; }
  .mc-chat-tip { padding: 16px; font-size: 0.62rem; color: var(--ink-mute); background: rgba(0,0,0,0.03); border-radius: 8px; line-height: 1.55; }
  .mc-chat-msg { padding: 8px 12px; border-radius: 10px; font-size: 0.72rem; line-height: 1.55; max-width: 92%; }
  .mc-chat-user { align-self: flex-end; background: linear-gradient(135deg, #5b6cff, #22c3ee); color: white; }
  .mc-chat-asst { align-self: flex-start; background: rgba(255,255,255,0.95); border: 1px solid rgba(0,0,0,0.06); color: var(--ink); }
  .mc-chat-thinking { font-size: 0.62rem; color: var(--ink-mute); font-style: italic; }
  .mc-chat-err { color: var(--carmine); font-size: 0.66rem; }
  .mc-chat-body { font-size: 0.74rem; line-height: 1.6; white-space: pre-wrap; word-wrap: break-word; }
  .mc-chat-tools { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; }
  .mc-chat-tool { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; background: rgba(91, 108, 255,0.1); color: #5b6cff; font-size: 0.58rem; font-weight: 500; font-family: var(--mono); }
  .mc-chat-tool-l1 { background: rgba(243,156,18,0.12); color: #b8650a; }
  .mc-chat-tool-l2 { background: rgba(196,67,58,0.12); color: var(--carmine); }
  .mc-chat-input-row { position: sticky; bottom: 0; background: var(--paper); padding: 8px 0; display: flex; gap: 4px; border-top: 1px solid var(--rule-faint); }
  .mc-chat-input { flex: 1; padding: 6px 10px; font-size: 0.72rem; border: 1px solid rgba(0,0,0,0.1); border-radius: 6px; }
  .mc-chat-send { padding: 6px 14px; background: var(--carmine); color: white; border: 0; border-radius: 6px; font-size: 0.66rem; font-weight: 600; cursor: pointer; }
  .mc-chat-send:hover { background: var(--carmine-deep); }

  /* ===== Multi-runs grid ===== */
  .mc-multi-box { padding: 10px 12px; margin-bottom: 10px; background: rgba(91, 108, 255,0.04); border: 2px solid rgba(91, 108, 255,0.18); border-radius: 10px; }
  .mc-multi-head { font-family: var(--serif); font-size: 0.72rem; font-weight: 700; color: var(--ink); margin-bottom: 8px; }
  .mc-multi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 6px; }
  .mc-multi-cell { padding: 6px 8px; background: white; border-radius: 6px; border: 1px solid rgba(0,0,0,0.06); }
  .mc-multi-cell-head { font-size: 0.64rem; font-weight: 600; color: var(--ink); margin-bottom: 4px; }
  .mc-multi-cell-status { font-size: 0.55rem; color: var(--ink-mute); font-family: var(--mono); margin-bottom: 4px; }
  .mc-multi-cell-tools { display: flex; flex-wrap: wrap; gap: 3px; }

  /* ===== Record action buttons in summary ===== */
  .mc-rec-actions { display: flex; gap: 4px; flex-wrap: wrap; margin: 4px 0 8px; }
  .mc-rec-btn { padding: 4px 10px; font-size: 0.62rem; background: rgba(0,0,0,0.05); color: var(--ink); border: 1px solid rgba(0,0,0,0.08); border-radius: 999px; cursor: pointer; font-weight: 500; }
  .mc-rec-btn:hover { background: rgba(91, 108, 255,0.08); border-color: rgba(91, 108, 255,0.2); color: #5b6cff; }
  .mc-rec-pin.is-pinned { background: rgba(196,67,58,0.12); color: var(--carmine); border-color: rgba(196,67,58,0.3); }
  .mc-rec-danger { color: #c4433a; border-color: rgba(196,67,58,0.25); }
  .mc-rec-danger:hover { background: rgba(196,67,58,0.1); border-color: rgba(196,67,58,0.45); color: #a53329; }
  .mc-rec-pin-ico { display: inline-block; transform: rotate(-15deg); }
  .phone-rec-item.is-pinned { background: linear-gradient(180deg, rgba(196,67,58,0.06), transparent); border-left: 2px solid var(--carmine); padding-left: 8px; }

  /* ===== Edit record inputs ===== */
  .mc-edit-input { width: 100%; padding: 8px 10px; font-size: 0.74rem; border: 1px solid rgba(0,0,0,0.1); border-radius: 6px; background: white; color: var(--ink); }

  /* ===== Transcript edit affordance ===== */
  .mc-tx-actions { margin-top: 8px; padding-top: 8px; border-top: 1px dashed rgba(0,0,0,0.08); display: flex; gap: 8px; align-items: center; }
  .mc-tx-info { font-size: 0.6rem; color: var(--ink-mute); font-family: var(--mono); margin-left: auto; }

  /* ===== Bulk approve bar in confirm screen ===== */
  .mc-bulk-bar { display: flex; gap: 6px; align-items: center; padding: 8px 10px; background: rgba(243,156,18,0.08); border: 1px solid rgba(243,156,18,0.2); border-radius: 8px; margin-bottom: 10px; font-size: 0.66rem; }
  .mc-bulk-bar span { margin-right: auto; font-weight: 600; color: #b8650a; }
  .mc-bulk-deny { background: rgba(0,0,0,0.05); }

  /* ===== Onboarding tour ===== */
  .mc-onboard-h { font-family: var(--serif); font-size: 1.4rem; font-weight: 700; color: var(--ink); margin-bottom: 4px; }
  .mc-onboard-sub { font-size: 0.74rem; color: var(--ink-mute); margin-bottom: 14px; line-height: 1.55; }
  .mc-onboard-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 6px; max-height: 50vh; overflow-y: auto; padding: 4px 0; }
  .mc-onboard-cell { padding: 8px 10px; background: rgba(0,0,0,0.03); border-radius: 6px; border-left: 2px solid var(--carmine); }
  .mc-onboard-ico { font-size: 1.1rem; }
  .mc-onboard-name { font-family: var(--serif); font-weight: 700; font-size: 0.74rem; color: var(--ink); margin-top: 2px; }
  .mc-onboard-desc { font-size: 0.6rem; color: var(--ink-soft); margin-top: 2px; line-height: 1.5; }
  .mc-onboard-foot { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--rule-faint);
    /* 2026-06-23 修:小屏上"开始使用"会被挤到屏外导致引导层关不掉、所有点击被遮罩拦截→录音点了没反应。
       sticky 固定到面板底部常驻,无需滚动即可关闭。*/
    position: sticky; bottom: 0; background: var(--paper); padding-bottom: 6px; z-index: 3; }
  .mc-onboard-foot .mc-btn-primary { flex: 1; min-height: 44px; }
  .mc-onboard-kbd { flex: 1; font-size: 0.62rem; color: var(--ink-mute); font-family: var(--mono); }
  .mc-onboard-kbd kbd { padding: 1px 5px; background: rgba(0,0,0,0.06); border-radius: 3px; font-family: var(--mono); font-size: 0.92em; }

  /* ===== Help panel rows ===== */
  .mc-help-row { display: flex; gap: 10px; align-items: center; padding: 5px 0; font-size: 0.72rem; }
  .mc-help-row kbd { padding: 2px 6px; background: rgba(0,0,0,0.06); border-radius: 3px; font-family: var(--mono); font-size: 0.85em; min-width: 28px; text-align: center; }
  .mc-help-row > span:last-child { color: var(--ink-soft); flex: 1; }

  .mc-pill-utility { background: transparent; border: 1px dashed rgba(0,0,0,0.15); }

  /* ===== Dark mode adjustments ===== */
  body.dark .mc-ws-row { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.06); }
  body.dark .mc-ws-row-clickable:hover { background: rgba(91, 108, 255,0.12); }
  body.dark .mc-health-card { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.08); }
  body.dark .mc-health-cell { background: rgba(255,255,255,0.05); }
  body.dark .mc-chat-asst { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.08); color: var(--ink); }
  body.dark .mc-onboard-cell { background: rgba(255,255,255,0.04); }
  body.dark .mc-bulk-bar { background: rgba(243,156,18,0.12); }
  body.dark .mc-edit-area, body.dark .mc-edit-input, body.dark .mc-anno-area { background: rgba(255,255,255,0.05); color: var(--ink); border-color: rgba(255,255,255,0.1); }
  body.dark .mc-sheet-panel { background: var(--paper); color: var(--ink); }
  body.dark .mc-md-view { background: rgba(255,255,255,0.05); }

  /* ===== Premium Agent Run · Hero Card ===== */
  .mc-run-hero {
    background: linear-gradient(135deg, #fffaf5 0%, #fff 100%);
    border: 1px solid var(--rule-faint);
    border-radius: 12px;
    padding: 14px 14px 10px;
    margin-bottom: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  }
  .mc-run-hero-pm       { background: linear-gradient(135deg, #f0f5ff 0%, #fff 100%); border-color: rgba(91, 108, 255,0.18); }
  .mc-run-hero-dev      { background: linear-gradient(135deg, #e6fffb 0%, #fff 100%); border-color: rgba(54,207,201,0.22); }
  .mc-run-hero-designer { background: linear-gradient(135deg, #f9f0ff 0%, #fff 100%); border-color: rgba(114,46,209,0.18); }
  .mc-run-hero-ops      { background: linear-gradient(135deg, #fff7e6 0%, #fff 100%); border-color: rgba(250,140,22,0.22); }
  .mc-run-hero-marketing{ background: linear-gradient(135deg, #fff0f6 0%, #fff 100%); border-color: rgba(235,47,150,0.22); }
  .mc-run-hero-founder  { background: linear-gradient(135deg, #fff2e8 0%, #fff 100%); border-color: rgba(250,84,28,0.22); }
  .mc-run-hero-top { display: flex; gap: 10px; align-items: center; margin-bottom: 10px; }
  .mc-run-hero-icon {
    width: 38px; height: 38px; border-radius: 10px;
    background: linear-gradient(135deg, rgba(255,255,255,0.95), rgba(255,255,255,0.6));
    box-shadow: 0 2px 8px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.8);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.05rem;
  }
  .mc-run-hero-meta { flex: 1; min-width: 0; }
  .mc-run-hero-role { font-family: var(--serif); font-size: 0.86rem; font-weight: 700; color: var(--ink); line-height: 1.2; }
  .mc-run-hero-id { font-size: 0.56rem; color: var(--ink-mute); font-family: var(--mono); letter-spacing: 0.02em; }
  .mc-run-status { padding: 3px 8px; border-radius: 999px; font-size: 0.58rem; font-weight: 600; font-family: var(--sans); white-space: nowrap; }
  .mc-run-hero-stats {
    display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px;
    padding-top: 8px; border-top: 1px dashed rgba(0,0,0,0.06);
  }
  .mc-run-stat { text-align: center; padding: 4px 2px; }
  .mc-run-stat b { display: block; font-family: var(--serif); font-size: 0.82rem; font-weight: 700; color: var(--ink); line-height: 1.1; }
  .mc-run-stat span { display: block; font-size: 0.5rem; color: var(--ink-mute); text-transform: uppercase; letter-spacing: 0.05em; margin-top: 1px; }

  /* ===== Premium Timeline Rail ===== */
  .mc-tl-rail-wrap { padding: 4px 0 4px 8px; position: relative; }
  .mc-tl-rail-wrap::before {
    content: ''; position: absolute; left: 18px; top: 8px; bottom: 8px;
    width: 2px; background: linear-gradient(180deg, rgba(91, 108, 255,0.25), rgba(91, 108, 255,0.1));
    border-radius: 1px;
  }
  .mc-tl-node {
    display: flex; gap: 10px; padding: 6px 0; position: relative;
    animation: mcTlIn 0.3s cubic-bezier(.2,.7,.3,1);
  }
  @keyframes mcTlIn { from { transform: translateY(4px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
  .mc-tl-dot {
    width: 24px; height: 24px; border-radius: 50%;
    background: white; border: 2px solid #5b6cff;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; z-index: 2; position: relative;
    font-size: 0.65rem; font-weight: 700;
    box-shadow: 0 0 0 4px rgba(91, 108, 255,0.06);
  }
  .mc-tl-dot.mc-tl-ok      { background: #fff; color: #2ecc71; border-color: #2ecc71; box-shadow: 0 0 0 4px rgba(46,204,113,0.08); }
  .mc-tl-dot.mc-tl-pending { background: #fff; color: #f39c12; border-color: #f39c12; box-shadow: 0 0 0 4px rgba(243,156,18,0.1); animation: mcTlPulse 1.4s ease-in-out infinite; }
  .mc-tl-dot.mc-tl-run     { background: #fff; color: #5b6cff; border-color: #5b6cff; animation: mcTlPulse 1s ease-in-out infinite; }
  .mc-tl-dot-final         { background: linear-gradient(135deg, #5b6cff, #22c3ee); color: white; border-color: transparent; box-shadow: 0 4px 12px -2px rgba(91, 108, 255,0.4); }
  .mc-tl-dot-user          { background: rgba(0,0,0,0.04); color: var(--ink); border: 2px dashed rgba(0,0,0,0.15); box-shadow: none; }
  @keyframes mcTlPulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.08); } }

  .mc-tl-card {
    flex: 1; min-width: 0;
    background: white; border: 1px solid rgba(0,0,0,0.07);
    border-radius: 10px; padding: 8px 10px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
    transition: all 0.15s;
  }
  .mc-tl-clickable .mc-tl-card { cursor: pointer; }
  .mc-tl-clickable:hover .mc-tl-card { background: rgba(91, 108, 255,0.04); border-color: rgba(91, 108, 255,0.2); transform: translateX(2px); box-shadow: 0 2px 8px rgba(91, 108, 255,0.08); }
  .mc-tl-clickable:hover .mc-tl-arrow { transform: translateX(2px); color: #5b6cff; }
  .mc-tl-card-h { display: flex; gap: 6px; align-items: center; margin-bottom: 3px; }
  .mc-tl-tool-name { font-family: var(--mono); font-size: 0.7rem; font-weight: 600; color: var(--ink); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mc-tl-arrow { color: var(--ink-mute); font-size: 0.9rem; font-weight: 600; transition: transform 0.15s; }
  .mc-tl-risk { padding: 0 5px; border-radius: 3px; font-family: var(--mono); font-size: 0.55rem; font-weight: 700; color: white; }
  .mc-tl-risk-l0 { background: #2ecc71; }
  .mc-tl-risk-l1 { background: #f39c12; }
  .mc-tl-risk-l2 { background: var(--carmine); }
  .mc-tl-card-args { font-family: var(--mono); font-size: 0.58rem; color: var(--ink-mute); margin: 2px 0; line-height: 1.4; word-break: break-all; }
  .mc-tl-card-out { font-size: 0.66rem; color: var(--ink-soft); margin-top: 4px; line-height: 1.5; }
  .mc-tl-card-final { background: linear-gradient(135deg, rgba(91, 108, 255,0.04), rgba(91, 108, 255,0.02)); border-color: rgba(91, 108, 255,0.18); }
  .mc-tl-card-final .mc-tl-card-h { font-family: var(--serif); font-size: 0.72rem; font-weight: 700; color: var(--ink); }
  .mc-tl-card-final .mc-tl-card-body { font-size: 0.72rem; color: var(--ink); margin-top: 4px; line-height: 1.6; }
  .mc-tl-user .mc-tl-card { background: rgba(0,0,0,0.025); border-style: dashed; }
  .mc-tl-user .mc-tl-card-h { font-size: 0.62rem; color: var(--ink-mute); margin-bottom: 2px; }
  .mc-tl-user .mc-tl-card-body { font-size: 0.7rem; color: var(--ink); }
  .mc-tl-empty { padding: 20px; text-align: center; color: var(--ink-mute); font-size: 0.7rem; }

  .mc-run-followup {
    display: flex; gap: 6px; margin-top: 10px; padding: 8px 10px;
    background: rgba(91, 108, 255,0.05); border-radius: 10px; border: 1px solid rgba(91, 108, 255,0.12);
  }
  .mc-run-followup .mc-cont-input { flex: 1; padding: 6px 10px; font-size: 0.7rem; border: 1px solid rgba(0,0,0,0.08); border-radius: 6px; background: white; }
  .mc-run-followup .mc-cont-send { padding: 6px 14px; background: #5b6cff; color: white; border: 0; border-radius: 6px; font-size: 0.66rem; font-weight: 600; cursor: pointer; }

  /* ===== Tool detail sheet ===== */
  .mc-tool-sheet-h { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 4px; }
  .mc-tool-sheet-name { font-family: var(--mono); font-size: 1rem; font-weight: 700; color: var(--ink); }
  .mc-tool-sheet-sub { font-size: 0.66rem; color: var(--ink-mute); margin-bottom: 14px; font-family: var(--mono); }
  .mc-tool-pre {
    font-family: var(--mono); font-size: 0.7rem; line-height: 1.6;
    padding: 10px 12px; background: rgba(0,0,0,0.04); color: var(--ink);
    border-radius: 6px; max-height: 280px; overflow-y: auto;
    white-space: pre-wrap; word-wrap: break-word;
  }
  .mc-tool-pre-json { color: #006699; }
  body.dark .mc-tool-pre { background: rgba(255,255,255,0.05); color: var(--ink); }
  body.dark .mc-tool-pre-json { color: #6cbeff; }
  .mc-tool-out-line { font-size: 0.78rem; color: var(--ink); padding: 6px 0; }
  .mc-tool-artifact-line { font-size: 0.66rem; color: var(--ink-soft); margin-top: 4px; }
  .mc-tool-artifact-line code { padding: 1px 5px; background: rgba(0,0,0,0.05); border-radius: 3px; font-size: 0.92em; word-break: break-all; }
  .mc-tool-approve-section { background: rgba(243,156,18,0.06); border-radius: 8px; padding: 10px; }

  /* dark mode for new components */
  body.dark .mc-run-hero { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.08); }
  body.dark .mc-run-hero-pm,
  body.dark .mc-run-hero-dev,
  body.dark .mc-run-hero-designer,
  body.dark .mc-run-hero-ops,
  body.dark .mc-run-hero-marketing,
  body.dark .mc-run-hero-founder { background: rgba(255,255,255,0.06); }
  body.dark .mc-tl-card { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.08); }
  body.dark .mc-tl-clickable:hover .mc-tl-card { background: rgba(91, 108, 255,0.15); }
  body.dark .mc-tl-card-final { background: rgba(91, 108, 255,0.1); }
  body.dark .mc-tl-rail-wrap::before { background: linear-gradient(180deg, rgba(91, 108, 255,0.4), rgba(91, 108, 255,0.15)); }

  /* ============================================================
     Outcome surface (PM 重设计 · 录音 → 真行动)
     ============================================================ */
  .mc-oc-hero {
    padding: 16px 4px 4px;
    margin-bottom: 12px;
    text-align: center;
  }
  .mc-oc-hero-eyebrow {
    font-size: 0.56rem; letter-spacing: 0.18em; text-transform: uppercase;
    color: var(--carmine); font-weight: 700; margin-bottom: 6px;
  }
  .mc-oc-hero-title {
    font-family: var(--serif); font-size: 0.95rem; font-weight: 700;
    color: var(--ink); line-height: 1.3; margin-bottom: 4px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  .mc-oc-hero-sub {
    font-size: 0.6rem; color: var(--ink-mute); line-height: 1.5;
  }

  .mc-oc-grid { display: flex; flex-direction: column; gap: 14px; padding: 0 2px; }
  .mc-oc-cat-row { }
  .mc-oc-cat-h {
    display: flex; align-items: center; gap: 6px;
    font-size: 0.62rem; font-weight: 700; letter-spacing: 0.08em;
    color: var(--ink); text-transform: uppercase; margin-bottom: 6px;
    padding-left: 2px;
  }
  .mc-oc-cat-dot { width: 8px; height: 8px; border-radius: 50%; box-shadow: 0 0 0 3px rgba(255,255,255,0.5); }

  .mc-oc-cells { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 6px; }
  /* advanced 类（高级）单列大卡 */
  .mc-oc-cat-row:last-child .mc-oc-cells { grid-template-columns: 1fr; }

  .mc-oc-card {
    background: linear-gradient(135deg, rgba(255,255,255,0.95), rgba(255,255,255,0.75));
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 10px;
    padding: 10px 12px;
    cursor: pointer;
    position: relative;
    transition: all 0.18s cubic-bezier(.2,.7,.3,1);
    overflow: hidden;
    isolation: isolate;
  }
  .mc-oc-card::before {
    content: '';
    position: absolute; left: 0; top: 0; bottom: 0;
    width: 3px; background: var(--oc-c);
    border-radius: 2px 0 0 2px;
  }
  .mc-oc-card::after {
    content: '';
    position: absolute; top:0;right:0;bottom:0;left:0;
    background: radial-gradient(circle at 100% 0%, var(--oc-c), transparent 60%);
    opacity: 0.06; z-index: -1; pointer-events: none;
    transition: opacity 0.2s;
  }
  .mc-oc-card:hover {
    transform: translateY(-2px);
    border-color: var(--oc-c);
    box-shadow: 0 8px 24px -8px var(--oc-c);
  }
  .mc-oc-card:hover::after { opacity: 0.13; }
  .mc-oc-card:active { transform: translateY(0); }

  .mc-oc-card-ico { font-size: 1.15rem; line-height: 1; margin-bottom: 4px; }
  .mc-oc-card-title { font-family: var(--serif); font-size: 0.72rem; font-weight: 700; color: var(--ink); line-height: 1.3; margin-bottom: 3px; }
  .mc-oc-card-desc { font-size: 0.58rem; color: var(--ink-soft); line-height: 1.45; margin-bottom: 5px; min-height: 30px; }
  .mc-oc-meta { font-size: 0.55rem; color: var(--oc-c); font-family: var(--mono); font-weight: 600; letter-spacing: 0.02em; }

  /* 分类色调 — card 背景做细微染色 */
  .mc-oc-cat-organize    { background: linear-gradient(135deg, rgba(46,204,113,0.04), rgba(255,255,255,0.95)); }
  .mc-oc-cat-comm        { background: linear-gradient(135deg, rgba(91, 108, 255,0.04), rgba(255,255,255,0.95)); }
  .mc-oc-cat-strategy    { background: linear-gradient(135deg, rgba(114,46,209,0.05), rgba(255,255,255,0.95)); }
  .mc-oc-cat-perspective { background: linear-gradient(135deg, rgba(235,47,150,0.04), rgba(255,255,255,0.95)); }
  .mc-oc-cat-advanced    { background: linear-gradient(135deg, rgba(250,84,28,0.06), rgba(255,250,245,0.98)); }
  .mc-oc-cat-advanced .mc-oc-card-desc { min-height: auto; }
  .mc-oc-cat-advanced .mc-oc-card { padding: 12px 14px; }
  .mc-oc-cat-advanced .mc-oc-card-title { font-size: 0.82rem; }
  .mc-oc-cat-advanced .mc-oc-card-desc { font-size: 0.66rem; }

  .mc-oc-advanced-toggle {
    width: 100%; padding: 8px; margin: 10px 0 4px;
    background: transparent; border: 1px dashed rgba(0,0,0,0.15); border-radius: 8px;
    font-size: 0.6rem; color: var(--ink-mute); cursor: pointer; font-weight: 500;
  }
  .mc-oc-advanced-toggle:hover { background: rgba(0,0,0,0.02); color: var(--ink); }
  .mc-oc-advanced { padding: 8px 4px; }
  .mc-oc-custom-row { display: flex; gap: 4px; margin-top: 8px; padding: 6px; background: rgba(0,0,0,0.025); border-radius: 6px; }
  #mc-oc-custom-prompt { flex: 1; font-size: 0.66rem; padding: 6px 8px; border: 1px solid rgba(0,0,0,0.08); border-radius: 4px; background: white; }

  /* dark mode for outcome surface */
  body.dark .mc-oc-card { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.08); color: var(--ink); }
  body.dark .mc-oc-cat-organize    { background: linear-gradient(135deg, rgba(46,204,113,0.12), rgba(255,255,255,0.05)); }
  body.dark .mc-oc-cat-comm        { background: linear-gradient(135deg, rgba(91, 108, 255,0.12), rgba(255,255,255,0.05)); }
  body.dark .mc-oc-cat-strategy    { background: linear-gradient(135deg, rgba(114,46,209,0.14), rgba(255,255,255,0.05)); }
  body.dark .mc-oc-cat-perspective { background: linear-gradient(135deg, rgba(235,47,150,0.12), rgba(255,255,255,0.05)); }
  body.dark .mc-oc-cat-advanced    { background: linear-gradient(135deg, rgba(250,84,28,0.15), rgba(255,255,255,0.06)); }
  body.dark .mc-oc-advanced-toggle { border-color: rgba(255,255,255,0.15); }
  body.dark #mc-oc-custom-prompt { background: rgba(255,255,255,0.05); color: var(--ink); border-color: rgba(255,255,255,0.1); }

  /* ============================================================
     纪要屏 · 钉钉级图文并茂 (PM 重设计)
     ============================================================ */
  .mc-sm-hero { padding: 14px 4px 10px; border-bottom: 1px solid var(--rule-faint); margin-bottom: 12px; }
  .mc-sm-hero-eyebrow { font-size: 0.56rem; color: var(--ink-mute); letter-spacing: 0.08em; font-family: var(--mono); margin-bottom: 4px; }
  .mc-sm-hero-title { font-family: var(--serif); font-size: 1.05rem; font-weight: 700; color: var(--ink); line-height: 1.25; margin: 2px 0 8px; }
  .mc-sm-audio { margin-bottom: 12px; }

  .mc-sm-section { margin-bottom: 16px; }
  .mc-sm-section-h { display: flex; align-items: center; gap: 6px; font-family: var(--serif); font-size: 0.78rem; font-weight: 700; color: var(--ink); margin-bottom: 8px; }
  .mc-sm-section-num { font-family: var(--mono); font-size: 0.62rem; font-weight: 700; color: var(--carmine); background: rgba(196,67,58,0.1); padding: 1px 6px; border-radius: 3px; }
  .mc-sm-sub-h { font-size: 0.6rem; color: var(--ink-mute); letter-spacing: 0.06em; text-transform: uppercase; margin-bottom: 4px; }

  /* AI 摘要 */
  .mc-ai-summary { position: relative; padding: 12px 12px 12px 38px; background: linear-gradient(135deg, rgba(91, 108, 255,0.04), rgba(91, 108, 255,0.01)); border: 1px solid rgba(91, 108, 255,0.18); border-radius: 8px; }
  .mc-ai-badge { position: absolute; left: 8px; top: 10px; width: 24px; height: 24px; border-radius: 6px; background: linear-gradient(135deg, #5b6cff, #22c3ee); color: white; font-size: 0.55rem; font-weight: 800; font-family: var(--mono); display: flex; align-items: center; justify-content: center; }
  .mc-ai-summary-body { font-size: 0.72rem; line-height: 1.65; color: var(--ink); }

  /* 思维导图 */
  .mc-mindmap-wrap { padding: 4px; background: linear-gradient(135deg, rgba(247,247,252,0.7), rgba(255,255,255,0.4)); border-radius: 10px; overflow: hidden; }
  .mc-mindmap-svg { width: 100%; height: auto; display: block; }

  /* 决策引言墙 */
  .mc-quote-wall { display: grid; grid-template-columns: 1fr; gap: 8px; }
  .mc-quote-card { position: relative; padding: 14px 12px 10px 36px; background: linear-gradient(135deg, rgba(114,46,209,0.04), rgba(114,46,209,0.01)); border-left: 3px solid #722ED1; border-radius: 0 8px 8px 0; }
  .mc-quote-mark { position: absolute; left: 8px; top: 0; font-family: var(--serif); font-size: 2rem; line-height: 1; color: rgba(114,46,209,0.4); }
  .mc-quote-body { font-size: 0.78rem; line-height: 1.55; color: var(--ink); font-weight: 500; }
  .mc-quote-tag { font-size: 0.55rem; color: #722ED1; font-family: var(--mono); font-weight: 600; letter-spacing: 0.06em; margin-top: 4px; }

  /* Kanban */
  .mc-kanban { display: grid; grid-template-columns: repeat(auto-fit, minmax(95px, 1fr)); gap: 6px; }
  .mc-kanban-col { background: rgba(0,0,0,0.025); border-top: 3px solid var(--col-c); border-radius: 8px 8px 6px 6px; padding: 6px; display: flex; flex-direction: column; gap: 5px; min-height: 60px; }
  .mc-kanban-h { display: flex; align-items: center; gap: 4px; padding: 2px 4px 5px; border-bottom: 1px dashed rgba(0,0,0,0.06); margin-bottom: 2px; }
  .mc-kanban-lvl { font-family: var(--mono); font-size: 0.55rem; font-weight: 700; color: white; background: var(--col-c); padding: 1px 4px; border-radius: 3px; }
  .mc-kanban-name { font-size: 0.6rem; color: var(--ink); font-weight: 600; flex: 1; }
  .mc-kanban-count { font-family: var(--mono); font-size: 0.62rem; font-weight: 700; color: var(--col-c); }
  .mc-kanban-card { padding: 6px 7px; background: white; border-radius: 5px; box-shadow: 0 1px 2px rgba(0,0,0,0.05); border-left: 2px solid var(--col-c); }
  .mc-kanban-card-title { font-size: 0.62rem; font-weight: 600; color: var(--ink); line-height: 1.4; }
  .mc-kanban-card-meta { font-size: 0.52rem; color: var(--ink-mute); margin-top: 2px; font-family: var(--mono); }
  .mc-kanban-empty { padding: 12px 0; text-align: center; font-size: 0.55rem; color: var(--ink-mute); }

  /* People row */
  .mc-people-row { display: flex; gap: 6px; flex-wrap: wrap; }
  .mc-person-pill { display: flex; gap: 6px; align-items: center; padding: 4px 10px 4px 4px; background: white; border: 1px solid rgba(0,0,0,0.06); border-radius: 999px; cursor: pointer; transition: all 0.15s; }
  .mc-person-pill:hover { box-shadow: 0 2px 6px rgba(0,0,0,0.1); transform: translateY(-1px); }
  .mc-person-av { width: 22px; height: 22px; border-radius: 50%; color: white; font-size: 0.62rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
  .mc-person-name { font-size: 0.66rem; font-weight: 600; color: var(--ink); }

  /* Topic cloud */
  .mc-topic-cloud { display: flex; flex-wrap: wrap; gap: 4px 5px; align-items: baseline; padding: 4px 0; }
  .mc-topic-bubble { display: inline-block; padding: 3px 10px; border-radius: 999px; font-weight: 600; border: 1px solid; line-height: 1.4; transition: transform 0.12s; }
  .mc-topic-bubble:hover { transform: scale(1.05); }

  /* 关联录音卡 */
  .mc-rel-card { display: flex; gap: 8px; align-items: center; padding: 8px 10px; background: white; border: 1px solid rgba(0,0,0,0.06); border-radius: 8px; cursor: pointer; margin-bottom: 4px; transition: all 0.15s; }
  .mc-rel-card:hover { background: rgba(91, 108, 255,0.04); border-color: rgba(91, 108, 255,0.2); }
  .mc-rel-score { background: rgba(91, 108, 255,0.12); color: #5b6cff; padding: 3px 8px; border-radius: 4px; font-family: var(--mono); font-size: 0.6rem; font-weight: 700; }
  .mc-rel-body { flex: 1; min-width: 0; }
  .mc-rel-title { font-size: 0.7rem; color: var(--ink); font-weight: 600; }
  .mc-rel-note { font-size: 0.55rem; color: var(--ink-mute); margin-top: 1px; }
  .mc-rel-arrow { color: var(--ink-mute); font-size: 0.9rem; }

  /* ============================================================
     记忆屏 6 卡 · 可视化（PM 重设计）
     ============================================================ */
  .mc-mem-empty { padding: 16px; text-align: center; color: var(--ink-mute); font-size: 0.7rem; }

  /* 关系网络图 */
  .mc-mem-net-wrap { background: linear-gradient(135deg, rgba(247,247,252,0.7), rgba(255,255,255,0.4)); border-radius: 8px; padding: 4px; margin: 4px 0; }
  .mc-mem-net-svg { width: 100%; height: auto; display: block; }
  .mc-mem-node:hover circle { transform-origin: center; transform: scale(1.12); transition: transform 0.15s; }
  .mc-mem-net-legend { display: flex; flex-wrap: wrap; gap: 4px 8px; padding: 4px 2px; }
  .mc-mem-leg { display: flex; align-items: center; gap: 4px; font-size: 0.58rem; color: var(--ink); }
  .mc-mem-leg-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--c); }

  /* Insight 卡（本周沉淀） */
  .mc-insight-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); gap: 6px; padding: 2px 0; }
  .mc-insight-card { display: flex; gap: 6px; align-items: flex-start; padding: 8px; background: white; border-radius: 8px; border-left: 3px solid var(--ic); box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
  .mc-insight-ico { font-size: 1rem; flex-shrink: 0; line-height: 1; padding-top: 1px; }
  .mc-insight-body { font-size: 0.62rem; color: var(--ink); line-height: 1.5; flex: 1; }

  /* Donut / 决策画像 */
  .mc-portrait-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); gap: 10px; align-items: center; padding: 4px 0; }
  .mc-donut { width: 80px; flex-shrink: 0; }
  .mc-donut-svg { width: 100%; height: auto; display: block; }
  .mc-portrait-stats { flex: 1; display: flex; flex-direction: column; gap: 6px; }
  .mc-portrait-stat { padding: 4px 8px; background: rgba(0,0,0,0.03); border-radius: 6px; }
  .mc-portrait-stat-num { font-family: var(--serif); font-size: 0.95rem; font-weight: 700; color: var(--ink); line-height: 1.1; }
  .mc-portrait-stat-lab { font-size: 0.55rem; color: var(--ink-mute); margin-top: 1px; }
  .mc-portrait-note { font-size: 0.58rem; color: var(--ink-mute); text-align: center; padding: 6px 0 2px; font-style: italic; }

  /* SVG 雷达图 */
  .mc-radar-wrap { padding: 4px; background: linear-gradient(135deg, rgba(247,247,252,0.5), rgba(255,255,255,0.3)); border-radius: 8px; }
  .mc-radar-svg { width: 100%; height: auto; display: block; }

  /* 跨会议主线 bar */
  .mc-thread-list { display: flex; flex-direction: column; gap: 6px; padding: 2px 0; }
  .mc-thread-bar { display: flex; gap: 8px; align-items: center; padding: 6px 8px; background: white; border-radius: 6px; border: 1px solid rgba(0,0,0,0.05); cursor: pointer; transition: all 0.15s; }
  .mc-thread-bar:hover { transform: translateX(2px); border-color: rgba(91, 108, 255,0.3); box-shadow: 0 2px 6px rgba(91, 108, 255,0.08); }
  .mc-thread-bar-name { font-size: 0.66rem; font-weight: 600; color: var(--ink); min-width: 90px; max-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mc-thread-bar-track { flex: 1; height: 8px; background: rgba(0,0,0,0.05); border-radius: 4px; overflow: hidden; }
  .mc-thread-bar-fill { height: 100%; background: linear-gradient(90deg, #5b6cff, #22c3ee); border-radius: 4px; transition: width 0.6s; }
  .mc-thread-bar-count { font-family: var(--mono); font-size: 0.62rem; font-weight: 700; color: #5b6cff; min-width: 36px; text-align: right; }

  /* Dark mode for memory + summary new components */
  body.dark .mc-ai-summary { background: linear-gradient(135deg, rgba(91, 108, 255,0.12), rgba(91, 108, 255,0.04)); }
  body.dark .mc-quote-card { background: linear-gradient(135deg, rgba(114,46,209,0.12), rgba(114,46,209,0.04)); }
  body.dark .mc-mindmap-wrap, body.dark .mc-radar-wrap, body.dark .mc-mem-net-wrap { background: rgba(255,255,255,0.04); }
  body.dark .mc-kanban-col { background: rgba(255,255,255,0.05); }
  body.dark .mc-kanban-card { background: rgba(255,255,255,0.08); }
  body.dark .mc-insight-card, body.dark .mc-thread-bar, body.dark .mc-rel-card, body.dark .mc-person-pill { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.1); }
  body.dark .mc-portrait-stat { background: rgba(255,255,255,0.06); }

  /* ============================================================
     Wave 1 · 图谱推理产出 — 升级后的卡片 + 3 新屏 + 侧栏
     ============================================================ */
  /* 决策画像新增 */
  .mc-donut-sub { font-size: 0.55rem; color: var(--ink-mute); text-align: center; margin-top: 2px; line-height: 1.3; }
  .mc-portrait-revrate { float: right; font-size: 0.55rem; color: #e0444c; font-weight: 600; background: rgba(224,68,76,0.08); padding: 1px 6px; border-radius: 6px; }
  .mc-portrait-chips { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px 2px 2px; }
  .mc-portrait-chip { display: inline-flex; align-items: center; gap: 3px; font-size: 0.56rem; color: var(--ink); background: rgba(0,0,0,0.04); padding: 2px 7px; border-radius: 10px; line-height: 1.4; }
  .mc-portrait-chip b { font-family: var(--mono); font-weight: 700; }
  .mc-portrait-chip.mc-chip-warn { background: rgba(245,166,35,0.12); color: #c87900; }
  .mc-portrait-chip.mc-chip-warn b { color: #c87900; }
  .mc-portrait-chip.mc-chip-bad { background: rgba(224,68,76,0.12); color: #c41e2a; }
  .mc-portrait-chip.mc-chip-bad b { color: #c41e2a; }
  .mc-portrait-chip.mc-chip-mute { color: var(--ink-mute); }
  .mc-portrait-pos { padding: 6px 0 2px; }
  .mc-portrait-pos-bar { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: rgba(0,0,0,0.05); }
  .mc-portrait-pos-seg { height: 100%; transition: width 0.5s; }
  .mc-portrait-pos-seg.mc-pos-early { background: #5cb85c; }
  .mc-portrait-pos-seg.mc-pos-mid   { background: #5bc0de; }
  .mc-portrait-pos-seg.mc-pos-late  { background: #f0ad4e; }
  .mc-portrait-pos-leg { display: flex; flex-wrap: wrap; gap: 6px 10px; padding: 5px 0 2px; font-size: 0.54rem; color: var(--ink-mute); }
  .mc-portrait-pos-leg span { display: inline-flex; align-items: center; gap: 4px; }
  .mc-portrait-pos-leg i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; }
  .mc-portrait-pos-leg i.mc-pos-early { background: #5cb85c; }
  .mc-portrait-pos-leg i.mc-pos-mid { background: #5bc0de; }
  .mc-portrait-pos-leg i.mc-pos-late { background: #f0ad4e; }
  .mc-portrait-pos-n { margin-left: auto; font-family: var(--mono); }

  /* 关系网络 legend pill */
  .mc-mem-leg-pill { display: inline-flex; align-items: center; gap: 4px; font-size: 0.55rem; color: var(--ink); padding: 1px 6px; border-radius: 8px; background: rgba(0,0,0,0.03); }
  .mc-mem-leg-pill i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--c); }

  /* 本周沉淀新增 — coach block + chip + fallback tag */
  .mc-h5-chip { display: inline-block; font-size: 0.55rem; font-weight: 600; background: linear-gradient(135deg, rgba(91, 108, 255,0.15), rgba(91, 108, 255,0.05)); color: #5b6cff; padding: 1px 7px; border-radius: 8px; margin-left: 4px; }
  .mc-fallback-tag { display: inline-block; font-size: 0.52rem; font-weight: 500; color: var(--ink-mute); background: rgba(0,0,0,0.05); padding: 1px 6px; border-radius: 6px; margin-left: 4px; }
  .mc-coach-block { margin-top: 8px; padding: 8px 10px; background: linear-gradient(135deg, rgba(46,204,113,0.07), rgba(91, 108, 255,0.04)); border-radius: 8px; border-left: 3px solid #2ecc71; }
  .mc-coach-h { font-size: 0.6rem; font-weight: 700; color: var(--ink); margin-bottom: 4px; letter-spacing: 0.02em; }
  .mc-coach-row { font-size: 0.62rem; color: var(--ink); line-height: 1.55; display: flex; gap: 6px; padding: 2px 0; }
  .mc-coach-arrow { color: #2ecc71; font-weight: 700; flex-shrink: 0; }

  /* 主线 pattern bar (severity 着色) */
  .mc-pattern-bar { border-left: 3px solid var(--sev, #5b6cff); }

  /* 侧栏（人 / pattern 通用 right slide） */
  .mc-side-panel { position: fixed; top:0;right:0;bottom:0;left:0; background: rgba(8,10,20,0.42); backdrop-filter: blur(6px); z-index: 9000; display: flex; justify-content: flex-end; opacity: 0; pointer-events: none; transition: opacity 0.2s; }
  .mc-side-panel.active { opacity: 1; pointer-events: auto; }
  .mc-side-inner { width: min(420px, 92vw); height: 100%; background: white; box-shadow: -8px 0 32px rgba(0,0,0,0.18); padding: 18px 20px; overflow-y: auto; transform: translateX(20px); transition: transform 0.25s; }
  .mc-side-panel.active .mc-side-inner { transform: translateX(0); }
  body.dark .mc-side-inner { background: #1a1d2e; color: #e8eaf2; }
  .mc-side-head { position: relative; padding-bottom: 10px; border-bottom: 1px solid rgba(0,0,0,0.06); margin-bottom: 14px; }
  body.dark .mc-side-head { border-color: rgba(255,255,255,0.08); }
  .mc-side-x { position: absolute; top: -2px; right: -4px; background: none; border: 0; font-size: 22px; color: var(--ink-mute); cursor: pointer; padding: 4px 8px; line-height: 1; }
  .mc-side-name { font-family: var(--serif); font-size: 1.2rem; font-weight: 700; color: var(--ink); padding-right: 30px; }
  body.dark .mc-side-name { color: #fff; }
  .mc-side-sub { font-size: 0.7rem; color: var(--ink-mute); margin-top: 4px; line-height: 1.5; }
  .mc-side-body h6 { font-size: 0.75rem; font-weight: 700; color: var(--ink); margin: 12px 0 8px; }
  body.dark .mc-side-body h6 { color: #fff; }
  .mc-side-empty { font-size: 0.72rem; color: var(--ink-mute); padding: 10px 0; line-height: 1.6; }
  .mc-side-btn { display: block; width: 100%; padding: 10px 14px; margin-top: 8px; background: linear-gradient(135deg, #5b6cff, #22c3ee); color: #fff; border: 0; border-radius: 10px; font-size: 0.78rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
  .mc-side-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(91, 108, 255,0.28); }
  .mc-side-btn:disabled { opacity: 0.6; cursor: wait; transform: none; box-shadow: none; }
  .mc-side-btn-ghost { background: rgba(0,0,0,0.04); color: var(--ink); box-shadow: none; }
  body.dark .mc-side-btn-ghost { background: rgba(255,255,255,0.08); color: #e8eaf2; }
  .mc-evi-card { padding: 8px 10px; border-radius: 8px; background: rgba(0,0,0,0.03); margin-bottom: 6px; }
  body.dark .mc-evi-card { background: rgba(255,255,255,0.05); }
  .mc-evi-ttl { font-size: 0.74rem; font-weight: 600; color: var(--ink); line-height: 1.4; }
  body.dark .mc-evi-ttl { color: #fff; }
  .mc-evi-meta { font-size: 0.6rem; color: var(--ink-mute); font-family: var(--mono); margin-top: 2px; }

  /* 洞察屏 */
  .mc-insight-screen { padding: 4px 0; }
  .mc-insight-toggle { float: right; display: inline-flex; gap: 4px; }
  .mc-it-btn { background: rgba(0,0,0,0.04); border: 0; padding: 3px 9px; border-radius: 10px; font-size: 0.6rem; cursor: pointer; color: var(--ink); }
  .mc-it-btn.active { background: linear-gradient(135deg, #5b6cff, #22c3ee); color: #fff; font-weight: 600; }
  .mc-it-btn.mc-it-scan { background: rgba(46,204,113,0.12); color: #1a8a4d; font-weight: 600; }
  .mc-it-btn.mc-it-scan:hover { background: rgba(46,204,113,0.22); }
  .mc-isight-hero { padding: 10px 12px; border-radius: 12px; background: linear-gradient(135deg, rgba(91, 108, 255,0.08), rgba(114,46,209,0.05)); margin-bottom: 12px; }
  .mc-isight-period { font-size: 0.68rem; color: var(--ink-mute); margin-bottom: 8px; font-weight: 600; }
  .mc-isight-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .mc-isight-kpi { text-align: center; padding: 6px 4px; background: rgba(255,255,255,0.6); border-radius: 8px; }
  body.dark .mc-isight-kpi { background: rgba(255,255,255,0.06); }
  .mc-isight-kpi-n { font-family: var(--serif); font-size: 1.4rem; font-weight: 800; color: var(--ink); line-height: 1.1; }
  body.dark .mc-isight-kpi-n { color: #fff; }
  .mc-isight-kpi-l { font-size: 0.55rem; color: var(--ink-mute); margin-top: 2px; }
  .mc-isight-kpi-bad .mc-isight-kpi-n { color: #e0444c; }
  .mc-isight-tops { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
  .mc-isight-toplist h6 { font-size: 0.62rem; font-weight: 700; color: var(--ink-mute); margin-bottom: 4px; letter-spacing: 0.04em; }
  .mc-isight-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 0.58rem; padding: 2px 7px; background: rgba(0,0,0,0.05); border-radius: 10px; margin: 2px 3px 2px 0; color: var(--ink); }
  body.dark .mc-isight-chip { background: rgba(255,255,255,0.07); }
  .mc-isight-chip i { font-family: var(--mono); font-style: normal; color: #5b6cff; font-weight: 700; }
  .mc-isight-sec { margin-bottom: 14px; }
  .mc-isight-sec h5 { font-size: 0.78rem; font-weight: 700; color: var(--ink); margin: 0 0 8px; letter-spacing: 0.01em; }
  body.dark .mc-isight-sec h5 { color: #fff; }
  .mc-isight-pat { padding: 8px 10px; margin-bottom: 6px; border-radius: 8px; background: white; border-left: 3px solid #5b6cff; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
  body.dark .mc-isight-pat { background: rgba(255,255,255,0.06); }
  .mc-isight-pat.mc-isight-sev-high { border-left-color: #e0444c; }
  .mc-isight-pat.mc-isight-sev-medium { border-left-color: #f5a623; }
  .mc-isight-pat-h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
  .mc-isight-pat-kind { font-size: 0.58rem; font-weight: 700; color: var(--ink-mute); letter-spacing: 0.04em; text-transform: uppercase; }
  .mc-isight-pat-sev { font-size: 0.54rem; padding: 1px 6px; border-radius: 6px; background: rgba(0,0,0,0.05); color: var(--ink-mute); }
  .mc-isight-sev-high .mc-isight-pat-sev { background: rgba(224,68,76,0.14); color: #c41e2a; font-weight: 700; }
  .mc-isight-sev-medium .mc-isight-pat-sev { background: rgba(245,166,35,0.14); color: #c87900; font-weight: 600; }
  .mc-isight-pat-body { font-size: 0.68rem; color: var(--ink); line-height: 1.55; }
  body.dark .mc-isight-pat-body { color: #e8eaf2; }
  .mc-isight-pat-evi { background: none; border: 0; color: #5b6cff; font-size: 0.6rem; padding: 4px 0 0; cursor: pointer; font-weight: 600; }
  .mc-isight-coach { padding: 10px 12px; background: linear-gradient(135deg, rgba(46,204,113,0.07), rgba(91, 108, 255,0.04)); border-radius: 10px; border-left: 3px solid #2ecc71; }
  .mc-isight-advice { display: flex; gap: 6px; padding: 4px 0; font-size: 0.68rem; line-height: 1.55; color: var(--ink); }
  body.dark .mc-isight-advice { color: #e8eaf2; }
  .mc-isight-advice-ico { color: #2ecc71; font-weight: 700; flex-shrink: 0; }
  .mc-isight-blind { padding: 10px 12px; background: rgba(0,0,0,0.03); border-radius: 10px; border: 1px dashed rgba(0,0,0,0.18); }
  body.dark .mc-isight-blind { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.18); }
  .mc-isight-blind h5 { color: var(--ink); }
  .mc-isight-blind-row { font-size: 0.68rem; line-height: 1.55; color: var(--ink); padding: 3px 0; }
  body.dark .mc-isight-blind-row { color: #e8eaf2; }
  .mc-isight-actions { }
  .mc-isight-act-card { padding: 10px 12px; margin-bottom: 8px; background: white; border-radius: 10px; box-shadow: 0 1px 4px rgba(0,0,0,0.05); }
  body.dark .mc-isight-act-card { background: rgba(255,255,255,0.06); }
  .mc-isight-act-ttl { font-size: 0.72rem; font-weight: 700; color: var(--ink); margin-bottom: 3px; }
  body.dark .mc-isight-act-ttl { color: #fff; }
  .mc-isight-act-rat { font-size: 0.6rem; color: var(--ink-mute); line-height: 1.5; margin-bottom: 6px; }
  .mc-isight-act-foot { display: flex; gap: 6px; align-items: center; }
  .mc-isight-act-btn { background: linear-gradient(135deg, #5b6cff, #22c3ee); color: #fff; border: 0; padding: 6px 12px; border-radius: 8px; font-size: 0.64rem; font-weight: 600; cursor: pointer; text-decoration: none; display: inline-block; }
  .mc-isight-act-btn:hover { transform: translateY(-1px); }
  .mc-isight-act-checkbox { display: inline-flex; align-items: center; gap: 5px; font-size: 0.64rem; color: var(--ink); cursor: pointer; }

  /* Initiative / Conflict cards */
  .mc-init-list { padding: 4px 0; }
  .mc-init-empty { text-align: center; padding: 32px 16px; }
  .mc-init-empty-ico { font-size: 2.2rem; opacity: 0.45; margin-bottom: 8px; }
  .mc-init-card, .mc-conf-card { padding: 12px 14px; margin-bottom: 10px; background: white; border-radius: 12px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); transition: all 0.25s; }
  body.dark .mc-init-card, body.dark .mc-conf-card { background: rgba(255,255,255,0.06); }
  .mc-init-card.mc-init-gone { opacity: 0; transform: translateX(20px); }
  .mc-init-h { display: flex; gap: 8px; align-items: flex-start; }
  .mc-init-ico { font-size: 1.2rem; flex-shrink: 0; line-height: 1.2; padding-top: 1px; }
  .mc-init-h-text { flex: 1; min-width: 0; }
  .mc-init-ttl { font-size: 0.78rem; font-weight: 700; color: var(--ink); line-height: 1.4; }
  body.dark .mc-init-ttl { color: #fff; }
  .mc-init-target { display: inline-block; margin-left: 6px; font-size: 0.62rem; color: #5b6cff; font-weight: 500; background: rgba(91, 108, 255,0.08); padding: 1px 6px; border-radius: 6px; }
  .mc-init-rat { font-size: 0.62rem; color: var(--ink-mute); line-height: 1.5; margin-top: 3px; }
  .mc-init-draft { margin-top: 8px; }
  .mc-init-draft summary { font-size: 0.62rem; color: #5b6cff; cursor: pointer; padding: 4px 0; outline: none; user-select: none; }
  .mc-init-textarea { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px; font-size: 0.7rem; font-family: var(--serif); line-height: 1.55; color: var(--ink); background: rgba(0,0,0,0.02); resize: vertical; margin-top: 6px; }
  body.dark .mc-init-textarea { background: rgba(0,0,0,0.18); border-color: rgba(255,255,255,0.12); color: #e8eaf2; }
  .mc-init-foot { display: flex; gap: 6px; margin-top: 10px; flex-wrap: wrap; }
  .mc-init-btn { background: rgba(0,0,0,0.05); color: var(--ink); border: 0; padding: 6px 12px; border-radius: 8px; font-size: 0.64rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
  body.dark .mc-init-btn { background: rgba(255,255,255,0.08); color: #e8eaf2; }
  .mc-init-btn:hover { transform: translateY(-1px); }
  .mc-init-btn-primary { background: linear-gradient(135deg, #5b6cff, #22c3ee); color: #fff; }
  .mc-init-btn-ghost { background: transparent; color: var(--ink-mute); }

  /* Conflict candidates */
  .mc-conf-cands { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; }
  .mc-conf-cand { display: flex; gap: 8px; padding: 8px 10px; background: rgba(0,0,0,0.03); border-radius: 8px; cursor: pointer; transition: background 0.15s; border: 1px solid transparent; }
  .mc-conf-cand:hover { background: rgba(91, 108, 255,0.06); border-color: rgba(91, 108, 255,0.18); }
  body.dark .mc-conf-cand { background: rgba(255,255,255,0.05); }
  .mc-conf-cand input { margin-top: 2px; }
  .mc-conf-cand-lab { font-size: 0.72rem; font-weight: 600; color: var(--ink); }
  body.dark .mc-conf-cand-lab { color: #fff; }
  .mc-conf-cand-rat { font-size: 0.6rem; color: var(--ink-mute); margin-top: 2px; line-height: 1.45; }

  /* Bottombar/Pill badges */
  .mc-bb-badge-host { position: relative; }
  .mc-bb-badge { position: absolute; top: 2px; right: 14%; background: #e0444c; color: #fff; font-size: 9px; font-weight: 700; min-width: 14px; height: 14px; line-height: 14px; padding: 0 4px; border-radius: 7px; box-shadow: 0 0 0 2px white; }
  .mc-pill-badge-host { position: relative; }
  .mc-pill-badge { display: inline-block; margin-left: 4px; background: #e0444c; color: #fff; font-size: 0.55rem; font-weight: 700; padding: 1px 6px; border-radius: 7px; min-width: 16px; text-align: center; }

  body.dark .mc-isight-pat, body.dark .mc-isight-act-card, body.dark .mc-init-card, body.dark .mc-conf-card { box-shadow: 0 1px 4px rgba(0,0,0,0.4); }

  /* ============================================================
     Wave 2 · 我的偏好 · 反思抽屉 · 时间穿透
     ============================================================ */
  /* 偏好屏 toolbar / chip */
  .mc-pref-toolbar { padding: 6px 4px 4px; display: flex; flex-direction: column; gap: 6px; }
  .mc-pref-kinds { display: flex; gap: 4px; overflow-x: auto; padding-bottom: 2px; }
  .mc-pref-kinds::-webkit-scrollbar { height: 3px; }
  .mc-pref-kinds::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.1); border-radius: 2px; }
  .mc-pref-kind { flex-shrink: 0; background: rgba(0,0,0,0.05); color: var(--ink); border: 0; padding: 4px 10px; border-radius: 12px; font-size: 0.6rem; font-weight: 600; cursor: pointer; transition: all 0.15s; white-space: nowrap; }
  body.dark .mc-pref-kind { background: rgba(255,255,255,0.08); color: #e8eaf2; }
  .mc-pref-kind:hover { background: rgba(91, 108, 255,0.12); color: #5b6cff; }
  .mc-pref-kind.active { background: linear-gradient(135deg, #5b6cff, #22c3ee); color: #fff; }
  .mc-pref-mute-toggle { display: inline-flex; align-items: center; gap: 5px; font-size: 0.6rem; color: var(--ink-mute); cursor: pointer; padding: 2px 4px; }
  .mc-pref-mute-toggle input { margin: 0; }

  /* 偏好卡 */
  .mc-pref-list { padding: 4px 0; }
  .mc-pref-card { padding: 10px 12px; margin-bottom: 8px; background: white; border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); transition: all 0.25s; }
  body.dark .mc-pref-card { background: rgba(255,255,255,0.06); box-shadow: 0 1px 4px rgba(0,0,0,0.4); }
  .mc-pref-card.mc-pref-muted { opacity: 0.45; filter: grayscale(0.6); }
  .mc-pref-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; }
  .mc-pref-kind { /* override above on card header — but our card uses :first-child label, so ok */ }
  .mc-pref-card .mc-pref-kind { background: rgba(91, 108, 255,0.12); color: #5b6cff; padding: 2px 8px; border-radius: 8px; font-size: 0.56rem; font-weight: 700; pointer-events: none; }
  .mc-pref-conf { display: inline-block; background: rgba(0,0,0,0.06); color: var(--ink-mute); font-size: 0.55rem; font-weight: 700; padding: 1px 6px; border-radius: 6px; font-family: JetBrains Mono, monospace; }
  body.dark .mc-pref-conf { background: rgba(255,255,255,0.1); }
  .mc-pref-src { font-size: 0.56rem; color: var(--ink-mute); }
  .mc-pref-statement { font-size: 0.74rem; font-weight: 600; color: var(--ink); line-height: 1.5; padding: 6px 0; cursor: text; border-radius: 6px; transition: background 0.15s; }
  body.dark .mc-pref-statement { color: #f0f2fa; }
  .mc-pref-statement:hover { background: rgba(91, 108, 255,0.04); }
  .mc-pref-rationale { font-size: 0.6rem; color: var(--ink-mute); line-height: 1.5; padding: 4px 0 0; border-top: 1px dashed rgba(0,0,0,0.05); }
  body.dark .mc-pref-rationale { border-color: rgba(255,255,255,0.08); }
  .mc-pref-foot { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
  .mc-pref-edit-area { width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid rgba(91, 108, 255,0.35); border-radius: 6px; font-size: 0.72rem; font-family: var(--serif); line-height: 1.55; color: var(--ink); background: rgba(91, 108, 255,0.04); resize: vertical; }
  body.dark .mc-pref-edit-area { background: rgba(91, 108, 255,0.08); color: #f0f2fa; }
  .mc-pref-edit-actions { display: flex; gap: 6px; margin-top: 6px; }

  /* 偏好 modal */
  .mc-pref-modal { display: none; position: fixed; top:0;right:0;bottom:0;left:0; z-index: 1200; }
  .mc-pref-modal.active { display: block; }
  .mc-pref-modal-mask { position: absolute; top:0;right:0;bottom:0;left:0; background: rgba(0,0,0,0.42); backdrop-filter: blur(2px); }
  .mc-pref-modal-panel { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; border-radius: 14px; padding: 18px 18px 14px; width: min(92vw, 380px); box-shadow: 0 20px 60px rgba(0,0,0,0.3); }
  body.dark .mc-pref-modal-panel { background: #1c1f29; color: #f0f2fa; }
  .mc-pref-modal-h { font-size: 0.95rem; font-weight: 800; margin-bottom: 14px; }
  .mc-pref-modal-row { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
  .mc-pref-modal-row label { font-size: 0.62rem; color: var(--ink-mute); font-weight: 600; }
  .mc-pref-modal-row select, .mc-pref-modal-row textarea { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid rgba(0,0,0,0.12); border-radius: 8px; font-size: 0.72rem; font-family: var(--serif); color: var(--ink); background: rgba(0,0,0,0.02); }
  body.dark .mc-pref-modal-row select, body.dark .mc-pref-modal-row textarea { background: rgba(0,0,0,0.3); color: #f0f2fa; border-color: rgba(255,255,255,0.12); }
  .mc-pref-modal-foot { display: flex; gap: 8px; justify-content: flex-end; margin-top: 6px; }

  /* 学到偏好 hint @ 冲突屏底部 */
  .mc-conf-learn-hint { display: flex; align-items: center; gap: 6px; padding: 8px 10px; margin-bottom: 10px; background: linear-gradient(90deg, rgba(91, 108, 255,0.08), rgba(114,46,209,0.05)); border-radius: 10px; font-size: 0.62rem; color: var(--ink-mute); cursor: pointer; transition: transform 0.15s; }
  .mc-conf-learn-hint:hover { transform: translateY(-1px); }
  .mc-conf-learn-hint u { color: #5b6cff; text-decoration: none; font-weight: 600; }
  .mc-conf-learn-ico { color: #5b6cff; }

  /* Pattern 卡上的「让我反思」按钮 */
  .mc-isight-pat-reflect { margin-left: auto; background: rgba(114,46,209,0.1); color: #722ED1; border: 0; padding: 3px 9px; border-radius: 9px; font-size: 0.56rem; font-weight: 700; cursor: pointer; transition: all 0.15s; }
  .mc-isight-pat-reflect:hover { background: #722ED1; color: #fff; transform: translateY(-1px); }

  /* Person 侧栏新按钮 */
  .mc-side-btn-time { background: linear-gradient(135deg, #722ED1, #9a5ee0) !important; color: #fff; }

  /* 反思抽屉 */
  .mc-refl-drawer { display: none; position: fixed; top:0;right:0;bottom:0;left:0; z-index: 1300; }
  .mc-refl-drawer.active { display: block; }
  .mc-refl-mask { position: absolute; top:0;right:0;bottom:0;left:0; background: rgba(0,0,0,0.38); backdrop-filter: blur(2px); }
  .mc-refl-panel { position: absolute; right: 0; top: 0; bottom: 0; width: min(560px, 92vw); background: white; box-shadow: -10px 0 32px rgba(0,0,0,0.18); display: flex; flex-direction: column; transform: translateX(100%); animation: mcReflSlide 0.28s ease-out forwards; }
  body.dark .mc-refl-panel { background: #1a1d27; color: #f0f2fa; }
  @keyframes mcReflSlide { to { transform: translateX(0); } }
  .mc-refl-head { padding: 16px 18px 12px; border-bottom: 1px solid rgba(0,0,0,0.06); position: relative; background: linear-gradient(135deg, rgba(114,46,209,0.06), rgba(91, 108, 255,0.04)); }
  body.dark .mc-refl-head { border-color: rgba(255,255,255,0.08); }
  .mc-refl-x { position: absolute; top: 12px; right: 12px; background: none; border: 0; font-size: 1.4rem; color: var(--ink-mute); cursor: pointer; line-height: 1; padding: 4px 8px; }
  .mc-refl-title { font-size: 1rem; font-weight: 800; color: var(--ink); }
  body.dark .mc-refl-title { color: #fff; }
  .mc-refl-seed { font-size: 0.74rem; color: #722ED1; margin-top: 6px; font-weight: 600; line-height: 1.4; }
  .mc-refl-seed-kind { font-size: 0.58rem; color: var(--ink-mute); margin-top: 4px; font-family: JetBrains Mono, monospace; text-transform: uppercase; letter-spacing: 0.05em; }
  .mc-refl-stream { flex: 1; overflow-y: auto; padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; }
  .mc-refl-bubble { max-width: 80%; padding: 9px 13px; border-radius: 12px; font-size: 0.76rem; line-height: 1.55; word-break: break-word; }
  .mc-refl-agent { align-self: flex-start; background: linear-gradient(135deg, #e8f5e9, #c8e6c9); color: #1b5e20; border-bottom-left-radius: 4px; }
  body.dark .mc-refl-agent { background: rgba(76,175,80,0.18); color: #a5d6a7; }
  .mc-refl-user { align-self: flex-end; background: linear-gradient(135deg, #5b6cff, #22c3ee); color: #fff; border-bottom-right-radius: 4px; }
  .mc-refl-thinking { align-self: center; font-size: 0.66rem; color: var(--ink-mute); font-style: italic; padding: 6px 12px; background: rgba(0,0,0,0.04); border-radius: 10px; animation: mcReflPulse 1.4s ease-in-out infinite; }
  body.dark .mc-refl-thinking { background: rgba(255,255,255,0.06); }
  @keyframes mcReflPulse { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } }
  .mc-refl-err { align-self: center; font-size: 0.7rem; color: #e0444c; padding: 8px 12px; background: rgba(224,68,76,0.08); border-radius: 8px; }
  .mc-refl-done { align-self: stretch; margin-top: 8px; padding: 14px 16px; background: linear-gradient(135deg, rgba(46,204,113,0.08), rgba(91, 108, 255,0.06)); border-radius: 12px; border: 1px solid rgba(46,204,113,0.18); }
  .mc-refl-done-h { font-size: 0.9rem; font-weight: 800; color: #2ecc71; margin-bottom: 8px; }
  .mc-refl-derived-h { font-size: 0.66rem; font-weight: 700; color: var(--ink); margin-bottom: 6px; }
  body.dark .mc-refl-derived-h { color: #f0f2fa; }
  .mc-refl-derived { font-size: 0.72rem; color: var(--ink); padding: 6px 10px; background: rgba(255,255,255,0.6); border-left: 3px solid #2ecc71; border-radius: 6px; margin-bottom: 4px; }
  body.dark .mc-refl-derived { background: rgba(255,255,255,0.06); color: #f0f2fa; }
  .mc-refl-prefs { font-size: 0.66rem; color: var(--ink-mute); margin-top: 10px; }
  .mc-refl-prefs a { color: #5b6cff; text-decoration: none; font-weight: 600; }
  .mc-refl-close-after { margin-top: 10px; }
  .mc-refl-foot { border-top: 1px solid rgba(0,0,0,0.06); padding: 12px 18px; background: rgba(0,0,0,0.02); display: flex; flex-direction: column; gap: 8px; }
  body.dark .mc-refl-foot { border-color: rgba(255,255,255,0.08); background: rgba(255,255,255,0.02); }
  .mc-refl-foot textarea { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px; font-size: 0.74rem; font-family: var(--serif); line-height: 1.55; color: var(--ink); background: white; resize: vertical; }
  body.dark .mc-refl-foot textarea { background: rgba(0,0,0,0.4); color: #f0f2fa; border-color: rgba(255,255,255,0.12); }
  .mc-refl-foot textarea:focus { outline: 0; border-color: #5b6cff; box-shadow: 0 0 0 3px rgba(91, 108, 255,0.15); }
  .mc-refl-actions { display: flex; gap: 6px; justify-content: flex-end; }
  .mc-refl-history { border-top: 1px solid rgba(0,0,0,0.06); padding: 8px 18px 14px; background: rgba(0,0,0,0.015); }
  body.dark .mc-refl-history { border-color: rgba(255,255,255,0.08); background: rgba(255,255,255,0.02); }
  .mc-refl-history summary { font-size: 0.66rem; color: var(--ink-mute); cursor: pointer; padding: 4px 0; user-select: none; }
  .mc-refl-hist-card { padding: 6px 10px; margin-top: 6px; background: rgba(0,0,0,0.03); border-radius: 8px; font-size: 0.64rem; }
  body.dark .mc-refl-hist-card { background: rgba(255,255,255,0.04); }
  .mc-refl-hist-seed { font-weight: 600; color: var(--ink); line-height: 1.4; }
  body.dark .mc-refl-hist-seed { color: #f0f2fa; }
  .mc-refl-hist-card small { color: var(--ink-mute); font-size: 0.55rem; }

  /* 时间穿透 modal */
  .mc-time-travel { display: none; position: fixed; top:0;right:0;bottom:0;left:0; z-index: 1250; }
  .mc-time-travel.active { display: block; }
  .mc-tt-mask { position: absolute; top:0;right:0;bottom:0;left:0; background: rgba(0,0,0,0.5); backdrop-filter: blur(3px); }
  .mc-tt-panel { position: absolute; top:4vh;right:4vw;bottom:4vh;left:4vw; background: white; border-radius: 16px; padding: 20px 22px; box-shadow: 0 24px 80px rgba(0,0,0,0.4); display: flex; flex-direction: column; overflow: hidden; }
  body.dark .mc-tt-panel { background: #1a1d27; color: #f0f2fa; }
  .mc-tt-head { position: relative; padding-bottom: 12px; border-bottom: 1px solid rgba(0,0,0,0.06); margin-bottom: 14px; }
  body.dark .mc-tt-head { border-color: rgba(255,255,255,0.08); }
  .mc-tt-x { position: absolute; top: -4px; right: -6px; background: none; border: 0; font-size: 1.5rem; color: var(--ink-mute); cursor: pointer; padding: 4px 10px; line-height: 1; }
  .mc-tt-title { font-size: 1.15rem; font-weight: 800; color: var(--ink); }
  body.dark .mc-tt-title { color: #fff; }
  .mc-tt-sub { font-size: 0.7rem; color: var(--ink-mute); margin-top: 4px; }
  .mc-tt-grid { display: grid; grid-template-columns: 2fr 1.4fr; gap: 18px; flex: 1; min-height: 0; }
  @media (max-width: 720px) { .mc-tt-grid { grid-template-columns: 1fr; } }
  .mc-tt-col { display: flex; flex-direction: column; min-height: 0; }
  .mc-tt-col h6 { font-size: 0.66rem; color: var(--ink-mute); font-weight: 700; margin: 0 0 8px; text-transform: uppercase; letter-spacing: 0.05em; }
  .mc-tt-timeline { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding-right: 4px; }
  .mc-tt-card { display: flex; gap: 12px; padding: 12px 14px; background: rgba(0,0,0,0.025); border-radius: 12px; border-left: 3px solid #5b6cff; transition: all 0.18s; }
  body.dark .mc-tt-card { background: rgba(255,255,255,0.04); }
  .mc-tt-card:hover { background: rgba(91, 108, 255,0.06); transform: translateX(2px); }
  .mc-tt-card-idx { flex-shrink: 0; width: 28px; height: 28px; line-height: 28px; text-align: center; background: #5b6cff; color: #fff; border-radius: 50%; font-weight: 800; font-size: 0.72rem; font-family: JetBrains Mono, monospace; }
  .mc-tt-card-body { flex: 1; min-width: 0; }
  .mc-tt-card-ttl { font-size: 0.84rem; font-weight: 700; color: var(--ink); line-height: 1.4; }
  body.dark .mc-tt-card-ttl { color: #fff; }
  .mc-tt-card-when { font-size: 0.6rem; color: var(--ink-mute); margin: 2px 0 4px; }
  .mc-tt-card-sum { font-size: 0.7rem; color: var(--ink); line-height: 1.55; margin: 4px 0; opacity: 0.85; }
  .mc-tt-card-tags { font-size: 0.6rem; color: var(--ink-mute); margin-top: 6px; display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
  .mc-tt-card-tags b { font-weight: 700; color: var(--ink); margin-right: 4px; }
  .mc-tt-comm, .mc-tt-dec { overflow-y: auto; }
  .mc-tt-evo { display: flex; gap: 10px; padding: 8px 10px; margin-bottom: 6px; background: rgba(0,0,0,0.025); border-radius: 8px; border-left: 3px solid var(--c, #5b6cff); }
  body.dark .mc-tt-evo { background: rgba(255,255,255,0.04); }
  .mc-tt-evo-dot { flex-shrink: 0; width: 10px; height: 10px; border-radius: 50%; background: var(--c, #5b6cff); margin-top: 3px; box-shadow: 0 0 0 3px rgba(91, 108, 255,0.12); }
  .mc-tt-evo-body { flex: 1; min-width: 0; }
  .mc-tt-evo-txt { font-size: 0.7rem; color: var(--ink); line-height: 1.45; }
  body.dark .mc-tt-evo-txt { color: #f0f2fa; }
  .mc-tt-evo-body small { font-size: 0.55rem; color: var(--ink-mute); }
  .mc-tt-dec-row { padding: 8px 10px; margin-bottom: 6px; background: rgba(0,0,0,0.025); border-radius: 8px; }
  body.dark .mc-tt-dec-row { background: rgba(255,255,255,0.04); }
  .mc-tt-dec-row.mc-tt-dec-reversed { border-left: 3px solid #e0444c; }
  .mc-tt-dec-txt { font-size: 0.7rem; color: var(--ink); line-height: 1.45; font-weight: 600; }
  body.dark .mc-tt-dec-txt { color: #f0f2fa; }
  .mc-tt-dec-row small { font-size: 0.55rem; color: var(--ink-mute); display: block; margin-top: 2px; }
  .mc-tt-rev { display: inline-block; margin-top: 4px; font-size: 0.58rem; color: #e0444c; background: rgba(224,68,76,0.08); padding: 2px 6px; border-radius: 6px; }

  /* ============================================================
     Wave 2.5 · 会员 Tier 体系（badge / modal / upgrade banner）
     ============================================================ */
  .phone-topbar { position: relative; }
  /* dt-40d · 右上极简 dot chip —— 只露一颗 tier 色圆点，不出任何文字。
     32×32 透明按钮做 tap target，里面 14px 实心圆 + 柔光晕。 */
  .mc-tier-avatar {
    position: absolute; top: 9px; right: 10px;
    width: 32px; height: 32px; padding: 0;
    border: 0; background: transparent; box-shadow: none;
    border-radius: 50%; cursor: pointer; z-index: 4;
    display: inline-flex; align-items: center; justify-content: center;
    transition: transform 0.15s;
  }
  .mc-tier-avatar:hover { transform: scale(1.06); }
  .mc-tier-avatar:active { transform: scale(0.92); }
  .mc-tier-avatar-ico {
    width: 14px; height: 14px; flex-shrink: 0; pointer-events: none;
    border-radius: 50%;
    background: #f97316;
    box-shadow:
      0 0 0 2px rgba(255,255,255,0.55),
      0 0 0 6px rgba(249,115,22,0.18),
      0 2px 6px rgba(0,0,0,0.22);
  }
  /* bean / lbl 永久隐藏（dot-only 模式），保留 DOM 节点给已有 JS 引用不崩 */
  .mc-tier-avatar-bean { display: none !important; }
  .mc-tier-avatar[data-tier="pro"] .mc-tier-avatar-ico {
    background: #d4a017;
    box-shadow:
      0 0 0 2px rgba(255,255,255,0.55),
      0 0 0 6px rgba(212,160,23,0.22),
      0 2px 6px rgba(0,0,0,0.22);
  }
  .mc-tier-avatar[data-tier="pro_plus"] .mc-tier-avatar-ico,
  .mc-tier-avatar[data-tier="premium"] .mc-tier-avatar-ico {
    background: #7c3aed;
    box-shadow:
      0 0 0 2px rgba(255,255,255,0.55),
      0 0 0 6px rgba(124,58,237,0.22),
      0 2px 6px rgba(0,0,0,0.22);
  }
  /* 旧 selector 留兼容（mcRenderTierBadge 拿 .mc-tier-badge-lbl 写文字） */
  .mc-tier-badge-lbl[hidden] { display: none !important; }
  /* 窄屏 (≤340px) 压缩 chip 不挤标题 */
  /* dt-40d · dot-only chip 在窄屏不需要额外压缩，14px 圆点本身就极小 */

  /* 会员中心 modal */
  .mc-tier-modal { display: none; position: fixed; top:0;right:0;bottom:0;left:0; z-index: 1320; }
  .mc-tier-modal.active { display: block; }
  .mc-tier-mask { position: absolute; top:0;right:0;bottom:0;left:0; background: rgba(0,0,0,0.5); backdrop-filter: blur(3px); }
  .mc-tier-panel {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    width: min(440px, 92vw); max-height: 88vh; overflow-y: auto;
    background: #fff; border-radius: 18px;
    padding: 22px 22px 18px;
    box-shadow: 0 28px 80px rgba(0,0,0,0.4);
  }
  body.dark .mc-tier-panel { background: #1a1d27; color: #f0f2fa; }
  .mc-tier-x { position: absolute; top: 10px; right: 14px; background: none; border: 0; font-size: 1.5rem; color: var(--ink-mute); cursor: pointer; line-height: 1; padding: 4px 8px; z-index: 2; }
  .mc-tier-h { font-size: 1.1rem; font-weight: 800; color: var(--ink); margin: 0 0 14px; }
  body.dark .mc-tier-h { color: #fff; }
  /* dt-40 · "我"页风格 hero header（参考微信我页 / 支付宝个人中心） */
  .mc-tier-hero {
    display: flex; align-items: center; gap: 14px;
    margin: -22px -22px 14px;
    padding: 22px 22px 18px;
    background: linear-gradient(135deg, #5b6cff 0%, #22c3ee 100%);
    color: #fff;
    border-radius: 18px 18px 0 0;
  }
  .mc-tier-hero[data-tier="pro"] { background: linear-gradient(135deg, #d4a017 0%, #f5b84a 100%); }
  .mc-tier-hero[data-tier="pro_plus"],
  .mc-tier-hero[data-tier="premium"] { background: linear-gradient(135deg, #7c3aed 0%, #c084fc 100%); }
  .mc-tier-hero-avatar {
    width: 56px; height: 56px; flex-shrink: 0;
    border-radius: 50%; background: rgba(255,255,255,0.22);
    border: 2px solid rgba(255,255,255,0.55);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.6rem; font-weight: 800;
  }
  .mc-tier-hero-body { flex: 1; min-width: 0; line-height: 1.3; }
  .mc-tier-hero-name { font-size: 1.05rem; font-weight: 800; margin-bottom: 4px; }
  .mc-tier-hero-tier {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 3px 9px;
    border-radius: 999px;
    background: rgba(255,255,255,0.25);
    font-size: 0.74rem; font-weight: 700;
    backdrop-filter: blur(4px);
  }
  .mc-tier-hero-sub { font-size: 0.74rem; opacity: 0.85; margin-top: 4px; }
  .mc-tier-current {
    text-align: center; padding: 16px 12px 18px;
    border-radius: 14px; margin-bottom: 16px;
    background: linear-gradient(135deg, #f7f8fc 0%, #ecedf5 100%);
    border: 1px solid rgba(0,0,0,0.05);
  }
  body.dark .mc-tier-current { background: linear-gradient(135deg, #232735 0%, #1c1f2a 100%); border-color: rgba(255,255,255,0.06); }
  .mc-tier-current[data-tier="pro"] {
    background: linear-gradient(135deg, #fff9e6 0%, #ffeec2 100%);
    border-color: rgba(212,160,23,0.32);
  }
  body.dark .mc-tier-current[data-tier="pro"] {
    background: linear-gradient(135deg, #3a2f10 0%, #2a230d 100%);
    border-color: rgba(212,160,23,0.4);
  }
  .mc-tier-now {
    font-size: 1.55rem; font-weight: 900; letter-spacing: 0.02em;
    color: #1a1a2e; line-height: 1.15; display: inline-flex; align-items: center; gap: 8px;
  }
  body.dark .mc-tier-now { color: #fff; }
  .mc-tier-current[data-tier="pro"] .mc-tier-now { color: #6b4400; }
  body.dark .mc-tier-current[data-tier="pro"] .mc-tier-now { color: #ffd966; }
  .mc-tier-now-ico { font-size: 1.3rem; }
  .mc-tier-src { font-size: 0.66rem; color: var(--ink-mute); margin-top: 6px; }
  .mc-tier-table {
    width: 100%; border-collapse: collapse;
    font-size: 0.72rem; margin-bottom: 16px;
  }
  .mc-tier-table th, .mc-tier-table td {
    padding: 8px 6px; text-align: center;
    border-bottom: 1px solid rgba(0,0,0,0.06);
  }
  body.dark .mc-tier-table th, body.dark .mc-tier-table td { border-color: rgba(255,255,255,0.06); }
  .mc-tier-table th { font-weight: 700; color: var(--ink-mute); font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.04em; }
  .mc-tier-table th.mc-tier-th-pro { color: #d4a017; }
  .mc-tier-table td:first-child { text-align: left; font-weight: 600; color: var(--ink); }
  body.dark .mc-tier-table td:first-child { color: #f0f2fa; }
  .mc-tier-table td.mc-tier-td-pro { font-weight: 700; color: #d4a017; }
  .mc-tier-yes { color: #2ecc71; font-weight: 800; }
  .mc-tier-no { color: #d0d4dc; font-weight: 700; }
  body.dark .mc-tier-no { color: #555a6b; }
  .mc-tier-actions { display: flex; gap: 10px; justify-content: center; }
  .mc-tier-toggle-btn {
    flex: 1; padding: 11px 16px; border-radius: 11px;
    font-size: 0.78rem; font-weight: 700; cursor: pointer;
    border: 0; transition: all 0.2s;
  }
  .mc-tier-toggle-btn.to-pro {
    background: linear-gradient(135deg, #ffd966, #d4a017);
    color: #4a2e00; box-shadow: 0 4px 14px rgba(212,160,23,0.32);
  }
  .mc-tier-toggle-btn.to-pro:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(212,160,23,0.42); }
  .mc-tier-toggle-btn.to-free {
    background: rgba(0,0,0,0.06); color: var(--ink);
  }
  body.dark .mc-tier-toggle-btn.to-free { background: rgba(255,255,255,0.08); color: #f0f2fa; }
  .mc-tier-toggle-btn:disabled { opacity: 0.5; cursor: wait; }
  .mc-tier-hint { font-size: 0.6rem; color: var(--ink-mute); margin-top: 10px; text-align: center; }

  /* W3 Mnemo 钱包 modal · Apple HIG 同款卡片节奏 */
  .mc-wallet-balance {
    text-align: center; padding: 18px 12px 16px;
    border-radius: 14px; margin-bottom: 14px;
    background: linear-gradient(135deg, #f7f8fc 0%, #ecedf5 100%);
    border: 1px solid rgba(0,0,0,0.05);
  }
  body.dark .mc-wallet-balance { background: linear-gradient(135deg, #232735 0%, #1c1f2a 100%); border-color: rgba(255,255,255,0.06); }
  .mc-wallet-balance[data-tier="pro"],
  .mc-wallet-balance[data-tier="premium"] {
    background: linear-gradient(135deg, #fff9e6 0%, #ffeec2 100%);
    border-color: rgba(212,160,23,0.32);
  }
  body.dark .mc-wallet-balance[data-tier="pro"],
  body.dark .mc-wallet-balance[data-tier="premium"] {
    background: linear-gradient(135deg, #3a2f10 0%, #2a230d 100%);
    border-color: rgba(212,160,23,0.4);
  }
  .mc-wallet-balance-loading { font-size: 0.78rem; color: var(--ink-mute); padding: 8px 0; }
  .mc-wallet-bean-row {
    display: inline-flex; align-items: baseline; gap: 8px;
    color: var(--ink);
  }
  body.dark .mc-wallet-bean-row { color: #fff; }
  .mc-wallet-balance[data-tier="pro"] .mc-wallet-bean-row,
  .mc-wallet-balance[data-tier="premium"] .mc-wallet-bean-row { color: #6b4400; }
  body.dark .mc-wallet-balance[data-tier="pro"] .mc-wallet-bean-row,
  body.dark .mc-wallet-balance[data-tier="premium"] .mc-wallet-bean-row { color: #ffd966; }
  .mc-wallet-bean-ico { font-size: 1.25rem; }
  .mc-wallet-bean-num {
    font-size: 2rem; font-weight: 900; letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
  }
  .mc-wallet-bean-unit { font-size: 0.78rem; font-weight: 600; opacity: 0.75; }
  .mc-wallet-bean-meta {
    margin-top: 8px;
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px;
    font-size: 0.66rem; color: var(--ink-mute);
  }
  .mc-wallet-tier-tag {
    padding: 2px 8px; border-radius: 999px; font-weight: 700;
    background: rgba(0,0,0,0.06); color: var(--ink);
  }
  body.dark .mc-wallet-tier-tag { background: rgba(255,255,255,0.08); color: #f0f2fa; }
  .mc-wallet-tier-tag[data-tier="pro"] { background: rgba(212,160,23,0.18); color: #8a5e00; }
  body.dark .mc-wallet-tier-tag[data-tier="pro"] { background: rgba(212,160,23,0.22); color: #ffd966; }
  .mc-wallet-tier-tag[data-tier="premium"] {
    background: linear-gradient(135deg, #d4a017, #ffd966);
    color: #4a2e00;
  }
  body.dark .mc-wallet-tier-tag[data-tier="premium"] { color: #4a2e00; }
  .mc-wallet-period { color: var(--ink-mute); }
  .mc-wallet-low {
    margin-left: 4px; padding: 1px 7px; border-radius: 999px;
    background: rgba(231,76,60,0.12); color: #c0392b; font-weight: 700;
  }
  body.dark .mc-wallet-low { background: rgba(231,76,60,0.22); color: #ff8e7a; }

  .mc-wallet-checkin { margin: 0 0 14px; }
  .mc-wallet-checkin-btn {
    width: 100%; padding: 12px 14px; border: 0; border-radius: 12px;
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    background: linear-gradient(135deg, #e7f9ee, #c8f0d6);
    color: #1c7c4a; font-weight: 700; font-size: 0.84rem; cursor: pointer;
    transition: transform 0.15s, box-shadow 0.15s;
  }
  .mc-wallet-checkin-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(46,204,113,0.22); }
  .mc-wallet-checkin-btn:disabled { opacity: 0.6; cursor: wait; transform: none; box-shadow: none; }
  body.dark .mc-wallet-checkin-btn { background: linear-gradient(135deg, #143a26, #0f2e1c); color: #6dd99b; }
  .mc-wallet-checkin-ico { font-size: 1rem; }

  .mc-wallet-row-h {
    font-size: 0.64rem; font-weight: 700; color: var(--ink-mute);
    text-transform: uppercase; letter-spacing: 0.06em;
    margin: 0 0 6px;
  }
  .mc-wallet-redeem { margin: 0 0 14px; }
  .mc-wallet-redeem-row { display: flex; gap: 8px; }
  .mc-wallet-redeem-input {
    flex: 1; min-width: 0; padding: 10px 12px;
    border: 1px solid rgba(0,0,0,0.12); border-radius: 10px;
    background: #fff; color: var(--ink);
    font-size: 0.82rem; font-family: var(--mono, inherit);
    letter-spacing: 0.02em;
  }
  .mc-wallet-redeem-input:focus {
    outline: 0; border-color: #d4a017; box-shadow: 0 0 0 3px rgba(212,160,23,0.18);
  }
  body.dark .mc-wallet-redeem-input { background: #232735; border-color: rgba(255,255,255,0.12); color: #f0f2fa; }
  .mc-wallet-redeem-btn {
    flex-shrink: 0; padding: 10px 18px;
    border: 0; border-radius: 10px;
    background: linear-gradient(135deg, #ffd966, #d4a017); color: #4a2e00;
    font-weight: 700; font-size: 0.8rem; cursor: pointer;
  }
  .mc-wallet-redeem-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(212,160,23,0.32); }
  .mc-wallet-redeem-btn:disabled { opacity: 0.6; cursor: wait; transform: none; box-shadow: none; }

  .mc-wallet-upgrade { margin: 0 0 14px; }
  .mc-wallet-upgrade-btn {
    width: 100%; padding: 12px 14px; border: 0; border-radius: 12px;
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    background: linear-gradient(135deg, #fff8e1 0%, #ffeec2 100%);
    border: 1px solid rgba(212,160,23,0.32);
    color: #6b4400; font-weight: 700; font-size: 0.82rem; cursor: pointer;
  }
  body.dark .mc-wallet-upgrade-btn { background: linear-gradient(135deg, #3a2f10 0%, #2a230d 100%); color: #ffd966; border-color: rgba(212,160,23,0.42); }
  .mc-wallet-upgrade-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(212,160,23,0.32); }
  .mc-wallet-upgrade-ico { font-size: 1rem; }

  .mc-wallet-ledger { margin-top: 4px; }
  .mc-wallet-ledger-toggle {
    width: 100%; padding: 10px 4px; border: 0;
    background: none; cursor: pointer; text-align: left;
    color: var(--ink-mute); font-size: 0.74rem; font-weight: 700;
    display: inline-flex; align-items: center; gap: 6px;
  }
  .mc-wallet-ledger-toggle:hover { color: var(--ink); }
  body.dark .mc-wallet-ledger-toggle:hover { color: #f0f2fa; }
  .mc-wallet-ledger-caret { display: inline-block; width: 12px; }
  .mc-wallet-ledger-body {
    margin-top: 4px; padding: 8px 10px;
    background: rgba(0,0,0,0.03); border-radius: 10px;
    max-height: 240px; overflow-y: auto;
  }
  body.dark .mc-wallet-ledger-body { background: rgba(255,255,255,0.04); }
  .mc-wallet-ledger-loading,
  .mc-wallet-ledger-empty { font-size: 0.72rem; color: var(--ink-mute); text-align: center; padding: 10px 0; }
  .mc-wallet-ledger-row {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 4px;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    font-size: 0.74rem;
  }
  body.dark .mc-wallet-ledger-row { border-color: rgba(255,255,255,0.05); }
  .mc-wallet-ledger-row:last-child { border-bottom: 0; }
  .mc-wallet-ledger-l { flex: 1; min-width: 0; }
  .mc-wallet-ledger-lab {
    color: var(--ink); font-weight: 600;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  body.dark .mc-wallet-ledger-lab { color: #f0f2fa; }
  .mc-wallet-ledger-time { color: var(--ink-mute); font-size: 0.66rem; margin-top: 2px; }
  .mc-wallet-ledger-delta {
    font-variant-numeric: tabular-nums; font-weight: 700;
    font-family: var(--mono, inherit);
  }
  .mc-wallet-ledger-delta.pos { color: #1c7c4a; }
  body.dark .mc-wallet-ledger-delta.pos { color: #6dd99b; }
  .mc-wallet-ledger-delta.neg { color: #c0392b; }
  body.dark .mc-wallet-ledger-delta.neg { color: #ff8e7a; }

  /* dt-39 · Tokens 用量统计 卡片 */
  .mc-wallet-usage { margin: 0 0 14px; }
  .mc-wallet-usage-body {
    padding: 12px; border-radius: 12px;
    background: linear-gradient(135deg, #f5f9ff 0%, #eaf2ff 100%);
    border: 1px solid rgba(91, 108, 255,0.18);
  }
  body.dark .mc-wallet-usage-body {
    background: linear-gradient(135deg, rgba(91, 108, 255,0.16) 0%, rgba(91, 108, 255,0.08) 100%);
    border-color: rgba(91, 108, 255,0.30);
  }
  .mc-wallet-usage-loading { font-size: 0.72rem; color: var(--ink-mute); text-align: center; padding: 8px 0; }
  .mc-wallet-usage-num {
    display: flex; align-items: baseline; gap: 4px; margin-bottom: 8px;
    font-variant-numeric: tabular-nums;
  }
  .mc-wallet-usage-num b {
    font-family: var(--mono, inherit); font-size: 1.2rem; font-weight: 800;
    color: #5b6cff;
  }
  body.dark .mc-wallet-usage-num b { color: #6db1ff; }
  .mc-wallet-usage-num span { font-size: 0.66rem; color: var(--ink-mute); }
  .mc-wallet-usage-bars { display: flex; flex-direction: column; gap: 6px; }
  .mc-wallet-usage-bar {
    display: flex; align-items: center; gap: 8px;
    font-size: 0.7rem; color: var(--ink);
  }
  body.dark .mc-wallet-usage-bar { color: #e5e8f0; }
  .mc-wallet-usage-bar-lab { flex: 0 0 84px; font-weight: 600; }
  .mc-wallet-usage-bar-trk {
    flex: 1; height: 6px; border-radius: 999px;
    background: rgba(91, 108, 255,0.12); overflow: hidden;
  }
  body.dark .mc-wallet-usage-bar-trk { background: rgba(255,255,255,0.10); }
  .mc-wallet-usage-bar-fill {
    height: 100%; border-radius: 999px;
    background: linear-gradient(90deg, #5b6cff, #22c3ee);
  }
  .mc-wallet-usage-bar-val {
    flex: 0 0 auto; font-family: var(--mono, inherit);
    font-size: 0.68rem; color: var(--ink-mute);
    font-variant-numeric: tabular-nums;
  }

  /* dt-40 · 账户底部 "设置"-style 列表（检查更新 / 隐私 / 协议） */
  .mc-wallet-foot {
    margin-top: 14px; padding: 6px 0 2px;
    border-top: 1px solid rgba(0,0,0,0.06);
    display: flex; flex-direction: column;
  }
  body.dark .mc-wallet-foot { border-top-color: rgba(255,255,255,0.08); }
  .mc-wallet-foot-row {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 4px; cursor: pointer;
    border-bottom: 1px solid rgba(0,0,0,0.04);
    transition: background 0.15s;
  }
  body.dark .mc-wallet-foot-row { border-bottom-color: rgba(255,255,255,0.06); }
  .mc-wallet-foot-row:last-child { border-bottom: 0; }
  .mc-wallet-foot-row:active { background: rgba(0,0,0,0.04); }
  body.dark .mc-wallet-foot-row:active { background: rgba(255,255,255,0.05); }
  .mc-wallet-foot-row-ico {
    width: 22px; height: 22px; flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1rem; line-height: 1;
  }
  .mc-wallet-foot-row-lab { flex: 1; font-size: 0.86rem; font-weight: 500; color: var(--ink); }
  body.dark .mc-wallet-foot-row-lab { color: #f0f2fa; }
  .mc-wallet-foot-row-val {
    font-size: 0.74rem; color: var(--ink-mute);
    font-variant-numeric: tabular-nums; max-width: 50%;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .mc-wallet-foot-row-val[data-state="new"] { color: #d4a017; font-weight: 700; }
  .mc-wallet-foot-row-val[data-state="ok"]  { color: var(--green, #1f7a4a); }
  .mc-wallet-foot-row-val[data-state="err"] { color: var(--carmine, #b7251a); }
  .mc-wallet-foot-row-chev { color: var(--ink-faint); font-size: 1rem; line-height: 1; }

  /* 洞察屏顶 升级横幅 */
  .mc-tier-banner {
    display: flex; gap: 12px; align-items: center;
    padding: 11px 13px; margin: 0 0 12px;
    background: linear-gradient(135deg, #fff8e1 0%, #fff2c4 100%);
    border: 1px solid rgba(212,160,23,0.28);
    border-radius: 12px;
    font-size: 0.66rem; line-height: 1.5;
    color: #5a4000;
  }
  body.dark .mc-tier-banner { background: linear-gradient(135deg, #3a2f10 0%, #2a230d 100%); color: #ffe9a1; border-color: rgba(212,160,23,0.36); }
  .mc-tier-banner-icon { font-size: 1.1rem; flex-shrink: 0; }
  .mc-tier-banner-body { flex: 1; min-width: 0; }
  .mc-tier-banner-body b { font-weight: 700; color: #6b4400; }
  body.dark .mc-tier-banner-body b { color: #ffd966; }
  .mc-tier-banner-cta {
    flex-shrink: 0; padding: 6px 12px; border: 0; cursor: pointer;
    background: linear-gradient(135deg, #ffd966, #d4a017);
    color: #4a2e00; font-weight: 700; font-size: 0.66rem;
    border-radius: 999px; box-shadow: 0 2px 8px rgba(212,160,23,0.32);
  }
  .mc-tier-banner-cta:hover { transform: translateY(-1px); }

  .mc-tier-pro-banner {
    display: flex; gap: 6px; align-items: center;
    padding: 6px 10px; margin: 0 0 10px;
    background: rgba(46,204,113,0.08); border-radius: 8px;
    font-size: 0.6rem; color: #1c7c4a; font-weight: 600;
  }
  body.dark .mc-tier-pro-banner { color: #6dd99b; background: rgba(109,217,155,0.08); }

  /* Pattern 卡 tier 角标 */
  .mc-isight-pat { position: relative; }
  .mc-isight-pat-tier {
    position: absolute; top: 8px; right: 10px;
    font-size: 0.52rem; font-weight: 700; letter-spacing: 0.02em;
    padding: 2px 7px; border-radius: 999px;
    background: rgba(0,0,0,0.04); color: var(--ink-mute);
    font-family: var(--mono);
  }
  body.dark .mc-isight-pat-tier { background: rgba(255,255,255,0.06); }
  .mc-isight-pat-tier[data-tier="pro"] {
    background: linear-gradient(135deg, #ffd966, #d4a017);
    color: #4a2e00;
  }

  /* 反思抽屉 tier 标签 */
  .mc-refl-title-tier {
    display: inline-block; margin-left: 6px;
    font-size: 0.58rem; font-weight: 600;
    padding: 2px 7px; border-radius: 999px;
    vertical-align: middle;
  }
  .mc-refl-title-tier[data-tier="pro"] {
    background: linear-gradient(135deg, #ffd966, #d4a017);
    color: #4a2e00;
  }
  .mc-refl-title-tier[data-tier="free"] {
    background: rgba(0,0,0,0.06); color: var(--ink-mute);
  }

  /* 时间穿透 narrative 区块 */
  .mc-tt-narrative {
    padding: 12px 14px; margin: 0 0 14px;
    background: linear-gradient(135deg, #fff8e1 0%, #fff2c4 100%);
    border-left: 3px solid #d4a017; border-radius: 10px;
    font-size: 0.72rem; line-height: 1.6; color: #5a4000;
  }
  body.dark .mc-tt-narrative { background: linear-gradient(135deg, #3a2f10 0%, #2a230d 100%); color: #ffe9a1; }
  .mc-tt-narrative-h {
    font-size: 0.66rem; font-weight: 800;
    color: #6b4400; margin-bottom: 6px;
    display: flex; align-items: center; gap: 6px;
  }
  body.dark .mc-tt-narrative-h { color: #ffd966; }
  .mc-tt-narrative-ghost {
    padding: 12px 14px; margin: 0 0 14px;
    background: rgba(0,0,0,0.025); border: 1px dashed rgba(0,0,0,0.12);
    border-radius: 10px; font-size: 0.68rem; line-height: 1.55;
    color: var(--ink-mute); display: flex; gap: 10px; align-items: center;
  }
  body.dark .mc-tt-narrative-ghost { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.1); }
  .mc-tt-narrative-ghost-cta {
    flex-shrink: 0; background: linear-gradient(135deg, #ffd966, #d4a017);
    color: #4a2e00; border: 0; padding: 6px 12px; border-radius: 999px;
    font-size: 0.62rem; font-weight: 700; cursor: pointer;
  }

  /* Pattern header layout 调整以容纳 reflect button */
  .mc-isight-pat-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

  /* ============================================================
     响应式 · 让真机看起来自然（不再被桌面 mock-up 挤）
     断点：
       > 920px  桌面 — 卡片硬件 + phone 双栏
       640-920px 平板 — 卡片+phone 单列
       ≤ 640px  真机 — 全屏 phone，卡片硬件折叠隐藏
       ≤ 380px  小屏 — Kanban / outcome / insight 全部单列
     ============================================================ */

  /* 默认（≥ 920px 桌面）保持现有 phone-frame 280×580 mockup 风 */

  /* 平板 + 大手机横屏：保持 360px */
  @media (max-width: 920px) {
    .card-stage-flex { gap: 24px; }
  }

  /* ============ 真机（≤ 640px）：保留手机外观，只缩放 ============ */
  @media (max-width: 640px) {
    .proto-band { padding: 18px 0 24px; }
    .proto-intro { margin-bottom: 16px; padding: 0 14px; }
    .proto-intro .lead h2 { font-size: 1.4rem; }
    .proto-intro .lead p { font-size: 0.8rem; }
    .proto-stage { gap: 16px; padding: 0; }
    .card-stage-flex { flex-direction: column; gap: 16px; align-items: center; }
    /* 卡片硬件保留但缩小 */
    .card-device {
      transform: scale(0.85);
      transform-origin: center;
    }
    /* phone-frame 保留 mockup 外观（黑壳/圆角/阴影/刘海要全部看得见）
       关键：边上留 paper 边距，不要贴满屏宽 — 看起来才是"手机放在纸上" */
    .phone-frame {
      width: 88vw;
      height: min(76dvh, 720px);
      min-height: 560px;
      max-width: 380px;
    }
    /* notch / statusbar / topbar 全部保留 */
    .phone-view {
      padding: 14px 14px 64px;
    }
    /* proto-pills 在真机上横向滚（11 按钮不能换行散开） */
    .proto-pills {
      flex-wrap: nowrap; overflow-x: auto; padding: 4px 16px; gap: 6px;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      justify-content: flex-start;
    }
    .proto-pills::-webkit-scrollbar { display: none; }
    .proto-pill { white-space: nowrap; flex-shrink: 0; padding: 6px 12px; font-size: 0.72rem; }
    .mc-pills-row2 { padding-top: 0; }
  }

  /* 更窄（≤ 420px）：phone-frame 仍留 4-5vw 边距让壳显出来 */
  @media (max-width: 420px) {
    .phone-frame {
      width: 90vw; height: min(78dvh, 680px); min-height: 540px;
      max-width: 360px;
      /* 圆角/边框/阴影/padding/notch 全部保持默认值，看起来还是手机 */
    }
    .card-device { transform: scale(0.72); }
    .proto-band { padding: 14px 0 22px; }
    .proto-intro { display: none; }
    .proto-stage { gap: 12px; }
  }

  /* 极窄（≤ 360px 极个别老安卓机型）：bottombar 字号收一档 */
  @media (max-width: 360px) {
    .phone-bottombar button { font-size: 0.6rem; }
    .phone-bottombar .ico { font-size: 1rem; }
  }

  /* ============ 所有 SVG / 图表保证不溢出 ============ */
  svg.mc-mindmap-svg,
  svg.mc-mem-net-svg,
  svg.mc-radar-svg,
  svg.mc-donut-svg {
    width: 100%; height: auto;
    max-width: 100%;
    display: block;
  }
  /* 音频控件在窄屏不溢出 */
  .mc-audio-wrap audio { width: 100%; max-width: 100%; }

  /* 长 artifact 路径在窄屏防溢出 */
  .mc-tool-artifact-line code { word-break: break-all; display: inline-block; max-width: 100%; }
  .mc-ws-row-meta { word-break: break-word; }

  /* 话题词云在窄屏不被切 */
  .mc-topic-cloud { word-break: keep-all; }

  /* chat 输入栏在键盘弹出时不被遮 */
  .mc-chat-input-row { padding-bottom: max(8px, env(safe-area-inset-bottom, 0px)); }
  .mc-chat-input { font-size: 16px; } /* iOS 不会自动放大 */

  /* 全局长字符串防止破布局 */
  .mc-rel-title, .mc-quote-body, .mc-ai-summary-body, .mc-kanban-card-title, .mc-insight-body { word-break: break-word; overflow-wrap: anywhere; }

  /* 横屏小屏（landscape phone）— 短高度时 phone 内容紧凑 */
  @media (max-width: 900px) and (max-height: 480px) {
    .phone-view { padding-top: 8px; padding-bottom: 60px; }
    .mc-sm-hero { padding: 6px 4px; margin-bottom: 6px; }
    .mc-sm-section { margin-bottom: 8px; }
  }

  /* 超大屏（≥ 1280px）：phone 居中，不要无意义拉伸 */
  @media (min-width: 1280px) {
    .card-stage-flex { max-width: 1100px; margin: 0 auto; }
    .phone-frame { width: 400px; height: 760px; }
  }

  /* 触摸目标至少 36×36 */
  @media (pointer: coarse) {
    .mc-rec-btn, .mc-oc-advanced-toggle, .mc-rec-pin, .proto-pill, .agent-role { min-height: 36px; padding: 8px 12px; }
    .mc-anno-save, .mc-btn { min-height: 36px; }
  }

  /* ==========================================================================
     Apple Premium · Midnight Glass theme
     Deep navy stage + frosted glass cards + Apple-blue accent + SF-grade type.
     Drops magazine cues: § numbering, figcaption labels, carmine red,
     cream paper cards, ruled hairlines, italic display serif emphasis.
     ========================================================================= */

  :root {
    --apl-bg-deep:   #060d1c;
    --apl-bg:        #0a1428;
    --apl-bg-soft:   #0e1830;
    --apl-text:      oklch(0.97 0.008 250);
    --apl-text-2:    oklch(0.78 0.014 250);
    --apl-text-3:    oklch(0.56 0.018 250);
    --apl-glass:     oklch(0.22 0.05 248 / 0.45);
    --apl-glass-hi:  oklch(0.28 0.06 248 / 0.58);
    --apl-rule:      oklch(0.36 0.03 250 / 0.45);
    --apl-rule-hi:   oklch(0.48 0.05 248 / 0.65);
    --apl-blue:      oklch(0.72 0.17 245);     /* electric Apple blue accent */
    --apl-blue-hi:   oklch(0.82 0.14 245);
    --apl-blue-deep: oklch(0.55 0.18 245);
    --apl-danger:    oklch(0.72 0.20 28);      /* reserved for L2 risk only */

    --apl-shadow-card:
      inset 0 0.5px 0 oklch(1 0 0 / 0.08),
      0 1px 2px oklch(0 0 0 / 0.32),
      0 28px 64px -20px oklch(0 0 0 / 0.55);
    --apl-shadow-img:
      0 2px 4px oklch(0 0 0 / 0.30),
      0 32px 80px -24px oklch(0 0 0 / 0.65);
    --apl-shadow-glow:
      0 0 0 0.5px oklch(0.50 0.05 248 / 0.6),
      0 8px 32px -8px oklch(0.55 0.18 245 / 0.35);
  }

  /* ----- 1. body ambient stage -------------------------------------------- */
  body {
    background: var(--apl-bg-deep) !important;
    font-family: 'Inter', 'SF Pro Display', 'PingFang SC', 'Hiragino Sans GB', system-ui, sans-serif !important;
    font-feature-settings: 'cv11', 'ss01', 'ss03';
  }
  body::before {
    content: '';
    position: fixed;
    top:0;right:0;bottom:0;left:0;
    z-index: -1;
    background:
      radial-gradient(ellipse 90% 50% at 50% -8%, oklch(0.32 0.14 248 / 0.55) 0%, transparent 58%),
      radial-gradient(ellipse 70% 45% at 50% 105%, oklch(0.22 0.10 248 / 0.40) 0%, transparent 55%),
      linear-gradient(180deg, var(--apl-bg) 0%, var(--apl-bg-deep) 100%);
    pointer-events: none;
  }
  body.dark::before {
    background:
      radial-gradient(ellipse 90% 50% at 50% -8%, oklch(0.24 0.12 248 / 0.55) 0%, transparent 58%),
      radial-gradient(ellipse 70% 45% at 50% 105%, oklch(0.16 0.08 248 / 0.40) 0%, transparent 55%),
      linear-gradient(180deg, #050b18 0%, #030610 100%);
  }

  /* ----- 2. Typography hardening ------------------------------------------ */
  h1, h2, h3, h4 {
    font-family: 'Inter', 'SF Pro Display', 'PingFang SC', system-ui, sans-serif !important;
    letter-spacing: -0.024em !important;
  }
  h1 { letter-spacing: -0.038em !important; }
  strong, b { font-weight: 600; }

  /* ----- 3. Top frame (Apple frosted nav) --------------------------------- */
  .frame {
    background: oklch(0.08 0.04 250 / 0.62) !important;
    backdrop-filter: blur(28px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(28px) saturate(180%) !important;
    border-bottom: 0.5px solid oklch(0.36 0.04 250 / 0.5) !important;
  }
  .mark { color: var(--apl-text) !important; }
  .mark .dot { background: var(--apl-blue) !important; }
  .mark small { color: var(--apl-text-3) !important; }
  .tab { color: var(--apl-text-2) !important; }
  .tab:hover { color: var(--apl-text) !important; background: oklch(1 0 0 / 0.06) !important; }
  .tab.active { background: var(--apl-blue) !important; color: white !important; }

  /* ----- 4. Hero — cinema scale + ambient ambient ------------------------- */
  section.hero {
    position: relative;
    padding: clamp(56px, 9vw, 112px) 0 clamp(72px, 10vw, 104px) !important;
  }
  section.hero::after { display: none !important; }
  section.hero h1 {
    font-size: clamp(2.4rem, 6.6vw, 5.4rem) !important;
    font-weight: 700 !important;
    line-height: 1.04 !important;
    color: var(--apl-text) !important;
  }
  section.hero h1 .stroke {
    color: var(--apl-blue) !important;
    font-style: normal !important;
    font-weight: 700 !important;
  }
  section.hero h1 .quiet { color: var(--apl-text-3) !important; }
  section.hero .caption { color: var(--apl-text-3) !important; }
  section.hero .hero-meta,
  section.hero .hero-meta > div { color: var(--apl-text-2) !important; }
  section.hero .hero-meta b { color: var(--apl-text) !important; }
  section.hero .hero-lead { color: var(--apl-text-2) !important; font-size: 1.05rem; line-height: 1.7; }
  section.hero .hero-lead strong { color: var(--apl-text) !important; }
  section.hero .hero-index { color: var(--apl-text-2) !important; }
  section.hero .hero-index li { border-color: var(--apl-rule) !important; }
  section.hero .hero-index li::before { color: var(--apl-blue) !important; }
  section.hero .hero-index li b { color: var(--apl-text) !important; }
  section.hero .hero-index li span { color: var(--apl-text-3) !important; }

  /* ----- 5. vs-strip — Apple capsule glass -------------------------------- */
  .vs-strip {
    background: var(--apl-glass) !important;
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
    border: 0.5px solid var(--apl-rule-hi) !important;
    border-radius: 18px !important;
    color: var(--apl-text-2) !important;
    box-shadow: var(--apl-shadow-card);
  }
  .vs-strip::after {
    background: linear-gradient(90deg, transparent, oklch(0.55 0.16 245 / 0.5), transparent) !important;
  }
  .vs-strip-left, .vs-strip-skus { color: var(--apl-text-2); }
  .vs-mark { color: var(--apl-blue) !important; font-weight: 700; }
  .vs-lab { color: var(--apl-text-3) !important; }
  .vs-target { color: var(--apl-text) !important; }
  .vs-arrow { color: var(--apl-blue) !important; }
  .vs-pos { color: var(--apl-text-2); }
  .vs-pos b { color: var(--apl-text) !important; }
  .vs-pos em { color: var(--apl-blue) !important; font-style: normal !important; font-weight: 600; }
  .vs-sku-tag {
    background: oklch(0.20 0.05 248 / 0.7) !important;
    color: var(--apl-text-2) !important;
    border-color: var(--apl-rule) !important;
  }
  .vs-sku-tag--hi {
    background: var(--apl-blue) !important;
    color: white !important;
    border-color: var(--apl-blue) !important;
  }
  .vs-sku-line b { color: var(--apl-text) !important; }
  .vs-sku-line em { color: var(--apl-blue) !important; font-style: normal !important; }

  /* ----- 6. Section eyebrows + headlines — Apple typographic ladder ------- */
  section.sec { padding: clamp(72px, 10vw, 132px) 0 !important; }
  section.sec .section-tag { gap: 0 !important; margin-bottom: 18px !important; }
  section.sec .section-tag .n { display: none !important; }       /* drop § numbering */
  section.sec .section-tag .l {
    color: var(--apl-blue) !important;
    font-family: inherit !important;
    font-size: 0.72rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    border: 0 !important;
    padding: 0 !important;
  }
  section.sec .section-h {
    color: var(--apl-text) !important;
    font-family: inherit !important;
    font-size: clamp(1.9rem, 4.4vw, 3.2rem) !important;
    font-weight: 700 !important;
    letter-spacing: -0.030em !important;
    line-height: 1.10 !important;
    margin-bottom: 28px !important;
  }
  section.sec .section-h em {
    color: var(--apl-blue) !important;
    font-style: normal !important;
    font-weight: 700 !important;
  }
  section.sec .section-lead {
    color: var(--apl-text-2) !important;
    font-size: 1.02rem;
    line-height: 1.65;
    max-width: 64ch;
  }
  section.sec .section-lead b { color: var(--apl-text) !important; }

  /* ----- 7. Glass cards — replace cream paper everywhere ------------------ */
  .diagnosis-grid { grid-template-columns: 1fr 1fr !important; gap: 22px !important; }
  .diagnosis-grid .pain,
  .feature,
  .tier,
  .scenario,
  .vs-pain,
  .specs,
  .roadmap {
    background: var(--apl-glass) !important;
    backdrop-filter: blur(24px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(150%) !important;
    border: 0.5px solid var(--apl-rule) !important;
    border-radius: 22px !important;
    box-shadow: var(--apl-shadow-card) !important;
    color: var(--apl-text-2) !important;
  }

  /* pain card internals */
  .diagnosis-grid .pain {
    padding: 28px 28px 26px !important;
    border-right: 0 !important;
    flex-direction: column;
  }
  .pain .num {
    color: var(--apl-blue) !important;
    font-family: 'SF Mono', 'JetBrains Mono', monospace;
    font-size: 0.72rem; font-weight: 700;
    letter-spacing: 0.10em;
    opacity: 0.75;
  }
  .pain h3 { color: var(--apl-text) !important; font-size: 1.22rem !important; margin: 6px 0 10px; }
  .pain p { color: var(--apl-text-2) !important; line-height: 1.6; }
  .pain p strong, .pain p b { color: var(--apl-text) !important; }
  .pain .quote {
    color: var(--apl-text-3) !important;
    font-style: italic;
    margin-top: 14px;
    padding-left: 16px;
    position: relative;
    font-size: 0.9rem;
  }
  .pain .quote::before {
    content: '"';
    position: absolute; left: -2px; top: -10px;
    font-size: 1.9em; line-height: 1;
    color: var(--apl-blue);
    opacity: 0.55;
    font-family: Georgia, serif;
  }

  /* feature card internals (diff §02) */
  .feature {
    padding: 26px 28px !important;
    display: grid !important;
    grid-template-columns: 1fr 1.8fr !important;
    gap: 16px 28px !important;
  }
  .feature-figure { grid-column: 1 / -1; }
  .feature .k { color: var(--apl-text) !important; font-size: 1.12rem; font-weight: 600; }
  .feature .k small { color: var(--apl-text-3) !important; font-family: 'SF Mono', monospace; letter-spacing: 0.1em; }
  .feature .v { color: var(--apl-text-2) !important; line-height: 1.65; }
  .feature .v strong { color: var(--apl-text) !important; }

  /* tier card internals (oc §03) */
  .tier-grid { grid-template-columns: 1fr 1fr 1fr !important; gap: 18px !important; }
  .tier { padding: 28px 26px 32px !important; border-right: 0 !important; flex-direction: column; }
  .tier-grid.cols-3 .tier:not(:first-child):not(:last-child) { padding: 28px 26px 32px !important; }
  .tier .level {
    color: var(--apl-blue) !important;
    font-family: 'SF Mono', 'JetBrains Mono', monospace;
    font-size: 0.66rem; font-weight: 700;
    letter-spacing: 0.14em; text-transform: uppercase;
    margin-bottom: 10px;
  }
  .tier h4 { color: var(--apl-text) !important; font-size: 1.5rem !important; margin-bottom: 8px; }
  .tier .price {
    color: var(--apl-text-3) !important;
    font-family: 'SF Mono', monospace;
    font-size: 0.82rem; margin-bottom: 18px;
  }
  .tier ul { color: var(--apl-text-2); padding: 0; list-style: none; }
  .tier li {
    padding: 8px 0;
    border-bottom: 0.5px solid var(--apl-rule);
    position: relative;
    padding-left: 18px;
  }
  .tier li::before {
    content: '';
    position: absolute; left: 0; top: 14px;
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--apl-blue);
    opacity: 0.6;
  }
  .tier li:last-child { border-bottom: 0; }

  /* scenario card internals (§05) */
  .scenarios { grid-template-columns: 1fr 1fr 1fr !important; gap: 18px !important; }
  .scenario { padding: 24px 24px 26px !important; border-right: 0 !important; flex-direction: column; }
  .scenario .when {
    color: var(--apl-blue) !important;
    font-family: 'SF Mono', monospace;
    font-size: 0.66rem; font-weight: 700;
    letter-spacing: 0.12em; text-transform: uppercase;
    margin-bottom: 10px;
  }
  .scenario h4 { color: var(--apl-text) !important; font-size: 1.08rem; margin-bottom: 8px; }
  .scenario p { color: var(--apl-text-2) !important; line-height: 1.6; }
  .scenario p strong { color: var(--apl-text) !important; }

  /* vs-pain (3 实证) */
  .vs-pain {
    padding: 26px 28px !important;
  }
  .vs-pain-num {
    color: var(--apl-blue) !important;
    font-family: 'SF Mono', monospace;
    font-size: 0.66rem; font-weight: 700;
    letter-spacing: 0.10em;
  }
  .vs-pain-tag {
    color: var(--apl-text-3) !important;
    font-family: 'SF Mono', monospace;
    font-size: 0.66rem; letter-spacing: 0.10em;
    text-transform: uppercase;
    margin-left: 10px;
  }
  .vs-pain h4 { color: var(--apl-text) !important; font-size: 1.15rem; margin: 8px 0 12px; }
  .vs-pain p { color: var(--apl-text-2) !important; line-height: 1.6; }
  .vs-pain p b { color: var(--apl-text) !important; }
  .vs-pain-quote {
    color: var(--apl-text-3) !important;
    font-style: italic;
    margin: 12px 0;
    padding-left: 16px;
    position: relative;
    font-size: 0.9rem;
  }
  .vs-pain-quote::before {
    content: '"';
    position: absolute; left: -2px; top: -10px;
    font-size: 1.9em; line-height: 1;
    color: var(--apl-blue);
    opacity: 0.55;
    font-family: Georgia, serif;
  }
  .vs-pain-fix {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 0.5px solid var(--apl-rule);
  }
  .vs-pain-fix-h {
    color: var(--apl-blue) !important;
    font-family: 'SF Mono', monospace;
    font-size: 0.64rem; font-weight: 700;
    letter-spacing: 0.12em; text-transform: uppercase;
    margin-bottom: 6px;
  }
  .vs-pain-fix-h::before { content: '' !important; }
  .vs-pain-fix p { color: var(--apl-text-2) !important; }
  .vs-pain-fix p b { color: var(--apl-text) !important; }
  .vs-pain-fix p em { color: var(--apl-blue) !important; font-style: normal !important; }
  .vs-pain-fix .ref { color: var(--apl-text-3) !important; font-size: 0.78rem; }
  .vs-pain-meta { color: var(--apl-text-3) !important; font-size: 0.82rem; margin-top: 16px; }
  .vs-pain-meta b { color: var(--apl-text-2) !important; }

  /* ----- 8. vs-table — Apple data table ----------------------------------- */
  .vs-table { color: var(--apl-text-2) !important; }
  .vs-table th {
    color: var(--apl-text-3) !important;
    border-color: var(--apl-rule) !important;
    background: transparent !important;
    font-weight: 600;
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }
  .vs-table td {
    color: var(--apl-text-2) !important;
    border-color: var(--apl-rule) !important;
  }
  .vs-table td strong { color: var(--apl-text) !important; }
  .vs-table tr.us td {
    background: oklch(0.22 0.10 248 / 0.32) !important;
    color: var(--apl-text) !important;
  }
  body.dark .vs-table tr.us td { background: oklch(0.18 0.08 248 / 0.40) !important; }
  .vs-table tr.us td strong { color: var(--apl-blue) !important; }
  .vs-table td .pill {
    background: var(--apl-blue) !important;
    color: white !important;
    border-color: var(--apl-blue) !important;
  }

  /* ----- 9. specs grid (§06) ---------------------------------------------- */
  .specs {
    border-top: 0 !important;
    grid-template-columns: repeat(4, 1fr) !important;
    padding: 8px 16px !important;
  }
  .specs .spec {
    padding: 22px 18px !important;
    border-right: 0.5px solid var(--apl-rule) !important;
    border-bottom: 0 !important;
  }
  .specs .spec:nth-child(4n) { border-right: 0 !important; }
  .spec .label {
    color: var(--apl-text-3) !important;
    font-family: 'SF Mono', monospace !important;
    font-size: 0.66rem; letter-spacing: 0.10em;
  }
  .spec .value { color: var(--apl-text) !important; font-family: inherit !important; }
  .spec .value small { color: var(--apl-text-3) !important; }

  /* ----- 10. roadmap (§07) ------------------------------------------------ */
  .roadmap {
    border-top: 0 !important;
    grid-template-columns: repeat(6, 1fr) !important;
    padding: 6px 12px !important;
    margin-top: 28px !important;
  }
  .roadmap .gate {
    padding: 22px 16px !important;
    border-right: 0.5px solid var(--apl-rule) !important;
    flex-direction: column; display: flex;
  }
  .roadmap .gate:last-child { border-right: 0 !important; }
  .gate .stage {
    color: var(--apl-text-3) !important;
    font-family: 'SF Mono', monospace !important;
    font-size: 0.66rem; letter-spacing: 0.10em;
  }
  .gate h4 { color: var(--apl-text) !important; font-size: 1rem !important; }
  .gate .body { color: var(--apl-text-2) !important; }
  .gate .chip.live {
    background: var(--apl-blue) !important;
    color: white !important;
    box-shadow: var(--apl-shadow-glow);
  }
  .gate .chip.next { background: oklch(0.40 0.05 248 / 0.6) !important; color: var(--apl-text-2) !important; }

  /* ----- 11. Imagery — borderless Apple product shots --------------------- */
  .mc-fig {
    margin: 0;
    background: transparent !important;
    border: 0 !important;
    border-radius: 18px !important;
    overflow: hidden;
    box-shadow: var(--apl-shadow-img) !important;
    position: relative;
  }
  .mc-fig::before { display: none !important; }     /* drop carmine corner stripe */
  .mc-fig::after {                                  /* subtle bottom vignette */
    content: '';
    position: absolute;
    top:0;right:0;bottom:0;left:0;
    background: linear-gradient(180deg, transparent 55%, oklch(0 0 0 / 0.22) 100%);
    pointer-events: none;
    z-index: 1;
  }
  .mc-fig img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: var(--apl-bg-soft);
  }
  .mc-fig figcaption { display: none !important; }   /* drop editorial captions */

  .hero-figure {
    margin: 0 0 36px 0 !important;
    aspect-ratio: 1920 / 1080 !important;
    max-height: 520px;
    border-radius: 22px !important;
  }
  .pain-figure,
  .vs-pain-figure,
  .feature-figure,
  .tier-figure,
  .scenario-figure {
    margin: 0 0 18px 0 !important;
    aspect-ratio: 4 / 3 !important;
    border-radius: 16px !important;
  }

  /* ----- 12. Device gallery (§06) ----------------------------------------- */
  .device-gallery {
    display: grid !important;
    grid-template-columns: 1.05fr 1fr !important;
    grid-template-rows: auto auto;
    gap: 18px !important;
    margin: 0 0 36px 0 !important;
  }
  .device-gallery .mc-fig.is-front { grid-row: 1 / 3; aspect-ratio: 1 / 1; }
  .device-gallery .mc-fig:not(.is-front) { aspect-ratio: 4 / 3; }
  @media (max-width: 720px) {
    .device-gallery { grid-template-columns: 1fr !important; }
    .device-gallery .mc-fig.is-front { grid-row: auto; }
  }

  /* ----- 13. proto-band (top interactive prototype) ----------------------- */
  .proto-band,
  body.dark .proto-band {
    background: transparent !important;
    border-bottom: 0 !important;
    padding: clamp(56px, 8vw, 88px) 0 clamp(56px, 8vw, 88px) !important;
  }
  .proto-intro .caption { color: var(--apl-text-3) !important; }
  .proto-intro .lead h2 {
    color: var(--apl-text) !important;
    font-family: inherit !important;
    font-size: clamp(1.6rem, 3.2vw, 2.4rem) !important;
    font-weight: 700 !important;
    letter-spacing: -0.024em !important;
  }
  .proto-intro .lead p { color: var(--apl-text-2) !important; line-height: 1.6; }
  .proto-intro .lead p strong { color: var(--apl-text) !important; }
  .proto-hint { color: var(--apl-text-3) !important; }

  .proto-pill {
    background: var(--apl-glass) !important;
    backdrop-filter: blur(20px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
    border: 0.5px solid var(--apl-rule) !important;
    color: var(--apl-text-2) !important;
    transition: all 0.18s cubic-bezier(0.2, 0.7, 0.3, 1) !important;
  }
  .proto-pill:hover {
    color: var(--apl-text) !important;
    border-color: var(--apl-rule-hi) !important;
    background: var(--apl-glass-hi) !important;
  }
  .proto-pill.active {
    background: var(--apl-blue) !important;
    border-color: var(--apl-blue) !important;
    color: white !important;
    box-shadow: var(--apl-shadow-glow);
  }

  /* ----- 14. tail loose grey lines / inline-style overrides --------------- */
  section.sec p[style*="max-width"],
  section.sec > .shell > div[style*="margin-top"] {
    color: var(--apl-text-2) !important;
    font-size: 0.92rem;
  }
  section.sec p[style*="max-width"] strong,
  section.sec > .shell > div[style*="margin-top"] strong {
    color: var(--apl-text) !important;
  }

  /* ----- 15. mobile responsiveness ---------------------------------------- */
  @media (max-width: 720px) {
    .diagnosis-grid,
    .tier-grid.cols-3,
    .scenarios { grid-template-columns: 1fr !important; gap: 14px !important; }
    .specs { grid-template-columns: 1fr 1fr !important; }
    .specs .spec:nth-child(2n) { border-right: 0 !important; }
    .roadmap { grid-template-columns: 1fr 1fr !important; }
    .roadmap .gate:nth-child(2n) { border-right: 0 !important; }
    section.hero { padding: 48px 0 56px !important; }
    section.hero h1 { font-size: clamp(2rem, 9vw, 3.2rem) !important; }
    section.sec { padding: 56px 0 !important; }
    section.sec .section-h { font-size: clamp(1.6rem, 7vw, 2.2rem) !important; }
    .feature { grid-template-columns: 1fr !important; }
    .vs-strip {
      flex-direction: column !important;
      padding: 16px 18px !important;
    }
  }

  /* ----- 16. motion polish ------------------------------------------------ */
  .pain, .feature, .tier, .scenario, .vs-pain, .gate, .spec {
    transition: transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1),
                box-shadow 0.4s cubic-bezier(0.2, 0.7, 0.3, 1);
  }
  .mc-fig {
    transition: transform 0.45s cubic-bezier(0.2, 0.7, 0.3, 1);
  }
  .hero-figure:hover,
  .pain-figure:hover .mc-fig,
  .feature-figure:hover {
    /* subtle */
  }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      animation-duration: 0.01ms !important;
      transition-duration: 0.01ms !important;
    }
  }

  /* ============================================================
     CRITICAL FIX · §01 pain 卡片内部布局
     原 CSS .pain { display: grid; grid-template-columns: 76px 1fr; } 在我加入
     <figure> 后变成 3 子项错位（figure 被挤进 76px 列、中文文字垂直堆叠 1 字宽）。
     强制改为 flex column，让 figure / num / 内容自然垂直栈。
     ============================================================ */
  .diagnosis-grid .pain {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    align-items: stretch !important;
  }
  .diagnosis-grid .pain .num {
    font-family: 'SF Mono', 'JetBrains Mono', monospace !important;
    font-weight: 700 !important;
    font-size: 0.72rem !important;
    line-height: 1 !important;
    color: var(--apl-blue) !important;
    letter-spacing: 0.10em !important;
    opacity: 0.75;
    margin: 14px 0 6px;
  }
  .diagnosis-grid .pain > div {  /* 内容 wrapper div */
    flex: 1;
  }
  .diagnosis-grid .pain h3 {
    color: var(--apl-text) !important;
    font-family: inherit !important;
    font-size: 1.24rem !important;
    font-weight: 600 !important;
    letter-spacing: -0.018em !important;
    margin: 0 0 10px !important;
  }
  .diagnosis-grid .pain p {
    color: var(--apl-text-2) !important;
    font-size: 0.96rem;
    line-height: 1.6;
  }

  /* Sister fix: ensure .feature also stacks correctly with prepended figure */
  .feature-list .feature {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    align-items: stretch !important;
  }
  /* In .feature, .k label sits above .v paragraph; figure stays on top for bento first card */
  .feature-list .feature .k {
    margin: 14px 0 8px;
    font-family: inherit !important;
    font-size: 1.08rem !important;
    font-weight: 600 !important;
    color: var(--apl-text) !important;
    letter-spacing: -0.015em !important;
  }
  .feature-list .feature .k small {
    display: block;
    font-family: 'SF Mono', monospace !important;
    font-size: 0.62rem !important;
    font-weight: 500 !important;
    color: var(--apl-text-3) !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase;
    margin-top: 4px;
  }
  .feature-list .feature .v {
    color: var(--apl-text-2) !important;
    line-height: 1.6;
    font-size: 0.96rem;
  }

  /* ============================================================
     WAVE 3 · Hero 双栏 · Apple Pro Page · 真产品图右侧
     ============================================================ */
  .hero-shell-2col {
    display: grid !important;
    grid-template-columns: 1.15fr 1fr !important;
    align-items: center !important;
    gap: clamp(40px, 6vw, 80px) !important;
  }
  .hero-text { min-width: 0; }
  .hero-product {
    margin: 0;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
  }
  .hero-product picture { display: block; line-height: 0; }
  .hero-product img {
    display: block;
    width: 100%;
    max-width: 460px;
    height: auto;
    /* 图本身已是透明 PNG（背景已抠除），仅加 Apple 投影 + 蓝光晕 */
    filter:
      drop-shadow(0 32px 48px oklch(0 0 0 / 0.55))
      drop-shadow(0 0 64px oklch(0.55 0.18 245 / 0.28));
    transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.3, 1);
  }
  .hero-product:hover img { transform: translateY(-4px) scale(1.012); }
  /* 产品图周围蓝色 ambient halo（Apple Pro Page 标志性元素 · 包覆全周） */
  .hero-product::before {
    content: '';
    position: absolute;
    top:-8%;right:-10%;bottom:-8%;left:-10%;
    background:
      radial-gradient(ellipse 60% 70% at 50% 55%, oklch(0.42 0.12 248 / 0.42) 0%, transparent 65%),
      radial-gradient(ellipse 90% 50% at 50% 90%, oklch(0.55 0.18 245 / 0.30) 0%, transparent 70%);
    filter: blur(36px);
    z-index: -1;
    pointer-events: none;
  }
  /* 底部反射（Apple 产品图标志性 mirror reflect） */
  .hero-product::after {
    content: '';
    position: absolute;
    bottom: 4%;
    left: 50%;
    transform: translateX(-50%);
    width: 50%;
    height: 14px;
    background: radial-gradient(ellipse at center, oklch(0 0 0 / 0.55) 0%, transparent 70%);
    filter: blur(10px);
    z-index: -1;
    pointer-events: none;
  }
  @media (max-width: 860px) {
    .hero-shell-2col {
      grid-template-columns: 1fr !important;
      gap: 40px !important;
    }
    .hero-product img { max-width: 320px; }
  }

  /* ============================================================
     WAVE 2 · Apple Pro Page · 大字 + bento + spec capsule
     ============================================================ */

  /* ----- 16b. Hero · 顶部 product reveal ---------------------------------- */
  html { scroll-behavior: smooth; }
  section.hero {
    padding: clamp(72px, 11vw, 140px) 0 clamp(48px, 7vw, 80px) !important;
    position: relative;
  }
  section.hero .shell {
    display: grid;
    grid-template-rows: auto auto auto auto auto;
    gap: 0;
  }
  section.hero .hero-meta {
    margin: 0 0 36px !important;
    padding-bottom: 20px;
    border-bottom: 0.5px solid var(--apl-rule);
    gap: 28px !important;
    font-size: 0.74rem !important;
  }
  section.hero h1 {
    font-size: clamp(2.6rem, 7.8vw, 6.4rem) !important;
    font-weight: 700 !important;
    line-height: 1.02 !important;
    letter-spacing: -0.040em !important;
    margin: 0 0 22px !important;
    max-width: 18ch;
  }
  section.hero h1 br { display: inline; }   /* allow natural wrap on small screens */
  section.hero .hero-lead {
    max-width: 56ch !important;
    margin: 0 0 36px !important;
    font-size: clamp(1.04rem, 1.8vw, 1.22rem) !important;
    line-height: 1.55 !important;
    color: var(--apl-text-2) !important;
  }
  section.hero .hero-lead strong { color: var(--apl-text) !important; font-weight: 600; }
  /* CTA buttons */
  .hero-cta {
    display: flex; gap: 12px; flex-wrap: wrap;
    margin: 0 0 56px;
  }
  .btn-primary, .btn-ghost {
    display: inline-flex; align-items: center; justify-content: center;
    height: 46px; padding: 0 22px;
    border-radius: 999px;
    font-size: 0.96rem; font-weight: 500;
    letter-spacing: -0.005em;
    transition: all 0.2s cubic-bezier(0.2, 0.7, 0.3, 1);
    text-decoration: none;
    border: 0.5px solid transparent;
    font-family: inherit;
  }
  .btn-primary {
    background: var(--apl-blue);
    color: white;
    box-shadow: 0 1px 0 oklch(1 0 0 / 0.15) inset,
                0 8px 24px -10px oklch(0.55 0.18 245 / 0.65);
  }
  .btn-primary:hover {
    background: var(--apl-blue-hi);
    transform: translateY(-1px);
    box-shadow: 0 1px 0 oklch(1 0 0 / 0.2) inset,
                0 12px 32px -10px oklch(0.55 0.18 245 / 0.75);
  }
  .btn-ghost {
    background: oklch(1 0 0 / 0.05);
    color: var(--apl-text);
    border-color: var(--apl-rule-hi);
    backdrop-filter: blur(20px);
  }
  .btn-ghost:hover {
    background: oklch(1 0 0 / 0.10);
    border-color: var(--apl-blue);
    color: var(--apl-text);
  }
  /* hero figure — bottom of fold */
  section.hero .hero-figure {
    margin: 0 !important;
    max-height: clamp(280px, 50vw, 600px) !important;
    border-radius: 26px !important;
  }
  /* scroll cue */
  .hero-scroll-cue {
    margin-top: 28px;
    display: inline-flex; align-items: center; gap: 6px;
    color: var(--apl-text-3);
    font-size: 0.72rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    opacity: 0.75;
    animation: scrollCueBob 2.2s ease-in-out infinite;
  }
  @keyframes scrollCueBob {
    0%, 100% { transform: translateY(0); opacity: 0.6; }
    50%      { transform: translateY(4px); opacity: 1; }
  }

  /* ----- 16c. vs-band · 独立细带（从 hero 抽出） ------------------------- */
  section.vs-band {
    padding: 22px 0 22px;
    border-top: 0.5px solid var(--apl-rule);
    border-bottom: 0.5px solid var(--apl-rule);
    background: oklch(0.08 0.04 250 / 0.45);
    backdrop-filter: blur(20px) saturate(160%);
  }
  section.vs-band .vs-strip {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
  }
  section.vs-band .vs-strip::after { display: none !important; }

  /* ----- 16d. §02 Differentiation · bento layout ------------------------- */
  .feature-list {
    display: grid !important;
    grid-template-columns: 1.5fr 1fr 1fr !important;
    grid-template-rows: auto auto !important;
    gap: 20px !important;
  }
  .feature-list > .feature:nth-child(1) {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
  }
  .feature-list > .feature:nth-child(2) { grid-column: 2 / 3; grid-row: 1 / 2; }
  .feature-list > .feature:nth-child(3) { grid-column: 3 / 4; grid-row: 1 / 2; }
  .feature-list > .feature:nth-child(4) { grid-column: 2 / 3; grid-row: 2 / 3; }
  .feature-list > .feature:nth-child(5) { grid-column: 3 / 4; grid-row: 2 / 3; }
  /* 第一个 bento 大块：图占满顶部 + 文字大字 */
  .feature-list > .feature:nth-child(1) {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
    padding: 0 !important;
    overflow: hidden;
  }
  .feature-list > .feature:nth-child(1) .feature-figure {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
    aspect-ratio: 16 / 11 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  .feature-list > .feature:nth-child(1) .feature-figure::after { display: none !important; }
  .feature-list > .feature:nth-child(1) .feature-figure img { border-radius: 0 !important; }
  .feature-list > .feature:nth-child(1) .k,
  .feature-list > .feature:nth-child(1) .v {
    padding: 0 28px;
  }
  .feature-list > .feature:nth-child(1) .k { margin-top: 24px; font-size: 1.4rem !important; }
  .feature-list > .feature:nth-child(1) .v { padding-bottom: 28px; }
  /* 其余 4 卡：紧凑无图 */
  .feature-list > .feature:nth-child(n+2) .feature-figure { display: none; }
  .feature-list > .feature:nth-child(n+2) {
    grid-template-columns: 1fr !important;
    padding: 24px 24px !important;
  }

  /* ----- 16e. §05 Scenarios · bento ------------------------------------- */
  .scenarios {
    display: grid !important;
    grid-template-columns: 2fr 1fr 1fr !important;
    grid-template-rows: auto auto auto !important;
    gap: 16px !important;
  }
  /* 6 scenarios: bento — 2 large (1,3) + 4 small */
  .scenarios > .scenario:nth-child(1) {
    grid-column: 1 / 2; grid-row: 1 / 3;
  }
  .scenarios > .scenario:nth-child(2) { grid-column: 2 / 3; grid-row: 1 / 2; }
  .scenarios > .scenario:nth-child(3) { grid-column: 3 / 4; grid-row: 1 / 2; }
  .scenarios > .scenario:nth-child(4) { grid-column: 2 / 3; grid-row: 2 / 3; }
  .scenarios > .scenario:nth-child(5) { grid-column: 3 / 4; grid-row: 2 / 3; }
  .scenarios > .scenario:nth-child(6) {
    grid-column: 1 / 4; grid-row: 3 / 4;
    display: grid !important;
    grid-template-columns: 0.8fr 2fr !important;
    gap: 0 24px !important;
    align-items: center !important;
  }
  .scenarios > .scenario:nth-child(6) .scenario-figure {
    margin: 0 !important;
    aspect-ratio: 4 / 3 !important;
  }
  .scenarios > .scenario:nth-child(1) .scenario-figure {
    aspect-ratio: 4 / 5 !important;
  }
  .scenarios > .scenario:nth-child(2) .scenario-figure,
  .scenarios > .scenario:nth-child(3) .scenario-figure,
  .scenarios > .scenario:nth-child(4) .scenario-figure,
  .scenarios > .scenario:nth-child(5) .scenario-figure {
    display: none !important;
  }
  .scenarios > .scenario:nth-child(2),
  .scenarios > .scenario:nth-child(3),
  .scenarios > .scenario:nth-child(4),
  .scenarios > .scenario:nth-child(5) {
    padding: 22px 20px !important;
  }

  /* ----- 16f. §06 Specs · Apple spec capsule ---------------------------- */
  .specs {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    grid-template-rows: auto auto !important;
    padding: 18px 24px !important;
    gap: 0 !important;
  }
  .specs .spec {
    padding: 28px 18px !important;
    border-right: 0.5px solid var(--apl-rule) !important;
    border-bottom: 0.5px solid var(--apl-rule) !important;
    text-align: left;
  }
  .specs .spec:nth-child(4n),
  .specs .spec:last-child { border-right: 0 !important; }
  .specs .spec:nth-last-child(-n+4) { border-bottom: 0 !important; }
  .spec .label {
    text-transform: uppercase;
    margin-bottom: 14px !important;
  }
  .spec .value {
    font-size: 1.8rem !important;        /* Apple-style big number */
    font-weight: 700 !important;
    letter-spacing: -0.020em !important;
    line-height: 1.1 !important;
  }
  .spec .value small {
    font-size: 0.78rem !important;
    font-weight: 400 !important;
    margin-top: 8px !important;
  }

  /* ----- 16g. §07 Roadmap · horizontal snap rail (desktop) -------------- */
  .roadmap {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(180px, 1fr)) !important;
    padding: 0 !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .roadmap::-webkit-scrollbar { display: none; }
  .roadmap .gate {
    scroll-snap-align: start;
    padding: 28px 22px 30px !important;
    border-right: 0.5px solid var(--apl-rule) !important;
    border-bottom: 0 !important;
  }
  .roadmap .gate:last-child { border-right: 0 !important; }
  .roadmap .gate .stage {
    font-size: 0.68rem !important;
    margin-bottom: 16px;
  }
  .roadmap .gate h4 {
    font-size: 1.6rem !important;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
  }
  .roadmap .gate .body { font-size: 0.86rem; }
  .roadmap .gate .marker { margin-top: 16px; }

  @media (max-width: 720px) {
    .feature-list {
      grid-template-columns: 1fr !important;
      grid-template-rows: auto !important;
    }
    .feature-list > .feature:nth-child(n) {
      grid-column: 1 / -1 !important;
      grid-row: auto !important;
    }
    .scenarios {
      grid-template-columns: 1fr !important;
      grid-template-rows: auto !important;
    }
    .scenarios > .scenario:nth-child(n) {
      grid-column: 1 / -1 !important;
      grid-row: auto !important;
    }
    .scenarios > .scenario:nth-child(6) {
      grid-template-columns: 1fr !important;
    }
    .specs {
      grid-template-columns: 1fr 1fr !important;
    }
    .specs .spec {
      padding: 22px 16px !important;
    }
    .specs .spec:nth-child(2n) { border-right: 0 !important; }
    .specs .spec:nth-child(2n+1) { border-right: 0.5px solid var(--apl-rule) !important; }
    .roadmap {
      grid-template-columns: repeat(6, 84vw) !important;
      padding: 0 0 4px !important;
    }
    section.hero h1 { font-size: clamp(2.1rem, 9vw, 3.4rem) !important; }
    .hero-cta { margin-bottom: 36px; }
  }

  /* ----- 17. card-device 真产品图（替换原 SVG mock）------------------------ */
  .card-device.card-device--photo {
    width: auto !important;
    height: auto !important;
    background: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: block !important;
    margin-top: 24px;
  }
  .card-device.card-device--photo::before,
  .card-device.card-device--photo::after { display: none !important; }
  .card-device.card-device--photo picture { display: block; }
  .card-device.card-device--photo img {
    display: block;
    width: 220px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    /* 黑底产品图浮在 navy 上的柔光 + 阴影 */
    filter:
      drop-shadow(0 18px 28px oklch(0 0 0 / 0.55))
      drop-shadow(0 0 32px oklch(0.55 0.18 245 / 0.18));
    transition: transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1);
  }
  .card-device.card-device--photo:hover img {
    transform: translateY(-3px);
  }
  @media (max-width: 720px) {
    .card-device.card-device--photo img { width: 180px; }
  }

  /* ----- 18. §00 三件套信条 · Apple glass three-pillars --------------------- */
  section.hero .hero-lead-foot {
    display: block;
    margin-top: 14px;
    font-size: 0.86rem;
    line-height: 1.6;
    color: var(--apl-text-3) !important;
    letter-spacing: 0;
    font-family: 'Inter', 'SF Pro Display', system-ui, sans-serif;
  }

  .doctrine-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    margin-top: 8px;
  }
  .doctrine {
    position: relative;
    background: var(--apl-glass) !important;
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
    border: 0.5px solid var(--apl-rule-hi) !important;
    border-radius: 22px;
    padding: 36px 30px 28px;
    display: flex;
    flex-direction: column;
    box-shadow: var(--apl-shadow-card);
    transition: transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1),
                box-shadow 0.4s cubic-bezier(0.2, 0.7, 0.3, 1);
  }
  .doctrine:hover {
    transform: translateY(-3px);
    box-shadow:
      inset 0 0.5px 0 oklch(1 0 0 / 0.10),
      0 1px 2px oklch(0 0 0 / 0.32),
      0 36px 80px -20px oklch(0 0 0 / 0.65);
  }
  .doctrine-num {
    position: absolute;
    top: 22px;
    right: 26px;
    font-family: 'Inter', 'SF Pro Display', system-ui, sans-serif;
    font-weight: 700 !important;
    font-size: 3.6rem;
    line-height: 0.9;
    letter-spacing: -0.04em;
    color: transparent !important;
    background: linear-gradient(180deg,
      var(--apl-blue) 0%,
      var(--apl-blue-deep) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    opacity: 0.85;
  }
  .doctrine-tag {
    font-family: 'JetBrains Mono', 'SF Mono', ui-monospace, monospace !important;
    font-size: 0.66rem !important;
    letter-spacing: 0.18em !important;
    color: var(--apl-blue) !important;
    text-transform: uppercase;
    margin-bottom: 16px;
    font-weight: 500;
  }
  .doctrine-h {
    font-family: 'Inter', 'SF Pro Display', 'PingFang SC', system-ui, sans-serif !important;
    font-size: clamp(1.22rem, 1.6vw, 1.5rem) !important;
    line-height: 1.25 !important;
    letter-spacing: -0.024em !important;
    color: var(--apl-text) !important;
    font-weight: 600 !important;
    margin: 0 0 18px;
    padding-right: 60px;
  }
  .doctrine-h em {
    font-style: normal !important;
    color: var(--apl-blue) !important;
    font-weight: 600 !important;
  }
  .doctrine-body {
    color: var(--apl-text-2) !important;
    font-size: 0.95rem;
    line-height: 1.7;
    margin: 0 0 18px;
    letter-spacing: 0;
  }
  .doctrine-body strong { color: var(--apl-text) !important; font-weight: 600 !important; }
  .doctrine-rule {
    position: relative;
    background: oklch(0.55 0.18 245 / 0.08) !important;
    border-left: 2px solid var(--apl-blue) !important;
    border-radius: 0 10px 10px 0;
    padding: 12px 16px !important;
    font-size: 0.84rem !important;
    line-height: 1.6 !important;
    color: var(--apl-text-2) !important;
    margin: 0 0 16px;
  }
  .doctrine-rule b { color: var(--apl-text) !important; font-weight: 600 !important; }
  .doctrine-foil {
    font-family: 'JetBrains Mono', 'SF Mono', ui-monospace, monospace !important;
    font-size: 0.72rem !important;
    color: var(--apl-text-3) !important;
    line-height: 1.6 !important;
    border-top: 0.5px solid var(--apl-rule) !important;
    padding-top: 14px !important;
    margin-top: auto !important;
    letter-spacing: 0;
  }
  .doctrine-foot {
    margin-top: 36px;
    padding: 20px 26px;
    background: oklch(0.10 0.04 250 / 0.55) !important;
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    border: 0.5px solid var(--apl-rule) !important;
    border-radius: 16px;
    font-size: 0.92rem;
    line-height: 1.75;
    color: var(--apl-text-2) !important;
    letter-spacing: 0;
  }
  .doctrine-foot b {
    color: var(--apl-text) !important;
    font-family: 'JetBrains Mono', 'SF Mono', ui-monospace, monospace !important;
    font-size: 0.84em;
    font-weight: 500 !important;
    padding: 1px 6px;
    background: oklch(0.55 0.18 245 / 0.14);
    border-radius: 4px;
    margin: 0 2px;
  }
  @media (max-width: 980px) {
    .doctrine-grid { grid-template-columns: 1fr; gap: 20px; }
    .doctrine { padding: 28px 24px 22px; }
    .doctrine-num { font-size: 3rem; top: 18px; right: 22px; }
    .doctrine-h { padding-right: 56px; }
  }

  /* ----- 19. §07 已交付能力 6 卡 · Apple spec capsule grid --------------- */
  .status-shipped {
    margin-top: 56px;
    padding: 34px 36px 32px;
    background: var(--apl-glass-hi) !important;
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
    border: 0.5px solid var(--apl-rule-hi) !important;
    border-radius: 22px;
    box-shadow: var(--apl-shadow-card);
  }
  .status-shipped-h {
    font-family: 'Inter', 'SF Pro Display', 'PingFang SC', system-ui, sans-serif !important;
    font-size: clamp(1rem, 1.4vw, 1.18rem) !important;
    font-weight: 600 !important;
    letter-spacing: -0.018em !important;
    color: var(--apl-text) !important;
    margin-bottom: 26px;
    padding-bottom: 18px;
    border-bottom: 0.5px solid var(--apl-rule);
    display: flex;
    align-items: center;
    gap: 12px;
  }
  .status-shipped-h::before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: oklch(0.72 0.18 145);
    box-shadow: 0 0 12px oklch(0.72 0.18 145 / 0.7);
    flex-shrink: 0;
  }
  .status-shipped-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px 36px;
  }
  .status-shipped-grid .ship {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px 0 4px 18px;
    border-left: 1.5px solid var(--apl-blue);
    position: relative;
  }
  .status-shipped-grid .ship b {
    font-family: 'Inter', 'SF Pro Display', 'PingFang SC', system-ui, sans-serif !important;
    font-weight: 600 !important;
    color: var(--apl-text) !important;
    font-size: 1rem !important;
    letter-spacing: -0.018em;
    line-height: 1.3;
  }
  .status-shipped-grid .ship span {
    color: var(--apl-text-2) !important;
    font-size: 0.86rem;
    line-height: 1.55;
  }
  @media (max-width: 880px) {
    .status-shipped { padding: 26px 22px 24px; margin-top: 40px; }
    .status-shipped-grid { grid-template-columns: 1fr; gap: 20px; }
  }


  html.is-embed-android,
  html.is-embed-android body {
    margin: 0 !important;
    padding: 0 !important;
    background: #f5f7fa !important;
    overflow-x: hidden;
    min-height: 100vh;
  }
  /* 1) body 直接子节点：除 main / script / style 全藏；main 内部除 #proto 全藏 */
  /* 关键：sheet host / toast 是动态 append 到 body 的弹层，必须放行，否则 Android 内点跨录音动作
     完全没反应 — sheet 创建出来立刻被 display:none 吞掉。
     v0.6.5 兜底：新加 [data-mc-overlay] attribute 白名单 —— 以后所有动态浮层用
     window.__mcMountOverlay(el)（见 telemetry 区块）会自动 set attribute，
     防漏加 id 白名单导致 APK 内"点了没反应"的历史 bug 再现。
     W3 (2026-06-11): Mnemo 钱包浮层 [data-mc-overlay="wallet"|"redeem"|"low-credit"] 已被
     上面通配 :not([data-mc-overlay]) 自动放行，此处具名显式声明仅作 readability 注释。 */
  html.is-embed-android body > *:not(main):not(script):not(noscript):not(style):not(#mnemo-version-badge):not(#mcRecSticky):not(#mc-sheet-host):not(#mc-toast):not(#mcLoader):not([data-mc-overlay]):not([data-mc-overlay="wallet"]):not([data-mc-overlay="redeem"]):not([data-mc-overlay="low-credit"]) {
    display: none !important;
  }
  html.is-embed-android main > *:not(#proto):not(script):not(noscript):not(style) {
    display: none !important;
  }
  /* 2) 把 main 一直到 .phone-frame 这一连串容器全部打平、撑满 */
  html.is-embed-android main,
  html.is-embed-android #proto,
  html.is-embed-android .proto-band,
  html.is-embed-android .proto-band .shell,
  html.is-embed-android .proto-stage,
  html.is-embed-android .card-stage-flex {
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
    width: 100% !important;
    background: transparent !important;
    display: block !important;
    gap: 0 !important;
    border: 0 !important;
  }
  /* 3) 桌面装饰（"Interactive Prototype" 介绍 + 卡片秀）藏掉 */
  html.is-embed-android .proto-intro { display: none !important; }
  html.is-embed-android .card-stage-flex > :not(.phone-frame) { display: none !important; }
  /* 4) 手机外壳打平：去边框、去圆角、去阴影、占满 viewport */
  html.is-embed-android .phone-frame {
    width: 100% !important;
    max-width: none !important;
    height: 100vh !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #f5f7fa !important;
    display: flex !important;
    flex-direction: column !important;
  }
  html.is-embed-android .phone-notch,
  html.is-embed-android .phone-statusbar { display: none !important; }
  /* 5) .phone-screen 是真正的内容容器，让它 flex column 撑满 phone-frame */
  html.is-embed-android .phone-screen {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    border-radius: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }
  /* 6) .phone-topbar (蓝色) 保留但只占自然高度 —— 关键：flex 不许 grow */
  html.is-embed-android .phone-topbar {
    flex: 0 0 auto !important;
    padding-top: calc(env(safe-area-inset-top, 0) + 12px) !important;
  }
  /* dt-39 · APK 顶栏头像跟着 safe-area 下移，避免被刘海/状态栏挡住 */
  html.is-embed-android .mc-tier-avatar {
    top: calc(env(safe-area-inset-top, 0) + 12px) !important;
    right: 14px !important;
    width: 38px !important; height: 38px !important;
  }
  html.is-embed-android .mc-tier-avatar-ico { width: 22px !important; height: 22px !important; }
  /* 7) .phone-screen-content 拿走 phone-screen 剩余空间 */
  html.is-embed-android .phone-screen-content {
    flex: 1 1 0 !important;
    min-height: 0 !important;
    height: auto !important;
    overflow-y: auto !important;
  }
  html.is-embed-android .phone-view.active {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100% !important;
    padding-bottom: calc(env(safe-area-inset-bottom, 0) + 80px) !important;
  }

  /* ==========================================================================
     钉钉录音卡片风格 视觉层 (embed=android 专用)
     色彩 / 排版 / 留白 / 卡片质感全套
     ========================================================================== */
  html.is-embed-android {
    /* 重映射全局变量 → DingTalk 调色板 */
    --dt-bg: #F4F6FA;
    --dt-card: #FFFFFF;
    --dt-line: #ECEEF1;
    --dt-ink-strong: #1F2329;
    --dt-ink: #2F3640;
    --dt-ink-soft: #5C6373;
    --dt-ink-mute: #8F95A1;
    --dt-blue: #5b6cff;
    --dt-blue-soft: #E8F1FF;
    --dt-red: #F5222D;
    --dt-red-soft: #FFF1F0;
    --dt-amber: #FAAD14;
    --dt-amber-soft: #FFF7E6;
    --dt-green: #52C41A;
    --dt-green-soft: #F6FFED;
  }

  /* 整页背景 */
  html.is-embed-android body,
  html.is-embed-android .phone-frame,
  html.is-embed-android .phone-screen {
    background: var(--dt-bg) !important;
  }

  /* === topbar (蓝色 app bar) === */
  html.is-embed-android .phone-topbar {
    background: linear-gradient(180deg, #5b6cff 0%, #4a4ad8 100%) !important;
    padding: calc(env(safe-area-inset-top, 0) + 14px) 18px 16px !important;
    box-shadow: 0 1px 0 rgba(0,0,0,0.06) !important;
  }
  html.is-embed-android .phone-topbar .title {
    font-family: var(--sans) !important;
    font-size: 18px !important; font-weight: 600 !important; letter-spacing: 0 !important;
    margin-bottom: 3px !important; color: #fff !important;
  }
  html.is-embed-android .phone-topbar .sub {
    font-size: 12px !important; opacity: 0.82 !important; font-weight: 400 !important;
  }

  /* === 区块标题 === */
  html.is-embed-android .phone-block-h {
    font-family: var(--sans) !important;
    font-size: 13px !important; font-weight: 600 !important;
    color: var(--dt-ink-soft) !important;
    letter-spacing: 0 !important; text-transform: none !important;
    margin: 16px 0 8px !important;
    padding: 0 4px !important;
  }

  /* === 录音入口大按钮 === */
  html.is-embed-android .phone-recbtn {
    width: 96px !important; height: 96px !important;
    background: linear-gradient(135deg, #FF5252, #F5222D) !important;
    color: #fff !important; border: 0 !important;
    box-shadow: 0 8px 24px -6px rgba(245,34,45,0.45),
                inset 0 -2px 0 rgba(0,0,0,0.08) !important;
    font-size: 13px !important; font-weight: 600 !important;
    margin: 16px auto 8px !important;
    line-height: 1.3 !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
  }
  html.is-embed-android .phone-recbtn:active {
    transform: scale(0.96) !important;
    box-shadow: 0 4px 12px -2px rgba(245,34,45,0.45) !important;
  }
  html.is-embed-android .phone-recbtn.is-rec {
    background: linear-gradient(135deg, #FF6B6B, #DC2626) !important;
    animation: dtRecPulse 1.6s ease-in-out infinite !important;
  }
  @keyframes dtRecPulse {
    0%, 100% { box-shadow: 0 8px 24px -6px rgba(245,34,45,0.45),
                           inset 0 -2px 0 rgba(0,0,0,0.08),
                           0 0 0 0 rgba(245,34,45,0.4); }
    50%      { box-shadow: 0 8px 24px -6px rgba(245,34,45,0.45),
                           inset 0 -2px 0 rgba(0,0,0,0.08),
                           0 0 0 16px rgba(245,34,45,0); }
  }
  html.is-embed-android .phone-rectimer {
    font-size: 22px !important; font-weight: 600 !important;
    color: var(--dt-ink-strong) !important;
    letter-spacing: 0.04em !important;
    margin: 8px 0 4px !important;
  }

  /* === 波形 === */
  html.is-embed-android .phone-waveform {
    height: 44px !important; gap: 3px !important;
    padding: 4px 14px !important; margin: 4px 0 8px !important;
  }
  html.is-embed-android .phone-waveform .bar {
    width: 3px !important;
    background: linear-gradient(180deg, #5b6cff 0%, #22c3ee 100%) !important;
    border-radius: 2px !important;
    transition: height 60ms linear !important;
  }

  /* === 录音列表卡片 === */
  html.is-embed-android .phone-rec-list { gap: 8px !important; padding: 0 14px !important; }
  html.is-embed-android .phone-rec-item {
    background: var(--dt-card) !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
    border: 1px solid var(--dt-line) !important;
    font-size: 14px !important;
    display: flex !important; flex-direction: column !important; gap: 4px !important;
    transition: transform 0.12s ease, box-shadow 0.12s ease !important;
  }
  html.is-embed-android .phone-rec-item:active {
    transform: scale(0.99) !important;
    box-shadow: 0 0 0 rgba(0,0,0,0) !important;
  }
  html.is-embed-android .phone-rec-item .title {
    font-size: 15px !important; font-weight: 600 !important;
    color: var(--dt-ink-strong) !important; margin: 0 !important;
  }
  html.is-embed-android .phone-rec-item .meta {
    font-size: 12px !important; color: var(--dt-ink-mute) !important;
    font-family: var(--mono) !important;
  }

  /* 整体 .phone-view 内边距 */
  html.is-embed-android .phone-view {
    padding: 14px 0 60px !important; gap: 0 !important;
  }
  /* 但部分子元素需要左右内边距，由各自规则负责 */

  /* === 转写卡片 === */
  html.is-embed-android .phone-transcript {
    background: var(--dt-card) !important;
    border-radius: 12px !important;
    border: 1px solid var(--dt-line) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
    padding: 16px !important; margin: 0 14px !important;
    font-size: 14px !important; line-height: 1.7 !important;
    color: var(--dt-ink) !important;
    gap: 12px !important;
  }
  html.is-embed-android .phone-line .who {
    font-size: 11px !important; font-weight: 600 !important;
    color: var(--dt-blue) !important;
    background: var(--dt-blue-soft) !important;
    padding: 2px 8px !important; border-radius: 999px !important;
    display: inline-block !important; margin-bottom: 4px !important;
  }

  /* === 摘要卡 === */
  html.is-embed-android .phone-summary {
    background: var(--dt-card) !important;
    border-radius: 12px !important;
    border: 1px solid var(--dt-line) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
    padding: 18px !important; margin: 0 14px !important;
    font-size: 14px !important; line-height: 1.6 !important;
    color: var(--dt-ink) !important;
  }
  html.is-embed-android .phone-summary h4 {
    font-size: 16px !important; font-weight: 600 !important;
    color: var(--dt-ink-strong) !important; margin-bottom: 12px !important;
    font-family: var(--sans) !important;
  }
  html.is-embed-android .phone-summary .sec {
    border-top: 1px solid var(--dt-line) !important;
    padding: 12px 0 !important; margin: 0 !important;
  }
  html.is-embed-android .phone-summary .sec b {
    font-size: 12px !important; color: var(--dt-blue) !important;
    letter-spacing: 0 !important; text-transform: none !important;
    font-family: var(--sans) !important; font-weight: 600 !important;
    margin-bottom: 6px !important;
  }
  html.is-embed-android .phone-summary .sec li { padding: 4px 0 !important; font-size: 13.5px !important; }

  /* === 待办卡片 === */
  html.is-embed-android .phone-todos { gap: 8px !important; padding: 0 14px !important; }
  html.is-embed-android .phone-todo {
    background: var(--dt-card) !important;
    border-radius: 12px !important;
    border: 1px solid var(--dt-line) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
    padding: 14px 16px !important;
    grid-template-columns: 24px 1fr auto !important;
    gap: 12px !important; font-size: 14px !important;
  }
  html.is-embed-android .phone-todo .check { width: 22px !important; height: 22px !important; border-radius: 6px !important; font-size: 13px !important; }
  html.is-embed-android .phone-todo .check.done   { background: var(--dt-green) !important; }
  html.is-embed-android .phone-todo .check.pending{ background: var(--dt-bg) !important; border: 1.5px dashed var(--dt-ink-mute) !important; color: var(--dt-ink-mute) !important; }
  html.is-embed-android .phone-todo .check.danger { background: var(--dt-amber-soft) !important; color: var(--dt-amber) !important; }
  html.is-embed-android .phone-todo .body .title { font-size: 14px !important; color: var(--dt-ink-strong) !important; }
  html.is-embed-android .phone-todo .body .meta  { font-size: 11px !important; color: var(--dt-ink-mute) !important; margin-top: 3px !important; }
  html.is-embed-android .phone-todo .tag         { font-size: 10.5px !important; padding: 3px 8px !important; border-radius: 999px !important; font-weight: 600 !important; }
  html.is-embed-android .phone-todo .tag.auto    { background: var(--dt-green-soft) !important; color: var(--dt-green) !important; }
  html.is-embed-android .phone-todo .tag.ok      { background: var(--dt-blue-soft) !important; color: var(--dt-blue) !important; }
  html.is-embed-android .phone-todo .tag.warn    { background: var(--dt-amber-soft) !important; color: var(--dt-amber) !important; }

  /* === L2 确认卡（高风险） === */
  html.is-embed-android .phone-confirm-card {
    margin: 0 14px !important;
    border: 1.5px solid var(--dt-amber) !important;
    background: linear-gradient(180deg, #FFFBEB 0%, #FFFFFF 60%) !important;
    box-shadow: 0 4px 14px -6px rgba(250,173,20,0.3) !important;
    padding: 16px !important;
  }
  html.is-embed-android .phone-confirm-card .warn-h {
    color: var(--dt-amber) !important; font-size: 15px !important;
    font-family: var(--sans) !important;
  }
  html.is-embed-android .phone-confirm-card p { font-size: 13.5px !important; color: var(--dt-ink) !important; }
  html.is-embed-android .phone-confirm-card .draft { background: var(--dt-bg) !important; border-radius: 8px !important; padding: 12px !important; font-size: 13px !important; color: var(--dt-ink-soft) !important; }
  html.is-embed-android .phone-confirm-card .actions button { padding: 12px !important; font-size: 14px !important; border-radius: 10px !important; }
  html.is-embed-android .phone-confirm-card .actions .approve { background: var(--dt-amber) !important; }
  html.is-embed-android .phone-confirm-card .actions .deny    { background: var(--dt-bg) !important; color: var(--dt-ink) !important; }

  /* === 记忆卡片 === */
  html.is-embed-android .phone-mem { gap: 12px !important; padding: 0 14px !important; }
  html.is-embed-android .phone-mem-card {
    background: var(--dt-card) !important;
    border-radius: 12px !important;
    border: 1px solid var(--dt-line) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
    padding: 14px 16px !important;
  }
  html.is-embed-android .phone-mem-card h5 {
    font-size: 12px !important; color: var(--dt-blue) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    font-family: var(--sans) !important; font-weight: 600 !important;
    margin-bottom: 10px !important;
  }
  html.is-embed-android .phone-mem-card .item {
    border-top: 1px solid var(--dt-line) !important;
    padding: 10px 0 !important; font-size: 13.5px !important;
    grid-template-columns: 32px 1fr auto !important; gap: 12px !important;
  }
  html.is-embed-android .phone-mem-card .avatar {
    width: 30px !important; height: 30px !important; font-size: 13px !important;
    background: linear-gradient(135deg, #5b6cff, #22c3ee) !important;
    box-shadow: 0 2px 6px -2px rgba(91, 108, 255,0.4) !important;
  }
  html.is-embed-android .phone-mem-card .who { color: var(--dt-ink-strong) !important; }
  html.is-embed-android .phone-mem-card .meta { font-size: 11px !important; color: var(--dt-ink-mute) !important; }
  html.is-embed-android .phone-mem-card .count { color: var(--dt-blue) !important; font-size: 15px !important; }
  html.is-embed-android .phone-mem-card .blurb { font-size: 13.5px !important; color: var(--dt-ink) !important; line-height: 1.6 !important; }

  /* === 底部 tab bar === */
  html.is-embed-android .phone-bottombar {
    background: var(--dt-card) !important;
    border-top: 1px solid var(--dt-line) !important;
    padding: 6px 0 calc(env(safe-area-inset-bottom, 0) + 8px) !important;
    box-shadow: 0 -1px 0 rgba(0,0,0,0.04) !important;
  }
  html.is-embed-android .phone-bottombar button {
    padding: 6px 4px !important; gap: 3px !important;
    font-size: 11px !important; color: var(--dt-ink-mute) !important;
  }
  html.is-embed-android .phone-bottombar button.active,
  html.is-embed-android .phone-bottombar button[data-active="true"] {
    color: var(--dt-blue) !important;
  }

  /* === Agent 视图 polish === */
  html.is-embed-android .agent-card {
    background: var(--dt-card) !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
    padding: 14px 16px !important;
    margin: 0 14px 8px !important;
  }
  html.is-embed-android .agent-card-head { font-size: 14px !important; color: var(--dt-ink-strong) !important; }

  /* 通用：sheet / mc-chip / mc-btn 等次级元素 — 留给原样，不破坏功能 */
  /* dt-40 · 右上版本号 badge 撤掉（C 端 APP 不该首屏露 build 戳）。元素保留 + display:none
     —— 现有 telemetry / 模态底部 verEl 还会读它 textContent，逻辑零改动 */
  html.is-embed-android #mnemo-version-badge { display: none !important; }

  /* ==========================================================================
     钉钉录音卡片 · Wave 1 · 录音中 sticky 横条 / 三键 action / 录完态卡片
     ========================================================================== */
  /* 顶部全局 sticky 横条 —— 录音时跨 tab 常驻 */
  #mcRecSticky {
    position: fixed;
    top: calc(env(safe-area-inset-top, 0) + 0px);
    left: 0; right: 0;
    z-index: 9998;
    background: linear-gradient(180deg, #F5222D 0%, #DC2626 100%);
    color: #fff;
    padding: calc(env(safe-area-inset-top, 0) + 8px) 16px 8px;
    display: none;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 500;
    box-shadow: 0 2px 12px -2px rgba(245,34,45,0.4);
    transform: translateY(-100%);
    transition: transform 0.28s cubic-bezier(.2,.8,.2,1);
    cursor: pointer;
  }
  #mcRecSticky.is-on { display: flex; transform: translateY(0); }
  #mcRecSticky .dot {
    width: 8px; height: 8px; border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 0 rgba(255,255,255,0.6);
    animation: mcRecDotPulse 1.2s ease-in-out infinite;
    flex: 0 0 8px;
  }
  #mcRecSticky .label { flex: 1; }
  #mcRecSticky .timer {
    font-family: var(--mono);
    font-weight: 600;
    letter-spacing: 0.04em;
    font-variant-numeric: tabular-nums;
  }
  #mcRecSticky .chev {
    opacity: 0.85;
    font-size: 16px;
    line-height: 1;
    margin-left: 2px;
  }
  @keyframes mcRecDotPulse {
    0%,100% { box-shadow: 0 0 0 0 rgba(255,255,255,0.65); }
    50%     { box-shadow: 0 0 0 8px rgba(255,255,255,0); }
  }

  /* 录音中 · 三键 action 集群 (取消 · 暂停 · 完成) */
  html.is-embed-android .mc-rec-actions {
    display: none;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    padding: 14px 14px calc(env(safe-area-inset-bottom, 0) + 14px);
    margin: 16px 0 0;
  }
  html.is-embed-android.is-recording .mc-rec-actions { display: grid; }
  html.is-embed-android.is-recording [data-proto-state="transcript"] .phone-rectimer {
    color: var(--dt-red) !important;
    font-size: 28px !important;
    letter-spacing: 0.06em;
    font-variant-numeric: tabular-nums;
  }
  html.is-embed-android.is-recording [data-proto-state="transcript"] .phone-block-h {
    color: var(--dt-red) !important;
  }
  html.is-embed-android .mc-rec-act {
    background: var(--dt-card);
    border: 1px solid var(--dt-line);
    border-radius: 14px;
    padding: 12px 4px 10px;
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    font-size: 12px; color: var(--dt-ink);
    transition: transform 0.12s ease, box-shadow 0.12s ease;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  html.is-embed-android .mc-rec-act:active { transform: scale(0.96); }
  html.is-embed-android .mc-rec-act .ico {
    width: 38px; height: 38px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 600;
  }
  html.is-embed-android .mc-rec-act.cancel .ico { background: #FFF1F0; color: #F5222D; }
  html.is-embed-android .mc-rec-act.pause  .ico { background: #FFF7E6; color: #FAAD14; }
  html.is-embed-android .mc-rec-act.done   .ico { background: #F5222D; color: #fff; box-shadow: 0 4px 12px -4px rgba(245,34,45,0.5); }
  html.is-embed-android .mc-rec-act.pause.is-paused .ico { background: #E8F1FF; color: #5b6cff; }
  html.is-embed-android .mc-rec-act.pause.is-paused .lbl::before { content: ''; }
  html.is-embed-android .mc-rec-act .lbl { font-size: 12px; color: var(--dt-ink-soft); }

  /* 录音中视觉：在录音 tab 也把主红按钮换成"录音中标志" */
  html.is-embed-android.is-recording .phone-recbtn {
    animation: dtRecPulse 1.6s ease-in-out infinite !important;
  }
  html.is-embed-android.is-recording .phone-recbtn::before {
    content: '';
    position: absolute;
    top:-6px;right:-6px;bottom:-6px;left:-6px;
    border-radius: 50%;
    border: 2px solid rgba(245,34,45,0.35);
    animation: mcRingExpand 1.8s ease-out infinite;
    pointer-events: none;
  }
  @keyframes mcRingExpand {
    0%   { transform: scale(0.9); opacity: 0.9; }
    100% { transform: scale(1.45); opacity: 0; }
  }
  html.is-embed-android .phone-recbtn { position: relative; }

  /* 录完即时反馈卡片：新进入列表时滑入 + 高亮一下 */
  html.is-embed-android .phone-rec-item.is-fresh {
    animation: mcFreshIn 0.5s cubic-bezier(.2,.8,.2,1);
    border-color: var(--dt-blue) !important;
    box-shadow: 0 4px 16px -6px rgba(91, 108, 255,0.4) !important;
  }
  @keyframes mcFreshIn {
    0%   { transform: translateY(-10px) scale(0.97); opacity: 0; }
    100% { transform: translateY(0) scale(1); opacity: 1; }
  }
  html.is-embed-android .phone-rec-item .fresh-tag {
    display: inline-block;
    background: var(--dt-blue);
    color: #fff;
    font-size: 10.5px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 999px;
    margin-right: 6px;
    letter-spacing: 0.04em;
  }

  /* 录音中：让 statusbar / topbar 留够空间给 sticky 横条 */
  html.is-embed-android.is-recording .phone-screen {
    padding-top: 44px !important;
  }

  /* 暂停态：sticky 横条变橙色 + label 改文案；按钮 pulse 停; waveform 冻结 */
  html.is-paused #mcRecSticky {
    background: linear-gradient(180deg, #FAAD14 0%, #D48806 100%) !important;
    box-shadow: 0 2px 12px -2px rgba(250,173,20,0.4) !important;
  }
  html.is-paused #mcRecSticky .label::after { content: '（已暂停）'; opacity: 0.85; font-size: 11px; margin-left: 4px; }
  html.is-paused #mcRecSticky .dot { animation: none !important; box-shadow: 0 0 0 0 rgba(255,255,255,0.3) !important; }

  /* ==========================================================================
     v0.4.1 dt10 · post-record 处理条（amber → green/red flash）
     ========================================================================== */
  #mcRecSticky.is-processing {
    background: linear-gradient(180deg, #FAAD14 0%, #D48806 100%) !important;
    box-shadow: 0 2px 12px -2px rgba(250,173,20,0.45) !important;
    cursor: default;
  }
  #mcRecSticky.is-processing .dot,
  #mcRecSticky.is-processing .timer,
  #mcRecSticky.is-processing .chev { display: none !important; }
  #mcRecSticky.is-processing .spin {
    width: 14px; height: 14px; flex: 0 0 14px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.35);
    border-top-color: #fff;
    animation: mcSpin 0.85s linear infinite;
  }
  @keyframes mcSpin {
    to { transform: rotate(360deg); }
  }
  #mcRecSticky.is-processing .label { flex: 1; font-weight: 500; }
  #mcRecSticky.is-processing .step-dots {
    display: inline-flex; gap: 5px; align-items: center;
    margin-left: 8px;
  }
  #mcRecSticky.is-processing .step-dots .sd {
    width: 6px; height: 6px; border-radius: 50%;
    background: rgba(255,255,255,0.4);
    transition: background 0.3s, transform 0.3s;
  }
  #mcRecSticky.is-processing .step-dots .sd.active {
    background: #fff;
    transform: scale(1.25);
    box-shadow: 0 0 0 3px rgba(255,255,255,0.18);
  }
  #mcRecSticky.is-processing .step-dots .sd.done {
    background: rgba(255,255,255,0.85);
  }

  /* 成功 flash → 绿色 1.4s 然后 fade */
  #mcRecSticky.is-done {
    background: linear-gradient(180deg, #52C41A 0%, #389E0D 100%) !important;
    box-shadow: 0 2px 12px -2px rgba(82,196,26,0.45) !important;
    cursor: default;
  }
  #mcRecSticky.is-done .dot,
  #mcRecSticky.is-done .timer,
  #mcRecSticky.is-done .chev,
  #mcRecSticky.is-done .spin,
  #mcRecSticky.is-done .step-dots { display: none !important; }
  #mcRecSticky.is-done .check-ico {
    width: 18px; height: 18px; flex: 0 0 18px;
    border-radius: 50%;
    background: rgba(255,255,255,0.18);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 12px; line-height: 1;
    animation: mcCheckPop 0.35s cubic-bezier(.2,1.6,.5,1);
  }
  @keyframes mcCheckPop {
    0% { transform: scale(0.4); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
  }

  /* 失败 flash → 深红 + retry */
  #mcRecSticky.is-fail {
    background: linear-gradient(180deg, #CF1322 0%, #A8071A 100%) !important;
    box-shadow: 0 2px 12px -2px rgba(207,19,34,0.5) !important;
    cursor: pointer;
  }
  #mcRecSticky.is-fail .dot,
  #mcRecSticky.is-fail .timer,
  #mcRecSticky.is-fail .spin,
  #mcRecSticky.is-fail .step-dots { display: none !important; }
  #mcRecSticky.is-fail .chev { display: inline; }
  html.is-embed-android.is-paused .phone-recbtn { animation: none !important; }
  html.is-embed-android.is-paused .phone-recbtn::before { animation: none !important; opacity: 0; }
  html.is-embed-android.is-paused .phone-waveform .bar { opacity: 0.35; }
  html.is-embed-android.is-paused [data-proto-state="transcript"] .phone-rectimer {
    color: var(--dt-amber) !important;
  }

  /* ==========================================================================
     v0.4.1 · 空状态 onboarding 卡 + 本周 stats 行 (dt9)
     ========================================================================== */
  /* 本周 stats 行：录音列表上方累计感 micro-strip */
  html.is-embed-android .mc-week-stats {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 6px 16px 4px;
    margin: 4px 0 6px;
    font-size: 12px;
    color: var(--dt-ink-mute);
    font-variant-numeric: tabular-nums;
    flex-wrap: wrap;
  }
  html.is-embed-android .mc-week-stats .seg {
    display: inline-flex; align-items: baseline; gap: 4px;
  }
  html.is-embed-android .mc-week-stats .num {
    font-weight: 700; color: var(--dt-ink-strong); font-size: 13px;
    letter-spacing: 0;
  }
  html.is-embed-android .mc-week-stats .dot-sep {
    color: var(--dt-ink-mute); opacity: 0.5;
  }
  html.is-embed-android .mc-week-stats .week-lab {
    background: var(--dt-blue-soft);
    color: var(--dt-blue);
    font-weight: 600;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 999px;
    letter-spacing: 0.04em;
  }

  /* 列表头 count 后缀 */
  html.is-embed-android .phone-block-h .h-count {
    font-weight: 400;
    color: var(--dt-ink-mute);
    margin-left: 6px;
    font-size: 12px;
  }

  /* 空状态 onboarding 卡 */
  html.is-embed-android .mc-empty-onboard {
    margin: 12px 14px 8px;
    padding: 18px 16px 18px;
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFE 100%);
    border: 1px solid var(--dt-line);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
  }
  html.is-embed-android .mc-empty-onboard .mc-eo-h {
    font-size: 14px; font-weight: 600;
    color: var(--dt-ink-strong);
    margin-bottom: 2px;
  }
  html.is-embed-android .mc-empty-onboard .mc-eo-sub {
    font-size: 12px; color: var(--dt-ink-mute);
    margin-bottom: 14px; line-height: 1.5;
  }
  html.is-embed-android .mc-eo-loop {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 2px;
    padding: 4px 0 2px;
  }
  html.is-embed-android .mc-eo-step {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    position: relative;
  }
  html.is-embed-android .mc-eo-step .ico {
    width: 30px; height: 30px; border-radius: 9px;
    display: flex; align-items: center; justify-content: center;
    font-size: 15px;
    background: var(--dt-blue-soft);
    color: var(--dt-blue);
  }
  html.is-embed-android .mc-eo-step:nth-child(1) .ico { background: var(--dt-red-soft); color: var(--dt-red); }
  html.is-embed-android .mc-eo-step:nth-child(3) .ico { background: var(--dt-amber-soft); color: var(--dt-amber); }
  html.is-embed-android .mc-eo-step:nth-child(4) .ico { background: var(--dt-green-soft); color: var(--dt-green); }
  html.is-embed-android .mc-eo-step:nth-child(5) .ico {
    background: linear-gradient(135deg, #722ED1, #9254DE);
    color: #fff;
  }
  html.is-embed-android .mc-eo-step .lab {
    font-size: 11px;
    color: var(--dt-ink-soft);
    letter-spacing: 0.02em;
    text-align: center;
    white-space: nowrap;
  }
  html.is-embed-android .mc-eo-arrow {
    flex: 0 0 auto;
    align-self: center;
    color: var(--dt-ink-mute);
    font-size: 11px;
    margin-top: -18px;
    opacity: 0.55;
  }
  html.is-embed-android .mc-eo-cta {
    margin-top: 14px;
    padding: 10px 12px;
    background: var(--dt-red-soft);
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--dt-red);
    font-weight: 500;
  }
  html.is-embed-android .mc-eo-cta .arr {
    font-size: 14px;
    transform: rotate(-90deg);
    animation: mcEoCtaBob 1.4s ease-in-out infinite;
  }
  @keyframes mcEoCtaBob {
    0%,100% { transform: rotate(-90deg) translateX(0); }
    50%     { transform: rotate(-90deg) translateX(4px); }
  }

  /* ==========================================================================
     v0.5.1 dt14 · 钉钉录音卡片 fidelity + 流程梳理
     回到钉钉风视觉（蓝渐变 topbar + 大按钮带文字 + 卡片有 shadow）
     杀掉 v0.5 calm 的"性冷淡"实验；保留 dt9 stats / dt10 处理条 / dt12 状态标 / dt13 placeholder
     ========================================================================== */

  /* —— 待机时 timer 隐藏（dt11 保留这一条，钉钉也不显示 idle timer） —— */
  html.is-embed-android:not(.is-recording):not(.is-paused) [data-proto-state="rec"] > .phone-rectimer {
    display: none !important;
  }

  /* —— badge z-index 下沉，录音 sticky 红条覆盖它 —— */
  html.is-embed-android #mnemo-version-badge {
    z-index: 100 !important;
  }

  /* —— 空状态：钉钉简洁版，把"5 步循环"图收掉留两行文案 —— */
  html.is-embed-android .mc-empty-onboard .mc-eo-loop,
  html.is-embed-android .mc-empty-onboard .mc-eo-cta {
    display: none !important;
  }
  html.is-embed-android .mc-empty-onboard {
    margin: 40px 20px 0 !important;
    padding: 18px !important;
    background: #FFFFFF !important;
    border: 1px solid var(--dt-line) !important;
    border-radius: 12px !important;
    text-align: center !important;
  }

  /* ==========================================================================
     dt14 · 流程梳理 (logic cleanup)
     · is-stopping：点完成后立刻"✓ 已停止"强信号
     · 录音中锁死无关 tab（纪要/Agent/记忆）
     · transcript 加 "→ 查看纪要" 按钮（替代自动 jump）
     ========================================================================== */

  /* ==========================================================================
     mc-tx-hero · 顶级转写态 overlay（替代 dt14 的 ::before/::after 占位）
     三幕：transcribing → ready → failed
     由 html.is-stopping 与 .mc-tx-hero.is-on 联合触发
     ========================================================================== */

  /* is-stopping 时：让 transcript 视图安静下来，hero overlay 接管视觉 */
  html.is-embed-android.is-stopping [data-proto-state="transcript"] .phone-transcript {
    position: relative;
    min-height: 380px;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }
  html.is-embed-android.is-stopping [data-proto-state="transcript"] .phone-transcript > *:not(.mc-tx-hero) {
    display: none !important;
  }
  html.is-embed-android.is-stopping [data-proto-state="transcript"] .mc-rec-actions,
  html.is-embed-android.is-stopping [data-proto-state="transcript"] .phone-waveform,
  html.is-embed-android.is-stopping [data-proto-state="transcript"] > .phone-block-h {
    display: none !important;
  }
  html.is-embed-android.is-stopping [data-proto-state="transcript"] .phone-rectimer {
    display: none !important;
  }

  /* hero 容器：覆盖在 transcript 视图，垂直居中 */
  .mc-tx-hero {
    display: none;
    position: absolute;
    top:0;right:0;bottom:0;left:0;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 56px 28px 32px;
    font-family: inherit;
    color: var(--dt-ink, #1a1a2e);
    text-align: center;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .42s cubic-bezier(.2,.7,.3,1), transform .42s cubic-bezier(.2,.7,.3,1);
    pointer-events: auto;
  }
  html.is-embed-android.is-stopping [data-proto-state="transcript"] .phone-transcript > .mc-tx-hero.is-on {
    display: flex !important;
    opacity: 1;
    transform: translateY(0);
  }

  /* === 中心图形：环 + 核心点 === */
  .mc-tx-hero-ring {
    position: relative;
    width: 84px; height: 84px;
    margin-bottom: 22px;
  }
  .mc-tx-hero-ring::before,
  .mc-tx-hero-ring::after {
    content: "";
    position: absolute; top:0;right:0;bottom:0;left:0;
    border-radius: 50%;
    border: 2px solid currentColor;
    opacity: 0;
  }
  .mc-tx-hero-core {
    position: absolute;
    left: 50%; top: 50%;
    width: 44px; height: 44px;
    margin: -22px 0 0 -22px;
    border-radius: 50%;
    background: linear-gradient(135deg, #5b6cff 0%, #22c3ee 100%);
    box-shadow: 0 8px 22px -8px rgba(91, 108, 255,.55), inset 0 1px 0 rgba(255,255,255,.4);
    display: flex; align-items: center; justify-content: center;
    color: #fff;
    font-size: 22px; line-height: 1;
    transition: background .35s ease, box-shadow .35s ease, transform .42s cubic-bezier(.2,.7,.3,1);
  }
  .mc-tx-hero-core svg { width: 24px; height: 24px; display: block; }

  /* 转写中：双环 pulse */
  .mc-tx-hero.is-transcribing .mc-tx-hero-ring { color: #5b6cff; }
  .mc-tx-hero.is-transcribing .mc-tx-hero-ring::before { animation: mcTxRing 1.8s ease-out infinite; }
  .mc-tx-hero.is-transcribing .mc-tx-hero-ring::after  { animation: mcTxRing 1.8s ease-out infinite .9s; }
  .mc-tx-hero.is-transcribing .mc-tx-hero-core { animation: mcTxCore 1.8s ease-in-out infinite; }
  @keyframes mcTxRing {
    0%   { transform: scale(.6); opacity: .55; }
    80%  { transform: scale(1.35); opacity: 0; }
    100% { transform: scale(1.35); opacity: 0; }
  }
  @keyframes mcTxCore {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(.9); }
  }

  /* 完成：✓ 绿圆盘 + 静态光晕 */
  .mc-tx-hero.is-ready .mc-tx-hero-ring { color: #1f7a4a; }
  .mc-tx-hero.is-ready .mc-tx-hero-ring::before {
    opacity: .14;
    animation: mcTxReadyHalo .9s cubic-bezier(.2,.7,.3,1) forwards;
  }
  @keyframes mcTxReadyHalo {
    0%   { transform: scale(.6); opacity: 0; }
    60%  { transform: scale(1.4); opacity: .25; }
    100% { transform: scale(1.55); opacity: 0; }
  }
  .mc-tx-hero.is-ready .mc-tx-hero-core {
    background: linear-gradient(135deg, #1f7a4a 0%, #2fa05f 100%);
    box-shadow: 0 10px 26px -10px rgba(31,122,74,.55), inset 0 1px 0 rgba(255,255,255,.4);
    animation: mcTxReadyPop .55s cubic-bezier(.2,.9,.3,1);
  }
  @keyframes mcTxReadyPop {
    0%   { transform: scale(.6); }
    65%  { transform: scale(1.08); }
    100% { transform: scale(1); }
  }

  /* 失败：⚠ 灰红圆盘 */
  .mc-tx-hero.is-failed .mc-tx-hero-ring { color: #b7251a; }
  .mc-tx-hero.is-failed .mc-tx-hero-core {
    background: linear-gradient(135deg, #b7251a 0%, #d94640 100%);
    box-shadow: 0 8px 22px -10px rgba(183,37,26,.5), inset 0 1px 0 rgba(255,255,255,.4);
  }

  /* === 标题 + 副标题 === */
  .mc-tx-hero-title {
    font-size: 19px;
    font-weight: 600;
    letter-spacing: -0.005em;
    color: #0e1116;
    margin: 0 0 6px;
    line-height: 1.3;
  }
  .mc-tx-hero-sub {
    font-size: 13.5px;
    color: #6a7079;
    line-height: 1.6;
    margin: 0 0 24px;
    min-height: 22px;
    max-width: 280px;
    transition: opacity .25s ease;
  }
  .mc-tx-hero-sub.is-swap { opacity: 0; }

  /* === 录音元信息 pill === */
  .mc-tx-hero-meta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: #6a7079;
    background: rgba(14,17,22,.04);
    padding: 7px 13px;
    border-radius: 100px;
    margin-bottom: 22px;
  }
  .mc-tx-hero-meta .dot {
    width: 4px; height: 4px; border-radius: 50%;
    background: #c0c4cb;
  }
  .mc-tx-hero-meta .num { font-family: "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace; font-variant-numeric: tabular-nums; }

  /* === 转写中 ETA 细线 === */
  .mc-tx-hero-eta {
    width: min(72%, 240px);
    height: 2px;
    background: rgba(14,17,22,.06);
    border-radius: 2px;
    overflow: hidden;
    margin-top: 6px;
    display: none;
  }
  .mc-tx-hero.is-transcribing .mc-tx-hero-eta { display: block; }
  .mc-tx-hero-eta-fill {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #5b6cff, #22c3ee);
    border-radius: 2px;
    transition: width .45s ease-out;
  }

  /* === 完成态 stats pills === */
  .mc-tx-hero-stats {
    display: none;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 26px;
  }
  .mc-tx-hero.is-ready .mc-tx-hero-stats { display: inline-flex; }
  .mc-tx-hero-stats .pill {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 12px;
    color: #3a3f47;
    background: rgba(14,17,22,.04);
    padding: 6px 11px;
    border-radius: 100px;
  }
  .mc-tx-hero-stats .pill .num {
    font-family: "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
    font-weight: 600;
    color: #0e1116;
  }

  /* === CTA 主按钮 === */
  .mc-tx-hero-cta {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: min(82%, 280px);
    padding: 13px 22px;
    background: #0e1116;
    color: #fff;
    border: 0;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.01em;
    box-shadow: 0 10px 24px -10px rgba(14,17,22,.55);
    cursor: pointer;
    transition: transform .12s ease, box-shadow .2s ease;
    margin-bottom: 10px;
  }
  .mc-tx-hero.is-ready .mc-tx-hero-cta,
  .mc-tx-hero.is-failed .mc-tx-hero-cta { display: inline-flex; }
  .mc-tx-hero-cta:active { transform: translateY(1px) scale(0.99); box-shadow: 0 6px 16px -8px rgba(14,17,22,.55); }
  .mc-tx-hero-cta svg { width: 16px; height: 16px; transition: transform .25s ease; }
  .mc-tx-hero-cta:hover svg { transform: translateX(2px); }
  .mc-tx-hero.is-failed .mc-tx-hero-cta { background: #b7251a; box-shadow: 0 10px 24px -10px rgba(183,37,26,.55); }

  /* 次按钮：留这里再录一段 */
  .mc-tx-hero-secondary {
    display: none;
    font-size: 13px;
    color: #6a7079;
    background: transparent;
    border: 0;
    padding: 8px 14px;
    cursor: pointer;
  }
  .mc-tx-hero.is-ready .mc-tx-hero-secondary,
  .mc-tx-hero.is-failed .mc-tx-hero-secondary { display: inline-flex; }
  .mc-tx-hero-secondary:hover { color: #0e1116; }

  /* failed 错误细节 */
  .mc-tx-hero-err-detail {
    display: none;
    margin-top: 14px;
    padding: 10px 14px;
    background: rgba(183,37,26,.06);
    border-radius: 8px;
    font-size: 11.5px;
    color: #8f1c14;
    line-height: 1.5;
    max-width: 300px;
    word-break: break-word;
  }
  .mc-tx-hero.is-failed .mc-tx-hero-err-detail { display: block; }

  /* 录音中锁死无关 tab：纪要/Agent/记忆 dim + 拦截 */
  html.is-embed-android.is-recording .phone-bottombar [data-proto-go="summary"],
  html.is-embed-android.is-recording .phone-bottombar [data-proto-go="agent"],
  html.is-embed-android.is-recording .phone-bottombar [data-proto-go="memory"] {
    opacity: 0.32 !important;
    transition: opacity 0.2s ease;
  }

  /* "→ 查看纪要" 按钮（dt14 加入 transcript view 后） */
  html.is-embed-android .mc-goto-summary {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--dt-blue) !important;
    color: #fff !important;
    border: 0;
    border-radius: 8px;
    padding: 9px 14px;
    font-size: 13px;
    font-weight: 500;
    margin-left: 8px;
    cursor: pointer;
    box-shadow: 0 4px 12px -4px rgba(91, 108, 255,0.45);
  }
  html.is-embed-android .mc-goto-summary:active {
    transform: scale(0.97);
  }

  /* 简短 toast（dt14 锁 tab 用） */
  #mcTipToast {
    position: fixed;
    bottom: calc(env(safe-area-inset-bottom, 0) + 84px);
    left: 50%; transform: translateX(-50%);
    background: rgba(0,0,0,0.86);
    color: #fff;
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    z-index: 9997;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    max-width: calc(100vw - 48px);
    text-align: center;
  }
  #mcTipToast.show { opacity: 1; }

  /* ==========================================================================
     dt15 · 友好错误卡（替换所有 raw alert()）
     ========================================================================== */
  #mcRecErr {
    position: fixed; top:0;right:0;bottom:0;left:0;
    z-index: 10000;
    background: rgba(0,0,0,0.5);
    display: none;
    align-items: center; justify-content: center;
    padding: 24px;
    backdrop-filter: blur(2px);
  }
  #mcRecErr.on { display: flex; animation: mcErrIn 0.18s ease; }
  @keyframes mcErrIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  #mcRecErr .card {
    background: #fff;
    border-radius: 14px;
    padding: 28px 22px 18px;
    max-width: 320px;
    width: 100%;
    text-align: center;
    box-shadow: 0 24px 60px -12px rgba(0,0,0,0.35);
    animation: mcErrCardIn 0.22s cubic-bezier(.2,.9,.4,1);
  }
  @keyframes mcErrCardIn {
    from { transform: scale(0.92); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
  }
  #mcRecErr .ico { font-size: 38px; margin-bottom: 10px; line-height: 1; }
  #mcRecErr .title { font-size: 16px; font-weight: 600; color: var(--dt-ink-strong); margin-bottom: 6px; }
  #mcRecErr .sub { font-size: 13px; color: var(--dt-ink-soft); line-height: 1.55; margin-bottom: 14px; }
  #mcRecErr .detail-toggle {
    font-size: 11px; color: var(--dt-ink-mute);
    margin-bottom: 12px; cursor: pointer;
    user-select: none;
  }
  #mcRecErr .detail {
    display: none;
    font-size: 10.5px; color: var(--dt-ink-mute);
    background: #FAFAFA;
    padding: 8px 10px; border-radius: 6px;
    text-align: left; margin-bottom: 12px;
    font-family: var(--mono); word-break: break-all;
    max-height: 100px; overflow: auto;
  }
  #mcRecErr .detail.on { display: block; }
  #mcRecErr .actions { display: flex; gap: 8px; }
  #mcRecErr .btn {
    flex: 1; padding: 11px; border-radius: 8px;
    border: 0; cursor: pointer;
    font-size: 14px; font-weight: 500;
    transition: transform 0.1s ease;
  }
  #mcRecErr .btn:active { transform: scale(0.97); }
  #mcRecErr .btn.primary { background: var(--dt-blue); color: #fff; }
  #mcRecErr .btn.secondary { background: #F4F4F4; color: var(--dt-ink-soft); }

  /* ==========================================================================
     dt15 · 录音 tab 镜像三键（is-recording 时显示，让用户不用切 tab 就能完成）
     ========================================================================== */
  .mc-rec-tab-actions {
    display: none;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    padding: 8px 16px 12px;
    margin: 0;
  }
  html.is-embed-android.is-recording [data-proto-state="rec"] .mc-rec-tab-actions,
  html.is-embed-android.is-paused [data-proto-state="rec"] .mc-rec-tab-actions {
    display: grid;
  }
  .mc-rec-tab-actions .mc-rta-btn {
    background: #fff;
    border: 1px solid var(--dt-line);
    border-radius: 10px;
    padding: 10px 4px;
    display: flex; flex-direction: column;
    align-items: center; gap: 4px;
    font-size: 11px; color: var(--dt-ink);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform 0.1s ease;
  }
  .mc-rec-tab-actions .mc-rta-btn:active { transform: scale(0.96); }
  .mc-rec-tab-actions .mc-rta-btn .ico {
    width: 32px; height: 32px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
  }
  .mc-rec-tab-actions .mc-rta-btn.cancel .ico { background: #FFF1F0; color: #F5222D; }
  .mc-rec-tab-actions .mc-rta-btn.pause .ico { background: #FFF7E6; color: #FAAD14; }
  .mc-rec-tab-actions .mc-rta-btn.done .ico {
    background: #F5222D; color: #fff;
    box-shadow: 0 4px 10px -3px rgba(245,34,45,0.5);
  }
  html.is-paused .mc-rec-tab-actions .mc-rta-btn.pause .ico {
    background: #E8F1FF; color: #5b6cff;
  }

  /* dt15 · 录音中 / 暂停中，录音 tab 主按钮变成"看进度 ›"提示，
     不再让用户怀疑"按这个会停吗"
  */
  html.is-embed-android.is-recording [data-proto-state="rec"] .phone-recbtn,
  html.is-embed-android.is-paused [data-proto-state="rec"] .phone-recbtn {
    background: #DC2626 !important;
    background-image: none !important;
  }

  /* ==========================================================================
     dt15 · transcript header 语义化（钉钉风：录音中/查看中 文案不同）
     ========================================================================== */
  html.is-embed-android.is-recording [data-proto-state="transcript"] > .phone-block-h::before {
    content: "🎙️ 正在录音 · ";
  }
  html.is-embed-android.is-recording [data-proto-state="transcript"] > .phone-block-h {
    visibility: hidden;
  }
  html.is-embed-android.is-recording [data-proto-state="transcript"] > .phone-block-h::before {
    visibility: visible;
    display: inline-block;
  }
  html.is-embed-android:not(.is-recording):not(.is-paused):not(.is-stopping) [data-proto-state="transcript"] > .phone-block-h {
    color: var(--dt-ink-soft) !important;
  }

  /* dt15 · 隐私脚注（小字 mute，浮在 tab bar 上方） */
  #mcPrivacyFoot {
    position: fixed;
    bottom: calc(env(safe-area-inset-bottom, 0) + 64px);
    left: 0; right: 0;
    text-align: center;
    font-size: 10px;
    color: var(--dt-ink-mute);
    opacity: 0.6;
    pointer-events: none;
    z-index: 10;
    padding: 0 24px;
    letter-spacing: 0.02em;
  }
  /* 录音中 / 处理中 / 失败弹窗时不显示，避免压字 */
  html.is-recording #mcPrivacyFoot,
  html.is-paused #mcPrivacyFoot,
  html.is-stopping #mcPrivacyFoot {
    display: none;
  }

  /* ==========================================================================
     dt16 · 录音可视化 orb (同心圆波纹 + 呼吸核心 + AI 正在听)
     语音通用 premium pattern
     ========================================================================== */
  .mc-orb-zone {
    display: none;
    flex-direction: column;
    align-items: center;
    padding: 8px 0 12px;  /* dt20 · 字幕变主角，orb 区压缩 */
    user-select: none;
  }
  html.is-embed-android.is-recording [data-proto-state="transcript"] .mc-orb-zone {
    display: flex;
    animation: mcOrbZoneIn 0.4s cubic-bezier(.16, 1, .3, 1);
  }
  html.is-embed-android.is-paused [data-proto-state="transcript"] .mc-orb-zone {
    display: flex;
  }
  @keyframes mcOrbZoneIn {
    from { opacity: 0; transform: scale(0.92); }
    to   { opacity: 1; transform: scale(1); }
  }

  .mc-orb {
    /* dt20 · 180→112，让字幕变主角；orb 仍可识别但不抢戏 */
    width: 112px; height: 112px;
    position: relative;
    display: flex; align-items: center; justify-content: center;
  }
  .mc-orb .ring {
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(245,34,45,0.22) 0%, rgba(245,34,45,0) 70%);
    pointer-events: none;
    width: 112px; height: 112px;
  }
  .mc-orb .ring.r1 { animation: mcOrbRipple 2.6s ease-out infinite; }
  .mc-orb .ring.r2 { animation: mcOrbRipple 2.6s ease-out infinite -0.87s; }
  .mc-orb .ring.r3 { animation: mcOrbRipple 2.6s ease-out infinite -1.73s; }
  @keyframes mcOrbRipple {
    0%   { transform: scale(0.5); opacity: 0; }
    18%  { opacity: 0.85; }
    100% { transform: scale(1.25); opacity: 0; }
  }

  .mc-orb .core {
    /* dt20 · 72→46 配 112 外圈 */
    width: 46px; height: 46px;
    border-radius: 50%;
    background: linear-gradient(135deg, #FF5252 0%, #F5222D 70%, #C4170B 100%);
    box-shadow:
      0 8px 22px -6px rgba(245,34,45,0.55),
      0 1px 4px -1px rgba(245,34,45,0.35),
      inset 0 0 0 1px rgba(255,255,255,0.12);
    display: flex; align-items: center; justify-content: center;
    z-index: 2;
    position: relative;
  }
  .mc-orb .core .glow {
    width: 18px; height: 18px;
    border-radius: 50%;
    background: rgba(255,255,255,0.94);
    animation: mcOrbCoreBreath 1.7s cubic-bezier(.4,0,.6,1) infinite;
  }
  @keyframes mcOrbCoreBreath {
    0%, 100% { transform: scale(1); opacity: 1; }
    50%      { transform: scale(0.55); opacity: 0.5; }
  }

  /* 暂停态：rings 冻结、core 不呼吸、整体琥珀 */
  html.is-paused .mc-orb .ring { animation-play-state: paused !important; opacity: 0.35; }
  html.is-paused .mc-orb .core {
    background: linear-gradient(135deg, #FAAD14 0%, #D48806 100%) !important;
    box-shadow: 0 14px 36px -8px rgba(250,173,20,0.45) !important;
  }
  html.is-paused .mc-orb .core .glow { animation: none !important; opacity: 0.8; }

  /* "AI 正在听..." 状态文字 — dt20 缩进 */
  .mc-orb-status {
    margin-top: 8px;
    font-size: 12px;
    color: var(--dt-red);
    font-weight: 500;
    letter-spacing: 0.04em;
    display: flex; align-items: baseline; gap: 1px;
  }
  html.is-paused .mc-orb-status { color: var(--dt-amber); }
  .mc-orb-status .dots {
    display: inline-flex; gap: 2px; margin-left: 4px;
  }
  .mc-orb-status .dots span {
    animation: mcOrbDots 1.4s ease-in-out infinite;
    opacity: 0.2;
    font-weight: 600;
  }
  .mc-orb-status .dots span:nth-child(1) { animation-delay: 0s; }
  .mc-orb-status .dots span:nth-child(2) { animation-delay: 0.2s; }
  .mc-orb-status .dots span:nth-child(3) { animation-delay: 0.4s; }
  @keyframes mcOrbDots {
    0%, 80%, 100% { opacity: 0.2; }
    40%           { opacity: 1; }
  }
  html.is-paused .mc-orb-status .dots span { animation-play-state: paused; opacity: 0.4; }

  /* 录音中隐藏静态 waveform，由 orb 接管视觉中心 */
  html.is-embed-android.is-recording [data-proto-state="transcript"] > .phone-waveform,
  html.is-embed-android.is-paused [data-proto-state="transcript"] > .phone-waveform {
    display: none !important;
  }

  /* ========== 转写完成后逐行 reveal（假装 streaming）========== */
  html.is-embed-android [data-proto-state="transcript"] .phone-transcript .phone-line {
    animation: mcLineReveal 0.55s cubic-bezier(.16, 1, .3, 1) backwards;
  }
  @keyframes mcLineReveal {
    from { opacity: 0; transform: translateY(8px); filter: blur(2px); }
    to   { opacity: 1; transform: translateY(0); filter: blur(0); }
  }
  /* 错开延迟，第 N 行延迟 N * 120ms，最多 12 行 */
  .phone-transcript .phone-line:nth-child(1)  { animation-delay: 0.05s; }
  .phone-transcript .phone-line:nth-child(2)  { animation-delay: 0.18s; }
  .phone-transcript .phone-line:nth-child(3)  { animation-delay: 0.31s; }
  .phone-transcript .phone-line:nth-child(4)  { animation-delay: 0.44s; }
  .phone-transcript .phone-line:nth-child(5)  { animation-delay: 0.57s; }
  .phone-transcript .phone-line:nth-child(6)  { animation-delay: 0.70s; }
  .phone-transcript .phone-line:nth-child(7)  { animation-delay: 0.83s; }
  .phone-transcript .phone-line:nth-child(8)  { animation-delay: 0.96s; }
  .phone-transcript .phone-line:nth-child(9)  { animation-delay: 1.09s; }
  .phone-transcript .phone-line:nth-child(10) { animation-delay: 1.22s; }
  .phone-transcript .phone-line:nth-child(11) { animation-delay: 1.35s; }
  .phone-transcript .phone-line:nth-child(12) { animation-delay: 1.48s; }

  /* ==========================================================================
     dt22 · 录音按钮 · 钉钉风 pill primary action
     · 220px min-width 红色 pill (radius 28) + 56px 高 + 白色文字 "● 开始录音"
     · 钉钉红 #FF4D4F + 单层柔 shadow + 点下变深
     · 录音中：背景稍深 + 6px 脉冲 ring（呼吸但不刺眼）
     · 暂停：整 pill 变琥珀
     ========================================================================== */
  html.is-embed-android .phone-recbtn {
    width: auto !important;
    min-width: 220px !important;
    max-width: 80% !important;
    height: 56px !important;
    margin: 28px auto 16px !important;
    padding: 0 32px !important;
    position: relative !important;

    background: #FF4D4F !important;
    background-image: none !important;

    border: 0 !important;
    border-radius: 28px !important;

    box-shadow:
      0 8px 22px -5px rgba(255, 77, 79, 0.45),
      0 2px 4px rgba(0, 0, 0, 0.06) !important;

    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    letter-spacing: 0.05em !important;
    line-height: 1 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    transition:
      transform 0.18s cubic-bezier(.4,0,.2,1),
      background-color 0.18s ease,
      box-shadow 0.25s cubic-bezier(.4,0,.2,1) !important;
  }

  /* 杀掉 <br> tag，让 "● 开始<br/>录音" 变 "● 开始录音" 单行 */
  html.is-embed-android .phone-recbtn br {
    display: none !important;
  }

  /* 杀掉 dt19/dt21 遗留 pseudo */
  html.is-embed-android .phone-recbtn::before {
    display: none !important;
    content: none !important;
    animation: none !important;
  }
  html.is-embed-android .phone-recbtn::after {
    display: none !important;
    content: none !important;
    animation: none !important;
  }

  html.is-embed-android .phone-recbtn:active {
    transform: scale(0.97) !important;
    background: #E33335 !important;
    box-shadow:
      0 3px 10px -2px rgba(255, 77, 79, 0.32),
      0 1px 2px rgba(0, 0, 0, 0.06) !important;
  }

  /* —— 录音中：颜色稍深 + 6px 脉冲 ring（钉钉式 active 反馈）—— */
  html.is-embed-android.is-recording .phone-recbtn {
    background: #E33335 !important;
    animation: dtPillRec 1.8s ease-in-out infinite !important;
  }
  @keyframes dtPillRec {
    0%, 100% {
      box-shadow:
        0 0 0 0px rgba(255, 77, 79, 0.22),
        0 4px 14px -3px rgba(255, 77, 79, 0.38);
    }
    50% {
      box-shadow:
        0 0 0 8px rgba(255, 77, 79, 0.18),
        0 4px 14px -3px rgba(255, 77, 79, 0.38);
    }
  }

  /* —— 暂停：琥珀 pill，无脉冲 —— */
  html.is-embed-android.is-paused .phone-recbtn {
    background: #FAAD14 !important;
    animation: none !important;
    box-shadow:
      0 6px 18px -5px rgba(250, 173, 20, 0.4),
      0 2px 4px rgba(0, 0, 0, 0.06) !important;
  }

  /* ==========================================================================
     dt24 · 交互逻辑梳理：等待 ETA / tab 自由 / Apple 极简
     ========================================================================== */

  /* —— A. 解锁 dt14 tab lock：录音中所有 tab 可访问 —— */
  html.is-embed-android.is-recording .phone-bottombar [data-proto-go="summary"],
  html.is-embed-android.is-recording .phone-bottombar [data-proto-go="agent"],
  html.is-embed-android.is-recording .phone-bottombar [data-proto-go="memory"],
  html.is-embed-android.is-stopping .phone-bottombar [data-proto-go="summary"],
  html.is-embed-android.is-stopping .phone-bottombar [data-proto-go="agent"],
  html.is-embed-android.is-stopping .phone-bottombar [data-proto-go="memory"] {
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* —— B. 等待 ETA 进度条（处理中 / 流式连接 / 加载 都用同一个 component）—— */
  #mcProcEta {
    position: fixed;
    top: calc(env(safe-area-inset-top, 0) + 44px);
    left: 14px; right: 14px;
    z-index: 9996;
    display: none;
    pointer-events: none;
    transition: opacity 0.3s ease;
  }
  html.is-stopping #mcProcEta { display: block; }
  #mcProcEta .bar {
    height: 3px;
    background: rgba(0,0,0,0.06);
    border-radius: 2px;
    overflow: hidden;
  }
  #mcProcEta .bar .fill {
    height: 100%;
    background: linear-gradient(90deg, #FAAD14 0%, #FFC53D 100%);
    border-radius: 2px;
    width: 0%;
    transition: width 0.4s cubic-bezier(.4,0,.2,1);
  }
  #mcProcEta.is-done .fill { background: linear-gradient(90deg, #52C41A 0%, #73D13D 100%); }
  #mcProcEta.is-fail .fill { background: linear-gradient(90deg, #CF1322 0%, #FF4D4F 100%); }
  #mcProcEta .label {
    font-size: 10px;
    color: var(--dt-ink-mute);
    margin-top: 4px;
    text-align: center;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
  }

  /* —— C. Apple 极简：topbar paper + 砍副标 + 录音按钮回 76px 实心红圆 —— */

  /* topbar */
  html.is-embed-android .phone-topbar {
    background: #FAFAF8 !important;
    background-image: none !important;
    border-bottom: 1px solid #ECEEF1 !important;
    padding: calc(env(safe-area-inset-top, 0) + 14px) 18px 13px !important;
    box-shadow: none !important;
  }
  html.is-embed-android .phone-topbar .title {
    color: #1D1D1F !important;  /* Apple ink */
    font-size: 19px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    margin-bottom: 0 !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", system-ui, sans-serif !important;
  }
  html.is-embed-android .phone-topbar .sub { display: none !important; }

  /* 整体 paper 暖色背景 */
  html.is-embed-android body,
  html.is-embed-android .phone-frame,
  html.is-embed-android .phone-screen {
    background: #FAFAF8 !important;
  }

  /* version badge 收到几乎隐形 */
  html.is-embed-android #mnemo-version-badge {
    background: transparent !important;
    color: #8E8E93 !important;
    opacity: 0.35 !important;
    font-size: 9px !important;
    padding: 0 !important;
    z-index: 100 !important;
  }

  /* —— dt30 录音按钮 v8 · 112px + 白色 mic glyph + 6px halo + 三层 shadow —— */
  html.is-embed-android .phone-recbtn {
    width: 112px !important;
    height: 112px !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 30px auto 14px !important;
    position: relative !important;

    background: #FF3B30 !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 50% !important;

    box-shadow:
      0 0 0 6px rgba(255, 59, 48, 0.10),
      0 12px 30px -6px rgba(255, 59, 48, 0.42),
      0 2px 4px rgba(0, 0, 0, 0.08) !important;

    color: transparent !important;
    font-size: 0 !important;

    display: block !important;
    transition:
      transform 0.22s cubic-bezier(.4, 0, .2, 1),
      background-color 0.18s ease,
      border 0.22s cubic-bezier(.4, 0, .2, 1),
      box-shadow 0.25s ease !important;
    animation: none !important;
  }
  html.is-embed-android .phone-recbtn br { display: none !important; }
  html.is-embed-android .phone-recbtn::before {
    display: none !important; content: none !important; animation: none !important;
  }
  /* —— 中央白色 mic glyph （原创 SVG，capsule body + arc stand + post + base）—— */
  html.is-embed-android .phone-recbtn::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top:0 !important;right:0 !important;bottom:0 !important;left:0 !important;
    margin: auto !important;
    width: 40px !important;
    height: 52px !important;
    background:
      url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 52' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'><rect x='14' y='4' width='12' height='22' rx='6' fill='white' stroke='none'/><path d='M7 23 a13 13 0 0 0 26 0'/><path d='M20 36 v10'/><path d='M14 48 h12'/></svg>")
      no-repeat center / contain !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    animation: none !important;
  }

  /* —— 状态标 label 升级 14px medium —— */
  html.is-embed-android .phone-rec-label {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #1D1D1F !important;
    margin: 0 auto 18px !important;
    text-align: center !important;
  }
  html.is-embed-android .phone-recbtn:active {
    transform: scale(0.95) !important;
    background: #E0302A !important;
    box-shadow:
      0 2px 8px -2px rgba(255, 59, 48, 0.28),
      0 1px 2px rgba(0, 0, 0, 0.06) !important;
  }

  /* —— 录音中：Apple morph ⬤ → ◯◾（红环 + 内嵌红圆角方块）—— */
  html.is-embed-android.is-recording .phone-recbtn {
    background: transparent !important;
    border: 3px solid #FF3B30 !important;
    box-shadow: none !important;
    animation: none !important;
  }
  html.is-embed-android.is-recording .phone-recbtn::after {
    display: block !important;
    content: '' !important;
    position: absolute !important;
    top:28px !important;right:28px !important;bottom:28px !important;left:28px !important;
    margin: 0 !important;
    width: auto !important;
    height: auto !important;
    background: #FF3B30 !important;
    background-image: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    animation: none !important;
  }

  /* —— 暂停：环 + 方块都变琥珀 —— */
  html.is-embed-android.is-paused .phone-recbtn {
    background: transparent !important;
    border: 3px solid #FAAD14 !important;
    box-shadow: none !important;
    animation: none !important;
  }
  html.is-embed-android.is-paused .phone-recbtn::after {
    display: block !important;
    content: '' !important;
    position: absolute !important;
    top:14px !important;right:14px !important;bottom:14px !important;left:14px !important;
    margin: 0 !important;
    width: auto !important;
    height: auto !important;
    background: #FAAD14 !important;
    background-image: none !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    animation: none !important;
  }

  /* —— Apple 极简：卡片白底极淡边，无阴影 —— */
  html.is-embed-android .phone-rec-item {
    background: #FFFFFF !important;
    border: 1px solid #E5E5EA !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    box-shadow: none !important;
  }
  html.is-embed-android .phone-rec-item:active {
    background: #F5F5F7 !important;
    transform: scale(0.995) !important;
  }
  html.is-embed-android .phone-rec-item .title {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #1D1D1F !important;
    margin-bottom: 4px !important;
  }
  html.is-embed-android .phone-rec-item .meta {
    font-size: 12px !important;
    color: #8E8E93 !important;
  }

  /* ==========================================================================
     dt26 · 等待全覆盖 + 后台 ready 通知 + 底 tab Apple 化
     ========================================================================== */

  /* —— 通用顶部加载条 mcLoader（用于 list / detail / memory / search 所有 wait）—— */
  #mcLoader {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 9995;
    display: none;
    pointer-events: none;
    padding: 0;
    transition: opacity 0.3s ease;
  }
  #mcLoader.on { display: block; }
  #mcLoader .lbar {
    height: 2.5px;
    background: rgba(91, 108, 255,0.10);
    overflow: hidden;
    position: relative;
  }
  #mcLoader .lbar .lfill {
    position: absolute;
    top: 0; bottom: 0; left: 0;
    width: 30%;
    background: linear-gradient(90deg, transparent, #007AFF 50%, transparent);
    animation: mcLoaderShim 1.1s cubic-bezier(.4,0,.2,1) infinite;
  }
  @keyframes mcLoaderShim {
    0%   { left: -30%; }
    100% { left: 100%; }
  }
  #mcLoader.is-eta .lbar .lfill {
    background: #007AFF;
    animation: none;
    transition: width 0.4s cubic-bezier(.4,0,.2,1);
  }
  /* 改成右上小胶囊气泡 — 避免遮挡 phone-topbar 标题（dt26 原版白底遮罩在
     embed 模式下盖住 "工作记忆" 这类标题，与 tier badge 视觉冲突） */
  #mcLoader .lcap {
    position: fixed;
    top: calc(env(safe-area-inset-top, 0) + 14px);
    left: 50%;
    transform: translateX(-50%) translateY(-4px);
    max-width: calc(100vw - 220px);
    padding: 5px 12px 6px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    color: #ffd966;
    background: rgba(20,22,38,0.78);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255,215,102,0.25);
    box-shadow: 0 6px 18px rgba(0,0,0,0.18);
    font-variant-numeric: tabular-nums;
    pointer-events: none;
    z-index: 9996;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 0;
    transform: translateY(-4px);
    transition: opacity 0.18s ease, transform 0.18s ease;
  }
  #mcLoader.with-cap .lcap {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
  #mcLoader:not(.with-cap) .lcap { display: none; }

  /* —— Apple 底 tab bar：frosted + 系统色 + 极简 —— */
  html.is-embed-android .phone-bottombar {
    background: rgba(250, 250, 248, 0.85) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-top: 1px solid rgba(60, 60, 67, 0.12) !important;
    box-shadow: none !important;
    padding-bottom: calc(env(safe-area-inset-bottom, 0) + 4px) !important;
  }
  html.is-embed-android .phone-bottombar button {
    background: transparent !important;
    border: 0 !important;
    color: #8E8E93 !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    padding: 8px 4px 4px !important;
    transition: color 0.18s ease !important;
  }
  html.is-embed-android .phone-bottombar button .ico {
    font-size: 18px !important;
    filter: grayscale(1) !important;
    opacity: 0.85 !important;
    margin-bottom: 2px !important;
  }
  html.is-embed-android .phone-bottombar button.active,
  html.is-embed-android .phone-bottombar button[data-active="true"] {
    color: #007AFF !important;
    font-weight: 600 !important;
  }
  html.is-embed-android .phone-bottombar button.active .ico,
  html.is-embed-android .phone-bottombar button[data-active="true"] .ico {
    filter: none !important;
    opacity: 1 !important;
  }

  /* —— "新纪要 ready" 浮 toast (用户在别 tab 时处理完成) —— */
  #mcReadyToast {
    position: fixed;
    left: 14px; right: 14px;
    bottom: calc(env(safe-area-inset-bottom, 0) + 78px);
    z-index: 9994;
    background: rgba(0, 122, 255, 0.96);
    backdrop-filter: blur(12px);
    color: #fff;
    padding: 14px 16px;
    border-radius: 14px;
    font-size: 14px;
    font-weight: 500;
    box-shadow: 0 12px 32px -8px rgba(0, 122, 255, 0.4);
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    animation: mcReadyIn 0.4s cubic-bezier(.16,1,.3,1);
  }
  #mcReadyToast.on { display: flex; }
  @keyframes mcReadyIn {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  #mcReadyToast .chev {
    font-size: 18px;
    opacity: 0.85;
  }
  #mcReadyToast .close-x {
    position: absolute;
    top: 4px; right: 8px;
    color: rgba(255,255,255,0.55);
    font-size: 14px;
    pointer-events: auto;
  }

  /* ==========================================================================
     dt29 · 纪要详情页 Apple 极简下沉
     · 全部用 SF 系统色板：label #1D1D1F / secondary #6E6E73 / tertiary #8E8E93 /
       separator rgba(60,60,67,0.12) / systemBlue #007AFF
     · 卡片：白底 + hairline border (#E5E5EA) + 12px radius，无 shadow
     · 字体：-apple-system, SF Pro Display/Text
     · 砍掉钉钉风的色彩装饰 / mono 字体 / 编号徽章
     ========================================================================== */

  /* 段标 mc-sm-section-h（原带 ##01 红徽章） */
  html.is-embed-android .mc-sm-section { margin-bottom: 18px !important; }
  html.is-embed-android .mc-sm-section-h {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #1D1D1F !important;
    letter-spacing: 0 !important;
    padding: 0 4px 8px !important;
    border-bottom: 0 !important;
    text-transform: none !important;
    font-family: -apple-system, "SF Pro Display", "PingFang SC", system-ui, sans-serif !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
  }
  html.is-embed-android .mc-sm-section-num {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #8E8E93 !important;
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    font-family: -apple-system, system-ui, sans-serif !important;
  }
  html.is-embed-android .mc-sm-sub-h {
    font-size: 11px !important;
    color: #8E8E93 !important;
    font-weight: 500 !important;
    margin: 8px 4px 4px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
  }

  /* HERO */
  html.is-embed-android .mc-sm-hero {
    padding: 16px 4px 14px !important;
    border-bottom: 1px solid rgba(60,60,67,0.12) !important;
    margin-bottom: 14px !important;
  }
  html.is-embed-android .mc-sm-hero-eyebrow {
    font-size: 11px !important;
    color: #8E8E93 !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    font-family: -apple-system, system-ui, sans-serif !important;
    margin-bottom: 6px !important;
  }
  html.is-embed-android .mc-sm-hero-title {
    font-family: -apple-system, "SF Pro Display", "PingFang SC", system-ui, sans-serif !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1D1D1F !important;
    letter-spacing: -0.015em !important;
    line-height: 1.22 !important;
    margin: 2px 0 12px !important;
  }
  /* hero 内的 mc-rec-btn (置顶/编辑/导出) → iOS 风浅灰胶囊 */
  html.is-embed-android .mc-sm-hero .mc-rec-actions {
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  html.is-embed-android .mc-sm-hero .mc-rec-btn {
    background: rgba(120,120,128,0.12) !important;
    color: #1D1D1F !important;
    border: 0 !important;
    border-radius: 14px !important;
    padding: 6px 12px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
  }
  html.is-embed-android .mc-sm-hero .mc-rec-pin.is-pinned {
    background: rgba(0,122,255,0.12) !important;
    color: #007AFF !important;
  }

  /* AI 摘要卡 */
  html.is-embed-android .mc-ai-summary {
    background: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid #E5E5EA !important;
    border-radius: 12px !important;
    padding: 14px 16px 14px 46px !important;
    position: relative !important;
  }
  html.is-embed-android .mc-ai-badge {
    background: #007AFF !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    padding: 3px 6px !important;
    position: absolute !important;
    left: 14px !important;
    top: 14px !important;
    letter-spacing: 0.04em !important;
  }
  html.is-embed-android .mc-ai-summary-body {
    font-size: 14px !important;
    line-height: 1.55 !important;
    color: #1D1D1F !important;
    font-family: -apple-system, "SF Pro Text", "PingFang SC", system-ui, sans-serif !important;
  }

  /* 决策引言墙 mc-quote-wall */
  html.is-embed-android .mc-quote-wall { gap: 8px !important; }
  html.is-embed-android .mc-quote-card {
    background: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid #E5E5EA !important;
    border-left: 0 !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    box-shadow: none !important;
    position: relative !important;
  }
  html.is-embed-android .mc-quote-mark {
    color: rgba(0,122,255,0.25) !important;
    font-size: 36px !important;
    line-height: 1 !important;
    font-weight: 600 !important;
    font-family: -apple-system, Georgia, serif !important;
    position: absolute !important;
    top: 4px; left: 10px !important;
    pointer-events: none;
  }
  html.is-embed-android .mc-quote-body {
    font-size: 14px !important;
    color: #1D1D1F !important;
    line-height: 1.5 !important;
    padding-left: 28px !important;
    font-weight: 500 !important;
  }
  html.is-embed-android .mc-quote-tag {
    font-size: 10px !important;
    color: #8E8E93 !important;
    font-family: -apple-system, system-ui, sans-serif !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin-top: 6px !important;
    padding-left: 28px !important;
  }

  /* Kanban 三列 */
  html.is-embed-android .mc-kanban { gap: 8px !important; }
  html.is-embed-android .mc-kanban-col {
    background: #FFFFFF !important;
    border: 1px solid #E5E5EA !important;
    border-top: 1px solid #E5E5EA !important;
    border-radius: 12px !important;
    padding: 10px 8px !important;
    box-shadow: none !important;
  }
  html.is-embed-android .mc-kanban-h {
    border-bottom: 0 !important;
    padding: 0 2px 6px !important;
    margin-bottom: 4px !important;
  }
  html.is-embed-android .mc-kanban-lvl {
    font-family: -apple-system, system-ui, sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    color: #fff !important;
    padding: 2px 5px !important;
    border-radius: 4px !important;
    letter-spacing: 0.03em !important;
  }
  html.is-embed-android .mc-kanban-name {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #1D1D1F !important;
  }
  html.is-embed-android .mc-kanban-count {
    font-family: -apple-system, system-ui, sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
  }
  html.is-embed-android .mc-kanban-card {
    background: #F5F5F7 !important;
    border-left: 0 !important;
    border-radius: 8px !important;
    padding: 7px 9px !important;
    box-shadow: none !important;
  }
  html.is-embed-android .mc-kanban-card-title {
    font-size: 12px !important;
    color: #1D1D1F !important;
    font-weight: 500 !important;
  }
  html.is-embed-android .mc-kanban-card-meta {
    font-size: 10px !important;
    color: #8E8E93 !important;
    font-family: -apple-system, system-ui, sans-serif !important;
  }
  html.is-embed-android .mc-kanban-empty {
    font-size: 10.5px !important;
    color: #8E8E93 !important;
  }

  /* 参会人 People row */
  html.is-embed-android .mc-people-row {
    gap: 8px !important;
    padding: 6px 0 !important;
  }
  html.is-embed-android .mc-person-pill {
    background: #FFFFFF !important;
    border: 1px solid #E5E5EA !important;
    border-radius: 14px !important;
    padding: 4px 10px 4px 4px !important;
    box-shadow: none !important;
    gap: 6px !important;
  }
  html.is-embed-android .mc-person-av {
    width: 22px !important; height: 22px !important;
    border-radius: 50% !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #fff !important;
  }
  html.is-embed-android .mc-person-name {
    font-size: 12px !important;
    color: #1D1D1F !important;
    font-weight: 500 !important;
  }

  /* 话题词云 */
  html.is-embed-android .mc-topic-cloud {
    gap: 6px !important;
    padding: 4px 0 !important;
  }
  html.is-embed-android .mc-topic-bubble {
    background: rgba(120,120,128,0.10) !important;
    color: #1D1D1F !important;
    border: 0 !important;
    border-radius: 12px !important;
    padding: 4px 10px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
  }

  /* 关联录音卡 */
  html.is-embed-android .mc-rel-card {
    background: #FFFFFF !important;
    border: 1px solid #E5E5EA !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    gap: 12px !important;
    box-shadow: none !important;
  }
  html.is-embed-android .mc-rel-card:hover { background: #F5F5F7 !important; border-color: #E5E5EA !important; }
  html.is-embed-android .mc-rel-score {
    background: rgba(0,122,255,0.12) !important;
    color: #007AFF !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    font-family: -apple-system, system-ui, sans-serif !important;
  }
  html.is-embed-android .mc-rel-title {
    font-size: 13px !important;
    color: #1D1D1F !important;
    font-weight: 500 !important;
  }
  html.is-embed-android .mc-rel-note {
    font-size: 11px !important;
    color: #8E8E93 !important;
  }
  html.is-embed-android .mc-rel-arrow {
    color: #C7C7CC !important;
    font-size: 18px !important;
  }

  /* 我的备注 textarea */
  html.is-embed-android .mc-anno-area {
    background: #FFFFFF !important;
    border: 1px solid #E5E5EA !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
    color: #1D1D1F !important;
    font-family: -apple-system, "SF Pro Text", system-ui, sans-serif !important;
    min-height: 80px !important;
  }
  html.is-embed-android .mc-anno-area:focus {
    outline: 0 !important;
    border-color: #007AFF !important;
  }
  html.is-embed-android .mc-anno-actions .mc-btn {
    background: #007AFF !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 10px !important;
    padding: 9px 18px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
  }

  /* 音频回放卡 */
  html.is-embed-android .mc-audio-wrap {
    background: #FFFFFF !important;
    border: 1px solid #E5E5EA !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    margin: 8px 0 12px !important;
    gap: 6px !important;
  }
  html.is-embed-android .mc-audio-wrap audio {
    width: 100% !important;
    height: 36px !important;
  }
  html.is-embed-android .mc-audio-lab {
    font-size: 11px !important;
    color: #8E8E93 !important;
  }

  /* 思维导图框 */
  html.is-embed-android .mc-mindmap-wrap {
    background: #FFFFFF !important;
    border: 1px solid #E5E5EA !important;
    border-radius: 12px !important;
    padding: 12px !important;
  }

  /* —— 杀 transcript tab 的静态 waveform 蓝条 ——
     原 dt6 设计是录音中显示，但已停止 / 看历史时它仍占 44px 高，给"麦还在听"的错觉。
     现在改成：任何时候 transcript tab 都不显示 .phone-waveform，
     录音中由 dt16 orb 接管视觉。
  */
  html.is-embed-android [data-proto-state="transcript"] > .phone-waveform {
    display: none !important;
  }

  /* ==========================================================================
     dt18 · 流式 ASR 实时文本浮现
     orb 下方挂一块"边说边出字"区，partial 暗、final 实
     ========================================================================== */
  #mcStreamText {
    /* dt20 · 字幕变主角：大字、大区、独占视觉中心 */
    margin: 14px 14px 0;
    padding: 22px 22px 24px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid var(--dt-line);
    border-radius: 18px;
    font-size: 22px;            /* 15→22 原文主字号 */
    line-height: 1.5;
    color: var(--dt-ink-strong);
    text-align: left;
    min-height: 240px;          /* 24→240 默认就是大区 */
    max-height: 56vh;           /* 240px→视口 56%，跟屏长 */
    overflow-y: auto;
    backdrop-filter: blur(8px);
    box-shadow: 0 6px 22px -10px rgba(0,0,0,0.08);
    display: none;
    font-weight: 500;
    letter-spacing: 0.005em;
    -webkit-overflow-scrolling: touch;
  }
  html.is-embed-android.is-recording #mcStreamText,
  html.is-embed-android.is-paused #mcStreamText {
    display: block;
    animation: mcStreamIn 0.3s cubic-bezier(.16,1,.3,1);
  }
  @keyframes mcStreamIn {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  #mcStreamText .final {
    color: var(--dt-ink-strong);
    font-weight: 500;
  }
  #mcStreamText .partial {
    color: var(--dt-ink-mute);
    font-weight: 400;
    animation: mcStreamCursor 1s ease-in-out infinite;
  }
  @keyframes mcStreamCursor {
    0%, 100% { opacity: 0.55; }
    50%      { opacity: 1; }
  }
  /* 开始未收到字的时候，占位提示 — dt20 字号统一 */
  #mcStreamText .mc-stream-src:empty::before {
    content: "正在连接 AI 听写…";
    display: block;
    color: var(--dt-ink-mute);
    font-size: 15px;
    font-weight: 400;
    text-align: center;
    padding: 36px 0;
    letter-spacing: 0.02em;
  }
  #mcStreamText .mc-stream-src:empty {
    display: block;   /* override 之前 empty 隐藏，让 ::before 能渲染占位 */
  }
  /* dt18-bi · 双语字幕：原文 / 译文两行（无 dashed border 视觉更干净） */
  #mcStreamText .mc-stream-src,
  #mcStreamText .mc-stream-trg {
    display: block;
  }
  #mcStreamText .mc-stream-src:empty,
  #mcStreamText .mc-stream-trg:empty {
    display: none;
  }
  #mcStreamText .mc-stream-src {
    font-size: 22px;
    line-height: 1.5;
  }
  #mcStreamText .mc-stream-trg {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid rgba(160, 50, 50, 0.10);
    font-size: 19px;          /* 14→19 译文也变大 */
    color: rgba(120, 30, 30, 0.82);
    line-height: 1.5;
  }
  #mcStreamText .mc-stream-trg .final {
    color: rgba(110, 30, 30, 0.92);
    font-weight: 500;
  }
  #mcStreamText .mc-stream-trg .partial {
    color: rgba(140, 60, 60, 0.7);
    font-weight: 400;
    animation: mcStreamCursor 1s ease-in-out infinite;
  }
  /* dt18-bi · 语言选择 chip（挂在 orb 下方，跟 status 同风格） */
  .mc-orb-lang {
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px 10px;
    font-size: 12px;
    color: var(--dt-ink-mute);
  }
  .mc-orb-lang .mc-orb-lang-group {
    display: inline-flex;
    align-items: center;
    gap: 5px;
  }
  .mc-orb-lang .lab {
    opacity: 0.7;
  }
  .mc-orb-lang select {
    appearance: none;
    -webkit-appearance: none;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(160, 50, 50, 0.22);
    border-radius: 999px;
    padding: 3px 22px 3px 10px;
    font-size: 12px;
    color: var(--dt-ink-strong);
    font-family: inherit;
    cursor: pointer;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M2 4l3 3 3-3' stroke='%23943' stroke-width='1.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat: no-repeat;
    background-position: right 6px center;
    max-width: 110px;
  }
  .mc-orb-lang select:focus {
    outline: none;
    border-color: rgba(160, 50, 50, 0.5);
  }
  /* dt19 · 纪要详情页：多语言切换 chip（挂 .mc-sm-hero 内） */
  .mc-detail-lang {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    font-size: 12px;
    color: var(--dt-ink-mute);
  }
  .mc-detail-lang .lab { opacity: 0.75; }
  .mc-detail-lang select {
    appearance: none;
    -webkit-appearance: none;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(160, 50, 50, 0.22);
    border-radius: 999px;
    padding: 4px 24px 4px 12px;
    font-size: 12px;
    font-family: inherit;
    color: var(--dt-ink-strong);
    cursor: pointer;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M2 4l3 3 3-3' stroke='%23943' stroke-width='1.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat: no-repeat;
    background-position: right 8px center;
  }
  .mc-detail-lang select:focus {
    outline: none;
    border-color: rgba(160, 50, 50, 0.5);
  }
  .mc-detail-lang.is-loading select {
    opacity: 0.55;
    pointer-events: none;
  }
  .mc-detail-lang.is-loading::after {
    content: '翻译中…';
    font-size: 11px;
    color: rgba(196, 132, 58, 0.9);
    margin-left: 4px;
    animation: mcStreamCursor 1s ease-in-out infinite;
  }

  /* ==========================================================================
     v0.5 dt13 · 录音中 transcript placeholder
     ========================================================================== */

  /* —— 录音中：transcript 区不再显示历史 / demo 数据，改"正在录音中"占位 —— */
  html.is-embed-android.is-recording [data-proto-state="transcript"] .phone-transcript {
    position: relative;
    min-height: 220px;
    padding: 30px 24px 24px !important;
    background: transparent !important;
    border: 0 !important;
  }
  /* 🔴 排除 #mcStreamText(实时转写文字卡)——原生壳同样别把实时转写主角隐掉(与 web 端同根因) */
  html.is-embed-android.is-recording [data-proto-state="transcript"] .phone-transcript > *:not(#mcStreamText) {
    display: none !important;
  }
  html.is-embed-android.is-recording [data-proto-state="transcript"] .phone-transcript::before {
    content: "🎙️  正在录音中";
    display: block;
    text-align: center;
    font-size: 15px;
    color: var(--dt-ink-soft);
    font-weight: 500;
    margin-top: 24px;
    letter-spacing: 0.02em;
  }
  html.is-embed-android.is-recording [data-proto-state="transcript"] .phone-transcript::after {
    content: "完成后 AI 自动转写、抽决策、生成纪要";
    display: block;
    text-align: center;
    font-size: 12px;
    color: var(--dt-ink-mute);
    margin-top: 8px;
    letter-spacing: 0;
  }
  html.is-embed-android.is-paused [data-proto-state="transcript"] .phone-transcript::before {
    content: "⏸  已暂停";
  }

  /* —— badge z-index 下沉，sticky 条录音时把它盖住 —— */
  html.is-embed-android #mnemo-version-badge {
    z-index: 100 !important;
  }

  /* —— 转写视图标题 + 大 timer 同步 calm 化 —— */
  html.is-embed-android [data-proto-state="transcript"] > .phone-block-h {
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 0.04em !important;
    color: var(--dt-red) !important;
    padding: 12px 18px 4px !important;
    margin: 0 !important;
    text-transform: none !important;
  }
  html.is-embed-android.is-recording [data-proto-state="transcript"] .phone-rectimer {
    font-size: 36px !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    font-variant-numeric: tabular-nums !important;
    font-family: var(--mono) !important;
    color: var(--dt-red) !important;
    margin: 6px 0 14px !important;
  }
  html.is-embed-android [data-proto-state="transcript"] .phone-waveform {
    background: transparent !important;
    padding: 0 24px !important;
    margin: 4px 0 !important;
  }

  /* —— v0.5 dt12 · 按钮下方状态标，永远告诉用户按这个会发生什么 —— */
  html.is-embed-android .phone-rec-label {
    text-align: center;
    font-size: 12px;
    line-height: 1.4;
    color: var(--dt-ink-mute);
    margin: -4px auto 10px;
    padding: 0 24px;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
    min-height: 1.4em;
    transition: color 0.2s ease;
  }
  html.is-embed-android.is-recording .phone-rec-label {
    color: var(--dt-red);
    font-weight: 500;
  }
  html.is-embed-android.is-paused .phone-rec-label {
    color: var(--dt-amber);
    font-weight: 500;
  }

  /* ==========================================================================
     dt31 · DingTalk 录音卡片风 主录音按钮 v9 · 终态清洗
     · 用高特异性 selector + !important，一次性盖掉历史 8 套叠加规则
     · 锁定 88dp 圆形（aspect-ratio 兜底），≤340px 窄屏自动缩到 76dp
     · idle: 红实心圆 + 白色 mic glyph
     · recording: 白底红环 + 内嵌红圆角方块（停止 affordance），呼吸 pulse
     · paused: 同形状但琥珀色
     ========================================================================== */

  html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-recbtn {
    -webkit-appearance: none !important;
    appearance: none !important;

    /* 几何 · 锁死圆形对抗 flex parent 拉伸 */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    flex: 0 0 auto !important;
    width: 88px !important;
    height: 88px !important;
    min-width: 88px !important;
    min-height: 88px !important;
    max-width: 88px !important;
    max-height: 88px !important;
    aspect-ratio: 1 / 1 !important;
    padding: 0 !important;
    margin: 26px auto 12px !important;
    position: relative !important;
    box-sizing: border-box !important;

    /* 视觉 · 钉钉 #F53F3F + 三层 shadow + soft halo */
    background: #F53F3F !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow:
      0 0 0 6px rgba(245, 63, 63, 0.10),
      0 10px 26px -6px rgba(245, 63, 63, 0.45),
      0 2px 4px rgba(0, 0, 0, 0.06) !important;

    /* 抹掉 JS 写入的 "● 开始<br/>录音" 文字 · glyph 走 ::before */
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-indent: -9999px !important;

    cursor: pointer !important;
    user-select: none !important;
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;

    transition: transform 0.18s cubic-bezier(.4, 0, .2, 1),
                background-color 0.18s ease,
                box-shadow 0.25s ease,
                border-color 0.2s ease !important;
    animation: none !important;
  }

  /* 中央 mic glyph · 用 ::before + flex 居中，不依赖 absolute 定位（更稳） */
  html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-recbtn::before {
    content: '' !important;
    display: block !important;
    position: static !important;
    width: 36px !important;
    height: 46px !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background:
      url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 46' fill='none'%3E%3Crect x='12' y='3' width='12' height='22' rx='6' fill='%23ffffff'/%3E%3Cpath d='M6 21 a12 12 0 0 0 24 0' stroke='%23ffffff' stroke-width='2.8' stroke-linecap='round' fill='none'/%3E%3Cline x1='18' y1='33' x2='18' y2='42' stroke='%23ffffff' stroke-width='2.8' stroke-linecap='round'/%3E%3Cline x1='11' y1='43' x2='25' y2='43' stroke='%23ffffff' stroke-width='2.8' stroke-linecap='round'/%3E%3C/svg%3E")
      no-repeat center / contain !important;
    box-shadow: none !important;
    animation: none !important;
    opacity: 1 !important;
    transition: width 0.2s ease, height 0.2s ease, border-radius 0.2s ease, background 0.2s ease !important;
  }

  /* 清掉历史 ::after 残留 */
  html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-recbtn::after {
    display: none !important;
    content: none !important;
    background: none !important;
    border: 0 !important;
    width: 0 !important;
    height: 0 !important;
    animation: none !important;
  }

  /* 按下回弹 */
  html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-recbtn:active {
    transform: scale(0.94) !important;
    background: #DC2D2D !important;
    box-shadow:
      0 0 0 4px rgba(245, 63, 63, 0.16),
      0 4px 12px -4px rgba(245, 63, 63, 0.4),
      0 1px 2px rgba(0, 0, 0, 0.06) !important;
  }

  /* —— 录音中：白底红环 + 内嵌红圆角方块（钉钉式停止 affordance）+ 呼吸 pulse —— */
  html.is-embed-android.is-recording .phone-view[data-proto-state="rec"] > .phone-recbtn {
    background: #FFFFFF !important;
    border: 3px solid #F53F3F !important;
    box-shadow:
      0 0 0 8px rgba(245, 63, 63, 0.10),
      0 8px 20px -6px rgba(245, 63, 63, 0.32) !important;
    animation: dt31RecPulse 1.6s ease-in-out infinite !important;
  }
  html.is-embed-android.is-recording .phone-view[data-proto-state="rec"] > .phone-recbtn::before {
    width: 28px !important;
    height: 28px !important;
    background: #F53F3F !important;
    background-image: none !important;
    border-radius: 7px !important;
  }
  @keyframes dt31RecPulse {
    0%, 100% { box-shadow:
                 0 0 0 0 rgba(245, 63, 63, 0.22),
                 0 8px 20px -6px rgba(245, 63, 63, 0.32); }
    50%      { box-shadow:
                 0 0 0 12px rgba(245, 63, 63, 0),
                 0 8px 20px -6px rgba(245, 63, 63, 0.32); }
  }

  /* —— 暂停：琥珀环 + 琥珀方块（无 pulse）—— */
  html.is-embed-android.is-paused .phone-view[data-proto-state="rec"] > .phone-recbtn {
    background: #FFFFFF !important;
    border: 3px solid #FAAD14 !important;
    box-shadow:
      0 0 0 8px rgba(250, 173, 20, 0.10),
      0 8px 20px -6px rgba(250, 173, 20, 0.30) !important;
    animation: none !important;
  }
  html.is-embed-android.is-paused .phone-view[data-proto-state="rec"] > .phone-recbtn::before {
    width: 28px !important;
    height: 28px !important;
    background: #FAAD14 !important;
    background-image: none !important;
    border-radius: 7px !important;
  }

  /* —— Label 13px 中性灰，与按钮 12px 间距 —— */
  html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-rec-label {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #5C6373 !important;
    margin: 0 auto 18px !important;
    padding: 0 24px !important;
    text-align: center !important;
    letter-spacing: 0 !important;
    line-height: 1.4 !important;
    min-height: 1.4em !important;
  }
  html.is-embed-android.is-recording .phone-view[data-proto-state="rec"] > .phone-rec-label {
    color: #F53F3F !important;
    font-weight: 500 !important;
  }
  html.is-embed-android.is-paused .phone-view[data-proto-state="rec"] > .phone-rec-label {
    color: #FAAD14 !important;
    font-weight: 500 !important;
  }

  /* —— 窄屏（≤340px CSS px，覆盖 iPhone SE / 早期 Android）等比缩到 76dp —— */
  @media (max-width: 340px) {
    html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-recbtn {
      width: 76px !important;
      height: 76px !important;
      min-width: 76px !important;
      min-height: 76px !important;
      max-width: 76px !important;
      max-height: 76px !important;
      margin: 20px auto 10px !important;
      box-shadow:
        0 0 0 5px rgba(245, 63, 63, 0.10),
        0 8px 22px -5px rgba(245, 63, 63, 0.42),
        0 2px 3px rgba(0, 0, 0, 0.06) !important;
    }
    html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-recbtn::before {
      width: 30px !important;
      height: 38px !important;
    }
    html.is-embed-android.is-recording .phone-view[data-proto-state="rec"] > .phone-recbtn::before,
    html.is-embed-android.is-paused .phone-view[data-proto-state="rec"] > .phone-recbtn::before {
      width: 24px !important;
      height: 24px !important;
      border-radius: 6px !important;
    }
  }

  /* —— prefers-reduced-motion 关掉呼吸动画 —— */
  @media (prefers-reduced-motion: reduce) {
    html.is-embed-android.is-recording .phone-view[data-proto-state="rec"] > .phone-recbtn {
      animation: none !important;
    }
  }


/* ===== 纪要 tab · 列表模式 =====
   v0.7.3 2026-06-12: 解除 html.is-embed-android 门控。APK 内 UA 注册 OK，但 PWA /
   浏览器场景没这个 class，list 和 detail 会同时出现、返回按钮永不亮。tap-to-open
   是 SPA 通用 UX 不该和 embed 类型耦合。 */
[data-proto-state="summary"].is-list-mode .phone-summary { display: none !important; }
[data-proto-state="summary"]:not(.is-list-mode) #mc-sum-list { display: none !important; }
[data-proto-state="summary"]:not(.is-list-mode) #mc-sum-back { display: inline-flex !important; }
[data-proto-state="summary"].is-list-mode #mc-sum-back { display: none !important; }

#mc-sum-back {
  display: none;
  align-items: center; gap: 4px;
  background: #FFFFFF; border: 1px solid #E5E5EA;
  color: #1D1D1F; font-size: 13px; font-weight: 500;
  padding: 7px 12px 7px 8px; border-radius: 999px;
  margin: 8px 14px 8px; align-self: flex-start;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
#mc-sum-back:active { background: #F5F5F7; transform: scale(0.98); }
#mc-sum-back .ic { font-size: 13px; color: #5C6373; }

#mc-sum-list { padding: 0 14px 24px; display: flex; flex-direction: column; gap: 10px; }
.mc-sum-list-h {
  display: flex; align-items: center; gap: 8px;
  margin: 16px 0 6px; padding: 0 2px;
}
.mc-sum-list-h .lab {
  font-size: 13px; font-weight: 600; color: #5C6373;
}
.mc-sum-list-h .cnt { font-size: 12px; color: #8E8E93; font-variant-numeric: tabular-nums; }
.mc-sum-empty {
  background: #FFFFFF; border: 1px dashed #E5E5EA; border-radius: 14px;
  padding: 32px 16px; text-align: center; color: #8E8E93; font-size: 13px;
}
.mc-sum-card {
  background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 14px;
  padding: 14px 14px; display: flex; flex-direction: column; gap: 8px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: background 0.12s ease, transform 0.12s ease, box-shadow 0.18s ease;
}
.mc-sum-card:active { background: #F5F5F7; transform: scale(0.995); }
.mc-sum-card.is-pinned { border-color: #F53F3F; box-shadow: 0 0 0 2px rgba(245,63,63,0.08); }
.mc-sum-card .row-title {
  display: flex; align-items: center; gap: 6px;
  font-size: 15px; font-weight: 600; color: #1D1D1F;
  letter-spacing: -0.005em;
}
.mc-sum-card .row-title .pin { font-size: 13px; }
.mc-sum-card .row-meta {
  font-size: 11.5px; color: #8E8E93;
  font-variant-numeric: tabular-nums; letter-spacing: 0.02em;
}
.mc-sum-card .row-excerpt {
  font-size: 13px; color: #5C6373; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.mc-sum-card .row-kpi {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-top: 2px;
}
.mc-sum-card .kpi {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 11px; padding: 3px 8px; border-radius: 999px;
  font-weight: 500; line-height: 1; font-variant-numeric: tabular-nums;
}
.mc-sum-card .kpi.deci { background: #E8F1FF; color: #4a4ad8; }
.mc-sum-card .kpi.todo { background: #F6FFED; color: #389E0D; }
.mc-sum-card .kpi.ppl  { background: #FFF7E6; color: #B47200; }

/* v0.7.1 · list 模式横向 swipe carousel：行变成每页一张满宽 snap card。
   父 .mc-sum-swipe 是 flex 横排 + scroll-snap-type: x mandatory；
   每个 .mc-sum-card.is-swipe-page = 一页 100% 宽 + scroll-snap-align: center。
   touch-action: pan-x 防纵向滚动抢手势；overscroll-behavior-x: contain 防边缘弹。 */
.mc-sum-swipe {
  display: flex;
  overflow-x: auto;
  /* v0.7.1 r5 · 删除 scroll-snap-type: 它在 Android WebView 上和 JS 手写 scrollLeft
     打架：touchmove 期间 snap 会立即把 scrollLeft 吸回最近 snap 点，手指拖动看起来
     无效。JS 端在 touchend 自己做 smooth snap，CSS snap 是冗余且有害。 */
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  gap: 0;
  padding: 4px 0 12px;
  margin: 0 -14px;
}
.mc-sum-swipe::-webkit-scrollbar { display: none; height: 0; }
.mc-sum-card.is-swipe-page {
  flex: 0 0 calc(100vw - 28px);
  max-width: calc(100vw - 28px);
  min-height: 100px;
  /* scroll-snap-align/stop 在 .mc-sum-swipe 删 scroll-snap-type 后无效，已移除 */
  margin: 0 7px;
  box-sizing: border-box;
}
.mc-sum-card.is-swipe-page .row-excerpt {
  -webkit-line-clamp: 5;
}
/* dots 指示器：底部居中 5px 小圆点，当前页放大 */
.mc-sum-swipe-dots {
  display: flex; justify-content: center; gap: 6px;
  padding: 6px 0 4px;
}
.mc-sum-swipe-dots > span {
  width: 5px; height: 5px; border-radius: 50%;
  background: #D9D9DE;
  transition: background 180ms ease, transform 180ms ease;
}
.mc-sum-swipe-dots > span.is-active {
  background: #5b6cff;
  transform: scale(1.3);
}
/* 首次"← 横向滑动 →"提示，0.6s 后用户首滑 fade out */
.mc-sum-swipe-hint {
  text-align: center;
  font-size: 11px;
  color: #8E8E93;
  padding: 4px 0 6px;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
  transition: opacity 500ms ease;
  pointer-events: none;
}
.mc-sum-swipe-hint.is-fading {
  opacity: 0;
}

/* v0.7.5 · 纪要 list-mode：唯一一份 vertical 紧凑清单（点击进 detail）。
   "卡片"切换 = v0.7 MnemoCardV7 注入的 .mc7-view-toggle → 堆叠抽卡 (#mc-sum-stack)。
   2026-06-13 用户："清单 / 列表 / 卡片"三者中删掉中间的横向 swipe carousel，
   只留"列表 = 真清单" + "卡片 = 抽卡堆叠" 二态。 */
.mc-sum-rows { display: flex; flex-direction: column; gap: 6px; padding: 2px 0 8px; }
.mc-sum-row {
  position: relative;
  background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 12px;
  padding: 11px 30px 11px 12px;
  display: flex; flex-direction: column; gap: 3px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: background 0.12s ease, transform 0.12s ease;
}
.mc-sum-row:active { background: #F5F5F7; transform: scale(0.997); }
.mc-sum-row.is-pinned { border-color: #F53F3F; }
.mc-sum-row .r-top {
  display: flex; align-items: center; gap: 6px;
}
.mc-sum-row .r-title {
  flex: 1 1 auto; min-width: 0;
  font-size: 14px; font-weight: 600; color: #1D1D1F;
  letter-spacing: -0.005em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mc-sum-row .r-pin { font-size: 12px; flex: 0 0 auto; color: #F53F3F; }
.mc-sum-row .r-when {
  flex: 0 0 auto; font-size: 11px; color: #8E8E93;
  font-variant-numeric: tabular-nums;
}
.mc-sum-row .r-meta {
  font-size: 11px; color: #8E8E93;
  display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
  font-variant-numeric: tabular-nums;
}
.mc-sum-row .r-meta .dot { color: #C7C7CC; }
.mc-sum-row .r-meta .kpi {
  display: inline-flex; align-items: center; gap: 2px;
  padding: 1.5px 6px; border-radius: 999px;
  font-weight: 500; font-size: 10.5px; line-height: 1;
}
.mc-sum-row .r-meta .kpi.deci { background: #E8F1FF; color: #4a4ad8; }
.mc-sum-row .r-meta .kpi.todo { background: #F6FFED; color: #389E0D; }
.mc-sum-row .r-meta .kpi.ppl  { background: #FFF7E6; color: #B47200; }
.mc-sum-row .r-excerpt {
  font-size: 12.5px; color: #5C6373; line-height: 1.45;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mc-sum-row .r-chev {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  color: #C7C7CC; font-size: 18px; line-height: 1;
}

/* ===== Agent tab · 跨录音 hero + 待办收件箱 ===== */
#mc-ag-cross {
  padding: 4px 14px 14px;
  display: flex; flex-direction: column; gap: 14px;
}
.mc-agx-hero {
  background: linear-gradient(135deg, #5b6cff 0%, #4a4ad8 100%);
  color: #FFFFFF; border-radius: 14px;
  padding: 14px 16px 16px;
  box-shadow: 0 8px 20px -8px rgba(14, 99, 229, 0.45);
}
.mc-agx-hero .eyebrow {
  font-size: 11px; opacity: 0.82; letter-spacing: 0.04em;
  margin-bottom: 4px; text-transform: uppercase;
}
.mc-agx-hero .title {
  font-size: 17px; font-weight: 600; letter-spacing: -0.01em;
  margin-bottom: 4px;
}
.mc-agx-hero .sub { font-size: 12.5px; opacity: 0.88; line-height: 1.45; }

.mc-agx-section { display: flex; flex-direction: column; gap: 10px; }
.mc-agx-h {
  display: flex; align-items: baseline; justify-content: space-between;
  font-size: 13px; font-weight: 600; color: #1D1D1F;
  padding: 0 2px;
}
.mc-agx-h .cnt {
  font-size: 11px; font-weight: 500; color: #8E8E93;
  font-variant-numeric: tabular-nums;
}

/* 待办 risk-bucket 计数 */
.mc-agx-buckets {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px;
}
.mc-agx-bucket {
  background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 12px;
  padding: 10px 12px;
  display: flex; flex-direction: column; gap: 2px;
}
.mc-agx-bucket .lab {
  font-size: 11px; color: #8E8E93; font-weight: 500;
  display: inline-flex; align-items: center; gap: 4px;
}
.mc-agx-bucket .lab::before {
  content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%;
}
.mc-agx-bucket.L0 .lab::before { background: #52C41A; }
.mc-agx-bucket.L1 .lab::before { background: #FAAD14; }
.mc-agx-bucket.L2 .lab::before { background: #F53F3F; }
.mc-agx-bucket .num {
  font-size: 22px; font-weight: 700; color: #1D1D1F;
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
  line-height: 1.1;
}
.mc-agx-bucket .sub { font-size: 11px; color: #8E8E93; }

/* 待办列表 */
.mc-agx-todos { display: flex; flex-direction: column; gap: 6px; }
.mc-agx-todo {
  background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 12px;
  padding: 10px 12px;
  display: flex; align-items: flex-start; gap: 10px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.mc-agx-todo:active { background: #F5F5F7; }
.mc-agx-todo .risk {
  flex: 0 0 auto; font-size: 10px; font-weight: 700;
  padding: 3px 6px; border-radius: 6px; letter-spacing: 0.02em;
  line-height: 1; min-width: 22px; text-align: center;
}
.mc-agx-todo .risk.L0 { background: #F6FFED; color: #389E0D; }
.mc-agx-todo .risk.L1 { background: #FFF7E6; color: #B47200; }
.mc-agx-todo .risk.L2 { background: #FFF1F0; color: #CF1322; }
.mc-agx-todo .body { flex: 1; min-width: 0; }
.mc-agx-todo .ttl {
  font-size: 13.5px; font-weight: 500; color: #1D1D1F;
  line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mc-agx-todo .src {
  font-size: 11px; color: #8E8E93; margin-top: 3px;
  display: inline-flex; align-items: center; gap: 3px;
}
.mc-agx-todo .src::before { content: '↳'; opacity: 0.6; }
.mc-agx-todos-more {
  text-align: center; font-size: 12px; color: #5b6cff;
  padding: 8px 0 2px; cursor: pointer; font-weight: 500;
}

/* 跨录音动作卡 */
.mc-agx-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mc-agx-act {
  background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 12px;
  padding: 12px 12px;
  display: flex; flex-direction: column; gap: 4px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: transform 0.12s ease, box-shadow 0.18s ease;
}
.mc-agx-act:active { transform: scale(0.98); background: #F5F5F7; }
.mc-agx-act .ic { font-size: 18px; line-height: 1; margin-bottom: 2px; }
.mc-agx-act .ttl { font-size: 13px; font-weight: 600; color: #1D1D1F; }
.mc-agx-act .desc { font-size: 11px; color: #8E8E93; line-height: 1.4; }
.mc-agx-act[data-disabled="1"] { opacity: 0.5; cursor: not-allowed; }

/* 单录音工具盘 fold */
.mc-agx-perrec {
  background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 12px;
  padding: 0; overflow: hidden;
}
.mc-agx-perrec > summary {
  list-style: none; cursor: pointer;
  padding: 12px 14px;
  font-size: 13px; font-weight: 600; color: #1D1D1F;
  display: flex; align-items: center; justify-content: space-between;
  -webkit-tap-highlight-color: transparent;
}
.mc-agx-perrec > summary::-webkit-details-marker { display: none; }
.mc-agx-perrec > summary::after {
  content: '▾'; font-size: 11px; color: #8E8E93;
  transition: transform 0.18s ease;
}
.mc-agx-perrec[open] > summary::after { transform: rotate(180deg); }
.mc-agx-perrec > summary .meta { font-size: 11px; color: #8E8E93; font-weight: 400; margin-left: 8px; }

html.is-embed-android [data-proto-state="agent"].is-cross-mode .mc-oc-hero,
html.is-embed-android [data-proto-state="agent"].is-cross-mode #mc-oc-grid,
html.is-embed-android [data-proto-state="agent"].is-cross-mode #mc-oc-advanced-toggle,
html.is-embed-android [data-proto-state="agent"].is-cross-mode #mc-oc-advanced {
  /* 当 detail 关闭时这些原生 dom 显示在 <details> 内部 */
}

/* ===== 记忆 tab · 刷新 badge ===== */
#mc-mem-refresh {
  display: flex; align-items: center; justify-content: space-between;
  margin: 12px 14px 6px;
  padding: 8px 12px;
  background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 999px;
  font-size: 12px; color: #5C6373;
}
#mc-mem-refresh .lab {
  display: inline-flex; align-items: center; gap: 6px;
  font-variant-numeric: tabular-nums;
}
#mc-mem-refresh .lab::before {
  content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: #52C41A; box-shadow: 0 0 0 3px rgba(82,196,26,0.15);
}
#mc-mem-refresh.is-refreshing .lab::before {
  background: #FAAD14; animation: dt32MemPulse 1s ease-in-out infinite;
}
@keyframes dt32MemPulse {
  0%,100% { box-shadow: 0 0 0 3px rgba(250,173,20,0.15); }
  50%     { box-shadow: 0 0 0 6px rgba(250,173,20,0.05); }
}
#mc-mem-refresh .btn {
  background: transparent; border: 0; padding: 4px 8px;
  font-size: 12px; color: #5b6cff; font-weight: 500;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  border-radius: 6px;
}
#mc-mem-refresh .btn:active { background: #E8F1FF; }
#mc-mem-refresh[data-stale="1"] .lab { color: #B47200; }


/* ===== 砍掉二级 proto-pills（仅 embed=android） ===== */
html.is-embed-android .proto-pills { display: none !important; }

/* ===== Agent tab 新增内联 section ===== */
.mc-agx-mini-section {
  background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 14px;
  padding: 12px 14px; display: flex; flex-direction: column; gap: 8px;
}
.mc-agx-mini-h {
  display: flex; align-items: baseline; justify-content: space-between;
  font-size: 13px; font-weight: 600; color: #1D1D1F;
}
.mc-agx-mini-h .cnt { font-size: 11px; font-weight: 500; color: #8E8E93; font-variant-numeric: tabular-nums; }
.mc-agx-mini-row {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid #F2F2F4;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.mc-agx-mini-row:last-child { border-bottom: 0; }
.mc-agx-mini-row:active { background: #F5F5F7; }
.mc-agx-mini-row .ic {
  flex: 0 0 24px; height: 24px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #F5F5F7; border-radius: 6px; font-size: 13px;
}
.mc-agx-mini-row .body { flex: 1; min-width: 0; }
.mc-agx-mini-row .ttl {
  font-size: 13.5px; font-weight: 500; color: #1D1D1F;
  line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.mc-agx-mini-row .meta {
  font-size: 11px; color: #8E8E93; margin-top: 2px;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.mc-agx-mini-row .arr { flex: 0 0 auto; color: #C7C7CC; font-size: 16px; line-height: 1; align-self: center; }
.mc-agx-mini-empty {
  font-size: 12px; color: #8E8E93; text-align: center; padding: 12px 0;
}
.mc-agx-mini-more {
  text-align: center; font-size: 12px; color: #5b6cff;
  padding: 4px 0 2px; cursor: pointer; font-weight: 500;
  margin-top: 2px;
}
.mc-agx-runs-summary {
  list-style: none; cursor: pointer; padding: 12px 14px 12px 14px;
  font-size: 13px; font-weight: 600; color: #1D1D1F;
  display: flex; align-items: center; justify-content: space-between;
}
.mc-agx-runs-summary::-webkit-details-marker { display: none; }
.mc-agx-runs-summary::after {
  content: '▾'; font-size: 11px; color: #8E8E93;
  transition: transform 0.18s ease;
}
details.mc-agx-mini-section[open] .mc-agx-runs-summary::after { transform: rotate(180deg); }
details.mc-agx-mini-section .mc-agx-runs-body { padding: 0 14px 12px; }

/* L2 待确认 banner */
.mc-agx-l2-banner {
  background: linear-gradient(135deg, #FFF1F0 0%, #FFE7E5 100%);
  border: 1px solid #FFCDC9; border-radius: 14px;
  padding: 12px 14px;
  display: flex; align-items: center; gap: 10px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.mc-agx-l2-banner:active { transform: scale(0.99); }
.mc-agx-l2-banner .ic {
  flex: 0 0 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #F53F3F; color: #FFFFFF; border-radius: 50%;
  font-size: 14px; box-shadow: 0 4px 10px -3px rgba(245,63,63,0.4);
}
.mc-agx-l2-banner .body { flex: 1; }
.mc-agx-l2-banner .ttl { font-size: 13px; font-weight: 600; color: #CF1322; }
.mc-agx-l2-banner .sub { font-size: 11.5px; color: #B47200; margin-top: 1px; }
.mc-agx-l2-banner .arr { color: #F53F3F; font-size: 18px; font-weight: 600; }

/* ===== 记忆 tab 新增内联 section ===== */
.mc-mem-mini-section {
  background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 14px;
  padding: 12px 14px; margin: 0 14px;
  display: flex; flex-direction: column; gap: 8px;
}
.mc-mem-mini-h {
  font-size: 13px; font-weight: 600; color: #1D1D1F;
  display: flex; align-items: baseline; justify-content: space-between;
}
.mc-mem-mini-h .cnt { font-size: 11px; font-weight: 500; color: #8E8E93; }
.mc-mem-proj-row, .mc-mem-tl-row {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid #F2F2F4;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.mc-mem-proj-row:last-child, .mc-mem-tl-row:last-child { border-bottom: 0; }
.mc-mem-proj-row:active, .mc-mem-tl-row:active { background: #F5F5F7; }
.mc-mem-proj-row .ic, .mc-mem-tl-row .ic {
  flex: 0 0 28px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #F5F5F7; border-radius: 8px; font-size: 14px;
}
.mc-mem-proj-row .body, .mc-mem-tl-row .body { flex: 1; min-width: 0; }
.mc-mem-proj-row .ttl, .mc-mem-tl-row .ttl {
  font-size: 13.5px; font-weight: 500; color: #1D1D1F; line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.mc-mem-proj-row .meta, .mc-mem-tl-row .meta {
  font-size: 11px; color: #8E8E93; margin-top: 2px;
}
.mc-mem-tl-day {
  font-size: 11px; font-weight: 600; color: #5C6373;
  padding: 8px 0 2px;
  letter-spacing: 0.02em;
  border-bottom: 0 !important;
}
.mc-mem-mini-empty {
  font-size: 12px; color: #8E8E93; text-align: center; padding: 12px 0;
}
.mc-mem-mini-more {
  text-align: center; font-size: 12px; color: #5b6cff;
  padding: 4px 0 2px; cursor: pointer; font-weight: 500;
}


/* ===== 设计 token 升级 ===== */
html.is-embed-android {
  --mc-font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "PingFang SC", "Helvetica Neue", "Segoe UI", Roboto, system-ui, sans-serif;
  --mc-font-mono: "SF Mono", "JetBrains Mono", ui-monospace, "Cascadia Code", "PingFang SC", monospace;
  --mc-ink-1: #1D1D1F;        /* 主文 */
  --mc-ink-2: #5C6373;        /* 副文 */
  --mc-ink-3: #8E8E93;        /* 弱文 */
  --mc-line:  #E5E5EA;        /* 极淡 line */
  --mc-line-2: #F2F2F4;       /* 更淡 line（内部分隔） */
  --mc-paper: #FAFAF8;        /* 全局背景 */
  --mc-card:  #FFFFFF;
  --mc-brand: #F53F3F;        /* 品牌红（钉钉 #F53F3F） */
  --mc-brand-soft: rgba(245, 63, 63, 0.08);
  --mc-accent: #5b6cff;       /* 蓝点缀 */
  --mc-accent-soft: rgba(91, 108, 255, 0.08);
  --mc-warn: #FAAD14;
  --mc-warn-soft: rgba(250, 173, 20, 0.10);
  --mc-ok: #52C41A;
  --mc-ok-soft: rgba(82, 196, 26, 0.10);
}

/* 全局字体 + 数字 token */
html.is-embed-android body,
html.is-embed-android .phone-frame,
html.is-embed-android button,
html.is-embed-android input,
html.is-embed-android textarea,
html.is-embed-android select {
  font-family: var(--mc-font-sans) !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  font-feature-settings: "ss01" on, "cv11" on !important;
}
html.is-embed-android .phone-rectimer,
html.is-embed-android .row-meta,
html.is-embed-android .mc-portrait-stat-num,
html.is-embed-android .num,
html.is-embed-android .mc-sm-hero-eyebrow,
html.is-embed-android .meta,
html.is-embed-android #mc-mem-refresh-lab,
html.is-embed-android .mc-week-stats {
  font-variant-numeric: tabular-nums slashed-zero !important;
}

/* ===== Topbar 视觉升级 ===== */
html.is-embed-android .phone-topbar {
  background: rgba(250, 250, 248, 0.92) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
  padding: calc(env(safe-area-inset-top, 0) + 12px) 18px 11px !important;
  position: sticky !important; top: 0 !important; z-index: 10 !important;
  transition: box-shadow 0.2s ease !important;
}
html.is-embed-android .phone-topbar.is-elevated {
  box-shadow: 0 2px 12px -4px rgba(0, 0, 0, 0.08) !important;
}
/* 标题前加小 mic glyph */
html.is-embed-android .phone-topbar .title {
  font-family: var(--mc-font-sans) !important;
  font-size: 19px !important; font-weight: 600 !important;
  letter-spacing: -0.012em !important;
  color: var(--mc-ink-1) !important;
  display: inline-flex !important; align-items: center !important; gap: 8px !important;
  margin: 0 !important;
}
html.is-embed-android .phone-topbar .title::before {
  content: ''; display: inline-block; flex: 0 0 22px; width: 22px; height: 22px;
  background:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none'%3E%3Crect x='8' y='3' width='6' height='11' rx='3' fill='%23F53F3F'/%3E%3Cpath d='M5 12 a6 6 0 0 0 12 0' stroke='%23F53F3F' stroke-width='1.8' stroke-linecap='round'/%3E%3Cline x1='11' y1='17.5' x2='11' y2='20' stroke='%23F53F3F' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E")
    no-repeat center / contain;
}

/* ===== 卡片系统升级（共享 .mc-card token） ===== */
html.is-embed-android .phone-rec-item,
html.is-embed-android .mc-sum-card,
html.is-embed-android .mc-agx-mini-section,
html.is-embed-android .mc-mem-mini-section,
html.is-embed-android .mc-agx-bucket,
html.is-embed-android .mc-agx-todo,
html.is-embed-android .mc-agx-act,
html.is-embed-android .mc-agx-perrec,
html.is-embed-android .phone-mem-card,
html.is-embed-android .mc-rel-card {
  background: linear-gradient(180deg, #FFFFFF 0%, #FCFCFB 100%) !important;
  border: 1px solid var(--mc-line) !important;
  box-shadow:
    0 1px 0 rgba(0, 0, 0, 0.02),
    0 1px 3px rgba(0, 0, 0, 0.04) !important;
  border-radius: 14px !important;
  transition:
    transform 0.18s cubic-bezier(.4, 0, .2, 1),
    box-shadow 0.22s ease,
    background 0.18s ease !important;
}
html.is-embed-android .phone-rec-item:active,
html.is-embed-android .mc-sum-card:active,
html.is-embed-android .mc-agx-todo:active,
html.is-embed-android .mc-agx-act:active,
html.is-embed-android .mc-mem-proj-row:active,
html.is-embed-android .mc-mem-tl-row:active {
  transform: scale(0.99) !important;
  background: linear-gradient(180deg, #F8F8F7 0%, #F5F5F4 100%) !important;
  box-shadow:
    0 1px 0 rgba(0, 0, 0, 0.02),
    0 0 0 rgba(0, 0, 0, 0) !important;
}

/* 纪要卡 · 左侧风险色条 */
html.is-embed-android .mc-sum-card {
  position: relative !important;
  padding-left: 18px !important;
  overflow: hidden !important;
}
html.is-embed-android .mc-sum-card::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--mc-accent); border-radius: 0 4px 4px 0; opacity: 0.5;
}
html.is-embed-android .mc-sum-card[data-risk="L2"]::before { background: var(--mc-brand); opacity: 0.9; }
html.is-embed-android .mc-sum-card[data-risk="L1"]::before { background: var(--mc-warn); opacity: 0.85; }
html.is-embed-android .mc-sum-card[data-risk="L0"]::before { background: var(--mc-ok); opacity: 0.7; }
html.is-embed-android .mc-sum-card.is-pinned { border-color: rgba(245, 63, 63, 0.35) !important; }
html.is-embed-android .mc-sum-card.is-pinned::before { background: var(--mc-brand); opacity: 1; }

/* 纪要卡 标题字号 + meta 字间距 */
html.is-embed-android .mc-sum-card .row-title {
  font-size: 15.5px !important; font-weight: 600 !important;
  letter-spacing: -0.01em !important; color: var(--mc-ink-1) !important;
}
html.is-embed-android .mc-sum-card .row-meta {
  font-size: 11.5px !important; color: var(--mc-ink-3) !important;
  letter-spacing: 0.01em !important;
}
html.is-embed-android .mc-sum-card .row-excerpt {
  font-size: 13px !important; color: var(--mc-ink-2) !important; line-height: 1.5 !important;
}

/* 录音 tab 列表卡也涂上左色条（默认蓝） */
html.is-embed-android .phone-rec-item {
  position: relative !important; padding-left: 18px !important; overflow: hidden !important;
}
html.is-embed-android .phone-rec-item::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--mc-accent); border-radius: 0 4px 4px 0; opacity: 0.5;
}
html.is-embed-android .phone-rec-item.is-pinned::before { background: var(--mc-brand); opacity: 1; }
html.is-embed-android .phone-rec-item.is-pinned { border-color: rgba(245, 63, 63, 0.35) !important; }

/* ===== Section header · 极简但更高级 ===== */
html.is-embed-android .phone-block-h,
html.is-embed-android .mc-agx-mini-h,
html.is-embed-android .mc-mem-mini-h,
html.is-embed-android .mc-sum-list-h .lab,
html.is-embed-android .mc-agx-h {
  font-family: var(--mc-font-sans) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  color: var(--mc-ink-3) !important;
  text-transform: uppercase !important;
}
/* 段落 h（保留大字号的部分）不被压扁 */
html.is-embed-android .mc-agx-mini-h,
html.is-embed-android .mc-mem-mini-h,
html.is-embed-android .mc-agx-h {
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
}
html.is-embed-android .mc-agx-mini-h > span:first-child::before,
html.is-embed-android .mc-mem-mini-h > span:first-child::before,
html.is-embed-android .mc-agx-h > span:first-child::before {
  content: ''; display: inline-block; width: 4px; height: 4px;
  border-radius: 50%; background: var(--mc-brand); margin-right: 7px;
  vertical-align: middle; transform: translateY(-1px);
}
html.is-embed-android .mc-mem-mini-h > span:first-child::before {
  background: var(--mc-accent);
}
html.is-embed-android .mc-agx-h > span:first-child::before {
  background: var(--mc-accent);
}
/* 数字 cnt 保留 mono */
html.is-embed-android .mc-agx-mini-h .cnt,
html.is-embed-android .mc-mem-mini-h .cnt,
html.is-embed-android .mc-sum-list-h .cnt,
html.is-embed-android .mc-agx-h .cnt {
  font-family: var(--mc-font-mono) !important;
  font-size: 10.5px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: var(--mc-ink-3) !important;
}

/* "本周录音 · 6 段" 大标 */
html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-block-h {
  font-size: 12px !important; letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--mc-ink-3) !important;
}
html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-block-h .h-count {
  font-family: var(--mc-font-mono) !important;
  font-size: 10.5px !important;
  text-transform: none !important;
  margin-left: 6px;
  letter-spacing: 0;
}

/* ===== Agent hero 升级 · 更深 gradient + radial highlight ===== */
html.is-embed-android .mc-agx-hero {
  background:
    radial-gradient(120% 90% at 0% 0%, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(135deg, #5b6cff 0%, #4a4ad8 100%) !important;
  border-radius: 16px !important;
  padding: 16px 18px 18px !important;
  box-shadow:
    0 8px 24px -8px rgba(11, 79, 184, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #FFFFFF !important;
}
html.is-embed-android .mc-agx-hero .eyebrow {
  font-size: 10.5px !important; letter-spacing: 0.08em !important;
  opacity: 0.78 !important; font-weight: 500 !important;
  text-transform: uppercase !important;
}
html.is-embed-android .mc-agx-hero .title {
  font-size: 18px !important; font-weight: 600 !important;
  letter-spacing: -0.012em !important; margin: 5px 0 5px !important;
}
html.is-embed-android .mc-agx-hero .sub {
  font-size: 12.5px !important; opacity: 0.88 !important; line-height: 1.5 !important;
}

/* L2 banner · 更紧迫的视觉 + 数字 mono */
html.is-embed-android .mc-agx-l2-banner {
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(135deg, #FFF1F0 0%, #FFE0DD 100%) !important;
  border: 1px solid rgba(245, 63, 63, 0.22) !important;
  border-radius: 14px !important;
  padding: 12px 14px !important;
  box-shadow: 0 4px 14px -6px rgba(245, 63, 63, 0.25) !important;
}
html.is-embed-android .mc-agx-l2-banner .ic {
  background: linear-gradient(135deg, #F53F3F 0%, #D62622 100%) !important;
  box-shadow: 0 4px 12px -3px rgba(245, 63, 63, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
html.is-embed-android .mc-agx-l2-banner .ttl {
  font-size: 13px !important; font-weight: 600 !important; color: #B71D14 !important;
  letter-spacing: -0.005em !important;
}
html.is-embed-android .mc-agx-l2-banner .sub {
  color: rgba(180, 114, 0, 0.85) !important;
  font-variant-numeric: tabular-nums slashed-zero !important;
}

/* L0/L1/L2 bucket 数字 · 更大更精神 */
html.is-embed-android .mc-agx-bucket .num {
  font-size: 26px !important; font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  font-variant-numeric: tabular-nums slashed-zero !important;
}
html.is-embed-android .mc-agx-bucket .lab {
  letter-spacing: 0.02em !important; font-weight: 600 !important;
}

/* 跨录音动作卡 · ic 字号大 + ttl medium */
html.is-embed-android .mc-agx-act .ic { font-size: 22px !important; }
html.is-embed-android .mc-agx-act .ttl {
  font-size: 13.5px !important; letter-spacing: -0.005em !important;
}

/* ===== 记忆 refresh badge 升级 ===== */
html.is-embed-android #mc-mem-refresh {
  background: linear-gradient(180deg, #FFFFFF 0%, #FCFCFB 100%) !important;
  border: 1px solid var(--mc-line) !important;
  border-radius: 999px !important;
  padding: 8px 14px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}
html.is-embed-android #mc-mem-refresh-lab {
  font-family: var(--mc-font-sans) !important;
  font-size: 12px !important;
  color: var(--mc-ink-2) !important;
  letter-spacing: 0 !important;
  font-variant-numeric: tabular-nums slashed-zero !important;
}
html.is-embed-android #mc-mem-refresh .btn {
  font-size: 11.5px !important; font-weight: 600 !important;
  letter-spacing: 0.02em !important;
}

/* "全部纪要"返回 pill 升级 */
html.is-embed-android #mc-sum-back {
  background: linear-gradient(180deg, #FFFFFF 0%, #FCFCFB 100%) !important;
  border: 1px solid var(--mc-line) !important;
  border-radius: 999px !important;
  padding: 7px 14px 7px 10px !important;
  font-size: 12.5px !important;
  letter-spacing: -0.005em !important;
  color: var(--mc-ink-1) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  font-weight: 500 !important;
}
html.is-embed-android #mc-sum-back .ic {
  font-size: 14px !important; color: var(--mc-brand) !important; font-weight: 600 !important;
}

/* ===== 底部 tab bar SVG 化 + 品牌红 active ===== */
html.is-embed-android .phone-bottombar {
  background: rgba(250, 250, 248, 0.92) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
  padding: 6px 0 calc(env(safe-area-inset-bottom, 0) + 6px) !important;
  height: auto !important;
  box-shadow: 0 -1px 12px -4px rgba(0, 0, 0, 0.05) !important;
}
html.is-embed-android .phone-bottombar button {
  background: transparent !important; border: 0 !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important;
  gap: 3px !important;
  padding: 6px 4px !important;
  color: var(--mc-ink-3) !important;
  font-size: 10.5px !important; font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  -webkit-tap-highlight-color: transparent !important;
  transition: color 0.18s ease, transform 0.18s ease !important;
}
html.is-embed-android .phone-bottombar button:active { transform: scale(0.95) !important; }
html.is-embed-android .phone-bottombar button .ico { display: none !important; }
html.is-embed-android .phone-bottombar button::before {
  content: '';
  width: 24px; height: 24px;
  background: currentColor;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: contain; mask-size: contain;
  transition: transform 0.18s ease, background 0.2s ease;
}
/* 录音 = mic */
html.is-embed-android .phone-bottombar button[data-proto-go="rec"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='12' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0'/%3E%3Cline x1='12' y1='18' x2='12' y2='21'/%3E%3Cline x1='9' y1='21' x2='15' y2='21'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='12' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0'/%3E%3Cline x1='12' y1='18' x2='12' y2='21'/%3E%3Cline x1='9' y1='21' x2='15' y2='21'/%3E%3C/svg%3E");
}
/* 转写 = wave */
html.is-embed-android .phone-bottombar button[data-proto-go="transcript"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' y1='10' x2='4' y2='14'/%3E%3Cline x1='8' y1='6' x2='8' y2='18'/%3E%3Cline x1='12' y1='3' x2='12' y2='21'/%3E%3Cline x1='16' y1='7' x2='16' y2='17'/%3E%3Cline x1='20' y1='11' x2='20' y2='13'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' y1='10' x2='4' y2='14'/%3E%3Cline x1='8' y1='6' x2='8' y2='18'/%3E%3Cline x1='12' y1='3' x2='12' y2='21'/%3E%3Cline x1='16' y1='7' x2='16' y2='17'/%3E%3Cline x1='20' y1='11' x2='20' y2='13'/%3E%3C/svg%3E");
}
/* 纪要 = list-doc */
html.is-embed-android .phone-bottombar button[data-proto-go="summary"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cline x1='9' y1='9' x2='15' y2='9'/%3E%3Cline x1='9' y1='13' x2='15' y2='13'/%3E%3Cline x1='9' y1='17' x2='13' y2='17'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cline x1='9' y1='9' x2='15' y2='9'/%3E%3Cline x1='9' y1='13' x2='15' y2='13'/%3E%3Cline x1='9' y1='17' x2='13' y2='17'/%3E%3C/svg%3E");
}
/* Agent = sparkles */
html.is-embed-android .phone-bottombar button[data-proto-go="agent"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 l1.6 4.4 L18 9 l-4.4 1.6 L12 15 l-1.6-4.4 L6 9 l4.4-1.6 Z'/%3E%3Cpath d='M19 14 l.7 1.7 L21.5 16.5 l-1.7.7 L19 19 l-.7-1.7 L16.5 16.5 l1.7-.7 Z'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 l1.6 4.4 L18 9 l-4.4 1.6 L12 15 l-1.6-4.4 L6 9 l4.4-1.6 Z'/%3E%3Cpath d='M19 14 l.7 1.7 L21.5 16.5 l-1.7.7 L19 19 l-.7-1.7 L16.5 16.5 l1.7-.7 Z'/%3E%3C/svg%3E");
}
/* 记忆 = brain */
html.is-embed-android .phone-bottombar button[data-proto-go="memory"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4 a3.5 3.5 0 0 0-3.5 3.5 v0.5 a3 3 0 0 0 0 6 v0 a3.5 3.5 0 0 0 3.5 3.5 h0 a2.5 2.5 0 0 0 2.5-2.5 V6.5 A2.5 2.5 0 0 0 9 4 Z'/%3E%3Cpath d='M15 4 a3.5 3.5 0 0 1 3.5 3.5 v0.5 a3 3 0 0 1 0 6 v0 a3.5 3.5 0 0 1-3.5 3.5 h0 a2.5 2.5 0 0 1-2.5-2.5 V6.5 A2.5 2.5 0 0 1 15 4 Z'/%3E%3Cpath d='M12 8 v8'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4 a3.5 3.5 0 0 0-3.5 3.5 v0.5 a3 3 0 0 0 0 6 v0 a3.5 3.5 0 0 0 3.5 3.5 h0 a2.5 2.5 0 0 0 2.5-2.5 V6.5 A2.5 2.5 0 0 0 9 4 Z'/%3E%3Cpath d='M15 4 a3.5 3.5 0 0 1 3.5 3.5 v0.5 a3 3 0 0 1 0 6 v0 a3.5 3.5 0 0 1-3.5 3.5 h0 a2.5 2.5 0 0 1-2.5-2.5 V6.5 A2.5 2.5 0 0 1 15 4 Z'/%3E%3Cpath d='M12 8 v8'/%3E%3C/svg%3E");
}
html.is-embed-android .phone-bottombar button.active,
html.is-embed-android .phone-bottombar button[data-active="true"] {
  color: var(--mc-brand) !important; font-weight: 600 !important;
}
html.is-embed-android .phone-bottombar button.active::before,
html.is-embed-android .phone-bottombar button[data-active="true"]::before {
  transform: scale(1.05);
}
/* active 下方小红点 */
html.is-embed-android .phone-bottombar button.active::after {
  content: ''; display: block;
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--mc-brand);
  position: absolute; bottom: 1px;
  box-shadow: 0 0 0 3px rgba(245, 63, 63, 0.12);
}
html.is-embed-android .phone-bottombar button { position: relative !important; }

/* ===== "查看全部" inline 链接升级 ===== */
html.is-embed-android .mc-agx-mini-more,
html.is-embed-android .mc-agx-todos-more,
html.is-embed-android .mc-mem-mini-more {
  color: var(--mc-brand) !important;
  font-size: 12px !important; font-weight: 600 !important;
  letter-spacing: -0.005em !important;
  padding: 8px 0 4px !important;
  margin-top: 4px !important;
  border-top: 1px dashed var(--mc-line-2) !important;
}

/* ===== Empty states 升级（淡圆点 + 居中提示） ===== */
html.is-embed-android .mc-agx-mini-empty,
html.is-embed-android .mc-mem-mini-empty,
html.is-embed-android .mc-sum-empty {
  font-size: 12.5px !important;
  color: var(--mc-ink-3) !important;
  padding: 22px 12px !important;
  text-align: center !important;
  letter-spacing: -0.005em !important;
}
html.is-embed-android .mc-agx-mini-empty::before,
html.is-embed-android .mc-mem-mini-empty::before {
  content: '◦'; display: block; font-size: 18px; color: var(--mc-line); margin-bottom: 4px;
}

/* ===== KPI chip 风格更紧致 ===== */
html.is-embed-android .mc-sum-card .row-kpi { gap: 5px !important; margin-top: 4px !important; }
html.is-embed-android .mc-sum-card .kpi {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
  padding: 3px 7px !important;
  border-radius: 6px !important;
  font-variant-numeric: tabular-nums slashed-zero !important;
}


/* ===== 主界面 hero stats badge 升级 ===== */
html.is-embed-android .mc-week-stats {
  background: linear-gradient(180deg, #FFFFFF 0%, #FCFCFB 100%) !important;
  border: 1px solid var(--mc-line) !important;
  border-radius: 14px !important;
  padding: 10px 14px !important;
  margin: 4px 14px 12px !important;
  display: grid !important; grid-template-columns: repeat(3, 1fr) !important;
  gap: 0 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}
html.is-embed-android .mc-week-stats .week-lab { display: none !important; }
html.is-embed-android .mc-week-stats .seg {
  display: flex !important; flex-direction: column !important;
  align-items: center !important; gap: 2px !important;
  padding: 4px 0 !important;
  position: relative !important;
}
html.is-embed-android .mc-week-stats .seg + .seg::before {
  content: ''; position: absolute; left: 0; top: 20%; bottom: 20%; width: 1px;
  background: var(--mc-line); opacity: 0.5;
}
html.is-embed-android .mc-week-stats .seg::before {
  content: attr(data-lab); display: block; font-size: 10.5px;
  color: var(--mc-ink-3); letter-spacing: 0.04em;
  text-transform: uppercase; font-weight: 500;
}
html.is-embed-android .mc-week-stats .dot-sep { display: none !important; }
html.is-embed-android .mc-week-stats .num {
  font-size: 19px !important; font-weight: 700 !important;
  color: var(--mc-ink-1) !important;
  letter-spacing: -0.022em !important;
  font-variant-numeric: tabular-nums slashed-zero !important;
  line-height: 1.2 !important;
}

/* ===== 版本更新 banner ===== */
.mc-home-update {
  margin: 8px 14px 12px;
  background:
    radial-gradient(120% 80% at 0% 0%, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(135deg, #FFF1E6 0%, #FFE0CC 100%);
  border: 1px solid rgba(250, 140, 22, 0.35);
  border-radius: 14px;
  padding: 12px 14px;
  display: flex; align-items: center; gap: 10px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  box-shadow: 0 4px 14px -6px rgba(250, 140, 22, 0.32);
  transition: transform 0.18s ease;
}
.mc-home-update:active { transform: scale(0.99); }
.mc-home-update .ic {
  flex: 0 0 32px; width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #FA8C16 0%, #D46B08 100%); color: #FFFFFF;
  border-radius: 50%;
  box-shadow: 0 4px 10px -3px rgba(250, 140, 22, 0.5), inset 0 1px 0 rgba(255,255,255,0.25);
  font-size: 16px;
}
.mc-home-update .body { flex: 1; min-width: 0; }
.mc-home-update .ttl {
  font-size: 13px; font-weight: 600; color: #874D00;
  letter-spacing: -0.005em;
}
.mc-home-update .sub {
  font-size: 11.5px; color: rgba(135, 77, 0, 0.78);
  margin-top: 1px;
  font-variant-numeric: tabular-nums slashed-zero;
}
.mc-home-update .arr { color: #FA8C16; font-size: 18px; font-weight: 600; }

/* ===== Dashboard section · 通用 ===== */
.mc-home-sec {
  background: linear-gradient(180deg, #FFFFFF 0%, #FCFCFB 100%);
  border: 1px solid var(--mc-line);
  border-radius: 14px;
  padding: 12px 14px;
  margin: 0 14px 12px;
  display: flex; flex-direction: column; gap: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.mc-home-sec .head {
  display: flex; align-items: baseline; justify-content: space-between;
  font-size: 12px; font-weight: 600; color: var(--mc-ink-3);
  letter-spacing: 0.04em; text-transform: uppercase;
}
.mc-home-sec .head > span:first-child::before {
  content: ''; display: inline-block; width: 4px; height: 4px;
  border-radius: 50%; background: var(--mc-brand); margin-right: 7px;
  vertical-align: middle; transform: translateY(-1px);
}
.mc-home-sec.is-memory .head > span:first-child::before { background: var(--mc-accent); }
.mc-home-sec .head .cnt {
  font-family: var(--mc-font-mono);
  font-size: 10.5px; color: var(--mc-ink-3);
  text-transform: none; letter-spacing: 0;
  font-variant-numeric: tabular-nums slashed-zero;
}
.mc-home-sec .row {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid var(--mc-line-2);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.mc-home-sec .row:last-of-type { border-bottom: 0; }
.mc-home-sec .row:active { background: #F8F8F7; }
.mc-home-sec .row .badge {
  flex: 0 0 auto; font-size: 10px; font-weight: 700;
  padding: 3px 6px; border-radius: 6px; letter-spacing: 0.02em;
  line-height: 1; min-width: 22px; text-align: center;
}
.mc-home-sec .row .badge.L0 { background: var(--mc-ok-soft); color: #389E0D; }
.mc-home-sec .row .badge.L1 { background: var(--mc-warn-soft); color: #B47200; }
.mc-home-sec .row .badge.L2 { background: var(--mc-brand-soft); color: #CF1322; }
.mc-home-sec .row .body { flex: 1; min-width: 0; }
.mc-home-sec .row .ttl {
  font-size: 13.5px; font-weight: 500; color: var(--mc-ink-1);
  letter-spacing: -0.005em; line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mc-home-sec .row .src {
  font-size: 11px; color: var(--mc-ink-3); margin-top: 2px;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.mc-home-sec .row .src::before { content: '↳ '; opacity: 0.6; }
.mc-home-sec .more {
  text-align: center; font-size: 12px; color: var(--mc-brand);
  padding: 6px 0 0; cursor: pointer; font-weight: 600;
  border-top: 1px dashed var(--mc-line-2);
  margin-top: 4px;
  letter-spacing: -0.005em;
}
.mc-home-sec.is-memory .more { color: var(--mc-accent); }
.mc-home-sec .empty {
  font-size: 12.5px; color: var(--mc-ink-3);
  padding: 12px 0; text-align: center; letter-spacing: -0.005em;
}
.mc-home-sec .empty::before {
  content: '◦'; display: block; font-size: 16px;
  color: var(--mc-line); margin-bottom: 4px;
}

/* 记忆精华 insight 卡 */
.mc-home-insight {
  background: linear-gradient(135deg, rgba(91, 108, 255,0.03) 0%, rgba(91, 108, 255,0.01) 100%);
  border: 1px solid rgba(91, 108, 255,0.10);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 13px; line-height: 1.5; color: var(--mc-ink-1);
  letter-spacing: -0.005em;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.mc-home-insight strong { color: var(--mc-accent); font-weight: 600; }
.mc-home-insight + .mc-home-insight { margin-top: 6px; }

/* v0.7.1 · 首页两张卡（高风险待办 / 本周记忆精华）内部横向 snap 翻页。
   对齐纪要 card 模式的左右滑手感。每页 100% 宽，touch 一拖即翻到下一条。
   只在 ≥2 条时启用 swipe；1 条时维持原样上下流。 */
.mc-home-sec .mc-home-swipe {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  margin: 0 -14px;            /* 反向 padding 让 page 占满 card 内宽 */
  padding: 0;
  scrollbar-width: none;
  /* 防纵向滚动抢手势：明确告诉浏览器这是 X 轴 pan */
  touch-action: pan-x;
  overscroll-behavior-x: contain;
}
.mc-home-sec .mc-home-swipe::-webkit-scrollbar { display: none; height: 0; }
.mc-home-sec .mc-home-swipe > .swipe-page {
  flex: 0 0 100%;
  min-width: 100%;
  box-sizing: border-box;
  padding: 0 14px;
  scroll-snap-align: center;
  scroll-snap-stop: always;
}
/* swipe-page 内的 row / insight 用回原本视觉，无 border-bottom 干扰 */
.mc-home-sec .mc-home-swipe > .swipe-page > .row {
  border-bottom: 0;
  padding: 4px 0 8px;
}
.mc-home-sec .mc-home-swipe > .swipe-page > .row .ttl {
  -webkit-line-clamp: 3;      /* swipe 下每页空间更大，可多露一行 */
}
.mc-home-sec .mc-home-swipe-dots {
  display: flex; justify-content: center; gap: 5px;
  padding-top: 2px;
}
.mc-home-sec .mc-home-swipe-dots > span {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--mc-line);
  transition: background 180ms ease, transform 180ms ease;
}
.mc-home-sec .mc-home-swipe-dots > span.is-active {
  background: var(--mc-brand);
  transform: scale(1.25);
}
.mc-home-sec.is-memory .mc-home-swipe-dots > span.is-active {
  background: var(--mc-accent);
}

/* dashboard 整体 padding 收紧（去除原 14px 14px 60px） */
html.is-embed-android .phone-view[data-proto-state="rec"] {
  padding: 14px 0 100px !important;
}
html.is-embed-android .phone-view[data-proto-state="rec"] > .phone-block-h {
  margin: 0 14px 6px !important;
}
html.is-embed-android .phone-view[data-proto-state="rec"] .phone-rec-list {
  padding: 0 14px !important; gap: 6px !important;
}


/* ===== 首页 phone-view ===== */
html.is-embed-android .phone-view[data-proto-state="home"] {
  display: none;
  padding: 0 0 calc(env(safe-area-inset-bottom, 0) + 88px) !important;
  height: 100% !important;
  overflow-y: auto !important;
  background: linear-gradient(180deg, #FAFAF8 0%, #F4F4F0 100%) !important;
}
html.is-embed-android .phone-view[data-proto-state="home"].active {
  display: block !important;
  animation: dt36Fade 0.5s cubic-bezier(.4,0,.2,1);
}
@keyframes dt36Fade {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ===== 首页 Hero · animated mesh gradient ===== */
.dt36-hero {
  position: relative;
  margin: 8px 14px 14px;
  padding: 26px 22px 28px;
  border-radius: 22px;
  overflow: hidden;
  isolation: isolate;
  min-height: 220px;
  box-shadow:
    0 18px 40px -16px rgba(20, 30, 80, 0.42),
    0 4px 12px -4px rgba(20, 30, 80, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  color: #FFFFFF;
}
.dt36-hero::before {
  /* 渐变 mesh 背景 · 4 个 radial blob，动起来 */
  content: ''; position: absolute; top:0;right:0;bottom:0;left:0; z-index: -2;
  background:
    radial-gradient(40% 35% at 20% 22%, rgba(255, 86, 86, 0.95), transparent 70%),
    radial-gradient(35% 30% at 80% 18%, rgba(91, 108, 255, 0.95), transparent 65%),
    radial-gradient(45% 40% at 25% 90%, rgba(140, 67, 235, 0.92), transparent 65%),
    radial-gradient(40% 35% at 90% 88%, rgba(255, 175, 64, 0.85), transparent 60%),
    linear-gradient(135deg, #1B1F3A 0%, #0E1226 100%);
  filter: saturate(118%);
  animation: dt36MeshShift 18s ease-in-out infinite alternate;
}
@keyframes dt36MeshShift {
  0%   { transform: scale(1) rotate(0); }
  50%  { transform: scale(1.05) rotate(2deg); }
  100% { transform: scale(1.02) rotate(-2deg); }
}
.dt36-hero::after {
  /* 玻璃 noise overlay */
  content: ''; position: absolute; top:0;right:0;bottom:0;left:0; z-index: -1;
  background:
    repeating-linear-gradient(45deg,
      rgba(255, 255, 255, 0.02) 0 1px,
      transparent 1px 3px);
  mix-blend-mode: overlay;
}

/* 浮动光球 */
.dt36-hero-orbs {
  position: absolute; top:0;right:0;bottom:0;left:0; pointer-events: none; z-index: -1;
  overflow: hidden;
}
.dt36-hero-orbs .orb {
  position: absolute; width: 12px; height: 12px; border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.3));
  box-shadow: 0 0 16px 2px rgba(255, 255, 255, 0.4);
  animation: dt36OrbFloat 8s ease-in-out infinite;
  opacity: 0.6;
}
.dt36-hero-orbs .orb:nth-child(1) { top: 18%; left: 12%; animation-delay: 0s; }
.dt36-hero-orbs .orb:nth-child(2) { top: 65%; left: 78%; width: 18px; height: 18px; animation-delay: 1.4s; animation-duration: 11s; }
.dt36-hero-orbs .orb:nth-child(3) { top: 38%; left: 60%; width: 6px; height: 6px; animation-delay: 2.8s; animation-duration: 6s; }
.dt36-hero-orbs .orb:nth-child(4) { top: 78%; left: 22%; width: 9px; height: 9px; animation-delay: 4.1s; animation-duration: 9s; }
@keyframes dt36OrbFloat {
  0%   { transform: translateY(0) translateX(0) scale(1); opacity: 0.45; }
  50%  { transform: translateY(-22px) translateX(8px) scale(1.18); opacity: 0.78; }
  100% { transform: translateY(0) translateX(0) scale(1); opacity: 0.45; }
}

.dt36-hero-eyebrow {
  font-size: 11px; font-weight: 600; letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72);
  display: inline-flex; align-items: center; gap: 6px;
  margin-bottom: 12px;
}
.dt36-hero-eyebrow::before {
  content: ''; display: inline-block; width: 6px; height: 6px;
  background: #FF5252; border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(255, 82, 82, 0.28);
  animation: dt36DotPulse 2s ease-in-out infinite;
}
@keyframes dt36DotPulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(255, 82, 82, 0.28); }
  50%      { box-shadow: 0 0 0 8px rgba(255, 82, 82, 0); }
}
.dt36-hero-title {
  font-size: 28px; font-weight: 700; line-height: 1.18;
  letter-spacing: -0.025em; margin-bottom: 14px;
  color: #FFFFFF;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.15);
}
.dt36-hero-title .accent {
  background: linear-gradient(135deg, #FFE4E1 0%, #FFB1AA 50%, #FF7B7B 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}

/* Hero stat plate · glassmorphism */
.dt36-hero-stats {
  display: grid; grid-template-columns: repeat(3, 1fr);
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 16px;
  padding: 12px 8px;
  margin-bottom: 16px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.20), 0 4px 14px -2px rgba(0, 0, 0, 0.2);
}
.dt36-hero-stat {
  display: flex; flex-direction: column; align-items: center;
  position: relative; padding: 2px 0;
}
.dt36-hero-stat + .dt36-hero-stat::before {
  content: ''; position: absolute; left: 0; top: 18%; bottom: 18%; width: 1px;
  background: rgba(255, 255, 255, 0.18);
}
.dt36-hero-stat .val {
  font-size: 22px; font-weight: 700; color: #FFFFFF;
  letter-spacing: -0.025em; line-height: 1.1;
  font-variant-numeric: tabular-nums slashed-zero;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}
.dt36-hero-stat .lab {
  font-size: 10.5px; color: rgba(255, 255, 255, 0.72);
  letter-spacing: 0.06em; text-transform: uppercase;
  margin-top: 2px; font-weight: 500;
}

/* Hero CTA · 大红圆 + halo */
.dt36-hero-cta {
  display: inline-flex; align-items: center; gap: 10px;
  background: linear-gradient(135deg, #FF3B30 0%, #DC2626 100%);
  color: #FFFFFF; border: 0;
  font-size: 14px; font-weight: 600; letter-spacing: 0.01em;
  padding: 13px 22px 13px 18px;
  border-radius: 999px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  box-shadow:
    0 0 0 6px rgba(255, 59, 48, 0.18),
    0 12px 28px -8px rgba(255, 59, 48, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.25);
  position: relative; overflow: hidden;
  transition: transform 0.18s cubic-bezier(.4,0,.2,1), box-shadow 0.25s ease;
  animation: dt36CTABreath 2.4s ease-in-out infinite;
}
.dt36-hero-cta:active {
  transform: scale(0.96);
  box-shadow:
    0 0 0 3px rgba(255, 59, 48, 0.22),
    0 4px 12px -3px rgba(255, 59, 48, 0.5);
}
.dt36-hero-cta .ic {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  font-size: 14px;
}
@keyframes dt36CTABreath {
  0%, 100% { box-shadow: 0 0 0 6px rgba(255, 59, 48, 0.18), 0 12px 28px -8px rgba(255, 59, 48, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.25); }
  50%      { box-shadow: 0 0 0 12px rgba(255, 59, 48, 0), 0 12px 28px -8px rgba(255, 59, 48, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.25); }
}

/* ===== 首页 Glass 卡片层 ===== */
.dt36-glass {
  margin: 0 14px 12px;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 18px;
  padding: 14px 16px;
  box-shadow:
    0 8px 28px -10px rgba(20, 30, 80, 0.15),
    0 2px 6px -2px rgba(20, 30, 80, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.dt36-glass-h {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 10px;
}
.dt36-glass-h .ttl {
  font-size: 14px; font-weight: 600; color: var(--mc-ink-1);
  letter-spacing: -0.01em;
  display: inline-flex; align-items: center; gap: 7px;
}
.dt36-glass-h .ttl .ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 8px;
  background: linear-gradient(135deg, var(--mc-brand-soft), rgba(245, 63, 63, 0.04));
  color: var(--mc-brand); font-size: 14px;
}
.dt36-glass.is-mem .ttl .ico {
  background: linear-gradient(135deg, var(--mc-accent-soft), rgba(91, 108, 255, 0.04));
  color: var(--mc-accent);
}
.dt36-glass.is-rec .ttl .ico {
  background: linear-gradient(135deg, rgba(140, 67, 235, 0.10), rgba(140, 67, 235, 0.03));
  color: #722ED1;
}
.dt36-glass-h .cnt {
  font-family: var(--mc-font-mono);
  font-size: 11px; color: var(--mc-ink-3);
  font-variant-numeric: tabular-nums slashed-zero;
}

.dt36-row {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.dt36-row:last-of-type { border-bottom: 0; }
.dt36-row:active { background: rgba(0, 0, 0, 0.025); border-radius: 10px; }
.dt36-row .badge {
  flex: 0 0 auto; font-size: 10px; font-weight: 700;
  padding: 3px 7px; border-radius: 6px; letter-spacing: 0.02em;
  line-height: 1; min-width: 24px; text-align: center;
}
.dt36-row .badge.L0 { background: var(--mc-ok-soft); color: #389E0D; }
.dt36-row .badge.L1 { background: var(--mc-warn-soft); color: #B47200; }
.dt36-row .badge.L2 { background: var(--mc-brand-soft); color: #CF1322; }
.dt36-row .body { flex: 1; min-width: 0; }
.dt36-row .ttl-row {
  font-size: 13.5px; font-weight: 500; color: var(--mc-ink-1);
  letter-spacing: -0.005em; line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.dt36-row .src-row {
  font-size: 11px; color: var(--mc-ink-3); margin-top: 2px;
}
.dt36-row .src-row::before { content: '↳ '; opacity: 0.6; }
.dt36-glass .more {
  text-align: center; font-size: 12px; padding: 8px 0 0;
  cursor: pointer; font-weight: 600; color: var(--mc-brand);
  margin-top: 4px; border-top: 1px dashed rgba(0, 0, 0, 0.05);
  letter-spacing: -0.005em;
}
.dt36-glass.is-mem .more { color: var(--mc-accent); }
.dt36-glass.is-rec .more { color: #722ED1; }
.dt36-glass .empty {
  font-size: 12.5px; color: var(--mc-ink-3);
  padding: 14px 0; text-align: center;
}

/* 记忆 insight bubble */
.dt36-insight {
  background: linear-gradient(135deg, rgba(91, 108, 255, 0.06) 0%, rgba(91, 108, 255, 0.02) 100%);
  border: 1px solid rgba(91, 108, 255, 0.12);
  border-radius: 12px;
  padding: 10px 12px;
  font-size: 13px; line-height: 1.5; color: var(--mc-ink-1);
  letter-spacing: -0.005em;
  margin-bottom: 6px;
}
.dt36-insight:last-of-type { margin-bottom: 0; }
.dt36-insight strong { color: var(--mc-accent); font-weight: 700; }

/* ===== 底部 CTA pair · Agent / 记忆 ===== */
.dt36-cta-pair {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
  margin: 4px 14px 12px;
}
.dt36-cta {
  position: relative; overflow: hidden;
  border-radius: 16px;
  padding: 14px 14px;
  color: #FFFFFF;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  box-shadow:
    0 8px 22px -8px rgba(20, 30, 80, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  transition: transform 0.18s ease;
}
.dt36-cta:active { transform: scale(0.98); }
.dt36-cta.is-agent {
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(135deg, #722ED1 0%, #5417AD 100%);
}
.dt36-cta.is-mem {
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(135deg, #5b6cff 0%, #4a4ad8 100%);
}
.dt36-cta .ico {
  display: inline-block; font-size: 22px; margin-bottom: 4px;
}
.dt36-cta .ttl {
  font-size: 14px; font-weight: 600; letter-spacing: -0.01em;
}
.dt36-cta .desc {
  font-size: 11px; opacity: 0.85; margin-top: 1px; line-height: 1.4;
  letter-spacing: 0.005em;
}

/* ===== 底部 tab bar · 适配 6 个 tab ===== */
html.is-embed-android .phone-bottombar {
  padding-left: 2px !important; padding-right: 2px !important;
}
html.is-embed-android .phone-bottombar button[data-proto-go="home"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11 l9-7 l9 7 v9 a1 1 0 0 1-1 1 h-5 v-6 h-6 v6 h-5 a1 1 0 0 1-1-1 z'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11 l9-7 l9 7 v9 a1 1 0 0 1-1 1 h-5 v-6 h-6 v6 h-5 a1 1 0 0 1-1-1 z'/%3E%3C/svg%3E");
}

/* prefers-reduced-motion · 关掉动画 */
@media (prefers-reduced-motion: reduce) {
  .dt36-hero::before,
  .dt36-hero-orbs .orb,
  .dt36-hero-cta { animation: none !important; }
}

/* ===== Marketing landing · 下载 CTA 升级（dt37） ===== */
.btn-download {
  background: linear-gradient(135deg, #FF3B30 0%, #DC2626 100%) !important;
  box-shadow:
    0 1px 0 oklch(1 0 0 / 0.18) inset,
    0 0 0 4px rgba(255, 59, 48, 0.10),
    0 10px 28px -8px rgba(255, 59, 48, 0.55) !important;
  display: inline-flex !important; align-items: center !important; gap: 8px !important;
  padding: 0 18px 0 16px !important;
  position: relative;
  overflow: hidden;
}
.btn-download .ico { font-size: 16px; line-height: 1; }
.btn-download .ver {
  display: inline-block;
  margin-left: 4px;
  padding: 2px 8px;
  background: rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  font-family: var(--mc-font-mono, "SF Mono", "JetBrains Mono", ui-monospace, monospace);
}
.btn-download:hover {
  background: linear-gradient(135deg, #FF4D43 0%, #E72E2A 100%) !important;
  transform: translateY(-1px);
  box-shadow:
    0 1px 0 oklch(1 0 0 / 0.20) inset,
    0 0 0 6px rgba(255, 59, 48, 0.12),
    0 14px 32px -8px rgba(255, 59, 48, 0.65) !important;
}
.btn-download::before {
  content: ''; position: absolute; top:-4px;right:-4px;bottom:-4px;left:-4px;
  background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 60%);
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
}
.btn-download:hover::before { opacity: 1; }

/* ==========================================================================
   dt38b · Hero CTA 平台 pill 三件套（Android / iOS / 鸿蒙）2026-06-07
   · 每个 pill 都 primary 同级权重 · platform glyph + 文字 · 统一 outline
   · click → 已存在 mcOpenDownloadCenter 弹窗（保留 UA 嗅探 + 安装指引）
   ========================================================================== */
.hero-cta-platforms {
  align-items: center;
  gap: 10px !important;
  flex-wrap: wrap;
}
.btn-platform {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 18px !important;
  height: 46px !important;
  border-radius: 999px !important;
  font-size: 0.94rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
  background: linear-gradient(135deg, #FF3B30 0%, #DC2626 100%) !important;
  color: #fff !important;
  border: 0 !important;
  cursor: pointer;
  font-family: inherit;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.18) inset,
    0 0 0 4px rgba(255, 59, 48, 0.08),
    0 8px 24px -8px rgba(255, 59, 48, 0.45) !important;
  transition: transform .18s ease, box-shadow .22s ease !important;
  position: relative;
  text-decoration: none;
}
.btn-platform:hover {
  transform: translateY(-1px);
  box-shadow:
    0 1px 0 rgba(255,255,255,0.22) inset,
    0 0 0 6px rgba(255, 59, 48, 0.10),
    0 12px 30px -8px rgba(255, 59, 48, 0.55) !important;
}
.btn-platform:active { transform: scale(0.98); }
.btn-platform .btn-platform-ico {
  flex: 0 0 18px;
}
.btn-platform[data-mc-dl="ios"] {
  background: linear-gradient(135deg, #2C2C2E 0%, #1C1C1E 100%) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.14) inset,
    0 0 0 4px rgba(28, 28, 30, 0.08),
    0 8px 24px -8px rgba(0, 0, 0, 0.45) !important;
}
.btn-platform[data-mc-dl="ios"]:hover {
  box-shadow:
    0 1px 0 rgba(255,255,255,0.18) inset,
    0 0 0 6px rgba(28, 28, 30, 0.10),
    0 12px 30px -8px rgba(0, 0, 0, 0.55) !important;
}
.btn-platform[data-mc-dl="harmony"] {
  background: linear-gradient(135deg, #5b6cff 0%, #4a4ad8 100%) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.18) inset,
    0 0 0 4px rgba(91, 108, 255, 0.10),
    0 8px 24px -8px rgba(91, 108, 255, 0.50) !important;
}
.btn-platform[data-mc-dl="harmony"]:hover {
  box-shadow:
    0 1px 0 rgba(255,255,255,0.22) inset,
    0 0 0 6px rgba(91, 108, 255, 0.12),
    0 12px 30px -8px rgba(91, 108, 255, 0.60) !important;
}
.btn-platform .ver {
  display: inline-block;
  margin-left: 2px;
  padding: 2px 8px;
  background: rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  font-family: var(--mc-font-mono, "SF Mono", "JetBrains Mono", ui-monospace, monospace);
}

/* ==========================================================================
   dt38 · 底部 tab bar 图标统一收口（2026-06-07 · 顶级设计团队）
   · 解决：⏺📋🧠✦📨🏠 emoji + 部分 SVG 混搭，光学权重 / 配色 / 描边全不齐
   · 设计 token：viewBox 24×24 / stroke 1.6 / round caps&joins / outline-only
   · 6 tab 同一家族：home·house · rec·mic · summary·doc-fold ·
     memory·card-stack(品牌呼应) · insight·sparkle · initiatives·flag
   · 同时覆盖 web view（无 embed 类）与 Android embed 两路
   · 高优先级 !important · 选择器组 source-order 后置压住老 dt34/dt36
   ========================================================================== */
.phone-bottombar button { position: relative !important; }
.phone-bottombar button .ico { display: none !important; }
.phone-bottombar button::before {
  content: '' !important;
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 auto 2px !important;
  background: currentColor !important;
  -webkit-mask-repeat: no-repeat !important; mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important; mask-position: center !important;
  -webkit-mask-size: 22px 22px !important; mask-size: 22px 22px !important;
  transition: transform .18s ease, background .2s ease !important;
}
.phone-bottombar button.active::before,
.phone-bottombar button[data-active="true"]::before {
  transform: scale(1.06) !important;
}

/* 1. home · 首页 — 简洁 house outline */
html.is-embed-android .phone-bottombar button[data-proto-go="home"]::before,
.phone-bottombar button[data-proto-go="home"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11l8-7 8 7v8.5a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 19.5z'/%3E%3Cpath d='M9.5 21v-6.5h5V21'/%3E%3C/svg%3E") !important;
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11l8-7 8 7v8.5a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 19.5z'/%3E%3Cpath d='M9.5 21v-6.5h5V21'/%3E%3C/svg%3E") !important;
}

/* 2. rec · 录音 — microphone with arc cradle */
html.is-embed-android .phone-bottombar button[data-proto-go="rec"]::before,
.phone-bottombar button[data-proto-go="rec"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M6 11a6 6 0 0 0 12 0'/%3E%3Cpath d='M12 17v3'/%3E%3C/svg%3E") !important;
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M6 11a6 6 0 0 0 12 0'/%3E%3Cpath d='M12 17v3'/%3E%3C/svg%3E") !important;
}

/* 3. summary · 纪要 — document with folded corner + 2 lines */
html.is-embed-android .phone-bottombar button[data-proto-go="summary"]::before,
.phone-bottombar button[data-proto-go="summary"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3Cpath d='M9 13h6M9 17h4'/%3E%3C/svg%3E") !important;
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3Cpath d='M9 13h6M9 17h4'/%3E%3C/svg%3E") !important;
}

/* 4. memory · 记忆 — card stack (呼应 MnemoCard 品牌) */
html.is-embed-android .phone-bottombar button[data-proto-go="memory"]::before,
.phone-bottombar button[data-proto-go="memory"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='8' width='13' height='12' rx='2'/%3E%3Cpath d='M8 8V6a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v10'/%3E%3C/svg%3E") !important;
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='8' width='13' height='12' rx='2'/%3E%3Cpath d='M8 8V6a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v10'/%3E%3C/svg%3E") !important;
}

/* 5. insight · 洞察 — lightbulb（aha 时刻 · 比 sparkle 更易辨识） */
html.is-embed-android .phone-bottombar button[data-proto-go="insight"]::before,
.phone-bottombar button[data-proto-go="insight"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3a6 6 0 0 0-3.5 10.9V16h7v-2.1A6 6 0 0 0 12 3z'/%3E%3Cpath d='M10 19h4'/%3E%3Cpath d='M10.5 21h3'/%3E%3C/svg%3E") !important;
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3a6 6 0 0 0-3.5 10.9V16h7v-2.1A6 6 0 0 0 12 3z'/%3E%3Cpath d='M10 19h4'/%3E%3Cpath d='M10.5 21h3'/%3E%3C/svg%3E") !important;
}

/* 6. initiatives · 跟进 — flag（简化弧线版 · 兼容性更好的几何路径） */
html.is-embed-android .phone-bottombar button[data-proto-go="initiatives"]::before,
.phone-bottombar button[data-proto-go="initiatives"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21V4'/%3E%3Cpath d='M5 4h13l-3 4 3 4H5z'/%3E%3C/svg%3E") !important;
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21V4'/%3E%3Cpath d='M5 4h13l-3 4 3 4H5z'/%3E%3C/svg%3E") !important;
}

/* 历史 tab（transcript / agent）若任何视图复用 — 同体系兜底 */
html.is-embed-android .phone-bottombar button[data-proto-go="transcript"]::before,
.phone-bottombar button[data-proto-go="transcript"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11v2M8 8v8M12 4v16M16 8v8M20 11v2'/%3E%3C/svg%3E") !important;
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11v2M8 8v8M12 4v16M16 8v8M20 11v2'/%3E%3C/svg%3E") !important;
}
html.is-embed-android .phone-bottombar button[data-proto-go="agent"]::before,
.phone-bottombar button[data-proto-go="agent"]::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4.5'/%3E%3Cpath d='M12 3v3M12 18v3M21 12h-3M6 12H3M18.4 5.6l-2.1 2.1M7.7 16.3l-2.1 2.1M18.4 18.4l-2.1-2.1M7.7 7.7L5.6 5.6'/%3E%3C/svg%3E") !important;
          mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4.5'/%3E%3Cpath d='M12 3v3M12 18v3M21 12h-3M6 12H3M18.4 5.6l-2.1 2.1M7.7 16.3l-2.1 2.1M18.4 18.4l-2.1-2.1M7.7 7.7L5.6 5.6'/%3E%3C/svg%3E") !important;
}


html body.apple-light-v3 {
  /* —— tokens —— */
  --al-bg: #FBFBFD;
  --al-bg-alt: #F5F5F7;
  --al-bg-deep: #FFFFFF;
  --al-card: #FFFFFF;
  --al-ink: #1D1D1F;
  --al-ink-2: #424245;
  --al-ink-3: #6E6E73;
  --al-ink-4: #86868B;
  --al-rule: rgba(0, 0, 0, 0.08);
  --al-rule-hi: rgba(0, 0, 0, 0.14);
  --al-accent: #5b6cff;
  --al-accent-hover: #6d6df2;
  --al-accent-soft: rgba(91, 108, 255, 0.08);
  --al-success: #34C759;
  --al-radius: 18px;
  --al-radius-lg: 28px;
  --al-shadow-s: 0 2px 8px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.04);
  --al-shadow-m: 0 8px 24px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.05);
  --al-shadow-l: 0 18px 48px rgba(0,0,0,0.10), 0 2px 6px rgba(0,0,0,0.05);
  --al-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Inter", "PingFang SC", "Hiragino Sans GB", system-ui, sans-serif;
  --al-mono: "SF Mono", "JetBrains Mono", ui-monospace, "Menlo", monospace;

  /* —— 同时 hijack 旧 apl-* 变量，让既有覆盖层自动跟着翻白 —— */
  --apl-bg-deep: #FFFFFF !important;
  --apl-bg: #FBFBFD !important;
  --apl-glass: #FFFFFF !important;
  --apl-glass-hi: #F5F5F7 !important;
  --apl-rule: rgba(0,0,0,0.08) !important;
  --apl-rule-hi: rgba(0,0,0,0.14) !important;
  --apl-text: #1D1D1F !important;
  --apl-text-2: #424245 !important;
  --apl-text-3: #6E6E73 !important;
  --apl-text-4: #86868B !important;
  --apl-blue: #5b6cff !important;
  --apl-blue-hi: #6d6df2 !important;
  --apl-blue-deep: #004F9F !important;
  --apl-shadow-card: 0 8px 24px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.05) !important;
  --apl-shadow-img: 0 18px 48px rgba(0,0,0,0.10), 0 2px 6px rgba(0,0,0,0.05) !important;
  --apl-shadow-glow: 0 0 0 0.5px rgba(91, 108, 255,0.12), 0 12px 32px rgba(91, 108, 255,0.10) !important;

  background: var(--al-bg) !important;
  color: var(--al-ink) !important;
  font-family: var(--al-sans) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* —— 关掉深色 body::before 太空辉光 —— */
html body.apple-light-v3::before {
  background:
    radial-gradient(ellipse 80% 40% at 50% -8%, rgba(91, 108, 255,0.04) 0%, transparent 60%),
    linear-gradient(180deg, #FFFFFF 0%, #FBFBFD 100%) !important;
}

/* —— Typography ladder —— */
html body.apple-light-v3 h1,
html body.apple-light-v3 h2,
html body.apple-light-v3 h3,
html body.apple-light-v3 h4 {
  font-family: var(--al-sans) !important;
  color: var(--al-ink) !important;
  font-weight: 600 !important;
  letter-spacing: -0.022em !important;
}
html body.apple-light-v3 h1 { letter-spacing: -0.038em !important; font-weight: 700 !important; }

/* —— 顶部导航 frame —— */
html body.apple-light-v3 .frame {
  background: rgba(251, 251, 253, 0.78) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom: 0.5px solid var(--al-rule) !important;
}
html body.apple-light-v3 .mark { color: var(--al-ink) !important; }
html body.apple-light-v3 .mark .dot { background: var(--al-accent) !important; }
html body.apple-light-v3 .mark small { color: var(--al-ink-3) !important; }
html body.apple-light-v3 .tab { color: var(--al-ink-2) !important; }
html body.apple-light-v3 .tab:hover { color: var(--al-ink) !important; background: rgba(0,0,0,0.04) !important; }
html body.apple-light-v3 .tab.active {
  background: var(--al-ink) !important;
  color: #FFFFFF !important;
}

/* ============================================================================
   HERO — Apple product page cinema
   ============================================================================ */
html body.apple-light-v3 section.hero {
  background: var(--al-bg) !important;
  padding: clamp(80px, 12vw, 140px) 0 clamp(72px, 10vw, 120px) !important;
}
html body.apple-light-v3 section.hero h1 {
  font-size: clamp(2.6rem, 7vw, 5.6rem) !important;
  line-height: 1.05 !important;
  color: var(--al-ink) !important;
}
html body.apple-light-v3 section.hero h1 .stroke {
  color: var(--al-accent) !important;
  font-style: normal !important;
  font-weight: 700 !important;
}
html body.apple-light-v3 section.hero h1 .quiet { color: var(--al-ink-3) !important; }
html body.apple-light-v3 section.hero .hero-lead {
  color: var(--al-ink-2) !important;
  font-size: clamp(1.05rem, 1.5vw, 1.35rem) !important;
  line-height: 1.55 !important;
  letter-spacing: -0.012em !important;
  font-weight: 400 !important;
  max-width: 62ch;
}
html body.apple-light-v3 section.hero .hero-lead strong {
  color: var(--al-ink) !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 section.hero .hero-lead-foot {
  color: var(--al-ink-3) !important;
  font-size: 0.92rem !important;
  margin-top: 18px !important;
  display: block;
}

/* hero-meta — Apple style 4-pill micro chips */
html body.apple-light-v3 section.hero .hero-meta {
  display: flex !important;
  flex-wrap: wrap;
  gap: 18px 28px !important;
  margin-bottom: 32px !important;
  font-family: var(--al-mono) !important;
  font-size: 0.74rem !important;
  letter-spacing: 0.04em;
}
html body.apple-light-v3 section.hero .hero-meta > div {
  color: var(--al-ink-3) !important;
  border: 0 !important;
  padding: 0 !important;
  background: none !important;
}
html body.apple-light-v3 section.hero .hero-meta b {
  color: var(--al-ink) !important;
  font-weight: 600 !important;
  font-family: var(--al-mono) !important;
}

/* hero CTAs — Apple pill buttons */
html body.apple-light-v3 .btn-primary,
html body.apple-light-v3 .btn-platform {
  background: var(--al-accent) !important;
  color: #FFFFFF !important;
  border: 0 !important;
  border-radius: 980px !important;
  padding: 14px 26px !important;
  font-weight: 500 !important;
  font-size: 0.98rem !important;
  letter-spacing: -0.01em !important;
  transition: background 0.2s ease, transform 0.15s ease;
  box-shadow: none !important;
}
html body.apple-light-v3 .btn-primary:hover,
html body.apple-light-v3 .btn-platform:hover {
  background: var(--al-accent-hover) !important;
  transform: none !important;
}
html body.apple-light-v3 .btn-platform .ver {
  color: rgba(255,255,255,0.78) !important;
  font-size: 0.78rem !important;
  font-weight: 400;
  font-family: var(--al-mono);
  margin-left: 6px;
}
html body.apple-light-v3 .btn-ghost {
  background: transparent !important;
  color: var(--al-accent) !important;
  border: 0 !important;
  padding: 14px 6px !important;
  font-weight: 500 !important;
  font-size: 0.98rem !important;
  border-radius: 0 !important;
}
html body.apple-light-v3 .btn-ghost:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}
html body.apple-light-v3 .hero-cta-hint {
  color: var(--al-ink-4) !important;
  font-size: 0.82rem !important;
  font-family: var(--al-mono);
}
html body.apple-light-v3 .hero-scroll-cue {
  color: var(--al-ink-4) !important;
}

/* ============================================================================
   VS-BAND — minimal capsule strip
   ============================================================================ */
html body.apple-light-v3 .vs-band {
  background: var(--al-bg-alt) !important;
  padding: 24px 0 !important;
}
html body.apple-light-v3 .vs-strip {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  padding: 8px 0 !important;
}
html body.apple-light-v3 .vs-strip::after { display: none !important; }
html body.apple-light-v3 .vs-mark {
  color: var(--al-accent) !important;
  font-weight: 600 !important;
  font-family: var(--al-mono);
  font-size: 0.78rem;
  letter-spacing: 0.1em;
}
html body.apple-light-v3 .vs-lab { color: var(--al-ink-3) !important; font-size: 0.86rem; }
html body.apple-light-v3 .vs-target { color: var(--al-ink) !important; font-weight: 600; }
html body.apple-light-v3 .vs-arrow { color: var(--al-ink-3) !important; }
html body.apple-light-v3 .vs-pos { color: var(--al-ink-2) !important; font-weight: 400; line-height: 1.6; }
html body.apple-light-v3 .vs-pos b { color: var(--al-ink) !important; font-weight: 600 !important; }
html body.apple-light-v3 .vs-pos em {
  color: var(--al-accent) !important;
  font-style: normal !important;
  font-weight: 500 !important;
}

/* ============================================================================
   SECTIONS — unified rhythm + alternating bg
   ============================================================================ */
html body.apple-light-v3 section.sec {
  padding: clamp(96px, 14vw, 160px) 0 !important;
  border: 0 !important;
  background: var(--al-bg) !important;
  position: relative;
}
html body.apple-light-v3 section.sec:nth-of-type(even) {
  background: var(--al-bg-alt) !important;
}

/* eyebrow + headline ladder */
html body.apple-light-v3 section.sec .section-tag {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 24px !important;
  font-family: var(--al-mono) !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.08em !important;
}
html body.apple-light-v3 section.sec .section-tag .n {
  display: none !important;  /* kill § NN chip - Apple doesn't number sections */
}
html body.apple-light-v3 section.sec .section-tag .l {
  color: var(--al-accent) !important;
  font-weight: 600 !important;
  font-family: var(--al-mono) !important;
  font-size: 0.78rem !important;
  text-transform: uppercase;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
}
html body.apple-light-v3 section.sec .section-h {
  font-size: clamp(2rem, 5vw, 3.8rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.032em !important;
  color: var(--al-ink) !important;
  font-weight: 600 !important;
  margin-bottom: 24px !important;
  max-width: 22ch;
}
html body.apple-light-v3 section.sec .section-h em {
  font-style: normal !important;
  color: var(--al-accent) !important;
  font-weight: 600 !important;
  font-family: var(--al-sans) !important;
}
html body.apple-light-v3 section.sec .section-lead {
  font-size: clamp(1.05rem, 1.5vw, 1.3rem) !important;
  line-height: 1.55 !important;
  color: var(--al-ink-2) !important;
  letter-spacing: -0.012em !important;
  font-weight: 400 !important;
  max-width: 64ch;
  margin-bottom: 56px !important;
}
html body.apple-light-v3 section.sec .section-lead b,
html body.apple-light-v3 section.sec .section-lead strong {
  color: var(--al-ink) !important;
  font-weight: 600 !important;
}

/* ============================================================================
   CARDS — ONE unified pattern across §00 / §01 / §02 / §03 / §05 / §07
   ============================================================================ */
html body.apple-light-v3 .doctrine,
html body.apple-light-v3 .diagnosis-grid .pain,
html body.apple-light-v3 .vs-pain,
html body.apple-light-v3 .feature,
html body.apple-light-v3 .tier,
html body.apple-light-v3 .scenario {
  background: var(--al-card) !important;
  border: 0 !important;
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-s) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 36px 32px !important;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}
html body.apple-light-v3 .doctrine:hover,
html body.apple-light-v3 .vs-pain:hover,
html body.apple-light-v3 .feature:hover,
html body.apple-light-v3 .tier:hover,
html body.apple-light-v3 .scenario:hover {
  box-shadow: var(--al-shadow-m) !important;
  transform: translateY(-2px);
}

/* —— §00 Doctrine cards —— */
html body.apple-light-v3 .doctrine-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}
html body.apple-light-v3 .doctrine-num {
  position: absolute;
  top: 28px; right: 30px;
  font-family: var(--al-sans) !important;
  font-weight: 700 !important;
  font-size: 3.4rem !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
  color: var(--al-rule-hi) !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  opacity: 1 !important;
}
html body.apple-light-v3 .doctrine-tag {
  color: var(--al-accent) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.12em !important;
  margin-bottom: 18px !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .doctrine-h {
  font-family: var(--al-sans) !important;
  font-size: 1.4rem !important;
  line-height: 1.25 !important;
  letter-spacing: -0.024em !important;
  color: var(--al-ink) !important;
  font-weight: 600 !important;
  margin: 0 0 18px !important;
  padding-right: 64px;
}
html body.apple-light-v3 .doctrine-h em {
  color: var(--al-accent) !important;
  font-style: normal !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .doctrine-body {
  color: var(--al-ink-2) !important;
  font-size: 0.96rem !important;
  line-height: 1.65 !important;
}
html body.apple-light-v3 .doctrine-body strong {
  color: var(--al-ink) !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .doctrine-rule {
  background: var(--al-accent-soft) !important;
  border-left: 2px solid var(--al-accent) !important;
  border-radius: 0 8px 8px 0 !important;
  color: var(--al-ink-2) !important;
  font-size: 0.86rem !important;
  line-height: 1.6 !important;
}
html body.apple-light-v3 .doctrine-rule b {
  color: var(--al-ink) !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .doctrine-foil {
  font-family: var(--al-mono) !important;
  color: var(--al-ink-3) !important;
  font-size: 0.74rem !important;
  line-height: 1.6 !important;
  border-top: 1px solid var(--al-rule) !important;
}
html body.apple-light-v3 .doctrine-foot {
  background: var(--al-card) !important;
  border: 1px solid var(--al-rule) !important;
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-s) !important;
  color: var(--al-ink-2) !important;
  font-size: 0.95rem !important;
  line-height: 1.7 !important;
  padding: 24px 28px !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body.apple-light-v3 .doctrine-foot b {
  font-family: var(--al-mono) !important;
  background: var(--al-accent-soft) !important;
  color: var(--al-accent) !important;
  font-size: 0.86em;
  border-radius: 4px;
  padding: 2px 7px;
  font-weight: 600 !important;
}

/* —— §01 Pain (4-grid) — unify with cards —— */
html body.apple-light-v3 .diagnosis-grid {
  border: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 24px !important;
}
html body.apple-light-v3 .diagnosis-grid .pain {
  border: 0 !important;
  padding: 36px 32px !important;
  display: grid !important;
  grid-template-columns: 64px 1fr !important;
  gap: 20px !important;
}
html body.apple-light-v3 .diagnosis-grid .pain .num {
  color: var(--al-accent) !important;
  font-family: var(--al-sans) !important;
  font-weight: 700 !important;
  font-size: 2.4rem !important;
  letter-spacing: -0.04em !important;
}
html body.apple-light-v3 .pain h3 {
  font-family: var(--al-sans) !important;
  font-size: 1.3rem !important;
  letter-spacing: -0.024em !important;
  color: var(--al-ink) !important;
  margin-bottom: 12px !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .pain p {
  color: var(--al-ink-2) !important;
  font-size: 0.95rem !important;
  line-height: 1.65 !important;
}
html body.apple-light-v3 .pain .quote {
  font-family: var(--al-mono) !important;
  color: var(--al-ink-3) !important;
  border-top: 1px solid var(--al-rule) !important;
  font-size: 0.84rem !important;
}
html body.apple-light-v3 .pain-figure,
html body.apple-light-v3 .vs-pain-figure,
html body.apple-light-v3 .feature-figure,
html body.apple-light-v3 .tier-figure,
html body.apple-light-v3 .scenario-figure {
  border-radius: 12px !important;
  overflow: hidden;
}
html body.apple-light-v3 figcaption {
  color: var(--al-ink-3) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.74rem !important;
}
html body.apple-light-v3 figcaption b { color: var(--al-ink) !important; font-weight: 600 !important; }

/* —— VS-pain (3 col) —— */
html body.apple-light-v3 .vs-pain-grid {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}
html body.apple-light-v3 .vs-pain-num {
  color: var(--al-accent) !important;
  font-family: var(--al-sans) !important;
  font-weight: 700 !important;
  font-size: 2.2rem !important;
  letter-spacing: -0.04em !important;
}
html body.apple-light-v3 .vs-pain-tag {
  font-family: var(--al-mono) !important;
  color: var(--al-ink-3) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.1em !important;
  background: rgba(0,0,0,0.04) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  text-transform: uppercase;
}
html body.apple-light-v3 .vs-pain h4 {
  font-family: var(--al-sans) !important;
  font-size: 1.25rem !important;
  letter-spacing: -0.024em !important;
  color: var(--al-ink) !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .vs-pain-body p { color: var(--al-ink-2) !important; font-size: 0.95rem !important; }
html body.apple-light-v3 .vs-pain-body b { color: var(--al-ink) !important; font-weight: 600 !important; }
html body.apple-light-v3 .vs-pain-quote {
  font-family: var(--al-mono) !important;
  color: var(--al-ink-3) !important;
  border-top: 1px solid var(--al-rule) !important;
  font-size: 0.82rem !important;
}
html body.apple-light-v3 .vs-pain-fix {
  background: var(--al-accent-soft) !important;
  border-radius: 12px !important;
  padding: 18px 18px !important;
  border: 0 !important;
}
html body.apple-light-v3 .vs-pain-fix-h {
  color: var(--al-accent) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.12em !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .vs-pain-fix p { color: var(--al-ink-2) !important; font-size: 0.92rem !important; }
html body.apple-light-v3 .vs-pain-fix b { color: var(--al-ink) !important; font-weight: 600 !important; }
html body.apple-light-v3 .vs-pain-fix em {
  color: var(--al-accent) !important;
  font-style: normal !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .vs-pain-fix .ref {
  color: var(--al-ink-3) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.74rem !important;
}
html body.apple-light-v3 .vs-pain-meta {
  color: var(--al-ink-3) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.76rem !important;
}
html body.apple-light-v3 .vs-pain-meta b { color: var(--al-ink) !important; }

/* —— §02 Differentiation feature list (5 rows) → Apple bento grid —— */
html body.apple-light-v3 .feature-list {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px !important;
  border: 0 !important;
}
html body.apple-light-v3 .feature {
  display: grid !important;
  grid-template-columns: 1fr !important;
  border-bottom: 0 !important;
  border: 0 !important;
  gap: 12px !important;
}
html body.apple-light-v3 .feature .k {
  font-family: var(--al-sans) !important;
  font-size: 1.25rem !important;
  letter-spacing: -0.024em !important;
  font-weight: 600 !important;
  color: var(--al-ink) !important;
}
html body.apple-light-v3 .feature .k small {
  display: block;
  font-family: var(--al-mono) !important;
  color: var(--al-accent) !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.12em !important;
  margin-top: 6px;
  text-transform: uppercase;
  font-weight: 500 !important;
}
html body.apple-light-v3 .feature .v {
  color: var(--al-ink-2) !important;
  font-size: 0.96rem !important;
  line-height: 1.65 !important;
}
html body.apple-light-v3 .feature .v strong { color: var(--al-ink) !important; font-weight: 600 !important; }

/* —— §03 Tier (L0/L1/L2) —— */
html body.apple-light-v3 .tier-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}
html body.apple-light-v3 .tier .level {
  color: var(--al-accent) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.12em !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .tier h4 {
  font-family: var(--al-sans) !important;
  font-size: 1.5rem !important;
  color: var(--al-ink) !important;
  letter-spacing: -0.024em !important;
  font-weight: 600 !important;
  margin: 10px 0 6px !important;
}
html body.apple-light-v3 .tier .price {
  color: var(--al-ink-3) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.84rem !important;
}
html body.apple-light-v3 .tier ul { padding: 0 !important; }
html body.apple-light-v3 .tier li {
  border-bottom: 1px solid var(--al-rule) !important;
  color: var(--al-ink-2) !important;
  font-size: 0.92rem !important;
  padding-left: 22px !important;
  position: relative;
}
html body.apple-light-v3 .tier li::before {
  content: '' !important;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--al-accent) !important;
  position: absolute;
  left: 0; top: 14px;
}

/* ============================================================================
   §04 VS-TABLE — Apple data table
   ============================================================================ */
html body.apple-light-v3 .vs-table {
  background: var(--al-card) !important;
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-s) !important;
  overflow: hidden;
  border-collapse: collapse;
  width: 100%;
}
html body.apple-light-v3 .vs-table thead {
  background: var(--al-bg-alt) !important;
}
html body.apple-light-v3 .vs-table th {
  color: var(--al-ink-3) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.74rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase;
  font-weight: 600 !important;
  padding: 18px 24px !important;
  text-align: left;
}
html body.apple-light-v3 .vs-table td {
  padding: 22px 24px !important;
  color: var(--al-ink-2) !important;
  font-size: 0.94rem !important;
  line-height: 1.55 !important;
  border-bottom: 1px solid var(--al-rule) !important;
  border-top: 0 !important;
  background: transparent !important;
}
html body.apple-light-v3 .vs-table tr:last-child td { border-bottom: 0 !important; }
html body.apple-light-v3 .vs-table td strong { color: var(--al-ink) !important; font-weight: 600 !important; }
html body.apple-light-v3 .vs-table tr.us td {
  background: var(--al-accent-soft) !important;
  color: var(--al-ink) !important;
}
html body.apple-light-v3 .vs-table tr.us .pill {
  background: var(--al-accent) !important;
  color: #FFFFFF !important;
  font-family: var(--al-mono) !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.08em !important;
  border-radius: 999px !important;
  padding: 3px 10px !important;
  margin-left: 8px;
}

/* ============================================================================
   §05 Scenarios — clean grid
   ============================================================================ */
html body.apple-light-v3 .scenarios {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}
html body.apple-light-v3 .scenario .when {
  color: var(--al-accent) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.12em !important;
  font-weight: 600 !important;
  text-transform: uppercase;
}
html body.apple-light-v3 .scenario h4 {
  font-family: var(--al-sans) !important;
  font-size: 1.25rem !important;
  letter-spacing: -0.024em !important;
  color: var(--al-ink) !important;
  font-weight: 600 !important;
  margin: 10px 0 14px !important;
}
html body.apple-light-v3 .scenario p {
  color: var(--al-ink-2) !important;
  font-size: 0.95rem !important;
  line-height: 1.65 !important;
}

/* ============================================================================
   §06 Specs — Apple capsule grid
   ============================================================================ */
html body.apple-light-v3 .device-gallery {
  background: var(--al-bg-alt) !important;
  border-radius: var(--al-radius-lg) !important;
  padding: 56px 40px !important;
  border: 0 !important;
}
html body.apple-light-v3 .device-gallery .mc-fig {
  background: transparent !important;
  border: 0 !important;
}
html body.apple-light-v3 .specs {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 32px 40px !important;
  border-top: 1px solid var(--al-rule) !important;
  padding-top: 48px !important;
  margin-top: 48px !important;
}
html body.apple-light-v3 .spec {
  display: flex !important;
  flex-direction: column;
  gap: 8px;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}
html body.apple-light-v3 .spec .label {
  color: var(--al-ink-3) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase;
  font-weight: 500 !important;
}
html body.apple-light-v3 .spec .value {
  color: var(--al-ink) !important;
  font-family: var(--al-sans) !important;
  font-weight: 700 !important;
  font-size: 1.6rem !important;
  letter-spacing: -0.028em !important;
  line-height: 1.1 !important;
}
html body.apple-light-v3 .spec .value small {
  display: block;
  color: var(--al-ink-3) !important;
  font-family: var(--al-sans) !important;
  font-weight: 400 !important;
  font-size: 0.78rem !important;
  letter-spacing: -0.01em;
  margin-top: 6px;
}

/* ============================================================================
   §07 Roadmap + Status-Shipped
   ============================================================================ */
html body.apple-light-v3 .roadmap {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  border-top: 1px solid var(--al-rule) !important;
  border-left: 0 !important;
  background: var(--al-card) !important;
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-s) !important;
  overflow: hidden;
  margin-top: 32px !important;
}
html body.apple-light-v3 .gate {
  padding: 28px 22px !important;
  border-right: 1px solid var(--al-rule) !important;
  background: transparent !important;
  display: flex !important;
  flex-direction: column;
  gap: 8px;
  min-height: 0 !important;
}
html body.apple-light-v3 .gate:last-child { border-right: 0 !important; }
html body.apple-light-v3 .gate .stage {
  color: var(--al-accent) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.1em !important;
  font-weight: 600 !important;
  text-transform: uppercase;
}
html body.apple-light-v3 .gate h4 {
  font-family: var(--al-sans) !important;
  font-size: 1.1rem !important;
  color: var(--al-ink) !important;
  letter-spacing: -0.022em !important;
  margin: 0 !important;
}
html body.apple-light-v3 .gate .body {
  color: var(--al-ink-3) !important;
  font-size: 0.84rem !important;
  line-height: 1.5 !important;
}
html body.apple-light-v3 .gate .chip {
  font-family: var(--al-mono) !important;
  background: rgba(0,0,0,0.06) !important;
  color: var(--al-ink-2) !important;
  font-size: 0.7rem !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  letter-spacing: 0.04em;
  font-weight: 500;
}
html body.apple-light-v3 .gate .chip.live {
  background: var(--al-success) !important;
  color: #FFFFFF !important;
}

/* status-shipped: relight glass card */
html body.apple-light-v3 .status-shipped {
  background: var(--al-card) !important;
  border: 0 !important;
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-s) !important;
  padding: 40px 40px 36px !important;
  margin-top: 48px !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body.apple-light-v3 .status-shipped-h {
  font-family: var(--al-sans) !important;
  font-size: 1.1rem !important;
  letter-spacing: -0.018em !important;
  color: var(--al-ink) !important;
  font-weight: 600 !important;
  padding-bottom: 22px !important;
  border-bottom: 1px solid var(--al-rule) !important;
}
html body.apple-light-v3 .status-shipped-h::before {
  background: var(--al-success) !important;
  box-shadow: 0 0 8px rgba(52,199,89,0.4) !important;
}
html body.apple-light-v3 .status-shipped-grid {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 28px 36px !important;
}
html body.apple-light-v3 .status-shipped-grid .ship {
  border-left: 2px solid var(--al-accent) !important;
  padding-left: 16px !important;
}
html body.apple-light-v3 .status-shipped-grid .ship b {
  color: var(--al-ink) !important;
  font-family: var(--al-sans) !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  letter-spacing: -0.018em !important;
}
html body.apple-light-v3 .status-shipped-grid .ship span {
  color: var(--al-ink-2) !important;
  font-size: 0.88rem !important;
}

/* ============================================================================
   PROTO-BAND — interactive prototype zone (light wrapper, internal untouched)
   ============================================================================ */
html body.apple-light-v3 section.proto-band {
  background: var(--al-bg-alt) !important;
  padding: clamp(80px, 11vw, 120px) 0 !important;
}
html body.apple-light-v3 .proto-intro .lead .caption {
  color: var(--al-accent) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.08em !important;
  font-weight: 600 !important;
  text-transform: uppercase;
}
html body.apple-light-v3 .proto-intro .lead h2 {
  font-size: clamp(1.8rem, 4.4vw, 3rem) !important;
  letter-spacing: -0.028em !important;
  font-weight: 600 !important;
  color: var(--al-ink) !important;
}
html body.apple-light-v3 .proto-intro p {
  color: var(--al-ink-2) !important;
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
}
html body.apple-light-v3 .proto-intro p strong {
  color: var(--al-ink) !important;
  font-weight: 600 !important;
}
html body.apple-light-v3 .proto-hint {
  color: var(--al-ink-3) !important;
  font-family: var(--al-mono) !important;
  font-size: 0.78rem !important;
}
html body.apple-light-v3 .proto-pill {
  background: var(--al-card) !important;
  border: 1px solid var(--al-rule) !important;
  color: var(--al-ink-2) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-family: var(--al-mono);
  font-size: 0.74rem;
}
html body.apple-light-v3 .proto-pill:hover {
  background: var(--al-bg) !important;
  border-color: var(--al-rule-hi) !important;
}

/* ============================================================================
   GLOBAL — prevent any horizontal scroll on mobile + iOS niceties
   ============================================================================ */
html body.apple-light-v3,
html body.apple-light-v3 main {
  overflow-x: hidden !important;
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}
html body.apple-light-v3 * { -webkit-tap-highlight-color: transparent; }
html body.apple-light-v3 img,
html body.apple-light-v3 picture,
html body.apple-light-v3 svg,
html body.apple-light-v3 video {
  max-width: 100% !important;
  height: auto;
}

/* —— Touch-device: kill hover transforms (避免点了卡片"卡住"在 hover state) —— */
@media (hover: none) {
  html body.apple-light-v3 .doctrine:hover,
  html body.apple-light-v3 .vs-pain:hover,
  html body.apple-light-v3 .feature:hover,
  html body.apple-light-v3 .tier:hover,
  html body.apple-light-v3 .scenario:hover,
  html body.apple-light-v3 .pain:hover {
    transform: none !important;
    box-shadow: var(--al-shadow-s) !important;
  }
}

/* ============================================================================
   Mobile responsive — 3 break points: tablet 980 / phone 720 / small 480
   ============================================================================ */

/* —— TABLET (980) —— */
@media (max-width: 980px) {
  html body.apple-light-v3 .doctrine-grid,
  html body.apple-light-v3 .vs-pain-grid,
  html body.apple-light-v3 .tier-grid,
  html body.apple-light-v3 .scenarios,
  html body.apple-light-v3 .feature-list,
  html body.apple-light-v3 .diagnosis-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  html body.apple-light-v3 .specs { grid-template-columns: repeat(2, 1fr) !important; gap: 24px 28px !important; }
  html body.apple-light-v3 .roadmap { grid-template-columns: repeat(2, 1fr) !important; }
  html body.apple-light-v3 .gate { border-bottom: 1px solid var(--al-rule) !important; }
  html body.apple-light-v3 .status-shipped-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 22px 24px !important; }
  html body.apple-light-v3 section.sec { padding: 72px 0 !important; }
  html body.apple-light-v3 section.sec .section-lead { margin-bottom: 36px !important; }
  html body.apple-light-v3 .doctrine,
  html body.apple-light-v3 .diagnosis-grid .pain,
  html body.apple-light-v3 .vs-pain,
  html body.apple-light-v3 .feature,
  html body.apple-light-v3 .tier,
  html body.apple-light-v3 .scenario { padding: 26px 22px !important; }
  html body.apple-light-v3 .device-gallery { padding: 32px 20px !important; }
  html body.apple-light-v3 .doctrine-num { font-size: 2.8rem !important; top: 22px !important; right: 22px !important; }
  html body.apple-light-v3 .doctrine-h { padding-right: 56px !important; font-size: 1.25rem !important; }
}

/* —— PHONE (720) —— */
@media (max-width: 720px) {
  /* Shell — kill the 92vw + extra padding stacking, use ONE consistent gutter */
  html body.apple-light-v3 .shell {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
    box-sizing: border-box !important;
  }
  html body.apple-light-v3 main { padding-left: 0 !important; padding-right: 0 !important; }

  /* Hero — Apple iOS feature page mirror (big hero, tall CTAs, generous space) */
  html body.apple-light-v3 section.hero {
    padding: 68px 0 56px !important;
    text-align: left;
  }
  html body.apple-light-v3 section.hero h1 {
    font-size: clamp(2.2rem, 9vw, 2.8rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.034em !important;
    font-weight: 700 !important;
  }
  html body.apple-light-v3 section.hero .hero-lead {
    font-size: 0.98rem !important;
    line-height: 1.55 !important;
    max-width: 100% !important;
  }
  html body.apple-light-v3 section.hero .hero-lead-foot {
    font-size: 0.84rem !important;
    margin-top: 14px !important;
  }
  html body.apple-light-v3 section.hero .hero-meta {
    flex-direction: column !important;
    gap: 6px !important;
    margin-bottom: 22px !important;
    font-size: 0.7rem !important;
  }
  html body.apple-light-v3 .hero-cta.hero-cta-platforms {
    flex-direction: column !important;
    gap: 10px !important;
    align-items: stretch !important;
  }
  html body.apple-light-v3 .btn-primary,
  html body.apple-light-v3 .btn-platform {
    width: 100% !important;
    min-height: 50px !important;
    padding: 14px 22px !important;
    justify-content: center !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    box-sizing: border-box !important;
  }
  html body.apple-light-v3 .btn-ghost {
    width: 100% !important;
    text-align: center !important;
    min-height: 44px !important;
    padding: 12px 0 !important;
    font-size: 0.98rem !important;
  }
  html body.apple-light-v3 .hero-cta-hint {
    font-size: 0.74rem !important;
    line-height: 1.5 !important;
  }
  html body.apple-light-v3 .hero-scroll-cue { display: none !important; }

  /* VS band — stack the row */
  html body.apple-light-v3 .vs-band { padding: 16px 0 !important; }
  html body.apple-light-v3 .vs-strip {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }
  html body.apple-light-v3 .vs-pos { font-size: 0.88rem !important; line-height: 1.55 !important; }

  /* Sections — Apple iOS feature-page rhythm (big headlines, generous lead-in space) */
  html body.apple-light-v3 section.sec { padding: 72px 0 !important; }
  html body.apple-light-v3 section.sec .section-tag {
    margin-bottom: 16px !important;
    font-size: 0.72rem !important;
  }
  html body.apple-light-v3 section.sec .section-tag .l { font-size: 0.72rem !important; }
  html body.apple-light-v3 section.sec .section-h {
    font-size: clamp(1.75rem, 8vw, 2.4rem) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.028em !important;
    margin-bottom: 18px !important;
    max-width: 100% !important;
    font-weight: 700 !important;
  }
  html body.apple-light-v3 section.sec .section-lead {
    font-size: 1rem !important;
    line-height: 1.55 !important;
    margin-bottom: 32px !important;
  }

  /* Cards — tighter padding */
  html body.apple-light-v3 .doctrine,
  html body.apple-light-v3 .diagnosis-grid .pain,
  html body.apple-light-v3 .vs-pain,
  html body.apple-light-v3 .feature,
  html body.apple-light-v3 .tier,
  html body.apple-light-v3 .scenario {
    padding: 22px 20px !important;
    border-radius: 14px !important;
  }
  html body.apple-light-v3 .doctrine:hover,
  html body.apple-light-v3 .vs-pain:hover,
  html body.apple-light-v3 .feature:hover,
  html body.apple-light-v3 .tier:hover,
  html body.apple-light-v3 .scenario:hover {
    transform: none !important;
  }

  /* §00 doctrine specifics */
  html body.apple-light-v3 .doctrine-num {
    font-size: 2.2rem !important;
    top: 16px !important;
    right: 18px !important;
  }
  html body.apple-light-v3 .doctrine-tag { font-size: 0.66rem !important; margin-bottom: 10px !important; }
  html body.apple-light-v3 .doctrine-h {
    font-size: 1.15rem !important;
    line-height: 1.3 !important;
    padding-right: 48px !important;
    margin-bottom: 12px !important;
  }
  html body.apple-light-v3 .doctrine-body { font-size: 0.92rem !important; line-height: 1.6 !important; }
  html body.apple-light-v3 .doctrine-rule {
    padding: 10px 12px !important;
    font-size: 0.82rem !important;
  }
  html body.apple-light-v3 .doctrine-foil { font-size: 0.7rem !important; padding-top: 10px !important; }
  html body.apple-light-v3 .doctrine-foot {
    padding: 18px 20px !important;
    font-size: 0.88rem !important;
    line-height: 1.6 !important;
    margin-top: 22px !important;
  }

  /* §01 pain — keep image stacked */
  html body.apple-light-v3 .diagnosis-grid .pain {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  html body.apple-light-v3 .diagnosis-grid .pain .num { font-size: 2rem !important; }
  html body.apple-light-v3 .pain h3 { font-size: 1.15rem !important; }
  html body.apple-light-v3 .pain p { font-size: 0.92rem !important; line-height: 1.6 !important; }
  html body.apple-light-v3 .pain .quote { font-size: 0.78rem !important; }

  /* vs-pain */
  html body.apple-light-v3 .vs-pain h4 { font-size: 1.1rem !important; }
  html body.apple-light-v3 .vs-pain-num { font-size: 1.8rem !important; }
  html body.apple-light-v3 .vs-pain-tag { font-size: 0.66rem !important; padding: 3px 10px !important; }
  html body.apple-light-v3 .vs-pain-body p { font-size: 0.92rem !important; }
  html body.apple-light-v3 .vs-pain-fix { padding: 14px 14px !important; }
  html body.apple-light-v3 .vs-pain-fix p { font-size: 0.88rem !important; }

  /* §02 feature */
  html body.apple-light-v3 .feature .k { font-size: 1.1rem !important; }
  html body.apple-light-v3 .feature .v { font-size: 0.92rem !important; }

  /* §03 tier */
  html body.apple-light-v3 .tier h4 { font-size: 1.25rem !important; }
  html body.apple-light-v3 .tier li { font-size: 0.88rem !important; padding-left: 20px !important; }

  /* §04 vs-table — convert to stacked card list */
  html body.apple-light-v3 .vs-table,
  html body.apple-light-v3 .vs-table thead,
  html body.apple-light-v3 .vs-table tbody,
  html body.apple-light-v3 .vs-table tr,
  html body.apple-light-v3 .vs-table td,
  html body.apple-light-v3 .vs-table th {
    display: block !important;
  }
  html body.apple-light-v3 .vs-table thead { display: none !important; }
  html body.apple-light-v3 .vs-table {
    box-shadow: none !important;
    background: transparent !important;
    border-radius: 0 !important;
  }
  html body.apple-light-v3 .vs-table tr {
    background: var(--al-card) !important;
    border-radius: 14px !important;
    box-shadow: var(--al-shadow-s) !important;
    padding: 18px 18px !important;
    margin-bottom: 12px !important;
  }
  html body.apple-light-v3 .vs-table tr.us {
    background: var(--al-accent-soft) !important;
    box-shadow: 0 0 0 1px rgba(91, 108, 255,0.18), var(--al-shadow-s) !important;
  }
  html body.apple-light-v3 .vs-table td {
    padding: 6px 0 !important;
    border: 0 !important;
    font-size: 0.9rem !important;
    width: 100% !important;
  }
  html body.apple-light-v3 .vs-table td:first-child {
    font-size: 1rem !important;
    color: var(--al-ink) !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid var(--al-rule) !important;
    margin-bottom: 8px !important;
  }
  html body.apple-light-v3 .vs-table td strong { font-size: 1.02rem; }

  /* §05 scenarios */
  html body.apple-light-v3 .scenario h4 { font-size: 1.1rem !important; margin: 8px 0 10px !important; }
  html body.apple-light-v3 .scenario p { font-size: 0.92rem !important; }

  /* §06 specs */
  html body.apple-light-v3 .device-gallery {
    padding: 24px 16px !important;
    border-radius: 18px !important;
  }
  html body.apple-light-v3 .specs {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 22px 22px !important;
    padding-top: 28px !important;
    margin-top: 28px !important;
  }
  html body.apple-light-v3 .spec .label { font-size: 0.66rem !important; }
  html body.apple-light-v3 .spec .value { font-size: 1.25rem !important; letter-spacing: -0.022em !important; }
  html body.apple-light-v3 .spec .value small { font-size: 0.72rem !important; margin-top: 4px !important; }

  /* §07 roadmap → vertical stack */
  html body.apple-light-v3 .roadmap {
    grid-template-columns: 1fr !important;
    margin-top: 22px !important;
  }
  html body.apple-light-v3 .gate {
    padding: 18px 18px !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--al-rule) !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: baseline !important;
    gap: 6px 12px !important;
  }
  html body.apple-light-v3 .gate:last-child { border-bottom: 0 !important; }
  html body.apple-light-v3 .gate .stage {
    flex: 0 0 auto !important;
    font-size: 0.66rem !important;
    min-width: 90px !important;
  }
  html body.apple-light-v3 .gate h4 { font-size: 1rem !important; flex: 1 1 auto !important; }
  html body.apple-light-v3 .gate .body {
    flex: 1 1 100% !important;
    font-size: 0.8rem !important;
    color: var(--al-ink-3) !important;
  }
  html body.apple-light-v3 .gate .chip {
    margin-left: auto !important;
    font-size: 0.66rem !important;
    padding: 2px 8px !important;
  }
  html body.apple-light-v3 .status-shipped {
    padding: 24px 22px !important;
    margin-top: 28px !important;
    border-radius: 14px !important;
  }
  html body.apple-light-v3 .status-shipped-h {
    font-size: 0.98rem !important;
    padding-bottom: 16px !important;
    margin-bottom: 18px !important;
  }
  html body.apple-light-v3 .status-shipped-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  html body.apple-light-v3 .status-shipped-grid .ship b { font-size: 0.96rem !important; }
  html body.apple-light-v3 .status-shipped-grid .ship span { font-size: 0.84rem !important; }

  /* proto-band — tighten intro on phone */
  html body.apple-light-v3 section.proto-band { padding: 48px 0 !important; }
  html body.apple-light-v3 .proto-intro .lead h2 { font-size: 1.6rem !important; }
  html body.apple-light-v3 .proto-intro p { font-size: 0.95rem !important; }
  html body.apple-light-v3 .proto-hint { display: none !important; }

  /* device gallery — figures stack */
  html body.apple-light-v3 .device-gallery {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    align-items: center !important;
  }
  html body.apple-light-v3 .device-gallery img,
  html body.apple-light-v3 .device-gallery picture {
    max-width: 100% !important;
    height: auto !important;
    width: auto !important;
  }
  html body.apple-light-v3 .device-gallery figcaption { text-align: center !important; }

  /* —— proto-band 原型区 · 防溢出 + 单卡居中 —— */
  html body.apple-light-v3 section.proto-band {
    overflow-x: hidden !important;
  }
  html body.apple-light-v3 .card-stage-flex {
    flex-direction: column !important;
    align-items: center !important;
    gap: 18px !important;
    max-width: 100% !important;
    padding: 0 !important;
  }
  html body.apple-light-v3 .card-stage-flex > * {
    max-width: 100% !important;
  }
  html body.apple-light-v3 .proto-stage {
    padding: 0 !important;
    overflow: hidden !important;
  }

  /* —— hero-cta 容器 · stack 时按钮间距 —— */
  html body.apple-light-v3 .hero-cta.hero-cta-platforms {
    margin-bottom: 24px !important;
  }

  /* —— 章节标题 max-width 给中文 wrap 留余地 —— */
  html body.apple-light-v3 section.sec .section-h em {
    display: inline !important;
  }

  /* —— vs-strip 包装防溢 —— */
  html body.apple-light-v3 .vs-band > .shell { overflow: hidden; }

  /* —— vs-pain-figure / pain-figure / feature-figure 图片防溢 —— */
  html body.apple-light-v3 figure.mc-fig,
  html body.apple-light-v3 figure.mc-fig img,
  html body.apple-light-v3 figure.mc-fig picture {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
  }

  /* —— Hero meta · 三栏统一字号小化 + 不 wrap 太散 —— */
  html body.apple-light-v3 section.hero .hero-meta {
    gap: 5px !important;
    margin-bottom: 26px !important;
  }
  html body.apple-light-v3 section.hero .hero-meta > div {
    line-height: 1.5 !important;
  }
}

/* —— SMALL PHONE (480) —— */
@media (max-width: 480px) {
  html body.apple-light-v3 .shell {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  html body.apple-light-v3 section.hero { padding: 52px 0 44px !important; }
  html body.apple-light-v3 section.hero h1 {
    font-size: 2rem !important;
    line-height: 1.1 !important;
    letter-spacing: -0.03em !important;
  }
  html body.apple-light-v3 section.hero .hero-lead { font-size: 0.95rem !important; }
  html body.apple-light-v3 section.sec { padding: 56px 0 !important; }
  html body.apple-light-v3 section.sec .section-h {
    font-size: 1.65rem !important;
    line-height: 1.14 !important;
    letter-spacing: -0.026em !important;
  }
  html body.apple-light-v3 section.sec .section-lead { font-size: 0.95rem !important; margin-bottom: 26px !important; }
  html body.apple-light-v3 .doctrine,
  html body.apple-light-v3 .diagnosis-grid .pain,
  html body.apple-light-v3 .vs-pain,
  html body.apple-light-v3 .feature,
  html body.apple-light-v3 .tier,
  html body.apple-light-v3 .scenario {
    padding: 22px 18px !important;
  }
  html body.apple-light-v3 .specs { grid-template-columns: 1fr !important; gap: 20px !important; }
  html body.apple-light-v3 .spec .value { font-size: 1.3rem !important; }
  html body.apple-light-v3 .doctrine-num { font-size: 1.9rem !important; top: 16px !important; right: 16px !important; }
  html body.apple-light-v3 .doctrine-h { padding-right: 44px !important; }
}

/* —— EXTRA SMALL (360 老安卓) —— */
@media (max-width: 360px) {
  html body.apple-light-v3 .shell { padding-left: 14px !important; padding-right: 14px !important; }
  html body.apple-light-v3 section.hero h1 { font-size: 1.8rem !important; }
  html body.apple-light-v3 section.sec .section-h { font-size: 1.5rem !important; }
}


/* ========== v0.7 token：5 套模板配色 ========== */
:root {
  --mc7-paper:        #F5EFE3;
  --mc7-paper-soft:   #ECE5D6;
  --mc7-ink:          #1D1D1F;
  --mc7-ink-sub:      #5C6373;
  --mc7-ink-mute:     #9A9AA3;
  --mc7-hairline:     #D9D2C0;
  --mc7-hero-bg:      #1A1A1F;
  --mc7-hero-fg:      #EFEAD9;
  --mc7-accent-meeting:    #C4433A;
  --mc7-accent-one_on_one: #E08743;
  --mc7-accent-brainstorm: #8E5BD0;
  --mc7-accent-interview:  #2E6BCB;
  --mc7-accent-learning:   #3F8F58;
  --mc7-shadow-card:  0 18px 36px -16px rgba(40,30,15,0.32), 0 4px 12px rgba(40,30,15,0.10);
  --mc7-shadow-stack-2: 0 22px 30px -20px rgba(40,30,15,0.28);
  --mc7-shadow-stack-3: 0 26px 30px -24px rgba(40,30,15,0.22);
  --mc7-font-serif:   "Source Han Serif SC", "Songti SC", "Noto Serif SC", "PingFang SC", "Times New Roman", Georgia, serif;
  --mc7-font-mono:    "SF Mono", "JetBrains Mono", "Cascadia Code", "PingFang SC", ui-monospace, monospace;
}
.mc7-view-toggle { display: inline-flex; background: rgba(40,30,15,0.05); border-radius: 999px; padding: 3px; margin-left: auto; }
.mc7-view-toggle button { border: 0; background: transparent; color: var(--mc7-ink-sub); padding: 5px 12px; font-size: 12px; font-weight: 500; border-radius: 999px; cursor: pointer; font-family: var(--mc7-font-mono); letter-spacing: 0.04em; transition: background 180ms ease, color 180ms ease; }
.mc7-view-toggle button.is-active { background: var(--mc7-ink); color: #fff; box-shadow: 0 2px 8px rgba(0,0,0,0.18); }
.mc7-view-toggle button:not(.is-active):active { background: rgba(40,30,15,0.10); }
.mc-sum-list-h { display: flex !important; align-items: center; }
.mc-sum-list-h .lab { flex: 0 0 auto; }
.mc-sum-list-h .cnt { margin-left: 8px; }
/* v0.7.2 bug fix 2026-06-12: 切到卡片视角时只隐藏 list 的滑动内容，保留 .mc-sum-list-h
   头（含 toggle），否则切到卡片后整个 #mc-sum-list 被 display:none，toggle 一起消失，
   用户回不到列表。 */
[data-mc7-listview="cards"] #mc-sum-list > .mc-sum-swipe,
[data-mc7-listview="cards"] #mc-sum-list > .mc-sum-swipe-dots,
[data-mc7-listview="cards"] #mc-sum-list > .mc-sum-swipe-hint,
[data-mc7-listview="cards"] #mc-sum-list > .mc-sum-rows,
[data-mc7-listview="cards"] #mc-sum-list > .mc-sum-empty { display: none !important; }
[data-mc7-listview="list"] #mc-sum-stack { display: none !important; }
/* v0.7.2 tap-to-open 2026-06-12：进入详情（is-list-mode 移除）时，把卡片堆和列表头都
   藏起来，只露 .phone-summary 详情 + #mc-sum-back 返回按钮。否则 cards 视角进详情会
   看到卡片堆透过来。 */
[data-proto-state="summary"]:not(.is-list-mode) #mc-sum-stack { display: none !important; }

/* 用 vw 强制脱离父容器收缩（实测父容器在 Capacitor WebView 内会被压到 128px） */
#mc-sum-stack { position: relative; margin: 0 auto; padding: 12px 14px 18px; min-height: 440px; perspective: 1400px; user-select: none; width: calc(100vw - 16px) !important; max-width: 380px !important; box-sizing: border-box; }
#mc-sum-stack.is-empty { min-height: auto; padding: 24px 16px; text-align: center; color: var(--mc7-ink-mute); font-size: 13px; }
.mc7-stack-host { position: relative; width: calc(100vw - 44px) !important; max-width: 340px !important; margin: 0 auto; height: 380px; transform-style: preserve-3d; box-sizing: border-box; }
.mc7-stack-shuffle-btn { display: block; margin: 14px auto 0; background: var(--mc7-hero-bg); color: var(--mc7-hero-fg); border: 0; border-radius: 999px; padding: 10px 22px; font-size: 13px; font-family: var(--mc7-font-mono); letter-spacing: 0.08em; cursor: pointer; box-shadow: 0 8px 18px -8px rgba(0,0,0,0.4); transition: transform 160ms ease; }
.mc7-stack-shuffle-btn:active { transform: scale(0.96); }
.mc7-stack-counter { text-align: center; font-family: var(--mc7-font-mono); font-size: 11px; letter-spacing: 0.12em; color: var(--mc7-ink-mute); margin-top: 8px; }

.mc7-card { position: absolute; top:0;right:0;bottom:0;left:0; background: var(--mc7-paper); border-radius: 22px; overflow: hidden; box-shadow: var(--mc7-shadow-card); display: flex; flex-direction: column; will-change: transform, opacity; transform: translate3d(0,0,0); touch-action: none; }
/* v0.7.2 bug fix 2026-06-12: 必须按 data-idx 显式给 z-index，让 idx=0 视觉在顶
   且接收触摸。否则 DOM 顺序让 idx=2 盖住 idx=0，事件绑在 cards[0] 上根本收不到
   touchstart，左右滑动表现为"完全没反应"。 */
.mc7-card[data-idx="0"] { z-index: 3; }
.mc7-card[data-idx="1"] { z-index: 2; background: var(--mc7-paper-soft); box-shadow: var(--mc7-shadow-stack-2); }
.mc7-card[data-idx="2"] { z-index: 1; background: var(--mc7-paper-soft); box-shadow: var(--mc7-shadow-stack-3); }
.mc7-card[data-idx="3"], .mc7-card[data-idx="4"] { display: none; }
.mc7-card.is-flying { pointer-events: none; }
.mc7-card-hero { background: var(--mc7-hero-bg); color: var(--mc7-hero-fg); padding: 14px 18px 16px; position: relative; }
.mc7-card-hero-eyebrow { font-family: var(--mc7-font-mono); font-size: 10px; letter-spacing: 0.16em; opacity: 0.72; margin-bottom: 6px; text-transform: uppercase; }
.mc7-card-hero-eyebrow .dot { display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: currentColor; vertical-align: middle; margin: 0 6px; opacity: 0.6; }
.mc7-card-hero-title { font-family: var(--mc7-font-serif); font-size: 22px; line-height: 1.16; letter-spacing: 0.02em; margin: 0; font-weight: 500; }
.mc7-card-hero-title::after { content: ''; display: block; width: 32px; height: 2.5px; background: var(--mc7-card-accent, var(--mc7-accent-meeting)); margin-top: 8px; border-radius: 2px; }
.mc7-card-body { padding: 12px 18px 14px; flex: 1; overflow-y: auto; font-size: 13px; line-height: 1.55; color: var(--mc7-ink); }
.mc7-card-body::-webkit-scrollbar { width: 0; }
.mc7-meta-line { font-family: var(--mc7-font-mono); font-size: 11px; letter-spacing: 0.06em; color: var(--mc7-ink-mute); }
.mc7-meta-line .sep { margin: 0 6px; opacity: 0.5; }
.mc7-meta-val { font-family: var(--mc7-font-serif); font-size: 15px; color: var(--mc7-ink); margin: 2px 0 12px; }
.mc7-sec-h { font-family: var(--mc7-font-mono); font-size: 11px; letter-spacing: 0.14em; color: var(--mc7-ink-sub); margin: 14px 0 6px; text-transform: lowercase; }
.mc7-sec-h .slash { margin: 0 6px; opacity: 0.5; }
.mc7-bullets { list-style: none; padding: 0; margin: 0; }
.mc7-bullets li { position: relative; padding-left: 16px; margin: 5px 0; font-size: 13px; line-height: 1.55; color: var(--mc7-ink); }
.mc7-bullets li::before { content: ''; position: absolute; left: 0; top: 9px; width: 7px; height: 7px; border-radius: 50%; background: var(--mc7-card-accent, var(--mc7-accent-meeting)); }
.mc7-bullets.is-soft li::before { background: transparent; border: 1.5px solid var(--mc7-ink-mute); width: 5px; height: 5px; left: 1px; top: 10px; }
.mc7-bullets li small { color: var(--mc7-ink-mute); font-size: 12px; }
.mc7-card-cta { display: inline-block; background: var(--mc7-card-accent, var(--mc7-accent-meeting)); color: #fff; border: 0; padding: 8px 18px; border-radius: 999px; font-size: 12.5px; font-weight: 600; margin-top: 14px; cursor: pointer; box-shadow: 0 4px 12px -4px rgba(196,67,58,0.5); }
.mc7-card-cta:active { transform: scale(0.97); }
.mc7-quote { font-family: var(--mc7-font-serif); font-style: italic; font-size: 14px; line-height: 1.6; color: var(--mc7-ink); border-left: 3px solid var(--mc7-card-accent, var(--mc7-accent-meeting)); padding: 4px 12px; margin: 8px 0; background: rgba(0,0,0,0.02); }
.mc7-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.mc7-chip { padding: 4px 10px; border-radius: 999px; font-size: 11.5px; background: rgba(0,0,0,0.04); color: var(--mc7-ink-sub); border: 1px solid var(--mc7-hairline); }
.mc7-chip.is-focus { background: var(--mc7-card-accent, var(--mc7-accent-meeting)); color: #fff; border-color: transparent; }

.mc7-graph-card { background: var(--mc7-paper); border-radius: 18px; padding: 18px 16px 16px; margin-bottom: 14px; box-shadow: 0 8px 24px -12px rgba(40,30,15,0.18); position: relative; overflow: hidden; }
.mc7-graph-eyebrow { font-family: var(--mc7-font-mono); font-size: 10.5px; letter-spacing: 0.16em; color: var(--mc7-ink-mute); text-transform: uppercase; margin-bottom: 10px; }
.mc7-graph-search { display: flex; gap: 6px; align-items: center; margin-bottom: 8px; }
.mc7-graph-search input { flex: 1; border: 1px solid var(--mc7-hairline); background: rgba(255,255,255,0.5); border-radius: 999px; padding: 7px 14px; font-size: 12.5px; color: var(--mc7-ink); font-family: inherit; outline: none; transition: border-color 160ms ease; }
.mc7-graph-search input:focus { border-color: var(--mc7-accent-meeting); background: #fff; }
.mc7-graph-search button { background: var(--mc7-ink); color: #fff; border: 0; padding: 7px 14px; border-radius: 999px; font-size: 12px; font-family: var(--mc7-font-mono); cursor: pointer; }
.mc7-graph-narrative { font-size: 12px; color: var(--mc7-accent-meeting); background: rgba(196,67,58,0.06); border-left: 2px solid var(--mc7-accent-meeting); padding: 6px 10px; margin-bottom: 10px; border-radius: 4px; font-family: var(--mc7-font-serif); display: none; }
.mc7-graph-narrative.is-on { display: block; }
.mc7-graph-svg-wrap { position: relative; width: 100%; aspect-ratio: 360/260; background: #FBF7EB; border-radius: 12px; overflow: hidden; }
.mc7-graph-svg { width: 100%; height: 100%; display: block; }
.mc7-graph-empty { display: flex; align-items: center; justify-content: center; text-align: center; height: 100%; font-size: 12.5px; color: var(--mc7-ink-mute); padding: 24px; line-height: 1.6; }

.mc7-node circle.body { transition: transform 320ms cubic-bezier(.2,1.2,.4,1), filter 200ms ease; cursor: pointer; }
/* v0.7.1 · 顶级视觉设计师重做：mono 7px + tight letter-spacing + 淡灰 fill。
   serif 在 8.5px 太糊；改 SF Mono/JetBrains 类等宽几何字体微小尺寸下保持可读。
   default rank（中段）= ink-mute；top 3 = ink-sub 略加重；不再撑视觉重量。 */
.mc7-node .mc7-node-label { font-size: 6.5px; fill: var(--mc7-ink-mute); pointer-events: none; font-family: var(--mc7-font-mono); letter-spacing: 0.04em; font-weight: 400; }
.mc7-node .mc7-node-label.is-rank-top { fill: var(--mc7-ink-sub); font-weight: 500; }
/* 旧 .mc7-node text 选择器保留兼容（如果有 axis tick 等用到，font-size 走最近的 .mc7-axis-tick）*/
.mc7-node.is-focus circle.body { filter: drop-shadow(0 0 6px rgba(196,67,58,0.55)); }
.mc7-node.is-focus .mc7-node-label { fill: var(--mc7-accent-meeting); font-weight: 500; }
.mc7-node.is-dim circle.body { opacity: 0.25; }
.mc7-node.is-dim .mc7-node-label { opacity: 0.35; }
.mc7-edge { stroke-linecap: round; transition: opacity 200ms; }
.mc7-edge.is-strong { stroke: var(--mc7-accent-meeting); stroke-width: 1.6; opacity: 0.85; }
.mc7-edge.is-weak { stroke: var(--mc7-ink-mute); stroke-width: 0.7; opacity: 0.4; stroke-dasharray: 2 3; }
.mc7-edge.is-dim { opacity: 0.08; }
.mc7-axis-tick { fill: var(--mc7-ink-mute); font-size: 9px; font-family: var(--mc7-font-mono); letter-spacing: 0.06em; }
.mc7-axis-tick.is-now { fill: var(--mc7-accent-meeting); font-weight: bold; }
.mc7-recall-pulse { fill: var(--mc7-accent-meeting); opacity: 0.32; transform-origin: center; animation: mc7Ripple 2.4s ease-out infinite; }
.mc7-recall-pulse.r2 { animation-delay: 0.8s; }
.mc7-recall-pulse.r3 { animation-delay: 1.6s; }
@keyframes mc7Ripple { 0% { transform: scale(0.6); opacity: 0.55; } 100% { transform: scale(2.2); opacity: 0; } }

.mc7-node-sheet { position: fixed; left: 50%; bottom: 0; transform: translateX(-50%) translateY(100%); width: min(420px, 96vw); max-height: 60vh; background: #fff; border-radius: 22px 22px 0 0; padding: 22px 22px 32px; box-shadow: 0 -8px 32px rgba(0,0,0,0.18); z-index: 1600; transition: transform 280ms cubic-bezier(.2,1,.3,1); }
.mc7-node-sheet.is-open { transform: translateX(-50%) translateY(0); }
.mc7-node-sheet-handle { width: 38px; height: 4px; background: #DDD; border-radius: 2px; margin: 0 auto 14px; }
.mc7-node-sheet h4 { font-family: var(--mc7-font-serif); font-size: 20px; margin: 0 0 4px; color: var(--mc7-ink); }
.mc7-node-sheet .kind { font-family: var(--mc7-font-mono); font-size: 10px; letter-spacing: 0.14em; color: var(--mc7-ink-mute); text-transform: uppercase; margin-bottom: 14px; }
.mc7-node-sheet .row { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid #F2F2F4; font-size: 13px; }
.mc7-node-sheet .row:last-child { border-bottom: 0; }
.mc7-node-sheet .row .k { color: var(--mc7-ink-sub); }
.mc7-node-sheet .row .v { color: var(--mc7-ink); font-variant-numeric: tabular-nums; }
.mc7-sheet-backdrop { position: fixed; top:0;right:0;bottom:0;left:0; background: rgba(10,10,15,0.32); z-index: 1599; opacity: 0; pointer-events: none; transition: opacity 220ms ease; }
.mc7-sheet-backdrop.is-open { opacity: 1; pointer-events: auto; }
html.is-embed-android .mc7-node-sheet, html.is-embed-android .mc7-sheet-backdrop { z-index: 2000; }

/* v0.7.1 · 撤回 v0.7 决策：C 端首屏不再露版本号 badge。元素保留供 telemetry
   读 textContent（line 7755 仍写 innerHTML），但视觉隐藏。5-tap 诊断手势仍可用 —
   click hit-test 走 getBoundingClientRect，display:none 元素 rect 为 0，因此把元素
   收为绝对零尺寸但保留在 DOM。 */
html.is-embed-android #mnemo-version-badge {
  position: fixed !important;
  top: 0 !important; right: 0 !important;
  width: 0 !important; height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  background: transparent !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 0 !important;
  z-index: -1 !important;
}

/* Chromium <111 (e.g. board WebView 83) oklch() fallback — added 2026-06-24. Modern engines ignore this @supports block. */
@supports not (color: oklch(0 0 0)) {
  :root {
    --paper: #faf4ec;
    --paper-edge: #f2ece3;
    --cream: #efe6db;
    --ink: #181009;
    --ink-soft: #3e3631;
    --ink-mute: #76706a;
    --ink-faint: #a9a49e;
    --carmine: #ac1922;
    --carmine-deep: #760711;
    --rule: #d7d0c6;
    --rule-faint: #e6e0d8;
  }
  body.dark {
    --paper: #110c08;
    --paper-edge: #1a1511;
    --cream: #1f1915;
    --ink: #f7f1e9;
    --ink-soft: #d0c9c1;
    --ink-mute: #948e87;
    --ink-faint: #5a544e;
    --carmine: #ff6f69;
    --carmine-deep: #c74b47;
    --rule: #37322c;
    --rule-faint: #28231e;
  }
}

/* 2026-06-26 录音按钮优化:网页版去 <br> 换行 + 加宽成单行药丸(修"开始录音换行/按钮太小") */
.phone-recbtn br { display: none !important; }
.phone-recbtn { width: auto !important; min-width: 148px; height: auto !important; min-height: 54px; border-radius: 999px !important; padding: 15px 30px !important; white-space: nowrap !important; font-size: 0.95rem !important; letter-spacing: .5px; gap: 4px; }


/* 2026-06-26 录音首页控件紧凑化:开始录音+导入同一行,提示+时间小字(1-2行) */
.mc-rec-cta { display:flex; gap:10px; justify-content:center; align-items:center; margin:10px 0 0; flex-wrap:wrap; }
.mc-rec-cta .phone-recbtn { margin:0 !important; align-self:center !important; }
.mc-rec-cta #mc-import-audio-btn { margin:0 !important; align-self:center; }
.mc-rec-sub { font-size:.68rem; color:#9aa3af; text-align:center; margin:8px 0 2px; line-height:1.5; }
.mc-rec-sub .phone-rec-label { display:inline !important; font-size:.68rem !important; color:#9aa3af !important; margin:0 !important; }
.mc-rec-sub .phone-rectimer { font-size:.68rem !important; color:#9aa3af !important; font-weight:600; font-family:var(--mono); }

/* 2026-06-30 #4 录音/导入音频 手机端 UI 优化:加大触控目标 + 间距 + 窄屏堆叠 */
@media (max-width: 480px) {
  .mc-rec-cta { gap: 12px; margin: 14px 0 0; }
  .mc-rec-cta #mc-import-audio-btn {
    min-height: 48px !important; padding: 13px 22px !important;
    font-size: 0.95rem !important; border-radius: 999px !important;
  }
  .mc-rec-sub, .mc-rec-sub .phone-rec-label, .mc-rec-sub .phone-rectimer { font-size: 0.74rem !important; }
}
@media (max-width: 360px) {
  .mc-rec-cta { flex-direction: column; gap: 10px; width: 100%; }
  .mc-rec-cta #mc-import-audio-btn { width: 100%; min-height: 46px !important; }
}