/* Phase 163: mobile header and homepage containment. Desktop styles untouched. */
@media (max-width: 760px) {
  .topbar { box-sizing:border-box; height:auto !important; min-height:76px; padding:10px 14px !important; display:flex; flex-wrap:wrap !important; align-items:center; justify-content:space-between !important; gap:8px !important; position:relative; }
  .topbar .brand { flex:1 1 0 !important; min-width:0; margin:0 !important; gap:8px; }
  .topbar .brand-mark { flex-shrink:0; }
  .topbar .brand > * { min-width:0; }
  .topbar #menu { display:flex !important; align-items:center; justify-content:center; flex:0 0 44px; order:2; min-width:44px; min-height:44px; border:1px solid #c7a362; border-radius:8px; background:#19392c; color:#fff2cf; cursor:pointer; }
  .topbar #nav { display:none !important; position:absolute !important; top:100% !important; left:0 !important; right:0 !important; width:100% !important; margin:0 !important; padding:12px 14px !important; background:#132924 !important; flex-direction:column !important; align-items:stretch !important; flex-wrap:nowrap !important; gap:8px !important; box-sizing:border-box; z-index:1000; max-height:calc(100dvh - 76px); overflow-y:auto; box-shadow:0 12px 18px #0004; }
  .topbar #nav.open { display:flex !important; }
  .topbar #nav .lodge-sign { display:flex !important; width:100%; box-sizing:border-box; min-height:44px; justify-content:flex-start; padding:10px 14px !important; font-size:15px !important; }
  .topbar #br-recent-nav { position:relative !important; order:1; margin:0 !important; flex:0 1 auto; min-width:0; }
  .topbar #br-recent-toggle { min-height:44px; max-width:100%; font-size:12px !important; padding:8px !important; white-space:normal; }
  .topbar #br-recent-menu { right:0 !important; left:auto !important; width:min(280px,calc(100vw - 28px)); max-width:calc(100vw - 28px); z-index:1001; }
  .retreat-welcome { display:grid !important; grid-template-columns:minmax(0,1fr) !important; width:calc(100% - 32px) !important; max-width:100%; gap:20px !important; padding:24px 0 !important; box-sizing:border-box; }
  .retreat-welcome-copy { min-width:0; max-width:100%; }
  .retreat-welcome-copy h1 { font-size:clamp(2rem,8vw,3.2rem) !important; line-height:1.12 !important; overflow-wrap:break-word; }
  .retreat-welcome-copy .btn { max-width:100%; box-sizing:border-box; }
  .retreat-overview, .retreat-overview a { max-width:100%; min-width:0; }
  .retreat-overview img { max-width:100% !important; height:auto !important; }
}
@media (max-width:390px) {
 .topbar { padding-inline:10px !important; gap:5px !important; }
 .topbar .brand { font-size:clamp(12px,3.7vw,17px) !important; }
 .topbar #br-recent-toggle { font-size:11px !important; }
 .topbar #menu { flex-basis:40px; min-width:40px; }
}