/* Shared session scenes for web and Mini Program. */
.reading-victory { padding: 0; overflow: hidden; border-radius: 24px; background: #fffdf6; text-align: center; color: #194e48; box-shadow: 0 12px 32px rgba(43, 92, 73, .09); }
.victory-scene { position: relative; height: 216px; overflow: hidden; background: #dff4ed; }
.victory-cloud { position: absolute; width: 62px; height: 17px; border-radius: 30px; background: #fffdf6; opacity: .9; }
.victory-cloud::before, .victory-cloud::after { content: ''; position: absolute; border-radius: 50%; background: inherit; }
.victory-cloud::before { width: 27px; height: 27px; left: 10px; top: -13px; }
.victory-cloud::after { width: 34px; height: 34px; right: 6px; top: -18px; }
.victory-cloud-left { top: 69px; left: 7%; }
.victory-cloud-right { top: 42px; right: 6%; transform: scale(.7); }
.victory-hill { position: absolute; width: 180px; height: 136px; border-radius: 50% 50% 0 0; bottom: -43px; background: #b8dfb4; }
.victory-hill-left { left: -48px; transform: rotate(18deg); }
.victory-hill-right { right: -48px; background: #cae8be; transform: rotate(-18deg); }
.victory-stars { position: absolute; top: 15px; left: 0; right: 0; display: flex; align-items: center; justify-content: center; gap: 12px; }
.victory-star { display: block; color: #f9c647; font-size: 42px; line-height: 1.3; text-shadow: 0 3px 0 #d7992c, 0 6px 0 rgba(255,255,255,.7); animation: victory-star-pop .65s .12s backwards; }
.victory-star-middle { font-size: 57px; margin-top: -5px; animation-delay: .3s; }
.victory-star-last { animation-delay: .48s; }
.victory-pole { position: absolute; bottom: 28px; left: 66%; width: 5px; height: 123px; border-radius: 5px; background: #466c58; }
.victory-pole::before { content: ''; position: absolute; width: 13px; height: 13px; border-radius: 50%; top: -7px; left: -4px; background: #f4bf42; }
.victory-flag { display: block; position: absolute; top: 7px; left: 5px; width: 48px; height: 34px; border-radius: 0 8px 8px 0; background: #ed9d43; color: #fffdf6; font-size: 24px; line-height: 34px; animation: victory-flag-rise .85s .2s backwards; }
.victory-book { position: absolute; bottom: 33px; left: 35%; width: 68px; height: 79px; box-sizing: border-box; border: 4px solid #176f68; border-radius: 9px 15px 15px 9px; background: #35a397; transform: rotate(-8deg); box-shadow: inset 6px 0 0 #1e887f, 0 7px 0 rgba(44,99,70,.12); animation: victory-book-hop .85s .25s backwards; }
.victory-book::before { content: ''; position: absolute; bottom: -10px; left: 1px; width: 20px; height: 11px; border-radius: 6px; background: #176f68; box-shadow: 36px 0 0 #176f68; }
.victory-book::after { content: ''; position: absolute; bottom: 0; right: 0; left: 7px; height: 9px; border-radius: 5px 0 7px 5px; background: #fff4d6; box-shadow: inset 0 3px 0 #d9d5b7; }
.victory-eye { position: absolute; top: 19px; width: 6px; height: 9px; border-radius: 50%; background: #123f3b; }
.victory-eye-left { left: 18px; }
.victory-eye-right { right: 13px; }
.victory-smile { position: absolute; top: 30px; left: 25px; width: 13px; height: 8px; border-radius: 0 0 12px 12px; background: #123f3b; }
.victory-cheek { position: absolute; top: 30px; left: 11px; width: 9px; height: 5px; border-radius: 50%; background: #f8b790; box-shadow: 35px 0 0 #f8b790; }
.victory-book-star { position: absolute; top: 39px; left: 24px; color: #ffe299; font-size: 17px; line-height: 1; }
.victory-ground { position: absolute; bottom: 0; left: 0; right: 0; height: 25px; border-top: 9px solid #76ae68; background: repeating-linear-gradient(90deg, #e6c394 0, #e6c394 35px, #f4dbb5 35px, #f4dbb5 38px); box-shadow: inset 0 4px 0 #bd9d72; }
.victory-confetti { position: absolute; left: 15%; top: 4px; width: 7px; height: 12px; border-radius: 2px; background: #edaa46; opacity: 0; animation: victory-confetti-fall 1.35s .25s backwards; }
.victory-confetti-two { left: 27%; top: 23px; background: #429e90; animation-delay: .42s; }
.victory-confetti-three { left: 74%; top: 0; background: #e58e73; animation-delay: .18s; }
.victory-confetti-four { left: 84%; top: 35px; background: #429e90; animation-delay: .5s; }
.victory-copy { padding: 20px 22px 17px; }
.victory-kicker { display: block; color: #a16a25; font-size: 11px; font-weight: 800; letter-spacing: 2px; line-height: 1.3; }
.reading-victory .victory-title { display: block; margin: 9px 0 10px; color: #194e48; font-size: 28px; line-height: 1.25; font-weight: 900; letter-spacing: -.8px; }
.victory-tally { display: block; margin: 0; font-size: 13px; line-height: 1.5; color: #667a6c; }
.reading-victory .victory-note { display: block; margin: 12px 0 18px; font-size: 14px; line-height: 1.5; color: #486559; }
.reading-victory .victory-rest { display: block; box-sizing: border-box; margin: 0; width: 100%; min-height: 48px; padding: 12px 16px; border: 0; border-radius: 14px; background: #168b7c; color: #fffdf6; font-size: 16px; line-height: 24px; font-weight: 800; box-shadow: 0 4px 0 #10695f; transition: transform .15s, box-shadow .15s; }
.reading-victory .victory-rest:active { transform: translateY(3px); box-shadow: 0 1px 0 #10695f; }
.reading-victory .victory-again { display: block; margin: 12px auto 0; padding: 8px 18px; min-height: 40px; border: 0; background: transparent; color: #647a6c; font-size: 13px; line-height: 24px; }
@keyframes victory-star-pop { 0% { opacity: 0; transform: translateY(18px) scale(.25) rotate(-20deg); } 65% { opacity: 1; transform: translateY(-4px) scale(1.16) rotate(5deg); } 100% { transform: none; } }
@keyframes victory-flag-rise { from { opacity: 0; transform: translateY(67px); } to { opacity: 1; transform: translateY(0); } }
@keyframes victory-book-hop { 0% { transform: translateY(10px) rotate(-8deg); } 45% { transform: translateY(-22px) rotate(5deg); } 75% { transform: translateY(0) rotate(-12deg); } 100% { transform: rotate(-8deg); } }
@keyframes victory-confetti-fall { 0% { opacity: 0; transform: translateY(-15px) rotate(0); } 15% { opacity: 1; } 75% { opacity: 1; } 100% { opacity: 0; transform: translateY(130px) rotate(220deg); } }
@media (max-width: 350px), (max-height: 650px) { .victory-scene { height: 168px; } .victory-stars { top: 3px; } .victory-star { font-size: 31px; } .victory-star-middle { font-size: 43px; } .victory-pole { height: 105px; } .victory-book { width: 59px; height: 67px; left: 31%; } .victory-copy { padding: 14px 18px 10px; } .reading-victory .victory-title { font-size: 25px; margin: 8px 0; } .reading-victory .victory-note { margin: 8px 0 13px; font-size: 13px; } .reading-victory .victory-again { margin-top: 8px; } }
@media (prefers-reduced-motion: reduce) { .victory-star, .victory-flag, .victory-book, .victory-confetti { animation: none; } .reading-victory .victory-rest { transition: none; } }

.victory-rest::after, .victory-again::after { border: 0; }

/* The welcome reuses the same book and landscape, before the celebration. */
.session-welcome .victory-scene { height: 190px; }
.session-welcome .victory-stars, .session-welcome .victory-confetti { display: none; }
.session-welcome .victory-book { left: 41%; bottom: 34px; transform: translateX(-50%) rotate(-8deg) scale(1.24); animation: welcome-book-hello .85s .1s backwards; }
.session-welcome .victory-flag { animation: none; }
.session-welcome .victory-copy { padding-bottom: 27px; animation: welcome-copy-in .4s .1s backwards; }
.session-welcome .victory-rest:focus-visible { outline: 3px solid #a16a25; outline-offset: 5px; }
@keyframes welcome-book-hello { from { opacity: 0; transform: translateX(-50%) translateY(12px) rotate(-14deg) scale(1.15); } 65% { opacity: 1; transform: translateX(-50%) translateY(-5px) rotate(2deg) scale(1.24); } to { transform: translateX(-50%) rotate(-8deg) scale(1.24); } }
@keyframes welcome-copy-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 350px), (max-height: 650px) { .session-welcome .victory-scene { height: 164px; } .session-welcome .victory-copy { padding-bottom: 22px; } }
@media (prefers-reduced-motion: reduce) { .session-welcome .victory-book, .session-welcome .victory-copy { animation: none; } }