/* One nav on every page: 56px tall, the wordmark at 17px, links as slim pills,
   a 30px avatar with the seal chip tucked under its edge, nothing taller. */
nav.nav,.nav,.login-nav{height:56px!important;min-height:56px!important;max-height:56px!important;padding-top:0!important;padding-bottom:0!important;box-sizing:border-box;align-items:center!important}
body[style*="padding-top:92px"],body{--nav-h:56px}
.nav a.logo,.nav .nav-logo,.nav .logo,.login-nav>a{font-size:17px!important;gap:8px!important}
.nav a.logo img,.nav .nav-logo img,.nav .logo img,.login-nav img{width:24px!important;height:24px!important}
/* the seal's 24px sets the height of everything else in the bar */
.nav .nav-link,.nav .nl,.nav a.nav-link,.nav a.nl,.nav a[style*="padding:10px 12px"]{display:inline-flex!important;align-items:center!important;height:24px!important;padding:0 9px!important;font-size:13px!important;line-height:1!important;border-radius:4px!important;min-height:0!important;font-weight:500!important}
.nav .nav-link.on,.nav .nl.on,.nav a.nav-link.on,.nav a.nl.on,.nav .nav-link.active{font-weight:600!important}
.nav .nav-signin{height:26px!important;padding:0 12px!important;font-size:13px!important;border-radius:4px!important}
.nav .nav-menu-btn,.nav .hamburger,#hkMenuBtn,.nav button.nav-menu{height:26px!important;padding:0 10px!important;font-size:12.5px!important;border-radius:4px!important}
#navAvatar,.nav-avatar-wrap{width:24px!important;height:24px!important;margin-left:12px!important;flex:none}
#avatarBtn,.nav-avatar,#navAvatar>span,#navAvatar .nav-avatar{width:24px!important;height:24px!important;font-size:11px!important}
#navAvatar img,.nav-avatar img{width:100%!important;height:100%!important}
.seal-chip{top:18px!important;height:11px!important;padding:0 4px!important;font-size:7.5px!important;border-radius:3px!important}
.nav .nav-badge,.nav .nav-status-dot,#navAvatar .dot{width:10px!important;height:10px!important}
.nav .st,.nav #st{height:24px!important;padding:0 9px!important;font-size:11.5px!important;border-radius:4px!important}
.nav .btn,.nav #shareBtn,.nav #aiBtn,.nav .nav-end,.nav .nav-people,.nav .nav-status,.nav .nav-time{height:26px!important;padding:0 10px!important;font-size:12.5px!important;line-height:1!important;display:inline-flex!important;align-items:center!important;border-radius:4px!important}
.nav .nav-title{font-size:18px!important}
@media(max-width:560px){nav.nav,.nav{padding-left:12px!important;padding-right:12px!important}}

/* Phones: the links fold away (the Menu or the avatar takes over), the call to action shortens, the editor's assistant button too */
@media(max-width:900px){
  .nav .nls,.nav .nav-links,nav.nav a[style*="padding:10px 12px"],.nav a.nav-link:not(.on):not([data-keep]),.nav a.nav-link.on,.login-nav a[style*="padding:10px 12px"],.login-nav .nav-link{display:none!important}
  nav.nav,.nav{padding-left:14px!important;padding-right:14px!important}
}
@media(max-width:560px){
  #navSignInQuiet{display:none!important}
  .nav .nav-signin{font-size:0!important;padding:0 12px!important}.nav .nav-signin::before{content:'Get started';font-size:13px;font-weight:600}
  .nav #aiBtn{font-size:0!important;padding:0 10px!important}.nav #aiBtn::before{content:'Assistant';font-size:12px;font-weight:600}
  .nav .st span+*{display:none!important}
  .nav .nav-status,.nav .nav-time{display:none!important}
}
@media(max-width:560px){
  /* the wordmark gives way to the seal alone, and the gaps tighten, so the editor's DRAFT, Share, Assistant and avatar fit 390px */
  nav.nav a.logo,.nav a.logo,.nav .nav-logo,.nav .logo{font-size:0!important;gap:0!important}
  nav.nav,.nav{gap:6px!important;padding-left:10px!important;padding-right:10px!important}
  .nav .btn,.nav #shareBtn,.nav #aiBtn{margin-left:4px!important;padding:0 9px!important}
  .nav .st,.nav #st{padding:0 8px!important;margin-left:auto!important}
  #navAvatar,.nav-avatar-wrap{margin-left:8px!important}
}
/* The sign-in page's nav matches: links to the right as slim pills */
.login-nav{display:flex!important;align-items:center!important;gap:2px!important;padding:0 48px!important}
.login-nav>a:first-child{margin-right:auto!important}
.login-nav>a:not(:first-child){display:inline-flex!important;align-items:center!important;height:24px!important;padding:0 9px!important;font-size:13px!important;font-weight:500!important;border-radius:4px!important;color:#1A1A1A;text-decoration:none}
@media(max-width:900px){.login-nav>a:not(:first-child){display:none!important}.login-nav{padding:0 14px!important}}

/* the bar itself: 48px around 24px content */
nav.nav,.nav,.login-nav{height:48px!important;min-height:48px!important;max-height:48px!important}
.nav .btn .n,.nav #shareBtn .cnt,.nav .badge{height:16px!important;min-width:16px!important;font-size:10px!important;border-radius:3px!important}
/* Everything that sticks under the bar, at the bar's real height */
#drafthead{top:48px!important}
#tb{top:48px!important}
#index,.side{top:100px!important;max-height:calc(100vh - 100px)!important}
@media(max-width:1000px){#index{top:48px!important}}
@media(max-width:768px){.sidebar{top:48px!important;height:calc(100vh - 48px)!important}}
.sidebar{top:48px!important;height:calc(100vh - 48px)!important}
.desk-tabs,.stat-grid{top:auto!important}