{"name":"ds-solo-shape","version":"5.0.0-rc.2","groups":[{"id":"brand","title":"Brand roles","blurb":"Neutral reference roles for brand and wayfinding. Client recipes map these semantic roles to approved colors."},{"id":"ink","title":"Ink","blurb":"Neutral text roles. Body and labels never drop below regular weight."},{"id":"surface","title":"Surfaces & borders","blurb":"Neutral canvas, card and inset surfaces with hairline and emphasized borders."},{"id":"ondark","title":"On-dark","blurb":"Controls and hairlines on the ink-900 header and nav — the one place the UI sits on near-black, so the usual neutrals invert."},{"id":"status","title":"Status","blurb":"Foreground, background, and border roles. The reference is grayscale and status is never color-only."},{"id":"font","title":"Font families","blurb":"Native system stack for everything readable; matching system monospace for IDs, labels and timestamps. No web fonts load — the UI feels instant and native."},{"id":"type-scale","title":"Type scale","blurb":"Size + line-height pairs. Headings run heavy with a real size jump to body."},{"id":"weight","title":"Weights","blurb":"Body floor is regular — never go thinner."},{"id":"tracking","title":"Letter spacing","blurb":"Tracking by role, eased for SF metrics."},{"id":"spacing","title":"Spacing","blurb":"4px base scale, with two micro steps for fine rhythm."},{"id":"radius","title":"Radius","blurb":"V2 softened scale — rounder, more tactile."},{"id":"border","title":"Border widths","blurb":"Stroke weights are a decision, not a magic number."},{"id":"size","title":"Control sizes","blurb":"The few fixed heights everything aligns to — header, controls, tiles."},{"id":"elevation","title":"Elevation","blurb":"Use sparingly — borders first. Shadows are reserved for things that float."},{"id":"glass","title":"Material / glass","blurb":"The premium translucent surface for things that FLOAT over the page: dialogs, menus, popovers. The page behind stays sharp; only a floating surface frosts what is directly beneath it."},{"id":"z-index","title":"Z-index","blurb":"Stacking order is a named scale, not an arms race."},{"id":"focus","title":"Focus","blurb":"One focus ring everywhere — surface gap + brand line."},{"id":"ease","title":"Easing","blurb":"Pick easing by what the element is DOING. All curves decelerate for the buttery glide; they never change with pace."},{"id":"duration","title":"Duration","blurb":"Pick duration by how BIG the move is. Anchored on the approved 280ms card-hover decelerate. Fast and Calm paces rescale every duration; easing stays constant."}],"tokens":[{"name":"--ss-color-brand","value":"#181818","description":"Primary neutral brand and action role","group":"brand"},{"name":"--ss-color-brand-active","value":"#272727","description":"Active neutral brand and action role","group":"brand"},{"name":"--ss-color-brand-subtle","value":"#F4F4F4","description":"Subtle neutral brand surface","group":"brand"},{"name":"--ss-color-on-brand","value":"#FFFFFF","description":"Foreground on the brand fill","group":"brand"},{"name":"--ss-color-accent","value":"#525252","description":"Secondary neutral wayfinding role","group":"brand"},{"name":"--ss-color-accent-subtle","value":"#F4F4F4","description":"Subtle secondary wayfinding surface","group":"brand"},{"name":"--ss-color-ink-900","value":"#181818","description":"Primary text","group":"ink"},{"name":"--ss-color-ink-800","value":"#272727","description":"Active neutral fill and strongest hover","group":"ink"},{"name":"--ss-color-ink-700","value":"#3F3F3F","description":"Strong body / headings on surface","group":"ink"},{"name":"--ss-color-ink-600","value":"#525252","description":"Supporting body text","group":"ink"},{"name":"--ss-color-ink-500","value":"#626262","description":"Secondary text","group":"ink"},{"name":"--ss-color-ink-400","value":"#767676","description":"Muted / placeholder","group":"ink"},{"name":"--ss-color-ink-inverse","value":"#FFFFFF","description":"Text on ink-900 fills","group":"ink"},{"name":"--ss-color-canvas","value":"#F7F7F7","description":"App canvas","group":"surface"},{"name":"--ss-color-surface","value":"#FFFFFF","description":"Cards, panels","group":"surface"},{"name":"--ss-color-surface-subtle","value":"#F4F4F4","description":"Alt rows, inset wells","group":"surface"},{"name":"--ss-color-surface-strong","value":"#E4E4E4","description":"Deeper inset / hover","group":"surface"},{"name":"--ss-color-border","value":"#E4E4E4","description":"Hairline","group":"surface"},{"name":"--ss-color-border-strong","value":"#949494","description":"Emphasized divider / input edge","group":"surface"},{"name":"--ss-color-on-dark-line","value":"#3F3F3F","description":"Outlined control border / hairline on dark","group":"ondark"},{"name":"--ss-color-on-dark-edge","value":"#090909","description":"Hard edge under the ink-900 header","group":"ondark"},{"name":"--ss-color-on-dark-ink","value":"#FFFFFF","description":"Primary text & icons on dark","group":"ondark"},{"name":"--ss-color-on-dark-ink-2","value":"#949494","description":"Secondary text on dark — nav links, header actions","group":"ondark"},{"name":"--ss-color-on-dark-ink-dim","value":"#B5B5B5","description":"Tertiary / inactive text on dark (resting tabs)","group":"ondark"},{"name":"--ss-color-on-dark-ink-mute","value":"#A0A0A0","description":"Muted meta / group labels on dark","group":"ondark"},{"name":"--ss-color-on-dark-hover","value":"rgba(255,255,255,0.07)","description":"Subtle fill on hover","group":"ondark"},{"name":"--ss-color-on-dark-active","value":"rgba(255,255,255,0.11)","description":"Selected / active fill on dark","group":"ondark"},{"name":"--ss-color-status-success","value":"#272727","description":"Published / live / done foreground","group":"status"},{"name":"--ss-color-status-success-subtle","value":"#F4F4F4","description":"Published / live / done surface","group":"status"},{"name":"--ss-color-status-success-subtle-hover","value":"#E4E4E4","description":"Published surface hover","group":"status"},{"name":"--ss-color-status-info","value":"#3F3F3F","description":"In progress / informational foreground","group":"status"},{"name":"--ss-color-status-info-subtle","value":"#F4F4F4","description":"Informational surface","group":"status"},{"name":"--ss-color-status-warning","value":"#525252","description":"Attention / pending foreground","group":"status"},{"name":"--ss-color-status-warning-subtle","value":"#F4F4F4","description":"Attention / pending surface","group":"status"},{"name":"--ss-color-status-warning-text","value":"#3F3F3F","description":"Attention text on subtle surface","group":"status"},{"name":"--ss-color-status-warning-border","value":"#767676","description":"Attention border","group":"status"},{"name":"--ss-color-status-danger","value":"#181818","description":"Blocked / error foreground","group":"status"},{"name":"--ss-color-status-danger-subtle","value":"#E4E4E4","description":"Blocked / error surface","group":"status"},{"name":"--ss-color-status-danger-text","value":"#181818","description":"Blocked / error text","group":"status"},{"name":"--ss-color-status-danger-border","value":"#626262","description":"Blocked / error border","group":"status"},{"name":"--ss-color-status-danger-pulse-start","value":"rgba(24,24,24,0.5)","description":"Danger pulse start","group":"status"},{"name":"--ss-color-status-danger-pulse-end","value":"rgba(24,24,24,0)","description":"Danger pulse end","group":"status"},{"name":"--ss-color-status-neutral","value":"#626262","description":"Neutral / skipped / draft foreground","group":"status"},{"name":"--ss-color-status-neutral-subtle","value":"#F4F4F4","description":"Neutral / skipped / draft surface","group":"status"},{"name":"--ss-font-ui","value":"ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif","description":"Native system stack — cleaner at dense sizes, zero web-font load","group":"font"},{"name":"--ss-font-mono","value":"ui-monospace, \"SF Mono\", \"SFMono-Regular\", Menlo, Consolas, \"Liberation Mono\", monospace","description":"Matching system monospace — IDs, labels, timestamps","group":"font"},{"name":"--ss-type-size-display","value":"48px","description":"Cover / hero title","group":"type-scale"},{"name":"--ss-type-line-height-display","value":"50px","description":"Display line-height","group":"type-scale"},{"name":"--ss-type-size-page","value":"30px","description":"Route / page title","group":"type-scale"},{"name":"--ss-type-line-height-page","value":"36px","description":"Page line-height","group":"type-scale"},{"name":"--ss-type-size-section","value":"19px","description":"Section title","group":"type-scale"},{"name":"--ss-type-line-height-section","value":"25px","description":"Section line-height","group":"type-scale"},{"name":"--ss-type-size-card","value":"14px","description":"Card title (heavy, small)","group":"type-scale"},{"name":"--ss-type-line-height-card","value":"20px","description":"Card title line-height","group":"type-scale"},{"name":"--ss-type-size-body","value":"14px","description":"Body text","group":"type-scale"},{"name":"--ss-type-line-height-body","value":"21px","description":"Body line-height","group":"type-scale"},{"name":"--ss-type-size-sm","value":"13px","description":"Small body / control text","group":"type-scale"},{"name":"--ss-type-line-height-sm","value":"19px","description":"Small line-height","group":"type-scale"},{"name":"--ss-type-size-meta","value":"12px","description":"Meta / timestamps","group":"type-scale"},{"name":"--ss-type-line-height-meta","value":"16px","description":"Meta line-height","group":"type-scale"},{"name":"--ss-type-size-micro","value":"11px","description":"Micro labels, uppercase rows","group":"type-scale"},{"name":"--ss-type-line-height-micro","value":"15px","description":"Micro line-height","group":"type-scale"},{"name":"--ss-type-size-ui-lg","value":"15px","description":"Header brand name / large control glyphs","group":"type-scale"},{"name":"--ss-type-weight-regular","value":"400","description":"Body floor — never go thinner","group":"weight"},{"name":"--ss-type-weight-medium","value":"500","description":"Medium","group":"weight"},{"name":"--ss-type-weight-semi","value":"600","description":"Semibold — control labels","group":"weight"},{"name":"--ss-type-weight-bold","value":"700","description":"Bold — card titles","group":"weight"},{"name":"--ss-type-weight-heavy","value":"800","description":"Fat headings","group":"weight"},{"name":"--ss-type-tracking-label","value":"0.06em","description":"Uppercase row labels","group":"tracking"},{"name":"--ss-type-tracking-tight","value":"-0.015em","description":"Page / section titles","group":"tracking"},{"name":"--ss-type-tracking-heavy","value":"-0.02em","description":"Big fat display headings (eased for SF’s wider metrics)","group":"tracking"},{"name":"--ss-space-05","value":"2px","description":"Micro nudge — tightest vertical rhythm","group":"spacing"},{"name":"--ss-space-1","value":"4px","description":"Base unit","group":"spacing"},{"name":"--ss-space-15","value":"6px","description":"Micro step — chip gaps, label margins","group":"spacing"},{"name":"--ss-space-2","value":"8px","description":"2× base","group":"spacing"},{"name":"--ss-space-3","value":"12px","description":"3× base","group":"spacing"},{"name":"--ss-space-4","value":"16px","description":"4× base","group":"spacing"},{"name":"--ss-space-5","value":"20px","description":"5× base","group":"spacing"},{"name":"--ss-space-6","value":"24px","description":"6× base","group":"spacing"},{"name":"--ss-space-8","value":"32px","description":"8× base","group":"spacing"},{"name":"--ss-space-10","value":"40px","description":"10× base","group":"spacing"},{"name":"--ss-space-12","value":"48px","description":"12× base","group":"spacing"},{"name":"--ss-space-16","value":"64px","description":"16× base","group":"spacing"},{"name":"--ss-radius-xs","value":"4px","description":"Chips, dots, status tiles","group":"radius"},{"name":"--ss-radius-sm","value":"9px","description":"Inputs, buttons","group":"radius"},{"name":"--ss-radius-md","value":"13px","description":"Cards, panels","group":"radius"},{"name":"--ss-radius-lg","value":"18px","description":"Large containers, dialogs","group":"radius"},{"name":"--ss-radius-pill","value":"999px","description":"Pills, fully round","group":"radius"},{"name":"--ss-border-width","value":"1px","description":"Standard stroke — borders, dividers, outlines","group":"border"},{"name":"--ss-border-width-hairline","value":"0.5px","description":"Hairline on glass surfaces","group":"border"},{"name":"--ss-border-width-focus","value":"2px","description":"Focus ring line weight","group":"border"},{"name":"--ss-size-control","value":"34px","description":"Standard control height — buttons, inputs, facets","group":"size"},{"name":"--ss-size-control-small","value":"30px","description":"Small control height","group":"size"},{"name":"--ss-size-tile","value":"26px","description":"Compact choice indicator and mark size","group":"size"},{"name":"--ss-size-touch-target","value":"44px","description":"Minimum square touch target","group":"size","structural":true},{"name":"--ss-size-dialog-sm","value":"400px","description":"Small dialog inline maximum","group":"size","structural":true},{"name":"--ss-size-dialog-md","value":"520px","description":"Medium dialog inline maximum","group":"size","structural":true},{"name":"--ss-size-dialog-lg","value":"680px","description":"Large dialog inline maximum","group":"size","structural":true},{"name":"--ss-element-button-icon-padding","value":"11px","description":"Icon-button inline inset","group":"size","structural":true},{"name":"--ss-element-button-icon-gap","value":"7px","description":"Icon-button internal gap","group":"size","structural":true},{"name":"--ss-element-chip-height","value":"22px","description":"Status chip minimum block size","group":"size","structural":true},{"name":"--ss-element-status-indicator-size","value":"6px","description":"Status and meter indicator thickness","group":"size","structural":true},{"name":"--ss-element-dialog-icon-size","value":"36px","description":"Dialog icon tile","group":"size","structural":true},{"name":"--ss-element-dialog-close-offset-block","value":"-3px","description":"Dialog close optical block offset","group":"size","structural":true},{"name":"--ss-element-dialog-close-offset-inline","value":"-6px","description":"Dialog close optical inline offset","group":"size","structural":true},{"name":"--ss-element-control-padding-inline","value":"10px","description":"Native control inline inset","group":"size","structural":true},{"name":"--ss-element-control-icon-offset","value":"11px","description":"Native control trailing icon offset","group":"size","structural":true},{"name":"--ss-element-segment-inset","value":"3px","description":"Segmented-control thumb inset","group":"size","structural":true},{"name":"--ss-element-segment-option-padding","value":"14px","description":"Segmented-control option inline inset","group":"size","structural":true},{"name":"--ss-element-dropdown-menu-offset","value":"-6px","description":"Dropdown menu closed-state block offset","group":"size","structural":true},{"name":"--ss-element-textarea-min-height","value":"88px","description":"Textarea default minimum block size","group":"size","structural":true},{"name":"--ss-element-drawer-width","value":"360px","description":"Drawer preferred inline size","group":"size","structural":true},{"name":"--ss-element-check-glyph-size","value":"22px","description":"Completion check glyph","group":"size","structural":true},{"name":"--ss-element-text-gap","value":"5px","description":"Tight helper-text separation","group":"size","structural":true},{"name":"--ss-element-halo-spread","value":"14px","description":"Completion halo maximum spread","group":"size","structural":true},{"name":"--ss-size-layout-grid-sm","value":"12rem","description":"Small intrinsic grid item minimum","group":"size","structural":true},{"name":"--ss-size-layout-grid-md","value":"16rem","description":"Medium intrinsic grid item minimum","group":"size","structural":true},{"name":"--ss-size-layout-grid-lg","value":"22rem","description":"Large intrinsic grid item minimum","group":"size","structural":true},{"name":"--ss-size-layout-content","value":"70rem","description":"Readable centered content maximum","group":"size","structural":true},{"name":"--ss-size-layout-wide","value":"90rem","description":"Wide centered content maximum","group":"size","structural":true},{"name":"--ss-size-layout-full","value":"100%","description":"Uncapped centered content width","group":"size","structural":true},{"name":"--ss-size-layout-sidebar","value":"18rem","description":"Intrinsic sidebar preferred width","group":"size","structural":true},{"name":"--ss-size-layout-sidebar-threshold","value":"50%","description":"Content threshold before sidebar wraps","group":"size","structural":true},{"name":"--ss-size-layout-switcher-sm","value":"24rem","description":"Small switcher stack threshold","group":"size","structural":true},{"name":"--ss-size-layout-switcher-md","value":"36rem","description":"Medium switcher stack threshold","group":"size","structural":true},{"name":"--ss-size-layout-switcher-lg","value":"48rem","description":"Large switcher stack threshold","group":"size","structural":true},{"name":"--ss-shadow-sm","value":"0 1px 2px rgba(24,24,24,0.05)","description":"Resting card","group":"elevation"},{"name":"--ss-shadow-md","value":"0 4px 12px rgba(24,24,24,0.10), 0 1px 3px rgba(24,24,24,0.06)","description":"Hover lift","group":"elevation"},{"name":"--ss-shadow-pop","value":"0 8px 28px rgba(24,24,24,0.16)","description":"Floating overlays","group":"elevation"},{"name":"--ss-shadow-input-inset","value":"rgba(24,24,24,0.04)","description":"Hairline inset shadow on input edges","group":"elevation"},{"name":"--ss-glass-bg","value":"rgba(252,252,252,0.78)","description":"Balanced — glassy yet soft over busy content","group":"glass"},{"name":"--ss-glass-bg-solid","value":"rgba(252,252,252,0.92)","description":"Denser, for tall / legible bodies","group":"glass"},{"name":"--ss-glass-blur","value":"50px","description":"Backdrop blur radius","group":"glass"},{"name":"--ss-glass-saturate","value":"135%","description":"Backdrop saturation boost","group":"glass"},{"name":"--ss-glass-border","value":"rgba(255,255,255,0.6)","description":"Bright glass edge","group":"glass"},{"name":"--ss-glass-hi","value":"rgba(255,255,255,0.6)","description":"Inset top highlight","group":"glass"},{"name":"--ss-glass-shadow","value":"0 1px 0 var(--ss-glass-hi) inset, 0 16px 44px rgba(24,24,24,0.16), 0 2px 8px rgba(24,24,24,0.06)","description":"Composite glass shadow — highlight + deep soft drop","group":"glass"},{"name":"--ss-glass-input-bg","value":"rgba(255,255,255,0.62)","description":"Frosted input resting on glass","group":"glass"},{"name":"--ss-glass-input-bg-focus","value":"rgba(255,255,255,0.92)","description":"Frosted input focused — denser","group":"glass"},{"name":"--ss-glass-input-line","value":"rgba(24,24,24,0.12)","description":"Hairline input edge on glass","group":"glass"},{"name":"--ss-glass-inset-line","value":"rgba(24,24,24,0.07)","description":"Hairline divider inside glass","group":"glass"},{"name":"--ss-color-shimmer-high","value":"rgba(255,255,255,0.18)","description":"Skeleton/meter sheen highlight (lower opacity)","group":"glass"},{"name":"--ss-color-shimmer-mid","value":"rgba(255,255,255,0.45)","description":"Skeleton/meter sheen mid-band highlight (higher opacity)","group":"glass"},{"name":"--ss-z-pop","value":"600","description":"Popovers, dropdown menus","group":"z-index"},{"name":"--ss-z-overlay","value":"1000","description":"Dialog scrim + dialog","group":"z-index"},{"name":"--ss-z-toast","value":"1400","description":"Toasts / audit badges above everything","group":"z-index"},{"name":"--ss-focus-ring","value":"0 0 0 2px var(--ss-color-surface), 0 0 0 4px var(--ss-color-brand)","description":"One focus ring everywhere — surface gap + brand line","group":"focus"},{"name":"--ss-focus-ring-width","value":"3px","description":"Inner focus wash spread","group":"focus"},{"name":"--ss-motion-ease-standard","value":"cubic-bezier(0.32, 0.72, 0, 1)","description":"Workhorse — smooth, soft landing","group":"ease"},{"name":"--ss-motion-ease-out","value":"cubic-bezier(0.22, 1, 0.36, 1)","description":"ENTERING — buttery quint decelerate","group":"ease"},{"name":"--ss-motion-ease-in","value":"cubic-bezier(0.64, 0, 0.78, 0)","description":"LEAVING — eases up, accelerates away","group":"ease"},{"name":"--ss-motion-ease-in-out","value":"cubic-bezier(0.76, 0, 0.24, 1)","description":"MOVING between two on-screen states","group":"ease"},{"name":"--ss-motion-ease-settle","value":"cubic-bezier(0.34, 1.40, 0.64, 1)","description":"RARE tiny overshoot — confirm / commit only","group":"ease"},{"name":"--ss-motion-ease-glide","value":"cubic-bezier(0.16, 1, 0.30, 1)","description":"SIGNATURE long expo decelerate — press & state-morph commits","group":"ease"},{"name":"--ss-motion-ease-smooth","value":"cubic-bezier(0.45, 0, 0.55, 1)","description":"EVEN symmetric — colour crossfades that reveal gradually","group":"ease"},{"name":"--ss-motion-duration-instant","value":"150ms","fast":"70ms","calm":"240ms","description":"Toggle, single dot flip","group":"duration"},{"name":"--ss-motion-duration-fast","value":"210ms","fast":"90ms","calm":"340ms","description":"Hover colour, focus, small state change","group":"duration"},{"name":"--ss-motion-duration-base","value":"280ms","fast":"120ms","calm":"460ms","description":"Chip morph, content swap, card hover","group":"duration"},{"name":"--ss-motion-duration-slow","value":"400ms","fast":"170ms","calm":"660ms","description":"List settle (FLIP), larger surfaces","group":"duration"},{"name":"--ss-motion-duration-morph","value":"520ms","fast":"210ms","calm":"840ms","description":"State-morph commit (publish) — deliberate","group":"duration"},{"name":"--ss-motion-duration-tag","value":"700ms","fast":"260ms","calm":"1120ms","description":"Status-tag colour crossfade — slow, even reveal","group":"duration"},{"name":"--ss-motion-duration-page","value":"560ms","fast":"200ms","calm":"900ms","description":"Route / tab transitions, smooth scroll","group":"duration"},{"name":"--ss-motion-duration-curve","value":"760ms","fast":"300ms","calm":"1180ms","description":"Easing-player dot — long enough to FEEL the curve","group":"duration"},{"name":"--ss-motion-duration-grow","value":"1100ms","fast":"420ms","calm":"1700ms","description":"Shared-surface growth — slow enough to track the edges from card to detail","group":"duration"},{"name":"--ss-motion-duration-roll","value":"1800ms","fast":"720ms","calm":"2900ms","description":"Value count roll — long dramatic settle","group":"duration"},{"name":"--ss-motion-duration-scroll-min","value":"520ms","fast":"220ms","calm":"800ms","description":"In-page scroll, short hops","group":"duration"},{"name":"--ss-motion-duration-scroll-max","value":"1100ms","fast":"420ms","calm":"1700ms","description":"In-page scroll, long hauls","group":"duration"},{"name":"--ss-motion-duration-press-return","value":"800ms","fast":"300ms","calm":"1180ms","description":"Asymmetric button release glide","group":"duration"},{"name":"--ss-motion-duration-meter-sheen","value":"2600ms","fast":"1000ms","calm":"3800ms","description":"Progress meter sheen cycle","group":"duration"},{"name":"--ss-motion-duration-skeleton-sheen","value":"2200ms","fast":"900ms","calm":"3400ms","description":"Skeleton shimmer cycle","group":"duration"},{"name":"--ss-motion-duration-reduced","value":"0.01ms","fast":"0.01ms","calm":"0.01ms","description":"Browser-safe effectively-zero reduced-motion duration","group":"duration"},{"name":"--ss-motion-stagger","value":"55ms","fast":"20ms","calm":"95ms","description":"Stagger step for lists/grids (cap the count)","group":"duration"}]}