@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#eaeaf0;background:#090b10;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #b5a7ff;outline-offset:2px}.shell{min-height:100vh}.top{height:72px;border-bottom:1px solid #22252d;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,5vw);background:#0c0e14;position:sticky;top:0;z-index:20}.logo{font-family:Manrope;font-size:23px;font-weight:800;letter-spacing:-1.4px}.logo i{font-style:normal;color:#ad9cff}.topnav{display:flex;gap:24px;align-items:center;color:#a6a6b2;font-size:14px}.topnav a:hover{color:white}.btn{background:#a995ff;color:#100b21;border:0;border-radius:12px;padding:12px 18px;font-weight:800;transition:.2s}.btn:hover{background:#c0b3ff;transform:translateY(-2px)}.btn.secondary{background:#20232e;color:#eee}.btn.outline{background:transparent;border:1px solid #444655;color:#eee}.hero{max-width:1220px;margin:auto;padding:100px 24px 60px;text-align:center;position:relative}.glow{position:absolute;z-index:-1;top:0;left:15%;width:70%;height:440px;background:radial-gradient(ellipse,#6b50ba36,transparent 70%);pointer-events:none}.eyebrow{display:inline-flex;border:1px solid #3c3454;background:#211b33;color:#c4b4ff;padding:8px 14px;border-radius:100px;font-size:12px;letter-spacing:.08em;font-weight:700}.hero h1{font:800 clamp(48px,7.6vw,100px)/1.06 Manrope;letter-spacing:-.075em;margin:28px auto;max-width:1050px}.gradient{background:linear-gradient(110deg,#fff,#bba9ff 55%,#81a4ff);background-clip:text;color:transparent}.hero p{color:#a6a8b7;font-size:19px;max-width:650px;margin:0 auto 30px;line-height:1.7}.prompt{max-width:780px;margin:34px auto 0;text-align:left;background:#151821;border:1px solid #3b3a4c;padding:12px;border-radius:19px;box-shadow:0 24px 90px #0009}.prompt textarea{resize:vertical;width:100%;min-height:110px;background:transparent;border:0;color:white;padding:14px;outline:0}.promptbar{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #30313b;padding:12px 5px 2px}.muted{color:#8e90a1}.tiny{font-size:12px}.section{max-width:1200px;margin:55px auto;padding:0 24px}.section h2{font:800 32px Manrope;letter-spacing:-.05em}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{background:#151820;border:1px solid #2b2d37;border-radius:18px;padding:23px}.card h3{margin:8px 0;font-size:18px}.card p{color:#a1a4b1;line-height:1.6}.card .ico{font-size:25px}.workspace{display:grid;grid-template-columns:270px minmax(0,1fr);min-height:calc(100vh - 72px)}.side{background:#101218;border-right:1px solid #272a34;padding:24px 14px}.side h4{color:#747988;text-transform:uppercase;letter-spacing:.1em;font-size:11px;padding:8px 12px}.side button{display:block;width:100%;text-align:left;background:transparent;color:#a6a9b8;border:0;padding:13px;border-radius:10px;margin:4px 0}.side button.active,.side button:hover{background:#242335;color:#fff}.main{padding:30px;min-width:0}.heading{display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap}.projects{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:17px;margin-top:25px}.project{padding:0;overflow:hidden}.thumb{height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:800 25px Manrope;letter-spacing:-1px}.projectinfo{padding:17px}.projectinfo p{font-size:12px;color:#858a9a}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.actions button{padding:9px 12px;font-size:12px}.editor{display:grid;grid-template-columns:290px minmax(0,1fr);height:calc(100vh - 72px)}.controls{overflow:auto;background:#12151c;border-right:1px solid #2b2d35;padding:20px}.controls label{display:block;font-size:12px;color:#9b9eac;margin:16px 0 6px}.controls input,.controls textarea,.controls select{width:100%;border:1px solid #3a3c49;border-radius:9px;padding:10px;color:#f4f4f6;background:#1b1e28}.controls textarea{min-height:85px;resize:vertical}.previewarea{padding:18px;overflow:auto;background:#22252d}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}.preview{background:white;color:#111;min-height:640px;margin:0 auto;border-radius:9px;overflow:hidden;box-shadow:0 12px 55px #0006;transition:width .3s;width:100%;max-width:1250px}.preview.mobile{width:390px;max-width:100%}.preview.tablet{width:768px;max-width:100%}.site-nav{display:flex;justify-content:space-between;align-items:center;padding:22px 6%;font-weight:800;gap:12px}.site-nav .links{font-size:12px;font-weight:500;display:flex;gap:20px}.site-hero{padding:100px 7%;min-height:480px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.site-hero h1{font:800 clamp(35px,5vw,74px)/1.08 Manrope;letter-spacing:-.065em;max-width:850px;margin:0 0 22px}.site-hero p{font-size:17px;max-width:570px;line-height:1.7;opacity:.8}.site-cta{border:0;border-radius:6px;padding:15px 22px;font-weight:800;margin-top:18px}.site-section{padding:70px 7%}.site-section h2{font:800 38px Manrope;letter-spacing:-.05em}.site-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.site-tile{padding:30px;border:1px solid #9995;border-radius:10px}.site-footer{padding:45px 7%;border-top:1px solid #8884;font-size:13px;opacity:.7}.notice{padding:12px 16px;border:1px solid #5a4d7b;background:#211b33;border-radius:10px;color:#d4caff;font-size:13px;line-height:1.6;margin:16px 0}.footer{padding:50px 24px;text-align:center;color:#777b8c}.empty{padding:70px;text-align:center;border:1px dashed #424450;border-radius:16px;margin-top:24px}.toast{position:fixed;bottom:25px;right:25px;background:#24283a;border:1px solid #65627b;padding:15px 22px;border-radius:12px;z-index:99}.spin{display:inline-block;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:850px){.workspace,.editor{grid-template-columns:1fr}.side{display:flex;gap:5px;overflow:auto;padding:10px}.side h4{display:none}.side button{white-space:nowrap;width:auto}.controls{max-height:440px}.cards{grid-template-columns:1fr}.topnav a{display:none}.hero{padding-top:65px}.site-grid{grid-template-columns:1fr}.site-nav .links{display:none}}