@layer components{.tabs_wrap{--_dir:1;--_interval:6s;--_slide:.5s;gap:var(--space-6);width:100%;display:grid}@media (min-width:48rem){.tabs_wrap.side{grid-template-columns:minmax(0,1fr) minmax(0,2fr);align-items:start}}.tabs_bar{flex-direction:column;min-width:0;display:flex}.tabs_wrap.media{gap:var(--spacing-4xl)}.tabs_wrap.media .tabs_bar{order:1}.tabs_wrap.media .tabs_links{gap:var(--spacing-sm);scroll-snap-type:x mandatory;scroll-padding-inline:0}@media (min-width:64rem){.tabs_wrap.media .tabs_links{gap:var(--spacing-md)}}.tabs_wrap.media .tabs_link{width:14.75rem;min-width:0;padding:calc(1.125rem + var(--border-width)) 0 0;border-bottom:0;border-top:var(--border-width) solid var(--color-border-subtle);color:var(--text);text-align:start;opacity:.6;scroll-snap-align:start;transition:opacity var(--hover-duration) var(--hover-ease);flex:none}@media (min-width:64rem){.tabs_wrap.media .tabs_link{flex:1 1 0;width:auto}}.tabs_wrap.media .tabs_link.is-active{opacity:1;border-top:calc(var(--border-width) * 2) solid var(--color-border-accent);padding-top:1.125rem}@media (hover:hover){.tabs_wrap.media .tabs_link:hover{opacity:1}}.tabs_links{scrollbar-width:none;min-width:0;display:flex;overflow-x:auto}.tabs_wrap.side .tabs_links{gap:var(--space-2);flex-direction:column;overflow-x:visible}.tabs_link{min-width:8rem;padding-block:var(--space-3);border-bottom:var(--border-width) solid var(--border);color:color-mix(in lab, currentcolor 60%, transparent);text-align:center;transition:color var(--hover-duration) var(--hover-ease), border-color var(--hover-duration) var(--hover-ease);background:0 0;flex:1}.tabs_link.is-active{border-bottom-color:var(--text);color:var(--text)}@media (hover:hover){.tabs_link:hover{color:var(--text)}}.tabs_wrap.side .tabs_link{min-width:0;padding:var(--space-3) var(--space-5);border:var(--border-width) solid var(--border);border-radius:var(--radius-round);text-align:start;flex:none}.tabs_wrap.side .tabs_link.is-active{background-color:var(--text);color:var(--background)}.tabs_wrap.auto:not(.side) .tabs_link.is-active{position:relative}.tabs_wrap.auto:not(.side) .tabs_link.is-active:after{content:"";inset-inline:0;bottom:calc(var(--border-width) * -1);height:var(--border-width);background-color:var(--text);transform-origin:0;position:absolute;scale:0 1}.tabs_wrap.auto:not(.side).running:not(.is-paused) .tabs_link.is-active{border-bottom-color:var(--border)}.tabs_wrap.auto:not(.side).running:not(.is-paused) .tabs_link.is-active:after{animation:tabs-progress var(--_interval) linear forwards}@keyframes tabs-progress{0%{scale:0 1}to{scale:1}}.tabs_panels{min-width:0;display:grid;overflow:clip}.tabs_panels>*{opacity:0;visibility:hidden;min-width:0;transition:opacity var(--open-duration) var(--open-ease), visibility var(--open-duration) var(--open-ease);grid-area:1/1}.tabs_wrap:not(.is-ready) :is(.tabs_panels>*):first-child,.tabs_panels>*.is-active{opacity:1;visibility:visible}.stacki-designer .tabs_wrap.preview .tabs_panels{gap:var(--space-6);overflow:visible}.stacki-designer .tabs_wrap.preview .tabs_panels>*{opacity:1;visibility:visible;grid-area:auto;animation:none;translate:none}.tabs_wrap.auto[data-moved] .tabs_panels>*.is-active{animation:tabs-in var(--_slide) var(--open-ease) both}.tabs_wrap.auto[data-moved] .tabs_panels>*.is-leaving{visibility:visible;animation:tabs-out var(--_slide) var(--open-ease) both}@keyframes tabs-in{0%{translate:calc(var(--_dir) * 100%) 0;opacity:0}to{opacity:1;translate:0}}@keyframes tabs-out{0%{opacity:1;translate:0}to{translate:calc(var(--_dir) * -100%) 0;opacity:0}}.tabs_controls{justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}.tabs_steps{gap:var(--space-2);display:flex}.tabs_link.media{align-items:center;gap:var(--spacing-md);display:flex}.tabs_link.media .tabs_link_thumb{flex:none;width:6rem;height:4rem}.tabs_link.media .tabs_link_body{flex-direction:column;gap:.375rem;min-width:0;display:flex}.tabs_link.media .tabs_link_index{color:var(--color-text-tertiary)}.tabs_link.media.is-active .tabs_link_index{color:var(--color-text-accent)}.tabs_link.media .tabs_link_text{font-family:var(--ui-label-font-family);font-size:var(--ui-label);font-weight:var(--ui-label-font-weight);line-height:var(--ui-label-line-height);letter-spacing:var(--ui-label-letter-spacing);white-space:nowrap}}