/* ==========================================================================
   高考学习中心 · 全栈层样式（登录/资料/收藏/上传/社区/后台）
   ========================================================================== */

/* ---------- 顶栏登录按钮 ---------- */
#userBtn {
  display: inline-flex; align-items: center; gap: 6px;
  height: 30px; padding: 0 10px; border-radius: var(--r-md, 6px);
  border: 1px solid var(--c-line, #e3e1da);
  background: transparent; color: var(--c-ink-1, #2b2a26);
  font-size: 13px; cursor: pointer; font-family: inherit;
  white-space: nowrap; line-height: 1;
}
#userBtn:hover { border-color: var(--c-brand, #27476e); color: var(--c-brand, #27476e); }
#userBtn .avatar-dot {
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--c-brand, #27476e); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 600; flex: 0 0 auto;
}
#userBtn img { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }

/* ---------- 通用卡片与表单 ---------- */
.fs-wrap { max-width: 860px; margin: 0 auto; }
.fs-card {
  background: var(--c-card, #fff); border: 1px solid var(--c-line, #e3e1da);
  border-radius: 5px; padding: 20px 22px; margin-bottom: 16px;
}
.fs-card h3 { margin: 0 0 14px; font-size: 16px; }
.fs-form { display: grid; gap: 12px; }
.fs-row { display: grid; gap: 6px; }
.fs-row label { font-size: 12.5px; color: var(--c-ink-3, #5d5b54); font-weight: 600; }
.fs-row input, .fs-row select, .fs-row textarea {
  font: inherit; font-size: 14px; padding: 9px 11px;
  border: 1px solid var(--c-line, #e3e1da); border-radius: 3px;
  background: var(--c-bg, #f5f4f1); color: var(--c-ink-1, #2b2a26);
  width: 100%; box-sizing: border-box;
}
.fs-row textarea { min-height: 90px; resize: vertical; line-height: 1.6; }
.fs-row input:focus, .fs-row select:focus, .fs-row textarea:focus {
  outline: none; border-color: var(--c-brand, #27476e);
}
.fs-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.fs-hint { font-size: 12px; color: var(--c-ink-4, #8b877c); }

/* ---------- 登录弹窗 ---------- */
#fsModal {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(20, 20, 20, 0.45);
  display: none; align-items: center; justify-content: center; padding: 16px;
}
#fsModal.open { display: flex; }
#fsModal .fs-dialog {
  background: var(--c-card, #fff); border-radius: 6px;
  max-width: 400px; width: 100%; padding: 24px;
  box-shadow: 0 18px 50px rgba(0,0,0,0.25);
}
#fsModal .fs-dialog-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
#fsModal .fs-dialog-head h3 { margin: 0; font-size: 17px; }
#fsModal .fs-dialog .close-x {
  background: none; border: none; font-size: 22px;
  cursor: pointer; color: var(--c-ink-4, #8b877c); line-height: 1; padding: 0;
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: var(--r-sm, 4px); flex: 0 0 auto;
}
#fsModal .fs-dialog .close-x:hover { background: var(--c-surface-3, #f1f1ef); color: var(--c-ink-2, #37352f); }
.fs-tabrow { display: flex; gap: 0; border-bottom: 1px solid var(--c-line, #e3e1da); margin-bottom: 16px; }
.fs-tabrow button {
  flex: 1; background: none; border: none; padding: 10px 0; cursor: pointer;
  font: inherit; font-size: 14px; color: var(--c-ink-3, #5d5b54);
  border-bottom: 2px solid transparent;
}
.fs-tabrow button.active { color: var(--c-brand, #27476e); border-bottom-color: var(--c-brand, #27476e); font-weight: 600; }

/* ---------- 社区帖子 ---------- */
.fs-post {
  display: block; text-decoration: none; color: inherit;
  padding: 16px 18px; border: 1px solid var(--c-line, #e3e1da);
  border-radius: 5px; margin-bottom: 12px; background: var(--c-card, #fff);
}
.fs-post:hover { border-color: var(--c-brand, #27476e); }
.fs-post .fs-post-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.fs-post .fs-post-title { font-size: 16px; font-weight: 600; margin: 0 0 6px; }
.fs-post .fs-post-meta { font-size: 12px; color: var(--c-ink-4, #8b877c); display: flex; gap: 12px; flex-wrap: wrap; }
.fs-post .fs-post-body { font-size: 14px; line-height: 1.7; color: var(--c-ink-2, #44423c); }
.fs-badge {
  display: inline-block; font-size: 11px; padding: 1px 8px; border-radius: 3px;
  background: var(--c-brand-soft, #e8edf3); color: var(--c-brand, #27476e);
}
.fs-subject-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 14px 0; }
.fs-subject-tabs a {
  font-size: 12.5px; padding: 5px 12px; border-radius: 3px; text-decoration: none;
  border: 1px solid var(--c-line, #e3e1da); color: var(--c-ink-2, #44423c);
}
.fs-subject-tabs a.active { background: var(--c-brand, #27476e); color: #fff; border-color: var(--c-brand, #27476e); }

/* ---------- 评论 ---------- */
.fs-comment { padding: 10px 0; border-top: 1px solid var(--c-line, #e3e1da); }
.fs-comment .fs-comment-meta { font-size: 12px; color: var(--c-ink-4, #8b877c); margin-bottom: 4px; }
.fs-comment .fs-comment-body { font-size: 14px; line-height: 1.6; }
.fs-comment-form { display: flex; gap: 8px; margin-top: 14px; align-items: flex-start; }
.fs-comment-form textarea { flex: 1; min-height: 44px; }

/* ---------- 上传题目 ---------- */
.fs-upload-item { border: 1px solid var(--c-line, #e3e1da); border-radius: 5px; padding: 16px; margin-bottom: 12px; background: var(--c-card, #fff); }
.fs-upload-item .fs-q-stem { font-size: 14.5px; line-height: 1.7; margin: 8px 0; }
.fs-upload-item .fs-q-opts { margin: 8px 0; font-size: 14px; }
.fs-upload-item .fs-q-opts .opt-line { padding: 3px 0; }
.fs-upload-item .fs-q-answer { font-weight: 600; color: var(--c-brand, #27476e); }
.fs-upload-item .fs-q-explain { margin-top: 8px; font-size: 13.5px; line-height: 1.6; background: var(--c-bg, #f5f4f1); padding: 10px 12px; border-radius: 3px; }
.fs-upload-item .fs-q-source { font-size: 12px; color: var(--c-ink-4, #8b877c); margin-top: 8px; }

/* ---------- 收藏星 ---------- */
.fs-star {
  background: none; border: 1px solid var(--c-line, #e3e1da); border-radius: 3px;
  cursor: pointer; color: var(--c-ink-3, #5d5b54); font-size: 12.5px;
  padding: 4px 10px; display: inline-flex; align-items: center; gap: 5px;
}
.fs-star.on { color: var(--c-amber, #8f5209); border-color: var(--c-amber, #8f5209); background: var(--c-amber-soft, #f7ede0); }
.fs-star .star-ico { font-size: 15px; line-height: 1; }

/* ---------- 后台 ---------- */
.fs-stat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-bottom: 18px; }
.fs-stat { border: 1px solid var(--c-line, #e3e1da); border-radius: 5px; padding: 14px 16px; background: var(--c-card, #fff); }
.fs-stat .num { font-size: 24px; font-weight: 700; color: var(--c-brand, #27476e); }
.fs-stat .lbl { font-size: 12px; color: var(--c-ink-4, #8b877c); }
.fs-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.fs-table th, .fs-table td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--c-line, #e3e1da); }
.fs-table th { font-size: 12px; color: var(--c-ink-4, #8b877c); font-weight: 600; }

/* ---------- 状态徽章 ---------- */
.fs-status { font-size: 11px; padding: 1px 8px; border-radius: 3px; }
.fs-status.approved { background: #e4f3e8; color: #1d6b3a; }
.fs-status.pending { background: #fdf0d8; color: #8f5209; }
.fs-status.removed { background: #fbe6e6; color: #a03b3b; }

/* ---------- 空状态 ---------- */
.fs-empty { text-align: center; padding: 40px 20px; color: var(--c-ink-4, #8b877c); }
.fs-empty .big { font-size: 34px; margin-bottom: 8px; }

/* ---------- 题目底部收藏 ---------- */
.q-foot { display: flex; justify-content: flex-end; padding: 4px 0 0; margin-top: 10px; border-top: 1px dashed var(--c-line, #e3e1da); }

/* ---------- 门户社区工具网格 ---------- */
.fs-hub-grid .hub-tile .hub-ico { font-size: 22px; }

/* ---------- Desmos 容器 ---------- */
.desmos-wrap { border: 1px solid var(--c-line, #e3e1da); border-radius: 5px; margin: 12px 0; overflow: hidden; }
.desmos-box { width: 100%; height: 360px; }
.desmos-offline { padding: 24px; text-align: center; color: var(--c-ink-4, #8b877c); font-size: 13px; }

/* ---------- 移动端 ---------- */
@media (max-width: 640px) {
  #userBtn .usr-name { display: none; }
  .fs-stat-grid { grid-template-columns: repeat(2, 1fr); }
}