/* ================================================================
   app-unify.css — 猿师珩 APP 首页 UI 统一规范
   加载顺序：index.html 内联 <style> → 各 JS 注入 → app-unify.css
   作用：统一所有 sect 模块的边框/背景/按钮/间距/圆角/字体风格
   创建日期：2026-10-01
   ================================================================

   === 问题清单（修复前） ===
   1. 青年专区：金色边框+棕色背景+金色按钮（与全局深空玻璃不搭）
   2. 司机服务：青绿边框+深蓝背景+蓝色按钮（与金色主题冲突）
   3. 星航卫零工：绿色边框+绿色按钮（又一种独立风格）
   4. 近期热招：青绿色边框（独立风格）
   5. 方向自测/数字艺术展馆：金色边框+混合渐变（独立风格）
   6. 模块间距不统一（10px/12px/各种margin）
   7. 按钮颜色混乱（金/蓝/绿三色并存）

   === 统一设计 Token ===
   所有 sect 模块：统一深空玻璃风格
     背景：rgba(14,28,52,.88) 渐变（与 .row/.scard 同系）
     边框：rgba(150,200,255,.18)（与全局 line token 对齐）
     圆角：16px（与 .row/.scard 对齐）
     内边距：16px
     模块间距：margin-top 12px（与 .sect 默认一致）
   所有 CTA 按钮：统一金色渐变（与全局 btn-primary 对齐）
   标题颜色：统一 #eaf6ff
   辅助链接颜色：统一 var(--gold)
   ================================================================ */

/* ---------- 1. 全局 sect 统一 ---------- */
.sect {
  margin-top: 12px !important;
  border: 1px solid rgba(150, 200, 255, 0.18) !important;
  border-radius: 16px !important;
  background: linear-gradient(160deg, rgba(14, 28, 52, 0.88), rgba(9, 18, 36, 0.92)) !important;
  padding: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 28px rgba(0, 0, 0, 0.35) !important;
  backdrop-filter: blur(14px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.3) !important;
}

/* ---------- 2. sect 标题行统一 ---------- */
.sect .sec-head {
  margin-bottom: 10px !important;
}

.sect .sec-head h3 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #eaf6ff !important;
  text-shadow: 0 0 12px rgba(140, 200, 255, 0.2) !important;
  letter-spacing: 0.5px !important;
}

.sect .sec-head a {
  font-size: 11px !important;
  color: var(--gold) !important;
  letter-spacing: 1px !important;
  cursor: pointer !important;
}

/* ---------- 3. wxdl 信息行统一（模块内部描述区） ---------- */
.sect .wxdl {
  border: 1px solid rgba(150, 200, 255, 0.16) !important;
  background: rgba(140, 200, 255, 0.05) !important;
  border-radius: 12px !important;
  padding: 11px 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 10px !important;
}

.sect .wxdl svg {
  color: var(--gold) !important;
  flex-shrink: 0 !important;
}

.sect .wxdl span {
  font-size: 13px !important;
  color: var(--ink-dim) !important;
}

/* ---------- 4. 所有 CTA 按钮统一为金色渐变 ---------- */
.sect .wxdl-btn {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  border-radius: 14px !important;
  border: none !important;
  background: linear-gradient(140deg, #ffc98a, #ff9a3c) !important;
  color: #231303 !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: 1px !important;
  box-shadow: 0 8px 24px rgba(255, 154, 60, 0.30) !important;
  cursor: pointer !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.sect .wxdl-btn:active {
  transform: scale(0.97) !important;
  box-shadow: 0 4px 16px rgba(255, 154, 60, 0.25) !important;
}

/* ---------- 5. 动态注入模块统一 ---------- */

/* 5a. 方向自测入口按钮 (quiz.js #qzEntry) */
#qzEntry {
  border: 1px solid rgba(150, 200, 255, 0.22) !important;
  border-radius: 16px !important;
  background: linear-gradient(160deg, rgba(14, 28, 52, 0.88), rgba(9, 18, 36, 0.92)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 28px rgba(0, 0, 0, 0.30) !important;
  color: var(--gold) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding: 14px 16px !important;
  margin: 10px 0 0 0 !important;
  width: 100% !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}

/* 5b. 数字艺术展馆入口 (ops.js #yshGalleryEntry) */
#yshGalleryEntry {
  border: 1px solid rgba(150, 200, 255, 0.22) !important;
  border-radius: 16px !important;
  background: linear-gradient(160deg, rgba(14, 28, 52, 0.88), rgba(9, 18, 36, 0.92)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 28px rgba(0, 0, 0, 0.30) !important;
  color: var(--gold) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding: 14px 16px !important;
  margin: 10px 0 0 0 !important;
  width: 100% !important;
  text-decoration: none !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}

#yshGalleryEntry span {
  color: var(--ink-dim) !important;
  font-weight: 500 !important;
}

/* 5c. 近期热招横幅 (ops.js #opsFresh) */
#opsFresh {
  border: 1px solid rgba(150, 200, 255, 0.22) !important;
  border-radius: 16px !important;
  background: linear-gradient(160deg, rgba(14, 28, 52, 0.88), rgba(9, 18, 36, 0.92)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 28px rgba(0, 0, 0, 0.30) !important;
  margin: 10px 0 0 0 !important;
  padding: 12px 14px !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}

#opsFresh b {
  color: var(--gold) !important;
  font-size: 14px !important;
}

#opsFresh span {
  color: var(--ink-dim) !important;
}

/* ---------- 6. 主题专区卡片统一间距 ---------- */
.topic-strip {
  margin-top: 10px !important;
  gap: 10px !important;
}

.tcard {
  border-radius: 14px !important;
  border: 1px solid rgba(150, 200, 255, 0.18) !important;
}

/* ---------- 7. 个人秀入口统一 ---------- */
.show-entry {
  border: 1px solid rgba(150, 200, 255, 0.18) !important;
  border-radius: 16px !important;
  background: linear-gradient(160deg, rgba(14, 28, 52, 0.88), rgba(9, 18, 36, 0.92)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 28px rgba(0, 0, 0, 0.30) !important;
  padding: 16px !important;
}

/* ---------- 8. 文心雕龙输入区统一 ---------- */
.sect .wxdl-in {
  border: 1px solid rgba(150, 200, 255, 0.18) !important;
  background: rgba(140, 200, 255, 0.05) !important;
  border-radius: 12px !important;
}

.sect .wxdl-in input {
  color: var(--ink) !important;
}

.sect .wxdl-in input::placeholder {
  color: var(--ink-faint) !important;
}

.sect .wxdl-hint {
  color: var(--ink-faint) !important;
  font-size: 11px !important;
  margin-top: 6px !important;
  margin-bottom: 8px !important;
}

/* ---------- 9. ICP 备案底部统一 ---------- */
.icp-footer {
  border: 1px solid rgba(150, 200, 255, 0.14) !important;
  border-radius: 14px !important;
  background: rgba(14, 28, 52, 0.5) !important;
  color: var(--ink-faint) !important;
}

/* ---------- 10. Grid4 图标入口微调 ---------- */
.grid4 .cell {
  border-radius: 14px !important;
  border: 1px solid rgba(150, 200, 255, 0.16) !important;
}

.grid4 .cell .ico {
  border: 1px solid rgba(255, 200, 130, 0.25) !important;
}

/* ---------- 11. Hero 主视觉微调 ---------- */
.hero {
  border-radius: 18px !important;
}

/* ---------- 12. 3D 轮播卡片统一圆角 ---------- */
.stage3d .scard .gbody {
  border-radius: 16px !important;
}

/* ---------- 13. 热门机会行统一 ---------- */
.row {
  border: 1px solid rgba(150, 200, 255, 0.14) !important;
  border-radius: 14px !important;
  background: linear-gradient(150deg, rgba(14, 28, 52, 0.75), rgba(9, 18, 36, 0.80)) !important;
  margin-bottom: 8px !important;
}

.row .dot {
  border: 1px solid rgba(255, 200, 130, 0.25) !important;
  background: linear-gradient(150deg, rgba(255, 183, 92, 0.15), rgba(255, 154, 60, 0.08)) !important;
}

/* ---------- 14. 其他页面 sect 统一（兼职/实践/创业/AI） ---------- */
[data-view="jobs"] .sect,
[data-view="practice"] .sect,
[data-view="startup"] .sect,
[data-view="ai"] .sect {
  border: 1px solid rgba(150, 200, 255, 0.18) !important;
  border-radius: 16px !important;
  background: linear-gradient(160deg, rgba(14, 28, 52, 0.88), rgba(9, 18, 36, 0.92)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 28px rgba(0, 0, 0, 0.35) !important;
}

/* ---------- 15. 氛围切换器优化 ---------- */
.theme-sw {
  padding: 6px 0 !important;
}
