/* Pet motion accompanies confirmed classroom actions; painting and scores stay authoritative. */
:root{--pet-motion-soft:5.6s;--pet-motion-sad:6s;--pet-motion-response:1.2s;--pet-motion-ease:cubic-bezier(.16,1,.3,1)}
.pet-canvas{position:relative;overflow:visible}
.pet-art-window{position:relative;aspect-ratio:1;border-radius:16px}
.stage .pet-art-window{box-shadow:var(--shadow)}
.pet-canvas .pet-painting{width:100%;height:100%;display:block;object-fit:contain;border-radius:16px;transform-origin:50% 86%;animation:pet-breathe var(--pet-motion-soft) ease-in-out infinite;animation-play-state:paused}
.pet-canvas[data-pet-form="egg"] .pet-painting{animation-name:pet-egg;animation-duration:6.4s}
.pet-canvas[data-pet-mood="hungry"] .pet-painting,.pet-canvas[data-pet-mood="reset"] .pet-painting{filter:saturate(.6) brightness(.94);animation-name:pet-droop;animation-duration:var(--pet-motion-sad)}
.pet-expression{position:relative;z-index:2;flex:none;width:46px;height:49px;pointer-events:none;transform:rotate(-8deg);transform-origin:38% 72%}
.pet-expression>svg{display:block;width:100%;height:100%;overflow:visible}
.expression-paper{fill:var(--surface);stroke:var(--gold);stroke-width:1}
.pet-blush{fill:var(--rose);opacity:.23}
.face-line{fill:none;stroke:var(--ink);stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.eye-fill{fill:var(--ink)}.eye-shine{fill:var(--surface)}
.pet-smile{fill:var(--rose);stroke:var(--ink);stroke-width:2;stroke-linejoin:round}
.pet-tear{fill:var(--pale);stroke:var(--jade);stroke-width:1.4;animation:pet-teardrop 3.8s ease-in-out infinite;animation-play-state:paused}
.pet-eyes{transform-box:fill-box;transform-origin:center;animation:pet-blink 6.2s ease-in-out infinite;animation-play-state:paused}
.pet-sparks{position:absolute;inset:0;pointer-events:none;z-index:1}
.pet-spark{position:absolute;width:21px;height:21px;stroke:var(--gold);stroke-width:1.6;fill:var(--gold-light);animation:pet-glimmer 4.8s ease-in-out infinite;animation-play-state:paused}
.spark-one{right:19%;top:14%}.spark-two{left:13%;bottom:29%;stroke:var(--rose);fill:var(--surface);animation-delay:-2.4s}
.pet-canvas[data-pet-mood="hungry"] .pet-sparks,.pet-canvas[data-pet-mood="reset"] .pet-sparks{display:none}
.pet-action-trail{position:absolute;inset:0;pointer-events:none;z-index:3}
.trail-piece{position:absolute;width:28px;height:28px;stroke:var(--jade);fill:var(--gold-light);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.trail-0{left:28%;top:49%;--drift-x:-22px;--drift-y:-76px}
.trail-1{left:65%;top:42%;--drift-x:26px;--drift-y:-86px}
.trail-2{left:50%;top:24%;--drift-x:9px;--drift-y:-50px}
.pet-canvas[data-pet-reaction="stroke"] .trail-piece{stroke:var(--rose);fill:var(--surface)}
.pet-motion-enabled .pet-canvas.motion-visible .pet-painting,
.pet-motion-enabled .pet-canvas.motion-visible .pet-eyes,
.pet-motion-enabled .pet-canvas.motion-visible .pet-tear,
.pet-motion-enabled .pet-canvas.motion-visible .pet-spark{animation-play-state:running}
.pet-motion-enabled .pet-canvas.motion-visible[data-pet-reaction="feed"] .pet-painting,
.pet-motion-enabled .pet-canvas.motion-visible[data-pet-reaction="gift"] .pet-painting{animation:pet-joy var(--pet-motion-response) var(--pet-motion-ease) 1}
.pet-motion-enabled .pet-canvas.motion-visible[data-pet-reaction="evolve"] .pet-painting{animation:pet-grow 1.5s var(--pet-motion-ease) 1}
.pet-motion-enabled .pet-canvas.motion-visible[data-pet-reaction="stroke"] .pet-painting,
.pet-motion-enabled .pet-canvas.motion-visible[data-pet-reaction="comfort"] .pet-painting{animation:pet-nuzzle var(--pet-motion-response) ease-in-out 1}
.pet-motion-enabled .pet-canvas.motion-visible[data-pet-reaction] .pet-expression{animation:pet-expression-joy .8s var(--pet-motion-ease) 1}
.pet-motion-enabled .pet-canvas.motion-visible[data-pet-reaction] .trail-piece{animation:pet-trail 1.5s ease-out both}
.pet-motion-enabled .pet-canvas.motion-visible[data-pet-reaction] .trail-1{animation-delay:.12s}
.pet-motion-enabled .pet-canvas.motion-visible[data-pet-reaction] .trail-2{animation-delay:.24s}
.stage .scene{animation:none;aspect-ratio:auto;overflow:visible;box-shadow:none;background:transparent}
.stage .scene:before{display:none}
.stage .scene.hungry:after{display:none}
.pet-companion-tools{display:flex;justify-content:flex-start;margin-top:12px}
.pet-companion-tools button{min-height:44px;font-size:13px;padding:9px 12px}
.pet-companion-tools .icon{width:18px;height:18px}
#motionToggle{white-space:nowrap;min-height:44px}
.reward-notice>.reward-portrait{flex:none}
.reward-portrait{width:88px;height:88px;border-radius:16px}
.reward-portrait .pet-expression{display:none}
.reward-portrait .pet-sparks{display:none}.reward-portrait .trail-piece{width:14px;height:14px}
.reward-portrait .trail-0{--drift-x:-5px;--drift-y:-15px}.reward-portrait .trail-1{--drift-x:5px;--drift-y:-20px}.reward-portrait .trail-2{--drift-x:2px;--drift-y:-12px}
@keyframes pet-breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.012)}}
@keyframes pet-egg{0%,72%,100%{transform:rotate(0)}78%{transform:rotate(-1deg)}86%{transform:rotate(1deg)}93%{transform:rotate(-.5deg)}}
@keyframes pet-droop{0%,100%{transform:translateY(1px) rotate(-.45deg)}50%{transform:translateY(4px) rotate(.45deg)}}
@keyframes pet-blink{0%,40%,44%,73%,77%,100%{transform:scaleY(1)}42%,75%{transform:scaleY(.12)}}
@keyframes pet-teardrop{0%,22%{opacity:.45;transform:translateY(-2px)}62%{opacity:1}100%{opacity:.25;transform:translateY(6px)}}
@keyframes pet-glimmer{0%,100%{opacity:.4;transform:scale(.85) rotate(-7deg)}50%{opacity:.9;transform:scale(1) rotate(6deg)}}
@keyframes pet-joy{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-9px) rotate(-1deg)}55%{transform:translateY(0) rotate(.6deg)}73%{transform:translateY(-4px)}}
@keyframes pet-grow{0%,100%{transform:scale(1)}36%{transform:translateY(-5px) scale(1.045)}68%{transform:translateY(0) scale(1.015)}}
@keyframes pet-nuzzle{0%,100%{transform:rotate(0)}30%{transform:rotate(-1.2deg)}65%{transform:rotate(1deg)}}
@keyframes pet-expression-joy{0%,100%{transform:rotate(-8deg)}40%{transform:translateY(-5px) rotate(5deg)}}
@keyframes pet-trail{0%{opacity:0;transform:translate(0,12px) scale(.5)}18%{opacity:1}100%{opacity:0;transform:translate(var(--drift-x),var(--drift-y)) scale(1.1)}}
@media(max-width:700px){
.stage .pet-spark{width:14px;height:14px}.stage .trail-piece{width:19px;height:19px}
.pet-companion-tools button{width:100%;font-size:12px;padding:9px 5px}
.reward-portrait{width:65px;height:65px}
}
@media(prefers-reduced-motion:reduce){
.pet-canvas *{animation:none!important;transform:none!important}
}
@media print{
.pet-canvas *{animation:none!important;transform:none!important}
.pet-expression,.pet-sparks,.pet-action-trail,.pet-companion-tools,#motionToggle{display:none!important}
}

/* Keep messages and reward receipts in the document, clear of original paintings. */
.pet-response{display:flex;align-items:center;gap:12px;margin-top:16px;padding:12px 14px;background:var(--pale);border-radius:12px}
.pet-response-copy{min-width:0;flex:1}
.pet-mood-title{display:flex;align-items:center;gap:6px;font-size:13px;line-height:1.5}
.pet-mood-title .icon{width:17px;height:17px}
.stage .pet-message{position:static;margin:4px 0 0;padding:0;text-align:left;font-size:13px;line-height:1.65;background:transparent;border-radius:0;box-shadow:none;min-height:0}
.pet-canvas[data-pet-mood="hungry"] .pet-response,.pet-canvas[data-pet-mood="reset"] .pet-response{background:var(--care-paper);color:var(--care-ink)}
.reward-notice{position:static;inset:auto;width:auto;margin:20px 36px 0;box-shadow:none}
@media(max-width:1150px){.reward-notice{margin-left:24px;margin-right:24px}}
@media(max-width:700px){
 .stage .pet-message{font-size:13px;padding:0}
 .pet-companion-tools{margin-top:4px}
 .pet-companion-tools button{font-size:14px;padding:10px 16px}
 .reward-notice{margin:14px 20px 0;width:auto}
}