/* Opening feedback must not move the first category or alter scroll anchoring. */
.ah-challenge-opening {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 1070;
  margin: 0;
  padding: 10px 16px;
  border: 1px solid #354052;
  border-radius: 8px;
  background: #10151f;
  color: #d6f0ff;
  font-size: 13px;
  pointer-events: none;
}
/* Keep the page width when Bootstrap temporarily hides the document scrollbar. */
html { scrollbar-gutter: stable; }
body.ah-app.modal-open { padding-right: 0 !important; }
body.ah-app .challenge-button:is(:hover,:focus,:active) { transform: none; }
body.ah-app .ah-workspace .ah-track-brief { min-height: 0; }
body.ah-app .ah-track-problems { min-height: 0; }
@media (min-width: 1101px) {
  body.ah-app .ah-workspace { grid-template-rows: clamp(560px, 68vh, 720px) auto; }
  body.ah-app .ah-workspace .ah-region-map { min-height: 0; overflow: hidden; }
  body.ah-app .ah-workspace .ah-car-model { min-height: 0; max-height: none; }
  body.ah-app .ah-workspace .ah-track-brief { gap: 16px; overflow: hidden; }
  body.ah-app .ah-workspace .ah-track-brief > * { flex-shrink: 0; }
  body.ah-app .ah-workspace .ah-track-problems { flex: 1 1 0; max-height: none; overflow-y: auto; }
}
@media (min-width: 768px) and (max-width: 1100px) {
  body.ah-app .ah-workspace .ah-track-brief { height: 360px; grid-template-rows: 18px 32px minmax(0,1fr) 40px 54px; }
}

/* Place the gesture hint in the model area, above the mobile track buttons. */
@media (max-width: 767px) {
  body.ah-app .ah-workspace .ah-orbit-hint {
    position: absolute;
    top: 270px;
    bottom: auto;
    left: 50%;
    margin: 0;
    transform: translateX(-50%);
    white-space: nowrap;
  }
}