body {
  font-family: Arial, sans-serif;
  margin: 20px;
  line-height: 1.6;
  visibility: hidden; /* 初期状態で非表示 */
}

body.loaded {
  visibility: visible; /* JavaScriptがロードされてから表示。チラツキ防止のため。 */
}

textarea, input {
  padding: 10px;
  font-size: 16px;
  box-sizing: border-box;
}

textarea {
  width: 100%;
}

input {
  flex: 1; /* 入力フィールドを均等に広げる */
  margin-right: 4px;
  margin-left: 4px;
}

label {
  font-weight: bold;
}

label.inline {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-right: 10px;
}

.replace-pair {
  display: flex; /* 横並びに配置 */
  align-items: center; /* 縦方向で中央揃え */
  margin-bottom: 4px;
}

button {
  font-size: 16px;
  padding: 10px;
  margin: 4px 0;
}

.file-upload-container {
  text-align: right; /* 右端に配置 */
}

#statics {
  margin-left: 40px;
}

.note {
  margin: 10px;
  font-size: 12px;
}

.replace-pair.disabled .searchText,
.replace-pair.disabled .replaceText {
  background-color: #f0f0f0; /* Gray out */
  color: #a0a0a0; /* Lighter text color */
}