/* Msg2me sitewide mobile polish — t194
 * Responsive (desktop+mobile), not mobile-exclusive.
 * Loaded after common.css + m2m-mnav-patch.css. Tokens align with t192 home.
 */
:root{
  --m2m-touch:44px;
  --r-lg:22px;
  --r-md:14px;
  --r-sm:10px;
  --shadow-card:0 18px 40px rgba(8,10,18,.28);
  --shadow-card-sm:0 10px 24px rgba(8,10,18,.18);
}

/* ========== Phone / narrow: touch ≥44, contain rails, safe-area ========== */
@media (max-width:767.98px){
  html,body{overflow-x:clip;max-width:100%;}
  img:not(.m2m-av):not(.rounded-circle),video,canvas{max-width:100%;height:auto;}
  iframe,embed,object{max-width:100%;}
  pre,code,.article-content,.thread-content,.post-body{overflow-wrap:anywhere;word-break:break-word;}

  /* Tables */
  .table-responsive,
  .reader-content table,
  .article-content table,
  .thread-content table,
  .post-body table{
    display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;
  }

  /* Modals / sheets */
  .modal-dialog{
    margin:max(.5rem, env(safe-area-inset-top,0px)) .5rem max(.5rem, env(safe-area-inset-bottom,0px));
    max-width:calc(100% - 1rem);
  }
  .modal-content{border-radius:var(--r-md);max-height:calc(100dvh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow:auto;}
  .dropdown-menu{max-width:min(280px, calc(100vw - 16px));}

  /* Forms: 16px avoids iOS zoom; taller hit */
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]),
  select,textarea,.form-control,.form-select{
    font-size:16px!important;
    min-height:var(--m2m-touch);
  }
  textarea.form-control,.composer textarea,[name=content],.reply-box textarea{
    min-height:96px;
  }

  /* Sticky top chrome respects notch */
  .m2m-mnav{
    padding-top:env(safe-area-inset-top,0px);
  }

  /* Horizontal chip / mode rails — scroll, don't blow the page */
  .m2m-mnav-track,
  .hashtag-bar,
  .hashtags,
  .forum-tag-cloud,
  .comm-board-pills,
  .np-channels,
  .np-ch-inner,
  .channel-tabs,
  .trwb-nav,
  .mode-switcher,
  .comm-mode-row,
  .home-hscroll,
  .pm-track{
    max-width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    scrollbar-width:none;
  }
  .m2m-mnav-track::-webkit-scrollbar,
  .hashtag-bar::-webkit-scrollbar,
  .hashtags::-webkit-scrollbar,
  .forum-tag-cloud::-webkit-scrollbar,
  .comm-board-pills::-webkit-scrollbar,
  .np-channels::-webkit-scrollbar,
  .trwb-nav::-webkit-scrollbar{display:none;}

  .hashtag-bar,.hashtags,.forum-tag-cloud,.comm-board-pills{
    display:flex;flex-wrap:nowrap;align-items:center;gap:8px;
  }
  .hashtag-bar .hashtag,
  .hashtags .hashtag,
  .forum-tag-cloud .hashtag,
  .comm-board-pills .hashtag,
  a.hashtag{
    flex:0 0 auto;
    min-height:var(--m2m-touch);
    display:inline-flex;align-items:center;
    padding:8px 12px;
    box-sizing:border-box;
  }

  /* Nav pills */
  .m2m-mnav-item{
    min-height:var(--m2m-touch)!important;
    padding:10px 14px!important;
    display:inline-flex!important;align-items:center;justify-content:center;
  }

  /* Lang / theme / home chrome */
  .topbar-lang-btn,
  .m2m-theme-toggle,
  .np-tb-icon,
  button.topbar-lang-btn{
    width:var(--m2m-touch)!important;
    height:var(--m2m-touch)!important;
    min-width:var(--m2m-touch)!important;
    min-height:var(--m2m-touch)!important;
  }

  .subsite-brand,
  .np-brand{
    min-height:var(--m2m-touch);
    display:inline-flex!important;
    align-items:center;
    padding:6px 4px;
  }

  /* Bottom tab already ≥44 via common; ensure label+icon stack */
  .m2m-tab{
    min-height:var(--m2m-touch)!important;
  }

  /* Trade bottom pad was 40px in audit — lift to tabbar */
  body.trade-body,
  body.trwb,
  .trwb-wrap{
    padding-bottom:calc(var(--m2m-tabbar-space,56px) + env(safe-area-inset-bottom,0px));
  }
  .trwb-nav-item{
    min-height:var(--m2m-touch);
    display:inline-flex;align-items:center;
    padding:8px 12px;
  }

  /* Pathwalker map HUD */
  .iconbtn{
    width:var(--m2m-touch)!important;
    height:var(--m2m-touch)!important;
    min-width:var(--m2m-touch)!important;
    min-height:var(--m2m-touch)!important;
  }
  .pw-twin{
    min-width:var(--m2m-touch);
    min-height:var(--m2m-touch);
    display:inline-flex;align-items:center;justify-content:center;
    padding:8px!important;
  }
  .pw-back-home{
    width:var(--m2m-touch)!important;
    height:var(--m2m-touch)!important;
    min-width:var(--m2m-touch)!important;
    min-height:var(--m2m-touch)!important;
    display:inline-flex!important;align-items:center;justify-content:center;
  }
  /* Keep map tool row scrollable inside viewport */
  .topbar .tools,
  .pw-tools,
  .map-hud-tools,
  .hud-tools{
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }

  /* Shop mesh popover — keep inside viewport */
  .shop-mesh-minicart{position:relative;}
  .shop-mesh-box{
    left:auto!important;
    right:0!important;
    width:min(320px, calc(100vw - 24px))!important;
    max-width:calc(100vw - 24px)!important;
  }

  /* Community composer / sticky reply */
  .comm-composer,
  .reply-composer,
  .post-composer,
  .fixed-composer,
  .composer-bar{
    padding-bottom:calc(8px + env(safe-area-inset-bottom,0px));
    padding-left:calc(12px + env(safe-area-inset-left,0px));
    padding-right:calc(12px + env(safe-area-inset-right,0px));
  }

  /* Mode switcher buttons */
  .mode-switcher .btn,
  .comm-mode-row .btn,
  .read-mode-switch .btn{
    min-height:var(--m2m-touch);
    display:inline-flex;align-items:center;
  }

  /* Cards use home tokens lightly */
  .feed-card,
  .forum-thread-row,
  .np-card,
  .glass-card{
    border-radius:var(--r-md);
  }
}

/* html.m2m-phone: same touch / chrome even when CSS width ≥768 (Harmony etc.) */
html.m2m-phone .topbar-lang-btn,
html.m2m-phone .m2m-theme-toggle,
html.m2m-phone .np-tb-icon{
  width:var(--m2m-touch)!important;
  height:var(--m2m-touch)!important;
  min-width:var(--m2m-touch)!important;
  min-height:var(--m2m-touch)!important;
}
html.m2m-phone .bc-main-home,
html.m2m-phone .subsite-home-link,
html.m2m-phone .cc-main-home,
html.m2m-phone .rv-main-home,
html.m2m-phone .jh-back-home,
html.m2m-phone .m2m-tools-home,
html.m2m-phone .np-main-home,
html.m2m-phone .site-home,
html.m2m-phone .ent-site-home,
html.m2m-phone .trwb-main-home,
html.m2m-phone .pw-back-home{
  flex:0 0 var(--m2m-touch)!important;
  width:var(--m2m-touch)!important;
  height:var(--m2m-touch)!important;
  max-width:var(--m2m-touch)!important;
  max-height:var(--m2m-touch)!important;
  min-width:var(--m2m-touch)!important;
  min-height:var(--m2m-touch)!important;
  aspect-ratio:1/1;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
}
html.m2m-phone .bc-main-home svg,
html.m2m-phone .subsite-home-link svg,
html.m2m-phone .cc-main-home svg,
html.m2m-phone .rv-main-home svg,
html.m2m-phone .jh-back-home svg,
html.m2m-phone .m2m-tools-home svg,
html.m2m-phone .np-main-home svg,
html.m2m-phone .site-home svg,
html.m2m-phone .ent-site-home svg,
html.m2m-phone .trwb-main-home svg,
html.m2m-phone .pw-back-home svg{
  width:22px!important;
  height:22px!important;
  max-width:22px!important;
  max-height:22px!important;
}
html.m2m-phone .m2m-mnav-item{
  min-height:var(--m2m-touch)!important;
  padding:10px 14px!important;
  display:inline-flex!important;
  align-items:center;
}
html.m2m-phone .subsite-brand,
html.m2m-phone .np-brand{
  min-height:var(--m2m-touch);
  display:inline-flex!important;
  align-items:center;
}
html.m2m-phone .hashtag-bar,
html.m2m-phone .hashtags,
html.m2m-phone .forum-tag-cloud,
html.m2m-phone .comm-board-pills,
html.m2m-phone .np-channels,
html.m2m-phone .trwb-nav{
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  flex-wrap:nowrap;
}
html.m2m-phone .m2m-mnav{
  padding-top:env(safe-area-inset-top,0px);
}
html.m2m-phone .iconbtn{
  width:var(--m2m-touch)!important;
  height:var(--m2m-touch)!important;
}
html.m2m-phone .shop-mesh-box{
  left:auto!important;
  right:0!important;
  width:min(320px, calc(100vw - 24px))!important;
  max-width:calc(100vw - 24px)!important;
}

/* Language classroom: keep play_focus / 本课全部 usable on phone */
@media (max-width:767.98px){
  html.m2m-phone .cat-h,
  .cat-h{
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    min-height:var(--m2m-touch);
  }
  html.m2m-phone #catPlay,
  #catPlay{
    min-height:var(--m2m-touch);
    min-width:7.5rem;
    padding:8px 12px;
  }
  .acts button,
  .listen-tools button,
  .icon-btn{
    min-width:var(--m2m-touch);
    min-height:var(--m2m-touch);
  }
}


/* === t194b residual === */
@media (max-width:767.98px){
  /* Shop mesh: pin to viewport right; avoid negative left from off-canvas parent */
  .shop-mesh-minicart .shop-mesh-box,
  html.m2m-phone .shop-mesh-box{
    position:fixed!important;
    top:auto!important;
    bottom:calc(var(--m2m-tabbar-space,56px) + 12px + env(safe-area-inset-bottom,0px))!important;
    left:auto!important;
    right:12px!important;
    width:min(320px, calc(100vw - 24px))!important;
    max-width:calc(100vw - 24px)!important;
    z-index:1200!important;
  }

  /* Trade: force tabbar clearance */
  body.trwb,
  body.trade-body,
  html.m2m-phone body:has(.trwb-nav),
  html.m2m-phone body:has(.trwb-main-home){
    padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))!important;
  }

  /* Channel shells: breadcrumb / more links */
  .food-more,.edu-more,.spo-more,.life-more,.jb-more,.gal-btn,
  a.le-more,
  .breadcrumb a,
  .subsite-main nav a[href$="/"],
  .subsite-main .breadcrumb-item a{
    min-height:44px;
    display:inline-flex;
    align-items:center;
    padding:8px 4px;
  }

  /* Pathwalker auth chips */
  .pw-auth-btn{
    min-width:44px;min-height:44px;
    display:inline-flex;align-items:center;justify-content:center;
    padding:8px 12px!important;
  }

  /* Closed details summary links shouldn't count; ensure more-panel links tall when open */
  .m2m-mnav-more-link{
    min-height:44px!important;
    display:flex!important;
    align-items:center;
    padding:10px 12px!important;
  }

  /* Shop category chips */
  .shop-cats a, .shop-nav a, .shop-filter a{
    min-height:44px;
    display:inline-flex;align-items:center;
    padding:8px 12px;
  }
}
html.m2m-phone .shop-mesh-box{
  position:fixed!important;
  bottom:calc(var(--m2m-tabbar-space,56px) + 12px + env(safe-area-inset-bottom,0px))!important;
  left:auto!important;
  right:12px!important;
  top:auto!important;
}