*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0}body{overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;background:#c9d7df}.scene{position:relative;width:100%;height:100%;min-height:520px;overflow:hidden;background:linear-gradient(#a9c0d1 0 33%,#c8d4c2 33% 52%,#617968 52% 100%)}
.sky{position:absolute;inset:0 0 43%;background:radial-gradient(circle at 22% 25%,rgba(255,255,255,.8),transparent 18%),radial-gradient(circle at 62% 18%,rgba(255,255,255,.45),transparent 17%),linear-gradient(180deg,#9db7ca,#d6d8c8)}
.mountain{position:absolute;filter:blur(1px);opacity:.75;bottom:38%;border-radius:50% 50% 0 0;background:linear-gradient(160deg,#5a775e,#324f42)}.mountain-a{width:72%;height:35%;left:-18%;transform:rotate(6deg)}.mountain-b{width:75%;height:31%;right:-19%;transform:rotate(-5deg);background:linear-gradient(200deg,#678567,#3b5b48)}
.water{position:absolute;left:0;right:0;bottom:0;height:48%;background:linear-gradient(180deg,rgba(46,75,63,.72),rgba(24,48,42,.97));box-shadow:inset 0 20px 35px rgba(255,255,255,.12)}.water:before,.water:after{content:"";position:absolute;left:8%;right:8%;height:1px;background:rgba(255,255,255,.18);box-shadow:0 28px rgba(255,255,255,.11),0 64px rgba(255,255,255,.09),0 105px rgba(255,255,255,.07)}.water:before{top:18%}.water:after{top:57%;left:25%;right:18%}
.pavilion{position:absolute;right:6%;bottom:31%;width:min(35vw,430px);height:min(43vw,430px);filter:drop-shadow(0 18px 15px rgba(0,0,0,.33))}.roof{position:absolute;left:4%;right:2%;height:18%;background:#252d29;clip-path:polygon(0 72%,12% 56%,22% 40%,39% 30%,61% 30%,79% 40%,91% 56%,100% 72%,88% 67%,77% 63%,50% 58%,23% 63%,11% 67%)}.roof-top{top:3%}.roof-low{top:47%;transform:scaleX(1.08)}.house{position:absolute;left:20%;right:15%;top:17%;height:51%;background:linear-gradient(90deg,#5e2e25,#8d4934 45%,#53291f);border:4px solid #45231d;display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:9% 5%}.house span{background:repeating-linear-gradient(90deg,#1b2421 0 2px,transparent 2px 10px),repeating-linear-gradient(0deg,#1b2421 0 2px,#d0a27f 2px 9px);opacity:.72;border:2px solid #43231d}
.tree{position:absolute;border-radius:50%;background:radial-gradient(circle at 35% 35%,#668458 0 8%,#2f5e3d 35%,#163c2c 70%);filter:drop-shadow(0 12px 16px rgba(0,0,0,.25))}.tree-left{width:36vw;height:36vw;min-width:320px;min-height:320px;left:-15vw;top:-11vw}.tree-right{width:23vw;height:23vw;right:-8vw;top:4vw}
.search-shell{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);width:min(74vw,1030px);z-index:10}.search-form{height:82px;display:flex;align-items:stretch;border:5px solid #2f75bf;border-radius:43px;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.28),inset 0 0 0 2px #d7e1ee;overflow:hidden}.search-form input{flex:1;min-width:0;border:0;outline:none;background:transparent;padding:0 28px;font-size:30px;color:#202124;-webkit-appearance:none}.search-form input::-webkit-search-cancel-button{display:none}.search-form button{width:88px;border:0;background:#2f75bf;display:flex;align-items:center;justify-content:center;cursor:pointer}.search-form button:hover{background:#2869ac}.glass{width:26px;height:26px;border:5px solid white;border-radius:50%;position:relative}.glass:after{content:"";position:absolute;width:15px;height:5px;background:#fff;border-radius:3px;right:-12px;bottom:-7px;transform:rotate(48deg);transform-origin:left center}
@media(max-width:700px){.search-shell{width:88vw;top:48%}.search-form{height:62px;border-width:4px;border-radius:33px}.search-form input{font-size:22px;padding:0 18px}.search-form button{width:68px}.glass{width:21px;height:21px;border-width:4px}.pavilion{right:-6%;bottom:35%;width:55vw;height:55vw}.tree-left{left:-35vw;top:-12vw}.mountain-a{width:100%;left:-35%}}