// ─── Sheet 内容路由 ───
const { useState: useSS } = React;

function SheetHeader({ icon, eyebrow, title, tone }) {
  const T = useT();
  const c = tone === 'good' ? T.good : tone === 'warn' ? T.warn : tone === 'bad' ? T.bad : T.accent;
  return (
    <div style={{ display: 'flex', alignItems: 'center', gap: 11, marginBottom: 16 }}>
      <div style={{ width: 40, height: 40, borderRadius: 12, background: hexA(c, 0.14), display: 'flex', alignItems: 'center', justifyContent: 'center', flexShrink: 0 }}>
        <Icon name={icon} size={21} color={c} />
      </div>
      <div style={{ flex: 1, minWidth: 0 }}>
        {eyebrow && <div style={{ fontSize: 10.5, fontWeight: 700, letterSpacing: 0.4, color: c, textTransform: 'uppercase' }}>{eyebrow}</div>}
        <div style={{ fontSize: 16, fontWeight: 800, color: T.text, lineHeight: 1.3, marginTop: 1 }}>{title}</div>
      </div>
    </div>
  );
}

// 准备卡详情
function PrepSheet({ name }) {
  const T = useT();
  const { closeSheet, toast, aiName } = useApp();
  const d = PREP[name] || {};
  return (
    <div>
      <SheetHeader icon="doc" eyebrow="AI 已替你准备" title={name} />
      <Block label={`${aiName} 做了什么`} body={d.action} />
      <div style={{ marginBottom: 14 }}>
        <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, marginBottom: 7 }}>产出结果</div>
        <div style={{ background: T.accSoft, border: `1px solid ${T.accLine}`, borderRadius: 12, padding: '12px 14px', fontSize: 13, color: T.text, lineHeight: 1.6 }}>{d.result}</div>
      </div>
      <div style={{ display: 'flex', alignItems: 'center', gap: 8, marginBottom: 14 }}>
        <span style={{ fontSize: 11.5, color: T.sub }}>置信度</span>
        <div style={{ flex: 1, height: 5, borderRadius: 3, background: T.surface2, overflow: 'hidden' }}>
          <div style={{ height: '100%', width: `${d.confidence}%`, background: T.good, borderRadius: 3 }} />
        </div>
        <span style={{ fontSize: 12, fontWeight: 700, color: T.good, fontFamily: NUMF }}>{d.confidence}%</span>
      </div>
      <SourceChips items={d.source} />
      <div style={{ display: 'flex', gap: 10, marginTop: 18 }}>
        {(d.actions || ['用起来']).map((a, i) => (
          i === (d.actions || []).length - 1
            ? <PrimaryButton key={i} icon="send" style={{ flex: 1 }} onClick={() => { toast(a + ' · 已执行'); closeSheet(); }}>{a}</PrimaryButton>
            : <GhostButton key={i} style={{ flex: 1 }} onClick={() => { toast(a + ' · 已执行'); closeSheet(); }}>{a}</GhostButton>
        ))}
      </div>
    </div>
  );
}

// 客户动态全文
function NewsSheet({ date, text }) {
  const T = useT();
  const { aiName: aiNameN } = useApp();
  const d = NEWS_FULL[date] || {};
  return (
    <div>
      <SheetHeader icon="bell" eyebrow={`客户动态 · ${date}`} title={text} />
      <div style={{ marginBottom: 14 }}>
        <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, marginBottom: 7 }}>原文</div>
        <div style={{ fontSize: 13, color: T.text, lineHeight: 1.7 }}>{d.full}</div>
      </div>
      <div style={{ marginBottom: 16 }}>
        <AICard tag="对这单意味着什么" tone="accent" compact title={`${aiNameN} 解读`} body={d.impact} />
      </div>
      <SourceChips items={[d.src]} />
    </div>
  );
}

// 跟进历史信源
function SourceSheet({ date, kind, text }) {
  const T = useT();
  const s = HISTORY_SRC[date] || {};
  return (
    <div>
      <SheetHeader icon="link" eyebrow={`依据信源 · ${date}`} title={s.type || kind} tone="accent" />
      <div style={{ fontSize: 12.5, color: T.sub, marginBottom: 12 }}>{s.detail}</div>
      {s.clip && (
        <div style={{ display: 'flex', alignItems: 'center', gap: 10, background: T.surface2, borderRadius: 12, padding: '11px 13px', marginBottom: 12 }}>
          <Icon name="play" size={16} color={T.accent} />
          <span style={{ fontSize: 12, color: T.text, fontWeight: 600 }}>录音片段 {s.clip}</span>
          <div style={{ flex: 1, height: 3, borderRadius: 2, background: T.line2 }}><div style={{ width: '40%', height: '100%', background: T.accent, borderRadius: 2 }} /></div>
        </div>
      )}
      <div style={{ borderLeft: `3px solid ${T.accent}`, paddingLeft: 13, fontSize: 13.5, color: T.text, lineHeight: 1.6, fontStyle: 'normal' }}>{s.excerpt}</div>
      <div style={{ fontSize: 11, color: T.faint, marginTop: 14 }}>原始记录 · 可回溯到这一刻</div>
    </div>
  );
}

// BANT 编辑
function BantSheet({ k }) {
  const T = useT();
  const { bant, setBantItem, closeSheet, toast } = useApp();
  const b = bant[k] || {};
  const [val, setVal] = useSS(b.value || '');
  return (
    <div>
      <SheetHeader icon="edit" eyebrow={`成交要件 · ${b.label}`} title={`确认「${b.label}」`} tone="good" />
      <div style={{ marginBottom: 12 }}>
        <AICard tag="AI 推断" tone="accent" compact title={b.value} body="销售的判断比 AI 更准。改成你确认的事实，它会立即写回客户档案。" />
      </div>
      <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, marginBottom: 7 }}>你确认的</div>
      <textarea value={val} onChange={e => setVal(e.target.value)} rows={2}
        style={{ width: '100%', boxSizing: 'border-box', border: `1px solid ${T.line2}`, borderRadius: 12, background: T.surface2, color: T.text, fontSize: 14, fontFamily: FONT, padding: '11px 13px', outline: 'none', resize: 'none', lineHeight: 1.5 }} />
      <div style={{ display: 'flex', gap: 10, marginTop: 16 }}>
        <GhostButton style={{ flex: 1 }} onClick={closeSheet}>取消</GhostButton>
        <PrimaryButton icon="lock" tone="good" style={{ flex: 1 }} onClick={() => { setBantItem(k, val); toast('已确认并锁定'); closeSheet(); }}>确认并锁定</PrimaryButton>
      </div>
    </div>
  );
}

// 拓客话术
function PitchSheet({ name }) {
  const T = useT();
  const { closeSheet, toast } = useApp();
  const p = PITCH[name] || {};
  const [val, setVal] = useSS(p.opener || '');
  return (
    <div>
      <SheetHeader icon="message" eyebrow={`接触话术 · ${name}`} title="Janus 起草的开场" />
      <div style={{ fontSize: 11, color: T.sub, marginBottom: 10, display: 'flex', alignItems: 'center', gap: 6 }}>
        <Sparkle size={12} />已织入触发事件 · 建议渠道：{p.via}
      </div>
      <textarea value={val} onChange={e => setVal(e.target.value)} rows={6}
        style={{ width: '100%', boxSizing: 'border-box', border: `1px solid ${T.line2}`, borderRadius: 12, background: T.surface2, color: T.text, fontSize: 13.5, fontFamily: FONT, padding: '12px 14px', outline: 'none', resize: 'none', lineHeight: 1.65 }} />
      <div style={{ display: 'flex', gap: 10, marginTop: 16 }}>
        <GhostButton icon="edit" style={{ flex: 1 }} onClick={() => { toast('已存草稿'); closeSheet(); }}>存草稿</GhostButton>
        <PrimaryButton icon="send" style={{ flex: 1 }} onClick={() => { toast('已发起接触'); closeSheet(); }}>发起接触</PrimaryButton>
      </div>
    </div>
  );
}

// 博弈复盘瞬间
function MomentSheet({ idx }) {
  const T = useT();
  const { closeSheet, toast, addNote, aiName } = useApp();
  const m = REVIEW.lost.moments[idx] || {};
  const [text, setText] = useSS('');
  const [rec, setRec] = useSS(false);
  const chips = ['当时我也察觉了，但没敢推', '下次一定 48h 内闭环', '该早点发展内线'];
  const toggleRec = () => { if (rec) return; setRec(true); setTimeout(() => { setRec(false); setText(t => (t ? t + ' ' : '') + '我当时感觉到李工不对劲，但忙着推方案，没回头跟进，是我的疏忽。'); }, 1700); };
  const save = () => { if (text.trim()) { addNote({ text: '复盘反思 · ' + m.title + '：' + text.trim(), links: [{ type: 'review', name: '广州迈合复盘' }] }); toast('反思已记下，老 A 收到'); } closeSheet(); };
  return (
    <div>
      <SheetHeader icon="review" eyebrow={m.when} title={m.title} tone="bad" />
      <div style={{ fontSize: 13, color: T.text, lineHeight: 1.7, marginBottom: 14 }}>{m.body}</div>
      <div style={{ marginBottom: 16 }}>
        <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, marginBottom: 7 }}>当时该怎么做</div>
        <div style={{ background: T.goodBg, border: `1px solid ${hexA(T.good, 0.25)}`, borderRadius: 12, padding: '12px 14px', display: 'flex', gap: 9, alignItems: 'center' }}>
          <Sparkle size={14} color={T.good} />
          <span style={{ fontSize: 13, color: T.text, fontWeight: 600, lineHeight: 1.45 }}>{m.lesson}</span>
        </div>
      </div>

      {/* 销售自己的反思 · 低门槛引导 */}
      <div style={{ display: 'flex', alignItems: 'center', gap: 7, marginBottom: 8 }}>
        <span style={{ width: 22, height: 22, borderRadius: '50%', background: `linear-gradient(135deg,${T.accent},${T.acc2})`, color: '#fff', fontSize: 10, fontWeight: 800, display: 'flex', alignItems: 'center', justifyContent: 'center', flexShrink: 0 }}>A</span>
        <span style={{ fontSize: 13, fontWeight: 700, color: T.text }}>{aiName}：这一步，你自己怎么看？</span>
      </div>
      <div style={{ fontSize: 11.5, color: T.sub, marginBottom: 10, lineHeight: 1.5 }}>不用写长——一句话、甚至一个词都行。你的判断，比我的复盘更值钱。</div>
      <div style={{ position: 'relative', marginBottom: 9 }}>
        <textarea value={text} onChange={e => setText(e.target.value)} rows={3} placeholder="说一句你的复盘…（也可以点麦克风口述）"
          style={{ width: '100%', boxSizing: 'border-box', border: `1px solid ${rec ? T.accLine : T.line2}`, borderRadius: 12, background: T.surface2, color: T.text, fontSize: 13.5, fontFamily: FONT, padding: '11px 13px', outline: 'none', resize: 'none', lineHeight: 1.6 }} />
        {rec && (
          <div style={{ position: 'absolute', inset: 0, borderRadius: 12, background: hexA(T.accent, 0.08), display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 8 }}>
            <span style={{ display: 'flex', alignItems: 'center', gap: 3 }}>{[0, 1, 2, 3, 4].map(i => <span key={i} style={{ width: 3, height: 14, borderRadius: 2, background: T.accent, animation: `pulse 0.8s ${i * 0.12}s infinite` }} />)}</span>
            <span style={{ fontSize: 12.5, fontWeight: 600, color: T.accent }}>聆听中…</span>
          </div>
        )}
      </div>
      <div style={{ display: 'flex', flexWrap: 'wrap', gap: 7, marginBottom: 16 }}>
        {chips.map((c, i) => (
          <button key={i} onClick={() => setText(c)} style={{ border: `1px solid ${T.line}`, background: T.surface2, color: T.sub, fontSize: 11, fontWeight: 600, padding: '6px 10px', borderRadius: 999, cursor: 'pointer', fontFamily: FONT }}>{c}</button>
        ))}
      </div>

      <div style={{ display: 'flex', gap: 10, alignItems: 'stretch' }}>
        <button onClick={toggleRec} title="语音口述" style={{ width: 50, flexShrink: 0, border: `1px solid ${rec ? 'transparent' : T.line2}`, borderRadius: 12, cursor: 'pointer', background: rec ? `linear-gradient(135deg,${T.accent},${T.acc2})` : T.surface2, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
          <Icon name="mic" size={20} color={rec ? '#fff' : T.text} />
        </button>
        <PrimaryButton icon="check" style={{ flex: 1 }} onClick={save}>记下我的反思</PrimaryButton>
      </div>
      <button onClick={() => { toast('已加入打单手册'); closeSheet(); }} style={{ width: '100%', marginTop: 10, border: 'none', background: 'transparent', color: T.sub, fontSize: 12, fontWeight: 600, fontFamily: FONT, padding: '8px 0', cursor: 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6 }}>
        <Icon name="bolt" size={14} color={T.sub} />仅把老 A 的教训加入打单手册
      </button>
    </div>
  );
}

// 笔记编辑器
const NOTE_TARGETS = [
  { type: 'company', name: '恒升智造' },
  { type: 'person', name: '周凯' },
  { type: 'person', name: '沈蓉' },
  { type: 'person', name: '王磊' },
  { type: 'deal', name: '云脉中台·恒升' },
  { type: 'review', name: '广州迈合复盘' },
];
function NoteSheet({ preLink, note }) {
  const T = useT();
  const { addNote, updateNote, deleteNote, addTask, toast, closeSheet } = useApp();
  const editing = !!note;
  const [text, setText] = useSS(note ? note.text : '');
  const [links, setLinks] = useSS(note ? (note.links || []) : (preLink ? [preLink] : []));
  const [files, setFiles] = useSS(note ? (note.files || []) : []);
  const [rec, setRec] = useSS(false);
  const [confirmDel, setConfirmDel] = useSS(false);
  const fileRef = React.useRef(null);
  const has = (tg) => links.some(l => l.type === tg.type && l.name === tg.name);
  const toggle = (tg) => setLinks(ls => has(tg) ? ls.filter(l => !(l.type === tg.type && l.name === tg.name)) : [...ls, tg]);
  const iconFor = (t) => t === 'company' ? 'building' : t === 'person' ? 'user' : t === 'deal' ? 'funnel' : 'review';
  const onPick = (e) => { const fs = [...(e.target.files || [])].map(f => f.name); if (fs.length) setFiles(x => [...x, ...fs]); e.target.value = ''; };
  const toggleRec = () => {
    if (rec) return;
    setRec(true);
    setTimeout(() => { setRec(false); setText(t => (t ? t + ' ' : '') + '王磊今天语气松动了，金蝶对接他没再追问，可能案例起作用了。'); }, 1800);
  };
  const save = () => {
    if (!text.trim() && !files.length) { closeSheet(); return; }
    if (editing) { updateNote(note.id, { text: text.trim(), links, files }); toast('笔记已更新'); }
    else { addNote({ text: text.trim(), links, files }); toast('笔记已保存'); }
    closeSheet();
  };
  const toTask = () => {
    if (text.trim()) {
      addTask({ text: text.trim().slice(0, 40), cust: (links.find(l => l.type === 'company') || {}).name || '未关联', due: '今天' });
      if (editing && window.QuickNoteApi) window.QuickNoteApi.confirmFirstTask(note).catch(() => {});
      toast('已转为今日任务');
    }
    closeSheet();
  };
  return (
    <div>
      <SheetHeader icon="edit" eyebrow="快速笔记" title={editing ? '编辑笔记' : '记一笔'} />
      <div style={{ position: 'relative' }}>
        <textarea autoFocus value={text} onChange={e => setText(e.target.value)} rows={4} placeholder="你观察到的、客户私下说的、你的直觉判断…&#10;这些会成为 Janus 共析时的上下文。"
          style={{ width: '100%', boxSizing: 'border-box', border: `1px solid ${rec ? T.accLine : T.line2}`, borderRadius: 12, background: T.surface2, color: T.text, fontSize: 14, fontFamily: FONT, padding: '12px 14px', outline: 'none', resize: 'none', lineHeight: 1.6 }} />
        {rec && (
          <div style={{ position: 'absolute', inset: 0, borderRadius: 12, background: hexA(T.accent, 0.08), display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 8 }}>
            <span style={{ display: 'flex', alignItems: 'center', gap: 3 }}>
              {[0, 1, 2, 3, 4].map(i => <span key={i} style={{ width: 3, height: 14, borderRadius: 2, background: T.accent, animation: `pulse 0.8s ${i * 0.12}s infinite` }} />)}
            </span>
            <span style={{ fontSize: 12.5, fontWeight: 600, color: T.accent }}>聆听中… 说完点麦克风停止</span>
          </div>
        )}
      </div>

      <input ref={fileRef} type="file" multiple onChange={onPick} style={{ display: 'none' }} />
      <div style={{ display: 'flex', flexWrap: 'wrap', gap: 7, marginTop: 10 }}>
        {files.map((f, i) => (
          <span key={i} style={{ display: 'inline-flex', alignItems: 'center', gap: 5, fontSize: 11, fontWeight: 600, color: T.text, background: T.surface2, border: `1px solid ${T.line}`, padding: '5px 9px', borderRadius: 8 }}>
            <Icon name="doc" size={12} color={T.accent} />{f.length > 16 ? f.slice(0, 15) + '…' : f}
            <span onClick={() => setFiles(x => x.filter((_, j) => j !== i))} style={{ cursor: 'pointer', color: T.faint, marginLeft: 2 }}>✕</span>
          </span>
        ))}
        <button onClick={() => fileRef.current && fileRef.current.click()} style={{ display: 'flex', alignItems: 'center', gap: 5, background: T.surface2, border: `1px dashed ${T.line2}`, borderRadius: 8, padding: '6px 11px', cursor: 'pointer', color: T.sub, fontSize: 11.5, fontWeight: 600, fontFamily: FONT }}>
          <Icon name="paperclip" size={13} color={T.sub} />上传文件
        </button>
      </div>

      <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, margin: '14px 0 9px', display: 'flex', alignItems: 'center', gap: 6 }}>
        <Icon name="link" size={13} color={T.sub} />关联到（笔记会浮现在对应档案里）
      </div>
      <div style={{ display: 'flex', flexWrap: 'wrap', gap: 8 }}>
        {NOTE_TARGETS.map((tg, i) => {
          const on = has(tg);
          return (
            <button key={i} onClick={() => toggle(tg)} style={{ display: 'flex', alignItems: 'center', gap: 5, border: `1px solid ${on ? T.accLine : T.line}`, background: on ? T.accSoft : T.surface2, color: on ? T.accent : T.sub, fontSize: 11.5, fontWeight: 600, padding: '7px 11px', borderRadius: 999, cursor: 'pointer', fontFamily: FONT }}>
              <Icon name={iconFor(tg.type)} size={13} color={on ? T.accent : T.sub} />{tg.name}
            </button>
          );
        })}
      </div>

      {/* 转任务 / 删除 */}
      <div style={{ display: 'flex', gap: 8, marginTop: 14 }}>
        <button onClick={toTask} style={{ flex: 1, display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6, border: `1px solid ${T.line2}`, background: T.surface2, color: T.text, fontSize: 12.5, fontWeight: 600, fontFamily: FONT, padding: '10px 0', borderRadius: 10, cursor: 'pointer' }}>
          <Icon name="check" size={15} color={T.accent} />转为任务
        </button>
        {editing && (
          <button onClick={() => { if (!confirmDel) { setConfirmDel(true); setTimeout(() => setConfirmDel(false), 3000); return; } deleteNote(note.id); toast('笔记已删除'); closeSheet(); }} style={{ flex: 1, display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6, border: `1px solid ${hexA(T.bad, confirmDel ? 0.6 : 0.3)}`, background: confirmDel ? T.bad : T.badBg, color: confirmDel ? '#fff' : T.bad, fontSize: 12.5, fontWeight: 600, fontFamily: FONT, padding: '10px 0', borderRadius: 10, cursor: 'pointer' }}>
            <Icon name="close" size={15} color={confirmDel ? '#fff' : T.bad} />{confirmDel ? '再点一次确认删除' : '删除'}
          </button>
        )}
      </div>

      <div style={{ display: 'flex', gap: 10, marginTop: 12, alignItems: 'stretch' }}>
        <GhostButton style={{ flex: 1 }} onClick={closeSheet}>取消</GhostButton>
        <button onClick={toggleRec} title="语音输入" style={{ width: 50, flexShrink: 0, border: `1px solid ${rec ? 'transparent' : T.line2}`, borderRadius: 12, cursor: 'pointer', background: rec ? `linear-gradient(135deg,${T.accent},${T.acc2})` : T.surface2, display: 'flex', alignItems: 'center', justifyContent: 'center', fontFamily: FONT }}>
          <Icon name="mic" size={20} color={rec ? '#fff' : T.text} />
        </button>
        <PrimaryButton icon="check" style={{ flex: 2 }} onClick={save}>{editing ? '保存修改' : '保存笔记'}</PrimaryButton>
      </div>
    </div>
  );
}

// 新建 / 编辑任务
function TaskSheet({ task }) {
  const T = useT();
  const { addTask, updateTask, deleteTask, toast, closeSheet } = useApp();
  const editing = !!task;
  const [text, setText] = useSS(task ? task.text : '');
  const [due, setDue] = useSS(task ? task.due : '今天');
  const [cust, setCust] = useSS(task ? task.cust : '恒升智造');
  const [confirmDel, setConfirmDel] = useSS(false);
  const custs = ['恒升智造', '苏州科锐', '上海凌动', '南京远拓', '未关联'];
  const dues = ['今天', '明天', '本周', '下周'];
  const save = () => {
    if (!text.trim()) { closeSheet(); return; }
    if (editing) { updateTask(task.id, { text: text.trim(), due, cust }); toast('任务已更新'); }
    else { addTask({ text: text.trim(), cust, due }); toast('任务已添加'); }
    closeSheet();
  };
  return (
    <div>
      <SheetHeader icon="check" eyebrow={editing ? '编辑任务' : '新建任务'} title={editing ? '改一改这条待办' : '加一项待办'} />
      <textarea autoFocus value={text} onChange={e => setText(e.target.value)} rows={2} placeholder="例如：给沈蓉发分期方案确认函"
        style={{ width: '100%', boxSizing: 'border-box', border: `1px solid ${T.line2}`, borderRadius: 12, background: T.surface2, color: T.text, fontSize: 14, fontFamily: FONT, padding: '12px 14px', outline: 'none', resize: 'none', lineHeight: 1.6 }} />
      <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, margin: '14px 0 8px' }}>关联客户</div>
      <div style={{ display: 'flex', flexWrap: 'wrap', gap: 7 }}>
        {custs.map(c => (
          <button key={c} onClick={() => setCust(c)} style={{ border: `1px solid ${cust === c ? T.accLine : T.line}`, background: cust === c ? T.accSoft : T.surface2, color: cust === c ? T.accent : T.sub, fontSize: 11.5, fontWeight: 600, padding: '6px 11px', borderRadius: 999, cursor: 'pointer', fontFamily: FONT }}>{c}</button>
        ))}
      </div>
      <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, margin: '14px 0 8px' }}>截止</div>
      <div style={{ display: 'flex', gap: 7, flexWrap: 'wrap', alignItems: 'center' }}>
        {dues.map(d => (
          <button key={d} onClick={() => setDue(d)} style={{ border: `1px solid ${due === d ? T.accLine : T.line}`, background: due === d ? T.accSoft : T.surface2, color: due === d ? T.accent : T.sub, fontSize: 11.5, fontWeight: 600, padding: '6px 13px', borderRadius: 999, cursor: 'pointer', fontFamily: FONT }}>{d}</button>
        ))}
        <input type="date" onChange={e => e.target.value && setDue(e.target.value)} style={{ border: `1px solid ${!dues.includes(due) ? T.accLine : T.line}`, background: !dues.includes(due) ? T.accSoft : T.surface2, color: T.text, fontSize: 11.5, fontFamily: FONT, padding: '6px 10px', borderRadius: 999, outline: 'none', colorScheme: T.dark ? 'dark' : 'light' }} />
      </div>
      {!dues.includes(due) && <div style={{ fontSize: 11, color: T.accent, marginTop: 8, fontWeight: 600 }}>截止：{due}</div>}
      {editing && (
        <button onClick={() => { if (!confirmDel) { setConfirmDel(true); setTimeout(() => setConfirmDel(false), 3000); return; } deleteTask(task.id); toast('任务已删除'); closeSheet(); }} style={{ width: '100%', marginTop: 16, display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6, border: `1px solid ${hexA(T.bad, confirmDel ? 0.6 : 0.3)}`, background: confirmDel ? T.bad : T.badBg, color: confirmDel ? '#fff' : T.bad, fontSize: 12.5, fontWeight: 600, fontFamily: FONT, padding: '10px 0', borderRadius: 10, cursor: 'pointer' }}>
          <Icon name="close" size={15} color={confirmDel ? '#fff' : T.bad} />{confirmDel ? '再点一次确认删除' : '删除任务'}
        </button>
      )}
      <div style={{ display: 'flex', gap: 10, marginTop: 12 }}>
        <GhostButton style={{ flex: 1 }} onClick={closeSheet}>取消</GhostButton>
        <PrimaryButton icon="check" style={{ flex: 2 }} onClick={save}>{editing ? '保存修改' : '添加任务'}</PrimaryButton>
      </div>
    </div>
  );
}

// 让 Janus 解读用户投喂的内容
function InterpretSheet() {
  const T = useT();
  const { closeSheet, toast, aiName } = useApp();
  const [val, setVal] = useSS('');
  const [result, setResult] = useSS(null);
  const [loading, setLoading] = useSS(false);
  const run = () => {
    if (!val.trim()) return;
    setLoading(true);
    setTimeout(() => { setLoading(false); setResult(true); }, 1300);
  };
  return (
    <div>
      <SheetHeader icon="eye" eyebrow="让 Janus 解读" title="贴入内容，我来读懂它" />
      <div style={{ fontSize: 12, color: T.sub, marginBottom: 10, lineHeight: 1.5 }}>粘贴链接 / 公告正文 / 朋友圈截图文字，Janus 会告诉你「这条对你这单意味着什么」。</div>
      <textarea value={val} onChange={e => setVal(e.target.value)} rows={4} placeholder="例如：粘贴一条客户高管的发言、招标公告链接、或行业新闻…"
        style={{ width: '100%', boxSizing: 'border-box', border: `1px solid ${T.line2}`, borderRadius: 12, background: T.surface2, color: T.text, fontSize: 13.5, fontFamily: FONT, padding: '12px 14px', outline: 'none', resize: 'none', lineHeight: 1.6 }} />
      <div style={{ display: 'flex', gap: 8, marginTop: 10 }}>
        <button style={{ display: 'flex', alignItems: 'center', gap: 5, background: T.surface2, border: `1px dashed ${T.line2}`, borderRadius: 10, padding: '8px 12px', cursor: 'pointer', color: T.sub, fontSize: 11.5, fontWeight: 600, fontFamily: FONT }}>
          <Icon name="paperclip" size={14} color={T.sub} />上传附件
        </button>
        <span style={{ alignSelf: 'center', fontSize: 11, color: T.faint }}>支持 URL / 文本 / 图片 / PDF</span>
      </div>

      {result && (
        <div style={{ marginTop: 16, animation: 'rise .3s ease both' }}>
          <AICard tag="Janus 解读" tone="accent" title="这条对你这单的意义"
            body="信号偏正面：与恒升「降本增效」主线一致，可作为下一轮强化 ROI 叙事的由头。建议把它关联到客户档案，并在共析时作为新筹码。" />
        </div>
      )}

      <div style={{ display: 'flex', gap: 10, marginTop: 18 }}>
        <GhostButton style={{ flex: 1 }} onClick={closeSheet}>取消</GhostButton>
        {result
          ? <PrimaryButton icon="check" style={{ flex: 2 }} onClick={() => { toast('已加入客户动态'); closeSheet(); }}>加入客户动态</PrimaryButton>
          : <PrimaryButton icon="eye" style={{ flex: 2 }} onClick={run}>{loading ? 'Janus 解读中…' : '让 Janus 解读'}</PrimaryButton>}
      </div>
    </div>
  );
}

// 赢单复盘（赢单基因）
function WonReviewSheet() {
  const T = useT();
  const { closeSheet } = useApp();
  const w = REVIEW.won;
  return (
    <div>
      <SheetHeader icon="handshake" eyebrow={`赢单复盘 · ${w.closed}`} title={w.name} tone="good" />
      <div style={{ display: 'flex', gap: 8, marginBottom: 14 }}>
        <Tag tone="good">{w.amount}</Tag>
        <Tag tone="plain">已签约 · 成交</Tag>
      </div>
      <div style={{ marginBottom: 16 }}>
        <AICard tag="赢单结论" tone="good" title={w.verdict} body={w.takeaway} />
      </div>
      <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, marginBottom: 10 }}>赢单基因 · 3 个做对的动作</div>
      <div style={{ paddingLeft: 2, marginBottom: 14 }}>
        {w.moments.map((m, i, a) => (
          <div key={i} style={{ display: 'flex', gap: 12 }}>
            <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', flexShrink: 0 }}>
              <div style={{ width: 26, height: 26, borderRadius: '50%', background: T.goodBg, color: T.good, display: 'flex', alignItems: 'center', justifyContent: 'center', fontSize: 12, fontWeight: 800, fontFamily: NUMF }}>{i + 1}</div>
              {i < a.length - 1 && <div style={{ width: 1.5, flex: 1, background: T.line, marginTop: 3 }} />}
            </div>
            <div style={{ paddingBottom: 16, flex: 1 }}>
              <div style={{ fontSize: 10.5, color: T.faint, fontWeight: 600, marginBottom: 4 }}>{m.when}</div>
              <div style={{ fontSize: 13.5, fontWeight: 700, color: T.text, lineHeight: 1.4 }}>{m.title}</div>
              <div style={{ fontSize: 12.3, color: T.sub, lineHeight: 1.6, margin: '5px 0 9px' }}>{m.body}</div>
              <div style={{ display: 'flex', gap: 8, alignItems: 'center', background: T.goodBg, borderRadius: 10, padding: '9px 11px' }}>
                <Icon name="bolt" size={13} color={T.good} />
                <span style={{ fontSize: 12, color: T.text, fontWeight: 600, lineHeight: 1.4 }}>基因：{m.gene}</span>
              </div>
            </div>
          </div>
        ))}
      </div>
      <div style={{ display: 'flex', gap: 9, alignItems: 'center', background: T.surface2, borderRadius: 12, padding: '12px 13px' }}>
        <Sparkle size={15} color={T.good} />
        <span style={{ fontSize: 12, color: T.text, lineHeight: 1.5 }}>这 3 条基因已沉淀进你的打单手册，遇到同类局面会自动提醒。</span>
      </div>
    </div>
  );
}

// 辅助
function Block({ label, body }) {
  const T = useT();
  return (
    <div style={{ marginBottom: 14 }}>
      <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, marginBottom: 7 }}>{label}</div>
      <div style={{ fontSize: 13, color: T.text, lineHeight: 1.65 }}>{body}</div>
    </div>
  );
}
function SourceChips({ items }) {
  const T = useT();
  if (!items) return null;
  return (
    <div>
      <div style={{ fontSize: 11, fontWeight: 700, color: T.sub, marginBottom: 8 }}>信源 · 可溯源</div>
      <div style={{ display: 'flex', flexWrap: 'wrap', gap: 7 }}>
        {items.map((s, i) => (
          <span key={i} style={{ display: 'inline-flex', alignItems: 'center', gap: 5, fontSize: 11.5, fontWeight: 600, color: T.sub, background: T.surface2, border: `1px solid ${T.line}`, padding: '5px 10px', borderRadius: 8 }}>
            <Icon name="link" size={12} color={T.accent} />{s}
          </span>
        ))}
      </div>
    </div>
  );
}

function SheetRouter({ type, params }) {
  switch (type) {
    case 'prep': return <PrepSheet {...params} />;
    case 'news': return <NewsSheet {...params} />;
    case 'source': return <SourceSheet {...params} />;
    case 'bant': return <BantSheet {...params} />;
    case 'pitch': return <PitchSheet {...params} />;
    case 'moment': return <MomentSheet {...params} />;
    case 'note': return <NoteSheet {...params} />;
    case 'task': return <TaskSheet {...params} />;
    case 'interpret': return <InterpretSheet {...params} />;
    case 'wonReview': return <WonReviewSheet {...params} />;
    default: return null;
  }
}
window.SheetRouter = SheetRouter;