:root {
  --bg:#0f0e0c;
  --bg-2:#14120f;
  --card:#191714;
  --card-2:#201d19;
  --ink:#f1ece2;
  --dim:#b3ac9d;
  --mute:#8d8779;
  --hair:rgba(241,236,226,.1);
  --hair-2:rgba(241,236,226,.18);
  --cit:#c5d15f;
  --cit-dk:#1d2008;
  --cit-soft:rgba(197,209,95,.12);
  --disp:"Bricolage Grotesque","Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --ease:cubic-bezier(.16,1,.3,1);
  --pad:clamp(18px,4.4vw,64px);
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}
html.is-calm {
  scroll-behavior: auto;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--disp);
  font-size: 17px;
  line-height: 1.5;
  font-variation-settings: "wdth" 100;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
h1,
h2,
h3,
p,
ul,
ol,
dl,
dd,
figure,
pre {
  margin: 0;
}
ul,
ol {
  padding: 0;
  list-style: none;
}
a {
  color: inherit;
}
button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}
button {
  cursor: pointer;
}
code,
pre {
  font-family: var(--mono);
}
::selection {
  background: var(--cit);
  color: var(--cit-dk);
}
.sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.skip {
  position: fixed;
  left: 16px;
  top: -60px;
  z-index: 90;
  background: var(--cit);
  color: var(--cit-dk);
  padding: 10px 16px;
  border-radius: 10px;
  font-weight: 700;
  text-decoration: none;
  transition: top .3s var(--ease);
}
.skip:focus {
  top: 12px;
}
:focus {
  outline: none;
}
:focus-visible {
  outline: 2px solid var(--cit);
  outline-offset: 3px;
  border-radius: 8px;
  animation: ringIn .35s var(--ease);
}
@keyframes ringIn {
  from {
    outline-offset: 10px;
    outline-color: transparent;
  }
  to {
    outline-offset: 3px;
  }
}
.wrap {
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 var(--pad);
}
.masthead {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 60;
  background: rgba(15, 14, 12, .82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--hair);
  transition: transform .5s var(--ease);
}
.masthead.is-away {
  transform: translateY(-100%);
}
.masthead__in {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 var(--pad);
  height: 68px;
  display: flex;
  align-items: center;
  gap: 18px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--ink);
  flex: none;
}
.brand__mark {
  width: 30px;
  height: 30px;
  color: var(--cit);
}
.brand__x {
  stroke: var(--bg);
}
.brand__name {
  font-weight: 800;
  font-size: 1.28rem;
  letter-spacing: -.025em;
  font-variation-settings: "wdth" 82;
}
.masthead__nav {
  display: flex;
  gap: 2px;
  margin-left: auto;
  font-size: .9rem;
}
.masthead__nav a {
  position: relative;
  padding: 8px 11px;
  text-decoration: none;
  color: var(--dim);
  border-radius: 8px;
  transition: color .25s;
}
.masthead__nav a::after {
  content: "";
  position: absolute;
  left: 11px;
  right: 11px;
  bottom: 4px;
  height: 1px;
  background: var(--cit);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .45s var(--ease);
}
.masthead__nav a:hover {
  color: var(--ink);
}
.masthead__nav a:hover::after,
.masthead__nav a.is-here::after {
  transform: scaleX(1);
}
.masthead__nav a.is-here {
  color: var(--ink);
}
.masthead__menu {
  display: none;
  width: 42px;
  height: 42px;
  border: 1px solid var(--hair-2);
  background: transparent;
  border-radius: 10px;
  position: relative;
  margin-left: auto;
  flex: none;
}
.masthead__menu span:not(.sr) {
  position: absolute;
  left: 12px;
  right: 12px;
  height: 2px;
  background: var(--ink);
  transition: transform .4s var(--ease);
}
.masthead__menu span:nth-child(1) {
  top: 16px;
}
.masthead__menu span:nth-child(2) {
  top: 24px;
}
.masthead__menu[aria-expanded=true] span:nth-child(1) {
  transform: translateY(4px) rotate(45deg);
}
.masthead__menu[aria-expanded=true] span:nth-child(2) {
  transform: translateY(-4px) rotate(-45deg);
}
.cachip {
  display: flex;
  gap: 8px;
  align-items: center;
  font-family: var(--mono);
  font-size: .74rem;
  background: transparent;
  border: 1px solid var(--hair-2);
  border-radius: 999px;
  padding: 7px 12px;
  color: var(--dim);
}
.cachip__k {
  color: var(--cit);
}
.cachip[hidden],
.masthead__x[hidden] {
  display: none;
}
.xf30 {
  position: relative;
}
.xf30-btn {
  font-family: var(--disp);
  font-weight: 700;
  font-size: .9rem;
  letter-spacing: -.01em;
  background: var(--ink);
  color: var(--bg);
  border: 0;
  border-radius: 10px;
  padding: 11px 16px;
  white-space: nowrap;
  transition: transform .3s var(--ease), background .3s;
}
.xf30-btn:hover {
  background: #fff;
}
.xf30-btn:active {
  transform: scale(.96);
}
.xf30-btn.is-on {
  background: var(--cit);
  color: var(--cit-dk);
  font-family: var(--mono);
  font-size: .8rem;
}
.xf30-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  width: 270px;
  max-width: calc(100vw - 32px);
  background: var(--card-2);
  border: 1px solid var(--hair-2);
  border-radius: 14px;
  padding: 8px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .55);
  animation: menuIn .35s var(--ease);
}
@keyframes menuIn {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
}
.xf30-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: 9px;
  padding: 10px 12px;
  font-size: .92rem;
  text-decoration: none;
  color: var(--ink);
}
.xf30-item:hover {
  background: rgba(241, 236, 226, .07);
}
.xf30-addr {
  font-family: var(--mono);
  font-size: .7rem;
  color: var(--dim);
  padding: 8px 12px 2px;
  overflow-wrap: anywhere;
}
.xf30-bal {
  font-family: var(--mono);
  font-size: .76rem;
  color: var(--cit);
  padding: 2px 12px 8px;
}
.xf30-note {
  font-size: .78rem;
  color: var(--mute);
  padding: 8px 12px;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--disp);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: -.01em;
  border-radius: 12px;
  padding: 14px 22px;
  border: 1px solid transparent;
  text-decoration: none;
  white-space: nowrap;
  transition:
    background .3s,
    color .3s,
    border-color .3s,
    transform .25s var(--ease);
  will-change: transform;
}
.btn:active {
  transform: scale(.97);
}
.btn--cit {
  background: var(--cit);
  color: var(--cit-dk);
}
.btn--cit:hover {
  background: #d5e070;
}
.btn--line {
  background: transparent;
  color: var(--ink);
  border-color: var(--hair-2);
}
.btn--line:hover {
  border-color: var(--ink);
  background: rgba(241, 236, 226, .05);
}
.btn--s {
  padding: 10px 14px;
  font-size: .88rem;
  border-radius: 10px;
}
.btn[disabled],
.copy[disabled] {
  opacity: .38;
  cursor: not-allowed;
}
.btn.is-busy {
  pointer-events: none;
  opacity: .7;
}
.copy {
  position: relative;
  overflow: hidden;
  font-family: var(--disp);
  font-weight: 700;
  font-size: .88rem;
  background: var(--cit);
  color: var(--cit-dk);
  border: 0;
  border-radius: 9px;
  padding: 9px 14px;
  min-width: 78px;
  height: 38px;
  flex: none;
  transition: background .3s;
}
.copy--btn {
  background: transparent;
  color: var(--ink);
  border: 1px solid var(--hair-2);
  padding: 10px 14px;
  height: auto;
  min-height: 40px;
  border-radius: 10px;
}
.copy span {
  display: block;
  transition: transform .45s var(--ease), opacity .3s;
}
.copy__b {
  position: absolute;
  inset: 0;
  display: flex !important;
  align-items: center;
  justify-content: center;
  transform: translateY(110%);
  opacity: 0;
}
.copy.is-done .copy__a {
  transform: translateY(-110%);
  opacity: 0;
}
.copy.is-done .copy__b {
  transform: none;
  opacity: 1;
}
.copy--btn.is-done {
  border-color: var(--cit);
  color: var(--cit);
}
.kicker {
  font-family: var(--mono);
  font-size: .74rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--cit);
  margin-bottom: 14px;
}
.h2 {
  font-weight: 800;
  font-size: clamp(2.5rem, 6.4vw, 5.6rem);
  line-height: .92;
  letter-spacing: -.03em;
  font-variation-settings: "wdth" 78;
  text-wrap: balance;
}
.sechead {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 28px 60px;
  align-items: end;
  margin-bottom: clamp(30px, 4.5vw, 56px);
}
.sechead__p {
  color: var(--dim);
  font-size: 1.06rem;
  max-width: 46ch;
}
section {
  position: relative;
  padding: clamp(72px, 10vw, 150px) 0;
}
.term {
  display: inline;
  background: none;
  border: 0;
  padding: 0;
  color: inherit;
  border-bottom: 1px dotted var(--cit);
  cursor: help;
  font: inherit;
}
.pop {
  position: absolute;
  z-index: 80;
  max-width: 280px;
  background: var(--ink);
  color: var(--bg);
  font-size: .86rem;
  line-height: 1.4;
  padding: 11px 13px;
  border-radius: 11px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .5);
  animation: menuIn .3s var(--ease);
}
.pop[hidden] {
  display: none;
}
.toast {
  position: fixed;
  left: 50%;
  bottom: 24px;
  z-index: 85;
  transform: translate(-50%, 24px);
  opacity: 0;
  background: var(--ink);
  color: var(--bg);
  font-weight: 600;
  font-size: .9rem;
  padding: 11px 16px;
  border-radius: 11px;
  max-width: calc(100vw - 32px);
  pointer-events: none;
  transition: transform .5s var(--ease), opacity .35s;
}
.toast.is-up {
  transform: translate(-50%, 0);
  opacity: 1;
}
.tag {
  display: inline-block;
  font-family: var(--mono);
  font-size: .66rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 6px;
  border: 1px solid var(--hair-2);
  color: var(--dim);
}
.tag--done,
.tag.is-live {
  background: var(--cit);
  border-color: var(--cit);
  color: var(--cit-dk);
  font-weight: 700;
}
.tag--build {
  border-color: var(--cit);
  color: var(--cit);
}
.tag--plan {
  border-style: dashed;
}
.fine {
  color: var(--mute);
  font-size: .88rem;
  margin-top: 22px;
  max-width: 70ch;
}
.tick {
  display: inline-block;
  transition: color .9s;
}
.tick.is-flash {
  color: var(--cit);
  transition: none;
}
.notice {
  margin-top: 16px;
  padding: 13px 15px;
  border: 1px solid var(--hair-2);
  border-left: 3px solid var(--cit);
  border-radius: 10px;
  background: var(--card);
  color: var(--dim);
  font-size: .93rem;
}
.notice[hidden] {
  display: none;
}
.notice b {
  color: var(--ink);
}
.shim {
  position: relative;
  overflow: hidden;
  background: rgba(241, 236, 226, .06);
  border-radius: 8px;
  color: transparent !important;
}
.shim::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      100deg,
      transparent 20%,
      rgba(241, 236, 226, .1) 50%,
      transparent 80%);
  transform: translateX(-100%);
  animation: shim 1.3s infinite;
}
@keyframes shim {
  to {
    transform: translateX(100%);
  }
}
.hero {
  padding: clamp(104px, 12vw, 132px) 0 clamp(48px, 6vw, 84px);
}
.hero__live {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
  font-family: var(--mono);
  font-size: .76rem;
  color: var(--dim);
  margin-bottom: clamp(18px, 2.4vw, 30px);
}
.hero__live b {
  color: var(--ink);
  font-weight: 500;
}
.hero__sep {
  color: var(--mute);
}
.pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--cit);
  position: relative;
}
.pulse::after {
  content: "";
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  border: 1px solid var(--cit);
  animation: pulse 2.4s var(--ease) infinite;
}
@keyframes pulse {
  from {
    transform: scale(.4);
    opacity: .9;
  }
  to {
    transform: scale(1.5);
    opacity: 0;
  }
}
.hero__title {
  font-weight: 800;
  font-size: clamp(3.05rem, 9.9vw, 9.6rem);
  line-height: .88;
  letter-spacing: -.032em;
  word-spacing: .04em;
  font-variation-settings: "wdth" 75;
  margin-bottom: clamp(30px, 4.4vw, 60px);
}
.hero__row {
  display: block;
}
.hero__row--cit {
  color: var(--cit);
}
.hero__w {
  display: inline-block;
  padding: .06em 0 .1em;
  margin: -.06em 0 -.1em;
  clip-path: inset(0 -0.2em 0 -0.1em);
}
.hero__w > i {
  display: inline-block;
  font-style: normal;
  will-change: transform;
}
.is-live .hero__w > i {
  transform: translateY(112%);
}
.is-live [data-in] {
  opacity: 0;
}
.hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr);
  gap: clamp(28px, 4vw, 64px);
  align-items: stretch;
}
.hero__left {
  display: flex;
  flex-direction: column;
  gap: 26px;
  min-width: 0;
}
.hero__sub {
  font-size: clamp(1.05rem, 1.45vw, 1.3rem);
  color: var(--dim);
  max-width: 44ch;
  line-height: 1.42;
}
.cmd__label {
  font-size: 1rem;
  color: var(--ink);
  margin-bottom: 10px;
  font-weight: 600;
}
.cmd__box {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--card);
  border: 1px solid var(--hair-2);
  border-radius: 14px;
  padding: 10px 10px 10px 18px;
  max-width: 560px;
}
.cmd__text {
  flex: 1;
  min-width: 0;
  font-size: .9rem;
  overflow-wrap: anywhere;
  color: var(--ink);
}
.cmd__text.is-typing::after {
  content: "";
  display: inline-block;
  width: .55em;
  height: 1.05em;
  margin-left: 2px;
  vertical-align: -.18em;
  background: var(--cit);
  animation: blink 1s steps(2) infinite;
}
@keyframes blink {
  50% {
    opacity: 0;
  }
}
.cmd__note {
  color: var(--mute);
  font-size: .86rem;
  margin-top: 10px;
  max-width: 52ch;
}
.cmd__note a {
  color: var(--dim);
}
.hero__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.hero__right {
  min-width: 0;
}
.field {
  position: relative;
  height: 100%;
  min-height: 360px;
  border: 1px solid var(--hair);
  border-radius: 20px;
  background:
    linear-gradient(
      180deg,
      #151310,
      #100f0d);
  overflow: hidden;
}
.field__cv {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.field__cap {
  position: absolute;
  left: 18px;
  right: 18px;
  top: 14px;
  display: flex;
  justify-content: space-between;
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--mute);
  pointer-events: none;
}
.field__cap span:last-child {
  color: var(--cit);
}
.chit {
  position: absolute;
  left: 18px;
  bottom: 18px;
  background: rgba(15, 14, 12, .88);
  border: 1px solid var(--hair-2);
  border-radius: 14px;
  padding: 14px 18px 15px;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  max-width: calc(100% - 36px);
}
.chit__k {
  font-family: var(--mono);
  font-size: .64rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--mute);
}
.chit__amt {
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.05;
  margin: 4px 0 2px;
}
.chit__amt b {
  font-size: 2.9rem;
  font-weight: 800;
  letter-spacing: -.028em;
  font-variation-settings: "wdth" 78;
}
.chit__eq {
  font-family: var(--mono);
  font-size: .76rem;
  color: var(--dim);
}
.chit__eq span {
  color: var(--cit);
}
.three {
  padding: clamp(24px, 4vw, 50px) 0 clamp(64px, 8vw, 110px);
}
.three__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--hair-2);
}
.three__it {
  padding: 30px 30px 6px 0;
  border-right: 1px solid var(--hair);
  position: relative;
}
.three__it + .three__it {
  padding-left: 30px;
}
.three__it:last-child {
  border-right: 0;
}
.three__n {
  display: block;
  font-weight: 800;
  font-size: 4.4rem;
  line-height: .85;
  letter-spacing: -.035em;
  font-variation-settings: "wdth" 75;
  color: var(--cit);
  margin-bottom: 18px;
}
.three__it h3 {
  font-size: 1.5rem;
  letter-spacing: -.03em;
  line-height: 1.1;
  margin-bottom: 8px;
  font-weight: 700;
}
.three__it p {
  color: var(--dim);
  font-size: 1rem;
}
.walk__pin {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-areas: "head head" "rail list";
  gap: 0 24px;
}
.walk__head {
  grid-area: head;
  margin-bottom: clamp(26px, 3.4vw, 44px);
}
.walk__rail {
  grid-area: rail;
  position: relative;
  width: 2px;
  background: var(--hair);
  justify-self: center;
  border-radius: 2px;
}
.walk__rail i {
  position: absolute;
  inset: 0;
  background: var(--cit);
  transform-origin: top;
  transform: scaleY(1);
  border-radius: 2px;
}
.walk__list {
  grid-area: list;
  position: relative;
  display: grid;
  gap: 34px;
}
.walk__step {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: 40px;
  align-items: start;
}
.walk__n {
  font-family: var(--mono);
  font-size: .76rem;
  color: var(--cit);
  letter-spacing: .1em;
}
.walk__txt h3 {
  font-weight: 800;
  font-size: clamp(1.9rem, 3vw, 2.7rem);
  letter-spacing: -.025em;
  line-height: 1;
  margin: 6px 0 10px;
  font-variation-settings: "wdth" 80;
}
.walk__txt p {
  color: var(--dim);
  max-width: 40ch;
}
.walk__txt code {
  font-size: .86em;
  color: var(--ink);
  background: var(--card-2);
  padding: 2px 6px;
  border-radius: 6px;
}
.walk.is-pinned .walk__list {
  display: block;
  min-height: min(560px, calc(100vh - 290px));
}
.walk.is-pinned .walk__step {
  display: block;
  width: 40%;
  padding: 16px 0;
  opacity: .34;
  transition: opacity .5s var(--ease);
}
.walk.is-pinned .walk__step.is-on {
  opacity: 1;
}
.walk.is-pinned .walk__txt h3 {
  font-size: clamp(1.6rem, 2.3vw, 2.2rem);
}
.walk.is-pinned .walk__step:not(.is-on) .walk__txt p {
  display: none;
}
.walk.is-pinned .walk__state {
  position: absolute;
  right: 0;
  top: 0;
  width: 54%;
  height: 100%;
  display: flex;
  align-items: center;
}
.walk.is-pinned .mock {
  width: 100%;
}
.mock {
  position: relative;
  background: var(--card);
  border: 1px solid var(--hair-2);
  border-radius: 18px;
  padding: 18px 20px 22px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .35);
}
.mock__bar {
  display: flex;
  justify-content: space-between;
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 16px;
}
.mock__bar em {
  font-style: normal;
  border: 1px dashed var(--hair-2);
  padding: 2px 7px;
  border-radius: 5px;
}
.mock__field {
  font-family: var(--mono);
  font-size: .92rem;
  border: 1px solid var(--hair-2);
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
}
.mock__caret {
  width: 8px;
  height: 1.1em;
  background: var(--cit);
  margin-left: 3px;
  animation: blink 1s steps(2) infinite;
}
.mock__rows {
  display: grid;
  gap: 8px;
}
.mock__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 11px 13px;
  border: 1px solid var(--hair);
  border-radius: 10px;
  font-size: .92rem;
}
.mock__row b {
  font-family: var(--mono);
  font-size: .74rem;
  color: var(--mute);
  font-weight: 500;
}
.mock__row span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mock__row i {
  font-style: normal;
  font-family: var(--mono);
  font-size: .66rem;
  color: var(--dim);
  border: 1px solid var(--hair-2);
  border-radius: 999px;
  padding: 2px 8px;
  white-space: nowrap;
}
.mock__row--hot {
  border-color: var(--cit);
  background: var(--cit-soft);
}
.mock__row--hot i {
  background: var(--cit);
  border-color: var(--cit);
  color: var(--cit-dk);
}
.mock__big {
  display: flex;
  align-items: baseline;
  gap: 12px;
  font-weight: 700;
  font-size: 1.5rem;
}
.mock__big b {
  font-size: clamp(4.4rem, 8vw, 7rem);
  line-height: .9;
  letter-spacing: -.035em;
  font-weight: 800;
  font-variation-settings: "wdth" 75;
  min-width: 1.6em;
}
.mock__big span {
  color: var(--cit);
}
.mock__track {
  position: relative;
  height: 6px;
  background: var(--hair);
  border-radius: 6px;
  margin: 26px 0 20px;
}
.mock__track i {
  position: absolute;
  inset: 0;
  background: var(--cit);
  border-radius: 6px;
  transform-origin: left;
  transform: scaleX(.5);
}
.mock__track u {
  position: absolute;
  top: 50%;
  left: 0;
  width: 22px;
  height: 22px;
  margin: -11px 0 0 -11px;
  border-radius: 50%;
  background: var(--ink);
  border: 4px solid var(--card);
  box-shadow: 0 0 0 1px var(--cit);
}
.mock__eq {
  font-family: var(--mono);
  font-size: .82rem;
  color: var(--dim);
}
.mock__eq span {
  color: var(--cit);
}
.mock__pre {
  font-size: .8rem;
  line-height: 1.65;
  color: var(--dim);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  border-left: 2px solid var(--hair-2);
  padding-left: 14px;
}
.mock__hash {
  font-family: var(--mono);
  font-size: .84rem;
  margin-top: 16px;
  color: var(--mute);
}
.mock__hash span {
  color: var(--cit);
}
.stamp {
  position: absolute;
  right: 22px;
  bottom: 22px;
  font-family: var(--mono);
  font-size: .74rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--cit);
  border: 2px solid var(--cit);
  border-radius: 8px;
  padding: 8px 12px;
  transform: rotate(-7deg);
}
.mock__wire {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 12px;
}
.mock__nd {
  fill: var(--card-2);
  stroke: var(--hair-2);
}
.mock__tx {
  fill: var(--ink);
  font-family: var(--mono);
  font-size: 12px;
  text-anchor: middle;
  dominant-baseline: middle;
}
.mock__tx--cit {
  fill: var(--cit);
}
.mock__pth {
  fill: none;
  stroke: var(--cit);
  stroke-width: 2;
  stroke-dasharray: 7 6;
  stroke-linecap: round;
}
.scout {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--card);
  border: 1px solid var(--hair-2);
  border-radius: 16px;
  padding: 10px;
  margin-bottom: 22px;
  transition: border-color .3s;
}
.scout:focus-within {
  border-color: var(--cit);
}
.scout__pre {
  font-family: var(--mono);
  font-size: .92rem;
  color: var(--mute);
  padding-left: 12px;
}
.scout__in {
  flex: 1;
  min-width: 0;
  background: transparent;
  border: 0;
  font-family: var(--mono);
  font-size: 1rem;
  padding: 12px 0;
}
.scout__in:focus-visible {
  outline: none;
  animation: none;
}
.cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.rcard {
  display: flex;
  flex-direction: column;
  text-align: left;
  background: var(--card);
  border: 1px solid transparent;
  border-radius: 18px;
  padding: 24px 24px 20px;
  min-height: 300px;
  color: var(--ink);
  transition:
    border-color .35s,
    background .35s,
    transform .5s var(--ease);
}
.rcard:hover {
  border-color: var(--hair-2);
  background: var(--card-2);
  transform: translateY(-4px);
}
.rcard.is-pick {
  border-color: var(--cit);
}
.rcard__own {
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--mute);
  letter-spacing: .04em;
}
.rcard__name {
  font-weight: 800;
  font-size: clamp(1.8rem, 2.6vw, 2.5rem);
  letter-spacing: -.028em;
  line-height: .95;
  text-transform: uppercase;
  font-variation-settings: "wdth" 76;
  margin: 6px 0 14px;
}
.rcard__d {
  color: var(--dim);
  font-size: .96rem;
  line-height: 1.42;
}
.rcard__foot {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 10px;
  margin-top: auto;
  padding-top: 22px;
}
.rcard__fig {
  font-weight: 800;
  font-size: 2.7rem;
  letter-spacing: -.03em;
  line-height: .9;
  font-variation-settings: "wdth" 76;
}
.rcard__fig.is-num {
  color: var(--cit);
}
.rcard__cap {
  font-family: var(--mono);
  font-size: .68rem;
  color: var(--mute);
  line-height: 1.3;
}
.rcard__go {
  align-self: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--hair-2);
  display: grid;
  place-items: center;
  transition:
    transform .5s var(--ease),
    background .3s,
    color .3s;
}
.rcard:hover .rcard__go {
  background: var(--cit);
  color: var(--cit-dk);
  border-color: var(--cit);
  transform: translateX(4px);
}
.found {
  margin-top: 34px;
}
.found[hidden] {
  display: none;
}
.found__head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  align-items: baseline;
  margin-bottom: 14px;
}
.found__t {
  font-weight: 800;
  font-size: 1.7rem;
  letter-spacing: -.04em;
  overflow-wrap: anywhere;
}
.found__s {
  font-family: var(--mono);
  font-size: .76rem;
  color: var(--mute);
}
.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.chip {
  font-family: var(--mono);
  font-size: .76rem;
  background: transparent;
  border: 1px solid var(--hair-2);
  border-radius: 999px;
  padding: 7px 13px;
  color: var(--dim);
  transition:
    background .3s,
    color .3s,
    border-color .3s;
}
.chip b {
  font-weight: 500;
  color: var(--mute);
  margin-left: 4px;
}
.chip.is-on {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--bg);
}
.chip.is-on b {
  color: var(--bg);
  opacity: .6;
}
.chip--sort {
  margin-left: auto;
  border-style: dashed;
}
.issues {
  display: grid;
  gap: 8px;
}
.issue {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  background: var(--card);
  border: 1px solid transparent;
  border-radius: 14px;
  padding: 14px 16px;
  transition: border-color .3s, background .3s;
}
.issue:hover {
  border-color: var(--hair-2);
  background: var(--card-2);
}
.issue__n {
  font-family: var(--mono);
  font-size: .82rem;
  color: var(--mute);
}
.issue__t {
  font-weight: 600;
  font-size: 1.04rem;
  letter-spacing: -.015em;
  line-height: 1.25;
  text-decoration: none;
  display: block;
  overflow-wrap: anywhere;
}
.issue__t:hover {
  text-decoration: underline;
  text-decoration-color: var(--cit);
  text-underline-offset: 3px;
}
.issue__m {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
  margin-top: 6px;
  font-family: var(--mono);
  font-size: .7rem;
  color: var(--mute);
}
.pill {
  border: 1px solid var(--hair-2);
  border-radius: 999px;
  padding: 1px 8px;
  color: var(--dim);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pill--hit {
  border-color: var(--cit);
  color: var(--cit);
}
.issue--sk {
  height: 70px;
}
.found__more {
  margin-top: 14px;
}
.tabs {
  position: relative;
  display: inline-flex;
  gap: 0;
  background: var(--card);
  border: 1px solid var(--hair);
  border-radius: 14px;
  padding: 5px;
  margin-bottom: 22px;
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: none;
}
.tabs::-webkit-scrollbar {
  display: none;
}
.tabs__ink {
  position: absolute;
  top: 5px;
  left: 0;
  height: calc(100% - 10px);
  width: 0;
  background: var(--ink);
  border-radius: 10px;
  transition: transform .55s var(--ease), width .55s var(--ease);
}
.tabs__b {
  position: relative;
  z-index: 1;
  background: transparent;
  border: 0;
  padding: 12px 18px;
  font-weight: 700;
  font-size: .96rem;
  color: var(--dim);
  border-radius: 10px;
  white-space: nowrap;
  transition: color .35s;
}
.tabs__b.is-on {
  color: var(--bg);
}
.panel[hidden] {
  display: none;
}
.panel.is-on {
  animation: panelIn .6s var(--ease);
}
@keyframes panelIn {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
}
.duo {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: 22px;
  align-items: start;
}
.form {
  background: var(--card);
  border: 1px solid var(--hair);
  border-radius: 20px;
  padding: clamp(18px, 2.4vw, 30px);
  display: grid;
  gap: 16px;
  min-width: 0;
}
.form__row {
  display: grid;
  gap: 7px;
  min-width: 0;
}
.form__two {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .62fr);
  gap: 14px;
}
.lab {
  font-size: .86rem;
  font-weight: 600;
  color: var(--ink);
}
.lab span {
  font-weight: 400;
  color: var(--mute);
  margin-left: 6px;
}
.lab code {
  font-size: .9em;
}
.inp {
  width: 100%;
  min-width: 0;
  background: var(--bg);
  border: 1px solid var(--hair-2);
  border-radius: 11px;
  padding: 13px 14px;
  font-family: var(--mono);
  font-size: .9rem;
  transition: border-color .3s, box-shadow .3s;
}
.inp::placeholder,
.scout__in::placeholder {
  color: #6f6a5f;
}
.inp:hover {
  border-color: rgba(241, 236, 226, .3);
}
.inp:focus-visible {
  outline: none;
  animation: none;
  border-color: var(--cit);
  box-shadow: 0 0 0 3px var(--cit-soft);
}
.inp.is-bad {
  border-color: #c98b6b;
}
.inp--big {
  font-family: var(--disp);
  font-weight: 800;
  font-size: 1.7rem;
  letter-spacing: -.04em;
  padding: 8px 14px;
}
.inp--area {
  resize: vertical;
  min-height: 130px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
select.inp {
  appearance: none;
  font-family: var(--disp);
  font-size: .94rem;
  background-image:
    linear-gradient(
      45deg,
      transparent 50%,
      var(--dim) 50%),
    linear-gradient(
      135deg,
      var(--dim) 50%,
      transparent 50%);
  background-position: calc(100% - 19px) 52%, calc(100% - 13px) 52%;
  background-size: 6px 6px;
  background-repeat: no-repeat;
  padding-right: 36px;
  text-overflow: ellipsis;
}
input[type=date].inp {
  color-scheme: dark;
  font-size: .84rem;
}
.inrow {
  display: flex;
  gap: 8px;
  min-width: 0;
}
.inrow .inp {
  flex: 1;
}
.seg {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--bg);
  border: 1px solid var(--hair-2);
  border-radius: 11px;
  padding: 4px;
  height: 100%;
  min-height: 50px;
}
.seg__ink {
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 4px;
  width: calc(50% - 4px);
  background: var(--cit);
  border-radius: 8px;
  transition: transform .5s var(--ease);
}
.seg[data-v=SOL] .seg__ink {
  transform: translateX(100%);
}
.seg__b {
  position: relative;
  background: transparent;
  border: 0;
  font-family: var(--mono);
  font-weight: 700;
  font-size: .82rem;
  color: var(--dim);
  border-radius: 8px;
  transition: color .3s;
}
.seg__b.is-on {
  color: var(--cit-dk);
}
.form__live {
  font-family: var(--mono);
  font-size: .8rem;
  color: var(--dim);
  min-height: 1.4em;
}
.form__live b {
  color: var(--cit);
  font-weight: 500;
}
.form__act {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}
.form__hint {
  color: var(--mute);
  font-size: .86rem;
}
.out {
  display: grid;
  gap: 14px;
  min-width: 0;
}
.ticket {
  position: relative;
  background: var(--ink);
  color: var(--bg);
  border-radius: 20px;
  padding: 22px 24px 20px;
  overflow: hidden;
  transition: opacity .5s, transform .7s var(--ease);
}
.ticket--ghost {
  opacity: .5;
}
.ticket.is-pop {
  animation: pop .7s var(--ease);
}
@keyframes pop {
  from {
    transform: translateY(16px) scale(.97);
    opacity: .3;
  }
}
.ticket__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.ticket__id {
  font-family: var(--mono);
  font-size: .84rem;
  font-weight: 700;
}
.badge {
  font-family: var(--mono);
  font-size: .66rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  border: 1.5px solid currentColor;
  border-radius: 6px;
  padding: 3px 8px;
  font-weight: 700;
  white-space: nowrap;
}
.badge.is-ok {
  background: var(--bg);
  color: var(--cit);
  border-color: var(--bg);
}
.badge.is-bad {
  background: #7a2e1c;
  color: #fff;
  border-color: #7a2e1c;
}
.ticket__amt {
  font-weight: 700;
  font-size: 1.5rem;
  letter-spacing: -.02em;
  margin-top: 12px;
  line-height: 1;
}
.ticket__amt b {
  font-weight: 800;
  font-size: clamp(3.6rem, 7vw, 5.6rem);
  letter-spacing: -.035em;
  line-height: .9;
  font-variation-settings: "wdth" 75;
}
.ticket__usd {
  font-family: var(--mono);
  font-size: .8rem;
  margin-top: 8px;
  color: #4a463e;
}
.ticket__iss {
  font-weight: 600;
  font-size: 1.02rem;
  line-height: 1.25;
  margin-top: 10px;
  overflow-wrap: anywhere;
}
.ticket__perf {
  height: 0;
  border-top: 2px dashed rgba(15, 14, 12, .3);
  margin: 18px -24px 16px;
  position: relative;
}
.ticket__perf::before,
.ticket__perf::after {
  content: "";
  position: absolute;
  top: -11px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--bg-2);
}
.ticket__perf::before {
  left: -10px;
}
.ticket__perf::after {
  right: -10px;
}
.ticket__act {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ticket .btn--cit {
  background: var(--bg);
  color: var(--cit);
}
.ticket .btn--line,
.ticket .copy--btn {
  color: var(--bg);
  border-color: rgba(15, 14, 12, .35);
}
.ticket .btn--line:hover {
  background: rgba(15, 14, 12, .07);
  border-color: var(--bg);
}
.ticket .copy--btn.is-done {
  color: var(--bg);
  border-color: var(--bg);
}
.ticket__note {
  font-size: .8rem;
  color: #4a463e;
  margin-top: 12px;
}
.ticket :focus-visible {
  outline-color: var(--bg);
}
.sheet {
  background: var(--card);
  border: 1px solid var(--hair);
  border-radius: 16px;
  overflow: hidden;
  min-width: 0;
}
.sheet--cit {
  border-color: rgba(197, 209, 95, .45);
}
.sheet__bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 9px 10px 9px 16px;
  border-bottom: 1px solid var(--hair);
  font-family: var(--mono);
  font-size: .7rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mute);
  min-height: 56px;
}
.sheet--cit .sheet__bar {
  color: var(--cit);
}
.sheet__pre {
  padding: 16px;
  font-size: .8rem;
  line-height: 1.62;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--dim);
  max-height: 300px;
  overflow: auto;
}
.sheet__hash {
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--mute);
  padding: 0 16px 14px;
  overflow-wrap: anywhere;
}
.sheet__hash:empty {
  display: none;
}
.sheet__hash b {
  color: var(--cit);
  font-weight: 500;
}
.checks {
  display: grid;
  gap: 8px;
}
.checks__it {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  background: var(--card);
  border: 1px solid var(--hair);
  border-radius: 12px;
  padding: 13px 15px;
  font-size: .96rem;
  transition: border-color .4s;
}
.checks__it i {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1.5px solid var(--hair-2);
  position: relative;
  transition: background .4s, border-color .4s;
}
.checks__it em {
  font-style: normal;
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--mute);
  text-align: right;
  overflow-wrap: anywhere;
}
.checks__it.is-ok {
  border-color: rgba(197, 209, 95, .4);
}
.checks__it.is-ok i {
  background: var(--cit);
  border-color: var(--cit);
}
.checks__it.is-ok i::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2.5px;
  width: 5px;
  height: 9px;
  border: solid var(--cit-dk);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.checks__it.is-ok em {
  color: var(--cit);
}
.checks__it.is-bad {
  border-color: #c98b6b;
}
.checks__it.is-bad i {
  background: #c98b6b;
  border-color: #c98b6b;
}
.checks__it.is-bad i::after {
  content: "";
  position: absolute;
  left: 8px;
  top: 3px;
  width: 2px;
  height: 11px;
  background: var(--bg);
  transform: rotate(45deg);
  box-shadow: 0 0 0 0 transparent;
}
.checks__it.is-bad em {
  color: #e0a585;
}
.checks__it.is-skip i {
  border-style: dashed;
}
.verdict {
  background: var(--card);
  border: 1px solid var(--hair);
  border-radius: 20px;
  padding: 22px 24px;
  transition: border-color .5s, background .5s;
}
.verdict__k {
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--mute);
}
.verdict__v {
  font-weight: 800;
  font-size: clamp(2rem, 4vw, 3.3rem);
  letter-spacing: -.028em;
  line-height: .95;
  font-variation-settings: "wdth" 78;
  margin: 8px 0 10px;
}
.verdict__s {
  color: var(--dim);
  font-size: .95rem;
  overflow-wrap: anywhere;
}
.verdict__s a {
  color: var(--cit);
}
.verdict.is-paid {
  background: var(--cit);
  border-color: var(--cit);
  color: var(--cit-dk);
}
.verdict.is-paid .verdict__k,
.verdict.is-paid .verdict__s {
  color: #3a400f;
}
.verdict.is-paid .verdict__s a {
  color: var(--cit-dk);
}
.verdict.is-none {
  border-color: #c98b6b;
}
.meter {
  height: 4px;
  background: var(--hair);
  border-radius: 4px;
  margin-top: 16px;
  overflow: hidden;
}
.meter i {
  display: block;
  height: 100%;
  background: var(--cit);
  transform-origin: left;
  transform: scaleX(0);
  transition: transform .5s var(--ease);
}
.verdict.is-paid .meter {
  background: rgba(29, 32, 8, .2);
}
.verdict.is-paid .meter i {
  background: var(--cit-dk);
}
.ledger {
  max-height: 330px;
  overflow: auto;
}
.ledger__empty {
  padding: 16px;
  color: var(--mute);
  font-size: .9rem;
}
.ledger__row {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 16px;
  border-bottom: 1px solid var(--hair);
  font-family: var(--mono);
  font-size: .74rem;
  color: var(--dim);
  animation: rowIn .5s var(--ease);
}
@keyframes rowIn {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }
}
.ledger__row a {
  color: var(--mute);
  text-decoration: none;
}
.ledger__row a:hover {
  color: var(--ink);
}
.ledger__row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ledger__row em {
  font-style: normal;
  color: var(--mute);
}
.ledger__row.is-hit {
  background: var(--cit-soft);
  color: var(--ink);
}
.ledger__row.is-hit em {
  color: var(--cit);
  font-weight: 700;
}
.kept {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.kcard {
  display: flex;
  flex-direction: column;
  background: var(--card);
  border-radius: 18px;
  padding: 22px 22px 18px;
  min-height: 280px;
  border: 1px solid transparent;
  min-width: 0;
  animation: pop .7s var(--ease);
}
.kcard__top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--mute);
}
.kcard__top .badge {
  color: var(--dim);
}
.kcard__top .badge.is-ok {
  background: var(--cit);
  border-color: var(--cit);
  color: var(--cit-dk);
}
.kcard__repo {
  font-weight: 800;
  font-size: 1.5rem;
  letter-spacing: -.04em;
  line-height: 1;
  margin-top: 14px;
  text-transform: uppercase;
  font-variation-settings: "wdth" 76;
  overflow-wrap: anywhere;
}
.kcard__t {
  color: var(--dim);
  font-size: .94rem;
  margin-top: 8px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.kcard__amt {
  margin-top: auto;
  padding-top: 18px;
  font-weight: 800;
  font-size: 2.8rem;
  letter-spacing: -.03em;
  line-height: .9;
  font-variation-settings: "wdth" 76;
}
.kcard__amt small {
  font-size: .9rem;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--mute);
  font-family: var(--mono);
  margin-left: 6px;
}
.kcard__act {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 14px;
}
.kcard__act .btn,
.kcard__act .copy {
  padding: 8px 11px;
  font-size: .8rem;
  min-height: 36px;
  height: auto;
}
.kcard--empty {
  border: 1px dashed var(--hair-2);
  background: transparent;
  justify-content: center;
  gap: 10px;
  min-height: 220px;
  grid-column: 1/-1;
  align-items: flex-start;
  animation: none;
}
.kcard--empty h3 {
  font-weight: 800;
  font-size: 1.8rem;
  letter-spacing: -.04em;
}
.kcard--empty p {
  color: var(--dim);
  max-width: 52ch;
}
.hmark {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--cit);
  border-radius: 2px;
  transform: rotate(45deg);
  margin-right: 6px;
}
.perks {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 16px;
}
.perk {
  grid-column: span 2;
  background: var(--card);
  border-radius: 18px;
  padding: 22px;
  border: 1px solid transparent;
  transition: border-color .35s, transform .5s var(--ease);
}
.perk:nth-child(n+4) {
  grid-column: span 3;
}
.perk:hover {
  border-color: var(--hair-2);
  transform: translateY(-3px);
}
.perk h3 {
  font-weight: 800;
  font-size: 1.55rem;
  letter-spacing: -.04em;
  line-height: 1.05;
  margin: 16px 0 8px;
}
.perk p {
  color: var(--dim);
  font-size: .97rem;
}
.supply__grid {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(28px, 5vw, 80px);
  align-items: center;
}
.ring {
  position: relative;
  max-width: 420px;
  width: 100%;
  justify-self: center;
}
.ring svg {
  display: block;
  width: 100%;
  height: auto;
  transform: rotate(-90deg);
}
.ring__bg {
  fill: none;
  stroke: var(--hair);
  stroke-width: 22;
}
.ring__fg {
  fill: none;
  stroke: var(--cit);
  stroke-width: 22;
  stroke-dasharray: 100 100;
  stroke-dashoffset: 0;
}
.ring__in {
  fill: none;
  stroke: var(--hair-2);
  stroke-width: 1;
  stroke-dasharray: 2 5;
}
.ring__mid {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.ring__mid b {
  font-weight: 800;
  font-size: clamp(3rem, 6vw, 4.8rem);
  letter-spacing: -.035em;
  line-height: .9;
  font-variation-settings: "wdth" 76;
}
.ring__mid > span {
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--dim);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-top: 8px;
}
.supply__facts {
  min-width: 0;
}
.facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 14px;
  border-top: 1px solid var(--hair-2);
}
.facts[hidden] {
  display: none;
}
.facts__it {
  padding: 18px 18px 18px 0;
  border-bottom: 1px solid var(--hair);
  min-width: 0;
}
.facts__it:nth-child(even) {
  padding-left: 18px;
  border-left: 1px solid var(--hair);
}
.facts dt {
  font-family: var(--mono);
  font-size: .7rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 6px;
}
.facts dd {
  font-weight: 800;
  font-size: clamp(1.3rem, 2.2vw, 1.9rem);
  letter-spacing: -.04em;
  line-height: 1.05;
  overflow-wrap: anywhere;
}
.facts dd small {
  display: block;
  font-family: var(--disp);
  font-weight: 400;
  font-size: .86rem;
  letter-spacing: 0;
  color: var(--dim);
  margin-top: 4px;
  line-height: 1.3;
}
.flow {
  background: var(--card);
  border: 1px solid var(--hair);
  border-radius: 20px;
  padding: 18px 20px 12px;
  margin-bottom: 16px;
}
.flow figcaption {
  font-weight: 700;
  font-size: 1.1rem;
  letter-spacing: -.02em;
  margin-bottom: 6px;
}
.flow figcaption b {
  color: var(--cit);
  margin-right: 6px;
}
.flow__scroll {
  overflow-x: auto;
  padding-bottom: 8px;
  scrollbar-color: var(--hair-2) transparent;
}
.flow__svg {
  display: block;
  width: 100%;
  min-width: 860px;
  height: auto;
}
.flow__wire {
  fill: none;
  stroke: var(--dim);
  stroke-width: 1.5;
  stroke-linecap: round;
}
.flow__wire--dash {
  stroke: var(--mute);
  stroke-dasharray: 4 6;
}
.flow__wire--cit {
  stroke: var(--cit);
  stroke-width: 2.5;
}
.flow__node rect {
  fill: var(--bg);
  stroke: var(--hair-2);
  stroke-width: 1.2;
}
.flow__node--cit rect {
  stroke: var(--cit);
  fill: #171a0b;
}
.flow__node text {
  fill: var(--ink);
  font-family: var(--disp);
  font-weight: 700;
  font-size: 15px;
  text-anchor: middle;
  letter-spacing: -.2px;
}
.flow__node .flow__s {
  fill: var(--dim);
  font-family: var(--mono);
  font-weight: 400;
  font-size: 10.5px;
  letter-spacing: 0;
}
.flow__note {
  fill: var(--mute);
  font-family: var(--mono);
  font-size: 11px;
}
.flow__note--mid {
  text-anchor: middle;
  fill: var(--dim);
}
.flow__bead {
  fill: var(--cit);
  opacity: 0;
}
.road__body {
  display: grid;
  grid-template-columns: 2px minmax(0, 1fr);
  gap: 0 clamp(18px, 3vw, 40px);
}
.road__line {
  background: var(--hair);
  position: relative;
  border-radius: 2px;
}
.road__line i {
  position: absolute;
  inset: 0;
  background: var(--cit);
  transform-origin: top;
  border-radius: 2px;
}
.road__list {
  display: grid;
  gap: 14px;
}
.phase {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .36fr) minmax(0, .64fr);
  gap: 6px 30px;
  background: var(--card);
  border-radius: 18px;
  padding: 24px 26px;
}
.phase::before {
  content: "";
  position: absolute;
  left: calc(-1 * clamp(18px, 3vw, 40px) - 6px);
  top: 32px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--bg);
  border: 2px solid var(--cit);
}
.phase__k {
  grid-column: 1;
  font-family: var(--mono);
  font-size: .74rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--mute);
  display: flex;
  gap: 10px;
  align-items: center;
}
.phase h3 {
  grid-column: 1;
  font-weight: 800;
  font-size: clamp(1.5rem, 2.4vw, 2.1rem);
  letter-spacing: -.025em;
  line-height: 1;
  font-variation-settings: "wdth" 80;
}
.phase ul {
  grid-column: 2;
  grid-row: 1/span 2;
  display: grid;
  gap: 8px;
  align-content: center;
}
.phase li {
  position: relative;
  padding-left: 20px;
  color: var(--dim);
  font-size: .98rem;
}
.phase li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .62em;
  width: 10px;
  height: 1.5px;
  background: var(--cit);
}
.asks__wrap {
  display: grid;
  grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr);
  gap: 30px 60px;
  align-items: start;
}
.asks__head {
  position: sticky;
  top: 100px;
}
.ask {
  border-top: 1px solid var(--hair-2);
}
.ask:last-child {
  border-bottom: 1px solid var(--hair-2);
}
.ask summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 22px 2px;
  font-weight: 700;
  font-size: clamp(1.12rem, 1.7vw, 1.4rem);
  letter-spacing: -.025em;
  transition: color .3s;
}
.ask summary::-webkit-details-marker {
  display: none;
}
.ask summary::after {
  content: "";
  flex: none;
  width: 14px;
  height: 14px;
  background: linear-gradient(var(--cit), var(--cit)) center/100% 2px no-repeat, linear-gradient(var(--cit), var(--cit)) center/2px 100% no-repeat;
  transition: transform .5s var(--ease);
}
.ask[open] summary::after {
  transform: rotate(135deg);
}
.ask summary:hover {
  color: var(--cit);
}
.ask p {
  color: var(--dim);
  padding: 0 40px 24px 2px;
  max-width: 66ch;
  animation: panelIn .5s var(--ease);
}
.foot {
  border-top: 1px solid var(--hair);
  padding: 54px 0 60px;
  background: var(--bg);
}
.foot__in {
  display: grid;
  grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr) auto;
  gap: 30px 50px;
}
.foot__brand .brand__name {
  font-size: 1.7rem;
}
.foot__brand p {
  color: var(--dim);
  font-size: .93rem;
  margin-top: 8px;
  max-width: 30ch;
}
.foot__note p {
  color: var(--mute);
  font-size: .88rem;
  max-width: 68ch;
}
.foot__note b {
  color: var(--dim);
}
.foot__links {
  display: grid;
  gap: 8px;
  font-size: .92rem;
  align-content: start;
}
.foot__links a {
  color: var(--dim);
  text-decoration: none;
}
.foot__links a:hover {
  color: var(--cit);
}
@media (max-width:1180px) {
  .masthead__nav a {
    padding: 8px 8px;
    font-size: .86rem;
  }
  .cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .rcard {
    min-height: 240px;
  }
}
@media (max-width:980px) {
  .masthead__menu {
    display: block;
  }
  .masthead__nav {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    flex-direction: column;
    gap: 0;
    background: var(--bg);
    border-bottom: 1px solid var(--hair-2);
    padding: 8px var(--pad) 16px;
    margin: 0;
    display: none;
  }
  .masthead__nav.is-open {
    display: flex;
    animation: menuIn .35s var(--ease);
  }
  .masthead__nav a {
    padding: 13px 4px;
    font-size: 1.05rem;
    border-bottom: 1px solid var(--hair);
  }
  .masthead__nav a::after {
    display: none;
  }
  .cachip {
    display: none;
  }
  .sechead {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
  .hero__grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .field {
    height: 360px;
  }
  .walk__step {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }
  .duo,
  .supply__grid,
  .asks__wrap {
    grid-template-columns: minmax(0, 1fr);
  }
  .asks__head {
    position: static;
  }
  .kept {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .perk,
  .perk:nth-child(n+4) {
    grid-column: span 3;
  }
  .foot__in {
    grid-template-columns: minmax(0, 1fr);
  }
  .foot__links {
    grid-auto-flow: column;
    justify-content: start;
    gap: 18px;
  }
  .ring {
    max-width: 300px;
  }
}
@media (max-width:640px) {
  body {
    font-size: 16px;
  }
  .masthead__in {
    height: 60px;
    gap: 10px;
  }
  .brand__name {
    font-size: 1.12rem;
  }
  .brand__mark {
    width: 26px;
    height: 26px;
  }
  .xf30-btn {
    padding: 10px 12px;
    font-size: .82rem;
  }
  .hero {
    padding-top: 92px;
  }
  .hero__title {
    line-height: .9;
  }
  .field {
    height: 300px;
    min-height: 0;
  }
  .chit__amt b {
    font-size: 2.2rem;
  }
  .three__list {
    grid-template-columns: minmax(0, 1fr);
  }
  .three__it,
  .three__it + .three__it {
    padding: 22px 0;
    border-right: 0;
    border-bottom: 1px solid var(--hair);
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    column-gap: 10px;
  }
  .three__n {
    font-size: 3.2rem;
    grid-row: span 2;
    margin: 0;
  }
  .walk__pin {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "head" "list";
  }
  .walk__rail {
    display: none;
  }
  .mock {
    padding: 14px 14px 18px;
  }
  .mock__row {
    font-size: .82rem;
    padding: 9px 10px;
    gap: 8px;
  }
  .mock__row i {
    display: none;
  }
  .stamp {
    position: static;
    display: inline-block;
    margin-top: 14px;
  }
  .scout {
    flex-wrap: wrap;
  }
  .scout__pre {
    padding-left: 8px;
    font-size: .84rem;
  }
  .scout__in {
    flex: 1 1 50%;
    font-size: .94rem;
  }
  .scout .btn {
    flex: 1 1 40%;
  }
  .cards {
    grid-template-columns: minmax(0, 1fr);
  }
  .rcard {
    min-height: 0;
  }
  .chip--sort {
    margin-left: 0;
  }
  .issue {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }
  .issue .btn {
    justify-self: start;
  }
  .tabs {
    display: flex;
  }
  .tabs__b {
    padding: 11px 13px;
    font-size: .88rem;
  }
  .form__two {
    grid-template-columns: minmax(0, 1fr);
  }
  .seg {
    min-height: 48px;
  }
  .inrow {
    flex-direction: column;
  }
  .ticket {
    padding: 18px 18px 16px;
  }
  .ticket__perf {
    margin: 16px -18px 14px;
  }
  .kept {
    grid-template-columns: minmax(0, 1fr);
  }
  .perks {
    grid-template-columns: minmax(0, 1fr);
  }
  .perk,
  .perk:nth-child(n+4) {
    grid-column: auto;
  }
  .facts {
    grid-template-columns: minmax(0, 1fr);
  }
  .facts__it:nth-child(even) {
    padding-left: 0;
    border-left: 0;
  }
  .phase {
    grid-template-columns: minmax(0, 1fr);
    padding: 20px;
  }
  .phase ul {
    grid-column: 1;
    grid-row: auto;
    margin-top: 10px;
  }
  .ask p {
    padding-right: 8px;
  }
  .ledger__row {
    grid-template-columns: 62px minmax(0, 1fr) auto;
    padding: 10px 12px;
  }
  .foot__links {
    grid-auto-flow: row;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (prefers-reduced-motion:reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}