/* APIキー・パスワード除去ツール v1.1.0 */
.sm {
	--sm-text: #333;
	--sm-sub: #666;
	--sm-line: #d9d9d9;
	--sm-soft: #f5f5f5;
	--sm-accent: #333;
	--sm-hit: #ffe08a;
	--sm-hit-line: #d9a400;
	--sm-off: #e8f3ff;
	--sm-off-line: #7aa7d6;
	--sm-ok: #1f7a3f;
	--sm-ok-bg: #edf7f0;
	--sm-warn: #9a5b00;
	--sm-warn-bg: #fff6e5;
	--sm-err: #b3261e;
	--sm-err-bg: #fdeceb;
	color: var(--sm-text);
	font-size: 15px;
	line-height: 1.6;
	text-align: left;
}
.sm *, .sm *::before, .sm *::after { box-sizing: border-box; }
.sm [hidden] { display: none !important; }
.sm code, .sm-help code {
	font-family: Consolas, "Courier New", monospace;
	background: var(--sm-soft, #f5f5f5);
	padding: 0 4px;
	border-radius: 3px;
	font-size: 0.92em;
}

/* ローカル処理の表示 */
.sm-local {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 14px;
	margin: 0 0 16px;
	border: 1px solid #b9dcc4;
	background: var(--sm-ok-bg);
	border-radius: 6px;
	color: #1d4d2c;
}
.sm-local-icon {
	flex: none;
	width: 28px;
	height: 28px;
	background: no-repeat center / 24px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%231f7a3f" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="4" y="11" width="16" height="10" rx="2"/><path d="M8 11V7a4 4 0 0 1 8 0v4"/><path d="M12 15v2"/></svg>');
}
.sm-local-text strong { display: block; font-size: 1em; }
.sm-local-text span { font-size: 0.88em; }

/* タブ */
.sm-tabs {
	display: flex;
	gap: 4px;
	border-bottom: 2px solid var(--sm-accent);
}
.sm .sm-tab {
	flex: 1 1 0;
	padding: 10px 12px;
	border: 1px solid var(--sm-line);
	border-bottom: none;
	border-radius: 6px 6px 0 0;
	background: var(--sm-soft);
	color: var(--sm-text);
	font-size: 0.95em;
	font-weight: bold;
	cursor: pointer;
}
.sm .sm-tab:hover { background: #e9e9e9; }
.sm .sm-tab.is-active { background: var(--sm-accent); border-color: var(--sm-accent); color: #fff; }
.sm-panel {
	padding: 14px 0 6px;
}

.sm-label {
	display: block;
	font-weight: bold;
	margin: 0 0 6px;
	font-size: 0.95em;
}
.sm textarea {
	font-family: Consolas, "Courier New", monospace;
	font-size: 13px;
	line-height: 1.5;
	min-height: 120px;
	tab-size: 4;
}
.sm textarea[readonly] { background: #fafafa; }

.sm-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 8px 0;
}
.sm-center { justify-content: center; }
.sm button { font-size: 0.85em; }
.sm button.sm-sub {
	background: #fff;
	color: var(--sm-text);
	border: 1px solid #aaa;
}
.sm button.sm-sub:hover { background: #f0f0f0; }
.sm button.sm-small { padding: 4px 10px; font-size: 0.8em; }
.sm button:disabled { opacity: 0.5; cursor: default; }
.sm-status { font-size: 0.85em; color: var(--sm-sub); }

/* ドロップ */
.sm-drop {
	border: 2px dashed #aaa;
	border-radius: 8px;
	padding: 24px 16px;
	text-align: center;
	background: #fafafa;
	transition: background 0.15s, border-color 0.15s;
}
.sm-drop.is-over { background: #fff8e1; border-color: var(--sm-hit-line); }
.sm-drop-main { font-size: 1.05em; font-weight: bold; margin: 0 0 10px; }
.sm-drop-note { font-size: 0.85em; color: var(--sm-sub); margin: 10px 0 0; }

/* 設定 */
.sm-settings {
	margin: 14px 0;
	border: 1px solid var(--sm-line);
	border-radius: 6px;
	background: #fff;
}
.sm-settings > summary {
	padding: 10px 14px;
	font-weight: bold;
	cursor: pointer;
	background: var(--sm-soft);
	border-radius: 6px;
}
.sm-settings[open] > summary { border-bottom: 1px solid var(--sm-line); border-radius: 6px 6px 0 0; }
.sm-set {
	display: flex;
	gap: 12px;
	padding: 12px 14px;
	border-bottom: 1px solid #eee;
}
.sm-set:last-child { border-bottom: none; }
.sm-set-label {
	flex: 0 0 170px;
	font-weight: bold;
	font-size: 0.92em;
	padding-top: 4px;
}
.sm-set-body { flex: 1 1 auto; min-width: 0; }
.sm-hint { font-size: 0.82em; color: var(--sm-sub); margin: 4px 0 0; }
.sm-hint-top { margin: 0 0 6px; }
.sm-check, .sm-radio, .sm-inline {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin: 2px 14px 2px 0;
	cursor: pointer;
	font-size: 0.95em;
}
.sm-check input, .sm-radio input { margin: 0; }

.sm-seg {
	display: inline-flex;
	border: 1px solid var(--sm-accent);
	border-radius: 6px;
	overflow: hidden;
}
.sm-seg label { cursor: pointer; margin: 0; }
.sm-seg input { position: absolute; opacity: 0; pointer-events: none; }
.sm-seg span {
	display: block;
	padding: 5px 18px;
	font-size: 0.92em;
	border-left: 1px solid var(--sm-accent);
}
.sm-seg label:first-child span { border-left: none; }
.sm-seg input:checked + span { background: var(--sm-accent); color: #fff; }
.sm-seg input:focus-visible + span { outline: 2px solid #4a90e2; outline-offset: -2px; }

.sm-mode { margin: 0 0 8px; }
.sm-mode-body { margin: 4px 0 0 22px; }
.sm .sm-input {
	width: 100%;
	max-width: 360px;
	padding: 6px 8px;
	border: 1px solid #999;
	border-radius: 4px;
	font-family: Consolas, "Courier New", monospace;
	font-size: 14px;
}
.sm .sm-input-char { width: 4em; text-align: center; }
.sm .sm-input:disabled { background: #f2f2f2; color: #999; }
.sm-presets { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 0; }
.sm .sm-chip {
	padding: 2px 8px;
	background: #fff;
	color: var(--sm-text);
	border: 1px solid #bbb;
	border-radius: 12px;
	font-family: Consolas, "Courier New", monospace;
	font-size: 12px;
}
.sm .sm-chip:hover { background: #f0f0f0; }
.sm-example { margin: 6px 0 0; font-size: 0.88em; color: var(--sm-sub); word-break: break-all; }

/* 指定した文字列 */
.sm-custom-list { display: flex; flex-direction: column; gap: 6px; }
.sm-custom-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	padding: 8px;
	border: 1px solid #e3e3e3;
	border-radius: 6px;
	background: #fcfcfc;
}
.sm .sm-custom-row .sm-input { max-width: none; flex: 1 1 200px; }
.sm .sm-custom-row .sm-input.sm-custom-repl { flex: 0 1 180px; }
.sm-custom-row .sm-check { margin: 0; font-size: 0.85em; }
.sm .sm-custom-row .sm-del { padding: 2px 10px; }
.sm-custom-err { flex-basis: 100%; color: var(--sm-err); font-size: 0.82em; }
.sm .sm-input.is-error { border-color: var(--sm-err); background: var(--sm-err-bg); }

/* 結果 */
.sm-result {
	margin: 18px 0 0;
	padding: 14px 0 0;
	border-top: 2px solid var(--sm-accent);
}
.sm .sm-h { font-size: 1.15em; margin: 0 0 8px; }
.sm-summary { margin: 0 0 12px; }
.sm-summary-main { font-weight: bold; font-size: 1.05em; }
.sm-summary-main.is-zero { color: var(--sm-sub); font-weight: normal; }
.sm-types { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 0; }
.sm-type {
	font-size: 0.82em;
	padding: 1px 8px;
	border-radius: 10px;
	background: #fff3cd;
	border: 1px solid #f0d27a;
}
.sm-msg {
	margin: 8px 0 0;
	padding: 6px 10px;
	border-radius: 4px;
	font-size: 0.88em;
}
.sm-msg.is-warn { background: var(--sm-warn-bg); color: var(--sm-warn); border: 1px solid #f1d39b; }
.sm-msg.is-err { background: var(--sm-err-bg); color: var(--sm-err); border: 1px solid #f1b8b4; }

.sm-progress { display: flex; align-items: center; gap: 10px; margin: 4px 0 10px; font-size: 0.88em; }
.sm-progress progress { flex: 0 0 200px; height: 14px; }
.sm-progress span { color: var(--sm-sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ファイル一覧 */
.sm-file-list { display: flex; flex-direction: column; gap: 10px; }
.sm-src {
	border: 1px solid var(--sm-line);
	border-radius: 6px;
	overflow: hidden;
}
.sm-src-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 12px;
	padding: 8px 12px;
	background: var(--sm-soft);
}
.sm-src-name { font-weight: bold; word-break: break-all; flex: 1 1 240px; }
.sm-src-kind { font-size: 0.78em; padding: 0 6px; border-radius: 3px; background: #555; color: #fff; margin-right: 6px; vertical-align: 1px; }
.sm-src-info { font-size: 0.85em; color: var(--sm-sub); }
.sm-src-items { max-height: 360px; overflow: auto; }
.sm-item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 5px 12px;
	border-top: 1px solid #eee;
	font-size: 0.88em;
	cursor: pointer;
}
.sm-item:hover { background: #fafafa; }
.sm-item.is-selected { background: #fff8e1; }
.sm-item-path { flex: 1 1 auto; min-width: 0; word-break: break-all; font-family: Consolas, "Courier New", monospace; font-size: 0.95em; }
.sm-item-meta { flex: none; color: var(--sm-sub); font-size: 0.92em; }
.sm-badge {
	flex: none;
	display: inline-block;
	min-width: 2.2em;
	text-align: center;
	padding: 0 6px;
	border-radius: 10px;
	font-size: 0.85em;
	background: #eee;
	color: #555;
}
.sm-badge.is-hit { background: var(--sm-hit); color: #5a4300; font-weight: bold; }
.sm-badge.is-warn { background: var(--sm-warn-bg); color: var(--sm-warn); border: 1px solid #f1d39b; }
.sm-badge.is-err { background: var(--sm-err-bg); color: var(--sm-err); }
.sm-item .sm-item-dl { flex: none; padding: 2px 8px; font-size: 0.8em; }

/* 確認・一覧 */
.sm-block { margin: 16px 0 0; }
.sm-block-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 6px 12px;
	margin: 0 0 4px;
}
.sm-block-head .sm-label { margin: 0; }
.sm-block-tools { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.sm-block-tools .sm-check { margin: 0 6px 0 0; font-size: 0.88em; }
.sm-preview-name { font-family: Consolas, "Courier New", monospace; font-size: 0.85em; color: var(--sm-sub); word-break: break-all; }
.sm-preview {
	margin: 6px 0 0;
	padding: 10px 12px;
	max-height: 460px;
	overflow: auto;
	border: 1px solid var(--sm-line);
	border-radius: 4px;
	background: #fff;
	font-family: Consolas, "Courier New", monospace;
	font-size: 13px;
	line-height: 1.55;
	white-space: pre-wrap;
	word-break: break-all;
	tab-size: 4;
}
.sm-preview mark {
	background: var(--sm-hit);
	color: #3d2e00;
	border-bottom: 2px solid var(--sm-hit-line);
	border-radius: 2px;
	padding: 0 1px;
	cursor: pointer;
}
.sm-preview mark.is-off {
	background: var(--sm-off);
	color: var(--sm-text);
	border-bottom: 2px dashed var(--sm-off-line);
}
.sm-preview mark:hover { outline: 1px solid var(--sm-hit-line); }

.sm-table-wrap { overflow-x: auto; border: 1px solid var(--sm-line); border-radius: 4px; }
.sm-table { width: 100%; border-collapse: collapse; font-size: 0.86em; }
.sm-table th, .sm-table td { padding: 5px 8px; border-bottom: 1px solid #eee; text-align: left; vertical-align: top; }
.sm-table thead th { background: var(--sm-soft); white-space: nowrap; font-weight: bold; }
.sm-table tbody tr:last-child td { border-bottom: none; }
.sm-table tr.is-off td { color: #888; }
.sm-table td.sm-c-check, .sm-table th:first-child { width: 3.5em; text-align: center; }
.sm-table td.sm-c-n { white-space: nowrap; }
.sm-table td.sm-c-type { white-space: nowrap; }
.sm-table td.sm-c-val { font-family: Consolas, "Courier New", monospace; word-break: break-all; max-width: 320px; }
.sm-table td.sm-c-count { white-space: nowrap; text-align: right; }
.sm-table td.sm-c-where { font-size: 0.92em; color: var(--sm-sub); word-break: break-all; }
.sm-hidden-val { color: #999; }
.sm-version { text-align: right; font-size: 0.75em; color: #aaa; margin: 10px 0 0; }

/* ツールの紹介と使い方 */
.sm-help {
	margin: 28px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid #ddd;
	color: #333;
	line-height: 1.75;
	font-size: 15px;
	text-align: left;
}
.sm-help h2 {
	font-size: 1.12em;
	margin: 22px 0 8px;
	padding: 0 0 4px 10px;
	border-left: 4px solid #555;
	border-bottom: 1px solid #eee;
}
.sm-help h2:first-child { margin-top: 0; }
.sm-help p { margin: 6px 0; }
.sm-help ul, .sm-help ol { margin: 6px 0; padding-left: 1.5em; }
.sm-help li { margin: 4px 0; }
@media screen and (min-width: 721px) {
	.sm-help li code { white-space: nowrap; }
}
.sm-help-table { border-collapse: collapse; width: 100%; font-size: 0.93em; margin: 6px 0; }
.sm-help-table th, .sm-help-table td { border: 1px solid #ddd; padding: 6px 10px; text-align: left; vertical-align: top; }
.sm-help-table thead th { background: #f5f5f5; }
.sm-help-table tbody th { white-space: nowrap; background: #fafafa; }

@media screen and (max-width: 720px) {
	.sm { font-size: 14px; }
	.sm-set { flex-direction: column; gap: 6px; }
	.sm-set-label { flex: none; padding-top: 0; }
	.sm .sm-tab { font-size: 0.85em; padding: 9px 6px; }
	.sm-progress progress { flex-basis: 120px; }
	.sm-table td.sm-c-where { min-width: 120px; }
	.sm-mode-body { margin-left: 0; }
}