/* MC 主题兼容层：noir 变量映射到 MC 23 主题变量 + 页面布局适配 */
html[data-theme] {
  --noir-bg-primary: var(--bg-deep);
  --noir-bg-secondary: var(--bg-card);
  --noir-bg-elevated: var(--bg-elevated);
  --noir-bg-tertiary: var(--bg-card);
  --noir-bg-inverse: var(--text-primary);
  --noir-text-primary: var(--text-primary);
  --noir-text-secondary: var(--text-secondary);
  --noir-text-tertiary: var(--text-muted);
  --noir-text-inverse: var(--bg-deep);
  --noir-accent: var(--green);
  --noir-accent-hover: var(--green-light);
  --noir-accent-subtle: rgba(91,135,49,.15);
  --noir-border-light: var(--stone);
  --noir-border-medium: var(--stone-light);
  --noir-border-strong: var(--green-light);
  --noir-shadow-sm: var(--shadow);
  --noir-shadow-md: var(--shadow);
  --noir-shadow-lg: var(--shadow);
  --noir-shadow-glow: var(--shadow-glow);
  --noir-shadow-glow-lg: var(--shadow-glow);
  --noir-radius-xs: 4px;
  --noir-radius-sm: var(--radius-sm);
  --noir-radius-md: var(--radius);
  --noir-radius-lg: 16px;
  --noir-radius-xl: 20px;
  --noir-radius-full: 999px;
}
/* 固定导航栏让位（MC navbar 高 60px） */
body.has-nav { padding-top: 60px; }
/* 页面背景统一为 MC 主题色（覆盖任何旧背景，含 bg.svg） */
body.mc-page, html[data-theme] body.mc-page, .noir-dark body.mc-page, .noir-light body.mc-page {
  background: var(--bg-deep) !important;
  color: var(--text-primary);
}
.mc-page { min-height: 100vh; }
/* 全屏布局页面（登录/注册等）在导航栏下居中 */
body.mc-page { box-sizing: border-box; }

/* ===== 透明材质主题化：毛玻璃用主题背景色的半透明版 ===== */
html[data-theme] .noir-glass {
  background-color: color-mix(in srgb, var(--bg-card) 55%, transparent);
  border-color: color-mix(in srgb, var(--stone-light) 60%, transparent);
}
html[data-theme="light"] .noir-glass {
  background-color: color-mix(in srgb, var(--bg-card) 45%, transparent);
  border-color: color-mix(in srgb, var(--stone-light) 50%, transparent);
}
/* 卡片/输入框高光跟随主题边框色 */
html[data-theme] .noir-card {
  box-shadow: var(--noir-shadow-xs), inset 0 1px 0 color-mix(in srgb, var(--text-primary) 8%, transparent);
}
/* 模态遮罩跟随主题（深色主题深遮罩，浅色主题浅遮罩） */
html[data-theme="light"] .noir-modal-overlay {
  background-color: rgba(0, 0, 0, 0.35);
}

/* 内联 SVG 图标统一颜色（随主题主色） */
.sinh-icon{color:var(--green-light);display:inline-block}
.sinh-icon *{color:inherit}

/* DeepSeek 图标：CSS 覆盖实现主题变色（属性值 #7caf4e 为兜底） */
.sinh-icon-deepseek path{fill:var(--green-light) !important}

/* ===== AI Chat 侧边栏文字对比度增强 ===== */
html[data-theme] #sidebar{color:var(--text-primary)}
html[data-theme] #sidebar .noir-text-tertiary{color:var(--text-secondary)}
html[data-theme] #sidebar .noir-text-sm{color:var(--text-primary)}
html[data-theme] #sidebar .noir-text-xs{color:var(--text-secondary)}
html[data-theme] #sidebar .conversation-item{color:var(--text-secondary)}
html[data-theme] #sidebar .conversation-item:hover{color:var(--text-primary)}
html[data-theme] #sidebar .conversation-item.active{color:var(--text-primary)}
html[data-theme] #sidebar .conversation-item .noir-text-sm{color:var(--text-primary)}

/* ===== 毛玻璃 UI 统一重写 =====
   主题化半透明渐变 + 高模糊 + 顶部高光 */
html[data-theme] .noir-glass,
html[data-theme] .noir-card,
html[data-theme] .noir-modal,
html[data-theme] .noir-nav {
  background:
    linear-gradient(145deg,
      color-mix(in srgb, var(--bg-elevated) 58%, transparent) 0%,
      color-mix(in srgb, var(--bg-card) 38%, transparent) 100%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%) brightness(1.06) !important;
  backdrop-filter: blur(18px) saturate(160%) brightness(1.06) !important;
  border: 1px solid color-mix(in srgb, var(--stone-light) 55%, transparent) !important;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, .16),
    inset 0 1px 0 color-mix(in srgb, var(--text-primary) 9%, transparent) !important;
}
/* 玻璃悬停微动效 */
html[data-theme] .noir-glass:hover,
html[data-theme] .noir-card:hover {
  border-color: color-mix(in srgb, var(--green-light) 45%, transparent);
}
/* 模态遮罩：主题化深色毛玻璃 */
html[data-theme] .noir-modal-overlay {
  background-color: color-mix(in srgb, var(--bg-deep) 72%, transparent) !important;
  -webkit-backdrop-filter: blur(10px) saturate(130%) !important;
  backdrop-filter: blur(10px) saturate(130%) !important;
}
/* 卡片内高光微调（跟随主题文字色） */
html[data-theme] .noir-card::after,
html[data-theme] .noir-modal::after {
  background:
    radial-gradient(ellipse at 30% 12%, color-mix(in srgb, var(--text-primary) 7%, transparent) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 90%, color-mix(in srgb, var(--text-primary) 3%, transparent) 0%, transparent 45%) !important;
}
html[data-theme] .noir-glass::after {
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--text-primary) 10%, transparent), transparent) !important;
}

/* 防御：body 级变量映射（杜绝任何 .noir-dark/.noir-light 硬编码覆盖主题） */
html[data-theme] body{
  --noir-bg-primary: var(--bg-deep);
  --noir-bg-secondary: var(--bg-card);
  --noir-bg-elevated: var(--bg-elevated);
  --noir-bg-tertiary: var(--bg-card);
  --noir-text-primary: var(--text-primary);
  --noir-text-secondary: var(--text-secondary);
  --noir-text-tertiary: var(--text-muted);
  --noir-accent: var(--green);
  --noir-accent-hover: var(--green-light);
  --noir-border-light: var(--stone);
  --noir-border-medium: var(--stone-light);
  --noir-shadow-sm: var(--shadow);
  --noir-shadow-md: var(--shadow);
  --noir-shadow-lg: var(--shadow);
  --noir-radius-lg: 16px;
}

/* ===== 用户头衔徽章（开发者/管理员/挚友/同学） ===== */
.sinh-role-badge{display:inline-block;font-size:10px;line-height:1;padding:2px 7px;border-radius:999px;margin-left:5px;vertical-align:1.5px;font-weight:600;letter-spacing:.02em}
.sinh-role-developer{background:linear-gradient(135deg,#f6c453,#ef9f2e);color:#3d2a00;border:1px solid #e3a83a}
.sinh-role-admin{background:#4f83f1;color:#fff;border:1px solid #6b97f5}
.sinh-role-friend{background:#e070a0;color:#fff;border:1px solid #ea8bb5}
.sinh-role-classmate{background:var(--noir-bg-tertiary);color:var(--noir-text-secondary);border:1px solid var(--noir-border-light)}

/* ===== 子页面统一 UI 组件 ===== */
/* 统一文字返回链接（bottle/luck 等） */
html[data-theme] a.back {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 18px; border-radius: 999px;
  background: var(--bg-card); border: 1px solid var(--stone);
  color: var(--text-secondary); font-size: 13px; font-weight: 500;
  text-decoration: none; transition: all .25s;
}
html[data-theme] a.back:hover { border-color: var(--green-light); color: var(--text-primary); transform: translateX(-2px); }
/* 统一悬浮返回按钮（左上角圆形） */
html[data-theme] .home-btn {
  position: fixed; top: 16px; left: 16px; z-index: 100;
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--bg-card); backdrop-filter: blur(16px);
  border: 1px solid var(--stone); display: flex; align-items: center; justify-content: center;
  color: var(--text-primary); text-decoration: none; font-size: 17px;
  box-shadow: 0 4px 14px rgba(0,0,0,.2); transition: all .25s;
}
html[data-theme] .home-btn:hover { transform: scale(1.1); border-color: var(--green-light); color: var(--green-light); }
/* 统一页面主标题 */
html[data-theme] .al-hdr h1, html[data-theme] .hero-section h1, html[data-theme] .blog-header h1,
html[data-theme] .tool-header h1, html[data-theme] .page-title, html[data-theme] .player-title {
  font-family: 'Sora','Noto Sans SC',sans-serif;
  font-weight: 800; letter-spacing: -.02em; color: var(--text-primary) !important;
}
/* 统一页面副标题 */
html[data-theme] .al-sub, html[data-theme] .hero-sub, html[data-theme] .blog-sub, html[data-theme] .tool-sub {
  color: var(--text-secondary) !important;
}

/* ===== 背景强保险：所有主题下 body 背景强制跟随 ===== */
html[data-theme] body {
  background: var(--bg-deep) !important;
  color: var(--text-primary) !important;
}
/* 账户页卡片/菜单显式主题背景（防止任何旧规则覆盖） */
html[data-theme] .acct-card { background: var(--bg-elevated) !important; }
html[data-theme] .acct-topbar { background: linear-gradient(135deg, color-mix(in srgb, var(--green) 12%, transparent), transparent 60%) !important; }
html[data-theme] .acct-menu { background: color-mix(in srgb, var(--bg-card) 60%, transparent) !important; }
html[data-theme] .acct-content { color: var(--text-primary) !important; }

/* 账户页：无毛玻璃朴素卡片（实色、无渐变、无模糊、无阴影） */
html[data-theme] .acct-card {
  background: var(--bg-elevated) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border: 1px solid var(--stone) !important;
  box-shadow: none !important;
  border-radius: 16px !important;
}
html[data-theme] .acct-topbar {
  background: var(--bg-card) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-theme] .acct-menu { background: var(--bg-card) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
html[data-theme] .acct-content { background: transparent !important; }
html[data-theme] .acct-menu button { color: var(--text-secondary) !important; }
html[data-theme] .acct-menu button:hover { background: var(--bg-elevated) !important; color: var(--text-primary) !important; }
html[data-theme] .acct-menu button.active { background: var(--green) !important; color: #fff !important; }

/* ===== 账户页面板区彻底透明/主题化（消灭所有灰色块） ===== */
html[data-theme] .panel { background: transparent !important; }
html[data-theme] .acct-content { background: transparent !important; }
html[data-theme] .role-user-row { background: var(--bg-card) !important; border: 1px solid var(--stone) !important; }
html[data-theme] .profile-row { background: transparent !important; }
html[data-theme] .noir-form-group input { background: var(--bg-card) !important; }

/* ===== 全局滚动条主题化（替代默认黑色拖拽条） ===== */
html[data-theme] ::-webkit-scrollbar { width: 6px; height: 6px; }
html[data-theme] ::-webkit-scrollbar-track { background: transparent; }
html[data-theme] ::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--text-primary) 18%, transparent);
  border-radius: 999px;
}
html[data-theme] ::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--text-primary) 32%, transparent);
}
html[data-theme] * {
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--text-primary) 25%, transparent) transparent;
}