.bx-plano-2d{position:absolute;inset:0;overflow:hidden;background:#f4f7f4;}
.bx-plano-2d{
  --green-900: #15291c;
  --green-700: #24503a;
  --green-500: #3c7a55;
  --green-100: #e8f2ec;
  --accent: #ffd166;
  --ink: #15291c;
  --muted: #6b7f73;
  --line: #dfe8e2;
  --bg: #f4f7f5;
  --lot: #d3e1c7;
  --lot-line: #4e735b;
  --water: #78b8ca;
  --grass: #96b985;
  --forest: #5f855f;
  --scrub: #789573;
  --road: #d9cdb9;
  --selected: #e63946;
  --highlight: #ff8c42;
}
.bx-plano-2d *{ box-sizing: border-box; }
.bx-plano-2d [hidden]{ display: none !important; }
.bx-plano-2d .sr-only{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.bx-plano-2d, .bx-plano-2d{ width: 100%; height: 100%; margin: 0; overflow: hidden; }
.bx-plano-2d{ display: flex; flex-direction: column; color: var(--ink); background: var(--bg); font-family: Manrope, system-ui, -apple-system, sans-serif; }
.bx-plano-2d button, .bx-plano-2d input{ font: inherit; }
.bx-plano-2d button{ cursor: pointer; }
.bx-plano-2d .topbar{ position: relative; z-index: 20; min-height: 58px; display: flex; align-items: center; gap: 12px; padding: max(10px, env(safe-area-inset-top)) 14px 10px; color: white; background: var(--green-900); }
.bx-plano-2d .logo{ width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center; color: white; background: var(--green-500); border-radius: 8px; font-size: 14px; font-weight: 800; letter-spacing: -.03em; }
.bx-plano-2d .identity{ min-width: 0; }
.bx-plano-2d .identity h1{ margin: 0; overflow: hidden; font-size: 15px; line-height: 1.15; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.bx-plano-2d .identity p{ margin: 2px 0 0; color: #9db8a8; font-size: 10.5px; font-weight: 600; }
.bx-plano-2d .spacer{ flex: 1; }
.bx-plano-2d .view-link{ flex: 0 0 auto; padding: 8px 12px; color: var(--green-900); background: var(--accent); border-radius: 9px; font-size: 12px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.bx-plano-2d .embedded .view-link{ visibility: hidden; }
.bx-plano-2d .searchbox input{ width: 160px; height: 36px; padding: 0 11px; color: white; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22); border-radius: 8px; outline: none; font-size: 12px; font-weight: 600; }
.bx-plano-2d .searchbox input::placeholder{ color: #8aa596; }
.bx-plano-2d .searchbox input:focus{ width: 190px; background: rgba(255,255,255,.2); border-color: rgba(255,255,255,.45); }
.bx-plano-2d #main{ min-height: 0; flex: 1; display: flex; }
.bx-plano-2d #map-wrap{ position: relative; min-width: 0; min-height: 0; flex: 1; overflow: hidden; touch-action: pan-y; background: #edf2ed; cursor: grab; }
.bx-plano-2d #map-wrap.dragging{ cursor: grabbing; }
.bx-plano-2d #map{ position: absolute; inset: 0; width: 100%; height: 100%; display: block; background-color: #edf2ed; background-image: linear-gradient(rgba(36,80,58,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(36,80,58,.045) 1px, transparent 1px); background-size: 28px 28px; }
.bx-plano-2d .perimeter{ fill: #dde7dc; stroke: var(--green-700); stroke-width: 2.2; vector-effect: non-scaling-stroke; }
.bx-plano-2d .landcover{ vector-effect: non-scaling-stroke; pointer-events: none; }
.bx-plano-2d .landcover.water{ fill: var(--water); stroke: #4d8ca0; stroke-width: 1; }
.bx-plano-2d .landcover.grass, .bx-plano-2d .landcover.recreation_ground, .bx-plano-2d .landcover.park, .bx-plano-2d .landcover.golf_course, .bx-plano-2d .landcover.pitch{ fill: var(--grass); stroke: #6d9464; stroke-width: .8; }
.bx-plano-2d .landcover.forest, .bx-plano-2d .landcover.wood{ fill: var(--forest); stroke: #456b49; stroke-width: .8; }
.bx-plano-2d .landcover.scrub{ fill: var(--scrub); stroke: #5f7c59; stroke-width: .8; }
.bx-plano-2d .street, .bx-plano-2d .waterway{ fill: none; vector-effect: non-scaling-stroke; pointer-events: none; }
.bx-plano-2d .street{ stroke: var(--road); stroke-width: 5.5; stroke-linecap: round; stroke-linejoin: round; }
.bx-plano-2d .waterway{ stroke: #4d9ab1; stroke-width: 3.2; stroke-linecap: round; }
.bx-plano-2d .building{ fill: rgba(153,118,83,.78); stroke: #6f5137; stroke-width: .9; vector-effect: non-scaling-stroke; pointer-events: none; }
.bx-plano-2d .lot{ fill: rgba(211,225,199,.80); stroke: var(--lot-line); stroke-width: .78; vector-effect: non-scaling-stroke; cursor: pointer; transition: fill .08s, stroke .08s; }
.bx-plano-2d .lot:hover, .bx-plano-2d .lot:focus{ fill: rgba(255,140,66,.45); stroke: var(--highlight); stroke-width: 1.6; outline: none; }
.bx-plano-2d .lot.selected{ fill: rgba(230,57,70,.48); stroke: var(--selected); stroke-width: 2.2; }
.bx-plano-2d .lot-label{ fill: #193e29; font-weight: 800; text-anchor: middle; dominant-baseline: central; pointer-events: none; opacity: 0; transition: opacity .12s linear; }
.bx-plano-2d .lot-label.visible{ opacity: .82; }
.bx-plano-2d .lot-label.selected{ fill: white; opacity: 1; }
.bx-plano-2d .zoom-buttons{ position: absolute; top: 14px; left: 14px; z-index: 10; display: grid; gap: 8px; }
.bx-plano-2d .zoom-buttons button{ width: 40px; height: 40px; display: grid; place-items: center; padding: 0; color: var(--ink); background: white; border: 0; border-radius: 9px; box-shadow: 0 2px 10px rgba(0,0,0,.23); font-size: 20px; font-weight: 800; }
.bx-plano-2d .zoom-buttons button:hover{ background: var(--green-100); }
.bx-plano-2d .zoom-buttons svg{ width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.bx-plano-2d .legend{ position: absolute; left: 14px; bottom: 14px; z-index: 9; display: flex; flex-wrap: wrap; gap: 8px 12px; max-width: calc(100% - 28px); padding: 8px 10px; color: var(--ink); background: rgba(255,255,255,.94); border-radius: 9px; box-shadow: 0 2px 10px rgba(0,0,0,.18); font-size: 10px; font-weight: 700; pointer-events: none; }
.bx-plano-2d .legend span{ display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.bx-plano-2d .legend i{ width: 13px; height: 13px; border: 1px solid var(--lot-line); border-radius: 3px; }
.bx-plano-2d .lot-swatch{ background: var(--lot); }
.bx-plano-2d .green-swatch{ background: var(--grass); }
.bx-plano-2d .water-swatch{ background: var(--water); }
.bx-plano-2d .selected-swatch{ background: rgba(230,57,70,.48); border-color: var(--selected) !important; }
.bx-plano-2d .toast{ position: absolute; top: 14px; left: 50%; z-index: 30; display: none; margin: 0; padding: 8px 14px; color: white; background: var(--green-900); border-radius: 9px; box-shadow: 0 3px 12px rgba(0,0,0,.25); font-size: 12px; font-weight: 700; transform: translateX(-50%); }
.bx-plano-2d .toast.visible{ display: block; }
.bx-plano-2d .lot-card{ position: absolute; right: 14px; bottom: 14px; z-index: 11; width: min(360px, calc(100% - 28px)); color: var(--ink); background: white; border-radius: 11px; box-shadow: 0 8px 28px rgba(21,41,28,.24); }
.bx-plano-2d .empty-card{ min-height: 66px; display: flex; align-items: center; gap: 12px; padding: 12px 14px; }
.bx-plano-2d .selection-mark{ width: 23px; height: 23px; flex: 0 0 23px; border: 4px double var(--highlight); transform: rotate(45deg); }
.bx-plano-2d .empty-card strong{ font-size: 13px; }
.bx-plano-2d .empty-card p{ margin: 2px 0 0; color: var(--muted); font-size: 10.5px; line-height: 1.35; }
.bx-plano-2d .selected-card{ padding: 14px; }
.bx-plano-2d .card-heading{ display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.bx-plano-2d .eyebrow{ margin: 0 0 3px; color: var(--green-500); font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.bx-plano-2d .card-heading h2{ margin: 0; font-size: 28px; line-height: 1; }
.bx-plano-2d #close-card{ width: 31px; height: 31px; padding: 0; color: var(--ink); background: var(--green-100); border: 0; border-radius: 8px; font-size: 21px; }
.bx-plano-2d .selected-card dl{ display: grid; gap: 1px; margin: 12px 0 0; overflow: hidden; background: var(--line); border-radius: 9px; }
.bx-plano-2d .selected-card dl > div{ min-width: 0; display: grid; grid-template-columns: 105px minmax(0,1fr); gap: 10px; padding: 8px 10px; background: var(--green-100); }
.bx-plano-2d .selected-card dt{ color: var(--green-700); font-size: 10px; font-weight: 700; }
.bx-plano-2d .selected-card dd{ min-width: 0; margin: 0; font-size: 10px; font-weight: 800; overflow-wrap: anywhere; text-align: right; }
.bx-plano-2d .selected-card dd strong{ font-size: 16px; }
.bx-plano-2d #facts-panel{ width: 320px; flex: 0 0 320px; display: flex; flex-direction: column; justify-content: space-between; background: white; border-left: 1px solid var(--line); }
.bx-plano-2d #facts-panel section{ padding: 18px; }
.bx-plano-2d #facts-panel h2{ margin: 0; font-size: 15px; line-height: 1.3; }
.bx-plano-2d #facts-panel h2 strong{ font-size: 28px; }
.bx-plano-2d .last-updated{ margin: 5px 0 0; color: var(--muted); font-size: 9px; font-weight: 700; }
.bx-plano-2d .facts{ display: grid; gap: 1px; margin: 16px 0 0; overflow: hidden; background: var(--line); border-radius: 11px; }
.bx-plano-2d .facts > div{ min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; padding: 9px 11px; background: var(--green-100); }
.bx-plano-2d .facts dt{ color: var(--green-700); font-size: 10.5px; font-weight: 700; }
.bx-plano-2d .facts dd{ margin: 0; font-size: 10.5px; font-weight: 800; text-align: right; }
.bx-plano-2d #facts-panel footer{ padding: 13px 18px; color: var(--muted); border-top: 1px solid var(--line); font-size: 9.5px; font-weight: 600; line-height: 1.5; }
.bx-plano-2d #facts-panel footer p{ margin: 0 0 5px; }
.bx-plano-2d .topbar{ gap: 8px; padding-inline: 12px; }
.bx-plano-2d .logo{ width: 33px; height: 33px; flex-basis: 33px; }
.bx-plano-2d .identity h1{ max-width: 145px; font-size: 13px; }
.bx-plano-2d .identity p{ font-size: 9px; }
.bx-plano-2d .view-link{ padding: 8px 10px; font-size: 11px; }
.bx-plano-2d .searchbox{ position: absolute; top: 100%; left: 0; right: 0; z-index: 21; padding: 0 12px 9px; background: var(--green-900); }
.bx-plano-2d .searchbox input, .bx-plano-2d .searchbox input:focus{ width: 100%; }
.bx-plano-2d #main{ padding-top: 45px; }
.bx-plano-2d #facts-panel{ position: absolute; left: 8px; right: 8px; bottom: 8px; z-index: 12; width: auto; max-height: 38px; overflow: hidden; border: 0; border-radius: 11px; box-shadow: 0 4px 18px rgba(0,0,0,.22); transition: max-height .18s; }
.bx-plano-2d #facts-panel.open{ max-height: min(62vh, 520px); overflow-y: auto; }
.bx-plano-2d #facts-panel section{ padding: 11px 13px 13px; }
.bx-plano-2d #facts-panel section::before{ content: "Datos y fuentes"; display: block; cursor: pointer; font-size: 11px; font-weight: 800; line-height: 17px; text-transform: uppercase; letter-spacing: .08em; }
.bx-plano-2d #facts-panel section::after{ content: "+"; position: absolute; top: 9px; right: 14px; font-weight: 800; }
.bx-plano-2d #facts-panel.open section::after{ content: "−"; }
.bx-plano-2d #facts-panel .last-updated{ position: absolute; top: 11px; right: 38px; margin: 0; font-size: 8px; }
.bx-plano-2d #facts-panel .eyebrow{ margin-top: 13px; }
.bx-plano-2d .legend{ left: 61px; top: 14px; bottom: auto; max-width: calc(100% - 75px); }
.bx-plano-2d .lot-card{ left: 8px; right: 8px; bottom: 53px; width: auto; }
.bx-plano-2d .empty-card{ min-height: 58px; padding-block: 10px; }
.bx-plano-2d *, .bx-plano-2d *::before, .bx-plano-2d *::after{ scroll-behavior: auto !important; transition: none !important; }