.spec-layout{display:grid;grid-template-columns:180px minmax(0,1fr);gap:var(--s3-space-7)}.section-nav{position:sticky;top:var(--s3-space-5);align-self:start;display:flex;flex-direction:column}.section-nav a{padding:var(--s3-space-2) 0;font-size:var(--s3-text-sm);color:var(--s3-text);text-decoration:none}.section-nav a:hover{text-decoration:underline}.spec-section{scroll-margin-top:var(--s3-space-5);padding-bottom:var(--s3-space-7);margin-bottom:var(--s3-space-7);border-bottom:1px solid var(--s3-border-subtle)}.spec-section>h2{margin-bottom:var(--s3-space-4)}.spec-section>p{margin-bottom:var(--s3-space-5);max-width:var(--s3-measure)}.eyebrow{font-family:var(--s3-font-mono);font-size:var(--s3-text-xs)!important;color:var(--s3-text-muted)}.swatches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3-space-3);margin-bottom:var(--s3-space-5)}.swatch{border:1px solid var(--s3-border-subtle);border-radius:var(--s3-radius-sm);overflow:hidden;font:var(--s3-text-xs)/var(--s3-leading-xs) var(--s3-font-mono);overflow-wrap:anywhere}.swatch-color{height:var(--s3-space-8);border-bottom:1px solid var(--s3-border-subtle)}.swatch-label{padding:var(--s3-space-2)}table{width:100%;border-collapse:collapse;font-size:var(--s3-text-sm)}th,td{text-align:left;padding:var(--s3-space-3) var(--s3-space-2);border-bottom:1px solid var(--s3-border-subtle);vertical-align:top}.table-wrap{overflow-x:auto}code{font-family:var(--s3-font-mono);font-size:var(--s3-text-sm)}.type-sample{margin-bottom:var(--s3-space-5)}.type-sample small{display:block;font:var(--s3-text-xs) var(--s3-font-mono);color:var(--s3-text-muted);margin-bottom:var(--s3-space-2)}.space-row{display:flex;gap:var(--s3-space-4);align-items:center;margin:var(--s3-space-3) 0;font:var(--s3-text-sm) var(--s3-font-mono)}.space-bar{height:var(--s3-space-4);background:var(--s3-text-accent)}.surface-demo{padding:var(--s3-space-5);border:1px solid var(--s3-border-subtle);background:var(--s3-bg-surface)}.layout-box{height:96px;border:1px solid var(--s3-border-subtle);display:grid;place-items:center;background:var(--s3-bg-subtle)}.show-grid .layout-box{outline:1px solid var(--s3-border-accent);background:var(--s3-bg-surface)}.control-row{margin-top:var(--s3-space-5)}.control-row>p{font:var(--s3-text-xs) var(--s3-font-mono);margin-bottom:var(--s3-space-2);color:var(--s3-text-muted)}.spec-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.nav-frame{border:1px solid var(--s3-border-control);border-radius:var(--s3-radius-md);min-height:420px;background:var(--s3-bg-subtle)}.nav-frame>p{padding:var(--s3-space-5);color:var(--s3-text-muted)}.example-copy{padding:var(--s3-space-4);margin-top:var(--s3-space-4);background:var(--s3-bg-subtle);border-radius:var(--s3-radius-sm)}@media(max-width:1023px){.spec-layout{display:block}.section-nav{position:static;flex-direction:row;flex-wrap:wrap;gap:var(--s3-space-4);margin-bottom:var(--s3-space-6)}}@media(max-width:639px){.swatches{grid-template-columns:repeat(2,minmax(0,1fr))}.spec-cards{grid-template-columns:1fr}}