:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#1b302c;background:#f3f6f2;font-synthesis:none;--ink:#183b32;--muted:#70817b;--line:#e4ebe7;--green:#16785b;--lime:#bde5a2;--surface:#fff}*{box-sizing:border-box}body{margin:0;min-width:320px}button,select,input{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #80bdf4;outline-offset:3px}.shell{margin:0 auto;max-width:1920px}.topbar{background:#142c2b;color:#fff;min-height:76px;padding:14px clamp(18px,3vw,50px);display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{display:flex;gap:12px;align-items:center}.brand-mark{display:grid;place-items:center;width:46px;height:46px;flex-shrink:0;border-radius:12px;background:#254f45;color:#c0eaaa}.brand-mark svg{width:33px;height:33px}.brand-eyebrow{display:block;font-size:10px;letter-spacing:.19em;font-weight:780;color:#a3cbbd;margin-bottom:3px}.brand-title{display:block;font-size:19px;font-weight:760;letter-spacing:-.035em}.brand-title em{font-style:normal;color:#bce5a0}.top-actions{display:flex;align-items:center;gap:22px}.scope-chip{display:flex;align-items:center;gap:8px;border:1px solid #45615c;border-radius:99px;padding:9px 13px;color:#d5e7e0;font-size:12px;font-weight:600}.small-dot,.status-dot{display:inline-block;width:7px;height:7px;background:#9cda88;border-radius:100%;flex-shrink:0}.header-link{font-size:12px;font-weight:650;color:#edf6f1}.header-link span{margin-left:5px;color:#a9d1bd}.intro{position:relative;overflow:hidden;min-height:172px;background:linear-gradient(108deg,#1d483a,#1d5745 62%,#346b56);color:#f9fbf8;padding:29px clamp(20px,3vw,50px);display:flex;justify-content:space-between;align-items:center}.intro-text{position:relative;z-index:1}.overline,.section-caption{font-size:10px;letter-spacing:.16em;font-weight:800;color:#669884}.overline{color:#b7e6c4}.intro h1{font-size:clamp(23px,2.5vw,34px);line-height:1.19;letter-spacing:-.04em;margin:10px 0}.intro h1 span{color:#c7e8a7}.intro p{font-size:13px;color:#d3e7dc;max-width:640px;margin:0;line-height:1.6}.intro-graphic{position:absolute;width:390px;height:250px;right:7%;top:-35px;opacity:.72}.ring{position:absolute;border:1px solid rgba(218,255,207,.35);border-radius:50%;transform:rotate(-20deg)}.ring-a{inset:20px 60px}.ring-b{inset:5px 30px}.ring-c{inset:-18px 0}.graphic-label{position:absolute;top:48%;left:45%;font-size:10px;letter-spacing:.22em;color:#d6fbd6}.kpis{padding:17px clamp(16px,3vw,42px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.kpi{background:#fff;border:1px solid var(--line);border-radius:13px;padding:17px 18px;display:flex;align-items:center;gap:14px;box-shadow:0 2px 11px #1b3b2a08;min-width:0}.kpi-icon{width:40px;height:40px;background:#e9f4ec;color:#318969;font-size:21px;border-radius:11px;display:grid;place-items:center;flex-shrink:0}.kpi-label{font-size:11px;color:#657e74;font-weight:700;display:block}.kpi strong{font-size:23px;display:block;letter-spacing:-.04em;margin:3px 0 1px}.kpi-sub{font-size:10px;color:#85948e}.workbench{display:grid;grid-template-columns:295px minmax(370px,1fr) 282px;gap:13px;padding:0 clamp(16px,3vw,42px) 22px;align-items:stretch}.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:19px 18px;box-shadow:0 2px 11px #203b2b07;min-width:0}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:23px}.panel-heading h2{font-size:17px;letter-spacing:-.035em;margin:5px 0 0}.panel-heading-icon{font-size:19px;color:#95afa2}.control-group{margin:0 0 24px}.control-label{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;font-size:12px;font-weight:760}.control-label strong{color:var(--green);font-size:13px}.tag{font-size:10px;letter-spacing:0;color:#7c9186;background:#f0f5f1;border-radius:5px;padding:5px 7px;white-space:nowrap;font-weight:650}.segmented{background:#f1f6f2;border-radius:8px;display:grid;grid-template-columns:repeat(auto-fit,minmax(74px,1fr));padding:4px;gap:3px}.seg{border:0;background:transparent;color:#667d72;font-weight:690;font-size:12px;border-radius:6px;padding:10px 6px}.seg.active{background:#fff;color:#146444;box-shadow:0 1px 7px #1b34231c}.select{border:1px solid #d8e5dc;border-radius:8px;width:100%;height:41px;background:#fff;padding:0 10px;color:#284b3a;font-weight:650;font-size:12px}.control-note{color:#88978f;font-size:11px;line-height:1.55;margin:9px 0 0}.range-label,.legend-labels{display:flex;justify-content:space-between;color:#889990;font-size:10px;margin-top:7px}.divider{height:1px;background:#e8edea;margin:7px 0 22px}input[type=range]{width:100%;accent-color:#218660;cursor:pointer;margin:3px 0}.layer-toggle{display:flex;align-items:center;justify-content:space-between;padding:6px 0 13px;gap:5px;cursor:pointer}.toggle-label{display:flex;align-items:center;gap:10px}.toggle-label b,.toggle-label small{display:block}.toggle-label b{font-size:12px;font-weight:710}.toggle-label small{font-size:10px;color:#82958b;margin-top:3px}.layer-symbol{display:block;width:21px;height:21px;border-radius:5px;flex-shrink:0}.symbol-raster{background:linear-gradient(135deg,#d4ecae,#77b988,#2c765c)}.symbol-polygon{background:#d5e8f5;border:2px solid #377ea1}.symbol-change{background:#ffe0ab;border:2px dashed #d28522}.layer-toggle input{position:absolute;opacity:0;width:1px;height:1px}.switch{display:block;background:#dfe9e2;width:34px;height:19px;border-radius:99px;position:relative;transition:background .15s;flex-shrink:0}.switch:after{position:absolute;top:3px;left:3px;content:"";width:13px;height:13px;border-radius:100%;background:#fff;box-shadow:0 1px 3px #0002;transition:transform .15s}.layer-toggle input:checked+.switch{background:#23825c}.layer-toggle input:checked+.switch:after{transform:translateX(15px)}.layer-toggle input:focus-visible+.switch{outline:3px solid #80bdf4}.opacity-group{margin-top:16px}.legend-bar{height:11px;border-radius:5px;background:linear-gradient(90deg,#f4deb7,#e9bf77 27%,#a9d18e 58%,#5da986 78%,#175d47)}.action{width:100%;border-radius:8px;padding:11px 8px;border:1px solid #dbe9df;font-size:12px;font-weight:760;margin-top:9px}.action span{margin-right:7px;font-size:17px}.action.primary{background:#167458;border-color:#167458;color:#fff}.action.primary:hover{background:#0f5943}.action.secondary{background:#fff;color:#31614a}.action.secondary:hover{background:#f3f8f4}.map-column{display:flex;min-width:0;flex-direction:column;border:1px solid var(--line);background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 11px #203b2b07}.map-toolbar{height:72px;padding:13px 19px;display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid var(--line)}.map-toolbar-text b{display:block;font-size:14px;letter-spacing:-.02em;margin-top:4px}.base-switch{display:flex;gap:4px;background:#f2f5f2;padding:4px;border-radius:8px}.base{background:transparent;border:0;padding:8px 11px;border-radius:6px;font-size:11px;font-weight:750;color:#75857f}.base.active{background:#fff;color:#126c4e;box-shadow:0 1px 5px #123b2b13}#map-container{position:relative;min-height:630px;flex:1}#map{position:absolute;inset:0}.map-top-left{position:absolute;top:13px;left:13px;z-index:2;pointer-events:none}.demo-flag{display:inline-flex;align-items:center;gap:7px;border-radius:8px;color:#784916;background:#fff9e9;padding:8px 11px;box-shadow:0 2px 9px #16271e21;font-size:10px;letter-spacing:.035em;font-weight:850;border:1px solid #f1dfac}.demo-flag span{font-size:11px;color:#d38b35}.map-bottom-left,.map-bottom-right{position:absolute;bottom:21px;z-index:2;pointer-events:none}.map-bottom-left{left:12px}.map-bottom-right{right:13px}.map-coordinate{background:#fffffff0;box-shadow:0 1px 5px #1b3e3120;border-radius:6px;padding:7px 10px;color:#476053;font-size:10px;font-weight:680;display:inline-block}.map-bottom-right button{pointer-events:auto;border:0;background:#fff;box-shadow:0 1px 7px #1b3e3125;border-radius:7px;padding:9px 11px;font-size:10px;color:#426a54;font-weight:700}.map-alert{position:absolute;top:61px;left:14px;right:14px;border-radius:8px;background:#fff7e6;border:1px solid #eacb80;z-index:10;color:#775c2b;padding:12px;font-size:12px;line-height:1.5}.map-alert[hidden]{display:none}.map-footer{display:flex;justify-content:space-between;gap:10px;align-items:center;border-top:1px solid #e6ede7;padding:11px 15px;background:#fff;color:#84938a;font-size:10px}.map-footer>span:first-child{display:flex;align-items:center;gap:7px}.status-dot{background:#44ac77}.right-panel .panel-heading{margin-bottom:16px}.insight-highlight{background:#e9f4ed;border:1px solid #d9e9dc;border-radius:11px;padding:16px 16px 14px;color:#285f47}.insight-label{display:block;font-size:10px;font-weight:780;color:#6a967b;letter-spacing:.08em}.insight-highlight strong{display:block;font-size:37px;letter-spacing:-.06em;margin:6px 0 0}.insight-highlight>span:last-of-type{font-size:11px;color:#628b75}.mini-track{margin-top:14px;border-radius:9px;height:6px;background:#d1e7d5;overflow:hidden}.mini-track span{display:block;width:0;height:100%;background:#27905f;border-radius:9px;transition:width .15s}.distribution{margin:23px 0}.distribution-bars{display:grid;gap:11px}.dist-row{display:grid;grid-template-columns:59px 1fr 24px;gap:7px;align-items:center;font-size:10px;color:#6f8377}.dist-row .bar-track{height:9px;border-radius:5px;background:#edf2ed;overflow:hidden}.dist-row .bar-fill{height:100%;background:#64aa81;border-radius:5px}.dist-row strong{font-size:10px;text-align:right;color:#66776f}.feature-card h3{font-size:15px;letter-spacing:-.02em;margin:14px 0 5px}.feature-card>p{font-size:11px;line-height:1.5;color:#84918a;margin:0 0 12px}.feature-attributes{display:grid;gap:8px}.attribute{display:flex;justify-content:space-between;gap:10px;font-size:11px}.attribute span{color:#82928a}.attribute b{text-align:right;font-weight:720;max-width:65%;overflow-wrap:anywhere}.empty-selection{padding:18px 8px;border:1px dashed #d9e3dd;border-radius:8px;text-align:center;font-size:11px;color:#829189}.metadata-card dl{display:grid;grid-template-columns:1fr auto;gap:11px 8px;margin:15px 0 6px;font-size:11px}.metadata-card dt{color:#85958b}.metadata-card dd{margin:0;color:#355246;font-weight:700;text-align:right}.info-note{background:#f7f9f7;border:1px solid #e9ede8;border-radius:9px;padding:12px;display:flex;gap:8px;align-items:flex-start;margin-top:24px}.info-note span{color:#547f6b;font-weight:800}.info-note p{color:#71877a;line-height:1.55;font-size:11px;margin:0}.footer{padding:0 clamp(16px,3vw,42px) 23px;display:flex;justify-content:space-between;align-items:center;color:#819289;font-size:10px;gap:15px}.footer a{color:#367e61;text-decoration:underline}@media(min-width:1450px){.workbench{grid-template-columns:315px minmax(500px,1fr) 300px}#map-container{min-height:700px}}@media(max-width:1100px){.workbench{grid-template-columns:280px minmax(350px,1fr)}.right-panel{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}.right-panel>.panel-heading{grid-column:1/-1;margin-bottom:0}.right-panel>.divider{display:none}.right-panel>.info-note{grid-column:1/-1;margin-top:0}.distribution{margin:0}.right-panel .feature-card{min-width:0}#map-container{min-height:680px}}@media(max-width:720px){.topbar{min-height:68px;padding:12px 16px}.scope-chip,.header-link{display:none}.intro{padding:25px 17px;min-height:166px}.intro-graphic{right:-180px}.intro p{max-width:375px}.kpis{grid-template-columns:repeat(2,minmax(0,1fr));padding:11px;gap:9px}.kpi{padding:12px 9px;gap:7px}.kpi-icon{height:30px;width:30px;font-size:16px}.kpi strong{font-size:19px}.kpi-sub{font-size:9px}.workbench{display:flex;flex-direction:column;padding:0 10px 16px;gap:10px}.left-panel{order:1}.map-column{order:2}.right-panel{order:3;display:block}.right-panel>.panel-heading{margin-bottom:17px}.right-panel>.divider{display:block}.right-panel .distribution{margin:23px 0}#map-container{min-height:490px}.map-toolbar{height:64px;padding:8px 12px}.map-toolbar-text b{font-size:12px}.footer{padding:0 14px 22px;display:block;line-height:2}.demo-flag{font-size:9px}.map-bottom-right{bottom:50px}.maplibregl-ctrl-bottom-right{bottom:5px!important}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* SAIIL branding */
.brand-logo {
  display: block;
  width: auto;
  height: 46px;
  max-width: 150px;
  object-fit: contain;
  background: #fff;
  border-radius: 8px;
  padding: 5px;
}

@media (max-width: 720px) {
  .brand-logo {
    height: 38px;
    max-width: 90px;
  }
  .brand-title {
    font-size: 15px;
  }
}