.slot-text {
  display: inline-flex;
  white-space: pre;
}

.char-slot {
  position: relative;
  display: inline-flex;
  /* Cells must never flex-shrink. When a cell's overflow stops being visible
     (e.g. .is-resizing), its automatic minimum size drops to 0, and a
     width-constrained line would crush those cells into overlapping slivers
     instead of letting the row overflow like it does at rest. */
  flex: none;
  justify-content: center;
  /* Clip only vertically: the roll needs a top/bottom mask, but glyph side
     bearings, kerning overhang and the settle tilt must stay visible so
     letters never look cropped. (overflow: hidden is the legacy fallback.) */
  overflow: hidden;
  overflow-x: visible;
  overflow-y: clip;
  line-height: 1.3;
  vertical-align: bottom;
}

/* Cells appearing from or collapsing to empty change width drastically, so
   clip them on both axes while they resize — otherwise their glyphs spill
   out of the shrinking cell and stack up over the neighbours. */
.char-slot.is-resizing {
  overflow-x: clip;
}

.char-sizer {
  visibility: hidden;
  white-space: pre;
}

.char-face {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: pre;
  will-change: transform;
}