@transferwise/neptune-css 14.29.3 → 14.29.5

package/dist/css/neptune-core.css

@@ -255,7 +255,6 @@ summary {
   --btn-lg-radius-base: 3px;
 }
 .np-theme-personal {
-  font-family: 'Inter', Helvetica, Arial, sans-serif;
   font-family: var(--font-family-regular);
   font-feature-settings: "calt";
   --input-group-addon-padding: 12px 16px;
@@ -279,19 +278,13 @@ summary {
   --btn-radius-base: 9999px;
   --btn-sm-radius-base: var(--btn-radius-base);
   --btn-lg-radius-base: var(--btn-radius-base);
-  color: #5d7079;
   color: var(--color-content-secondary);
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
 }
 html {
-  font-size: 16px;
   font-size: var(--base-font-size);
-  font-family: 'Inter', Helvetica, Arial, sans-serif;
   font-family: var(--font-family-regular);
-  color: #5d7079;
   color: var(--color-content-secondary);
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
@@ -307,12 +300,10 @@ pre {
 }
 .np-theme-personal::-moz-selection {
   background-color: var(--color-background-neutral-active);
-  color: #37517e;
   color: var(--color-content-primary);
 }
 .np-theme-personal::selection {
   background-color: var(--color-background-neutral-active);
-  color: #37517e;
   color: var(--color-content-primary);
 }
 /* DEPRECATED: use `a` tag or .np-text-link-* instead */
@@ -367,7 +358,6 @@ a:active,
 a.secondary,
 .np-text-link-default.secondary,
 .np-text-link-large.secondary {
-  color: #5d7079;
   color: var(--color-content-secondary);
 }
 .anchor.secondary:hover,
@@ -378,14 +368,12 @@ a.secondary:hover,
 a.secondary:focus,
 .np-text-link-default.secondary:focus,
 .np-text-link-large.secondary:focus {
-  color: #0084b3;
   color: var(--color-content-accent-hover);
 }
 .anchor.secondary:active,
 a.secondary:active,
 .np-text-link-default.secondary:active,
 .np-text-link-large.secondary:active {
-  color: #0077a5;
   color: var(--color-content-accent-active);
 }
 html.ios-click {
@@ -418,21 +406,17 @@ textarea {
   resize: vertical;
 }
 input::-moz-placeholder, textarea::-moz-placeholder {
-  color: #768e9c;
   color: var(--color-content-tertiary);
 }
 input::placeholder,
 textarea::placeholder {
-  color: #768e9c;
   color: var(--color-content-tertiary);
 }
 ol,
 ul {
-  margin-block: 0 24px;
   margin-block: 0 var(--size-24);
   margin-inline: 0;
   padding-block: 0 0;
-  padding-inline: calc(48px - 10px) 0;
   padding-inline: calc(var(--size-48) - var(--size-10)) 0;
 }
 ol ol,
@@ -446,18 +430,14 @@ ul ul {
   list-style: none;
 }
 .list-inline {
-  margin-inline-start: calc(4px * -1);
   margin-inline-start: calc(var(--size-4) * -1);
   padding-inline-start: 0;
   list-style: none;
 }
 .list-inline > li {
   display: inline-block;
-  padding-inline-end: 8px;
   padding-inline-end: var(--size-8);
-  padding-inline-start: 4px;
   padding-inline-start: var(--size-4);
-  border-inline-end: 1px solid rgba(0,0,0,0.10196);
   border-inline-end: 1px solid var(--color-border-neutral);
 }
 .list-inline > li:last-child {
@@ -465,22 +445,17 @@ ul ul {
 }
 dt,
 dd {
-  line-height: 1.5;
   line-height: var(--line-height-body);
 }
 dt {
-  font-size: 0.875rem;
   font-size: var(--font-size-14);
 }
 dd {
-  margin-block-end: 16px;
   margin-block-end: var(--size-16);
-  color: #37517e;
   color: var(--color-content-primary);
 }
 @media (min-width: 600px) {
   dd {
-    margin-block-end: 24px;
     margin-block-end: var(--size-24);
   }
 }
@@ -504,7 +479,6 @@ dd {
     text-overflow: ellipsis;
   }
   .dl-horizontal dd {
-    margin-block-end: 8px;
     margin-block-end: var(--size-8);
     margin-inline-start: 180px;
   }
@@ -523,12 +497,9 @@ dd {
   word-break: break-all;
 }
 hr {
-  margin-block: 16px;
   margin-block: var(--size-16);
   margin-inline: auto;
   border: 0;
-  border-block-start: 1px solid rgba(0,0,0,0.10196);
-  border-block-start: 1px solid #0000001a;
   border-block-start: 1px solid var(--color-border-neutral);
 }
 .bg-primary hr {
@@ -536,14 +507,12 @@ hr {
 }
 @media (min-width: 600px) {
   hr {
-    margin-block: 24px;
     margin-block: var(--size-24);
     margin-inline: auto;
   }
 }
 @media (min-width: 1160px) {
   hr {
-    margin-block: 32px;
     margin-block: var(--size-32);
     margin-inline: auto;
   }
@@ -567,7 +536,6 @@ video {
   vertical-align: middle;
 }
 .img-rounded {
-  border-radius: 10px;
   border-radius: var(--radius-small);
 }
 .img-circle {
@@ -624,9 +592,7 @@ h6,
 .np-text-title-body,
 .np-text-title-group {
   margin: 0;
-  color: #37517e;
   color: var(--color-content-primary);
-  line-height: 1.2;
   line-height: var(--line-height-title);
   letter-spacing: 0;
   word-wrap: break-word;
@@ -830,7 +796,6 @@ h6 + ol:not(.list-unstyled),
 .np-text-title-subsection + ol:not(.list-unstyled),
 .np-text-title-body + ol:not(.list-unstyled),
 .np-text-title-group + ol:not(.list-unstyled) {
-  margin-block-start: 8px;
   margin-block-start: var(--size-8);
 }
 /* DEPRECATED: use .np-text-title-screen instead */
@@ -840,9 +805,7 @@ h6 + ol:not(.list-unstyled),
 h1,
 .np-text-title-screen {
   margin-block-end: initial;
-  font-size: 1.875rem;
   font-size: var(--font-size-30);
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
   letter-spacing: -0.021em;
   line-height: 115%;
@@ -854,9 +817,7 @@ h1,
 h2,
 .np-text-title-section {
   margin-block-end: initial;
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
-  font-size: 1.625rem;
   font-size: var(--font-size-26);
   letter-spacing: -0.02em;
   line-height: 122%;
@@ -868,9 +829,7 @@ h2,
 h3,
 .np-text-title-subsection {
   margin-block-end: initial;
-  font-size: 1.375rem;
   font-size: var(--font-size-22);
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
   letter-spacing: -0.018em;
   line-height: 125%;
@@ -881,9 +840,7 @@ h3,
 .title-4,
 h4,
 .np-text-title-body {
-  font-size: 1.125rem;
   font-size: var(--font-size-18);
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
   letter-spacing: -0.014em;
   line-height: 135%;
@@ -896,24 +853,18 @@ h4,
 h5,
 h6,
 .np-text-title-group {
-  font-weight: 500;
   font-weight: var(--font-weight-medium);
-  font-size: 0.875rem;
   font-size: var(--font-size-14);
   letter-spacing: -0.006em;
   line-height: 140%;
 }
 /* DEPRECATED: use .np-text-title-body instead */
 .lead {
-  margin-block-end: 24px;
   margin-block-end: var(--size-24);
-  font-size: 1.25rem;
   font-size: var(--font-size-20);
-  line-height: 1.2;
   line-height: var(--line-height-title);
 }
 .tiny {
-  color: #5d7079;
   color: var(--color-content-secondary);
 }
 /* DEPRECATED: use .np-text-body-default instead */
@@ -925,11 +876,9 @@ h6,
 body,
 small,
 .np-text-body-default {
-  font-size: 0.875rem;
   font-size: var(--font-size-14);
   line-height: 155%;
   letter-spacing: -0.006em;
-  font-weight: 400;
   font-weight: var(--font-weight-regular);
   word-wrap: break-word;
 }
@@ -997,11 +946,9 @@ small,
 .label,
 .control-label,
 .np-text-body-default-bold {
-  font-size: 0.875rem;
   font-size: var(--font-size-14);
   line-height: 155%;
   letter-spacing: -0.006em;
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
   word-wrap: break-word;
 }
@@ -1053,9 +1000,7 @@ small,
 .body-1,
 .value,
 .np-text-body-large {
-  font-weight: 400;
   font-weight: var(--font-weight-regular);
-  font-size: 1rem;
   font-size: var(--font-size-16);
   line-height: 150%;
   letter-spacing: -0.011em;
@@ -1103,9 +1048,7 @@ small,
 /* stylelint-disable-next-line selector-list-comma-newline-after */
 .control-1,
 .np-text-body-large-bold {
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
-  font-size: 1rem;
   font-size: var(--font-size-16);
   line-height: 150%;
   letter-spacing: -0.011em;
@@ -1147,26 +1090,22 @@ small,
 a,
 .np-text-link-default,
 .np-text-link-large {
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
   -webkit-text-decoration: underline;
   text-decoration: underline;
   text-underline-offset: 0.3em;
 }
 .np-text-link-large {
-  font-size: 1rem;
   font-size: var(--font-size-16);
   letter-spacing: -0.011em;
   line-height: 150%;
 }
 .np-text-link-default {
-  font-size: 0.875rem;
   font-size: var(--font-size-14);
   letter-spacing: -0.006em;
   line-height: 155%;
 }
 .np-text-display-number {
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
   font-size: 40px;
   line-height: 110%;
@@ -1189,7 +1128,6 @@ a,
 .np-text-display-large--forced,
 .np-text-display-medium--forced,
 .np-text-display-small--forced {
-  font-family: 'Wise Sans', 'Inter', sans-serif;
   font-family: var(--font-family-display);
   font-synthesis: none;
 }
@@ -1238,9 +1176,7 @@ a,
      * numeric input of ExpressiveMoneyInput.
      * Add `--forced` BEM modifier to the original class name to guarantee it.
      */
-  font-family: 'Inter', Helvetica, Arial, sans-serif;
   font-family: var(--font-family-regular);
-  line-height: 1.2;
   line-height: var(--line-height-title);
 }
 /* DEPRECATED(.np-text-display-extra-large): use .np-text-display-large instead */
@@ -1296,49 +1232,39 @@ a,
 }
 .np-text-display-extra-large,
 .np-text-display-large {
-  font-size: 64px;
   font-size: var(--size-64);
   line-height: normal;
-  font-weight: 700;
   font-weight: var(--font-weight-bold);
 }
 .np-text-display-medium {
-  font-size: 52px;
   font-size: var(--size-52);
   line-height: normal;
-  font-weight: 700;
   font-weight: var(--font-weight-bold);
 }
 .np-text-display-small {
-  font-size: 40px;
   font-size: var(--size-40);
   line-height: normal;
-  font-weight: 700;
   font-weight: var(--font-weight-bold);
 }
 :lang(en) > .np-text-display-extra-large,
 :lang(en) > .np-text-display-large {
-  font-size: 64px;
   font-size: var(--size-64);
   line-height: 0.85;
-  font-weight: 400;
   font-weight: var(--font-weight-regular);
 }
 :lang(en) > .np-text-display-medium {
-  font-size: 52px;
   font-size: var(--size-52);
   line-height: 0.85;
-  font-weight: 400;
   font-weight: var(--font-weight-regular);
 }
 :lang(en) > .np-text-display-small {
-  font-size: 40px;
   font-size: var(--size-40);
   line-height: 0.85;
-  font-weight: 400;
   font-weight: var(--font-weight-regular);
 }
-/* Disable hyphenation for Japanese, Thai, and Chinese — these languages use character-level breaks and should never insert hyphens. */
+/* Disable hyphenation for English
+ * and Japanese, Thai, Chinese (these languages use character-level breaks and should never insert hyphens). */
+:lang(en),
 :lang(ja),
 :lang(th),
 :lang(zh-CN),
@@ -1473,10 +1399,8 @@ a,
 :lang(gsw) .np-text-display-large,
 :lang(dsb) .np-text-display-large,
 :lang(fil) .np-text-display-large {
-  font-size: 64px;
   font-size: var(--size-64);
   line-height: 1.05;
-  font-weight: 400;
   font-weight: var(--font-weight-regular);
 }
 :lang(af) .np-text-display-medium,
@@ -1543,10 +1467,8 @@ a,
 :lang(gsw) .np-text-display-medium,
 :lang(dsb) .np-text-display-medium,
 :lang(fil) .np-text-display-medium {
-  font-size: 52px;
   font-size: var(--size-52);
   line-height: 1.05;
-  font-weight: 400;
   font-weight: var(--font-weight-regular);
 }
 :lang(af) .np-text-display-small,
@@ -1613,10 +1535,8 @@ a,
 :lang(gsw) .np-text-display-small,
 :lang(dsb) .np-text-display-small,
 :lang(fil) .np-text-display-small {
-  font-size: 40px;
   font-size: var(--size-40);
   line-height: 1.05;
-  font-weight: 400;
   font-weight: var(--font-weight-regular);
 }
 :lang(el) .np-text-display-extra-large,
@@ -1645,10 +1565,8 @@ a,
 :lang(uk) .np-text-display-large,
 :lang(uz) .np-text-display-large,
 :lang(sah) .np-text-display-large {
-  font-size: 60px;
   font-size: var(--size-60);
   line-height: 120%;
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
 }
 :lang(el) .np-text-display-medium,
@@ -1664,10 +1582,8 @@ a,
 :lang(uk) .np-text-display-medium,
 :lang(uz) .np-text-display-medium,
 :lang(sah) .np-text-display-medium {
-  font-size: 48px;
   font-size: var(--size-48);
   line-height: 120%;
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
 }
 :lang(el) .np-text-display-small,
@@ -1683,83 +1599,70 @@ a,
 :lang(uk) .np-text-display-small,
 :lang(uz) .np-text-display-small,
 :lang(sah) .np-text-display-small {
-  font-size: 40px;
   font-size: var(--size-40);
   line-height: 120%;
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
 }
 /* DEPRECATED: use `.np-text-display-*` instead */
 .display-1 {
-  margin-block-end: 24px;
   margin-block-end: var(--size-24);
   /* stylelint-disable-next-line number-max-precision */
   font-size: 3.73333333rem;
 }
 @media (min-width: 840px) {
   .display-1 {
-    margin-block-end: 8px;
     margin-block-end: var(--size-8);
     font-size: 6.5rem;
   }
 }
 /* DEPRECATED: use `.np-text-display-*` instead */
 .display-2 {
-  margin-block-end: 24px;
   margin-block-end: var(--size-24);
   /* stylelint-disable-next-line number-max-precision */
   font-size: 3.73333333rem;
 }
 @media (min-width: 840px) {
   .display-2 {
-    margin-block-end: 16px;
     margin-block-end: var(--size-16);
     font-size: 5.5rem;
   }
 }
 /* DEPRECATED: use `.np-text-display-*` instead */
 .display-3 {
-  margin-block-end: 8px;
   margin-block-end: var(--size-8);
   font-size: 2.8rem;
 }
 @media (min-width: 840px) {
   .display-3 {
-    margin-block-end: 24px;
     margin-block-end: var(--size-24);
     font-size: 4.5rem;
   }
 }
 /* DEPRECATED: use `.np-text-display-*` instead */
 .display-4 {
-  margin-block-end: 4px;
   margin-block-end: var(--size-4);
   /* stylelint-disable-next-line number-max-precision */
   font-size: 1.86666667rem;
 }
 @media (min-width: 840px) {
   .display-4 {
-    margin-block-end: 24px;
     margin-block-end: var(--size-24);
     font-size: 3.5rem;
   }
 }
 /* DEPRECATED: use `.np-text-display-*` instead */
 .display-5 {
-  margin-block-end: 4px;
   margin-block-end: var(--size-4);
   /* stylelint-disable-next-line number-max-precision */
   font-size: 1.86666667rem;
 }
 @media (min-width: 840px) {
   .display-5 {
-    margin-block-end: 8px;
     margin-block-end: var(--size-8);
     font-size: 2.625rem;
   }
 }
 p {
-  margin-block: 0 16px;
   margin-block: 0 var(--size-16);
   margin-inline: 0;
 }
@@ -1786,47 +1689,35 @@ p + .np-text-title-subsection,
 p + .np-text-title-body,
 p + .np-text-title-group {
   margin-block-start: 0;
-  margin-block-end: 8px;
   margin-block-end: var(--size-8);
 }
 .control-1,
 .control-2 {
-  color: #0097c7;
   color: var(--color-content-accent);
 }
 strong,
 b {
-  font-weight: 600;
   font-weight: var(--font-weight-semi-bold);
-  color: #37517e;
   color: var(--color-content-primary);
 }
 mark,
 .mark {
-  padding: 4px;
   padding: var(--size-4);
-  background-color: rgba(255,172,0,0.10196);
   background-color: var(--color-background-warning);
 }
 address {
-  margin-block-end: 24px;
   margin-block-end: var(--size-24);
   font-style: normal;
 }
 blockquote {
-  margin-block: 16px;
   margin-block: var(--size-16);
   margin-inline: 0;
   padding-block: 0 0;
-  padding-inline: calc(16px - 2px) 16px;
   padding-inline: calc(var(--size-16) - 2px) var(--size-16);
-  font-size: 1rem;
   font-size: var(--font-size-16);
-  border-inline-start: 2px solid #0097c7;
   border-inline-start: 2px solid var(--color-content-accent);
 }
 blockquote p {
-  margin-block-end: 8px;
   margin-block-end: var(--size-8);
 }
 blockquote p:last-child,
@@ -1836,11 +1727,8 @@ blockquote ul:last-child {
 }
 blockquote footer {
   display: block;
-  color: #5d7079;
   color: var(--color-content-secondary);
-  font-size: 0.875rem;
   font-size: var(--font-size-14);
-  line-height: 1.5;
   line-height: var(--line-height-body);
 }
 blockquote footer::before {
@@ -1848,15 +1736,12 @@ blockquote footer::before {
 }
 @media (min-width: 600px) {
   blockquote {
-    margin: 24px;
     margin: var(--size-24);
   }
 }
 @media (min-width: 1160px) {
   blockquote {
-    margin: 32px;
     margin: var(--size-32);
-    font-size: 1rem;
     font-size: var(--font-size-16);
   }
 }
@@ -1864,7 +1749,6 @@ blockquote footer::before {
   padding-inline-end: 22px;
   padding-inline-start: 0;
   text-align: end;
-  border-inline-end: 2px solid #0097c7;
   border-inline-end: 2px solid var(--color-content-accent);
   border-inline-start: 0  ;
 }
@@ -1877,25 +1761,18 @@ blockquote footer::before {
 pre,
 code,
 kbd {
-  border-radius: 10px;
   border-radius: var(--radius-small);
 }
 pre {
-  margin-block: 0 24px;
   margin-block: 0 var(--size-24);
   margin-inline: 0;
-  padding: 16px;
   padding: var(--size-16);
   overflow: auto;
-  color: #5d7079;
   color: var(--color-content-secondary);
-  font-size: 0.875rem;
   font-size: var(--font-size-14);
-  line-height: 1.5;
   line-height: var(--line-height-body);
   word-wrap: break-word;
   word-break: break-all;
-  background-color: rgba(134,167,189,0.10196);
   background-color: var(--color-background-neutral);
 }
 pre code {
@@ -1907,17 +1784,13 @@ pre code {
 }
 code {
   padding-block: 2px;
-  padding-inline: 4px;
   padding-inline: var(--size-4);
   font-size: 90%;
-  color: #5d7079;
   color: var(--color-content-secondary);
-  background-color: rgba(134,167,189,0.10196);
   background-color: var(--color-background-neutral);
 }
 kbd {
   padding-block: 2px;
-  padding-inline: 4px;
   padding-inline: var(--size-4);
   font-size: 90%;
   color: #fff;
@@ -1925,7 +1798,6 @@ kbd {
 }
 kbd kbd {
   padding: 0;
-  font-weight: 700;
   font-weight: var(--font-weight-bold);
   font-size: 100%;
 }
@@ -2035,46 +1907,38 @@ kbd kbd {
   word-wrap: anywhere;
 }
 .font-weight-bold {
-  font-weight: 700 !important;
   font-weight: var(--font-weight-bold) !important;
 }
 .font-weight-semi-bold {
-  font-weight: 600 !important;
   font-weight: var(--font-weight-semi-bold) !important;
 }
 .font-weight-normal {
-  font-weight: 400 !important;
   font-weight: var(--font-weight-regular) !important;
 }
 .font-italic {
   font-style: italic !important;
 }
 .text-primary {
-  color: #37517e !important;
   color: var(--color-content-primary) !important;
 }
 a.text-primary:hover,
 a.text-primary:focus {
-  color: #37517e !important;
   color: var(--color-content-primary) !important;
 }
 .bg-primary .text-primary {
   color: #ffffff !important;
 }
 .text-secondary {
-  color: #5d7079 !important;
   color: var(--color-content-secondary) !important;
 }
 .text-positive,
 .text-success {
-  color: #008026 !important;
   color: var(--color-content-positive) !important;
 }
 a.text-positive:hover,
 a.text-success:hover,
 a.text-positive:focus,
 a.text-success:focus {
-  color: #006d13 !important;
   color: var(--color-content-positive-hover) !important;
 }
 .bg-primary .text-positive,
@@ -2083,7 +1947,6 @@ a.text-success:focus {
 }
 .text-accent,
 .text-info {
-  color: #0097c7 !important;
   color: var(--color-content-accent) !important;
   color: var(--color-interactive-primary) !important;
 }
@@ -2091,7 +1954,6 @@ a.text-accent:hover,
 a.text-info:hover,
 a.text-accent:focus,
 a.text-info:focus {
-  color: #0084b3 !important;
   color: var(--color-content-accent-hover) !important;
 }
 .bg-primary .text-accent,
@@ -2099,12 +1961,10 @@ a.text-info:focus {
   color: #00b9ff !important;
 }
 .text-warning {
-  color: #9a6500 !important;
   color: var(--color-content-warning) !important;
 }
 a.text-warning:hover,
 a.text-warning:focus {
-  color: #855400 !important;
   color: var(--color-content-warning-hover) !important;
 }
 .bg-primary .text-warning {
@@ -2132,7 +1992,6 @@ a.text-inverse:focus {
   color: #c9cbce !important;
 }
 .text-muted {
-  color: #768e9c !important;
   color: var(--color-content-tertiary) !important;
 }
 .colored-dot::after {