/* =========================================================
   yvfng 三态主题/语言按钮动画 CSS（公共）
   从首页 index.html 内联抽取，全站共用。
   动画参数已验收，勿改。
   ========================================================= */

/* 三态主题钮原型：浅/深/跟随 —— 静态高亮与语言钮同一机制(border)，飞线仅动画时出现 */
.theme-sw{position:relative}
.theme-sw .s{transition:color .15s ease}
.theme-sw .sep{transition:color .18s ease,font-weight .18s ease,-webkit-text-stroke .18s ease;color:var(--rule-strong)}
.theme-sw .sep.on{color:var(--ink)}
.theme-sw .sep.delay{transition-delay:.45s}
.lang-sw .sep{transition:color .18s ease,font-weight .18s ease,-webkit-text-stroke .18s ease;color:var(--rule-strong)}
.lang-sw .sep.on{color:var(--ink)}
.lang-sw .sep.delay{transition-delay:.45s}
.theme-sw .sw-ind,.lang-sw .sw-ind{position:absolute;left:0;bottom:0;height:1px;background:var(--ink);opacity:0;pointer-events:none}
.theme-sw .sw-ind.fly-sep,.lang-sw .sw-ind.fly-sep{animation:indFlyToSep .55s cubic-bezier(.34,1.3,.44,1) forwards}
.theme-sw .sw-ind.fly-back,.lang-sw .sw-ind.fly-back{animation:indFlyBack .42s cubic-bezier(.34,1.2,.44,1) forwards}
@keyframes indFlyToSep{
  0%{transform:translateX(var(--fx,0)) translateY(0) rotate(0deg);opacity:.9}
  55%{transform:translateX(calc(var(--fx,0) + (var(--ix,0) - var(--fx,0))*0.72)) translateY(calc(var(--iy,0)*0.7)) rotate(-26deg);opacity:.95}
  78%{transform:translateX(calc(var(--fx,0) + (var(--ix,0) - var(--fx,0))*1.08)) translateY(calc(var(--iy,0)*1.12)) rotate(-50deg);opacity:.95}
  92%{transform:translateX(calc(var(--fx,0) + (var(--ix,0) - var(--fx,0))*0.97)) translateY(var(--iy,0)) rotate(-42deg);opacity:.92}
  100%{transform:translateX(var(--ix,0)) translateY(var(--iy,0)) rotate(-45deg);opacity:0}
}
@keyframes indFlyBack{
  0%{transform:translateX(var(--ix,0)) translateY(var(--iy,0)) rotate(-45deg);opacity:.9}
  100%{transform:translateX(var(--tx,0)) translateY(0) rotate(0deg);opacity:.9}
}