/* ============================================================
   主题 L01 · 琥珀流光体 (Amber Luster)
   深褐底配琥珀金渐变流光，Cinzel 衬线古韵与琥珀粒子飘浮，如黄昏古卷
   字体: Cinzel(400;700;900) + Inter(400;600;700)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700;900&family=Inter:wght@400;600;700&display=swap');
:root{
  --c-bg:#1a1208;
  --c-bg-grad:radial-gradient(circle at 18% 16%,rgba(255,184,0,.22),transparent 45%),
              radial-gradient(circle at 82% 22%,rgba(212,175,55,.16),transparent 45%),
              radial-gradient(circle at 50% 95%,rgba(255,184,0,.13),transparent 50%),
              linear-gradient(165deg,#1a1208,#2a1c0e);
  --c-surface:rgba(48,36,16,.72);
  --c-surface-2:rgba(64,48,20,.60);
  --c-text:#fff7e6;
  --c-muted:#c9a87a;
  --c-accent:#ffb800;
  --c-accent-2:#d4af37;
  --c-on-accent:#1a1208;
  --c-border:rgba(255,184,0,.18);
  --font-display:'Cinzel',serif;
  --font-body:'Inter',sans-serif;
  --hero-grad:linear-gradient(115deg,#ffb800,#d4af37 50%,#ffd97a);
  --nav-bg:rgba(26,18,8,.60);
  --nav-blur:blur(18px);
  --shadow:0 22px 55px rgba(212,175,55,.30);
  --radius:18px;
}
/* 琥珀光粒子层 —— 金色光点缓缓飘浮明灭 */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:
    radial-gradient(circle at 12% 22%,rgba(255,184,0,.50) 1.5px,transparent 2.5px),
    radial-gradient(circle at 28% 14%,rgba(212,175,55,.45) 2px,transparent 3px),
    radial-gradient(circle at 48% 28%,rgba(255,217,122,.40) 1.5px,transparent 2.5px),
    radial-gradient(circle at 72% 18%,rgba(255,184,0,.48) 2px,transparent 3px),
    radial-gradient(circle at 88% 32%,rgba(212,175,55,.42) 1.5px,transparent 2.5px),
    radial-gradient(circle at 22% 72%,rgba(255,217,122,.38) 1.5px,transparent 2.5px),
    radial-gradient(circle at 68% 80%,rgba(255,184,0,.44) 2px,transparent 3px);
  background-size:130px 130px,160px 160px,120px 120px,150px 150px,140px 140px,180px 180px,170px 170px;
  opacity:.55;
  animation:amberParticleDrift 7s ease-in-out infinite alternate;
}
@keyframes amberParticleDrift{
  0%{opacity:.35;transform:translateY(0) scale(1)}
  50%{opacity:.65;transform:translateY(-8px) scale(1.05)}
  100%{opacity:.5;transform:translateY(-14px) scale(1.1)}
}
/* 标题：Cinzel 古典字重 + 琥珀金流光闪烁 */
.hero h1{font-weight:700;letter-spacing:2px;font-family:var(--font-display)}
.hero h1 .grad{
  background:linear-gradient(115deg,#d4af37,#ffb800 35%,#ffd97a 60%,#d4af37);
  background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  font-weight:900;letter-spacing:3px;animation:amberShimmer 8s linear infinite;
}
@keyframes amberShimmer{to{background-position:220% center}}
/* 玻璃质感卡片 */
.album-card{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,184,0,.20)}
.album-card:hover{box-shadow:0 0 0 1px rgba(212,175,55,.45),0 34px 70px rgba(255,184,0,.40);border-color:rgba(212,175,55,.55);transform:translateY(-6px)}
.album-info{background:rgba(40,30,12,.50)}
.album-info h3{font-weight:700;font-family:var(--font-display)}
.album-badge{background:linear-gradient(115deg,#ffb800,#d4af37);color:#1a1208;border:none}
.album-meta{border-top-color:rgba(255,184,0,.14)}
.album-meta .view{color:#ffd97a}
.section-head .kicker{background:linear-gradient(115deg,#ffb800,#d4af37);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:5px;font-family:var(--font-display)}
.about-visual{background:linear-gradient(135deg,#8c6a14,#ffb800 50%,#d4af37);background-size:200% auto;animation:amberShimmer 9s linear infinite;box-shadow:0 0 60px rgba(212,175,55,.40)}
.eyebrow{background:linear-gradient(115deg,#ffb800,#d4af37) !important;color:#1a1208 !important;letter-spacing:3px}
.btn.primary{background:linear-gradient(115deg,#ffb800,#d4af37);color:#1a1208;box-shadow:0 12px 30px rgba(212,175,55,.45)}
.btn.ghost{background:rgba(255,255,255,.05);color:#fff7e6;border-color:rgba(255,184,0,.22)}
.divider{background:linear-gradient(115deg,#ffb800,#d4af37)}
.footer{background:#0e0804;border-top:1px solid rgba(255,184,0,.10)}
.logo-mark{box-shadow:0 6px 24px rgba(255,184,0,.55)}
.nav-menu a:hover{color:#ffd97a;background:rgba(255,184,0,.10)}
.ts-swatch.ts-luster-amber{background:linear-gradient(135deg,#ffb800,#d4af37)}
.shape.s1{background:#ffb800 !important;opacity:.22 !important}
.shape.s2{background:#d4af37 !important;opacity:.20 !important}
