/* ============================================================
   青鸟乐学网 · 新增模块样式（汉字 / 成语 / 词语 / 语文 / 游戏 / 用户）
   配套文件：app.css（全站基础样式）
   ============================================================ */

/* ---------- 关联词 / 字 标签（近义/反义/形近/同义成语） ---------- */
.rel-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.rel-chip {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:34px; height:34px; padding:0 10px;
  background:#eef4ff; color:#1f5fbf; border:1px solid #cfe0ff;
  border-radius:8px; font-size:16px; text-decoration:none; transition:.15s;
}
.rel-chip:hover { background:#dbe9ff; border-color:#9cc2ff; }
.rel-chip.rel-mut { background:#f1f3f6; color:#9aa3ad; border-color:#e2e6ec; }

/* ---------- 点赞 / 收藏 工具条 ---------- */
.flbar { display:flex; align-items:center; gap:10px; margin:14px 0 4px; flex-wrap:wrap; }
.fl-btn {
  appearance:none; cursor:pointer; border:1px solid #d4dbe6; background:#fff;
  color:#3a4655; border-radius:8px; padding:8px 16px; font-size:14px; transition:.15s;
}
.fl-btn:hover { border-color:#9cc2ff; color:#1f5fbf; }
.fl-btn.on { background:#eaf3ff; border-color:#1f5fbf; color:#1f5fbf; font-weight:600; }
.fl-msg { font-size:13px; color:#2e9e5b; }

/* ---------- 搜索 / 筛选条 ---------- */
.filterbar { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:6px 0 16px; }
.filterbar input[type=search], .filterbar select {
  height:40px; padding:0 12px; border:1px solid #d4dbe6; border-radius:8px;
  font-size:14px; background:#fff; color:#2b3a4a;
}
.filterbar .btn { height:40px; }

/* ---------- 语文模块：年级学期卡片 ---------- */
.grade-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.grade-card {
  display:block; text-decoration:none; color:inherit;
  background:#fff; border:1px solid #e6ebf2; border-radius:14px; padding:18px 18px 16px;
  transition:.15s; box-shadow:0 2px 8px rgba(31,44,61,.05);
}
.grade-card:hover { border-color:#9cc2ff; transform:translateY(-2px); box-shadow:0 8px 20px rgba(31,44,61,.1); }
.grade-card .g-name { font-size:20px; font-weight:700; color:#1f2c3d; }
.grade-card .g-sub { margin-top:6px; color:#6a7686; font-size:13px; }
.grade-card .g-count { margin-top:10px; color:#1f5fbf; font-weight:600; }

/* 语文：学期分组内的汉字网格 */
.term-block { margin-bottom:26px; }
.term-title { font-size:17px; font-weight:700; color:#1f2c3d; margin:8px 0 12px; border-left:4px solid #1f5fbf; padding-left:10px; }

/* ---------- 游戏模块 ---------- */
.game-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.game-card {
  display:flex; flex-direction:column; text-decoration:none; color:inherit;
  background:#fff; border:1px solid #e6ebf2; border-radius:14px; padding:18px;
  transition:.15s; box-shadow:0 2px 8px rgba(31,44,61,.05);
}
.game-card:hover { border-color:#9cc2ff; transform:translateY(-2px); box-shadow:0 8px 20px rgba(31,44,61,.1); }
.game-card .gc-tag { align-self:flex-start; font-size:12px; color:#1f5fbf; background:#eef4ff; border-radius:6px; padding:2px 8px; margin-bottom:8px; }
.game-card .gc-name { font-size:18px; font-weight:700; color:#1f2c3d; }
.game-card .gc-desc { margin-top:8px; color:#6a7686; font-size:13px; line-height:1.6; flex:1; }

.game-stage { max-width:760px; margin:0 auto; }
.game-q { font-size:30px; text-align:center; font-weight:700; color:#1f2c3d; margin:18px 0; }
.game-py { text-align:center; color:#1f5fbf; font-size:16px; margin-bottom:14px; }
.opt-row { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin:16px 0; }
.opt-btn {
  min-width:64px; height:56px; padding:0 18px; font-size:22px; cursor:pointer;
  border:1px solid #d4dbe6; background:#fff; border-radius:12px; transition:.15s; color:#1f2c3d;
}
.opt-btn:hover { border-color:#1f5fbf; }
.opt-btn.ok { background:#e7f8ee; border-color:#2e9e5b; color:#1c7a43; }
.opt-btn.no { background:#fdeaea; border-color:#e06a6a; color:#b23b3b; }
.opt-btn:disabled { cursor:default; }
.game-meta { display:flex; justify-content:space-between; align-items:center; margin-top:14px; color:#6a7686; font-size:14px; }
.game-score { font-size:20px; font-weight:700; color:#1f5fbf; }
.game-next { display:block; margin:18px auto 0; }
.hint-box { background:#fff8e6; border:1px solid #f0dca0; color:#8a6d1a; border-radius:10px; padding:10px 14px; font-size:14px; margin-top:12px; }
.fill-input {
  width:100%; max-width:320px; margin:0 auto; display:block; height:50px; text-align:center;
  font-size:24px; border:1px solid #d4dbe6; border-radius:10px;
}
.pillnav .pn-tags a.active, .filterbar a.active { background:#1f5fbf; color:#fff; border-color:#1f5fbf; }

/* ---------- 用户中心 ---------- */
.uc-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.uc-stat { background:#fff; border:1px solid #e6ebf2; border-radius:14px; padding:18px; }
.uc-stat .n { font-size:28px; font-weight:800; color:#1f5fbf; }
.uc-stat .l { color:#6a7686; font-size:13px; margin-top:4px; }
.uc-list { list-style:none; padding:0; margin:0; }
.uc-list li { padding:10px 0; border-bottom:1px solid #eef1f5; display:flex; justify-content:space-between; gap:12px; }
.uc-list li:last-child { border-bottom:none; }
.uc-list a { color:#1f5fbf; text-decoration:none; }
.uc-list .t { color:#9aa3ad; font-size:13px; }

/* 提示浮层 .toast 统一定义在 css/app.css（此文件在其后加载，
   若重复定义 top/bottom 会与 app.css 的 bottom 叠加 → 浮层被拉伸成整屏高）。
   此处不再重复声明。 */

/* ---------- 登录 / 注册 ---------- */
.auth-wrap { max-width:440px; margin:38px auto 60px; }
.auth-card { background:#fff; border:1px solid #e6ebf2; border-radius:16px; padding:30px 28px; box-shadow:0 6px 22px rgba(31,44,61,.07); }
.auth-title { font-size:24px; font-weight:800; color:#1f2c3d; margin:0 0 6px; }
.auth-sub { color:#6a7686; font-size:14px; margin:0 0 18px; }
.auth-err { background:#fdeaea; border:1px solid #f3c2c2; color:#b23b3b; border-radius:10px; padding:10px 14px; font-size:14px; margin-bottom:14px; }
.auth-form { display:flex; flex-direction:column; gap:14px; }
.auth-form label { display:flex; flex-direction:column; gap:6px; font-size:14px; color:#3a4655; font-weight:600; }
.auth-form input { height:44px; padding:0 14px; border:1px solid #d4dbe6; border-radius:10px; font-size:15px; font-weight:400; color:#2b3a4a; background:#fff; }
.auth-form input:focus { outline:none; border-color:#1f5fbf; }
.auth-btn { height:46px; border:none; border-radius:10px; background:#1f5fbf; color:#fff; font-size:15px; font-weight:700; cursor:pointer; transition:.15s; margin-top:4px; }
.auth-btn:hover { background:#174ea0; }
.auth-foot { text-align:center; color:#6a7686; font-size:14px; margin:16px 0 0; }
.auth-foot a { color:#1f5fbf; text-decoration:none; }

/* ---------- 用户中心（user.asp 用） ---------- */
.user-wrap { max-width:820px; margin:30px auto 60px; }
.user-head { display:flex; align-items:center; gap:16px; background:#fff; border:1px solid #e6ebf2; border-radius:16px; padding:22px; margin-bottom:22px; }
.user-avatar { width:58px; height:58px; border-radius:50%; background:#1f5fbf; color:#fff; font-size:26px; font-weight:800; display:flex; align-items:center; justify-content:center; }
.user-meta h1 { margin:0; font-size:22px; color:#1f2c3d; }
.user-meta p { margin:6px 0 0; color:#6a7686; font-size:14px; }
.user-meta .user-points { color:#1f5fbf; font-weight:700; }
.user-sec { background:#fff; border:1px solid #e6ebf2; border-radius:16px; padding:20px 22px; margin-bottom:18px; }
.user-sec h2 { font-size:18px; margin:0 0 14px; color:#1f2c3d; }
.coll-row { display:flex; gap:14px; padding:10px 0; border-bottom:1px solid #f0f3f7; align-items:flex-start; }
.coll-row:last-child { border-bottom:none; }
.coll-lab { flex:0 0 48px; color:#9aa3ad; font-size:14px; padding-top:6px; }
.coll-list { display:flex; flex-wrap:wrap; gap:8px; }
.coll-item { display:inline-flex; align-items:baseline; gap:6px; background:#eef4ff; color:#1f5fbf; border:1px solid #cfe0ff; border-radius:8px; padding:6px 12px; text-decoration:none; font-size:16px; transition:.15s; }
.coll-item:hover { background:#dbe9ff; }
.coll-py { font-size:12px; color:#7a93bd; }
.user-foot { text-align:center; margin-top:8px; }
.user-foot a { color:#b23b3b; text-decoration:none; }

/* ============================================================
   通用补全：以下类此前已被页面引用，但样式表里一直没有定义，
   导致面包屑无样式、释义列表变裸 <ol>、拼音格里的字不居中。
   这里统一补齐（全站生效，不影响既有视觉）。
   ============================================================ */

/* ---------- 面包屑（.crumb，全站页面通用） ---------- */
.crumb { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13px; color:#94A0B4; margin:18px 0 16px; }
.crumb a { color:#1A5CBE; }
.crumb a:hover { text-decoration:underline; }
.crumb span { color:#5A6678; }

/* ---------- 正文段落 ---------- */
.prose { font-size:14.5px; line-height:1.95; color:#5A6678; }
.prose b { color:#1A2230; }
.prose p { margin:0 0 12px; }
.prose p:last-child { margin-bottom:0; }

/* ---------- 卡片描述行 ---------- */
.cc-desc { font-size:12.5px; color:#5A6678; margin-top:6px; line-height:1.7; }

/* ---------- 提示条 ---------- */
.notice {
  display:flex; align-items:center; gap:9px; padding:13px 17px; margin:14px 0;
  border-radius:12px; font-size:14px; font-weight:600;
  color:#8A6D1A; background:#FFF8E6; border:1px solid #F0DCA0;
}
.notice.is-ok { color:#0F7A4A; background:rgba(31,157,99,.10); border-color:rgba(31,157,99,.28); }

/* ---------- 释义列表（HY_char.BaseDetail 解析输出） ---------- */
.exp-list { list-style:none; padding:0; margin:0; counter-reset:exp; }
.exp-list > li {
  position:relative; counter-increment:exp;
  padding:0 0 14px 42px; margin-bottom:14px; border-bottom:1px dashed #EFF2F7;
}
.exp-list > li:last-child { border-bottom:none; padding-bottom:0; margin-bottom:0; }
.exp-list > li::before {
  content:counter(exp); position:absolute; left:0; top:1px;
  width:27px; height:27px; border-radius:9px; display:grid; place-items:center;
  font-size:12.5px; font-weight:700; font-variant-numeric:tabular-nums;
  color:#1A5CBE; background:#EFF5FD; border:1px solid #D7E6FA;
}
.exp-list li.muted { color:#94A0B4; font-size:14px; padding-left:0; }
.exp-list li.muted::before { display:none; }
.exp-c { font-size:15px; line-height:1.9; color:#1A2230; }
.exp-quote {
  margin-top:9px; padding:9px 13px; border-radius:0 9px 9px 0;
  border-left:3px solid #D7E6FA; background:#EFF5FD;
  font-size:13px; line-height:1.8; color:#5A6678;
}
.exp-quote cite { display:block; margin-top:4px; font-size:12px; font-style:normal; color:#94A0B4; }

/* ---------- 拼音四线三格内的主字（hanzi/detail 用 .py-main） ---------- */
.py-grid .py-main {
  position:relative; z-index:1; font-size:24px; font-weight:600; color:#1A2230; line-height:1;
  font-family:var(--font, "Segoe UI", "Microsoft YaHei", "PingFang SC", sans-serif);
}

/* ---------- 无障碍：视觉隐藏但读屏可读 ---------- */
.sr-only {
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}