/* Unscarred custom symbols — cropped from original artwork */

.symbol {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  flex: 0 0 1.5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  vertical-align: -0.2em;
  opacity: 0.88;
}

.symbol--inline {
  vertical-align: -0.25em;
  margin-right: 0.35em;
}

.symbol--sm {
  width: 1.125rem;
  height: 1.125rem;
  flex-basis: 1.125rem;
}

.symbol--md {
  width: 1.75rem;
  height: 1.75rem;
  flex-basis: 1.75rem;
}

.symbol--lg {
  width: 2.25rem;
  height: 2.25rem;
  flex-basis: 2.25rem;
}

.symbol--xl {
  width: 3rem;
  height: 3rem;
  flex-basis: 3rem;
}

.symbol--slot-quiz {
  width: 100%;
  height: 100%;
  flex: 1 1 auto;
  opacity: 0.85;
}

.symbol--brain { background-image: url("/assets/icons/symbols/symbol-brain-64.png"); }
.symbol--vortex { background-image: url("/assets/icons/symbols/symbol-vortex-64.png"); }
.symbol--door { background-image: url("/assets/icons/symbols/symbol-door-64.png"); }
.symbol--ring { background-image: url("/assets/icons/symbols/symbol-ring-64.png"); }
.symbol--shards { background-image: url("/assets/icons/symbols/symbol-shards-64.png"); }
.symbol--lantern { background-image: url("/assets/icons/symbols/symbol-lantern-64.png"); }
.symbol--compass { background-image: url("/assets/icons/symbols/symbol-compass-64.png"); }
.symbol--eye { background-image: url("/assets/icons/symbols/symbol-eye-64.png"); }
.symbol--grate { background-image: url("/assets/icons/symbols/symbol-grate-64.png"); }
.symbol--flame { background-image: url("/assets/icons/symbols/symbol-flame-64.png"); }
.symbol--maze { background-image: url("/assets/icons/symbols/symbol-maze-64.png"); }
.symbol--chess { background-image: url("/assets/icons/symbols/symbol-chess-64.png"); }
.symbol--beacon { background-image: url("/assets/icons/symbols/symbol-beacon-64.png"); }
.symbol--crown { background-image: url("/assets/icons/symbols/symbol-crown-64.png"); }
.symbol--pulse { background-image: url("/assets/icons/symbols/symbol-pulse-64.png"); }
.symbol--radar { background-image: url("/assets/icons/symbols/symbol-radar-64.png"); }
.symbol--seal { background-image: url("/assets/icons/symbols/symbol-seal-64.png"); }
.symbol--lattice { background-image: url("/assets/icons/symbols/symbol-lattice-64.png"); }
.symbol--cocoon { background-image: url("/assets/icons/symbols/symbol-cocoon-64.png"); }
.symbol--ripple { background-image: url("/assets/icons/symbols/symbol-ripple-64.png"); }
.symbol--cage { background-image: url("/assets/icons/symbols/symbol-cage-64.png"); }
.symbol--heartbeat { background-image: url("/assets/icons/symbols/symbol-heartbeat-64.png"); }
.symbol--target { background-image: url("/assets/icons/symbols/symbol-target-64.png"); }
.symbol--orb { background-image: url("/assets/icons/symbols/symbol-orb-64.png"); }

.heading-with-symbol {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.card-with-symbol .symbol {
  margin-bottom: 0.75rem;
  opacity: 0.82;
}

.fw-item .symbol {
  display: block;
  margin-bottom: 0.75rem;
  opacity: 0.85;
}

/* Icon slot containers — center symbols, no emoji font sizing */
[class*="__icon"],
.mix-svc-ic,
.use-icon,
.icon-circle,
.hero-badge,
.warmap-card__icon {
  line-height: 1;
}

[class*="__icon"]:not(.symbol),
.mix-svc-ic:not(.symbol),
.use-icon:not(.symbol) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.quiz-card__icon,
.featured-quiz__icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.quiz-card__icon img,
.featured-quiz__icon img,
.warmap-card__icon-img {
  display: none !important;
}

.dimension-pill .symbol,
.result-type .symbol,
.result-war .symbol {
  margin-right: 0.35rem;
}

.result-icon .symbol,
.result-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  margin: 0 auto 1rem;
}

.icon-circle .symbol,
.icon-circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
}

.problem-item__icon .symbol,
.energy-card__icon .symbol,
.service-icon .symbol,
.feature-icon .symbol,
.instruction-icon .symbol {
  opacity: 0.88;
}

.symbol-list {
  list-style: none;
  padding-left: 0;
}

.symbol-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  margin-bottom: 0.75rem;
}

.symbol-list .symbol {
  margin-top: 0.15rem;
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .symbol--brain { background-image: url("/assets/icons/symbols/symbol-brain-128.png"); }
  .symbol--vortex { background-image: url("/assets/icons/symbols/symbol-vortex-128.png"); }
  .symbol--door { background-image: url("/assets/icons/symbols/symbol-door-128.png"); }
  .symbol--ring { background-image: url("/assets/icons/symbols/symbol-ring-128.png"); }
  .symbol--shards { background-image: url("/assets/icons/symbols/symbol-shards-128.png"); }
  .symbol--lantern { background-image: url("/assets/icons/symbols/symbol-lantern-128.png"); }
  .symbol--compass { background-image: url("/assets/icons/symbols/symbol-compass-128.png"); }
  .symbol--eye { background-image: url("/assets/icons/symbols/symbol-eye-128.png"); }
  .symbol--grate { background-image: url("/assets/icons/symbols/symbol-grate-128.png"); }
  .symbol--flame { background-image: url("/assets/icons/symbols/symbol-flame-128.png"); }
  .symbol--maze { background-image: url("/assets/icons/symbols/symbol-maze-128.png"); }
  .symbol--chess { background-image: url("/assets/icons/symbols/symbol-chess-128.png"); }
  .symbol--beacon { background-image: url("/assets/icons/symbols/symbol-beacon-128.png"); }
  .symbol--crown { background-image: url("/assets/icons/symbols/symbol-crown-128.png"); }
  .symbol--pulse { background-image: url("/assets/icons/symbols/symbol-pulse-128.png"); }
  .symbol--radar { background-image: url("/assets/icons/symbols/symbol-radar-128.png"); }
  .symbol--seal { background-image: url("/assets/icons/symbols/symbol-seal-128.png"); }
  .symbol--lattice { background-image: url("/assets/icons/symbols/symbol-lattice-128.png"); }
  .symbol--cocoon { background-image: url("/assets/icons/symbols/symbol-cocoon-128.png"); }
  .symbol--ripple { background-image: url("/assets/icons/symbols/symbol-ripple-128.png"); }
  .symbol--cage { background-image: url("/assets/icons/symbols/symbol-cage-128.png"); }
  .symbol--heartbeat { background-image: url("/assets/icons/symbols/symbol-heartbeat-128.png"); }
  .symbol--target { background-image: url("/assets/icons/symbols/symbol-target-128.png"); }
  .symbol--orb { background-image: url("/assets/icons/symbols/symbol-orb-128.png"); }
}

@media (min-width: 1280px) {
  .symbol--slot-quiz { background-size: 88%; }
}
