/**
 * forge/iso-view.css — isometric / 2.5D presentation
 * Toggle: body.forge-iso (+ forge-iso-soft | forge-iso-full)
 */

/* Viewport becomes a stage with depth */
body.forge-iso #map-viewport,
body.forge-iso .map-viewport {
  perspective: 1400px;
  perspective-origin: 50% 42%;
  overflow: hidden;
}

body.forge-iso-full #map-viewport,
body.forge-iso-full .map-viewport {
  perspective: 1100px;
}

/* World plane is tilted via JS transform; keep 3D children */
body.forge-iso #world-layer,
body.forge-iso .world-layer {
  transform-style: preserve-3d;
  backface-visibility: hidden;
}

/* Soft diamond ground grid (reads more “tile” under iso) */
body.forge-iso #world-layer {
  background-image:
    linear-gradient(
      135deg,
      rgba(0, 255, 120, 0.045) 25%,
      transparent 25%,
      transparent 50%,
      rgba(0, 255, 120, 0.045) 50%,
      rgba(0, 255, 120, 0.045) 75%,
      transparent 75%,
      transparent
    ) !important;
  background-size: 70px 70px !important;
  background-color: #020a06 !important;
}

/* Zone floors get slight elevation cue */
body.forge-iso #world-layer .zone-terrain {
  box-shadow:
    0 10px 18px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
  border-radius: 2px;
}

/* ── Token billboards: stand upright against the tilted plane ── */
body.forge-iso.forge-iso-billboard #world-layer .mob-avatar,
body.forge-iso.forge-iso-billboard #world-layer .player-avatar-token {
  transform: translateZ(18px) rotateZ(calc(-1 * var(--iso-yaw, -28deg)))
    rotateX(calc(-1 * var(--iso-tilt, 32deg)));
  transform-style: preserve-3d;
  transform-origin: 50% 100%;
}

/* Ground blob shadow for depth (under feet) */
body.forge-iso #world-layer .mob-avatar::before,
body.forge-iso #world-layer .player-avatar-token::before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 2px;
  width: 28px;
  height: 12px;
  margin-left: -14px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.45), transparent 70%);
  transform: translateZ(0) scaleY(0.55);
  pointer-events: none;
  z-index: -1;
}

/* Local player (viewport-centered) — mild lift + shadow only */
body.forge-iso #player-avatar.player-avatar {
  filter: drop-shadow(0 10px 8px rgba(0, 0, 0, 0.45));
}
body.forge-iso #player-avatar .player-icon {
  box-shadow:
    0 0 14px rgba(0, 255, 136, 0.4),
    0 8px 0 -2px rgba(0, 0, 0, 0.25);
}

/* Fog slightly softer so the plane reads under it */
body.forge-iso #map-fog.map-fog,
body.forge-iso .map-fog {
  opacity: 0.92;
}

/* Iso mode pill (optional HUD) */
.forge-iso-pill {
  position: absolute;
  left: 10px;
  top: 10px;
  z-index: 40;
  font-size: 0.65rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #c9a227;
  background: rgba(8, 16, 12, 0.82);
  border: 1px solid rgba(201, 162, 39, 0.45);
  border-radius: 999px;
  padding: 0.2rem 0.55rem;
  pointer-events: none;
}
body:not(.forge-iso) .forge-iso-pill {
  display: none;
}