
:root{--canvas:#090e17;--surface:#121b28;--ink:#f0f4f6;--muted:#94a4b7;--accent:#85efd3;--brand:#85efd3;--line:#263140;--radius:16px;--content:1392px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--canvas);color:var(--ink);font:15px/1.7 -apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}img{display:block;max-width:100%}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.35}h2{font-size:36px;font-weight:650;letter-spacing:-1px}h3{font-size:20px}p{color:var(--muted)}.wrap{width:calc(100% - 112px);max-width:var(--content);margin:auto}.nav{height:92px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:24px}.brand{display:flex;align-items:center;gap:12px;white-space:nowrap}.brand img{width:40px;height:40px;border-radius:50%}.brand strong{font-size:18px;letter-spacing:1px}.brand b{font-weight:400;color:#b9c8d6}.navlinks,.navright{display:flex;align-items:center;gap:26px;font-size:13px;white-space:nowrap}.navlinks a{color:var(--muted)}.navlinks a:first-child{color:var(--ink)}.navright{gap:18px}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;background:transparent;border:1px solid #394757;padding:13px 22px;border-radius:10px;color:var(--ink);font-size:14px;font-weight:650;line-height:1.5}.button.primary{background:var(--accent);border-color:var(--accent);color:#112923}.button.small{font-size:12px;padding:10px 16px}.textlink{color:var(--accent);font-size:14px}.eyebrow{font-size:11px;font-weight:650;letter-spacing:3px;color:var(--accent);margin-bottom:20px}.hero{position:relative;padding:80px 0 42px;background:radial-gradient(ellipse at 77% 38%,#16333980,transparent 48%)}.hero-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:64px;align-items:center}.hero h1{font-size:clamp(42px,4.2vw,66px);font-weight:660;letter-spacing:-2px;line-height:1.24}.hero h1 span{color:var(--accent)}.hero-desc{font-size:16px;line-height:1.9;margin:26px 0 25px;max-width:490px}.gift{font-size:14px;color:#d6e9e5;margin:24px 0 18px;display:flex;align-items:center;gap:10px}.gift i{font-style:normal;background:#223b34;color:var(--accent);padding:2px 8px;border-radius:6px}.buttons{display:flex;flex-wrap:wrap;gap:12px}.micro{font-size:11px;margin-top:14px;color:var(--muted)}.hero-bottom{display:flex;gap:25px;align-items:center;margin-top:56px;padding:22px 0 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.hero-bottom strong{color:#c6d3df;font-size:13px}.hero-bottom .push{margin-left:auto;color:var(--accent)}.studio{border:1px solid #3b5058;border-radius:var(--radius);background:linear-gradient(150deg,#1b2d35,#121a27 50%);box-shadow:0 32px 80px #0005;padding:20px;position:relative}.windowbar{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted);padding-bottom:16px;border-bottom:1px solid var(--line)}.dots{letter-spacing:5px;color:#6a858c}.studiotitle{display:flex;justify-content:space-between;align-items:center;margin:22px 0 18px}.studiotitle strong{font-size:20px}.status{font-size:10px;color:var(--accent);background:#85efd311;border:1px solid #85efd32b;padding:4px 9px;border-radius:6px}.mini-input{background:#0b141f;border:1px solid var(--line);padding:12px 14px;display:flex;justify-content:space-between;font-size:12px;border-radius:10px;color:#d2dce5}.mini-input span{color:var(--accent)}.art-row{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:10px;margin:16px 0}.art-row figure{margin:0;background:#192533;border:1px solid var(--line);border-radius:10px;overflow:hidden}.art-row img{height:192px;width:100%;object-fit:cover;object-position:top}.art-row figcaption{font-size:10px;padding:9px 10px;color:#a5b8c7}.video-preview{position:relative}.video-preview .play{position:absolute;left:calc(50% - 20px);top:77px;width:40px;height:40px;background:#0c1a2580;border:1px solid #ffffff80;border-radius:50%;display:grid;place-items:center;color:white;font-size:14px}.timeline{border:1px solid var(--line);background:#0d1621;border-radius:10px;padding:12px}.track{display:flex;align-items:center;gap:8px;margin-top:7px;font-size:9px;color:var(--muted)}.track:first-child{margin-top:0}.track em{width:30px;font-style:normal}.clip{height:19px;flex:1;background:#244b48;border-radius:4px;color:#b6e9db;text-align:center}.clip.blue{background:#283d56;color:#acc8e9}.clip.wave{background:repeating-linear-gradient(90deg,#658578 0 2px,#284138 2px 6px);height:14px}.studio-foot{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-top:15px}.studio-foot b{color:var(--accent);font-weight:400}.section{padding:70px 0;border-bottom:1px solid var(--line)}.sectionhead{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:30px}.sectionhead .eyebrow{margin-bottom:10px}.sectionhead p{font-size:14px;margin-top:10px}.entry-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.panel{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius)}.entry{padding:25px 23px;position:relative}.icon{width:38px;height:38px;display:grid;place-items:center;border:1px solid #476661;background:#85efd30a;color:var(--accent);border-radius:10px;margin-bottom:24px;font-size:20px}.entry h3{font-size:19px;margin-bottom:10px}.entry p{font-size:12px;min-height:44px}.entry a{display:block;margin-top:22px;font-size:12px;color:var(--accent)}.entry:last-child{background:linear-gradient(135deg,#1e3837,var(--surface));border-color:#34544e}.flow{display:grid;grid-template-columns:repeat(6,1fr);gap:0;margin-top:38px}.step{padding:0 24px 0 0;position:relative}.step::before{content:'';position:absolute;left:0;right:0;top:20px;height:1px;background:#36504e;z-index:0}.step .num{position:relative;display:grid;place-items:center;background:var(--canvas);border:1px solid #45615b;width:40px;height:40px;border-radius:50%;color:var(--accent);font-size:12px}.step h3{margin:19px 0 8px;font-size:18px}.step p{font-size:12px}.featureline{margin-top:34px;border:1px solid var(--line);padding:18px 24px;border-radius:10px;font-size:13px;color:var(--muted);display:flex;justify-content:space-between;gap:20px}.featureline strong{color:#ccdedc;font-weight:500}.template-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}.template-grid figure{margin:0}.template-grid img{border-radius:12px;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border:1px solid var(--line)}.template-grid figcaption{display:flex;justify-content:space-between;font-size:12px;margin-top:13px;color:#bfccd7}.template-grid figcaption span{font-size:10px;color:var(--muted)}.chips{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px}.chips span{font-size:11px;color:var(--muted);border:1px solid var(--line);padding:5px 14px;border-radius:8px}.chips span:first-child{color:var(--accent);border-color:#507367;background:#85efd30b}.guest-grid{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:72px}.guest-copy h2{font-size:38px}.guest-copy p{margin:20px 0;max-width:400px}.checks{font-size:13px;color:#c3d4da;margin:22px 0 28px;line-height:2.3}.checks span{color:var(--accent);margin-right:12px}.demo{padding:24px}.demo-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:18px}.demo-top h3{font-size:16px}.guestbanner{display:flex;align-items:center;justify-content:space-between;padding:12px;margin:18px 0;background:#85efd30a;border:1px solid #85efd328;border-radius:10px;font-size:11px;color:#c5dad5}.guestbanner b{color:var(--accent);font-weight:500}.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.project{border-radius:10px;background:#0d1520;padding:16px;border:1px solid var(--line)}.project .picon{font-size:22px;color:var(--accent);margin-bottom:15px}.project h4{font-size:12px;margin:0 0 8px;font-weight:500}.project p{font-size:10px}.demo-foot{font-size:10px;margin-top:18px;color:var(--muted)}.partner{display:flex;align-items:center;justify-content:space-between;padding:42px 48px;gap:32px;background:linear-gradient(110deg,#182d31,var(--surface));border:1px solid #334c50;border-radius:var(--radius)}.partner h2{font-size:30px}.partner p{margin-top:12px;font-size:13px}.partner .eyebrow{margin-bottom:12px}.close{text-align:center;padding:76px 0}.close h2{font-size:40px;margin-bottom:18px}.close p{margin-bottom:26px}.close .buttons{justify-content:center}.footer{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px 0;border-top:1px solid var(--line);font-size:11px;color:var(--muted)}.footer .brand strong{font-size:14px}.footer .brand img{width:26px;height:26px}.preview-note{font-size:10px;color:#6e8795;letter-spacing:1px;margin-top:9px}dialog{color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:32px;max-width:440px}dialog::backdrop{background:#0009}dialog h3{margin-bottom:16px}dialog p{margin-bottom:20px}[hidden]{display:none!important}:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(max-width:1250px){.navlinks{gap:14px}.navlinks a:nth-child(4),.navlinks a:nth-child(6){display:none}.brand b{display:none}.hero-grid{gap:32px}.hero h1{font-size:48px}.art-row img{height:154px}.hero{padding-top:55px}.entry{padding:20px 16px}}
@media(max-width:900px){.wrap{width:calc(100% - 48px)}.navlinks{display:none}.hero-grid,.guest-grid{grid-template-columns:1fr;gap:40px}.hero h1{font-size:56px}.hero-desc{max-width:600px}.studio{max-width:700px}.entry-grid{grid-template-columns:repeat(3,1fr)}.template-grid{grid-template-columns:repeat(3,1fr)}.flow{grid-template-columns:repeat(3,1fr);gap:28px}.hero-bottom{flex-wrap:wrap;gap:14px}.hero-bottom .push{margin-left:0}.art-row img{height:200px}.partner{padding:32px}.sectionhead{align-items:start}.guest-grid{gap:30px}.featureline{flex-direction:column;gap:8px}}
@media(max-width:540px){.wrap{width:calc(100% - 36px)}.nav{height:76px;gap:12px}.brand strong{font-size:15px}.brand img{width:32px;height:32px}.navright{gap:12px}.navright>a:first-child,.navright>a:last-child{display:none}.button.small{padding:9px 12px;font-size:10px}.hero{padding:44px 0 20px}.hero h1{font-size:40px;letter-spacing:-1px}.hero-desc{font-size:14px}.hero .buttons{flex-direction:column}.hero-bottom{margin-top:30px}.hero-bottom strong{width:100%}.hero-grid{gap:32px}.studio{padding:14px}.studiotitle strong{font-size:17px}.mini-input{font-size:10px}.art-row img{height:132px}.art-row figcaption{font-size:9px;padding:7px}.studio-foot{font-size:8px}.section{padding:42px 0}h2,.guest-copy h2{font-size:28px}.sectionhead{flex-direction:column;gap:14px}.entry-grid{grid-template-columns:1fr 1fr;gap:10px}.entry p{min-height:0}.entry h3{font-size:17px}.entry:last-child{grid-column:1/-1}.icon{margin-bottom:16px}.flow{grid-template-columns:1fr 1fr}.template-grid{grid-template-columns:1fr 1fr;gap:18px 12px}.template-grid figcaption{font-size:11px}.template-grid figcaption span{display:none}.projects{grid-template-columns:1fr}.project{display:grid;grid-template-columns:28px 1fr;gap:0 8px}.project .picon{grid-row:1/3;margin:0}.guestbanner{gap:16px;font-size:10px}.demo{padding:16px}.partner{flex-direction:column;align-items:start;padding:26px}.partner h2{font-size:26px}.close{padding:50px 0}.close h2{font-size:30px}.footer{flex-direction:column;align-items:start}.micro{font-size:10px}.eyebrow{font-size:10px;letter-spacing:2px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.platform-shell{padding:28px 32px}.platform-heading{display:flex;justify-content:space-between;align-items:center;padding-bottom:24px;border-bottom:1px solid var(--line)}.platform-heading strong{font-size:16px}.platform-heading>span{font-size:12px;color:var(--muted)}.platform-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:30px 16px;padding:32px 0}.platform-item{display:flex;flex-direction:column;align-items:center;gap:12px;font-size:12px;color:#d7e1e9;text-align:center}.platform-item img{width:56px;height:56px;border-radius:14px}.platform-footer{display:flex;gap:28px;border-top:1px solid var(--line);padding-top:22px;color:var(--muted);font-size:12px}.platform-footer>span:before{content:'✓';color:var(--accent);margin-right:8px}.platform-footer a{margin-left:auto;color:var(--accent)}@media(max-width:900px){.platform-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.platform-footer{flex-wrap:wrap;gap:12px 24px}.platform-footer a{margin-left:0}}@media(max-width:540px){.platform-shell{padding:22px 16px}.platform-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 8px}.platform-heading{align-items:start;gap:12px;flex-direction:column;padding-bottom:18px}.platform-heading>span{font-size:11px}.platform-item{font-size:10px;gap:10px}.platform-item img{width:45px;height:45px;border-radius:12px}.platform-footer{font-size:10px}}
/* Compact benefit pills keep the established dark homepage palette. */
.nav { gap: 18px; flex-wrap: wrap; height: auto; min-height: 96px; padding-block: 20px; }
.navright { flex-wrap: wrap; justify-content: flex-end; gap: 12px; }
.benefit-pill { display: inline-flex; align-items: center; justify-content: center; gap: 5px; padding: 9px 13px; border-radius: 999px; border: 1px solid #85efd380; background: #85efd30b; color: #e0f8ef; font: inherit; font-size: 12px; white-space: nowrap; cursor: pointer; }
.benefit-pill strong { color: #85efd3; font-weight: 700; }
.invite-benefit { border-color: #d9b08c80; background: #d9b08c0b; color: #f0e2d7; }
.invite-benefit strong { color: #ffc395; }
.benefit-pill small { font-size: 9px; opacity: .75; }
.benefit-pill:hover { background: #ffffff10; }
.login-entry { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 8px 17px; border: 1px solid #85efd380; border-radius: 999px; color: #e0f8ef; transition: border-color .15s, background .15s; }
.login-entry:hover { border-color: #85efd3; background: #85efd30b; }
.invite-notice { color: #ffc395; }
#inviteRules { width: calc(100% - 36px); margin: auto; }
@media(min-width: 1101px) and (max-width: 1550px) { .navlinks { order: 3; width: 100%; justify-content: center; } .navright { margin-left: auto; } }
@media(max-width: 700px) { .nav { align-items: flex-start; } .navright { width: 100%; justify-content: flex-start; gap: 10px; } .benefit-pill { font-size: 11px; padding: 9px 11px; } .login-entry { min-height: 36px; padding: 7px 14px; } }
.nav-partner { color: var(--accent); }
@media(max-width: 900px) { .navlinks { display: flex; } .navlinks a:not(.nav-partner) { display: none; } }
