@seams/wallet 0.6.2 → 0.7.3

package/dist/esm/sdk/wallet-ui.css

@@ -8,6 +8,27 @@ body {
   color-scheme: normal;
 }
 
+/* The hosted sign-in menu sits in the host page's flow, so the wheel must
+   reach that page. While a modal surface shares the document, elastic
+   overscroll stays off. */
+html:has(.seams-auth-menu-surface):not(
+    :has(
+      .seams-confirmation-surface,
+      .seams-export-surface,
+      [data-seams-wallet-recovery-backup-dialog]
+    )
+  ),
+html:has(.seams-auth-menu-surface):not(
+    :has(
+      .seams-confirmation-surface,
+      .seams-export-surface,
+      [data-seams-wallet-recovery-backup-dialog]
+    )
+  )
+  body {
+  overscroll-behavior: auto;
+}
+
 html.seams-transparent,
 body.seams-transparent {
   background: transparent !important;
@@ -401,11 +422,6 @@ body.seams-transparent {
 }
 
 /* Root container */
-:where(.seams-auth-menu-surface) .seams-no-animation {
-  animation: none !important;
-  transition: none !important;
-}
-
 :where(.seams-auth-menu-surface) .seams-signup-menu-root {
   /* CSS sentinel (used by tests/diagnostics to confirm stylesheet is applied) */
   --seams-auth-menu-css-ready: 1;
@@ -692,15 +708,6 @@ body.seams-transparent {
   gap: 0.25rem;
 }
 
-:where(.seams-auth-menu-surface) .seams-auth-method-note {
-  margin: 10px 0 0;
-  padding: 0 0.25rem;
-  color: var(--seams-colors-textSecondary);
-  font-size: 0.9rem;
-  line-height: 1.4;
-  text-align: center;
-}
-
 :where(.seams-auth-menu-surface) .seams-social-stack {
   margin-top: 0;
 }
@@ -711,10 +718,6 @@ body.seams-transparent {
   gap: 8px;
 }
 
-:where(.seams-auth-menu-surface) .seams-social-helper {
-  margin-top: 0;
-}
-
 :where(.seams-auth-menu-surface) .seams-auth-method-btn {
   position: relative;
   display: flex;
@@ -748,38 +751,6 @@ body.seams-transparent {
     min-height 300ms cubic-bezier(0.22, 1, 0.36, 1);
 }
 
-:where(.seams-auth-menu-surface) .seams-auth-method-badge {
-  --seams-auth-method-badge-background: var(
-    --seams-colors-lastUsedBadgeBackground,
-    var(--seams-colors-success)
-  );
-  --seams-auth-method-badge-text: var(--seams-colors-lastUsedBadgeText, var(--seams-colors-textButton));
-  --seams-auth-method-badge-border: var(
-    --seams-colors-lastUsedBadgeBorder,
-    var(--seams-colors-colorBackground)
-  );
-  position: absolute;
-  inset-block-start: -0.42rem;
-  inset-inline-end: 0.9rem;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0.18rem 0.5rem;
-  border: 1px solid var(--seams-auth-method-badge-border);
-  border-radius: 999px;
-  background: var(--seams-auth-method-badge-background);
-  color: var(--seams-auth-method-badge-text);
-  font-size: 0.62rem;
-  font-weight: 700;
-  line-height: 1;
-  letter-spacing: 0;
-  white-space: nowrap;
-  box-shadow:
-    0 0 0 1px color-mix(in srgb, var(--seams-colors-textPrimary), transparent 72%),
-    0 6px 14px -10px var(--seams-auth-method-badge-background);
-  pointer-events: none;
-}
-
 :where(.seams-auth-menu-surface) .seams-auth-method-btn:hover:not(:disabled),
 :where(.seams-auth-menu-surface) .seams-auth-method-btn:focus-visible {
   background: var(--seams-colors-surface2);
@@ -1075,72 +1046,6 @@ body.seams-transparent {
   box-shadow: 0 0 0 3px color-mix(in srgb, var(--seams-colors-primary), transparent 72%);
 }
 
-:where(.seams-auth-menu-surface) .seams-recovery-key-section {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-
-:where(.seams-auth-menu-surface) .seams-recovery-key-label-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 12px;
-}
-
-:where(.seams-auth-menu-surface) .seams-recovery-key-label-row .seams-field-label {
-  margin-bottom: 0;
-}
-
-:where(.seams-auth-menu-surface) .seams-recovery-key-input {
-  box-sizing: border-box;
-  width: 100%;
-  height: 48px;
-  padding: 0 12px;
-  border: 1px solid var(--seams-colors-borderPrimary);
-  border-radius: 8px;
-  background: color-mix(in srgb, var(--seams-colors-surface), transparent 6%);
-  color: var(--seams-colors-textPrimary);
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', monospace;
-  font-size: 13px;
-  font-weight: 700;
-  letter-spacing: 0;
-  line-height: 1;
-  outline: none;
-  text-transform: uppercase;
-}
-
-:where(.seams-auth-menu-surface) .seams-recovery-key-input::placeholder {
-  color: color-mix(in srgb, var(--seams-colors-textSecondary), transparent 20%);
-}
-
-:where(.seams-auth-menu-surface) .seams-recovery-key-input:focus {
-  border-color: var(--seams-colors-primary);
-  box-shadow: 0 0 0 3px color-mix(in srgb, var(--seams-colors-primary), transparent 72%);
-}
-
-:where(.seams-auth-menu-surface) .seams-recovery-key-input:disabled {
-  cursor: not-allowed;
-  opacity: 0.72;
-}
-
-:where(.seams-auth-menu-surface) .seams-recovery-key-scan {
-  border: 0;
-  background: transparent;
-  color: var(--seams-colors-primary);
-  cursor: pointer;
-  font: inherit;
-  font-size: 0.82rem;
-  font-weight: 700;
-  padding: 0 4px;
-  white-space: nowrap;
-}
-
-:where(.seams-auth-menu-surface) .seams-recovery-key-scan:disabled {
-  color: color-mix(in srgb, var(--seams-colors-textSecondary), transparent 20%);
-  cursor: not-allowed;
-}
-
 :where(.seams-auth-menu-surface) .seams-otp-resend {
   align-self: center;
   border: 0;
@@ -1221,7 +1126,6 @@ body.seams-transparent {
   /* prevent overflow clipping in flex layouts */
 }
 
-/* Absolute status message anchored to bottom-right of the input area */
 :where(.seams-auth-menu-surface) .seams-input::placeholder {
   /* Improve contrast for placeholders on dark */
   color: color-mix(in srgb, var(--seams-colors-textSecondary), var(--seams-colors-textPrimary) 35%);
@@ -1232,32 +1136,6 @@ body.seams-transparent {
   cursor: default;
 }
 
-:where(.seams-auth-menu-surface) .seams-postfix {
-  position: absolute;
-  top: 50%;
-  left: 0;
-  transform: translateY(-50%);
-  color: var(--seams-colors-textSecondary);
-  font-size: 16px;
-  max-width: 100%;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  pointer-events: none;
-  visibility: hidden;
-  /* React enables once measured */
-  transition: left 32ms var(--seams-ease-out, cubic-bezier(0.25, 1, 0.5, 1));
-}
-
-:where(.seams-auth-menu-surface) .seams-postfix.is-existing {
-  color: var(--seams-colors-success);
-}
-
-/* On focus, keep postfix subtle for readability */
-:where(.seams-auth-menu-surface) .seams-input:focus ~ .seams-postfix {
-  color: var(--seams-colors-textMuted);
-}
-
 :where(.seams-auth-menu-surface) .seams-account-menu {
   position: static;
   flex: 0 0 auto;
@@ -1333,6 +1211,7 @@ body.seams-transparent {
   width: calc(100% + 2px);
   max-height: 300px;
   overflow-y: auto;
+  overscroll-behavior-y: contain;
   padding: 10px;
   border: 1px solid color-mix(in srgb, var(--seams-colors-borderPrimary), transparent 8%);
   /* control radius + 2px, capped so the rounded preset stays list-friendly */
@@ -1395,6 +1274,22 @@ body.seams-transparent {
   color: var(--seams-colors-textPrimary);
 }
 
+/* A chosen account blinks once, highlight off then on, before the list closes
+   (blinkMenuItem). The selection has already committed, so "on" shows the
+   selected tint once the host re-renders. */
+:where(.seams-auth-menu-surface) .seams-account-menu-option[data-blink] {
+  transition: none;
+}
+
+:where(.seams-auth-menu-surface) .seams-account-menu-option[data-blink='off'] {
+  background: transparent;
+  outline: none;
+}
+
+:where(.seams-auth-menu-surface) .seams-account-menu-option[data-blink='on']:not(.is-selected) {
+  background: var(--seams-colors-surface2);
+}
+
 :where(.seams-auth-menu-surface) .seams-account-menu-check {
   position: relative;
   width: 16px;
@@ -1504,13 +1399,6 @@ body.seams-transparent {
   text-wrap: balance;
 }
 
-:where(.seams-auth-menu-surface) .seams-waiting-subtext {
-  font-size: 12px;
-  font-weight: 500;
-  line-height: 1.35;
-  color: color-mix(in srgb, var(--seams-colors-textSecondary), var(--seams-colors-textPrimary) 25%);
-}
-
 :where(.seams-auth-menu-surface) .seams-waiting-sdk-events {
   font-size: 11px;
   font-weight: 500;
@@ -1708,9 +1596,7 @@ body.seams-transparent {
 }
 
 /* Ensure QR code content stays within bounds */
-:where(.seams-auth-menu-surface) .seams-scan-device-content .qr-code-container,
-:where(.seams-auth-menu-surface) .seams-scan-device-content .qr-modal-backdrop,
-:where(.seams-auth-menu-surface) .seams-scan-device-content .qr-modal-content {
+:where(.seams-auth-menu-surface) .seams-scan-device-content .qr-code-container {
   max-width: 100%;
   max-height: 100%;
   overflow: hidden;
@@ -2095,22 +1981,6 @@ body.seams-transparent {
   }
 }
 
-/* Status message row */
-:where(.seams-auth-menu-surface) .seams-status-row {
-  position: absolute;
-  font-size: 0.75rem;
-  bottom: -10px;
-  right: 0;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-}
-
-:where(.seams-auth-menu-surface) .seams-status-message {
-  font-size: 11px;
-  font-weight: 500;
-}
-
 /* Section divider */
 :where(.seams-auth-menu-surface) .seams-section-divider {
   display: flex;
@@ -2145,41 +2015,6 @@ body.seams-transparent {
   font-weight: 700;
 }
 
-/* Tooltip for account existence status */
-:where(.seams-auth-menu-surface) .seams-input-wrap .seams-tooltip {
-  position: absolute;
-  right: 0;
-  padding: 4px 8px;
-  border-radius: var(--seams-shape-item, 8px);
-  font-size: 0.7rem;
-  background: var(--seams-colors-surface2);
-  color: var(--seams-colors-textPrimary);
-  opacity: 0;
-  transform: translateX(50px) scale(0.9);
-  pointer-events: none;
-  transition:
-    opacity 180ms ease,
-    transform 200ms ease;
-  z-index: 2;
-}
-
-:where(.seams-auth-menu-surface) .seams-input-wrap .seams-tooltip.is-visible {
-  opacity: 0.8;
-  transform: translateX(0px) scale(1);
-}
-
-:where(.seams-auth-menu-surface) .seams-input-wrap .seams-tooltip.is-error {
-  color: var(--seams-colors-error);
-  background: var(--seams-colors-colorBackground);
-  /* background: color-mix(in srgb, var(--seams-colors-error), transparent 90%); */
-}
-
-:where(.seams-auth-menu-surface) .seams-input-wrap .seams-tooltip.is-success {
-  color: var(--seams-colors-blue400);
-  background: var(--seams-colors-colorBackground);
-  /* background: color-mix(in srgb, var(--seams-colors-blue400), transparent 90%); */
-}
-
 @keyframes seams-spin {
   from {
     transform: rotate(0deg);
@@ -2190,43 +2025,6 @@ body.seams-transparent {
   }
 }
 
-@keyframes seams-ellipsis-dot {
-  0%,
-  80%,
-  100% {
-    opacity: 0;
-  }
-
-  40% {
-    opacity: 1;
-  }
-}
-
-:where(.seams-auth-menu-surface) .seams-ellipsis {
-  display: inline-block;
-}
-
-:where(.seams-auth-menu-surface) .seams-ellipsis-dot {
-  display: inline-block;
-  opacity: 0;
-  animation: seams-ellipsis-dot 1.2s infinite;
-}
-
-:where(.seams-auth-menu-surface) .seams-ellipsis-dot:nth-child(2) {
-  animation-delay: 0.15s;
-}
-
-:where(.seams-auth-menu-surface) .seams-ellipsis-dot:nth-child(3) {
-  animation-delay: 0.3s;
-}
-
-@media (prefers-reduced-motion: reduce) {
-  :where(.seams-auth-menu-surface) .seams-ellipsis-dot {
-    animation: none;
-    opacity: 1;
-  }
-}
-
 /* Button System */
 :where(.seams-auth-menu-surface) .seams-scan-device-row {
   padding-bottom: 1px;
@@ -2337,8 +2135,7 @@ body.seams-transparent {
   text-align: center;
 }
 
-:where(.seams-auth-menu-surface) .seams-auth-intent-switch button,
-:where(.seams-auth-menu-surface) .seams-auth-intent-switch-action {
+:where(.seams-auth-menu-surface) .seams-auth-intent-switch button {
   appearance: none;
   padding: 0;
   border: 0;
@@ -3634,13 +3431,6 @@ body.seams-transparent {
   -webkit-text-size-adjust: 100%;
 }
 
-:where(.seams-wallet-ui) .seams-tx-tree .tooltip-tree-root.scrollable-root {
-  overflow: auto;
-  overscroll-behavior: none;
-  max-height: 40vh;
-  max-height: 40dvh;
-}
-
 @media (prefers-reduced-motion: reduce) {
   :where(.seams-wallet-ui) .seams-tx-tree .tooltip-tree-root {
     transition: none;
@@ -3736,11 +3526,6 @@ body.seams-transparent {
   margin: 0rem 0rem 0rem 0.25rem;
 }
 
-:where(.seams-wallet-ui) .seams-tx-tree .label.gradient-text {
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-}
-
 @supports (background: color-mix(in oklch, black 50%, white 50%)) {
   :where(.seams-wallet-ui) .seams-tx-tree {
     --seams-tree__label-hover__resolved-background: color-mix(
@@ -3971,12 +3756,6 @@ body.seams-transparent {
   resize: none;
 }
 
-:where(.seams-wallet-ui[data-seams-confirm-surface='wallet-iframe'])
-  .seams-tx-tree
-  .tooltip-tree-root.scrollable-root {
-  max-height: 20rem;
-}
-
 :where(.seams-wallet-ui) .seams-tx-tree .file-content-shell {
   position: relative;
   width: 100%;
@@ -4159,6 +3938,7 @@ html:has([data-seams-confirm-surface='wallet-iframe'][data-seams-confirm-variant
   gap: 0.5rem;
   inline-size: 100%;
   position: relative;
+  outline: none;
   border: 1px solid var(--seams-colors-borderPrimary);
   border-radius: min(var(--seams-shape-card, 16px), 2rem);
   margin: 0;
@@ -4336,45 +4116,6 @@ html:has([data-seams-confirm-surface='wallet-iframe'][data-seams-confirm-variant
   inline-size: 100%;
   padding: 0;
 }
-:where(.seams-wallet-ui)
-  .seams-confirmation-drawer
-  .seams-confirmation-content--drawer
-  .responsive-card {
-  position: relative;
-  inline-size: 100%;
-  max-inline-size: 100%;
-  min-inline-size: 0;
-  margin: 4px 0;
-  padding: 0;
-  border-radius: 1rem;
-}
-:where(.seams-wallet-ui)
-  .seams-confirmation-drawer
-  .seams-confirmation-content--drawer
-  .responsive-card-center {
-  display: block;
-}
-:where(.seams-wallet-ui)
-  .seams-confirmation-drawer
-  .seams-confirmation-content--drawer
-  .drawer-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  flex-wrap: wrap;
-  row-gap: 0.5em;
-  margin: 0.25rem 0;
-  padding-left: 0.5rem;
-}
-:where(.seams-wallet-ui)
-  .seams-confirmation-drawer
-  .seams-confirmation-content--drawer
-  .drawer-title {
-  margin: 0;
-  font-size: var(--seams-font-size-lg, 1.125rem);
-  line-height: 1.3;
-  font-weight: 600;
-}
 :where(.seams-wallet-ui)
   .seams-confirmation-drawer
   .seams-confirmation-content--drawer
@@ -4849,49 +4590,9 @@ html:has([data-seams-confirm-surface='wallet-iframe'][data-seams-confirm-variant
   flex: 1;
   max-width: none;
 }
-:where(.seams-wallet-ui) .seams-review-address {
-  display: block;
-  font:
-    0.75rem/1.5 ui-monospace,
-    SFMono-Regular,
-    monospace;
-  min-width: 0;
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  text-align: start;
-}
-:where(.seams-wallet-ui) .seams-review-address[data-overflowing='true'] {
-  mask-image: linear-gradient(to right, black calc(100% - 6px), transparent);
-}
-:where(.seams-wallet-ui) .seams-review-address > span {
-  display: block;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-:where(.seams-wallet-ui) .seams-review-address[data-revealing] > span {
-  width: max-content;
-  overflow: visible;
-  text-overflow: clip;
-}
-:where(.seams-wallet-ui) .seams-review-address[data-revealing] {
-  text-overflow: clip;
-  mask-image: linear-gradient(
-    to right,
-    transparent,
-    black 8px,
-    black calc(100% - 8px),
-    transparent
-  );
-}
-:where(.seams-wallet-ui) .seams-review-address[data-reveal-end] {
-  mask-image: linear-gradient(to right, transparent, black 8px);
-}
-:where(.seams-wallet-ui) .seams-review-address:focus-visible {
-  outline: 2px solid var(--seams-colors-focus);
-  outline-offset: 2px;
-  mask-image: none;
+:where(.seams-wallet-ui) .seams-review-fields dd:has(> .seams-review-hash) {
+  flex: 1;
+  max-width: none;
 }
 :where(.seams-wallet-ui) .seams-review-copy,
 :where(.seams-wallet-ui) .seams-review-toolbar button {
@@ -5004,6 +4705,58 @@ html:has([data-seams-confirm-surface='wallet-iframe'][data-seams-confirm-variant
 :where(.seams-wallet-ui) .seams-review-function {
   color: var(--seams-colors-buttonBackground);
 }
+:where(.seams-wallet-ui) .seams-review-detail-label > span {
+  flex: 1;
+  min-width: 0;
+}
+:where(.seams-wallet-ui) .seams-review-contract {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  column-gap: 0.375rem;
+}
+/* A zero basis keeps the address beside the label until even its shortest form does not fit. */
+:where(.seams-wallet-ui) .seams-review-contract-value {
+  display: flex;
+  flex: 1 1 0;
+  align-items: center;
+  gap: 0.25rem;
+}
+:where(.seams-wallet-ui) .seams-review-middle {
+  display: flex;
+  min-width: 0;
+  font:
+    0.75rem/1.5 ui-monospace,
+    SFMono-Regular,
+    monospace;
+  white-space: nowrap;
+}
+:where(.seams-wallet-ui) .seams-review-middle > span:first-child {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+:where(.seams-wallet-ui) .seams-review-middle > span:last-child {
+  flex: none;
+}
+:where(.seams-wallet-ui) .seams-review-contract-address {
+  flex: 1 1 0;
+  /* Containment makes this min-width, not the full address, the value's narrowest size. */
+  contain: inline-size;
+  /* Eight leading characters, the ellipsis and eight trailing characters. */
+  min-width: 17ch;
+  color: var(--seams-colors-textSecondary);
+}
+:where(.seams-wallet-ui) .seams-review-contract-value > .seams-review-copy {
+  margin-block: -0.25rem;
+}
+@media (hover: hover) {
+  :where(.seams-wallet-ui)
+    .seams-review-contract:not(:hover, :focus-within)
+    .seams-review-copy:not(.copied)
+    > .copy-icon {
+    opacity: 0;
+  }
+}
 :where(.seams-wallet-ui) .seams-review-detail-row {
   display: grid;
   grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto;
@@ -5125,11 +4878,26 @@ html:has([data-seams-confirm-surface='wallet-iframe'][data-seams-confirm-variant
   justify-content: center;
   gap: 0.25rem;
   width: fit-content;
-  margin: 0.75rem auto;
+  margin: 0.75rem auto 0;
   color: var(--seams-colors-textSecondary);
   font-size: 0.75rem;
   text-decoration: none;
 }
+/* Holds the link's margin, so the row's height is all the room it takes
+   whether or not it is clipped while it opens. */
+:where(.seams-wallet-ui) .seams-receipt-explorer-row {
+  display: flow-root;
+}
+:where(.seams-wallet-ui) .seams-receipt-explorer-row[data-opening] {
+  overflow: hidden;
+}
+:where(.seams-wallet-ui) .seams-receipt-explorer-row[data-opening] .seams-receipt-explorer {
+  opacity: 0;
+}
+/* Held at the height the wallet-iframe parent has made room for. */
+:where(.seams-wallet-ui) .seams-receipt-explorer-row.seams-receipt-explorer-driven {
+  height: var(--seams-receipt-explorer-height);
+}
 :where(.seams-wallet-ui) .seams-receipt-explorer:is(:hover, :focus-visible) {
   color: var(--seams-colors-buttonBackground);
   text-decoration: underline;
@@ -5189,6 +4957,9 @@ html:has([data-seams-confirm-surface='wallet-iframe'][data-seams-confirm-variant
   gap: 0.75rem;
   padding: 0.625rem 0.75rem;
 }
+:where(.seams-wallet-ui) .seams-transaction-toast > .seams-receipt-symbol {
+  border-radius: min(var(--seams-shape-control, 10px), 8px);
+}
 :where(.seams-wallet-ui) .seams-toast-progress {
   position: absolute;
   inset: 0;
@@ -5271,7 +5042,7 @@ html:has([data-seams-confirm-surface='wallet-iframe'][data-seams-confirm-variant
 :where(.seams-wallet-ui[data-receipt-view='toast'])
   .seams-confirmation-modal
   .modal-container-root {
-  border-radius: min(var(--seams-shape-card, 16px), 16px);
+  border-radius: min(var(--seams-shape-card, 16px), 12px);
 }
 :where(.seams-wallet-ui) .seams-review-eyebrow {
   margin: 1rem 0 0.375rem;
@@ -5432,7 +5203,20 @@ html:has([data-seams-confirm-surface='wallet-iframe'][data-seams-confirm-variant
 :where(.seams-wallet-ui) .seams-drawer-controls:has(.seams-drawer-origin) .seams-drawer-close {
   top: 0.5rem;
 }
+:where(.seams-wallet-ui) .seams-transaction-receipt > .seams-review-technical .seams-review-fields dd {
+  position: relative;
+}
+/* The copy button overlays the value's end so the value itself reaches the row's edge. */
+:where(.seams-wallet-ui) .seams-transaction-receipt > .seams-review-technical .seams-review-fields dd .seams-review-copy:not(.seams-review-copy-address) {
+  position: absolute;
+  inset-inline-end: 0;
+  inset-block-start: 50%;
+  translate: 0 -50%;
+}
 :where(.seams-wallet-ui) .seams-transaction-receipt > .seams-review-technical .seams-review-fields dd .seams-review-copy:not(.seams-review-copy-address) > .copy-icon {
+  border-radius: 6px;
+  background: var(--seams-colors-surface2);
+  box-shadow: 0 0 6px 3px var(--seams-colors-surface2);
   opacity: 0;
 }
 :where(.seams-wallet-ui) .seams-transaction-receipt > .seams-review-technical .seams-review-fields dd:is(:hover, :focus-within) .seams-review-copy:not(.seams-review-copy-address) > .copy-icon,