client.js

/**
 * dsh-study-desk —— 学习工作台（Client 半边）
 *
 * 以 dsh.client bundle 格式加载（跟 dsh-sticker / dsh-meme 同一套 ModuleLoader 机制，
 * 不需要打包器）。注册 id 必须等于 loader entry 名（dsh-study-desk），否则 ModuleLoader
 * 报 "loaded without registering dsh-study-desk"。
 *
 * 视觉约定：一个硬编码颜色都没有——整条 --dsw-alias-* / --dsw-static-* 阶梯都只被消费，
 * 不被覆写。当前主题（catppuccin-mocha + mica 玻璃）换掉，这里所有颜色自动跟着变，
 * 所以看板是「融进主题」而不是「自带一套皮肤」。
 *
 * 挂载点：
 *   sidebar.panellist  → 左侧栏图标（id 与 main 的 key 同名，侧栏自动 dispatch）
 *   main (keyed)       → 整页工作台
 *   shell.overlay      → 右下角常驻迷你计时条（跨面板存活）
 *   settings.section   → 「学习工作台」设置页
 */

window.__ModuleLoader__.load({
  id: 'dsh-study-desk',
  factory: (require) => {
    var module = { exports: {} }
    var exports = module.exports
    Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' })

    const React = require('react')
    const h = React.createElement

    // 迷你条要跳出 shell.overlay 那一层（宿主给它的是 z-index:20 + pointer-events:none，
    // 层内再高的 z-index 也只跟层内比），所以挂到 body 上当作根层叠上下文里的浮层。
    let createPortal = null
    try {
      const ReactDOM = require('react-dom')
      if (ReactDOM && typeof ReactDOM.createPortal === 'function') createPortal = ReactDOM.createPortal
    } catch (error) { /* 拿不到 react-dom 就在槽位里原地渲染 */ }

    function toTopLayer(node) {
      if (!createPortal || !document.body) return node
      return createPortal(node, document.body)
    }

    // -----------------------------------------------------------------------
    // 常量与工具
    // -----------------------------------------------------------------------

    const API = '/api/dsh-study-desk'
    const PANEL_ID = 'study-desk'
    // 单词打卡是第二个独立面板：侧栏一项 + main 一格，id 与 main 的 key 必须同名
    const BBCDC_PANEL_ID = 'study-desk-bbdc'
    const MINI_POS_KEY = 'dsh-study-desk:mini-pos'

    const STATUS_META = [
      { id: 'todo', label: '待办', latin: 'TODO' },
      { id: 'doing', label: '进行中', latin: 'DOING' },
      { id: 'done', label: '已完成', latin: 'DONE' },
    ]

    const GRADES = ['again', 'good', 'easy']
    const GRADE_LABEL = { again: '忘了', good: '记得', easy: '很简单' }

    const WEEKDAYS = ['一', '二', '三', '四', '五', '六', '日']

    function startOfDay(ts) {
      const d = new Date(ts)
      d.setHours(0, 0, 0, 0)
      return d.getTime()
    }

    function addDays(ts, n) {
      const d = new Date(ts)
      d.setDate(d.getDate() + n)
      return d.getTime()
    }

    function dayKey(ts) {
      const d = new Date(ts)
      const p = (n) => String(n).padStart(2, '0')
      return `${d.getFullYear()}-${p(d.getMonth() + 1)}-${p(d.getDate())}`
    }

    function parseDayKey(key) {
      const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(String(key || ''))
      if (!m) return NaN
      return new Date(Number(m[1]), Number(m[2]) - 1, Number(m[3])).getTime()
    }

    function daysUntil(key, now) {
      const t = parseDayKey(key)
      if (!Number.isFinite(t)) return null
      return Math.round((t - startOfDay(now === undefined ? Date.now() : now)) / 86400000)
    }

    function fmtMinutes(min) {
      const n = Math.max(0, Math.round(Number(min) || 0))
      if (n < 60) return n + ' 分钟'
      const hh = Math.floor(n / 60)
      const mm = n % 60
      return mm ? `${hh} 小时 ${mm} 分` : `${hh} 小时`
    }

    function fmtShort(min) {
      const n = Math.max(0, Math.round(Number(min) || 0))
      if (n < 60) return n + 'm'
      const hh = Math.floor(n / 60)
      const mm = n % 60
      return mm ? `${hh}h${mm}` : `${hh}h`
    }

    function fmtClock(ms) {
      const total = Math.max(0, Math.ceil(ms / 1000))
      const m = Math.floor(total / 60)
      const s = total % 60
      return `${String(m).padStart(2, '0')}:${String(s).padStart(2, '0')}`
    }

    /**
     * 墙上时间（不是倒计时）。fmtClock 是「还差多久」的 mm:ss 口径，
     * 拿它渲时间戳会得到 29865200:00 这种荒唐值 —— 两个别混用。
     */
    function fmtStamp(ts) {
      const d = new Date(Number(ts) || 0)
      if (!Number.isFinite(d.getTime())) return '—'
      const p = (n) => String(n).padStart(2, '0')
      return `${d.getFullYear()}-${p(d.getMonth() + 1)}-${p(d.getDate())} ${p(d.getHours())}:${p(d.getMinutes())}`
    }

    /** 复习排期的人话说法：逾期 N 天 / 今天到期 / 明天 / N 天后。 */
    function dueLabel(due, now) {
      if (!due) return ''
      const d = daysUntil(due, now === undefined ? Date.now() : now)
      if (d === null) return due
      if (d < 0) return `逾期 ${-d} 天`
      if (d === 0) return '今天到期'
      if (d === 1) return '明天'
      return `${d} 天后`
    }

    // -----------------------------------------------------------------------
    // 全局 store：宿主是唯一真相源，这里只缓存最近一次快照
    // -----------------------------------------------------------------------

    const store = {
      ready: false,
      error: null,
      state: { tasks: [], sessions: [], reviews: [], journal: {}, timer: null, settings: {} },
      minutes: {},
      todayMinutes: 0,
      streak: 0,
      focusRoundsToday: 0,
      // 派生数据由宿主算好（desk.js 是唯一的算法出处，浏览器里不再实现一遍）
      review: { scheduled: 0, due: 0, dueToday: 0, overdue: 0, doneToday: 0, weekDone: 0 },
      due: [],
      forecast: { days: [], later: 0, total: 0, max: 0 },
      focusPie: null,
      plan: { items: [], due: 0, cap: 10, advice: null },
      tags: [],
      weekly: { weeks: [], goalWeekly: 0 },
      journalLog: [],
      markdownFile: '',
      goal: { label: '', date: '', end: '', note: '', days: null, milestones: [] },
      deskFile: '',
      version: '',
      // 不背单词打卡：宿主只发缓存，刷新是单独一次 op（要拷虚拟机磁盘，不能塞进轮询）
      bbdc: null,
      bbdcBusy: false,
      listeners: new Set(),
      subscribe(fn) {
        this.listeners.add(fn)
        return () => { this.listeners.delete(fn) }
      },
      emit() {
        for (const fn of Array.from(this.listeners)) {
          try { fn() } catch (error) { console.warn('[dsh-study-desk] 渲染回调报错:', error) }
        }
      },
      absorb(json) {
        if (!json || json.ok === false) {
          this.error = (json && json.error) || '接口返回异常'
          this.emit()
          return
        }
        this.error = null
        this.state = json.state || this.state
        this.minutes = json.minutes || {}
        this.todayMinutes = json.todayMinutes || 0
        this.streak = json.streak || 0
        this.focusRoundsToday = json.focusRoundsToday || 0
        this.review = json.review || this.review
        this.due = json.due || []
        this.forecast = json.forecast || this.forecast
        this.focusPie = json.focusPie || this.focusPie
        this.plan = json.plan || this.plan
        this.tags = json.tags || []
        this.weekly = json.weekly || this.weekly
        this.journalLog = json.journal || []
        this.markdownFile = json.markdownFile || ''
        this.goal = json.goal || this.goal
        this.deskFile = json.deskFile || ''
        this.version = json.version || ''
        // bbdc 可能是 null（还没采过），此时保留旧值，避免刷新把已有数据抹掉
        if (json.bbdc) this.bbdc = json.bbdc
        this.ready = true
        this.emit()
      },
      async refresh() {
        try {
          const res = await fetch(API + '?op=state', { cache: 'no-store' })
          this.absorb(await res.json())
        } catch (error) {
          this.error = error && error.message ? error.message : String(error)
          this.emit()
        }
      },
      async apply(op, payload) {
        try {
          const res = await fetch(API, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ op, ...(payload || {}) }),
          })
          const json = await res.json()
          if (json && json.ok === false) console.warn('[dsh-study-desk]', op, json.error)
          this.absorb(json)
          return json
        } catch (error) {
          this.error = error && error.message ? error.message : String(error)
          this.emit()
          return null
        }
      },
      /**
       * 重新采集不背单词打卡。这一步在宿主侧要拷一份 1.3GB 的虚拟机磁盘，
       * 所以：① 只由用户点「刷新」或冷却时间到了才触发；② 一次只跑一个；
       * ③ 结果由宿主写进缓存，下一次轮询的快照就会带上。
       */
      async refreshBbdc() {
        if (this.bbdcBusy) return null
        this.bbdcBusy = true
        this.emit()
        try {
          const res = await fetch(API, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ op: 'bbdc.refresh' }),
          })
          const json = await res.json()
          this.absorb(json)
          return json
        } catch (error) {
          this.error = error && error.message ? error.message : String(error)
          this.emit()
          return null
        } finally {
          this.bbdcBusy = false
          this.emit()
        }
      },
    }

    // -----------------------------------------------------------------------
    // 诊断回传：浏览器里没有能读的控制台，就把异常发回宿主写进磁盘
    // 宿主 /api/dsh-study-desk 的 diag.report 会追加到 <DSH_HOME>/study-desk/client-diag.json
    // -----------------------------------------------------------------------

    const diagSeen = new Set()
    let diagSeq = 0

    function reportDiag(entry) {
      try {
        const key = `${entry.kind || ''}|${entry.where || ''}|${entry.message || ''}`
        if (diagSeen.has(key)) return
        diagSeen.add(key)
        diagSeq += 1
        fetch(API, {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({ op: 'diag.report', seq: diagSeq, at: Date.now(), ...entry }),
        }).catch(() => { /* 诊断通道坏了不能影响主流程 */ })
      } catch (error) { /* 同上 */ }
    }

    function getLayout() {
      if (!clientCtx) return null
      try {
        if (typeof clientCtx.get === 'function') {
          const viaGet = clientCtx.get('layout')
          if (viaGet) return viaGet
        }
      } catch (error) { /* 退到属性访问 */ }
      // ctx 是 Proxy：没在 inject 里声明过的服务，连属性访问都会抛
      // "cannot get property "layout" without inject"，所以这条也必须包一层
      try {
        return clientCtx.layout || null
      } catch (error) {
        return null
      }
    }

    // 渲染炸了要看得见，不能只是白屏
    class Boundary extends React.Component {
      constructor(props) {
        super(props)
        this.state = { error: null }
      }

      static getDerivedStateFromError(error) {
        return { error }
      }

      componentDidCatch(error, info) {
        reportDiag({
          kind: 'render-error',
          where: this.props.where || '未知',
          message: String((error && error.message) || error),
          stack: String((error && error.stack) || '').split('\n').slice(0, 12).join('\n'),
          componentStack: String((info && info.componentStack) || '').split('\n').slice(0, 12).join('\n'),
        })
      }

      render() {
        if (this.state.error) {
          return h('div', { className: 'sd-error' }, [
            h('div', { key: 't' }, `工作台渲染出错（${this.props.where || '未知位置'}）——细节已写进 client-diag.json`),
            h('pre', { key: 's', className: 'sd-error-stack' },
              String((this.state.error && this.state.error.stack) || this.state.error)),
          ])
        }
        return this.props.children
      }
    }

    function tasksIn(status) {
      return store.state.tasks
        .filter((t) => t.status === status)
        .sort((a, b) => (a.order - b.order) || (a.createdAt - b.createdAt))
    }

    // -----------------------------------------------------------------------
    // 番茄钟：本地只负责「按 endsAt 画倒计时」，归零结账交给宿主
    // -----------------------------------------------------------------------

    let audioCtx = null

    function beep(kind) {
      try {
        const Ctor = window.AudioContext || window.webkitAudioContext
        if (!Ctor) return
        if (!audioCtx) audioCtx = new Ctor()
        const t = audioCtx.currentTime
        const osc = audioCtx.createOscillator()
        const gain = audioCtx.createGain()
        osc.type = 'sine'
        osc.frequency.value = kind === 'break' ? 587 : 880
        gain.gain.setValueAtTime(0.0001, t)
        gain.gain.exponentialRampToValueAtTime(0.14, t + 0.02)
        gain.gain.exponentialRampToValueAtTime(0.0001, t + 0.5)
        osc.connect(gain)
        gain.connect(audioCtx.destination)
        osc.start(t)
        osc.stop(t + 0.55)
      } catch { /* 用户没交互过 / 不支持音频就静默跳过 */ }
    }

    function timerRemaining(timer, now) {
      if (!timer) return 0
      if (timer.running) return Math.max(0, timer.endsAt - now)
      return Math.max(0, Number(timer.remainingMs) || 0)
    }

    let watchTimer = 0
    let lastPhase = ''
    let reconciling = false

    function startWatcher() {
      if (watchTimer) return
      watchTimer = setInterval(async () => {
        const timer = store.state.timer
        if (timer && timer.running && timer.endsAt <= Date.now() && !reconciling) {
          reconciling = true
          const wasFocus = timer.kind === 'focus'
          try {
            // 宿主在这次读取时会顺手结账（记 session + 摆下一段），不用客户端自己算
            await store.refresh()
            beep(wasFocus ? 'focusDone' : 'breakDone')
          } finally {
            reconciling = false
          }
        }
        if (timer) {
          const phase = `${timer.kind}:${timer.endsAt}`
          lastPhase = phase
        }
      }, 1000)
    }

    function useTick(ms) {
      const [now, force] = React.useState(() => Date.now())
      React.useEffect(() => {
        const id = setInterval(() => force(Date.now()), ms)
        return () => clearInterval(id)
      }, [ms])
      return now
    }

    function useStore() {
      const [, force] = React.useState(0)
      React.useEffect(() => store.subscribe(() => force((n) => n + 1)), [])
      return store
    }

    function usePoll(ms) {
      React.useEffect(() => {
        store.refresh()
        const id = setInterval(() => {
          if (document.visibilityState === 'visible') store.refresh()
        }, ms)
        return () => clearInterval(id)
      }, [ms])
    }

    // -----------------------------------------------------------------------
    // 共享小组件
    // -----------------------------------------------------------------------

    function Icon({ name, size }) {
      const s = size || 16
      const common = {
        width: s, height: s, viewBox: '0 0 20 20', fill: 'none',
        stroke: 'currentColor', strokeWidth: 1.5, strokeLinecap: 'round', strokeLinejoin: 'round',
        'aria-hidden': true,
      }
      const paths = {
        board: ['M3 4.5h14v11H3z', 'M3 8.5h14', 'M7.5 8.5v7'],
        clock: ['M10 3.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13z', 'M10 6.5v4l2.5 1.5'],
        play: ['M6.5 4.8v10.4l8-5.2z'],
        pause: ['M7 4.8v10.4', 'M13 4.8v10.4'],
        stop: ['M6 6h8v8H6z'],
        plus: ['M10 4.5v11', 'M4.5 10h11'],
        left: ['M12 5.5 7.5 10l4.5 4.5'],
        right: ['M8 5.5 12.5 10 8 14.5'],
        check: ['M4.5 10.5l3.5 3.5 7.5-8'],
        cross: ['M6 6l8 8', 'M14 6l-8 8'],
        flame: ['M10 2.5c3 3.2 4.5 5.6 4.5 8a4.5 4.5 0 0 1-9 0c0-1.6.7-3 1.8-4.3', 'M10 16.5a2.4 2.4 0 0 1-1-4.5'],
        expand: ['M4 8V4h4', 'M16 12v4h-4', 'M4 12v4h4', 'M16 8V4h-4'],
        collapse: ['M8 4v4H4', 'M12 16v-4h4', 'M12 4v4h4', 'M8 16v-4H4'],
        repeat: ['M4.5 9A5.5 5.5 0 0 1 15 6.4', 'M15.5 11A5.5 5.5 0 0 1 5 13.6', 'M15 3.2v3.4h-3.4', 'M5 16.8v-3.4h3.4'],
        pen: ['M13.4 4.2l2.4 2.4L7.6 14.8l-3.2.8.8-3.2z'],
        down: ['M10 3.5v9', 'M6.2 8.8 10 12.6l3.8-3.8', 'M4 16.5h12'],
        up: ['M10 12.5v-9', 'M6.2 7.2 10 3.4l3.8 3.8', 'M4 16.5h12'],
        tag: ['M10.6 3.5H16v5.4l-8 8-5.4-5.4z', 'M13.1 6.4h.01'],
        search: ['M8.8 3.4a5.4 5.4 0 1 0 0 10.8 5.4 5.4 0 0 0 0-10.8z', 'M12.8 12.8l3.7 3.7'],
      }
      const p = paths[name] || paths.board
      return h('svg', common, p.map((d, i) => h('path', { key: i, d })))
    }

    function Progress({ value, max, tone }) {
      const pct = max > 0 ? Math.max(0, Math.min(100, (value / max) * 100)) : 0
      return h('div', { className: 'sd-bar' + (tone ? ' sd-bar-' + tone : '') },
        h('div', { className: 'sd-bar-fill', style: { width: pct + '%' } }))
    }

    // -----------------------------------------------------------------------
    // 顶部：标题 / 倒计时 / 节点 / 今日进度
    // -----------------------------------------------------------------------

    function Head({ now }) {
      const s = useStore()
      const goal = s.goal || {}
      const days = typeof goal.days === 'number' ? goal.days : null
      const daily = Number(s.state.settings.dailyGoalMin) || 180
      const pct = daily > 0 ? Math.round((s.todayMinutes / daily) * 100) : 0
      // 节点的语气与文案由 desk.js 算好；这里只决定摆哪些（太远的和早就结束的别占地方）
      const chips = (goal.milestones || []).filter((m) => m.toEnd >= -3 && m.toStart <= 45)
      const subtitle = [goal.note, goal.date
        ? `${goal.label || '目标'} ${goal.date}${goal.end && goal.end !== goal.date ? ' ~ ' + goal.end : ''}`
        : ''].filter(Boolean).join(' · ')
      return h('header', { className: 'sd-head' }, [
        h('div', { className: 'sd-head-row', key: 'title' }, [
          h('div', { className: 'sd-head-main', key: 'l' }, [
            h('h1', { className: 'sd-title', key: 't' }, '学习工作台'),
            subtitle ? h('div', { className: 'sd-subtitle', key: 's' }, subtitle) : null,
          ]),
          goal.date ? h('div', { className: 'sd-count', key: 'r' }, [
            h('span', { className: 'sd-count-num', key: 'n' }, days === null ? '—' : String(Math.max(0, days))),
            h('span', { className: 'sd-count-cap', key: 'c' }, '天'),
            h('span', { className: 'sd-count-label', key: 'l' }, (days !== null && days < 0 ? '已过 · ' : '距 · ') + (goal.label || '目标')),
          ]) : null,
        ]),
        chips.length
          ? h('div', { className: 'sd-chips', key: 'chips' }, chips.map((c) =>
            h('span', { className: 'sd-chip sd-chip-' + c.tone, key: c.id, title: `${c.label} ${c.start}${c.end !== c.start ? ' ~ ' + c.end : ''}` }, [
              h('b', { key: 'a' }, c.label),
              h('span', { key: 'b' }, c.text),
              c.approx ? h('i', { key: 'c', className: 'sd-chip-approx', title: '这个日期是估的，以官方通知为准' }, '约') : null,
            ])))
          : null,
        h('div', { className: 'sd-head-row sd-head-row-end', key: 'today' }, [
          h('div', { className: 'sd-today', key: 't' }, [
            h('span', { className: 'sd-today-cap', key: 'c' }, '今日专注'),
            h('span', { className: 'sd-today-num', key: 'n' }, fmtMinutes(s.todayMinutes)),
            h('span', { className: 'sd-today-goal', key: 'g' }, `/ ${fmtMinutes(daily)} · ${pct}%`),
            h('div', { className: 'sd-today-bar', key: 'b' }, h(Progress, { value: s.todayMinutes, max: daily })),
          ]),
          h('div', { className: 'sd-today sd-today-streak', key: 's' }, [
            h('span', { className: 'sd-today-cap', key: 'c' }, '连续打卡'),
            h('span', { className: 'sd-today-num', key: 'n' }, String(s.streak)),
            h('span', { className: 'sd-today-goal', key: 'g' }, '天'),
          ]),
          h(MarkdownRow, { key: 'md' }),
        ]),
      ])
    }

    /**
     * Markdown 导出 / 读回：desk.md 落在数据旁边，软链进 Obsidian vault 就能当笔记改，
     * 改完再读回来。读回是「合并」不是「覆盖」，md 里没有的卡不动。
     */
    function MarkdownRow() {
      const s = useStore()
      const [busy, setBusy] = React.useState('')
      const [note, setNote] = React.useState('')
      const fileRef = React.useRef(null)

      const run = async (kind, task, done) => {
        setBusy(kind)
        setNote('')
        try {
          const res = await task()
          setNote(done(res) || '没成功，细节在宿主日志里')
        } catch (error) {
          setNote(String((error && error.message) || error))
        } finally {
          setBusy('')
        }
      }

      return h('div', { className: 'sd-mdrow' }, [
        h('button', {
          key: 'e', className: 'sd-textbtn', disabled: busy !== '',
          title: s.markdownFile ? `写到 ${s.markdownFile}` : '把看板导成一份 Markdown',
          onClick: () => run('export', () => store.apply('markdown.export', {}),
            (res) => (res && res.result ? `已导出：${res.result.file}` : '')),
        }, busy === 'export' ? '导出中…' : [h(Icon, { name: 'down', size: 13, key: 'i' }), h('span', { key: 't' }, ' 导出 Markdown')]),
        h('button', {
          key: 'i', className: 'sd-textbtn', disabled: busy !== '',
          title: '选一份 desk.md，按标题与 id 合并回看板',
          onClick: () => fileRef.current && fileRef.current.click(),
        }, busy === 'import' ? '读回中…' : [h(Icon, { name: 'up', size: 13, key: 'i' }), h('span', { key: 't' }, ' 从 Markdown 读回')]),
        h('input', {
          key: 'f', ref: fileRef, type: 'file', accept: '.md,.markdown,text/markdown,text/plain',
          className: 'sd-hidden-file',
          onChange: (e) => {
            const file = e.target.files && e.target.files[0]
            e.target.value = ''
            if (!file) return
            run('import', async () => store.apply('markdown.import', { markdown: await file.text() }),
              (res) => (res && res.result ? `读回：新增 ${res.result.added} 张、更新 ${res.result.updated} 张` : ''))
          },
        }),
        note ? h('span', { className: 'sd-mdnote', key: 'n', title: note }, note) : null,
      ])
    }

    // -----------------------------------------------------------------------
    // 番茄钟面板
    // -----------------------------------------------------------------------

    function TimerPanel({ now }) {
      const s = useStore()
      useTick(500)
      const timer = s.state.timer
      const settings = s.state.settings || {}
      const remaining = timerRemaining(timer, now)
      const total = timer ? timer.minutes * 60000 : (Number(settings.focusMin) || 25) * 60000
      const isFocus = !timer || timer.kind === 'focus'
      const presets = [25, 45, 60]
      const candidates = store.state.tasks.filter((t) => t.status !== 'done')
      const [picked, setPicked] = React.useState('')
      const [nameDraft, setNameDraft] = React.useState('')
      // 番茄ToDo 规矩：起钟必须先报名字。名字来源三选一——打的字 > 挂的卡标题 > 无（禁用起钟）。
      const pickedTask = candidates.find((t) => t.id === picked)
      const typed = nameDraft.trim().slice(0, 24)
      const effectiveName = typed || (pickedTask ? pickedTask.title : '')
      const subjectChips = (settings.subjects || []).filter((x) => x && x.label).slice(0, 6)

      const start = (minutes) => {
        if (!effectiveName) return
        store.apply('timer.start', {
          minutes,
          kind: 'focus',
          taskId: picked || undefined,
          name: typed || undefined,
        })
        setNameDraft('')
      }

      return h('section', { className: 'sd-timer-card' }, [
        !timer ? h('div', { className: 'sd-timer-name-row', key: 'nr' }, [
          h('input', {
            key: 'n',
            className: 'sd-input wide' + (effectiveName ? '' : ' sd-name-empty'),
            type: 'text',
            value: nameDraft,
            maxLength: 24,
            placeholder: '这段要做什么？如：864 论述练习 / 背单词（起钟必填）',
            onChange: (e) => setNameDraft(e.target.value),
            onKeyDown: (e) => { if (e.key === 'Enter') start(settings.focusMin || 25) },
          }),
          ...subjectChips.map((x) => h('button', {
            key: x.id || x.label,
            className: 'sd-pill sm' + (typed === x.label ? ' on' : ''),
            title: `用「${x.label}」当这段的名字`,
            onClick: () => setNameDraft(typed === x.label ? '' : x.label),
          }, x.label)),
        ]) : null,
        h('div', { className: 'sd-timer-row', key: 'r' }, [
          h('button', {
            key: 'play',
            className: 'sd-iconbtn sd-iconbtn-lg',
            title: timer ? (timer.running ? '暂停' : '继续') : (effectiveName ? '开始专注' : '先给这段起个名字'),
            disabled: !timer && !effectiveName,
            onClick: () => {
              if (!timer) start(settings.focusMin || 25)
              else if (timer.running) store.apply('timer.pause')
              else store.apply('timer.resume')
            },
          }, h(Icon, { name: !timer ? 'play' : timer.running ? 'pause' : 'play', size: 18 })),
          h('div', { className: 'sd-timer-main', key: 'm' }, [
            h('div', { className: 'sd-timer-clock', key: 'c' }, fmtClock(remaining)),
            h('div', { className: 'sd-timer-meta', key: 'k' }, [
              h('span', { className: 'sd-phase' + (isFocus ? ' sd-phase-focus' : ' sd-phase-break'), key: 'p' },
                !timer ? '未开始' : isFocus ? `专注 · 第 ${timer.round} 轮` : '休息'),
              timer && timer.title ? h('span', { className: 'sd-dot', key: 'd' }) : null,
              timer && timer.title ? h('span', { className: 'sd-timer-task', key: 't', title: timer.title }, timer.title) : null,
              !timer && !effectiveName && s.focusRoundsToday ? h('span', { className: 'sd-timer-sub', key: 's' }, `今天已完成 ${s.focusRoundsToday} 轮`) : null,
              !timer && effectiveName ? h('span', { className: 'sd-timer-sub', key: 's2' }, `这段叫「${effectiveName}」`) : null,
            ]),
            h('div', { className: 'sd-timer-bar', key: 'b' },
              h(Progress, { value: total - remaining, max: total, tone: isFocus ? 'brand' : 'muted' })),
          ]),
          h('div', { className: 'sd-timer-side', key: 's' }, [
            timer ? h('button', {
              className: 'sd-iconbtn', title: '结束这一段（按实际时长记账）', onClick: () => store.apply('timer.complete'),
            }, h(Icon, { name: 'stop' })) : null,
            timer && isFocus && !timer.running ? h('button', {
              className: 'sd-textbtn', title: '跳过这一段', onClick: () => store.apply('timer.reset'),
            }, '放弃') : null,
          ]),
        ]),
        h('div', { className: 'sd-timer-foot', key: 'f' }, [
          !timer
            ? h('div', { className: 'sd-row', key: 'p' }, [
              h('span', { className: 'sd-mini-cap', key: 'c' }, '时长'),
              ...presets.map((m) => h('button', {
                key: m, className: 'sd-pill' + ((settings.focusMin || 25) === m ? ' on' : ''),
                disabled: !effectiveName,
                title: effectiveName ? `开始 ${m} 分钟` : '先给这段起个名字',
                onClick: () => store.apply('settings.update', { patch: { focusMin: m } }).then(() => start(m)),
              }, `${m} 分钟`)),
            ])
            : h('div', { className: 'sd-row', key: 'p' }, [
              h('span', { className: 'sd-mini-cap', key: 'c' }, '这一轮第 ' + (timer.round || 1)),
            ]),
          h('div', { className: 'sd-row sd-row-end', key: 'a' }, [
            h('span', { className: 'sd-mini-cap', key: 'c' }, '挂到'),
            h('select', {
              className: 'sd-select',
              value: timer && timer.taskId ? timer.taskId : picked,
              disabled: !!timer,
              onChange: (e) => setPicked(e.target.value),
            }, [
              h('option', { key: '', value: '' }, '不指定'),
              ...candidates.map((t) => h('option', { key: t.id, value: t.id }, t.title)),
            ]),
          ]),
        ]),
      ])
    }

    // -----------------------------------------------------------------------
    // 热力图
    // -----------------------------------------------------------------------

    function Heatmap({ now }) {
      const s = useStore()
      const settings = s.state.settings || {}
      const weeksCount = Number(settings.heatmapWeeks) || 26
      const [range, setRange] = React.useState(weeksCount)

      const byDay = React.useMemo(() => {
        const map = new Map()
        const count = new Map()
        for (const x of s.state.sessions) {
          if (x.kind !== 'focus') continue
          const k = dayKey(x.at)
          map.set(k, (map.get(k) || 0) + x.minutes)
          count.set(k, (count.get(k) || 0) + 1)
        }
        return { map, count }
      }, [s.state.sessions])

      const goal = Number(settings.dailyGoalMin) || 180

      const grid = React.useMemo(() => {
        const today = startOfDay(now)
        const weekday = (new Date(today).getDay() + 6) % 7
        const lastMonday = addDays(today, -weekday)
        const cols = []
        for (let w = range - 1; w >= 0; w -= 1) {
          const monday = addDays(lastMonday, -7 * w)
          const days = []
          for (let d = 0; d < 7; d += 1) {
            const ts = addDays(monday, d)
            if (ts > today) { days.push(null); continue }
            const key = dayKey(ts)
            const minutes = byDay.map.get(key) || 0
            let level = 0
            if (minutes > 0) {
              if (minutes < goal * 0.25) level = 1
              else if (minutes < goal * 0.5) level = 2
              else if (minutes < goal) level = 3
              else level = 4
            }
            days.push({ key, ts, minutes, count: byDay.count.get(key) || 0, level })
          }
          cols.push({ monday, days })
        }
        const months = []
        let seen = -1
        cols.forEach((col, i) => {
          const first = col.days.find((d) => d && new Date(d.ts).getDate() === 1)
          if (first) {
            const m = new Date(first.ts).getMonth()
            if (m !== seen) { seen = m; months.push({ i, label: `${m + 1}月` }) }
          }
        })
        let total = 0
        let active = 0
        for (const col of cols) for (const d of col.days) { if (d) { total += d.minutes; if (d.minutes > 0) active += 1 } }
        return { cols, months, total, active }
      }, [range, byDay, goal, now])

      const template = `22px repeat(${grid.cols.length}, 13px)`

      return h('section', { className: 'sd-card-block' }, [
        h('div', { className: 'sd-block-head', key: 'h' }, [
          h('h2', { className: 'sd-block-title', key: 't' }, '学习热力图'),
          h('span', { className: 'sd-block-sub', key: 's' },
            `近 ${range} 周 · 共 ${fmtMinutes(grid.total)} · 学习 ${grid.active} 天`),
          h('div', { className: 'sd-row sd-row-end', key: 'r' },
            [13, 26, 53].map((w) => h('button', {
              key: w, className: 'sd-pill sm' + (range === w ? ' on' : ''),
              onClick: () => { setRange(w); store.apply('settings.update', { patch: { heatmapWeeks: w } }) },
            }, `${w} 周`))),
        ]),
        h('div', { className: 'sd-heat-scroll', key: 'g' },
          h('div', { className: 'sd-heat', style: { gridTemplateColumns: template } }, [
            h('div', { className: 'sd-heat-corner', key: 'corner', style: { gridColumn: 1, gridRow: 1 } }),
            ...grid.months.map((m, idx) => h('div', {
              key: 'm' + idx,
              className: 'sd-heat-month',
              style: { gridColumn: m.i + 2, gridRow: 1, gridColumnEnd: `span ${Math.min(4, grid.cols.length - m.i)}` },
            }, m.label)),
            ...WEEKDAYS.map((label, di) => (di % 2 === 0
              ? h('div', { key: 'w' + di, className: 'sd-heat-day', style: { gridColumn: 1, gridRow: di + 2 } }, label)
              : null)),
            ...grid.cols.flatMap((col, wi) => col.days.map((d, di) => h('div', {
              key: `${wi}-${di}`,
              className: 'sd-cell' + (d ? ' lv' + d.level + (d.key === dayKey(now) ? ' today' : '') : ' empty'),
              style: { gridColumn: wi + 2, gridRow: di + 2 },
              title: d ? `${d.key} · 专注 ${d.minutes} 分钟${d.count ? ` · ${d.count} 段` : ''}` : '',
            }))),
          ])),
        h('div', { className: 'sd-heat-foot', key: 'f' }, [
          h('span', { className: 'sd-heat-note', key: 'n' },
            `点亮条件：当天实际复习满 1 分钟；越亮 = 越接近每日 ${fmtMinutes(goal)} 的目标`),
          h('span', { className: 'sd-legend', key: 'l' }, [
            h('span', { key: 'a' }, '少'),
            ...[0, 1, 2, 3, 4].map((lv) => h('i', { key: lv, className: 'sd-cell legend lv' + lv })),
            h('span', { key: 'b' }, '多'),
          ]),
        ]),
      ])
    }

    // -----------------------------------------------------------------------
    // 单词打卡（不背单词 · 独立面板）
    // -----------------------------------------------------------------------

    // 月历的排布只在浏览器里做：宿主只发「哪些天打过卡」的日期数组（一次几 KB），
    // 日历长什么样随主题与宽度在这里定，宿主不用为画法负责。
    function ymOf(ts) {
      const d = new Date(ts)
      return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}`
    }

    function shiftYm(ym, delta) {
      const m = /^(\d{4})-(\d{2})$/.exec(String(ym || ''))
      if (!m) return ym
      const d = new Date(Number(m[1]), Number(m[2]) - 1 + delta, 1)
      return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}`
    }

    /** 一个月排成「周一开头」的格子，前面空位补 null */
    function monthCells(ym, signed, todayKey) {
      const m = /^(\d{4})-(\d{2})$/.exec(String(ym || ''))
      if (!m) return []
      const y = Number(m[1])
      const mo = Number(m[2])
      const lead = (new Date(y, mo - 1, 1).getDay() + 6) % 7
      const days = new Date(y, mo, 0).getDate()
      const cells = []
      for (let i = 0; i < lead; i += 1) cells.push(null)
      for (let d = 1; d <= days; d += 1) {
        const key = `${ym}-${String(d).padStart(2, '0')}`
        cells.push({
          key,
          day: d,
          on: signed.has(key),
          today: key === todayKey,
          future: todayKey ? key > todayKey : false,
        })
      }
      while (cells.length % 7 !== 0) cells.push(null)
      return cells
    }

    function BbdcStat({ label, value, unit, tone }) {
      return h('div', { className: 'sd-bstat' }, [
        h('div', { className: 'sd-bstat-label', key: 'l' }, label),
        h('div', { className: 'sd-bstat-value', key: 'v' }, [
          h('b', { key: 'n', className: tone ? `sd-bstat-num sd-bstat-${tone}` : 'sd-bstat-num' }, String(value)),
          unit ? h('span', { key: 'u', className: 'sd-bstat-unit' }, unit) : null,
        ]),
      ])
    }

    function BbdcPanel({ now }) {
      const s = useStore()
      usePoll(20000)
      const b = s.bbdc
      const [ym, setYm] = React.useState(null)
      const autoRef = React.useRef(0)

      // 采集要拷一份 1.3GB 的虚拟机磁盘，绝不能塞进 20 秒的轮询里。
      // 所以这里只做「兜底补采」：缓存超过 15 分钟、且距上次自动尝试满 10 分钟才动一次。
      const fetchedAt = b && b.fetchedAt ? b.fetchedAt : 0
      React.useEffect(() => {
        const stale = !fetchedAt || Date.now() - fetchedAt > 15 * 60 * 1000
        if (!stale || s.bbdcBusy) return
        if (Date.now() - autoRef.current < 10 * 60 * 1000) return
        autoRef.current = Date.now()
        s.refreshBbdc()
      }, [fetchedAt, s.bbdcBusy])

      const head = h('header', { className: 'sd-head', key: 'head' }, [
        h('div', { className: 'sd-head-row', key: 'r' }, [
          h('div', { className: 'sd-head-main', key: 'm' }, [
            h('h1', { className: 'sd-title', key: 't' }, '单词打卡'),
            h('p', { className: 'sd-subtitle', key: 's' },
              '不背单词 · 从本机 App 里读，不用登录网页端'),
          ]),
          h('div', { className: 'sd-row sd-row-end', key: 'a' }, [
            h('button', {
              key: 'refresh',
              className: 'sd-pill' + (s.bbdcBusy ? ' busy' : ''),
              disabled: s.bbdcBusy,
              onClick: () => s.refreshBbdc(),
            }, s.bbdcBusy ? '采集中…' : '刷新'),
          ]),
        ]),
      ])

      if (!b) {
        return h('div', { className: 'sd-panel' }, [
          h('div', { className: 'sd-scroll', key: 's' },
            h('div', { className: 'sd-page', key: 'c' }, [
              head,
              h('section', { className: 'sd-card-block', key: 'empty' }, [
                h('div', { className: 'sd-block-head', key: 'h' },
                  h('h2', { className: 'sd-block-title', key: 't' }, '还没有采集过')),
                h('div', { className: 'sd-empty-block', key: 'e' },
                  s.bbdcBusy
                    ? '正在读本机的不背单词数据（要拷一份虚拟机磁盘，几秒钟）…'
                    : '点右上角「刷新」读一次。需要 Androws 里装过、登录过不背单词。'),
              ]),
            ])),
        ])
      }

      const signed = new Set((b.calendar && b.calendar.signedDates) || [])
      const todayKey = dayKey(now)
      const effectiveYm = ym || (b.calendar && b.calendar.month) || ymOf(now)
      const minYm = (b.calendar && b.calendar.minMonth) || effectiveYm
      const maxYm = (b.calendar && b.calendar.maxMonth) || effectiveYm
      const cells = monthCells(effectiveYm, signed, todayKey)
      const monthSigned = (b.calendar && b.calendar.signedDates || []).filter((d) => d.startsWith(effectiveYm)).length

      const cloud = b.cloud || null
      const cloudToday = cloud && cloud.today ? cloud.today : null
      const todayWords = cloudToday
        ? (Number(cloudToday.learnNum) || 0) + (Number(cloudToday.reviewNum) || 0)
        : ((b.today && b.today.words) || 0)
      const todayMin = (b.today && b.today.durationMin) || 0
      const totalWords = cloud && cloud.ok && cloud.totalWords !== null && cloud.totalWords !== undefined
        ? cloud.totalWords : null
      const totalMin = (b.total && b.total.durationMin) || 0
      const u = b.user || {}

      // 最近 7 天的复习次数与时长，按日期把两份列表对齐
      const recent = []
      if (cloud) {
        const dur = new Map((cloud.recentDuration || []).map((x) => [x.date, Number(x.duration) || 0]))
        for (const x of cloud.recent || []) {
          recent.push({ date: x.date, reviews: Number(x.reviewNum) || 0, minutes: dur.get(x.date) || 0 })
        }
      }
      const maxReviews = recent.reduce((a, x) => Math.max(a, x.reviews), 0)

      const sourceLabel = { 'app-local': '本机 App', 'learnywhere-api': '服务端' }
      const sourceText = (b.source || []).map((x) => sourceLabel[x] || x).join(' + ')
      const whenText = b.fetchedAt ? fmtStamp(b.fetchedAt) : '—'

      return h('div', { className: 'sd-panel' }, [
        h('div', { className: 'sd-scroll', key: 's' },
          h('div', { className: 'sd-page', key: 'c' }, [
            head,
            !b.ok && b.error
              ? h('div', { className: 'sd-error', key: 'err' }, '这次没采到：' + b.error)
              : null,
            cloud && cloud.error
              ? h('div', { className: 'sd-error', key: 'cerr' }, '服务端数据没拿到：' + cloud.error)
              : null,

            // 概览：四格，与 App 里「统计」页的排布一致
            h('section', { className: 'sd-card-block', key: 'overview' }, [
              h('div', { className: 'sd-block-head', key: 'h' }, [
                h('h2', { className: 'sd-block-title', key: 't' }, '概览'),
                h('span', { className: 'sd-block-sub', key: 's' },
                  `采集于 ${whenText}${sourceText ? ` · ${sourceText}` : ''}`),
              ]),
              h('div', { className: 'sd-bgrid', key: 'g' }, [
                h(BbdcStat, { key: 'tw', label: '今日学习&复习', value: todayWords, unit: '词' }),
                h(BbdcStat, { key: 'tm', label: '今日时长', value: todayMin, unit: '分钟' }),
                h(BbdcStat, {
                  key: 'aw',
                  label: '累计学习',
                  value: totalWords === null ? '—' : totalWords,
                  unit: totalWords === null ? null : '词',
                  tone: 'brand',
                }),
                h(BbdcStat, { key: 'am', label: '累计时长', value: totalMin, unit: '分钟', tone: 'brand' }),
              ]),
              cloud && cloud.months
                ? h('div', { className: 'sd-block-sub', key: 'note' },
                    `累计词数来自 ${cloud.months} 个月的逐月记录相加（接口本身不返回总数）；累计复习 ${cloud.totalReviews} 次`)
                : null,
            ]),

            // 打卡日历
            h('section', { className: 'sd-card-block', key: 'calendar' }, [
              h('div', { className: 'sd-block-head', key: 'h' }, [
                h('h2', { className: 'sd-block-title', key: 't' }, '打卡日历'),
                h('span', { className: 'sd-block-sub', key: 's' },
                  `本月打卡 ${monthSigned} 天${u.continuousDays ? ` · 连续 ${u.continuousDays} 天` : ''}${u.totalDays ? ` · 累计 ${u.totalDays} 天` : ''}`),
                h('div', { className: 'sd-row sd-row-end', key: 'r' }, [
                  h('button', {
                    key: 'prev', className: 'sd-pill sm',
                    disabled: effectiveYm <= minYm,
                    onClick: () => setYm(shiftYm(effectiveYm, -1)),
                  }, '‹'),
                  h('span', { key: 'ym', className: 'sd-bcal-ym' }, effectiveYm),
                  h('button', {
                    key: 'next', className: 'sd-pill sm',
                    disabled: effectiveYm >= maxYm,
                    onClick: () => setYm(shiftYm(effectiveYm, 1)),
                  }, '›'),
                ]),
              ]),
              h('div', { className: 'sd-bcal', key: 'g' }, [
                ...WEEKDAYS.map((label, i) => h('div', { key: 'h' + i, className: 'sd-bcal-head' }, label)),
                ...cells.map((c, i) => (c
                  ? h('div', {
                      key: c.key,
                      className: 'sd-bcal-cell' + (c.on ? ' on' : '') + (c.today ? ' today' : '') + (c.future ? ' future' : ''),
                      title: `${c.key}${c.on ? ' · 已打卡' : ' · 未打卡'}`,
                    }, String(c.day))
                  : h('div', { key: 'b' + i, className: 'sd-bcal-cell blank' }))),
              ]),
              h('div', { className: 'sd-heat-foot', key: 'f' }, [
                h('span', { key: 'n', className: 'sd-heat-note' },
                  b.checkIn && b.checkIn.lastDate ? `最近一次打卡 ${b.checkIn.lastDate}` : '还没有打卡记录'),
                h('span', { key: 'l', className: 'sd-legend' }, [
                  h('i', { key: 'a', className: 'sd-bcal-cell on legend' }),
                  h('span', { key: 'b' }, '已打卡'),
                  h('i', { key: 'c', className: 'sd-bcal-cell legend' }),
                  h('span', { key: 'd' }, '未打卡'),
                ]),
              ]),
            ]),

            h('div', { className: 'sd-two', key: 'two' }, [
              // 正在学
              h('section', { className: 'sd-card-block', key: 'book' }, [
                h('div', { className: 'sd-block-head', key: 'h' },
                  h('h2', { className: 'sd-block-title', key: 't' }, '正在学')),
                b.book
                  ? h('div', { className: 'sd-book', key: 'b' }, [
                      h('div', { className: 'sd-book-name', key: 'n' }, b.book.name || '—'),
                      h('div', { className: 'sd-book-meta', key: 'm' },
                        `${b.book.wordCount || 0} 词${b.book.code ? ` · ${b.book.code}` : ''}`),
                    ])
                  : h('div', { className: 'sd-empty-block', key: 'e' }, '本机 App 数据里没有正在学的词书。'),
                b.dailyPlan
                  ? h('div', { className: 'sd-book-meta', key: 'p' },
                      `今日计划：${b.dailyPlan.wordCount || 0} 词${b.dailyPlan.phraseCount ? ` + ${b.dailyPlan.phraseCount} 词组` : ''}`)
                  : null,
                (b.checkIn && b.checkIn.week || []).length
                  ? h('div', { className: 'sd-row', key: 'w' },
                      (b.checkIn.week || []).map((x) => h('span', {
                        key: x.date,
                        className: 'sd-pill sm' + (x.signIn ? ' on' : ''),
                        title: `${x.date}${x.signIn ? ' 已签到' : ' 未签到'}`,
                      }, `${x.date.slice(5)} ${x.signIn ? '✔' : '—'}`)))
                  : null,
              ]),
              // 最近 7 天
              h('section', { className: 'sd-card-block', key: 'recent' }, [
                h('div', { className: 'sd-block-head', key: 'h' }, [
                  h('h2', { className: 'sd-block-title', key: 't' }, '最近 7 天'),
                  h('span', { className: 'sd-block-sub', key: 's' }, '复习次数与时长'),
                ]),
                recent.length
                  ? h('div', { className: 'sd-recent', key: 'r' },
                      recent.map((x) => h('div', { className: 'sd-recent-row', key: x.date }, [
                        h('span', { className: 'sd-recent-date', key: 'd' }, x.date),
                        h('div', { className: 'sd-recent-bar', key: 'b' },
                          h('i', {
                            style: { width: `${maxReviews ? Math.round((x.reviews / maxReviews) * 100) : 0}%` },
                          })),
                        h('span', { className: 'sd-recent-num', key: 'n' },
                          `${x.reviews} 次${x.minutes ? ` · ${fmtMinutes(x.minutes)}` : ''}`),
                      ])))
                  : h('div', { className: 'sd-empty-block', key: 'e' },
                      cloud && cloud.ok ? '这 7 天没有复习记录。' : '服务端没连上，逐日数据拿不到。'),
              ]),
            ]),

            h('div', { className: 'sd-foot', key: 'f' },
              `数据：不背单词 ${u.nickname ? `${u.nickname} ` : ''}· 采集于 ${whenText}${sourceText ? ` · ${sourceText}` : ''}${s.version ? ` · dsh-study-desk v${s.version}` : ''}`),
          ])),
      ])
    }

    // -----------------------------------------------------------------------
    // 看板
    // -----------------------------------------------------------------------

    let dragId = null

    function Card({ task, minutes, confirmId, setConfirmId, onMove, onDelete, onUpdate, dragging, setDragging, onToggleReview, onPickTag, activeTags }) {
      const spent = minutes[task.id] || 0
      const confirming = confirmId === task.id
      const [editing, setEditing] = React.useState(false)
      const [draft, setDraft] = React.useState(null)
      const review = task.review || {}
      const scheduled = !!review.due
      const late = scheduled && daysUntil(review.due, Date.now()) <= 0
      const tags = task.tags || []

      // 内联编辑：只改卡自己的字段，排期与时长一概不碰（删卡重建会把复习历史和投入一起清零）
      const beginEdit = () => {
        setDraft({
          title: task.title || '',
          note: task.note || '',
          subject: task.subject || '',
          estimateMin: task.estimateMin || 0,
        })
        setEditing(true)
      }
      const commitEdit = () => {
        if (!draft) { setEditing(false); return }
        const patch = {}
        const title = draft.title.trim()
        if (title && title !== task.title) patch.title = title
        if (draft.note !== (task.note || '')) patch.note = draft.note
        if (draft.subject !== (task.subject || '')) patch.subject = draft.subject
        const est = Math.max(0, Math.floor(Number(draft.estimateMin) || 0))
        if (est !== (task.estimateMin || 0)) patch.estimateMin = est
        setEditing(false)
        setDraft(null)
        if (Object.keys(patch).length) onUpdate && onUpdate(task.id, patch)
      }

      if (editing) {
        const field = (key, label, extra) => h('label', { className: 'sd-edit-row', key }, [
          h('span', { className: 'sd-edit-label', key: 'l' }, label),
          h('input', Object.assign({
            key: 'i',
            className: 'sd-edit-input',
            value: draft[key],
            onChange: (e) => setDraft((d) => ({ ...d, [key]: e.target.value })),
          }, extra || {})),
        ])
        return h('article', {
          className: 'sd-card editing' + (task.status === 'done' ? ' done' : ''),
          draggable: false,
        }, [
          h('div', { className: 'sd-edit', key: 'e' }, [
            field('title', '标题', { autoFocus: true }),
            field('subject', '科目'),
            field('estimateMin', '预计分钟', { type: 'number', min: 0 }),
            h('label', { className: 'sd-edit-row', key: 'note' }, [
              h('span', { className: 'sd-edit-label', key: 'l' }, '备注'),
              h('textarea', {
                key: 'i',
                className: 'sd-edit-input',
                rows: 2,
                value: draft.note,
                onChange: (e) => setDraft((d) => ({ ...d, note: e.target.value })),
              }),
            ]),
          ]),
          h('div', { className: 'sd-card-foot', key: 'f' }, [
            h('span', { className: 'sd-card-acts', key: 'a' }, [
              h('button', { key: 'ok', className: 'sd-act', title: '保存修改', onClick: commitEdit }, '保存'),
              h('button', { key: 'no', className: 'sd-act', title: '放弃修改', onClick: () => { setEditing(false); setDraft(null) } }, '取消'),
            ]),
          ]),
        ])
      }

      return h('article', {
        className: 'sd-card' + (task.status === 'done' ? ' done' : '') + (dragging ? ' dragging' : '') + (late ? ' due' : ''),
        draggable: true,
        onDragStart: (e) => {
          dragId = task.id
          setDragging(task.id)
          try { e.dataTransfer.setData('text/plain', task.id) } catch { /* 忽略 */ }
          e.dataTransfer.effectAllowed = 'move'
        },
        onDragEnd: () => { dragId = null; setDragging(null) },
        onDragOver: (e) => { e.preventDefault(); e.stopPropagation(); onMove(task.id, task.status, task.id, true) },
      }, [
        h('div', { className: 'sd-card-top', key: 'top' }, [
          task.pinned ? h('span', { className: 'sd-pin', key: 'p', title: '置顶' }, '★') : null,
          h('div', { className: 'sd-card-title', key: 't' }, task.title),
        ]),
        task.note ? h('div', { className: 'sd-card-note', key: 'note' }, task.note) : null,
        tags.length
          ? h('div', { className: 'sd-card-tags', key: 'tags' }, tags.map((tag) => h('button', {
            key: tag,
            className: 'sd-tagchip' + ((activeTags || []).includes(tag) ? ' on' : ''),
            title: (activeTags || []).includes(tag) ? '取消这个标签' : '按这个标签过滤',
            onClick: () => onPickTag && onPickTag(tag),
          }, tag)))
          : null,
        h('div', { className: 'sd-card-foot', key: 'foot' }, [
          task.subject ? h('span', { className: 'sd-tag', key: 's' }, task.subject) : null,
          spent ? h('span', { className: 'sd-spent', key: 'm', title: '累计投入' }, fmtShort(spent)) : null,
          task.estimateMin && !spent ? h('span', { className: 'sd-est', key: 'e', title: '预计' }, '~' + fmtShort(task.estimateMin)) : null,
          scheduled
            ? h('span', {
              className: 'sd-due' + (late ? ' late' : ''), key: 'd',
              title: `下次 ${review.due} · 间隔 ${review.intervalDays} 天 · 难度 ${review.ease} · 已过 ${review.reps} 遍 · 忘了 ${review.lapses} 次`,
            }, `${dueLabel(review.due)} · 第 ${review.reps + 1} 遍`)
            : null,
          h('span', { className: 'sd-card-acts', key: 'a' }, confirming
            ? [
              h('button', { key: 'yes', className: 'sd-act danger', title: '确认删除', onClick: () => { setConfirmId(null); onDelete(task.id) } }, '删除'),
              h('button', { key: 'no', className: 'sd-act', title: '取消', onClick: () => setConfirmId(null) }, '取消'),
            ]
            : [
              task.status !== 'todo' ? h('button', {
                key: 'l', className: 'sd-act', title: '移到左边一列',
                onClick: () => onMove(task.id, task.status === 'done' ? 'doing' : 'todo', null),
              }, h(Icon, { name: 'left', size: 13 })) : null,
              task.status !== 'done' ? h('button', {
                key: 'r', className: 'sd-act', title: task.status === 'todo' ? '开始做' : '标记完成',
                onClick: () => onMove(task.id, task.status === 'todo' ? 'doing' : 'done', null),
              }, task.status === 'todo' ? '开始' : h(Icon, { name: 'check', size: 13 })) : null,
              task.status === 'done' ? h('button', {
                key: 'r2', className: 'sd-act', title: '放回进行中',
                onClick: () => onMove(task.id, 'doing', null),
              }, h(Icon, { name: 'right', size: 13 })) : null,
              h('button', {
                key: 'edit', className: 'sd-act', title: '改标题 / 科目 / 预计时长 / 备注', onClick: beginEdit,
              }, h(Icon, { name: 'pen', size: 13 })),
              h('button', {
                key: 'rev', className: 'sd-act', title: scheduled ? '移出复习循环' : '拉进间隔重复复习循环',
                onClick: () => onToggleReview && onToggleReview(task.id, !scheduled),
              }, scheduled ? `×${dueLabel(review.due).replace('到期', '')}` : h(Icon, { name: 'repeat', size: 13 })),
              h('button', {
                key: 'x', className: 'sd-act', title: '删除这张卡',
                onClick: () => setConfirmId(task.id),
              }, h(Icon, { name: 'cross', size: 13 })),
            ]),
        ]),
      ])
    }

    function Composer({ status, subjects, onAdd }) {
      const [open, setOpen] = React.useState(false)
      const [text, setText] = React.useState('')
      const [subject, setSubject] = React.useState('')
      const ref = React.useRef(null)

      React.useEffect(() => { if (open && ref.current) ref.current.focus() }, [open])

      const commit = () => {
        const raw = text.trim()
        if (!raw) { setOpen(false); return }
        // Obsidian 肌肉记忆：正文里写 #标签 就直接落成标签
        const tags = []
        const title = raw.replace(/(?:^|\s)#([^\s#，,、]{1,24})/g, (m, tag) => { tags.push(tag); return '' })
          .replace(/\s+/g, ' ')
          .trim()
        if (!title) { onAdd({ title: tags.join(' · '), subject, status }); setText(''); return }
        onAdd({ title, subject, status, tags })
        setText('')
        if (ref.current) ref.current.focus()
      }

      if (!open) {
        return h('button', { className: 'sd-add', onClick: () => setOpen(true) },
          [h(Icon, { name: 'plus', size: 14, key: 'i' }), h('span', { key: 't' }, '新建')])
      }

      return h('div', { className: 'sd-composer' }, [
        h('textarea', {
          key: 'ta',
          ref,
          className: 'sd-composer-input',
          rows: 2,
          value: text,
          placeholder: '要做什么？回车保存，Shift+回车换行',
          onChange: (e) => setText(e.target.value),
          onKeyDown: (e) => {
            if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); commit() }
            if (e.key === 'Escape') { setOpen(false); setText('') }
          },
        }),
        h('div', { className: 'sd-composer-foot', key: 'f' }, [
          h('select', {
            key: 's',
            className: 'sd-select sm',
            value: subject,
            onChange: (e) => setSubject(e.target.value),
          }, [h('option', { key: '', value: '' }, '科目…'), ...subjects.map((x) => h('option', { key: x.id, value: x.label }, x.label))]),
          h('div', { className: 'sd-row', key: 'b' }, [
            h('button', { key: 'c', className: 'sd-textbtn', onClick: () => { setOpen(false); setText('') } }, '取消'),
            h('button', { key: 'k', className: 'sd-textbtn primary', onClick: commit }, '保存'),
          ]),
        ]),
      ])
    }

    function Column({ meta, tasks, total, minutes, subjects, hover, setHover, confirmId, setConfirmId, dragging, setDragging, onMove, onDelete, onUpdate, onAdd, onToggleReview, onPickTag, activeTags, filtered }) {
      return h('section', {
        className: 'sd-col' + (hover === meta.id ? ' hover' : ''),
        onDragOver: (e) => { e.preventDefault(); setHover(meta.id) },
        onDragLeave: () => setHover((cur) => (cur === meta.id ? null : cur)),
        onDrop: (e) => {
          e.preventDefault()
          setHover(null)
          if (dragId) onMove(dragId, meta.id, null)
          dragId = null
          setDragging(null)
        },
      }, [
        h('div', { className: 'sd-col-head', key: 'h' }, [
          h('span', { className: 'sd-col-latin', key: 'l' }, meta.latin),
          h('span', { className: 'sd-col-label', key: 'n' }, meta.label),
          h('span', { className: 'sd-col-count', key: 'c' }, filtered ? `${tasks.length}/${total}` : String(tasks.length)),
        ]),
        h('div', { className: 'sd-col-body', key: 'b' }, [
          ...tasks.map((t) => h(Card, {
            key: t.id,
            task: t,
            minutes,
            confirmId,
            setConfirmId,
            dragging: dragging === t.id,
            setDragging,
            onMove: (id, status, before, isHover) => {
              if (isHover) return
              onMove(id, status, before)
            },
            onDelete,
            onUpdate,
            onToggleReview,
            onPickTag,
            activeTags,
          })),
          tasks.length ? null : h('div', { className: 'sd-col-empty', key: 'e' }, filtered ? '这一列没有符合过滤条件的卡' : (meta.id === 'done' ? '还没有完成的卡' : '空的')),
          h(Composer, { key: 'composer', status: meta.id, subjects, onAdd }),
        ]),
      ])
    }

    function Board() {
      const s = useStore()
      const [hover, setHover] = React.useState(null)
      const [confirmId, setConfirmId] = React.useState(null)
      const [dragging, setDragging] = React.useState(null)
      const [subject, setSubject] = React.useState('')
      const [tags, setTags] = React.useState([])
      const [dueOnly, setDueOnly] = React.useState(false)
      const [q, setQ] = React.useState('')
      const subjects = (s.state.settings && s.state.settings.subjects) || []
      const allTags = s.tags || []

      const move = (id, status, beforeId) => store.apply('task.move', { id, status, beforeId: beforeId || undefined })
      const del = (id) => store.apply('task.delete', { id })
      const update = (id, patch) => store.apply('task.update', { id, patch })
      const add = (payload) => store.apply('task.add', payload)
      const toggleReview = (id, on) => store.apply(on ? 'review.schedule' : 'review.unschedule', { id })
      const pickTag = (tag) => setTags((cur) => (cur.includes(tag) ? cur.filter((x) => x !== tag) : [...cur, tag]))

      const needle = q.trim().toLowerCase()
      const today = dayKey(Date.now())
      const filtering = !!(subject || tags.length || dueOnly || needle)
      const keep = (t) => {
        if (subject && (t.subject || '未归类') !== subject) return false
        if (tags.length && !tags.every((tag) => (t.tags || []).includes(tag))) return false
        if (dueOnly && !(t.review && t.review.due && t.review.due <= today)) return false
        if (needle && !(`${t.title} ${t.note || ''} ${(t.tags || []).join(' ')}`.toLowerCase().includes(needle))) return false
        return true
      }

      return h('div', { className: 'sd-boardwrap' }, [
        h('div', { className: 'sd-filters', key: 'f' }, [
          h('span', { className: 'sd-search', key: 'q' }, [
            h(Icon, { name: 'search', size: 13, key: 'i' }),
            h('input', {
              key: 'i2',
              className: 'sd-search-input',
              type: 'search',
              value: q,
              placeholder: '搜标题 / 备注 / 标签',
              onChange: (e) => setQ(e.target.value),
            }),
          ]),
          h('select', {
            key: 's', className: 'sd-select sm', value: subject,
            onChange: (e) => setSubject(e.target.value),
          }, [
            h('option', { key: '', value: '' }, '全部科目'),
            ...[...new Set([...subjects.map((x) => x.label), ...s.state.tasks.map((t) => t.subject).filter(Boolean)])]
              .map((label) => h('option', { key: label, value: label }, label)),
            h('option', { key: '__none', value: '未归类' }, '未归类'),
          ]),
          h('button', {
            key: 'd', className: 'sd-pill sm' + (dueOnly ? ' on' : ''),
            title: '只看今天该复习的卡（含逾期）',
            onClick: () => setDueOnly((v) => !v),
          }, `只看到期${s.review && s.review.due ? ` ${s.review.due}` : ''}`),
          allTags.length
            ? h('span', { className: 'sd-tagrow', key: 't' }, allTags.slice(0, 12).map((x) => h('button', {
              key: x.tag,
              className: 'sd-tagchip sm' + (tags.includes(x.tag) ? ' on' : ''),
              onClick: () => pickTag(x.tag),
            }, [h('span', { key: 'n' }, x.tag), h('span', { className: 'sd-tagcount', key: 'c' }, String(x.count))])))
            : null,
          filtering
            ? h('button', { key: 'x', className: 'sd-textbtn sm', onClick: () => { setSubject(''); setTags([]); setDueOnly(false); setQ('') } }, '清空过滤')
            : null,
        ]),
        h('div', { className: 'sd-board', key: 'b' }, STATUS_META.map((meta) => {
          const all = tasksIn(meta.id)
          let tasks = filtering ? all.filter(keep) : all
          let total = all.length
          if (meta.id === 'done') {
            tasks = tasks.slice().sort((a, b) => (b.doneAt || 0) - (a.doneAt || 0)).slice(0, 30)
            total = all.length
          }
          return h(Column, {
            key: meta.id,
            meta,
            tasks,
            total,
            filtered: filtering,
            minutes: s.minutes,
            subjects,
            hover,
            setHover,
            confirmId,
            setConfirmId,
            dragging,
            setDragging,
            onMove: move,
            onDelete: del,
            onUpdate: update,
            onAdd: add,
            onToggleReview: toggleReview,
            onPickTag: pickTag,
            activeTags: tags,
          })
        })),
      ])
    }

    // -----------------------------------------------------------------------
    // 统计条
    // -----------------------------------------------------------------------

    function Stats({ now }) {
      const s = useStore()
      const bySubject = React.useMemo(() => {
        const from = addDays(startOfDay(now), -29)
        const map = new Map()
        for (const x of s.state.sessions) {
          if (x.kind !== 'focus' || x.at < from) continue
          const label = x.subject || '未归类'
          map.set(label, (map.get(label) || 0) + x.minutes)
        }
        return [...map.entries()].map(([label, minutes]) => ({ label, minutes })).sort((a, b) => b.minutes - a.minutes)
      }, [s.state.sessions, now])

      const max = bySubject.reduce((m, x) => Math.max(m, x.minutes), 0)
      const totalMonth = bySubject.reduce((m, x) => m + x.minutes, 0)

      return h('section', { className: 'sd-card-block' }, [
        h('div', { className: 'sd-block-head', key: 'h' }, [
          h('h2', { className: 'sd-block-title', key: 't' }, '近 30 天'),
          h('span', { className: 'sd-block-sub', key: 's' }, totalMonth ? `共 ${fmtMinutes(totalMonth)}` : '还没有记录'),
        ]),
        bySubject.length
          ? h('div', { className: 'sd-subj-list', key: 'l' }, bySubject.map((x) => h('div', { className: 'sd-subj', key: x.label }, [
            h('span', { className: 'sd-subj-label', key: 'n' }, x.label),
            h('div', { className: 'sd-subj-bar', key: 'b' },
              h('div', { className: 'sd-bar-fill', style: { width: (max ? (x.minutes / max) * 100 : 0) + '%' } })),
            h('span', { className: 'sd-subj-min', key: 'm' }, fmtMinutes(x.minutes)),
          ])))
          : h('div', { className: 'sd-empty-block', key: 'e' }, '完成一个番茄后，这里会按科目显示投入分布。'),
      ])
    }

    // -----------------------------------------------------------------------
    // 番茄投入饼图（番茄ToDo 式：按「这段番茄的名字」聚合成环）
    // -----------------------------------------------------------------------

    /** 扇区取色只用主题 token：五个既有色轮换 + 透明度阶梯，绝不硬编码颜色。 */
    const PIE_TONES = [
      'var(--dsw-alias-brand-primary)',
      'var(--dsw-alias-state-success-primary)',
      'var(--dsw-alias-state-business-primary)',
      'var(--dsw-alias-state-idle-primary)',
      'color-mix(in srgb,var(--dsw-alias-brand-primary) 55%,var(--dsw-alias-state-idle-primary))',
    ]

    function pieSlicePath(cx, cy, r, ri, a0, a1) {
      // 整圆特判：起终点重合时 arc 画不出来，用两个半圆拼
      if (a1 - a0 >= Math.PI * 2 - 1e-6) {
        return [
          `M ${cx} ${cy - r}`,
          `A ${r} ${r} 0 1 1 ${cx} ${cy + r}`,
          `A ${r} ${r} 0 1 1 ${cx} ${cy - r}`,
          `M ${cx} ${cy - ri}`,
          `A ${ri} ${ri} 0 1 0 ${cx} ${cy + ri}`,
          `A ${ri} ${ri} 0 1 0 ${cx} ${cy - ri}`,
          'Z',
        ].join(' ')
      }
      const p = (radius, a) => [cx + radius * Math.sin(a), cy - radius * Math.cos(a)]
      const large = a1 - a0 > Math.PI ? 1 : 0
      const [x0, y0] = p(r, a0)
      const [x1, y1] = p(r, a1)
      const [xi, yi] = p(ri, a1)
      const [xj, yj] = p(ri, a0)
      return `M ${x0} ${y0} A ${r} ${r} 0 ${large} 1 ${x1} ${y1} L ${xi} ${yi} A ${ri} ${ri} 0 ${large} 0 ${xj} ${yj} Z`
    }

    function FocusPie() {
      const s = useStore()
      const [range, setRange] = React.useState('today')
      const data = s.focusPie || { today: [], month: [] }
      const rows = range === 'today' ? (data.today || []) : (data.month || [])
      const MAX_SLICES = 8
      const total = rows.reduce((m, x) => m + x.minutes, 0)
      let slices = rows
      if (rows.length > MAX_SLICES) {
        const head = rows.slice(0, MAX_SLICES - 1)
        const tail = rows.slice(MAX_SLICES - 1)
        slices = head.concat([{ label: `其它 ${tail.length} 项`, minutes: tail.reduce((m, x) => m + x.minutes, 0), segments: tail.reduce((m, x) => m + x.segments, 0), merged: true }])
      }
      const cap = range === 'today' ? '今天' : '近 30 天'

      let acc = 0
      const TAU = Math.PI * 2
      const segs = []
      slices.forEach((x, i) => {
        const a0 = (acc / total) * TAU
        acc += x.minutes
        const a1 = (acc / total) * TAU
        segs.push({ x, i, d: pieSlicePath(48, 48, 40, 24, a0, a1) })
      })

      return h('section', { className: 'sd-card-block' }, [
        h('div', { className: 'sd-block-head', key: 'h' }, [
          h('h2', { className: 'sd-block-title', key: 't' }, '番茄分布'),
          h('div', { className: 'sd-range-tabs', key: 'r' }, [
            h('button', { key: 'd', className: 'sd-pill sm' + (range === 'today' ? ' on' : ''), onClick: () => setRange('today') }, '今天'),
            h('button', { key: 'm', className: 'sd-pill sm' + (range === 'month' ? ' on' : ''), onClick: () => setRange('month') }, '近 30 天'),
          ]),
          h('span', { className: 'sd-block-sub', key: 's' }, total ? `${cap}共 ${fmtMinutes(total)}` : '还没有番茄'),
        ]),
        total
          ? h('div', { className: 'sd-pie-wrap', key: 'w' }, [
            h('svg', { className: 'sd-pie', key: 'p', viewBox: '0 0 96 96', width: 112, height: 112, role: 'img', 'aria-label': cap + '番茄投入饼图' },
              segs.map((g) => h('path', {
                key: g.x.label,
                d: g.d,
                fill: PIE_TONES[g.i % PIE_TONES.length],
                opacity: g.x.merged ? 0.45 : 1,
              }, h('title', null, `${g.x.label}：${fmtMinutes(g.x.minutes)}（${g.x.segments} 段）`))),
              h('text', { x: 48, y: 46, className: 'sd-pie-num', textAnchor: 'middle' }, fmtShort(total)),
              h('text', { x: 48, y: 57, className: 'sd-pie-cap', textAnchor: 'middle' }, cap)),
            h('div', { className: 'sd-pie-legend', key: 'l' }, slices.map((x, i) => h('div', { className: 'sd-pie-row', key: x.label }, [
              h('i', { className: 'sd-pie-swatch', style: { background: PIE_TONES[i % PIE_TONES.length], opacity: x.merged ? 0.45 : 1 } }),
              h('span', { className: 'sd-pie-name', title: x.label }, x.label),
              h('span', { className: 'sd-pie-min' }, `${fmtMinutes(x.minutes)} · ${Math.round((x.minutes / total) * 100)}%`),
            ]))),
          ])
          : h('div', { className: 'sd-empty-block', key: 'e' }, '起一个有名字的番茄（比如「864 论述练习」），这里就按名字画出时间都花去哪了。'),
      ])
    }

    // -----------------------------------------------------------------------
    // 遗忘曲线 / 到期预报 / 今日建议
    // -----------------------------------------------------------------------

    /**
     * 单卡记忆强度小图：把宿主算好的 0..100 点数组画成折线，
     * 并在「今天」和「到期那天」各打一根竖线。纯 SVG，没有依赖。
     */
    function MemoryCurve({ curve, width, height }) {
      if (!curve || !Array.isArray(curve.points) || curve.points.length < 2) return null
      const w = width || 66
      const ht = height || 20
      const pad = 1.5
      const pts = curve.points
      const n = pts.length - 1
      const x = (i) => pad + (i / n) * (w - pad * 2)
      const y = (v) => pad + (1 - v / 100) * (ht - pad * 2)
      const line = pts.map((v, i) => `${x(i).toFixed(1)},${y(v).toFixed(1)}`).join(' ')
      const flat = (ht - pad).toFixed(1)
      const area = `${x(0).toFixed(1)},${flat} ${line} ${x(n).toFixed(1)},${flat}`
      const retention = Number(curve.todayRetention) || 0
      const tone = retention >= 80 ? 'ok' : retention >= 60 ? 'warn' : 'late'
      return h('svg', {
        className: 'sd-curve sd-curve-' + tone,
        width: w, height: ht, viewBox: `0 0 ${w} ${ht}`,
        role: 'img',
        'aria-label': `记忆强度约 ${retention}%，稳定度约 ${curve.stabilityDays} 天`,
      }, [
        h('polygon', { key: 'a', className: 'sd-curve-area', points: area }),
        h('polyline', { key: 'l', className: 'sd-curve-line', points: line }),
        curve.dueIndex === null || curve.dueIndex === undefined ? null : h('line', {
          key: 'd',
          className: 'sd-curve-due',
          x1: x(curve.dueIndex).toFixed(1), x2: x(curve.dueIndex).toFixed(1),
          y1: pad, y2: flat,
        }),
        h('circle', {
          key: 't',
          className: 'sd-curve-dot',
          cx: x(curve.todayIndex || 0).toFixed(1),
          cy: y(pts[curve.todayIndex || 0]).toFixed(1),
          r: 1.8,
        }),
      ])
    }

    /** 未来 7 天到期预报：柱子高度就是那天要过几张，逾期一律算进今天。 */
    function Forecast() {
      const s = useStore()
      const f = s.forecast || {}
      const days = f.days || []
      if (!days.length) return null
      const max = Math.max(f.max || 0, 1)
      const today = days[0] || { count: 0 }
      const busiest = days.reduce((m, d) => (d.count > m.count ? d : m), days[0])
      const tail = [
        today.count ? `今天 ${today.count} 张` : '今天清空',
        f.later ? `7 天后还有 ${f.later} 张` : '',
        busiest && busiest.count > 0 && !busiest.isToday ? `峰值 ${busiest.key.slice(5)} 共 ${busiest.count} 张` : '',
      ].filter(Boolean).join(' · ')
      return h('div', { className: 'sd-forecast' }, [
        h('span', { className: 'sd-forecast-cap', key: 'c' }, '未来 7 天'),
        h('div', { className: 'sd-forecast-bars', key: 'b' }, days.map((d) => h('div', {
          key: d.key,
          className: 'sd-fbar' + (d.isToday ? ' today' : ''),
          title: `${d.key}：${d.count} 张${d.overdue ? `（含逾期 ${d.overdue} 张）` : ''}`,
        }, [
          h('span', { className: 'sd-fbar-n', key: 'n' }, d.count ? String(d.count) : ''),
          h('div', { className: 'sd-fbar-track', key: 't' },
            h('div', {
              className: 'sd-fbar-fill',
              style: { height: (d.count ? Math.max(12, Math.round((d.count / max) * 100)) : 0) + '%' },
            })),
          h('span', { className: 'sd-fbar-label', key: 'l' }, d.isToday ? '今天' : d.key.slice(5).replace('-', '/')),
        ]))),
        h('span', { className: 'sd-forecast-tail', key: 's' }, tail),
      ])
    }

    /** 今日建议：从到期队列里挑出最该先做的几张，并写明理由（打分口径在 desk.js:reviewPlan）。 */
    function PlanStrip() {
      const s = useStore()
      const plan = s.plan || {}
      const items = plan.items || []
      const [open, setOpen] = React.useState(true)
      if (!plan.advice && !items.length) return null
      return h('div', { className: 'sd-plan' }, [
        h('div', { className: 'sd-plan-head', key: 'h' }, [
          h(Icon, { name: 'flame', size: 13, key: 'i' }),
          h('span', { className: 'sd-plan-title', key: 't' }, '今日建议'),
          h('button', {
            key: 'x',
            className: 'sd-plan-toggle',
            onClick: () => setOpen(!open),
          }, open ? '收起' : '展开'),
        ]),
        plan.advice ? h('div', { className: 'sd-plan-advice', key: 'a' }, plan.advice) : null,
        open && items.length
          ? h('ol', { className: 'sd-plan-list', key: 'l' }, items.map((it, i) => h('li', {
            key: it.id, className: 'sd-plan-item',
          }, [
            h('span', { className: 'sd-plan-rank', key: 'r' }, String(i + 1)),
            h('span', { className: 'sd-plan-name', key: 'n', title: it.title }, it.title),
            it.subject ? h('span', { className: 'sd-tag', key: 's' }, it.subject) : null,
            h('span', { className: 'sd-plan-reason', key: 'y' }, it.reason),
          ])))
          : null,
      ])
    }

    // -----------------------------------------------------------------------
    // 今日复习队列
    // -----------------------------------------------------------------------

    function ReviewQueue() {
      const s = useStore()
      const st = s.review || {}
      const queue = s.due || []
      const [busy, setBusy] = React.useState(null)
      const grade = (id, g) => {
        setBusy(id)
        Promise.resolve(store.apply('review.grade', { id, grade: g })).finally(() => setBusy(null))
      }
      const limit = Number(s.state.settings.reviewQueueSize) || 10
      const shown = queue.slice(0, limit)

      return h('section', { className: 'sd-card-block sd-review' }, [
        h('div', { className: 'sd-block-head', key: 'h' }, [
          h('h2', { className: 'sd-block-title', key: 't' }, [
            h(Icon, { name: 'repeat', size: 14, key: 'i' }),
            h('span', { key: 'x' }, ' 今日复习'),
          ]),
          h('span', { className: 'sd-block-sub', key: 's' }, st.scheduled
            ? `排期 ${st.scheduled} 张 · 待过 ${st.due}（逾期 ${st.overdue}）· 今天已打分 ${st.doneToday} 次 · 本周 ${st.weekDone} 次`
            : '还没有卡进入复习循环'),
        ]),
        h(PlanStrip, { key: 'p' }),
        shown.length
          ? h('div', { className: 'sd-review-list', key: 'l' }, shown.map((t) => h('div', { className: 'sd-review-row', key: t.id }, [
            h('div', { className: 'sd-review-main', key: 'm' }, [
              h('div', { className: 'sd-review-title', key: 'a' }, t.title),
              h('div', { className: 'sd-review-meta', key: 'b' }, [
                t.subject ? h('span', { className: 'sd-tag', key: 's' }, t.subject) : null,
                h('span', { className: 'sd-due late', key: 'd' }, dueLabel(t.review.due)),
                t.curve ? h('span', {
                  className: 'sd-review-curve',
                  key: 'c',
                  title: `记忆稳定度约 ${t.curve.stabilityDays} 天（横轴 ${t.curve.spanDays} 天，虚线是排期那天，圆点是今天）`,
                }, [
                  h(MemoryCurve, { key: 'g', curve: t.curve, width: 66, height: 20 }),
                  h('span', { className: 'sd-review-mem', key: 'm' }, `记忆 ${t.curve.todayRetention}%`),
                ]) : null,
                h('span', { className: 'sd-review-cap', key: 'r' }, `第 ${t.review.reps + 1} 遍 · 上次间隔 ${t.review.intervalDays} 天 · 难度 ${t.review.ease}`),
              ]),
            ]),
            h('div', { className: 'sd-review-acts', key: 'c' }, GRADES.map((g) => h('button', {
              key: g,
              className: 'sd-grade ' + g,
              disabled: busy === t.id,
              title: g === 'again' ? '忘了：间隔清零，今天之内再来一遍'
                : g === 'easy' ? '很简单：间隔拉长一点'
                  : '记得：按难度推进间隔',
              onClick: () => grade(t.id, g),
            }, GRADE_LABEL[g]))),
          ])))
          : h('div', { className: 'sd-empty-block', key: 'e' }, st.scheduled
            ? '今天该复习的都过完了。想加练就把更多卡拉进复习循环（卡片右下角的 ↻）。'
            : '在卡片上点 ↻ 把它拉进复习循环。政治选择题、英语单词、专业课名词解释最适合这套：'
              + '「忘了」今天再来一遍，「记得」按难度把间隔越拉越长。'),
        h(Forecast, { key: 'f' }),
        queue.length > shown.length
          ? h('div', { className: 'sd-review-more', key: 'm' }, `队列里还有 ${queue.length - shown.length} 张没摆出来（每次摆几张在设置页里调）`)
          : null,
      ])
    }

    // -----------------------------------------------------------------------
    // 周报
    // -----------------------------------------------------------------------

    function Weekly() {
      const s = useStore()
      const weeks = (s.weekly && s.weekly.weeks) || []
      const goal = (s.weekly && s.weekly.goalWeekly) || 0
      const max = Math.max(goal, ...weeks.map((w) => w.minutes), 60)
      const cur = weeks[weeks.length - 1]

      return h('section', { className: 'sd-card-block' }, [
        h('div', { className: 'sd-block-head', key: 'h' }, [
          h('h2', { className: 'sd-block-title', key: 't' }, '周报'),
          h('span', { className: 'sd-block-sub', key: 's' }, cur
            ? `本周 ${fmtMinutes(cur.minutes)}${goal ? ` / 目标 ${fmtMinutes(goal)}` : ''}${cur.deltaPct === null ? '' : ` · 比上周${cur.deltaPct >= 0 ? '+' : ''}${cur.deltaPct}%`}`
            : '还没有记录'),
        ]),
        weeks.length
          ? h('div', { className: 'sd-weeks', key: 'w' }, weeks.map((w) => {
            const pct = Math.round((w.minutes / max) * 100)
            return h('div', {
              key: w.key,
              className: 'sd-week' + (w.current ? ' current' : ''),
              title: `${w.key} 起那一周：${fmtMinutes(w.minutes)} · 学了 ${w.daysActive} 天 · 复习 ${w.reviews} 次${w.deltaPct === null ? '' : ` · 环比 ${w.deltaPct}%`}`,
            }, [
              h('div', { className: 'sd-week-track', key: 't' },
                h('div', { className: 'sd-week-fill', style: { height: Math.max(pct, w.minutes ? 3 : 0) + '%' } })),
              h('span', { className: 'sd-week-min', key: 'm' }, w.minutes ? fmtShort(w.minutes) : ''),
              h('span', { className: 'sd-week-label', key: 'l' }, w.key.slice(5)),
            ])
          }))
          : null,
        cur && cur.bySubject && cur.bySubject.length
          ? h('div', { className: 'sd-subj-list', key: 's' }, cur.bySubject.slice(0, 5).map((x) => h('div', { className: 'sd-subj', key: x.label }, [
            h('span', { className: 'sd-subj-label', key: 'n' }, x.label),
            h('div', { className: 'sd-subj-bar', key: 'b' },
              h('div', { className: 'sd-bar-fill', style: { width: (x.minutes / Math.max(cur.minutes, 1)) * 100 + '%' } })),
            h('span', { className: 'sd-subj-min', key: 'm' }, fmtMinutes(x.minutes)),
          ])))
          : h('div', { className: 'sd-empty-block', key: 'e' }, '本周还没有专注记录。'),
      ])
    }

    // -----------------------------------------------------------------------
    // 每日复盘
    // -----------------------------------------------------------------------

    function JournalBlock({ now }) {
      const s = useStore()
      const today = dayKey(now)
      const saved = ((s.state.journal || {})[today]) || ''
      const [draft, setDraft] = React.useState(saved)
      const dirty = draft !== saved

      React.useEffect(() => { setDraft(saved) }, [today])

      const save = () => store.apply('journal.set', { text: draft, date: today })
      const recent = (s.journalLog || []).filter((x) => x.date !== today).slice(0, 6)

      return h('section', { className: 'sd-card-block sd-journal' }, [
        h('div', { className: 'sd-block-head', key: 'h' }, [
          h('h2', { className: 'sd-block-title', key: 't' }, [
            h(Icon, { name: 'pen', size: 14, key: 'i' }),
            h('span', { key: 'x' }, ' 今日复盘'),
          ]),
          h('span', { className: 'sd-block-sub', key: 's' }, today),
        ]),
        h('textarea', {
          key: 'ta',
          className: 'sd-journal-input',
          rows: 3,
          value: draft,
          placeholder: '今天卡在哪、明天第一件事做什么。写在这里，模型下一轮对话就能看见。',
          onChange: (e) => setDraft(e.target.value),
          onKeyDown: (e) => {
            if (e.key === 'Escape') setDraft(saved)
            if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) { e.preventDefault(); save() }
          },
        }),
        h('div', { className: 'sd-row', key: 'r' }, [
          h('button', {
            className: 'sd-textbtn primary', disabled: !dirty, onClick: save,
          }, dirty ? '保存' : '已保存'),
          dirty ? h('button', { className: 'sd-textbtn', onClick: () => setDraft(saved) }, '撤销') : null,
          h('span', { className: 'sd-block-sub', key: 'h' }, 'Ctrl+回车保存'),
        ]),
        recent.length
          ? h('div', { className: 'sd-journal-list', key: 'l' }, recent.map((x) => h('div', { className: 'sd-journal-item', key: x.date }, [
            h('span', { className: 'sd-journal-date', key: 'd' }, x.date.slice(5)),
            h('span', { className: 'sd-journal-text', key: 't' }, x.text),
          ])))
          : null,
      ])
    }

    // -----------------------------------------------------------------------
    // 整页面板
    // -----------------------------------------------------------------------

    function Panel() {
      const s = useStore()
      const now = useTick(500)
      usePoll(20000)
      // 宿主的中心列是 flex-direction:column + overflow:hidden，它不会替我们滚：
      // 官方的任务管理页也是自己出 page > pane > pageScroll > pageContent 四层。
      return h('div', { className: 'sd-panel' }, [
        h('div', { className: 'sd-scroll', key: 's' },
          h('div', { className: 'sd-page', key: 'c' }, [
            h(Head, { key: 'head', now }),
            h(TimerPanel, { key: 'timer', now }),
            s.error ? h('div', { className: 'sd-error', key: 'err' }, '工作台数据读取失败：' + s.error) : null,
            h(ReviewQueue, { key: 'review' }),
            h('div', { className: 'sd-section-title', key: 'st' }, [
              h('span', { key: 'a' }, '待办墙'),
              h('span', { className: 'sd-section-hint', key: 'b' }, '拖动卡片换列 · 输入 #标签 直接打标 · ↻ 把卡拉进复习循环'),
            ]),
            h(Board, { key: 'board' }),
            h('div', { className: 'sd-two', key: 'two' }, [
              h(Heatmap, { key: 'heat', now }),
              h(FocusPie, { key: 'pie' }),
            ]),
            h('div', { className: 'sd-two', key: 'two2' }, [
              h(Stats, { key: 'stats', now }),
              h(Weekly, { key: 'weekly' }),
            ]),
            h(JournalBlock, { key: 'journal', now }),
            h('div', { className: 'sd-foot', key: 'f' },
              `数据：${s.deskFile || '—'}${s.version ? ` · dsh-study-desk v${s.version}` : ''}`),
          ])),
      ])
    }

    // -----------------------------------------------------------------------
    // 常驻迷你计时条（shell.overlay）
    // -----------------------------------------------------------------------

    // 迷你条的落点：存 localStorage，纯本地偏好，不占 desk.json
    function readMiniPos() {
      try {
        const raw = window.localStorage.getItem(MINI_POS_KEY)
        if (!raw) return null
        const p = JSON.parse(raw)
        if (p && Number.isFinite(p.x) && Number.isFinite(p.y)) return { x: p.x, y: p.y }
      } catch (error) { /* 读不到就当没挪过 */ }
      return null
    }

    function writeMiniPos(p) {
      try {
        if (!p) window.localStorage.removeItem(MINI_POS_KEY)
        else window.localStorage.setItem(MINI_POS_KEY, JSON.stringify({ x: Math.round(p.x), y: Math.round(p.y) }))
      } catch (error) { /* 写不进去就这一次不记 */ }
    }

    // 拖出去不许丢：永远留一条边在视口里
    function clampMiniPos(p, w, h) {
      const pad = 6
      const vw = window.innerWidth || 0
      const vh = window.innerHeight || 0
      const maxX = Math.max(pad, vw - (w || 0) - pad)
      const maxY = Math.max(pad, vh - (h || 0) - pad)
      return { x: Math.min(Math.max(pad, p.x), maxX), y: Math.min(Math.max(pad, p.y), maxY) }
    }

    // 松手不再吸附：拖到哪就停在哪，只保留 clampMiniPos 防止拖出视口

    // 悬浮卡片被谁盖住，在浏览器里根本看不见：拿命中测试结果回传宿主写盘。
    // reportDiag 按 kind+where+message 去重，所以反复探也不会把诊断文件灌爆。
    function probeOverlayHit(el) {
      if (!el || typeof document.elementFromPoint !== 'function') return
      const rect = el.getBoundingClientRect()
      if (!rect.width || !rect.height) return
      const cx = Math.round(rect.left + rect.width / 2)
      const cy = Math.round(rect.top + rect.height / 2)
      const top = document.elementFromPoint(cx, cy)
      if (!top || top === el || el.contains(top)) return
      const chain = []
      for (let node = top; node && chain.length < 3; node = node.parentElement) {
        const cls = typeof node.className === 'string' && node.className.trim()
          ? '.' + node.className.trim().split(/\s+/).slice(0, 2).join('.')
          : ''
        chain.push(node.tagName.toLowerCase() + cls)
      }
      reportDiag({ kind: 'mini-covered', where: 'mini.命中测试', message: `中心 ${cx},${cy} 命中的是 ${chain.join(' < ')}` })
    }

    function MiniBar() {
      const s = useStore()
      const now = useTick(500)
      usePoll(30000)
      const [open, setOpen] = React.useState(false)
      const [hidden, setHidden] = React.useState(false)
      const [pos, setPos] = React.useState(readMiniPos)
      const dragRef = React.useRef(null)
      const rootRef = React.useRef(null)
      const justDraggedRef = React.useRef(false)
      const timer = s.state.timer

      // 拖动：只在非按钮处按下才起拖，按钮该收的还是收到点击
      const dragHandlers = {
        onPointerDown: (event) => {
          if (event.button !== 0) return
          if (event.target && event.target.closest && event.target.closest('button')) return
          const el = event.currentTarget
          const rect = el.getBoundingClientRect()
          dragRef.current = {
            dx: event.clientX - rect.left,
            dy: event.clientY - rect.top,
            w: rect.width,
            h: rect.height,
            sx: event.clientX,
            sy: event.clientY,
            moved: false,
          }
          try { el.setPointerCapture(event.pointerId) } catch (error) { /* 拿不到捕获也照样能拖 */ }
        },
        onPointerMove: (event) => {
          const d = dragRef.current
          if (!d) return
          // 键/指针已经抬起却还留着 dragRef（捕获被系统抢走的情况）：直接收尾
          if (event.buttons === 0) { dragRef.current = null; return }
          // 手抖的几个像素不算拖动，否则在条身上点一下就被当成拖动
          if (!d.moved && Math.abs(event.clientX - d.sx) + Math.abs(event.clientY - d.sy) < 4) return
          d.moved = true
          setPos(clampMiniPos({ x: event.clientX - d.dx, y: event.clientY - d.dy }, d.w, d.h))
        },
        onPointerUp: (event) => {
          const d = dragRef.current
          dragRef.current = null
          if (!d) return
          try { event.currentTarget.releasePointerCapture(event.pointerId) } catch (error) { /* 同上 */ }
          if (d.moved) {
            // 拖完那一下松手别再当成点击（小圆点会被误展开）
            justDraggedRef.current = true
            setTimeout(() => { justDraggedRef.current = false }, 0)
            // 松手就停在原地：只做视口钳制（防拖丢），并把落点记住
            const next = clampMiniPos({ x: event.clientX - d.dx, y: event.clientY - d.dy }, d.w, d.h)
            setPos(next)
            writeMiniPos(next)
          }
        },
        // 拖动中途被系统手势/弹窗抢走指针：清掉拖拽态，免得下次鼠标掠过就把钟拖跑
        onPointerCancel: () => { dragRef.current = null },
        onLostPointerCapture: () => { dragRef.current = null },
        onDoubleClick: (event) => {
          // 双击展开/收起按钮也会冒到这里，那种情况下不该把位置清掉
          if (event.target && event.target.closest && event.target.closest('button')) return
          setPos(null); writeMiniPos(null)
        },
      }
      const posStyle = pos ? { left: pos.x + 'px', top: pos.y + 'px', right: 'auto', bottom: 'auto' } : null

      // 窗口变小 / 展开收起导致尺寸变化时，把落点收回视口内
      React.useEffect(() => {
        setPos((current) => {
          if (!current) return current
          const el = rootRef.current
          if (!el) return current
          const rect = el.getBoundingClientRect()
          return clampMiniPos(current, rect.width, rect.height)
        })
      }, [hidden, open])

      React.useEffect(() => {
        function onResize() {
          setPos((current) => {
            if (!current) return current
            const el = rootRef.current
            if (!el) return current
            const rect = el.getBoundingClientRect()
            return clampMiniPos(current, rect.width, rect.height)
          })
        }
        window.addEventListener('resize', onResize)
        return () => window.removeEventListener('resize', onResize)
      }, [])

      React.useEffect(() => {
        probeOverlayHit(rootRef.current)
        const id = setInterval(() => probeOverlayHit(rootRef.current), 5000)
        return () => clearInterval(id)
      }, [])

      if (hidden) {
        return toTopLayer(h('button', Object.assign({
          ref: rootRef,
          className: 'sd-mini-fab',
          title: '展开专注计时（可拖动，双击回右下角）',
          onClick: () => { if (!justDraggedRef.current) setHidden(false) },
          style: posStyle,
        }, dragHandlers), h(Icon, { name: 'clock', size: 16 })))
      }
      const remaining = timerRemaining(timer, now)
      const isFocus = !timer || timer.kind === 'focus'
      return toTopLayer(h('div', Object.assign({
        ref: rootRef,
        className: 'sd-mini' + (open ? ' open' : '') + (timer ? '' : ' idle'),
        style: posStyle,
      }, dragHandlers), [
        h('div', { className: 'sd-mini-main', key: 'm' }, [
          h('span', { key: 'g', className: 'sd-mini-grip', title: '按住这里拖动（双击回右下角）' }),
          h('button', {
            key: 'play',
            className: 'sd-iconbtn sm',
            title: !timer ? '开始专注' : timer.running ? '暂停' : '继续',
            onClick: () => {
              if (!timer) {
                // 悬浮条没有输入框：优先挂到进行中的卡（名字与科目一起带上），
                // 其次沿用最近一段专注的名字，避免全部落进「专注（未命名）」
                const doing = tasksIn('doing')[0]
                const lastSession = (s.state.sessions || []).filter((x) => x.kind === 'focus' && x.title).slice(-1)[0]
                const base = { minutes: s.state.settings.focusMin || 25, kind: 'focus' }
                if (doing) base.taskId = doing.id
                else if (lastSession && lastSession.title) base.title = lastSession.title
                store.apply('timer.start', base)
              }
              else if (timer.running) store.apply('timer.pause')
              else store.apply('timer.resume')
            },
          }, h(Icon, { name: !timer ? 'play' : timer.running ? 'pause' : 'play', size: 14 })),
          h('span', {
            key: 'c',
            className: 'sd-mini-clock' + (timer && !isFocus ? ' break' : ''),
            title: timer ? (isFocus ? `专注 · 第 ${timer.round} 轮` : '休息') : '番茄钟',
          }, timer ? fmtClock(remaining) : '--:--'),
          timer && timer.title ? h('span', { className: 'sd-mini-task', key: 't', title: timer.title }, timer.title) : null,
          h('button', {
            key: 'x',
            className: 'sd-iconbtn sm',
            title: open ? '收起' : '展开',
            onClick: () => setOpen((v) => !v),
          }, h(Icon, { name: open ? 'collapse' : 'expand', size: 14 })),
        ]),
        open ? h('div', { className: 'sd-mini-panel', key: 'p' }, [
          h('div', { className: 'sd-mini-row', key: 'r1' }, [
            h('span', { className: 'sd-mini-cap', key: 'c' }, '今日'),
            h('span', { key: 'v' }, `${fmtMinutes(s.todayMinutes)} / ${fmtMinutes(Number(s.state.settings.dailyGoalMin) || 180)}`),
            h('span', { className: 'sd-mini-cap', key: 's' }, `连续 ${s.streak} 天`),
          ]),
          h('div', { className: 'sd-mini-row', key: 'r2' }, [
            h('span', { className: 'sd-mini-cap', key: 'c' }, '待办墙'),
            h('span', { key: 'v' }, `${tasksIn('doing').length} 进行中 · ${tasksIn('todo').length} 待办`),
          ]),
          h('div', { className: 'sd-mini-row', key: 'r2b' }, [
            h('span', { className: 'sd-mini-cap', key: 'c' }, '复习'),
            h('span', { key: 'v', className: (s.review && s.review.due ? 'sd-mini-late' : '') },
              s.review && s.review.scheduled
                ? `${s.review.due} 张到期 · 今天已过 ${s.review.doneToday} 次`
                : '还没有卡进入复习循环'),
          ]),
          timer && isFocus && !timer.running ? h('button', {
            key: 'abandon', className: 'sd-textbtn', onClick: () => store.apply('timer.reset'),
          }, '放弃这一段') : null,
          h('div', { className: 'sd-mini-row sd-mini-actions', key: 'r3' }, [
            h('button', {
              key: 'open', className: 'sd-textbtn primary',
              onClick: () => {
                const layout = getLayout()
                if (!layout || typeof layout.selectPanel !== 'function') {
                  reportDiag({
                    kind: 'open-panel-failed',
                    where: 'mini.打开工作台',
                    message: '拿不到 layout 服务',
                    detail: {
                      hasCtx: Boolean(clientCtx),
                      hasGet: Boolean(clientCtx && typeof clientCtx.get === 'function'),
                      hasProp: Boolean(clientCtx && clientCtx.layout),
                    },
                  })
                  return
                }
                try {
                  layout.selectPanel(PANEL_ID)
                } catch (error) {
                  reportDiag({
                    kind: 'open-panel-failed',
                    where: 'mini.打开工作台',
                    message: 'selectPanel 抛错：' + String((error && error.message) || error),
                    stack: String((error && error.stack) || '').split('\n').slice(0, 12).join('\n'),
                  })
                }
              },
            }, '打开工作台'),
            h('button', { key: 'hide', className: 'sd-textbtn', onClick: () => { setOpen(false); setHidden(true) } }, '收起成小圆点'),
          ]),
        ]) : null,
      ]))
    }

    // -----------------------------------------------------------------------
    // 设置页
    // -----------------------------------------------------------------------

    function NumField({ label, hint, value, min, max, onCommit }) {
      const [draft, setDraft] = React.useState(String(value))
      React.useEffect(() => setDraft(String(value)), [value])
      const commit = () => {
        const n = Math.round(Number(draft))
        if (!Number.isFinite(n) || n < (min || 1)) { setDraft(String(value)); return }
        onCommit(Math.max(min || 1, Math.min(max || 9999, n)))
      }
      return h('label', { className: 'sd-field' }, [
        h('span', { className: 'sd-field-label', key: 'l' }, label),
        h('input', {
          key: 'i', className: 'sd-input', type: 'number', value: draft, min, max,
          onChange: (e) => setDraft(e.target.value),
          onBlur: commit,
          onKeyDown: (e) => { if (e.key === 'Enter') commit() },
        }),
        hint ? h('span', { className: 'sd-field-hint', key: 'h' }, hint) : null,
      ])
    }

    /** 文本版 NumField：失焦或回车才写回，边打字边存会打爆接口。 */
    function TextField({ label, hint, value, placeholder, onCommit }) {
      const [draft, setDraft] = React.useState(value || '')
      React.useEffect(() => setDraft(value || ''), [value])
      const commit = () => { if (draft !== (value || '')) onCommit(draft.trim()) }
      return h('label', { className: 'sd-field' }, [
        h('span', { className: 'sd-field-label', key: 'l' }, label),
        h('input', {
          key: 'i', className: 'sd-input wide', type: 'text', value: draft, placeholder,
          onChange: (e) => setDraft(e.target.value), onBlur: commit,
          onKeyDown: (e) => { if (e.key === 'Enter') { e.preventDefault(); commit() } },
        }),
        hint ? h('span', { className: 'sd-field-hint', key: 'h' }, hint) : null,
      ])
    }

    function TextAreaField({ label, hint, value, rows, placeholder, onCommit }) {
      const [draft, setDraft] = React.useState(value || '')
      React.useEffect(() => setDraft(value || ''), [value])
      const dirty = draft !== (value || '')
      return h('div', { className: 'sd-field' }, [
        h('span', { className: 'sd-field-label', key: 'l' }, label),
        h('textarea', {
          key: 't', className: 'sd-journal-input', rows: rows || 4, value: draft, placeholder,
          onChange: (e) => setDraft(e.target.value),
        }),
        h('div', { className: 'sd-row', key: 'r' }, [
          h('button', {
            className: 'sd-textbtn', disabled: !dirty,
            onClick: () => onCommit(draft.replace(/\r\n/g, '\n')),
          }, dirty ? '保存节点' : '已保存'),
          hint ? h('span', { className: 'sd-field-hint', key: 'h' }, hint) : null,
        ]),
      ])
    }

    function Settings() {
      const s = useStore()
      usePoll(60000)
      const st = s.state.settings || {}
      const patch = (p) => store.apply('settings.update', { patch: p })
      return h('div', { className: 'sd-settings' }, [
        h('p', { className: 'sd-settings-note', key: 'n' },
          '学习工作台：待办墙 + 间隔重复复习队列 + 学习热力图与周报 + 番茄钟 + 每日复盘。数据只存在本机，不联网。'),
        h('div', { className: 'sd-settings-grid', key: 'goalgrid' }, [
          h(TextField, { key: 'gl', label: '目标名称', placeholder: '如 2027 届考研初试 / 博士答辩 / 期刊投稿', value: st.goalLabel || '', onCommit: (v) => patch({ goalLabel: v }) }),
          h(TextField, { key: 'gd', label: '目标日期', hint: '留空就不显示右上角的倒计时', value: st.goalDate || '', placeholder: 'YYYY-MM-DD', onCommit: (v) => patch({ goalDate: v }) }),
          h(TextField, { key: 'ge', label: '结束日期（可选）', hint: '跨多天的考试或答辩才填', value: st.goalEnd || '', placeholder: 'YYYY-MM-DD', onCommit: (v) => patch({ goalEnd: v }) }),
          h(TextField, { key: 'gn', label: '备注', placeholder: '如 631 公共管理 + 864', value: st.goalNote || '', onCommit: (v) => patch({ goalNote: v }) }),
        ]),
        h(TextAreaField, {
          key: 'ms', label: '节点（一行一个）', rows: 5,
          hint: '格式：名称 2026-10-15~2026-10-24；日期拿不准就在行尾加「约」。坏行会被忽略，不会报错。',
          value: st.milestonesText || '', onCommit: (v) => patch({ milestonesText: v }),
        }),
        h('div', { className: 'sd-settings-grid', key: 'g' }, [
          h(NumField, { key: 'goal', label: '每日目标（分钟）', value: st.dailyGoalMin || 180, min: 10, max: 1440, onCommit: (v) => patch({ dailyGoalMin: v }) }),
          h(NumField, { key: 'focus', label: '专注时长（分钟）', value: st.focusMin || 25, min: 1, max: 180, onCommit: (v) => patch({ focusMin: v }) }),
          h(NumField, { key: 'sb', label: '短休息（分钟）', value: st.shortBreakMin || 5, min: 1, max: 60, onCommit: (v) => patch({ shortBreakMin: v }) }),
          h(NumField, { key: 'lb', label: '长休息（分钟）', value: st.longBreakMin || 15, min: 1, max: 120, onCommit: (v) => patch({ longBreakMin: v }) }),
          h(NumField, { key: 'rw', label: '几轮后长休息', value: st.roundsBeforeLong || 4, min: 2, max: 12, onCommit: (v) => patch({ roundsBeforeLong: v }) }),
          h(NumField, { key: 'sm', label: '打卡门槛（分钟）', hint: '一天至少专注这么多才算连续打卡', value: st.streakMin || 10, min: 1, max: 240, onCommit: (v) => patch({ streakMin: v }) }),
          h(NumField, { key: 'rq', label: '复习队列每次摆几张', hint: '到期很多时避免一眼看不到头，剩下的明天接着过', value: st.reviewQueueSize || 10, min: 1, max: 60, onCommit: (v) => patch({ reviewQueueSize: v }) }),
        ]),
        h('label', { className: 'sd-field sd-field-inline', key: 'inj' }, [
          h('input', {
            key: 'c', type: 'checkbox', checked: st.injectPrompt !== false,
            onChange: (e) => patch({ injectPrompt: e.target.checked }),
          }),
          h('span', { key: 'l' }, '每轮对话把「今天该做什么、该复习什么、昨天卡在哪」告诉模型'),
          h('span', { className: 'sd-field-hint', key: 'h' }, '关掉能省一点上下文'),
        ]),
        h('div', { className: 'sd-settings-file', key: 'f' }, `数据文件：${s.deskFile || '—'}`),
        h('div', { className: 'sd-settings-file', key: 'f2' },
          `Markdown：${s.markdownFile || '（还没导出过）'} —— 把它软链进 Obsidian vault 就能当笔记改，改完在工作台点「从 Markdown 读回」`),
      ])
    }

    // -----------------------------------------------------------------------
    // 样式：全部走 --dsw-* token，零硬编码颜色
    // -----------------------------------------------------------------------

    const CSS = [
      // 页面骨架
      // 面板外壳：中心列是 overflow:hidden 的 flex 列，滚动条只能由我们自己出
      '.sd-panel{display:flex;flex-direction:column;flex:1;min-width:0;min-height:0;width:100%;height:100%;background:var(--dsw-alias-bg-base);color:var(--dsw-alias-label-primary)}',
      '.sd-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;--dsh-scrollbar-width:9px;--dsh-scrollbar-thumb-border:2px}',
      '.sd-page{display:flex;flex-direction:column;gap:18px;padding:22px 26px 48px;max-width:1220px;margin:0 auto;width:100%;box-sizing:border-box;color:var(--dsw-alias-label-primary)}',
      '.sd-page *{box-sizing:border-box}',
      // 顶部
      '.sd-head{display:flex;flex-direction:column;gap:12px}',
      '.sd-head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}',
      '.sd-head-row-end{align-items:center}',
      '.sd-head-main{display:flex;flex-direction:column;gap:4px}',
      '.sd-title{margin:0;font-size:24px;font-weight:600;letter-spacing:.02em;font-family:ui-serif,Georgia,"Songti SC","Noto Serif CJK SC",serif}',
      '.sd-subtitle{font-size:12.5px;color:var(--dsw-alias-label-tertiary);letter-spacing:.02em}',
      '.sd-count{display:flex;align-items:baseline;gap:4px;padding:6px 14px;border:1px solid var(--dsw-alias-border-l1);border-radius:999px;background:var(--dsw-alias-bg-layer-1)}',
      '.sd-count-num{font-size:26px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums;color:var(--dsw-alias-brand-primary)}',
      '.sd-count-cap{font-size:12px;color:var(--dsw-alias-label-secondary)}',
      '.sd-count-label{font-size:11px;color:var(--dsw-alias-label-tertiary);margin-left:6px;letter-spacing:.04em}',
      // 节点 chips
      '.sd-chips{display:flex;flex-wrap:wrap;gap:8px}',
      '.sd-chip{display:inline-flex;align-items:center;gap:7px;font-size:12px;padding:4px 12px;border-radius:999px;border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-secondary)}',
      '.sd-chip b{font-weight:600;color:var(--dsw-alias-label-primary)}',
      '.sd-chip-now{border-color:var(--dsw-alias-state-business-primary);background:color-mix(in srgb,var(--dsw-alias-state-business-primary) 10%,transparent)}',
      '.sd-chip-now b,.sd-chip-now span{color:var(--dsw-alias-state-business-primary)}',
      '.sd-chip-past{opacity:.5}',
      '.sd-chip-approx{font-style:normal;font-size:10px;opacity:.7;border:1px solid currentColor;border-radius:4px;padding:0 3px;line-height:1.3}',
      // 今日进度
      '.sd-today{display:flex;flex-direction:column;gap:3px;min-width:190px}',
      '.sd-today-cap{font-size:11px;letter-spacing:.08em;color:var(--dsw-alias-label-tertiary)}',
      '.sd-today-num{font-size:17px;font-weight:600;font-variant-numeric:tabular-nums}',
      '.sd-today-goal{font-size:11.5px;color:var(--dsw-alias-label-secondary)}',
      '.sd-today-bar{margin-top:4px}',
      '.sd-today-streak{min-width:auto;align-items:flex-end}',
      '.sd-bar{height:4px;border-radius:999px;background:var(--dsw-alias-bg-layer-3);overflow:hidden;width:100%}',
      '.sd-bar-fill{height:100%;border-radius:999px;background:var(--dsw-alias-brand-primary);transition:width .3s ease}',
      '.sd-bar-muted .sd-bar-fill{background:var(--dsw-alias-state-idle-primary)}',
      // 计时卡
      '.sd-timer-card{border:1px solid var(--dsw-alias-border-l1);border-radius:14px;background:var(--dsw-alias-bg-layer-1);padding:14px 16px;display:flex;flex-direction:column;gap:10px}',
      '.sd-timer-name-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}',
      '.sd-timer-name-row .sd-input.wide{flex:1;min-width:12em}',
      '.sd-name-empty::placeholder{color:var(--dsw-alias-label-dimmed)}',
      '.sd-timer-row{display:flex;align-items:center;gap:14px}',
      '.sd-timer-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}',
      '.sd-timer-clock{font-size:clamp(26px,4vw,34px);font-weight:600;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:.01em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}',
      '.sd-timer-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--dsw-alias-label-secondary);min-width:0}',
      '.sd-phase{padding:1px 8px;border-radius:999px;background:var(--dsw-alias-bg-layer-2);font-size:11px}',
      '.sd-phase-focus{color:var(--dsw-alias-brand-primary);background:color-mix(in srgb,var(--dsw-alias-brand-primary) 12%,transparent)}',
      '.sd-phase-break{color:var(--dsw-alias-state-success-primary);background:color-mix(in srgb,var(--dsw-alias-state-success-primary) 12%,transparent)}',
      '.sd-dot{width:3px;height:3px;border-radius:50%;background:var(--dsw-alias-label-dimmed);flex:none}',
      '.sd-timer-task{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:40ch}',
      '.sd-timer-sub{color:var(--dsw-alias-label-tertiary)}',
      '.sd-timer-bar{margin-top:2px}',
      '.sd-timer-side{display:flex;align-items:center;gap:6px;flex:none}',
      '.sd-timer-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--dsw-alias-border-l1);padding-top:10px;flex-wrap:wrap}',
      // 通用控件
      '.sd-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}',
      '.sd-row-end{margin-left:auto}',
      '.sd-mini-cap{font-size:11px;letter-spacing:.06em;color:var(--dsw-alias-label-tertiary)}',
      '.sd-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-secondary);cursor:pointer;flex:none;transition:border-color .12s ease,color .12s ease,background .12s ease}',
      '.sd-iconbtn:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-border-l3);background:var(--dsw-alias-interactive-bg-hover)}',
      '.sd-iconbtn-lg{width:42px;height:42px;border-radius:12px;color:var(--dsw-alias-brand-primary);border-color:color-mix(in srgb,var(--dsw-alias-brand-primary) 35%,transparent)}',
      '.sd-iconbtn.sm{width:22px;height:22px;border-radius:6px}',
      '.sd-textbtn{border:1px solid var(--dsw-alias-border-l1);background:transparent;color:var(--dsw-alias-label-secondary);font-size:12px;padding:3px 10px;border-radius:7px;cursor:pointer;transition:color .12s ease,border-color .12s ease}',
      '.sd-textbtn:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-border-l3)}',
      '.sd-textbtn.primary{color:var(--dsw-alias-label-primary-foreground);background:var(--dsw-alias-brand-primary);border-color:var(--dsw-alias-brand-primary)}',
      '.sd-pill{border:1px solid var(--dsw-alias-border-l1);background:transparent;color:var(--dsw-alias-label-secondary);font-size:12px;padding:3px 11px;border-radius:999px;cursor:pointer;transition:color .12s ease,border-color .12s ease,background .12s ease}',
      '.sd-pill:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-border-l3)}',
      '.sd-pill.on{color:var(--dsw-alias-brand-primary);border-color:var(--dsw-alias-brand-primary);background:color-mix(in srgb,var(--dsw-alias-brand-primary) 10%,transparent)}',
      '.sd-pill.sm{font-size:11px;padding:2px 8px}',
      '.sd-select{background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-primary);border:1px solid var(--dsw-alias-border-l1);border-radius:7px;padding:3px 8px;font-size:12px;max-width:200px;outline:none}',
      '.sd-select:disabled{opacity:.55}',
      '.sd-select.sm{font-size:11.5px}',
      '.sd-input{background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-primary);border:1px solid var(--dsw-alias-border-l1);border-radius:7px;padding:4px 9px;font-size:13px;width:88px;outline:none}',
      '.sd-input:focus{border-color:var(--dsw-alias-brand-primary)}',
      '.sd-input.wide{width:100%;min-width:0}',
      // 分区标题
      '.sd-section-title{display:flex;align-items:baseline;gap:10px;font-size:12px;letter-spacing:.1em;color:var(--dsw-alias-label-tertiary);border-bottom:1px solid var(--dsw-alias-border-l1);padding-bottom:7px}',
      '.sd-section-hint{letter-spacing:0;font-size:11px;color:var(--dsw-alias-label-dimmed);margin-left:auto}',
      // 看板
      '.sd-boardwrap{display:flex;flex-direction:column;gap:10px}',
      '.sd-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap}',
      '.sd-search{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--dsw-alias-border-l1);border-radius:999px;padding:3px 10px;background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-tertiary)}',
      '.sd-search-input{border:none;outline:none;background:transparent;color:var(--dsw-alias-label-primary);font-size:12px;width:170px}',
      '.sd-tagrow{display:inline-flex;align-items:center;gap:5px;flex-wrap:wrap}',
      '.sd-tagchip{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-secondary);font-size:11px;padding:1px 8px;border-radius:999px;cursor:pointer;transition:color .12s ease,border-color .12s ease,background .12s ease}',
      '.sd-tagchip:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-border-l3)}',
      '.sd-tagchip.on{color:var(--dsw-alias-brand-primary);border-color:var(--dsw-alias-brand-primary);background:color-mix(in srgb,var(--dsw-alias-brand-primary) 10%,transparent)}',
      '.sd-tagchip.sm{font-size:10.5px;padding:0 7px}',
      '.sd-tagcount{color:var(--dsw-alias-label-dimmed);font-variant-numeric:tabular-nums}',
      '.sd-card-tags{display:flex;flex-wrap:wrap;gap:4px}',
      '.sd-due{font-size:11px;color:var(--dsw-alias-label-tertiary);font-variant-numeric:tabular-nums}',
      '.sd-due.late{color:var(--dsw-alias-state-error-primary)}',
      '.sd-card.due{box-shadow:inset 2px 0 0 color-mix(in srgb,var(--dsw-alias-state-error-primary) 60%,transparent)}',
      '.sd-textbtn.sm{font-size:11px;padding:2px 8px}',
      '.sd-textbtn:disabled{opacity:.5;cursor:default}',
      '.sd-hidden-file{display:none}',
      '.sd-mdrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-left:auto}',
      '.sd-mdnote{font-size:11px;color:var(--dsw-alias-label-tertiary);max-width:26em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}',
      '.sd-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}',
      '.sd-col{border:1px solid var(--dsw-alias-border-l1);border-radius:14px;background:var(--dsw-alias-bg-layer-1);padding:10px;display:flex;flex-direction:column;gap:9px;min-height:120px;transition:border-color .15s ease,background .15s ease}',
      '.sd-col.hover{border-color:var(--dsw-alias-brand-primary);background:color-mix(in srgb,var(--dsw-alias-brand-primary) 5%,var(--dsw-alias-bg-layer-1))}',
      '.sd-col-head{display:flex;align-items:center;gap:7px;padding:2px 4px 8px;border-bottom:1px solid var(--dsw-alias-border-l1)}',
      '.sd-col-latin{font-size:10px;letter-spacing:.16em;color:var(--dsw-alias-label-dimmed)}',
      '.sd-col-label{font-size:12.5px;font-weight:600;color:var(--dsw-alias-label-secondary)}',
      '.sd-col-count{margin-left:auto;font-size:11px;color:var(--dsw-alias-label-tertiary);font-variant-numeric:tabular-nums;background:var(--dsw-alias-bg-layer-2);border-radius:999px;padding:1px 8px}',
      '.sd-col-body{display:flex;flex-direction:column;gap:8px}',
      '.sd-col-empty{font-size:11.5px;color:var(--dsw-alias-label-dimmed);padding:10px 6px;text-align:center}',
      // 卡片
      '.sd-card{border:1px solid var(--dsw-alias-border-l1);border-radius:10px;background:var(--dsw-alias-bg-base);padding:9px 11px;display:flex;flex-direction:column;gap:6px;cursor:grab;transition:border-color .12s ease,box-shadow .12s ease,opacity .12s ease}',
      '.sd-card:hover{border-color:var(--dsw-alias-border-l3)}',
      '.sd-card.dragging{opacity:.45}',
      '.sd-card.done{opacity:.68}',
      '.sd-card.done .sd-card-title{text-decoration:line-through;color:var(--dsw-alias-label-tertiary)}',
      '.sd-card-top{display:flex;align-items:flex-start;gap:6px}',
      '.sd-pin{color:var(--dsw-alias-state-business-primary);font-size:11px;line-height:1.5}',
      '.sd-card-title{font-size:13px;line-height:1.5;word-break:break-word}',
      '.sd-card-note{font-size:11.5px;line-height:1.5;color:var(--dsw-alias-label-tertiary);white-space:pre-wrap;word-break:break-word}',
      '.sd-card-foot{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:11px;color:var(--dsw-alias-label-secondary)}',
      '.sd-tag{font-size:10.5px;padding:1px 7px;border-radius:999px;background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-secondary);border:1px solid transparent}',
      '.sd-spent{font-variant-numeric:tabular-nums;color:var(--dsw-alias-brand-primary)}',
      '.sd-est{font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-dimmed)}',
      '.sd-card-acts{margin-left:auto;display:flex;align-items:center;gap:4px;opacity:0;transition:opacity .12s ease}',
      '.sd-card:hover .sd-card-acts,.sd-card:focus-within .sd-card-acts{opacity:1}',
      // 触屏没有 hover，操作按钮不能永远隐身
      '@media (hover:none){.sd-card-acts{opacity:1}}',
      // 迷你条被宿主模态盖住过很多次：抬到弹层之上，并让拖动更跟手
      '.sd-mini:hover{box-shadow:0 10px 30px rgba(0,0,0,.34)}',
      '.sd-mini-fab:hover{box-shadow:0 10px 30px rgba(0,0,0,.34)}',
      // 尊重系统的「减少动态效果」
      '@media (prefers-reduced-motion:reduce){.sd-mini,.sd-mini-fab,.sd-card-acts,.sd-act{transition:none}}',
      // 键盘可见焦点
      '.sd-iconbtn:focus-visible,.sd-act:focus-visible,.sd-pill:focus-visible,.sd-textbtn:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:2px}',
      '.sd-act{display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--dsw-alias-label-tertiary);cursor:pointer;padding:2px 5px;border-radius:5px;font-size:11px;transition:color .12s ease,background .12s ease}',
      '.sd-act:hover{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-interactive-bg-hover)}',
      '.sd-act.danger{color:var(--dsw-alias-state-error-primary)}',
      // 卡片内联编辑
      '.sd-card.editing{outline:1px solid var(--dsw-alias-brand-primary);outline-offset:1px;cursor:default}',
      '.sd-edit{display:flex;flex-direction:column;gap:6px}',
      '.sd-edit-row{display:flex;align-items:center;gap:8px}',
      '.sd-edit-label{flex:none;width:4.6em;font-size:11px;color:var(--dsw-alias-label-tertiary)}',
      '.sd-edit-input{flex:1;min-width:0;border:1px solid var(--dsw-alias-border-l1);border-radius:7px;background:var(--dsw-alias-bg-base);color:var(--dsw-alias-label-primary);font-size:12px;line-height:1.5;padding:4px 7px;outline:none;font-family:inherit;resize:vertical}',
      '.sd-edit-input:focus{border-color:var(--dsw-alias-brand-primary)}',
      '.sd-act.danger:hover{background:var(--dsw-alias-interactive-bg-hover-danger)}',
      // 新建
      '.sd-add{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;border:1px dashed var(--dsw-alias-border-l1);background:transparent;color:var(--dsw-alias-label-tertiary);font-size:12px;padding:7px;border-radius:9px;cursor:pointer;transition:color .12s ease,border-color .12s ease}',
      '.sd-add:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-border-l3)}',
      '.sd-composer{display:flex;flex-direction:column;gap:7px;border:1px solid var(--dsw-alias-brand-primary);border-radius:10px;padding:8px;background:var(--dsw-alias-bg-base)}',
      '.sd-composer-input{width:100%;resize:vertical;border:none;outline:none;background:transparent;color:var(--dsw-alias-label-primary);font-size:13px;line-height:1.55;font-family:inherit}',
      '.sd-composer-foot{display:flex;align-items:center;gap:8px}',
      '.sd-composer-foot .sd-row{margin-left:auto}',
      // 块
      '.sd-two{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:14px;align-items:start}',
      '.sd-card-block{border:1px solid var(--dsw-alias-border-l1);border-radius:14px;background:var(--dsw-alias-bg-layer-1);padding:13px 15px;display:flex;flex-direction:column;gap:10px}',
      '.sd-block-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}',
      '.sd-block-title{margin:0;font-size:13px;font-weight:600;letter-spacing:.03em}',
      '.sd-block-sub{font-size:11.5px;color:var(--dsw-alias-label-tertiary)}',
      // 热力图
      '.sd-heat-scroll{overflow-x:auto;padding-bottom:4px}',
      '.sd-heat{display:grid;gap:3px;width:max-content}',
      '.sd-heat-corner{width:22px}',
      '.sd-heat-month{font-size:10.5px;color:var(--dsw-alias-label-tertiary);white-space:nowrap;padding-bottom:2px}',
      '.sd-heat-day{font-size:9.5px;line-height:13px;color:var(--dsw-alias-label-dimmed);text-align:right;padding-right:2px}',
      '.sd-cell{width:13px;height:13px;border-radius:2.5px;background:var(--dsw-alias-bg-layer-3)}',
      '.sd-cell.empty{background:transparent}',
      '.sd-cell.lv0{background:var(--dsw-alias-bg-layer-3);box-shadow:inset 0 0 0 1px var(--dsw-alias-border-l1)}',
      '.sd-cell.lv1{background:color-mix(in srgb,var(--dsw-alias-brand-primary) 24%,var(--dsw-alias-bg-layer-3))}',
      '.sd-cell.lv2{background:color-mix(in srgb,var(--dsw-alias-brand-primary) 45%,var(--dsw-alias-bg-layer-3))}',
      '.sd-cell.lv3{background:color-mix(in srgb,var(--dsw-alias-brand-primary) 70%,var(--dsw-alias-bg-layer-3))}',
      '.sd-cell.lv4{background:var(--dsw-alias-brand-primary)}',
      '.sd-cell.today{outline:1px solid var(--dsw-alias-label-primary);outline-offset:1px}',
      '.sd-cell.legend{display:inline-block;vertical-align:middle;margin:0 2px}',
      '.sd-heat-foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:11px;color:var(--dsw-alias-label-tertiary)}',
      '.sd-legend{display:inline-flex;align-items:center;gap:3px;margin-left:auto}',
      // 单词打卡（不背单词）
      '.sd-pill.busy{opacity:.6;cursor:progress}',
      '.sd-pill:disabled{opacity:.45;cursor:default}',
      '.sd-bgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}',
      '.sd-bstat{border:1px solid var(--dsw-alias-border-l1);border-radius:11px;background:var(--dsw-alias-bg-base);padding:11px 13px;display:flex;flex-direction:column;gap:5px;min-width:0}',
      '.sd-bstat-label{font-size:11px;letter-spacing:.04em;color:var(--dsw-alias-label-tertiary)}',
      '.sd-bstat-value{display:flex;align-items:baseline;gap:4px;min-width:0}',
      '.sd-bstat-num{font-size:25px;font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-primary)}',
      '.sd-bstat-num.sd-bstat-brand{color:var(--dsw-alias-brand-primary)}',
      '.sd-bstat-unit{font-size:12px;color:var(--dsw-alias-label-secondary)}',
      '.sd-bcal-ym{font-size:12px;font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-secondary);min-width:6.5em;text-align:center}',
      '.sd-bcal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;width:100%;max-width:340px;margin:2px auto 0}',
      '.sd-bcal-head{font-size:10.5px;color:var(--dsw-alias-label-dimmed);text-align:center;line-height:1.6}',
      '.sd-bcal-cell{aspect-ratio:1/1;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-tertiary);background:var(--dsw-alias-bg-layer-3);box-shadow:inset 0 0 0 1px var(--dsw-alias-border-l1)}',
      '.sd-bcal-cell.blank{background:transparent;box-shadow:none}',
      '.sd-bcal-cell.future{opacity:.45}',
      '.sd-bcal-cell.on{background:color-mix(in srgb,var(--dsw-alias-brand-primary) 78%,var(--dsw-alias-bg-layer-3));color:var(--dsw-alias-label-primary);font-weight:600;box-shadow:none}',
      '.sd-bcal-cell.today{outline:1px solid var(--dsw-alias-label-primary);outline-offset:1px}',
      '.sd-bcal-cell.legend{width:13px;height:13px;aspect-ratio:auto;border-radius:2.5px;display:inline-block;vertical-align:middle;margin:0 2px}',
      '.sd-book{display:flex;flex-direction:column;gap:4px}',
      '.sd-book-name{font-size:13px;line-height:1.5;word-break:break-word}',
      '.sd-book-meta{font-size:11.5px;color:var(--dsw-alias-label-tertiary);font-variant-numeric:tabular-nums}',
      '.sd-recent{display:flex;flex-direction:column;gap:6px}',
      '.sd-recent-row{display:grid;grid-template-columns:minmax(0,3.6em) minmax(0,1fr) auto;align-items:center;gap:9px;font-size:11.5px}',
      '.sd-recent-date{color:var(--dsw-alias-label-secondary);font-variant-numeric:tabular-nums}',
      '.sd-recent-bar{height:5px;border-radius:999px;background:var(--dsw-alias-bg-layer-3);overflow:hidden}',
      '.sd-recent-bar i{display:block;height:100%;border-radius:999px;background:color-mix(in srgb,var(--dsw-alias-brand-primary) 70%,transparent)}',
      '.sd-recent-num{color:var(--dsw-alias-label-tertiary);font-variant-numeric:tabular-nums;white-space:nowrap}',
      // 科目分布
      '.sd-subj-list{display:flex;flex-direction:column;gap:7px}',
      '.sd-subj{display:grid;grid-template-columns:minmax(0,7.5em) minmax(0,1fr) auto;align-items:center;gap:9px;font-size:11.5px}',
      '.sd-subj-label{color:var(--dsw-alias-label-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}',
      '.sd-subj-bar{height:5px;border-radius:999px;background:var(--dsw-alias-bg-layer-3);overflow:hidden}',
      '.sd-subj-min{font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-tertiary)}',
      '.sd-empty-block{font-size:11.5px;color:var(--dsw-alias-label-dimmed);line-height:1.6}',
      // 番茄分布饼图
      '.sd-pie-wrap{display:flex;align-items:center;gap:14px;flex-wrap:wrap}',
      '.sd-pie{flex:none}',
      '.sd-pie path{stroke:var(--dsw-alias-bg-layer-1);stroke-width:1}',
      '.sd-pie-num{font-size:13px;font-weight:600;fill:var(--dsw-alias-label-primary);font-variant-numeric:tabular-nums}',
      '.sd-pie-cap{font-size:7.5px;fill:var(--dsw-alias-label-tertiary)}',
      '.sd-pie-legend{flex:1;min-width:9em;display:flex;flex-direction:column;gap:6px}',
      '.sd-pie-row{display:flex;align-items:center;gap:8px;font-size:11.5px;min-width:0}',
      '.sd-pie-swatch{width:9px;height:9px;border-radius:3px;flex:none}',
      '.sd-pie-name{color:var(--dsw-alias-label-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}',
      '.sd-pie-min{margin-left:auto;flex:none;font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-tertiary)}',
      '.sd-range-tabs{display:flex;align-items:center;gap:5px;margin-left:auto}',
      // 今日复习
      '.sd-block-title{display:flex;align-items:center;gap:6px}',
      '.sd-review-list{display:flex;flex-direction:column;gap:8px}',
      '.sd-review-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid var(--dsw-alias-border-l1);border-radius:10px;background:var(--dsw-alias-bg-layer-2);padding:8px 10px}',
      '.sd-review-main{flex:1;min-width:12em;display:flex;flex-direction:column;gap:5px}',
      '.sd-review-title{font-size:13px;line-height:1.5;word-break:break-word}',
      '.sd-review-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:11px}',
      '.sd-review-cap{color:var(--dsw-alias-label-dimmed);font-variant-numeric:tabular-nums}',
      '.sd-review-acts{display:flex;align-items:center;gap:6px;flex:none;margin-left:auto}',
      '.sd-grade{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-secondary);font-size:12px;padding:3px 11px;border-radius:8px;cursor:pointer;transition:color .12s ease,border-color .12s ease,background .12s ease}',
      '.sd-grade:hover{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-border-l3);background:var(--dsw-alias-interactive-bg-hover)}',
      '.sd-grade:disabled{opacity:.5;cursor:default}',
      '.sd-grade.again{color:var(--dsw-alias-state-error-primary)}',
      '.sd-grade.good{color:var(--dsw-alias-brand-primary);border-color:color-mix(in srgb,var(--dsw-alias-brand-primary) 35%,transparent)}',
      '.sd-grade.easy{color:var(--dsw-alias-state-success-primary)}',
      '.sd-review-more{font-size:11px;color:var(--dsw-alias-label-dimmed)}',
      // 遗忘曲线：颜色跟着「今天还剩多少记忆」走，绿=还稳、蓝=该看了、红=快塌了
      '.sd-curve{flex:none;overflow:visible}',
      '.sd-curve-line{fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}',
      '.sd-curve-area{fill:currentColor;stroke:none;opacity:.13}',
      '.sd-curve-due{stroke:currentColor;stroke-width:1;stroke-dasharray:2 2;opacity:.55}',
      '.sd-curve-dot{fill:currentColor}',
      '.sd-curve-ok{color:var(--dsw-alias-state-success-primary)}',
      '.sd-curve-warn{color:var(--dsw-alias-brand-primary)}',
      '.sd-curve-late{color:var(--dsw-alias-state-error-primary)}',
      '.sd-review-curve{display:inline-flex;align-items:center;gap:5px}',
      '.sd-review-mem{color:var(--dsw-alias-label-dimmed);font-variant-numeric:tabular-nums}',
      // 今日建议
      '.sd-plan{display:flex;flex-direction:column;gap:6px;border:1px solid color-mix(in srgb,var(--dsw-alias-brand-primary) 30%,transparent);border-radius:10px;background:color-mix(in srgb,var(--dsw-alias-brand-primary) 6%,transparent);padding:8px 10px}',
      '.sd-plan-head{display:flex;align-items:center;gap:6px;font-size:12px}',
      '.sd-plan-title{font-weight:600;color:var(--dsw-alias-label-primary)}',
      '.sd-plan-toggle{margin-left:auto;border:none;background:none;color:var(--dsw-alias-label-tertiary);font-size:11px;cursor:pointer;padding:0 2px;font-family:inherit}',
      '.sd-plan-toggle:hover{color:var(--dsw-alias-label-primary)}',
      '.sd-plan-advice{font-size:11.5px;line-height:1.6;color:var(--dsw-alias-label-secondary)}',
      '.sd-plan-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px}',
      '.sd-plan-item{display:flex;align-items:center;gap:7px;font-size:12px;min-width:0}',
      '.sd-plan-rank{flex:none;width:1.35em;height:1.35em;border-radius:50%;background:var(--dsw-alias-brand-primary);color:var(--dsw-alias-bg-base);font-size:10px;display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}',
      '.sd-plan-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--dsw-alias-label-primary)}',
      '.sd-plan-reason{flex:none;color:var(--dsw-alias-label-dimmed);font-size:11px}',
      // 未来 7 天到期预报
      '.sd-forecast{display:flex;align-items:flex-end;gap:9px;border-top:1px solid var(--dsw-alias-border-l1);padding-top:8px;flex-wrap:wrap}',
      '.sd-forecast-cap{font-size:11px;color:var(--dsw-alias-label-dimmed);flex:none;padding-bottom:2px}',
      '.sd-forecast-bars{display:flex;align-items:flex-end;gap:5px;height:62px;flex:none}',
      '.sd-fbar{width:26px;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2px}',
      '.sd-fbar-track{flex:1;width:100%;max-width:20px;display:flex;align-items:flex-end;border-radius:5px;background:var(--dsw-alias-bg-layer-3);overflow:hidden}',
      '.sd-fbar-fill{width:100%;border-radius:5px 5px 0 0;background:color-mix(in srgb,var(--dsw-alias-brand-primary) 45%,transparent);transition:height .3s ease}',
      '.sd-fbar.today .sd-fbar-fill{background:var(--dsw-alias-brand-primary)}',
      '.sd-fbar-n{font-size:9.5px;color:var(--dsw-alias-label-tertiary);font-variant-numeric:tabular-nums;height:11px;line-height:11px}',
      '.sd-fbar-label{font-size:9.5px;color:var(--dsw-alias-label-dimmed);font-variant-numeric:tabular-nums}',
      '.sd-fbar.today .sd-fbar-label{color:var(--dsw-alias-label-secondary)}',
      '.sd-forecast-tail{font-size:11px;color:var(--dsw-alias-label-tertiary);flex:1;min-width:8em;padding-bottom:2px}',
      // 周报
      '.sd-weeks{display:flex;align-items:flex-end;gap:6px;height:104px}',
      '.sd-week{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px;height:100%}',
      '.sd-week-track{flex:1;width:100%;max-width:26px;display:flex;align-items:flex-end;border-radius:6px;background:var(--dsw-alias-bg-layer-3);overflow:hidden}',
      '.sd-week-fill{width:100%;border-radius:6px 6px 0 0;background:color-mix(in srgb,var(--dsw-alias-brand-primary) 45%,transparent);transition:height .3s ease}',
      '.sd-week.current .sd-week-fill{background:var(--dsw-alias-brand-primary)}',
      '.sd-week-min{font-size:10px;color:var(--dsw-alias-label-tertiary);font-variant-numeric:tabular-nums;height:12px}',
      '.sd-week-label{font-size:10px;color:var(--dsw-alias-label-dimmed);font-variant-numeric:tabular-nums}',
      // 每日复盘
      '.sd-journal-input{width:100%;resize:vertical;border:1px solid var(--dsw-alias-border-l1);border-radius:10px;background:var(--dsw-alias-bg-base);color:var(--dsw-alias-label-primary);font-size:13px;line-height:1.6;padding:8px 10px;outline:none;font-family:inherit}',
      '.sd-journal-input:focus{border-color:var(--dsw-alias-brand-primary)}',
      '.sd-journal-list{display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--dsw-alias-border-l1);padding-top:8px}',
      '.sd-journal-item{display:grid;grid-template-columns:3.4em 1fr;gap:8px;font-size:11.5px;color:var(--dsw-alias-label-secondary)}',
      '.sd-journal-date{color:var(--dsw-alias-label-dimmed);font-variant-numeric:tabular-nums}',
      '.sd-journal-text{white-space:pre-wrap;word-break:break-word;line-height:1.55}',
      '.sd-error{border:1px solid var(--dsw-alias-state-error-primary);border-radius:10px;padding:8px 12px;font-size:12px;color:var(--dsw-alias-state-error-primary);background:color-mix(in srgb,var(--dsw-alias-state-error-primary) 8%,transparent)}',
      '.sd-foot{font-size:10.5px;color:var(--dsw-alias-label-dimmed);text-align:center;word-break:break-all}',
      // 迷你条
      // 迷你条：portal 到 body 后是根层叠上下文里的浮层，所以要自己声明 pointer-events
      // 与 z-index（宿主的模态框 1000、菜单/气泡 1100，我们压在它们下面）。
      '.sd-mini{position:fixed;right:18px;bottom:18px;z-index:900;pointer-events:auto;will-change:left,top;touch-action:none;display:flex;flex-direction:column;border:1px solid var(--dsw-alias-border-l2);border-radius:12px;background:var(--dsw-alias-bg-overlay,var(--dsw-alias-bg-layer-1));box-shadow:0 8px 26px rgba(0,0,0,.28);backdrop-filter:blur(10px);font-size:12px;color:var(--dsw-alias-label-primary);max-width:280px}',
      '.sd-mini-main{display:flex;align-items:center;gap:8px;padding:8px 10px;cursor:grab;touch-action:none;user-select:none}',
      '.sd-mini-main:active{cursor:grabbing}',
      '.sd-mini-grip{flex:none;width:8px;height:14px;opacity:.4;background-image:radial-gradient(currentColor 1px,transparent 1.3px);background-size:4px 4px;background-position:1px 2px;background-repeat:repeat}',
      '.sd-mini-clock{font-variant-numeric:tabular-nums;font-size:15px;font-weight:600;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}',
      '.sd-mini-clock.break{color:var(--dsw-alias-state-success-primary)}',
      '.sd-mini-task{font-size:11px;color:var(--dsw-alias-label-tertiary);max-width:8em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}',
      '.sd-mini-panel{border-top:1px solid var(--dsw-alias-border-l1);padding:9px 10px;display:flex;flex-direction:column;gap:7px}',
      '.sd-mini-row{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--dsw-alias-label-secondary)}',
      '.sd-mini-row .sd-mini-cap{flex:none}',
      '.sd-mini-actions{gap:6px}',
      '.sd-mini-late{color:var(--dsw-alias-state-error-primary)}',
      '.sd-mini-fab{position:fixed;right:18px;bottom:18px;z-index:900;pointer-events:auto;will-change:left,top;width:34px;height:34px;border-radius:50%;border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-overlay,var(--dsw-alias-bg-layer-1));color:var(--dsw-alias-label-secondary);display:flex;align-items:center;justify-content:center;cursor:grab;touch-action:none;box-shadow:0 6px 20px rgba(0,0,0,.25)}',
      '.sd-mini-fab:hover{color:var(--dsw-alias-brand-primary)}',
      '.sd-error{margin:16px;padding:14px 16px;border:1px solid var(--dsw-alias-state-error-primary);border-radius:10px;background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-primary);font-size:13px;line-height:1.6}',
      '.sd-error-stack{margin:10px 0 0;padding:10px;max-height:320px;overflow:auto;white-space:pre-wrap;font-size:11px;line-height:1.5;color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-layer-1);border-radius:6px}',
      // 设置
      '.sd-settings{display:flex;flex-direction:column;gap:14px;font-size:13px;color:var(--dsw-alias-label-primary)}',
      '.sd-settings-note{margin:0;font-size:12px;color:var(--dsw-alias-label-secondary);line-height:1.65}',
      '.sd-settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}',
      '.sd-field{display:flex;flex-direction:column;gap:5px}',
      '.sd-field-inline{flex-direction:row;align-items:center;gap:9px;flex-wrap:wrap}',
      '.sd-field-label{font-size:12px;color:var(--dsw-alias-label-secondary)}',
      '.sd-field-hint{font-size:11px;color:var(--dsw-alias-label-tertiary);line-height:1.5}',
      '.sd-settings-file{font-size:11px;color:var(--dsw-alias-label-dimmed);word-break:break-all}',
      '@media (max-width:900px){.sd-board{grid-template-columns:minmax(0,1fr)}.sd-two{grid-template-columns:minmax(0,1fr)}}',
    ].join('')

    // -----------------------------------------------------------------------
    // apply
    // -----------------------------------------------------------------------

    let clientCtx = null

    const inject = ['slots', 'layout']

    function apply(ctx) {
      clientCtx = ctx

      // 浏览器里没有能读的控制台，先把环境摸清楚回传一份，再把 window 上的
      // 全局异常也接住。这些都不影响主流程，失败就算了。
      reportDiag({
        kind: 'boot',
        where: 'client',
        message: 'client half applied',
        detail: {
          href: String(window.location && window.location.href),
          ua: String(navigator.userAgent || ''),
          innerWidth: window.innerWidth,
          innerHeight: window.innerHeight,
          hasSlots: (() => { try { return Boolean(ctx.get && ctx.get('slots')) } catch { return 'throws' } })(),
          hasLayout: Boolean(getLayout()),
          reactVersion: String((React && React.version) || '未知'),
        },
      })
      window.addEventListener('error', (event) => {
        reportDiag({
          kind: 'window-error',
          where: 'window',
          message: String((event && event.message) || event),
          stack: String(((event && event.error && event.error.stack) || '')).split('\n').slice(0, 12).join('\n'),
          detail: { file: String((event && event.filename) || ''), line: (event && event.lineno) || 0, col: (event && event.colno) || 0 },
        })
      })
      window.addEventListener('unhandledrejection', (event) => {
        const reason = event && event.reason
        reportDiag({
          kind: 'unhandled-rejection',
          where: 'window',
          message: String((reason && reason.message) || reason),
          stack: String((reason && reason.stack) || '').split('\n').slice(0, 12).join('\n'),
        })
      })

      const styleEl = document.createElement('style')
      styleEl.textContent = CSS
      document.head.appendChild(styleEl)
      ctx.effect(() => () => { styleEl.remove() }, 'dsh-study-desk: styles')

      store.refresh()
      startWatcher()
      ctx.effect(() => () => {
        if (watchTimer) { clearInterval(watchTimer); watchTimer = 0 }
      }, 'dsh-study-desk: watcher')

      let slots
      try { slots = ctx.get('slots') } catch (error) {
        reportDiag({ kind: 'slots-throw', where: 'client', message: '取 slots 服务抛错：' + String((error && error.message) || error) })
        console.warn('[dsh-study-desk] 取 slots 服务抛错，界面不注册', error)
        return
      }
      if (slots === undefined) {
        reportDiag({ kind: 'no-slots', where: 'client', message: '拿不到 slots 服务，界面不注册' })
        console.warn('[dsh-study-desk] 拿不到 slots 服务，界面不注册')
        return
      }

      // 每个槽位都用自己的 error boundary 包一层：某一处渲染炸了不该白屏，
      // 而且要把栈回传到磁盘，否则在浏览器里根本看不见。
      const register = (slot, meta, render, where) => {
        try {
          slots.inject(slot, () => slots.register(meta, (...args) => {
            let node
            try {
              node = render(...args)
            } catch (error) {
              reportDiag({
                kind: 'render-throw',
                where,
                message: 'factory 抛错：' + String((error && error.message) || error),
                stack: String((error && error.stack) || '').split('\n').slice(0, 12).join('\n'),
              })
              throw error
            }
            // 渲染成功也回传一次（同 where 只报第一次）：这样「面板没出来」
            // 到底是没渲染、还是渲染了但看不见，从磁盘上就能分辨。
            reportDiag({ kind: 'render-ok', where, message: 'factory 渲染成功' })
            return h(Boundary, { where }, node)
          }))
        } catch (error) {
          reportDiag({
            kind: 'register-failed',
            where,
            message: '注册槽位失败：' + String((error && error.message) || error),
            stack: String((error && error.stack) || '').split('\n').slice(0, 12).join('\n'),
          })
        }
      }

      // 左侧栏图标：id 与 main 的 key 同名，侧栏点它就会 dispatch 到 main 的同一格
      register('sidebar.panellist',
        { name: 'sidebar.panellist', id: PANEL_ID, order: 40, label: '学习工作台' },
        (props) => h(Icon, { name: 'board', size: (props && props.size) || 18 }),
        'sidebar.panellist')

      // 整页工作台
      register('main',
        { name: 'main', key: PANEL_ID },
        () => h(Panel, { key: 'panel' }),
        'main')

      // 右下角常驻迷你计时条（跨面板存活）
      register('shell.overlay',
        { name: 'shell.overlay', id: 'study-desk-mini', order: 80, label: '专注计时' },
        () => h(MiniBar, { key: 'mini' }),
        'shell.overlay')

      // 设置页
      register('settings.section',
        { name: 'settings.section', id: 'study-desk', order: 27, label: '学习工作台' },
        () => h(Settings, { key: 'settings' }),
        'settings.section')

      // 单词打卡：与工作台并列的第二个入口。
      // 侧栏 id 必须与 main 的 key 完全同名，否则宿主 layout.selectPanel 会抛
      //   layout.selectPanel: main panel "…" is not registered
      register('sidebar.panellist',
        { name: 'sidebar.panellist', id: BBCDC_PANEL_ID, order: 41, label: '单词打卡' },
        (props) => h(Icon, { name: 'tag', size: (props && props.size) || 18 }),
        'sidebar.panellist.bbdc')

      register('main',
        { name: 'main', key: BBCDC_PANEL_ID },
        () => h(BbdcPanel, { key: 'bbdc' }),
        'main.bbdc')

      reportDiag({ kind: 'slots-registered', where: 'client', message: '六个槽位注册调用已完成' })
    }

    exports.apply = apply
    exports.inject = inject
    exports.__test = { clampMiniPos, fmtClock, fmtStamp, daysUntil, tasksIn, CSS, MemoryCurve, Forecast, PlanStrip, ReviewQueue, store, BbdcPanel, monthCells, shiftYm, ymOf }
    return module.exports
  },
})