/* 新增一排纸片入口；天空以原图上方纯色区域延长，原画保持比例。 */
body{background-size:100% auto;background-position:center bottom;background-repeat:no-repeat;background-attachment:scroll;background-color:#adebfa}
.room-grid{row-gap:48px}
.room[data-room=timeline]{--lean:2deg;--lift:0px;--tape-color:#fff2a9}
.room[data-room=sketches]{--lean:-3deg;--lift:18px;--tape-color:#80d6ff}
.room[data-room=future]{--lean:2deg;--lift:0px;--tape-color:#f06868}
.mini-tree{position:absolute;left:25%;top:33%;bottom:12%;width:8px;background:#426f49;border-radius:80% 15% 50% 10%;transform:rotate(-6deg)}
.mini-tree i{position:absolute;width:32px;height:22px;left:-25px;top:8%;background:#fffbea;border:3px solid #426f49;border-radius:90% 0 90% 0;transform:rotate(15deg)}
.mini-tree i:nth-child(2){left:3px;top:37%;transform:rotate(85deg)}.mini-tree i:nth-child(3){left:-25px;top:68%;transform:rotate(5deg)}
.mini-photo{position:absolute;width:48%;aspect-ratio:4/5;right:13%;bottom:12%;background:#fffbea;padding:10px 10px 24px;transform:rotate(9deg);box-shadow:3px 4px 0 #426f4933;transition:transform .25s}
.mini-photo span{display:block;width:100%;height:100%;background:#80d6ff;position:relative;overflow:hidden}.mini-photo span::before{content:'';position:absolute;width:140%;height:60%;background:#a3de83;bottom:-22%;left:-20%;transform:rotate(-25deg);border-radius:30%}.mini-photo span::after{content:'';position:absolute;top:12%;right:14%;width:26%;aspect-ratio:1;border-radius:50%;background:#fff2a9}
.room.is-active .mini-photo{transform:translateY(-5px) rotate(-5deg)}
.sketch-stack{position:absolute;left:22%;bottom:12%;width:55%;height:53%;background:#fffbea;box-shadow:-6px 5px 0 #e6ddca,-11px 10px 0 #fffbea;transform:rotate(-8deg)}
.sketch-stack i{position:absolute;left:17%;right:17%;top:25%;height:3px;background:#aba391;transform:rotate(-7deg)}.sketch-stack i:nth-child(2){top:43%;right:26%;transform:rotate(6deg)}.sketch-stack i:nth-child(3){top:63%;right:35%;transform:rotate(-3deg)}
.draw-pencil{position:absolute;width:12px;height:46%;background:#f06868;right:18%;bottom:13%;transform:rotate(28deg);border-left:3px solid #e35151;border-right:3px solid #ffb3a1;transition:transform .25s}.draw-pencil::before{content:'';position:absolute;bottom:-16px;left:-3px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:16px solid #fff2a9}.draw-pencil::after{content:'';position:absolute;top:-6px;left:-3px;width:12px;height:12px;background:#80d6ff;border-radius:4px 4px 0 0}.room.is-active .draw-pencil{transform:translate(-7px,-5px) rotate(16deg)}
.future-note{position:absolute;inset:23% 18% 16%;background:#fffbea;border-radius:3px;transform:rotate(-8deg);box-shadow:3px 4px 0 #747bad44}.room[data-room=future] h2{top:45%;left:0;width:100%;transform:rotate(-8deg);font-size:52px;letter-spacing:8px}
.bottom-row{margin-top:50px}
@media(max-width:700px){.room-grid{row-gap:35px}.mini-tree{width:5px}.mini-tree i{width:23px;height:15px;left:-18px;border-width:2px}.mini-tree i:nth-child(3){left:-18px}.mini-photo{padding:7px 7px 16px}.room[data-room=future] h2{font-size:38px}.draw-pencil{width:10px;height:40%}.bottom-row{margin-top:32px}}
@media(max-width:520px){.room[data-room=timeline]{--lift:15px}.room[data-room=sketches]{--lift:0px}.room[data-room=future]{--lift:14px}.bottom-row{display:grid;grid-template-columns:1fr 2fr;margin-left:0;margin-top:40px;min-height:0;gap:10px}.bottom-row .more-square{width:86%}.bottom-row .footer-friend{width:100%;max-width:100%;grid-column:2;margin-top:0;align-self:center}.mini-tree i:nth-child(2){left:2px}.site-footer{padding-top:20px}}
@media(prefers-reduced-motion:reduce){.room.is-active .mini-photo{transform:rotate(9deg)}.room.is-active .draw-pencil{transform:rotate(28deg)}}

/* 憨宇宙星轨：图案在上，标题落在左下。 */
.room[data-room=timeline] h2{top:auto;bottom:10%;left:12%;z-index:2;transform:rotate(-3deg)}
.orbit-scene{position:absolute;left:10%;top:5%;width:82%;height:66%;overflow:visible;transform:rotate(-7deg)}
.orbit-route{fill:none;stroke:#426549;stroke-width:3;stroke-dasharray:5 7;stroke-linecap:round}
.orbit-dot{fill:#fffbea}.orbit-dot.dot-blue{fill:#80d6ff}
.orbit-star{fill:#fffbea;stroke:#426549;stroke-width:1.5;stroke-linejoin:round;transform-box:fill-box;transform-origin:center;opacity:.7}
.orbit-cat{transform-origin:112px 75px;transition:transform 260ms ease}
.room.is-active .orbit-cat{transform:translateY(-4px) rotate(8deg)}
.room.is-active .orbit-star{animation:orbit-light 550ms ease both}
.room.is-active .star-one{animation-delay:180ms}.room.is-active .star-two{animation-delay:360ms}.room.is-active .star-three{animation-delay:540ms}.room.is-active .star-four{animation-delay:720ms;--star-fill:#f06868}
@keyframes orbit-light{0%{fill:#fffbea;opacity:.7;transform:scale(1)}60%{fill:var(--star-fill,#ffe56c);opacity:1;transform:scale(1.3) rotate(10deg)}100%{fill:var(--star-fill,#ffe56c);opacity:1;transform:scale(1.08)}}
@media(prefers-reduced-motion:reduce){.room.is-active .orbit-star{animation:none;fill:#ffe56c;opacity:1}.room.is-active .orbit-cat{transform:none;transition:none}}

/* 三颗笑脸星星沿弯曲虚线串联，沿用依次点亮的节奏。 */
.orbit-scene{left:7%;top:0;width:86%;height:84%;transform:none}
.orbit-route{stroke:#fff2a9;stroke-width:4;stroke-dasharray:8 10}
.orbit-star{fill:#ffe45c;stroke:none;opacity:1}
.star-face{fill:#f6c23f}.star-face path{fill:none;stroke:#f6c23f;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
@keyframes orbit-light{0%{fill:#ffe45c;opacity:1;transform:scale(1)}60%{fill:#fff2a9;opacity:1;transform:scale(1.3) rotate(10deg)}100%{fill:#ffec80;opacity:1;transform:scale(1.08)}}
.room[data-room=timeline] .second-row-spark{left:10%;right:auto;top:13%;color:#fffbea;font-size:25px}
.room[data-room=sketches] .second-row-spark{right:12%;top:18%;color:#fff2a9}
.room[data-room=future] .second-row-spark{right:11%;top:17%;color:#f06868}

/* 柔和的短虚线与统一的雪花悬停旋转。 */
.orbit-route{stroke-width:3.5;stroke-dasharray:6 9;stroke-linecap:round;stroke-linejoin:round}
.room[data-room=wallpapers] .second-row-spark{right:9%;top:12%;color:#f06868;z-index:2;font-size:32px}
.room .little-star{transform-origin:center;animation:spark-spin 2.4s linear infinite;animation-play-state:paused}
.room.is-active .little-star{animation-play-state:running}
@keyframes spark-spin{from{transform:rotate(12deg)}to{transform:rotate(372deg)}}
@media(max-width:700px){.room[data-room=wallpapers] .second-row-spark{font-size:27px}}
@media(prefers-reduced-motion:reduce){.room .little-star{animation:none}}
