.brand-with-icon{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:max-content;
}
.brand-logo-mark{
  width:42px;
  height:42px;
  flex:0 0 42px;
  border-radius:12px;
  overflow:hidden;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,#0b2f63,#1768e5);
  box-shadow:0 10px 20px rgba(23,104,229,.18);
}
.brand-logo-mark img{
  display:block;
  width:24px;
  height:24px;
}
.brand-text,
.admin-logo-text{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.brand-text-title,
.admin-logo-text-title{
  display:block;
  line-height:1;
  font:inherit;
  color:inherit;
  letter-spacing:inherit;
}
.brand-text small{
  margin-top:4px;
}

.admin-logo-with-icon{
  display:flex;
  align-items:center;
  gap:12px;
}
.admin-logo-mark{
  width:40px;
  height:40px;
  flex:0 0 40px;
  border-radius:12px;
  overflow:hidden;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.08);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.admin-logo-mark img{
  display:block;
  width:24px;
  height:24px;
}
.admin-logo-text small{
  margin-top:4px;
}

@media(max-width:900px){
  .brand-with-icon{gap:10px;}
  .brand-logo-mark{width:38px;height:38px;flex-basis:38px;border-radius:11px;}
  .brand-logo-mark img{width:22px;height:22px;}
}

@media(max-width:560px){
  .brand-with-icon{gap:9px;}
  .brand-logo-mark{width:36px;height:36px;flex-basis:36px;border-radius:10px;}
  .brand-logo-mark img{width:20px;height:20px;}
  .admin-logo-mark{width:38px;height:38px;flex-basis:38px;}
  .admin-logo-mark img{width:22px;height:22px;}
}