meridian-location-directory {
  --md-location-ink: var(--ink);
  --md-location-muted: var(--ink-muted);
  --md-location-rule: var(--rule);
  --md-location-accent: var(--accent);
  display: block;
  color: var(--md-location-ink);
  font-family: var(--sans);
}

meridian-location-directory *,
meridian-location-directory *::before,
meridian-location-directory *::after { box-sizing: border-box; }

.md-location-list { display: grid; align-content: start; }

.md-location-row {
  display: grid;
  min-height: 3.5rem;
  align-items: center;
  grid-template-columns: 0.55rem minmax(0, 1fr) auto;
  gap: 1rem;
  padding-block: 0.9rem;
  border-top: 1px solid var(--md-location-rule);
}

.md-location-row:first-child { border-top: 0; }

.md-location-row > i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--md-location-series, var(--accent-plot));
}

.md-location-row strong,
.md-location-row small { display: block; }
.md-location-row strong { font-size: 0.95rem; font-weight: 650; }
.md-location-row small { color: var(--md-location-muted); font-size: 0.78rem; }

.md-location-row nav {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.md-location-row a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  color: var(--md-location-accent);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}

.md-location-row a:hover { text-decoration: underline; }
.md-location-empty { margin: 0; color: var(--md-location-muted); }

@media (max-width: 620px) {
  .md-location-row {
    align-items: start;
    grid-template-columns: 0.55rem minmax(0, 1fr);
  }

  .md-location-row nav {
    grid-column: 2;
    justify-content: flex-start;
  }
}