Ubuntu – Gnome Lock Screen Terminology

It is somewhat understood from the gdm3.css style sheet that

1. the one that shows when the system is boot up -->> login screen

2. the one that shows when the system is locked automatically or manually and where the 3 swipe up arrows are visible -->> lock screen

3. the one that is visible after swipe up -->> unlock screen

the file /usr/share/gnome-shell/theme/ubuntu.css is the style sheet for 18.04 by default.. and some of it's contents are

    /* TOP BAR */
#panel {
  background-color: rgba(0, 0, 0, 0.2);
  /* transition from solid to transparent */
  transition-duration: 500ms;
  font-weight: bold;
  height: 1.86em; }
  #panel.unlock-screen, #panel.login-screen, #panel.lock-screen {
    background-color: transparent; }

when the contents are changed like this

    /* our unlock screen isn't fully transparent */
#panel.unlock-screen {
  background-color: red;
}

#panel.login-screen{
  background-color: cyan;
}

#panel.lock-screen {
  background-color: yellow;
}

Panel Color on Lock Screen is Yellow (attached .gif cant show the colors exactly)
Panel Color on Unlock Screen is Red
Panel Color on Login Screen is Cyan (poor camera quality to show cyan color exactly)