.ds-shell{display:flex;min-height:100dvh}.ds-sidebar{width:240px;flex-shrink:0;background:var(--color-muted);border-right:1px solid var(--color-border);padding:var(--spacing-6) 0 0;position:sticky;top:0;height:100dvh;display:flex;flex-direction:column}.ds-sidebar-top{display:flex;align-items:baseline;justify-content:space-between;padding:0 var(--spacing-6) var(--spacing-6)}.ds-sidebar-brand{font-size:var(--text-sm);font-weight:700;color:var(--color-foreground);text-decoration:none;letter-spacing:-.01em;transition:color var(--duration-fast) var(--ease-default)}.ds-sidebar-brand:hover{color:var(--color-primary)}.ds-sidebar-site-link{font-size:var(--text-xs);color:var(--color-muted-foreground);text-decoration:none;transition:color var(--duration-fast) var(--ease-default)}.ds-sidebar-site-link:hover{color:var(--color-foreground)}.ds-nav-search{display:block;width:calc(100% - var(--spacing-6));margin:0 var(--spacing-3) var(--spacing-4);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);color:var(--color-foreground);background:var(--color-background);border:1px solid var(--color-input);border-radius:var(--radius-sm);outline:none;transition:border-color var(--duration-fast) var(--ease-default)}.ds-nav-search::placeholder{color:var(--color-muted-foreground)}.ds-nav-search:focus{border-color:var(--color-ring)}.ds-nav{display:flex;flex-direction:column;gap:var(--spacing-4);padding:0 var(--spacing-3);flex:1;overflow-y:auto}.ds-nav-external-icon{opacity:0;margin-left:auto;transition:opacity var(--duration-fast) var(--ease-default)}.ds-nav-group a:hover .ds-nav-external-icon{opacity:.4}.ds-nav-summary{font-size:var(--text-xs);font-weight:600;color:var(--color-muted-foreground);text-transform:uppercase;letter-spacing:.05em;padding:var(--spacing-2) var(--spacing-3);width:100%;cursor:pointer;display:flex;align-items:center;gap:var(--spacing-2);border:none;border-radius:var(--radius-sm);background:none;user-select:none;transition:color var(--duration-fast) var(--ease-default)}.ds-nav-chevron{flex-shrink:0;transition:transform var(--duration-fast) var(--ease-default)}.ds-nav-summary[aria-expanded=true] .ds-nav-chevron{transform:rotate(90deg)}.ds-nav-summary:hover{color:var(--color-foreground)}.ds-nav-group{display:flex;flex-direction:column;gap:var(--spacing-1);padding:var(--spacing-1) 0 0}.ds-nav-group a{font-size:var(--text-sm);color:var(--color-muted-foreground);text-decoration:none;display:flex;align-items:center;padding:var(--spacing-1) var(--spacing-3);padding-left:calc(var(--spacing-3) + 12px + var(--spacing-2));border-radius:var(--radius-sm);transition:background var(--duration-fast) var(--ease-default),color var(--duration-fast) var(--ease-default)}.ds-nav-group a:hover{color:var(--color-foreground);background:var(--color-accent)}.ds-nav-group a[aria-current=page]{color:var(--color-primary);font-weight:600;background:color-mix(in oklch,var(--color-primary) 10%,transparent)}.ds-page{flex:1;min-width:0;max-width:var(--container-max);padding:var(--spacing-12) var(--spacing-8)}.ds-page-header{display:flex;align-items:baseline;gap:var(--spacing-4);margin-bottom:var(--spacing-2)}.ds-page-header>h1{font-size:var(--text-4xl);font-weight:700;line-height:var(--leading-tight);letter-spacing:-.02em;text-wrap:balance}.ds-fullscreen-link{font-size:var(--text-sm);color:var(--color-primary);text-decoration:underline;text-underline-offset:3px;text-decoration-color:color-mix(in oklch,var(--color-primary) 40%,transparent);white-space:nowrap;transition:color .2s var(--ease-default),text-decoration-color .2s var(--ease-default)}.ds-fullscreen-link:hover{color:var(--color-primary);text-decoration-color:var(--color-primary)}.ds-page>p.ds-desc{font-size:var(--text-lg);color:var(--color-muted-foreground);margin-bottom:var(--spacing-12);max-width:65ch}.specimen-section{margin-bottom:var(--spacing-16)}.specimen-section>h2{font-size:var(--text-xl);font-weight:600;line-height:var(--leading-tight);color:var(--color-foreground);margin-bottom:var(--spacing-6);padding-bottom:var(--spacing-2);border-bottom:1px solid var(--color-border)}.specimen-row{display:flex;flex-wrap:wrap;gap:var(--spacing-4);align-items:flex-start;margin-bottom:var(--spacing-6)}.specimen{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-2)}.specimen-label{font-size:var(--text-xs);color:var(--color-muted-foreground);font-family:monospace}.specimen-section section:not([data-seamless])>div{padding-block:var(--spacing-12)}.demo-area{padding:var(--spacing-8);background:var(--color-muted);border-radius:var(--radius-lg);border:1px solid var(--color-border)}.demo-area>h3{font-size:var(--text-sm);font-weight:600;color:var(--color-muted-foreground);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--spacing-4)}