.mh-privacy { padding: 8px 12px; margin-bottom: 12px; border: 1px solid #bce8f1; background: #d9edf7; color: #31708f; font-size: 13px; border-radius: 3px; }
.mh-form { margin-bottom: 18px; }
.mh-form .form-group { margin-bottom: 12px; }
.mh-form label { display: block; font-size: 13px; font-weight: bold; margin-bottom: 4px; color: #2c3e50; }
.mh-input { width: 100%; max-width: 100%; box-sizing: border-box; font-family: Consolas, Menlo, monospace; font-size: 12px; resize: vertical; }
.mh-status { font-size: 13px; color: #777; min-height: 1em; }
.mh-error { padding: 10px 12px; margin-bottom: 14px; border: 1px solid #ebccd1; background: #f2dede; color: #a94442; font-size: 13px; border-radius: 3px; word-break: break-all; }

/* ファイルの取り込み口 */
.mh-drop { position: relative; margin-bottom: 12px; padding: 20px 14px; text-align: center; border: 2px dashed #8aa3b5; border-radius: 6px; background: #f7fafc; cursor: pointer; }
.mh-drop:hover, .mh-drop:focus, .mh-drop.mh-over { border-color: #1a5276; background: #eaf2f8; outline: none; }
.mh-drop-main { font-size: 15px; font-weight: bold; color: #1a5276; }
.mh-drop-sub { margin-top: 4px; font-size: 13px; color: #5f6f7d; }
.mh-drop input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.mh-title { font-size: 14px; font-weight: bold; margin: 20px 0 8px; border-left: 4px solid #337ab7; padding-left: 8px; }
.mh-subtitle { font-size: 13px; font-weight: bold; color: #2c3e50; margin: 12px 0 6px; }
.mh-note { font-size: 12px; color: #666; margin: 4px 0 8px; }
.mh-reason { display: block; font-size: 12px; color: #666; margin-top: 2px; }
.mh-warn-text { margin-top: 4px; font-size: 12px; color: #8a6d3b; }
.mh-none { color: #3c763d; font-size: 13px; }
.mh-none-text { color: #999; }
.mh-code { font-family: Consolas, Menlo, monospace; font-size: 12px; background: #f5f5f5; padding: 0 3px; border-radius: 2px; word-break: break-all; }

/* 判定のバッジ。最も長い表記(判定不能)が入る幅にそろえる */
.mh-badge { display: inline-block; box-sizing: border-box; width: 5.5em; flex: none; text-align: center; padding: 1px 4px; margin-right: 6px; border-radius: 3px; font-size: 12px; font-weight: bold; white-space: nowrap; vertical-align: middle; }
.mh-badge.mh-l-ok { background: #dff0d8; color: #3c763d; }
.mh-badge.mh-l-info { background: #d9edf7; color: #31708f; }
.mh-badge.mh-l-warn { background: #fcf8e3; color: #8a6d3b; }
.mh-badge.mh-l-bad { background: #f2dede; color: #a94442; }
.mh-badge.mh-l-unknown { background: #e8dff5; color: #5b3a8c; }
.mh-badge.mh-l-skip { background: #eee; color: #666; }

/* ラベル|値 の表。ラベル欄は固定幅にせず、最も長いラベルの幅にそろう(表の列) */
.mh-kv { width: 100%; border-collapse: collapse; font-size: 13px; margin-bottom: 8px; table-layout: auto; }
.mh-kv td { border: 1px solid #e3e3e3; padding: 5px 8px; vertical-align: top; text-align: left; }
.mh-kv td.mh-label { background: #fafafa; font-weight: bold; color: #2c3e50; white-space: nowrap; width: 1%; }
.mh-kv td.mh-value { word-break: break-all; overflow-wrap: anywhere; }
.mh-kv td.mh-value .copy-btn { margin-left: 6px; vertical-align: middle; }
.mh-auth-line { margin: 2px 0; }
.mh-props { font-family: Consolas, Menlo, monospace; font-size: 12px; color: #555; margin-top: 2px; }
.mh-raw-note { font-family: Consolas, Menlo, monospace; font-size: 11px; color: #888; margin-top: 2px; }

/* 気をつける点 */
.mh-items { list-style: none; margin: 0 0 8px; padding: 0; }
.mh-item { display: flex; align-items: flex-start; gap: 4px; padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px; min-width: 0; }
.mh-item:last-child { border-bottom: 0; }
.mh-item-body { flex: 1; min-width: 0; word-break: break-all; overflow-wrap: anywhere; }
.mh-item-text { color: #2c3e50; }
.mh-pre { white-space: pre-wrap; word-break: break-all; overflow-wrap: anywhere; background: #f8f8f8; border: 1px solid #e3e3e3; padding: 4px 8px; font-size: 12px; margin: 4px 0 0; font-family: Consolas, Menlo, monospace; max-height: 240px; overflow-y: auto; }
.mh-advice { font-size: 13px; padding-left: 20px; margin: 0 0 8px; }
.mh-advice li { margin-bottom: 4px; }

/* DNS の照会(ドメインごと) */
.mh-dns-card { border: 1px solid #ddd; border-radius: 3px; padding: 8px 12px; margin-bottom: 12px; min-width: 0; }
.mh-dns-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 6px; }
.mh-dns-domain { font-weight: bold; font-size: 14px; color: #1a5276; word-break: break-all; min-width: 0; }
.mh-dns-btn { margin: 2px 8px 6px 0; }
.mh-dns-send { font-size: 12px; color: #666; word-break: break-all; }
.mh-dns-result { margin-top: 6px; }
.mh-dns-error { padding: 6px 10px; border: 1px solid #ebccd1; background: #f2dede; color: #a94442; font-size: 13px; border-radius: 3px; word-break: break-all; }
.mh-issues { margin: 4px 0 0; padding-left: 18px; font-size: 12px; color: #555; }

/* エラーメールの解析(宛先ごとのカード。各カードの左端は縦にそろう) */
.mh-bounce { border: 1px solid #ddd; border-radius: 3px; padding: 8px 12px; min-width: 0; }
.mh-bounce-guide { margin: 6px 0 8px; padding: 8px 10px; border: 1px solid #c9d7ea; border-left: 4px solid #2a6db5; background: #f3f7fc; color: #333; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.mh-bounce-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-bottom: 6px; }
.mh-bounce-kind { font-weight: bold; font-size: 15px; color: #2c3e50; }
.mh-bounce-double { display: inline-block; padding: 1px 6px; border: 1px solid #a94442; border-radius: 3px; color: #a94442; font-size: 12px; font-weight: bold; white-space: nowrap; }
.mh-bounce-list { margin-bottom: 8px; }
.mh-bounce-rcpt { border: 1px solid #ddd; border-left: 4px solid #a94442; border-radius: 3px; padding: 6px 10px; margin: 0 0 10px; min-width: 0; }
.mh-bounce-rcpt .mh-subtitle { margin-top: 6px; }
.mh-bounce-dns { margin-bottom: 8px; }
.mh-bounce-relate { margin: 0 0 6px; padding: 6px 10px; border-left: 3px solid #8a6d3b; background: #fcf8e3; font-size: 13px; overflow-wrap: anywhere; }
.mh-bounce-caution { margin-top: 8px; }

/* 経路(段ごとのカード。各段の左端は縦にそろう) */
.mh-route { margin-bottom: 8px; }
.mh-hop { border: 1px solid #ddd; border-left: 4px solid #8aa3b5; border-radius: 3px; padding: 6px 10px; margin: 0 0 8px; min-width: 0; }
.mh-hop-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 13px; margin-bottom: 6px; }
.mh-hop-n { font-weight: bold; color: #1a5276; }
.mh-hop-time { font-family: Consolas, Menlo, monospace; font-size: 12px; }
.mh-hop-delta { color: #555; }
.mh-details { margin: 6px 0; font-size: 13px; }
.mh-details summary { cursor: pointer; color: #337ab7; }

/* 伏せて表示・伏せた状態でコピー */
.mh-maskbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.mh-mask-toggle { font-size: 14px; font-weight: bold; cursor: pointer; margin: 0; }
/* 解析する・クリア・伏せて表示を1行に並べる(狭い幅では折り返す) */
.mh-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.mh-actions .btn { margin: 0; }
.mh-form .mh-actions .mh-mask-toggle { display: inline-flex; align-items: center; gap: 4px; margin: 0; color: inherit; }
.mh-actions .mh-mask-toggle input { margin: 0; }
/* 伏せて表示の説明は、ボタンとチェックの行の下に1行として置く */
.mh-actions .mh-mask-hint { flex: 1 0 100%; min-width: 0; margin: 0; overflow-wrap: anywhere; }
.mh-links { font-size: 13px; padding-left: 20px; }
.mh-links li { margin-bottom: 4px; }

@media (max-width: 600px) {
	.mh-kv td.mh-label { width: auto; white-space: normal; word-break: keep-all; }
	.mh-drop { padding: 16px 10px; }
}