.view-toggle.svelte-8071km{--view-toggle-bg: var(--clr-bg-4);--view-toggle-slider-bg: var(--clr-accent-container);--view-toggle-slider-bg-hover: var(--clr-accent-container-hover);--view-toggle-active-color: var(--clr-accent-on-container);--view-toggle-active-color-hover: var(--clr-accent-on-container-hover);--view-toggle-size: var(--btn-height);position:relative;display:inline-grid;grid-auto-flow:column;background:var(--view-toggle-bg);border-radius:var(--border-radius)}.view-toggle--compact.svelte-8071km{--view-toggle-size: var(--btn-height-compact)}.view-toggle-slider.svelte-8071km{position:absolute;inset:0;width:var(--view-toggle-size);height:var(--view-toggle-size);background:var(--view-toggle-slider-bg);border-radius:var(--border-radius);transform:translate(calc(var(--active-index, 0) * var(--view-toggle-size)));transition:var(--transition);pointer-events:none}.view-toggle.svelte-8071km button:where(.svelte-8071km){position:relative;z-index:1;border:0;background:transparent;color:var(--clr-text-2);width:var(--view-toggle-size);height:var(--view-toggle-size);border-radius:var(--border-radius);cursor:pointer;transition:var(--transition);display:inline-flex;align-items:center;justify-content:center;overflow:visible;will-change:transform}.view-toggle.svelte-8071km button:where(.svelte-8071km):active{transform:scale(var(--scale-push-icon))}.view-toggle.svelte-8071km button[aria-pressed=true]:where(.svelte-8071km){color:var(--view-toggle-active-color)}.view-toggle.svelte-8071km button:where(.svelte-8071km) svg{width:1.2rem;height:1.2rem;display:block;flex-shrink:0;overflow:visible}.view-toggle--compact.svelte-8071km button:where(.svelte-8071km) svg{width:1.1rem;height:1.1rem}@media(hover:hover){.view-toggle.svelte-8071km:has(button[aria-pressed=true]:hover) .view-toggle-slider:where(.svelte-8071km){background:var(--view-toggle-slider-bg-hover)}.view-toggle.svelte-8071km button:where(.svelte-8071km):hover{color:var(--clr-accent)}.view-toggle.svelte-8071km button[aria-pressed=true]:where(.svelte-8071km):hover{color:var(--view-toggle-active-color-hover)}}
