.WebPlatformCapabilityDemos-module__F5hfbW__root{gap:calc(var(--spacing) * 5);min-width:0;margin-top:calc(var(--spacing) * 8);flex-direction:column;display:flex}.WebPlatformCapabilityDemos-module__F5hfbW__sectionIntro{gap:calc(var(--spacing) * 2.5);min-width:0;padding-bottom:calc(var(--spacing) * 2);flex-direction:column;display:flex}.WebPlatformCapabilityDemos-module__F5hfbW__eyebrow{font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-semibold);letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--docs-primary)}.WebPlatformCapabilityDemos-module__F5hfbW__heading{font-size:var(--text-2xl);line-height:var(--text-2xl--line-height);font-weight:var(--font-weight-semibold);letter-spacing:0;color:var(--docs-text);margin:0}.dark .WebPlatformCapabilityDemos-module__F5hfbW__heading{color:var(--docs-text-dark)}.WebPlatformCapabilityDemos-module__F5hfbW__lede{font-size:var(--text-base);line-height:calc(var(--spacing) * 6.5);color:var(--docs-text-muted);margin:0}.dark .WebPlatformCapabilityDemos-module__F5hfbW__lede{color:var(--docs-text-muted-dark)}.WebPlatformCapabilityDemos-module__F5hfbW__capabilityGrid{gap:calc(var(--spacing) * 3);grid-template-columns:1fr;min-width:0;display:grid}.WebPlatformCapabilityDemos-module__F5hfbW__capabilityCard,.WebPlatformCapabilityDemos-module__F5hfbW__demoPanel{border:1px solid var(--docs-border);border-radius:var(--ui-radius-sm);background:var(--docs-surface);min-width:0}.dark :is(.WebPlatformCapabilityDemos-module__F5hfbW__capabilityCard,.WebPlatformCapabilityDemos-module__F5hfbW__demoPanel){border-color:var(--docs-border-dark);background:var(--docs-code-bg-dark)}.WebPlatformCapabilityDemos-module__F5hfbW__capabilityCard{gap:calc(var(--spacing) * 2);padding:calc(var(--spacing) * 4);flex-direction:column;display:flex}.WebPlatformCapabilityDemos-module__F5hfbW__cardMeta,.WebPlatformCapabilityDemos-module__F5hfbW__panelHeader,.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveHeader{justify-content:space-between;align-items:center;gap:calc(var(--spacing) * 3);min-width:0;display:flex}.WebPlatformCapabilityDemos-module__F5hfbW__cardIndex{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--docs-text-quaternary)}.WebPlatformCapabilityDemos-module__F5hfbW__cardTitle,.WebPlatformCapabilityDemos-module__F5hfbW__panelTitle{color:var(--docs-text);margin:0}.dark :is(.WebPlatformCapabilityDemos-module__F5hfbW__cardTitle,.WebPlatformCapabilityDemos-module__F5hfbW__panelTitle){color:var(--docs-text-dark)}.WebPlatformCapabilityDemos-module__F5hfbW__cardTitle{font-size:var(--text-base);line-height:var(--text-base--line-height);font-weight:var(--font-weight-semibold)}.WebPlatformCapabilityDemos-module__F5hfbW__cardText{font-size:var(--text-sm);line-height:var(--text-sm--line-height);color:var(--docs-text-muted);margin:0}.dark .WebPlatformCapabilityDemos-module__F5hfbW__cardText{color:var(--docs-text-muted-dark)}.WebPlatformCapabilityDemos-module__F5hfbW__statusPill{min-height:calc(var(--spacing) * 6);border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);padding-inline:calc(var(--spacing) * 2);font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-medium);color:var(--docs-text-muted);background:var(--docs-surface-muted);align-items:center;display:inline-flex}.dark .WebPlatformCapabilityDemos-module__F5hfbW__statusPill{border-color:var(--docs-border-dark);color:var(--docs-text-muted-dark);background:#ffffff0a}.WebPlatformCapabilityDemos-module__F5hfbW__status-supported{border-color:var(--ui-status-success-border);color:var(--ui-status-success);background:var(--ui-status-success-bg)}.WebPlatformCapabilityDemos-module__F5hfbW__status-partial{border-color:var(--ui-status-warning-border);color:var(--ui-status-warning);background:var(--ui-status-warning-bg)}.WebPlatformCapabilityDemos-module__F5hfbW__status-missing{border-color:var(--ui-border-subtle);color:var(--docs-text-quaternary)}.WebPlatformCapabilityDemos-module__F5hfbW__status-unknown{color:var(--docs-text-quaternary)}.WebPlatformCapabilityDemos-module__F5hfbW__demoPanel{gap:calc(var(--spacing) * 4);padding:calc(var(--spacing) * 4);flex-direction:column;display:flex}.WebPlatformCapabilityDemos-module__F5hfbW__panelHeader{align-items:flex-start}.WebPlatformCapabilityDemos-module__F5hfbW__panelTitle{margin-top:calc(var(--spacing) * 1);font-size:var(--text-xl);line-height:var(--text-xl--line-height);font-weight:var(--font-weight-semibold);letter-spacing:0}.WebPlatformCapabilityDemos-module__F5hfbW__panelIcon{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5);color:var(--docs-primary);flex:none}.WebPlatformCapabilityDemos-module__F5hfbW__actionButton{border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface);color:var(--docs-text);padding:calc(var(--spacing) * 2.5) calc(var(--spacing) * 3);font:inherit;font-size:var(--text-sm);font-weight:var(--font-weight-semibold);transition:border-color .15s var(--ease-out), background-color .15s var(--ease-out);justify-self:start}@media (hover:hover){.WebPlatformCapabilityDemos-module__F5hfbW__actionButton:hover{border-color:var(--docs-primary);background:var(--docs-surface-hover)}}.dark .WebPlatformCapabilityDemos-module__F5hfbW__actionButton{border-color:var(--docs-border-dark);background:var(--docs-code-bg-dark);color:var(--docs-text-dark)}.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveShell{resize:inline;border:1px solid var(--docs-border);border-radius:var(--ui-radius-sm);background:var(--docs-surface-muted);min-width:min(100%,18rem);max-width:100%;padding:calc(var(--spacing) * 3);overflow:auto;container-type:inline-size}.dark .WebPlatformCapabilityDemos-module__F5hfbW__adaptiveShell{border-color:var(--docs-border-dark);background:#ffffff08}.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveHeader{color:var(--docs-text-quaternary);font-size:var(--text-xs);line-height:var(--text-xs--line-height)}.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveBody{gap:calc(var(--spacing) * 3);margin-top:calc(var(--spacing) * 3);display:grid}.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveMetric{gap:calc(var(--spacing) * 1);border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface);min-width:0;padding:calc(var(--spacing) * 3);flex-direction:column;display:flex}.dark .WebPlatformCapabilityDemos-module__F5hfbW__adaptiveMetric{border-color:var(--docs-border-dark);background:var(--docs-code-bg-dark)}.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveMetric strong{font-size:var(--text-3xl);line-height:var(--text-3xl--line-height);color:var(--docs-text)}.dark :is(.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveMetric strong){color:var(--docs-text-dark)}.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveMetric span{font-size:var(--text-sm);color:var(--docs-text-muted)}.dark :is(.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveMetric span){color:var(--docs-text-muted-dark)}.WebPlatformCapabilityDemos-module__F5hfbW__attrMeter{height:calc(var(--spacing) * 3);border-radius:var(--ui-radius-xxs);background:var(--docs-border);grid-column:1/-1;position:relative;overflow:hidden}.WebPlatformCapabilityDemos-module__F5hfbW__attrMeter:before{width:var(--progress-fallback,72%);border-radius:inherit;background:var(--docs-primary);content:"";position:absolute;inset-block:0;inset-inline-start:0}@supports (width:attr(data-progress type(<percentage>), 50%)){.WebPlatformCapabilityDemos-module__F5hfbW__attrMeter:before{width:attr(data-progress type(<percentage>), var(--progress-fallback,50%))}}@container (min-width:34rem){.WebPlatformCapabilityDemos-module__F5hfbW__adaptiveBody{grid-template-columns:minmax(0,.65fr) minmax(0,1fr);align-items:center}}@media (min-width:48rem){.WebPlatformCapabilityDemos-module__F5hfbW__capabilityGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}.WebPlatformCapabilityDemos-module__F5hfbW__swatchGrid{gap:calc(var(--spacing) * 3);grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;display:grid}.WebPlatformCapabilityDemos-module__F5hfbW__swatch{--swatch-bg:var(--docs-primary);--swatch-fg:var(--docs-primary-foreground);--swatch-chip-bg:#00000029;min-height:calc(var(--spacing) * 24);border:1px solid var(--docs-border);border-radius:var(--ui-radius-sm);background:var(--swatch-bg);color:var(--swatch-fg);padding:calc(var(--spacing) * 3);align-content:space-between;display:grid}@supports (color:contrast-color(white)){.WebPlatformCapabilityDemos-module__F5hfbW__swatch{color:contrast-color(var(--swatch-bg))}}.WebPlatformCapabilityDemos-module__F5hfbW__swatch span{font-size:var(--text-sm);font-weight:var(--font-weight-semibold)}.WebPlatformCapabilityDemos-module__F5hfbW__swatch code{border-radius:var(--ui-radius-xxs);background:var(--swatch-chip-bg);padding:calc(var(--spacing) * 1) calc(var(--spacing) * 1.5);color:currentColor;font-family:var(--font-mono);font-size:var(--text-xs);justify-self:start}
.WebPlatformCapabilityVisuals-module__PZL2qW__demoSignal{align-items:center;gap:calc(var(--spacing) * 2);border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface-muted);min-width:0;padding:calc(var(--spacing) * 2.5) calc(var(--spacing) * 3);font-size:var(--text-sm);line-height:var(--text-sm--line-height);color:var(--docs-text-muted);flex-wrap:wrap;display:flex}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__demoSignal{border-color:var(--docs-border-dark);color:var(--docs-text-muted-dark);background:#ffffff08}.WebPlatformCapabilityVisuals-module__PZL2qW__demoSignal span{font-weight:var(--font-weight-semibold);color:var(--docs-primary)}.WebPlatformCapabilityVisuals-module__PZL2qW__demoSignal strong{font-weight:var(--font-weight-medium);color:var(--docs-text)}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__demoSignal strong){color:var(--docs-text-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__controlRow,.WebPlatformCapabilityVisuals-module__PZL2qW__controlGroup,.WebPlatformCapabilityVisuals-module__PZL2qW__nativeFallbackGrid{gap:calc(var(--spacing) * 2);flex-wrap:wrap;min-width:0;display:flex}.WebPlatformCapabilityVisuals-module__PZL2qW__controlRow{justify-content:space-between}.WebPlatformCapabilityVisuals-module__PZL2qW__controlButton{min-height:calc(var(--spacing) * 9);border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface);color:var(--docs-text-muted);padding-inline:calc(var(--spacing) * 3);font:inherit;font-size:var(--text-sm);font-weight:var(--font-weight-medium);transition:border-color .15s var(--ease-out), background-color .15s var(--ease-out), color .15s var(--ease-out)}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__controlButton{border-color:var(--docs-border-dark);background:var(--docs-code-bg-dark);color:var(--docs-text-muted-dark)}@media (hover:hover){.WebPlatformCapabilityVisuals-module__PZL2qW__controlButton:hover{border-color:var(--docs-primary);color:var(--docs-text);background:var(--docs-surface-hover)}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__controlButton:hover{color:var(--docs-text-dark)}}.WebPlatformCapabilityVisuals-module__PZL2qW__controlButtonActive{border-color:var(--docs-primary);background:var(--docs-primary-10);color:var(--docs-primary)}.WebPlatformCapabilityVisuals-module__PZL2qW__nativeFallbackGrid{color:var(--docs-text-muted);font-size:var(--text-xs);line-height:var(--text-xs--line-height);grid-template-columns:1fr;display:grid}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__nativeFallbackGrid{color:var(--docs-text-muted-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__nativeFallbackGrid span{border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface);padding:calc(var(--spacing) * 2.5)}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__nativeFallbackGrid span){border-color:var(--docs-border-dark);background:#ffffff08}.WebPlatformCapabilityVisuals-module__PZL2qW__nativeFallbackGrid strong{color:var(--docs-text)}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__nativeFallbackGrid strong){color:var(--docs-text-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__nativeFallbackGrid code{font-family:var(--font-mono);color:var(--docs-primary)}.WebPlatformCapabilityVisuals-module__PZL2qW__microLabel{font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-semibold);color:currentColor;opacity:.72}.WebPlatformCapabilityVisuals-module__PZL2qW__anchorWorkbench{min-height:calc(var(--spacing) * 64);border:1px solid var(--docs-border);border-radius:var(--ui-radius-sm);background:linear-gradient(var(--docs-border) 1px, transparent 1px), linear-gradient(90deg, var(--docs-border) 1px, transparent 1px), var(--docs-surface-muted);padding:calc(var(--spacing) * 5);background-size:32px 32px;grid-template:"top-left top-right"1fr"bottom-left bottom-right"1fr/1fr 1fr;display:grid;position:relative;overflow:hidden}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__anchorWorkbench{border-color:var(--docs-border-dark);background:linear-gradient(var(--docs-border-dark) 1px, transparent 1px), linear-gradient(90deg, var(--docs-border-dark) 1px, transparent 1px), #ffffff08}.WebPlatformCapabilityVisuals-module__PZL2qW__anchorTrigger{anchor-name:--platform-demo-anchor;z-index:1;border:1px solid var(--docs-primary);border-radius:var(--ui-radius-xs);background:var(--docs-primary);color:var(--docs-primary-foreground);padding:calc(var(--spacing) * 2.5) calc(var(--spacing) * 3.5);font:inherit;font-size:var(--text-sm);font-weight:var(--font-weight-semibold);box-shadow:var(--ui-shadow-soft);place-self:center}.WebPlatformCapabilityVisuals-module__PZL2qW__anchorSlotTopLeft .WebPlatformCapabilityVisuals-module__PZL2qW__anchorTrigger{grid-area:top-left}.WebPlatformCapabilityVisuals-module__PZL2qW__anchorSlotTopRight .WebPlatformCapabilityVisuals-module__PZL2qW__anchorTrigger{grid-area:top-right}.WebPlatformCapabilityVisuals-module__PZL2qW__anchorSlotBottomLeft .WebPlatformCapabilityVisuals-module__PZL2qW__anchorTrigger{grid-area:bottom-left}.WebPlatformCapabilityVisuals-module__PZL2qW__anchorSlotBottomRight .WebPlatformCapabilityVisuals-module__PZL2qW__anchorTrigger{grid-area:bottom-right}.WebPlatformCapabilityVisuals-module__PZL2qW__anchorPopover{width:min(17rem, calc(100% - calc(var(--spacing) * 10)));gap:calc(var(--spacing) * 1);border:1px solid var(--docs-border);border-radius:var(--ui-radius-sm);background:var(--docs-surface);padding:calc(var(--spacing) * 3);color:var(--docs-text-muted);font-size:var(--text-sm);line-height:var(--text-sm--line-height);box-shadow:var(--ui-shadow-soft);flex-direction:column;display:flex;position:absolute;inset-block-start:calc(var(--spacing) * 17);inset-inline-start:calc(var(--spacing) * 5)}@supports (position-anchor:--platform-demo-anchor){.WebPlatformCapabilityVisuals-module__PZL2qW__anchorPopover{position-anchor:--platform-demo-anchor;position-area:inline-end center;margin-inline-start:calc(var(--spacing) * 4);inset:auto}}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__anchorPopover{border-color:var(--docs-border-dark);background:var(--docs-code-bg-dark);color:var(--docs-text-muted-dark)}@supports (position-anchor:--platform-demo-anchor){.WebPlatformCapabilityVisuals-module__PZL2qW__anchorSlotTopRight .WebPlatformCapabilityVisuals-module__PZL2qW__anchorPopover,.WebPlatformCapabilityVisuals-module__PZL2qW__anchorSlotBottomRight .WebPlatformCapabilityVisuals-module__PZL2qW__anchorPopover{position-area:inline-start center;margin-inline:0 calc(var(--spacing) * 4)}}.WebPlatformCapabilityVisuals-module__PZL2qW__anchorPopover strong{color:var(--docs-text)}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__anchorPopover strong){color:var(--docs-text-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionWorkbench{gap:calc(var(--spacing) * 3);display:grid}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionSurface{view-transition-name:WebPlatformCapabilityVisuals-module__PZL2qW__platform-demo-surface;min-height:calc(var(--spacing) * 52);gap:calc(var(--spacing) * 4);border:1px solid var(--docs-border);border-radius:var(--ui-radius-sm);background:var(--docs-surface-muted);padding:calc(var(--spacing) * 5);transition:background-color .18s var(--ease-out), min-height .18s var(--ease-out);align-content:center;display:grid}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__transitionSurface{border-color:var(--docs-border-dark);background:#ffffff08}::view-transition-group(platform-demo-surface){animation-duration:.42s;animation-timing-function:var(--ease-out)}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionSurfaceFocus{min-height:calc(var(--spacing) * 66);background:var(--docs-primary-10)}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionTopline,.WebPlatformCapabilityVisuals-module__PZL2qW__transitionTrace,.WebPlatformCapabilityVisuals-module__PZL2qW__transferComparison{justify-content:space-between;align-items:center;gap:calc(var(--spacing) * 2);flex-wrap:wrap;min-width:0;display:flex}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionTopline span{font-size:var(--text-xs);font-weight:var(--font-weight-semibold);color:var(--docs-primary);text-transform:uppercase}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionTopline code,.WebPlatformCapabilityVisuals-module__PZL2qW__contrastPreview code{border-radius:var(--ui-radius-xxs);padding:calc(var(--spacing) * 1) calc(var(--spacing) * 1.5);color:currentColor;font-family:var(--font-mono);font-size:var(--text-xs);background:#00000014}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionCanvas{min-height:calc(var(--spacing) * 30);gap:calc(var(--spacing) * 2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionCanvas span{border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface)}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__transitionCanvas span){border-color:var(--docs-border-dark);background:var(--docs-bg-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionNodePrimary{background:var(--docs-primary-10)!important}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionSurfaceFocus .WebPlatformCapabilityVisuals-module__PZL2qW__transitionNodePrimary{grid-column:span 2}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionDetailRail{min-height:calc(var(--spacing) * 12);grid-column:span 3}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionSurface p,.WebPlatformCapabilityVisuals-module__PZL2qW__contrastPreview p{color:var(--docs-text-muted);font-size:var(--text-sm);line-height:var(--text-sm--line-height);margin:0}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__transitionSurface p,.WebPlatformCapabilityVisuals-module__PZL2qW__contrastPreview p){color:var(--docs-text-muted-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionTrace{color:var(--docs-text-quaternary);font-family:var(--font-mono);font-size:var(--text-xs)}.WebPlatformCapabilityVisuals-module__PZL2qW__transitionTrace span{border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface);padding:calc(var(--spacing) * 2);text-align:center;flex:8rem}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__transitionTrace span){border-color:var(--docs-border-dark);background:#ffffff08}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollWorkbench{gap:calc(var(--spacing) * 3);display:grid}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollViewport{max-height:calc(var(--spacing) * 88);overscroll-behavior:contain;border:1px solid var(--docs-border);border-radius:var(--ui-radius-sm);background:var(--docs-surface-muted);padding:calc(var(--spacing) * 3);scroll-snap-type:y proximity;overflow-y:auto}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__scrollViewport{border-color:var(--docs-border-dark);background:#ffffff08}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollStickyHeader{z-index:2;justify-content:space-between;align-items:center;gap:calc(var(--spacing) * 2);border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:color-mix(in srgb, var(--docs-surface) 92%, transparent);min-width:0;padding:calc(var(--spacing) * 2);color:var(--docs-text-muted);font-size:var(--text-xs);line-height:var(--text-xs--line-height);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);flex-wrap:wrap;display:flex;position:sticky;inset-block-start:0}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__scrollStickyHeader{border-color:var(--docs-border-dark);background:color-mix(in srgb, var(--docs-code-bg-dark) 90%, transparent);color:var(--docs-text-muted-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollStickyHeader code{font-family:var(--font-mono);color:var(--docs-primary)}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollSpacer{min-height:calc(var(--spacing) * 18)}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealCard{view-timeline-name:--scroll-demo-card;view-timeline-axis:block;min-height:calc(var(--spacing) * 34);scroll-snap-align:center;gap:calc(var(--spacing) * 2);border:1px solid var(--docs-border);border-radius:var(--ui-radius-sm);background:var(--docs-surface);padding:calc(var(--spacing) * 4);align-content:center;animation:linear both WebPlatformCapabilityVisuals-module__PZL2qW__scroll-card-reveal;animation-timeline:--scroll-demo-card;animation-range:entry cover 55%;display:grid}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealCard{border-color:var(--docs-border-dark);background:var(--docs-code-bg-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealIndex{font-family:var(--font-mono);color:var(--docs-primary);font-size:var(--text-xs)}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealCard strong{color:var(--docs-text);font-size:var(--text-lg);line-height:var(--text-lg--line-height)}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealCard strong){color:var(--docs-text-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealCard p{color:var(--docs-text-muted);font-size:var(--text-sm);line-height:var(--text-sm--line-height);margin:0}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealCard p){color:var(--docs-text-muted-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealMeter{height:calc(var(--spacing) * 2);border-radius:var(--ui-radius-xxs);background:var(--docs-border);position:relative;overflow:hidden}.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealMeter:before{border-radius:inherit;background:var(--docs-primary);content:"";transform-origin:0;width:100%;animation:linear both WebPlatformCapabilityVisuals-module__PZL2qW__scroll-meter-fill;animation-timeline:--scroll-demo-card;animation-range:entry cover 55%;position:absolute;inset-block:0;inset-inline-start:0;transform:scaleX(.18)}.WebPlatformCapabilityVisuals-module__PZL2qW__adaptiveWorkbench{width:min(100%,24rem);transition:width .18s var(--ease-out)}.WebPlatformCapabilityVisuals-module__PZL2qW__adaptiveWorkbenchWide{width:100%;max-width:100%}.WebPlatformCapabilityVisuals-module__PZL2qW__adaptiveMeter{grid-column:1/-1}.WebPlatformCapabilityVisuals-module__PZL2qW__adaptivePreviewCard{gap:calc(var(--spacing) * 1);border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface);padding:calc(var(--spacing) * 3);display:grid}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__adaptivePreviewCard{border-color:var(--docs-border-dark);background:var(--docs-code-bg-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__adaptivePreviewCard span{color:var(--docs-text-muted);font-size:var(--text-xs)}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__adaptivePreviewCard span){color:var(--docs-text-muted-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__adaptivePreviewCard strong{color:var(--docs-text);font-size:var(--text-base)}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__adaptivePreviewCard strong){color:var(--docs-text-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__contrastWorkbench{gap:calc(var(--spacing) * 3);display:grid}.WebPlatformCapabilityVisuals-module__PZL2qW__swatchButton{cursor:pointer;font:inherit;text-align:left}.WebPlatformCapabilityVisuals-module__PZL2qW__swatchButtonActive{outline:2px solid var(--docs-primary);outline-offset:2px}.WebPlatformCapabilityVisuals-module__PZL2qW__contrastPreview{gap:calc(var(--spacing) * 2);border:1px solid var(--docs-border);border-radius:var(--ui-radius-sm);background:var(--swatch-bg);color:var(--swatch-fg);padding:calc(var(--spacing) * 4);display:grid}@supports (color:contrast-color(white)){.WebPlatformCapabilityVisuals-module__PZL2qW__contrastPreview{color:contrast-color(var(--swatch-bg))}}.WebPlatformCapabilityVisuals-module__PZL2qW__contrastPreview strong{font-size:var(--text-xl);line-height:var(--text-xl--line-height)}.WebPlatformCapabilityVisuals-module__PZL2qW__contrastPreview p{color:currentColor;opacity:.78}.WebPlatformCapabilityVisuals-module__PZL2qW__contrastPreview code{background:var(--swatch-chip-bg);justify-self:start}.WebPlatformCapabilityVisuals-module__PZL2qW__transferComparison{border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface);padding:calc(var(--spacing) * 3)}.dark .WebPlatformCapabilityVisuals-module__PZL2qW__transferComparison{border-color:var(--docs-border-dark);background:#ffffff08}.WebPlatformCapabilityVisuals-module__PZL2qW__transferComparison div{gap:calc(var(--spacing) * 1);display:grid}.WebPlatformCapabilityVisuals-module__PZL2qW__transferComparison span{color:var(--docs-text-quaternary);font-size:var(--text-xs)}.WebPlatformCapabilityVisuals-module__PZL2qW__transferComparison strong{color:var(--docs-text);font-size:var(--text-sm)}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__transferComparison strong){color:var(--docs-text-dark)}.WebPlatformCapabilityVisuals-module__PZL2qW__securityPipeline{gap:calc(var(--spacing) * 2);display:grid}.WebPlatformCapabilityVisuals-module__PZL2qW__securityPipeline span{border:1px solid var(--docs-border);border-radius:var(--ui-radius-xs);background:var(--docs-surface-muted);padding:calc(var(--spacing) * 3);color:var(--docs-text);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);position:relative}.dark :is(.WebPlatformCapabilityVisuals-module__PZL2qW__securityPipeline span){border-color:var(--docs-border-dark);color:var(--docs-text-dark);background:#ffffff08}@keyframes WebPlatformCapabilityVisuals-module__PZL2qW__scroll-card-reveal{0%{opacity:.36;transform:translateY(18px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes WebPlatformCapabilityVisuals-module__PZL2qW__scroll-meter-fill{0%{transform:scaleX(.18)}to{transform:scaleX(1)}}@media (min-width:48rem){.WebPlatformCapabilityVisuals-module__PZL2qW__nativeFallbackGrid,.WebPlatformCapabilityVisuals-module__PZL2qW__contrastWorkbench,.WebPlatformCapabilityVisuals-module__PZL2qW__securityPipeline{grid-template-columns:repeat(2,minmax(0,1fr))}.WebPlatformCapabilityVisuals-module__PZL2qW__securityPipeline{grid-template-columns:repeat(3,minmax(0,1fr))}}@media not (min-width:42rem){.WebPlatformCapabilityVisuals-module__PZL2qW__anchorWorkbench{min-height:calc(var(--spacing) * 58);padding:calc(var(--spacing) * 4)}}@media (prefers-reduced-motion:reduce){.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealCard,.WebPlatformCapabilityVisuals-module__PZL2qW__scrollRevealMeter:before{animation:none}::view-transition-group(platform-demo-surface){animation:none}}
