h2

  & > span
    color: #787878

  a.root
    font-weight: bold

table.task-list

  [data-id="timeline"]
    width: 18%

  [data-id="id"],
  [data-id="queue"]
    font-size: .8rem
    font-family: monospace
    text-overflow: ellipsis
    white-space: nowrap
    color: #999
    margin-top: .3rem
    overflow: hidden

    &.unspecified
      color: #ccc

  [data-id="created"]:before,
  [data-id="started"]:before,
  [data-id="finished"]:before
    content: "\a0"
    display: inline-block
    width: 1.1rem
    background-position: 0 .35rem
    background-size: .6rem
    background-repeat: no-repeat
    opacity: .5

  [data-id="created"]:before
    background-image: url("/res/timeline/created.svg")

  [data-id="started"]:before
    background-image: url("/res/timeline/started.svg")

  [data-id="finished"]:before
    background-image: url("/res/timeline/finished.svg")

  & > tbody > tr
    display: none

    &[data-id="result"],
    &[data-id="traceback"],
    &[data-id="params"]
      display: none

      & > td
        background: #ffffd7

      & + tr

        td
          background: #ffffd7
          border-top: none
          border-bottom: 1px solid rgba(#000, .1)
          padding: 0
          position: relative

        .controls
          margin-top: .5rem

          & > a, & > a:hover, & > a:visited
            display: block
            font-size: .85rem
            text-align: center
            text-decoration: none
            color: rgba(#000, .3)
            background: rgba(#000, .03)
            padding: .35rem 1rem

        pre
          color: #484848
          border-top: 1px solid rgba(#000, .05)
          padding: .9rem 3rem 1rem 1.25rem
          margin: 0

    &:target,
    &:target + tr
      display: table-row

    &:last-child
      display: table-row

    &:target ~ tr:last-child
      display: none

  & > tbody > tr > td

    &[data-id="timeline"] > div + div
      margin-top: .2rem

    &[data-id="state"]
      padding-right: 12px

    &[data-id="state"] .badge
      display: inline-block
      width: 100%
      height: 19px
      font-size: 10px
      font-weight: bold
      text-transform: uppercase
      text-align: center
      text-overflow: ellipsis
      letter-spacing: .05em
      background: #eee
      border-radius: 2px
      padding: 3px 8px 2px
      box-sizing: border-box
      overflow: hidden

      &[data-value="failed"],
      &[data-value="rollback-failed"]
        color: #fff
        background: #f66

      &[data-value="rollback"],
      &[data-value="suspended"]
        color: #333
        background: #fc3

      &[data-value="success"]
        color: #fff
        background: #3c6

    &[data-id="meta"] > a

      & + a
        margin-left: 1rem

      &.selected
        text-decoration: none
        color: #000
        border-bottom: 2px solid #000
        padding-bottom: 1px
