@charset "UTF-8";
/* The syntax light mode typography colors */
/* light-scheme */
/* The main dark mode styles */
/* dark-scheme */
/* The SCSS variables */
/* sidebar */
/* the basic width */
/* screen width: >= 1650px */
/* other framework sizes */
/* screen width: < 850px */
/* syntax highlight */
/* fonts */
/* Appending custom SCSS variables will override the default ones in `_sass/addon/variables.scsss` */
/* Mainly scss modules, only imported to `assets/css/main.scss` */
/* ---------- scss placeholder --------- */
header .post-desc, #search-results a, h5, h4, h3, h2, h1 { color: var(--heading-color); font-weight: 400; font-family: Lato, "Microsoft Yahei", sans-serif; }

main h5, main h4, main h3, main h2 { margin-top: 2.5rem; margin-bottom: 1.25rem; }

main h5:focus, main h4:focus, main h3:focus, main h2:focus { outline: none; /* avoid outline in Safari */ }

h5 .anchor, h4 .anchor, h3 .anchor, h2 .anchor { font-size: 80%; }

@media (hover: hover) { h5 .anchor, h4 .anchor, h3 .anchor, h2 .anchor { visibility: hidden; opacity: 0; transition: opacity 0.25s ease-in, visibility 0s ease-in 0.25s; } h5:hover .anchor, h4:hover .anchor, h3:hover .anchor, h2:hover .anchor { visibility: visible; opacity: 1; transition: opacity 0.25s ease-in, visibility 0s ease-in 0s; } }

.post-tags .post-tag:hover, .tag:hover { background: var(--tag-hover); transition: background 0.35s ease-in-out; }

.table-wrapper > table tbody tr td, .table-wrapper > table thead th { padding: 0.4rem 1rem; font-size: 95%; white-space: nowrap; }

#page-category a:hover, #page-tag a:hover, .post-tags .post-tag:hover, .post-tail-wrapper .license-wrapper > a:hover, #search-results a:hover, #topbar #breadcrumb a:hover, .content a:not(.img-link):hover, .post-meta a:not([class]):hover, #access-lastmod a:hover, footer a:hover { color: #d2603a !important; border-bottom: 1px solid #d2603a; text-decoration: none; }

#search-results a, #search-hints .post-tag, a { color: var(--link-color); }

.post-tail-wrapper .post-meta a:not(:hover), .content a:not(.img-link) { border-bottom: 1px solid var(--link-underline-color); }

#sidebar .sidebar-bottom a, #sidebar .site-title a, #sidebar .profile-wrapper { transition: all 0.3s ease-in-out; }

#sidebar .sidebar-bottom .icon-border, .content a.popup, i.far, i.fas, .code-header { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

#page-category ul > li > a, #page-tag ul > li > a, .post-tags .post-tag:hover, #search-results a, main .categories a:not(:hover), main #tags a:not(:hover), main #archives a:not(:hover), #access-lastmod a { border-bottom: none; }

.post-tail-wrapper .share-wrapper .share-icons button, #search-cancel, .code-header button { cursor: pointer; }

#related-posts time, #post-list .card .card-body .post-meta em, .post-meta em { font-style: normal; }

.categories.card, .categories .list-group, .embed-video, .post-preview::before, .post-preview, .preview-img img, .preview-img, blockquote[class^='prompt-'], .code-header button, div[class^='language-'], .highlight { border-radius: 0.625rem; }

.embed-audio + em, .embed-video + em, .content a.popup + em { display: block; text-align: center; font-style: normal; font-size: 80%; padding: 0; color: #6d6c6c; }

#sidebar .sidebar-bottom #mode-toggle, #sidebar a { color: var(--sidebar-muted-color); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

#related-posts .card h4, #post-list .card .card-body .card-text.content p, #post-list .card .card-body .card-title { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.post-tail-wrapper .license-wrapper > a, header .post-meta em, header .post-meta time, footer em, footer a { color: var(--text-muted-hightlight-color); font-weight: 600; }

.post-tail-wrapper .license-wrapper span:last-child, .post-tail-wrapper, .post-meta { font-size: 0.85rem; }

#related-posts time, footer { font-size: 0.8rem; }

sup:target, .footnotes > ol > li:target { background-color: var(--footnote-target-bg); width: -moz-fit-content; width: -webkit-fit-content; width: fit-content; transition: background-color 1.75s ease-in-out; }

/* ---------- scss mixin --------- */
/* The syntax highlight. */
/* The syntax light mode code snippet colors. */
/* light-syntax */
/* The syntax dark mode styles. */
@media (prefers-color-scheme: light) { html:not([data-mode]), html[data-mode='light'] { /* --- custom light colors --- */ --language-border-color: #ececec; --highlight-bg-color: #f6f8fa; --highlighter-rouge-color: #3f596f; --highlight-lineno-color: #9e9e9e; --inline-code-bg: #f6f6f7; --code-color: #3a3a3a; --code-header-text-color: #a3a3a3; --code-header-muted-color: #e5e5e5; --code-header-icon-color: #c9c8c8; --clipboard-checked-color: #43c743; /* --- Syntax highlight theme from `rougify style github` --- */ } html:not([data-mode]) [class^='prompt-'], html[data-mode='light'] [class^='prompt-'] { --inline-code-bg: #fbfafa; } html:not([data-mode]) .highlight table td, html[data-mode='light'] .highlight table td { padding: 5px; } html:not([data-mode]) .highlight table pre, html[data-mode='light'] .highlight table pre { margin: 0; } html:not([data-mode]) .highlight, html:not([data-mode]) .highlight .w, html[data-mode='light'] .highlight, html[data-mode='light'] .highlight .w { color: #24292f; background-color: #f6f8fa; } html:not([data-mode]) .highlight .k, html:not([data-mode]) .highlight .kd, html:not([data-mode]) .highlight .kn, html:not([data-mode]) .highlight .kp, html:not([data-mode]) .highlight .kr, html:not([data-mode]) .highlight .kt, html:not([data-mode]) .highlight .kv, html[data-mode='light'] .highlight .k, html[data-mode='light'] .highlight .kd, html[data-mode='light'] .highlight .kn, html[data-mode='light'] .highlight .kp, html[data-mode='light'] .highlight .kr, html[data-mode='light'] .highlight .kt, html[data-mode='light'] .highlight .kv { color: #cf222e; } html:not([data-mode]) .highlight .gr, html[data-mode='light'] .highlight .gr { color: #f6f8fa; } html:not([data-mode]) .highlight .gd, html[data-mode='light'] .highlight .gd { color: #82071e; background-color: #ffebe9; } html:not([data-mode]) .highlight .nb, html[data-mode='light'] .highlight .nb { color: #953800; } html:not([data-mode]) .highlight .nc, html[data-mode='light'] .highlight .nc { color: #953800; } html:not([data-mode]) .highlight .no, html[data-mode='light'] .highlight .no { color: #953800; } html:not([data-mode]) .highlight .nn, html[data-mode='light'] .highlight .nn { color: #953800; } html:not([data-mode]) .highlight .sr, html[data-mode='light'] .highlight .sr { color: #116329; } html:not([data-mode]) .highlight .na, html[data-mode='light'] .highlight .na { color: #116329; } html:not([data-mode]) .highlight .nt, html[data-mode='light'] .highlight .nt { color: #116329; } html:not([data-mode]) .highlight .gi, html[data-mode='light'] .highlight .gi { color: #116329; background-color: #dafbe1; } html:not([data-mode]) .highlight .kc, html[data-mode='light'] .highlight .kc { color: #0550ae; } html:not([data-mode]) .highlight .l, html:not([data-mode]) .highlight .ld, html:not([data-mode]) .highlight .m, html:not([data-mode]) .highlight .mb, html:not([data-mode]) .highlight .mf, html:not([data-mode]) .highlight .mh, html:not([data-mode]) .highlight .mi, html:not([data-mode]) .highlight .il, html:not([data-mode]) .highlight .mo, html:not([data-mode]) .highlight .mx, html[data-mode='light'] .highlight .l, html[data-mode='light'] .highlight .ld, html[data-mode='light'] .highlight .m, html[data-mode='light'] .highlight .mb, html[data-mode='light'] .highlight .mf, html[data-mode='light'] .highlight .mh, html[data-mode='light'] .highlight .mi, html[data-mode='light'] .highlight .il, html[data-mode='light'] .highlight .mo, html[data-mode='light'] .highlight .mx { color: #0550ae; } html:not([data-mode]) .highlight .sb, html[data-mode='light'] .highlight .sb { color: #0550ae; } html:not([data-mode]) .highlight .bp, html[data-mode='light'] .highlight .bp { color: #0550ae; } html:not([data-mode]) .highlight .ne, html[data-mode='light'] .highlight .ne { color: #0550ae; } html:not([data-mode]) .highlight .nl, html[data-mode='light'] .highlight .nl { color: #0550ae; } html:not([data-mode]) .highlight .py, html[data-mode='light'] .highlight .py { color: #0550ae; } html:not([data-mode]) .highlight .nv, html:not([data-mode]) .highlight .vc, html:not([data-mode]) .highlight .vg, html:not([data-mode]) .highlight .vi, html:not([data-mode]) .highlight .vm, html[data-mode='light'] .highlight .nv, html[data-mode='light'] .highlight .vc, html[data-mode='light'] .highlight .vg, html[data-mode='light'] .highlight .vi, html[data-mode='light'] .highlight .vm { color: #0550ae; } html:not([data-mode]) .highlight .o, html:not([data-mode]) .highlight .ow, html[data-mode='light'] .highlight .o, html[data-mode='light'] .highlight .ow { color: #0550ae; } html:not([data-mode]) .highlight .gh, html[data-mode='light'] .highlight .gh { color: #0550ae; font-weight: bold; } html:not([data-mode]) .highlight .gu, html[data-mode='light'] .highlight .gu { color: #0550ae; font-weight: bold; } html:not([data-mode]) .highlight .s, html:not([data-mode]) .highlight .sa, html:not([data-mode]) .highlight .sc, html:not([data-mode]) .highlight .dl, html:not([data-mode]) .highlight .sd, html:not([data-mode]) .highlight .s2, html:not([data-mode]) .highlight .se, html:not([data-mode]) .highlight .sh, html:not([data-mode]) .highlight .sx, html:not([data-mode]) .highlight .s1, html:not([data-mode]) .highlight .ss, html[data-mode='light'] .highlight .s, html[data-mode='light'] .highlight .sa, html[data-mode='light'] .highlight .sc, html[data-mode='light'] .highlight .dl, html[data-mode='light'] .highlight .sd, html[data-mode='light'] .highlight .s2, html[data-mode='light'] .highlight .se, html[data-mode='light'] .highlight .sh, html[data-mode='light'] .highlight .sx, html[data-mode='light'] .highlight .s1, html[data-mode='light'] .highlight .ss { color: #0a3069; } html:not([data-mode]) .highlight .nd, html[data-mode='light'] .highlight .nd { color: #8250df; } html:not([data-mode]) .highlight .nf, html:not([data-mode]) .highlight .fm, html[data-mode='light'] .highlight .nf, html[data-mode='light'] .highlight .fm { color: #8250df; } html:not([data-mode]) .highlight .err, html[data-mode='light'] .highlight .err { color: #f6f8fa; background-color: #82071e; } html:not([data-mode]) .highlight .c, html:not([data-mode]) .highlight .ch, html:not([data-mode]) .highlight .cd, html:not([data-mode]) .highlight .cm, html:not([data-mode]) .highlight .cp, html:not([data-mode]) .highlight .cpf, html:not([data-mode]) .highlight .c1, html:not([data-mode]) .highlight .cs, html[data-mode='light'] .highlight .c, html[data-mode='light'] .highlight .ch, html[data-mode='light'] .highlight .cd, html[data-mode='light'] .highlight .cm, html[data-mode='light'] .highlight .cp, html[data-mode='light'] .highlight .cpf, html[data-mode='light'] .highlight .c1, html[data-mode='light'] .highlight .cs { color: #68717a; } html:not([data-mode]) .highlight .gl, html[data-mode='light'] .highlight .gl { color: #68717a; } html:not([data-mode]) .highlight .gt, html[data-mode='light'] .highlight .gt { color: #68717a; } html:not([data-mode]) .highlight .ni, html[data-mode='light'] .highlight .ni { color: #24292f; } html:not([data-mode]) .highlight .si, html[data-mode='light'] .highlight .si { color: #24292f; } html:not([data-mode]) .highlight .ge, html[data-mode='light'] .highlight .ge { color: #24292f; font-style: italic; } html:not([data-mode]) .highlight .gs, html[data-mode='light'] .highlight .gs { color: #24292f; font-weight: bold; } html[data-mode='dark'] { --language-border-color: #2d2d2d; --highlight-bg-color: #151515; --highlighter-rouge-color: #c9def1; --highlight-lineno-color: #808080; --inline-code-bg: #323238; --code-color: #b0b0b0; --code-header-text-color: #6a6a6a; --code-header-muted-color: #353535; --code-header-icon-color: #565656; --clipboard-checked-color: #2bcc2b; --filepath-text-color: #cacaca; /* --- Syntax highlight theme from `rougify style base16.dark` --- */ } html[data-mode='dark'] .highlight .gp { color: #87939d; } html[data-mode='dark'] .highlight table td { padding: 5px; } html[data-mode='dark'] .highlight table pre { margin: 0; } html[data-mode='dark'] .highlight, html[data-mode='dark'] .highlight .w { color: #d0d0d0; background-color: #151515; } html[data-mode='dark'] .highlight .err { color: #151515; background-color: #ac4142; } html[data-mode='dark'] .highlight .c, html[data-mode='dark'] .highlight .ch, html[data-mode='dark'] .highlight .cd, html[data-mode='dark'] .highlight .cm, html[data-mode='dark'] .highlight .cpf, html[data-mode='dark'] .highlight .c1, html[data-mode='dark'] .highlight .cs { color: #848484; } html[data-mode='dark'] .highlight .cp { color: #f4bf75; } html[data-mode='dark'] .highlight .nt { color: #f4bf75; } html[data-mode='dark'] .highlight .o, html[data-mode='dark'] .highlight .ow { color: #d0d0d0; } html[data-mode='dark'] .highlight .p, html[data-mode='dark'] .highlight .pi { color: #d0d0d0; } html[data-mode='dark'] .highlight .gi { color: #90a959; } html[data-mode='dark'] .highlight .gd { color: #f08a8b; background-color: #320000; } html[data-mode='dark'] .highlight .gh { color: #6a9fb5; background-color: #151515; font-weight: bold; } html[data-mode='dark'] .highlight .k, html[data-mode='dark'] .highlight .kn, html[data-mode='dark'] .highlight .kp, html[data-mode='dark'] .highlight .kr, html[data-mode='dark'] .highlight .kv { color: #aa759f; } html[data-mode='dark'] .highlight .kc { color: #d28445; } html[data-mode='dark'] .highlight .kt { color: #d28445; } html[data-mode='dark'] .highlight .kd { color: #d28445; } html[data-mode='dark'] .highlight .s, html[data-mode='dark'] .highlight .sb, html[data-mode='dark'] .highlight .sc, html[data-mode='dark'] .highlight .dl, html[data-mode='dark'] .highlight .sd, html[data-mode='dark'] .highlight .s2, html[data-mode='dark'] .highlight .sh, html[data-mode='dark'] .highlight .sx, html[data-mode='dark'] .highlight .s1 { color: #90a959; } html[data-mode='dark'] .highlight .sa { color: #aa759f; } html[data-mode='dark'] .highlight .sr { color: #75b5aa; } html[data-mode='dark'] .highlight .si { color: #b76d45; } html[data-mode='dark'] .highlight .se { color: #b76d45; } html[data-mode='dark'] .highlight .nn { color: #f4bf75; } html[data-mode='dark'] .highlight .nc { color: #f4bf75; } html[data-mode='dark'] .highlight .no { color: #f4bf75; } html[data-mode='dark'] .highlight .na { color: #6a9fb5; } html[data-mode='dark'] .highlight .m, html[data-mode='dark'] .highlight .mb, html[data-mode='dark'] .highlight .mf, html[data-mode='dark'] .highlight .mh, html[data-mode='dark'] .highlight .mi, html[data-mode='dark'] .highlight .il, html[data-mode='dark'] .highlight .mo, html[data-mode='dark'] .highlight .mx { color: #90a959; } html[data-mode='dark'] .highlight .ss { color: #90a959; } }

@media (prefers-color-scheme: dark) { html:not([data-mode]), html[data-mode='dark'] { --language-border-color: #2d2d2d; --highlight-bg-color: #151515; --highlighter-rouge-color: #c9def1; --highlight-lineno-color: #808080; --inline-code-bg: #323238; --code-color: #b0b0b0; --code-header-text-color: #6a6a6a; --code-header-muted-color: #353535; --code-header-icon-color: #565656; --clipboard-checked-color: #2bcc2b; --filepath-text-color: #cacaca; /* --- Syntax highlight theme from `rougify style base16.dark` --- */ } html:not([data-mode]) .highlight .gp, html[data-mode='dark'] .highlight .gp { color: #87939d; } html:not([data-mode]) .highlight table td, html[data-mode='dark'] .highlight table td { padding: 5px; } html:not([data-mode]) .highlight table pre, html[data-mode='dark'] .highlight table pre { margin: 0; } html:not([data-mode]) .highlight, html:not([data-mode]) .highlight .w, html[data-mode='dark'] .highlight, html[data-mode='dark'] .highlight .w { color: #d0d0d0; background-color: #151515; } html:not([data-mode]) .highlight .err, html[data-mode='dark'] .highlight .err { color: #151515; background-color: #ac4142; } html:not([data-mode]) .highlight .c, html:not([data-mode]) .highlight .ch, html:not([data-mode]) .highlight .cd, html:not([data-mode]) .highlight .cm, html:not([data-mode]) .highlight .cpf, html:not([data-mode]) .highlight .c1, html:not([data-mode]) .highlight .cs, html[data-mode='dark'] .highlight .c, html[data-mode='dark'] .highlight .ch, html[data-mode='dark'] .highlight .cd, html[data-mode='dark'] .highlight .cm, html[data-mode='dark'] .highlight .cpf, html[data-mode='dark'] .highlight .c1, html[data-mode='dark'] .highlight .cs { color: #848484; } html:not([data-mode]) .highlight .cp, html[data-mode='dark'] .highlight .cp { color: #f4bf75; } html:not([data-mode]) .highlight .nt, html[data-mode='dark'] .highlight .nt { color: #f4bf75; } html:not([data-mode]) .highlight .o, html:not([data-mode]) .highlight .ow, html[data-mode='dark'] .highlight .o, html[data-mode='dark'] .highlight .ow { color: #d0d0d0; } html:not([data-mode]) .highlight .p, html:not([data-mode]) .highlight .pi, html[data-mode='dark'] .highlight .p, html[data-mode='dark'] .highlight .pi { color: #d0d0d0; } html:not([data-mode]) .highlight .gi, html[data-mode='dark'] .highlight .gi { color: #90a959; } html:not([data-mode]) .highlight .gd, html[data-mode='dark'] .highlight .gd { color: #f08a8b; background-color: #320000; } html:not([data-mode]) .highlight .gh, html[data-mode='dark'] .highlight .gh { color: #6a9fb5; background-color: #151515; font-weight: bold; } html:not([data-mode]) .highlight .k, html:not([data-mode]) .highlight .kn, html:not([data-mode]) .highlight .kp, html:not([data-mode]) .highlight .kr, html:not([data-mode]) .highlight .kv, html[data-mode='dark'] .highlight .k, html[data-mode='dark'] .highlight .kn, html[data-mode='dark'] .highlight .kp, html[data-mode='dark'] .highlight .kr, html[data-mode='dark'] .highlight .kv { color: #aa759f; } html:not([data-mode]) .highlight .kc, html[data-mode='dark'] .highlight .kc { color: #d28445; } html:not([data-mode]) .highlight .kt, html[data-mode='dark'] .highlight .kt { color: #d28445; } html:not([data-mode]) .highlight .kd, html[data-mode='dark'] .highlight .kd { color: #d28445; } html:not([data-mode]) .highlight .s, html:not([data-mode]) .highlight .sb, html:not([data-mode]) .highlight .sc, html:not([data-mode]) .highlight .dl, html:not([data-mode]) .highlight .sd, html:not([data-mode]) .highlight .s2, html:not([data-mode]) .highlight .sh, html:not([data-mode]) .highlight .sx, html:not([data-mode]) .highlight .s1, html[data-mode='dark'] .highlight .s, html[data-mode='dark'] .highlight .sb, html[data-mode='dark'] .highlight .sc, html[data-mode='dark'] .highlight .dl, html[data-mode='dark'] .highlight .sd, html[data-mode='dark'] .highlight .s2, html[data-mode='dark'] .highlight .sh, html[data-mode='dark'] .highlight .sx, html[data-mode='dark'] .highlight .s1 { color: #90a959; } html:not([data-mode]) .highlight .sa, html[data-mode='dark'] .highlight .sa { color: #aa759f; } html:not([data-mode]) .highlight .sr, html[data-mode='dark'] .highlight .sr { color: #75b5aa; } html:not([data-mode]) .highlight .si, html[data-mode='dark'] .highlight .si { color: #b76d45; } html:not([data-mode]) .highlight .se, html[data-mode='dark'] .highlight .se { color: #b76d45; } html:not([data-mode]) .highlight .nn, html[data-mode='dark'] .highlight .nn { color: #f4bf75; } html:not([data-mode]) .highlight .nc, html[data-mode='dark'] .highlight .nc { color: #f4bf75; } html:not([data-mode]) .highlight .no, html[data-mode='dark'] .highlight .no { color: #f4bf75; } html:not([data-mode]) .highlight .na, html[data-mode='dark'] .highlight .na { color: #6a9fb5; } html:not([data-mode]) .highlight .m, html:not([data-mode]) .highlight .mb, html:not([data-mode]) .highlight .mf, html:not([data-mode]) .highlight .mh, html:not([data-mode]) .highlight .mi, html:not([data-mode]) .highlight .il, html:not([data-mode]) .highlight .mo, html:not([data-mode]) .highlight .mx, html[data-mode='dark'] .highlight .m, html[data-mode='dark'] .highlight .mb, html[data-mode='dark'] .highlight .mf, html[data-mode='dark'] .highlight .mh, html[data-mode='dark'] .highlight .mi, html[data-mode='dark'] .highlight .il, html[data-mode='dark'] .highlight .mo, html[data-mode='dark'] .highlight .mx { color: #90a959; } html:not([data-mode]) .highlight .ss, html[data-mode='dark'] .highlight .ss { color: #90a959; } html[data-mode='light'] { /* --- custom light colors --- */ --language-border-color: #ececec; --highlight-bg-color: #f6f8fa; --highlighter-rouge-color: #3f596f; --highlight-lineno-color: #9e9e9e; --inline-code-bg: #f6f6f7; --code-color: #3a3a3a; --code-header-text-color: #a3a3a3; --code-header-muted-color: #e5e5e5; --code-header-icon-color: #c9c8c8; --clipboard-checked-color: #43c743; /* --- Syntax highlight theme from `rougify style github` --- */ } html[data-mode='light'] [class^='prompt-'] { --inline-code-bg: #fbfafa; } html[data-mode='light'] .highlight table td { padding: 5px; } html[data-mode='light'] .highlight table pre { margin: 0; } html[data-mode='light'] .highlight, html[data-mode='light'] .highlight .w { color: #24292f; background-color: #f6f8fa; } html[data-mode='light'] .highlight .k, html[data-mode='light'] .highlight .kd, html[data-mode='light'] .highlight .kn, html[data-mode='light'] .highlight .kp, html[data-mode='light'] .highlight .kr, html[data-mode='light'] .highlight .kt, html[data-mode='light'] .highlight .kv { color: #cf222e; } html[data-mode='light'] .highlight .gr { color: #f6f8fa; } html[data-mode='light'] .highlight .gd { color: #82071e; background-color: #ffebe9; } html[data-mode='light'] .highlight .nb { color: #953800; } html[data-mode='light'] .highlight .nc { color: #953800; } html[data-mode='light'] .highlight .no { color: #953800; } html[data-mode='light'] .highlight .nn { color: #953800; } html[data-mode='light'] .highlight .sr { color: #116329; } html[data-mode='light'] .highlight .na { color: #116329; } html[data-mode='light'] .highlight .nt { color: #116329; } html[data-mode='light'] .highlight .gi { color: #116329; background-color: #dafbe1; } html[data-mode='light'] .highlight .kc { color: #0550ae; } html[data-mode='light'] .highlight .l, html[data-mode='light'] .highlight .ld, html[data-mode='light'] .highlight .m, html[data-mode='light'] .highlight .mb, html[data-mode='light'] .highlight .mf, html[data-mode='light'] .highlight .mh, html[data-mode='light'] .highlight .mi, html[data-mode='light'] .highlight .il, html[data-mode='light'] .highlight .mo, html[data-mode='light'] .highlight .mx { color: #0550ae; } html[data-mode='light'] .highlight .sb { color: #0550ae; } html[data-mode='light'] .highlight .bp { color: #0550ae; } html[data-mode='light'] .highlight .ne { color: #0550ae; } html[data-mode='light'] .highlight .nl { color: #0550ae; } html[data-mode='light'] .highlight .py { color: #0550ae; } html[data-mode='light'] .highlight .nv, html[data-mode='light'] .highlight .vc, html[data-mode='light'] .highlight .vg, html[data-mode='light'] .highlight .vi, html[data-mode='light'] .highlight .vm { color: #0550ae; } html[data-mode='light'] .highlight .o, html[data-mode='light'] .highlight .ow { color: #0550ae; } html[data-mode='light'] .highlight .gh { color: #0550ae; font-weight: bold; } html[data-mode='light'] .highlight .gu { color: #0550ae; font-weight: bold; } html[data-mode='light'] .highlight .s, html[data-mode='light'] .highlight .sa, html[data-mode='light'] .highlight .sc, html[data-mode='light'] .highlight .dl, html[data-mode='light'] .highlight .sd, html[data-mode='light'] .highlight .s2, html[data-mode='light'] .highlight .se, html[data-mode='light'] .highlight .sh, html[data-mode='light'] .highlight .sx, html[data-mode='light'] .highlight .s1, html[data-mode='light'] .highlight .ss { color: #0a3069; } html[data-mode='light'] .highlight .nd { color: #8250df; } html[data-mode='light'] .highlight .nf, html[data-mode='light'] .highlight .fm { color: #8250df; } html[data-mode='light'] .highlight .err { color: #f6f8fa; background-color: #82071e; } html[data-mode='light'] .highlight .c, html[data-mode='light'] .highlight .ch, html[data-mode='light'] .highlight .cd, html[data-mode='light'] .highlight .cm, html[data-mode='light'] .highlight .cp, html[data-mode='light'] .highlight .cpf, html[data-mode='light'] .highlight .c1, html[data-mode='light'] .highlight .cs { color: #68717a; } html[data-mode='light'] .highlight .gl { color: #68717a; } html[data-mode='light'] .highlight .gt { color: #68717a; } html[data-mode='light'] .highlight .ni { color: #24292f; } html[data-mode='light'] .highlight .si { color: #24292f; } html[data-mode='light'] .highlight .ge { color: #24292f; font-style: italic; } html[data-mode='light'] .highlight .gs { color: #24292f; font-weight: bold; } }

/* -- code snippets -- */
div[class^='language-'], figure.highlight, .highlight { background-color: var(--highlight-bg-color); }

td.rouge-code { padding-left: 1rem; padding-right: 1.5rem; }

.highlighter-rouge { color: var(--highlighter-rouge-color); margin-top: 0.5rem; margin-bottom: 1.2em; /* Override BS Inline-code style */ }

.highlight { overflow: auto; padding-bottom: 0.75rem; }

.highlight pre { margin-bottom: 0; font-size: 0.85rem; line-height: 1.4rem; word-wrap: normal; /* Fixed Safari overflow-x */ }

.highlight table td:first-child { display: inline-block; margin-left: 1rem; margin-right: 0.75rem; }

.highlight table td:last-child { padding-right: 2rem !important; }

.highlight table td pre { overflow: visible; /* Fixed iOS safari overflow-x */ word-break: normal; /* Fixed iOS safari linenos code break */ }

.highlight .lineno { text-align: right; color: var(--highlight-lineno-color); -webkit-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none; }

/* .highlight */
code { -webkit-hyphens: none; -ms-hyphens: none; hyphens: none; color: var(--code-color); }

code.highlighter-rouge { font-size: 0.85rem; padding: 3px 5px; word-break: break-word; border-radius: 4px; background-color: var(--inline-code-bg); }

code.filepath { background-color: inherit; color: var(--filepath-text-color); font-weight: 600; padding: 0; }

a > code.highlighter-rouge { padding-bottom: 0; /* show link's underlinke */ color: inherit; }

a:hover > code.highlighter-rouge { border-bottom: none; }

blockquote code { color: inherit; }

td.rouge-code { /* Prevent some browser extends from changing the URL string of code block. */ }

td.rouge-code a { color: inherit !important; border-bottom: none !important; pointer-events: none; }

div[class^='language-'] { box-shadow: var(--language-border-color) 0 0 0 1px; }

.content > div[class^='language-'] { margin-left: -1rem; margin-right: -1rem; border-radius: 0; }

div[class^='language-'] .highlight { border-top-left-radius: 0; border-top-right-radius: 0; }

/* Hide line numbers for default, console, and terminal code snippets */
div.nolineno td:first-child, div.language-plaintext td:first-child, div.language-console td:first-child, div.language-terminal td:first-child { padding: 0 !important; margin-right: 0; }

div.nolineno td:first-child .lineno, div.language-plaintext td:first-child .lineno, div.language-console td:first-child .lineno, div.language-terminal td:first-child .lineno { display: none; }

.code-header { display: flex; justify-content: space-between; align-items: center; height: 2.25rem; margin-left: 0.75rem; margin-right: 0.25rem; /* the label block */ /* clipboard */ }

.code-header span { line-height: 2.25rem; /* label icon */ /* label text */ }

.code-header span i { font-size: 1rem; width: 1.75rem; color: var(--code-header-icon-color); }

.code-header span i.small { font-size: 70%; }

[file] .code-header span > i { position: relative; top: 1px; /* center the file icon */ }

.code-header span::after { content: attr(data-label-text); font-size: 0.85rem; font-weight: 600; color: var(--code-header-text-color); }

.code-header button { border: 1px solid transparent; height: 2.25rem; width: 2.25rem; padding: 0; background-color: inherit; }

.code-header button i { color: var(--code-header-icon-color); }

.code-header button[timeout]:hover { border-color: var(--clipboard-checked-color); }

.code-header button[timeout] i { color: var(--clipboard-checked-color); }

.code-header button:focus { outline: none; }

.code-header button:not([timeout]):hover { background-color: rgba(128, 128, 128, 0.37); }

.code-header button:not([timeout]):hover i { color: white; }

@media all and (min-width: 576px) { .content > div[class^='language-'] { margin-left: 0; margin-right: 0; border-radius: 0.625rem; } div[class^='language-'] .code-header { margin-left: 0; margin-right: 0; } div[class^='language-'] .code-header::before { content: ''; display: inline-block; margin-left: 1rem; width: 0.75rem; height: 0.75rem; border-radius: 50%; background-color: var(--code-header-muted-color); box-shadow: 1.25rem 0 0 var(--code-header-muted-color), 2.5rem 0 0 var(--code-header-muted-color); } div[class^='language-'] .code-header span { margin-left: calc(($dot-margin + $code-dot-size) / 2 * -1); } }

/* The common styles */
html { font-size: 16px; }

@media (prefers-color-scheme: light) { html:not([data-mode]), html[data-mode='light'] { /* Framework color */ --main-bg: white; --mask-bg: #c1c3c5; --main-border-color: #f3f3f3; /* Common color */ --text-color: #34343c; --text-muted-color: #757575; --text-muted-hightlight-color: inherit; --heading-color: #2a2a2a; --label-color: #585858; --blockquote-border-color: #eeeeee; --blockquote-text-color: #757575; --link-color: #0056b2; --link-underline-color: #dee2e6; --button-bg: #ffffff; --btn-border-color: #e9ecef; --btn-backtotop-color: #686868; --btn-backtotop-border-color: #f1f1f1; --btn-box-shadow: #eaeaea; --checkbox-color: #c5c5c5; --checkbox-checked-color: #07a8f7; --img-bg: radial-gradient(
    circle,
    rgb(255, 255, 255) 0%,
    rgb(239, 239, 239) 100%
  ); --shimmer-bg: linear-gradient(
    90deg,
    rgba(250, 250, 250, 0) 0%,
    rgba(232, 230, 230, 1) 50%,
    rgba(250, 250, 250, 0) 100%
  ); /* Sidebar */ --site-title-color: rgb(113, 113, 113); --site-subtitle-color: #717171; --sidebar-bg: #f6f8fa; --sidebar-border-color: #efefef; --sidebar-muted-color: #545454; --sidebar-active-color: #1d1d1d; --sidebar-hover-bg: rgb(223, 233, 241, 0.64); --sidebar-btn-bg: white; --sidebar-btn-color: #8e8e8e; --avatar-border-color: white; /* Topbar */ --topbar-bg: rgb(255, 255, 255, 0.7); --topbar-text-color: rgb(78, 78, 78); --search-border-color: rgb(240, 240, 240); --search-icon-color: #c2c6cc; --input-focus-border-color: #b8b8b8; /* Home page */ --post-list-text-color: dimgray; --btn-patinator-text-color: #555555; --btn-paginator-hover-color: var(--sidebar-bg); /* Posts */ --toc-highlight: #0550ae; --btn-share-color: gray; --btn-share-hover-color: #0d6efd; --card-bg: white; --card-hovor-bg: #e2e2e2; --card-shadow: rgb(104, 104, 104, 0.05) 0 2px 6px 0,
    rgba(211, 209, 209, 0.15) 0 0 0 1px; --footnote-target-bg: lightcyan; --tb-odd-bg: #fbfcfd; --tb-border-color: #eaeaea; --dash-color: silver; --kbd-wrap-color: #bdbdbd; --kbd-text-color: var(--text-color); --kbd-bg-color: white; --prompt-text-color: rgb(46, 46, 46, 0.77); --prompt-tip-bg: rgb(123, 247, 144, 0.2); --prompt-tip-icon-color: #03b303; --prompt-info-bg: #e1f5fe; --prompt-info-icon-color: #0070cb; --prompt-warning-bg: rgb(255, 243, 205); --prompt-warning-icon-color: #ef9c03; --prompt-danger-bg: rgb(248, 215, 218, 0.56); --prompt-danger-icon-color: #df3c30; /* Tags */ --tag-border: #dee2e6; --tag-shadow: var(--btn-border-color); --tag-hover: rgb(222, 226, 230); --search-tag-bg: #f8f9fa; /* Categories */ --categories-border: rgba(0, 0, 0, 0.125); --categories-hover-bg: var(--btn-border-color); --categories-icon-hover-color: darkslategray; /* Archive */ --timeline-color: rgba(0, 0, 0, 0.075); --timeline-node-bg: #c2c6cc; --timeline-year-dot-color: #ffffff; } html:not([data-mode]) [class^='prompt-'], html[data-mode='light'] [class^='prompt-'] { --link-underline-color: rgb(219, 216, 216); } html:not([data-mode]) .dark, html[data-mode='light'] .dark { display: none; } html[data-mode='dark'] { /* Framework color */ --main-bg: rgb(27, 27, 30); --mask-bg: rgb(68, 69, 70); --main-border-color: rgb(44, 45, 45); /* Common color */ --text-color: rgb(175, 176, 177); --text-muted-color: #868686; --text-muted-hightlight-color: #aeaeae; --heading-color: #cccccc; --label-color: #a7a7a7; --blockquote-border-color: rgb(66, 66, 66); --blockquote-text-color: #868686; --link-color: rgb(138, 180, 248); --link-underline-color: rgb(82, 108, 150); --button-bg: #1e1e1e; --btn-border-color: #2e2f31; --btn-backtotop-color: var(--text-color); --btn-backtotop-border-color: #212122; --btn-box-shadow: var(--main-bg); --card-header-bg: #292929; --checkbox-color: rgb(118, 120, 121); --checkbox-checked-color: var(--link-color); --img-bg: radial-gradient(circle, rgb(22, 22, 24) 0%, rgb(32, 32, 32) 100%); --shimmer-bg: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(58, 55, 55, 0.4) 50%,
    rgba(255, 255, 255, 0) 100%
  ); /* Sidebar */ --site-title-color: #717070; --site-subtitle-color: #868686; --sidebar-bg: #1e1e1e; --sidebar-border-color: #292929; --sidebar-muted-color: #868686; --sidebar-active-color: rgb(255, 255, 255, 0.95); --sidebar-hover-bg: #262626; --sidebar-btn-bg: #232328; --sidebar-btn-color: #787878; --avatar-border-color: rgb(206, 206, 206, 0.9); /* Topbar */ --topbar-bg: rgb(27, 27, 30, 0.64); --topbar-text-color: var(--text-color); --search-border-color: rgb(55, 55, 55); --search-icon-color: rgb(100, 102, 105); --input-focus-border-color: rgb(112, 114, 115); /* Home page */ --post-list-text-color: rgb(175, 176, 177); --btn-patinator-text-color: var(--text-color); --btn-paginator-hover-color: #2e2e2e; /* Posts */ --toc-highlight: rgb(116, 178, 243); --tag-hover: rgb(43, 56, 62); --tb-odd-bg: #252526; /* odd rows of the posts' table */ --tb-even-bg: rgb(31, 31, 34); /* even rows of the posts' table */ --tb-border-color: var(--tb-odd-bg); --footnote-target-bg: rgb(63, 81, 181); --btn-share-color: #6c757d; --btn-share-hover-color: #bfc1ca; --card-bg: #1e1e1e; --card-hovor-bg: #464d51; --card-shadow: rgb(21, 21, 21, 0.72) 0 6px 18px 0,
    rgb(137, 135, 135, 0.24) 0 0 0 1px; --kbd-wrap-color: #6a6a6a; --kbd-text-color: #d3d3d3; --kbd-bg-color: #242424; --prompt-text-color: rgb(216, 212, 212, 0.75); --prompt-tip-bg: rgb(22, 60, 36, 0.64); --prompt-tip-icon-color: rgb(15, 164, 15, 0.81); --prompt-info-bg: rgb(7, 59, 104, 0.8); --prompt-info-icon-color: #0075d1; --prompt-warning-bg: rgb(90, 69, 3, 0.88); --prompt-warning-icon-color: rgb(255, 165, 0, 0.8); --prompt-danger-bg: rgb(86, 28, 8, 0.8); --prompt-danger-icon-color: #cd0202; /* tags */ --tag-border: rgb(59, 79, 88); --tag-shadow: rgb(32, 33, 33); --dash-color: rgb(63, 65, 68); --search-tag-bg: #292828; /* categories */ --categories-border: rgb(64, 66, 69, 0.5); --categories-hover-bg: rgb(73, 75, 76); --categories-icon-hover-color: white; /* archives */ --timeline-node-bg: rgb(150, 152, 156); --timeline-color: rgb(63, 65, 68); --timeline-year-dot-color: var(--timeline-color); /* categories */ color-scheme: dark; /* stylelint-disable-next-line selector-id-pattern */ } html[data-mode='dark'] .light { display: none; } html[data-mode='dark'] .categories.card, html[data-mode='dark'] .list-group-item { background-color: var(--card-bg); } html[data-mode='dark'] .categories .card-header { background-color: var(--card-header-bg); } html[data-mode='dark'] .categories .list-group-item { border-left: none; border-right: none; padding-left: 2rem; border-color: var(--categories-border); } html[data-mode='dark'] .categories .list-group-item:last-child { border-bottom-color: var(--card-bg); } html[data-mode='dark'] #archives li:nth-child(odd) { background-image: linear-gradient(to left, #1a1a1e, #27272d, #27272d, #27272d, #1a1a1e); } html[data-mode='dark'] #disqus_thread { color-scheme: none; } }

@media (prefers-color-scheme: dark) { html:not([data-mode]), html[data-mode='dark'] { /* Framework color */ --main-bg: rgb(27, 27, 30); --mask-bg: rgb(68, 69, 70); --main-border-color: rgb(44, 45, 45); /* Common color */ --text-color: rgb(175, 176, 177); --text-muted-color: #868686; --text-muted-hightlight-color: #aeaeae; --heading-color: #cccccc; --label-color: #a7a7a7; --blockquote-border-color: rgb(66, 66, 66); --blockquote-text-color: #868686; --link-color: rgb(138, 180, 248); --link-underline-color: rgb(82, 108, 150); --button-bg: #1e1e1e; --btn-border-color: #2e2f31; --btn-backtotop-color: var(--text-color); --btn-backtotop-border-color: #212122; --btn-box-shadow: var(--main-bg); --card-header-bg: #292929; --checkbox-color: rgb(118, 120, 121); --checkbox-checked-color: var(--link-color); --img-bg: radial-gradient(circle, rgb(22, 22, 24) 0%, rgb(32, 32, 32) 100%); --shimmer-bg: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(58, 55, 55, 0.4) 50%,
    rgba(255, 255, 255, 0) 100%
  ); /* Sidebar */ --site-title-color: #717070; --site-subtitle-color: #868686; --sidebar-bg: #1e1e1e; --sidebar-border-color: #292929; --sidebar-muted-color: #868686; --sidebar-active-color: rgb(255, 255, 255, 0.95); --sidebar-hover-bg: #262626; --sidebar-btn-bg: #232328; --sidebar-btn-color: #787878; --avatar-border-color: rgb(206, 206, 206, 0.9); /* Topbar */ --topbar-bg: rgb(27, 27, 30, 0.64); --topbar-text-color: var(--text-color); --search-border-color: rgb(55, 55, 55); --search-icon-color: rgb(100, 102, 105); --input-focus-border-color: rgb(112, 114, 115); /* Home page */ --post-list-text-color: rgb(175, 176, 177); --btn-patinator-text-color: var(--text-color); --btn-paginator-hover-color: #2e2e2e; /* Posts */ --toc-highlight: rgb(116, 178, 243); --tag-hover: rgb(43, 56, 62); --tb-odd-bg: #252526; /* odd rows of the posts' table */ --tb-even-bg: rgb(31, 31, 34); /* even rows of the posts' table */ --tb-border-color: var(--tb-odd-bg); --footnote-target-bg: rgb(63, 81, 181); --btn-share-color: #6c757d; --btn-share-hover-color: #bfc1ca; --card-bg: #1e1e1e; --card-hovor-bg: #464d51; --card-shadow: rgb(21, 21, 21, 0.72) 0 6px 18px 0,
    rgb(137, 135, 135, 0.24) 0 0 0 1px; --kbd-wrap-color: #6a6a6a; --kbd-text-color: #d3d3d3; --kbd-bg-color: #242424; --prompt-text-color: rgb(216, 212, 212, 0.75); --prompt-tip-bg: rgb(22, 60, 36, 0.64); --prompt-tip-icon-color: rgb(15, 164, 15, 0.81); --prompt-info-bg: rgb(7, 59, 104, 0.8); --prompt-info-icon-color: #0075d1; --prompt-warning-bg: rgb(90, 69, 3, 0.88); --prompt-warning-icon-color: rgb(255, 165, 0, 0.8); --prompt-danger-bg: rgb(86, 28, 8, 0.8); --prompt-danger-icon-color: #cd0202; /* tags */ --tag-border: rgb(59, 79, 88); --tag-shadow: rgb(32, 33, 33); --dash-color: rgb(63, 65, 68); --search-tag-bg: #292828; /* categories */ --categories-border: rgb(64, 66, 69, 0.5); --categories-hover-bg: rgb(73, 75, 76); --categories-icon-hover-color: white; /* archives */ --timeline-node-bg: rgb(150, 152, 156); --timeline-color: rgb(63, 65, 68); --timeline-year-dot-color: var(--timeline-color); /* categories */ color-scheme: dark; /* stylelint-disable-next-line selector-id-pattern */ } html:not([data-mode]) .light, html[data-mode='dark'] .light { display: none; } html:not([data-mode]) .categories.card, html:not([data-mode]) .list-group-item, html[data-mode='dark'] .categories.card, html[data-mode='dark'] .list-group-item { background-color: var(--card-bg); } html:not([data-mode]) .categories .card-header, html[data-mode='dark'] .categories .card-header { background-color: var(--card-header-bg); } html:not([data-mode]) .categories .list-group-item, html[data-mode='dark'] .categories .list-group-item { border-left: none; border-right: none; padding-left: 2rem; border-color: var(--categories-border); } html:not([data-mode]) .categories .list-group-item:last-child, html[data-mode='dark'] .categories .list-group-item:last-child { border-bottom-color: var(--card-bg); } html:not([data-mode]) #archives li:nth-child(odd), html[data-mode='dark'] #archives li:nth-child(odd) { background-image: linear-gradient(to left, #1a1a1e, #27272d, #27272d, #27272d, #1a1a1e); } html:not([data-mode]) #disqus_thread, html[data-mode='dark'] #disqus_thread { color-scheme: none; } html[data-mode='light'] { /* Framework color */ --main-bg: white; --mask-bg: #c1c3c5; --main-border-color: #f3f3f3; /* Common color */ --text-color: #34343c; --text-muted-color: #757575; --text-muted-hightlight-color: inherit; --heading-color: #2a2a2a; --label-color: #585858; --blockquote-border-color: #eeeeee; --blockquote-text-color: #757575; --link-color: #0056b2; --link-underline-color: #dee2e6; --button-bg: #ffffff; --btn-border-color: #e9ecef; --btn-backtotop-color: #686868; --btn-backtotop-border-color: #f1f1f1; --btn-box-shadow: #eaeaea; --checkbox-color: #c5c5c5; --checkbox-checked-color: #07a8f7; --img-bg: radial-gradient(
    circle,
    rgb(255, 255, 255) 0%,
    rgb(239, 239, 239) 100%
  ); --shimmer-bg: linear-gradient(
    90deg,
    rgba(250, 250, 250, 0) 0%,
    rgba(232, 230, 230, 1) 50%,
    rgba(250, 250, 250, 0) 100%
  ); /* Sidebar */ --site-title-color: rgb(113, 113, 113); --site-subtitle-color: #717171; --sidebar-bg: #f6f8fa; --sidebar-border-color: #efefef; --sidebar-muted-color: #545454; --sidebar-active-color: #1d1d1d; --sidebar-hover-bg: rgb(223, 233, 241, 0.64); --sidebar-btn-bg: white; --sidebar-btn-color: #8e8e8e; --avatar-border-color: white; /* Topbar */ --topbar-bg: rgb(255, 255, 255, 0.7); --topbar-text-color: rgb(78, 78, 78); --search-border-color: rgb(240, 240, 240); --search-icon-color: #c2c6cc; --input-focus-border-color: #b8b8b8; /* Home page */ --post-list-text-color: dimgray; --btn-patinator-text-color: #555555; --btn-paginator-hover-color: var(--sidebar-bg); /* Posts */ --toc-highlight: #0550ae; --btn-share-color: gray; --btn-share-hover-color: #0d6efd; --card-bg: white; --card-hovor-bg: #e2e2e2; --card-shadow: rgb(104, 104, 104, 0.05) 0 2px 6px 0,
    rgba(211, 209, 209, 0.15) 0 0 0 1px; --footnote-target-bg: lightcyan; --tb-odd-bg: #fbfcfd; --tb-border-color: #eaeaea; --dash-color: silver; --kbd-wrap-color: #bdbdbd; --kbd-text-color: var(--text-color); --kbd-bg-color: white; --prompt-text-color: rgb(46, 46, 46, 0.77); --prompt-tip-bg: rgb(123, 247, 144, 0.2); --prompt-tip-icon-color: #03b303; --prompt-info-bg: #e1f5fe; --prompt-info-icon-color: #0070cb; --prompt-warning-bg: rgb(255, 243, 205); --prompt-warning-icon-color: #ef9c03; --prompt-danger-bg: rgb(248, 215, 218, 0.56); --prompt-danger-icon-color: #df3c30; /* Tags */ --tag-border: #dee2e6; --tag-shadow: var(--btn-border-color); --tag-hover: rgb(222, 226, 230); --search-tag-bg: #f8f9fa; /* Categories */ --categories-border: rgba(0, 0, 0, 0.125); --categories-hover-bg: var(--btn-border-color); --categories-icon-hover-color: darkslategray; /* Archive */ --timeline-color: rgba(0, 0, 0, 0.075); --timeline-node-bg: #c2c6cc; --timeline-year-dot-color: #ffffff; } html[data-mode='light'] [class^='prompt-'] { --link-underline-color: rgb(219, 216, 216); } html[data-mode='light'] .dark { display: none; } }

body { background: var(--main-bg); padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); color: var(--text-color); -webkit-font-smoothing: antialiased; font-family: "Source Sans Pro", "Microsoft Yahei", sans-serif; }

/* --- Typography --- */
h1 { font-size: 1.92rem; }

h2 { font-size: 1.54rem; }

h3 { font-size: 1.36rem; }

h4 { font-size: 1.18rem; }

h5 { font-size: 1rem; }

a { text-decoration: none; }

img { max-width: 100%; height: auto; transition: all 0.35s ease-in-out; }

.blur img { -webkit-filter: blur(20px); filter: blur(20px); }

blockquote { border-left: 5px solid var(--blockquote-border-color); padding-left: 1rem; color: var(--blockquote-text-color); }

blockquote > p:last-child { margin-bottom: 0; }

blockquote[class^='prompt-'] { border-left: 0; position: relative; padding: 1rem 1rem 1rem 3rem; color: var(--prompt-text-color); }

blockquote[class^='prompt-']::before { text-align: center; width: 3rem; position: absolute; left: 0.25rem; margin-top: 0.4rem; text-rendering: auto; -webkit-font-smoothing: antialiased; }

blockquote.prompt-tip { background-color: var(--prompt-tip-bg); }

blockquote.prompt-tip::before { content: ""; color: var(--prompt-tip-icon-color); font: var(--fa-font-regular); }

blockquote.prompt-info { background-color: var(--prompt-info-bg); }

blockquote.prompt-info::before { content: ""; color: var(--prompt-info-icon-color); font: var(--fa-font-solid); }

blockquote.prompt-warning { background-color: var(--prompt-warning-bg); }

blockquote.prompt-warning::before { content: ""; color: var(--prompt-warning-icon-color); font: var(--fa-font-solid); }

blockquote.prompt-danger { background-color: var(--prompt-danger-bg); }

blockquote.prompt-danger::before { content: ""; color: var(--prompt-danger-icon-color); font: var(--fa-font-solid); }

kbd { font-family: inherit; display: inline-block; vertical-align: middle; line-height: 1.3rem; min-width: 1.75rem; text-align: center; margin: 0 0.3rem; padding-top: 0.1rem; color: var(--kbd-text-color); background-color: var(--kbd-bg-color); border-radius: 0.25rem; border: solid 1px var(--kbd-wrap-color); box-shadow: inset 0 -2px 0 var(--kbd-wrap-color); }

hr { border-color: var(--main-border-color); opacity: 1; }

footer { background-color: var(--main-bg); height: 5rem; border-top: 1px solid var(--main-border-color); }

footer p { text-align: center; margin-bottom: 0; }

/* fontawesome icons */
/* --- Panels --- */
.access { top: 2rem; transition: top 0.2s ease-in-out; margin-top: 3rem; margin-bottom: 4rem; }

.access:only-child { position: -webkit-sticky; position: sticky; }

.access > section { padding-left: 1rem; border-left: 1px solid var(--main-border-color); }

.access > section:not(:last-child) { margin-bottom: 4rem; }

.access .content { font-size: 0.9rem; }

#panel-wrapper { /* the headings */ }

#panel-wrapper .panel-heading { font-family: inherit; line-height: inherit; color: var(--label-color); font-size: inherit; font-weight: 600; }

#panel-wrapper .post-tag { line-height: 1.05rem; font-size: 0.85rem; border-radius: 0.8rem; padding: 0.3rem 0.5rem; margin: 0 0.35rem 0.5rem 0; }

#panel-wrapper .post-tag:hover { transition: all 0.3s ease-in; }

#access-lastmod a { color: inherit; }

.footnotes > ol { padding-left: 2rem; margin-top: 0.5rem; }

.footnotes > ol > li:not(:last-child) { margin-bottom: 0.3rem; }

.footnotes > ol > li > p { margin-left: 0.25em; margin-top: 0; margin-bottom: 0; }

a.footnote { margin-left: 1px; margin-right: 1px; padding-left: 2px; padding-right: 2px; border-bottom-style: none !important; }

a.reversefootnote { font-size: 0.6rem; line-height: 1; position: relative; bottom: 0.25em; margin-left: 0.25em; border-bottom-style: none !important; }

/* --- Begin of Markdown table style --- */
/* it will be created by Liquid */
.table-wrapper { overflow-x: auto; margin-bottom: 1.5rem; /* table */ }

.table-wrapper > table { min-width: 100%; overflow-x: auto; border-spacing: 0; /* tbody */ }

.table-wrapper > table thead { border-bottom: solid 2px rgba(210, 215, 217, 0.75); }

.table-wrapper > table tbody tr { border-bottom: 1px solid var(--tb-border-color); }

.table-wrapper > table tbody tr:nth-child(2n) { background-color: var(--tb-even-bg); }

.table-wrapper > table tbody tr:nth-child(2n + 1) { background-color: var(--tb-odd-bg); }

/* --- post --- */
.preview-img { aspect-ratio: 40 / 21; width: 100%; height: 100%; overflow: hidden; }

.preview-img:not(.no-bg) { background: var(--img-bg); }

.preview-img img { height: 100%; -o-object-fit: cover; object-fit: cover; }

#post-list .preview-img img { width: 100%; }

.post-preview { border: 0; background: var(--card-bg); box-shadow: var(--card-shadow); }

.post-preview::before { content: ''; width: 100%; height: 100%; position: absolute; background-color: var(--card-hovor-bg); opacity: 0; transition: opacity 0.35s ease-in-out; }

.post-preview:hover::before { opacity: 0.3; }

main { line-height: 1.75; }

main h1 { margin-top: 2rem; }

main p > a.popup:not(.normal):not(.left):not(.right) { position: relative; left: 50%; transform: translateX(-50%); }

.content { font-size: 1.08rem; margin-top: 2rem; overflow-wrap: break-word; /* ul */ }

.content a.popup { margin-top: 0.5rem; margin-bottom: 0.5rem; cursor: zoom-in; }

.content ol:not([class]), .content ol.task-list, .content ul:not([class]), .content ul.task-list { -webkit-padding-start: 1.75rem; padding-inline-start: 1.75rem; }

.content ol:not([class]) li, .content ol.task-list li, .content ul:not([class]) li, .content ul.task-list li { margin: 0.25rem 0; padding-left: 0.25rem; }

.content ol:not([class]) ol, .content ol:not([class]) ul, .content ol.task-list ol, .content ol.task-list ul, .content ul:not([class]) ol, .content ul:not([class]) ul, .content ul.task-list ol, .content ul.task-list ul { -webkit-padding-start: 1.25rem; padding-inline-start: 1.25rem; margin: 0.5rem 0; }

.content ul.task-list { -webkit-padding-start: 1.25rem; padding-inline-start: 1.25rem; }

.content ul.task-list li { list-style-type: none; padding-left: 0; /* checkbox icon */ }

.content ul.task-list li > i { width: 2rem; margin-left: -1.25rem; color: var(--checkbox-color); }

.content ul.task-list li > i.checked { color: var(--checkbox-checked-color); }

.content ul.task-list li ul { -webkit-padding-start: 1.75rem; padding-inline-start: 1.75rem; }

.content ul.task-list input[type='checkbox'] { margin: 0 0.5rem 0.2rem -1.3rem; vertical-align: middle; }

.content dl > dd { margin-left: 1rem; }

.content ::marker { color: var(--text-muted-color); }

/* .content */
.post-tag { display: inline-block; min-width: 2rem; text-align: center; border-radius: 0.5rem; border: 1px solid var(--btn-border-color); padding: 0 0.4rem; color: var(--text-muted-color); line-height: 1.3rem; }

.post-tag:not(:last-child) { margin-right: 0.2rem; }

.rounded-10 { border-radius: 10px !important; }

.img-link { color: transparent; display: inline-flex; }

.shimmer { overflow: hidden; position: relative; background: var(--img-bg); }

.shimmer::before { content: ''; position: absolute; background: var(--shimmer-bg); height: 100%; width: 100%; -webkit-animation: shimmer 1.3s infinite; animation: shimmer 1.3s infinite; }

@-webkit-keyframes shimmer { 0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); } }

@keyframes shimmer { 0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); } }

.embed-video { width: 100%; height: 100%; margin-bottom: 1rem; aspect-ratio: 16 / 9; }

.embed-video.twitch { aspect-ratio: 310 / 189; }

.embed-video.file { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; margin: auto; margin-bottom: 0; }

.embed-audio { width: 100%; display: block; }

/* --- buttons --- */
.btn-lang { border: 1px solid !important; padding: 1px 3px; border-radius: 3px; color: var(--link-color); }

.btn-lang:focus { box-shadow: none; }

/* --- Effects classes --- */
.flex-grow-1 { flex-grow: 1 !important; }

.btn-box-shadow { box-shadow: var(--card-shadow); }

/* overwrite bootstrap muted */
.text-muted { color: var(--text-muted-color) !important; }

/* Overwrite bootstrap tooltip */
.tooltip-inner { font-size: 0.7rem; max-width: 220px; text-align: left; }

/* Overwrite bootstrap outline button */
.btn.btn-outline-primary:not(.disabled):hover { border-color: #007bff !important; }

.disabled { color: #cec4c4; pointer-events: auto; cursor: not-allowed; }

.hide-border-bottom { border-bottom: none !important; }

.input-focus { box-shadow: none; border-color: var(--input-focus-border-color) !important; background: center !important; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out; }

.left { float: left; margin: 0.75rem 1rem 1rem 0; }

.right { float: right; margin: 0.75rem 0 1rem 1rem; }

/* --- Overriding --- */
/* mermaid */
.mermaid { text-align: center; }

/* MathJax */
mjx-container { overflow-y: hidden; min-width: auto !important; }

/* --- sidebar layout --- */
#sidebar { padding-left: 0; padding-right: 0; position: fixed; top: 0; left: 0; height: 100%; overflow-y: auto; width: 260px; z-index: 99; background: var(--sidebar-bg); border-right: 1px solid var(--sidebar-border-color); /* Hide scrollbar for Chrome, Safari and Opera */ /* Hide scrollbar for IE, Edge and Firefox */ -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ /* .sidebar-bottom */ }

#sidebar::-webkit-scrollbar { display: none; }

#sidebar .sidebar-bottom #mode-toggle:hover, #sidebar .sidebar-bottom a:hover, #sidebar .site-title a:hover { color: var(--sidebar-active-color); }

#sidebar #avatar { display: block; width: 7rem; height: 7rem; overflow: hidden; box-shadow: var(--avatar-border-color) 0 0 0 2px; transform: translateZ(0); /* fixed the zoom in Safari */ }

#sidebar #avatar img { transition: transform 0.5s; }

#sidebar #avatar img:hover { transform: scale(1.2); }

#sidebar .profile-wrapper { margin-top: 2.5rem; margin-bottom: 2.5rem; padding-left: 2.5rem; padding-right: 1.25rem; width: 100%; }

#sidebar .site-title { font-family: inherit; font-weight: 900; font-size: 1.75rem; line-height: 1.2; letter-spacing: 0.25px; margin-top: 1.25rem; margin-bottom: 0.5rem; }

#sidebar .site-title a { color: var(--site-title-color); }

#sidebar .site-subtitle { font-size: 95%; color: var(--site-subtitle-color); margin-top: 0.25rem; word-spacing: 1px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

#sidebar ul { margin-bottom: 2rem; }

#sidebar ul li.nav-item { opacity: 0.9; width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; }

#sidebar ul li.nav-item a.nav-link { padding-top: 0.6rem; padding-bottom: 0.6rem; display: flex; align-items: center; border-radius: 0.75rem; font-weight: 600; }

#sidebar ul li.nav-item a.nav-link:hover { background-color: var(--sidebar-hover-bg); }

#sidebar ul li.nav-item a.nav-link i { font-size: 95%; opacity: 0.8; margin-right: 1.5rem; }

#sidebar ul li.nav-item a.nav-link span { font-size: 90%; letter-spacing: 0.2px; }

#sidebar ul li.nav-item.active .nav-link { color: var(--sidebar-active-color); background-color: var(--sidebar-hover-bg); }

#sidebar ul li.nav-item.active .nav-link span { opacity: 1; }

#sidebar ul li.nav-item:not(:first-child) { margin-top: 0.25rem; }

#sidebar .sidebar-bottom { padding-left: 2rem; padding-right: 1rem; margin-bottom: 1.5rem; }

#sidebar .sidebar-bottom #mode-toggle, #sidebar .sidebar-bottom a { width: 1.75rem; height: 1.75rem; margin-bottom: 0.5rem; border-radius: 50%; color: var(--sidebar-btn-color); background-color: var(--sidebar-btn-bg); text-align: center; display: flex; align-items: center; justify-content: center; }

#sidebar .sidebar-bottom #mode-toggle:not(:focus-visible), #sidebar .sidebar-bottom a:not(:focus-visible) { box-shadow: var(--sidebar-border-color) 0 0 0 1px; }

#sidebar .sidebar-bottom #mode-toggle:hover, #sidebar .sidebar-bottom a:hover { background-color: var(--sidebar-hover-bg); }

#sidebar .sidebar-bottom a:not(:last-child) { margin-right: 0.8rem; }

#sidebar .sidebar-bottom i { line-height: 1.75rem; }

#sidebar .sidebar-bottom .icon-border { margin-left: calc(($sb-btn-gap - $btn-border-width) / 2); margin-right: calc(($sb-btn-gap - $btn-border-width) / 2); background-color: var(--sidebar-btn-color); content: ''; width: 3px; height: 3px; border-radius: 50%; margin-bottom: 0.5rem; }

/* #sidebar */
@media (hover: hover) { #sidebar ul > li:last-child::after { transition: top 0.5s ease; } .nav-link { transition: background-color 0.3s ease-in-out; } .post-preview { transition: background-color 0.35s ease-in-out; } }

#search-result-wrapper { display: none; height: 100%; width: 100%; overflow: auto; }

#search-result-wrapper .content { margin-top: 2rem; }

/* --- top-bar --- */
#topbar-wrapper { height: 3rem; background-color: var(--topbar-bg); }

#topbar button i { color: #999999; }

#topbar #breadcrumb { font-size: 1rem; color: var(--text-muted-color); padding-left: 0.5rem; }

#topbar #breadcrumb span:not(:last-child)::after { content: '›'; padding: 0 0.3rem; }

/* #topbar */
::-webkit-input-placeholder { color: var(--text-muted-color) !important; }

::-moz-placeholder { color: var(--text-muted-color) !important; }

:-ms-input-placeholder { color: var(--text-muted-color) !important; }

::-ms-input-placeholder { color: var(--text-muted-color) !important; }

::placeholder { color: var(--text-muted-color) !important; }

:focus::-webkit-input-placeholder { opacity: 0.6; }

:focus::-moz-placeholder { opacity: 0.6; }

:focus:-ms-input-placeholder { opacity: 0.6; }

:focus::-ms-input-placeholder { opacity: 0.6; }

:focus::placeholder { opacity: 0.6; }

search { display: flex; width: 100%; border-radius: 1rem; border: 1px solid var(--search-border-color); background: var(--main-bg); padding: 0 0.5rem; }

search i { z-index: 2; font-size: 0.9rem; color: var(--search-icon-color); }

#sidebar-trigger, #search-trigger { display: none; }

/* 'Cancel' link */
#search-cancel { color: var(--link-color); display: none; white-space: nowrap; }

#search-input { background: center; border: 0; border-radius: 0; padding: 0.18rem 0.3rem; color: var(--text-color); height: auto; }

#search-input:focus { box-shadow: none; }

#search-hints { padding: 0 1rem; }

#search-hints h4 { margin-bottom: 1.5rem; }

#search-hints .post-tag { display: inline-block; line-height: 1rem; font-size: 1rem; background: var(--search-tag-bg); border: none; padding: 0.5rem; margin: 0 1.25rem 1rem 0; }

#search-hints .post-tag::before { content: '#'; color: var(--text-muted-color); padding-right: 0.2rem; }

#search-results { padding-bottom: 3rem; }

#search-results a { font-size: 1.4rem; line-height: 2.5rem; }

#search-results > article { width: 100%; /* icons */ }

#search-results > article:not(:last-child) { margin-bottom: 1rem; }

#search-results > article i { color: #818182; margin-right: 0.15rem; font-size: 80%; }

#search-results > article > p { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

/* #search-results */
#topbar-title { display: none; font-size: 1.1rem; font-weight: 600; font-family: sans-serif; color: var(--topbar-text-color); text-align: center; width: 70%; overflow: hidden; text-overflow: ellipsis; word-break: keep-all; white-space: nowrap; }

#mask { display: none; position: fixed; inset: 0 0 0 0; height: 100%; width: 100%; z-index: 1; }

[sidebar-display] #mask { display: block !important; }

/* --- basic wrappers --- */
#main-wrapper { position: relative; padding-left: 0; padding-right: 0; }

#main-wrapper > .container { min-height: 100vh; }

#topbar-wrapper.row, #main-wrapper > .container > .row, #search-result-wrapper > .row { margin-left: 0; margin-right: 0; }

#tail-wrapper > :not(script) { margin-top: 3rem; }

/* --- button back-to-top --- */
#back-to-top { visibility: hidden; opacity: 0; z-index: 1; cursor: pointer; position: fixed; right: 1rem; bottom: calc($footer-height-large - $back2top-size / 2); background: var(--button-bg); color: var(--btn-backtotop-color); padding: 0; width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid var(--btn-backtotop-border-color); transition: opacity 0.5s ease-in-out, transform 0.2s ease-out; }

#back-to-top:hover { transform: translate3d(0, -5px, 0); -webkit-transform: translate3d(0, -5px, 0); }

#back-to-top i { line-height: 2.75rem; position: relative; bottom: 2px; }

#back-to-top.show { opacity: 1; visibility: visible; }

@-webkit-keyframes popup { from { opacity: 0;
    bottom: 0; } }

@keyframes popup { from { opacity: 0;
    bottom: 0; } }

#notification .toast-header { background: none; border-bottom: none; color: inherit; }

#notification .toast-body { font-family: Lato, sans-serif; line-height: 1.25rem; }

#notification .toast-body button { font-size: 90%; min-width: 4rem; }

#notification.toast.show { display: block; min-width: 20rem; border-radius: 0.5rem; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); background-color: rgba(255, 255, 255, 0.5); color: #1b1b1eba; position: fixed; left: 50%; bottom: 20%; transform: translateX(-50%); -webkit-animation: popup 0.8s; animation: popup 0.8s; }

/*
  Responsive Design:

 {sidebar, content, panel} >= 1200px screen width
 {sidebar, content} >= 850px screen width
 {content} <= 849px screen width

*/
@media all and (max-width: 576px) { main .content > blockquote[class^='prompt-'] { margin-left: -1rem; margin-right: -1rem; border-radius: 0; max-width: none; } #avatar { width: 5rem; height: 5rem; } }

@media all and (max-width: 768px) { #main-wrapper > .container, #topbar { max-width: 100%; } #main-wrapper > .container { padding-left: 0; padding-right: 0; } }

/* hide sidebar and panel */
@media all and (max-width: 849px) { footer { transition: transform 0.4s ease; height: 6rem; padding: 1.5rem 0; } [sidebar-display] #sidebar { transform: translateX(0); } [sidebar-display] #main-wrapper { transform: translateX(260px); } [sidebar-display] #back-to-top { visibility: hidden; } #sidebar { transition: transform 0.4s ease; transform: translateX(-260px); /* hide */ -webkit-transform: translateX(-260px); } #main-wrapper { transition: transform 0.4s ease; } #topbar, #main-wrapper > .container { max-width: 100%; } #search-result-wrapper { width: 100%; } #breadcrumb, search { display: none; } #topbar-wrapper { transition: transform 0.4s ease, top 0.2s ease; left: 0; } main, #panel-wrapper { margin-top: 0; } #topbar-title, #sidebar-trigger, #search-trigger { display: block; } #search-result-wrapper .content { letter-spacing: 0; } #tags { justify-content: center !important; } h1.dynamic-title { display: none; } h1.dynamic-title ~ .content { margin-top: 2.5rem; } }

/* max-width: 849px */
/* Sidebar is visible */
@media all and (min-width: 850px) { /* Solved jumping scrollbar */ html { overflow-y: scroll; } #main-wrapper { margin-left: 260px; } #sidebar .profile-wrapper { margin-top: 3rem; } #search-hints { display: none; } search { max-width: 200px; } #search-result-wrapper { max-width: 1250px; justify-content: start !important; } main h1 { margin-top: 3rem; } div.content .table-wrapper > table { min-width: 70%; } /* button 'back-to-Top' position */ #back-to-top { right: 5%; bottom: calc($footer-height - $back2top-size / 2); } #topbar-title { text-align: left; } }

/* Pad horizontal */
@media all and (min-width: 992px) and (max-width: 1199px) { #main-wrapper > .container .col-lg-11 { flex: 0 0 96%; max-width: 96%; } }

/* Compact icons in sidebar & panel hidden */
@media all and (min-width: 850px) and (max-width: 1199px) { #search-results > div { max-width: 700px; } #breadcrumb { width: 65%; overflow: hidden; text-overflow: ellipsis; word-break: keep-all; white-space: nowrap; } }

/* panel hidden */
@media all and (max-width: 1199px) { #panel-wrapper { display: none; } #main-wrapper > .container > div.row { justify-content: center !important; } }

/* --- desktop mode, both sidebar and panel are visible --- */
@media all and (min-width: 1200px) { search { margin-right: 4rem; } #search-input { transition: all 0.3s ease-in-out; } #search-results > article { width: 45%; } #search-results > article:nth-child(odd) { margin-right: 1.5rem; } #search-results > article:nth-child(even) { margin-left: 1.5rem; } #search-results > article:last-child:nth-child(odd) { position: relative; right: 24.3%; } .content { font-size: 1.03rem; } }

@media all and (min-width: 1400px) { #back-to-top { right: calc((100vw - $sidebar-width - 1140px) / 2 + 3rem); } }

@media all and (min-width: 1650px) { #main-wrapper { margin-left: 300px; } #topbar-wrapper { left: 300px; } search { margin-right: calc( $main-content-max-width / 4 - $search-max-width - 0.75rem); } #main-wrapper > .container { max-width: 1250px; padding-left: 1.75rem !important; padding-right: 1.75rem !important; } main.col-12, #tail-wrapper { padding-right: 4.5rem !important; } #back-to-top { right: calc( (100vw - $sidebar-width-large - $main-content-max-width) / 2 + 2rem); } #sidebar { width: 300px; } #sidebar .profile-wrapper { margin-top: 3.5rem; margin-bottom: 2.5rem; padding-left: 3.5rem; } #sidebar ul li.nav-item { padding-left: 2.75rem; padding-right: 2.75rem; } #sidebar .sidebar-bottom { padding-left: 2.75rem; margin-bottom: 1.75rem; } #sidebar .sidebar-bottom a:not(:last-child) { margin-right: 1rem; } #sidebar .sidebar-bottom .icon-border { margin-left: calc(($sb-btn-gap-lg - $btn-border-width) / 2); margin-right: calc(($sb-btn-gap-lg - $btn-border-width) / 2); } }

/* min-width: 1650px */
/* Style for Homepage */
#post-list { margin-top: 2rem; }

#post-list .card-wrapper:hover { text-decoration: none; }

#post-list .card-wrapper:not(:last-child) { margin-bottom: 1.25rem; }

#post-list .card { border: 0; background: none; }

#post-list .card .preview-img img, #post-list .card .preview-img { border-radius: 0.625rem 0.625rem 0 0; }

#post-list .card .card-body { height: 100%; padding: 1rem; }

#post-list .card .card-body .card-title { color: var(--heading-color) !important; font-size: 1.25rem; }

#post-list .card .card-body .post-meta, #post-list .card .card-body .card-text.content { color: var(--text-muted-color) !important; }

#post-list .card .card-body .card-text.content p { line-height: 1.5; margin: 0; }

#post-list .card .card-body .post-meta i:not(:first-child) { margin-left: 1.5rem; }

#post-list .card .card-body .post-meta em { color: inherit; }

#post-list .card .card-body .post-meta > div:first-child { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* #post-list */
.pagination { color: var(--text-color); font-family: Lato, sans-serif; justify-content: space-evenly; /* .page-item */ }

.pagination a:hover { text-decoration: none; }

.pagination .page-item .page-link { color: var(--btn-patinator-text-color); padding: 0 0.6rem; display: -webkit-box; -webkit-box-pack: center; -webkit-box-align: center; border-radius: 0.5rem; border: 0; background-color: inherit; }

.pagination .page-item.active .page-link { background-color: var(--btn-paginator-hover-color); }

.pagination .page-item:not(.active) .page-link:hover { box-shadow: inset var(--btn-border-color) 0 0 0 1px; }

.pagination .page-item.disabled { cursor: not-allowed; }

.pagination .page-item.disabled .page-link { color: rgba(108, 117, 125, 0.57); }

/* .pagination */
/* Tablet */
@media all and (min-width: 768px) { #post-list .card .preview-img, #post-list .card .preview-img img { border-radius: 0 0.625rem 0.625rem 0; } #post-list .card .card-body { padding: 1.75rem 1.75rem 1.25rem 1.75rem; } #post-list .card .card-body .card-text { display: inherit !important; } #post-list .card .card-body .post-meta i:not(:first-child) { margin-left: 1.75rem; } }

/* Hide SideBar and TOC */
@media all and (max-width: 830px) { .pagination .page-item:not(:first-child):not(:last-child) { display: none; } }

/* Sidebar is visible */
@media all and (min-width: 831px) { #post-list { margin-top: 2.5rem; } .pagination { font-size: 0.85rem; justify-content: center; } .pagination .page-item:not(:last-child) { margin-right: 0.7rem; } .pagination .page-index { display: none; } /* .pagination */ }

/* Post-specific style */
.post-navigation .btn.disabled, .post-navigation .btn { width: 50%; position: relative; border-color: var(--btn-border-color); }

header .post-desc { font-size: 1.125rem; line-height: 1.6; }

header .post-meta span + span::before { content: '\2022'; padding-left: 0.25rem; padding-right: 0.25rem; }

header .post-meta em a { color: inherit; }

header h1 + .post-meta { margin-top: 1.5rem; }

.post-tail-wrapper { margin-top: 6rem; border-bottom: 1px double var(--main-border-color); /* .license-wrapper */ /* .share-wrapper */ }

.post-tail-wrapper .license-wrapper { line-height: 1.2rem; }

.post-tail-wrapper .share-wrapper { vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; /* .share-icons */ }

.post-tail-wrapper .share-wrapper .share-icons > *, .post-tail-wrapper .share-wrapper .share-icons i { font-size: 1.125rem; }

.post-tail-wrapper .share-wrapper .share-icons { display: flex; }

.post-tail-wrapper .share-wrapper .share-icons i { color: var(--btn-share-color); }

.post-tail-wrapper .share-wrapper .share-icons > * { margin-left: 0.5rem; }

.post-tail-wrapper .share-wrapper .share-icons button { padding: 0; border: none; line-height: inherit; }

.share-mastodon { /* See: https://github.com/justinribeiro/share-to-mastodon#properties */ --wc-stm-font-family: $font-family-base; --wc-stm-dialog-background-color: var(--card-bg); --wc-stm-form-button-border: 1px solid var(--btn-border-color); --wc-stm-form-submit-background-color: var(--sidebar-btn-bg); --wc-stm-form-cancel-background-color: var(--sidebar-btn-bg); --wc-stm-form-button-background-color-hover: #007bff; --wc-stm-form-button-color-hover: white; font-size: 1rem; }

.post-tags { line-height: 2rem; }

.post-navigation .btn:not(:hover) { color: var(--link-color); }

.post-navigation .btn:hover:not(.disabled)::before { color: whitesmoke; }

.post-navigation .btn.disabled { pointer-events: auto; cursor: not-allowed; background: none; color: gray; }

.post-navigation .btn.btn-outline-primary.disabled:focus { box-shadow: none; }

.post-navigation .btn::before { color: var(--text-muted-color); font-size: 0.65rem; text-transform: uppercase; content: attr(aria-label); }

.post-navigation .btn:first-child { border-radius: 0.625rem 0 0 0.625rem; left: 0.5px; }

.post-navigation .btn:last-child { border-radius: 0 0.625rem 0.625rem 0; right: 0.5px; }

.post-navigation p { font-size: 1.1rem; line-height: 1.5rem; margin-top: 0.3rem; white-space: normal; }

/* .post-navigation */
@media (hover: hover) { .post-navigation .btn, .post-navigation .btn::before { transition: all 0.35s ease-in-out; } }

@-webkit-keyframes fade-up { from { opacity: 0;
    position: relative;
    top: 2rem; }
  to { opacity: 1;
    position: relative;
    top: 0; } }

@keyframes fade-up { from { opacity: 0;
    position: relative;
    top: 2rem; }
  to { opacity: 1;
    position: relative;
    top: 0; } }

#toc-wrapper { border-left: 1px solid rgba(158, 158, 158, 0.17); position: -webkit-sticky; position: sticky; top: 4rem; transition: top 0.2s ease-in-out; -webkit-animation: fade-up 0.8s; animation: fade-up 0.8s; }

#toc-wrapper ul { list-style: none; font-size: 0.85rem; line-height: 1.25; padding-left: 0; /* Overwrite TOC plugin style */ }

#toc-wrapper ul li:not(:last-child) { margin: 0.4rem 0; }

#toc-wrapper ul li a { padding: 0.2rem 0 0.2rem 1.25rem; }

#toc-wrapper ul .toc-link { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

#toc-wrapper ul .toc-link:hover { color: var(--toc-highlight); text-decoration: none; }

#toc-wrapper ul .toc-link::before { display: none; }

#toc-wrapper ul .is-active-link { color: var(--toc-highlight) !important; font-weight: 600; }

#toc-wrapper ul .is-active-link::before { display: inline-block; width: 1px; left: -1px; height: 1.25rem; background-color: var(--toc-highlight) !important; }

#toc-wrapper ul ul { padding-left: 0.75rem; }

/* --- Related Posts --- */
#related-posts > h3 { color: var(--label-color); font-size: 1.1rem; font-weight: 600; }

#related-posts time { color: var(--text-muted-color); }

#related-posts p { font-size: 0.9rem; margin-bottom: 0.5rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

/* stylelint-disable-next-line selector-id-pattern */
#disqus_thread { min-height: 8.5rem; }

.utterances { max-width: 100%; }

.post-tail-wrapper .share-wrapper .share-icons > *:hover i { color: var(--btn-share-hover-color) !important; }

.share-label { color: inherit; font-size: inherit; font-weight: 400; }

.share-label::after { content: ':'; }

@media all and (max-width: 576px) { .post-tail-bottom { flex-wrap: wrap-reverse !important; } .post-tail-bottom > div:first-child { width: 100%; margin-top: 1rem; } }

@media all and (max-width: 768px) { .content > p > img { max-width: calc(100% + 1rem); } }

/* Hide SideBar and TOC */
@media all and (max-width: 849px) { .post-navigation { padding-left: 0; padding-right: 0; margin-left: -0.5rem; margin-right: -0.5rem; } }

/* Styles for Tab Tags */
.tag { border-radius: 0.7em; padding: 6px 8px 7px; margin-right: 0.8rem; line-height: 3rem; letter-spacing: 0; border: 1px solid var(--tag-border) !important; box-shadow: 0 0 3px 0 var(--tag-shadow); }

.tag span { margin-left: 0.6em; font-size: 0.7em; font-family: Oswald, sans-serif; }

/* Style for Archives */
#archives { letter-spacing: 0.03rem; /* #archives ul */ }

#archives ul li::before, #archives .year:first-child::before, #archives .year::before { content: ''; width: 4px; position: relative; float: left; background-color: var(--timeline-color); }

#archives .year { height: 3.5rem; font-size: 1.5rem; position: relative; left: 2px; margin-left: -4px; /* Year dot */ }

#archives .year::before { height: 72px; left: 79px; bottom: 16px; }

#archives .year:first-child::before { height: 32px; top: 24px; }

#archives .year::after { content: ''; display: inline-block; position: relative; border-radius: 50%; width: 12px; height: 12px; left: 21.5px; border: 3px solid; background-color: var(--timeline-year-dot-color); border-color: var(--timeline-node-bg); box-shadow: 0 0 2px 0 #c2c6cc; z-index: 1; }

#archives ul li { font-size: 1.1rem; line-height: 3rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

#archives ul li:nth-child(odd) { background-color: var(--main-bg, #ffffff); background-image: linear-gradient(to left, #ffffff, #fbfbfb, #fbfbfb, #fbfbfb, #ffffff); }

#archives ul li::before { top: 0; left: 77px; height: 3.1rem; }

#archives ul:last-child li:last-child::before { height: 1.5rem; }

#archives .date { white-space: nowrap; display: inline-block; position: relative; right: 0.5rem; }

#archives .date.month { width: 1.4rem; text-align: center; }

#archives .date.day { font-size: 85%; font-family: Lato, sans-serif; }

#archives a { /* post title in Archvies */ margin-left: 2.5rem; position: relative; top: 0.1rem; }

#archives a:hover { border-bottom: none; }

#archives a::before { /* the dot before post title */ content: ''; display: inline-block; position: relative; border-radius: 50%; width: 8px; height: 8px; float: left; top: 1.35rem; left: 71px; background-color: var(--timeline-node-bg); box-shadow: 0 0 3px 0 #c2c6cc; z-index: 1; }

/* #archives */
@media all and (max-width: 576px) { #archives { margin-top: -1rem; } #archives ul { letter-spacing: 0; } }

/* Style for Tab Categories */
.categories i { color: gray; }

.categories { margin-bottom: 2rem; border-color: var(--categories-border); }

.categories .card-header { padding: 0.75rem; border-radius: calc($base-radius - 1px); border-bottom: 0; }

.categories .card-header.hide-border-bottom { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }

.categories i { font-size: 86%; /* fontawesome icons */ }

.categories .list-group-item { border-left: none; border-right: none; padding-left: 2rem; }

.categories .list-group-item:first-child { border-top-left-radius: 0; border-top-right-radius: 0; }

.categories .list-group-item:last-child { border-bottom: 0; }

/* .categories */
.category-trigger { width: 1.7rem; height: 1.7rem; border-radius: 50%; text-align: center; color: #6c757d !important; }

.category-trigger i { position: relative; height: 0.7rem; width: 1rem; transition: transform 300ms ease; }

.category-trigger:hover i { color: var(--categories-icon-hover-color); }

/* only works on desktop */
@media (hover: hover) { .category-trigger:hover { background-color: var(--categories-hover-bg); } }

.rotate { transform: rotate(-90deg); }

/* Style for page Category and Tag */
.dash { margin: 0 0.5rem 0.6rem 0.5rem; border-bottom: 2px dotted var(--dash-color); }

#page-category ul > li, #page-tag ul > li { line-height: 1.5rem; padding: 0.6rem 0; /* dot */ /* post's title */ }

#page-category ul > li::before, #page-tag ul > li::before { background: #999999; width: 5px; height: 5px; border-radius: 50%; display: block; content: ''; position: relative; top: 0.6rem; margin-right: 0.5rem; }

#page-category ul > li > a, #page-tag ul > li > a { font-size: 1.1rem; }

/* tag icon */
#page-tag h1 > i { font-size: 1.2rem; }

#page-category h1 > i { font-size: 1.25rem; }

#page-category a:hover, #page-tag a:hover, #access-lastmod a:hover { margin-bottom: -1px; /* Avoid jumping */ }

@media all and (max-width: 576px) { #page-category ul > li::before, #page-tag ul > li::before { margin: 0 0.5rem; } #page-category ul > li > a, #page-tag ul > li > a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } }

/* append your custom style below */

/*# sourceMappingURL=jekyll-theme-chirpy.css.map */