<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 192">
  <defs>
    <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0%" stop-color="#0d1a20"/>
      <stop offset="100%" stop-color="#0f2830"/>
    </linearGradient>
    <linearGradient id="hub" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0%" stop-color="#0c7a71"/>
      <stop offset="100%" stop-color="#0a6860"/>
    </linearGradient>
    <linearGradient id="glow" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0%" stop-color="#5eead4"/>
      <stop offset="100%" stop-color="#2dd4bf"/>
    </linearGradient>
  </defs>
  <!-- Background -->
  <rect width="192" height="192" rx="36" fill="url(#bg)"/>
  <!-- Hub body -->
  <rect x="32" y="52" width="128" height="88" rx="18" fill="url(#hub)"/>
  <!-- Hub face plate -->
  <rect x="44" y="64" width="104" height="64" rx="12" fill="#0a5c55" opacity="0.6"/>
  <!-- Centre button / display ring -->
  <circle cx="96" cy="96" r="24" fill="#0d1a20" opacity="0.7"/>
  <circle cx="96" cy="96" r="18" fill="url(#glow)" opacity="0.9"/>
  <circle cx="96" cy="96" r="11" fill="#0d1a20"/>
  <circle cx="96" cy="96" r="6"  fill="url(#glow)"/>
  <!-- Port dots -->
  <rect x="50" y="70" width="14" height="14" rx="4" fill="#0d1a20" opacity="0.7"/>
  <rect x="50" y="108" width="14" height="14" rx="4" fill="#0d1a20" opacity="0.7"/>
  <rect x="128" y="70" width="14" height="14" rx="4" fill="#0d1a20" opacity="0.7"/>
  <rect x="128" y="108" width="14" height="14" rx="4" fill="#0d1a20" opacity="0.7"/>
  <!-- USB port at bottom -->
  <rect x="82" y="140" width="28" height="8" rx="3" fill="#0a5c55"/>
  <!-- BLE arc -->
  <path d="M 72 30 A 34 34 0 0 1 120 30" stroke="#5eead4" stroke-width="3" fill="none" stroke-linecap="round" opacity="0.6"/>
  <path d="M 80 22 A 24 24 0 0 1 112 22" stroke="#5eead4" stroke-width="2" fill="none" stroke-linecap="round" opacity="0.4"/>
</svg>
