.sg-page{min-height:100vh;padding-bottom:var(--space-16)}.sg-topbar{z-index:40;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-6);background:var(--glass-bg);border-bottom:var(--glass-border);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);display:flex;position:sticky;top:0}.sg-topbar-title{font:600 var(--text-sm) / 1.3 var(--font-sans);color:var(--text-primary)}.sg-topbar-controls{align-items:center;gap:var(--space-3);display:flex}.sg-topbar-resolved{font:var(--text-xs) / 1 var(--font-mono);color:var(--text-tertiary)}.sg-wrap{max-width:1120px;padding:var(--space-8) var(--space-6);gap:var(--space-12);flex-direction:column;margin:0 auto;display:flex}.sg-head{gap:var(--space-2);flex-direction:column;display:flex}.sg-h1{font:600 var(--text-xl) / 1.25 var(--font-sans);letter-spacing:var(--tracking-tighter);color:var(--text-primary)}.sg-h2{font:600 var(--text-lg) / 1.3 var(--font-sans);letter-spacing:var(--tracking-tight);color:var(--text-primary)}.sg-toc{gap:var(--space-2) var(--space-4);padding:var(--space-4);background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-md);flex-wrap:wrap;display:flex}.sg-toc a{font:500 var(--text-sm) / 1 var(--font-sans);color:var(--text-secondary);text-decoration:none}.sg-toc a:hover{color:var(--text-primary)}.sg-section{gap:var(--space-4);scroll-margin-top:var(--space-16);flex-direction:column;display:flex}.sg-section>header{gap:var(--space-1);flex-direction:column;display:flex}.sg-label{font:500 var(--fs-label) / var(--lh-label) var(--font-sans);text-transform:uppercase;letter-spacing:.04em}.sg-caption{font:400 var(--fs-caption) / var(--lh-caption) var(--font-sans)}.sg-body{font:400 var(--fs-body) / var(--lh-body) var(--font-sans)}.sg-metric{font:600 var(--fs-metric) / var(--lh-metric) var(--font-sans)}.sg-token{flex-shrink:0;min-width:160px}.sg-stack{gap:var(--space-3);flex-direction:column;display:flex}.sg-row{align-items:center;gap:var(--space-4);display:flex}.sg-panel{padding:var(--space-4)}.sg-swatch{height:96px;padding:var(--space-3);align-items:flex-end;display:flex}.sg-grid-2{gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.sg-grid-3{gap:var(--space-4);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.sg-grid-4{gap:var(--space-4);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.sg-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(320px,1fr));display:grid}.sg-color-grid{gap:var(--space-4);flex-wrap:wrap;display:flex}.sg-color{gap:var(--space-2);flex-direction:column;width:96px;display:flex}.sg-color-swatch{border-radius:var(--radius-sm);width:48px;height:48px}.sg-color-swatch--text{font:600 var(--text-sm) / 1 var(--font-sans);justify-content:center;align-items:center;display:flex}.sg-color-name{font:var(--text-xs) / 1.4 var(--font-mono);color:var(--text-secondary);word-break:break-all}.sg-type-row{gap:var(--space-4);padding:var(--space-2) 0;border-bottom:1px solid var(--border-subtle);grid-template-columns:140px 220px minmax(0,1fr);align-items:baseline;display:grid}.sg-type-xs{font:500 var(--text-xs) / 1.4 var(--font-sans)}.sg-type-sm{font:500 var(--text-sm) / 1.4 var(--font-sans)}.sg-type-base{font:400 var(--text-base) / 1.4 var(--font-sans)}.sg-type-lg{font:600 var(--text-lg) / 1.3 var(--font-sans);letter-spacing:var(--tracking-tight)}.sg-type-xl{font:600 var(--text-xl) / 1.25 var(--font-sans);letter-spacing:var(--tracking-tighter)}.sg-type-2xl{font:600 var(--text-2xl) / 1.2 var(--font-sans);letter-spacing:var(--tracking-tighter)}.sg-mono-sample{font:var(--text-sm) / 1.4 var(--font-mono);color:var(--text-primary)}.sg-tabular-grid{gap:var(--space-8);display:flex}.sg-space-row{align-items:center;gap:var(--space-3);display:flex}.sg-space-label{font:var(--text-xs) / 1.4 var(--font-mono);color:var(--text-secondary);flex-shrink:0;width:96px}.sg-space-bar{height:var(--space-2);background:var(--accent-solid);border-radius:var(--radius-sm);display:block}.sg-radius-row{gap:var(--space-4);flex-wrap:wrap;display:flex}.sg-radius-item{align-items:center;gap:var(--space-2);flex-direction:column;display:flex}.sg-radius-box{width:var(--space-16);height:var(--space-16);background:var(--bg-element);border:1px solid var(--border-subtle)}.sg-radius-box--sm{border-radius:var(--radius-sm)}.sg-radius-box--md{border-radius:var(--radius-md)}.sg-radius-box--lg{border-radius:var(--radius-lg)}.sg-radius-box--full{border-radius:var(--radius-full)}.sg-elevation-card{padding:var(--space-6);border-radius:var(--radius-md);justify-content:center;align-items:center;display:flex}.sg-shadow-panel{box-shadow:var(--shadow-panel)}.sg-shadow-popover{box-shadow:var(--shadow-popover)}.sg-glass-demo{padding:var(--space-8) var(--space-6);border-radius:var(--radius-md);position:relative;overflow:hidden}.sg-glass-backdrop{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.sg-glass{inset:var(--space-4) var(--space-8);text-align:center;padding:var(--space-4);background:var(--glass-bg);border:var(--glass-border);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-radius:var(--radius-lg);justify-content:center;align-items:center;display:flex;position:absolute}.sg-btn-matrix{gap:var(--space-3);grid-template-columns:100px repeat(5,minmax(0,1fr));align-items:center;display:grid}.sg-iconbtn-matrix{gap:var(--space-3);grid-template-columns:140px repeat(4,minmax(0,1fr));align-items:center;display:grid}.sg-motion-box{padding:var(--space-4);background:var(--bg-element);border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:var(--text-primary);font:var(--text-sm) / 1.4 var(--font-sans)}.sg-motion-box--sm{width:40px;height:40px;padding:0}.sg-motion-list{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.sg-motion-list-item{padding:var(--space-2) var(--space-3);background:var(--bg-element);border-radius:var(--radius-sm);font:var(--text-sm) / 1.4 var(--font-sans);color:var(--text-primary)}.sg-spring-track{padding:var(--space-2);display:flex}.sg-spring-track.is-right{justify-content:flex-end}.is-focus{outline:2px solid var(--accent-solid);outline-offset:2px}.sg-retention{align-items:center;gap:var(--space-2);display:flex}.sg-retention__track{border-radius:var(--radius-full);background:var(--border-subtle);flex:none;width:64px;height:4px;display:block;position:relative;overflow:hidden}.sg-retention__fill{border-radius:var(--radius-full);height:100%;display:block;position:absolute;inset:0 auto 0 0}.sg-retention__nodata{font-size:var(--text-xs);color:var(--text-tertiary)}@media (max-width:640px){.sg-topbar{padding:var(--space-3) var(--space-4);flex-wrap:wrap}.sg-topbar-controls{flex:100%;justify-content:space-between}.sg-topbar-resolved{display:none}.sg-wrap{padding:var(--space-6) var(--space-4);gap:var(--space-8)}.sg-toc{gap:var(--space-2) var(--space-3)}.sg-row,.sg-space-row{flex-wrap:wrap}.sg-type-row{gap:var(--space-1);grid-template-columns:minmax(0,1fr)}.sg-btn-matrix,.sg-iconbtn-matrix{align-items:stretch;gap:var(--space-2);flex-direction:column;display:flex}.sg-btn-matrix>*,.sg-iconbtn-matrix>*{width:100%}.sg-tabular-grid{flex-wrap:wrap}}