/* McEwen 3D map labels (mux3d.js places them; this file styles them). McEwen's own map-slide style (deck slide 5,
   research/deck/1hlr6j8q-5.webp): pale yellow box, 1 px gold border, navy text; McEwen Copper assets (Los Azules,
   Elder Creek) in a copper box with white text. Montserrat 600 for the name, 400 for the place line.
   Include once on any page that mounts the scene:  <link rel="stylesheet" href="/js/labels.css">  (or the path the
   page serves wow/src from). The page must load Montserrat 400 and 600 itself (self-hosted; no outside fonts).
   The engine adds the theme to the layer: .mux3d-labels.mux3d-brand | .mux3d-navy | .mux3d-night. */

.mux3d-labels { position: absolute; inset: 0; pointer-events: none; overflow: hidden;
  --mux-label-fill: #FFF4D1; --mux-label-line: #C9A64A; --mux-label-ink: #0F4153; --mux-label-sub: #3E6C85;
  --mux-copper-fill: #C0471B; --mux-copper-line: #9A3712; --mux-copper-ink: #FFFFFF;
  --mux-place-ink: #0F4153; --mux-place-halo: rgba(244, 246, 241, .92); }
.mux3d-labels.mux3d-navy, .mux3d-labels.mux3d-night { --mux-place-ink: #E9F5EB; --mux-place-halo: rgba(11, 50, 66, .9); }

.mux3d-label { position: absolute; left: 0; top: 0; opacity: 0; transition: opacity .35s ease; white-space: nowrap; transform-origin: 0 0;
  translate: -50% -100%; font-family: Montserrat, "Helvetica Neue", Arial, sans-serif; text-shadow: none; }
.mux3d-label.on { opacity: 1; }

/* assets: a box with a short gold leader down to the top of the column (the engine lengthens and leans it with --mux-lead
   and --mux-lead-rot when it moves a box clear of another) */
.mux3d-label.asset { display: flex; flex-direction: column; align-items: center; padding: 6px 12px 7px; margin-top: -12px;
  background: var(--mux-label-fill); border: 1px solid var(--mux-label-line); color: var(--mux-label-ink);
  box-shadow: 0 1px 2px rgba(10, 44, 56, .18), 0 6px 16px -6px rgba(10, 44, 56, .35); }
.mux3d-label.asset::after { content: ""; position: absolute; left: 50%; top: 100%; width: 1px; height: calc(11px + var(--mux-lead, 0px));
  background: var(--mux-label-line); transform-origin: 50% 0; transform: rotate(var(--mux-lead-rot, 0deg)); }
.mux3d-label.asset b { font-weight: 600; font-size: 13px; line-height: 1.2; letter-spacing: .005em; color: inherit; }
.mux3d-label.asset small { font-weight: 400; font-size: 11px; line-height: 1.3; color: var(--mux-label-sub); }

/* McEwen Copper: Los Azules, Elder Creek */
.mux3d-label.asset.copper { background: var(--mux-copper-fill); border-color: var(--mux-copper-line); color: var(--mux-copper-ink); }
.mux3d-label.asset.copper small { color: rgba(255, 255, 255, .88); }
.mux3d-label.asset.copper::after { background: var(--mux-copper-fill); }

/* places on the ground: towns plain, countries spaced capitals, neighbours lighter */
.mux3d-label.place { translate: -50% -50%; }
.mux3d-label.place b { font-weight: 600; font-size: 12px; color: var(--mux-place-ink);
  text-shadow: 0 0 3px var(--mux-place-halo), 0 0 6px var(--mux-place-halo), 0 0 1px var(--mux-place-halo); }
.mux3d-label.place.country b { font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: .32em; }
.mux3d-label.place.neighbour b { font-weight: 400; font-style: italic; }
.mux3d-labels.mux3d-brand .mux3d-label.place b { color: #FFFFFF; text-shadow: 0 0 3px rgba(10, 44, 56, .9), 0 0 7px rgba(10, 44, 56, .7); }

@media (max-width: 700px) {
  .mux3d-label.asset { padding: 4px 8px 5px; }
  .mux3d-label.asset b { font-size: 12px; }
  .mux3d-label.asset small { font-size: 10px; }
}