feat(miniprogram): 关怀模式 Phase 2 — Design Token + 15 页面批量接入

- 新建 useElderClass hook，替代每页 3 行样板代码
- 新建 CSS 自定义属性 Design Token 系统（tokens.scss）
  正常/关怀两套值：字号、间距、触控、布局参数
- 15 个页面批量接入关怀模式 class：
  TabBar: 商城页
  主流程: 预约列表/详情/创建、咨询详情
  子包: 体征录入/趋势/日常监测/告警、用药/档案/随访/报告/家庭/设置
- 新建 elder-toast 工具（关怀模式 3s + 触觉反馈）
- 页面覆盖率：4/59 → 22/59 (37%)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

apps/miniprogram/src/pages/pkg-profile/family/index.tsx

@@ -4,9 +4,11 @@ import Taro, { useDidShow } from '@tarojs/taro';
 import { listPatients, Patient } from '../../../services/patient';
 import { useAuthStore } from '../../../stores/auth';
 import EmptyState from '../../../components/EmptyState';
+import { useElderClass } from '../../../hooks/useElderClass';
 import './index.scss';
 
 export default function FamilyList() {
+  const modeClass = useElderClass();
   const [patients, setPatients] = useState<Patient[]>([]);
   const [loading, setLoading] = useState(false);
   const { currentPatient, setCurrentPatient } = useAuthStore();
@@ -58,7 +60,7 @@ export default function FamilyList() {
   };
 
   return (
-    <View className='family-page'>
+    <View className={`family-page ${modeClass}`}>
       <Text className='family-page-title'>就诊人管理</Text>
 
       <View className='family-list'>

apps/miniprogram/src/pages/pkg-profile/followups/index.tsx

@@ -4,6 +4,7 @@ import Taro, { useDidShow } from '@tarojs/taro';
 import { listTasks, FollowUpTask } from '../../../services/followup';
 import EmptyState from '../../../components/EmptyState';
 import Loading from '../../../components/Loading';
+import { useElderClass } from '../../../hooks/useElderClass';
 import './index.scss';
 
 const TABS = [
@@ -13,6 +14,7 @@ const TABS = [
 ];
 
 export default function MyFollowUps() {
+  const modeClass = useElderClass();
   const [activeTab, setActiveTab] = useState('pending');
   const [tasks, setTasks] = useState<FollowUpTask[]>([]);
   const [loading, setLoading] = useState(false);
@@ -55,7 +57,7 @@ export default function MyFollowUps() {
   };
 
   return (
-    <View className='my-followups-page'>
+    <View className={`my-followups-page ${modeClass}`}>
       <View className='tab-bar'>
         {TABS.map((tab) => (
           <View

apps/miniprogram/src/pages/pkg-profile/health-records/index.tsx

@@ -4,6 +4,7 @@ import Taro, { useDidShow, usePullDownRefresh, useReachBottom } from '@tarojs/ta
 import { listHealthRecords, HealthRecord } from '../../../services/health-record';
 import EmptyState from '../../../components/EmptyState';
 import Loading from '../../../components/Loading';
+import { useElderClass } from '../../../hooks/useElderClass';
 import './index.scss';
 
 const TYPE_MAP: Record<string, string> = {
@@ -13,6 +14,7 @@ const TYPE_MAP: Record<string, string> = {
 };
 
 export default function HealthRecords() {
+  const modeClass = useElderClass();
   const [records, setRecords] = useState<HealthRecord[]>([]);
   const [page, setPage] = useState(1);
   const [total, setTotal] = useState(0);
@@ -55,7 +57,7 @@ export default function HealthRecords() {
   });
 
   return (
-    <View className='health-records-page'>
+    <View className={`health-records-page ${modeClass}`}>
       <Text className='page-title'>健康记录</Text>
 
       <View className='record-list'>

apps/miniprogram/src/pages/pkg-profile/medication/index.tsx

@@ -9,9 +9,11 @@ import {
   deleteReminder,
   type MedicationReminder,
 } from '../../../services/medication-reminder';
+import { useElderClass } from '../../../hooks/useElderClass';
 import './index.scss';
 
 export default function MedicationReminder() {
+  const modeClass = useElderClass();
   const [reminders, setReminders] = useState<MedicationReminder[]>([]);
   const [loading, setLoading] = useState(true);
   const [showForm, setShowForm] = useState(false);
@@ -96,7 +98,7 @@ export default function MedicationReminder() {
 
   if (loading) {
     return (
-      <View className='medication-page'>
+      <View className={`medication-page ${modeClass}`}>
         <Text className='page-title'>用药提醒</Text>
         <View style={{ padding: '40px 0', textAlign: 'center' }}>
           <Text style={{ color: '#94A3B8', fontSize: '28px' }}>加载中...</Text>
@@ -106,7 +108,7 @@ export default function MedicationReminder() {
   }
 
   return (
-    <View className='medication-page'>
+    <View className={`medication-page ${modeClass}`}>
       <Text className='page-title'>用药提醒</Text>
 
       <View className='reminder-list'>

apps/miniprogram/src/pages/pkg-profile/reports/index.tsx

@@ -4,9 +4,11 @@ import Taro, { useDidShow, usePullDownRefresh, useReachBottom } from '@tarojs/ta
 import { listReports, LabReport } from '../../../services/report';
 import EmptyState from '../../../components/EmptyState';
 import Loading from '../../../components/Loading';
+import { useElderClass } from '../../../hooks/useElderClass';
 import './index.scss';
 
 export default function MyReports() {
+  const modeClass = useElderClass();
   const [reports, setReports] = useState<LabReport[]>([]);
   const [page, setPage] = useState(1);
   const [total, setTotal] = useState(0);
@@ -65,7 +67,7 @@ export default function MyReports() {
   };
 
   return (
-    <View className='my-reports-page'>
+    <View className={`my-reports-page ${modeClass}`}>
       <Text className='page-title'>检查报告</Text>
 
       <View className='report-list'>

apps/miniprogram/src/pages/pkg-profile/settings/index.tsx

@@ -2,9 +2,11 @@ import React from 'react';
 import { View, Text } from '@tarojs/components';
 import Taro from '@tarojs/taro';
 import { useAuthStore } from '../../../stores/auth';
+import { useElderClass } from '../../../hooks/useElderClass';
 import './index.scss';
 
 export default function Settings() {
+  const modeClass = useElderClass();
   const { logout } = useAuthStore();
 
   const handleClearCache = () => {
@@ -55,7 +57,7 @@ export default function Settings() {
   };
 
   return (
-    <View className='settings-page'>
+    <View className={`settings-page ${modeClass}`}>
       <Text className='page-title'>设置</Text>
 
       <View className='settings-group'>