.wxt {
  display: flex;
  align-items: center;
  height: 44px;
  padding: 0 6px;
  background: none;
  border: 0;
  cursor: pointer;
  color: var(--lo);
  font:
    500 15px "Golos Text",
    "Golos Fallback",
    sans-serif;
  letter-spacing: .32em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color .8s var(--ease);
}
.wxt svg {
  width: 20px;
  height: 20px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;
}
.wxt .wxt-r {
  stroke: var(--mint);
  transition: opacity .9s var(--ease);
}
.wxt .wxt-x {
  stroke-dasharray: 22;
  stroke-dashoffset: 22;
  transition: stroke-dashoffset 1.1s var(--ease);
}
.wxt span {
  margin-left: 10px;
}
.bar .brand .wm {
  white-space: nowrap;
}
.wxt:hover,
.wxt[aria-pressed=true] {
  color: var(--ink);
}
.wxt[aria-pressed=false] .wxt-r {
  opacity: 0;
}
.wxt[aria-pressed=false] .wxt-x {
  stroke-dashoffset: 0;
}
.fit-s .wxt span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.fit-x .bar .tools .wxt {
  display: none;
}
@media (max-width: 899px) {
  .wxt span {
    display: none;
  }
}
@media (max-width: 599px) {
  .tools .wxt {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .wxt,
  .wxt .wxt-r,
  .wxt .wxt-x {
    transition: none;
  }
}