/* ==========================================================
   粵曲雅集 V2.0 - 國潮粵劇風高端主題
   嶺南文化 + 國潮 + 現代音樂平台 融合風格
   ========================================================== */

:root {
    /* 主色系：深墨 + 中國紅 + 金箔 + 翡翠 */
    --v2-ink: #0E0B14;            /* 深墨夜 */
    --v2-ink-2: #161122;          /* 次深 */
    --v2-ink-3: #221A30;          /* 卡片底 */
    --v2-red: #C8102E;            /* 中國紅 */
    --v2-red-dark: #8B0A1F;
    --v2-red-light: #E63946;
    --v2-gold: #E8B73C;           /* 金箔 */
    --v2-gold-dark: #B8901C;
    --v2-gold-light: #F5D77A;
    --v2-jade: #2A9D8F;           /* 翡翠 */
    --v2-ivory: #F7F1E3;          /* 象牙 */
    --v2-paper: #FBF6EC;          /* 宣紙 */
    --v2-text: #EDE3CC;
    --v2-text-mute: #A89B82;
    --v2-text-dim: #6B6053;
    --v2-line: rgba(232,183,60,0.18);

    /* 渐变 */
    --grad-stage: radial-gradient(ellipse at 50% 0%, rgba(200,16,46,0.28) 0%, rgba(14,11,20,0.9) 55%, var(--v2-ink) 100%);
    --grad-gold: linear-gradient(135deg, #F5D77A 0%, #E8B73C 45%, #B8901C 100%);
    --grad-red: linear-gradient(135deg, #E63946 0%, #C8102E 50%, #8B0A1F 100%);
    --grad-card: linear-gradient(160deg, rgba(34,26,48,0.92) 0%, rgba(22,17,34,0.92) 100%);
    --grad-ink: linear-gradient(180deg, var(--v2-ink) 0%, var(--v2-ink-2) 100%);

    /* 字体 */
    --font-zh: "Noto Serif HK", "Source Han Serif TC", "思源宋體", "Microsoft JhengHei", "PingFang TC", serif;
    --font-zh-sans: "Noto Sans HK", "PingFang TC", "Microsoft JhengHei", sans-serif;
    --font-seal: "ZCOOL XiaoWei", "STKaiti", "楷體", serif;

    /* 阴影 */
    --shadow-gold: 0 8px 32px rgba(232,183,60,0.25);
    --shadow-red: 0 8px 32px rgba(200,16,46,0.35);
    --shadow-card: 0 12px 40px rgba(0,0,0,0.45);

    /* 间距 */
    --s-xs: 4px; --s-sm: 8px; --s-md: 16px; --s-lg: 24px; --s-xl: 40px; --s-2xl: 64px; --s-3xl: 96px;
    --r-sm: 8px; --r-md: 14px; --r-lg: 20px; --r-xl: 28px; --r-pill: 999px;
}

/* ========== 基礎重置 ========== */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body.v2 {
    margin: 0;
    font-family: var(--font-zh-sans);
    color: var(--v2-text);
    background: var(--v2-ink);
    line-height: 1.7;
    overflow-x: hidden;
}
body.v2::before {
    content: "";
    position: fixed; inset: 0; z-index: -2;
    background: var(--v2-ink);
}
/* 全局水墨纹理 */
body.v2::after {
    content: "";
    position: fixed; inset: 0; z-index: -1; pointer-events: none;
    background-image:
        radial-gradient(circle at 15% 20%, rgba(200,16,46,0.06) 0%, transparent 35%),
        radial-gradient(circle at 85% 70%, rgba(232,183,60,0.05) 0%, transparent 40%),
        radial-gradient(circle at 50% 100%, rgba(42,157,143,0.04) 0%, transparent 45%);
}

a { color: var(--v2-gold); text-decoration: none; transition: color .2s; }
a:hover { color: var(--v2-gold-light); }
img { max-width: 100%; display: block; }

/* ========== 容器 ========== */
.v2-container { max-width: 1240px; margin: 0 auto; padding: 0 var(--s-lg); }
.v2-container-narrow { max-width: 880px; }

/* ========== 顶部导航 ========== */
.v2-nav {
    position: sticky; top: 0; z-index: 900;
    background: rgba(14,11,20,0.82);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--v2-line);
}
.v2-nav-inner {
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--s-md); height: 68px;
}
/* Logo 印章 */
.v2-logo {
    display: flex; align-items: center; gap: 12px; text-decoration: none;
}
.v2-logo-seal {
    width: 44px; height: 44px; border-radius: 8px;
    background: var(--grad-red);
    display: flex; align-items: center; justify-content: center;
    font-family: var(--font-seal); font-size: 22px; color: var(--v2-ivory);
    font-weight: 700; box-shadow: 0 2px 10px rgba(200,16,46,0.5);
    border: 2px solid rgba(245,215,122,0.6);
    transform: rotate(-3deg);
}
.v2-logo-text {
    font-family: var(--font-zh); font-weight: 700; font-size: 22px;
    color: var(--v2-gold); letter-spacing: 2px;
    text-shadow: 0 1px 6px rgba(232,183,60,0.3);
}
.v2-logo-text small {
    display: block; font-size: 10px; font-weight: 400; color: var(--v2-text-mute);
    letter-spacing: 4px; margin-top: -2px;
}
/* 导航链接 */
.v2-nav-links { display: flex; align-items: center; gap: 2px; }
.v2-nav-link {
    color: var(--v2-text); padding: 8px 14px; border-radius: var(--r-sm);
    font-size: 15px; font-weight: 500; display: inline-flex; align-items: center; gap: 6px;
    transition: all .25s;
}
.v2-nav-link:hover { color: var(--v2-gold); background: rgba(232,183,60,0.08); }
.v2-nav-link.active { color: var(--v2-gold); background: rgba(232,183,60,0.14); }
.v2-nav-link i { font-size: 16px; }
/* 按钮 */
.v2-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 10px 22px; border-radius: var(--r-pill); font-size: 15px; font-weight: 600;
    border: none; cursor: pointer; transition: all .25s; text-decoration: none; white-space: nowrap;
    font-family: var(--font-zh-sans);
}
/* V2-DeepGold：去除发光感，调暗到复古缎金色 */
.v2-btn-gold {
    background: linear-gradient(135deg, #B8901C 0%, #9A7216 55%, #6B5210 100%);
    color: #F5E8C8;
    box-shadow: 0 2px 10px rgba(0,0,0,0.45);
    border: 1px solid rgba(245,215,122,0.25);
    text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}
.v2-btn-gold:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(184,144,28,0.25);
    color: #FFFFFF;
    background: linear-gradient(135deg, #D4A93A 0%, #B8901C 60%, #7A5C12 100%);
}
.v2-btn-red { background: var(--grad-red); color: var(--v2-ivory); box-shadow: var(--shadow-red); }
.v2-btn-red:hover { transform: translateY(-2px); box-shadow: 0 12px 36px rgba(200,16,46,0.5); color: var(--v2-ivory); }
.v2-btn-ghost { background: rgba(255,255,255,0.04); color: var(--v2-text); border: 1px solid var(--v2-line); }
.v2-btn-ghost:hover { background: rgba(232,183,60,0.1); color: var(--v2-gold); border-color: var(--v2-gold); }
.v2-btn-lg { padding: 14px 32px; font-size: 17px; }
.v2-btn-sm { padding: 6px 14px; font-size: 13px; }

/* ========== Hero 首屏 ========== */
.v2-hero {
    position: relative; min-height: 92vh; display: flex; align-items: center;
    background: var(--grad-stage);
    overflow: hidden;
}
/* 舞台光影 */
.v2-hero::before {
    content: ""; position: absolute; inset: 0; z-index: 0;
    background:
        radial-gradient(ellipse 80% 50% at 50% 0%, rgba(232,183,60,0.22), transparent 60%),
        radial-gradient(ellipse 60% 40% at 20% 100%, rgba(200,16,46,0.18), transparent 60%);
    animation: stagePulse 8s ease-in-out infinite;
}
@keyframes stagePulse {
    0%,100% { opacity: .85; }
    50% { opacity: 1; }
}
/* 水墨流动 */
.v2-ink-flow {
    position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .5;
    background:
        radial-gradient(circle 200px at 10% 30%, rgba(237,227,204,0.08), transparent),
        radial-gradient(circle 300px at 80% 60%, rgba(237,227,204,0.06), transparent),
        radial-gradient(circle 250px at 60% 90%, rgba(237,227,204,0.05), transparent);
    filter: blur(8px);
    animation: inkDrift 20s ease-in-out infinite;
}
@keyframes inkDrift {
    0%,100% { transform: translate(0,0) scale(1); }
    33% { transform: translate(40px,-20px) scale(1.08); }
    66% { transform: translate(-30px,25px) scale(0.96); }
}
/* 戏曲元素装饰 */
.v2-hero-deco {
    position: absolute; font-size: 14rem; opacity: .05; z-index: 0;
    color: var(--v2-gold); font-family: var(--font-seal); user-select: none;
}
.v2-hero-deco-1 { top: 8%; right: 5%; transform: rotate(8deg); }
.v2-hero-deco-2 { bottom: 10%; left: 3%; font-size: 10rem; transform: rotate(-12deg); }

.v2-hero-inner {
    position: relative; z-index: 2; text-align: center; padding: var(--s-3xl) 0;
}
.v2-hero-badge {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 16px; border-radius: var(--r-pill);
    background: rgba(232,183,60,0.12); border: 1px solid rgba(232,183,60,0.3);
    color: var(--v2-gold); font-size: 13px; font-weight: 500; letter-spacing: 1px;
    margin-bottom: var(--s-lg);
}
.v2-hero-badge .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--v2-red-light); box-shadow: 0 0 10px var(--v2-red-light); animation: blink 1.5s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.4} }

.v2-hero-title {
    font-family: var(--font-zh); font-size: clamp(2.5rem, 6vw, 4.8rem);
    font-weight: 900; line-height: 1.15; margin: 0 0 var(--s-md);
    background: linear-gradient(180deg, #F7F1E3 0%, var(--v2-gold) 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
    text-shadow: 0 4px 30px rgba(232,183,60,0.2);
    letter-spacing: 4px;
}
.v2-hero-title .seal {
    display: inline-block; font-family: var(--font-seal);
    background: var(--grad-red); color: var(--v2-ivory);
    -webkit-text-fill-color: var(--v2-ivory);
    padding: 0 14px; border-radius: 6px; transform: rotate(-2deg);
    box-shadow: 0 4px 16px rgba(200,16,46,0.5); margin: 0 4px;
}
.v2-hero-sub {
    font-size: clamp(1rem, 2vw, 1.35rem); color: var(--v2-text-mute);
    max-width: 720px; margin: 0 auto var(--s-xl); line-height: 1.8;
}
/* CTA 按钮 */
.v2-hero-cta {
    display: flex; flex-wrap: wrap; gap: var(--s-md); justify-content: center; margin-bottom: var(--s-2xl);
}
/* 实时数据 */
.v2-hero-stats {
    display: flex; flex-wrap: wrap; gap: var(--s-2xl); justify-content: center;
    padding: var(--s-lg) var(--s-xl); border-radius: var(--r-lg);
    background: rgba(14,11,20,0.5); border: 1px solid var(--v2-line);
    backdrop-filter: blur(10px); max-width: 760px; margin: 0 auto;
}
.v2-stat { text-align: center; min-width: 110px; }
.v2-stat-num {
    font-family: var(--font-zh); font-size: 2rem; font-weight: 800;
    color: var(--v2-gold); line-height: 1;
}
.v2-stat-label { font-size: 13px; color: var(--v2-text-mute); margin-top: 6px; letter-spacing: 1px; }
.v2-stat-divider { width: 1px; background: var(--v2-line); align-self: stretch; }

/* ========== 区块通用 ========== */
.v2-section { padding: var(--s-3xl) 0; position: relative; }
.v2-section-head { text-align: center; margin-bottom: var(--s-2xl); }
.v2-section-eyebrow {
    display: inline-block; font-family: var(--font-seal); color: var(--v2-red-light);
    font-size: 14px; letter-spacing: 6px; margin-bottom: 10px;
}
.v2-section-title {
    font-family: var(--font-zh); font-size: clamp(1.8rem, 4vw, 2.6rem);
    font-weight: 800; color: var(--v2-ivory); margin: 0 0 12px; letter-spacing: 2px;
}
.v2-section-title .accent { color: var(--v2-gold); }
.v2-section-desc { color: var(--v2-text-mute); max-width: 640px; margin: 0 auto; font-size: 16px; }
.v2-section-more { display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; color: var(--v2-gold); font-size: 14px; }

/* ========== 快捷入口 ========== */
.v2-quick-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-lg);
}
.v2-quick-card {
    position: relative; padding: var(--s-xl) var(--s-lg); border-radius: var(--r-lg);
    background: var(--grad-card); border: 1px solid var(--v2-line);
    text-align: center; text-decoration: none; color: var(--v2-text);
    transition: all .3s; overflow: hidden;
}
.v2-quick-card::before {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(135deg, transparent, rgba(232,183,60,0.08));
    opacity: 0; transition: opacity .3s;
}
.v2-quick-card:hover { transform: translateY(-6px); border-color: var(--v2-gold); box-shadow: var(--shadow-card); }
.v2-quick-card:hover::before { opacity: 1; }
.v2-quick-icon {
    width: 72px; height: 72px; margin: 0 auto var(--s-md); border-radius: 50%;
    display: flex; align-items: center; justify-content: center; font-size: 32px;
    background: rgba(232,183,60,0.1); border: 2px solid rgba(232,183,60,0.3);
}
.v2-quick-card:nth-child(1) .v2-quick-icon { background: rgba(200,16,46,0.12); border-color: rgba(200,16,46,0.35); }
.v2-quick-card:nth-child(2) .v2-quick-icon { background: rgba(232,183,60,0.12); border-color: rgba(232,183,60,0.35); }
.v2-quick-card:nth-child(3) .v2-quick-icon { background: rgba(42,157,143,0.12); border-color: rgba(42,157,143,0.35); }
.v2-quick-card:nth-child(4) .v2-quick-icon { background: rgba(123,97,255,0.12); border-color: rgba(123,97,255,0.35); }
.v2-quick-title { font-size: 19px; font-weight: 700; color: var(--v2-ivory); margin-bottom: 6px; }
.v2-quick-desc { font-size: 14px; color: var(--v2-text-mute); }

/* ========== 精选曲库 ========== */
.v2-songs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-lg); }
.v2-song-card {
    position: relative; border-radius: var(--r-lg); overflow: hidden;
    background: var(--grad-card); border: 1px solid var(--v2-line);
    transition: all .3s; cursor: pointer;
}
.v2-song-card:hover { transform: translateY(-4px); border-color: var(--v2-gold); box-shadow: var(--shadow-card); }
.v2-song-cover {
    position: relative; aspect-ratio: 16/10; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--v2-red-dark), var(--v2-ink-2));
    font-size: 3rem;
}
.v2-song-cover::after {
    content: ""; position: absolute; inset: 0;
    background: radial-gradient(circle at 30% 20%, rgba(232,183,60,0.15), transparent 60%);
}
.v2-song-play {
    position: absolute; width: 56px; height: 56px; border-radius: 50%;
    background: var(--grad-gold); color: var(--v2-ink); display: flex;
    align-items: center; justify-content: center; font-size: 22px;
    opacity: 0; transform: scale(.8); transition: all .3s; z-index: 2;
    box-shadow: var(--shadow-gold);
}
.v2-song-card:hover .v2-song-play { opacity: 1; transform: scale(1); }
.v2-song-body { padding: var(--s-md) var(--s-lg) var(--s-lg); }
.v2-song-title { font-family: var(--font-zh); font-size: 19px; font-weight: 700; color: var(--v2-ivory); margin: 0 0 4px; }
.v2-song-artist { color: var(--v2-text-mute); font-size: 14px; margin-bottom: 10px; }
.v2-song-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.v2-tag {
    font-size: 12px; padding: 3px 10px; border-radius: var(--r-pill); font-weight: 500;
}
.v2-tag-red { background: rgba(200,16,46,0.16); color: var(--v2-red-light); }
.v2-tag-gold { background: rgba(232,183,60,0.14); color: var(--v2-gold); }
.v2-tag-jade { background: rgba(42,157,143,0.14); color: var(--v2-jade); }

/* ========== AI推荐 ========== */
.v2-ai-banner {
    position: relative; border-radius: var(--r-xl); padding: var(--s-2xl);
    background: linear-gradient(135deg, rgba(123,97,255,0.18) 0%, rgba(200,16,46,0.12) 50%, rgba(232,183,60,0.15) 100%);
    border: 1px solid rgba(232,183,60,0.3); overflow: hidden;
}
.v2-ai-banner::before {
    content: "AI"; position: absolute; right: -20px; bottom: -40px; font-size: 12rem;
    font-weight: 900; color: rgba(232,183,60,0.06); font-family: var(--font-zh);
}
.v2-ai-banner-inner { position: relative; z-index: 2; display: flex; align-items: center; gap: var(--s-2xl); flex-wrap: wrap; }
.v2-ai-text { flex: 1; min-width: 280px; }
.v2-ai-title { font-family: var(--font-zh); font-size: 2rem; font-weight: 800; color: var(--v2-ivory); margin: 0 0 12px; }
.v2-ai-title .glow { color: var(--v2-gold); text-shadow: 0 0 20px rgba(232,183,60,0.4); }
.v2-ai-desc { color: var(--v2-text-mute); margin-bottom: var(--s-lg); }
.v2-ai-input {
    display: flex; gap: var(--s-sm); max-width: 520px;
    background: rgba(14,11,20,0.6); border: 1px solid var(--v2-line);
    border-radius: var(--r-pill); padding: 6px 6px 6px 20px;
}
.v2-ai-input input {
    flex: 1; background: transparent; border: none; outline: none;
    color: var(--v2-text); font-size: 15px; padding: 10px 0; font-family: inherit;
}
.v2-ai-input input::placeholder { color: var(--v2-text-dim); }
.v2-ai-suggest { display: flex; gap: 8px; flex-wrap: wrap; margin-top: var(--s-md); }
.v2-ai-chip {
    font-size: 13px; padding: 6px 14px; border-radius: var(--r-pill);
    background: rgba(232,183,60,0.1); border: 1px solid var(--v2-line); color: var(--v2-gold);
    cursor: pointer; transition: all .2s;
}
.v2-ai-chip:hover { background: rgba(232,183,60,0.2); }
.v2-ai-visual { flex: 0 0 200px; text-align: center; }
.v2-ai-orb {
    width: 160px; height: 160px; border-radius: 50%; margin: 0 auto;
    background: radial-gradient(circle, var(--v2-gold) 0%, var(--v2-red) 60%, transparent 80%);
    filter: blur(2px); opacity: .7; animation: orbFloat 4s ease-in-out infinite;
}
@keyframes orbFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }

/* ========== 名家殿堂 ========== */
.v2-artists { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-lg); }
.v2-artist {
    text-align: center; padding: var(--s-xl) var(--s-md); border-radius: var(--r-lg);
    background: var(--grad-card); border: 1px solid var(--v2-line); transition: all .3s;
}
.v2-artist:hover { border-color: var(--v2-gold); transform: translateY(-4px); }
.v2-artist-avatar {
    width: 96px; height: 96px; border-radius: 50%; margin: 0 auto var(--s-md);
    background: var(--grad-red); display: flex; align-items: center; justify-content: center;
    font-size: 36px; color: var(--v2-ivory); font-family: var(--font-seal);
    border: 3px solid rgba(232,183,60,0.5); box-shadow: var(--shadow-red);
}
.v2-artist-name { font-family: var(--font-zh); font-size: 20px; font-weight: 700; color: var(--v2-ivory); }
.v2-artist-role { font-size: 13px; color: var(--v2-gold); margin: 4px 0 8px; }
.v2-artist-desc { font-size: 13px; color: var(--v2-text-mute); }

/* ========== 学堂 ========== */
.v2-learn-grid { display: grid; grid-template-columns: 2fr 1fr; gap: var(--s-lg); }
.v2-learn-main {
    border-radius: var(--r-lg); overflow: hidden; position: relative; min-height: 320px;
    background: linear-gradient(135deg, var(--v2-red-dark), var(--v2-ink-2));
    display: flex; align-items: flex-end; padding: var(--s-xl);
}
.v2-learn-main::before {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(0deg, rgba(14,11,20,0.9) 0%, transparent 60%);
}
.v2-learn-main-content { position: relative; z-index: 2; }
.v2-learn-main h3 { font-family: var(--font-zh); font-size: 1.8rem; color: var(--v2-ivory); margin: 0 0 8px; }
.v2-learn-list { display: flex; flex-direction: column; gap: var(--s-md); }
.v2-learn-item {
    padding: var(--s-lg); border-radius: var(--r-md); background: var(--grad-card);
    border: 1px solid var(--v2-line); display: flex; gap: var(--s-md); align-items: center;
    transition: all .3s; cursor: pointer;
}
.v2-learn-item:hover { border-color: var(--v2-gold); transform: translateX(4px); }
.v2-learn-num { font-family: var(--font-zh); font-size: 28px; font-weight: 800; color: var(--v2-gold); opacity: .6; }
.v2-learn-item h4 { margin: 0; font-size: 16px; color: var(--v2-ivory); }
.v2-learn-item p { margin: 2px 0 0; font-size: 13px; color: var(--v2-text-mute); }

/* ========== 社群动态 ========== */
.v2-community-grid { display: grid; grid-template-columns: 2fr 1fr; gap: var(--s-lg); }
.v2-feed { display: flex; flex-direction: column; gap: var(--s-md); }
.v2-post {
    padding: var(--s-lg); border-radius: var(--r-lg); background: var(--grad-card);
    border: 1px solid var(--v2-line);
}
.v2-post-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.v2-post-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--grad-red); display: flex; align-items: center; justify-content: center; color: var(--v2-ivory); font-weight: 700; }
.v2-post-name { font-weight: 700; color: var(--v2-ivory); }
.v2-post-meta { font-size: 12px; color: var(--v2-text-dim); }
.v2-post-text { color: var(--v2-text); margin-bottom: 12px; }
.v2-post-actions { display: flex; gap: var(--s-lg); color: var(--v2-text-mute); font-size: 14px; }
.v2-post-actions span { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.v2-post-actions span:hover { color: var(--v2-gold); }
.v2-sidebar-card {
    padding: var(--s-lg); border-radius: var(--r-lg); background: var(--grad-card);
    border: 1px solid var(--v2-line); margin-bottom: var(--s-md);
}
.v2-sidebar-card h4 { margin: 0 0 var(--s-md); color: var(--v2-gold); font-size: 16px; }
.v2-circle-item { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--v2-line); }
.v2-circle-item:last-child { border: none; }
.v2-circle-item .v2-post-avatar { width: 36px; height: 36px; font-size: 14px; }

/* ========== 全球曲社地图 ========== */
.v2-map-section {
    position: relative; border-radius: var(--r-xl); overflow: hidden;
    background: linear-gradient(160deg, rgba(42,157,143,0.1), rgba(14,11,20,0.6));
    border: 1px solid var(--v2-line); padding: var(--s-2xl);
}
.v2-map-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-md); margin-top: var(--s-xl); }
.v2-map-card {
    padding: var(--s-lg); border-radius: var(--r-md); background: rgba(14,11,20,0.5);
    border: 1px solid var(--v2-line); transition: all .3s;
}
.v2-map-card:hover { border-color: var(--v2-jade); transform: translateY(-3px); }
.v2-map-city { display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--v2-ivory); margin-bottom: 6px; }
.v2-map-city i { color: var(--v2-jade); }
.v2-map-count { font-size: 13px; color: var(--v2-text-mute); }

/* ========== APP下载 ========== */
.v2-app-section {
    display: flex; align-items: center; gap: var(--s-2xl); flex-wrap: wrap;
    padding: var(--s-2xl); border-radius: var(--r-xl);
    background: linear-gradient(135deg, rgba(200,16,46,0.15), rgba(232,183,60,0.1));
    border: 1px solid var(--v2-line); position: relative; overflow: hidden;
}
.v2-app-text { flex: 1; min-width: 300px; }
.v2-app-text h2 { font-family: var(--font-zh); font-size: 2.2rem; color: var(--v2-ivory); margin: 0 0 12px; }
.v2-app-text p { color: var(--v2-text-mute); margin-bottom: var(--s-lg); }
.v2-app-buttons { display: flex; gap: var(--s-md); flex-wrap: wrap; }
.v2-app-btn {
    display: inline-flex; align-items: center; gap: 10px; padding: 12px 22px; border-radius: var(--r-md);
    background: rgba(14,11,20,0.6); border: 1px solid var(--v2-line); color: var(--v2-text);
    text-decoration: none; transition: all .3s;
}
.v2-app-btn:hover { background: rgba(232,183,60,0.1); border-color: var(--v2-gold); color: var(--v2-gold); }
.v2-app-btn .icon { font-size: 26px; }
.v2-app-btn .label { font-size: 11px; opacity: .7; }
.v2-app-btn .name { font-size: 16px; font-weight: 700; line-height: 1.2; }
.v2-app-mockup {
    flex: 0 0 240px; height: 440px; border-radius: 32px; border: 6px solid #2a2330;
    background: linear-gradient(160deg, var(--v2-red-dark), var(--v2-ink-2));
    box-shadow: var(--shadow-card); position: relative; padding: 20px 16px; text-align: center;
}
.v2-app-mockup::before {
    content: ""; position: absolute; top: 8px; left: 50%; transform: translateX(-50%);
    width: 90px; height: 6px; border-radius: 4px; background: #0a0a0a;
}
.v2-app-mockup h4 { color: var(--v2-gold); font-family: var(--font-zh); margin: 16px 0 8px; }
.v2-app-mockup .v2-quick-grid { grid-template-columns: repeat(2,1fr); gap: 8px; margin-top: 16px; }
.v2-app-mockup .v2-quick-card { padding: 12px 8px; }
.v2-app-mockup .v2-quick-icon { width: 40px; height: 40px; font-size: 18px; }
.v2-app-mockup .v2-quick-title { font-size: 12px; }
.v2-app-mockup .v2-quick-desc { display: none; }

/* ========== 底部 ========== */
.v2-footer { background: var(--v2-ink-2); border-top: 1px solid var(--v2-line); padding: var(--s-2xl) 0 var(--s-xl); margin-top: var(--s-3xl); }
.v2-footer-inner { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--s-xl); }
.v2-footer-brand .v2-logo-text { font-size: 24px; }
.v2-footer-brand p { color: var(--v2-text-mute); font-size: 14px; margin-top: 12px; max-width: 320px; }
.v2-footer-col h5 { color: var(--v2-gold); font-size: 15px; margin: 0 0 var(--s-md); font-weight: 700; }
.v2-footer-col a { display: block; color: var(--v2-text-mute); font-size: 14px; padding: 4px 0; }
.v2-footer-col a:hover { color: var(--v2-gold); }
.v2-footer-bottom { text-align: center; padding-top: var(--s-lg); margin-top: var(--s-xl); border-top: 1px solid var(--v2-line); color: var(--v2-text-dim); font-size: 13px; }

/* ========== 响应式 ========== */
@media (max-width: 960px) {
    .v2-quick-grid, .v2-songs-grid, .v2-artists, .v2-map-grid { grid-template-columns: repeat(2, 1fr); }
    .v2-learn-grid, .v2-community-grid { grid-template-columns: 1fr; }
    .v2-footer-inner { grid-template-columns: 1fr 1fr; }
    .v2-nav-links { display: none; }
    .v2-app-mockup { display: none; }
}
@media (max-width: 560px) {
    .v2-quick-grid, .v2-songs-grid, .v2-artists, .v2-map-grid { grid-template-columns: 1fr; }
    .v2-footer-inner { grid-template-columns: 1fr; }
    .v2-hero { min-height: 80vh; }
    .v2-hero-stats { gap: var(--s-lg); padding: var(--s-md); }
    .v2-stat-divider { display: none; }
    .v2-section { padding: var(--s-2xl) 0; }
}