/* BibleQuest v4 custom-art bridge.
   Presentation only: no route, scoring, storage, permission, or service ownership changes. */

.bq-brand-art,
.bq-nav-art,
.bq-session-art,
.bq-v4-card-art,
.bq-v4-home-art,
.bq-world-icon-art,
.bq-world-detail-art,
.bq-avatar-art {
  display:block;
  object-fit:contain;
  object-position:center;
  user-select:none;
  -webkit-user-drag:none;
}

.bq-brand-art {
  width:46px;
  height:46px;
  flex:0 0 46px;
  filter:drop-shadow(0 3px 6px rgb(33 63 43 / 18%));
}

.bq-nav-art {
  width:30px;
  height:30px;
  margin:0 auto 2px;
  transition:transform 160ms ease, filter 160ms ease;
}

.bq-nav [data-route-link][aria-current] .bq-nav-art {
  transform:translateY(-2px) scale(1.08);
  filter:drop-shadow(0 3px 5px rgb(38 91 58 / 22%));
}

.bq-session-art {
  width:27px;
  height:27px;
  flex:0 0 27px;
}

.bq-v4-card-art {
  width:72px;
  height:72px;
  margin:0 0 8px;
  filter:drop-shadow(0 5px 8px rgb(38 91 58 / 10%));
}

.bq-learning-card .bq-v4-card-art {
  width:68px;
  height:68px;
}

.bq-v4-home-art {
  width:88px;
  height:88px;
  float:right;
  margin:-8px -2px 8px 16px;
  filter:drop-shadow(0 7px 10px rgb(38 91 58 / 12%));
}

.bq-home-daily::after,
[data-home-recordings]::after,
[data-home-media]::after,
[data-home-progress]::after {
  content:"";
  display:block;
  clear:both;
}

.bq-world-icon-art {
  width:58px;
  height:58px;
  flex:0 0 58px;
}

.bq-world-detail-title {
  display:flex;
  align-items:center;
  gap:12px;
}

.bq-world-detail-art {
  width:72px;
  height:72px;
  flex:0 0 72px;
}

.bq-world-art-fallback-icon .bq-world-icon-art {
  width:72px;
  height:72px;
}

.bq-avatar-art-wrap .bq-avatar-art {
  width:100%;
  height:100%;
}

.bq-avatar-art-wrap {
  overflow:visible;
}

.bq-avatar-art-wrap.is-hero {
  min-width:116px;
  min-height:116px;
}

/* Games launcher: stable data attributes select artwork without touching the
   stateful game renderer or game-service ownership. */
.bq-game-card::before {
  content:"";
  display:block;
  width:82px;
  height:82px;
  margin:0 0 8px;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  filter:drop-shadow(0 5px 8px rgb(38 91 58 / 12%));
}

.bq-game-card:has([data-game-launch="quick-recall"])::before { background-image:url("../../assets/v4/games/game-quick-recall.png"); }
.bq-game-card:has([data-game-launch="context-challenge"])::before { background-image:url("../../assets/v4/games/game-context-challenge.png"); }
.bq-game-card:has([data-game-launch="mixed-quest"])::before { background-image:url("../../assets/v4/games/game-mixed-quest.png"); }
.bq-game-card:has([data-game-launch="per-book-recall"])::before { background-image:url("../../assets/v4/games/game-per-book-recall.png"); }
.bq-game-card:has([data-game-launch="character-detective"])::before { background-image:url("../../assets/v4/games/game-character-detective.png"); }
.bq-game-card:has([data-game-launch="timeline-challenge"])::before { background-image:url("../../assets/v4/games/game-timeline.png"); }
.bq-game-card[data-memory-launch-card]::before { background-image:url("../../assets/v4/games/game-memory-meadow.png"); }
.bq-game-card[data-same-room-card]::before { background-image:url("../../assets/v4/games/game-play-together.png"); }

.bq-detective-mark,
.bq-recall-icon,
.bq-memory-mark {
  font-size:0 !important;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
}

.bq-detective-mark {
  width:88px;
  height:88px;
  margin:0 auto 8px;
  background-image:url("../../assets/v4/games/game-character-detective.png");
}

.bq-recall-icon {
  background-color:transparent;
  background-image:url("../../assets/v4/games/game-recall-deck.png");
}

.bq-timeline-card::before {
  content:"";
  display:block;
  width:82px;
  height:82px;
  margin:0 auto 8px;
  background:url("../../assets/v4/games/game-timeline.png") center/contain no-repeat;
}

/* Memory Meadow keeps the original emoji IDs in its state and accessible
   labels, while the visual face is replaced by the custom transparent art. */
.bq-memory-mark {
  width:84px;
  height:84px;
  margin:0 auto 4px;
  background-image:url("../../assets/v4/games/game-memory-meadow.png");
}

.bq-memory-card > span {
  display:block;
  width:78%;
  height:78%;
  font-size:0 !important;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
}

.bq-memory-card[aria-label$="hidden"] > span { background-image:url("../../assets/v4/memory-meadow/memory-card-back.png"); }
.bq-memory-card[aria-label*="🦊"] > span { background-image:url("../../assets/v4/memory-meadow/memory-fox.png"); }
.bq-memory-card[aria-label*="🐼"] > span { background-image:url("../../assets/v4/memory-meadow/memory-panda.png"); }
.bq-memory-card[aria-label*="🐸"] > span { background-image:url("../../assets/v4/memory-meadow/memory-frog.png"); }
.bq-memory-card[aria-label*="🐵"] > span { background-image:url("../../assets/v4/memory-meadow/memory-monkey.png"); }
.bq-memory-card[aria-label*="🦁"] > span { background-image:url("../../assets/v4/memory-meadow/memory-lion.png"); }
.bq-memory-card[aria-label*="🐰"] > span { background-image:url("../../assets/v4/memory-meadow/memory-rabbit.png"); }
.bq-memory-card[aria-label*="🐯"] > span { background-image:url("../../assets/v4/memory-meadow/memory-tiger.png"); }
.bq-memory-card[aria-label*="🐨"] > span { background-image:url("../../assets/v4/memory-meadow/memory-koala.png"); }

.bq-game-result[data-memory-complete]::before {
  content:"";
  display:block;
  width:132px;
  height:108px;
  margin:0 auto 4px;
  background:url("../../assets/v4/memory-meadow/memory-all-friends.png") center/contain no-repeat;
}

.bq-game-result[data-memory-complete] .bq-game-medal {
  width:72px;
  height:72px;
  margin:0 auto;
  font-size:0;
  background:url("../../assets/v4/memory-meadow/memory-complete-medal.png") center/contain no-repeat;
}

.bq-game-result[data-memory-complete] .bq-game-stats > div:nth-child(1)::before,
.bq-game-result[data-memory-complete] .bq-game-stats > div:nth-child(2)::before {
  content:"";
  display:block;
  width:42px;
  height:42px;
  margin:0 auto 5px;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
}

.bq-game-result[data-memory-complete] .bq-game-stats > div:nth-child(1)::before { background-image:url("../../assets/v4/memory-meadow/reward-star.png"); }
.bq-game-result[data-memory-complete] .bq-game-stats > div:nth-child(2)::before { background-image:url("../../assets/v4/memory-meadow/reward-coin.png"); }

/* Keep the retained v3 More sprite measurable for exact regression contracts
   while the new v4 PNG is the only visible artwork. */
.bq-more-icon-wrap {
  position:relative;
}

.bq-more-icon-legacy {
  position:absolute;
  inset:0 auto auto 0;
  width:32px;
  height:32px;
  opacity:0;
  pointer-events:none;
}

@media (max-width:520px) {
  .bq-brand-art { width:40px; height:40px; flex-basis:40px; }
  .bq-nav-art { width:27px; height:27px; }
  .bq-session-art { width:24px; height:24px; flex-basis:24px; }
  .bq-v4-card-art { width:62px; height:62px; }
  .bq-v4-home-art { width:72px; height:72px; }
  .bq-world-icon-art { width:50px; height:50px; flex-basis:50px; }
  .bq-world-detail-art { width:60px; height:60px; flex-basis:60px; }
  .bq-game-card::before { width:72px; height:72px; }
  .bq-memory-mark { width:72px; height:72px; }
  .bq-timeline-card::before { width:70px; height:70px; }
  .bq-game-result[data-memory-complete]::before { width:112px; height:92px; }
}

@media (prefers-reduced-motion: reduce) {
  .bq-nav-art { transition:none; }
}
