/* 天体数据库工具页样式（适配 Material 明暗双主题，使用 md CSS 变量）
 *
 * 响应式策略：mobile-first + 渐进增强
 *   基线（< 600px）：移动布局——「紧凑列表行」取代卡片网格（去卡片外壳、
 *     52px 缩略图 + 两行文字 + 1px 分隔线，一屏 6+ 行，信息密度优先）、
 *     hero 统计拍平为一行小字、详情页 hero 无壳平铺、表格横滚、对比图纵排
 *   ≥ 600px：平板过渡（恢复卡片网格视觉、工具栏回绕、对比图横排）
 *   ≥ 1024px：桌面视觉（恢复历史桌面样式）
 * 断点对齐 Material 主题体系；hover 效果仅 @media (hover: hover) 生效（触屏不粘滞）
 * 设计依据：移动端数据工具的主流形态是原生列表（App Store / 知乎 / NASA App），
 *   卡片在窄屏下"不大不小"——边框、圆角、留白吃掉的空间远大于其信息增量。
 */

/* ============================================================
 * 全局
 * ============================================================ */
.md-grid {
  /* 移动端（<600px）满宽：手机屏本就不大，90% 留白纯属浪费；平板及以上在 ≥600 媒体查询里恢复 90% 上限 */
  max-width: 100%;
}
/* hero / 底部说明区文字限宽，避免拉太宽难读 */
.astro-hero > * {
  max-width: 48rem;
  margin-inline: auto;
}
.astro-articles, .astro-note, .obj-articles {
  max-width: 64rem;
  margin-inline: auto;
}
/* 详情页正文与来源区限宽，长文阅读舒适 */
.obj-source, .obj-article {
  max-width: 52rem;
  margin-inline: auto;
}

/* ============================================================
 * 表格横向滚动（移动端多列表格必需，JS 把 .md-typeset table 包进来）
 * ============================================================ */
.table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 0.7rem;
  position: relative;
}
/* 右缘渐隐：提示"右边还有列"。background-attachment:local 让渐变随内容
   滚动——滚到边缘自然消失，不遮内容；仅可横滚时由 JS 加 .is-scrollable 启用 */
.table-scroll.is-scrollable {
  background-image: linear-gradient(to left, var(--md-default-bg-color), transparent);
  background-position: 100% 0;
  background-repeat: no-repeat;
  background-size: 2.2em 100%;
  background-attachment: local;
}
.md-typeset .table-scroll table {
  margin: 0;
  /* 多列表格（天体库总表 10 列）的最小可读宽度：窄容器下保持列宽、
     容器横向滚动，而不是把每列压扁；桌面/平板容器宽于此时不触发滚动 */
  min-width: 40rem;
}
/* 横滚容器内数值不折行：列按内容撑宽（总宽超容器时横向滚动查看），
   避免 "3.3×10²³ kg" 被折成 "3.3" + "kg" 两行。
   加 .md-typeset 前缀提特异性，压过 Material 主题自带的表格规则 */
.md-typeset .table-scroll th,
.md-typeset .table-scroll td { white-space: nowrap; }
/* 字段说明表的「含义」列是长文本，允许折行 */
.md-typeset .obj-fields .table-scroll td:nth-child(2),
.md-typeset .obj-fields .table-scroll th:nth-child(2) { white-space: normal; }
/* 首列固定：横滚时天体名称不丢（实底色遮住滚过的列）。
   斑马纹/表头底色都压在 td 自身背景之下，实底即可遮住滚过的列 */
.md-typeset .table-scroll th:first-child,
.md-typeset .table-scroll td:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--md-default-bg-color);
}

/* ============================================================
 * 首页 hero（基线：移动——原生 App 式纯文本头，无卡片外壳；
 * 分类统计已并入筛选 chips（"恒星 55"），此处不再重复展示）
 * ============================================================ */
.astro-hero {
  text-align: left;
  padding: 0.2rem 0 0;
  margin-bottom: 0.6rem;
}
.astro-hero h1 {
  margin: 0 0 0.15rem;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--md-default-fg-color);
}
.astro-hero-sub {
  margin: 0 0 0.15rem;
  font-size: 0.8rem;
  line-height: 1.5;
  color: var(--md-default-fg-color--light);
  text-wrap: pretty;            /* 渐进增强：避免孤字断行 */
}
.astro-hero-links {
  margin: 0;
  font-size: 0.75rem;
  color: var(--md-default-fg-color--light);
}
.astro-hero-links .sep {
  margin: 0 0.4rem;
  opacity: 0.5;
}

/* ============================================================
 * 工具栏（基线：移动——搜索与排序同行、chips 整行横滑，压缩垂直占用）
 * ============================================================ */
.astro-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 0.7rem;
  margin: 0 0 0.4rem;
  border-radius: 0.8rem;
  background: var(--md-default-bg-color);
  border: 1px solid var(--md-default-fg-color--lightest);
  position: sticky;
  /* top 由 JS 按 .md-header 实际高度写入 --astro-sticky-top，避免被吸顶 header 遮住 */
  top: var(--astro-sticky-top, 0px);
  z-index: 5;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--md-default-fg-color) 5%, transparent);
}
.astro-toolbar #astro-search {
  flex: 1 1 4rem;               /* 小基准 + shrink：与排序同行不换行（根字号 20px，4rem=80px） */
  min-width: 0;
  padding: 0.5rem 0.9rem;
  font-size: 16px;              /* ≥16px：防 iOS 聚焦自动放大页面 */
  border-radius: 999px;
  border: 1px solid var(--md-default-fg-color--lightest);
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
}
.astro-toolbar #astro-search:focus {
  outline: 2px solid var(--md-primary-fg-color);
  outline-offset: 1px;
}
/* 排序与搜索同行（推到行右），chips 独占第二行横滑。
   注意：chips 的 flex-basis:100% 会强制换行，故用 order:-1 把排序提到
   chips 之前（否则排序会掉到第三行）——HTML 顺序不变，仅视觉顺序 */
.astro-sort-label {
  order: -1;
  flex: 0 0 auto;
  margin-left: auto;
  font-size: 0.76rem;
  color: var(--md-default-fg-color--light);
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}
.astro-sort-label select {
  padding: 0.38rem 0.45rem;
  font-size: 16px;              /* ≥16px：防 iOS 聚焦自动放大页面 */
  border-radius: 0.5rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
}
/* chips 横滑：12 个分类不换行占屏，像 App Store 一样横扫 */
.astro-chips {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;         /* Firefox 隐藏滚动条 */
  gap: 0.4rem;
  flex: 1 1 100%;
  -webkit-overflow-scrolling: touch;
}
.astro-chips::-webkit-scrollbar { display: none; }
.chip {
  flex: 0 0 auto;
  padding: 0.45rem 0.85rem;      /* 触摸友好高度 */
  font-size: 0.84rem;
  border-radius: 999px;
  border: 1px solid var(--md-default-fg-color--lightest);
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color--light);
  cursor: pointer;
  transition: background-color 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.chip.active {
  background: var(--md-primary-fg-color);
  border-color: var(--md-primary-fg-color);
  color: var(--md-primary-bg-color);
}
.astro-count {
  margin: 0.25rem 0 0.6rem;
  font-size: 0.76rem;
  color: var(--md-default-fg-color--light);
}

/* ============================================================
 * 天体列表（基线：移动——去卡片化的紧凑列表行）
 * 移动端数据工具的主流形态是原生列表（App Store / 知乎 / NASA App）：
 * 无卡片外壳，52px 缩略图 + 两行文字 + 1px 分隔线，一屏 6+ 行。
 * ≥600px 恢复卡片网格视觉。
 * ============================================================ */
.astro-grid {
  display: block;
}
.astro-card {
  position: relative;
  border: none;
  background: transparent;
  border-radius: 0;
  overflow: visible;
}
.astro-card[hidden] { display: none; }
/* 行间发丝线：通栏分隔，无卡片缝隙 */
.astro-card + .astro-card {
  border-top: 1px solid var(--md-default-fg-color--lightest);
}
.astro-card-link {
  display: flex;
  flex: 1;
  min-width: 0;
  align-items: center;
  gap: 0.7rem;
  padding: 0.5rem 0.15rem;
  min-height: 60px;                /* 触摸目标下限 */
  text-decoration: none;
  color: inherit;
  border-radius: 0.5rem;
  transition: background-color 0.08s ease;
}
/* 行按压反馈：触屏点击高亮整行，原生列表感 */
.astro-card-link:active {
  background: color-mix(in srgb, var(--md-primary-fg-color) 8%, transparent);
}
/* 缩略图：44px 球体装进 52px 圆角框。含环宽幅图（900×600）按高度缩放后
   宽 66px，由 overflow 裁两侧——球体完整且跨天体视觉等大（圆盘图 44×44 恰好） */
.astro-img {
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  min-height: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--md-default-fg-color) 5%, transparent);
}
.astro-img img {
  height: 44px;
  width: auto;
  max-width: none;
  object-fit: contain;
}
.astro-img-fallback span {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}
.astro-img-fallback.planet span { background: linear-gradient(135deg, #4a90d9, #2b5f9e); }
.astro-img-fallback.star span { background: linear-gradient(135deg, #f5a623, #e06c00); }
.astro-img-fallback.dwarf_planet span { background: linear-gradient(135deg, #9b7fc4, #6a4fa0); }
.astro-img-fallback.moon span { background: linear-gradient(135deg, #8d99ae, #5c6773); }
.astro-img-fallback.asteroid span { background: linear-gradient(135deg, #b08a4a, #7a5e2e); }
.astro-img-fallback.exoplanet span { background: linear-gradient(135deg, #2a8a78, #1c5e52); }
.astro-img-fallback.black_hole span { background: linear-gradient(135deg, #3c346e, #14142a); }
.astro-img-fallback.nebula span { background: linear-gradient(135deg, #e06ac8, #8a2f6e); }
.astro-img-fallback.galaxy span { background: linear-gradient(135deg, #f2c94c, #8a5a00); }
.astro-img-fallback.cluster span { background: linear-gradient(135deg, #d9a5ff, #6a3a8a); }
.astro-img-fallback.structure span { background: linear-gradient(135deg, #7fd4ff, #2a6a8a); }
.astro-img-fallback.comet span { background: linear-gradient(135deg, #7fe0d0, #1f7a6a); }

.astro-card-body {
  /* 不用 flex:1——grow 会先吃光剩余空间，行尾徽章的 margin-left:auto 将失效
     （徽章被挤出右缘）。内容基准 + shrink:1：窄时收缩，宽时把空间让给徽章 */
  flex: 0 1 auto;
  min-width: 0;
  padding: 0;
}
.astro-card-title {
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--md-default-fg-color);
}
/* 移动端列表行隐藏英文名：窄行宽下英文名换行会撑高标题行，
   中文名 + tagline + 数据已足够识别；英文名保留在详情页与搜索匹配中（≥600px 恢复） */
.astro-card-title .en {
  display: none;
}
.astro-card-tagline {
  margin: 0.08rem 0 0.16rem;
  font-size: 0.78rem;
  line-height: 1.45;
  color: var(--md-default-fg-color--light);
  display: -webkit-box;
  -webkit-line-clamp: 1;           /* 单行：列表行高优先，摘要交给详情页 */
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.astro-card-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.1rem 0.25rem;
  font-size: 0.65rem;
  line-height: 1.5;
  color: var(--md-default-fg-color--light);
}
.astro-card-stats span {
  padding: 0.02rem 0.34rem;
  border-radius: 0.3rem;
  background: color-mix(in srgb, var(--md-primary-fg-color) 8%, transparent);
  white-space: nowrap;
}
/* 类型徽章：从绝对定位（卡角）改为行尾 accessory，像 iOS 列表右侧的信息标。
   flex:0 0 auto 保证不被收缩；margin-left:auto 把徽章推到行尾 */
.astro-badge {
  position: static;
  align-self: center;
  flex: 0 0 auto;
  margin-left: auto;
  padding: 0.12rem 0.42rem;
  font-size: 0.62rem;
  line-height: 1.4;
  border-radius: 999px;
  color: #fff;
  backdrop-filter: none;
}
.astro-badge.planet { background: rgba(43, 95, 158, 0.85); }
.astro-badge.star { background: rgba(224, 108, 0, 0.88); }
.astro-badge.dwarf_planet { background: rgba(106, 79, 160, 0.85); }
.astro-badge.moon { background: rgba(92, 103, 115, 0.85); }
.astro-badge.asteroid { background: rgba(140, 110, 60, 0.85); }
.astro-badge.exoplanet { background: rgba(30, 130, 120, 0.85); }
.astro-badge.black_hole { background: rgba(60, 52, 110, 0.9); }
.astro-badge.nebula { background: rgba(178, 62, 138, 0.88); }
.astro-badge.galaxy { background: rgba(176, 138, 40, 0.88); }
.astro-badge.cluster { background: rgba(140, 78, 160, 0.85); }
.astro-badge.structure { background: rgba(40, 110, 150, 0.88); }
.astro-badge.comet { background: rgba(31, 122, 106, 0.88); }

.astro-empty {
  padding: 2.5rem 1rem;
  text-align: center;
  color: var(--md-default-fg-color--light);
  border: 1px dashed var(--md-default-fg-color--lightest);
  border-radius: 0.8rem;
}

/* ============================================================
 * 文章区 / 数据说明（基线：移动——去壳，发丝线分隔，与列表同语言）
 * ============================================================ */
.astro-articles, .astro-note, .obj-articles,
.obj-source, .obj-article {
  margin-top: 1rem;
  padding: 0.85rem 0;
  border: none;
  border-radius: 0;
  background: transparent;
  border-top: 1px solid var(--md-default-fg-color--lightest);
}
.astro-articles h2, .astro-note h2, .obj-articles h2,
.obj-source h2, .obj-article h2 {
  margin-top: 0;
  font-size: 1rem;
}
.astro-article-list {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.astro-article-list li a {
  display: inline-block;
  padding: 0.45rem 0.8rem;        /* 触摸友好 */
  font-size: 0.82rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--md-primary-fg-color) 30%, transparent);
  text-decoration: none;
}
.astro-note p { font-size: 0.84rem; color: var(--md-default-fg-color--light); }

/* ============================================================
 * 详情页（基线：移动——hero 无壳平铺，像原生 App 的详情头图区）
 * ============================================================ */
.obj-hero {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  align-items: center;
  text-align: center;
  padding: 0 0 0.9rem;
  margin: 0.3rem 0 0.9rem;
  border: none;
  border-radius: 0;
  background: transparent;
  border-bottom: 1px solid var(--md-default-fg-color--lightest);
}
/* 移动端大图置顶 */
.obj-hero .astro-img,
.obj-hero-imgwrap {
  order: -1;
}
.obj-hero .astro-img {
  width: auto;
  height: 170px;
  max-width: 100%;
  flex: 0 0 auto;
  background: transparent;
}
.obj-hero .astro-img img { width: auto; height: 170px; max-width: 100%; }
.obj-hero-imgwrap {
  width: auto;
  max-width: 100%;
  flex: 0 1 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.obj-hero-info { flex: 1 1 auto; min-width: 0; order: 1; }
/* 详情页徽章：行内显示在标题上方 */
.obj-hero-info .astro-badge {
  position: static;
  display: inline-block;
  margin: 0 0 0.25rem;
  padding: 0.14rem 0.55rem;
  font-size: 0.7rem;
  backdrop-filter: none;
}
.astro-img-credit {
  margin-top: 0.4rem;
  font-size: 0.62rem;
  line-height: 1.35;
  text-align: center;
  color: var(--md-default-fg-color--light);
  word-break: break-all;
}
.astro-img-credit a { color: inherit; text-decoration: underline; }
.obj-hero-info h1 {
  margin: 0.1rem 0 0.2rem;
  font-size: 1.3rem;
  border: none;
}
.obj-hero-info h1 small {
  font-size: 0.8rem;
  font-weight: 400;
  color: var(--md-default-fg-color--light);
  margin-left: 0.4rem;
}
.obj-tagline {
  margin: 0 0 0.6rem;
  font-size: 0.88rem;
  color: var(--md-default-fg-color--light);
  text-wrap: pretty;
}
.obj-keystats {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.3rem;
}
.obj-keystats span {
  padding: 0.22rem 0.6rem;
  font-size: 0.76rem;
  border-radius: 0.45rem;
  border: none;
  background: color-mix(in srgb, var(--md-primary-fg-color) 8%, transparent);
}
.obj-parent {
  font-size: 0.84rem;
  color: var(--md-default-fg-color--light);
  margin: 0 0 0.9rem;
}
.obj-nav {
  font-size: 0.86rem;
  color: var(--md-default-fg-color--light);
  margin: 0.3rem 0;
}


/* ---------- 天体库字段说明折叠 ---------- */
.obj-fields {
  margin: 1rem 0;
  padding: 0.7rem 0.9rem;
  border-radius: 0.7rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  font-size: 0.84rem;
}
.obj-fields summary {
  cursor: pointer;
  color: var(--md-default-fg-color--light);
  padding: 0.3rem 0;
}
.obj-fields table { font-size: 0.78rem; }

/* ---------- 版本戳（判断浏览器缓存） ---------- */
.obj-version {
  margin-top: 1.3rem;
  padding-top: 0.8rem;
  border-top: 1px dashed var(--md-default-fg-color--lightest);
  font-size: 0.72rem;
  color: var(--md-default-fg-color--light);
}

/* ============================================================
 * 数据集页（基线：移动——下载项改列表行，去卡壳）
 * ============================================================ */
.dl-cards {
  display: block;
  margin: 0.7rem 0;
}
.dl-card {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.6rem 0.15rem;
  border: none;
  border-radius: 0;
  background: transparent;
  text-decoration: none;
}
.dl-card + .dl-card {
  border-top: 1px solid var(--md-default-fg-color--lightest);
}
.dl-card b {
  font-size: 0.92rem;
  color: var(--md-primary-fg-color);
  white-space: nowrap;
}
.dl-card b::after { content: " ↓"; opacity: 0.55; font-weight: 400; }
.dl-card span { font-size: 0.8rem; color: var(--md-default-fg-color--light); }

/* ============================================================
 * 天体对比页 compare.md（基线：移动）
 * ============================================================ */
/* 选择器：移动端也与桌面一致，A / B 横排（不纵向堆叠）；两端均衡分配、不无限拉伸 */
.sizecmp-bar {
  display: flex;
  flex-direction: row;          /* 始终横排：A 左 B 右，与桌面端布局一致 */
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: center;
  gap: 0.6rem 0.8rem;
  margin: 1rem 0 1.2rem;
}
.sizecmp-pick { display: flex; flex-direction: column; gap: 0.35rem; flex: 1 1 0; min-width: 0; }
.sizecmp-label { font-size: 0.8rem; color: var(--md-default-fg-color--light); }
.sizecmp-select {
  width: 100%;
  min-width: 0;
  padding: 0.65rem 0.8rem;       /* 触摸友好 */
  font-size: 16px;               /* ≥16px：防 iOS 聚焦自动放大页面 */
  border-radius: 0.6rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
}
.sizecmp-select:focus { outline: 2px solid var(--md-primary-fg-color); outline-offset: 1px; }
/* 类型筛选下拉：比天体下拉小一号，形成层级 */
.sizecmp-select.sizecmp-cat { font-size: 0.9rem; padding: 0.5rem 0.7rem; }
/* ---- 天体对比可视化（HTML 双列；移动端横排 A 左 B 右；字体不随缩放变小）---- */
.sizecmp-viz { margin: 0 0 1rem; }
.sizecmp-viz-canvas { display: block; max-width: 900px; margin: 0 auto; }
.sizecmp-viz-inner {
  display: flex;
  flex-direction: row;          /* 始终横排：A 左 B 右，方便并排对比 */
  align-items: flex-end;        /* 两球底对齐，真实比例一眼可辨 */
  justify-content: center;
  gap: 1.4rem;
}
.sizecmp-side {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  min-width: 0;
}
.sizecmp-ball-wrap {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.sizecmp-img {
  display: block;
  flex: 0 0 auto;            /* 禁止 flex 容器在窄屏把图压窄（否则宽被缩、高不变 → 椭圆畸变） */
  /* 尺寸由 JS 按真实宽高比 + 统一缩放推导，禁止任何 width/height 兜底钳制以免变形 */
  object-fit: contain;       /* 双保险：即便盒子比例异常也只留透明边距，绝不拉伸贴图 */
  filter: drop-shadow(0 2px 8px color-mix(in srgb, var(--md-default-fg-color) 18%, transparent));
}
.sizecmp-solid {
  display: flex;
  flex: 0 0 auto;            /* 同 img，禁止被 flex 容器压窄 */
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #fff;
  font-weight: 700;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}
.sizecmp-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1.5px solid color-mix(in srgb, var(--md-default-fg-color) 35%, transparent);
}
.sizecmp-name {
  margin-top: 0.55rem;
  font-size: 1.05rem;          /* 天体名（月球 / 地球） */
  font-weight: 700;
  color: var(--md-default-fg-color);
  line-height: 1.3;
}
.sizecmp-name-dot { color: var(--md-primary-fg-color); }
.sizecmp-sub {
  font-size: 0.95rem;          /* 半径等数值（1737 km）明显加大 */
  color: var(--md-default-fg-color--light);
  margin-top: 0.1rem;
}
.sizecmp-dot-note {
  font-size: 0.85rem;
  color: var(--md-default-fg-color--light);
  margin-top: 0.3rem;
  max-width: 15rem;
}
.sizecmp-viz-note {
  font-size: 0.82rem;
  line-height: 1.6;
  color: var(--md-default-fg-color--light);
  margin: 0.9rem auto 0;
  max-width: 52rem;
  text-wrap: pretty;
}
/* 核心倍数卡 */
.sizecmp-ratios {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.8rem;
  margin: 0 0 1.4rem;
}
.sizecmp-ratio-card {
  padding: 0.9rem 1rem;
  border-radius: 0.8rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  background: var(--md-default-bg-color);
  text-align: center;
}
.sizecmp-ratio-title { font-size: 0.85rem; color: var(--md-default-fg-color--light); }
.sizecmp-ratio-big {
  font-size: 2rem;
  font-weight: 800;
  color: var(--md-primary-fg-color);
  line-height: 1.1;
  margin: 0.2rem 0;
}
.sizecmp-ratio-sub { font-size: 0.8rem; color: var(--md-default-fg-color--light); margin-bottom: 0.5rem; }
.sizecmp-ratio-rows { display: flex; flex-direction: column; gap: 0.3rem; font-size: 0.85rem; text-align: left; }
.sizecmp-ratio-rows .dot { display: inline-block; width: 0.6rem; height: 0.6rem; border-radius: 50%; margin-right: 0.4rem; vertical-align: middle; }
.sizecmp-ratio-rows b { color: var(--md-default-fg-color); }
.sizecmp-ratio-rows i { color: var(--md-default-fg-color--light); font-style: normal; font-size: 0.76rem; margin-left: 0.3rem; }
/* 详细数据表（加大字号，移动端更清晰） */
.sizecmp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
  background: var(--md-default-bg-color);
  border-radius: 0.7rem;
  overflow: hidden;
}
.sizecmp-table th, .sizecmp-table td {
  padding: 0.5rem 0.6rem;
  border-bottom: 1px solid var(--md-default-fg-color--lightest);
  text-align: right;
}
.sizecmp-table thead th { background: color-mix(in srgb, var(--md-primary-fg-color) 8%, transparent); text-align: right; }
.sizecmp-table th:first-child, .sizecmp-table td:first-child { text-align: left; color: var(--md-default-fg-color--light); }
.sizecmp-table tbody tr:last-child th, .sizecmp-table tbody tr:last-child td { border-bottom: none; }
.sizecmp-detail-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 0.7rem;
}
.sizecmp-detail-scroll .sizecmp-table { min-width: 34rem; }
.sizecmp-share { font-size: 0.76rem; color: var(--md-default-fg-color--light); margin-top: 0.9rem; }
/* 悬殊比例（>1000:1）出现的「线性 / 对数」刻度切换按钮 */
.sizecmp-scale {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin: 0 0 0.6rem;
}
.sizecmp-scale-label { font-size: 0.82rem; color: var(--md-default-fg-color--light); }
.sizecmp-scale button {
  min-height: 40px;              /* 触摸友好 */
  padding: 0.4rem 1.1rem;
  font-size: 0.84rem;
  border-radius: 999px;
  border: 1px solid var(--md-default-fg-color--lightest);
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color--light);
  cursor: pointer;
  transition: border-color 0.12s ease, color 0.12s ease;
}
.sizecmp-scale button.active {
  background: var(--md-primary-fg-color);
  border-color: var(--md-primary-fg-color);
  color: var(--md-primary-bg-color);
}

/* ============================================================
 * 深色星空背景（slate 主题）
 * ============================================================ */
/* 天体贴图多取自黑底太空照，圆盘外残留的暗色边在浅色页面上很显眼；
   深色主题下整站铺星空底，残边自然融入，也契合天文站气质 */
html[data-md-color-scheme="slate"] body {
  background-color: #05070d;
  background-image:
    radial-gradient(1.6px 1.6px at 25px 55px, rgba(255, 255, 255, 0.9), transparent 60%),
    radial-gradient(1px 1px at 120px 35px, rgba(255, 255, 255, 0.7), transparent 60%),
    radial-gradient(1.3px 1.3px at 195px 140px, rgba(255, 255, 255, 0.8), transparent 60%),
    radial-gradient(0.9px 0.9px at 85px 175px, rgba(255, 255, 255, 0.55), transparent 60%),
    radial-gradient(1.5px 1.5px at 235px 210px, rgba(200, 220, 255, 0.85), transparent 60%),
    radial-gradient(1px 1px at 300px 95px, rgba(255, 255, 255, 0.5), transparent 60%),
    radial-gradient(1.2px 1.2px at 45px 245px, rgba(255, 255, 255, 0.65), transparent 60%),
    radial-gradient(0.8px 0.8px at 160px 285px, rgba(255, 255, 255, 0.45), transparent 60%),
    radial-gradient(circle at 18% 22%, rgba(70, 110, 190, 0.08), transparent 42%),
    radial-gradient(circle at 78% 68%, rgba(130, 90, 190, 0.08), transparent 45%);
  background-size: 320px 320px, 320px 320px, 320px 320px, 320px 320px,
    320px 320px, 320px 320px, 320px 320px, 320px 320px, 100% 100%, 100% 100%;
  background-attachment: fixed;
}
/* 内容容器半透明让星空从页缝间透出；卡片/工具栏等面板保持实底色保证可读性 */
html[data-md-color-scheme="slate"] .md-main,
html[data-md-color-scheme="slate"] .md-footer,
html[data-md-color-scheme="slate"] .md-footer-meta {
  background-color: color-mix(in srgb, var(--md-default-bg-color) 82%, transparent);
}
html[data-md-color-scheme="slate"] .md-header {
  background-color: color-mix(in srgb, var(--md-default-bg-color) 82%, transparent);
  backdrop-filter: blur(2px);
}

/* ============================================================
 * 平板增强（≥ 600px）：恢复卡片网格视觉（基线为列表行，此处显式还原）
 * ============================================================ */
@media (min-width: 600px) {
  /* 恢复 hero 渐变卡片（桌面/平板视觉） */
  .astro-hero {
    text-align: center;
    padding: 2rem 1.2rem 1.5rem;
    margin-bottom: 0.9rem;
    border-radius: 1rem;
    background: linear-gradient(135deg,
      color-mix(in srgb, var(--md-primary-fg-color) 12%, transparent),
      color-mix(in srgb, var(--md-primary-fg-color) 4%, transparent));
    border: 1px solid color-mix(in srgb, var(--md-primary-fg-color) 18%, transparent);
  }
  .astro-hero h1 { font-size: 1.8rem; }
  .astro-hero-sub { font-size: 1rem; }
  .astro-hero-links { font-size: 0.84rem; }
  .astro-toolbar { padding: 0.85rem 1rem; gap: 0.7rem; }
  .astro-toolbar #astro-search { flex: 1 1 12rem; font-size: 0.92rem; }
  .astro-chips { flex: 0 1 auto; flex-wrap: wrap; overflow: visible; }
  .astro-sort-label { order: 0; margin-left: 0; font-size: 0.84rem; }
  .astro-sort-label select { font-size: 0.84rem; }
  /* 恢复双列横卡（图左文右）：完整还原历史平板视觉 */
  .astro-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  .astro-card {
    position: relative;
    display: flex;
    border: 1px solid var(--md-default-fg-color--lightest);
    background: var(--md-default-bg-color);
    border-radius: 0.9rem;
    overflow: hidden;
  }
  .astro-card + .astro-card { border-top: 1px solid var(--md-default-fg-color--lightest); }
  .astro-card-link {
    display: flex;
    flex: 1;
    min-width: 0;
    align-items: stretch;
    gap: 0;
    padding: 0;
    min-height: 0;
    border-radius: 0;
  }
  .astro-card-link:active { background: transparent; }
  .astro-img {
    flex: 0 0 118px;
    width: 118px;
    height: auto;
    min-height: 128px;
    padding: 0.5rem;
    border-radius: 0;
    background: transparent;
  }
  .astro-img img {
    height: 96px;
    max-width: 100%;
    /* 恢复卡片图的投影（桌面/平板原有视觉） */
    filter: drop-shadow(0 2px 6px color-mix(in srgb, var(--md-default-fg-color) 18%, transparent));
  }
  .astro-img-fallback span { width: 84px; height: 84px; font-size: 1.8rem; }
  .astro-card-body { flex: 1; min-width: 0; padding: 0.7rem 0.85rem 0.8rem; }
  .astro-card-title { font-size: 1rem; }
  /* 恢复英文名显示（平板卡片够宽） */
  .astro-card-title .en {
    display: inline;
    margin-left: 0.35rem;
    font-size: 0.74rem;
    font-weight: 400;
    color: var(--md-default-fg-color--light);
  }
  .astro-card-tagline { font-size: 0.78rem; -webkit-line-clamp: 2; margin: 0.25rem 0 0.45rem; }
  .astro-card-stats { font-size: 0.72rem; gap: 0.28rem 0.45rem; }
  .astro-card-stats span { padding: 0.1rem 0.42rem; }
  /* 徽章恢复卡角绝对定位 */
  .astro-badge {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    margin-left: 0;
    padding: 0.12rem 0.5rem;
    font-size: 0.68rem;
    backdrop-filter: blur(2px);
  }
  /* 文章/说明区恢复卡片 */
  .astro-articles, .astro-note, .obj-articles,
  .obj-source, .obj-article {
    margin-top: 2rem;
    padding: 1.1rem 1.3rem;
    border: 1px solid var(--md-default-fg-color--lightest);
    border-radius: 0.8rem;
    background: var(--md-default-bg-color);
  }
  .astro-articles h2, .astro-note h2, .obj-articles h2,
  .obj-source h2, .obj-article h2 { font-size: 1.05rem; }
  /* 详情页 hero 恢复渐变卡 */
  .obj-hero {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    text-align: left;
    padding: 1.4rem;
    margin: 0.5rem 0 1rem;
    gap: 1rem;
    border: 1px solid color-mix(in srgb, var(--md-primary-fg-color) 15%, transparent);
    border-radius: 1rem;
    background: linear-gradient(135deg,
      color-mix(in srgb, var(--md-primary-fg-color) 10%, transparent),
      color-mix(in srgb, var(--md-primary-fg-color) 3%, transparent));
  }
  .obj-hero .astro-img,
  .obj-hero-imgwrap { order: 2; }        /* 恢复桌面：图在右 */
  .obj-hero .astro-img { height: 300px; background: transparent; }
  .obj-hero .astro-img img { height: 300px; }
  .obj-hero-info { flex: 1 1 16rem; }
  /* 详情页徽章恢复绝对定位于 hero 右上（hero 需 relative） */
  .obj-hero { position: relative; }
  .obj-hero-info .astro-badge {
    position: absolute;
    top: 0.9rem;
    right: 1rem;
    display: inline-block;
    margin: 0;
    padding: 0.14rem 0.55rem;
    font-size: 0.7rem;
    backdrop-filter: blur(2px);
  }
  .obj-hero-info h1 { font-size: 1.7rem; }
  .obj-keystats { justify-content: flex-start; }
  .obj-keystats span {
    padding: 0.3rem 0.7rem;
    font-size: 0.8rem;
    border-radius: 0.5rem;
    border: 1px solid var(--md-default-fg-color--lightest);
    background: var(--md-default-bg-color);
  }
  .obj-tagline { font-size: 0.98rem; }
  .obj-parent { font-size: 0.84rem; margin: 0 0 0.9rem; }
  .obj-source p { font-size: 0.82rem; }
  /* 数据集页恢复下载卡网格 */
  .dl-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0.9rem; margin: 1rem 0; }
  .dl-card {
    display: block;
    padding: 0.9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--md-primary-fg-color) 25%, transparent);
    border-radius: 0.8rem;
    background: var(--md-default-bg-color);
  }
  .dl-card + .dl-card { border-top: 1px solid color-mix(in srgb, var(--md-primary-fg-color) 25%, transparent); }
  .dl-card b { display: block; font-size: 0.98rem; }
  .dl-card b::after { content: none; }
  .dl-card span { font-size: 0.8rem; }
  /* 平板及以上：内容容器恢复 90% 上限（移动端已改为满宽） */
  .md-grid { max-width: min(90%, 110rem); }
  /* 对比页恢复横排：A 左 B 右一行 */
  .sizecmp-bar { flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: center; }
  .sizecmp-pick { flex: 1 1 14rem; max-width: 18rem; }
  .sizecmp-select { font-size: 0.95rem; padding: 0.5rem 0.8rem; }
  .sizecmp-select.sizecmp-cat { font-size: 0.85rem; padding: 0.35rem 0.6rem; }
  .sizecmp-ratios { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; }
  .sizecmp-table { font-size: 1rem; }
  .sizecmp-table th, .sizecmp-table td { padding: 0.5rem 0.8rem; }
  .sizecmp-detail-scroll .sizecmp-table { min-width: 0; }
}

/* ============================================================
 * 桌面视觉（≥ 1024px）：恢复历史桌面样式
 * ============================================================ */
@media (min-width: 1024px) {
  .astro-hero { padding: 2.2rem 1rem 1.6rem; margin-bottom: 1.2rem; }
  .astro-hero h1 { font-size: 2em; }
  .astro-hero-sub { font-size: 1.02rem; }
  .astro-hero-links { font-size: 0.88rem; }
  .astro-toolbar { padding: 0.85rem 1rem; }
  .astro-toolbar #astro-search { padding: 0.45rem 0.8rem; font-size: 0.92rem; }
  .chip { padding: 0.32rem 0.85rem; font-size: 0.84rem; }
  .astro-count { margin: 0.3rem 0 1rem; }
  .astro-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1rem; }
  /* 桌面竖卡：图上文下 */
  .astro-card { display: block; }
  .astro-card-link { display: block; }
  .astro-img {
    display: flex;
    width: auto;
    flex: none;
    height: 150px;
    min-height: 0;
    padding: 0;
  }
  .astro-img img { height: 108px; }
  .astro-img-fallback span { width: 92px; height: 92px; font-size: 2rem; }
  .astro-card-body { padding: 0.7rem 0.95rem 0.95rem; }
  .astro-card-title { font-size: 1.05rem; }
  .astro-card-title .en { font-size: 0.78rem; }
  .astro-card-tagline { font-size: 0.8rem; margin: 0.3rem 0 0.55rem; }
  .astro-card-stats { font-size: 0.74rem; gap: 0.3rem 0.6rem; }
  .astro-card-stats span { padding: 0.12rem 0.45rem; }
  .astro-badge { top: 0.6rem; right: 0.6rem; font-size: 0.7rem; padding: 0.14rem 0.55rem; }
  .obj-hero { padding: 1.4rem; gap: 1.4rem; }
  .obj-hero .astro-img,
  .obj-hero .astro-img img { height: 360px; }
  .obj-hero-info h1 { font-size: 1.7rem; }
  .obj-tagline { font-size: 0.98rem; }
  .obj-keystats span { font-size: 0.82rem; padding: 0.28rem 0.7rem; }
  .obj-source, .obj-article { margin-top: 1.6rem; padding: 1rem 1.2rem; }
  .obj-source h2, .obj-article h2 { font-size: 1.05rem; }
  .obj-source p { font-size: 0.82rem; }
  .sizecmp-pick { flex: 0 1 auto; }
  .sizecmp-select { min-width: 12rem; max-width: 18rem; font-size: 0.95rem; }
  .sizecmp-ratio-big { font-size: 2.4rem; }
  .sizecmp-table { font-size: 1rem; }
  .sizecmp-table th, .sizecmp-table td { padding: 0.5rem 0.8rem; }
  .sizecmp-scale button { min-height: 0; padding: 0.3rem 0.95rem; font-size: 0.84rem; }
  .dl-cards { margin: 1rem 0; }
  .dl-card { padding: 1rem 1.1rem; }
  .dl-card b { font-size: 1rem; }
  .obj-fields { margin: 1.2rem 0; padding: 0.7rem 1rem; font-size: 0.85rem; }
  .obj-fields table { font-size: 0.8rem; }
  .obj-version { margin-top: 1.5rem; }
}

/* ============================================================
 * hover 效果仅限可悬停设备（触屏不粘滞）
 * ============================================================ */
@media (hover: hover) {
  .astro-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 18px color-mix(in srgb, var(--md-default-fg-color) 12%, transparent);
  }
  .chip:hover {
    border-color: var(--md-primary-fg-color);
    color: var(--md-primary-fg-color);
  }
  .dl-card:hover { transform: translateY(-2px); }
  .astro-article-list li a:hover {
    background: color-mix(in srgb, var(--md-primary-fg-color) 10%, transparent);
  }
  .sizecmp-scale button:hover {
    border-color: var(--md-primary-fg-color);
    color: var(--md-primary-fg-color);
  }
}
