From c6189fee8bc6b654cf7524f16b25692fa6efe6d8 Mon Sep 17 00:00:00 2001
From: WAY-ADVENTURER <2992850181@qq.com>
Date: Tue, 18 Mar 2025 21:10:51 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8D=9A=E5=AE=A2=E4=BF=AE=E9=A5=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md                                    |    2 +-
 _posts/2019-08-08-text-and-typography.md     |  200 ++
 _site/404.html                               |   45 +
 _site/about/index.html                       |   49 +-
 _site/archives/index.html                    |   64 +-
 _site/assets/css/jekyll-theme-chirpy.css     |    2 +-
 _site/assets/css/jekyll-theme-chirpy.css.map |    2 +-
 _site/assets/js/data/search.json             |    8 +
 _site/assets/js/data/swconf.js               |    2 +-
 _site/categories/blogging/index.html         |   71 +-
 _site/categories/demo/index.html             |  854 ++++++
 _site/categories/index.html                  |   79 +-
 _site/categories/tutorial/index.html         |   45 +
 _site/feed.xml                               |   28 +-
 _site/index.html                             |  205 ++
 _site/posts/text-and-typography/index.html   | 2488 ++++++++++++++++++
 _site/posts/write-a-new-post/index.html      |  103 +-
 _site/sitemap.xml                            |   18 +-
 _site/tags/index.html                        |   55 +-
 _site/tags/typography/index.html             |  853 ++++++
 _site/tags/writing/index.html                |   45 +
 21 files changed, 5193 insertions(+), 25 deletions(-)
 create mode 100644 _posts/2019-08-08-text-and-typography.md
 create mode 100644 _site/categories/demo/index.html
 create mode 100644 _site/posts/text-and-typography/index.html
 create mode 100644 _site/tags/typography/index.html

diff --git a/README.md b/README.md
index 842b68e..5ffdd22 100644
--- a/README.md
+++ b/README.md
@@ -18,7 +18,7 @@ bundle exec jekyll serve
 # 替换bundle exec jekyll build -d ./_site
 jk-build
 git add .
-git commit -m "wa"
+git commit -m "博客修饰"
 git push
 ```
 
diff --git a/_posts/2019-08-08-text-and-typography.md b/_posts/2019-08-08-text-and-typography.md
new file mode 100644
index 0000000..a8db26a
--- /dev/null
+++ b/_posts/2019-08-08-text-and-typography.md
@@ -0,0 +1,200 @@
+---
+title: Text and Typography
+description: Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more.
+author: cotes
+date: 2019-08-08 11:33:00 +0800
+categories: [Blogging, Demo]
+tags: [typography]
+pin: true
+math: true
+mermaid: true
+image:
+  path: /commons/devices-mockup.png
+  lqip: data:image/webp;base64,UklGRpoAAABXRUJQVlA4WAoAAAAQAAAADwAABwAAQUxQSDIAAAARL0AmbZurmr57yyIiqE8oiG0bejIYEQTgqiDA9vqnsUSI6H+oAERp2HZ65qP/VIAWAFZQOCBCAAAA8AEAnQEqEAAIAAVAfCWkAALp8sF8rgRgAP7o9FDvMCkMde9PK7euH5M1m6VWoDXf2FkP3BqV0ZYbO6NA/VFIAAAA
+  alt: Responsive rendering of Chirpy theme on multiple devices.
+---
+
+## Headings
+
+<!-- markdownlint-capture -->
+<!-- markdownlint-disable -->
+# H1 — heading
+{: .mt-4 .mb-0 }
+
+## H2 — heading
+{: data-toc-skip='' .mt-4 .mb-0 }
+
+### H3 — heading
+{: data-toc-skip='' .mt-4 .mb-0 }
+
+#### H4 — heading
+{: data-toc-skip='' .mt-4 }
+<!-- markdownlint-restore -->
+
+## Paragraph
+
+Quisque egestas convallis ipsum, ut sollicitudin risus tincidunt a. Maecenas interdum malesuada egestas. Duis consectetur porta risus, sit amet vulputate urna facilisis ac. Phasellus semper dui non purus ultrices sodales. Aliquam ante lorem, ornare a feugiat ac, finibus nec mauris. Vivamus ut tristique nisi. Sed vel leo vulputate, efficitur risus non, posuere mi. Nullam tincidunt bibendum rutrum. Proin commodo ornare sapien. Vivamus interdum diam sed sapien blandit, sit amet aliquam risus mattis. Nullam arcu turpis, mollis quis laoreet at, placerat id nibh. Suspendisse venenatis eros eros.
+
+## Lists
+
+### Ordered list
+
+1. Firstly
+2. Secondly
+3. Thirdly
+
+### Unordered list
+
+- Chapter
+  - Section
+    - Paragraph
+
+### ToDo list
+
+- [ ] Job
+  - [x] Step 1
+  - [x] Step 2
+  - [ ] Step 3
+
+### Description list
+
+Sun
+: the star around which the earth orbits
+
+Moon
+: the natural satellite of the earth, visible by reflected light from the sun
+
+## Block Quote
+
+> This line shows the _block quote_.
+
+## Prompts
+
+<!-- markdownlint-capture -->
+<!-- markdownlint-disable -->
+> An example showing the `tip` type prompt.
+{: .prompt-tip }
+
+> An example showing the `info` type prompt.
+{: .prompt-info }
+
+> An example showing the `warning` type prompt.
+{: .prompt-warning }
+
+> An example showing the `danger` type prompt.
+{: .prompt-danger }
+<!-- markdownlint-restore -->
+
+## Tables
+
+| Company                      | Contact          | Country |
+| :--------------------------- | :--------------- | ------: |
+| Alfreds Futterkiste          | Maria Anders     | Germany |
+| Island Trading               | Helen Bennett    |      UK |
+| Magazzini Alimentari Riuniti | Giovanni Rovelli |   Italy |
+
+## Links
+
+<http://127.0.0.1:4000>
+
+## Footnote
+
+Click the hook will locate the footnote[^footnote], and here is another footnote[^fn-nth-2].
+
+## Inline code
+
+This is an example of `Inline Code`.
+
+## Filepath
+
+Here is the `/path/to/the/file.extend`{: .filepath}.
+
+## Code blocks
+
+### Common
+
+```text
+This is a common code snippet, without syntax highlight and line number.
+```
+
+### Specific Language
+
+```bash
+if [ $? -ne 0 ]; then
+  echo "The command was not successful.";
+  #do the needful / exit
+fi;
+```
+
+### Specific filename
+
+```sass
+@import
+  "colors/light-typography",
+  "colors/dark-typography";
+```
+{: file='_sass/jekyll-theme-chirpy.scss'}
+
+## Mathematics
+
+The mathematics powered by [**MathJax**](https://www.mathjax.org/):
+
+$$
+\begin{equation}
+  \sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6}
+  \label{eq:series}
+\end{equation}
+$$
+
+We can reference the equation as \eqref{eq:series}.
+
+When $a \ne 0$, there are two solutions to $ax^2 + bx + c = 0$ and they are
+
+$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
+
+## Mermaid SVG
+
+```mermaid
+ gantt
+  title  Adding GANTT diagram functionality to mermaid
+  apple :a, 2017-07-20, 1w
+  banana :crit, b, 2017-07-23, 1d
+  cherry :active, c, after b a, 1d
+```
+
+## Images
+
+### Default (with caption)
+
+![Desktop View](/posts/20190808/mockup.png){: width="972" height="589" }
+_Full screen width and center alignment_
+
+### Left aligned
+
+![Desktop View](/posts/20190808/mockup.png){: width="972" height="589" .w-75 .normal}
+
+### Float to left
+
+![Desktop View](/posts/20190808/mockup.png){: width="972" height="589" .w-50 .left}
+Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.
+
+### Float to right
+
+![Desktop View](/posts/20190808/mockup.png){: width="972" height="589" .w-50 .right}
+Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.
+
+### Dark/Light mode & Shadow
+
+The image below will toggle dark/light mode based on theme preference, notice it has shadows.
+
+![light mode only](/posts/20190808/devtools-light.png){: .light .w-75 .shadow .rounded-10 w='1212' h='668' }
+![dark mode only](/posts/20190808/devtools-dark.png){: .dark .w-75 .shadow .rounded-10 w='1212' h='668' }
+
+## Video
+
+{% include embed/youtube.html id='Balreaj8Yqs' %}
+
+## Reverse Footnote
+
+[^footnote]: The footnote source
+[^fn-nth-2]: The 2nd footnote source
diff --git a/_site/404.html b/_site/404.html
index 4f81d07..20e7317 100644
--- a/_site/404.html
+++ b/_site/404.html
@@ -609,6 +609,13 @@
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -635,6 +642,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -646,6 +669,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -736,6 +762,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -747,6 +789,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
diff --git a/_site/about/index.html b/_site/about/index.html
index 65f3771..43d33b4 100644
--- a/_site/about/index.html
+++ b/_site/about/index.html
@@ -93,12 +93,12 @@
 <meta property="og:url" content="https://way.ember.ac.cn/about/" />
 <meta property="og:site_name" content="WenQi Wei" />
 <meta property="og:type" content="article" />
-<meta property="article:published_time" content="2025-03-18T20:47:34+08:00" />
+<meta property="article:published_time" content="2025-03-18T21:10:43+08:00" />
 <meta name="twitter:card" content="summary" />
 <meta property="twitter:title" content="About" />
 <meta name="twitter:site" content="@way_adventurer" />
 <script type="application/ld+json">
-{"@context":"https://schema.org","@type":"WebSite","dateModified":"2025-03-18T20:47:34+08:00","datePublished":"2025-03-18T20:47:34+08:00","description":"Add Markdown syntax content to file _tabs/about.md and it will show up on this page.","headline":"About","name":"WenQi Wei","sameAs":["https://twitter.com/way_adventurer","https://github.com/WAY-ADVENTURER"],"url":"https://way.ember.ac.cn/about/"}</script>
+{"@context":"https://schema.org","@type":"WebSite","dateModified":"2025-03-18T21:10:43+08:00","datePublished":"2025-03-18T21:10:43+08:00","description":"Add Markdown syntax content to file _tabs/about.md and it will show up on this page.","headline":"About","name":"WenQi Wei","sameAs":["https://twitter.com/way_adventurer","https://github.com/WAY-ADVENTURER"],"url":"https://way.ember.ac.cn/about/"}</script>
 <!-- End Jekyll SEO tag -->
 
 
@@ -608,6 +608,13 @@
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -634,6 +641,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -645,6 +668,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -735,6 +761,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -746,6 +788,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
diff --git a/_site/archives/index.html b/_site/archives/index.html
index 5ad2994..4022866 100644
--- a/_site/archives/index.html
+++ b/_site/archives/index.html
@@ -93,12 +93,12 @@
 <meta property="og:url" content="https://way.ember.ac.cn/archives/" />
 <meta property="og:site_name" content="WenQi Wei" />
 <meta property="og:type" content="article" />
-<meta property="article:published_time" content="2025-03-18T20:47:34+08:00" />
+<meta property="article:published_time" content="2025-03-18T21:10:43+08:00" />
 <meta name="twitter:card" content="summary" />
 <meta property="twitter:title" content="Archives" />
 <meta name="twitter:site" content="@way_adventurer" />
 <script type="application/ld+json">
-{"@context":"https://schema.org","@type":"BlogPosting","dateModified":"2025-03-18T20:47:34+08:00","datePublished":"2025-03-18T20:47:34+08:00","description":"这里是，way的世界！welcome！","headline":"Archives","mainEntityOfPage":{"@type":"WebPage","@id":"https://way.ember.ac.cn/archives/"},"url":"https://way.ember.ac.cn/archives/"}</script>
+{"@context":"https://schema.org","@type":"BlogPosting","dateModified":"2025-03-18T21:10:43+08:00","datePublished":"2025-03-18T21:10:43+08:00","description":"这里是，way的世界！welcome！","headline":"Archives","mainEntityOfPage":{"@type":"WebPage","@id":"https://way.ember.ac.cn/archives/"},"url":"https://way.ember.ac.cn/archives/"}</script>
 <!-- End Jekyll SEO tag -->
 
 
@@ -528,6 +528,21 @@
       <a href="/posts/write-a-new-post/">Writing a New Post</a>
     </li>
 
+    
+  
+    
+
+    
+
+    <li>
+      
+      <span class="date day" data-ts="1565235180" data-df="DD">08</span>
+      <span class="date month small text-muted ms-1" data-ts="1565235180" data-df="MMM">
+        Aug
+      </span>
+      <a href="/posts/text-and-typography/">Text and Typography</a>
+    </li>
+
     </ul>
   
 </div>
@@ -568,6 +583,13 @@
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -594,6 +616,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -605,6 +643,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -695,6 +736,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -706,6 +763,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
diff --git a/_site/assets/css/jekyll-theme-chirpy.css b/_site/assets/css/jekyll-theme-chirpy.css
index 336f4f4..818aa89 100644
--- a/_site/assets/css/jekyll-theme-chirpy.css
+++ b/_site/assets/css/jekyll-theme-chirpy.css
@@ -1 +1 @@
-::-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:.6}:focus::-moz-placeholder{opacity:.6}:focus:-ms-input-placeholder{opacity:.6}:focus::-ms-input-placeholder{opacity:.6}:focus::placeholder{opacity:.6}header .post-desc,#toc-bar .label,#search-results a,h1,h2,h3,h4,h5{color:var(--heading-color);font-weight:400;font-family:Lato,"Microsoft Yahei",sans-serif;scroll-margin-top:3.5rem}h2 .anchor,h3 .anchor,h4 .anchor,h5 .anchor{font-size:80%}@media(hover: hover){h2 .anchor,h3 .anchor,h4 .anchor,h5 .anchor{visibility:hidden;opacity:0;transition:opacity .25s ease-in,visibility 0s ease-in .25s}h2:hover .anchor,h3:hover .anchor,h4:hover .anchor,h5:hover .anchor{visibility:visible;opacity:1;transition:opacity .25s ease-in,visibility 0s ease-in 0s}}.post-tags .post-tag:hover,.tag:hover{background:var(--tag-hover);transition:background .35s ease-in-out}.table-wrapper>table thead th,.table-wrapper>table tbody tr td{padding:.4rem 1rem;font-size:95%;white-space:nowrap}#page-category a:hover,#page-tag a:hover,#access-lastmod a:hover,.post-tail-wrapper .license-wrapper>a:hover,.post-tags .post-tag:hover,#search-results a:hover,footer a:hover,#topbar #breadcrumb a:hover,.post-meta a:not([class]):hover,.content a:not(.img-link):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 .profile-wrapper,#sidebar .site-title,#sidebar .sidebar-bottom a{transition:all .3s ease-in-out}#sidebar .sidebar-bottom .icon-border,.code-header,i.far,i.fas,.content a.popup{-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,#access-lastmod a,main .categories a:not(:hover),main #tags a:not(:hover),main #archives a:not(:hover){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,.highlight,div[class^=language-],.code-header button,blockquote[class^=prompt-],.preview-img,.preview-img img,.post-preview,.post-preview::before,.embed-video{border-radius:10px}.content a.popup+em,.embed-video+em,.embed-audio+em{display:block;text-align:center;font-style:normal;font-size:80%;padding:0;color:#6d6c6c}#sidebar a,#sidebar .sidebar-bottom #mode-toggle{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-title,#post-list .card .card-body .card-text.content p{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical}#archives ul li,#toc-wrapper ul .toc-link,#related-posts p,#post-list .card .card-body .post-meta>div:first-child,#search-results>article>p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}header .post-meta em,header .post-meta time,.post-tail-wrapper .license-wrapper>a,footer a,footer em{color:var(--text-muted-highlight-color);font-weight:600}.post-tail-wrapper,.post-tail-wrapper .license-wrapper span:last-child,.post-meta{font-size:.85rem}#related-posts time,footer{font-size:.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}#toc-bar button i,#topbar button i,#toc-popup .header button i{color:#999}.highlight,figure.highlight,div[class^=language-]{background-color:var(--highlight-bg-color)}td.rouge-code{padding-left:1rem;padding-right:1.5rem}#toc-wrapper>*,.access>section{border-left:1px solid var(--main-border-color)}:root{font-size:16px}@media(prefers-color-scheme: light){html:not([data-mode]),html[data-mode=light]{--main-bg: white;--mask-bg: #c1c3c5;--main-border-color: #f3f3f3;--text-color: #34343c;--text-muted-color: #757575;--text-muted-highlight-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;--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% );--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-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;--post-list-text-color: dimgray;--btn-patinator-text-color: #555555;--btn-paginator-hover-color: var(--sidebar-bg);--toc-highlight: #0550ae;--toc-popup-border-color: lightgray;--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;--tag-border: #dee2e6;--tag-shadow: var(--btn-border-color);--tag-hover: rgb(222, 226, 230);--search-tag-bg: #f8f9fa;--categories-border: rgba(0, 0, 0, 0.125);--categories-hover-bg: var(--btn-border-color);--categories-icon-hover-color: darkslategray;--timeline-color: rgba(0, 0, 0, 0.075);--timeline-node-bg: #c2c6cc;--timeline-year-dot-color: #ffffff;--language-border-color: #ececec;--highlight-bg-color: #f6f8fa;--highlighter-rouge-color: #3f596f;--highlight-lineno-color: #9e9e9e;--inline-code-bg: rgba(25, 25, 28, 0.05);--code-color: #3a3a3a;--code-header-text-color: #a3a3a3;--code-header-muted-color: #e5e5e5;--code-header-icon-color: #c9c8c8;--clipboard-checked-color: #43c743}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: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]{color-scheme:dark;--main-bg: rgb(27, 27, 30);--mask-bg: rgb(68, 69, 70);--main-border-color: rgb(44, 45, 45);--text-color: rgb(175, 176, 177);--text-muted-color: #868686;--text-muted-highlight-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;--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% );--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-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);--post-list-text-color: rgb(175, 176, 177);--btn-patinator-text-color: var(--text-color);--btn-paginator-hover-color: #2e2e2e;--toc-highlight: rgb(116, 178, 243);--toc-popup-border-color: #373737;--tag-hover: rgb(43, 56, 62);--tb-odd-bg: #252526;--tb-even-bg: rgb(31, 31, 34);--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;--tag-border: rgb(59, 79, 88);--tag-shadow: rgb(32, 33, 33);--dash-color: rgb(63, 65, 68);--search-tag-bg: #292828;--categories-border: rgb(64, 66, 69, 0.5);--categories-hover-bg: rgb(73, 75, 76);--categories-icon-hover-color: white;--timeline-node-bg: rgb(150, 152, 156);--timeline-color: rgb(63, 65, 68);--timeline-year-dot-color: var(--timeline-color);--language-border-color: #2d2d2d;--highlight-bg-color: #151515;--highlighter-rouge-color: #c9def1;--highlight-lineno-color: #808080;--inline-code-bg: rgba(255, 255, 255, 0.05);--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}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, rgb(26, 26, 30), rgb(39, 39, 45), rgb(39, 39, 45), rgb(39, 39, 45), rgb(26, 26, 30))}html[data-mode=dark] #disqus_thread{color-scheme:none}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]{color-scheme:dark;--main-bg: rgb(27, 27, 30);--mask-bg: rgb(68, 69, 70);--main-border-color: rgb(44, 45, 45);--text-color: rgb(175, 176, 177);--text-muted-color: #868686;--text-muted-highlight-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;--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% );--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-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);--post-list-text-color: rgb(175, 176, 177);--btn-patinator-text-color: var(--text-color);--btn-paginator-hover-color: #2e2e2e;--toc-highlight: rgb(116, 178, 243);--toc-popup-border-color: #373737;--tag-hover: rgb(43, 56, 62);--tb-odd-bg: #252526;--tb-even-bg: rgb(31, 31, 34);--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;--tag-border: rgb(59, 79, 88);--tag-shadow: rgb(32, 33, 33);--dash-color: rgb(63, 65, 68);--search-tag-bg: #292828;--categories-border: rgb(64, 66, 69, 0.5);--categories-hover-bg: rgb(73, 75, 76);--categories-icon-hover-color: white;--timeline-node-bg: rgb(150, 152, 156);--timeline-color: rgb(63, 65, 68);--timeline-year-dot-color: var(--timeline-color);--language-border-color: #2d2d2d;--highlight-bg-color: #151515;--highlighter-rouge-color: #c9def1;--highlight-lineno-color: #808080;--inline-code-bg: rgba(255, 255, 255, 0.05);--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}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, rgb(26, 26, 30), rgb(39, 39, 45), rgb(39, 39, 45), rgb(39, 39, 45), rgb(26, 26, 30))}html:not([data-mode]) #disqus_thread,html[data-mode=dark] #disqus_thread{color-scheme:none}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]{--main-bg: white;--mask-bg: #c1c3c5;--main-border-color: #f3f3f3;--text-color: #34343c;--text-muted-color: #757575;--text-muted-highlight-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;--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% );--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-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;--post-list-text-color: dimgray;--btn-patinator-text-color: #555555;--btn-paginator-hover-color: var(--sidebar-bg);--toc-highlight: #0550ae;--toc-popup-border-color: lightgray;--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;--tag-border: #dee2e6;--tag-shadow: var(--btn-border-color);--tag-hover: rgb(222, 226, 230);--search-tag-bg: #f8f9fa;--categories-border: rgba(0, 0, 0, 0.125);--categories-hover-bg: var(--btn-border-color);--categories-icon-hover-color: darkslategray;--timeline-color: rgba(0, 0, 0, 0.075);--timeline-node-bg: #c2c6cc;--timeline-year-dot-color: #ffffff;--language-border-color: #ececec;--highlight-bg-color: #f6f8fa;--highlighter-rouge-color: #3f596f;--highlight-lineno-color: #9e9e9e;--inline-code-bg: rgba(25, 25, 28, 0.05);--code-color: #3a3a3a;--code-header-text-color: #a3a3a3;--code-header-muted-color: #e5e5e5;--code-header-icon-color: #c9c8c8;--clipboard-checked-color: #43c743}html[data-mode=light] [class^=prompt-]{--link-underline-color: rgb(219, 216, 216)}html[data-mode=light] .dark{display:none}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}}@media all and (min-width: 850px){html{overflow-y:scroll}}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}@media all and (max-width: calc(850px - 1px)){h1.dynamic-title{display:none}h1.dynamic-title~.content{margin-top:2.5rem}}@media all and (min-width: 1650px){main.col-12{padding-right:4.5rem !important}}.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 .35s ease-in-out}.post-preview:hover::before{opacity:.3}.content{font-size:1.08rem;margin-top:2rem;overflow-wrap:break-word}@media all and (min-width: 1200px){.content{font-size:1.03rem}}.content a.popup{margin-top:.5rem;margin-bottom:.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:.25rem 0;padding-left:.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:.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}.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 .5rem .2rem -1.3rem;vertical-align:middle}.content dl>dd{margin-left:1rem}.content ::marker{color:var(--text-muted-color)}@media all and (min-width: 850px){.content .table-wrapper>table{min-width:70%}}.post-tag{display:inline-block;min-width:2rem;text-align:center;border-radius:.5rem;border:1px solid var(--btn-border-color);padding:0 .4rem;color:var(--text-muted-color);line-height:1.3rem}.post-tag:not(:last-child){margin-right:.2rem}.rounded-10{border-radius:10px !important}.img-link{color:rgba(0,0,0,0);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}.flex-grow-1{flex-grow:1 !important}.btn-box-shadow{box-shadow:var(--card-shadow)}.text-muted{color:var(--text-muted-color) !important}.tooltip-inner{font-size:.7rem;max-width:220px;text-align:left}.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 .15s ease-in-out,border-color .15s ease-in-out}.left{float:left;margin:.75rem 1rem 1rem 0}.right{float:right;margin:.75rem 0 1rem 1rem}.mermaid{text-align:center}mjx-container{overflow-y:hidden;min-width:auto !important}@media(hover: hover){#sidebar ul>li:last-child::after{transition:top .5s ease}.nav-link{transition:background-color .3s ease-in-out}.post-preview{transition:background-color .35s ease-in-out}}#mask{inset:0 0 0 0}#main-wrapper{position:relative;padding-left:0;padding-right:0}@media all and (max-width: calc(850px - 1px)){#main-wrapper{transition:transform .4s ease}}@media all and (min-width: 850px){#main-wrapper{margin-left:260px}}@media all and (min-width: 1650px){#main-wrapper{margin-left:300px}}#main-wrapper>.container{min-height:100vh}@media all and (max-width: 768px){#main-wrapper>.container{max-width:100%;padding-left:0;padding-right:0}}@media all and (max-width: calc(850px - 1px)){#main-wrapper>.container{max-width:100%}}@media all and (min-width: 992px)and (max-width: calc(1200px - 1px)){#main-wrapper>.container .col-lg-11{flex:0 0 96%;max-width:96%}}@media all and (max-width: calc(1200px - 1px)){#main-wrapper>.container>.row{justify-content:center !important}}@media all and (min-width: 1650px){#main-wrapper>.container{max-width:1250px;padding-left:1.75rem !important;padding-right:1.75rem !important}}#topbar-wrapper.row,#main-wrapper>.container>.row,#search-result-wrapper>.row{margin-left:0;margin-right:0}@media all and (min-width: 1650px){#tail-wrapper{padding-right:4.5rem !important}}#tail-wrapper>:not(script){margin-top:3rem}h1{font-size:2rem}main h2{margin:2.5rem 0 1.25rem}h2{font-size:1.54rem}main h3{margin:2rem 0 1rem}h3{font-size:1.36rem}main h4{margin:2rem 0 1rem}h4{font-size:1.18rem}h5{font-size:1.05rem}a{text-decoration:none}img{max-width:100%;height:auto;transition:all .35s ease-in-out}.blur img{-webkit-filter:blur(20px);filter:blur(20px)}blockquote{border-left:.125rem solid var(--blockquote-border-color);padding-left:1rem;color:var(--blockquote-text-color);margin-top:.5rem}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:.25rem;margin-top:.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);transform:rotate(180deg)}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:Lato,sans-serif;display:inline-block;vertical-align:middle;line-height:1.3rem;min-width:1.75rem;text-align:center;margin:0 .3rem;padding-top:.1rem;color:var(--kbd-text-color);background-color:var(--kbd-bg-color);border-radius:6px;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}main{line-height:1.75}main h1{margin-top:2rem}@media all and (min-width: 850px){main h1{margin-top:3rem}}main p>a.popup:not(.normal):not(.left):not(.right){position:relative;left:50%;transform:translateX(-50%)}@media all and (max-width: 576px){main .content>blockquote[class^=prompt-]{margin-left:-1rem;margin-right:-1rem;border-radius:0;max-width:none}}.footnotes>ol{padding-left:2rem;margin-top:.5rem}.footnotes>ol>li:not(:last-child){margin-bottom:.3rem}.footnotes>ol>li>p{margin-left:.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:.6rem;line-height:1;position:relative;bottom:.25em;margin-left:.25em;border-bottom-style:none !important}.table-wrapper{overflow-x:auto;margin-bottom:1.5rem}.table-wrapper>table{min-width:100%;overflow-x:auto;border-spacing:0}.table-wrapper>table thead{border-bottom:solid 2px rgba(210,215,217,.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)}.highlighter-rouge{color:var(--highlighter-rouge-color);margin-top:.5rem;margin-bottom:1.2em}.highlight{overflow:auto;padding-bottom:.75rem}.highlight pre{margin-bottom:0;font-size:.85rem;line-height:1.4rem;word-wrap:normal}.highlight table td:first-child{display:inline-block;margin-left:1rem;margin-right:.75rem}.highlight table td:last-child{padding-right:2rem !important}.highlight table td pre{overflow:visible;word-break:normal}.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}code{-webkit-hyphens:none;-ms-hyphens:none;hyphens:none;color:var(--code-color)}code.highlighter-rouge{font-size:.85rem;padding:3px 5px;word-break:break-word;border-radius:6px;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;color:inherit}a:hover>code.highlighter-rouge{border-bottom:none}blockquote code{color:inherit}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}@media all and (min-width: 576px){.content>div[class^=language-]{margin-left:0;margin-right:0;border-radius:10px}}@media all and (min-width: 576px){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:.75rem;height:.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:-0.875rem}}div[class^=language-] .highlight{border-top-left-radius:0;border-top-right-radius:0}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:.75rem;margin-right:.25rem}.code-header span{line-height:2.25rem}.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}.code-header span::after{content:attr(data-label-text);font-size:.85rem;font-weight:600;color:var(--code-header-text-color)}.code-header button{border:1px solid rgba(0,0,0,0);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,.37)}.code-header button:not([timeout]):hover i{color:#fff}#back-to-top{visibility:hidden;opacity:0;z-index:1;cursor:pointer;position:fixed;right:1rem;bottom:4.625rem;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 .5s ease-in-out,transform .2s ease-out}@media all and (min-width: 850px){#back-to-top{right:5%;bottom:3.625rem}}@media all and (min-width: 1400px){#back-to-top{right:calc((100vw - 260px - 1140px)/2 + 3rem)}}@media all and (min-width: 1650px){#back-to-top{right:calc((100vw - 300px - 1250px)/2 + 2rem)}}#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:.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:hsla(0,0%,100%,.5);color:rgba(27,27,30,.7294117647);position:fixed;left:50%;bottom:20%;transform:translateX(-50%);-webkit-animation:popup .8s;animation:popup .8s}#toc-popup{border-color:var(--toc-popup-border-color);border-width:1px;border-radius:10px;color:var(--text-color);background:var(--card-bg);margin-top:3rem;min-width:20rem;font-size:1.05rem}@media all and (min-width: 576px){#toc-popup{max-width:32rem}}#toc-popup[open]{-webkit-animation:slide-in .3s ease-out;animation:slide-in .3s ease-out}#toc-popup[closing]{-webkit-animation:slide-out .3s ease-out;animation:slide-out .3s ease-out}@media all and (min-width: 850px){#toc-popup{left:260px}}#toc-popup .header{position:-webkit-sticky;position:sticky;top:0;background-color:inherit;border-bottom:1px solid var(--main-border-color)}#toc-popup .header .label{font-family:Lato,"Microsoft Yahei",sans-serif}#toc-popup button>i{font-size:1.25rem;vertical-align:middle}#toc-popup button:focus-visible{box-shadow:none}#toc-popup ul{list-style-type:none;padding-left:0}#toc-popup ul li ul,#toc-popup ul li+li{margin-top:.25rem}#toc-popup ul li a{display:flex;line-height:1.5;padding:.375rem 0;padding-right:1.125rem}#toc-popup ul li a.toc-link::before{display:none}#toc-popup .node-name--H2{padding-left:1.125rem}#toc-popup .node-name--H3{padding-left:2.25rem}#toc-popup .node-name--H4{padding-left:3.375rem}#toc-popup .is-active-link{color:var(--toc-highlight) !important;font-weight:600}#toc-popup::-webkit-backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}#toc-popup::backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}#toc-popup::after{display:flex;content:"";position:relative;background:linear-gradient(transparent, var(--card-bg) 70%);height:2rem}#toc-popup #toc-popup-content{overflow:auto;max-height:calc(100vh - 12rem);font-family:Lato,"Microsoft Yahei",sans-serif;margin-bottom:-2rem}#sidebar{padding-left:0;padding-right:0;position:fixed;top:0;left:0;height:100%;overflow-y:auto;width:260px;background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border-color);-ms-overflow-style:none;scrollbar-width:none}#sidebar::-webkit-scrollbar{display:none}@media all and (max-width: calc(850px - 1px)){#sidebar{transition:transform .4s ease;transform:translateX(-260px);-webkit-transform:translateX(-260px)}[sidebar-display] #sidebar{transform:translateX(0)}}@media all and (min-width: 1650px){#sidebar{width:300px}}#sidebar .sidebar-bottom #mode-toggle:hover,#sidebar .sidebar-bottom a:hover,#sidebar .site-title:hover{color:var(--sidebar-active-color)}#sidebar #avatar{display:block;width:6.5rem;height:6.5rem;overflow:hidden;box-shadow:var(--avatar-border-color) 0 0 0 2px;transform:translateZ(0)}@media all and (min-width: 576px){#sidebar #avatar{width:7rem;height:7rem}}#sidebar #avatar img{transition:transform .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%}@media all and (min-width: 850px){#sidebar .profile-wrapper{margin-top:3rem}}@media all and (min-width: 1650px){#sidebar .profile-wrapper{margin-top:3.5rem;margin-bottom:2.5rem;padding-left:3.5rem}}#sidebar .site-title{font-family:inherit;font-weight:900;font-size:1.75rem;line-height:1.2;letter-spacing:.25px;margin-top:1.25rem;margin-bottom:.5rem;width:fit-content;color:var(--site-title-color)}#sidebar .site-subtitle{font-size:95%;color:var(--site-subtitle-color);margin-top:.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:.9;width:100%;padding-left:1.5rem;padding-right:1.5rem}@media all and (min-width: 1650px){#sidebar ul li.nav-item{padding-left:2.75rem;padding-right:2.75rem}}#sidebar ul li.nav-item a.nav-link{padding-top:.6rem;padding-bottom:.6rem;display:flex;align-items:center;border-radius:.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:.8;margin-right:1.5rem}#sidebar ul li.nav-item a.nav-link span{font-size:90%;letter-spacing:.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:.25rem}#sidebar .sidebar-bottom{padding-left:2rem;padding-right:1rem;margin-bottom:1.5rem}@media all and (min-width: 1650px){#sidebar .sidebar-bottom{padding-left:2.75rem;margin-bottom:1.75rem}}#sidebar .sidebar-bottom #mode-toggle,#sidebar .sidebar-bottom a{width:1.75rem;height:1.75rem;margin-bottom:.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:.8rem}@media all and (min-width: 1650px){#sidebar .sidebar-bottom a:not(:last-child){margin-right:1rem}}#sidebar .sidebar-bottom i{line-height:1.75rem}#sidebar .sidebar-bottom .icon-border{margin-left:calc((.8rem - 3px)/2);margin-right:calc((.8rem - 3px)/2);background-color:var(--sidebar-btn-color);content:"";width:3px;height:3px;border-radius:50%;margin-bottom:.5rem}@media all and (min-width: 1650px){#sidebar .sidebar-bottom .icon-border{margin-left:calc((1rem - 3px)/2);margin-right:calc((1rem - 3px)/2)}}@media all and (max-width: calc(850px - 1px)){[sidebar-display] #main-wrapper{transform:translateX(260px)}}#topbar-wrapper{height:3rem;background-color:var(--topbar-bg)}@media all and (max-width: calc(850px - 1px)){#topbar-wrapper{transition:transform .4s ease,top .2s ease;left:0}}#topbar #breadcrumb{font-size:1rem;color:var(--text-muted-color);padding-left:.5rem}#topbar #breadcrumb span:not(:last-child)::after{content:"›";padding:0 .3rem}@media all and (max-width: calc(850px - 1px)){#topbar #breadcrumb{display:none}}@media all and (min-width: 850px)and (max-width: calc(1200px - 1px)){#topbar #breadcrumb{width:65%;overflow:hidden;text-overflow:ellipsis;word-break:keep-all;white-space:nowrap}}@media all and (max-width: 768px){#topbar{max-width:100%}}@media all and (max-width: calc(850px - 1px)){#topbar{max-width:100%}}#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%;word-break:keep-all}@media all and (max-width: calc(850px - 1px)){#topbar-title{display:block}}@media all and (min-width: 850px){#topbar-title{text-align:left}}#sidebar-trigger,#search-trigger{display:none}@media all and (max-width: calc(850px - 1px)){#sidebar-trigger,#search-trigger{display:block}}.access{top:2rem;transition:top .2s ease-in-out;margin-top:3rem}.access:only-child{position:-webkit-sticky;position:sticky}.access>section{padding-left:1rem}.access>section:not(:first-child){margin-top:4rem}.access .content{font-size:.9rem}#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:.85rem;border-radius:.8rem;padding:.3rem .5rem;margin:0 .35rem .5rem 0}#panel-wrapper .post-tag:hover{transition:all .3s ease-in}#panel-wrapper>:last-child{margin-bottom:4rem}@media all and (max-width: calc(1200px - 1px)){#panel-wrapper{display:none}}#access-lastmod a{color:inherit}footer{background-color:var(--main-bg);height:5rem;border-top:1px solid var(--main-border-color)}@media all and (max-width: calc(850px - 1px)){footer{transition:transform .4s ease;height:6rem;padding:1.5rem 0}}footer p{text-align:center;margin-bottom:0}search{display:flex;width:100%;border-radius:1rem;border:1px solid var(--search-border-color);background:var(--main-bg);padding:0 .5rem}search i{z-index:2;font-size:.9rem;color:var(--search-icon-color)}@media all and (max-width: calc(850px - 1px)){search{display:none}}@media all and (min-width: 850px){search{max-width:200px}}@media all and (min-width: 1200px){search{margin-right:4rem}}@media all and (min-width: 1650px){search{margin-right:calc(112.5px - .75rem)}}#search-result-wrapper{display:none;height:100%;width:100%;overflow:auto}#search-result-wrapper .content{margin-top:2rem}@media all and (max-width: calc(850px - 1px)){#search-result-wrapper{width:100%}#search-result-wrapper .content{letter-spacing:0}}@media all and (min-width: 850px){#search-result-wrapper{max-width:1250px;justify-content:start !important}}#search-results{padding-bottom:3rem}@media all and (min-width: 850px)and (max-width: calc(1200px - 1px)){#search-results>div{max-width:700px}}#search-results a{font-size:1.4rem;line-height:1.5rem}#search-results>article{width:100%}#search-results>article:not(:last-child){margin-bottom:1rem}@media all and (min-width: 1200px){#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%}}#search-results>article h2{line-height:2.5rem}#search-results>article i{color:#818182;margin-right:.15rem;font-size:80%}#search-results>article>p{white-space:break-spaces;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}#search-cancel{color:var(--link-color);display:none;white-space:nowrap}#search-input{background:center;border:0;border-radius:0;padding:.18rem .3rem;color:var(--text-color);height:auto}#search-input:focus{box-shadow:none}@media all and (min-width: 1200px){#search-input{transition:all .3s ease-in-out}}#search-hints{padding:0 1rem}@media all and (min-width: 850px){#search-hints{display:none}}#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:.5rem;margin:0 1.25rem 1rem 0}#search-hints .post-tag::before{content:"#";color:var(--text-muted-color);padding-right:.2rem}#post-list{margin-top:2rem}@media all and (min-width: 850px){#post-list{margin-top:2.5rem}}#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:10px 10px 0 0}@media all and (min-width: 768px){#post-list .card .preview-img img,#post-list .card .preview-img{border-radius:0 10px 10px 0}}#post-list .card .card-body{height:100%;padding:1rem}@media all and (min-width: 768px){#post-list .card .card-body{padding:1.75rem 1.75rem 1.25rem}}#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}@media all and (min-width: 768px){#post-list .card .card-body .card-text{display:inherit !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}@media all and (min-width: 768px){#post-list .card .card-body .post-meta i:not(:first-child){margin-left:1.75rem}}#post-list .card .card-body .post-meta em{color:inherit}#post-list .card .card-body .post-meta>div:first-child{display:block}.pagination{color:var(--text-color);font-family:Lato,sans-serif;justify-content:space-evenly}@media all and (min-width: 850px){.pagination{font-size:.85rem;justify-content:center}}.pagination a:hover{text-decoration:none}@media all and (max-width: calc(850px - 1px)){.pagination .page-item:not(:first-child):not(:last-child){display:none}}@media all and (min-width: 850px){.pagination .page-item:not(:last-child){margin-right:.7rem}}.pagination .page-item .page-link{color:var(--btn-patinator-text-color);padding:0 .6rem;display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;border-radius:.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,.57)}@media all and (min-width: 850px){.pagination .page-index{display:none}}.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:"•";padding-left:.25rem;padding-right:.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)}.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}.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:.5rem}.post-tail-wrapper .share-wrapper .share-icons button{padding:0;border:none;line-height:inherit}@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}}.share-mastodon{--wc-stm-font-family: v.$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}@media all and (max-width: calc(850px - 1px)){.post-navigation{padding-left:0;padding-right:0;margin-left:-0.5rem;margin-right:-0.5rem}}.post-navigation .btn:not(:hover){color:var(--link-color)}.post-navigation .btn:hover:not(.disabled)::before{color:#f5f5f5}.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:.65rem;text-transform:uppercase;content:attr(aria-label)}.post-navigation .btn:first-child{border-radius:10px 0 0 10px;left:.5px}.post-navigation .btn:last-child{border-radius:0 10px 10px 0;right:.5px}.post-navigation p{font-size:1.1rem;line-height:1.5rem;margin-top:.3rem;white-space:normal}@media(hover: hover){.post-navigation .btn,.post-navigation .btn::before{transition:all .35s ease-in-out}}@-webkit-keyframes fade-up{from{opacity:0;margin-top:4rem}to{opacity:1}}@keyframes fade-up{from{opacity:0;margin-top:4rem}to{opacity:1}}#toc-wrapper::before,.toc-border-cover{content:"";display:block;position:-webkit-sticky;position:sticky;top:0;width:100%;height:3rem;background:linear-gradient(var(--main-bg) 50%, transparent)}#toc-wrapper{top:0;transition:top .2s ease-in-out;overflow-y:auto;max-height:100vh;scrollbar-width:none;margin-top:2rem}#toc-wrapper:not(.invisible){-webkit-animation:fade-up .8s;animation:fade-up .8s}#toc-wrapper ul{list-style:none;font-size:.85rem;line-height:1.25;padding-left:0}#toc-wrapper ul li a{padding:.4rem 0 .4rem 1.25rem}#toc-wrapper ul .toc-link{display:block}#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;height:1.25rem;background-color:var(--toc-highlight) !important}#toc-wrapper ul ul{padding-left:.75rem}.toc-border-cover{margin-bottom:-4rem}#toc-wrapper::after{content:"";position:fixed;bottom:0;width:15%;height:2.25rem;margin-left:-1px;background:linear-gradient(transparent, var(--main-bg) 70%)}#toc-bar{position:-webkit-sticky;position:sticky;top:0;z-index:1;margin:0 -1rem;height:3rem;background:var(--main-bg);border-bottom:1px solid var(--main-border-color);transition:all .2s ease-in-out}@media all and (min-width: 1200px){#toc-bar{display:none !important}}#toc-bar .label{margin-left:.375rem;padding:0 .75rem;color:inherit}#toc-bar.invisible{top:-3rem;transition:none}#toc-solo-trigger{color:var(--text-muted-color);border-color:var(--btn-border-color);border-radius:10px}@media all and (min-width: 1200px){#toc-solo-trigger{display:none !important}}#toc-solo-trigger .label{font-size:1rem;font-family:Lato,"Microsoft Yahei",sans-serif}#toc-solo-trigger:hover{box-shadow:none;background:none}@-webkit-keyframes slide-in{from{opacity:.7;transform:translateY(-3rem)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in{from{opacity:.7;transform:translateY(-3rem)}to{opacity:1;transform:translateY(0)}}@-webkit-keyframes slide-out{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-3rem);opacity:0}}@keyframes slide-out{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-3rem);opacity:0}}#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:.9rem;margin-bottom:.5rem;white-space:break-spaces;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}#disqus_thread{min-height:8.5rem}.utterances{max-width:100%;min-height:269px}.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: 768px){.content>p>img{max-width:calc(100% + 1rem)}}@media all and (min-width: 1200px){h2,h3,h4{scroll-margin-top:2rem}}.categories i{color:gray}.categories{margin-bottom:2rem;border-color:var(--categories-border)}.categories .card-header{padding:.75rem;border-radius:9px;border-bottom:0}.categories .card-header.hide-border-bottom{border-bottom-left-radius:0;border-bottom-right-radius:0}.categories i{font-size:86%}.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}.category-trigger{width:1.7rem;height:1.7rem;border-radius:50%;text-align:center;color:#6c757d !important}.category-trigger i{position:relative;height:.7rem;width:1rem;transition:transform 300ms ease}.category-trigger:hover i{color:var(--categories-icon-hover-color)}@media(hover: hover){.category-trigger:hover{background-color:var(--categories-hover-bg)}}.rotate{transform:rotate(-90deg)}.tag{border-radius:.7em;padding:6px 8px 7px;margin-right:.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:.6em;font-size:.7em;font-family:Oswald,sans-serif}@media all and (max-width: calc(850px - 1px)){#tags{justify-content:center !important}}#archives{letter-spacing:.03rem}@media all and (max-width: calc(576px - 1px)){#archives{margin-top:-1rem}#archives ul{letter-spacing:0}}#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}#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}#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:.5rem}#archives .date.month{width:1.4rem;text-align:center}#archives .date.day{font-size:85%;font-family:Lato,sans-serif}#archives a{margin-left:2.5rem;position:relative;top:.1rem}#archives a:hover{border-bottom:none}#archives a::before{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}.dash{margin:0 .5rem .6rem .5rem;border-bottom:2px dotted var(--dash-color)}#page-category ul>li,#page-tag ul>li{line-height:1.5rem;padding:.6rem 0}#page-category ul>li::before,#page-tag ul>li::before{background:#999;width:5px;height:5px;border-radius:50%;display:block;content:"";position:relative;top:.6rem;margin-right:.5rem}@media all and (max-width: calc(576px - 1px)){#page-category ul>li::before,#page-tag ul>li::before{margin:0 .5rem}}#page-category ul>li>a,#page-tag ul>li>a{font-size:1.1rem}@media all and (max-width: calc(576px - 1px)){#page-category ul>li>a,#page-tag ul>li>a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}#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}@keyframes infirot{from{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}.icon-loading1{display:inline-block;animation:infirot 1s linear infinite;-webkit-animation:infirot 1s linear infinite}#animation{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none}@keyframes animate{0%{transform:translateY(0) rotate(0deg);opacity:1;border-radius:0}100%{transform:translateY(-1200px) rotate(720deg);opacity:0;border-radius:50%}}@media all and (min-width: 1200px){#animation .animation-circle{position:absolute;left:var(--circle-left);bottom:-300px;display:block;background:var(--circle-background);width:var(--circle-side-length);height:var(--circle-side-length);animation:animate 25s linear infinite;animation-duration:var(--circle-time);animation-delay:var(--circle-delay);pointer-events:none}#animation .animation-circle:nth-child(0){--circle-left: 59%;--circle-background: rgba(188, 100, 135, 0.06);--circle-side-length: 62px;--circle-time: 12s;--circle-delay: 8s}#animation .animation-circle:nth-child(1){--circle-left: 91%;--circle-background: rgba(196, 67, 149, 0.06);--circle-side-length: 49px;--circle-time: 21s;--circle-delay: 22s}#animation .animation-circle:nth-child(2){--circle-left: 29%;--circle-background: rgba(118, 159, 21, 0.06);--circle-side-length: 159px;--circle-time: 29s;--circle-delay: 14s}#animation .animation-circle:nth-child(3){--circle-left: 82%;--circle-background: rgba(115, 250, 13, 0.06);--circle-side-length: 77px;--circle-time: 25s;--circle-delay: 9s}#animation .animation-circle:nth-child(4){--circle-left: 29%;--circle-background: rgba(243, 157, 114, 0.06);--circle-side-length: 105px;--circle-time: 23s;--circle-delay: 20s}#animation .animation-circle:nth-child(5){--circle-left: 94%;--circle-background: rgba(69, 245, 234, 0.06);--circle-side-length: 23px;--circle-time: 26s;--circle-delay: 21s}#animation .animation-circle:nth-child(6){--circle-left: 85%;--circle-background: rgba(222, 104, 24, 0.06);--circle-side-length: 163px;--circle-time: 11s;--circle-delay: 25s}#animation .animation-circle:nth-child(7){--circle-left: 53%;--circle-background: rgba(38, 157, 6, 0.06);--circle-side-length: 173px;--circle-time: 24s;--circle-delay: 13s}#animation .animation-circle:nth-child(8){--circle-left: 98%;--circle-background: rgba(124, 250, 209, 0.06);--circle-side-length: 166px;--circle-time: 23s;--circle-delay: 1s}#animation .animation-circle:nth-child(9){--circle-left: 8%;--circle-background: rgba(85, 42, 165, 0.06);--circle-side-length: 87px;--circle-time: 43s;--circle-delay: 11s}#animation .animation-circle:nth-child(10){--circle-left: 53%;--circle-background: rgba(191, 243, 25, 0.06);--circle-side-length: 198px;--circle-time: 13s;--circle-delay: 0s}#animation .animation-circle:nth-child(11){--circle-left: 23%;--circle-background: rgba(44, 108, 198, 0.06);--circle-side-length: 80px;--circle-time: 32s;--circle-delay: 3s}#animation .animation-circle:nth-child(12){--circle-left: 85%;--circle-background: rgba(240, 56, 133, 0.06);--circle-side-length: 159px;--circle-time: 22s;--circle-delay: 7s}#animation .animation-circle:nth-child(13){--circle-left: 72%;--circle-background: rgba(201, 243, 209, 0.06);--circle-side-length: 22px;--circle-time: 19s;--circle-delay: 7s}#animation .animation-circle:nth-child(14){--circle-left: 3%;--circle-background: rgba(206, 68, 126, 0.06);--circle-side-length: 132px;--circle-time: 25s;--circle-delay: 10s}#animation .animation-circle:nth-child(15){--circle-left: 10%;--circle-background: rgba(18, 238, 101, 0.06);--circle-side-length: 137px;--circle-time: 12s;--circle-delay: 7s}#animation .animation-circle:nth-child(16){--circle-left: 91%;--circle-background: rgba(115, 136, 52, 0.06);--circle-side-length: 45px;--circle-time: 27s;--circle-delay: 23s}#animation .animation-circle:nth-child(17){--circle-left: 13%;--circle-background: rgba(154, 124, 174, 0.06);--circle-side-length: 25px;--circle-time: 25s;--circle-delay: 21s}#animation .animation-circle:nth-child(18){--circle-left: 61%;--circle-background: rgba(208, 108, 213, 0.06);--circle-side-length: 160px;--circle-time: 32s;--circle-delay: 6s}#animation .animation-circle:nth-child(19){--circle-left: 17%;--circle-background: rgba(26, 198, 58, 0.06);--circle-side-length: 145px;--circle-time: 37s;--circle-delay: 14s}#animation .animation-circle:nth-child(20){--circle-left: 99%;--circle-background: rgba(78, 23, 99, 0.06);--circle-side-length: 143px;--circle-time: 30s;--circle-delay: 6s}#animation .animation-circle:nth-child(21){--circle-left: 13%;--circle-background: rgba(235, 16, 106, 0.06);--circle-side-length: 26px;--circle-time: 40s;--circle-delay: 17s}#animation .animation-circle:nth-child(22){--circle-left: 3%;--circle-background: rgba(61, 195, 115, 0.06);--circle-side-length: 156px;--circle-time: 37s;--circle-delay: 2s}#animation .animation-circle:nth-child(23){--circle-left: 38%;--circle-background: rgba(143, 64, 159, 0.06);--circle-side-length: 167px;--circle-time: 19s;--circle-delay: 17s}#animation .animation-circle:nth-child(24){--circle-left: 81%;--circle-background: rgba(8, 44, 96, 0.06);--circle-side-length: 46px;--circle-time: 13s;--circle-delay: 7s}#animation .animation-circle:nth-child(25){--circle-left: 10%;--circle-background: rgba(162, 235, 54, 0.06);--circle-side-length: 36px;--circle-time: 21s;--circle-delay: 21s}#animation .animation-circle:nth-child(26){--circle-left: 42%;--circle-background: rgba(81, 187, 242, 0.06);--circle-side-length: 46px;--circle-time: 25s;--circle-delay: 24s}#animation .animation-circle:nth-child(27){--circle-left: 75%;--circle-background: rgba(231, 54, 223, 0.06);--circle-side-length: 63px;--circle-time: 21s;--circle-delay: 16s}#animation .animation-circle:nth-child(28){--circle-left: 72%;--circle-background: rgba(56, 58, 127, 0.06);--circle-side-length: 21px;--circle-time: 39s;--circle-delay: 4s}#animation .animation-circle:nth-child(29){--circle-left: 9%;--circle-background: rgba(4, 27, 112, 0.06);--circle-side-length: 75px;--circle-time: 16s;--circle-delay: 13s}#animation .animation-circle:nth-child(30){--circle-left: 84%;--circle-background: rgba(55, 203, 94, 0.06);--circle-side-length: 103px;--circle-time: 43s;--circle-delay: 18s}#animation .animation-circle:nth-child(31){--circle-left: 96%;--circle-background: rgba(231, 13, 230, 0.06);--circle-side-length: 49px;--circle-time: 30s;--circle-delay: 20s}#animation .animation-circle:nth-child(32){--circle-left: 87%;--circle-background: rgba(225, 205, 126, 0.06);--circle-side-length: 46px;--circle-time: 43s;--circle-delay: 2s}#animation .animation-circle:nth-child(33){--circle-left: 22%;--circle-background: rgba(30, 170, 168, 0.06);--circle-side-length: 72px;--circle-time: 20s;--circle-delay: 21s}#animation .animation-circle:nth-child(34){--circle-left: 30%;--circle-background: rgba(30, 243, 149, 0.06);--circle-side-length: 131px;--circle-time: 39s;--circle-delay: 16s}#animation .animation-circle:nth-child(35){--circle-left: 30%;--circle-background: rgba(220, 169, 155, 0.06);--circle-side-length: 121px;--circle-time: 24s;--circle-delay: 24s}#animation .animation-circle:nth-child(36){--circle-left: 41%;--circle-background: rgba(88, 68, 3, 0.06);--circle-side-length: 168px;--circle-time: 40s;--circle-delay: 20s}#animation .animation-circle:nth-child(37){--circle-left: 11%;--circle-background: rgba(188, 43, 246, 0.06);--circle-side-length: 69px;--circle-time: 40s;--circle-delay: 19s}#animation .animation-circle:nth-child(38){--circle-left: 21%;--circle-background: rgba(88, 3, 63, 0.06);--circle-side-length: 117px;--circle-time: 40s;--circle-delay: 18s}#animation .animation-circle:nth-child(39){--circle-left: 23%;--circle-background: rgba(228, 54, 242, 0.06);--circle-side-length: 114px;--circle-time: 31s;--circle-delay: 11s}#animation .animation-circle:nth-child(40){--circle-left: 41%;--circle-background: rgba(132, 139, 10, 0.06);--circle-side-length: 185px;--circle-time: 30s;--circle-delay: 11s}#animation .animation-circle:nth-child(41){--circle-left: 54%;--circle-background: rgba(130, 153, 143, 0.06);--circle-side-length: 164px;--circle-time: 42s;--circle-delay: 23s}#animation .animation-circle:nth-child(42){--circle-left: 48%;--circle-background: rgba(118, 157, 69, 0.06);--circle-side-length: 149px;--circle-time: 40s;--circle-delay: 22s}#animation .animation-circle:nth-child(43){--circle-left: 16%;--circle-background: rgba(61, 85, 189, 0.06);--circle-side-length: 42px;--circle-time: 32s;--circle-delay: 8s}#animation .animation-circle:nth-child(44){--circle-left: 58%;--circle-background: rgba(149, 234, 206, 0.06);--circle-side-length: 191px;--circle-time: 35s;--circle-delay: 22s}#animation .animation-circle:nth-child(45){--circle-left: 83%;--circle-background: rgba(172, 59, 135, 0.06);--circle-side-length: 194px;--circle-time: 25s;--circle-delay: 21s}#animation .animation-circle:nth-child(46){--circle-left: 71%;--circle-background: rgba(42, 19, 253, 0.06);--circle-side-length: 198px;--circle-time: 30s;--circle-delay: 22s}#animation .animation-circle:nth-child(47){--circle-left: 39%;--circle-background: rgba(236, 185, 102, 0.06);--circle-side-length: 162px;--circle-time: 19s;--circle-delay: 0s}#animation .animation-circle:nth-child(48){--circle-left: 70%;--circle-background: rgba(119, 174, 188, 0.06);--circle-side-length: 56px;--circle-time: 28s;--circle-delay: 17s}#animation .animation-circle:nth-child(49){--circle-left: 38%;--circle-background: rgba(182, 116, 34, 0.06);--circle-side-length: 82px;--circle-time: 33s;--circle-delay: 18s}#animation .animation-circle:nth-child(50){--circle-left: 38%;--circle-background: rgba(172, 170, 134, 0.06);--circle-side-length: 143px;--circle-time: 17s;--circle-delay: 24s}}@media all and (max-width: 1199px){#animation .animation-circle{display:none}}.card-wrapper.card{border:3px solid #e3e5e7 !important;padding:2px;margin-bottom:2px;border-radius:8px;background-color:#f9f9f9;box-shadow:0 4px 6px rgba(0,0,0,.1);transition:transform .3s ease,box-shadow .3s ease}.card-wrapper.card:hover{transform:translateY(-5px);box-shadow:0 8px 12px rgba(0,0,0,.2)}#sidebar{background-image:url("/assets/img/background-dark.jpg");background-size:cover;background-repeat:no-repeat;background-position:top}#sidebar .site-title a{color:#fff;text-shadow:5px 5px 10px rgba(0,0,0,.5)}#sidebar .site-subtitle{color:#fff;text-shadow:2px 2px 3px rgba(0,0,0,.7)}#sidebar .sidebar-bottom .mode-toggle,#sidebar a{color:#fff}#sidebar .sidebar-bottom .btn{color:var(--sidebar-btn-color)}/*# sourceMappingURL=jekyll-theme-chirpy.css.map */
\ No newline at end of file
+::-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:.6}:focus::-moz-placeholder{opacity:.6}:focus:-ms-input-placeholder{opacity:.6}:focus::-ms-input-placeholder{opacity:.6}:focus::placeholder{opacity:.6}header .post-desc,#toc-bar .label,#search-results a,h1,h2,h3,h4,h5{color:var(--heading-color);font-weight:400;font-family:Lato,"Microsoft Yahei",sans-serif;scroll-margin-top:3.5rem}h2 .anchor,h3 .anchor,h4 .anchor,h5 .anchor{font-size:80%}@media(hover: hover){h2 .anchor,h3 .anchor,h4 .anchor,h5 .anchor{visibility:hidden;opacity:0;transition:opacity .25s ease-in,visibility 0s ease-in .25s}h2:hover .anchor,h3:hover .anchor,h4:hover .anchor,h5:hover .anchor{visibility:visible;opacity:1;transition:opacity .25s ease-in,visibility 0s ease-in 0s}}.post-tags .post-tag:hover,.tag:hover{background:var(--tag-hover);transition:background .35s ease-in-out}.table-wrapper>table thead th,.table-wrapper>table tbody tr td{padding:.4rem 1rem;font-size:95%;white-space:nowrap}#page-category a:hover,#page-tag a:hover,#access-lastmod a:hover,.post-tail-wrapper .license-wrapper>a:hover,.post-tags .post-tag:hover,#search-results a:hover,footer a:hover,#topbar #breadcrumb a:hover,.post-meta a:not([class]):hover,.content a:not(.img-link):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 .profile-wrapper,#sidebar .site-title,#sidebar .sidebar-bottom a{transition:all .3s ease-in-out}#sidebar .sidebar-bottom .icon-border,.code-header,i.far,i.fas,.content a.popup{-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,#access-lastmod a,main .categories a:not(:hover),main #tags a:not(:hover),main #archives a:not(:hover){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,.highlight,div[class^=language-],.code-header button,blockquote[class^=prompt-],.preview-img,.preview-img img,.post-preview,.post-preview::before,.embed-video{border-radius:10px}.content a.popup+em,.embed-video+em,.embed-audio+em{display:block;text-align:center;font-style:normal;font-size:80%;padding:0;color:#6d6c6c}#sidebar a,#sidebar .sidebar-bottom #mode-toggle{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-title,#post-list .card .card-body .card-text.content p{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical}#archives ul li,#toc-wrapper ul .toc-link,#related-posts p,#post-list .card .card-body .post-meta>div:first-child,#search-results>article>p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}header .post-meta em,header .post-meta time,.post-tail-wrapper .license-wrapper>a,footer a,footer em{color:var(--text-muted-highlight-color);font-weight:600}.post-tail-wrapper,.post-tail-wrapper .license-wrapper span:last-child,.post-meta{font-size:.85rem}#related-posts time,footer{font-size:.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}#toc-bar button i,#topbar button i,#toc-popup .header button i{color:#999}.highlight,figure.highlight,div[class^=language-]{background-color:var(--highlight-bg-color)}td.rouge-code{padding-left:1rem;padding-right:1.5rem}#toc-wrapper>*,.access>section{border-left:1px solid var(--main-border-color)}:root{font-size:16px}@media(prefers-color-scheme: light){html:not([data-mode]),html[data-mode=light]{--main-bg: white;--mask-bg: #c1c3c5;--main-border-color: #f3f3f3;--text-color: #34343c;--text-muted-color: #757575;--text-muted-highlight-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;--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% );--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-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;--post-list-text-color: dimgray;--btn-patinator-text-color: #555555;--btn-paginator-hover-color: var(--sidebar-bg);--toc-highlight: #0550ae;--toc-popup-border-color: lightgray;--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;--tag-border: #dee2e6;--tag-shadow: var(--btn-border-color);--tag-hover: rgb(222, 226, 230);--search-tag-bg: #f8f9fa;--categories-border: rgba(0, 0, 0, 0.125);--categories-hover-bg: var(--btn-border-color);--categories-icon-hover-color: darkslategray;--timeline-color: rgba(0, 0, 0, 0.075);--timeline-node-bg: #c2c6cc;--timeline-year-dot-color: #ffffff;--language-border-color: #ececec;--highlight-bg-color: #f6f8fa;--highlighter-rouge-color: #3f596f;--highlight-lineno-color: #9e9e9e;--inline-code-bg: rgba(25, 25, 28, 0.05);--code-color: #3a3a3a;--code-header-text-color: #a3a3a3;--code-header-muted-color: #e5e5e5;--code-header-icon-color: #c9c8c8;--clipboard-checked-color: #43c743}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: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]{color-scheme:dark;--main-bg: rgb(27, 27, 30);--mask-bg: rgb(68, 69, 70);--main-border-color: rgb(44, 45, 45);--text-color: rgb(175, 176, 177);--text-muted-color: #868686;--text-muted-highlight-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;--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% );--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-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);--post-list-text-color: rgb(175, 176, 177);--btn-patinator-text-color: var(--text-color);--btn-paginator-hover-color: #2e2e2e;--toc-highlight: rgb(116, 178, 243);--toc-popup-border-color: #373737;--tag-hover: rgb(43, 56, 62);--tb-odd-bg: #252526;--tb-even-bg: rgb(31, 31, 34);--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;--tag-border: rgb(59, 79, 88);--tag-shadow: rgb(32, 33, 33);--dash-color: rgb(63, 65, 68);--search-tag-bg: #292828;--categories-border: rgb(64, 66, 69, 0.5);--categories-hover-bg: rgb(73, 75, 76);--categories-icon-hover-color: white;--timeline-node-bg: rgb(150, 152, 156);--timeline-color: rgb(63, 65, 68);--timeline-year-dot-color: var(--timeline-color);--language-border-color: #2d2d2d;--highlight-bg-color: #151515;--highlighter-rouge-color: #c9def1;--highlight-lineno-color: #808080;--inline-code-bg: rgba(255, 255, 255, 0.05);--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}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, rgb(26, 26, 30), rgb(39, 39, 45), rgb(39, 39, 45), rgb(39, 39, 45), rgb(26, 26, 30))}html[data-mode=dark] #disqus_thread{color-scheme:none}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]{color-scheme:dark;--main-bg: rgb(27, 27, 30);--mask-bg: rgb(68, 69, 70);--main-border-color: rgb(44, 45, 45);--text-color: rgb(175, 176, 177);--text-muted-color: #868686;--text-muted-highlight-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;--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% );--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-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);--post-list-text-color: rgb(175, 176, 177);--btn-patinator-text-color: var(--text-color);--btn-paginator-hover-color: #2e2e2e;--toc-highlight: rgb(116, 178, 243);--toc-popup-border-color: #373737;--tag-hover: rgb(43, 56, 62);--tb-odd-bg: #252526;--tb-even-bg: rgb(31, 31, 34);--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;--tag-border: rgb(59, 79, 88);--tag-shadow: rgb(32, 33, 33);--dash-color: rgb(63, 65, 68);--search-tag-bg: #292828;--categories-border: rgb(64, 66, 69, 0.5);--categories-hover-bg: rgb(73, 75, 76);--categories-icon-hover-color: white;--timeline-node-bg: rgb(150, 152, 156);--timeline-color: rgb(63, 65, 68);--timeline-year-dot-color: var(--timeline-color);--language-border-color: #2d2d2d;--highlight-bg-color: #151515;--highlighter-rouge-color: #c9def1;--highlight-lineno-color: #808080;--inline-code-bg: rgba(255, 255, 255, 0.05);--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}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, rgb(26, 26, 30), rgb(39, 39, 45), rgb(39, 39, 45), rgb(39, 39, 45), rgb(26, 26, 30))}html:not([data-mode]) #disqus_thread,html[data-mode=dark] #disqus_thread{color-scheme:none}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]{--main-bg: white;--mask-bg: #c1c3c5;--main-border-color: #f3f3f3;--text-color: #34343c;--text-muted-color: #757575;--text-muted-highlight-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;--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% );--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-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;--post-list-text-color: dimgray;--btn-patinator-text-color: #555555;--btn-paginator-hover-color: var(--sidebar-bg);--toc-highlight: #0550ae;--toc-popup-border-color: lightgray;--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;--tag-border: #dee2e6;--tag-shadow: var(--btn-border-color);--tag-hover: rgb(222, 226, 230);--search-tag-bg: #f8f9fa;--categories-border: rgba(0, 0, 0, 0.125);--categories-hover-bg: var(--btn-border-color);--categories-icon-hover-color: darkslategray;--timeline-color: rgba(0, 0, 0, 0.075);--timeline-node-bg: #c2c6cc;--timeline-year-dot-color: #ffffff;--language-border-color: #ececec;--highlight-bg-color: #f6f8fa;--highlighter-rouge-color: #3f596f;--highlight-lineno-color: #9e9e9e;--inline-code-bg: rgba(25, 25, 28, 0.05);--code-color: #3a3a3a;--code-header-text-color: #a3a3a3;--code-header-muted-color: #e5e5e5;--code-header-icon-color: #c9c8c8;--clipboard-checked-color: #43c743}html[data-mode=light] [class^=prompt-]{--link-underline-color: rgb(219, 216, 216)}html[data-mode=light] .dark{display:none}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}}@media all and (min-width: 850px){html{overflow-y:scroll}}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}@media all and (max-width: calc(850px - 1px)){h1.dynamic-title{display:none}h1.dynamic-title~.content{margin-top:2.5rem}}@media all and (min-width: 1650px){main.col-12{padding-right:4.5rem !important}}.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 .35s ease-in-out}.post-preview:hover::before{opacity:.3}.content{font-size:1.08rem;margin-top:2rem;overflow-wrap:break-word}@media all and (min-width: 1200px){.content{font-size:1.03rem}}.content a.popup{margin-top:.5rem;margin-bottom:.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:.25rem 0;padding-left:.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:.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}.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 .5rem .2rem -1.3rem;vertical-align:middle}.content dl>dd{margin-left:1rem}.content ::marker{color:var(--text-muted-color)}@media all and (min-width: 850px){.content .table-wrapper>table{min-width:70%}}.post-tag{display:inline-block;min-width:2rem;text-align:center;border-radius:.5rem;border:1px solid var(--btn-border-color);padding:0 .4rem;color:var(--text-muted-color);line-height:1.3rem}.post-tag:not(:last-child){margin-right:.2rem}.rounded-10{border-radius:10px !important}.img-link{color:rgba(0,0,0,0);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}.flex-grow-1{flex-grow:1 !important}.btn-box-shadow{box-shadow:var(--card-shadow)}.text-muted{color:var(--text-muted-color) !important}.tooltip-inner{font-size:.7rem;max-width:220px;text-align:left}.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 .15s ease-in-out,border-color .15s ease-in-out}.left{float:left;margin:.75rem 1rem 1rem 0}.right{float:right;margin:.75rem 0 1rem 1rem}.mermaid{text-align:center}mjx-container{overflow-y:hidden;min-width:auto !important}@media(hover: hover){#sidebar ul>li:last-child::after{transition:top .5s ease}.nav-link{transition:background-color .3s ease-in-out}.post-preview{transition:background-color .35s ease-in-out}}#mask{inset:0 0 0 0}#main-wrapper{position:relative;padding-left:0;padding-right:0}@media all and (max-width: calc(850px - 1px)){#main-wrapper{transition:transform .4s ease}}@media all and (min-width: 850px){#main-wrapper{margin-left:260px}}@media all and (min-width: 1650px){#main-wrapper{margin-left:300px}}#main-wrapper>.container{min-height:100vh}@media all and (max-width: 768px){#main-wrapper>.container{max-width:100%;padding-left:0;padding-right:0}}@media all and (max-width: calc(850px - 1px)){#main-wrapper>.container{max-width:100%}}@media all and (min-width: 992px)and (max-width: calc(1200px - 1px)){#main-wrapper>.container .col-lg-11{flex:0 0 96%;max-width:96%}}@media all and (max-width: calc(1200px - 1px)){#main-wrapper>.container>.row{justify-content:center !important}}@media all and (min-width: 1650px){#main-wrapper>.container{max-width:1250px;padding-left:1.75rem !important;padding-right:1.75rem !important}}#topbar-wrapper.row,#main-wrapper>.container>.row,#search-result-wrapper>.row{margin-left:0;margin-right:0}@media all and (min-width: 1650px){#tail-wrapper{padding-right:4.5rem !important}}#tail-wrapper>:not(script){margin-top:3rem}h1{font-size:2rem}main h2{margin:2.5rem 0 1.25rem}h2{font-size:1.54rem}main h3{margin:2rem 0 1rem}h3{font-size:1.36rem}main h4{margin:2rem 0 1rem}h4{font-size:1.18rem}h5{font-size:1.05rem}a{text-decoration:none}img{max-width:100%;height:auto;transition:all .35s ease-in-out}.blur img{-webkit-filter:blur(20px);filter:blur(20px)}blockquote{border-left:.125rem solid var(--blockquote-border-color);padding-left:1rem;color:var(--blockquote-text-color);margin-top:.5rem}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:.25rem;margin-top:.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);transform:rotate(180deg)}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:Lato,sans-serif;display:inline-block;vertical-align:middle;line-height:1.3rem;min-width:1.75rem;text-align:center;margin:0 .3rem;padding-top:.1rem;color:var(--kbd-text-color);background-color:var(--kbd-bg-color);border-radius:6px;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}main{line-height:1.75}main h1{margin-top:2rem}@media all and (min-width: 850px){main h1{margin-top:3rem}}main p>a.popup:not(.normal):not(.left):not(.right){position:relative;left:50%;transform:translateX(-50%)}@media all and (max-width: 576px){main .content>blockquote[class^=prompt-]{margin-left:-1rem;margin-right:-1rem;border-radius:0;max-width:none}}.footnotes>ol{padding-left:2rem;margin-top:.5rem}.footnotes>ol>li:not(:last-child){margin-bottom:.3rem}.footnotes>ol>li>p{margin-left:.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:.6rem;line-height:1;position:relative;bottom:.25em;margin-left:.25em;border-bottom-style:none !important}.table-wrapper{overflow-x:auto;margin-bottom:1.5rem}.table-wrapper>table{min-width:100%;overflow-x:auto;border-spacing:0}.table-wrapper>table thead{border-bottom:solid 2px rgba(210,215,217,.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)}.highlighter-rouge{color:var(--highlighter-rouge-color);margin-top:.5rem;margin-bottom:1.2em}.highlight{overflow:auto;padding-bottom:.75rem}.highlight pre{margin-bottom:0;font-size:.85rem;line-height:1.4rem;word-wrap:normal}.highlight table td:first-child{display:inline-block;margin-left:1rem;margin-right:.75rem}.highlight table td:last-child{padding-right:2rem !important}.highlight table td pre{overflow:visible;word-break:normal}.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}code{-webkit-hyphens:none;-ms-hyphens:none;hyphens:none;color:var(--code-color)}code.highlighter-rouge{font-size:.85rem;padding:3px 5px;word-break:break-word;border-radius:6px;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;color:inherit}a:hover>code.highlighter-rouge{border-bottom:none}blockquote code{color:inherit}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}@media all and (min-width: 576px){.content>div[class^=language-]{margin-left:0;margin-right:0;border-radius:10px}}@media all and (min-width: 576px){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:.75rem;height:.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:-0.875rem}}div[class^=language-] .highlight{border-top-left-radius:0;border-top-right-radius:0}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:.75rem;margin-right:.25rem}.code-header span{line-height:2.25rem}.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}.code-header span::after{content:attr(data-label-text);font-size:.85rem;font-weight:600;color:var(--code-header-text-color)}.code-header button{border:1px solid rgba(0,0,0,0);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,.37)}.code-header button:not([timeout]):hover i{color:#fff}#back-to-top{visibility:hidden;opacity:0;z-index:1;cursor:pointer;position:fixed;right:1rem;bottom:4.625rem;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 .5s ease-in-out,transform .2s ease-out}@media all and (min-width: 850px){#back-to-top{right:5%;bottom:3.625rem}}@media all and (min-width: 1400px){#back-to-top{right:calc((100vw - 260px - 1140px)/2 + 3rem)}}@media all and (min-width: 1650px){#back-to-top{right:calc((100vw - 300px - 1250px)/2 + 2rem)}}#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:.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:hsla(0,0%,100%,.5);color:rgba(27,27,30,.7294117647);position:fixed;left:50%;bottom:20%;transform:translateX(-50%);-webkit-animation:popup .8s;animation:popup .8s}#toc-popup{border-color:var(--toc-popup-border-color);border-width:1px;border-radius:10px;color:var(--text-color);background:var(--card-bg);margin-top:3rem;min-width:20rem;font-size:1.05rem}@media all and (min-width: 576px){#toc-popup{max-width:32rem}}#toc-popup[open]{-webkit-animation:slide-in .3s ease-out;animation:slide-in .3s ease-out}#toc-popup[closing]{-webkit-animation:slide-out .3s ease-out;animation:slide-out .3s ease-out}@media all and (min-width: 850px){#toc-popup{left:260px}}#toc-popup .header{position:-webkit-sticky;position:sticky;top:0;background-color:inherit;border-bottom:1px solid var(--main-border-color)}#toc-popup .header .label{font-family:Lato,"Microsoft Yahei",sans-serif}#toc-popup button>i{font-size:1.25rem;vertical-align:middle}#toc-popup button:focus-visible{box-shadow:none}#toc-popup ul{list-style-type:none;padding-left:0}#toc-popup ul li ul,#toc-popup ul li+li{margin-top:.25rem}#toc-popup ul li a{display:flex;line-height:1.5;padding:.375rem 0;padding-right:1.125rem}#toc-popup ul li a.toc-link::before{display:none}#toc-popup .node-name--H2{padding-left:1.125rem}#toc-popup .node-name--H3{padding-left:2.25rem}#toc-popup .node-name--H4{padding-left:3.375rem}#toc-popup .is-active-link{color:var(--toc-highlight) !important;font-weight:600}#toc-popup::-webkit-backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}#toc-popup::backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}#toc-popup::after{display:flex;content:"";position:relative;background:linear-gradient(transparent, var(--card-bg) 70%);height:2rem}#toc-popup #toc-popup-content{overflow:auto;max-height:calc(100vh - 12rem);font-family:Lato,"Microsoft Yahei",sans-serif;margin-bottom:-2rem}#sidebar{padding-left:0;padding-right:0;position:fixed;top:0;left:0;height:100%;overflow-y:auto;width:260px;background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border-color);-ms-overflow-style:none;scrollbar-width:none}#sidebar::-webkit-scrollbar{display:none}@media all and (max-width: calc(850px - 1px)){#sidebar{transition:transform .4s ease;transform:translateX(-260px);-webkit-transform:translateX(-260px)}[sidebar-display] #sidebar{transform:translateX(0)}}@media all and (min-width: 1650px){#sidebar{width:300px}}#sidebar .sidebar-bottom #mode-toggle:hover,#sidebar .sidebar-bottom a:hover,#sidebar .site-title:hover{color:var(--sidebar-active-color)}#sidebar #avatar{display:block;width:6.5rem;height:6.5rem;overflow:hidden;box-shadow:var(--avatar-border-color) 0 0 0 2px;transform:translateZ(0)}@media all and (min-width: 576px){#sidebar #avatar{width:7rem;height:7rem}}#sidebar #avatar img{transition:transform .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%}@media all and (min-width: 850px){#sidebar .profile-wrapper{margin-top:3rem}}@media all and (min-width: 1650px){#sidebar .profile-wrapper{margin-top:3.5rem;margin-bottom:2.5rem;padding-left:3.5rem}}#sidebar .site-title{font-family:inherit;font-weight:900;font-size:1.75rem;line-height:1.2;letter-spacing:.25px;margin-top:1.25rem;margin-bottom:.5rem;width:fit-content;color:var(--site-title-color)}#sidebar .site-subtitle{font-size:95%;color:var(--site-subtitle-color);margin-top:.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:.9;width:100%;padding-left:1.5rem;padding-right:1.5rem}@media all and (min-width: 1650px){#sidebar ul li.nav-item{padding-left:2.75rem;padding-right:2.75rem}}#sidebar ul li.nav-item a.nav-link{padding-top:.6rem;padding-bottom:.6rem;display:flex;align-items:center;border-radius:.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:.8;margin-right:1.5rem}#sidebar ul li.nav-item a.nav-link span{font-size:90%;letter-spacing:.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:.25rem}#sidebar .sidebar-bottom{padding-left:2rem;padding-right:1rem;margin-bottom:1.5rem}@media all and (min-width: 1650px){#sidebar .sidebar-bottom{padding-left:2.75rem;margin-bottom:1.75rem}}#sidebar .sidebar-bottom #mode-toggle,#sidebar .sidebar-bottom a{width:1.75rem;height:1.75rem;margin-bottom:.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:.8rem}@media all and (min-width: 1650px){#sidebar .sidebar-bottom a:not(:last-child){margin-right:1rem}}#sidebar .sidebar-bottom i{line-height:1.75rem}#sidebar .sidebar-bottom .icon-border{margin-left:calc((.8rem - 3px)/2);margin-right:calc((.8rem - 3px)/2);background-color:var(--sidebar-btn-color);content:"";width:3px;height:3px;border-radius:50%;margin-bottom:.5rem}@media all and (min-width: 1650px){#sidebar .sidebar-bottom .icon-border{margin-left:calc((1rem - 3px)/2);margin-right:calc((1rem - 3px)/2)}}@media all and (max-width: calc(850px - 1px)){[sidebar-display] #main-wrapper{transform:translateX(260px)}}#topbar-wrapper{height:3rem;background-color:var(--topbar-bg)}@media all and (max-width: calc(850px - 1px)){#topbar-wrapper{transition:transform .4s ease,top .2s ease;left:0}}#topbar #breadcrumb{font-size:1rem;color:var(--text-muted-color);padding-left:.5rem}#topbar #breadcrumb span:not(:last-child)::after{content:"›";padding:0 .3rem}@media all and (max-width: calc(850px - 1px)){#topbar #breadcrumb{display:none}}@media all and (min-width: 850px)and (max-width: calc(1200px - 1px)){#topbar #breadcrumb{width:65%;overflow:hidden;text-overflow:ellipsis;word-break:keep-all;white-space:nowrap}}@media all and (max-width: 768px){#topbar{max-width:100%}}@media all and (max-width: calc(850px - 1px)){#topbar{max-width:100%}}#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%;word-break:keep-all}@media all and (max-width: calc(850px - 1px)){#topbar-title{display:block}}@media all and (min-width: 850px){#topbar-title{text-align:left}}#sidebar-trigger,#search-trigger{display:none}@media all and (max-width: calc(850px - 1px)){#sidebar-trigger,#search-trigger{display:block}}.access{top:2rem;transition:top .2s ease-in-out;margin-top:3rem}.access:only-child{position:-webkit-sticky;position:sticky}.access>section{padding-left:1rem}.access>section:not(:first-child){margin-top:4rem}.access .content{font-size:.9rem}#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:.85rem;border-radius:.8rem;padding:.3rem .5rem;margin:0 .35rem .5rem 0}#panel-wrapper .post-tag:hover{transition:all .3s ease-in}#panel-wrapper>:last-child{margin-bottom:4rem}@media all and (max-width: calc(1200px - 1px)){#panel-wrapper{display:none}}#access-lastmod a{color:inherit}footer{background-color:var(--main-bg);height:5rem;border-top:1px solid var(--main-border-color)}@media all and (max-width: calc(850px - 1px)){footer{transition:transform .4s ease;height:6rem;padding:1.5rem 0}}footer p{text-align:center;margin-bottom:0}search{display:flex;width:100%;border-radius:1rem;border:1px solid var(--search-border-color);background:var(--main-bg);padding:0 .5rem}search i{z-index:2;font-size:.9rem;color:var(--search-icon-color)}@media all and (max-width: calc(850px - 1px)){search{display:none}}@media all and (min-width: 850px){search{max-width:200px}}@media all and (min-width: 1200px){search{margin-right:4rem}}@media all and (min-width: 1650px){search{margin-right:calc(112.5px - .75rem)}}#search-result-wrapper{display:none;height:100%;width:100%;overflow:auto}#search-result-wrapper .content{margin-top:2rem}@media all and (max-width: calc(850px - 1px)){#search-result-wrapper{width:100%}#search-result-wrapper .content{letter-spacing:0}}@media all and (min-width: 850px){#search-result-wrapper{max-width:1250px;justify-content:start !important}}#search-results{padding-bottom:3rem}@media all and (min-width: 850px)and (max-width: calc(1200px - 1px)){#search-results>div{max-width:700px}}#search-results a{font-size:1.4rem;line-height:1.5rem}#search-results>article{width:100%}#search-results>article:not(:last-child){margin-bottom:1rem}@media all and (min-width: 1200px){#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%}}#search-results>article h2{line-height:2.5rem}#search-results>article i{color:#818182;margin-right:.15rem;font-size:80%}#search-results>article>p{white-space:break-spaces;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}#search-cancel{color:var(--link-color);display:none;white-space:nowrap}#search-input{background:center;border:0;border-radius:0;padding:.18rem .3rem;color:var(--text-color);height:auto}#search-input:focus{box-shadow:none}@media all and (min-width: 1200px){#search-input{transition:all .3s ease-in-out}}#search-hints{padding:0 1rem}@media all and (min-width: 850px){#search-hints{display:none}}#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:.5rem;margin:0 1.25rem 1rem 0}#search-hints .post-tag::before{content:"#";color:var(--text-muted-color);padding-right:.2rem}#post-list{margin-top:2rem}@media all and (min-width: 850px){#post-list{margin-top:2.5rem}}#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:10px 10px 0 0}@media all and (min-width: 768px){#post-list .card .preview-img img,#post-list .card .preview-img{border-radius:0 10px 10px 0}}#post-list .card .card-body{height:100%;padding:1rem}@media all and (min-width: 768px){#post-list .card .card-body{padding:1.75rem 1.75rem 1.25rem}}#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}@media all and (min-width: 768px){#post-list .card .card-body .card-text{display:inherit !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}@media all and (min-width: 768px){#post-list .card .card-body .post-meta i:not(:first-child){margin-left:1.75rem}}#post-list .card .card-body .post-meta em{color:inherit}#post-list .card .card-body .post-meta>div:first-child{display:block}.pagination{color:var(--text-color);font-family:Lato,sans-serif;justify-content:space-evenly}@media all and (min-width: 850px){.pagination{font-size:.85rem;justify-content:center}}.pagination a:hover{text-decoration:none}@media all and (max-width: calc(850px - 1px)){.pagination .page-item:not(:first-child):not(:last-child){display:none}}@media all and (min-width: 850px){.pagination .page-item:not(:last-child){margin-right:.7rem}}.pagination .page-item .page-link{color:var(--btn-patinator-text-color);padding:0 .6rem;display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;border-radius:.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,.57)}@media all and (min-width: 850px){.pagination .page-index{display:none}}.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:"•";padding-left:.25rem;padding-right:.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)}.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}.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:.5rem}.post-tail-wrapper .share-wrapper .share-icons button{padding:0;border:none;line-height:inherit}@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}}.share-mastodon{--wc-stm-font-family: v.$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}@media all and (max-width: calc(850px - 1px)){.post-navigation{padding-left:0;padding-right:0;margin-left:-0.5rem;margin-right:-0.5rem}}.post-navigation .btn:not(:hover){color:var(--link-color)}.post-navigation .btn:hover:not(.disabled)::before{color:#f5f5f5}.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:.65rem;text-transform:uppercase;content:attr(aria-label)}.post-navigation .btn:first-child{border-radius:10px 0 0 10px;left:.5px}.post-navigation .btn:last-child{border-radius:0 10px 10px 0;right:.5px}.post-navigation p{font-size:1.1rem;line-height:1.5rem;margin-top:.3rem;white-space:normal}@media(hover: hover){.post-navigation .btn,.post-navigation .btn::before{transition:all .35s ease-in-out}}@-webkit-keyframes fade-up{from{opacity:0;margin-top:4rem}to{opacity:1}}@keyframes fade-up{from{opacity:0;margin-top:4rem}to{opacity:1}}#toc-wrapper::before,.toc-border-cover{content:"";display:block;position:-webkit-sticky;position:sticky;top:0;width:100%;height:3rem;background:linear-gradient(var(--main-bg) 50%, transparent)}#toc-wrapper{top:0;transition:top .2s ease-in-out;overflow-y:auto;max-height:100vh;scrollbar-width:none;margin-top:2rem}#toc-wrapper:not(.invisible){-webkit-animation:fade-up .8s;animation:fade-up .8s}#toc-wrapper ul{list-style:none;font-size:.85rem;line-height:1.25;padding-left:0}#toc-wrapper ul li a{padding:.4rem 0 .4rem 1.25rem}#toc-wrapper ul .toc-link{display:block}#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;height:1.25rem;background-color:var(--toc-highlight) !important}#toc-wrapper ul ul{padding-left:.75rem}.toc-border-cover{margin-bottom:-4rem}#toc-wrapper::after{content:"";position:fixed;bottom:0;width:15%;height:2.25rem;margin-left:-1px;background:linear-gradient(transparent, var(--main-bg) 70%)}#toc-bar{position:-webkit-sticky;position:sticky;top:0;z-index:1;margin:0 -1rem;height:3rem;background:var(--main-bg);border-bottom:1px solid var(--main-border-color);transition:all .2s ease-in-out}@media all and (min-width: 1200px){#toc-bar{display:none !important}}#toc-bar .label{margin-left:.375rem;padding:0 .75rem;color:inherit}#toc-bar.invisible{top:-3rem;transition:none}#toc-solo-trigger{color:var(--text-muted-color);border-color:var(--btn-border-color);border-radius:10px}@media all and (min-width: 1200px){#toc-solo-trigger{display:none !important}}#toc-solo-trigger .label{font-size:1rem;font-family:Lato,"Microsoft Yahei",sans-serif}#toc-solo-trigger:hover{box-shadow:none;background:none}@-webkit-keyframes slide-in{from{opacity:.7;transform:translateY(-3rem)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in{from{opacity:.7;transform:translateY(-3rem)}to{opacity:1;transform:translateY(0)}}@-webkit-keyframes slide-out{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-3rem);opacity:0}}@keyframes slide-out{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-3rem);opacity:0}}#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:.9rem;margin-bottom:.5rem;white-space:break-spaces;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}#disqus_thread{min-height:8.5rem}.utterances{max-width:100%;min-height:269px}.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: 768px){.content>p>img{max-width:calc(100% + 1rem)}}@media all and (min-width: 1200px){h2,h3,h4{scroll-margin-top:2rem}}.categories i{color:gray}.categories{margin-bottom:2rem;border-color:var(--categories-border)}.categories .card-header{padding:.75rem;border-radius:9px;border-bottom:0}.categories .card-header.hide-border-bottom{border-bottom-left-radius:0;border-bottom-right-radius:0}.categories i{font-size:86%}.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}.category-trigger{width:1.7rem;height:1.7rem;border-radius:50%;text-align:center;color:#6c757d !important}.category-trigger i{position:relative;height:.7rem;width:1rem;transition:transform 300ms ease}.category-trigger:hover i{color:var(--categories-icon-hover-color)}@media(hover: hover){.category-trigger:hover{background-color:var(--categories-hover-bg)}}.rotate{transform:rotate(-90deg)}.tag{border-radius:.7em;padding:6px 8px 7px;margin-right:.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:.6em;font-size:.7em;font-family:Oswald,sans-serif}@media all and (max-width: calc(850px - 1px)){#tags{justify-content:center !important}}#archives{letter-spacing:.03rem}@media all and (max-width: calc(576px - 1px)){#archives{margin-top:-1rem}#archives ul{letter-spacing:0}}#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}#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}#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:.5rem}#archives .date.month{width:1.4rem;text-align:center}#archives .date.day{font-size:85%;font-family:Lato,sans-serif}#archives a{margin-left:2.5rem;position:relative;top:.1rem}#archives a:hover{border-bottom:none}#archives a::before{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}.dash{margin:0 .5rem .6rem .5rem;border-bottom:2px dotted var(--dash-color)}#page-category ul>li,#page-tag ul>li{line-height:1.5rem;padding:.6rem 0}#page-category ul>li::before,#page-tag ul>li::before{background:#999;width:5px;height:5px;border-radius:50%;display:block;content:"";position:relative;top:.6rem;margin-right:.5rem}@media all and (max-width: calc(576px - 1px)){#page-category ul>li::before,#page-tag ul>li::before{margin:0 .5rem}}#page-category ul>li>a,#page-tag ul>li>a{font-size:1.1rem}@media all and (max-width: calc(576px - 1px)){#page-category ul>li>a,#page-tag ul>li>a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}#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}@keyframes infirot{from{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}.icon-loading1{display:inline-block;animation:infirot 1s linear infinite;-webkit-animation:infirot 1s linear infinite}#animation{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none}@keyframes animate{0%{transform:translateY(0) rotate(0deg);opacity:1;border-radius:0}100%{transform:translateY(-1200px) rotate(720deg);opacity:0;border-radius:50%}}@media all and (min-width: 1200px){#animation .animation-circle{position:absolute;left:var(--circle-left);bottom:-300px;display:block;background:var(--circle-background);width:var(--circle-side-length);height:var(--circle-side-length);animation:animate 25s linear infinite;animation-duration:var(--circle-time);animation-delay:var(--circle-delay);pointer-events:none}#animation .animation-circle:nth-child(0){--circle-left: 63%;--circle-background: rgba(68, 126, 68, 0.06);--circle-side-length: 159px;--circle-time: 44s;--circle-delay: 1s}#animation .animation-circle:nth-child(1){--circle-left: 100%;--circle-background: rgba(59, 138, 214, 0.06);--circle-side-length: 131px;--circle-time: 40s;--circle-delay: 24s}#animation .animation-circle:nth-child(2){--circle-left: 66%;--circle-background: rgba(85, 18, 176, 0.06);--circle-side-length: 28px;--circle-time: 36s;--circle-delay: 6s}#animation .animation-circle:nth-child(3){--circle-left: 38%;--circle-background: rgba(6, 79, 4, 0.06);--circle-side-length: 90px;--circle-time: 33s;--circle-delay: 16s}#animation .animation-circle:nth-child(4){--circle-left: 58%;--circle-background: rgba(35, 231, 223, 0.06);--circle-side-length: 111px;--circle-time: 18s;--circle-delay: 11s}#animation .animation-circle:nth-child(5){--circle-left: 41%;--circle-background: rgba(135, 176, 54, 0.06);--circle-side-length: 64px;--circle-time: 31s;--circle-delay: 24s}#animation .animation-circle:nth-child(6){--circle-left: 50%;--circle-background: rgba(70, 169, 192, 0.06);--circle-side-length: 126px;--circle-time: 45s;--circle-delay: 16s}#animation .animation-circle:nth-child(7){--circle-left: 75%;--circle-background: rgba(243, 99, 138, 0.06);--circle-side-length: 93px;--circle-time: 20s;--circle-delay: 20s}#animation .animation-circle:nth-child(8){--circle-left: 99%;--circle-background: rgba(138, 100, 169, 0.06);--circle-side-length: 78px;--circle-time: 22s;--circle-delay: 14s}#animation .animation-circle:nth-child(9){--circle-left: 68%;--circle-background: rgba(95, 163, 180, 0.06);--circle-side-length: 105px;--circle-time: 15s;--circle-delay: 13s}#animation .animation-circle:nth-child(10){--circle-left: 5%;--circle-background: rgba(61, 24, 57, 0.06);--circle-side-length: 62px;--circle-time: 21s;--circle-delay: 9s}#animation .animation-circle:nth-child(11){--circle-left: 23%;--circle-background: rgba(145, 177, 16, 0.06);--circle-side-length: 128px;--circle-time: 37s;--circle-delay: 21s}#animation .animation-circle:nth-child(12){--circle-left: 87%;--circle-background: rgba(80, 230, 112, 0.06);--circle-side-length: 178px;--circle-time: 19s;--circle-delay: 9s}#animation .animation-circle:nth-child(13){--circle-left: 45%;--circle-background: rgba(27, 136, 102, 0.06);--circle-side-length: 97px;--circle-time: 32s;--circle-delay: 14s}#animation .animation-circle:nth-child(14){--circle-left: 98%;--circle-background: rgba(182, 102, 7, 0.06);--circle-side-length: 84px;--circle-time: 24s;--circle-delay: 9s}#animation .animation-circle:nth-child(15){--circle-left: 1%;--circle-background: rgba(130, 77, 165, 0.06);--circle-side-length: 82px;--circle-time: 31s;--circle-delay: 4s}#animation .animation-circle:nth-child(16){--circle-left: 0%;--circle-background: rgba(70, 233, 86, 0.06);--circle-side-length: 81px;--circle-time: 25s;--circle-delay: 15s}#animation .animation-circle:nth-child(17){--circle-left: 11%;--circle-background: rgba(217, 196, 217, 0.06);--circle-side-length: 124px;--circle-time: 42s;--circle-delay: 14s}#animation .animation-circle:nth-child(18){--circle-left: 59%;--circle-background: rgba(84, 239, 255, 0.06);--circle-side-length: 161px;--circle-time: 42s;--circle-delay: 18s}#animation .animation-circle:nth-child(19){--circle-left: 44%;--circle-background: rgba(216, 91, 206, 0.06);--circle-side-length: 64px;--circle-time: 15s;--circle-delay: 17s}#animation .animation-circle:nth-child(20){--circle-left: 55%;--circle-background: rgba(212, 71, 68, 0.06);--circle-side-length: 58px;--circle-time: 30s;--circle-delay: 15s}#animation .animation-circle:nth-child(21){--circle-left: 10%;--circle-background: rgba(134, 125, 5, 0.06);--circle-side-length: 91px;--circle-time: 40s;--circle-delay: 22s}#animation .animation-circle:nth-child(22){--circle-left: 51%;--circle-background: rgba(244, 149, 132, 0.06);--circle-side-length: 190px;--circle-time: 43s;--circle-delay: 14s}#animation .animation-circle:nth-child(23){--circle-left: 77%;--circle-background: rgba(16, 226, 58, 0.06);--circle-side-length: 57px;--circle-time: 35s;--circle-delay: 15s}#animation .animation-circle:nth-child(24){--circle-left: 45%;--circle-background: rgba(98, 143, 125, 0.06);--circle-side-length: 177px;--circle-time: 35s;--circle-delay: 11s}#animation .animation-circle:nth-child(25){--circle-left: 11%;--circle-background: rgba(194, 241, 44, 0.06);--circle-side-length: 198px;--circle-time: 31s;--circle-delay: 16s}#animation .animation-circle:nth-child(26){--circle-left: 20%;--circle-background: rgba(35, 103, 240, 0.06);--circle-side-length: 183px;--circle-time: 12s;--circle-delay: 19s}#animation .animation-circle:nth-child(27){--circle-left: 58%;--circle-background: rgba(153, 79, 168, 0.06);--circle-side-length: 166px;--circle-time: 17s;--circle-delay: 6s}#animation .animation-circle:nth-child(28){--circle-left: 73%;--circle-background: rgba(222, 203, 69, 0.06);--circle-side-length: 26px;--circle-time: 22s;--circle-delay: 18s}#animation .animation-circle:nth-child(29){--circle-left: 72%;--circle-background: rgba(237, 167, 242, 0.06);--circle-side-length: 58px;--circle-time: 32s;--circle-delay: 15s}#animation .animation-circle:nth-child(30){--circle-left: 31%;--circle-background: rgba(226, 189, 248, 0.06);--circle-side-length: 98px;--circle-time: 43s;--circle-delay: 6s}#animation .animation-circle:nth-child(31){--circle-left: 91%;--circle-background: rgba(211, 173, 243, 0.06);--circle-side-length: 36px;--circle-time: 23s;--circle-delay: 2s}#animation .animation-circle:nth-child(32){--circle-left: 88%;--circle-background: rgba(152, 172, 174, 0.06);--circle-side-length: 102px;--circle-time: 24s;--circle-delay: 11s}#animation .animation-circle:nth-child(33){--circle-left: 80%;--circle-background: rgba(120, 204, 115, 0.06);--circle-side-length: 143px;--circle-time: 17s;--circle-delay: 17s}#animation .animation-circle:nth-child(34){--circle-left: 79%;--circle-background: rgba(118, 114, 165, 0.06);--circle-side-length: 108px;--circle-time: 44s;--circle-delay: 19s}#animation .animation-circle:nth-child(35){--circle-left: 54%;--circle-background: rgba(182, 209, 207, 0.06);--circle-side-length: 43px;--circle-time: 42s;--circle-delay: 12s}#animation .animation-circle:nth-child(36){--circle-left: 81%;--circle-background: rgba(227, 152, 249, 0.06);--circle-side-length: 54px;--circle-time: 23s;--circle-delay: 9s}#animation .animation-circle:nth-child(37){--circle-left: 46%;--circle-background: rgba(188, 253, 124, 0.06);--circle-side-length: 143px;--circle-time: 19s;--circle-delay: 9s}#animation .animation-circle:nth-child(38){--circle-left: 82%;--circle-background: rgba(135, 81, 226, 0.06);--circle-side-length: 28px;--circle-time: 42s;--circle-delay: 9s}#animation .animation-circle:nth-child(39){--circle-left: 48%;--circle-background: rgba(19, 237, 235, 0.06);--circle-side-length: 28px;--circle-time: 13s;--circle-delay: 16s}#animation .animation-circle:nth-child(40){--circle-left: 97%;--circle-background: rgba(196, 72, 9, 0.06);--circle-side-length: 55px;--circle-time: 39s;--circle-delay: 6s}#animation .animation-circle:nth-child(41){--circle-left: 19%;--circle-background: rgba(139, 174, 244, 0.06);--circle-side-length: 83px;--circle-time: 22s;--circle-delay: 15s}#animation .animation-circle:nth-child(42){--circle-left: 6%;--circle-background: rgba(206, 47, 85, 0.06);--circle-side-length: 49px;--circle-time: 17s;--circle-delay: 21s}#animation .animation-circle:nth-child(43){--circle-left: 57%;--circle-background: rgba(155, 82, 240, 0.06);--circle-side-length: 34px;--circle-time: 33s;--circle-delay: 24s}#animation .animation-circle:nth-child(44){--circle-left: 36%;--circle-background: rgba(58, 112, 29, 0.06);--circle-side-length: 24px;--circle-time: 41s;--circle-delay: 24s}#animation .animation-circle:nth-child(45){--circle-left: 6%;--circle-background: rgba(232, 247, 40, 0.06);--circle-side-length: 133px;--circle-time: 44s;--circle-delay: 3s}#animation .animation-circle:nth-child(46){--circle-left: 50%;--circle-background: rgba(210, 210, 167, 0.06);--circle-side-length: 52px;--circle-time: 30s;--circle-delay: 25s}#animation .animation-circle:nth-child(47){--circle-left: 21%;--circle-background: rgba(8, 248, 137, 0.06);--circle-side-length: 31px;--circle-time: 19s;--circle-delay: 11s}#animation .animation-circle:nth-child(48){--circle-left: 23%;--circle-background: rgba(16, 175, 127, 0.06);--circle-side-length: 137px;--circle-time: 36s;--circle-delay: 22s}#animation .animation-circle:nth-child(49){--circle-left: 24%;--circle-background: rgba(63, 10, 109, 0.06);--circle-side-length: 110px;--circle-time: 17s;--circle-delay: 20s}#animation .animation-circle:nth-child(50){--circle-left: 92%;--circle-background: rgba(131, 127, 83, 0.06);--circle-side-length: 155px;--circle-time: 19s;--circle-delay: 3s}}@media all and (max-width: 1199px){#animation .animation-circle{display:none}}.card-wrapper.card{border:3px solid #e3e5e7 !important;padding:2px;margin-bottom:2px;border-radius:8px;background-color:#f9f9f9;box-shadow:0 4px 6px rgba(0,0,0,.1);transition:transform .3s ease,box-shadow .3s ease}.card-wrapper.card:hover{transform:translateY(-5px);box-shadow:0 8px 12px rgba(0,0,0,.2)}#sidebar{background-image:url("/assets/img/background-dark.jpg");background-size:cover;background-repeat:no-repeat;background-position:top}#sidebar .site-title a{color:#fff;text-shadow:5px 5px 10px rgba(0,0,0,.5)}#sidebar .site-subtitle{color:#fff;text-shadow:2px 2px 3px rgba(0,0,0,.7)}#sidebar .sidebar-bottom .mode-toggle,#sidebar a{color:#fff}#sidebar .sidebar-bottom .btn{color:var(--sidebar-btn-color)}/*# sourceMappingURL=jekyll-theme-chirpy.css.map */
\ No newline at end of file
diff --git a/_site/assets/css/jekyll-theme-chirpy.css.map b/_site/assets/css/jekyll-theme-chirpy.css.map
index a8226d3..9bb7de7 100644
--- a/_site/assets/css/jekyll-theme-chirpy.css.map
+++ b/_site/assets/css/jekyll-theme-chirpy.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/base/_reset.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/abstracts/_mixins.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/abstracts/_placeholders.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/abstracts/_variables.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/base/_base.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/themes/_light.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/themes/_dark.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/abstracts/_breakpoints.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/base/_typography.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/base/_syntax.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/components/_buttons.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/components/_popups.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/layout/_sidebar.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/layout/_topbar.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/layout/_panel.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/layout/_footer.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_search.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_home.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_post.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_categories.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_tags.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_archives.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_category-tag.scss","jekyll-theme-chirpy.scss"],"names":[],"mappings":"CAEA,4BC8BE,yCD1BF,mBC0BE,yCDtBF,uBCsBE,yCDlBF,wBCkBE,yCDdF,cCcE,yCDVF,kCCcE,WDVF,yBCUE,WDNF,6BCME,WDFF,8BCEE,WDEF,oBCFE,WCjCF,mEACE,2BACA,gBACA,YCuBoB,kCDtBpB,yBAIA,4CACE,cAGF,qBACE,4CACE,kBACA,UACA,2DAIA,oEACE,mBACA,UACA,0DAMR,sCACE,4BACA,uCAGF,+DACE,mBACA,cACA,mBAGF,2QACE,yBACA,gCACA,qBAGF,4CACE,wBAGF,sEACE,oDAGF,0EACE,+BAGF,gFACE,yBACA,sBACA,qBACA,iBAGF,6LACE,mBAGF,yFACE,eAGF,4EACE,kBAGF,wMACE,cClEU,KDsEV,oDACE,cACA,kBACA,kBACA,cACA,UACA,cAIJ,iDACE,iCACA,yBACA,sBACA,qBACA,iBAGF,iHACE,oBACA,gBACA,uBACA,qBACA,4BAGF,4ID9GE,gBACA,uBACA,mBCgHF,qGACE,wCACA,gBAGF,kFACE,iBAGF,2BACE,gBAIA,mCACE,2CACA,uBACA,0BACA,kBACA,8CAKF,+DACE,WAIJ,kDACE,2CAGF,cACE,kBACA,qBAOF,+BACE,+CEvJF,MACE,eAIA,oCACE,4CCXF,iBACA,mBACA,6BAGA,sBACA,4BACA,sCACA,yBACA,uBACA,mCACA,iCACA,sBACA,gCACA,qBACA,4BACA,+BACA,sCACA,0BACA,kCACA,oFAKA,2HAQA,uCACA,+BACA,sBACA,gCACA,+BACA,gCACA,6CACA,wBACA,6BACA,6BAGA,qCACA,qCACA,0CACA,6BACA,oCAGA,gCACA,oCACA,+CAGA,yBACA,oCACA,wBACA,iCACA,iBACA,yBACA,yFAEA,gCACA,qBACA,2BACA,qBACA,0BACA,oCACA,sBACA,2CACA,yCACA,iCACA,0BACA,kCACA,wCACA,qCACA,6CACA,oCAGA,sBACA,sCACA,gCACA,yBAGA,0CACA,+CACA,6CAGA,uCACA,4BACA,mCAGA,iCACA,8BACA,mCACA,kCACA,yCACA,sBACA,kCACA,mCACA,kCACA,mCAEA,8EACE,2CAGF,wDACE,aAKF,oFACE,YAGF,sFACE,SAGF,0IAEE,cACA,yBAGF,ogBAOE,cAGF,0EACE,cAGF,0EACE,cACA,yBAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cACA,yBAGF,0EACE,cAGF,guBAUE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,kXAKE,cAGF,kJAEE,cAGF,0EACE,cACA,iBAGF,0EACE,cACA,iBAGF,4yBAWE,cAGF,0EACE,cAGF,oJAEE,cAGF,4EACE,cACA,yBAGF,glBAQE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cACA,kBAGF,0EACE,cACA,iBDpSA,qBEjBF,kBAGA,2BACA,2BACA,qCAGA,iCACA,4BACA,sCACA,yBACA,uBACA,2CACA,iCACA,iCACA,0CACA,qBACA,4BACA,yCACA,sCACA,0BACA,qCACA,4CACA,4EACA,0HAQA,4BACA,+BACA,sBACA,gCACA,+BACA,iDACA,4BACA,0BACA,6BACA,+CAGA,mCACA,uCACA,uCACA,wCACA,+CAGA,2CACA,8CACA,qCAGA,oCACA,kCACA,6BACA,qBACA,8BACA,oCACA,uCACA,2BACA,iCACA,mBACA,yBACA,sFAEA,0BACA,0BACA,wBACA,8CACA,uCACA,gDACA,uCACA,kCACA,0CACA,mDACA,wCACA,oCAGA,8BACA,8BACA,8BACA,yBAGA,0CACA,uCACA,qCAGA,uCACA,kCACA,iDAGA,iCACA,8BACA,mCACA,kCACA,4CACA,sBACA,kCACA,mCACA,kCACA,mCACA,+BAEA,4BACE,aAIF,4EAEE,gCAIA,8CACE,uCAGF,kDACE,iBACA,kBACA,kBACA,sCAEA,6DACE,mCAKN,iDACE,+HAWF,oCACE,kBAKF,oCACE,cAGF,yCACE,YAGF,0CACE,SAGF,mEAEE,cACA,yBAGF,qCACE,cACA,yBAGF,4PAOE,cAGF,oCACE,cAGF,oCACE,cAGF,uEAEE,cAGF,uEAEE,cAGF,oCACE,cAGF,oCACE,cACA,yBAGF,oCACE,cACA,yBACA,iBAGF,mLAKE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,mUASE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,+RAQE,cAGF,oCACE,eFrRF,mCACE,2CEvBF,kBAGA,2BACA,2BACA,qCAGA,iCACA,4BACA,sCACA,yBACA,uBACA,2CACA,iCACA,iCACA,0CACA,qBACA,4BACA,yCACA,sCACA,0BACA,qCACA,4CACA,4EACA,0HAQA,4BACA,+BACA,sBACA,gCACA,+BACA,iDACA,4BACA,0BACA,6BACA,+CAGA,mCACA,uCACA,uCACA,wCACA,+CAGA,2CACA,8CACA,qCAGA,oCACA,kCACA,6BACA,qBACA,8BACA,oCACA,uCACA,2BACA,iCACA,mBACA,yBACA,sFAEA,0BACA,0BACA,wBACA,8CACA,uCACA,gDACA,uCACA,kCACA,0CACA,mDACA,wCACA,oCAGA,8BACA,8BACA,8BACA,yBAGA,0CACA,uCACA,qCAGA,uCACA,kCACA,iDAGA,iCACA,8BACA,mCACA,kCACA,4CACA,sBACA,kCACA,mCACA,kCACA,mCACA,+BAEA,yDACE,aAIF,0JAEE,gCAIA,6FACE,uCAGF,qGACE,iBACA,kBACA,kBACA,sCAEA,2HACE,mCAKN,mGACE,+HAWF,yEACE,kBAKF,yEACE,cAGF,mFACE,YAGF,qFACE,SAGF,wIAEE,cACA,yBAGF,2EACE,cACA,yBAGF,+fAOE,cAGF,yEACE,cAGF,yEACE,cAGF,gJAEE,cAGF,gJAEE,cAGF,yEACE,cAGF,yEACE,cACA,yBAGF,yEACE,cACA,yBACA,iBAGF,2WAKE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,+oBASE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,skBAQE,cAGF,yEACE,cF/QA,sBC3BF,iBACA,mBACA,6BAGA,sBACA,4BACA,sCACA,yBACA,uBACA,mCACA,iCACA,sBACA,gCACA,qBACA,4BACA,+BACA,sCACA,0BACA,kCACA,oFAKA,2HAQA,uCACA,+BACA,sBACA,gCACA,+BACA,gCACA,6CACA,wBACA,6BACA,6BAGA,qCACA,qCACA,0CACA,6BACA,oCAGA,gCACA,oCACA,+CAGA,yBACA,oCACA,wBACA,iCACA,iBACA,yBACA,yFAEA,gCACA,qBACA,2BACA,qBACA,0BACA,oCACA,sBACA,2CACA,yCACA,iCACA,0BACA,kCACA,wCACA,qCACA,6CACA,oCAGA,sBACA,sCACA,gCACA,yBAGA,0CACA,+CACA,6CAGA,uCACA,4BACA,mCAGA,iCACA,8BACA,mCACA,kCACA,yCACA,sBACA,kCACA,mCACA,kCACA,mCAEA,uCACE,2CAGF,4BACE,aAKF,0CACE,YAGF,2CACE,SAGF,qEAEE,cACA,yBAGF,kQAOE,cAGF,qCACE,cAGF,qCACE,cACA,yBAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cACA,yBAGF,qCACE,cAGF,gXAUE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,yLAKE,cAGF,yEAEE,cAGF,qCACE,cACA,iBAGF,qCACE,cACA,iBAGF,sZAWE,cAGF,qCACE,cAGF,0EAEE,cAGF,sCACE,cACA,yBAGF,wSAQE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cACA,kBAGF,qCACE,cACA,kBEzQF,kCHlCF,KAwBI,mBAIJ,KACE,0BACA,kHAEA,wBACA,mCACA,YDjBiB,+CIRjB,8CH4BF,iBAEI,aAEA,0BACE,mBGUJ,mCHJA,YAEI,iCAKN,aACE,mBACA,WACA,YACA,gBAIA,yBACE,yBAGF,iBACE,YACA,oBACA,iBAIS,4BACP,WAKN,cAGE,SACA,0BACA,8BAEA,sBAGE,WACA,WACA,YACA,kBACA,sCACA,UACA,oCAIA,4BACE,WAmBN,SACE,kBACA,gBACA,yBGnFA,mCHgFF,SAMI,mBAIA,iBHtIF,WGyIsB,MHxItB,cGwIsB,MAElB,eAcF,8FAEE,8BACA,6BAEA,0GACE,gBACA,oBAGF,oNAEE,8BACA,6BACA,eAKN,sBACE,8BACA,6BAEA,yBACE,qBACA,eAGA,2BACE,WACA,qBACA,4BAEA,mCACE,oCAIJ,4BACE,8BACA,6BAIJ,2CACE,6BACA,sBAIJ,eACE,iBAGF,kBACE,8BG1KF,kCH6KA,8BAEI,eASN,UACE,qBACA,eACA,kBACA,oBACA,yCACA,gBACA,8BACA,mBAEA,2BACE,mBAIJ,YACE,8BAGF,UACE,oBACA,oBAGF,SACE,gBACA,kBACA,yBAEA,iBACE,WACA,kBACA,6BACA,YACA,WACA,wCACA,gCAGF,2BACE,GACE,4BAGF,KACE,4BAIJ,mBACE,GACE,4BAGF,KACE,4BAKN,aACE,WACA,YACA,mBACA,kBAIA,oBACE,qBAGF,kBACE,cACA,WACA,YACA,eACA,gBACA,YACA,gBAMJ,aACE,WACA,cAOF,aACE,uBAGF,gBACE,8BAIF,YACE,yCAIF,eACE,gBACA,gBACA,gBAKA,8CACE,gCAIJ,UACE,cACA,oBACA,mBAGF,oBACE,8BAGF,aACE,gBACA,wDACA,6BACA,2EAGF,MACE,WACA,0BAGF,OACE,YACA,0BAMF,SACE,kBAIF,cACE,kBACA,0BAGF,qBACE,iCACE,wBAGF,UACE,4CAGF,cACE,8CAIJ,MACE,cAGF,cACE,kBH/XE,aGiYgB,EHhYhB,cGgYgB,EGvYlB,8CHoYF,cH/UI,WALM,oBMvBR,kCH2WF,cAUI,YDhaY,OI6Dd,mCHyVF,cAcI,YDnakB,OCsapB,yBACE,iBG/YF,kCH8YA,yBH3VA,eApDE,aGoZoB,EHnZpB,cGmZoB,GG1ZtB,8CHqZA,yBASI,gBG7WJ,qEHkXI,oCACE,aACA,eGraN,+CH0aI,8BACE,mCGhYN,mCH0WA,yBA2BI,UDvbmB,OFUrB,gCACA,kCGqbJ,8EHjcE,YGockB,EHnclB,aGmckB,EGjZlB,mCHoZF,cAEI,iCAGF,2BACE,gBI7bE,GACE,eAVA,QAEI,wBAON,GACE,kBAVA,QAII,mBAKN,GACE,kBAVA,QAII,mBAKN,GACE,kBAvBN,GA0BI,kBAKN,EAGE,qBAGF,IACE,eACA,YACA,gCAEA,UAGE,0BACA,kBAIJ,WACE,yDACA,kBACA,mCACA,iBAEA,wBACE,gBAGF,2BACE,cACA,kBACA,4BACA,+BAIA,mCACE,kBACA,WACA,kBACA,YACA,iBACA,oBACA,mCP7BJ,sBACE,sCAEA,8BACE,QO6BsB,IP5BtB,mCACA,4BANJ,uBACE,uCAEA,+BACE,QO8BuB,IP7BvB,oCACA,0BAGE,yBATN,0BACE,0CAEA,kCACE,QO+B0B,IP9B1B,uCACA,0BANJ,yBACE,yCAEA,iCACE,QOgCyB,IP/BzB,sCACA,0BOiCN,IACE,4BACA,qBACA,sBACA,mBACA,kBACA,kBACA,eACA,kBACA,4BACA,qCACA,cLxFU,IKyFV,uCACA,gDAGF,GACE,sCACA,UAGF,OACE,gCACA,OLvGc,KKwGd,8CAgBA,SACE,kBACA,gBAgBJ,KACE,iBAEA,QACE,gBD5GF,kCC2GA,QAII,iBAMA,mDPpHJ,kBACA,SACA,2BMrBA,kCCuJI,yCPtKJ,YOuKwB,MPtKxB,aOsKwB,MAElB,gBACA,gBAMR,cACE,kBACA,iBAGE,kCACE,oBAKF,mBACE,kBPjMJ,WOmMsB,EPlMtB,cOkMsB,EAMb,WPpMT,YOqMoB,IPpMpB,aOoMoB,IPvLlB,aOwLkB,IPvLlB,cOuLkB,IAElB,oCAKO,kBACP,gBACA,cACA,kBACA,aACA,kBACA,oCAOJ,eACE,gBACA,qBAEA,qBACE,eACA,gBACA,iBAEA,2BACE,8CAQA,8BACE,+CAEA,4CACE,mCAGF,8CACE,kCC3PV,mBACE,qCACA,iBACA,oBAGF,WAIE,cACA,sBAMA,eACE,gBACA,UNJa,OMKb,mBACA,iBAKE,gCACE,qBACA,iBACA,oBAGF,+BACE,8BAGF,wBACE,iBACA,kBAKN,mBACE,iBACA,oCACA,yBACA,sBACA,oBACA,qBACA,iBAIJ,KACE,qBACA,iBACA,aACA,wBAEA,uBACE,UN9Ca,OM+Cb,gBACA,sBACA,cNvDQ,IMwDR,uCAGF,cACE,yBACA,iCACA,gBACA,UAGF,yBACE,iBACA,cAGF,+BACE,mBAGF,gBACE,cAWF,gBACE,yBACA,8BACA,oBAIJ,sBAIE,kDAEA,+BRtGA,YQuGoB,MRtGpB,aQsGoB,MAElB,gBFpFF,kCEiFA,+BRtGA,YQ4GsB,ER3GtB,aQ2GsB,EAElB,cN3GM,MIkBV,kCE6FA,mCRlHA,YQoHsB,ERnHtB,aQmHsB,EAIlB,2CACE,WACA,qBACA,YALW,KAMX,MNlHQ,OMmHR,ONnHQ,OMoHR,kBACA,gDACA,gGAMF,wCAEE,uBAKN,iCACE,yBACA,0BAUA,2IACE,qBACA,eAEA,2KACE,aAMR,aAGE,aACA,8BACA,mBACA,ONjKmB,QMkKnB,mBACA,oBAGA,kBACE,YNvKiB,QM0KjB,oBACE,eACA,MNzKY,QM0KZ,oCAEA,0BACE,cAIK,2BACP,kBACA,QAIF,yBACE,8BACA,iBACA,gBACA,oCAKJ,oBAIE,+BACA,ONxMiB,QMyMjB,MNzMiB,QM0MjB,UACA,yBAEA,sBACE,oCAIA,mCACE,4CAGF,+BACE,qCAIJ,0BACE,aAGF,yCACE,uCAEA,2CACE,WCrPR,aACE,kBACA,UACA,UACA,eACA,eACA,WACA,gBACA,4BACA,iCACA,UACA,MPEc,QODd,OPCc,0BOCd,mDACA,0DH2BA,kCG1CF,aAkBI,SACA,iBHmCF,mCGtDF,aAuBI,+CHqCF,mCG5DF,aA2BI,+CAKF,mBACE,kCACA,0CAGF,eACE,YPzBY,QO0BZ,kBACA,WAGF,kBACE,UACA,mBC1CF,yBACE,KACE,UACA,UAIJ,iBACE,KACE,UACA,UAIJ,4BACE,gBACA,mBACA,cAGF,0BACE,4BACA,oBAEA,iCACE,cACA,eAKF,yBACE,cACA,gBACA,oBACA,mCACA,2BACA,oCACA,iCACA,eACA,SACA,WACA,2BACA,4BACA,oBAKN,WAME,2CACA,iBACA,cRhDU,KQiDV,wBACA,0BACA,WRzDc,KQ0Dd,gBACA,kBJnCA,kCIsBF,WAgBI,iBAGF,iBACE,kBAnBS,sBAoBT,UApBS,sBAuBX,oBACE,kBAvBU,uBAwBV,UAxBU,uBJZZ,kCIUF,WA8BI,KRnFY,OQsFd,mBAGE,wBACA,gBACA,MACA,yBACA,iDAEA,0BACE,YRrEgB,kCQ0ElB,oBACE,kBACA,sBAGF,gCACE,gBAIJ,cACE,qBACA,eAGE,wCAEE,kBAGF,mBACE,aACA,gBACA,kBACA,uBAEA,oCACE,aAON,0BACE,sBADF,0BACE,qBADF,0BACE,sBAIJ,2BACE,sCACA,gBAGF,6BACE,wBAzFS,UA0FT,gBA1FS,UA6FX,qBACE,wBA9FS,UA+FT,gBA/FS,UAkGX,kBACE,aACA,WACA,kBACA,4DACA,OAxGe,KA2GjB,8BACE,cACA,+BACA,YR3IkB,kCQ4IlB,oBChKJ,SXiBI,aWhBgB,EXiBhB,cWjBgB,EAElB,eACA,MACA,OACA,YACA,gBACA,MTfc,MSgBd,6BACA,mDAGA,wBACA,qBAGA,4BACE,aLPF,8CKXF,SXgEI,WALM,mBWnCN,6BACA,qCAEA,2BACE,yBL0BJ,mCKtDF,SAiCI,MTvCkB,OS2ClB,wGACE,kCAQJ,iBACE,cACA,aACA,cACA,gBACA,gDACA,wBL5BF,kCKsBA,iBASI,WACA,aAGF,qBACE,yBAEA,2BACE,qBAKN,0BXtEA,WWuEoB,OXtEpB,cWsEoB,OAGlB,oBACA,sBACA,WLtCF,kCKgCA,0BASI,iBLvBJ,mCKcA,0BAaI,kBACA,qBACA,qBAIJ,qBAIE,oBACA,gBACA,kBACA,gBACA,qBACA,mBACA,oBACA,kBACA,8BAGF,wBACE,cACA,iCACA,kBACA,iBACA,yBACA,sBACA,qBACA,iBAGF,YACE,mBAEA,wBACE,WACA,WXrGF,aWuGoB,OXtGpB,cWsGoB,OLlEtB,mCK8DE,wBXnGA,aW0GsB,QXzGtB,cWyGsB,SAGpB,mCXtHJ,YWuHwB,MXtHxB,eWsHwB,MAElB,aACA,mBACA,qBACA,gBAEA,yCACE,yCAGF,qCACE,cACA,WACA,oBAGF,wCACE,cACA,oBAKF,yCACE,kCACA,yCAEA,8CACE,UAKN,0CACE,kBAKN,yBACE,kBACA,mBACA,qBLpHF,mCKiHA,yBAMI,qBACA,uBAKF,iEACE,MAHS,QAIT,OAJS,QAKT,cAzLG,MA0LH,kBACA,+BACA,uCACA,kBACA,aACA,mBACA,uBAEA,yGACE,iDAGF,6EACE,yCASF,4CACE,aTnNK,MI2DX,mCKuJI,4CAII,aTrNM,MS0NZ,2BACE,YAtCS,QA+CX,sCX7NF,YW+NsB,sBX9NtB,aW8NsB,sBAElB,0CACA,WACA,MA1Oa,IA2Ob,OA3Oa,IA4Ob,kBACA,cA5OG,MLyDP,mCK0KE,sCX7NF,YWyOwB,qBXxOxB,aWwOwB,sBLjOxB,8CKwOA,gCAEI,6BCzPN,gBACE,OVGc,KUFd,kCNaA,8CMfF,gBZkEI,2CY3DA,QAOF,oBACE,eACA,8BACA,mBAQI,iDACE,YACA,gBNZR,8CMDA,oBAmBI,cN+BJ,qEMlDA,oBAuBI,UACA,gBACA,uBACA,oBACA,oBNnBJ,kCMXF,QZ8DE,gBM1DA,8CMJF,QAuCI,gBAIJ,cACE,aACA,iBACA,gBACA,uBACA,+BACA,kBACA,UACA,oBN/CA,8CMuCF,cAWI,eNzBF,kCMcF,cAeI,iBAIJ,iCAEE,aN5DA,8CM0DF,iCAKI,eC/EJ,QACE,SACA,+BACA,gBAEA,mBACE,wBACA,gBAGF,gBAGE,kBAEA,kCACE,gBAIJ,iBACE,gBAMF,8BACE,oBACA,oBbOF,MADwD,mBAExD,UaNoB,QbOpB,YAH2C,IaD3C,yBACE,oBACA,iBACA,oBACA,oBACA,wBAEA,+BACE,2BAIJ,2BACE,mBP/BF,+COSF,eA0BI,cAKF,kBACE,cCxDJ,OACE,gCACA,OZIc,KYHd,8CRYA,8CQfF,OdoEI,WALM,mBcrDN,OZHkB,KYIlB,kBAeF,SACE,kBACA,gBC7BJ,OACE,aACA,WACA,mBACA,4CACA,0BACA,gBAEA,SACE,UACA,gBACA,+BTKF,8CShBF,OAeI,cT0BF,kCSzCF,OAmBI,Ubbe,OIyCjB,mCS/CF,OAuBI,mBToCF,mCS3DF,OA2BI,qCAMJ,uBACE,aACA,YACA,WACA,cAEA,gCACE,gBTxBF,8CSiBF,uBAWI,WAEA,gCACE,kBTNJ,kCSRF,uBAmBI,Ub3CqB,Oa4CrB,kCAIJ,gBACE,oBTOA,qESJE,oBACE,iBAIJ,kBACE,iBACA,mBAWF,wBACE,WAEA,yCACE,mBTpCJ,mCSgCA,wBAQI,UAEA,uCACE,oBAGF,wCACE,mBAGF,kDACE,kBACA,aAIJ,2BACE,mBAIF,0BACE,cACA,oBACA,cAGF,0BAGE,yBACA,oBACA,qBACA,4BAMN,eACE,wBACA,aACA,mBAKF,cACE,kBACA,SACA,gBACA,qBACA,wBACA,YAEA,oBACE,gBThGF,mCSuFF,cAaI,gCAIJ,cACE,eT/GA,kCS8GF,cAII,cAGF,iBACE,qBAGF,wBACE,qBACA,iBACA,eACA,gCACA,YACA,cACA,wBAEA,gCACE,YACA,8BACA,oBC9KN,WACE,gBVwCA,kCUzCF,WAII,mBAIA,+BACE,qBAGF,0CACE,sBAIJ,iBACE,SACA,gBAEA,gEACE,4BVaJ,kCUdE,gEAII,6BAYJ,4BACE,YACA,aVJJ,kCUEE,4BAKI,iCAGF,wCAGE,sCACA,kBAGF,sFACE,yCVlBN,kCUqBI,uCAEI,4BAMA,iDAGE,gBACA,SASF,2DACE,mBV3CV,kCU0CQ,2DAII,qBAKN,0CAGE,cAGF,uDACE,cASV,YACE,wBACA,4BACA,6BVhEA,kCU6DF,YAMI,iBACA,wBAGF,oBACE,qBVjGF,8CUsGI,0DACE,cV9EN,kCUmFI,wCACE,oBAIJ,kCACE,sCACA,gBACA,oBACA,wBACA,yBACA,oBACA,SACA,yBAIA,yCACE,kDAMA,qDACE,mDAKN,gCACE,mBAEA,2CACE,4BVrHN,kCU0HA,wBAEI,cCpKN,qDACE,UACA,kBACA,qCAUA,kBAGE,mBACA,gBAIA,oCAdF,YACA,aAFe,OAGf,cAH6B,OAyBzB,uBACE,cAKN,qBACE,kBAIJ,mBAGE,gBACA,kDAEA,oCACE,mBAmBF,kCACE,sBACA,yBACA,sBACA,qBACA,iBAEA,kGACE,mBAGF,+CACE,aAEA,iDACE,6BAKF,iDAGE,kBASF,sDACE,UACA,YACA,oBXjFN,kCWyFF,kBAEI,kCAEA,kCACE,WACA,iBAKN,gBAEE,0CACA,iDACA,+DACA,6DACA,6DACA,qDACA,wCAEA,eAGF,WACE,iBXzHA,8CWoIF,iBjB9HI,aiBgIkB,EjB/HlB,ciB+HkB,EjB9IpB,YiB+IoB,QjB9IpB,aiB8IoB,SAMlB,kCACE,wBAIA,mDACE,cAIJ,+BAGE,oBACA,mBACA,gBACA,WAGF,yDACE,gBAGF,8BACE,8BACA,iBACA,yBACA,yBAGF,kCACE,4BACA,UAGF,iCACE,4BACA,WAIJ,mBACE,iBACA,mBACA,iBACA,mBAIJ,qBAEI,oDAEE,iCAKN,2BACE,KACE,UACA,gBAGF,GACE,WAIJ,mBACE,KACE,UACA,gBAGF,GACE,WAMJ,uCACE,WACA,cACA,wBACA,gBACA,MACA,WACA,YACA,4DAGF,aACE,MACA,+BACA,gBACA,iBACA,qBACA,gBAEA,6BACE,8BACA,sBAGF,gBACE,gBACA,iBACA,iBACA,eAGE,qBACE,8BAMJ,0BACE,cAIA,gCACE,2BACA,qBAGF,kCACE,aAIJ,gCACE,sCACA,gBAEA,wCACE,qBACA,UACA,eACA,iDAIJ,mBACE,oBAIK,kBAGP,oBAOF,oBACE,WACA,eACA,SACA,UACA,eACA,iBACA,4DAUJ,SACE,wBACA,gBACA,MACA,UACA,eACA,OfjVc,KekVd,0BACA,iDACA,+BX1SA,mCWiSF,SAcI,yBAGF,gBAGE,oBACA,iBACA,cAGF,mBACE,UACA,gBAIJ,kBACE,8BACA,qCACA,cfvWU,KIoCV,mCWgUF,kBAMI,yBAGF,yBACE,eACA,YfjWkB,kCeoWpB,wBACE,gBACA,gBA4BJ,4BAvBE,KACE,WACA,4BAGF,GACE,UACA,yBAoBJ,oBA3BE,KACE,WACA,4BAGF,GACE,UACA,yBAwBJ,6BAnBE,GACE,wBACA,UAGF,KACE,4BACA,WAgBJ,qBAvBE,GACE,wBACA,UAGF,KACE,4BACA,WAuBF,kBjB1YA,MADwD,mBAExD,UiB0YoB,OjBzYpB,YiByY4B,IAG5B,oBAIE,8BAGF,iBAGE,gBACA,oBACA,yBACA,oBACA,qBACA,4BAWJ,eACE,kBAGF,YACE,eACA,iBAGF,yDACE,8CAGF,ajBrbE,MiBsbgC,QjBrbhC,UiBqbkB,QjBpblB,YiBob2B,IAE3B,oBACE,YXtcF,kCW0cF,eAEI,6BXpbF,mCWwbF,SAII,wBC5eJ,cACE,WAGF,YACE,mBACA,sCAOA,yBAGE,eACA,cAHS,IAIT,gBAEA,4CACE,4BACA,6BAIJ,cAGE,cAGF,6BACE,iBACA,kBACA,kBAEA,yCACE,yBACA,0BAGF,wCACE,gBAKN,kBACE,aACA,cACA,kBACA,kBACA,yBAEA,oBACE,kBACA,aACA,WACA,gCAIA,0BACE,yCAMN,qBACE,wBACE,6CAIJ,QACE,yBC9EF,KACE,mBACA,oBACA,mBACA,iBACA,iBACA,8CACA,uCAEA,UACE,iBACA,eACA,8BbMF,8CaFF,MAEI,mCCjBJ,UACE,sBdgBA,8CcjBF,UAII,iBAEA,aACE,kBAMJ,oFACE,WACA,MAJe,IAKf,kBACA,WACA,uCAGF,gBACE,cACA,iBACA,kBACA,SACA,iBAEA,wBAGE,YACA,UACA,YAGF,oCAGE,YACA,SAIF,uBACE,WACA,qBACA,kBACA,kBACA,WACA,YACA,YACA,iBACA,gDACA,qCACA,6BACA,UAKF,gBACE,iBACA,iBAIA,+BACE,yCACA,uFAUF,wBAGE,MACA,UACA,cAIJ,8CACE,cAIJ,gBACE,mBACA,qBACA,kBACA,YAEA,sBACE,aACA,kBAGF,oBACE,cACA,4BAIJ,YAEE,mBACA,kBACA,UAEA,kBACE,mBAGF,oBAEE,WACA,qBACA,kBACA,kBACA,UACA,WACA,WACA,YACA,UACA,yCACA,6BACA,UCpIN,MACE,2BACA,2CAKA,qCACE,mBACA,gBAGA,qDACE,gBACA,UACA,WACA,kBACA,cACA,WACA,kBACA,UACA,mBfLJ,8CeJE,qDAYI,gBAKJ,yCAGE,iBfhBJ,8CeaE,yCrBhCF,gBACA,uBACA,oBqB2CF,eACE,iBAGF,oBACE,kBAMA,iEAGE,mBCxDJ,mBACE,KACE,+BAGF,GACE,kCAIJ,eACE,qBACA,qCACA,6CASF,WACE,eACA,MACA,OACA,WACA,YACA,gBACA,oBAEA,mBACE,GACE,qCACA,UACA,gBAEF,KACE,6CACA,UACA,mBAIJ,mCACE,6BACE,kBACA,wBACA,cACA,cACA,oCACA,gCACA,iCACA,sCACA,sCACA,oCACA,oBAGE,0CACE,mBACA,+CACA,2BACA,mBACA,mBALF,0CACE,mBACA,8CACA,2BACA,mBACA,oBALF,0CACE,mBACA,8CACA,4BACA,mBACA,oBALF,0CACE,mBACA,8CACA,2BACA,mBACA,mBALF,0CACE,mBACA,+CACA,4BACA,mBACA,oBALF,0CACE,mBACA,8CACA,2BACA,mBACA,oBALF,0CACE,mBACA,8CACA,4BACA,mBACA,oBALF,0CACE,mBACA,4CACA,4BACA,mBACA,oBALF,0CACE,mBACA,+CACA,4BACA,mBACA,mBALF,0CACE,kBACA,6CACA,2BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,mBALF,2CACE,mBACA,8CACA,2BACA,mBACA,mBALF,2CACE,mBACA,8CACA,4BACA,mBACA,mBALF,2CACE,mBACA,+CACA,2BACA,mBACA,mBALF,2CACE,kBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,mBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,+CACA,2BACA,mBACA,oBALF,2CACE,mBACA,+CACA,4BACA,mBACA,mBALF,2CACE,mBACA,6CACA,4BACA,mBACA,oBALF,2CACE,mBACA,4CACA,4BACA,mBACA,mBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,kBACA,8CACA,4BACA,mBACA,mBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,2CACA,2BACA,mBACA,mBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,6CACA,2BACA,mBACA,mBALF,2CACE,kBACA,4CACA,2BACA,mBACA,oBALF,2CACE,mBACA,6CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,+CACA,2BACA,mBACA,mBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,+CACA,4BACA,mBACA,oBALF,2CACE,mBACA,2CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,2CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,+CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,6CACA,2BACA,mBACA,mBALF,2CACE,mBACA,+CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,6CACA,4BACA,mBACA,oBALF,2CACE,mBACA,+CACA,4BACA,mBACA,mBALF,2CACE,mBACA,+CACA,2BACA,mBACA,oBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,+CACA,4BACA,mBACA,qBAMR,mCACE,6BACE,cAQN,mBACE,oCACA,YACA,kBACA,kBACA,yBACA,oCACA,kDAGF,yBACE,2BACA,qCAIF,SACE,wDACA,sBACA,4BACA,wBAGF,uBACE,WACA,wCAEF,wBACE,WACA,uCAEF,iDACE,WAEF,8BACE","sourcesContent":["@use '../abstracts/mixins' as *;\n\n::-webkit-input-placeholder {\n  @include placeholder;\n}\n\n::-moz-placeholder {\n  @include placeholder;\n}\n\n:-ms-input-placeholder {\n  @include placeholder;\n}\n\n::-ms-input-placeholder {\n  @include placeholder;\n}\n\n::placeholder {\n  @include placeholder;\n}\n\n:focus::-webkit-input-placeholder {\n  @include placeholder-focus;\n}\n\n:focus::-moz-placeholder {\n  @include placeholder-focus;\n}\n\n:focus:-ms-input-placeholder {\n  @include placeholder-focus;\n}\n\n:focus::-ms-input-placeholder {\n  @include placeholder-focus;\n}\n\n:focus::placeholder {\n  @include placeholder-focus;\n}\n","@mixin text-ellipsis {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n@mixin mt-mb($value) {\n  margin-top: $value;\n  margin-bottom: $value;\n}\n\n@mixin ml-mr($value) {\n  margin-left: $value;\n  margin-right: $value;\n}\n\n@mixin pt-pb($val) {\n  padding-top: $val;\n  padding-bottom: $val;\n}\n\n@mixin pl-pr($val, $important: false) {\n  @if $important {\n    padding-left: $val !important;\n    padding-right: $val !important;\n  } @else {\n    padding-left: $val;\n    padding-right: $val;\n  }\n}\n\n@mixin placeholder {\n  color: var(--text-muted-color) !important;\n}\n\n@mixin placeholder-focus {\n  opacity: 0.6;\n}\n\n@mixin label($font-size: 1rem, $font-weight: 600, $color: var(--label-color)) {\n  color: $color;\n  font-size: $font-size;\n  font-weight: $font-weight;\n}\n\n@mixin align-center {\n  position: relative;\n  left: 50%;\n  transform: translateX(-50%);\n}\n\n@mixin prompt($type, $fa-content, $fa-style: 'solid', $rotate: 0) {\n  &.prompt-#{$type} {\n    background-color: var(--prompt-#{$type}-bg);\n\n    &::before {\n      content: $fa-content;\n      color: var(--prompt-#{$type}-icon-color);\n      font: var(--fa-font-#{$fa-style});\n\n      @if $rotate != 0 {\n        transform: rotate(#{$rotate}deg);\n      }\n    }\n  }\n}\n\n@mixin slide($append: null) {\n  $basic: transform 0.4s ease;\n\n  @if $append {\n    transition: $basic, $append;\n  } @else {\n    transition: $basic;\n  }\n}\n\n@mixin max-w-100 {\n  max-width: 100%;\n}\n","@use 'variables' as v;\n@use 'mixins' as mx;\n\n%heading {\n  color: var(--heading-color);\n  font-weight: 400;\n  font-family: v.$font-family-heading;\n  scroll-margin-top: 3.5rem;\n}\n\n%anchor {\n  .anchor {\n    font-size: 80%;\n  }\n\n  @media (hover: hover) {\n    .anchor {\n      visibility: hidden;\n      opacity: 0;\n      transition: opacity 0.25s ease-in, visibility 0s ease-in 0.25s;\n    }\n\n    &:hover {\n      .anchor {\n        visibility: visible;\n        opacity: 1;\n        transition: opacity 0.25s ease-in, visibility 0s ease-in 0s;\n      }\n    }\n  }\n}\n\n%tag-hover {\n  background: var(--tag-hover);\n  transition: background 0.35s ease-in-out;\n}\n\n%table-cell {\n  padding: 0.4rem 1rem;\n  font-size: 95%;\n  white-space: nowrap;\n}\n\n%link-hover {\n  color: #d2603a !important;\n  border-bottom: 1px solid #d2603a;\n  text-decoration: none;\n}\n\n%link-color {\n  color: var(--link-color);\n}\n\n%link-underline {\n  border-bottom: 1px solid var(--link-underline-color);\n}\n\n%clickable-transition {\n  transition: all 0.3s ease-in-out;\n}\n\n%no-cursor {\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n}\n\n%no-bottom-border {\n  border-bottom: none;\n}\n\n%cursor-pointer {\n  cursor: pointer;\n}\n\n%normal-font-style {\n  font-style: normal;\n}\n\n%rounded {\n  border-radius: v.$radius-lg;\n}\n\n%img-caption {\n  + em {\n    display: block;\n    text-align: center;\n    font-style: normal;\n    font-size: 80%;\n    padding: 0;\n    color: #6d6c6c;\n  }\n}\n\n%sidebar-links {\n  color: var(--sidebar-muted-color);\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n}\n\n%text-clip {\n  display: -webkit-box;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n}\n\n%text-ellipsis {\n  @include mx.text-ellipsis;\n}\n\n%text-highlight {\n  color: var(--text-muted-highlight-color);\n  font-weight: 600;\n}\n\n%text-sm {\n  font-size: 0.85rem;\n}\n\n%text-xs {\n  font-size: 0.8rem;\n}\n\n%sup-fn-target {\n  &:target {\n    background-color: var(--footnote-target-bg);\n    width: -moz-fit-content;\n    width: -webkit-fit-content;\n    width: fit-content;\n    transition: background-color 1.75s ease-in-out;\n  }\n}\n\n%btn-color {\n  button i {\n    color: #999999;\n  }\n}\n\n%code-snippet-bg {\n  background-color: var(--highlight-bg-color);\n}\n\n%code-snippet-padding {\n  padding-left: 1rem;\n  padding-right: 1.5rem;\n}\n\n%max-w-100 {\n  max-width: 100%;\n}\n\n%panel-border {\n  border-left: 1px solid var(--main-border-color);\n}\n","/* sidebar */\n\n$sidebar-width: 260px !default; /* the basic width */\n$sidebar-width-large: 300px !default; /* screen width: >= 1650px */\n$sb-btn-gap: 0.8rem !default;\n$sb-btn-gap-lg: 1rem !default;\n\n/* other framework sizes */\n\n$topbar-height: 3rem !default;\n$search-max-width: 200px !default;\n$footer-height: 5rem !default;\n$footer-height-large: 6rem !default; /* screen width: < 850px */\n$main-content-max-width: 1250px !default;\n$radius-sm: 6px !default;\n$radius-lg: 10px !default;\n$back2top-size: 2.75rem !default;\n\n/* syntax highlight */\n\n$code-font-size: 0.85rem !default;\n$code-header-height: 2.25rem !default;\n$code-dot-size: 0.75rem !default;\n$code-dot-gap: 0.5rem !default;\n$code-icon-width: 1.75rem !default;\n\n/* fonts */\n\n$font-family-base: 'Source Sans Pro', 'Microsoft Yahei', sans-serif !default;\n$font-family-heading: Lato, 'Microsoft Yahei', sans-serif !default;\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n@use '../themes/light';\n@use '../themes/dark';\n\n:root {\n  font-size: 16px;\n}\n\nhtml {\n  @media (prefers-color-scheme: light) {\n    &:not([data-mode]),\n    &[data-mode='light'] {\n      @include light.styles;\n    }\n\n    &[data-mode='dark'] {\n      @include dark.styles;\n    }\n  }\n\n  @media (prefers-color-scheme: dark) {\n    &:not([data-mode]),\n    &[data-mode='dark'] {\n      @include dark.styles;\n    }\n\n    &[data-mode='light'] {\n      @include light.styles;\n    }\n  }\n\n  @include bp.lg {\n    overflow-y: scroll;\n  }\n}\n\nbody {\n  background: var(--main-bg);\n  padding: env(safe-area-inset-top) env(safe-area-inset-right)\n    env(safe-area-inset-bottom) env(safe-area-inset-left);\n  color: var(--text-color);\n  -webkit-font-smoothing: antialiased;\n  font-family: v.$font-family-base;\n}\n\nh1.dynamic-title {\n  @include bp.lt(bp.get(lg)) {\n    display: none;\n\n    ~ .content {\n      margin-top: 2.5rem;\n    }\n  }\n}\n\nmain {\n  &.col-12 {\n    @include bp.xxxl {\n      padding-right: 4.5rem !important;\n    }\n  }\n}\n\n.preview-img {\n  aspect-ratio: 40 / 21;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n\n  @extend %rounded;\n\n  &:not(.no-bg) {\n    background: var(--img-bg);\n  }\n\n  img {\n    height: 100%;\n    -o-object-fit: cover;\n    object-fit: cover;\n\n    @extend %rounded;\n\n    @at-root #post-list & {\n      width: 100%;\n    }\n  }\n}\n\n.post-preview {\n  @extend %rounded;\n\n  border: 0;\n  background: var(--card-bg);\n  box-shadow: var(--card-shadow);\n\n  &::before {\n    @extend %rounded;\n\n    content: '';\n    width: 100%;\n    height: 100%;\n    position: absolute;\n    background-color: var(--card-hovor-bg);\n    opacity: 0;\n    transition: opacity 0.35s ease-in-out;\n  }\n\n  &:hover {\n    &::before {\n      opacity: 0.3;\n    }\n  }\n}\n\n.post-meta {\n  @extend %text-sm;\n\n  a {\n    &:not([class]):hover {\n      @extend %link-hover;\n    }\n  }\n\n  em {\n    @extend %normal-font-style;\n  }\n}\n\n.content {\n  font-size: 1.08rem;\n  margin-top: 2rem;\n  overflow-wrap: break-word;\n\n  @include bp.xl {\n    font-size: 1.03rem;\n  }\n\n  a {\n    &.popup {\n      @extend %no-cursor;\n      @extend %img-caption;\n      @include mx.mt-mb(0.5rem);\n\n      cursor: zoom-in;\n    }\n\n    &:not(.img-link) {\n      @extend %link-underline;\n\n      &:hover {\n        @extend %link-hover;\n      }\n    }\n  }\n\n  ol,\n  ul {\n    &:not([class]),\n    &.task-list {\n      -webkit-padding-start: 1.75rem;\n      padding-inline-start: 1.75rem;\n\n      li {\n        margin: 0.25rem 0;\n        padding-left: 0.25rem;\n      }\n\n      ol,\n      ul {\n        -webkit-padding-start: 1.25rem;\n        padding-inline-start: 1.25rem;\n        margin: 0.5rem 0;\n      }\n    }\n  }\n\n  ul.task-list {\n    -webkit-padding-start: 1.25rem;\n    padding-inline-start: 1.25rem;\n\n    li {\n      list-style-type: none;\n      padding-left: 0;\n\n      /* checkbox icon */\n      > i {\n        width: 2rem;\n        margin-left: -1.25rem;\n        color: var(--checkbox-color);\n\n        &.checked {\n          color: var(--checkbox-checked-color);\n        }\n      }\n\n      ul {\n        -webkit-padding-start: 1.75rem;\n        padding-inline-start: 1.75rem;\n      }\n    }\n\n    input[type='checkbox'] {\n      margin: 0 0.5rem 0.2rem -1.3rem;\n      vertical-align: middle;\n    }\n  } /* ul */\n\n  dl > dd {\n    margin-left: 1rem;\n  }\n\n  ::marker {\n    color: var(--text-muted-color);\n  }\n\n  .table-wrapper > table {\n    @include bp.lg {\n      min-width: 70%;\n    }\n  }\n} /* .content */\n\n.tag:hover {\n  @extend %tag-hover;\n}\n\n.post-tag {\n  display: inline-block;\n  min-width: 2rem;\n  text-align: center;\n  border-radius: 0.5rem;\n  border: 1px solid var(--btn-border-color);\n  padding: 0 0.4rem;\n  color: var(--text-muted-color);\n  line-height: 1.3rem;\n\n  &:not(:last-child) {\n    margin-right: 0.2rem;\n  }\n}\n\n.rounded-10 {\n  border-radius: 10px !important;\n}\n\n.img-link {\n  color: transparent;\n  display: inline-flex;\n}\n\n.shimmer {\n  overflow: hidden;\n  position: relative;\n  background: var(--img-bg);\n\n  &::before {\n    content: '';\n    position: absolute;\n    background: var(--shimmer-bg);\n    height: 100%;\n    width: 100%;\n    -webkit-animation: shimmer 1.3s infinite;\n    animation: shimmer 1.3s infinite;\n  }\n\n  @-webkit-keyframes shimmer {\n    0% {\n      transform: translateX(-100%);\n    }\n\n    100% {\n      transform: translateX(100%);\n    }\n  }\n\n  @keyframes shimmer {\n    0% {\n      transform: translateX(-100%);\n    }\n\n    100% {\n      transform: translateX(100%);\n    }\n  }\n}\n\n.embed-video {\n  width: 100%;\n  height: 100%;\n  margin-bottom: 1rem;\n  aspect-ratio: 16 / 9;\n\n  @extend %rounded;\n\n  &.twitch {\n    aspect-ratio: 310 / 189;\n  }\n\n  &.file {\n    display: block;\n    width: auto;\n    height: auto;\n    max-width: 100%;\n    max-height: 100%;\n    margin: auto;\n    margin-bottom: 0;\n  }\n\n  @extend %img-caption;\n}\n\n.embed-audio {\n  width: 100%;\n  display: block;\n\n  @extend %img-caption;\n}\n\n/* --- Effects classes --- */\n\n.flex-grow-1 {\n  flex-grow: 1 !important;\n}\n\n.btn-box-shadow {\n  box-shadow: var(--card-shadow);\n}\n\n/* overwrite bootstrap muted */\n.text-muted {\n  color: var(--text-muted-color) !important;\n}\n\n/* Overwrite bootstrap tooltip */\n.tooltip-inner {\n  font-size: 0.7rem;\n  max-width: 220px;\n  text-align: left;\n}\n\n/* Overwrite bootstrap outline button */\n.btn.btn-outline-primary {\n  &:not(.disabled):hover {\n    border-color: #007bff !important;\n  }\n}\n\n.disabled {\n  color: rgb(206, 196, 196);\n  pointer-events: auto;\n  cursor: not-allowed;\n}\n\n.hide-border-bottom {\n  border-bottom: none !important;\n}\n\n.input-focus {\n  box-shadow: none;\n  border-color: var(--input-focus-border-color) !important;\n  background: center !important;\n  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;\n}\n\n.left {\n  float: left;\n  margin: 0.75rem 1rem 1rem 0;\n}\n\n.right {\n  float: right;\n  margin: 0.75rem 0 1rem 1rem;\n}\n\n/* --- Overriding --- */\n\n/* mermaid */\n.mermaid {\n  text-align: center;\n}\n\n/* MathJax */\nmjx-container {\n  overflow-y: hidden;\n  min-width: auto !important;\n}\n\n@media (hover: hover) {\n  #sidebar ul > li:last-child::after {\n    transition: top 0.5s ease;\n  }\n\n  .nav-link {\n    transition: background-color 0.3s ease-in-out;\n  }\n\n  .post-preview {\n    transition: background-color 0.35s ease-in-out;\n  }\n}\n\n#mask {\n  inset: 0 0 0 0;\n}\n\n#main-wrapper {\n  position: relative;\n\n  @include mx.pl-pr(0);\n\n  @include bp.lt(bp.get(lg)) {\n    @include mx.slide;\n  }\n\n  @include bp.lg {\n    margin-left: v.$sidebar-width;\n  }\n\n  @include bp.xxxl {\n    margin-left: v.$sidebar-width-large;\n  }\n\n  > .container {\n    min-height: 100vh;\n\n    @include bp.lte(bp.get(md)) {\n      @include mx.max-w-100;\n      @include mx.pl-pr(0);\n    }\n\n    @include bp.lt(bp.get(lg)) {\n      max-width: 100%;\n    }\n\n    /* Pad horizontal */\n    @include bp.between(992px, calc(#{bp.get(xl)} - 1px)) {\n      .col-lg-11 {\n        flex: 0 0 96%;\n        max-width: 96%;\n      }\n    }\n\n    @include bp.lt(bp.get(xl)) {\n      > .row {\n        justify-content: center !important;\n      }\n    }\n\n    @include bp.xxxl {\n      max-width: v.$main-content-max-width;\n\n      @include mx.pl-pr(1.75rem, true);\n    }\n  }\n}\n\n/* --- basic wrappers --- */\n\n#topbar-wrapper.row,\n#main-wrapper > .container > .row,\n#search-result-wrapper > .row {\n  @include mx.ml-mr(0);\n}\n\n#tail-wrapper {\n  @include bp.xxxl {\n    padding-right: 4.5rem !important;\n  }\n\n  > :not(script) {\n    margin-top: 3rem;\n  }\n}\n","@mixin styles {\n  /* Framework color */\n  --main-bg: white;\n  --mask-bg: #c1c3c5;\n  --main-border-color: #f3f3f3;\n\n  /* Common color */\n  --text-color: #34343c;\n  --text-muted-color: #757575;\n  --text-muted-highlight-color: inherit;\n  --heading-color: #2a2a2a;\n  --label-color: #585858;\n  --blockquote-border-color: #eeeeee;\n  --blockquote-text-color: #757575;\n  --link-color: #0056b2;\n  --link-underline-color: #dee2e6;\n  --button-bg: #ffffff;\n  --btn-border-color: #e9ecef;\n  --btn-backtotop-color: #686868;\n  --btn-backtotop-border-color: #f1f1f1;\n  --checkbox-color: #c5c5c5;\n  --checkbox-checked-color: #07a8f7;\n  --img-bg: radial-gradient(\n    circle,\n    rgb(255, 255, 255) 0%,\n    rgb(239, 239, 239) 100%\n  );\n  --shimmer-bg: linear-gradient(\n    90deg,\n    rgba(250, 250, 250, 0) 0%,\n    rgba(232, 230, 230, 1) 50%,\n    rgba(250, 250, 250, 0) 100%\n  );\n\n  /* Sidebar */\n  --site-title-color: rgb(113, 113, 113);\n  --site-subtitle-color: #717171;\n  --sidebar-bg: #f6f8fa;\n  --sidebar-border-color: #efefef;\n  --sidebar-muted-color: #545454;\n  --sidebar-active-color: #1d1d1d;\n  --sidebar-hover-bg: rgb(223, 233, 241, 0.64);\n  --sidebar-btn-bg: white;\n  --sidebar-btn-color: #8e8e8e;\n  --avatar-border-color: white;\n\n  /* Topbar */\n  --topbar-bg: rgb(255, 255, 255, 0.7);\n  --topbar-text-color: rgb(78, 78, 78);\n  --search-border-color: rgb(240, 240, 240);\n  --search-icon-color: #c2c6cc;\n  --input-focus-border-color: #b8b8b8;\n\n  /* Home page */\n  --post-list-text-color: dimgray;\n  --btn-patinator-text-color: #555555;\n  --btn-paginator-hover-color: var(--sidebar-bg);\n\n  /* Posts */\n  --toc-highlight: #0550ae;\n  --toc-popup-border-color: lightgray;\n  --btn-share-color: gray;\n  --btn-share-hover-color: #0d6efd;\n  --card-bg: white;\n  --card-hovor-bg: #e2e2e2;\n  --card-shadow: rgb(104, 104, 104, 0.05) 0 2px 6px 0,\n    rgba(211, 209, 209, 0.15) 0 0 0 1px;\n  --footnote-target-bg: lightcyan;\n  --tb-odd-bg: #fbfcfd;\n  --tb-border-color: #eaeaea;\n  --dash-color: silver;\n  --kbd-wrap-color: #bdbdbd;\n  --kbd-text-color: var(--text-color);\n  --kbd-bg-color: white;\n  --prompt-text-color: rgb(46, 46, 46, 0.77);\n  --prompt-tip-bg: rgb(123, 247, 144, 0.2);\n  --prompt-tip-icon-color: #03b303;\n  --prompt-info-bg: #e1f5fe;\n  --prompt-info-icon-color: #0070cb;\n  --prompt-warning-bg: rgb(255, 243, 205);\n  --prompt-warning-icon-color: #ef9c03;\n  --prompt-danger-bg: rgb(248, 215, 218, 0.56);\n  --prompt-danger-icon-color: #df3c30;\n\n  /* Tags */\n  --tag-border: #dee2e6;\n  --tag-shadow: var(--btn-border-color);\n  --tag-hover: rgb(222, 226, 230);\n  --search-tag-bg: #f8f9fa;\n\n  /* Categories */\n  --categories-border: rgba(0, 0, 0, 0.125);\n  --categories-hover-bg: var(--btn-border-color);\n  --categories-icon-hover-color: darkslategray;\n\n  /* Archive */\n  --timeline-color: rgba(0, 0, 0, 0.075);\n  --timeline-node-bg: #c2c6cc;\n  --timeline-year-dot-color: #ffffff;\n\n  /* --- Custom code light mode colors --- */\n  --language-border-color: #ececec;\n  --highlight-bg-color: #f6f8fa;\n  --highlighter-rouge-color: #3f596f;\n  --highlight-lineno-color: #9e9e9e;\n  --inline-code-bg: rgba(25, 25, 28, 0.05);\n  --code-color: #3a3a3a;\n  --code-header-text-color: #a3a3a3;\n  --code-header-muted-color: #e5e5e5;\n  --code-header-icon-color: #c9c8c8;\n  --clipboard-checked-color: #43c743;\n\n  [class^='prompt-'] {\n    --link-underline-color: rgb(219, 216, 216);\n  }\n\n  .dark {\n    display: none;\n  }\n\n  /* --- Syntax highlight theme from `rougify style github` --- */\n\n  .highlight table td {\n    padding: 5px;\n  }\n\n  .highlight table pre {\n    margin: 0;\n  }\n\n  .highlight,\n  .highlight .w {\n    color: #24292f;\n    background-color: #f6f8fa;\n  }\n\n  .highlight .k,\n  .highlight .kd,\n  .highlight .kn,\n  .highlight .kp,\n  .highlight .kr,\n  .highlight .kt,\n  .highlight .kv {\n    color: #cf222e;\n  }\n\n  .highlight .gr {\n    color: #f6f8fa;\n  }\n\n  .highlight .gd {\n    color: #82071e;\n    background-color: #ffebe9;\n  }\n\n  .highlight .nb {\n    color: #953800;\n  }\n\n  .highlight .nc {\n    color: #953800;\n  }\n\n  .highlight .no {\n    color: #953800;\n  }\n\n  .highlight .nn {\n    color: #953800;\n  }\n\n  .highlight .sr {\n    color: #116329;\n  }\n\n  .highlight .na {\n    color: #116329;\n  }\n\n  .highlight .nt {\n    color: #116329;\n  }\n\n  .highlight .gi {\n    color: #116329;\n    background-color: #dafbe1;\n  }\n\n  .highlight .kc {\n    color: #0550ae;\n  }\n\n  .highlight .l,\n  .highlight .ld,\n  .highlight .m,\n  .highlight .mb,\n  .highlight .mf,\n  .highlight .mh,\n  .highlight .mi,\n  .highlight .il,\n  .highlight .mo,\n  .highlight .mx {\n    color: #0550ae;\n  }\n\n  .highlight .sb {\n    color: #0550ae;\n  }\n\n  .highlight .bp {\n    color: #0550ae;\n  }\n\n  .highlight .ne {\n    color: #0550ae;\n  }\n\n  .highlight .nl {\n    color: #0550ae;\n  }\n\n  .highlight .py {\n    color: #0550ae;\n  }\n\n  .highlight .nv,\n  .highlight .vc,\n  .highlight .vg,\n  .highlight .vi,\n  .highlight .vm {\n    color: #0550ae;\n  }\n\n  .highlight .o,\n  .highlight .ow {\n    color: #0550ae;\n  }\n\n  .highlight .gh {\n    color: #0550ae;\n    font-weight: bold;\n  }\n\n  .highlight .gu {\n    color: #0550ae;\n    font-weight: bold;\n  }\n\n  .highlight .s,\n  .highlight .sa,\n  .highlight .sc,\n  .highlight .dl,\n  .highlight .sd,\n  .highlight .s2,\n  .highlight .se,\n  .highlight .sh,\n  .highlight .sx,\n  .highlight .s1,\n  .highlight .ss {\n    color: #0a3069;\n  }\n\n  .highlight .nd {\n    color: #8250df;\n  }\n\n  .highlight .nf,\n  .highlight .fm {\n    color: #8250df;\n  }\n\n  .highlight .err {\n    color: #f6f8fa;\n    background-color: #82071e;\n  }\n\n  .highlight .c,\n  .highlight .ch,\n  .highlight .cd,\n  .highlight .cm,\n  .highlight .cp,\n  .highlight .cpf,\n  .highlight .c1,\n  .highlight .cs {\n    color: #68717a;\n  }\n\n  .highlight .gl {\n    color: #68717a;\n  }\n\n  .highlight .gt {\n    color: #68717a;\n  }\n\n  .highlight .ni {\n    color: #24292f;\n  }\n\n  .highlight .si {\n    color: #24292f;\n  }\n\n  .highlight .ge {\n    color: #24292f;\n    font-style: italic;\n  }\n\n  .highlight .gs {\n    color: #24292f;\n    font-weight: bold;\n  }\n}\n","@mixin styles {\n  color-scheme: dark;\n\n  /* Framework color */\n  --main-bg: rgb(27, 27, 30);\n  --mask-bg: rgb(68, 69, 70);\n  --main-border-color: rgb(44, 45, 45);\n\n  /* Common color */\n  --text-color: rgb(175, 176, 177);\n  --text-muted-color: #868686;\n  --text-muted-highlight-color: #aeaeae;\n  --heading-color: #cccccc;\n  --label-color: #a7a7a7;\n  --blockquote-border-color: rgb(66, 66, 66);\n  --blockquote-text-color: #868686;\n  --link-color: rgb(138, 180, 248);\n  --link-underline-color: rgb(82, 108, 150);\n  --button-bg: #1e1e1e;\n  --btn-border-color: #2e2f31;\n  --btn-backtotop-color: var(--text-color);\n  --btn-backtotop-border-color: #212122;\n  --card-header-bg: #292929;\n  --checkbox-color: rgb(118, 120, 121);\n  --checkbox-checked-color: var(--link-color);\n  --img-bg: radial-gradient(circle, rgb(22, 22, 24) 0%, rgb(32, 32, 32) 100%);\n  --shimmer-bg: linear-gradient(\n    90deg,\n    rgba(255, 255, 255, 0) 0%,\n    rgba(58, 55, 55, 0.4) 50%,\n    rgba(255, 255, 255, 0) 100%\n  );\n\n  /* Sidebar */\n  --site-title-color: #717070;\n  --site-subtitle-color: #868686;\n  --sidebar-bg: #1e1e1e;\n  --sidebar-border-color: #292929;\n  --sidebar-muted-color: #868686;\n  --sidebar-active-color: rgb(255, 255, 255, 0.95);\n  --sidebar-hover-bg: #262626;\n  --sidebar-btn-bg: #232328;\n  --sidebar-btn-color: #787878;\n  --avatar-border-color: rgb(206, 206, 206, 0.9);\n\n  /* Topbar */\n  --topbar-bg: rgb(27, 27, 30, 0.64);\n  --topbar-text-color: var(--text-color);\n  --search-border-color: rgb(55, 55, 55);\n  --search-icon-color: rgb(100, 102, 105);\n  --input-focus-border-color: rgb(112, 114, 115);\n\n  /* Home page */\n  --post-list-text-color: rgb(175, 176, 177);\n  --btn-patinator-text-color: var(--text-color);\n  --btn-paginator-hover-color: #2e2e2e;\n\n  /* Posts */\n  --toc-highlight: rgb(116, 178, 243);\n  --toc-popup-border-color: #373737;\n  --tag-hover: rgb(43, 56, 62);\n  --tb-odd-bg: #252526; /* odd rows of the posts' table */\n  --tb-even-bg: rgb(31, 31, 34); /* even rows of the posts' table */\n  --tb-border-color: var(--tb-odd-bg);\n  --footnote-target-bg: rgb(63, 81, 181);\n  --btn-share-color: #6c757d;\n  --btn-share-hover-color: #bfc1ca;\n  --card-bg: #1e1e1e;\n  --card-hovor-bg: #464d51;\n  --card-shadow: rgb(21, 21, 21, 0.72) 0 6px 18px 0,\n    rgb(137, 135, 135, 0.24) 0 0 0 1px;\n  --kbd-wrap-color: #6a6a6a;\n  --kbd-text-color: #d3d3d3;\n  --kbd-bg-color: #242424;\n  --prompt-text-color: rgb(216, 212, 212, 0.75);\n  --prompt-tip-bg: rgb(22, 60, 36, 0.64);\n  --prompt-tip-icon-color: rgb(15, 164, 15, 0.81);\n  --prompt-info-bg: rgb(7, 59, 104, 0.8);\n  --prompt-info-icon-color: #0075d1;\n  --prompt-warning-bg: rgb(90, 69, 3, 0.88);\n  --prompt-warning-icon-color: rgb(255, 165, 0, 0.8);\n  --prompt-danger-bg: rgb(86, 28, 8, 0.8);\n  --prompt-danger-icon-color: #cd0202;\n\n  /* Tags */\n  --tag-border: rgb(59, 79, 88);\n  --tag-shadow: rgb(32, 33, 33);\n  --dash-color: rgb(63, 65, 68);\n  --search-tag-bg: #292828;\n\n  /* Categories */\n  --categories-border: rgb(64, 66, 69, 0.5);\n  --categories-hover-bg: rgb(73, 75, 76);\n  --categories-icon-hover-color: white;\n\n  /* Archive */\n  --timeline-node-bg: rgb(150, 152, 156);\n  --timeline-color: rgb(63, 65, 68);\n  --timeline-year-dot-color: var(--timeline-color);\n\n  /* Code highlight colors */\n  --language-border-color: #2d2d2d;\n  --highlight-bg-color: #151515;\n  --highlighter-rouge-color: #c9def1;\n  --highlight-lineno-color: #808080;\n  --inline-code-bg: rgba(255, 255, 255, 0.05);\n  --code-color: #b0b0b0;\n  --code-header-text-color: #6a6a6a;\n  --code-header-muted-color: #353535;\n  --code-header-icon-color: #565656;\n  --clipboard-checked-color: #2bcc2b;\n  --filepath-text-color: #cacaca;\n\n  .light {\n    display: none;\n  }\n\n  /* Categories */\n  .categories.card,\n  .list-group-item {\n    background-color: var(--card-bg);\n  }\n\n  .categories {\n    .card-header {\n      background-color: var(--card-header-bg);\n    }\n\n    .list-group-item {\n      border-left: none;\n      border-right: none;\n      padding-left: 2rem;\n      border-color: var(--categories-border);\n\n      &:last-child {\n        border-bottom-color: var(--card-bg);\n      }\n    }\n  }\n\n  #archives li:nth-child(odd) {\n    background-image: linear-gradient(\n      to left,\n      rgb(26, 26, 30),\n      rgb(39, 39, 45),\n      rgb(39, 39, 45),\n      rgb(39, 39, 45),\n      rgb(26, 26, 30)\n    );\n  }\n\n  /* stylelint-disable-next-line selector-id-pattern */\n  #disqus_thread {\n    color-scheme: none;\n  }\n\n  /* --- Syntax highlight theme from `rougify style base16.dark` --- */\n\n  .highlight .gp {\n    color: #87939d;\n  }\n\n  .highlight table td {\n    padding: 5px;\n  }\n\n  .highlight table pre {\n    margin: 0;\n  }\n\n  .highlight,\n  .highlight .w {\n    color: #d0d0d0;\n    background-color: #151515;\n  }\n\n  .highlight .err {\n    color: #151515;\n    background-color: #ac4142;\n  }\n\n  .highlight .c,\n  .highlight .ch,\n  .highlight .cd,\n  .highlight .cm,\n  .highlight .cpf,\n  .highlight .c1,\n  .highlight .cs {\n    color: #848484;\n  }\n\n  .highlight .cp {\n    color: #f4bf75;\n  }\n\n  .highlight .nt {\n    color: #f4bf75;\n  }\n\n  .highlight .o,\n  .highlight .ow {\n    color: #d0d0d0;\n  }\n\n  .highlight .p,\n  .highlight .pi {\n    color: #d0d0d0;\n  }\n\n  .highlight .gi {\n    color: #90a959;\n  }\n\n  .highlight .gd {\n    color: #f08a8b;\n    background-color: #320000;\n  }\n\n  .highlight .gh {\n    color: #6a9fb5;\n    background-color: #151515;\n    font-weight: bold;\n  }\n\n  .highlight .k,\n  .highlight .kn,\n  .highlight .kp,\n  .highlight .kr,\n  .highlight .kv {\n    color: #aa759f;\n  }\n\n  .highlight .kc {\n    color: #d28445;\n  }\n\n  .highlight .kt {\n    color: #d28445;\n  }\n\n  .highlight .kd {\n    color: #d28445;\n  }\n\n  .highlight .s,\n  .highlight .sb,\n  .highlight .sc,\n  .highlight .dl,\n  .highlight .sd,\n  .highlight .s2,\n  .highlight .sh,\n  .highlight .sx,\n  .highlight .s1 {\n    color: #90a959;\n  }\n\n  .highlight .sa {\n    color: #aa759f;\n  }\n\n  .highlight .sr {\n    color: #75b5aa;\n  }\n\n  .highlight .si {\n    color: #b76d45;\n  }\n\n  .highlight .se {\n    color: #b76d45;\n  }\n\n  .highlight .nn {\n    color: #f4bf75;\n  }\n\n  .highlight .nc {\n    color: #f4bf75;\n  }\n\n  .highlight .no {\n    color: #f4bf75;\n  }\n\n  .highlight .na {\n    color: #6a9fb5;\n  }\n\n  .highlight .m,\n  .highlight .mb,\n  .highlight .mf,\n  .highlight .mh,\n  .highlight .mi,\n  .highlight .il,\n  .highlight .mo,\n  .highlight .mx {\n    color: #90a959;\n  }\n\n  .highlight .ss {\n    color: #90a959;\n  }\n}\n","@use 'sass:map';\n\n$-breakpoints: (\n  // 1 column\n  sm: 576px,\n  md: 768px,\n  // 2 columns\n  lg: 850px,\n  // 3 columns\n  xl: 1200px,\n  xxl: 1400px,\n  xxxl: 1650px\n);\n\n@function get($breakpoint) {\n  @return map.get($-breakpoints, $breakpoint);\n}\n\n/* Less than the given width */\n@mixin lt($width) {\n  @media all and (max-width: calc(#{$width} - 1px)) {\n    @content;\n  }\n}\n\n/* Less than or equal to the given width */\n@mixin lte($width) {\n  @media all and (max-width: $width) {\n    @content;\n  }\n}\n\n@mixin sm {\n  @media all and (min-width: get(sm)) {\n    @content;\n  }\n}\n\n@mixin md {\n  @media all and (min-width: get(md)) {\n    @content;\n  }\n}\n\n@mixin lg {\n  @media all and (min-width: get(lg)) {\n    @content;\n  }\n}\n\n@mixin xl {\n  @media all and (min-width: get(xl)) {\n    @content;\n  }\n}\n\n@mixin xxl {\n  @media all and (min-width: get(xxl)) {\n    @content;\n  }\n}\n\n@mixin xxxl {\n  @media all and (min-width: get(xxxl)) {\n    @content;\n  }\n}\n\n@mixin between($min, $max) {\n  @media all and (min-width: $min) and (max-width: $max) {\n    @content;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n@for $i from 1 through 5 {\n  h#{$i} {\n    @extend %heading;\n\n    @if $i > 1 {\n      @extend %anchor;\n    }\n\n    @if $i < 5 {\n      $size-factor: 0.25rem;\n\n      @if $i > 1 {\n        $size-factor: 0.18rem;\n\n        main & {\n          @if $i == 2 {\n            margin: 2.5rem 0 1.25rem;\n          } @else {\n            margin: 2rem 0 1rem;\n          }\n        }\n      }\n\n      & {\n        font-size: 1rem + (5 - $i) * $size-factor;\n      }\n    } @else {\n      font-size: 1.05rem;\n    }\n  }\n}\n\na {\n  @extend %link-color;\n\n  text-decoration: none;\n}\n\nimg {\n  max-width: 100%;\n  height: auto;\n  transition: all 0.35s ease-in-out;\n\n  .blur & {\n    $blur: 20px;\n\n    -webkit-filter: blur($blur);\n    filter: blur($blur);\n  }\n}\n\nblockquote {\n  border-left: 0.125rem solid var(--blockquote-border-color);\n  padding-left: 1rem;\n  color: var(--blockquote-text-color);\n  margin-top: 0.5rem;\n\n  > p:last-child {\n    margin-bottom: 0;\n  }\n\n  &[class^='prompt-'] {\n    border-left: 0;\n    position: relative;\n    padding: 1rem 1rem 1rem 3rem;\n    color: var(--prompt-text-color);\n\n    @extend %rounded;\n\n    &::before {\n      text-align: center;\n      width: 3rem;\n      position: absolute;\n      left: 0.25rem;\n      margin-top: 0.4rem;\n      text-rendering: auto;\n      -webkit-font-smoothing: antialiased;\n    }\n  }\n\n  @include mx.prompt('tip', '\\f0eb', $fa-style: 'regular');\n  @include mx.prompt('info', '\\f06a', $rotate: 180);\n  @include mx.prompt('warning', '\\f06a');\n  @include mx.prompt('danger', '\\f071');\n}\n\nkbd {\n  font-family: Lato, sans-serif;\n  display: inline-block;\n  vertical-align: middle;\n  line-height: 1.3rem;\n  min-width: 1.75rem;\n  text-align: center;\n  margin: 0 0.3rem;\n  padding-top: 0.1rem;\n  color: var(--kbd-text-color);\n  background-color: var(--kbd-bg-color);\n  border-radius: v.$radius-sm;\n  border: solid 1px var(--kbd-wrap-color);\n  box-shadow: inset 0 -2px 0 var(--kbd-wrap-color);\n}\n\nhr {\n  border-color: var(--main-border-color);\n  opacity: 1;\n}\n\nfooter {\n  background-color: var(--main-bg);\n  height: v.$footer-height;\n  border-top: 1px solid var(--main-border-color);\n\n  @extend %text-xs;\n\n  a {\n    @extend %text-highlight;\n\n    &:hover {\n      @extend %link-hover;\n    }\n  }\n\n  em {\n    @extend %text-highlight;\n  }\n\n  p {\n    text-align: center;\n    margin-bottom: 0;\n  }\n}\n\n/* fontawesome icons */\ni {\n  &.far,\n  &.fas {\n    @extend %no-cursor;\n  }\n}\n\nsup {\n  @extend %sup-fn-target;\n}\n\nmain {\n  line-height: 1.75;\n\n  h1 {\n    margin-top: 2rem;\n\n    @include bp.lg {\n      margin-top: 3rem;\n    }\n  }\n\n  p {\n    > a.popup {\n      &:not(.normal):not(.left):not(.right) {\n        @include mx.align-center;\n      }\n    }\n  }\n\n  .categories,\n  #tags,\n  #archives {\n    a:not(:hover) {\n      @extend %no-bottom-border;\n    }\n  }\n\n  @include bp.lte(bp.get(sm)) {\n    .content {\n      > blockquote[class^='prompt-'] {\n        @include mx.ml-mr(-1rem);\n\n        border-radius: 0;\n        max-width: none;\n      }\n    }\n  }\n}\n\n.footnotes > ol {\n  padding-left: 2rem;\n  margin-top: 0.5rem;\n\n  > li {\n    &:not(:last-child) {\n      margin-bottom: 0.3rem;\n    }\n\n    @extend %sup-fn-target;\n\n    > p {\n      margin-left: 0.25em;\n\n      @include mx.mt-mb(0);\n    }\n  }\n}\n\n.footnote {\n  @at-root a#{&} {\n    @include mx.ml-mr(1px);\n    @include mx.pl-pr(2px);\n\n    border-bottom-style: none !important;\n  }\n}\n\n.reversefootnote {\n  @at-root a#{&} {\n    font-size: 0.6rem;\n    line-height: 1;\n    position: relative;\n    bottom: 0.25em;\n    margin-left: 0.25em;\n    border-bottom-style: none !important;\n  }\n}\n\n/* --- Begin of Markdown table style --- */\n\n/* it will be created by Liquid */\n.table-wrapper {\n  overflow-x: auto;\n  margin-bottom: 1.5rem;\n\n  > table {\n    min-width: 100%;\n    overflow-x: auto;\n    border-spacing: 0;\n\n    thead {\n      border-bottom: solid 2px rgba(210, 215, 217, 0.75);\n\n      th {\n        @extend %table-cell;\n      }\n    }\n\n    tbody {\n      tr {\n        border-bottom: 1px solid var(--tb-border-color);\n\n        &:nth-child(2n) {\n          background-color: var(--tb-even-bg);\n        }\n\n        &:nth-child(2n + 1) {\n          background-color: var(--tb-odd-bg);\n        }\n\n        td {\n          @extend %table-cell;\n        }\n      }\n    } /* tbody */\n  } /* table */\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n.highlighter-rouge {\n  color: var(--highlighter-rouge-color);\n  margin-top: 0.5rem;\n  margin-bottom: 1.2em; /* Override BS Inline-code style */\n}\n\n.highlight {\n  @extend %rounded;\n  @extend %code-snippet-bg;\n\n  overflow: auto;\n  padding-bottom: 0.75rem;\n\n  @at-root figure#{&} {\n    @extend %code-snippet-bg;\n  }\n\n  pre {\n    margin-bottom: 0;\n    font-size: v.$code-font-size;\n    line-height: 1.4rem;\n    word-wrap: normal; /* Fixed Safari overflow-x */\n  }\n\n  table {\n    td {\n      &:first-child {\n        display: inline-block;\n        margin-left: 1rem;\n        margin-right: 0.75rem;\n      }\n\n      &:last-child {\n        padding-right: 2rem !important;\n      }\n\n      pre {\n        overflow: visible; /* Fixed iOS safari overflow-x */\n        word-break: normal; /* Fixed iOS safari linenos code break */\n      }\n    }\n  }\n\n  .lineno {\n    text-align: right;\n    color: var(--highlight-lineno-color);\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -o-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n  }\n} /* .highlight */\n\ncode {\n  -webkit-hyphens: none;\n  -ms-hyphens: none;\n  hyphens: none;\n  color: var(--code-color);\n\n  &.highlighter-rouge {\n    font-size: v.$code-font-size;\n    padding: 3px 5px;\n    word-break: break-word;\n    border-radius: v.$radius-sm;\n    background-color: var(--inline-code-bg);\n  }\n\n  &.filepath {\n    background-color: inherit;\n    color: var(--filepath-text-color);\n    font-weight: 600;\n    padding: 0;\n  }\n\n  a > &.highlighter-rouge {\n    padding-bottom: 0; /* show link's underlinke */\n    color: inherit;\n  }\n\n  a:hover > &.highlighter-rouge {\n    border-bottom: none;\n  }\n\n  blockquote & {\n    color: inherit;\n  }\n}\n\ntd.rouge-code {\n  @extend %code-snippet-padding;\n\n  /*\n    Prevent some browser extends from\n    changing the URL string of code block.\n  */\n  a {\n    color: inherit !important;\n    border-bottom: none !important;\n    pointer-events: none;\n  }\n}\n\ndiv[class^='language-'] {\n  @extend %rounded;\n  @extend %code-snippet-bg;\n\n  box-shadow: var(--language-border-color) 0 0 0 1px;\n\n  .content > & {\n    @include mx.ml-mr(-1rem);\n\n    border-radius: 0;\n\n    @include bp.sm {\n      @include mx.ml-mr(0);\n\n      border-radius: v.$radius-lg;\n    }\n  }\n\n  .code-header {\n    @include bp.sm {\n      @include mx.ml-mr(0);\n\n      $dot-margin: 1rem;\n\n      &::before {\n        content: '';\n        display: inline-block;\n        margin-left: $dot-margin;\n        width: v.$code-dot-size;\n        height: v.$code-dot-size;\n        border-radius: 50%;\n        background-color: var(--code-header-muted-color);\n        box-shadow: (v.$code-dot-size + v.$code-dot-gap) 0 0\n            var(--code-header-muted-color),\n          (v.$code-dot-size + v.$code-dot-gap) * 2 0 0\n            var(--code-header-muted-color);\n      }\n\n      span {\n        // center the text of label\n        margin-left: calc(($dot-margin + v.$code-dot-size) / 2 * -1);\n      }\n    }\n  }\n\n  .highlight {\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n}\n\n/* Hide line numbers for default, console, and terminal code snippets */\ndiv {\n  &.nolineno,\n  &.language-plaintext,\n  &.language-console,\n  &.language-terminal {\n    td:first-child {\n      padding: 0 !important;\n      margin-right: 0;\n\n      .lineno {\n        display: none;\n      }\n    }\n  }\n}\n\n.code-header {\n  @extend %no-cursor;\n\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  height: v.$code-header-height;\n  margin-left: 0.75rem;\n  margin-right: 0.25rem;\n\n  /* the label block */\n  span {\n    line-height: v.$code-header-height;\n\n    /* label icon */\n    i {\n      font-size: 1rem;\n      width: v.$code-icon-width;\n      color: var(--code-header-icon-color);\n\n      &.small {\n        font-size: 70%;\n      }\n    }\n\n    @at-root [file] #{&} > i {\n      position: relative;\n      top: 1px; /* center the file icon */\n    }\n\n    /* label text */\n    &::after {\n      content: attr(data-label-text);\n      font-size: 0.85rem;\n      font-weight: 600;\n      color: var(--code-header-text-color);\n    }\n  }\n\n  /* clipboard */\n  button {\n    @extend %cursor-pointer;\n    @extend %rounded;\n\n    border: 1px solid transparent;\n    height: v.$code-header-height;\n    width: v.$code-header-height;\n    padding: 0;\n    background-color: inherit;\n\n    i {\n      color: var(--code-header-icon-color);\n    }\n\n    &[timeout] {\n      &:hover {\n        border-color: var(--clipboard-checked-color);\n      }\n\n      i {\n        color: var(--clipboard-checked-color);\n      }\n    }\n\n    &:focus {\n      outline: none;\n    }\n\n    &:not([timeout]):hover {\n      background-color: rgba(128, 128, 128, 0.37);\n\n      i {\n        color: white;\n      }\n    }\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n\n#back-to-top {\n  visibility: hidden;\n  opacity: 0;\n  z-index: 1;\n  cursor: pointer;\n  position: fixed;\n  right: 1rem;\n  bottom: calc(v.$footer-height-large - v.$back2top-size / 2);\n  background: var(--button-bg);\n  color: var(--btn-backtotop-color);\n  padding: 0;\n  width: v.$back2top-size;\n  height: v.$back2top-size;\n  border-radius: 50%;\n  border: 1px solid var(--btn-backtotop-border-color);\n  transition: opacity 0.5s ease-in-out, transform 0.2s ease-out;\n\n  @include bp.lg {\n    right: 5%;\n    bottom: calc(v.$footer-height - v.$back2top-size / 2);\n  }\n\n  @include bp.xxl {\n    right: calc((100vw - v.$sidebar-width - 1140px) / 2 + 3rem);\n  }\n\n  @include bp.xxxl {\n    right: calc(\n      (100vw - v.$sidebar-width-large - v.$main-content-max-width) / 2 + 2rem\n    );\n  }\n\n  &:hover {\n    transform: translate3d(0, -5px, 0);\n    -webkit-transform: translate3d(0, -5px, 0);\n  }\n\n  i {\n    line-height: v.$back2top-size;\n    position: relative;\n    bottom: 2px;\n  }\n\n  &.show {\n    opacity: 1;\n    visibility: visible;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n/* PWA update popup */\n#notification {\n  @-webkit-keyframes popup {\n    from {\n      opacity: 0;\n      bottom: 0;\n    }\n  }\n\n  @keyframes popup {\n    from {\n      opacity: 0;\n      bottom: 0;\n    }\n  }\n\n  .toast-header {\n    background: none;\n    border-bottom: none;\n    color: inherit;\n  }\n\n  .toast-body {\n    font-family: Lato, sans-serif;\n    line-height: 1.25rem;\n\n    button {\n      font-size: 90%;\n      min-width: 4rem;\n    }\n  }\n\n  &.toast {\n    &.show {\n      display: block;\n      min-width: 20rem;\n      border-radius: 0.5rem;\n      -webkit-backdrop-filter: blur(10px);\n      backdrop-filter: blur(10px);\n      background-color: rgba(255, 255, 255, 0.5);\n      color: #1b1b1eba;\n      position: fixed;\n      left: 50%;\n      bottom: 20%;\n      transform: translateX(-50%);\n      -webkit-animation: popup 0.8s;\n      animation: popup 0.8s;\n    }\n  }\n}\n\n#toc-popup {\n  $slide-in: slide-in 0.3s ease-out;\n  $slide-out: slide-out 0.3s ease-out;\n  $curtain-height: 2rem;\n  $backdrop: blur(5px);\n\n  border-color: var(--toc-popup-border-color);\n  border-width: 1px;\n  border-radius: v.$radius-lg;\n  color: var(--text-color);\n  background: var(--card-bg);\n  margin-top: v.$topbar-height;\n  min-width: 20rem;\n  font-size: 1.05rem;\n\n  @include bp.sm {\n    max-width: 32rem;\n  }\n\n  &[open] {\n    -webkit-animation: $slide-in;\n    animation: $slide-in;\n  }\n\n  &[closing] {\n    -webkit-animation: $slide-out;\n    animation: $slide-out;\n  }\n\n  @include bp.lg {\n    left: v.$sidebar-width;\n  }\n\n  .header {\n    @extend %btn-color;\n\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    background-color: inherit;\n    border-bottom: 1px solid var(--main-border-color);\n\n    .label {\n      font-family: v.$font-family-heading;\n    }\n  }\n\n  button {\n    > i {\n      font-size: 1.25rem;\n      vertical-align: middle;\n    }\n\n    &:focus-visible {\n      box-shadow: none;\n    }\n  }\n\n  ul {\n    list-style-type: none;\n    padding-left: 0;\n\n    li {\n      ul,\n      & + li {\n        margin-top: 0.25rem;\n      }\n\n      a {\n        display: flex;\n        line-height: 1.5;\n        padding: 0.375rem 0;\n        padding-right: 1.125rem;\n\n        &.toc-link::before {\n          display: none;\n        }\n      }\n    }\n  }\n\n  @for $i from 2 through 4 {\n    .node-name--H#{$i} {\n      padding-left: 1.125rem * ($i - 1);\n    }\n  }\n\n  .is-active-link {\n    color: var(--toc-highlight) !important;\n    font-weight: 600;\n  }\n\n  &::-webkit-backdrop {\n    -webkit-backdrop-filter: $backdrop;\n    backdrop-filter: $backdrop;\n  }\n\n  &::backdrop {\n    -webkit-backdrop-filter: $backdrop;\n    backdrop-filter: $backdrop;\n  }\n\n  &::after {\n    display: flex;\n    content: '';\n    position: relative;\n    background: linear-gradient(transparent, var(--card-bg) 70%);\n    height: $curtain-height;\n  }\n\n  #toc-popup-content {\n    overflow: auto;\n    max-height: calc(100vh - 4 * v.$topbar-height);\n    font-family: v.$font-family-heading;\n    margin-bottom: -$curtain-height;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n$btn-border-width: 3px;\n$btn-mb: 0.5rem;\n$sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */\n\n#sidebar {\n  @include mx.pl-pr(0);\n\n  position: fixed;\n  top: 0;\n  left: 0;\n  height: 100%;\n  overflow-y: auto;\n  width: v.$sidebar-width;\n  background: var(--sidebar-bg);\n  border-right: 1px solid var(--sidebar-border-color);\n\n  /* Hide scrollbar for IE, Edge and Firefox */\n  -ms-overflow-style: none; /* IE and Edge */\n  scrollbar-width: none; /* Firefox */\n\n  /* Hide scrollbar for Chrome, Safari and Opera */\n  &::-webkit-scrollbar {\n    display: none;\n  }\n\n  @include bp.lt(bp.get(lg)) {\n    @include mx.slide;\n\n    transform: translateX(-#{v.$sidebar-width}); /* hide */\n    -webkit-transform: translateX(-#{v.$sidebar-width});\n\n    [#{$sidebar-display}] & {\n      transform: translateX(0);\n    }\n  }\n\n  @include bp.xxxl {\n    width: v.$sidebar-width-large;\n  }\n\n  %sidebar-link-hover {\n    &:hover {\n      color: var(--sidebar-active-color);\n    }\n  }\n\n  a {\n    @extend %sidebar-links;\n  }\n\n  #avatar {\n    display: block;\n    width: 6.5rem;\n    height: 6.5rem;\n    overflow: hidden;\n    box-shadow: var(--avatar-border-color) 0 0 0 2px;\n    transform: translateZ(0); /* fixed the zoom in Safari */\n\n    @include bp.sm {\n      width: 7rem;\n      height: 7rem;\n    }\n\n    img {\n      transition: transform 0.5s;\n\n      &:hover {\n        transform: scale(1.2);\n      }\n    }\n  }\n\n  .profile-wrapper {\n    @include mx.mt-mb(2.5rem);\n    @extend %clickable-transition;\n\n    padding-left: 2.5rem;\n    padding-right: 1.25rem;\n    width: 100%;\n\n    @include bp.lg {\n      margin-top: 3rem;\n    }\n\n    @include bp.xxxl {\n      margin-top: 3.5rem;\n      margin-bottom: 2.5rem;\n      padding-left: 3.5rem;\n    }\n  }\n\n  .site-title {\n    @extend %clickable-transition;\n    @extend %sidebar-link-hover;\n\n    font-family: inherit;\n    font-weight: 900;\n    font-size: 1.75rem;\n    line-height: 1.2;\n    letter-spacing: 0.25px;\n    margin-top: 1.25rem;\n    margin-bottom: 0.5rem;\n    width: fit-content;\n    color: var(--site-title-color);\n  }\n\n  .site-subtitle {\n    font-size: 95%;\n    color: var(--site-subtitle-color);\n    margin-top: 0.25rem;\n    word-spacing: 1px;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n  }\n\n  ul {\n    margin-bottom: 2rem;\n\n    li.nav-item {\n      opacity: 0.9;\n      width: 100%;\n\n      @include mx.pl-pr(1.5rem);\n\n      @include bp.xxxl {\n        @include mx.pl-pr(2.75rem);\n      }\n\n      a.nav-link {\n        @include mx.pt-pb(0.6rem);\n\n        display: flex;\n        align-items: center;\n        border-radius: 0.75rem;\n        font-weight: 600;\n\n        &:hover {\n          background-color: var(--sidebar-hover-bg);\n        }\n\n        i {\n          font-size: 95%;\n          opacity: 0.8;\n          margin-right: 1.5rem;\n        }\n\n        span {\n          font-size: 90%;\n          letter-spacing: 0.2px;\n        }\n      }\n\n      &.active {\n        .nav-link {\n          color: var(--sidebar-active-color);\n          background-color: var(--sidebar-hover-bg);\n\n          span {\n            opacity: 1;\n          }\n        }\n      }\n\n      &:not(:first-child) {\n        margin-top: 0.25rem;\n      }\n    }\n  }\n\n  .sidebar-bottom {\n    padding-left: 2rem;\n    padding-right: 1rem;\n    margin-bottom: 1.5rem;\n\n    @include bp.xxxl {\n      padding-left: 2.75rem;\n      margin-bottom: 1.75rem;\n    }\n\n    $btn-size: 1.75rem;\n\n    %button {\n      width: $btn-size;\n      height: $btn-size;\n      margin-bottom: $btn-mb; // multi line gap\n      border-radius: 50%;\n      color: var(--sidebar-btn-color);\n      background-color: var(--sidebar-btn-bg);\n      text-align: center;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n\n      &:not(:focus-visible) {\n        box-shadow: var(--sidebar-border-color) 0 0 0 1px;\n      }\n\n      &:hover {\n        background-color: var(--sidebar-hover-bg);\n      }\n    }\n\n    a {\n      @extend %button;\n      @extend %sidebar-link-hover;\n      @extend %clickable-transition;\n\n      &:not(:last-child) {\n        margin-right: v.$sb-btn-gap;\n\n        @include bp.xxxl {\n          margin-right: v.$sb-btn-gap-lg;\n        }\n      }\n    }\n\n    i {\n      line-height: $btn-size;\n    }\n\n    #mode-toggle {\n      @extend %button;\n      @extend %sidebar-links;\n      @extend %sidebar-link-hover;\n    }\n\n    .icon-border {\n      @extend %no-cursor;\n      @include mx.ml-mr(calc((v.$sb-btn-gap - $btn-border-width) / 2));\n\n      background-color: var(--sidebar-btn-color);\n      content: '';\n      width: $btn-border-width;\n      height: $btn-border-width;\n      border-radius: 50%;\n      margin-bottom: $btn-mb;\n\n      @include bp.xxxl {\n        @include mx.ml-mr(calc((v.$sb-btn-gap-lg - $btn-border-width) / 2));\n      }\n    }\n  } /* .sidebar-bottom */\n} /* #sidebar */\n\n[#{$sidebar-display}] {\n  #main-wrapper {\n    @include bp.lt(bp.get(lg)) {\n      transform: translateX(v.$sidebar-width);\n    }\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n#topbar-wrapper {\n  height: v.$topbar-height;\n  background-color: var(--topbar-bg);\n\n  @include bp.lt(bp.get(lg)) {\n    @include mx.slide(top 0.2s ease);\n\n    left: 0;\n  }\n}\n\n#topbar {\n  @extend %btn-color;\n\n  #breadcrumb {\n    font-size: 1rem;\n    color: var(--text-muted-color);\n    padding-left: 0.5rem;\n\n    a:hover {\n      @extend %link-hover;\n    }\n\n    span {\n      &:not(:last-child) {\n        &::after {\n          content: '›';\n          padding: 0 0.3rem;\n        }\n      }\n    }\n\n    @include bp.lt(bp.get(lg)) {\n      display: none;\n    }\n\n    @include bp.between(bp.get(lg), calc(#{bp.get(xl)} - 1px)) {\n      width: 65%;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      word-break: keep-all;\n      white-space: nowrap;\n    }\n  }\n\n  @include bp.lte(bp.get(md)) {\n    @include mx.max-w-100;\n  }\n\n  @include bp.lt(bp.get(lg)) {\n    max-width: 100%;\n  }\n}\n\n#topbar-title {\n  display: none;\n  font-size: 1.1rem;\n  font-weight: 600;\n  font-family: sans-serif;\n  color: var(--topbar-text-color);\n  text-align: center;\n  width: 70%;\n  word-break: keep-all;\n\n  @include bp.lt(bp.get(lg)) {\n    display: block;\n  }\n\n  @include bp.lg {\n    text-align: left;\n  }\n}\n\n#sidebar-trigger,\n#search-trigger {\n  display: none;\n\n  @include bp.lt(bp.get(lg)) {\n    display: block;\n  }\n}\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n.access {\n  top: 2rem;\n  transition: top 0.2s ease-in-out;\n  margin-top: 3rem;\n\n  &:only-child {\n    position: -webkit-sticky;\n    position: sticky;\n  }\n\n  > section {\n    @extend %panel-border;\n\n    padding-left: 1rem;\n\n    &:not(:first-child) {\n      margin-top: 4rem;\n    }\n  }\n\n  .content {\n    font-size: 0.9rem;\n  }\n}\n\n#panel-wrapper {\n  /* the headings */\n  .panel-heading {\n    font-family: inherit;\n    line-height: inherit;\n\n    @include mx.label(inherit);\n  }\n\n  .post-tag {\n    line-height: 1.05rem;\n    font-size: 0.85rem;\n    border-radius: 0.8rem;\n    padding: 0.3rem 0.5rem;\n    margin: 0 0.35rem 0.5rem 0;\n\n    &:hover {\n      transition: all 0.3s ease-in;\n    }\n  }\n\n  > :last-child {\n    margin-bottom: 4rem;\n  }\n\n  @include bp.lt(bp.get(xl)) {\n    display: none;\n  }\n}\n\n#access-lastmod {\n  a {\n    color: inherit;\n\n    &:hover {\n      @extend %link-hover;\n    }\n\n    @extend %no-bottom-border;\n  }\n}\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/variables' as v;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\nfooter {\n  background-color: var(--main-bg);\n  height: v.$footer-height;\n  border-top: 1px solid var(--main-border-color);\n\n  @extend %text-xs;\n\n  @include bp.lt(bp.get(lg)) {\n    @include mx.slide;\n\n    height: v.$footer-height-large;\n    padding: 1.5rem 0;\n  }\n\n  a {\n    @extend %text-highlight;\n\n    &:hover {\n      @extend %link-hover;\n    }\n  }\n\n  em {\n    @extend %text-highlight;\n  }\n\n  p {\n    text-align: center;\n    margin-bottom: 0;\n  }\n}\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/variables' as v;\n@use '../abstracts/placeholders';\n\nsearch {\n  display: flex;\n  width: 100%;\n  border-radius: 1rem;\n  border: 1px solid var(--search-border-color);\n  background: var(--main-bg);\n  padding: 0 0.5rem;\n\n  i {\n    z-index: 2;\n    font-size: 0.9rem;\n    color: var(--search-icon-color);\n  }\n\n  @include bp.lt(bp.get(lg)) {\n    display: none;\n  }\n\n  @include bp.lg {\n    max-width: v.$search-max-width;\n  }\n\n  @include bp.xl {\n    margin-right: 4rem;\n  }\n\n  @include bp.xxxl {\n    margin-right: calc(\n      v.$main-content-max-width / 4 - v.$search-max-width - 0.75rem\n    );\n  }\n}\n\n#search-result-wrapper {\n  display: none;\n  height: 100%;\n  width: 100%;\n  overflow: auto;\n\n  .content {\n    margin-top: 2rem;\n  }\n\n  @include bp.lt(bp.get(lg)) {\n    width: 100%;\n\n    .content {\n      letter-spacing: 0;\n    }\n  }\n\n  @include bp.lg {\n    max-width: v.$main-content-max-width;\n    justify-content: start !important;\n  }\n}\n\n#search-results {\n  padding-bottom: 3rem;\n\n  @include bp.between(bp.get(lg), calc(#{bp.get(xl)} - 1px)) {\n    > div {\n      max-width: 700px;\n    }\n  }\n\n  a {\n    font-size: 1.4rem;\n    line-height: 1.5rem;\n\n    &:hover {\n      @extend %link-hover;\n    }\n\n    @extend %link-color;\n    @extend %no-bottom-border;\n    @extend %heading;\n  }\n\n  > article {\n    width: 100%;\n\n    &:not(:last-child) {\n      margin-bottom: 1rem;\n    }\n\n    @include bp.xl {\n      width: 45%;\n\n      &:nth-child(odd) {\n        margin-right: 1.5rem;\n      }\n\n      &:nth-child(even) {\n        margin-left: 1.5rem;\n      }\n\n      &:last-child:nth-child(odd) {\n        position: relative;\n        right: 24.3%;\n      }\n    }\n\n    h2 {\n      line-height: 2.5rem;\n    }\n\n    /* icons */\n    i {\n      color: #818182;\n      margin-right: 0.15rem;\n      font-size: 80%;\n    }\n\n    > p {\n      @extend %text-ellipsis;\n\n      white-space: break-spaces;\n      display: -webkit-box;\n      -webkit-line-clamp: 3;\n      -webkit-box-orient: vertical;\n    }\n  }\n}\n\n/* 'Cancel' link */\n#search-cancel {\n  color: var(--link-color);\n  display: none;\n  white-space: nowrap;\n\n  @extend %cursor-pointer;\n}\n\n#search-input {\n  background: center;\n  border: 0;\n  border-radius: 0;\n  padding: 0.18rem 0.3rem;\n  color: var(--text-color);\n  height: auto;\n\n  &:focus {\n    box-shadow: none;\n  }\n\n  @include bp.xl {\n    transition: all 0.3s ease-in-out;\n  }\n}\n\n#search-hints {\n  padding: 0 1rem;\n\n  @include bp.lg {\n    display: none;\n  }\n\n  h4 {\n    margin-bottom: 1.5rem;\n  }\n\n  .post-tag {\n    display: inline-block;\n    line-height: 1rem;\n    font-size: 1rem;\n    background: var(--search-tag-bg);\n    border: none;\n    padding: 0.5rem;\n    margin: 0 1.25rem 1rem 0;\n\n    &::before {\n      content: '#';\n      color: var(--text-muted-color);\n      padding-right: 0.2rem;\n    }\n\n    @extend %link-color;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n#post-list {\n  margin-top: 2rem;\n\n  @include bp.lg {\n    margin-top: 2.5rem;\n  }\n\n  .card-wrapper {\n    &:hover {\n      text-decoration: none;\n    }\n\n    &:not(:last-child) {\n      margin-bottom: 1.25rem;\n    }\n  }\n\n  .card {\n    border: 0;\n    background: none;\n\n    %img-radius {\n      border-radius: v.$radius-lg v.$radius-lg 0 0;\n\n      @include bp.md {\n        border-radius: 0 v.$radius-lg v.$radius-lg 0;\n      }\n    }\n\n    .preview-img {\n      @extend %img-radius;\n\n      img {\n        @extend %img-radius;\n      }\n    }\n\n    .card-body {\n      height: 100%;\n      padding: 1rem;\n\n      @include bp.md {\n        padding: 1.75rem 1.75rem 1.25rem;\n      }\n\n      .card-title {\n        @extend %text-clip;\n\n        color: var(--heading-color) !important;\n        font-size: 1.25rem;\n      }\n\n      %muted {\n        color: var(--text-muted-color) !important;\n      }\n\n      .card-text {\n        @include bp.md {\n          display: inherit !important;\n        }\n\n        &.content {\n          @extend %muted;\n\n          p {\n            @extend %text-clip;\n\n            line-height: 1.5;\n            margin: 0;\n          }\n        }\n      }\n\n      .post-meta {\n        @extend %muted;\n\n        i {\n          &:not(:first-child) {\n            margin-left: 1.5rem;\n\n            @include bp.md {\n              margin-left: 1.75rem;\n            }\n          }\n        }\n\n        em {\n          @extend %normal-font-style;\n\n          color: inherit;\n        }\n\n        > div:first-child {\n          display: block;\n\n          @extend %text-ellipsis;\n        }\n      }\n    }\n  }\n} /* #post-list */\n\n.pagination {\n  color: var(--text-color);\n  font-family: Lato, sans-serif;\n  justify-content: space-evenly;\n\n  @include bp.lg {\n    font-size: 0.85rem;\n    justify-content: center;\n  }\n\n  a:hover {\n    text-decoration: none;\n  }\n\n  .page-item {\n    @include bp.lt(bp.get(lg)) {\n      &:not(:first-child):not(:last-child) {\n        display: none;\n      }\n    }\n\n    @include bp.lg {\n      &:not(:last-child) {\n        margin-right: 0.7rem;\n      }\n    }\n\n    .page-link {\n      color: var(--btn-patinator-text-color);\n      padding: 0 0.6rem;\n      display: -webkit-box;\n      -webkit-box-pack: center;\n      -webkit-box-align: center;\n      border-radius: 0.5rem;\n      border: 0;\n      background-color: inherit;\n    }\n\n    &.active {\n      .page-link {\n        background-color: var(--btn-paginator-hover-color);\n      }\n    }\n\n    &:not(.active) {\n      .page-link {\n        &:hover {\n          box-shadow: inset var(--btn-border-color) 0 0 0 1px;\n        }\n      }\n    }\n\n    &.disabled {\n      cursor: not-allowed;\n\n      .page-link {\n        color: rgba(108, 117, 125, 0.57);\n      }\n    }\n  } /* .page-item */\n\n  .page-index {\n    @include bp.lg {\n      display: none;\n    }\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n%-btn-post-nav {\n  width: 50%;\n  position: relative;\n  border-color: var(--btn-border-color);\n}\n\n@mixin -dot($pl: 0.25rem, $pr: 0.25rem) {\n  content: '\\2022';\n  padding-left: $pl;\n  padding-right: $pr;\n}\n\nheader {\n  .post-desc {\n    @extend %heading;\n\n    font-size: 1.125rem;\n    line-height: 1.6;\n  }\n\n  .post-meta {\n    span + span::before {\n      @include -dot;\n    }\n\n    em,\n    time {\n      @extend %text-highlight;\n    }\n\n    em {\n      a {\n        color: inherit;\n      }\n    }\n  }\n\n  h1 + .post-meta {\n    margin-top: 1.5rem;\n  }\n}\n\n.post-tail-wrapper {\n  @extend %text-sm;\n\n  margin-top: 6rem;\n  border-bottom: 1px double var(--main-border-color);\n\n  .license-wrapper {\n    line-height: 1.2rem;\n\n    > a {\n      @extend %text-highlight;\n\n      &:hover {\n        @extend %link-hover;\n      }\n    }\n\n    span:last-child {\n      @extend %text-sm;\n    }\n  } /* .license-wrapper */\n\n  .post-meta a:not(:hover) {\n    @extend %link-underline;\n  }\n\n  .share-wrapper {\n    vertical-align: middle;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n\n    %icon-size {\n      font-size: 1.125rem;\n    }\n\n    .share-icons {\n      display: flex;\n\n      i {\n        color: var(--btn-share-color);\n\n        @extend %icon-size;\n      }\n\n      > * {\n        @extend %icon-size;\n\n        margin-left: 0.5rem;\n\n        &:hover {\n          i {\n            @extend %btn-share-hover;\n          }\n        }\n      }\n\n      button {\n        padding: 0;\n        border: none;\n        line-height: inherit;\n\n        @extend %cursor-pointer;\n      }\n    } /* .share-icons */\n  } /* .share-wrapper */\n}\n\n.post-tail-bottom {\n  @include bp.lte(bp.get(sm)) {\n    flex-wrap: wrap-reverse !important;\n\n    > div:first-child {\n      width: 100%;\n      margin-top: 1rem;\n    }\n  }\n}\n\n.share-mastodon {\n  /* See: https://github.com/justinribeiro/share-to-mastodon#properties */\n  --wc-stm-font-family: v.$font-family-base;\n  --wc-stm-dialog-background-color: var(--card-bg);\n  --wc-stm-form-button-border: 1px solid var(--btn-border-color);\n  --wc-stm-form-submit-background-color: var(--sidebar-btn-bg);\n  --wc-stm-form-cancel-background-color: var(--sidebar-btn-bg);\n  --wc-stm-form-button-background-color-hover: #007bff;\n  --wc-stm-form-button-color-hover: white;\n\n  font-size: 1rem;\n}\n\n.post-tags {\n  line-height: 2rem;\n\n  .post-tag {\n    &:hover {\n      @extend %link-hover;\n      @extend %tag-hover;\n      @extend %no-bottom-border;\n    }\n  }\n}\n\n.post-navigation {\n  @include bp.lt(bp.get(lg)) {\n    @include mx.pl-pr(0);\n    @include mx.ml-mr(-0.5rem);\n  }\n\n  .btn {\n    @extend %-btn-post-nav;\n\n    &:not(:hover) {\n      color: var(--link-color);\n    }\n\n    &:hover {\n      &:not(.disabled)::before {\n        color: whitesmoke;\n      }\n    }\n\n    &.disabled {\n      @extend %-btn-post-nav;\n\n      pointer-events: auto;\n      cursor: not-allowed;\n      background: none;\n      color: gray;\n    }\n\n    &.btn-outline-primary.disabled:focus {\n      box-shadow: none;\n    }\n\n    &::before {\n      color: var(--text-muted-color);\n      font-size: 0.65rem;\n      text-transform: uppercase;\n      content: attr(aria-label);\n    }\n\n    &:first-child {\n      border-radius: v.$radius-lg 0 0 v.$radius-lg;\n      left: 0.5px;\n    }\n\n    &:last-child {\n      border-radius: 0 v.$radius-lg v.$radius-lg 0;\n      right: 0.5px;\n    }\n  }\n\n  p {\n    font-size: 1.1rem;\n    line-height: 1.5rem;\n    margin-top: 0.3rem;\n    white-space: normal;\n  }\n} /* .post-navigation */\n\n@media (hover: hover) {\n  .post-navigation {\n    .btn,\n    .btn::before {\n      transition: all 0.35s ease-in-out;\n    }\n  }\n}\n\n@-webkit-keyframes fade-up {\n  from {\n    opacity: 0;\n    margin-top: 4rem;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes fade-up {\n  from {\n    opacity: 0;\n    margin-top: 4rem;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n/* TOC panel */\n\n%top-cover {\n  content: '';\n  display: block;\n  position: -webkit-sticky;\n  position: sticky;\n  top: 0;\n  width: 100%;\n  height: 3rem;\n  background: linear-gradient(var(--main-bg) 50%, transparent);\n}\n\n#toc-wrapper {\n  top: 0;\n  transition: top 0.2s ease-in-out;\n  overflow-y: auto;\n  max-height: 100vh;\n  scrollbar-width: none;\n  margin-top: 2rem;\n\n  &:not(.invisible) {\n    -webkit-animation: fade-up 0.8s;\n    animation: fade-up 0.8s;\n  }\n\n  ul {\n    list-style: none;\n    font-size: 0.85rem;\n    line-height: 1.25;\n    padding-left: 0;\n\n    li {\n      a {\n        padding: 0.4rem 0 0.4rem 1.25rem;\n      }\n    }\n\n    /* Overwrite TOC plugin style */\n\n    .toc-link {\n      display: block;\n\n      @extend %text-ellipsis;\n\n      &:hover {\n        color: var(--toc-highlight);\n        text-decoration: none;\n      }\n\n      &::before {\n        display: none;\n      }\n    }\n\n    .is-active-link {\n      color: var(--toc-highlight) !important;\n      font-weight: 600;\n\n      &::before {\n        display: inline-block;\n        width: 1px;\n        height: 1.25rem;\n        background-color: var(--toc-highlight) !important;\n      }\n    }\n\n    ul {\n      padding-left: 0.75rem;\n    }\n  }\n\n  @at-root .toc-border-cover {\n    @extend %top-cover;\n\n    margin-bottom: -4rem;\n  }\n\n  &::before {\n    @extend %top-cover;\n  }\n\n  &::after {\n    content: '';\n    position: fixed;\n    bottom: 0;\n    width: 15%;\n    height: 2.25rem;\n    margin-left: -1px;\n    background: linear-gradient(transparent, var(--main-bg) 70%);\n  }\n\n  > * {\n    @extend %panel-border;\n  }\n}\n\n/* --- TOC button, bar and popup in mobile/tablet --- */\n\n#toc-bar {\n  position: -webkit-sticky;\n  position: sticky;\n  top: 0;\n  z-index: 1;\n  margin: 0 -1rem;\n  height: v.$topbar-height;\n  background: var(--main-bg);\n  border-bottom: 1px solid var(--main-border-color);\n  transition: all 0.2s ease-in-out;\n\n  @extend %btn-color;\n\n  @include bp.xl {\n    display: none !important;\n  }\n\n  .label {\n    @extend %heading;\n\n    margin-left: 0.375rem;\n    padding: 0 0.75rem;\n    color: inherit;\n  }\n\n  &.invisible {\n    top: -#{v.$topbar-height};\n    transition: none;\n  }\n}\n\n#toc-solo-trigger {\n  color: var(--text-muted-color);\n  border-color: var(--btn-border-color);\n  border-radius: v.$radius-lg;\n\n  @include bp.xl {\n    display: none !important;\n  }\n\n  .label {\n    font-size: 1rem;\n    font-family: v.$font-family-heading;\n  }\n\n  &:hover {\n    box-shadow: none;\n    background: none;\n  }\n}\n\n@mixin slide-in {\n  from {\n    opacity: 0.7;\n    transform: translateY(-#{v.$topbar-height});\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@mixin slide-out {\n  0% {\n    transform: translateY(0);\n    opacity: 1;\n  }\n\n  100% {\n    transform: translateY(-#{v.$topbar-height});\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes slide-in {\n  @include slide-in;\n}\n\n@keyframes slide-in {\n  @include slide-in;\n}\n\n@-webkit-keyframes slide-out {\n  @include slide-out;\n}\n\n@keyframes slide-out {\n  @include slide-out;\n}\n\n/* --- Related Posts --- */\n\n#related-posts {\n  > h3 {\n    @include mx.label(1.1rem, 600);\n  }\n\n  time {\n    @extend %normal-font-style;\n    @extend %text-xs;\n\n    color: var(--text-muted-color);\n  }\n\n  p {\n    @extend %text-ellipsis;\n\n    font-size: 0.9rem;\n    margin-bottom: 0.5rem;\n    white-space: break-spaces;\n    display: -webkit-box;\n    -webkit-line-clamp: 2;\n    -webkit-box-orient: vertical;\n  }\n\n  .card {\n    h4 {\n      @extend %text-clip;\n    }\n  }\n}\n\n/* stylelint-disable-next-line selector-id-pattern */\n#disqus_thread {\n  min-height: 8.5rem;\n}\n\n.utterances {\n  max-width: 100%;\n  min-height: 269px;\n}\n\n%btn-share-hover {\n  color: var(--btn-share-hover-color) !important;\n}\n\n.share-label {\n  @include mx.label(inherit, 400, inherit);\n\n  &::after {\n    content: ':';\n  }\n}\n\n.content > p > img {\n  @include bp.lte(bp.get(md)) {\n    max-width: calc(100% + 1rem);\n  }\n}\n\nh2,\nh3,\nh4 {\n  @include bp.xl {\n    scroll-margin-top: 2rem;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/placeholders';\n\n%-category-icon-color {\n  color: gray;\n}\n\n.categories {\n  margin-bottom: 2rem;\n  border-color: var(--categories-border);\n\n  &.card,\n  .list-group {\n    @extend %rounded;\n  }\n\n  .card-header {\n    $radius: calc(v.$radius-lg - 1px);\n\n    padding: 0.75rem;\n    border-radius: $radius;\n    border-bottom: 0;\n\n    &.hide-border-bottom {\n      border-bottom-left-radius: 0;\n      border-bottom-right-radius: 0;\n    }\n  }\n\n  i {\n    @extend %-category-icon-color;\n\n    font-size: 86%; /* fontawesome icons */\n  }\n\n  .list-group-item {\n    border-left: none;\n    border-right: none;\n    padding-left: 2rem;\n\n    &:first-child {\n      border-top-left-radius: 0;\n      border-top-right-radius: 0;\n    }\n\n    &:last-child {\n      border-bottom: 0;\n    }\n  }\n} /* .categories */\n\n.category-trigger {\n  width: 1.7rem;\n  height: 1.7rem;\n  border-radius: 50%;\n  text-align: center;\n  color: #6c757d !important;\n\n  i {\n    position: relative;\n    height: 0.7rem;\n    width: 1rem;\n    transition: transform 300ms ease;\n  }\n\n  &:hover {\n    i {\n      color: var(--categories-icon-hover-color);\n    }\n  }\n}\n\n/* only works on desktop */\n@media (hover: hover) {\n  .category-trigger:hover {\n    background-color: var(--categories-hover-bg);\n  }\n}\n\n.rotate {\n  transform: rotate(-90deg);\n}\n","@use '../abstracts/breakpoints' as bp;\n\n.tag {\n  border-radius: 0.7em;\n  padding: 6px 8px 7px;\n  margin-right: 0.8rem;\n  line-height: 3rem;\n  letter-spacing: 0;\n  border: 1px solid var(--tag-border) !important;\n  box-shadow: 0 0 3px 0 var(--tag-shadow);\n\n  span {\n    margin-left: 0.6em;\n    font-size: 0.7em;\n    font-family: Oswald, sans-serif;\n  }\n}\n\n#tags {\n  @include bp.lt(bp.get(lg)) {\n    justify-content: center !important;\n  }\n}\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n#archives {\n  letter-spacing: 0.03rem;\n\n  @include bp.lt(bp.get(sm)) {\n    margin-top: -1rem;\n\n    ul {\n      letter-spacing: 0;\n    }\n  }\n\n  $timeline-width: 4px;\n\n  %timeline {\n    content: '';\n    width: $timeline-width;\n    position: relative;\n    float: left;\n    background-color: var(--timeline-color);\n  }\n\n  .year {\n    height: 3.5rem;\n    font-size: 1.5rem;\n    position: relative;\n    left: 2px;\n    margin-left: -$timeline-width;\n\n    &::before {\n      @extend %timeline;\n\n      height: 72px;\n      left: 79px;\n      bottom: 16px;\n    }\n\n    &:first-child::before {\n      @extend %timeline;\n\n      height: 32px;\n      top: 24px;\n    }\n\n    /* Year dot */\n    &::after {\n      content: '';\n      display: inline-block;\n      position: relative;\n      border-radius: 50%;\n      width: 12px;\n      height: 12px;\n      left: 21.5px;\n      border: 3px solid;\n      background-color: var(--timeline-year-dot-color);\n      border-color: var(--timeline-node-bg);\n      box-shadow: 0 0 2px 0 #c2c6cc;\n      z-index: 1;\n    }\n  }\n\n  ul {\n    li {\n      font-size: 1.1rem;\n      line-height: 3rem;\n\n      @extend %text-ellipsis;\n\n      &:nth-child(odd) {\n        background-color: var(--main-bg, #ffffff);\n        background-image: linear-gradient(\n          to left,\n          #ffffff,\n          #fbfbfb,\n          #fbfbfb,\n          #fbfbfb,\n          #ffffff\n        );\n      }\n\n      &::before {\n        @extend %timeline;\n\n        top: 0;\n        left: 77px;\n        height: 3.1rem;\n      }\n    }\n\n    &:last-child li:last-child::before {\n      height: 1.5rem;\n    }\n  } /* #archives ul */\n\n  .date {\n    white-space: nowrap;\n    display: inline-block;\n    position: relative;\n    right: 0.5rem;\n\n    &.month {\n      width: 1.4rem;\n      text-align: center;\n    }\n\n    &.day {\n      font-size: 85%;\n      font-family: Lato, sans-serif;\n    }\n  }\n\n  a {\n    /* post title in Archvies */\n    margin-left: 2.5rem;\n    position: relative;\n    top: 0.1rem;\n\n    &:hover {\n      border-bottom: none;\n    }\n\n    &::before {\n      /* the dot before post title */\n      content: '';\n      display: inline-block;\n      position: relative;\n      border-radius: 50%;\n      width: 8px;\n      height: 8px;\n      float: left;\n      top: 1.35rem;\n      left: 71px;\n      background-color: var(--timeline-node-bg);\n      box-shadow: 0 0 3px 0 #c2c6cc;\n      z-index: 1;\n    }\n  }\n} /* #archives */\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n.dash {\n  margin: 0 0.5rem 0.6rem 0.5rem;\n  border-bottom: 2px dotted var(--dash-color);\n}\n\n#page-category,\n#page-tag {\n  ul > li {\n    line-height: 1.5rem;\n    padding: 0.6rem 0;\n\n    /* dot */\n    &::before {\n      background: #999999;\n      width: 5px;\n      height: 5px;\n      border-radius: 50%;\n      display: block;\n      content: '';\n      position: relative;\n      top: 0.6rem;\n      margin-right: 0.5rem;\n\n      @include bp.lt(bp.get(sm)) {\n        margin: 0 0.5rem;\n      }\n    }\n\n    /* post's title */\n    > a {\n      @extend %no-bottom-border;\n\n      font-size: 1.1rem;\n\n      @include bp.lt(bp.get(sm)) {\n        @include mx.text-ellipsis;\n      }\n    }\n  }\n}\n\n/* tag icon */\n#page-tag h1 > i {\n  font-size: 1.2rem;\n}\n\n#page-category h1 > i {\n  font-size: 1.25rem;\n}\n\n#page-category,\n#page-tag,\n#access-lastmod {\n  a:hover {\n    @extend %link-hover;\n\n    margin-bottom: -1px; /* Avoid jumping */\n  }\n}\n","@use 'sass:math';\n@use 'main';\n\n/* 生成动画 */\n@keyframes infirot {\n  from {\n    -webkit-transform: rotate(0deg);\n  }\n\n  to {\n    -webkit-transform: rotate(360deg);\n  }\n}\n\n.icon-loading1 {\n  display: inline-block;\n  animation: infirot 1s linear infinite;\n  -webkit-animation: infirot 1s linear infinite;\n}\n\n@function random_range($min, $max) {\n  $rand: math.random();\n  $random_range: $min + math.floor($rand * (($max - $min) + 1));\n  @return $random_range;\n}\n\n#animation {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  pointer-events: none;\n\n  @keyframes animate {\n    0% {\n      transform: translateY(0) rotate(0deg);\n      opacity: 1;\n      border-radius: 0;\n    }\n    100% {\n      transform: translateY(-1200px) rotate(720deg);\n      opacity: 0;\n      border-radius: 50%;\n    }\n  }\n\n  @media all and (min-width: 1200px) {\n    .animation-circle {\n      position: absolute;\n      left: var(--circle-left);\n      bottom: -300px;\n      display: block;\n      background: var(--circle-background);\n      width: var(--circle-side-length);\n      height: var(--circle-side-length);\n      animation: animate 25s linear infinite;\n      animation-duration: var(--circle-time);\n      animation-delay: var(--circle-delay);\n      pointer-events: none;\n\n      @for $i from 0 through 50 {\n        &:nth-child(#{$i}) {\n          --circle-left: #{random_range(0%, 100%)};\n          --circle-background: rgba(#{random_range(0, 255)}, #{random_range(0, 255)}, #{random_range(0, 255)}, 0.06); // 最后一个数为透明度\n          --circle-side-length: #{random_range(20px, 200px)};\n          --circle-time: #{random_range(10s, 45s)};\n          --circle-delay: #{random_range(0s, 25s)};\n        }\n      }\n    }\n  }\n\n  @media all and (max-width: 1199px) {\n    .animation-circle {\n      display: none;\n    }\n  }\n}\n\n\n/* append your custom style below */\n/* 覆盖主题的博客帖子边框样式 */\n.card-wrapper.card {\n  border: 3px solid #e3e5e7 !important; /* 使用更显眼的蓝色边框 */\n  padding: 2px; /* 适中的内边距 */\n  margin-bottom: 2px; /* 适中的下边距 */\n  border-radius: 8px; /* 适中的圆角 */\n  background-color: #f9f9f9; /* 淡灰色背景，增强边框的对比 */\n  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* 轻微的阴影 */\n  transition: transform 0.3s ease, box-shadow 0.3s ease; /* 添加平滑过渡效果 */\n}\n\n.card-wrapper.card:hover {\n  transform: translateY(-5px); /* 鼠标悬停时轻微上移 */\n  box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2); /* 增加阴影效果 */\n}\n\n/* 侧边栏背景及文字样式设置 */\n#sidebar {\n  background-image: url('/assets/img/background-dark.jpg');\n  background-size: cover;\n  background-repeat: no-repeat;\n  background-position: top;\n}\n\n#sidebar .site-title a {\n  color: #ffffff; \n  text-shadow: 5px 5px 10px rgba(0,0,0,0.5);\n}\n#sidebar .site-subtitle {\n  color: #ffffff;\n  text-shadow: 2px 2px 3px rgba(0,0,0, 0.7);\n}\n#sidebar .sidebar-bottom .mode-toggle, #sidebar a {\n  color: #ffffff;\n}\n#sidebar .sidebar-bottom .btn {\n  color: var(--sidebar-btn-color);\n}"],"file":"jekyll-theme-chirpy.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/base/_reset.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/abstracts/_mixins.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/abstracts/_placeholders.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/abstracts/_variables.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/base/_base.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/themes/_light.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/themes/_dark.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/abstracts/_breakpoints.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/base/_typography.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/base/_syntax.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/components/_buttons.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/components/_popups.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/layout/_sidebar.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/layout/_topbar.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/layout/_panel.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/layout/_footer.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_search.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_home.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_post.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_categories.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_tags.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_archives.scss","../../../../../../F:/Ruby33-x64/lib/ruby/gems/3.3.0/gems/jekyll-theme-chirpy-7.2.4/_sass/pages/_category-tag.scss","jekyll-theme-chirpy.scss"],"names":[],"mappings":"CAEA,4BC8BE,yCD1BF,mBC0BE,yCDtBF,uBCsBE,yCDlBF,wBCkBE,yCDdF,cCcE,yCDVF,kCCcE,WDVF,yBCUE,WDNF,6BCME,WDFF,8BCEE,WDEF,oBCFE,WCjCF,mEACE,2BACA,gBACA,YCuBoB,kCDtBpB,yBAIA,4CACE,cAGF,qBACE,4CACE,kBACA,UACA,2DAIA,oEACE,mBACA,UACA,0DAMR,sCACE,4BACA,uCAGF,+DACE,mBACA,cACA,mBAGF,2QACE,yBACA,gCACA,qBAGF,4CACE,wBAGF,sEACE,oDAGF,0EACE,+BAGF,gFACE,yBACA,sBACA,qBACA,iBAGF,6LACE,mBAGF,yFACE,eAGF,4EACE,kBAGF,wMACE,cClEU,KDsEV,oDACE,cACA,kBACA,kBACA,cACA,UACA,cAIJ,iDACE,iCACA,yBACA,sBACA,qBACA,iBAGF,iHACE,oBACA,gBACA,uBACA,qBACA,4BAGF,4ID9GE,gBACA,uBACA,mBCgHF,qGACE,wCACA,gBAGF,kFACE,iBAGF,2BACE,gBAIA,mCACE,2CACA,uBACA,0BACA,kBACA,8CAKF,+DACE,WAIJ,kDACE,2CAGF,cACE,kBACA,qBAOF,+BACE,+CEvJF,MACE,eAIA,oCACE,4CCXF,iBACA,mBACA,6BAGA,sBACA,4BACA,sCACA,yBACA,uBACA,mCACA,iCACA,sBACA,gCACA,qBACA,4BACA,+BACA,sCACA,0BACA,kCACA,oFAKA,2HAQA,uCACA,+BACA,sBACA,gCACA,+BACA,gCACA,6CACA,wBACA,6BACA,6BAGA,qCACA,qCACA,0CACA,6BACA,oCAGA,gCACA,oCACA,+CAGA,yBACA,oCACA,wBACA,iCACA,iBACA,yBACA,yFAEA,gCACA,qBACA,2BACA,qBACA,0BACA,oCACA,sBACA,2CACA,yCACA,iCACA,0BACA,kCACA,wCACA,qCACA,6CACA,oCAGA,sBACA,sCACA,gCACA,yBAGA,0CACA,+CACA,6CAGA,uCACA,4BACA,mCAGA,iCACA,8BACA,mCACA,kCACA,yCACA,sBACA,kCACA,mCACA,kCACA,mCAEA,8EACE,2CAGF,wDACE,aAKF,oFACE,YAGF,sFACE,SAGF,0IAEE,cACA,yBAGF,ogBAOE,cAGF,0EACE,cAGF,0EACE,cACA,yBAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cACA,yBAGF,0EACE,cAGF,guBAUE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,kXAKE,cAGF,kJAEE,cAGF,0EACE,cACA,iBAGF,0EACE,cACA,iBAGF,4yBAWE,cAGF,0EACE,cAGF,oJAEE,cAGF,4EACE,cACA,yBAGF,glBAQE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cAGF,0EACE,cACA,kBAGF,0EACE,cACA,iBDpSA,qBEjBF,kBAGA,2BACA,2BACA,qCAGA,iCACA,4BACA,sCACA,yBACA,uBACA,2CACA,iCACA,iCACA,0CACA,qBACA,4BACA,yCACA,sCACA,0BACA,qCACA,4CACA,4EACA,0HAQA,4BACA,+BACA,sBACA,gCACA,+BACA,iDACA,4BACA,0BACA,6BACA,+CAGA,mCACA,uCACA,uCACA,wCACA,+CAGA,2CACA,8CACA,qCAGA,oCACA,kCACA,6BACA,qBACA,8BACA,oCACA,uCACA,2BACA,iCACA,mBACA,yBACA,sFAEA,0BACA,0BACA,wBACA,8CACA,uCACA,gDACA,uCACA,kCACA,0CACA,mDACA,wCACA,oCAGA,8BACA,8BACA,8BACA,yBAGA,0CACA,uCACA,qCAGA,uCACA,kCACA,iDAGA,iCACA,8BACA,mCACA,kCACA,4CACA,sBACA,kCACA,mCACA,kCACA,mCACA,+BAEA,4BACE,aAIF,4EAEE,gCAIA,8CACE,uCAGF,kDACE,iBACA,kBACA,kBACA,sCAEA,6DACE,mCAKN,iDACE,+HAWF,oCACE,kBAKF,oCACE,cAGF,yCACE,YAGF,0CACE,SAGF,mEAEE,cACA,yBAGF,qCACE,cACA,yBAGF,4PAOE,cAGF,oCACE,cAGF,oCACE,cAGF,uEAEE,cAGF,uEAEE,cAGF,oCACE,cAGF,oCACE,cACA,yBAGF,oCACE,cACA,yBACA,iBAGF,mLAKE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,mUASE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,oCACE,cAGF,+RAQE,cAGF,oCACE,eFrRF,mCACE,2CEvBF,kBAGA,2BACA,2BACA,qCAGA,iCACA,4BACA,sCACA,yBACA,uBACA,2CACA,iCACA,iCACA,0CACA,qBACA,4BACA,yCACA,sCACA,0BACA,qCACA,4CACA,4EACA,0HAQA,4BACA,+BACA,sBACA,gCACA,+BACA,iDACA,4BACA,0BACA,6BACA,+CAGA,mCACA,uCACA,uCACA,wCACA,+CAGA,2CACA,8CACA,qCAGA,oCACA,kCACA,6BACA,qBACA,8BACA,oCACA,uCACA,2BACA,iCACA,mBACA,yBACA,sFAEA,0BACA,0BACA,wBACA,8CACA,uCACA,gDACA,uCACA,kCACA,0CACA,mDACA,wCACA,oCAGA,8BACA,8BACA,8BACA,yBAGA,0CACA,uCACA,qCAGA,uCACA,kCACA,iDAGA,iCACA,8BACA,mCACA,kCACA,4CACA,sBACA,kCACA,mCACA,kCACA,mCACA,+BAEA,yDACE,aAIF,0JAEE,gCAIA,6FACE,uCAGF,qGACE,iBACA,kBACA,kBACA,sCAEA,2HACE,mCAKN,mGACE,+HAWF,yEACE,kBAKF,yEACE,cAGF,mFACE,YAGF,qFACE,SAGF,wIAEE,cACA,yBAGF,2EACE,cACA,yBAGF,+fAOE,cAGF,yEACE,cAGF,yEACE,cAGF,gJAEE,cAGF,gJAEE,cAGF,yEACE,cAGF,yEACE,cACA,yBAGF,yEACE,cACA,yBACA,iBAGF,2WAKE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,+oBASE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,yEACE,cAGF,skBAQE,cAGF,yEACE,cF/QA,sBC3BF,iBACA,mBACA,6BAGA,sBACA,4BACA,sCACA,yBACA,uBACA,mCACA,iCACA,sBACA,gCACA,qBACA,4BACA,+BACA,sCACA,0BACA,kCACA,oFAKA,2HAQA,uCACA,+BACA,sBACA,gCACA,+BACA,gCACA,6CACA,wBACA,6BACA,6BAGA,qCACA,qCACA,0CACA,6BACA,oCAGA,gCACA,oCACA,+CAGA,yBACA,oCACA,wBACA,iCACA,iBACA,yBACA,yFAEA,gCACA,qBACA,2BACA,qBACA,0BACA,oCACA,sBACA,2CACA,yCACA,iCACA,0BACA,kCACA,wCACA,qCACA,6CACA,oCAGA,sBACA,sCACA,gCACA,yBAGA,0CACA,+CACA,6CAGA,uCACA,4BACA,mCAGA,iCACA,8BACA,mCACA,kCACA,yCACA,sBACA,kCACA,mCACA,kCACA,mCAEA,uCACE,2CAGF,4BACE,aAKF,0CACE,YAGF,2CACE,SAGF,qEAEE,cACA,yBAGF,kQAOE,cAGF,qCACE,cAGF,qCACE,cACA,yBAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cACA,yBAGF,qCACE,cAGF,gXAUE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,yLAKE,cAGF,yEAEE,cAGF,qCACE,cACA,iBAGF,qCACE,cACA,iBAGF,sZAWE,cAGF,qCACE,cAGF,0EAEE,cAGF,sCACE,cACA,yBAGF,wSAQE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cAGF,qCACE,cACA,kBAGF,qCACE,cACA,kBEzQF,kCHlCF,KAwBI,mBAIJ,KACE,0BACA,kHAEA,wBACA,mCACA,YDjBiB,+CIRjB,8CH4BF,iBAEI,aAEA,0BACE,mBGUJ,mCHJA,YAEI,iCAKN,aACE,mBACA,WACA,YACA,gBAIA,yBACE,yBAGF,iBACE,YACA,oBACA,iBAIS,4BACP,WAKN,cAGE,SACA,0BACA,8BAEA,sBAGE,WACA,WACA,YACA,kBACA,sCACA,UACA,oCAIA,4BACE,WAmBN,SACE,kBACA,gBACA,yBGnFA,mCHgFF,SAMI,mBAIA,iBHtIF,WGyIsB,MHxItB,cGwIsB,MAElB,eAcF,8FAEE,8BACA,6BAEA,0GACE,gBACA,oBAGF,oNAEE,8BACA,6BACA,eAKN,sBACE,8BACA,6BAEA,yBACE,qBACA,eAGA,2BACE,WACA,qBACA,4BAEA,mCACE,oCAIJ,4BACE,8BACA,6BAIJ,2CACE,6BACA,sBAIJ,eACE,iBAGF,kBACE,8BG1KF,kCH6KA,8BAEI,eASN,UACE,qBACA,eACA,kBACA,oBACA,yCACA,gBACA,8BACA,mBAEA,2BACE,mBAIJ,YACE,8BAGF,UACE,oBACA,oBAGF,SACE,gBACA,kBACA,yBAEA,iBACE,WACA,kBACA,6BACA,YACA,WACA,wCACA,gCAGF,2BACE,GACE,4BAGF,KACE,4BAIJ,mBACE,GACE,4BAGF,KACE,4BAKN,aACE,WACA,YACA,mBACA,kBAIA,oBACE,qBAGF,kBACE,cACA,WACA,YACA,eACA,gBACA,YACA,gBAMJ,aACE,WACA,cAOF,aACE,uBAGF,gBACE,8BAIF,YACE,yCAIF,eACE,gBACA,gBACA,gBAKA,8CACE,gCAIJ,UACE,cACA,oBACA,mBAGF,oBACE,8BAGF,aACE,gBACA,wDACA,6BACA,2EAGF,MACE,WACA,0BAGF,OACE,YACA,0BAMF,SACE,kBAIF,cACE,kBACA,0BAGF,qBACE,iCACE,wBAGF,UACE,4CAGF,cACE,8CAIJ,MACE,cAGF,cACE,kBH/XE,aGiYgB,EHhYhB,cGgYgB,EGvYlB,8CHoYF,cH/UI,WALM,oBMvBR,kCH2WF,cAUI,YDhaY,OI6Dd,mCHyVF,cAcI,YDnakB,OCsapB,yBACE,iBG/YF,kCH8YA,yBH3VA,eApDE,aGoZoB,EHnZpB,cGmZoB,GG1ZtB,8CHqZA,yBASI,gBG7WJ,qEHkXI,oCACE,aACA,eGraN,+CH0aI,8BACE,mCGhYN,mCH0WA,yBA2BI,UDvbmB,OFUrB,gCACA,kCGqbJ,8EHjcE,YGockB,EHnclB,aGmckB,EGjZlB,mCHoZF,cAEI,iCAGF,2BACE,gBI7bE,GACE,eAVA,QAEI,wBAON,GACE,kBAVA,QAII,mBAKN,GACE,kBAVA,QAII,mBAKN,GACE,kBAvBN,GA0BI,kBAKN,EAGE,qBAGF,IACE,eACA,YACA,gCAEA,UAGE,0BACA,kBAIJ,WACE,yDACA,kBACA,mCACA,iBAEA,wBACE,gBAGF,2BACE,cACA,kBACA,4BACA,+BAIA,mCACE,kBACA,WACA,kBACA,YACA,iBACA,oBACA,mCP7BJ,sBACE,sCAEA,8BACE,QO6BsB,IP5BtB,mCACA,4BANJ,uBACE,uCAEA,+BACE,QO8BuB,IP7BvB,oCACA,0BAGE,yBATN,0BACE,0CAEA,kCACE,QO+B0B,IP9B1B,uCACA,0BANJ,yBACE,yCAEA,iCACE,QOgCyB,IP/BzB,sCACA,0BOiCN,IACE,4BACA,qBACA,sBACA,mBACA,kBACA,kBACA,eACA,kBACA,4BACA,qCACA,cLxFU,IKyFV,uCACA,gDAGF,GACE,sCACA,UAGF,OACE,gCACA,OLvGc,KKwGd,8CAgBA,SACE,kBACA,gBAgBJ,KACE,iBAEA,QACE,gBD5GF,kCC2GA,QAII,iBAMA,mDPpHJ,kBACA,SACA,2BMrBA,kCCuJI,yCPtKJ,YOuKwB,MPtKxB,aOsKwB,MAElB,gBACA,gBAMR,cACE,kBACA,iBAGE,kCACE,oBAKF,mBACE,kBPjMJ,WOmMsB,EPlMtB,cOkMsB,EAMb,WPpMT,YOqMoB,IPpMpB,aOoMoB,IPvLlB,aOwLkB,IPvLlB,cOuLkB,IAElB,oCAKO,kBACP,gBACA,cACA,kBACA,aACA,kBACA,oCAOJ,eACE,gBACA,qBAEA,qBACE,eACA,gBACA,iBAEA,2BACE,8CAQA,8BACE,+CAEA,4CACE,mCAGF,8CACE,kCC3PV,mBACE,qCACA,iBACA,oBAGF,WAIE,cACA,sBAMA,eACE,gBACA,UNJa,OMKb,mBACA,iBAKE,gCACE,qBACA,iBACA,oBAGF,+BACE,8BAGF,wBACE,iBACA,kBAKN,mBACE,iBACA,oCACA,yBACA,sBACA,oBACA,qBACA,iBAIJ,KACE,qBACA,iBACA,aACA,wBAEA,uBACE,UN9Ca,OM+Cb,gBACA,sBACA,cNvDQ,IMwDR,uCAGF,cACE,yBACA,iCACA,gBACA,UAGF,yBACE,iBACA,cAGF,+BACE,mBAGF,gBACE,cAWF,gBACE,yBACA,8BACA,oBAIJ,sBAIE,kDAEA,+BRtGA,YQuGoB,MRtGpB,aQsGoB,MAElB,gBFpFF,kCEiFA,+BRtGA,YQ4GsB,ER3GtB,aQ2GsB,EAElB,cN3GM,MIkBV,kCE6FA,mCRlHA,YQoHsB,ERnHtB,aQmHsB,EAIlB,2CACE,WACA,qBACA,YALW,KAMX,MNlHQ,OMmHR,ONnHQ,OMoHR,kBACA,gDACA,gGAMF,wCAEE,uBAKN,iCACE,yBACA,0BAUA,2IACE,qBACA,eAEA,2KACE,aAMR,aAGE,aACA,8BACA,mBACA,ONjKmB,QMkKnB,mBACA,oBAGA,kBACE,YNvKiB,QM0KjB,oBACE,eACA,MNzKY,QM0KZ,oCAEA,0BACE,cAIK,2BACP,kBACA,QAIF,yBACE,8BACA,iBACA,gBACA,oCAKJ,oBAIE,+BACA,ONxMiB,QMyMjB,MNzMiB,QM0MjB,UACA,yBAEA,sBACE,oCAIA,mCACE,4CAGF,+BACE,qCAIJ,0BACE,aAGF,yCACE,uCAEA,2CACE,WCrPR,aACE,kBACA,UACA,UACA,eACA,eACA,WACA,gBACA,4BACA,iCACA,UACA,MPEc,QODd,OPCc,0BOCd,mDACA,0DH2BA,kCG1CF,aAkBI,SACA,iBHmCF,mCGtDF,aAuBI,+CHqCF,mCG5DF,aA2BI,+CAKF,mBACE,kCACA,0CAGF,eACE,YPzBY,QO0BZ,kBACA,WAGF,kBACE,UACA,mBC1CF,yBACE,KACE,UACA,UAIJ,iBACE,KACE,UACA,UAIJ,4BACE,gBACA,mBACA,cAGF,0BACE,4BACA,oBAEA,iCACE,cACA,eAKF,yBACE,cACA,gBACA,oBACA,mCACA,2BACA,oCACA,iCACA,eACA,SACA,WACA,2BACA,4BACA,oBAKN,WAME,2CACA,iBACA,cRhDU,KQiDV,wBACA,0BACA,WRzDc,KQ0Dd,gBACA,kBJnCA,kCIsBF,WAgBI,iBAGF,iBACE,kBAnBS,sBAoBT,UApBS,sBAuBX,oBACE,kBAvBU,uBAwBV,UAxBU,uBJZZ,kCIUF,WA8BI,KRnFY,OQsFd,mBAGE,wBACA,gBACA,MACA,yBACA,iDAEA,0BACE,YRrEgB,kCQ0ElB,oBACE,kBACA,sBAGF,gCACE,gBAIJ,cACE,qBACA,eAGE,wCAEE,kBAGF,mBACE,aACA,gBACA,kBACA,uBAEA,oCACE,aAON,0BACE,sBADF,0BACE,qBADF,0BACE,sBAIJ,2BACE,sCACA,gBAGF,6BACE,wBAzFS,UA0FT,gBA1FS,UA6FX,qBACE,wBA9FS,UA+FT,gBA/FS,UAkGX,kBACE,aACA,WACA,kBACA,4DACA,OAxGe,KA2GjB,8BACE,cACA,+BACA,YR3IkB,kCQ4IlB,oBChKJ,SXiBI,aWhBgB,EXiBhB,cWjBgB,EAElB,eACA,MACA,OACA,YACA,gBACA,MTfc,MSgBd,6BACA,mDAGA,wBACA,qBAGA,4BACE,aLPF,8CKXF,SXgEI,WALM,mBWnCN,6BACA,qCAEA,2BACE,yBL0BJ,mCKtDF,SAiCI,MTvCkB,OS2ClB,wGACE,kCAQJ,iBACE,cACA,aACA,cACA,gBACA,gDACA,wBL5BF,kCKsBA,iBASI,WACA,aAGF,qBACE,yBAEA,2BACE,qBAKN,0BXtEA,WWuEoB,OXtEpB,cWsEoB,OAGlB,oBACA,sBACA,WLtCF,kCKgCA,0BASI,iBLvBJ,mCKcA,0BAaI,kBACA,qBACA,qBAIJ,qBAIE,oBACA,gBACA,kBACA,gBACA,qBACA,mBACA,oBACA,kBACA,8BAGF,wBACE,cACA,iCACA,kBACA,iBACA,yBACA,sBACA,qBACA,iBAGF,YACE,mBAEA,wBACE,WACA,WXrGF,aWuGoB,OXtGpB,cWsGoB,OLlEtB,mCK8DE,wBXnGA,aW0GsB,QXzGtB,cWyGsB,SAGpB,mCXtHJ,YWuHwB,MXtHxB,eWsHwB,MAElB,aACA,mBACA,qBACA,gBAEA,yCACE,yCAGF,qCACE,cACA,WACA,oBAGF,wCACE,cACA,oBAKF,yCACE,kCACA,yCAEA,8CACE,UAKN,0CACE,kBAKN,yBACE,kBACA,mBACA,qBLpHF,mCKiHA,yBAMI,qBACA,uBAKF,iEACE,MAHS,QAIT,OAJS,QAKT,cAzLG,MA0LH,kBACA,+BACA,uCACA,kBACA,aACA,mBACA,uBAEA,yGACE,iDAGF,6EACE,yCASF,4CACE,aTnNK,MI2DX,mCKuJI,4CAII,aTrNM,MS0NZ,2BACE,YAtCS,QA+CX,sCX7NF,YW+NsB,sBX9NtB,aW8NsB,sBAElB,0CACA,WACA,MA1Oa,IA2Ob,OA3Oa,IA4Ob,kBACA,cA5OG,MLyDP,mCK0KE,sCX7NF,YWyOwB,qBXxOxB,aWwOwB,sBLjOxB,8CKwOA,gCAEI,6BCzPN,gBACE,OVGc,KUFd,kCNaA,8CMfF,gBZkEI,2CY3DA,QAOF,oBACE,eACA,8BACA,mBAQI,iDACE,YACA,gBNZR,8CMDA,oBAmBI,cN+BJ,qEMlDA,oBAuBI,UACA,gBACA,uBACA,oBACA,oBNnBJ,kCMXF,QZ8DE,gBM1DA,8CMJF,QAuCI,gBAIJ,cACE,aACA,iBACA,gBACA,uBACA,+BACA,kBACA,UACA,oBN/CA,8CMuCF,cAWI,eNzBF,kCMcF,cAeI,iBAIJ,iCAEE,aN5DA,8CM0DF,iCAKI,eC/EJ,QACE,SACA,+BACA,gBAEA,mBACE,wBACA,gBAGF,gBAGE,kBAEA,kCACE,gBAIJ,iBACE,gBAMF,8BACE,oBACA,oBbOF,MADwD,mBAExD,UaNoB,QbOpB,YAH2C,IaD3C,yBACE,oBACA,iBACA,oBACA,oBACA,wBAEA,+BACE,2BAIJ,2BACE,mBP/BF,+COSF,eA0BI,cAKF,kBACE,cCxDJ,OACE,gCACA,OZIc,KYHd,8CRYA,8CQfF,OdoEI,WALM,mBcrDN,OZHkB,KYIlB,kBAeF,SACE,kBACA,gBC7BJ,OACE,aACA,WACA,mBACA,4CACA,0BACA,gBAEA,SACE,UACA,gBACA,+BTKF,8CShBF,OAeI,cT0BF,kCSzCF,OAmBI,Ubbe,OIyCjB,mCS/CF,OAuBI,mBToCF,mCS3DF,OA2BI,qCAMJ,uBACE,aACA,YACA,WACA,cAEA,gCACE,gBTxBF,8CSiBF,uBAWI,WAEA,gCACE,kBTNJ,kCSRF,uBAmBI,Ub3CqB,Oa4CrB,kCAIJ,gBACE,oBTOA,qESJE,oBACE,iBAIJ,kBACE,iBACA,mBAWF,wBACE,WAEA,yCACE,mBTpCJ,mCSgCA,wBAQI,UAEA,uCACE,oBAGF,wCACE,mBAGF,kDACE,kBACA,aAIJ,2BACE,mBAIF,0BACE,cACA,oBACA,cAGF,0BAGE,yBACA,oBACA,qBACA,4BAMN,eACE,wBACA,aACA,mBAKF,cACE,kBACA,SACA,gBACA,qBACA,wBACA,YAEA,oBACE,gBThGF,mCSuFF,cAaI,gCAIJ,cACE,eT/GA,kCS8GF,cAII,cAGF,iBACE,qBAGF,wBACE,qBACA,iBACA,eACA,gCACA,YACA,cACA,wBAEA,gCACE,YACA,8BACA,oBC9KN,WACE,gBVwCA,kCUzCF,WAII,mBAIA,+BACE,qBAGF,0CACE,sBAIJ,iBACE,SACA,gBAEA,gEACE,4BVaJ,kCUdE,gEAII,6BAYJ,4BACE,YACA,aVJJ,kCUEE,4BAKI,iCAGF,wCAGE,sCACA,kBAGF,sFACE,yCVlBN,kCUqBI,uCAEI,4BAMA,iDAGE,gBACA,SASF,2DACE,mBV3CV,kCU0CQ,2DAII,qBAKN,0CAGE,cAGF,uDACE,cASV,YACE,wBACA,4BACA,6BVhEA,kCU6DF,YAMI,iBACA,wBAGF,oBACE,qBVjGF,8CUsGI,0DACE,cV9EN,kCUmFI,wCACE,oBAIJ,kCACE,sCACA,gBACA,oBACA,wBACA,yBACA,oBACA,SACA,yBAIA,yCACE,kDAMA,qDACE,mDAKN,gCACE,mBAEA,2CACE,4BVrHN,kCU0HA,wBAEI,cCpKN,qDACE,UACA,kBACA,qCAUA,kBAGE,mBACA,gBAIA,oCAdF,YACA,aAFe,OAGf,cAH6B,OAyBzB,uBACE,cAKN,qBACE,kBAIJ,mBAGE,gBACA,kDAEA,oCACE,mBAmBF,kCACE,sBACA,yBACA,sBACA,qBACA,iBAEA,kGACE,mBAGF,+CACE,aAEA,iDACE,6BAKF,iDAGE,kBASF,sDACE,UACA,YACA,oBXjFN,kCWyFF,kBAEI,kCAEA,kCACE,WACA,iBAKN,gBAEE,0CACA,iDACA,+DACA,6DACA,6DACA,qDACA,wCAEA,eAGF,WACE,iBXzHA,8CWoIF,iBjB9HI,aiBgIkB,EjB/HlB,ciB+HkB,EjB9IpB,YiB+IoB,QjB9IpB,aiB8IoB,SAMlB,kCACE,wBAIA,mDACE,cAIJ,+BAGE,oBACA,mBACA,gBACA,WAGF,yDACE,gBAGF,8BACE,8BACA,iBACA,yBACA,yBAGF,kCACE,4BACA,UAGF,iCACE,4BACA,WAIJ,mBACE,iBACA,mBACA,iBACA,mBAIJ,qBAEI,oDAEE,iCAKN,2BACE,KACE,UACA,gBAGF,GACE,WAIJ,mBACE,KACE,UACA,gBAGF,GACE,WAMJ,uCACE,WACA,cACA,wBACA,gBACA,MACA,WACA,YACA,4DAGF,aACE,MACA,+BACA,gBACA,iBACA,qBACA,gBAEA,6BACE,8BACA,sBAGF,gBACE,gBACA,iBACA,iBACA,eAGE,qBACE,8BAMJ,0BACE,cAIA,gCACE,2BACA,qBAGF,kCACE,aAIJ,gCACE,sCACA,gBAEA,wCACE,qBACA,UACA,eACA,iDAIJ,mBACE,oBAIK,kBAGP,oBAOF,oBACE,WACA,eACA,SACA,UACA,eACA,iBACA,4DAUJ,SACE,wBACA,gBACA,MACA,UACA,eACA,OfjVc,KekVd,0BACA,iDACA,+BX1SA,mCWiSF,SAcI,yBAGF,gBAGE,oBACA,iBACA,cAGF,mBACE,UACA,gBAIJ,kBACE,8BACA,qCACA,cfvWU,KIoCV,mCWgUF,kBAMI,yBAGF,yBACE,eACA,YfjWkB,kCeoWpB,wBACE,gBACA,gBA4BJ,4BAvBE,KACE,WACA,4BAGF,GACE,UACA,yBAoBJ,oBA3BE,KACE,WACA,4BAGF,GACE,UACA,yBAwBJ,6BAnBE,GACE,wBACA,UAGF,KACE,4BACA,WAgBJ,qBAvBE,GACE,wBACA,UAGF,KACE,4BACA,WAuBF,kBjB1YA,MADwD,mBAExD,UiB0YoB,OjBzYpB,YiByY4B,IAG5B,oBAIE,8BAGF,iBAGE,gBACA,oBACA,yBACA,oBACA,qBACA,4BAWJ,eACE,kBAGF,YACE,eACA,iBAGF,yDACE,8CAGF,ajBrbE,MiBsbgC,QjBrbhC,UiBqbkB,QjBpblB,YiBob2B,IAE3B,oBACE,YXtcF,kCW0cF,eAEI,6BXpbF,mCWwbF,SAII,wBC5eJ,cACE,WAGF,YACE,mBACA,sCAOA,yBAGE,eACA,cAHS,IAIT,gBAEA,4CACE,4BACA,6BAIJ,cAGE,cAGF,6BACE,iBACA,kBACA,kBAEA,yCACE,yBACA,0BAGF,wCACE,gBAKN,kBACE,aACA,cACA,kBACA,kBACA,yBAEA,oBACE,kBACA,aACA,WACA,gCAIA,0BACE,yCAMN,qBACE,wBACE,6CAIJ,QACE,yBC9EF,KACE,mBACA,oBACA,mBACA,iBACA,iBACA,8CACA,uCAEA,UACE,iBACA,eACA,8BbMF,8CaFF,MAEI,mCCjBJ,UACE,sBdgBA,8CcjBF,UAII,iBAEA,aACE,kBAMJ,oFACE,WACA,MAJe,IAKf,kBACA,WACA,uCAGF,gBACE,cACA,iBACA,kBACA,SACA,iBAEA,wBAGE,YACA,UACA,YAGF,oCAGE,YACA,SAIF,uBACE,WACA,qBACA,kBACA,kBACA,WACA,YACA,YACA,iBACA,gDACA,qCACA,6BACA,UAKF,gBACE,iBACA,iBAIA,+BACE,yCACA,uFAUF,wBAGE,MACA,UACA,cAIJ,8CACE,cAIJ,gBACE,mBACA,qBACA,kBACA,YAEA,sBACE,aACA,kBAGF,oBACE,cACA,4BAIJ,YAEE,mBACA,kBACA,UAEA,kBACE,mBAGF,oBAEE,WACA,qBACA,kBACA,kBACA,UACA,WACA,WACA,YACA,UACA,yCACA,6BACA,UCpIN,MACE,2BACA,2CAKA,qCACE,mBACA,gBAGA,qDACE,gBACA,UACA,WACA,kBACA,cACA,WACA,kBACA,UACA,mBfLJ,8CeJE,qDAYI,gBAKJ,yCAGE,iBfhBJ,8CeaE,yCrBhCF,gBACA,uBACA,oBqB2CF,eACE,iBAGF,oBACE,kBAMA,iEAGE,mBCxDJ,mBACE,KACE,+BAGF,GACE,kCAIJ,eACE,qBACA,qCACA,6CASF,WACE,eACA,MACA,OACA,WACA,YACA,gBACA,oBAEA,mBACE,GACE,qCACA,UACA,gBAEF,KACE,6CACA,UACA,mBAIJ,mCACE,6BACE,kBACA,wBACA,cACA,cACA,oCACA,gCACA,iCACA,sCACA,sCACA,oCACA,oBAGE,0CACE,mBACA,6CACA,4BACA,mBACA,mBALF,0CACE,oBACA,8CACA,4BACA,mBACA,oBALF,0CACE,mBACA,6CACA,2BACA,mBACA,mBALF,0CACE,mBACA,0CACA,2BACA,mBACA,oBALF,0CACE,mBACA,8CACA,4BACA,mBACA,oBALF,0CACE,mBACA,8CACA,2BACA,mBACA,oBALF,0CACE,mBACA,8CACA,4BACA,mBACA,oBALF,0CACE,mBACA,8CACA,2BACA,mBACA,oBALF,0CACE,mBACA,+CACA,2BACA,mBACA,oBALF,0CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,kBACA,4CACA,2BACA,mBACA,mBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,mBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,6CACA,2BACA,mBACA,mBALF,2CACE,kBACA,8CACA,2BACA,mBACA,mBALF,2CACE,kBACA,6CACA,2BACA,mBACA,oBALF,2CACE,mBACA,+CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,6CACA,2BACA,mBACA,oBALF,2CACE,mBACA,6CACA,2BACA,mBACA,oBALF,2CACE,mBACA,+CACA,4BACA,mBACA,oBALF,2CACE,mBACA,6CACA,2BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,mBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,+CACA,2BACA,mBACA,oBALF,2CACE,mBACA,+CACA,2BACA,mBACA,mBALF,2CACE,mBACA,+CACA,2BACA,mBACA,mBALF,2CACE,mBACA,+CACA,4BACA,mBACA,oBALF,2CACE,mBACA,+CACA,4BACA,mBACA,oBALF,2CACE,mBACA,+CACA,4BACA,mBACA,oBALF,2CACE,mBACA,+CACA,2BACA,mBACA,oBALF,2CACE,mBACA,+CACA,2BACA,mBACA,mBALF,2CACE,mBACA,+CACA,4BACA,mBACA,mBALF,2CACE,mBACA,8CACA,2BACA,mBACA,mBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,4CACA,2BACA,mBACA,mBALF,2CACE,mBACA,+CACA,2BACA,mBACA,oBALF,2CACE,kBACA,6CACA,2BACA,mBACA,oBALF,2CACE,mBACA,8CACA,2BACA,mBACA,oBALF,2CACE,mBACA,6CACA,2BACA,mBACA,oBALF,2CACE,kBACA,8CACA,4BACA,mBACA,mBALF,2CACE,mBACA,+CACA,2BACA,mBACA,oBALF,2CACE,mBACA,6CACA,2BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBALF,2CACE,mBACA,6CACA,4BACA,mBACA,oBALF,2CACE,mBACA,8CACA,4BACA,mBACA,oBAMR,mCACE,6BACE,cAQN,mBACE,oCACA,YACA,kBACA,kBACA,yBACA,oCACA,kDAGF,yBACE,2BACA,qCAIF,SACE,wDACA,sBACA,4BACA,wBAGF,uBACE,WACA,wCAEF,wBACE,WACA,uCAEF,iDACE,WAEF,8BACE","sourcesContent":["@use '../abstracts/mixins' as *;\n\n::-webkit-input-placeholder {\n  @include placeholder;\n}\n\n::-moz-placeholder {\n  @include placeholder;\n}\n\n:-ms-input-placeholder {\n  @include placeholder;\n}\n\n::-ms-input-placeholder {\n  @include placeholder;\n}\n\n::placeholder {\n  @include placeholder;\n}\n\n:focus::-webkit-input-placeholder {\n  @include placeholder-focus;\n}\n\n:focus::-moz-placeholder {\n  @include placeholder-focus;\n}\n\n:focus:-ms-input-placeholder {\n  @include placeholder-focus;\n}\n\n:focus::-ms-input-placeholder {\n  @include placeholder-focus;\n}\n\n:focus::placeholder {\n  @include placeholder-focus;\n}\n","@mixin text-ellipsis {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n@mixin mt-mb($value) {\n  margin-top: $value;\n  margin-bottom: $value;\n}\n\n@mixin ml-mr($value) {\n  margin-left: $value;\n  margin-right: $value;\n}\n\n@mixin pt-pb($val) {\n  padding-top: $val;\n  padding-bottom: $val;\n}\n\n@mixin pl-pr($val, $important: false) {\n  @if $important {\n    padding-left: $val !important;\n    padding-right: $val !important;\n  } @else {\n    padding-left: $val;\n    padding-right: $val;\n  }\n}\n\n@mixin placeholder {\n  color: var(--text-muted-color) !important;\n}\n\n@mixin placeholder-focus {\n  opacity: 0.6;\n}\n\n@mixin label($font-size: 1rem, $font-weight: 600, $color: var(--label-color)) {\n  color: $color;\n  font-size: $font-size;\n  font-weight: $font-weight;\n}\n\n@mixin align-center {\n  position: relative;\n  left: 50%;\n  transform: translateX(-50%);\n}\n\n@mixin prompt($type, $fa-content, $fa-style: 'solid', $rotate: 0) {\n  &.prompt-#{$type} {\n    background-color: var(--prompt-#{$type}-bg);\n\n    &::before {\n      content: $fa-content;\n      color: var(--prompt-#{$type}-icon-color);\n      font: var(--fa-font-#{$fa-style});\n\n      @if $rotate != 0 {\n        transform: rotate(#{$rotate}deg);\n      }\n    }\n  }\n}\n\n@mixin slide($append: null) {\n  $basic: transform 0.4s ease;\n\n  @if $append {\n    transition: $basic, $append;\n  } @else {\n    transition: $basic;\n  }\n}\n\n@mixin max-w-100 {\n  max-width: 100%;\n}\n","@use 'variables' as v;\n@use 'mixins' as mx;\n\n%heading {\n  color: var(--heading-color);\n  font-weight: 400;\n  font-family: v.$font-family-heading;\n  scroll-margin-top: 3.5rem;\n}\n\n%anchor {\n  .anchor {\n    font-size: 80%;\n  }\n\n  @media (hover: hover) {\n    .anchor {\n      visibility: hidden;\n      opacity: 0;\n      transition: opacity 0.25s ease-in, visibility 0s ease-in 0.25s;\n    }\n\n    &:hover {\n      .anchor {\n        visibility: visible;\n        opacity: 1;\n        transition: opacity 0.25s ease-in, visibility 0s ease-in 0s;\n      }\n    }\n  }\n}\n\n%tag-hover {\n  background: var(--tag-hover);\n  transition: background 0.35s ease-in-out;\n}\n\n%table-cell {\n  padding: 0.4rem 1rem;\n  font-size: 95%;\n  white-space: nowrap;\n}\n\n%link-hover {\n  color: #d2603a !important;\n  border-bottom: 1px solid #d2603a;\n  text-decoration: none;\n}\n\n%link-color {\n  color: var(--link-color);\n}\n\n%link-underline {\n  border-bottom: 1px solid var(--link-underline-color);\n}\n\n%clickable-transition {\n  transition: all 0.3s ease-in-out;\n}\n\n%no-cursor {\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n}\n\n%no-bottom-border {\n  border-bottom: none;\n}\n\n%cursor-pointer {\n  cursor: pointer;\n}\n\n%normal-font-style {\n  font-style: normal;\n}\n\n%rounded {\n  border-radius: v.$radius-lg;\n}\n\n%img-caption {\n  + em {\n    display: block;\n    text-align: center;\n    font-style: normal;\n    font-size: 80%;\n    padding: 0;\n    color: #6d6c6c;\n  }\n}\n\n%sidebar-links {\n  color: var(--sidebar-muted-color);\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n}\n\n%text-clip {\n  display: -webkit-box;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n}\n\n%text-ellipsis {\n  @include mx.text-ellipsis;\n}\n\n%text-highlight {\n  color: var(--text-muted-highlight-color);\n  font-weight: 600;\n}\n\n%text-sm {\n  font-size: 0.85rem;\n}\n\n%text-xs {\n  font-size: 0.8rem;\n}\n\n%sup-fn-target {\n  &:target {\n    background-color: var(--footnote-target-bg);\n    width: -moz-fit-content;\n    width: -webkit-fit-content;\n    width: fit-content;\n    transition: background-color 1.75s ease-in-out;\n  }\n}\n\n%btn-color {\n  button i {\n    color: #999999;\n  }\n}\n\n%code-snippet-bg {\n  background-color: var(--highlight-bg-color);\n}\n\n%code-snippet-padding {\n  padding-left: 1rem;\n  padding-right: 1.5rem;\n}\n\n%max-w-100 {\n  max-width: 100%;\n}\n\n%panel-border {\n  border-left: 1px solid var(--main-border-color);\n}\n","/* sidebar */\n\n$sidebar-width: 260px !default; /* the basic width */\n$sidebar-width-large: 300px !default; /* screen width: >= 1650px */\n$sb-btn-gap: 0.8rem !default;\n$sb-btn-gap-lg: 1rem !default;\n\n/* other framework sizes */\n\n$topbar-height: 3rem !default;\n$search-max-width: 200px !default;\n$footer-height: 5rem !default;\n$footer-height-large: 6rem !default; /* screen width: < 850px */\n$main-content-max-width: 1250px !default;\n$radius-sm: 6px !default;\n$radius-lg: 10px !default;\n$back2top-size: 2.75rem !default;\n\n/* syntax highlight */\n\n$code-font-size: 0.85rem !default;\n$code-header-height: 2.25rem !default;\n$code-dot-size: 0.75rem !default;\n$code-dot-gap: 0.5rem !default;\n$code-icon-width: 1.75rem !default;\n\n/* fonts */\n\n$font-family-base: 'Source Sans Pro', 'Microsoft Yahei', sans-serif !default;\n$font-family-heading: Lato, 'Microsoft Yahei', sans-serif !default;\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n@use '../themes/light';\n@use '../themes/dark';\n\n:root {\n  font-size: 16px;\n}\n\nhtml {\n  @media (prefers-color-scheme: light) {\n    &:not([data-mode]),\n    &[data-mode='light'] {\n      @include light.styles;\n    }\n\n    &[data-mode='dark'] {\n      @include dark.styles;\n    }\n  }\n\n  @media (prefers-color-scheme: dark) {\n    &:not([data-mode]),\n    &[data-mode='dark'] {\n      @include dark.styles;\n    }\n\n    &[data-mode='light'] {\n      @include light.styles;\n    }\n  }\n\n  @include bp.lg {\n    overflow-y: scroll;\n  }\n}\n\nbody {\n  background: var(--main-bg);\n  padding: env(safe-area-inset-top) env(safe-area-inset-right)\n    env(safe-area-inset-bottom) env(safe-area-inset-left);\n  color: var(--text-color);\n  -webkit-font-smoothing: antialiased;\n  font-family: v.$font-family-base;\n}\n\nh1.dynamic-title {\n  @include bp.lt(bp.get(lg)) {\n    display: none;\n\n    ~ .content {\n      margin-top: 2.5rem;\n    }\n  }\n}\n\nmain {\n  &.col-12 {\n    @include bp.xxxl {\n      padding-right: 4.5rem !important;\n    }\n  }\n}\n\n.preview-img {\n  aspect-ratio: 40 / 21;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n\n  @extend %rounded;\n\n  &:not(.no-bg) {\n    background: var(--img-bg);\n  }\n\n  img {\n    height: 100%;\n    -o-object-fit: cover;\n    object-fit: cover;\n\n    @extend %rounded;\n\n    @at-root #post-list & {\n      width: 100%;\n    }\n  }\n}\n\n.post-preview {\n  @extend %rounded;\n\n  border: 0;\n  background: var(--card-bg);\n  box-shadow: var(--card-shadow);\n\n  &::before {\n    @extend %rounded;\n\n    content: '';\n    width: 100%;\n    height: 100%;\n    position: absolute;\n    background-color: var(--card-hovor-bg);\n    opacity: 0;\n    transition: opacity 0.35s ease-in-out;\n  }\n\n  &:hover {\n    &::before {\n      opacity: 0.3;\n    }\n  }\n}\n\n.post-meta {\n  @extend %text-sm;\n\n  a {\n    &:not([class]):hover {\n      @extend %link-hover;\n    }\n  }\n\n  em {\n    @extend %normal-font-style;\n  }\n}\n\n.content {\n  font-size: 1.08rem;\n  margin-top: 2rem;\n  overflow-wrap: break-word;\n\n  @include bp.xl {\n    font-size: 1.03rem;\n  }\n\n  a {\n    &.popup {\n      @extend %no-cursor;\n      @extend %img-caption;\n      @include mx.mt-mb(0.5rem);\n\n      cursor: zoom-in;\n    }\n\n    &:not(.img-link) {\n      @extend %link-underline;\n\n      &:hover {\n        @extend %link-hover;\n      }\n    }\n  }\n\n  ol,\n  ul {\n    &:not([class]),\n    &.task-list {\n      -webkit-padding-start: 1.75rem;\n      padding-inline-start: 1.75rem;\n\n      li {\n        margin: 0.25rem 0;\n        padding-left: 0.25rem;\n      }\n\n      ol,\n      ul {\n        -webkit-padding-start: 1.25rem;\n        padding-inline-start: 1.25rem;\n        margin: 0.5rem 0;\n      }\n    }\n  }\n\n  ul.task-list {\n    -webkit-padding-start: 1.25rem;\n    padding-inline-start: 1.25rem;\n\n    li {\n      list-style-type: none;\n      padding-left: 0;\n\n      /* checkbox icon */\n      > i {\n        width: 2rem;\n        margin-left: -1.25rem;\n        color: var(--checkbox-color);\n\n        &.checked {\n          color: var(--checkbox-checked-color);\n        }\n      }\n\n      ul {\n        -webkit-padding-start: 1.75rem;\n        padding-inline-start: 1.75rem;\n      }\n    }\n\n    input[type='checkbox'] {\n      margin: 0 0.5rem 0.2rem -1.3rem;\n      vertical-align: middle;\n    }\n  } /* ul */\n\n  dl > dd {\n    margin-left: 1rem;\n  }\n\n  ::marker {\n    color: var(--text-muted-color);\n  }\n\n  .table-wrapper > table {\n    @include bp.lg {\n      min-width: 70%;\n    }\n  }\n} /* .content */\n\n.tag:hover {\n  @extend %tag-hover;\n}\n\n.post-tag {\n  display: inline-block;\n  min-width: 2rem;\n  text-align: center;\n  border-radius: 0.5rem;\n  border: 1px solid var(--btn-border-color);\n  padding: 0 0.4rem;\n  color: var(--text-muted-color);\n  line-height: 1.3rem;\n\n  &:not(:last-child) {\n    margin-right: 0.2rem;\n  }\n}\n\n.rounded-10 {\n  border-radius: 10px !important;\n}\n\n.img-link {\n  color: transparent;\n  display: inline-flex;\n}\n\n.shimmer {\n  overflow: hidden;\n  position: relative;\n  background: var(--img-bg);\n\n  &::before {\n    content: '';\n    position: absolute;\n    background: var(--shimmer-bg);\n    height: 100%;\n    width: 100%;\n    -webkit-animation: shimmer 1.3s infinite;\n    animation: shimmer 1.3s infinite;\n  }\n\n  @-webkit-keyframes shimmer {\n    0% {\n      transform: translateX(-100%);\n    }\n\n    100% {\n      transform: translateX(100%);\n    }\n  }\n\n  @keyframes shimmer {\n    0% {\n      transform: translateX(-100%);\n    }\n\n    100% {\n      transform: translateX(100%);\n    }\n  }\n}\n\n.embed-video {\n  width: 100%;\n  height: 100%;\n  margin-bottom: 1rem;\n  aspect-ratio: 16 / 9;\n\n  @extend %rounded;\n\n  &.twitch {\n    aspect-ratio: 310 / 189;\n  }\n\n  &.file {\n    display: block;\n    width: auto;\n    height: auto;\n    max-width: 100%;\n    max-height: 100%;\n    margin: auto;\n    margin-bottom: 0;\n  }\n\n  @extend %img-caption;\n}\n\n.embed-audio {\n  width: 100%;\n  display: block;\n\n  @extend %img-caption;\n}\n\n/* --- Effects classes --- */\n\n.flex-grow-1 {\n  flex-grow: 1 !important;\n}\n\n.btn-box-shadow {\n  box-shadow: var(--card-shadow);\n}\n\n/* overwrite bootstrap muted */\n.text-muted {\n  color: var(--text-muted-color) !important;\n}\n\n/* Overwrite bootstrap tooltip */\n.tooltip-inner {\n  font-size: 0.7rem;\n  max-width: 220px;\n  text-align: left;\n}\n\n/* Overwrite bootstrap outline button */\n.btn.btn-outline-primary {\n  &:not(.disabled):hover {\n    border-color: #007bff !important;\n  }\n}\n\n.disabled {\n  color: rgb(206, 196, 196);\n  pointer-events: auto;\n  cursor: not-allowed;\n}\n\n.hide-border-bottom {\n  border-bottom: none !important;\n}\n\n.input-focus {\n  box-shadow: none;\n  border-color: var(--input-focus-border-color) !important;\n  background: center !important;\n  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;\n}\n\n.left {\n  float: left;\n  margin: 0.75rem 1rem 1rem 0;\n}\n\n.right {\n  float: right;\n  margin: 0.75rem 0 1rem 1rem;\n}\n\n/* --- Overriding --- */\n\n/* mermaid */\n.mermaid {\n  text-align: center;\n}\n\n/* MathJax */\nmjx-container {\n  overflow-y: hidden;\n  min-width: auto !important;\n}\n\n@media (hover: hover) {\n  #sidebar ul > li:last-child::after {\n    transition: top 0.5s ease;\n  }\n\n  .nav-link {\n    transition: background-color 0.3s ease-in-out;\n  }\n\n  .post-preview {\n    transition: background-color 0.35s ease-in-out;\n  }\n}\n\n#mask {\n  inset: 0 0 0 0;\n}\n\n#main-wrapper {\n  position: relative;\n\n  @include mx.pl-pr(0);\n\n  @include bp.lt(bp.get(lg)) {\n    @include mx.slide;\n  }\n\n  @include bp.lg {\n    margin-left: v.$sidebar-width;\n  }\n\n  @include bp.xxxl {\n    margin-left: v.$sidebar-width-large;\n  }\n\n  > .container {\n    min-height: 100vh;\n\n    @include bp.lte(bp.get(md)) {\n      @include mx.max-w-100;\n      @include mx.pl-pr(0);\n    }\n\n    @include bp.lt(bp.get(lg)) {\n      max-width: 100%;\n    }\n\n    /* Pad horizontal */\n    @include bp.between(992px, calc(#{bp.get(xl)} - 1px)) {\n      .col-lg-11 {\n        flex: 0 0 96%;\n        max-width: 96%;\n      }\n    }\n\n    @include bp.lt(bp.get(xl)) {\n      > .row {\n        justify-content: center !important;\n      }\n    }\n\n    @include bp.xxxl {\n      max-width: v.$main-content-max-width;\n\n      @include mx.pl-pr(1.75rem, true);\n    }\n  }\n}\n\n/* --- basic wrappers --- */\n\n#topbar-wrapper.row,\n#main-wrapper > .container > .row,\n#search-result-wrapper > .row {\n  @include mx.ml-mr(0);\n}\n\n#tail-wrapper {\n  @include bp.xxxl {\n    padding-right: 4.5rem !important;\n  }\n\n  > :not(script) {\n    margin-top: 3rem;\n  }\n}\n","@mixin styles {\n  /* Framework color */\n  --main-bg: white;\n  --mask-bg: #c1c3c5;\n  --main-border-color: #f3f3f3;\n\n  /* Common color */\n  --text-color: #34343c;\n  --text-muted-color: #757575;\n  --text-muted-highlight-color: inherit;\n  --heading-color: #2a2a2a;\n  --label-color: #585858;\n  --blockquote-border-color: #eeeeee;\n  --blockquote-text-color: #757575;\n  --link-color: #0056b2;\n  --link-underline-color: #dee2e6;\n  --button-bg: #ffffff;\n  --btn-border-color: #e9ecef;\n  --btn-backtotop-color: #686868;\n  --btn-backtotop-border-color: #f1f1f1;\n  --checkbox-color: #c5c5c5;\n  --checkbox-checked-color: #07a8f7;\n  --img-bg: radial-gradient(\n    circle,\n    rgb(255, 255, 255) 0%,\n    rgb(239, 239, 239) 100%\n  );\n  --shimmer-bg: linear-gradient(\n    90deg,\n    rgba(250, 250, 250, 0) 0%,\n    rgba(232, 230, 230, 1) 50%,\n    rgba(250, 250, 250, 0) 100%\n  );\n\n  /* Sidebar */\n  --site-title-color: rgb(113, 113, 113);\n  --site-subtitle-color: #717171;\n  --sidebar-bg: #f6f8fa;\n  --sidebar-border-color: #efefef;\n  --sidebar-muted-color: #545454;\n  --sidebar-active-color: #1d1d1d;\n  --sidebar-hover-bg: rgb(223, 233, 241, 0.64);\n  --sidebar-btn-bg: white;\n  --sidebar-btn-color: #8e8e8e;\n  --avatar-border-color: white;\n\n  /* Topbar */\n  --topbar-bg: rgb(255, 255, 255, 0.7);\n  --topbar-text-color: rgb(78, 78, 78);\n  --search-border-color: rgb(240, 240, 240);\n  --search-icon-color: #c2c6cc;\n  --input-focus-border-color: #b8b8b8;\n\n  /* Home page */\n  --post-list-text-color: dimgray;\n  --btn-patinator-text-color: #555555;\n  --btn-paginator-hover-color: var(--sidebar-bg);\n\n  /* Posts */\n  --toc-highlight: #0550ae;\n  --toc-popup-border-color: lightgray;\n  --btn-share-color: gray;\n  --btn-share-hover-color: #0d6efd;\n  --card-bg: white;\n  --card-hovor-bg: #e2e2e2;\n  --card-shadow: rgb(104, 104, 104, 0.05) 0 2px 6px 0,\n    rgba(211, 209, 209, 0.15) 0 0 0 1px;\n  --footnote-target-bg: lightcyan;\n  --tb-odd-bg: #fbfcfd;\n  --tb-border-color: #eaeaea;\n  --dash-color: silver;\n  --kbd-wrap-color: #bdbdbd;\n  --kbd-text-color: var(--text-color);\n  --kbd-bg-color: white;\n  --prompt-text-color: rgb(46, 46, 46, 0.77);\n  --prompt-tip-bg: rgb(123, 247, 144, 0.2);\n  --prompt-tip-icon-color: #03b303;\n  --prompt-info-bg: #e1f5fe;\n  --prompt-info-icon-color: #0070cb;\n  --prompt-warning-bg: rgb(255, 243, 205);\n  --prompt-warning-icon-color: #ef9c03;\n  --prompt-danger-bg: rgb(248, 215, 218, 0.56);\n  --prompt-danger-icon-color: #df3c30;\n\n  /* Tags */\n  --tag-border: #dee2e6;\n  --tag-shadow: var(--btn-border-color);\n  --tag-hover: rgb(222, 226, 230);\n  --search-tag-bg: #f8f9fa;\n\n  /* Categories */\n  --categories-border: rgba(0, 0, 0, 0.125);\n  --categories-hover-bg: var(--btn-border-color);\n  --categories-icon-hover-color: darkslategray;\n\n  /* Archive */\n  --timeline-color: rgba(0, 0, 0, 0.075);\n  --timeline-node-bg: #c2c6cc;\n  --timeline-year-dot-color: #ffffff;\n\n  /* --- Custom code light mode colors --- */\n  --language-border-color: #ececec;\n  --highlight-bg-color: #f6f8fa;\n  --highlighter-rouge-color: #3f596f;\n  --highlight-lineno-color: #9e9e9e;\n  --inline-code-bg: rgba(25, 25, 28, 0.05);\n  --code-color: #3a3a3a;\n  --code-header-text-color: #a3a3a3;\n  --code-header-muted-color: #e5e5e5;\n  --code-header-icon-color: #c9c8c8;\n  --clipboard-checked-color: #43c743;\n\n  [class^='prompt-'] {\n    --link-underline-color: rgb(219, 216, 216);\n  }\n\n  .dark {\n    display: none;\n  }\n\n  /* --- Syntax highlight theme from `rougify style github` --- */\n\n  .highlight table td {\n    padding: 5px;\n  }\n\n  .highlight table pre {\n    margin: 0;\n  }\n\n  .highlight,\n  .highlight .w {\n    color: #24292f;\n    background-color: #f6f8fa;\n  }\n\n  .highlight .k,\n  .highlight .kd,\n  .highlight .kn,\n  .highlight .kp,\n  .highlight .kr,\n  .highlight .kt,\n  .highlight .kv {\n    color: #cf222e;\n  }\n\n  .highlight .gr {\n    color: #f6f8fa;\n  }\n\n  .highlight .gd {\n    color: #82071e;\n    background-color: #ffebe9;\n  }\n\n  .highlight .nb {\n    color: #953800;\n  }\n\n  .highlight .nc {\n    color: #953800;\n  }\n\n  .highlight .no {\n    color: #953800;\n  }\n\n  .highlight .nn {\n    color: #953800;\n  }\n\n  .highlight .sr {\n    color: #116329;\n  }\n\n  .highlight .na {\n    color: #116329;\n  }\n\n  .highlight .nt {\n    color: #116329;\n  }\n\n  .highlight .gi {\n    color: #116329;\n    background-color: #dafbe1;\n  }\n\n  .highlight .kc {\n    color: #0550ae;\n  }\n\n  .highlight .l,\n  .highlight .ld,\n  .highlight .m,\n  .highlight .mb,\n  .highlight .mf,\n  .highlight .mh,\n  .highlight .mi,\n  .highlight .il,\n  .highlight .mo,\n  .highlight .mx {\n    color: #0550ae;\n  }\n\n  .highlight .sb {\n    color: #0550ae;\n  }\n\n  .highlight .bp {\n    color: #0550ae;\n  }\n\n  .highlight .ne {\n    color: #0550ae;\n  }\n\n  .highlight .nl {\n    color: #0550ae;\n  }\n\n  .highlight .py {\n    color: #0550ae;\n  }\n\n  .highlight .nv,\n  .highlight .vc,\n  .highlight .vg,\n  .highlight .vi,\n  .highlight .vm {\n    color: #0550ae;\n  }\n\n  .highlight .o,\n  .highlight .ow {\n    color: #0550ae;\n  }\n\n  .highlight .gh {\n    color: #0550ae;\n    font-weight: bold;\n  }\n\n  .highlight .gu {\n    color: #0550ae;\n    font-weight: bold;\n  }\n\n  .highlight .s,\n  .highlight .sa,\n  .highlight .sc,\n  .highlight .dl,\n  .highlight .sd,\n  .highlight .s2,\n  .highlight .se,\n  .highlight .sh,\n  .highlight .sx,\n  .highlight .s1,\n  .highlight .ss {\n    color: #0a3069;\n  }\n\n  .highlight .nd {\n    color: #8250df;\n  }\n\n  .highlight .nf,\n  .highlight .fm {\n    color: #8250df;\n  }\n\n  .highlight .err {\n    color: #f6f8fa;\n    background-color: #82071e;\n  }\n\n  .highlight .c,\n  .highlight .ch,\n  .highlight .cd,\n  .highlight .cm,\n  .highlight .cp,\n  .highlight .cpf,\n  .highlight .c1,\n  .highlight .cs {\n    color: #68717a;\n  }\n\n  .highlight .gl {\n    color: #68717a;\n  }\n\n  .highlight .gt {\n    color: #68717a;\n  }\n\n  .highlight .ni {\n    color: #24292f;\n  }\n\n  .highlight .si {\n    color: #24292f;\n  }\n\n  .highlight .ge {\n    color: #24292f;\n    font-style: italic;\n  }\n\n  .highlight .gs {\n    color: #24292f;\n    font-weight: bold;\n  }\n}\n","@mixin styles {\n  color-scheme: dark;\n\n  /* Framework color */\n  --main-bg: rgb(27, 27, 30);\n  --mask-bg: rgb(68, 69, 70);\n  --main-border-color: rgb(44, 45, 45);\n\n  /* Common color */\n  --text-color: rgb(175, 176, 177);\n  --text-muted-color: #868686;\n  --text-muted-highlight-color: #aeaeae;\n  --heading-color: #cccccc;\n  --label-color: #a7a7a7;\n  --blockquote-border-color: rgb(66, 66, 66);\n  --blockquote-text-color: #868686;\n  --link-color: rgb(138, 180, 248);\n  --link-underline-color: rgb(82, 108, 150);\n  --button-bg: #1e1e1e;\n  --btn-border-color: #2e2f31;\n  --btn-backtotop-color: var(--text-color);\n  --btn-backtotop-border-color: #212122;\n  --card-header-bg: #292929;\n  --checkbox-color: rgb(118, 120, 121);\n  --checkbox-checked-color: var(--link-color);\n  --img-bg: radial-gradient(circle, rgb(22, 22, 24) 0%, rgb(32, 32, 32) 100%);\n  --shimmer-bg: linear-gradient(\n    90deg,\n    rgba(255, 255, 255, 0) 0%,\n    rgba(58, 55, 55, 0.4) 50%,\n    rgba(255, 255, 255, 0) 100%\n  );\n\n  /* Sidebar */\n  --site-title-color: #717070;\n  --site-subtitle-color: #868686;\n  --sidebar-bg: #1e1e1e;\n  --sidebar-border-color: #292929;\n  --sidebar-muted-color: #868686;\n  --sidebar-active-color: rgb(255, 255, 255, 0.95);\n  --sidebar-hover-bg: #262626;\n  --sidebar-btn-bg: #232328;\n  --sidebar-btn-color: #787878;\n  --avatar-border-color: rgb(206, 206, 206, 0.9);\n\n  /* Topbar */\n  --topbar-bg: rgb(27, 27, 30, 0.64);\n  --topbar-text-color: var(--text-color);\n  --search-border-color: rgb(55, 55, 55);\n  --search-icon-color: rgb(100, 102, 105);\n  --input-focus-border-color: rgb(112, 114, 115);\n\n  /* Home page */\n  --post-list-text-color: rgb(175, 176, 177);\n  --btn-patinator-text-color: var(--text-color);\n  --btn-paginator-hover-color: #2e2e2e;\n\n  /* Posts */\n  --toc-highlight: rgb(116, 178, 243);\n  --toc-popup-border-color: #373737;\n  --tag-hover: rgb(43, 56, 62);\n  --tb-odd-bg: #252526; /* odd rows of the posts' table */\n  --tb-even-bg: rgb(31, 31, 34); /* even rows of the posts' table */\n  --tb-border-color: var(--tb-odd-bg);\n  --footnote-target-bg: rgb(63, 81, 181);\n  --btn-share-color: #6c757d;\n  --btn-share-hover-color: #bfc1ca;\n  --card-bg: #1e1e1e;\n  --card-hovor-bg: #464d51;\n  --card-shadow: rgb(21, 21, 21, 0.72) 0 6px 18px 0,\n    rgb(137, 135, 135, 0.24) 0 0 0 1px;\n  --kbd-wrap-color: #6a6a6a;\n  --kbd-text-color: #d3d3d3;\n  --kbd-bg-color: #242424;\n  --prompt-text-color: rgb(216, 212, 212, 0.75);\n  --prompt-tip-bg: rgb(22, 60, 36, 0.64);\n  --prompt-tip-icon-color: rgb(15, 164, 15, 0.81);\n  --prompt-info-bg: rgb(7, 59, 104, 0.8);\n  --prompt-info-icon-color: #0075d1;\n  --prompt-warning-bg: rgb(90, 69, 3, 0.88);\n  --prompt-warning-icon-color: rgb(255, 165, 0, 0.8);\n  --prompt-danger-bg: rgb(86, 28, 8, 0.8);\n  --prompt-danger-icon-color: #cd0202;\n\n  /* Tags */\n  --tag-border: rgb(59, 79, 88);\n  --tag-shadow: rgb(32, 33, 33);\n  --dash-color: rgb(63, 65, 68);\n  --search-tag-bg: #292828;\n\n  /* Categories */\n  --categories-border: rgb(64, 66, 69, 0.5);\n  --categories-hover-bg: rgb(73, 75, 76);\n  --categories-icon-hover-color: white;\n\n  /* Archive */\n  --timeline-node-bg: rgb(150, 152, 156);\n  --timeline-color: rgb(63, 65, 68);\n  --timeline-year-dot-color: var(--timeline-color);\n\n  /* Code highlight colors */\n  --language-border-color: #2d2d2d;\n  --highlight-bg-color: #151515;\n  --highlighter-rouge-color: #c9def1;\n  --highlight-lineno-color: #808080;\n  --inline-code-bg: rgba(255, 255, 255, 0.05);\n  --code-color: #b0b0b0;\n  --code-header-text-color: #6a6a6a;\n  --code-header-muted-color: #353535;\n  --code-header-icon-color: #565656;\n  --clipboard-checked-color: #2bcc2b;\n  --filepath-text-color: #cacaca;\n\n  .light {\n    display: none;\n  }\n\n  /* Categories */\n  .categories.card,\n  .list-group-item {\n    background-color: var(--card-bg);\n  }\n\n  .categories {\n    .card-header {\n      background-color: var(--card-header-bg);\n    }\n\n    .list-group-item {\n      border-left: none;\n      border-right: none;\n      padding-left: 2rem;\n      border-color: var(--categories-border);\n\n      &:last-child {\n        border-bottom-color: var(--card-bg);\n      }\n    }\n  }\n\n  #archives li:nth-child(odd) {\n    background-image: linear-gradient(\n      to left,\n      rgb(26, 26, 30),\n      rgb(39, 39, 45),\n      rgb(39, 39, 45),\n      rgb(39, 39, 45),\n      rgb(26, 26, 30)\n    );\n  }\n\n  /* stylelint-disable-next-line selector-id-pattern */\n  #disqus_thread {\n    color-scheme: none;\n  }\n\n  /* --- Syntax highlight theme from `rougify style base16.dark` --- */\n\n  .highlight .gp {\n    color: #87939d;\n  }\n\n  .highlight table td {\n    padding: 5px;\n  }\n\n  .highlight table pre {\n    margin: 0;\n  }\n\n  .highlight,\n  .highlight .w {\n    color: #d0d0d0;\n    background-color: #151515;\n  }\n\n  .highlight .err {\n    color: #151515;\n    background-color: #ac4142;\n  }\n\n  .highlight .c,\n  .highlight .ch,\n  .highlight .cd,\n  .highlight .cm,\n  .highlight .cpf,\n  .highlight .c1,\n  .highlight .cs {\n    color: #848484;\n  }\n\n  .highlight .cp {\n    color: #f4bf75;\n  }\n\n  .highlight .nt {\n    color: #f4bf75;\n  }\n\n  .highlight .o,\n  .highlight .ow {\n    color: #d0d0d0;\n  }\n\n  .highlight .p,\n  .highlight .pi {\n    color: #d0d0d0;\n  }\n\n  .highlight .gi {\n    color: #90a959;\n  }\n\n  .highlight .gd {\n    color: #f08a8b;\n    background-color: #320000;\n  }\n\n  .highlight .gh {\n    color: #6a9fb5;\n    background-color: #151515;\n    font-weight: bold;\n  }\n\n  .highlight .k,\n  .highlight .kn,\n  .highlight .kp,\n  .highlight .kr,\n  .highlight .kv {\n    color: #aa759f;\n  }\n\n  .highlight .kc {\n    color: #d28445;\n  }\n\n  .highlight .kt {\n    color: #d28445;\n  }\n\n  .highlight .kd {\n    color: #d28445;\n  }\n\n  .highlight .s,\n  .highlight .sb,\n  .highlight .sc,\n  .highlight .dl,\n  .highlight .sd,\n  .highlight .s2,\n  .highlight .sh,\n  .highlight .sx,\n  .highlight .s1 {\n    color: #90a959;\n  }\n\n  .highlight .sa {\n    color: #aa759f;\n  }\n\n  .highlight .sr {\n    color: #75b5aa;\n  }\n\n  .highlight .si {\n    color: #b76d45;\n  }\n\n  .highlight .se {\n    color: #b76d45;\n  }\n\n  .highlight .nn {\n    color: #f4bf75;\n  }\n\n  .highlight .nc {\n    color: #f4bf75;\n  }\n\n  .highlight .no {\n    color: #f4bf75;\n  }\n\n  .highlight .na {\n    color: #6a9fb5;\n  }\n\n  .highlight .m,\n  .highlight .mb,\n  .highlight .mf,\n  .highlight .mh,\n  .highlight .mi,\n  .highlight .il,\n  .highlight .mo,\n  .highlight .mx {\n    color: #90a959;\n  }\n\n  .highlight .ss {\n    color: #90a959;\n  }\n}\n","@use 'sass:map';\n\n$-breakpoints: (\n  // 1 column\n  sm: 576px,\n  md: 768px,\n  // 2 columns\n  lg: 850px,\n  // 3 columns\n  xl: 1200px,\n  xxl: 1400px,\n  xxxl: 1650px\n);\n\n@function get($breakpoint) {\n  @return map.get($-breakpoints, $breakpoint);\n}\n\n/* Less than the given width */\n@mixin lt($width) {\n  @media all and (max-width: calc(#{$width} - 1px)) {\n    @content;\n  }\n}\n\n/* Less than or equal to the given width */\n@mixin lte($width) {\n  @media all and (max-width: $width) {\n    @content;\n  }\n}\n\n@mixin sm {\n  @media all and (min-width: get(sm)) {\n    @content;\n  }\n}\n\n@mixin md {\n  @media all and (min-width: get(md)) {\n    @content;\n  }\n}\n\n@mixin lg {\n  @media all and (min-width: get(lg)) {\n    @content;\n  }\n}\n\n@mixin xl {\n  @media all and (min-width: get(xl)) {\n    @content;\n  }\n}\n\n@mixin xxl {\n  @media all and (min-width: get(xxl)) {\n    @content;\n  }\n}\n\n@mixin xxxl {\n  @media all and (min-width: get(xxxl)) {\n    @content;\n  }\n}\n\n@mixin between($min, $max) {\n  @media all and (min-width: $min) and (max-width: $max) {\n    @content;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n@for $i from 1 through 5 {\n  h#{$i} {\n    @extend %heading;\n\n    @if $i > 1 {\n      @extend %anchor;\n    }\n\n    @if $i < 5 {\n      $size-factor: 0.25rem;\n\n      @if $i > 1 {\n        $size-factor: 0.18rem;\n\n        main & {\n          @if $i == 2 {\n            margin: 2.5rem 0 1.25rem;\n          } @else {\n            margin: 2rem 0 1rem;\n          }\n        }\n      }\n\n      & {\n        font-size: 1rem + (5 - $i) * $size-factor;\n      }\n    } @else {\n      font-size: 1.05rem;\n    }\n  }\n}\n\na {\n  @extend %link-color;\n\n  text-decoration: none;\n}\n\nimg {\n  max-width: 100%;\n  height: auto;\n  transition: all 0.35s ease-in-out;\n\n  .blur & {\n    $blur: 20px;\n\n    -webkit-filter: blur($blur);\n    filter: blur($blur);\n  }\n}\n\nblockquote {\n  border-left: 0.125rem solid var(--blockquote-border-color);\n  padding-left: 1rem;\n  color: var(--blockquote-text-color);\n  margin-top: 0.5rem;\n\n  > p:last-child {\n    margin-bottom: 0;\n  }\n\n  &[class^='prompt-'] {\n    border-left: 0;\n    position: relative;\n    padding: 1rem 1rem 1rem 3rem;\n    color: var(--prompt-text-color);\n\n    @extend %rounded;\n\n    &::before {\n      text-align: center;\n      width: 3rem;\n      position: absolute;\n      left: 0.25rem;\n      margin-top: 0.4rem;\n      text-rendering: auto;\n      -webkit-font-smoothing: antialiased;\n    }\n  }\n\n  @include mx.prompt('tip', '\\f0eb', $fa-style: 'regular');\n  @include mx.prompt('info', '\\f06a', $rotate: 180);\n  @include mx.prompt('warning', '\\f06a');\n  @include mx.prompt('danger', '\\f071');\n}\n\nkbd {\n  font-family: Lato, sans-serif;\n  display: inline-block;\n  vertical-align: middle;\n  line-height: 1.3rem;\n  min-width: 1.75rem;\n  text-align: center;\n  margin: 0 0.3rem;\n  padding-top: 0.1rem;\n  color: var(--kbd-text-color);\n  background-color: var(--kbd-bg-color);\n  border-radius: v.$radius-sm;\n  border: solid 1px var(--kbd-wrap-color);\n  box-shadow: inset 0 -2px 0 var(--kbd-wrap-color);\n}\n\nhr {\n  border-color: var(--main-border-color);\n  opacity: 1;\n}\n\nfooter {\n  background-color: var(--main-bg);\n  height: v.$footer-height;\n  border-top: 1px solid var(--main-border-color);\n\n  @extend %text-xs;\n\n  a {\n    @extend %text-highlight;\n\n    &:hover {\n      @extend %link-hover;\n    }\n  }\n\n  em {\n    @extend %text-highlight;\n  }\n\n  p {\n    text-align: center;\n    margin-bottom: 0;\n  }\n}\n\n/* fontawesome icons */\ni {\n  &.far,\n  &.fas {\n    @extend %no-cursor;\n  }\n}\n\nsup {\n  @extend %sup-fn-target;\n}\n\nmain {\n  line-height: 1.75;\n\n  h1 {\n    margin-top: 2rem;\n\n    @include bp.lg {\n      margin-top: 3rem;\n    }\n  }\n\n  p {\n    > a.popup {\n      &:not(.normal):not(.left):not(.right) {\n        @include mx.align-center;\n      }\n    }\n  }\n\n  .categories,\n  #tags,\n  #archives {\n    a:not(:hover) {\n      @extend %no-bottom-border;\n    }\n  }\n\n  @include bp.lte(bp.get(sm)) {\n    .content {\n      > blockquote[class^='prompt-'] {\n        @include mx.ml-mr(-1rem);\n\n        border-radius: 0;\n        max-width: none;\n      }\n    }\n  }\n}\n\n.footnotes > ol {\n  padding-left: 2rem;\n  margin-top: 0.5rem;\n\n  > li {\n    &:not(:last-child) {\n      margin-bottom: 0.3rem;\n    }\n\n    @extend %sup-fn-target;\n\n    > p {\n      margin-left: 0.25em;\n\n      @include mx.mt-mb(0);\n    }\n  }\n}\n\n.footnote {\n  @at-root a#{&} {\n    @include mx.ml-mr(1px);\n    @include mx.pl-pr(2px);\n\n    border-bottom-style: none !important;\n  }\n}\n\n.reversefootnote {\n  @at-root a#{&} {\n    font-size: 0.6rem;\n    line-height: 1;\n    position: relative;\n    bottom: 0.25em;\n    margin-left: 0.25em;\n    border-bottom-style: none !important;\n  }\n}\n\n/* --- Begin of Markdown table style --- */\n\n/* it will be created by Liquid */\n.table-wrapper {\n  overflow-x: auto;\n  margin-bottom: 1.5rem;\n\n  > table {\n    min-width: 100%;\n    overflow-x: auto;\n    border-spacing: 0;\n\n    thead {\n      border-bottom: solid 2px rgba(210, 215, 217, 0.75);\n\n      th {\n        @extend %table-cell;\n      }\n    }\n\n    tbody {\n      tr {\n        border-bottom: 1px solid var(--tb-border-color);\n\n        &:nth-child(2n) {\n          background-color: var(--tb-even-bg);\n        }\n\n        &:nth-child(2n + 1) {\n          background-color: var(--tb-odd-bg);\n        }\n\n        td {\n          @extend %table-cell;\n        }\n      }\n    } /* tbody */\n  } /* table */\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n.highlighter-rouge {\n  color: var(--highlighter-rouge-color);\n  margin-top: 0.5rem;\n  margin-bottom: 1.2em; /* Override BS Inline-code style */\n}\n\n.highlight {\n  @extend %rounded;\n  @extend %code-snippet-bg;\n\n  overflow: auto;\n  padding-bottom: 0.75rem;\n\n  @at-root figure#{&} {\n    @extend %code-snippet-bg;\n  }\n\n  pre {\n    margin-bottom: 0;\n    font-size: v.$code-font-size;\n    line-height: 1.4rem;\n    word-wrap: normal; /* Fixed Safari overflow-x */\n  }\n\n  table {\n    td {\n      &:first-child {\n        display: inline-block;\n        margin-left: 1rem;\n        margin-right: 0.75rem;\n      }\n\n      &:last-child {\n        padding-right: 2rem !important;\n      }\n\n      pre {\n        overflow: visible; /* Fixed iOS safari overflow-x */\n        word-break: normal; /* Fixed iOS safari linenos code break */\n      }\n    }\n  }\n\n  .lineno {\n    text-align: right;\n    color: var(--highlight-lineno-color);\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -o-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n  }\n} /* .highlight */\n\ncode {\n  -webkit-hyphens: none;\n  -ms-hyphens: none;\n  hyphens: none;\n  color: var(--code-color);\n\n  &.highlighter-rouge {\n    font-size: v.$code-font-size;\n    padding: 3px 5px;\n    word-break: break-word;\n    border-radius: v.$radius-sm;\n    background-color: var(--inline-code-bg);\n  }\n\n  &.filepath {\n    background-color: inherit;\n    color: var(--filepath-text-color);\n    font-weight: 600;\n    padding: 0;\n  }\n\n  a > &.highlighter-rouge {\n    padding-bottom: 0; /* show link's underlinke */\n    color: inherit;\n  }\n\n  a:hover > &.highlighter-rouge {\n    border-bottom: none;\n  }\n\n  blockquote & {\n    color: inherit;\n  }\n}\n\ntd.rouge-code {\n  @extend %code-snippet-padding;\n\n  /*\n    Prevent some browser extends from\n    changing the URL string of code block.\n  */\n  a {\n    color: inherit !important;\n    border-bottom: none !important;\n    pointer-events: none;\n  }\n}\n\ndiv[class^='language-'] {\n  @extend %rounded;\n  @extend %code-snippet-bg;\n\n  box-shadow: var(--language-border-color) 0 0 0 1px;\n\n  .content > & {\n    @include mx.ml-mr(-1rem);\n\n    border-radius: 0;\n\n    @include bp.sm {\n      @include mx.ml-mr(0);\n\n      border-radius: v.$radius-lg;\n    }\n  }\n\n  .code-header {\n    @include bp.sm {\n      @include mx.ml-mr(0);\n\n      $dot-margin: 1rem;\n\n      &::before {\n        content: '';\n        display: inline-block;\n        margin-left: $dot-margin;\n        width: v.$code-dot-size;\n        height: v.$code-dot-size;\n        border-radius: 50%;\n        background-color: var(--code-header-muted-color);\n        box-shadow: (v.$code-dot-size + v.$code-dot-gap) 0 0\n            var(--code-header-muted-color),\n          (v.$code-dot-size + v.$code-dot-gap) * 2 0 0\n            var(--code-header-muted-color);\n      }\n\n      span {\n        // center the text of label\n        margin-left: calc(($dot-margin + v.$code-dot-size) / 2 * -1);\n      }\n    }\n  }\n\n  .highlight {\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n}\n\n/* Hide line numbers for default, console, and terminal code snippets */\ndiv {\n  &.nolineno,\n  &.language-plaintext,\n  &.language-console,\n  &.language-terminal {\n    td:first-child {\n      padding: 0 !important;\n      margin-right: 0;\n\n      .lineno {\n        display: none;\n      }\n    }\n  }\n}\n\n.code-header {\n  @extend %no-cursor;\n\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  height: v.$code-header-height;\n  margin-left: 0.75rem;\n  margin-right: 0.25rem;\n\n  /* the label block */\n  span {\n    line-height: v.$code-header-height;\n\n    /* label icon */\n    i {\n      font-size: 1rem;\n      width: v.$code-icon-width;\n      color: var(--code-header-icon-color);\n\n      &.small {\n        font-size: 70%;\n      }\n    }\n\n    @at-root [file] #{&} > i {\n      position: relative;\n      top: 1px; /* center the file icon */\n    }\n\n    /* label text */\n    &::after {\n      content: attr(data-label-text);\n      font-size: 0.85rem;\n      font-weight: 600;\n      color: var(--code-header-text-color);\n    }\n  }\n\n  /* clipboard */\n  button {\n    @extend %cursor-pointer;\n    @extend %rounded;\n\n    border: 1px solid transparent;\n    height: v.$code-header-height;\n    width: v.$code-header-height;\n    padding: 0;\n    background-color: inherit;\n\n    i {\n      color: var(--code-header-icon-color);\n    }\n\n    &[timeout] {\n      &:hover {\n        border-color: var(--clipboard-checked-color);\n      }\n\n      i {\n        color: var(--clipboard-checked-color);\n      }\n    }\n\n    &:focus {\n      outline: none;\n    }\n\n    &:not([timeout]):hover {\n      background-color: rgba(128, 128, 128, 0.37);\n\n      i {\n        color: white;\n      }\n    }\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n\n#back-to-top {\n  visibility: hidden;\n  opacity: 0;\n  z-index: 1;\n  cursor: pointer;\n  position: fixed;\n  right: 1rem;\n  bottom: calc(v.$footer-height-large - v.$back2top-size / 2);\n  background: var(--button-bg);\n  color: var(--btn-backtotop-color);\n  padding: 0;\n  width: v.$back2top-size;\n  height: v.$back2top-size;\n  border-radius: 50%;\n  border: 1px solid var(--btn-backtotop-border-color);\n  transition: opacity 0.5s ease-in-out, transform 0.2s ease-out;\n\n  @include bp.lg {\n    right: 5%;\n    bottom: calc(v.$footer-height - v.$back2top-size / 2);\n  }\n\n  @include bp.xxl {\n    right: calc((100vw - v.$sidebar-width - 1140px) / 2 + 3rem);\n  }\n\n  @include bp.xxxl {\n    right: calc(\n      (100vw - v.$sidebar-width-large - v.$main-content-max-width) / 2 + 2rem\n    );\n  }\n\n  &:hover {\n    transform: translate3d(0, -5px, 0);\n    -webkit-transform: translate3d(0, -5px, 0);\n  }\n\n  i {\n    line-height: v.$back2top-size;\n    position: relative;\n    bottom: 2px;\n  }\n\n  &.show {\n    opacity: 1;\n    visibility: visible;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n/* PWA update popup */\n#notification {\n  @-webkit-keyframes popup {\n    from {\n      opacity: 0;\n      bottom: 0;\n    }\n  }\n\n  @keyframes popup {\n    from {\n      opacity: 0;\n      bottom: 0;\n    }\n  }\n\n  .toast-header {\n    background: none;\n    border-bottom: none;\n    color: inherit;\n  }\n\n  .toast-body {\n    font-family: Lato, sans-serif;\n    line-height: 1.25rem;\n\n    button {\n      font-size: 90%;\n      min-width: 4rem;\n    }\n  }\n\n  &.toast {\n    &.show {\n      display: block;\n      min-width: 20rem;\n      border-radius: 0.5rem;\n      -webkit-backdrop-filter: blur(10px);\n      backdrop-filter: blur(10px);\n      background-color: rgba(255, 255, 255, 0.5);\n      color: #1b1b1eba;\n      position: fixed;\n      left: 50%;\n      bottom: 20%;\n      transform: translateX(-50%);\n      -webkit-animation: popup 0.8s;\n      animation: popup 0.8s;\n    }\n  }\n}\n\n#toc-popup {\n  $slide-in: slide-in 0.3s ease-out;\n  $slide-out: slide-out 0.3s ease-out;\n  $curtain-height: 2rem;\n  $backdrop: blur(5px);\n\n  border-color: var(--toc-popup-border-color);\n  border-width: 1px;\n  border-radius: v.$radius-lg;\n  color: var(--text-color);\n  background: var(--card-bg);\n  margin-top: v.$topbar-height;\n  min-width: 20rem;\n  font-size: 1.05rem;\n\n  @include bp.sm {\n    max-width: 32rem;\n  }\n\n  &[open] {\n    -webkit-animation: $slide-in;\n    animation: $slide-in;\n  }\n\n  &[closing] {\n    -webkit-animation: $slide-out;\n    animation: $slide-out;\n  }\n\n  @include bp.lg {\n    left: v.$sidebar-width;\n  }\n\n  .header {\n    @extend %btn-color;\n\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    background-color: inherit;\n    border-bottom: 1px solid var(--main-border-color);\n\n    .label {\n      font-family: v.$font-family-heading;\n    }\n  }\n\n  button {\n    > i {\n      font-size: 1.25rem;\n      vertical-align: middle;\n    }\n\n    &:focus-visible {\n      box-shadow: none;\n    }\n  }\n\n  ul {\n    list-style-type: none;\n    padding-left: 0;\n\n    li {\n      ul,\n      & + li {\n        margin-top: 0.25rem;\n      }\n\n      a {\n        display: flex;\n        line-height: 1.5;\n        padding: 0.375rem 0;\n        padding-right: 1.125rem;\n\n        &.toc-link::before {\n          display: none;\n        }\n      }\n    }\n  }\n\n  @for $i from 2 through 4 {\n    .node-name--H#{$i} {\n      padding-left: 1.125rem * ($i - 1);\n    }\n  }\n\n  .is-active-link {\n    color: var(--toc-highlight) !important;\n    font-weight: 600;\n  }\n\n  &::-webkit-backdrop {\n    -webkit-backdrop-filter: $backdrop;\n    backdrop-filter: $backdrop;\n  }\n\n  &::backdrop {\n    -webkit-backdrop-filter: $backdrop;\n    backdrop-filter: $backdrop;\n  }\n\n  &::after {\n    display: flex;\n    content: '';\n    position: relative;\n    background: linear-gradient(transparent, var(--card-bg) 70%);\n    height: $curtain-height;\n  }\n\n  #toc-popup-content {\n    overflow: auto;\n    max-height: calc(100vh - 4 * v.$topbar-height);\n    font-family: v.$font-family-heading;\n    margin-bottom: -$curtain-height;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n$btn-border-width: 3px;\n$btn-mb: 0.5rem;\n$sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */\n\n#sidebar {\n  @include mx.pl-pr(0);\n\n  position: fixed;\n  top: 0;\n  left: 0;\n  height: 100%;\n  overflow-y: auto;\n  width: v.$sidebar-width;\n  background: var(--sidebar-bg);\n  border-right: 1px solid var(--sidebar-border-color);\n\n  /* Hide scrollbar for IE, Edge and Firefox */\n  -ms-overflow-style: none; /* IE and Edge */\n  scrollbar-width: none; /* Firefox */\n\n  /* Hide scrollbar for Chrome, Safari and Opera */\n  &::-webkit-scrollbar {\n    display: none;\n  }\n\n  @include bp.lt(bp.get(lg)) {\n    @include mx.slide;\n\n    transform: translateX(-#{v.$sidebar-width}); /* hide */\n    -webkit-transform: translateX(-#{v.$sidebar-width});\n\n    [#{$sidebar-display}] & {\n      transform: translateX(0);\n    }\n  }\n\n  @include bp.xxxl {\n    width: v.$sidebar-width-large;\n  }\n\n  %sidebar-link-hover {\n    &:hover {\n      color: var(--sidebar-active-color);\n    }\n  }\n\n  a {\n    @extend %sidebar-links;\n  }\n\n  #avatar {\n    display: block;\n    width: 6.5rem;\n    height: 6.5rem;\n    overflow: hidden;\n    box-shadow: var(--avatar-border-color) 0 0 0 2px;\n    transform: translateZ(0); /* fixed the zoom in Safari */\n\n    @include bp.sm {\n      width: 7rem;\n      height: 7rem;\n    }\n\n    img {\n      transition: transform 0.5s;\n\n      &:hover {\n        transform: scale(1.2);\n      }\n    }\n  }\n\n  .profile-wrapper {\n    @include mx.mt-mb(2.5rem);\n    @extend %clickable-transition;\n\n    padding-left: 2.5rem;\n    padding-right: 1.25rem;\n    width: 100%;\n\n    @include bp.lg {\n      margin-top: 3rem;\n    }\n\n    @include bp.xxxl {\n      margin-top: 3.5rem;\n      margin-bottom: 2.5rem;\n      padding-left: 3.5rem;\n    }\n  }\n\n  .site-title {\n    @extend %clickable-transition;\n    @extend %sidebar-link-hover;\n\n    font-family: inherit;\n    font-weight: 900;\n    font-size: 1.75rem;\n    line-height: 1.2;\n    letter-spacing: 0.25px;\n    margin-top: 1.25rem;\n    margin-bottom: 0.5rem;\n    width: fit-content;\n    color: var(--site-title-color);\n  }\n\n  .site-subtitle {\n    font-size: 95%;\n    color: var(--site-subtitle-color);\n    margin-top: 0.25rem;\n    word-spacing: 1px;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n  }\n\n  ul {\n    margin-bottom: 2rem;\n\n    li.nav-item {\n      opacity: 0.9;\n      width: 100%;\n\n      @include mx.pl-pr(1.5rem);\n\n      @include bp.xxxl {\n        @include mx.pl-pr(2.75rem);\n      }\n\n      a.nav-link {\n        @include mx.pt-pb(0.6rem);\n\n        display: flex;\n        align-items: center;\n        border-radius: 0.75rem;\n        font-weight: 600;\n\n        &:hover {\n          background-color: var(--sidebar-hover-bg);\n        }\n\n        i {\n          font-size: 95%;\n          opacity: 0.8;\n          margin-right: 1.5rem;\n        }\n\n        span {\n          font-size: 90%;\n          letter-spacing: 0.2px;\n        }\n      }\n\n      &.active {\n        .nav-link {\n          color: var(--sidebar-active-color);\n          background-color: var(--sidebar-hover-bg);\n\n          span {\n            opacity: 1;\n          }\n        }\n      }\n\n      &:not(:first-child) {\n        margin-top: 0.25rem;\n      }\n    }\n  }\n\n  .sidebar-bottom {\n    padding-left: 2rem;\n    padding-right: 1rem;\n    margin-bottom: 1.5rem;\n\n    @include bp.xxxl {\n      padding-left: 2.75rem;\n      margin-bottom: 1.75rem;\n    }\n\n    $btn-size: 1.75rem;\n\n    %button {\n      width: $btn-size;\n      height: $btn-size;\n      margin-bottom: $btn-mb; // multi line gap\n      border-radius: 50%;\n      color: var(--sidebar-btn-color);\n      background-color: var(--sidebar-btn-bg);\n      text-align: center;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n\n      &:not(:focus-visible) {\n        box-shadow: var(--sidebar-border-color) 0 0 0 1px;\n      }\n\n      &:hover {\n        background-color: var(--sidebar-hover-bg);\n      }\n    }\n\n    a {\n      @extend %button;\n      @extend %sidebar-link-hover;\n      @extend %clickable-transition;\n\n      &:not(:last-child) {\n        margin-right: v.$sb-btn-gap;\n\n        @include bp.xxxl {\n          margin-right: v.$sb-btn-gap-lg;\n        }\n      }\n    }\n\n    i {\n      line-height: $btn-size;\n    }\n\n    #mode-toggle {\n      @extend %button;\n      @extend %sidebar-links;\n      @extend %sidebar-link-hover;\n    }\n\n    .icon-border {\n      @extend %no-cursor;\n      @include mx.ml-mr(calc((v.$sb-btn-gap - $btn-border-width) / 2));\n\n      background-color: var(--sidebar-btn-color);\n      content: '';\n      width: $btn-border-width;\n      height: $btn-border-width;\n      border-radius: 50%;\n      margin-bottom: $btn-mb;\n\n      @include bp.xxxl {\n        @include mx.ml-mr(calc((v.$sb-btn-gap-lg - $btn-border-width) / 2));\n      }\n    }\n  } /* .sidebar-bottom */\n} /* #sidebar */\n\n[#{$sidebar-display}] {\n  #main-wrapper {\n    @include bp.lt(bp.get(lg)) {\n      transform: translateX(v.$sidebar-width);\n    }\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n#topbar-wrapper {\n  height: v.$topbar-height;\n  background-color: var(--topbar-bg);\n\n  @include bp.lt(bp.get(lg)) {\n    @include mx.slide(top 0.2s ease);\n\n    left: 0;\n  }\n}\n\n#topbar {\n  @extend %btn-color;\n\n  #breadcrumb {\n    font-size: 1rem;\n    color: var(--text-muted-color);\n    padding-left: 0.5rem;\n\n    a:hover {\n      @extend %link-hover;\n    }\n\n    span {\n      &:not(:last-child) {\n        &::after {\n          content: '›';\n          padding: 0 0.3rem;\n        }\n      }\n    }\n\n    @include bp.lt(bp.get(lg)) {\n      display: none;\n    }\n\n    @include bp.between(bp.get(lg), calc(#{bp.get(xl)} - 1px)) {\n      width: 65%;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      word-break: keep-all;\n      white-space: nowrap;\n    }\n  }\n\n  @include bp.lte(bp.get(md)) {\n    @include mx.max-w-100;\n  }\n\n  @include bp.lt(bp.get(lg)) {\n    max-width: 100%;\n  }\n}\n\n#topbar-title {\n  display: none;\n  font-size: 1.1rem;\n  font-weight: 600;\n  font-family: sans-serif;\n  color: var(--topbar-text-color);\n  text-align: center;\n  width: 70%;\n  word-break: keep-all;\n\n  @include bp.lt(bp.get(lg)) {\n    display: block;\n  }\n\n  @include bp.lg {\n    text-align: left;\n  }\n}\n\n#sidebar-trigger,\n#search-trigger {\n  display: none;\n\n  @include bp.lt(bp.get(lg)) {\n    display: block;\n  }\n}\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n.access {\n  top: 2rem;\n  transition: top 0.2s ease-in-out;\n  margin-top: 3rem;\n\n  &:only-child {\n    position: -webkit-sticky;\n    position: sticky;\n  }\n\n  > section {\n    @extend %panel-border;\n\n    padding-left: 1rem;\n\n    &:not(:first-child) {\n      margin-top: 4rem;\n    }\n  }\n\n  .content {\n    font-size: 0.9rem;\n  }\n}\n\n#panel-wrapper {\n  /* the headings */\n  .panel-heading {\n    font-family: inherit;\n    line-height: inherit;\n\n    @include mx.label(inherit);\n  }\n\n  .post-tag {\n    line-height: 1.05rem;\n    font-size: 0.85rem;\n    border-radius: 0.8rem;\n    padding: 0.3rem 0.5rem;\n    margin: 0 0.35rem 0.5rem 0;\n\n    &:hover {\n      transition: all 0.3s ease-in;\n    }\n  }\n\n  > :last-child {\n    margin-bottom: 4rem;\n  }\n\n  @include bp.lt(bp.get(xl)) {\n    display: none;\n  }\n}\n\n#access-lastmod {\n  a {\n    color: inherit;\n\n    &:hover {\n      @extend %link-hover;\n    }\n\n    @extend %no-bottom-border;\n  }\n}\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/variables' as v;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\nfooter {\n  background-color: var(--main-bg);\n  height: v.$footer-height;\n  border-top: 1px solid var(--main-border-color);\n\n  @extend %text-xs;\n\n  @include bp.lt(bp.get(lg)) {\n    @include mx.slide;\n\n    height: v.$footer-height-large;\n    padding: 1.5rem 0;\n  }\n\n  a {\n    @extend %text-highlight;\n\n    &:hover {\n      @extend %link-hover;\n    }\n  }\n\n  em {\n    @extend %text-highlight;\n  }\n\n  p {\n    text-align: center;\n    margin-bottom: 0;\n  }\n}\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/variables' as v;\n@use '../abstracts/placeholders';\n\nsearch {\n  display: flex;\n  width: 100%;\n  border-radius: 1rem;\n  border: 1px solid var(--search-border-color);\n  background: var(--main-bg);\n  padding: 0 0.5rem;\n\n  i {\n    z-index: 2;\n    font-size: 0.9rem;\n    color: var(--search-icon-color);\n  }\n\n  @include bp.lt(bp.get(lg)) {\n    display: none;\n  }\n\n  @include bp.lg {\n    max-width: v.$search-max-width;\n  }\n\n  @include bp.xl {\n    margin-right: 4rem;\n  }\n\n  @include bp.xxxl {\n    margin-right: calc(\n      v.$main-content-max-width / 4 - v.$search-max-width - 0.75rem\n    );\n  }\n}\n\n#search-result-wrapper {\n  display: none;\n  height: 100%;\n  width: 100%;\n  overflow: auto;\n\n  .content {\n    margin-top: 2rem;\n  }\n\n  @include bp.lt(bp.get(lg)) {\n    width: 100%;\n\n    .content {\n      letter-spacing: 0;\n    }\n  }\n\n  @include bp.lg {\n    max-width: v.$main-content-max-width;\n    justify-content: start !important;\n  }\n}\n\n#search-results {\n  padding-bottom: 3rem;\n\n  @include bp.between(bp.get(lg), calc(#{bp.get(xl)} - 1px)) {\n    > div {\n      max-width: 700px;\n    }\n  }\n\n  a {\n    font-size: 1.4rem;\n    line-height: 1.5rem;\n\n    &:hover {\n      @extend %link-hover;\n    }\n\n    @extend %link-color;\n    @extend %no-bottom-border;\n    @extend %heading;\n  }\n\n  > article {\n    width: 100%;\n\n    &:not(:last-child) {\n      margin-bottom: 1rem;\n    }\n\n    @include bp.xl {\n      width: 45%;\n\n      &:nth-child(odd) {\n        margin-right: 1.5rem;\n      }\n\n      &:nth-child(even) {\n        margin-left: 1.5rem;\n      }\n\n      &:last-child:nth-child(odd) {\n        position: relative;\n        right: 24.3%;\n      }\n    }\n\n    h2 {\n      line-height: 2.5rem;\n    }\n\n    /* icons */\n    i {\n      color: #818182;\n      margin-right: 0.15rem;\n      font-size: 80%;\n    }\n\n    > p {\n      @extend %text-ellipsis;\n\n      white-space: break-spaces;\n      display: -webkit-box;\n      -webkit-line-clamp: 3;\n      -webkit-box-orient: vertical;\n    }\n  }\n}\n\n/* 'Cancel' link */\n#search-cancel {\n  color: var(--link-color);\n  display: none;\n  white-space: nowrap;\n\n  @extend %cursor-pointer;\n}\n\n#search-input {\n  background: center;\n  border: 0;\n  border-radius: 0;\n  padding: 0.18rem 0.3rem;\n  color: var(--text-color);\n  height: auto;\n\n  &:focus {\n    box-shadow: none;\n  }\n\n  @include bp.xl {\n    transition: all 0.3s ease-in-out;\n  }\n}\n\n#search-hints {\n  padding: 0 1rem;\n\n  @include bp.lg {\n    display: none;\n  }\n\n  h4 {\n    margin-bottom: 1.5rem;\n  }\n\n  .post-tag {\n    display: inline-block;\n    line-height: 1rem;\n    font-size: 1rem;\n    background: var(--search-tag-bg);\n    border: none;\n    padding: 0.5rem;\n    margin: 0 1.25rem 1rem 0;\n\n    &::before {\n      content: '#';\n      color: var(--text-muted-color);\n      padding-right: 0.2rem;\n    }\n\n    @extend %link-color;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n#post-list {\n  margin-top: 2rem;\n\n  @include bp.lg {\n    margin-top: 2.5rem;\n  }\n\n  .card-wrapper {\n    &:hover {\n      text-decoration: none;\n    }\n\n    &:not(:last-child) {\n      margin-bottom: 1.25rem;\n    }\n  }\n\n  .card {\n    border: 0;\n    background: none;\n\n    %img-radius {\n      border-radius: v.$radius-lg v.$radius-lg 0 0;\n\n      @include bp.md {\n        border-radius: 0 v.$radius-lg v.$radius-lg 0;\n      }\n    }\n\n    .preview-img {\n      @extend %img-radius;\n\n      img {\n        @extend %img-radius;\n      }\n    }\n\n    .card-body {\n      height: 100%;\n      padding: 1rem;\n\n      @include bp.md {\n        padding: 1.75rem 1.75rem 1.25rem;\n      }\n\n      .card-title {\n        @extend %text-clip;\n\n        color: var(--heading-color) !important;\n        font-size: 1.25rem;\n      }\n\n      %muted {\n        color: var(--text-muted-color) !important;\n      }\n\n      .card-text {\n        @include bp.md {\n          display: inherit !important;\n        }\n\n        &.content {\n          @extend %muted;\n\n          p {\n            @extend %text-clip;\n\n            line-height: 1.5;\n            margin: 0;\n          }\n        }\n      }\n\n      .post-meta {\n        @extend %muted;\n\n        i {\n          &:not(:first-child) {\n            margin-left: 1.5rem;\n\n            @include bp.md {\n              margin-left: 1.75rem;\n            }\n          }\n        }\n\n        em {\n          @extend %normal-font-style;\n\n          color: inherit;\n        }\n\n        > div:first-child {\n          display: block;\n\n          @extend %text-ellipsis;\n        }\n      }\n    }\n  }\n} /* #post-list */\n\n.pagination {\n  color: var(--text-color);\n  font-family: Lato, sans-serif;\n  justify-content: space-evenly;\n\n  @include bp.lg {\n    font-size: 0.85rem;\n    justify-content: center;\n  }\n\n  a:hover {\n    text-decoration: none;\n  }\n\n  .page-item {\n    @include bp.lt(bp.get(lg)) {\n      &:not(:first-child):not(:last-child) {\n        display: none;\n      }\n    }\n\n    @include bp.lg {\n      &:not(:last-child) {\n        margin-right: 0.7rem;\n      }\n    }\n\n    .page-link {\n      color: var(--btn-patinator-text-color);\n      padding: 0 0.6rem;\n      display: -webkit-box;\n      -webkit-box-pack: center;\n      -webkit-box-align: center;\n      border-radius: 0.5rem;\n      border: 0;\n      background-color: inherit;\n    }\n\n    &.active {\n      .page-link {\n        background-color: var(--btn-paginator-hover-color);\n      }\n    }\n\n    &:not(.active) {\n      .page-link {\n        &:hover {\n          box-shadow: inset var(--btn-border-color) 0 0 0 1px;\n        }\n      }\n    }\n\n    &.disabled {\n      cursor: not-allowed;\n\n      .page-link {\n        color: rgba(108, 117, 125, 0.57);\n      }\n    }\n  } /* .page-item */\n\n  .page-index {\n    @include bp.lg {\n      display: none;\n    }\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n%-btn-post-nav {\n  width: 50%;\n  position: relative;\n  border-color: var(--btn-border-color);\n}\n\n@mixin -dot($pl: 0.25rem, $pr: 0.25rem) {\n  content: '\\2022';\n  padding-left: $pl;\n  padding-right: $pr;\n}\n\nheader {\n  .post-desc {\n    @extend %heading;\n\n    font-size: 1.125rem;\n    line-height: 1.6;\n  }\n\n  .post-meta {\n    span + span::before {\n      @include -dot;\n    }\n\n    em,\n    time {\n      @extend %text-highlight;\n    }\n\n    em {\n      a {\n        color: inherit;\n      }\n    }\n  }\n\n  h1 + .post-meta {\n    margin-top: 1.5rem;\n  }\n}\n\n.post-tail-wrapper {\n  @extend %text-sm;\n\n  margin-top: 6rem;\n  border-bottom: 1px double var(--main-border-color);\n\n  .license-wrapper {\n    line-height: 1.2rem;\n\n    > a {\n      @extend %text-highlight;\n\n      &:hover {\n        @extend %link-hover;\n      }\n    }\n\n    span:last-child {\n      @extend %text-sm;\n    }\n  } /* .license-wrapper */\n\n  .post-meta a:not(:hover) {\n    @extend %link-underline;\n  }\n\n  .share-wrapper {\n    vertical-align: middle;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n\n    %icon-size {\n      font-size: 1.125rem;\n    }\n\n    .share-icons {\n      display: flex;\n\n      i {\n        color: var(--btn-share-color);\n\n        @extend %icon-size;\n      }\n\n      > * {\n        @extend %icon-size;\n\n        margin-left: 0.5rem;\n\n        &:hover {\n          i {\n            @extend %btn-share-hover;\n          }\n        }\n      }\n\n      button {\n        padding: 0;\n        border: none;\n        line-height: inherit;\n\n        @extend %cursor-pointer;\n      }\n    } /* .share-icons */\n  } /* .share-wrapper */\n}\n\n.post-tail-bottom {\n  @include bp.lte(bp.get(sm)) {\n    flex-wrap: wrap-reverse !important;\n\n    > div:first-child {\n      width: 100%;\n      margin-top: 1rem;\n    }\n  }\n}\n\n.share-mastodon {\n  /* See: https://github.com/justinribeiro/share-to-mastodon#properties */\n  --wc-stm-font-family: v.$font-family-base;\n  --wc-stm-dialog-background-color: var(--card-bg);\n  --wc-stm-form-button-border: 1px solid var(--btn-border-color);\n  --wc-stm-form-submit-background-color: var(--sidebar-btn-bg);\n  --wc-stm-form-cancel-background-color: var(--sidebar-btn-bg);\n  --wc-stm-form-button-background-color-hover: #007bff;\n  --wc-stm-form-button-color-hover: white;\n\n  font-size: 1rem;\n}\n\n.post-tags {\n  line-height: 2rem;\n\n  .post-tag {\n    &:hover {\n      @extend %link-hover;\n      @extend %tag-hover;\n      @extend %no-bottom-border;\n    }\n  }\n}\n\n.post-navigation {\n  @include bp.lt(bp.get(lg)) {\n    @include mx.pl-pr(0);\n    @include mx.ml-mr(-0.5rem);\n  }\n\n  .btn {\n    @extend %-btn-post-nav;\n\n    &:not(:hover) {\n      color: var(--link-color);\n    }\n\n    &:hover {\n      &:not(.disabled)::before {\n        color: whitesmoke;\n      }\n    }\n\n    &.disabled {\n      @extend %-btn-post-nav;\n\n      pointer-events: auto;\n      cursor: not-allowed;\n      background: none;\n      color: gray;\n    }\n\n    &.btn-outline-primary.disabled:focus {\n      box-shadow: none;\n    }\n\n    &::before {\n      color: var(--text-muted-color);\n      font-size: 0.65rem;\n      text-transform: uppercase;\n      content: attr(aria-label);\n    }\n\n    &:first-child {\n      border-radius: v.$radius-lg 0 0 v.$radius-lg;\n      left: 0.5px;\n    }\n\n    &:last-child {\n      border-radius: 0 v.$radius-lg v.$radius-lg 0;\n      right: 0.5px;\n    }\n  }\n\n  p {\n    font-size: 1.1rem;\n    line-height: 1.5rem;\n    margin-top: 0.3rem;\n    white-space: normal;\n  }\n} /* .post-navigation */\n\n@media (hover: hover) {\n  .post-navigation {\n    .btn,\n    .btn::before {\n      transition: all 0.35s ease-in-out;\n    }\n  }\n}\n\n@-webkit-keyframes fade-up {\n  from {\n    opacity: 0;\n    margin-top: 4rem;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes fade-up {\n  from {\n    opacity: 0;\n    margin-top: 4rem;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n/* TOC panel */\n\n%top-cover {\n  content: '';\n  display: block;\n  position: -webkit-sticky;\n  position: sticky;\n  top: 0;\n  width: 100%;\n  height: 3rem;\n  background: linear-gradient(var(--main-bg) 50%, transparent);\n}\n\n#toc-wrapper {\n  top: 0;\n  transition: top 0.2s ease-in-out;\n  overflow-y: auto;\n  max-height: 100vh;\n  scrollbar-width: none;\n  margin-top: 2rem;\n\n  &:not(.invisible) {\n    -webkit-animation: fade-up 0.8s;\n    animation: fade-up 0.8s;\n  }\n\n  ul {\n    list-style: none;\n    font-size: 0.85rem;\n    line-height: 1.25;\n    padding-left: 0;\n\n    li {\n      a {\n        padding: 0.4rem 0 0.4rem 1.25rem;\n      }\n    }\n\n    /* Overwrite TOC plugin style */\n\n    .toc-link {\n      display: block;\n\n      @extend %text-ellipsis;\n\n      &:hover {\n        color: var(--toc-highlight);\n        text-decoration: none;\n      }\n\n      &::before {\n        display: none;\n      }\n    }\n\n    .is-active-link {\n      color: var(--toc-highlight) !important;\n      font-weight: 600;\n\n      &::before {\n        display: inline-block;\n        width: 1px;\n        height: 1.25rem;\n        background-color: var(--toc-highlight) !important;\n      }\n    }\n\n    ul {\n      padding-left: 0.75rem;\n    }\n  }\n\n  @at-root .toc-border-cover {\n    @extend %top-cover;\n\n    margin-bottom: -4rem;\n  }\n\n  &::before {\n    @extend %top-cover;\n  }\n\n  &::after {\n    content: '';\n    position: fixed;\n    bottom: 0;\n    width: 15%;\n    height: 2.25rem;\n    margin-left: -1px;\n    background: linear-gradient(transparent, var(--main-bg) 70%);\n  }\n\n  > * {\n    @extend %panel-border;\n  }\n}\n\n/* --- TOC button, bar and popup in mobile/tablet --- */\n\n#toc-bar {\n  position: -webkit-sticky;\n  position: sticky;\n  top: 0;\n  z-index: 1;\n  margin: 0 -1rem;\n  height: v.$topbar-height;\n  background: var(--main-bg);\n  border-bottom: 1px solid var(--main-border-color);\n  transition: all 0.2s ease-in-out;\n\n  @extend %btn-color;\n\n  @include bp.xl {\n    display: none !important;\n  }\n\n  .label {\n    @extend %heading;\n\n    margin-left: 0.375rem;\n    padding: 0 0.75rem;\n    color: inherit;\n  }\n\n  &.invisible {\n    top: -#{v.$topbar-height};\n    transition: none;\n  }\n}\n\n#toc-solo-trigger {\n  color: var(--text-muted-color);\n  border-color: var(--btn-border-color);\n  border-radius: v.$radius-lg;\n\n  @include bp.xl {\n    display: none !important;\n  }\n\n  .label {\n    font-size: 1rem;\n    font-family: v.$font-family-heading;\n  }\n\n  &:hover {\n    box-shadow: none;\n    background: none;\n  }\n}\n\n@mixin slide-in {\n  from {\n    opacity: 0.7;\n    transform: translateY(-#{v.$topbar-height});\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@mixin slide-out {\n  0% {\n    transform: translateY(0);\n    opacity: 1;\n  }\n\n  100% {\n    transform: translateY(-#{v.$topbar-height});\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes slide-in {\n  @include slide-in;\n}\n\n@keyframes slide-in {\n  @include slide-in;\n}\n\n@-webkit-keyframes slide-out {\n  @include slide-out;\n}\n\n@keyframes slide-out {\n  @include slide-out;\n}\n\n/* --- Related Posts --- */\n\n#related-posts {\n  > h3 {\n    @include mx.label(1.1rem, 600);\n  }\n\n  time {\n    @extend %normal-font-style;\n    @extend %text-xs;\n\n    color: var(--text-muted-color);\n  }\n\n  p {\n    @extend %text-ellipsis;\n\n    font-size: 0.9rem;\n    margin-bottom: 0.5rem;\n    white-space: break-spaces;\n    display: -webkit-box;\n    -webkit-line-clamp: 2;\n    -webkit-box-orient: vertical;\n  }\n\n  .card {\n    h4 {\n      @extend %text-clip;\n    }\n  }\n}\n\n/* stylelint-disable-next-line selector-id-pattern */\n#disqus_thread {\n  min-height: 8.5rem;\n}\n\n.utterances {\n  max-width: 100%;\n  min-height: 269px;\n}\n\n%btn-share-hover {\n  color: var(--btn-share-hover-color) !important;\n}\n\n.share-label {\n  @include mx.label(inherit, 400, inherit);\n\n  &::after {\n    content: ':';\n  }\n}\n\n.content > p > img {\n  @include bp.lte(bp.get(md)) {\n    max-width: calc(100% + 1rem);\n  }\n}\n\nh2,\nh3,\nh4 {\n  @include bp.xl {\n    scroll-margin-top: 2rem;\n  }\n}\n","@use '../abstracts/variables' as v;\n@use '../abstracts/placeholders';\n\n%-category-icon-color {\n  color: gray;\n}\n\n.categories {\n  margin-bottom: 2rem;\n  border-color: var(--categories-border);\n\n  &.card,\n  .list-group {\n    @extend %rounded;\n  }\n\n  .card-header {\n    $radius: calc(v.$radius-lg - 1px);\n\n    padding: 0.75rem;\n    border-radius: $radius;\n    border-bottom: 0;\n\n    &.hide-border-bottom {\n      border-bottom-left-radius: 0;\n      border-bottom-right-radius: 0;\n    }\n  }\n\n  i {\n    @extend %-category-icon-color;\n\n    font-size: 86%; /* fontawesome icons */\n  }\n\n  .list-group-item {\n    border-left: none;\n    border-right: none;\n    padding-left: 2rem;\n\n    &:first-child {\n      border-top-left-radius: 0;\n      border-top-right-radius: 0;\n    }\n\n    &:last-child {\n      border-bottom: 0;\n    }\n  }\n} /* .categories */\n\n.category-trigger {\n  width: 1.7rem;\n  height: 1.7rem;\n  border-radius: 50%;\n  text-align: center;\n  color: #6c757d !important;\n\n  i {\n    position: relative;\n    height: 0.7rem;\n    width: 1rem;\n    transition: transform 300ms ease;\n  }\n\n  &:hover {\n    i {\n      color: var(--categories-icon-hover-color);\n    }\n  }\n}\n\n/* only works on desktop */\n@media (hover: hover) {\n  .category-trigger:hover {\n    background-color: var(--categories-hover-bg);\n  }\n}\n\n.rotate {\n  transform: rotate(-90deg);\n}\n","@use '../abstracts/breakpoints' as bp;\n\n.tag {\n  border-radius: 0.7em;\n  padding: 6px 8px 7px;\n  margin-right: 0.8rem;\n  line-height: 3rem;\n  letter-spacing: 0;\n  border: 1px solid var(--tag-border) !important;\n  box-shadow: 0 0 3px 0 var(--tag-shadow);\n\n  span {\n    margin-left: 0.6em;\n    font-size: 0.7em;\n    font-family: Oswald, sans-serif;\n  }\n}\n\n#tags {\n  @include bp.lt(bp.get(lg)) {\n    justify-content: center !important;\n  }\n}\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/placeholders';\n\n#archives {\n  letter-spacing: 0.03rem;\n\n  @include bp.lt(bp.get(sm)) {\n    margin-top: -1rem;\n\n    ul {\n      letter-spacing: 0;\n    }\n  }\n\n  $timeline-width: 4px;\n\n  %timeline {\n    content: '';\n    width: $timeline-width;\n    position: relative;\n    float: left;\n    background-color: var(--timeline-color);\n  }\n\n  .year {\n    height: 3.5rem;\n    font-size: 1.5rem;\n    position: relative;\n    left: 2px;\n    margin-left: -$timeline-width;\n\n    &::before {\n      @extend %timeline;\n\n      height: 72px;\n      left: 79px;\n      bottom: 16px;\n    }\n\n    &:first-child::before {\n      @extend %timeline;\n\n      height: 32px;\n      top: 24px;\n    }\n\n    /* Year dot */\n    &::after {\n      content: '';\n      display: inline-block;\n      position: relative;\n      border-radius: 50%;\n      width: 12px;\n      height: 12px;\n      left: 21.5px;\n      border: 3px solid;\n      background-color: var(--timeline-year-dot-color);\n      border-color: var(--timeline-node-bg);\n      box-shadow: 0 0 2px 0 #c2c6cc;\n      z-index: 1;\n    }\n  }\n\n  ul {\n    li {\n      font-size: 1.1rem;\n      line-height: 3rem;\n\n      @extend %text-ellipsis;\n\n      &:nth-child(odd) {\n        background-color: var(--main-bg, #ffffff);\n        background-image: linear-gradient(\n          to left,\n          #ffffff,\n          #fbfbfb,\n          #fbfbfb,\n          #fbfbfb,\n          #ffffff\n        );\n      }\n\n      &::before {\n        @extend %timeline;\n\n        top: 0;\n        left: 77px;\n        height: 3.1rem;\n      }\n    }\n\n    &:last-child li:last-child::before {\n      height: 1.5rem;\n    }\n  } /* #archives ul */\n\n  .date {\n    white-space: nowrap;\n    display: inline-block;\n    position: relative;\n    right: 0.5rem;\n\n    &.month {\n      width: 1.4rem;\n      text-align: center;\n    }\n\n    &.day {\n      font-size: 85%;\n      font-family: Lato, sans-serif;\n    }\n  }\n\n  a {\n    /* post title in Archvies */\n    margin-left: 2.5rem;\n    position: relative;\n    top: 0.1rem;\n\n    &:hover {\n      border-bottom: none;\n    }\n\n    &::before {\n      /* the dot before post title */\n      content: '';\n      display: inline-block;\n      position: relative;\n      border-radius: 50%;\n      width: 8px;\n      height: 8px;\n      float: left;\n      top: 1.35rem;\n      left: 71px;\n      background-color: var(--timeline-node-bg);\n      box-shadow: 0 0 3px 0 #c2c6cc;\n      z-index: 1;\n    }\n  }\n} /* #archives */\n","@use '../abstracts/breakpoints' as bp;\n@use '../abstracts/mixins' as mx;\n@use '../abstracts/placeholders';\n\n.dash {\n  margin: 0 0.5rem 0.6rem 0.5rem;\n  border-bottom: 2px dotted var(--dash-color);\n}\n\n#page-category,\n#page-tag {\n  ul > li {\n    line-height: 1.5rem;\n    padding: 0.6rem 0;\n\n    /* dot */\n    &::before {\n      background: #999999;\n      width: 5px;\n      height: 5px;\n      border-radius: 50%;\n      display: block;\n      content: '';\n      position: relative;\n      top: 0.6rem;\n      margin-right: 0.5rem;\n\n      @include bp.lt(bp.get(sm)) {\n        margin: 0 0.5rem;\n      }\n    }\n\n    /* post's title */\n    > a {\n      @extend %no-bottom-border;\n\n      font-size: 1.1rem;\n\n      @include bp.lt(bp.get(sm)) {\n        @include mx.text-ellipsis;\n      }\n    }\n  }\n}\n\n/* tag icon */\n#page-tag h1 > i {\n  font-size: 1.2rem;\n}\n\n#page-category h1 > i {\n  font-size: 1.25rem;\n}\n\n#page-category,\n#page-tag,\n#access-lastmod {\n  a:hover {\n    @extend %link-hover;\n\n    margin-bottom: -1px; /* Avoid jumping */\n  }\n}\n","@use 'sass:math';\n@use 'main';\n\n/* 生成动画 */\n@keyframes infirot {\n  from {\n    -webkit-transform: rotate(0deg);\n  }\n\n  to {\n    -webkit-transform: rotate(360deg);\n  }\n}\n\n.icon-loading1 {\n  display: inline-block;\n  animation: infirot 1s linear infinite;\n  -webkit-animation: infirot 1s linear infinite;\n}\n\n@function random_range($min, $max) {\n  $rand: math.random();\n  $random_range: $min + math.floor($rand * (($max - $min) + 1));\n  @return $random_range;\n}\n\n#animation {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  pointer-events: none;\n\n  @keyframes animate {\n    0% {\n      transform: translateY(0) rotate(0deg);\n      opacity: 1;\n      border-radius: 0;\n    }\n    100% {\n      transform: translateY(-1200px) rotate(720deg);\n      opacity: 0;\n      border-radius: 50%;\n    }\n  }\n\n  @media all and (min-width: 1200px) {\n    .animation-circle {\n      position: absolute;\n      left: var(--circle-left);\n      bottom: -300px;\n      display: block;\n      background: var(--circle-background);\n      width: var(--circle-side-length);\n      height: var(--circle-side-length);\n      animation: animate 25s linear infinite;\n      animation-duration: var(--circle-time);\n      animation-delay: var(--circle-delay);\n      pointer-events: none;\n\n      @for $i from 0 through 50 {\n        &:nth-child(#{$i}) {\n          --circle-left: #{random_range(0%, 100%)};\n          --circle-background: rgba(#{random_range(0, 255)}, #{random_range(0, 255)}, #{random_range(0, 255)}, 0.06); // 最后一个数为透明度\n          --circle-side-length: #{random_range(20px, 200px)};\n          --circle-time: #{random_range(10s, 45s)};\n          --circle-delay: #{random_range(0s, 25s)};\n        }\n      }\n    }\n  }\n\n  @media all and (max-width: 1199px) {\n    .animation-circle {\n      display: none;\n    }\n  }\n}\n\n\n/* append your custom style below */\n/* 覆盖主题的博客帖子边框样式 */\n.card-wrapper.card {\n  border: 3px solid #e3e5e7 !important; /* 使用更显眼的蓝色边框 */\n  padding: 2px; /* 适中的内边距 */\n  margin-bottom: 2px; /* 适中的下边距 */\n  border-radius: 8px; /* 适中的圆角 */\n  background-color: #f9f9f9; /* 淡灰色背景，增强边框的对比 */\n  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* 轻微的阴影 */\n  transition: transform 0.3s ease, box-shadow 0.3s ease; /* 添加平滑过渡效果 */\n}\n\n.card-wrapper.card:hover {\n  transform: translateY(-5px); /* 鼠标悬停时轻微上移 */\n  box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2); /* 增加阴影效果 */\n}\n\n/* 侧边栏背景及文字样式设置 */\n#sidebar {\n  background-image: url('/assets/img/background-dark.jpg');\n  background-size: cover;\n  background-repeat: no-repeat;\n  background-position: top;\n}\n\n#sidebar .site-title a {\n  color: #ffffff; \n  text-shadow: 5px 5px 10px rgba(0,0,0,0.5);\n}\n#sidebar .site-subtitle {\n  color: #ffffff;\n  text-shadow: 2px 2px 3px rgba(0,0,0, 0.7);\n}\n#sidebar .sidebar-bottom .mode-toggle, #sidebar a {\n  color: #ffffff;\n}\n#sidebar .sidebar-bottom .btn {\n  color: var(--sidebar-btn-color);\n}"],"file":"jekyll-theme-chirpy.css"}
\ No newline at end of file
diff --git a/_site/assets/js/data/search.json b/_site/assets/js/data/search.json
index 611bc9a..f4a6f8c 100644
--- a/_site/assets/js/data/search.json
+++ b/_site/assets/js/data/search.json
@@ -8,6 +8,14 @@
     "content": "This tutorial will guide you how to write a post in the Chirpy template, and it’s worth reading even if you’ve used Jekyll before, as many features require specific variables to be set.
 
 Naming and..."
+  },
+  {
+    "title": "Text and Typography",
+    "url": "/posts/text-and-typography/",
+    "categories": "Blogging, Demo",
+    "tags": "typography",
+    "date": "2019-08-08 11:33:00 +0800",
+    "content": "Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more."
   }
   
 ]
diff --git a/_site/assets/js/data/swconf.js b/_site/assets/js/data/swconf.js
index 0d0de66..738276e 100644
--- a/_site/assets/js/data/swconf.js
+++ b/_site/assets/js/data/swconf.js
@@ -1,6 +1,6 @@
 const swconf = {
   
-    cacheName: 'chirpy-1742302055',resources: [
+    cacheName: 'chirpy-1742303444',resources: [
       '/assets/css/jekyll-theme-chirpy.css',
       '/',
       
diff --git a/_site/categories/blogging/index.html b/_site/categories/blogging/index.html
index b67cd03..2d60804 100644
--- a/_site/categories/blogging/index.html
+++ b/_site/categories/blogging/index.html
@@ -506,7 +506,7 @@
   <h1 class="ps-lg-2">
     <i class="far fa-folder-open fa-fw text-muted"></i>
     Blogging
-    <span class="lead text-muted ps-2">1</span>
+    <span class="lead text-muted ps-2">2</span>
   </h1>
 
   <ul class="content ps-0">
@@ -529,6 +529,30 @@
   data-ts="1565244600"
   data-df="ll"
   
+>
+  Aug  8, 2019
+</time>
+
+      </li>
+    
+      <li class="d-flex justify-content-between px-md-3">
+        <a href="/posts/text-and-typography/">Text and Typography</a>
+        <span class="dash flex-grow-1"></span>
+        <!--
+  Date format snippet
+  See: ${JS_ROOT}/utils/locale-dateime.js
+-->
+
+
+
+
+<time
+  
+    class="text-muted small text-nowrap"
+  
+  data-ts="1565235180"
+  data-df="ll"
+  
 >
   Aug  8, 2019
 </time>
@@ -573,6 +597,13 @@
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -599,6 +630,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -610,6 +657,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -700,6 +750,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -711,6 +777,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
diff --git a/_site/categories/demo/index.html b/_site/categories/demo/index.html
new file mode 100644
index 0000000..2612240
--- /dev/null
+++ b/_site/categories/demo/index.html
@@ -0,0 +1,854 @@
+<!doctype html>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  <div id="animation">
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+  </div>
+
+
+<!-- `site.alt_lang` can specify a language different from the UI -->
+<html lang="en" >
+  <head>
+  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+  <meta name="theme-color" media="(prefers-color-scheme: light)" content="#f7f7f7">
+  <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#1b1b1e">
+  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+  <meta
+    name="viewport"
+    content="width=device-width, user-scalable=no initial-scale=1, shrink-to-fit=no, viewport-fit=cover"
+  ><!-- Setup Open Graph image -->
+
+  
+
+  <!-- Begin Jekyll SEO tag v2.8.0 -->
+<meta name="generator" content="Jekyll v4.4.1" />
+<meta property="og:title" content="Demo" />
+<meta property="og:locale" content="en" />
+<meta name="description" content="这里是，way的世界！welcome！" />
+<meta property="og:description" content="这里是，way的世界！welcome！" />
+<link rel="canonical" href="https://way.ember.ac.cn/categories/demo/" />
+<meta property="og:url" content="https://way.ember.ac.cn/categories/demo/" />
+<meta property="og:site_name" content="WenQi Wei" />
+<meta property="og:type" content="website" />
+<meta name="twitter:card" content="summary" />
+<meta property="twitter:title" content="Demo" />
+<meta name="twitter:site" content="@way_adventurer" />
+<script type="application/ld+json">
+{"@context":"https://schema.org","@type":"WebPage","description":"这里是，way的世界！welcome！","headline":"Demo","url":"https://way.ember.ac.cn/categories/demo/"}</script>
+<!-- End Jekyll SEO tag -->
+
+
+  <title>Demo | WenQi Wei
+  </title>
+
+  <!--
+  The Favicons for Web, Android, Microsoft, and iOS (iPhone and iPad) Apps
+  Generated by: https://realfavicongenerator.net/
+-->
+
+
+
+<link rel="apple-touch-icon" sizes="180x180" href="/assets/img/favicons/apple-touch-icon.png">
+<link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicons/favicon-32x32.png">
+<link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicons/favicon-16x16.png">
+
+  <link rel="manifest" href="/assets/img/favicons/site.webmanifest">
+
+<link rel="shortcut icon" href="/assets/img/favicons/favicon.ico">
+<meta name="apple-mobile-web-app-title" content="WenQi Wei">
+<meta name="application-name" content="WenQi Wei">
+<meta name="msapplication-TileColor" content="#da532c">
+<meta name="msapplication-config" content="/assets/img/favicons/browserconfig.xml">
+<meta name="theme-color" content="#ffffff">
+
+
+  <!-- Resource Hints -->
+  
+    
+      
+        <link rel="preconnect" href="https://fonts.googleapis.com" >
+      
+        <link rel="dns-prefetch" href="https://fonts.googleapis.com" >
+      
+    
+      
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+      
+        <link rel="dns-prefetch" href="https://fonts.gstatic.com" >
+      
+    
+      
+        <link rel="preconnect" href="https://cdn.jsdelivr.net" >
+      
+        <link rel="dns-prefetch" href="https://cdn.jsdelivr.net" >
+      
+    
+  
+
+  <!-- Bootstrap -->
+  
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css">
+  
+
+  <!-- Theme style -->
+  <link rel="stylesheet" href="/assets/css/jekyll-theme-chirpy.css">
+
+  <!-- Web Font -->
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400&family=Source+Sans+Pro:wght@400;600;700;900&display=swap">
+
+  <!-- Font Awesome Icons -->
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.7.1/css/all.min.css">
+
+  <!-- 3rd-party Dependencies -->
+
+  
+
+  
+
+  
+
+  <!-- Scripts -->
+
+  <script src="/assets/js/dist/theme.min.js"></script>
+
+  <!-- JS selector for site. -->
+
+<!-- commons -->
+
+
+
+<!-- layout specified -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+
+
+  <script defer src="https://cdn.jsdelivr.net/combine/npm/simple-jekyll-search@1.10.0/dest/simple-jekyll-search.min.js,npm/dayjs@1.11.13/dayjs.min.js,npm/dayjs@1.11.13/locale/en.js,npm/dayjs@1.11.13/plugin/relativeTime.js,npm/dayjs@1.11.13/plugin/localizedFormat.js"></script>
+
+
+
+
+
+
+
+<script defer src="/assets/js/dist/misc.min.js"></script>
+
+
+
+<!-- Pageviews -->
+
+
+
+  
+
+  <!-- A placeholder to allow defining custom metadata -->
+
+</head>
+
+
+  <body>
+    <!-- The Side Bar -->
+
+<aside aria-label="Sidebar" id="sidebar" class="d-flex flex-column align-items-end">
+  <header class="profile-wrapper">
+    <a href="/" id="avatar" class="rounded-circle"><img src="/assets/img/avatar.jpg" width="112" height="112" alt="avatar" onerror="this.style.display='none'"></a>
+
+    <a class="site-title d-block" href="/">WenQi Wei</a>
+    <p class="site-subtitle fst-italic mb-0">Show me the code</p>
+  </header>
+  <!-- .profile-wrapper -->
+
+  <nav class="flex-column flex-grow-1 w-100 ps-0">
+    <ul class="nav">
+      <!-- home -->
+      <li class="nav-item">
+        <a href="/" class="nav-link">
+          <i class="fa-fw fas fa-home"></i>
+          <span>HOME</span>
+        </a>
+      </li>
+      <!-- the real tabs -->
+      
+        <li class="nav-item">
+          <a href="/categories/" class="nav-link">
+            <i class="fa-fw fas fa-stream"></i>
+            
+
+            <span>CATEGORIES</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+        <li class="nav-item">
+          <a href="/tags/" class="nav-link">
+            <i class="fa-fw fas fa-tags"></i>
+            
+
+            <span>TAGS</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+        <li class="nav-item">
+          <a href="/archives/" class="nav-link">
+            <i class="fa-fw fas fa-archive"></i>
+            
+
+            <span>ARCHIVES</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+        <li class="nav-item">
+          <a href="/about/" class="nav-link">
+            <i class="fa-fw fas fa-info-circle"></i>
+            
+
+            <span>ABOUT</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+    </ul>
+  </nav>
+
+  <div class="sidebar-bottom d-flex flex-wrap  align-items-center w-100">
+    
+      <button type="button" class="btn btn-link nav-link" aria-label="Switch Mode" id="mode-toggle">
+        <i class="fas fa-adjust"></i>
+      </button>
+
+      
+        <span class="icon-border"></span>
+      
+    
+
+    
+      
+
+      
+        <a
+          href="https://github.com/WAY-ADVENTURER"
+          aria-label="github"
+          
+
+          
+            target="_blank"
+            
+          
+
+          
+
+          
+            rel="noopener noreferrer"
+          
+        >
+          <i class="fab fa-github"></i>
+        </a>
+      
+    
+      
+
+      
+        <a
+          href="https://twitter.com/way_adventurer"
+          aria-label="twitter"
+          
+
+          
+            target="_blank"
+            
+          
+
+          
+
+          
+            rel="noopener noreferrer"
+          
+        >
+          <i class="fa-brands fa-x-twitter"></i>
+        </a>
+      
+    
+      
+
+      
+        <a
+          href="javascript:location.href = 'mailto:' + ['2992850181','qq.com'].join('@')"
+          aria-label="email"
+          
+
+          
+
+          
+
+          
+        >
+          <i class="fas fa-envelope"></i>
+        </a>
+      
+    
+      
+
+      
+        <a
+          href="/feed.xml"
+          aria-label="rss"
+          
+
+          
+
+          
+
+          
+        >
+          <i class="fas fa-rss"></i>
+        </a>
+      
+    
+  </div>
+  <!-- .sidebar-bottom -->
+</aside>
+<!-- #sidebar -->
+
+
+    <div id="main-wrapper" class="d-flex justify-content-center">
+      <div class="container d-flex flex-column px-xxl-5">
+        <!-- The Top Bar -->
+
+<header id="topbar-wrapper" aria-label="Top Bar">
+  <div
+    id="topbar"
+    class="d-flex align-items-center justify-content-between px-lg-3 h-100"
+  >
+    <nav id="breadcrumb" aria-label="Breadcrumb">
+      
+
+      
+        
+          
+            <span>
+              <a href="/">Home</a>
+            </span>
+
+          
+        
+          
+            <span>
+              <a href="/categories/">Categories</a>
+            </span>
+          
+        
+          
+            
+              <span>Demo</span>
+            
+
+          
+        
+      
+    </nav>
+    <!-- endof #breadcrumb -->
+
+    <button type="button" id="sidebar-trigger" class="btn btn-link">
+      <i class="fas fa-bars fa-fw"></i>
+    </button>
+
+    <div id="topbar-title">
+      Category
+    </div>
+
+    <button type="button" id="search-trigger" class="btn btn-link">
+      <i class="fas fa-search fa-fw"></i>
+    </button>
+
+    <search id="search" class="align-items-center ms-3 ms-lg-0">
+      <i class="fas fa-search fa-fw"></i>
+      <input
+        class="form-control"
+        id="search-input"
+        type="search"
+        aria-label="search"
+        autocomplete="off"
+        placeholder="Search..."
+      >
+    </search>
+    <button type="button" class="btn btn-link text-decoration-none" id="search-cancel">Cancel</button>
+  </div>
+</header>
+
+
+        <div class="row flex-grow-1">
+          <main aria-label="Main Content" class="col-12 col-lg-11 col-xl-9 px-md-4">
+            
+              
+
+
+
+<article class="px-1">
+  
+    
+
+
+
+<div id="page-category">
+  <h1 class="ps-lg-2">
+    <i class="far fa-folder-open fa-fw text-muted"></i>
+    Demo
+    <span class="lead text-muted ps-2">1</span>
+  </h1>
+
+  <ul class="content ps-0">
+    
+      <li class="d-flex justify-content-between px-md-3">
+        <a href="/posts/text-and-typography/">Text and Typography</a>
+        <span class="dash flex-grow-1"></span>
+        <!--
+  Date format snippet
+  See: ${JS_ROOT}/utils/locale-dateime.js
+-->
+
+
+
+
+<time
+  
+    class="text-muted small text-nowrap"
+  
+  data-ts="1565235180"
+  data-df="ll"
+  
+>
+  Aug  8, 2019
+</time>
+
+      </li>
+    
+  </ul>
+</div>
+
+  
+</article>
+
+            
+          </main>
+
+          <!-- panel -->
+          <aside aria-label="Panel" id="panel-wrapper" class="col-xl-3 ps-2 text-muted">
+            <div class="access">
+              <!-- Get 5 last posted/updated posts -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  <section id="access-lastmod">
+    <h2 class="panel-heading">Recently Updated</h2>
+    <ul class="content list-unstyled ps-0 pb-1 ms-1 mt-2">
+      
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/write-a-new-post/">Writing a New Post</a>
+        </li>
+      
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
+    </ul>
+  </section>
+  <!-- #access-lastmod -->
+
+
+              <!-- The trending tags list -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+    
+    
+    
+    
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
+      
+        
+        
+
+
+
+  <section>
+    <h2 class="panel-heading">Trending Tags</h2>
+    <div class="d-flex flex-wrap mt-3 mb-1 me-3">
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
+      
+    </div>
+  </section>
+
+
+            </div>
+
+            
+          </aside>
+        </div>
+
+        <div class="row">
+          <!-- tail -->
+          <div id="tail-wrapper" class="col-12 col-lg-11 col-xl-9 px-md-4">
+            
+
+            <!-- The Footer -->
+
+<footer
+  aria-label="Site Info"
+  class="
+    d-flex flex-column justify-content-center text-muted
+    flex-lg-row justify-content-lg-between align-items-lg-center pb-lg-3
+  "
+>
+  <p>©
+    <time>2025</time>
+
+    
+      <a href="https://twitter.com/way_adventurer">WenQi Wei</a>.
+    
+
+    
+      <span
+        data-bs-toggle="tooltip"
+        data-bs-placement="top"
+        title="Except where otherwise noted, the blog posts on this site are licensed under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author."
+      >Some rights reserved.</span>
+    
+  </p>
+
+  <!-- 站点统计 -->
+  <p> 
+    <!-- 不蒜子站点统计，放在页脚处 (footer.html 中插入) -->
+<script async src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
+<i class="fa fa-user" aria-hidden="true"></i> <span id="busuanzi_value_site_uv"></span> |
+<i class="fa fa-eye" aria-hidden="true"></i> <span id="busuanzi_value_site_pv"></span>
+  </p>
+
+  <p>Using the <a
+        data-bs-toggle="tooltip"
+        data-bs-placement="top"
+        title="v7.2.4"
+        href="https://github.com/cotes2020/jekyll-theme-chirpy"
+        target="_blank"
+        rel="noopener"
+      >Chirpy</a> theme for <a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a>.
+  </p>
+</footer>
+
+          </div>
+        </div>
+
+        <!-- The Search results -->
+
+<div id="search-result-wrapper" class="d-flex justify-content-center d-none">
+  <div class="col-11 content">
+    <div id="search-hints">
+      <!-- The trending tags list -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+    
+    
+    
+    
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
+      
+        
+        
+
+
+
+  <section>
+    <h2 class="panel-heading">Trending Tags</h2>
+    <div class="d-flex flex-wrap mt-3 mb-1 me-3">
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
+      
+    </div>
+  </section>
+
+
+    </div>
+    <div id="search-results" class="d-flex flex-wrap justify-content-center text-muted mt-3"></div>
+  </div>
+</div>
+
+      </div>
+
+      <aside aria-label="Scroll to Top">
+        <button id="back-to-top" type="button" class="btn btn-lg btn-box-shadow">
+          <i class="fas fa-angle-up"></i>
+        </button>
+      </aside>
+    </div>
+
+    <div id="mask" class="d-none position-fixed w-100 h-100 z-1"></div>
+
+    
+      <aside
+  id="notification"
+  class="toast"
+  role="alert"
+  aria-live="assertive"
+  aria-atomic="true"
+  data-bs-animation="true"
+  data-bs-autohide="false"
+>
+  <div class="toast-header">
+    <button
+      type="button"
+      class="btn-close ms-auto"
+      data-bs-dismiss="toast"
+      aria-label="Close"
+    ></button>
+  </div>
+  <div class="toast-body text-center pt-0">
+    <p class="px-2 mb-3">A new version of content is available.</p>
+    <button type="button" class="btn btn-primary" aria-label="Update">
+      Update
+    </button>
+  </div>
+</aside>
+
+    
+
+    <!-- Embedded scripts -->
+
+    
+
+    <!--
+  Jekyll Simple Search loader
+  See: <https://github.com/christian-fei/Simple-Jekyll-Search>
+-->
+
+
+
+
+
+<script>
+  
+  document.addEventListener('DOMContentLoaded', () => {
+    SimpleJekyllSearch({
+      searchInput: document.getElementById('search-input'),
+      resultsContainer: document.getElementById('search-results'),
+      json: '/assets/js/data/search.json',
+      searchResultTemplate: '  <article class="px-1 px-sm-2 px-lg-4 px-xl-0">    <header>      <h2><a href="{url}">{title}</a></h2>      <div class="post-meta d-flex flex-column flex-sm-row text-muted mt-1 mb-1">        {categories}        {tags}      </div>    </header>    <p>{snippet}</p>  </article>',
+      noResultsText: '<p class="mt-5">Oops! No results found.</p>',
+      templateMiddleware: function(prop, value, template) {
+        if (prop === 'categories') {
+          if (value === '') {
+            return `${value}`;
+          } else {
+            return `<div class="me-sm-4"><i class="far fa-folder fa-fw"></i>${value}</div>`;
+          }
+        }
+
+        if (prop === 'tags') {
+          if (value === '') {
+            return `${value}`;
+          } else {
+            return `<div><i class="fa fa-tag fa-fw"></i>${value}</div>`;
+          }
+        }
+      }
+    });
+  });
+</script>
+
+  </body>
+</html>
+
diff --git a/_site/categories/index.html b/_site/categories/index.html
index 9663de5..575ae2e 100644
--- a/_site/categories/index.html
+++ b/_site/categories/index.html
@@ -93,12 +93,12 @@
 <meta property="og:url" content="https://way.ember.ac.cn/categories/" />
 <meta property="og:site_name" content="WenQi Wei" />
 <meta property="og:type" content="article" />
-<meta property="article:published_time" content="2025-03-18T20:47:34+08:00" />
+<meta property="article:published_time" content="2025-03-18T21:10:43+08:00" />
 <meta name="twitter:card" content="summary" />
 <meta property="twitter:title" content="Categories" />
 <meta name="twitter:site" content="@way_adventurer" />
 <script type="application/ld+json">
-{"@context":"https://schema.org","@type":"BlogPosting","dateModified":"2025-03-18T20:47:34+08:00","datePublished":"2025-03-18T20:47:34+08:00","description":"这里是，way的世界！welcome！","headline":"Categories","mainEntityOfPage":{"@type":"WebPage","@id":"https://way.ember.ac.cn/categories/"},"url":"https://way.ember.ac.cn/categories/"}</script>
+{"@context":"https://schema.org","@type":"BlogPosting","dateModified":"2025-03-18T21:10:43+08:00","datePublished":"2025-03-18T21:10:43+08:00","description":"这里是，way的世界！welcome！","headline":"Categories","mainEntityOfPage":{"@type":"WebPage","@id":"https://way.ember.ac.cn/categories/"},"url":"https://way.ember.ac.cn/categories/"}</script>
 <!-- End Jekyll SEO tag -->
 
 
@@ -511,16 +511,16 @@
           
           <span class="text-muted small font-weight-light">
             
-              1
+              2
               
-                category
+                categories
               ,
             
 
-            1
+            2
 
             
-              post
+              posts
             
           </span>
         </span>
@@ -549,6 +549,22 @@
                 <i class="far fa-folder fa-fw"></i>
 
                 
+                <a href="/categories/demo/" class="mx-2">Demo</a>
+
+                
+                <span class="text-muted small font-weight-light">
+                  1
+
+                  
+                    post
+                  
+                </span>
+              </li>
+            
+              <li class="list-group-item">
+                <i class="far fa-folder fa-fw"></i>
+
+                
                 <a href="/categories/tutorial/" class="mx-2">Tutorial</a>
 
                 
@@ -576,6 +592,12 @@
 
   
 
+  
+  
+  
+
+  
+
 
     </div>
   
@@ -613,6 +635,13 @@
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -639,6 +668,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -650,6 +695,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -740,6 +788,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -751,6 +815,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
diff --git a/_site/categories/tutorial/index.html b/_site/categories/tutorial/index.html
index 2769475..5dde3c9 100644
--- a/_site/categories/tutorial/index.html
+++ b/_site/categories/tutorial/index.html
@@ -573,6 +573,13 @@
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -599,6 +606,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -610,6 +633,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -700,6 +726,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -711,6 +753,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
diff --git a/_site/feed.xml b/_site/feed.xml
index 4a69ad7..68ca57a 100644
--- a/_site/feed.xml
+++ b/_site/feed.xml
@@ -4,7 +4,7 @@
   <id>https://way.ember.ac.cn/</id>
   <title>WenQi Wei</title>
   <subtitle>这里是，way的世界！welcome！</subtitle>
-  <updated>2025-03-18T20:47:34+08:00</updated>
+  <updated>2025-03-18T21:10:43+08:00</updated>
   <author>
     <name>WenQi Wei</name>
     <uri>https://way.ember.ac.cn/</uri>
@@ -48,6 +48,32 @@ Create a new file named YYYY-MM-DD-TITLE.EXTENSION and put it in the _posts of t
 
   </entry>
 
+  
+  <entry>
+    <title>Text and Typography</title>
+    <link href="https://way.ember.ac.cn/posts/text-and-typography/" rel="alternate" type="text/html" title="Text and Typography" />
+    <published>2019-08-08T11:33:00+08:00</published>
+  
+    <updated>2019-08-08T11:33:00+08:00</updated>
+  
+    <id>https://way.ember.ac.cn/posts/text-and-typography/</id>
+    <content type="text/html" src="https://way.ember.ac.cn/posts/text-and-typography/" />
+    <author>
+      <name>cotes</name>
+    </author>
+
+  
+    
+    <category term="Blogging" />
+    
+    <category term="Demo" />
+    
+  
+
+  <summary>Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more.</summary>
+
+  </entry>
+
 </feed>
 
 
diff --git a/_site/index.html b/_site/index.html
index 18de9f6..c93b604 100644
--- a/_site/index.html
+++ b/_site/index.html
@@ -515,6 +515,90 @@
 
 
 
+  
+  
+
+  
+    
+      
+      
+    
+
+    
+    
+
+    
+
+    
+    
+
+    
+    
+    
+
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+
+    <!-- take out classes -->
+    
+
+    
+    
+
+    
+
+    
+      
+      
+
+      
+
+      <!-- add image placeholder -->
+      
+
+    
+
+    <!-- lazy-load images -->
+    
+
+    
+      <!-- create the image wrapper -->
+      
+
+      
+      
+
+    
+
+    <!-- combine -->
+    
+  
+
+  
+
 
 <!-- Add header for code snippets -->
 
@@ -574,6 +658,82 @@
 
 <div id="post-list" class="flex-grow-1 px-xl-1">
   
+    <article class="card-wrapper card">
+      <a href="/posts/text-and-typography/" class="post-preview row g-0 flex-md-row-reverse">
+        
+
+        
+          
+          
+
+          
+
+          
+
+          
+
+          <div class="col-md-5">
+            <div class="preview-img  blur"><img data-src="/commons/devices-mockup.png" alt="Responsive rendering of Chirpy theme on multiple devices." data-lqip="true" src="data:image/webp;base64,UklGRpoAAABXRUJQVlA4WAoAAAAQAAAADwAABwAAQUxQSDIAAAARL0AmbZurmr57yyIiqE8oiG0bejIYEQTgqiDA9vqnsUSI6H+oAERp2HZ65qP/VIAWAFZQOCBCAAAA8AEAnQEqEAAIAAVAfCWkAALp8sF8rgRgAP7o9FDvMCkMde9PK7euH5M1m6VWoDXf2FkP3BqV0ZYbO6NA/VFIAAAA"></div>
+          </div>
+
+          
+        
+
+        <div class="col-md-7">
+          <div class="card-body d-flex flex-column">
+            <h1 class="card-title my-2 mt-md-0">Text and Typography</h1>
+
+            <div class="card-text content mt-0 mb-3">
+              <p>Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more.</p>
+            </div>
+
+            <div class="post-meta flex-grow-1 d-flex align-items-end">
+              <div class="me-auto">
+                <!-- posted date -->
+                <i class="far fa-calendar fa-fw me-1"></i>
+                <!--
+  Date format snippet
+  See: ${JS_ROOT}/utils/locale-dateime.js
+-->
+
+
+
+
+<time
+  
+  data-ts="1565235180"
+  data-df="ll"
+  
+>
+  Aug  8, 2019
+</time>
+
+
+                <!-- categories -->
+                
+                  <i class="far fa-folder-open fa-fw me-1"></i>
+                  <span class="categories">
+                    
+                      Blogging,
+                      Demo
+                  </span>
+                
+              </div>
+
+              
+                <div class="pin ms-1">
+                  <i class="fas fa-thumbtack fa-fw"></i>
+                  <span></span>
+                </div>
+              
+            </div>
+            <!-- .post-meta -->
+          </div>
+          <!-- .card-body -->
+        </div>
+      </a>
+    </article>
+  
     <article class="card-wrapper card">
       <a href="/posts/write-a-new-post/" class="post-preview row g-0 flex-md-row-reverse">
         
@@ -670,6 +830,13 @@ Naming and...</p>
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -696,6 +863,22 @@ Naming and...</p>
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -707,6 +890,9 @@ Naming and...</p>
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -797,6 +983,22 @@ Naming and...</p>
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -808,6 +1010,9 @@ Naming and...</p>
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
diff --git a/_site/posts/text-and-typography/index.html b/_site/posts/text-and-typography/index.html
new file mode 100644
index 0000000..a5e097b
--- /dev/null
+++ b/_site/posts/text-and-typography/index.html
@@ -0,0 +1,2488 @@
+<!doctype html>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  <div id="animation">
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+  </div>
+
+
+<!-- `site.alt_lang` can specify a language different from the UI -->
+<html lang="en" >
+  <head>
+  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+  <meta name="theme-color" media="(prefers-color-scheme: light)" content="#f7f7f7">
+  <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#1b1b1e">
+  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+  <meta
+    name="viewport"
+    content="width=device-width, user-scalable=no initial-scale=1, shrink-to-fit=no, viewport-fit=cover"
+  ><!-- Setup Open Graph image -->
+
+  
+
+  <!-- Begin Jekyll SEO tag v2.8.0 -->
+<meta name="generator" content="Jekyll v4.4.1" />
+<meta property="og:title" content="Text and Typography" />
+<meta name="author" content="cotes" />
+<meta property="og:locale" content="en" />
+<meta name="description" content="Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more." />
+<meta property="og:description" content="Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more." />
+<link rel="canonical" href="https://way.ember.ac.cn/posts/text-and-typography/" />
+<meta property="og:url" content="https://way.ember.ac.cn/posts/text-and-typography/" />
+<meta property="og:site_name" content="WenQi Wei" />
+<meta property="og:image" content="https://way.ember.ac.cn/commons/devices-mockup.png" />
+<meta property="og:image:alt" content="Responsive rendering of Chirpy theme on multiple devices." />
+<meta property="og:type" content="article" />
+<meta property="article:published_time" content="2019-08-08T11:33:00+08:00" />
+<meta name="twitter:card" content="summary_large_image" />
+<meta property="twitter:image" content="https://way.ember.ac.cn/commons/devices-mockup.png" />
+<meta name="twitter:image:alt" content="Responsive rendering of Chirpy theme on multiple devices." />
+<meta property="twitter:title" content="Text and Typography" />
+<meta name="twitter:site" content="@way_adventurer" />
+<meta name="twitter:creator" content="@cotes" />
+<script type="application/ld+json">
+{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"cotes"},"dateModified":"2019-08-08T11:33:00+08:00","datePublished":"2019-08-08T11:33:00+08:00","description":"Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more.","headline":"Text and Typography","image":{"lqip":"data:image/webp;base64,UklGRpoAAABXRUJQVlA4WAoAAAAQAAAADwAABwAAQUxQSDIAAAARL0AmbZurmr57yyIiqE8oiG0bejIYEQTgqiDA9vqnsUSI6H+oAERp2HZ65qP/VIAWAFZQOCBCAAAA8AEAnQEqEAAIAAVAfCWkAALp8sF8rgRgAP7o9FDvMCkMde9PK7euH5M1m6VWoDXf2FkP3BqV0ZYbO6NA/VFIAAAA","alt":"Responsive rendering of Chirpy theme on multiple devices.","url":"https://way.ember.ac.cn/commons/devices-mockup.png","@type":"imageObject"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://way.ember.ac.cn/posts/text-and-typography/"},"url":"https://way.ember.ac.cn/posts/text-and-typography/"}</script>
+<!-- End Jekyll SEO tag -->
+
+
+  <title>Text and Typography | WenQi Wei
+  </title>
+
+  <!--
+  The Favicons for Web, Android, Microsoft, and iOS (iPhone and iPad) Apps
+  Generated by: https://realfavicongenerator.net/
+-->
+
+
+
+<link rel="apple-touch-icon" sizes="180x180" href="/assets/img/favicons/apple-touch-icon.png">
+<link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicons/favicon-32x32.png">
+<link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicons/favicon-16x16.png">
+
+  <link rel="manifest" href="/assets/img/favicons/site.webmanifest">
+
+<link rel="shortcut icon" href="/assets/img/favicons/favicon.ico">
+<meta name="apple-mobile-web-app-title" content="WenQi Wei">
+<meta name="application-name" content="WenQi Wei">
+<meta name="msapplication-TileColor" content="#da532c">
+<meta name="msapplication-config" content="/assets/img/favicons/browserconfig.xml">
+<meta name="theme-color" content="#ffffff">
+
+
+  <!-- Resource Hints -->
+  
+    
+      
+        <link rel="preconnect" href="https://fonts.googleapis.com" >
+      
+        <link rel="dns-prefetch" href="https://fonts.googleapis.com" >
+      
+    
+      
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+      
+        <link rel="dns-prefetch" href="https://fonts.gstatic.com" >
+      
+    
+      
+        <link rel="preconnect" href="https://cdn.jsdelivr.net" >
+      
+        <link rel="dns-prefetch" href="https://cdn.jsdelivr.net" >
+      
+    
+  
+
+  <!-- Bootstrap -->
+  
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css">
+  
+
+  <!-- Theme style -->
+  <link rel="stylesheet" href="/assets/css/jekyll-theme-chirpy.css">
+
+  <!-- Web Font -->
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400&family=Source+Sans+Pro:wght@400;600;700;900&display=swap">
+
+  <!-- Font Awesome Icons -->
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.7.1/css/all.min.css">
+
+  <!-- 3rd-party Dependencies -->
+
+  
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/tocbot@4.32.2/dist/tocbot.min.css">
+  
+
+  
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/loading-attribute-polyfill@2.1.1/dist/loading-attribute-polyfill.min.css">
+  
+
+  
+    <!-- Image Popup -->
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/glightbox@3.3.0/dist/css/glightbox.min.css">
+  
+
+  <!-- Scripts -->
+
+  <script src="/assets/js/dist/theme.min.js"></script>
+
+  <!-- JS selector for site. -->
+
+<!-- commons -->
+
+
+
+<!-- layout specified -->
+
+
+  
+
+  
+    <!-- image lazy-loading & popup & clipboard -->
+    
+  
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+
+
+  <script defer src="https://cdn.jsdelivr.net/combine/npm/simple-jekyll-search@1.10.0/dest/simple-jekyll-search.min.js,npm/loading-attribute-polyfill@2.1.1/dist/loading-attribute-polyfill.umd.min.js,npm/glightbox@3.3.0/dist/js/glightbox.min.js,npm/clipboard@2.0.11/dist/clipboard.min.js,npm/dayjs@1.11.13/dayjs.min.js,npm/dayjs@1.11.13/locale/en.js,npm/dayjs@1.11.13/plugin/relativeTime.js,npm/dayjs@1.11.13/plugin/localizedFormat.js,npm/tocbot@4.32.2/dist/tocbot.min.js,npm/mermaid@11.4.0/dist/mermaid.min.js"></script>
+
+
+
+
+
+
+
+<script defer src="/assets/js/dist/post.min.js"></script>
+
+
+  <!-- MathJax -->
+  <script async src="/assets/js/data/mathjax.js"></script>
+  <script async src="https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?features=es6"></script>
+  <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3.2.2/es5/tex-chtml.js"></script>
+
+
+<!-- Pageviews -->
+
+  
+
+  
+
+
+
+  
+
+  <!-- A placeholder to allow defining custom metadata -->
+
+</head>
+
+
+  <body>
+    <!-- The Side Bar -->
+
+<aside aria-label="Sidebar" id="sidebar" class="d-flex flex-column align-items-end">
+  <header class="profile-wrapper">
+    <a href="/" id="avatar" class="rounded-circle"><img src="/assets/img/avatar.jpg" width="112" height="112" alt="avatar" onerror="this.style.display='none'"></a>
+
+    <a class="site-title d-block" href="/">WenQi Wei</a>
+    <p class="site-subtitle fst-italic mb-0">Show me the code</p>
+  </header>
+  <!-- .profile-wrapper -->
+
+  <nav class="flex-column flex-grow-1 w-100 ps-0">
+    <ul class="nav">
+      <!-- home -->
+      <li class="nav-item">
+        <a href="/" class="nav-link">
+          <i class="fa-fw fas fa-home"></i>
+          <span>HOME</span>
+        </a>
+      </li>
+      <!-- the real tabs -->
+      
+        <li class="nav-item">
+          <a href="/categories/" class="nav-link">
+            <i class="fa-fw fas fa-stream"></i>
+            
+
+            <span>CATEGORIES</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+        <li class="nav-item">
+          <a href="/tags/" class="nav-link">
+            <i class="fa-fw fas fa-tags"></i>
+            
+
+            <span>TAGS</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+        <li class="nav-item">
+          <a href="/archives/" class="nav-link">
+            <i class="fa-fw fas fa-archive"></i>
+            
+
+            <span>ARCHIVES</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+        <li class="nav-item">
+          <a href="/about/" class="nav-link">
+            <i class="fa-fw fas fa-info-circle"></i>
+            
+
+            <span>ABOUT</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+    </ul>
+  </nav>
+
+  <div class="sidebar-bottom d-flex flex-wrap  align-items-center w-100">
+    
+      <button type="button" class="btn btn-link nav-link" aria-label="Switch Mode" id="mode-toggle">
+        <i class="fas fa-adjust"></i>
+      </button>
+
+      
+        <span class="icon-border"></span>
+      
+    
+
+    
+      
+
+      
+        <a
+          href="https://github.com/WAY-ADVENTURER"
+          aria-label="github"
+          
+
+          
+            target="_blank"
+            
+          
+
+          
+
+          
+            rel="noopener noreferrer"
+          
+        >
+          <i class="fab fa-github"></i>
+        </a>
+      
+    
+      
+
+      
+        <a
+          href="https://twitter.com/way_adventurer"
+          aria-label="twitter"
+          
+
+          
+            target="_blank"
+            
+          
+
+          
+
+          
+            rel="noopener noreferrer"
+          
+        >
+          <i class="fa-brands fa-x-twitter"></i>
+        </a>
+      
+    
+      
+
+      
+        <a
+          href="javascript:location.href = 'mailto:' + ['2992850181','qq.com'].join('@')"
+          aria-label="email"
+          
+
+          
+
+          
+
+          
+        >
+          <i class="fas fa-envelope"></i>
+        </a>
+      
+    
+      
+
+      
+        <a
+          href="/feed.xml"
+          aria-label="rss"
+          
+
+          
+
+          
+
+          
+        >
+          <i class="fas fa-rss"></i>
+        </a>
+      
+    
+  </div>
+  <!-- .sidebar-bottom -->
+</aside>
+<!-- #sidebar -->
+
+
+    <div id="main-wrapper" class="d-flex justify-content-center">
+      <div class="container d-flex flex-column px-xxl-5">
+        <!-- The Top Bar -->
+
+<header id="topbar-wrapper" aria-label="Top Bar">
+  <div
+    id="topbar"
+    class="d-flex align-items-center justify-content-between px-lg-3 h-100"
+  >
+    <nav id="breadcrumb" aria-label="Breadcrumb">
+      
+
+      
+        
+          
+            <span>
+              <a href="/">Home</a>
+            </span>
+
+          
+        
+          
+        
+          
+            
+              <span>Text and Typography</span>
+            
+
+          
+        
+      
+    </nav>
+    <!-- endof #breadcrumb -->
+
+    <button type="button" id="sidebar-trigger" class="btn btn-link">
+      <i class="fas fa-bars fa-fw"></i>
+    </button>
+
+    <div id="topbar-title">
+      Post
+    </div>
+
+    <button type="button" id="search-trigger" class="btn btn-link">
+      <i class="fas fa-search fa-fw"></i>
+    </button>
+
+    <search id="search" class="align-items-center ms-3 ms-lg-0">
+      <i class="fas fa-search fa-fw"></i>
+      <input
+        class="form-control"
+        id="search-input"
+        type="search"
+        aria-label="search"
+        autocomplete="off"
+        placeholder="Search..."
+      >
+    </search>
+    <button type="button" class="btn btn-link text-decoration-none" id="search-cancel">Cancel</button>
+  </div>
+</header>
+
+
+        <div class="row flex-grow-1">
+          <main aria-label="Main Content" class="col-12 col-lg-11 col-xl-9 px-md-4">
+            
+              <!-- Refactor the HTML structure -->
+
+
+
+<!--
+  In order to allow a wide table to scroll horizontally,
+  we suround the markdown table with `<div class="table-wrapper">` and `</div>`
+-->
+
+
+
+<!--
+  Fixed kramdown code highlight rendering:
+  https://github.com/penibelst/jekyll-compress-html/issues/101
+  https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901
+-->
+
+
+
+<!-- Change the icon of checkbox -->
+
+
+
+<!-- Handle images -->
+
+
+
+
+  
+  
+
+  
+    
+      
+      
+    
+
+    
+    
+
+    
+
+    
+    
+
+    
+    
+    
+
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+
+    <!-- take out classes -->
+    
+
+    
+    
+
+    
+
+    
+      
+      
+
+      
+
+      <!-- add image placeholder -->
+      
+
+    
+
+    <!-- lazy-load images -->
+    
+
+    
+      <!-- make sure the `<img>` is wrapped by `<a>` -->
+      
+
+      
+        <!-- create the image wrapper -->
+        
+
+        
+        
+      
+    
+
+    <!-- combine -->
+    
+  
+    
+
+    
+    
+
+    
+
+    
+    
+
+    
+    
+    
+
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+
+    <!-- take out classes -->
+    
+
+    
+    
+
+    
+
+    
+      
+    
+
+    <!-- lazy-load images -->
+    
+
+    
+      <!-- make sure the `<img>` is wrapped by `<a>` -->
+      
+
+      
+        <!-- create the image wrapper -->
+        
+
+        
+        
+      
+    
+
+    <!-- combine -->
+    
+  
+    
+
+    
+    
+
+    
+
+    
+    
+
+    
+    
+    
+
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+
+    <!-- take out classes -->
+    
+
+    
+    
+
+    
+
+    
+      
+    
+
+    <!-- lazy-load images -->
+    
+
+    
+      <!-- make sure the `<img>` is wrapped by `<a>` -->
+      
+
+      
+        <!-- create the image wrapper -->
+        
+
+        
+        
+      
+    
+
+    <!-- combine -->
+    
+  
+    
+
+    
+    
+
+    
+
+    
+    
+
+    
+    
+    
+
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+
+    <!-- take out classes -->
+    
+
+    
+    
+
+    
+
+    
+      
+    
+
+    <!-- lazy-load images -->
+    
+
+    
+      <!-- make sure the `<img>` is wrapped by `<a>` -->
+      
+
+      
+        <!-- create the image wrapper -->
+        
+
+        
+        
+      
+    
+
+    <!-- combine -->
+    
+  
+    
+
+    
+    
+
+    
+
+    
+    
+
+    
+    
+    
+
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+
+    <!-- take out classes -->
+    
+
+    
+    
+
+    
+
+    
+      
+    
+
+    <!-- lazy-load images -->
+    
+
+    
+      <!-- make sure the `<img>` is wrapped by `<a>` -->
+      
+
+      
+        <!-- create the image wrapper -->
+        
+
+        
+        
+      
+    
+
+    <!-- combine -->
+    
+  
+    
+
+    
+    
+
+    
+
+    
+    
+
+    
+    
+    
+
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+
+    <!-- take out classes -->
+    
+
+    
+    
+
+    
+
+    
+      
+    
+
+    <!-- lazy-load images -->
+    
+
+    
+      <!-- make sure the `<img>` is wrapped by `<a>` -->
+      
+
+      
+        <!-- create the image wrapper -->
+        
+
+        
+        
+      
+    
+
+    <!-- combine -->
+    
+  
+    
+
+    
+    
+
+    
+
+    
+    
+
+    
+    
+    
+
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+      
+
+      
+    
+
+    <!-- take out classes -->
+    
+
+    
+    
+
+    
+
+    
+      
+    
+
+    <!-- lazy-load images -->
+    
+
+    
+      <!-- make sure the `<img>` is wrapped by `<a>` -->
+      
+
+      
+        <!-- create the image wrapper -->
+        
+
+        
+        
+      
+    
+
+    <!-- combine -->
+    
+  
+
+  
+
+
+<!-- Add header for code snippets -->
+
+
+
+<!-- Create heading anchors -->
+
+
+
+
+
+  
+  
+
+  
+    
+    
+
+    
+      
+        
+        
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+
+    
+  
+
+  
+  
+
+  
+    
+    
+
+    
+      
+        
+        
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+      
+
+      
+      
+
+      
+      
+      
+
+      
+    
+
+    
+  
+
+  
+  
+
+  
+
+  
+  
+
+  
+
+
+
+
+<!-- return -->
+
+
+
+
+
+
+
+
+
+
+<article class="px-1" data-toc="true">
+  <header>
+    <h1 data-toc-skip>Text and Typography</h1>
+    
+      <p class="post-desc fw-light mb-4">Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more.</p>
+    
+
+    <div class="post-meta text-muted">
+      <!-- published date -->
+      <span>
+        Posted
+        <!--
+  Date format snippet
+  See: ${JS_ROOT}/utils/locale-dateime.js
+-->
+
+
+
+
+<time
+  
+  data-ts="1565235180"
+  data-df="ll"
+  
+    data-bs-toggle="tooltip" data-bs-placement="bottom"
+  
+>
+  Aug  8, 2019
+</time>
+
+      </span>
+
+      <!-- lastmod date -->
+      
+
+      
+        
+        
+        
+
+        
+
+        <div class="mt-3 mb-3">
+          <a href="/commons/devices-mockup.png" class="popup img-link preview-img blur"><img data-src="/commons/devices-mockup.png"  alt="Responsive rendering of Chirpy theme on multiple devices." width="1200" height="630" data-lqip="true" src="data:image/webp;base64,UklGRpoAAABXRUJQVlA4WAoAAAAQAAAADwAABwAAQUxQSDIAAAARL0AmbZurmr57yyIiqE8oiG0bejIYEQTgqiDA9vqnsUSI6H+oAERp2HZ65qP/VIAWAFZQOCBCAAAA8AEAnQEqEAAIAAVAfCWkAALp8sF8rgRgAP7o9FDvMCkMde9PK7euH5M1m6VWoDXf2FkP3BqV0ZYbO6NA/VFIAAAA"></a><figcaption class="text-center pt-2 pb-2">Responsive rendering of Chirpy theme on multiple devices.</figcaption></div>
+      
+
+      <div class="d-flex justify-content-between">
+        <!-- author(s) -->
+        <span>
+          
+
+          By
+
+          <em>
+            
+              
+                
+                
+              
+            
+          </em>
+        </span>
+
+        <div>
+          <!-- pageviews -->
+          
+
+          <!-- read time -->
+          <!-- Calculate the post's reading time, and display the word count in tooltip -->
+
+
+
+<!-- words per minute -->
+
+
+
+
+
+
+
+
+
+
+<!-- return element -->
+<span
+  class="readtime"
+  data-bs-toggle="tooltip"
+  data-bs-placement="bottom"
+  title="592 words"
+>
+  <em>3 min</em> read</span>
+
+        </div>
+      </div>
+    </div>
+  </header>
+
+  
+    <div id="toc-bar" class="d-flex align-items-center justify-content-between invisible">
+      <span class="label text-truncate">Text and Typography</span>
+      <button type="button" class="toc-trigger btn me-1">
+        <i class="fa-solid fa-list-ul fa-fw"></i>
+      </button>
+    </div>
+
+    <button id="toc-solo-trigger" type="button" class="toc-trigger btn btn-outline-secondary btn-sm">
+      <span class="label ps-2 pe-1">Contents</span>
+      <i class="fa-solid fa-angle-right fa-fw"></i>
+    </button>
+
+    <dialog id="toc-popup" class="p-0">
+      <div class="header d-flex flex-row align-items-center justify-content-between">
+        <div class="label text-truncate py-2 ms-4">Text and Typography</div>
+        <button id="toc-popup-close" type="button" class="btn mx-1 my-1 opacity-75">
+          <i class="fas fa-close"></i>
+        </button>
+      </div>
+      <div id="toc-popup-content" class="px-4 py-3 pb-4"></div>
+    </dialog>
+  
+
+  <div class="content">
+    <h2 id="headings"><span class="me-2">Headings</span><a href="#headings" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<!-- markdownlint-capture -->
+<!-- markdownlint-disable -->
+<h1 class="mt-4 mb-0" id="h1--heading">H1 — heading</h1>
+
+<h2 data-toc-skip="" class="mt-4 mb-0" id="h2--heading">H2 — heading</h2>
+
+<h3 data-toc-skip="" class="mt-4 mb-0" id="h3--heading">H3 — heading</h3>
+
+<h4 data-toc-skip="" class="mt-4" id="h4--heading">H4 — heading</h4>
+<!-- markdownlint-restore -->
+
+<h2 id="paragraph"><span class="me-2">Paragraph</span><a href="#paragraph" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<p>Quisque egestas convallis ipsum, ut sollicitudin risus tincidunt a. Maecenas interdum malesuada egestas. Duis consectetur porta risus, sit amet vulputate urna facilisis ac. Phasellus semper dui non purus ultrices sodales. Aliquam ante lorem, ornare a feugiat ac, finibus nec mauris. Vivamus ut tristique nisi. Sed vel leo vulputate, efficitur risus non, posuere mi. Nullam tincidunt bibendum rutrum. Proin commodo ornare sapien. Vivamus interdum diam sed sapien blandit, sit amet aliquam risus mattis. Nullam arcu turpis, mollis quis laoreet at, placerat id nibh. Suspendisse venenatis eros eros.</p>
+
+<h2 id="lists"><span class="me-2">Lists</span><a href="#lists" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<h3 id="ordered-list"><span class="me-2">Ordered list</span><a href="#ordered-list" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<ol>
+  <li>Firstly</li>
+  <li>Secondly</li>
+  <li>Thirdly</li>
+</ol>
+
+<h3 id="unordered-list"><span class="me-2">Unordered list</span><a href="#unordered-list" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<ul>
+  <li>Chapter
+    <ul>
+      <li>Section
+        <ul>
+          <li>Paragraph</li>
+        </ul>
+      </li>
+    </ul>
+  </li>
+</ul>
+
+<h3 id="todo-list"><span class="me-2">ToDo list</span><a href="#todo-list" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<ul class="task-list">
+  <li class="task-list-item"><i class="far fa-circle fa-fw"></i>Job
+    <ul class="task-list">
+      <li class="task-list-item"><i class="fas fa-check-circle fa-fw checked"></i>Step 1</li>
+      <li class="task-list-item"><i class="fas fa-check-circle fa-fw checked"></i>Step 2</li>
+      <li class="task-list-item"><i class="far fa-circle fa-fw"></i>Step 3</li>
+    </ul>
+  </li>
+</ul>
+
+<h3 id="description-list"><span class="me-2">Description list</span><a href="#description-list" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<dl>
+  <dt>Sun</dt>
+  <dd>the star around which the earth orbits</dd>
+  <dt>Moon</dt>
+  <dd>the natural satellite of the earth, visible by reflected light from the sun</dd>
+</dl>
+
+<h2 id="block-quote"><span class="me-2">Block Quote</span><a href="#block-quote" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<blockquote>
+  <p>This line shows the <em>block quote</em>.</p>
+</blockquote>
+
+<h2 id="prompts"><span class="me-2">Prompts</span><a href="#prompts" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<!-- markdownlint-capture -->
+<!-- markdownlint-disable -->
+<blockquote class="prompt-tip">
+  <p>An example showing the <code class="language-plaintext highlighter-rouge">tip</code> type prompt.</p>
+</blockquote>
+
+<blockquote class="prompt-info">
+  <p>An example showing the <code class="language-plaintext highlighter-rouge">info</code> type prompt.</p>
+</blockquote>
+
+<blockquote class="prompt-warning">
+  <p>An example showing the <code class="language-plaintext highlighter-rouge">warning</code> type prompt.</p>
+</blockquote>
+
+<blockquote class="prompt-danger">
+  <p>An example showing the <code class="language-plaintext highlighter-rouge">danger</code> type prompt.</p>
+</blockquote>
+<!-- markdownlint-restore -->
+
+<h2 id="tables"><span class="me-2">Tables</span><a href="#tables" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<div class="table-wrapper"><table>
+  <thead>
+    <tr>
+      <th style="text-align: left">Company</th>
+      <th style="text-align: left">Contact</th>
+      <th style="text-align: right">Country</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td style="text-align: left">Alfreds Futterkiste</td>
+      <td style="text-align: left">Maria Anders</td>
+      <td style="text-align: right">Germany</td>
+    </tr>
+    <tr>
+      <td style="text-align: left">Island Trading</td>
+      <td style="text-align: left">Helen Bennett</td>
+      <td style="text-align: right">UK</td>
+    </tr>
+    <tr>
+      <td style="text-align: left">Magazzini Alimentari Riuniti</td>
+      <td style="text-align: left">Giovanni Rovelli</td>
+      <td style="text-align: right">Italy</td>
+    </tr>
+  </tbody>
+</table></div>
+
+<h2 id="links"><span class="me-2">Links</span><a href="#links" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<p><a href="http://127.0.0.1:4000">http://127.0.0.1:4000</a></p>
+
+<h2 id="footnote"><span class="me-2">Footnote</span><a href="#footnote" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<p>Click the hook will locate the footnote<sup id="fnref:footnote"><a href="#fn:footnote" class="footnote" rel="footnote" role="doc-noteref">1</a></sup>, and here is another footnote<sup id="fnref:fn-nth-2"><a href="#fn:fn-nth-2" class="footnote" rel="footnote" role="doc-noteref">2</a></sup>.</p>
+
+<h2 id="inline-code"><span class="me-2">Inline code</span><a href="#inline-code" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<p>This is an example of <code class="language-plaintext highlighter-rouge">Inline Code</code>.</p>
+
+<h2 id="filepath"><span class="me-2">Filepath</span><a href="#filepath" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<p>Here is the <code class="language-plaintext filepath highlighter-rouge">/path/to/the/file.extend</code>.</p>
+
+<h2 id="code-blocks"><span class="me-2">Code blocks</span><a href="#code-blocks" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<h3 id="common"><span class="me-2">Common</span><a href="#common" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<div class="language-text highlighter-rouge"><div class="code-header">
+        <span data-label-text="Text"><i class="fas fa-code fa-fw small"></i></span>
+      <button aria-label="copy" data-title-succeed="Copied!"><i class="far fa-clipboard"></i></button></div><div class="highlight"><code><table class="rouge-table"><tbody><tr><td class="rouge-gutter gl"><pre class="lineno">1
+</pre></td><td class="rouge-code"><pre>This is a common code snippet, without syntax highlight and line number.
+</pre></td></tr></tbody></table></code></div></div>
+
+<h3 id="specific-language"><span class="me-2">Specific Language</span><a href="#specific-language" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<div class="language-bash highlighter-rouge"><div class="code-header">
+        <span data-label-text="Shell"><i class="fas fa-code fa-fw small"></i></span>
+      <button aria-label="copy" data-title-succeed="Copied!"><i class="far fa-clipboard"></i></button></div><div class="highlight"><code><table class="rouge-table"><tbody><tr><td class="rouge-gutter gl"><pre class="lineno">1
+2
+3
+4
+</pre></td><td class="rouge-code"><pre><span class="k">if</span> <span class="o">[</span> <span class="nv">$?</span> <span class="nt">-ne</span> 0 <span class="o">]</span><span class="p">;</span> <span class="k">then
+  </span><span class="nb">echo</span> <span class="s2">"The command was not successful."</span><span class="p">;</span>
+  <span class="c">#do the needful / exit</span>
+<span class="k">fi</span><span class="p">;</span>
+</pre></td></tr></tbody></table></code></div></div>
+
+<h3 id="specific-filename"><span class="me-2">Specific filename</span><a href="#specific-filename" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<div file="_sass/jekyll-theme-chirpy.scss" class="language-sass highlighter-rouge"><div class="code-header">
+        <span data-label-text="_sass/jekyll-theme-chirpy.scss"><i class="far fa-file-code fa-fw"></i></span>
+      <button aria-label="copy" data-title-succeed="Copied!"><i class="far fa-clipboard"></i></button></div><div class="highlight"><code><table class="rouge-table"><tbody><tr><td class="rouge-gutter gl"><pre class="lineno">1
+2
+3
+</pre></td><td class="rouge-code"><pre><span class="k">@import</span>
+  <span class="s2">"colors/light-typography"</span><span class="o">,</span>
+  <span class="s2">"colors/dark-typography"</span><span class="o">;</span>
+</pre></td></tr></tbody></table></code></div></div>
+
+<h2 id="mathematics"><span class="me-2">Mathematics</span><a href="#mathematics" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<p>The mathematics powered by <a href="https://www.mathjax.org/"><strong>MathJax</strong></a>:</p>
+
+\[\begin{equation}
+  \sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6}
+  \label{eq:series}
+\end{equation}\]
+
+<p>We can reference the equation as \eqref{eq:series}.</p>
+
+<p>When $a \ne 0$, there are two solutions to $ax^2 + bx + c = 0$ and they are</p>
+
+\[x = {-b \pm \sqrt{b^2-4ac} \over 2a}\]
+
+<h2 id="mermaid-svg"><span class="me-2">Mermaid SVG</span><a href="#mermaid-svg" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<pre><code class="language-mermaid"> gantt
+  title  Adding GANTT diagram functionality to mermaid
+  apple :a, 2017-07-20, 1w
+  banana :crit, b, 2017-07-23, 1d
+  cherry :active, c, after b a, 1d
+</code></pre>
+
+<h2 id="images"><span class="me-2">Images</span><a href="#images" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<h3 id="default-with-caption"><span class="me-2">Default (with caption)</span><a href="#default-with-caption" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<p><a href="/posts/20190808/mockup.png" class="popup img-link  shimmer"><img src="/posts/20190808/mockup.png" alt="Desktop View" width="972" height="589" loading="lazy"></a>
+<em>Full screen width and center alignment</em></p>
+
+<h3 id="left-aligned"><span class="me-2">Left aligned</span><a href="#left-aligned" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<p><a href="/posts/20190808/mockup.png" class="popup img-link w-75 normal shimmer"><img src="/posts/20190808/mockup.png" alt="Desktop View" width="972" height="589"  loading="lazy"></a></p>
+
+<h3 id="float-to-left"><span class="me-2">Float to left</span><a href="#float-to-left" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<p><a href="/posts/20190808/mockup.png" class="popup img-link w-50 left shimmer"><img src="/posts/20190808/mockup.png" alt="Desktop View" width="972" height="589"  loading="lazy"></a>
+Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.</p>
+
+<h3 id="float-to-right"><span class="me-2">Float to right</span><a href="#float-to-right" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<p><a href="/posts/20190808/mockup.png" class="popup img-link w-50 right shimmer"><img src="/posts/20190808/mockup.png" alt="Desktop View" width="972" height="589"  loading="lazy"></a>
+Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.</p>
+
+<h3 id="darklight-mode--shadow"><span class="me-2">Dark/Light mode &amp; Shadow</span><a href="#darklight-mode--shadow" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h3>
+
+<p>The image below will toggle dark/light mode based on theme preference, notice it has shadows.</p>
+
+<p><a href="/posts/20190808/devtools-light.png" class="popup img-link light w-75 shadow rounded-10 shimmer"><img src="/posts/20190808/devtools-light.png" alt="light mode only"  width="1212" height="668" loading="lazy"></a>
+<a href="/posts/20190808/devtools-dark.png" class="popup img-link dark w-75 shadow rounded-10 shimmer"><img src="/posts/20190808/devtools-dark.png" alt="dark mode only"  width="1212" height="668" loading="lazy"></a></p>
+
+<h2 id="video"><span class="me-2">Video</span><a href="#video" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<iframe class="embed-video" loading="lazy" src="https://www.youtube.com/embed/Balreaj8Yqs" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>
+
+<h2 id="reverse-footnote"><span class="me-2">Reverse Footnote</span><a href="#reverse-footnote" class="anchor text-muted"><i class="fas fa-hashtag"></i></a></h2>
+
+<div class="footnotes" role="doc-endnotes">
+  <ol>
+    <li id="fn:footnote">
+      <p>The footnote source <a href="#fnref:footnote" class="reversefootnote" role="doc-backlink">&#8617;&#xfe0e;</a></p>
+    </li>
+    <li id="fn:fn-nth-2">
+      <p>The 2nd footnote source <a href="#fnref:fn-nth-2" class="reversefootnote" role="doc-backlink">&#8617;&#xfe0e;</a></p>
+    </li>
+  </ol>
+</div>
+
+  </div>
+
+  <div class="post-tail-wrapper text-muted">
+    <!-- categories -->
+    
+      <div class="post-meta mb-3">
+        <i class="far fa-folder-open fa-fw me-1"></i>
+        
+          <a href="/categories/blogging/">Blogging</a>,
+          <a href="/categories/demo/">Demo</a>
+      </div>
+    
+
+    <!-- tags -->
+    
+      <div class="post-tags">
+        <i class="fa fa-tags fa-fw me-1"></i>
+        
+          <a
+            href="/tags/typography/"
+            class="post-tag no-text-decoration"
+          >typography</a>
+        
+      </div>
+    
+
+    <div
+      class="
+        post-tail-bottom
+        d-flex justify-content-between align-items-center mt-5 pb-2
+      "
+    >
+      <div class="license-wrapper">
+        
+          
+
+          This post is licensed under 
+        <a href="https://creativecommons.org/licenses/by/4.0/">
+          CC BY 4.0
+        </a>
+         by the author.
+        
+      </div>
+
+      <!-- Post sharing snippet -->
+
+<div class="share-wrapper d-flex align-items-center">
+  <span class="share-label text-muted">Share</span>
+  <span class="share-icons">
+    
+    
+    
+
+    
+
+      
+
+      <a href="https://twitter.com/intent/tweet?text=Text%20and%20Typography%20-%20WenQi%20Wei&url=https%3A%2F%2Fway.ember.ac.cn%2Fposts%2Ftext-and-typography%2F" target="_blank" rel="noopener" data-bs-toggle="tooltip" data-bs-placement="top" title="Twitter" aria-label="Twitter">
+        <i class="fa-fw fa-brands fa-square-x-twitter"></i>
+      </a>
+    
+
+      
+
+      <a href="https://www.facebook.com/sharer/sharer.php?title=Text%20and%20Typography%20-%20WenQi%20Wei&u=https%3A%2F%2Fway.ember.ac.cn%2Fposts%2Ftext-and-typography%2F" target="_blank" rel="noopener" data-bs-toggle="tooltip" data-bs-placement="top" title="Facebook" aria-label="Facebook">
+        <i class="fa-fw fab fa-facebook-square"></i>
+      </a>
+    
+
+      
+
+      <a href="https://t.me/share/url?url=https%3A%2F%2Fway.ember.ac.cn%2Fposts%2Ftext-and-typography%2F&text=Text%20and%20Typography%20-%20WenQi%20Wei" target="_blank" rel="noopener" data-bs-toggle="tooltip" data-bs-placement="top" title="Telegram" aria-label="Telegram">
+        <i class="fa-fw fab fa-telegram"></i>
+      </a>
+    
+
+    <button
+      id="copy-link"
+      aria-label="Copy link"
+      class="btn small"
+      data-bs-toggle="tooltip"
+      data-bs-placement="top"
+      title="Copy link"
+      data-title-succeed="Link copied successfully!"
+    >
+      <i class="fa-fw fas fa-link pe-none fs-6"></i>
+    </button>
+  </span>
+</div>
+
+    </div>
+    <!-- .post-tail-bottom -->
+  </div>
+  <!-- div.post-tail-wrapper -->
+</article>
+
+
+            
+          </main>
+
+          <!-- panel -->
+          <aside aria-label="Panel" id="panel-wrapper" class="col-xl-3 ps-2 text-muted">
+            <div class="access">
+              <!-- Get 5 last posted/updated posts -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  <section id="access-lastmod">
+    <h2 class="panel-heading">Recently Updated</h2>
+    <ul class="content list-unstyled ps-0 pb-1 ms-1 mt-2">
+      
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/write-a-new-post/">Writing a New Post</a>
+        </li>
+      
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
+    </ul>
+  </section>
+  <!-- #access-lastmod -->
+
+
+              <!-- The trending tags list -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+    
+    
+    
+    
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
+      
+        
+        
+
+
+
+  <section>
+    <h2 class="panel-heading">Trending Tags</h2>
+    <div class="d-flex flex-wrap mt-3 mb-1 me-3">
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
+      
+    </div>
+  </section>
+
+
+            </div>
+
+            
+              
+              
+
+
+
+
+
+
+  <div class="toc-border-cover z-3"></div>
+  <section id="toc-wrapper" class="invisible position-sticky ps-0 pe-4 pb-4">
+    <h2 class="panel-heading ps-3 pb-2 mb-0">Contents</h2>
+    <nav id="toc"></nav>
+  </section>
+
+
+            
+          </aside>
+        </div>
+
+        <div class="row">
+          <!-- tail -->
+          <div id="tail-wrapper" class="col-12 col-lg-11 col-xl-9 px-md-4">
+            
+              
+              <!-- Recommend the other 3 posts according to the tags and categories of the current post. -->
+
+<!-- The total size of related posts -->
+
+
+<!-- An random integer that bigger than 0 -->
+
+
+<!-- Equals to TAG_SCORE / {max_categories_hierarchy} -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+
+  
+    
+  
+
+  
+
+  
+
+  
+
+  
+
+  
+
+
+
+
+
+
+
+
+
+
+
+  <aside id="related-posts" aria-labelledby="related-label">
+    <h3 class="mb-4" id="related-label">Further Reading</h3>
+    <nav class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-4 mb-4">
+      
+        <article class="col">
+          <a href="/posts/write-a-new-post/" class="post-preview card h-100">
+            <div class="card-body">
+              <!--
+  Date format snippet
+  See: ${JS_ROOT}/utils/locale-dateime.js
+-->
+
+
+
+
+<time
+  
+  data-ts="1565244600"
+  data-df="ll"
+  
+>
+  Aug  8, 2019
+</time>
+
+              <h4 class="pt-0 my-2">Writing a New Post</h4>
+              <div class="text-muted">
+                <p>This tutorial will guide you how to write a post in the Chirpy template, and it’s worth reading even if you’ve used Jekyll before, as many features require specific variables to be set.
+
+Naming and...</p>
+              </div>
+            </div>
+          </a>
+        </article>
+      
+    </nav>
+  </aside>
+  <!-- #related-posts -->
+
+
+            
+              
+              <!-- Navigation buttons at the bottom of the post. -->
+
+<nav class="post-navigation d-flex justify-content-between" aria-label="Post Navigation">
+  
+  
+
+  
+    <div class="btn btn-outline-primary disabled" aria-label="Older">
+      <p>-</p>
+    </div>
+  
+
+  
+    <a
+      href="/posts/write-a-new-post/"
+      class="btn btn-outline-primary"
+      aria-label="Newer"
+    >
+      <p>Writing a New Post</p>
+    </a>
+  
+</nav>
+
+            
+
+            <!-- The Footer -->
+
+<footer
+  aria-label="Site Info"
+  class="
+    d-flex flex-column justify-content-center text-muted
+    flex-lg-row justify-content-lg-between align-items-lg-center pb-lg-3
+  "
+>
+  <p>©
+    <time>2025</time>
+
+    
+      <a href="https://twitter.com/way_adventurer">WenQi Wei</a>.
+    
+
+    
+      <span
+        data-bs-toggle="tooltip"
+        data-bs-placement="top"
+        title="Except where otherwise noted, the blog posts on this site are licensed under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author."
+      >Some rights reserved.</span>
+    
+  </p>
+
+  <!-- 站点统计 -->
+  <p> 
+    <!-- 不蒜子站点统计，放在页脚处 (footer.html 中插入) -->
+<script async src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
+<i class="fa fa-user" aria-hidden="true"></i> <span id="busuanzi_value_site_uv"></span> |
+<i class="fa fa-eye" aria-hidden="true"></i> <span id="busuanzi_value_site_pv"></span>
+  </p>
+
+  <p>Using the <a
+        data-bs-toggle="tooltip"
+        data-bs-placement="top"
+        title="v7.2.4"
+        href="https://github.com/cotes2020/jekyll-theme-chirpy"
+        target="_blank"
+        rel="noopener"
+      >Chirpy</a> theme for <a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a>.
+  </p>
+</footer>
+
+          </div>
+        </div>
+
+        <!-- The Search results -->
+
+<div id="search-result-wrapper" class="d-flex justify-content-center d-none">
+  <div class="col-11 content">
+    <div id="search-hints">
+      <!-- The trending tags list -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+    
+    
+    
+    
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
+      
+        
+        
+
+
+
+  <section>
+    <h2 class="panel-heading">Trending Tags</h2>
+    <div class="d-flex flex-wrap mt-3 mb-1 me-3">
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
+      
+    </div>
+  </section>
+
+
+    </div>
+    <div id="search-results" class="d-flex flex-wrap justify-content-center text-muted mt-3"></div>
+  </div>
+</div>
+
+      </div>
+
+      <aside aria-label="Scroll to Top">
+        <button id="back-to-top" type="button" class="btn btn-lg btn-box-shadow">
+          <i class="fas fa-angle-up"></i>
+        </button>
+      </aside>
+    </div>
+
+    <div id="mask" class="d-none position-fixed w-100 h-100 z-1"></div>
+
+    
+      <aside
+  id="notification"
+  class="toast"
+  role="alert"
+  aria-live="assertive"
+  aria-atomic="true"
+  data-bs-animation="true"
+  data-bs-autohide="false"
+>
+  <div class="toast-header">
+    <button
+      type="button"
+      class="btn-close ms-auto"
+      data-bs-dismiss="toast"
+      aria-label="Close"
+    ></button>
+  </div>
+  <div class="toast-body text-center pt-0">
+    <p class="px-2 mb-3">A new version of content is available.</p>
+    <button type="button" class="btn btn-primary" aria-label="Update">
+      Update
+    </button>
+  </div>
+</aside>
+
+    
+
+    <!-- Embedded scripts -->
+
+    
+      
+      <!-- The comments switcher -->
+
+
+    
+
+    <!--
+  Jekyll Simple Search loader
+  See: <https://github.com/christian-fei/Simple-Jekyll-Search>
+-->
+
+
+
+
+
+<script>
+  
+  document.addEventListener('DOMContentLoaded', () => {
+    SimpleJekyllSearch({
+      searchInput: document.getElementById('search-input'),
+      resultsContainer: document.getElementById('search-results'),
+      json: '/assets/js/data/search.json',
+      searchResultTemplate: '  <article class="px-1 px-sm-2 px-lg-4 px-xl-0">    <header>      <h2><a href="{url}">{title}</a></h2>      <div class="post-meta d-flex flex-column flex-sm-row text-muted mt-1 mb-1">        {categories}        {tags}      </div>    </header>    <p>{snippet}</p>  </article>',
+      noResultsText: '<p class="mt-5">Oops! No results found.</p>',
+      templateMiddleware: function(prop, value, template) {
+        if (prop === 'categories') {
+          if (value === '') {
+            return `${value}`;
+          } else {
+            return `<div class="me-sm-4"><i class="far fa-folder fa-fw"></i>${value}</div>`;
+          }
+        }
+
+        if (prop === 'tags') {
+          if (value === '') {
+            return `${value}`;
+          } else {
+            return `<div><i class="fa fa-tag fa-fw"></i>${value}</div>`;
+          }
+        }
+      }
+    });
+  });
+</script>
+
+  </body>
+</html>
+
diff --git a/_site/posts/write-a-new-post/index.html b/_site/posts/write-a-new-post/index.html
index d388dd1..fff885e 100644
--- a/_site/posts/write-a-new-post/index.html
+++ b/_site/posts/write-a-new-post/index.html
@@ -1965,6 +1965,13 @@ If you are building the site via <code class="language-plaintext highlighter-rou
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -1991,6 +1998,22 @@ If you are building the site via <code class="language-plaintext highlighter-rou
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -2002,6 +2025,9 @@ If you are building the site via <code class="language-plaintext highlighter-rou
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -2062,6 +2088,18 @@ If you are building the site via <code class="language-plaintext highlighter-rou
   
 
   
+
+  
+
+  
+
+  
+
+  
+
+  
+
+  
     
 
 
@@ -2072,6 +2110,42 @@ If you are building the site via <code class="language-plaintext highlighter-rou
 
 
 
+
+  <aside id="related-posts" aria-labelledby="related-label">
+    <h3 class="mb-4" id="related-label">Further Reading</h3>
+    <nav class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-4 mb-4">
+      
+        <article class="col">
+          <a href="/posts/text-and-typography/" class="post-preview card h-100">
+            <div class="card-body">
+              <!--
+  Date format snippet
+  See: ${JS_ROOT}/utils/locale-dateime.js
+-->
+
+
+
+
+<time
+  
+  data-ts="1565235180"
+  data-df="ll"
+  
+>
+  Aug  8, 2019
+</time>
+
+              <h4 class="pt-0 my-2">Text and Typography</h4>
+              <div class="text-muted">
+                <p>Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more.</p>
+              </div>
+            </div>
+          </a>
+        </article>
+      
+    </nav>
+  </aside>
+  <!-- #related-posts -->
 
 
             
@@ -2083,9 +2157,13 @@ If you are building the site via <code class="language-plaintext highlighter-rou
   
 
   
-    <div class="btn btn-outline-primary disabled" aria-label="Older">
-      <p>-</p>
-    </div>
+    <a
+      href="/posts/text-and-typography/"
+      class="btn btn-outline-primary"
+      aria-label="Older"
+    >
+      <p>Text and Typography</p>
+    </a>
   
 
   
@@ -2170,6 +2248,22 @@ If you are building the site via <code class="language-plaintext highlighter-rou
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -2181,6 +2275,9 @@ If you are building the site via <code class="language-plaintext highlighter-rou
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
diff --git a/_site/sitemap.xml b/_site/sitemap.xml
index 02beaef..fc52c1a 100644
--- a/_site/sitemap.xml
+++ b/_site/sitemap.xml
@@ -1,35 +1,45 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <urlset xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd" xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
 <url>
+<loc>https://way.ember.ac.cn/posts/text-and-typography/</loc>
+<lastmod>2019-08-08T11:33:00+08:00</lastmod>
+</url>
+<url>
 <loc>https://way.ember.ac.cn/posts/write-a-new-post/</loc>
 <lastmod>2019-08-08T14:10:00+08:00</lastmod>
 </url>
 <url>
 <loc>https://way.ember.ac.cn/categories/</loc>
-<lastmod>2025-03-18T20:47:34+08:00</lastmod>
+<lastmod>2025-03-18T21:10:43+08:00</lastmod>
 </url>
 <url>
 <loc>https://way.ember.ac.cn/tags/</loc>
-<lastmod>2025-03-18T20:47:34+08:00</lastmod>
+<lastmod>2025-03-18T21:10:43+08:00</lastmod>
 </url>
 <url>
 <loc>https://way.ember.ac.cn/archives/</loc>
-<lastmod>2025-03-18T20:47:34+08:00</lastmod>
+<lastmod>2025-03-18T21:10:43+08:00</lastmod>
 </url>
 <url>
 <loc>https://way.ember.ac.cn/about/</loc>
-<lastmod>2025-03-18T20:47:34+08:00</lastmod>
+<lastmod>2025-03-18T21:10:43+08:00</lastmod>
 </url>
 <url>
 <loc>https://way.ember.ac.cn/</loc>
 </url>
 <url>
+<loc>https://way.ember.ac.cn/tags/typography/</loc>
+</url>
+<url>
 <loc>https://way.ember.ac.cn/tags/writing/</loc>
 </url>
 <url>
 <loc>https://way.ember.ac.cn/categories/blogging/</loc>
 </url>
 <url>
+<loc>https://way.ember.ac.cn/categories/demo/</loc>
+</url>
+<url>
 <loc>https://way.ember.ac.cn/categories/tutorial/</loc>
 </url>
 </urlset>
diff --git a/_site/tags/index.html b/_site/tags/index.html
index a5e9ab2..cc65d3f 100644
--- a/_site/tags/index.html
+++ b/_site/tags/index.html
@@ -93,12 +93,12 @@
 <meta property="og:url" content="https://way.ember.ac.cn/tags/" />
 <meta property="og:site_name" content="WenQi Wei" />
 <meta property="og:type" content="article" />
-<meta property="article:published_time" content="2025-03-18T20:47:34+08:00" />
+<meta property="article:published_time" content="2025-03-18T21:10:43+08:00" />
 <meta name="twitter:card" content="summary" />
 <meta property="twitter:title" content="Tags" />
 <meta name="twitter:site" content="@way_adventurer" />
 <script type="application/ld+json">
-{"@context":"https://schema.org","@type":"BlogPosting","dateModified":"2025-03-18T20:47:34+08:00","datePublished":"2025-03-18T20:47:34+08:00","description":"这里是，way的世界！welcome！","headline":"Tags","mainEntityOfPage":{"@type":"WebPage","@id":"https://way.ember.ac.cn/tags/"},"url":"https://way.ember.ac.cn/tags/"}</script>
+{"@context":"https://schema.org","@type":"BlogPosting","dateModified":"2025-03-18T21:10:43+08:00","datePublished":"2025-03-18T21:10:43+08:00","description":"这里是，way的世界！welcome！","headline":"Tags","mainEntityOfPage":{"@type":"WebPage","@id":"https://way.ember.ac.cn/tags/"},"url":"https://way.ember.ac.cn/tags/"}</script>
 <!-- End Jekyll SEO tag -->
 
 
@@ -478,6 +478,12 @@
   
 
   
+    <div>
+      <a class="tag" href="/tags/typography/">
+        typography<span class="text-muted">1</span>
+      </a>
+    </div>
+  
     <div>
       <a class="tag" href="/tags/writing/">
         writing<span class="text-muted">1</span>
@@ -522,6 +528,13 @@
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -548,6 +561,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -559,6 +588,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -649,6 +681,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -660,6 +708,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
diff --git a/_site/tags/typography/index.html b/_site/tags/typography/index.html
new file mode 100644
index 0000000..d5be522
--- /dev/null
+++ b/_site/tags/typography/index.html
@@ -0,0 +1,853 @@
+<!doctype html>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  <div id="animation">
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+    <div class="animation-circle"></div>
+  </div>
+
+
+<!-- `site.alt_lang` can specify a language different from the UI -->
+<html lang="en" >
+  <head>
+  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+  <meta name="theme-color" media="(prefers-color-scheme: light)" content="#f7f7f7">
+  <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#1b1b1e">
+  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+  <meta
+    name="viewport"
+    content="width=device-width, user-scalable=no initial-scale=1, shrink-to-fit=no, viewport-fit=cover"
+  ><!-- Setup Open Graph image -->
+
+  
+
+  <!-- Begin Jekyll SEO tag v2.8.0 -->
+<meta name="generator" content="Jekyll v4.4.1" />
+<meta property="og:title" content="typography" />
+<meta property="og:locale" content="en" />
+<meta name="description" content="这里是，way的世界！welcome！" />
+<meta property="og:description" content="这里是，way的世界！welcome！" />
+<link rel="canonical" href="https://way.ember.ac.cn/tags/typography/" />
+<meta property="og:url" content="https://way.ember.ac.cn/tags/typography/" />
+<meta property="og:site_name" content="WenQi Wei" />
+<meta property="og:type" content="website" />
+<meta name="twitter:card" content="summary" />
+<meta property="twitter:title" content="typography" />
+<meta name="twitter:site" content="@way_adventurer" />
+<script type="application/ld+json">
+{"@context":"https://schema.org","@type":"WebPage","description":"这里是，way的世界！welcome！","headline":"typography","url":"https://way.ember.ac.cn/tags/typography/"}</script>
+<!-- End Jekyll SEO tag -->
+
+
+  <title>typography | WenQi Wei
+  </title>
+
+  <!--
+  The Favicons for Web, Android, Microsoft, and iOS (iPhone and iPad) Apps
+  Generated by: https://realfavicongenerator.net/
+-->
+
+
+
+<link rel="apple-touch-icon" sizes="180x180" href="/assets/img/favicons/apple-touch-icon.png">
+<link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicons/favicon-32x32.png">
+<link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicons/favicon-16x16.png">
+
+  <link rel="manifest" href="/assets/img/favicons/site.webmanifest">
+
+<link rel="shortcut icon" href="/assets/img/favicons/favicon.ico">
+<meta name="apple-mobile-web-app-title" content="WenQi Wei">
+<meta name="application-name" content="WenQi Wei">
+<meta name="msapplication-TileColor" content="#da532c">
+<meta name="msapplication-config" content="/assets/img/favicons/browserconfig.xml">
+<meta name="theme-color" content="#ffffff">
+
+
+  <!-- Resource Hints -->
+  
+    
+      
+        <link rel="preconnect" href="https://fonts.googleapis.com" >
+      
+        <link rel="dns-prefetch" href="https://fonts.googleapis.com" >
+      
+    
+      
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+      
+        <link rel="dns-prefetch" href="https://fonts.gstatic.com" >
+      
+    
+      
+        <link rel="preconnect" href="https://cdn.jsdelivr.net" >
+      
+        <link rel="dns-prefetch" href="https://cdn.jsdelivr.net" >
+      
+    
+  
+
+  <!-- Bootstrap -->
+  
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css">
+  
+
+  <!-- Theme style -->
+  <link rel="stylesheet" href="/assets/css/jekyll-theme-chirpy.css">
+
+  <!-- Web Font -->
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400&family=Source+Sans+Pro:wght@400;600;700;900&display=swap">
+
+  <!-- Font Awesome Icons -->
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.7.1/css/all.min.css">
+
+  <!-- 3rd-party Dependencies -->
+
+  
+
+  
+
+  
+
+  <!-- Scripts -->
+
+  <script src="/assets/js/dist/theme.min.js"></script>
+
+  <!-- JS selector for site. -->
+
+<!-- commons -->
+
+
+
+<!-- layout specified -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+  
+    
+
+    
+
+  
+
+
+
+  <script defer src="https://cdn.jsdelivr.net/combine/npm/simple-jekyll-search@1.10.0/dest/simple-jekyll-search.min.js,npm/dayjs@1.11.13/dayjs.min.js,npm/dayjs@1.11.13/locale/en.js,npm/dayjs@1.11.13/plugin/relativeTime.js,npm/dayjs@1.11.13/plugin/localizedFormat.js"></script>
+
+
+
+
+
+
+
+<script defer src="/assets/js/dist/misc.min.js"></script>
+
+
+
+<!-- Pageviews -->
+
+
+
+  
+
+  <!-- A placeholder to allow defining custom metadata -->
+
+</head>
+
+
+  <body>
+    <!-- The Side Bar -->
+
+<aside aria-label="Sidebar" id="sidebar" class="d-flex flex-column align-items-end">
+  <header class="profile-wrapper">
+    <a href="/" id="avatar" class="rounded-circle"><img src="/assets/img/avatar.jpg" width="112" height="112" alt="avatar" onerror="this.style.display='none'"></a>
+
+    <a class="site-title d-block" href="/">WenQi Wei</a>
+    <p class="site-subtitle fst-italic mb-0">Show me the code</p>
+  </header>
+  <!-- .profile-wrapper -->
+
+  <nav class="flex-column flex-grow-1 w-100 ps-0">
+    <ul class="nav">
+      <!-- home -->
+      <li class="nav-item">
+        <a href="/" class="nav-link">
+          <i class="fa-fw fas fa-home"></i>
+          <span>HOME</span>
+        </a>
+      </li>
+      <!-- the real tabs -->
+      
+        <li class="nav-item">
+          <a href="/categories/" class="nav-link">
+            <i class="fa-fw fas fa-stream"></i>
+            
+
+            <span>CATEGORIES</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+        <li class="nav-item">
+          <a href="/tags/" class="nav-link">
+            <i class="fa-fw fas fa-tags"></i>
+            
+
+            <span>TAGS</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+        <li class="nav-item">
+          <a href="/archives/" class="nav-link">
+            <i class="fa-fw fas fa-archive"></i>
+            
+
+            <span>ARCHIVES</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+        <li class="nav-item">
+          <a href="/about/" class="nav-link">
+            <i class="fa-fw fas fa-info-circle"></i>
+            
+
+            <span>ABOUT</span>
+          </a>
+        </li>
+        <!-- .nav-item -->
+      
+    </ul>
+  </nav>
+
+  <div class="sidebar-bottom d-flex flex-wrap  align-items-center w-100">
+    
+      <button type="button" class="btn btn-link nav-link" aria-label="Switch Mode" id="mode-toggle">
+        <i class="fas fa-adjust"></i>
+      </button>
+
+      
+        <span class="icon-border"></span>
+      
+    
+
+    
+      
+
+      
+        <a
+          href="https://github.com/WAY-ADVENTURER"
+          aria-label="github"
+          
+
+          
+            target="_blank"
+            
+          
+
+          
+
+          
+            rel="noopener noreferrer"
+          
+        >
+          <i class="fab fa-github"></i>
+        </a>
+      
+    
+      
+
+      
+        <a
+          href="https://twitter.com/way_adventurer"
+          aria-label="twitter"
+          
+
+          
+            target="_blank"
+            
+          
+
+          
+
+          
+            rel="noopener noreferrer"
+          
+        >
+          <i class="fa-brands fa-x-twitter"></i>
+        </a>
+      
+    
+      
+
+      
+        <a
+          href="javascript:location.href = 'mailto:' + ['2992850181','qq.com'].join('@')"
+          aria-label="email"
+          
+
+          
+
+          
+
+          
+        >
+          <i class="fas fa-envelope"></i>
+        </a>
+      
+    
+      
+
+      
+        <a
+          href="/feed.xml"
+          aria-label="rss"
+          
+
+          
+
+          
+
+          
+        >
+          <i class="fas fa-rss"></i>
+        </a>
+      
+    
+  </div>
+  <!-- .sidebar-bottom -->
+</aside>
+<!-- #sidebar -->
+
+
+    <div id="main-wrapper" class="d-flex justify-content-center">
+      <div class="container d-flex flex-column px-xxl-5">
+        <!-- The Top Bar -->
+
+<header id="topbar-wrapper" aria-label="Top Bar">
+  <div
+    id="topbar"
+    class="d-flex align-items-center justify-content-between px-lg-3 h-100"
+  >
+    <nav id="breadcrumb" aria-label="Breadcrumb">
+      
+
+      
+        
+          
+            <span>
+              <a href="/">Home</a>
+            </span>
+
+          
+        
+          
+            <span>
+              <a href="/tags/">Tags</a>
+            </span>
+          
+        
+          
+            
+              <span>typography</span>
+            
+
+          
+        
+      
+    </nav>
+    <!-- endof #breadcrumb -->
+
+    <button type="button" id="sidebar-trigger" class="btn btn-link">
+      <i class="fas fa-bars fa-fw"></i>
+    </button>
+
+    <div id="topbar-title">
+      Tag
+    </div>
+
+    <button type="button" id="search-trigger" class="btn btn-link">
+      <i class="fas fa-search fa-fw"></i>
+    </button>
+
+    <search id="search" class="align-items-center ms-3 ms-lg-0">
+      <i class="fas fa-search fa-fw"></i>
+      <input
+        class="form-control"
+        id="search-input"
+        type="search"
+        aria-label="search"
+        autocomplete="off"
+        placeholder="Search..."
+      >
+    </search>
+    <button type="button" class="btn btn-link text-decoration-none" id="search-cancel">Cancel</button>
+  </div>
+</header>
+
+
+        <div class="row flex-grow-1">
+          <main aria-label="Main Content" class="col-12 col-lg-11 col-xl-9 px-md-4">
+            
+              
+
+
+
+<article class="px-1">
+  
+    
+
+
+
+<div id="page-tag">
+  <h1 class="ps-lg-2">
+    <i class="fa fa-tag fa-fw text-muted"></i>
+    typography
+    <span class="lead text-muted ps-2">1</span>
+  </h1>
+  <ul class="content ps-0">
+    
+      <li class="d-flex justify-content-between px-md-3">
+        <a href="/posts/text-and-typography/">Text and Typography</a>
+        <span class="dash flex-grow-1"></span>
+        <!--
+  Date format snippet
+  See: ${JS_ROOT}/utils/locale-dateime.js
+-->
+
+
+
+
+<time
+  
+    class="text-muted small text-nowrap"
+  
+  data-ts="1565235180"
+  data-df="ll"
+  
+>
+  Aug  8, 2019
+</time>
+
+      </li>
+    
+  </ul>
+</div>
+
+  
+</article>
+
+            
+          </main>
+
+          <!-- panel -->
+          <aside aria-label="Panel" id="panel-wrapper" class="col-xl-3 ps-2 text-muted">
+            <div class="access">
+              <!-- Get 5 last posted/updated posts -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  <section id="access-lastmod">
+    <h2 class="panel-heading">Recently Updated</h2>
+    <ul class="content list-unstyled ps-0 pb-1 ms-1 mt-2">
+      
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/write-a-new-post/">Writing a New Post</a>
+        </li>
+      
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
+    </ul>
+  </section>
+  <!-- #access-lastmod -->
+
+
+              <!-- The trending tags list -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+    
+    
+    
+    
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
+      
+        
+        
+
+
+
+  <section>
+    <h2 class="panel-heading">Trending Tags</h2>
+    <div class="d-flex flex-wrap mt-3 mb-1 me-3">
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
+      
+    </div>
+  </section>
+
+
+            </div>
+
+            
+          </aside>
+        </div>
+
+        <div class="row">
+          <!-- tail -->
+          <div id="tail-wrapper" class="col-12 col-lg-11 col-xl-9 px-md-4">
+            
+
+            <!-- The Footer -->
+
+<footer
+  aria-label="Site Info"
+  class="
+    d-flex flex-column justify-content-center text-muted
+    flex-lg-row justify-content-lg-between align-items-lg-center pb-lg-3
+  "
+>
+  <p>©
+    <time>2025</time>
+
+    
+      <a href="https://twitter.com/way_adventurer">WenQi Wei</a>.
+    
+
+    
+      <span
+        data-bs-toggle="tooltip"
+        data-bs-placement="top"
+        title="Except where otherwise noted, the blog posts on this site are licensed under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author."
+      >Some rights reserved.</span>
+    
+  </p>
+
+  <!-- 站点统计 -->
+  <p> 
+    <!-- 不蒜子站点统计，放在页脚处 (footer.html 中插入) -->
+<script async src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
+<i class="fa fa-user" aria-hidden="true"></i> <span id="busuanzi_value_site_uv"></span> |
+<i class="fa fa-eye" aria-hidden="true"></i> <span id="busuanzi_value_site_pv"></span>
+  </p>
+
+  <p>Using the <a
+        data-bs-toggle="tooltip"
+        data-bs-placement="top"
+        title="v7.2.4"
+        href="https://github.com/cotes2020/jekyll-theme-chirpy"
+        target="_blank"
+        rel="noopener"
+      >Chirpy</a> theme for <a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a>.
+  </p>
+</footer>
+
+          </div>
+        </div>
+
+        <!-- The Search results -->
+
+<div id="search-result-wrapper" class="d-flex justify-content-center d-none">
+  <div class="col-11 content">
+    <div id="search-hints">
+      <!-- The trending tags list -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+    
+    
+    
+    
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
+      
+        
+        
+
+
+
+  <section>
+    <h2 class="panel-heading">Trending Tags</h2>
+    <div class="d-flex flex-wrap mt-3 mb-1 me-3">
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
+        <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
+      
+    </div>
+  </section>
+
+
+    </div>
+    <div id="search-results" class="d-flex flex-wrap justify-content-center text-muted mt-3"></div>
+  </div>
+</div>
+
+      </div>
+
+      <aside aria-label="Scroll to Top">
+        <button id="back-to-top" type="button" class="btn btn-lg btn-box-shadow">
+          <i class="fas fa-angle-up"></i>
+        </button>
+      </aside>
+    </div>
+
+    <div id="mask" class="d-none position-fixed w-100 h-100 z-1"></div>
+
+    
+      <aside
+  id="notification"
+  class="toast"
+  role="alert"
+  aria-live="assertive"
+  aria-atomic="true"
+  data-bs-animation="true"
+  data-bs-autohide="false"
+>
+  <div class="toast-header">
+    <button
+      type="button"
+      class="btn-close ms-auto"
+      data-bs-dismiss="toast"
+      aria-label="Close"
+    ></button>
+  </div>
+  <div class="toast-body text-center pt-0">
+    <p class="px-2 mb-3">A new version of content is available.</p>
+    <button type="button" class="btn btn-primary" aria-label="Update">
+      Update
+    </button>
+  </div>
+</aside>
+
+    
+
+    <!-- Embedded scripts -->
+
+    
+
+    <!--
+  Jekyll Simple Search loader
+  See: <https://github.com/christian-fei/Simple-Jekyll-Search>
+-->
+
+
+
+
+
+<script>
+  
+  document.addEventListener('DOMContentLoaded', () => {
+    SimpleJekyllSearch({
+      searchInput: document.getElementById('search-input'),
+      resultsContainer: document.getElementById('search-results'),
+      json: '/assets/js/data/search.json',
+      searchResultTemplate: '  <article class="px-1 px-sm-2 px-lg-4 px-xl-0">    <header>      <h2><a href="{url}">{title}</a></h2>      <div class="post-meta d-flex flex-column flex-sm-row text-muted mt-1 mb-1">        {categories}        {tags}      </div>    </header>    <p>{snippet}</p>  </article>',
+      noResultsText: '<p class="mt-5">Oops! No results found.</p>',
+      templateMiddleware: function(prop, value, template) {
+        if (prop === 'categories') {
+          if (value === '') {
+            return `${value}`;
+          } else {
+            return `<div class="me-sm-4"><i class="far fa-folder fa-fw"></i>${value}</div>`;
+          }
+        }
+
+        if (prop === 'tags') {
+          if (value === '') {
+            return `${value}`;
+          } else {
+            return `<div><i class="fa fa-tag fa-fw"></i>${value}</div>`;
+          }
+        }
+      }
+    });
+  });
+</script>
+
+  </body>
+</html>
+
diff --git a/_site/tags/writing/index.html b/_site/tags/writing/index.html
index ad11bba..e1f21f4 100644
--- a/_site/tags/writing/index.html
+++ b/_site/tags/writing/index.html
@@ -572,6 +572,13 @@
           <a href="/posts/write-a-new-post/">Writing a New Post</a>
         </li>
       
+        
+        
+        
+        <li class="text-truncate lh-lg">
+          <a href="/posts/text-and-typography/">Text and Typography</a>
+        </li>
+      
     </ul>
   </section>
   <!-- #access-lastmod -->
@@ -598,6 +605,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -609,6 +632,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>
@@ -699,6 +725,22 @@
     
     
     
+      
+        
+        
+
+  
+    
+    
+    
+    
+      
+    
+  
+    
+    
+    
+    
       
         
         
@@ -710,6 +752,9 @@
     <div class="d-flex flex-wrap mt-3 mb-1 me-3">
       
         
+        <a class="post-tag btn btn-outline-primary" href="/tags/typography/">typography</a>
+      
+        
         <a class="post-tag btn btn-outline-primary" href="/tags/writing/">writing</a>
       
     </div>