* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
               Helvetica, Arial, sans-serif;
  background: #f6f7f9;
  color: #333;
}

.header {
  background: #1e3a8a;
  color: #fff;
  padding: 24px;
  text-align: center;
}

.container {
  margin: 40px auto;
  padding: 0 16px;
}

.link-list {
  list-style: none;
  padding: 0;
}

.link-list li {
  margin-bottom: 16px;
}

.link-list a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: #fff;
  border-radius: 10px;
  text-decoration: none;
  color: #1e3a8a;
  font-weight: 500;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  transition: all 0.2s ease;
}

.link-list .icon {
  font-size: 22px;
  width: 28px;
  text-align: center;
}

.link-list a:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}

.footer {
  text-align: center;
  padding: 24px;
  font-size: 12px;
  color: #888;
}

/* 卡片网格：自适应列数，尽量铺满屏幕 */
.card-grid {
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
  display: grid;
  gap: 16px;

  /* 关键：自动填充列，单卡最小宽度 160px，最大 1fr */
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

/* 正方形卡片（通过 aspect-ratio 保持 1:1） */
.card a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;

  padding: 16px;
  background: #fff;
  border-radius: 14px;
  text-decoration: none;
  color: #1e3a8a;

  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  transition: transform 0.15s ease, box-shadow 0.15s ease;

  aspect-ratio: 1 / 1; /* 正方形 */
  min-height: 140px;   /* 兼容少数不支持 aspect-ratio 的情况 */
}

.card a:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.14);
}

.card-icon {
  font-size: 34px;
  line-height: 1;
}

.card-title {
  font-size: 16px;
  font-weight: 700;
}

.card-desc {
  font-size: 13px;
  color: #5b6b88;
}

/* 手机端优化：更舒服的卡片密度 */
@media (max-width: 480px) {
  .card-grid {
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }
  .card a {
    padding: 14px;
    border-radius: 12px;
  }
}