/* v15 · mapa principal (referencia ux/em2/mapa_v15/: 01_control, 04_ficha; lote2/22_capas). Sin estilos en línea (CSP). */
.mapa { display: grid; gap: 10px; }
.mapa-main { min-width: 0; }
.mapa-tabs { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.mapa-tabs::-webkit-scrollbar { display: none; }
.mapa-tabs .tab { flex: 0 0 auto; background: #1b1714; color: #d9c9a8; border: 1px solid #5a4a33; border-radius: 3px; padding: 7px 10px; font: 600 12px/1 system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.mapa-tabs .tab.act { background: #7a1f24; color: #fff; border-color: #c9a86a; }
.mapa-subt { margin: 4px 0; font-style: italic; }
.mapa-lienzo { position: relative; }
.mapa-svg { width: 100%; height: auto; display: block; background: radial-gradient(#2a2420, #15110f); border: 1px solid #5a4a33; border-radius: 8px; max-height: 62vh; }
.mapa-svg .comarca { stroke: #0b0908; stroke-width: 2.2; cursor: pointer; stroke-linejoin: round; }
.mapa-svg .comarca:hover, .mapa-svg .comarca:focus { outline: none; filter: brightness(1.18); }
.mapa-svg .comarca.sel { stroke: #e9c46a; stroke-width: 3; filter: drop-shadow(0 0 6px rgba(233, 196, 106, .6)); }
.mapa-svg .comarca.gris { opacity: .75; }
.mapa-svg .rotulos { pointer-events: none; }
.mapa-svg .rotulos .pin, .mapa-svg .rotulos .pin * { pointer-events: auto; cursor: pointer; }
.mapa-svg .nom { fill: #f3e9d2; font: 700 12px Georgia, 'Times New Roman', serif; paint-order: stroke; stroke: #0b0908; stroke-width: 3px; }
.mapa-svg .chip rect { fill: #14100e; stroke: #8b7a5c; stroke-width: 1; }
.mapa-svg .chip text { fill: #f3e9d2; font: 600 10px system-ui, sans-serif; }
.mapa-svg .chip.c-rojo rect { stroke: #c0392b; } .mapa-svg .chip.c-rojo text { fill: #ffb3a8; }
.mapa-svg .chip.c-oro rect { fill: #e9d8a6; stroke: #e9d8a6; } .mapa-svg .chip.c-oro text { fill: #1b1714; }
.mapa-svg .chip.c-verde rect { stroke: #3fb950; }
.mapa-svg .chip.c-gris text { fill: #a9a39a; font-style: italic; }
.mapa-svg .pin circle { fill: #1b1714; stroke: #e9c46a; stroke-width: 1.4; }
.mapa-svg .pin text { fill: #e9c46a; font: 9px system-ui, sans-serif; }
.mapa-svg .pin .pin-t { fill: #e8dcc0; font: italic 8.5px Georgia, serif; paint-order: stroke; stroke: #0b0908; stroke-width: 2.5px; }
.mapa-svg .tu circle { fill: #e9d8a6; stroke: #8b6d2f; stroke-width: 2; }
.mapa-svg .tu text { fill: #1b1714; font: 700 11px system-ui, sans-serif; }
.mapa-svg .tu .tu-t { fill: #f3e9d2; font: 700 8px system-ui, sans-serif; paint-order: stroke; stroke: #0b0908; stroke-width: 2px; }
.hito { position: absolute; top: 8px; right: 8px; background: rgba(20, 16, 14, .9); border: 1px solid #c9a86a; border-radius: 4px; padding: 5px 8px; color: #f3e9d2; font-size: 12px; display: flex; flex-direction: column; }
.leyenda { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 6px 0; font-size: 12px; color: #d9c9a8; }
.leyenda .ley { display: inline-block; width: 11px; height: 11px; margin-right: 4px; vertical-align: -1px; border: 1px solid #8b7a5c; }
.leyenda .rz-l-base { background: repeating-linear-gradient(45deg, #4a3f33 0 3px, #8c7a5b 3px 5px); }
.leyenda .rz-l-sin { background: #3a3330; } .leyenda .rz-l-niebla { background: #2c2a29; }
.avisos-m h3 { margin: 0 0 4px; text-transform: uppercase; letter-spacing: .08em; font-size: 12px; color: #c9a86a; }
.aviso-m { border-top: 1px solid #3a3027; padding: 5px 0; }
.mapa-ficha { position: relative; }
.mapa-ficha h2 { margin: 0; font-family: Georgia, serif; }
.mapa-ficha .pa-q { display: flex; flex-direction: column; align-items: flex-end; margin-right: 8px; }
.mapa-ficha .chips-f { flex-wrap: wrap; gap: 4px; margin: 6px 0; }
.mapa-ficha .tag.rojo { border-color: #c0392b; color: #ffb3a8; }
.mapa-ficha .sep { text-transform: uppercase; letter-spacing: .1em; font-size: 12px; color: #c9a86a; text-align: center; border-top: 1px solid #3a3027; padding-top: 6px; }
.barra-rep { display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: #2b2520; }
.barra-rep i { display: block; height: 100%; }
.rep-l { flex-wrap: wrap; gap: 2px 10px; margin-top: 3px; }
.pj-mapa { display: flex; gap: 8px; justify-content: space-between; border-top: 1px solid #3a3027; padding: 7px 0; }
.pj-mapa .pj-d { min-width: 0; flex: 1; }
.pj-mapa .pj-a { display: flex; flex-direction: column; gap: 4px; align-items: stretch; min-width: 128px; }
.acc-b { display: flex; justify-content: space-between; gap: 6px; }
.acc-b .pa { background: #e9d8a6; color: #1b1714; border-radius: 2px; padding: 0 4px; font-size: 11px; }
.verde { color: #7ee787; }
.publicos summary { cursor: pointer; text-align: center; padding: 6px 0; color: #d9c9a8; }
.asa { display: none; }
@media (max-width: 899px) {
  .mapa-det.abierta { position: fixed; left: 0; right: 0; bottom: calc(56px + env(safe-area-inset-bottom)); max-height: 70vh; overflow-y: auto; z-index: 30; }
  .mapa-det.abierta .mapa-ficha { margin: 0; border-radius: 12px 12px 0 0; box-shadow: 0 -8px 24px rgba(0, 0, 0, .6); }
  .mapa-det.abierta { animation: rz-sube .22s ease-out; }   /* QA B1: la hoja sube */
  body:has(.mapa-det.abierta) .toast { z-index: 40; top: calc(10px + env(safe-area-inset-top)); bottom: auto; }   /* QA B5: el toast no tapa la ficha */
  .asa { display: block; width: 44px; height: 4px; border-radius: 2px; background: #8b7a5c; margin: 0 auto 6px; }
}
@media (min-width: 900px) { .mapa { grid-template-columns: minmax(0, 3fr) minmax(320px, 2fr); align-items: start; } .mapa-svg { max-height: 74vh; } }
@keyframes rz-sube { from { transform: translateY(100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { .mapa-det.abierta { animation: none; } }
.acc-b .aviso-o { color: #e9b44c; }
.hito .hito-racha { font-size: 11px; color: #c9a86a; }
