/* =====================================================================
   tmc-auto 配色切换器（页脚）
   ---------------------------------------------------------------------
   ★ 不放页头：≤768px 页头 LOGO + 语言 + 汉堡已挤满，再加按钮会把
     汉堡挤出视口（2026-11-06 移动端导航故障根因，x=463 > 390）。
   ★ 无 Emoji：色块用 CSS 圆点，符合全站「禁 Emoji 用 SVG/图形」约定。
   ★ 用 CSS 变量取色，两套皮肤下都能自适应，切到蓝调不会串色。
   ===================================================================== */
.tmc-skinswitch {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}
.tmc-skinswitch__label {
	font-size: 13px;
	color: inherit;
	opacity: .85;
	margin-right: 2px;
}
.tmc-skinswitch__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font: inherit;
	font-size: 13px;
	line-height: 1;
	padding: 7px 12px;
	border: 1px solid currentColor;
	background: transparent;
	color: inherit;
	border-radius: 999px;
	cursor: pointer;
	opacity: .8;
	transition: opacity .15s ease, background-color .15s ease, border-color .15s ease;
}
.tmc-skinswitch__btn:hover { opacity: 1; }
.tmc-skinswitch__btn.is-active {
	opacity: 1;
	font-weight: 600;
	background: rgba(127, 127, 127, .15);
}
.tmc-skinswitch__btn:focus-visible {
	outline: 2px solid var(--tmc-orange);
	outline-offset: 2px;
}
.tmc-skinswitch__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex: 0 0 auto;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12);
}

/* 蓝调下选中态用浅蓝底，避免灰色块压住冷色体系 */
html[data-skin="tuv"] .tmc-skinswitch__btn.is-active {
	background: rgba(0, 113, 185, .12);
	border-color: var(--tmc-orange);
}

/* 页脚底部：切换器与原有 legal 两列并排，窄屏自动换行不溢出 */
.tmc-footer__bottom {
	flex-wrap: wrap;
	gap: 10px 18px;
}
.tmc-footer__bottom .tmc-skinswitch {
	margin-left: auto;
}
@media (max-width: 768px) {
	.tmc-footer__bottom .tmc-skinswitch {
		margin-left: 0;
		width: 100%;
	}
}

/* =====================================================================
   首屏常驻入口：右下悬浮按钮组（2026-11-06）
   ---------------------------------------------------------------------
   背景：页脚切换器在文档 top≈8465px / 整页 8515px，首屏完全看不见，
   访客反馈「前端没看见颜色变化」。悬浮组件 fixed 定位、全站首屏可见。
   ★ 不进页头 flex：≤768px 页头 LOGO + 语言 + 汉堡已挤满，加按钮会把
     汉堡挤出视口（2026-11-06 移动端导航故障根因，x=463 > 390）。
   ★ 本文件在 tmc-style 之后入队，可安全覆盖悬浮按钮的窄屏圆形化规则。
   ===================================================================== */
.tmc-float__btn--skin {
	min-height: 62px;
	gap: 6px;
}
.tmc-float__btn--skin .tmc-float__tx {
	font-size: 12px;
}
.tmc-skinswitch__dot--lg {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	border-radius: 50%;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12), 0 0 0 3px rgba(127, 127, 127, .16);
}
/* 窄屏悬浮按钮变 50px 圆钮、文字隐藏，色点保持可见且居中 */
@media (max-width: 768px) {
	.tmc-float__btn--skin { min-height: 50px; }
	.tmc-skinswitch__dot--lg { width: 20px; height: 20px; }
}