/* ============================================================
 * PICASSOS 主站暗夜模式 · 黑金 v2（2026-11-01 重做）
 * 挂载方式：<html class="dark">，footer.php 浮动球切换，localStorage 记忆
 * ------------------------------------------------------------
 * 为什么重做：
 *   v1 底色 #0D0906 是「暖棕黑」，卡片 #17110A 更黄 → 整体发脏发土；
 *   描边统一用纯金黄 #D4AF37 → 土豪金；
 *   主按钮还是红色 → 红金同屏、两个强调色互相打架；
 *   logo 是深色图片没做反色 → 深底上看不见。
 * ------------------------------------------------------------
 * v2 色板（只保留一套，全站只用这些）：
 *   base      #0A0A0C   中性冷黑         surface  #0D0D11  分区
 *   card      #131318   卡片             raise    #181820  卡片浮起
 *   line      rgba(255,255,255,.07)     金线     rgba(201,165,94,.16)
 *   gold      #C9A55E   主金             hi       #E4CE9B  高光
 *   gold-deep #A6833F   暗金             ink      #D2B67C  金文字
 *   text      #F3EFE7   主文字           sub      #A6A099  次文字
 *   mute      #7B756E   弱文字
 * 原则：① 靠明度分层，不靠色相；② 金只做线/字/唯一 CTA，不做大面积填充；
 *       ③ 红全部退场；④ 只覆盖不改 main.css，回退 = 换回 v1 备份即可。
 * ============================================================ */

/* ---------- 令牌 ---------- */
html.dark{
    --color-bg: #0A0A0C !important;
    --color-bg-light: #0A0A0C !important;
    --color-bg-secondary: #0D0D11 !important;
    --color-bg-card: #131318 !important;
    --color-text: #F3EFE7 !important;
    --color-text-secondary: #A6A099 !important;
    --color-text-muted: #7B756E !important;
    --color-border: rgba(201,165,94,.16) !important;
    --color-primary: #F3EFE7 !important;
    --color-accent: #C9A55E !important;
    --color-gold: #C9A55E !important;

    --bg-base:#0A0A0C;
    --bg-surface:#0D0D11;
    --bg-card:#131318;
    --bg-raise:#181820;
    --line:rgba(255,255,255,.07);
    --line-gold:rgba(201,165,94,.16);
    --gold:#C9A55E;
    --gold-hi:#E4CE9B;
    --gold-deep:#A6833F;
    --ink-gold:#D2B67C;
    --t1:#F3EFE7;
    --t2:#A6A099;
    --t3:#89837C;
    color-scheme: dark;
}

/* ---------- 根 ---------- */
html.dark body{
    background:var(--bg-base) !important;
    color:var(--t1) !important;
}
html.dark ::selection{ background:rgba(201,165,94,.3); color:#FFF9EC; }

/* ---------- 顶部导航 ---------- */
html.dark .site-header{
    background:rgba(10,10,12,.82) !important;
    border-bottom:1px solid var(--line-gold) !important;
    backdrop-filter:blur(22px) saturate(1.25) blur(0);
}
/* 2026-11-02 00:52 logo 改版：现在深底用的是**白字版原图**（.lg-on-dark），
   不再需要"反白染金"这一手 —— 那滤镜会把人脸章的红黄绿一起染成一坨金。
   下面这条只留给没挂 .lg-on-* 的旧结构，防止其它页面残留深色图看不见。 */
html.dark .site-header img.logo:not(.lg-on-light):not(.lg-on-dark),
html.dark .site-header .logo img:not(.lg-on-light):not(.lg-on-dark),
html.dark .site-logo img:not(.lg-on-light):not(.lg-on-dark),
html.dark .header-logo img:not(.lg-on-light):not(.lg-on-dark),
html.dark .site-header a > img:not(.lg-on-light):not(.lg-on-dark){
    filter:brightness(0) invert(1) sepia(.42) saturate(2.8) hue-rotate(3deg) brightness(1.08);
}
html.dark .site-logo,
html.dark .site-header .logo{ color:var(--t1) !important; }
html.dark .main-nav a,
html.dark .nav-link{ color:#B9B3A9 !important; }
html.dark .main-nav a:hover,
html.dark .main-nav a.active,
html.dark .main-nav a.current-menu-item,
html.dark .nav-link:hover,
html.dark .nav-link.active{ color:var(--gold-hi) !important; }
html.dark .main-nav a.reg{ border-color:rgba(201,165,94,.5) !important; color:var(--ink-gold) !important; }
html.dark .main-nav a.reg:hover{ background:rgba(201,165,94,.12) !important; color:var(--gold-hi) !important; }

/* ---------- 首屏 ---------- */
/* v1 的金色光晕压在棕底上发污；v2 改成极淡的冷调聚光 + 底部一条金线收口 */
html.dark .hero-section{
    background:
        radial-gradient(900px 420px at 78% -12%, rgba(201,165,94,.07), transparent 65%),
        linear-gradient(180deg,#0C0C10 0%,var(--bg-base) 72%) !important;
}
html.dark .hero-title,
html.dark .hero-headline{ color:#F7F3EA !important; }
html.dark .hero-headline .highlight,
html.dark .hero-title em,
html.dark .hero-title strong{ color:var(--gold-hi) !important; }
html.dark .hero-lead,
html.dark .hero-subtitle{ color:var(--t2) !important; }
html.dark .hero-kicker{ color:var(--gold) !important; letter-spacing:2.5px; }
html.dark .hero-badge{
    background:rgba(201,165,94,.09) !important;
    border-color:rgba(201,165,94,.34) !important;
    color:var(--ink-gold) !important;
}
html.dark .hero-card{
    background:var(--bg-card) !important;
    border:1px solid var(--line-gold) !important;
    box-shadow:0 28px 70px rgba(0,0,0,.6) !important;
}
html.dark .hero-open-btn,
html.dark .hero-close-btn{ color:var(--ink-gold) !important; }
html.dark .hero-media{ background:var(--bg-base) !important; }

/* ---------- 通用区块底：靠明度切节奏，不用色相 ---------- */
html.dark .series-section,
html.dark .scenes-section,
html.dark .faq-section,
html.dark .brand-section,
html.dark .feature-section,
html.dark .stats-section{ background:var(--bg-base) !important; }
html.dark .paintings-section,
html.dark .preview-promo{ background:var(--bg-surface) !important; }
/* 去掉 v1 的整段渐变（棕调来源） */
html.dark .series-section:nth-of-type(odd),
html.dark .scenes-section,
html.dark .preview-promo{ background:var(--bg-surface) !important; }
html.dark .scenes-section,
html.dark .faq-section{ background:var(--bg-base) !important; }

/* ---------- 区块标题 ---------- */
html.dark .section-label{ color:#9C8A64 !important; letter-spacing:3.5px; }
html.dark .section-title{ color:#F5F1E8 !important; }
html.dark .section-note{ color:#8C867F !important; }
html.dark .section-header .en,
html.dark .sec-en{ color:rgba(201,165,94,.72) !important; }

/* ---------- 卡片：系列 / 名画 / 场景 ---------- */
html.dark .series-card,
html.dark .scene-card,
html.dark .painting-card,
html.dark .feature-card,
html.dark .stat-card{
    background:var(--bg-card) !important;
    border:1px solid var(--line-gold) !important;
    box-shadow:0 14px 38px rgba(0,0,0,.55) !important;
}
html.dark .series-card:hover,
html.dark .scene-card:hover,
html.dark .painting-card:hover{
    border-color:rgba(201,165,94,.46) !important;
    box-shadow:0 24px 58px rgba(0,0,0,.7), 0 0 0 1px rgba(201,165,94,.16) !important;
}
html.dark .series-name,
html.dark .scene-name,
html.dark .painting-name,
html.dark .scene-card .scene-name{ color:#EDE7DC !important; }
html.dark .series-desc,
html.dark .scene-desc,
html.dark .painting-desc{ color:#8E8880 !important; }
html.dark .series-en,
html.dark .series-size{ color:rgba(201,165,94,.85) !important; }
html.dark .series-link,
html.dark .scene-link,
html.dark .painting-link{ color:var(--ink-gold) !important; }
html.dark .series-link:hover,
html.dark .scene-link:hover{ color:var(--gold-hi) !important; }

/* 白底产品图收边：让它像“展品照片”，而不是贴一块白纸 */
html.dark .series-image,
html.dark .scene-image,
html.dark .painting-card > img{
    background:#0F0F14 !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);
}
/* 图片直接盖住了容器的 inset 阴影，用伪元素把金线画在图上面 */
html.dark .series-image,
html.dark .scene-image{ position:relative; }
html.dark .series-image::after,
html.dark .scene-image::after{
    content:''; position:absolute; inset:0; pointer-events:none;
    box-shadow:inset 0 0 0 1px rgba(201,165,94,.2);
}
html.dark .series-num{
    background:rgba(10,10,12,.7) !important;
    color:var(--ink-gold) !important;
    border:1px solid rgba(201,165,94,.3) !important;
    backdrop-filter:blur(6px);
    letter-spacing:1px;
}

/* ---------- 名画区 ---------- */
html.dark .paintings-track{ background:transparent !important; }
html.dark .paintings-more{ color:var(--ink-gold) !important; }
html.dark .painting-frame,
html.dark .painting-meta{ background:var(--bg-card) !important; border-color:var(--line-gold) !important; }
html.dark .painting-overlay{ background:linear-gradient(to top,rgba(8,8,10,.94) 0%,rgba(8,8,10,.55) 45%,transparent 100%) !important; }
html.dark .painting-overlay h4{ color:#F5F1E8 !important; }
html.dark .painting-en{ color:rgba(201,165,94,.85) !important; }
html.dark .painting-year{ color:#9A948B !important; }

/* ---------- 按钮：金色实底 = 唯一强 CTA；描边按钮走金线 ---------- */
html.dark .btn-primary,
html.dark .btn-red,
html.dark .hero-actions .btn-primary{
    background:linear-gradient(135deg,#E0C68E 0%,var(--gold) 46%,var(--gold-deep) 100%) !important;
    border:1px solid rgba(228,206,155,.42) !important;
    color:#12100A !important;
    font-weight:700 !important;
    box-shadow:0 8px 26px rgba(201,165,94,.22) !important;
}
html.dark .btn-primary:hover,
html.dark .btn-primary:active,
html.dark .hero-actions .btn-primary:hover{
    background:linear-gradient(135deg,#F0DCB0,var(--gold-hi)) !important;
    border-color:var(--gold-hi) !important;
    color:#12100A !important;
    box-shadow:0 12px 34px rgba(201,165,94,.34) !important;
}
/* hero 描边按钮：原规则 (0,3,0)+important，这里对等加权压制 */
html.dark .hero-actions .btn-primary.btn-outline{
    background:transparent !important;
    border:1px solid rgba(201,165,94,.38) !important;
    color:#D8C597 !important;
    font-weight:500 !important;
    box-shadow:none !important;
}
html.dark .hero-actions .btn-primary.btn-outline:hover{
    background:rgba(201,165,94,.12) !important;
    border-color:var(--gold) !important;
    color:var(--gold-hi) !important;
}
html.dark .btn-outline,
html.dark .btn-ghost,
html.dark .btn-secondary{
    background:transparent !important;
    border:1px solid rgba(201,165,94,.4) !important;
    color:var(--ink-gold) !important;
}
html.dark .btn-outline:hover,
html.dark .btn-ghost:hover,
html.dark .btn-secondary:hover{
    background:rgba(201,165,94,.12) !important;
    border-color:var(--gold) !important;
    color:var(--gold-hi) !important;
}

/* ---------- 功能说明条 ---------- */
html.dark .tool-strip{
    background:var(--bg-surface) !important;
    border-top:1px solid var(--line) !important;
    border-bottom:1px solid var(--line) !important;
}
html.dark .tool-strip p{ color:var(--t3) !important; }
html.dark .tool-strip b{ color:var(--ink-gold) !important; }

/* ---------- 实景预告区 ---------- */
html.dark .promo-label{ color:var(--gold) !important; }
html.dark .promo-badge{
    background:var(--gold) !important;
    color:#12100A !important;
    font-weight:700 !important;
    letter-spacing:2px;
}
html.dark .promo-copy .btn-primary{
    background:linear-gradient(135deg,#E0C68E 0%,var(--gold) 46%,var(--gold-deep) 100%) !important;
    color:#12100A !important;
    border-color:rgba(228,206,155,.42) !important;
}
html.dark .promo-features li::before{ background:var(--gold) !important; }
html.dark .hero-sub-link{ color:#A8A29A !important; border-bottom-color:rgba(201,165,94,.3) !important; }
html.dark .hero-sub-link:hover{ color:var(--gold-hi) !important; border-bottom-color:var(--gold) !important; }
html.dark .promo-title{ color:#F3EFE7 !important; }
html.dark .promo-desc,
html.dark .promo-features li{ color:var(--t2) !important; }
html.dark .promo-card,
html.dark .faq-card{
    background:var(--bg-card) !important;
    border:1px solid var(--line-gold) !important;
}
html.dark .promo-visual-top{
    background:var(--bg-raise) !important;
    border-color:var(--line-gold) !important;
    box-shadow:0 14px 34px rgba(0,0,0,.55), 0 0 0 1px rgba(201,165,94,.2) !important;
    color:var(--ink-gold) !important;
}
html.dark .promo-visual-top span{ color:var(--ink-gold) !important; }
html.dark .promo-visual-note{ color:var(--t3) !important; }

/* ---------- FAQ ---------- */
html.dark .faq-item{
    background:#111116 !important;
    border:1px solid var(--line-gold) !important;
}
html.dark .faq-q{ color:#EDE7DC !important; }
html.dark .faq-a{ color:#948E85 !important; }

/* ---------- 申请表单区（原来是 #F5F1E8 米色大块） ---------- */
html.dark .apply-preview{
    background:
        radial-gradient(760px 300px at 22% 0%, rgba(201,165,94,.06), transparent 62%),
        var(--bg-surface) !important;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
}
html.dark .apply-badge{
    background:rgba(201,165,94,.1) !important;
    border:1px solid rgba(201,165,94,.3) !important;
    color:var(--ink-gold) !important;
}
html.dark .apply-title{ color:#F5F1E8 !important; }
html.dark .apply-desc{ color:var(--t2) !important; }
html.dark .apply-points li{ color:var(--t2) !important; }
html.dark .apply-points b{ color:var(--ink-gold) !important; }
html.dark .apply-points li::before{ background:var(--gold) !important; }

/* 表单本体（pcs-form 组件，原 theme=light 是白卡） */
html.dark .pcs-form{
    background:var(--bg-card) !important;
    border:1px solid var(--line-gold) !important;
    box-shadow:0 30px 70px rgba(0,0,0,.6) !important;
}
html.dark .pcs-form__title{ color:#F5F1E8 !important; }
html.dark .pcs-form__sub{ color:var(--t3) !important; }
html.dark .pcs-field label{ color:#A8A29A !important; }
html.dark .pcs-field .req{ color:var(--gold) !important; }
html.dark .pcs-form input[type="text"],
html.dark .pcs-form input[type="tel"],
html.dark .pcs-form input[type="email"],
html.dark .pcs-form textarea,
html.dark .pcs-form select{
    background:#1B1B22 !important;
    border:1px solid rgba(201,165,94,.2) !important;
    color:#EDE7DC !important;
}
html.dark .pcs-form input::placeholder,
html.dark .pcs-form textarea::placeholder{ color:#615C56 !important; }
html.dark .pcs-form input:focus,
html.dark .pcs-form textarea:focus,
html.dark .pcs-form select:focus{
    border-color:var(--gold) !important;
    background:#1F1F27 !important;
    box-shadow:0 0 0 3px rgba(201,165,94,.12) !important;
    outline:none !important;
}
html.dark .pcs-submit{
    background:linear-gradient(135deg,#E0C68E,var(--gold) 50%,var(--gold-deep)) !important;
    color:#12100A !important;
    font-weight:700 !important;
    border:none !important;
    box-shadow:0 10px 30px rgba(201,165,94,.26) !important;
}
html.dark .pcs-submit:hover{ background:linear-gradient(135deg,#F0DCB0,var(--gold-hi)) !important; }
html.dark .pcs-note{ color:#6F6A64 !important; }
html.dark .pcs-done__t{ color:#F5F1E8 !important; }
html.dark .pcs-done__d{ color:var(--t2) !important; }

/* ---------- 影楼合作 banner ---------- */
html.dark .biz-banner{
    background:#070709 !important;
    border-top:1px solid var(--line-gold) !important;
    border-bottom:1px solid var(--line-gold) !important;
}
html.dark .biz-banner .biz-tag{
    background:rgba(201,165,94,.08) !important;
    border-color:rgba(201,165,94,.34) !important;
    color:var(--gold) !important;
}
html.dark .biz-banner h2{ color:#F4EEE0 !important; }
html.dark .biz-banner h2 em{ color:var(--gold-hi) !important; }
html.dark .biz-banner p{ color:#A9A091 !important; }
html.dark .biz-banner .biz-btn{
    background:linear-gradient(135deg,#E0C68E,var(--gold) 50%,var(--gold-deep)) !important;
    color:#12100A !important;
    font-weight:700 !important;
    box-shadow:0 10px 28px rgba(201,165,94,.2) !important;
}
html.dark .biz-banner .biz-btn:hover{ background:linear-gradient(135deg,#F0DCB0,var(--gold-hi)) !important; }
html.dark .biz-banner .biz-link{ color:#C9B78E !important; }
html.dark .biz-banner .biz-stats div{
    border-color:rgba(201,165,94,.2) !important;
    background:rgba(201,165,94,.035) !important;
}
html.dark .biz-banner .biz-stats b{ color:var(--gold-hi) !important; }
html.dark .biz-banner .biz-stats span{ color:#8E8779 !important; }

/* ---------- 页脚 ---------- */
html.dark .site-footer{
    background:#070709 !important;
    border-top:1px solid var(--line-gold) !important;
    color:#8B857D !important;
}
html.dark .footer-brand,
html.dark .footer-col h4,
html.dark .footer-col b{ color:#E8E2D6 !important; }
html.dark .footer-col a,
html.dark .footer-col span,
html.dark .footer-bottom,
html.dark .footer-note{ color:#8A847D !important; }
html.dark .footer-col a:hover{ color:var(--gold-hi) !important; }
html.dark .footer-brand .official,
html.dark .footer-license{ color:#8A847D !important; }
html.dark .footer-dot,
html.dark .official-dot{ background:var(--gold) !important; }

/* ---------- 手机端底部导航（main.css 1900 行强制白底 +!important，这里对等压制） ---------- */
html.dark .mobile-bottom-nav{
    background:rgba(10,10,12,.94) !important;
    border-top:1px solid var(--line-gold) !important;
    backdrop-filter:blur(20px);
}
html.dark .bottom-nav-item{ color:#7E7871 !important; }
html.dark .bottom-nav-item.active{ color:var(--gold-hi) !important; }
html.dark .mobile-nav,
html.dark .mobile-nav-panel{ background:var(--bg-surface) !important; }
html.dark .mobile-nav a{ color:#9E988F !important; border-color:var(--line) !important; }
html.dark .mobile-nav .mnav-item{ color:#9E988F !important; }
html.dark .mobile-nav .mnav-item.active{ color:var(--gold-hi) !important; }

/* ---------- 浮动切换球 ---------- */
.cs-fab{
    position:fixed; right:22px; bottom:26px; z-index:300;
    width:56px; height:56px; border-radius:50%;
    border:1px solid rgba(232,213,168,.55);
    background:linear-gradient(145deg,#2A2418,#0A0A0C 70%);
    color:#E4CE9B; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 26px rgba(0,0,0,.5), 0 0 0 0 rgba(201,165,94,.5);
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    -webkit-tap-highlight-color:transparent;
}
.cs-fab:hover{ transform:translateY(-3px) scale(1.05); border-color:#E4CE9B; box-shadow:0 12px 32px rgba(0,0,0,.6), 0 0 24px rgba(201,165,94,.32); }
.cs-fab:active{ transform:scale(.94); }
.cs-fab svg{ width:24px; height:24px; }
.cs-fab .cs-dot{
    position:absolute; top:5px; right:5px; width:10px; height:10px; border-radius:50%;
    background:#A6A099; border:1.5px solid #F5F2EC; transition:background .3s ease, box-shadow .3s ease;
}
/* 2026-11-01 23:52：球里换成 logo 的圆形徽标（米白圆盘），
   金底上会糊成一片 —— 黑金这一套改深底 + 金细圈，徽标才立得住。 */
html.dark .cs-fab{
    background:linear-gradient(145deg,#1C180F,#0A0A0C 70%);
    color:#15130D; border-color:rgba(228,206,155,.65);
}
html.dark .cs-fab .cs-dot{
    background:#E4CE9B; border-color:#15130D;
    box-shadow:0 0 8px rgba(228,206,155,.9);
}
.cs-toast{
    position:fixed; right:24px; bottom:94px; z-index:300;
    background:rgba(10,10,12,.94); color:#E4CE9B;
    border:1px solid rgba(201,165,94,.38);
    padding:9px 16px; border-radius:18px; font-size:13px; letter-spacing:1px;
    box-shadow:0 10px 30px rgba(0,0,0,.45);
    opacity:0; transform:translateY(8px); pointer-events:none;
    transition:opacity .3s ease, transform .3s ease;
}
.cs-toast.show{ opacity:1; transform:translateY(0); }

/* 手机端：避开底部导航（58px + 安全区） */
@media (max-width:768px){
    .cs-fab{ right:16px; bottom:calc(76px + env(safe-area-inset-bottom, 0px)); width:50px; height:50px; }
    .cs-fab svg{ width:21px; height:21px; }
    .cs-toast{ bottom:calc(140px + env(safe-area-inset-bottom, 0px)); right:18px; }
}

/* ---------- 切换过渡（淡入，不闪变） ---------- */
body, .site-header, .hero-section, .series-section, .paintings-section,
.scenes-section, .preview-promo, .apply-preview, .faq-section, .biz-banner, .site-footer,
.series-card, .scene-card, .painting-card, .faq-item, .hero-card, .pcs-form{
    transition:background-color .45s ease, color .45s ease, border-color .45s ease;
}