:root{--animation-font-size:32px;--pinyin-gap:1ch}.name-evolution__item--root{font-size:var(--animation-font-size);flex-direction:column;align-items:flex-end;margin:0 auto;padding-right:12px;display:flex;position:relative}.select-none{-webkit-user-select:none;user-select:none}.origin-name{width:calc(var(--seal-column-width) + 3ch);height:38px;font-size:var(--name-label-font-size);white-space:nowrap;cursor:pointer;color:#000;font-weight:300;line-height:38px;position:absolute;top:0;left:0}.origin-name__part{transition:opacity var(--chars-animation-duration) ease, transform var(--chars-animation-duration) ease, color var(--chars-animation-duration) ease;position:absolute;top:0}.origin-name__given{display:flex;left:0}.origin-name__given>span{text-align:center;width:1ch}.origin-name__c,.origin-name__z{left:calc(3ch + var(--pinyin-gap))}.origin-name__hi{left:calc(4ch + var(--pinyin-gap))}.origin-name--split .origin-name__c,.origin-name--split .origin-name__z,.origin-name--split .origin-name__hi{transform:translateX(calc(var(--seal-column-width) - 3ch - var(--pinyin-gap)))}.origin-name--unified .origin-name__z,.origin-name--split .origin-name__c{opacity:0}.origin-name--chi-highlight .origin-name__c,.origin-name--chi-highlight .origin-name__hi{color:var(--hover-text-color)}.name-evolution__item--root .huozhi-chars .pinyin{display:none}.name-transition{transition:all var(--chars-animation-duration) ease}
@property --seal-merge-shift{syntax:"<length>";inherits:true;initial-value:0}:root{--chars-animation-duration:.4s;--hover-text-color:#f98f78;--name-label-font-size:20px;--seal-color:#c8102e;--seal-glyph-size:48px;--seal-column-width:74px;--seal-glyph-gap:32px;--seal-merge-shift:0px;--seal-merge-drop:2px}.huozhi-chars{-webkit-touch-callout:none;-webkit-user-select:none;touch-action:manipulation;position:absolute;right:0}.huozhi-chars .character{text-align:center;flex-direction:column;align-items:center;padding:8px;display:inline-flex;position:relative}.huozhi-chars>.character{width:var(--seal-column-width);color:#000;transition:color var(--chars-animation-duration) ease}.huozhi-chars .pinyin{transition:opacity var(--chars-animation-duration) ease;font-size:var(--name-label-font-size);margin:32px 0 8px;font-weight:300;line-height:38px;position:relative;left:-4px}.huozhi-glyph{flex:0 0 var(--seal-glyph-size);width:var(--seal-glyph-size);height:var(--seal-glyph-size);transition:transform var(--chars-animation-duration) ease;display:block;position:relative}.huozhi-glyph>.huozhi-svg{width:var(--seal-glyph-size);height:var(--seal-glyph-size);margin:0;display:block}.huozhi-chars--split .pinyin{opacity:1}.huozhi-chars--split .character:hover{color:var(--hover-text-color)}.huozhi-chars--unified .pinyin{opacity:0}.huozhi-chars--unified .character:first-child .huozhi-glyph{transform:translate(var(--seal-merge-shift), var(--seal-merge-drop))}.huozhi-chars--unified .character:nth-child(2) .huozhi-glyph{transform:translate(calc(var(--seal-glyph-gap) - var(--seal-column-width) + var(--seal-merge-shift)), var(--seal-merge-drop))}.huozhi-chars--unified,.huozhi-chars--unified .character{color:var(--seal-color)}.huozhi-chars--initial-seal.huozhi-chars--unified{transform-origin:calc(var(--seal-column-width) / 2 + var(--seal-glyph-gap) / 2 + var(--seal-merge-shift)) calc(100% - var(--seal-glyph-size) * .75);animation:.2s 80ms both seal-stamp}.huozhi-chars .seal-frame{bottom:calc(var(--seal-glyph-size) / -6);width:calc(var(--seal-glyph-size) * 80 / 48);height:calc(var(--seal-glyph-size) * 88 / 48);transform:translateX(calc(-50% + var(--seal-glyph-gap) / 2 + var(--seal-merge-shift)));pointer-events:none;position:absolute;left:50%}@keyframes seal-stamp{0%{visibility:hidden;animation-timing-function:cubic-bezier(.55,0,1,.45);transform:translateY(-8px)scale(1.12)}1%{visibility:visible;animation-timing-function:cubic-bezier(.55,0,1,.45);transform:translateY(-8px)scale(1.12)}55%{animation-timing-function:ease-out;transform:translateY(1px)scale(1.02,.96)}78%{animation-timing-function:ease-in-out;transform:translateY(-.5px)scale(.995,1.01)}to{visibility:visible;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){.huozhi-chars--initial-seal.huozhi-chars--unified{animation-delay:0s}}
