/* ============================================================
   Temple Map — mod_totjo_map

   Colours come from the suite's tokens where they exist, with a
   literal fallback after each one so the module still looks
   deliberate under feuerwehrj4, which loads none of them.
   ============================================================ */

.totjo-map {
  --map-sea:   transparent;
  --map-land:  var(--surf-2, #e8e6e1);
  --map-edge:  var(--line, #d5d2cb);
  --map-lit:   var(--acc, #a67c1a);
  --map-ink:   var(--text, #23211d);
  --map-mut:   var(--mut, #6f6a61);
}

.totjo-map-heading {
  margin: 0 0 .6rem;
  font-size: var(--label-size, .68rem);
  letter-spacing: var(--label-track, .17em);
  text-transform: uppercase;
  color: var(--map-mut);
}

.totjo-map-lede {
  margin: 0 0 .9rem;
  color: var(--map-ink);
}

.totjo-map-lede strong { color: var(--map-lit); }

/* The figure is a fixed-ratio box so the page does not jump when the
   map arrives: 1000 x 423 is the SVG's own viewBox. */
.totjo-map-figure {
  aspect-ratio: 1000 / 423;
  width: 100%;
  background: var(--map-sea);
}

.totjo-map-figure svg { display: block; width: 100%; height: 100%; }

.totjo-map-figure path {
  fill: var(--map-land);
  stroke: var(--map-edge);
  stroke-width: .5;
  vector-effect: non-scaling-stroke;
}

.totjo-map-figure path.is-lit {
  fill: var(--map-lit);
  stroke: var(--map-lit);
}

.totjo-map-figure circle.is-beacon {
  fill: var(--map-lit);
  stroke: var(--map-land);
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

/* A slow breath, so the map reads as inhabited rather than printed.
   Anyone who has asked their system for less motion gets none. */
@media (prefers-reduced-motion: no-preference) {
  .totjo-map-figure circle.is-beacon {
    animation: totjo-map-beacon 4.5s ease-in-out infinite;
    transform-box: fill-box;
    transform-origin: center;
  }
  .totjo-map-figure circle.is-beacon:nth-of-type(even) { animation-delay: -2.2s; }
}

@keyframes totjo-map-beacon {
  0%, 100% { opacity: .55; }
  50%      { opacity: 1; }
}

.totjo-map-regions {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}

.totjo-map-regions li {
  display: flex;
  align-items: baseline;
  gap: .6rem;
  font-size: .82rem;
}

/* A leader rule rather than a table: it survives any column width. */
.totjo-map-region { color: var(--map-mut); }

.totjo-map-regions li::after {
  content: "";
  flex: 1 1 auto;
  order: 1;
  border-bottom: 1px dotted var(--map-edge);
  transform: translateY(-.22em);
}

.totjo-map-count {
  order: 2;
  font-variant-numeric: tabular-nums;
  color: var(--map-ink);
}

.totjo-map-count abbr {
  border: 0;
  text-decoration: none;
  cursor: help;
  color: var(--map-mut);
}

.totjo-map-note {
  margin: .9rem 0 0;
  font-size: .72rem;
  line-height: 1.5;
  color: var(--map-mut);
}

.totjo-map-note a { color: inherit; }

/* Names-only mode.

   With the counts hidden, the leader rule above would trail off into empty
   space, so the column layout is dropped for a single wrapped line that reads
   as a statement of reach rather than a table missing its second column. */
.totjo-map-regions.is-plain {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem 0;
}

.totjo-map-regions.is-plain li::after { display: none; }

.totjo-map-regions.is-plain li + li::before {
  content: "\00B7";
  color: var(--map-mut);
  margin: 0 .55rem;
}

.totjo-map-regions.is-plain .totjo-map-region { color: var(--map-ink); }
