/* 2026-10-09 mobile header balance */
@media (max-width:680px){
  .site-header{background:#fff}
  .header-inner{
    min-height:96px;
    gap:10px;
    padding-block:8px;
  }
  .brand{
    display:flex;
    align-items:center;
    flex:0 0 auto;
  }
  .brand-logo{
    width:108px;
    max-width:27vw;
    height:auto;
  }
  .header-actions{
    margin-left:auto;
    gap:8px;
    min-width:0;
  }
  .login{
    min-height:50px;
    padding:10px 14px;
    border-radius:10px;
    font-size:11px;
    gap:8px;
    max-width:min(54vw,230px);
  }
  .login .lock{width:16px;height:16px}
  .login-label{
    white-space:normal;
    line-height:1.35;
    text-align:center;
  }
  .js .menu-toggle{
    flex:0 0 48px;
    width:48px;
    min-width:48px;
    min-height:50px;
    padding:5px 3px;
    border-radius:10px;
  }
  .menu-symbol{width:22px;height:20px;gap:6px}
  .menu-symbol i{width:22px}
  .menu-caption{font-size:9px;line-height:1.15}
}
@media (max-width:390px){
  .header-inner{min-height:92px;gap:7px}
  .brand-logo{width:96px;max-width:25vw}
  .header-actions{gap:5px}
  .login{max-width:55vw;padding-inline:10px;font-size:10.5px}
  .js .menu-toggle{flex-basis:44px;width:44px;min-width:44px}
}
@media (max-width:350px){
  .brand-logo{width:88px}
  .login{font-size:10px;padding-inline:8px}
  .login .lock{display:none}
}