sliccy 6.95.0 → 6.96.0

package/dist/ui/assets/{src-Ci8SZIla.js → src-Bw7lN3n5.js}

@@ -6890,411 +6890,542 @@ slicc-monitor {
   color: var(--ink);
   background: var(--bg);
   overflow: auto;
-  padding: 16px;
   container: monitor / inline-size;
-  --monitor-border: color-mix(in srgb, var(--line) 55%, var(--ink));
-}
-.monitor-summary {
+  --monitor-ok: var(--green);
+  --monitor-warn: var(--waffle);
+  --monitor-bad: var(--red);
+}
+.dark slicc-monitor,
+[data-theme="dark"] slicc-monitor {
+  /*
+   * Status hues are re-stepped for the dark surface rather than flipped:
+   * --green / --red measure 4.06:1 and 3.14:1 on #161618, both under 4.5:1
+   * for the small status text they carry. These sit at ~6-7:1.
+   */
+  --monitor-ok: #35b45c;
+  --monitor-warn: #e0a03a;
+  --monitor-bad: #ef6a52;
+}
+.monitor {
   display: grid;
-  gap: 16px;
-  padding: 16px;
-  margin: -16px -16px 16px;
-  border-bottom: 1px solid var(--line);
-  background: color-mix(in srgb, var(--canvas) 94%, var(--ctx));
-  box-shadow: var(--shadow-pane);
-  position: sticky;
-  top: -16px;
-  z-index: 2;
+  gap: 18px;
+  padding: 18px;
+  box-sizing: border-box;
 }
-.monitor-summary__topline {
+
+/* header */
+.monitor-head {
   display: flex;
   align-items: center;
   gap: 12px;
 }
-.monitor-summary__mark {
+.monitor-head__mark {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: 40px;
-  height: 40px;
+  width: 36px;
+  height: 36px;
   flex: 0 0 auto;
-  border-radius: 12px;
-  color: color-mix(in srgb, var(--ctx) 35%, var(--ink));
-  background: color-mix(in srgb, var(--ctx) 14%, var(--canvas));
-  border: 1px solid color-mix(in srgb, var(--ctx) 28%, var(--monitor-border));
+  border-radius: 11px;
+  color: var(--accent);
+  background: color-mix(in srgb, var(--ctx) 12%, var(--canvas));
+  border: 1px solid color-mix(in srgb, var(--ctx) 26%, var(--line));
 }
-.monitor-summary__copy {
+.monitor-head__copy {
+  flex: 1 1 auto;
   min-width: 0;
 }
-.monitor-summary__title {
+.monitor-head__title {
   margin: 0;
-  color: var(--ink);
-  font-size: 16px;
-  line-height: 1.25;
+  font-size: 15px;
   font-weight: 700;
   letter-spacing: -0.01em;
 }
-.monitor-summary__subtitle {
-  margin: 2px 0 0;
+.monitor-head__sub {
+  margin: 1px 0 0;
+  font-size: 11px;
   color: var(--txt-2);
-  font-size: 12px;
-  line-height: 1.4;
 }
-.monitor-summary__refresh {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  gap: 8px;
-  min-height: 40px;
-  margin-left: auto;
-  font-family: var(--ui);
-  font-size: 12px;
-  font-weight: 600;
-  padding: 0 12px;
-  border: 1px solid var(--monitor-border);
-  border-radius: 8px;
+
+/* tier 1 — vitals */
+.monitor-vitals {
+  display: grid;
+  grid-template-columns: 1.6fr 1fr 1fr 1fr;
+  gap: 12px;
+}
+.monitor-tile {
+  display: grid;
+  grid-template-rows: auto auto 1fr auto;
+  gap: 4px;
+  padding: 14px;
+  min-width: 0;
+  border: 1px solid var(--line);
+  border-radius: 14px;
   background: var(--canvas);
-  color: var(--ink);
-  cursor: pointer;
-  transition: background-color 120ms ease, border-color 120ms ease;
 }
-.monitor-summary__refresh:hover {
-  background: var(--ghost);
+.monitor-tile--hero {
+  grid-template-rows: auto auto auto 1fr auto;
+  gap: 2px;
+}
+.monitor-tile__label {
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--txt-2);
 }
-.monitor-summary__refresh:active {
-  transform: translateY(1px);
+.monitor-tile__figure {
+  display: flex;
+  align-items: baseline;
+  gap: 5px;
 }
-.monitor-summary__refresh:focus-visible,
-.monitor-section__header:focus-visible {
-  outline: 2px solid var(--ink);
-  outline-offset: 2px;
+.monitor-tile__value {
+  font-size: 26px;
+  line-height: 1.15;
+  font-weight: 600;
+  letter-spacing: -0.02em;
 }
-.monitor-summary__refresh:disabled,
-.monitor-section__header:disabled {
-  cursor: not-allowed;
-  opacity: 0.55;
+.monitor-tile--hero .monitor-tile__value {
+  font-size: 48px;
+  line-height: 1.05;
+  letter-spacing: -0.03em;
 }
-.monitor-summary__metrics {
-  display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-  gap: 8px;
-  margin: 0;
+.monitor-tile__unit {
+  font-size: 11px;
+  color: var(--txt-2);
 }
-.monitor-summary__metric {
-  min-width: 0;
-  padding: 8px 12px;
-  border-radius: 8px;
-  background: color-mix(in srgb, var(--ink) 4%, var(--canvas));
-  border: 1px solid var(--line);
+.monitor-tile--hero .monitor-tile__unit {
+  font-size: 14px;
 }
-.monitor-summary__metric dt {
+.monitor-tile__delta {
+  font-size: 11px;
+  font-weight: 600;
   color: var(--txt-2);
-  font-size: 10px;
-  line-height: 1.4;
-  font-weight: 700;
-  letter-spacing: 0.06em;
-  text-transform: uppercase;
 }
-.monitor-summary__metric dd {
-  margin: 2px 0 0;
-  overflow: hidden;
-  color: var(--ink);
-  font-size: 15px;
-  line-height: 1.3;
-  font-weight: 700;
-  text-overflow: ellipsis;
-  white-space: nowrap;
+.monitor-tile__plot {
+  align-self: center;
+  min-width: 0;
+  margin: 6px 0 2px;
 }
-.monitor-sections {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
-  align-items: start;
-  gap: 16px;
+.monitor-tile__plot svg {
+  max-width: 100%;
+  height: auto;
+}
+.monitor-tile__foot {
+  font-size: 10.5px;
+  color: var(--txt-3);
 }
-.monitor-section {
-  --monitor-accent: var(--ctx);
+.monitor-meter {
+  display: block;
+  height: 10px;
+  border-radius: 5px;
+  background: color-mix(in srgb, var(--monitor-hue) 16%, var(--canvas));
   overflow: hidden;
-  border: 1px solid var(--monitor-border);
-  border-radius: 12px;
-  background: var(--canvas);
-  box-shadow: var(--shadow-pane);
 }
-.monitor-section[data-accent='rose'] { --monitor-accent: var(--rose); }
-.monitor-section[data-accent='cyan'] { --monitor-accent: var(--cyan); }
-.monitor-section[data-accent='violet'] { --monitor-accent: var(--violet); }
-.monitor-section[data-accent='amber'] { --monitor-accent: var(--amber); }
-.monitor-section[data-accent='waffle'] { --monitor-accent: var(--waffle); }
-.monitor-section[data-accent='green'] { --monitor-accent: var(--green); }
-.monitor-section--empty .monitor-section__count {
-  background: var(--canvas);
+.monitor-meter__fill {
+  display: block;
+  height: 100%;
+  border-radius: 5px;
+  background: var(--monitor-hue);
 }
-.monitor-section__header {
-  position: relative;
+
+/* blocks */
+.monitor-block {
+  display: grid;
+  gap: 8px;
+}
+.monitor-block__head {
   display: flex;
   align-items: center;
   gap: 8px;
-  width: 100%;
-  min-height: 48px;
-  padding: 8px 12px 8px 16px;
-  border: 0;
-  border-bottom: 1px solid var(--line);
-  border-radius: 0;
-  background: color-mix(in srgb, var(--monitor-accent) 8%, var(--canvas));
-  cursor: pointer;
-  font-family: var(--ui);
-  font-size: 13px;
-  color: var(--ink);
-  transition: background-color 120ms ease;
-  text-align: left;
 }
-.monitor-section__header::before {
-  content: '';
-  position: absolute;
-  inset: 8px auto 8px 0;
-  width: 3px;
-  border-radius: 0 3px 3px 0;
-  background: var(--monitor-accent);
+.monitor-block__title {
+  margin: 0;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--txt-2);
 }
-.monitor-section__header:hover {
-  background: color-mix(in srgb, var(--monitor-accent) 13%, var(--canvas));
+.monitor-block__hint {
+  margin-left: auto;
+  font-size: 11px;
+  color: var(--txt-3);
 }
-.monitor-section__toggle {
+.monitor-pill {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: 24px;
-  height: 24px;
-  color: var(--txt-3);
-  flex-shrink: 0;
+  min-width: 20px;
+  height: 18px;
+  padding: 0 6px;
+  border-radius: 9px;
+  font-size: 11px;
+  font-weight: 700;
+  font-variant-numeric: tabular-nums;
+}
+.monitor-pill--ok {
+  color: var(--monitor-ok);
+  background: color-mix(in srgb, var(--monitor-ok) 12%, var(--canvas));
 }
-.monitor-section__heading {
+.monitor-pill--warn {
+  color: var(--monitor-warn);
+  background: color-mix(in srgb, var(--monitor-warn) 18%, var(--canvas));
+}
+.monitor-pill--error {
+  color: var(--monitor-bad);
+  background: color-mix(in srgb, var(--monitor-bad) 12%, var(--canvas));
+}
+
+/*
+ * Status glyphs. The shape varies with the state as well as the hue —
+ * --amber measures 2.09:1 on the light surface, so color alone would not
+ * clear contrast, and every state also carries a word.
+ */
+.monitor-glyph {
+  display: inline-flex;
+  align-items: center;
+}
+.monitor-glyph--active { color: var(--monitor-ok); }
+.monitor-glyph--warn { color: var(--monitor-warn); }
+.monitor-glyph--error { color: var(--monitor-bad); }
+.monitor-glyph--idle { color: var(--txt-3); }
+
+/* tier 2 — attention */
+.monitor-alerts {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: grid;
+  gap: 6px;
+}
+.monitor-alert {
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr) auto;
+  align-items: center;
+  gap: 10px;
+  padding: 10px 12px;
+  border: 1px solid var(--line);
+  border-left-width: 3px;
+  border-radius: 12px;
+  background: var(--canvas);
+}
+.monitor-alert[data-severity="warn"] { border-left-color: var(--monitor-warn); }
+.monitor-alert[data-severity="error"] { border-left-color: var(--monitor-bad); }
+.monitor-alert__icon { display: inline-flex; }
+.monitor-alert__copy {
   display: grid;
-  min-width: 0;
   gap: 1px;
+  min-width: 0;
 }
-.monitor-section__title {
-  font-weight: 600;
+.monitor-alert__title {
+  font-size: 12.5px;
+  font-weight: 650;
 }
-.monitor-section__meta {
+.monitor-alert__detail {
+  font-size: 11px;
   color: var(--txt-2);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.monitor-alert__age {
   font-size: 11px;
+  color: var(--txt-3);
+  font-variant-numeric: tabular-nums;
 }
-.monitor-section__count {
-  margin-left: auto;
-  flex-shrink: 0;
-  min-width: 24px;
-  background: color-mix(in srgb, var(--monitor-accent) 13%, var(--canvas));
-  border: 1px solid color-mix(in srgb, var(--monitor-accent) 28%, var(--line));
+.monitor-clear {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 12px 14px;
+  border: 1px solid color-mix(in srgb, var(--monitor-ok) 28%, var(--line));
   border-radius: 12px;
-  padding: 2px 7px;
-  font-size: 11px;
-  font-weight: 600;
-  color: color-mix(in srgb, var(--monitor-accent) 35%, var(--ink));
-  text-align: center;
+  background: color-mix(in srgb, var(--monitor-ok) 8%, var(--canvas));
 }
-.monitor-section__body {
-  padding: 8px;
+.monitor-clear__title {
+  font-size: 12.5px;
+  font-weight: 700;
+  color: var(--monitor-ok);
 }
-.monitor-section__body[hidden] {
-  display: none;
+.monitor-clear__text {
+  font-size: 11.5px;
+  color: var(--txt-2);
 }
-.monitor-section__list {
-  display: grid;
-  gap: 4px;
-  margin: 0;
-  padding: 0;
-  list-style: none;
+
+/* tier 3a — topology */
+.monitor-groups {
+  border: 1px solid var(--line);
+  border-radius: 14px;
+  background: var(--canvas);
+  overflow: hidden;
+}
+.monitor-group + .monitor-group {
+  border-top: 1px solid var(--line);
 }
 .monitor-row {
   display: grid;
-  grid-template-columns: auto minmax(0, 1fr) auto;
+  grid-template-columns: auto auto auto minmax(0, 1fr) auto;
   align-items: center;
-  gap: 12px;
-  min-height: 56px;
-  padding: 8px;
-  border-radius: 8px;
-  transition: background-color 120ms ease;
+  gap: 9px;
+  width: 100%;
+  padding: 10px 12px;
+  border: 0;
+  background: none;
+  font: inherit;
+  color: inherit;
+  text-align: left;
+  cursor: pointer;
+  transition: background 0.12s ease;
 }
 .monitor-row:hover {
-  background: color-mix(in srgb, var(--monitor-accent) 5%, var(--ghost));
+  background: color-mix(in srgb, var(--ink) 3%, var(--canvas));
 }
+.monitor-row__chev,
 .monitor-row__icon {
+  display: inline-flex;
+  color: var(--txt-2);
+}
+.monitor-row__name {
+  font-size: 12.5px;
+  font-weight: 650;
+}
+.monitor-row__summary {
+  font-size: 11.5px;
+  color: var(--txt-2);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.monitor-row__state {
   display: inline-flex;
   align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 32px;
-  flex: 0 0 auto;
-  border-radius: 8px;
-  color: color-mix(in srgb, var(--monitor-accent) 35%, var(--ink));
-  background: color-mix(in srgb, var(--monitor-accent) 10%, var(--canvas));
-  border: 1px solid color-mix(in srgb, var(--monitor-accent) 20%, var(--line));
+  gap: 5px;
+  font-size: 11px;
+  font-weight: 600;
+}
+.monitor-children {
+  list-style: none;
+  margin: 0;
+  padding: 0 0 6px;
 }
-.monitor-row__content {
+.monitor-child {
   display: grid;
+  grid-template-columns: auto minmax(0, 1fr) auto;
+  align-items: center;
+  gap: 9px;
+  padding: 5px 12px;
+}
+.monitor-child__copy {
+  display: grid;
+  gap: 1px;
   min-width: 0;
-  gap: 3px;
 }
-.monitor-row__headline {
+.monitor-child__headline {
   display: flex;
   align-items: center;
-  min-width: 0;
   gap: 6px;
-  flex-wrap: wrap;
-}
-.monitor-row__name {
   min-width: 0;
+}
+.monitor-child__name {
+  font-size: 12px;
+  font-family: var(--mono);
   overflow: hidden;
-  color: var(--ink);
-  font-weight: 600;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.monitor-row__sublabel {
-  overflow: hidden;
-  color: var(--txt-2);
+.monitor-child__sublabel {
   font-size: 11px;
-  line-height: 1.4;
+  color: var(--txt-2);
+  overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.monitor-row__badges {
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-  flex-wrap: wrap;
+.monitor-child__meta {
+  font-size: 11px;
+  color: var(--txt-2);
+  font-variant-numeric: tabular-nums;
+  white-space: nowrap;
 }
-.monitor-row__badge {
-  display: inline-flex;
-  align-items: center;
-  min-height: 18px;
+.monitor-badge {
   padding: 1px 6px;
-  border: 1px solid color-mix(in srgb, var(--monitor-accent) 24%, var(--line));
-  border-radius: 9px;
-  color: color-mix(in srgb, var(--monitor-accent) 30%, var(--ink));
-  background: color-mix(in srgb, var(--monitor-accent) 8%, var(--canvas));
+  border-radius: 6px;
   font-size: 10px;
-  line-height: 1.3;
   font-weight: 600;
+  color: var(--txt-2);
+  background: var(--ghost);
+  white-space: nowrap;
 }
-.monitor-row__aside {
+.monitor-empty {
   display: grid;
-  justify-items: end;
-  min-width: 88px;
-  gap: 3px;
-  text-align: right;
-}
-.monitor-row__meta {
+  justify-items: center;
+  gap: 4px;
+  padding: 18px 16px;
   color: var(--txt-2);
+  text-align: center;
+}
+.monitor-empty__title {
+  color: var(--ink);
+  font-size: 12px;
+  font-weight: 700;
+}
+.monitor-empty__text {
+  max-width: 32ch;
   font-size: 11px;
-  line-height: 1.4;
-  white-space: nowrap;
+  line-height: 1.5;
 }
-.monitor-row__state {
-  --monitor-status: var(--txt-2);
+
+/* tier 3b — the process table */
+.monitor-toolbar {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+.monitor-input {
+  flex: 1 1 auto;
+  min-width: 0;
+  height: 30px;
+  padding: 0 10px;
+  font: inherit;
+  font-size: 12px;
+  color: var(--ink);
+  background: var(--canvas);
+  border: 1px solid var(--line);
+  border-radius: 9px;
+}
+.monitor-label {
   display: inline-flex;
   align-items: center;
-  gap: 5px;
-  color: var(--monitor-status);
+  gap: 6px;
+  font-size: 11.5px;
+  color: var(--txt-2);
+  white-space: nowrap;
+}
+.monitor-tablewrap {
+  border: 1px solid var(--line);
+  border-radius: 14px;
+  background: var(--canvas);
+  overflow: auto;
+  max-height: 420px;
+}
+.monitor-table {
+  width: 100%;
+  border-collapse: collapse;
+  font-size: 12px;
+}
+.monitor-th {
+  position: sticky;
+  top: 0;
+  z-index: 1;
+  padding: 8px 10px;
+  text-align: left;
   font-size: 10px;
-  line-height: 1.4;
   font-weight: 700;
+  letter-spacing: 0.06em;
+  color: var(--txt-2);
+  background: var(--canvas);
+  border-bottom: 1px solid var(--line);
+  cursor: pointer;
+  white-space: nowrap;
 }
-.monitor-row__state--active {
-  --monitor-status: color-mix(in srgb, var(--green) 35%, var(--ink));
+.monitor-th:hover { color: var(--ink); }
+.monitor-th__label { margin-right: 4px; }
+.monitor-tr:hover {
+  background: color-mix(in srgb, var(--ink) 3%, var(--canvas));
 }
-.monitor-row__state--error {
-  --monitor-status: color-mix(in srgb, var(--red) 35%, var(--ink));
+.monitor-td {
+  padding: 6px 10px;
+  border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, var(--canvas));
+  white-space: nowrap;
 }
-.monitor-row__state--warn {
-  --monitor-status: color-mix(in srgb, var(--amber) 35%, var(--ink));
+.monitor-td--pid,
+.monitor-td--ppid,
+.monitor-td--started,
+.monitor-td--elapsed {
+  font-family: var(--mono);
+  font-variant-numeric: tabular-nums;
 }
-.monitor-row__dot {
-  position: relative;
-  width: 7px;
-  height: 7px;
-  border-radius: 50%;
-  background: currentColor;
-  flex-shrink: 0;
+.monitor-td--command {
+  width: 100%;
+  max-width: 0;
+  font-family: var(--mono);
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
-.monitor-row__state--active .monitor-row__dot::after {
-  content: '';
-  position: absolute;
-  inset: -4px;
-  border: 1px solid currentColor;
-  border-radius: 50%;
-  animation: monitor-pulse 2s ease-out infinite;
+.monitor-statcell {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
 }
-.monitor-row__state--error .monitor-row__dot {
-  border-radius: 2px;
-  transform: rotate(45deg);
+.monitor-stat-tag {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 16px;
+  height: 16px;
+  border-radius: 4px;
+  font-family: var(--mono);
+  font-size: 10px;
+  font-weight: 700;
+  color: var(--txt-2);
+  background: var(--ghost);
 }
-.monitor-row__state--warn .monitor-row__dot {
-  width: 8px;
-  height: 8px;
-  border: 2px solid currentColor;
-  background: transparent;
+.monitor-stat-tag--R {
+  color: var(--monitor-ok);
+  background: color-mix(in srgb, var(--monitor-ok) 13%, var(--canvas));
 }
-.monitor-empty {
-  display: grid;
-  justify-items: center;
-  gap: 4px;
-  padding: 24px 16px;
+.monitor-stat-tag--S {
+  color: var(--cyan);
+  background: color-mix(in srgb, var(--cyan) 15%, var(--canvas));
+}
+.monitor-stat-tag--K {
+  color: var(--monitor-bad);
+  background: color-mix(in srgb, var(--monitor-bad) 12%, var(--canvas));
+}
+.monitor-stat-word {
+  font-size: 11px;
+  color: var(--txt-2);
+}
+.monitor-empty-cell {
+  padding: 18px 12px;
   color: var(--txt-2);
   text-align: center;
+  white-space: normal;
 }
-.monitor-empty__icon {
+
+/* buttons */
+.monitor-btn {
   display: inline-flex;
   align-items: center;
-  justify-content: center;
-  width: 40px;
-  height: 40px;
-  margin-bottom: 4px;
-  border-radius: 12px;
-  color: color-mix(in srgb, var(--monitor-accent) 30%, var(--ink));
-  background: color-mix(in srgb, var(--monitor-accent) 9%, var(--canvas));
-}
-.monitor-empty__title {
+  gap: 5px;
+  height: 26px;
+  padding: 0 10px;
+  font: inherit;
+  font-size: 11.5px;
+  font-weight: 600;
   color: var(--ink);
-  font-size: 12px;
-  font-weight: 700;
-}
-.monitor-empty__text {
-  max-width: 32ch;
-  font-size: 11px;
-  line-height: 1.5;
+  background: var(--canvas);
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  cursor: pointer;
+  white-space: nowrap;
+  transition: border-color 0.12s ease;
 }
-@keyframes monitor-pulse {
-  from { opacity: 0.55; transform: scale(0.55); }
-  to { opacity: 0; transform: scale(1.25); }
+.monitor-btn:hover { border-color: var(--txt-3); }
+
+@container monitor (max-width: 940px) {
+  .monitor-vitals { grid-template-columns: 1fr 1fr; }
+  .monitor-tile--hero,
+  .monitor-vitals > :last-child { grid-column: span 2; }
 }
 @container monitor (max-width: 560px) {
-  .monitor-summary__metrics {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-  .monitor-sections {
-    grid-template-columns: 1fr;
-  }
-  .monitor-row {
-    grid-template-columns: auto minmax(0, 1fr);
-  }
-  .monitor-row__aside {
-    grid-column: 2;
-    grid-template-columns: 1fr auto;
-    justify-items: start;
-    min-width: 0;
-    width: 100%;
-    text-align: left;
-  }
+  .monitor-vitals { grid-template-columns: 1fr; }
+  .monitor-tile--hero,
+  .monitor-vitals > :last-child { grid-column: auto; }
+  .monitor-row { grid-template-columns: auto auto minmax(0, 1fr); row-gap: 2px; }
+  .monitor-row__summary,
+  .monitor-row__state { grid-column: 3; justify-self: start; }
 }
 @media (prefers-reduced-motion: reduce) {
-  .monitor-row__state--active .monitor-row__dot::after {
-    animation: none;
-  }
-  .monitor-summary__refresh,
-  .monitor-section__header,
-  .monitor-row {
-    transition-duration: 0.01ms;
-  }
+  .monitor-row,
+  .monitor-btn { transition-duration: 0.01ms; }
 }
-`,Wy=`slicc-monitor-style`;function Gy(e){if(e.getElementById(Wy))return;let t=e.createElement(`style`);t.id=Wy,t.textContent=Uy,(e.head??e.documentElement).appendChild(t)}function Ky(e){return e.status?e.status:e.error?`error`:e.active?`active`:`idle`}function qy(e){return e===`active`?`Active`:e===`error`?`Error`:e===`warn`?`Warning`:`Idle`}function Jy(e){let t=Ky(e),r=j(`span`,{class:`monitor-row__badges`});for(let t of e.badges??[])r.appendChild(j(`span`,{class:`monitor-row__badge`},t));let i=j(`span`,{class:`monitor-row__headline`},j(`span`,{class:`monitor-row__name`},e.name));r.childElementCount>0&&i.appendChild(r);let a=j(`span`,{class:`monitor-row__content`},i);return e.sublabel&&a.appendChild(j(`span`,{class:`monitor-row__sublabel`},e.sublabel)),j(`li`,{class:`monitor-row`,"data-status":t},j(`span`,{class:`monitor-row__icon`},n(e.icon??`box`,{size:16})),a,j(`span`,{class:`monitor-row__aside`},j(`span`,{class:`monitor-row__meta`},e.meta),j(`span`,{class:`monitor-row__state monitor-row__state--${t}`},j(`span`,{class:`monitor-row__dot`,"aria-hidden":`true`}),qy(t))))}function Yy(e){return j(`div`,{class:`monitor-empty`,role:`status`},j(`span`,{class:`monitor-empty__icon`},n(`inbox`,{size:18})),j(`span`,{class:`monitor-empty__title`},`No ${e.label.toLocaleLowerCase()} yet`),j(`span`,{class:`monitor-empty__text`},e.emptyText??`${e.label} will appear here when available.`))}function Xy(e,t,r,i){let a=t.has(e.id),o=e.count===0?`monitor-section monitor-section--empty`:`monitor-section`,s=[j(`span`,{class:`monitor-section__toggle`,"aria-hidden":`true`},n(a?`chevron-right`:`chevron-down`,{size:15})),j(`span`,{class:`monitor-section__heading`},j(`span`,{class:`monitor-section__title`},e.label),e.meta?j(`span`,{class:`monitor-section__meta`},e.meta):null)];s.push(j(`span`,{class:`monitor-section__count`},String(e.count)));let c=j(`button`,{class:`monitor-section__header`,type:`button`},...s);c.setAttribute(`aria-expanded`,String(!a)),c.setAttribute(`aria-controls`,i),c.addEventListener(`click`,()=>r(e.id));let l=j(`div`,{class:`monitor-section__body`,id:i});if(a&&l.setAttribute(`hidden`,``),e.rows.length===0)l.appendChild(Yy(e));else{let t=j(`ul`,{class:`monitor-section__list`});for(let n of e.rows)t.appendChild(Jy(n));l.appendChild(t)}return j(`section`,{class:o,"data-section":e.id,"data-accent":e.accent??`neutral`},c,l)}function Zy(e,t){return j(`div`,{class:`monitor-summary__metric`},j(`dt`,null,e),j(`dd`,null,t))}function Qy(e,t){let r=e.flatMap(e=>e.rows),i=r.filter(e=>Ky(e)===`active`).length,a=r.filter(e=>[`warn`,`error`].includes(Ky(e))).length,o=e.reduce((e,t)=>e+(t.id===`cost`?0:t.count),0),s=e.find(e=>e.id===`cost`)?.meta??`—`,c=j(`button`,{class:`monitor-summary__refresh`,type:`button`,"aria-label":`Refresh monitor data`},n(`refresh-cw`,{size:15}),j(`span`,null,`Refresh`));return c.addEventListener(`click`,t),j(`header`,{class:`monitor-summary`},j(`div`,{class:`monitor-summary__topline`},j(`span`,{class:`monitor-summary__mark`},n(`activity`,{size:19})),j(`div`,{class:`monitor-summary__copy`},j(`h2`,{class:`monitor-summary__title`},`Live monitor`),j(`p`,{class:`monitor-summary__subtitle`},`System activity and connections at a glance`)),c),j(`dl`,{class:`monitor-summary__metrics`},Zy(`Tracked`,String(o)),Zy(`Active`,String(i)),Zy(`Attention`,String(a)),Zy(`Session cost`,s)))}function $y(e){return{...e,rows:e.rows.map(e=>({...e,badges:e.badges?.slice()}))}}var eb=0;A(`slicc-monitor`,class extends HTMLElement{#e=[];#t=new Set;#n=!1;#r=++eb;connectedCallback(){Gy(this.ownerDocument),this.#n||=(this.#t=Vy(),!0),this.#e.length>0&&this.#i()}get sections(){return this.#e.map($y)}set sections(e){this.#e=Array.isArray(e)?e.map($y):[],this.isConnected&&this.#i()}#i(){let e=Qy(this.#e,()=>{this.dispatchEvent(new CustomEvent(`slicc-monitor-refresh`,{bubbles:!0,composed:!0}))}),t=j(`div`,{class:`monitor-sections`});for(let e of this.#e){let n=e.id.replace(/[^a-z0-9_-]/gi,`-`);t.appendChild(Xy(e,this.#t,e=>{this.#t.has(e)?this.#t.delete(e):this.#t.add(e),Hy(this.#t),this.#i()},`monitor-${this.#r}-${n}`))}this.replaceChildren(),we(this,[e,t])}});var tb=e({CHAT_SURFACE_ID:()=>gl,DEFAULT_LAUNCHER_CORNER:()=>ee,DEFAULT_LAUNCHER_FOLLOWER_STATUS:()=>T,HOLD_TO_ENABLE_MS:()=>nn,LAUNCHER_FOLLOWER_STATUS_ATTR:()=>E,LAYOUT_SCHEMA_VERSION:()=>1,MACHINE_WRITTEN_MEMORY_PATH:()=>MACHINE_WRITTEN_MEMORY_PATH,PANEL_MARKER_ATTR:()=>wa,REDACTED_REAL_WORLD_MEMORY_PATH:()=>REDACTED_REAL_WORLD_MEMORY_PATH,SYNTHETIC_MEMORY_PATH:()=>SYNTHETIC_MEMORY_PATH,SliccImagePreview:()=>Yt,TOKENS_CSS:()=>rl,ensureGlobalTokens:()=>al,followSystemTheme:()=>sl,setTheme:()=>ol});export{za as a,Vo as i,al as n,ua as o,sl as r,Gi as s,tb as t};
+`,Wy=`slicc-monitor-style`;function Gy(e){if(e.getElementById(Wy))return;let t=e.createElement(`style`);t.id=Wy,t.textContent=Uy,(e.head??e.documentElement).appendChild(t)}var Ky={error:3,warn:2,active:1,idle:0},qy={active:`circle-check`,warn:`triangle-alert`,error:`octagon-x`,idle:`circle`},Jy={active:`Healthy`,warn:`Attention`,error:`Failing`,idle:`Idle`};function Yy(e){return e.status?e.status:e.error?`error`:e.active?`active`:`idle`}function Xy(e){if(e.status)return e.status;let t=`idle`;for(let n of e.rows){let e=Yy(n);Ky[e]>Ky[t]&&(t=e)}return t}function Zy(e){return j(`span`,{class:`monitor-glyph monitor-glyph--${e}`},n(qy[e],{size:14}))}var Qy={rose:`var(--rose)`,cyan:`var(--cyan)`,violet:`var(--violet)`,amber:`var(--amber)`,waffle:`var(--waffle)`,green:`var(--green)`};function $y(e){return e?Qy[e]:`var(--ctx)`}var eb=`http://www.w3.org/2000/svg`;function tb(e,t){let n=document.createElementNS(eb,e);for(let[e,r]of Object.entries(t))n.setAttribute(e,String(r));return n}function nb(e,t,n){let r=Math.min(...e),i=Math.max(...e)-r||1;return e.map((a,o)=>({x:3+o/(e.length-1)*(t-6),y:n-3-(a-r)/i*(n-6)}))}function rb(e,t,n,r){let i=nb(e,n,r),a=i.map(e=>`${e.x.toFixed(1)},${e.y.toFixed(1)}`).join(` `),o=i[i.length-1],s=tb(`svg`,{width:n,height:r,viewBox:`0 0 ${n} ${r}`,"aria-hidden":`true`});return s.append(tb(`polygon`,{points:`${a} ${n-3},${r} 3,${r}`,fill:t,"fill-opacity":`0.1`}),tb(`polyline`,{points:a,fill:`none`,stroke:t,"stroke-width":`2`,"stroke-linejoin":`round`,"stroke-linecap":`round`}),tb(`circle`,{cx:o.x,cy:o.y,r:`4`,fill:t,stroke:`var(--canvas)`,"stroke-width":`2`})),s}function ib(e){let t=$y(e.accent);if(e.series&&e.series.length>1){let n=e.hero?{w:300,h:56}:{w:132,h:34};return j(`div`,{class:`monitor-tile__plot`},rb(e.series,t,n.w,n.h))}if(typeof e.ratio==`number`){let n=Math.max(0,Math.min(1,e.ratio))*100;return j(`div`,{class:`monitor-tile__plot`},j(`span`,{class:`monitor-meter`,style:`--monitor-hue:${t}`},j(`span`,{class:`monitor-meter__fill`,style:`width:${n.toFixed(1)}%`})))}return null}function ab(e){let t=j(`section`,{class:`monitor-tile${e.hero?` monitor-tile--hero`:``}`,"data-vital":e.id});return we(t,[j(`span`,{class:`monitor-tile__label`},e.label),j(`div`,{class:`monitor-tile__figure`},j(`span`,{class:`monitor-tile__value`},e.value),e.unit?j(`span`,{class:`monitor-tile__unit`},e.unit):null),e.delta?j(`span`,{class:`monitor-tile__delta`},e.delta):null,ib(e),e.foot?j(`span`,{class:`monitor-tile__foot`},e.foot):null]),t}function ob(e){return j(`div`,{class:`monitor-vitals`},...e.map(ab))}function sb(e){return j(`li`,{class:`monitor-alert`,"data-severity":e.severity,"data-alert":e.id},j(`span`,{class:`monitor-alert__icon monitor-glyph--${e.severity}`},n(e.icon??qy[e.severity===`error`?`error`:`warn`],{size:16})),j(`span`,{class:`monitor-alert__copy`},j(`span`,{class:`monitor-alert__title`},e.title),e.detail?j(`span`,{class:`monitor-alert__detail`},e.detail):null),e.age?j(`span`,{class:`monitor-alert__age`},e.age):null)}function cb(){return j(`div`,{class:`monitor-clear`,role:`status`},Zy(`active`),j(`span`,{class:`monitor-clear__title`},`All clear`),j(`span`,{class:`monitor-clear__text`},`Nothing is stalled, expired, or failing.`))}function lb(e){let t=e.some(e=>e.severity===`error`)?`error`:e.length>0?`warn`:`ok`;return j(`section`,{class:`monitor-block`,"data-block":`attention`},j(`div`,{class:`monitor-block__head`},j(`h3`,{class:`monitor-block__title`},`Needs attention`),j(`span`,{class:`monitor-pill monitor-pill--${t}`},String(e.length))),e.length===0?cb():j(`ul`,{class:`monitor-alerts`},...e.map(sb)))}function ub(e){let t=Yy(e),n=j(`span`,{class:`monitor-child__headline`},j(`span`,{class:`monitor-child__name`},e.name));for(let t of e.badges??[])n.appendChild(j(`span`,{class:`monitor-badge`},t));let r=j(`span`,{class:`monitor-child__copy`},n);return e.sublabel&&r.appendChild(j(`span`,{class:`monitor-child__sublabel`},e.sublabel)),j(`li`,{class:`monitor-child`,"data-status":t,style:`padding-left:${28+(e.depth??0)*18}px`},Zy(t),r,j(`span`,{class:`monitor-child__meta`},e.meta))}function db(e){return j(`div`,{class:`monitor-empty`,role:`status`},j(`span`,{class:`monitor-empty__title`},`No ${e.label.toLocaleLowerCase()} yet`),j(`span`,{class:`monitor-empty__text`},e.emptyText??`${e.label} will appear here when available.`))}function fb(e,t,r,i,a){let o=Xy(e),s=o===`warn`||o===`error`,c=r.has(e.id)?!0:!t.has(e.id)&&s&&e.rows.length>0,l=j(`ul`,{class:`monitor-children`,id:a});e.rows.length===0?l.replaceChildren(db(e)):l.append(...e.rows.map(ub)),c||l.setAttribute(`hidden`,``);let u=j(`button`,{class:`monitor-row`,type:`button`},j(`span`,{class:`monitor-row__chev`,"aria-hidden":`true`},n(c?`chevron-down`:`chevron-right`,{size:15})),j(`span`,{class:`monitor-row__icon`},n(e.icon??`box`,{size:16})),j(`span`,{class:`monitor-row__name`},e.label),j(`span`,{class:`monitor-row__summary`},e.meta??`${e.count}`),j(`span`,{class:`monitor-row__state monitor-glyph--${o}`},Zy(o),Jy[o]));return u.setAttribute(`aria-expanded`,String(c)),u.setAttribute(`aria-controls`,a),u.addEventListener(`click`,()=>i(e.id,c)),j(`div`,{class:`monitor-group`,"data-section":e.id,"data-status":o,"data-accent":e.accent??`neutral`},u,l)}var pb=[`pid`,`ppid`,`state`,`started`,`elapsed`,`scoop`,`command`],mb=new Set([`R`,`S`]);function hb(e,t){if(t===`state`)return j(`td`,{class:`monitor-td monitor-td--state`},j(`span`,{class:`monitor-statcell`},j(`span`,{class:`monitor-stat-tag monitor-stat-tag--${e.state}`},e.state),j(`span`,{class:`monitor-stat-word`},e.status)));let n=e[t];return j(`td`,{class:`monitor-td monitor-td--${t}`},n==null?`—`:String(n))}function gb(e){return j(`tr`,{class:`monitor-tr`,"data-pid":String(e.pid),"data-live":String(mb.has(e.state))},...pb.map(t=>hb(e,t)))}function _b(e,t,n){return[...e].sort((e,r)=>{let i=e[t],a=r[t],o=typeof i==`number`&&typeof a==`number`?i-a:String(i??``).localeCompare(String(a??``));return n?-o:o})}function vb(e,t){return j(`tr`,null,...pb.map(r=>{let i=e.sort===r,a=j(`th`,{class:`monitor-th monitor-td--${r}`,scope:`col`},j(`span`,{class:`monitor-th__label`},r.toUpperCase()),i?n(e.descending?`chevron-down`:`chevron-up`,{size:12}):null);return a.setAttribute(`aria-sort`,i?e.descending?`descending`:`ascending`:`none`),a.addEventListener(`click`,()=>{e.descending=e.sort===r&&!e.descending,e.sort=r,t()}),a}))}function yb(e,t){return!t||e.command.toLowerCase().includes(t)||(e.scoop??``).toLowerCase().includes(t)||String(e.pid).includes(t)}function bb(e){let t={sort:`pid`,descending:!1,query:``},n=j(`input`,{class:`monitor-input`,type:`search`,"aria-label":`Filter processes`,placeholder:`Filter command, scoop, or pid…`}),r=j(`thead`),i=j(`tbody`),a=j(`span`,{class:`monitor-block__hint`}),o=()=>{let n=_b(e.rows,t.sort,t.descending).filter(e=>yb(e,t.query));if(r.replaceChildren(vb(t,o)),n.length===0){let e=j(`td`,{class:`monitor-td monitor-empty-cell`,colspan:pb.length});e.textContent=t.query?`No live process matches “${t.query}”.`:`No processes running.`,i.replaceChildren(j(`tr`,{class:`monitor-tr`},e))}else i.replaceChildren(...n.map(gb));let s=e.terminated>0?` · ${e.terminated.toLocaleString()} exited this session`:``;a.replaceChildren(document.createTextNode(`${e.rows.length} live${s}`))};return n.addEventListener(`input`,()=>{t.query=n.value.trim().toLowerCase(),o()}),o(),j(`section`,{class:`monitor-block`,"data-block":`processes`},j(`div`,{class:`monitor-block__head`},j(`h3`,{class:`monitor-block__title`},`Processes`),a),j(`div`,{class:`monitor-toolbar`},n),j(`div`,{class:`monitor-tablewrap`},j(`table`,{class:`monitor-table`},r,i)))}function xb(e){return{...e,rows:e.rows.map(e=>({...e,badges:e.badges?.slice()}))}}var Sb=0;A(`slicc-monitor`,class extends HTMLElement{#e={};#t=new Set;#n=new Set;#r=!1;#i=++Sb;connectedCallback(){Gy(this.ownerDocument),this.#r||=(this.#t=Vy(),!0),this.#c()}get model(){return{...this.#e,vitals:this.#e.vitals?.map(e=>({...e,series:e.series?.slice()})),alerts:this.#e.alerts?.map(e=>({...e})),sections:this.#e.sections?.map(xb),processes:this.#e.processes?{...this.#e.processes,rows:this.#e.processes.rows.map(e=>({...e}))}:this.#e.processes}}set model(e){this.#e=e??{},this.isConnected&&this.#c()}get sections(){return(this.#e.sections??[]).map(xb)}set sections(e){this.#e={...this.#e,sections:Array.isArray(e)?e.map(xb):[]},this.isConnected&&this.#c()}#a(){let e=j(`button`,{class:`monitor-btn`,type:`button`,"aria-label":`Re-sync monitor data`},n(`refresh-cw`,{size:14}),j(`span`,null,`Re-sync`));return e.addEventListener(`click`,()=>{this.dispatchEvent(new CustomEvent(`slicc-monitor-refresh`,{bubbles:!0,composed:!0}))}),j(`header`,{class:`monitor-head`},j(`span`,{class:`monitor-head__mark`},n(`activity`,{size:18})),j(`div`,{class:`monitor-head__copy`},j(`h2`,{class:`monitor-head__title`},`Live monitor`),j(`p`,{class:`monitor-head__sub`},this.#e.updated??`Streaming`)),e)}#o(e){let t=j(`div`,{class:`monitor-groups`});for(let n of e){let e=n.id.replace(/[^a-z0-9_-]/gi,`-`);t.appendChild(fb(n,this.#t,this.#n,(e,t)=>this.#s(e,t),`monitor-${this.#i}-${e}`))}return j(`section`,{class:`monitor-block`,"data-block":`topology`},j(`div`,{class:`monitor-block__head`},j(`h3`,{class:`monitor-block__title`},`Topology`),j(`span`,{class:`monitor-block__hint`},`healthy groups stay collapsed`)),t)}#s(e,t){t?(this.#n.delete(e),this.#t.add(e)):(this.#t.delete(e),this.#n.add(e)),Hy(this.#t),this.#c()}#c(){let{vitals:e=[],alerts:t,sections:n=[],processes:r}=this.#e,i=j(`div`,{class:`monitor`});we(i,[this.#a(),e.length>0?ob(e):null,t?lb(t):null,n.length>0?this.#o(n):null,r?bb(r):null]),this.replaceChildren(i)}});var Cb=e({CHAT_SURFACE_ID:()=>gl,DEFAULT_LAUNCHER_CORNER:()=>ee,DEFAULT_LAUNCHER_FOLLOWER_STATUS:()=>T,HOLD_TO_ENABLE_MS:()=>nn,LAUNCHER_FOLLOWER_STATUS_ATTR:()=>E,LAYOUT_SCHEMA_VERSION:()=>1,MACHINE_WRITTEN_MEMORY_PATH:()=>MACHINE_WRITTEN_MEMORY_PATH,PANEL_MARKER_ATTR:()=>wa,REDACTED_REAL_WORLD_MEMORY_PATH:()=>REDACTED_REAL_WORLD_MEMORY_PATH,SYNTHETIC_MEMORY_PATH:()=>SYNTHETIC_MEMORY_PATH,SliccImagePreview:()=>Yt,TOKENS_CSS:()=>rl,ensureGlobalTokens:()=>al,followSystemTheme:()=>sl,setTheme:()=>ol});export{za as a,Vo as i,al as n,ua as o,sl as r,Gi as s,Cb as t};