.maintenance-loading-host { position: relative; min-height: 620px; overflow: hidden; border-radius: 16px; }
.drill-loading-host { position: relative; min-height: 580px; height: 100%; overflow: hidden; border-radius: 12px; }
.dossier-loading-host { position: relative; min-height: 580px; width: 100%; overflow: hidden; border-radius: 12px; grid-column: 1 / -1; }

@media (min-width: 1024px) {
  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) {
    container-type: size;
  }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) > .lunyu-preload {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: clamp(14px, 2.5cqh, 24px);
    box-sizing: border-box;
    padding: clamp(20px, 3.5cqh, 32px) clamp(24px, 4cqw, 64px);
  }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__header,
  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__reading,
  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__stages,
  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__error {
    position: relative;
    inset: auto;
    min-width: 0;
    width: 100%;
    transform: none;
  }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__header { grid-row: 1; }
  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__logo { width: clamp(120px, 15cqw, 184px); }
  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__destination { font-size: clamp(14px, 1.6cqw, 20px); }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__reading {
    grid-row: 2;
    align-self: center;
    justify-self: center;
    min-height: 0;
    max-height: 100%;
    max-width: 1160px;
    padding: 4px 8px;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
    pointer-events: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(215, 176, 108, .42) transparent;
  }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__quote {
    width: 100%;
    font-size: clamp(22px, min(3cqw, 5.5cqh), 40px);
    line-height: 1.45;
    letter-spacing: .04em;
  }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__source {
    margin-top: clamp(12px, 2cqh, 20px);
    font-size: clamp(14px, 1.5cqw, 20px);
  }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__positive {
    width: min(100%, 1040px);
    margin-top: clamp(12px, 2cqh, 20px);
    font-size: clamp(14px, 1.6cqw, 18px);
    line-height: 1.72;
  }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__stages {
    grid-row: 3;
    gap: clamp(8px, 1.2cqw, 16px);
  }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__stage { min-height: 64px; }
  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__stage-label {
    margin-top: 15px;
    font-size: clamp(12px, 1.4cqw, 17px);
    white-space: normal;
  }

  :is(.maintenance-loading-host, .drill-loading-host, .dossier-loading-host) .lunyu-preload__error {
    grid-row: 4;
    justify-self: center;
    max-width: 620px;
    max-height: 180px;
    box-sizing: border-box;
    overflow-y: auto;
  }
}