/* names.css: /names. Name parts as the game's word rows, generated place and region names in the
   zone-name green of the game's zone banner (docs/LOOK.md --c-zone, "LANDS OF MIRADOR"). */
.nm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(26rem, 100%), 1fr)); gap: 0 var(--sp-4); align-items: start; }
.nm-grid > .card { margin: 0 0 var(--sp-4); }
.nm-grid > .card > h3:first-child { margin-top: 0; }
.nm-sec { scroll-margin-top: var(--sp-4); }
.nm-who { display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-3); list-style: none; padding: 0; margin: 0 0 var(--sp-3); }
.nm-parts { margin: 0 0 var(--sp-3); }
.nm-row { display: grid; grid-template-columns: 9rem 1fr; gap: var(--sp-3); padding: var(--sp-1) 0; border-bottom: var(--u) solid var(--c-line); }
@media (max-width: 719px) { .nm-row { grid-template-columns: 1fr; gap: 0; } }
.nm-row dt { color: var(--c-ink-soft); font-size: var(--fs-s); }
.nm-row dd { margin: 0; min-width: 0; }
.nm-slot { display: flex; flex-wrap: wrap; gap: 0 var(--sp-2); list-style: none; padding: 0; margin: 0; color: var(--c-value); }
.nm-ex { list-style: none; padding: 0; margin: 0 0 var(--sp-3); display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-4); }
.nm-name {
  font-family: var(--font-pixel-small); font-size: var(--px-2); line-height: calc(28 / 24);
  text-shadow: var(--outline); -webkit-font-smoothing: none; font-smooth: never;
  color: var(--c-ink); overflow-wrap: anywhere;
}
.nm-zone { color: var(--c-zone); }
.nm-gen { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3); margin: 0; }
.nm-gen output { min-height: calc(var(--px-2) * 28 / 24); }
