@layer mlola.preview{.ml-catalog{width:min(100%,78rem);padding:var(--ml-space-fluid-lg) var(--ml-shell-gutter) var(--ml-space-fluid-xl);margin-inline:auto}.ml-catalog[data-detail]{padding-block-start:var(--ml-space-6)}.ml-catalog-hero{justify-items:start;gap:var(--ml-space-3);max-width:44rem;margin-block-end:var(--ml-space-8);display:grid}.ml-catalog-eyebrow{align-items:center;gap:var(--ml-space-2);color:var(--ml-text-muted);font-size:var(--ml-type-sm);margin:0;font-weight:500;display:inline-flex}.ml-catalog-pro{padding:0 var(--ml-space-1-5);border-radius:var(--ml-radius-pill);background:var(--ml-primary);color:var(--ml-primary-foreground);font-size:var(--ml-type-2xs);letter-spacing:.02em;align-items:center;font-weight:600;line-height:1.6;display:inline-flex}.ml-catalog h1{font-family:var(--ml-font-display);font-size:var(--ml-type-display-md);font-weight:var(--ml-display-weight);letter-spacing:-.04em;text-wrap:balance;margin:0;line-height:1.04}.ml-catalog-lede{color:var(--ml-text-muted);font-size:var(--ml-type-md);text-wrap:pretty;margin:0;line-height:1.6}.ml-catalog-facts{gap:var(--ml-space-3) var(--ml-space-8);margin:var(--ml-space-3) 0 0;flex-wrap:wrap;display:flex}.ml-catalog-facts>div{gap:var(--ml-space-0-5);flex-direction:column-reverse;display:flex}.ml-catalog-facts dt{color:var(--ml-text-muted);font-size:var(--ml-type-sm)}.ml-catalog-facts dd{font-family:var(--ml-font-display);font-size:var(--ml-type-2xl);font-variant-numeric:tabular-nums;font-weight:var(--ml-display-weight);margin:0;line-height:1.1}.ml-catalog-jump{z-index:var(--ml-layer-sticky);top:var(--ml-site-header);gap:var(--ml-space-2);margin-block-end:var(--ml-space-8);margin-inline:calc(var(--ml-shell-gutter) * -1);padding:var(--ml-space-2-5) var(--ml-shell-gutter);border-bottom:1px solid var(--ml-border-subtle);background:var(--ml-background);grid-template-columns:minmax(0,1fr);display:grid;position:sticky}.ml-catalog-jump ul{align-items:center;gap:var(--ml-space-1-5);scrollbar-width:none;margin:0;padding:0;list-style:none;display:flex;overflow-x:auto}.ml-catalog-jump-categories{max-width:100%;padding:var(--ml-space-0-5);border-radius:var(--ml-radius-md);background:var(--ml-background-subtle);box-shadow:inset 0 0 0 1px var(--ml-border-subtle);justify-self:start}.ml-catalog-jump .ml-catalog-jump-categories{gap:0}.ml-catalog-jump-category{min-height:var(--ml-space-7);align-items:center;gap:var(--ml-space-1-5);padding:var(--ml-space-1) var(--ml-space-3);border-radius:calc(var(--ml-radius-md) - 2px);color:var(--ml-text-muted);font-size:var(--ml-type-sm);white-space:nowrap;transition:color var(--ml-duration-fast), background-color var(--ml-duration-fast);font-weight:500;text-decoration:none;display:inline-flex;position:relative}.ml-catalog-jump-category:hover{color:var(--ml-text)}.ml-catalog-jump-category[aria-current]{background:var(--ml-surface);box-shadow:var(--ml-shadow-xs), 0 0 0 1px var(--ml-border-subtle);color:var(--ml-text)}.ml-catalog-jump-count{color:var(--ml-text-muted);font-size:var(--ml-type-xs);font-variant-numeric:tabular-nums;font-weight:400}.ml-catalog-jump-category:focus-visible{outline:2px solid var(--ml-focus);outline-offset:2px}.ml-catalog-jump .ml-catalog-chip{white-space:nowrap;text-decoration:none;display:inline-block}.ml-catalog-chip:is(a):focus-visible{outline:2px solid var(--ml-focus);outline-offset:2px}.ml-catalog-group+.ml-catalog-group{margin-block-start:var(--ml-space-fluid-xl)}.ml-catalog-group-head{gap:var(--ml-space-1);margin-block-end:var(--ml-space-6);display:grid}.ml-catalog-group-head h2{font-family:var(--ml-font-display);font-size:var(--ml-type-display-sm);font-weight:var(--ml-display-weight);letter-spacing:-.03em;margin:0;line-height:1.1}.ml-catalog-group-head p{color:var(--ml-text-muted);font-size:var(--ml-type-md);margin:0}.ml-catalog-group[id],.ml-catalog-card[id]{scroll-margin-top:calc(var(--ml-site-header) + var(--ml-space-16) + var(--ml-space-10))}@media (prefers-reduced-motion:no-preference){html:has(.ml-catalog-jump){scroll-behavior:smooth}}.ml-catalog-filters{justify-content:space-between;align-items:center;gap:var(--ml-space-3);flex-wrap:wrap;margin-block-end:var(--ml-space-6);display:flex}.ml-catalog-segment{padding:var(--ml-space-0-5);border-radius:var(--ml-radius-md);background:var(--ml-background-subtle);box-shadow:inset 0 0 0 1px var(--ml-border-subtle);display:inline-flex}.ml-catalog-segment button{align-items:center;gap:var(--ml-space-1-5);padding:var(--ml-space-1-5) var(--ml-space-3);border-radius:calc(var(--ml-radius-md) - 2px);color:var(--ml-text-muted);font:inherit;font-size:var(--ml-type-sm);font-variant-numeric:tabular-nums;cursor:pointer;background:0 0;border:0;display:inline-flex}.ml-catalog-segment button:hover{color:var(--ml-text)}.ml-catalog-segment button[aria-pressed=true]{background:var(--ml-surface);box-shadow:var(--ml-shadow-xs), 0 0 0 1px var(--ml-border-subtle);color:var(--ml-text);font-weight:500}.ml-catalog-chips{gap:var(--ml-space-1-5);flex-wrap:wrap;display:flex}.ml-catalog-chip{padding:var(--ml-space-1) var(--ml-space-3);border:1px solid var(--ml-border-subtle);border-radius:var(--ml-radius-pill);background:var(--ml-surface);color:var(--ml-text-muted);font:inherit;font-size:var(--ml-type-sm);cursor:pointer;transition:border-color var(--ml-duration-fast), color var(--ml-duration-fast)}.ml-catalog-chip:hover{border-color:var(--ml-border);color:var(--ml-text)}.ml-catalog-chip:is([aria-pressed=true],[aria-current]),.ml-catalog-chip:is([aria-pressed=true],[aria-current]):hover{background:var(--ml-text);color:var(--ml-background);border-color:#0000}.ml-catalog-segment button:focus-visible,.ml-catalog-chip:focus-visible{outline:2px solid var(--ml-focus);outline-offset:2px}.ml-catalog-grid{gap:var(--ml-space-fluid-sm) var(--ml-space-6);grid-template-columns:repeat(2,minmax(0,1fr));margin:0;padding:0;list-style:none;display:grid}.ml-catalog-grid[data-layout=feature]{gap:var(--ml-space-fluid-lg);grid-template-columns:minmax(0,1fr)}.ml-catalog-grid[data-layout=compact]{grid-template-columns:repeat(3,minmax(0,1fr))}.ml-catalog-card-link{gap:var(--ml-space-3);color:inherit;text-decoration:none;display:grid}.ml-catalog-frame{border:1px solid var(--ml-border-subtle);border-radius:var(--ml-radius-lg);background:var(--ml-background-subtle);box-shadow:var(--ml-shadow-xs);isolation:isolate;position:relative;overflow:hidden}.ml-catalog-frame iframe{background:var(--ml-background);transform-origin:0 0;pointer-events:none;opacity:0;transition:opacity var(--ml-duration-slow) var(--ml-ease-standard);border:0;display:block;position:absolute;top:0;left:0}.ml-catalog-frame[data-ready] iframe{opacity:1}.ml-catalog-skeleton{z-index:1;background:var(--ml-background);animation:ml-fade-in var(--ml-duration-normal) var(--ml-ease-standard);gap:6%;padding:4% 5%;display:grid;position:absolute;inset:0}.ml-catalog-skeleton[data-shape=site]{grid-template-rows:auto auto minmax(0,1fr)}.ml-catalog-skeleton[data-shape=app]{grid-template-columns:22% minmax(0,1fr);gap:0;padding:0}.ml-catalog-skeleton-row{justify-content:space-between;align-items:center;gap:var(--ml-space-3);display:flex}.ml-catalog-skeleton-links{gap:var(--ml-space-2);display:flex}.ml-catalog-skeleton-hero{justify-items:start;gap:var(--ml-space-2);display:grid}.ml-catalog-skeleton-hero>.ml-catalog-skeleton-links{margin-block-start:var(--ml-space-2)}.ml-catalog-skeleton-cards,.ml-catalog-skeleton-panes{gap:var(--ml-space-3);grid-template-columns:repeat(3,minmax(0,1fr));min-height:0;display:grid}.ml-catalog-skeleton-panes{grid-template-columns:1.4fr 1fr}.ml-catalog-skeleton-side{align-content:start;gap:var(--ml-space-2-5);border-inline-end:1px solid var(--ml-border-subtle);background:var(--ml-background-subtle);padding:8% 10%;display:grid}.ml-catalog-skeleton-main{grid-template-rows:auto minmax(0,1fr);gap:5%;padding:3% 4%;display:grid}.ml-catalog-skeleton[data-shape=outline]{padding:0;display:block;container-type:size}.ml-catalog-outline-panel,.ml-catalog-outline-shape{top:calc(var(--y) * 100cqw);left:calc(var(--x) * 100cqw);width:calc(var(--w) * 100cqw);height:calc(var(--h) * 100cqw);border-radius:calc(var(--r) * 100cqw);position:absolute}.ml-catalog-outline-panel{border:1px solid var(--ml-border-subtle);background:color-mix(in oklab, var(--ml-background-subtle) 60%, var(--ml-background))}.ml-catalog-skeleton[data-shape=site][data-viewport=mobile] .ml-catalog-skeleton-row>.ml-catalog-skeleton-links,.ml-catalog-skeleton[data-shape=app][data-viewport=mobile] .ml-catalog-skeleton-side{display:none}.ml-catalog-skeleton[data-shape=site][data-viewport=mobile] .ml-catalog-skeleton-cards,.ml-catalog-skeleton[data-shape=app][data-viewport=mobile] .ml-catalog-skeleton-panes,.ml-catalog-skeleton[data-shape=app][data-viewport=mobile]{grid-template-columns:minmax(0,1fr)}.ml-catalog-frame[data-interactive] iframe{pointer-events:auto}.ml-catalog-card-link .ml-catalog-frame{transition:box-shadow var(--ml-duration-normal) var(--ml-ease-standard), border-color var(--ml-duration-normal) var(--ml-ease-standard), translate var(--ml-duration-normal) var(--ml-ease-standard)}.ml-catalog-card-link:hover .ml-catalog-frame{border-color:var(--ml-border);box-shadow:var(--ml-shadow-lg);translate:0 -2px}.ml-catalog-card-link:focus-visible{outline:none}.ml-catalog-card-link:focus-visible .ml-catalog-frame{box-shadow:0 0 0 2px var(--ml-background), 0 0 0 4px var(--ml-focus)}.ml-catalog-card-meta{gap:var(--ml-space-1);padding-inline:var(--ml-space-0-5);display:grid}.ml-catalog-card-title{align-items:center;gap:var(--ml-space-1-5);font-size:var(--ml-type-base);letter-spacing:-.01em;font-weight:600;display:inline-flex}.ml-catalog-card[data-size=feature] .ml-catalog-card-title{font-size:var(--ml-type-xl)}.ml-catalog-card-arrow{color:var(--ml-text-faint);opacity:0;transition:opacity var(--ml-duration-fast), translate var(--ml-duration-fast) var(--ml-ease-standard);translate:-4px}.ml-catalog-card-link:hover .ml-catalog-card-arrow{opacity:1;translate:0}.ml-catalog-card-tags{gap:var(--ml-space-1-5);color:var(--ml-text-faint);font-size:var(--ml-type-xs);display:inline-flex}.ml-catalog-card-description{color:var(--ml-text-muted);font-size:var(--ml-type-sm);-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.55;display:-webkit-box;overflow:hidden}.ml-catalog-card[data-size=feature] .ml-catalog-card-description{max-width:48rem;font-size:var(--ml-type-base);-webkit-line-clamp:3}.ml-catalog-empty{padding:var(--ml-space-10);color:var(--ml-text-muted);text-align:center}.ml-catalog-band{justify-content:space-between;align-items:center;gap:var(--ml-space-5);padding:var(--ml-space-fluid-sm);border:1px solid var(--ml-border-subtle);border-radius:calc(var(--ml-radius-lg) + 4px);background:radial-gradient(ellipse 70% 120% at 100% 0%, color-mix(in oklab, var(--ml-primary) 9%, transparent), transparent 65%), var(--ml-surface);flex-wrap:wrap;margin-block-start:var(--ml-space-fluid-xl);display:flex}.ml-catalog-band h2{margin:0 0 var(--ml-space-2);font-family:var(--ml-font-display);font-size:var(--ml-type-display-sm);font-weight:var(--ml-display-weight);letter-spacing:-.03em}.ml-catalog-band p{max-width:40rem;color:var(--ml-text-muted);margin:0;line-height:1.6}.ml-catalog-breadcrumb{margin-block-end:var(--ml-space-6)}.ml-catalog-detail-header{justify-content:space-between;align-items:flex-end;gap:var(--ml-space-6);flex-wrap:wrap;margin-block-end:var(--ml-space-6);display:flex}.ml-catalog-detail-header>div:first-child{gap:var(--ml-space-3);max-width:44rem;display:grid}.ml-catalog-actions{gap:var(--ml-space-2);flex-wrap:wrap;display:flex}.ml-catalog-stage{border:1px solid var(--ml-border-subtle);border-radius:calc(var(--ml-radius-lg) + 4px);background:var(--ml-surface);box-shadow:var(--ml-shadow-sm);overflow:hidden}.ml-catalog-stage-bar{justify-content:space-between;align-items:center;gap:var(--ml-space-3);padding:var(--ml-space-2) var(--ml-space-3);border-bottom:1px solid var(--ml-border-subtle);display:flex}.ml-catalog-stage-note{align-items:center;gap:var(--ml-space-1-5);color:var(--ml-text-faint);font-size:var(--ml-type-xs);display:inline-flex}.ml-catalog-stage-note:before{background:var(--ml-success);content:"";border-radius:50%;width:.4375rem;height:.4375rem}.ml-catalog-stage-canvas{padding:var(--ml-space-4);background-color:var(--ml-background-subtle);background-image:radial-gradient(circle at 1px 1px, color-mix(in oklab, var(--ml-text) 12%, transparent) 1px, transparent 1.5px);background-size:1.25rem 1.25rem}.ml-catalog-stage-canvas[data-viewport=mobile]{padding-block:var(--ml-space-6)}.ml-catalog-stage-device{margin-inline:auto}.ml-catalog-stage-canvas[data-viewport=mobile] .ml-catalog-frame{border-radius:calc(var(--ml-radius-lg) * 2);box-shadow:var(--ml-shadow-lg)}.ml-catalog-detail-grid{gap:var(--ml-space-4);grid-template-columns:repeat(2,minmax(0,1fr));margin-block-start:var(--ml-space-6);display:grid}.ml-catalog-panel{align-content:start;gap:var(--ml-space-3);padding:var(--ml-space-5);border:1px solid var(--ml-border-subtle);border-radius:var(--ml-radius-lg);background:var(--ml-surface);display:grid}.ml-catalog-panel h2,.ml-catalog-related h2{font-size:var(--ml-type-base);margin:0;font-weight:600}.ml-catalog-panel p{color:var(--ml-text-muted);font-size:var(--ml-type-sm);margin:0;line-height:1.55}.ml-catalog-command{justify-content:space-between;align-items:center;gap:var(--ml-space-3);min-height:2.75rem;padding:0 var(--ml-space-1-5) 0 var(--ml-space-4);border:1px solid var(--ml-border-subtle);border-radius:var(--ml-radius-md);background:var(--ml-background-subtle);font-family:var(--ml-font-mono);font-size:var(--ml-type-sm);display:flex}.ml-catalog-command code{white-space:nowrap;overflow-x:auto}.ml-catalog-command code:before{color:var(--ml-text-faint);content:"$ "}.ml-catalog-parts{gap:var(--ml-space-1-5);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.ml-catalog-parts a{align-items:center;gap:var(--ml-space-1-5);padding:var(--ml-space-1) var(--ml-space-2-5);border:1px solid var(--ml-border-subtle);border-radius:var(--ml-radius-pill);color:var(--ml-text);font-size:var(--ml-type-sm);text-decoration:none;display:inline-flex}.ml-catalog-parts a:hover{border-color:var(--ml-border);background:var(--ml-background-subtle)}.ml-catalog-related{gap:var(--ml-space-4);margin-block-start:var(--ml-space-fluid-lg);display:grid}@media (max-width:64rem){.ml-catalog-grid[data-layout=compact]{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:48rem){.ml-catalog-grid,.ml-catalog-grid[data-layout=compact],.ml-catalog-detail-grid{grid-template-columns:minmax(0,1fr)}.ml-catalog-filters{flex-direction:column;align-items:flex-start}}@media (prefers-reduced-motion:reduce){.ml-catalog-frame iframe,.ml-catalog-skeleton,.ml-catalog-card-link .ml-catalog-frame,.ml-catalog-card-arrow,.ml-catalog-chip{transition:none}}}
