game-width = 640px

body
  background: #444 url('../img/blackorchid.png')

.game
  bottom: 0
  color: #fff
  left: 0
  margin: auto
  position: absolute
  right: 0
  top: 0
  width: game-width

  ul
    padding: 10px
    background: #000
    border: 0
    height: 75px
    margin-top: 5px
    list-style: none
    width: game-width - @padding * 2
    overflow-y: scroll
    font: 1.4em monospace

    li
      list-style: none

    li.red
      color: FF0000

    li.green
      color: 00FF00

  .canvas-wrap
    position: relative

    .win, .lose
      background: rgba(0, 0, 0, 0.7)
      display: none
      font-size: 2em
      height: 100%
      position: absolute
      text-align: center
      top: 0
      width: 100%

      .inner
        margin: 150px 50px

        p
          margin-bottom: 20px


game-width = 640px

body
  background: #444 url('../img/blackorchid.png')

.game
  bottom: 0
  color: #fff
  left: 0
  margin: auto
  position: absolute
  right: 0
  top: 0
  width: game-width

  ul
    padding: 10px
    background: #000
    border: 0
    height: 75px
    margin-top: 5px
    list-style: none
    width: game-width - @padding * 2
    overflow-y: scroll
    font: 1.4em monospace

    li
      list-style: none

      &.bad
        color: #f00
      
      &.good
        color: #0f0

  .canvas-wrap
    position: relative

    .win, .lose
      background: rgba(0, 0, 0, 0.7)
      display: none
      font-size: 2em
      height: 100%
      position: absolute
      text-align: center
      top: 0
      width: 100%

      .inner
        margin: 150px 50px

        p
          margin-bottom: 20px


Fix styling of good and bad messages.
Fix styling of good and bad messages.