@font-face{font-family:'Sometype';src:url('/fonts/Sometype-Mono.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap;}

html{scrollbar-width:none}
html::-webkit-scrollbar{width:0;height:0}

.nav-wrap{
  position:fixed;
  top:16px;
  left:50%;
  z-index:1000;
  width:calc(100vw - 32px);
  max-width:438px;
  padding:0;
  transform:translateX(-50%);
  pointer-events:none;
}

.nav-wrap > nav{
  position:relative;
  display:grid;
  grid-template-columns:43px minmax(0,1fr) 39px;
  grid-template-rows:50px auto;
  align-items:center;
  width:100%;
  height:auto;
  min-height:50px;
  margin:0;
  padding:0 13px 0 9px;
  overflow:visible;
  border:0;
  border-radius:4px;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  pointer-events:auto;
}

.nav-wrap > nav::before{
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:4px;
  background:#000;
  opacity:.6;
  box-shadow:none;
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}

.nav-wrap.is-home > nav::before{
  opacity:.6;
  box-shadow:none;
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}

.nav-wrap .logo{
  grid-column:1;
  grid-row:1;
  justify-self:start;
  display:grid;
  place-items:center;
  width:41px;
  height:50px;
  padding:0;
  gap:0;
  color:#e7e8e4;
  font-size:0;
  line-height:0;
  text-decoration:none;
  transform:none;
  cursor:pointer;
  opacity:.95;
  transition:opacity .2s ease;
}

.nav-wrap .logo:hover{color:#fff;opacity:1;transform:none}
.nav-wrap .logo-icon{display:grid;place-items:center;width:32px;height:32px}
.nav-wrap .logo-icon img{display:block;width:32px;height:32px}
.nav-wrap .nav-links,.nav-wrap .nav-btn{display:none!important}

.nav-status{
  grid-column:2;
  grid-row:1;
  justify-self:stretch;
  min-width:0;
  overflow:hidden;
  color:rgba(241,239,230,.96);
  font-family:'Sometype','JetBrains Mono','SFMono-Regular',Consolas,monospace;
  font-size:13px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:0;
  text-align:center;
  text-transform:uppercase;
  white-space:nowrap;
  user-select:none;
  pointer-events:none;
}

.nav-wrap.is-blog .nav-status{color:#d4d2ca}

.nav-status-text{display:block;overflow:hidden;text-overflow:ellipsis}
.nav-status-glyph{display:inline-block;opacity:0;transform:translateY(5px);filter:blur(2px)}
.nav-status-glyph.is-visible{opacity:1;transform:translateY(0);filter:blur(0);transition:opacity .24s ease,transform .38s cubic-bezier(.22,1,.36,1),filter .3s ease}
.nav-status-glyph.is-leaving{opacity:0;transform:translateY(-4px);filter:blur(2px);transition:opacity .2s ease,transform .28s ease,filter .22s ease}

.nav-wrap .nav-right{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center}
.nav-wrap .hamburger{
  position:relative;
  display:block!important;
  display:flex!important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  width:39px;
  height:50px;
  margin:0;
  padding:15px 11px;
  border:0;
  background:transparent;
  color:#dfdfda;
  cursor:pointer;
  transition:opacity .2s ease;
}
.nav-wrap .hamburger:hover{background:transparent;opacity:.7}
.nav-wrap .hamburger span{
  position:static;
  display:block;
  width:20px;
  height:2px;
  background:currentColor;
  transform-origin:center;
  transition:opacity .18s ease,transform .36s cubic-bezier(.22,1,.36,1);
}
.nav-wrap .hamburger span:nth-child(1),.nav-wrap .hamburger span:nth-child(2),.nav-wrap .hamburger span:nth-child(3){top:auto}
.nav-wrap .hamburger.open{transform:none}
.nav-wrap .hamburger.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-wrap .hamburger.open span:nth-child(2){opacity:0;transform:scaleX(.25)}
.nav-wrap .hamburger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.nav-wrap .mobile-menu{
  position:relative;
  top:auto;
  right:auto;
  left:auto;
  grid-column:1/-1;
  grid-row:2;
  z-index:2;
  display:grid;
  width:calc(100% + 30px);
  height:0;
  margin:0 -17px 0 -13px;
  padding:0 7px;
  overflow:hidden;
  border:0;
  border-radius:0 0 4px 4px;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  opacity:0;
  transform:none;
  pointer-events:none;
  transition:height .42s cubic-bezier(.22,1,.36,1),opacity .18s ease,padding .42s cubic-bezier(.22,1,.36,1);
}
.nav-wrap > nav:has(.mobile-menu.show)::before{opacity:.68;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.nav-wrap .mobile-menu.show{height:308px;padding-top:7px;padding-bottom:8px;opacity:1;transform:none;pointer-events:auto}
.nav-wrap .mobile-menu a{
  position:relative;
  display:flex;
  align-items:center;
  min-height:46px;
  padding:0 13px 0 32px;
  border-top:1px solid rgba(255,255,255,.07);
  border-radius:0;
  color:rgba(232,233,229,.72);
  font-family:Inter,Arial,sans-serif;
  font-size:15px;
  font-weight:400!important;
  letter-spacing:0;
  text-decoration:none;
  text-transform:none;
  opacity:0;
  transform:translateY(-7px);
  transition:color .18s ease,background .18s ease,opacity .26s ease,transform .36s cubic-bezier(.22,1,.36,1);
}
.nav-wrap .mobile-menu.show a{opacity:1;transform:translateY(0)}
.nav-wrap .mobile-menu.show a:nth-child(2){transition-delay:.025s}
.nav-wrap .mobile-menu.show a:nth-child(3){transition-delay:.05s}
.nav-wrap .mobile-menu.show a:nth-child(4){transition-delay:.075s}
.nav-wrap .mobile-menu.show a:nth-child(5){transition-delay:.1s}
.nav-wrap .mobile-menu.show a:nth-child(6){transition-delay:.125s}
.nav-wrap .mobile-menu a::before{
  content:'';
  position:absolute;
  left:12px;
  width:10px;
  height:10px;
  opacity:.35;
  background:linear-gradient(90deg,currentColor 0 2px,transparent 2px 4px,currentColor 4px 6px,transparent 6px 8px,currentColor 8px 10px);
  clip-path:polygon(0 0,20% 0,20% 40%,60% 40%,60% 20%,100% 20%,100% 40%,80% 40%,80% 80%,40% 80%,40% 100%,0 100%);
}
.nav-wrap .mobile-menu a:hover{color:#f0f1ed;background:rgba(255,255,255,.045)}
.nav-wrap .mobile-menu a.active{color:#f0f1ed;text-shadow:none}
.nav-wrap .mobile-menu a.active::before{opacity:1}
.nav-wrap .mobile-menu a:last-child{margin:0;border-top:1px solid rgba(255,255,255,.07);border-radius:0;color:rgba(240,241,237,.86)!important}

@media(max-width:560px){
  .nav-wrap{top:16px;width:calc(100vw - 32px)}
  .nav-wrap > nav{grid-template-columns:43px minmax(0,1fr) 39px;grid-template-rows:50px auto;min-height:50px;padding-right:13px;padding-left:9px}
  .nav-wrap .logo{width:41px;height:50px}
  .nav-wrap .logo-icon,.nav-wrap .logo-icon img{width:29px;height:29px}
  .nav-wrap .hamburger{width:39px;height:50px;padding-right:9px;padding-left:9px;gap:4px}
  .nav-wrap .hamburger span{width:20px}
  .nav-wrap .hamburger.open span:nth-child(1){transform:translateY(5px) rotate(45deg)}
  .nav-wrap .hamburger.open span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
  .nav-status{font-size:11px;font-weight:700}
  .nav-wrap .mobile-menu{width:calc(100% + 22px);margin-right:-13px;margin-left:-9px}
}
@media(prefers-reduced-motion:reduce){.nav-status-glyph,.nav-wrap .hamburger span,.nav-wrap .mobile-menu,.nav-wrap .mobile-menu a{transition:none!important}}