/* ============================================================
   Rocanvas Agent Orb · 生产版组件（配色 A · 品牌四色 · 白眼紫瞳）
   结构与动效 = RunningHub 配方；纯 CSS 动画 + 15 行眨眼 JS
   默认 data-p="brand"（紫为主，桃粉暖极，薄荷冷极，白热芯）；data-p="sonoma" 备用
   用法：
     <div class="rco-orb" data-p="brand" style="--s:48px">
       <div class="rco-orb__inner">
         <i class="rco-glow"></i><i class="rco-l rco-l1"></i>
         <i class="rco-l rco-l2"></i><i class="rco-l rco-l3"></i><i class="rco-core"></i>
         <span class="rco-eyes"><span class="rco-eye"></span><span class="rco-eye"></span></span>
       </div>
     </div>
   状态：宿主元素 data-state="idle|thinking|working|error|done"
   ============================================================ */

.rco-orb{position:relative;pointer-events:none;flex:none;
  width:var(--s,48px);height:var(--s,48px);
  /* 速度 token：状态机改这里 */
  --mt1:4s;--mt2:5s;--mt3:3.6s;--sp1:6s;--sp2:7.2s;--sp3:4.8s;--brt:2.2s;
  /* 尺寸比例（同原版） */
  --glow:calc(var(--s)*1.22);--l1:calc(var(--s)*.98);--l2:calc(var(--s)*.93);--l3:calc(var(--s)*1.05);
  --core:calc(var(--s)*.62);--eyew:max(2px,calc(var(--s)*.098));--eyeh:calc(var(--s)*.165);--gap:calc(var(--s)*.136)}
.rco-orb__inner{position:absolute;inset:0;display:grid;place-items:center;
  animation:rco-float 4.8s ease-in-out infinite}
.rco-orb i{position:absolute;display:block}

.rco-glow{border-radius:50%;width:var(--glow);height:var(--glow);filter:blur(6.5px);
  animation:rco-breathe var(--brt) ease-in-out infinite alternate}
.rco-l{mix-blend-mode:screen;filter:blur(2.8px);border-radius:60% 40% 30% 70%/60% 30% 70% 40%}
.rco-l1{width:var(--l1);height:var(--l1);animation:rco-morph var(--mt1) ease-in-out infinite,rco-spin var(--sp1) linear infinite}
.rco-l2{width:var(--l2);height:var(--l2);animation:rco-morph var(--mt2) ease-in-out infinite reverse,rco-spin var(--sp2) linear infinite reverse}
.rco-l3{width:var(--l3);height:var(--l3);animation:rco-morph var(--mt3) ease-in-out infinite,rco-spin var(--sp3) linear infinite}
.rco-core{width:var(--core);height:var(--core);border-radius:50%;filter:blur(3.4px);
  animation:rco-core var(--brt) ease-in-out infinite alternate}
.rco-eyes{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;
  gap:var(--gap);animation:rco-breathe var(--brt) ease-in-out infinite alternate}
.rco-eye{width:var(--eyew);height:var(--eyeh);border-radius:50%;
  background:radial-gradient(circle at 50% 60%,#2a1846 0 33%,#f6f2ff 36%);
  box-shadow:0 1px 3px rgba(30,12,66,.5),inset 0 -1px 2px rgba(120,90,200,.35);
  transform-origin:center;transition:transform .15s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1)}
.rco-orb.is-blink .rco-eye{transform:scaleY(.1);opacity:.9}

@keyframes rco-float{50%{transform:translateY(-3px)}}
@keyframes rco-breathe{0%{transform:scale(.94);opacity:.84}100%{transform:scale(1.06);opacity:1}}
@keyframes rco-core{0%{transform:scale(.86);opacity:.82}100%{transform:scale(1.16);opacity:1}}
@keyframes rco-spin{to{transform:rotate(360deg)}}
@keyframes rco-morph{0%,100%{border-radius:60% 40% 30% 70%/60% 30% 70% 40%}
  33%{border-radius:30% 60% 70% 40%/50% 60% 30%}66%{border-radius:70% 30% 50% 50%/30% 30% 70% 70%}}

/* ---------- 配色 A · 品牌四色（默认）：紫为主，桃粉暖极，薄荷收冷极，白热芯 ---------- */
.rco-orb[data-p="brand"]{
  --g:171,104,255;
  --glow-c:rgba(171,104,255,.5);
  --l1a:#c084fc;--l1b:#ab68ff;
  --l2a:#ff9e6d;--l2b:#f294e8;
  --l3a:#8aead9;--l3b:#7aa8ff;
  --core-mid:rgba(171,104,255,.85)}
/* ---------- 配色 B · Sonoma 紫（备用）：紫→品红→深蓝 ---------- */
.rco-orb[data-p="sonoma"]{
  --g:150,90,255;
  --glow-c:rgba(150,80,255,.5);
  --l1a:#b57bff;--l1b:#7c3aed;
  --l2a:#ff5ea8;--l2b:#c04cff;
  --l3a:#5e9dff;--l3b:#8f6bff;
  --core-mid:rgba(150,90,255,.85)}
.rco-orb[data-p] .rco-glow{background:radial-gradient(circle,var(--glow-c),rgba(var(--g),.16) 38%,transparent 72%)}
.rco-orb[data-p] .rco-l1{background:linear-gradient(45deg,var(--l1a),var(--l1b))}
.rco-orb[data-p] .rco-l2{background:linear-gradient(45deg,var(--l2a),var(--l2b))}
.rco-orb[data-p] .rco-l3{background:linear-gradient(45deg,var(--l3a),var(--l3b))}
.rco-orb[data-p] .rco-core{background:radial-gradient(circle,rgba(255,255,255,.96) 0%,var(--core-mid) 30%,rgba(var(--g),.36) 62%,transparent 100%)}

/* ---------- 状态机 ---------- */
/* 思考：morph/自转整体提速 */
.rco-orb[data-state="thinking"]{--mt1:2.2s;--mt2:2.8s;--mt3:2s;--sp1:3.2s;--sp2:3.8s;--sp3:2.6s}
/* 生成中：更亮更饱和 */
.rco-orb[data-state="working"]{--glow-c:rgba(171,104,255,.62)}
.rco-orb[data-state="working"] .rco-l{filter:blur(2.8px) saturate(1.18)}
/* 出错：整环转红 */
.rco-orb[data-state="error"]{
  --g:255,110,118;--glow-c:rgba(255,100,110,.5);
  --l1a:#ff8f9a;--l1b:#d94060;--l2a:#ffb39a;--l2b:#ff5e8a;--l3a:#ff9db4;--l3b:#c2456f;
  --core-mid:rgba(255,110,120,.85)}
/* 完成：一记点头式缩放（JS 在 600ms 后移除 data-state） */
.rco-orb[data-state="done"] .rco-orb__inner{animation:rco-done .5s cubic-bezier(.2,.7,.3,1)}
@keyframes rco-done{0%{transform:scale(1)}45%{transform:scale(1.14)}100%{transform:scale(1)}}

/* ---------- 小尺寸补偿（≤32：光晕/核心占比加大，同原版） ---------- */
.rco-orb[data-small]{--glow:calc(var(--s)*1.34);--l1:calc(var(--s)*1.04);
  --l2:calc(var(--s)*.96);--l3:calc(var(--s)*1.1);--core:calc(var(--s)*.66)}

/* ---------- 浅色画布模式（canvas 夜间切换的白天态） ---------- */
.canvas-studio:has(button[title="切换到夜间模式"]) .rco-orb .rco-glow{opacity:.55}
.canvas-studio:has(button[title="切换到夜间模式"]) .rco-orb .rco-l{filter:blur(2.4px) saturate(1.1)}

/* ---------- 接入 Roc Creator 悬浮按钮 ----------
   JS 往 launcher 的 .roc-drop-host 里渲染 orb 后，给 launcher 加 .rco-mode：
   去掉圆形底壳与旧 float/glow 动画（光晕即按钮），Three.js 水滴不再挂载 */
.roc-home-agent-launcher.rco-mode{background:transparent;border-color:transparent;box-shadow:none;overflow:visible}
.roc-home-agent-launcher.rco-mode:hover{border-color:transparent;transform:translateY(-2px) scale(1.02)}
/* 常驻浮动交给 orb 自身，关掉按钮上旧的 float/glow 动画 */
.roc-home-agent-launcher.rco-mode,
.roc-home-agent-launcher.rco-mode img,
.canvas-studio .roc-creator-launcher.rco-mode{animation:none}

/* Rocanvas integration: keep existing controls, remove only the old mascot shell. */
.canvas-studio .roc-creator-launcher.rco-mode{background:transparent;border-color:transparent;box-shadow:none;overflow:visible}
.canvas-studio .roc-creator-launcher.rco-mode:hover{background:transparent;border-color:transparent;box-shadow:none}
.canvas-studio .roc-creator-launcher.rco-mode>.roc-drop{width:48px!important;height:48px!important;animation:none}
.roc-home-agent-launcher.rco-mode .roc-drop-host{width:48px;height:48px}
.production-assistant-heading .roc-drop-host{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;vertical-align:middle;overflow:visible}

/* ---------- 可达性：reduced-motion 定格在呼吸中点、保持睁眼 ---------- */
@media(prefers-reduced-motion:reduce){
  .rco-orb i,.rco-orb .rco-eyes,.rco-orb .rco-orb__inner{animation:none!important}
  .rco-orb .rco-eye{transition:none}
  .rco-orb.is-blink .rco-eye{transform:none}
}

/* Canvas launcher: the orb is the whole visual, with no glass shell. */
.canvas-studio button.roc-creator-launcher,.canvas-studio button.roc-creator-launcher:hover{border:0!important;background:none!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}