/**
 * AUM DAPP theme tokens
 * Light = Aurora §0C.11（ui-sapphire-system + ui-index-aurora-light · 不改）
 * Dark  = Neon Suno #101012 + 粉黄 CTA（VI-HOTFIX-02）
 */

html.aum-theme-boot[data-aum-theme] body,
html.aum-theme-boot[data-aum-theme] .content,
html.aum-theme-boot[data-aum-theme] .page,
html.aum-theme-boot[data-aum-theme] .topbar-shell,
html.aum-theme-boot[data-aum-theme] .vision-topbar-shell,
html.aum-theme-boot[data-aum-theme] .bottom-player,
html.aum-theme-boot[data-aum-theme] #bottomPlayer,
html.aum-theme-boot[data-aum-theme] .sidebar,
html.aum-theme-boot[data-aum-theme] .sidebar-item,
html.aum-theme-boot[data-aum-theme] .sidebar-item.ready,
html.aum-theme-switching .sidebar,
html.aum-theme-switching .sidebar-item,
html.aum-theme-switching .sidebar-item.ready,
html.aum-theme-switching .sidebar-theme-block,
html.aum-theme-switching .sidebar-footer {
    transition: none !important;
}

html[data-aum-theme] body,
html[data-aum-theme] .content,
html[data-aum-theme] .page,
html[data-aum-theme] .topbar-shell,
html[data-aum-theme] .vision-topbar-shell,
html[data-aum-theme] .bottom-player,
html[data-aum-theme] #bottomPlayer,
html[data-aum-theme] .sidebar {
    transition:
        background-color 0.38s cubic-bezier(0.4, 0, 0.2, 1),
        color 0.28s ease,
        border-color 0.28s ease,
        box-shadow 0.28s ease;
}

/* Neon Dark — 仅 dark 态注入 token */
html[data-aum-theme="dark"] {
    --bg-page: #101012;
    --bg-mesh: radial-gradient(ellipse 90% 55% at 50% -15%, rgba(253, 66, 156, 0.18), transparent 55%), radial-gradient(circle at 85% 90%, rgba(245, 217, 7, 0.10), transparent 45%), #101012;
    --bg-card: #17171A;
    --bg-card-tint: rgba(253, 66, 156, 0.08);
    --bg-card-elevated: #1F1F23;
    --bg-input: #1F1F23;
    --bg-chip: rgba(255, 255, 255, 0.06);
    --bg-overlay: rgba(0, 0, 0, 0.72);
    --brand-solid: #FD429C;
    --brand-violet: #8B5CF6;
    --brand-chartreuse: #D2E823;
    --brand-coral: #FF6B35;
    --brand-mint: #00D4AA;
    --brand-primary: #FD429C;
    --brand-hover: #E03588;
    --brand-light: rgba(253, 66, 156, 0.14);
    --brand-muted: rgba(253, 66, 156, 0.08);
    --text-title: #F7F4EF;
    --text-body: #C2C2C1;
    --text-secondary: #9A9A99;
    --text-weak: #6E6E6D;
    --text-muted: #6E6E6D;
    --text-brand: #FD429C;
    --text-on-brand: #101012;
    --border-card: rgba(255, 255, 255, 0.08);
    --border-divider: rgba(255, 255, 255, 0.06);
    --border-input: rgba(255, 255, 255, 0.10);
    --border-focus: #FD429C;
    --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.55);
    --shadow-card-hover: 0 8px 32px rgba(253, 66, 156, 0.18);
    --shadow-btn: 0 6px 28px rgba(253, 66, 156, 0.45);
    --shadow-play: 0 6px 28px rgba(253, 66, 156, 0.45);
    --shadow-dropdown: 0 12px 40px rgba(0, 0, 0, 0.65);
    --gradient-cta: linear-gradient(90deg, #FD429C, #F5D907);
    --gradient-cta-hover: linear-gradient(90deg, #E03588, #E0C806);
    --gradient-brand: var(--gradient-cta);
    --gradient-gem: linear-gradient(90deg, #FD429C, #FF6B35 42%, #F5D907);
    --gradient-sidebar-active: linear-gradient(90deg, rgba(253, 66, 156, 0.16), rgba(245, 217, 7, 0.08));
    --wallet-chip-bg: rgba(233, 192, 233, 0.22);
    --wallet-chip-text: #E9C0E9;
    --topbar-bg: rgba(16, 16, 18, 0.94);
    --topbar-border: rgba(255, 255, 255, 0.08);
    --player-bg: rgba(23, 23, 26, 0.96);
    --player-border: rgba(255, 255, 255, 0.08);
    --meta-theme-color: #101012;
    --color-success: #34C759;
    --color-danger: #FF453A;
    --color-warning: #FF9F0A;
    --ease-theme: 0.38s cubic-bezier(0.4, 0, 0.2, 1);
}

html[data-aum-theme="dark"] body {
    background: var(--bg-mesh);
    background-attachment: fixed;
    color: var(--text-body);
}

html[data-aum-theme="dark"] .text-gem {
    background: var(--gradient-gem) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
}

html[data-aum-theme="dark"].aum-sapphire-dapp .song-progress-bar-fill,
html[data-aum-theme="dark"].aum-sapphire-dapp .progress-fill,
html[data-aum-theme="dark"].aum-sapphire-dapp .bp-progress-fill {
    background: var(--gradient-cta) !important;
}
