/* 數字人卡牌（外框圖做底層，CSS 疊字／星星）＋翻牌背面。工坊同選擇頁共用。 */
    /* 卡牌翻轉容器 */
    .bc-flip { perspective:1200px; }
    .bc-flip-inner {
      position:relative; width:100%; transition:transform .55s cubic-bezier(.3,.1,.2,1);
      transform-style:preserve-3d;
    }
    .bc-flip:hover .bc-flip-inner { transform:rotateY(180deg); }
    .bc-face { backface-visibility:hidden; -webkit-backface-visibility:hidden; }
    .bc-back {
      position:absolute; inset:0; transform:rotateY(180deg);
      background:#fff; border:2px solid #123E35; border-radius:6px;
      box-shadow:0 6px 22px rgba(18,62,53,.09);
      display:flex; flex-direction:column; padding:var(--space-2);
    }
    .bc-back .bc-back-head { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
    .bc-back .bc-back-head b { font:800 15px/1.2 'Rubik','ResourceHanRoundedCN',sans-serif; color:var(--text-heading); }
    .bc-back .bc-back-sub { font:400 11px/1.4 'Rubik','ResourceHanRoundedCN',sans-serif; color:var(--text-muted); margin:0 0 8px; }
    .bc-back .bc-tasklist { display:flex; flex-direction:column; gap:6px; flex:1; overflow-y:auto; }
    .bc-back .bc-task-row {
      display:flex; align-items:flex-start; gap:6px; padding:7px 8px;
      border:1.5px solid var(--border-subtle); border-radius:4px; background:#FAFBFC;
      font:400 11.5px/1.4 'Rubik','ResourceHanRoundedCN',sans-serif; color:var(--text-secondary);
    }
    .bc-back .bc-task-row.done { border-color:#B7E4D4; background:#F0FAF6; }
    .bc-back .bc-task-row .tk-icon { flex:none; width:14px; height:14px; margin-top:1px; }
    .bc-back .bc-back-foot {
      margin-top:8px; padding-top:8px; border-top:1px dashed var(--border-subtle);
      font:700 10px/1 'Rubik',sans-serif; letter-spacing:1px; color:var(--text-muted); text-align:center;
    }

    /* 數字人卡牌（用外框圖做底層，CSS 疊字／星星） */
    .bot-card { position:relative; width:100%; }
    .bot-card .bc-frame { width:100%; display:block; }
    .bot-card .bc-name {
      position:absolute; left:16%; right:8%; top:5.5%; height:10.5%;
      display:flex; align-items:center; overflow:hidden;
      font:900 19px/1 'Rubik','ResourceHanRoundedCN',sans-serif; color:#1a1a1a;
      white-space:nowrap; text-overflow:ellipsis; letter-spacing:0.5px;
    }
    .bot-card .bc-tag {
      position:absolute; left:10.5%; width:25%; top:15.9%; height:4.7%; z-index:3;
      display:flex; align-items:center; justify-content:center;
      font:700 9px/1 'Rubik','ResourceHanRoundedCN',sans-serif; color:#fff; overflow:hidden;
    }
    .bot-card .bc-status {
      position:absolute; left:39.5%; width:23%; top:16.2%; height:4.4%; z-index:3;
      display:flex; align-items:center; justify-content:center;
      font:700 9px/1 'Rubik','ResourceHanRoundedCN',sans-serif; color:var(--text-secondary); overflow:hidden;
    }
    .bot-card .bc-portrait {
      position:absolute; left:11.6%; width:76.8%; top:23.6%; height:40%;
      display:flex; align-items:flex-end; justify-content:center; overflow:hidden; z-index:2; border-radius:3px;
    }
    .bot-card .bc-portrait img { width:100%; height:100%; object-fit:contain; object-position:bottom; image-rendering:pixelated; filter:drop-shadow(0 3px 3px rgba(0,0,0,0.2)); transform-origin:50% 100%; }
    .bot-card .bc-portrait .bc-monogram {
      font:800 64px/1 'Rubik','ResourceHanRoundedCN',sans-serif; opacity:0.85;
    }
    .bot-card .bc-caption {
      position:absolute; left:8.5%; width:83%; top:68%; height:6.2%; z-index:1;
      display:flex; align-items:center; justify-content:center; text-align:center;
      font:600 10.5px/1.2 'Rubik','ResourceHanRoundedCN',sans-serif; color:var(--text-secondary);
    }
    .bot-card .bc-stars {
      position:absolute; left:17.5%; width:65%; top:76.8%; height:11.6%; z-index:1;
      display:flex; align-items:center; justify-content:space-between;
    }
    .bot-card .bc-stars { justify-content:space-evenly; }
    .bot-card .bc-stars img { width:var(--sw, 27%); height:auto; image-rendering:pixelated; }
    .bot-card .bc-brand {
      position:absolute; left:20%; width:60%; top:91.5%; height:5.5%;
      display:flex; align-items:center; justify-content:center;
      font:800 11px/1 'Rubik',sans-serif; letter-spacing:2px; color:#fff; text-shadow:0 1px 1px rgba(0,0,0,0.25);
    }

/* 稀有度：達標＝發光；滿星＝金卡加閃光掃過 */
.bot-card.tier-core { filter:drop-shadow(0 0 10px rgba(255,210,90,.75)); }
.bot-card.tier-gold { filter:drop-shadow(0 0 14px rgba(255,190,40,.9)); }
.bot-card.tier-gold::after {
  content:''; position:absolute; inset:1.5%; z-index:6; pointer-events:none; border-radius:10px;
  background:linear-gradient(115deg, transparent 38%, rgba(255,255,255,.75) 50%, transparent 62%);
  background-size:260% 100%; background-position:120% 0; animation:bcShine 3.2s ease-in-out infinite;
  mix-blend-mode:soft-light;
}
@keyframes bcShine { 0% { background-position:120% 0; } 55%,100% { background-position:-120% 0; } }

/* 觸控裝置：冇 hover，改用翻牌掣 */
.bc-flip { position:relative; }
.bc-flipbtn { display:none; position:absolute; right:7%; bottom:2.2%; z-index:9; width:38px; height:38px; border-radius:50%; border:2px solid #123E35; background:#fff; color:#123E35; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 2px 0 rgba(18,62,53,.25); padding:0; }
.bc-flipbtn svg { width:20px; height:20px; }
.bc-flip.flipped .bc-flip-inner { transform:rotateY(180deg) !important; }
@media (hover:none) {
  .bc-flipbtn { display:flex; }
  .bc-flip:hover .bc-flip-inner { transform:none; }
  .bc-flip.flipped:hover .bc-flip-inner { transform:rotateY(180deg) !important; }
}

/* 閃卡全息反光：跟住滑鼠／裝置傾斜（--hx、--hy 由 bots-store.js 更新）。可放 assets/fx/holo.png 自動疊加紋理 */
.bot-card.tier-gold::before, .bot-card.tier-holo::before {
  content:''; position:absolute; inset:1.5%; z-index:5; pointer-events:none; border-radius:10px;
  background:
    var(--holo-img, none),
    linear-gradient(115deg, rgba(255,0,128,0) 18%, rgba(255,120,80,.42) 30%, rgba(255,235,80,.46) 40%, rgba(80,255,180,.46) 50%, rgba(80,160,255,.46) 60%, rgba(190,90,255,.42) 70%, rgba(255,0,128,0) 82%);
  background-size:cover, 260% 260%;
  background-position:center, calc(var(--hx, 50) * 1%) calc(var(--hy, 50) * 1%);
  mix-blend-mode:color-dodge; opacity:.3; transition:opacity .2s;
}
.bot-card.tier-holo::before { opacity:.75; }
.bot-card.tier-gold:hover::before { opacity:.85; }

/* 動作輪播：原圖→揮手→開心→思考→驚喜，每格約 2.4 秒；第一張唔設 lazy 效果，其餘疊喺上面
   （.bc-portrait 本身已經係 position:absolute，本身就係合法嘅定位錨點，唔可以喺度改佢個 position，
   否則會令張卡入面嗰個人像窗跌返做正常文件流，成張卡走晒位） */
.bot-card .bc-portrait img.bc-pose { position:absolute; inset:0; opacity:0; animation-duration:calc(var(--n) * 2.4s); animation-delay:calc(var(--i) * 2.4s - var(--n) * 2.4s); animation-iteration-count:infinite; animation-timing-function:ease-out; }
.bot-card .bc-portrait img.bc-pose:first-child { opacity:1; }
@keyframes bcPose2 { 0% { opacity:1; translate:0 4%; } 6% { translate:0 0; } 46% { opacity:1; } 50%, 100% { opacity:0; } }
@keyframes bcPose3 { 0% { opacity:1; translate:0 4%; } 5% { translate:0 0; } 30% { opacity:1; } 34%, 100% { opacity:0; } }
@keyframes bcPose4 { 0% { opacity:1; translate:0 4%; } 4% { translate:0 0; } 22% { opacity:1; } 26%, 100% { opacity:0; } }
@keyframes bcPose5 { 0% { opacity:1; translate:0 4%; } 3% { translate:0 0; } 17% { opacity:1; } 20%, 100% { opacity:0; } }
@media (prefers-reduced-motion: reduce) {
  .bot-card .bc-portrait img.bc-pose { animation:none !important; opacity:0; }
  .bot-card .bc-portrait img.bc-pose:first-child { opacity:1; }
}
