.dragon-visual{
  position:relative;display:block;isolation:isolate;cursor:pointer;outline:none;
  -webkit-tap-highlight-color:transparent;user-select:none;
}
.dragon-visual::before{
  content:"";position:absolute;inset:3% 0 5%;z-index:0;pointer-events:none;border-radius:50%;
  background:radial-gradient(ellipse at 52% 47%,rgba(99,205,255,.34) 0,rgba(55,155,245,.18) 42%,rgba(26,94,181,.06) 62%,transparent 76%);
  filter:blur(18px);opacity:0;transform:scale(.94);
  transition:opacity .3s ease,transform .7s cubic-bezier(.2,.7,.2,1);
}
.dragon-visual .frost-dragon{
  position:relative;z-index:1;display:block;width:100%;height:auto;
  filter:brightness(1) saturate(1);
  transform:scale(1);transform-origin:50% 55%;
  transition:filter .3s ease,transform .7s cubic-bezier(.2,.7,.2,1);
  -webkit-mask-image:radial-gradient(ellipse 76% 72% at 50% 48%,#000 58%,rgba(0,0,0,.98) 68%,transparent 84%);
  mask-image:radial-gradient(ellipse 76% 72% at 50% 48%,#000 58%,rgba(0,0,0,.98) 68%,transparent 84%);
  -webkit-user-drag:none;
}
.dragon-visual:hover::before,.dragon-visual:focus-visible::before,.dragon-visual.breathing::before{
  opacity:1;transform:scale(1.02);
}
.dragon-visual:hover .frost-dragon,.dragon-visual:focus-visible .frost-dragon,.dragon-visual.breathing .frost-dragon{
  filter:brightness(1.12) saturate(1.08);
  transform:scale(1.016);
}
.dragon-breath{
  position:absolute;left:21%;top:30%;width:17%;height:17%;z-index:2;pointer-events:none;
  opacity:0;transform:scaleX(.45);transform-origin:100% 50%;
  transition:opacity .2s ease,transform .55s cubic-bezier(.16,.8,.24,1);
}
.dragon-visual:hover .dragon-breath,.dragon-visual:focus-visible .dragon-breath,.dragon-visual.breathing .dragon-breath{
  opacity:1;transform:scaleX(1);
}
.dragon-breath:before{
  content:"";position:absolute;right:-5%;top:2%;width:112%;height:96%;border-radius:50%;
  background:radial-gradient(ellipse at 90% 50%,rgba(244,254,255,.92) 0,rgba(138,229,255,.66) 15%,rgba(55,166,255,.26) 43%,transparent 72%);
  filter:blur(4px);animation:dragon-breath-pulse .7s ease-in-out infinite alternate;
}
.dragon-breath:after{
  content:"";position:absolute;right:2%;top:14%;width:96%;height:72%;border-radius:50%;
  background:radial-gradient(ellipse at 86% 50%,rgba(225,251,255,.4) 0,rgba(112,215,255,.18) 28%,transparent 68%);
  filter:blur(7px);animation:dragon-mist 1.1s ease-in-out infinite alternate;
}
@keyframes dragon-breath-pulse{from{opacity:.5;transform:scale(.96)}to{opacity:.9;transform:scale(1.03)}}
@keyframes dragon-mist{from{opacity:.4;transform:scaleX(.9)}to{opacity:.78;transform:scaleX(1.04)}}
@media(max-width:820px){
  .dragon-breath{left:20%;top:29%;width:19%;height:19%}
}
@media(prefers-reduced-motion:reduce){
  .dragon-visual::before,.dragon-visual .frost-dragon{transition:none}
  .dragon-visual:hover .frost-dragon,.dragon-visual:focus-visible .frost-dragon,.dragon-visual.breathing .frost-dragon{transform:none}
  .dragon-breath:before,.dragon-breath:after{animation:none}
}
