#memory {position:relative;aspect-ratio:16/9;max-width:960px;margin:auto;overflow:hidden;background:#080707}
#memory[hidden]{display:none}
#memory-world{position:absolute;width:100%;aspect-ratio:16/9;top:50%;transform:translateY(-50%);background:center/100% 100% no-repeat}
#memory.art-ready #memory-world{background-image:url(memory-room.webp)}
#memory #player{width:12%;height:34%;z-index:4}
#memory-reveal{position:absolute;top:14%;left:48%;font:clamp(11px,1.6vw,21px) Georgia,serif;letter-spacing:.18em;color:#ccbca4;opacity:0;transition:opacity 1.3s;text-shadow:0 2px 6px #000;pointer-events:none}
#memory-reveal.visible{opacity:.85}
.memory-object{display:none}
.memory-photo-object{left:8.3%;top:45%;width:3.4%;height:9.5%;transform:rotate(-4deg)}
.memory-drawing-object{left:77%;top:29%;width:9%;height:13%;transform:rotate(-8deg)}
#memory-view{padding:8px 8px 10px;background:transparent;color:#d4c4ae;border:0;max-width:min(88vw,760px);max-height:90dvh;overflow:auto;text-align:center;box-sizing:border-box}
#memory-view::backdrop{background:rgba(0,0,0,.87)}
#memory-view img{display:block;max-width:100%;max-height:70dvh;object-fit:contain;margin:auto}
#memory-view [hidden]{display:none}
#memory-close{margin-top:14px;background:#161311;color:#c7b8a2;border:1px solid #5a4c3c}
#memory-note{box-sizing:border-box;width:min(76vw,570px);padding:clamp(30px,8vw,90px);background:#baaa8a;color:#302a22;box-shadow:inset 0 0 65px #564733;font:clamp(21px,4vw,34px)/1.8 'Bradley Hand','Segoe Print',cursive;transform:rotate(-1deg)}
@media(max-width:650px){#memory{aspect-ratio:1.2}#memory-reveal{left:43%;font-size:11px}}
@media(prefers-reduced-motion:reduce){#memory-reveal{transition:none}}
#memory-exit{position:absolute;left:0;bottom:23%;width:4.5%;height:39%;background:#020202;clip-path:polygon(0 0,90% 3%,100% 21%,92% 48%,100% 79%,87% 100%,0 100%);opacity:0;transition:opacity 1s;pointer-events:none;box-shadow:inset -3px 0 #625647;z-index:3}
#memory-exit.unlocked{opacity:1}
.memory-complete #memory-world{animation:memory-settle .55s ease-out}
.memory-complete::after{content:'';position:absolute;inset:0;background:#b89468;pointer-events:none;z-index:5;opacity:0;animation:memory-light 1.1s ease-out}
@keyframes memory-settle{0%,100%{transform:translateY(-50%)}20%{transform:translate(2px,calc(-50% + 1px))}40%{transform:translate(-2px,calc(-50% - 1px))}65%{transform:translate(1px,-50%)}}
@keyframes memory-light{0%,100%{opacity:0}20%{opacity:.13}55%{opacity:.025}}
.stage4-placeholder{background:#000}
.stage4-placeholder header{display:none}
#stage4{min-height:80vh;display:grid;place-items:center;color:#b9b0a3;letter-spacing:.2em;font-family:Georgia,serif}
#stage4[hidden]{display:none}
@media(prefers-reduced-motion:reduce){.memory-complete #memory-world{animation:none}}
