.side-seg{border:1px solid var(--border);background:var(--bg-subtle);border-radius:999px;grid-auto-columns:1fr;grid-auto-flow:column;gap:2px;max-width:100%;padding:2px;display:inline-grid;position:relative}.side-seg__thumb{background:var(--accent-fill);width:calc(50% - 3px);transition:transform .2s var(--ease-in-out-strong);border-radius:999px;position:absolute;inset:2px auto 2px 2px}.side-seg[data-side=b] .side-seg__thumb{transform:translate(calc(100% + 2px))}.side-seg:has(.side-seg__btn:disabled) .side-seg__thumb{opacity:.4}.side-seg__btn{z-index:1;align-items:center;gap:var(--s-2);min-height:36px;padding:var(--s-1) var(--s-3) var(--s-1) var(--s-2);color:var(--text-secondary);cursor:pointer;transition:color var(--t-fast), transform var(--t-press);background:0 0;border:0;border-radius:999px;font-size:14px;font-weight:500;display:inline-flex;position:relative}.side-seg__tile{background:var(--board-light);border-radius:50%;flex:none;place-items:center;width:26px;height:26px;display:grid}.side-seg__piece{width:22px;height:22px}.side-seg__btn:active:not(:disabled){transform:scale(.97)}.side-seg__btn[aria-pressed=true]{color:var(--on-solid)}.side-seg__btn:disabled{opacity:.4;cursor:not-allowed}.side-seg__btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (width<=560px){.side-seg{display:grid}.side-seg__btn{justify-content:center}}@media (prefers-reduced-motion:reduce){.side-seg__thumb{transition:none}}