/* MyMap · capa visual NOC: etiquetas en mono mayúsculas, tarjetas de borde fino, acento menta y estados con tinte.
   Va después de app.css y shell.css y solo usa sus tokens (el tema claro la hereda). */
*{scrollbar-width:thin;scrollbar-color:var(--line) transparent}
body{background:var(--bg);background-image:radial-gradient(1100px 500px at 8% -8%,color-mix(in srgb,var(--acc) 7%,transparent),transparent 70%)}
body.shell{background-attachment:fixed}
h1,h2,h3,h4{font-family:var(--f-sans);text-wrap:balance}
input,select,textarea{background:var(--field);border-radius:6px}
input:focus,select:focus,textarea:focus{border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-soft)}
::placeholder{color:color-mix(in srgb,var(--mut) 70%,transparent)}

/* etiquetas y botones: mono, mayúsculas, espaciado */
label,th,.th-b,.stat span,.menu-t,#menuHerr .menu-t,.bloque h4,.leyenda-g,.insignia,.chip,.tipo,.mini,.btn,.tabs button,.subm a,.panel h3,.superior h1{font-family:var(--f-mono)}
label{font-size:10.5px;letter-spacing:.1em;font-weight:500}
.btn{font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;font-weight:600;padding:9px 14px;border-radius:6px}
.btn:hover{filter:none;box-shadow:0 0 0 3px var(--acc-soft)}
.btn.sec{background:var(--panel2)}.btn.sec:hover{border-color:var(--acc);box-shadow:none}
.btn.mal{background:var(--mal-bg);color:var(--mal);border:1px solid color-mix(in srgb,var(--mal) 45%,transparent)}
.mini{font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:var(--panel2);padding:5px 9px}
.mini:hover{border-color:var(--acc);color:var(--acc)}.mini.mal:hover{border-color:var(--mal);color:var(--mal)}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

/* barra superior: estado como en un NOC */
.superior{background:color-mix(in srgb,var(--panel) 92%,transparent);backdrop-filter:blur(6px);gap:8px}
.superior h1{font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);padding:7px 11px;border:1px solid var(--line);border-radius:7px;background:var(--panel2)}
.superior h1::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acc);box-shadow:0 0 8px var(--acc);margin-right:9px;vertical-align:1px}
.superior select{font-family:var(--f-mono);font-size:12px;letter-spacing:.03em;background:var(--panel2);border-radius:7px;padding:7px 10px}
.superior .usuario{font:500 11.5px var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--mut)}
.superior .buscador input{font-family:var(--f-mono);font-size:12.5px}

/* menú lateral */
#lateral .marca{font-weight:700;letter-spacing:.02em;padding:15px 18px}
.logo{border-radius:7px;border:2px solid var(--acc);box-shadow:0 0 12px color-mix(in srgb,var(--acc) 45%,transparent)}.logo::after{border-radius:3px;inset:3px}
#lateral nav>a,#lateral summary{font-size:13.5px;padding:10px 18px;border-left-width:2px}
#lateral nav>a:hover,#lateral summary:hover{background:var(--lat-act)}
#lateral .act{background:linear-gradient(90deg,color-mix(in srgb,var(--acc) 16%,transparent),transparent);color:var(--acc);border-left-color:var(--acc)}
.subm a{font-size:11.5px;letter-spacing:.04em;text-transform:uppercase}.subm a.act{color:var(--acc)}

/* páginas y tarjetas */
.pag-cab h2{font-size:26px;font-weight:600;letter-spacing:-.025em}
.pag-cab .sub{font-size:13.5px}
.panel,.grid,.proy,.rolc,.stat,.modal-caja,.tarjeta{background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:none}
.modal-caja,.tarjeta:not(.ancha){box-shadow:var(--sombra)}
.panel h3{font-size:11.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);padding-bottom:10px;border-bottom:1px solid var(--line);margin-bottom:12px}
.proy{transition:border-color .15s,transform .15s}.proy:hover{border-color:color-mix(in srgb,var(--acc) 55%,var(--line))}
.proy .metr{font:12px var(--f-mono)}.proy .metr b{font-weight:600}
.tarjetas{gap:12px}
.stat{display:flex;flex-direction:column-reverse;gap:6px;padding:14px 16px;border-top:2px solid var(--k,var(--acc))}
.stat:nth-child(4n+2){--k:var(--warn)}.stat:nth-child(4n+3){--k:var(--info)}.stat:nth-child(4n+4){--k:var(--t-olt)}
.stat b{font-size:34px;font-weight:600;letter-spacing:-.03em;line-height:1}
.stat span{font-size:10.5px;letter-spacing:.12em;font-weight:500}

/* insignias con tinte */
.insignia{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:500;padding:3px 9px}
.insignia.ok{background:color-mix(in srgb,var(--ok) 13%,transparent)}.insignia.warn,.insignia.media{background:color-mix(in srgb,var(--warn) 13%,transparent)}
.chip{font-size:11px;letter-spacing:.03em;border-radius:4px;background:var(--panel2)}
.tipo{font-size:10.5px;letter-spacing:.1em;border-radius:4px;color:#fff}

/* tablas */
.grid-barra{background:var(--panel)}
.th-b{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;font-weight:500;padding:11px 10px}
.grid th{background:var(--panel2);border-bottom:1px solid var(--line)}
.grid td{font-size:13px}.grid tr:hover td{background:color-mix(in srgb,var(--acc) 5%,var(--panel))}
.grid td.num{font-family:var(--f-mono);font-size:12.5px}
.grid-pie{font:11.5px var(--f-mono);letter-spacing:.04em}
.tabs button{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:500}.tabs button.act{color:var(--acc)}
.progreso{height:6px;border-radius:99px;border:0;background:var(--panel2)}.progreso i{border-radius:99px;box-shadow:0 0 8px var(--acc-soft)}

/* aviso y toast */
.aviso{background:var(--panel2);border-radius:8px}
#toast,#tooltip,.mide{background:var(--panel2);color:var(--ink);border:1px solid var(--line);font-family:var(--f-mono);font-size:12px;letter-spacing:.02em}
#tooltip{color:var(--ink)}

/* mapa: paneles flotantes */
#barraHerr,#arbol,.menu,#menuHerr{background:color-mix(in srgb,var(--panel) 94%,transparent);backdrop-filter:blur(6px)}
#barraHerr button{font-size:12.5px;font-weight:500}#barraHerr button.act{box-shadow:0 0 12px var(--acc-soft)}
#panel{background:var(--panel)}#panel h3{font-size:18px;font-weight:600}
.bloque h4,.menu-t{font-size:10.5px;letter-spacing:.12em;font-weight:500}
.pt{border-radius:5px}.pt.libre{background:color-mix(in srgb,var(--ok) 10%,transparent)}
#informe{border-top-color:var(--acc)}#informe .inf-cab{font:600 12px var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.gm-style .gm-style-iw-c{background:var(--panel);color:var(--ink)}
.clave-ok{border-color:var(--acc);color:var(--acc)}

/* acceso */
.centrado{background-image:radial-gradient(700px 380px at 50% 0%,color-mix(in srgb,var(--acc) 9%,transparent),transparent 70%)}
.tarjeta h2{font-size:20px;letter-spacing:-.02em}