:root{color-scheme:dark;--bg:#090d12;--surface:#10161d;--line:rgba(255,255,255,.1);--text:#f4f7fb;--muted:#a7b1bd;--blue:#52a8ff;--mint:#45d9a3;--radius:22px;font-family:Inter,"SF Pro Display","PingFang SC","Microsoft YaHei",system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);line-height:1.6}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.skip-link{position:fixed;z-index:100;left:16px;top:-80px;padding:10px 14px;background:#fff;color:#000;border-radius:10px}.skip-link:focus{top:12px}
.site-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:72px;padding:0 5vw;background:rgba(9,13,18,.78);border-bottom:1px solid var(--line);backdrop-filter:blur(18px)}.brand{display:inline-flex;align-items:center;gap:10px;font-weight:760;letter-spacing:-.02em;font-size:1.12rem}.brand-mark{display:grid;place-items:center;width:36px;height:36px;color:#fff;border-radius:11px;background:linear-gradient(135deg,#398cff,#4ed9bd 38%,#ffae45 67%,#db54df);box-shadow:0 8px 28px rgba(80,131,255,.25)}.brand-mark.small{width:28px;height:28px;border-radius:9px;font-size:.8rem}.site-header nav{display:flex;gap:30px;color:var(--muted);font-size:.94rem}.site-header nav a:hover,.site-header nav a:focus-visible{color:#fff}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 19px;border:1px solid transparent;border-radius:13px;cursor:pointer;font-weight:680;transition:transform .18s ease,border-color .18s ease,background .18s ease,opacity .18s ease}.button:hover:not(:disabled){transform:translateY(-1px)}.button:focus-visible,input:focus-visible,textarea:focus-visible,.segmented button:focus-visible{outline:3px solid rgba(82,168,255,.35);outline-offset:2px}.button:disabled{cursor:not-allowed;opacity:.48}.button-primary{color:#fff;background:linear-gradient(110deg,#4d8df7,#7255ee 60%,#ab57d0);box-shadow:0 12px 35px rgba(92,88,240,.24)}.button-secondary,.button-quiet{background:rgba(255,255,255,.055);border-color:var(--line);color:var(--text);box-shadow:none}.button-quiet{min-height:38px;padding:0 15px}.wide{width:100%}
.hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,.9fr) minmax(450px,1.1fr);align-items:center;gap:7vw;min-height:720px;padding:95px 7vw 110px}.hero:before{content:"";position:absolute;inset:-30% 20% auto -10%;height:630px;background:radial-gradient(circle,rgba(72,129,255,.14),transparent 66%);pointer-events:none}.hero-copy{position:relative;z-index:2;max-width:680px}.eyebrow{margin:0 0 14px;color:#78bcff;font-size:.78rem;font-weight:760;letter-spacing:.14em;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{max-width:760px;margin-bottom:22px;font-size:clamp(3.1rem,5.7vw,6.5rem);line-height:1.02;letter-spacing:-.065em}h2{margin-bottom:18px;font-size:clamp(2rem,3.2vw,3.55rem);line-height:1.1;letter-spacing:-.045em}h3{letter-spacing:-.02em}.hero-lead{max-width:650px;color:#bbc4ce;font-size:clamp(1.05rem,1.4vw,1.25rem)}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:32px 0}.trust-list{display:flex;flex-wrap:wrap;gap:12px 22px;margin:0;padding:0;color:#8f9aa7;list-style:none;font-size:.88rem}.trust-list li:before{content:"✓";margin-right:7px;color:var(--mint)}
.hero-visual{position:relative;min-height:520px;display:grid;place-items:center}.glow{position:absolute;width:45%;aspect-ratio:1;filter:blur(80px);opacity:.35;border-radius:50%}.glow-a{left:3%;top:15%;background:#3e85ff}.glow-b{right:3%;bottom:10%;background:#d95dc5}.workspace-card{position:relative;z-index:2;width:min(720px,100%);overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:25px;background:rgba(18,24,32,.82);box-shadow:0 35px 90px rgba(0,0,0,.5);transform:perspective(1200px) rotateY(-4deg) rotateX(2deg);backdrop-filter:blur(16px)}.workspace-top{display:flex;gap:7px;padding:17px 19px;border-bottom:1px solid var(--line)}.workspace-top span{width:9px;height:9px;border-radius:50%;background:#4b545e}.workspace-top span:first-child{background:#ff6b6b}.workspace-top span:nth-child(2){background:#ffc859}.workspace-top span:last-child{background:#48d786}.workspace-grid{display:grid;grid-template-columns:72px 1fr;min-height:410px}.tool-rail{display:flex;flex-direction:column;align-items:center;gap:16px;padding:25px 0;border-right:1px solid var(--line)}.tool-rail span{width:26px;height:26px;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:rgba(255,255,255,.04)}.tool-rail span.active{border-color:#6a97ff;background:linear-gradient(135deg,rgba(72,142,255,.55),rgba(139,86,255,.45))}.preview-pane{padding:42px}.status-pill,.feature-state{display:inline-flex;padding:5px 10px;border-radius:999px;background:rgba(69,217,163,.11);color:#5be1ad;font-size:.74rem;font-weight:720}.generated-scene{position:relative;overflow:hidden;height:220px;margin:26px 0 23px;border-radius:17px;background:linear-gradient(#8fc0ca 0 42%,#e5b978 43%,#282d3c)}.scene-sun{position:absolute;right:17%;top:16%;width:44px;height:44px;border-radius:50%;background:#ffe6a2;box-shadow:0 0 45px #ffd278}.scene-hill{position:absolute;bottom:-28%;width:85%;height:82%;border-radius:50% 50% 0 0;transform:rotate(-8deg)}.hill-back{right:-12%;background:#56675e}.hill-front{left:-13%;bottom:-47%;background:#263934}.preview-pane p{margin-bottom:3px;font-size:1.2rem;font-weight:720}.preview-pane small{color:var(--muted)}
.section{padding:110px 7vw}.section-heading{max-width:700px;margin-bottom:48px}.section-heading>p:last-child{color:var(--muted)}.feature-grid,.principle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card,.principle-grid article{min-height:280px;padding:30px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.022))}.feature-card p:last-child,.principle-grid p{color:var(--muted)}.feature-icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:28px;border-radius:15px;font-size:1.35rem}.feature-icon.blue{background:rgba(72,142,255,.16);color:#6dacff}.feature-icon.violet{background:rgba(139,86,255,.16);color:#a885ff}.feature-icon.coral{background:rgba(255,111,135,.14);color:#ff8da1}.feature-state{margin-bottom:12px;padding-left:0;background:none}
.studio-section{display:grid;grid-template-columns:minmax(330px,.78fr) minmax(480px,1.22fr);gap:5vw;padding:120px 7vw;border-block:1px solid var(--line);background:linear-gradient(130deg,rgba(36,78,112,.24),rgba(56,37,65,.18))}.studio-copy>p{color:var(--muted)}.account-card,.generator-card{padding:26px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(10,15,21,.68);box-shadow:0 24px 60px rgba(0,0,0,.18)}.account-card{margin-top:32px}.account-head,.membership-panel,.result-head,.result-actions{display:flex;align-items:center;justify-content:space-between;gap:16px}.account-label{display:block;color:var(--muted);font-size:.75rem;font-weight:680;letter-spacing:.05em}.text-button{border:0;background:none;color:#83baff;cursor:pointer}.segmented{display:grid;grid-template-columns:1fr 1fr;margin:22px 0 18px;padding:4px;border-radius:12px;background:rgba(255,255,255,.055)}.segmented button{min-height:38px;border:0;border-radius:9px;background:transparent;color:var(--muted);cursor:pointer}.segmented button.active{background:rgba(255,255,255,.09);color:#fff}label,legend{color:#d9dfe7;font-size:.86rem;font-weight:620}input,textarea{width:100%;margin-top:8px;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:#0b1117;color:var(--text);resize:vertical}input::placeholder,textarea::placeholder{color:#697582}.code-row{display:grid;grid-template-columns:1fr auto;align-items:end;gap:10px;margin:14px 0}.code-row .button{white-space:nowrap}#register-fields label{display:block;margin:14px 0}.membership-panel{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.form-message{min-height:24px;margin:14px 0 0;color:#a8b4c1;font-size:.85rem}.form-message.error{color:#ff93a5}.form-message.success{color:#5be1ad}
.generator-card textarea{min-height:160px;font-size:1rem;line-height:1.7}.counter{margin-top:5px;color:var(--muted);text-align:right;font-size:.75rem}fieldset{margin:23px 0;padding:0;border:0}legend{margin-bottom:10px}.choice-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.choice-grid label{position:relative;min-width:0}.choice-grid input{position:absolute;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}.choice-grid span{display:grid;min-height:42px;place-items:center;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.035);color:var(--muted);cursor:pointer}.choice-grid input:focus-visible+span{outline:3px solid rgba(82,168,255,.35);outline-offset:2px}.choice-grid input:checked+span{border-color:rgba(102,143,255,.8);background:rgba(81,105,226,.18);color:#fff}.fine-print{margin:12px 0 0;color:#798592;font-size:.75rem}.result-panel{margin-top:26px;padding-top:26px;border-top:1px solid var(--line)}.result-panel img{display:block;width:100%;max-height:620px;object-fit:contain;margin:18px 0;border-radius:15px;background:#070a0d}.result-actions{justify-content:flex-end}.principles{background:#0c1117}.principle-grid article strong{display:inline-block;margin-bottom:48px;color:#59718b;font-size:1.6rem}
footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;padding:38px 7vw;color:var(--muted);font-size:.84rem}footer>div,footer nav{display:flex;align-items:center;gap:10px}footer nav{justify-content:flex-end;gap:20px}.legal-page{width:min(820px,calc(100% - 40px));min-height:72vh;margin:0 auto;padding:90px 0 110px}.legal-page h1{font-size:clamp(2.8rem,7vw,5rem)}.legal-page h2{margin-top:48px;font-size:1.4rem}.legal-page p{color:#aeb8c3}[hidden]{display:none!important}
@media(max-width:1050px){.hero{grid-template-columns:1fr;padding-top:80px}.hero-copy{max-width:800px}.hero-visual{min-height:450px}.studio-section{grid-template-columns:1fr}.studio-copy{max-width:760px}}@media(max-width:760px){.site-header{padding:0 18px}.site-header nav,.site-header>.button{display:none}.hero,.section,.studio-section{padding-inline:20px}.hero{min-height:auto;padding-block:75px;gap:45px}h1{font-size:clamp(2.8rem,14vw,4.3rem)}.hero-visual{min-height:340px}.workspace-grid{grid-template-columns:48px 1fr;min-height:310px}.preview-pane{padding:24px 18px}.generated-scene{height:160px}.tool-rail span{width:20px;height:20px}.feature-grid,.principle-grid{grid-template-columns:1fr}.feature-card,.principle-grid article{min-height:auto}.choice-grid{grid-template-columns:repeat(2,1fr)}.code-row{grid-template-columns:1fr}.code-row .button{width:100%}footer{grid-template-columns:1fr;text-align:center}footer>div,footer nav{justify-content:center}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}