:root {
  --rounded-corners: calc(var(--gap) * 1.5);
  --border-color: #dadce0;
}

.app.body {
  min-height: 100%;
  padding: calc(var(--gap) * 2);
  display: flex;
  flex-direction: column;
}

.appMain {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: calc(var(--gap) * 2);
  border: solid 3px var(--primary-color);
  align-self: stretch;
  flex: auto;
  border-style: dashed;
  border-radius: calc(var(--gap));
}

input.file {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  z-index: 100;
}

.appMain:active {
  opacity: 0.4;
}

.fileIcon {
  font-size: 100px;
  margin: 0 0 calc(var(--gap) * 1.5) 0;
  color: var(--primary-color);
}

.appMain .text {
  font-size: 120%;
  text-align: center;
}

.View.confirm {
  padding: calc(var(--gap));
}

.View.confirm go-confirm {
  width: 100%;
}

.View.preview .ViewHeader {
  border-bottom: solid 1px var(--border-color);
}