.segment{display:inline-flex;align-items:center;background-color:var(--color-segment-background);box-shadow:inset 0 0 0 1px var(--color-segment-border);border-radius:var(--radius-2xl);padding:2px;height:36px;position:relative}.segment__indicator{position:absolute;top:2px;left:0;height:calc(100% - 4px);background-color:var(--color-segment-indicator-background);box-shadow:inset 0 0 0 1px var(--color-segment-indicator-border),var(--shadow-segment);border-radius:var(--radius-xl);transition:left var(--duration-normal) cubic-bezier(.4,0,.2,1),width var(--duration-normal) cubic-bezier(.4,0,.2,1);z-index:0;pointer-events:none}.segment__option{display:flex;align-items:center;justify-content:center;gap:6px;flex:1;height:100%;padding:0 var(--spacing-md);border:none;border-radius:var(--radius-xl);background:transparent;font-family:var(--font-compact);font-weight:var(--font-medium);font-size:var(--text-xs);color:var(--color-segment-foreground);cursor:pointer;transition:color var(--duration-normal) var(--ease-out);white-space:nowrap;min-width:96px;position:relative;z-index:1}.segment__option:hover:not(.segment__option--active){color:var(--color-segment-hover-foreground)}.segment__option--active{color:var(--color-segment-active-foreground)}.segment__option--disabled{color:var(--color-segment-disabled-foreground);cursor:not-allowed;opacity:.6}.segment__option--disabled:hover{color:var(--color-segment-disabled-foreground)}.segment__option img,.segment__option svg{width:16px;height:16px;flex-shrink:0}@media(prefers-reduced-motion:reduce){.segment__indicator,.segment__option{transition:none}}@media(forced-colors:active){.segment{outline:1px solid CanvasText;background:Canvas}.segment__indicator{forced-color-adjust:none;background:Highlight;box-shadow:none}.segment__option--active{color:HighlightText}.segment__option--disabled{color:GrayText}}
