@layer ottili-components{.lab{max-width:1100px;margin:0 auto;padding:var(--ott-space-8) var(--ott-space-6)}.lab h1{font-size:var(--ott-font-size-display);line-height:var(--ott-line-height-display);margin:0 0 var(--ott-space-2)}.lab h2{font-size:var(--ott-font-size-page-title);margin:var(--ott-space-8) 0 var(--ott-space-3)}.lab p{color:var(--ott-color-text-secondary);margin:0 0 var(--ott-space-4)}.lab__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));grid-gap:var(--ott-space-4);gap:var(--ott-space-4)}.lab__card{background:var(--ott-color-bg-surface);border:1px solid var(--ott-color-border-default);border-radius:var(--ott-radius-lg);padding:var(--ott-space-4)}.lab__card h3{margin:0 0 var(--ott-space-1);font-size:var(--ott-font-size-section-title)}.lab__ref{font-family:var(--ott-font-family-mono);color:var(--ott-color-text-muted)}.lab__ref,.lab__status{font-size:var(--ott-font-size-micro)}.lab__status{display:inline-block;padding:0 var(--ott-space-2);border-radius:var(--ott-radius-full)}.lab__status[data-status=implemented]{background:var(--ott-color-success);color:var(--ott-color-text-inverse)}.lab__status[data-status=not-implemented]{background:var(--ott-color-bg-muted);color:var(--ott-color-text-secondary)}.lab__swatch{height:48px;border-radius:var(--ott-radius-md);display:flex;align-items:center;justify-content:center;font-weight:600}.lab__coverage{display:flex;gap:var(--ott-space-6);margin-bottom:var(--ott-space-6)}.lab__metric{font-size:var(--ott-font-size-display);font-weight:700}.lab__metric-label{font-size:var(--ott-font-size-label);color:var(--ott-color-text-muted);text-transform:uppercase}.lab__gates{display:flex;flex-wrap:wrap;gap:var(--ott-space-3);border:1px solid var(--ott-color-border-default);border-radius:var(--ott-radius-md);padding:var(--ott-space-3);margin-bottom:var(--ott-space-3)}.lab__gate{display:inline-flex;align-items:center;gap:var(--ott-space-1);font-size:var(--ott-font-size-compact)}.lab__nav{display:flex;gap:var(--ott-space-4);margin-bottom:var(--ott-space-6)}.lab__nav a{color:var(--ott-color-accent)}.lab-stack{display:flex;flex-direction:column;gap:var(--ott-space-4)}.lab-row{gap:var(--ott-space-3)}.lab-inline,.lab-row{display:flex;flex-wrap:wrap;align-items:center}.lab-inline{gap:var(--ott-space-2)}.lab-grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(20rem,100%),1fr));grid-gap:var(--ott-space-4);gap:var(--ott-space-4)}.lab-gallery,.lab-settings{display:flex;flex-direction:column;gap:var(--ott-space-5);max-width:68rem}.lab-actions{display:flex;justify-content:flex-end;gap:var(--ott-space-2)}.lab-actions--start{justify-content:flex-start;flex-wrap:wrap;align-items:center}.lab-card-padded{padding:var(--ott-space-4)}.lab-history{margin-top:var(--ott-space-3)}.lab-job{display:flex;flex-direction:column;gap:var(--ott-space-1)}.lab-job__name{color:var(--ott-color-text-primary)}.lab-job__detail{color:var(--ott-color-text-secondary);font-size:var(--ott-font-size-compact)}.lab-job__actions{display:inline-flex;gap:var(--ott-space-2)}.lab-pin-row{display:flex;align-items:center;gap:var(--ott-space-1);padding:0 var(--ott-space-3) var(--ott-space-2)}.lab-audit{list-style:none;margin:var(--ott-space-3) 0 0;padding:0;display:grid;grid-gap:var(--ott-space-4);gap:var(--ott-space-4)}.lab-audit__group{border-left:2px solid var(--ott-color-border-strong);padding-left:var(--ott-space-3)}.lab-audit__origin{margin:0;display:flex;align-items:center;gap:var(--ott-space-2);flex-wrap:wrap}.lab-audit__entries{list-style:none;margin:var(--ott-space-2) 0 0;padding:0;display:grid;grid-gap:var(--ott-space-1);gap:var(--ott-space-1);font-size:var(--ott-font-size-compact)}.lab-audit__change{display:block;color:var(--ott-color-text-secondary);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.lab-history summary{cursor:pointer;font-size:var(--ott-font-size-compact);color:var(--ott-color-text-secondary)}.lab-pane{height:100%;padding-inline:var(--ott-space-1);display:flex;flex-direction:column;gap:var(--ott-space-4)}.lab-pane-demo{padding:var(--ott-space-4);background:var(--ott-color-bg-muted);border-radius:var(--ott-radius-md);height:100%}.lab-split-demo{height:12rem;border:1px solid var(--ott-color-border-subtle);border-radius:var(--ott-radius-md);overflow:hidden}.ott-shell__main>.ott-split{min-height:26rem;height:calc(100dvh - var(--ott-size-topbar) - var(--ott-space-16))}.lab-edit-hint{margin:0;padding:var(--ott-space-2) var(--ott-space-3);background:var(--ott-color-accent-soft);color:var(--ott-color-accent);border-radius:var(--ott-radius-md);font-size:var(--ott-font-size-compact)}.lab-edit-hint kbd{font-family:var(--ott-font-family-mono);border:1px solid;border-radius:var(--ott-radius-xs);padding:0 4px}.lab-warning{margin:0;padding:var(--ott-space-3);border-radius:var(--ott-radius-md);background:color-mix(in srgb,var(--ott-color-warning) 12%,transparent);color:var(--ott-color-warning);font-size:var(--ott-font-size-compact)}.lab-widget-stack{display:flex;flex-direction:column;gap:var(--ott-space-3)}.lab-widget-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));grid-gap:var(--ott-space-2);gap:var(--ott-space-2);align-content:start}.lab-item-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.lab-item-list>li{display:flex;align-items:center;gap:var(--ott-space-3);padding:var(--ott-space-2) 0;border-bottom:1px solid var(--ott-color-border-subtle)}.lab-item-list>li:last-child{border-bottom:0}.lab-item-list__text{flex:1 1;min-width:0;display:flex;flex-direction:column;gap:1px}.lab-item-list__primary{font-size:var(--ott-font-size-compact);font-weight:var(--ott-font-weight-body-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lab-item-list__secondary{font-size:var(--ott-font-size-micro);color:var(--ott-color-text-muted)}.lab-health{list-style:none;margin:0;padding:0;flex-direction:column;font-size:var(--ott-font-size-compact)}.lab-health,.lab-health>li{display:flex;gap:var(--ott-space-2)}.lab-health>li{align-items:center}.lab-health__dot{width:8px;height:8px;border-radius:var(--ott-radius-full);background:var(--ott-color-success);flex:none}.lab-health__dot[data-status=degraded]{background:var(--ott-color-warning)}.lab-health__dot[data-status=down]{background:var(--ott-color-danger)}.lab-health__status{-webkit-margin-start:auto;margin-inline-start:auto;color:var(--ott-color-text-muted)}.lab-chart{margin:0;display:flex;flex-direction:column;gap:var(--ott-space-2);height:100%}.lab-chart svg{width:100%;flex:1 1;min-height:60px}.lab-chart__bar{fill:var(--ott-color-accent);opacity:.85}.lab-chart__bar[data-tone=success]{fill:var(--ott-color-success)}.lab-chart__caption{font-size:var(--ott-font-size-micro);color:var(--ott-color-text-muted)}.lab-field-row{display:flex;align-items:flex-end;gap:var(--ott-space-3)}.lab-field-row>.ott-field{flex:1 1;min-width:0}.lab-field-row__label{display:inline-flex}.lab-colour-row,.lab-field-row__label{align-items:center;gap:var(--ott-space-2)}.lab-colour-row{display:flex}.lab-colour{width:40px;height:var(--ott-size-field);padding:2px;border:1px solid var(--ott-color-border-default);border-radius:var(--ott-radius-md);background:var(--ott-color-bg-surface);cursor:pointer;flex:none}.lab-accents{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));grid-gap:var(--ott-space-2);gap:var(--ott-space-2)}.lab-accent{display:flex;align-items:center;gap:var(--ott-space-3);padding:var(--ott-space-2) var(--ott-space-3);border:1px solid var(--ott-color-border-default);border-radius:var(--ott-radius-md);background:var(--ott-color-bg-surface);font:inherit;text-align:start;cursor:pointer}.lab-accent[data-selected]{border-color:var(--ott-color-accent);background:var(--ott-color-accent-soft)}.lab-accent__swatch{width:22px;height:22px;border-radius:var(--ott-radius-sm);flex:none}.lab-accent__text{display:flex;flex-direction:column;gap:1px;min-width:0}.lab-accent__ratio{font-size:var(--ott-font-size-micro);color:var(--ott-color-text-muted)}.lab-brand-preview,.lab-preview{display:flex;align-items:center;gap:var(--ott-space-3);flex-wrap:wrap;padding:var(--ott-space-4);border:1px solid var(--ott-color-border-subtle);border-radius:var(--ott-radius-lg);background:var(--ott-color-bg-surface)}.lab-brand-preview__name{margin:0;font-weight:var(--ott-font-weight-body-strong)}.lab-brand-preview .ott-button{-webkit-margin-start:auto;margin-inline-start:auto}.lab-nav-editor{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--ott-space-1)}.lab-nav-editor__row{display:flex;align-items:center;gap:var(--ott-space-3);padding:var(--ott-space-2) var(--ott-space-3);border:1px solid var(--ott-color-border-subtle);border-radius:var(--ott-radius-md);background:var(--ott-color-bg-surface)}.lab-nav-editor__row[data-blocked]{opacity:.7;background:var(--ott-color-bg-muted)}.lab-nav-editor__grip{color:var(--ott-color-text-muted);cursor:-webkit-grab;cursor:grab}.lab-nav-editor__label{flex:1 1;min-width:0;display:flex;align-items:center;gap:var(--ott-space-2)}.lab-nav-editor__moves{display:flex;gap:var(--ott-space-1)}.lab-contextmenu-target{padding:var(--ott-space-5);border:1px dashed var(--ott-color-border-strong);border-radius:var(--ott-radius-md);text-align:center;color:var(--ott-color-text-muted);font-size:var(--ott-font-size-compact)}.lab-scenario-trigger{display:inline-flex;align-items:center;gap:var(--ott-space-2);max-width:20rem}.lab-scenario-trigger__text{font-size:var(--ott-font-size-micro);color:var(--ott-color-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lab-scenario-fab{position:fixed;z-index:90;inset-block-end:var(--ott-space-5);inset-inline-start:var(--ott-space-5)}.lab-inspector__summary{display:flex;gap:var(--ott-space-2);flex-wrap:wrap}.lab-inspector__group{display:flex;flex-direction:column;gap:var(--ott-space-4)}.lab-inspector__hint{margin:0;font-size:var(--ott-font-size-micro);color:var(--ott-color-text-muted);word-break:break-word}.lab-help-dock{position:fixed;z-index:130;inset-block:var(--ott-size-topbar) 0;inset-inline-end:0;width:min(32rem,94vw);overflow-y:auto;background:var(--ott-color-bg-surface);-webkit-border-start:1px solid var(--ott-color-border-default);border-inline-start:1px solid var(--ott-color-border-default);box-shadow:var(--ott-shadow-lg)}[data-lab-mobile=true] .ott-shell__nav-toggle{display:inline-flex}[data-lab-mobile=true] .ott-shell__sidebar{position:fixed;z-index:120;inset-block:0;inset-inline-start:0;width:min(var(--ott-sidebar-width),82vw);transform:translateX(-102%);transition:transform var(--ott-duration-panel) var(--ott-easing-standard);box-shadow:var(--ott-shadow-lg)}[data-lab-mobile=true] .ott-shell__sidebar[data-mobile-open=true]{transform:translateX(0)}[data-lab-mobile=true] .ott-shell__scrim{display:block;position:fixed;inset:0;z-index:110;background:rgba(9,12,17,.4)}[data-lab-mobile=true] .ott-topbar__search{display:none}[data-lab-mobile=true] .ott-topbar__search-compact{display:inline-flex}[data-lab-mobile=true] .lab-scenario-trigger__text,[data-lab-mobile=true] .ott-topbar__divider,[data-lab-mobile=true] .ott-topbar__product{display:none}[data-lab-mobile=true] .lab-grid-2{grid-template-columns:1fr}.lab-findings{margin:0;-webkit-padding-start:var(--ott-space-5);padding-inline-start:var(--ott-space-5);display:flex;flex-direction:column;gap:var(--ott-space-1);font-size:var(--ott-font-size-compact);color:var(--ott-color-text-secondary)}.lab-findings code{font-family:var(--ott-font-family-mono);font-size:var(--ott-font-size-micro);background:var(--ott-color-bg-muted);padding:1px 5px;border-radius:var(--ott-radius-xs)}.lab-pack-group+.lab-pack-group{margin-top:var(--ott-space-4)}.lab-pack-group__title{margin:0 0 var(--ott-space-2);font-size:var(--ott-font-size-micro);text-transform:uppercase;letter-spacing:.06em;color:var(--ott-color-text-muted)}.lab-packs{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));grid-gap:var(--ott-space-3)}.lab-pack,.lab-packs{gap:var(--ott-space-3)}.lab-pack{display:flex;align-items:center;padding:var(--ott-space-3);border:1px solid var(--ott-color-border-default);border-radius:var(--ott-radius-lg);background:var(--ott-color-bg-surface);font:inherit;text-align:start;cursor:pointer;transition:border-color var(--ott-duration-fast) var(--ott-easing-standard)}.lab-pack:hover{border-color:var(--ott-color-border-strong)}.lab-pack[data-selected]{border-color:var(--ott-color-accent);box-shadow:var(--ott-shadow-focus)}.lab-pack__swatches{display:grid;grid-template-columns:repeat(2,14px);grid-auto-rows:14px;grid-gap:2px;gap:2px;flex:none}.lab-pack__swatches>span{border-radius:3px;border:1px solid var(--ott-color-border-subtle)}.lab-pack__text{display:flex;flex-direction:column;gap:2px;min-width:0}.lab-pack__name{font-weight:var(--ott-font-weight-body-strong)}.lab-pack__description{font-size:var(--ott-font-size-micro);color:var(--ott-color-text-muted)}.lab-theme-preview{padding:var(--ott-space-6);border:1px solid var(--ott-color-border-default);border-radius:var(--ott-radius-lg);background:var(--ott-color-bg-canvas)}.lab-theme-preview__card{display:flex;flex-direction:column;gap:var(--ott-space-3);padding:var(--ott-space-4);background:var(--ott-color-bg-surface);border:1px solid var(--ott-color-border-subtle);border-radius:var(--ott-radius-lg);box-shadow:var(--ott-shadow-sm)}.lab-theme-preview__title{margin:0;font-weight:var(--ott-font-weight-body-strong);font-size:var(--ott-font-size-section-title)}.lab-theme-preview__body{margin:0;color:var(--ott-color-text-secondary);font-size:var(--ott-font-size-compact)}.lab__status[data-status=partial]{background:var(--ott-color-warning);color:#ffffff}.lab__limitation{margin:var(--ott-space-2) 0 0;font-size:var(--ott-font-size-micro);color:var(--ott-color-text-muted);-webkit-border-start:2px solid var(--ott-color-warning);border-inline-start:2px solid var(--ott-color-warning);-webkit-padding-start:var(--ott-space-2);padding-inline-start:var(--ott-space-2)}}@layer ottili-components{}@layer ottili-components{}@layer ottili-components{}@layer ottili-components{}@layer ottili-components{}