/* English result only. Existing form, Chinese layout and gesture styles are unchanged. */
.sunnys-maya-calendar__name-output[data-maya-name-language="en"] .sunnys-maya-calendar__name-blocks {
  grid-auto-rows: minmax(var(--maya-name-glyph-height), auto);
  row-gap: 16px;
}
.sunnys-maya-calendar__name-output[data-maya-name-language="en"] .sunnys-maya-calendar__name-block[data-maya-name-character] > figcaption {
  display: block;
  overflow-wrap: anywhere;
  line-height: 1.2;
}
.sunnys-maya-calendar__name-output[data-maya-name-language="en"] .sunnys-maya-calendar__name-caption-reading {
  display: block;
  overflow: visible;
  white-space: normal;
  overflow-wrap: anywhere;
  text-overflow: clip;
}
.sunnys-maya-calendar__name-output[data-maya-name-language="en"] .sunnys-maya-calendar__name-hanzi strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* Naming result preparation only; keep it measurable outside normal flow. */
.sunnys-maya-calendar__name-output[data-maya-name-preparation] {
  position: absolute;
  top: 0;
  left: 0;
  visibility: hidden;
  pointer-events: none;
  overflow: clip;
  contain: paint;
}
.sunnys-maya-calendar__name-glyph-stage > svg.sunnys-maya-calendar__name-calendar-composite {
  width: calc(var(--maya-name-glyph-height) * 2);
  max-width: none;
  height: var(--maya-name-glyph-height);
  overflow: visible;
  color: #f8dfa0;
}

/* Keep the existing reading help visible in its original form position. */
.sunnys-maya-calendar__name-form > .sunnys-maya-calendar__name-help {
  position: static;
  grid-column: 1 / -1;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
  overflow-wrap: anywhere;
  color: var(--maya-ink-muted);
  font-size: 12px;
  line-height: 1.55;
}
