cozy-sharing 10.2.0 → 10.4.0

package/dist/stylesheet.css

@@ -1,46 +1,16 @@
-/*  imported from publicBanner.styl  */
+/*  imported from CozyPassFingerprintDialogContent.styl  */
 
-.publicBanner__bannermarkdown___1EMSa img {
-  background-color: var(--paleGrey);
-  color: var(--silver);
-  position: relative;
-}
-.publicBanner__bannermarkdown___1EMSa img svg {
-  width: 50%;
-  height: 50%;
-}
-.publicBanner__bannermarkdown___1EMSa img {
-  --circleSize: 2.5rem;
-  width: var(--circleSize);
-  height: var(--circleSize);
-  min-width: var(--circleSize);
-  min-height: var(--circleSize);
-  font-size: calc(var(--circleSize) / 2.28);
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 50%;
-  overflow: hidden;
-  background-color: var(--dodgerBlue);
-  color: var(--white);
-}
-.publicBanner__bannermarkdown___1EMSa {
-  font-weight: bold;
-  display: inline-block;
+.CozyPassFingerprintDialogContent__cozy-pass-fingerprint-modal__fingerprint___3qIGs {
+  padding: 16px;
+  margin: 24px 0;
+  text-align: center;
 }
-.publicBanner__bannermarkdown___1EMSa img {
-  width: 1rem;
-  height: 1rem;
-  min-width: 1rem;
-  min-height: 1rem;
-  font-size: 0.438rem;
-  vertical-align: text-bottom;
+.CozyPassFingerprintDialogContent__cozy-pass-fingerprint-modal__fingerprint___3qIGs p {
+  color: var(--secondaryColor);
 }
-/*
-     imported from share.styl 
-    */
+/*  imported from recipient.styl  */
 
-@-moz-keyframes share__spin___1P7nU {
+@-moz-keyframes recipient__spin___2tYv3 {
   from {
     transform: rotate(0deg);
   }
@@ -48,7 +18,7 @@
     transform: rotate(359deg);
   }
 }
-@-webkit-keyframes share__spin___1P7nU {
+@-webkit-keyframes recipient__spin___2tYv3 {
   from {
     transform: rotate(0deg);
   }
@@ -56,7 +26,7 @@
     transform: rotate(359deg);
   }
 }
-@-o-keyframes share__spin___1P7nU {
+@-o-keyframes recipient__spin___2tYv3 {
   from {
     transform: rotate(0deg);
   }
@@ -64,7 +34,7 @@
     transform: rotate(359deg);
   }
 }
-@keyframes share__spin___1P7nU {
+@keyframes recipient__spin___2tYv3 {
   from {
     transform: rotate(0deg);
   }
@@ -72,7 +42,7 @@
     transform: rotate(359deg);
   }
 }
-@-moz-keyframes share__shake___1EeCI {
+@-moz-keyframes recipient__shake___TGyPp {
   10%, 90% {
     transform: translate3d(-1px, 0, 0);
   }
@@ -86,7 +56,7 @@
     transform: translate3d(4px, 0, 0);
   }
 }
-@-webkit-keyframes share__shake___1EeCI {
+@-webkit-keyframes recipient__shake___TGyPp {
   10%, 90% {
     transform: translate3d(-1px, 0, 0);
   }
@@ -100,7 +70,7 @@
     transform: translate3d(4px, 0, 0);
   }
 }
-@-o-keyframes share__shake___1EeCI {
+@-o-keyframes recipient__shake___TGyPp {
   10%, 90% {
     transform: translate3d(-1px, 0, 0);
   }
@@ -114,7 +84,7 @@
     transform: translate3d(4px, 0, 0);
   }
 }
-@keyframes share__shake___1EeCI {
+@keyframes recipient__shake___TGyPp {
   10%, 90% {
     transform: translate3d(-1px, 0, 0);
   }
@@ -128,549 +98,114 @@
     transform: translate3d(4px, 0, 0);
   }
 }
-.u-visuallyhidden {
-  position: absolute !important;
-  border: 0 !important;
-  width: 0.063rem !important;
-  height: 0.063rem !important;
-  overflow: hidden !important;
-  padding: 0 !important;
-  white-space: nowrap !important;
-  clip: rect(0.063rem, 0.063rem, 0.063rem, 0.063rem) !important;
-  clip-path: inset(50%) !important;
-}
-.u-hide {
-  display: none !important;
-  visibility: hidden !important;
-}
-@media (max-width: 63.938rem) {
-  .u-hide--mob {
-    display: none !important;
-  }
-}
-@media (min-width: 64rem) {
-  .u-hide--tablet {
-    display: none !important;
-  }
-}
-@media (min-width: 48.063rem) {
-  .u-hide--desk {
-    display: none !important;
-  }
-}
-.u-dn {
-  display: none;
-}
-.u-di {
-  display: inline;
-}
-.u-db {
-  display: block;
-}
-.u-dib {
-  display: inline-block;
-}
-.u-dit {
-  display: inline-table;
-}
-.u-dt {
-  display: table;
-}
-.u-dtc {
-  display: table-cell;
-}
-.u-dt-row {
-  display: table-row;
-}
-.u-dt-row-group {
-  display: table-row-group;
-}
-.u-dt-column {
-  display: table-column;
+@media (pointer: coarse) {
 }
-.u-dt-column-group {
-  display: table-column-group;
+:root {
+  --genericRecipientBackground: var(--slateGrey);
+  --genericRecipientColor: var(--white);
 }
-@media (max-width: 30rem) {
-  .u-dn-t {
-    display: none;
-  }
-  .u-di-t {
-    display: inline;
-  }
-  .u-db-t {
-    display: block;
-  }
-  .u-dib-t {
-    display: inline-block;
-  }
-  .u-dit-t {
-    display: inline-table;
-  }
-  .u-dt-t {
-    display: table;
-  }
-  .u-dtc-t {
-    display: table-cell;
-  }
-  .u-dt-row-t {
-    display: table-row;
-  }
-  .u-dt-row-group-t {
-    display: table-row-group;
-  }
-  .u-dt-column-t {
-    display: table-column;
-  }
-  .u-dt-column-group-t {
-    display: table-column-group;
-  }
+.recipient__recipient___2DmZI {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
 }
 @media (max-width: 48rem) {
-  .u-dn-s {
-    display: none;
-  }
-  .u-di-s {
-    display: inline;
-  }
-  .u-db-s {
-    display: block;
-  }
-  .u-dib-s {
-    display: inline-block;
-  }
-  .u-dit-s {
-    display: inline-table;
-  }
-  .u-dt-s {
-    display: table;
-  }
-  .u-dtc-s {
-    display: table-cell;
-  }
-  .u-dt-row-s {
-    display: table-row;
-  }
-  .u-dt-row-group-s {
-    display: table-row-group;
-  }
-  .u-dt-column-s {
-    display: table-column;
-  }
-  .u-dt-column-group-s {
-    display: table-column-group;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-dn-m {
-    display: none;
-  }
-  .u-di-m {
-    display: inline;
-  }
-  .u-db-m {
-    display: block;
-  }
-  .u-dib-m {
-    display: inline-block;
-  }
-  .u-dit-m {
-    display: inline-table;
-  }
-  .u-dt-m {
-    display: table;
-  }
-  .u-dtc-m {
-    display: table-cell;
-  }
-  .u-dt-row-m {
-    display: table-row;
-  }
-  .u-dt-row-group-m {
-    display: table-row-group;
-  }
-  .u-dt-column-m {
-    display: table-column;
-  }
-  .u-dt-column-group-m {
-    display: table-column-group;
+  .recipient__recipient___2DmZI {
+    align-items: flex-start;
   }
 }
-.u-black {
-  color: var(--black) !important;
-}
-.u-charcoalGrey {
-  color: var(--charcoalGrey) !important;
-}
-.u-coolGrey {
-  color: var(--coolGrey) !important;
-}
-.u-silver {
-  color: var(--silver) !important;
-}
-.u-slateGrey {
-  color: var(--slateGrey) !important;
-}
-.u-lightishPurple {
-  color: #b449e7 !important;
-}
-.u-dodgerBlue {
-  color: #297ef2 !important;
-}
-.u-overlay {
-  color: var(--overlay) !important;
-}
-.u-paleGrey {
-  color: var(--paleGrey) !important;
-}
-.u-monza {
-  color: #dd0505 !important;
-}
-.u-pomegranate {
-  color: #f52d2d !important;
-}
-.u-primaryBackgroundLight {
-  color: var(--primaryBackgroundLight) !important;
-}
-.u-primaryColor {
-  color: var(--primaryColor) !important;
-}
-.u-primaryColorLight {
-  color: var(--primaryColorLight) !important;
-}
-.u-primaryContrastTextColor {
-  color: var(--primaryContrastTextColor) !important;
-}
-.u-error {
-  color: var(--errorColor) !important;
-}
-.u-errorBackground {
-  color: var(--errorBackground) !important;
-}
-.u-success {
-  color: var(--successColor) !important;
-}
-.u-warning {
-  color: var(--warningColor) !important;
-}
-.u-info {
-  color: var(--infoColor) !important;
-}
-.u-weirdGreen {
-  color: #40de8e !important;
-}
-.u-white {
-  color: var(--white) !important;
-}
-.u-breakword {
-  word-break: break-word;
+.recipient__recipients-list-light___Vq4op .recipient__recipient___2DmZI {
+  margin: 1rem 0;
 }
-.u-ellipsis {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
+.recipient__recipients-list-light___Vq4op + .recipient__recipient___2DmZI {
+  margin-top: 1rem;
 }
-.u-spacellipsis {
+.recipient__recipient-idents___3s7rw {
+  flex: 1 1 auto;
   overflow: hidden;
   text-overflow: ellipsis;
-  white-space: break-spaces;
-}
-@media (max-width: 30rem) {
-  .u-spacellipsis-t {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: break-spaces;
-  }
-}
-@media (max-width: 48rem) {
-  .u-spacellipsis-s {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: break-spaces;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-spacellipsis-m {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: break-spaces;
-  }
-}
-.u-midellipsis {
-  display: flex;
-  flex-wrap: nowrap;
 }
-.u-midellipsis > * {
-  display: inline-block;
-  max-width: 50%;
-  overflow: hidden;
-  white-space: pre;
+.recipient__recipient-status-icon___-liGw {
+  margin-right: 0.25rem;
 }
-.u-midellipsis > :first-child {
+.recipient__recipient-user___1THIU,
+.recipient__recipient-details___2fZfc {
   text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+  line-height: 1.3;
 }
-.u-midellipsis > :last-child {
-  text-overflow: clip;
-  direction: rtl;
-}
-@supports (text-overflow: '[...]') {
-  .u-midellipsis > :first-child {
-    text-overflow: '[...]';
-  }
-}
-.u-link:link {
-  color: var(--linkColor) !important;
-  text-decoration: var(--linkTextDecoration) !important;
-}
-.u-link:visited,
-.u-link:active,
-.u-link:hover,
-.u-link:focus {
-  color: var(--linkColorActive) !important;
-}
-.u-lh-tiny {
-  line-height: 1 !important;
-}
-.u-lh-xsmall {
-  line-height: 1.1 !important;
-}
-.u-lh-small {
-  line-height: 1.2 !important;
-}
-.u-lh-medium {
-  line-height: 1.3 !important;
-}
-.u-lh-large {
-  line-height: 1.4 !important;
-}
-.u-lh-xlarge {
-  line-height: 1.5 !important;
-}
-.u-fz-tiny {
-  font-size: 0.75rem !important;
-  line-height: 1.3 !important;
-}
-.u-fz-xsmall {
-  font-size: 0.813rem !important;
-  line-height: 1.4 !important;
-}
-.u-fz-small {
-  font-size: 0.875rem !important;
-  line-height: 1.4 !important;
-}
-.u-fz-medium {
-  font-size: 1rem !important;
-  line-height: 1.5 !important;
-}
-.u-fz-large {
-  font-size: 1.125rem !important;
-  line-height: 1.5 !important;
-}
-@media (max-width: 30rem) {
-  .u-fz-tiny-t {
-    font-size: 0.75rem !important;
-    line-height: 1.3 !important;
-  }
-  .u-fz-xsmall-t {
-    font-size: 0.813rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-small-t {
-    font-size: 0.875rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-medium-t {
-    font-size: 1rem !important;
-    line-height: 1.5 !important;
-  }
-  .u-fz-large-t {
-    font-size: 1.125rem !important;
-    line-height: 1.5 !important;
-  }
-}
-@media (max-width: 48rem) {
-  .u-fz-tiny-s {
-    font-size: 0.75rem !important;
-    line-height: 1.3 !important;
-  }
-  .u-fz-xsmall-s {
-    font-size: 0.813rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-small-s {
-    font-size: 0.875rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-medium-s {
-    font-size: 1rem !important;
-    line-height: 1.5 !important;
-  }
-  .u-fz-large-s {
-    font-size: 1.125rem !important;
-    line-height: 1.5 !important;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-fz-tiny-m {
-    font-size: 0.75rem !important;
-    line-height: 1.3 !important;
-  }
-  .u-fz-xsmall-m {
-    font-size: 0.813rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-small-m {
-    font-size: 0.875rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-medium-m {
-    font-size: 1rem !important;
-    line-height: 1.5 !important;
-  }
-  .u-fz-large-m {
-    font-size: 1.125rem !important;
-    line-height: 1.5 !important;
-  }
-}
-.u-ta-left {
-  text-align: left !important;
-}
-.u-ta-right {
-  text-align: right !important;
-}
-.u-ta-center {
-  text-align: center !important;
-}
-.u-ta-justify {
-  text-align: justify !important;
-}
-@media (max-width: 30rem) {
-  .u-ta-left-t {
-    text-align: left !important;
-  }
-  .u-ta-right-t {
-    text-align: right !important;
-  }
-  .u-ta-center-t {
-    text-align: center !important;
-  }
-  .u-ta-justify-t {
-    text-align: justify !important;
-  }
-}
-@media (max-width: 48rem) {
-  .u-ta-left-s {
-    text-align: left !important;
-  }
-  .u-ta-right-s {
-    text-align: right !important;
-  }
-  .u-ta-center-s {
-    text-align: center !important;
-  }
-  .u-ta-justify-s {
-    text-align: justify !important;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-ta-left-m {
-    text-align: left !important;
-  }
-  .u-ta-right-m {
-    text-align: right !important;
-  }
-  .u-ta-center-m {
-    text-align: center !important;
-  }
-  .u-ta-justify-m {
-    text-align: justify !important;
-  }
-}
-.u-fs-normal {
-  font-style: normal !important;
+.recipient__recipient-user___1THIU {
+  font-size: 1rem;
+  font-weight: bold;
 }
-.u-fs-italic {
-  font-style: italic !important;
+.recipient__recipient-details___2fZfc {
+  font-size: 0.875rem;
+  color: var(--coolGrey);
 }
-@media (max-width: 30rem) {
-  .u-fs-normal-t {
-    font-style: normal !important;
-  }
-  .u-fs-italic-t {
-    font-style: italic !important;
-  }
+.recipient__avatar___2LnIV {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
 }
-@media (max-width: 48rem) {
-  .u-fs-normal-s {
-    font-style: normal !important;
-  }
-  .u-fs-italic-s {
-    font-style: italic !important;
-  }
+.recipient__avatar___2LnIV .recipient__recipient-user___1THIU {
+  font-size: 1.125rem;
 }
-@media (max-width: 63.938rem) {
-  .u-fs-normal-m {
-    font-style: normal !important;
-  }
-  .u-fs-italic-m {
-    font-style: italic !important;
-  }
+.recipient__link-recipient-icon-circle___3ZTU- {
+  border: 1px solid var(--borderMainColor);
+  background-color: unset;
+  color: unset;
 }
-.u-fw-normal {
-  font-weight: normal;
+.recipient__recipients-avatars___1npjD {
+  display: inline-flex;
+  flex-direction: row-reverse;
+  margin-right: 0.5rem;
 }
-.u-fw-bold {
-  font-weight: bold;
+.recipient__recipients-avatars___1npjD.recipient__--interactive___160Bp {
+  cursor: pointer;
 }
-@media (max-width: 30rem) {
-  .u-fw-normal-t {
-    font-weight: normal;
-  }
-  .u-fw-bold-t {
-    font-weight: bold;
-  }
+.recipient__recipients-avatars--link___1qeON,
+.recipient__recipients-avatars--plusX___3-6_l,
+.recipient__recipients-avatars--avatar___-owjC {
+  border-width: 2px;
+  border-style: solid;
+  border-color: var(--white);
 }
-@media (max-width: 48rem) {
-  .u-fw-normal-s {
-    font-weight: normal;
-  }
-  .u-fw-bold-s {
-    font-weight: bold;
-  }
+.recipient__recipients-avatars--link___1qeON {
+  background-color: var(--genericRecipientBackground);
 }
-@media (max-width: 63.938rem) {
-  .u-fw-normal-m {
-    font-weight: normal;
-  }
-  .u-fw-bold-m {
-    font-weight: bold;
-  }
+.recipient__recipients-avatars--link___1qeON svg {
+  fill: var(--genericRecipientColor);
 }
-@media (pointer: coarse) {
+.recipient__recipients-avatars--plusX___3-6_l,
+.recipient__recipients-avatars--avatar___-owjC {
+  margin-right: -0.6rem;
 }
-.share__share-modal-content___XTtaK .share__coz-form___33NYF {
+/*  imported from share.styl  */
+
+.share__share-modal-content___1iqEq .share__coz-form___1ICST {
   margin: 1rem 0 0.5rem;
 }
-.share__share-modal-content___XTtaK .share__coz-form___33NYF a,
-.share__share-modal-content___XTtaK .share__coz-form___33NYF a:visited {
+.share__share-modal-content___1iqEq .share__coz-form___1ICST a,
+.share__share-modal-content___1iqEq .share__coz-form___1ICST a:visited {
   color: var(--dodgerBlue);
   text-decoration: none;
 }
-.share__share-modal-content___XTtaK .share__coz-form___33NYF a:hover,
-.share__share-modal-content___XTtaK .share__coz-form___33NYF a:active {
+.share__share-modal-content___1iqEq .share__coz-form___1ICST a:hover,
+.share__share-modal-content___1iqEq .share__coz-form___1ICST a:active {
   text-decoration: underline;
 }
-.share__share-modal-content___XTtaK .share__coz-form___33NYF,
-.share__share-modal-content___XTtaK .share__coz-form-group___1PLAZ {
+.share__share-modal-content___1iqEq .share__coz-form___1ICST,
+.share__share-modal-content___1iqEq .share__coz-form-group___VsQp7 {
   position: relative;
   display: flex;
   flex-direction: column;
 }
-.share__share-modal-content___XTtaK .share__coz-form-desc___-pmK5 {
+.share__share-modal-content___1iqEq .share__coz-form-desc___2mYN4 {
   margin-bottom: 0.5rem;
   line-height: 1.5;
 }
-.share__share-modal-content___XTtaK .share__coz-form-label___31jb0 {
+.share__share-modal-content___1iqEq .share__coz-form-label___bogBw {
   display: block;
   text-transform: uppercase;
   color: var(--coolGrey);
@@ -678,49 +213,49 @@
   padding: 0.563rem 0;
   margin-top: 1rem;
 }
-.share__share-modal-content___XTtaK .share__coz-form-label--error___2EXCl {
+.share__share-modal-content___1iqEq .share__coz-form-label--error___3YPkf {
   display: none;
   color: var(--pomegranate);
 }
-.share__share-modal-content___XTtaK .share__coz-form-errors___1rk2R {
+.share__share-modal-content___1iqEq .share__coz-form-errors___2xYRz {
   color: var(--pomegranate);
 }
-.share__share-modal-content___XTtaK .share__coz-form-controls___39Uwg {
+.share__share-modal-content___1iqEq .share__coz-form-controls___H8kGc {
   display: flex;
   flex-direction: row;
   justify-content: flex-end;
   margin: 1rem 0 0.5rem;
 }
-.share__share-modal-content___XTtaK .share__coz-form-controls___39Uwg a,
-.share__share-modal-content___XTtaK .share__coz-form-controls___39Uwg button,
-.share__share-modal-content___XTtaK .share__coz-form-controls___39Uwg input[type=submit] {
+.share__share-modal-content___1iqEq .share__coz-form-controls___H8kGc a,
+.share__share-modal-content___1iqEq .share__coz-form-controls___H8kGc button,
+.share__share-modal-content___1iqEq .share__coz-form-controls___H8kGc input[type=submit] {
   flex: 0 0 auto;
   margin: 0 0 0.5rem 0.5rem;
 }
-.share__share-modal-content___XTtaK .share__coz-form-controls--full___1YpNp a,
-.share__share-modal-content___XTtaK .share__coz-form-controls--full___1YpNp button,
-.share__share-modal-content___XTtaK .share__coz-form-controls--full___1YpNp input[type=submit] {
+.share__share-modal-content___1iqEq .share__coz-form-controls--full___1oQXF a,
+.share__share-modal-content___1iqEq .share__coz-form-controls--full___1oQXF button,
+.share__share-modal-content___1iqEq .share__coz-form-controls--full___1oQXF input[type=submit] {
   flex: 0 0 100%;
   margin-bottom: 0.5rem;
 }
-.share__share-modal-content___XTtaK .share__coz-form-controls--dispatch___3JXzz {
+.share__share-modal-content___1iqEq .share__coz-form-controls--dispatch___1zIxt {
   justify-content: space-between;
 }
-.share__share-modal-content___XTtaK .share__coz-form-controls--dispatch___3JXzz a,
-.share__share-modal-content___XTtaK .share__coz-form-controls--dispatch___3JXzz button,
-.share__share-modal-content___XTtaK .share__coz-form-controls--dispatch___3JXzz input[type=submit] {
+.share__share-modal-content___1iqEq .share__coz-form-controls--dispatch___1zIxt a,
+.share__share-modal-content___1iqEq .share__coz-form-controls--dispatch___1zIxt button,
+.share__share-modal-content___1iqEq .share__coz-form-controls--dispatch___1zIxt input[type=submit] {
   flex: 0 0 49%;
   margin: 0 0 0.5rem;
 }
-.share__share-modal-content___XTtaK .share__coz-form-controls--dispatch___3JXzz a:last-child,
-.share__share-modal-content___XTtaK .share__coz-form-controls--dispatch___3JXzz button:last-child,
-.share__share-modal-content___XTtaK .share__coz-form-controls--dispatch___3JXzz input[type=submit]:last-child {
+.share__share-modal-content___1iqEq .share__coz-form-controls--dispatch___1zIxt a:last-child,
+.share__share-modal-content___1iqEq .share__coz-form-controls--dispatch___1zIxt button:last-child,
+.share__share-modal-content___1iqEq .share__coz-form-controls--dispatch___1zIxt input[type=submit]:last-child {
   margin-left: auto;
 }
-.share__share-modal-content___XTtaK input[type=text],
-.share__share-modal-content___XTtaK input[type=password],
-.share__share-modal-content___XTtaK input[type=email],
-.share__share-modal-content___XTtaK input[type=url] {
+.share__share-modal-content___1iqEq input[type=text],
+.share__share-modal-content___1iqEq input[type=password],
+.share__share-modal-content___1iqEq input[type=email],
+.share__share-modal-content___1iqEq input[type=url] {
   display: inline-block;
   padding: 0.875rem 0.75rem 0.75rem 0.875rem;
   box-sizing: border-box;
@@ -729,523 +264,99 @@
   border: 0.063rem solid var(--dividerColor);
   color: var(--black);
 }
-.share__share-modal-content___XTtaK input[type=text]::placeholder,
-.share__share-modal-content___XTtaK input[type=password]::placeholder,
-.share__share-modal-content___XTtaK input[type=email]::placeholder,
-.share__share-modal-content___XTtaK input[type=url]::placeholder {
+.share__share-modal-content___1iqEq input[type=text]::placeholder,
+.share__share-modal-content___1iqEq input[type=password]::placeholder,
+.share__share-modal-content___1iqEq input[type=email]::placeholder,
+.share__share-modal-content___1iqEq input[type=url]::placeholder {
   color: var(--coolGrey);
   font-size: 1rem;
 }
-.share__share-modal-content___XTtaK input[type=text]:focus,
-.share__share-modal-content___XTtaK input[type=password]:focus,
-.share__share-modal-content___XTtaK input[type=email]:focus,
-.share__share-modal-content___XTtaK input[type=url]:focus {
+.share__share-modal-content___1iqEq input[type=text]:focus,
+.share__share-modal-content___1iqEq input[type=password]:focus,
+.share__share-modal-content___1iqEq input[type=email]:focus,
+.share__share-modal-content___1iqEq input[type=url]:focus {
   border: 0.063rem solid var(--dodgerBlue);
   outline: 0;
 }
-.share__share-modal-content___XTtaK input[type=text]:hover,
-.share__share-modal-content___XTtaK input[type=password]:hover,
-.share__share-modal-content___XTtaK input[type=email]:hover,
-.share__share-modal-content___XTtaK input[type=url]:hover {
+.share__share-modal-content___1iqEq input[type=text]:hover,
+.share__share-modal-content___1iqEq input[type=password]:hover,
+.share__share-modal-content___1iqEq input[type=email]:hover,
+.share__share-modal-content___1iqEq input[type=url]:hover {
   border: 0.063rem solid var(--coolGrey);
 }
-.share__share-modal-content___XTtaK input[type=text].share__error___6Ycal,
-.share__share-modal-content___XTtaK input[type=password].share__error___6Ycal,
-.share__share-modal-content___XTtaK input[type=email].share__error___6Ycal,
-.share__share-modal-content___XTtaK input[type=url].share__error___6Ycal {
+.share__share-modal-content___1iqEq input[type=text].share__error___pwqPO,
+.share__share-modal-content___1iqEq input[type=password].share__error___pwqPO,
+.share__share-modal-content___1iqEq input[type=email].share__error___pwqPO,
+.share__share-modal-content___1iqEq input[type=url].share__error___pwqPO {
   border: 0.063rem solid var(--pomegranate);
 }
 @media (max-width: 48rem) {
 }
 @media (max-width: 48rem) {
 }
-:root {
-  --invertedBackgroundColor: #297ef2;
-  --invertedContrastTextColor: #fff;
-}
-.share__CozyTheme--inverted___2pLD2 {
-  --primaryTextColor: #fff;
-  --secondaryTextColor: rgba(255,255,255,0.64);
-  --disabledTextColor: rgba(255,255,255,0.4);
-  --hintTextColor: rgba(255,255,255,0.4);
-  --iconTextColor: #fff;
-  --actionColorActive: #fff;
-  --actionColorHover: rgba(255,255,255,0.08);
-  --actionColorSelected: rgba(255,255,255,0.16);
-  --actionColorDisabled: rgba(255,255,255,0.32);
-  --actionColorDisabledBackground: rgba(255,255,255,0.12);
-  --actionColorFocus: rgba(255,255,255,0.24);
-  --actionColorGhost: rgba(255,255,255,0.08);
-  --actionColorHoverGhost: rgba(255,255,255,0.16);
-  --dividerColor: rgba(255,255,255,0.16);
-  --borderMainColor: rgba(255,255,255,0.24);
-  --borderDisabledColor: rgba(255,255,255,0.12);
-  --borderGhostColor: rgba(255,255,255,0.48);
-  --borderGhostDisabledColor: rgba(255,255,255,0.24);
-  --paperBackgroundColor: #297ef2;
-  --defaultBackgroundColor: #579eff;
-  --contrastBackgroundColor: rgba(255,255,255,0.12);
-  --primaryColorLight: #fff;
-  --primaryColor: #fff;
-  --primaryColorDark: #eaf3ff;
-  --primaryContrastTextColor: #297ef2;
-  --secondaryColorLight: #f8eefd;
-  --secondaryColor: #ecd7f7;
-  --secondaryColorDark: #deb8f0;
-  --secondaryContrastTextColor: rgba(29,33,42,0.9);
-  --errorColorLight: #ffecec;
-  --errorColor: #ffd3d3;
-  --errorColorDark: #ffb9b9;
-  --errorColorContrastText: rgba(29,33,42,0.9);
-  --errorBackground: #d31f1f;
-  --warningColorLight: #fff3dd;
-  --warningColor: #ffe4b5;
-  --warningColorDark: #ffd58b;
-  --warningColorContrastText: rgba(29,33,42,0.9);
-  --successColorLight: #e3ffe7;
-  --successColor: #c0f4c6;
-  --successColorDark: #97eca1;
-  --successColorContrastText: rgba(29,33,42,0.9);
-  --infoColorLight: #d4feff;
-  --infoColor: #affdff;
-  --infoColorDark: #86f5f7;
-  --infoColorContrastText: rgba(29,33,42,0.9);
-/*
-    The CSS variables below are historic and we should strive not to
-    use them. Prefer to use directly semantic colors above.
-    */
-  --iconColor: currentColor;
-  --textIconColor: #fff;
-  --actionMenuIconColor: #fff;
-  --barIconColor: #fff;
-  --barIconColorDisabled: rgba(255,255,255,0.88);
-  --spinnerColor: #fff;
-  --linkColor: #fff;
-  --linkColorActive: #fff;
-  --linkTextDecoration: underline;
-  --regularButtonPrimaryColor: #fff;
-  --regularButtonSecondaryColor: #fff;
-  --regularButtonActiveColor: rgba(255,255,255,0.88);
-  --regularButtonConstrastColor: #297ef2;
-  --secondaryButtonPrimaryColor: #297ef2;
-  --secondaryButtonSecondaryColor: #fff;
-  --secondaryButtonActiveColor: rgba(255,255,255,0.24);
-  --secondaryButtonContrastColor: #fff;
-  --dividerColor2: rgba(255,255,255,0.16);
-}
-html {
-/*
-    Grey
-
-    Stylus: grey0        -  #FFFFFF, CSS: var(--grey0)
-    Stylus: grey50       -  #f9fafb, CSS: var(--grey50)
-    Stylus: grey100      -  #f4f5f6, CSS: var(--grey100)
-    Stylus: grey200      -  #eceff1, CSS: var(--grey200)
-    Stylus: grey300      -  #dde0e3, CSS: var(--grey300)
-    Stylus: grey400      -  #bfc3c7, CSS: var(--grey400)
-    Stylus: grey500      -  #9da2a6, CSS: var(--grey500)
-    Stylus: grey600      -  #7c8086, CSS: var(--grey600)
-    Stylus: grey700      -  #5d6169, CSS: var(--grey700)
-    Stylus: grey800      -  #3e424a, CSS: var(--grey800)
-    Stylus: grey900      -  #1d212a, CSS: var(--grey900)
-    Stylus: greyA100     -  #d3d6d8, CSS: var(--greyA100)
-    Stylus: greyA200     -  #a7abaf, CSS: var(--greyA200)
-    Stylus: greyA400     -  #2c3039, CSS: var(--greyA400)
-    Stylus: greyA700     -  #5d6169, CSS: var(--greyA700)
-    Stylus: white        -  #FFFFFF, CSS: var(--white)
-    Stylus: paleGrey     -  #F5F6F7, CSS: var(--paleGrey)
-    Stylus: silver       -  #D6D8Da, CSS: var(--silver)
-    Stylus: coolGrey     -  #95999D, CSS: var(--coolGrey)
-    Stylus: slateGrey    -  #5D6165, CSS: var(--slateGrey)
-    Stylus: charcoalGrey -  #32363F, CSS: var(--charcoalGrey)
-    Stylus: black        -  #000000, CSS: var(--black)
-
-    Styleguide Settings.colors.grey
-    */
-  --grey0: #fff;
-  --grey50: #f9fafb;
-  --grey100: #f4f5f6;
-  --grey200: #eceff1;
-  --grey300: #dde0e3;
-  --grey400: #bfc3c7;
-  --grey500: #9da2a6;
-  --grey600: #7c8086;
-  --grey700: #5d6169;
-  --grey800: #3e424a;
-  --grey900: #1d212a;
-  --greyA100: #d3d6d8;
-  --greyA200: #a7abaf;
-  --greyA400: #2c3039;
-  --greyA700: #5d6169;
-  --white: #fff;
-  --paleGrey: #f5f6f7;
-  --silver: #d6d8da;
-  --coolGrey: #95999d;
-  --slateGrey: #5d6165;
-  --charcoalGrey: #32363f;
-  --black: #000;
-  --overlay: rgba(50,54,63,0.5);
-/*
-    Blue
-
-    Stylus: zircon       -  #F5FAFF, CSS: var(--zircon)
-    Stylus: dodgerBlue   -  #297EF2, CSS: var(--dodgerBlue)
-    Stylus: scienceBlue  -  #0B61D6, CSS: var(--scienceBlue)
-
-    Styleguide Settings.colors.blue
-    */
-  --zircon: #f5faff;
-  --dodgerBlue: #297ef2;
-  --scienceBlue: #0b61d6;
-/*
-    Green
-
-    Stylus: weirdGreen   - #40DE8E, CSS: var(--weirdGreen)
-    Stylus: emerald      - #35CE68, CSS: var(--emerald)
-    Stylus: malachite    - #08b442, CSS: var(--malachite)
-
-    Styleguide Settings.colors.green
-    */
-  --weirdGreen: #40de8e;
-  --emerald: #35ce68;
-  --malachite: #08b442;
-/*
-    Orange
-
-    Stylus: mango         - #FF962F, CSS: var(--mango)
-
-    Styleguide Settings.colors.orange
-    */
-  --mango: #ff962f;
-/*
-    Red
-
-    Stylus: chablis      - #FFF2F2, CSS: var(--chablis)
-    Stylus: yourPink     - #FDCBCB, CSS: var(--yourPink)
-    Stylus: fuchsia      - #FC4C83, CSS: var(--fuchsia)
-    Stylus: pomegranate  - #F52D2D, CSS: var(--pomegranate)
-    Stylus: monza        - #DD0505, CSS: var(--monza)
-
-    Styleguide Settings.colors.red
-    */
-  --chablis: #fff2f2;
-  --yourPink: #fdcbcb;
-  --fuchsia: #fc4c83;
-  --pomegranate: #f52d2d;
-  --monza: #dd0505;
-}
-html,
-.share__CozyTheme--normal___qSFyr {
-/*
-    Primary colors
-
-    Stylus: primaryColorLightest     - #B3D3FF, CSS: var(--primaryColorLightest)
-    Stylus: primaryColorLight        - #5C9DF5, CSS: var(--primaryColorLight)
-    Stylus: primaryColor             - #297EF2, CSS: var(--primaryColor)
-    Stylus: primaryColorDark         - #0B61D6, CSS: var(--primaryColorDark)
-    Stylus: primaryContrastTextColor - #FFF, CSS: var(--primaryContrastTextColor)
-
-    Styleguide Settings.theme.primary
-    */
-  --primaryColorLightest: #b3d3ff;
-  --primaryColorLight: #579eff;
-  --primaryColor: #297ef2;
-  --primaryColorDark: #0f5cc7;
-  --primaryContrastTextColor: #fff;
-/*
-    Secondary colors
-
-    Stylus: secondaryColorLightest     - #FFD3D3, CSS: var(--secondaryColorLightest)
-    Stylus: secondaryColorLight        - #F96B6B, CSS: var(--secondaryColorLight)
-    Stylus: secondaryColor             - #EA3F3F, CSS: var(--secondaryColor)
-    Stylus: secondaryColorDark         - #D31F1F, CSS: var(--secondaryColorDark)
-    Stylus: secondaryContrastTextColor -  #FFF, CSS: var(--secondaryContrastTextColor)
-
-    Styleguide Settings.theme.secondary
-    */
-  --secondaryColorLightest: #ffd3d3;
-  --secondaryColorLight: #f96b6b;
-  --secondaryColor: #ea3f3f;
-  --secondaryColorDark: #d31f1f;
-  --secondaryContrastTextColor: #fff;
-/*
-    Background colors
-
-    Stylus: primaryBackgroundLight -  #F7FAFF, CSS: var(--primaryBackgroundLight)
-    Stylus: paperBackgroundColor -  #FFF, CSS: var(--paperBackgroundColor)
-    Stylus: defaultBackgroundColor -  #F4F5F6, CSS: var(--defaultBackgroundColor)
-    Stylus: contrastBackgroundColor -  #F5F5F6, CSS: var(--contrastBackgroundColor)
-
-    Styleguide Settings.theme.background
-    */
-  --primaryBackgroundLight: #f7faff;
-  --paperBackgroundColor: #fff;
-  --defaultBackgroundColor: #f4f5f6;
-  --contrastBackgroundColor: rgba(29,33,42,0.048);
-/*
-    Text colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: primaryTextColor -  #383B43, CSS: var(--primaryTextColor)
-    Stylus: secondaryTextColor - #6F7177, CSS: var(--secondaryTextColor)
-    Stylus: disabledTextColor - #BEBFC1, CSS: var(--disabledTextColor)
-    Stylus: hintTextColor - #BEBFC1, CSS: var(--hintTextColor)
-    Stylus: iconTextColor - #66686D, CSS: var(--iconTextColor)
-
-    Styleguide Settings.theme.text
-    */
-  --primaryTextColor: rgba(29,33,42,0.9);
-  --secondaryTextColor: rgba(29,33,42,0.64);
-  --disabledTextColor: rgba(29,33,42,0.32);
-  --hintTextColor: rgba(29,33,42,0.32);
-  --iconTextColor: rgba(29,33,42,0.72);
-/*
-    Action colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: actionColorActive   - #8A8C90, CSS: var(--actionColorActive)
-    Stylus: actionColorHover   - #F7F7F7, CSS: var(--actionColorHover)
-    Stylus: actionColorSelected   - #EFEFF0, CSS: var(--actionColorSelected)
-    Stylus: actionColorDisabled   - #CFCFD1, CSS: var(--actionColorDisabled)
-    Stylus: actionColorDisabledBackground   - #E7E7E8, CSS: var(--actionColorDisabledBackground)
-    Stylus: actionColorFocus   - #E7E7E8, CSS: var(--actionColorFocus)
-    Stylus: actionColorGhost   - #EFEFF0, CSS: var(--actionColorGhost)
-    Stylus: actionColorHoverGhost   - #DFE0E0, CSS: var(--actionColorHoverGhost)
-
-    Styleguide Settings.theme.action
-    */
-  --actionColorActive: rgba(29,33,42,0.56);
-  --actionColorHover: rgba(29,33,42,0.04);
-  --actionColorSelected: rgba(29,33,42,0.08);
-  --actionColorDisabled: rgba(29,33,42,0.24);
-  --actionColorDisabledBackground: rgba(29,33,42,0.12);
-  --actionColorFocus: rgba(29,33,42,0.12);
-  --actionColorGhost: rgba(29,33,42,0.08);
-  --actionColorHoverGhost: rgba(29,33,42,0.16);
-/*
-    Border colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: borderMainColor - #DFE0E0, CSS: var(--borderMainColor)
-    Stylus: borderDisabledColor - #EFEFF0, CSS: var(--borderDisabledColor)
-    Stylus: borderGhostColor - #9D9EA1, CSS: var(--borderGhostColor)
-    Stylus: borderGhostDisabledColor - #DFE0E0, CSS: var(--borderGhostDisabledColor)
-
-    Styleguide Settings.theme.border
-    */
-  --borderMainColor: rgba(29,33,42,0.16);
-  --borderDisabledColor: rgba(29,33,42,0.08);
-  --borderGhostColor: rgba(29,33,42,0.48);
-  --borderGhostDisabledColor: rgba(29,33,42,0.16);
-/*
-    Divider colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: dividerColor - #E3E4E5, CSS: var(--dividerColor)
-
-    Styleguide Settings.theme.divider
-    */
-  --dividerColor: rgba(29,33,42,0.12);
-/*
-    Success colors
-
-    Stylus: successColorLight        -  #38C949, CSS: var(--successColorLight)
-    Stylus: successColor             -  #09AB1B, CSS: var(--successColor)
-    Stylus: successColorDark         -  #018711, CSS: var(--successColorDark)
-    Stylus: successColorContrastText -  #FFF, CSS: var(--successColorContrastText)
-
-    Styleguide Settings.theme.success
-    */
-  --successColorLight: #38c949;
-  --successColor: #09ab1b;
-  --successColorDark: #018711;
-  --successColorContrastText: #fff;
-/*
-    Warning colors
-
-    Stylus: warningColorLight        -  #EFA82F, CSS: var(--warningColorLight)
-    Stylus: warningColor             -  #CB8100, CSS: var(--warningColor)
-    Stylus: warningColorDark         -  #986100, CSS: var(--warningColorDark)
-    Stylus: warningColorContrastText -  #FFF, CSS: var(--warningColorContrastText)
-
-    Styleguide Settings.theme.warning
-    */
-  --warningColorLight: #efa82d;
-  --warningColor: #cb8100;
-  --warningColorDark: #986100;
-  --warningColorContrastText: #fff;
-/*
-    Error colors
-
-    Stylus: errorColorLightest     -  #FFECEC, CSS: var(--errorColorLightest)
-    Stylus: errorColorLight        -  #F96B6B, CSS: var(--errorColorLight)
-    Stylus: errorColor             -  #EA3F3F, CSS: var(--errorColor)
-    Stylus: errorColorDark         -  #D31F1F, CSS: var(--errorColorDark)
-    Stylus: errorBackground        -  #FFECEC, CSS: var(--errorBackground)
-    Stylus: errorColorContrastText -  #FFF, CSS: var(--errorColorContrastText)
-
-    Styleguide Settings.theme.error
-    */
-  --errorColorLightest: #ffecec;
-  --errorColorLight: #f96b6b;
-  --errorColor: #ea3f3f;
-  --errorColorDark: #d31f1f;
-  --errorBackground: #ffecec;
-  --errorColorContrastText: #fff;
-/*
-    Info colors
-
-    Stylus: infoColorLight        -  #0EC4C7, CSS: var(--infoColorLight)
-    Stylus: infoColor             -  #009FA2, CSS: var(--infoColor)
-    Stylus: infoColorDark         -  #007578, CSS: var(--infoColorDark)
-    Stylus: infoColorContrastText -  #FFF, CSS: var(--infoColorContrastText)
-
-    Styleguide Settings.theme.info
-    */
-  --infoColorLight: #0ec4c7;
-  --infoColor: #009fa2;
-  --infoColorDark: #007578;
-  --infoColorContrastText: #fff;
-/*
-    Shadow colors
-    */
-  --shadow0: none;
-  --shadow1: 0px 2px 4px 0px rgba(29,33,42,0.08), 0px 4px 16px 0px rgba(29,33,42,0.06), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow2: 0px 3px 5px 0px rgba(29,33,42,0.09), 0px 4px 17px 0px rgba(29,33,42,0.07), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow3: 0px 3px 5px -1px rgba(29,33,42,0.09), 0px 5px 19px 1px rgba(29,33,42,0.08), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow4: 0px 3px 6px -1px rgba(29,33,42,0.1), 0px 5px 20px 1px rgba(29,33,42,0.08), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow5: 0px 4px 6px -1px rgba(29,33,42,0.11), 0px 5px 22px 1px rgba(29,33,42,0.09), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow6: 0px 4px 7px -2px rgba(29,33,42,0.11), 0px 6px 23px 2px rgba(29,33,42,0.1), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow7: 0px 5px 7px -2px rgba(29,33,42,0.12), 0px 6px 24px 2px rgba(29,33,42,0.11), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow8: 0px 5px 8px -2px rgba(29,33,42,0.13), 0px 6px 26px 2px rgba(29,33,42,0.11), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow9: 0px 5px 8px -3px rgba(29,33,42,0.14), 0px 7px 27px 3px rgba(29,33,42,0.12), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow10: 0px 6px 9px -3px rgba(29,33,42,0.14), 0px 7px 29px 3px rgba(29,33,42,0.13), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow11: 0px 6px 9px -3px rgba(29,33,42,0.15), 0px 7px 30px 3px rgba(29,33,42,0.14), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow12: 0px 7px 10px -4px rgba(29,33,42,0.16), 0px 8px 31px 4px rgba(29,33,42,0.15), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow13: 0px 7px 10px -4px rgba(29,33,42,0.16), 0px 8px 33px 4px rgba(29,33,42,0.15), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow14: 0px 8px 11px -5px rgba(29,33,42,0.17), 0px 9px 34px 5px rgba(29,33,42,0.16), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow15: 0px 8px 11px -5px rgba(29,33,42,0.18), 0px 9px 35px 5px rgba(29,33,42,0.17), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow16: 0px 9px 12px -5px rgba(29,33,42,0.18), 0px 9px 37px 5px rgba(29,33,42,0.18), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow17: 0px 9px 12px -6px rgba(29,33,42,0.19), 0px 10px 38px 6px rgba(29,33,42,0.19), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow18: 0px 9px 13px -6px rgba(29,33,42,0.2), 0px 10px 40px 6px rgba(29,33,42,0.19), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow19: 0px 10px 13px -6px rgba(29,33,42,0.21), 0px 10px 41px 6px rgba(29,33,42,0.2), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow20: 0px 10px 14px -7px rgba(29,33,42,0.21), 0px 11px 42px 7px rgba(29,33,42,0.21), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow21: 0px 11px 14px -7px rgba(29,33,42,0.22), 0px 11px 44px 7px rgba(29,33,42,0.22), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow22: 0px 11px 15px -7px rgba(29,33,42,0.23), 0px 11px 45px 7px rgba(29,33,42,0.22), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow23: 0px 12px 15px -8px rgba(29,33,42,0.23), 0px 12px 47px 8px rgba(29,33,42,0.23), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow24: 0px 12px 16px -8px rgba(29,33,42,0.24), 0px 12px 48px 8px rgba(29,33,42,0.24), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow25: 0px 1px 4px rgba(29,33,42,0.04);
-/*
-    ---------------------------------------------------------------------
-    */
-/*
-    The CSS variables below are historic and we should strive not to
-    use them. Prefer to use directly semantic colors above.
-    */
-  --spinnerColor: var(--primaryColor);
-  --linkColor: var(--primaryColor);
-  --linkTextDecoration: none;
-  --linkColorActive: var(--primaryColorDark);
-  --invertedTabsActiveTextColor: var(--primaryContrastTextColor);
-  --invertedTabsInactiveTextColor: var(--primaryContrastTextColor);
-  --invertedTabsIndicatorColor: var(--primaryContrastTextColor);
-  --invertedTabsBackgroundColor: var(--primaryColor);
-  --regularButtonPrimaryColor: var(--primaryColor);
-  --regularButtonSecondaryColor: var(--primaryColor);
-  --regularButtonActiveColor: var(--primaryColorDark);
-  --regularButtonConstrastColor: var(--primaryContrastTextColor);
-  --secondaryButtonPrimaryColor: #fff;
-  --secondaryButtonSecondaryColor: var(--silver);
-  --secondaryButtonActiveColor: var(--silver);
-  --secondaryButtonContrastColor: var(--black);
-  --dividerColor2: var(--coolGrey);
-  --iconColor: currentColor;
-  --textIconColor: var(--charcoalGrey);
-  --actionMenuIconColor: var(--slateGrey);
-  --neutralBackground: var(--paleGrey);
-  --buttonTextTransform: uppercase;
-  --buttonBorderRadius: 0.125rem;
-  --navTextColor: var(--slateGrey);
-  --navTextActiveColor: var(--slateGrey);
-  --navTextHoverColor: var(--charcoalGrey);
-  --alertErrorColor: #fff;
-  --alertErrorBackgroundColor: var(--errorColor);
-  --alertSuccessColor: #fff;
-  --alertSuccessBackgroundColor: var(--successColor);
-  --alertInfoColor: #fff;
-  --alertInfoBackgroundColor: var(--slateGrey);
-}
-.share__share-byemail-onlybylink___C_7b_ {
+.share__share-byemail-onlybylink___29W-t {
   background: var(--paleGrey);
   padding: 1rem 2rem;
   margin: -1.5rem -2rem 1rem;
 }
 @media (max-width: 48rem) {
-  .share__share-byemail-onlybylink___C_7b_ {
+  .share__share-byemail-onlybylink___29W-t {
     padding: 1rem;
     margin: -1.5rem -1rem 1rem;
   }
 }
-.share__share-modal-content___XTtaK {
+.share__share-modal-content___1iqEq {
   min-height: 15.625rem;
 }
-.share__share-modal-content___XTtaK .share__coz-form-group___1PLAZ {
+.share__share-modal-content___1iqEq .share__coz-form-group___VsQp7 {
   flex-shrink: 0;
 }
-.share__aligned-dropdown-button___CeTDs {
+.share__aligned-dropdown-button___3crgG {
   margin-right: -1rem;
 }
-.share__coz-form-group___1PLAZ {
+.share__coz-form-group___VsQp7 {
   margin: 0;
 }
-.share__coz-form-group___1PLAZ h3 {
+.share__coz-form-group___VsQp7 h3 {
   margin: 0.3rem 0 0;
 }
-.share__coz-form-group___1PLAZ h4 {
+.share__coz-form-group___VsQp7 h4 {
   margin: 0 0 0.3rem 0;
 }
-.share__coz-form-group___1PLAZ .share__coz-form___33NYF {
+.share__coz-form-group___VsQp7 .share__coz-form___1ICST {
   margin: 0;
 }
-.share__coz-form-group___1PLAZ .share__coz-form-desc___-pmK5 {
+.share__coz-form-group___VsQp7 .share__coz-form-desc___2mYN4 {
   color: var(--coolGrey);
 }
-.share__share-type-control___KcpDf {
+.share__share-type-control___1YoRr {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   padding: 0.5rem 0 0;
 }
-.share__share-type-control___KcpDf .share__select-wrapper___3FfiH {
+.share__share-type-control___1YoRr .share__select-wrapper___3XBKC {
   flex: 0 0 49%;
   position: relative;
 }
-.share__share-type-control___KcpDf .share__select-wrapper___3FfiH .share__select-option___13o6b {
+.share__share-type-control___1YoRr .share__select-wrapper___3XBKC .share__select-option___3Jp8_ {
   padding: 0.5rem 1.5rem 0.5rem 3rem;
   position: relative;
 }
-.share__share-type-control___KcpDf .share__select-wrapper___3FfiH .share__select-option___13o6b svg {
+.share__share-type-control___1YoRr .share__select-wrapper___3XBKC .share__select-option___3Jp8_ svg {
   position: absolute;
   left: 1rem;
   top: 1rem;
 }
-.share__share-type-control___KcpDf .share__select-wrapper___3FfiH .share__select-option-label___Zj_RU {
+.share__share-type-control___1YoRr .share__select-wrapper___3XBKC .share__select-option-label___1BWz_ {
   line-height: 2;
 }
-.share__share-type-control___KcpDf .share__select-wrapper___3FfiH .share__select-option-desc___6uaQq {
+.share__share-type-control___1YoRr .share__select-wrapper___3XBKC .share__select-option-desc___3jOnr {
   line-height: 1.5;
   font-size: 0.8125rem;
   color: var(--coolGrey);
 }
-.share__share-type-control___KcpDf button {
+.share__share-type-control___1YoRr button {
   flex: 0 0 49%;
   margin: 0;
 }
@@ -1255,1609 +366,39 @@ html,
 input[type=text] {
   width: 100%;
 }
-.share__share-details-created___13BO0,
-.share__share-details-perm___23_VF {
+.share__share-details-created___z3nvO,
+.share__share-details-perm___3HjxK {
   font-size: 1rem;
   margin: 0.5rem 0 0.5rem 3.5rem;
   padding-left: 1.5rem;
   background-position: 0 center;
   background-repeat: no-repeat;
 }
-.share__share-details-created___13BO0 {
+.share__share-details-created___z3nvO {
   background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTZweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iMTZweCIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIyNC4wMDAwMDAsIC0xOTIuMDAwMDAwKSI+CiAgICAgICAgPGcgaWQ9InNsaWNlcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzIuMDAwMDAwLCAzMi4wMDAwMDApIj48L2c+CiAgICAgICAgPHBhdGggZD0iTTIzNywxOTMgTDI0MCwxOTMgTDI0MCwxOTUgTDIyNCwxOTUgTDIyNCwxOTMgTDIyNywxOTMgTDIyNywxOTIgTDIyOSwxOTIgTDIyOSwxOTMgTDIzNSwxOTMgTDIzNSwxOTIgTDIzNywxOTIgTDIzNywxOTMgWiBNMjI0LDE5NiBMMjQwLDE5NiBMMjQwLDIwNi45OTc1MjcgQzI0MCwyMDcuNTUxMTc3IDIzOS41NTUzNjksMjA4IDIzOC45OTkxMjgsMjA4IEwyMjUuMDAwODcyLDIwOCBDMjI0LjQ0ODEwNiwyMDggMjI0LDIwNy41NDQyMzkgMjI0LDIwNi45OTc1MjcgTDIyNCwxOTYgWiBNMjI2LDE5OCBMMjI2LDIwNiBMMjM4LDIwNiBMMjM4LDE5OCBMMjI2LDE5OCBaIE0yMzIsMjAxIEwyMzcsMjAxIEwyMzcsMjA1IEwyMzIsMjA1IEwyMzIsMjAxIFoiIGlkPSJjYWxlbmRhciIgZmlsbD0iIzk1OTk5RCI+PC9wYXRoPgogICAgPC9nPgo8L3N2Zz4=");
 }
-.share__share-details-perm___23_VF {
+.share__share-details-perm___3HjxK {
   background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij4KICA8cGF0aCBmaWxsPSIjOTU5OTlEIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMDEuNSw5OS41IEwxOTIsMTA5LjAyNTM5MSBMMTkyLDExMiBMMTk1LjAzNzcyLDExMiBMMjA0LjUsMTAyLjUgTDIwMS41LDk5LjUgWiBNMjA2LjkxMjE1NCw5Ni45MTIxNTQxIEMyMDYuMTMyMjQzLDk2LjEzMjI0MjkgMjA0Ljg2OTE0NCw5Ni4xMzA4NTU2IDIwNC4wODkyNjQsOTYuOTEwNzM2MSBMMjAzLDk4IEwyMDYuMDMwNzYyLDEwMSBMMjA3LjA5MjI3MSw5OS45MjUyNjYzIEMyMDcuODY5NzM4LDk5LjEzODExMzQgMjA3Ljg2Mzc3Nyw5Ny44NjM3NzcyIDIwNy4wODc4NDYsOTcuMDg3ODQ1OSBMMjA2LjkxMjE1NCw5Ni45MTIxNTQxIFogTTE5OSwxMTAgTDIwNC45OTcwNzEsMTEwIEMyMDUuNTUwOTczLDExMCAyMDYsMTEwLjQ0Mzg2NSAyMDYsMTExIEMyMDYsMTExLjU1MjI4NSAyMDUuNTUzNjg5LDExMiAyMDUuMDAyNDU1LDExMiBMMTk3LDExMiBMMTk5LDExMCBaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTkyIC05NikiLz4KPC9zdmc+Cg==");
   margin-bottom: 0.2rem;
 }
-.share__share-details-perm-desc___tqfXx {
+.share__share-details-perm-desc___3HyHu {
   font-size: 0.875rem;
   margin: 0 0 0.5rem 3.5rem;
   padding-left: 1.5rem;
   line-height: 1.5;
   color: var(--coolGrey);
 }
-/*  imported from CozyPassFingerprintDialogContent.styl  */
-
-.CozyPassFingerprintDialogContent__cozy-pass-fingerprint-modal__fingerprint___2O7dO {
-  padding: 16px;
-  margin: 24px 0;
-  text-align: center;
-}
-.CozyPassFingerprintDialogContent__cozy-pass-fingerprint-modal__fingerprint___2O7dO p {
-  color: var(--secondaryColor);
-}
-/*
-     imported from recipient.styl 
-    */
-
-@-moz-keyframes recipient__spin___3_Uja {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(359deg);
-  }
-}
-@-webkit-keyframes recipient__spin___3_Uja {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(359deg);
-  }
-}
-@-o-keyframes recipient__spin___3_Uja {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(359deg);
-  }
-}
-@keyframes recipient__spin___3_Uja {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(359deg);
-  }
-}
-@-moz-keyframes recipient__shake___TrWC0 {
-  10%, 90% {
-    transform: translate3d(-1px, 0, 0);
-  }
-  20%, 80% {
-    transform: translate3d(2px, 0, 0);
-  }
-  30%, 50%, 70% {
-    transform: translate3d(-4px, 0, 0);
-  }
-  40%, 60% {
-    transform: translate3d(4px, 0, 0);
-  }
-}
-@-webkit-keyframes recipient__shake___TrWC0 {
-  10%, 90% {
-    transform: translate3d(-1px, 0, 0);
-  }
-  20%, 80% {
-    transform: translate3d(2px, 0, 0);
-  }
-  30%, 50%, 70% {
-    transform: translate3d(-4px, 0, 0);
-  }
-  40%, 60% {
-    transform: translate3d(4px, 0, 0);
-  }
-}
-@-o-keyframes recipient__shake___TrWC0 {
-  10%, 90% {
-    transform: translate3d(-1px, 0, 0);
-  }
-  20%, 80% {
-    transform: translate3d(2px, 0, 0);
-  }
-  30%, 50%, 70% {
-    transform: translate3d(-4px, 0, 0);
-  }
-  40%, 60% {
-    transform: translate3d(4px, 0, 0);
-  }
-}
-@keyframes recipient__shake___TrWC0 {
-  10%, 90% {
-    transform: translate3d(-1px, 0, 0);
-  }
-  20%, 80% {
-    transform: translate3d(2px, 0, 0);
-  }
-  30%, 50%, 70% {
-    transform: translate3d(-4px, 0, 0);
-  }
-  40%, 60% {
-    transform: translate3d(4px, 0, 0);
-  }
-}
-.u-visuallyhidden {
-  position: absolute !important;
-  border: 0 !important;
-  width: 0.063rem !important;
-  height: 0.063rem !important;
-  overflow: hidden !important;
-  padding: 0 !important;
-  white-space: nowrap !important;
-  clip: rect(0.063rem, 0.063rem, 0.063rem, 0.063rem) !important;
-  clip-path: inset(50%) !important;
-}
-.u-hide {
-  display: none !important;
-  visibility: hidden !important;
-}
-@media (max-width: 63.938rem) {
-  .u-hide--mob {
-    display: none !important;
-  }
-}
-@media (min-width: 64rem) {
-  .u-hide--tablet {
-    display: none !important;
-  }
-}
-@media (min-width: 48.063rem) {
-  .u-hide--desk {
-    display: none !important;
-  }
-}
-.u-dn {
-  display: none;
-}
-.u-di {
-  display: inline;
-}
-.u-db {
-  display: block;
-}
-.u-dib {
-  display: inline-block;
-}
-.u-dit {
-  display: inline-table;
-}
-.u-dt {
-  display: table;
-}
-.u-dtc {
-  display: table-cell;
-}
-.u-dt-row {
-  display: table-row;
-}
-.u-dt-row-group {
-  display: table-row-group;
-}
-.u-dt-column {
-  display: table-column;
-}
-.u-dt-column-group {
-  display: table-column-group;
-}
-@media (max-width: 30rem) {
-  .u-dn-t {
-    display: none;
-  }
-  .u-di-t {
-    display: inline;
-  }
-  .u-db-t {
-    display: block;
-  }
-  .u-dib-t {
-    display: inline-block;
-  }
-  .u-dit-t {
-    display: inline-table;
-  }
-  .u-dt-t {
-    display: table;
-  }
-  .u-dtc-t {
-    display: table-cell;
-  }
-  .u-dt-row-t {
-    display: table-row;
-  }
-  .u-dt-row-group-t {
-    display: table-row-group;
-  }
-  .u-dt-column-t {
-    display: table-column;
-  }
-  .u-dt-column-group-t {
-    display: table-column-group;
-  }
-}
-@media (max-width: 48rem) {
-  .u-dn-s {
-    display: none;
-  }
-  .u-di-s {
-    display: inline;
-  }
-  .u-db-s {
-    display: block;
-  }
-  .u-dib-s {
-    display: inline-block;
-  }
-  .u-dit-s {
-    display: inline-table;
-  }
-  .u-dt-s {
-    display: table;
-  }
-  .u-dtc-s {
-    display: table-cell;
-  }
-  .u-dt-row-s {
-    display: table-row;
-  }
-  .u-dt-row-group-s {
-    display: table-row-group;
-  }
-  .u-dt-column-s {
-    display: table-column;
-  }
-  .u-dt-column-group-s {
-    display: table-column-group;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-dn-m {
-    display: none;
-  }
-  .u-di-m {
-    display: inline;
-  }
-  .u-db-m {
-    display: block;
-  }
-  .u-dib-m {
-    display: inline-block;
-  }
-  .u-dit-m {
-    display: inline-table;
-  }
-  .u-dt-m {
-    display: table;
-  }
-  .u-dtc-m {
-    display: table-cell;
-  }
-  .u-dt-row-m {
-    display: table-row;
-  }
-  .u-dt-row-group-m {
-    display: table-row-group;
-  }
-  .u-dt-column-m {
-    display: table-column;
-  }
-  .u-dt-column-group-m {
-    display: table-column-group;
-  }
-}
-.u-black {
-  color: var(--black) !important;
-}
-.u-charcoalGrey {
-  color: var(--charcoalGrey) !important;
-}
-.u-coolGrey {
-  color: var(--coolGrey) !important;
-}
-.u-silver {
-  color: var(--silver) !important;
-}
-.u-slateGrey {
-  color: var(--slateGrey) !important;
-}
-.u-lightishPurple {
-  color: #b449e7 !important;
-}
-.u-dodgerBlue {
-  color: #297ef2 !important;
-}
-.u-overlay {
-  color: var(--overlay) !important;
-}
-.u-paleGrey {
-  color: var(--paleGrey) !important;
-}
-.u-monza {
-  color: #dd0505 !important;
-}
-.u-pomegranate {
-  color: #f52d2d !important;
-}
-.u-primaryBackgroundLight {
-  color: var(--primaryBackgroundLight) !important;
-}
-.u-primaryColor {
-  color: var(--primaryColor) !important;
-}
-.u-primaryColorLight {
-  color: var(--primaryColorLight) !important;
-}
-.u-primaryContrastTextColor {
-  color: var(--primaryContrastTextColor) !important;
-}
-.u-error {
-  color: var(--errorColor) !important;
-}
-.u-errorBackground {
-  color: var(--errorBackground) !important;
-}
-.u-success {
-  color: var(--successColor) !important;
-}
-.u-warning {
-  color: var(--warningColor) !important;
-}
-.u-info {
-  color: var(--infoColor) !important;
-}
-.u-weirdGreen {
-  color: #40de8e !important;
-}
-.u-white {
-  color: var(--white) !important;
-}
-.u-breakword {
-  word-break: break-word;
-}
-.u-ellipsis {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.u-spacellipsis {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: break-spaces;
-}
-@media (max-width: 30rem) {
-  .u-spacellipsis-t {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: break-spaces;
-  }
-}
-@media (max-width: 48rem) {
-  .u-spacellipsis-s {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: break-spaces;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-spacellipsis-m {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: break-spaces;
-  }
-}
-.u-midellipsis {
-  display: flex;
-  flex-wrap: nowrap;
-}
-.u-midellipsis > * {
-  display: inline-block;
-  max-width: 50%;
-  overflow: hidden;
-  white-space: pre;
-}
-.u-midellipsis > :first-child {
-  text-overflow: ellipsis;
-}
-.u-midellipsis > :last-child {
-  text-overflow: clip;
-  direction: rtl;
-}
-@supports (text-overflow: '[...]') {
-  .u-midellipsis > :first-child {
-    text-overflow: '[...]';
-  }
-}
-.u-link:link {
-  color: var(--linkColor) !important;
-  text-decoration: var(--linkTextDecoration) !important;
-}
-.u-link:visited,
-.u-link:active,
-.u-link:hover,
-.u-link:focus {
-  color: var(--linkColorActive) !important;
-}
-.u-lh-tiny {
-  line-height: 1 !important;
-}
-.u-lh-xsmall {
-  line-height: 1.1 !important;
-}
-.u-lh-small {
-  line-height: 1.2 !important;
-}
-.u-lh-medium {
-  line-height: 1.3 !important;
-}
-.u-lh-large {
-  line-height: 1.4 !important;
-}
-.u-lh-xlarge {
-  line-height: 1.5 !important;
-}
-.u-fz-tiny {
-  font-size: 0.75rem !important;
-  line-height: 1.3 !important;
-}
-.u-fz-xsmall {
-  font-size: 0.813rem !important;
-  line-height: 1.4 !important;
-}
-.u-fz-small {
-  font-size: 0.875rem !important;
-  line-height: 1.4 !important;
-}
-.u-fz-medium {
-  font-size: 1rem !important;
-  line-height: 1.5 !important;
-}
-.u-fz-large {
-  font-size: 1.125rem !important;
-  line-height: 1.5 !important;
-}
-@media (max-width: 30rem) {
-  .u-fz-tiny-t {
-    font-size: 0.75rem !important;
-    line-height: 1.3 !important;
-  }
-  .u-fz-xsmall-t {
-    font-size: 0.813rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-small-t {
-    font-size: 0.875rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-medium-t {
-    font-size: 1rem !important;
-    line-height: 1.5 !important;
-  }
-  .u-fz-large-t {
-    font-size: 1.125rem !important;
-    line-height: 1.5 !important;
-  }
-}
-@media (max-width: 48rem) {
-  .u-fz-tiny-s {
-    font-size: 0.75rem !important;
-    line-height: 1.3 !important;
-  }
-  .u-fz-xsmall-s {
-    font-size: 0.813rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-small-s {
-    font-size: 0.875rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-medium-s {
-    font-size: 1rem !important;
-    line-height: 1.5 !important;
-  }
-  .u-fz-large-s {
-    font-size: 1.125rem !important;
-    line-height: 1.5 !important;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-fz-tiny-m {
-    font-size: 0.75rem !important;
-    line-height: 1.3 !important;
-  }
-  .u-fz-xsmall-m {
-    font-size: 0.813rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-small-m {
-    font-size: 0.875rem !important;
-    line-height: 1.4 !important;
-  }
-  .u-fz-medium-m {
-    font-size: 1rem !important;
-    line-height: 1.5 !important;
-  }
-  .u-fz-large-m {
-    font-size: 1.125rem !important;
-    line-height: 1.5 !important;
-  }
-}
-.u-ta-left {
-  text-align: left !important;
-}
-.u-ta-right {
-  text-align: right !important;
-}
-.u-ta-center {
-  text-align: center !important;
-}
-.u-ta-justify {
-  text-align: justify !important;
-}
-@media (max-width: 30rem) {
-  .u-ta-left-t {
-    text-align: left !important;
-  }
-  .u-ta-right-t {
-    text-align: right !important;
-  }
-  .u-ta-center-t {
-    text-align: center !important;
-  }
-  .u-ta-justify-t {
-    text-align: justify !important;
-  }
-}
-@media (max-width: 48rem) {
-  .u-ta-left-s {
-    text-align: left !important;
-  }
-  .u-ta-right-s {
-    text-align: right !important;
-  }
-  .u-ta-center-s {
-    text-align: center !important;
-  }
-  .u-ta-justify-s {
-    text-align: justify !important;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-ta-left-m {
-    text-align: left !important;
-  }
-  .u-ta-right-m {
-    text-align: right !important;
-  }
-  .u-ta-center-m {
-    text-align: center !important;
-  }
-  .u-ta-justify-m {
-    text-align: justify !important;
-  }
-}
-.u-fs-normal {
-  font-style: normal !important;
-}
-.u-fs-italic {
-  font-style: italic !important;
-}
-@media (max-width: 30rem) {
-  .u-fs-normal-t {
-    font-style: normal !important;
-  }
-  .u-fs-italic-t {
-    font-style: italic !important;
-  }
-}
-@media (max-width: 48rem) {
-  .u-fs-normal-s {
-    font-style: normal !important;
-  }
-  .u-fs-italic-s {
-    font-style: italic !important;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-fs-normal-m {
-    font-style: normal !important;
-  }
-  .u-fs-italic-m {
-    font-style: italic !important;
-  }
-}
-.u-fw-normal {
-  font-weight: normal;
-}
-.u-fw-bold {
-  font-weight: bold;
-}
-@media (max-width: 30rem) {
-  .u-fw-normal-t {
-    font-weight: normal;
-  }
-  .u-fw-bold-t {
-    font-weight: bold;
-  }
-}
-@media (max-width: 48rem) {
-  .u-fw-normal-s {
-    font-weight: normal;
-  }
-  .u-fw-bold-s {
-    font-weight: bold;
-  }
-}
-@media (max-width: 63.938rem) {
-  .u-fw-normal-m {
-    font-weight: normal;
-  }
-  .u-fw-bold-m {
-    font-weight: bold;
-  }
-}
-@media (pointer: coarse) {
-}
-:root {
-  --invertedBackgroundColor: #297ef2;
-  --invertedContrastTextColor: #fff;
-}
-.recipient__CozyTheme--inverted___2Hb9c {
-  --primaryTextColor: #fff;
-  --secondaryTextColor: rgba(255,255,255,0.64);
-  --disabledTextColor: rgba(255,255,255,0.4);
-  --hintTextColor: rgba(255,255,255,0.4);
-  --iconTextColor: #fff;
-  --actionColorActive: #fff;
-  --actionColorHover: rgba(255,255,255,0.08);
-  --actionColorSelected: rgba(255,255,255,0.16);
-  --actionColorDisabled: rgba(255,255,255,0.32);
-  --actionColorDisabledBackground: rgba(255,255,255,0.12);
-  --actionColorFocus: rgba(255,255,255,0.24);
-  --actionColorGhost: rgba(255,255,255,0.08);
-  --actionColorHoverGhost: rgba(255,255,255,0.16);
-  --dividerColor: rgba(255,255,255,0.16);
-  --borderMainColor: rgba(255,255,255,0.24);
-  --borderDisabledColor: rgba(255,255,255,0.12);
-  --borderGhostColor: rgba(255,255,255,0.48);
-  --borderGhostDisabledColor: rgba(255,255,255,0.24);
-  --paperBackgroundColor: #297ef2;
-  --defaultBackgroundColor: #579eff;
-  --contrastBackgroundColor: rgba(255,255,255,0.12);
-  --primaryColorLight: #fff;
-  --primaryColor: #fff;
-  --primaryColorDark: #eaf3ff;
-  --primaryContrastTextColor: #297ef2;
-  --secondaryColorLight: #f8eefd;
-  --secondaryColor: #ecd7f7;
-  --secondaryColorDark: #deb8f0;
-  --secondaryContrastTextColor: rgba(29,33,42,0.9);
-  --errorColorLight: #ffecec;
-  --errorColor: #ffd3d3;
-  --errorColorDark: #ffb9b9;
-  --errorColorContrastText: rgba(29,33,42,0.9);
-  --errorBackground: #d31f1f;
-  --warningColorLight: #fff3dd;
-  --warningColor: #ffe4b5;
-  --warningColorDark: #ffd58b;
-  --warningColorContrastText: rgba(29,33,42,0.9);
-  --successColorLight: #e3ffe7;
-  --successColor: #c0f4c6;
-  --successColorDark: #97eca1;
-  --successColorContrastText: rgba(29,33,42,0.9);
-  --infoColorLight: #d4feff;
-  --infoColor: #affdff;
-  --infoColorDark: #86f5f7;
-  --infoColorContrastText: rgba(29,33,42,0.9);
-/*
-    The CSS variables below are historic and we should strive not to
-    use them. Prefer to use directly semantic colors above.
-    */
-  --iconColor: currentColor;
-  --textIconColor: #fff;
-  --actionMenuIconColor: #fff;
-  --barIconColor: #fff;
-  --barIconColorDisabled: rgba(255,255,255,0.88);
-  --spinnerColor: #fff;
-  --linkColor: #fff;
-  --linkColorActive: #fff;
-  --linkTextDecoration: underline;
-  --regularButtonPrimaryColor: #fff;
-  --regularButtonSecondaryColor: #fff;
-  --regularButtonActiveColor: rgba(255,255,255,0.88);
-  --regularButtonConstrastColor: #297ef2;
-  --secondaryButtonPrimaryColor: #297ef2;
-  --secondaryButtonSecondaryColor: #fff;
-  --secondaryButtonActiveColor: rgba(255,255,255,0.24);
-  --secondaryButtonContrastColor: #fff;
-  --dividerColor2: rgba(255,255,255,0.16);
-}
-html {
-/*
-    Grey
-
-    Stylus: grey0        -  #FFFFFF, CSS: var(--grey0)
-    Stylus: grey50       -  #f9fafb, CSS: var(--grey50)
-    Stylus: grey100      -  #f4f5f6, CSS: var(--grey100)
-    Stylus: grey200      -  #eceff1, CSS: var(--grey200)
-    Stylus: grey300      -  #dde0e3, CSS: var(--grey300)
-    Stylus: grey400      -  #bfc3c7, CSS: var(--grey400)
-    Stylus: grey500      -  #9da2a6, CSS: var(--grey500)
-    Stylus: grey600      -  #7c8086, CSS: var(--grey600)
-    Stylus: grey700      -  #5d6169, CSS: var(--grey700)
-    Stylus: grey800      -  #3e424a, CSS: var(--grey800)
-    Stylus: grey900      -  #1d212a, CSS: var(--grey900)
-    Stylus: greyA100     -  #d3d6d8, CSS: var(--greyA100)
-    Stylus: greyA200     -  #a7abaf, CSS: var(--greyA200)
-    Stylus: greyA400     -  #2c3039, CSS: var(--greyA400)
-    Stylus: greyA700     -  #5d6169, CSS: var(--greyA700)
-    Stylus: white        -  #FFFFFF, CSS: var(--white)
-    Stylus: paleGrey     -  #F5F6F7, CSS: var(--paleGrey)
-    Stylus: silver       -  #D6D8Da, CSS: var(--silver)
-    Stylus: coolGrey     -  #95999D, CSS: var(--coolGrey)
-    Stylus: slateGrey    -  #5D6165, CSS: var(--slateGrey)
-    Stylus: charcoalGrey -  #32363F, CSS: var(--charcoalGrey)
-    Stylus: black        -  #000000, CSS: var(--black)
-
-    Styleguide Settings.colors.grey
-    */
-  --grey0: #fff;
-  --grey50: #f9fafb;
-  --grey100: #f4f5f6;
-  --grey200: #eceff1;
-  --grey300: #dde0e3;
-  --grey400: #bfc3c7;
-  --grey500: #9da2a6;
-  --grey600: #7c8086;
-  --grey700: #5d6169;
-  --grey800: #3e424a;
-  --grey900: #1d212a;
-  --greyA100: #d3d6d8;
-  --greyA200: #a7abaf;
-  --greyA400: #2c3039;
-  --greyA700: #5d6169;
-  --white: #fff;
-  --paleGrey: #f5f6f7;
-  --silver: #d6d8da;
-  --coolGrey: #95999d;
-  --slateGrey: #5d6165;
-  --charcoalGrey: #32363f;
-  --black: #000;
-  --overlay: rgba(50,54,63,0.5);
-/*
-    Blue
-
-    Stylus: zircon       -  #F5FAFF, CSS: var(--zircon)
-    Stylus: dodgerBlue   -  #297EF2, CSS: var(--dodgerBlue)
-    Stylus: scienceBlue  -  #0B61D6, CSS: var(--scienceBlue)
-
-    Styleguide Settings.colors.blue
-    */
-  --zircon: #f5faff;
-  --dodgerBlue: #297ef2;
-  --scienceBlue: #0b61d6;
-/*
-    Green
-
-    Stylus: weirdGreen   - #40DE8E, CSS: var(--weirdGreen)
-    Stylus: emerald      - #35CE68, CSS: var(--emerald)
-    Stylus: malachite    - #08b442, CSS: var(--malachite)
-
-    Styleguide Settings.colors.green
-    */
-  --weirdGreen: #40de8e;
-  --emerald: #35ce68;
-  --malachite: #08b442;
-/*
-    Orange
-
-    Stylus: mango         - #FF962F, CSS: var(--mango)
-
-    Styleguide Settings.colors.orange
-    */
-  --mango: #ff962f;
-/*
-    Red
-
-    Stylus: chablis      - #FFF2F2, CSS: var(--chablis)
-    Stylus: yourPink     - #FDCBCB, CSS: var(--yourPink)
-    Stylus: fuchsia      - #FC4C83, CSS: var(--fuchsia)
-    Stylus: pomegranate  - #F52D2D, CSS: var(--pomegranate)
-    Stylus: monza        - #DD0505, CSS: var(--monza)
-
-    Styleguide Settings.colors.red
-    */
-  --chablis: #fff2f2;
-  --yourPink: #fdcbcb;
-  --fuchsia: #fc4c83;
-  --pomegranate: #f52d2d;
-  --monza: #dd0505;
-}
-html,
-.recipient__CozyTheme--normal___3WdEw {
-/*
-    Primary colors
-
-    Stylus: primaryColorLightest     - #B3D3FF, CSS: var(--primaryColorLightest)
-    Stylus: primaryColorLight        - #5C9DF5, CSS: var(--primaryColorLight)
-    Stylus: primaryColor             - #297EF2, CSS: var(--primaryColor)
-    Stylus: primaryColorDark         - #0B61D6, CSS: var(--primaryColorDark)
-    Stylus: primaryContrastTextColor - #FFF, CSS: var(--primaryContrastTextColor)
-
-    Styleguide Settings.theme.primary
-    */
-  --primaryColorLightest: #b3d3ff;
-  --primaryColorLight: #579eff;
-  --primaryColor: #297ef2;
-  --primaryColorDark: #0f5cc7;
-  --primaryContrastTextColor: #fff;
-/*
-    Secondary colors
-
-    Stylus: secondaryColorLightest     - #FFD3D3, CSS: var(--secondaryColorLightest)
-    Stylus: secondaryColorLight        - #F96B6B, CSS: var(--secondaryColorLight)
-    Stylus: secondaryColor             - #EA3F3F, CSS: var(--secondaryColor)
-    Stylus: secondaryColorDark         - #D31F1F, CSS: var(--secondaryColorDark)
-    Stylus: secondaryContrastTextColor -  #FFF, CSS: var(--secondaryContrastTextColor)
-
-    Styleguide Settings.theme.secondary
-    */
-  --secondaryColorLightest: #ffd3d3;
-  --secondaryColorLight: #f96b6b;
-  --secondaryColor: #ea3f3f;
-  --secondaryColorDark: #d31f1f;
-  --secondaryContrastTextColor: #fff;
-/*
-    Background colors
-
-    Stylus: primaryBackgroundLight -  #F7FAFF, CSS: var(--primaryBackgroundLight)
-    Stylus: paperBackgroundColor -  #FFF, CSS: var(--paperBackgroundColor)
-    Stylus: defaultBackgroundColor -  #F4F5F6, CSS: var(--defaultBackgroundColor)
-    Stylus: contrastBackgroundColor -  #F5F5F6, CSS: var(--contrastBackgroundColor)
-
-    Styleguide Settings.theme.background
-    */
-  --primaryBackgroundLight: #f7faff;
-  --paperBackgroundColor: #fff;
-  --defaultBackgroundColor: #f4f5f6;
-  --contrastBackgroundColor: rgba(29,33,42,0.048);
-/*
-    Text colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: primaryTextColor -  #383B43, CSS: var(--primaryTextColor)
-    Stylus: secondaryTextColor - #6F7177, CSS: var(--secondaryTextColor)
-    Stylus: disabledTextColor - #BEBFC1, CSS: var(--disabledTextColor)
-    Stylus: hintTextColor - #BEBFC1, CSS: var(--hintTextColor)
-    Stylus: iconTextColor - #66686D, CSS: var(--iconTextColor)
-
-    Styleguide Settings.theme.text
-    */
-  --primaryTextColor: rgba(29,33,42,0.9);
-  --secondaryTextColor: rgba(29,33,42,0.64);
-  --disabledTextColor: rgba(29,33,42,0.32);
-  --hintTextColor: rgba(29,33,42,0.32);
-  --iconTextColor: rgba(29,33,42,0.72);
-/*
-    Action colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: actionColorActive   - #8A8C90, CSS: var(--actionColorActive)
-    Stylus: actionColorHover   - #F7F7F7, CSS: var(--actionColorHover)
-    Stylus: actionColorSelected   - #EFEFF0, CSS: var(--actionColorSelected)
-    Stylus: actionColorDisabled   - #CFCFD1, CSS: var(--actionColorDisabled)
-    Stylus: actionColorDisabledBackground   - #E7E7E8, CSS: var(--actionColorDisabledBackground)
-    Stylus: actionColorFocus   - #E7E7E8, CSS: var(--actionColorFocus)
-    Stylus: actionColorGhost   - #EFEFF0, CSS: var(--actionColorGhost)
-    Stylus: actionColorHoverGhost   - #DFE0E0, CSS: var(--actionColorHoverGhost)
-
-    Styleguide Settings.theme.action
-    */
-  --actionColorActive: rgba(29,33,42,0.56);
-  --actionColorHover: rgba(29,33,42,0.04);
-  --actionColorSelected: rgba(29,33,42,0.08);
-  --actionColorDisabled: rgba(29,33,42,0.24);
-  --actionColorDisabledBackground: rgba(29,33,42,0.12);
-  --actionColorFocus: rgba(29,33,42,0.12);
-  --actionColorGhost: rgba(29,33,42,0.08);
-  --actionColorHoverGhost: rgba(29,33,42,0.16);
-/*
-    Border colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: borderMainColor - #DFE0E0, CSS: var(--borderMainColor)
-    Stylus: borderDisabledColor - #EFEFF0, CSS: var(--borderDisabledColor)
-    Stylus: borderGhostColor - #9D9EA1, CSS: var(--borderGhostColor)
-    Stylus: borderGhostDisabledColor - #DFE0E0, CSS: var(--borderGhostDisabledColor)
-
-    Styleguide Settings.theme.border
-    */
-  --borderMainColor: rgba(29,33,42,0.16);
-  --borderDisabledColor: rgba(29,33,42,0.08);
-  --borderGhostColor: rgba(29,33,42,0.48);
-  --borderGhostDisabledColor: rgba(29,33,42,0.16);
-/*
-    Divider colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: dividerColor - #E3E4E5, CSS: var(--dividerColor)
-
-    Styleguide Settings.theme.divider
-    */
-  --dividerColor: rgba(29,33,42,0.12);
-/*
-    Success colors
-
-    Stylus: successColorLight        -  #38C949, CSS: var(--successColorLight)
-    Stylus: successColor             -  #09AB1B, CSS: var(--successColor)
-    Stylus: successColorDark         -  #018711, CSS: var(--successColorDark)
-    Stylus: successColorContrastText -  #FFF, CSS: var(--successColorContrastText)
-
-    Styleguide Settings.theme.success
-    */
-  --successColorLight: #38c949;
-  --successColor: #09ab1b;
-  --successColorDark: #018711;
-  --successColorContrastText: #fff;
-/*
-    Warning colors
-
-    Stylus: warningColorLight        -  #EFA82F, CSS: var(--warningColorLight)
-    Stylus: warningColor             -  #CB8100, CSS: var(--warningColor)
-    Stylus: warningColorDark         -  #986100, CSS: var(--warningColorDark)
-    Stylus: warningColorContrastText -  #FFF, CSS: var(--warningColorContrastText)
-
-    Styleguide Settings.theme.warning
-    */
-  --warningColorLight: #efa82d;
-  --warningColor: #cb8100;
-  --warningColorDark: #986100;
-  --warningColorContrastText: #fff;
-/*
-    Error colors
-
-    Stylus: errorColorLightest     -  #FFECEC, CSS: var(--errorColorLightest)
-    Stylus: errorColorLight        -  #F96B6B, CSS: var(--errorColorLight)
-    Stylus: errorColor             -  #EA3F3F, CSS: var(--errorColor)
-    Stylus: errorColorDark         -  #D31F1F, CSS: var(--errorColorDark)
-    Stylus: errorBackground        -  #FFECEC, CSS: var(--errorBackground)
-    Stylus: errorColorContrastText -  #FFF, CSS: var(--errorColorContrastText)
-
-    Styleguide Settings.theme.error
-    */
-  --errorColorLightest: #ffecec;
-  --errorColorLight: #f96b6b;
-  --errorColor: #ea3f3f;
-  --errorColorDark: #d31f1f;
-  --errorBackground: #ffecec;
-  --errorColorContrastText: #fff;
-/*
-    Info colors
-
-    Stylus: infoColorLight        -  #0EC4C7, CSS: var(--infoColorLight)
-    Stylus: infoColor             -  #009FA2, CSS: var(--infoColor)
-    Stylus: infoColorDark         -  #007578, CSS: var(--infoColorDark)
-    Stylus: infoColorContrastText -  #FFF, CSS: var(--infoColorContrastText)
-
-    Styleguide Settings.theme.info
-    */
-  --infoColorLight: #0ec4c7;
-  --infoColor: #009fa2;
-  --infoColorDark: #007578;
-  --infoColorContrastText: #fff;
-/*
-    Shadow colors
-    */
-  --shadow0: none;
-  --shadow1: 0px 2px 4px 0px rgba(29,33,42,0.08), 0px 4px 16px 0px rgba(29,33,42,0.06), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow2: 0px 3px 5px 0px rgba(29,33,42,0.09), 0px 4px 17px 0px rgba(29,33,42,0.07), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow3: 0px 3px 5px -1px rgba(29,33,42,0.09), 0px 5px 19px 1px rgba(29,33,42,0.08), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow4: 0px 3px 6px -1px rgba(29,33,42,0.1), 0px 5px 20px 1px rgba(29,33,42,0.08), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow5: 0px 4px 6px -1px rgba(29,33,42,0.11), 0px 5px 22px 1px rgba(29,33,42,0.09), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow6: 0px 4px 7px -2px rgba(29,33,42,0.11), 0px 6px 23px 2px rgba(29,33,42,0.1), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow7: 0px 5px 7px -2px rgba(29,33,42,0.12), 0px 6px 24px 2px rgba(29,33,42,0.11), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow8: 0px 5px 8px -2px rgba(29,33,42,0.13), 0px 6px 26px 2px rgba(29,33,42,0.11), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow9: 0px 5px 8px -3px rgba(29,33,42,0.14), 0px 7px 27px 3px rgba(29,33,42,0.12), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow10: 0px 6px 9px -3px rgba(29,33,42,0.14), 0px 7px 29px 3px rgba(29,33,42,0.13), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow11: 0px 6px 9px -3px rgba(29,33,42,0.15), 0px 7px 30px 3px rgba(29,33,42,0.14), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow12: 0px 7px 10px -4px rgba(29,33,42,0.16), 0px 8px 31px 4px rgba(29,33,42,0.15), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow13: 0px 7px 10px -4px rgba(29,33,42,0.16), 0px 8px 33px 4px rgba(29,33,42,0.15), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow14: 0px 8px 11px -5px rgba(29,33,42,0.17), 0px 9px 34px 5px rgba(29,33,42,0.16), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow15: 0px 8px 11px -5px rgba(29,33,42,0.18), 0px 9px 35px 5px rgba(29,33,42,0.17), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow16: 0px 9px 12px -5px rgba(29,33,42,0.18), 0px 9px 37px 5px rgba(29,33,42,0.18), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow17: 0px 9px 12px -6px rgba(29,33,42,0.19), 0px 10px 38px 6px rgba(29,33,42,0.19), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow18: 0px 9px 13px -6px rgba(29,33,42,0.2), 0px 10px 40px 6px rgba(29,33,42,0.19), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow19: 0px 10px 13px -6px rgba(29,33,42,0.21), 0px 10px 41px 6px rgba(29,33,42,0.2), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow20: 0px 10px 14px -7px rgba(29,33,42,0.21), 0px 11px 42px 7px rgba(29,33,42,0.21), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow21: 0px 11px 14px -7px rgba(29,33,42,0.22), 0px 11px 44px 7px rgba(29,33,42,0.22), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow22: 0px 11px 15px -7px rgba(29,33,42,0.23), 0px 11px 45px 7px rgba(29,33,42,0.22), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow23: 0px 12px 15px -8px rgba(29,33,42,0.23), 0px 12px 47px 8px rgba(29,33,42,0.23), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow24: 0px 12px 16px -8px rgba(29,33,42,0.24), 0px 12px 48px 8px rgba(29,33,42,0.24), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow25: 0px 1px 4px rgba(29,33,42,0.04);
-/*
-    ---------------------------------------------------------------------
-    */
-/*
-    The CSS variables below are historic and we should strive not to
-    use them. Prefer to use directly semantic colors above.
-    */
-  --spinnerColor: var(--primaryColor);
-  --linkColor: var(--primaryColor);
-  --linkTextDecoration: none;
-  --linkColorActive: var(--primaryColorDark);
-  --invertedTabsActiveTextColor: var(--primaryContrastTextColor);
-  --invertedTabsInactiveTextColor: var(--primaryContrastTextColor);
-  --invertedTabsIndicatorColor: var(--primaryContrastTextColor);
-  --invertedTabsBackgroundColor: var(--primaryColor);
-  --regularButtonPrimaryColor: var(--primaryColor);
-  --regularButtonSecondaryColor: var(--primaryColor);
-  --regularButtonActiveColor: var(--primaryColorDark);
-  --regularButtonConstrastColor: var(--primaryContrastTextColor);
-  --secondaryButtonPrimaryColor: #fff;
-  --secondaryButtonSecondaryColor: var(--silver);
-  --secondaryButtonActiveColor: var(--silver);
-  --secondaryButtonContrastColor: var(--black);
-  --dividerColor2: var(--coolGrey);
-  --iconColor: currentColor;
-  --textIconColor: var(--charcoalGrey);
-  --actionMenuIconColor: var(--slateGrey);
-  --neutralBackground: var(--paleGrey);
-  --buttonTextTransform: uppercase;
-  --buttonBorderRadius: 0.125rem;
-  --navTextColor: var(--slateGrey);
-  --navTextActiveColor: var(--slateGrey);
-  --navTextHoverColor: var(--charcoalGrey);
-  --alertErrorColor: #fff;
-  --alertErrorBackgroundColor: var(--errorColor);
-  --alertSuccessColor: #fff;
-  --alertSuccessBackgroundColor: var(--successColor);
-  --alertInfoColor: #fff;
-  --alertInfoBackgroundColor: var(--slateGrey);
-}
-:root {
-  --genericRecipientBackground: var(--slateGrey);
-  --genericRecipientColor: var(--white);
-}
-.recipient__recipient___2zWmH {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-}
-@media (max-width: 48rem) {
-  .recipient__recipient___2zWmH {
-    align-items: flex-start;
-  }
-}
-.recipient__recipients-list-light___1-dkI .recipient__recipient___2zWmH {
-  margin: 1rem 0;
-}
-.recipient__recipients-list-light___1-dkI + .recipient__recipient___2zWmH {
-  margin-top: 1rem;
-}
-.recipient__recipient-idents___3F3zL {
-  flex: 1 1 auto;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.recipient__recipient-status-icon___1GvS9 {
-  margin-right: 0.25rem;
-}
-.recipient__recipient-user___3hOyK,
-.recipient__recipient-details___3fmFE {
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-  line-height: 1.3;
-}
-.recipient__recipient-user___3hOyK {
-  font-size: 1rem;
-  font-weight: bold;
-}
-.recipient__recipient-details___3fmFE {
-  font-size: 0.875rem;
-  color: var(--coolGrey);
-}
-.recipient__avatar___2NIEb {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-}
-.recipient__avatar___2NIEb .recipient__recipient-user___3hOyK {
-  font-size: 1.125rem;
-}
-.recipient__link-recipient-icon-circle___3gmgy {
-  border: 1px solid var(--borderMainColor);
-  background-color: unset;
-  color: unset;
-}
-.recipient__recipients-avatars___MXhiL {
-  display: inline-flex;
-  flex-direction: row-reverse;
-  margin-right: 0.5rem;
-}
-.recipient__recipients-avatars___MXhiL.recipient__--interactive___1gDjM {
-  cursor: pointer;
-}
-.recipient__recipients-avatars--link___2s02h,
-.recipient__recipients-avatars--plusX___WRllr,
-.recipient__recipients-avatars--avatar___3j3_A {
-  border-width: 2px;
-  border-style: solid;
-  border-color: var(--white);
-}
-.recipient__recipients-avatars--link___2s02h {
-  background-color: var(--genericRecipientBackground);
-}
-.recipient__recipients-avatars--link___2s02h svg {
-  fill: var(--genericRecipientColor);
-}
-.recipient__recipients-avatars--plusX___WRllr,
-.recipient__recipients-avatars--avatar___3j3_A {
-  margin-right: -0.6rem;
-}
-/*
-     imported from autosuggest.styl 
-    */
-
-:root {
-  --invertedBackgroundColor: #297ef2;
-  --invertedContrastTextColor: #fff;
-}
-.autosuggest__CozyTheme--inverted___QJCUa {
-  --primaryTextColor: #fff;
-  --secondaryTextColor: rgba(255,255,255,0.64);
-  --disabledTextColor: rgba(255,255,255,0.4);
-  --hintTextColor: rgba(255,255,255,0.4);
-  --iconTextColor: #fff;
-  --actionColorActive: #fff;
-  --actionColorHover: rgba(255,255,255,0.08);
-  --actionColorSelected: rgba(255,255,255,0.16);
-  --actionColorDisabled: rgba(255,255,255,0.32);
-  --actionColorDisabledBackground: rgba(255,255,255,0.12);
-  --actionColorFocus: rgba(255,255,255,0.24);
-  --actionColorGhost: rgba(255,255,255,0.08);
-  --actionColorHoverGhost: rgba(255,255,255,0.16);
-  --dividerColor: rgba(255,255,255,0.16);
-  --borderMainColor: rgba(255,255,255,0.24);
-  --borderDisabledColor: rgba(255,255,255,0.12);
-  --borderGhostColor: rgba(255,255,255,0.48);
-  --borderGhostDisabledColor: rgba(255,255,255,0.24);
-  --paperBackgroundColor: #297ef2;
-  --defaultBackgroundColor: #579eff;
-  --contrastBackgroundColor: rgba(255,255,255,0.12);
-  --primaryColorLight: #fff;
-  --primaryColor: #fff;
-  --primaryColorDark: #eaf3ff;
-  --primaryContrastTextColor: #297ef2;
-  --secondaryColorLight: #f8eefd;
-  --secondaryColor: #ecd7f7;
-  --secondaryColorDark: #deb8f0;
-  --secondaryContrastTextColor: rgba(29,33,42,0.9);
-  --errorColorLight: #ffecec;
-  --errorColor: #ffd3d3;
-  --errorColorDark: #ffb9b9;
-  --errorColorContrastText: rgba(29,33,42,0.9);
-  --errorBackground: #d31f1f;
-  --warningColorLight: #fff3dd;
-  --warningColor: #ffe4b5;
-  --warningColorDark: #ffd58b;
-  --warningColorContrastText: rgba(29,33,42,0.9);
-  --successColorLight: #e3ffe7;
-  --successColor: #c0f4c6;
-  --successColorDark: #97eca1;
-  --successColorContrastText: rgba(29,33,42,0.9);
-  --infoColorLight: #d4feff;
-  --infoColor: #affdff;
-  --infoColorDark: #86f5f7;
-  --infoColorContrastText: rgba(29,33,42,0.9);
-/*
-    The CSS variables below are historic and we should strive not to
-    use them. Prefer to use directly semantic colors above.
-    */
-  --iconColor: currentColor;
-  --textIconColor: #fff;
-  --actionMenuIconColor: #fff;
-  --barIconColor: #fff;
-  --barIconColorDisabled: rgba(255,255,255,0.88);
-  --spinnerColor: #fff;
-  --linkColor: #fff;
-  --linkColorActive: #fff;
-  --linkTextDecoration: underline;
-  --regularButtonPrimaryColor: #fff;
-  --regularButtonSecondaryColor: #fff;
-  --regularButtonActiveColor: rgba(255,255,255,0.88);
-  --regularButtonConstrastColor: #297ef2;
-  --secondaryButtonPrimaryColor: #297ef2;
-  --secondaryButtonSecondaryColor: #fff;
-  --secondaryButtonActiveColor: rgba(255,255,255,0.24);
-  --secondaryButtonContrastColor: #fff;
-  --dividerColor2: rgba(255,255,255,0.16);
-}
-html {
-/*
-    Grey
-
-    Stylus: grey0        -  #FFFFFF, CSS: var(--grey0)
-    Stylus: grey50       -  #f9fafb, CSS: var(--grey50)
-    Stylus: grey100      -  #f4f5f6, CSS: var(--grey100)
-    Stylus: grey200      -  #eceff1, CSS: var(--grey200)
-    Stylus: grey300      -  #dde0e3, CSS: var(--grey300)
-    Stylus: grey400      -  #bfc3c7, CSS: var(--grey400)
-    Stylus: grey500      -  #9da2a6, CSS: var(--grey500)
-    Stylus: grey600      -  #7c8086, CSS: var(--grey600)
-    Stylus: grey700      -  #5d6169, CSS: var(--grey700)
-    Stylus: grey800      -  #3e424a, CSS: var(--grey800)
-    Stylus: grey900      -  #1d212a, CSS: var(--grey900)
-    Stylus: greyA100     -  #d3d6d8, CSS: var(--greyA100)
-    Stylus: greyA200     -  #a7abaf, CSS: var(--greyA200)
-    Stylus: greyA400     -  #2c3039, CSS: var(--greyA400)
-    Stylus: greyA700     -  #5d6169, CSS: var(--greyA700)
-    Stylus: white        -  #FFFFFF, CSS: var(--white)
-    Stylus: paleGrey     -  #F5F6F7, CSS: var(--paleGrey)
-    Stylus: silver       -  #D6D8Da, CSS: var(--silver)
-    Stylus: coolGrey     -  #95999D, CSS: var(--coolGrey)
-    Stylus: slateGrey    -  #5D6165, CSS: var(--slateGrey)
-    Stylus: charcoalGrey -  #32363F, CSS: var(--charcoalGrey)
-    Stylus: black        -  #000000, CSS: var(--black)
-
-    Styleguide Settings.colors.grey
-    */
-  --grey0: #fff;
-  --grey50: #f9fafb;
-  --grey100: #f4f5f6;
-  --grey200: #eceff1;
-  --grey300: #dde0e3;
-  --grey400: #bfc3c7;
-  --grey500: #9da2a6;
-  --grey600: #7c8086;
-  --grey700: #5d6169;
-  --grey800: #3e424a;
-  --grey900: #1d212a;
-  --greyA100: #d3d6d8;
-  --greyA200: #a7abaf;
-  --greyA400: #2c3039;
-  --greyA700: #5d6169;
-  --white: #fff;
-  --paleGrey: #f5f6f7;
-  --silver: #d6d8da;
-  --coolGrey: #95999d;
-  --slateGrey: #5d6165;
-  --charcoalGrey: #32363f;
-  --black: #000;
-  --overlay: rgba(50,54,63,0.5);
-/*
-    Blue
-
-    Stylus: zircon       -  #F5FAFF, CSS: var(--zircon)
-    Stylus: dodgerBlue   -  #297EF2, CSS: var(--dodgerBlue)
-    Stylus: scienceBlue  -  #0B61D6, CSS: var(--scienceBlue)
-
-    Styleguide Settings.colors.blue
-    */
-  --zircon: #f5faff;
-  --dodgerBlue: #297ef2;
-  --scienceBlue: #0b61d6;
-/*
-    Green
-
-    Stylus: weirdGreen   - #40DE8E, CSS: var(--weirdGreen)
-    Stylus: emerald      - #35CE68, CSS: var(--emerald)
-    Stylus: malachite    - #08b442, CSS: var(--malachite)
-
-    Styleguide Settings.colors.green
-    */
-  --weirdGreen: #40de8e;
-  --emerald: #35ce68;
-  --malachite: #08b442;
-/*
-    Orange
-
-    Stylus: mango         - #FF962F, CSS: var(--mango)
-
-    Styleguide Settings.colors.orange
-    */
-  --mango: #ff962f;
-/*
-    Red
-
-    Stylus: chablis      - #FFF2F2, CSS: var(--chablis)
-    Stylus: yourPink     - #FDCBCB, CSS: var(--yourPink)
-    Stylus: fuchsia      - #FC4C83, CSS: var(--fuchsia)
-    Stylus: pomegranate  - #F52D2D, CSS: var(--pomegranate)
-    Stylus: monza        - #DD0505, CSS: var(--monza)
-
-    Styleguide Settings.colors.red
-    */
-  --chablis: #fff2f2;
-  --yourPink: #fdcbcb;
-  --fuchsia: #fc4c83;
-  --pomegranate: #f52d2d;
-  --monza: #dd0505;
-}
-html,
-.autosuggest__CozyTheme--normal___1-_dN {
-/*
-    Primary colors
-
-    Stylus: primaryColorLightest     - #B3D3FF, CSS: var(--primaryColorLightest)
-    Stylus: primaryColorLight        - #5C9DF5, CSS: var(--primaryColorLight)
-    Stylus: primaryColor             - #297EF2, CSS: var(--primaryColor)
-    Stylus: primaryColorDark         - #0B61D6, CSS: var(--primaryColorDark)
-    Stylus: primaryContrastTextColor - #FFF, CSS: var(--primaryContrastTextColor)
-
-    Styleguide Settings.theme.primary
-    */
-  --primaryColorLightest: #b3d3ff;
-  --primaryColorLight: #579eff;
-  --primaryColor: #297ef2;
-  --primaryColorDark: #0f5cc7;
-  --primaryContrastTextColor: #fff;
-/*
-    Secondary colors
+/*  imported from autosuggest.styl  */
 
-    Stylus: secondaryColorLightest     - #FFD3D3, CSS: var(--secondaryColorLightest)
-    Stylus: secondaryColorLight        - #F96B6B, CSS: var(--secondaryColorLight)
-    Stylus: secondaryColor             - #EA3F3F, CSS: var(--secondaryColor)
-    Stylus: secondaryColorDark         - #D31F1F, CSS: var(--secondaryColorDark)
-    Stylus: secondaryContrastTextColor -  #FFF, CSS: var(--secondaryContrastTextColor)
-
-    Styleguide Settings.theme.secondary
-    */
-  --secondaryColorLightest: #ffd3d3;
-  --secondaryColorLight: #f96b6b;
-  --secondaryColor: #ea3f3f;
-  --secondaryColorDark: #d31f1f;
-  --secondaryContrastTextColor: #fff;
-/*
-    Background colors
-
-    Stylus: primaryBackgroundLight -  #F7FAFF, CSS: var(--primaryBackgroundLight)
-    Stylus: paperBackgroundColor -  #FFF, CSS: var(--paperBackgroundColor)
-    Stylus: defaultBackgroundColor -  #F4F5F6, CSS: var(--defaultBackgroundColor)
-    Stylus: contrastBackgroundColor -  #F5F5F6, CSS: var(--contrastBackgroundColor)
-
-    Styleguide Settings.theme.background
-    */
-  --primaryBackgroundLight: #f7faff;
-  --paperBackgroundColor: #fff;
-  --defaultBackgroundColor: #f4f5f6;
-  --contrastBackgroundColor: rgba(29,33,42,0.048);
-/*
-    Text colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: primaryTextColor -  #383B43, CSS: var(--primaryTextColor)
-    Stylus: secondaryTextColor - #6F7177, CSS: var(--secondaryTextColor)
-    Stylus: disabledTextColor - #BEBFC1, CSS: var(--disabledTextColor)
-    Stylus: hintTextColor - #BEBFC1, CSS: var(--hintTextColor)
-    Stylus: iconTextColor - #66686D, CSS: var(--iconTextColor)
-
-    Styleguide Settings.theme.text
-    */
-  --primaryTextColor: rgba(29,33,42,0.9);
-  --secondaryTextColor: rgba(29,33,42,0.64);
-  --disabledTextColor: rgba(29,33,42,0.32);
-  --hintTextColor: rgba(29,33,42,0.32);
-  --iconTextColor: rgba(29,33,42,0.72);
-/*
-    Action colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: actionColorActive   - #8A8C90, CSS: var(--actionColorActive)
-    Stylus: actionColorHover   - #F7F7F7, CSS: var(--actionColorHover)
-    Stylus: actionColorSelected   - #EFEFF0, CSS: var(--actionColorSelected)
-    Stylus: actionColorDisabled   - #CFCFD1, CSS: var(--actionColorDisabled)
-    Stylus: actionColorDisabledBackground   - #E7E7E8, CSS: var(--actionColorDisabledBackground)
-    Stylus: actionColorFocus   - #E7E7E8, CSS: var(--actionColorFocus)
-    Stylus: actionColorGhost   - #EFEFF0, CSS: var(--actionColorGhost)
-    Stylus: actionColorHoverGhost   - #DFE0E0, CSS: var(--actionColorHoverGhost)
-
-    Styleguide Settings.theme.action
-    */
-  --actionColorActive: rgba(29,33,42,0.56);
-  --actionColorHover: rgba(29,33,42,0.04);
-  --actionColorSelected: rgba(29,33,42,0.08);
-  --actionColorDisabled: rgba(29,33,42,0.24);
-  --actionColorDisabledBackground: rgba(29,33,42,0.12);
-  --actionColorFocus: rgba(29,33,42,0.12);
-  --actionColorGhost: rgba(29,33,42,0.08);
-  --actionColorHoverGhost: rgba(29,33,42,0.16);
-/*
-    Border colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: borderMainColor - #DFE0E0, CSS: var(--borderMainColor)
-    Stylus: borderDisabledColor - #EFEFF0, CSS: var(--borderDisabledColor)
-    Stylus: borderGhostColor - #9D9EA1, CSS: var(--borderGhostColor)
-    Stylus: borderGhostDisabledColor - #DFE0E0, CSS: var(--borderGhostDisabledColor)
-
-    Styleguide Settings.theme.border
-    */
-  --borderMainColor: rgba(29,33,42,0.16);
-  --borderDisabledColor: rgba(29,33,42,0.08);
-  --borderGhostColor: rgba(29,33,42,0.48);
-  --borderGhostDisabledColor: rgba(29,33,42,0.16);
-/*
-    Divider colors
-
-    These colors use the alpha layer. Be careful to use the semantic variable.
-    Hexadecimal colors are here only as an example on a white background.
-
-    Stylus: dividerColor - #E3E4E5, CSS: var(--dividerColor)
-
-    Styleguide Settings.theme.divider
-    */
-  --dividerColor: rgba(29,33,42,0.12);
-/*
-    Success colors
-
-    Stylus: successColorLight        -  #38C949, CSS: var(--successColorLight)
-    Stylus: successColor             -  #09AB1B, CSS: var(--successColor)
-    Stylus: successColorDark         -  #018711, CSS: var(--successColorDark)
-    Stylus: successColorContrastText -  #FFF, CSS: var(--successColorContrastText)
-
-    Styleguide Settings.theme.success
-    */
-  --successColorLight: #38c949;
-  --successColor: #09ab1b;
-  --successColorDark: #018711;
-  --successColorContrastText: #fff;
-/*
-    Warning colors
-
-    Stylus: warningColorLight        -  #EFA82F, CSS: var(--warningColorLight)
-    Stylus: warningColor             -  #CB8100, CSS: var(--warningColor)
-    Stylus: warningColorDark         -  #986100, CSS: var(--warningColorDark)
-    Stylus: warningColorContrastText -  #FFF, CSS: var(--warningColorContrastText)
-
-    Styleguide Settings.theme.warning
-    */
-  --warningColorLight: #efa82d;
-  --warningColor: #cb8100;
-  --warningColorDark: #986100;
-  --warningColorContrastText: #fff;
-/*
-    Error colors
-
-    Stylus: errorColorLightest     -  #FFECEC, CSS: var(--errorColorLightest)
-    Stylus: errorColorLight        -  #F96B6B, CSS: var(--errorColorLight)
-    Stylus: errorColor             -  #EA3F3F, CSS: var(--errorColor)
-    Stylus: errorColorDark         -  #D31F1F, CSS: var(--errorColorDark)
-    Stylus: errorBackground        -  #FFECEC, CSS: var(--errorBackground)
-    Stylus: errorColorContrastText -  #FFF, CSS: var(--errorColorContrastText)
-
-    Styleguide Settings.theme.error
-    */
-  --errorColorLightest: #ffecec;
-  --errorColorLight: #f96b6b;
-  --errorColor: #ea3f3f;
-  --errorColorDark: #d31f1f;
-  --errorBackground: #ffecec;
-  --errorColorContrastText: #fff;
-/*
-    Info colors
-
-    Stylus: infoColorLight        -  #0EC4C7, CSS: var(--infoColorLight)
-    Stylus: infoColor             -  #009FA2, CSS: var(--infoColor)
-    Stylus: infoColorDark         -  #007578, CSS: var(--infoColorDark)
-    Stylus: infoColorContrastText -  #FFF, CSS: var(--infoColorContrastText)
-
-    Styleguide Settings.theme.info
-    */
-  --infoColorLight: #0ec4c7;
-  --infoColor: #009fa2;
-  --infoColorDark: #007578;
-  --infoColorContrastText: #fff;
-/*
-    Shadow colors
-    */
-  --shadow0: none;
-  --shadow1: 0px 2px 4px 0px rgba(29,33,42,0.08), 0px 4px 16px 0px rgba(29,33,42,0.06), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow2: 0px 3px 5px 0px rgba(29,33,42,0.09), 0px 4px 17px 0px rgba(29,33,42,0.07), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow3: 0px 3px 5px -1px rgba(29,33,42,0.09), 0px 5px 19px 1px rgba(29,33,42,0.08), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow4: 0px 3px 6px -1px rgba(29,33,42,0.1), 0px 5px 20px 1px rgba(29,33,42,0.08), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow5: 0px 4px 6px -1px rgba(29,33,42,0.11), 0px 5px 22px 1px rgba(29,33,42,0.09), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow6: 0px 4px 7px -2px rgba(29,33,42,0.11), 0px 6px 23px 2px rgba(29,33,42,0.1), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow7: 0px 5px 7px -2px rgba(29,33,42,0.12), 0px 6px 24px 2px rgba(29,33,42,0.11), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow8: 0px 5px 8px -2px rgba(29,33,42,0.13), 0px 6px 26px 2px rgba(29,33,42,0.11), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow9: 0px 5px 8px -3px rgba(29,33,42,0.14), 0px 7px 27px 3px rgba(29,33,42,0.12), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow10: 0px 6px 9px -3px rgba(29,33,42,0.14), 0px 7px 29px 3px rgba(29,33,42,0.13), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow11: 0px 6px 9px -3px rgba(29,33,42,0.15), 0px 7px 30px 3px rgba(29,33,42,0.14), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow12: 0px 7px 10px -4px rgba(29,33,42,0.16), 0px 8px 31px 4px rgba(29,33,42,0.15), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow13: 0px 7px 10px -4px rgba(29,33,42,0.16), 0px 8px 33px 4px rgba(29,33,42,0.15), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow14: 0px 8px 11px -5px rgba(29,33,42,0.17), 0px 9px 34px 5px rgba(29,33,42,0.16), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow15: 0px 8px 11px -5px rgba(29,33,42,0.18), 0px 9px 35px 5px rgba(29,33,42,0.17), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow16: 0px 9px 12px -5px rgba(29,33,42,0.18), 0px 9px 37px 5px rgba(29,33,42,0.18), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow17: 0px 9px 12px -6px rgba(29,33,42,0.19), 0px 10px 38px 6px rgba(29,33,42,0.19), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow18: 0px 9px 13px -6px rgba(29,33,42,0.2), 0px 10px 40px 6px rgba(29,33,42,0.19), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow19: 0px 10px 13px -6px rgba(29,33,42,0.21), 0px 10px 41px 6px rgba(29,33,42,0.2), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow20: 0px 10px 14px -7px rgba(29,33,42,0.21), 0px 11px 42px 7px rgba(29,33,42,0.21), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow21: 0px 11px 14px -7px rgba(29,33,42,0.22), 0px 11px 44px 7px rgba(29,33,42,0.22), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow22: 0px 11px 15px -7px rgba(29,33,42,0.23), 0px 11px 45px 7px rgba(29,33,42,0.22), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow23: 0px 12px 15px -8px rgba(29,33,42,0.23), 0px 12px 47px 8px rgba(29,33,42,0.23), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow24: 0px 12px 16px -8px rgba(29,33,42,0.24), 0px 12px 48px 8px rgba(29,33,42,0.24), 0px 0px 0px 0.5px rgba(29,33,42,0.12);
-  --shadow25: 0px 1px 4px rgba(29,33,42,0.04);
-/*
-    ---------------------------------------------------------------------
-    */
-/*
-    The CSS variables below are historic and we should strive not to
-    use them. Prefer to use directly semantic colors above.
-    */
-  --spinnerColor: var(--primaryColor);
-  --linkColor: var(--primaryColor);
-  --linkTextDecoration: none;
-  --linkColorActive: var(--primaryColorDark);
-  --invertedTabsActiveTextColor: var(--primaryContrastTextColor);
-  --invertedTabsInactiveTextColor: var(--primaryContrastTextColor);
-  --invertedTabsIndicatorColor: var(--primaryContrastTextColor);
-  --invertedTabsBackgroundColor: var(--primaryColor);
-  --regularButtonPrimaryColor: var(--primaryColor);
-  --regularButtonSecondaryColor: var(--primaryColor);
-  --regularButtonActiveColor: var(--primaryColorDark);
-  --regularButtonConstrastColor: var(--primaryContrastTextColor);
-  --secondaryButtonPrimaryColor: #fff;
-  --secondaryButtonSecondaryColor: var(--silver);
-  --secondaryButtonActiveColor: var(--silver);
-  --secondaryButtonContrastColor: var(--black);
-  --dividerColor2: var(--coolGrey);
-  --iconColor: currentColor;
-  --textIconColor: var(--charcoalGrey);
-  --actionMenuIconColor: var(--slateGrey);
-  --neutralBackground: var(--paleGrey);
-  --buttonTextTransform: uppercase;
-  --buttonBorderRadius: 0.125rem;
-  --navTextColor: var(--slateGrey);
-  --navTextActiveColor: var(--slateGrey);
-  --navTextHoverColor: var(--charcoalGrey);
-  --alertErrorColor: #fff;
-  --alertErrorBackgroundColor: var(--errorColor);
-  --alertSuccessColor: #fff;
-  --alertSuccessBackgroundColor: var(--successColor);
-  --alertInfoColor: #fff;
-  --alertInfoBackgroundColor: var(--slateGrey);
-}
-html {
-  --zIndex-below: -1;
-  --zIndex-app: 0;
-  --zIndex-low: 1;
-  --zIndex-alertMobile: 10;
-  --zIndex-nav: 20;
-  --zIndex-bar: 31;
-  --zIndex-selection: 40;
-  --zIndex-popover: 30;
-  --zIndex-overlay: 50;
-  --zIndex-fileActionMenu: 60;
-  --zIndex-drawer: 60;
-  --zIndex-modal: 70;
-  --zIndex-modal-footer: 71;
-  --zIndex-modal-toolbar: 72;
-  --zIndex-alert: 80;
-}
-.autosuggest__container___1dbB4 {
+.autosuggest__container___1Yro7 {
   position: relative;
 }
-.autosuggest__suggestionsContainer___-PUXu {
+.autosuggest__suggestionsContainer___3EDuG {
   box-sizing: border-box;
   position: absolute;
   top: 100%;
   margin-top: 0.25rem;
-  z-index: 10;
+  z-index: var(--zIndex-alertMobile);
   width: 100%;
   overflow: hidden;
   box-shadow: 0px 0px 0px 0.5px rgba(29,33,42,0.12), 0px 2px 4px rgba(29,33,42,0.079), 0px 4px 16px rgba(29,33,42,0.06);
@@ -2865,23 +406,23 @@ html {
   background: var(--white);
   display: none;
 }
-.autosuggest__suggestionsContainerOpen___LO5cw {
+.autosuggest__suggestionsContainerOpen___35OCI {
   display: block;
 }
-.autosuggest__input___3b74d {
+.autosuggest__input___1Ea-3 {
   width: 100%;
 }
-.autosuggest__suggestionsList___211Pt {
+.autosuggest__suggestionsList___3uRpV {
   max-height: 9rem;
   overflow: auto;
   margin: 0 -1px 0 0;
   padding: 0.5rem 0;
   list-style: none;
 }
-.autosuggest__suggestionHighlighted___MbW8F {
+.autosuggest__suggestionHighlighted___1vpXJ {
   background: var(--actionColorSelected);
 }
-.autosuggest__recipientsContainer___15b1_ {
+.autosuggest__recipientsContainer___1JYxA {
   display: flex;
   flex-wrap: wrap;
   padding: 0.25rem 0.5rem;
@@ -2891,103 +432,141 @@ html {
   max-height: 6.75rem;
   overflow: auto;
 }
-.autosuggest__recipientsContainer___15b1_:hover {
+.autosuggest__recipientsContainer___1JYxA:hover {
   border: 1px solid var(--coolGrey);
 }
-.autosuggest__recipientsContainer___15b1_:focus-within {
+.autosuggest__recipientsContainer___1JYxA:focus-within {
   border: 1px solid var(--primaryColor);
 }
-.autosuggest__recipientsContainer___15b1_ input[type=email] {
+.autosuggest__recipientsContainer___1JYxA input[type=email] {
   width: auto;
   flex-grow: 1;
   padding: 0.5rem 0;
   margin: auto;
   border: none;
 }
-.autosuggest__recipientsContainer___15b1_ input[type=email]:hover,
-.autosuggest__recipientsContainer___15b1_ input[type=email]:focus {
+.autosuggest__recipientsContainer___1JYxA input[type=email]:hover,
+.autosuggest__recipientsContainer___1JYxA input[type=email]:focus {
   border: none;
 }
-.autosuggest__recipientsContainer___15b1_ input[type=email]:only-child {
+.autosuggest__recipientsContainer___1JYxA input[type=email]:only-child {
   padding: 0.25rem 0.5rem;
 }
-.autosuggest__recipientChip___oRxU- {
+.autosuggest__recipientChip___d5I3R {
   margin: 0.25rem 0.5rem 0.25rem 0;
 }
 /*  imported from button.styl  */
 
-.button__coz-btn-shared___2BoMk {
+.button__coz-btn-shared___9MFbY {
   border-color: #35ce68;
   background-color: #35ce68;
   color: var(--white);
   transition: all 0.2s ease-out;
 }
-.button__coz-btn-shared___2BoMk:focus,
-.button__coz-btn-shared___2BoMk:not([disabled]):not([aria-disabled=true]):hover {
+.button__coz-btn-shared___9MFbY:focus,
+.button__coz-btn-shared___9MFbY:not([disabled]):not([aria-disabled=true]):hover {
   border-color: #08b442;
   background-color: #08b442;
 }
-.button__coz-btn-sharedWithMe___2Vjfh {
+.button__coz-btn-sharedWithMe___25PBh {
   border-color: #b449e7;
   background-color: #b449e7;
   color: var(--white);
   transition: all 0.2s ease-out;
 }
-.button__coz-btn-sharedWithMe___2Vjfh:focus,
-.button__coz-btn-sharedWithMe___2Vjfh:not([disabled]):not([aria-disabled=true]):hover {
+.button__coz-btn-sharedWithMe___25PBh:focus,
+.button__coz-btn-sharedWithMe___25PBh:not([disabled]):not([aria-disabled=true]):hover {
   border-color: #922bc2;
   background-color: #922bc2;
 }
 /*  imported from badge.styl  */
 
-.badge__shared-badge___2QYc_ {
+.badge__shared-badge___2jGsy {
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   background-clip: padding-box;
 }
-.badge__shared-badge___2QYc_.badge__--small___3i2p8 {
+.badge__shared-badge___2jGsy.badge__--small___2VMyY {
   border: 0.125rem solid;
   border-color: var(--white);
   width: 1.5rem;
   height: 1.5rem;
 }
-.badge__shared-badge___2QYc_.badge__--small___3i2p8 .badge__shared-badge-icon___kngsy {
+.badge__shared-badge___2jGsy.badge__--small___2VMyY .badge__shared-badge-icon___3s9t1 {
   width: 0.75rem;
   height: 0.75rem;
 }
-.badge__shared-badge___2QYc_.badge__--xsmall___1SOfR {
+.badge__shared-badge___2jGsy.badge__--xsmall___2cEGG {
   border: 0.0625rem solid;
   border-color: var(--white);
   width: 0.75rem;
   height: 0.75rem;
 }
-.badge__shared-badge___2QYc_.badge__--xsmall___1SOfR .badge__shared-badge-icon___kngsy {
+.badge__shared-badge___2jGsy.badge__--xsmall___2cEGG .badge__shared-badge-icon___3s9t1 {
   width: 0.375rem;
   height: 0.375rem;
 }
-.badge__shared-badge___2QYc_.badge__--by-me___3zfDg {
+.badge__shared-badge___2jGsy.badge__--by-me___3aTHb {
   background-color: #35ce68;
 }
-.badge__shared-badge___2QYc_.badge__--with-me___30u7z {
+.badge__shared-badge___2jGsy.badge__--with-me___3jW7R {
   background-color: #9169f2;
 }
 /*  imported from status.styl  */
 
-.status__shared-status___J15Fy {
+.status__shared-status___2HpyL {
   display: flex;
 }
-.status__shared-status-label___2AWic {
+.status__shared-status-label___1-jvS {
   margin-right: 0.5rem;
 }
+/*  imported from publicBanner.styl  */
+
+.publicBanner__bannermarkdown___1dR1E img {
+  background-color: var(--paleGrey);
+  color: var(--silver);
+  position: relative;
+}
+.publicBanner__bannermarkdown___1dR1E img svg {
+  width: 50%;
+  height: 50%;
+}
+.publicBanner__bannermarkdown___1dR1E img {
+  --circleSize: 2.5rem;
+  width: var(--circleSize);
+  height: var(--circleSize);
+  min-width: var(--circleSize);
+  min-height: var(--circleSize);
+  font-size: calc(var(--circleSize) / 2.28);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  overflow: hidden;
+  background-color: var(--dodgerBlue);
+  color: var(--white);
+}
+.publicBanner__bannermarkdown___1dR1E {
+  font-weight: bold;
+  display: inline-block;
+}
+.publicBanner__bannermarkdown___1dR1E img {
+  width: 1rem;
+  height: 1rem;
+  min-width: 1rem;
+  min-height: 1rem;
+  font-size: 0.438rem;
+  vertical-align: text-bottom;
+}
 /*  imported from tooltip.styl  */
 
-.tooltip__shared-tooltip___33CoC {
+.tooltip__shared-tooltip___7Dys3 {
   padding: 0.5rem;
   font-weight: bold;
 }
-.tooltip__shared-tooltip-list___3gFkD {
+.tooltip__shared-tooltip-list___jD5hi {
   list-style: none;
   padding: 0;
   margin: 0;