主题
组件用到的 CSS 变量和工具类
组件的颜色、圆角、阴影全部来自 CSS 变量，改变量就能换肤，不用改组件。
通过 shadcn 安装时这些变量由 theme 项写进你的全局 CSS；在本仓库里它们在 @linasan/ui/globals.css。
颜色
| 变量 | 用途 | 浅色 |
|---|---|---|
--page | 页面底色（灰） | #f5f5f5 |
--background | 卡片、弹窗、输入框底色（白） | #ffffff |
--subtle | 比卡片略深的区块 | #fafafa |
--muted | 次要按钮、悬停底色 | #ebebec |
--foreground / --fg-2 / --fg-3 | 正文的三级文字 | #18181b / #3f3f46 / #52525b |
--muted-foreground | 说明文字 | #71717a |
--border / --border-strong | 边框 | rgba(0,0,0,.1) / rgba(0,0,0,.18) |
--primary / --primary-hover | 主题色 | #006fee / #005bc4 |
--destructive / --success / --warning / --info | 状态色 | #dc2626 / #16a34a / #d97706 / #2563eb |
--tip / --tip-foreground | 提示气泡（反色） | #18181b / #fafafa |
shadcn 的标准变量（--card、--popover、--secondary、--accent、--input、--ring）都指向上面这些，所以 shadcn 官方组件放进来也是同一套外观。
深色在 .dark 下重新定义同名变量：页面最深，卡片、--subtle、--muted 逐级变亮，卡片不用投影。
圆角
--radius 默认 8px，其余按比例：
| Tailwind 类 | 值 | 用在 |
|---|---|---|
rounded-sm | --radius × 0.75（6） | 输入框 |
rounded-md | --radius（8） | 菜单项、徽标 |
rounded-lg / rounded-xl | --radius × 1.5（12） | 卡片、弹窗 |
| 按钮 | --radius × 1.25（10） | 按钮 |
阴影
| 变量 | 用途 |
|---|---|
--shadow-card | 灰底上的白卡（代替边框） |
--shadow-xs / --shadow-md / --shadow-lg | 小控件 / 浮层 / 弹窗 |
--shadow-menu | 下拉菜单、弹出层 |
白卡规则：rounded-lg border bg-background 的元素在灰底上不画边框、用 --shadow-card；放在卡片、弹窗、浮层或 [data-surface] 里面时恢复细边框。
工具类
| 类 | 作用 |
|---|---|
tabular | 等宽数字 |
scrollbar-thin | 细滚动条，悬停时浮现 |
scrollbar-none | 隐藏滚动条 |
bg-stripes | 斜纹占位 |
bg-grid | 网格背景 |
animate-reveal / animate-rise / animate-flash | 入场、上浮、闪一下 |
在本仓库里换肤
后台的「外观设置」通过 html[data-accent]（主题色）和 html[data-base]（基础灰）切换，这两组只在 @linasan/ui/globals.css 里，不进 registry。