.cb-layout{display:grid;grid-template-columns:260px 1fr;grid-template-rows:auto 1fr;min-height:100vh;background:var(--ds-background);color:var(--ds-foreground);--color-bg-primary:#fff;--color-bg-secondary:#f8fafc;--color-bg-card:#fff;--color-bg-hover:rgba(0,0,0,.04);--bg-color:#fff;--card-bg:#fff;--input-bg:#fff;--color-text-primary:#111827;--color-text-secondary:#6b7280;--color-text-muted:#9ca3af;--color-border:#e5e7eb;--border-color:#e5e7eb}:root[data-theme=dark] .cb-layout{--color-bg-primary:#0f0f1a;--color-bg-secondary:#111118;--color-bg-card:#1a1a2e;--color-bg-hover:hsla(0,0%,100%,.05);--bg-color:#0f0f1a;--card-bg:#1a1a2e;--input-bg:#0f0f1a;--color-text-primary:#f5f5f5;--color-text-secondary:#a0a0b0;--color-text-muted:#6b7280;--color-border:#2a2a4a;--border-color:#2a2a4a}.cb-layout--with-assistant{grid-template-columns:260px 1fr 320px}.cb-header{grid-column:2/-1;display:flex;align-items:center;justify-content:space-between;padding:var(--ds-space-3) var(--ds-space-6);border-bottom:1px solid var(--ds-border);background:var(--ds-background)}.cb-header__left,.cb-header__right{display:flex;align-items:center;gap:var(--ds-space-3)}.cb-breadcrumb{gap:var(--ds-space-1)}.cb-breadcrumb__segment{display:flex;align-items:center;gap:var(--ds-space-1)}.cb-breadcrumb__separator{padding:0 var(--ds-space-1)}.cb-breadcrumb__link{color:var(--ds-muted-foreground);text-decoration:none;transition:color .15s}.cb-breadcrumb__current,.cb-breadcrumb__link:hover{color:var(--ds-foreground)}.cb-breadcrumb__current{font-weight:var(--ds-weight-medium)}.cb-header__title{display:flex;align-items:center;gap:var(--ds-space-3);font-size:var(--ds-font-base);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground)}.cb-header__logo{width:28px;height:28px;border-radius:var(--ds-radius-md);background:linear-gradient(135deg,var(--ds-gradient-from),var(--ds-gradient-to));display:flex;align-items:center;justify-content:center;font-size:var(--ds-font-xs);font-weight:var(--ds-weight-bold);color:var(--ds-primary-foreground)}.cb-header__version{font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);background:var(--ds-muted);padding:var(--ds-space-1) var(--ds-space-2);border-radius:var(--ds-radius-full)}.cb-header__actions{display:flex;align-items:center;gap:var(--ds-space-2)}.cb-view-toggle{display:flex;background:var(--ds-muted);border-radius:var(--ds-radius-md);overflow:hidden;border:1px solid var(--ds-border)}.cb-view-toggle__btn{padding:var(--ds-space-1) var(--ds-space-3);font-size:var(--ds-font-xs);font-weight:var(--ds-weight-medium);color:var(--ds-muted-foreground);background:transparent;border:none;cursor:pointer;transition:all .2s}.cb-view-toggle__btn:hover{color:var(--ds-foreground)}.cb-view-toggle__btn--active{background:var(--ds-primary);color:var(--ds-primary-foreground)}.cb-theme-toggle{display:flex;gap:var(--ds-space-1);padding:var(--ds-space-1);background:var(--ds-muted);border-radius:var(--ds-radius-md);border:1px solid var(--ds-border)}.cb-theme-toggle__btn{width:28px;height:28px;border-radius:var(--ds-radius-sm);border:none;background:transparent;color:var(--ds-muted-foreground);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:var(--ds-font-sm);transition:all .2s}.cb-theme-toggle__btn:hover{color:var(--ds-foreground)}.cb-theme-toggle__btn--active{background:var(--ds-card);color:var(--ds-foreground)}.cb-layout__sidebar{grid-row:1/-1}.cb-layout__main{grid-row:2/-1;overflow-y:auto}.cb-layout__header{grid-column:2/-1}.cb-layout__content{padding:var(--ds-space-8)}.cb-main{grid-row:2/-1;overflow-y:auto;padding:var(--ds-space-6)}.cb-footer,.cb-main{background:var(--ds-background)}.cb-footer{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:var(--ds-space-2) var(--ds-space-6);font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);border-top:1px solid var(--ds-border)}.cb-sidebar-overlay{display:none}@media (max-width:768px){.cb-sidebar-overlay{display:block;position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.4)}}.cb-mobile-menu{display:none;background:none;border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);padding:var(--ds-space-1) var(--ds-space-2);font-size:var(--ds-font-base);color:var(--ds-muted-foreground);cursor:pointer;line-height:1}.cb-mobile-menu:hover{color:var(--ds-foreground);background:var(--ds-muted)}.cb-header__theme-indicator{display:flex;align-items:center;gap:var(--ds-space-2);font-size:var(--ds-font-sm);color:var(--ds-muted-foreground)}.cb-header__theme-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.cb-header__theme-dot--ring{width:8px;height:8px;background:transparent;border:2px solid}.cb-header__theme-label{font-weight:var(--ds-weight-medium);color:var(--ds-foreground);white-space:nowrap}.cb-header__theme-trigger{display:flex;align-items:center;gap:6px;background:none;border:1px solid var(--ds-border);border-radius:var(--ds-radius-md,.5rem);padding:4px 10px;cursor:pointer;color:var(--ds-foreground);font-size:.8125rem;font-family:inherit;transition:background .15s,border-color .15s}.cb-header__theme-trigger:hover{background:color-mix(in srgb,var(--ds-primary) 6%,transparent);border-color:var(--ds-primary)}.cb-header__theme-menu{position:absolute;top:calc(100% + 6px);inset-inline-end:0;min-width:200px;background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-md,.5rem);box-shadow:0 8px 24px rgba(0,0,0,.12);z-index:99999;padding:4px;display:flex;flex-direction:column;gap:2px}.cb-header__theme-option{display:flex;align-items:center;gap:8px;width:100%;padding:7px 10px;background:none;border:none;border-radius:calc(var(--ds-radius-md, .5rem) - 2px);cursor:pointer;color:var(--ds-foreground);font-size:.8125rem;font-family:inherit;text-align:start;transition:background .1s}.cb-header__theme-option:hover{background:color-mix(in srgb,var(--ds-primary) 8%,transparent)}.cb-header__theme-option--active{background:color-mix(in srgb,var(--ds-primary) 12%,transparent);color:var(--ds-primary);font-weight:500}.cb-header__theme-option-badge{-webkit-margin-start:auto;margin-inline-start:auto;font-size:.6875rem;color:var(--ds-muted-foreground);text-transform:uppercase;letter-spacing:.05em}.cb-header__theme-toggle{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:none;border:1px solid var(--ds-border);border-radius:var(--ds-radius-md,.5rem);cursor:pointer;color:var(--ds-foreground);transition:background .15s,border-color .15s;flex-shrink:0}.cb-header__theme-toggle:hover{background:color-mix(in srgb,var(--ds-primary) 8%,transparent);border-color:var(--ds-primary)}.cb-theme-switcher{position:relative}.cb-theme-switcher__trigger{display:flex;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-1) var(--ds-space-3);background:var(--ds-muted);border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);cursor:pointer;font-size:var(--ds-font-sm);color:var(--ds-foreground);transition:border-color .2s}.cb-theme-switcher__trigger:hover{border-color:var(--ds-ring)}.cb-theme-switcher__swatch{width:14px;height:14px;border-radius:var(--ds-radius-full);border:1px solid var(--ds-border);flex-shrink:0}.cb-theme-switcher__label{white-space:nowrap}.cb-theme-switcher__chevron{font-size:var(--ds-font-xs);color:var(--ds-muted-foreground)}.cb-theme-switcher__dropdown{position:absolute;top:calc(100% + 4px);inset-inline-end:0;z-index:50;min-width:200px;background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);box-shadow:0 8px 24px rgba(0,0,0,.12);padding:var(--ds-space-1) var(--ds-space-0);list-style:none;margin:0}.cb-theme-switcher__option{display:flex;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-2) var(--ds-space-3);font-size:var(--ds-font-sm);color:var(--ds-card-foreground);cursor:pointer;transition:background .15s}.cb-theme-switcher__option:hover{background:var(--ds-muted)}.cb-theme-switcher__option--active{color:var(--ds-primary);background:var(--ds-accent);font-weight:var(--ds-weight-medium)}.cb-theme-switcher__option-swatch{width:12px;height:12px;border-radius:var(--ds-radius-full);border:1px solid var(--ds-border);flex-shrink:0}.cb-theme-switcher__option-label{flex:1 1}.cb-theme-switcher__divider{height:1px;background:var(--ds-border);margin:var(--ds-space-1) var(--ds-space-2)}.cb-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ds-space-12);text-align:center;color:var(--ds-muted-foreground)}.cb-empty__icon{font-size:var(--ds-font-3xl);margin-bottom:var(--ds-space-3);opacity:.5}.cb-empty__text{font-size:var(--ds-font-sm)}.cb-skin-switcher{position:relative;flex-shrink:0}.cb-skin-switcher__trigger{display:flex;align-items:center;gap:6px;background:none;border:1px solid var(--ds-border);border-radius:var(--ds-radius-md,.5rem);padding:4px 10px;cursor:pointer;color:var(--ds-foreground);font-size:.8125rem;font-family:inherit;transition:background .15s,border-color .15s}.cb-skin-switcher__trigger:hover{background:color-mix(in srgb,var(--ds-primary) 6%,transparent);border-color:var(--ds-primary)}.cb-skin-switcher__label{font-weight:var(--ds-weight-medium);white-space:nowrap}.cb-skin-switcher__chevron{font-size:.625rem;opacity:.6}.cb-skin-switcher__dropdown{position:absolute;top:calc(100% + 6px);inset-inline-end:0;min-width:220px;background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-md,.5rem);box-shadow:var(--ds-shadow-lg);z-index:99999;padding:4px;display:flex;flex-direction:column;gap:2px}.cb-skin-switcher__option{display:flex;flex-direction:column;gap:2px;padding:8px 10px;background:none;border:none;border-radius:calc(var(--ds-radius-md, .5rem) - 2px);cursor:pointer;font-family:inherit;text-align:start;transition:background .1s}.cb-skin-switcher__option:hover{background:color-mix(in srgb,var(--ds-primary) 8%,transparent)}.cb-skin-switcher__option--active{background:color-mix(in srgb,var(--ds-primary) 12%,transparent)}.cb-skin-switcher__option--active .cb-skin-switcher__option-label{color:var(--ds-primary);font-weight:var(--ds-weight-semibold,600)}.cb-skin-switcher__option-label{font-size:.8125rem;font-weight:var(--ds-weight-medium,500);color:var(--ds-foreground)}.cb-skin-switcher__option-desc{font-size:.6875rem;color:var(--ds-muted-foreground)}.cb-sidebar{grid-row:1/-1;-webkit-border-end:1px solid var(--ds-border);border-inline-end:1px solid var(--ds-border);background:var(--ds-background);overflow:hidden;padding:0;display:flex;flex-direction:column;height:100%}.cb-sidebar__brand{display:flex;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-4) var(--ds-space-4)}.cb-sidebar__brand-logo{width:28px;height:28px;border-radius:var(--ds-radius-md);background:var(--ds-primary);display:flex;align-items:center;justify-content:center;color:var(--ds-primary-foreground);flex-shrink:0}.cb-sidebar__brand-name{font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground)}.cb-sidebar__search{padding:0 var(--ds-space-3) var(--ds-space-3)}.cb-sidebar__search-wrapper{position:relative}.cb-sidebar__search-input{width:100%;padding:var(--ds-space-2) var(--ds-space-3);-webkit-padding-start:var(--ds-space-8);padding-inline-start:var(--ds-space-8);font-size:var(--ds-font-sm);background:var(--ds-muted);border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);color:var(--ds-foreground);outline:none;transition:border-color .2s}.cb-sidebar__search-input::placeholder{color:var(--ds-muted-foreground)}.cb-sidebar__search-input:focus{border-color:var(--ds-ring)}.cb-sidebar__search-icon{position:absolute;inset-inline-start:var(--ds-space-3);top:50%;transform:translateY(-50%);color:var(--ds-muted-foreground);pointer-events:none}.cb-sidebar__section-label{padding:var(--ds-space-2) var(--ds-space-4);font-size:.6875rem;font-weight:var(--ds-weight-semibold);color:var(--ds-muted-foreground);text-transform:uppercase;letter-spacing:.04em}.cb-sidebar__item--overview{-webkit-padding-start:var(--ds-space-4);padding-inline-start:var(--ds-space-4);gap:var(--ds-space-2)}.cb-sidebar__nav{flex:1 1;overflow-y:auto;padding-bottom:var(--ds-space-3)}.cb-sidebar__group{margin-bottom:var(--ds-space-1)}.cb-sidebar__group-header{display:flex;align-items:center;gap:var(--ds-space-2);width:100%;padding:var(--ds-space-2) var(--ds-space-4);font-size:.6875rem;font-weight:var(--ds-weight-semibold);color:var(--ds-muted-foreground);text-transform:uppercase;letter-spacing:.04em;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;background:none;border:none;text-align:start;transition:background .15s}.cb-sidebar__group-header:hover{background:var(--ds-muted)}.cb-sidebar__group-icon{display:flex;align-items:center;color:var(--ds-muted-foreground);flex-shrink:0}.cb-sidebar__group-label{flex:1 1}.cb-sidebar__group-chevron{transition:transform .2s;color:var(--ds-muted-foreground);flex-shrink:0}.cb-sidebar__group--collapsed .cb-sidebar__group-chevron{transform:rotate(-90deg)}.cb-sidebar__group--collapsed .cb-sidebar__group-items{display:none}.cb-sidebar__subgroup-label{display:flex;align-items:center;gap:var(--ds-space-1);width:100%;padding:var(--ds-space-2) var(--ds-space-3) var(--ds-space-1);margin-top:var(--ds-space-2);font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ds-muted-foreground);opacity:.7;background:none;border:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;text-align:start;border-radius:var(--ds-radius-sm);transition:background .15s,opacity .15s}.cb-sidebar__subgroup-label:hover{background:var(--ds-muted);opacity:1}.cb-sidebar__subgroup-label:active{opacity:.8}.cb-sidebar__subgroup-label-text{flex:1 1}.cb-sidebar__subgroup-chevron{flex-shrink:0;transition:transform .2s;color:var(--ds-muted-foreground)}.cb-sidebar__subgroup-label--collapsed .cb-sidebar__subgroup-chevron{transform:rotate(-90deg)}.cb-sidebar__group-count{font-size:.6875rem;color:var(--ds-muted-foreground);background:var(--ds-muted);padding:1px 6px;border-radius:var(--ds-radius-full);font-weight:var(--ds-weight-medium);line-height:1.4}.cb-sidebar__item{display:flex;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-2) var(--ds-space-3) var(--ds-space-2) var(--ds-space-4);font-size:var(--ds-font-sm);color:var(--ds-muted-foreground);text-decoration:none;cursor:pointer;transition:all .15s;-webkit-border-start:2px solid transparent;border-inline-start:2px solid transparent}.cb-sidebar__item-label{flex:1 1}.cb-sidebar__item:hover{color:var(--ds-foreground);background:var(--ds-muted)}.cb-sidebar__item--active{color:var(--ds-primary);background:var(--ds-accent);border-inline-start-color:var(--ds-primary);font-weight:var(--ds-weight-medium)}.cb-sidebar__item-badge{-webkit-margin-start:auto;margin-inline-start:auto;font-size:.625rem;padding:1px 5px;border-radius:var(--ds-radius-full);font-weight:var(--ds-weight-semibold)}.cb-sidebar__item-badge--stable{background:var(--ds-accent);color:var(--ds-accent-foreground)}.cb-sidebar__item-badge--beta{background:var(--ds-secondary);color:var(--ds-secondary-foreground)}.cb-sidebar__footer{flex-shrink:0;padding:var(--ds-space-3) var(--ds-space-4);border-top:1px solid var(--ds-border)}.cb-sidebar__theme-indicator{display:flex;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-2) 0;border-radius:var(--ds-radius-md);transition:background .15s}.cb-sidebar__theme-indicator:hover{background:var(--ds-muted)}.cb-sidebar__theme-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.cb-sidebar__theme-name{font-size:var(--ds-font-sm);font-weight:var(--ds-weight-medium);color:var(--ds-foreground)}.cb-sidebar__theme-chevron{color:var(--ds-muted-foreground);flex-shrink:0}.cb-sidebar__theme-dropdown{list-style:none;margin:var(--ds-space-2) 0 0 0;padding:var(--ds-space-1) 0;background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);box-shadow:0 4px 12px rgba(0,0,0,.08);max-height:200px;overflow-y:auto}.cb-sidebar__theme-option{display:flex;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-2) var(--ds-space-3);font-size:var(--ds-font-sm);color:var(--ds-card-foreground);cursor:pointer;transition:background .15s}.cb-sidebar__theme-option:hover{background:var(--ds-muted)}.cb-sidebar__theme-option--active{color:var(--ds-primary);background:var(--ds-accent);font-weight:var(--ds-weight-medium)}.cb-sidebar__theme-option-dot{width:10px;height:10px;border-radius:50%;border:1px solid var(--ds-border);flex-shrink:0}.cb-sidebar__version{font-size:.6875rem;color:var(--ds-muted-foreground);padding-top:var(--ds-space-1)}.cb-content{max-width:960px;margin:var(--ds-space-0) auto}.cb-content__section{margin-bottom:var(--ds-space-6)}.cb-content__heading{font-size:var(--ds-font-xl);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground);margin-bottom:var(--ds-space-2)}.cb-content__description{font-size:var(--ds-font-sm);color:var(--ds-muted-foreground);line-height:1.6}.cb-component-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--ds-space-8)}.cb-component-header__title{font-size:var(--ds-font-3xl);font-weight:var(--ds-weight-bold);color:var(--ds-foreground);margin-bottom:var(--ds-space-1)}.cb-component-header__subtitle{font-size:var(--ds-font-sm);color:var(--ds-muted-foreground)}.cb-component-header__badge{font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);padding:var(--ds-space-1) var(--ds-space-3);border-radius:var(--ds-radius-full);background:var(--ds-accent);color:var(--ds-accent-foreground)}.cb-component-page{max-width:960px}.cb-component-page .ui-button--primary,.cb-main .ui-button--primary{background:var(--ds-primary);color:var(--ds-primary-foreground)}.cb-component-page .ui-button--primary:hover:not(:disabled){opacity:.9}.cb-component-page .ui-button--secondary,.cb-main .ui-button--secondary{background:var(--ds-secondary);color:var(--ds-secondary-foreground);border:1px solid var(--ds-border)}.cb-component-page .ui-button--ghost,.cb-main .ui-button--ghost{background:transparent;color:var(--ds-foreground)}.cb-component-page .ui-button--ghost:hover:not(:disabled){background:var(--ds-muted)}.cb-component-page .ui-button--danger,.cb-main .ui-button--danger{background:var(--ds-destructive);color:var(--ds-destructive-foreground)}.cb-component-page__header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--ds-space-8)}.cb-component-page__header-info{flex:1 1}.cb-component-page__title{font-size:var(--ds-font-3xl);font-weight:var(--ds-weight-bold);color:var(--ds-foreground);margin:0 0 var(--ds-space-1) 0}.cb-component-page__subtitle{font-size:var(--ds-font-sm);color:var(--ds-muted-foreground);margin:0}.cb-component-page__header-meta{display:flex;align-items:center;gap:var(--ds-space-2);flex-shrink:0}.cb-component-page__badge{font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);padding:var(--ds-space-1) var(--ds-space-3);border-radius:var(--ds-radius-full);white-space:nowrap}.cb-component-page__badge--stable{background:var(--ds-accent);color:var(--ds-accent-foreground)}.cb-component-page__badge--beta{background:var(--ds-secondary);color:var(--ds-secondary-foreground)}.cb-component-page__tags{display:flex;gap:var(--ds-space-1)}.cb-component-page__tag{font-size:.6875rem;padding:2px var(--ds-space-2);background:var(--ds-muted);color:var(--ds-muted-foreground);border-radius:var(--ds-radius-sm)}.cb-breadcrumb{display:flex;align-items:center;gap:var(--ds-space-2);margin-bottom:var(--ds-space-4);font-size:var(--ds-font-sm)}.cb-breadcrumb__item{color:var(--ds-muted-foreground);text-decoration:none;transition:color .2s}.cb-breadcrumb__item:hover{color:var(--ds-foreground)}.cb-breadcrumb__item--active{color:var(--ds-foreground);font-weight:var(--ds-weight-medium)}.cb-breadcrumb__separator{color:var(--ds-muted-foreground);font-size:var(--ds-font-xs)}.cb-collapsible{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);overflow:hidden}.cb-collapsible__header{display:flex;align-items:center;justify-content:space-between;padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border);font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:background .2s}.cb-collapsible__header:hover{background:var(--ds-muted)}.cb-collapsible__header:before{content:"";display:inline-block;width:3px;height:14px;background:var(--ds-primary);border-radius:2px;-webkit-margin-end:var(--ds-space-2);margin-inline-end:var(--ds-space-2)}.cb-collapsible__body{padding:var(--ds-space-4)}.cb-collapsible--collapsed .cb-collapsible__body{display:none}.cb-section{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);overflow:hidden}.cb-section--variants{overflow:visible}.cb-section__header{display:flex;align-items:center;gap:var(--ds-space-2);width:100%;padding:var(--ds-space-3) var(--ds-space-4);border:none;border-bottom:1px solid var(--ds-border);background:transparent;font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:background .2s;text-align:start}.cb-section__header:hover{background:var(--ds-muted)}.cb-section__chevron{display:inline-block;font-size:.625rem;transition:transform .2s ease;color:var(--ds-muted-foreground)}.cb-section__chevron--collapsed{transform:rotate(-90deg)}.cb-section__title{flex:1 1}.cb-section__badge{font-size:var(--ds-font-xs);padding:var(--ds-space-0) var(--ds-space-2);background:var(--ds-accent);color:var(--ds-accent-foreground);border-radius:var(--ds-radius-full);font-weight:var(--ds-weight-medium)}.cb-section__description{display:block;padding:var(--ds-space-2) var(--ds-space-4);font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);border-bottom:1px solid var(--ds-border)}.cb-section--collapsed .cb-section__description{display:none}.cb-section__content{padding:var(--ds-space-4)}.cb-section--collapsed .cb-section__header{border-bottom:none}.cb-usage-block{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);overflow:hidden;position:relative}.cb-usage-block__header{display:flex;align-items:center;padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border);font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground)}.cb-usage-block__header:before{content:"";display:inline-block;width:3px;height:14px;background:var(--ds-primary);border-radius:2px;-webkit-margin-end:var(--ds-space-2);margin-inline-end:var(--ds-space-2)}.cb-usage-block__code{padding:var(--ds-space-4);font-family:SF Mono,Fira Code,monospace;font-size:var(--ds-font-sm);line-height:1.6;color:var(--ds-card-foreground);overflow-x:auto;white-space:pre}.cb-usage-block__copy{position:absolute;top:var(--ds-space-3);inset-inline-end:var(--ds-space-3);padding:var(--ds-space-1) var(--ds-space-2);font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);background:var(--ds-muted);border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);cursor:pointer;transition:all .2s}.cb-usage-block__copy:hover{color:var(--ds-foreground);border-color:var(--ds-ring)}.cb-usage{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);overflow:hidden}.cb-usage__header{display:flex;align-items:center;padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border);font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground)}.cb-usage__header:before{content:"";display:inline-block;width:3px;height:14px;background:var(--ds-primary);border-radius:2px;-webkit-margin-end:var(--ds-space-2);margin-inline-end:var(--ds-space-2)}.cb-usage__code{padding:var(--ds-space-4);font-family:SF Mono,Fira Code,monospace;font-size:var(--ds-font-sm);line-height:1.6;color:var(--ds-card-foreground);overflow-x:auto;white-space:pre}.cb-usage__code .cb-code-comment{color:var(--ds-muted-foreground)}.cb-usage__code .cb-code-tag{color:var(--ds-chart-1)}.cb-usage__code .cb-code-attr{color:var(--ds-chart-2)}.cb-usage__code .cb-code-string{color:var(--ds-chart-3)}.cb-tokens{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);overflow:hidden}.cb-tokens__header{display:flex;align-items:center;padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border);font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground)}.cb-tokens__header:before{content:"";display:inline-block;width:3px;height:14px;background:var(--ds-primary);border-radius:2px;-webkit-margin-end:var(--ds-space-2);margin-inline-end:var(--ds-space-2)}.cb-tokens__tier{padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border)}.cb-tokens__tier:last-child{border-bottom:none}.cb-tokens__tier-label{font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);text-transform:uppercase;letter-spacing:.04em;color:var(--ds-muted-foreground);margin-bottom:var(--ds-space-2)}.cb-tokens__item{display:flex;align-items:center;gap:var(--ds-space-3);padding:var(--ds-space-1) var(--ds-space-0);font-size:var(--ds-font-xs)}.cb-tokens__item-name{font-family:monospace;color:var(--ds-primary)}.cb-tokens__item-arrow{color:var(--ds-muted-foreground)}.cb-tokens__item-value{color:var(--ds-card-foreground);font-family:monospace}.cb-tokens__item-swatch{width:14px;height:14px;border-radius:var(--ds-radius-sm);border:1px solid var(--ds-border);flex-shrink:0}.cb-tokens__violations{display:flex;align-items:center;gap:var(--ds-space-1);padding:var(--ds-space-2) var(--ds-space-4);font-size:var(--ds-font-xs);border-top:1px solid var(--ds-border)}.cb-tokens__violations--clean{color:var(--ds-accent-foreground)}.cb-tokens__violations--dirty{color:var(--ds-destructive)}.cb-level-meta{display:flex;align-items:center;gap:var(--ds-space-5);padding:var(--ds-space-3) var(--ds-space-4);background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);font-size:var(--ds-font-sm)}.cb-level-meta__item{display:flex;align-items:center;gap:var(--ds-space-1);color:var(--ds-card-foreground)}.cb-level-meta__label{color:var(--ds-muted-foreground)}.cb-level-meta__value{font-weight:var(--ds-weight-semibold);color:var(--ds-foreground)}.cb-level-meta__divider{width:1px;height:16px;background:var(--ds-border)}.cb-component-page__foundation-message{padding:var(--ds-space-6);text-align:center}.cb-component-page__foundation-message h1{font-size:var(--ds-font-2xl);font-weight:var(--ds-weight-bold);color:var(--ds-foreground);margin:0 0 var(--ds-space-2) 0}.cb-component-page__foundation-message p{font-size:var(--ds-font-sm);color:var(--ds-muted-foreground)}.cb-component-page__foundation-message a{color:var(--ds-primary);text-decoration:underline;text-underline-offset:2px}.cb-props-table{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);overflow:hidden}.cb-props-table__header{display:flex;align-items:center;padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border);font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground)}.cb-props-table__header:before{content:"";display:inline-block;width:3px;height:14px;background:var(--ds-primary);border-radius:2px;-webkit-margin-end:var(--ds-space-2);margin-inline-end:var(--ds-space-2)}.cb-props-table__table{width:100%;border-collapse:collapse}.cb-props-table__table th{text-align:start;padding:var(--ds-space-3) var(--ds-space-4);font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);text-transform:uppercase;letter-spacing:.04em;color:var(--ds-muted-foreground)}.cb-props-table__row,.cb-props-table__table th{border-bottom:1px solid var(--ds-border)}.cb-props-table__row:last-child{border-bottom:none}.cb-props-table__cell{padding:var(--ds-space-3) var(--ds-space-4);font-size:var(--ds-font-sm);color:var(--ds-card-foreground)}.cb-props-table__cell--name{color:var(--ds-primary);font-family:monospace;font-size:var(--ds-font-sm)}.cb-props-table__cell--type{display:inline-block;padding:var(--ds-space-1) var(--ds-space-2);background:var(--ds-muted);border-radius:var(--ds-radius-sm);font-family:monospace;font-size:var(--ds-font-xs);color:var(--ds-muted-foreground)}.cb-props{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);overflow:hidden}.cb-props__header{display:flex;align-items:center;padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border);font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground)}.cb-props__header:before{content:"";display:inline-block;width:3px;height:14px;background:var(--ds-primary);border-radius:2px;-webkit-margin-end:var(--ds-space-2);margin-inline-end:var(--ds-space-2)}.cb-props__table{width:100%;border-collapse:collapse}.cb-props__table th{text-align:start;font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);text-transform:uppercase;letter-spacing:.04em;color:var(--ds-muted-foreground)}.cb-props__table td,.cb-props__table th{padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border)}.cb-props__table td{font-size:var(--ds-font-sm);color:var(--ds-card-foreground)}.cb-props__table tr:last-child td{border-bottom:none}.cb-props__name{color:var(--ds-primary);font-family:monospace;font-size:var(--ds-font-sm)}.cb-props__type{display:inline-block;padding:var(--ds-space-1) var(--ds-space-2);background:var(--ds-muted);border-radius:var(--ds-radius-sm);font-family:monospace;font-size:var(--ds-font-xs);color:var(--ds-muted-foreground)}.cb-props__control{min-width:120px}.cb-control-input,.cb-control-select,.cb-props__control input[type=number],.cb-props__control input[type=text],.cb-props__control select{padding:var(--ds-space-1) var(--ds-space-2);font-size:var(--ds-font-xs);background:var(--ds-muted);border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);color:var(--ds-foreground);outline:none;transition:border-color .2s}.cb-control-input:focus,.cb-control-select:focus,.cb-props__control input[type=number]:focus,.cb-props__control input[type=text]:focus,.cb-props__control select:focus{border-color:var(--ds-ring)}.cb-control-checkbox,.cb-props__control input[type=checkbox]{accent-color:var(--ds-primary)}.cb-radio__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-radio{display:inline-flex;align-items:center;gap:var(--ds-space-2);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-size:var(--ds-font-sm);color:var(--ds-foreground);position:relative}.cb-radio--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.cb-radio__dot{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:1rem;height:1rem;border-radius:var(--ds-radius-full);border:2px solid var(--ds-muted-foreground,#6b7280);background:var(--ds-card,transparent);transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}.cb-radio__dot:after{content:"";display:block;width:.375rem;height:.375rem;border-radius:var(--ds-radius-full);background:transparent;transition:background .15s ease,transform .15s ease;transform:scale(0)}.cb-radio--checked .cb-radio__dot{border-color:var(--ds-primary);background:var(--ds-card,transparent)}.cb-radio--checked .cb-radio__dot:after{background:var(--ds-primary);transform:scale(1)}.cb-radio:focus-within .cb-radio__dot{box-shadow:0 0 0 3px var(--ds-ring,rgba(102,126,234,.3))}.cb-radio:not(.cb-radio--disabled):hover .cb-radio__dot{border-color:var(--ds-primary)}.cb-radio__label{line-height:1.4}.cb-radio-group{display:flex;gap:var(--ds-space-3)}.cb-radio-group--vertical{flex-direction:column}.cb-radio-group--horizontal{flex-direction:row;flex-wrap:wrap}.cb-checkbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-checkbox{display:inline-flex;align-items:center;gap:var(--ds-space-2);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-size:var(--ds-font-sm);color:var(--ds-foreground);position:relative}.cb-checkbox--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.cb-checkbox__box{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:var(--ds-radius-sm);border:2px solid var(--ds-muted-foreground,#6b7280);background:var(--ds-card,transparent);transition:border-color .15s ease,background .15s ease,box-shadow .15s ease;color:var(--ds-primary-foreground,#fff)}.cb-checkbox--sm .cb-checkbox__box{width:1rem;height:1rem}.cb-checkbox--md .cb-checkbox__box{width:1.125rem;height:1.125rem}.cb-checkbox--lg .cb-checkbox__box{width:1.375rem;height:1.375rem}.cb-checkbox--checked .cb-checkbox__box,.cb-checkbox--indeterminate .cb-checkbox__box{border-color:var(--ds-primary);background:var(--ds-primary)}.cb-checkbox:focus-within .cb-checkbox__box{box-shadow:0 0 0 3px var(--ds-ring,rgba(102,126,234,.3))}.cb-checkbox:not(.cb-checkbox--disabled):hover .cb-checkbox__box{border-color:var(--ds-primary)}.cb-checkbox__icon{display:block;color:var(--ds-primary-foreground,#fff)}.cb-checkbox--sm .cb-checkbox__icon{width:.625rem;height:.625rem}.cb-checkbox--md .cb-checkbox__icon{width:.75rem;height:.75rem}.cb-checkbox--lg .cb-checkbox__icon{width:.875rem;height:.875rem}.cb-checkbox__label{line-height:1.4}.ui-tooltip-wrapper{position:relative;display:inline-block}.ui-tooltip{position:absolute;z-index:var(--global-z-tooltip,9999);background:var(--ds-foreground,#0f0f1a);color:var(--ds-background,#fff);font-size:var(--ds-font-xs,.75rem);line-height:1.4;padding:.375rem .625rem;border-radius:var(--ds-radius-sm,.25rem);white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,.15);pointer-events:none;animation:ui-tooltip-in .12s ease}@keyframes ui-tooltip-in{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.ui-tooltip:after{content:"";position:absolute;border:5px solid transparent}.ui-tooltip-wrapper--top .ui-tooltip{bottom:calc(100% + 8px);inset-inline-start:50%;transform:translateX(-50%)}.ui-tooltip-wrapper--top .ui-tooltip:after{top:100%;inset-inline-start:50%;transform:translateX(-50%);border-top-color:var(--ds-foreground,#0f0f1a)}.ui-tooltip-wrapper--bottom .ui-tooltip{top:calc(100% + 8px);inset-inline-start:50%;transform:translateX(-50%)}.ui-tooltip-wrapper--bottom .ui-tooltip:after{bottom:100%;inset-inline-start:50%;transform:translateX(-50%);border-bottom-color:var(--ds-foreground,#0f0f1a)}.ui-tooltip-wrapper--left .ui-tooltip{inset-inline-end:calc(100% + 8px);top:50%;transform:translateY(-50%)}.ui-tooltip-wrapper--left .ui-tooltip:after{inset-inline-start:100%;top:50%;transform:translateY(-50%);border-inline-start-color:var(--ds-foreground,#0f0f1a)}.ui-tooltip-wrapper--right .ui-tooltip{inset-inline-start:calc(100% + 8px);top:50%;transform:translateY(-50%)}.ui-tooltip-wrapper--right .ui-tooltip:after{inset-inline-end:100%;top:50%;transform:translateY(-50%);border-inline-end-color:var(--ds-foreground,#0f0f1a)}.cb-preview{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);overflow:visible}.cb-preview__header{display:flex;align-items:center;justify-content:space-between;padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border);font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground)}.cb-preview__header:before{content:"";display:inline-block;width:3px;height:14px;background:var(--ds-primary);border-radius:2px;-webkit-margin-end:var(--ds-space-2);margin-inline-end:var(--ds-space-2)}.cb-preview__canvas{display:flex;align-items:center;justify-content:center;min-height:200px;padding:var(--ds-space-8);background-color:var(--ds-card);background-image:radial-gradient(circle,var(--ds-border) 1px,transparent 1px);background-size:20px 20px}.cb-preview__canvas--padded{padding:var(--ds-space-12)}.cb-preview__toolbar{display:flex;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-2) var(--ds-space-4);border-top:1px solid var(--ds-border);background:var(--ds-background)}.cb-preview__toolbar-btn{padding:var(--ds-space-1) var(--ds-space-2);font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);background:transparent;border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);cursor:pointer;transition:all .2s}.cb-preview__toolbar-btn:hover{color:var(--ds-foreground);border-color:var(--ds-ring)}.cb-preview__toolbar-btn--active{color:var(--ds-primary);border-color:var(--ds-primary);background:var(--ds-accent)}.cb-preview__actions{display:flex;align-items:center;gap:var(--ds-space-2)}.cb-preview__action-btn{padding:var(--ds-space-1) var(--ds-space-2);font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);background:transparent;border:none;border-radius:var(--ds-radius-sm);cursor:pointer;transition:all .2s}.cb-preview__action-btn:hover{color:var(--ds-foreground);background:var(--ds-muted)}.cb-playground{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);margin-bottom:var(--ds-space-6);overflow:visible}.cb-playground--fullscreen{position:fixed;inset:0;z-index:9999;border-radius:0;margin:0;display:flex;flex-direction:column;overflow:auto}.cb-playground--fullscreen .cb-playground__canvas{flex:1 1;min-height:0}.cb-playground__header{display:flex;align-items:center;justify-content:space-between;padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border);font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground);gap:var(--ds-space-3)}.cb-playground__header:before{content:"";display:inline-block;width:3px;height:14px;background:var(--ds-primary);border-radius:2px;-webkit-margin-end:var(--ds-space-2);margin-inline-end:var(--ds-space-2);flex-shrink:0}.cb-playground__title{flex:1 1;min-width:0}.cb-playground__header-actions{display:flex;align-items:center;gap:var(--ds-space-2);flex-shrink:0}.cb-playground__story-tabs{display:flex;align-items:center;gap:6px;padding:var(--ds-space-2) var(--ds-space-4);border-bottom:1px solid var(--ds-border);background:var(--ds-background);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.cb-playground__story-tabs::-webkit-scrollbar{display:none}.cb-playground__story-tab{display:inline-flex;align-items:center;padding:3px 12px;font-size:var(--ds-font-xs);font-weight:var(--ds-weight-medium);color:var(--ds-muted-foreground);background:transparent;border:1px solid var(--ds-border);border-radius:9999px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:color .15s,background .15s,border-color .15s;line-height:1.5}.cb-playground__story-tab:hover{color:var(--ds-foreground);border-color:var(--ds-ring);background:var(--ds-muted)}.cb-playground__story-tab--active,.cb-playground__story-tab--active:hover{color:var(--ds-primary-foreground,#fff);background:var(--ds-primary);border-color:var(--ds-primary)}.cb-playground__viewport-group{display:flex;border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);overflow:hidden}.cb-playground__viewport-btn{padding:3px 8px;font-size:10px;font-family:monospace;font-weight:var(--ds-weight-medium);color:var(--ds-muted-foreground);background:transparent;border:none;-webkit-border-end:1px solid var(--ds-border);border-inline-end:1px solid var(--ds-border);cursor:pointer;transition:color .15s,background .15s;white-space:nowrap}.cb-playground__viewport-btn:last-child{-webkit-border-end:none;border-inline-end:none}.cb-playground__viewport-btn:hover{color:var(--ds-foreground);background:var(--ds-muted)}.cb-playground__viewport-btn--active{color:var(--ds-primary);background:color-mix(in srgb,var(--ds-primary) 10%,transparent)}.cb-playground__viewport-btn--active:hover{color:var(--ds-primary);background:color-mix(in srgb,var(--ds-primary) 15%,transparent)}.cb-playground__canvas{display:flex;align-items:center;justify-content:center;min-height:200px;padding:var(--ds-space-8);background-color:var(--ds-card);background-image:radial-gradient(circle,var(--ds-border) 1px,transparent 1px);background-size:20px 20px;transition:background .2s,max-width .3s;box-sizing:border-box;overflow:visible}.cb-playground--bg-white{background-color:var(--ds-background,#fff);background-image:none}.cb-playground--bg-dark{background-color:var(--ds-foreground,#111827);background-image:none}.cb-playground--bg-grid{background-color:var(--ds-card);background-image:linear-gradient(to right,var(--ds-border) 1px,transparent 1px),linear-gradient(to bottom,var(--ds-border) 1px,transparent 1px);background-size:24px 24px}.cb-playground__toolbar-btn{padding:var(--ds-space-1) var(--ds-space-2);font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);background:transparent;border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);cursor:pointer;transition:all .2s;white-space:nowrap}.cb-playground__toolbar-btn:hover{color:var(--ds-foreground);border-color:var(--ds-ring)}.cb-playground__toolbar-btn--active{color:var(--ds-primary);border-color:var(--ds-primary);background:color-mix(in srgb,var(--ds-primary) 10%,transparent)}.cb-playground__code-view{background:var(--ds-foreground,#1e1e2e);color:var(--ds-background,#cdd6f4);font-family:JetBrains Mono,Fira Code,Cascadia Code,Consolas,monospace;font-size:13px;border-top:1px solid var(--ds-border,#313244);overflow-x:auto}.cb-playground__code-view-header{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;border-bottom:1px solid color-mix(in srgb,var(--ds-background,#cdd6f4) 15%,transparent)}.cb-playground__code-view-label{font-family:inherit;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;opacity:.6}.cb-playground__code-view-header .cb-playground__toolbar-btn{font-size:11px;color:color-mix(in srgb,var(--ds-background,#cdd6f4) 70%,transparent);border-color:color-mix(in srgb,var(--ds-background,#cdd6f4) 25%,transparent);background:transparent}.cb-playground__code-view-header .cb-playground__toolbar-btn:hover{color:var(--ds-background,#cdd6f4);border-color:color-mix(in srgb,var(--ds-background,#cdd6f4) 60%,transparent);background:color-mix(in srgb,var(--ds-background,#cdd6f4) 10%,transparent)}.cb-playground__code-view-header .cb-playground__toolbar-btn--active{color:var(--ds-primary,#89b4fa);border-color:var(--ds-primary,#89b4fa);background:color-mix(in srgb,var(--ds-primary,#89b4fa) 15%,transparent)}.cb-playground__code-view-pre{margin:0;padding:16px;overflow-x:auto;white-space:pre;line-height:1.6;color:inherit;font-family:inherit;font-size:inherit}.cb-playground__code-view-pre code{font-family:inherit;font-size:inherit;color:inherit;background:none;padding:0}.cb-variant-showcase{margin-bottom:var(--ds-space-4)}.cb-variant-showcase__title{font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground);margin:0 0 var(--ds-space-3) 0}.cb-variant-showcase__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-gap:var(--ds-space-4);gap:var(--ds-space-4)}.cb-variant-showcase__item{display:flex;flex-direction:column;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-4);background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);min-height:80px;max-height:300px;overflow-y:auto;overflow-x:hidden;position:static}.cb-variant-showcase__label{font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);font-family:monospace}.cb-size-showcase{margin-bottom:var(--ds-space-4)}.cb-size-showcase__title{font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground);margin:0 0 var(--ds-space-3) 0}.cb-size-showcase__row{display:flex;align-items:flex-end;gap:var(--ds-space-4);flex-wrap:wrap}.cb-size-showcase__item{display:flex;flex-direction:column;align-items:center;gap:var(--ds-space-2)}.cb-size-showcase__label{font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);font-family:monospace}.cb-state-showcase{margin-bottom:var(--ds-space-4)}.cb-state-showcase__title{font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground);margin:0 0 var(--ds-space-3) 0}.cb-state-showcase__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));grid-gap:var(--ds-space-4);gap:var(--ds-space-4)}.cb-state-showcase__item{display:flex;flex-direction:column;align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-4);background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-md)}.cb-state-showcase__label{font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);font-family:monospace}.cb-error-boundary{flex-direction:column;padding:2rem;text-align:center;gap:.5rem;min-height:120px;color:var(--ds-muted-foreground)}.cb-error-boundary,.cb-error-boundary__icon{display:flex;align-items:center;justify-content:center}.cb-error-boundary__icon{width:32px;height:32px;border-radius:50%;background:var(--ds-destructive,#f59e0b);color:#fff;font-weight:700;font-size:1.25rem}.cb-error-boundary__title{font-weight:600;color:var(--ds-foreground);margin:0}.cb-error-boundary__detail{font-family:monospace}.cb-error-boundary__detail,.cb-error-boundary__hint{font-size:.8rem;color:var(--ds-muted-foreground);margin:0}.cb-theme-card{background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);overflow:hidden;transition:all .2s}.cb-theme-card:hover{border-color:var(--ds-ring);transform:translateY(-2px)}.cb-theme-card--active{border-color:var(--ds-primary);box-shadow:0 0 0 2px var(--ds-accent)}.cb-theme-card__header{display:flex;align-items:center;justify-content:space-between;padding:var(--ds-space-3) var(--ds-space-4);border-bottom:1px solid var(--ds-border)}.cb-theme-card__title{font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground)}.cb-theme-card__badge{font-size:var(--ds-font-xs);padding:var(--ds-space-0) var(--ds-space-2);border-radius:var(--ds-radius-full);background:var(--ds-accent);color:var(--ds-accent-foreground);font-weight:var(--ds-weight-medium)}.cb-theme-card__swatch{display:flex;gap:var(--ds-space-1);padding:var(--ds-space-3) var(--ds-space-4)}.cb-theme-card__swatch-color{flex:1 1;height:32px;border-radius:var(--ds-radius-sm)}.cb-theme-card__swatch-color:first-child{border-radius:var(--ds-radius-sm) 0 0 var(--ds-radius-sm)}.cb-theme-card__swatch-color:last-child{border-radius:0 var(--ds-radius-sm) var(--ds-radius-sm) 0}.cb-theme-card__label{padding:var(--ds-space-2) var(--ds-space-4);font-size:var(--ds-font-xs);color:var(--ds-muted-foreground);border-top:1px solid var(--ds-border)}.cb-color-swatch{display:flex;flex-direction:column;border-radius:var(--ds-radius-md);overflow:hidden;border:1px solid var(--ds-border)}.cb-color-swatch__preview{height:64px;transition:transform .2s}.cb-color-swatch__preview:hover{transform:scale(1.02)}.cb-color-swatch__info{padding:var(--ds-space-2) var(--ds-space-3);background:var(--ds-card)}.cb-color-swatch__name{font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);color:var(--ds-card-foreground);margin-bottom:var(--ds-space-1)}.cb-color-swatch__value{font-size:var(--ds-font-xs);font-family:monospace;color:var(--ds-muted-foreground)}.cb-type-specimen{padding:var(--ds-space-4) var(--ds-space-0);border-bottom:1px solid var(--ds-border)}.cb-type-specimen:last-child{border-bottom:none}.cb-type-specimen__label{display:flex;align-items:center;gap:var(--ds-space-3);margin-bottom:var(--ds-space-2);font-family:monospace}.cb-type-specimen__label,.cb-type-specimen__meta{font-size:var(--ds-font-xs);color:var(--ds-muted-foreground)}.cb-type-specimen__meta{background:var(--ds-muted);padding:var(--ds-space-0) var(--ds-space-2);border-radius:var(--ds-radius-sm)}.cb-type-specimen__sample{color:var(--ds-foreground);line-height:1.4}.cb-spacing-demo{display:flex;flex-direction:column;gap:var(--ds-space-3)}.cb-spacing-demo__item{display:flex;align-items:center;gap:var(--ds-space-4)}.cb-spacing-demo__label{min-width:100px;font-size:var(--ds-font-xs);font-family:monospace;color:var(--ds-muted-foreground)}.cb-spacing-demo__bar{height:16px;background:var(--ds-primary);border-radius:var(--ds-radius-sm);opacity:.6;transition:opacity .2s}.cb-spacing-demo__bar:hover{opacity:1}.cb-spacing-demo__value{font-size:var(--ds-font-xs);font-family:monospace;color:var(--ds-muted-foreground)}.cb-radius-demo{display:flex;flex-wrap:wrap;gap:var(--ds-space-4)}.cb-radius-demo__item{display:flex;flex-direction:column;align-items:center;gap:var(--ds-space-2)}.cb-radius-demo__preview{width:64px;height:64px;background:var(--ds-primary);opacity:.6;transition:opacity .2s}.cb-radius-demo__preview:hover{opacity:1}.cb-radius-demo__label{font-size:var(--ds-font-xs);font-family:monospace;color:var(--ds-muted-foreground);text-align:center}.cb-colors-page,.cb-themes-page,.cb-typography-page{max-width:960px;display:flex;flex-direction:column;gap:var(--ds-space-4)}.cb-colors-page__header,.cb-themes-page__header,.cb-typography-page__header{margin-bottom:var(--ds-space-2)}.cb-colors-page__title,.cb-themes-page__title,.cb-typography-page__title{font-size:var(--ds-font-3xl);font-weight:var(--ds-weight-bold);color:var(--ds-foreground);margin-bottom:var(--ds-space-2)}.cb-colors-page__description,.cb-themes-page__description,.cb-typography-page__description{font-size:var(--ds-font-sm);color:var(--ds-muted-foreground);line-height:1.6}.cb-themes-page__section-heading{font-size:var(--ds-font-xl);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground);margin-top:var(--ds-space-4);margin-bottom:var(--ds-space-3)}.cb-themes-page__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));grid-gap:var(--ds-space-4);gap:var(--ds-space-4)}.cb-themes-page__token-label{font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground);margin-bottom:var(--ds-space-3)}.cb-themes-page__token-table{width:100%;border-collapse:collapse;font-size:var(--ds-font-sm)}.cb-themes-page__token-table th{text-align:start;font-weight:var(--ds-weight-semibold);text-transform:uppercase;letter-spacing:.04em;color:var(--ds-muted-foreground)}.cb-themes-page__token-table td,.cb-themes-page__token-table th{padding:var(--ds-space-2) var(--ds-space-3);font-size:var(--ds-font-xs);border-bottom:1px solid var(--ds-border)}.cb-themes-page__token-table td{color:var(--ds-card-foreground);font-family:monospace}.cb-themes-page__token-table tr:last-child td{border-bottom:none}.cb-colors-page__section{margin-bottom:var(--ds-space-2)}.cb-colors-page__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));grid-gap:var(--ds-space-3);gap:var(--ds-space-3)}.cb-colors-page__pair{display:flex;flex-direction:column;gap:var(--ds-space-2)}.cb-typography-page__section{margin-bottom:var(--ds-space-2)}.cb-typography-page__specimens{display:flex;flex-direction:column}.cb-typography-page__specimen{display:flex;align-items:baseline;gap:var(--ds-space-3);padding:var(--ds-space-3) var(--ds-space-0);border-bottom:1px solid var(--ds-border)}.cb-typography-page__specimen:last-child{border-bottom:none}.cb-typography-page__specimen-text{color:var(--ds-foreground);line-height:1.4;flex:1 1}.cb-typography-page__specimen-var{font-size:var(--ds-font-xs);font-family:monospace;color:var(--ds-muted-foreground);background:var(--ds-muted);padding:var(--ds-space-1) var(--ds-space-2);border-radius:var(--ds-radius-sm);white-space:nowrap}.cb-spacing-page{max-width:960px;display:flex;flex-direction:column;gap:var(--ds-space-4)}.cb-spacing-page__header,.cb-spacing-page__title{margin-bottom:var(--ds-space-2)}.cb-spacing-page__title{font-size:var(--ds-font-3xl);font-weight:var(--ds-weight-bold);color:var(--ds-foreground)}.cb-spacing-page__description{font-size:var(--ds-font-sm);color:var(--ds-muted-foreground);line-height:1.6}.cb-spacing-page__guidelines{font-size:var(--ds-font-sm)}.cb-spacing-page__table{width:100%;border-collapse:collapse}.cb-spacing-page__table th{text-align:start;font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);text-transform:uppercase;letter-spacing:.04em;color:var(--ds-muted-foreground)}.cb-spacing-page__table td,.cb-spacing-page__table th{padding:var(--ds-space-2) var(--ds-space-3);border-bottom:1px solid var(--ds-border)}.cb-spacing-page__table td{color:var(--ds-card-foreground);font-size:var(--ds-font-sm)}.cb-spacing-page__table tr:last-child td{border-bottom:none}.cb-radius-page{max-width:960px;display:flex;flex-direction:column;gap:var(--ds-space-4)}.cb-radius-page__header,.cb-radius-page__title{margin-bottom:var(--ds-space-2)}.cb-radius-page__title{font-size:var(--ds-font-3xl);font-weight:var(--ds-weight-bold);color:var(--ds-foreground)}.cb-radius-page__description{font-size:var(--ds-font-sm);color:var(--ds-muted-foreground);line-height:1.6}.cb-radius-page__guidelines{font-size:var(--ds-font-sm)}.cb-radius-page__table{width:100%;border-collapse:collapse}.cb-radius-page__table th{text-align:start;font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);text-transform:uppercase;letter-spacing:.04em;color:var(--ds-muted-foreground)}.cb-radius-page__table td,.cb-radius-page__table th{padding:var(--ds-space-2) var(--ds-space-3);border-bottom:1px solid var(--ds-border)}.cb-radius-page__table td{color:var(--ds-card-foreground);font-size:var(--ds-font-sm)}.cb-radius-page__table tr:last-child td{border-bottom:none}.cb-shadows-page{max-width:960px;display:flex;flex-direction:column;gap:var(--ds-space-4)}.cb-shadows-page__header,.cb-shadows-page__title{margin-bottom:var(--ds-space-2)}.cb-shadows-page__title{font-size:var(--ds-font-3xl);font-weight:var(--ds-weight-bold);color:var(--ds-foreground)}.cb-shadows-page__description{font-size:var(--ds-font-sm);color:var(--ds-muted-foreground);line-height:1.6}.cb-shadow-demo{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-gap:var(--ds-space-6);gap:var(--ds-space-6)}.cb-shadow-demo__item{display:flex;flex-direction:column;gap:var(--ds-space-3)}.cb-shadow-demo__preview{width:100%;height:80px;background:var(--ds-card);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);transition:box-shadow .3s}.cb-shadow-demo__info{display:flex;flex-direction:column;gap:var(--ds-space-1)}.cb-shadow-demo__label{font-size:var(--ds-font-sm);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground)}.cb-shadow-demo__token{font-size:var(--ds-font-xs);font-family:monospace;color:var(--ds-primary)}.cb-shadow-demo__desc{font-size:var(--ds-font-xs);color:var(--ds-muted-foreground)}.cb-shadows-page__guidelines{font-size:var(--ds-font-sm)}.cb-shadows-page__table{width:100%;border-collapse:collapse}.cb-shadows-page__table th{text-align:start;font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);text-transform:uppercase;letter-spacing:.04em;color:var(--ds-muted-foreground)}.cb-shadows-page__table td,.cb-shadows-page__table th{padding:var(--ds-space-2) var(--ds-space-3);border-bottom:1px solid var(--ds-border)}.cb-shadows-page__table td{color:var(--ds-card-foreground);font-size:var(--ds-font-sm)}.cb-shadows-page__table tr:last-child td{border-bottom:none}.cb-opacity-page{max-width:960px;display:flex;flex-direction:column;gap:var(--ds-space-4)}.cb-opacity-page__header,.cb-opacity-page__title{margin-bottom:var(--ds-space-2)}.cb-opacity-page__title{font-size:var(--ds-font-3xl);font-weight:var(--ds-weight-bold);color:var(--ds-foreground)}.cb-opacity-page__description{font-size:var(--ds-font-sm);color:var(--ds-muted-foreground);line-height:1.6}.cb-opacity-demo{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));grid-gap:var(--ds-space-4);gap:var(--ds-space-4)}.cb-opacity-demo__item{display:flex;flex-direction:column;align-items:center;gap:var(--ds-space-2)}.cb-opacity-demo__preview-wrapper{width:64px;height:64px;border-radius:var(--ds-radius-md);background-image:repeating-conic-gradient(var(--ds-muted) 0 25%,transparent 0 50%);background-size:8px 8px;overflow:hidden}.cb-opacity-demo__preview{width:100%;height:100%;background:var(--ds-primary);transition:opacity .2s}.cb-opacity-demo__label{font-size:var(--ds-font-xs);font-family:monospace;color:var(--ds-muted-foreground);text-align:center}.cb-opacity-demo__value{font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);color:var(--ds-foreground)}.cb-opacity-page__guidelines{font-size:var(--ds-font-sm)}.cb-opacity-page__table{width:100%;border-collapse:collapse}.cb-opacity-page__table th{text-align:start;font-size:var(--ds-font-xs);font-weight:var(--ds-weight-semibold);text-transform:uppercase;letter-spacing:.04em;color:var(--ds-muted-foreground)}.cb-opacity-page__table td,.cb-opacity-page__table th{padding:var(--ds-space-2) var(--ds-space-3);border-bottom:1px solid var(--ds-border)}.cb-opacity-page__table td{color:var(--ds-card-foreground);font-size:var(--ds-font-sm)}.cb-opacity-page__table tr:last-child td{border-bottom:none}@media (max-width:768px){.cb-themes-page__grid{grid-template-columns:1fr}.cb-colors-page__grid{grid-template-columns:repeat(2,1fr)}.cb-typography-page__specimen{flex-direction:column;gap:var(--ds-space-1)}}