/* 窄屏与竖屏：底栏布局、手机字号（放在最后加载，才压得过前面的同名规则） */
@media (max-width:820px),(max-aspect-ratio:1/1){
  :root{--bn:calc(var(--bnav-h) + env(safe-area-inset-bottom));--sbw:0px}
  .app{display:block}#side{display:none}
  header{padding:var(--sp-4) var(--sp-6)}header h1{display:block}
  #bnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:var(--z-float);background:var(--panel);border-top:1px solid var(--line);padding:var(--sp-2) var(--sp-3) calc(4px + env(safe-area-inset-bottom));justify-content:space-around}
  #bnav button{flex:1;flex-direction:column;gap:0;justify-content:center;align-items:center;font-size:var(--text-caption);padding:var(--sp-2) var(--sp-1);min-height:48px;min-width:44px;position:relative;text-align:center}
    #bnav .badge{position:absolute;top:2px;right:calc(50% - 22px);margin:0}
  main{padding-bottom:84px}
}
@media (max-width:820px),(max-aspect-ratio:1/1){main{padding-bottom:calc(var(--bn) + 28px)}}
@media (max-width:600px){body{font-size:var(--text-body-mobile)}.muted{font-size:var(--text-small-mobile)}.msg{font-size:var(--text-msg-mobile)}.msg .t{font-size:var(--text-note)}.tag{font-size:var(--text-caption)}
  main{padding:var(--sp-6) var(--sp-6) 84px}.msg{max-width:92%}.board{gap:var(--sp-5)}
  .agin,.dockin{padding-left:var(--sp-6);padding-right:var(--sp-6)}
  header .btn{padding:var(--sp-2) 9px}header h1{font-size:var(--text-lead);white-space:nowrap}
  header{flex-wrap:nowrap}header .grow{display:none}#st{min-width:0;flex:1 1 auto;overflow:hidden;min-height:44px}
  #sttext{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}header .btn{flex:none}.hide-sm{display:none}
}
