/* =========================================================
   HOTSPOTS - restored + fixed marker sizing/color
   Replace /css/faerun/hotspots.css

   Critical fixes:
   - .hotspot is absolute/grid so left/top coordinates work
   - .hotspot-marker is absolute inset:0 so width:100% cannot collapse to 4px
   - inner marker inherits color from parent hotspot type
========================================================= */
.hotspot, .hotspot-marker { --marker-accent: var(--entity-accent, var(--hotspot-accent, var(--entity-default, #ffd95a))); }
.hotspot[data-entity-type="person"], .hotspot[data-entity-type="person"] .hotspot-marker, .hotspot-marker[data-entity-type="person"], .hotspot.person, .hotspot.person .hotspot-marker, .hotspot-marker.person { --marker-accent: var(--entity-person); }
.hotspot[data-entity-type="place"], .hotspot[data-entity-type="place"] .hotspot-marker, .hotspot-marker[data-entity-type="place"], .hotspot.place, .hotspot.place .hotspot-marker, .hotspot-marker.place { --marker-accent: var(--entity-place); }
.hotspot[data-entity-type="quest"], .hotspot[data-entity-type="quest"] .hotspot-marker, .hotspot-marker[data-entity-type="quest"], .hotspot.quest, .hotspot.quest .hotspot-marker, .hotspot-marker.quest { --marker-accent: var(--entity-quest); }
.hotspot[data-entity-type="encounter"], .hotspot[data-entity-type="encounter"] .hotspot-marker, .hotspot-marker[data-entity-type="encounter"], .hotspot.encounter, .hotspot.encounter .hotspot-marker, .hotspot-marker.encounter { --marker-accent: var(--entity-encounter); }
.hotspot[data-entity-type="monster"], .hotspot[data-entity-type="monster"] .hotspot-marker, .hotspot-marker[data-entity-type="monster"], .hotspot.monster, .hotspot.monster .hotspot-marker, .hotspot-marker.monster { --marker-accent: var(--entity-monster); }
.hotspot[data-entity-type="map"], .hotspot[data-entity-type="map"] .hotspot-marker, .hotspot-marker[data-entity-type="map"], .hotspot.map, .hotspot.map .hotspot-marker, .hotspot-marker.map { --marker-accent: var(--entity-map); }
.hotspot[data-entity-type="site"], .hotspot[data-entity-type="site"] .hotspot-marker, .hotspot-marker[data-entity-type="site"], .hotspot.site, .hotspot.site .hotspot-marker, .hotspot-marker.site { --marker-accent: var(--entity-site, var(--entity-map)); }
.hotspot[data-entity-type="equipment"], .hotspot[data-entity-type="item"], .hotspot[data-entity-type="equipment"] .hotspot-marker, .hotspot[data-entity-type="item"] .hotspot-marker, .hotspot-marker[data-entity-type="equipment"], .hotspot-marker[data-entity-type="item"] { --marker-accent: var(--entity-item); }

.hotspot {
    position: absolute !important;
    z-index: 5;
    width: var(--hotspot-size-runtime, 30px) !important;
    height: var(--hotspot-size-runtime, 30px) !important;
    min-width: var(--hotspot-size-runtime, 30px) !important;
    min-height: var(--hotspot-size-runtime, 30px) !important;
    transform: translate(-50%, -50%);
    display: grid !important;
    place-items: center;
    padding: 0 !important;
    border: 0 !important;
    border-radius: var(--radius-pill, 999px);
    background: transparent !important;
    overflow: visible;
    isolation: isolate;
    pointer-events: auto;
    filter: drop-shadow(0 5px 10px rgba(0,0,0,.58));
    transition: transform var(--transition, 140ms ease), filter var(--transition, 140ms ease);
}
.hotspot:hover, .hotspot.hotspot-pulse, .hotspot.active-linked, .hotspot.marker-hover {
    transform: translate(-50%, -50%) scale(1.18);
    filter: drop-shadow(0 8px 16px rgba(0,0,0,.66)) saturate(1.12) brightness(1.08);
}
.hotspot-marker {
    position: absolute !important;
    inset: 0 !important;
    flex: none !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    display: grid !important;
    place-items: center;
    overflow: hidden;
    border-radius: inherit;
    border: 2px solid color-mix(in srgb, var(--marker-accent) 82%, white 8%);
    background: radial-gradient(circle at 32% 22%, rgba(255,255,255,.36), transparent 34%), linear-gradient(180deg, rgba(255,255,255,.13), rgba(0,0,0,.18)), color-mix(in srgb, var(--marker-accent) 18%, #07111d 82%);
    box-shadow: 0 0 0 2px rgba(0,0,0,.44), 0 0 0 4px color-mix(in srgb, var(--marker-accent) 18%, transparent), inset 0 0 0 1px rgba(255,255,255,.10), 0 6px 16px rgba(0,0,0,.58);
    opacity: 1;
}
.hotspot-face, .hotspot-number, .hotspot-icon, .hotspot-portrait {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    border-radius: inherit;
    transition: opacity var(--transition, 140ms ease), transform var(--transition, 140ms ease);
}
.hotspot-number {
    z-index: 2;
    opacity: 1;
    width: 100%;
    height: 100%;
    color: #fffdf4;
    font-size: clamp(.68rem, 1vw, .92rem);
    font-weight: 1000;
    line-height: 1;
    text-shadow: 0 1px 2px rgba(0,0,0,.96), 0 0 6px rgba(0,0,0,.8);
}
.hotspot-icon, .hotspot-portrait {
    z-index: 1;
    opacity: 0;
    transform: scale(.90);
    color: color-mix(in srgb, var(--marker-accent) 88%, white 12%);
}
.hotspot-icon svg, .hotspot-portrait svg {
    width: 62%;
    height: 62%;
    filter: drop-shadow(0 1px 3px rgba(0,0,0,.72));
}
.hotspot-portrait img, .hotspot img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: inherit;
}
.marker-style-number .hotspot-number, .marker-style-numberPortraitHover .hotspot-number { opacity: 1; transform: scale(1); }
.marker-style-icon .hotspot-icon, .marker-style-portrait .hotspot-portrait { opacity: 1; transform: scale(1); }
.marker-style-icon .hotspot-number, .marker-style-icon .hotspot-portrait, .marker-style-portrait .hotspot-number, .marker-style-portrait .hotspot-icon, .marker-style-number .hotspot-icon, .marker-style-number .hotspot-portrait { opacity: 0; pointer-events: none; }
.marker-style-numberPortraitHover.marker-hover .hotspot-number, .marker-style-numberPortraitHover.active-linked .hotspot-number, .marker-style-numberPortraitHover.hotspot-pulse .hotspot-number, .hotspot:hover .hotspot-number { opacity: 0; transform: scale(.78); }
.marker-style-numberPortraitHover.marker-hover .hotspot-portrait, .marker-style-numberPortraitHover.active-linked .hotspot-portrait, .marker-style-numberPortraitHover.hotspot-pulse .hotspot-portrait, .hotspot:hover .hotspot-portrait, .hotspot:hover .hotspot-icon { opacity: 1; transform: scale(1); }
.hotspot[data-entity-type="monster"] .hotspot-number, .hotspot[data-marker-mode="visual-only"] .hotspot-number, .hotspot-marker[data-entity-type="monster"] .hotspot-number { display: none !important; }
.hotspot[data-entity-type="monster"] .hotspot-icon, .hotspot[data-marker-mode="visual-only"] .hotspot-icon, .hotspot[data-marker-mode="visual-only"] .hotspot-portrait { opacity: 1; transform: scale(1); }
.hotspot.editable .hotspot-marker { outline: 2px dashed color-mix(in srgb, var(--marker-accent) 72%, white 10%); outline-offset: 4px; }
.hotspot.dragging { z-index: 13000; cursor: grabbing; }
.hotspot.dragging .hotspot-marker { transform: scale(1.08); }
@media (hover: none) {
    .marker-style-numberPortraitHover.marker-hover .hotspot-number { opacity: 1; transform: scale(1); }
    .marker-style-numberPortraitHover.marker-hover .hotspot-portrait { opacity: 0; transform: scale(.9); }
}