/* ============================================================
   主题 N5 · 彩虹流光 (Rainbow Flow)
   七彩渐变流动映深紫夜底，透明玻璃质感，如彩虹光影集
   ============================================================ */
:root{
  --c-bg:#0d0d1a;
  --c-bg-grad:radial-gradient(circle at 18% 14%,rgba(255,0,128,.20),transparent 45%),
              radial-gradient(circle at 50% 18%,rgba(255,200,0,.14),transparent 45%),
              radial-gradient(circle at 82% 22%,rgba(0,212,255,.16),transparent 45%),
              radial-gradient(circle at 50% 95%,rgba(124,77,255,.13),transparent 50%),
              linear-gradient(165deg,#0d0d1a,#161428);
  --c-surface:rgba(28,28,50,.72);
  --c-surface-2:rgba(42,38,68,.60);
  --c-text:#f6f4ff;
  --c-muted:#9b97c4;
  --c-accent:#ff0080;
  --c-accent-2:#00d4ff;
  --c-on-accent:#0d0d1a;
  --c-border:rgba(255,0,128,.16);
  --font-display:'Trebuchet MS','PingFang SC',sans-serif;
  --hero-grad:linear-gradient(115deg,#ff0080,#ff8c00 30%,#ffd700 50%,#00d4ff 75%,#7c4dff);
  --nav-bg:rgba(13,13,26,.60);
  --nav-blur:blur(18px);
  --shadow:0 22px 55px rgba(255,0,128,.30);
  --radius:18px;
}
/* 彩虹渐变流动层 —— 七色光带横向漂移 */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(100deg,
    rgba(255,0,128,.10) 0%,
    rgba(255,140,0,.10) 16%,
    rgba(255,215,0,.10) 32%,
    rgba(0,212,170,.10) 48%,
    rgba(0,212,255,.10) 64%,
    rgba(124,77,255,.10) 80%,
    rgba(255,0,128,.10) 100%);
  background-size:300% 100%;
  filter:blur(12px);
  animation:rainbowFlow 16s linear infinite;
}
@keyframes rainbowFlow{
  0%{background-position:0% 50%}
  100%{background-position:300% 50%}
}
/* 标题：七彩渐变流光 */
.hero h1{font-weight:300;letter-spacing:-1.5px}
.hero h1 .grad{
  background:linear-gradient(115deg,#ff0080,#ff8c00,#ffd700,#00d4aa,#00d4ff,#7c4dff,#ff0080);
  background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  font-weight:800;animation:rainbowShimmer 6s linear infinite;
}
@keyframes rainbowShimmer{to{background-position:220% center}}
/* 玻璃质感卡片 */
.album-card{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,0,128,.18)}
.album-card:hover{box-shadow:0 0 0 1px rgba(0,212,255,.45),0 34px 70px rgba(255,0,128,.40);border-color:rgba(0,212,255,.50);transform:translateY(-6px)}
.album-info{background:rgba(22,20,40,.50)}
.album-info h3{font-weight:600}
.album-badge{background:linear-gradient(115deg,#ff0080,#00d4ff);color:#0d0d1a;border:none}
.album-meta{border-top-color:rgba(255,0,128,.14)}
.album-meta .view{color:#00d4ff}
.section-head .kicker{background:linear-gradient(115deg,#ff0080,#00d4ff);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:5px}
.about-visual{background:linear-gradient(135deg,#ff0080,#ff8c00,#ffd700,#00d4aa,#00d4ff,#7c4dff);background-size:200% auto;animation:rainbowShimmer 9s linear infinite;box-shadow:0 0 60px rgba(255,0,128,.40)}
.eyebrow{background:linear-gradient(115deg,#ff0080,#00d4ff) !important;color:#0d0d1a !important;letter-spacing:3px}
.btn.primary{background:linear-gradient(115deg,#ff0080,#00d4ff);color:#0d0d1a;box-shadow:0 12px 30px rgba(255,0,128,.45)}
.btn.ghost{background:rgba(255,255,255,.05);color:#f6f4ff;border-color:rgba(255,0,128,.22)}
.divider{background:linear-gradient(115deg,#ff0080,#00d4ff)}
.footer{background:#08081a;border-top:1px solid rgba(255,0,128,.10)}
.logo-mark{box-shadow:0 6px 24px rgba(255,0,128,.55)}
.nav-menu a:hover{color:#00d4ff;background:rgba(255,0,128,.10)}
.ts-swatch.ts-rainbow{background:linear-gradient(135deg,#ff0080,#ff8c00,#ffd700,#00d4aa,#00d4ff,#7c4dff)}
.shape.s1{background:#ff0080 !important;opacity:.22 !important}
.shape.s2{background:#00d4ff !important;opacity:.20 !important}
