用途：构建从手机到超宽屏连续缩放、不出现断点断崖的布局，并实现流式排版。
主要能力：移动优先编写，基础CSS面向最小视口，用min-width媒体查询渐进增强；用clamp(MIN, BASELINE_REM + SLOPE_VW, MAX)实现流式字号，MIN用rem，MAX至少为MIN的两倍以满足WCAG 1.4.4的200%缩放；区分容器查询与媒体查询，组件自身槽宽用容器查询，视口或用户偏好用媒体查询，主题自定义属性用样式容器查询；使用svh/lvh/dvh等现代视口单位；用aspect-ratio做比例尺寸；用逻辑属性保证RTL安全；用min-content、max-content、fit-content()等内在尺寸关键字。
必要用法：容器查询需在父级槽设置container-type: inline-size，在被查询元素自身设置不会匹配；aspect-ratio生效需width或height至少一个为自动推导；flex子项承载文本时设min-width: 0。示例：.shell { display: block; } @media (min-width: 768px) { .shell { display: grid; grid-template-columns: 16rem 1fr; } }
适用场景：流式页面外壳、流式字号阶梯、容器查询卡片、比例媒体卡片、iOS Safari安全首屏、RTL间距、flex文本内在尺寸。
限制：资料列出八类反模式，包括像素断点断崖、移动端100vh、clamp()首选值超出min/max、父级缺少container-type、max-width: 100vw溢出、flex-wrap缺少min-width: 0、RTL中使用物理margin、clamp MAX小于2倍MIN。具体浏览器支持与项目集成方式暂未提供。