:root {
  color-scheme: dark;
  --ink: #f3efe7;
  --muted: #b4b8aa;
  --quiet: #798176;
  --bg: #0c1715;
  --surface: #12221f;
  --surface-2: #182b26;
  --line: rgba(222, 236, 218, .14);
  --orange: #f3a15d;
  --orange-soft: #ffd6a7;
  --green: #9ed6a7;
  --max: 1180px;
  font-family: "Segoe UI Variable", "Noto Sans SC", "Microsoft YaHei", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--ink); background: var(--bg); font-size: 16px; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
.section-shell { width: min(var(--max), calc(100% - 56px)); margin: 0 auto; }
.site-header { width: min(var(--max), calc(100% - 56px)); height: 82px; margin: auto; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; gap: 10px; align-items: center; color: var(--ink); font-size: 20px; font-weight: 700; letter-spacing: -.04em; }
.brand-mark { display: inline-grid; width: 31px; height: 31px; place-items: center; color: var(--green); }
.brand-mark svg { width: 100%; height: 100%; }
.site-nav { display: flex; align-items: center; gap: 29px; color: var(--muted); font-size: 14px; }
.site-nav a { transition: color .2s ease; }
.site-nav a:hover, .site-nav a:focus-visible { color: var(--ink); }
.nav-cta { padding: 8px 13px; border: 1px solid var(--line); border-radius: 100px; color: var(--ink) !important; }
.menu-toggle { display: none; border: 1px solid var(--line); border-radius: 99px; padding: 7px 12px; color: var(--ink); background: transparent; font: inherit; }
.hero { min-height: 620px; display: grid; grid-template-columns: 1fr .93fr; align-items: center; gap: 72px; padding: 62px 0 74px; }
.eyebrow { margin: 0 0 16px; color: var(--orange); font-size: 11px; font-weight: 750; letter-spacing: .16em; }
.eyebrow-dot { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(158, 214, 167, .12); }
h1, h2, h3, p { margin-top: 0; }
code { padding: 2px 5px; border-radius: 4px; color: var(--orange-soft); background: rgba(243, 161, 93, .1); font: .9em ui-monospace, SFMono-Regular, Consolas, monospace; }
h1 { max-width: 570px; margin-bottom: 20px; font-size: clamp(48px, 6vw, 76px); line-height: 1.04; letter-spacing: -.07em; }
h1 em { color: var(--orange-soft); font-style: normal; }
.hero-lede { max-width: 550px; margin-bottom: 29px; color: var(--muted); font-size: 18px; line-height: 1.8; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-bottom: 18px; }
.button { display: inline-flex; min-height: 45px; align-items: center; justify-content: center; gap: 10px; padding: 10px 19px; border: 1px solid transparent; border-radius: 8px; font-size: 14px; font-weight: 700; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.button:hover, .button:focus-visible { transform: translateY(-2px); }
.button-primary { color: #19201b; background: var(--orange); }
.button-primary:hover, .button-primary:focus-visible { background: #ffc180; }
.button-secondary { border-color: var(--line); color: var(--ink); background: rgba(255, 255, 255, .02); }
.button-secondary:hover, .button-secondary:focus-visible { border-color: rgba(243, 161, 93, .6); background: rgba(243, 161, 93, .08); }
.hero-note { color: var(--quiet); font-size: 12px; }
.hero-note span { color: var(--green); }
.hero-visual { position: relative; min-height: 410px; display: grid; place-items: center; }
.visual-glow { position: absolute; width: 360px; height: 360px; border-radius: 50%; background: rgba(81, 143, 107, .13); filter: blur(18px); }
.terminal-card { position: relative; z-index: 1; width: min(420px, 86%); margin-right: 50px; overflow: hidden; border: 1px solid rgba(190, 223, 186, .2); border-radius: 14px; background: #101a18; box-shadow: 0 30px 75px rgba(0, 0, 0, .35); transform: rotate(-4deg); }
.window-bar { display: flex; height: 37px; align-items: center; gap: 6px; padding: 0 14px; border-bottom: 1px solid var(--line); color: var(--quiet); font: 10px/1.2 ui-monospace, monospace; }
.window-bar span { width: 6px; height: 6px; border-radius: 50%; background: #d4825b; }.window-bar span:nth-child(2) { background: #d1b270; }.window-bar span:nth-child(3) { background: #77b98a; }.window-bar b { margin-left: 9px; font-weight: 400; }
.terminal-body { padding: 26px 26px 22px; font: 13px/1.8 ui-monospace, SFMono-Regular, Consolas, monospace; }.terminal-body p { margin-bottom: 16px; }.terminal-muted { color: #74837b; }.terminal-green { color: var(--green); }.terminal-prompt { margin-right: 9px; color: var(--orange); }.terminal-line { display: flex; align-items: center; margin: 12px 0; }.terminal-block { display: block; height: 7px; border-radius: 6px; background: #648b75; opacity: .82; }.block-a { width: 63%; }.block-b { width: 48%; }.block-c { width: 72%; }.terminal-foot { display: flex; align-items: center; justify-content: space-between; margin: 26px 0 0 !important; padding-top: 15px; border-top: 1px solid var(--line); font-size: 10px; }.signal-bars { display: inline-flex; align-items: end; gap: 2px; }.signal-bars i { display: block; width: 3px; height: 5px; background: var(--green); }.signal-bars i:nth-child(2) { height: 8px; }.signal-bars i:nth-child(3) { height: 11px; }
.phone-card { position: absolute; z-index: 2; right: 7px; bottom: 37px; width: 155px; height: 300px; padding: 8px; border: 1px solid rgba(243, 161, 93, .55); border-radius: 27px; background: #152420; box-shadow: 0 24px 55px rgba(0, 0, 0, .45); transform: rotate(8deg); }.phone-speaker { width: 38px; height: 5px; margin: 3px auto 9px; border-radius: 99px; background: #263e35; }.phone-screen { height: 262px; padding: 13px 11px; border-radius: 20px; background: #0e1917; }.phone-topline { display: flex; justify-content: space-between; color: var(--muted); font-size: 8px; }.phone-live { color: var(--green); font-size: 7px; letter-spacing: .12em; }.phone-project { margin: 28px 0 15px; color: var(--orange-soft); font-size: 11px; font-weight: 700; }.phone-project small { color: var(--green); }.phone-message { padding: 9px; border: 1px solid rgba(243, 161, 93, .22); border-radius: 8px; color: var(--ink); background: rgba(243, 161, 93, .1); font-size: 9px; line-height: 1.6; }.phone-response { display: grid; gap: 7px; margin-top: 18px; }.response-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); }.response-line { display: block; height: 5px; border-radius: 5px; background: #516e60; }.line-long { width: 88%; }.line-short { width: 63%; }.connection-label { position: absolute; right: 10px; bottom: 0; color: var(--green); font-size: 11px; }.connection-label span { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: var(--green); }
.trust-strip { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 140px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.trust-strip div { display: flex; flex-direction: column; gap: 3px; padding: 22px 28px; border-right: 1px solid var(--line); }.trust-strip div:first-child { padding-left: 0; }.trust-strip div:last-child { border: 0; }.trust-strip strong { color: var(--ink); font-size: 13px; }.trust-strip span { color: var(--quiet); font-size: 12px; }
.content-section, .downloads-section, .faq-section { padding-bottom: 145px; }.section-heading { max-width: 650px; margin-bottom: 45px; }.section-heading h2, .download-heading h2 { margin-bottom: 15px; font-size: clamp(32px, 4vw, 52px); line-height: 1.12; letter-spacing: -.06em; }.section-heading > p:last-child, .download-heading > div > p:last-child { color: var(--muted); font-size: 16px; }
.feature-grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 14px; }.feature-card { min-height: 280px; padding: 26px; border: 1px solid var(--line); border-radius: 11px; background: linear-gradient(145deg, rgba(31, 59, 50, .55), rgba(14, 28, 25, .7)); }.feature-card-large { display: grid; grid-template-columns: 1.1fr .9fr; gap: 8px; }.feature-number { display: block; margin-bottom: 35px; color: var(--orange); font: 12px/1 ui-monospace, monospace; }.feature-card h3 { margin-bottom: 9px; font-size: 20px; letter-spacing: -.04em; }.feature-card p { color: var(--muted); font-size: 14px; line-height: 1.75; }.feature-visual { grid-row: 1 / span 3; }.local-visual { position: relative; display: grid; place-items: center; min-height: 200px; overflow: hidden; }.orbit { position: absolute; display: block; border: 1px solid rgba(158, 214, 167, .35); border-radius: 50%; }.orbit-one { width: 174px; height: 174px; }.orbit-two { width: 115px; height: 115px; border-color: rgba(243, 161, 93, .38); transform: rotate(45deg) scaleY(.7); }.local-core { position: relative; z-index: 1; display: grid; width: 88px; height: 88px; place-items: center; border: 1px solid rgba(243, 161, 93, .58); border-radius: 50%; color: var(--orange-soft); background: rgba(243, 161, 93, .1); font: 700 13px/1.2 ui-monospace, monospace; text-align: center; }.local-core small { color: var(--muted); font-size: 7px; font-weight: 400; }.mini-devices { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 30px; color: var(--orange-soft); font-size: 28px; }.mini-link { color: var(--green); font-size: 17px; }.route-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 29px; }.route-pills span { padding: 5px 8px; border: 1px solid var(--line); border-radius: 99px; color: var(--green); font-size: 10px; }
.steps-section { padding: 107px 0 130px; background: #111f1c; }.section-heading-split { display: grid; grid-template-columns: 1fr .7fr; gap: 60px; max-width: 900px; align-items: end; }.section-heading-split > p { margin-bottom: 0; }.steps-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; padding: 0; margin: 0; list-style: none; }.steps-list li { position: relative; min-height: 190px; padding: 20px 28px 0 0; border-top: 1px solid var(--line); }.steps-list li + li { padding-left: 28px; border-left: 1px solid var(--line); }.step-index { display: inline-grid; width: 28px; height: 28px; margin-bottom: 20px; place-items: center; border: 1px solid rgba(243, 161, 93, .55); border-radius: 50%; color: var(--orange); font: 12px/1 ui-monospace, monospace; }.steps-list h3 { margin-bottom: 8px; font-size: 18px; }.steps-list p { max-width: 260px; margin: 0; color: var(--muted); font-size: 13px; }.step-arrow, .step-check { position: absolute; top: 18px; right: 25px; color: var(--quiet); font-size: 25px; }.step-check { color: var(--green); }
.download-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 45px; }.download-heading > div { max-width: 650px; }.release-badge { padding: 8px 12px; border: 1px solid rgba(158, 214, 167, .3); border-radius: 99px; color: var(--green); font-size: 11px; white-space: nowrap; }.download-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }.download-card { padding: 29px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }.download-card-primary { border-color: rgba(243, 161, 93, .42); background: linear-gradient(145deg, rgba(74, 51, 36, .42), var(--surface)); }.download-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 28px; }.platform-icon { display: inline-grid; width: 42px; height: 42px; place-items: center; border-radius: 11px; font-size: 22px; }.platform-windows { color: var(--orange-soft); background: rgba(243, 161, 93, .13); }.platform-android { color: var(--green); background: rgba(158, 214, 167, .12); }.platform-label { color: var(--quiet); font: 10px ui-monospace, monospace; letter-spacing: .14em; }.download-card h3 { margin-bottom: 8px; font-size: 21px; }.download-card p { min-height: 51px; color: var(--muted); font-size: 14px; }.download-meta { display: flex; gap: 8px; align-items: center; margin-bottom: 20px; color: var(--quiet); font: 11px ui-monospace, monospace; }.button-wide { width: 100%; }.checksum-link { display: block; margin-top: 15px; color: var(--muted); font-size: 11px; text-decoration: underline; text-decoration-color: rgba(180, 184, 170, .35); text-underline-offset: 3px; }.checksum-link:hover, .checksum-link:focus-visible { color: var(--orange-soft); }.download-footnote { margin: 20px 0 0; color: var(--quiet); font-size: 12px; }.download-footnote span { color: var(--orange); }
.faq-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 11px; }.faq-grid details { padding: 21px 22px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255, 255, 255, .02); }.faq-grid summary { cursor: pointer; color: var(--ink); font-weight: 650; list-style: none; }.faq-grid summary::-webkit-details-marker { display: none; }.faq-grid summary::after { float: right; color: var(--orange); content: "+"; font-size: 20px; font-weight: 400; line-height: 1; }.faq-grid details[open] summary::after { content: "−"; }.faq-grid details p { margin: 13px 0 0; color: var(--muted); font-size: 13px; }
.site-footer { border-top: 1px solid var(--line); }.footer-inner { display: flex; min-height: 95px; align-items: center; gap: 25px; }.footer-copy { color: var(--quiet); font-size: 12px; }.footer-copy:last-child { margin-left: auto; }.noscript-note { position: fixed; right: 16px; bottom: 16px; z-index: 5; max-width: 320px; padding: 12px 15px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: var(--surface); font-size: 12px; }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; }
@media (max-width: 900px) { .hero { grid-template-columns: 1fr; gap: 22px; padding-top: 45px; }.hero-copy { max-width: 680px; }.hero-visual { min-height: 390px; max-width: 620px; }.feature-grid { grid-template-columns: 1fr 1fr; }.feature-card-large { grid-column: 1 / -1; }.section-heading-split { gap: 30px; }.site-nav { gap: 17px; } }
@media (max-width: 650px) { .section-shell, .site-header { width: min(var(--max), calc(100% - 36px)); }.site-header { height: 70px; }.menu-toggle { display: block; }.site-nav { position: absolute; top: 63px; right: 18px; left: 18px; z-index: 10; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 8px; border: 1px solid var(--line); border-radius: 11px; background: #13221f; box-shadow: 0 15px 35px rgba(0, 0, 0, .35); }.site-nav.is-open { display: flex; }.site-nav a { padding: 10px 12px; }.nav-cta { margin-top: 5px; text-align: center; }.hero { min-height: auto; padding: 50px 0 62px; }.hero-lede { font-size: 16px; }.hero-actions { flex-direction: column; align-items: stretch; }.hero-visual { min-height: 340px; margin-top: 14px; transform: scale(.92); transform-origin: left center; }.terminal-card { margin-right: 25px; }.phone-card { right: 0; bottom: 22px; }.trust-strip { grid-template-columns: 1fr; margin-bottom: 95px; }.trust-strip div, .trust-strip div:first-child { padding: 17px 0; border-right: 0; border-bottom: 1px solid var(--line); }.content-section, .downloads-section, .faq-section { padding-bottom: 95px; }.feature-grid, .download-grid, .faq-grid, .steps-list { grid-template-columns: 1fr; }.feature-card-large { grid-column: auto; display: block; }.feature-visual { margin-top: 16px; }.section-heading-split { display: block; }.section-heading-split > p { margin-top: 17px; }.steps-section { padding: 75px 0 85px; }.steps-list li, .steps-list li + li { min-height: auto; padding: 20px 35px 26px 0; border-left: 0; border-right: 0; }.steps-list li + li { padding-left: 0; }.step-arrow, .step-check { right: 4px; }.download-heading { display: block; }.release-badge { display: inline-block; margin-top: 18px; }.download-card { padding: 24px; }.footer-inner { flex-wrap: wrap; gap: 10px 20px; padding: 22px 0; }.footer-copy:last-child { width: 100%; margin-left: 0; }.footer-copy { font-size: 11px; } }
