/* =====================================================================
   agent-stage-fx.css  智能体页（agents.html）1:1 参考站视觉/动效补齐
   主题色由容器内联变量 --ag-rgb（R,G,B）驱动，每个智能体独立配色
   覆盖：渐变展示标题、入场逐块淡入、运行中三点打字指示、流式光标、呼吸在线点
   ===================================================================== */
:root{--ag-rgb:124,92,255;}

/* ---------- 展示字体栈（对齐参考站 Inter + 系统中文） ---------- */
.stage-title,.ag-hero-title h2,.ld-wrap .ag-hero-title h2{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","HarmonyOS Sans","Microsoft YaHei",sans-serif;}

/* ---------- 渐变标题（白 → 主题色，135° 裁切文字） ---------- */
.stage-title{
  font-weight:900 !important;letter-spacing:1px;line-height:1.12;
  background:linear-gradient(135deg,#ffffff 0%,rgb(var(--ag-rgb)) 78%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent !important;
  text-shadow:0 0 26px rgba(var(--ag-rgb),.28);}
.stage-title .s2-badge,.stage-title > *{-webkit-text-fill-color:initial;color:initial;}
.stage-title .s2-badge{
  background:linear-gradient(135deg,rgb(var(--ag-rgb)),rgba(var(--ag-rgb),.65))!important;
  color:#fff!important;border:none!important;letter-spacing:.5px;font-weight:900;
  box-shadow:0 4px 14px rgba(var(--ag-rgb),.5);}
.ld-wrap .ag-hero-title h2{
  font-weight:900;letter-spacing:1px;
  background:linear-gradient(135deg,#fff 0%,rgb(var(--ag-rgb)) 78%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}

/* ---------- 入场：逐块淡入上浮（对齐 sts2-fade-in）----------
   关键：默认完全可见；只有 #agentStage 带 .ag-fx 时才播放入场动画。
   由 agents.js 每次渲染后强制 reflow 再加上 .ag-fx 来可靠重播，
   避免动态切换智能体时动画不触发、内容永久卡在 opacity:0（“空框”问题）。 ---------- */
@keyframes agStageFade{0%{opacity:0;transform:translateY(12px);}100%{opacity:1;transform:translateY(0);}}
@keyframes agLeadIn{0%{opacity:0;transform:translateX(-12px);}100%{opacity:1;transform:translateX(0);}}
/* 覆盖 styles.css 里 .stage-hero/.stage-bigicon 自带的 stageFade/bigPop（both 填充，
   动态切换智能体重渲染时不会重播、会永久卡在 0% 空白）。默认一律可见，入场交给下方 .ag-fx 控制。 */
#agentStage .stage-hero,#agentStage .stage-bigicon{animation:none;}
/* 同样覆盖 agents-s2.css 里 .lead-card/.member 的 agLeadIn/agMemIn（both 会卡 0%） */
#agentStage .team-rail .lead-card,#agentStage .team-rail .member{animation:none;}
#agentStage.ag-fx .stage-hero,#agentStage.ag-fx .ld-wrap .ag-hero{animation:agStageFade .5s cubic-bezier(.2,.8,.25,1) both;}
#agentStage.ag-fx .stage-hero .stage-bigicon{animation:agStageFade .5s .04s cubic-bezier(.2,.8,.25,1) both;}
#agentStage.ag-fx .stage-hero .stage-title{animation:agStageFade .5s .10s cubic-bezier(.2,.8,.25,1) both;}
#agentStage.ag-fx .stage-hero .stage-herosub,#agentStage.ag-fx .stage-hero .stage-badges,#agentStage.ag-fx .stage-hero .ag-modes{animation:agStageFade .5s .16s cubic-bezier(.2,.8,.25,1) both;}
#agentStage.ag-fx .stage-hero .stage-team-line,#agentStage.ag-fx .stage-hero .stage-online{animation:agStageFade .5s .22s cubic-bezier(.2,.8,.25,1) both;}
#agentStage.ag-fx .team-rail{animation:agStageFade .55s .26s cubic-bezier(.2,.8,.25,1) both;}
#agentStage.ag-fx .team-rail .lead-card{animation:agLeadIn .5s .3s cubic-bezier(.2,.8,.25,1) both;}
#agentStage.ag-fx .team-rail .member{animation:agStageFade .45s both;}
#agentStage.ag-fx .param-card,#agentStage.ag-fx .ld-showcase,#agentStage.ag-fx .dp-download{animation:agStageFade .55s .32s cubic-bezier(.2,.8,.25,1) both;}
#agentStage.ag-fx .big-composer,#agentStage.ag-fx .ld-quick,#agentStage.ag-fx .ld-flow,#agentStage.ag-fx .ld-trigger-row{animation:agStageFade .55s .40s cubic-bezier(.2,.8,.25,1) both;}
#agentStage.ag-fx .ld-card{animation:agStageFade .4s ease both;}
@media (prefers-reduced-motion:reduce){#agentStage.ag-fx *{animation:none!important;}}

/* ---------- 在线呼吸点（对齐 sts2-huxi） ---------- */
.stage-online::before{
  box-shadow:0 0 0 0 rgba(52,211,153,.55);animation:agOnlineBreath 1.8s ease-in-out infinite;}
@keyframes agOnlineBreath{0%,100%{box-shadow:0 0 0 0 rgba(52,211,153,.5);opacity:1;}50%{box-shadow:0 0 0 5px rgba(52,211,153,0);opacity:.7;}}

/* ---------- 运行中：三点跳动打字指示（对齐 s2-typing-bounce） ---------- */
.rs-dots{display:inline-flex;align-items:center;gap:4px;padding:0 2px;}
.rs-dots i{width:6px;height:6px;border-radius:50%;background:rgb(var(--ag-rgb,99,102,241));
  display:inline-block;animation:agTypingBounce 1.4s infinite ease-in-out both;}
.rs-dots i:nth-child(1){animation-delay:-.32s;}
.rs-dots i:nth-child(2){animation-delay:-.16s;}
.rs-dots i:nth-child(3){animation-delay:0s;}
@keyframes agTypingBounce{0%,80%,100%{transform:scale(.4);opacity:.4;}40%{transform:scale(1);opacity:1;}}
.run-stage.doing .rs-dot{display:none;}
.run-stage.doing .rs-dots{display:inline-flex;}
.run-stage.done .rs-dots{display:none;}

/* ---------- 流式输出：末尾闪烁光标（打字机感） ---------- */
.run-output.typing{display:block;}
.run-output.typing::after{content:"▌";margin-left:2px;color:rgb(var(--ag-rgb,99,102,241));
  animation:agCaretBlink 1s steps(1) infinite;font-weight:700;}
@keyframes agCaretBlink{50%{opacity:0;}}

/* ---------- 落地页特性列表序号/悬浮微调（参考站一致） ---------- */
.ld-item{transition:transform .16s ease,border-color .16s ease,background .16s ease;}
.ld-item:hover{transform:translateX(3px);}

/* ---------- 浅色模式 ---------- */
html[data-theme="light"] .stage-title{background:linear-gradient(135deg,#1a2233 0%,rgb(var(--ag-rgb)) 80%);-webkit-background-clip:text;background-clip:text;}