/* Funding Landscape embed — reusable "visual island" block. Everything scoped under
 * .gc-landscape so it can drop into ANY host page (parchment hub, white SEO page) without
 * cascade bleed. Self-contained dark "Modern Jewel" theme — no body.em-page dependence.
 *
 * Multi-embed safe: all selectors are class-based + descendant-scoped to .gc-landscape, and
 * the 3 normally-fixed elements (tooltip / mobile card / loading) are position:absolute inside
 * the relative wrapper, so two landscapes on one page never share or clobber state.
 */

/* ── design tokens rehoisted from :root → the wrapper (no global leak) ── */
.gc-landscape{
  --em-forest-dk:#17171b; --em-forest:#201f25; --em-forest-mid:#2a2932; --em-sage:#584948;
  --em-sienna:#c4532b; --em-sienna-dk:#a3401f; --em-gold:#b18400; --em-navy:#4390da;
  --em-parchment:#f3f1ea; --em-parch-dim:rgba(243,241,234,.66); --em-rim:#cbb89a;
  --em-line:rgba(203,184,154,.15); --em-panel:#201f25; --em-panel-2:#1a1a1f;

  position:relative;                 /* anchor for the absolute tooltip / card / loading */
  display:block; margin:28px 0;
  background:radial-gradient(120% 120% at 50% 36%,#211f26 0%,var(--em-forest-dk) 78%);
  border:1px solid var(--em-line); border-radius:18px;
  padding:20px 20px 16px; overflow:hidden; isolation:isolate;
  color:var(--em-parchment);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.5;
}
.gc-landscape *{box-sizing:border-box}

/* header: scope title + live count */
.gc-landscape .em-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.gc-landscape .em-head__title{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(17px,2.4vw,21px);margin:0;line-height:1.15;color:var(--em-parchment)}
.gc-landscape .em-count-wrap{display:flex;align-items:baseline;gap:7px;white-space:nowrap}
.gc-landscape .em-count{font-family:Fraunces,Georgia,serif;font-weight:700;font-size:28px;line-height:1;color:var(--em-gold)}
.gc-landscape .em-count-label{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--em-rim)}

/* lens toggle row */
.gc-landscape .em-lenses{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 12px}
.gc-landscape .em-lens{min-height:34px;background:var(--em-panel-2);border:1px solid var(--em-line);color:var(--em-parch-dim);
  padding:7px 13px;border-radius:9px;cursor:pointer;font-weight:600;font-size:12.5px;font-family:inherit;transition:.14s}
.gc-landscape .em-lens:hover{border-color:var(--em-rim);color:var(--em-parchment)}
.gc-landscape .em-lens.is-active{background:var(--em-sienna);border-color:var(--em-sienna);color:#fff}
.gc-landscape .em-lens:focus-visible{outline:2px solid var(--em-gold);outline-offset:2px}

/* F15: live caption under the lens toggles — updates per lens */
.gc-landscape .em-caption{margin:-4px 0 12px;font-size:12.5px;line-height:1.4;color:var(--em-parch-dim)}
.gc-landscape .em-caption b{color:var(--em-gold);font-weight:700}

/* the viz — square, centred, max-width so it never balloons on wide hosts */
.gc-landscape .em-viz-wrap{position:relative;width:100%;max-width:520px;margin:0 auto;aspect-ratio:1/1;
  display:flex;align-items:center;justify-content:center}

/* F15: "hover/tap to explore" hint pill — overlaid on the map, auto-dismisses */
.gc-landscape .em-hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:4;
  background:rgba(11,29,20,.9);border:1px solid var(--em-line);border-radius:999px;
  padding:7px 15px;font-size:12px;font-weight:600;color:var(--em-parchment);white-space:nowrap;
  pointer-events:none;box-shadow:0 6px 22px rgba(0,0,0,.45);
  opacity:0;animation:gcHintIn .3s ease-out .15s forwards;transition:opacity .3s ease}
.gc-landscape .em-hint.is-gone{opacity:0;animation:none}
@keyframes gcHintIn{from{opacity:0;transform:translateX(-50%) translateY(6px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.gc-landscape .em-viz{width:100%;height:100%;display:block}
.gc-landscape .em-viz path{shape-rendering:geometricPrecision}

/* map footer: "coloured by" caption + legend */
.gc-landscape .em-mapfoot{padding:8px 6px 2px;text-align:center}
.gc-landscape .em-colorby{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--em-rim);margin-bottom:7px}
.gc-landscape .em-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:5px 12px}
.gc-landscape .em-leg{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--em-parch-dim)}
.gc-landscape .em-leg i{width:10px;height:10px;border-radius:2px;display:inline-block;flex:0 0 auto}

/* CTA */
.gc-landscape .em-foot{text-align:center;margin-top:12px}
.gc-landscape .em-cta{display:inline-block;text-decoration:none;background:var(--em-sienna);color:#fff;
  border-radius:11px;padding:12px 20px;font-weight:700;font-size:14px;transition:.15s}
.gc-landscape .em-cta:hover{background:var(--em-sienna-dk)}
.gc-landscape .em-cta:focus-visible{outline:2px solid var(--em-gold);outline-offset:2px}

/* rim + in-cell label halos (mirror the full map so labels read over any colour) */
.gc-landscape .em-rim{paint-order:stroke;stroke:var(--em-forest-dk);stroke-width:3.5px;stroke-linejoin:round}
.gc-landscape .em-clabel text{paint-order:stroke;stroke:rgba(8,18,12,.85);stroke-width:2.6px;stroke-linejoin:round}

/* ── tooltip: position:ABSOLUTE inside the wrapper (was fixed on the full map) ── */
.gc-landscape .em-tooltip{position:absolute;left:0;top:0;pointer-events:none;background:#0b1d14;border:1px solid var(--em-line);
  border-radius:10px;padding:9px 12px;font-size:12px;max-width:260px;opacity:0;transition:opacity .12s;z-index:6;
  box-shadow:0 10px 34px rgba(0,0,0,.55)}
.gc-landscape .em-tooltip b{display:block;font-size:12.5px;margin-bottom:3px;line-height:1.25}
.gc-landscape .em-tip-meta{display:block;color:var(--em-parch-dim);font-size:11px}
.gc-landscape .em-tip-amt{display:block;color:#8fd6ad;font-weight:600;font-size:11.5px;margin-top:3px}
.gc-landscape .em-tip-ctx{display:block;color:var(--em-rim);font-size:11px;margin-top:5px;padding-top:5px;border-top:1px solid var(--em-line)}
.gc-landscape .em-tip-ctx b{display:inline;font-size:11px;color:var(--em-parchment)}
.gc-landscape .em-tip-hint{display:block;color:var(--em-parch-dim);font-size:10.5px;margin-top:5px;opacity:.8}

/* ── mobile tap-to-view card: position:ABSOLUTE within the wrapper (bottom sheet of the island) ── */
.gc-landscape .em-mcard{position:absolute;left:12px;right:12px;bottom:12px;z-index:7;background:#0b1d14;border:1px solid var(--em-line);
  border-radius:16px;padding:16px 16px 14px;box-shadow:0 -8px 40px rgba(0,0,0,.55);
  transform:translateY(130%);transition:transform .26s cubic-bezier(.2,.8,.2,1);max-width:520px;margin:0 auto;
  opacity:0;pointer-events:none}
.gc-landscape .em-mcard.is-open{transform:translateY(0);opacity:1;pointer-events:auto}
.gc-landscape .em-mcard__x{position:absolute;top:8px;right:10px;background:none;border:0;color:var(--em-parch-dim);font-size:22px;line-height:1;cursor:pointer;min-width:36px;min-height:36px}
.gc-landscape .em-mcard__t{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:16px;line-height:1.2;padding-right:24px;color:var(--em-parchment)}
.gc-landscape .em-mcard__m{font-size:12.5px;color:var(--em-parch-dim);margin-top:3px}
.gc-landscape .em-mcard__amt{font-size:13px;color:#8fd6ad;font-weight:600;margin-top:6px}
.gc-landscape .em-mcard__ctx{display:block;font-size:12px;color:var(--em-rim);margin-top:6px}
.gc-landscape .em-mcard__ctx b{color:var(--em-parchment)}
.gc-landscape .em-mcard__go{display:inline-block;margin-top:12px;background:var(--em-sienna);color:#fff;text-decoration:none;border-radius:10px;padding:11px 16px;font-weight:700;font-size:14px}

/* ── loading veil: position:ABSOLUTE over the viz wrapper ── */
.gc-landscape .em-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;
  font-size:13px;letter-spacing:.4px;color:var(--em-rim);animation:gcLandPulse 1.6s ease-in-out infinite;pointer-events:none;z-index:5}
.gc-landscape .em-loading.is-error{animation:none;pointer-events:auto;color:var(--em-parch-dim)}
.gc-landscape .em-loading__retry{background:var(--em-sienna);color:#fff;border:0;border-radius:8px;padding:8px 14px;font:inherit;font-weight:700;cursor:pointer;min-height:36px}
@keyframes gcLandPulse{0%,100%{opacity:.45}50%{opacity:1}}

/* responsive */
@media (max-width:560px){
  .gc-landscape{padding:16px 14px 12px}
  .gc-landscape .em-count{font-size:24px}
  .gc-landscape .em-viz-wrap{max-width:100%}
}
/* coarse-pointer (touch) targets up to 44px without changing the desktop look */
@media (pointer:coarse){
  .gc-landscape .em-lens{min-height:44px}
  .gc-landscape .em-mcard__x{min-height:44px;min-width:44px}
}
@media (prefers-reduced-motion:reduce){
  .gc-landscape .em-lens,.gc-landscape .em-cta,.gc-landscape .em-mcard{transition:none}
  .gc-landscape .em-viz path{transition:none !important}
  .gc-landscape .em-loading{animation:none}
  /* F6: the per-path inline `transition` (set in the renderer) beats this media query,
     so force it off here too for cells. */
  .gc-landscape .em-cells path{transition:none !important}
  .gc-landscape .em-hint{animation:none !important;opacity:1 !important;transition:none !important}
}