@charset "UTF-8";
:root{--paper:#f6f5ef;--ink:#1c3634;--muted:#536661;--line:#d5dbd2;--green:#245c4a;--orange:#d78050;--white:#fffef9;--radius:5px;font-family:"Segoe UI","Microsoft YaHei",system-ui,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #bc6535;outline-offset:4px}button{cursor:pointer}button:disabled{cursor:default}button.small:hover,.text-link:hover,.language:hover{color:var(--green);text-decoration:underline}.skip{position:fixed;top:-100px;left:20px;background:var(--ink);color:white;padding:12px;z-index:10}.skip:focus{top:10px}header{max-width:1320px;margin:auto;height:100px;display:flex;align-items:center;justify-content:space-between;padding:0 44px;border-bottom:1px solid var(--line);gap:30px}.brand{display:flex;gap:12px;align-items:center}.brand-icon{height:40px;width:40px;border:1.5px solid var(--ink);font-size:25px;font-weight:700;display:grid;place-items:center;position:relative;line-height:1}.brand-icon span{position:absolute;right:-5px;top:-7px;color:var(--orange);font-size:23px;background:var(--paper)}.brand strong{font-size:18px;white-space:nowrap}.brand-sub{font-size:9px;letter-spacing:1.5px;border-left:1px solid var(--line);padding-left:12px}nav{display:flex;gap:30px;font-size:14px}nav a:hover{color:var(--green);text-decoration:underline}.language{font-size:13px;white-space:nowrap}main{max-width:1320px;margin:auto;padding:0 44px}section[id]{scroll-margin-top:24px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:78px 0 82px;align-items:center}.eyebrow{font-size:11px;font-weight:650;letter-spacing:1.7px;color:var(--green);margin:0 0 20px;line-height:1.6}h1{font-family:Georgia,"Songti SC","SimSun",serif;letter-spacing:-2px;font-weight:500;font-size:clamp(38px,4.25vw,62px);line-height:1.2;margin:0 0 25px}html[lang=zh-CN] h1{font-weight:700;letter-spacing:-1.8px;line-height:1.35}.hero-intro{font-size:16px;line-height:1.9;color:var(--muted);max-width:490px;margin:0}.hero-actions{display:flex;gap:25px;align-items:center;margin-top:30px;flex-wrap:wrap}.button{background:var(--green);border:1px solid var(--green);color:white;padding:14px 21px;border-radius:var(--radius);font-weight:600;font-size:14px;display:inline-flex;justify-content:space-between;align-items:center;gap:28px;line-height:1.5}.button:hover{background:#194331;border-color:#194331}.text-link{font-size:14px}.badge{font-size:11px;color:var(--muted);margin-top:23px;line-height:1.6}.hero-board{background:#e8ede4;border:1px solid #c6d3c5;padding:24px;transform:rotate(-1.5deg);box-shadow:9px 12px 0 #dde2d7}.board-top,.board-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:1px}.status-dot{color:#2f6d4e;font-size:12px}.board-caption{font-family:Georgia,"Microsoft YaHei",serif;font-size:24px;line-height:1.4;max-width:340px;margin:28px 0}.frames{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.frame{height:169px;background:#bacac1;position:relative;overflow:hidden;border:4px solid #f6f7ee}.frame:after{content:"";position:absolute;left:12px;right:12px;bottom:27px;top:12px;border:1px solid #eff4dd66}.city{position:absolute;height:95px;width:70%;left:-12px;top:20px;background:#819c94;box-shadow:40px -20px 0 #9bb0a4,80px 15px 0 #64867e;transform:skewY(-6deg)}.person{position:absolute;width:28px;height:70px;background:#214e44;border-radius:35% 35% 0 0;bottom:18px;left:50%;transform:translateX(-50%);box-shadow:0 22px 12px #224b3d44}.person:before{content:"";position:absolute;width:17px;height:20px;border-radius:50%;background:#d0ab88;left:5px;top:-17px;box-shadow:1px -5px 0 #24453e}.person:after{content:"";position:absolute;background:var(--orange);height:7px;width:34px;top:3px;left:-3px;transform:rotate(-10deg)}.frame-1 .person{transform:translate(-50%,75px) scale(2.1)}.frame-1 .city{filter:blur(4px)}.frame-2 .person{display:none}.frame-2 .city{top:75px;transform:rotate(20deg) scale(1.4);box-shadow:50px -20px 0 #d2ac71,80px 15px 0 #64867e}.rain{position:absolute;inset:0;z-index:1;background:repeating-linear-gradient(110deg,transparent 0 19px,#e8f5ec30 20px,transparent 21px 39px);pointer-events:none}.frame-number{position:absolute;left:6px;bottom:3px;z-index:2;font:10px monospace;color:white}.frame-name{display:block;font-size:10px;margin-top:8px}.board-foot{border-top:1px solid #c4d1c2;margin-top:25px;padding-top:18px;letter-spacing:0}.timeline{color:var(--green);letter-spacing:2px;font-size:14px}.section{padding:64px 0;border-top:1px solid var(--line)}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:30px}.section-heading .eyebrow{margin-bottom:12px}h2{font-family:Georgia,"Microsoft YaHei",serif;font-size:32px;line-height:1.35;font-weight:500;margin:0;letter-spacing:-.7px}html[lang=zh-CN] h2{font-weight:650}.section-heading>p{max-width:390px;font-size:13px;line-height:1.8;color:var(--muted);margin:0}.tool-tabs{display:flex;border-bottom:1px solid var(--line);gap:8px}.tool-tabs button{background:none;border:0;border-bottom:3px solid transparent;padding:17px 22px;color:var(--muted);font-size:14px;display:flex;gap:15px;align-items:center}.tool-tabs button span{font-size:10px;opacity:.65}.tool-tabs button[aria-selected=true]{color:var(--green);border-color:var(--green);background:#e8ede3;font-weight:650}.tool-panel{background:var(--white);border:1px solid var(--line);border-top:none;padding:32px}.tool-description{margin-bottom:25px;max-width:850px}h3{font-size:20px;line-height:1.45;margin:0 0 12px;letter-spacing:-.35px}.tool-description p{color:var(--muted);font-size:13px;line-height:1.8;margin:0}.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:17px;align-content:start}.fields label,.output>label{display:flex;flex-direction:column;font-size:12px;font-weight:600;gap:9px;line-height:1.5;min-width:0}.span2{grid-column:1/-1}input,textarea,select{width:100%;border:1px solid #bfcbbf;background:#fffefb;color:var(--ink);padding:11px 12px;border-radius:4px;min-height:44px;font-size:14px;line-height:1.6;min-width:0}textarea{resize:vertical}.result{background:#f0f3eb;min-height:330px;font-family:"Cascadia Code",Consolas,"Microsoft YaHei",monospace;font-size:12px;line-height:1.9;margin-top:9px;border:1px solid #d6ded0}.actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:12px}.small{border:1px solid var(--line);padding:10px 14px;background:transparent;border-radius:4px;font-size:12px;min-height:42px}.hint{font-size:11px;line-height:1.8;color:var(--muted);font-weight:400}.fields .hint{margin:0}.message{font-size:13px;min-height:1.6em;color:var(--green);margin-bottom:0}.budget-summary{background:var(--green);color:white;padding:25px;margin-bottom:25px;border-radius:4px}.budget-summary>span{font-size:12px}.budget-summary>strong{display:block;font-family:Georgia,serif;font-size:34px;font-weight:400;margin:10px 0 20px;overflow-wrap:anywhere}.budget-summary>div{border-top:1px solid #ffffff44;padding-top:10px}.budget-summary p{display:flex;justify-content:space-between;gap:18px;font-size:12px}.budget-summary .hint{display:block;color:#e6eee5}.articles{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.articles article{border-top:3px solid var(--green);padding-top:22px}.article-number{font-size:10px;color:var(--green);letter-spacing:1px;display:block;margin-bottom:22px}.articles h3{font-size:21px}.articles p{font-size:13px;color:var(--muted);line-height:1.9}.articles details{border-top:1px solid var(--line);margin-top:22px;padding-top:15px}.articles summary{cursor:pointer;font-size:12px;font-weight:650;line-height:1.7;list-style:none;display:flex;justify-content:space-between;gap:12px}.articles summary::-webkit-details-marker{display:none}.articles details[open] summary span{transform:rotate(45deg)}.showcase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.showcase-art{height:200px;position:relative;overflow:hidden;background:#d9e1d4}.showcase-art>span{position:absolute;left:18px;top:15px;font:12px monospace;color:#38594d}.art-shape{position:absolute;width:180px;height:110px;background:#77978b;left:45%;top:35%;box-shadow:-90px 15px 0 #a7b8a5,65px -50px 0 #c6d1be;transform:rotate(-15deg)}.art-1{background:#e9dfd0}.art-1 .art-shape{width:85px;height:105px;left:40%;background:#9d856b;border-radius:45% 45% 0 0;box-shadow:100px 15px 0 #c0ad97,-100px 15px 0 #d5c7b3;transform:none}.art-1 .art-shape:before{content:"";position:absolute;width:45px;height:50px;left:20px;top:-35px;border-radius:50%;background:#614f40}.art-2{background:#d9e3de}.art-2 .art-shape{left:45%;top:30%;border:1px solid #5c8271;background:transparent;box-shadow:-30px 25px 0 #abbeb0;transform:rotate(-28deg)}.demo-label{font-size:9px!important;color:var(--green)!important;letter-spacing:.5px;margin-top:18px}.showcase-card h3{margin-bottom:7px}.showcase-card>p{color:var(--muted);font-size:13px;line-height:1.8}.showcase-card .work-meta{font-size:11px}.about{background:#e6ecdf;margin:12px 0 65px;padding:40px;max-width:100%;border-left:4px solid var(--green)}.about h2{margin-bottom:20px}.about>p:not(.eyebrow){max-width:850px;font-size:13px;line-height:1.9}.about .hint{font-size:11px!important}footer{max-width:1320px;margin:auto;padding:25px 44px 40px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:11px;color:var(--muted)}footer a{border:1px solid var(--line);padding:10px 15px}noscript{display:block;padding:20px;text-align:center;background:#eadbc9}[hidden]{display:none!important}@media(min-width:1500px){.hero{gap:80px}.hero-board{padding:28px}.frame{height:185px}}@media(max-width:1050px){header,main{padding-left:28px;padding-right:28px}.brand-sub{display:none}.hero{gap:35px;padding:60px 0}.hero-board{padding:18px}.frame{height:140px}.board-caption{font-size:22px}nav{gap:18px}.tool-grid{gap:25px}.tool-panel{padding:25px}.section-heading>p{max-width:320px}h2{font-size:28px}.tool-tabs button{padding:15px}.articles{gap:22px}}@media(max-width:760px){header{height:auto;min-height:84px;flex-wrap:wrap;gap:16px;padding:20px}.brand{order:0}.language{order:1;margin-left:auto}nav{order:2;width:100%;justify-content:space-between;padding-top:10px;font-size:13px}main{padding:0 20px}.hero{grid-template-columns:1fr;gap:40px;padding:45px 0 55px}h1{font-size:45px;letter-spacing:-1.8px}.hero-intro{max-width:580px;font-size:15px}.hero-board{max-width:540px;width:calc(100% - 8px);justify-self:center}.frame{height:170px}.section{padding:42px 0}.section-heading{display:block;margin-bottom:25px}.section-heading>p{margin-top:16px;max-width:100%}.tool-grid{grid-template-columns:1fr;gap:26px}.tool-panel{padding:21px 17px}.tool-tabs{gap:0}.tool-tabs button{padding:15px 12px;font-size:12px;gap:7px;flex:1;justify-content:center}.tool-tabs button span{display:none}.articles,.showcase-grid{grid-template-columns:1fr;gap:35px}.articles h3{font-size:22px}.articles details{margin-top:17px}.article-number{margin-bottom:13px}.showcase-art{height:230px}.showcase-grid .art-shape{left:50%}.about{margin-bottom:40px;padding:28px 23px}.about h2{font-size:26px}footer{padding:25px 20px;flex-wrap:wrap}footer>span:first-child{flex:1 1 65%}footer>span:nth-child(2){order:2}footer a{margin-left:auto}h2{font-size:29px}}@media(max-width:380px){h1{font-size:38px}.hero-actions{gap:17px}.frame{height:135px}.board-caption{font-size:20px}.fields{grid-template-columns:1fr}.fields>*{grid-column:1/-1}.tool-tabs button{padding-left:5px;padding-right:5px;font-size:11px}}@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}}