*{box-sizing:border-box}body{margin:0;background:#f7f8f5;color:#1d2724;font:15px/1.7 system-ui,-apple-system,"Microsoft YaHei",sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}button,.primary{cursor:pointer;border:1px solid #dfe4dc;border-radius:8px;padding:9px 17px;background:white;color:#24372d}button:hover{border-color:#325e44}button.active,.primary{background:#244c36;color:#fff;border-color:#244c36}header{height:90px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e0e5dd;padding:0 6vw;background:#fff}.brand{font-size:32px;font-weight:900;letter-spacing:-2px}.brand span{font-size:14px;letter-spacing:2px;margin-left:10px}nav{font-size:12px;letter-spacing:2px}nav span{margin:0 20px;color:#b0b6ac}.small{font-size:13px}main{max-width:1320px;margin:auto;padding:38px 5vw 80px}.hero{background:#eaf0e4;border-radius:18px;padding:44px 48px;position:relative;overflow:hidden}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:700}.eyebrow i{display:inline-block;width:7px;height:7px;background:#528646;border-radius:50%;margin-right:8px}h1{font-size:55px;line-height:1.3;letter-spacing:-2px;margin:24px 0}h1 span{color:#57824b}.herobottom{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}.herobottom p{color:#6d796a}.count{display:flex;align-items:center;gap:18px}.count strong{font-size:48px;line-height:1}.count span{font-size:11px;color:#73806b}.orb{position:absolute;right:20%;top:-50px;width:290px;height:290px;border:55px solid #d7e4cb;border-radius:50%;transform:rotate(-25deg);opacity:.65}.collection{margin-top:42px}.sectiontop{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:20px 0}h2{font-size:23px;letter-spacing:-.7px}.sectiontop h2 span{font-size:11px;color:#889184;margin-left:12px;letter-spacing:1px}input{border:1px solid #dfe4dc;border-radius:8px;padding:11px 13px;background:#fff;max-width:100%}#search{width:280px;font-size:12px}.filters{display:flex;gap:9px;flex-wrap:wrap;margin:20px 0 30px}.filters button{font-size:12px;border-radius:30px;padding:7px 18px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 22px}.card{min-width:0}.cover{height:255px;border-radius:12px;background:#e4e9dd;padding:20px 25px 0;overflow:hidden;position:relative}.tone1{background:#e9e4da}.tone2{background:#e0e5ed}.tone3{background:#e8e0e9}.mocktag{position:absolute;left:12px;top:12px;background:#ffffffaa;border-radius:5px;padding:3px 9px;font-size:10px;z-index:1}.mock{background:#fff;border-radius:8px 8px 0 0;box-shadow:0 12px 30px #31403218;position:relative;padding:17px 18px;margin-top:23px;height:250px;transition:transform .3s}.mocknav{font-size:9px;font-weight:900;border-bottom:1px solid #eee;padding-bottom:10px}.mocknav b{float:right;color:#c2c9bc}.mock p{font-size:7px;letter-spacing:2px;margin-top:23px}.mock h3{font-size:24px;line-height:1.4;max-width:80%;position:relative;z-index:1;margin:10px 0}.mockbutton{background:#244c36;color:white;display:inline-block;font-size:8px;padding:7px 13px;border-radius:3px;position:relative;z-index:1}.mockshape{width:110px;height:110px;background:#d6e3c8;border-radius:50%;position:absolute;right:-25px;bottom:20px}.tone1 .mockshape{background:#e9d7bf}.tone2 .mockshape{background:#cbd5e8}.tone3 .mockshape{background:#e0c9dc}.view{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);background:#1e3528;color:#fff;padding:7px 13px;border-radius:25px;font-size:11px;opacity:0;white-space:nowrap}.card:hover .view{opacity:1}.card:hover .mock{transform:translateY(-5px)}.cardinfo{padding:14px 2px;display:flex;justify-content:space-between;align-items:center}.cardinfo small{font-size:10px;color:#84907e}.cardinfo h3{font-size:15px;margin:2px 0}.cardinfo>span{border:1px solid #dce2d8;width:30px;height:30px;text-align:center;border-radius:50%}.empty{padding:70px 20px;text-align:center;border:1px dashed #cad4c4;border-radius:12px}.empty p{color:#7a8574;margin-bottom:28px}[hidden]{display:none!important}footer{padding:26px 6vw;border-top:1px solid #e1e6dc;display:flex;justify-content:space-between;gap:15px;color:#7e8978;font-size:12px}footer b{color:#294c36;letter-spacing:2px}.panel,.login{background:#fff;border:1px solid #e0e5dd;border-radius:15px;padding:28px;margin-bottom:24px}.login{max-width:460px;margin:40px auto}.login h1{font-size:34px}.panel p,.login p{color:#7a8674;font-size:12px}label{display:block;font-size:12px;margin-bottom:16px}label input{display:block;width:100%;margin-top:7px}.admincols{display:grid;grid-template-columns:1.4fr 1fr;gap:24px}.upload{padding:18px;background:#f5f7f2;border:1px dashed #acbda4;border-radius:8px}.manage{border-top:1px solid #eee;padding:13px 0}.manage form{display:flex;gap:8px;flex-wrap:wrap}.manage input{min-width:100px;flex:1}.error{color:#bd3f37!important}.previewbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 5vw;background:#fff;font-size:12px}.stage{padding:30px 16px;min-height:75vh;background:#e5e8e1}.device{width:390px;max-width:100%;height:760px;max-height:80vh;margin:auto;background:white;position:relative;border:8px solid #26352b;border-radius:32px;overflow:hidden;box-shadow:0 15px 50px #24352920}.device.desktop{width:1200px;border-radius:8px}.device iframe{border:0;width:100%;height:100%;display:block}.watermark{position:absolute;bottom:20px;left:5%;width:90%;text-align:center;pointer-events:none;opacity:.5;background:#fff9;font-size:11px;color:#333;transform:rotate(-8deg)}.hint{text-align:center;color:#7b8574;font-size:11px;padding:0 20px}@media(max-width:800px){nav{display:none}header{height:72px}.hero{padding:30px 24px}h1{font-size:39px}.orb{right:-130px;top:-30px}.herobottom p{font-size:12px}.count{display:none}.grid{grid-template-columns:repeat(2,1fr);gap:18px 12px}.cover{height:210px;padding:20px 13px 0}.mock h3{font-size:19px}.sectiontop{align-items:flex-start;flex-direction:column}.sectiontop h2{margin:5px 0}.admincols{grid-template-columns:1fr}.previewbar{flex-wrap:wrap}.previewbar b{max-width:50%}footer span{display:none}}@media(max-width:450px){.grid{grid-template-columns:1fr}.cover{height:270px;padding:20px 32px 0}.mock{height:280px}.view{opacity:1}.hero h1{font-size:36px}.sectiontop input{width:100%}}
