/* Focused phone pass (<=700px). Loaded last; desktop untouched. */
@media(max-width:700px){
 html:not(.fw-locked){height:100%;overflow:hidden}
 html:not(.fw-locked) body{height:100dvh;display:flex;flex-direction:column;overflow:hidden;-webkit-text-size-adjust:100%}
 html:not(.fw-locked) body>.masthead,html:not(.fw-locked) body>.news-ticker{flex:0 0 auto}
 html:not(.fw-locked) body>.shell{flex:1 1 auto;min-height:0;height:auto!important;padding-bottom:0}

 /* Masthead: brand row + full-width search row, safe-area aware */
  .masthead{height:auto!important;display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px;grid-template-rows:44px 46px;gap:6px 6px!important;padding:max(6px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) 10px max(10px,env(safe-area-inset-left))!important}
 .masthead #workspace-menu-open{grid-column:1;grid-row:1;width:44px!important;height:44px!important}
 .masthead .identity{grid-column:2;grid-row:1;min-width:0;overflow:hidden}
 .masthead #theme{grid-column:3!important;grid-row:1!important;width:44px!important;height:44px!important}
 .masthead .header-actions{display:contents}
  .masthead .header-search{grid-column:1/-1!important;grid-row:2;width:100%;height:46px!important}
  .header-search button{width:44px!important;height:44px!important}
  .header-search input{font-size:16px!important;height:44px}
 #search-options{max-height:calc(100dvh - 180px)}
 .search-option{min-height:44px}

 /* Feed */
 .wire-layout{height:100%;min-height:0}
 .wire-panel{min-height:0;width:100%}
  .wire-panel>.filter-row{display:none!important}
 .story-list{overscroll-behavior:contain;padding-bottom:env(safe-area-inset-bottom)}
 .story{padding:18px max(18px,env(safe-area-inset-right)) 18px max(18px,env(safe-area-inset-left))}
 .story h2{max-width:none;font-size:17px;line-height:1.42;overflow-wrap:anywhere}
 .story-top{flex-wrap:wrap;row-gap:4px}
 .metadata-filter{padding-inline:18px}
 .metadata-filter .icon-button{width:44px;height:44px}

 /* Reader */
 .reader{height:100%;overscroll-behavior:contain;scrollbar-gutter:auto}
 .reader-toolbar{position:sticky;top:0;z-index:3;height:48px;padding:0 max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));background:var(--bg-primary)}
 .mobile-back{min-height:44px;padding:0 10px 0 4px;font-size:13px}
 .reader-article{padding:24px max(20px,env(safe-area-inset-right)) 32px max(20px,env(safe-area-inset-left))}
 .article-headline{font-size:clamp(25px,7.6vw,32px);letter-spacing:-.6px;overflow-wrap:break-word;hyphens:auto}
 .article-deck{font-size:17px}
 .prose p{font-size:17px;line-height:1.72}
 .citation-link{min-width:24px;min-height:24px}
 .metadata-chip{min-height:36px}
 .metadata-grid{grid-template-columns:minmax(0,1fr)}
 .byline{row-gap:8px}
  .reader>.reader-related{padding:24px max(20px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}
 .related-item{min-height:56px}
 .reader-article svg,.reader-article img,.reader-article table{max-width:100%}
 .reader-article table{display:block;overflow-x:auto}

 /* Secondary pages */
 .secondary-view{padding:22px max(18px,env(safe-area-inset-right)) calc(32px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))!important;overscroll-behavior:contain}
 .page-top h1,.catalog-heading h1{font-size:clamp(24px,7.4vw,29px)}
 .catalog-heading{margin-bottom:20px}
 .catalog-grid{grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
 .catalog-tile{min-height:0!important;padding:16px 48px 16px 16px!important}
 .catalog-icon{margin-bottom:14px}
 .catalog-title{font-size:18px;margin-bottom:6px;padding-right:0}
 .catalog-arrow{top:18px!important;right:16px!important}
 .button{min-height:44px}
 .faq-topics button{min-height:44px}

 /* Menu drawer & toast */
 #workspace-menu{padding-top:max(22px,env(safe-area-inset-top));padding-left:max(18px,env(safe-area-inset-left))}
 #workspace-menu-close{width:44px;height:44px}
 #toast{bottom:calc(20px + env(safe-area-inset-bottom))}
  #fw-entry .password-field input{font-size:16px}
}
@media(max-width:360px){
  .masthead .brand-lockup{gap:5px}
  .masthead .brand-lockup::before{flex-basis:10px;width:10px;height:29px;margin-inline:6px 2px}
 .story h2{font-size:16px}
 .prose p{font-size:16px}
}
