/* Esconde-esconde em casa e Hábitos verdes. */
.cs-art{display:block;width:100%;height:100%;overflow:visible}
.ec-room{position:absolute;left:1%;right:1%;top:36%;bottom:3%;display:flex;flex-wrap:wrap;justify-content:space-evenly;align-items:flex-end;align-content:flex-end;gap:2cqh 1.5cqw;--u:min(16cqw,26cqh)}
.ec-room[data-count="4"]{--u:min(19cqw,30cqh)}
.ec-room[data-count="6"]{--u:min(14cqw,22cqh)}
.ap .ec-spot{position:relative;padding:0;border:0;background:none;box-shadow:none;overflow:visible;--hw:56%;--hl:22%;--hb:8%}
.ec-sofa{width:calc(var(--u)*1.6);aspect-ratio:200/120;--hw:32%;--hl:34%;--hb:8%}
.ec-curtain{width:calc(var(--u)*.9);aspect-ratio:160/236;--hw:60%;--hl:6%;--hb:2%}
.ec-wardrobe{width:calc(var(--u)*.95);aspect-ratio:160/228;--hw:40%;--hl:10%;--hb:10%}
.ec-box{width:calc(var(--u)*1.1);aspect-ratio:190/150;--hw:48%;--hl:26%;--hb:6%}
.ec-plant{width:calc(var(--u)*.85);aspect-ratio:150/196;--hw:58%;--hl:21%;--hb:12%}
.ec-table{width:calc(var(--u)*1.4);aspect-ratio:200/128;--hw:42%;--hl:29%;--hb:2%}
.ec-basket{width:calc(var(--u)*.9);aspect-ratio:160/140;--hw:56%;--hl:22%;--hb:8%}
.ec-cover{position:absolute;inset:0;z-index:2;pointer-events:none}
.ec-hider{position:absolute;z-index:1;left:var(--hl);bottom:var(--hb);width:var(--hw);aspect-ratio:1;display:grid;place-items:center;pointer-events:none;transition:translate .35s cubic-bezier(.3,1.4,.5,1),scale .35s}
.ec-hider[hidden]{display:none}
.ec-hider .art-img,.ec-hider img{width:100%;height:100%;object-fit:contain}
.ec-peek .ec-hider{translate:0 -24%;animation:ec-wiggle 1.4s ease-in-out infinite}
.ec-curtain.ec-peek .ec-hider,.ec-wardrobe.ec-peek .ec-hider,.ec-table.ec-peek .ec-hider{translate:0 0;animation:none}
.ec-hider.ec-out{z-index:3;translate:0 -70%;scale:1.12}
.ec-curtain .ec-hider.ec-out,.ec-wardrobe .ec-hider.ec-out,.ec-table .ec-hider.ec-out{translate:0 -6%}
@keyframes ec-wiggle{0%,100%{rotate:0deg}30%{rotate:-6deg}60%{rotate:6deg}}
.cs-panel,.cs-door,.cs-cloth,.cs-lid,.cs-cushion,.cs-leaves,.cs-sock{transform-box:fill-box;transition:transform .45s cubic-bezier(.3,1.3,.5,1)}
.cs-panel{transform-origin:left center}.cs-door{transform-origin:left center}.cs-cloth{transform-origin:center top}
.cs-lid{transform-origin:right bottom}.cs-cushion{transform-origin:center bottom}.cs-leaves{transform-origin:center bottom}.cs-sock{transform-origin:left bottom}
.ec-peek .cs-panel{transform:scaleX(.82)}.ec-peek .cs-door{transform:scaleX(.8)}.ec-peek .cs-cloth{transform:scaleY(.86)}
.ec-open .cs-panel{transform:scaleX(.22)}.ec-open .cs-door{transform:scaleX(.12)}.ec-open .cs-cloth{transform:scaleY(.22)}
.ec-open .cs-lid{transform:rotate(-70deg)}.ec-open .cs-cushion{transform:translateY(-40%) rotate(-12deg)}.ec-open .cs-leaves{transform:scale(1.18,.92)}.ec-open .cs-sock{transform:translate(30%,-60%) rotate(30deg)}
.ec-maya{position:absolute;left:3%;top:3%;height:min(46cqh,46cqw);aspect-ratio:.62;z-index:5;cursor:pointer;transition:height .5s,top .5s}
.ec-maya img{width:100%;height:100%;object-fit:contain}
.ec-maya.ec-seek{height:min(34cqh,34cqw);cursor:default}
.ec-glow{animation:ec-glow 1.2s ease-in-out infinite alternate}
@keyframes ec-glow{to{filter:drop-shadow(0 0 14px #fff3a0) brightness(1.06)}}
.ec-lineup{position:absolute;left:calc(5% + min(29cqh,29cqw));right:16%;top:12%;display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:2cqw;z-index:4}
.ec-runner,.ec-pal{display:grid;place-items:center;aspect-ratio:1}
.ec-runner{width:min(14cqw,20cqh)}.ec-pal{width:min(10cqw,14cqh)}
.ec-runner .art-img,.ec-pal .art-img,.ec-runner img,.ec-pal img{width:100%;height:100%;object-fit:contain}
.ec-gang{position:absolute;left:calc(5% + min(22cqh,22cqw));top:16%;right:22%;display:flex;flex-wrap:wrap;gap:1cqw;z-index:4}
.ec-flyer{z-index:20;display:grid;place-items:center;pointer-events:none}.ec-flyer .art-img,.ec-flyer img{width:100%;height:100%;object-fit:contain}
@container (max-aspect-ratio:3/4){
  .ec-room{top:38%;--u:min(28cqw,17cqh)}.ec-room[data-count="4"]{--u:min(32cqw,20cqh)}.ec-room[data-count="6"]{--u:min(25cqw,15cqh)}
  .ec-maya{height:min(28cqh,48cqw)}.ec-maya.ec-seek{height:min(22cqh,38cqw)}
  .ec-lineup{top:12%;left:40%;right:3%}.ec-runner{width:min(17cqw,10cqh)}.ec-gang{top:14%;left:34%;right:3%}.ec-pal{width:min(13cqw,8cqh)}
}

.cv-earth{position:absolute;top:2%;left:calc(50% - min(12cqw,14cqh));width:min(24cqw,28cqh);aspect-ratio:1;z-index:3;filter:saturate(calc(.6 + var(--happy,0)*.6)) drop-shadow(0 6px 10px #3f8fc233)}
.cv-row{position:absolute;left:2%;right:2%;top:32%;bottom:4%;display:grid;grid-template-columns:repeat(var(--cols),1fr);justify-items:center;align-items:end;align-content:end;gap:2cqh 1cqw;--cols:3;--h:min(52cqh,28cqw)}
.cv-row[data-count="4"]{--cols:4;--h:min(50cqh,22cqw)}.cv-row[data-count="6"]{--cols:3;--h:min(28cqh,26cqw)}
.ap .cv-item{position:relative;height:var(--h);padding:0;border:0;background:none;box-shadow:none;overflow:visible}
.cv-tap{aspect-ratio:140/156}.cv-lamp{aspect-ratio:140/192}.cv-tv{aspect-ratio:140/158}.cv-plant{aspect-ratio:170/176}.cv-trash{aspect-ratio:150/150}.cv-fridge{aspect-ratio:140/182}
.cv-hint{animation:cv-hint 1.2s ease-in-out infinite alternate}
@keyframes cv-hint{to{filter:drop-shadow(0 0 12px #fff07a) brightness(1.05)}}
.cv-item.cv-fixed::after{content:'';position:absolute;right:-4%;top:-4%;width:min(4.6cqw,6cqh);aspect-ratio:1;border-radius:50%;background:#4fbf74 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/70% no-repeat;box-shadow:0 0 0 4px #fffaf0;animation:cv-pop .4s cubic-bezier(.3,1.6,.5,1)}
@keyframes cv-pop{from{scale:0}}
.cv-handle{transform-box:fill-box;transform-origin:center;transition:transform .4s}.cv-fixed .cv-handle{transform:rotate(90deg)}
.cv-drops path{animation:cv-drip 1.2s ease-in infinite}.cv-drops path:nth-child(2){animation-delay:.4s}.cv-drops path:nth-child(3){animation-delay:.8s}
@keyframes cv-drip{from{transform:translateY(0);opacity:1}to{transform:translateY(26px);opacity:0}}
.cv-fixed .cv-drops{display:none}
.cv-glow{animation:cv-glow 1.6s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}
@keyframes cv-glow{from{opacity:.7}to{opacity:1;transform:scale(1.06)}}
.cv-fixed .cv-glow{display:none}.cv-fixed .cv-bulb{fill:#d9d2c7}.cv-fixed .cv-shade{fill:#d9b65a}
.cv-fixed .cv-cord{transform:translateY(4px)}
.cv-show{animation:cv-flick 1.4s steps(3) infinite}
@keyframes cv-flick{to{filter:hue-rotate(300deg)}}
.cv-off{opacity:0;transition:opacity .3s}.cv-fixed .cv-off{opacity:1}.cv-fixed .cv-led{fill:#ef6f6c}
.cv-up,.cv-can{opacity:0}.cv-fixed .cv-up{opacity:1}.cv-fixed .cv-wilt{opacity:0}
.cv-up,.cv-wilt{transition:opacity .4s}
.cv-watering .cv-can{opacity:1;animation:cv-tilt 1.1s ease-in-out}
.cv-can{transform-box:fill-box;transform-origin:right bottom}
@keyframes cv-tilt{0%{transform:rotate(0)}30%,80%{transform:rotate(-24deg)}100%{transform:rotate(0)}}
.cv-pour circle{animation:cv-drip .5s linear infinite}.cv-pour circle:nth-child(2){animation-delay:.16s}.cv-pour circle:nth-child(3){animation-delay:.32s}
.cv-flower{transform-box:fill-box;transform-origin:center}.cv-fixed .cv-flower{animation:cv-pop .6s cubic-bezier(.3,1.6,.5,1)}
.cv-shut{opacity:0}.cv-fixed .cv-shut{opacity:1}.cv-fixed .cv-door,.cv-fixed .cv-mist{opacity:0}
.cv-mist{animation:cv-mist 2s ease-in-out infinite alternate}
@keyframes cv-mist{to{transform:translateX(6px);opacity:.4}}
@container (max-aspect-ratio:3/4){
  .cv-earth{top:3%;width:min(34cqw,18cqh);left:calc(50% - min(17cqw,9cqh))}
  .cv-row{top:24%;--h:min(26cqh,44cqw)}.cv-row[data-count="3"]{--cols:2}.cv-row[data-count="4"]{--cols:2;--h:min(30cqh,42cqw)}.cv-row[data-count="6"]{--cols:2;--h:min(20cqh,40cqw)}
}
@media(prefers-reduced-motion:reduce){.cv-drops path,.cv-glow,.cv-show,.cv-mist,.cv-pour circle,.ec-peek .ec-hider,.ec-glow,.cv-hint{animation:none}}

/* Quadros e prateleira na parede da sala: a casa parece de verdade. */
.cs-wall{position:absolute;pointer-events:none;z-index:0}
.cs-frame{left:7%;top:9%;width:min(16cqw,20cqh);aspect-ratio:1.2}
.cs-clock{left:28%;top:7%;width:min(9cqw,12cqh);aspect-ratio:1}
.cs-hand{transform-box:view-box;transform-origin:30px 30px;animation:cs-tick 12s linear infinite}
@keyframes cs-tick{to{transform:rotate(360deg)}}
@container (max-aspect-ratio:3/4){.cv-game .cs-frame,.cv-game .cs-clock{display:none}}
.ec-game .cs-frame{left:42%;top:30%}.ec-game .cs-clock{left:72%;top:33%}
@container (max-aspect-ratio:3/4){.ec-game .cs-frame{left:12%;top:30%;width:34cqw}.ec-game .cs-clock{left:66%;top:32%;width:18cqw}}