/* Let grid children shrink to the phone viewport rather than the artwork's
   preferred width. Keep the full text and artwork visible without clipping. */
.hero > * { min-width: 0; }
@media (max-width: 850px) {
  .hero { grid-template-columns: minmax(0, 1fr); }
  .hero-art { width: min(440px, 100%); }
}
@media (max-width: 560px) {
  .hero h1 { font-size: clamp(34px, 11.2vw, 44px); }
}
.pilot-form { display: grid; gap: 10px; }
.pilot-form label { font-weight: 650; margin-top: 8px; }
.pilot-form input, .pilot-form textarea { width: 100%; box-sizing: border-box; padding: 12px 14px; border: 1px solid #97b9a8; border-radius: 10px; background: #fff; color: #304c43; font: inherit; }
.pilot-form textarea { resize: vertical; min-height: 100px; }
.pilot-form .quiet { font-size: 14px; margin: 0 0 6px; }
.pilot-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#pilot-submit-status { color: #843b2e; margin: 0; }
#pilot-dialog { max-height: calc(100dvh - 32px); overflow-y: auto; }
.applications-list { display: grid; gap: 18px; margin: 20px 0; }
.application-card { padding: 24px; border: 1px solid #cfdfd4; border-radius: 16px; background: #fff; overflow-wrap: anywhere; }
.application-card h2 { font-size: 21px; margin: 0 0 8px; }
.application-card .application-purpose { white-space: pre-wrap; }
.application-card .dialog-actions { margin-top: 18px; }
#applications-status { white-space: pre-line; }