/* V21: image-led finish scene. Only four learning glyphs/pinyin and accessible controls are live. */
#stage[data-phase="finish"] #learningPanelArt{display:none}
#stage[data-phase="finish"] #finishPanel{left:0;top:0;width:1920px;height:1080px;background:url('assets/images/v21/finish-background.png') center/100% 100% no-repeat;border:0;border-radius:0;z-index:10}
#stage[data-phase="finish"] #finishPanel::before{display:none}
#finishPanel .finish-title,#finishPanel .finish-subtitle,#finishPanel .finish-summary>h3,#finishPanel .finish-copy,#finishPanel .finish-next{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;clip-path:inset(50%)!important;overflow:hidden!important;white-space:nowrap!important}
#finishPanel .finish-seal,#finishPanel .finish-companion::after{display:none}
#finishPanel .finish-summary{position:absolute;inset:0;width:1920px;height:1080px}
#finishPanel .finish-words{position:absolute;left:689px;top:434px;display:grid;grid-template-columns:repeat(4,194px);gap:29px;margin:0;width:auto}
#finishPanel .finish-words>div{position:relative;width:194px;height:184px;border:0;border-radius:0;background:none;box-shadow:none;display:grid;place-content:center;animation:none}
#finishPanel .finish-words span:not(.py){font:153px/1 LessonKai;color:#236c5e}
#finishPanel .finish-words span.py{position:absolute;top:-57px;left:0;right:0;text-align:center;font-size:36px;line-height:45px;color:#1a5351}
#finishPanel .finish-companion{left:140px;top:265px;width:550px;height:750px;pointer-events:none}
#finishPanel .finish-companion>img{left:0;bottom:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 12px #8e996b24)}
#stage[data-phase="finish"] .caption{inset:0;width:1920px;height:1080px;pointer-events:none;z-index:14}
#stage[data-phase="finish"] .caption .actions{position:absolute;inset:0;margin:0;pointer-events:none}
#stage[data-phase="finish"] .caption button{position:absolute;top:943px;height:90px;min-height:0;border:0;border-radius:30px;background:transparent;box-shadow:none;color:transparent;padding:0;pointer-events:auto;font-size:0;animation:none}
#stage[data-phase="finish"] #replayGate{left:640px;width:283px}
#stage[data-phase="finish"] #reviewWords{left:963px;width:309px}
#stage[data-phase="finish"] .caption button:hover{box-shadow:0 0 0 4px #ffe6a980}
#stage[data-phase="finish"] .caption button:focus-visible{outline:5px solid #d59d35;outline-offset:5px}
@media(prefers-reduced-motion:no-preference){
#stage[data-phase="finish"] .finish-companion{animation:finish-cloud-arrival 1.1s cubic-bezier(.12,.72,.24,1) both}
}
@keyframes finish-cloud-arrival{0%{opacity:0;transform:translate(-550px,200px) rotate(-14deg) scale(.78)}65%{opacity:1;transform:translate(22px,-17px) rotate(2deg) scale(1.025)}100%{opacity:1;transform:none}}