/* AUTH_BUMPED: 选择器统一加 .cp-v2 提权，最后加载，覆盖 sp-v51/ref-align 旧斜卡 */
/* =====================================================================
   作曲器插入区 1:1 复刻（参考站 hz.lk888.ai 实测 DOM/getComputedStyle/hover）
   对应：.stack-container / .fujian-card.stacked-card / .unified-upload-component
   - 空：斜放虚线小卡（rotate -8°）+「+ / 附件 / 0/10」
   - 有卡：白边拍立得斜卡交叉叠放（-10/+14/-18…），+ 收成右下深色圆
   - hover：手牌扇形展开（每张右移 56px、±8°），悬停卡 scale1.25 上浮，
            显文件名+大小气泡、右上圆形 X；+ 变回完整虚线卡排到队尾
   适用于：通用附件牌堆 .cp-v2 #attachmentList.sp-stack 与 类型化槽位牌堆 .cp-fstack
   ===================================================================== */
:root {
  --cp-cw: 66px;
  --cp-ch: 82px;
  --cp-fan: 56px;
  --cp-ease: cubic-bezier(.4, 0, .2, 1);
  --cp-slot-bg: #2d2f35;
  --cp-slot-bg2: #31343c;
  --cp-slot-line: rgba(98, 105, 113, .6);
  --cp-slot-fg: #626971;
}

/* 对话/智能体/三维：含统一附件斜卡时，附件区必须可见 */
.ws-v2 .ws-composer.cp-v2 .cp-refs:has(.sp-add) { display: flex !important; }

/* ---------- 牌堆容器（固定 66×82，溢出可见以承载扇形） ---------- */
.cp-v2 #attachmentList.sp-stack,
.cp-v2 .cp-fstack {
  position: relative !important;
  display: block !important;
  width: var(--cp-cw) !important;
  height: var(--cp-ch) !important;
  min-width: var(--cp-cw);
  overflow: visible !important;
  flex: 0 0 auto;
  margin: 0;
}
.cp-v2 .cp-frames { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px; }

/* ---------- 白边拍立得卡（绝对叠放，静止角度 --sr） ---------- */
.cp-v2 #attachmentList.sp-stack .sp-stack-card,
.cp-v2 .cp-fstack .cp-fstack-card.filled {
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: var(--cp-cw) !important;
  height: var(--cp-ch) !important;
  margin: 0 !important; padding: 0 !important;
  border: 2px solid #fff !important;
  border-radius: 3px !important;
  background: var(--cp-slot-bg);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .30);
  overflow: visible !important;
  transform: rotate(var(--sr, 0deg)) translateZ(0);
  transition: transform .4s var(--cp-ease), box-shadow .4s var(--cp-ease);
  cursor: zoom-in;
}
.cp-v2 #attachmentList.sp-stack .sp-stack-card img,
.cp-v2 #attachmentList.sp-stack .sp-stack-card video,
.cp-v2 .cp-fstack .cp-fstack-card.filled img,
.cp-v2 .cp-fstack .cp-fstack-card.filled video {
  position: absolute !important; inset: 0 !important;
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; border-radius: 1px; background: #000;
}
.cp-v2 .cp-fstack .cp-fstack-card.filled em,
.cp-v2 .cp-fstack .cp-fstack-card.filled .cp-frame-badge { display: none !important; }
.cp-v2 .cp-fstack .cp-fstack-card.filled .cpf-file {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 3px; padding: 4px;
  color: #9fb4c4; font-size: 18px; background: rgba(14, 20, 28, .94); text-align: center;
}
.cp-v2 .cp-fstack .cp-fstack-card.filled .cpf-file small {
  font-size: 9px; line-height: 1.2; color: #c7d0dd; max-width: 92%;
  word-break: break-all; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---------- hover 手牌扇形 ---------- */
.cp-v2 #attachmentList.sp-stack:hover .sp-stack-card,
.cp-v2 .cp-fstack:hover .cp-fstack-card.filled {
  transform: translateX(calc(var(--i, 0) * var(--cp-fan))) rotate(var(--hr, 0deg)) scale(1) translateZ(0);
  z-index: calc(var(--i, 0) + 1);
}
.cp-v2 #attachmentList.sp-stack:hover .sp-stack-card:hover,
.cp-v2 .cp-fstack:hover .cp-fstack-card.filled:hover {
  transform: translateX(calc(var(--i, 0) * var(--cp-fan))) translateY(-12px) rotate(var(--hr, 0deg)) scale(1.25) translateZ(0);
  border-color: #fff !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, .55);
  z-index: 1000 !important;
}

/* ---------- 删除圆钮（仅悬停该卡时出现，右上） ---------- */
.cp-v2 #attachmentList.sp-stack .sp-x,
.cp-v2 .cp-fstack .cp-fstack-card.filled .cp-frame-x {
  display: none;
  position: absolute !important;
  top: -9px !important; right: -9px !important;
  width: 22px !important; height: 22px !important; line-height: 20px !important;
  border-radius: 50% !important;
  background: #1f2227 !important;
  border: 1px solid #41474c !important;
  color: rgba(255, 255, 255, .92) !important;
  font-size: 13px !important; font-style: normal; text-align: center;
  padding: 0 !important; z-index: 1100 !important; cursor: pointer;
  transition: background .2s, transform .2s;
}
.cp-v2 #attachmentList.sp-stack .sp-stack-card:hover .sp-x,
.cp-v2 .cp-fstack .cp-fstack-card.filled:hover .cp-frame-x { display: block; }
.cp-v2 #attachmentList.sp-stack .sp-x:hover,
.cp-v2 .cp-fstack .cp-fstack-card.filled .cp-frame-x:hover {
  background: rgba(239, 68, 68, .85) !important; border-color: rgba(239, 68, 68, .6) !important;
  transform: scale(1.1);
}

/* ---------- 文件名气泡（卡上方，悬停出现） ---------- */
.cp-v2 #attachmentList.sp-stack .sp-stack-card .sp-name,
.cp-v2 .cp-fstack .cp-fstack-tip {
  display: none;
  position: absolute; left: 50%; bottom: calc(100% + 10px);
  transform: translateX(-50%);
  flex-direction: column; align-items: center; gap: 1px;
  background: rgba(45, 47, 53, .94);
  border: 1px dashed rgba(120, 126, 134, .5);
  border-radius: 8px; padding: 5px 10px;
  max-width: 190px; z-index: 1200; pointer-events: none; white-space: nowrap;
}
.cp-v2 #attachmentList.sp-stack .sp-stack-card:hover .sp-name,
.cp-v2 .cp-fstack .cp-fstack-card.filled:hover .cp-fstack-tip { display: flex; }
.cp-v2 #attachmentList.sp-stack .sp-stack-card .spn-name,
.cp-v2 .cp-fstack .ft-name {
  font-size: 10.5px; color: #c9d1d6; max-width: 176px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cp-v2 #attachmentList.sp-stack .sp-stack-card .spn-size,
.cp-v2 .cp-fstack .ft-size { font-size: 9px; color: #9aa4ad; opacity: .85; }
/* 去掉旧 sp-name 的小三角与底部气泡定位残留 */
.cp-v2 #attachmentList.sp-stack .sp-stack-card .sp-name::after { content: none; }

/* =====================================================================
   「+」添加控件（统一附件 .sp-add 与 牌堆 .cp-fstack-add 共用视觉）
   ===================================================================== */
.sp-add,
.cp-v2 .cp-fstack-add {
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: var(--cp-cw) !important; height: var(--cp-ch) !important;
  margin: 0 !important; padding: 0 !important;
  border: 1px dashed var(--cp-slot-line) !important;
  border-radius: 3px !important;
  background: var(--cp-slot-bg) !important;
  color: var(--cp-slot-fg);
  display: flex !important; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px; cursor: pointer; z-index: 10;
  transform: rotate(-8deg);
  transition: width .4s var(--cp-ease), height .4s var(--cp-ease), border-radius .4s var(--cp-ease),
              background .2s, border-color .2s, transform .4s var(--cp-ease), box-shadow .4s var(--cp-ease);
  overflow: hidden;
}
.sp-add .sp-add-full,
.cp-fstack-add .cp-fstack-full {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
}
.sp-add .sp-plus,
.cp-fstack-add .cp-plus-icon { font-size: 24px !important; font-weight: 300; line-height: 1; color: var(--cp-slot-fg) !important; }
.sp-add em, .cp-fstack-add em { font-style: normal; font-size: 11px; line-height: 1; color: var(--cp-slot-fg) !important; }
.sp-add .sp-add-count,
.cp-fstack-add .cp-fstack-count { display: block; font-size: 9px; line-height: 1; color: var(--cp-slot-fg); opacity: .85; }
.sp-add .sp-add-circle,
.cp-fstack-add .cp-fstack-circle { display: none; }
.sp-add:hover,
.cp-fstack-add:hover { border-color: rgba(140, 149, 159, .95) !important; }
/* 空态：完整斜虚线卡，hover 微放大（保持 -8°） */
.sp-stack:not(.has-cards) .sp-add:hover,
.cp-fstack:not(.has-cards) .cp-fstack-add:hover { transform: rotate(-8deg) scale(1.08); }

/* 有卡：+ 收成右下角深色圆（参考站 collapsed，钉在牌堆右下角，与张数无关） */
.sp-stack.has-cards .sp-add,
.cp-fstack.has-cards .cp-fstack-add {
  width: 32px !important; height: 32px !important;
  left: calc(var(--cp-cw) - 16px) !important;
  top: calc(var(--cp-ch) - 16px) !important;
  border: none !important; border-radius: 50% !important;
  background: var(--cp-slot-bg2) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
  transform: rotate(0deg);
  z-index: 60;
}
.sp-stack.has-cards .sp-add .sp-add-full,
.cp-fstack.has-cards .cp-fstack-add .cp-fstack-full { display: none; }
.sp-stack.has-cards .sp-add .sp-add-circle,
.cp-fstack.has-cards .cp-fstack-add .cp-fstack-circle {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 100%; color: #fff; font-size: 19px; font-weight: 300; line-height: 1;
}
/* hover 牌堆：+ 变回完整虚线卡，排到队尾 translateX(N*56)、+8° */
.sp-stack.has-cards:hover .sp-add,
.cp-fstack.has-cards:hover .cp-fstack-add {
  width: var(--cp-cw) !important; height: var(--cp-ch) !important;
  left: 0 !important; top: 0 !important;
  border: 1px dashed var(--cp-slot-line) !important; border-radius: 3px !important;
  background: var(--cp-slot-bg) !important; box-shadow: none;
  transform: translateX(calc(var(--n, 0) * var(--cp-fan))) rotate(8deg);
  z-index: 5;
}
.sp-stack.has-cards:hover .sp-add .sp-add-full,
.cp-fstack.has-cards:hover .cp-fstack-add .cp-fstack-full { display: flex; }
.sp-stack.has-cards:hover .sp-add .sp-add-circle,
.cp-fstack.has-cards:hover .cp-fstack-add .cp-fstack-circle { display: none; }

/* =====================================================================
   独立单槽（首帧 / 尾帧 / 商品图片，不在牌堆内）：同样斜放
   ===================================================================== */
.cp-v2 .cp-frames > .cp-frame-add:not(.cp-fstack-add):not(.filled) {
  width: var(--cp-cw) !important; height: var(--cp-ch) !important;
  border-radius: 3px !important;
  background: var(--cp-slot-bg) !important;
  border: 1px dashed var(--cp-slot-line) !important;
  color: var(--cp-slot-fg);
  transform: rotate(-8deg);
  transition: transform .3s var(--cp-ease), border-color .2s;
}
.cp-v2 .cp-frames > .cp-frame-add:not(.cp-fstack-add):not(.filled):hover {
  transform: rotate(-8deg) scale(1.08); border-color: rgba(140, 149, 159, .95) !important;
}
.cp-v2 .cp-frames > .cp-frame-add.filled:not(.cp-fstack-card) {
  width: var(--cp-cw) !important; height: var(--cp-ch) !important;
  border: 2px solid #fff !important; border-radius: 3px !important;
  background: var(--cp-slot-bg) !important; padding: 0 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
  transform: rotate(-8deg); overflow: hidden;
}
.cp-v2 .cp-frames > .cp-frame-add.filled:not(.cp-fstack-card):hover {
  transform: rotate(-8deg) scale(1.06);
}
.cp-v2 .cp-frames > .cp-frame-add.filled:not(.cp-fstack-card) img,
.cp-v2 .cp-frames > .cp-frame-add.filled:not(.cp-fstack-card) video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 1px;
}

/* 旧版纯青/蓝描边填充卡统一为白边（避免出现青色边框的"另一种样式"） */
.cp-v2 .cp-frame-add.filled { border-color: #fff !important; }

/* 旧上传 pill / 渐变数字角标隐藏（参考站无此元素） */
.cp-v2 .cp-frame-badge { display: none !important; }


/* ---------- 显隐门控（deck-active 由 chat.js 按模态/槽位设置；无输入框智能体作曲器整体隐藏） ---------- */
.cp-v2 #attachmentList.sp-stack { display: none !important; }
.cp-v2 #attachmentList.sp-stack.has-cards,
.cp-v2 #attachmentList.sp-stack.deck-active { display: block !important; }

/* ---------- 悬停命中垫（参考站 .hover-overlay：扇形展开后维持 :hover，避免 +钮位移导致脱标） ---------- */
.sp-hoverpad, .cp-hoverpad {
  position: absolute; left: -8px; top: -14px; z-index: 0;
  width: calc(var(--n, 0) * var(--cp-fan) + var(--cp-cw) + 30px);
  height: calc(var(--cp-ch) + 28px);
  pointer-events: none;
}
.cp-v2 #attachmentList.sp-stack:hover .sp-hoverpad,
.cp-v2 .cp-fstack:hover .cp-hoverpad { pointer-events: auto; }

/* ---------- 隐藏通用附件单槽（对话/智能体/三维统一由牌堆 #attachmentList 承担，避免两个入口） ---------- */
.ws-composer.cat-chat .cp-frames .cp-frame-add.cp-kind-doc,
.ws-composer.cat-agent .cp-frames .cp-frame-add.cp-kind-doc,
.ws-composer.cat-3d .cp-frames .cp-frame-add.cp-kind-doc { display: none !important; }

/* ============================================================
   ID_AUTH_BLOCK：ID 级权威规则（最后加载，统一收编 sp-v51 的 #cpRefs 规则）
   类型化牌堆（参考图/参考视频/参考音频等）容器、白边卡、折叠圆钮、hover 展开
   ============================================================ */
/* 每个牌堆是固定 66×82 的定位容器，flex 行内并排 */
.cp-v2 #cpRefs .cp-fstack {
  position: relative !important;
  width: var(--cp-cw) !important; height: var(--cp-ch) !important;
  flex: 0 0 auto !important; margin: 0 !important; overflow: visible !important;
}
/* 白边填充卡统一 66×82 绝对叠放 */
.cp-v2 #cpRefs .cp-fstack .cp-fstack-card.filled {
  position: absolute !important; left: 0 !important; top: 0 !important;
  width: var(--cp-cw) !important; height: var(--cp-ch) !important;
  margin: 0 !important; box-sizing: border-box !important;
}
/* 折叠态：+ 收成 32 圆，钉牌堆右下角（任意 role 通用） */
.cp-v2 #cpRefs .cp-fstack.has-cards .cp-fstack-add {
  position: absolute !important;
  left: calc(var(--cp-cw) - 16px) !important;
  top: calc(var(--cp-ch) - 16px) !important;
  width: 32px !important; height: 32px !important;
  min-width: 0 !important; min-height: 0 !important; padding: 0 !important;
  border-radius: 50% !important; border: none !important;
  background: #31343c !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.35);
  transform: rotate(0deg) !important;
  z-index: 120 !important;
  transition: left .4s cubic-bezier(.4,0,.2,1), top .4s cubic-bezier(.4,0,.2,1),
             width .4s cubic-bezier(.4,0,.2,1), height .4s cubic-bezier(.4,0,.2,1),
             border-radius .4s cubic-bezier(.4,0,.2,1), transform .4s cubic-bezier(.4,0,.2,1);
}
/* hover 牌堆：+ 变回完整虚线卡，排到扇形最右 */
.cp-v2 #cpRefs .cp-fstack.has-cards:hover .cp-fstack-add {
  left: calc(var(--n, 0) * var(--cp-fan)) !important;
  top: 0 !important;
  width: var(--cp-cw) !important; height: var(--cp-ch) !important;
  border-radius: 3px !important;
  border: 1px dashed rgba(98,105,113,.6) !important;
  background: #2d2f35 !important;
  transform: rotate(8deg) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.3);
}
/* 独立单槽（首帧/尾帧/商品图等 max=1）保持斜虚线卡，不被 ID 规则压成方块 */
.cp-v2 #cpRefs .cp-frames > .cp-frame-add.single-slot,
.cp-v2 #cpRefs .cp-frames > .cp-frame-add:not(.cp-fstack-add) {
  width: var(--cp-cw) !important; height: var(--cp-ch) !important;
  border-radius: 3px !important;
}

/* 空牌堆 +卡与单槽统一 66×82（折叠圆钮由更高特异性的 has-cards 规则覆盖） */
.cp-v2 #cpRefs .cp-fstack .cp-fstack-add {
  width: var(--cp-cw) !important; height: var(--cp-ch) !important;
  box-sizing: border-box !important;
}

/* @V55-UNIFY-SLOT 跨作曲器统一尺寸：通用附件/类型化槽/商品图/参考图/首尾帧，空槽与卡片同尺寸 */
.cp-v2 #attachmentList.sp-stack,
.cp-v2 .cp-fstack{
  width:66px !important; height:82px !important;
  min-width:66px !important; min-height:82px !important; box-sizing:border-box !important;
}
.cp-v2 #attachmentList.sp-stack:not(.has-cards) .sp-add,
.cp-v2 .cp-fstack:not(.has-cards) .cp-fstack-add,
.cp-v2 .cp-refs:not(.has-items) .cp-frame-add,
.cp-v2 .cp-frames .cp-frame-add{
  width:66px !important; height:82px !important;
  min-width:0 !important; min-height:0 !important;
  max-width:66px !important; max-height:82px !important;
  padding:0 !important; box-sizing:border-box !important;
}
.cp-v2 #attachmentList.sp-stack .sp-stack-card,
.cp-v2 .cp-fstack .cp-fstack-card{
  width:66px !important; height:82px !important; box-sizing:border-box !important;
}

/* @V55-UNIFY-TILT 空添加槽统一斜放（参考站空斜卡 -8deg），与通用附件/商品图槽一致 */
.cp-v2 .cp-fstack:not(.has-cards) .cp-fstack-add:not(.cp-kind-video):not(.cp-kind-audio){
  transform:rotate(-8deg) !important;
}
.cp-v2 .cp-fstack:not(.has-cards) .cp-fstack-add:not(.cp-kind-video):not(.cp-kind-audio):hover{
  transform:rotate(-8deg) scale(1.08) !important;
}