/* Renderer DOM styles (Map/map.ts owns these elements). The map stays dark in both themes, so every colour here is a
   fixed on-map colour from the Deep Ledger design, never a theme token. */

/* The map host is its own stacking context: the nameplate layer (z-index 1 inside it) stays above the map canvas and
   below every chrome panel, readout, banner, tooltip and the ledger scrim, whatever their z-index. */
.map-host { isolation: isolate; }

/* renderer: nameplates */
.map-nameplates { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.map-nameplates .dh-nameplate {
  position: absolute; left: 0; top: 0; box-sizing: border-box; display: flex; flex-direction: column; align-items: center;
  width: auto; min-width: 0; min-height: 0; margin: 0; padding: 0 5px 1px; overflow: hidden;
  background: #000000d0; border: 1px solid #000; border-radius: 0; box-shadow: none; filter: none;
  color: #f4f0e0; font-family: var(--font-ui, "Pixelify Sans", monospace); font-size: 14px; font-weight: 500; line-height: 1.05;
  letter-spacing: .01em; text-align: center; text-shadow: 1px 1px 0 #000; white-space: nowrap;
  cursor: pointer; pointer-events: auto; will-change: transform;
}
.map-nameplates .dh-nameplate.selected { border-color: #f4d03a; }
.map-nameplates .dh-nameplate.gate { border-color: #c9a43a; cursor: default; }
.map-nameplates .dh-nameplate:hover { background: #000000d0; color: #f4f0e0; filter: none; }
.map-nameplates .dh-nameplate:focus-visible { outline: 2px solid #f4d03a; outline-offset: 2px; }
.map-nameplates .dh-nameplate > span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.map-nameplates .dh-nameplate-sub { font-size: 13px; }
.map-nameplates .dh-nameplate-sub[hidden] { display: none; }
/* A dwelling's mood orb, in the plate's top right corner: unhappy or miserable residents. A status orb, so round. */
.map-nameplates .dh-nameplate-orb { position: absolute; top: 1px; right: 1px; width: 8px; height: 8px; border-radius: 50%; box-shadow: inset -2px -2px 0 #0006, 0 0 0 1px #000; max-width: none; }
.map-nameplates .dh-nameplate-orb[hidden] { display: none; }
/* While placing a building or painting roads and fields, clicks go through the plates to the canvas. */
.map-nameplates.inert .dh-nameplate { pointer-events: none; }

/* The isometric view's terrain canvas (Iso/terrain.ts) lies under the map's own canvas, which is transparent then. */
.map-host .map-iso { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; pointer-events: none; }

/* renderer: the realm map (Map/realm.ts). Unsettled sites' plates are dimmer; region and landmark labels are lowercase
   map lettering that never takes the pointer. */
.realm-plates .dh-nameplate.unsettled { color: #c0c0c0; }
.realm-plates .realm-label { position: absolute; left: 0; top: 0; color: #f4f0e0; opacity: .8; font-family: var(--font-ui, "Pixelify Sans", monospace);
  font-size: 15px; font-weight: 500; letter-spacing: .08em; text-shadow: 1px 1px 0 #000, -1px -1px 0 #000; white-space: nowrap; pointer-events: none; }
