/* Mobile overrides keep the existing desktop and demo layouts intact. */
@media(max-width:650px){
 html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior-y:none}
 .app{width:100%;height:var(--mchat-viewport-height,100dvh);padding-bottom:calc(60px + env(safe-area-inset-bottom,0px));box-shadow:none}
 body>.bottom-nav{height:calc(60px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px)}
 body.keyboard-open .app{padding-bottom:0}body.keyboard-open>.bottom-nav{display:none}
 .app-view{min-width:0;overscroll-behavior:contain}.chat>header{flex-shrink:0;height:60px;padding:8px 12px;gap:8px}
 .chat header b{display:block;max-width:60vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .chat .call-actions{padding:5px 10px;gap:6px;flex-shrink:0}.chat .call-actions>small{flex-basis:100%;font-size:11px}
 #realEmojis{flex-wrap:nowrap!important;overflow-x:auto;gap:4px!important;max-width:100%;scrollbar-width:thin}
 #realEmojis button{flex:0 0 40px;min-height:40px}.composer{padding:6px 12px 10px;max-height:48%;overflow-y:auto}
 .composer textarea{display:block;font:16px/1.45 system-ui,sans-serif;min-height:40px;max-height:110px;padding:8px 0;overflow-y:auto}
 input,select{font-size:16px}.send{min-width:70px;min-height:42px;float:none;display:block;margin-left:auto}
 .messages{padding:12px;gap:12px;overscroll-behavior:contain}.message{min-width:0}.bubble{min-width:0;max-width:100%}.message img{max-width:100%}
 .time{font-size:10px;white-space:normal;overflow-wrap:anywhere}.red-packet{width:min(245px,64vw)}
 dialog{box-sizing:border-box;width:calc(100vw - 24px)!important;max-width:calc(100vw - 24px);max-height:calc(var(--mchat-viewport-height,100dvh) - 24px)!important;padding:22px 16px;overflow-y:auto}
 dialog::backdrop{background:#132c2466}dialog h2{padding-right:20px;font-size:20px}dialog input:not([type=checkbox]):not([type=radio]){max-width:100%;box-sizing:border-box}
 dialog button{min-height:40px}.close,.person-close{min-width:40px;min-height:40px}.claim{gap:8px;flex-wrap:wrap;overflow-wrap:anywhere}.claim>span{min-width:0}
 #historyResults{max-height:calc(var(--mchat-viewport-height,100dvh) * .42)!important}#historyForm{display:flex;gap:6px}#historyQuery{min-width:0;flex:1}
 #realGroupInfoMembers,#realGroupChoices{max-height:calc(var(--mchat-viewport-height,100dvh) * .36)!important}
 .contact-row>span:last-child{min-width:0}.contact-row b{overflow-wrap:anywhere}.real-friend a{flex:1}.real-friend small{max-width:65vw!important}
 .friend-notice{top:max(8px,env(safe-area-inset-top,0px));left:12px;right:12px;max-width:none;padding:12px}
 .profile-card small{overflow-wrap:anywhere}.page-header{padding-top:max(12px,env(safe-area-inset-top,0px))}
 .packet-dialog{padding:0}.packet-card{width:100%;box-sizing:border-box}
}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #248868;outline-offset:2px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}