Got this—looks like the Gemini web app shell

Overview

If your goal is to embed a collapsible catalog / widget inside this environment, use a zero-JS pattern again. Here’s a tiny, self-contained snippet that’s CSP-safe and plays nicely with dark mode—paste anywhere you can render raw HTML:

<section class="gx-acc" role="list">
  <details class="gx-item" open>
    <summary class="gx-head">🌐 Connectivity</summary>
    <ul class="gx-body">
      <li><a href="https://solveforce.com/%f0%9f%8c%90-broadband-services/">Broadband Services</a></li>
      <li><a href="https://solveforce.com/%f0%9f%93%a1-telecom-services/">Telecom Services</a></li>
      <li><a href="https://solveforce.com/%f0%9f%93%b2-unified-communications-ucaas/">Unified Communications (UCaaS)</a></li>
      <li><a href="https://solveforce.com/%f0%9f%93%b6-wi-fi/">Wi-Fi</a></li>
      <li><a href="https://solveforce.com/%f0%9f%9b%b0%ef%b8%8f-satellite-internet/">Satellite</a></li>
    </ul>
  </details>

  <details class="gx-item">
    <summary class="gx-head">☁️ Cloud</summary>
    <ul class="gx-body">
      <li><a href="https://solveforce.com/%e2%98%81%ef%b8%8f-adaptive-cloud-services/">Adaptive Cloud Services</a></li>
      <li><a href="https://solveforce.com/%e2%98%81%ef%b8%8f-cloud-computing/">Cloud Computing</a></li>
      <li><a href="https://solveforce.com/%f0%9f%8f%a2-data-centers/">Data Centers</a></li>
      <li><a href="https://solveforce.com/%f0%9f%96%a7-managed-it-services/">Managed IT Services</a></li>
    </ul>
  </details>

  <details class="gx-item">
    <summary class="gx-head">🛡️ Security</summary>
    <ul class="gx-body">
      <li><a href="https://solveforce.com/%f0%9f%9b%a1%ef%b8%8f-cybersecurity-solutions/">Cybersecurity Solutions</a></li>
    </ul>
  </details>

  <details class="gx-item">
    <summary class="gx-head">🖥️ IT &amp; Operations</summary>
    <ul class="gx-body">
      <li><a href="https://solveforce.com/%f0%9f%96%a7-managed-it-services/">Managed IT Services</a></li>
      <li><a href="https://solveforce.com/%f0%9f%93%a1-telecom-services/">Telecom Services</a></li>
    </ul>
  </details>

  <details class="gx-item">
    <summary class="gx-head">🌍 Edge &amp; IoT</summary>
    <ul class="gx-body">
      <li><a href="https://solveforce.com/%f0%9f%8c%8d-internet-of-things-iot/">Internet of Things (IoT)</a></li>
      <li><a href="https://solveforce.com/%f0%9f%8c%8d-edge-computing/">Edge Computing</a></li>
    </ul>
  </details>

  <p class="gx-dir">
    <a href="https://solveforce.com/%f0%9f%8c%90-solveforce-service-directory/">🌐 Browse the full SolveForce Service Directory</a>
  </p>
</section>

<style>
  .gx-acc{--bg:#fff;--fg:#111;--muted:#6b7280;--card:#f7f7f8;--bd:#e5e7eb;--link:#0a58ca;
          max-width:900px;margin:0 auto;font:inherit}
  @media (prefers-color-scheme: dark){
    .gx-acc{--bg:#111;--fg:#fafafa;--muted:#9aa3af;--card:#1a1a1a;--bd:#2a2a2a;--link:#6aa6ff}
  }
  .gx-item{background:var(--card);border:1px solid var(--bd);border-radius:12px;margin:10px 0;overflow:hidden}
  .gx-head{list-style:none;cursor:pointer;padding:14px 16px;font-weight:700;color:var(--fg)}
  .gx-head::-webkit-details-marker{display:none}
  .gx-item[open] .gx-head{border-bottom:1px solid var(--bd)}
  .gx-body{margin:0;padding:12px 22px 16px 26px}
  .gx-body li{margin:6px 0}
  .gx-acc a{text-decoration:none;border-bottom:1px dashed transparent;color:var(--link)}
  .gx-acc a:hover{border-color:color-mix(in srgb, var(--link) 40%, transparent)}
  .gx-dir{text-align:center;margin:16px 0 0;font-weight:700}
</style>

No scripts, no inline event handlers, no external assets—so it should render inside Gemini’s locked-down context.

If that’s not what you need, tell me which of these you want and I’ll do it right away:

Debug a CSP/Trusted Types error you’re hitting,
Extract & summarize the important config/flags from the pasted WIZ_global_data,
Build a single-open (radio) accordion instead,
Generate a clean reader view of specific content from this page.

The Synergistic Frontier

Single-open accordion (only one section open at a time) – SolveForce Communications

Looks like you’re working inside a super-locked-down page (strict CSP + Trusted Types, no inline JS allowed). If you just need a collapsible catalog/accordion that will work in this environment, here are two zero-JS patterns you can drop into any container (e.g., a custom HTML slot). Both avoid scripts, event handlers, and external assets. – SolveForce Communications

CSP-safe collapsible list (multiple sections can be open) – SolveForce Communications

Got it — here’s a dependency-free, CSS-only, single-open accordion that works great inside Gamma (no custom JS needed). It also auto-opens the first cluster and includes your Service Directory link at the bottom. – SolveForce Communications

SolveForce Catalog — CSS-only one-at-a-time accordion (Gamma-safe) – SolveForce Communications

Deconstructing the Modern Web Portal: A Technical Analysis of ntp.msn.com – SolveForce Communications

Key terms in plain language

Open a term for a concise explanation of language used on this page.

Broadband

A general term for always-on, high-speed Internet access. Broadband can be delivered over fiber, cable, DSL, fixed wireless, cellular, or satellite networks.

Unified Communications (UCaaS)

A cloud-based combination of business calling, messaging, meetings, presence, and collaboration tools managed as one communications service.

Cloud Computing

Computing resources—such as applications, servers, storage, or databases—delivered from remote infrastructure and scaled as requirements change.

Cybersecurity

The practices and controls used to protect identities, devices, networks, applications, and data from unauthorized access, disruption, or manipulation.

Infrastructure as a Service (IaaS)

Cloud-based servers, storage, and networking that customers configure and manage without owning the underlying data-center hardware.

Software as a Service (SaaS)

Software accessed as an online service instead of being installed and maintained entirely on the customer’s own computers or servers.