/* ============================================
   全站壳层 — 克制玻璃态 / 暖奶油纯色底
   依赖 base.css 中的 --glass-* / --bg-color
   ============================================ */

/* ── 全站纯色底（浅色模式，暖奶油纸感） ── */
body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-color: var(--bg-color);
    background-image: none;
}

body.hub-embed::before {
    display: none;
}

html[data-theme="dark"] body::before {
    display: none;
}

/* ── 可复用 surface 类 ── */
.surface-glass {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    border-radius: var(--radius-shell);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
}

.surface-glass-elevated {
    background: var(--glass-bg-strong);
    border: 1px solid var(--glass-border-subtle);
    box-shadow: var(--shadow-xl);
    backdrop-filter: blur(var(--glass-blur-heavy));
    -webkit-backdrop-filter: blur(var(--glass-blur-heavy));
}

.surface-solid {
    background: var(--bg-card);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* ── 壳层组件自动套用磨砂 ── */
.home-hub-card,
.home-panel,
.blog-card,
.blog-related-card,
.comm-card,
.comm-q-card,
.comm-answer-card,
.comm-related-card,
.page-header,
.coming-soon-box {
    background: var(--glass-bg);
    border-color: var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
}

.article-summary {
    border-color: var(--glass-border-subtle);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
}

.page-header {
    background: linear-gradient(
        135deg,
        rgba(238, 244, 251, 0.88) 0%,
        rgba(245, 240, 255, 0.88) 50%,
        rgba(254, 245, 236, 0.88) 100%
    );
    border: 1px solid var(--glass-border-subtle);
}

.page-header .page-badge {
    background: var(--glass-bg-strong);
    border-color: var(--glass-border-subtle);
}

.home-hub-card--featured {
    background: color-mix(in srgb, var(--glass-bg) 75%, rgba(var(--action-rgb), 0.12));
    border-color: rgba(var(--action-rgb), 0.25);
}

.home-panel--secondary {
    background: color-mix(in srgb, var(--glass-bg) 70%, var(--bg-color));
}

/* 抬高层：弹层 / 下拉 / 抽屉 */
.dm-modal,
.mega-dropdown,
.guide-drawer,
.feedback-content,
.quick-feedback-box,
.tool-search-box {
    background: var(--glass-bg-strong);
    backdrop-filter: blur(var(--glass-blur-heavy));
    -webkit-backdrop-filter: blur(var(--glass-blur-heavy));
}

/* 文章正文内工具推荐卡（壳层） */
.article-content .tool-card {
    background: var(--glass-bg);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
}

/* ── 无 backdrop-filter 回退 ── */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .surface-glass,
    .surface-glass-elevated,
    .home-hub-card,
    .home-panel,
    .blog-card,
    .blog-related-card,
    .comm-card,
    .comm-q-card,
    .comm-answer-card,
    .comm-related-card,
    .page-header,
    .article-summary,
    .coming-soon-box,
    .dm-modal,
    .mega-dropdown,
    .guide-drawer,
    .feedback-content,
    .quick-feedback-box,
    .tool-search-box {
        background: var(--bg-card);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

/* ── 暗色壳层玻璃 ── */
html[data-theme="dark"] .home-hub-card,
html[data-theme="dark"] .home-panel,
html[data-theme="dark"] .blog-card,
html[data-theme="dark"] .blog-related-card,
html[data-theme="dark"] .comm-card,
html[data-theme="dark"] .comm-q-card,
html[data-theme="dark"] .comm-answer-card,
html[data-theme="dark"] .comm-related-card,
html[data-theme="dark"] .page-header,
html[data-theme="dark"] .coming-soon-box,
html[data-theme="dark"] .dm-modal,
html[data-theme="dark"] .mega-dropdown,
html[data-theme="dark"] .guide-drawer,
html[data-theme="dark"] .feedback-content,
html[data-theme="dark"] .quick-feedback-box,
html[data-theme="dark"] .tool-search-box {
    background: var(--glass-bg) !important;
    border-color: var(--glass-border-subtle) !important;
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
}

html[data-theme="dark"] .article-summary {
    border-color: var(--glass-border-subtle) !important;
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
}

html[data-theme="dark"] .page-header {
    background: linear-gradient(
        135deg,
        rgba(24, 27, 42, 0.92) 0%,
        rgba(28, 31, 48, 0.90) 50%,
        rgba(22, 26, 40, 0.92) 100%
    ) !important;
}

html[data-theme="dark"] .dm-modal,
html[data-theme="dark"] .mega-dropdown,
html[data-theme="dark"] .guide-drawer,
html[data-theme="dark"] .feedback-content,
html[data-theme="dark"] .quick-feedback-box,
html[data-theme="dark"] .tool-search-box {
    background: var(--glass-bg-strong) !important;
    backdrop-filter: blur(var(--glass-blur-heavy));
    -webkit-backdrop-filter: blur(var(--glass-blur-heavy));
}

/* ── 打印：实心白底 ── */
@media print {
    body::before {
        display: none !important;
    }

    .surface-glass,
    .surface-glass-elevated,
    .home-hub-card,
    .home-panel,
    .blog-card,
    .comm-card,
    .page-header,
    .navbar,
    .sidebar,
    .dm-modal,
    .mega-dropdown,
    .guide-drawer {
        background: #fff !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        box-shadow: none !important;
    }
}