/* —— 每日一练专属样式（M0 原型；定稿后并入全站 styles.css）—— */
.daily-lead { color: var(--slate); margin: 6px 0 26px; max-width: 640px; }

.q-today { background: var(--light-navy); border: 1px solid var(--lightest-navy);
  border-radius: 12px; padding: 22px 24px; margin-bottom: 34px; }
.q-today-tag { font-family: var(--mono); font-size: 13px; color: var(--green); margin-bottom: 12px; }

.q-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 8px; }
.q-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.q-chip { font-family: var(--mono); font-size: 12.5px; color: var(--light-slate);
  background: transparent; border: 1px solid var(--lightest-navy); border-radius: 999px;
  padding: 5px 13px; cursor: pointer; transition: .15s; }
.q-chip:hover { color: var(--green); border-color: var(--green); }
.q-chip.on { color: var(--navy); background: var(--green); border-color: var(--green); font-weight: 600; }
#q-search { font-family: var(--mono); font-size: 13px; background: var(--light-navy);
  border: 1px solid var(--lightest-navy); color: var(--lightest-slate); border-radius: 8px;
  padding: 7px 12px; min-width: 180px; }
#q-search::placeholder { color: var(--slate); }
.q-count { font-family: var(--mono); font-size: 12px; color: var(--slate); margin: 14px 0; }

.q-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.q-card { display: block; background: var(--light-navy); border: 1px solid var(--lightest-navy);
  border-radius: 10px; padding: 16px 18px; color: inherit; transition: .15s; }
.q-card:hover { transform: translateY(-3px); border-color: var(--green); }
.q-card-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.q-card-meta.big { margin: 6px 0 20px; }
.q-cat { font-size: 12px; font-weight: 600; color: var(--navy); background: var(--green);
  border-radius: 5px; padding: 2px 9px; }
.q-type { font-family: var(--mono); font-size: 11.5px; color: var(--light-slate);
  border: 1px solid var(--lightest-navy); border-radius: 5px; padding: 1px 8px; }
.q-lv { font-size: 12px; color: #ffcf5a; letter-spacing: 1px; }
.q-src { font-family: var(--mono); font-size: 11.5px; color: var(--slate); }
.q-card-stem { color: var(--light-slate); font-size: 14.5px; line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.q-card-foot { display: flex; justify-content: space-between; margin-top: 12px;
  font-family: var(--mono); font-size: 11.5px; color: var(--slate); }
.q-go { color: var(--green); }

/* 题面 / 图 / 选项 / 样例 / 评分 / 解析（详情页与今日一题共用） */
.q-stem { color: var(--lightest-slate); font-size: 16px; line-height: 1.8; margin: 8px 0 16px; }
.q-fig { text-align: center; margin: 16px 0; }
.q-fig-svg { max-width: 170px; height: auto; }
.q-fig-speech { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; font-size: 30px; }
.q-fig-speech span { font-size: 14px; color: var(--light-slate); display: flex;
  flex-direction: column; align-items: center; gap: 4px; }
.q-opts { list-style: none; padding: 0; margin: 0 0 8px; }
.q-opts li { color: var(--light-slate); font-size: 15px; line-height: 1.7; padding: 5px 0;
  border-bottom: 1px dashed var(--lightest-navy); }
.q-io, .q-rubric { background: var(--light-navy); border: 1px solid var(--lightest-navy);
  border-radius: 8px; padding: 12px 16px; margin: 14px 0; }
.q-io-h { font-family: var(--mono); font-size: 12px; color: var(--green); margin-bottom: 8px; }
.q-io-row { display: flex; gap: 12px; margin: 4px 0; flex-wrap: wrap; }
.q-io-row code, .q-sol-body { font-family: var(--mono); color: var(--light-slate); }
.q-io-row code { background: var(--navy); border-radius: 5px; padding: 3px 9px; font-size: 13px;
  white-space: pre-wrap; }  /* 保留样例里的换行/连续空格（如金字塔图形输出） */
.q-rubric ul { margin: 0; padding-left: 18px; color: var(--light-slate); font-size: 13.5px; line-height: 1.8; }

.q-reveal { font-family: var(--mono); font-size: 13px; color: var(--green); background: transparent;
  border: 1px solid var(--green); border-radius: 8px; padding: 9px 16px; cursor: pointer; margin: 18px 0 4px; }
.q-solution { background: var(--light-navy); border: 1px solid var(--lightest-navy);
  border-radius: 10px; padding: 16px 18px; margin-top: 12px; }
.q-ans-badge { font-weight: 700; color: var(--green); font-size: 15px; }
.q-sol-body { white-space: pre-wrap; font-size: 13.5px; line-height: 1.75; margin: 12px 0 0;
  overflow-x: auto; }

/* ═══ v2 题历热力图版 新增样式 ═══ */
/* 大数字统计条 */
.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; margin: 6px 0 30px; }
.stat-tile { background: var(--light-navy); border: 1px solid var(--lightest-navy); border-radius: 12px; padding: 18px 20px; }
.stat-big { font-family: var(--mono); font-size: 30px; font-weight: 700; color: var(--green); line-height: 1.1; }
.stat-label { color: var(--slate); font-size: 13px; margin-top: 8px; }
.q-demo { color: var(--slate); font-weight: 400; font-size: 12px; }

/* 板块小标题 */
.daily-h { font-size: 15px; color: var(--lightest-slate); font-family: var(--mono); letter-spacing: .04em;
  margin: 34px 0 14px; display: flex; align-items: baseline; gap: 10px; }
.daily-h small { color: var(--slate); font-size: 12px; font-family: var(--mono); letter-spacing: 0; }

/* 年度题历热力图 */
.hm-scroll { overflow-x: auto; padding-bottom: 6px; }
.hm-months { display: grid; gap: 3px; margin-bottom: 6px; min-width: max-content; }
.hm-mon { font-family: var(--mono); font-size: 11px; color: var(--slate); grid-row: 1; text-align: center; white-space: nowrap; }
.hm-grid { display: grid; grid-template-rows: repeat(7, 12px); grid-auto-flow: column; gap: 3px; min-width: max-content; }
.hm-cell { width: 12px; height: 12px; border-radius: 2px; background: var(--lightest-navy); }
.hm-blank { background: transparent; }
.hm-real { cursor: pointer; box-shadow: 0 0 0 1px rgba(255,255,255,.10) inset; }
.hm-real:hover { transform: scale(1.35); border-radius: 3px; }
.hm-today { outline: 2px solid var(--lightest-slate); outline-offset: 1px; }
.hm-foot { margin-top: 14px; }
.hm-legend { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: center; font-size: 12px; color: var(--light-slate); }
.hm-legend span { display: inline-flex; align-items: center; gap: 5px; line-height: 1; }
.hm-legend i { width: 11px; height: 11px; border-radius: 2px; display: inline-block; flex: none; }
.hm-note { color: var(--slate) !important; }

/* 今日一题大卡里的分类色标签用内联 background，文字压深色 */
.q-today .q-cat, .q-card .q-cat, .q-card-meta .q-cat { color: var(--navy); }

/* 相似题 / 差异题 推荐卡（详情页，留客） */
.q-rec-list { display: grid; gap: 10px; margin-bottom: 8px; }
.q-rec { display: flex; gap: 12px; align-items: flex-start; background: var(--light-navy);
  border: 1px solid var(--lightest-navy); border-radius: 10px; padding: 12px 15px; color: inherit; transition: .15s; }
.q-rec:hover { border-color: var(--green); transform: translateX(3px); }
.q-rec-dot { width: 10px; height: 10px; border-radius: 3px; margin-top: 5px; flex: none; }
.q-rec-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.q-rec-cat { font-family: var(--mono); font-size: 11.5px; color: var(--slate); }
.q-rec-stem { color: var(--light-slate); font-size: 14px; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* 单页 v3：当前题眉头 */
.q-cur-eyebrow { font-family: var(--mono); font-size: 13px; color: var(--green);
  margin-bottom: 12px; letter-spacing: .04em; }

/* 出处/已用 标签（低调但明确，像个 tag）+ 推荐卡「详情 →」可点提示 */
.q-prov { font-family: var(--mono); font-size: 11px; color: var(--slate);
  background: var(--navy); border: 1px solid var(--lightest-navy); border-radius: 5px; padding: 2px 8px; }
.q-rec-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 5px; }
.q-rec-go { font-family: var(--mono); font-size: 12px; color: var(--green); flex: none; }

/* 选择题：可点选项 + 对答案判对错 */
.q-opts { display: grid; gap: 8px; margin: 6px 0 10px; }
.q-opt { text-align: left; font-size: 15px; color: var(--light-slate); background: var(--light-navy);
  border: 1px solid var(--lightest-navy); border-radius: 8px; padding: 10px 14px; cursor: pointer;
  transition: .12s; font-family: inherit; line-height: 1.5; }
.q-opt:hover:not(:disabled) { border-color: var(--green); color: var(--lightest-slate); }
.q-opt.sel { border-color: var(--green); box-shadow: 0 0 0 1px var(--green) inset; color: var(--lightest-slate); }
.q-opt.opt-correct { border-color: var(--green); background: rgba(100,255,218,.12); color: var(--green); }
.q-opt.opt-wrong { border-color: #ff6b6b; background: rgba(255,107,107,.10); color: #ff9d9d; }
.q-opt:disabled { cursor: default; }
.q-verdict { font-size: 15.5px; font-weight: 700; margin: 0 0 12px; }
.q-verdict.ok { color: var(--green); }
.q-verdict.no { color: #ff9d9d; }
/* 难度「参考」标注 */
.q-lv-ref { font-family: var(--mono); font-size: 10.5px; color: var(--slate); margin-left: -4px; }

/* 参考难度：做成和「选择题」类型一样的小方框，框内含星级 */
.q-difftag { font-family: var(--mono); font-size: 11.5px; color: var(--slate);
  border: 1px solid var(--lightest-navy); border-radius: 5px; padding: 1px 8px; white-space: nowrap; }
.q-difftag b { color: #ffcf5a; font-weight: 400; letter-spacing: 1px; margin-left: 2px; }

/* 答案末尾的免责/难度小字提示 */
.q-ai-note { margin: 14px 0 0; font-family: var(--mono); font-size: 11.5px; line-height: 1.7;
  color: var(--slate); border-top: 1px dashed var(--lightest-navy); padding-top: 10px; }

/* 编程题「自动判卷」说明（只在编程题解析里出现） */
.q-judge-note { margin: 16px 0 0; font-family: var(--mono); font-size: 13.5px; line-height: 1.75;
  color: var(--light-slate); }

/* 解法配图（如 Scratch 积木示意图）；overflow 兜底：个别宽积木在窄屏横向滚动而不溢出 */
.q-solfig { margin: 16px 0 4px; text-align: center; overflow-x: auto; }
.q-solfig-svg { max-width: 100%; height: auto; }
.q-solfig-cap { font-family: var(--mono); font-size: 11.5px; color: var(--slate); margin-top: 6px; }
