diff --git a/.github/workflows/records.py b/.github/workflows/records.py
new file mode 100644
index 0000000000..2b364b5d44
--- /dev/null
+++ b/.github/workflows/records.py
@@ -0,0 +1,114 @@
+import sys
+import os
+from datetime import date, datetime, timedelta
+
+input_file = sys.argv[1]
+output_file = sys.argv[2]
+project_root = sys.argv[3]
+
+dc = {}
+if os.path.exists(input_file):
+    print('Found existing input file ' + input_file)
+    with open(input_file, 'r') as f:
+        for line in f.readlines():
+            line = line.strip()
+            if ':' not in line:
+                continue
+            k, v = line.split(':')
+            dc[k] = v
+else:
+    print('Cannot find existing input file ' + input_file)
+
+current_date = date(2024, 2, 25)
+if 'current_date' in dc.keys():
+    dt = datetime.strptime(dc['current_date'], '%Y-%m-%d')
+    current_date = date(dt.year, dt.month, dt.day)
+    if current_date < date(2024, 3, 8):
+        print('Full re-calculate by intention')
+        current_date = date(2024, 2, 25)
+        dc = {}
+latest_date = current_date
+
+users = {}
+for k, v in dc.items():
+    if k == 'current_date' or k == 'skipped_dates':
+        continue
+    users[k] = list(map(lambda s: list(map(int, s.split(','))), v.split('/')))
+
+skipped_dates = []
+if 'skipped_dates' in dc.keys():
+    y, m, d = 0, 0, 0
+    for s in dc['skipped_dates'].split(','):
+        if s[0] == 'y':
+            y = int(s[1:])
+        elif s[0] == 'm':
+            m = int(s[1:])
+        else:
+            for i in range(0, len(s), 2):
+                d = int(s[i:i + 2])
+                skipped_dates.append('%d%02d%02d' % (y, m, d))
+
+yesterday = date.today() - timedelta(days = 1)
+while current_date < yesterday:
+    current_date += timedelta(days = 1)
+    dirname = '%s/daily_problems/%d/%02d/%02d%02d/personal_submission' % (project_root, current_date.year, current_date.month, current_date.month, current_date.day)
+    if not os.path.exists(dirname):
+        skipped_dates.append('%d%02d%02d' % (current_date.year, current_date.month, current_date.day))
+        continue
+
+    submissions = {}
+    for filename in os.listdir(dirname):
+        if not '_' in filename:
+            continue
+        lst = filename.split('.')[0].split('_')
+        pid, uid = lst[0].lower(), '_'.join(lst[1:]).lower()
+        if uid.endswith('_star'):
+            uid = uid[:-5]
+        if uid not in submissions.keys():
+            submissions[uid] = set()
+        submissions[uid].add(pid)
+    
+    for uid, lst in users.items():
+        if uid in submissions.keys():
+            sz = min(2, len(submissions[uid]))
+        else:
+            sz = 0
+        if lst[-1][0] == sz:
+            lst[-1][1] += 1
+        else:
+            lst.append([sz, 1])
+    
+    for uid, st in submissions.items():
+        sz = min(2, len(st))
+        if uid not in users.keys():
+            users[uid] = [[sz, 1]]
+    
+    latest_date = current_date
+
+with open(output_file, 'w') as f:
+    f.write('let records = `\n')
+    f.write('current_date:%s\n' % latest_date.strftime('%Y-%m-%d'))
+    for uid, lst in users.items():
+        s = '/'.join(map(lambda p: str(p[0]) + ',' + str(p[1]), lst))
+        f.write('%s:%s\n' % (uid, s))
+
+    f.write('skipped_dates:')
+    y, m = 0, 0
+    lst = []
+    for s in skipped_dates:
+        if s > '%d%02d%02d' % (latest_date.year, latest_date.month, latest_date.day):
+            break
+        yy, mm, dd = int(s[:4]), int(s[4:6]), int(s[6:])
+        if y != yy:
+            lst.append('y%d' % yy)
+            y = yy
+        if m != mm:
+            lst.append('m%d' % mm)
+            m = mm
+        if lst[-1][0] == 'y' or lst[-1][0] == 'm':
+            lst.append('')
+        lst[-1] += '%02d' % dd
+    f.write(','.join(lst))
+    f.write('\n')
+
+    f.write('`;\n')
diff --git a/.github/workflows/website.yml b/.github/workflows/website.yml
new file mode 100644
index 0000000000..f183f15fdc
--- /dev/null
+++ b/.github/workflows/website.yml
@@ -0,0 +1,54 @@
+name: "Build website"
+
+on:
+  workflow_dispatch:
+  schedule:
+    - cron: '0 2 * * *' # deploy every day at 10:00 UTC+8
+
+jobs:
+  build-website:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Set up Python 3.10
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.10'
+
+      - name: Copy out old record
+        run: |
+          if [ `git ls-remote --heads origin refs/heads/gh-pages | wc -l ` -ne 0 ]
+          then
+            git fetch origin gh-pages:gh-pages
+            git checkout gh-pages
+            if [[ -f records.js ]]
+            then
+              cp records.js /tmp/records.js.old
+            fi
+          fi
+
+      - name: Create gh-pages branch
+        run: |
+          git checkout main
+          git branch -D gh-pages || true
+          git checkout --orphan gh-pages
+
+      - name: Calculate new records and copy out websites
+        run: |
+          cp -r .github/workflows/website /tmp/website
+          python .github/workflows/records.py /tmp/records.js.old /tmp/website/records.js `pwd`
+      
+      - name: Clean everything and copy back websites
+        run: |
+          rm -rf *
+          cp -r /tmp/website/* .
+
+      - name: Push to github
+        run: |
+          git add -A
+          git config --global user.name 'GitHub Actions'
+          git config --global user.email 'actions@github.com'
+          git commit -m "Build website"
+          git push -f origin gh-pages
diff --git a/.github/workflows/website/index.html b/.github/workflows/website/index.html
new file mode 100644
index 0000000000..816082db91
--- /dev/null
+++ b/.github/workflows/website/index.html
@@ -0,0 +1,205 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta http-equiv="expires" content="1800">
+  <title>每日羊蹄🐏</title>
+  <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/tablesorter@2.31.3/dist/js/jquery.tablesorter.combined.min.js"></script>
+  <link href="simple.css" rel="stylesheet">
+</head>
+<body>
+  <div>
+    <h2>每日羊蹄🐏</h2>
+    <div id="user-detail" style="display: none;">
+      <h3 id="user-name">用户：tsreaper</h3>
+      <svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet" viewBox="0 0 721 110" width="100%">
+        <g id="wall" transform="translate(25, 20)">
+          <text text-anchor="middle" class="wday" dx="-13" dy="22" style="font-size: 11px">Mon</text>
+          <text text-anchor="middle" class="wday" dx="-13" dy="48" style="font-size: 11px">Wed</text>
+          <text text-anchor="middle" class="wday" dx="-13" dy="74" style="font-size: 11px">Fri</text>
+        </g>
+      </svg>
+    </div>
+    <div>
+      <h3>统计数据</h3>
+      <p id="p-date">日期：2024-02-26</p>
+      <table id="tbl" class="tablesorter" width="100%">
+        <thead>
+          <tr>
+            <th>ID</th>
+            <th>当前连击天数</th>
+            <th>最长连击天数</th>
+            <th>总提交天数</th>
+            <th>总提交次数</th>
+          </tr>
+        </thead>
+        <tbody id="tb">
+        </tbody>
+      </table>
+    </div>
+  </div>
+
+  <style>
+    #tbl > thead > tr > th {
+      text-align: center;
+    }
+    #tbl > tbody > tr > td {
+      text-align: center;
+    }
+  </style>
+
+  <script src="records.js"></script>
+  <script>
+    function padZero(s, len) {
+      let pad = "";
+      for (let i = 0; i < len - s.length; i++) {
+        pad += "0";
+      }
+      return pad + s;
+    }
+
+    let users = new Object();
+
+    let lines = records.split(/[\r\n]+/);
+    let currentDate = '';
+    let skipped = new Set();
+    for (let line of lines) {
+      line = line.trim();
+      if (line.length == 0) {
+        continue;
+      }
+      if (line.startsWith('current_date:')) {
+        currentDate = line.substr('current_date:'.length);
+        document.getElementById('p-date').innerHTML = `日期：${currentDate}`;
+      } else if (line.startsWith('skipped_dates:')) {
+        let y = 0, m = 0;
+        for (let s of line.substr('skipped_dates:'.length).split(',')) {
+          if (s[0] == 'y') {
+            y = parseInt(s.substr(1));
+          } else if (s[0] == 'm') {
+            m = parseInt(s.substr(1));
+          } else {
+            for (let i = 0; i < s.length; i += 2) {
+              let d = parseInt(s.substr(i, 2));
+              skipped.add(Math.ceil(
+                (new Date(`${y}-${padZero(m.toString(), 2)}-${padZero(d.toString(), 2)}`) - new Date(currentDate)) /
+                (1000 * 60 * 60 * 24)
+              ));
+            }
+          }
+        }
+      } else {
+        let userAndRecord = line.split(':');
+        let user = userAndRecord[0];
+        let record = userAndRecord[1];
+        let runs = record.split('/');
+        let currentStreak = 0;
+        let maxStreak = 0;
+        let totalDays = 0;
+        let totalSubmits = 0;
+
+        users[user] = [];
+        for (let run of runs) {
+          let xy = run.split(',');
+          let submitCount = parseInt(xy[0]);
+          let dayCount = parseInt(xy[1]);
+          users[user].push([submitCount, dayCount]);
+          if (submitCount == 0) {
+            currentStreak = 0;
+          } else {
+            currentStreak += dayCount;
+            totalDays += dayCount;
+            totalSubmits += submitCount * dayCount;
+          }
+          maxStreak = Math.max(maxStreak, currentStreak);
+        }
+        let tr = document.createElement('tr');
+        tr.innerHTML = `<td><a href="#" onclick="showUser('${user}')">${user}</a></td><td>${currentStreak}</td><td>${maxStreak}</td><td>${totalDays}</td><td>${totalSubmits}</td>`;
+        document.getElementById('tb').appendChild(tr);
+      }
+    }
+
+    $(function() {
+      $("#tbl").tablesorter({ sortList: [[1, 1], [2, 1], [3, 1], [4, 1], [0, 0]] });
+    });
+
+    let months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+    function drawWeek(col, days, start) {
+      let xmlns = 'http://www.w3.org/2000/svg';
+      let g = document.createElementNS(xmlns, 'g');
+      g.setAttributeNS(null, 'transform', `translate(${col * 13}, 0)`);
+      for (let i = 0; i < days; i++) {
+        let rect = document.createElementNS(xmlns, 'rect');
+        rect.id = `day${start + i}`;
+        rect.classList.add('day');
+        rect.setAttributeNS(null, 'width', '11');
+        rect.setAttributeNS(null, 'height', '11');
+        rect.setAttributeNS(null, 'y', `${i * 13}`);
+        rect.setAttributeNS(null, 'fill', skipped.has(start + i) ? '#CBCDF0' : '#EBEDF0');
+        g.appendChild(rect);
+      }
+      document.getElementById('wall').appendChild(g);
+
+      let firstDate = new Date(currentDate);
+      firstDate = firstDate.setDate(firstDate.getDate() + start);
+      firstDate = new Date(firstDate);
+      let lastWeek = new Date(currentDate);
+      lastWeek = lastWeek.setDate(lastWeek.getDate() + start - 7);
+      lastWeek = new Date(lastWeek);
+      if (firstDate.getMonth() != lastWeek.getMonth()) {
+        let text = document.createElementNS(xmlns, 'text');
+        text.setAttributeNS(null, 'x', `${col * 13}`);
+        text.setAttributeNS(null, 'y', '-5');
+        text.setAttributeNS(null, 'style', 'font-size: 11px;');
+        text.innerHTML = months[firstDate.getMonth()];
+        document.getElementById('wall').appendChild(text);
+      }
+    }
+
+    let lastColBricks = new Date(currentDate).getDay() % 7 + 1;
+    let earliestBrick = 1 - lastColBricks;
+    drawWeek(52, lastColBricks, earliestBrick);
+    for (let i = 51; i >= 0; i--) {
+      earliestBrick -= 7;
+      drawWeek(i, 7, earliestBrick);
+    }
+
+    function showUser(user) {
+      document.getElementById('user-detail').style.display = '';
+      document.getElementById('user-name').innerHTML = '用户：' + user;
+
+      let now = 0;
+      for (let i = users[user].length - 1; i >= 0; i--) {
+        for (let j = 1; j <= users[user][i][1]; j++) {
+          let t = users[user][i][0];
+          let fill = '#EBEDF0';
+          if (t == 1) {
+            fill = '#40C463';
+          } else if (t == 2) {
+            fill = '#216E39';
+          }
+          document.getElementById(`day${now}`).setAttributeNS(null, 'fill', fill);
+          while (true) {
+            now--;
+            if (now < earliestBrick) {
+              return;
+            }
+            if (!skipped.has(now)) {
+              break;
+            }
+          }
+        }
+      }
+      while (now >= earliestBrick) {
+        if (!skipped.has(now)) {
+          document.getElementById(`day${now}`).setAttributeNS(null, 'fill', '#EBEDF0');
+        }
+        now--;
+      }
+    }
+  </script>
+</body>
+</html>
diff --git a/.github/workflows/website/simple.css b/.github/workflows/website/simple.css
new file mode 100644
index 0000000000..01f401ff4e
--- /dev/null
+++ b/.github/workflows/website/simple.css
@@ -0,0 +1,675 @@
+/* Global variables. */
+:root,
+::backdrop {
+  /* Set sans-serif & mono fonts */
+  --sans-font: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir,
+    "Nimbus Sans L", Roboto, "Noto Sans", "Segoe UI", Arial, Helvetica,
+    "Helvetica Neue", sans-serif;
+  --mono-font: Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
+  --standard-border-radius: 5px;
+
+  /* Default (light) theme */
+  --bg: #fff;
+  --accent-bg: #f5f7ff;
+  --text: #212121;
+  --text-light: #585858;
+  --border: #898EA4;
+  --accent: #0d47a1;
+  --accent-hover: #1266e2;
+  --accent-text: var(--bg);
+  --code: #d81b60;
+  --preformatted: #444;
+  --marked: #ffdd33;
+  --disabled: #efefef;
+}
+
+/* Reset box-sizing */
+*, *::before, *::after {
+  box-sizing: border-box;
+}
+
+/* Reset default appearance */
+textarea,
+select,
+input,
+progress {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+}
+
+html {
+  /* Set the font globally */
+  font-family: var(--sans-font);
+  scroll-behavior: smooth;
+}
+
+/* Make the body a nice central block */
+body {
+  color: var(--text);
+  background-color: var(--bg);
+  font-size: 1.15rem;
+  line-height: 1.5;
+  display: grid;
+  grid-template-columns: 1fr min(45rem, 90%) 1fr;
+  margin: 0;
+}
+body > * {
+  grid-column: 2;
+}
+
+/* Make the header bg full width, but the content inline with body */
+body > header {
+  background-color: var(--accent-bg);
+  border-bottom: 1px solid var(--border);
+  text-align: center;
+  padding: 0 0.5rem 2rem 0.5rem;
+  grid-column: 1 / -1;
+}
+
+body > header > *:only-child {
+  margin-block-start: 2rem;
+}
+
+body > header h1 {
+  max-width: 1200px;
+  margin: 1rem auto;
+}
+
+body > header p {
+  max-width: 40rem;
+  margin: 1rem auto;
+}
+
+/* Add a little padding to ensure spacing is correct between content and header > nav */
+main {
+  padding-top: 1.5rem;
+}
+
+body > footer {
+  margin-top: 4rem;
+  padding: 2rem 1rem 1.5rem 1rem;
+  color: var(--text-light);
+  font-size: 0.9rem;
+  text-align: center;
+  border-top: 1px solid var(--border);
+}
+
+/* Format headers */
+h1 {
+  font-size: 3rem;
+}
+
+h2 {
+  font-size: 2.6rem;
+  margin-top: 3rem;
+}
+
+h3 {
+  font-size: 2rem;
+  margin-top: 3rem;
+}
+
+h4 {
+  font-size: 1.44rem;
+}
+
+h5 {
+  font-size: 1.15rem;
+}
+
+h6 {
+  font-size: 0.96rem;
+}
+
+p {
+  margin: 1.5rem 0;
+}
+
+/* Prevent long strings from overflowing container */
+p, h1, h2, h3, h4, h5, h6 {
+  overflow-wrap: break-word;
+}
+
+/* Fix line height when title wraps */
+h1,
+h2,
+h3 {
+  line-height: 1.1;
+}
+
+/* Reduce header size on mobile */
+@media only screen and (max-width: 720px) {
+  h1 {
+    font-size: 2.5rem;
+  }
+
+  h2 {
+    font-size: 2.1rem;
+  }
+
+  h3 {
+    font-size: 1.75rem;
+  }
+
+  h4 {
+    font-size: 1.25rem;
+  }
+}
+
+/* Format links & buttons */
+a,
+a:visited {
+  color: var(--accent);
+}
+
+a:hover {
+  text-decoration: none;
+}
+
+button,
+.button,
+a.button, /* extra specificity to override a */
+input[type="submit"],
+input[type="reset"],
+input[type="button"],
+label[type="button"] {
+  border: 1px solid var(--accent);
+  background-color: var(--accent);
+  color: var(--accent-text);
+  padding: 0.5rem 0.9rem;
+  text-decoration: none;
+  line-height: normal;
+}
+
+.button[aria-disabled="true"], 
+input:disabled,
+textarea:disabled,
+select:disabled,
+button[disabled] {
+  cursor: not-allowed;
+  background-color: var(--disabled);
+  border-color: var(--disabled);
+  color: var(--text-light);
+}
+
+input[type="range"] {
+  padding: 0;
+}
+
+/* Set the cursor to '?' on an abbreviation and style the abbreviation to show that there is more information underneath */
+abbr[title] {
+  cursor: help;
+  text-decoration-line: underline;
+  text-decoration-style: dotted;
+}
+
+button:enabled:hover,
+.button:not([aria-disabled="true"]):hover,
+input[type="submit"]:enabled:hover,
+input[type="reset"]:enabled:hover,
+input[type="button"]:enabled:hover,
+label[type="button"]:hover {
+  background-color: var(--accent-hover);
+  border-color: var(--accent-hover);
+  cursor: pointer;
+}
+
+.button:focus-visible,
+button:focus-visible:where(:enabled),
+input:enabled:focus-visible:where(
+  [type="submit"],
+  [type="reset"],
+  [type="button"]
+) {
+  outline: 2px solid var(--accent);
+  outline-offset: 1px;
+}
+
+/* Format navigation */
+header > nav {
+  font-size: 1rem;
+  line-height: 2;
+  padding: 1rem 0 0 0;
+}
+
+/* Use flexbox to allow items to wrap, as needed */
+header > nav ul,
+header > nav ol {
+  align-content: space-around;
+  align-items: center;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: center;
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
+
+/* List items are inline elements, make them behave more like blocks */
+header > nav ul li,
+header > nav ol li {
+  display: inline-block;
+}
+
+header > nav a,
+header > nav a:visited {
+  margin: 0 0.5rem 1rem 0.5rem;
+  border: 1px solid var(--border);
+  border-radius: var(--standard-border-radius);
+  color: var(--text);
+  display: inline-block;
+  padding: 0.1rem 1rem;
+  text-decoration: none;
+}
+
+header > nav a:hover,
+header > nav a.current,
+header > nav a[aria-current="page"] {
+  border-color: var(--accent);
+  color: var(--accent);
+  cursor: pointer;
+}
+
+/* Reduce nav side on mobile */
+@media only screen and (max-width: 720px) {
+  header > nav a {
+    border: none;
+    padding: 0;
+    text-decoration: underline;
+    line-height: 1;
+  }
+}
+
+/* Consolidate box styling */
+aside, details, pre, progress {
+  background-color: var(--accent-bg);
+  border: 1px solid var(--border);
+  border-radius: var(--standard-border-radius);
+  margin-bottom: 1rem;
+}
+
+aside {
+  font-size: 1rem;
+  width: 30%;
+  padding: 0 15px;
+  margin-inline-start: 15px;
+  float: right;
+}
+*[dir="rtl"] aside {
+  float: left;
+}
+
+/* Make aside full-width on mobile */
+@media only screen and (max-width: 720px) {
+  aside {
+    width: 100%;
+    float: none;
+    margin-inline-start: 0;
+  }
+}
+
+article, fieldset, dialog {
+  border: 1px solid var(--border);
+  padding: 1rem;
+  border-radius: var(--standard-border-radius);
+  margin-bottom: 1rem;
+}
+
+article h2:first-child,
+section h2:first-child {
+  margin-top: 1rem;
+}
+
+section {
+  border-top: 1px solid var(--border);
+  border-bottom: 1px solid var(--border);
+  padding: 2rem 1rem;
+  margin: 3rem 0;
+}
+
+/* Don't double separators when chaining sections */
+section + section,
+section:first-child {
+  border-top: 0;
+  padding-top: 0;
+}
+
+section:last-child {
+  border-bottom: 0;
+  padding-bottom: 0;
+}
+
+details {
+  padding: 0.7rem 1rem;
+}
+
+summary {
+  cursor: pointer;
+  font-weight: bold;
+  padding: 0.7rem 1rem;
+  margin: -0.7rem -1rem;
+  word-break: break-all;
+}
+
+details[open] > summary + * {
+  margin-top: 0;
+}
+
+details[open] > summary {
+  margin-bottom: 0.5rem;
+}
+
+details[open] > :last-child {
+  margin-bottom: 0;
+}
+
+/* Format tables */
+table {
+  border-collapse: collapse;
+  margin: 1.5rem 0;
+}
+
+figure > table {
+  width: max-content;
+}
+
+td,
+th {
+  border: 1px solid var(--border);
+  text-align: start;
+  padding: 0.5rem;
+}
+
+th {
+  background-color: var(--accent-bg);
+  font-weight: bold;
+}
+
+tr:nth-child(even) {
+  /* Set every other cell slightly darker. Improves readability. */
+  background-color: var(--accent-bg);
+}
+
+table caption {
+  font-weight: bold;
+  margin-bottom: 0.5rem;
+}
+
+/* Format forms */
+textarea,
+select,
+input,
+button,
+.button {
+  font-size: inherit;
+  font-family: inherit;
+  padding: 0.5rem;
+  margin-bottom: 0.5rem;
+  border-radius: var(--standard-border-radius);
+  box-shadow: none;
+  max-width: 100%;
+  display: inline-block;
+}
+textarea,
+select,
+input {
+  color: var(--text);
+  background-color: var(--bg);
+  border: 1px solid var(--border);
+}
+label {
+  display: block;
+}
+textarea:not([cols]) {
+  width: 100%;
+}
+
+/* Add arrow to drop-down */
+select:not([multiple]) {
+  background-image: linear-gradient(45deg, transparent 49%, var(--text) 51%),
+    linear-gradient(135deg, var(--text) 51%, transparent 49%);
+  background-position: calc(100% - 15px), calc(100% - 10px);
+  background-size: 5px 5px, 5px 5px;
+  background-repeat: no-repeat;
+  padding-inline-end: 25px;
+}
+*[dir="rtl"] select:not([multiple]) {
+  background-position: 10px, 15px;
+}
+
+/* checkbox and radio button style */
+input[type="checkbox"],
+input[type="radio"] {
+  vertical-align: middle;
+  position: relative;
+  width: min-content;
+}
+
+input[type="checkbox"] + label,
+input[type="radio"] + label {
+  display: inline-block;
+}
+
+input[type="radio"] {
+  border-radius: 100%;
+}
+
+input[type="checkbox"]:checked,
+input[type="radio"]:checked {
+  background-color: var(--accent);
+}
+
+input[type="checkbox"]:checked::after {
+  /* Creates a rectangle with colored right and bottom borders which is rotated to look like a check mark */
+  content: " ";
+  width: 0.18em;
+  height: 0.32em;
+  border-radius: 0;
+  position: absolute;
+  top: 0.05em;
+  left: 0.17em;
+  background-color: transparent;
+  border-right: solid var(--bg) 0.08em;
+  border-bottom: solid var(--bg) 0.08em;
+  font-size: 1.8em;
+  transform: rotate(45deg);
+}
+input[type="radio"]:checked::after {
+  /* creates a colored circle for the checked radio button  */
+  content: " ";
+  width: 0.25em;
+  height: 0.25em;
+  border-radius: 100%;
+  position: absolute;
+  top: 0.125em;
+  background-color: var(--bg);
+  left: 0.125em;
+  font-size: 32px;
+}
+
+/* Makes input fields wider on smaller screens */
+@media only screen and (max-width: 720px) {
+  textarea,
+  select,
+  input {
+    width: 100%;
+  }
+}
+
+/* Set a height for color input */
+input[type="color"] {
+  height: 2.5rem;
+  padding:  0.2rem;
+}
+
+/* do not show border around file selector button */
+input[type="file"] {
+  border: 0;
+}
+
+/* Misc body elements */
+hr {
+  border: none;
+  height: 1px;
+  background: var(--border);
+  margin: 1rem auto;
+}
+
+mark {
+  padding: 2px 5px;
+  border-radius: var(--standard-border-radius);
+  background-color: var(--marked);
+  color: black;
+}
+
+mark a {
+  color: #0d47a1;
+}
+
+img,
+video {
+  max-width: 100%;
+  height: auto;
+  border-radius: var(--standard-border-radius);
+}
+
+figure {
+  margin: 0;
+  display: block;
+  overflow-x: auto;
+}
+
+figcaption {
+  text-align: center;
+  font-size: 0.9rem;
+  color: var(--text-light);
+  margin-bottom: 1rem;
+}
+
+blockquote {
+  margin-inline-start: 2rem;
+  margin-inline-end: 0;
+  margin-block: 2rem;
+  padding: 0.4rem 0.8rem;
+  border-inline-start: 0.35rem solid var(--accent);
+  color: var(--text-light);
+  font-style: italic;
+}
+
+cite {
+  font-size: 0.9rem;
+  color: var(--text-light);
+  font-style: normal;
+}
+
+dt {
+    color: var(--text-light);
+}
+
+/* Use mono font for code elements */
+code,
+pre,
+pre span,
+kbd,
+samp {
+  font-family: var(--mono-font);
+  color: var(--code);
+}
+
+kbd {
+  color: var(--preformatted);
+  border: 1px solid var(--preformatted);
+  border-bottom: 3px solid var(--preformatted);
+  border-radius: var(--standard-border-radius);
+  padding: 0.1rem 0.4rem;
+}
+
+pre {
+  padding: 1rem 1.4rem;
+  max-width: 100%;
+  overflow: auto;
+  color: var(--preformatted);
+}
+
+/* Fix embedded code within pre */
+pre code {
+  color: var(--preformatted);
+  background: none;
+  margin: 0;
+  padding: 0;
+}
+
+/* Progress bars */
+/* Declarations are repeated because you */
+/* cannot combine vendor-specific selectors */
+progress {
+  width: 100%;
+}
+
+progress:indeterminate {
+  background-color: var(--accent-bg);
+}
+
+progress::-webkit-progress-bar {
+  border-radius: var(--standard-border-radius);
+  background-color: var(--accent-bg);
+}
+
+progress::-webkit-progress-value {
+  border-radius: var(--standard-border-radius);
+  background-color: var(--accent);
+}
+
+progress::-moz-progress-bar {
+  border-radius: var(--standard-border-radius);
+  background-color: var(--accent);
+  transition-property: width;
+  transition-duration: 0.3s;
+}
+
+progress:indeterminate::-moz-progress-bar {
+  background-color: var(--accent-bg);
+}
+
+dialog {
+  max-width: 40rem;
+  margin: auto;
+}
+
+dialog::backdrop {
+  background-color: var(--bg);
+  opacity: 0.8;
+}
+
+@media only screen and (max-width: 720px) {
+  dialog {
+    max-width: 100%;
+    margin: auto 1em;
+  }
+}
+
+/* Superscript & Subscript */
+/* Prevent scripts from affecting line-height. */
+sup, sub {
+  vertical-align: baseline;
+  position: relative;
+}
+
+sup {
+  top: -0.4em;
+}
+
+sub { 
+  top: 0.3em; 
+}
+
+/* Classes for notices */
+.notice {
+  background: var(--accent-bg);
+  border: 2px solid var(--border);
+  border-radius: var(--standard-border-radius);
+  padding: 1.5rem;
+  margin: 2rem 0;
+}
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000000..8e230632ed
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,7 @@
+### VS Code ###
+.vscode/
+
+### Mac OS ###
+.DS_Store
+
+.idea
diff --git a/index.html b/index.html
new file mode 100644
index 0000000000..816082db91
--- /dev/null
+++ b/index.html
@@ -0,0 +1,205 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta http-equiv="expires" content="1800">
+  <title>每日羊蹄🐏</title>
+  <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/tablesorter@2.31.3/dist/js/jquery.tablesorter.combined.min.js"></script>
+  <link href="simple.css" rel="stylesheet">
+</head>
+<body>
+  <div>
+    <h2>每日羊蹄🐏</h2>
+    <div id="user-detail" style="display: none;">
+      <h3 id="user-name">用户：tsreaper</h3>
+      <svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet" viewBox="0 0 721 110" width="100%">
+        <g id="wall" transform="translate(25, 20)">
+          <text text-anchor="middle" class="wday" dx="-13" dy="22" style="font-size: 11px">Mon</text>
+          <text text-anchor="middle" class="wday" dx="-13" dy="48" style="font-size: 11px">Wed</text>
+          <text text-anchor="middle" class="wday" dx="-13" dy="74" style="font-size: 11px">Fri</text>
+        </g>
+      </svg>
+    </div>
+    <div>
+      <h3>统计数据</h3>
+      <p id="p-date">日期：2024-02-26</p>
+      <table id="tbl" class="tablesorter" width="100%">
+        <thead>
+          <tr>
+            <th>ID</th>
+            <th>当前连击天数</th>
+            <th>最长连击天数</th>
+            <th>总提交天数</th>
+            <th>总提交次数</th>
+          </tr>
+        </thead>
+        <tbody id="tb">
+        </tbody>
+      </table>
+    </div>
+  </div>
+
+  <style>
+    #tbl > thead > tr > th {
+      text-align: center;
+    }
+    #tbl > tbody > tr > td {
+      text-align: center;
+    }
+  </style>
+
+  <script src="records.js"></script>
+  <script>
+    function padZero(s, len) {
+      let pad = "";
+      for (let i = 0; i < len - s.length; i++) {
+        pad += "0";
+      }
+      return pad + s;
+    }
+
+    let users = new Object();
+
+    let lines = records.split(/[\r\n]+/);
+    let currentDate = '';
+    let skipped = new Set();
+    for (let line of lines) {
+      line = line.trim();
+      if (line.length == 0) {
+        continue;
+      }
+      if (line.startsWith('current_date:')) {
+        currentDate = line.substr('current_date:'.length);
+        document.getElementById('p-date').innerHTML = `日期：${currentDate}`;
+      } else if (line.startsWith('skipped_dates:')) {
+        let y = 0, m = 0;
+        for (let s of line.substr('skipped_dates:'.length).split(',')) {
+          if (s[0] == 'y') {
+            y = parseInt(s.substr(1));
+          } else if (s[0] == 'm') {
+            m = parseInt(s.substr(1));
+          } else {
+            for (let i = 0; i < s.length; i += 2) {
+              let d = parseInt(s.substr(i, 2));
+              skipped.add(Math.ceil(
+                (new Date(`${y}-${padZero(m.toString(), 2)}-${padZero(d.toString(), 2)}`) - new Date(currentDate)) /
+                (1000 * 60 * 60 * 24)
+              ));
+            }
+          }
+        }
+      } else {
+        let userAndRecord = line.split(':');
+        let user = userAndRecord[0];
+        let record = userAndRecord[1];
+        let runs = record.split('/');
+        let currentStreak = 0;
+        let maxStreak = 0;
+        let totalDays = 0;
+        let totalSubmits = 0;
+
+        users[user] = [];
+        for (let run of runs) {
+          let xy = run.split(',');
+          let submitCount = parseInt(xy[0]);
+          let dayCount = parseInt(xy[1]);
+          users[user].push([submitCount, dayCount]);
+          if (submitCount == 0) {
+            currentStreak = 0;
+          } else {
+            currentStreak += dayCount;
+            totalDays += dayCount;
+            totalSubmits += submitCount * dayCount;
+          }
+          maxStreak = Math.max(maxStreak, currentStreak);
+        }
+        let tr = document.createElement('tr');
+        tr.innerHTML = `<td><a href="#" onclick="showUser('${user}')">${user}</a></td><td>${currentStreak}</td><td>${maxStreak}</td><td>${totalDays}</td><td>${totalSubmits}</td>`;
+        document.getElementById('tb').appendChild(tr);
+      }
+    }
+
+    $(function() {
+      $("#tbl").tablesorter({ sortList: [[1, 1], [2, 1], [3, 1], [4, 1], [0, 0]] });
+    });
+
+    let months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+    function drawWeek(col, days, start) {
+      let xmlns = 'http://www.w3.org/2000/svg';
+      let g = document.createElementNS(xmlns, 'g');
+      g.setAttributeNS(null, 'transform', `translate(${col * 13}, 0)`);
+      for (let i = 0; i < days; i++) {
+        let rect = document.createElementNS(xmlns, 'rect');
+        rect.id = `day${start + i}`;
+        rect.classList.add('day');
+        rect.setAttributeNS(null, 'width', '11');
+        rect.setAttributeNS(null, 'height', '11');
+        rect.setAttributeNS(null, 'y', `${i * 13}`);
+        rect.setAttributeNS(null, 'fill', skipped.has(start + i) ? '#CBCDF0' : '#EBEDF0');
+        g.appendChild(rect);
+      }
+      document.getElementById('wall').appendChild(g);
+
+      let firstDate = new Date(currentDate);
+      firstDate = firstDate.setDate(firstDate.getDate() + start);
+      firstDate = new Date(firstDate);
+      let lastWeek = new Date(currentDate);
+      lastWeek = lastWeek.setDate(lastWeek.getDate() + start - 7);
+      lastWeek = new Date(lastWeek);
+      if (firstDate.getMonth() != lastWeek.getMonth()) {
+        let text = document.createElementNS(xmlns, 'text');
+        text.setAttributeNS(null, 'x', `${col * 13}`);
+        text.setAttributeNS(null, 'y', '-5');
+        text.setAttributeNS(null, 'style', 'font-size: 11px;');
+        text.innerHTML = months[firstDate.getMonth()];
+        document.getElementById('wall').appendChild(text);
+      }
+    }
+
+    let lastColBricks = new Date(currentDate).getDay() % 7 + 1;
+    let earliestBrick = 1 - lastColBricks;
+    drawWeek(52, lastColBricks, earliestBrick);
+    for (let i = 51; i >= 0; i--) {
+      earliestBrick -= 7;
+      drawWeek(i, 7, earliestBrick);
+    }
+
+    function showUser(user) {
+      document.getElementById('user-detail').style.display = '';
+      document.getElementById('user-name').innerHTML = '用户：' + user;
+
+      let now = 0;
+      for (let i = users[user].length - 1; i >= 0; i--) {
+        for (let j = 1; j <= users[user][i][1]; j++) {
+          let t = users[user][i][0];
+          let fill = '#EBEDF0';
+          if (t == 1) {
+            fill = '#40C463';
+          } else if (t == 2) {
+            fill = '#216E39';
+          }
+          document.getElementById(`day${now}`).setAttributeNS(null, 'fill', fill);
+          while (true) {
+            now--;
+            if (now < earliestBrick) {
+              return;
+            }
+            if (!skipped.has(now)) {
+              break;
+            }
+          }
+        }
+      }
+      while (now >= earliestBrick) {
+        if (!skipped.has(now)) {
+          document.getElementById(`day${now}`).setAttributeNS(null, 'fill', '#EBEDF0');
+        }
+        now--;
+      }
+    }
+  </script>
+</body>
+</html>
diff --git a/records.js b/records.js
new file mode 100644
index 0000000000..650b5f0a00
--- /dev/null
+++ b/records.js
@@ -0,0 +1,188 @@
+let records = `
+current_date:2024-09-14
+hum:2,64/1,1/2,6/1,1/2,5/1,1/2,19/1,1/2,3/1,1/2,17/1,1/2,5/1,1/2,3/1,3/2,7/1,1/2,1/0,1/2,4/1,3/2,3/1,4/2,2/0,1/2,2/1,1/2,1/0,1/1,1/2,1/0,2/1,1/2,3/1,2
+tsreaper:2,174
+lengli:2,158/1,1/2,15
+sugar:1,1/0,173
+lyxxys:1,1/0,50/2,3/1,1/2,9/1,2/2,1/1,2/2,1/1,1/2,11/1,1/2,5/1,1/2,1/1,1/2,25/1,1/2,32/1,1/2,5/1,2/2,4/1,1/2,5/1,1/2,1/0,1/2,3/1,1
+mikeac:2,27/0,3/2,7/0,5/2,1/0,5/2,3/0,2/2,1/0,6/2,4/0,110
+ncf:1,15/0,3/1,48/2,1/1,6/2,1/1,5/2,1/1,6/2,1/1,28/2,1/1,4/2,2/1,5/2,1/0,1/1,3/2,1/1,4/0,1/1,10/0,26
+yawn_sean:2,174
+grobycn:1,3/2,2/1,1/2,45/1,1/2,1/1,1/2,4/1,1/2,1/1,2/2,1/1,6/2,1/1,1/0,1/2,2/1,2/2,3/1,3/2,1/1,1/2,1/0,1/2,1/0,1/2,5/1,1/2,4/0,1/2,1/0,1/1,1/2,1/1,1/2,2/1,3/2,1/1,1/2,1/1,9/2,1/1,1/2,1/1,2/2,1/1,2/0,2/1,1/2,2/1,2/2,1/1,2/0,1/1,1/0,11/1,9/0,1/2,2/1,1/2,1/0,2/1,3/0,1/1,1/0,1
+tauros:2,54/0,120
+leoncn:1,1/2,1/1,1/2,2/1,1/2,3/1,4/2,1/1,1/2,11/1,4/2,3/1,2/2,2/1,2/2,1/1,2/2,4/1,2/2,7/1,1/2,2/1,1/2,4/1,5/2,1/1,1/2,1/1,7/2,5/1,1/2,3/1,3/2,3/1,1/2,11/1,1/2,1/1,1/2,2/1,10/2,4/1,1/2,5/1,21/2,1/1,19/2,3
+md:1,2/0,2/1,2/0,3/1,6/2,8/1,1/2,3/1,3/2,20/1,1/2,1/1,2/2,4/1,1/2,5/1,1/2,6/1,1/2,3/1,1/2,1/1,1/2,3/1,3/2,5/1,1/2,5/1,1/2,1/1,5/2,1/1,1/2,1/1,3/2,1/1,1/2,1/1,1/2,4/1,4/2,4/1,20/0,1/1,2/0,1/1,26
+retyrn:1,1/2,3/1,3/2,1/1,2/2,1/1,1/2,2/1,1/2,3/1,1/2,3/1,2/2,3/1,1/2,1/1,1/2,3/1,2/2,3/1,1/2,1/1,2/2,5/1,1/2,5/1,1/2,4/1,1/2,5/1,1/2,6/1,1/2,5/1,1/2,23/1,1/2,5/1,1/2,22/1,1/2,1/0,1/2,33/1,1/2,7
+k423:2,1/0,1/2,1/0,3/2,4/0,1/2,63/0,99
+linxiaotian:2,3/0,6/1,1/0,2/2,1/1,1/2,2/0,4/2,1/1,2/2,2/0,2/1,1/0,3/2,1/0,141
+cc4414:1,1/2,3/1,1/0,44/1,1/0,11/1,1/0,2/1,1/2,2/0,3/1,1/0,4/1,1/0,8/2,1/1,1/0,1/1,2/2,1/1,4/2,1/0,8/2,1/0,69
+jinyumantang:1,2/0,62/2,2/0,19/1,1/0,38/1,2/0,19/1,1/0,26
+leander:1,1/0,1/1,2/2,1/0,14/2,1/0,152
+dinghc:1,4/2,3/1,3/2,1/1,2/2,1/1,3/2,1/1,3/2,1/0,1/2,2/1,3/2,2/1,1/2,1/1,2/2,3/1,4/2,2/1,1/2,2/1,1/2,1/0,1/1,4/0,2/1,3/0,1/1,5/0,5/1,1/0,3/1,3/0,4/1,2/0,2/1,2/0,4/1,1/0,1/1,4/0,1/1,3/0,5/1,1/0,2/2,1/1,2/2,1/0,1/1,1/2,1/1,3/0,2/1,4/0,5/1,1/0,2/1,1/0,1/1,2/0,1/1,1/0,1/1,3/0,2/1,2/2,2/0,1/1,4/0,5/1,3/0,2/1,4/0,3/1,2
+arrogant_sword:1,4/2,1/1,1/2,1/1,2/2,1/1,3/0,1/1,1/2,1/1,2/2,1/1,6/0,21/2,4/1,3/2,3/1,1/2,1/1,1/2,1/1,3/0,1/2,1/0,1/2,1/0,2/1,1/2,1/1,1/2,1/0,8/1,1/2,1/1,1/2,9/1,1/2,7/1,1/2,1/1,1/0,2/2,3/0,5/2,2/0,2/2,1/0,53
+aging1986:1,1/0,62/2,2/0,106
+hongrock:2,1/0,5/2,5/1,1/2,13/0,146
+test:1,1/0,170
+cpchenpi:1,1/0,169
+jie_chen:1,1/0,167
+retyn:1,1/0,167
+rememorio:1,2/0,164
+jokemaker:1,1/0,1/1,3/0,9/1,1/0,151
+yefei162:1,1/0,10/2,1/1,2/0,1/1,1/2,2/1,17/2,1/1,4/2,1/1,4/0,1/1,3/2,1/1,1/2,1/1,6/2,1/1,1/2,1/1,1/2,1/1,5/2,1/1,8/2,2/1,2/2,1/1,6/2,2/1,4/2,1/1,7/0,2/1,5/2,2/1,6/0,1/1,2/0,8/1,1/0,2/1,1/0,34
+yangsisi:1,1/0,53/1,1/0,111
+fatalerror:1,1/0,20/2,4/1,2/2,4/1,1/0,1/2,3/0,3/2,2/0,1/2,2/1,1/2,6/0,6/2,4/0,2/2,1/0,16/2,2/0,11/2,2/0,9/2,1/0,9/2,1/0,4/2,1/0,2/2,1/0,3/2,1/0,14/2,1/0,6/2,3/0,14
+ynotbbetter:2,15/0,149
+gh123:1,2/0,2/1,1/0,5/1,1/0,1/1,1/0,2/1,2/0,2/1,1/0,2/1,2/0,1/1,3/0,3/1,1/0,2/1,1/0,1/1,1/0,2/1,1/0,1/1,2/0,1/1,3/0,1/1,1/0,1/1,4/0,4/1,5/0,1/1,1/0,1/1,1/0,2/1,1/0,1/1,1/0,6/1,1/0,1/1,5/0,1/1,1/0,2/1,1/0,3/1,4/0,2/1,1/0,2/1,1/0,3/1,1/0,10/1,1/0,1/1,2/0,2/1,1/0,1/1,2/0,2/1,4/0,2/1,1/0,2/1,1/0,8/1,1/0,1/1,2/0,2/1,4/0,2/1,4
+sheepstick:2,54/0,15/2,9/0,84
+nreyog:1,1/0,7/1,1/0,12/1,1/0,140
+iron_buster:1,1/0,13/1,2/0,24/1,1/0,24/1,1/0,22/1,1/0,12/1,1/0,60
+ggl:1,1/0,8/1,1/0,16/1,2/0,54/1,1/0,45/1,1/0,33
+ku:1,2/0,1/1,9/0,1/1,3/0,3/1,3/0,1/1,1/0,1/1,2/0,10/1,1/0,5/1,1/0,1/1,2/0,7/1,2/0,12/1,2/0,10/1,1/0,4/1,1/0,1/1,3/0,1/2,1/1,2/0,4/1,1/0,1/1,1/0,5/1,1/0,1/1,1/2,1/0,1/1,2/0,5/1,1/0,3/1,1/0,28/1,4/0,5/1,1/0,1
+harmonly:1,2/0,1/1,1/0,1/2,2/1,1/0,1/1,1/0,14/1,1/0,2/1,1/0,13/1,1/0,5/1,1/0,114
+windly:1,4/2,2/1,11/2,1/1,5/0,138
+djl777:2,1/0,4/2,1/0,83/2,1/0,5/2,1/0,35/2,2/0,4/2,1/0,5/2,1/0,17
+toc:1,1/0,1/1,1/0,1/1,2/0,1/1,3/0,1/1,1/0,1/1,4/2,1/1,2/0,3/1,19/0,1/1,5/0,1/1,2/0,1/1,1/0,3/1,10/0,1/1,1/0,1/1,14/0,1/1,11/0,66
+inhng:1,2/2,1/0,1/1,73/2,1/1,16/2,1/1,29/0,36
+yss:1,1/0,159
+deckedge:1,1/0,11/1,1/0,2/2,2/0,2/1,1/0,1/1,4/0,2/1,1/2,1/1,2/2,1/0,1/1,3/2,1/1,1/0,1/1,1/2,1/1,1/2,2/1,1/2,4/1,2/2,5/1,3/2,1/1,3/2,3/1,1/0,10/2,3/0,2/1,1/2,1/1,2/0,1/1,1/0,1/1,2/0,2/1,1/0,1/2,1/1,2/0,5/1,1/0,3/1,2/0,3/1,1/0,2/1,1/0,2/1,2/0,1/1,1/0,4/1,1/0,4/1,3/0,1/1,2/0,2/1,1/0,19
+sprite:1,1/0,4/2,1/1,2/0,1/2,1/0,1/1,3/0,1/2,1/1,5/2,2/1,3/0,1/1,5/0,1/1,2/0,1/1,1/0,122
+ldh:2,10/0,3/2,2/0,72/2,6/0,64
+wink:1,4/2,1/0,2/1,8/0,4/1,4/0,8/1,1/0,1/1,1/0,1/1,2/0,51/2,1/0,68
+octal2024:2,1/0,1/1,2/0,152
+dwq:1,2/0,1/1,4/0,1/1,2/0,2/1,5/0,1/1,4/0,2/1,4/0,1/1,9/0,4/1,3/0,111
+pdocw:2,1/1,36/0,17/1,4/0,44/1,2/0,16/1,6/0,30
+wanderovo:2,4/1,2/2,1/1,5/2,1/1,4/2,4/1,5/2,1/1,3/2,4/1,1/2,1/1,1/2,3/1,1/2,1/1,2/2,2/1,2/2,5/1,3/2,1/1,1/2,1/1,1/2,3/1,2/2,8/1,1/2,1/1,1/2,1/1,1/2,1/1,1/2,3/1,1/2,2/1,1/2,2/1,1/2,5/1,1/2,1/1,1/2,1/1,3/2,1/1,12/2,1/1,2/2,5/1,1/2,1/1,2/2,1/1,4/2,1/1,4/0,1/1,4/0,1/1,11/2,1/1,1
+override:1,52/2,1/1,18/2,1/1,26/0,2/1,1/0,55
+hang:1,115/0,1/1,23/0,1/1,16
+wangggong:1,1/0,3/2,1/0,5/2,2/1,1/0,1/1,2/2,1/1,1/0,1/1,1/0,2/1,1/0,3/1,1/0,4/1,3/0,1/1,2/0,12/1,4/0,3/2,1/0,1/1,1/0,3/1,2/0,2/1,4/0,23/1,1/0,60
+goodluck_ccq:1,2/0,1/2,1/0,149
+yskm-an:1,1/0,1/1,10/2,1/1,3/0,135
+ranzhi:1,1/0,4/1,2/0,1/1,1/0,1/1,1/0,13/1,3/0,1/1,1/2,1/1,5/2,1/1,1/0,3/1,2/0,1/1,5/0,2/1,1/0,37/1,3/0,3/1,8/0,48
+hopeworse:2,8/1,2/2,11/1,1/2,5/1,2/2,1/0,119
+dwq_n:1,1/0,148
+550n:1,4/0,1/1,1/0,121/2,2/1,2/0,18
+subcrip:2,1/0,143
+anonymous:1,1/0,3/1,1/0,138
+lu_xz:1,1/2,2/1,1/2,3/1,1/0,1/1,1/0,4/1,1/0,3/2,9/1,1/2,1/1,1/0,4/2,5/0,1/2,9/0,6/2,1/0,2/2,3/0,1/2,8/0,18/2,1/0,53
+yakultgo:1,1/2,29/0,1/2,5/0,1/2,3/0,1/2,6/0,2/2,4/0,1/2,6/0,1/2,3/0,1/2,1/0,1/2,11/0,2/2,9/0,2/2,1/0,1/2,3/0,1/2,2/0,1/2,2/0,9/2,1/0,6/2,1/0,20
+windj0y:2,1/0,5/2,10/1,2/2,4/1,1/2,4/1,3/2,1/1,3/2,1/1,4/0,1/1,1/0,3/1,1/0,93
+shawnqiang:1,2/0,37/1,1/0,3/1,1/0,93
+zhangk33:1,1/2,1/0,135
+mymsx:1,1/0,5/1,1/0,1/1,2/0,1/1,1/0,1/1,1/0,1/1,2/0,119
+mrsuns:2,3/1,1/2,3/1,1/2,7/1,1/2,1/1,1/2,1/0,3/1,1/2,2/1,1/0,2/1,1/2,4/0,3/2,1/0,5/2,2/0,3/1,1/0,30/1,2/0,20/2,1/0,1/2,1/0,1/2,2/0,6/2,2/1,1/0,21
+liketheflower:2,7/1,6/2,1/1,6/0,116
+buxiang-qichuang:1,1/0,17/1,2/0,2/1,3/0,109
+buxiang_qichuang:1,1/0,133
+jy_xiaoying:2,2/1,2/0,11/1,28/0,1/1,1/0,1/1,7/0,2/1,1/0,12/1,2/0,1/1,1/0,10/1,1/0,1/1,2/0,8/1,1/0,2/1,1/0,1/1,1/0,3/1,1/0,1/1,1/0,4/1,1/0,1/1,2/0,18
+lang:1,1/0,130
+absndon2:1,1/0,130
+anandon2:1,1/0,42/1,1/0,87
+xylu:2,2/1,1/0,1/2,2/1,6/2,1/1,1/2,1/1,1/2,5/1,1/2,11/1,1/2,7/1,3/2,4/1,1/0,3/2,1/1,1/2,4/0,72
+qiuuuuut:1,1/0,129
+abandon2:2,13/1,1/0,1/2,7/1,1/2,4/0,1/2,5/0,1/1,1/2,3/1,1/0,1/2,2/1,1/2,2/0,1/2,1/1,1/2,1/1,1/2,1/0,1/1,2/2,2/0,4/2,2/1,1/2,8/0,11/2,4/1,2/2,1/0,41
+qiuuuuuut:1,1/0,39/2,1/1,1/2,1/0,1/2,2/1,1/2,2/0,2/2,1/1,1/0,75
+1zhao:2,1/1,1/2,1/1,1/2,2/0,37/1,1/0,35/1,1/2,2/1,4/0,4/1,1/0,13/2,1/0,2/1,2/0,19
+yoonsica:2,6/0,63/2,2/0,1/2,2/1,1/0,3/2,4/1,1/0,1/2,1/0,41
+smallboatc:2,1/1,1/0,2/1,2/0,87/1,1/0,32
+amani:1,1/0,2/1,3/2,1/0,1/1,4/0,1/1,1/0,2/1,3/0,1/1,1/0,1/1,2/0,2/1,1/0,1/1,2/2,1/1,5/0,2/1,4/0,1/2,1/1,4/0,17/1,1/0,60
+equinox:1,4/2,3/0,4/2,5/0,14/2,2/1,1/2,1/0,2/2,12/1,3/2,1/1,2/0,7/2,2/0,1/2,1/0,1/2,12/1,1/2,3/1,1/0,1/2,12/0,1/2,1/0,1/2,1/0,3/2,10/0,1/2,1/0,1/2,1/0,1/1,1/2,3/0,1/2,3
+sjw712:2,2/0,101/2,10/1,1/2,12
+cat丶:1,3/0,122
+zongjy:2,3/1,2/2,1/1,1/2,1/0,1/1,1/2,4/0,3/2,1/1,1/2,1/0,105
+empty_dust:2,3/0,11/2,1/1,1/0,1/2,1/0,1/1,1/0,104
+octal:1,1/0,35/2,1/1,2/0,85
+baozii:1,4/0,21/2,1/0,3/1,4/2,1/1,2/2,5/1,1/2,1/1,2/0,31/1,1/0,46
+kokomi:2,1/1,1/2,2/1,1/2,1/0,2/2,4/1,1/0,1/2,1/0,35/2,1/1,2/0,69
+baile:1,3/0,7/1,1/0,2/1,2/0,1/1,1/0,2/1,1/0,4/1,2/0,96
+lu1no:2,1/0,35/1,1/2,1/0,44/2,2/1,4/0,34
+little_j:1,1/0,121
+minsongkang1:1,1/0,120
+luchy0120:2,11/1,2/2,9/1,1/2,1/1,1/0,96
+rui_er:2,12/0,108
+lyxxyx:1,1/0,119
+pandaomeng:1,1/0,1/1,1/2,1/1,1/0,1/1,4/0,13/1,1/0,96
+djzzwx:1,1/2,1/0,4/2,4/1,2/2,3/1,1/2,1/0,1/2,3/0,3/2,3/0,3/2,1/0,1/2,3/0,2/2,1/0,4/2,1/1,1/2,1/0,75
+if:1,16/2,1/1,31/0,72
+lxcxz:1,1/0,25/1,1/0,93
+37:1,1/0,8/1,1/0,21/1,1/0,87
+zone:2,1/0,1/1,1/0,2/2,4/1,2/2,1/1,1/2,3/1,1/2,1/1,3/2,1/1,1/2,4/1,2/0,2/2,1/1,2/2,1/1,3/0,4/2,4/1,1/0,5/1,1/0,4/1,1/0,25/2,1/0,21/2,1/0,1/2,2/0,1/2,1/0,4/2,2/0,1/2,1
+y_hc:1,3/0,3/1,1/0,48/1,1/0,63
+slashteen:1,5/0,67/1,1/0,46
+brusgry:2,1/0,117
+banfenhaochi:1,2/0,34/1,1/0,5/1,1/0,5/1,1/0,5/1,2/0,60
+rainmemery:1,1/0,114
+pandoameng:1,1/0,114
+xyz_herry:1,2/0,2/1,3/0,14/1,1/0,93
+dawnmagnet:2,1/0,6/2,2/0,46/2,1/0,9/2,1/0,10/2,1/0,37
+lazysheep:1,11/0,37/1,1/0,5/1,1/0,23/2,1/0,1/1,2/0,20/1,2/0,10
+buer:1,1/2,1/1,1/2,1/1,1/0,1/2,3/1,1/2,1/1,1/0,1/2,3/0,9/2,3/0,1/1,3/0,5/2,1/1,3/0,66/1,1/0,6
+kangminsong0:1,1/0,1/1,1/0,110
+limerence:1,1/2,2/1,1/2,2/0,1/1,1/0,2/1,1/0,1/1,1/0,1/1,2/0,1/1,1/0,1/1,1/0,4/1,1/0,84
+cming:2,2/0,22/1,1/0,83
+pangyou3s:1,1/0,106
+jerry66:2,1/0,11/2,1/0,4/2,2/0,4/2,1/0,10/2,1/0,16/1,1/0,54
+lengnian7:1,1/0,5/1,1/2,2/0,93
+openmi:1,6/0,1/1,9/0,17/1,4/2,2/1,4/0,6/1,15/2,1/1,6/0,15/1,1/0,15
+kurtis:2,3/1,9/2,1/1,1/0,2/1,1/2,2/0,2/1,2/2,2/1,12/2,5/1,6/0,54
+echo:1,2/0,1/1,2/0,16/1,1/0,79
+rocky:2,2/0,99
+cxhscst2:2,3/0,1/2,3/1,1/2,1/1,3/2,1/1,6/0,34/1,1/0,46
+dijs_sdd:1,4/0,6/1,1/0,1/1,1/0,2/1,1/0,4/1,1/0,2/1,1/0,24/1,1/0,48
+sigma-yyf:2,1/1,1/0,2/1,1/0,8/1,2/0,3/2,2/1,1/0,1/1,1/0,2/1,1/0,70
+yrlpiao:2,1/1,2/2,8/1,1/2,2/1,1/0,1/2,1/0,2/2,1/0,1/1,1/0,2/1,1/0,1/1,1/0,7/1,1/0,4/1,1/0,5/1,1/0,5/2,2/1,1/0,9/2,4/0,29
+lengnian:1,1/0,12/2,11/0,3/2,1/0,9/2,2/0,1/2,4/1,1/2,1/0,1/2,2/1,1/2,3/1,2/2,1/1,2/2,6/1,1/2,3/1,2/2,1/1,2/2,1/0,1/2,5/1,1/2,1/0,2/2,1/1,1/2,2/1,2/2,1/1,1/2,4
+eunoiay:2,3/1,2/0,10/1,1/0,7/2,1/0,65
+ran_zhi:1,1/0,1/1,4/2,1/1,1/0,3/1,1/0,1/1,2/0,73
+xuwuze:1,2/0,83
+tiger2005:2,70/0,14
+zazhiii:1,2/0,53/1,2/0,23
+lettera:1,2/2,1/1,3/0,15/1,1/2,1/1,3/2,2/0,3/1,1/0,2/1,1/0,1/1,6/0,2/1,1/2,1/1,1/2,2/0,2/1,4/0,2/2,1/1,1/2,1/1,1/0,1/1,3/2,1/0,1/1,1/0,3/1,1/0,1/1,1/0,2/2,2/1,1/0,1
+metal_frog:1,1/0,30/2,9/1,1/2,23/0,1/2,1/1,1/2,7/1,4/0,1
+zyc:1,1/0,76
+alwaysce:1,1/2,1/1,3/2,1/1,2/2,1/1,2/2,3/1,1/2,5/1,1/2,1/1,1/2,5/1,1/2,1/0,5/2,4/1,2/2,11/1,1/2,11/1,1/2,4/1,1/2,7
+sjohn:2,3/0,74
+meikisisui:1,4/0,2/1,1/0,1/1,1/0,3/1,1/0,3/1,1/0,2/1,2/0,2/1,2/0,5/1,1/0,1/1,1/0,2/2,1/1,3/0,2/1,3/2,1/0,1/1,1/2,1/1,4/2,2/1,7/2,2/1,1/2,4/1,4/2,3/1,1
+deemo_ml:1,7/0,69
+dbwglx:1,1/0,75
+kamtuo:2,30/1,1/2,16/0,1/1,1/2,4/0,1/2,5/0,1/2,5/0,1/1,1/0,1/2,4
+kod:1,2/0,2/1,1/0,3/1,1/0,3/1,1/0,15/1,1/0,1/1,2/0,23/2,1/0,14
+lyongwolf:1,1/0,1/1,1/2,4/1,10/0,5/1,1/0,2/1,1/0,43
+liryc:1,16/2,2/1,6/2,1/1,6/2,1/1,1/2,1/1,26/2,1/1,5/0,1/1,2
+arrogant_sword,cpp:1,1/0,68
+kita_ikuyo:2,1/0,1/1,2/0,38/2,1/1,1/2,1/0,21
+sbjohn:2,1/0,1/2,1/0,10/2,2/0,4/2,1/0,1/2,1/0,1/1,1/0,40
+yefei:1,1/0,63
+bond_james:1,1/2,3/0,10/1,2/0,3/1,1/0,2/1,1/0,1/1,1/0,4/1,1/0,31
+crzhou:1,1/0,1/2,1/0,3/2,9/0,3/1,1/0,1/2,4/0,7/1,1/2,1/1,1/0,2/2,2/0,3/1,1/0,18
+fancyalad:1,4/0,2/1,1/0,1/1,2/0,5/1,1/0,36
+xzx:1,4/0,1/1,1/0,43
+catchfree1225:2,5/1,1/2,2/1,1/2,1/1,1/0,2/2,4/1,1/2,2/1,4/2,2/1,4/2,2/1,10/2,1/0,1/1,4
+mono_4:1,1/0,1/1,1/0,8/1,1/0,36
+kamito:1,8/0,40
+lengian:1,1/0,14/1,1/0,31
+jun:2,1/0,45
+innerworldexplorer:2,1/0,1/1,10/2,2/1,19/2,1/1,4/2,2/1,2
+legnian:1,1/0,39
+zrnstnsr:2,12/1,1/2,1/0,1/2,10/1,2/2,6/0,2/1,1/2,1/1,1/0,1
+yunc:1,1/0,37
+xiaoretaw:2,6/0,1/2,1/0,2/1,1/0,25
+boulimhh:1,23/0,1/1,11
+humn:1,1/0,32
+sdjasj:1,3/0,7/2,1/1,1/0,21
+zrnstnr:1,1/0,26
+crzhou,py:1,1/0,26
+stcnpc:1,3/0,2/1,1/0,6/1,1/0,14
+kmiao:1,2/2,1/0,2/2,1/0,1/1,1/0,8/1,1/0,9
+wanerovo:1,1/0,18
+jackeyhua:1,2/2,1/1,5/0,11
+yuexihuachen:1,1/0,5/1,2/0,9
+bonelight:1,1/2,8/1,1/2,6
+metal_grog:1,1/0,14
+_boulimhh:1,1/0,11
+javaminus:1,2/2,1/1,2/2,1/1,1/2,2/1,2
+artoor:1,1/0,10
+lettear:1,1/0,7
+gaoeight:2,1/1,1/0,1/2,1/1,2
+juyou:1,1/0,4
+skipped_dates:y2024,m3,0310172431,m4,07142128,m5,05121926,m6,0209162330,m7,07142128,m8,04111825,m9,0108
+`;
diff --git a/simple.css b/simple.css
new file mode 100644
index 0000000000..01f401ff4e
--- /dev/null
+++ b/simple.css
@@ -0,0 +1,675 @@
+/* Global variables. */
+:root,
+::backdrop {
+  /* Set sans-serif & mono fonts */
+  --sans-font: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir,
+    "Nimbus Sans L", Roboto, "Noto Sans", "Segoe UI", Arial, Helvetica,
+    "Helvetica Neue", sans-serif;
+  --mono-font: Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
+  --standard-border-radius: 5px;
+
+  /* Default (light) theme */
+  --bg: #fff;
+  --accent-bg: #f5f7ff;
+  --text: #212121;
+  --text-light: #585858;
+  --border: #898EA4;
+  --accent: #0d47a1;
+  --accent-hover: #1266e2;
+  --accent-text: var(--bg);
+  --code: #d81b60;
+  --preformatted: #444;
+  --marked: #ffdd33;
+  --disabled: #efefef;
+}
+
+/* Reset box-sizing */
+*, *::before, *::after {
+  box-sizing: border-box;
+}
+
+/* Reset default appearance */
+textarea,
+select,
+input,
+progress {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+}
+
+html {
+  /* Set the font globally */
+  font-family: var(--sans-font);
+  scroll-behavior: smooth;
+}
+
+/* Make the body a nice central block */
+body {
+  color: var(--text);
+  background-color: var(--bg);
+  font-size: 1.15rem;
+  line-height: 1.5;
+  display: grid;
+  grid-template-columns: 1fr min(45rem, 90%) 1fr;
+  margin: 0;
+}
+body > * {
+  grid-column: 2;
+}
+
+/* Make the header bg full width, but the content inline with body */
+body > header {
+  background-color: var(--accent-bg);
+  border-bottom: 1px solid var(--border);
+  text-align: center;
+  padding: 0 0.5rem 2rem 0.5rem;
+  grid-column: 1 / -1;
+}
+
+body > header > *:only-child {
+  margin-block-start: 2rem;
+}
+
+body > header h1 {
+  max-width: 1200px;
+  margin: 1rem auto;
+}
+
+body > header p {
+  max-width: 40rem;
+  margin: 1rem auto;
+}
+
+/* Add a little padding to ensure spacing is correct between content and header > nav */
+main {
+  padding-top: 1.5rem;
+}
+
+body > footer {
+  margin-top: 4rem;
+  padding: 2rem 1rem 1.5rem 1rem;
+  color: var(--text-light);
+  font-size: 0.9rem;
+  text-align: center;
+  border-top: 1px solid var(--border);
+}
+
+/* Format headers */
+h1 {
+  font-size: 3rem;
+}
+
+h2 {
+  font-size: 2.6rem;
+  margin-top: 3rem;
+}
+
+h3 {
+  font-size: 2rem;
+  margin-top: 3rem;
+}
+
+h4 {
+  font-size: 1.44rem;
+}
+
+h5 {
+  font-size: 1.15rem;
+}
+
+h6 {
+  font-size: 0.96rem;
+}
+
+p {
+  margin: 1.5rem 0;
+}
+
+/* Prevent long strings from overflowing container */
+p, h1, h2, h3, h4, h5, h6 {
+  overflow-wrap: break-word;
+}
+
+/* Fix line height when title wraps */
+h1,
+h2,
+h3 {
+  line-height: 1.1;
+}
+
+/* Reduce header size on mobile */
+@media only screen and (max-width: 720px) {
+  h1 {
+    font-size: 2.5rem;
+  }
+
+  h2 {
+    font-size: 2.1rem;
+  }
+
+  h3 {
+    font-size: 1.75rem;
+  }
+
+  h4 {
+    font-size: 1.25rem;
+  }
+}
+
+/* Format links & buttons */
+a,
+a:visited {
+  color: var(--accent);
+}
+
+a:hover {
+  text-decoration: none;
+}
+
+button,
+.button,
+a.button, /* extra specificity to override a */
+input[type="submit"],
+input[type="reset"],
+input[type="button"],
+label[type="button"] {
+  border: 1px solid var(--accent);
+  background-color: var(--accent);
+  color: var(--accent-text);
+  padding: 0.5rem 0.9rem;
+  text-decoration: none;
+  line-height: normal;
+}
+
+.button[aria-disabled="true"], 
+input:disabled,
+textarea:disabled,
+select:disabled,
+button[disabled] {
+  cursor: not-allowed;
+  background-color: var(--disabled);
+  border-color: var(--disabled);
+  color: var(--text-light);
+}
+
+input[type="range"] {
+  padding: 0;
+}
+
+/* Set the cursor to '?' on an abbreviation and style the abbreviation to show that there is more information underneath */
+abbr[title] {
+  cursor: help;
+  text-decoration-line: underline;
+  text-decoration-style: dotted;
+}
+
+button:enabled:hover,
+.button:not([aria-disabled="true"]):hover,
+input[type="submit"]:enabled:hover,
+input[type="reset"]:enabled:hover,
+input[type="button"]:enabled:hover,
+label[type="button"]:hover {
+  background-color: var(--accent-hover);
+  border-color: var(--accent-hover);
+  cursor: pointer;
+}
+
+.button:focus-visible,
+button:focus-visible:where(:enabled),
+input:enabled:focus-visible:where(
+  [type="submit"],
+  [type="reset"],
+  [type="button"]
+) {
+  outline: 2px solid var(--accent);
+  outline-offset: 1px;
+}
+
+/* Format navigation */
+header > nav {
+  font-size: 1rem;
+  line-height: 2;
+  padding: 1rem 0 0 0;
+}
+
+/* Use flexbox to allow items to wrap, as needed */
+header > nav ul,
+header > nav ol {
+  align-content: space-around;
+  align-items: center;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: center;
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
+
+/* List items are inline elements, make them behave more like blocks */
+header > nav ul li,
+header > nav ol li {
+  display: inline-block;
+}
+
+header > nav a,
+header > nav a:visited {
+  margin: 0 0.5rem 1rem 0.5rem;
+  border: 1px solid var(--border);
+  border-radius: var(--standard-border-radius);
+  color: var(--text);
+  display: inline-block;
+  padding: 0.1rem 1rem;
+  text-decoration: none;
+}
+
+header > nav a:hover,
+header > nav a.current,
+header > nav a[aria-current="page"] {
+  border-color: var(--accent);
+  color: var(--accent);
+  cursor: pointer;
+}
+
+/* Reduce nav side on mobile */
+@media only screen and (max-width: 720px) {
+  header > nav a {
+    border: none;
+    padding: 0;
+    text-decoration: underline;
+    line-height: 1;
+  }
+}
+
+/* Consolidate box styling */
+aside, details, pre, progress {
+  background-color: var(--accent-bg);
+  border: 1px solid var(--border);
+  border-radius: var(--standard-border-radius);
+  margin-bottom: 1rem;
+}
+
+aside {
+  font-size: 1rem;
+  width: 30%;
+  padding: 0 15px;
+  margin-inline-start: 15px;
+  float: right;
+}
+*[dir="rtl"] aside {
+  float: left;
+}
+
+/* Make aside full-width on mobile */
+@media only screen and (max-width: 720px) {
+  aside {
+    width: 100%;
+    float: none;
+    margin-inline-start: 0;
+  }
+}
+
+article, fieldset, dialog {
+  border: 1px solid var(--border);
+  padding: 1rem;
+  border-radius: var(--standard-border-radius);
+  margin-bottom: 1rem;
+}
+
+article h2:first-child,
+section h2:first-child {
+  margin-top: 1rem;
+}
+
+section {
+  border-top: 1px solid var(--border);
+  border-bottom: 1px solid var(--border);
+  padding: 2rem 1rem;
+  margin: 3rem 0;
+}
+
+/* Don't double separators when chaining sections */
+section + section,
+section:first-child {
+  border-top: 0;
+  padding-top: 0;
+}
+
+section:last-child {
+  border-bottom: 0;
+  padding-bottom: 0;
+}
+
+details {
+  padding: 0.7rem 1rem;
+}
+
+summary {
+  cursor: pointer;
+  font-weight: bold;
+  padding: 0.7rem 1rem;
+  margin: -0.7rem -1rem;
+  word-break: break-all;
+}
+
+details[open] > summary + * {
+  margin-top: 0;
+}
+
+details[open] > summary {
+  margin-bottom: 0.5rem;
+}
+
+details[open] > :last-child {
+  margin-bottom: 0;
+}
+
+/* Format tables */
+table {
+  border-collapse: collapse;
+  margin: 1.5rem 0;
+}
+
+figure > table {
+  width: max-content;
+}
+
+td,
+th {
+  border: 1px solid var(--border);
+  text-align: start;
+  padding: 0.5rem;
+}
+
+th {
+  background-color: var(--accent-bg);
+  font-weight: bold;
+}
+
+tr:nth-child(even) {
+  /* Set every other cell slightly darker. Improves readability. */
+  background-color: var(--accent-bg);
+}
+
+table caption {
+  font-weight: bold;
+  margin-bottom: 0.5rem;
+}
+
+/* Format forms */
+textarea,
+select,
+input,
+button,
+.button {
+  font-size: inherit;
+  font-family: inherit;
+  padding: 0.5rem;
+  margin-bottom: 0.5rem;
+  border-radius: var(--standard-border-radius);
+  box-shadow: none;
+  max-width: 100%;
+  display: inline-block;
+}
+textarea,
+select,
+input {
+  color: var(--text);
+  background-color: var(--bg);
+  border: 1px solid var(--border);
+}
+label {
+  display: block;
+}
+textarea:not([cols]) {
+  width: 100%;
+}
+
+/* Add arrow to drop-down */
+select:not([multiple]) {
+  background-image: linear-gradient(45deg, transparent 49%, var(--text) 51%),
+    linear-gradient(135deg, var(--text) 51%, transparent 49%);
+  background-position: calc(100% - 15px), calc(100% - 10px);
+  background-size: 5px 5px, 5px 5px;
+  background-repeat: no-repeat;
+  padding-inline-end: 25px;
+}
+*[dir="rtl"] select:not([multiple]) {
+  background-position: 10px, 15px;
+}
+
+/* checkbox and radio button style */
+input[type="checkbox"],
+input[type="radio"] {
+  vertical-align: middle;
+  position: relative;
+  width: min-content;
+}
+
+input[type="checkbox"] + label,
+input[type="radio"] + label {
+  display: inline-block;
+}
+
+input[type="radio"] {
+  border-radius: 100%;
+}
+
+input[type="checkbox"]:checked,
+input[type="radio"]:checked {
+  background-color: var(--accent);
+}
+
+input[type="checkbox"]:checked::after {
+  /* Creates a rectangle with colored right and bottom borders which is rotated to look like a check mark */
+  content: " ";
+  width: 0.18em;
+  height: 0.32em;
+  border-radius: 0;
+  position: absolute;
+  top: 0.05em;
+  left: 0.17em;
+  background-color: transparent;
+  border-right: solid var(--bg) 0.08em;
+  border-bottom: solid var(--bg) 0.08em;
+  font-size: 1.8em;
+  transform: rotate(45deg);
+}
+input[type="radio"]:checked::after {
+  /* creates a colored circle for the checked radio button  */
+  content: " ";
+  width: 0.25em;
+  height: 0.25em;
+  border-radius: 100%;
+  position: absolute;
+  top: 0.125em;
+  background-color: var(--bg);
+  left: 0.125em;
+  font-size: 32px;
+}
+
+/* Makes input fields wider on smaller screens */
+@media only screen and (max-width: 720px) {
+  textarea,
+  select,
+  input {
+    width: 100%;
+  }
+}
+
+/* Set a height for color input */
+input[type="color"] {
+  height: 2.5rem;
+  padding:  0.2rem;
+}
+
+/* do not show border around file selector button */
+input[type="file"] {
+  border: 0;
+}
+
+/* Misc body elements */
+hr {
+  border: none;
+  height: 1px;
+  background: var(--border);
+  margin: 1rem auto;
+}
+
+mark {
+  padding: 2px 5px;
+  border-radius: var(--standard-border-radius);
+  background-color: var(--marked);
+  color: black;
+}
+
+mark a {
+  color: #0d47a1;
+}
+
+img,
+video {
+  max-width: 100%;
+  height: auto;
+  border-radius: var(--standard-border-radius);
+}
+
+figure {
+  margin: 0;
+  display: block;
+  overflow-x: auto;
+}
+
+figcaption {
+  text-align: center;
+  font-size: 0.9rem;
+  color: var(--text-light);
+  margin-bottom: 1rem;
+}
+
+blockquote {
+  margin-inline-start: 2rem;
+  margin-inline-end: 0;
+  margin-block: 2rem;
+  padding: 0.4rem 0.8rem;
+  border-inline-start: 0.35rem solid var(--accent);
+  color: var(--text-light);
+  font-style: italic;
+}
+
+cite {
+  font-size: 0.9rem;
+  color: var(--text-light);
+  font-style: normal;
+}
+
+dt {
+    color: var(--text-light);
+}
+
+/* Use mono font for code elements */
+code,
+pre,
+pre span,
+kbd,
+samp {
+  font-family: var(--mono-font);
+  color: var(--code);
+}
+
+kbd {
+  color: var(--preformatted);
+  border: 1px solid var(--preformatted);
+  border-bottom: 3px solid var(--preformatted);
+  border-radius: var(--standard-border-radius);
+  padding: 0.1rem 0.4rem;
+}
+
+pre {
+  padding: 1rem 1.4rem;
+  max-width: 100%;
+  overflow: auto;
+  color: var(--preformatted);
+}
+
+/* Fix embedded code within pre */
+pre code {
+  color: var(--preformatted);
+  background: none;
+  margin: 0;
+  padding: 0;
+}
+
+/* Progress bars */
+/* Declarations are repeated because you */
+/* cannot combine vendor-specific selectors */
+progress {
+  width: 100%;
+}
+
+progress:indeterminate {
+  background-color: var(--accent-bg);
+}
+
+progress::-webkit-progress-bar {
+  border-radius: var(--standard-border-radius);
+  background-color: var(--accent-bg);
+}
+
+progress::-webkit-progress-value {
+  border-radius: var(--standard-border-radius);
+  background-color: var(--accent);
+}
+
+progress::-moz-progress-bar {
+  border-radius: var(--standard-border-radius);
+  background-color: var(--accent);
+  transition-property: width;
+  transition-duration: 0.3s;
+}
+
+progress:indeterminate::-moz-progress-bar {
+  background-color: var(--accent-bg);
+}
+
+dialog {
+  max-width: 40rem;
+  margin: auto;
+}
+
+dialog::backdrop {
+  background-color: var(--bg);
+  opacity: 0.8;
+}
+
+@media only screen and (max-width: 720px) {
+  dialog {
+    max-width: 100%;
+    margin: auto 1em;
+  }
+}
+
+/* Superscript & Subscript */
+/* Prevent scripts from affecting line-height. */
+sup, sub {
+  vertical-align: baseline;
+  position: relative;
+}
+
+sup {
+  top: -0.4em;
+}
+
+sub { 
+  top: 0.3em; 
+}
+
+/* Classes for notices */
+.notice {
+  background: var(--accent-bg);
+  border: 2px solid var(--border);
+  border-radius: var(--standard-border-radius);
+  padding: 1.5rem;
+  margin: 2rem 0;
+}