.home_barAndPosts:has(#home_top_blur) { animation: auto ease 0s 1 normal none running none; }
.home_barAndPosts:has(#home_top_blur) #recent-posts, .home_barAndPosts:has(#home_top_blur) #recent-posts .recent-post-item { animation: 0.6s ease 0.6s 1 normal backwards running slide-in; }
#aside-content .aside-list > .aside-list-item .content > .comment, #aside-content .aside-list > .aside-list-item .content > .name, #aside-content .aside-list > .aside-list-item .content > .title, #error-wrap .error-content .error-info .error_subtitle, #post-info .post-title, #recent-posts > .recent-post-item > .recent-post-info > .article-title, #recent-posts > .recent-post-item > .recent-post-info > .content, .article-sort-item-title, .relatedPosts > .relatedPosts-list .content .title, figure.gallery-group .gallery-group-name, figure.gallery-group p { display: -webkit-box; -webkit-box-orient: vertical; }
#sidebar #sidebar-menus .site-data .data-item .data-item-link .headline { color: var(--heo-secondtext); font-size: 12px; line-height: 1; }
.layout > div:first-child:not(.recent-posts):not(.home_barAndPosts):not(.home-category-bar):not(.home-layout-row) { box-shadow: var(--heo-shadow-border); padding: 1rem 2rem; border-radius: 12px; background: var(--heo-card-bg); border: var(--style-border); width: calc(100% - 300px); align-self: flex-start; animation: 0.6s ease 0.1s 1 normal backwards running slide-in; position: relative; display: flex; flex-direction: column; gap: 0.5rem; }
.homePage .home-layout-row > .home_barAndPosts, .page .layout.layout--category > .home-layout-row > #category, .page .layout.layout--category > .home-layout-row > #page, .page .layout.layout--category > .home-layout-row > #tag { flex: 1 1 0%; min-width: 0px; width: auto; }
.post-bg #post-cover { width: 100%; height: 100%; object-fit: cover; min-width: 50vw; min-height: 20rem; opacity: 0.8; transition: all; }
.full_page #post-cover { display: none; }
#post-copyright-url a { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
#pagination .next-post .label, #pagination .prev-post .label, #post #pagination .prev-post .label { color: var(--heo-fontcolor); text-transform: none; }
#pagination .next_info, #post #pagination .prev_info { color: var(--heo-fontcolor); font-weight: 700; -webkit-line-clamp: 2; white-space: normal; line-height: 1.3; font-size: 0.9rem; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 10px; }
#post #pagination { overflow: hidden; position: inherit; }
#post #pagination:not(.pagination-post) { border: var(--style-border-always); }
#post #pagination.pagination-post { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; box-shadow: none; }
#postChat_iframeContainer { z-index: 1000; border: var(--style-border-always); background: var(--heo-card-bg); animation: 0.2s ease-out 0s 1 normal forwards running to_show_fromLeftBottom; transform-origin: left bottom; border-radius: 12px; }
#postChatNav-button { display: none; }
#postChatNav-button a.is-chat-loading svg { display: none !important; }
#postChatNav-button a.is-chat-loading::after { content: ""; display: block; width: 20px; height: 20px; border-width: 2px; border-style: solid; border-color: transparent currentcolor currentcolor; border-image: none; border-radius: 50%; opacity: 0.65; animation: 0.8s linear 0s infinite normal none running heo-spin; }
#article-container h1::before, #article-container h2::before, #article-container h3::before, #article-container h4::before, #article-container h5::before, #article-container h6::before, #post .post-copyright::before, #post .post-outdate-notice::before, .fontawesomeIcon, .note:not(.no-icon)::before { display: inline-block; font-weight: 600; font-style: normal; font-variant: normal; font-family: heoblogIcon; text-rendering: auto; -webkit-font-smoothing: antialiased; }
#post > #post-info { margin-bottom: 1.5rem; }
#post > #post-info .post-title { padding-bottom: 0.2rem; border-bottom: 1px solid var(--light-grey); color: var(--text-highlight-color); }
#post > #post-info .post-title .post-edit-link { float: right; }
#post > #post-info #post-meta { color: rgb(120, 129, 138); }
#post-info .post-title .post-edit-link { padding-left: 0.5rem; }
#post-info #post-meta > .meta-secondline > span.post-meta-separator:first-child { display: none; }
#post-info #post-meta a { transition: var(--t); }
#post-info span.tags-punctuation::before { font-size: 20px; line-height: 32px; }
#post .tag_share .post-meta__tags span.tags-punctuation { font-size: 12px; margin-right: 1px; display: flex; align-items: center; font-weight: 700; }
#post .post-copyright::before { position: absolute; top: 0.1rem; right: 0.6rem; content: ""; font-size: 1rem; }
#post .post-copyright .post-copyright-meta { font-weight: 700; }
#post .post-copyright .post-copyright-info a { text-decoration: none; word-break: break-word; border-radius: 4px; }
#post-meta .post-meta-date { margin: 0px; }
#post-meta .post-meta-date time { font-weight: 700; }
#post-info #post-meta a.post-meta-pv { color: var(--heo-white); display: inline-flex; align-items: center; border-radius: 99px; }
#post-info #post-meta > .meta-secondline > span:first-child { margin-right: 0px; }
#post-info #post-meta .post-meta-ttstime-toggle i[class^="ri-"] { margin: 0px; }
#post-firstinfo { text-align: left; display: flex; white-space: nowrap; user-select: none; }
#post-firstinfo .post-meta__tags { color: var(--heo-white); opacity: 0.8; margin-right: 8px; padding: 0px 8px 0px 4px; border-radius: 99px; display: flex; align-items: center; flex-direction: row; }
#post-firstinfo .meta-firstline { display: flex; align-items: center; height: 32px; }
#post-info #post-meta i { font-size: 16px; margin-right: 4px; }
#post-info #post-meta i[class^="ri-"] { font-size: 16px; margin-right: 4px; }
#post-info #post-meta .post-meta-label { display: none; }
#post-info #post-meta .post-meta-icon { margin-right: 0.4rem; }
#post-info #post-meta .post-meta-separator { margin: 0px 10px; }
#post-info .post-title { color: var(--heo-white); font-weight: 700; font-size: 42px; line-height: 1.38; text-align: left; -webkit-line-clamp: 2; padding: 0px; overflow: hidden; margin: 0px; }
#post-meta > div { text-align: left; }
#post-info #post-meta { font-size: 95%; color: var(--heo-white); transition: var(--t); display: flex; user-select: none; }
#post-info #post-meta a { text-decoration: none; line-height: 1; border-radius: 12px; }
#post-info #post-meta .meta-secondline > span:not(.post-meta-separator) a, #post > #post-info #post-meta .meta-secondline a { color: inherit; }
#post-info #post-meta .meta-secondline > span:not(.post-meta-separator) > a { transition: none; }
#post-info #post-meta .meta-secondline #busuanzi_value_page_pv, #post-info #post-meta .meta-secondline #twikoo-count, #post-info #post-meta .meta-secondline .leancloud-visitors-count, #post-info #post-meta .meta-secondline .post-meta-readtime > span:last-child, #post-info #post-meta .meta-secondline .word-count, #post > #post-info #post-meta .meta-secondline #twikoo-count { color: inherit; font-weight: 800; }
#post-info #post-meta i { line-height: 1; }
#post h2 { margin-top: 1.5rem; }
#post .tag_share .post-meta__tags { background: var(--heo-secondbg); border: var(--style-border-always); color: var(--heo-fontcolor); border-radius: 999px; margin: 0px; display: flex; align-items: center; white-space: nowrap; height: 32px; padding: 0px 0.6rem; width: fit-content; font-size: 0.85em; transition: var(--t-fast); }
#post .post-copyright { background: var(--heo-secondbg); transition: var(--t); position: relative; margin: 80px 0px 30px; border-radius: 12px; padding: 34px 12px 20px; border: var(--style-border-always); }
#post .post-copyright .post-copyright-info a { padding: 0px; color: var(--heo-fontcolor); font-weight: 700; }
#post .post-copyright .post-copyright__notice .post-copyright-info a { padding: 0px 4px; }
#post .post-copyright .post-copyright-info { padding-left: 0px; font-size: 15px; color: var(--heo-secondtext); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-align: center; }
#post .post-copyright .post-copyright-title { padding-left: 0px; }
#post .post-copyright .post-copyright-title, #post > div.post-copyright > div.post-copyright__author > span > span { color: var(--heo-fontcolor); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-size: 1rem; font-weight: 700; }
#post > div.post-copyright > div.post-copyright__author > span > span { padding: 0px; line-height: 1.38; }
#post > div.post-copyright > div.post-copyright__type { line-height: 16px; display: flex; align-items: center; margin-top: 4px; }
#post > div.post-copyright > div.post-copyright__type > span > a { font-size: 14px; opacity: 0.6; line-height: 16px; }
#post > div.post-copyright > div.post-copyright__notice { font-size: 12px; margin: 1rem 0px 0.5rem; }
#post .post-copyright::before { display: none; }
#post > hr { display: none; }
#post .tag_share .post-meta__tag-list { display: flex; padding: 0px; width: 100%; flex-flow: wrap; gap: 8px; }
#post .tag_share .post-meta__tags span.tagsPageCount { padding: 2px 4px; background: var(--heo-fontcolor); min-width: 22.5px; display: inline-block; border-radius: 999px; text-align: center; font-size: 0.6rem; color: var(--heo-card-bg); margin-left: 4px; line-height: 1; transition: var(--t-fast); }
#post .tag_share .post_share { display: block; float: right; margin: 0.4rem 0px; width: fit-content; }
#post .post-outdate-notice { position: relative; margin: 0px 0px 1rem; border-radius: 3px; padding: 0.5em 1em 0.5em 2.6em; }
#post .ads-wrap { margin: 2rem 0px; }
#post { background: var(--heo-card-bg); }
#post-info .heo-loading-spin i { background: conic-gradient(var(--heo-white) 0turn .8turn,transparent .8turn 1turn); }
#article-container figure.highlight .line.marked { background-color: rgba(97, 97, 97, 0.314); }
#article-container figure.highlight table { display: block; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; overflow: scroll; }
#article-container figure.highlight table td { padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; height: 100%; }
#article-container figure.highlight table td.code { width: 100%; display: flex; position: relative; }
#article-container figure.highlight .code pre { padding-right: 0.5rem; padding-left: 0.5rem; width: 100%; }
#article-container figure.highlight, #article-container pre { overflow: auto; margin: 0px 0px 1rem; padding: 0px; line-height: 1.6; }
#article-container code, #article-container pre { font-family: consolas, Menlo, "PingFang SC", "Microsoft YaHei", sans-serif !important; }
#article-container pre code { padding: 0px; background: 0px 0px; color: var(--hl-color); text-shadow: none; }
#article-container figure.highlight { position: relative; }
#article-container figure.highlight pre { margin: 0px; padding: 8px 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }
#article-container figure.highlight .caption, #article-container figure.highlight figcaption { padding: 0.3rem 0px 0.1rem 0.7rem; font-size: 16px; line-height: 1em; }
#article-container figure.highlight .caption a, #article-container figure.highlight figcaption a { float: right; padding-right: 10px; color: var(--hl-color); }
#article-container .highlight-tools { position: relative; display: flex; -webkit-box-align: center; align-items: center; overflow: hidden; min-height: 1.2rem; height: 2.15em; background: var(--hltools-bg); color: var(--hltools-color); font-size: 16px; }
#article-container .highlight-tools.closed + table { display: none; }
#article-container .highlight-tools .expand { position: absolute; padding: 0.4rem 0.3rem; cursor: pointer; transition: transform 0.3s; }
#article-container .highlight-tools .expand + .code-lang { left: 1.7rem; }
#article-container .highlight-tools .expand.closed { transition: var(--t); transform: rotate(-90deg) !important; }
#article-container .highlight-tools .code-lang { position: absolute; font-weight: 700; font-size: 1.15em; user-select: none; }
#article-container .highlight-tools .copy-notice { position: absolute; right: 1.7rem; opacity: 0; transition: opacity 0.4s; }
#article-container .gist table { width: auto; }
#article-container .gist table td { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }
#article-container .code-expand-btn.expand-done { display: none !important; }
#article-container .code-expand-btn:not(.expand-done) ~ pre, #article-container .code-expand-btn:not(.expand-done) ~ table { overflow: hidden; height: 400px; }
#post-comment .comment-head .comment-headline { display: inline-block; vertical-align: middle; font-weight: 700; font-size: 20px; position: relative; }
#article-container { overflow-wrap: break-word; }
#article-container img { display: block; margin: 0px auto 0.8rem; max-width: 90%; max-height: 450px; }
#article-container iframe { margin: 0px 0px 1rem; }
#article-container kbd { margin: 0px 3px; padding: 3px 5px; border: 1px solid rgb(180, 180, 180); border-radius: 3px; background-color: rgb(248, 248, 248); box-shadow: rgba(0, 0, 0, 0.25) 0px 1px 3px, rgba(255, 255, 255, 0.6) 0px 2px 1px 0px inset; color: rgb(52, 73, 94); white-space: nowrap; font-weight: 600; font-size: 0.9em; font-family: Monaco, "Ubuntu Mono", monospace; line-height: 1em; }
#article-container h1, #article-container h2, #article-container h3, #article-container h4, #article-container h5, #article-container h6 { transition: var(--t-fast); }
#article-container h1::before, #article-container h2::before, #article-container h3::before, #article-container h4::before, #article-container h5::before, #article-container h6::before { position: absolute; top: calc(50% - 0.35rem); color: rgb(242, 186, 75); content: ""; line-height: 1; transition: var(--t-fast); }
#article-container h1 code { font-size: 1rem; }
#article-container h1::before { margin-left: -1.2rem; font-size: 1rem; }
#article-container h2 { padding-left: 1.3rem; }
#article-container h2 code { font-size: 0.9rem; }
#article-container h2::before { margin-left: -1.1rem; font-size: 0.9rem; }
#article-container h3 { padding-left: 1.2rem; }
#article-container h3 code { font-size: 0.8rem; }
#article-container h3::before { margin-left: -1rem; font-size: 0.8rem; }
#article-container h4 { padding-left: 1.1rem; }
#article-container h4 code { font-size: 0.7rem; }
#article-container h4::before { margin-left: -0.9rem; font-size: 0.7rem; }
#article-container h5 { padding-left: 1rem; }
#article-container h5 code { font-size: 0.6rem; }
#article-container h5::before { margin-left: -0.8rem; font-size: 0.6rem; }
#article-container h6 { padding-left: 1rem; }
#article-container h6 code { font-size: 0.6rem; }
#article-container h6::before { margin-left: -0.8rem; font-size: 0.6rem; }
#article-container ol, #article-container ul { margin-top: 0.4rem; list-style: none; counter-reset: li 0; }
#article-container ol p, #article-container ul p { margin: 0px 0px 0.5rem; }
#article-container ol ol, #article-container ol ul, #article-container ul ol, #article-container ul ul { padding-left: 0.6rem; }
#article-container ol li:not(.tab), #article-container ul li:not(.tab) { position: relative; margin: 0.2rem 0px; }
#article-container ol li::before, #article-container ul li::before { position: absolute; top: 0px; left: 0px; background: rgb(48, 122, 246); color: rgb(255, 255, 255); cursor: pointer; transition: var(--t); }
#article-container ol > li:not(.tab) { padding: 0.2em 0.2em 0.2em 1.8em; }
#article-container ol > li::before { margin-top: 0.65em; width: 1.45em; height: 1.45em; border-radius: 0.725em; content: counter(li); counter-increment: li 1; text-align: center; font-size: 0.85em; line-height: 1.45em; }
#article-container ul > li:not(.tab) { padding: 0.2em 0.2em 0.2em 1.1em; }
#article-container > :last-child { margin-bottom: 0px !important; }
#post .tag_share .post_share .social-share { font-size: 0.85em; }
#post .tag_share .post_share .social-share .social-share-icon { margin: 0px 4px; width: 1.85em; height: 1.85em; font-size: 1.2em; line-height: 1.85em; }
#post .post-outdate-notice::before { position: absolute; top: 50%; left: 0.9em; content: ""; transform: translateY(-50%); }
#article-container .aplayer { margin: 0px 0px 1rem; }
#article-container .aplayer ol, #article-container .aplayer ul { margin: 0px; padding: 0px; }
#article-container .aplayer ol li, #article-container .aplayer ul li { margin: 0px; padding: 0px 15px; }
#article-container .aplayer ol li::before, #article-container .aplayer ul li::before { content: none; }
#article-container .btn-center { margin: 0px 0px 1rem; text-align: center; }
#article-container .btn-beautify { display: inline-block; margin: 0px 0.2rem 0.3rem; padding: 0px 1rem; background-color: rgb(119, 119, 119); color: rgb(255, 255, 255); line-height: 2; }
#article-container .btn-beautify i + span { margin-left: 0.3rem; }
#article-container .btn-beautify:not(.block) + .btn-beautify:not(.block) { margin: 0px 0.2rem 1rem; }
#article-container .btn-beautify.block { display: block; margin: 0px 0px 1rem; width: fit-content; }
#article-container .btn-beautify.block.center { margin: 0px auto 1rem; }
#article-container .btn-beautify.block.right { margin: 0px 0px 1rem auto; }
#article-container .btn-beautify.larger { padding: 0.3rem 1.3rem; }
#article-container .btn-beautify.blue { background-color: rgb(66, 139, 202); }
#article-container .btn-beautify.pink { background-color: rgb(255, 105, 180); }
#article-container .btn-beautify.red { background-color: red; }
#article-container .btn-beautify.purple { background-color: rgb(111, 66, 193); }
#article-container .btn-beautify.orange { background-color: rgb(255, 140, 0); }
#article-container .btn-beautify.green { background-color: rgb(92, 184, 92); }
#article-container .btn-beautify.outline { border: 1px solid rgb(119, 119, 119); background-color: transparent; color: rgb(119, 119, 119); transition: var(--t); }
#article-container .btn-beautify.outline.button--animated::before { background: rgb(119, 119, 119); }
#article-container .btn-beautify.outline.blue { border-color: rgb(66, 139, 202); color: rgb(66, 139, 202); }
#article-container .btn-beautify.outline.blue.button--animated::before { background: rgb(66, 139, 202); }
#article-container .btn-beautify.outline.pink { border-color: rgb(255, 105, 180); color: rgb(255, 105, 180); }
#article-container .btn-beautify.outline.pink.button--animated::before { background: rgb(255, 105, 180); }
#article-container .btn-beautify.outline.red { border-color: red; color: red; }
#article-container .btn-beautify.outline.red.button--animated::before { background: red; }
#article-container .btn-beautify.outline.purple { border-color: rgb(111, 66, 193); color: rgb(111, 66, 193); }
#article-container .btn-beautify.outline.purple.button--animated::before { background: rgb(111, 66, 193); }
#article-container .btn-beautify.outline.orange { border-color: rgb(255, 140, 0); color: rgb(255, 140, 0); }
#article-container .btn-beautify.outline.orange.button--animated::before { background: rgb(255, 140, 0); }
#article-container .btn-beautify.outline.green { border-color: rgb(92, 184, 92); color: rgb(92, 184, 92); }
#article-container .btn-beautify.outline.green.button--animated::before { background: rgb(92, 184, 92); }
#article-container .inline-img { display: inline; margin: 0px 3px; height: 1.1em; vertical-align: text-bottom; }
#article-container .tabs > .tab-contents .tab-item-content { position: relative; display: none; padding: 1.8rem 1.2rem; background: var(--heo-background); border: var(--style-border-always); }
#article-container .tabs > .tab-contents .tab-item-content.active { display: block; animation: 0s ease 0s 1 normal none running tabshow; padding: 1.2rem; border-radius: 8px; }
#article-container .tabs .tab-to-top { position: relative; display: block; margin: 16px 0px 0px auto; color: rgb(153, 169, 191); }
#post .post-audio.post-tts.is-suppressed-by-podcast { display: none !important; }
#page-header #post-info { top: 14px; position: absolute; padding: 0px 3rem; margin: 0px auto; z-index: 10; color: var(--heo-white); max-width: 1400px; width: 100%; gap: 16px; display: flex; flex-direction: column; align-items: flex-start; height: calc(100% - 30px); justify-content: center; animation: 0.6s ease 0s 1 normal backwards running slide-in; }
.page #post-comment { background: var(--heo-card-bg); padding: 1rem; border: var(--style-border-always); border-radius: 12px; }
#article-container h1::before, #article-container h2::before, #article-container h3::before, #article-container h4::before, #article-container h5::before, #article-container h6::before { top: calc(50% - 0.45rem); content: ""; }
#article-container video { max-width: 100%; }
#article-container ul > li:not(.tab)::before { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background: var(--heo-lighttext); box-shadow: 0 0 0 .22em color-mix(in srgb,var(--heo-lighttext) 30%,transparent); }
#article-container ol, #article-container ul { padding: 0px; }
#article-container .tabs { position: relative; border-radius: 12px; overflow: hidden; box-shadow: var(--heo-shadow-border); padding: 8px; background: var(--heo-card-bg); margin: 1rem 0px !important; border: 3px solid var(--heo-secondbg) !important; }
#article-container .tabs .nav-tabs { background: var(--heo-card-bg); padding: 16px; display: flex; justify-content: center; flex-flow: wrap; }
#article-container .tabs > .nav-tabs > .tab.active button { border: var(--style-border-hover-always); background: var(--heo-background); border-radius: 8px; }
#article-container .tabs > .nav-tabs > .tab button { background: var(--heo-secondbg); transition: var(--t); border: var(--style-border-always); border-radius: 8px; font-size: 14px; padding: 8px 16px; display: block; line-height: 1; width: 100%; color: var(--heo-fontcolor); }
#article-container a { text-decoration: none; border-bottom: 2px dotted var(--heo-lighttext); color: var(--heo-fontcolor); font-weight: 700; padding: 0px 4px; border-radius: 4px 4px 0px 0px; }
#article-container a.fancybox { border-bottom: 0px; padding: 0px; margin: auto; display: contents; width: fit-content; user-select: none; }
#article-container a.fancybox img { cursor: zoom-in; }
#article-container p { margin: 24px 0px; text-align: left; letter-spacing: 0.6px; }
#article-container blockquote p { line-height: 1.7; font-size: 15px; }
#article-container code { color: var(--heo-pink); padding: 0.2rem 0.4rem; border-radius: 4px; margin: 0px 4px; background: var(--heo-secondbg); line-height: 2; font-weight: 700; }
#article-container code::selection { background: var(--heo-main) !important; }
#article-container p { font-size: 17px; line-height: 1.7; font-weight: 400; }
#article-container.post-content h1, #article-container.post-content h2, #article-container.post-content h3, #article-container.post-content h4 { display: flex; align-items: center; justify-content: flex-start; flex-direction: row; }
#article-container.post-content h1 { font-size: 1.5rem; line-height: 1.3; }
#article-container.post-content h2 { font-size: 1.3rem; line-height: 1.3; padding-top: 1.5rem; }
#article-container.post-content h3 { font-size: 1.1rem; line-height: 1.3; margin-top: 52px; }
#article-container.post-content h4 { font-size: 1rem; line-height: 1.3; }
#article-container .tag-Link { background: var(--heo-secondbg); display: flex; border-top-color: ; border-top-style: ; border-right-color: ; border-right-style: ; border-bottom-color: ; border-bottom-style: ; border-left-color: ; border-left-style: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; flex-direction: column; padding: 0.3rem 1rem 0.6rem; margin-top: 1rem; border-radius: 8px !important; border-width: 1px !important; }
#article-container .tag-Link .tag-link-tips { border-bottom: var(--style-border-always); padding-bottom: 4px; font-size: 0.6rem; color: var(--heo-gray); font-weight: 400; pointer-events: none; }
#article-container .tag-Link .tag-link-bottom { display: flex; margin-top: 0.5rem; align-items: center; justify-content: space-around; pointer-events: none; }
#article-container .tag-Link .tag-link-bottom .tag-link-left { width: 60px; min-width: 60px; height: 60px; border-radius: 8px; background-image: ; background-position-x: ; background-position-y: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; background-color: ; pointer-events: none; display: flex; background-size: cover !important; }
#article-container .tag-Link .tag-link-bottom .tag-link-left i { padding: 0px; margin: auto; font-size: 24px; color: var(--heo-fontcolor); }
#article-container .tag-Link .tag-link-bottom .tag-link-right { margin-left: 1rem; pointer-events: none; }
#article-container .tag-Link .tag-link-bottom .tag-link-right .tag-link-title { font-size: 16px; line-height: 1.2; pointer-events: none; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
#article-container .tag-Link .tag-link-bottom .tag-link-right .tag-link-sitename { font-size: 0.7rem; color: var(--heo-gray); font-weight: 400; margin-top: 8px; pointer-events: none; line-height: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#article-container .tag-Link .tag-link-bottom i { margin-left: auto; padding-left: 0.5rem; pointer-events: none; }
#article-container .tag-ask-ai { background: var(--heo-secondbg); border-radius: 12px; padding: 12px 20px; line-height: 1.3; border: var(--style-border-always); margin-top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#article-container > h1:nth-child(1):not(.equipment-page-title), #article-container > h2:nth-child(1):not(.equipment-page-title) { margin: 0px; }
#article-container .headerlink::before { content: ""; font-family: heoblogIcon !important; }
.page #article-container .headerlink::before { display: none; }
#article-container .headerlink { float: right; opacity: 0.08; position: relative; padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; line-height: 1; font-size: 1rem; display: none; border-radius: 8px !important; }
#article-container img { border-radius: 16px; margin-bottom: 0.5rem; object-fit: cover; }
#article-container img.error { content: url("https://img.zhheo.com/i/67d8ff97d5a1a.webp"); }
#article-container ol li::before, #article-container ul li::before { background: var(--heo-main); cursor: default; }
#article-container figure.highlight .highlight-tools { background: var(--heo-secondbg); border-bottom: var(--style-border-always); color: var(--heo-fontcolor); }
#article-container .gutter { opacity: 0.6; user-select: none; }
#article-container .code-lang { margin-left: 6px; }
#article-container .highlight-tools .code-lang { text-transform: capitalize; left: 1.9rem; }
#article-container figure.highlight table::-webkit-scrollbar { color: var(--heo-blue); background: var(--heo-card-bg); height: 8px; }
#article-container figure.highlight table::-webkit-scrollbar-corner { background: var(--heo-background); }
#article-container figure.highlight table::-webkit-scrollbar-thumb { background: var(--heo-secondbg); }
#article-container .code-expand-btn i { color: var(--heo-fontcolor); font-size: 14px; line-height: 1; animation: 1.2s ease 0s infinite normal none running code-expand-key; }
#article-container .code-expand-btn { background: var(--heo-secondbg); transition: var(--t); backdrop-filter: saturate(180%) blur(20px); transform: translateZ(0px); border-top: var(--style-border-always); position: absolute; bottom: 0px; z-index: 10; width: 100%; text-align: center; font-size: 16px; cursor: pointer; display: flex; align-items: center; justify-content: center; height: 32px; }
#article-container iframe { border-radius: 12px !important; }
.relatedPosts > .headline { margin-bottom: 0.8rem; font-weight: 700; font-size: 20px; display: flex; align-items: center; }
.relatedPosts > .headline span { margin-right: auto; margin-left: 8px; user-select: text; }
.relatedPosts > .headline a { font-weight: 400; user-select: text; }
div#post-comment { margin: 2rem 0px; }
#post-comment > div.comment-head > div.comment-privacy { display: block; justify-content: space-between; margin-left: 8px; font-size: 13px; }
#post-comment .comment-head { margin-bottom: 0.5rem; display: flex; align-items: center; flex-wrap: wrap; position: relative; justify-content: space-between; font-size: 0.8em !important; }
#article-container figure.highlight { border-radius: 8px 8px 4px 4px; }
#article-container figure.highlight .gutter pre { color: var(--heo-secondtext); background: var(--heo-secondbg); border-right: var(--style-border-always); padding-right: 0.5rem; padding-left: 0.5rem; text-align: right; }
#article-container figure.highlight figcaption a { color: rgb(169, 169, 169) !important; }
#article-container .highlight:not(.js-file-line-container) { color: var(--heo-fontcolor); border: var(--style-border-always); overflow: hidden; background-color: var(--heo-card-bg) !important; }
#article-container figure.highlight pre span::selection { background: var(--heo-main) !important; color: var(--heo-white) !important; }
#article-container h1 { padding-left: 0px; }
#article-container h1::before { display: none; }
#article-container > div > figure > figcaption > p { margin: 0px; }
#post amp-ad, #post amp-ad div { display: flex; }
/* ---------------------------------------------------------------------------
 * Related posts (live injected rules, captured from blog.zhheo.com).
 * ------------------------------------------------------------------------- */
.relatedPosts { margin-top: 2rem; user-select: none; }
.relatedPosts > .headline { margin-bottom: 0.8rem; font-weight: 700; font-size: 20px; display: flex; align-items: center; }
.relatedPosts > .headline span { margin-right: auto; margin-left: 8px; user-select: text; }
.relatedPosts > .headline a { font-weight: 400; user-select: text; }
.relatedPosts-list { display: flex; flex-flow: column wrap; justify-content: space-between; }
.relatedPosts > .relatedPosts-list > div { position: relative; display: inline-block; margin: 3px; height: 200px; vertical-align: bottom; }
.relatedPosts > .relatedPosts-list > div { background: var(--heo-secondbg); border: var(--style-border); transition: var(--t); cursor: pointer; overflow: hidden; width: 100%; margin-bottom: 8px; }
.relatedPosts > .relatedPosts-list a { display: flex; width: 100%; height: 100%; }
.relatedPosts > .relatedPosts-list .cover { width: 360px; min-width: 45%; height: 100%; transition: var(--t-slow); object-fit: cover; max-width: 45%; }
.relatedPosts > .relatedPosts-list .content { padding: 0 1rem; width: 100%; }
.relatedPosts > .relatedPosts-list .content .title { color: var(--heo-fontcolor); font-weight: 700; line-height: 1.5; -webkit-line-clamp: 4; line-clamp: 4; font-size: 0.9rem; text-align: left; overflow: hidden; margin-right: auto; }
.relatedPosts > .relatedPosts-list .content .date { color: var(--heo-fontcolor); display: none; }

/* ---------------------------------------------------------------------------
 * Related posts "随便逛逛" link (live injected rules, captured from reference).
 * ------------------------------------------------------------------------- */
.relatedPosts-link { margin-left: 8px; }
.relatedPosts-link a { display: inline-flex; align-items: center; background: var(--heo-secondbg); border: var(--style-border-always); color: var(--heo-fontcolor); border-radius: 999px; height: 32px; padding: 0px 0.6rem; font-size: 13px; white-space: nowrap; transition: var(--t-fast); }
.relatedPosts-link a:hover { background: var(--heo-main); color: var(--heo-white); }