add css for dl; minor adjustments to book layouts

assets/scss/general.scss

@@ -197,11 +197,11 @@ mjx-container[jax="CHTML"][display="true"],
     grid-auto-flow: column;
     /* above 2 lines are equivalent as below 1 line */
     /* grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); */
-    gap: 1.3rem;
-    margin: 0 0 1rem 0;
+    gap: 1.4rem;
+    margin: 0 0 1.4rem 0;
   }
   .row .column {
-    margin-left: 0;
+    margin-left: 0 !important;
   }
 }
 
@@ -250,8 +250,8 @@ mjx-container[jax="CHTML"][display="true"],
 
 /* reduce zh & ja font-size to match en */
 
-p:lang(zh),
-p:lang(ja) {
+p:lang(zh), span:lang(zh),
+p:lang(ja), span:lang(ja), {
     font-size: 1.2rem;
 }
 

assets/scss/tufte.scss

@@ -140,7 +140,8 @@ section {
 
 p,
 ol,
-ul {
+ul,
+dl {
     font-size: 1.4rem;
 }
 
@@ -196,7 +197,8 @@ blockquote footer {
 }
 
 ol,
-ul {
+ul,
+dl {
     width: 45%;
     -webkit-padding-start: 5%;
     -webkit-padding-end: 5%;
@@ -206,10 +208,37 @@ li  ul {
     width: 100%;
 }
 
-li {
+li,
+dt, dd {
     padding: 0.5rem 0;
 }
 
+dl {
+    display: grid;
+    gap: 0 1rem;
+}
+
+dt {
+    font-weight: 700;
+    grid-column: 1;
+}
+
+dd {
+    margin-bottom: 0;
+    margin-left: 1rem;
+}
+
+@media (min-width: 760px) {
+  dl {
+    grid-template-columns: fit-content(50%) auto;
+  }
+
+  dd {
+    grid-column: 2;
+    margin-left: 0;
+  }
+}
+
 figure {
     padding: 0;
     border: 0;
@@ -323,7 +352,9 @@ div.table-wrapper {
     footer {
         width: 90%;
     }
-    ul {
+    ul,
+    ol,
+    dl {
         width: 85%;
     }
     figure {