/* A26 Stepper · v1.0.0-alpha.0012 */
@layer a26.components {
  .a26-stepper-field { display: flex; align-items: end; gap: 10px; flex-wrap: wrap; }
  .a26-stepper { width: var(--a26-stepper-width); height: var(--a26-stepper-height); display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border-radius: var(--a26-stepper-radius); background: var(--a26-stepper-bg); box-shadow: inset 0 0 0 1px var(--a26-separator); }
  .a26-stepper button { border: 0; background: transparent; color: var(--a26-accent); font: var(--a26-font-headline); cursor: pointer; }
  .a26-stepper button + button { border-inline-start: 1px solid var(--a26-separator); }
  .a26-stepper button:hover { background: var(--a26-fill-quaternary); }
  .a26-stepper button:active { background: var(--a26-fill-secondary); }
  .a26-stepper button:focus-visible { outline: 3px solid color-mix(in srgb, var(--a26-focus-ring-color) 60%, transparent); outline-offset: -3px; }
}