/* ============================================================
 * 文件：css/hall-gallery.css
 * 作用：贵族展厅、艺术画廊、画廊翻转卡
 * ============================================================ */
  /* === 贵族展厅 === */
  #nobleHall, #artGallery {
    position: relative;
    z-index: 1;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }
  #nobleHall h1, #artGallery h1 {
    color: #ffd700;
    font-size: 32px;
    margin-bottom: 8px;
    text-shadow: 0 0 20px rgba(255,215,0,0.5);
    letter-spacing: 3px;
  }
  #nobleHall .subtitle, #artGallery .subtitle {
    color: #c9b896;
    font-size: 12px;
    margin-bottom: 30px;
    text-shadow: 0 1px 3px rgba(0,0,0,0.8);
    letter-spacing: 2px;
  }

  /* === 艺术画廊展品 === */
  .gallery-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    width: 78%;
    max-width: 300px;
    margin: 10px 0 25px 0;
  }
  .gallery-frame {
    aspect-ratio: 1;
    background: linear-gradient(145deg, #3a2818, #2a1f18);
    border: 3px solid #8b6914;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: 0 6px 16px rgba(0,0,0,0.6), inset 0 2px 10px rgba(0,0,0,0.5);
    padding: 10px;
    transition: transform 0.2s, box-shadow 0.2s;
  }
  .gallery-frame::before {
    content: '';
    position: absolute;
    top: 6px; left: 6px; right: 6px; bottom: 6px;
    border: 1px solid rgba(139,105,20,0.25);
    border-radius: 6px;
    pointer-events: none;
  }
  .gallery-frame::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.03) 0%, transparent 50%, rgba(0,0,0,0.1) 100%);
    border-radius: 10px;
    pointer-events: none;
  }
  .gallery-ghost {
    font-size: 40px;
    color: rgba(139,105,20,0.18);
    text-shadow: 0 0 12px rgba(139,105,20,0.08);
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    user-select: none;
  }
  .gallery-label {
    font-size: 11px;
    color: #5a3a1a;
    text-align: center;
    margin-top: 6px;
    font-family: 'STKaiti', 'KaiTi', '楷体', 'FangSong', '仿宋', 'STFangsong', serif;
    letter-spacing: 2px;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
    user-select: none;
  }
  .gallery-frame:hover {
    transform: translateY(-4px) scale(1.03);
    box-shadow: 0 10px 25px rgba(255,215,0,0.1), inset 0 2px 10px rgba(0,0,0,0.5);
    border-color: #a08020;
  }
  .gallery-frame.glowing {
    border-color: #ffd700;
    box-shadow: 0 0 20px rgba(255,215,0,0.5), 0 0 40px rgba(255,215,0,0.2), inset 0 2px 10px rgba(0,0,0,0.3);
    animation: galleryGlow 2s ease-in-out infinite;
  }
  @keyframes galleryGlow {
    0%, 100% { box-shadow: 0 0 20px rgba(255,215,0,0.4), 0 0 40px rgba(255,215,0,0.15), inset 0 2px 10px rgba(0,0,0,0.3); }
    50% { box-shadow: 0 0 30px rgba(255,215,0,0.7), 0 0 60px rgba(255,215,0,0.3), inset 0 2px 10px rgba(0,0,0,0.3); }
  }

  /* === 画廊翻转卡片 === */
  .gallery-frame {
    perspective: 800px;
  }
  .flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    transform-style: preserve-3d;
  }
  .flip-card-inner.flipped {
    transform: rotateY(180deg);
  }
  .flip-card-front, .flip-card-back {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    overflow: hidden;
  }
  .flip-card-front {
    z-index: 2;
  }
  .flip-card-back {
    transform: rotateY(180deg);
    background: linear-gradient(145deg, #3a2818, #2a1f18);
    border: 3px solid #8b6914;
    box-shadow: 0 6px 16px rgba(0,0,0,0.6), inset 0 2px 10px rgba(0,0,0,0.5);
  }
  .flip-card-back::before {
    content: '';
    position: absolute;
    top: 6px; left: 6px; right: 6px; bottom: 6px;
    border: 1px solid rgba(139,105,20,0.25);
    border-radius: 6px;
    pointer-events: none;
  }
  .flip-card-back::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.03) 0%, transparent 50%, rgba(0,0,0,0.1) 100%);
    border-radius: 10px;
    pointer-events: none;
  }

/* === 无敌闪电箭按钮发光效果 === */
.god-lightning-active {
  animation: lightningGlow 1s ease-in-out infinite;
  border-color: #ffff00 !important;
  color: #ffffa0 !important;
  text-shadow: 0 0 10px rgba(255, 255, 100, 0.9), 0 0 20px rgba(255, 235, 59, 0.5) !important;
}
@keyframes lightningGlow {
  0%, 100% {
    box-shadow: 0 0 8px rgba(255, 235, 59, 0.5), 0 0 18px rgba(255, 235, 59, 0.25), inset 0 0 6px rgba(255, 235, 59, 0.15);
    border-color: #ffeb3b !important;
  }
  50% {
    box-shadow: 0 0 18px rgba(255, 235, 59, 0.95), 0 0 36px rgba(255, 235, 59, 0.5), inset 0 0 12px rgba(255, 235, 59, 0.35);
    border-color: #ffff00 !important;
  }
}