/* ==UserStyle==
@name           10FastFingers Hide Typed Words
@namespace      github.com/narze/userscripts
@version        0.3.2
@description    Hide typed words, make you less distrcted
@author         narze
@homepageURL    https://github.com/narze/userscripts
@updateURL      https://github.com/narze/userscripts/raw/master/userstyles/10fastfingers.user.css
@license        MIT
@preprocessor   stylus
@var            checkbox lookAheadMode "Hide next word" 0
@var            number lookAheadFadeTime "Fade time to hide next word (Milliseconds)" 500
==/UserStyle== */
@-moz-document domain("10fastfingers.com") {
  #reload-box #words span.correct {
    color: #00800022 !important;
  }

  #reload-box #words span.wrong {
    color: #FF000022 !important;
  }

  if lookAheadMode {
    #reload-box #words span.correct + span,
    #reload-box #words span.correct + span + span,
    #reload-box #words span.wrong + span,
    #reload-box #words span.wrong + span + span {
      color: rgba(153, 153, 153, 0.0);
      -webkit-animation-name: fadeOut;
      -webkit-animation-duration: lookAheadFadeTime ms;
      animation-name: fadeOut;
      animation-duration: lookAheadFadeTime ms;
    }

    #reload-box #words span.highlight + span + span,
    #reload-box #words span.highlight-wrong + span + span {
      -webkit-box-shadow:inset 0px 0px 0px 3px #5CB85C;
      -moz-box-shadow:inset 0px 0px 0px 3px #5CB85C;
      box-shadow:inset 0px 0px 0px 3px #5CB85C;
      border-radius: 5px;
    }
  }

  #reload-box #words span.highlight,
  #reload-box #words span.highlight-wrong {
    if lookAheadMode {
      background: #ffbb0066;
    }
    else {
      background: #5CB85C;
    }
  }

  @-webkit-keyframes fadeOut {
    from {
      color: black;
    }
    to {
      color: rgba(153, 153, 153, 0.0);
    }
  }

  @keyframes fadeOut {
    from {
      color: black;
    }

    to {
      color: rgba(153, 153, 153, 0.0);
    }
  }

  /* Hide timer by default */
  #timer.hide-time {
    color: white !important;
  }

  #timer:not(.hide-time) {
    color: #3c4d5c !important;
  }
}