SGDS Layouts 是 SGDS Web 组件的页面布局模式目录，定义内容区域在 Application Shell 内的空间排布方式，属于生产可用的布局起点：放入内容块即可得到完整页面。
用途：确定页面内容列数（单列、分栏、侧栏+主区）、导航位置（仅顶部或侧边栏）、滚动方式（文档流或视口内滚动）。布局位于 Application Shell（必需页面框架）与 Blocks/Templates（实际内容）之间。
主要能力：分为两大类。Full Width 面向公开页面，使用 .sgds-container 居中响应式内容，标准 sgds-masthead、sgds-mainnav、sgds-footer，内容随文档流，含 Default、Aside Left（4/8）、Aside Right（8/4）、Aside Both（3/6/3）、Split、Breadcrumb 六种变体。With Sidebar 面向仪表盘与内部工具，使用 .sgds-container-sidebar，masthead 与 mainnav 加 fluid 属性，使用 sgds-sidebar 组件，footer 用 tone="neutral" layout="sidebar"，根容器加 sgds:h-screen sgds:flex sgds:flex-col sgds:overflow-hidden，主内容区 sgds:overflow-y-auto 独立滚动，含 Default、Aside Left、Aside Right、Overlay、Split 五种变体。
使用方式：需先完成 sgds-getting-started 初始化、了解 sgds-utilities 与 sgds-components。可从 stories/layouts/ 目录获取实现，命令为 curl https://raw.githubusercontent.com/GovTechSG/sgds-web-component/master/stories/layouts/{Category}/{File}.stories.js，再从 Template 的 html 模板字面量中提取 HTML，去掉 html 包装、Lit 插值语法与 style 块，保留 SGDS 组件与工具类。
限制：不要混用 Full Width 与 With Sidebar 模式；侧边栏布局必须在根容器加视口约束类；每个布局都包含必需的 Application Shell。具体安装与组件 API 需参考对应技能文档。