// reports.jsx — 訓練後報告書（三種對象：長者「進步＋誇誇」/ 家屬「看得懂＋日常練習」/ 照服員「個人即時數據」）
const { useState: useRpt } = React;

// 六力白話解釋（給家屬看得懂，不用術語）
const POWER_PLAIN = {
  '認知力': '記得人事物、算數、做決定的能力。',
  '反應力': '看到或聽到事情後多快能反應，跟專注力有關。',
  '體適能力': '手腳的力氣、平衡與動作協調，影響走路與日常活動。',
  '自主力': '自己決定、自己動手做事的意願，越高代表越獨立。',
  '社交力': '跟別人互動、參與團體的程度，影響心情與孤單感。',
  '情緒力': '心情的穩定與成就感，常被稱讚、有成功經驗會更好。',
};
// 家屬日常練習建議（把六力翻成「在家可以陪他做的事」）
const DAILY_PRACTICE = {
  '認知力': ['一起看舊照片、聊以前的事', '玩撲克牌或簡單的記憶遊戲', '買東西時讓他算錢、找零'],
  '反應力': ['玩你丟我接的球', '聽到名字就拍手或舉手', '跟著音樂一起打拍子'],
  '體適能力': ['每天陪他散步 15 分鐘', '坐著做毛巾操、抬抬腳', '原地踏步配喜歡的歌'],
  '自主力': ['讓他自己決定今天穿什麼、吃什麼', '自己倒水、擺碗筷', '多問「你想…」讓他選'],
  '社交力': ['多打電話陪他聊天', '帶他去看老朋友、參加聚會', '聚餐時邀他多說話'],
  '情緒力': ['完成事情時多稱讚他', '一起聽他年輕時喜歡的歌', '每天找一件開心的小事'],
};
const ELDER_PRAISE = {
  '認知力': '腦袋越來越靈光', '反應力': '反應越來越快', '體適能力': '手腳越來越有力',
  '自主力': '越來越能自己作主', '社交力': '越來越愛跟大家互動', '情緒力': '笑容越來越多',
};

function buildReport(s) {
  const base = window.round1(window.baselineAvg(s));
  const recent = window.round1(window.recentAvg(s));
  const delta = window.round1(window.deltaAvg(s));
  const rows = window.SIX_ORDER.map((k) => ({ k, b: s.sp[k][0], r: s.sp[k][1], d: s.sp[k][1] - s.sp[k][0], soft: window.PSYCHOSOCIAL.includes(k) }));
  const improved = [...rows].sort((a, b) => b.d - a.d)[0];
  const strongest = [...rows].sort((a, b) => b.r - a.r)[0];
  const weakest = [...rows].sort((a, b) => a.r - b.r)[0];
  return { s, base, recent, delta, rows, improved, strongest, weakest };
}

// —— 報告白話敘述文案庫（家屬 / 服務員）：以 LLM 風格通俗解釋取代條列與數據 ——
const NARRATIVE = {
  family: {
    opening: {
      up: '這份報告想用最白話的方式，跟您聊聊{name}最近的近況。整體看下來，比剛來的時候進步了 {delta} 分，最近六力平均來到 {recent} 分，這禮拜也來了 {days} 天，一天一天慢慢往好的方向走，我們在這邊看著，真的很替他開心，也想第一時間讓您知道。',
      flat: '這份報告想用最白話的方式，跟您聊聊{name}最近的近況。整體看下來，他維持得很穩，最近六力平均 {recent} 分，這禮拜來了 {days} 天，作息和狀態都安安穩穩的。對長輩來說，能一直保持住，本身就是一件很不容易、很值得高興的事，我們會繼續陪著他。',
      down: '這份報告想用最白話的方式，跟您聊聊{name}最近的近況。這陣子他比較需要多一點陪伴，老師們每天都有特別留意他、把他放在心上。其實狀態起起伏伏很正常，誰都會有這樣的時候，接下來我們會一起多花點心思，慢慢陪他調整回來，您不用太擔心。',
    },
    powers: {
      '認知力': { plain: '就是記得人事物、會算錢、能自己拿主意的那份腦力，像記得今天禮拜幾、出門買菜會算找零。', up: '這陣子{name}的頭腦更靈光了（進步 {delta} 分）。反映在生活裡，就是跟他講話更接得上話、交代的事記得住、要做決定時也更有自己的主見。下回跟他聊天，您會發現一來一往更熱絡，像是又找回了那個愛跟人講古的他。', flat: '{name}的記性和判斷都維持得很穩，該記得的記得、該算的算得清楚。這份「沒有退步」本身就很值得開心。平常陪他聊聊以前的事、一起算算菜錢，動動腦，就是最好的保養。', down: '最近{name}的記性、反應稍微弱了一點點，這在這個年紀很常見，真的不用太擔心。平常多陪他聊聊年輕時的往事、一起翻翻老照片、算算錢，這些看似平常的小事，慢慢就能幫他把腦力找回來。' },
      '反應力': { plain: '就是看到、聽到事情之後反應有多快，跟專不專心很有關係，像有人在背後叫他，能不能很快回頭。', up: '{name}最近變得更專心、反應也更快了（進步 {delta} 分）。意思是叫他名字會更快回頭、走在路上閃車閃人也更俐落。對長輩來說，這份「快一點」其實就是「安全多一點」，出門在外我們也比較放心。', flat: '{name}的專注和反應都穩穩維持在水準上，狀態很安定。這代表他每天都清清楚楚、跟得上節奏。平常陪他玩玩你丟我接、跟著音樂打打拍子，就能輕鬆維持這份靈活。', down: '{name}最近反應慢了一些，多半是比較累、或一時沒那麼專心，先讓他好好休息別勉強。平常陪他玩玩你丟我接、跟著熟悉的歌打打拍子，在輕鬆好玩裡頭，反應自然會一點一點回來。' },
      '體適能力': { plain: '就是手腳的力氣、身體的平衡和動作協調，直接關係到走路穩不穩、能不能自己打理日常的事。', up: '{name}的手腳更有力、走路也更穩了（進步 {delta} 分）。這一項對長輩格外重要，因為站得穩、走得動，就比較不怕跌倒，能自己做的事也更多，這份「我還行」的踏實感，會讓他過得更有底氣。', flat: '{name}的力氣和平衡都維持得不錯，身子骨穩穩的。這個年紀能一直保持住，真的很棒。每天陪他出去散散步、動動筋骨、伸伸手腳，就是最實在的保養。', down: '{name}最近力氣、平衡退了一點，平常走路、從椅子起身的時候，記得在旁邊多留意、適時扶他一把。每天陪他慢慢散個步、坐著抬抬腳、動動手，一點一點練，身子骨會慢慢穩回來的。' },
      '自主力': { plain: '就是他願不願意自己拿主意、自己動手做，這份意願越高，代表他越獨立、越不需要旁人催著走。', up: '{name}最近更願意自己拿主意、自己動手了（進步 {delta} 分）。像是自己決定要吃什麼、自己倒杯水喝。別小看這些小事，這份「我可以、我自己來」的感覺，對長輩的尊嚴和心情，比什麼都重要，很值得我們一起守護。', flat: '{name}的自主力維持得很穩，平常願意自己做的事都還在自己做。這就很好了。平常多給他幾個選擇、多讓他自己來，少幫一點、多等一下，就是對他最好的鼓勵。', down: '{name}最近比較依賴別人、也比較沒自信了一些。這時候別急著替他把事情做完，多用「你想…」的方式問他、讓他自己選、自己試，哪怕慢一點也沒關係，他會在一次次「我做到了」裡，慢慢把主動找回來。' },
      '社交力': { plain: '就是他跟別人互動、參與大家的多寡，這會直接影響他心情好不好、會不會覺得孤單。', up: '{name}最近更愛跟大家來往了（進步 {delta} 分），這點特別可貴。對長輩來說，有人聊天、有伴一起，心裡就熱鬧、開朗，比較不會一個人悶著、或覺得孤單。看他願意把自己打開，我們也跟著高興。', flat: '{name}跟大家的互動一直都在，維持得很平穩，這代表他在這裡有伴、有歸屬感。平常多打通電話陪他聊聊、有空帶他去見見老朋友，這份熱絡就能一直延續下去。', down: '{name}最近跟大家的互動少了一些，可能是想自己靜一靜，這很正常，誰都有想獨處的時候。平常多打通電話陪他說說話、吃飯時多邀他開開口，不用急，他會慢慢又熱絡起來的。' },
      '情緒力': { plain: '就是心情穩不穩、有沒有成就感，常被稱讚、有過成功的經驗，心情自然就會更好。', up: '{name}最近笑容更多、心情更穩了（進步 {delta} 分）。這常常是因為他在活動裡「有做到」、被大家肯定。回到家您也多誇他幾句、多給他一個讚，這份好心情就能一路延續到家裡，整個人都暖暖的。', flat: '{name}的心情大致都不錯，穩穩的，這就是最讓人放心的事了。平常陪他一起聽聽年輕時愛的那幾首歌、找件小事一起開心一下，日子就過得舒坦。', down: '{name}最近心情比較低落，也許是碰上了點小挫折、或心裡有事。這時候多陪陪他、多聽他說說，別急著給建議；哪怕只是完成一件小事，也好好誇誇他。心裡的結慢慢解開，笑容自然就回來了。' },
    },
    practice: '下面這些都是在家就能陪他一起做的小事，不用特別準備、也不花錢。重點不是做多少，而是每天一點點的陪伴和那份開心，比偶爾衝刺一次有效得多。',
    closing: '謝謝您一直這麼掛心{name}，您的陪伴，就是他心裡最大的力量。有任何狀況，我們隨時都在，一起陪他把每一天都好好地過。',
  },
  staff: {
    opening: {
      up: '{name}正在進步軌道上，本週到 {days} 天、活動 {uses} 次，六力平均從 {base} 拉到 {recent}（{delta}）。今天順勢帶：拿他最有起色的那一項先開場，做成功當場誇出來；趁手感熱再悄悄加一點點難度，把這波進步穩住。',
      flat: '{name}本週到 {days} 天、活動 {uses} 次，六力平均守在 {recent} 上下，沒退、但也還沒明顯往上。今天主軸是「找回節奏」：先用他熟、做得來的活動暖身，先有成功經驗，再換一項他平常少碰的，量不用多，目標是讓他願意多動那一次。',
      down: '{name}要多盯。本週只到 {days} 天、活動 {uses} 次，六力平均掉到 {recent}（{delta}）。先別拚數據：今天把難度往下調、節奏放慢，讓他先做得到、笑得出來；多坐旁邊陪、多叫名字、多肯定，把人留住比衝分數重要。出席或情緒再往下，就記一筆、回報幹部。',
    },
    powers: {
      '認知力': { weak: '指令拆成一個動作一句話，講完停一下等他反應；用他熟的歌名、家人名字或數數當提示（「我們數到三一起敲」），做對立刻覆述「對，就是三下」幫他把規則釘住。', strong: '他規則記得牢，讓他當「小老師」示範、喊口令給同桌聽，一條龍把社交力和情緒力一起帶起來。' },
      '反應力': { weak: '先放慢、把提示加大（鈴響同時揮手示意），讓他抓到「聽到就動」的點，連續接住幾次再慢慢加速，別一開始就用進階速度逼他。', strong: '反應快是他的引擎，安排你丟我接、聽到名字就舉手這類即時回饋的玩法，讓他帶頭炒氣氛，順帶練專注。' },
      '體適能力': { weak: '從坐姿、小幅度起步（坐著搖沙鈴、抬抬腳、毛巾操），椅子穩、有扶手再加大；寧可次數多、幅度小，安全第一，做完一組喝口水休息。', strong: '他手腳有力、平衡好，多給站姿或下肢活動（腳響樂、原地踏步配歌），讓他帶同桌一起動，也撐住他的活動量。' },
      '自主力': { weak: '多用「你想…」讓他自己選——選歌、選難度、選先做哪個，哪怕只是二選一；他動手的部分別搶著幫，等一下、讓他自己收尾，成就感才回得來。', strong: '他肯做主，讓他負責選曲、定今天的順序，甚至幫忙招呼旁邊的人，把這股主動拿來帶整桌參與。' },
      '社交力': { weak: '先一對一拉近——叫名字、對上眼神，再慢慢把他帶進兩三人的小組；安排他和熟的同伴坐一起，用「換你了」「跟旁邊那位一起」製造互動，別一下子丟進大團體。', strong: '他愛跟人來往，請他當小組長帶同桌、招呼比較安靜的長輩，讓他的熱絡感染全場，順手把別人的情緒力一起帶上來。' },
      '情緒力': { weak: '今天就一個目標——讓他成功一次、被誇一次。難度調到他一定做得到，每完成一步就具體稱讚（「這下敲得真準」）；放他年輕時愛的歌，先用聊天和笑容把心情打開，再帶活動。', strong: '他心情穩、笑容多，請他坐在情緒較低的長輩旁邊，用他的好情緒和掌聲帶氣氛，正向會傳染給整桌。' },
    },
    watch: '{name}已列需關注，今天多走過去看兩眼：留意出席、情緒、反應有沒有比平常差，全程多陪、多肯定；一有異狀（明顯變安靜、體力變差、不太願意動）就當場記一筆並回報幹部。',
  },
};
function fillTpl(t, v) { return (t || '').replace(/\{(\w+)\}/g, (m, k) => (v[k] != null ? v[k] : '')); }
function trendKey(d) { return d > 1.5 ? 'up' : d < -1.5 ? 'down' : 'flat'; }
function pTrend(d) { return d >= 3 ? 'up' : d <= -3 ? 'down' : 'flat'; }
function narrateFamily(s, callName) {
  const R = buildReport(s); const cn = callName || s.name;
  const base = { name: cn, base: R.base, recent: R.recent, delta: (R.delta >= 0 ? '+' + R.delta : '' + R.delta), days: s.weekDays, uses: s.weekUses };
  return {
    R, cn,
    opening: fillTpl(NARRATIVE.family.opening[trendKey(R.delta)], base),
    powers: R.rows.map((row) => ({ k: row.k, soft: row.soft, plain: NARRATIVE.family.powers[row.k].plain,
      line: fillTpl(NARRATIVE.family.powers[row.k][pTrend(row.d)], Object.assign({}, base, { delta: (row.d >= 0 ? '+' + row.d : '' + row.d) })) })),
    practice: NARRATIVE.family.practice,
    closing: fillTpl(NARRATIVE.family.closing, base),
  };
}
function narrateStaff(s) {
  const R = buildReport(s);
  const v = { name: s.name, base: R.base, recent: R.recent, delta: (R.delta >= 0 ? '+' + R.delta : '' + R.delta), days: s.weekDays, uses: s.weekUses };
  return {
    R,
    opening: fillTpl(NARRATIVE.staff.opening[trendKey(R.delta)], v),
    weak: { k: R.weakest.k, note: fillTpl(NARRATIVE.staff.powers[R.weakest.k].weak, v) },
    strong: { k: R.strongest.k, note: fillTpl(NARRATIVE.staff.powers[R.strongest.k].strong, v) },
    watch: s.status === '需關注' ? fillTpl(NARRATIVE.staff.watch, v) : null,
  };
}

// ============ 長者：進步 + 誇誇（鮮艷、大字、圖像化）============
function ElderReport({ elder, onHome }) {
  const s = window.studentById(elder.id);
  const R = buildReport(s);
  const stars = Math.max(3, Math.min(5, 3 + Math.round(R.delta / 4)));
  const stats = [
    { v: s.weekDays, u: '天', label: '這週來活動', tone: 'sky' },
    { v: s.weekUses, u: '次', label: '玩了幾次', tone: 'mint' },
    { v: (R.delta >= 0 ? '+' : '') + R.delta, u: '分', label: '比之前進步', tone: 'primary' },
  ];
  return (
    <div className="screen" style={{ maxWidth: 720, margin: '0 auto', textAlign: 'center' }}>
      <window.Mascot mood="cheer" size={150} style={{ margin: '0 auto' }} />
      <h1 style={{ fontSize: 'var(--fs-display)', fontWeight: 900, margin: '6px 0 2px', color: 'var(--primary-deep)' }}>你好棒！</h1>
      <p style={{ fontSize: 'var(--fs-h3)', fontWeight: 800, color: 'var(--ink-2)', margin: 0 }}>{elder.callName}，這是你的進步報告</p>
      <div style={{ fontSize: 36, letterSpacing: 4, margin: '12px 0 6px' }}>
        {Array.from({ length: 5 }).map((_, i) => <span key={i} style={{ color: i < stars ? 'var(--gold)' : 'var(--border)' }}>★</span>)}
      </div>

      <div style={{ display: 'flex', gap: 14, justifyContent: 'center', flexWrap: 'wrap', margin: '14px 0 22px' }}>
        {stats.map((st, i) => {
          const c = window.tone(st.tone);
          return (
            <div key={i} style={{ flex: '1 1 150px', maxWidth: 200, background: c.solid, borderRadius: 28, padding: '22px 14px', color: '#fff', boxShadow: '0 10px 24px ' + c.solid + '55' }}>
              <div className="num" style={{ fontSize: 56, fontWeight: 900, lineHeight: 1 }}>{st.v}<span style={{ fontSize: 22, fontWeight: 800 }}>{st.u}</span></div>
              <div style={{ fontSize: 'var(--fs-lead)', fontWeight: 800, marginTop: 6 }}>{st.label}</div>
            </div>
          );
        })}
      </div>

      {/* 誇誇 */}
      <div style={{ background: 'linear-gradient(180deg,#FFF6E6,var(--sunken))', border: '3px solid var(--primary)', borderRadius: 26, padding: '20px 22px', textAlign: 'left' }}>
        <div style={{ display: 'flex', alignItems: 'center', gap: 10, marginBottom: 10 }}>
          <window.Mascot mood="happy" size={48} />
          <span style={{ fontSize: 'var(--fs-h2)', fontWeight: 900 }}>樂樂想跟你說</span>
        </div>
        <p style={{ fontSize: 'var(--fs-h3)', fontWeight: 800, lineHeight: 1.7, margin: 0 }}>
          {elder.callName}，你的「{R.improved.k}」進步好多，{ELDER_PRAISE[R.improved.k]}了！<br />
          每次來都這麼認真，真的好棒，我們下次再一起玩！
        </p>
      </div>

      {/* 六力大圖示進步條 */}
      <div style={{ marginTop: 20, display: 'flex', flexDirection: 'column', gap: 12 }}>
        {R.rows.map((row) => {
          const up = row.d;
          const c = window.tone(up >= 4 ? 'mint' : up >= 0 ? 'sky' : 'sun');
          return (
            <div key={row.k} style={{ display: 'flex', alignItems: 'center', gap: 14, background: 'var(--surface)', border: '2px solid var(--border)', borderRadius: 18, padding: '14px 18px' }}>
              <span style={{ fontSize: 'var(--fs-h3)', fontWeight: 900, width: 92, textAlign: 'left', flex: '0 0 auto' }}>{row.k}</span>
              <div style={{ flex: 1, height: 24, background: 'var(--sunken)', borderRadius: 999, overflow: 'hidden' }}>
                <div style={{ width: row.r + '%', height: '100%', background: c.solid, borderRadius: 999 }} />
              </div>
              <span className="num" style={{ fontSize: 'var(--fs-h3)', fontWeight: 900, color: up >= 0 ? 'var(--gain)' : 'var(--loss)', width: 70, textAlign: 'right', flex: '0 0 auto' }}>
                {up >= 0 ? '+' + up : up}
              </span>
            </div>
          );
        })}
      </div>

      <div style={{ marginTop: 26, display: 'flex', gap: 14, justifyContent: 'center', flexWrap: 'wrap' }}>
        <window.GhostButton onClick={() => window.exportPDF(elder.callName + '_進步報告', window.buildElderReportHTML(elder.id, elder.callName))} style={{ minHeight: 64, padding: '14px 28px', fontSize: 'var(--fs-lead)' }}>下載 PDF</window.GhostButton>
        <window.BigButton size="md" onClick={onHome}>回首頁</window.BigButton>
      </div>
    </div>
  );
}

// ============ 家屬：詳細報告書（AI 把數據講成白話 + 日常練習）============
function FamilyReport({ student, callName, onClose }) {
  const s = student;
  const cn = callName || s.name;
  const nf = narrateFamily(s, cn);
  const R = nf.R;
  const cls = window.classById(s.classId);
  const focus = [R.weakest, R.improved].filter((v, i, a) => a.findIndex((x) => x.k === v.k) === i); // 加強 + 保持（去重）

  return (
    <div style={{ position: 'fixed', inset: 0, zIndex: 80, background: 'rgba(58,46,34,.4)', overflowY: 'auto' }} onClick={onClose}>
      <div onClick={(e) => e.stopPropagation()} style={{ maxWidth: 760, margin: '24px auto', background: 'var(--surface)', borderRadius: 24, boxShadow: 'var(--shadow-lg)', overflow: 'hidden' }}>
        {/* header */}
        <div style={{ background: 'linear-gradient(135deg,var(--primary),var(--primary-deep))', color: '#fff', padding: '22px 26px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12 }}>
          <div>
            <div style={{ fontSize: 'var(--fs-small)', fontWeight: 800, opacity: .9 }}>樂睦 · 訓練成效報告書</div>
            <div style={{ fontSize: 'var(--fs-h2)', fontWeight: 900 }}>{cn}</div>
            <div style={{ fontSize: 'var(--fs-body)', fontWeight: 700, opacity: .92, marginTop: 2 }}>{cls.name} · 期間 2026.03–05</div>
          </div>
          <button onClick={onClose} aria-label="關閉" style={{ width: 42, height: 42, borderRadius: 12, border: 'none', background: 'rgba(255,255,255,.22)', color: '#fff', fontSize: 22, fontWeight: 800, cursor: 'pointer', flex: '0 0 auto' }}>×</button>
        </div>

        <div style={{ padding: '24px 26px' }}>
          {/* AI 白話總結 */}
          <div style={{ display: 'flex', alignItems: 'center', gap: 8, marginBottom: 10 }}>
            <window.Tag tone="grape">AI 整理</window.Tag>
            <span style={{ fontSize: 'var(--fs-small)', color: 'var(--ink-3)', fontWeight: 700 }}>用白話幫您讀懂{cn}的近況</span>
          </div>
          <p style={{ fontSize: 'var(--fs-lead)', fontWeight: 700, lineHeight: 1.85, margin: 0 }}>{nf.opening}</p>

          {/* 六項能力，白話說 */}
          <h3 style={{ fontSize: 'var(--fs-h3)', fontWeight: 900, margin: '24px 0 14px' }}>六項能力，這樣看</h3>
          <div style={{ display: 'flex', flexDirection: 'column', gap: 18 }}>
            {nf.powers.map((p) => (
              <div key={p.k}>
                <div style={{ fontSize: 'var(--fs-lead)', fontWeight: 900, marginBottom: 4 }}>{p.k}{p.soft && <span style={{ fontSize: 'var(--fs-small)', color: 'var(--ink-3)', fontWeight: 700 }}> ◦ 參與推估</span>}</div>
                <p style={{ fontSize: 'var(--fs-small)', color: 'var(--ink-3)', margin: '0 0 5px', lineHeight: 1.5 }}>{p.plain}</p>
                <p style={{ fontSize: 'var(--fs-body)', color: 'var(--ink)', fontWeight: 600, margin: 0, lineHeight: 1.75 }}>{p.line}</p>
              </div>
            ))}
          </div>

          {/* 日常練習建議 */}
          <h3 style={{ fontSize: 'var(--fs-h3)', fontWeight: 900, margin: '24px 0 6px' }}>在家可以這樣陪他練習</h3>
          <p style={{ fontSize: 'var(--fs-body)', color: 'var(--ink-2)', margin: '0 0 14px', lineHeight: 1.7 }}>{nf.practice}</p>
          <div style={{ display: 'flex', flexDirection: 'column', gap: 14 }}>
            {focus.map((f, i) => {
              const tag = i === 0 ? '建議加強' : '持續保持';
              const tone = i === 0 ? 'coral' : 'mint';
              const c = window.tone(tone);
              return (
                <div key={f.k} style={{ border: '2px solid ' + c.solid + '55', borderRadius: 18, padding: '16px 18px' }}>
                  <div style={{ display: 'flex', alignItems: 'center', gap: 10, marginBottom: 10 }}>
                    <span style={{ background: c.soft, color: c.ink, borderRadius: 999, padding: '4px 12px', fontSize: 'var(--fs-small)', fontWeight: 800 }}>{tag}</span>
                    <span style={{ fontSize: 'var(--fs-h3)', fontWeight: 900 }}>{f.k}</span>
                  </div>
                  <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
                    {DAILY_PRACTICE[f.k].map((t, j) => (
                      <div key={j} style={{ display: 'flex', gap: 10, alignItems: 'flex-start' }}>
                        <span style={{ flex: '0 0 auto', marginTop: 2 }}><window.IcCheck size={20} color={c.solid} /></span>
                        <span style={{ fontSize: 'var(--fs-lead)', fontWeight: 700, lineHeight: 1.5 }}>{t}</span>
                      </div>
                    ))}
                  </div>
                </div>
              );
            })}
          </div>

          <div style={{ marginTop: 22, background: 'linear-gradient(180deg,#fff,var(--sunken))', border: '2px solid var(--primary)', borderRadius: 18, padding: '16px 18px', display: 'flex', gap: 12, alignItems: 'flex-start' }}>
            <window.Mascot mood="happy" size={46} />
            <p style={{ fontSize: 'var(--fs-lead)', fontWeight: 700, lineHeight: 1.75, margin: 0 }}>{nf.closing}</p>
          </div>

          <p style={{ fontSize: 'var(--fs-small)', color: 'var(--ink-3)', margin: '20px 0 0', lineHeight: 1.6 }}>
            ※ 本報告為健康促進與活動參與紀錄，非醫療診斷；自主力／社交力／情緒力為參與行為推估值。如長輩狀況有明顯變化，請諮詢專業醫療人員。
          </p>

          <div style={{ display: 'flex', gap: 12, marginTop: 22, flexWrap: 'wrap' }}>
            <window.BigButton size="md" onClick={() => window.exportPDF(cn + '_訓練成效報告書', window.buildFamilyReportHTML(s, cn))}>下載 PDF</window.BigButton>
            <window.GhostButton onClick={onClose} style={{ minHeight: 56 }}>關閉</window.GhostButton>
          </div>
        </div>
      </div>
    </div>
  );
}

// ============ 照服員：個人即時數據 ============
function StaffMemberReport({ student, onClose }) {
  const s = student;
  const ns = narrateStaff(s);
  const R = ns.R;
  const cls = window.classById(s.classId);
  const tools = window.studentToolLog(s);
  const notes = window.studentNotes(s);
  const rows = window.SIX_ORDER.map((k) => ({ name: k, b: s.sp[k][0], r: s.sp[k][1], soft: window.PSYCHOSOCIAL.includes(k) }));
  return (
    <div style={{ position: 'fixed', inset: 0, zIndex: 80, background: 'rgba(58,46,34,.4)', overflowY: 'auto' }} onClick={onClose}>
      <div onClick={(e) => e.stopPropagation()} style={{ maxWidth: 640, margin: '24px auto', background: 'var(--surface)', borderRadius: 24, boxShadow: 'var(--shadow-lg)', overflow: 'hidden' }}>
        <div style={{ padding: '20px 24px', borderBottom: '1.5px solid var(--border)', display: 'flex', alignItems: 'center', gap: 14 }}>
          <window.Avatar tone={s.status === '需關注' ? 'sun' : 'mint'} name={s.name} size={52} />
          <div style={{ flex: 1 }}>
            <div style={{ fontSize: 'var(--fs-h2)', fontWeight: 900 }}>{s.name}</div>
            <div style={{ fontSize: 'var(--fs-body)', color: 'var(--ink-2)', fontWeight: 700 }}>{cls.name} · 即時數據</div>
          </div>
          <button onClick={onClose} aria-label="關閉" style={{ width: 40, height: 40, borderRadius: 12, border: '2px solid var(--border)', background: 'var(--surface)', fontSize: 20, fontWeight: 800, cursor: 'pointer', color: 'var(--ink-2)' }}>×</button>
        </div>
        <div style={{ padding: '20px 24px' }}>
          <div style={{ display: 'flex', gap: 12, marginBottom: 16 }}>
            <MiniRT label="本週次數" value={s.weekUses} tone="primary" />
            <MiniRT label="本週天數" value={s.weekDays} tone="sky" />
            <MiniRT label="六力平均" value={R.recent} tone="mint" delta={R.delta} />
          </div>

          {/* AI 交班重點（白話、可操作） */}
          <div style={{ background: 'var(--sunken)', borderRadius: 16, padding: '16px 18px', marginBottom: 18 }}>
            <window.Tag tone="grape">AI 交班重點</window.Tag>
            <p style={{ fontSize: 'var(--fs-body)', fontWeight: 700, lineHeight: 1.75, margin: '10px 0 0' }}>{ns.opening}</p>
            <div style={{ marginTop: 12, display: 'flex', flexDirection: 'column', gap: 10 }}>
              <NoteLine tone="coral" tag={'加強 · ' + ns.weak.k} text={ns.weak.note} />
              <NoteLine tone="mint" tag={'善用 · ' + ns.strong.k} text={ns.strong.note} />
              {ns.watch && <NoteLine tone="sun" tag="需關注" text={ns.watch} />}
            </div>
          </div>

          <h4 style={{ fontSize: 'var(--fs-h3)', fontWeight: 900, margin: '0 0 10px' }}>樂齡六力（初評 → 近期）</h4>
          <window.SlopeChart rows={rows} />
          <h4 style={{ fontSize: 'var(--fs-h3)', fontWeight: 900, margin: '20px 0 10px' }}>最近使用教具</h4>
          <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
            {tools.map((t, i) => (
              <div key={i} style={{ display: 'flex', justifyContent: 'space-between', background: 'var(--sunken)', borderRadius: 12, padding: '10px 14px' }}>
                <span style={{ fontSize: 'var(--fs-body)', fontWeight: 700 }}>{t.name}</span>
                <span className="num" style={{ fontSize: 'var(--fs-body)', color: 'var(--ink-2)', fontWeight: 700 }}>{t.uses} 次 · {t.metric} {t.value}</span>
              </div>
            ))}
          </div>
          <h4 style={{ fontSize: 'var(--fs-h3)', fontWeight: 900, margin: '20px 0 10px' }}>觀察紀錄</h4>
          {notes.map((n, i) => (
            <div key={i} style={{ background: 'var(--sunken)', borderRadius: 12, padding: '10px 14px', marginBottom: 8 }}>
              <div style={{ fontSize: 'var(--fs-body)', lineHeight: 1.5 }}>{n.text}</div>
              <div style={{ fontSize: 'var(--fs-small)', color: 'var(--ink-3)', marginTop: 4 }}>{n.by} · {n.date}</div>
            </div>
          ))}
          <div style={{ display: 'flex', gap: 12, marginTop: 18 }}>
            <window.BigButton size="md" onClick={() => window.exportPDF(s.name + '_個人即時數據', window.buildStaffReportHTML(s))}>下載 PDF</window.BigButton>
            <window.GhostButton onClick={onClose} style={{ minHeight: 56, flex: 1 }}>關閉</window.GhostButton>
          </div>
        </div>
      </div>
    </div>
  );
}
function MiniRT({ label, value, tone, delta }) {
  const c = window.tone(tone);
  return (
    <div style={{ flex: 1, background: 'var(--sunken)', borderRadius: 14, padding: '12px 10px', textAlign: 'center' }}>
      <div className="num" style={{ fontSize: 'var(--fs-h1)', fontWeight: 900, color: c.solid, lineHeight: 1 }}>{value}</div>
      <div style={{ fontSize: 'var(--fs-small)', color: 'var(--ink-2)', fontWeight: 700, marginTop: 4 }}>{label}</div>
      {delta != null && <div className="num" style={{ fontSize: 'var(--fs-small)', fontWeight: 800, color: delta >= 0 ? 'var(--gain)' : 'var(--loss)' }}>{delta >= 0 ? '+' + delta : delta}</div>}
    </div>
  );
}

function NoteLine({ tone, tag, text }) {
  const c = window.tone(tone);
  return (
    <div style={{ display: 'flex', gap: 10, alignItems: 'flex-start' }}>
      <span style={{ flex: '0 0 auto', background: c.soft, color: c.ink, borderRadius: 999, padding: '3px 11px', fontSize: 'var(--fs-small)', fontWeight: 800, whiteSpace: 'nowrap' }}>{tag}</span>
      <span style={{ fontSize: 'var(--fs-body)', lineHeight: 1.6, fontWeight: 600 }}>{text}</span>
    </div>
  );
}

Object.assign(window, { buildReport, ElderReport, FamilyReport, StaffMemberReport, DAILY_PRACTICE, POWER_PLAIN, NARRATIVE, narrateFamily, narrateStaff });
