feat(mp): 小程序统一组件库 Phase 1 — Token 扩展 + 10 组件 + useListPage Hook

三层架构组件库：
- 第 1 层原子组件：PageShell/ContentCard/StatusTag/SectionTitle/LoadingCard
- 第 2 层组合模式：PageHeader/SearchSection/CardList/PaginationBar
- 第 3 层 Hook：useListPage（列表页通用逻辑抽象）

Token 扩展：新增 --tk-card-*/--tk-gap-*/--tk-page-* 等结构化 CSS 变量，
关怀模式通过变量覆写自动生效，新组件零额外代码即获关怀支持。

设计规格：docs/superpowers/specs/2026-05-16-miniprogram-unified-components-design.md

apps/miniprogram/src/components/ui/PageShell/index.tsx

@@ -0,0 +1,54 @@
+import { View, ScrollView } from '@tarojs/components';
+import { ReactNode, useMemo } from 'react';
+import './index.scss';
+
+interface PageShellProps {
+  padding?: 'none' | 'sm' | 'md' | 'lg';
+  safeBottom?: boolean;
+  scroll?: boolean;
+  className?: string;
+  children: ReactNode;
+}
+
+const PADDING_MAP = {
+  none: '0',
+  sm: '16px',
+  md: 'var(--tk-page-padding)',
+  lg: '32px',
+} as const;
+
+const PageShell: React.FC<PageShellProps> = ({
+  padding = 'md',
+  safeBottom = true,
+  scroll = true,
+  className,
+  children,
+}) => {
+  const style = useMemo(() => ({
+    paddingLeft: PADDING_MAP[padding],
+    paddingRight: PADDING_MAP[padding],
+    paddingTop: PADDING_MAP[padding],
+  }), [padding]);
+
+  const cls = [
+    'page-shell',
+    safeBottom && 'page-shell--safe-bottom',
+    className,
+  ].filter(Boolean).join(' ');
+
+  if (scroll) {
+    return (
+      <ScrollView scrollY className={cls} style={style}>
+        {children}
+      </ScrollView>
+    );
+  }
+
+  return (
+    <View className={cls} style={style}>
+      {children}
+    </View>
+  );
+};
+
+export default React.memo(PageShell);