fix: restore translucent dashboard styling (#6664)

* fix: restore translucent dashboard styling

* fix: restore dashboard widget transparency

* fix: address dashboard review feedback

* fix: apply board opacity to containers

* fix: flatten demo board container

* fix: default board roundness to sm

* fix: restore assistant widget transparency

* Revert "fix: default board roundness to sm"

This reverts commit c235cbdf2b.

* fix: address remaining dashboard review comments

* test: align grid geometry expectations

packages/widgets/src/bookmarks/bookmark.module.css

@@ -1,5 +1,15 @@
-.card:hover {
-  background-color: var(--mantine-color-primaryColor-light-hover);
+.card {
+  background-color: transparent;
+  border-color: rgb(from var(--mantine-color-secondaryColor-filled) r g b / calc(var(--opacity, 1) * 0.38));
+  transition:
+    background-color 120ms ease,
+    border-color 120ms ease;
+}
+
+.card:hover,
+.card:focus-within {
+  background-color: transparent;
+  border-color: rgb(from var(--mantine-color-secondaryColor-filled) r g b / calc(var(--opacity, 1) * 0.62));
 }
 
 .bookmarkButton:focus-visible {
@@ -8,14 +18,6 @@
   border-radius: var(--mantine-radius-sm);
 }
 
-[data-mantine-color-scheme="light"] .card-grid {
-  background-color: var(--mantine-color-gray-1);
-}
-
-[data-mantine-color-scheme="dark"] .card-grid {
-  background-color: var(--mantine-color-dark-7);
-}
-
 .card:hover > div > div.bookmarkIcon {
   background-color: var(--mantine-color-iconColor-filled-hover);
 }
@@ -24,6 +26,12 @@
   background-color: var(--mantine-color-iconColor-filled-hover);
 }
 
+@media (prefers-reduced-motion: reduce) {
+  .card {
+    transition: none;
+  }
+}
+
 .compactScrollViewport > div {
   display: flex !important;
   width: 100%;