/* Hotfix 25: echte Grossdarstellung fuer die beiden Rundinstrumente.
   Die ID im Selektor ueberstimmt bewusst den Notebook-Kompaktmodus. */
#instrumentDetailStage .instrument-detail-copy.round-instrument {
  width: min(680px, calc(100vw - 72px)) !important;
  aspect-ratio: auto !important;
  padding: 18px 28px 20px !important;
}

#instrumentDetailStage .instrument-detail-copy .altimeter-face,
#instrumentDetailStage .instrument-detail-copy .heading-face {
  width: min(520px, 68vh, 72vw) !important;
  height: min(520px, 68vh, 72vw) !important;
  margin: 12px auto !important;
  border-width: 14px !important;
}

/* Vollstaendige, gleichmaessige 0-bis-9-Skala des Hoehenmessers. */
#instrumentDetailStage .instrument-detail-copy .altimeter-scale span {
  transform: rotate(calc(var(--i) * 36deg)) translateY(clamp(-218px, -28vh, -25vw))
    rotate(calc(var(--i) * -36deg)) translate(-50%, -50%) !important;
  color: #f6f4e9;
  font: 700 clamp(1.15rem, 2.2vw, 1.65rem)/1 Arial, sans-serif !important;
  text-shadow: 0 2px 3px #000;
}

#instrumentDetailStage .instrument-detail-copy .altimeter-face::after {
  inset: 12px !important;
  background: repeating-conic-gradient(
    from -1deg,
    #f0eee3 0 1deg,
    transparent 1deg 7.2deg
  ) !important;
  -webkit-mask: radial-gradient(circle, transparent 0 83%, #000 84%) !important;
  mask: radial-gradient(circle, transparent 0 83%, #000 84%) !important;
}

#instrumentDetailStage .instrument-detail-copy .altimeter-long-hand {
  width: 5px !important;
  height: 38% !important;
  bottom: 50% !important;
  transform: rotate(0deg) !important;
}

#instrumentDetailStage .instrument-detail-copy .altimeter-short-hand {
  width: 8px !important;
  height: 25% !important;
  bottom: 50% !important;
  transform: rotate(0deg) !important;
}

#instrumentDetailStage .instrument-detail-copy .gauge-hub {
  width: 18px !important;
  height: 18px !important;
}

#instrumentDetailStage .instrument-detail-copy .qnh-window {
  right: 8% !important;
  top: 49% !important;
  padding: 3px 6px !important;
  font-size: 1rem !important;
}

#instrumentDetailStage .instrument-detail-copy .altimeter-face > strong {
  bottom: 16% !important;
  min-width: 66px !important;
  padding: 3px 6px !important;
  font-size: 1rem !important;
}

#instrumentDetailStage .instrument-detail-copy .altimeter-face > small {
  bottom: 7% !important;
  font-size: .7rem !important;
}

#instrumentDetailStage .instrument-detail-copy .gauge-mark {
  top: 30% !important;
  font-size: .72rem !important;
}

/* Kursrose: 30-Grad-Hauptmarken liegen am aeusseren Skalenring. */
#instrumentDetailStage .instrument-detail-copy .heading-card span {
  transform: rotate(calc(var(--i) * 30deg)) translateY(clamp(-210px, -27vh, -24vw))
    rotate(calc(var(--i) * -30deg)) translate(-50%, -50%) !important;
  color: #f6f4e9;
  font: 700 clamp(1rem, 2vw, 1.45rem)/1 Arial, sans-serif !important;
  text-shadow: 0 2px 3px #000;
}

#instrumentDetailStage .instrument-detail-copy .heading-card span:nth-child(3n+1) {
  font-size: clamp(1.35rem, 2.6vw, 1.9rem) !important;
}

#instrumentDetailStage .instrument-detail-copy .heading-face::before {
  inset: 12px !important;
  background: repeating-conic-gradient(
    from -1deg,
    #f1efe4 0 1.2deg,
    transparent 1.2deg 5deg
  ) !important;
  -webkit-mask: radial-gradient(circle, transparent 0 84%, #000 85%) !important;
  mask: radial-gradient(circle, transparent 0 84%, #000 85%) !important;
}

#instrumentDetailStage .instrument-detail-copy .heading-index {
  top: 3px !important;
  font-size: 1.4rem !important;
}

#instrumentDetailStage .instrument-detail-copy .heading-bug {
  inset: 15px !important;
}

#instrumentDetailStage .instrument-detail-copy .heading-bug span {
  border-right-width: 10px !important;
  border-bottom-width: 16px !important;
  border-left-width: 10px !important;
}

#instrumentDetailStage .instrument-detail-copy .heading-face > strong {
  min-width: 104px !important;
  padding: 8px 12px !important;
  font-size: 1.55rem !important;
}

#instrumentDetailStage .instrument-detail-copy .heading-face > small {
  bottom: 15% !important;
  font-size: .68rem !important;
}

@media (max-width: 700px) {
  #instrumentDetailStage .instrument-detail-copy.round-instrument {
    width: calc(100vw - 36px) !important;
    padding: 13px !important;
  }

  #instrumentDetailStage .instrument-detail-copy .altimeter-face,
  #instrumentDetailStage .instrument-detail-copy .heading-face {
    width: min(78vw, 430px) !important;
    height: min(78vw, 430px) !important;
  }

  #instrumentDetailStage .instrument-detail-copy .altimeter-scale span {
    transform: rotate(calc(var(--i) * 36deg)) translateY(-31vw)
      rotate(calc(var(--i) * -36deg)) translate(-50%, -50%) !important;
  }

  #instrumentDetailStage .instrument-detail-copy .heading-card span {
    transform: rotate(calc(var(--i) * 30deg)) translateY(-30vw)
      rotate(calc(var(--i) * -30deg)) translate(-50%, -50%) !important;
  }
}
