@layer loamui.components{@scope(.site-SettingsDemo) to ([class*=loam-]){:scope{gap:var(--loam-space-s);display:grid;container-type:inline-size}header{align-items:center;gap:var(--loam-space-xs);display:flex}small{display:block}small,.note{color:var(--loam-color-fg-muted);font-size:var(--loam-text-sm)}.row{border-block-start:1px solid var(--loam-color-line);align-items:center;gap:var(--loam-space-xs);flex-wrap:wrap;justify-content:space-between;padding-block-start:var(--loam-space-s);display:flex}.row>span{color:var(--loam-color-fg-muted);font-size:var(--loam-text-sm)}footer{gap:var(--loam-space-xs);grid-template-columns:repeat(auto-fit,minmax(min(9rem,100%),1fr));display:grid}p{margin:0}p[role=status]{font-size:var(--loam-text-sm);min-block-size:1.5em}}@scope(.site-ContextDemo) to ([class*=loam-],[class*=site-]){:scope{gap:var(--loam-space-s);display:grid;container-type:inline-size}.controls{gap:var(--loam-space-s);grid-template-columns:repeat(auto-fit,minmax(min(11rem,100%),1fr));display:grid}p{font-size:var(--loam-text-sm);margin:0}.note{color:var(--loam-color-fg-muted)}}@scope(.site-ContextRegion) to ([class*=loam-],[class*=site-]){:scope{--_preview-size:32rem;inline-size:min(100%, var(--_preview-size));container-type:inline-size}}@scope(.site-ContextSample) to ([class*=loam-]){:scope{font-size:var(--loam-text-md);gap:var(--loam-space-s);overflow-wrap:anywhere;display:grid}h4{margin-block:var(--loam-space-xs) 0}p{margin:0}}}