/* Illustrated play scene: live photo cards and hit targets, never a flattened UI. */
#recall.album-mode .recall-card{background:linear-gradient(#ecfbff40,#fff2d920),url('art/album-garden-v1.webp') center/cover;border:3px solid #f7fcff;padding:20px 24px 15px;gap:10px;overflow:hidden}
#recall.album-mode .album-heading{position:relative;display:flex;align-items:center;justify-content:center;width:100%;margin:0;min-height:48px;padding:0 105px}
.album-heading h2{font-size:clamp(28px,3vw,42px)!important;color:#173d70;text-shadow:0 2px 0 #fff,0 0 12px #ffffffb3;line-height:1.1;text-align:center}
.album-progress{position:absolute;left:0;top:0;display:grid;place-items:center;min-height:44px;background:linear-gradient(#42c9ff,#078bd5);color:white;border:3px solid #d8f6ff;border-radius:26px;box-shadow:0 4px 0 #117db2;font-size:11px;letter-spacing:.06em;padding:6px 13px;white-space:nowrap}
.album-clue{display:flex;align-items:center;gap:12px;background:#ffffffed;border:2px solid #e5f7ff;border-radius:30px;padding:7px 18px 7px 9px;width:min(100%,930px);margin:0 auto;box-shadow:0 4px 12px #578da51a;min-height:57px}
#recall.album-mode #recallQuestion{background:none;border:0;max-width:none;margin:0;padding:0;color:#183c66;font-size:clamp(18px,1.8vw,25px);line-height:1.35;flex:1;text-align:left}
#recall.album-mode #hearRecall{position:static;flex:none;width:42px;height:42px;min-height:42px;box-shadow:none;background:transparent;color:#098ee3;font-size:26px;border-radius:50%;margin:0;padding:0;opacity:1}
#recall.album-mode #hearRecall.playing{background:#e1f4ff;box-shadow:0 0 0 4px #a9dfff66}
.album-scene{position:relative;isolation:isolate;width:100%;height:clamp(300px,34svh,430px);margin:2px auto 0}
.memory-book{position:absolute;left:0;bottom:0;width:84%;height:100%;min-height:0;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:6%;padding:clamp(27px,4svh,44px) 7% 32px 6%;border:0;border-radius:0;background:url('art/album-book-v1.webp') center/100% 100% no-repeat;box-shadow:none;z-index:1}
.memory-book::after{display:none}.album-left,.album-right{min-width:0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center}
.album-photo-slot{width:100%;max-width:none;height:clamp(160px,22svh,255px);min-height:115px;display:flex;align-items:center;justify-content:center;border:3px dashed #d7b98e;background:#f8e6c52e;border-radius:16px;padding:8px;box-shadow:inset 0 0 25px #b79a6620;transform:none;opacity:1!important}
.album-photo-slot.photo-ready{background:#fff1b66b;box-shadow:0 0 0 5px #ffcf6455,inset 0 0 20px #f3dc9a55;border-color:#cd9a3d}
.album-silhouette{width:92%;height:92%;color:#8e7959;opacity:.30;pointer-events:none;filter:drop-shadow(0 2px 1px #fff5)}
.album-page-title{font-family:Froople,'Trebuchet MS',sans-serif;font-size:clamp(19px,2vw,28px);line-height:1.12;margin:0;color:#715275;text-shadow:0 1px 0 #fff8}
.album-photo-slot.filled{border:8px solid #fffef7;border-bottom-width:15px;background:#fffef7;transform:rotate(-2deg);border-radius:7px;box-shadow:0 5px 9px #75604455}
.album-photo-slot.filled img{width:100%;height:100%;object-fit:cover;object-position:center 17%;border-radius:3px}
.album-right{padding-right:15%;gap:8px;align-self:center}.album-book-title{font-size:clamp(20px,2vw,27px)!important;line-height:1.15;margin:0;color:#7b5370}.album-book-subtitle{font-size:12px;margin:0;color:#8b745a}.album-keepsakes{width:100%;gap:8px;margin:4px 0 0}.album-keepsake{flex:1;min-width:0;width:30%;padding:4px 4px 6px;border-radius:5px;background:#ecd6ae55;border-color:#c5a576}.album-keepsake img,.album-empty-stamp{height:clamp(42px,6svh,75px)}.album-small-label{font-size:9px;color:#8e735c}.album-star-sticker{font-size:48px;line-height:1;color:#ffd15c;filter:drop-shadow(0 3px 0 #cc9639);-webkit-text-stroke:2px #fff7d7;transform:rotate(15deg);margin-top:3px}.album-pals-message{max-width:170px;font-size:12px;line-height:1.3;font-style:italic;color:#9b7450;margin:0;align-self:center}
.album-story-dodu{position:absolute;right:-2%;bottom:-1%;width:31%;height:104%;object-fit:contain;object-position:center bottom;pointer-events:none;z-index:2;filter:drop-shadow(0 9px 5px #6b64352b)}
.album-dodu-cheer{position:absolute;right:5%;top:3%;z-index:3;background:#fff6b8;color:#855b2d;border:3px solid white;border-radius:30px;padding:8px 16px;font-family:Froople,'Trebuchet MS',sans-serif;font-size:27px;transform:rotate(9deg);opacity:0;pointer-events:none}
.album-placed .album-story-dodu{animation:albumDoduHappy .75s ease-in-out}.album-placed .album-dodu-cheer{opacity:1;animation:albumDoduHappy .75s ease-in-out}
.album-photo-tray{width:min(880px,100%);gap:28px;margin:13px auto 0;isolation:isolate}.album-loose-photo{max-width:265px;min-height:165px;font-size:18px;gap:8px;padding:10px 10px 12px;border:3px solid #fffdf4;border-radius:15px;box-shadow:0 6px 0 #c2a179,0 9px 12px #725a3633}.album-loose-photo img{height:clamp(100px,12svh,155px);border-radius:8px;object-position:center 14%}.album-loose-photo[data-photo=orca] img{object-position:70% 13%}.album-loose-photo[data-photo=polar] img{object-position:center 8%}.album-loose-photo[data-photo=whale-shark] img{object-position:center 4%}.album-loose-photo[data-photo=fireworks] img{object-position:center 5%}.album-loose-photo:disabled{opacity:.92!important;filter:none}.album-loose-photo.selected{outline:4px solid #ffce4a;border-color:#fff6b9}.album-drag-note{font-size:12px;margin:9px auto 0;background:#fff9e6cf;padding:5px 14px;border-radius:20px;width:fit-content;color:#806c50}
.album-finished .album-scene{height:clamp(290px,34svh,420px)}.album-finished .memory-book{position:absolute;width:84%;height:100%;min-height:0;padding:35px 4% 40px;background:url('art/album-book-v1.webp') center/100% 100% no-repeat;gap:17px;grid-template-columns:repeat(3,minmax(0,1fr))}.album-finished .album-story-dodu{width:18%;height:88%;right:-1%;bottom:0}.album-finished .album-dodu-cheer{display:none}.album-final-photo{padding:7px 7px 11px}.album-final-photo img{height:clamp(150px,21svh,250px)}.album-final-photo h3{font-size:clamp(17px,1.7vw,23px);line-height:1.1;margin:9px 0 0}.album-finished .album-drag-note{font-size:15px}.album-complete .album-clue{justify-content:center}.album-complete #recallQuestion{text-align:center!important}
@keyframes albumDoduHappy{25%{translate:0 -9px;rotate:-2deg}70%{translate:0 -3px;rotate:2deg}}
@media(max-height:900px) and (min-width:900px){#recall.album-mode .recall-card{padding:12px 20px;gap:8px}.album-heading h2{font-size:30px!important}.album-clue{min-height:47px;padding:3px 12px 3px 7px}#recall.album-mode #recallQuestion{font-size:18px}.album-scene{height:260px}.memory-book{padding:25px 7% 27px 6%}.album-photo-slot{height:165px}.album-book-title{font-size:21px!important}.album-star-sticker{font-size:37px}.album-pals-message{font-size:10px}.album-book-subtitle{font-size:10px}.album-keepsake img,.album-empty-stamp{height:42px}.album-small-label{font-size:8px}.album-page-title{font-size:21px}.album-photo-tray{gap:25px;margin-top:7px;width:min(770px,100%)}.album-loose-photo{max-width:230px;min-height:135px;font-size:16px;padding:7px 7px 10px;gap:5px}.album-loose-photo img{height:91px}.album-drag-note{font-size:11px;margin-top:8px}.album-finished .album-scene{height:285px}.album-final-photo img{height:170px}}
@media(max-width:650px){#recall.album-mode .recall-card{padding:12px 7px;gap:10px}#recall.album-mode .album-heading{padding:0 0 0 73px;min-height:47px}.album-heading h2{font-size:24px!important;text-align:left}.album-progress{font-size:9px;padding:5px 7px;min-height:40px;max-width:68px;white-space:normal;text-align:center;border-width:2px}.album-clue{gap:5px;padding:6px 9px 6px 5px;border-radius:22px;min-height:60px}#recall.album-mode #recallQuestion{font-size:16px}#recall.album-mode #hearRecall{width:36px;height:40px;min-height:40px;font-size:23px}.album-scene{height:245px}.memory-book{width:88%;padding:24px 8% 28px 7%;gap:8%;grid-template-columns:1.1fr .9fr}.album-photo-slot{height:135px;min-height:100px;padding:3px;border-radius:10px;border-width:2px}.album-page-title{font-size:17px}.album-left{gap:8px}.album-right{padding-right:7%;gap:6px}.album-book-title{font-size:17px!important}.album-book-subtitle,.album-pals-message,.album-small-label{display:none}.album-keepsakes{flex-wrap:wrap;gap:4px;width:78%}.album-keepsake{width:40%;min-width:35%;padding:3px;flex:initial}.album-keepsake img,.album-empty-stamp{height:34px}.album-empty-stamp{font-size:22px}.album-star-sticker{font-size:29px}.album-story-dodu{width:34%;height:100%;right:-5%;bottom:-3%}.album-dodu-cheer{font-size:19px;padding:5px 10px;right:0;top:5%}.album-photo-tray{gap:9px;margin-top:5px}.album-loose-photo{padding:5px 5px 8px;min-height:105px;font-size:12px;gap:6px;border-width:2px;border-radius:10px}.album-loose-photo img{height:72px;border-radius:5px}.album-drag-note{font-size:10px;padding:5px 9px;line-height:1.4;text-align:center}.album-finished .album-scene{height:260px}.album-finished .memory-book{width:100%;padding:30px 6% 40px;gap:8px}.album-finished .album-story-dodu{display:none}.album-final-photo img{height:130px}.album-final-photo{padding:4px 4px 9px}.album-final-photo h3{font-size:14px}.album-finished .album-drag-note{font-size:12px}}
@media(prefers-reduced-motion:reduce){.album-story-dodu,.album-dodu-cheer{animation:none!important}}
.album-pals-message{display:none}
@media(max-height:900px) and (min-width:900px){.album-photo-slot{height:145px}.album-left{gap:7px}.memory-book{padding-bottom:43px}.album-page-title{font-size:20px}.album-right{gap:6px}}
