/* ============================================================
   主题 11 · 晨雾薄纱  Mist Veil
   朦胧灰蓝底配银雾微光，柔纱般漫射的冷调留白
   如清晨雾中的风景摄影，朦胧而宁静
   ============================================================ */
:root{
  --c-bg:#eef2f5;
  --c-bg-grad:radial-gradient(circle at 22% 14%,#e3ebf0,transparent 48%),
              radial-gradient(circle at 78% 82%,#e8eef2,transparent 45%),
              linear-gradient(170deg,#f0f4f7,#e6ecf0);
  --c-surface:rgba(255,255,255,.78);
  --c-surface-2:#eef3f6;
  --c-text:#3d4a5a;
  --c-muted:#8896a8;
  --c-accent:#7b9ab0;
  --c-accent-2:#a8c4d6;
  --c-on-accent:#ffffff;
  --c-border:rgba(123,154,176,.14);
  --font-display:'Georgia','Songti SC',serif;
  --hero-grad:linear-gradient(135deg,#7b9ab0,#a8c4d6 60%,#c8dce8);
  --nav-bg:rgba(238,242,245,.72);
  --nav-blur:blur(16px);
  --shadow:0 16px 40px rgba(123,154,176,.14);
  --radius:14px;
}
/* 雾气漫射层 —— 多层径向柔光，缓慢漂移 */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(50% 40% at 20% 20%,rgba(168,196,214,.22),transparent 65%),
    radial-gradient(45% 35% at 75% 30%,rgba(200,220,232,.18),transparent 60%),
    radial-gradient(50% 40% at 50% 85%,rgba(123,154,176,.12),transparent 65%);
  animation:mistDrift 18s ease-in-out infinite alternate;
}
@keyframes mistDrift{
  from{transform:translate3d(-2%,1%,0) scale(1.03)}
  to{transform:translate3d(2%,-1%,0) scale(1.06)}
}
.hero h1{font-weight:300;letter-spacing:-.5px}
.hero h1 .grad{background:linear-gradient(135deg,#7b9ab0,#c8dce8);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:600}
.album-card{backdrop-filter:blur(10px);border:1px solid rgba(123,154,176,.14)}
.album-card:hover{box-shadow:0 24px 50px rgba(123,154,176,.22);border-color:rgba(123,154,176,.35);transform:translateY(-5px)}
.album-info h3{font-weight:600;letter-spacing:.2px}
.album-badge{background:rgba(255,255,255,.88);color:#3d4a5a;border:1px solid rgba(123,154,176,.2);backdrop-filter:blur(6px)}
.album-meta .view{color:#7b9ab0}
.section-head .kicker{color:#7b9ab0;letter-spacing:5px}
.about-visual{background:linear-gradient(135deg,#7b9ab0,#a8c4d6,#c8dce8);box-shadow:0 10px 40px rgba(123,154,176,.2)}
.eyebrow{background:linear-gradient(135deg,#7b9ab0,#a8c4d6) !important;letter-spacing:3px}
.btn.primary{background:linear-gradient(135deg,#7b9ab0,#a8c4d6);box-shadow:0 12px 28px rgba(123,154,176,.3)}
.btn.ghost{background:rgba(255,255,255,.5);color:#3d4a5a;border-color:rgba(123,154,176,.2)}
.footer{background:#2a3340;border-top:1px solid rgba(123,154,176,.1)}
.logo-mark{box-shadow:0 6px 20px rgba(123,154,176,.4)}
.nav-menu a:hover{color:#7b9ab0}
.divider{background:linear-gradient(135deg,#7b9ab0,#a8c4d6)}
.shape.s1{background:#7b9ab0 !important;opacity:.15 !important}
.shape.s2{background:#a8c4d6 !important;opacity:.12 !important}
.ts-swatch.ts-mist{background:linear-gradient(135deg,#eef2f5,#7b9ab0)}
