:root{--eco-lng:#dc7411;--eco-ng:#277da6;--eco-cng:#177b47;--eco-bog:#8851a9}.ecosystem-preview{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:35px;align-items:center;padding-block:45px;border-bottom:1px solid var(--line)}.eco-preview-image img{display:block;width:100%;height:auto;border-radius:15px}.ecosystem-preview h2{font-size:clamp(1.8rem,3vw,2.8rem)}.eco-sequence{color:var(--lime)!important;font-size:14px!important}.eco-viewer{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;min-width:0}.eco-toolbar,.eco-zoom-controls,.eco-flow-buttons,.eco-tour-controls{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.eco-toolbar{padding:16px;justify-content:space-between;border-bottom:1px solid var(--line);background:#f4f7ef}.eco-viewer button{font:14px/1.5 Arial,Tahoma,sans-serif;border:1px solid #adc3b1;color:var(--ink);background:#fff;border-radius:7px;padding:9px 12px;cursor:pointer;min-height:42px}.eco-viewer button:disabled{opacity:.5;cursor:not-allowed}.eco-viewer button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#e0f3c8}.eco-flow-buttons{padding:15px 16px 5px}.eco-flow-buttons button{font-size:12px;display:flex;align-items:center;gap:7px}.eco-flow-buttons i{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0}.eco-flow-description{padding:8px 18px 14px;margin:0;font-size:13px;color:var(--muted)}.eco-viewport{height:clamp(230px,53vw,660px);overflow:auto;overscroll-behavior:contain;background:#e3eeed;direction:ltr;scroll-behavior:auto}.eco-canvas{position:relative;width:calc(100% * var(--eco-zoom,1));min-width:100%;aspect-ratio:1714/918;isolation:isolate}.eco-canvas>img{width:100%;height:auto;display:block;user-select:none}.eco-routes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.eco-routes g{fill:none;stroke-width:3;filter:drop-shadow(0 1px 1px white)}.eco-routes g path{vector-effect:non-scaling-stroke}.eco-routes [data-route=lng]{stroke:var(--eco-lng);marker-end:url(#eco-arrow-lng)}.eco-routes [data-route=ng]{stroke:var(--eco-ng);marker-end:url(#eco-arrow-ng)}.eco-routes [data-route=cng]{stroke:var(--eco-cng);marker-end:url(#eco-arrow-cng)}.eco-routes [data-route=bog]{stroke:var(--eco-bog);stroke-dasharray:6 5;marker-end:url(#eco-arrow-bog)}.eco-routes .road-route{stroke-dasharray:9 5}.eco-canvas.animate .eco-routes g path{stroke-dasharray:10 5;animation:eco-flow 1.3s linear infinite}.eco-hotspot{position:absolute;transform:translate(-50%,-50%);border:0!important;background:transparent!important;padding:0!important;display:flex;align-items:center;justify-content:center;min-height:40px!important;min-width:40px;z-index:2}.eco-pin{display:grid;place-items:center;width:32px;height:32px;border:2px solid white;border-radius:50%;background:#123e32;color:white;box-shadow:0 1px 7px #0007;font-size:14px;font-weight:700}.eco-hotspot[aria-pressed=true] .eco-pin{background:#d5f389;color:#092b25;outline:3px solid #123e32}.eco-hotspot-label{position:absolute;bottom:calc(100% + 3px);left:50%;transform:translateX(-50%);max-width:160px;width:max-content;white-space:normal;text-align:center;font:600 11px/1.35 Arial,Tahoma,sans-serif;background:#fafff3f2;color:#103b2d;padding:5px 8px;border-radius:5px;border:1px solid #406855;pointer-events:none}.eco-hotspot:hover,.eco-hotspot:focus-visible{z-index:5}.eco-hotspot:focus-visible{outline:3px solid #d5f389;border-radius:50%}.eco-equipment-buttons{padding:16px;display:flex;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line)}.eco-equipment-buttons button{font-size:12px}.eco-detail{padding:23px;background:#eef3e6;border-top:1px solid var(--line);min-height:185px}.eco-detail>span{font-size:12px;color:#4b6951}.eco-detail h3{margin:8px 0 12px}.eco-detail p{font-size:15px;margin:0;max-width:1050px}.eco-tour-controls{padding:16px}.eco-tour-controls p{font-size:12px;margin:0;flex-basis:100%}.eco-stage-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.eco-stage-cards .button{margin-top:20px}.eco-route-card{border-top:4px solid var(--route-color)}.eco-source-links{margin-top:25px}.eco-original{margin-top:25px;padding:20px;border:1px solid var(--line);border-radius:12px}.eco-original summary{font-weight:700;cursor:pointer}.eco-original p{margin-top:15px}.eco-original img{max-width:100%;height:auto}.eco-viewer:fullscreen{background:white;width:100%;height:100%;overflow:auto;border-radius:0}.eco-viewer:fullscreen .eco-viewport{height:60vh}#eco-expanded{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;padding:0;border:0;border-radius:0}#eco-expanded .eco-viewport{height:55vh}#eco-expanded .eco-viewer{border-radius:0}[dir=rtl] .eco-hotspot-label{direction:rtl}[dir=rtl] .eco-viewer button{font-family:Tahoma,Arial,sans-serif}#eco-zoom-label{font-size:13px;min-width:42px;text-align:center;direction:ltr}@keyframes eco-flow{to{stroke-dashoffset:-30}}@media(max-width:1000px){.eco-stage-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.eco-hotspot-label{font-size:10px;max-width:125px}.eco-routes g{stroke-width:2}}@media(max-width:720px){.ecosystem-preview,.eco-stage-cards{grid-template-columns:1fr}.ecosystem-preview{gap:23px;padding-block:30px}.eco-hotspot-label{display:none}.eco-hotspot:focus .eco-hotspot-label{display:block}.eco-pin{width:26px;height:26px;font-size:12px}.eco-toolbar{padding:10px;gap:8px}.eco-viewer button{font-size:12px;padding:8px 10px}.eco-flow-buttons{padding:10px}.eco-flow-buttons button{font-size:11px}.eco-equipment-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:10px}.eco-equipment-buttons button{text-align:start;font-size:11px}.eco-detail{padding:18px}.eco-detail p{font-size:14px}.eco-tour-controls{padding:12px}.eco-flow-description{font-size:12px;padding-inline:12px}.eco-routes g{stroke-width:2}.eco-original{padding:15px}}@media(prefers-reduced-motion:reduce){.eco-canvas.animate .eco-routes g path{animation:none}}@media print{.eco-toolbar,.eco-flow-buttons,.eco-tour-controls,.eco-equipment-buttons,.eco-stage-cards button{display:none}.eco-viewport{height:auto;overflow:visible}.eco-canvas{width:100%!important}.eco-stage-cards{grid-template-columns:1fr}.eco-hotspot-label{display:none}}
/* Detailed atlas: stable numbering, searchable key and optional enlarged names. */
.eco-atlas-controls{display:flex;align-items:end;gap:12px;flex-wrap:wrap;padding:18px;background:#f2f6ed}.eco-atlas-controls label{display:grid;gap:6px;font-size:13px;flex:1;min-width:180px}.eco-atlas-controls input,.eco-atlas-controls select{width:100%;padding:12px;border:1px solid #9ab49e;border-radius:7px;background:white;font:inherit}.eco-atlas-controls .button{font-size:12px}.eco-hotspot-label{display:none}.eco-hotspot:hover .eco-hotspot-label,.eco-hotspot:focus-visible .eco-hotspot-label,.show-names .eco-hotspot-label{display:block}.eco-canvas{min-width:1000px}.eco-pin{width:27px;height:27px;font-size:12px}.eco-equipment-buttons{max-height:290px;overflow:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.eco-equipment-buttons button{text-align:start}.eco-viewer [hidden],.eco-stage-cards [hidden]{display:none!important}.show-names .eco-hotspot-label{max-width:145px;font-size:11px}.eco-stage-cards .card{scroll-margin-top:170px}@media(max-width:720px){.eco-equipment-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}.eco-atlas-controls{padding:12px}.eco-atlas-controls label{min-width:100%;}.eco-atlas-controls a{max-width:100%;white-space:normal}.eco-viewport{height:420px}}