:root{--navy:#0b3558;--blue:#1268a8;--blue-dark:#0d568b;--text:#172536;--muted:#687a8d;--line:#d7e1e8;--panel:rgba(255,255,255,.965);--bg:#e5edf2;--success:#087a55;--danger:#b42318;--warning:#9a6700;--shadow:0 14px 42px rgba(14,35,53,.19)}
*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--bg)}button,input,select{font:inherit}button{cursor:pointer}code{background:#edf2f6;padding:2px 5px;border-radius:5px}
#map{position:absolute;inset:0;overflow:hidden;background:#e5ebef;cursor:grab;touch-action:none}#map.dragging{cursor:grabbing}#tiles,#grid-canvas,#drag-box{position:absolute;inset:0}#tiles{overflow:hidden;pointer-events:none}.map-tile{position:absolute;width:256px;height:256px;user-select:none;-webkit-user-drag:none}.map-tile.failed{background:#e8eef2;border:1px solid #dce5eb}#grid-canvas{width:100%;height:100%;pointer-events:none}#drag-box{display:none;inset:auto;border:2px solid #0879c5;background:rgba(8,121,197,.16);pointer-events:none;z-index:6}.map-message{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;color:#617386;z-index:3}.map-message strong{font-size:16px;color:#30475a}.map-message span{font-size:11px;max-width:340px}
.panel{position:absolute;z-index:20;background:var(--panel);border:1px solid rgba(187,201,212,.92);border-radius:15px;box-shadow:var(--shadow);backdrop-filter:blur(9px)}.sidebar{left:14px;top:14px;width:380px;max-height:calc(100vh - 28px);overflow:auto}.brand{display:grid;grid-template-columns:46px 1fr auto;gap:10px;align-items:center;padding:14px 15px 12px;border-bottom:1px solid var(--line)}.brand-logo{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:#fff;font-size:12px;font-weight:900;letter-spacing:.08em;background:linear-gradient(145deg,#0a3458,#1472b5)}.brand h1{font-size:17px;margin:0}.brand p{font-size:10.5px;color:var(--muted);margin:3px 0 0}.pill{font-size:9px;font-weight:850;letter-spacing:.08em;padding:5px 7px;border-radius:999px}.pill.success{color:#066044;background:#ddf5e9}.pill.error{color:#8d1d16;background:#fde7e4}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;padding:11px 13px;border-bottom:1px solid var(--line)}.metric{border:1px solid #e0e8ee;background:#f8fafb;border-radius:10px;padding:8px 7px}.metric strong{display:block;font-size:13px;white-space:nowrap}.metric span{font-size:8.8px;color:var(--muted)}.section{padding:12px 14px;border-bottom:1px solid var(--line)}.section:last-child{border-bottom:0}.section.compact{padding-bottom:14px}.section-title-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.section-title-row h2,.csv-header h2{font-size:13.5px;margin:2px 0 0}.eyebrow{font-size:9.2px;text-transform:uppercase;letter-spacing:.1em;font-weight:850;color:var(--muted)}
button{border:1px solid #bccbd6;background:#f8fafc;color:#263a4d;border-radius:8px;padding:7px 9px;font-size:10.8px}button:hover{background:#edf4f8}button.primary{background:var(--blue);border-color:var(--blue);color:#fff}button.primary:hover{background:var(--blue-dark)}button.wide{width:100%;margin-top:10px;padding:9px}.icon-button{width:30px;height:30px;padding:0;border-radius:9px;font-size:15px}.text-danger{border:0;background:transparent;color:var(--danger);padding:2px 4px}
input[type=text],input[type=number],select{width:100%;min-width:0;border:1px solid #c4d0da;background:#fff;color:var(--text);border-radius:8px;padding:7px 8px;font-size:11.2px}.search-grid{display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:7px}.status{min-height:15px;margin-top:6px;font-size:10px;line-height:1.4;color:var(--muted)}.status.ok{color:var(--success)}.status.error{color:var(--danger)}
.layers-section{padding-bottom:9px}.layer-tools{display:grid;grid-template-columns:1fr auto auto;gap:5px;margin:8px 0}.region-list{max-height:330px;overflow:auto;padding-right:2px}.region-group{border:1px solid #dde6ec;border-radius:10px;background:#fff;margin-bottom:6px;overflow:hidden}.region-summary{display:grid;grid-template-columns:auto 10px 1fr auto auto;gap:7px;align-items:center;padding:7px 8px;cursor:pointer;list-style:none}.region-summary::-webkit-details-marker{display:none}.region-summary .swatch{width:10px;height:10px;border-radius:3px}.region-summary strong{font-size:11.5px}.region-summary span.meta{font-size:9px;color:var(--muted)}.region-count{font-size:9.5px;color:var(--muted)}.region-chevron{font-size:11px;color:#7b8b99;transition:transform .15s}.region-group[open] .region-chevron{transform:rotate(90deg)}.municipality-list{border-top:1px solid #e5ebef;padding:4px 6px 6px}.municipality-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:7px;align-items:center;padding:5px 3px;border-radius:7px}.municipality-row:hover{background:#f4f8fa}.municipality-row strong{font-size:10.5px}.municipality-row span{font-size:8.8px;color:var(--muted)}.municipality-row .load-dot{width:7px;height:7px;border-radius:50%;background:#c5d0d8}.municipality-row .load-dot.loaded{background:#0b9c6c}.mini-button{width:24px;height:24px;padding:0;border-radius:7px;font-size:11px}
.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:7px}.control-grid label,.form-grid label{display:flex;flex-direction:column;gap:4px;font-size:9.5px;color:var(--muted)}.range-line{display:grid;grid-template-columns:1fr 33px;align-items:center;gap:5px}.range-line span{font-size:9px;color:var(--muted)}.switch-line{display:flex;align-items:center;gap:7px;margin-top:9px;font-size:9.8px;color:var(--muted)}
.toolbar{left:408px;top:14px;padding:6px;display:flex;gap:5px}.toolbar button{width:34px;height:34px;padding:0;font-size:15px}.toolbar button.active{background:#dcecf7;border-color:#66a0c6;color:#0c588d}.toolbar .divider{width:1px;background:#d8e1e7;margin:3px 1px}
.csv-panel{right:14px;top:14px;width:425px;max-height:calc(100vh - 28px);overflow:auto;transition:width .18s ease}.csv-panel.collapsed{width:58px;overflow:hidden}.csv-panel.collapsed .csv-header{padding:10px}.csv-panel.collapsed .csv-header>div,.csv-panel.collapsed #csv-content{display:none}.csv-header{display:flex;align-items:center;justify-content:space-between;padding:14px 15px 11px;border-bottom:1px solid var(--line)}.selection-banner{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:#edf6fb;border-bottom:1px solid #d4e7f2}.selection-banner div{display:flex;align-items:baseline;gap:7px}.selection-banner strong{font-size:18px;color:#0c5d95}.selection-banner span{font-size:9.8px;color:#587184}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.csv-preview-section{padding-bottom:10px}.table-wrap{max-height:205px;overflow:auto;border:1px solid #dde6ec;border-radius:8px;margin-top:8px}table{width:100%;border-collapse:collapse;background:#fff;font-size:10px}th,td{padding:6px 7px;border-bottom:1px solid #e7edf1;text-align:left;white-space:nowrap}th{position:sticky;top:0;background:#f2f6f8;color:#53687a;font-size:9px;z-index:1}.muted{color:var(--muted);text-align:center}.export-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.file-button,.secondary-link{display:block;border:1px solid #bccbd6;background:#f8fafc;color:#263a4d;border-radius:8px;padding:7px 9px;font-size:10.5px;text-align:center;text-decoration:none;cursor:pointer}.file-button input{display:none}.export-grid p{grid-column:1/-1;margin:3px 0 0;font-size:9px;line-height:1.4;color:var(--muted)}
.cell-popup{left:408px;top:62px;width:290px;padding:11px;display:none}.cell-popup h3{font-size:14px;margin:0 0 7px}.cell-popup table{font-size:10.5px}.cell-popup td:first-child{color:var(--muted)}.coordinates{left:408px;bottom:14px;padding:7px 9px;font-size:9.5px;font-variant-numeric:tabular-nums}.attribution{position:absolute;right:450px;bottom:14px;z-index:15;background:rgba(255,255,255,.86);border-radius:6px;padding:4px 7px;color:#596b7b;font-size:8.8px}.loading-indicator{position:absolute;z-index:30;left:50%;top:15px;transform:translateX(-50%);display:none;align-items:center;gap:7px;background:rgba(11,53,88,.92);color:white;padding:7px 10px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.18);font-size:9.8px}.loading-indicator span{width:12px;height:12px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#toast{position:absolute;z-index:100;left:50%;bottom:24px;transform:translateX(-50%);background:#172c3d;color:#fff;border-radius:9px;padding:9px 13px;font-size:10.5px;opacity:0;pointer-events:none;transition:opacity .18s}#toast.show{opacity:1}
dialog{width:min(590px,calc(100vw - 32px));border:1px solid #cbd8e1;border-radius:15px;padding:0;color:var(--text);box-shadow:0 24px 80px rgba(0,0,0,.3)}dialog::backdrop{background:rgba(8,24,38,.45);backdrop-filter:blur(3px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid var(--line)}.dialog-head h2{font-size:15px;margin:0}.dialog-body{padding:14px 16px 18px}.dialog-body h3{font-size:12px;margin:13px 0 4px}.dialog-body h3:first-child{margin-top:0}.dialog-body p{font-size:10.8px;line-height:1.55;color:#526679;margin:0}
@media(max-width:1050px){.csv-panel{width:365px}.attribution{right:390px}.sidebar{width:350px}.toolbar,.cell-popup,.coordinates{left:378px}}
@media(max-width:780px){.sidebar{left:10px;top:10px;width:calc(100vw - 20px);max-height:43vh}.toolbar{left:10px;top:auto;bottom:10px}.csv-panel{right:10px;top:auto;bottom:10px;width:calc(100vw - 20px);max-height:42vh}.coordinates,.attribution{display:none}.cell-popup{left:10px;top:45vh}.metric-grid{grid-template-columns:repeat(4,1fr)}}