.stop-editor {
  display: grid;
  gap: 12px;
}
.stop-search {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
}
.stop-search input,
.route-mode {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #20231f;
  color: var(--ink);
  padding: 10px;
  font: inherit;
}
.stop-search input {
  width: 100%;
}
.route-mode {
  cursor: pointer;
}
.stop-results {
  grid-column: 2/-1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.stop-results button,
.chosen-stop button {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #242824;
  color: var(--ink);
  padding: 6px 10px;
  font-size: 0.72rem;
}
.chosen-stops {
  display: grid;
}
.chosen-stop {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 40px;
  align-items: center;
  min-height: 44px;
  gap: 7px;
  border-top: 1px solid var(--line);
  padding-left: 8px;
  font-size: 0.75rem;
}
.chosen-stop:first-child { border-top: 0; }
.chosen-stop b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chosen-stop button { width: 36px; height: 36px; border: 0; border-radius: 50%; background: #342321; color: var(--red); font-size: 1rem; }
.custom-route {
  display: grid;
  position: relative;
  grid-template-columns: minmax(58px, auto) minmax(0, 1fr) minmax(58px, auto);
  align-items: center;
  min-height: 74px;
  gap: 7px;
  border-top: 1px solid var(--line);
  padding: 30px 0 14px;
}
.custom-route > .route-center {
  min-width: 0;
  text-align: center;
}
.custom-route > .route-center > strong {
  display: block;
  position: absolute;
  top: 9px;
  right: 0;
  left: 0;
  overflow: hidden;
  padding: 0 4px;
  font-size: 0.72rem;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.custom-route small, .upcoming-pair small {
  color: var(--muted);
}
.custom-route .wait, .upcoming-pair .wait {
  color: var(--green);
  font-size: 1.05rem;
  font-weight: 800;
  white-space: nowrap;
}
.custom-route .edge, .upcoming-pair .edge { display: grid; gap: 2px; min-width: 0; }
.custom-route .edge.right, .upcoming-pair .edge.right { text-align: right; }
.custom-route .line, .upcoming-pair .line { overflow: hidden; font-size: .62rem; text-overflow: ellipsis; white-space: nowrap; }
.custom-route .direction, .upcoming-pair .direction { min-height: .75rem; font-size: .58rem; white-space: nowrap; }
.custom-route .route-center small, .upcoming-pair .route-center small { display: block; font-size: .62rem; }
.route-upcoming { grid-column: 1/-1; border-top: 1px solid var(--line); margin-top: 10px; }
.route-upcoming[hidden] { display: none; }
.upcoming-pair { display: grid; grid-template-columns: minmax(58px,auto) minmax(0,1fr) minmax(58px,auto); align-items: center; min-height: 62px; gap: 7px; border-bottom: 1px solid var(--line); padding: 11px 0; }
.upcoming-pair .wait { font-size: .9rem; }
@media (max-width: 520px) {
  .custom-route {
    grid-template-columns: minmax(58px, auto) minmax(0, 1fr) minmax(58px, auto);
    gap: 5px;
  }
  .upcoming-pair { grid-template-columns: minmax(58px,auto) minmax(0,1fr) minmax(58px,auto); gap: 5px; }
}