/* Perpetually: loaded after the template's own styles on every page. */
:root { --pink: #ff00fe; --blue: #0dc6ff; --ink: #121415; --line: hsla(0, 0%, 100%, .15); --up: #ff00fe; --down: #0dc6ff; }

/* the page scrolls on the viewport: the template's body{overflow-x:hidden;overscroll-behavior:none} made body a
   scroll box that never scrolls and kept wheel/touch scrolling from reaching the page. clip trims the sides without that. */
html body { overflow-x: clip; overflow-y: visible; overscroll-behavior: auto; }
/* the header's scrolled backdrop (the template's bg-black/90 + s:opacity-100, both dropped from the captured CSS) */
.sh > .bg-black\/90 { background-color: rgba(18, 20, 21, .9); }
@media (min-width: 650px) { .sh.is-active > .bg-black\/90 { opacity: 1; } }

/* body copy in IBM Plex Mono (the template set paragraphs in the system sans) */
body, p, .txt { font-family: space-mono; }

/* Unbounded is wider than the faces it replaces: pull the display sizes in a touch and set weights */
.h1 { font-weight: 800; letter-spacing: -.025em; font-size: 6.4rem; line-height: 1; }
.h2 { font-family: clash; font-weight: 700; letter-spacing: -.01em; font-size: 2.7rem; line-height: 1.18; text-transform: uppercase; }
.h3 { font-weight: 700; letter-spacing: -.015em; font-size: 2.9rem; line-height: 1.2; }
.h4 { font-weight: 700; }
.product__title { font-weight: 800; letter-spacing: -.03em; }
.font-clash { font-weight: 800; }
em, i { font-weight: 800; }
@media (max-width: 649px) { .h1 { font-size: 4.2rem; } .h2 { font-size: 2.1rem; } .h3 { font-size: 2.3rem; } .product__title { font-size: 4.4rem; } }

/* the template's brand shapes around its logo, and its loader canvas */
.spin-logo__shape { display: none !important; }
.sh-logo img, .spin-logo img { width: 22em; }
.z-\[9999\] canvas { display: none; }
/* the footer's social row is empty (no X handle set); the box marks spin as before */
footer .relatve:empty { display: none; }
/* the signed messages keep their case */
.scribble-text > div { text-transform: none; }

/* live markets marquee cells (the investor-logo cells' layout: fixed height, right margin) */
.pp-cell { display: flex; align-items: center; gap: 1.4rem; height: 3rem; font-family: space-mono; font-size: 1.5rem; line-height: 1; text-transform: uppercase; white-space: nowrap; color: #fff; }
.pp-cell img { width: 2.4rem; height: 2.4rem; border-radius: 0; object-fit: cover; background: #2c2e2f; }
.pp-cell b { font-weight: 700; }
.pp-cell .num { font-variant-numeric: tabular-nums; }
.pp-cell .up { color: var(--up); }
.pp-cell .down { color: var(--down); }
@media (max-width: 649px) { .pp-cell { font-size: 1.2rem; gap: 1rem; } .pp-cell img { width: 1.8rem; height: 1.8rem; } }

/* X button and CA pill: driven by data-x / data-ca on <html>; empty = nothing rendered */
.pp-x { position: relative; z-index: 3; margin-left: auto; margin-right: 2.3rem; }
/* phone: the header has no room beside the menu button; the X button sits next to the CA in the hero */
@media (max-width: 649px) { .pp-x { display: none; } }
.pp-ca-row { position: relative; z-index: 3; pointer-events: auto; display: flex; flex-wrap: wrap; align-items: stretch; gap: 1rem; margin-top: 1.6rem; }
.pp-ca, .pp-xbtn { display: inline-flex; align-items: center; gap: 1rem; height: 4.6rem; min-height: 40px; padding: 0 1.4rem; border: 1px solid var(--line); font-family: space-mono; font-size: 1.3rem; line-height: 1; text-transform: uppercase; color: #fff; background: var(--ink); cursor: pointer; white-space: nowrap; }
.pp-ca b { font-weight: 400; color: var(--pink); text-transform: none; }
.pp-ca .pp-ca-hint { color: hsla(0, 0%, 100%, .5); }
.pp-xbtn { text-decoration: none; text-transform: none; }
.pp-xbtn svg { flex: none; }
.pp-ca:hover, .pp-xbtn:hover { border-color: var(--pink); }
/* generated pages (no Nuxt): the header's nav is in the markup, the scrolled state comes from site.js */
.pp-page body, body.pp-page { background: var(--ink); color: #fff; }
.pp-static .pp-nav li { list-style: none; }
.pp-static .pp-nav .site-link { font-family: space-mono; }
@media (max-width: 649px) {
  /* phone, generated pages: logo + primary button on one row, the links under them */
  .pp-static > .relative.flex { flex-wrap: wrap; row-gap: 1rem; }
  .pp-static .sh-btn { display: inline-flex !important; height: 4.2rem !important; padding: 0 1.4rem !important; clip-path: none !important; font-size: 1.2rem; }
  .pp-static .sh-btn span { margin-right: 0; }
  .pp-static .pp-nav { display: flex; position: static; transform: none; width: 100%; order: 3; justify-content: flex-start; gap: 0; margin-left: -.8rem; }
  .pp-static .pp-nav li { padding: .6rem .8rem; }
  .pp-static .pp-nav .label { font-size: 1.2rem; }
}
/* the hero's Launch app button sits in the template's black hero box, above its scroll arrow */
.pp-launch { position: relative; z-index: 3; pointer-events: auto; }
.pp-body { min-height: 60vh; }
.pp-body .lazy img { opacity: 1; }

/* /how-it-works */
.hiw-hero { position: relative; padding-top: 9rem; margin-bottom: 6rem; overflow: hidden; }
@media (min-width: 650px) { .hiw-hero { padding-top: 20rem; margin-bottom: 10rem; min-height: 86vh; } }
.hiw-ladder { position: relative; width: 100%; }
.hiw-ladder canvas { display: block; width: 100%; height: 100%; }
.hiw-title { font-size: 5.4rem; line-height: .98; letter-spacing: -.025em; font-weight: 800; }
.hiw-steps .h2 { font-size: 2.4rem; }
@media (max-width: 649px) { .hiw-steps .h2 { font-size: 1.9rem; } }
.txt p + p { margin-top: 1.6rem; }

/* /markets */
.mk-hero { position: relative; padding-top: 12rem; margin-bottom: 5rem; }
@media (min-width: 650px) { .mk-hero { padding-top: 18rem; margin-bottom: 8rem; } }
.mk-sec { margin-bottom: 7rem; }
.mk-sec-h { display: flex; align-items: baseline; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; flex-wrap: wrap; }
.mk-table { border-top: 1px solid var(--line); }
.mk-h, .mk-row { display: grid; grid-template-columns: minmax(0, 1.8fr) 1fr .7fr 1fr .6fr; gap: 1.5rem; align-items: center; padding: 1.4rem 0; border-bottom: 1px solid var(--line); font-family: space-mono; }
.mk-h { color: #636363; font-size: 1.2rem; }
.mk-h span:not(:first-child), .mk-row > span:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.mk-row { color: #fff; text-decoration: none; font-size: 1.5rem; transition: background-color .25s ease-out; }
.mk-row:hover { background: hsla(0, 0%, 100%, .05); }
.mk-coin { display: flex; align-items: center; gap: 1.2rem; min-width: 0; }
.mk-coin img, .mk-coin i { width: 2.8rem; height: 2.8rem; flex: none; background: #2c2e2f; object-fit: cover; display: block; }
.mk-coin b { font-weight: 700; }
.mk-coin small { display: block; color: #636363; font-size: 1.2rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk-row .up { color: var(--up); }
.mk-row .down { color: var(--down); }
.mk-row .lev { color: var(--pink); }
.mk-empty { padding: 2rem 0; color: #636363; }
@media (max-width: 649px) {
  .mk-h, .mk-row { grid-template-columns: minmax(0, 1.6fr) 1fr .8fr; }
  .mk-h span:nth-child(4), .mk-h span:nth-child(5), .mk-row > span:nth-child(4), .mk-row > span:nth-child(5) { display: none; }
}

/* 404 */
.pp-404 { padding: 24rem 0 12rem; }

/* Native viewport scrolling: clip does not create a nested body scroll box. */
html { overflow-x: clip !important; overflow-y: auto !important; overscroll-behavior-y: auto !important; height: auto; min-height: 100%; touch-action: pan-y pinch-zoom; }
html body { overflow-x: clip !important; overflow-y: visible !important; overscroll-behavior: auto !important; height: auto; min-height: 100%; touch-action: pan-y pinch-zoom; }
.pp-snapshot-note { font-family: space-mono; font-size: 11px; line-height: 1.5; color: #a1a1aa; margin-top: 12px; max-width: 48em; text-transform: none; }
.ap-frame canvas { touch-action: pan-y pinch-zoom; }
@keyframes pp-tick { from { text-shadow:0 0 10px #ff00fe; } to { text-shadow:none; } }
.pp-tick { animation:pp-tick .65s ease-out; }
@media (prefers-reduced-motion:reduce) { .pp-tick {animation:none;} }
/* Reveal the already-rendered hero immediately, not after the decorative WebGL loader. */
#__nuxt .fixed.inset-0.z-\[9999\].flex.items-center.justify-center { display:none!important; }
#__nuxt .js-t-lines, #__nuxt .js-t-lines * { opacity:1!important; visibility:visible!important; transform:none!important; }
/* Reserve the post-hydration CA/X row from first paint: no hero-panel layout shift. */
#__nuxt div:has(> .pp-launch):not(:has(> .pp-ca-row))::after { content:""; display:block; height:calc(1.6rem + max(40px,4.6rem)); }
@media (max-width:649px) { #__nuxt div:has(> .pp-launch):not(:has(> .pp-ca-row))::after { height:calc(2.6rem + max(40px,4.6rem) * 2); } }