:root {
--htz-ink: #1a2332;
--htz-paper: #eef1f4;
--htz-panel: #ffffff;
--htz-accent: #0b7a8a;
--htz-accent-hover: #096574;
--htz-rule: #d3dbe3;
--htz-muted: #5c6b7a;
--htz-code-bg: #e8eef2;
--htz-code-block: #1e2936;
--htz-radius: 4px;
--htz-font: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
--htz-mono: "JetBrains Mono", Consolas, "Courier New", monospace;
} @media screen and (min-width: 992px) {
body {
background: var(--htz-paper) !important;
color: var(--htz-ink) !important;
font-family: var(--htz-font) !important;
}
a:link, a:visited { color: var(--htz-accent) !important; }
a:hover { color: var(--htz-accent-hover) !important; }
#head { background: var(--htz-panel) !important; border-bottom: 1px solid var(--htz-rule); }
.webtitle { padding: 1.25rem 0 0.5rem; }
.blogname { margin: 0.5rem 0 0 0 !important; float: left; }
.blogname h1 a:link,
.blogname h1 a:visited {
color: var(--htz-ink) !important;
font-size: 1.85rem !important;
font-weight: 700 !important;
letter-spacing: 0.02em;
text-decoration: none !important;
}
.blogname h1 a:hover { color: var(--htz-accent) !important; }
.blogtitle {
color: var(--htz-muted) !important;
font-size: 0.875rem !important;
margin-bottom: 1rem !important;
padding-top: 0.35rem !important;
}
#rss { margin: 0.85rem 0 0 0 !important; }
#rss .rssicon { opacity: 0.75; }
#rss .rssicon:hover { opacity: 1; }
.mainmenus {
border-top: none !important;
border-bottom: 1px solid var(--htz-rule) !important;
background: var(--htz-panel);
}
.topnav {
border-left: none !important;
height: 2.75rem !important;
}
.topnav li {
border-right: none !important;
height: 2.75rem !important;
line-height: 2.75rem !important;
font-weight: 500 !important;
font-size: 0.95rem !important;
}
.topnav a:link, .topnav a:visited {
color: var(--htz-ink) !important;
padding: 0 1.15rem !important;
}
.topnav a:hover,
.topnav li.current-menu-item > a,
.topnav li.current-menu-ancestor > a,
.topnav li.current_page_item > a,
.topnav li.current-cat > a {
color: var(--htz-accent) !important;
background: transparent !important;
box-shadow: inset 0 -2px 0 var(--htz-accent);
text-decoration: none !important;
}
.topnav li li {
background: var(--htz-panel) !important;
border: 1px solid var(--htz-rule) !important;
border-top: none !important;
}
.topnav li li a {
border: none !important;
color: var(--htz-ink) !important;
padding-left: 1rem !important;
}
.topnav li li a:hover {
background: var(--htz-paper) !important;
color: var(--htz-accent) !important;
}
.search_site {
border-color: var(--htz-rule) !important;
background: var(--htz-panel) !important;
}
#content #map {
border: 1px solid var(--htz-rule) !important;
background: var(--htz-panel) !important;
border-radius: var(--htz-radius);
}
.main .type-post,
.main ul.type-post,
.main > ul.post,
.main > ul.hentry {
list-style: none;
}
.main > ul.hentry,
.main > ul.post,
.main > ul.type-post {
background: var(--htz-panel);
border: 1px solid var(--htz-rule);
border-radius: var(--htz-radius);
margin: 0 0 0.85rem 0 !important;
padding: 0 !important;
overflow: hidden;
}
.main > ul.hentry > li,
.main > ul.post > li,
.main > ul.type-post > li {
border: none !important;
padding: 0 !important;
}
.main .htz-card {
padding: 1.15rem 1.35rem 1rem !important;
position: relative;
}
.main .htz-card .entry-title {
font-size: 1.2rem !important;
line-height: 1.45 !important;
margin: 0.35rem 0 0.65rem !important;
font-weight: 600 !important;
}
.main .htz-card .entry-title a:link,
.main .htz-card .entry-title a:visited {
color: var(--htz-ink) !important;
text-decoration: none !important;
}
.main .htz-card .entry-title a:hover {
color: var(--htz-accent) !important;
}
.main .htz-card .entry-summary {
max-height: none !important;
min-height: 0 !important;
color: var(--htz-muted);
font-size: 0.95rem;
line-height: 1.65;
}
.main .htz-card .entry-summary p {
margin: 0 !important;
color: inherit;
text-indent: 0 !important;
}
.htz-card__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.45rem 0.65rem;
margin-bottom: 0.15rem;
font-size: 0.78rem;
color: var(--htz-muted);
font-family: var(--htz-mono);
}
.htz-card__meta .htz-pills {
display: inline-flex;
flex-wrap: wrap;
gap: 0.35rem;
}
.htz-pill {
display: inline-block;
padding: 0.12rem 0.5rem;
border-radius: 999px;
background: rgba(11, 122, 138, 0.1);
color: var(--htz-accent) !important;
text-decoration: none !important;
font-family: var(--htz-font);
font-size: 0.75rem;
font-weight: 500;
line-height: 1.4;
}
.htz-pill:hover {
background: rgba(11, 122, 138, 0.18);
color: var(--htz-accent-hover) !important;
}
.htz-card__more {
display: inline-block;
margin-top: 0.75rem;
font-size: 0.85rem;
font-weight: 500;
color: var(--htz-accent) !important;
text-decoration: none !important;
}
.htz-card__more:hover { text-decoration: underline !important; }
.main .htz-card .more,
.main .htz-card .read-more-icon { display: none !important; }
.main .htz-card .info { display: none !important; }
.main .htz-card .new { margin-left: 0.4rem; } .main ul.sticky {
border-color: var(--htz-accent) !important;
border-left-width: 3px !important;
} #sidebar .widget,
#sidebar .widgets .widget {
background: var(--htz-panel);
border: 1px solid var(--htz-rule);
border-radius: var(--htz-radius);
padding: 0.85rem 1rem 1rem;
margin-bottom: 0.85rem;
box-sizing: border-box;
}
#sidebar h3 {
color: var(--htz-ink) !important;
font-weight: 600 !important;
border-bottom: 1px solid var(--htz-rule);
padding-bottom: 0.4rem;
margin-bottom: 0.65rem !important;
}
#tab-title {
background: var(--htz-panel);
border: 1px solid var(--htz-rule);
border-radius: var(--htz-radius);
padding: 0.5rem 0.75rem 0.75rem;
margin-bottom: 0.85rem;
} .article.article_c {
background: var(--htz-panel);
border: 1px solid var(--htz-rule);
border-radius: var(--htz-radius);
margin-top: 0.85rem;
}
.article .entry-title {
color: var(--htz-ink) !important;
font-weight: 700 !important;
font-size: 1.55rem !important;
line-height: 1.4 !important;
}
.article_info {
border-bottom: 1px solid var(--htz-rule) !important;
color: var(--htz-muted) !important;
height: auto !important;
min-height: 1.75rem;
padding: 0.35rem 0.9rem 0.65rem !important;
}
.article .entry-content {
font-size: 15px !important;
line-height: 1.7 !important;
color: var(--htz-ink);
max-width: none;
width: 100%;
box-sizing: border-box;
}
.main .entry-content {
font-size: 15px !important;
line-height: 1.7 !important;
}
.article .entry-content p { text-indent: 0 !important; }
.main .entry-content p code,
.article .entry-content p code {
font-family: var(--htz-mono) !important;
background: var(--htz-code-bg) !important;
color: #0a4f5c !important;
border-radius: 3px;
}
.main .entry-content .titlebar {
background: linear-gradient(to right, rgba(11,122,138,0.08), rgba(11,122,138,0.02)) !important;
border-left-color: var(--htz-accent) !important;
} .htz-toc {
background: var(--htz-panel) !important;
border-color: var(--htz-rule) !important;
}
.htz-toc__header {
color: var(--htz-ink) !important;
border-bottom-color: var(--htz-rule) !important;
}
.htz-toc__link { color: var(--htz-ink) !important; }
.htz-toc__item--h3 .htz-toc__link { color: var(--htz-muted) !important; }
.htz-toc__link:hover,
.htz-toc__link.is-active {
color: var(--htz-accent) !important;
background: rgba(11, 122, 138, 0.1) !important;
}
.htz-toc__toggle { border-top-color: var(--htz-rule) !important; color: var(--htz-muted) !important; }
#footer { color: var(--htz-muted); }
.pagination .current,
.pagination a:hover {
background: var(--htz-accent) !important;
border-color: var(--htz-accent) !important;
}
} @media screen and (max-width: 991px) {
body { font-family: var(--htz-font) !important; }
.topnav { background: var(--htz-accent) !important; }
.htz-card__meta { padding: 0 0.75rem; }
.htz-pill {
display: inline-block;
padding: 0.1rem 0.45rem;
border-radius: 999px;
background: rgba(11, 122, 138, 0.12);
color: var(--htz-accent) !important;
font-size: 0.72rem;
text-decoration: none !important;
}
.htz-card__more {
display: inline-block;
margin: 0.5rem 0.75rem 0.75rem;
color: var(--htz-accent) !important;
font-size: 0.85rem;
}
.main .htz-card .more,
.main .htz-card .info { display: none !important; }
} .dark {
--htz-ink: #e2e8f0;
--htz-paper: #121820;
--htz-panel: #1a222d;
--htz-accent: #3db8c7;
--htz-accent-hover: #5ec9d6;
--htz-rule: #2c3644;
--htz-muted: #9aa8b6;
--htz-code-bg: #243040;
}
.dark body { background: var(--htz-paper) !important; color: var(--htz-ink) !important; }
.dark #head,
.dark .mainmenus { background: var(--htz-panel) !important; border-color: var(--htz-rule) !important; }
.dark .blogname h1 a:link,
.dark .blogname h1 a:visited { color: var(--htz-ink) !important; }
.dark .topnav a:link,
.dark .topnav a:visited { color: var(--htz-ink) !important; }
.dark .main > ul.hentry,
.dark .main > ul.post,
.dark .article.article_c,
.dark #sidebar .widget,
.dark #tab-title {
background: var(--htz-panel) !important;
border-color: var(--htz-rule) !important;
}
.dark .htz-toc { background: var(--htz-panel) !important; border-color: var(--htz-rule) !important; }
.dark .htz-toc__link.is-active {
color: var(--htz-accent) !important;
background: rgba(61, 184, 199, 0.12) !important;
}
@media (prefers-reduced-motion: reduce) {
* { scroll-behavior: auto !important; }
}
@media screen and (min-width: 992px) {
.htz-article-meta {
display: flex !important;
flex-wrap: wrap;
align-items: center !important;
gap: 0.4rem 0.75rem;
background-image: none !important;
padding: 0.5rem 0.9rem 0.75rem !important;
line-height: 1.4 !important;
overflow: visible !important;
height: auto !important;
}
.htz-article-meta .htz-pills {
display: inline-flex !important;
align-items: center;
gap: 0.35rem;
line-height: 1;
}
.htz-article-meta .htz-pill {
display: inline-flex !important;
align-items: center;
justify-content: center;
height: 1.5rem;
padding: 0 0.55rem;
line-height: 1;
box-sizing: border-box;
vertical-align: middle;
}
.htz-article-meta .author,
.htz-article-meta .updated,
.htz-article-meta .views,
.htz-article-meta .comments {
display: inline-flex !important;
align-items: center;
background: none !important;
padding: 0 !important;
margin: 0 !important;
height: 1.5rem;
line-height: 1.5rem !important;
font-family: var(--htz-mono);
font-size: 0.78rem;
vertical-align: middle;
}
.htz-article-meta .category { display: none !important; }
}