Using breakpoints.yml defined media queries in libraries.yml

I understand breakpoints are being used by the Responsive image features, but when I first started theming I was incredibly confused as to how to use the breakpoints I defined in my breakpoints.yml file in my libraries.yml file.

I setup a basic "normal" breakpoint with a media query:

MYTHEME.global:
  label: global
  mediaQuery: ''
  weight: 0
  multipliers:
    - 1x
MYTHEME.normal:
  label: normal
  mediaQuery: 'all and (min-width: 980px) and (min-device-width: 980px)'
  weight: 2
  multipliers:
    - 1x

Now in my libraries.yml I want to include a CSS file only for the "MYTHEME.normal" breakpoint. Why can't I do something like this?

global-styles:
  version: VERSION
  css:
    component:
      css/component/mobile_menu.css: {}
      css/component/mobile_menu_normal.css: {media: '@breakpoint:normal'}

Instead, I am forced to hard code the media query for every CSS file I want. This to me COMPLETELY defeats the purpose of standardizing breakpoints in one place in the first place, if I have to hard code them. Especially if we are going to call them "breakpoints".