.nekoone-guide-mascot{
  position:relative;
  display:flex;
  align-items:flex-end;
  min-height:calc(var(--nekoone-guide-size,150px) + 34px);
  isolation:isolate;
}
.nekoone-guide-mascot--left{justify-content:flex-start}
.nekoone-guide-mascot--center{justify-content:center}
.nekoone-guide-mascot--right{justify-content:flex-end}
.nekoone-guide-mascot__button{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:7px;
  width:auto;
  max-width:100%;
  padding:0;
  border:0;
  background:transparent;
  color:#dcd1f6;
  font-family:"Yu Mincho","YuMincho","Hiragino Mincho ProN","Hiragino Mincho Pro",serif;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.nekoone-guide-mascot__button img{
  display:block;
  width:var(--nekoone-guide-size,150px);
  max-width:100%;
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 12px 18px rgba(0,0,0,.38))
         drop-shadow(0 0 12px rgba(146,110,230,.16));
  transform-origin:50% 90%;
  transition:transform .18s ease,filter .18s ease;
  user-select:none;
  -webkit-user-drag:none;
}
.nekoone-guide-mascot__button span{
  font-size:.72rem;
  line-height:1.4;
  color:#cdbfe9;
  letter-spacing:.03em;
  text-shadow:0 1px 5px rgba(0,0,0,.8);
}
.nekoone-guide-mascot__button:hover img,
.nekoone-guide-mascot__button:focus-visible img{
  transform:translateY(-3px) rotate(-1deg);
  filter:drop-shadow(0 14px 20px rgba(0,0,0,.42))
         drop-shadow(0 0 16px rgba(157,119,241,.28));
}
.nekoone-guide-mascot__button:focus-visible{
  outline:2px solid rgba(185,157,255,.9);
  outline-offset:6px;
  border-radius:16px;
}
.nekoone-guide-mascot__button:active img{
  transform:translateY(1px) scale(.98);
}
.nekoone-guide-mascot__bubble{
  position:absolute;
  z-index:6;
  bottom:76%;
  width:min(250px,72vw);
  padding:13px 15px;
  border:1px solid rgba(178,151,255,.58);
  border-radius:17px;
  background:linear-gradient(145deg,rgba(45,30,80,.96),rgba(20,14,40,.96));
  color:#fff;
  font-family:"Yu Mincho","YuMincho","Hiragino Mincho ProN","Hiragino Mincho Pro",serif;
  font-size:.84rem;
  line-height:1.7;
  text-align:left;
  box-shadow:0 14px 28px rgba(0,0,0,.34),
             0 0 18px rgba(134,94,224,.18),
             inset 0 0 14px rgba(181,151,255,.05);
  opacity:0;
  transform:translateY(8px) scale(.97);
  pointer-events:none;
}
.nekoone-guide-mascot--right .nekoone-guide-mascot__bubble{
  right:calc(var(--nekoone-guide-size,150px) * .7);
  border-radius:17px 17px 6px 17px;
}
.nekoone-guide-mascot--left .nekoone-guide-mascot__bubble{
  left:calc(var(--nekoone-guide-size,150px) * .7);
  border-radius:17px 17px 17px 6px;
}
.nekoone-guide-mascot--center .nekoone-guide-mascot__bubble{
  left:50%;
  transform:translate(-50%,8px) scale(.97);
}
.nekoone-guide-mascot__bubble::after{
  content:"";
  position:absolute;
  bottom:14px;
  width:16px;
  height:16px;
  border-right:1px solid rgba(178,151,255,.58);
  border-bottom:1px solid rgba(178,151,255,.58);
  background:rgba(25,17,47,.98);
}
.nekoone-guide-mascot--right .nekoone-guide-mascot__bubble::after{
  right:-8px;
  transform:rotate(-45deg);
}
.nekoone-guide-mascot--left .nekoone-guide-mascot__bubble::after{
  left:-8px;
  transform:rotate(135deg);
}
.nekoone-guide-mascot--center .nekoone-guide-mascot__bubble::after{
  left:50%;
  bottom:-8px;
  transform:translateX(-50%) rotate(45deg);
}
.nekoone-guide-mascot__bubble.is-visible{animation:nekooneGuideBubbleIn .28s ease forwards}
.nekoone-guide-mascot__bubble.is-hiding{animation:nekooneGuideBubbleOut .3s ease forwards}
.nekoone-guide-mascot--center .nekoone-guide-mascot__bubble.is-visible{animation:nekooneGuideBubbleCenterIn .28s ease forwards}
.nekoone-guide-mascot--center .nekoone-guide-mascot__bubble.is-hiding{animation:nekooneGuideBubbleCenterOut .3s ease forwards}
.nekoone-guide-mascot__button.is-speaking img{animation:nekooneGuideNod .48s ease}
@keyframes nekooneGuideBubbleIn{
  from{opacity:0;transform:translateY(8px) scale(.97)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes nekooneGuideBubbleOut{
  from{opacity:1;transform:translateY(0) scale(1)}
  to{opacity:0;transform:translateY(6px) scale(.98)}
}
@keyframes nekooneGuideBubbleCenterIn{
  from{opacity:0;transform:translate(-50%,8px) scale(.97)}
  to{opacity:1;transform:translate(-50%,0) scale(1)}
}
@keyframes nekooneGuideBubbleCenterOut{
  from{opacity:1;transform:translate(-50%,0) scale(1)}
  to{opacity:0;transform:translate(-50%,6px) scale(.98)}
}
@keyframes nekooneGuideNod{
  0%,100%{transform:translateY(0) rotate(0)}
  35%{transform:translateY(-4px) rotate(-2deg)}
  70%{transform:translateY(-1px) rotate(1deg)}
}
@media(max-width:600px){
  .nekoone-guide-mascot__bubble{
    width:min(220px,70vw);
    padding:11px 13px;
    font-size:.77rem;
  }
  .nekoone-guide-mascot__button span{font-size:.64rem}
}
@media(prefers-reduced-motion:reduce){
  .nekoone-guide-mascot__button img,
  .nekoone-guide-mascot__bubble{
    animation:none!important;
    transition:none!important;
  }
}