/* ============================================================
   星枢AI 工作台智能体 S2 差异化层（任务2 · chat.html 内嵌）
   agent-workspace.js 为每个专家智能体注入 --aw-rgb（独立主题色），
   贯穿英雄图标 / 主管+员工团队 / 任务表单选中项 / 创作模式 / 发送按钮，
   并带光环、呼吸、错落浮入等动效——每个智能体颜色与界面都不同。
   ============================================================ */
#agentWorkspace { --aw-rgb: 124, 92, 255; }

/* —— 英雄区 —— */
.ag-hero { position: relative; }
.ag-hero-ico {
  position: relative;
  background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .55)) !important;
  box-shadow: 0 0 0 1px rgba(var(--aw-rgb), .4), 0 12px 36px rgba(var(--aw-rgb), .4);
}
.ag-hero-ico::before {
  content: ""; position: absolute; inset: -8px; border-radius: 50%;
  border: 1.5px dashed rgba(var(--aw-rgb), .55);
  animation: awRingSpin 14s linear infinite; pointer-events: none;
}
.ag-hero-ico::after {
  content: ""; position: absolute; inset: -2px; border-radius: 50%;
  border: 2px solid rgba(var(--aw-rgb), .25);
  animation: awPulse 2.8s ease-in-out infinite; pointer-events: none;
}
@keyframes awRingSpin { to { transform: rotate(360deg); } }
@keyframes awPulse { 0%, 100% { transform: scale(1); opacity: .9; } 50% { transform: scale(1.12); opacity: .3; } }
.ag-hero-title h2 { background: linear-gradient(120deg, #fff 30%, rgba(var(--aw-rgb), 1)); -webkit-background-clip: text; background-clip: text; }
.ag-s-badge { background: rgba(var(--aw-rgb), .18) !important; color: rgb(var(--aw-rgb)) !important; border: 1px solid rgba(var(--aw-rgb), .5) !important; }
.ag-slogan { color: rgb(var(--aw-rgb)) !important; letter-spacing: .12em; }
.ag-slogan .dot { color: rgba(var(--aw-rgb), .6); }

/* —— 创作模式入口 —— */
.aw-modes { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 6px 0 4px; }
.aw-mode {
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  padding: 9px 20px; border-radius: 999px; font-size: 13.5px; font-weight: 700;
  color: rgb(var(--aw-rgb)); background: rgba(var(--aw-rgb), .08);
  border: 1.5px solid rgba(var(--aw-rgb), .4);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
  animation: awModeIn .45s ease both;
}
.aw-mode:nth-child(2) { animation-delay: .08s; }
.aw-mode:nth-child(3) { animation-delay: .16s; }
.aw-mode .awm-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .7; }
.aw-mode:hover { transform: translateY(-2px); background: rgba(var(--aw-rgb), .16); box-shadow: 0 8px 20px rgba(var(--aw-rgb), .3); }
.aw-mode.on { color: #fff; background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .7)); border-color: transparent; box-shadow: 0 8px 22px rgba(var(--aw-rgb), .42); }
@keyframes awModeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

/* —— 专家团队：主管在左 + 员工网格 —— */
.ag-team-head .t-online-dot { background: rgb(var(--aw-rgb)) !important; box-shadow: 0 0 8px rgba(var(--aw-rgb), .8); }
.ag-team-head .t-title { color: rgb(var(--aw-rgb)); }
.ag-experts { align-items: center; gap: 26px; }
.ag-expert-lead {
  border-color: rgba(var(--aw-rgb), .45) !important;
  background: linear-gradient(160deg, rgba(var(--aw-rgb), .16), rgba(var(--aw-rgb), .04)) !important;
  box-shadow: 0 0 0 1px rgba(var(--aw-rgb), .15), 0 10px 28px rgba(var(--aw-rgb), .18);
  animation: awLeadIn .5s ease both;
}
.ag-expert-lead .m-ava {
  background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .55)) !important;
  color: #fff !important; animation: awLeadGlow 2.8s ease-in-out infinite;
}
@keyframes awLeadIn { from { opacity: 0; transform: translateX(-12px); } to { opacity: 1; transform: translateX(0); } }
@keyframes awLeadGlow { 0%, 100% { box-shadow: 0 0 0 0 rgba(var(--aw-rgb), .45); } 50% { box-shadow: 0 0 0 7px rgba(var(--aw-rgb), 0); } }
.m-host-tag { background: rgba(var(--aw-rgb), .2) !important; color: rgb(var(--aw-rgb)) !important; }
.ag-expert-grid { display: flex; flex-wrap: wrap; gap: 14px 18px; }
.ag-expert { animation: awMemIn .45s ease both; }
.ag-expert:nth-child(1) { animation-delay: .05s; } .ag-expert:nth-child(2) { animation-delay: .1s; }
.ag-expert:nth-child(3) { animation-delay: .15s; } .ag-expert:nth-child(4) { animation-delay: .2s; }
.ag-expert:nth-child(5) { animation-delay: .25s; } .ag-expert:nth-child(6) { animation-delay: .3s; }
.ag-expert:nth-child(7) { animation-delay: .35s; } .ag-expert:nth-child(8) { animation-delay: .4s; }
.ag-expert:nth-child(9) { animation-delay: .45s; } .ag-expert:nth-child(10) { animation-delay: .5s; }
.ag-expert:nth-child(11) { animation-delay: .55s; }
@keyframes awMemIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.ag-expert .m-ava {
  background: rgba(var(--aw-rgb), .13) !important; color: rgb(var(--aw-rgb)) !important;
  border: 1px solid rgba(var(--aw-rgb), .45); font-weight: 800;
  transition: transform .2s ease;
}
.ag-expert:hover .m-ava { transform: scale(1.12) rotate(-4deg); }

/* —— 任务表单 —— */
.ag-form-card { border-color: rgba(var(--aw-rgb), .22) !important; }
.ag-form-head .fh-ico { background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .55)) !important; }
.ag-field .fl-ico { background: rgba(var(--aw-rgb), .16) !important; color: rgb(var(--aw-rgb)) !important; }
.ag-field .fl-num { color: rgb(var(--aw-rgb)); }
.ag-opt { transition: all .16s ease; }
.ag-opt.sel { background: rgba(var(--aw-rgb), .16) !important; border-color: rgb(var(--aw-rgb)) !important; color: rgb(var(--aw-rgb)) !important; }
.ag-opt.ag-required.is-sel { background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .72)) !important; color: #fff !important; border-color: transparent !important; }
.ag-opt:hover { border-color: rgba(var(--aw-rgb), .6); transform: translateY(-1px); }
.ag-textarea:focus, .ag-input:focus { border-color: rgba(var(--aw-rgb), .6) !important; box-shadow: 0 0 0 3px rgba(var(--aw-rgb), .14); outline: none; }

/* —— 智能体态输入框 / 发送按钮跟随主题色 —— */
#wsComposer.agent-mode { border-color: rgba(var(--aw-rgb), .3); }
#wsComposer.agent-mode:focus-within { border-color: rgba(var(--aw-rgb), .65); box-shadow: 0 0 0 3px rgba(var(--aw-rgb), .15); }
#wsComposer.agent-mode .send-btn,
#wsComposer.agent-mode #sendBtn,
#wsComposer.agent-mode .composer-send {
  background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .7)) !important;
  box-shadow: 0 8px 22px rgba(var(--aw-rgb), .4);
}

/* ============ 桌面部署类智能体引导页（1:1 参考站） ============ */
.dp-wrap { animation: dpFade .4s ease both; padding: 4px 2px 24px; }
@keyframes dpFade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.dp-kicker { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .5px;
  color: rgb(var(--aw-rgb)); background: rgba(var(--aw-rgb), .12);
  border: 1px solid rgba(var(--aw-rgb), .3); padding: 4px 12px; border-radius: 999px; margin-bottom: 14px; }
.dp-title { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.dp-title h2 { font-size: 26px; font-weight: 800; color: #f2f4fa; margin: 0; }
.dp-ico { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 26px;
  background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .55));
  box-shadow: 0 8px 22px rgba(var(--aw-rgb), .35); }
.dp-lead { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.dp-lead em { font-style: normal; font-size: 13px; color: #c8d0e0;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1);
  padding: 5px 12px; border-radius: 999px; }
.dp-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-bottom: 26px; }
.dp-feat { position: relative; overflow: hidden; padding: 16px; border-radius: 16px;
  background: linear-gradient(160deg, rgba(var(--aw-rgb), .12), rgba(255,255,255,.03));
  border: 1px solid rgba(var(--aw-rgb), .22);
  animation: dpCardIn .5s ease both; transition: transform .2s, border-color .2s, box-shadow .2s; }
.dp-feat:hover { transform: translateY(-3px); border-color: rgba(var(--aw-rgb), .55);
  box-shadow: 0 14px 34px rgba(var(--aw-rgb), .22); }
@keyframes dpCardIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.dp-feat-ico { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-size: 20px;
  background: rgba(var(--aw-rgb), .16); margin-bottom: 10px; }
.dp-feat h4 { margin: 0 0 6px; font-size: 15px; font-weight: 700; color: #eef1f8; }
.dp-feat p { margin: 0; font-size: 12.5px; line-height: 1.6; color: #9aa3b8; }
.dp-steps { margin-bottom: 24px; }
.dp-step { position: relative; display: flex; gap: 14px; padding: 0 0 18px 0; animation: dpCardIn .5s ease both; }
.dp-step::before { content: ""; position: absolute; left: 19px; top: 40px; bottom: 0; width: 2px;
  background: linear-gradient(rgba(var(--aw-rgb), .5), rgba(var(--aw-rgb), .08)); }
.dp-step:last-child::before { display: none; }
.dp-step-no { flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center;
  font-weight: 800; font-size: 15px; color: #fff; z-index: 1;
  background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .6));
  box-shadow: 0 0 0 4px rgba(var(--aw-rgb), .12); }
.dp-step-c h4 { margin: 2px 0 5px; font-size: 15px; font-weight: 700; color: #eef1f8; }
.dp-step-c p { margin: 0; font-size: 13px; line-height: 1.65; color: #9aa3b8; }
.dp-download { border-radius: 18px; padding: 18px;
  background: linear-gradient(160deg, rgba(var(--aw-rgb), .14), rgba(255,255,255,.03));
  border: 1px solid rgba(var(--aw-rgb), .3); margin-bottom: 14px; }
.dp-sys-row { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.dp-dl-label { font-size: 13px; color: #9aa3b8; }
.dp-sys-group { display: inline-flex; gap: 6px; background: rgba(0,0,0,.25); padding: 4px; border-radius: 10px; }
.dp-sys { border: 0; cursor: pointer; padding: 6px 16px; border-radius: 8px; font-size: 13px;
  color: #b9c1d4; background: transparent; transition: all .18s; }
.dp-sys.on { color: #fff; font-weight: 700; background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .7));
  box-shadow: 0 6px 16px rgba(var(--aw-rgb), .35); }
.dp-dl-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.dp-dl-info strong { display: block; font-size: 15px; color: #eef1f8; margin-bottom: 4px; }
.dp-dl-info small { font-size: 12.5px; color: #9aa3b8; }
.dp-dl-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.dp-dl-btn { position: relative; overflow: hidden; border: 0; cursor: pointer; color: #fff; font-weight: 700; font-size: 14px;
  padding: 11px 22px; border-radius: 12px;
  background: linear-gradient(135deg, rgba(var(--aw-rgb), 1), rgba(var(--aw-rgb), .68));
  box-shadow: 0 10px 26px rgba(var(--aw-rgb), .4); transition: transform .16s, box-shadow .16s; }
.dp-dl-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(var(--aw-rgb), .55); }
.dp-dl-btn::after { content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.45), transparent);
  transform: skewX(-20deg); animation: dpShine 2.8s ease-in-out infinite; }
@keyframes dpShine { 0%, 60% { left: -60%; } 100% { left: 130%; } }
.dp-sk-btn { border: 1px solid rgba(var(--aw-rgb), .45); cursor: pointer; color: rgb(var(--aw-rgb));
  font-weight: 600; font-size: 14px; padding: 11px 18px; border-radius: 12px; background: rgba(var(--aw-rgb), .08);
  transition: background .16s; }
.dp-sk-btn:hover { background: rgba(var(--aw-rgb), .18); }
.dp-models { margin-top: 14px; font-size: 12.5px; color: #9aa3b8; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dp-models span { color: rgb(var(--aw-rgb)); font-weight: 700; }
@media (max-width: 720px) { .dp-features { grid-template-columns: 1fr; } }

/* ============================================================
   智能体(agent-mode)输入框 1:1 参考站：
   只保留 [上传块 | 输入框] + 底部(?玩法 + 发送)；
   隐藏模型创作大师圈轨道/两侧工具列/工具行/参数chip/综合最优等冗余，
   这些在智能体里由上方 S2 表单承担，避免遮挡与重复。
   ============================================================ */
#wsComposer.agent-mode .cp-masters{display:none !important;}
#wsComposer.agent-mode .cp-side{display:none !important;}
#wsComposer.agent-mode .composer-toolbar{display:none !important;}
#wsComposer.agent-mode .composer-params{display:none !important;}
#wsComposer.agent-mode .mode-buttons{display:none !important;}
#wsComposer.agent-mode .cp-enter-hint{display:none !important;}
#wsComposer.agent-mode .ai-writer-open{display:none !important;}
#wsComposer.agent-mode .cp-corner{display:none !important;}
#wsComposer.agent-mode .cp-layout{gap:0;}
#wsComposer.agent-mode .composer-box{
  display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;
  padding:10px 14px 8px;
}
/* 左侧上传块：横向小尺寸（首帧/尾帧并排），无内容时自然塌陷，1:1 参考站扁平输入条 */
#wsComposer.agent-mode .cp-refs{order:0;flex:0 0 auto;width:auto;max-width:46%;margin:0;}
#wsComposer.agent-mode .cp-refs .cp-frames{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px;}
#wsComposer.agent-mode .cp-refs .attachment-list{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px;}
/* 已添加附件：保持摞牌叠放（不被上面的 wrap 平铺覆盖），1:1 参考站 */
#wsComposer.agent-mode .cp-refs #attachmentList.sp-stack{display:block;flex:none;width:78px;height:92px;align-items:stretch;}
#wsComposer.agent-mode .cp-refs .cp-frame-add,
#wsComposer.agent-mode .cp-refs .att-item{width:60px;height:60px;min-height:0;}
#wsComposer.agent-mode .cp-refs:empty{display:none;}
/* 输入框与上传块同一行、占满剩余宽度，矮而可长大 */
#wsComposer.agent-mode #promptInput,
#wsComposer.agent-mode textarea{order:1;flex:1 1 0!important;width:auto!important;min-height:52px;max-height:140px;min-width:0;border:0 !important;background:transparent !important;padding:2px 0 0;resize:none;line-height:1.6;}
/* 底部整行：左玩法说明，右发送 */
#wsComposer.agent-mode .composer-bottom{order:2;flex:1 1 100%;display:flex;align-items:center;gap:10px;margin-top:0;border-top:1px solid rgba(255,255,255,.06);padding-top:8px;}
#wsComposer.agent-mode .ag-playbook-btn{
  display:inline-flex !important;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);color:#c6ccdb;font-size:12.5px;cursor:pointer;
}
#wsComposer.agent-mode .ag-playbook-btn:hover{border-color:rgba(var(--aw-rgb),.6);color:rgb(var(--aw-rgb));}
#wsComposer.agent-mode .send-stack{margin-left:auto;display:flex;align-items:center;gap:8px;}
#wsComposer.agent-mode .send-btn,#wsComposer.agent-mode #sendBtn{
  width:36px;height:36px;border-radius:50%;border:0;cursor:pointer;color:#fff;
  display:grid;place-items:center;flex:0 0 auto;
}
#wsComposer.agent-mode .send-btn svg,#wsComposer.agent-mode #sendBtn svg{width:18px;height:18px;}
/* 计费角标内收，不压输入 */
#wsComposer.agent-mode .cp-corner{position:absolute;top:8px;right:12px;z-index:2;}
@media (max-width:640px){
  #wsComposer.agent-mode .cp-refs{max-width:60%;}
  #wsComposer.agent-mode .cp-refs .cp-frame-add,
  #wsComposer.agent-mode .cp-refs .att-item{width:54px;height:54px;}
}