/* AR 场景 */
#ar-scene { background:#000; position:relative; }
#ar-video { display:none; }
#ar-canvas { width:100%; height:100%; object-fit:cover; }

/* AR 顶部信息 */
.ar-top {
  position:absolute; top:0; left:0; right:0; z-index:10;
  padding:12px 16px;
  background:linear-gradient(180deg, rgba(0,0,0,0.7) 0%, transparent 100%);
}
#monster-info {
  display:flex; flex-wrap:wrap; align-items:center; gap:8px;
}
.monster-info-name { font-weight:bold; font-size:16px; }
.monster-info-desc { width:100%; font-size:12px; color:var(--text2); }
.rarity-badge {
  font-size:11px; padding:2px 8px; border-radius:10px;
  font-weight:bold;
}

/* AR 底部操作区 */
.ar-bottom {
  position:absolute; bottom:0; left:0; right:0; z-index:10;
  padding:16px; text-align:center;
  background:linear-gradient(0deg, rgba(0,0,0,0.8) 0%, transparent 100%);
}

/* 投掷按钮 */
#throw-btn {
  width:80px; height:80px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, #ff6b6b, #c0392b);
  border:3px solid rgba(255,255,255,0.3);
  color:#fff; font-size:28px;
  cursor:pointer; display:inline-flex;
  align-items:center; justify-content:center;
  box-shadow: 0 4px 20px rgba(192,57,43,0.4);
  transition: transform 0.1s;
}
#throw-btn:active { transform:scale(0.9); }
#throw-btn.throwing { opacity:0.5; pointer-events:none; }

/* 力度条 */
.power-bar {
  width:200px; height:8px; border-radius:4px;
  background:rgba(255,255,255,0.1);
  margin:10px auto 0;
  overflow:hidden;
}
#power-fill {
  height:100%; width:0%;
  background:linear-gradient(90deg, #4f4, #ff4, #f44);
  border-radius:4px;
  transition: width 0.05s;
}

/* 灵珠 */
#catch-ball {
  position:absolute; top:50%; left:50%;
  width:50px; height:50px;
  transform:translate(-50%, 50%);
  border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #fff, #c0392b);
  border:2px solid rgba(255,255,255,0.5);
  z-index:20;
  opacity:0; display:none;
  box-shadow: 0 0 20px rgba(192,57,43,0.6);
}
#catch-ball::after {
  content:''; position:absolute; top:45%; left:10%; right:10%;
  height:2px; background:rgba(0,0,0,0.3);
}

/* 返回按钮 */
.ar-back {
  position:absolute; top:12px; right:16px; z-index:20;
  background:rgba(0,0,0,0.5); border:1px solid rgba(255,255,255,0.2);
  color:#fff; border-radius:20px; padding:6px 14px;
  font-size:13px; cursor:pointer;
}
.ar-back:active { opacity:0.7; }

/* 捕捉结果 */
#catch-result {
  position:absolute; inset:0; z-index:50;
  display:none; align-items:center; justify-content:center;
  background:rgba(0,0,0,0.8);
  backdrop-filter:blur(8px);
}
#catch-result.show { display:flex; }
.catch-success, .catch-fail { text-align:center; }
.catch-emoji { font-size:64px; margin-bottom:16px; }
.catch-success h2 { color:#4f4; }
.catch-fail h2 { color:#f44; }
.catch-success p, .catch-fail p { color:var(--text2); margin:8px 0 20px; }
.catch-success button, .catch-fail button {
  background:var(--accent); border:none; color:#fff;
  padding:10px 30px; border-radius:20px; font-size:15px;
  cursor:pointer;
}
