/* Loaded after desktop styles so later legacy rules cannot restore desktop columns. */
@media(max-width:900px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .main,.content,.form-shell,.form-shell>*{min-width:0}
  .content{padding-bottom:calc(100px + env(safe-area-inset-bottom,0px))}
  .form-shell{grid-template-columns:minmax(0,1fr);gap:16px}
  .form-shell .steps{position:static;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;padding:6px;gap:4px;overflow:visible}
  .form-shell .step{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:7px;padding:10px 5px;text-align:center;font-size:12px;line-height:1.4}
  .form-shell .step-num{flex-shrink:0}
  .form-shell .form-card{width:100%;min-width:0}
  .form-shell .form-grid{grid-template-columns:minmax(0,1fr)}
  .form-shell .field-wide{grid-column:auto}
  .form-shell .field{min-width:0}
  .form-shell input,.form-shell select,.form-shell textarea{width:100%;min-width:0;max-width:100%;box-sizing:border-box;font-size:16px}
  .form-shell .check-row{grid-template-columns:minmax(0,1fr)}
  .form-shell .segmented{width:100%}
  .form-shell .segmented button{flex:1;min-height:44px}
  .form-shell .form-actions{flex-wrap:wrap;gap:10px}
  .form-shell .form-actions>div{display:flex;flex-wrap:wrap;gap:10px;min-width:0}
  .mobile-nav{display:grid;padding:4px 6px calc(4px + env(safe-area-inset-bottom,0px));min-height:64px}
  .mobile-nav button{min-width:0;min-height:52px;align-content:center;gap:4px;padding:6px 2px;font-size:11px}
  .mobile-nav button:focus-visible{outline:2px solid var(--navy);outline-offset:-2px}
  .toast{bottom:calc(82px + env(safe-area-inset-bottom,0px))}
}
.mobile-menu-open{overflow:hidden}
.mobile-menu{width:min(480px,calc(100% - 24px));max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid var(--line);border-radius:14px;background:white;color:var(--ink);box-shadow:0 24px 70px rgba(0,0,0,.25);overflow-y:auto;overscroll-behavior:contain}
.mobile-menu::backdrop{background:rgba(11,35,50,.6)}
.mobile-menu-head{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line);background:white}
.mobile-menu-head h2{margin:0;font-size:19px}
.mobile-menu-head button{min-width:44px;min-height:44px;font-size:28px;line-height:1}
.mobile-menu .nav{padding:12px;gap:6px}
.mobile-menu .nav button{width:100%;min-height:46px;color:var(--navy);background:white;text-align:left;font-size:14px;gap:12px}
.mobile-menu .nav button:hover{background:#f1f5f7}
.mobile-menu .nav button.active{background:#edf2f5;color:var(--navy);box-shadow:inset 3px 0 0 var(--red)}
.mobile-menu .nav-module{overflow:visible}
.mobile-menu .nav-module h3{margin:14px 10px 7px;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.mobile-menu .module-subnav.open{max-height:none;opacity:1;margin:0;padding:0;border:0;gap:4px}
.mobile-menu .nav-divider{background:var(--line);margin:8px 10px}
.mobile-menu button:focus-visible{outline:2px solid var(--navy);outline-offset:-2px}
.mobile-all-sections{margin:0 18px 18px;width:calc(100% - 36px)}
@media print{.mobile-menu{display:none!important}}
