/* =========================================================
   主题层 · 晶紫索引 Crystal Violet（2026-10-22）
   在 style.css / pages.css 之后加载，只做视觉override，不改结构
   基调：底色 最淡偏白紫 → 板块 浅紫 → 按钮 中紫（白字 6.9:1）
   ========================================================= */

:root {
  --radius: 8px;
  --gp-grid: rgba(91, 71, 184, 0.045);
}

/* ---------- 底：极淡紫 + 细网格 ---------- */
html {
  background: linear-gradient(180deg, #fbf9ff 0%, #f9f7ff 100%);
  background-attachment: fixed;
}
body {
  background: transparent;
  color: var(--body);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(to right, var(--gp-grid) 1px, transparent 1px),
    linear-gradient(to bottom, var(--gp-grid) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.12) 68%, transparent);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.12) 68%, transparent);
}

/* ---------- 顶栏 ---------- */
.site-header {
  background: rgba(249, 247, 255, 0.92);
  border-bottom: 1px solid var(--line);
  backdrop-filter: saturate(140%) blur(10px);
}
.nav-links a { color: var(--body); border-radius: 6px; }
.nav-links a:hover { background: var(--blue-soft-2); color: var(--navy-700); }
.nav-links a.active { background: var(--blue-soft); color: var(--navy-700); box-shadow: inset 0 -2px 0 var(--navy); }
.brand-mark {
  background: linear-gradient(150deg, #6d57d2, #473596);
  border-radius: 6px;
  box-shadow: 0 4px 10px -6px rgba(71, 53, 150, 0.9);
}
.nav-search, .inline-search { background: #fff; border-color: var(--line); border-radius: 8px; }
.nav-search:focus-within, .inline-search:focus { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(91, 71, 184, 0.14); }

/* ---------- 按钮 ---------- */
.btn {
  background: var(--navy);
  border: 1px solid var(--navy);
  color: #fff;
  border-radius: 8px;
  font-weight: 500;
  box-shadow: 0 3px 0 0 #3f2f8c;
  transition: transform 0.16s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.16s, background 0.16s;
}
.btn:hover {
  background: var(--navy-700); border-color: var(--navy-700); color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 0 0 #372879;
}
.btn:active { transform: translateY(2px); box-shadow: 0 0 0 0 #372879; }
.btn.ghost { background: #fff; color: var(--navy-700); border-color: var(--line); box-shadow: 0 3px 0 0 #e3d9f6; }
.btn.ghost:hover { background: var(--blue-soft-2); border-color: #cdbcf1; }
.btn-light { background: #fff; color: var(--navy-700); border-color: #fff; box-shadow: none; }

/* ---------- 首屏 ---------- */
.page-hero, .hero {
  background:
    radial-gradient(620px 260px at 90% -40%, rgba(122, 99, 201, 0.16), transparent 64%),
    linear-gradient(180deg, #f7f3ff 0%, #f3ecff 100%);
  border-bottom: 1px solid var(--line);
}
.hero::before {
  background-image:
    linear-gradient(to right, rgba(91, 71, 184, 0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(91, 71, 184, 0.05) 1px, transparent 1px);
}
.page-hero h1, .hero h1 { color: var(--ink); }
.hero h1 em { color: var(--navy-700); border-bottom: 3px solid rgba(91, 71, 184, 0.28); }
.page-hero .lead, .hero-lead { color: #453b5e; }
.eyebrow { color: var(--navy-700); }
.eyebrow::before { background: var(--navy); width: 18px; height: 2px; }
.page-hero .kicker, .sec-head .kicker { color: var(--navy-700); }

/* ---------- 搜索：全站查找入口 ---------- */
.hero-search input {
  height: 54px;
  border: 1.5px solid #d9cdf2;
  border-radius: 10px;
  background: #fff;
  font-size: 15px;
  box-shadow: 0 2px 0 0 var(--blue-soft);
  transition: border-color 0.16s, box-shadow 0.16s;
}
.hero-search input:hover { border-color: #c3b0ee; }
.hero-search input:focus {
  border-color: var(--navy);
  box-shadow: 0 0 0 4px rgba(91, 71, 184, 0.16), 0 2px 0 0 #ddd0f7;
}
.hero-search .go { border-radius: 6px; background: var(--navy); font-weight: 500; }
.hero-search .go:hover { background: var(--navy-700); }
.suggest { border-radius: 10px; border-color: var(--line); box-shadow: var(--shadow-lg); overflow: hidden; }
.suggest a:hover { background: var(--blue-soft-2); }
.search-shell { border-radius: 10px; border-color: var(--line); }
.search-tab.on { color: var(--navy-700); border-bottom-color: var(--navy); }

/* ---------- 数据条 ---------- */
.stat-row, .stat-strip {
  background: var(--blue-soft);
  border: 1px solid #ddd0f5;
  border-radius: 10px;
  box-shadow: none;
  overflow: hidden;
}
.stat, .stat-cell { border-right: 1px solid #dfd3f7; }
.stat:hover, .stat-cell:hover { background: #e4d9f9; }
.stat .n, .stat-cell .n {
  color: var(--navy-700);
  font-variant-numeric: tabular-nums;
  font-size: 30px;
}
.stat .l, .stat-cell .l { color: #5b4f78; }

/* ---------- 区块与标题 ---------- */
.section { border-bottom: 1px solid var(--line-soft); }
.section.sand { background: var(--blue-soft); border-top: 1px solid #ddd0f5; border-bottom: 1px solid #ddd0f5; }
.sec-head h2 { color: var(--ink); }
.sec-head .kicker {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--blue-soft);
  border-radius: 4px;
  padding: 3px 9px;
}
.cat-title { color: var(--navy-700); border-bottom: 2px solid var(--blue-soft); padding-bottom: 7px; }

/* ---------- 卡片 ---------- */
.entry-card, .feature, .mj-card, .uni-card, .card, .portal, .salary-card,
.src-card, .career-box, .rank-card, .step {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 1px 0 0 #f0e9fc;
  transition: border-color 0.16s, box-shadow 0.16s, transform 0.16s, background 0.16s;
}
.entry-card:hover, .feature:hover, .portal:hover {
  border-color: var(--navy);
  box-shadow: 0 10px 22px -16px rgba(43, 30, 84, 0.5);
  transform: translateY(-2px);
}
.uni-card:hover, .mj-card:hover {
  border-color: var(--navy);
  background: var(--blue-soft-2);
  transform: translateY(-1px);
}
.entry-card .i, .feature .idx {
  color: var(--navy);
  font-family: var(--mono);
  font-size: 11px;
  background: var(--blue-soft);
  border-radius: 4px;
  padding: 2px 6px;
  display: inline-block;
  width: fit-content;
}
.entry-card .arrow { color: var(--navy-700); font-weight: 500; }
.uni-card .rk, .mj-card .foot b { color: var(--navy-700); font-weight: 600; }
.card h3, .card h4 { color: var(--ink); }
.card .sub { color: var(--muted); }
.prose { color: var(--body); }

/* ---------- 院校详情头图：紫 → 深紫 ---------- */
.detail-hero {
  background:
    radial-gradient(700px 300px at 88% -20%, rgba(164, 138, 240, 0.45), transparent 66%),
    linear-gradient(150deg, #2f2360 0%, #4a3795 55%, #5b47b8 100%);
}
.detail-hero::after { border-color: rgba(255, 255, 255, 0.16); }
.detail-hero h1 { color: #fff; }
.detail-tags .t { border-color: rgba(255, 255, 255, 0.28); }

/* 侧栏 / 排名小卡 */
.rank-card { background: var(--blue-soft-2); border-color: var(--line); }
.rank-card .v { color: var(--navy-700); }
.side-card .card { border-color: var(--line); }
.side-rank .r b { color: var(--navy-700); }
.bar-track { background: #efe6fd; }
.bar-track i { background: #e0d3f7; }
.bar-track i.on { background: var(--navy); }
.scholar { background: var(--blue-soft-2); border-color: var(--line); color: var(--body); }
.major-tag { background: var(--blue-soft); color: var(--navy-700); }
.major-tag:hover { border-color: var(--navy); }

/* ---------- 专业选择器 ---------- */
.major-list { border-radius: 10px; border-color: var(--line); background: #fff; }
.major-cat { background: var(--blue-soft); color: var(--navy-700); }
.major-item { color: var(--body); }
.major-item:hover { background: var(--blue-soft-2); }
.major-item.on { background: var(--blue-soft); color: var(--navy-700); }
.major-uni { background: #fff; }
.major-uni:hover { background: var(--blue-soft-2); box-shadow: inset 3px 0 0 0 var(--navy); }
.major-uni .idx { color: var(--navy); }
.major-uni .rk4 b { color: var(--navy-700); }
.pill { background: #fff; border-color: var(--line); color: var(--body); border-radius: 8px; }
.pill.on { background: var(--navy); border-color: var(--navy); color: #fff; }
.seg { border-radius: 8px; }
.seg button.on { background: var(--navy); }

/* ---------- 表格：斑马纹 + 悬停高亮 ---------- */
.table-wrap { border-radius: 8px; border-color: var(--line); background: #fff; }
table.rank thead th { background: var(--blue-soft); color: #4b3f6a; border-bottom: 1px solid #d8cbf2; }
table.rank thead th:hover { background: #e3d8f8; color: var(--navy-700); }
table.rank thead th.on { background: #d9cbf5; color: var(--navy-700); }
table.rank tbody tr:nth-child(even) { background: #fbf8ff; }
table.rank tbody tr { transition: background 0.14s, box-shadow 0.14s; }
table.rank tbody tr:hover { background: #f0e8ff; box-shadow: inset 3px 0 0 0 var(--navy); }
table.rank tbody td { border-bottom: 1px solid var(--line-soft); }
.u-avatar { background: var(--blue-soft); color: var(--navy-700); border-radius: 6px; }
.region-tag { background: var(--blue-soft); color: var(--navy-700); border-radius: 4px; }
.rk-num, .rank-pill { font-variant-numeric: tabular-nums; }
/* 排名表里的「官网 ↗」直链：小、不抢主链接，但可点可辨 */
.u-site {
  color: var(--navy-700);
  text-decoration: none;
  border-bottom: 1px dotted #bfa9ee;
  white-space: nowrap;
  transition: color 0.16s, border-color 0.16s;
}
.u-site:hover { color: var(--navy); border-bottom-color: var(--navy); }
.rk-num.top { color: var(--navy-700); font-weight: 700; }
.tag-country { background: #f4eefe; border-color: #e6dcf7; color: #514667; border-radius: 4px; }
.cmp-box { accent-color: var(--navy); }

/* ---------- 提示 / 代码 / 徽标 ---------- */
.notice {
  background: var(--blue-soft);
  border: 1px solid #ddd0f5;
  border-left: 4px solid var(--navy);
  border-radius: 0 8px 8px 0;
  color: #41365c;
}
.notice.warn { background: #fdf5f8; border-color: #f0dde3; border-left-color: #a8455c; color: #7a4552; }
.badge-official { color: var(--green); border-color: #cfe3d9; background: #f1f8f5; }
code.inline { background: var(--blue-soft); color: #45328f; border-radius: 4px; }

/* ---------- 对比条 / 弹窗 ---------- */
.cmp-bar {
  background: linear-gradient(180deg, #2f2549, #241c3d);
  box-shadow: 0 -10px 40px -18px rgba(28, 22, 46, 0.6);
}
.cmp-chip { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.18); border-radius: 6px; }
.modal { border-radius: 10px; }
.modal-head { border-bottom-color: var(--line); }
table.cmp thead th { background: var(--blue-soft); }
table.cmp td.best { background: #f1f8f5; color: var(--green); }
table.cmp td.worst { background: #fdf5f8; color: var(--red); }

/* ---------- 检索入口 / 录取 / 学院卡（沿用 token，只补圆角与描边） ---------- */
.step, .fac-card, .admit-card, .entry-card, .portal, .ie-prog, .g-k {
  border-radius: var(--radius);
}
.fac-card, .admit-card, .g-k { border-color: var(--line); background: #fff; }
.fac-h, .admit-h, .ie-h { color: var(--ink); }
.fac-stat b, .ie-stat b { color: var(--navy-700); }
.bs-tag { background: var(--blue-soft); color: var(--navy-700); border-radius: 4px; }
.ctry-head { border-top-color: var(--line); }

/* ---------- 页脚 ---------- */
.site-footer {
  background: linear-gradient(180deg, #2a2047 0%, #1d1730 100%);
  border-top: 3px solid var(--navy);
  color: rgba(255, 255, 255, 0.72);
}
.site-footer .brand-cn { color: #fff; }
.footer-col a { color: rgba(255, 255, 255, 0.76); }
.footer-col a:hover { color: #fff; }
.footer-refs a { border-color: rgba(255, 255, 255, 0.16); border-radius: 6px; }

/* ---------- 可达性：焦点必须可见 ---------- */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
summary:focus-visible, .chip:focus-visible {
  outline: 3px solid rgba(91, 71, 184, 0.55);
  outline-offset: 2px;
  border-radius: 6px;
}

/* 表单控件统一描边 */
.chip { background: #fff; border-color: var(--line); color: var(--body); border-radius: 8px; }
.chip:hover { border-color: var(--navy); color: var(--navy-700); }
.chip.on { background: var(--navy); border-color: var(--navy); color: #fff; }

/* ---------- 动效：点得动、找得到，不做漂浮 ---------- */
@keyframes gpFade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.entry-card, .uni-card, .mj-card, .stat { animation: gpFade 0.36s ease-out both; }
.entry-card:nth-child(2), .uni-card:nth-child(2), .stat:nth-child(2) { animation-delay: 0.03s; }
.entry-card:nth-child(3), .uni-card:nth-child(3), .stat:nth-child(3) { animation-delay: 0.06s; }
.entry-card:nth-child(4), .uni-card:nth-child(4), .stat:nth-child(4) { animation-delay: 0.09s; }

@media (prefers-reduced-motion: reduce) {
  .entry-card, .uni-card, .mj-card, .stat { animation: none; }
  * { transition-duration: 0.01ms !important; }
}

/* ---------- 小屏校正 ---------- */
@media (max-width: 760px) {
  .hero-search input { height: 50px; padding-right: 100px; font-size: 14px; }
  .stat-row, .stat-strip { border-radius: 8px; }
  .stat .n, .stat-cell .n { font-size: 24px; }
}
