@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  --ink: #111424;
  --muted: #6f7489;
  --line: rgba(17, 20, 36, 0.12);
  --line-strong: rgba(17, 20, 36, 0.2);
  --paper: #f7f8fc;
  --white: #ffffff;
  --blue: #1b3bff;
  --blue-dark: #1227bc;
  --blue-soft: #e9edff;
  --lime: #b8ff4a;
  --coral: #ff725e;
  --cyan: #73e7ff;
  --yellow: #ffd84a;
  --green: #0aa86e;
  --red: #df3a4e;
  --violet: #8b6cff;
  --shadow: 0 24px 80px rgba(24, 35, 90, 0.12);
  --radius: 22px;
  --pad: clamp(22px, 5vw, 76px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: 'Manrope', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  min-width: 320px;
  overflow-x: hidden;
}
body.modal-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
svg { display: block; }
.noise {
  position: fixed; inset: 0; pointer-events: none; opacity: .025; z-index: 100;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
.page-pad { padding-left: var(--pad); padding-right: var(--pad); }
.topbar {
  position: sticky; top: 0; z-index: 50; height: 82px; display: grid;
  grid-template-columns: 1fr auto 1fr; align-items: center; gap: 32px;
  padding: 0 var(--pad); background: rgba(247,248,252,.88); border-bottom: 1px solid var(--line);
  backdrop-filter: blur(20px) saturate(1.3);
}
.brand { display: inline-flex; align-items: center; gap: 11px; width: max-content; }
.brand-mark { width: 39px; height: 39px; border-radius: 12px; display: grid; place-items: center; background: var(--blue); box-shadow: 0 9px 24px rgba(27,59,255,.25); }
.brand-mark svg { width: 31px; height: 31px; fill: white; }
.brand-mark circle { fill: var(--lime); }
.wordmark { font-weight: 800; letter-spacing: .14em; font-size: 15px; }
.desktop-nav { display: flex; align-items: center; gap: 30px; }
.desktop-nav a { position: relative; font-size: 14px; font-weight: 600; color: #616679; transition: color .25s ease; }
.desktop-nav a:hover, .desktop-nav a.active { color: var(--ink); }
.desktop-nav a::after { content: ''; position: absolute; left: 0; right: 100%; bottom: -12px; height: 2px; background: var(--blue); transition: right .25s ease; }
.desktop-nav a.active::after { right: 0; }
.top-actions { justify-self: end; display: flex; align-items: center; gap: 10px; }
.icon-button, .wallet-button, .mobile-menu-button { border: 0; background: none; }
.icon-button { height: 44px; padding: 0 10px 0 13px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.65); }
.icon-button svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.keycap { font: 11px 'DM Mono', monospace; color: var(--muted); background: #eceef5; border-radius: 5px; padding: 3px 5px; }
.wallet-button { height: 46px; padding: 0 17px; border-radius: 13px; background: var(--ink); color: white; display: flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 700; transition: transform .2s, background .2s; }
.wallet-button:hover { transform: translateY(-2px); background: var(--blue); }
.wallet-button svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.wallet-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 4px rgba(184,255,74,.12); }
.mobile-menu-button { display: none; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 12px; }
.mobile-menu-button span { width: 18px; height: 1.5px; display: block; margin: 5px auto; background: var(--ink); transition: transform .3s; }
.mobile-nav { display: none; position: fixed; inset: 82px 0 auto; z-index: 48; padding: 22px var(--pad) 28px; background: rgba(247,248,252,.98); border-bottom: 1px solid var(--line); box-shadow: var(--shadow); }
.mobile-nav.open { display: grid; }
.mobile-nav a { padding: 15px 0; border-bottom: 1px solid var(--line); font-size: 22px; font-weight: 600; }

.route { display: none; min-height: 70vh; animation: routeIn .55s cubic-bezier(.2,.7,.2,1) both; }
.route.active { display: block; }
@keyframes routeIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.hero { min-height: calc(100svh - 82px); padding-top: clamp(50px, 9vh, 112px); padding-bottom: 70px; display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: clamp(40px, 7vw, 110px); }
.eyebrow { font: 500 11px/1.4 'DM Mono', monospace; letter-spacing: .14em; text-transform: uppercase; display: flex; align-items: center; gap: 9px; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); display: inline-block; box-shadow: 0 0 0 4px rgba(10,168,110,.12); }
h1, h2, h3, p { margin-top: 0; }
.hero h1, .route-hero h1 { font-size: clamp(54px, 7.3vw, 112px); line-height: .93; letter-spacing: -.065em; font-weight: 500; margin: 25px 0 30px; }
.hero h1 em, .route-hero h1 em { color: var(--blue); font-style: normal; }
.hero-lede { max-width: 610px; font-size: clamp(17px, 1.45vw, 21px); line-height: 1.65; color: #575d72; }
.hero-actions { display: flex; gap: 11px; align-items: center; margin-top: 35px; }
.button { min-height: 50px; border: 1px solid var(--line); border-radius: 14px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; gap: 22px; background: var(--white); font-weight: 700; font-size: 14px; transition: transform .2s, box-shadow .2s, background .2s, border-color .2s; }
.button:hover { transform: translateY(-2px); box-shadow: 0 14px 35px rgba(17,20,36,.1); }
.button.primary { background: var(--blue); color: white; border-color: var(--blue); box-shadow: 0 14px 35px rgba(27,59,255,.22); }
.button.primary:hover { background: var(--blue-dark); }
.button.ghost { background: transparent; }
.button.ghost span { color: var(--muted); font: 11px 'DM Mono', monospace; }
.button.soft { background: var(--blue-soft); color: var(--blue); border-color: transparent; }
.button.full { width: 100%; }
.trust-row { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 29px; font-size: 12px; color: var(--muted); }
.trust-row span { display: flex; align-items: center; gap: 6px; }
.trust-row i { color: var(--green); font-style: normal; }

.hero-visual { min-width: 0; }
.orbital-card { position: relative; min-height: min(690px, 74vh); overflow: hidden; border: 1px solid rgba(27,59,255,.16); border-radius: 34px; background: radial-gradient(circle at 72% 22%, rgba(115,231,255,.82), transparent 24%), radial-gradient(circle at 34% 75%, rgba(184,255,74,.68), transparent 24%), linear-gradient(145deg, #e8ecff, #f9fbff 50%, #eef5ff); box-shadow: 0 35px 120px rgba(48,69,159,.16), inset 0 1px 0 white; }
.orbital-card::after { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(27,59,255,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(27,59,255,.055) 1px, transparent 1px); background-size: 38px 38px; mask-image: linear-gradient(to bottom, black, transparent 70%); }
.visual-topline, .visual-footer { position: absolute; left: 28px; right: 28px; z-index: 4; display: flex; justify-content: space-between; align-items: center; font: 500 10px 'DM Mono', monospace; letter-spacing: .1em; }
.visual-topline { top: 25px; }
.visual-footer { bottom: 23px; color: #71778d; }
.market-open { display: flex; align-items: center; gap: 7px; }
.market-open i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(10,168,110,.12); }
.orbit-bg, .orbit { position: absolute; inset: 0; border-radius: 50%; }
.orbit { left: 50%; top: 50%; width: 78%; aspect-ratio: 1; height: auto; border: 1px solid rgba(27,59,255,.12); transform: translate(-50%,-50%); animation: spin 22s linear infinite; }
.orbit::before { content: ''; position: absolute; width: 9px; height: 9px; border-radius: 50%; top: -5px; left: 48%; background: var(--blue); box-shadow: 0 0 0 5px rgba(27,59,255,.12); }
.orbit-b { width: 61%; animation-direction: reverse; animation-duration: 17s; transform: translate(-50%,-50%) rotate(33deg); }
.orbit-b::before { background: var(--coral); }
.orbit-c { width: 44%; animation-duration: 13s; transform: translate(-50%,-50%) rotate(70deg); }
.orbit-c::before { background: var(--lime); }
@keyframes spin { to { transform: translate(-50%,-50%) rotate(360deg); } }
.globe { position: absolute; z-index: 2; left: 50%; top: 50%; width: min(410px, 67%); aspect-ratio: 1; transform: translate(-50%,-50%); border-radius: 50%; background: radial-gradient(circle at 33% 28%, #fff 0, #e8edff 42%, #b9c6ff 100%); box-shadow: -25px 34px 75px rgba(33,57,156,.24), inset -30px -20px 70px rgba(27,59,255,.14); overflow: visible; }
.globe::before, .globe::after { content: ''; position: absolute; inset: 9%; border-radius: 50%; border: 1px solid rgba(27,59,255,.16); }
.globe::after { inset: 24% 7%; }
.globe-grid { position: absolute; inset: 0; border-radius: 50%; background: repeating-radial-gradient(ellipse at center, transparent 0 31px, rgba(27,59,255,.10) 32px 33px), linear-gradient(90deg, transparent 49.7%, rgba(27,59,255,.13) 50%, transparent 50.3%); }
.land { position: absolute; background: linear-gradient(135deg, rgba(27,59,255,.55), rgba(115,231,255,.3)); filter: drop-shadow(0 8px 12px rgba(27,59,255,.15)); }
.land-a { width: 31%; height: 26%; left: 14%; top: 25%; border-radius: 61% 39% 45% 55% / 47% 58% 42% 53%; transform: rotate(-18deg); }
.land-b { width: 23%; height: 36%; left: 42%; top: 42%; border-radius: 55% 45% 62% 38%; transform: rotate(17deg); }
.land-c { width: 25%; height: 22%; right: 8%; top: 29%; border-radius: 42% 58% 35% 65%; transform: rotate(12deg); }
.city-pin { position: absolute; z-index: 6; width: 13px; height: 13px; border-radius: 50%; border: 3px solid white; background: var(--blue); padding: 0; box-shadow: 0 0 0 4px rgba(27,59,255,.22); }
.city-pin::after { content: ''; position: absolute; inset: -8px; border: 1px solid currentColor; border-radius: 50%; animation: pulse 2.2s ease-out infinite; }
.city-pin span { position: absolute; left: 16px; top: -9px; white-space: nowrap; padding: 5px 7px; border-radius: 7px; background: rgba(255,255,255,.82); box-shadow: 0 4px 15px rgba(17,20,36,.08); font: 500 9px 'DM Mono', monospace; }
.city-pin.hot { background: var(--coral); color: var(--coral); }
.pin-ny { left: 23%; top: 34%; }.pin-lon { left: 46%; top: 26%; }.pin-dxb { left: 61%; top: 49%; }.pin-tky { right: 16%; top: 37%; }.pin-sgp { right: 24%; bottom: 22%; }
@keyframes pulse { from { transform: scale(.5); opacity: .8; } to { transform: scale(1.6); opacity: 0; } }
.floating-quote, .floating-chip { position: absolute; z-index: 5; border: 1px solid rgba(255,255,255,.75); background: rgba(255,255,255,.72); backdrop-filter: blur(18px); box-shadow: 0 18px 40px rgba(39,53,116,.13); }
.quote-main { left: 5%; top: 16%; width: 198px; padding: 16px; border-radius: 18px; animation: float 5s ease-in-out infinite; }
.quote-main > div { display: flex; justify-content: space-between; font: 500 9px 'DM Mono', monospace; color: var(--muted); }
.quote-main > div b { color: var(--ink); }
.quote-main strong { display: block; font-size: 27px; letter-spacing: -.04em; margin: 12px 0 1px; }
.quote-main small { font: 500 11px 'DM Mono', monospace; }
.quote-main svg { width: 100%; height: 38px; margin-top: 8px; fill: none; stroke: var(--blue); stroke-width: 2; }
.floating-chip { padding: 13px 15px; border-radius: 14px; display: grid; gap: 3px; }
.floating-chip span { font: 500 8px 'DM Mono', monospace; letter-spacing: .12em; color: var(--muted); }
.floating-chip b { font-size: 14px; }.floating-chip i { font-style: normal; color: var(--green); }
.chip-volume { right: 5%; top: 23%; animation: float 6s .7s ease-in-out infinite; }
.chip-movers { left: 7%; bottom: 18%; animation: float 5.6s 1.2s ease-in-out infinite; }
@keyframes float { 50% { transform: translateY(-9px) rotate(.5deg); } }
.avatar-stack { display: flex; align-items: center; }
.avatar-stack i { width: 25px; height: 25px; margin-left: -6px; border: 2px solid white; border-radius: 50%; display: grid; place-items: center; color: white; font: 500 9px 'DM Mono', monospace; background: var(--violet); }
.avatar-stack i:nth-child(2) { background: var(--coral); }.avatar-stack i:nth-child(3) { background: var(--blue); }
.avatar-stack b { margin-left: 6px; color: var(--ink); }

.ticker-wrap { border-block: 1px solid var(--line); background: white; overflow: hidden; }
.ticker { display: flex; width: max-content; animation: ticker 34s linear infinite; }
.ticker-item { min-width: 250px; padding: 18px 25px; border-right: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.ticker-item div { display: grid; gap: 3px; }.ticker-item b { font-size: 13px; }.ticker-item small, .ticker-item span { font: 10px 'DM Mono', monospace; }.ticker-item small { color: var(--muted); }
@keyframes ticker { to { transform: translateX(-50%); } }
.positive { color: var(--green) !important; }.negative { color: var(--red) !important; }
.section-space { padding-top: clamp(90px, 11vw, 160px); padding-bottom: clamp(90px, 11vw, 160px); }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 45px; }
.section-head h2, .faq-intro h2 { font-size: clamp(42px, 5vw, 76px); line-height: 1; letter-spacing: -.055em; font-weight: 500; margin: 18px 0 0; }
.text-link { display: inline-flex; align-items: center; gap: 18px; font-weight: 700; font-size: 13px; border-bottom: 1px solid var(--ink); padding-bottom: 7px; }
.featured-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 14px; }
.featured-card { min-height: 420px; position: relative; overflow: hidden; padding: 26px; border: 1px solid var(--line); border-radius: var(--radius); background: white; transition: transform .3s, box-shadow .3s; cursor: pointer; }
.featured-card:first-child { min-height: 520px; grid-row: span 2; }
.featured-card:hover { transform: translateY(-7px); box-shadow: var(--shadow); }
.featured-card::before { content: ''; position: absolute; inset: auto -20% -35% -20%; height: 74%; background: radial-gradient(circle at 50% 0, var(--card-color), transparent 68%); opacity: .25; }
.featured-card .card-top { display: flex; justify-content: space-between; align-items: center; }
.market-code { font: 500 10px 'DM Mono', monospace; padding: 6px 8px; border-radius: 7px; background: var(--blue-soft); color: var(--blue); }
.market-city { margin: 35px 0 6px; font-size: 31px; letter-spacing: -.04em; }.market-country { color: var(--muted); font-size: 13px; }
.featured-card .market-level { position: absolute; left: 26px; bottom: 27px; z-index: 2; }
.featured-card .market-level strong { display: block; font-size: 31px; letter-spacing: -.04em; }.featured-card .market-level small { font: 500 11px 'DM Mono', monospace; }
.mini-chart { position: absolute; left: 0; right: 0; bottom: 72px; width: 100%; height: 130px; }
.mini-chart .area { fill: url(#fade); opacity: .16; }.mini-chart .line { fill: none; stroke: var(--card-color); stroke-width: 3; stroke-linecap: round; }
.manifesto { background: var(--ink); color: white; padding-top: 95px; padding-bottom: 100px; position: relative; overflow: hidden; }
.manifesto::before { content: ''; position: absolute; width: 520px; height: 520px; right: -130px; top: -230px; border-radius: 50%; background: var(--blue); filter: blur(4px); opacity: .8; }
.manifesto-number { position: relative; z-index: 1; font: 11px 'DM Mono', monospace; color: #9ca3bf; }
.manifesto > p { position: relative; z-index: 1; margin: 60px 0 9px; color: #9da4bd; font-size: clamp(20px, 2.5vw, 35px); }
.manifesto > h2 { position: relative; z-index: 1; font-size: clamp(52px, 7.3vw, 108px); line-height: .95; letter-spacing: -.065em; font-weight: 500; max-width: 1120px; }
.manifesto > h2 span { color: var(--lime); }
.manifesto-grid { position: relative; z-index: 1; margin-top: 90px; display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid rgba(255,255,255,.17); }
.manifesto-grid article { padding: 28px 35px 0 0; border-right: 1px solid rgba(255,255,255,.17); min-height: 215px; }
.manifesto-grid article + article { padding-left: 35px; }.manifesto-grid article:last-child { border: 0; }
.manifesto-grid b { font: 500 10px 'DM Mono', monospace; color: var(--lime); }.manifesto-grid h3 { margin: 43px 0 12px; font-size: 21px; }.manifesto-grid p { color: #aab0c3; line-height: 1.65; font-size: 14px; max-width: 340px; }
.cta-band { min-height: 420px; background: var(--lime); display: flex; justify-content: space-between; align-items: center; }
.cta-band span { font: 500 11px 'DM Mono', monospace; letter-spacing: .14em; }.cta-band h2 { font-size: clamp(56px, 7vw, 104px); line-height: .91; letter-spacing: -.065em; font-weight: 500; margin: 24px 0 0; }
.round-arrow { width: clamp(100px, 12vw, 172px); aspect-ratio: 1; border-radius: 50%; background: var(--ink); color: white; display: grid; place-items: center; font-size: 45px; transition: transform .35s, background .35s; }
.round-arrow:hover { transform: rotate(45deg) scale(1.05); background: var(--blue); }

.route-hero { min-height: 475px; padding-top: 82px; padding-bottom: 55px; display: flex; align-items: end; justify-content: space-between; gap: 40px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 85% 15%, rgba(115,231,255,.2), transparent 25%); }
.route-hero h1 { font-size: clamp(58px, 7.5vw, 108px); margin-bottom: 0; }
.route-stat { min-width: 230px; padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.75); box-shadow: 0 20px 50px rgba(28,37,84,.08); display: grid; gap: 7px; }
.route-stat span, .route-stat small { font: 500 9px 'DM Mono', monospace; color: var(--muted); }.route-stat strong { font-size: 31px; color: var(--green); }
.market-workspace { padding-top: 35px; padding-bottom: 130px; background: white; }
.filters { padding: 18px; border: 1px solid var(--line); border-radius: 18px; display: flex; align-items: center; gap: 13px; background: var(--paper); position: sticky; top: 98px; z-index: 12; }
.search-field { display: flex; align-items: center; gap: 10px; min-width: min(360px, 34vw); padding: 0 12px; height: 46px; border: 1px solid var(--line); border-radius: 11px; background: white; }
.search-field svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; color: var(--muted); }.search-field input { width: 100%; border: 0; outline: 0; background: transparent; font-size: 14px; }.search-field kbd { font: 10px 'DM Mono', monospace; background: var(--paper); padding: 3px 6px; border-radius: 5px; color: var(--muted); }
.filter-pills { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.filter-pills button { white-space: nowrap; height: 38px; border: 0; border-radius: 9px; padding: 0 12px; background: transparent; font-size: 12px; font-weight: 700; color: var(--muted); }.filter-pills button.active { color: var(--blue); background: var(--blue-soft); }
.sort-select { margin-left: auto; font: 10px 'DM Mono', monospace; color: var(--muted); }.sort-select select { display: block; border: 0; background: none; margin-top: 3px; font: 600 12px 'Manrope', sans-serif; outline: none; }
.market-list-head, .market-row { display: grid; grid-template-columns: 1.6fr 1.1fr .65fr .55fr .55fr .45fr; gap: 20px; align-items: center; }
.market-list-head { padding: 32px 20px 13px; border-bottom: 1px solid var(--line); font: 500 9px 'DM Mono', monospace; letter-spacing: .1em; color: var(--muted); text-transform: uppercase; }
.market-row { min-height: 92px; padding: 14px 20px; border-bottom: 1px solid var(--line); transition: background .2s, transform .2s; animation: rowIn .45s both; }
.market-row:hover { background: var(--paper); }.market-row .market-ident { display: flex; align-items: center; gap: 15px; min-width: 0; }.market-avatar { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font: 700 12px 'DM Mono', monospace; color: var(--avatar-text, var(--blue)); background: var(--avatar-bg, var(--blue-soft)); }.market-ident div { min-width: 0; }.market-ident b { display: block; font-size: 15px; }.market-ident small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.row-chart { width: 100%; max-width: 145px; height: 40px; }.row-chart path { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; }
.market-row > strong { font-size: 14px; }.market-row > span { font: 500 11px 'DM Mono', monospace; }.status-open { display: flex; align-items: center; gap: 7px; color: var(--muted); }.status-open i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.row-actions { display: flex; justify-content: end; gap: 6px; }.row-actions button { border: 0; border-radius: 9px; min-width: 64px; height: 36px; background: var(--ink); color: white; font-weight: 700; font-size: 11px; }.row-actions button:hover { background: var(--blue); }
@keyframes rowIn { from { opacity:0; transform: translateY(8px); } }
.empty-state { text-align: center; padding: 100px 20px; }.empty-state div { font-size: 60px; color: var(--blue); }.empty-state h3 { font-size: 25px; margin-bottom: 8px; }.empty-state p { color: var(--muted); }

.portfolio-hero, .build-hero, .learn-hero { min-height: 425px; }.portfolio-hero .button { margin-bottom: 20px; }
.portfolio-shell { padding-top: 42px; padding-bottom: 130px; }.portfolio-summary { display: grid; grid-template-columns: 1.65fr .75fr; gap: 14px; }.balance-card, .cash-card, .holdings-card { border: 1px solid var(--line); background: white; border-radius: var(--radius); }.balance-card { min-height: 390px; padding: 29px; position: relative; overflow: hidden; }.balance-card > span, .cash-card span { font: 500 10px 'DM Mono', monospace; letter-spacing: .1em; color: var(--muted); }.balance-card h2 { font-size: clamp(48px,6vw,78px); letter-spacing: -.06em; font-weight: 500; margin: 15px 0 5px; }.balance-card > div { font: 500 12px 'DM Mono', monospace; }.balance-card svg { position: absolute; left: 0; right: 0; bottom: 47px; width: 100%; height: 175px; overflow: visible; }.chart-range { position: absolute; left: 28px; right: 28px; bottom: 18px; display: flex; gap: 5px; }.chart-range button { height: 25px; padding: 0 8px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font: 500 9px 'DM Mono', monospace; }.chart-range button.active { background: var(--blue-soft); color: var(--blue); }
.cash-card { padding: 27px; display: flex; flex-direction: column; justify-content: space-between; }.cash-card > div:first-child { display: grid; gap: 12px; }.cash-card strong { font-size: 29px; letter-spacing: -.04em; }.allocation-ring { width: 140px; aspect-ratio: 1; border-radius: 50%; margin: 18px auto; display: grid !important; place-content: center; text-align: center; background: conic-gradient(var(--blue) var(--invested, 0%), #edf0f7 0); position: relative; }.allocation-ring::before { content:''; position:absolute; inset:12px; border-radius:50%; background:white; }.allocation-ring span, .allocation-ring small { position:relative; z-index:1; }.allocation-ring span { font-size: 26px !important; font-weight: 700; color: var(--ink) !important; }.allocation-ring small { color: var(--muted); font-size: 10px; }
.holdings-card { margin-top: 14px; padding: 30px; }.section-head.compact { margin-bottom: 20px; align-items: center; }.section-head.compact h2 { font-size: 35px; margin-top: 9px; }.section-head.compact > span { font: 500 10px 'DM Mono', monospace; color: var(--muted); }.portfolio-empty { text-align: center; padding: 60px 20px 75px; }.empty-orbit { width: 115px; height: 115px; margin: 0 auto 24px; border: 1px solid rgba(27,59,255,.25); border-radius: 50%; display: grid; place-items: center; position: relative; }.empty-orbit::before, .empty-orbit::after { content:''; position:absolute; width:8px; height:8px; border-radius:50%; background:var(--blue); top:10px; left:14px; }.empty-orbit::after { background:var(--lime); top:auto; left:auto; right:5px; bottom:24px; }.empty-orbit span { width:53px; height:53px; border-radius:50%; display:grid; place-items:center; color:white; background:var(--blue); font-size:27px; }.portfolio-empty h3 { font-size:26px; margin-bottom:9px; }.portfolio-empty p { color:var(--muted); max-width:450px; margin:0 auto 24px; line-height:1.6; }.holding-row { display:grid; grid-template-columns:1.3fr .7fr .7fr .7fr auto; gap:20px; align-items:center; padding:18px 0; border-top:1px solid var(--line); }.holding-row > div:first-child { display:flex; align-items:center; gap:13px; }.holding-row span { display:block; font:500 9px 'DM Mono',monospace; color:var(--muted); margin-bottom:5px; }.holding-row strong { font-size:14px; }.holding-row button { height:36px; border:1px solid var(--line); border-radius:9px; background:white; padding:0 13px; font-size:11px; font-weight:700; }.holding-row button:hover { border-color:var(--blue); color:var(--blue); }

.build-hero > p, .learn-hero > p { max-width:470px; color:var(--muted); line-height:1.7; font-size:17px; margin-bottom:22px; }.builder { display:grid; grid-template-columns:.76fr 1.35fr .82fr; gap:14px; padding-top:35px; padding-bottom:130px; }.builder-catalogue,.builder-canvas,.index-preview { border:1px solid var(--line); border-radius:var(--radius); background:white; min-height:690px; padding:24px; }.builder-step { display:flex; align-items:center; gap:12px; margin-bottom:25px; }.builder-step > span { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:var(--ink); color:white; font:500 9px 'DM Mono',monospace; }.builder-step b,.builder-step small { display:block; }.builder-step b { font-size:14px; }.builder-step small { color:var(--muted); font-size:11px; margin-top:2px; }.search-field.small { min-width:0; width:100%; }.builder-market-list { margin-top:14px; max-height:575px; overflow-y:auto; padding-right:4px; }.builder-market { display:flex; align-items:center; gap:10px; padding:11px 5px; border-bottom:1px solid var(--line); }.builder-market .market-avatar { width:36px; height:36px; flex-basis:36px; border-radius:10px; font-size:10px; }.builder-market div:nth-child(2) { min-width:0; flex:1; }.builder-market b,.builder-market small { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.builder-market b { font-size:12px; }.builder-market small { font-size:9px; color:var(--muted); margin-top:2px; }.builder-market button { width:31px; height:31px; border-radius:9px; border:1px solid var(--line); background:white; font-size:17px; }.builder-market button.selected { background:var(--blue); color:white; border-color:var(--blue); }.index-name-wrap { position:relative; margin-bottom:20px; padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--paper); }.index-name-wrap label { display:block; font:500 9px 'DM Mono',monospace; color:var(--muted); letter-spacing:.1em; margin-bottom:9px; }.index-name-wrap input { border:0; background:transparent; outline:0; width:calc(100% - 40px); font-size:18px; font-weight:600; }.index-name-wrap > span { position:absolute; right:15px; bottom:19px; font:9px 'DM Mono',monospace; color:var(--muted); }.builder-empty { text-align:center; padding:95px 10px; }.builder-constellation { width:130px; height:130px; margin:0 auto 22px; border:1px dashed rgba(27,59,255,.3); border-radius:50%; position:relative; display:grid; place-items:center; }.builder-constellation span { width:45px;height:45px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:white;font-size:24px; }.builder-constellation i { position:absolute;width:8px;height:8px;border-radius:50%;background:var(--lime);top:12px;left:29px; }.builder-constellation i:nth-child(2){top:38px;left:auto;right:2px;background:var(--coral)}.builder-constellation i:nth-child(3){top:auto;bottom:7px;left:18px;background:var(--cyan)}.builder-empty h3 { margin-bottom:7px; }.builder-empty p { color:var(--muted); font-size:13px; }.allocation-list { display:grid; gap:10px; }.allocation-item { display:grid; grid-template-columns:auto 1fr 50px auto; gap:13px; align-items:center; padding:13px; border:1px solid var(--line); border-radius:13px; }.allocation-item .market-avatar { width:37px;height:37px;flex-basis:37px;border-radius:10px;font-size:9px; }.allocation-item label { display:block; font-size:12px; font-weight:700; margin-bottom:7px; }.allocation-item input[type=range] { width:100%; accent-color:var(--blue); }.allocation-item output { font:500 12px 'DM Mono',monospace; text-align:right; }.allocation-item button { border:0;background:none;color:var(--muted);font-size:18px; }.builder-footer { margin-top:22px; padding-top:20px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:20px; }.builder-footer > div { display:grid;gap:5px; }.builder-footer span { font:500 9px 'DM Mono',monospace;color:var(--muted); }.builder-footer strong { font-size:22px; }.builder-footer .button:disabled { opacity:.4;cursor:not-allowed;box-shadow:none;transform:none; }.index-preview { background:var(--ink); color:white; }.index-preview .builder-step > span { background:var(--lime);color:var(--ink); }.index-preview .builder-step small { color:#8e95aa; }.preview-card { position:relative; min-height:580px; overflow:hidden; border-radius:18px; padding:20px; background:radial-gradient(circle at 50% 45%,rgba(27,59,255,.5),transparent 38%),linear-gradient(160deg,#24283a,#111424 70%); border:1px solid rgba(255,255,255,.13); }.preview-card::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:25px 25px; }.preview-top,.preview-metric { position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;font:500 8px 'DM Mono',monospace;letter-spacing:.08em;color:#aeb5ca; }.status-chip { padding:5px 7px;border-radius:6px;background:rgba(184,255,74,.12);color:var(--lime); }.preview-card h3,.preview-card p { position:relative;z-index:1; }.preview-card h3 { font-size:28px;letter-spacing:-.04em;margin:30px 0 7px; }.preview-card p { color:#9ba2b7;font-size:12px;line-height:1.6; }.composition-orbit { position:relative;z-index:1;width:180px;height:180px;border-radius:50%;margin:35px auto 28px;display:grid;place-content:center;text-align:center;background:radial-gradient(circle,#1c2032 52%,transparent 53%),conic-gradient(var(--lime) 0 20%,var(--blue) 20% 45%,var(--coral) 45% 65%,var(--cyan) 65% 80%,var(--violet) 80%);box-shadow:0 0 60px rgba(27,59,255,.35); }.composition-orbit span { font-size:36px;font-weight:700; }.composition-orbit small { color:#9ba2b7; }.preview-legend { position:relative;z-index:1;display:grid;gap:7px; }.preview-legend div { display:flex;justify-content:space-between;font-size:10px;color:#c7cbda; }.preview-legend i { width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:7px; }.preview-metric { position:absolute;z-index:2;left:20px;right:20px;bottom:20px;padding-top:17px;border-top:1px solid rgba(255,255,255,.13); }.preview-metric b { color:var(--lime);font-size:17px; }

.steps { display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding-top:35px;padding-bottom:120px; }.steps article { min-height:440px;padding:25px;border:1px solid var(--line);border-radius:var(--radius);background:white;position:relative;overflow:hidden; }.steps article:nth-child(2){background:var(--blue);color:white}.steps article:nth-child(3){background:var(--lime)}.steps article > span { font:500 10px 'DM Mono',monospace; }.step-icon { width:145px;height:145px;margin:55px auto;border-radius:50%;display:grid;place-items:center;font-size:47px;background:var(--paper);color:var(--blue);box-shadow:inset 0 0 0 18px rgba(27,59,255,.06); }.steps article:nth-child(2) .step-icon{background:rgba(255,255,255,.12);color:var(--lime);box-shadow:inset 0 0 0 18px rgba(255,255,255,.06)}.steps article:nth-child(3) .step-icon{background:rgba(255,255,255,.62);color:var(--ink);box-shadow:none}.steps h2{font-size:29px;margin-bottom:10px}.steps p{font-size:14px;line-height:1.65;color:var(--muted)}.steps article:nth-child(2) p{color:#c6cbee}.faq-shell{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;padding-top:105px;padding-bottom:140px;background:white}.faq-intro h2{font-size:clamp(42px,4.4vw,70px)}.faq-intro p{color:var(--muted);line-height:1.7;max-width:380px;margin:25px 0}.faq-list{border-top:1px solid var(--line)}.faq-item{border-bottom:1px solid var(--line)}.faq-item button{width:100%;border:0;background:none;padding:25px 0;display:flex;justify-content:space-between;gap:20px;text-align:left;font-size:17px;font-weight:700}.faq-item button i{font-style:normal;color:var(--blue);font-size:22px}.faq-item > div{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}.faq-item > div > p{overflow:hidden;color:var(--muted);line-height:1.75;margin:0}.faq-item.open > div{grid-template-rows:1fr}.faq-item.open > div > p{padding-bottom:25px}

.footer { background:#0d0f1a;color:white;padding-top:70px;padding-bottom:25px }.footer-main{display:grid;grid-template-columns:.75fr .75fr 2fr;gap:50px;align-items:start}.footer-brand .brand-mark{background:white}.footer-brand .brand-mark svg{fill:var(--blue)}.footer-brand .brand-mark circle{fill:var(--lime)}.footer-main>p{color:#8d94a8;line-height:1.7;font-size:14px}.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.footer-links>div{display:grid;gap:12px;align-content:start}.footer-links b{font:500 9px 'DM Mono',monospace;color:#737b94;letter-spacing:.1em;margin-bottom:7px}.footer-links a,.footer-links span{font-size:12px;color:#c8cbd5}.footer-links span{display:flex;align-items:center;gap:7px}.footer-bottom{margin-top:65px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:20px;font:500 8px 'DM Mono',monospace;letter-spacing:.08em;color:#6f768d}.footer-bottom button{border:0;background:none;color:#8d94a8;font:inherit}

.modal-backdrop,.command-palette{position:fixed;inset:0;z-index:100;background:rgba(10,12,23,.48);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}.modal-backdrop.open,.command-palette.open{opacity:1;visibility:visible}.modal{width:min(530px,100%);max-height:92vh;overflow-y:auto;background:white;border:1px solid rgba(255,255,255,.6);border-radius:26px;padding:34px;position:relative;box-shadow:0 40px 120px rgba(6,9,29,.3);transform:translateY(18px) scale(.98);transition:transform .3s cubic-bezier(.2,.8,.2,1)}.modal-backdrop.open .modal{transform:none}.modal-close{position:absolute;right:18px;top:17px;width:35px;height:35px;border:1px solid var(--line);border-radius:50%;background:white;font-size:20px;z-index:3}.modal-orb{width:74px;height:74px;border-radius:50%;margin-bottom:23px;display:grid;place-items:center;background:var(--blue-soft);color:var(--blue);font-size:31px;box-shadow:inset 0 0 0 12px rgba(27,59,255,.06)}.deposit-orb{background:rgba(184,255,74,.4);color:var(--ink)}.modal h2{font-size:37px;line-height:1.03;letter-spacing:-.05em;margin:16px 0 13px}.modal>p{color:var(--muted);line-height:1.6;margin-bottom:24px}.wallet-option{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;padding:13px;text-align:left;border:1px solid var(--line);border-radius:14px;background:white;margin-top:9px}.wallet-option:hover{border-color:var(--blue);background:var(--blue-soft)}.wallet-option-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:var(--blue);color:white;font-weight:800}.wallet-option span:nth-child(2) b,.wallet-option span:nth-child(2) small{display:block}.wallet-option small{color:var(--muted);margin-top:3px}.wallet-option>i{font:500 8px 'DM Mono',monospace;color:var(--blue);font-style:normal}.disabled-option{opacity:.5;cursor:not-allowed}.modal-note{display:block;color:var(--muted);font-size:10px;line-height:1.5;margin-top:17px;text-align:center}.trade-modal{width:min(570px,100%)}.trade-modal-head{display:grid;grid-template-columns:auto 1fr auto;gap:13px;align-items:center;margin-bottom:23px}.trade-modal-head h2{font-size:27px;margin:5px 0 0}.trade-price{text-align:right}.trade-price strong,.trade-price small{display:block}.trade-price strong{font-size:20px}.trade-price small{font:500 10px 'DM Mono',monospace;margin-top:4px}.trade-tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--paper);border-radius:12px;padding:4px;margin-bottom:18px}.trade-tabs button{height:40px;border:0;border-radius:9px;background:transparent;font-weight:700}.trade-tabs button.active{background:white;box-shadow:0 6px 18px rgba(17,20,36,.08);color:var(--blue)}.amount-field{display:block;padding:15px;border:1px solid var(--line);border-radius:14px}.amount-field>span{font:500 9px 'DM Mono',monospace;color:var(--muted);letter-spacing:.1em}.amount-field>div{display:flex;align-items:center;margin-top:8px}.amount-field i{font-style:normal;font-size:29px;color:var(--muted)}.amount-field input{width:100%;border:0;outline:0;font-size:35px;font-weight:700;letter-spacing:-.04em;background:transparent}.amount-field b{font:500 11px 'DM Mono',monospace;color:var(--muted)}.quick-amounts{display:flex;gap:7px;margin:9px 0 19px}.quick-amounts button{height:30px;border:1px solid var(--line);border-radius:7px;background:white;padding:0 10px;font-size:10px;font-weight:700}.quick-amounts button:hover{color:var(--blue);border-color:var(--blue)}.order-summary{background:var(--paper);border-radius:14px;padding:15px;display:grid;gap:10px;margin-bottom:17px}.order-summary>div{display:flex;justify-content:space-between;font-size:11px}.order-summary span{color:var(--muted)}.order-summary .total{border-top:1px solid var(--line);padding-top:10px;font-size:13px}.compact-modal{width:min(460px,100%)}.tour-modal{width:min(620px,100%);text-align:center}.tour-visual{height:250px;position:relative;display:grid;place-items:center;margin:-34px -34px 25px;background:radial-gradient(circle,rgba(115,231,255,.75),rgba(233,237,255,.5) 45%,transparent 70%);overflow:hidden;border-radius:26px 26px 0 0}.tour-center{width:75px;height:75px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:white;font-size:28px;font-weight:800;box-shadow:0 15px 45px rgba(27,59,255,.35)}.tour-ring{position:absolute;border:1px solid rgba(27,59,255,.2);border-radius:50%;width:180px;height:180px;animation:spin 12s linear infinite}.tour-ring.r2{width:280px;height:280px;animation-direction:reverse}.tour-node{position:absolute;padding:7px 9px;border-radius:8px;background:white;box-shadow:0 7px 20px rgba(17,20,36,.1);font:500 9px 'DM Mono',monospace}.n1{left:19%;top:31%}.n2{right:17%;top:24%}.n3{right:24%;bottom:17%}.command-palette{align-items:flex-start;padding-top:12vh}.command-box{width:min(650px,100%);background:white;border-radius:20px;overflow:hidden;box-shadow:0 40px 120px rgba(6,9,29,.3)}.command-box>label{height:65px;padding:0 19px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line)}.command-box svg{width:20px;fill:none;stroke:currentColor;stroke-width:1.8;color:var(--muted)}.command-box input{width:100%;border:0;outline:0;font-size:17px}.command-result{width:100%;padding:13px 18px;display:flex;align-items:center;justify-content:space-between;border:0;border-bottom:1px solid var(--line);background:white;text-align:left}.command-result:hover,.command-result.active{background:var(--blue-soft)}.command-result span{font-size:13px;font-weight:700}.command-result small{font:500 9px 'DM Mono',monospace;color:var(--muted)}.command-footer{display:flex;gap:16px;padding:11px 18px;background:var(--paper);font:500 8px 'DM Mono',monospace;color:var(--muted)}.toast-region{position:fixed;right:20px;bottom:20px;z-index:200;display:grid;gap:8px}.toast{min-width:270px;max-width:380px;padding:14px 16px;border-radius:13px;background:var(--ink);color:white;box-shadow:0 18px 50px rgba(17,20,36,.28);display:flex;align-items:center;gap:11px;font-size:12px;animation:toastIn .35s both}.toast i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--lime);color:var(--ink);font-style:normal;font-weight:700}@keyframes toastIn{from{opacity:0;transform:translateY(10px)}}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1)}.reveal.in-view{opacity:1;transform:none}.delay-1{transition-delay:.12s}@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.reveal{opacity:1;transform:none}}

@media(max-width:1100px){.topbar{grid-template-columns:1fr auto}.desktop-nav{display:none}.mobile-menu-button{display:block}.hero{grid-template-columns:1fr;min-height:auto}.hero-copy{padding-top:35px}.hero-visual{max-width:850px;width:100%;margin:auto}.orbital-card{min-height:650px}.featured-grid{grid-template-columns:1fr 1fr}.featured-card:first-child{grid-row:auto;grid-column:span 2;min-height:480px}.builder{grid-template-columns:.8fr 1.2fr}.index-preview{grid-column:1/-1;min-height:auto}.preview-card{min-height:450px}.footer-main{grid-template-columns:1fr 1fr}.footer-links{grid-column:1/-1}.faq-shell{gap:45px}}
@media(max-width:760px){:root{--pad:20px}.topbar{height:70px}.mobile-nav{top:70px}.icon-button{display:none}.wallet-button{height:42px;padding:0 12px}.hero{padding-top:45px}.hero h1,.route-hero h1{font-size:clamp(48px,15vw,72px)}.hero-actions{align-items:stretch;flex-direction:column}.button{width:100%}.trust-row{gap:11px}.orbital-card{min-height:510px;border-radius:24px}.globe{width:70%}.quote-main{width:160px;padding:12px}.quote-main strong{font-size:20px}.chip-volume{top:16%}.chip-movers{bottom:16%}.visual-topline,.visual-footer{left:17px;right:17px}.ticker-item{min-width:215px}.section-head{align-items:start;flex-direction:column}.featured-grid{grid-template-columns:1fr}.featured-card:first-child{grid-column:auto;min-height:420px}.featured-card{min-height:360px}.manifesto{padding-top:70px}.manifesto-grid{grid-template-columns:1fr}.manifesto-grid article,.manifesto-grid article+article{border-right:0;border-bottom:1px solid rgba(255,255,255,.17);padding:28px 0;min-height:auto}.cta-band{min-height:420px;align-items:flex-start;justify-content:center;flex-direction:column;gap:40px}.round-arrow{width:95px}.route-hero{min-height:390px;padding-top:60px;align-items:flex-start;justify-content:end;flex-direction:column}.route-stat{width:100%}.filters{top:82px;align-items:stretch;flex-direction:column}.search-field{min-width:0;width:100%}.sort-select{display:none}.market-list-head{display:none}.market-row{grid-template-columns:1fr auto;gap:12px;padding:16px 3px}.market-row .row-chart,.market-row>.level-cell,.market-row>.status-open{display:none}.market-row>.change-cell{grid-column:2;grid-row:1}.row-actions{grid-column:1/-1}.row-actions button{width:100%}.portfolio-summary{grid-template-columns:1fr}.cash-card{min-height:380px}.holding-row{grid-template-columns:1fr 1fr;gap:13px}.holding-row>div:first-child{grid-column:1/-1}.holding-row button{grid-column:1/-1}.builder{grid-template-columns:1fr}.builder-catalogue,.builder-canvas,.index-preview{min-height:auto}.builder-market-list{max-height:430px}.steps{grid-template-columns:1fr}.steps article{min-height:390px}.faq-shell{grid-template-columns:1fr;gap:55px}.footer-main{grid-template-columns:1fr}.footer-links{grid-template-columns:1fr 1fr}.footer-links>div:last-child{grid-column:1/-1}.footer-bottom{align-items:flex-start;flex-direction:column}.modal{padding:25px 20px}.tour-visual{margin:-25px -20px 25px}.wallet-option{grid-template-columns:auto 1fr}.wallet-option>i{display:none}.trade-modal-head{grid-template-columns:auto 1fr}.trade-price{grid-column:1/-1;text-align:left;display:flex;align-items:center;gap:10px}}
