.snap-toggle[data-astro-cid-vkkb6ptd]{flex-basis:100%;inline-size:100%}[data-lab-root=css-carousel] [data-radio-group]{flex:16rem;min-inline-size:0}[data-lab-root=css-carousel][data-carousel-orientation=vertical] [data-radio-group=markerPosition] .option-icon{transform-box:fill-box;transform-origin:50%;margin-block:.375rem;transform:rotate(-90deg)}.preview-surface[data-astro-cid-vkkb6ptd]{align-content:center;gap:var(--gap);min-block-size:0;inline-size:100%;min-inline-size:0;padding-block:var(--padding-sm);display:grid}.preview-heading[data-astro-cid-vkkb6ptd]{inline-size:min(100%,48rem);margin-inline:auto;&>p[data-astro-cid-vkkb6ptd]{color:var(--text-muted);text-align:center;margin-inline:auto;font-size:1rem}}.carousel[data-astro-cid-vkkb6ptd]{anchor-name:--preview-carousel;gap:var(--carousel-gap);scroll-behavior:var(--scroll-behavior);scroll-marker-group:var(--scroll-marker-group);margin:0 auto;padding:0;display:flex;&:focus-visible{outline:3px solid color-mix(in oklch, var(--interaction-color) 54%, transparent);outline-offset:4px}&>.slide[data-astro-cid-vkkb6ptd]{flex:0 0 var(--slide-width);min-inline-size:0;list-style:none;&::scroll-marker{content:"";inline-size:var(--marker-size);block-size:var(--marker-size);border:2px solid var(--marker-color);cursor:pointer;background:#fff;border-radius:50%;transition:background-color .2s,border-color .2s,scale .2s}}&>.slide[data-astro-cid-vkkb6ptd]::scroll-marker:hover{border-color:var(--interaction-color);background:color-mix(in oklch, var(--interaction-color) 18%, #fff)}&>.slide[data-astro-cid-vkkb6ptd]::scroll-marker:focus-visible{outline:3px solid color-mix(in oklch, var(--interaction-color) 38%, transparent);outline-offset:2px}&>.slide[data-astro-cid-vkkb6ptd]::scroll-marker:target-current{border-color:var(--active-marker-color);background:var(--active-marker-color);box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--active-marker-color);scale:1.1}&::scroll-marker-group{justify-content:center;align-items:center;gap:.75rem;display:flex}&::scroll-button(*){position-anchor:--preview-carousel;z-index:2;background:var(--button-color);color:#fff;block-size:2.5rem;inline-size:2.5rem;font:inherit;cursor:pointer;border:0;border-radius:50%;place-items:center;padding:0;font-size:1.15rem;transition:background-color .2s,opacity .2s,scale .2s;display:grid;position:absolute;box-shadow:0 .75rem 2rem oklch(0% none none/.28)}&::scroll-button(*):hover{background:var(--interaction-color);scale:1.08}&::scroll-button(*):focus-visible{outline:3px solid color-mix(in oklch, var(--interaction-color) 42%, transparent);outline-offset:3px}&::scroll-button(*):disabled{opacity:.3;cursor:not-allowed;scale:.92}}.preview-surface[data-astro-cid-vkkb6ptd][data-orientation=horizontal] .carousel[data-astro-cid-vkkb6ptd]{overscroll-behavior-inline:contain;flex-direction:row;inline-size:min(100%,48rem);overflow-x:auto;&::scroll-button(inline-start){content:var(--button-start-content);position-area:left center;translate:60%}&::scroll-button(inline-end){content:var(--button-end-content);position-area:right center;translate:-60%}}.preview-surface[data-astro-cid-vkkb6ptd][data-orientation=vertical] .carousel[data-astro-cid-vkkb6ptd]{overscroll-behavior-block:contain;flex-direction:column;block-size:min(28rem,72dvh);inline-size:min(100% - 4rem,36rem);overflow-y:auto;&::scroll-button(block-start){content:var(--button-start-content);position-area:center top;translate:0 60%}&::scroll-button(block-end){content:var(--button-end-content);position-area:center bottom;translate:0 -60%}&>.slide[data-astro-cid-vkkb6ptd] .slide-card{block-size:100%}}.preview-surface[data-astro-cid-vkkb6ptd][data-orientation=horizontal] .carousel[data-astro-cid-vkkb6ptd]::scroll-marker-group{flex-direction:row;padding-block:1.25rem .5rem}.preview-surface[data-astro-cid-vkkb6ptd][data-orientation=vertical] .carousel[data-astro-cid-vkkb6ptd]::scroll-marker-group{position-anchor:--preview-carousel;flex-direction:column;padding-inline:.75rem;position:absolute}.preview-surface[data-astro-cid-vkkb6ptd][data-orientation=vertical][data-marker-position=before] .carousel[data-astro-cid-vkkb6ptd]::scroll-marker-group{position-area:left center}.preview-surface[data-astro-cid-vkkb6ptd][data-orientation=vertical][data-marker-position=after] .carousel[data-astro-cid-vkkb6ptd]::scroll-marker-group{position-area:right center}.preview-surface[data-astro-cid-vkkb6ptd][data-snap-enabled] .carousel[data-astro-cid-vkkb6ptd]{scroll-snap-type:var(--scroll-snap-type);&>.slide[data-astro-cid-vkkb6ptd]{scroll-snap-align:var(--scroll-snap-align)}}.preview-surface[data-astro-cid-vkkb6ptd][data-snap-stop] .carousel[data-astro-cid-vkkb6ptd]>.slide[data-astro-cid-vkkb6ptd]{scroll-snap-stop:always}.preview-surface[data-astro-cid-vkkb6ptd][data-hide-scrollbar] .carousel[data-astro-cid-vkkb6ptd]{scrollbar-width:none}.slide-card[data-astro-cid-vkkb6ptd]{border:1px solid color-mix(in oklch, var(--slide-accent) 72%, #172033);border-radius:calc(var(--radius) * 1.2);corner-shape:var(--corner-shape);background:var(--slide-accent);color:#172033;align-content:end;gap:.45rem;min-block-size:clamp(16rem,42dvh,23rem);padding:clamp(1.25rem,4vw,2.5rem);display:grid;& h2{text-wrap:balance;max-inline-size:16ch;margin:0;font-size:clamp(1.65rem,5vw,3rem);line-height:.95}&>p[data-astro-cid-vkkb6ptd]:last-child{color:#172033d1;text-wrap:pretty;max-inline-size:46ch}}.slide-eyebrow[data-astro-cid-vkkb6ptd]{color:#172033b8;font-size:.75rem;font-weight:var(--font-weight-bold);letter-spacing:.09em;text-transform:uppercase}.support-note[data-astro-cid-vkkb6ptd]{inline-size:min(100%,48rem);padding:var(--padding-sm) var(--padding);border-inline-start:3px solid var(--brand-orange);border-radius:calc(var(--radius) * .6);background:color-mix(in oklch, var(--brand-orange) 12%, transparent);color:var(--text-muted);margin-inline:auto;font-size:.8rem;@supports (scroll-marker-group:after) and selector(.slide::scroll-marker){display:none}}[data-lab-root=css-carousel] .preview-code{@media (width<=90rem){grid-template-rows:auto auto}}[data-lab-root=css-carousel] .preview{overflow:visible;@media (width<=90rem){min-block-size:0}}@media (prefers-reduced-motion:reduce){.carousel[data-astro-cid-vkkb6ptd]{scroll-behavior:auto;&>.slide[data-astro-cid-vkkb6ptd]::scroll-marker{transition:none}&::scroll-button(*){transition:none}}}