*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:linear-gradient(#fcfff8,#edf6ea);color:#123225}#app{max-width:1220px;margin:auto;padding:10px}.hero{min-height:76vh;border-radius:30px;padding:38px;display:flex;flex-direction:column;justify-content:end;color:white;background:#789b70 center/cover;position:relative;overflow:hidden;box-shadow:0 20px 60px #12322530}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#05291ef3,#05291eb0,#0000)}.hero>*{position:relative}.badge{font-weight:900;color:#d9ffd8;letter-spacing:.12em}.hero h1{font-family:Georgia,serif;font-size:clamp(42px,8vw,86px);line-height:.88;margin:10px 0;letter-spacing:-.07em}.hero p{font-size:20px;max-width:790px}.upload{border:2px dashed #ffffffaa;border-radius:22px;padding:16px 20px;background:#ffffff24;width:max-content;font-weight:900;cursor:pointer}.upload input{display:none}.quick{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.journey{position:sticky;top:0;z-index:15;background:#f7fbf4ee;backdrop-filter:blur(10px);padding:10px;border-bottom:1px solid #d8e2d2;font-weight:900;color:#063826}.progress{height:9px;background:#dfeade;border-radius:999px;margin-top:8px;overflow:hidden}.progress span{display:block;height:100%;width:12%;background:linear-gradient(90deg,#063826,#c79031);border-radius:999px;transition:.25s}nav{position:sticky;top:58px;z-index:10;display:flex;gap:8px;overflow:auto;padding:10px 0;background:#f7fbf4dd;backdrop-filter:blur(10px)}button{border:0;border-radius:999px;background:#063826;color:white;font-weight:900;padding:12px 16px;cursor:pointer}.ghost{background:white;color:#063826;border:1px solid #d8e2d2}.view{display:none;margin-top:12px}.view.active{display:block}.grid{display:grid;grid-template-columns:1fr 370px;gap:14px}.grid2{display:grid;grid-template-columns:1fr 1fr 340px;gap:14px}.panel{background:white;border:1px solid #d8e2d2;border-radius:26px;padding:18px;box-shadow:0 12px 34px #12322518}h2{font-family:Georgia,serif;color:#063826;font-size:34px;margin:0 0 12px;line-height:1}.muted{color:#607268;line-height:1.5}.stage,.concept{height:560px;border-radius:26px;background:#dce8d4 center/cover;position:relative;overflow:hidden;box-shadow:0 12px 34px #12322518}.stage:after,.concept:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0008,transparent 55%)}.visionPanel{position:absolute;z-index:8;left:18px;right:18px;bottom:18px;background:#fffffff2;border-radius:22px;padding:16px}.visionPanel b{display:block;color:#063826;font-size:24px}.visionPanel span,.visionPanel small{display:block;color:#607268}.visionPanel input{width:100%;margin-top:12px}.grow{position:absolute;z-index:4;opacity:var(--grow,.55);transition:.3s}.gTree{width:75px;height:75px;border-radius:50%;background:#78d36acc;left:13%;top:22%;box-shadow:0 0 40px #78d36a}.gPath{left:9%;bottom:19%;width:66%;height:32%;border-bottom:11px solid #fffbd0cc;border-radius:50%;transform:rotate(-13deg)}.gSeat{right:15%;bottom:24%;width:75px;height:45px;border-radius:12px;background:#ffd85dcc;box-shadow:0 0 35px #ffd85d}.gGarden{right:6%;top:20%;width:25%;height:60%;background:linear-gradient(90deg,transparent,#75c96ccc);border-radius:80% 0 0 80%}.storyPanel{background:linear-gradient(180deg,#fff,#f5fbef)}.storyText{font-family:Georgia,serif;font-size:24px;line-height:1.35;color:#063826;background:#f7fbf4;border:1px solid #d8e2d2;border-radius:22px;padding:20px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.card{border:1px solid #d8e2d2;border-radius:22px;overflow:hidden;cursor:pointer;background:white}.card.active{outline:5px solid #c7903166}.cardTop{padding:12px;color:white;font-weight:900;min-height:72px}.cardTop small{display:block;opacity:.8;margin-top:3px}.thumb{height:180px;background:center/cover;position:relative}.thumb:after,.concept:before{content:"";position:absolute;inset:0;background:var(--tint);mix-blend-mode:multiply}.thumb:before,.concept .fx{content:"";position:absolute;inset:0;background:var(--fx);opacity:var(--intensity,.85)}.card p{margin:12px;color:#607268;line-height:1.45}.overlayEl{position:absolute;z-index:3}.path{left:8%;bottom:18%;width:64%;height:32%;border-bottom:10px solid #ffffffc8;border-radius:50%;transform:rotate(-13deg)}.seat{right:15%;bottom:24%;width:70px;height:42px;border-radius:12px;background:#ffd85dcc;box-shadow:0 0 35px #ffd85d99}.tree{left:14%;top:22%;width:66px;height:66px;border-radius:50%;background:#8bd179d6;box-shadow:0 0 36px #8bd179aa}.privacy{right:4%;top:16%;width:23%;height:64%;background:linear-gradient(90deg,transparent,#73b96cc8);border-radius:80% 0 0 80%}.light{left:42%;top:18%;width:34%;height:34%;background:radial-gradient(circle,#ffe48faa,transparent 70%);border-radius:50%}.water{left:26%;bottom:18%;width:30%;height:18%;background:radial-gradient(ellipse,#71c7ff99,transparent 70%);border-radius:50%}.feature{right:25%;top:48%;width:48px;height:48px;background:#ffed90cc;border-radius:50%;box-shadow:0 0 25px #ffed90}.layer{margin:10px 6px 0 0;background:white;color:#063826;border:1px solid #d8e2d2}.layer.on{background:#063826;color:white}.sliderBox{margin-top:12px;background:#f7fbf4;border:1px solid #d8e2d2;border-radius:18px;padding:14px}.sliderBox input{width:100%}.note,.resultCard{background:#f7fbf4;border:1px solid #d8e2d2;border-radius:18px;padding:14px;margin-bottom:10px;line-height:1.45}.resultPanel{background:linear-gradient(180deg,#fff,#f2faef)}.resultCard strong{font-family:Georgia,serif;font-size:34px;display:block;color:#063826;margin:8px 0}.bigScore{display:inline-block;background:#063826;color:white;border-radius:999px;padding:7px 12px;font-weight:900;margin-bottom:10px}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.feedbackGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.fb{border-radius:18px;text-align:left;background:#f7fbf4;color:#063826;border:1px solid #d8e2d2}#toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:#063826;color:white;padding:12px 16px;border-radius:999px;opacity:0;transition:.2s}#toast.on{opacity:1}@media(max-width:1000px){.grid,.grid2,.cards,.feedbackGrid{grid-template-columns:1fr}.stage,.concept{height:430px}.hero{border-radius:22px;padding:22px}.upload{width:100%;text-align:center}}