:root{
  --obrix-ink:#11110f;
  --obrix-orange:#ff5c23;
  --obrix-paper:#fffefa;
}

#obrix-brand-lockup{
  position:fixed;
  z-index:2147483002;
  top:8px;
  left:9px;
  min-width:158px;
  height:40px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:5px 10px 5px 6px;
  border:1px solid rgba(17,17,15,.13);
  border-radius:11px;
  background:rgba(255,254,250,.98);
  color:var(--obrix-ink);
  box-shadow:0 5px 18px rgba(17,17,15,.08);
  font:850 14px/1 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:-.025em;
  pointer-events:none;
}

#obrix-brand-lockup .obrix-brand-mark{
  position:relative;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:8px;
  background:var(--obrix-ink);
  color:#fff;
  font-weight:950;
}

#obrix-brand-lockup .obrix-brand-mark::after{
  content:"";
  position:absolute;
  right:-7px;
  bottom:-8px;
  width:19px;
  height:19px;
  border-radius:50%;
  background:var(--obrix-orange);
}

html.obrix-brand-ready img[alt*="Twenty" i],
html.obrix-brand-ready [title*="Twenty CRM" i] img{
  content:url("/0brix-brand-mark.svg");
}

@media(max-width:768px){
  #obrix-brand-lockup{display:none}
}

@media(prefers-color-scheme:dark){
  #obrix-brand-lockup{
    border-color:rgba(255,255,255,.13);
    background:rgba(25,24,21,.97);
    color:#fff;
    box-shadow:0 5px 18px rgba(0,0,0,.22);
  }
  #obrix-brand-lockup .obrix-brand-mark{
    border:1px solid rgba(255,255,255,.15);
  }
}
