/* Scouting route tester — private, evidence-first ordinary-life comparisons. */
.route-test-planner {
  display: grid;
  gap: clamp(22px, 4vw, 42px);
  margin-top: clamp(34px, 6vw, 72px);
}

.route-test-intro,
.route-test-workspace {
  border: 1px solid var(--line);
}

.route-test-intro {
  padding: clamp(24px, 4vw, 46px);
  background:
    radial-gradient(circle at 94% 8%, rgb(76 141 255 / 14%), transparent 30%),
    linear-gradient(145deg, rgb(255 255 255 / 0.82), rgb(255 255 255 / 0.2)),
    var(--sand-light);
  border-top: 7px solid var(--signal);
}

.route-test-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(270px, 0.85fr);
  gap: clamp(22px, 5vw, 70px);
  align-items: end;
}

.route-test-heading h2,
.route-test-workspace__heading h2 {
  max-width: 15ch;
  margin: 5px 0 0;
  font-size: clamp(2.35rem, 4.7vw, 4.8rem);
  line-height: 0.94;
}

.route-test-heading > p,
.route-test-workspace__heading > p {
  max-width: 64ch;
  margin: 0;
  color: var(--muted);
}

.route-test-storage {
  display: flex;
  gap: 12px;
  margin-top: 24px;
  padding: 15px 16px;
  background: rgb(255 255 255 / 0.7);
  border-left: 4px solid var(--signal);
  font-size: 0.75rem;
}

.route-test-storage strong {
  flex: 0 0 auto;
}

.route-test-setup-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: clamp(26px, 4vw, 42px);
}

.route-test-panel {
  min-width: 0;
  padding: clamp(18px, 3vw, 28px);
  background: var(--paper-bright);
  border: 1px solid var(--line);
}

.route-test-panel__header {
  min-height: 106px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.route-test-panel__header h3 {
  margin: 4px 0 8px;
  font-family: var(--font-display);
  font-size: clamp(1.7rem, 3vw, 2.5rem);
}

.route-test-panel__header p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: 0.75rem;
}

.route-test-slot-list {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.route-test-slot {
  min-width: 0;
  margin: 0;
  padding: 16px;
  background: var(--sand-light);
  border: 1px solid var(--line);
}

.route-test-slot.is-active {
  background: #f7fbf8;
  border-color: #a8c8bb;
  box-shadow: inset 4px 0 var(--green);
}

.route-test-slot legend {
  width: 100%;
  padding: 0;
}

.route-test-slot__toggle {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 9px;
  min-height: 44px;
  align-items: center;
  font-weight: 830;
  cursor: pointer;
}

.route-test-slot__toggle input {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: var(--green);
}

.route-test-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.route-test-fields > label,
.route-test-observation-fields > label,
.route-test-copy-preview > label {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 7px;
}

.route-test-fields > label > span,
.route-test-observation-fields > label > span,
.route-test-copy-preview label > span {
  color: var(--muted);
  font-family: var(--font-data);
  font-size: 0.75rem;
  font-weight: 850;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.route-test-fields input,
.route-test-fields select,
.route-test-observation-fields input,
.route-test-observation-fields select,
.route-test-observation-fields textarea,
.route-test-copy-preview textarea {
  width: 100%;
  min-height: 46px;
  padding: 9px 11px;
  color: var(--ink);
  background: var(--paper-bright);
  border: 1px solid var(--line);
  border-radius: 0;
}

.route-test-fields label:first-child,
.route-test-fields .route-test-private,
.route-test-observation-fields .route-test-note {
  grid-column: 1 / -1;
}

.route-test-fields small,
.route-test-observation-fields small {
  color: var(--muted);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.route-test-workspace {
  padding: clamp(20px, 4vw, 44px);
  background: var(--paper-bright);
}

.route-test-workspace__heading {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(250px, 0.9fr);
  gap: clamp(20px, 5vw, 60px);
  align-items: end;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 2px solid var(--ink);
}

.route-test-observation-list {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.route-test-observation {
  break-inside: avoid;
  padding: clamp(18px, 3vw, 28px);
  background: var(--sand-light);
  border-left: 5px solid var(--coral);
}

.route-test-observation__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
}

.route-test-observation__header h3 {
  margin: 4px 0 0;
  font-family: var(--font-display);
  font-size: clamp(1.45rem, 2.6vw, 2.25rem);
}

.route-test-observation__route {
  max-width: 31ch;
  margin: 2px 0 0;
  color: var(--green-dark);
  font-family: var(--font-data);
  font-size: 0.75rem;
  font-weight: 830;
  text-align: right;
  text-transform: uppercase;
}

.route-test-provider-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

.route-test-provider-links a {
  display: inline-grid;
  min-height: 44px;
  place-items: center;
  padding: 9px 13px;
  color: var(--paper-bright);
  background: var(--green-dark);
  border: 1px solid var(--green-dark);
  font-family: var(--font-data);
  font-size: 0.75rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-decoration: none;
  text-transform: uppercase;
}

.route-test-provider-links a:hover,
.route-test-provider-links a:focus-visible {
  color: var(--ink);
  background: var(--paper-bright);
}

.route-test-provider-disclosure {
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 0.8125rem;
}

.route-test-provider-empty {
  margin: 15px 0 0;
  padding: 11px 12px;
  color: var(--muted);
  background: var(--paper-bright);
  border-left: 3px solid var(--signal);
  font-size: 0.8125rem;
}

.route-test-observation-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.route-test-observation-fields textarea {
  min-height: 86px;
  resize: vertical;
}

.route-test-summary {
  margin-top: 28px;
  padding-top: 28px;
  border-top: 2px solid var(--ink);
}

.route-test-summary > header h3 {
  margin: 4px 0 6px;
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3.5vw, 3rem);
}

.route-test-summary > header p:last-child {
  max-width: 70ch;
  color: var(--muted);
  font-size: 0.75rem;
}

.route-test-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.route-test-summary-card {
  padding: 20px;
  background: #f2f7f4;
  border-top: 4px solid var(--green);
}

.route-test-summary-card h4 {
  margin: 0 0 12px;
  font-size: 1rem;
}

.route-test-summary-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.route-test-summary-card dl > div {
  min-width: 0;
  padding-top: 8px;
  border-top: 1px solid #bdd0c7;
}

.route-test-summary-card dt {
  color: var(--muted);
  font-family: var(--font-data);
  font-size: 0.75rem;
  font-weight: 850;
  text-transform: uppercase;
}

.route-test-summary-card dd {
  margin: 2px 0 0;
  font-size: 0.78rem;
  font-weight: 820;
}

.route-test-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
}

.route-test-actions button {
  min-height: 44px;
  padding: 9px 13px;
  color: var(--paper-bright);
  background: var(--ink);
  border: 1px solid var(--ink);
  font-family: var(--font-data);
  font-size: 0.75rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.route-test-actions button:last-of-type {
  color: var(--coral-dark);
  background: transparent;
  border-color: var(--coral);
}

.route-test-actions button:hover {
  color: var(--ink);
  background: var(--sand);
}

.route-test-announcement {
  min-height: 1.5em;
  margin: 10px 0 0;
  color: var(--coral-dark);
  font-family: var(--font-data);
  font-size: 0.75rem;
}

.route-test-copy-preview {
  margin-top: 22px;
  padding: clamp(20px, 3vw, 30px);
  border: 1px solid var(--line);
}

.route-test-copy-preview summary {
  display: list-item;
  min-height: 44px;
  padding: 8px 0;
  font-weight: 850;
  line-height: 28px;
  cursor: pointer;
}

.route-test-copy-preview > label {
  margin-top: 16px;
}

.route-test-planner :disabled {
  cursor: wait;
  opacity: 0.58;
}

@media (max-width: 960px) {
  .route-test-heading,
  .route-test-workspace__heading {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .route-test-heading h2,
  .route-test-workspace__heading h2 {
    max-width: none;
  }
}

@media (max-width: 760px) {
  .route-test-setup-grid,
  .route-test-summary-grid {
    grid-template-columns: 1fr;
  }

  .route-test-panel__header {
    min-height: 0;
  }
}

@media (max-width: 540px) {
  .route-test-storage,
  .route-test-observation__header {
    display: block;
  }

  .route-test-storage strong {
    display: block;
    margin-bottom: 6px;
  }

  .route-test-fields,
  .route-test-observation-fields,
  .route-test-summary-card dl {
    grid-template-columns: 1fr;
  }

  .route-test-observation__route {
    margin-top: 8px;
    text-align: left;
  }

  .route-test-actions {
    display: grid;
  }

  .route-test-actions button {
    width: 100%;
  }
}

@media print {
  .route-test-storage,
  .route-test-slot__toggle input,
  .route-test-private,
  .route-test-note,
  .route-test-provider-links,
  .route-test-provider-disclosure,
  .route-test-provider-empty,
  .route-test-actions,
  .route-test-announcement,
  .route-test-copy-preview {
    display: none !important;
  }

  .route-test-planner,
  .route-test-intro,
  .route-test-workspace,
  .route-test-setup-grid,
  .route-test-panel,
  .route-test-slot-list,
  .route-test-slot,
  .route-test-observation-list,
  .route-test-observation,
  .route-test-summary,
  .route-test-summary-grid,
  .route-test-summary-card {
    display: block;
    width: 100%;
    padding: 0;
    color: #000;
    background: #fff;
    border: 0;
    box-shadow: none;
  }

  .route-test-intro,
  .route-test-panel,
  .route-test-slot,
  .route-test-observation,
  .route-test-summary-card {
    margin-top: 18px;
    padding-top: 12px;
    border-top: 1px solid #888;
  }

  .route-test-slot:not(.is-active) {
    display: none;
  }

  .route-test-slot__toggle {
    display: block;
    min-height: 0;
  }

  .route-test-fields,
  .route-test-observation-fields,
  .route-test-summary-card dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .route-test-fields input,
  .route-test-fields select,
  .route-test-observation-fields input,
  .route-test-observation-fields select {
    min-height: 0;
    padding: 3px 0;
    color: #000;
    background: #fff;
    border: 0;
  }

}