:root {

  --arl-bg: linear-gradient(180deg, #0a1628 0%, #10233d 48%, #0d1a2d 100%);

  --arl-line: rgba(186, 210, 235, 0.18);

  --arl-text: #f8fbff;

  --arl-muted: #b8c9de;

}



.qcw-auto-coverage-body {

  background: #0a1628;

  background: var(--arl-bg);

  color: var(--arl-text);

}



.qcw-auto-coverage-main {

  padding: 0;

}



.qcw-auto-coverage-shell {

  max-width: 1100px;

  margin: 0 auto;

}



.qcw-auto-coverage-topbar {

  border-bottom: 1px solid var(--arl-line);

  background: rgba(8, 16, 29, 0.9);

  padding: 8px 14px;

}



.qcw-auto-coverage-brand strong {

  font-size: 0.95rem;

}



.qcw-auto-coverage-brand span {

  font-size: 0.8rem;

  color: var(--arl-muted);

}



.qcw-auto-coverage-pill {

  text-transform: none;

  font-size: 0.75rem;

  padding: 6px 12px;

}



/* Broadcast desk: live radar full-bleed with Quato in front */

.qcw-quatocast-studio {

  display: flex;

  flex-direction: column;

  min-height: 0;

}



.qcw-quatocast-radar-stage {

  position: relative;

  min-height: min(56vh, 520px);

  border-bottom: 1px solid var(--arl-line);

  overflow: hidden;

  background: #07111f;

}



.qcw-quatocast-radar-stage.is-radar-focus .qcw-auto-coverage-map-wrap {

  box-shadow: inset 0 0 0 2px rgba(125, 211, 252, 0.4);

}



.qcw-quatocast-radar-stage .qcw-auto-coverage-map-wrap {

  position: absolute;

  inset: 0;

  min-height: 0;

}



.qcw-quatocast-presenter-anchor {

  position: absolute;

  right: 4%;

  bottom: 0;

  z-index: 4;

  width: min(240px, 36vw);

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: flex-end;

  pointer-events: none;

}



.qcw-quatocast-presenter-anchor .qcw-quato-presenter-rig {

  width: 100%;

  max-width: 220px;

}



.qcw-quatocast-copy-panel {

  position: absolute;

  left: 0;

  bottom: 0;

  z-index: 3;

  width: min(440px, 62%);

  max-height: 100%;

  padding: 12px 14px 14px;

  display: flex;

  flex-direction: column;

  gap: 6px;

  overflow: hidden;

  background: linear-gradient(

    105deg,

    rgba(4, 10, 20, 0.94) 0%,

    rgba(4, 10, 20, 0.78) 72%,

    rgba(4, 10, 20, 0) 100%

  );

  pointer-events: auto;

}



.qcw-quatocast-on-air {

  margin: 0;

  font-size: 0.72rem;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-transform: uppercase;

  color: #7dd3fc;

}



.qcw-quatocast-visually-muted {

  position: absolute;

  width: 1px;

  height: 1px;

  overflow: hidden;

  clip: rect(0, 0, 0, 0);

}



.qcw-quato-speech-bubble {

  flex: 1;

  min-height: 0;

  overflow-y: auto;

  padding: 10px 12px;

  border-radius: 12px;

  background: rgba(4, 10, 20, 0.55);

  border: 1px solid rgba(125, 211, 252, 0.2);

  transition: border-color 0.4s ease, box-shadow 0.4s ease;

}



.qcw-quato-speech-bubble p {

  margin: 4px 0 0;

  font-size: 0.92rem;

  line-height: 1.46;

}



.qcw-quatocast-studio.is-speaking .qcw-quato-speech-bubble {

  border-color: rgba(125, 211, 252, 0.42);

  box-shadow: 0 0 20px rgba(56, 189, 248, 0.1);

}



.qcw-quato-presenter-labels {

  text-align: center;

  margin-top: 4px;

  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.85);

}



.qcw-quato-presenter-labels strong {

  font-size: 0.92rem;

}



.qcw-quato-presenter-labels span {

  color: var(--arl-muted);

  font-size: 0.76rem;

}



.qcw-quatocast-progress .qcw-auto-coverage-progress-label {

  font-size: 0.7rem;

}



.qcw-auto-coverage-meta {

  margin-top: 2px;

}



.qcw-auto-coverage-meta span {

  font-size: 0.7rem;

  padding: 3px 8px;

}



.qcw-auto-coverage-details-panel {

  border-top: 1px solid var(--arl-line);

}



.qcw-auto-coverage-details-panel summary {

  padding: 8px 14px;

  font-size: 0.85rem;

}



@media (max-width: 780px) {

  .qcw-quatocast-radar-stage {

    min-height: min(50vh, 420px);

  }



  .qcw-quatocast-presenter-anchor {

    right: 2%;

    width: min(130px, 34vw);

  }



  .qcw-quatocast-copy-panel {

    width: min(100%, 72%);

    padding-bottom: 10px;

  }



  .qcw-quato-presenter-labels {

    display: none;

  }

}