- const DOLLS = 6
form.dolls
  - let d = 0
  while d < DOLLS
    - if (d !== (DOLLS - 1))
      input(id=`doll--${d}`, type='checkbox')
    label.doll(for=`doll--${d}`, style=`${d === 0 ? 'display: block;' : ''}`)= d
    - d++
  input(type="reset", id="reset")
  label(for="reset") Reset

body
  align-items center
  background #fafafa
  display flex
  justify-content center
  min-height 100vh
  transform-style preserve-3d

::selection
  background transparent
  
label
  display none
  
[type='checkbox']
[type='reset']
  display none
  
[for='reset']
  cursor pointer
  display block
  position absolute
  top 1rem
  right 1rem

.doll
  color #fff
  cursor pointer
  height 200px
  font-size 2rem
  left 50%
  position absolute
  text-align center
  top 50%
  transform translate(-50%, -50%)
  width 100px

  &:nth-of-type(even)
    background blue
  &:nth-of-type(odd)
    background red

input:checked + label + input + label
input:checked + label + label
  display block