@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

@font-face {
  font-family: "Noto Sans";
  src: url('/fonts/NotoSans.ttf') format('truetype');
  font-weight: 100 900;
  font-display: swap;
}
:root{--bg:#09111d;--panel:#101b2a;--panel2:#132033;--line:#1e2c40;--text:#edf3fb;--muted:#8b9bb0;--muted2:#60738b;--orange:#ff784f;--blue:#4da3ff;--violet:#a78bfa;--green:#40d6a0;--radius:15px;color-scheme:dark;
  --sidebar: #0c1624;
  --header: #0b1522;
  --nav-text: #92a2b6;
  --nav-active: #18283c;
  --nav-current: #fff;
  --live-bg: #101d2d;
  --avatar-bg: #263b54;
  --avatar-text: #c9d8e9;
  --status-line: #235342;
  --status-text: #74dcb3;
  --status-bg: #123026;
  --control: #142237;
  --control-text: #dbe6f2;
  --control-hover: #1b2c42;
  --control-line: #354b66;
  --control-hover-line: #526984;
  --detail-text: #d5e1ee;
  --metric-start: #132033;
  --metric-end: #101a29;
  --secondary-text: #9eafc2;
  --orange-tint: #42251f;
  --blue-tint: #172f4a;
  --violet-tint: #30264a;
  --green-tint: #173b34;
  --link: #ff987c;
  --field-bg: #0c1725;
  --separator: #1b2a3d;
  --map-bg: #101c2b;
  --info-bg: #15263a;
  --info-line: #263d56;
  --table-heading: #0d1826;
  --table-hover: #15253a;
  --modis-color: #ff9b7d;
  --modis-bg: #42271f;
  --viirs-color: #81bcff;
  --viirs-bg: #1a3550;
  --high-color: #72ddb4;
  --high-bg: #15392f;
  --med-color: #f2c46c;
  --med-bg: #3b321d;
  --low-color: #a9b5c4;
  --low-bg: #273344;
  --bar-track: #1e2d41;
  --warning-text: #b6a47b;
  --warning-bg: #2c281d;
  --warning-line: #4a402a;
  --toast-bg: #1d3046;
  --toast-line: #3b5572;
  --toast-text: #eaf3fc;
  --popup-bg: #142338;
  --month-bg: #101d2e;
  --month-note: #bed0e5;
  --month-text: #eaf2fb;
}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;font-size:14px}button,input,select{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh}.sidebar{width:245px;position:fixed;inset:0 auto 0 0;background:var(--sidebar);border-right:1px solid var(--line);padding:25px 17px;display:flex;flex-direction:column;z-index:1000}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--text);padding:2px 7px 37px}.brand-mark{width:38px;height:38px;border-radius:11px;background:linear-gradient(145deg,#ff9a55,#f04e35);display:grid;place-items:center;font:800 23px Manrope;color:#fff;box-shadow:0 7px 22px #f15d3933}.brand b{font:800 15px Manrope;letter-spacing:1.4px;display:block}.brand small{font-size:9px;letter-spacing:1.6px;color:var(--muted);display:block;margin-top:3px}.side-label,.eyebrow{font-size:9px;letter-spacing:1.7px;color:var(--muted2);font-weight:700}.side-label{padding:0 10px 12px}.sidebar nav{display:grid;gap:5px}.nav-item{background:transparent;border:0;color:var(--nav-text);text-align:left;padding:12px 13px;border-radius:9px;font-weight:600;display:flex;align-items:center;gap:13px}.nav-item i{font-style:normal;font-size:18px;width:18px;text-align:center}.nav-item:hover,.nav-item.active{background:var(--nav-active);color:var(--nav-current)}.nav-item.active{box-shadow:inset 3px 0 var(--orange)}.sidebar-bottom{margin-top:auto}.live-card{padding:13px;border:1px solid var(--line);border-radius:11px;background:var(--live-bg);margin-bottom:18px}.live-card b{font-size:12px}.live-card small{display:block;color:var(--muted);font-size:10px;margin:6px 0 0 17px}.live-dot,.status-pill i{display:inline-block;width:7px;height:7px;background:var(--green);border-radius:50%;margin-right:8px;box-shadow:0 0 10px #40d6a0}.user-mini{display:flex;gap:10px;align-items:center;padding:10px 3px;border-top:1px solid var(--line)}.avatar{width:32px;height:32px;border-radius:50%;background:var(--avatar-bg);color:var(--avatar-text);display:grid;place-items:center;font-size:10px;font-weight:700}.user-mini b,.user-mini small{display:block}.user-mini b{font-size:11px}.user-mini small{font-size:10px;color:var(--muted);margin-top:3px}.main{margin-left:245px;min-height:100vh}.topbar{height:83px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;background:var(--header)}.top-left{display:flex;align-items:center;gap:12px}.topbar h1{font:700 20px Manrope;margin:4px 0 0}.top-actions{display:flex;align-items:center;gap:15px}.utc{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.status-pill,.data-tag{font-size:9px;letter-spacing:1px;border:1px solid var(--status-line);color:var(--status-text);background:var(--status-bg);padding:7px 9px;border-radius:30px}.btn{border:1px solid var(--line);padding:9px 13px;border-radius:8px;color:var(--control-text);background:var(--control);font-weight:600;font-size:11px}.btn:hover,.small-btn:hover{border-color:var(--control-hover-line);background:var(--control-hover)}.btn-primary{background:var(--orange);border-color:var(--orange);color:#fff}.btn-primary:hover{background:#ff8c68}.btn-quiet{background:var(--control)}.mobile-menu{display:none}.content{padding:27px 34px 50px;max-width:1600px;margin:auto}.page{display:none}.page.active{display:block}.welcome-row,.page-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:23px}.welcome-row h2,.page-intro h2{font:800 23px Manrope;margin:7px 0 6px;letter-spacing:-.6px}.welcome-row p,.page-intro p{margin:0;color:var(--muted);font-size:12px}.update-meta{color:var(--muted);font-size:10px}.update-meta b{display:block;color:var(--detail-text);font-size:11px;margin-top:5px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:25px}.metric{background:linear-gradient(145deg,var(--metric-start),var(--metric-end));border:1px solid var(--line);border-radius:var(--radius);padding:16px 17px;min-height:118px}.metric-top{display:flex;justify-content:space-between;align-items:center;color:var(--secondary-text);font-size:11px}.metric-icon{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-size:15px}.orange{color:var(--orange);background:var(--orange-tint)}.blue{color:var(--blue);background:var(--blue-tint)}.violet{color:var(--violet);background:var(--violet-tint)}.green{color:var(--green);background:var(--green-tint)}.metric strong{font:800 27px Manrope;display:block;margin:7px 0 2px;font-variant-numeric:tabular-nums}.metric small{font-size:10px;color:var(--muted2)}.section-head,.panel-head{display:flex;justify-content:space-between;align-items:center;gap:15px}.section-head{margin-bottom:12px}.section-head h3,.panel-head h3,.panel h3{font:700 14px Manrope;margin:0 0 4px}.section-head p,.panel-head p{font-size:10px;color:var(--muted);margin:0}.text-btn{border:0;background:transparent;color:var(--link);font-size:10px;font-weight:700}.map-card,.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.map-toolbar{min-height:48px;padding:9px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line)}.map-legend,.map-tools{display:flex;align-items:center;gap:14px}.map-legend span{font-size:10px;color:var(--secondary-text)}.dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:5px}.dot.modis{background:var(--orange);box-shadow:0 0 8px #ff784f99}.dot.viirs{background:var(--blue);box-shadow:0 0 8px #4da3ff99}.map-tools select,.filter-field select,.filter-field input{background:var(--field-bg);color:var(--control-text);border:1px solid var(--control-line);border-radius:7px;padding:8px 10px;font-size:10px;outline:none}.small-btn{border:1px solid var(--control-line);background:var(--control);color:var(--control-text);padding:7px 10px;border-radius:7px;font-size:10px}.map{height:340px;width:100%;background:var(--map-bg)}.map-full{height:min(67vh,680px);min-height:420px}.map-footer{display:flex;justify-content:space-between;gap:12px;padding:9px 14px;color:var(--muted2);font-size:9px;border-top:1px solid var(--line)}.bottom-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:14px;margin-top:15px}.panel{padding:16px}.recent-list{margin-top:13px}.recent-row{display:grid;grid-template-columns:8px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--separator)}.recent-row .pin{width:7px;height:7px;border-radius:50%}.recent-row b{font-size:11px;font-weight:600}.recent-row small{display:block;font-size:9px;color:var(--muted);margin-top:4px}.recent-row strong{font-size:10px;color:var(--detail-text)}.source-health{margin-top:14px}.health-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--separator);font-size:10px}.health-row small{display:block;color:var(--muted);margin-top:4px}.health-status{font-size:9px;color:var(--green)}.note-box{font-size:9px;line-height:1.6;color:var(--secondary-text);background:var(--info-bg);border:1px solid var(--info-line);padding:10px;border-radius:8px;margin-top:13px}.empty-state{text-align:center;color:var(--muted);padding:25px 10px;font-size:11px}.page-intro{align-items:center}.map-large-card{margin-bottom:14px}.wrap-toolbar{flex-wrap:wrap}.selected-card{padding:15px;background:var(--panel);border:1px solid var(--line);border-radius:12px}.hidden{display:none!important}.selected-card h3{margin:0 0 9px;font:700 13px Manrope}.selected-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.selected-grid span{display:block;color:var(--muted);font-size:9px}.selected-grid b{display:block;margin-top:4px;font-size:11px}.filters{display:flex;align-items:flex-end;gap:12px;margin-bottom:14px;padding:13px}.filter-field{display:grid;gap:6px;min-width:145px}.filter-field label{font-size:9px;color:var(--muted)}.filter-field input{min-width:190px}.search-field{flex:1}.filter-reset{height:33px}.table-panel{padding:0}.table-top,.table-bottom{display:flex;justify-content:space-between;align-items:center;padding:12px 15px;color:var(--muted);font-size:10px}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;color:var(--muted);font-size:9px;letter-spacing:.4px;font-weight:600;background:var(--table-heading);padding:12px 14px}td{padding:12px 14px;border-top:1px solid var(--separator);font-size:10px;color:var(--detail-text)}tbody tr:hover{background:var(--table-hover)}.sensor-tag,.confidence-tag{display:inline-block;border-radius:20px;padding:4px 7px;font-size:9px}.sensor-tag.modis{color:var(--modis-color);background:var(--modis-bg)}.sensor-tag.viirs{color:var(--viirs-color);background:var(--viirs-bg)}.confidence-tag.high{color:var(--high-color);background:var(--high-bg)}.confidence-tag.medium{color:var(--med-color);background:var(--med-bg)}.confidence-tag.low{color:var(--low-color);background:var(--low-bg)}.row-action{background:transparent;border:0;color:var(--modis-color)}.analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:15px 0}.bar-chart{padding:20px 4px 6px}.bar-line{display:grid;grid-template-columns:90px 1fr 40px;gap:10px;align-items:center;margin:14px 0;font-size:10px;color:var(--secondary-text)}.bar-track{height:8px;background:var(--bar-track);border-radius:8px;overflow:hidden}.bar-fill{height:100%;border-radius:8px;background:linear-gradient(90deg,#ff784f,#ffb15b)}.bar-fill.blue-fill{background:linear-gradient(90deg,#347fc6,#69b8ff)}.bar-line b{text-align:right;color:var(--text)}.insight-panel{line-height:1.65;color:var(--secondary-text);font-size:11px}.insight-panel h3{color:var(--text);margin-bottom:9px}.insight-panel p{margin:7px 0}.source-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.source-card{padding:19px}.source-logo{width:55px;height:34px;border-radius:8px;background:#233a55;color:#fff;display:grid;place-items:center;font:800 13px Manrope;margin-bottom:15px}.modis-logo{color:#ffb08f;background:#43281f}.viirs-logo{color:#8fc4ff;background:#1b3550}.earth-logo{color:#8ce2c1;background:#193b34}.source-card h3{font-size:15px}.source-card p{font-size:11px;line-height:1.6;color:var(--secondary-text);min-height:53px}.source-meta{font-size:9px;color:var(--muted);margin:12px 0}.source-card a{font-size:10px;color:var(--link);text-decoration:none;font-weight:700}.disclaimer{font-size:10px;line-height:1.6;color:var(--warning-text);background:var(--warning-bg);border:1px solid var(--warning-line);border-radius:10px;padding:13px;margin-top:14px}.toast{position:fixed;bottom:22px;right:24px;background:var(--toast-bg);border:1px solid var(--toast-line);color:var(--toast-text);padding:12px 16px;border-radius:9px;font-size:11px;opacity:0;transform:translateY(10px);transition:.2s;pointer-events:none;z-index:3000;max-width:min(420px,90vw)}.toast.show{opacity:1;transform:translateY(0)}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--popup-bg);color:var(--text)}.leaflet-popup-content{font:11px 'DM Sans',sans-serif;line-height:1.6}.leaflet-container a{color:var(--link)}.leaflet-control-attribution{font-size:8px!important}.leaflet-control-zoom a{background:var(--popup-bg)!important;color:var(--control-text)!important;border-color:var(--control-line)!important}.mobile-menu{border:1px solid var(--line);background:var(--control);color:var(--control-text);border-radius:7px;padding:7px 10px}
@media(max-width:1100px){.sidebar{width:210px}.main{margin-left:210px}.content{padding:23px}.topbar{padding:0 23px}.metric-grid{gap:10px}.filters{flex-wrap:wrap}.search-field{min-width:100%}}
@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.2s;width:250px;box-shadow:15px 0 40px #0006}.sidebar.open{transform:translateX(0)}.main{margin-left:0}.topbar{height:70px;padding:0 15px}.mobile-menu{display:block}.topbar h1{font-size:17px}.top-actions{gap:7px}.top-actions .btn span,.utc{display:none}.content{padding:20px 14px 35px}.welcome-row h2,.page-intro h2{font-size:19px}.welcome-row{align-items:flex-start}.update-meta{max-width:100px;text-align:right;line-height:1.5}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.metric{padding:13px;min-height:105px}.metric strong{font-size:23px}.bottom-grid,.analytics-grid,.source-cards{grid-template-columns:1fr}.map{height:310px}.map-full{height:58vh;min-height:370px}.map-toolbar{align-items:flex-start;flex-direction:column}.map-tools{gap:7px;flex-wrap:wrap}.map-footer{font-size:8px}.selected-grid{grid-template-columns:repeat(2,1fr)}.filters{align-items:stretch}.filter-field{flex:1;min-width:calc(50% - 8px)}.filter-field input{min-width:0;width:100%}.search-field{min-width:100%}.filter-reset{align-self:flex-end}.page-intro{align-items:flex-start}.page-intro>.btn{white-space:nowrap}.status-pill{display:none}.source-card p{min-height:0}}
.pilot-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 12px;
  padding: 16px;
  margin-bottom: 20px;
}
.pilot-filters label, .dataset-field, .calendar-year {
  display: grid;
  gap: 5px;
  color: var(--muted, #9aaec5);
  font-size: .82rem;
}
.pilot-filters input, .pilot-filters select, .calendar-year select {
  font: inherit;
  color: var(--text);
  background: var(--month-bg);
  border: 1px solid var(--control-line);
  border-radius: 8px;
  min-height: 38px;
  padding: 6px 10px;
}
.pilot-filters p {
  flex-basis: 100%;
  margin: 0;
  color: var(--muted, #9aaec5);
  font-size: .82rem;
}
.pilot-filters [hidden], #downloadCalendar[hidden] { display: none; }
#countryField { min-width: 0; max-width: min(250px,100%); }
#countrySelect, #countryField .select-trigger { width: 100%; min-width: 0; text-overflow: ellipsis; }
#countryField { width: min(250px,100%); }
.country-picker:not([hidden]) { display: flex; flex-direction: column; gap: 5px; overflow: hidden; }
.country-picker input {
  width: 100%;
  flex: none;
  min-height: 36px;
  padding: 7px 10px;
  margin: 0;
  background: var(--control);
  color: var(--text);
  border: 1px solid var(--control-line);
  border-radius: 8px;
}
.country-options { min-height: 0; overflow-y: auto; position: relative; }
.country-options .select-option { white-space: normal; }
.country-empty { padding: 10px; color: var(--muted); }
.popup-location { margin-top: 6px; color: var(--muted); overflow-wrap: anywhere; }
.popup-location-credit { font-size: 9px; color: var(--link); }
.selected-location { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line); }
.selected-location span { display: block; color: var(--muted); font-size: 11px; }
.selected-location b { display: inline-block; margin-top: 4px; overflow-wrap: anywhere; }
.selected-location a { color: var(--link); font-size: 10px; margin-left: 6px; }
.bar-fill { width: 100%; transform-origin: left; }

html[lang="tg"] :is(body,button,input,select, h1,h2,h3,.brand b,.brand-mark,.metric strong,.source-logo,
  .leaflet-popup-content,.maplibregl-popup .maplibregl-popup-content),
[lang="tg"].select-option, [lang="tg"].select-value { font-family: "Noto Sans", sans-serif; }

.sidebar-toggle {
  display: none;
  place-items: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 1px solid var(--control-line);
  border-radius: 8px;
  background: var(--control);
  color: var(--control-text);
}
.sidebar-toggle:hover { background: var(--nav-active); color: var(--nav-current); }
.sidebar-toggle span {
  width: 7px;
  height: 7px;
  border: solid currentColor;
  border-width: 0 0 2px 2px;
  transform: translateX(1px) rotate(45deg);
}

@media (min-width: 761px) {
  .sidebar-transition .sidebar {
    transition: width 300ms cubic-bezier(.22,.7,.25,1), padding-inline 300ms cubic-bezier(.22,.7,.25,1),
      background-color 210ms ease, color 210ms ease, border-color 210ms ease, box-shadow 210ms ease;
  }
  .sidebar-transition .main { transition: margin-left 300ms cubic-bezier(.22,.7,.25,1); }
  .sidebar .brand { padding-right: 31px; }
  .sidebar .brand > span:not(.brand-mark) { min-width: 0; }
  .sidebar .brand-mark { flex-shrink: 0; }
  .sidebar .brand small { letter-spacing: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sidebar-toggle { display: grid; position: absolute; top: 31px; right: 12px; }
  .sidebar-collapsed .sidebar { width: 68px; padding-inline: 10px; }
  .sidebar-collapsed .main { margin-left: 68px; }
  .sidebar-collapsed .sidebar .brand { justify-content: center; padding: 0 0 14px; }
  .sidebar-collapsed .sidebar-toggle { position: static; align-self: center; margin-bottom: 16px; }
  .sidebar-collapsed .sidebar-toggle span { transform: translateX(-1px) rotate(225deg); }
  .sidebar-collapsed .brand > span:not(.brand-mark),
  .sidebar-collapsed .side-label,
  .sidebar-collapsed .nav-item > span,
  .sidebar-collapsed .sidebar-bottom { display: none; }
  .sidebar-collapsed .nav-item { justify-content: center; padding-inline: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .sidebar-transition .sidebar, .sidebar-transition .main { transition: none; }
}
.month-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  gap: 12px;
}
.month-cell {
  text-align: left;
  display: grid;
  gap: 7px;
  color: var(--month-text);
  min-height: 126px;
  padding: 14px;
  border: 1px solid var(--control-line);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(226, 105, 46, calc(var(--activity) * .52)), var(--month-bg));
  cursor: pointer;
}
.month-cell span { font-size: 1.45rem; }
.month-cell small { color: var(--month-note); }
.month-cell:hover:not(:disabled) { border-color: #ffaa79; }
.month-cell:focus-visible { outline: 2px solid #55b4ff; outline-offset: 2px; }
.month-cell:disabled { opacity: .48; cursor: default; }
.calendar-note, .area-summary { color: var(--muted, #9aaec5); margin: 14px 0; font-size: .9rem; }

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #eff3f8;
  --panel: #ffffff;
  --panel2: #f7faff;
  --line: #d3deeb;
  --text: #172941;
  --muted: #4f647e;
  --muted2: #526781;
  --orange: #b54224;
  --blue: #2165ab;
  --violet: #6545a8;
  --green: #177050;
  --sidebar: #ffffff;
  --header: #ffffff;
  --nav-text: #43566f;
  --nav-active: #e9eef7;
  --nav-current: #14263e;
  --live-bg: #f0f5fb;
  --avatar-bg: #dde8f5;
  --avatar-text: #344f6d;
  --status-line: #bbdccd;
  --status-text: #205e4a;
  --status-bg: #e4f4ed;
  --control: #f4f7fb;
  --control-text: #172e47;
  --control-hover: #e8eff8;
  --control-line: #b7c6d7;
  --control-hover-line: #869ab2;
  --detail-text: #2a435d;
  --metric-start: #ffffff;
  --metric-end: #f7faff;
  --secondary-text: #405674;
  --orange-tint: #fff0e8;
  --blue-tint: #e7f2ff;
  --violet-tint: #f1ebff;
  --green-tint: #e4f4ec;
  --link: #9a381b;
  --field-bg: #ffffff;
  --separator: #dfe7f0;
  --map-bg: #dce6ed;
  --info-bg: #eaf2fd;
  --info-line: #cbdcf2;
  --table-heading: #edf3fb;
  --table-hover: #f0f5fb;
  --modis-color: #9a381b;
  --modis-bg: #ffece3;
  --viirs-color: #17558b;
  --viirs-bg: #e3f0fe;
  --high-color: #225c49;
  --high-bg: #e2f4ec;
  --med-color: #724d12;
  --med-bg: #fff3d9;
  --low-color: #475970;
  --low-bg: #e9edf3;
  --bar-track: #e3eaf3;
  --warning-text: #6a4e20;
  --warning-bg: #fff7e9;
  --warning-line: #ebd9b9;
  --toast-bg: #f3f7fc;
  --toast-line: #9db2ca;
  --toast-text: #18324c;
  --popup-bg: #ffffff;
  --month-bg: #ffffff;
  --month-note: #405674;
  --month-text: #172941;
}

.display-preferences {
  display: flex;
  align-items: center;
  gap: 8px;
}

.language-select, .theme-toggle, .select-trigger {
  min-height: 36px;
  color: var(--control-text);
  background: var(--control);
  border: 1px solid var(--control-line);
  border-radius: 8px;
}

.language-select { padding: 0 7px; max-width: 105px; }

.theme-toggle {
  --theme-slot: 26px;
  position: relative;
  isolation: isolate;
  padding: 3px;
  display: grid;
  grid-template-columns: repeat(2, var(--theme-slot));
  align-items: center;
  gap: 2px;
}

.theme-toggle span {
  display: grid;
  place-items: center;
  min-height: 26px;
  border-radius: 5px;
  line-height: 1;
}

.theme-toggle::before {
  content: "";
  position: absolute;
  inset: 3px auto 3px 3px;
  width: var(--theme-slot);
  border-radius: 5px;
  z-index: -1;
  background: var(--nav-active);
  box-shadow: 0 1px 4px #0002;
  transition: transform 230ms cubic-bezier(.2,.75,.35,1), background-color 210ms ease;
}

.theme-toggle[aria-checked="true"]::before {
  transform: translateX(calc(var(--theme-slot) + 2px));
}

.theme-toggle[aria-checked="false"] span:first-child,
.theme-toggle[aria-checked="true"] span:last-child {
  color: var(--nav-current);
}

:root[data-theme="light"] .brand-mark { color: #fff; }
:root[data-theme="light"] .btn-primary:hover { background: #96351f; }
:root[data-theme="light"] .source-logo { color: #fff; }
:root[data-theme="light"] .modis-logo { background: #99452b; }
:root[data-theme="light"] .viirs-logo { background: #275e90; }
:root[data-theme="light"] .earth-logo { background: #2c6b58; }
:root[data-theme="light"] .sidebar { box-shadow: 0 4px 20px #243c5b22; }
:root[data-theme="dark"] .leaflet-control-attribution { background: var(--popup-bg); color: var(--text); }

@media (max-width: 900px) {
  .top-actions { gap: 7px; }
  .top-actions .status-pill { display: none; }
}
@media (max-width: 760px) {
  .topbar { gap: 8px; padding-inline: 12px; }
  .top-left { min-width: 0; gap: 8px; }
  .top-left .eyebrow { display: none; }
  .topbar h1 { overflow-wrap: anywhere; line-height: 1.15; }
  .display-preferences { gap: 5px; }
  .language-select { max-width: 92px; }
}
@media (max-width: 420px) {
  .topbar h1 { font-size: 14px; }
  .top-actions .btn { padding: 7px; }
  .theme-toggle { --theme-slot: 20px; }
}

.select-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
  padding: 6px 11px;
  text-align: start;
  font-size: .82rem;
}

.select-trigger::after {
  content: "";
  flex: 0 0 6px;
  height: 6px;
  border: solid currentColor;
  border-width: 0 1.5px 1.5px 0;
  opacity: .7;
  transform: translateY(-2px) rotate(45deg);
  transition: transform 160ms ease;
}

.select-trigger[aria-expanded="true"]::after {
  transform: translateY(1px) rotate(225deg);
}

.select-value {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dataset-field { min-width: 0; max-width: 100%; }
#languageSelect + .select-trigger { min-width: 94px; }
.select-trigger:is(:hover, [aria-expanded="true"]) { border-color: var(--control-hover-line); background: var(--control-hover); }
.select-trigger:disabled { opacity: .6; cursor: default; }
.select-trigger:focus-visible, .theme-toggle:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }

.select-options {
  --select-offset: -6px;
  position: fixed;
  z-index: 3200;
  width: max-content;
  max-width: calc(100vw - 20px);
  padding: 5px;
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid var(--control-line);
  border-radius: 11px;
  background: var(--panel);
  color: var(--text);
  box-shadow: 0 12px 28px #07142440, 0 2px 6px #07142424;
  animation: select-reveal 150ms cubic-bezier(.2,.7,.3,1) both;
}

.select-options[hidden] { display: none; }
.select-options[data-side="above"] { --select-offset: 6px; }

.select-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 13px;
  padding: 8px 10px;
  min-height: 35px;
  border-radius: 7px;
  font-size: .82rem;
  line-height: 1.3;
  cursor: pointer;
}

.select-option[aria-selected="true"] { color: var(--link); font-weight: 700; }
.select-option[aria-selected="true"]::after { content: "✓"; }
.select-option.is-active, .select-option:hover { background: var(--control-hover); }

@keyframes select-reveal {
  from { opacity: 0; transform: translateY(var(--select-offset)); }
  to { opacity: 1; transform: translateY(0); }
}

.theme-transitions :is(body, .sidebar, .topbar, .panel, .map-card, .map, .month-cell,
  .nav-item, .btn, .small-btn, .select-trigger, .select-options, .select-option, .toast,
  .note-box, .disclaimer, .leaflet-popup-content-wrapper, .leaflet-popup-tip, th, td, input) {
  transition: background-color 210ms ease, color 210ms ease, border-color 210ms ease, box-shadow 210ms ease;
}

@media (min-width: 761px) and (prefers-reduced-motion: no-preference) {
  .theme-transitions.sidebar-transition .sidebar {
    transition: width 300ms cubic-bezier(.22,.7,.25,1), padding-inline 300ms cubic-bezier(.22,.7,.25,1),
      background-color 210ms ease, color 210ms ease, border-color 210ms ease, box-shadow 210ms ease;
  }
}

/* Keep gradient overlays constant so the background underneath can interpolate. */
.metric {
  background: linear-gradient(145deg, transparent, #8198b710), var(--panel);
}
.month-cell {
  background: linear-gradient(145deg, rgba(226, 105, 46, calc(var(--activity) * .52)), transparent), var(--month-bg);
}
.theme-transitions .metric {
  transition: background-color 210ms ease, color 210ms ease, border-color 210ms ease;
}

@media (max-width: 420px) {
  #languageSelect + .select-trigger { min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .select-options { animation: none; }
  .theme-toggle::before, .select-trigger::after, .theme-transitions *, .toast, .sidebar {
    transition-duration: 0s;
  }
}

.health-row { gap: 12px; }
.health-result { text-align: end; }
.health-status, .health-empty {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.health-empty { display: flex; justify-content: center; }
.health-status[data-status="checking"], .health-status[data-status="sourceWaiting"] { color: var(--muted); }
.health-status[data-status="sourceRefreshFailed"] { color: var(--warning-text); }
.health-status[data-status="sourceUnavailable"] { color: var(--orange); }
.health-spinner {
  width: 11px;
  height: 11px;
  flex: none;
  border: 1.5px solid var(--line);
  border-top-color: var(--blue);
  border-inline-end-color: var(--blue);
  border-radius: 50%;
}
@media (prefers-reduced-motion: no-preference) {
  .health-spinner { animation: health-spin 680ms linear infinite; }
}
@keyframes health-spin { to { transform: rotate(1turn); } }

.table-pagination {
  display: flex;
  align-items: center;
  gap: 12px;
}
.table-pagination .small-btn { min-width: 34px; }

.history-map-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-bottom: 12px;
  padding: 9px 12px;
  color: var(--secondary-text);
  font-size: 12px;
}
.history-map-banner[hidden] { display: none; }