From 1d93e2140ff14cde497daad3f88a2c67b92b9ca0 Mon Sep 17 00:00:00 2001
From: OLDREDSTONE <OLDRedstone@users.noreply.github.com>
Date: Sun, 1 Mar 2026 01:58:21 +0800
Subject: [PATCH] =?UTF-8?q?2026/03/01=20=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _sidebar.md         |   2 +-
 pages/changelog.md  |   5 +
 pages/credits.md    |   1 +
 pages/expression.md | 108 ++++++++++
 style/base.css      | 476 ++++++++++++++++++++++----------------------
 5 files changed, 356 insertions(+), 236 deletions(-)
 create mode 100644 pages/expression.md

diff --git a/_sidebar.md b/_sidebar.md
index 9121f24..07e0aa7 100644
--- a/_sidebar.md
+++ b/_sidebar.md
@@ -50,7 +50,7 @@
   - [<img src="/indexicon/tag.png"/><p>标签</p>](/pages/tag.md)
   - [<img src="/indexicon/custommethod.png"/><p>自定义方法</p>](/pages/custommethod.md)
   - [<img src="/indexicon/condition.png"/><p>条件</p>](/pages/condition.md)
-  - [<img src="/indexicon/variable.png"/><p>变量</p>](/pages/variable.md)
+  - [<img src="/indexicon/variable.png"/><p>表达式</p>](/pages/expression.md)
 - 高级：第三方工具
   - [<img src="/indexicon/3rdparty_coderd.png"/><p>[Python]CodeRD</p>](/pages/3rdparty_coderd.md)
   - [<img src="/indexicon/3rdparty_rdtk.png"/><p>[C#]RhythmBase</p>](/pages/3rdparty_rdtk.md)
diff --git a/pages/changelog.md b/pages/changelog.md
index 628f739..891ba22 100644
--- a/pages/changelog.md
+++ b/pages/changelog.md
@@ -1,5 +1,10 @@
 # 更新信息
 
+#### 2026-03-01
+- **变量**一节被替换为[表达式](../pages/expression.md)。  
+- 为各种标题添加了容易辨识和定位的背景渐变条。  
+- ~~我也要加入文档编撰列表吗（~~
+
 #### 2026-02-26
 - 临时修复了若干资源查找问题
 - 同步音频列表
diff --git a/pages/credits.md b/pages/credits.md
index 35e5b95..2226ab3 100644
--- a/pages/credits.md
+++ b/pages/credits.md
@@ -14,6 +14,7 @@
     - [0x4D2](https://space.bilibili.com/478595264)  
     - [正宗的小绿君](https://space.bilibili.com/1782518253)
     - [kuanpan](https://space.bilibili.com/1928620300)
+	- [obugs](https://space.bilibili.com/498017546)
 - 视频制作：
     - [吾夜犹明](https://space.bilibili.com/29219948)
     - [山不转水到渠成](https://space.bilibili.com/4870582)
diff --git a/pages/expression.md b/pages/expression.md
new file mode 100644
index 0000000..69daa8e
--- /dev/null
+++ b/pages/expression.md
@@ -0,0 +1,108 @@
+# 表达式
+
+在节奏医生编辑器中，为了增加灵活性与可玩性，很多地方都支持使用表达式在游戏运行时动态决定实际的效果。这种表达式被称作 **RDCode**。  
+
+## 数据类型
+
+类似于其他编程语言，RDCode 中有且仅有一些预定义的数据类型。
+
+### 常量
+表示一个确定的值，其值在关卡制作时就已经确立。  
+
+### 变量
+表示一个不定的值，其值可能会在关卡运行过程中被赋值语句更改。  
+
+- **访问权限**  
+  为了保证关卡运行的稳定，一些变量会设置访问权限：
+  - **只读**  
+    此变量可以参与表达式求值（读），但不能被赋值（写）。  
+  - **只写**  
+    此变量仅允许被赋值（写）而不能参与表达式求值（读）。  
+  - **可读写**  
+    此变量既能够参与表达式求值（读）也能够被赋值（写）。  
+
+- #### 整形（Integer/int）  
+  即整数。  
+  整形可以自动参与浮点型数据的数学运算。  
+  你可以直接使用整形常量并参加运算，例如 `2026`, `-308`, `999`, `0`。  
+- #### 浮点型（Single/Float/float）  
+  可以带有小数部分的数字。  
+  例如 `3.1415`, `200.1`, `-9.99`。  
+  > 在将浮点型转换为整型的操作（如赋值操作）时，将遵循**向最近偶数舍入**的原则（与大多数编程语言中的**向下取整**原则不同），即若计算结果为 `0.5`，那么它对应的整数值为 `0`；而 `1.5` 将对应 `2`。  
+- #### 布尔型（Boolean/bool）  
+  仅 `true` 或 `false` 以表示启用或禁用等。  
+  > 在**自定义方法**中，
+
+- #### 字符串型（String/string）  
+  一串字符。  
+  不参与运算，仅在调用自定义方法时作为参数存在。  
+  值得注意的是，不同于其他语言的双引号 `"STRING"` 等表示方式，RDCode 的字符串表示是 `str:STRING`，即在字符串的前面加上一个 `str:` 前缀。  
+  一般而言，在 RDCode 内用到字符串型的地方都只能在一系列候选词中选择一个填入，例如在选择角色或缓速类型时。  
+  例如 `str:Samurai`, `str:Linear`
+
+- #### 预定义变量  
+  节奏医生为整数、浮点数、布尔类型各预定义了 10 个可读写变量，分别以 `i`, `f`, `b` 开头，即 `i0`~`i9`, `f0`~`f9`, `b0`~`b9`。  
+  一些只读或只写的变量可在[自定义方法表](../pages/appendix_custommethods.md)查到。  
+
+## 运算类型
+
+- **数学运算符**    
+  `+` `-` `*` `/` `%`
+- **逻辑运算符**  
+  `And` `Or` `Not`
+  > 在 `And` `Or` 的两侧、`Not` 的右侧只支持布尔型数据。
+- **比较运算符**  
+  `>` `<` `>=` `<=` `==` `<>`
+- **函数调用**  
+  如 `Rand`, `IIf`, `atLeastRank`  
+  > 所有的可用的自定义方法请查阅[自定义方法表](../pages/appendix_custommethods.md)。  
+  > 表内标注的方法按照每个参数的含义及其类型表示，  
+  > 例如 `SetMistakeWeight(int RowID, float Weight)` 中，注明了此方法需要一个 int 类型（即整形）的值表示 RowID 和一个 float 类型（即浮点型）的值表示 Weight，  
+  > 你可以这样使用：`SetMistakeWeight(0, 2)`，表示将轨道 1 的错误权重设为 2。
+
+## 语句类型  
+只能在自定义方法中使用。  
+
+- **自增/自减**  
+  在变量后面添加 `++` 或 `--` 使变量本身加 1 或减 1。  
+  > 布尔变量不支持自增/自减。  
+  例如 `i2++`。  
+
+- **赋值**  
+  在变量和表达式之间使用 `=` 将变量的值设为表达式的值。  
+  例如 `f3 = 20 * f5`。  
+
+- **调用**  
+    调用[自定义方法](../pages/appendix_custommethods.md)。  
+
+## 表达式的用途
+
+### 条件
+- 在使用[条件](../pages/condition.md)的自定义条件模式时，可以定义一个自定义条件，用于决定赋予此条件的事件能否在播放关卡时启用。  
+- 在条件的表达式限制下我们难以直接写出用 `And` 或 `Or` 组合的形式；但是我们可以通过设立多个自定义条件并分别添加对应的表达式，应用于事件上，或是执行多次自定义表达式并赋值给预定变量，再在条件内组合。  
+- 在**条件**内无法使用 `>=` `<=`。~~怀疑是史山代码发力了~~  
+- 在**条件**内若有 `>` `<` 存在时不允许有括号嵌套。~~史山代码还在发力~~  
+- 逻辑运算符的优先级比比较运算符更高。  
+
+### 自定义方法
+- 自定义方法中的表达式仅在赋值和调用行为时才能使用，其中赋值时以 `[变量]=[表达式]` 形式将对应的变量设为计算后的值，调用时将表达式填入对应的参数的位置。  
+例如 `b0 = b1 Or Not b2 And 3 > f2`。
+- 自增或自减运算的左值仅能使用变量名，不能使用表达式。  
+- 在将布尔型数据转换为整形或浮点型的操作（如参与数学运算）时，其值将退化为整形，其中 `true` 对应 `1`，`false` 对应 `0`。  
+- 在将整形或浮点型数据转换为布尔型的操作（如赋值操作）时，其值将遵循**非 `0` 即 `true`** 的原则，即若计算结果为 `0`，那么它对应的布尔值为 `false`，否则为 `true`。  
+- 实际上在**自定义方法**内进行数学运算时，所有数据都将转换为浮点型再参与运算。  
+- 比较运算符的优先级比逻辑运算符更高。  
+- `Rand` 方法既不能包含表达式形式的参数，也不能参与计算。  
+
+### 自定义方法（注释）
+- 注释型自定义方法的参数不支持表达式，仅支持单独的值或变量。  
+
+### 事件参数
+- 部分事件的属性支持填入表达式，如移动轨道、移动精灵图的位置、轴点、尺寸、角度等。  
+- 需要用花括号 `{}` 将表达式括起来以表示这是一个表达式。  
+- 其他同**自定义方法**。  
+
+### 内插字符串
+- 部分事件的字符串类型属性支持将表达式插入字符串，如浮动文字、显示状态牌等。  
+- 需要用花括号 `{}` 将表达式括起来以表示游戏需要将表达式的值替换表达式插入原字符串中。  
+- 其他同**自定义方法**。  
\ No newline at end of file
diff --git a/style/base.css b/style/base.css
index debabd0..3436986 100644
--- a/style/base.css
+++ b/style/base.css
@@ -1,48 +1,48 @@
 @font-face {
-  font-family: 'd7';
+  font-family: "d7";
   font-style: normal;
   font-weight: 400;
-  src: url(/font/DinkieBitmap-7px.woff2) format('woff2');
+  src: url(/font/DinkieBitmap-7px.woff2) format("woff2");
 }
 
 @font-face {
-  font-family: 'd7i';
+  font-family: "d7i";
   font-style: normal;
   font-weight: 400;
-  src: url(/font/DinkieBitmap-9pxItalic.woff2) format('woff2');
+  src: url(/font/DinkieBitmap-9pxItalic.woff2) format("woff2");
 }
 
 @font-face {
-  font-family: 'd7c';
+  font-family: "d7c";
   font-style: normal;
   font-weight: 400;
-  src: url(/font/DinkieBitmap-9pxCode.woff2) format('woff2');
+  src: url(/font/DinkieBitmap-9pxCode.woff2) format("woff2");
 }
 
 @font-face {
-  font-family: 'd9';
+  font-family: "d9";
   font-style: normal;
   font-weight: 400;
-  src: url(/font/DinkieBitmap-9px.woff2) format('woff2');
+  src: url(/font/DinkieBitmap-9px.woff2) format("woff2");
 }
 
 @font-face {
-  font-family: 'd9i';
+  font-family: "d9i";
   font-style: normal;
   font-weight: 400;
-  src: url(/font/DinkieBitmap-9pxItalic.woff2) format('woff2');
+  src: url(/font/DinkieBitmap-9pxItalic.woff2) format("woff2");
 }
 
 @font-face {
-  font-family: 'd9c';
+  font-family: "d9c";
   font-style: normal;
   font-weight: 400;
-  src: url(/font/DinkieBitmap-9pxCode.woff2) format('woff2');
+  src: url(/font/DinkieBitmap-9pxCode.woff2) format("woff2");
 }
 
 @keyframes notice-shake {
   0% {
-    transform: rotate(.7deg) scale(1.01);
+    transform: rotate(0.7deg) scale(1.01);
   }
 
   1% {
@@ -93,38 +93,39 @@
 }
 
 body:not(.ready) {
-  overflow: hidden
+  overflow: hidden;
 }
 
 body:not(.ready) .app-nav,
-body:not(.ready)>nav,
+body:not(.ready) > nav,
 body:not(.ready) [data-cloak] {
-  display: none
+  display: none;
 }
 
 div#app {
   font-size: 30px;
   font-weight: lighter;
   margin: 40vh auto;
-  text-align: center
+  text-align: center;
 }
 
 div#app:empty:before {
-  content: "Loading..."
+  content: "Loading...";
 }
 
 img.emoji {
-  height: 1.2em
+  height: 1.2em;
 }
 
 img.emoji,
 span.emoji {
-  vertical-align: middle
+  vertical-align: middle;
 }
 
 span.emoji {
-  font-family: Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
-  font-size: 1.2em
+  font-family:
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
+  font-size: 1.2em;
 }
 
 .progress {
@@ -133,30 +134,30 @@ span.emoji {
   position: fixed;
   right: 0;
   top: 0;
-  transition: width .2s, opacity .4s;
+  transition: width 0.2s, opacity 0.4s;
   width: 0;
-  z-index: 999999
+  z-index: 999999;
 }
 
 .search .search-keyword {
   font-style: normal;
-  font-weight: 700
+  font-weight: 700;
 }
 
 body,
 html {
-  height: 100%
+  height: 100%;
 }
 
 body {
-  transition: all .3s;
+  transition: all 0.3s;
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   font-family: sans-serif;
   font-size: 15px;
   letter-spacing: 0;
   margin: 0;
-  overflow-x: hidden
+  overflow-x: hidden;
 }
 
 div.image-tip:has(p):hover {
@@ -205,7 +206,7 @@ div.image-tip {
 
 a[disabled] {
   cursor: not-allowed;
-  opacity: .6
+  opacity: 0.6;
 }
 
 kbd {
@@ -216,12 +217,12 @@ kbd {
   line-height: 12px;
   margin-bottom: 3px;
   padding: 3px 5px;
-  vertical-align: middle
+  vertical-align: middle;
 }
 
-li input[type=checkbox] {
-  margin: 0 .2em .25em 0;
-  vertical-align: middle
+li input[type="checkbox"] {
+  margin: 0 0.2em 0.25em 0;
+  vertical-align: middle;
 }
 
 .app-nav {
@@ -229,34 +230,34 @@ li input[type=checkbox] {
   position: absolute;
   right: 0;
   text-align: right;
-  z-index: 10
+  z-index: 10;
 }
 
 .app-nav.no-badge {
-  margin-right: 25px
+  margin-right: 25px;
 }
 
 .app-nav p {
-  margin: 0
+  margin: 0;
 }
 
-.app-nav>a {
+.app-nav > a {
   margin: 0 1rem;
-  padding: 5px 0
+  padding: 5px 0;
 }
 
 .app-nav li,
 .app-nav ul {
   display: inline-block;
   list-style: none;
-  margin: 0
+  margin: 0;
 }
 
 .app-nav a {
   color: inherit;
   font-size: 16px;
   text-decoration: none;
-  transition: color .3s
+  transition: color 0.3s;
 }
 
 .app-nav li {
@@ -264,7 +265,7 @@ li input[type=checkbox] {
   margin: 0 1rem;
   padding: 5px 0;
   position: relative;
-  cursor: pointer
+  cursor: pointer;
 }
 
 .app-nav li ul {
@@ -281,7 +282,7 @@ li input[type=checkbox] {
   right: -15px;
   text-align: left;
   top: 100%;
-  white-space: nowrap
+  white-space: nowrap;
 }
 
 .app-nav li ul li {
@@ -289,22 +290,22 @@ li input[type=checkbox] {
   font-size: 14px;
   line-height: 1rem;
   margin: 8px 14px;
-  white-space: nowrap
+  white-space: nowrap;
 }
 
 .app-nav li ul a {
   display: block;
   font-size: inherit;
   margin: 0;
-  padding: 0
+  padding: 0;
 }
 
 .app-nav li ul a.active {
-  border-bottom: 0
+  border-bottom: 0;
 }
 
 .app-nav li:hover ul {
-  display: block
+  display: block;
 }
 
 .github-corner {
@@ -313,16 +314,16 @@ li input[type=checkbox] {
   right: 0;
   text-decoration: none;
   top: 0;
-  z-index: 1
+  z-index: 1;
 }
 
 .github-corner:hover .octo-arm {
-  animation: octocat-wave .56s ease-in-out
+  animation: octocat-wave 0.56s ease-in-out;
 }
 
 .github-corner svg {
   height: 80px;
-  width: 80px
+  width: 80px;
 }
 
 main {
@@ -330,25 +331,25 @@ main {
   position: relative;
   width: 100vw;
   height: 100%;
-  z-index: 0
+  z-index: 0;
 }
 
 main.hidden {
-  display: none
+  display: none;
 }
 
 .anchor {
   display: inline-block;
   text-decoration: none;
-  transition: all .3s
+  transition: all 0.3s;
 }
 
 .anchor:hover {
-  text-decoration: underline
+  text-decoration: underline;
 }
 
 .sidebar {
-  border-right: 1px solid rgba(0, 0, 0, .07);
+  border-right: 1px solid rgba(0, 0, 0, 0.07);
   overflow-y: auto;
   overflow-x: hidden;
   padding: 40px 0 0;
@@ -356,31 +357,31 @@ main.hidden {
   top: 0;
   bottom: 0;
   left: 0;
-  transition: transform .25s;
+  transition: transform 0.25s;
   width: 300px;
-  z-index: 20
+  z-index: 20;
 }
 
-.sidebar>h1 {
+.sidebar > h1 {
   margin: 0 auto 1rem;
   font-size: 1.5rem;
   font-weight: 300;
-  text-align: center
+  text-align: center;
 }
 
-.sidebar>h1 a {
+.sidebar > h1 a {
   color: inherit;
-  text-decoration: none
+  text-decoration: none;
 }
 
-.sidebar>h1 .app-nav {
+.sidebar > h1 .app-nav {
   display: block;
-  position: static
+  position: static;
 }
 
 .sidebar .sidebar-nav {
   line-height: 2em;
-  padding-bottom: 40px
+  padding-bottom: 40px;
 }
 
 .sidebar li.collapse .app-sub-sidebar {
@@ -389,21 +390,21 @@ main.hidden {
 
 .sidebar ul {
   margin: 0 0 0 20px;
-  padding: 0
+  padding: 0;
 }
 
-.sidebar li>p {
+.sidebar li > p {
   font-weight: 700;
-  margin: 0
+  margin: 0;
 }
 
-.sidebar ul>li {
+.sidebar ul > li {
   width: 386px;
 }
 
-.sidebar-nav li>a:has(>img) {
+.sidebar-nav li > a:has(> img) {
   display: inline;
-  transition: all .5s;
+  transition: all 0.5s;
   background-size: 100%;
   padding: 8px 0 10px 134px;
   background-repeat: no-repeat;
@@ -412,31 +413,31 @@ main.hidden {
   transform: translateX(-129px);
 }
 
-.sidebar-nav li>a:has(>img)>p {
+.sidebar-nav li > a:has(> img) > p {
   pointer-events: none;
   font-size: 16px;
-  font-family: 'd7';
+  font-family: "d7";
   display: inline-flex;
   transform: translateY(-12px);
 }
 
-.sidebar li>a>img {
+.sidebar li > a > img {
   pointer-events: none;
   margin-right: 4px;
 }
 
-.sidebar-nav>ul>li>ul>li>a:has(>img):hover {
-  transition: transform .4s cubic-bezier(.16, -0.17, .65, -0.5);
+.sidebar-nav > ul > li > ul > li > a:has(> img):hover {
+  transition: transform 0.4s cubic-bezier(0.16, -0.17, 0.65, -0.5);
   transform: translateX(-103px);
 }
 
-.sidebar-nav>ul>li>a:has(>img):hover {
-  transition: transform .4s cubic-bezier(.16, -0.17, .65, -0.5);
+.sidebar-nav > ul > li > a:has(> img):hover {
+  transition: transform 0.4s cubic-bezier(0.16, -0.17, 0.65, -0.5);
   transform: translateX(-83px);
 }
 
-.sidebar-nav>ul>li>ul>li:has(li.active)>a {
-  transition: transform .1s filter .5s;
+.sidebar-nav > ul > li > ul > li:has(li.active) > a {
+  transition: transform 0.1s filter 0.5s;
   transform: translateX(-103px);
 }
 
@@ -445,13 +446,13 @@ main.hidden {
   transform: translateX(-103px);
 } */
 
-.sidebar-nav>ul>li:has(li.active)>a {
-  transition: transform .1s filter .5s;
+.sidebar-nav > ul > li:has(li.active) > a {
+  transition: transform 0.1s filter 0.5s;
   transform: translateX(-83px);
 }
 
-.sidebar-nav>ul>li.active>a {
-  transition: transform .1s filter .5s;
+.sidebar-nav > ul > li.active > a {
+  transition: transform 0.1s filter 0.5s;
   transform: translateX(-83px);
 }
 
@@ -462,28 +463,28 @@ main.hidden {
 
 .sidebar ul li a {
   border-bottom: none;
-  display: block
+  display: block;
 }
 
 .sidebar ul li ul {
-  padding-left: 20px
+  padding-left: 20px;
 }
 
 .sidebar::-webkit-scrollbar {
-  width: 4px
+  width: 4px;
 }
 
 .sidebar::-webkit-scrollbar-thumb {
   background: transparent;
-  border-radius: 4px
+  border-radius: 4px;
 }
 
 .sidebar:hover::-webkit-scrollbar-thumb {
-  background: #88888866
+  background: #88888866;
 }
 
 .sidebar:hover::-webkit-scrollbar-track {
-  background: #8888881a
+  background: #8888881a;
 }
 
 .sidebar-toggle {
@@ -495,7 +496,7 @@ main.hidden {
   bottom: 0;
   left: 0;
   text-align: center;
-  transition: opacity .3s;
+  transition: opacity 0.3s;
   width: 284px;
   z-index: 30;
   border-radius: 0px 8px 8px 0px;
@@ -517,7 +518,7 @@ main.hidden {
 
 body.sticky .sidebar,
 body.sticky .sidebar-toggle {
-  position: fixed
+  position: fixed;
 }
 
 .content {
@@ -527,35 +528,35 @@ body.sticky .sidebar-toggle {
   right: 0;
   bottom: 0;
   left: 300px;
-  transition: left .25s ease
+  transition: left 0.25s ease;
 }
 
 .markdown-section {
   margin: 0 auto;
   max-width: 90%;
   padding: 30px 15px 40px;
-  position: relative
+  position: relative;
 }
 
-.markdown-section>* {
+.markdown-section > * {
   box-sizing: border-box;
-  font-size: inherit
+  font-size: inherit;
 }
 
-.markdown-section>:first-child {
-  margin-top: 0 !important
+.markdown-section > :first-child {
+  margin-top: 0 !important;
 }
 
 .markdown-section hr {
   border: none;
   border-bottom: 1px solid #eee;
-  margin: 2em 0
+  margin: 2em 0;
 }
 
 .markdown-section:has(iframe[single]) {
   height: 100%;
 
-  &>p {
+  & > p {
     display: block;
     position: absolute;
     padding: 10px;
@@ -575,7 +576,7 @@ body.sticky .sidebar-toggle {
   border: 1px solid #000;
   width: 100%;
   height: 100%;
-  min-width: 100%
+  min-width: 100%;
 }
 
 .markdown-section table {
@@ -584,20 +585,20 @@ body.sticky .sidebar-toggle {
   display: block;
   margin-bottom: 1rem;
   overflow: auto;
-  width: 100%
+  width: 100%;
 }
 
 .markdown-section th {
-  font-weight: 700
+  font-weight: 700;
 }
 
 .markdown-section td,
 .markdown-section th {
-  padding: 6px 13px
+  padding: 6px 13px;
 }
 
 .markdown-section tr {
-  border-top: 1px solid #ccc
+  border-top: 1px solid #ccc;
 }
 
 .markdown-section p.tip {
@@ -606,7 +607,7 @@ body.sticky .sidebar-toggle {
   border-top-right-radius: 2px;
   margin: 2em 0;
   padding: 12px 24px 12px 30px;
-  position: relative
+  position: relative;
 }
 
 .markdown-section p.tip:before {
@@ -614,7 +615,7 @@ body.sticky .sidebar-toggle {
   border-radius: 100%;
   content: "!";
   font-family: d9c, d9;
-  ;
+
   font-size: 14px;
   font-weight: 700;
   left: -12px;
@@ -623,81 +624,79 @@ body.sticky .sidebar-toggle {
   height: 20px;
   width: 20px;
   text-align: center;
-  top: 14px
+  top: 14px;
 }
 
 .markdown-section p.tip code {
-  background-color: #efefef
+  background-color: #efefef;
 }
 
 .markdown-section p.warn {
   border-radius: 2px;
-  padding: 1rem
+  padding: 1rem;
 }
 
-.markdown-section ul.task-list>li {
-  list-style-type: none
+.markdown-section ul.task-list > li {
+  list-style-type: none;
 }
 
 body.close .sidebar {
-  transform: translateX(-300px)
+  transform: translateX(-300px);
 }
 
 body.close .sidebar-toggle {
-  width: auto
+  width: auto;
 }
 
 body.close .content {
-  left: 0
+  left: 0;
 }
 
 @media print {
-
   .app-nav,
   .github-corner,
   .sidebar,
   .sidebar-toggle {
-    display: none
+    display: none;
   }
 }
 
-@media screen and (max-width:768px) {
-
+@media screen and (max-width: 768px) {
   .github-corner,
   .sidebar,
   .sidebar-toggle {
-    position: fixed
+    position: fixed;
   }
 
   .app-nav {
-    margin-top: 16px
+    margin-top: 16px;
   }
 
   .app-nav li ul {
-    top: 30px
+    top: 30px;
   }
 
   main {
     height: 100%;
     min-height: 100vh;
-    overflow-x: hidden
+    overflow-x: hidden;
   }
 
   .sidebar {
     left: -300px;
-    transition: transform .25s ease-out
+    transition: transform 0.25s ease-out;
   }
 
   .content {
     left: 0;
     max-width: 100vw;
     padding: 20px 0;
-    transition: transform .25s ease
+    transition: transform 0.25s ease;
   }
 
   .app-nav,
   .github-corner {
-    transition: transform .25s ease-out
+    transition: transform 0.25s ease-out;
   }
 
   .sidebar-toggle {
@@ -706,48 +705,47 @@ body.close .content {
   }
 
   body.close .sidebar {
-    transform: translateX(300px)
+    transform: translateX(300px);
   }
 
   body.close .sidebar-toggle {
     transition: background-color 1s;
     width: 284px;
-    padding: 10px
+    padding: 10px;
   }
 
   body.close .content {
-    transform: translateX(300px)
+    transform: translateX(300px);
   }
 
   body.close .app-nav,
   body.close .github-corner {
-    display: none
+    display: none;
   }
 
   .github-corner:hover .octo-arm {
-    animation: none
+    animation: none;
   }
 
   .github-corner .octo-arm {
-    animation: octocat-wave .56s ease-in-out
+    animation: octocat-wave 0.56s ease-in-out;
   }
 }
 
 @keyframes octocat-wave {
-
   0%,
   to {
-    transform: rotate(0)
+    transform: rotate(0);
   }
 
   20%,
   60% {
-    transform: rotate(-25deg)
+    transform: rotate(-25deg);
   }
 
   40%,
   80% {
-    transform: rotate(10deg)
+    transform: rotate(10deg);
   }
 }
 
@@ -759,64 +757,64 @@ section.cover {
   background-size: cover;
   min-height: 100vh;
   width: 100%;
-  display: none
+  display: none;
 }
 
 section.cover.show {
-  display: flex
+  display: flex;
 }
 
 section.cover.has-mask .mask {
-  opacity: .8;
+  opacity: 0.8;
   position: absolute;
   top: 0;
   bottom: 0;
-  width: 100%
+  width: 100%;
 }
 
 section.cover .cover-main {
   flex: 1;
   margin: 0 16px;
   text-align: center;
-  position: relative
+  position: relative;
 }
 
 section.cover a {
-  color: inherit
+  color: inherit;
 }
 
 section.cover a,
 section.cover a:hover {
-  text-decoration: none
+  text-decoration: none;
 }
 
 section.cover p {
   line-height: 1.5rem;
-  margin: 1em 0
+  margin: 1em 0;
 }
 
 section.cover h1 {
   color: inherit;
   font-size: 2.5rem;
   font-weight: 300;
-  margin: .625rem 0 2.5rem;
+  margin: 0.625rem 0 2.5rem;
   position: relative;
-  text-align: center
+  text-align: center;
 }
 
 section.cover h1 a {
-  display: block
+  display: block;
 }
 
 section.cover h1 small {
-  bottom: -.4375rem;
+  bottom: -0.4375rem;
   font-size: 1rem;
-  position: absolute
+  position: absolute;
 }
 
 section.cover blockquote {
   font-size: 1.5rem;
-  text-align: center
+  text-align: center;
 }
 
 section.cover ul {
@@ -824,36 +822,36 @@ section.cover ul {
   list-style-type: none;
   margin: 1em auto;
   max-width: 500px;
-  padding: 0
+  padding: 0;
 }
 
-section.cover .cover-main>p:last-child a {
+section.cover .cover-main > p:last-child a {
   border-radius: 2rem;
   box-sizing: border-box;
   display: inline-block;
   font-size: 1.05rem;
-  letter-spacing: .1rem;
-  margin: .5rem 1rem;
-  padding: .75em 2rem;
+  letter-spacing: 0.1rem;
+  margin: 0.5rem 1rem;
+  padding: 0.75em 2rem;
   text-decoration: none;
-  transition: all .15s ease
+  transition: all 0.15s ease;
 }
 
-section.cover .cover-main>p:last-child a:last-child {
-  color: #fff
+section.cover .cover-main > p:last-child a:last-child {
+  color: #fff;
 }
 
-section.cover .cover-main>p:last-child a:last-child:hover {
+section.cover .cover-main > p:last-child a:last-child:hover {
   color: inherit;
-  opacity: .8
+  opacity: 0.8;
 }
 
-section.cover .cover-main>p:last-child a:hover {
-  color: inherit
+section.cover .cover-main > p:last-child a:hover {
+  color: inherit;
 }
 
-section.cover blockquote>p>a {
-  transition: color .3s
+section.cover blockquote > p > a {
+  transition: color 0.3s;
 }
 
 .sidebar ul li a {
@@ -861,25 +859,33 @@ section.cover blockquote>p>a {
   overflow: hidden;
   text-decoration: none;
   text-overflow: ellipsis;
-  white-space: nowrap
+  white-space: nowrap;
 }
 
 .sidebar ul li a:hover {
-  text-decoration: underline
+  text-decoration: underline;
 }
 
 .sidebar ul li ul {
-  padding: 0
+  padding: 0;
 }
 
-.sidebar ul li.active>a {
-  font-weight: 600
+.sidebar ul li.active > a {
+  font-weight: 600;
 }
 
 .app-sub-sidebar li:before {
   content: "-";
   padding-right: 4px;
-  float: left
+  float: left;
+}
+.markdown-section h1,
+.markdown-section h2,
+.markdown-section h3,
+.markdown-section h4 {
+  background: linear-gradient(to right, #0dd3, #0dd0, #0000);
+  padding-left: 0.2em;
+  border-radius: 0.2em;
 }
 
 .markdown-section h1,
@@ -887,63 +893,63 @@ section.cover blockquote>p>a {
 .markdown-section h3,
 .markdown-section h4,
 .markdown-section strong {
-  font-weight: 600
+  font-weight: 600;
 }
 
 .markdown-section a {
-  font-weight: 600
+  font-weight: 600;
 }
 
 .markdown-section h1 {
   font-size: 2rem;
-  margin: 0 0 1rem
+  margin: 0 0 1rem;
 }
 
 .markdown-section h2 {
   font-size: 1.75rem;
-  margin: 45px 0 .8rem
+  margin: 45px 0 0.8rem;
 }
 
 .markdown-section h3 {
   font-size: 1.5rem;
-  margin: 40px 0 .6rem
+  margin: 40px 0 0.6rem;
 }
 
 .markdown-section h4 {
-  font-size: 1.25rem
+  font-size: 1.25rem;
 }
 
 .markdown-section h5 {
-  font-size: 1rem
+  font-size: 1rem;
 }
 
 .markdown-section h6 {
   color: #777;
-  font-size: 1rem
+  font-size: 1rem;
 }
 
 .markdown-section figure,
 .markdown-section ol,
 .markdown-section p,
 .markdown-section ul {
-  margin: 0.5em 0 0 0
+  margin: 0.5em 0 0 0;
 }
 
 .markdown-section ol,
 .markdown-section p,
 .markdown-section ul {
   line-height: 1.5rem;
-  word-spacing: .05rem
+  word-spacing: 0.05rem;
 }
 
 .markdown-section ol,
 .markdown-section ul {
-  padding-left: 1.5rem
+  padding-left: 1.5rem;
 }
 
 .markdown-section blockquote {
   color: #858585;
-  margin: 2em 0;
+  margin: 0 0;
   padding-left: 20px;
   border-top-right-radius: 10px;
   border-bottom-right-radius: 10px;
@@ -951,7 +957,7 @@ section.cover blockquote>p>a {
   transition: transform 0.3s, background-color 0.3s, color 0.3s;
 
   &:hover {
-    transform: translate(0, -5px) rotate(.3deg);
+    transform: translate(0, -5px) rotate(0.3deg);
     transition: transform 0.3s, background-color 0.3s, color 0.3s;
   }
 }
@@ -962,7 +968,7 @@ section.cover blockquote>p>a {
 }
 
 .markdown-section em {
-  color: #7f8c8d
+  color: #7f8c8d;
 }
 
 .markdown-section code,
@@ -973,79 +979,79 @@ section.cover blockquote>p>a {
 
 .markdown-section code,
 .markdown-section pre {
-  background-color: #f8f8f8
+  background-color: #f8f8f8;
 }
 
 .markdown-section output,
 .markdown-section pre {
   margin: 1em 0;
-  position: relative
+  position: relative;
 }
 
 .markdown-section output,
-.markdown-section pre>code {
+.markdown-section pre > code {
   border-radius: 2px;
-  display: block
+  display: block;
 }
 
 .markdown-section output:after,
-.markdown-section pre>code {
+.markdown-section pre > code {
   -moz-osx-font-smoothing: initial;
-  -webkit-font-smoothing: initial
+  -webkit-font-smoothing: initial;
 }
 
 .markdown-section code {
   border-radius: 4px;
   margin: 0 2px;
   padding: 3px 5px;
-  white-space: pre-wrap
+  white-space: pre-wrap;
 }
 
-.markdown-section>:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) code {
-  font-size: .8rem
+.markdown-section > :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) code {
+  font-size: 0.8rem;
 }
 
 .markdown-section pre {
   line-height: 1.5rem;
   overflow: auto;
-  word-wrap: normal
+  word-wrap: normal;
 }
 
-.markdown-section pre>code {
+.markdown-section pre > code {
   color: #525252;
-  font-size: .8rem;
+  font-size: 0.8rem;
   padding: 1em 5px;
   line-height: 1.2em;
   margin: 0 2px;
   max-width: inherit;
   overflow: inherit;
-  white-space: inherit
+  white-space: inherit;
 }
 
 .markdown-section output {
   padding: 1.7rem 1.4rem;
-  border: 1px dotted #ccc
+  border: 1px dotted #ccc;
 }
 
-.markdown-section output>:first-child {
-  margin-top: 0
+.markdown-section output > :first-child {
+  margin-top: 0;
 }
 
-.markdown-section output>:last-child {
-  margin-bottom: 0
+.markdown-section output > :last-child {
+  margin-bottom: 0;
 }
 
 .markdown-section code:after,
 .markdown-section code:before,
 .markdown-section output:after,
 .markdown-section output:before {
-  letter-spacing: .05rem
+  letter-spacing: 0.05rem;
 }
 
 .markdown-section output:after,
 .markdown-section pre:after {
   color: #ccc;
-  font-size: .6rem;
+  font-size: 0.6rem;
   font-weight: 600;
   height: 15px;
   line-height: 15px;
@@ -1054,92 +1060,92 @@ section.cover blockquote>p>a {
   right: 0;
   text-align: right;
   top: 0;
-  content: attr(data-lang)
+  content: attr(data-lang);
 }
 
 .token.cdata,
 .token.comment,
 .token.doctype,
 .token.prolog {
-  color: #8e908c
+  color: #8e908c;
 }
 
 .token.namespace {
-  opacity: .7
+  opacity: 0.7;
 }
 
 .token.boolean,
 .token.number {
-  color: #c76b29
+  color: #c76b29;
 }
 
 .token.punctuation {
-  color: #525252
+  color: #525252;
 }
 
 .token.property {
-  color: #c08b30
+  color: #c08b30;
 }
 
 .token.tag {
-  color: #2973b7
+  color: #2973b7;
 }
 
 .token.selector {
-  color: #6679cc
+  color: #6679cc;
 }
 
 .token.attr-name {
-  color: #2973b7
+  color: #2973b7;
 }
 
 .language-css .token.string,
 .style .token.string,
 .token.entity,
 .token.url {
-  color: #22a2c9
+  color: #22a2c9;
 }
 
 .token.function,
 .token.keyword {
-  color: #e96900
+  color: #e96900;
 }
 
 .token.atrule,
 .token.regex,
 .token.statement {
-  color: #22a2c9
+  color: #22a2c9;
 }
 
 .token.placeholder,
 .token.variable {
-  color: #3d8fd1
+  color: #3d8fd1;
 }
 
 .token.deleted {
-  text-decoration: line-through
+  text-decoration: line-through;
 }
 
 .token.inserted {
   border-bottom: 1px dotted #202746;
-  text-decoration: none
+  text-decoration: none;
 }
 
 .token.italic {
-  font-style: italic
+  font-style: italic;
 }
 
 .token.bold,
 .token.important {
-  font-weight: 700
+  font-weight: 700;
 }
 
 .token.important {
-  color: #c94922
+  color: #c94922;
 }
 
 .token.entity {
-  cursor: help
+  cursor: help;
 }
 
 code .token {
@@ -1147,7 +1153,7 @@ code .token {
   -webkit-font-smoothing: initial;
   min-height: 1.5rem;
   position: relative;
-  left: auto
+  left: auto;
 }
 
 div.bv {
@@ -1159,7 +1165,7 @@ div.bv {
   padding-bottom: 56.25%;
   margin-bottom: 30px;
 
-  &>iframe {
+  & > iframe {
     position: absolute;
     background-color: transparent;
     top: 0;
@@ -1193,7 +1199,7 @@ article.markdown-section {
   image-rendering: pixelated;
 }
 
-article.markdown-section:has(.credit)>ul {
+article.markdown-section:has(.credit) > ul {
   @media screen and (min-width: 1700px) {
     column-count: 5;
   }
@@ -1219,7 +1225,7 @@ article.markdown-section:has(.credit)>ul {
   margin: 10px;
 }
 
-article.markdown-section:has(.credit)>ul>li {
+article.markdown-section:has(.credit) > ul > li {
   margin-left: 20px;
   break-inside: avoid;
   background-color: #7a7a7a79;
@@ -1236,7 +1242,7 @@ article.markdown-section:has(.credit)>ul>li {
   }
 }
 
-article.markdown-section:has(.intro)>.notice {
+article.markdown-section:has(.intro) > .notice {
   padding: 5px;
   display: flex;
   justify-content: center;
@@ -1251,7 +1257,7 @@ article.markdown-section:has(.intro)>.notice {
   animation: notice-shake 5s linear infinite;
 }
 
-article.markdown-section:has(.intro)>.notice[onclick] {
+article.markdown-section:has(.intro) > .notice[onclick] {
   cursor: pointer;
   transition: all 0.5s;
 
@@ -1266,15 +1272,15 @@ div.medium-zoom-overlay {
 
 del {
   text-decoration: none;
-  background-color: #5C5D67;
-  color: #5C5D67;
+  background-color: #5c5d67;
+  color: #5c5d67;
   transition: background-color 0.1s, color 0.1s;
   border-radius: 4px;
   cursor: pointer;
 
   &:hover {
-    background-color: #7B7C84;
-    color: #7B7C84;
+    background-color: #7b7c84;
+    color: #7b7c84;
     transition: background-color 0.1s, color 0.1s;
   }
 
@@ -1285,12 +1291,12 @@ del {
   }
 }
 
-.docsify-copy-code-button{
+.docsify-copy-code-button {
   filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.3));
   padding: 0;
   margin: 0;
   border-radius: 5px;
-  font: 300 12px 'd9c', 'd9';
+  font: 300 12px "d9c", "d9";
 }
 
 .controlSpan {
@@ -1300,10 +1306,10 @@ del {
   display: flex;
   align-items: center;
   justify-content: center;
-  font-family: 'd9', sans-serif;
+  font-family: "d9", sans-serif;
   font-size: 16px;
   height: 30px;
   width: 30px;
   transition: background-color 0.3s, transform 0.2s;
   z-index: 20;
-}
\ No newline at end of file
+}