/* Every narrative caption is a generated transparent lettering image, with no balloons. */
.art-caption{position:absolute;z-index:8;pointer-events:none;line-height:0;filter:drop-shadow(6px 7px 0 #000);transform:rotate(-2deg)}.art-caption img{display:block;width:100%;height:auto;max-height:32cqw;object-fit:contain}.art-thought-lines{display:grid;align-items:center}.art-thought-lines .thought-line{grid-area:1/1}.art-thought-lines .thought-line img{max-height:23cqw}.art-goodbye{left:68%;top:12%;width:23%}.art-thinking{left:46%;top:8%;width:32%}.art-idea{left:12%;top:20%;width:29%}.art-decision{right:7%;top:10%;width:28%}.art-fridge{right:7%;top:7%;width:33%}.art-cooking-1{left:8%;top:7%;width:40%}.art-cooking-2{right:8%;top:7%;width:39%}.art-cooking-3{right:7%;top:6%;width:42%}.art-cooking-4{left:9%;top:8%;width:33%}.art-photo{right:10%;top:10%;width:25%}
@media(max-width:700px){.art-caption img{max-height:46cqw}.art-goodbye{left:64%;top:6%;width:29%}.art-thinking{left:auto;right:9%;top:5%;width:48%}.art-thought-lines .thought-line img{max-height:40cqw}.art-idea{left:12%;top:57%;width:46%}.art-decision{right:5%;top:4%;width:40%}.art-fridge{right:5%;top:3%;width:43%}.art-cooking-1{left:6%;top:7%;width:68%}.art-cooking-2{right:6%;top:7%;width:65%}.art-cooking-3{right:6%;top:7%;width:68%}.art-cooking-4{left:6%;top:8%;width:59%}.art-photo{right:4%;top:37%;width:36%}}
body:not(.has-motion) .art-thought-lines{display:flex;flex-direction:column;gap:8px}body:not(.has-motion) .art-thought-lines img{max-height:12cqw}
/* Keep emphasis lettering inside the camera's maximum zoom bounds. */
.art-decision{right:10%}
@media(max-width:700px){.art-thinking{right:15%}.art-decision{right:10%;width:36%}}

.art-edition .ending-title img{filter:drop-shadow(6px 7px 0 #000)}
@media(max-width:700px){.art-caption,.art-edition .ending-title img{filter:drop-shadow(4px 5px 0 #000)}}
body:not(.has-motion) .art-caption{position:relative;inset:auto;width:min(80%,480px);margin:24px auto;transform:none}body:not(.has-motion) .art-caption img,body:not(.has-motion) .art-thought-lines img{max-height:none}body:not(.has-motion) .art-thought-lines{gap:18px}
/* Walking reactions sit in the sky positions marked in the user's references. */
.art-street{left:48%;top:13%;width:35%}.art-sidewalk{left:53%;top:11%;width:25%}
@media(max-width:700px){.art-street{left:auto;right:14%;top:8%;width:43%}.art-sidewalk{left:auto;right:17%;top:9%;width:31%}}
/* Reactions sit above the actual screen content in the same scene. */
.art-street{left:auto;right:15%;top:3%;width:28%}.art-sidewalk{left:auto;right:16%;top:3%;width:23%}
@media(max-width:700px){.art-street{right:12%;top:8%;width:42%}.art-sidewalk{right:13%;top:9%;width:35%}}
.art-street img,.art-sidewalk img{max-height:calc(var(--stage)*.17)}
/* The fridge is now the first frame in the same right-to-left kitchen montage. */
.fridge-panel .art-fridge{right:7%;top:7%;width:33%}.goodbye-scene .art-goodbye{left:68%;top:12%;width:23%}
@media(max-width:700px){.fridge-panel .art-fridge{right:5%;top:5%;width:43%}.goodbye-scene .art-goodbye{left:60%;top:8%;width:30%}}
/* In the static story, introduce the photo before showing it. */
body:not(.has-motion) .photo-panel .scene-plane{display:flex;flex-direction:column}
body:not(.has-motion) .photo-panel .art-photo{order:-1;flex:none}