/* Mobile overrides only. The existing desktop styles and content stay intact. */
@media screen and (max-width: 700px) {
  html {
    width: 100%;
    min-width: 0;
    overflow-x: hidden;
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: 145px;
  }
  body { width: 100%; min-width: 0; max-width: 100%; font-size: 16px; }
  main, section, article, fieldset { min-width: 0; }
  .section-wrap, .contact-form-main { max-width: 100%; }
  .button { max-width: 100%; min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  .contact-form-main { width: calc(100% - 32px); }
  .breadcrumb, .jobs-breadcrumb { font-size: 12px; flex-wrap: wrap; }
  .inquiry-heading { padding-inline: 0; }
  .inquiry-heading h1 { font-size: 25px; overflow-wrap: anywhere; }
  .inquiry-heading p { font-size: 15px; line-height: 1.9; }
  .inquiry-card { padding: 24px 16px; }
  .form-steps { gap: 6px; }
  .form-steps li { min-width: 0; min-height: 48px; font-size: 13px; gap: 5px; }
  .field-columns { grid-template-columns: minmax(0, 1fr); }
  .field-label, .choice, .consent-label { font-size: 15px; }
  .field-badge { font-size: 11px; }
  .form-section-heading h2 { font-size: 20px; }
  .form-field { margin-bottom: 24px; }
  .inquiry-card input:not([type=radio]):not([type=checkbox]),
  .inquiry-card select, .inquiry-card textarea { font-size: 16px; min-height: 50px; }
  .inquiry-card input::placeholder, .inquiry-card textarea::placeholder { font-size: 14px; }
  .choice { min-height: 48px; padding: 10px 12px; }
  .field-hint, .field-error, .delivery-guidance, .form-footnote,
  .form-section-heading p, .email-fallback, .consent-confirmed,
  .review-heading p, .mail-notice, .application-privacy { font-size: 13px; }
  .policy-heading a { font-size: 13px; min-height: 44px; display: inline-flex; align-items: center; }
  .policy-content, .privacy-main .policy-content { font-size: 15px; line-height: 1.95; }
  .policy-content h3, .privacy-main .policy-content h3 { font-size: 17px; }
  .policy-scroll { height: 300px; padding: 14px; }
  .policy-content ul, .policy-content ol { padding-left: 20px; }
  .consent-label { justify-content: flex-start; padding: 16px 12px; }
  .form-primary, .review-actions .button { font-size: 16px; min-height: 54px; }
  .review-values > div, .application-page .review-values > div { grid-template-columns: minmax(0, 1fr); font-size: 15px; }
  .error-summary { font-size: 14px; }
  .mail-notice { padding: 22px 16px; }
  .mail-notice h3 { font-size: 16px; }
  .form-phone-links { grid-template-columns: minmax(0, 1fr); }
  .form-phone-links span { font-size: 13px; }
  .form-phone-links strong { font-size: 22px; }
  .form-site-footer { font-size: 13px; padding-bottom: max(24px, env(safe-area-inset-bottom)); }
  .form-site-footer a { min-height: 44px; display: inline-flex; align-items: center; }
  .form-site-footer > span { font-size: 12px; }
  .qualifications-grid, .application-source-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qualifications-grid .choice, .application-source-grid .choice { font-size: 14px; padding-inline: 9px; overflow-wrap: anywhere; }
  .application-page .visit-preference-grid { display: grid; grid-template-columns: minmax(0, 1fr); }
  .application-page .visit-preference-grid .choice { font-size: 15px; white-space: normal; }
  .application-page .visit-preference-grid .choice input { width: 18px; height: 18px; }
}

@media screen and (max-width: 600px) {
  .site-header {
    gap: 8px;
    padding: max(10px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 10px max(12px, env(safe-area-inset-left));
  }
  .site-header .brand-min { min-height: 44px; }
  .main-nav { width: 100%; min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  .main-nav a { width: 100%; min-width: 0; min-height: 58px; flex-direction: column; gap: 3px; padding: 6px 2px; font-size: 13px; line-height: 1.4; letter-spacing: 0; }
  .main-nav .icon { width: 18px; height: 18px; }
  .section-wrap { width: calc(100% - 32px); }
  .hero { padding-top: 28px; }
  .hero-copy, .hero-art, .welcome-inner > *, .classroom-card > *, .recruit-copy { min-width: 0; }
  .hero h1 { white-space: normal; font-size: clamp(26px, 6.8vw, 30px); letter-spacing: .01em; }
  .hero-description, .welcome-copy, .section-heading p, .classroom-card p,
  .faq-intro p, .faq-list details > p, .contact-copy > p,
  .location-address, .location-card address, .recruit-copy p, .day-timeline p { font-size: 15px; line-height: 1.9; }
  .hero .button { font-size: 15px; min-height: 52px; padding: 14px 18px; }
  .hero-sub-link { font-size: 13px; min-height: 44px; margin: 12px 0 0; display: flex; align-items: center; justify-content: center; }
  .hero-art { margin-inline: 0; width: 100%; }
  .eyebrow { font-size: 12px; letter-spacing: .04em; }
  .welcome-inner { gap: 22px; padding-block: 34px; }
  .program-section { padding-top: 40px; }
  .classroom-card { grid-template-columns: 42px minmax(0, 1fr); padding: 22px 16px; column-gap: 12px; }
  .classroom-icon { width: 38px; height: 42px; }
  .classroom-card .text-button, .day-heading .text-button { font-size: 14px; min-height: 44px; }
  .day-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .day-timeline h4 { font-size: 17px; }
  .section-note, .contact-memo p { font-size: 13px; }
  .faq-list summary { font-size: 15px; }
  .contact-locations { grid-template-columns: minmax(0, 1fr); }
  .location-card { padding: 22px 18px; min-width: 0; }
  .location-actions .button, .contact-memo .button { font-size: 14px; min-height: 50px; }
  .location-email { font-size: 14px; overflow-wrap: anywhere; }
  .location-map { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; }
  .recruit-section { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 16px; }
  .recruit-illustration { width: 56px; }
  .recruit-section > .button { grid-column: 1 / -1; width: 100%; margin: 4px 0 0; font-size: 15px; min-height: 52px; }
  .footer-main > p, .footer-bottom, .plain-button { font-size: 12px; }
  .footer-bottom { flex-wrap: wrap; }
  .back-to-top { width: 44px; height: 44px; }
  .site-footer { padding-bottom: calc(100px + env(safe-area-inset-bottom)); }
  .mobile-contact { padding-inline: max(12px, env(safe-area-inset-left)) max(12px, env(safe-area-inset-right)); }
  .mobile-contact a { min-width: 0; min-height: 48px; font-size: 14px; gap: 6px; letter-spacing: 0; }

  /* Constrain both grid tracks and the fixed-size book during initial loading/rotation. */
  .comic-album, .album-stage, .album-image-button { width: 100%; max-width: 100%; min-width: 0; }
  .album-image-button > .book-page, .reader-body:not(.zoomed) > .book-page { max-width: calc(100% - 18px); aspect-ratio: 1312 / 1199; }
  .album-chapters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .album-chapters button { min-width: 0; min-height: 48px; font-size: 14px; letter-spacing: 0; }
  .album-toolbar { flex-wrap: wrap; min-height: 58px; gap: 8px; }
  .album-expand { font-size: 13px; min-height: 44px; }
  .album-toolbar #album-counter { font-size: 13px; }
  .album-caption { padding: 16px; }
  .album-caption h3 { font-size: 20px; }
  .album-caption p { font-size: 15px; }
  .album-caption #album-category { font-size: 12px; }
  .album-thumb-title { font-size: 12px; height: 41px; }
  .thumbs-scroll { flex-basis: 36px; min-height: 44px; }
  .album-hint { height: auto; min-height: 64px; padding: 12px; font-size: 13px; }
  .playback-controls, .comic-dialog .playback-controls { gap: 8px; flex-wrap: wrap; }
  .playback-controls label { font-size: 13px; }
  .playback-toggle, .comic-dialog .playback-toggle { font-size: 14px; min-height: 44px; min-width: 116px; }
  .playback-speed, .comic-dialog .playback-speed { font-size: 16px; min-height: 44px; min-width: 74px; }
  .comic-dialog {
    position: fixed; inset: 0; width: 100%; max-width: 100%; min-width: 0;
    height: 100vh; height: 100dvh; max-height: 100vh; max-height: 100dvh;
    margin: 0; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
  }
  .comic-dialog[open] { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(58px, auto) 48px minmax(50px, auto) minmax(0, 1fr) 59px minmax(44px, auto); }
  .comic-dialog > *, .comic-dialog .reader-toolbar > div { min-width: 0; }
  .comic-dialog .reader-toolbar { height: auto; gap: 8px; padding: 4px 12px; }
  .comic-dialog .reader-toolbar h2 { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
  .comic-dialog .icon-button { width: 44px; height: 44px; flex-shrink: 0; }
  .comic-dialog .reader-nav, .comic-dialog .reader-zoom { min-height: 44px; font-size: 14px; }
  .comic-dialog #reader-counter { font-size: 13px; }
  .comic-dialog .reader-body { width: 100%; min-width: 0; max-width: 100%; }
  .comic-dialog .reader-footer { font-size: 12px; line-height: 1.5; padding: 5px 12px; }

  .jobs-main { width: calc(100% - 32px); }
  .jobs-intro, .job-qualification, .recruit-source > p { font-size: 15px; }
  .facility-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .facility-choice, .choice-copy { min-width: 0; }
  .search-heading { flex-wrap: wrap; }
  .all-facilities, .reset-filters { font-size: 13px; min-height: 44px; }
  .job-filters > label, .job-filters legend, .employment-filters button { font-size: 14px; }
  .job-filters select { font-size: 16px; }
  .job-grid { grid-template-columns: minmax(0, 1fr); }
  .job-qualification > span, .facility-address, .facility-meta, .facility-contact p,
  .choice-area, .choice-copy > span:last-child, .job-location { font-size: 12px; }
  .facility-contact a, .job-link, .jobs-back { font-size: 14px; min-height: 48px; }
  .facility-contact a { overflow-wrap: anywhere; }
}

@media screen and (max-width: 360px) {
  .main-nav a { font-size: 12px; }
  .qualifications-grid { grid-template-columns: minmax(0, 1fr); }
  .album-chapters button { font-size: 13px; }
}
