refactor: split remaining monitor runtime helpers

ui/src/styles/chat/layout.css

@@ -63,7 +63,7 @@
   background: transparent;
 }
 
-.chat-thread-inner> :first-child {
+.chat-thread-inner > :first-child {
   margin-top: 0 !important;
 }
 
@@ -320,7 +320,7 @@
 }
 
 /* Hide the "Message" label - keep textarea only */
-.chat-compose__field>span {
+.chat-compose__field > span {
   display: none;
 }
 
@@ -391,7 +391,7 @@
   }
 }
 
-.agent-chat__input>textarea {
+.agent-chat__input > textarea {
   width: 100%;
   min-height: 40px;
   max-height: 150px;
@@ -407,7 +407,7 @@
   box-sizing: border-box;
 }
 
-.agent-chat__input>textarea::placeholder {
+.agent-chat__input > textarea::placeholder {
   color: var(--muted);
 }
 
@@ -549,7 +549,7 @@
   scrollbar-width: thin;
 }
 
-.slash-menu-group+.slash-menu-group {
+.slash-menu-group + .slash-menu-group {
   margin-top: 4px;
   padding-top: 4px;
   border-top: 1px solid color-mix(in srgb, var(--border) 50%, transparent);

ui/src/styles/components.css

@@ -1019,11 +1019,11 @@
   position: relative;
 }
 
-.cron-filter-dropdown__details>summary {
+.cron-filter-dropdown__details > summary {
   list-style: none;
 }
 
-.cron-filter-dropdown__details>summary::-webkit-details-marker {
+.cron-filter-dropdown__details > summary::-webkit-details-marker {
   display: none;
 }
 
@@ -1645,7 +1645,6 @@
 }
 
 @media (max-width: 1100px) {
-
   .table-head,
   .table-row {
     grid-template-columns: 1fr;
@@ -1653,7 +1652,6 @@
 }
 
 @container (max-width: 1100px) {
-
   .table-head,
   .table-row {
     grid-template-columns: 1fr;
@@ -2306,7 +2304,6 @@
 }
 
 @keyframes chatStreamPulse {
-
   0%,
   100% {
     border-color: var(--border);
@@ -2341,7 +2338,7 @@
   height: 12px;
 }
 
-.chat-reading-indicator__dots>span {
+.chat-reading-indicator__dots > span {
   display: inline-block;
   width: 6px;
   height: 6px;
@@ -2353,16 +2350,15 @@
   will-change: transform, opacity;
 }
 
-.chat-reading-indicator__dots>span:nth-child(2) {
+.chat-reading-indicator__dots > span:nth-child(2) {
   animation-delay: 0.15s;
 }
 
-.chat-reading-indicator__dots>span:nth-child(3) {
+.chat-reading-indicator__dots > span:nth-child(3) {
   animation-delay: 0.3s;
 }
 
 @keyframes chatReadingDot {
-
   0%,
   80%,
   100% {
@@ -2377,7 +2373,7 @@
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .chat-reading-indicator__dots>span {
+  .chat-reading-indicator__dots > span {
     animation: none;
     opacity: 0.6;
   }
@@ -3063,7 +3059,7 @@
   min-width: 0;
 }
 
-.agent-kv>div {
+.agent-kv > div {
   min-width: 0;
   overflow-wrap: anywhere;
   word-break: break-word;
@@ -3318,7 +3314,7 @@
   gap: 8px;
 }
 
-.agent-skills-header>span:last-child {
+.agent-skills-header > span:last-child {
   margin-left: auto;
 }
 

ui/src/styles/layout.css

@@ -70,7 +70,7 @@
   padding-top: 0;
 }
 
-.shell--chat-focus .content>*+* {
+.shell--chat-focus .content > * + * {
   margin-top: 0;
 }
 
@@ -688,9 +688,11 @@
 
 .sidebar--collapsed .nav-item.active,
 .sidebar--collapsed .nav-item--active {
-  background: linear-gradient(180deg,
-      color-mix(in srgb, var(--accent) 14%, var(--bg-elevated) 86%) 0%,
-      color-mix(in srgb, var(--accent) 8%, var(--bg) 92%) 100%);
+  background: linear-gradient(
+    180deg,
+    color-mix(in srgb, var(--accent) 14%, var(--bg-elevated) 86%) 0%,
+    color-mix(in srgb, var(--accent) 8%, var(--bg) 92%) 100%
+  );
   border-color: color-mix(in srgb, var(--accent) 18%, var(--border) 82%);
   box-shadow:
     inset 0 1px 0 color-mix(in srgb, white 8%, transparent),
@@ -853,7 +855,7 @@
   overflow-x: hidden;
 }
 
-.content>*+* {
+.content > * + * {
   margin-top: 20px;
 }
 
@@ -869,7 +871,7 @@
   padding-bottom: 0;
 }
 
-.content--chat>*+* {
+.content--chat > * + * {
   margin-top: 0;
 }
 
@@ -928,7 +930,7 @@
   padding-bottom: 0;
 }
 
-.content--chat .content-header>div:first-child {
+.content--chat .content-header > div:first-child {
   text-align: left;
 }