.tabs{min-width:0;display:grid;gap:24px}.tab-list{position:relative;isolation:isolate;display:flex;gap:4px;overflow-x:auto;padding:4px;background:color-mix(in srgb,var(--ink) 6%,transparent);border-radius:var(--radius);min-width:0}.tab-list>button{flex:none;min-height:44px;padding:8px 16px;border:0;border-radius:max(0px,calc(var(--radius) - 4px));background:transparent;color:color-mix(in srgb,var(--muted) 80%,var(--ink));font:inherit;font-weight:500;white-space:nowrap}.tab-list>button[aria-selected=true]{background:color-mix(in srgb,var(--surface) 82%,transparent);color:var(--ink)}.tab-list>button:hover:not(:disabled){color:var(--accent)}.tab-list>button:focus-visible{outline-offset:-2px}.tabs-line>.tab-list{background:transparent;border-radius:0;position:relative;padding:0;box-shadow:inset 0 -1px var(--line)}.tabs-line>.tab-list>button{border-radius:0;border-bottom:2px solid transparent}.tabs-line>.tab-list>button[aria-selected=true]{background:transparent;color:var(--accent)}.tabs>section{min-width:0;overflow-wrap:anywhere}.tabs[data-orientation=vertical]{grid-template-columns:minmax(0,min(12rem,46%)) minmax(0,1fr)}.tabs[data-orientation=vertical]>.tab-list{flex-direction:column;align-self:start}.tabs[data-orientation=vertical]>.tab-list>button{white-space:normal;overflow-wrap:anywhere;text-align:start}@media(prefers-reduced-motion:no-preference){.tab-list>button{transition:color var(--motion-normal) var(--motion-ease),background-color var(--motion-normal) var(--motion-ease),border-color var(--motion-normal) var(--motion-ease)}}.tabs[data-tabs-ready]>.tab-list::after{content:"";position:absolute;left:0;top:0;width:var(--tab-width);height:var(--tab-height);border-radius:max(0px,calc(var(--radius) - 4px));background:color-mix(in srgb,var(--surface) 82%,transparent);z-index:-1;transform:translate(var(--tab-x),var(--tab-y));pointer-events:none}@media(prefers-reduced-motion:no-preference){.tab-list[data-motion-ready]::after{transition:transform var(--motion-normal) var(--motion-ease),width var(--motion-normal) var(--motion-ease),height var(--motion-normal) var(--motion-ease)}}.tabs[data-tabs-ready]>.tab-list>button[aria-selected=true]{background:transparent}.tabs-line[data-tabs-ready]>.tab-list::after{height:2px;border-radius:0;background:var(--accent)}