/* Satellite project map: no continuous animation or WebGL rendering. */
.sat-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:18px; }
.sat-eyebrow { display:block; color:var(--green-d); font:600 11px/1.5 var(--sans); text-transform:uppercase; letter-spacing:.12em; margin-bottom:6px; }
.sat-title { margin:0; font:600 23px/1.3 var(--sans); color:var(--ink); }
[dir="rtl"] .sat-title { font-family:var(--sans-ar); }
[dir="rtl"] .sat-eyebrow { font-family:var(--sans-ar); letter-spacing:0; }
.sat-actions { display:flex; gap:8px; }
.sat-actions button, .sat-return { border:1px solid var(--line-3); background:#fff; color:var(--green-d); padding:10px 15px; border-radius:9px; cursor:pointer; font:600 12px/1.4 var(--sans); }
[dir="rtl"] .sat-actions button, [dir="rtl"] .sat-return { font-family:var(--sans-ar); }
.sat-actions button:hover { border-color:var(--green); background:var(--mist); }
.sat-shell { position:relative; isolation:isolate; overflow:hidden; border-radius:18px; border:1px solid rgba(14,26,23,.12); background:#243c35; }
.sat-canvas { height:640px; width:100%; z-index:0; background:#183441; font-family:var(--sans); }
.sat-map-status { position:absolute; z-index:1; inset-inline-start:14px; bottom:14px; max-width:calc(100% - 155px); background:rgba(9,27,26,.82); color:#fff; border:1px solid rgba(255,255,255,.15); border-radius:8px; padding:8px 11px; font:500 11px/1.45 var(--sans); pointer-events:none; }
[dir="rtl"] .sat-map-status { font-family:var(--sans-ar); }
.sat-canvas .leaflet-control-scale { margin-bottom:58px; margin-left:16px; }
.sat-canvas .leaflet-control-scale-line { color:white; background:rgba(9,27,26,.6); border-color:rgba(255,255,255,.8); text-shadow:none; }
.sat-canvas .leaflet-control-zoom { margin:16px; border:0; box-shadow:0 3px 15px #0003; }
.sat-canvas .leaflet-control-zoom a { width:36px; height:36px; line-height:36px; color:var(--ink); }
.sat-flag-marker { background:none; border:0; }
.sat-flag-svg { width:46px; height:48px; overflow:visible; filter:drop-shadow(0 2px 2px #0005); pointer-events:none; }
.sat-pole-rim { fill:none; stroke:#fff; stroke-width:4; stroke-linecap:round; }
.sat-pole { fill:none; stroke:#076b50; stroke-width:2; stroke-linecap:round; }
.sat-cloth { fill:#0b9a71; stroke:#fff; stroke-width:1.7; stroke-linejoin:round; }
.sat-flag-svg text { fill:#fff; font:700 13px/1 var(--sans); }
.sat-flag-marker:hover .sat-cloth, .sat-flag-marker:focus .sat-cloth, .sat-project-link:focus .sat-cloth { fill:var(--navy); }
.sat-project-link { display:block; width:46px; height:48px; }
.sat-canvas .sat-region-label, .sat-canvas .sat-project-label { background:rgba(8,27,25,.86); color:#fff; border:1px solid #ffffff38; border-radius:6px; box-shadow:0 2px 8px #0002; font:600 12px/1.4 var(--sans); padding:4px 7px; white-space:normal; max-width:230px; text-align:center; }
[dir="rtl"] .sat-canvas .sat-region-label, [dir="rtl"] .sat-canvas .sat-project-label { font-family:var(--sans-ar); direction:rtl; }
.sat-canvas .leaflet-tooltip-bottom::before { border-bottom-color:rgba(8,27,25,.86); }
.sat-canvas .leaflet-tooltip-top::before { border-top-color:rgba(8,27,25,.86); }
.sat-regions { display:flex; flex-wrap:wrap; gap:8px; padding:16px 0 0; }
.sat-regions button { display:inline-flex; align-items:center; gap:9px; background:#fff; border:1px solid var(--line-3); border-radius:9px; padding:9px 12px; color:var(--ink); font:600 12px/1.4 var(--sans); cursor:pointer; }
[dir="rtl"] .sat-regions button { font-family:var(--sans-ar); }
.sat-regions button span { display:inline-flex; min-width:21px; height:21px; align-items:center; justify-content:center; background:var(--mist); color:var(--green-d); border-radius:5px; font-family:var(--sans); }
.sat-regions button:hover { border-color:var(--green); }
.sat-regions button[aria-pressed="true"] { border-color:var(--green); background:var(--green); color:#fff; }
.sat-note { margin:12px 0 0; font:400 11px/1.5 var(--sans); color:var(--muted-3); }
[dir="rtl"] .sat-note { font-family:var(--sans-ar); }
.sat-credits { margin:7px 0 0; max-width:1050px; font:400 10px/1.55 var(--sans); color:var(--muted-3); text-align:start; }
.sat-credits a { text-decoration:underline; text-underline-offset:2px; }
.sat-return { margin-bottom:12px; }
@media(max-width:768px) {
  .sat-toolbar { align-items:flex-start; flex-direction:column; gap:12px; }
  .sat-title { font-size:21px; }
  .sat-canvas { height:520px; }
  .sat-map-status { max-width:calc(100% - 28px); font-size:10px; }
  .sat-regions { gap:6px; }
  .sat-regions button { font-size:11px; padding:8px 10px; }
  .sat-credits { font-size:9px; }
}

.sat-canvas .sat-region-label { white-space:nowrap; width:max-content; }
.sat-canvas .sat-project-label { width:max-content; }

/* Keep the names visible when nearby regions share a count flag. */
.sat-cluster-label { position:absolute; bottom:54px; left:22px; transform:translateX(-50%); display:block; width:max-content; max-width:200px; box-sizing:border-box; padding:4px 7px; border:1px solid #ffffff38; border-radius:6px; background:rgba(8,27,25,.86); color:#fff; box-shadow:0 2px 8px #0002; font:600 12px/1.4 var(--sans); white-space:normal; text-align:center; pointer-events:none; }
.sat-cluster-label::before { content:""; position:absolute; left:50%; top:100%; transform:translateX(-50%); border:6px solid transparent; border-bottom:0; border-top-color:rgba(8,27,25,.86); }
[dir="rtl"] .sat-cluster-label { font-family:var(--sans-ar); }
@media(max-width:768px) { .sat-cluster-label { max-width:150px; font-size:11px; } }

/* One separate pennant and one visible name for every project. */
.sat-individual-marker { background:none; border:0; }
.sat-project-flag { position:absolute; left:0; top:0; width:136px; padding-bottom:12px; filter:drop-shadow(0 2px 2px #0005); }
.sat-project-flag::after { content:""; position:absolute; left:0; bottom:0; height:14px; width:2px; background:#fff; border-radius:1px; pointer-events:none; }
.sat-project-flag .sat-project-link { display:block; width:auto; height:auto; padding:1.5px; background:#fff; color:#fff; text-decoration:none; clip-path:polygon(0 0,100% 0,calc(100% - 10px) 50%,100% 100%,0 100%); }
.sat-project-flag .sat-project-name { display:flex; align-items:center; justify-content:center; min-height:32px; padding:5px 14px 5px 6px; box-sizing:border-box; background:#087354; font:600 11px/1.25 var(--sans); text-align:center; white-space:normal; overflow-wrap:break-word; clip-path:polygon(0 0,100% 0,calc(100% - 10px) 50%,100% 100%,0 100%); }
[dir="rtl"] .sat-project-flag .sat-project-name { font-family:var(--sans-ar); font-size:12px; }
.sat-project-flag .sat-project-link:hover .sat-project-name, .sat-project-flag .sat-project-link:focus-visible .sat-project-name { background:var(--navy); }
.sat-project-flag .sat-project-link:focus-visible { background:#ffd77b; }
.sat-actions button, .sat-return, .sat-regions button { min-height:44px; }
.sat-canvas .leaflet-control-zoom a { width:44px; height:44px; line-height:44px; }
@media(max-width:768px) {
  .sat-project-flag { width:118px; }
  .sat-project-flag .sat-project-name { font-size:10px; min-height:32px; padding:5px 13px 5px 5px; }
  [dir="rtl"] .sat-project-flag .sat-project-name { font-size:11px; }
  .sat-actions { flex-wrap:wrap; }
  .sat-map-status { inset-inline-start:auto; inset-inline-end:12px; max-width:calc(100% - 145px); font-size:10px; }
}

/* Keep map instructions out of the floating contact button's area. */
.has-satellite > .sat-map-status { position:static; display:block; max-width:none; margin:10px 0 0; padding:0; border:0; background:none; color:var(--muted-3); font-size:12px; }

/* Explicit origins keep Leaflet's screen coordinates correct in RTL, too. */
.sat-canvas .sat-region-label { left:0; top:0; }
.sat-canvas .leaflet-control-scale-line { direction:ltr; text-align:left; }
/* The label can shift inward on phones; its pointer still follows the flag. */
.sat-cluster-label::before, .sat-canvas .sat-region-label::before { left:calc(50% + var(--sat-label-shift, 0px)); }

/* The visible stem is connected to the mapped location, never a shifted label foot. */
.sat-project-flag::after { display:none; }
.sat-location-stem { pointer-events:none; }

/* Licence credit for the ESA imagery, inside the map corner. Leaflet lists
   only the layers on screen, so over the NASA overview it is empty and hidden. */
.sat-canvas .leaflet-control-attribution { margin:0; padding:2px 7px; border-radius:6px 0 0 0; background:rgba(9,27,26,.62); color:rgba(255,255,255,.82); font:400 9px/1.5 var(--sans); direction:ltr; }
.sat-canvas .leaflet-control-attribution a { color:#fff; text-decoration:underline; text-underline-offset:2px; }
.sat-canvas .leaflet-control-attribution:empty { display:none; }
