.site-header{z-index:var(--z-sticky);background:var(--bg);border-bottom:1px solid var(--border);position:sticky;top:0}.site-header__inner{align-items:center;gap:var(--space-6);max-width:var(--container-2xl);padding:0 var(--gutter);height:64px;margin:0 auto;display:flex}.site-wordmark{align-items:baseline;gap:var(--space-2);font-family:var(--font-sans);font-weight:var(--fw-semibold);font-size:var(--fs-lg);letter-spacing:var(--tr-snug);color:var(--fg);text-decoration:none;display:flex}.site-wordmark:hover{color:var(--fg)}.site-wordmark__dot{color:var(--accent)}.site-wordmark__suffix{font-family:var(--font-mono);font-weight:var(--fw-medium);font-size:var(--fs-2xs);letter-spacing:var(--tr-caps);text-transform:uppercase;color:var(--fg-3)}.site-header__nav{align-items:stretch;gap:var(--space-1);height:100%;margin-left:auto;display:flex}.site-header__link{padding:0 var(--space-3);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--fg-2);align-items:center;text-decoration:none;display:inline-flex}.site-header__link:hover{color:var(--fg)}.site-header__actions{align-items:stretch;gap:var(--space-2);display:flex}.site-search-button{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);font-family:var(--font-sans);font-size:var(--fs-sm);color:var(--fg-3);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;align-self:center;display:inline-flex;position:relative}.site-search-button:hover{border-color:var(--border-strong);color:var(--fg-2)}.site-search-button:after{content:"";inset:calc(-1 * var(--space-2)) 0;position:absolute}.docs-shell{gap:var(--space-10);max-width:var(--container-2xl);padding:var(--space-8) var(--gutter) var(--space-13);grid-template-columns:260px minmax(0,1fr);margin:0 auto;display:grid}.site-sidebar{top:calc(64px + var(--space-6));max-height:calc(100vh - 64px - var(--space-8));padding-right:var(--space-2);align-self:start;position:sticky;overflow-y:auto}.site-sidebar .ds-navigation-menu__list{margin:0;padding:0;list-style:none}.site-sidebar>nav>.ds-navigation-menu__list>li{margin-bottom:var(--space-5)}.site-sidebar>nav>.ds-navigation-menu__list>li>.ds-navigation-menu__label{padding:var(--space-1) var(--space-2);font-family:var(--font-mono);font-size:var(--fs-2xs);font-weight:var(--fw-medium);letter-spacing:var(--tr-caps);text-transform:uppercase;color:var(--fg-3)}.site-sidebar .ds-navigation-menu__link{padding:var(--space-1) var(--space-2);font-size:var(--fs-sm);color:var(--fg-2);border-radius:var(--radius-xs);align-items:center;text-decoration:none;display:flex}.site-sidebar .ds-navigation-menu__list .ds-navigation-menu__list .ds-navigation-menu__link:hover{color:var(--fg);background:var(--bg-subtle)}.site-sidebar .ds-navigation-menu__link--active{color:var(--fg);font-weight:var(--fw-medium);background:var(--bg-subtle);box-shadow:inset 2px 0 0 0 var(--accent)}@media (max-width:960px){.docs-shell{grid-template-columns:minmax(0,1fr)}.site-sidebar,.site-header__nav{display:none}}.docs-main{min-width:0}.prose{max-width:var(--container-md)}.prose>h1{font-size:var(--fs-4xl);font-weight:var(--fw-semibold);line-height:var(--lh-tight);letter-spacing:var(--tr-tight);margin:0 0 var(--space-4)}.prose h2{font-size:var(--fs-2xl);font-weight:var(--fw-semibold);line-height:var(--lh-snug);letter-spacing:var(--tr-snug);margin:var(--space-10) 0 var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--border)}.prose h3{font-size:var(--fs-xl);font-weight:var(--fw-semibold);line-height:var(--lh-snug);margin:var(--space-7) 0 var(--space-2)}.prose h4{font-size:var(--fs-lg);font-weight:var(--fw-semibold);margin:var(--space-6) 0 var(--space-2)}.prose h2 a,.prose h3 a,.prose h4 a{color:inherit;text-decoration:none}.prose h2 a:hover,.prose h3 a:hover,.prose h4 a:hover{text-underline-offset:.2em;text-decoration:underline}.prose p,.prose ul,.prose ol{line-height:var(--lh-relaxed);margin:0 0 var(--space-4)}.prose li{margin-bottom:var(--space-1)}.prose .lead,.prose>h1+p{font-size:var(--fs-xl);line-height:var(--lh-relaxed);color:var(--fg-2);margin-bottom:var(--space-6)}.prose code{font-family:var(--font-mono);background:var(--bg-muted);border:1px solid var(--border);border-radius:var(--radius-xs);padding:.1em .35em;font-size:.92em}.prose pre code{font-size:var(--fs-sm);background:0 0;border:none;padding:0}.prose hr{border:none;border-top:1px solid var(--border);margin:var(--space-8) 0}.prose blockquote{margin:0 0 var(--space-4);padding:var(--space-1) var(--space-4);border-left:2px solid var(--border-strong);color:var(--fg-2)}.prose img{max-width:100%}.table-scroll{margin:0 0 var(--space-5);border:1px solid var(--border);border-radius:var(--radius-sm);overflow-x:auto}.table-scroll table{border-collapse:collapse;width:100%;font-size:var(--fs-sm)}.table-scroll th{text-align:left;font-weight:var(--fw-medium);font-size:var(--fs-xs);font-family:var(--font-mono);letter-spacing:var(--tr-wide);text-transform:uppercase;color:var(--fg-3);background:var(--bg-subtle);padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--border)}.table-scroll td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--border);vertical-align:top}.table-scroll tr:last-child td{border-bottom:none}.code-block{margin:0 0 var(--space-5);position:relative}.code-block__body pre{padding:var(--space-4);background:var(--bg-muted);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--fs-sm);line-height:var(--lh-normal);margin:0;overflow-x:auto}.code-block__body .shiki,.code-block__body .shiki span{color:var(--shiki-light);font-style:var(--shiki-light-font-style,inherit);font-weight:var(--shiki-light-font-weight,inherit)}[data-theme=dark] .code-block__body .shiki,[data-theme=dark] .code-block__body .shiki span{color:var(--shiki-dark);font-style:var(--shiki-dark-font-style,inherit);font-weight:var(--shiki-dark-font-weight,inherit)}.code-block__copy{top:var(--space-2);right:var(--space-2);z-index:var(--z-raised);position:absolute}.prompt-template{margin:0 0 var(--space-6);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);position:relative}.prompt-template__bar{min-height:var(--space-10);padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--border);background:var(--bg-subtle);border-radius:var(--radius-sm) var(--radius-sm) 0 0;align-items:center;display:flex}.prompt-template__file{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--fg-3)}.prompt-template__body{padding:var(--space-5) var(--space-6) var(--space-1)}.prose .prompt-template h4{margin-top:0}.prose .prompt-template h5{font-size:var(--fs-md);font-weight:var(--fw-semibold);line-height:var(--lh-snug);margin:var(--space-6) 0 var(--space-2)}.prose .prompt-template h6{font-size:var(--fs-sm);font-weight:var(--fw-semibold);letter-spacing:var(--tr-wide);text-transform:uppercase;color:var(--fg-2);margin:var(--space-5) 0 var(--space-2)}.prose .prompt-template hr{margin:var(--space-5) 0}.prose .prompt-template .contains-task-list{padding-left:var(--space-6);list-style:none}.prose .prompt-template .task-list-item{text-indent:calc(-1 * var(--space-6))}.prompt-template .task-list-item input[type=checkbox]{width:var(--space-4);height:var(--space-4);margin-right:var(--space-2);vertical-align:-.15em;accent-color:var(--accent)}.component-header__meta{align-items:center;gap:var(--space-4);margin:0 0 var(--space-5);font-size:var(--fs-sm);display:flex}.component-header__styles{font-size:var(--fs-sm);color:var(--fg-2)}.demo-block{margin:0 0 var(--space-6)}.demo-block__stage{--demo-stage-dot:var(--ink-100);padding:var(--space-8) var(--space-6);border:1px solid var(--border);border-radius:var(--radius-sm) var(--radius-sm) 0 0;background:radial-gradient(circle, var(--demo-stage-dot) 1px, transparent 1px) 0 0 / 16px 16px, var(--bg);display:flow-root}[data-theme=dark] .demo-block__stage,.dark .demo-block__stage{--demo-stage-dot:#ffffff14}@supports (color:lab(0% 0 0)){[data-theme=dark] .demo-block__stage,.dark .demo-block__stage{--demo-stage-dot:lab(100% 0 0/.08)}}.demo-block__source{border:1px solid var(--border);border-radius:0 0 var(--radius-sm) var(--radius-sm);border-top:none}.demo-block__source summary{padding:var(--space-2) var(--space-4);font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--tr-wide);text-transform:uppercase;color:var(--fg-3);cursor:pointer}.demo-block__source summary:hover{color:var(--fg-2);background:var(--bg-subtle)}.demo-block__source .code-block{margin:0}.demo-block__source .code-block__body pre{border:none;border-top:1px solid var(--border);border-radius:0 0 var(--radius-sm) var(--radius-sm)}.demo-block__stage--elements{border-radius:var(--radius-sm)}.demo-block__caption,.patch-table__note{margin:var(--space-2) 0 0;font-size:var(--fs-xs);color:var(--fg-3)}.demo-block__caption{font-family:var(--font-mono);letter-spacing:var(--tr-wide);text-transform:uppercase}.patch-table__note{margin-bottom:var(--space-6)}.demo-row{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.demo-col{gap:var(--space-4);flex-direction:column;max-width:360px;display:flex}.props-required{margin-left:var(--space-2);font-family:var(--font-mono);font-size:var(--fs-3xs);letter-spacing:var(--tr-wide);text-transform:uppercase;color:var(--status-danger-fg)}.props-inherits,.props-gaps{font-size:var(--fs-sm);color:var(--fg-2)}.do-dont{gap:var(--space-4);margin:var(--space-6) 0;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));display:grid}.do-dont__col{border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-4) var(--space-5)}.do-dont__col--do{border-top:2px solid var(--status-success)}.do-dont__col--dont{border-top:2px solid var(--status-danger)}.do-dont__label{font-family:var(--font-mono);font-size:var(--fs-xs);font-weight:var(--fw-medium);letter-spacing:var(--tr-caps);text-transform:uppercase;margin:0 0 var(--space-2)}.do-dont__col--do .do-dont__label{color:var(--status-success-fg)}.do-dont__col--dont .do-dont__label{color:var(--status-danger-fg)}.do-dont ul{padding-left:var(--space-5);font-size:var(--fs-sm);margin:0}.do-dont li{margin-bottom:var(--space-2)}.related-components{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid}.related-card{gap:var(--space-1);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--fg);transition:border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);flex-direction:column;text-decoration:none;display:flex}.related-card:hover{border-color:var(--border-strong);color:var(--fg);transform:translateY(-1px)}.related-card__name{font-weight:var(--fw-medium)}.related-card__description{font-size:var(--fs-sm);color:var(--fg-2)}.color-swatch{width:var(--space-8);height:var(--space-6);border:1px solid var(--border);border-radius:var(--radius-xs);display:inline-block}.contrast-usage{font-size:var(--fs-xs);color:var(--fg-3);margin-top:var(--space-1)}.contrast-sample{padding:var(--space-1) var(--space-3);border:1px solid var(--border);border-radius:var(--radius-xs);font-weight:var(--fw-medium);white-space:nowrap;display:inline-block}.contrast-verdict{font-family:var(--font-mono);font-size:var(--fs-2xs);letter-spacing:var(--tr-wide);text-transform:uppercase;white-space:nowrap}.contrast-verdict--pass{color:var(--status-success-fg)}.contrast-verdict--large{color:var(--status-warning-fg)}.contrast-verdict--fail{color:var(--status-danger-fg)}.type-scale__row{gap:var(--space-4);padding:var(--space-3) 0;border-bottom:1px solid var(--border);grid-template-columns:140px minmax(0,1fr);align-items:baseline;display:grid}.type-scale__meta{gap:var(--space-1);font-size:var(--fs-xs);color:var(--fg-3);flex-direction:column;display:flex}.type-scale__sample{line-height:var(--lh-snug);white-space:nowrap;text-overflow:ellipsis;margin:0;overflow:hidden}.space-scale__row{gap:var(--space-3);padding:var(--space-1) 0;grid-template-columns:120px 60px minmax(0,1fr);align-items:center;display:grid}.space-scale__name{font-size:var(--fs-xs)}.space-scale__value{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--fg-3)}.space-scale__bar{height:var(--space-3);background:var(--accent);border-radius:var(--radius-none);display:block}.radius-gallery,.shadow-gallery{gap:var(--space-5);margin:var(--space-5) 0;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));display:grid}.radius-gallery__item,.shadow-gallery__item{gap:var(--space-2);font-size:var(--fs-xs);flex-direction:column;display:flex}.radius-gallery__box{height:var(--space-10);background:var(--bg-subtle);border:1px solid var(--border-strong)}.shadow-gallery__box{height:var(--space-10);background:var(--surface);border-radius:var(--radius-md)}.radius-gallery__meta,.shadow-gallery__meta{color:var(--fg-3)}.motion-gallery__group h3{font-size:var(--fs-md)}.motion-gallery__row{gap:var(--space-3);padding:var(--space-1) 0;grid-template-columns:120px 60px minmax(0,1fr);align-items:center;display:grid}.motion-gallery__label{font-size:var(--fs-xs)}.motion-gallery__value{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--fg-3);font-weight:var(--fw-regular)}.motion-gallery__track{height:var(--space-5);border-left:1px solid var(--border);border-right:1px solid var(--border);padding:0 var(--space-1);align-items:center;display:flex}.motion-gallery__dot{width:var(--space-3);height:var(--space-3);border-radius:var(--radius-pill);background:var(--accent)}.home-hero{background:var(--bg-inverse);color:var(--fg-inverse);background-image:radial-gradient(oklch(100% 0 0/.08) 1px,#0000 1px);background-size:24px 24px}.home-hero__inner{max-width:var(--container-lg);padding:var(--space-13) var(--gutter);margin:0 auto}.home-hero__eyebrow{color:var(--accent-ink-inverse);margin:0 0 var(--space-4)}.home-hero__title{font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:clamp(38px, 5.5vw, var(--fs-6xl));line-height:var(--lh-tight);letter-spacing:var(--tr-tight);color:var(--fg-inverse);margin:0 0 var(--space-5);max-width:16em}.home-hero__dot{color:var(--accent)}.home-hero__lead{font-size:var(--fs-xl);line-height:var(--lh-relaxed);color:var(--fg-inverse-2);max-width:var(--container-md);margin:0 0 var(--space-7)}.home-hero__actions{align-items:center;gap:var(--space-5);margin-bottom:var(--space-10);display:flex}.home-hero__actions .ds-button{text-decoration:none}.home-hero__secondary{color:var(--fg-inverse);font-weight:var(--fw-medium)}.home-hero__secondary:hover{color:var(--accent-ink-inverse)}.home-hero__stats{gap:var(--space-9);border-top:1px solid var(--border-inverse);padding-top:var(--space-6);flex-wrap:wrap;margin:0;display:flex}.home-hero__stat dd{font-family:var(--font-mono);font-size:var(--fs-3xl);font-weight:var(--fw-semibold);color:var(--accent);margin:0}.home-hero__stat dt{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--tr-caps);text-transform:uppercase;color:var(--fg-inverse-3)}.home-section{max-width:var(--container-xl);padding:var(--space-11) var(--gutter) 0;margin:0 auto}.home-section>h2{font-size:var(--fs-2xl);letter-spacing:var(--tr-snug);margin:0 0 var(--space-6)}.home-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.home-card{border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-5);background:var(--surface)}.home-card h3{font-size:var(--fs-lg);margin:0 0 var(--space-2)}.home-card p{font-size:var(--fs-sm);color:var(--fg-2);line-height:var(--lh-relaxed);margin:0}.home-card--link{color:var(--fg);transition:border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);text-decoration:none}.home-card--link:hover{color:var(--fg);border-color:var(--border-strong);transform:translateY(-1px)}.home-ai-note{max-width:var(--container-md);color:var(--fg-2);line-height:var(--lh-relaxed)}.component-index__grid{gap:var(--space-3);margin-bottom:var(--space-8);grid-template-columns:repeat(auto-fill,minmax(240px,1fr));display:grid}.site-footer{background:var(--bg-inverse);color:var(--fg-inverse);margin-top:var(--space-13)}.site-footer__inner{max-width:var(--container-2xl);padding:var(--space-11) var(--gutter);margin:0 auto}.site-footer__wordmark{font-weight:var(--fw-semibold);font-size:var(--fs-xl);margin:0 0 var(--space-1)}.site-footer__dot{color:var(--accent)}.site-footer__tagline{color:var(--fg-inverse-2);margin:0 0 var(--space-6)}.site-footer__links{gap:var(--space-5);margin-bottom:var(--space-6);flex-wrap:wrap;display:flex}.site-footer__links a{color:var(--fg-inverse);font-size:var(--fs-sm)}.site-footer__links a:hover{color:var(--accent-ink-inverse)}.site-footer__meta{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--fg-inverse-3);margin:0}.brand-card{margin:0 0 var(--space-6);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden}.brand-card__caption{align-items:baseline;gap:var(--space-2) var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);background:var(--bg-subtle);flex-wrap:wrap;display:flex}.brand-card__title{font-weight:var(--fw-600,600)}.brand-card__subtitle{color:var(--fg-3);font-size:var(--fs-sm)}.brand-card__badges{gap:var(--space-2);margin-left:auto;display:flex}.brand-card__badge{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--border-strong);border-radius:var(--radius-pill);color:var(--fg-2);padding:2px 8px}.brand-card__badge--ships{border-color:var(--status-success);color:var(--status-success-fg)}.brand-card__badge--repo{color:var(--fg-3)}.brand-card__stage{background:var(--bg);overflow-x:auto}.brand-card__frame{border:0;max-width:none;display:block}.brand-card__image{padding:var(--space-5);max-width:100%;display:block}.index-group__requirement{padding:var(--space-3) var(--space-4);border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--bg-subtle)}.elements-index__exports{margin:var(--space-2) 0 0;max-width:48ch;font-size:var(--fs-sm);color:var(--fg-2)}.example-source{margin:0 0 var(--space-6)}.example-source__path{margin-bottom:var(--space-2);font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--fg-3)}.example-source .code-block{margin:0}.demo-block__stage--canvas{border-radius:var(--radius-sm);aspect-ratio:16/9;background:0 0;padding:0}