3 files changed, 51 insertions, 25 deletions

diff --git a/browser/themes/shared/preferences/preferences.css b/browser/themes/shared/preferences/preferences.css
index 8f2652f030..3d806d1394 100644
--- a/browser/themes/shared/preferences/preferences.css
+++ b/browser/themes/shared/preferences/preferences.css
@@ -518,7 +518,7 @@ a[is="moz-support-link"]:not(.sidebar-footer-link) {
   stroke: var(--in-content-item-selected);
 }
 
-@media (prefers-contrast) {
+@media (forced-colors) {
   #engineList > treechildren::-moz-tree-image(hover),
   #blocklistsTree > treechildren::-moz-tree-image(hover) {
     fill: var(--in-content-item-hover-text);
@@ -624,7 +624,7 @@ html|dialog,
 }
 
 @media (prefers-color-scheme: dark) {
-  @media not (prefers-contrast) {
+  @media not (forced-colors) {
     html|dialog,
     .dialogBox {
       --in-content-page-background: #42414d;
@@ -1323,7 +1323,7 @@ richlistitem .text-link:hover {
   border-radius: 4px;
 }
 
-@media (prefers-contrast) {
+@media (forced-colors) {
   .qr-code-box:not([hidden="true"]) {
     border: 1px solid currentColor;
   }
diff --git a/browser/themes/shared/preferences/privacy.css b/browser/themes/shared/preferences/privacy.css
index ca56927b02..df31828aa1 100644
--- a/browser/themes/shared/preferences/privacy.css
+++ b/browser/themes/shared/preferences/privacy.css
@@ -187,13 +187,13 @@
   border-color: var(--in-content-accent-color);
 }
 
-@media (prefers-contrast) {
+@media (forced-colors) {
   .privacy-detailedoption.selected {
     outline: 2px solid var(--in-content-accent-color);
   }
 }
 
-@media not (prefers-contrast) {
+@media not (forced-colors) {
   .privacy-detailedoption {
     background-color: rgba(215, 215, 219, 0.1);
   }
@@ -259,6 +259,10 @@
   display: list-item;
 }
 
+#dohExceptionsButton {
+  align-self: end;
+}
+
 .content-blocking-warning-image {
   list-style-image: url("chrome://global/skin/icons/warning.svg");
   width: 16px;
diff --git a/browser/themes/shared/preferences/translations.css b/browser/themes/shared/preferences/translations.css
index 452d7d6c37..ddc55993a8 100644
--- a/browser/themes/shared/preferences/translations.css
+++ b/browser/themes/shared/preferences/translations.css
@@ -3,39 +3,61 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 #translations-settings-header {
-  margin-top: 32px;
-  margin-bottom: 16px;
+  margin-top: var(--space-xlarge);
+  margin-bottom: calc( 2 * var(--space-small));
 }
 
-.translations-settings-manage-list {
-  overflow: auto;
-  background-color: var(--in-content-box-background);
-  border: 1px solid var(--in-content-box-border-color);
-  border-radius: var(--border-radius-small);
-  margin-top: 32px;
+.translations-settings-manage-section {
+  margin-top: var(--space-xlarge);
 }
 
 .translations-settings-manage-language {
-  padding: 8px;
+  margin: 0 calc( 2 * var(--space-small));
   display: flex;
   flex-direction: row;
   justify-content: space-between;
-  > h2 {
-    margin: 8px;
-  }
 }
 
-.translations-settings-manage-list-info {
+.translations-settings-manage-section-info {
   display: flex;
   flex-direction: column;
-  > h2 {
-    margin: 16px;
-    margin-bottom: 8px;
+  h2, p, a {
+    display: block;
+    margin: var(--space-small) calc( 2 * var(--space-small));
   }
-  > p {
-    margin: 8px 16px;
+  a {
+    display: block;
   }
-  > a {
-    margin: 0 16px;
+}
+
+.translations-settings-languages-card {
+  display: flex;
+  flex-direction: column;
+  max-height: calc( 7 * var(--space-xlarge));
+  overflow: auto;
+  padding-inline: calc( 2 * var(--space-small));
+}
+
+.translations-settings-language-header {
+  margin: calc( 2 * var(--space-small)) 0;
+  font-size: var(--font-size-root);
+  font-weight: var(--font-weight-bold);
+}
+
+.translations-settings-language {
+  display: flex;
+  align-items: center;
+  padding: var(--space-small) 0;
+  border-top: 1px solid var(--in-content-border-color);
+  label {
+    margin: 0px calc( 2 * var(--space-small));
   }
 }
+
+.translations-settings-download-icon[type~="icon"]::part(button) {
+  background-image: url(chrome://browser/skin/downloads/downloads.svg);
+}
+
+.translations-settings-delete-icon[type~="icon"]::part(button) {
+  background-image: url(chrome://global/skin/icons/delete.svg);
+}