:root{
  --blue:#0891b2;
  --blue-soft:#ecfeff;
  --purple:#06b6d4;
  --navy:#0f172a;
}

.sidebar,.login-brand{background:#0f172a}
.sidebar nav a.active{box-shadow:inset 3px 0 #22d3ee}
.super-badge>span,.mobile-new-action,.primary{background:#22d3ee;color:#0f172a}
.primary{box-shadow:0 5px 16px #22d3ee33}
.eyebrow{color:#0e7490}

.brand-lockup{
  position:relative;
  display:block;
  width:205px;
  height:82px;
  margin-bottom:8px;
  padding:0;
  overflow:hidden;
  border-radius:10px;
}
.brand-lockup .brand-logo{
  position:absolute;
  width:330px;
  max-width:none;
  height:auto;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}
.login-wordmark{
  display:block;
  width:min(650px,100%);
  height:auto;
  margin:0 0 20px;
}
.login-mobile-wordmark{display:none}
.mobile-mark{width:31px;height:31px;object-fit:contain}
.public-unavailable-mark{display:block;width:76px;height:76px;object-fit:contain;margin:0 auto 18px}
.pwa-install-button:focus-visible,.brand-lockup:focus-visible{outline:3px solid #22d3ee;outline-offset:4px}

@media(max-width:720px){
  .brand-lockup{width:48px;height:48px;overflow:visible}
  .brand-lockup .brand-logo{width:48px;height:48px;object-fit:contain;position:static;transform:none}
  .sidebar .brand-lockup{width:auto;height:78px;margin-bottom:6px;padding:0 40px 0 3px;overflow:hidden}
  .sidebar .brand-lockup .brand-logo{position:absolute;width:310px;height:auto;max-width:none;left:50%;top:50%;transform:translate(-50%,-50%)}
  .login-wordmark{width:min(560px,100%)}
  .login-mobile-wordmark{display:block;width:min(245px,82%);height:auto;margin:0 auto 30px}
}