.icon {
    width: 90%;
    max-width: 240px;
}

.task-item {
  display: grid;
  grid-template-columns: 64px 1fr 64px;
  grid-column-gap: 8px;
  align-items: center;
  margin: 8px;
}

.task-item * {
  margin: 0;
  line-height: 1.1;
}

.uploadButton {
  font-size: 2rem;
  padding: 0.2rem 0.5rem 0.7rem 0.5rem;
  width: 64px;
  height: 64px;
}

#cameraStream {
  width: 100vw;
  height: 100vh;
  position: absolute;
  overflow: auto;
}

/*******************
 * Submit modal
 *******************/

/* fullscreen */

#submit-modal {
  width: 100vw;
  height: 100vh;

  max-width: 100vw;
  max-height: 100vh;

  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;

  position: fixed;
  inset: 0;

  overflow: auto;
}

#submit-modal header,
#submit-modal footer {
    z-index: 100;
    position: absolute;
    width: 100%;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 20px;
}

#submit-modal header {
    top: 0;
    font-size: 1.5em;
    color: white;
    text-shadow: -1px -1px 2px black, -1px 1px 2px black, 1px -1px 2px black, 1px 1px 2px black;
}

#submit-modal footer {
    bottom: 0;
    text-align: center;
}

#switchCamera {
    z-index: 110;
    position: absolute;
    right: 24px;
    width: 48px;
    height: 48px;
    border-radius: 24px;
    background: url('/static/img/1f504.svg');
}

/*******************
 * Review
 *******************/

.submission-grid {
  display: grid;
  grid-column-gap: 8px;
  align-items: center;
}

.submission-grid.Pending { grid-template-columns: repeat(2, 1fr); }
.submission-grid.Scaled { grid-template-columns: repeat(2, 1fr); }
.submission-grid.Reviewed { grid-template-columns: repeat(5, 1fr); }

.submission-grid.Reviewed article {
    zoom: 0.5;
}