:root {
  --ink: #f2f5ee;
  --muted: #a6b1b5;
  --subtle: #728087;
  --navy: #101820;
  --navy-deep: #0b1117;
  --panel: #18232a;
  --panel-soft: #1d2a31;
  --line: rgba(235, 242, 237, .12);
  --lime: #d9ef65;
  --lime-deep: #b7d73e;
  --teal: #7bd7c4;
  --orange: #f6b66a;
  --blue: #82b8ef;
  --display: clamp(2.6rem, 4.5vw, 5.2rem);
  font-family: Inter, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  color: var(--ink);
  background: var(--navy);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--navy); color: var(--ink); line-height: 1.5; }
a { color: inherit; text-decoration: none; }
button, select { font: inherit; }
.container { width: min(1240px, calc(100% - 56px)); margin: 0 auto; }

.site-header { position: relative; z-index: 5; border-bottom: 1px solid rgba(236, 243, 235, .08); background: rgba(16, 24, 32, .94); }
.header-inner { min-height: 84px; display: flex; align-items: center; gap: 36px; }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: 210px; }
.brand-mark { width: 37px; height: 37px; display: grid; place-items: center; }
.brand-mark img, .mini-brand img { width: 100%; height: 100%; }
.brand-copy { display: grid; gap: 1px; }
.brand-copy strong { font-size: 18px; letter-spacing: .02em; }
.brand-copy small { color: var(--subtle); font-size: 11px; letter-spacing: .08em; }
.main-nav { display: flex; gap: 34px; margin-left: auto; color: var(--muted); font-size: 14px; }
.main-nav a, .header-cta, .text-link, .footer-inner a { transition: color .2s ease, opacity .2s ease; }
.main-nav a:hover, .footer-inner a:hover { color: var(--lime); }
.header-cta { display: inline-flex; align-items: center; gap: 9px; border: 1px solid rgba(217, 239, 101, .45); color: var(--lime); padding: 10px 15px; font-size: 13px; }
.header-cta:hover { background: var(--lime); color: var(--navy); }

.hero { display: grid; grid-template-columns: .85fr 1.15fr; gap: 50px; align-items: center; padding-top: 102px; padding-bottom: 110px; min-height: 700px; }
.hero-copy { position: relative; z-index: 1; }
.eyebrow { margin: 0 0 21px; color: var(--lime); font-size: 11px; font-weight: 700; letter-spacing: .18em; }
.eyebrow-dot { width: 6px; height: 6px; display: inline-block; margin-right: 9px; border-radius: 50%; vertical-align: 1px; background: var(--lime); box-shadow: 0 0 0 5px rgba(217, 239, 101, .12); }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 720px; margin-bottom: 24px; color: var(--ink); font-size: var(--display); font-weight: 600; letter-spacing: -.045em; line-height: 1.04; }
.hero-lede { max-width: 500px; margin-bottom: 34px; color: var(--muted); font-size: 17px; line-height: 1.85; }
.hero-actions { display: flex; align-items: center; gap: 27px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 50px; padding: 0 20px; border: 1px solid transparent; font-size: 14px; font-weight: 700; transition: transform .2s ease, background .2s ease, color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: var(--navy); background: var(--lime); }
.button-primary:hover { background: #e8fa83; }
.text-link { color: var(--muted); font-size: 13px; }
.text-link span { color: var(--lime); margin-left: 8px; }
.text-link:hover { color: var(--ink); }
.hero-meta { display: flex; flex-wrap: wrap; gap: 19px; margin-top: 53px; color: var(--subtle); font-size: 11px; }
.meta-check { margin-right: 6px; color: var(--lime); font-style: normal; }

.hero-visual { position: relative; min-height: 500px; display: grid; place-items: center; }
.preview-glow { position: absolute; width: 74%; height: 72%; right: 5%; top: 15%; border-radius: 50%; background: rgba(105, 153, 125, .16); filter: blur(75px); }
.app-window { position: relative; z-index: 1; width: min(680px, 100%); overflow: hidden; border: 1px solid rgba(234, 242, 235, .2); background: #10191f; box-shadow: 26px 28px 0 rgba(217, 239, 101, .06), 0 22px 80px rgba(0, 0, 0, .4); transform: perspective(1500px) rotateY(-8deg) rotateX(2deg); }
.window-bar { display: flex; align-items: center; height: 37px; padding: 0 13px; border-bottom: 1px solid rgba(225, 237, 234, .1); background: #152027; color: #839197; font-size: 9px; }
.window-dots { display: flex; gap: 5px; width: 90px; }
.window-dots span { width: 6px; height: 6px; display: block; border-radius: 50%; background: #54636a; }
.window-dots span:first-child { background: #d4a878; }.window-dots span:nth-child(2) { background: #9ebf77; }.window-dots span:last-child { background: #6c8ea2; }
.window-title { flex: 1; text-align: center; letter-spacing: .08em; }
.window-status { display: inline-flex; align-items: center; gap: 5px; width: 90px; justify-content: flex-end; font-size: 8px; }
.window-status i { width: 5px; height: 5px; border-radius: 50%; background: var(--lime); }
.app-body { display: grid; grid-template-columns: 136px 1fr; min-height: 406px; }
.app-sidebar { position: relative; padding: 19px 13px; border-right: 1px solid rgba(225, 237, 234, .1); background: #131e24; }
.mini-brand { display: flex; align-items: center; gap: 7px; color: #f3f6ec; font-size: 12px; font-weight: 700; }.mini-brand img { width: 17px; height: 17px; }
.sidebar-rule { height: 1px; margin: 19px 0 18px; background: var(--line); }
.side-nav-item { display: flex; align-items: center; gap: 9px; height: 34px; padding: 0 9px; margin-bottom: 6px; color: #94a0a5; font-size: 10px; }.side-nav-item.active { color: var(--navy); background: var(--lime); }.side-nav-item.muted { color: #56656b; }
.nav-icon { width: 12px; height: 12px; display: inline-block; position: relative; }.grid-icon:before { content: ""; position: absolute; inset: 1px; border: 1px solid currentColor; box-shadow: 4px 0 currentColor, 0 4px currentColor, 4px 4px currentColor; }.table-icon:before { content: ""; position: absolute; inset: 1px 0; border: 1px solid currentColor; }.table-icon:after { content: ""; position: absolute; left: 3px; right: 3px; top: 5px; border-top: 1px solid currentColor; box-shadow: 0 3px currentColor; }.folder-icon:before { content: ""; position: absolute; inset: 3px 0 1px; border: 1px solid currentColor; border-radius: 1px; }.folder-icon:after { content: ""; position: absolute; left: 1px; top: 1px; width: 5px; height: 3px; border: 1px solid currentColor; border-bottom: 0; }
.side-sidebar-note { position: absolute; left: 22px; bottom: 22px; color: #4b5960; font-size: 7px; letter-spacing: .16em; line-height: 1.8; }
.app-content { padding: 24px 21px 17px; background: #19252c; }.app-content-head { display: flex; align-items: flex-start; justify-content: space-between; }.app-kicker { color: var(--lime); font-size: 7px; letter-spacing: .13em; }.app-content-head h2 { margin: 5px 0 3px; font-size: 19px; font-weight: 600; letter-spacing: -.03em; }.app-content-head p { margin: 0; color: #819096; font-size: 8px; }.workspace-pill { padding: 5px 7px; border: 1px solid rgba(217, 239, 101, .33); color: var(--lime); font-size: 7px; }
.stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin-top: 22px; }.stat-card { min-height: 86px; padding: 10px 9px; border: 1px solid rgba(236, 244, 237, .08); background: #1d2b32; }.stat-card span, .stat-card small { display: block; color: #8b999e; font-size: 7px; }.stat-card b { display: block; margin: 7px 0 3px; font-size: 22px; font-weight: 500; letter-spacing: -.04em; }.stat-card b.gold { color: var(--orange); }.stat-card b.teal { color: var(--teal); }.stat-card b.green { color: var(--lime); }
.content-panels { display: grid; grid-template-columns: 1.02fr .98fr; gap: 8px; margin-top: 9px; }.mock-panel { min-height: 190px; padding: 13px 12px; border: 1px solid rgba(236, 244, 237, .08); background: #1d2b32; }.panel-title { margin-bottom: 10px; }.panel-title b { display: block; font-size: 10px; font-weight: 600; }.panel-title small { display: block; margin-top: 3px; color: #7c8a90; font-size: 7px; }.quick-row, .activity-item { display: flex; align-items: center; gap: 8px; min-height: 39px; border-top: 1px solid rgba(236, 244, 237, .08); }.quick-row > span:nth-child(2), .activity-item > span:nth-child(2) { flex: 1; }.quick-row b, .activity-item b { display: block; color: #dde6df; font-size: 8px; font-weight: 500; }.quick-row small, .activity-item small { display: block; margin-top: 2px; color: #738188; font-size: 6px; }.quick-row em { color: #7a888c; font-size: 13px; font-style: normal; }.quick-icon { width: 18px; height: 18px; display: grid; place-items: center; color: #0f191e; font-size: 10px; }.quick-icon.blue { background: var(--blue); }.quick-icon.lime { background: var(--lime); }.quick-icon.orange { background: var(--orange); }.activity-dot { width: 6px; height: 6px; border-radius: 50%; }.green-dot { background: var(--lime); }.yellow-dot { background: var(--orange); }.blue-dot { background: var(--blue); }
.floating-note { position: absolute; z-index: 2; display: flex; align-items: center; gap: 9px; min-width: 128px; padding: 11px 13px; border: 1px solid rgba(235, 243, 235, .17); background: #172229; box-shadow: 0 12px 30px rgba(0, 0, 0, .26); }.floating-note b, .floating-note small { display: block; }.floating-note b { color: #e7ede7; font-size: 10px; font-weight: 600; }.floating-note small { margin-top: 3px; color: #809096; font-size: 8px; }.note-one { top: 8%; right: -4%; }.note-two { bottom: 8%; left: -4%; }.note-icon { width: 23px; height: 23px; display: grid; place-items: center; color: var(--navy); background: var(--lime); font-size: 13px; }.green-note { color: var(--navy); background: var(--teal); }

.signal-strip { display: flex; align-items: center; justify-content: space-between; padding: 22px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.signal-label { color: var(--subtle); font-size: 12px; }.signal-items { display: flex; align-items: center; gap: 17px; color: #d1d9d3; font-size: 12px; }.signal-items i, .download-details i { width: 3px; height: 3px; border-radius: 50%; background: var(--lime); }
.section { padding-top: 145px; padding-bottom: 145px; }.section-heading { max-width: 630px; margin-bottom: 53px; }.section-heading .eyebrow { margin-bottom: 16px; }.section-heading h2, .flow-intro h2, .download-copy h2 { margin-bottom: 17px; font-size: clamp(2.4rem, 4vw, 4.3rem); font-weight: 500; letter-spacing: -.045em; line-height: 1.08; }.section-heading > p:last-child, .flow-intro > p:last-child, .download-copy > p:last-child { color: var(--muted); font-size: 16px; line-height: 1.8; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }.feature-card { position: relative; min-height: 350px; padding: 31px 30px; overflow: hidden; border-top: 2px solid; background: var(--panel); }.feature-card:after { content: ""; position: absolute; right: -43px; top: -43px; width: 130px; height: 130px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 50%; box-shadow: 0 0 0 20px rgba(255, 255, 255, .02), 0 0 0 40px rgba(255, 255, 255, .015); }.feature-card-blue { border-color: var(--blue); }.feature-card-lime { border-color: var(--lime); }.feature-card-orange { border-color: var(--orange); }.feature-number { color: var(--subtle); font-size: 12px; letter-spacing: .14em; }.feature-icon { width: 48px; height: 48px; display: grid; place-items: center; margin: 44px 0 24px; background: #22323a; }.feature-card-blue .feature-icon { color: var(--blue); }.feature-card-lime .feature-icon { color: var(--lime); }.feature-card-orange .feature-icon { color: var(--orange); }.icon-table { width: 20px; height: 17px; border: 2px solid currentColor; position: relative; }.icon-table:after { content: ""; position: absolute; top: 4px; left: 0; right: 0; border-top: 2px solid currentColor; box-shadow: 0 5px currentColor; }.icon-import { position: relative; width: 19px; height: 21px; border: 2px solid currentColor; border-top: 0; }.icon-import:before { content: "↑"; position: absolute; left: 2px; top: -11px; font-size: 18px; }.icon-receive { position: relative; width: 21px; height: 21px; border: 2px solid currentColor; border-radius: 50%; }.icon-receive:before, .icon-receive:after { content: ""; position: absolute; background: currentColor; }.icon-receive:before { width: 9px; height: 2px; left: 4px; top: 8px; }.icon-receive:after { width: 2px; height: 9px; left: 8px; top: 4px; }.feature-card h3 { margin-bottom: 12px; font-size: 25px; font-weight: 500; letter-spacing: -.03em; }.feature-card p { max-width: 290px; margin-bottom: 26px; color: var(--muted); font-size: 13px; line-height: 1.8; }.feature-tag { color: var(--subtle); font-size: 10px; letter-spacing: .08em; }

.flow-section { background: #d9ef65; color: var(--navy); }.flow-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 10%; align-items: center; }.flow-intro .eyebrow { color: #53690d; }.flow-intro h2 { color: var(--navy); }.flow-intro h2 em { color: #597410; font-style: normal; }.flow-intro > p:last-child { max-width: 390px; color: #53611f; }.flow-list { border-top: 1px solid rgba(16, 24, 32, .25); }.flow-step { display: grid; grid-template-columns: 50px 1fr 24px; gap: 17px; align-items: center; padding: 23px 0; border-bottom: 1px solid rgba(16, 24, 32, .25); }.flow-step > span { color: #6a7d24; font-size: 12px; letter-spacing: .12em; }.flow-step b, .flow-step small { display: block; }.flow-step b { font-size: 16px; font-weight: 600; }.flow-step small { margin-top: 3px; color: #627021; font-size: 12px; }.flow-step i { color: #53690d; font-size: 19px; font-style: normal; text-align: right; }

.download-section { display: grid; grid-template-columns: 1fr 420px; gap: 12%; align-items: center; padding-top: 150px; padding-bottom: 150px; }.download-copy h2 { font-size: clamp(2.7rem, 4.5vw, 4.8rem); }.download-details { display: flex; align-items: center; gap: 12px; margin-top: 27px; color: var(--subtle); font-size: 11px; }.download-details i { background: var(--orange); }.download-box { padding: 27px; border: 1px solid rgba(236, 244, 237, .15); background: var(--panel); }.download-box-head { display: flex; align-items: center; gap: 13px; margin-bottom: 25px; }.download-symbol { width: 38px; height: 38px; display: grid; place-items: center; background: var(--lime); color: var(--navy); font-size: 21px; }.download-box-head b, .download-box-head small { display: block; }.download-box-head b { font-size: 18px; font-weight: 500; }.download-box-head small { margin-top: 3px; color: var(--subtle); font-size: 11px; }.select-label { display: block; margin-bottom: 8px; color: var(--subtle); font-size: 11px; }.select-wrap { position: relative; margin-bottom: 13px; }.select-wrap select { width: 100%; height: 49px; appearance: none; border: 1px solid rgba(235, 242, 237, .2); border-radius: 0; outline: 0; padding: 0 43px 0 14px; color: var(--ink); background: #202e35; font-size: 14px; cursor: pointer; }.select-wrap select:focus { border-color: var(--lime); }.select-wrap > span { position: absolute; top: 13px; right: 16px; color: var(--lime); pointer-events: none; }.button-download { width: 100%; color: var(--navy); background: var(--lime); }.button-download:hover { background: #e8fa83; }.download-footnote { margin: 14px 0 0; color: var(--subtle); font-size: 10px; text-align: center; }
.site-footer { border-top: 1px solid var(--line); }.footer-inner { min-height: 85px; display: flex; align-items: center; justify-content: space-between; color: var(--subtle); font-size: 11px; }.footer-brand { display: flex; align-items: center; gap: 8px; color: var(--ink); font-size: 14px; font-weight: 600; }.footer-brand img { width: 20px; height: 20px; }.footer-inner a { color: var(--muted); }

@media (max-width: 1050px) { .hero { grid-template-columns: 1fr; padding-top: 80px; }.hero-copy { max-width: 760px; }.hero-visual { max-width: 760px; width: 100%; justify-self: center; }.download-section { gap: 7%; } }
@media (max-width: 720px) { .container { width: min(100% - 36px, 560px); }.header-inner { min-height: 70px; gap: 15px; }.brand { min-width: auto; }.main-nav { display: none; }.header-cta { margin-left: auto; padding: 8px 10px; font-size: 11px; }.hero { min-height: auto; padding-top: 67px; padding-bottom: 73px; gap: 55px; }.hero-lede { font-size: 15px; }.hero-meta { gap: 10px 17px; margin-top: 37px; }.hero-visual { min-height: 342px; }.app-window { transform: none; }.app-body { grid-template-columns: 85px 1fr; min-height: 270px; }.app-sidebar { padding: 14px 8px; }.mini-brand span, .side-sidebar-note { display: none; }.mini-brand { justify-content: center; }.sidebar-rule { margin: 14px 0; }.side-nav-item { justify-content: center; padding: 0; font-size: 0; }.side-nav-item .nav-icon { transform: scale(.9); }.app-content { padding: 15px 10px 11px; }.app-content-head h2 { font-size: 14px; }.workspace-pill { display: none; }.stats-row { gap: 4px; margin-top: 15px; }.stat-card { min-height: 65px; padding: 7px 6px; }.stat-card b { margin: 4px 0 2px; font-size: 16px; }.stat-card span, .stat-card small { font-size: 6px; }.content-panels { gap: 4px; margin-top: 5px; }.mock-panel { min-height: 132px; padding: 8px 7px; }.panel-title { margin-bottom: 5px; }.panel-title b { font-size: 8px; }.panel-title small { font-size: 5px; }.quick-row, .activity-item { min-height: 27px; gap: 4px; }.quick-row b, .activity-item b { font-size: 6px; }.quick-row small, .activity-item small { font-size: 5px; }.quick-icon { width: 13px; height: 13px; font-size: 7px; }.floating-note { min-width: 102px; padding: 7px; gap: 6px; }.floating-note b { font-size: 8px; }.floating-note small { font-size: 6px; }.note-one { right: -4%; top: 2%; }.note-two { left: -4%; bottom: 2%; }.note-icon { width: 18px; height: 18px; font-size: 10px; }.signal-strip { display: block; padding: 18px 0; }.signal-items { margin-top: 12px; gap: 12px; font-size: 10px; }.section { padding-top: 87px; padding-bottom: 87px; }.section-heading { margin-bottom: 35px; }.section-heading h2, .flow-intro h2 { font-size: 2.55rem; }.section-heading > p:last-child, .flow-intro > p:last-child, .download-copy > p:last-child { font-size: 14px; }.feature-grid { grid-template-columns: 1fr; gap: 10px; }.feature-card { min-height: 290px; padding: 25px; }.feature-icon { margin: 27px 0 20px; }.feature-card h3 { font-size: 23px; }.flow-layout { grid-template-columns: 1fr; gap: 44px; }.flow-step { grid-template-columns: 32px 1fr 20px; gap: 11px; }.flow-step b { font-size: 14px; }.flow-step small { font-size: 11px; }.download-section { grid-template-columns: 1fr; gap: 42px; padding-top: 90px; padding-bottom: 90px; }.download-copy h2 { font-size: 2.9rem; }.download-box { padding: 20px; }.footer-inner { min-height: 100px; flex-wrap: wrap; gap: 7px 15px; padding: 20px 0; }.footer-inner > span { order: 3; width: 100%; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *:before, *:after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }