/* Vista «Mapa»: capas en columnas sobre el escenario de la vitrina; colores por capa desde --mapa-* (mando.css). */
.map-side{flex:1;min-height:0;display:flex;flex-direction:column;gap:8px;padding:0 12px 8px;min-width:276px;overflow:auto}
.map-side .search{max-width:none;width:100%;min-height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.25);color:var(--blanco)}
.map-side .search::placeholder{color:rgba(255,255,255,.55)}
.map-resumen{margin:0 2px;font-size:.9375rem;color:rgba(255,255,255,.8)}
.map-at{margin:0 2px;font-size:.875rem;color:rgba(255,255,255,.72)}
.map-chips{display:flex;flex-direction:column;gap:4px}
.map-chip{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:0 10px;border:0;border-radius:10px;background:transparent;color:var(--blanco);font-weight:600;font-size:.9375rem;text-align:left}
.map-chip i{width:12px;height:12px;border-radius:4px;background:var(--cc);flex:none}
.map-chip small{margin-left:auto;font-weight:500;color:rgba(255,255,255,.6)}
.map-chip[aria-pressed="false"]{opacity:.45}
.map-chip[aria-pressed="false"] i{background:transparent;box-shadow:0 0 0 2px var(--cc) inset}
.map-chip:disabled{opacity:.3;cursor:default}
.map-chip:hover:not(:disabled){background:rgba(255,255,255,.08)}
.map-tools{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto}
.map-tools .btn.ghost{flex:1;min-height:44px;padding:0 10px;font-size:.875rem;color:var(--blanco);border-color:rgba(255,255,255,.25)}
.map-nota{margin:4px 2px 0;font-size:.8125rem;line-height:1.4;color:rgba(255,255,255,.55)}

.map-stage{flex:1;min-height:0;position:relative;display:flex;flex-direction:column}
.map-box{flex:1;min-height:0;position:relative;overflow:hidden;touch-action:none;cursor:grab}
.map-box:active{cursor:grabbing}
.map-box svg{width:100%;height:100%;display:block}
.map-msg{position:absolute;inset:auto 16px 16px;margin:0;padding:12px 16px;border-radius:12px;background:rgba(0,0,0,.45);color:var(--blanco);font-size:.9375rem;text-align:center}
.map-zoom{position:absolute;right:14px;bottom:14px;display:flex;flex-direction:column;gap:4px;z-index:3}
.map-zoom .ibtn{width:44px;height:44px;background:rgba(0,0,0,.4);border-color:rgba(255,255,255,.15);color:var(--blanco);font-weight:700}
.mcol{fill:rgba(255,255,255,.7);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-family:var(--sans)}
.mcol.c-hosts{fill:var(--mapa-hosts)}.mcol.c-paginas{fill:var(--mapa-paginas)}.mcol.c-apps{fill:var(--mapa-apps)}.mcol.c-api{fill:var(--mapa-api)}.mcol.c-datos{fill:var(--mapa-datos)}.mcol.c-servicios{fill:var(--mapa-servicios)}.mcol.c-terceros{fill:var(--mapa-terceros)}
.mn{cursor:pointer;outline:none}
.mn rect{fill:rgba(255,255,255,.07);stroke:rgba(255,255,255,.18);stroke-width:1;transition:fill .15s,stroke .15s}
.mn:hover rect,.mn:focus-visible rect{fill:rgba(255,255,255,.14);stroke:rgba(255,255,255,.5)}
.mn .mbar{stroke:none;fill:var(--cc)}
.mn text{fill:var(--blanco);font-size:12px;font-family:var(--sans);pointer-events:none;user-select:none}
.mn .msub{fill:rgba(255,255,255,.6);font-size:10px}
.mn.sel rect:first-child{fill:rgba(255,255,255,.22);stroke:var(--blanco);stroke-width:1.5}
.mn.nb rect:first-child{stroke:rgba(255,255,255,.55)}
.mn.off,.mn.dim{opacity:.28}
.mn.hit rect:first-child{stroke:var(--accent);stroke-width:1.6}
.mn.baja rect:first-child{stroke-dasharray:3 3}
.mn.grp rect:first-child{fill:rgba(255,255,255,.12);stroke:var(--cc);stroke-width:1.4}
.mn.grp .msub{fill:var(--cc);opacity:.85}
.c-hosts{--cc:var(--mapa-hosts)}.c-paginas{--cc:var(--mapa-paginas)}.c-apps{--cc:var(--mapa-apps)}.c-api{--cc:var(--mapa-api)}.c-datos{--cc:var(--mapa-datos)}.c-servicios{--cc:var(--mapa-servicios)}.c-terceros{--cc:var(--mapa-terceros)}
.me{fill:none;stroke:rgba(255,255,255,.26);stroke-width:1.2;pointer-events:none}
.me.baja{stroke-dasharray:4 4;stroke:rgba(255,255,255,.16)}
.me.on{stroke:var(--accent);stroke-width:1.8;opacity:1}
.me.off,.me.dim{opacity:.08}

.map-panel{position:absolute;top:12px;right:12px;bottom:12px;width:min(360px,calc(100% - 24px));overflow:auto;overscroll-behavior:contain;z-index:4;padding:14px 16px 18px;border-radius:16px;background:rgba(10,14,22,.94);color:var(--blanco);box-shadow:0 20px 60px -20px rgba(0,0,0,.8);border:1px solid rgba(255,255,255,.1);font-family:var(--sans)}
.mp-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mp-capa{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.1);font-size:.8125rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.mp-capa::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--cc)}
.map-panel .nbtn{font-size:1.25rem;color:rgba(255,255,255,.7)}
.mp-title{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1rem;line-height:1.35;margin:10px 0 2px;overflow-wrap:anywhere;font-weight:700}
.mp-sub{margin:0 0 8px;color:rgba(255,255,255,.65);font-size:.9375rem}
.mp-attrs{margin:8px 0;display:grid;gap:6px}
.mp-attrs div{display:grid;grid-template-columns:82px minmax(0,1fr);gap:8px;font-size:.875rem}
.mp-attrs dt{color:rgba(255,255,255,.55);font-weight:600}
.mp-attrs dd{margin:0;overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8125rem}
.mp-actions{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 4px}
.mp-actions .btn.ghost{color:var(--blanco);border-color:rgba(255,255,255,.3);min-height:44px}
.mp-h4{font-size:.875rem;font-weight:700;margin:14px 0 4px;color:rgba(255,255,255,.75)}
.mp-g{display:flex;align-items:center;gap:6px;margin:8px 0 2px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--cc)}
.mp-list{list-style:none;margin:0;padding:0}
.mp-list button{display:flex;align-items:center;gap:6px;width:100%;min-height:44px;padding:4px 8px;border:0;border-radius:8px;background:transparent;color:var(--blanco);text-align:left;font-size:.875rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.mp-list button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mp-list button small{margin-left:auto;color:rgba(255,255,255,.5)}
.mp-list button:hover{background:rgba(255,255,255,.1)}
.mp-more{font-size:.8125rem;color:rgba(255,255,255,.5);padding:4px 8px}
@media (max-width:700px){
  .map-side{min-width:0}
  .map-panel{top:auto;left:8px;right:8px;bottom:8px;width:auto;max-height:55%;border-radius:16px}
  .map-zoom{bottom:auto;top:10px}
}

/* ---- Cerebro (encargo #136): el mismo mapa en modo grafo de conocimiento ---- */
.c-k0{--cc:var(--mapa-hosts)}.c-k1{--cc:var(--mapa-paginas)}.c-k2{--cc:var(--mapa-apps)}.c-k3{--cc:var(--mapa-api)}.c-k4{--cc:var(--mapa-datos)}.c-k5{--cc:var(--mapa-servicios)}.c-k6{--cc:var(--mapa-terceros)}
.c-proyectos{--cc:var(--mapa-hosts)}.c-decisiones{--cc:var(--mapa-paginas)}.c-nucleo{--cc:var(--mapa-apps)}.c-dependencias{--cc:var(--mapa-api)}.c-reglas{--cc:var(--mapa-datos)}.c-integraciones{--cc:var(--mapa-servicios)}.c-agentes{--cc:var(--mapa-terceros)}
.mcol[class*=" c-k"],.mcol.c-proyectos,.mcol.c-decisiones,.mcol.c-nucleo,.mcol.c-dependencias,.mcol.c-reglas,.mcol.c-integraciones,.mcol.c-agentes{fill:var(--cc)}
.map-modo{display:flex;align-items:center;width:100%;margin:2px 0 4px}
.map-modo button{flex:1;min-height:44px;font-size:.9375rem}
.map-modo .ayuda-btn{flex:none;min-width:44px;margin:0}
.map-cer{display:grid;gap:8px;margin-top:6px;padding:12px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.map-cer-t{margin:0;font-size:1rem;font-weight:700;color:var(--blanco)}
.map-cer-tipos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:3px;border-radius:12px;background:rgba(0,0,0,.25)}
.map-cer-tipos button{min-height:44px;border:0;border-radius:9px;background:transparent;color:rgba(255,255,255,.78);font-weight:600;font-size:.875rem}
.map-cer-tipos button[aria-checked="true"]{background:var(--blanco);color:var(--casi-negro)}
.map-cer-tipos button:focus-visible,.map-cer-sug:focus-visible,.map-modo button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.map-cer-f{display:grid;gap:6px}
.map-cer-l{margin:2px 2px 0;font-size:.875rem;font-weight:600;color:rgba(255,255,255,.75)}
.map-cer .search{max-width:none;width:100%;min-height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.25);color:var(--blanco);font-size:1rem}
.map-cer .search::placeholder{color:rgba(255,255,255,.5)}
.map-cer .btn.primary{width:100%;background:var(--accent);color:var(--accent-ink)}
.map-cer-sugs{display:grid;gap:4px}
.map-cer-sug{min-height:44px;padding:8px 10px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:transparent;color:var(--blanco);text-align:left;font-size:.875rem;line-height:1.35;overflow-wrap:anywhere}
.map-cer-sug:hover{background:rgba(255,255,255,.08)}
/* Respuesta: hoja modal (abajo en celular, centrada en computadora; ESTANDAR §4c) */
.cer-out{margin:4px 0 0;padding:14px 16px;border-radius:14px;background:var(--papel);color:var(--tinta);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.875rem;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;max-height:min(60dvh,560px);overflow:auto;overscroll-behavior:contain}
.cer-out[data-estado="cargando"]{color:var(--tinta-2)}
.cer-simple{margin:4px 0 0;padding:14px 16px;border-radius:14px;background:var(--papel);color:var(--tinta);font-size:1rem;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;max-height:min(56dvh,520px);overflow:auto;overscroll-behavior:contain}
.cer-simple[data-estado="cargando"]{color:var(--tinta-2)}
.cer-simple[data-estado="error"]{color:var(--err-tinta)}
.cer-tec{margin-top:10px}
.cer-tec summary{display:inline-grid;place-items:center;width:44px;height:44px;margin-left:-11px;border-radius:50%;cursor:pointer;list-style:none;font-weight:700;color:var(--tinta)}
.cer-tec summary::-webkit-details-marker{display:none}
.cer-tec summary::before{content:"";position:absolute;width:22px;height:22px;border:1.5px solid currentColor;border-radius:50%;box-sizing:border-box}
.cer-tec summary{position:relative}
.cer-tec summary:focus-visible{outline:3px solid var(--azul);outline-offset:-4px}
.cer-out[data-estado="error"]{color:var(--err-tinta)}
html.cer-bloqueo,html.cer-bloqueo body{overflow:hidden}
@media (max-width:700px){
  dialog.cer-hoja{position:fixed;inset:auto 0 0 0;margin:0;width:100%;max-width:100%;max-height:calc(100dvh - env(safe-area-inset-top) - 8px);border-radius:22px 22px 0 0}
  .cer-hoja .dlg-body{--dlg-pad:18px;max-height:calc(100dvh - env(safe-area-inset-top) - 8px);padding-bottom:calc(var(--dlg-pad) + env(safe-area-inset-bottom))}
  .cer-hoja[open]{animation:cer-sube .28s cubic-bezier(.2,0,0,1)}
  .cer-out,.cer-simple{max-height:none}
}
@keyframes cer-sube{from{transform:translateY(24px);opacity:.4}}
@media (prefers-reduced-motion:reduce){.cer-hoja[open]{animation:none}}
/* Herramientas › Cerebro: el mismo mapa (adoptado) sobre el escenario oscuro de la vitrina */
.cer-mando{display:grid;gap:12px;margin-top:12px}
.cer-mando-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.cer-mando-head h2{font-size:1.375rem;margin:0}
.cer-panel-btn,.cer-panel-h{display:none}
.cer-panel-btn .i3d{width:22px;height:22px}
.cer-host{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);height:min(78dvh,880px);min-height:520px;color:var(--blanco);border-radius:20px;overflow:hidden;
  background:radial-gradient(120% 90% at 50% 0%,var(--stage-a) 0%,var(--stage-b) 75%)}
.cer-panel{display:flex;flex-direction:column;min-height:0;min-width:0;padding:14px 12px;border-right:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.2)}
.cer-panel .map-side{padding:0;min-width:0;background:none}
.cer-host .map-stage{min-height:0}
.cer-obs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.1)}
.cer-obs .btn.ghost{min-height:44px;color:var(--blanco);border-color:rgba(255,255,255,.22)}
.cer-obs-msg{font-size:.9375rem;color:rgba(255,255,255,.8)}
@media (max-width:700px){
  /* Celular: primero el escenario 3D; el panel es una hoja que sube con «Buscar y preguntar». */
  .cer-mando-head .cer-panel-btn{display:inline-flex}
  .cer-host{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);height:calc(100dvh - 210px - env(safe-area-inset-bottom));min-height:420px;border-radius:16px}
  .cer-host .map-stage{grid-row:1;grid-column:1}
  .cer-panel{position:fixed;z-index:30;inset:auto 0 0 0;max-height:min(82dvh,640px);overflow:auto;overscroll-behavior:contain;border:0;border-radius:22px 22px 0 0;
    padding:0 14px calc(14px + env(safe-area-inset-bottom));background:var(--stage-b);box-shadow:0 -20px 50px -10px rgba(0,0,0,.6);
    transform:translateY(105%);visibility:hidden;transition:transform .28s cubic-bezier(.2,0,0,1),visibility 0s .28s}
  .cer-host.panel .cer-panel{transform:none;visibility:visible;transition:transform .28s cubic-bezier(.2,0,0,1)}
  .cer-panel-h{display:flex;align-items:center;justify-content:space-between;gap:10px;position:sticky;top:0;z-index:2;margin:0 -14px 8px;padding:12px 14px 8px;background:inherit}
  .cer-panel-h b{font-size:1.0625rem}
  .cer-panel-h .btn.ghost{color:var(--blanco);border-color:rgba(255,255,255,.22)}
  .cer-panel .map-side{flex:none;overflow:visible}
}
@media (prefers-reduced-motion:reduce){.cer-panel,.cer-host.panel .cer-panel{transition:none}}
/* Cerebro en 3D (encargo #151): el escenario lo pinta web/cerebro3d/ (carga perezosa); aquí solo el hueco y el conmutador */
.cer3d-host{flex:1;min-height:0;display:flex;flex-direction:column}
.cer-vista{margin-top:0}
.cer-sin3d{color:rgba(255,255,255,.75)}
