gui.styl

body 
  overflow hidden

header
  display flex
  align-items baseline
  position absolute
  left 0 
  top 0 
  right 0 
  height 50px
  z-index 99
  background #5c6bc0 
  color #fff
  border-bottom #333
  box-shadow 0 2px 3px #aaa
  padding 10px 20px 0 20px
  box-sizing border-box
  user-select none
  h1 
    color #fff
  i 
    margin-right 20px
    font-size 22px !important
    cursor pointer

#controls
  position absolute
  right 10px
  bottom 45px

.control 
  background #333
  width 36px
  height 36px
  border-radius 18px
  display flex
  color #fff
  justify-content center
  align-items center
  margin-top 8px
  transition all 0.3s ease
  box-shadow 0 2px 2px #888
  &:hover
    background #6557D2
    cursor pointer
  
#status
  position absolute
  left 0
  right 0
  bottom 0
  height 30px
  padding 0 20px 0 20px
  background #f0f0f0
  box-shadow 0px -2px 6px #ccc
  z-index 900
  display flex
  flex-direction row
  justify-content flex-end
  align-items center
  font-size 80%
  input 
    width 40px
    margin-left 10px
    padding-top 1px
    padding-bottom 1px
    border solid 1px #aaa
    text-align right
  div
    cursor pointer
    padding 0 5px 0 5px
  .icon 
    cursor pointer
    fill #666
    &:hover
      fill #000