@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Ma+Shan+Zheng&family=Noto+Serif+SC:wght@400;500;600;700&display=swap");:root{--ink:#263a34;--muted:#728178;--cream:#faf7f0;--paper:#fffdf9;--green:#346b59;--mint:#dfece2;--line:#e6e4da;--orange:#df8157}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:"Noto Serif SC",Georgia,serif}button,input,textarea{font:inherit}button{cursor:pointer}nav{height:76px;display:flex;align-items:center;justify-content:space-between;max-width:1180px;margin:auto;padding:0 28px}.brand{font-family:Ma Shan Zheng,cursive;font-size:30px;color:var(--ink);text-decoration:none;letter-spacing:3px}.brand span{color:var(--orange)}.nav-links{display:flex;gap:30px}.nav-links a{color:var(--muted);text-decoration:none;font-size:14px}.saved-button{border:1px solid var(--line);background:var(--paper);color:var(--green);border-radius:22px;padding:8px 14px;font-size:13px}.saved-button b{font-family:DM Mono;font-size:11px}.hero{min-height:410px;display:grid;grid-template-columns:1.05fr .95fr;overflow:hidden;background:#e7f0e6}.hero-copy{padding:85px 40px 70px max(28px,calc((100vw - 1110px)/2))}.eyebrow{font:500 11px DM Mono,monospace;letter-spacing:1.6px;color:var(--green);margin:0 0 14px}.hero h1{font-size:48px;line-height:1.28;letter-spacing:2px;margin:0 0 16px}.hero h1 i{font-style:normal;color:var(--green);position:relative}.hero h1 i:after{content:"";position:absolute;height:8px;opacity:.55;background:#c3dcca;left:-4px;right:-4px;bottom:2px;z-index:0}.sub{line-height:1.85;color:#5b6b62;max-width:440px;font-size:15px}.promise{margin-top:25px;font-size:13px;color:var(--green);display:flex;gap:10px;align-items:center}.promise span{color:var(--orange)}.hero-art{position:relative;min-height:410px;background:linear-gradient(#d5e8df 0 69%,#b5d4bf 69%);overflow:hidden}.hero-art p{bottom:48px;left:50%;transform:translateX(-50%);white-space:nowrap;font-family:Ma Shan Zheng;font-size:24px;color:#fff;z-index:3}.hero-art p,.sun{position:absolute}.sun{width:118px;height:118px;border-radius:50%;background:#f6c99d;right:28%;top:70px;opacity:.9}.cloud{position:absolute;font-size:86px;color:#f7f8ef;line-height:1}.cloud-a{left:7%;top:78px}.cloud-b{right:-4%;top:140px;font-size:65px;opacity:.8}.mountain{position:absolute;bottom:0;width:0;height:0;border-left:220px solid transparent;border-right:220px solid transparent}.m1{left:-140px;border-bottom:210px solid #6ca989}.m2{right:-135px;border-bottom:185px solid #4e8c76}.herb{position:absolute;font-size:115px;bottom:78px;left:42%;color:#ee9a6b;transform:rotate(-25deg)}.tool-wrap{max-width:1000px;margin:-32px auto 85px;position:relative;padding:0 24px}.form-card{background:var(--paper);border:1px solid #eeeae0;box-shadow:0 18px 45px #59675b18;padding:42px 55px;border-radius:3px}.form-title{display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--line);padding-bottom:24px;margin-bottom:27px}.form-title>span{font:500 13px DM Mono;color:var(--orange);border:1px solid #efc0aa;padding:6px;border-radius:50%}.form-title h2{font-size:21px;margin:0}.form-title p{margin:4px 0 0;font-size:12px;color:var(--muted)}.field{margin:22px 0}.field label{display:block;font-size:15px;font-weight:600;margin-bottom:12px}.field small{font-weight:400;color:var(--muted);margin-left:8px}.surname input,textarea{width:100%;outline:0;border:1px solid var(--line);background:#fdfcf9;padding:12px 14px;border-radius:2px;color:var(--ink)}.surname input{font-size:21px;width:220px}.surname input:focus,textarea:focus{border-color:#88a998;box-shadow:0 0 0 3px #e5f0e7}.choices,.tags{display:flex;flex-wrap:wrap;gap:9px}.choice,.tag{background:transparent;border:1px solid var(--line);color:#5b6860;padding:8px 18px;border-radius:2px;font-size:13px}.tag{padding:7px 15px;border-radius:18px}.choice.active,.tag.active{background:var(--green);border-color:var(--green);color:#fff}.elements .tag:nth-child(2).active{background:#b99a40;border-color:#b99a40}.elements .tag:nth-child(3).active{background:#609a6d;border-color:#609a6d}.elements .tag:nth-child(4).active{background:#5598ae;border-color:#5598ae}.elements .tag:nth-child(5).active{background:#d46f52;border-color:#d46f52}.elements .tag:nth-child(6).active{background:#9b7955;border-color:#9b7955}.hint{font-size:12px;color:var(--muted);margin:10px 0 0;line-height:1.6}.generate{margin-top:13px;width:100%;border:0;background:var(--orange);color:#fff;padding:15px;border-radius:2px;font-size:16px;letter-spacing:1px;box-shadow:0 6px 13px #df81574d}.generate:disabled{opacity:.65}.error{color:#b14c38;font-size:13px}.results{max-width:1120px;margin:0 auto 95px;padding:0 24px}.results header{text-align:center;margin-bottom:32px}.results h2{font-size:28px;margin:0}.results header>p:last-child{color:var(--muted);font-size:13px}.results-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:18px;gap:18px}.name-card{background:var(--paper);border:1px solid var(--line);padding:25px;position:relative;transition:.2s}.name-card.open{border-color:#9abbaa;box-shadow:0 10px 30px #526f5b12}.rank{font:500 12px DM Mono;color:#b2baaf}.heart{position:absolute;right:20px;top:18px;border:0;background:none;font-size:24px;color:#aab3aa}.heart.saved{color:var(--orange)}.name-heading{margin:9px 0}.name-heading h3{font-size:29px;margin:0;letter-spacing:3px}.name-heading p{font:12px DM Mono;color:var(--muted);margin:6px 0}.score{position:absolute;right:22px;top:59px;text-align:center;color:var(--green)}.score b{font:500 28px DM Mono;display:block}.score span{font-size:10px}.meaning{font-size:14px;color:#59665e;line-height:1.7;padding-right:55px;min-height:48px}.chips{display:flex;gap:6px;flex-wrap:wrap}.chips em,.chips span{font-size:11px;font-style:normal;padding:4px 8px;background:#edf4ec;color:var(--green)}.chips em{background:#f9eee9;color:#b66b4b}.details{background:none;border:0;color:var(--green);font-size:12px;padding:17px 0 0}.detail{margin-top:14px;border-top:1px dashed #dddcd4;padding-top:14px}.characters{display:flex;gap:24px}.characters div{display:flex;gap:8px;align-items:baseline}.characters b{font-size:20px}.characters span{font-size:12px;color:var(--muted)}.score-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:8px;gap:8px;margin:17px 0}.score-grid div{background:#f7f8f3;padding:8px}.score-grid span{display:block;font-size:11px;color:var(--muted)}.score-grid b{font:500 15px DM Mono;color:var(--green)}.detail>p{font-size:11px;color:#9ba39b;margin:0}.refresh{display:block;margin:32px auto 0;border:1px solid var(--green);color:var(--green);background:transparent;padding:10px 26px;border-radius:2px}.how{background:#e7f0e6;padding:47px max(28px,calc((100vw - 970px)/2));display:grid;grid-template-columns:repeat(3,1fr);grid-gap:55px;gap:55px}.how div{position:relative;padding-left:38px}.how span{position:absolute;left:0;top:0;color:var(--orange);font:500 13px DM Mono}.how h3{font-size:16px;margin:0 0 8px}.how p{font-size:12px;color:#64736a;line-height:1.8;margin:0}footer{text-align:center;padding:25px;color:var(--green);font-size:13px;background:#eff4ec}footer span{color:var(--muted)}@media(max-width:700px){nav{padding:0 18px}.nav-links{display:none}.hero{display:block}.hero-copy{padding:55px 28px 45px}.hero h1{font-size:37px}.hero-art{min-height:220px}.sun{top:30px}.mountain{transform:scale(.7);transform-origin:bottom}.tool-wrap{padding:0 14px;margin-top:-20px}.form-card{padding:28px 22px}.how,.results-grid{grid-template-columns:1fr}.how{gap:25px}.promise{font-size:11px;gap:7px}.surname input{width:100%}}