/* 动态 SVG 图标动画（前后台共用） */

/* —— 通用：丝滑浮动（全员） —— */
.tool-icon-anim .tia-root,
.tool-icon-bag .lb-root {
    transform-box: view-box;
    transform-origin: 50% 50%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    will-change: transform;
}

.tool-icon-anim .tia-root {
    transform-origin: 32px 34px;
    animation: tia-float 2.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}

@keyframes tia-float {
    0%   { transform: translate3d(0, 0.6px, 0) rotate(-3deg) scale(1); }
    25%  { transform: translate3d(0, -0.8px, 0) rotate(-0.5deg) scale(1.02); }
    50%  { transform: translate3d(0, -1.6px, 0) rotate(3deg) scale(1.03); }
    75%  { transform: translate3d(0, -0.5px, 0) rotate(0.5deg) scale(1.015); }
    100% { transform: translate3d(0, 0.6px, 0) rotate(-3deg) scale(1); }
}

/* —— 服装套图：提手轴左右轻摆 —— */
.tool-icon-bag .lb-root {
    transform-origin: 32px 10px;
    animation: lb-sway 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-bag .lb-clasp {
    transform-box: view-box;
    transform-origin: 32px 40.8px;
    animation: lb-clasp 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-bag .lb-flap {
    transform-box: view-box;
    transform-origin: 32px 29px;
    animation: lb-flap 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes lb-sway {
    0%   { transform: rotate(-12deg) translate3d(0, 0.4px, 0); }
    18%  { transform: rotate(-8deg) translate3d(0, -0.2px, 0); }
    36%  { transform: rotate(1deg) translate3d(0, -0.9px, 0); }
    50%  { transform: rotate(12deg) translate3d(0, -1.2px, 0); }
    68%  { transform: rotate(6deg) translate3d(0, -0.5px, 0); }
    84%  { transform: rotate(-4deg) translate3d(0, 0.1px, 0); }
    100% { transform: rotate(-12deg) translate3d(0, 0.4px, 0); }
}
@keyframes lb-clasp {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}
@keyframes lb-flap {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, 0.7px, 0); }
}

/* —— 爆款详情图：魔杖点触 + 火花闪 —— */
.tool-icon-anim--baokuan .tia-spark {
    transform-box: view-box;
    transform-origin: 48px 22px;
    animation: tia-spark 1.6s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--baokuan .tia-wand {
    transform-box: view-box;
    transform-origin: 40px 46px;
    animation: tia-wand 1.8s cubic-bezier(0.34, 1.2, 0.64, 1) infinite;
}
.tool-icon-anim--baokuan .tia-screen {
    transform-box: view-box;
    transform-origin: 28px 27px;
    animation: tia-screen 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-spark {
    0%, 100% { transform: scale(0.7) rotate(-8deg); opacity: 0.45; }
    40% { transform: scale(1.25) rotate(14deg); opacity: 1; }
    70% { transform: scale(0.95) rotate(4deg); opacity: 0.85; }
}
@keyframes tia-wand {
    0%, 100% { transform: rotate(0deg) translate3d(0, 0, 0); }
    35% { transform: rotate(-10deg) translate3d(-0.5px, -1px, 0); }
    55% { transform: rotate(2deg) translate3d(0.5px, 0.5px, 0); }
}
@keyframes tia-screen {
    0%, 100% { opacity: 1; }
    40% { opacity: 0.72; }
    55% { opacity: 1; }
}

/* —— 精品海报：太阳呼吸 + 画面微缩 + 高光扫过 —— */
.tool-icon-anim--haibao .tia-sun {
    transform-box: view-box;
    transform-origin: 41px 23.5px;
    animation: tia-sun 2.2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--haibao .tia-scene {
    transform-box: view-box;
    transform-origin: 32px 30px;
    animation: tia-scene 3.2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--haibao .tia-glint {
    animation: tia-glint 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--haibao .tia-root {
    animation: tia-float 3s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-sun {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.18); opacity: 0.92; }
}
@keyframes tia-scene {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.04); }
}
@keyframes tia-glint {
    0%, 100% { opacity: 0.35; transform: translate3d(0, 0, 0); }
    45% { opacity: 1; transform: translate3d(8px, 0, 0); }
    70% { opacity: 0.5; transform: translate3d(14px, 1px, 0); }
}

/* —— 图片生成：画笔扫动 + 颜料点脉冲 —— */
.tool-icon-anim--tupian_shengcheng .tia-brush {
    transform-box: view-box;
    transform-origin: 42px 48px;
    animation: tia-brush 2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--tupian_shengcheng .tia-blob-a { animation: tia-blob 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite; transform-origin: 20px 28px; transform-box: view-box; }
.tool-icon-anim--tupian_shengcheng .tia-blob-b { animation: tia-blob 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.2s; transform-origin: 28px 24.5px; transform-box: view-box; }
.tool-icon-anim--tupian_shengcheng .tia-blob-c { animation: tia-blob 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.4s; transform-origin: 36.5px 28px; transform-box: view-box; }
.tool-icon-anim--tupian_shengcheng .tia-blob-d { animation: tia-blob 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.55s; transform-origin: 34px 38px; transform-box: view-box; }
.tool-icon-anim--tupian_shengcheng .tia-blob-e { animation: tia-blob 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.7s; transform-origin: 23px 39px; transform-box: view-box; }
@keyframes tia-brush {
    0%, 100% { transform: rotate(-2deg) translate3d(0, 0, 0); }
    30% { transform: rotate(10deg) translate3d(1px, -1px, 0); }
    60% { transform: rotate(-6deg) translate3d(-0.5px, 0.5px, 0); }
}
@keyframes tia-blob {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.18); }
}

/* —— 爆款视频：拍板开合 + 播放键跳 —— */
.tool-icon-anim--baokuan_shipin .tia-clap {
    transform-box: view-box;
    transform-origin: 14px 28px;
    animation: tia-clap 2.2s cubic-bezier(0.34, 1.3, 0.64, 1) infinite;
}
.tool-icon-anim--baokuan_shipin .tia-play {
    transform-box: view-box;
    transform-origin: 32px 41px;
    animation: tia-play 2.2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-clap {
    0%, 55%, 100% { transform: rotate(0deg); }
    20% { transform: rotate(-14deg); }
    32% { transform: rotate(0deg); }
}
@keyframes tia-play {
    0%, 100% { transform: scale(1); }
    40% { transform: scale(1); }
    55% { transform: scale(1.14); }
    70% { transform: scale(1); }
}

/* —— 去水印：斜线扫过 —— */
.tool-icon-anim--quxiao_shuiyin .tia-slash {
    transform-box: view-box;
    transform-origin: 32px 35px;
    animation: tia-slash 2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-slash {
    0%, 100% { opacity: 1; transform: scale(1) translate3d(0, 0, 0); }
    40% { opacity: 0.55; transform: scale(1.06) translate3d(0.5px, -0.5px, 0); }
    70% { opacity: 1; transform: scale(0.96) translate3d(0, 0, 0); }
}

/* —— 拼图：色块错落 —— */
.tool-icon-anim--pintu .tia-t1 { animation: tia-tile-a 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite; }
.tool-icon-anim--pintu .tia-t2 { animation: tia-tile-b 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.15s; }
.tool-icon-anim--pintu .tia-t3 { animation: tia-tile-b 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.3s; }
.tool-icon-anim--pintu .tia-t4 { animation: tia-tile-a 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.45s; }
@keyframes tia-tile-a {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(-1.5px, -1.5px, 0); }
}
@keyframes tia-tile-b {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(1.5px, 1.5px, 0); }
}

/* —— 压缩：箭头下压 —— */
.tool-icon-anim--tupian_yasuo .tia-arrows {
    transform-box: view-box;
    transform-origin: 32px 50px;
    animation: tia-arrows 1.6s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-arrows {
    0%, 100% { transform: translate3d(0, 0, 0) scaleY(1); }
    50% { transform: translate3d(0, 2.5px, 0) scaleY(0.92); }
}

/* —— 分割：剪刀开合 —— */
.tool-icon-anim--zhineng_fenge .tia-scissors {
    transform-box: view-box;
    transform-origin: 32px 44px;
    animation: tia-scissors 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-scissors {
    0%, 100% { transform: rotate(-8deg); }
    50% { transform: rotate(8deg); }
}

/* —— 加水印：印章轻落 —— */
.tool-icon-anim--jia_shuiyin .tia-stamp {
    transform-box: view-box;
    transform-origin: 41px 42px;
    animation: tia-stamp 1.9s cubic-bezier(0.34, 1.3, 0.64, 1) infinite;
}
@keyframes tia-stamp {
    0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
    35% { transform: translate3d(0, -3px, 0) rotate(-6deg) scale(1.04); }
    55% { transform: translate3d(0, 1px, 0) rotate(2deg) scale(0.97); }
    70% { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
}

/* —— 积分：金币弹跳 —— */
.tool-icon-anim--pricing .tia-c2 {
    transform-box: view-box;
    transform-origin: 40px 32px;
    animation: tia-coin 2s cubic-bezier(0.34, 1.4, 0.64, 1) infinite;
}
.tool-icon-anim--pricing .tia-c1 {
    transform-box: view-box;
    transform-origin: 24px 38px;
    animation: tia-coin 2s cubic-bezier(0.34, 1.4, 0.64, 1) infinite 0.25s;
}
@keyframes tia-coin {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    40% { transform: translate3d(0, -3px, 0) scale(1.05); }
    60% { transform: translate3d(0, 0.5px, 0) scale(0.98); }
}

/* —— 卡密：票券轻滑 + 扫描线 —— */
.tool-icon-anim--redeem .tia-root {
    animation: tia-slide 2.6s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--redeem .tia-dot {
    transform-box: view-box;
    transform-origin: 16.5px 30px;
    animation: tia-blink 1.4s ease-in-out infinite;
}
.tool-icon-anim--redeem .tia-scan {
    animation: tia-scan 2.2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-slide {
    0%, 100% { transform: translate3d(-1px, 0.4px, 0) rotate(-2deg); }
    50% { transform: translate3d(1.5px, -1px, 0) rotate(2deg); }
}
@keyframes tia-blink {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.45; transform: scale(0.85); }
}
@keyframes tia-scan {
    0%, 100% { opacity: 0.35; transform: translate3d(0, 0, 0); }
    50% { opacity: 0.9; transform: translate3d(6px, 0, 0); }
}

/* —— 更新：铃铛摇 —— */
.tool-icon-anim--changelog .tia-bell {
    transform-box: view-box;
    transform-origin: 32px 12px;
    animation: tia-bell 2.2s cubic-bezier(0.34, 1.3, 0.64, 1) infinite;
}
.tool-icon-anim--changelog .tia-badge {
    transform-box: view-box;
    transform-origin: 44px 20px;
    animation: tia-blink 1.2s ease-in-out infinite;
}
@keyframes tia-bell {
    0%, 100% { transform: rotate(0deg); }
    12% { transform: rotate(12deg); }
    24% { transform: rotate(-10deg); }
    36% { transform: rotate(8deg); }
    48% { transform: rotate(-4deg); }
    60% { transform: rotate(0deg); }
}

/* —— 反馈：气泡呼吸 + 输入三点 —— */
.tool-icon-anim--feedback .tia-root {
    animation: tia-bubble 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--feedback .tia-dot {
    transform-box: view-box;
    transform-origin: 48px 42px;
    animation: tia-blink 1.5s ease-in-out infinite;
}
.tool-icon-anim--feedback .tia-td1 { animation: tia-type 1.2s ease-in-out infinite; transform-box: view-box; transform-origin: 24px 28px; }
.tool-icon-anim--feedback .tia-td2 { animation: tia-type 1.2s ease-in-out infinite 0.15s; transform-box: view-box; transform-origin: 32px 28px; }
.tool-icon-anim--feedback .tia-td3 { animation: tia-type 1.2s ease-in-out infinite 0.3s; transform-box: view-box; transform-origin: 40px 28px; }
@keyframes tia-bubble {
    0%, 100% { transform: translate3d(0, 0.5px, 0) scale(1) rotate(-1deg); }
    50% { transform: translate3d(0, -1.5px, 0) scale(1.04) rotate(2deg); }
}
@keyframes tia-type {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); opacity: 0.55; }
    40% { transform: translate3d(0, -2px, 0) scale(1.15); opacity: 1; }
}

/* —— 积分：金币高光微闪 —— */
.tool-icon-anim--pricing .tia-shine {
    animation: tia-glint 2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}

/* —— 首页：门微开 + 窗户亮 —— */
.tool-icon-anim--home .tia-door {
    transform-box: view-box;
    transform-origin: 27px 45px;
    animation: tia-door 2.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--home .tia-win-l,
.tool-icon-anim--home .tia-win-r {
    transform-box: view-box;
    animation: tia-win 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--home .tia-win-l { transform-origin: 21px 38.5px; }
.tool-icon-anim--home .tia-win-r { transform-origin: 43px 38.5px; animation-delay: 0.2s; }
@keyframes tia-door {
    0%, 100% { transform: skewY(0deg); }
    50% { transform: skewY(-4deg) translateX(0.5px); }
}
@keyframes tia-win {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.75; transform: scale(1.06); }
}

/* —— 品牌魔杖：挥动 + 星芒闪烁 —— */
.tool-icon-anim--brand .tia-wand,
.tool-icon-anim--logo .tia-wand {
    transform-box: view-box;
    transform-origin: 22px 48px;
    animation: tia-brand-wand 2s cubic-bezier(0.34, 1.2, 0.64, 1) infinite;
}
.tool-icon-anim--brand .tia-spark-a,
.tool-icon-anim--logo .tia-spark-a {
    transform-box: view-box;
    transform-origin: 42px 17px;
    animation: tia-spark 1.5s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--brand .tia-spark-b,
.tool-icon-anim--logo .tia-spark-b {
    transform-box: view-box;
    transform-origin: 50px 31px;
    animation: tia-spark 1.5s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.25s;
}
.tool-icon-anim--brand .tia-spark-c,
.tool-icon-anim--logo .tia-spark-c {
    transform-box: view-box;
    transform-origin: 18px 23.5px;
    animation: tia-spark 1.5s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.45s;
}
@keyframes tia-brand-wand {
    0%, 100% { transform: rotate(-4deg); }
    40% { transform: rotate(8deg) translate3d(0.5px, -1px, 0); }
    65% { transform: rotate(-2deg); }
}

/* —— 历史：指针转动 + 回退弧 —— */
.tool-icon-anim--history .tia-hands {
    transform-box: view-box;
    transform-origin: 32px 34px;
    animation: tia-hands 3s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--history .tia-rewind {
    transform-box: view-box;
    transform-origin: 18px 18px;
    animation: tia-rewind 2.2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-hands {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(28deg); }
}
@keyframes tia-rewind {
    0%, 100% { opacity: 0.55; transform: scale(1); }
    40% { opacity: 1; transform: scale(1.08) rotate(-12deg); }
}

/* —— 用户：轻微点头 —— */
.tool-icon-anim--user .tia-head,
.tool-icon-anim--avatar .tia-head {
    transform-box: view-box;
    transform-origin: 32px 24px;
    animation: tia-head 2.6s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-head {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, -1.2px, 0); }
}

/* —— 升级加号：呼吸放大 —— */
.tool-icon-anim--plus .tia-plus,
.tool-icon-anim--upgrade .tia-plus,
.tool-icon-anim--plus_light .tia-plus,
.tool-icon-anim--upgrade_light .tia-plus {
    transform-box: view-box;
    transform-origin: 32px 32px;
    animation: tia-plus 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-plus {
    0%, 100% { transform: scale(1) rotate(0deg); }
    50% { transform: scale(1.12) rotate(90deg); }
}

/* —— 签到日历 —— */
.tool-icon-anim--checkin .tia-check,
.tool-icon-anim--calendar .tia-check {
    transform-box: view-box;
    transform-origin: 32px 40px;
    animation: tia-check-pop 2s cubic-bezier(0.34, 1.4, 0.64, 1) infinite;
}
@keyframes tia-check-pop {
    0%, 100% { transform: scale(1); }
    45% { transform: scale(1.12); }
}

/* —— 礼盒盖轻抬 —— */
.tool-icon-anim--gift .tia-lid {
    transform-box: view-box;
    transform-origin: 32px 26px;
    animation: tia-lid 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-lid {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, -2px, 0); }
}

/* —— 对勾描边呼吸 —— */
.tool-icon-anim--check .tia-check {
    transform-box: view-box;
    transform-origin: 32px 32px;
    animation: tia-check-draw 2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-check-draw {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.08); opacity: 0.92; }
}

/* —— 微信气泡点闪 —— */
.tool-icon-anim--wechat .tia-dot,
.tool-icon-anim--service .tia-dot {
    animation: tia-blink 1.4s ease-in-out infinite;
}

/* —— 无限符号流动 —— */
.tool-icon-anim--infinity .tia-inf {
    transform-box: view-box;
    transform-origin: 32px 32px;
    animation: tia-inf 2.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-inf {
    0%, 100% { transform: scaleX(1); }
    50% { transform: scaleX(1.06); }
}

/* —— 收据点闪 —— */
.tool-icon-anim--receipt .tia-dot {
    animation: tia-blink 1.6s ease-in-out infinite;
}

/* —— 发送箭头上弹 —— */
.tool-icon-anim--send .tia-arrow,
.tool-icon-anim--arrow_up .tia-arrow,
.tool-icon-anim--send_light .tia-arrow,
.tool-icon-anim--arrow_up_light .tia-arrow,
.tool-icon-anim--upload .tia-arrow {
    transform-box: view-box;
    transform-origin: 32px 32px;
    animation: tia-send 1.6s cubic-bezier(0.34, 1.3, 0.64, 1) infinite;
}
@keyframes tia-send {
    0%, 100% { transform: translate3d(0, 1px, 0); }
    50% { transform: translate3d(0, -2px, 0); }
}

/* —— 回形针轻摆 —— */
.tool-icon-anim--paperclip .tia-clip {
    transform-box: view-box;
    transform-origin: 32px 32px;
    animation: tia-clip 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-clip {
    0%, 100% { transform: rotate(-6deg); }
    50% { transform: rotate(6deg); }
}

/* —— 齿轮旋转 —— */
.tool-icon-anim--gear .tia-gear,
.tool-icon-anim--settings .tia-gear {
    transform-box: view-box;
    transform-origin: 32px 32px;
    animation: tia-gear 4s linear infinite;
}
@keyframes tia-gear {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* —— 麦克风轻抖 —— */
.tool-icon-anim--mic .tia-mic,
.tool-icon-anim--microphone .tia-mic {
    transform-box: view-box;
    transform-origin: 32px 40px;
    animation: tia-mic 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-mic {
    0%, 100% { transform: scaleY(1); }
    50% { transform: scaleY(1.06); }
}

/* —— 滑块旋钮错落 —— */
.tool-icon-anim--sliders .tia-k1 { animation: tia-knob 2s cubic-bezier(0.37, 0, 0.63, 1) infinite; }
.tool-icon-anim--sliders .tia-k2 { animation: tia-knob 2s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.2s; }
.tool-icon-anim--sliders .tia-k3 { animation: tia-knob 2s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.4s; }
.tool-icon-anim--options .tia-k1 { animation: tia-knob 2s cubic-bezier(0.37, 0, 0.63, 1) infinite; }
.tool-icon-anim--options .tia-k2 { animation: tia-knob 2s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.2s; }
.tool-icon-anim--options .tia-k3 { animation: tia-knob 2s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.4s; }
@keyframes tia-knob {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(3px, 0, 0); }
}

/* —— 汉堡菜单：三线错落 —— */
.tool-icon-anim--menu .tia-bar1,
.tool-icon-anim--bars .tia-bar1 {
    transform-box: view-box;
    transform-origin: 32px 24px;
    animation: tia-bar 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--menu .tia-bar2,
.tool-icon-anim--bars .tia-bar2 {
    transform-box: view-box;
    transform-origin: 32px 32px;
    animation: tia-bar 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.12s;
}
.tool-icon-anim--menu .tia-bar3,
.tool-icon-anim--bars .tia-bar3 {
    transform-box: view-box;
    transform-origin: 32px 40px;
    animation: tia-bar 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.24s;
}
@keyframes tia-bar {
    0%, 100% { transform: scaleX(1); opacity: 1; }
    50% { transform: scaleX(0.72); opacity: 0.85; }
}

/* —— 图层堆叠呼吸 —— */
.tool-icon-anim--layers .tia-l1,
.tool-icon-anim--workflow .tia-l1 {
    transform-box: view-box;
    transform-origin: 32px 28px;
    animation: tia-layer 2.2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--layers .tia-l2,
.tool-icon-anim--workflow .tia-l2 {
    transform-box: view-box;
    transform-origin: 32px 34px;
    animation: tia-layer 2.2s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.15s;
}
.tool-icon-anim--layers .tia-l3,
.tool-icon-anim--workflow .tia-l3 {
    transform-box: view-box;
    transform-origin: 32px 40px;
    animation: tia-layer 2.2s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.3s;
}
@keyframes tia-layer {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, -1.5px, 0); }
}

/* —— 仪表盘：四格错落 —— */
.tool-icon-anim--dashboard .tia-t1 { animation: tia-tile-a 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite; }
.tool-icon-anim--dashboard .tia-t2 { animation: tia-tile-b 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.12s; }
.tool-icon-anim--dashboard .tia-t3 { animation: tia-tile-b 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.24s; }
.tool-icon-anim--dashboard .tia-t4 { animation: tia-tile-a 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.36s; }

/* —— 用户管理：前后层轻晃 —— */
.tool-icon-anim--users .tia-u1 {
    transform-box: view-box;
    transform-origin: 24px 36px;
    animation: tia-users-front 2.6s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--users .tia-u2 {
    transform-box: view-box;
    transform-origin: 42px 34px;
    animation: tia-users-back 2.6s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-users-front {
    0%, 100% { transform: translate3d(0, 0.4px, 0); }
    50% { transform: translate3d(0, -1.2px, 0); }
}
@keyframes tia-users-back {
    0%, 100% { transform: translate3d(0, -0.4px, 0); }
    50% { transform: translate3d(0, 1px, 0); }
}

/* —— 钱包：卡口轻弹 —— */
.tool-icon-anim--wallet .tia-flap {
    transform-box: view-box;
    transform-origin: 45px 37px;
    animation: tia-wallet 2.2s cubic-bezier(0.34, 1.3, 0.64, 1) infinite;
}
@keyframes tia-wallet {
    0%, 100% { transform: scale(1); }
    45% { transform: scale(1.1); }
}

/* —— 价签：轻摆 —— */
.tool-icon-anim--tags .tia-tag,
.tool-icon-anim--tag .tia-tag {
    transform-box: view-box;
    transform-origin: 28px 28px;
    animation: tia-tag 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--tags .tia-dot,
.tool-icon-anim--tag .tia-dot {
    animation: tia-blink 1.4s ease-in-out infinite;
}
@keyframes tia-tag {
    0%, 100% { transform: rotate(-4deg); }
    50% { transform: rotate(5deg); }
}

/* —— 趋势图：柱条起伏 —— */
.tool-icon-anim--chart .tia-mb1,
.tool-icon-anim--orders .tia-mb1 {
    transform-box: view-box;
    transform-origin: 21px 44px;
    animation: tia-mbar 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--chart .tia-mb2,
.tool-icon-anim--orders .tia-mb2 {
    transform-box: view-box;
    transform-origin: 32px 44px;
    animation: tia-mbar 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.15s;
}
.tool-icon-anim--chart .tia-mb3,
.tool-icon-anim--orders .tia-mb3 {
    transform-box: view-box;
    transform-origin: 43px 44px;
    animation: tia-mbar 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite 0.3s;
}
.tool-icon-anim--chart .tia-line,
.tool-icon-anim--orders .tia-line {
    animation: tia-glint 2.2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-mbar {
    0%, 100% { transform: scaleY(1); }
    50% { transform: scaleY(0.82); }
}

/* —— 功能拼图：点缀闪 —— */
.tool-icon-anim--features .tia-puzzle,
.tool-icon-anim--puzzle .tia-puzzle {
    transform-box: view-box;
    transform-origin: 32px 32px;
    animation: tia-puzzle 2.6s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--features .tia-dot,
.tool-icon-anim--puzzle .tia-dot {
    animation: tia-blink 1.3s ease-in-out infinite;
}
@keyframes tia-puzzle {
    0%, 100% { transform: rotate(-2deg) scale(1); }
    50% { transform: rotate(3deg) scale(1.04); }
}

/* —— 密钥：轻转 —— */
.tool-icon-anim--key .tia-key,
.tool-icon-anim--keys .tia-key {
    transform-box: view-box;
    transform-origin: 28px 30px;
    animation: tia-key 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-key {
    0%, 100% { transform: rotate(-6deg); }
    50% { transform: rotate(8deg); }
}

/* —— 邮箱：信纸浮出 + 角标闪 —— */
.tool-icon-anim--mail .tia-letter,
.tool-icon-anim--email .tia-letter,
.tool-icon-anim--envelope .tia-letter {
    transform-box: view-box;
    transform-origin: 32px 24px;
    animation: tia-letter 2.2s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--mail .tia-dot,
.tool-icon-anim--email .tia-dot,
.tool-icon-anim--envelope .tia-dot {
    transform-box: view-box;
    transform-origin: 48px 18px;
    animation: tia-blink 1.4s ease-in-out infinite;
}
@keyframes tia-letter {
    0%, 100% { transform: translate3d(0, 1px, 0); }
    50% { transform: translate3d(0, -3px, 0); }
}

/* —— 密码锁：锁梁轻晃 + 锁眼呼吸 —— */
.tool-icon-anim--lock .tia-shackle,
.tool-icon-anim--password .tia-shackle {
    transform-box: view-box;
    transform-origin: 32px 28px;
    animation: tia-shackle 2.4s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
.tool-icon-anim--lock .tia-keyhole,
.tool-icon-anim--password .tia-keyhole {
    transform-box: view-box;
    transform-origin: 32px 39px;
    animation: tia-keyhole 1.8s cubic-bezier(0.37, 0, 0.63, 1) infinite;
}
@keyframes tia-shackle {
    0%, 100% { transform: rotate(-3deg); }
    50% { transform: rotate(4deg); }
}
@keyframes tia-keyhole {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.12); }
}

/* —— 验证码盾牌：勾选弹跳 + 角标闪 —— */
.tool-icon-anim--shield .tia-check,
.tool-icon-anim--captcha .tia-check {
    transform-box: view-box;
    transform-origin: 32px 32px;
    animation: tia-shield-check 2s cubic-bezier(0.34, 1.3, 0.64, 1) infinite;
}
.tool-icon-anim--shield .tia-dot,
.tool-icon-anim--captcha .tia-dot {
    transform-box: view-box;
    transform-origin: 44px 18px;
    animation: tia-blink 1.3s ease-in-out infinite;
}
@keyframes tia-shield-check {
    0%, 100% { transform: scale(1); }
    40% { transform: scale(1.1); }
    60% { transform: scale(0.96); }
}

/* —— 退出：箭头点按 —— */
.tool-icon-anim--logout .tia-arrow {
    transform-box: view-box;
    transform-origin: 22px 32px;
    animation: tia-logout 1.8s cubic-bezier(0.34, 1.3, 0.64, 1) infinite;
}
@keyframes tia-logout {
    0%, 100% { transform: translate3d(0, 0, 0); }
    45% { transform: translate3d(-2.5px, 0, 0); }
}