/* A quiet mobile shell, with full-width headlines and consistent touch targets. */
@media(max-width:760px){
 .header{height:58px;gap:12px;padding-inline:16px;backdrop-filter:none;background:var(--paper)}
 .header .wordmark{min-width:0;font-size:23px;letter-spacing:-1px}
 .header .search{flex:1;min-width:0;width:auto;padding:8px;gap:6px}
 .header .search input{font-size:16px}
 .header .search input::placeholder{font-size:12px}
 .header .header-end{gap:8px;margin-left:0}
 .header .theme-switch-label{display:none}
 .header .theme-switch{min-width:36px;min-height:44px;padding:0}
 .header .avatar{width:36px;height:36px}
 .layout,body.site-wide .layout{padding-inline:16px}
 #main,#site-main{padding-top:12px;padding-bottom:calc(76px + env(safe-area-inset-bottom));min-width:0}
 #main>.tabs{gap:0;justify-content:space-between;margin:0 0 12px;padding:0;min-height:44px}
 #main>.tabs>button,#main>.tabs>a{font-size:12px;min-height:44px;padding:10px 6px;white-space:nowrap}
 #main>.tabs>.filter-toggle{min-width:40px;margin-left:4px}
 #feed>.card{border:1px solid var(--line);border-radius:10px;padding:14px;margin:0 0 12px;background:var(--paper);box-shadow:none}
 #feed .card-head{margin-bottom:8px;gap:4px 8px}
 #feed .card-head .feed-brand{font-size:12px}
 #feed .feed-brand .company-logo{--logo-size:24px!important;width:24px;height:24px;flex-basis:24px}
 #feed .card-title{font-size:16px;line-height:1.4;letter-spacing:-.15px}
 #feed>.card.has-media .card-story{grid-template-columns:minmax(0,1fr);gap:10px}
 #feed>.card.has-media .card-title{grid-column:1/-1;grid-row:1}
 #feed>.card.has-media .card-summary{grid-column:1;grid-row:2;margin:0;-webkit-line-clamp:2}
 #feed>.card.has-media .card-image{grid-column:1;grid-row:3;align-self:start;border-radius:6px;width:100%;aspect-ratio:16/9}
 #feed>.card.has-media .card-image img{width:100%;height:100%;aspect-ratio:16/9;object-fit:contain}
 #feed>.card.has-media .article-image img{object-fit:cover}
 #feed>.card.has-media .feed-company-references{grid-column:1/-1;grid-row:auto}
 #feed .card-summary{font-size:13px;line-height:1.5;color:var(--muted)}
 #feed .card-footer,#feed>.card.has-media .card-footer{margin:4px -6px -6px;gap:4px}
 #feed .action,#feed .source{min-width:40px;min-height:40px;padding:8px 6px}
 #feed .card .card-footer .action.save{margin-left:auto!important}
 #feed>.partner-placements{margin:12px 0;padding:14px;border-radius:8px}
 .left-rail{padding-bottom:env(safe-area-inset-bottom)}
 .left-rail .nav-item{min-height:48px}
 .site-tabs,.site-subnav{gap:16px;scrollbar-width:none}
 .site-tabs>a,.site-tabs>button,.site-subnav>a,.site-subnav>button{min-height:44px;white-space:nowrap}
 .page-heading{margin-bottom:16px}
 .page-heading h1{font-size:25px;line-height:1.25}
 .directory-tools{gap:8px;margin-bottom:14px}
 dialog input[type=email],dialog input[type=search],dialog input[type=text],.feed-newsletter input{font-size:16px}
}

@media(max-width:480px){
 .product-grid{grid-template-columns:minmax(0,1fr);gap:0}
 .product-grid>.product-tile{display:grid;grid-template-columns:88px minmax(0,1fr);gap:14px;padding:14px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent}
 .product-tile .product-cover{width:88px;height:104px;min-height:0;aspect-ratio:auto;border:0;background:transparent}
 .product-tile .product-cover img{width:100%;height:100%;object-fit:contain}
 .product-tile .product-tile-copy{padding:0;min-width:0;justify-content:center}
 .product-tile .product-identity{gap:8px}
 .product-tile .product-identity-copy{min-width:0;flex:1}
 .product-tile .product-name{font-size:15px;overflow-wrap:normal;word-break:normal}
 .product-tile .product-meta{margin-top:10px;padding:0;justify-content:flex-start;gap:6px 12px}
}

/* Give navigation and search their own alignment instead of squeezing four controls. */
@media(max-width:760px){
 .header{display:grid;grid-template-columns:1fr auto;grid-template-rows:44px 40px;height:auto;gap:4px 12px;padding:4px 16px 10px;align-items:center}
 .header .wordmark{grid-column:1;grid-row:1;font-size:23px}
 .header .header-end{grid-column:2;grid-row:1;gap:14px}
 .header .theme-switch-label{display:inline;font-size:12px;color:var(--muted)}
 .header .theme-switch{gap:7px;min-height:44px}
 .header .avatar{width:40px;height:40px;border:0;background:transparent;display:flex;align-items:center;justify-content:center}
 .header .search{grid-column:1/-1;grid-row:2;width:100%;height:40px;padding:0 12px;gap:10px;border-radius:7px}
 .header .search .universal-trigger{width:24px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;flex:none}
 .header .search input{height:40px;font-size:16px}
 .header .search input::placeholder{font-size:13px}
 #main{padding-top:0}
 #main>.tabs{height:48px;min-height:48px;align-items:stretch;gap:4px;margin-bottom:12px;border-bottom:0}
 #main>.tabs>button[role=tab]{height:48px;border-bottom:0;position:relative}
 #main>.tabs>button[role=tab][aria-selected=true]::after{content:"";position:absolute;left:5px;right:5px;bottom:4px;height:2px;background:var(--ink)}
 #main>.tabs>button,#main>.tabs>a{display:inline-flex;align-items:center;justify-content:center;font-size:12px;padding:0 5px;min-height:44px}
 #main>.tabs>.filter-toggle{width:40px;min-width:40px;padding:0;border:0;border-radius:0;background:transparent;margin:0}
 #main>.tabs>.filter-toggle svg{width:18px;height:18px}
}