/* Homepage / Reading — Chinese-only book reader, local-first and shell-safe */
html:not([lang^="zh"]) [data-language-only="zh"] { display: none !important; }

.hb-feature { --hb-feature-active-color:var(--brand); padding-top: 8px; }
html[data-period="night"] .hb-feature { --hb-feature-active-color:#7daaff; }
.hb-feature .hb-feature-link { color:inherit; text-decoration:none; }
.hb-feature-link {
  display: block; position: relative; margin-top: 16px; padding: 30px 34px;
  border: 1px solid var(--line); border-radius: 18px;
  background: color-mix(in srgb, var(--panel) 80%, transparent);
  transition: border-color .18s ease, transform .18s ease, background-color .18s ease;
}
.hb-feature-link:hover { border-color: color-mix(in srgb,var(--brand) 36%,var(--line)); transform: translateY(-2px); }
.hb-feature-link:is(:hover,:focus-visible) .hb-feature-heading { color:var(--hb-feature-active-color); }
.hb-feature-link:focus-visible { outline: 2px solid var(--brand); outline-offset: 4px; }
.hb-feature-kicker { display:block; margin-bottom: 13px; color:var(--brand); font-size:11px; font-weight:650; letter-spacing:.13em; }
.hb-feature-heading { display:block; color:var(--ink); font-family: "Songti SC","STSong","Noto Serif CJK SC",Georgia,serif; font-size:clamp(25px,3vw,35px); line-height:1.25; font-weight:600; }
.hb-feature-description { display:block; max-width:620px; margin-top:12px; color:var(--muted); font-size:14px; line-height:1.8; }
.hb-feature-bottom { display:block; margin-top:22px; color:var(--soft); font-size:12px; }

.hb-area {
  --hb-font-size: 18px;
  --hb-paper: color-mix(in srgb, var(--panel-solid) 84%, transparent);
  --hb-tint: color-mix(in srgb, var(--brand) 5%, var(--panel-solid));
  --hb-heading-font: "Songti SC","STSong","Noto Serif CJK SC","Noto Serif SC",Georgia,serif;
  padding-bottom:110px;
}
html[data-period="night"] .hb-area { --hb-paper:#19191b; --hb-tint:#212329; }
.hb-container { width:min(100%,1296px); margin-inline:auto; padding-inline:48px; }
.hb-breadcrumb {
  display:flex; align-items:center; gap:12px; padding-top:54px;
  color:var(--soft); font-size:12px; letter-spacing:.01em;
}
.hb-breadcrumb a { color:var(--muted); }
.hb-breadcrumb a:hover { color:var(--brand); }
.hb-hero { max-width:970px; padding:84px 0 62px; }
.hb-kicker { margin:0 0 24px; color:var(--brand); font-size:11px; letter-spacing:.16em; font-weight:700; }
.hb-hero h1 {
  max-width:none; margin:0; font-family:var(--hb-heading-font);
  font-size:clamp(44px,5.8vw,76px); font-weight:600; line-height:1.17; letter-spacing:-.045em;
}
.hb-deck { margin:26px 0 0; max-width:750px; color:var(--muted); font-size:clamp(16px,1.6vw,19px); line-height:1.95; }
.hb-meta { display:flex; flex-wrap:wrap; gap:8px 26px; margin-top:34px; color:var(--soft); font-size:12px; }
.hb-meta span + span::before { content:"·"; margin-right:25px; color:var(--soft); }
.hb-notice { max-width:970px; margin:0 0 46px; padding:18px 23px; border-left:2px solid var(--brand); background:var(--hb-tint); color:var(--muted); font-size:12px; line-height:1.85; }
.hb-notice a, .hb-credit a { color:var(--brand); text-decoration:underline; text-underline-offset:3px; }
.hb-progress {
  position:fixed; top:var(--header-height); left:0; width:100%; height:2px;
  z-index:25; background:transparent; pointer-events:none;
}
.hb-progress-fill { display:block; width:0; height:100%; background:var(--brand); transition:width .1s linear; }
.hb-layout {
  display:grid; grid-template-columns:minmax(210px,258px) minmax(0,800px);
  gap:clamp(48px,6vw,110px); align-items:start;
  border-top:1px solid var(--line); padding-top:38px;
}
.hb-aside { position:sticky; top:calc(var(--header-height) + 32px); min-width:0; max-height:calc(100dvh - var(--header-height) - 50px); overflow:auto; scrollbar-width:thin; }
.hb-toc-heading { display:flex; justify-content:space-between; gap:12px; align-items:baseline; margin-bottom:14px; }
.hb-toc-title { margin:0; color:var(--ink); font-size:13px; font-weight:650; }
.hb-toc-count { color:var(--soft); font-size:11px; }
.hb-toc { list-style:none; margin:0; padding:0; counter-reset:none; }
.hb-toc li { margin:0; }
.hb-toc-link { display:grid; grid-template-columns:24px 1fr; align-items:baseline; gap:10px; margin:1px 0; padding:8px 10px; border-left:2px solid transparent; border-radius:0 6px 6px 0; color:var(--muted); font-size:12px; line-height:1.65; }
.hb-toc-link .hb-toc-number { color:var(--soft); font-variant-numeric:tabular-nums; font-size:11px; }
.hb-toc-link:hover, .hb-toc-link.is-current { color:var(--ink); background:var(--hb-tint); }
.hb-toc-link.is-current { border-left-color:var(--brand); font-weight:650; }
.hb-toc-link:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
.hb-aside-credit { margin:23px 10px 8px; padding-top:16px; border-top:1px solid var(--line); color:var(--soft); font-size:11px; line-height:1.7; }
.hb-reader { min-width:0; }
.hb-reader-tools { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:48px; padding-bottom:19px; border-bottom:1px solid var(--line); }
.hb-reader-legend { color:var(--soft); font-size:12px; }
.hb-controls { display:flex; align-items:center; gap:5px; color:var(--muted); font-size:12px; }
.hb-controls button { display:inline-grid; place-items:center; width:34px; height:34px; background:transparent; border:1px solid var(--line); border-radius:8px; color:var(--ink); font-weight:500; cursor:pointer; }
.hb-controls button:hover { background:var(--hb-tint); }
.hb-controls button:disabled { opacity:.35; cursor:not-allowed; }
.hb-controls button:focus-visible,.hb-pager button:focus-visible,.hb-mobile-toc:focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
#hbTypeValue { min-width:22px; font-variant-numeric:tabular-nums; text-align:center; }
.hb-chapter { min-height:35vh; }
.hb-chapter-head span { color:var(--brand); font-size:12px; font-weight:650; letter-spacing:.06em; }
.hb-chapter-head h2 {
  margin:18px 0 0; color:var(--ink); font-family:var(--hb-heading-font);
  font-size:clamp(34px,3.8vw,47px); line-height:1.3; font-weight:600; letter-spacing:-.035em;
}
.hb-intro {
  padding:28px 0 50px; color:var(--muted); font-size:var(--hb-font-size);
  font-family:var(--hb-heading-font); line-height:2.04; letter-spacing:.005em;
}
.hb-intro p { margin:0 0 1.2em; }
.hb-intro h3 { margin:1.8em 0 .75em; color:var(--ink); font-size:1.12em; }
.hb-intro strong { color:var(--ink); }
.hb-intro a, .hb-entry a { color:var(--brand); text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }
.hb-intro ul { padding-left:1.6em; }
.hb-intro blockquote { margin:1.4em 0; padding:0 0 0 1.2em; border-left:2px solid var(--line); }
.hb-entry { scroll-margin-top:88px; border-top:1px solid var(--line); padding:38px 0 42px; }
.hb-entry-top { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:14px; }
.hb-entry-number { font-size:12px; color:var(--soft); font-variant-numeric:tabular-nums; letter-spacing:.08em; }
.hb-entry h3 { margin:0 0 23px; color:var(--ink); font-family:var(--hb-heading-font); font-size:calc(var(--hb-font-size) * 1.43); font-weight:600; line-height:1.58; letter-spacing:-.015em; }
.hb-grade { display:inline-block; padding:4px 8px; border-radius:5px; border:1px solid var(--line); font-size:10px; letter-spacing:.025em; color:var(--muted); white-space:nowrap; }
.hb-grade-A { color:var(--brand); border-color:color-mix(in srgb,var(--brand) 23%,var(--line)); }
.hb-plain { margin:0 0 26px; padding:22px 25px; border-left:2px solid var(--brand); background:var(--hb-tint); }
.hb-plain-label { color:var(--brand); font-size:11px; font-weight:700; letter-spacing:.08em; }
.hb-plain p { margin:9px 0 0; color:var(--ink); font-family:var(--hb-heading-font); font-size:var(--hb-font-size); line-height:2; }
.hb-facts { margin:0; padding:0; }
.hb-fact { display:grid; grid-template-columns:58px minmax(0,1fr); gap:18px; padding:12px 0; }
.hb-fact dt { color:var(--soft); font-size:12px; line-height:1.8; font-weight:650; }
.hb-fact dd { margin:0; color:var(--muted); font-size:calc(var(--hb-font-size) * .82); line-height:1.9; overflow-wrap:anywhere; }
.hb-fact dd strong { color:var(--ink); }
.hb-fact:last-child dd { font-size:calc(var(--hb-font-size) * .75); }
.hb-loose { color:var(--muted); font-size:13px; line-height:1.8; }
.hb-status { padding:36px 22px; background:var(--hb-tint); border:1px solid var(--line); border-radius:8px; color:var(--muted); font-size:14px; }
.hb-status button { margin-left:10px; color:var(--brand); background:none; font:inherit; text-decoration:underline; cursor:pointer; }
.hb-pager { display:flex; justify-content:space-between; gap:16px; margin:42px 0 30px; padding:28px 0; border-top:1px solid var(--line); }
.hb-pager button { min-width:140px; min-height:44px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:var(--hb-paper); cursor:pointer; font-size:13px; }
.hb-pager button:hover { border-color:var(--brand); }
.hb-pager button:disabled { visibility:hidden; }
.hb-credit { max-width:800px; margin:40px 0 0; padding-top:26px; border-top:1px solid var(--line); color:var(--soft); font-size:12px; line-height:1.9; }
.hb-credit p { margin:0 0 10px; }
.hb-mobile-toc { display:none; }

@media (max-width:1080px) {
 .hb-container { padding-inline:28px; }
 .hb-layout { grid-template-columns:minmax(185px,230px) minmax(0,1fr); gap:42px; }
 .hb-hero { padding:66px 0 52px; }
}
@media (max-width:800px) {
 .hb-container { padding-inline:22px; }
 .hb-breadcrumb { padding-top:26px; }
 .hb-hero { padding:44px 0 40px; }
 .hb-layout { display:block; padding-top:26px; }
 .hb-mobile-toc { display:inline-flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:45px; margin-bottom:20px; padding:11px 14px; color:var(--ink); background:var(--hb-paper); border:1px solid var(--line); border-radius:10px; font-size:13px; cursor:pointer; }
 .hb-aside { display:none; position:static; max-height:47vh; overflow:auto; margin-bottom:22px; padding:12px 14px; border:1px solid var(--line); border-radius:9px; background:var(--hb-paper); }
 .hb-aside.is-open { display:block; }
 .hb-toc-link { font-size:13px; min-height:39px; }
 .hb-reader-tools { margin-bottom:36px; }
 .hb-entry { padding:32px 0 34px; }
}
@media (max-width:540px) {
 .hb-container { padding-inline:18px; }
 .hb-hero h1 { font-size:clamp(40px,10vw,52px); }
 .hb-deck { margin-top:18px; font-size:16px; }
 .hb-meta { gap:7px 13px; margin-top:22px; }
 .hb-meta span + span::before { margin-right:12px; }
 .hb-notice { margin-bottom:24px; padding:16px 17px; }
 .hb-reader-tools { margin-bottom:30px; }
 .hb-intro { padding-bottom:34px; }
 .hb-chapter-head h2 { font-size:clamp(30px,8vw,40px); }
 .hb-plain { padding:17px 18px; }
 .hb-entry h3 { font-size:calc(var(--hb-font-size) * 1.25); }
 .hb-fact { grid-template-columns:45px minmax(0,1fr); gap:10px; }
 .hb-pager button { min-width:0; flex:1; }
 .hb-feature-link { padding:22px 21px; }
}
@media (prefers-reduced-motion:reduce) {
 .hb-feature-link,.hb-progress-fill { transition:none; }
}
@media print {
 .site-header,.site-footer,.local-nav,.hb-breadcrumb,.hb-notice,.hb-aside,.hb-mobile-toc,.hb-reader-tools,.hb-pager,.hb-progress { display:none !important; }
 body { background:#fff !important; color:#000 !important; }
 .hb-container { width:100%; max-width:none; padding:0; }
 .hb-hero { padding:0 0 30px; }
 .hb-layout { border:none; padding:0; }
 .hb-entry { break-inside:avoid; }
 .hb-area { --ink:#111; --muted:#444; --soft:#555; --hb-tint:#fafafa; --hb-paper:#fff; }
 .hb-credit { color:#444; }
}
