用途：为真实项目提供可扩展、结构清晰的 CSS 编写方式，对结构、令牌与工具链做有意识决策，不使用 TailwindCSS、UnoCSS、Bootstrap 等任何框架，只写原生 CSS；需要工具层时自行构建而非引入。
主要能力与原则：令牌优先，值只定义一次为自定义属性并被各处引用；一切分层，用 @layer 让优先级可预测、便于覆盖；命名表达意图；工具服务于你，用打包器拆分文件与处理导入，但工具不能替代清晰的 CSS 架构；组合优于继承，组件由令牌与工具类构建；相对单位，除 border-width 与 outline-width 外全部用相对值。
架构：层顺序须显式声明，如 @layer config, resets, components, utilities, overrides; 分别放设计令牌（无选择器）、浏览器归一化与元素默认、作用域组件、单一用途助手、上下文覆盖与第三方覆盖。文件结构镜像层顺序，styles/ 下分 config（color.css、spacing.css、typography.css、index.css）、resets.css、components/（button.css、card.css）、utilities.css、main.css。
设计令牌：用自定义属性作为唯一事实来源。颜色用 OKLCH 定义，色域更宽且亮度感知均匀，便于生成 hover 与暗色变体。命名用 --[category]-[variant]-[modifier]，颜色变体仅限 text、bg、border。主题用 light-dark() 定义一次，用户可切换时只翻转 color-scheme。尺寸用 rem，字号令牌必须为 rem 且组件内不得用 px 覆盖；流体排版用 clamp() 配合 cqi，需父级 container-type: inline-size。布局优先固有尺寸而非媒体查询，网格用 repeat(auto-fit, minmax(20ch, 1fr))，弹式列表用 flex: 1 1 20ch；px 仅用于 border-width 与 outline-width。
命名与组件：组件类用 BEM，前缀 c- 组件、u- 工具、js- 钩子（不设样式），状态用 is-/has- 或优先 ARIA 属性选择器。组件文件按块、状态、修饰符组织，仅引用令牌；键盘焦点用 :focus-visible。
适用场景：需要长期维护、主题化与多人协作的原生 CSS 项目。限制：明确禁用各类 CSS 框架；资料未提供价格、平台支持、安装命令或版本信息。