/* In-game companion: decorative and expressive, never an obstacle to the map. */
.mascot-companion { position: absolute; z-index: 6; top: 15px; right: 17px; display: flex; align-items: end; gap: 7px; pointer-events: none; filter: drop-shadow(0 7px 11px #09243a2b); }
.game-mascot-art { display: grid; width: 156px; height: 156px; place-items: end center; border: 1px solid #c5d9d2; border-radius: 50% 50% 8px 8px; background: #f7f4ebeb; overflow: hidden; }
.game-mascot-art .mascot-figure { width: 92px; height: 92px; margin-bottom: -3px; transform: scale(1.64); transform-origin: center bottom; animation: mascot-idle 2.8s ease-in-out infinite; }
.mascot-message { max-width: 135px; margin-bottom: 9px; padding: 7px 9px; border: 1px solid #c9d9d3; border-radius: 5px; background: #fffdf6eb; color: #41656d; font-size: 10px; line-height: 1.3; opacity: 0; transform: translateX(5px); transition: opacity .2s ease, transform .2s ease; }
.mascot-companion[data-state]:not([data-state="idle"]) .mascot-message { opacity: 1; transform: translateX(0); }
.mascot-companion[data-state="ready"] .game-mascot-art { border-color: #77aea4; }.mascot-companion[data-state="ready"] .mascot-figure { animation: mascot-ready .5s ease-in-out 2; }
.mascot-companion[data-state="celebrate"] .game-mascot-art, .mascot-companion[data-state="victory"] .game-mascot-art { border-color: #e2ba4f; background: #fff8df; }.mascot-companion[data-state="celebrate"] .mascot-figure { animation: mascot-celebrate .66s cubic-bezier(.2,1.4,.4,1) 2; }.mascot-companion[data-state="victory"] .mascot-figure { animation: mascot-victory .8s cubic-bezier(.2,1.35,.4,1) infinite alternate; }
.mascot-companion[data-state="concerned"] .game-mascot-art { border-color: #e29482; background: #fff1eb; }.mascot-companion[data-state="concerned"] .mascot-figure { animation: mascot-concern .38s ease-in-out 3; }
.mascot-companion[data-state="concerned"] .game-mascot-art, .mascot-companion[data-state="alert"] .game-mascot-art { animation:mascot-error-frame .45s ease-in-out 3; }
.mascot-companion[data-state="alert"] .game-mascot-art { border-color: #87aebb; }.mascot-companion[data-state="alert"] .mascot-figure { animation: mascot-alert .5s ease-in-out 2; }
@keyframes mascot-idle { 50% { transform: scale(1.64) translateY(-3px); } }
@keyframes mascot-ready { 50% { transform: scale(1.64) rotate(-8deg) translateY(-4px); } }
@keyframes mascot-celebrate { 50% { transform: scale(1.8) translateY(-13px) rotate(5deg); } }
@keyframes mascot-victory { from { transform: scale(1.68) rotate(-5deg); } to { transform: scale(1.8) translateY(-8px) rotate(5deg); } }
@keyframes mascot-concern { 25% { transform: scale(1.64) translateX(-5px) rotate(-3deg); } 75% { transform: scale(1.64) translateX(5px) rotate(3deg); } }
@keyframes mascot-alert { 50% { transform: scale(1.64) translateY(-6px) rotate(-6deg); } }
@keyframes mascot-error-frame { 50% { box-shadow:0 0 0 6px #eb897d55; } }
@media (max-width: 760px) { .mascot-companion { top: 10px; right: 12px; }.game-mascot-art { width: 116px; height: 116px; }.game-mascot-art .mascot-figure { width:92px; height:92px; transform: scale(1.22); transform-origin: center bottom; }.mascot-message { display: none; } }
@media (prefers-reduced-motion: reduce) { .game-mascot-art .mascot-figure, .mascot-companion[data-state] .mascot-figure { animation: none; } }