/* PlanetHeartbeat: decorative FX must stay BEHIND the original 3D Earth.
 * Only the globe element's stacking order is set; WebGL appearance, Earth
 * ocean texture, camera, geometry, controls, rotation and logo are untouched.
 */
.ph-activity-canvas{
 position:absolute;inset:0;width:100%;height:100%;
 pointer-events:none;z-index:1;opacity:.68;
}
/* The renderer remains the foreground. Science pins stay above ambient art. */
.stage>#globe{z-index:2}
.ph-activity-canvas[hidden],body[data-ph-lite="on"] .ph-activity-canvas{display:none!important}
.stage>.hero,.stage>.hero-navigation,.stage>.update-meta,.stage>.solar-status,
.stage>.control-stack,.stage>.globe-tools,.stage>.globe-hint,.stage>.legend{
 z-index:3;
}
#ph-activity-toggle{
 min-height:40px;
 border:1px solid #69cbb5;
 background:linear-gradient(130deg,#1b5b55,#103b48);
 color:#e9fff8;
 box-shadow:0 0 15px #4af0c01a;
 font-weight:800;
 letter-spacing:.045em;
}
#ph-activity-toggle:hover{border-color:#b5ffe4;background:#246e61}
#ph-activity-toggle[aria-pressed="false"]{
 border-color:#6d8392;background:#152a38;color:#c8d6dd;box-shadow:none;
}
#ph-activity-toggle:focus-visible{outline:3px solid #fff5a2;outline-offset:3px}
.legend .ph-fx-explainer{
 border-color:#478f80;
 color:#c6fff2;
 background:#092f32e6;
 font-weight:700;
}
.legend .ph-fx-explainer b{color:#95dccc;font-weight:750}
@media(max-width:850px){
 .ph-activity-canvas{opacity:.50}
 #ph-activity-toggle{min-height:40px;padding:8px 10px}
 .legend .ph-fx-explainer{font-size:8px}
}
@media(max-width:430px){
 #ph-activity-toggle{min-height:40px;font-size:9px;padding:7px 9px}
 .legend .ph-fx-explainer{padding:7px 8px}
}
@media(prefers-reduced-motion:reduce){
 .ph-activity-canvas{opacity:.55}
 #ph-activity-toggle{transition:none!important}
}

/* A three-column shell leaves the globe stage narrow between 851–980px.
   Keep the FX toggle and native globe buttons entirely above the source legend. */
@media(min-width:851px) and (max-width:980px){
 .stage>.globe-tools{bottom:176px}
}