.house{
  position:absolute; left:50%; transform:translateX(-50%);
  bottom:calc(var(--river-height) + 2vh);
  width:520px; height:340px; cursor:pointer; transition:transform .25s ease;
  filter:drop-shadow(0 16px 18px rgba(0,0,0,.25));
}
.house:hover{transform:translateX(-50%) translateY(-6px)}
.body{
  position:absolute; left:50%; transform:translateX(-50%); bottom:0;
  width:440px; height:220px; background:var(--house-body);
  border:8px solid var(--house-border); border-radius:8px; box-shadow:inset 0 -10px 0 rgba(0,0,0,.08);
}
.roof{
  position:absolute; left:50%; transform:translateX(-50%); bottom:220px; width:0; height:0;
  border-left:260px solid transparent; border-right:260px solid transparent; border-bottom:120px solid var(--roof);
  filter:drop-shadow(0 8px 6px rgba(0,0,0,.25));
}
.gable{
  position:absolute; left:50%; transform:translateX(-50%); bottom:234px;
  width:280px; height:120px; background:#e7d9d1; clip-path:polygon(50% 0, 100% 55%, 100% 100%, 0 100%, 0 55%);
  box-shadow:inset 0 0 0 6px #d0b7a6;
}
.chimney{position:absolute; left:70px; bottom:280px; width:40px; height:120px; background:#8b4a39; border-radius:6px; box-shadow:inset 0 0 0 3px #0002}
.smoke{position:absolute; left:88px; bottom:400px; width:14px; height:14px; border-radius:50%; background:#ffffff90; filter:blur(1px); animation:puff 5s ease-in-out infinite}
.s2{left:104px; animation-delay:1.6s}
@keyframes puff{0%{transform:translateY(0) scale(.6);opacity:0}20%{opacity:.8}100%{transform:translateY(-90px) scale(1.8);opacity:0}}
.window{
  position:absolute; top:54px; width:70px; height:84px; border-radius:10px;
  background:linear-gradient(#fff6b8, #e6f7ff); border:6px solid #c2d7e6; box-shadow:inset 0 0 0 3px #0001;
  animation:windowLight var(--dur-daynight) linear infinite;
}
.w1{left:52px} .w2{right:52px}
@keyframes windowLight{0%,49%{background:linear-gradient(#fff6b8, #e6f7ff)}51%,100%{background:#ffd65d; box-shadow:0 0 16px #ffd65d80}}
.door{
  position:absolute; left:50%; transform:translateX(-50%); bottom:16px;
  width:110px; height:140px; background:linear-gradient(#f1cc78,#e1b45f);
  border-radius:28px 28px 8px 8px; box-shadow:inset -4px 0 0 rgba(0,0,0,.08), 0 2px 0 rgba(0,0,0,.15);
}
.door .knob{position:absolute; right:16px; top:66px; width:12px; height:12px; border-radius:50%; background:#7a552f}
.pillar{position:absolute; bottom:0; width:18px; height:220px; background:#2b211d; border-radius:6px; box-shadow:inset 0 0 0 3px #0005}
.p1{left:118px} .p2{left:200px} .p3{right:200px} .p4{right:118px}
.house:hover .window{transform:translateY(-2px);box-shadow:0 0 18px rgba(180,230,255,.7)}