@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#20213a;--muted:#77778c;--purple:#7545ef;--pale:#f6f3ff;--line:#e9e5f4;--green:#39a77d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fbfaff;color:var(--ink);font:14px Manrope,Arial,sans-serif}.topbar{height:72px;background:#fff;border-bottom:1px solid #eeebf5;padding:0 max(24px,calc((100% - 1220px)/2));display:flex;align-items:center;gap:28px}.logo{font-size:21px;font-weight:800;text-decoration:none;color:var(--ink);letter-spacing:-1px}.logo i{font-style:normal;color:var(--purple)}.crumb{font-size:12px;color:#9b99aa}.crumb b{margin:0 8px;color:#c4bfd6}.head-right{margin-left:auto;display:flex;align-items:center;gap:16px}.status{font-size:11px;color:#68677b}.status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#4fc390;margin-right:5px}.avatar{border:0;background:#eee9ff;color:#7445e9;font-weight:800;border-radius:50%;width:34px;height:34px}.page{width:min(1160px,calc(100% - 36px));margin:auto}.intro{padding:54px 0 38px;display:flex;justify-content:space-between;gap:30px}.eyebrow{font-size:10px;color:#8259e8;font-weight:800;letter-spacing:.55px}.intro h1{font-size:42px;letter-spacing:-2px;line-height:1.08;margin:13px 0}.intro p{color:var(--muted);max-width:600px;line-height:1.65;margin:0}.intro-note{align-self:end;width:280px;padding:16px 18px;background:#f1edff;border:1px solid #e6defe;border-radius:11px}.intro-note span,.intro-note small{display:block;color:#767286;font-size:11px}.intro-note b{display:block;color:#7445e9;font-size:13px;margin:6px 0}.intro-note small{line-height:1.45}.workspace{display:grid;grid-template-columns:190px 1fr;gap:34px;align-items:start}.steps{padding-top:26px}.step{display:flex;gap:12px;align-items:start}.step>span{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:#f0ecfa;color:#a7a1b8;font-size:10px;font-weight:800}.step.active>span{background:var(--purple);color:white}.step b,.step small{display:block}.step b{font-size:12px;margin:2px 0 4px}.step small{color:#aaa7b5;font-size:10px}.line{width:1px;height:27px;background:#ddd8ea;margin:4px 0 4px 14px}.panel{background:#fff;border:1px solid var(--line);border-radius:15px;padding:31px 34px;box-shadow:0 12px 35px #4c317d08}.panel-head{display:flex;justify-content:space-between;gap:20px}.panel h2{font-size:24px;letter-spacing:-1px;margin:7px 0}.panel-head p,.section-title p{font-size:12px;color:var(--muted);margin:0;line-height:1.5}.save{font-size:10px;color:#9b99aa;white-space:nowrap}.big-upload{min-height:165px;margin-top:24px;border:1.5px dashed #cfc5ed;border-radius:11px;background:#fcfbff;display:flex;align-items:center;justify-content:center;flex-direction:column;cursor:pointer;transition:.2s}.big-upload:hover{border-color:var(--purple);background:#faf8ff}.big-upload input,.small-upload input{display:none}.upload-icon{width:35px;height:35px;background:#eee8ff;color:var(--purple);border-radius:9px;display:grid;place-items:center;font-size:20px;margin-bottom:10px}.big-upload b{font-size:13px}.big-upload span{font-size:11px;color:#77758a;margin-top:5px}.big-upload em{font-size:10px;color:#aaa6b9;font-style:normal;margin-top:12px}.hidden{display:none!important}.photo-preview{position:relative;height:220px;margin-top:24px;border-radius:11px;overflow:hidden;background:#f5f1ff}.photo-preview img{width:100%;height:100%;object-fit:cover}.photo-preview>button{position:absolute;right:12px;top:12px;border:0;border-radius:50%;width:28px;height:28px;background:#fff;color:#555;box-shadow:0 2px 8px #0002;font-size:18px}.photo-preview div{position:absolute;bottom:0;left:0;right:0;padding:13px 17px;background:linear-gradient(transparent,#20213aaf);color:#fff}.photo-preview div b,.photo-preview div span{display:block}.photo-preview div span{font-size:10px;margin-top:3px}.divider{height:1px;background:#eeeaf5;margin:29px 0}.form-section{display:block}.section-title{display:flex;gap:12px;align-items:start}.number{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;background:#f0ebff;color:var(--purple);font-weight:800;font-size:10px}.section-title h3{font-size:15px;margin:1px 0 5px}.materials{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:18px 0}.material,.zone{border:1px solid #e5e1ef;border-radius:9px;background:#fff;color:#5d5b70;cursor:pointer;transition:.2s}.material{padding:12px 5px}.material span{display:block;color:#a39cad;font-size:21px;margin-bottom:6px}.material b{font-size:10px;font-weight:600}.material.selected,.zone.selected{border-color:var(--purple);background:#f7f3ff;color:#7041e5;box-shadow:0 0 0 1px #7545ef22}.material.selected span{color:var(--purple)}.sample-row{display:flex;align-items:center;gap:13px}.small-upload{flex:1;display:flex;align-items:center;gap:10px;border:1px solid #e7e3ef;border-radius:9px;padding:8px 11px;cursor:pointer}.sample-thumb{width:37px;height:37px;border-radius:6px;background:#f0ecfa;color:var(--purple);display:grid;place-items:center;font-size:20px}.small-upload b,.small-upload small{display:block}.small-upload b{font-size:11px}.small-upload small{font-size:9px;color:#9d99aa;margin-top:3px}.or{font-size:10px;color:#aaa6b6}.catalog-btn,.secondary,.download{background:#fff;border:1px solid #dfd9ec;border-radius:8px;padding:12px 14px;color:#6541ca;font:600 11px Manrope;cursor:pointer}.catalog-btn b{font-size:14px;margin-left:12px}.zones{display:flex;gap:8px;margin:18px 0 15px}.zone{padding:10px 12px;font:600 11px Manrope}.zone span{margin-right:6px;color:#a09aaa}.prompt span{display:block;font-size:11px;font-weight:700}.prompt i{font-style:normal;color:#aaa6b5;font-weight:400;margin-left:5px}.prompt textarea{font:11px Manrope;width:100%;height:58px;resize:vertical;border:1px solid #e6e1ef;border-radius:8px;padding:10px 12px;margin-top:7px;outline:none}.prompt textarea:focus{border-color:#a78be9}.actions{display:flex;justify-content:space-between;align-items:center;margin-top:28px}.estimate{display:flex;gap:9px;align-items:center;color:#77758a;font-size:10px;line-height:1.4}.estimate i{font-style:normal;color:var(--purple);font-size:17px}.generate{border:0;background:var(--purple);color:white;border-radius:8px;padding:14px 19px;font:700 12px Manrope;cursor:pointer;box-shadow:0 6px 15px #7545ef35}.generate b{font-size:16px;margin-left:17px}.result{margin:48px 0}.result-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}.result h2{font-size:28px;letter-spacing:-1px;margin:7px 0}.result-head p{margin:0;color:var(--muted);font-size:12px}.secondary{margin-right:7px}.download{color:#69677a}.result-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;display:grid;grid-template-columns:1.5fr .7fr}.result-image{min-height:350px;position:relative;overflow:hidden;background:linear-gradient(120deg,#d6c8b7,#f1e8db)}.room{position:absolute;inset:0;background:linear-gradient(105deg,#ddd0c2 0 56%,#ede4d7 56%);clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.wall{position:absolute;inset:0 0 27% 0;background:repeating-linear-gradient(90deg,#e7d7c8 0 3px,#e3d1c1 3px 17px);opacity:.8}.floor{position:absolute;left:0;right:0;bottom:0;height:27%;background:repeating-linear-gradient(7deg,#ad907a 0 3px,#c5ab96 3px 22px)}.sofa{position:absolute;bottom:15%;left:28%;width:43%;height:24%;background:#987b6a;border-radius:14px 14px 5px 5px;box-shadow:0 12px 0 #765b4c}.plant{position:absolute;bottom:17%;right:11%;width:8px;height:32%;background:#806754}.plant:before{content:'✽';position:absolute;top:-21px;left:-18px;color:#487056;font-size:54px}.before-after{position:absolute;left:18px;bottom:17px;background:#fffdfdcc;border-radius:7px;padding:8px 11px}.before-after b{display:block;font-size:11px}.before-after span{display:block;font-size:9px;color:#777;margin-top:2px}.result-card aside{padding:29px}.result-card aside h3{font-size:20px;margin:8px 0 22px}.result-card dl{border-top:1px solid #eeeaf5;border-bottom:1px solid #eeeaf5;padding:9px 0}.result-card dl div{display:flex;justify-content:space-between;padding:8px 0}.result-card dt{font-size:10px;color:#9692a5}.result-card dd{font-size:10px;font-weight:700;margin:0}.tip{margin-top:22px;background:#f1edff;border-radius:8px;padding:12px}.tip b{font-size:11px;color:#7041dc}.tip p{font-size:10px;color:#77758a;line-height:1.5;margin:5px 0 0}footer{text-align:center;color:#aaa6b5;font-size:10px;padding:38px 0 25px}@media(max-width:800px){.topbar{padding:0 18px}.crumb,.status{display:none}.page{width:calc(100% - 28px)}.intro{display:block;padding:38px 0 25px}.intro h1{font-size:34px}.intro-note{width:auto;margin-top:24px}.workspace{display:block}.steps{display:flex;overflow:auto;padding:0 0 20px}.step{min-width:180px}.line{width:20px;height:1px;margin:14px 0}.panel{padding:23px 17px}.materials{grid-template-columns:repeat(3,1fr)}.sample-row{align-items:stretch;flex-direction:column}.or{text-align:center}.zones{flex-wrap:wrap}.result-head{display:block}.result-head>div:last-child{margin-top:15px}.result-card{grid-template-columns:1fr}.result-image{min-height:260px}.result-card aside{padding:23px}.actions{align-items:stretch;flex-direction:column;gap:16px}.generate{width:100%}}
