.pickup-queue-map {
  min-height: 560px;
  padding: 18px;
}

.campus-badge-digital-library {
  left: 66%;
  top: 52%;
}

.pickup-queue-svg {
  height: auto;
  inset: 18px 18px auto;
  min-height: 405px;
  position: absolute;
  width: calc(100% - 36px);
}

.pickup-campus-bg {
  fill: rgba(2, 12, 30, 0.52);
  stroke: rgba(49, 215, 255, 0.18);
  stroke-width: 2;
}

.pickup-queue-map .pickup-route-line {
  stroke: #31d7ff;
  stroke-width: 18;
  opacity: 0.72;
}

.queue-car rect {
  fill: #f8fbff;
  stroke: #31d7ff;
  stroke-width: 2;
}

.queue-car circle {
  fill: #071a3d;
  stroke: #31d7ff;
  stroke-width: 2;
}

.anpr-gate rect,
.waiting-display rect,
.checkout-point rect,
.app-notify rect {
  fill: rgba(255, 254, 250, 0.96);
  stroke: #31d7ff;
  stroke-width: 2;
}

.anpr-gate line {
  stroke: #ff4f4f;
  stroke-linecap: round;
  stroke-width: 6;
}

.anpr-gate text,
.waiting-display text,
.checkout-point text,
.app-notify text,
.student-queue text {
  fill: #071a3d;
  font-family: Arial, sans-serif;
  font-weight: 800;
}

.waiting-display text:first-of-type,
.student-queue text {
  fill: #31d7ff;
  font-size: 13px;
  letter-spacing: 0.08em;
}

.waiting-display text:nth-of-type(2) {
  fill: #1267f3;
  font-size: 20px;
}

.waiting-display text:nth-of-type(3),
.checkout-point text:nth-of-type(2) {
  fill: #4c5b70;
  font-size: 13px;
}

.checkout-point text:first-of-type,
.app-notify text,
.anpr-gate text {
  font-size: 15px;
}

.student-queue circle {
  fill: #fffefa;
  stroke: #31d7ff;
  stroke-width: 2;
}

.student-queue rect {
  fill: #1267f3;
}

.pickup-queue-steps {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  height: auto;
  margin-top: 410px;
  min-height: 0;
  position: relative;
}

.pickup-queue-steps .route-step {
  max-width: none;
  min-height: 104px;
  position: static;
}

.smart-campus-module-strip {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1120px) {
  .pickup-queue-map {
    min-height: 640px;
  }

  .pickup-queue-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 390px;
  }
}

@media (max-width: 640px) {
  .pickup-queue-map {
    min-height: 0;
  }

  .pickup-queue-svg {
    display: none;
  }

  .pickup-queue-steps {
    grid-template-columns: 1fr;
    margin-top: 0;
  }

  .smart-campus-module-strip {
    grid-template-columns: 1fr;
  }
}
