/* Panel «Edificación satelital» (js/open-buildings.js). Reusa las clases .mm-* de css/major-mapa.css. */
#openBuildingsPanel {
    --mm-accent: #fb923c;
    position: fixed;
    inset: 0 0 0 auto;
    width: 380px;
    max-width: calc(100vw - 32px);
    z-index: 6460;
    display: flex;
    flex-direction: column;
    color: #e2e8f0;
    background:
        radial-gradient(circle at 90% 0, rgba(251, 146, 60, .16), transparent 36%),
        linear-gradient(180deg, rgba(15, 23, 42, .985), rgba(2, 6, 23, .985));
    border-left: 1px solid rgba(251, 146, 60, .3);
    box-shadow: -24px 0 70px rgba(0, 0, 0, .55);
    transform: translateX(105%);
    transition: transform .35s cubic-bezier(.16, 1, .3, 1);
    font-family: Inter, system-ui, sans-serif;
}
#openBuildingsPanel.open { transform: translateX(0); }
#openBuildingsPanel .mm-logo { color: #fdba74; background: rgba(251, 146, 60, .13); border-color: rgba(251, 146, 60, .3); }
#openBuildingsPanel .mm-label { color: #fdba74; }
#openBuildingsPanel .mm-head { overflow-y: auto; max-height: 58vh; }
.ob-anio { margin: 10px 0 8px; padding: 10px 12px 8px; border-radius: 14px; background: rgba(2, 6, 23, .5); border: 1px solid rgba(255, 255, 255, .07); }
.ob-anio-top { display: flex; align-items: baseline; justify-content: space-between; }
.ob-anio-top .mm-label { margin: 0; }
.ob-anio-top b { font-size: 20px; font-weight: 900; color: #fff; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ob-anio input[type=range] { width: 100%; margin: 6px 0 2px; accent-color: #fb923c; }
.ob-anio-marcas { display: flex; justify-content: space-between; font-size: 9px; color: #64748b; padding: 0 2px; font-variant-numeric: tabular-nums; }
.ob-sw { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; align-items: start; margin: 8px 0; cursor: pointer; }
.ob-sw input { accent-color: #fb923c; width: 15px; height: 15px; margin: 2px 0 0; }
.ob-sw b { display: block; font-size: 12px; color: #fff; }
.ob-sw small { display: block; font-size: 10px; color: #94a3b8; line-height: 1.4; margin-top: 1px; }
.ob-rampa { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 2px 0 6px 26px; font-size: 10px; color: #cbd5e1; }
.ob-rampa[hidden] { display: none; }
.ob-rampa span { display: inline-flex; align-items: center; gap: 5px; }
.ob-rampa i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.ob-sw-sub { margin-left: 26px; grid-template-columns: 16px minmax(0, 1fr); }
.ob-sw[hidden] { display: none; }
.ob-sep { height: 1px; background: rgba(255, 255, 255, .07); margin: 10px 0 4px; }

/* Tarjeta «Edificación satelital» en la ficha (#tab-resumen) */
.ob-card { padding: 16px; border-radius: 24px; background: linear-gradient(160deg, rgba(251, 146, 60, .10), rgba(15, 23, 42, .6)); border: 1px solid rgba(251, 146, 60, .28); color: #e2e8f0; }
.ob-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.ob-card-head p { margin: 0; font-size: 10px; font-weight: 900; color: #fdba74; text-transform: uppercase; letter-spacing: .12em; }
.ob-card-head p i { margin-right: 6px; }
.ob-chip { font-size: 9px; font-weight: 800; padding: 3px 8px; border-radius: 999px; color: #fff; background: color-mix(in srgb, var(--c) 25%, transparent); border: 1px solid color-mix(in srgb, var(--c) 60%, transparent); }
.ob-serie { display: grid; grid-template-columns: repeat(8, 1fr); gap: 4px; height: 64px; align-items: end; margin-bottom: 10px; }
.ob-col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 3px; }
.ob-col i { display: block; width: 100%; border-radius: 4px 4px 1px 1px; min-height: 0; }
.ob-col span { font-size: 8px; color: #64748b; font-variant-numeric: tabular-nums; }
.ob-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ob-grid > div { background: rgba(2, 6, 23, .45); border: 1px solid rgba(255, 255, 255, .06); border-radius: 10px; padding: 6px 8px; min-width: 0; }
.ob-grid span { display: block; font-size: 8px; color: #64748b; text-transform: uppercase; font-weight: 800; letter-spacing: .06em; }
.ob-grid b { display: block; font-size: 12px; color: #e2e8f0; }
.ob-f-alerta { display: flex; gap: 8px; align-items: flex-start; margin-top: 8px; padding: 8px 10px; border-radius: 10px; font-size: 11px; line-height: 1.4; color: #cbd5e1; background: rgba(34, 197, 94, .08); border: 1px solid rgba(34, 197, 94, .25); }
.ob-f-alerta i { color: #86efac; margin-top: 2px; }
.ob-f-alerta.on { background: rgba(239, 68, 68, .1); border-color: rgba(239, 68, 68, .35); color: #fecaca; }
.ob-f-alerta.on i { color: #fca5a5; }
.ob-f-acc { margin-top: 8px; }
.ob-f-acc button { width: 100%; padding: 7px; border-radius: 10px; border: 1px solid rgba(251, 146, 60, .35); background: rgba(251, 146, 60, .1); color: #fdba74; font-size: 10px; font-weight: 800; cursor: pointer; }
.ob-f-acc button:hover { background: rgba(251, 146, 60, .18); }
.ob-nota { margin: 10px 0 0; font-size: 9px; color: #64748b; line-height: 1.45; }
@media (max-width: 640px) { #openBuildingsPanel { width: 100vw; max-width: 100vw; } }