@layer reading-world {
  .reading-world__number {
    overflow: visible;
  }

  .reading-world__number-digits {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    font: inherit;
    font-variant-numeric: tabular-nums lining-nums;
    letter-spacing: inherit;
    line-height: inherit;
    white-space: nowrap;
  }

  .reading-world__number-digit,
  .reading-world__number-separator {
    flex: 0 0 auto;
    font: inherit;
    font-variant-numeric: tabular-nums lining-nums;
    letter-spacing: inherit;
    line-height: inherit;
  }

  .reading-world__number-digit {
    display: inline-grid;
    inline-size: 1ch;
    min-inline-size: 1ch;
    min-block-size: 1.16em;
    place-items: center;
    padding-block: 0.08em;
  }

  .reading-world__number-digit--flipping {
    overflow: clip;
  }

  .reading-world__number-separator {
    display: inline-block;
    min-block-size: 1.16em;
    padding-block: 0.08em;
  }

  .reading-world__number-digit--flipping .reading-world__number-step {
    grid-area: 1 / 1;
  }
}
