:root {
  --ink: #f8f6f7;
  --muted: #aaa3a7;
  --surface: #0b090a;
  --line: rgba(255, 255, 255, .11);
  --red: #df2a38;
  --pink: #a70f43;
  --font-geist-sans: "Segoe UI", Inter, Arial, sans-serif;
  --font-geist-mono: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 72% 8%, rgba(199, 25, 69, .12), transparent 30rem),
    #080607;
  font-family: var(--font-geist-sans), Arial, sans-serif;
}
a { color: inherit; text-decoration: none; }
.shell { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }

.nav { height: 88px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: relative; z-index: 20; }
.brand { display: flex; align-items: center; gap: 11px; font-size: 25px; font-weight: 760; letter-spacing: -.04em; }
.brand img { width: 37px; height: 37px; border-radius: 9px; }
.navLinks { position: absolute; left: 50%; transform: translateX(-50%); display: flex; gap: 34px; color: #9d979a; font-size: 14px; }
.navLinks a { transition: color .2s; }
.navLinks a:hover, .navLinks .active { color: #fff; }
.navLinks .active::after { content: ''; display: block; width: 16px; height: 2px; margin: 7px auto 0; background: var(--red); border-radius: 3px; }
.navCta { padding: 11px 17px; border: 1px solid rgba(255,255,255,.18); border-radius: 10px; font-size: 13px; font-weight: 650; background: rgba(255,255,255,.04); transition: background .2s, border-color .2s; }
.navCta:hover { background: rgba(255,255,255,.09); border-color: rgba(255,255,255,.3); }

.hero { min-height: 700px; display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: 48px; padding-block: 74px 84px; }
.eyebrow { color: #b6afb2; font-size: 12px; text-transform: uppercase; letter-spacing: .13em; display: flex; align-items: center; gap: 9px; margin-bottom: 26px; }
.eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: var(--red); box-shadow: 0 0 18px var(--red); }
.eyebrow b { font-weight: inherit; }
.hero h1 { margin: 0; font-size: clamp(54px, 6.3vw, 91px); line-height: .93; letter-spacing: -.075em; font-weight: 750; }
.hero h1 em { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.55); font-style: normal; }
.heroCopy > p { color: var(--muted); line-height: 1.7; font-size: 16px; max-width: 500px; margin: 29px 0 31px; }
.heroActions { display: flex; align-items: center; gap: 27px; }
.primaryButton { display: flex; align-items: center; gap: 29px; padding: 14px 17px 14px 20px; background: linear-gradient(135deg, #e52c3a, #ad1045); border-radius: 9px; font-size: 14px; font-weight: 720; box-shadow: 0 15px 38px rgba(202, 25, 59, .22); transition: transform .2s, box-shadow .2s; }
.primaryButton:hover { transform: translateY(-2px); box-shadow: 0 18px 45px rgba(202, 25, 59, .34); }
.primaryButton span { font-size: 18px; }
.textButton { color: #c6bfc2; font-size: 14px; }
.textButton span { margin-left: 7px; transition: margin .2s; }
.textButton:hover span { margin-left: 12px; }
.platforms { display: flex; align-items: center; gap: 10px; color: #625d60; font-size: 11px; margin-top: 38px; text-transform: uppercase; letter-spacing: .08em; }
.platforms i { width: 3px; height: 3px; border-radius: 50%; background: #514c4f; }

.codeCanvas { --mx: 50%; --my: 50%; position: relative; height: 540px; border-radius: 32px; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 32px 32px; isolation: isolate; overflow: hidden; }
.codeCanvas::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at center, transparent 20%, #080607 82%); z-index: -1; }
.cursorGlow { position: absolute; width: 330px; height: 330px; left: var(--mx); top: var(--my); transform: translate(-50%,-50%); background: radial-gradient(circle, rgba(226,42,59,.13), transparent 67%); pointer-events: none; transition: left .08s linear, top .08s linear; }
.codeCard { position: absolute; width: min(445px, 78%); left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-1deg); border: 1px solid rgba(255,255,255,.13); border-radius: 18px; background: rgba(17,13,15,.9); box-shadow: 0 32px 80px rgba(0,0,0,.5); backdrop-filter: blur(18px); overflow: hidden; z-index: 4; }
.codeBar { height: 48px; border-bottom: 1px solid var(--line); display: flex; align-items: center; padding: 0 17px; gap: 7px; }
.dot { width: 7px; height: 7px; border-radius: 50%; }.red { background:#ff5d68 }.amber{background:#f8bd48}.green{background:#34c77b}
.filename { margin-left: 9px; color: #777175; font: 11px var(--font-geist-mono); }
.codeCard pre { margin: 0; padding: 27px 30px 19px; min-height: 280px; font: 14px/1.72 var(--font-geist-mono); color: #d7d1d4; }
.codeCard pre span { display: inline; }.codeCard .soft { color:#90888d }.codeCard .string{color:#ef6f7d}.codeCard .accent{color:#ff4358;font-weight:700}
.running { display: flex; align-items: center; gap: 8px; margin: 0 22px 20px; padding: 10px 12px; border-radius: 8px; background: rgba(39, 194, 113, .08); color: #7edaa9; font: 10px var(--font-geist-mono); }
.running span { width: 6px; height: 6px; border-radius:50%; background:#42d687; box-shadow:0 0 11px #42d687; }
.node { position: absolute; z-index: 5; display: flex; flex-direction: column; padding: 10px 14px; min-width: 88px; border: 1px solid rgba(255,255,255,.13); border-radius: 11px; background: rgba(16,12,14,.88); box-shadow: 0 14px 38px rgba(0,0,0,.35); animation: float 5s ease-in-out infinite; }
.node b { font: 12px var(--font-geist-mono); color:#f35b6b }.node small { color:#716b6e; font-size:9px; margin-top:3px }
.nodeA{left:3%;top:12%}.nodeB{right:1%;top:20%;animation-delay:-1s}.nodeC{left:1%;bottom:15%;animation-delay:-2s}.nodeD{right:3%;bottom:10%;animation-delay:-3s}
.connector { position:absolute; height:1px; background:linear-gradient(90deg, transparent, rgba(220,40,68,.42), transparent); transform-origin:left; z-index:1 }.connectorA{width:180px;left:15%;top:25%;transform:rotate(23deg)}.connectorB{width:210px;right:8%;top:33%;transform:rotate(148deg)}.connectorC{width:230px;left:13%;bottom:24%;transform:rotate(-16deg)}
.orbit { position:absolute; border:1px solid rgba(218,35,67,.12); border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%); animation: pulse 5s ease-in-out infinite }.orbitOne{width:420px;height:420px}.orbitTwo{width:550px;height:550px;animation-delay:-2.5s}
@keyframes float { 50% { transform: translateY(-7px); } }
@keyframes pulse { 50% { opacity:.35; transform:translate(-50%,-50%) scale(1.03) } }

.manifesto { padding: 112px 0 130px; border-top: 1px solid var(--line); }
.sectionLabel { color: #716b6e; font: 11px var(--font-geist-mono); letter-spacing: .16em; }
.manifesto h2 { font-size: clamp(40px,5vw,68px); letter-spacing:-.055em; line-height:1.03; margin:22px 0 70px; }.manifesto h2 span{color:#777074}
.featureGrid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.featureGrid article { background:#080607; padding:31px; min-height:240px; }.featureGrid strong{color:#6f696c;font:10px var(--font-geist-mono)}.featureGrid h3{font-size:20px;margin:51px 0 13px}.featureGrid p{color:#8f888c;font-size:14px;line-height:1.65;margin:0}

.footer { min-height: 112px; display:flex; align-items:center; justify-content:space-between; gap:40px; border-top:1px solid var(--line); color:#686165; font:11px var(--font-geist-mono); }
.footerIdentity { display:flex; align-items:baseline; gap:18px; }
.footerIdentity strong { color:#c9c2c5; font-size:12px; }
.footerIdentity span { color:#686165; }
.footerLinks { display:flex; align-items:center; gap:22px; }
.footerLinks > span { color:#4f494c; font-size:9px; letter-spacing:.14em; }
.footerLinks a { color:#8d868a; transition:color .2s; }
.footerLinks a:hover { color:#fff; }
.footerLinks b { color:#d83a4c; font-weight:400; margin-left:3px; }

/* Documentation */
.docsHero { padding: 98px 0 86px; border-bottom: 1px solid var(--line); }
.docsHero h1, .downloadHero h1 { margin: 18px 0 26px; font-size: clamp(50px, 6vw, 82px); line-height: .98; letter-spacing: -.065em; }
.docsHero h1 span, .downloadHero h1 span { color:#777074; }
.docsHero > p:last-child { max-width: 680px; color:var(--muted); font-size:16px; line-height:1.7; }
code { font-family: var(--font-geist-mono); }
.docsHero code, .docsContent p code, .downloadHero code { color:#f36a78; background:rgba(223,42,56,.09); border:1px solid rgba(223,42,56,.15); border-radius:5px; padding:2px 5px; font-size:.87em; }
.docsLayout { display:grid; grid-template-columns: 205px 1fr; gap:90px; padding-block:80px 130px; align-items:start; }
.docsRail { position:sticky; top:32px; display:flex; flex-direction:column; gap:15px; padding-left:17px; border-left:1px solid var(--line); }
.docsRail span { color:#5f595c; font:9px var(--font-geist-mono); letter-spacing:.14em; margin-bottom:8px; }
.docsRail a { color:#817a7e; font-size:12px; transition:color .2s, transform .2s; }
.docsRail a:hover { color:#fff; transform:translateX(3px); }
.docsContent { max-width:780px; min-width:0; }
.docsContent section { scroll-margin-top:35px; padding:0 0 80px; margin-bottom:80px; border-bottom:1px solid var(--line); }
.docsContent section:last-child { border:0; margin:0; padding-bottom:0; }
.docNumber { color:#dc394b; font:10px var(--font-geist-mono); letter-spacing:.12em; }
.docsContent h2 { font-size:34px; letter-spacing:-.04em; margin:9px 0 17px; }
.docsContent > section > p { color:#a9a1a5; line-height:1.75; margin:0 0 25px; }
.docsContent pre { overflow:auto; margin:25px 0 0; padding:25px 27px; border:1px solid var(--line); border-radius:12px; background:linear-gradient(135deg,rgba(255,255,255,.025),transparent),#0d0a0b; box-shadow:0 20px 55px rgba(0,0,0,.23); }
.docsContent pre code { color:#d9d2d5; font-size:13px; line-height:1.72; }
.comparisonTable { border:1px solid var(--line); border-radius:12px; overflow:hidden; margin:29px 0; }
.comparisonRow { display:grid; grid-template-columns:100px 90px 1fr; min-height:57px; align-items:center; border-bottom:1px solid var(--line); padding:0 18px; }
.comparisonRow:last-child { border:0; }.comparisonRow code{color:#f35b6b;font-size:12px}.comparisonRow span{color:#747074;font:11px var(--font-geist-mono)}.comparisonRow p{color:#989195;font-size:12px;margin:0}
.docNote { margin-top:22px; padding:18px 20px; border-left:2px solid var(--red); background:rgba(223,42,56,.065); color:#938b8f; font-size:13px; line-height:1.6; }.docNote strong{color:#e7e1e3}

/* Download */
.downloadHero { min-height:405px; padding:90px 0 72px; display:grid; grid-template-columns:1.35fr .65fr; align-items:end; gap:70px; border-bottom:1px solid var(--line); }
.downloadHero h1 { margin-bottom:0; }.downloadHero > p{color:#a29a9e;line-height:1.75;margin:0 0 9px}
.downloadSection { padding-block:76px 125px; }
.downloadCard { display:grid; grid-template-columns:260px 1fr; min-height:390px; border:1px solid var(--line); border-radius:20px; overflow:hidden; background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.008)); }
.downloadIcon { display:grid; place-items:center; border-right:1px solid var(--line); background:radial-gradient(circle,rgba(222,39,62,.18),transparent 61%),#0d090b; }
.downloadIcon img { width:130px; height:130px; border-radius:28px; box-shadow:0 30px 80px rgba(209,27,59,.22); }
.downloadInfo { padding:50px 55px; }.downloadInfo h2{font-size:39px;letter-spacing:-.045em;margin:12px 0 7px}.downloadInfo>p:not(.sectionLabel){color:#8c8589;font-size:13px;margin:0}
.downloadSelectors { display:flex; gap:13px; margin:31px 0 26px; }
.downloadSelectors label { display:flex; flex-direction:column; gap:8px; color:#676164; font:9px var(--font-geist-mono); text-transform:uppercase; letter-spacing:.1em; }
.downloadSelectors select { min-width:170px; color:#e3dde0; background:#110e0f; border:1px solid rgba(255,255,255,.15); border-radius:8px; padding:11px 34px 11px 12px; font:12px var(--font-geist-sans); }
.downloadButton { display:inline-flex; align-items:center; gap:55px; color:#fff; padding:14px 19px; border-radius:9px; background:linear-gradient(135deg,#e52c3a,#a80e43); box-shadow:0 16px 38px rgba(202,25,59,.22); font-size:14px;font-weight:700;transition:transform .2s,box-shadow .2s}.downloadButton:hover{transform:translateY(-2px);box-shadow:0 20px 45px rgba(202,25,59,.34)}.downloadButton span{font-size:18px}
.afterInstall { display:flex; align-items:center; justify-content:space-between; gap:30px; margin-top:18px; padding:25px 30px; border:1px solid rgba(223,42,56,.22); border-radius:14px; background:rgba(223,42,56,.055); }.afterInstall h3{font-size:19px;margin:8px 0 4px}.afterInstall p{color:#8c8589;font-size:13px;margin:0}.afterInstall>a{white-space:nowrap;border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:11px 14px;font-size:12px}.afterInstall>a span{margin-left:10px}.stepBadge{color:#de3a4c;font:9px var(--font-geist-mono);letter-spacing:.12em}
.installSteps { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:76px; }.installSteps article{background:#080607;padding:28px;min-height:180px}.installSteps article>span{color:#6c6569;font:10px var(--font-geist-mono)}.installSteps h3{font-size:18px;margin:27px 0 9px}.installSteps p{color:#898286;font-size:13px;line-height:1.6;margin:0}
.terminalCard { width:min(620px,100%); margin:72px auto 23px; border:1px solid var(--line); border-radius:13px; overflow:hidden; background:#0d0a0b;box-shadow:0 28px 70px rgba(0,0,0,.3)}.terminalTop{height:42px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:6px;padding:0 14px}.terminalTop i{width:7px;height:7px;border-radius:50%;background:#433d40}.terminalTop span{margin-left:8px;color:#5f595c;font:9px var(--font-geist-mono)}.terminalCard>code{display:block;padding:24px;color:#b8b1b4;font-size:13px;line-height:1.8}.terminalCard code b{color:#e23e50}.terminalCard code span{color:#6dc99a}
.downloadFinePrint{max-width:720px;margin:0 auto;color:#5f595c;font-size:11px;line-height:1.6;text-align:center}

/* Not found */
.notFoundPage { min-height:100vh; display:flex; flex-direction:column; }
.notFound { flex:1; min-height:680px; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:80px; padding-block:72px; }
.errorSignal { position:relative; min-height:450px; display:grid; place-items:center; background-image:linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px);background-size:28px 28px;border-radius:30px;overflow:hidden;isolation:isolate }
.errorSignal::after { content:'';position:absolute;inset:0;background:radial-gradient(circle,rgba(211,31,65,.15),transparent 32%,#080607 75%);z-index:-1 }
.errorSignal strong { color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.75);font-size:clamp(100px,15vw,190px);letter-spacing:-.09em;line-height:1;text-shadow:0 0 70px rgba(223,42,56,.13) }
.errorOrbit { position:absolute;left:50%;top:50%;border:1px solid rgba(223,42,56,.2);border-radius:50%;transform:translate(-50%,-50%);animation:pulse 5s ease-in-out infinite }.errorOrbitOne{width:330px;height:330px}.errorOrbitTwo{width:430px;height:430px;animation-delay:-2.5s}
.errorNode{position:absolute;width:7px;height:7px;border-radius:50%;background:#f23e55;box-shadow:0 0 18px #f23e55}.nodeOne{left:17%;top:29%}.nodeTwo{right:14%;top:42%}.nodeThree{left:30%;bottom:17%}
.notFoundCopy h1{margin:16px 0 25px;font-size:clamp(52px,6vw,83px);line-height:.98;letter-spacing:-.065em}.notFoundCopy h1 span{color:#777074}.notFoundCopy>p:not(.sectionLabel){max-width:530px;color:var(--muted);font-size:15px;line-height:1.72;margin-bottom:31px}

@media (max-width: 850px) {
  .hero { grid-template-columns:1fr; padding-top:62px; }.codeCanvas{height:500px}.navLinks{display:none}.featureGrid{grid-template-columns:1fr}.featureGrid article{min-height:190px}.featureGrid h3{margin-top:30px}.docsLayout{grid-template-columns:1fr;gap:45px}.docsRail{position:static;display:grid;grid-template-columns:repeat(3,1fr);border-left:0;border-top:1px solid var(--line);padding:22px 0 0}.docsRail span{grid-column:1/-1}.downloadHero{grid-template-columns:1fr;gap:25px}.downloadCard{grid-template-columns:190px 1fr}.downloadInfo{padding:40px 35px}.notFound{grid-template-columns:1fr;gap:25px;padding-top:52px}.errorSignal{min-height:350px}
}
@media (max-width: 520px) {
  .shell{width:min(100% - 30px,1180px)}.nav{height:72px}.navCta{padding:9px 12px}.hero{padding-top:48px;gap:35px}.hero h1{font-size:52px}.heroActions{align-items:flex-start;flex-direction:column;gap:20px}.codeCanvas{height:430px}.codeCard{width:90%}.codeCard pre{font-size:11px;padding-inline:20px}.node{display:none}.manifesto{padding-block:80px}.footer{min-height:132px;align-items:flex-start;flex-direction:column;justify-content:center;gap:20px}.footerIdentity{flex-direction:column;gap:6px}.footerLinks{flex-wrap:wrap;gap:14px 18px}.footerLinks>span{width:100%}.docsHero{padding-block:70px 58px}.docsLayout{padding-block:55px 90px}.docsRail{grid-template-columns:1fr 1fr}.comparisonRow{grid-template-columns:78px 72px 1fr;padding-inline:12px}.comparisonRow p{font-size:10px}.docsContent pre{padding:20px 18px}.docsContent pre code{font-size:11px}.downloadHero{padding-block:65px 55px}.downloadCard{grid-template-columns:1fr}.downloadIcon{min-height:180px;border-right:0;border-bottom:1px solid var(--line)}.downloadIcon img{width:95px;height:95px}.downloadInfo{padding:32px 24px 38px}.downloadSelectors{flex-direction:column}.downloadSelectors select{width:100%}.afterInstall{align-items:flex-start;flex-direction:column}.installSteps{grid-template-columns:1fr}.installSteps article{min-height:150px}.errorSignal{min-height:280px}.notFoundCopy h1{font-size:50px}.notFound{min-height:650px}
}

@media (prefers-reduced-motion: reduce) { html{scroll-behavior:auto}.node,.orbit{animation:none}.primaryButton,.textButton span{transition:none} }
