/* v4 颜色模式切换器（三段式：浅色 / 深色 / 跟随系统），依赖页面上的 --mode-* 变量，缺省也能用 */
.love-mode-switch { --lms-bg: rgba(255,255,255,.06); --lms-line: rgba(255,255,255,.14); --lms-fg: rgba(255,236,240,.62); --lms-on: #fff; --lms-thumb: linear-gradient(135deg, rgba(255,111,159,.9), rgba(157,123,255,.85)); --lms-glow: 0 .3rem .9rem rgba(255,90,150,.35);
  position: relative; display: inline-grid; grid-auto-flow: column; grid-auto-columns: 1fr; align-items: center; padding: 3px; gap: 0; border-radius: 999px; background: var(--lms-bg); border: 1px solid var(--lms-line); isolation: isolate; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: .78rem; line-height: 1; user-select: none; }
html[data-mode="light"] .love-mode-switch { --lms-bg: rgba(255,255,255,.7); --lms-line: rgba(183,110,121,.22); --lms-fg: #9a6f73; --lms-on: #fff; --lms-thumb: linear-gradient(135deg, #e7839b, #c9897a); --lms-glow: 0 .3rem .9rem rgba(183,110,121,.35); }
.love-mode-switch .lms-opt { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: .32rem; min-width: 2.2rem; min-height: 2rem; padding: .38rem .7rem; margin: 0; border: 0; border-radius: 999px; background: none !important; box-shadow: none !important; color: var(--lms-fg) !important; font: inherit; font-size: inherit; white-space: nowrap; cursor: pointer; transition: color .25s; transform: none !important; }
.love-mode-switch .lms-opt:hover { color: var(--lms-on) !important; }
html[data-mode="light"] .love-mode-switch .lms-opt:hover { color: #7a3d4c !important; }
.love-mode-switch .lms-opt.on { color: var(--lms-on) !important; }
.love-mode-switch .lms-opt:focus-visible { outline: 2px solid rgba(255,111,159,.7); outline-offset: 1px; }
.love-mode-switch .lms-ic { display: inline-grid; width: 1.05rem; height: 1.05rem; }
.love-mode-switch .lms-ic svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.love-mode-switch .lms-opt:nth-of-type(2) .lms-ic svg { fill: currentColor; stroke: none; }
.love-mode-switch .lms-ic svg .fill { fill: currentColor; stroke: none; }
.love-mode-switch .lms-thumb { position: absolute; z-index: 0; top: 3px; bottom: 3px; left: 3px; width: calc((100% - 6px) / 3); border-radius: 999px; background: var(--lms-thumb); box-shadow: var(--lms-glow); transition: transform .42s cubic-bezier(.16,1,.3,1); }
.love-mode-switch[data-active="dark"] .lms-thumb { transform: translateX(100%); }
.love-mode-switch[data-active="system"] .lms-thumb { transform: translateX(200%); }
.love-mode-switch.compact .lms-opt { padding: .38rem .5rem; min-width: 2rem; }
html.mode-switching, html.mode-switching *, html.mode-switching *::before, html.mode-switching *::after { transition: background-color .4s ease, border-color .4s ease, color .4s ease, fill .4s ease, box-shadow .4s ease !important; }
@media (prefers-reduced-motion: reduce) { .love-mode-switch .lms-thumb { transition: none; } html.mode-switching * { transition: none !important; } }
