/* 每日热点（日 / 周）。变量来自 kaodian.css 的 .kd-root */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hs-wrap { display: grid; grid-template-columns: 232px minmax(0, 800px); gap: 48px; justify-content: center;
  max-width: 1320px; margin: 0 auto; padding: 28px 28px 64px; }

/* ---------- 左栏 ---------- */
.hs-rail { position: sticky; top: calc(var(--kd-sticky, 116px) + 22px); align-self: start;
  max-height: calc(100vh - var(--kd-sticky, 116px) - 34px); overflow-y: auto; padding-right: 4px; scrollbar-width: thin; }
.hs-rail__label { display: flex; justify-content: space-between; margin: 22px 0 8px; font-size: 12px; font-weight: 400;
  color: var(--kd-ink3); letter-spacing: 1px; }
.hs-rail__label span { letter-spacing: 0; }
.hs-days a { display: flex; align-items: center; justify-content: space-between; padding: 7px 10px; border-radius: 6px;
  font-size: 14px; color: var(--kd-ink2); }
.hs-days a:hover { background: rgba(255, 255, 255, .6); }
.hs-days a span { font-size: 12px; color: var(--kd-ink3); }
.hs-days a.is-on { background: #fff; color: var(--kd-red); font-weight: 700; box-shadow: inset 3px 0 0 var(--kd-red); }
.hs-pick summary { display: flex; align-items: center; gap: 6px; padding: 7px 10px; font-size: 13px; color: var(--kd-ink3);
  cursor: pointer; list-style: none; }
.hs-pick summary::-webkit-details-marker { display: none; }
.hs-pick form { display: flex; gap: 6px; padding: 4px 10px 8px; }
.hs-pick input { flex: 1; min-width: 0; height: 34px; padding: 0 8px; border: 1px solid var(--kd-line); border-radius: 8px;
  background: #fff; color: var(--kd-ink2); font: 13px var(--kd-sans); }
.hs-outline a { display: flex; gap: 8px; padding: 5px 10px; border-radius: 6px; font-size: 13px; line-height: 1.5; color: var(--kd-ink2); }
.hs-outline a:hover { background: rgba(255, 255, 255, .6); }
.hs-outline a b { flex: none; width: 16px; font: 600 12px/1.6 Georgia, serif; color: var(--kd-ink3); }
.hs-outline a span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hs-outline a.is-done { color: var(--kd-ink3); }
.hs-outline a.is-done b { color: var(--kd-ok); }
.hs-outline a.is-current { color: var(--kd-ink); font-weight: 700; }
.hs-outline__sec { padding: 8px 10px 2px; font-size: 12px; font-weight: 700; color: var(--kd-red); }
.hs-cross { display: block; margin-top: 22px; padding: 14px; border: 1px solid var(--kd-line); border-radius: 10px; background: #fff; font-size: 12px; }
.hs-cross:hover { border-color: #e2c6c2; }
.hs-cross b { display: block; margin-bottom: 2px; font: 700 14px var(--kd-serif); }
.hs-cross span { display: block; margin-bottom: 6px; color: var(--kd-ink3); }
.hs-cross em { font-style: normal; font-weight: 700; color: var(--kd-red); font-size: 13px; }

/* ---------- 页头 ---------- */
.hs-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--kd-line); }
.hs-head h1 { margin: 0; font: 700 30px/1.25 var(--kd-serif); letter-spacing: 1px; color: var(--kd-ink); }
.hs-head h1 small { margin-left: 10px; font-size: 16px; font-weight: 400; letter-spacing: 0; color: var(--kd-ink3); }
.hs-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 8px; font-size: 13px; color: var(--kd-ink3); }
.hs-meta b { font-weight: 400; color: var(--kd-ink2); }
.hs-tools { display: flex; align-items: center; gap: 10px; flex: none; }
.hs-note { margin: 12px 0 0; font-size: 12px; color: var(--kd-gold); }
.hs-progress { display: flex; align-items: center; gap: 12px; margin: 14px 0 4px; font-size: 12px; color: var(--kd-ink3); }
.hs-progress > span:first-child { white-space: nowrap; }
.hs-progress__tip { white-space: nowrap; }

/* ---------- 条目 ---------- */
.hs-group { position: sticky; top: var(--kd-sticky, 116px); z-index: 5; display: flex; align-items: center; gap: 10px; margin: 0;
  padding: 18px 0 10px; background: var(--kd-bg); font: 700 16px var(--kd-serif); color: var(--kd-red); letter-spacing: 2px; }
.hs-group::before { content: ""; width: 4px; height: 16px; border-radius: 1px; background: var(--kd-red); }
.hs-group span { font: 12px var(--kd-sans); color: var(--kd-ink3); letter-spacing: 0; }
.hs-card { margin-bottom: 14px; padding: 22px 24px 16px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius);
  background: var(--kd-card); scroll-margin-top: calc(var(--kd-sticky, 116px) + 52px); }
.hs-card.is-done { border-color: #d3e3d7; }
.hs-card:target { box-shadow: 0 0 0 2px #ecc9c4; }
.hs-card__top { display: flex; align-items: flex-start; gap: 14px; }
.hs-card__no { flex: none; width: 26px; font: 600 15px/28px Georgia, serif; color: var(--kd-red); }
.hs-card__title { flex: 1; min-width: 0; margin: 0; font: 700 19px/1.5 var(--kd-serif); color: var(--kd-ink); }
.hs-card__top .learning-save { flex: none; margin-top: 1px; }
.hs-card__src { margin: 4px 0 0 40px; font-size: 12px; color: var(--kd-ink3); }
.hs-card__body { margin: 14px 0 0 40px; }
.hs-row { display: grid; grid-template-columns: 44px 1fr; gap: 10px; margin-top: 6px; font-size: 15px; line-height: 1.85; }
.hs-row__l { padding-top: 3px; font-size: 12px; font-weight: 700; letter-spacing: 1px; color: var(--kd-gold); }
.hs-row.is-q .hs-row__l { color: var(--kd-red); }
.hs-row.is-q > span:last-child { font-weight: 700; }
.hs-ans { position: relative; margin-top: 10px; padding: 12px 14px 12px 16px; border: 1px solid var(--kd-gold-line);
  border-radius: 10px; background: var(--kd-gold-bg); }
.hs-ans__h { display: flex; justify-content: space-between; align-items: center; font-size: 12px; font-weight: 700; letter-spacing: 1px; color: var(--kd-gold); }
.hs-ans__h button { display: flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 400; letter-spacing: 0; color: var(--kd-gold); }
.hs-ans__h button:hover { color: var(--kd-ink); }
.hs-ans ol { margin: 6px 0 0; padding: 0; list-style: none; counter-reset: kd-a; }
.hs-ans li { display: flex; gap: 8px; padding: 3px 0; font-size: 15px; line-height: 1.8; counter-increment: kd-a; }
.hs-ans li::before { content: counter(kd-a); flex: none; width: 20px; height: 20px; margin-top: 4px; border: 1px solid var(--kd-gold-line);
  border-radius: 50%; background: #fff; color: var(--kd-gold); font: 600 11px/18px Georgia, serif; text-align: center; }
.hs-ans__reveal { display: none; }
.is-quiz .hs-ans:not(.is-revealed) ol { filter: blur(6px); opacity: .7; user-select: none; pointer-events: none; }
.is-quiz .hs-ans:not(.is-revealed) .hs-ans__h button { visibility: hidden; }
.is-quiz .hs-ans:not(.is-revealed) .hs-ans__reveal { position: absolute; inset: 34px 0 0; display: flex; align-items: center; justify-content: center; }
.hs-ans__reveal span { padding: 6px 16px; border: 1px solid var(--kd-gold-line); border-radius: 20px; background: #fff;
  color: var(--kd-gold); font-size: 13px; white-space: nowrap; box-shadow: 0 2px 8px rgba(143, 106, 40, .12); }
.hs-know { display: flex; gap: 8px; margin-top: 10px; font-size: 13px; line-height: 1.7; color: var(--kd-ink3); }
.hs-know .kd-tag { flex: none; margin-top: 1px; }
.hs-card__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 14px 0 0 40px; padding-top: 12px;
  border-top: 1px dashed var(--kd-line); font-size: 12px; color: var(--kd-ink3); }
.hs-master { display: flex; align-items: center; gap: 6px; min-height: 28px; color: var(--kd-ink2); font-size: 13px; }
.hs-master:hover { color: var(--kd-ok); }
.hs-master[aria-pressed="true"] { color: var(--kd-ok); font-weight: 700; }
.hs-foot { margin-top: 28px; text-align: center; font-size: 12px; line-height: 1.9; color: var(--kd-ink3); }
.hs-empty { margin-top: 28px; padding: 48px 16px; border: 1px dashed var(--kd-line); border-radius: var(--kd-radius);
  background: var(--kd-card); text-align: center; line-height: 2; color: var(--kd-ink3); }
.hs-empty a { color: var(--kd-red); font-weight: 700; }

/* ---------- 周视图 ---------- */
.wk-day { display: grid; grid-template-columns: 92px 1fr; margin-top: 14px; overflow: hidden; border: 1px solid var(--kd-line);
  border-radius: var(--kd-radius); background: var(--kd-card); }
.wk-day[hidden] { display: none; }
.wk-date { padding: 18px 0; border-right: 1px solid var(--kd-line2); background: #fbf8f1; text-align: center; }
.wk-date b { display: block; font: 700 30px/1 Georgia, var(--kd-serif); color: var(--kd-ink); }
.wk-date span { display: block; margin-top: 6px; font-size: 12px; color: var(--kd-ink3); }
.wk-list { padding: 6px 20px; min-width: 0; }
.wk-it { display: grid; grid-template-columns: 36px 1fr auto; gap: 10px; align-items: start; padding: 10px 0; border-bottom: 1px solid var(--kd-line2); }
.wk-it[hidden] { display: none; }
.wk-it:last-of-type { border-bottom: 0; }
.wk-it .kd-tag { margin-top: 3px; }
.wk-it b { display: block; font: 600 15px/1.5 var(--kd-serif); color: var(--kd-ink); }
.wk-it p { margin: 2px 0 0; font-size: 13px; line-height: 1.6; color: var(--kd-ink3); }
.wk-go { padding-top: 3px; font-size: 12px; color: var(--kd-ink3); white-space: nowrap; }
.wk-go:hover { color: var(--kd-red); }
.wk-more { padding: 8px 0 10px; font-size: 13px; color: var(--kd-red); }
.wk-more[hidden] { display: none; }

/* ---------- 窄屏 ---------- */
@media (max-width: 1080px) {
  .hs-wrap { grid-template-columns: 200px minmax(0, 1fr); gap: 28px; padding: 22px 20px 56px; }
}
@media (max-width: 760px) {
  .hs-wrap { grid-template-columns: minmax(0, 1fr); gap: 0; padding: 14px 16px 48px; }
  .hs-rail { position: static; max-height: none; overflow: visible; padding: 0; }
  .hs-rail__label, .hs-outline, .hs-cross { display: none; }
  .hs-modes { margin-bottom: 10px; }
  .hs-days { display: flex; gap: 8px; margin: 0 -16px 8px; padding: 2px 16px 10px; overflow-x: auto; scrollbar-width: none; }
  .hs-days a { flex: none; flex-direction: column; align-items: center; padding: 6px 12px; border: 1px solid var(--kd-line);
    border-radius: 10px; background: #fff; font-size: 13px; line-height: 1.4; }
  .hs-days a.is-on { border-color: var(--kd-red); background: var(--kd-red-bg); box-shadow: none; }
  .hs-days a span { font-size: 11px; }
  .hs-pick { flex: none; align-self: center; }
  /* 日期条是横向滚动容器，会裁掉绝对定位的弹层，所以选择器改成贴底浮层 */
  .hs-pick form { position: fixed; left: 16px; right: 16px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 60; padding: 12px;
    border: 1px solid var(--kd-line); border-radius: 12px; background: #fff; box-shadow: 0 8px 30px rgba(0, 0, 0, .18); }
  .hs-head { flex-direction: column; align-items: stretch; gap: 12px; padding-bottom: 12px; }
  .hs-head h1 { font-size: 23px; }
  .hs-head h1 small { font-size: 14px; }
  .hs-meta { font-size: 12px; }
  .hs-copyall { display: none !important; }
  .hs-progress__tip { display: none; }
  .hs-group { padding: 14px 0 8px; }
  .hs-card { padding: 16px 16px 12px; }
  .hs-card__top { gap: 8px; }
  .hs-card__no { width: 22px; font-size: 14px; }
  .hs-card__title { font-size: 17px; }
  .hs-card__src, .hs-card__body, .hs-card__foot { margin-left: 0; }
  .hs-card__foot > span { display: none; }
  .hs-card__top .learning-save span { display: none; }
  .hs-row { grid-template-columns: 38px 1fr; font-size: 14.5px; }
  .hs-ans li { font-size: 14.5px; }
  .wk-day { grid-template-columns: 60px 1fr; }
  .wk-date b { font-size: 22px; }
  .wk-list { padding: 4px 12px; }
  .wk-it { grid-template-columns: 1fr; gap: 2px; }
  .wk-it .kd-tag { display: none; }
  .wk-go { padding: 0; }
}