diff --git a/src/accounting/static/css/style.css b/src/accounting/static/css/style.css
index 6bc8a18..b014f4d 100644
--- a/src/accounting/static/css/style.css
+++ b/src/accounting/static/css/style.css
@@ -21,65 +21,50 @@
  * First written: 2023/2/1
  */
 
-.clickable {
+.accounting-clickable {
     cursor: pointer;
 }
-.btn-group .btn .search-input {
+.btn-group .btn .accounting-search-input {
     min-height: calc(1em + .5rem + 2px);
     padding: 0 0.5rem;
 }
-.btn-group .btn .search-label button {
+.btn-group .btn .accounting-search-label button {
     border: none;
     background-color: transparent;
     color: inherit;
     padding-right: 0;
 }
 
-/** The account management */
-.account {
+/** The card layout */
+.accounting-card {
     padding: 2em 1.5em;
     margin: 1em;
     background-color: #E9ECEF;
     border-radius: 0.3em;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 }
-.account .account-title {
+.accounting-card-title {
     font-size: 1.8rem;
     font-weight: bolder;
 }
-.account .account-code {
+.accounting-card-code {
     font-size: 1.4rem;
     color: #373b3e;
 }
-.list-base-selector {
+
+/** The option selector */
+.accounting-selector-list {
     height: 20rem;
     overflow-y: scroll;
 }
 
-/** The currency management. */
-.currency {
-    padding: 2em 1.5em;
-    margin: 1em;
-    background-color: #E9ECEF;
-    border-radius: 0.3em;
-    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
-}
-.currency .currency-name {
-    font-size: 1.8rem;
-    font-weight: bolder;
-}
-.currency .currency-code {
-    font-size: 1.4rem;
-    color: #373b3e;
-}
-
 /* The Material Design text field (floating form control in Bootstrap) */
-.material-text-field {
+.accounting-material-text-field {
     position: relative;
     min-height: calc(3.5rem + 2px);
     padding-top: 1.625rem;
 }
-.material-text-field > .form-label {
+.accounting-material-text-field > .form-label {
     position: absolute;
     top: 0;
     left: 0;
@@ -88,27 +73,27 @@
     transform-origin: 0 0;
     transition: opacity .1s ease-in-out,transform .1s ease-in-out;
 }
-.material-text-field.not-empty > .form-label {
+.accounting-material-text-field.accounting-not-empty > .form-label {
     opacity: 0.65;
     transform: scale(.85) translateY(-.5rem) translateX(.15rem);
 }
 
 /* The Material Design floating action buttons */
-.material-fab {
+.accounting-material-fab {
     position: fixed;
     right: 2rem;
     bottom: 1rem;
     z-index: 10;
     flex-direction: column-reverse;
 }
-.material-fab .btn {
+.accounting-material-fab .btn {
     border-radius: 50%;
     transform: scale(1.5);
     box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0,0,0,.12);
     display: block;
     margin-top: 2.5rem;
 }
-.material-fab .btn:hover, .material-fab .btn:focus {
+.accounting-material-fab .btn:hover, .accounting-material-fab .btn:focus {
     box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0,0,0,.12);
 }
 
diff --git a/src/accounting/static/js/account-form.js b/src/accounting/static/js/account-form.js
index 726717f..0792c1c 100644
--- a/src/accounting/static/js/account-form.js
+++ b/src/accounting/static/js/account-form.js
@@ -24,11 +24,11 @@
 // Initializes the page JavaScript.
 document.addEventListener("DOMContentLoaded", function () {
     initializeBaseAccountSelector();
-    document.getElementById("account-base-code")
+    document.getElementById("accounting-base-code")
         .onchange = validateBase;
-    document.getElementById("account-title")
+    document.getElementById("accounting-title")
         .onchange = validateTitle;
-    document.getElementById("account-form")
+    document.getElementById("accounting-form")
         .onsubmit = validateForm;
 });
 
@@ -38,25 +38,25 @@ document.addEventListener("DOMContentLoaded", function () {
  * @private
  */
 function initializeBaseAccountSelector() {
-    const selector = document.getElementById("select-base-modal");
-    const base = document.getElementById("account-base");
-    const baseCode = document.getElementById("account-base-code");
-    const baseContent = document.getElementById("account-base-content");
-    const options = Array.from(document.getElementsByClassName("list-group-item-base"));
-    const btnClear = document.getElementById("btn-clear-base");
+    const selector = document.getElementById("accounting-base-selector-model");
+    const base = document.getElementById("accounting-base");
+    const baseCode = document.getElementById("accounting-base-code");
+    const baseContent = document.getElementById("accounting-base-content");
+    const options = Array.from(document.getElementsByClassName("accounting-base-option"));
+    const btnClear = document.getElementById("accounting-btn-clear-base");
     selector.addEventListener("show.bs.modal", function () {
-        base.classList.add("not-empty");
+        base.classList.add("accounting-not-empty");
         options.forEach(function (item) {
             item.classList.remove("active");
         });
-        const selected = document.getElementById("list-group-item-base-" + baseCode.value);
+        const selected = document.getElementById("accounting-base-option-" + baseCode.value);
         if (selected !== null) {
             selected.classList.add("active");
         }
     });
     selector.addEventListener("hidden.bs.modal", function () {
         if (baseCode.value === "") {
-            base.classList.remove("not-empty");
+            base.classList.remove("accounting-not-empty");
         }
     });
     options.forEach(function (option) {
@@ -101,9 +101,9 @@ function validateForm() {
  * @private
  */
 function validateBase() {
-    const field = document.getElementById("account-base-code");
-    const error = document.getElementById("account-base-code-error");
-    const displayField = document.getElementById("account-base");
+    const field = document.getElementById("accounting-base-code");
+    const error = document.getElementById("accounting-base-code-error");
+    const displayField = document.getElementById("accounting-base");
     field.value = field.value.trim();
     if (field.value === "") {
         displayField.classList.add("is-invalid");
@@ -122,8 +122,8 @@ function validateBase() {
  * @private
  */
 function validateTitle() {
-    const field = document.getElementById("account-title");
-    const error = document.getElementById("account-title-error");
+    const field = document.getElementById("accounting-title");
+    const error = document.getElementById("accounting-title-error");
     field.value = field.value.trim();
     if (field.value === "") {
         field.classList.add("is-invalid");
diff --git a/src/accounting/static/js/account-order.js b/src/accounting/static/js/account-order.js
index abb543a..c2f8029 100644
--- a/src/accounting/static/js/account-order.js
+++ b/src/accounting/static/js/account-order.js
@@ -23,13 +23,13 @@
 
 // Initializes the page JavaScript.
 document.addEventListener("DOMContentLoaded", function () {
-    const list = document.getElementById("account-order-list");
+    const list = document.getElementById("accounting-order-list");
     if (list !== null) {
         const onReorder = function () {
             const accounts = Array.from(list.children);
             for (let i = 0; i < accounts.length; i++) {
-                const no = document.getElementById("account-order-" + accounts[i].dataset.id + "-no");
-                const code = document.getElementById("account-order-" + accounts[i].dataset.id + "-code");
+                const no = document.getElementById("accounting-order-" + accounts[i].dataset.id + "-no");
+                const code = document.getElementById("accounting-order-" + accounts[i].dataset.id + "-code");
                 no.value = String(i + 1);
                 code.innerText = list.dataset.baseCode + "-" + ("000" + (i + 1)).slice(-3);
             }
diff --git a/src/accounting/static/js/currency-form.js b/src/accounting/static/js/currency-form.js
index 9864a8f..1dcdb99 100644
--- a/src/accounting/static/js/currency-form.js
+++ b/src/accounting/static/js/currency-form.js
@@ -23,11 +23,11 @@
 
 // Initializes the page JavaScript.
 document.addEventListener("DOMContentLoaded", function () {
-    document.getElementById("currency-code")
+    document.getElementById("accounting-code")
         .onchange = validateCode;
-    document.getElementById("currency-name")
+    document.getElementById("accounting-name")
         .onchange = validateName;
-    document.getElementById("currency-form")
+    document.getElementById("accounting-form")
         .onsubmit = validateForm;
 });
 
@@ -69,7 +69,7 @@ function submitFormIfAllAsyncValid() {
         isValid = isAsyncValid[key] && isValid;
     });
     if (isValid) {
-        document.getElementById("currency-form").submit()
+        document.getElementById("accounting-form").submit()
     }
 }
 
@@ -84,8 +84,8 @@ function validateCode(changeEvent = null) {
     const key = "code";
     const isSubmission = changeEvent === null;
     let hasAsyncValidation = false;
-    const field = document.getElementById("currency-code");
-    const error = document.getElementById("currency-code-error");
+    const field = document.getElementById("accounting-code");
+    const error = document.getElementById("accounting-code-error");
     field.value = field.value.trim();
     if (field.value === "") {
         field.classList.add("is-invalid");
@@ -125,8 +125,8 @@ function validateCode(changeEvent = null) {
  * @private
  */
 function validateAsyncCodeIsDuplicated(isSubmission, key) {
-    const field = document.getElementById("currency-code");
-    const error = document.getElementById("currency-code-error");
+    const field = document.getElementById("accounting-code");
+    const error = document.getElementById("accounting-code-error");
     const url = field.dataset.existsUrl;
     const onLoad = function () {
         if (this.status === 200) {
@@ -160,8 +160,8 @@ function validateAsyncCodeIsDuplicated(isSubmission, key) {
  * @private
  */
 function validateName() {
-    const field = document.getElementById("currency-name");
-    const error = document.getElementById("currency-name-error");
+    const field = document.getElementById("accounting-name");
+    const error = document.getElementById("accounting-name-error");
     field.value = field.value.trim();
     if (field.value === "") {
         field.classList.add("is-invalid");
diff --git a/src/accounting/templates/accounting/account/detail.html b/src/accounting/templates/accounting/account/detail.html
index a0f33af..8ae1d14 100644
--- a/src/accounting/templates/accounting/account/detail.html
+++ b/src/accounting/templates/accounting/account/detail.html
@@ -41,7 +41,7 @@ First written: 2023/1/31
     {{ A_("Order") }}
   </a>
   {% if accounting_can_edit() %}
-    <button class="btn btn-danger" type="button" data-bs-toggle="modal" data-bs-target="#delete-modal">
+    <button class="btn btn-danger" type="button" data-bs-toggle="modal" data-bs-target="#accounting-delete-modal">
       <i class="fa-solid fa-trash"></i>
       {{ A_("Delete") }}
     </button>
@@ -49,7 +49,7 @@ First written: 2023/1/31
 </div>
 
 {% if accounting_can_edit() %}
-  <div class="d-md-none material-fab">
+  <div class="d-md-none accounting-material-fab">
     <a class="btn btn-primary" href="{{ url_for("accounting.account.edit", account=obj)|accounting_inherit_next }}">
       <i class="fa-solid fa-pen-to-square"></i>
     </a>
@@ -57,16 +57,16 @@ First written: 2023/1/31
 {% endif %}
 
 {% if accounting_can_edit() %}
-  <form id="delete-form" action="{{ url_for("accounting.account.delete", account=obj) }}" method="post">
-    <input id="csrf_token" type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+  <form action="{{ url_for("accounting.account.delete", account=obj) }}" method="post">
+    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
     {% if "next" in request.args %}
       <input type="hidden" name="next" value="{{ request.args["next"] }}">
     {% endif %}
-    <div class="modal fade" id="delete-modal" tabindex="-1" aria-labelledby="delete-model-label" aria-hidden="true">
+    <div class="modal fade" id="accounting-delete-modal" tabindex="-1" aria-labelledby="accounting-delete-model-label" aria-hidden="true">
       <div class="modal-dialog">
         <div class="modal-content">
           <div class="modal-header">
-            <h1 class="modal-title fs-5" id="delete-model-label">{{ A_("Delete Account Confirmation") }}</h1>
+            <h1 class="modal-title fs-5" id="accounting-delete-model-label">{{ A_("Delete Account Confirmation") }}</h1>
             <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
           </div>
           <div class="modal-body">
@@ -82,9 +82,9 @@ First written: 2023/1/31
   </form>
 {% endif %}
 
-<div class="account col-sm-6">
-  <div class="account-title">{{ obj.title }}</div>
-  <div class="account-code">{{ obj.code }}</div>
+<div class="accounting-card col-sm-6">
+  <div class="accounting-card-title">{{ obj.title }}</div>
+  <div class="accounting-card-code">{{ obj.code }}</div>
   {% if obj.is_offset_needed %}
     <div>
       <span class="badge rounded-pill bg-info">{{ A_("Offset needed") }}</span>
diff --git a/src/accounting/templates/accounting/account/include/form.html b/src/accounting/templates/accounting/account/include/form.html
index 48d87ab..91961a1 100644
--- a/src/accounting/templates/accounting/account/include/form.html
+++ b/src/accounting/templates/accounting/account/include/form.html
@@ -34,16 +34,16 @@ First written: 2023/2/1
   </a>
 </div>
 
-<form id="account-form" action="{% block action_url %}{% endblock %}" method="post">
+<form id="accounting-form" action="{% block action_url %}{% endblock %}" method="post">
   {{ form.csrf_token }}
   {% if "next" in request.args %}
     <input type="hidden" name="next" value="{{ request.args["next"] }}">
   {% endif %}
   <div class="form-floating mb-3">
-    <input id="account-base-code" type="hidden" name="base_code" value="{{ "" if form.base_code.data is none else form.base_code.data }}">
-    <div id="account-base" class="form-control clickable material-text-field {% if form.base_code.data %} not-empty {% endif %} {% if form.base_code.errors %} is-invalid {% endif %}" data-bs-toggle="modal" data-bs-target="#select-base-modal">
-      <label id="account-base-label" class="form-label" for="account-base">{{ A_("Base account") }}</label>
-      <div id="account-base-content">
+    <input id="accounting-base-code" type="hidden" name="base_code" value="{{ "" if form.base_code.data is none else form.base_code.data }}">
+    <div id="accounting-base" class="form-control accounting-clickable accounting-material-text-field {% if form.base_code.data %} accounting-not-empty {% endif %} {% if form.base_code.errors %} is-invalid {% endif %}" data-bs-toggle="modal" data-bs-target="#accounting-base-selector-model">
+      <label class="form-label" for="accounting-base">{{ A_("Base account") }}</label>
+      <div id="accounting-base-content">
         {% if form.base_code.data %}
           {% if form.base_code.errors %}
             {{ A_("(Unknown)") }}
@@ -53,18 +53,18 @@ First written: 2023/2/1
         {% endif %}
       </div>
     </div>
-    <div id="account-base-code-error" class="invalid-feedback">{% if form.base_code.errors %}{{ form.base_code.errors[0] }}{% endif %}</div>
+    <div id="accounting-base-code-error" class="invalid-feedback">{% if form.base_code.errors %}{{ form.base_code.errors[0] }}{% endif %}</div>
   </div>
 
   <div class="form-floating mb-3">
-    <input id="account-title" class="form-control {% if form.title.errors %} is-invalid {% endif %}" type="text" name="title" value="{{ "" if form.title.data is none else form.title.data }}" placeholder=" " required="required">
-    <label class="form-label" for="account-title">{{ A_("Title") }}</label>
-    <div id="account-title-error" class="invalid-feedback">{% if form.title.errors %}{{ form.title.errors[0] }}{% endif %}</div>
+    <input id="accounting-title" class="form-control {% if form.title.errors %} is-invalid {% endif %}" type="text" name="title" value="{{ "" if form.title.data is none else form.title.data }}" placeholder=" " required="required">
+    <label class="form-label" for="accounting-title">{{ A_("Title") }}</label>
+    <div id="accounting-title-error" class="invalid-feedback">{% if form.title.errors %}{{ form.title.errors[0] }}{% endif %}</div>
   </div>
 
   <div class="form-check form-switch mb-3">
-    <input id="account-is-offset-needed" class="form-check-input" type="checkbox" name="is_offset_needed" value="1" {% if form.is_offset_needed.data %} checked="checked" {% endif %}>
-    <label class="form-check-label" for="account-is-offset-needed">
+    <input id="accounting-is-offset-needed" class="form-check-input" type="checkbox" name="is_offset_needed" value="1" {% if form.is_offset_needed.data %} checked="checked" {% endif %}>
+    <label class="form-check-label" for="accounting-is-offset-needed">
       {{ A_("The entries in the account need offsets.") }}
     </label>
   </div>
@@ -76,32 +76,32 @@ First written: 2023/2/1
     </button>
   </div>
 
-  <div class="d-md-none material-fab">
+  <div class="d-md-none accounting-material-fab">
     <button class="btn btn-primary" type="submit">
       <i class="fa-solid fa-floppy-disk"></i>
     </button>
   </div>
 </form>
 
-<div class="modal fade" id="select-base-modal" tabindex="-1" aria-labelledby="select-base-model-label" aria-hidden="true">
+<div class="modal fade" id="accounting-base-selector-model" tabindex="-1" aria-labelledby="accounting-base-selector-model-label" aria-hidden="true">
   <div class="modal-dialog">
     <div class="modal-content">
       <div class="modal-header">
-        <h1 class="modal-title fs-5" id="base-selector-model-label">{{ A_("Select Base Account") }}</h1>
+        <h1 class="modal-title fs-5" id="accounting-base-selector-model-label">{{ A_("Select Base Account") }}</h1>
         <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
       </div>
       <div class="modal-body">
         <div class="input-group mb-2">
-          <input id="select-base-query" class="form-control form-control-sm" type="search" placeholder=" " required="required" aria-label="Search">
-          <label class="input-group-text" for="select-base-query">
+          <input id="accounting-base-selector-query" class="form-control form-control-sm" type="search" placeholder=" " required="required" aria-label="Search">
+          <label class="input-group-text" for="accounting-base-selector-query">
             <i class="fa-solid fa-magnifying-glass"></i>
             {{ A_("Search") }}
           </label>
         </div>
 
-        <ul class="list-group list-base-selector">
+        <ul class="list-group accounting-selector-list">
           {% for base in form.base_options %}
-          <li id="list-group-item-base-{{ base.code }}" class="list-group-item list-group-item-base clickable" data-code="{{ base.code }}" data-content="{{ base }}">
+          <li id="accounting-base-option-{{ base.code }}" class="list-group-item accounting-base-option accounting-clickable" data-code="{{ base.code }}" data-content="{{ base }}">
             {{ base }}
           </li>
           {% endfor %}
@@ -110,9 +110,9 @@ First written: 2023/2/1
       <div class="modal-footer">
         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{ A_("Cancel") }}</button>
         {% if form.base_code.data %}
-          <button id="btn-clear-base" type="button" class="btn btn-danger">{{ A_("Clear") }}</button>
+          <button id="accounting-btn-clear-base" type="button" class="btn btn-danger">{{ A_("Clear") }}</button>
         {% else %}
-          <button id="btn-clear-base" type="button" class="btn btn-secondary" disabled="disabled">{{ A_("Clear") }}</button>
+          <button id="accounting-btn-clear-base" type="button" class="btn btn-secondary" disabled="disabled">{{ A_("Clear") }}</button>
         {% endif %}
       </div>
     </div>
diff --git a/src/accounting/templates/accounting/account/list.html b/src/accounting/templates/accounting/account/list.html
index 41d6246..e94ee1e 100644
--- a/src/accounting/templates/accounting/account/list.html
+++ b/src/accounting/templates/accounting/account/list.html
@@ -33,8 +33,8 @@ First written: 2023/1/30
     </a>
   {% endif %}
   <form class="btn btn-primary d-flex input-group" action="{{ url_for("accounting.account.list") }}" method="get" role="search">
-    <input id="search-input" class="form-control form-control-sm search-input" type="search" name="q" value="{{ request.args["q"] if "q" in request.args else "" }}" placeholder=" " required="required" aria-label="Search">
-    <label for="search-input" class="search-label">
+    <input id="accounting-search" class="form-control form-control-sm accounting-search-input" type="search" name="q" value="{{ request.args["q"] if "q" in request.args else "" }}" placeholder=" " required="required" aria-label="Search">
+    <label for="accounting-search" class="accounting-search-label">
       <button type="submit">
         <i class="fa-solid fa-magnifying-glass"></i>
         {{ A_("Search") }}
@@ -44,7 +44,7 @@ First written: 2023/1/30
 </div>
 
 {% if accounting_can_edit() %}
-  <div class="d-md-none material-fab">
+  <div class="d-md-none accounting-material-fab">
     <a class="btn btn-primary" href="{{ url_for("accounting.account.create")|accounting_append_next }}">
       <i class="fa-solid fa-plus"></i>
     </a>
diff --git a/src/accounting/templates/accounting/account/order.html b/src/accounting/templates/accounting/account/order.html
index ecfa9b9..3d97adc 100644
--- a/src/accounting/templates/accounting/account/order.html
+++ b/src/accounting/templates/accounting/account/order.html
@@ -39,16 +39,16 @@ First written: 2023/2/2
 
 {% if base.accounts|length > 1 and accounting_can_edit() %}
   <form action="{{ url_for("accounting.account.sort", base=base) }}" method="post">
-    <input id="csrf_token" type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
     {% if "next" in request.args %}
       <input type="hidden" name="next" value="{{ request.args["next"] }}">
     {% endif %}
-    <ul id="account-order-list" class="list-group mb-3" data-base-code="{{ base.code }}">
+    <ul id="accounting-order-list" class="list-group mb-3" data-base-code="{{ base.code }}">
       {% for account in base.accounts|sort(attribute="no") %}
         <li class="list-group-item d-flex justify-content-between" data-id="{{ account.id }}">
-          <input id="account-order-{{ account.id }}-no" type="hidden" name="{{ account.id }}-no" value="{{ loop.index }}">
+          <input id="accounting-order-{{ account.id }}-no" type="hidden" name="{{ account.id }}-no" value="{{ loop.index }}">
           <div>
-            <span id="account-order-{{ account.id }}-code">{{ account.code }}</span>
+            <span id="accounting-order-{{ account.id }}-code">{{ account.code }}</span>
             {{ account.title }}
           </div>
           <i class="fa-solid fa-bars"></i>
@@ -63,7 +63,7 @@ First written: 2023/2/2
       </button>
     </div>
 
-    <div class="d-md-none material-fab">
+    <div class="d-md-none accounting-material-fab">
       <button class="btn btn-primary" type="submit">
         <i class="fa-solid fa-floppy-disk"></i>
       </button>
diff --git a/src/accounting/templates/accounting/base-account/detail.html b/src/accounting/templates/accounting/base-account/detail.html
index 5c0f8d4..5e15a1a 100644
--- a/src/accounting/templates/accounting/base-account/detail.html
+++ b/src/accounting/templates/accounting/base-account/detail.html
@@ -32,9 +32,9 @@ First written: 2023/2/1
   </a>
 </div>
 
-<div class="account col-sm-6">
-  <div class="account-title">{{ obj.title }}</div>
-  <div class="account-code">{{ obj.code }}</div>
+<div class="accounting-card col-sm-6">
+  <div class="accounting-card-title">{{ obj.title }}</div>
+  <div class="accounting-card-code">{{ obj.code }}</div>
   {% if obj.accounts %}
     <div>
     {% for account in obj.accounts %}
diff --git a/src/accounting/templates/accounting/base-account/list.html b/src/accounting/templates/accounting/base-account/list.html
index 89e034a..7879028 100644
--- a/src/accounting/templates/accounting/base-account/list.html
+++ b/src/accounting/templates/accounting/base-account/list.html
@@ -27,8 +27,8 @@ First written: 2023/1/26
 
 <div class="btn-group mb-2">
   <form class="btn btn-primary d-flex input-group" action="{{ url_for("accounting.base-account.list") }}" method="get" role="search">
-    <input id="search-input" class="form-control form-control-sm search-input" type="search" name="q" value="{{ request.args["q"] if "q" in request.args else "" }}" placeholder=" " required="required" aria-label="Search">
-    <label for="search-input" class="search-label">
+    <input id="accounting-search" class="form-control form-control-sm accounting-search-input" type="search" name="q" value="{{ request.args["q"] if "q" in request.args else "" }}" placeholder=" " required="required" aria-label="Search">
+    <label for="accounting-search" class="accounting-search-label">
       <button type="submit">
         <i class="fa-solid fa-magnifying-glass"></i>
         {{ A_("Search") }}
diff --git a/src/accounting/templates/accounting/currency/detail.html b/src/accounting/templates/accounting/currency/detail.html
index 29447e8..d70f0b7 100644
--- a/src/accounting/templates/accounting/currency/detail.html
+++ b/src/accounting/templates/accounting/currency/detail.html
@@ -37,7 +37,7 @@ First written: 2023/2/6
     </a>
   {% endif %}
   {% if accounting_can_edit() %}
-    <button class="btn btn-danger" type="button" data-bs-toggle="modal" data-bs-target="#delete-modal">
+    <button class="btn btn-danger" type="button" data-bs-toggle="modal" data-bs-target="#accounting-delete-modal">
       <i class="fa-solid fa-trash"></i>
       {{ A_("Delete") }}
     </button>
@@ -45,7 +45,7 @@ First written: 2023/2/6
 </div>
 
 {% if accounting_can_edit() %}
-  <div class="d-md-none material-fab">
+  <div class="d-md-none accounting-material-fab">
     <a class="btn btn-primary" href="{{ url_for("accounting.currency.edit", currency=obj)|accounting_inherit_next }}">
       <i class="fa-solid fa-pen-to-square"></i>
     </a>
@@ -53,16 +53,16 @@ First written: 2023/2/6
 {% endif %}
 
 {% if accounting_can_edit() %}
-  <form id="delete-form" action="{{ url_for("accounting.currency.delete", currency=obj) }}" method="post">
-    <input id="csrf_token" type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+  <form action="{{ url_for("accounting.currency.delete", currency=obj) }}" method="post">
+    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
     {% if "next" in request.args %}
       <input type="hidden" name="next" value="{{ request.args["next"] }}">
     {% endif %}
-    <div class="modal fade" id="delete-modal" tabindex="-1" aria-labelledby="delete-model-label" aria-hidden="true">
+    <div class="modal fade" id="accounting-delete-modal" tabindex="-1" aria-labelledby="accounting-delete-model-label" aria-hidden="true">
       <div class="modal-dialog">
         <div class="modal-content">
           <div class="modal-header">
-            <h1 class="modal-title fs-5" id="delete-model-label">{{ A_("Delete Currency Confirmation") }}</h1>
+            <h1 class="modal-title fs-5" id="accounting-delete-model-label">{{ A_("Delete Currency Confirmation") }}</h1>
             <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
           </div>
           <div class="modal-body">
@@ -78,9 +78,9 @@ First written: 2023/2/6
   </form>
 {% endif %}
 
-<div class="currency col-sm-6">
-  <div class="currency-name">{{ obj.name }}</div>
-  <div class="currency-code">{{ obj.code }}</div>
+<div class="accounting-card col-sm-6">
+  <div class="accounting-card-title">{{ obj.name }}</div>
+  <div class="accounting-card-code">{{ obj.code }}</div>
   <div class="small text-secondary fst-italic">
     <div>{{ A_("Created") }} {{ obj.created_at }} {{ obj.created_by }}</div>
     <div>{{ A_("Updated") }} {{ obj.updated_at }} {{ obj.updated_by }}</div>
diff --git a/src/accounting/templates/accounting/currency/include/form.html b/src/accounting/templates/accounting/currency/include/form.html
index 81f1b46..9a87ce2 100644
--- a/src/accounting/templates/accounting/currency/include/form.html
+++ b/src/accounting/templates/accounting/currency/include/form.html
@@ -34,21 +34,21 @@ First written: 2023/2/6
   </a>
 </div>
 
-<form id="currency-form" action="{% block action_url %}{% endblock %}" method="post">
+<form id="accounting-form" action="{% block action_url %}{% endblock %}" method="post">
   {{ form.csrf_token }}
   {% if "next" in request.args %}
     <input type="hidden" name="next" value="{{ request.args["next"] }}">
   {% endif %}
   <div class="form-floating mb-3">
-    <input id="currency-code" class="form-control {% if form.code.errors %} is-invalid {% endif %}" type="text" name="code" value="{{ "" if form.code.data is none else form.code.data }}" placeholder=" " required="required" data-exists-url="{{ url_for("accounting.currency-api.exists") }}" data-original="{% block original_code %}{% endblock %}" data-blocklist="{{ form.CODE_BLOCKLIST|tojson|forceescape }}">
-    <label class="form-label" for="currency-code">{{ A_("Code") }}</label>
-    <div id="currency-code-error" class="invalid-feedback">{% if form.code.errors %}{{ form.code.errors[0] }}{% endif %}</div>
+    <input id="accounting-code" class="form-control {% if form.code.errors %} is-invalid {% endif %}" type="text" name="code" value="{{ "" if form.code.data is none else form.code.data }}" placeholder=" " required="required" data-exists-url="{{ url_for("accounting.currency-api.exists") }}" data-original="{% block original_code %}{% endblock %}" data-blocklist="{{ form.CODE_BLOCKLIST|tojson|forceescape }}">
+    <label class="form-label" for="accounting-code">{{ A_("Code") }}</label>
+    <div id="accounting-code-error" class="invalid-feedback">{% if form.code.errors %}{{ form.code.errors[0] }}{% endif %}</div>
   </div>
 
   <div class="form-floating mb-3">
-    <input id="currency-name" class="form-control {% if form.name.errors %} is-invalid {% endif %}" type="text" name="name" value="{{ "" if form.name.data is none else form.name.data }}" placeholder=" " required="required">
-    <label class="form-label" for="currency-name">{{ A_("Name") }}</label>
-    <div id="currency-name-error" class="invalid-feedback">{% if form.name.errors %}{{ form.name.errors[0] }}{% endif %}</div>
+    <input id="accounting-name" class="form-control {% if form.name.errors %} is-invalid {% endif %}" type="text" name="name" value="{{ "" if form.name.data is none else form.name.data }}" placeholder=" " required="required">
+    <label class="form-label" for="accounting-name">{{ A_("Name") }}</label>
+    <div id="accounting-name-error" class="invalid-feedback">{% if form.name.errors %}{{ form.name.errors[0] }}{% endif %}</div>
   </div>
 
   <div class="d-none d-md-block">
@@ -58,7 +58,7 @@ First written: 2023/2/6
     </button>
   </div>
 
-  <div class="d-md-none material-fab">
+  <div class="d-md-none accounting-material-fab">
     <button class="btn btn-primary" type="submit">
       <i class="fa-solid fa-floppy-disk"></i>
     </button>
diff --git a/src/accounting/templates/accounting/currency/list.html b/src/accounting/templates/accounting/currency/list.html
index 68fe948..f3e10b4 100644
--- a/src/accounting/templates/accounting/currency/list.html
+++ b/src/accounting/templates/accounting/currency/list.html
@@ -33,8 +33,8 @@ First written: 2023/2/6
     </a>
   {% endif %}
   <form class="btn btn-primary d-flex input-group" action="{{ url_for("accounting.currency.list") }}" method="get" role="search">
-    <input id="search-input" class="form-control form-control-sm search-input" type="search" name="q" value="{{ request.args["q"] if "q" in request.args else "" }}" placeholder=" " required="required" aria-label="Search">
-    <label for="search-input" class="search-label">
+    <input id="accounting-search" class="form-control form-control-sm accounting-search-input" type="search" name="q" value="{{ request.args["q"] if "q" in request.args else "" }}" placeholder=" " required="required" aria-label="Search">
+    <label for="accounting-search" class="accounting-search-label">
       <button type="submit">
         <i class="fa-solid fa-magnifying-glass"></i>
         {{ A_("Search") }}
@@ -44,7 +44,7 @@ First written: 2023/2/6
 </div>
 
 {% if accounting_can_edit() %}
-  <div class="d-md-none material-fab">
+  <div class="d-md-none accounting-material-fab">
     <a class="btn btn-primary" href="{{ url_for("accounting.currency.create")|accounting_append_next }}">
       <i class="fa-solid fa-plus"></i>
     </a>