:root{--hover-text-color:#f98f78;--hover-dimmed-color:#ccc;--chars-animation-duration:.4s;--chars-animation-delay:.25s;--shadow-color:#cc5b0f66}.character{text-align:center;flex-direction:column;align-items:center;padding:8px;display:inline-flex}.name-evolution__item--root{flex-direction:column;align-items:flex-end;height:230px;margin:64px auto;padding-right:24px;font-size:64px;display:flex;position:relative}.huozhi-chars .pinyin{margin:16px 0;font-size:64px;font-weight:700}.origin-name{cursor:pointer;transition:all var(--chars-animation-duration)ease var(--chars-animation-delay);transform-origin:100% 100%;color:#000;font-weight:700;line-height:1rem}.origin-name--minimized{color:var(--hover-dimmed-color);margin-right:-4px;font-weight:300;transform:scale(.4)}.origin-name--minimized .character{width:16px;height:16px}.name-evolution__item--pinyin{margin-top:16px}.name-evolution__item--root:hover .origin-name--default:not(.animated):not(.animating) .cursor-pointer,.name-evolution__item--root:hover .name-evolution__item--pinyin .cursor-pointer,.flex-column:hover .character:hover{color:var(--hover-text-color);--c:var(--hover-text-color);--shadow:var(--shadow-color)}.origin-name--default{transform:translateY(64px)}.origin-name--default .cursor-pointer{animation:changeColorAfterAnimate calc(var(--chars-animation-delay) + var(--chars-animation-duration))linear forwards}@keyframes changeColorAfterAnimate{0%{color:#ccc}to{color:var(--c)}}.chi-chars{transform-origin:100% 100%;width:120px;height:120px;transition:transform var(--chars-animation-duration)ease,opacity var(--chars-animation-duration)ease;transition-delay:calc(var(--chars-animation-delay));position:absolute;top:80px;right:24px}.chi-chars--unified{opacity:1;transform:translate(0)}.chi-chars--default{opacity:0;transform:translate(-12px,24px)scale(.8)}.huozhi-chars svg{width:48px;height:48px}.huozhi-chars{position:absolute;top:16px;right:0}.huozhi-chars,.huozhi-chars .pinyin,.huozhi-chars svg{transition:all var(--chars-animation-duration)ease;transition-delay:var(--chars-animation-delay)}.huozhi-chars .character .pinyin{transform-origin:100% 100%}.huozhi-chars--show .pinyin{transition-delay:var(--chars-animation-delay);opacity:1}.huozhi-chars--hide .pinyin{opacity:0}.huozhi-chars--hide .character:first-child .pinyin{transform:translate(16px)}.huozhi-chars--hide .character:first-child svg{transform:translate(92px)}.huozhi-chars--hide .character:nth-child(2) svg{transform:translate(0)}