/**
 * theme-glass.css — 小米澎湃 OS 4「柔光玻璃」主题（下载站版）
 * ------------------------------------------------------------
 * 仅前端视觉层覆盖，不改动任何页面 HTML 结构 / 功能逻辑。
 * 通过 [data-frontend-theme="glass"] 作用域生效，默认主题完全不受影响。
 *
 * 站点为传统多页 PHP + Bootstrap，主要组件：
 *   .container / header / .modern-header / .search-category-container
 *   .software-card / .category-btn / footer / .modal-content / .float-window
 */

/* ---------------------------------------------------------
   1. 主题变量
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] {
  --glass-glow-1: rgba(120,160,255,0.50);
  --glass-glow-2: rgba(186,150,255,0.46);
  --glass-glow-3: rgba(255,168,204,0.40);
  --glass-glow-4: rgba(140,225,255,0.42);
  --glass-glow-5: rgba(190,235,200,0.38);

  --glass-surface:      rgba(255,255,255,0.56);
  --glass-surface-hi:   rgba(255,255,255,0.74);
  --glass-border:       rgba(255,255,255,0.72);
  --glass-border-hi:    rgba(255,255,255,0.95);
  --glass-shadow:       0 12px 32px -16px rgba(78,95,140,0.22);
  --glass-shadow-hi:    0 24px 52px -20px rgba(78,95,140,0.30);
  --glass-accent:       #3C6EF5;
}

/* ---------------------------------------------------------
   2. 页面背景：弥散柔光光晕
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] body {
  background-color: #EEF1F8;
  background-image:
    radial-gradient(1100px 720px at 12% -6%,  var(--glass-glow-1) 0%, transparent 58%),
    radial-gradient(1000px 680px at 92% 4%,   var(--glass-glow-2) 0%, transparent 60%),
    radial-gradient(900px 640px at 78% 96%,   var(--glass-glow-3) 0%, transparent 62%),
    radial-gradient(820px 600px at 4% 88%,    var(--glass-glow-4) 0%, transparent 60%),
    radial-gradient(760px 560px at 50% 52%,   var(--glass-glow-5) 0%, transparent 65%),
    linear-gradient(160deg, #EEF2FB 0%, #F3EEFB 45%, #F7EFF6 100%);
  background-attachment: fixed;
  color: #1C2333;
}

/* ---------------------------------------------------------
   3. 顶部标题区
   —— 首页顶部区块是 .modern-header（.container 内），
      传统页面（help/disclaimer 等）用的是 <header> 标签，
      两者都给同一套玻璃样式。
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] header,
html[data-frontend-theme="glass"] .modern-header {
  background: var(--glass-surface);
  backdrop-filter: blur(24px) saturate(1.6);
  -webkit-backdrop-filter: blur(24px) saturate(1.6);
  border: 1px solid var(--glass-border);
  border-radius: 20px;
  box-shadow:
    var(--glass-shadow),
    inset 0 1px 0 rgba(255,255,255,0.92);
}

/* 传统页面的 header 标签带内边距，这里补齐圆角与间距 */
html[data-frontend-theme="glass"] header {
  padding: 30px 20px;
  margin: 20px 0 15px;
}

/* 首页 .modern-header：原本左右 padding 为 0，
   套上玻璃卡片后需补左右内边距，避免内容贴边 */
html[data-frontend-theme="glass"] .modern-header {
  padding: 40px 24px 32px;
  margin: 0 0 18px;
  overflow: hidden;
}

html[data-frontend-theme="glass"] .title-text {
  background: linear-gradient(135deg, #1E293B 0%, #3C6EF5 55%, #7C5CF0 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

html[data-frontend-theme="glass"] .title-accent {
  box-shadow: 0 4px 18px rgba(60,110,245,0.45);
}

/* 装饰圆：柔光化 */
html[data-frontend-theme="glass"] .decoration-circle {
  filter: blur(10px);
  opacity: 0.6;
}

/* 公告条：它位于 header 玻璃卡片内部，因此不再套独立外框，
   只做轻微内嵌底色，避免「框套框」 */
html[data-frontend-theme="glass"] .announcement-banner {
  background: rgba(255,255,255,0.42);
  border: 1px solid rgba(255,255,255,0.7);
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  opacity: 1;
}

/* ---------------------------------------------------------
   5. 搜索 + 分类容器
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] .search-category-container {
  background: var(--glass-surface);
  backdrop-filter: blur(24px) saturate(1.6);
  -webkit-backdrop-filter: blur(24px) saturate(1.6);
  border: 1px solid var(--glass-border);
  border-radius: 18px;
  box-shadow:
    var(--glass-shadow),
    inset 0 1px 0 rgba(255,255,255,0.92);
}

/* 搜索区：.search-wrapper 是外层包裹、.search-container 才是内层输入框，
   只给内层做玻璃，外层保持透明，避免「框套框」 */
html[data-frontend-theme="glass"] .search-wrapper {
  background: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html[data-frontend-theme="glass"] .search-container {
  background: rgba(255,255,255,0.6);
  border: 2px solid var(--glass-border-hi);
  border-radius: 25px;
  backdrop-filter: blur(16px) saturate(1.6);
  -webkit-backdrop-filter: blur(16px) saturate(1.6);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.95);
  transition: border-color 0.3s ease, box-shadow 0.3s cubic-bezier(.16,1,.3,1);
}
html[data-frontend-theme="glass"] .search-container:focus-within {
  border-color: rgba(60,110,245,0.5);
  box-shadow:
    0 0 0 4px rgba(60,110,245,0.12),
    0 12px 30px -14px rgba(60,110,245,0.36),
    inset 0 1px 0 rgba(255,255,255,0.95);
}
html[data-frontend-theme="glass"] .search-input {
  background: transparent;
}
html[data-frontend-theme="glass"] .search-type-select {
  background: rgba(255,255,255,0.5);
}

/* 搜索类型下拉面板 */
html[data-frontend-theme="glass"] .st-menu {
  background: rgba(255,255,255,0.75);
  backdrop-filter: blur(26px) saturate(1.7);
  -webkit-backdrop-filter: blur(26px) saturate(1.7);
  border: 1px solid var(--glass-border-hi);
  border-radius: 12px;
  box-shadow:
    0 20px 44px -18px rgba(78,95,140,0.34),
    inset 0 1px 0 rgba(255,255,255,0.95);
}
html[data-frontend-theme="glass"] .st-menu-item:hover,
html[data-frontend-theme="glass"] .st-menu-item.active {
  background: rgba(60,110,245,0.1);
  border-radius: 8px;
}

/* 「更多分类」下拉面板 */
html[data-frontend-theme="glass"] .more-categories-menu {
  background: rgba(255,255,255,0.75);
  backdrop-filter: blur(26px) saturate(1.7);
  -webkit-backdrop-filter: blur(26px) saturate(1.7);
  border: 1px solid var(--glass-border-hi);
  border-radius: 12px;
  box-shadow:
    0 20px 44px -18px rgba(78,95,140,0.34),
    inset 0 1px 0 rgba(255,255,255,0.95);
}
html[data-frontend-theme="glass"] .more-categories-btn {
  background: rgba(255,255,255,0.55);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--glass-border);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
}
html[data-frontend-theme="glass"] .more-category-item:hover {
  background: rgba(255,255,255,0.7);
}

/* ---------------------------------------------------------
   6. 分类按钮
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] .category-btn {
  background: rgba(255,255,255,0.55);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--glass-border);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
  transition:
    transform 0.24s cubic-bezier(.16,1,.3,1),
    background 0.24s ease,
    box-shadow 0.24s ease,
    color 0.24s ease;
}
html[data-frontend-theme="glass"] .category-btn:hover {
  background: var(--glass-surface-hi);
  transform: translateY(-2px);
  box-shadow:
    0 10px 24px -12px rgba(78,95,140,0.34),
    inset 0 1px 0 rgba(255,255,255,0.95);
}
html[data-frontend-theme="glass"] .category-btn.active {
  background: linear-gradient(135deg, rgba(60,110,245,0.95), rgba(120,90,240,0.95));
  color: #FFFFFF;
  border-color: rgba(255,255,255,0.7);
  box-shadow:
    0 10px 26px -10px rgba(60,110,245,0.6),
    inset 0 1px 0 rgba(255,255,255,0.4);
}

/* ---------------------------------------------------------
   7. 软件卡片（核心）
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] .software-card {
  background: var(--glass-surface);
  backdrop-filter: blur(22px) saturate(1.6);
  -webkit-backdrop-filter: blur(22px) saturate(1.6);
  border: 1px solid var(--glass-border);
  border-radius: 18px;
  box-shadow:
    var(--glass-shadow),
    inset 0 1px 0 rgba(255,255,255,0.92);
  overflow: hidden;
  /* isolation 建立层叠上下文，让光斑层（z-index:-1）停留在卡片内部，
     既在背景之上、又在内容之下 */
  isolation: isolate;
  transition:
    transform 0.4s cubic-bezier(.16,1,.3,1),
    box-shadow 0.4s cubic-bezier(.16,1,.3,1),
    background 0.3s ease,
    border-color 0.3s ease;
}
html[data-frontend-theme="glass"] .software-card:hover {
  transform: translateY(-6px);
  background: var(--glass-surface-hi);
  border-color: var(--glass-border-hi);
  box-shadow:
    var(--glass-shadow-hi),
    0 0 40px -12px rgba(120,160,255,0.5),
    inset 0 1px 0 rgba(255,255,255,1);
}

/* 鼠标光斑跟随（由 JS 注入 .glass-glow 元素驱动）
   用 z-index:-1 让光斑沉到卡片背景之上、所有内容之下，
   这样无需改动卡片内任何元素的 position，绝对定位的编号徽章等不受影响。
   前提：宿主卡片需建立层叠上下文（见 .software-card 的 isolation）。 */
html[data-frontend-theme="glass"] .glass-glow {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  z-index: -1;
  transition: opacity 0.35s ease;
  background: radial-gradient(
    260px circle at var(--mx, 50%) var(--my, 50%),
    rgba(255,255,255,0.55),
    rgba(255,255,255,0.12) 42%,
    transparent 68%
  );
}

html[data-frontend-theme="glass"] .glass-glow.on { opacity: 1; }

/* ---------------------------------------------------------
   8. 链接 / 按钮
   —— 保留原有胶囊圆角（50px）与品牌渐变色，只增强 hover 反馈
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] .download-btn,
html[data-frontend-theme="glass"] .btn-custom,
html[data-frontend-theme="glass"] .btn-custom1,
html[data-frontend-theme="glass"] .btn-custom2,
html[data-frontend-theme="glass"] .btn-custom3,
html[data-frontend-theme="glass"] .btn-123,
html[data-frontend-theme="glass"] .btn-one23,
html[data-frontend-theme="glass"] .btn-quark,
html[data-frontend-theme="glass"] .btn-uc,
html[data-frontend-theme="glass"] .btn-baidu,
html[data-frontend-theme="glass"] .btn-xunlei {
  transition:
    transform 0.24s cubic-bezier(.16,1,.3,1),
    box-shadow 0.24s cubic-bezier(.16,1,.3,1),
    filter 0.24s ease;
}
html[data-frontend-theme="glass"] .download-btn:hover,
html[data-frontend-theme="glass"] .btn-custom:hover,
html[data-frontend-theme="glass"] .btn-custom1:hover,
html[data-frontend-theme="glass"] .btn-custom2:hover,
html[data-frontend-theme="glass"] .btn-custom3:hover,
html[data-frontend-theme="glass"] .btn-one23:hover,
html[data-frontend-theme="glass"] .btn-quark:hover,
html[data-frontend-theme="glass"] .btn-uc:hover,
html[data-frontend-theme="glass"] .btn-baidu:hover,
html[data-frontend-theme="glass"] .btn-xunlei:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px -14px rgba(78,95,140,0.42);
  filter: brightness(1.06);
}
html[data-frontend-theme="glass"] .download-btn:active,
html[data-frontend-theme="glass"] .btn-custom:active,
html[data-frontend-theme="glass"] .btn-custom1:active,
html[data-frontend-theme="glass"] .btn-custom2:active,
html[data-frontend-theme="glass"] .btn-custom3:active,
html[data-frontend-theme="glass"] .btn-one23:active {
  transform: translateY(0) scale(0.97);
  filter: brightness(0.97);
}

/* ---------------------------------------------------------
   9. 模态框
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] .modal-overlay {
  background: rgba(15,23,42,0.42);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
html[data-frontend-theme="glass"] .modal-content {
  background: rgba(255,255,255,0.8);
  backdrop-filter: blur(28px) saturate(1.6);
  -webkit-backdrop-filter: blur(28px) saturate(1.6);
  border: 1px solid var(--glass-border-hi);
  border-radius: 20px;
  box-shadow:
    0 30px 70px -20px rgba(15,23,42,0.42),
    inset 0 1px 0 rgba(255,255,255,0.95);
}

/* ---------------------------------------------------------
   10. 页脚 —— 原 padding 左右为 0，需补内边距避免内容贴边
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] footer {
  background: rgba(255,255,255,0.44);
  backdrop-filter: blur(22px) saturate(1.5);
  -webkit-backdrop-filter: blur(22px) saturate(1.5);
  border: 1px solid rgba(255,255,255,0.6);
  border-radius: 18px;
  box-shadow: 0 -6px 28px -16px rgba(78,95,140,0.22);
  padding: 25px 20px;
}

/* ---------------------------------------------------------
   11. 悬浮窗 / 排行榜弹窗 / 其它面板
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] .float-window {
  backdrop-filter: blur(22px) saturate(1.5);
  -webkit-backdrop-filter: blur(22px) saturate(1.5);
  border-radius: 16px;
}

/* 下载排行榜弹窗（定义在 float-window.css） */
html[data-frontend-theme="glass"] .rankings-modal {
  background: rgba(255,255,255,0.8);
  backdrop-filter: blur(30px) saturate(1.7);
  -webkit-backdrop-filter: blur(30px) saturate(1.7);
  border: 1px solid var(--glass-border-hi);
  border-radius: 20px;
  box-shadow:
    0 30px 70px -20px rgba(15,23,42,0.42),
    inset 0 1px 0 rgba(255,255,255,0.95);
}

/* 弹窗遮罩 */
html[data-frontend-theme="glass"] #rankingsBackdrop.modal-backdrop {
  background: rgba(15,23,42,0.42);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* 弹窗头部：保留品牌红色渐变，但柔化为玻璃质感 */
html[data-frontend-theme="glass"] .rankings-modal-header {
  background: linear-gradient(135deg, rgba(255,107,107,0.92) 0%, rgba(255,135,135,0.92) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,0.45);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.35);
}

/* 标签栏 */
html[data-frontend-theme="glass"] .rankings-tabs {
  background: rgba(255,255,255,0.42);
  border-bottom: 1px solid rgba(255,255,255,0.6);
}

html[data-frontend-theme="glass"] .rankings-tab {
  transition: color 0.22s ease, background 0.24s ease, border-color 0.24s ease;
}
html[data-frontend-theme="glass"] .rankings-tab:hover {
  background: rgba(255,107,107,0.09);
}
html[data-frontend-theme="glass"] .rankings-tab.active {
  background: rgba(255,255,255,0.55);
  border-radius: 10px 10px 0 0;
}

/* 榜单条目：玻璃小块 */
html[data-frontend-theme="glass"] .ranking-item {
  background: rgba(255,255,255,0.56);
  backdrop-filter: blur(14px) saturate(1.5);
  -webkit-backdrop-filter: blur(14px) saturate(1.5);
  border: 1px solid rgba(255,255,255,0.75);
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
  transition:
    transform 0.26s cubic-bezier(.16,1,.3,1),
    background 0.24s ease,
    box-shadow 0.26s cubic-bezier(.16,1,.3,1),
    border-color 0.24s ease;
}
html[data-frontend-theme="glass"] .ranking-item:hover {
  /* 保留原有横向滑出效果，叠加玻璃高光 */
  transform: translateX(8px) translateY(-2px);
  background: rgba(255,255,255,0.75);
  border-color: rgba(255,255,255,0.95);
  box-shadow:
    0 12px 28px -14px rgba(78,95,140,0.3),
    0 8px 24px rgba(255,107,107,0.15),
    inset 0 1px 0 rgba(255,255,255,1);
}

/* ---------------------------------------------------------
   11.1 各独立页面的主要卡片
        （help / disclaimer / feedback-panel 等各自定义的容器）
        用 :is() 收敛选择器，避免逐个重复
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] :is(
  .help-container,
  .help-content,
  .disclaimer-card,
  .feedback-content,
  .feedback-header,
  .page-header
) {
  background: var(--glass-surface);
  backdrop-filter: blur(22px) saturate(1.6);
  -webkit-backdrop-filter: blur(22px) saturate(1.6);
  border: 1px solid var(--glass-border);
  border-radius: 16px;
  box-shadow:
    var(--glass-shadow),
    inset 0 1px 0 rgba(255,255,255,0.92);
}

/* ---------------------------------------------------------
   11.2 资源详情页（download.php / view_resource.php）
        该页使用独立命名的容器：.dl-header / .page-container 等
   --------------------------------------------------------- */

/* 顶部标题区：与首页 .modern-header 同一套处理 */
html[data-frontend-theme="glass"] .dl-header {
  position: relative;
  background: var(--glass-surface);
  backdrop-filter: blur(24px) saturate(1.6);
  -webkit-backdrop-filter: blur(24px) saturate(1.6);
  border: 1px solid var(--glass-border);
  border-radius: 20px;
  margin: 0 0 18px;
  padding: 46px 24px 34px;
  overflow: hidden;
  box-shadow:
    var(--glass-shadow),
    inset 0 1px 0 rgba(255,255,255,0.92);
}

html[data-frontend-theme="glass"] .dl-title {
  background: linear-gradient(135deg, #1E293B 0%, #3C6EF5 55%, #7C5CF0 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* 标题区的装饰光斑：柔光化 */
html[data-frontend-theme="glass"] .dl-dec-circle {
  filter: blur(10px);
  opacity: 0.5;
}

/* 详情页标题区的移动端内边距修正
   （原 @media 里 padding 左右为 0，套上玻璃卡片后会贴边） */
@media (max-width: 768px) {
  html[data-frontend-theme="glass"] .dl-header {
    padding: 30px 20px 22px;
  }
  html[data-frontend-theme="glass"] .modern-header {
    padding: 30px 20px 22px;
  }
}

/* 主卡片 */
html[data-frontend-theme="glass"] .page-container {
  background: var(--glass-surface);
  backdrop-filter: blur(22px) saturate(1.6);
  -webkit-backdrop-filter: blur(22px) saturate(1.6);
  border: 1px solid var(--glass-border);
  border-radius: 18px;
  box-shadow:
    var(--glass-shadow),
    inset 0 1px 0 rgba(255,255,255,0.92);
}

/* 卡片内部内容区：原为 #fafbfc 实色，改为半透明白，
   避免与卡片玻璃底形成「硬边色块」 */
html[data-frontend-theme="glass"] .page-content {
  background: rgba(255,255,255,0.34);
}

/* 卡片底部条 */
html[data-frontend-theme="glass"] .page-footer {
  background: rgba(255,255,255,0.42);
  border-top: 1px solid rgba(255,255,255,0.6);
}

/* 资源信息块（部分页面使用） */
html[data-frontend-theme="glass"] .resource-info {
  background: rgba(255,255,255,0.42);
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: 14px;
  padding: 16px 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.85);
}

/* 查看资源页的文本弹窗（view_resource.php 独立定义） */
html[data-frontend-theme="glass"] .text-modal-container {
  background: rgba(255,255,255,0.82);
  backdrop-filter: blur(28px) saturate(1.7);
  -webkit-backdrop-filter: blur(28px) saturate(1.7);
  border: 1px solid var(--glass-border-hi);
  border-radius: 18px;
  box-shadow:
    0 30px 70px -20px rgba(15,23,42,0.42),
    inset 0 1px 0 rgba(255,255,255,0.95);
}

/* ---------------------------------------------------------
   11.3 反馈广场页（feedback-panel.php）的卡片与状态标签
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] .feedback-item,
html[data-frontend-theme="glass"] .status-tab {
  background: rgba(255,255,255,0.58);
  backdrop-filter: blur(18px) saturate(1.5);
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  border-color: rgba(255,255,255,0.7);
  box-shadow:
    0 8px 24px -14px rgba(78,95,140,0.24),
    inset 0 1px 0 rgba(255,255,255,0.9);
}

html[data-frontend-theme="glass"] .feedback-item:hover {
  background: rgba(255,255,255,0.74);
  box-shadow:
    0 18px 40px -18px rgba(78,95,140,0.3),
    inset 0 1px 0 rgba(255,255,255,1);
}

html[data-frontend-theme="glass"] .status-tab:hover {
  background: rgba(255,255,255,0.75);
}
/* 选中态保留原有强调色（由站点 JS 切换的 active 类控制），此处不覆盖 */
html[data-frontend-theme="glass"] .status-tab.active {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* ---------------------------------------------------------
   11.4 推荐卡片 / 各类弹窗 / 分页按钮
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] .recommendation-item {
  background: rgba(255,255,255,0.58);
  backdrop-filter: blur(18px) saturate(1.5);
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  border-color: rgba(255,255,255,0.72);
  box-shadow:
    0 10px 28px -16px rgba(78,95,140,0.24),
    inset 0 1px 0 rgba(255,255,255,0.9);
  transition:
    transform 0.28s cubic-bezier(.16,1,.3,1),
    box-shadow 0.28s cubic-bezier(.16,1,.3,1),
    background 0.24s ease,
    border-color 0.24s ease;
}
html[data-frontend-theme="glass"] .recommendation-item:hover {
  transform: translateY(-3px);
  background: rgba(255,255,255,0.76);
  border-color: rgba(255,255,255,0.95);
  box-shadow:
    0 20px 44px -20px rgba(78,95,140,0.32),
    inset 0 1px 0 rgba(255,255,255,1);
}

/* 推荐弹窗 / 通用弹窗 */
html[data-frontend-theme="glass"] .recommendations-modal-content,
html[data-frontend-theme="glass"] .modal-container {
  background: rgba(255,255,255,0.82);
  backdrop-filter: blur(28px) saturate(1.7);
  -webkit-backdrop-filter: blur(28px) saturate(1.7);
  border: 1px solid var(--glass-border-hi);
  border-radius: 18px;
  box-shadow:
    0 30px 70px -20px rgba(15,23,42,0.42),
    inset 0 1px 0 rgba(255,255,255,0.95);
}

/* 分页按钮 */
html[data-frontend-theme="glass"] .page-link {
  background: rgba(255,255,255,0.58);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
  transition:
    transform 0.22s cubic-bezier(.16,1,.3,1),
    background 0.22s ease,
    box-shadow 0.22s ease,
    color 0.22s ease;
}
html[data-frontend-theme="glass"] .page-link:hover {
  transform: translateY(-2px);
  background: rgba(255,255,255,0.8);
  box-shadow:
    0 10px 24px -12px rgba(78,95,140,0.3),
    inset 0 1px 0 rgba(255,255,255,1);
}

/* 反馈页分页按钮 / AI 助手快捷按钮 */
html[data-frontend-theme="glass"] .pagination button,
html[data-frontend-theme="glass"] .ai-quick-btn {
  background: rgba(255,255,255,0.58);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-color: rgba(255,255,255,0.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
  transition:
    transform 0.22s cubic-bezier(.16,1,.3,1),
    background 0.22s ease,
    box-shadow 0.22s ease,
    color 0.22s ease;
}
html[data-frontend-theme="glass"] .pagination button:hover,
html[data-frontend-theme="glass"] .ai-quick-btn:hover {
  transform: translateY(-2px);
  background: rgba(255,255,255,0.8);
  box-shadow:
    0 10px 24px -12px rgba(78,95,140,0.3),
    inset 0 1px 0 rgba(255,255,255,1);
}

/* 手风琴头部在 .help-container 内部，不再套外框，只做轻量分隔 */
html[data-frontend-theme="glass"] .help-accordion-header {
  background: rgba(255,255,255,0.4);
  border: 1px solid rgba(255,255,255,0.6);
  border-radius: 12px;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* ---------------------------------------------------------
   12. 表单控件：保持原尺寸/圆角，仅柔化底色
       （排除搜索框、搜索区内的隐藏 select，避免破坏搜索区外观）
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not(.search-input),
html[data-frontend-theme="glass"] textarea,
html[data-frontend-theme="glass"] select:not(.search-type-select) {
  background: rgba(255,255,255,0.5);
  border-color: rgba(255,255,255,0.85);
}

/* ---------------------------------------------------------
   13. 滚动条柔化
   --------------------------------------------------------- */
html[data-frontend-theme="glass"] ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
html[data-frontend-theme="glass"] ::-webkit-scrollbar-track { background: transparent; }
html[data-frontend-theme="glass"] ::-webkit-scrollbar-thumb {
  background: rgba(120,135,170,0.42);
  border-radius: 999px;
}
html[data-frontend-theme="glass"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(120,135,170,0.6);
}

/* ---------------------------------------------------------
   13.1 移动端性能优化
        移动端 GPU 较弱，大量 backdrop-filter 会明显掉帧；
        这里降低模糊半径、减少同时参与模糊的元素，
        视觉上仍是柔光玻璃，但流畅度明显提升。
   --------------------------------------------------------- */
@media (max-width: 900px) {
  html[data-frontend-theme="glass"] .software-card {
    backdrop-filter: blur(14px) saturate(1.4);
    -webkit-backdrop-filter: blur(14px) saturate(1.4);
  }
  html[data-frontend-theme="glass"] .search-category-container {
    backdrop-filter: blur(16px) saturate(1.4);
    -webkit-backdrop-filter: blur(16px) saturate(1.4);
  }
  /* 统计栏通栏模糊改为极轻，避免滚动卡顿 */
  html[data-frontend-theme="glass"] .stats-bar {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }
}

/* ---------------------------------------------------------
   14. 降级兜底：不支持 backdrop-filter 时用不透明背景
   --------------------------------------------------------- */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html[data-frontend-theme="glass"] header,
  html[data-frontend-theme="glass"] .modern-header,
  html[data-frontend-theme="glass"] .dl-header,
  html[data-frontend-theme="glass"] .announcement-banner,
  html[data-frontend-theme="glass"] .search-category-container,
  html[data-frontend-theme="glass"] .search-container,
  html[data-frontend-theme="glass"] .software-card,
  html[data-frontend-theme="glass"] .page-container,
  html[data-frontend-theme="glass"] .feedback-item,
  html[data-frontend-theme="glass"] .status-tab,
  html[data-frontend-theme="glass"] .recommendation-item,
  html[data-frontend-theme="glass"] .modal-content,
  html[data-frontend-theme="glass"] .modal-container,
  html[data-frontend-theme="glass"] .rankings-modal,
  html[data-frontend-theme="glass"] .ranking-item,
  html[data-frontend-theme="glass"] .text-modal-container,
  html[data-frontend-theme="glass"] .recommendations-modal-content,
  html[data-frontend-theme="glass"] .page-link,
  html[data-frontend-theme="glass"] footer {
    background: rgba(255,255,255,0.94);
  }
}

/* ---------------------------------------------------------
   15. 尊重系统「减少动态效果」偏好
   --------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html[data-frontend-theme="glass"] .software-card,
  html[data-frontend-theme="glass"] .software-card:hover,
  html[data-frontend-theme="glass"] .category-btn,
  html[data-frontend-theme="glass"] .category-btn:hover,
  html[data-frontend-theme="glass"] .download-btn,
  html[data-frontend-theme="glass"] .download-btn:hover {
    transform: none;
    transition: none;
  }
  html[data-frontend-theme="glass"] .glass-glow { display: none; }
}