/* Mobile app shell. Desktop layout continues to use lt.css / room.css. */
.mobile-tabs{display:none}
@media(max-width:759px){
  :root{--r2:10px;--r3:14px;--r4:18px;--mobile-tabs-height:76px}
  html{scroll-padding-top:80px}
  body{font-size:15px;-webkit-tap-highlight-color:transparent}
  button,a,input,select,textarea{touch-action:manipulation}
  .btn{min-height:46px;border-radius:12px}
  .btn-icon{min-width:46px}
  .input,.select,.textarea,input:not([type=checkbox]):not([type=radio]):not([type=range]){font-size:16px}
  .input,.select{min-height:48px}
  .site-head{position:sticky;top:0;z-index:35;padding-top:env(safe-area-inset-top);box-shadow:0 3px 18px rgba(6,47,35,.04)}
  .site-head-in{min-height:64px;padding-top:8px;padding-bottom:8px}
  .site-nav .btn-dark,.site-nav a.tab{min-height:44px}
  .hero{padding-top:26px;padding-bottom:24px;gap:24px}
  .hero-copy{gap:16px;min-width:0;flex-basis:100%}
  .hero h1{font-size:clamp(34px,9.5vw,48px);line-height:1.04}
  .hero-lead{font-size:16px;line-height:1.6}
  .hero-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
  .hero-actions>.btn{width:100%;min-height:52px}
  .code-join{width:100%;min-width:0;min-height:52px}
  .code-join input{min-width:0;width:100%}
  .hero-bento{flex-basis:100%;min-width:0;gap:8px}
  .hero-tiles{min-height:220px}
  .hero-verse{grid-column:span 6}
  .hero-stat{grid-column:span 3}
  .features{gap:12px}
  .feature{padding:20px}
  .site-foot .wrap{gap:12px;padding-bottom:calc(20px + env(safe-area-inset-bottom))}
  .footer-brand{width:100%;font-size:12px}
  .auth-section{flex-direction:column;padding:16px 14px 28px;gap:14px}
  .auth-card{order:0;flex-basis:auto;padding:22px 18px;gap:16px}
  .auth-story{order:1;flex-basis:auto;padding:22px;gap:12px}
  .auth-story h1{font-size:28px}
  .auth-story p,.auth-story blockquote{font-size:14px}
  .auth-card form>.btn{min-height:52px}
  /* A fixed app bar and five thumb-reachable destinations for every host page. */
  .app{height:100dvh}
  .topbar{padding:8px 14px;padding-top:calc(8px + env(safe-area-inset-top));min-height:64px;border-bottom:1px solid var(--night-line)}
  .topbar .plus{display:none}
  .topbar .mobile-brand{margin-right:0;margin-left:auto}
  .topbar .menu{border-radius:12px}
  .scroll{overscroll-behavior-y:contain;scroll-padding-bottom:100px;-webkit-overflow-scrolling:touch}
  .page{padding:20px 14px calc(var(--mobile-tabs-height) + env(safe-area-inset-bottom) + 24px);gap:18px}
  .page-head{gap:12px;align-items:flex-start}
  .page-head h1{font-size:28px;line-height:1.15;overflow-wrap:anywhere}
  .page-head .ph-actions{width:100%;display:flex;flex-wrap:wrap}
  .page-head .ph-actions>.btn{flex:1}
  .mobile-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;z-index:32;left:0;right:0;bottom:0;min-height:var(--mobile-tabs-height);padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:var(--field);border-top:1px solid var(--line);box-shadow:0 -8px 30px rgba(6,47,35,.06)}
  .mobile-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;min-height:62px;color:var(--muted);text-decoration:none;font-size:11px;font-weight:600;border-radius:12px}
  .mobile-tab-icon{width:44px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:12px;font-size:18px}
  .mobile-tab[aria-current=page]{color:var(--green);font-weight:800}
  .mobile-tab[aria-current=page] .mobile-tab-icon{background:var(--green-soft)}
  .mobile-tab-create .mobile-tab-icon{height:36px;background:var(--green);color:var(--lime)}
  .mobile-tab-create[aria-current=page] .mobile-tab-icon{background:var(--green);color:var(--lime)}
  .side{padding-top:calc(16px + env(safe-area-inset-top));padding-bottom:calc(16px + env(safe-area-inset-bottom));width:min(320px,calc(100vw - 36px));border-radius:0 22px 22px 0;overflow-y:auto;overscroll-behavior:contain}
  .drawer-open .mobile-tabs{visibility:hidden}
  .card,.mcard,.stat,.dark-card{min-width:0}
  .mcard{padding:18px}
  .card-actions{flex-wrap:wrap;gap:8px}
  .card-actions .btn{min-height:44px}
  .two-col{grid-template-columns:minmax(0,1fr)}
  .facts,.dark-facts{grid-template-columns:repeat(3,minmax(0,1fr))}
  .facts>*{min-width:0;overflow-wrap:anywhere}
  .filters{max-width:100%;flex-wrap:wrap;gap:8px}
  .dialog{left:0;right:0;top:auto;bottom:0;transform:none;width:100%;max-height:calc(100dvh - 24px - env(safe-area-inset-top));border-radius:24px 24px 0 0;padding:22px 18px calc(22px + env(safe-area-inset-bottom));overscroll-behavior:contain}
  .dialog-actions{gap:8px}
  .dialog-actions>.btn{flex:1;min-height:48px}
  .invite-dialog{padding:0}
  .invite-left,.invite-right{min-width:0;flex-basis:100%;padding:20px}
  .invite-right{padding-bottom:calc(22px + env(safe-area-inset-bottom))}
  .dialog.pb-dialog,.dialog.pb-wide{width:100%}
  .dialog-close{width:44px;height:44px}
  body.host-body .toast{bottom:calc(var(--mobile-tabs-height) + env(safe-area-inset-bottom) + 12px)}
  .device-section{padding-bottom:calc(150px + env(safe-area-inset-bottom))}
  .device-stage{height:min(42dvh,100vw)}
  .join-cta{background:var(--bg);padding:12px 14px calc(12px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;box-shadow:0 -8px 28px rgba(6,47,35,.08)}
  /* Meeting controls retain their own navigation and landscape layout. */
  .rm-logo{width:40px;height:40px}
  .rm-title .t{font-size:14px}
  .pn-close,.pn-expand,.cb-icon,.cb-send{min-width:44px;min-height:44px}
  .pn-tabs{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
  .pn-tabs button{min-height:46px;flex-shrink:0}
  .sheet{border-radius:24px 24px 0 0;padding-bottom:calc(18px + env(safe-area-inset-bottom))}
  .sheet-grid button{border-radius:16px;min-height:80px}
  .room.mode-portrait .rm-bar{padding-bottom:calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--night-line);background:var(--night)}
  .room.mode-portrait .ctl{min-width:44px;min-height:48px;border-radius:14px}
  .room.mode-portrait .rm-panel-in{border-radius:22px 0 0 22px}
  .room.panel-full .rm-panel-in{border-radius:0}
}
@media(max-width:359px){.mobile-tab{font-size:10px}.mobile-tabs{padding-left:4px;padding-right:4px}.site-nav .btn-dark{padding:0 8px}.brand .livegroup-lockup{width:116px}.brand .livegroup-wordmark{width:112px}.rm-head{gap:6px}}
@media(max-height:500px) and (orientation:landscape){.mobile-tabs{min-height:58px;padding-top:2px;padding-bottom:2px}.mobile-tab{min-height:52px}.mobile-tab-icon{height:26px}.topbar{min-height:52px;padding-top:4px;padding-bottom:4px}}
@media print{.mobile-tabs{display:none!important}}
