/* Calm, search-first mobile shell. Desktop remains unchanged. */
@media(max-width:640px){
  html,body{max-width:100%;overflow-x:hidden;background:#f7faf9}

  /* One quiet task bar: original logo, +Add, and menu. */
  .hdr{height:62px;position:sticky;top:0;z-index:300;padding:7px 12px;background:#1A2E2D;border:0;box-shadow:0 2px 12px rgba(10,28,27,.16);overflow:visible}
  .brand{gap:7px;min-width:0;margin-right:8px}
  .brand-icon-img{width:38px;height:38px;border-radius:10px}
  .brand-name{font-size:19px;line-height:1;white-space:nowrap}
  .hdr-right{gap:7px!important;flex:none!important}
  .hdr .sync-pill,.hdr #auth-bar,.hdr .hbtn-about{display:none!important}
  #hdr-add-btn{display:flex;align-items:center;justify-content:center;min-width:66px;min-height:42px;padding:0 12px!important;border-radius:12px!important;font-size:13px!important;font-weight:700!important;line-height:1!important}
  .hdr-menu-btn{display:flex!important;align-items:center;justify-content:center;width:44px;min-width:44px;min-height:42px;padding:0!important;border-radius:12px!important;background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.1)!important;font-size:20px!important;line-height:1!important}
  .hdr-menu{top:68px;right:12px;left:auto;width:min(286px,calc(100vw - 24px));min-width:0;max-height:calc(100dvh - 86px);overflow-y:auto;padding:7px;border:1px solid #dce7e5;border-radius:14px;box-shadow:0 14px 38px rgba(10,28,27,.28)}
  .hdr-menu-email{padding:9px 11px 8px;font-size:11px}
  .hdr-menu-item{min-height:46px;padding:11px 12px;border-radius:9px;font-size:14px}

  /* Search gets visual priority without a large introductory block. */
  .search-zone{padding:10px 12px 4px!important;background:#f7faf9;border-bottom:0}
  .panel{padding:0 0 5px!important}
  .gbar{min-height:48px!important;padding:0 8px 0 13px!important;border:1px solid #c8ddda!important;border-radius:14px!important;background:#fff;box-shadow:0 2px 8px rgba(26,46,45,.05)!important}
  .gbar.primary{min-height:50px!important;margin-bottom:4px!important;border:1px solid #a9ceca!important;border-radius:14px!important}
  body:not(.loc-open) .gbar.primary{border-bottom:1px solid #a9ceca!important;border-radius:14px!important}
  #search{padding:10px 0!important;color:#1A2E2D}
  #loc-chip,#search-go{width:40px;height:40px;border-radius:11px}
  #loc-chip{border:0;background:#eef7f5;font-size:16px}
  #search-go{background:#1A2E2D;color:#fff}
  body.loc-open .gbar:not(.primary){margin-top:7px!important}

  /* One predictable control strip; it wraps cleanly even at 320px. */
  .page-body{height:calc(100dvh - 62px - var(--sz,86px))}
  .results-wrap{padding:12px 12px calc(78px + env(safe-area-inset-bottom))!important}
  .results-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;top:-12px;margin:-12px -12px 11px;padding:9px 12px 8px!important;background:#f7faf9;border-bottom:1px solid #e1ebe9}
  .results-count{grid-column:1 / -1;min-width:0;font-size:12px!important;color:#657572;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #filters-chip,#sel-toggle,.results-meta .sort-btn{width:100%;max-width:none;min-width:0;height:38px;min-height:38px;margin:0;padding:0 7px!important;border:1px solid #c8ddda;border-radius:10px;background:#fff;color:#1A2E2D;font-size:11px!important;font-weight:600;text-align:center;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
  #filters-chip.active,body.select-mode #sel-toggle{background:#1A2E2D;color:#fff;border-color:#1A2E2D}

  /* Resource cards keep every action but reduce duplicated decoration. */
  .bubble-grid{gap:11px!important}
  .bubble{padding:14px!important;border-radius:14px!important;border-left-width:3px;box-shadow:0 2px 9px rgba(26,46,45,.06)}
  .b-top{justify-content:flex-end;margin-bottom:5px}
  .b-icon{display:none}
  .b-badge{max-width:100%;padding:3px 8px;font-size:9px;overflow:hidden;text-overflow:ellipsis}
  .b-name{font-size:16px!important;line-height:1.28!important;margin-bottom:3px}
  .b-org{margin-bottom:6px;font-size:12px!important}
  .b-desc{margin-bottom:8px;font-size:12.5px!important;line-height:1.45!important}
  .b-tags{max-height:24px;margin-bottom:8px;gap:4px}
  .tag{padding:3px 7px;font-size:10px}
  .b-footer{gap:8px;padding-top:8px}
  .b-acts{display:grid;width:100%;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px!important}
  .bact{width:100%;min-width:0;min-height:40px!important;padding:8px 5px!important;border-radius:10px!important;font-size:12px!important;justify-content:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

}

@media(max-width:350px){
  .brand-name{font-size:17px}
  .brand-icon-img{width:35px;height:35px}
  #hdr-add-btn{min-width:59px;padding:0 8px!important;font-size:12px!important}
  .hdr-menu-btn{width:41px;min-width:41px}
  .results-meta{gap:5px}
  #filters-chip,#sel-toggle,.results-meta .sort-btn{padding-inline:4px!important;font-size:10px!important}
  .b-acts{gap:5px!important}
  .bact{font-size:11px!important}
}

@media(max-width:640px) and (orientation:landscape){
  .hdr{height:54px;padding-block:5px}
  .brand-icon-img{width:34px;height:34px}
  .hdr-menu{top:59px;max-height:calc(100dvh - 68px)}
  .search-zone{padding-top:7px!important}
  .page-body{height:calc(100dvh - 54px - var(--sz,80px))}
}

@media(max-width:640px) and (prefers-reduced-motion:reduce){
  .bubble,.hdr-menu,.drawer,.modal{transition:none!important;animation:none!important}
}