:root {
  --lq-icon-ink: #12355b;
  --lq-icon-blue: #1e5da8;
  --lq-icon-coral: #d85b43;
  --lq-icon-success: #2c7566;
  --lq-icon-surface: #f2eee5;
}

/* LinguaQuest icon system v2: transparent PNGs, one optical grid, no tinting. */
.lq-generated-icon,
.bnav-icon,
.generated-ui-icon,
.generated-course-icon,
.generated-theory-icon {
  display: block;
  max-width: 100%;
  max-height: 100%;
  margin: 0;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  object-fit: contain !important;
  object-position: 50% 50% !important;
  transform: none !important;
  image-rendering: auto;
  isolation: isolate;
}

.bnav-item:not(.active) .bnav-icon { opacity: .76 !important; }
.bnav-item.active .bnav-icon { opacity: 1 !important; filter: none !important; }

.menu-btn-icon,
.stat-card-icon,
.instruction-icon,
.role-icon,
.coins-badge {
  background-color: var(--lq-icon-surface) !important;
  background-image: none !important;
  border-color: #d9d0c1 !important;
  box-shadow: none !important;
}

.coins-badge {
  color: var(--lq-icon-ink) !important;
}

#results-coins {
  color: var(--lq-icon-ink) !important;
}

.shop-buy-btn {
  border: 1px solid var(--lq-icon-ink) !important;
  background: var(--lq-icon-ink) !important;
  background-image: none !important;
  color: #fff !important;
  box-shadow: none !important;
}

.shop-buy-btn:hover {
  background: var(--lq-icon-blue) !important;
  filter: none !important;
  transform: translateY(-1px) !important;
}

.shop-buy-btn.owned,
.shop-buy-btn.active {
  border-color: #bfc8d3 !important;
  background: #e8edf3 !important;
  color: var(--lq-icon-ink) !important;
}

@media (prefers-reduced-motion: reduce) {
  .shop-buy-btn:hover { transform: none !important; }
}

/* Compact controls keep a fixed footprint: no stretching or tiny glyphs. */
.qb-btn,
.qb-icon-btn {
  box-sizing: border-box !important;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease !important;
}

.qb-btn:hover,
.qb-btn:active,
.qb-icon-btn:hover,
.qb-icon-btn:active {
  transform: none !important;
  filter: none !important;
}

.qb-btn-sm {
  display: inline-flex !important;
  min-height: 38px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 7px 11px !important;
  flex: 0 0 auto !important;
  white-space: nowrap;
}

.qb-btn-sm > img,
.qb-btn-sm .qb-icon > img {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  flex: 0 0 18px !important;
}

.qb-btn-sm .qb-icon {
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  flex: 0 0 18px;
}

.qb-icon-btn {
  display: grid !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.qb-icon-btn > img {
  display: block !important;
  width: 21px !important;
  height: 21px !important;
  margin: 0 !important;
}

.qb-icon-danger,
.qb-btn-danger {
  border: 1px solid #d6a096 !important;
  background: #f8e8e3 !important;
  background-image: none !important;
  color: #7e3025 !important;
  box-shadow: none !important;
}

.qb-icon-danger:hover,
.qb-btn-danger:hover {
  border-color: #aa4b3b !important;
  background: #f3d7d0 !important;
}

.qb-quiz-card-actions,
.qb-question-row-actions {
  align-items: center !important;
  flex-wrap: wrap !important;
}