.prompts {
  max-width: 760px;
  margin-top: 18px;
}

.compass-prompts {
  position: absolute;
  z-index: 4;
  inset: 0;
  display: block;
  max-width: none;
  margin: 0;
  pointer-events: none;
}

.compass-prompts button {
  position: absolute;
  pointer-events: auto;
  box-shadow: 0 8px 24px rgba(19, 48, 92, .1);
  white-space: nowrap;
}

.compass-prompts button:nth-child(1) { top: 3%; left: 10%; }
.compass-prompts button:nth-child(2) { top: 1%; right: 5%; }
.compass-prompts button:nth-child(3) { top: 21%; left: -4%; }
.compass-prompts button:nth-child(4) { top: 20%; right: -2%; }
.compass-prompts button:nth-child(5) { top: 43%; left: -8%; }
.compass-prompts button:nth-child(6) { top: 41%; right: -5%; }
.compass-prompts button:nth-child(7) { bottom: 29%; left: -4%; }
.compass-prompts button:nth-child(8) { right: -4%; bottom: 28%; }
.compass-prompts button:nth-child(9) { bottom: 10%; left: 5%; }
.compass-prompts button:nth-child(10) { right: 2%; bottom: 10%; }
.compass-prompts button:nth-child(11) { bottom: -4%; left: 22%; }
.compass-prompts button:nth-child(12) { right: 12%; bottom: -5%; }

.prompts button {
  padding: 9px 13px;
  font-size: 12px;
  background: rgba(255, 255, 255, .76);
  transition: transform .16s, border-color .16s, background .16s;
}

.prompts button:hover {
  color: var(--blue);
  background: #fff;
  border-color: #8eb5f5;
  transform: translateY(-2px);
}

.prompts button.orientation {
  color: #6f0017;
  background: #fff8e9;
  border-color: #dfc59a;
}

.prompts button.orientation:hover {
  color: #8b1125;
  border-color: #b58a47;
}

.admin-link {
  margin-left: auto;
  padding: 6px 10px;
  color: #718096;
  font-size: 11px;
  font-weight: 650;
  text-decoration: none;
  border: 1px solid #dbe2eb;
  border-radius: 9px;
}

.admin-link:hover {
  color: #172b4d;
  background: #f5f7fb;
}

.admin-link + .back { margin-left: 0; }

.voice-search,
.results-tools > button,
.listen-course {
  color: #53657d;
  font: 700 11px Inter;
  cursor: pointer;
  background: #f0f4fa;
  border: 1px solid #d6e0ec;
  border-radius: 10px;
}

.voice-search { display: flex; align-items: center; gap: 7px; padding: 9px 11px; }
.voice-search > span { color: #8b1125; font-size: 10px; }
.voice-search.listening { color: #8b1125; background: #fff0f2; border-color: #dba4ad; }
.voice-search.listening > span { animation: advice-pulse 1s ease-out infinite; }
.voice-search:disabled { cursor: not-allowed; opacity: .5; }
.results-tools { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.results-tools > button { padding: 9px 12px; color: #dce8f8; background: #183451; border-color: #405b79; }
.listen-course { margin: 0 22px 16px; padding: 10px 12px; text-align: left; }
.listen-course:hover,.voice-search:hover { color: #1769ff; background: #fff; border-color: #8eb5f5; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media (max-width: 650px) {
  .voice-search { flex: 1; justify-content: center; }
  .results-tools { align-items: flex-start; }
}

@media (max-width: 980px) {
  .compass-prompts {
    position: relative;
    inset: auto;
    display: flex;
    justify-content: center;
    margin-top: -25px;
    padding: 0 10px 20px;
    pointer-events: auto;
  }

  .compass-prompts button:nth-child(n) {
    position: static;
    white-space: normal;
  }
}
