/* Signal mission layout and radio-world states. */
/* A living radio map and a compact, growing story route. */
#signal-nav {
  margin-bottom: 24px;
}
.signal-route-card {
  padding: 20px;
  border: 1px solid #52736b;
  border-radius: 18px;
  background: linear-gradient(130deg,#203e3e,#152f36);
  box-shadow: inset 0 1px #d6f3d60a;
}
.signal-route-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
}
.signal-route-heading>div {
  min-width: 0;
}
.signal-route-heading h2 {
  margin: 0;
  font-size: 21px;
  line-height: 1.4;
  color: #f2dfb7;
}
.signal-route-heading p {
  line-height: 1.7;
  color: #b1c9bc;
  margin: 5px 0 0;
}
.signal-route-progress {
  line-height: 1.6;
  color: #d6e8c8;
  white-space: nowrap;
}
.signal-route-card label {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  font-size: 13px;
  color: #bad0c3;
}
.signal-route-card select {
  width: 100%;
  min-height: var(--field-min);
  font-size: 15px;
  background-color: #102c32;
}
.signal-route-actions {
  display: flex;
  flex-wrap: wrap;
  margin-top: 16px;
}
.signal-route-actions button {
  min-height: var(--control-min);
}
.signal-route-actions p {
  flex: 1 1 260px;
  margin: 0;
  line-height: 1.7;
  color: #b0c7bc;
}
.signal-journal {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 13px;
  padding-top: 13px;
  border-top: 1px solid #3b6058;
}
.signal-journal button {
  min-height: var(--control-min);
  font-size: 13px;
  padding: 9px 12px;
}
.signal-journal-empty {
  line-height: 1.7;
  color: #a9c4b8;
}
.signal-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 34px;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.5;
  border: 1px solid #638a73;
  border-radius: 9px;
  color: #c9e6cc;
  background: #214536;
}
.signal-badge .ui-icon {
  width: 17px;
  height: 17px;
  flex-basis: 17px;
}
#signal-goal {
  margin: 0 0 20px;
  padding: 17px 18px;
  border: 1px solid #8c7954;
  border-radius: 15px;
  background: linear-gradient(115deg,#3d3c2b,#273c31);
  color: #ead8ad;
}
#signal-goal h2,#signal-goal h3,#signal-goal-title {
  font-size: 17px;
  line-height: 1.5;
  margin: 0 0 6px;
  color: #ffe0a4;
}
#signal-goal p {
  line-height: 1.75;
  margin: 5px 0;
  color: #d0d5b6;
}
.signal-goal-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  font-size: 13px;
  line-height: 1.7;
  color: #c1cbb0;
  margin-top: 10px;
}
.signal-goal-meta code {
  font: 13px/1.5 var(--font-code);
  color: #f3d59c;
}
.signal-world .signal-antenna {
  cursor: pointer;
  outline: none;
}
.signal-world .signal-antenna:focus-visible .signal-post-card {
  stroke: #ffe3a3;
  stroke-width: 4;
}
.signal-world .signal-antenna:hover .signal-post-card {
  stroke: #c4d7b7;
}
.signal-world .signal-antenna.selected .signal-post-card {
  filter: drop-shadow(0 2px 5px #071a1960);
}
.signal-world .signal-radio-waves {
  animation: signal-wave 2.4s ease-in-out infinite;
}
.signal-world .signal-packet {
  animation: signal-packet 4s linear infinite;
}
.signal-world .signal-link:nth-child(even) .signal-packet {
  animation-delay: -2s;
}
.signal-world .signal-success-halo {
  animation: signal-glow 4s ease-in-out infinite;
}
.signal-world .signal-dish {
  transform-box: view-box;
}
.signal-world .signal-scan-frame {
  pointer-events: none;
}
@keyframes signal-wave {
  0%,100% {
    opacity: .3;
  }
  50% {
    opacity: .95;
  }
}
@keyframes signal-packet {
  to {
    stroke-dashoffset: -308;
  }
}
@keyframes signal-glow {
  0%,100% {
    opacity: .65;
  }
  50% {
    opacity: 1;
  }
}
.signal-route-heading>div:not(.signal-route-progress) {
  flex: 1;
}
.signal-route-heading .eyebrow {
  letter-spacing: 1px;
  margin: 0 0 4px;
}
.signal-route-progress {
  flex: 0 0 150px;
  text-align: right;
  font-size: 13px;
}
.signal-route-progress progress {
  display: block;
  appearance: none;
  width: 100%;
  height: 6px;
  margin-top: 9px;
  border: 0;
  border-radius: 8px;
  background: #0c252a;
  overflow: hidden;
}
.signal-route-progress progress::-webkit-progress-bar {
  background: #0c252a;
}
.signal-route-progress progress::-webkit-progress-value {
  background: #e9be78;
  border-radius: 8px;
}
.signal-route-progress progress::-moz-progress-bar {
  background: #e9be78;
}
.signal-route-actions {
  align-items: flex-end;
  gap: 12px;
}
.signal-route-actions>label {
  flex: 1 1 380px;
  min-width: 0;
}
.signal-route-actions>button {
  flex: 0 1 auto;
  min-height: var(--field-min);
}
.signal-route-note {
  font: 13px/1.75 var(--font-body);
  color: #b6cdc2;
  margin: 14px 0 0;
}
details.signal-journal {
  display: block;
  border: 0;
  border-top: 1px solid #3b6058;
  border-radius: 0;
  background: none;
  padding: 14px 0 0;
  margin: 16px 0 0;
}
.signal-journal>summary {
  font-size: 14px;
  color: #ead1a4;
  cursor: pointer;
}
.signal-journal-controls {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 13px;
}
.signal-journal-controls>label {
  flex: 1 1 300px;
  min-width: 0;
}
.signal-journal-controls>button {
  flex: 0 1 auto;
  min-height: var(--field-min);
}
.signal-requirements {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.signal-route-heading .eyebrow {
  font-size: 12px;
}
.signal-route-heading p,.signal-route-actions p,.signal-route-note,#signal-goal p {
  font-size: 15px;
}
.signal-journal>summary {
  min-height: var(--control-min);
  padding: 10px 0;
}
.signal-journal-empty {
  font-size: 14px;
}
@media(max-width:820px) {
  .signal-route-card {
    padding: 16px;
  }
  .signal-route-heading {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 8px;
  }
  .signal-route-heading h2 {
    font-size: 20px;
  }
  .signal-route-progress {
    white-space: normal;
  }
  .signal-route-actions button {
    flex: 1 1 150px;
  }
  .signal-route-actions p {
    flex-basis: 100%;
  }
  .signal-journal button {
    flex: 1 1 150px;
  }
  #signal-goal {
    padding: 15px;
  }
}
@media(prefers-reduced-motion:reduce) {
  .signal-world .signal-radio-waves,.signal-world .signal-packet,.signal-world .signal-success-halo {
    animation: none;
  }
}
@media(max-width:680px) {
  .signal-route-heading {
    justify-content: flex-start;
    gap: 12px;
  }
  .signal-route-heading .section-badge {
    flex: 0 0 40px;
  }
  .signal-route-heading>div:not(.signal-route-progress) {
    flex: 1 1 calc(100% - 60px);
  }
  .signal-route-progress {
    flex: 1 1 100%;
    text-align: left;
  }
  .signal-route-actions>button,.signal-journal-controls>button {
    flex: 1 1 100%;
  }
  .signal-route-card select {
    font-size: 14px;
  }
}
