/* HuiSeek 品牌加载动效。菱形 = 方块 rotate(45deg)，圆角 ≈ 边长 14%。 */
@keyframes hsHop{0%{transform:translateY(0) rotate(45deg)}45%,55%{transform:translateY(-80%) rotate(135deg)}100%{transform:translateY(0) rotate(225deg)}}
@keyframes hsWave{0%,70%,100%{transform:translateY(0) rotate(45deg);opacity:.35}35%{transform:translateY(-60%) rotate(45deg);opacity:1}}
@keyframes hsBlink{50%{opacity:0}}
@keyframes hsSpin{from{transform:rotate(45deg)}to{transform:rotate(405deg)}}
@keyframes hsRing{0%{transform:rotate(45deg) scale(1);opacity:.6}100%{transform:rotate(45deg) scale(2.3);opacity:0}}
@keyframes hsBar{from{transform:translateX(-100%)}to{transform:translateX(300%)}}
@keyframes hsShimmer{from{background-position:150% 0}to{background-position:-50% 0}}
@keyframes hsCell{0%,100%{opacity:.15}18%{opacity:1}45%{opacity:.15}}

.hs-diamond{display:inline-block;border-radius:14%;transform:rotate(45deg);flex:none}
/* 品牌加载：启动页 logo 的火花 */ .hs-hop{animation:hsHop 2.4s var(--hs-ease) infinite}
/* AI 思考中：3 个菱形，延迟 0 / .15s / .3s */ .hs-wave{animation:hsWave 1.2s ease-in-out infinite}
/* 流式输出光标 */ .hs-caret{animation:hsBlink 1s step-end infinite}
/* 子代理运行中：实心蓝菱形旋转 + 同尺寸描边菱形外扩 */ .hs-spin{animation:hsSpin 1.6s var(--hs-ease) infinite} .hs-ring{animation:hsRing 1.6s ease-out infinite}
/* 系统/网络加载：墨色描边菱形，左边透明 */ .hs-sys-spin{border:2px solid currentColor;border-left-color:transparent;background:transparent;animation:hsSpin 1.2s var(--hs-ease) infinite}
/* 顶部进度条：宽 35% 的墨色条 + 头部 6px 菱形 */ .hs-topbar{animation:hsBar 1.6s var(--hs-ease) infinite}
.hs-skeleton{background:linear-gradient(90deg,var(--hs-surface-sunken) 25%,var(--hs-surface) 50%,var(--hs-surface-sunken) 75%);background-size:200% 100%;animation:hsShimmer 1.4s linear infinite;border-radius:4px}
/* 主 Agent 运行中：3×3 菱形点阵，随机闪烁。每格 delay/duration 见 README */ .hs-cell{animation-name:hsCell;animation-timing-function:linear;animation-iteration-count:infinite}

/* 颜色走语义层：AI 用 --hs-ai-accent，系统加载用 --hs-sys-spinner，骨架屏用沉底 / 表面 */
.hs-hop,
.hs-wave,
.hs-caret,
.hs-spin,
.hs-cell { background: var(--hs-ai-accent); }
.hs-ring {
  background: transparent;
  border: 1.5px solid var(--hs-ai-accent);
  box-sizing: border-box;
}
.hs-sys-spin { color: var(--hs-sys-spinner); }
.hs-topbar { background: var(--hs-sys-spinner); }

@media (prefers-reduced-motion: reduce) {
  .hs-hop,
  .hs-wave,
  .hs-caret,
  .hs-spin,
  .hs-ring,
  .hs-sys-spin,
  .hs-topbar,
  .hs-skeleton,
  .hs-cell { animation: none; }
}