:root{
 --bg:#07131f;--bg2:#0d1b2a;--panel:#0b1825eF;--line:#20384c;--text:#edf7ff;--muted:#8ba2b5;
 --accent:#46d6ff;--good:#50e3a4;--danger:#ff6b6b;--shadow:0 16px 45px #0007;
 --top:58px;--ribbon:66px;
}
*{box-sizing:border-box} html,body{margin:0;height:100%;font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--accent);text-decoration:none}.muted{color:var(--muted)}
.login-body{min-height:100%;display:grid;place-items:center;background:radial-gradient(circle at 25% 20%,#163752 0,#07131f 44%,#030a10 100%)}
.login-shell{width:min(1060px,94vw);min-height:590px;display:grid;grid-template-columns:1.2fr .8fr;border:1px solid #244158;border-radius:26px;overflow:hidden;box-shadow:var(--shadow);background:#081522cc;backdrop-filter:blur(18px)}
.brand-panel{padding:70px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,#0c2132aa,#07131fdd)}
.brand-mark{font-size:92px;font-weight:900;letter-spacing:-7px;color:#fff}.brand-panel h1{font-size:28px;max-width:620px}.brand-panel p{color:#a7c0d3}.brand-panel span{margin-top:18px;color:#6e879a}
.login-card{padding:60px 44px;display:flex;flex-direction:column;justify-content:center;background:#0a1824}.eyebrow{font-size:12px;letter-spacing:.16em;color:var(--accent);font-weight:800}
.login-card h2{font-size:32px;margin:8px 0}.login-card form{display:grid;gap:17px;margin-top:22px}.login-card label{font-size:13px;color:#b9ccda;display:grid;gap:7px}
input,select{background:#07131f;border:1px solid #28445a;border-radius:10px;color:#fff;padding:12px;outline:none}
input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px #46d6ff18}.primary{padding:13px 18px;border:0;border-radius:11px;background:linear-gradient(120deg,#2fc5f3,#45e0ba);font-weight:800;color:#041018;cursor:pointer}
.alert{padding:12px;border:1px solid #7e3131;background:#411f24;border-radius:10px}
.topbar{height:var(--top);display:flex;align-items:center;gap:16px;padding:0 16px;border-bottom:1px solid var(--line);background:#07131ff2;position:relative;z-index:1001}
.brand-mini{display:flex;gap:10px;align-items:center;min-width:240px}.brand-mini b{font-size:24px;letter-spacing:-1px}.brand-mini span{font-size:12px;color:#8da7ba}
.scope{flex:1;display:flex;justify-content:center;gap:8px}.scope select{height:38px;min-width:220px;padding:6px 10px}.userbox{font-size:12px;color:#9bb0c1}
.ribbon{height:var(--ribbon);display:flex;gap:4px;align-items:stretch;padding:5px 8px;overflow-x:auto;border-bottom:1px solid var(--line);background:#0a1724;position:relative;z-index:1000}
.ribbon-btn{min-width:88px;background:transparent;border:1px solid transparent;color:#bcd0df;border-radius:8px;font-size:12px;display:flex;flex-direction:column;gap:3px;align-items:center;justify-content:center;cursor:pointer}
.ribbon-btn span{font-size:19px}.ribbon-btn:hover,.ribbon-btn.active{background:#14293a;border-color:#2b536d;color:#fff}
.workspace{height:calc(100vh - var(--top) - var(--ribbon));display:grid;grid-template-columns:260px 1fr 330px}
.sidepanel,.inspector{background:var(--panel);border-right:1px solid var(--line);padding:14px;overflow:auto}.inspector{border-left:1px solid var(--line);border-right:0}
.panel-title{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#7895aa;margin:7px 0 10px}.scope-card{border:1px solid #244157;border-radius:12px;padding:12px;display:grid;gap:5px}.scope-card span{font-size:12px;color:var(--muted)}
.map-wrap{position:relative;min-width:0}#map{height:100%;width:100%;background:#0b1720}.map-hud{position:absolute;left:10px;right:10px;bottom:10px;z-index:500;display:flex;justify-content:space-between;pointer-events:none}.map-hud span{background:#07131fd9;border:1px solid #26455a;border-radius:999px;padding:7px 10px;font-size:12px}
.kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.kpi-grid article{border:1px solid #203a4e;border-radius:12px;padding:13px;background:#0d1d2a}.kpi-grid b{display:block;font-size:20px}.kpi-grid span{font-size:12px;color:#8fa8bb}
.modal-backdrop{position:fixed;inset:0;background:#0009;z-index:2000;display:grid;place-items:center;padding:16px}.modal-backdrop.hidden{display:none}.modal{width:min(980px,96vw);max-height:88vh;overflow:auto;background:#0a1723;border:1px solid #2b4d63;border-radius:18px;box-shadow:var(--shadow);padding:24px;position:relative}.modal-close{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#fff;font-size:28px;cursor:pointer}
@media(max-width:900px){
 :root{--top:104px;--ribbon:62px}.topbar{height:var(--top);flex-wrap:wrap;padding:8px}.brand-mini{min-width:auto}.brand-mini span,.userbox{display:none}.scope{order:3;width:100%}.scope select{min-width:0;flex:1}
 .workspace{grid-template-columns:1fr;height:calc(100vh - var(--top) - var(--ribbon))}.sidepanel,.inspector{display:none}.ribbon-btn{min-width:74px}.map-hud{bottom:20px}
}


/* ============================================================
   SOHM V0.33.2 · ARRANQUE / LOGIN MÓVIL-PWA
   La pantalla de marca NO es un splash bloqueante: en móvil el
   formulario de acceso siempre queda visible y utilizable.
   ============================================================ */
.login-mobile-status{display:none}

@media(max-width:900px){
  body.login-body{
    display:block;
    min-height:100dvh;
    height:auto;
    overflow-y:auto;
    padding:max(16px,env(safe-area-inset-top)) 14px max(20px,env(safe-area-inset-bottom));
    background:radial-gradient(circle at 50% 8%,#12334d 0,#07131f 42%,#030a10 100%);
  }
  .login-shell{
    width:min(100%,620px);
    min-height:0;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    border-radius:22px;
    overflow:visible;
    background:#081522f2;
    backdrop-filter:none;
  }
  .brand-panel{
    flex:none;
    min-height:0;
    padding:28px 24px 22px;
    justify-content:flex-start;
    border-radius:22px 22px 0 0;
  }
  .brand-mark{
    font-size:clamp(56px,18vw,82px);
    line-height:.92;
    letter-spacing:-5px;
  }
  .brand-panel h1{
    margin:18px 0 8px;
    font-size:clamp(21px,6vw,29px);
    line-height:1.12;
  }
  .brand-panel p{margin:8px 0;font-size:15px;line-height:1.35}
  .brand-panel span{margin-top:8px;font-size:13px;line-height:1.35}
  .login-card{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    width:100%;
    min-width:0;
    padding:24px;
    border-top:1px solid #20384c;
    border-radius:0 0 22px 22px;
  }
  .login-card h2{font-size:25px;margin:7px 0 4px}
  .login-card form{gap:14px;margin-top:17px}
  .login-card label{font-size:12px}
  .login-card input{
    width:100%;
    min-height:48px;
    font-size:16px; /* evita zoom automático en iOS */
  }
  .login-submit{min-height:50px;font-size:15px}
  .login-mobile-status{
    display:flex;
    align-items:center;
    gap:7px;
    margin:5px 0 4px;
    color:#8edfcf;
    font-size:12px;
    font-weight:700;
  }
  .login-mobile-status i{
    width:8px;height:8px;border-radius:50%;background:#50e3a4;
    box-shadow:0 0 0 4px #50e3a418;
  }
}

@media(max-width:420px){
  body.login-body{padding-left:10px;padding-right:10px}
  .login-shell{border-radius:18px}
  .brand-panel{padding:22px 20px 18px;border-radius:18px 18px 0 0}
  .login-card{padding:20px;border-radius:0 0 18px 18px}
  .brand-mark{font-size:58px}
  .brand-panel h1{font-size:22px}
}

@media(max-height:700px) and (max-width:900px){
  .brand-panel{padding-top:18px;padding-bottom:14px}
  .brand-mark{font-size:52px}
  .brand-panel h1{font-size:20px;margin-top:12px}
  .brand-panel p,.brand-panel span{font-size:12px}
  .login-card{padding-top:17px;padding-bottom:17px}
}

/* Escala métrica por encima del indicador de estado del mapa. */
#map .leaflet-bottom.leaflet-left .leaflet-control-scale{margin-bottom:48px;margin-left:10px}
#map .leaflet-control-scale-line{background:rgba(255,255,255,.94);color:#162839;border-color:#162839;font-size:12px;text-shadow:none}
/* V0.42.1 · Presidencia municipal */
.president-card b{font-size:14px}.president-card details{font-size:12px;color:var(--muted)}.president-card summary{cursor:pointer}
.president-history{margin:4px 0 0;padding-left:16px;max-height:180px;overflow:auto}.president-note{font-size:11px!important;opacity:.75}.president-warn{color:#fbbf24!important}