/* 首页风格切换：流光边框 + 渐变滑块（二次元 ⇄ 宇航员） */
@property --sol-a { syntax: "<angle>"; inherits: false; initial-value: 0deg; }

.sol-switch {
  --sol-rainbow: #ff3f9a, #ffd36e, #8ff0c0, #2fe0ff, #8a5cff, #ff3f9a;
  position: fixed;
  left: 50%;
  top: 84px;
  z-index: 30;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 48px;
  padding: 0 5px 0 16px;
  border: 2px solid transparent;
  border-radius: 999px;
  background:
    linear-gradient(120deg, rgba(14, 12, 28, .92), rgba(34, 22, 64, .92)) padding-box,
    conic-gradient(from var(--sol-a), var(--sol-rainbow)) border-box;
  color: #fff;
  font: 700 13px/1 "Inter", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  letter-spacing: .02em;
  text-decoration: none;
  white-space: nowrap;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 10px 34px rgba(0, 0, 0, .35);
  isolation: isolate;
  animation: sol-spin 3.2s linear infinite, sol-in .7s cubic-bezier(.2, 1.3, .4, 1) backwards;
  transition: transform .25s;
  -webkit-tap-highlight-color: transparent;
}
/* 外圈辉光：同一条流光，模糊后垫在下面 */
.sol-switch::before {
  content: "";
  position: absolute;
  inset: -4px;
  z-index: -1;
  border-radius: inherit;
  background: conic-gradient(from var(--sol-a), var(--sol-rainbow));
  filter: blur(14px);
  opacity: .55;
  transition: opacity .3s;
}
.sol-switch:hover { transform: translateX(-50%) translateY(-2px); }
.sol-switch:hover::before { opacity: .9; }
.sol-switch:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }

.sol-switch-tag {
  font-size: 11px;
  letter-spacing: .14em;
  color: rgba(255, 255, 255, .72);
}

.sol-switch-track {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  height: 36px;
  padding: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}
.sol-switch-track b {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 82px;
  padding: 0 12px;
  font-weight: 800;
  color: rgba(255, 255, 255, .7);
  transition: color .35s;
}
.sol-switch-track svg { width: 15px; height: 15px; fill: currentColor; flex: none; }

/* 滑块：当前风格的渐变色块，带一道扫过的高光 */
.sol-switch-knob {
  position: absolute;
  top: 3px;
  bottom: 3px;
  left: 3px;
  width: calc(50% - 3px);
  border-radius: 999px;
  overflow: hidden;
  transition: transform .38s cubic-bezier(.5, 1.5, .5, 1), background .38s;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .3);
}
.sol-switch-knob::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .75) 48%, transparent 66%);
  transform: translateX(-120%);
  animation: sol-shine 2.6s ease-in-out infinite;
}
/* 宇航员在左（默认），二次元在右 */
.sol-switch[data-cur="astro"] .sol-switch-knob { background: linear-gradient(100deg, #7fc8ff, #c69bff 50%, #ff8fb1); }
.sol-switch[data-cur="anime"] .sol-switch-knob { transform: translateX(100%); background: linear-gradient(100deg, #ff3f9a, #ff8fc8 55%, #e8ff3a); }
.sol-switch[data-cur="anime"] [data-k="anime"],
.sol-switch[data-cur="astro"] [data-k="astro"] { color: #120f1d; }

/* 点击后先把滑块推到另一边，再跳转 */
.sol-switch.is-going[data-cur="astro"] .sol-switch-knob { transform: translateX(100%); background: linear-gradient(100deg, #ff3f9a, #ff8fc8 55%, #e8ff3a); }
.sol-switch.is-going[data-cur="anime"] .sol-switch-knob { transform: none; background: linear-gradient(100deg, #7fc8ff, #c69bff 50%, #ff8fb1); }
.sol-switch.is-going[data-cur="anime"] [data-k="anime"],
.sol-switch.is-going[data-cur="astro"] [data-k="astro"] { color: rgba(255, 255, 255, .7); }
.sol-switch.is-going[data-cur="anime"] [data-k="astro"],
.sol-switch.is-going[data-cur="astro"] [data-k="anime"] { color: #120f1d; }

/* 宇航员首页：导航居中位置是空的，直接放在最上面 */
html[data-sol-theme="astro"] .sol-switch { top: 20px; }
@media (min-width: 761px) {
  html[data-sol-theme="astro"] .sol-switch.is-low { top: 84px; }
}

@keyframes sol-spin { to { --sol-a: 360deg; } }
@keyframes sol-shine { 0%, 35% { transform: translateX(-120%); } 75%, 100% { transform: translateX(120%); } }
@keyframes sol-in { from { opacity: 0; transform: translateX(-50%) translateY(-14px) scale(.92); } }

@media (max-width: 760px) {
  .sol-switch { top: 66px; height: 42px; gap: 8px; padding-left: 12px; }
  html[data-sol-theme="astro"] .sol-switch { top: 68px; }
  .sol-switch-tag { font-size: 10px; letter-spacing: .08em; }
  .sol-switch-track { height: 32px; }
  .sol-switch-track b { min-width: 70px; padding: 0 8px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .sol-switch, .sol-switch-knob::after { animation: none; }
}