ФУНКЦИИ - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: Voice Tasker preview и трейс активности

plane-src/apps/web/styles/globals.css

@@ -3936,4 +3936,63 @@
       linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.012) 100%), rgba(255, 255, 255, 0.03) !important;
     color: var(--text-color-primary) !important;
   }
+
+  .nodedc-voice-task-processing-loader {
+    width: 5rem;
+    aspect-ratio: 1;
+    box-sizing: border-box;
+    position: relative;
+    display: block;
+    color: rgb(var(--nodedc-accent-rgb));
+  }
+
+  .nodedc-voice-task-processing-loader::before,
+  .nodedc-voice-task-processing-loader::after {
+    content: "";
+    position: absolute;
+    box-sizing: border-box;
+    display: block;
+  }
+
+  .nodedc-voice-task-processing-loader::before {
+    inset: 1.125rem;
+    border: 0.5rem solid currentColor;
+    border-radius: 0.625rem;
+    box-shadow: 0 0 1.25rem rgba(var(--nodedc-accent-rgb), 0.18);
+  }
+
+  .nodedc-voice-task-processing-loader::after {
+    width: 1rem;
+    aspect-ratio: 1;
+    top: 0;
+    left: 0;
+    border-radius: 9999px;
+    background: currentColor;
+    box-shadow: 0 0 1.125rem rgba(var(--nodedc-accent-rgb), 0.28);
+    offset-anchor: center;
+    offset-path: path("M 22 22 H 58 V 58 H 22 V 22");
+    animation: nodedc-voice-task-processing-loader 1.8s cubic-bezier(0.65, 0, 0.35, 1) infinite;
+  }
+
+  @keyframes nodedc-voice-task-processing-loader {
+    0% {
+      offset-distance: 0%;
+    }
+
+    25% {
+      offset-distance: 25%;
+    }
+
+    50% {
+      offset-distance: 50%;
+    }
+
+    75% {
+      offset-distance: 75%;
+    }
+
+    100% {
+      offset-distance: 100%;
+    }
+  }
 }