opus-react 0.3.0 → 0.3.2

package/dist/index.css

@@ -2179,7 +2179,7 @@
   color: var(--opus-text);
   font-size: var(--opus-control-font-size);
   cursor: text;
-  grid-template-columns: auto minmax(0, 1fr);
+  grid-template-columns: auto minmax(0, 1fr) auto;
   transition: border-color .16s, box-shadow .16s;
   display: grid;
   box-shadow: inset 0 1px #ffffff0d, 0 14px 30px #0000000f;
@@ -2195,6 +2195,15 @@
   border-color: color-mix(in srgb, var(--opus-error) 75%, transparent);
 }
 
+.opus_1Q5xBh_endAdornment {
+  min-width: 0;
+  color: var(--opus-muted);
+  justify-content: center;
+  align-items: center;
+  line-height: 1;
+  display: inline-flex;
+}
+
 .opus_1Q5xBh_prefixIcon {
   width: var(--opus-control-prefix-size, 14px);
   height: var(--opus-control-prefix-size, 14px);
@@ -2426,6 +2435,9 @@
   min-height: var(--opus-control-height);
   border: 1px solid var(--opus-border-strong);
   background: color-mix(in srgb, var(--opus-input-bg) 88%, transparent);
+  color: inherit;
+  cursor: pointer;
+  font: inherit;
   border-radius: 999px;
   padding: 2px;
   transition: background .22s, border-color .22s, box-shadow .22s;
@@ -2434,6 +2446,11 @@
   box-shadow: inset 0 1px #ffffff0d, 0 8px 20px #0000000f;
 }
 
+.opus_SwerMA_toggle:focus-visible {
+  outline: 2px solid var(--opus-accent);
+  outline-offset: 2px;
+}
+
 .opus_SwerMA_indicator {
   z-index: 0;
   width: var(--theme-option-size);
@@ -2459,7 +2476,6 @@
   width: var(--theme-option-size);
   height: calc(var(--opus-control-height) - 4px);
   color: var(--opus-muted);
-  cursor: pointer;
   background: none;
   border: 0;
   border-radius: 999px;
@@ -9452,7 +9468,7 @@
 /* components/ResizeHandle/ResizeHandle.module.css */
 .opus_PaKREB_handle {
   z-index: 1;
-  background: color-mix(in srgb, var(--opus-border) 62%, transparent);
+  background: color-mix(in srgb, var(--opus-accent) 8%, transparent);
   touch-action: none;
   border: 0;
   flex: 0 0 8px;
@@ -9477,7 +9493,7 @@
 }
 
 .opus_PaKREB_handle[data-background="accent"] {
-  background: color-mix(in srgb, var(--opus-accent) 14%, transparent);
+  background: color-mix(in srgb, var(--opus-accent) 8%, transparent);
 }
 
 .opus_PaKREB_handle[data-background="contrast"] {
@@ -9485,7 +9501,7 @@
 }
 
 .opus_PaKREB_handle:hover, .opus_PaKREB_handle:focus-visible {
-  background: color-mix(in srgb, var(--opus-border) 72%, transparent);
+  background: color-mix(in srgb, var(--opus-accent) 22%, transparent);
 }
 
 .opus_PaKREB_handle[data-background="none"]:hover, .opus_PaKREB_handle[data-background="none"]:focus-visible {
@@ -9494,7 +9510,7 @@
 
 .opus_PaKREB_handle:after {
   content: "";
-  background: color-mix(in srgb, var(--opus-muted) 45%, transparent);
+  background: color-mix(in srgb, var(--opus-accent) 32%, transparent);
   border-radius: 999px;
   transition: background .16s, inset .16s;
   position: absolute;
@@ -9549,8 +9565,10 @@
 
 .opus_PaKREB_grip {
   z-index: 1;
-  border: 1px solid color-mix(in srgb, var(--opus-muted) 52%, var(--opus-panel));
-  background-color: color-mix(in srgb, var(--opus-muted) 42%, var(--opus-panel));
+  border: 1px solid color-mix(in srgb, var(--opus-accent) 52%, #070912);
+  background-color: color-mix(in srgb, var(--opus-accent) 52%, #070912);
+  box-shadow: 0 1px 3px #00000047,
+    0 0 4px color-mix(in srgb, var(--opus-accent) 7%, transparent);
   pointer-events: none;
   border-radius: 999px;
   justify-content: center;
@@ -9562,23 +9580,22 @@
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
-  box-shadow: 0 1px 3px #00000047, inset 0 1px #ffffff1f;
 }
 
 .opus_PaKREB_handle[data-orientation="vertical"] .opus_PaKREB_grip {
   flex-direction: column;
-  width: 12px;
-  height: 30px;
+  width: 10px;
+  height: 26px;
 }
 
 .opus_PaKREB_handle[data-orientation="horizontal"] .opus_PaKREB_grip {
   flex-direction: row;
-  width: 30px;
-  height: 12px;
+  width: 26px;
+  height: 10px;
 }
 
 .opus_PaKREB_dot {
-  background: light-dark(#fff, #070912);
+  background: #070912;
   border-radius: 50%;
   flex: 0 0 4px;
   width: 4px;
@@ -9586,8 +9603,8 @@
 }
 
 .opus_PaKREB_handle:hover .opus_PaKREB_grip, .opus_PaKREB_handle:focus-visible .opus_PaKREB_grip {
-  border-color: color-mix(in srgb, var(--opus-accent) 68%, var(--opus-border));
-  background-color: color-mix(in srgb, var(--opus-accent) 68%, var(--opus-panel));
+  border-color: var(--opus-accent);
+  background-color: var(--opus-accent);
   box-shadow: 0 1px 4px #00000052,
     0 0 5px color-mix(in srgb, var(--opus-accent) 14%, transparent);
 }
@@ -10756,7 +10773,7 @@
   word-break: normal;
   flex: auto;
   justify-content: center;
-  align-items: flex-start;
+  align-items: center;
   margin: 0;
   padding: 0 2px;
   font-size: .8rem;
@@ -10766,10 +10783,19 @@
 }
 
 /* components/Tiles/Tiles.module.css */
+.opus_zD82gC_viewport {
+  width: 100%;
+  min-width: 0;
+  position: relative;
+}
+
 .opus_zD82gC_row {
-  --tile-size: 96px;
+  --tile-width: 106px;
+  --tile-height: 101px;
   grid-auto-flow: column;
-  grid-auto-columns: var(--tile-size);
+  grid-auto-columns: var(--tile-width);
+  scroll-behavior: smooth;
+  scroll-snap-type: x mandatory;
   background: none;
   border: 0;
   justify-content: start;
@@ -10783,28 +10809,81 @@
   overflow-x: auto;
 }
 
+.opus_zD82gC_moreButton {
+  z-index: 2;
+  width: 24px;
+  height: 76px;
+  color: color-mix(in srgb, var(--accent-color, #9b72ff) 72%, white);
+  cursor: pointer;
+  background: color-mix(in srgb, var(--surface-raised, #11182a) 84%, var(--accent-color, #9b72ff) 16%);
+  border: 1px solid color-mix(in srgb, var(--accent-color, #9b72ff) 42%, transparent);
+  backdrop-filter: blur(8px);
+  place-items: center;
+  padding: 0;
+  font-size: 14px;
+  transition: color .16s, background-color .16s, border-color .16s, box-shadow .16s;
+  display: grid;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.opus_zD82gC_moreButton svg {
+  width: 9px;
+  height: 14px;
+  filter: drop-shadow(0 0 3px color-mix(in srgb, var(--accent-color, #9b72ff) 72%, transparent));
+  transition: filter .16s;
+}
+
+.opus_zD82gC_previousButton {
+  box-shadow: 10px 0 24px color-mix(in srgb, var(--surface-base, #080b18) 80%, transparent);
+  border-left: 0;
+  border-radius: 0 18px 18px 0;
+  left: 0;
+}
+
+.opus_zD82gC_nextButton {
+  box-shadow: -10px 0 24px color-mix(in srgb, var(--surface-base, #080b18) 80%, transparent);
+  border-right: 0;
+  border-radius: 18px 0 0 18px;
+  right: 0;
+}
+
+.opus_zD82gC_moreButton:hover, .opus_zD82gC_moreButton:focus-visible {
+  color: var(--surface-base, #080b18);
+  background: var(--accent-color, #9b72ff);
+  outline: none;
+}
+
+.opus_zD82gC_moreButton:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-color, #9b72ff) 35%, transparent);
+}
+
 .opus_zD82gC_row[data-layout="fill"] {
   grid-auto-columns: unset;
   justify-content: stretch;
 }
 
 .opus_zD82gC_tile {
-  width: var(--tile-size);
-  height: var(--tile-size);
+  width: var(--tile-width);
+  height: var(--tile-height);
 }
 
 .opus_zD82gC_tileItem {
+  scroll-snap-align: start;
+  scroll-snap-stop: normal;
   min-width: 0;
 }
 
 .opus_zD82gC_row[data-layout="fill"] .opus_zD82gC_tile {
   width: 100%;
-  height: var(--tile-size);
+  height: var(--tile-height);
 }
 
 @media (width <= 900px) {
   .opus_zD82gC_row {
-    --tile-size: 92px;
+    --tile-width: 102px;
+    --tile-height: 97px;
   }
 }
 
@@ -10943,6 +11022,18 @@
   color: #ef4444;
 }
 
+.opus_8DpwUV_trend[data-trend-tone="positive"] {
+  color: #22c55e;
+}
+
+.opus_8DpwUV_trend[data-trend-tone="negative"] {
+  color: #ef4444;
+}
+
+.opus_8DpwUV_trend[data-trend-tone="warning"] {
+  color: #f59e0b;
+}
+
 .opus_8DpwUV_comparison {
   color: var(--tile-muted);
   margin: 0;
@@ -10992,24 +11083,86 @@
 }
 
 /* components/StatTiles/StatTiles.module.css */
+.opus_uhJd8v_viewport {
+  width: calc(100% + var(--stat-tiles-edge-offset, 0px) + var(--stat-tiles-edge-offset, 0px));
+  min-width: 0;
+  margin-inline-start: calc(0px - var(--stat-tiles-edge-offset, 0px));
+  position: relative;
+}
+
 .opus_uhJd8v_row {
   --stat-tile-size: 12.75rem;
+  --stat-tile-min: 9rem;
   --stat-tile-height: 6.75rem;
   grid-auto-flow: column;
   grid-auto-columns: var(--stat-tile-size);
+  scroll-behavior: smooth;
+  width: 100%;
+  min-width: 0;
+  scroll-padding-inline: var(--stat-tiles-edge-offset, 0px);
+  scroll-snap-type: x mandatory;
+  padding: 0 var(--stat-tiles-edge-offset, 0px);
+  box-sizing: border-box;
   background: none;
   border: 0;
   justify-content: start;
   align-items: start;
   gap: 12px;
-  width: 100%;
-  min-width: 0;
-  padding: 0;
   display: grid;
   position: relative;
   overflow-x: auto;
 }
 
+.opus_uhJd8v_moreButton {
+  z-index: 2;
+  width: 24px;
+  height: 76px;
+  color: color-mix(in srgb, var(--accent-color, #9b72ff) 72%, white);
+  cursor: pointer;
+  background: color-mix(in srgb, var(--surface-raised, #11182a) 84%, var(--accent-color, #9b72ff) 16%);
+  border: 1px solid color-mix(in srgb, var(--accent-color, #9b72ff) 42%, transparent);
+  backdrop-filter: blur(8px);
+  place-items: center;
+  padding: 0;
+  font-size: 14px;
+  transition: color .16s, background-color .16s, border-color .16s, box-shadow .16s;
+  display: grid;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.opus_uhJd8v_moreButton svg {
+  width: 9px;
+  height: 14px;
+  filter: drop-shadow(0 0 3px color-mix(in srgb, var(--accent-color, #9b72ff) 72%, transparent));
+  transition: filter .16s;
+}
+
+.opus_uhJd8v_moreButton:hover, .opus_uhJd8v_moreButton:focus-visible {
+  color: var(--surface-base, #080b18);
+  background: var(--accent-color, #9b72ff);
+  outline: none;
+}
+
+.opus_uhJd8v_moreButton:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-color, #9b72ff) 35%, transparent);
+}
+
+.opus_uhJd8v_previousButton {
+  box-shadow: 10px 0 24px color-mix(in srgb, var(--surface-base, #080b18) 80%, transparent);
+  border-left: 0;
+  border-radius: 0 18px 18px 0;
+  left: 0;
+}
+
+.opus_uhJd8v_nextButton {
+  box-shadow: -10px 0 24px color-mix(in srgb, var(--surface-base, #080b18) 80%, transparent);
+  border-right: 0;
+  border-radius: 18px 0 0 18px;
+  right: 0;
+}
+
 .opus_uhJd8v_row[data-layout="fill"] {
   grid-auto-columns: unset;
   justify-content: stretch;
@@ -11020,6 +11173,8 @@
 }
 
 .opus_uhJd8v_statTileItem {
+  scroll-snap-align: start;
+  scroll-snap-stop: normal;
   min-width: 0;
 }
 
@@ -12434,6 +12589,44 @@
   grid-area: opus_ThZ-Bi_composer;
 }
 
+.opus_ThZ-Bi_root[data-active-tab="notes"] .opus_ThZ-Bi_composer, .opus_ThZ-Bi_root[data-active-tab="notes"] .opus_ThZ-Bi_feed, .opus_ThZ-Bi_root[data-active-tab="notes"] .opus_ThZ-Bi_footer {
+  animation: .18s ease-out both opus_ThZ-Bi_notesActivityEnterFromLeft;
+}
+
+.opus_ThZ-Bi_root[data-active-tab="activity"] .opus_ThZ-Bi_feed, .opus_ThZ-Bi_root[data-active-tab="activity"] .opus_ThZ-Bi_footer {
+  animation: .18s ease-out both opus_ThZ-Bi_notesActivityEnterFromRight;
+}
+
+@keyframes opus_ThZ-Bi_notesActivityEnterFromLeft {
+  from {
+    opacity: 0;
+    transform: translateX(-6px);
+  }
+
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+@keyframes opus_ThZ-Bi_notesActivityEnterFromRight {
+  from {
+    opacity: 0;
+    transform: translateX(6px);
+  }
+
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .opus_ThZ-Bi_root[data-active-tab] .opus_ThZ-Bi_composer, .opus_ThZ-Bi_root[data-active-tab] .opus_ThZ-Bi_feed, .opus_ThZ-Bi_root[data-active-tab] .opus_ThZ-Bi_footer {
+    animation: none;
+  }
+}
+
 .opus_ThZ-Bi_threadItems {
   --thread-child-avatar-size: var(--notes-activity-avatar-size);
   --thread-indent: .325rem;
@@ -15940,6 +16133,436 @@ button.opus_H9TUGj_root:hover, button.opus_H9TUGj_root:focus-visible {
   font-size: .68rem;
 }
 
+/* components/ApplicationHeader/ApplicationHeader.module.css */
+.opus_TjZbi8_root {
+  --application-header-bg: var(--dashboard-section-bg, #070d18);
+  --application-header-border: var(--dashboard-section-border, #60a5fa33);
+  border: 1px solid var(--application-header-border);
+  background: radial-gradient(110% 180% at 0 0, #6d28d97a, #0000 58%), radial-gradient(90% 140% at 22% 20%, #312e8142, #0000 62%), linear-gradient(#070c1a 0%, #06101d 100%);
+  border-radius: 24px 24px 0 0;
+  grid-template-columns: 242px minmax(0, 1fr);
+  align-items: center;
+  gap: 0;
+  width: 100%;
+  min-width: 0;
+  min-height: 72px;
+  padding: 0;
+  display: grid;
+  box-shadow: inset 0 1px #ffffff0f, 0 12px 28px #020617ad;
+  container-type: inline-size;
+}
+
+.opus_TjZbi8_root[data-connected="true"] {
+  border-bottom-color: var(--application-header-border);
+  border-radius: 14px;
+  min-height: 82px;
+}
+
+.opus_TjZbi8_brand {
+  border-radius: 8px;
+  align-items: center;
+  width: 100%;
+  max-width: none;
+  height: 100%;
+  padding: 6px 18px;
+  display: inline-flex;
+}
+
+.opus_TjZbi8_brand:focus-visible {
+  outline: 2px solid var(--opus-accent);
+  outline-offset: 4px;
+}
+
+.opus_TjZbi8_logo {
+  object-fit: contain;
+  object-position: center;
+  width: 178px;
+  max-width: 100%;
+  height: 58px;
+  display: block;
+}
+
+.opus_TjZbi8_search {
+  --opus-control-height: 40px;
+  --opus-control-font-size: .88rem;
+  min-width: 0;
+}
+
+.opus_TjZbi8_actions {
+  justify-content: flex-end;
+  align-items: center;
+  gap: 8px;
+  min-width: 0;
+  display: flex;
+}
+
+.opus_TjZbi8_actionGroup {
+  align-items: center;
+  gap: 8px;
+  display: inline-flex;
+}
+
+.opus_TjZbi8_actions > [role="separator"] {
+  background: color-mix(in srgb, var(--opus-muted) 38%, transparent);
+  flex: 0 0 1px;
+  align-self: center;
+  min-height: 30px;
+}
+
+.opus_TjZbi8_createButton {
+  border: 1px solid color-mix(in srgb, var(--opus-accent) 34%, var(--opus-border));
+  background: color-mix(in srgb, var(--opus-accent) 10%, var(--opus-panel));
+  width: 2.1rem;
+  height: 2.1rem;
+  color: color-mix(in srgb, var(--opus-accent) 78%, white);
+  cursor: pointer;
+  border-radius: 10px;
+  flex: none;
+  place-items: center;
+  padding: 0;
+  font-size: 1rem;
+  transition: background .16s, border-color .16s, transform .16s;
+  display: inline-grid;
+}
+
+.opus_TjZbi8_createButton svg {
+  width: .78rem;
+  height: .78rem;
+}
+
+.opus_TjZbi8_createButton:hover {
+  border-color: color-mix(in srgb, var(--opus-accent) 72%, var(--opus-border));
+  background: color-mix(in srgb, var(--opus-accent) 18%, var(--opus-panel));
+}
+
+.opus_TjZbi8_createButton:active {
+  transform: translateY(1px);
+}
+
+.opus_TjZbi8_createButton:focus-visible {
+  outline: 2px solid var(--opus-accent);
+  outline-offset: 2px;
+}
+
+.opus_TjZbi8_createMenuIcon {
+  flex: 0 0 1rem;
+  justify-content: center;
+  align-items: center;
+  width: 1rem;
+  height: 1rem;
+  display: inline-flex;
+}
+
+.opus_TjZbi8_createMenuIcon svg {
+  width: .875rem;
+  height: .875rem;
+}
+
+.opus_TjZbi8_profile {
+  width: min(190px, 18vw);
+  min-width: 150px;
+}
+
+@container (width <= 1200px) {
+  .opus_TjZbi8_profile {
+    width: 46px;
+    min-width: 46px;
+    overflow: hidden;
+  }
+}
+
+.opus_TjZbi8_content {
+  background: radial-gradient(75% 120% at 0 0, #1d4ed81a, #0000 60%), linear-gradient(#0e182b, #07111f);
+  border: 1px solid #60a5fa2e;
+  border-top-color: #797bf86b;
+  border-radius: 22px 22px 0 0;
+  grid-template-columns: minmax(280px, 430px) minmax(0, 1fr);
+  align-items: center;
+  gap: 16px;
+  width: 100%;
+  min-width: 0;
+  height: calc(100% + 2px);
+  min-height: 72px;
+  margin-block: -1px;
+  padding: 0 18px 0 16px;
+  display: grid;
+  box-shadow: inset 0 1px #ffffff0d, -10px 0 28px #02061742;
+}
+
+.opus_TjZbi8_root[data-connected="true"] .opus_TjZbi8_content {
+  border-color: #0000;
+  border-left-color: var(--application-header-border);
+  background: radial-gradient(75% 120% at 0 0, #1d4ed81a, #0000 60%), linear-gradient(90deg, #0d172a 0%, #07111f 66%, #0000 100%);
+  border-right: 0;
+  border-radius: 14px 0 0 14px;
+  height: 62px;
+  min-height: 62px;
+  margin-block: 0;
+  position: relative;
+}
+
+.opus_TjZbi8_root[data-connected="true"] .opus_TjZbi8_content:before, .opus_TjZbi8_root[data-connected="true"] .opus_TjZbi8_content:after {
+  background: linear-gradient(90deg,
+    var(--application-header-border) 0%,
+    var(--application-header-border) 66%,
+    transparent 100%);
+  content: "";
+  pointer-events: none;
+  height: 1px;
+  position: absolute;
+  left: 10px;
+  right: 0;
+}
+
+.opus_TjZbi8_root[data-connected="true"] .opus_TjZbi8_content:before {
+  top: -1px;
+}
+
+.opus_TjZbi8_root[data-connected="true"] .opus_TjZbi8_content:after {
+  bottom: -1px;
+}
+
+[data-shell-theme="light"] .opus_TjZbi8_root, [data-theme="light"] .opus_TjZbi8_root {
+  --application-header-bg: #f7f8fffa;
+  --application-header-border: #b4b3e8;
+  --dashboard-section-bg: #f7f8fffa;
+  --dashboard-section-panel: #fff;
+  --dashboard-section-text: #17132f;
+  --dashboard-section-muted: #655f83;
+  color: #17132f;
+  background: radial-gradient(110% 180% at 0 0, #7c3aed47, #0000 60%), radial-gradient(90% 140% at 22% 20%, #a78bfa38, #0000 64%), linear-gradient(#f5f3ff 0%, #eef2ff 100%);
+  box-shadow: inset 0 1px #ffffffe6, 0 12px 28px #4338ca24;
+}
+
+[data-shell-theme="light"] .opus_TjZbi8_content, [data-theme="light"] .opus_TjZbi8_content {
+  background: radial-gradient(75% 120% at 0 0, #dbeafe8a, #0000 62%), linear-gradient(#fffffffa, #f5f7fffa);
+  border-color: #b5aae4 #babbe6 #babbe6;
+  box-shadow: inset 0 1px #fffffffa, -10px 0 28px #4338ca14;
+}
+
+[data-shell-theme="light"] .opus_TjZbi8_root[data-connected="true"] .opus_TjZbi8_content, [data-theme="light"] .opus_TjZbi8_root[data-connected="true"] .opus_TjZbi8_content {
+  border-color: #0000;
+  border-left-color: var(--application-header-border);
+  background: radial-gradient(75% 120% at 0 0, #dbeafe8a, #0000 62%), linear-gradient(90deg, #fffffffa 0%, #f5f7ff 66%, #0000 100%);
+  border-right: 0;
+}
+
+@media (width <= 1100px) {
+  .opus_TjZbi8_root {
+    grid-template-columns: 150px minmax(0, 1fr);
+  }
+
+  .opus_TjZbi8_content {
+    grid-template-columns: minmax(220px, 1fr) auto;
+  }
+
+  .opus_TjZbi8_logo {
+    width: 132px;
+    max-width: 132px;
+    height: 48px;
+  }
+
+  .opus_TjZbi8_profile {
+    width: 46px;
+    min-width: 46px;
+    overflow: hidden;
+  }
+}
+
+@media (width <= 780px) {
+  .opus_TjZbi8_root {
+    grid-template-columns: 120px minmax(0, 1fr);
+    min-height: 64px;
+  }
+
+  .opus_TjZbi8_content {
+    grid-template-columns: minmax(0, 1fr) auto;
+    min-height: 62px;
+  }
+
+  .opus_TjZbi8_search {
+    display: none;
+  }
+
+  .opus_TjZbi8_actions {
+    grid-column: 2;
+  }
+
+  .opus_TjZbi8_actions > :nth-of-type(n+5) {
+    display: none;
+  }
+}
+
+@media (width <= 520px) {
+  .opus_TjZbi8_root {
+    padding: 10px 12px;
+  }
+
+  .opus_TjZbi8_actions {
+    gap: 6px;
+  }
+
+  .opus_TjZbi8_profile {
+    display: none;
+  }
+}
+
+/* components/ApplicationFooter/ApplicationFooter.module.css */
+.opus_mphyzH_root {
+  --application-footer-border: var(--dashboard-section-border, #60a5fa33);
+  border: 1px solid var(--application-footer-border);
+  width: 100%;
+  min-width: 0;
+  min-height: 58px;
+  color: var(--dashboard-section-text, var(--opus-text));
+  background: radial-gradient(110% 180% at 0 100%, #6d28d957, #0000 58%), radial-gradient(90% 140% at 22% 80%, #312e8138, #0000 62%), linear-gradient(#070c1a 0%, #06101d 100%);
+  border-radius: 14px;
+  grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
+  align-items: center;
+  padding: 8px 18px;
+  display: grid;
+  box-shadow: inset 0 1px #ffffff0f, 0 12px 28px #020617ad;
+}
+
+.opus_mphyzH_brand, .opus_mphyzH_actions, .opus_mphyzH_actionSlot {
+  align-items: center;
+  display: flex;
+}
+
+.opus_mphyzH_brand {
+  gap: 8px;
+  min-width: 0;
+}
+
+.opus_mphyzH_logo {
+  object-fit: contain;
+  width: 86px;
+  height: 34px;
+}
+
+.opus_mphyzH_product {
+  color: var(--opus-muted);
+  font-weight: 650;
+}
+
+.opus_mphyzH_version {
+  color: var(--opus-muted);
+  margin-left: 10px;
+  font-size: .72rem;
+}
+
+.opus_mphyzH_copyright {
+  color: var(--opus-muted);
+  text-align: center;
+}
+
+.opus_mphyzH_actions {
+  justify-content: flex-end;
+  gap: 8px;
+}
+
+.opus_mphyzH_actionSlot {
+  gap: 8px;
+}
+
+.opus_mphyzH_actionSlot [role="separator"] {
+  height: 24px;
+}
+
+.opus_mphyzH_action {
+  width: 32px;
+  height: 32px;
+  color: var(--opus-muted);
+  cursor: pointer;
+  background: none;
+  border: 0;
+  border-radius: 8px;
+  place-items: center;
+  padding: 0;
+  display: grid;
+}
+
+.opus_mphyzH_action:hover, .opus_mphyzH_action:focus-visible {
+  background: color-mix(in srgb, var(--opus-text) 7%, transparent);
+  color: var(--opus-text);
+  outline: none;
+}
+
+.opus_mphyzH_action:focus-visible {
+  outline: 2px solid var(--opus-accent);
+  outline-offset: 2px;
+}
+
+.opus_mphyzH_action svg {
+  width: 15px;
+  height: 15px;
+}
+
+[data-shell-theme="light"] .opus_mphyzH_root, [data-theme="light"] .opus_mphyzH_root {
+  --application-footer-border: #b4b3e8;
+  color: #17132f;
+  background: radial-gradient(110% 180% at 0 100%, #7c3aed3d, #0000 60%), radial-gradient(90% 140% at 22% 80%, #a78bfa2e, #0000 64%), linear-gradient(#f5f3ff 0%, #eef2ff 100%);
+  box-shadow: inset 0 1px #ffffffe6, 0 12px 28px #4338ca24;
+}
+
+@media (width <= 720px) {
+  .opus_mphyzH_root {
+    grid-template-columns: 1fr auto;
+  }
+
+  .opus_mphyzH_copyright, .opus_mphyzH_version {
+    display: none;
+  }
+}
+
+/* components/WelcomeMessage/WelcomeMessage.module.css */
+.opus_cZqjKS_root {
+  min-width: 0;
+}
+
+.opus_cZqjKS_heading {
+  color: var(--dashboard-section-text, var(--opus-text));
+  letter-spacing: -.025em;
+  margin: 0;
+  font-size: clamp(1.5rem, 2.4vw, 2rem);
+  font-weight: 650;
+  line-height: 1.15;
+}
+
+.opus_cZqjKS_wave {
+  transform-origin: 70% 70%;
+  margin-left: .45em;
+  font-size: .88em;
+  display: inline-block;
+}
+
+.opus_cZqjKS_subtitle {
+  color: var(--dashboard-section-muted, var(--opus-muted));
+  margin: 8px 0 0;
+  font-size: .95rem;
+  line-height: 1.5;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .opus_cZqjKS_root:hover .opus_cZqjKS_wave {
+    animation: .65s ease-in-out opus_cZqjKS_welcome-wave;
+  }
+}
+
+@keyframes opus_cZqjKS_welcome-wave {
+  0%, 100% {
+    transform: rotate(0);
+  }
+
+  30% {
+    transform: rotate(15deg);
+  }
+
+  65% {
+    transform: rotate(-8deg);
+  }
+}
+
 /* components/FontPicker/FontPicker.module.css */
 .opus_ub1fhz_field {
   align-items: center;