/* The original image reserves all layout space, including while resources load. */
#department-introduction .mascot-visitor {position:relative;width:100%;isolation:isolate;overflow:hidden;line-height:0;container-type:inline-size}
#department-introduction .mascot-visitor > .mascot-original {border-radius:0}
.mascot-visitor [hidden] {display:none!important}
/* A fixed hit area; the image never captures input outside it. */
.mascot-visitor .mv-trigger,.mascot-visitor .mv-waiting-peek {position:absolute;right:0;bottom:0;width:92px;height:78px;overflow:visible;padding:0;border:0;background:transparent;line-height:0}
.mascot-visitor .mv-trigger {cursor:pointer}
.mascot-visitor .mv-waiting-peek {pointer-events:none;z-index:4}
#department-introduction .mascot-visitor :is(.mv-trigger,.mv-waiting-peek) img {position:absolute;right:0;bottom:-38px;display:block;width:90px;height:90px;max-width:none;max-height:none;margin:0;padding:0;background:transparent;border:0;border-radius:0;transform:translate(0,0) rotate(0);transform-origin:50% 50%;pointer-events:none;transition:transform .22s ease-out}
@media(hover:hover) and (pointer:fine) {
  #department-introduction .mascot-visitor .mv-trigger:hover img {transform:translate(-12px,-25px) rotate(-15deg);transition-duration:.3s}
}
#department-introduction .mascot-visitor .mv-trigger:focus-visible img {transform:translate(-12px,-25px) rotate(-15deg);transition-duration:.3s}
.mascot-visitor .mv-trigger:focus-visible {outline-offset:-4px}
.mascot-visitor .mv-stage {position:absolute;inset:0;overflow:hidden;background:#101318;border:0;box-shadow:inset 0 0 0 1px #465260;color:#e0dbca;line-height:1;z-index:1}
.mascot-visitor.mv-playing > .mascot-original {visibility:hidden}
.mascot-visitor .mv-title {position:absolute;top:17px;left:16px;margin:0;font:13px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.5px;pointer-events:none;z-index:5}
.mascot-visitor .mv-close {position:absolute;right:2px;top:2px;z-index:5;display:grid;place-items:center;width:44px;height:44px;padding:0;background:#101318;color:#e0dbca;border:0;font:25px/1 monospace;cursor:pointer}
.mascot-visitor .mv-close:hover {color:#f9ce16;background:#202a34}
.mascot-visitor .mv-close:focus-visible {outline-offset:-4px}
.mascot-visitor .mv-content {position:absolute;inset:44px 10px 10px;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,1fr);gap:2%;align-items:center}
.mascot-visitor .mv-board-slot {display:grid;place-items:center;width:100%;height:100%;min-width:0;min-height:0;max-height:100%;background:#101318;pointer-events:none}
.mascot-visitor .mv-canvas {display:block;width:100%;height:100%;aspect-ratio:1;object-fit:contain;pointer-events:none}
.mascot-visitor .mv-spectator {position:relative;width:100%;aspect-ratio:1;align-self:end;margin-bottom:20%;pointer-events:none;}
.mascot-visitor .mv-actor {position:absolute;inset:0;z-index:4;transform-origin:50% 50%;pointer-events:none}
#department-introduction .mascot-visitor .mv-curtain {position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:fill;margin:0;padding:0;border:0;border-radius:0;pointer-events:none}
.mascot-visitor .mv-scene-pacman .mv-spectator {align-self:center;margin-bottom:0}
#department-introduction .mascot-visitor .mv-pose {position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;margin:0;padding:0;border:0;border-radius:0;background:transparent;opacity:0;transition:opacity .18s linear}
#department-introduction .mascot-visitor .mv-pose-active {opacity:1}
.mascot-visitor .mv-stage[data-phase="loading"] {background:transparent;box-shadow:none}
.mascot-visitor .mv-stage[data-phase="loading"] .mv-content {visibility:hidden}
.mascot-visitor .mv-loading {position:absolute;left:12px;bottom:12px;padding:4px 8px;color:#eee;font:12px/1.5 sans-serif;background:#101318d9;z-index:5;pointer-events:none}
.mascot-visitor .mv-stage[data-phase="loading"] .mv-title {visibility:hidden}
.mascot-visitor .mv-still * {animation:none!important;transition:none!important}
@container(max-width:340px) {
  .mascot-visitor .mv-title {font-size:10px;letter-spacing:1px;top:15px;left:10px}
  .mascot-visitor .mv-content {inset:38px 5px 6px;gap:1%}
}
@media(max-width:767px) {
  #department-introduction .mascot-visitor {max-width:365px;align-self:center}
  .mascot-visitor .mv-trigger,.mascot-visitor .mv-waiting-peek {width:84px;height:72px}
  #department-introduction .mascot-visitor :is(.mv-trigger,.mv-waiting-peek) img {width:80px;height:80px;bottom:-34px}
}
@media(prefers-reduced-motion:reduce) {
  .mascot-visitor * {animation:none!important;transition:none!important}
}