/* Selected ForgeFit FF shield: same approved visual in installed PWA and within the web app.
   Image files are generated and verified from the user-approved icon artwork. */
.topbar .brand-mark{
  display:inline-block;
  flex:none;
  width:36px;
  height:36px;
  border:0;
  border-radius:8px;
  margin:0 3px 0 0;
  transform:none;
  font-size:0;
  color:transparent;
  background:#090a0b url('./icons/forgefit-ff-192.png') center/contain no-repeat!important;
}
.ffh .ffh-logo{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.ffh .ffh-logo>span{
  display:inline-block;
  flex:none;
  width:37px;
  height:37px;
  margin:0;
  vertical-align:middle;
  font-size:0;
  color:transparent;
  background:transparent url('./icons/forgefit-ff-192.png') center/contain no-repeat;
}
@media(max-width:359px){
  .topbar .brand-mark{width:32px;height:32px}
  .ffh .ffh-logo>span{width:33px;height:33px}
  .ffh .ffh-logo{gap:6px}
}
@media(prefers-reduced-data:reduce){
  .topbar .brand-mark,.ffh .ffh-logo>span{background-size:contain}
}