*{box-sizing:border-box}body{margin:0;background:#e8eeed;color:#182724;font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer;color:inherit;border:0;background:none}button:focus-visible,a:focus-visible{outline:3px solid #28aa94;outline-offset:3px}.intro{position:fixed;left:max(6vw,calc(50% - 560px));top:65px;bottom:60px;width:390px;display:flex;flex-direction:column;justify-content:space-between}.brand{font-size:25px;font-weight:750;display:flex;align-items:center;gap:10px}.brand>span{background:#193c34;color:#c5f5aa;width:36px;height:36px;border-radius:11px;text-align:center;font-size:27px}.brand small{font-size:11px;font-weight:500;letter-spacing:2px;margin-left:2px}.eyebrow{font-size:11px;letter-spacing:2px;color:#57746b}.intro h1{font-size:54px;line-height:1.25;letter-spacing:-2px;margin:24px 0}.intro p{line-height:2;color:#6c7d77}.intro>small{color:#6c7d77}.index{display:grid;gap:18px;margin-top:40px}.index b{font-size:12px;color:#7f9690;font-weight:500}.index span{font-size:14px;margin-left:20px;color:#334d43}.phone{width:430px;min-height:900px;margin:32px max(5vw,calc(50% - 530px)) 32px auto;background:#f6f7f9;border:7px solid #fff;border-radius:40px;overflow:hidden;box-shadow:0 24px 80px #183d321a;position:relative;padding-bottom:80px}header{padding:25px 21px 14px;display:flex;align-items:center;justify-content:space-between}header .brand{font-size:21px}header .brand small{font-size:9px}header .brand>span{width:31px;height:31px;font-size:23px}.avatar{width:34px;height:34px;border-radius:50%;background:#e0e9df;font-size:13px;font-weight:700}.top-title{font-size:17px;font-weight:650}.icon{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}.back{padding:8px;margin:-8px}main{padding:4px 20px 24px}.greeting{display:flex;justify-content:space-between;align-items:end;margin:15px 0 18px}.greeting h1{font-size:25px;letter-spacing:-.8px;margin:0 0 4px}.muted,.greeting p{color:#8b9492;font-size:12px;margin:0}.pill{background:#e8eeeb;color:#526c62;font-size:11px;border-radius:20px;padding:5px 10px}.hero{height:197px;border-radius:20px;overflow:hidden;position:relative;background:#233f36;color:white;isolation:isolate}.hero img{position:absolute;right:-36px;height:100%;width:77%;object-fit:cover;z-index:-2}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#203e34 0%,#203e34ef 32%,#203e3420 75%);z-index:-1}.hero-content{padding:22px}.hero small{font-size:10px;letter-spacing:2px;color:#ceebd6}.hero h2{font-size:25px;line-height:1.4;margin:10px 0}.hero button{background:#d6f5be;padding:9px 13px;border-radius:8px;font-size:12px;color:#243c2e}.hero button svg{width:15px;height:15px;margin-left:13px}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0 25px}.feature{background:white;border:1px solid #e9edeb;border-radius:15px;padding:15px;text-align:left;position:relative}.feature svg{margin-bottom:11px;color:#4b7f71}.feature:nth-child(2) svg{color:#8180a0}.feature:nth-child(3) svg{color:#b08e65}.feature:nth-child(4) svg{color:#6495aa}.feature b{display:block;font-size:15px;margin-bottom:3px}.feature small{font-size:11px;color:#929b97}.feature .tiny{position:absolute;right:12px;top:17px;font-size:9px;background:#e9f2e8;color:#5d7b57;padding:2px 5px;border-radius:4px}.section-title{display:flex;justify-content:space-between;align-items:center;margin:23px 0 15px}.section-title h2{font-size:17px;margin:0}.section-title button{font-size:12px;color:#8a9690}.tools{display:grid;grid-template-columns:repeat(4,1fr);gap:17px 4px}.tool{padding:0;text-align:center;font-size:11px}.tool i{width:46px;height:46px;display:grid;place-items:center;background:white;border:1px solid #e7ece9;border-radius:14px;margin:0 auto 7px;color:#587b6b}.tool:nth-child(3n) i{color:#aa9074}.tool:nth-child(3n + 2) i{color:#708ca3}.tool.active i{background:#dff2e8;border-color:#508d71}.recent{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sample{border-radius:14px;overflow:hidden;background:white;text-align:left;padding:0}.sample img{width:100%;height:128px;object-fit:cover}.sample b{display:block;font-size:12px;padding:9px 10px 2px}.sample small{display:block;color:#959d98;padding:0 10px 10px;font-size:10px}nav{position:absolute;bottom:0;left:0;right:0;display:flex;background:#fffefeee;border-top:1px solid #e7ebe8;padding:13px 10px 20px;backdrop-filter:blur(20px)}nav button{flex:1;color:#929e98;display:grid;justify-items:center;gap:5px;font-size:10px}nav button.active{color:#254f3f;font-weight:700}nav svg{width:21px;height:21px}.page-lead{margin:14px 0 22px}.page-lead h1{font-size:26px;margin:0 0 5px}.page-lead p{color:#87928c;font-size:13px}.stepper{display:flex;justify-content:space-between;font-size:11px;color:#929c97;margin:20px 0}.stepper b{color:#386651}.card{background:white;border:1px solid #e7ebe8;border-radius:17px;padding:16px;margin-bottom:14px}.card h3{font-size:15px;margin:0 0 13px}.card h3 small{font-size:11px;color:#99a09d;font-weight:400;margin-left:8px}.upload{border:1px dashed #baccc2;background:#f5f9f6;border-radius:13px;min-height:125px;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;color:#728b7d}.upload small{font-size:11px;color:#9ba59f}.upload img{width:100%;height:132px;object-fit:contain}.cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{display:block;font-size:12px;color:#718177;margin:10px 0}.field select,.field input,textarea{width:100%;border:1px solid #e3e8e3;border-radius:9px;padding:11px;color:#334f40;background:#fafbf9;margin-top:7px}textarea{min-height:95px;resize:vertical;font-size:13px}.choices{display:flex;gap:7px;flex-wrap:wrap}.choice{border:1px solid #e2e8e2;border-radius:8px;padding:9px 12px;font-size:12px;background:#fff}.choice.on{border-color:#538169;background:#edf6ef;color:#326246}.primary{width:100%;background:#234b3b;color:white;border-radius:12px;padding:15px;margin-top:15px;font-weight:600}.subnote{text-align:center;color:#98a09c;font-size:11px;margin:10px 0}.canvas{position:relative;margin:15px 0;background:#e5ebe7;border-radius:17px;overflow:hidden}.canvas img{width:100%;display:block;aspect-ratio:1;object-fit:cover}.canvas canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}.canvas .tag{position:absolute;top:12px;left:12px;background:#fffC;font-size:10px;padding:5px 9px;border-radius:6px}.editor-tools{display:flex;overflow:auto;gap:16px;padding:10px 0}.editor-tools .tool{min-width:56px}.edit-controls{margin-top:15px}.range{width:100%;accent-color:#3f7155}.empty{text-align:center;padding:60px 20px;color:#84948b}.prompt{background:#f0f5f0;border-radius:10px;padding:14px;color:#53705f;font-size:13px;line-height:1.8}.preview-badge{font-size:10px;color:#7b9283;background:#edf2ed;padding:4px 8px;border-radius:6px}#toast{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);background:#183e32;color:white;padding:12px 20px;border-radius:12px;z-index:10;max-width:90%;box-shadow:0 8px 30px #0002}.result{width:100%;border-radius:14px}.editor-tools+.card{margin-top:15px}@media(max-width:760px){body{background:#f6f7f9}.intro{display:none}.phone{margin:0;border:0;border-radius:0;width:100%;min-height:100dvh;box-shadow:none;padding-bottom:90px}nav{position:fixed;padding-bottom:max(18px,env(safe-area-inset-bottom));z-index:4}header{padding-top:21px}.phone main{max-width:500px;margin:auto}}@media(min-width:761px) and (max-width:1000px){.intro{left:35px;width:310px}.intro h1{font-size:44px}.phone{margin-right:25px;width:390px}}

/* Shared vector brand mark across desktop and PWA. */
.brand>.brand-mark{display:block;width:36px;height:36px;flex:none}header .brand>.brand-mark{width:31px;height:31px}