@compose-market/theme 0.0.75 → 0.0.81

package/dist/agents/styles.d.ts

@@ -1,2 +1,2 @@
-export declare const agentsCss = "/**\n * Compose.Market Agent Card\n * @compose-market/theme/css/agents\n */\n\n.cm-agent-card {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr);\n  gap: 1rem;\n  border-radius: 0.65rem;\n  border: 1px solid hsl(var(--border) / 0.75);\n  background: linear-gradient(145deg, hsl(var(--card) / 0.82), hsl(var(--card) / 0.48));\n  box-shadow:\n    0 4px 24px -1px hsl(0 0% 0% / 0.3),\n    inset 0 1px 0 hsl(0 0% 100% / 0.05);\n  overflow: hidden;\n}\n\n.cm-agent-card--interactive {\n  transition:\n    transform 180ms ease,\n    border-color 180ms ease,\n    box-shadow 180ms ease;\n}\n\n.cm-agent-card--interactive:hover {\n  transform: translateY(-2px);\n  border-color: hsl(var(--primary) / 0.45);\n  box-shadow:\n    0 16px 36px hsl(240 30% 2% / 0.28),\n    0 0 24px hsl(var(--primary) / 0.14),\n    inset 0 1px 0 hsl(0 0% 100% / 0.05);\n}\n\n.cm-agent-card--running {\n  border-color: hsl(142 71% 45% / 0.48);\n  box-shadow:\n    0 10px 30px hsl(142 71% 45% / 0.08),\n    0 0 24px hsl(142 71% 45% / 0.12),\n    inset 0 1px 0 hsl(0 0% 100% / 0.05);\n}\n\n.cm-agent-card__main {\n  display: grid;\n  gap: 1rem;\n  padding: 1.2rem;\n}\n\n.cm-agent-card__header {\n  display: flex;\n  align-items: flex-start;\n  gap: 1rem;\n}\n\n.cm-agent-card__avatar {\n  width: 3.5rem;\n  height: 3.5rem;\n  border-radius: 999px;\n  border: 2px solid hsl(var(--primary) / 0.24);\n  background: radial-gradient(circle, hsl(var(--primary) / 0.12), transparent 72%);\n  display: grid;\n  place-items: center;\n  flex-shrink: 0;\n  overflow: hidden;\n}\n\n.cm-agent-card__avatar-image {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n\n.cm-agent-card__avatar-fallback {\n  font-family: var(--font-mono), monospace;\n  color: hsl(var(--primary));\n  font-size: 1rem;\n  font-weight: 700;\n  letter-spacing: 0.06em;\n  text-transform: uppercase;\n}\n\n.cm-agent-card__copy {\n  display: grid;\n  gap: 0.5rem;\n  min-width: 0;\n  flex: 1;\n}\n\n.cm-agent-card__title-row {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.6rem;\n}\n\n.cm-agent-card__title {\n  font-family: var(--font-display), sans-serif;\n  font-size: 1.05rem;\n  line-height: 1.1;\n  color: hsl(var(--foreground));\n  min-width: 0;\n}\n\n.cm-agent-card__header-action {\n  margin-left: auto;\n  flex-shrink: 0;\n}\n\n.cm-agent-card__description {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.86rem;\n  line-height: 1.55;\n}\n\n.cm-agent-card__badges,\n.cm-agent-card__tags {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.45rem;\n}\n\n.cm-agent-card__badge,\n.cm-agent-card__tag {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.35rem;\n  min-height: 1.7rem;\n  padding: 0 0.7rem;\n  border-radius: 999px;\n  border: 1px solid hsl(var(--border) / 0.72);\n  background: hsl(var(--muted) / 0.28);\n  color: hsl(var(--muted-foreground));\n  font-size: 0.72rem;\n  line-height: 1;\n}\n\n.cm-agent-card__badge-icon {\n  display: inline-flex;\n  align-items: center;\n}\n\n.cm-agent-card__badge[data-tone=\"cyan\"],\n.cm-agent-card__tag {\n  border-color: hsl(var(--primary) / 0.28);\n  background: hsl(var(--primary) / 0.12);\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__badge[data-tone=\"green\"] {\n  border-color: hsl(142 71% 45% / 0.28);\n  background: hsl(142 71% 45% / 0.12);\n  color: hsl(142 71% 45%);\n}\n\n.cm-agent-card__badge[data-tone=\"fuchsia\"] {\n  border-color: hsl(292 85% 55% / 0.28);\n  background: hsl(292 85% 55% / 0.12);\n  color: hsl(292 85% 55%);\n}\n\n.cm-agent-card__badge[data-tone=\"warning\"] {\n  border-color: hsl(42 100% 48% / 0.28);\n  background: hsl(42 100% 48% / 0.12);\n  color: hsl(42 100% 48%);\n}\n\n.cm-agent-card__badge[data-tone=\"danger\"] {\n  border-color: hsl(var(--destructive) / 0.28);\n  background: hsl(var(--destructive) / 0.12);\n  color: hsl(var(--destructive));\n}\n\n.cm-agent-card__metrics {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(8.7rem, 1fr));\n  gap: 0.6rem;\n}\n\n.cm-agent-card__metric {\n  display: grid;\n  grid-template-columns: auto minmax(0, 1fr);\n  gap: 0.6rem;\n  align-items: center;\n  padding: 0.8rem 0.9rem;\n  border-radius: 0.5rem;\n  border: 1px solid hsl(var(--border) / 0.65);\n  background: hsl(var(--background) / 0.5);\n}\n\n.cm-agent-card__metric-icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__metric-copy {\n  display: grid;\n  gap: 0.14rem;\n  min-width: 0;\n}\n\n.cm-agent-card__metric-label,\n.cm-agent-card__focus-label,\n.cm-agent-card__tags-title,\n.cm-agent-card__meta-label {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.68rem;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n.cm-agent-card__metric-value,\n.cm-agent-card__focus-value,\n.cm-agent-card__meta-value {\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.86rem;\n  line-height: 1.2;\n  overflow-wrap: anywhere;\n}\n\n.cm-agent-card__metric[data-tone=\"green\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"green\"] .cm-agent-card__metric-value {\n  color: hsl(142 71% 45%);\n}\n\n.cm-agent-card__metric[data-tone=\"cyan\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"cyan\"] .cm-agent-card__metric-value {\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__metric[data-tone=\"fuchsia\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"fuchsia\"] .cm-agent-card__metric-value {\n  color: hsl(292 85% 55%);\n}\n\n.cm-agent-card__metric[data-tone=\"warning\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"warning\"] .cm-agent-card__metric-value {\n  color: hsl(42 100% 48%);\n}\n\n.cm-agent-card__metric[data-tone=\"danger\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"danger\"] .cm-agent-card__metric-value {\n  color: hsl(var(--destructive));\n}\n\n.cm-agent-card__focus {\n  display: grid;\n  grid-template-columns: auto minmax(0, 1fr);\n  gap: 0.7rem;\n  align-items: center;\n  padding: 0.95rem 1rem;\n  border-radius: 0.5rem;\n  border: 1px solid hsl(var(--border) / 0.72);\n  background: linear-gradient(135deg, hsl(var(--primary) / 0.12), transparent 68%);\n}\n\n.cm-agent-card__focus-icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__focus-copy,\n.cm-agent-card__tags-block {\n  display: grid;\n  gap: 0.35rem;\n}\n\n.cm-agent-card__meta {\n  display: grid;\n  gap: 0.55rem;\n}\n\n.cm-agent-card__meta-row {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 1rem;\n}\n\n.cm-agent-card__footer {\n  padding-top: 0.9rem;\n  border-top: 1px solid hsl(var(--border) / 0.55);\n}\n\n.cm-agent-card__footer-stack {\n  display: grid;\n  gap: 0.8rem;\n}\n\n.cm-agent-card__endpoint,\n.cm-agent-card__creator {\n  display: grid;\n  gap: 0.45rem;\n}\n\n.cm-agent-card__endpoint-label,\n.cm-agent-card__creator-label {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.68rem;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n.cm-agent-card__endpoint-row {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto;\n  gap: 0.6rem;\n  align-items: center;\n  padding: 0.65rem 0.75rem;\n  border-radius: 0.45rem;\n  border: 1px solid hsl(var(--border) / 0.65);\n  background: hsl(var(--background) / 0.42);\n}\n\n.cm-agent-card__endpoint-code,\n.cm-agent-card__creator-value {\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.78rem;\n  overflow-wrap: anywhere;\n}\n\n.cm-agent-card__creator-value {\n  color: hsl(292 85% 55%);\n}\n\n.cm-agent-card__footer-link {\n  color: hsl(var(--primary));\n  font-size: 0.82rem;\n  font-weight: 600;\n  text-decoration: none;\n}\n\n.cm-agent-card__footer-link:hover {\n  text-decoration: underline;\n}\n\n.cm-agent-card__actions {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.55rem;\n  padding: 1.2rem 1.2rem 1.2rem 0;\n}\n\n.cm-agent-card__action-stack {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.55rem;\n  flex-wrap: wrap;\n}\n\n.cm-agent-card--skeleton {\n  pointer-events: none;\n}\n\n.cm-agent-card__skeleton {\n  border-radius: 0.45rem;\n  background: linear-gradient(90deg, hsl(var(--muted) / 0.55), hsl(var(--muted) / 0.8), hsl(var(--muted) / 0.55));\n  background-size: 220% 100%;\n  animation: cm-agent-card-shimmer 1.6s linear infinite;\n}\n\n.cm-agent-card__skeleton--avatar {\n  width: 3.5rem;\n  height: 3.5rem;\n  border-radius: 999px;\n}\n\n.cm-agent-card__skeleton--title {\n  height: 1.1rem;\n  width: 10rem;\n}\n\n.cm-agent-card__skeleton--line {\n  height: 0.82rem;\n  width: 100%;\n}\n\n.cm-agent-card__skeleton--line.short {\n  width: 76%;\n}\n\n.cm-agent-card__skeleton--metric {\n  min-height: 4.4rem;\n}\n\n.cm-agent-card__skeleton--focus {\n  min-height: 4.3rem;\n}\n\n.cm-agent-card__skeleton--tags {\n  min-height: 5.6rem;\n}\n\n.cm-agent-card__skeleton--footer {\n  min-height: 4.2rem;\n}\n\n@keyframes cm-agent-card-shimmer {\n  0% {\n    background-position: 200% 0;\n  }\n\n  100% {\n    background-position: -200% 0;\n  }\n}\n\n@media (max-width: 720px) {\n  .cm-agent-card__main {\n    gap: 0.65rem;\n    padding: 0.85rem;\n  }\n\n  .cm-agent-card__avatar {\n    width: 2.5rem;\n    height: 2.5rem;\n  }\n\n  .cm-agent-card__title {\n    font-size: 0.92rem;\n  }\n\n  .cm-agent-card__description {\n    font-size: 0.78rem;\n    line-height: 1.4;\n  }\n\n  .cm-agent-card__metrics {\n    grid-template-columns: repeat(2, 1fr);\n  }\n\n  .cm-agent-card__metric {\n    padding: 0.55rem 0.7rem;\n  }\n\n  .cm-agent-card__focus {\n    padding: 0.7rem 0.8rem;\n  }\n\n  .cm-agent-card__badges,\n  .cm-agent-card__tags {\n    gap: 0.3rem;\n  }\n\n  .cm-agent-card__badge,\n  .cm-agent-card__tag {\n    min-height: 1.45rem;\n    padding: 0 0.5rem;\n    font-size: 0.65rem;\n  }\n\n  .cm-agent-card__endpoint-code,\n  .cm-agent-card__creator-value {\n    font-size: 0.68rem;\n  }\n\n  .cm-agent-card__actions {\n    padding: 0 0.85rem 0.85rem;\n    justify-content: flex-end;\n    flex-wrap: wrap;\n  }\n}\n";
+export declare const agentsCss = "/**\n * Compose.Market Agent Card\n * @compose-market/theme/css/agents\n */\n\n.cm-agent-card {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr);\n  gap: 0.85rem;\n  border-radius: max(var(--radius, 0.25rem), 0.3rem);\n  border: 1px solid hsl(var(--border) / 0.84);\n  background:\n    linear-gradient(180deg, hsl(var(--card) / 0.96), hsl(var(--card) / 0.78));\n  box-shadow:\n    0 18px 40px hsl(240 30% 2% / 0.24),\n    inset 0 1px 0 hsl(0 0% 100% / 0.04);\n  overflow: hidden;\n}\n\n.cm-agent-card--interactive {\n  transition:\n    transform 180ms ease,\n    border-color 180ms ease,\n    box-shadow 180ms ease;\n}\n\n.cm-agent-card--interactive:hover {\n  transform: translateY(-2px);\n  border-color: hsl(var(--primary) / 0.45);\n  box-shadow:\n    0 18px 36px hsl(240 30% 2% / 0.32),\n    0 0 24px hsl(var(--primary) / 0.14),\n    inset 0 1px 0 hsl(0 0% 100% / 0.05);\n}\n\n.cm-agent-card--running {\n  border-color: hsl(142 71% 45% / 0.48);\n  box-shadow:\n    0 10px 30px hsl(142 71% 45% / 0.08),\n    0 0 24px hsl(142 71% 45% / 0.12),\n    inset 0 1px 0 hsl(0 0% 100% / 0.05);\n}\n\n.cm-agent-card__main {\n  display: grid;\n  gap: 0.9rem;\n  padding: 1rem;\n}\n\n.cm-agent-card__header {\n  display: flex;\n  align-items: flex-start;\n  gap: 1rem;\n}\n\n.cm-agent-card__avatar {\n  width: 3.5rem;\n  height: 3.5rem;\n  border-radius: max(var(--radius, 0.25rem), 0.35rem);\n  border: 1px solid hsl(var(--primary) / 0.28);\n  background:\n    linear-gradient(180deg, hsl(var(--background) / 0.92), hsl(var(--muted) / 0.34));\n  display: grid;\n  place-items: center;\n  flex-shrink: 0;\n  overflow: hidden;\n  box-shadow: inset 0 0 0 1px hsl(var(--primary) / 0.08);\n}\n\n.cm-agent-card__avatar-image {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n\n.cm-agent-card__avatar-fallback {\n  font-family: var(--font-mono), monospace;\n  color: hsl(var(--primary));\n  font-size: 0.88rem;\n  font-weight: 700;\n  letter-spacing: 0.14em;\n  text-transform: uppercase;\n}\n\n.cm-agent-card__copy {\n  display: grid;\n  gap: 0.5rem;\n  min-width: 0;\n  flex: 1;\n}\n\n.cm-agent-card__title-row {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.6rem;\n}\n\n.cm-agent-card__title {\n  font-family: var(--font-display), sans-serif;\n  font-size: 1.05rem;\n  line-height: 1.1;\n  color: hsl(var(--foreground));\n  min-width: 0;\n}\n\n.cm-agent-card__header-action {\n  margin-left: auto;\n  flex-shrink: 0;\n}\n\n.cm-agent-card__description {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.84rem;\n  line-height: 1.48;\n}\n\n.cm-agent-card__badges,\n.cm-agent-card__tags {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.45rem;\n}\n\n.cm-agent-card__badge,\n.cm-agent-card__tag {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.35rem;\n  min-height: 1.7rem;\n  padding: 0 0.7rem;\n  border-radius: 999px;\n  border: 1px solid hsl(var(--border) / 0.72);\n  background: hsl(var(--muted) / 0.28);\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.64rem;\n  letter-spacing: 0.08em;\n  line-height: 1;\n  text-transform: uppercase;\n}\n\n.cm-agent-card__badge-icon {\n  display: inline-flex;\n  align-items: center;\n}\n\n.cm-agent-card__badge[data-tone=\"cyan\"],\n.cm-agent-card__tag {\n  border-color: hsl(var(--primary) / 0.28);\n  background: hsl(var(--primary) / 0.12);\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__badge[data-tone=\"green\"] {\n  border-color: hsl(142 71% 45% / 0.28);\n  background: hsl(142 71% 45% / 0.12);\n  color: hsl(142 71% 45%);\n}\n\n.cm-agent-card__badge[data-tone=\"fuchsia\"] {\n  border-color: hsl(292 85% 55% / 0.28);\n  background: hsl(292 85% 55% / 0.12);\n  color: hsl(292 85% 55%);\n}\n\n.cm-agent-card__badge[data-tone=\"warning\"] {\n  border-color: hsl(42 100% 48% / 0.28);\n  background: hsl(42 100% 48% / 0.12);\n  color: hsl(42 100% 48%);\n}\n\n.cm-agent-card__badge[data-tone=\"danger\"] {\n  border-color: hsl(var(--destructive) / 0.28);\n  background: hsl(var(--destructive) / 0.12);\n  color: hsl(var(--destructive));\n}\n\n.cm-agent-card__metrics {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(8.7rem, 1fr));\n  gap: 0.6rem;\n}\n\n.cm-agent-card__metric {\n  display: grid;\n  grid-template-columns: auto minmax(0, 1fr);\n  gap: 0.6rem;\n  align-items: center;\n  padding: 0.72rem 0.8rem;\n  border-radius: var(--radius, 0.25rem);\n  border: 1px solid hsl(var(--border) / 0.65);\n  background: hsl(var(--background) / 0.5);\n}\n\n.cm-agent-card__metric-icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__metric-copy {\n  display: grid;\n  gap: 0.14rem;\n  min-width: 0;\n}\n\n.cm-agent-card__metric-label,\n.cm-agent-card__focus-label,\n.cm-agent-card__tags-title,\n.cm-agent-card__meta-label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.62rem;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n}\n\n.cm-agent-card__metric-value,\n.cm-agent-card__focus-value,\n.cm-agent-card__meta-value {\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.8rem;\n  line-height: 1.2;\n  overflow-wrap: anywhere;\n}\n\n.cm-agent-card__metric[data-tone=\"green\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"green\"] .cm-agent-card__metric-value {\n  color: hsl(142 71% 45%);\n}\n\n.cm-agent-card__metric[data-tone=\"cyan\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"cyan\"] .cm-agent-card__metric-value {\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__metric[data-tone=\"fuchsia\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"fuchsia\"] .cm-agent-card__metric-value {\n  color: hsl(292 85% 55%);\n}\n\n.cm-agent-card__metric[data-tone=\"warning\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"warning\"] .cm-agent-card__metric-value {\n  color: hsl(42 100% 48%);\n}\n\n.cm-agent-card__metric[data-tone=\"danger\"] .cm-agent-card__metric-icon,\n.cm-agent-card__metric[data-tone=\"danger\"] .cm-agent-card__metric-value {\n  color: hsl(var(--destructive));\n}\n\n.cm-agent-card__focus {\n  display: grid;\n  grid-template-columns: auto minmax(0, 1fr);\n  gap: 0.7rem;\n  align-items: center;\n  padding: 0.85rem 0.95rem;\n  border-radius: var(--radius, 0.25rem);\n  border: 1px solid hsl(var(--border) / 0.72);\n  background:\n    linear-gradient(135deg, hsl(var(--primary) / 0.11), transparent 68%);\n}\n\n.cm-agent-card__focus-icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__focus-copy,\n.cm-agent-card__tags-block {\n  display: grid;\n  gap: 0.35rem;\n}\n\n.cm-agent-card__meta {\n  display: grid;\n  gap: 0.55rem;\n}\n\n.cm-agent-card__meta-row {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 1rem;\n}\n\n.cm-agent-card__footer {\n  padding-top: 0.9rem;\n  border-top: 1px solid hsl(var(--border) / 0.55);\n}\n\n.cm-agent-card__footer-stack {\n  display: grid;\n  gap: 0.8rem;\n}\n\n.cm-agent-card__endpoint,\n.cm-agent-card__creator {\n  display: grid;\n  gap: 0.45rem;\n}\n\n.cm-agent-card__endpoint-label,\n.cm-agent-card__creator-label {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.68rem;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n.cm-agent-card__endpoint-row {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto;\n  gap: 0.6rem;\n  align-items: center;\n  padding: 0.65rem 0.75rem;\n  border-radius: var(--radius, 0.25rem);\n  border: 1px solid hsl(var(--border) / 0.65);\n  background: hsl(var(--background) / 0.42);\n}\n\n.cm-agent-card__endpoint-code,\n.cm-agent-card__creator-value {\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.78rem;\n  overflow-wrap: anywhere;\n}\n\n.cm-agent-card__creator-value {\n  color: hsl(292 85% 55%);\n}\n\n.cm-agent-card__footer-link {\n  color: hsl(var(--primary));\n  font-size: 0.82rem;\n  font-weight: 600;\n  text-decoration: none;\n}\n\n.cm-agent-card__footer-link:hover {\n  text-decoration: underline;\n}\n\n.cm-agent-card__actions {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.55rem;\n  padding: 1rem 1rem 1rem 0;\n}\n\n.cm-agent-card__action-stack {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.55rem;\n  flex-wrap: wrap;\n}\n\n.cm-agent-card--skeleton {\n  pointer-events: none;\n}\n\n.cm-agent-card__skeleton {\n  border-radius: var(--radius, 0.25rem);\n  background: linear-gradient(90deg, hsl(var(--muted) / 0.55), hsl(var(--muted) / 0.8), hsl(var(--muted) / 0.55));\n  background-size: 220% 100%;\n  animation: cm-agent-card-shimmer 1.6s linear infinite;\n}\n\n.cm-agent-card__skeleton--avatar {\n  width: 3.5rem;\n  height: 3.5rem;\n  border-radius: max(var(--radius, 0.25rem), 0.35rem);\n}\n\n.cm-agent-card__skeleton--title {\n  height: 1.1rem;\n  width: 10rem;\n}\n\n.cm-agent-card__skeleton--line {\n  height: 0.82rem;\n  width: 100%;\n}\n\n.cm-agent-card__skeleton--line.short {\n  width: 76%;\n}\n\n.cm-agent-card__skeleton--metric {\n  min-height: 4.4rem;\n}\n\n.cm-agent-card__skeleton--focus {\n  min-height: 4.3rem;\n}\n\n.cm-agent-card__skeleton--tags {\n  min-height: 5.6rem;\n}\n\n.cm-agent-card__skeleton--footer {\n  min-height: 4.2rem;\n}\n\n@keyframes cm-agent-card-shimmer {\n  0% {\n    background-position: 200% 0;\n  }\n\n  100% {\n    background-position: -200% 0;\n  }\n}\n\n@media (max-width: 720px) {\n  .cm-agent-card__main {\n    gap: 0.65rem;\n    padding: 0.85rem;\n  }\n\n  .cm-agent-card__avatar {\n    width: 2.5rem;\n    height: 2.5rem;\n  }\n\n  .cm-agent-card__title {\n    font-size: 0.92rem;\n  }\n\n  .cm-agent-card__description {\n    font-size: 0.78rem;\n    line-height: 1.4;\n  }\n\n  .cm-agent-card__metrics {\n    grid-template-columns: repeat(2, 1fr);\n  }\n\n  .cm-agent-card__metric {\n    padding: 0.55rem 0.7rem;\n  }\n\n  .cm-agent-card__focus {\n    padding: 0.7rem 0.8rem;\n  }\n\n  .cm-agent-card__badges,\n  .cm-agent-card__tags {\n    gap: 0.3rem;\n  }\n\n  .cm-agent-card__badge,\n  .cm-agent-card__tag {\n    min-height: 1.45rem;\n    padding: 0 0.5rem;\n    font-size: 0.65rem;\n  }\n\n  .cm-agent-card__endpoint-code,\n  .cm-agent-card__creator-value {\n    font-size: 0.68rem;\n  }\n\n  .cm-agent-card__actions {\n    padding: 0 0.85rem 0.85rem;\n    justify-content: flex-end;\n    flex-wrap: wrap;\n  }\n}\n";
 //# sourceMappingURL=styles.d.ts.map

package/dist/agents/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/agents/styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,05TAkdrB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/agents/styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,8xUA0drB,CAAC"}

package/dist/agents/styles.js

@@ -6,13 +6,14 @@ export const agentsCss = `/**
 .cm-agent-card {
   display: grid;
   grid-template-columns: minmax(0, 1fr);
-  gap: 1rem;
-  border-radius: 0.65rem;
-  border: 1px solid hsl(var(--border) / 0.75);
-  background: linear-gradient(145deg, hsl(var(--card) / 0.82), hsl(var(--card) / 0.48));
+  gap: 0.85rem;
+  border-radius: max(var(--radius, 0.25rem), 0.3rem);
+  border: 1px solid hsl(var(--border) / 0.84);
+  background:
+    linear-gradient(180deg, hsl(var(--card) / 0.96), hsl(var(--card) / 0.78));
   box-shadow:
-    0 4px 24px -1px hsl(0 0% 0% / 0.3),
-    inset 0 1px 0 hsl(0 0% 100% / 0.05);
+    0 18px 40px hsl(240 30% 2% / 0.24),
+    inset 0 1px 0 hsl(0 0% 100% / 0.04);
   overflow: hidden;
 }
 
@@ -27,7 +28,7 @@ export const agentsCss = `/**
   transform: translateY(-2px);
   border-color: hsl(var(--primary) / 0.45);
   box-shadow:
-    0 16px 36px hsl(240 30% 2% / 0.28),
+    0 18px 36px hsl(240 30% 2% / 0.32),
     0 0 24px hsl(var(--primary) / 0.14),
     inset 0 1px 0 hsl(0 0% 100% / 0.05);
 }
@@ -42,8 +43,8 @@ export const agentsCss = `/**
 
 .cm-agent-card__main {
   display: grid;
-  gap: 1rem;
-  padding: 1.2rem;
+  gap: 0.9rem;
+  padding: 1rem;
 }
 
 .cm-agent-card__header {
@@ -55,13 +56,15 @@ export const agentsCss = `/**
 .cm-agent-card__avatar {
   width: 3.5rem;
   height: 3.5rem;
-  border-radius: 999px;
-  border: 2px solid hsl(var(--primary) / 0.24);
-  background: radial-gradient(circle, hsl(var(--primary) / 0.12), transparent 72%);
+  border-radius: max(var(--radius, 0.25rem), 0.35rem);
+  border: 1px solid hsl(var(--primary) / 0.28);
+  background:
+    linear-gradient(180deg, hsl(var(--background) / 0.92), hsl(var(--muted) / 0.34));
   display: grid;
   place-items: center;
   flex-shrink: 0;
   overflow: hidden;
+  box-shadow: inset 0 0 0 1px hsl(var(--primary) / 0.08);
 }
 
 .cm-agent-card__avatar-image {
@@ -73,9 +76,9 @@ export const agentsCss = `/**
 .cm-agent-card__avatar-fallback {
   font-family: var(--font-mono), monospace;
   color: hsl(var(--primary));
-  font-size: 1rem;
+  font-size: 0.88rem;
   font-weight: 700;
-  letter-spacing: 0.06em;
+  letter-spacing: 0.14em;
   text-transform: uppercase;
 }
 
@@ -107,8 +110,8 @@ export const agentsCss = `/**
 
 .cm-agent-card__description {
   color: hsl(var(--muted-foreground));
-  font-size: 0.86rem;
-  line-height: 1.55;
+  font-size: 0.84rem;
+  line-height: 1.48;
 }
 
 .cm-agent-card__badges,
@@ -129,8 +132,11 @@ export const agentsCss = `/**
   border: 1px solid hsl(var(--border) / 0.72);
   background: hsl(var(--muted) / 0.28);
   color: hsl(var(--muted-foreground));
-  font-size: 0.72rem;
+  font-family: var(--font-mono), monospace;
+  font-size: 0.64rem;
+  letter-spacing: 0.08em;
   line-height: 1;
+  text-transform: uppercase;
 }
 
 .cm-agent-card__badge-icon {
@@ -180,8 +186,8 @@ export const agentsCss = `/**
   grid-template-columns: auto minmax(0, 1fr);
   gap: 0.6rem;
   align-items: center;
-  padding: 0.8rem 0.9rem;
-  border-radius: 0.5rem;
+  padding: 0.72rem 0.8rem;
+  border-radius: var(--radius, 0.25rem);
   border: 1px solid hsl(var(--border) / 0.65);
   background: hsl(var(--background) / 0.5);
 }
@@ -204,8 +210,9 @@ export const agentsCss = `/**
 .cm-agent-card__tags-title,
 .cm-agent-card__meta-label {
   color: hsl(var(--muted-foreground));
-  font-size: 0.68rem;
-  letter-spacing: 0.08em;
+  font-family: var(--font-mono), monospace;
+  font-size: 0.62rem;
+  letter-spacing: 0.12em;
   text-transform: uppercase;
 }
 
@@ -214,7 +221,7 @@ export const agentsCss = `/**
 .cm-agent-card__meta-value {
   color: hsl(var(--foreground));
   font-family: var(--font-mono), monospace;
-  font-size: 0.86rem;
+  font-size: 0.8rem;
   line-height: 1.2;
   overflow-wrap: anywhere;
 }
@@ -249,10 +256,11 @@ export const agentsCss = `/**
   grid-template-columns: auto minmax(0, 1fr);
   gap: 0.7rem;
   align-items: center;
-  padding: 0.95rem 1rem;
-  border-radius: 0.5rem;
+  padding: 0.85rem 0.95rem;
+  border-radius: var(--radius, 0.25rem);
   border: 1px solid hsl(var(--border) / 0.72);
-  background: linear-gradient(135deg, hsl(var(--primary) / 0.12), transparent 68%);
+  background:
+    linear-gradient(135deg, hsl(var(--primary) / 0.11), transparent 68%);
 }
 
 .cm-agent-card__focus-icon {
@@ -310,7 +318,7 @@ export const agentsCss = `/**
   gap: 0.6rem;
   align-items: center;
   padding: 0.65rem 0.75rem;
-  border-radius: 0.45rem;
+  border-radius: var(--radius, 0.25rem);
   border: 1px solid hsl(var(--border) / 0.65);
   background: hsl(var(--background) / 0.42);
 }
@@ -342,7 +350,7 @@ export const agentsCss = `/**
   display: flex;
   align-items: flex-start;
   gap: 0.55rem;
-  padding: 1.2rem 1.2rem 1.2rem 0;
+  padding: 1rem 1rem 1rem 0;
 }
 
 .cm-agent-card__action-stack {
@@ -357,7 +365,7 @@ export const agentsCss = `/**
 }
 
 .cm-agent-card__skeleton {
-  border-radius: 0.45rem;
+  border-radius: var(--radius, 0.25rem);
   background: linear-gradient(90deg, hsl(var(--muted) / 0.55), hsl(var(--muted) / 0.8), hsl(var(--muted) / 0.55));
   background-size: 220% 100%;
   animation: cm-agent-card-shimmer 1.6s linear infinite;
@@ -366,7 +374,7 @@ export const agentsCss = `/**
 .cm-agent-card__skeleton--avatar {
   width: 3.5rem;
   height: 3.5rem;
-  border-radius: 999px;
+  border-radius: max(var(--radius, 0.25rem), 0.35rem);
 }
 
 .cm-agent-card__skeleton--title {

package/dist/agents/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/agents/styles.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkdxB,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/agents/styles.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0dxB,CAAC"}

package/dist/app/styles.d.ts

@@ -1,2 +1,2 @@
-export declare const appCss = "/**\n * Compose.Market App Chrome\n * @compose-market/theme/css/app\n */\n\n.cm-app-shell {\n  position: relative;\n  min-height: 100vh;\n  background: hsl(var(--background));\n  color: hsl(var(--foreground));\n  overflow-x: hidden;\n}\n\n.cm-app-shell__backdrop {\n  position: fixed;\n  inset: 0;\n  pointer-events: none;\n  z-index: 0;\n  overflow: hidden;\n}\n\n.cm-app-shell__grid,\n.cm-app-shell__gradient,\n.cm-app-shell__scanline {\n  position: absolute;\n  inset: 0;\n}\n\n.cm-app-shell__grid {\n  background-size: 40px 40px;\n  background-image:\n    linear-gradient(to right, hsl(217 33% 17% / 0.3) 1px, transparent 1px),\n    linear-gradient(to bottom, hsl(217 33% 17% / 0.3) 1px, transparent 1px);\n  transition: transform 140ms linear;\n}\n\n.cm-app-shell__gradient {\n  background-image:\n    radial-gradient(circle at 50% 0%, hsl(270 60% 10% / 0.2), transparent 70%),\n    linear-gradient(to bottom, transparent, hsl(var(--background)));\n}\n\n.cm-app-shell__scanline {\n  top: -100px;\n  height: 100px;\n  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, hsl(188 95% 43% / 0.05) 50%, rgba(0, 0, 0, 0) 100%);\n  opacity: 0.1;\n  animation: cm-app-scanline 8s linear infinite;\n}\n\n@keyframes cm-app-scanline {\n  0% {\n    transform: translateY(-100px);\n  }\n\n  100% {\n    transform: translateY(calc(100vh + 100px));\n  }\n}\n\n.cm-app-shell__content {\n  position: relative;\n  z-index: 1;\n  min-height: 100vh;\n}\n";
+export declare const appCss = "/**\n * Compose.Market App Chrome\n * @compose-market/theme/css/app\n */\n\n.cm-app-shell {\n  position: relative;\n  min-height: 100dvh;\n  background: hsl(var(--background));\n  color: hsl(var(--foreground));\n  overflow-x: hidden;\n  overflow-y: hidden;\n  isolation: isolate;\n}\n\n.cm-app-shell__backdrop {\n  position: fixed;\n  inset: 0;\n  pointer-events: none;\n  z-index: 0;\n  overflow: hidden;\n  background:\n    radial-gradient(circle at 18% 14%, hsl(var(--primary) / 0.14), transparent 26%),\n    radial-gradient(circle at 82% 12%, hsl(var(--accent) / 0.12), transparent 22%),\n    radial-gradient(circle at 50% 100%, hsl(220 60% 7% / 0.9), transparent 48%),\n    linear-gradient(180deg, hsl(220 50% 4%), hsl(var(--background)) 42%, hsl(223 47% 3%));\n}\n\n.cm-app-shell__grid,\n.cm-app-shell__gradient,\n.cm-app-shell__scanline {\n  position: absolute;\n  inset: 0;\n}\n\n.cm-app-shell__grid {\n  background-size: 48px 48px;\n  background-image:\n    linear-gradient(to right, hsl(188 95% 43% / 0.08) 1px, transparent 1px),\n    linear-gradient(to bottom, hsl(188 95% 43% / 0.08) 1px, transparent 1px);\n  transition: transform 140ms linear;\n  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0.16));\n}\n\n.cm-app-shell__gradient {\n  background-image:\n    radial-gradient(circle at 50% 0%, hsl(var(--primary) / 0.08), transparent 38%),\n    radial-gradient(circle at 55% 18%, hsl(var(--accent) / 0.08), transparent 30%),\n    linear-gradient(180deg, transparent 0%, hsl(var(--background) / 0.18) 36%, hsl(var(--background)) 100%);\n}\n\n.cm-app-shell__scanline {\n  top: -100px;\n  height: 100px;\n  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, hsl(188 95% 43% / 0.07) 50%, rgba(0, 0, 0, 0) 100%);\n  opacity: 0.22;\n  animation: cm-app-scanline 8s linear infinite;\n}\n\n@keyframes cm-app-scanline {\n  0% {\n    transform: translateY(-100px);\n  }\n\n  100% {\n    transform: translateY(calc(100vh + 100px));\n  }\n}\n\n.cm-app-shell__content {\n  position: relative;\n  z-index: 1;\n  min-height: 100dvh;\n}\n";
 //# sourceMappingURL=styles.d.ts.map

package/dist/app/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/app/styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM,u6CAiElB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/app/styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM,qhEA0ElB,CAAC"}

package/dist/app/styles.js

@@ -5,10 +5,12 @@ export const appCss = `/**
 
 .cm-app-shell {
   position: relative;
-  min-height: 100vh;
+  min-height: 100dvh;
   background: hsl(var(--background));
   color: hsl(var(--foreground));
   overflow-x: hidden;
+  overflow-y: hidden;
+  isolation: isolate;
 }
 
 .cm-app-shell__backdrop {
@@ -17,6 +19,11 @@ export const appCss = `/**
   pointer-events: none;
   z-index: 0;
   overflow: hidden;
+  background:
+    radial-gradient(circle at 18% 14%, hsl(var(--primary) / 0.14), transparent 26%),
+    radial-gradient(circle at 82% 12%, hsl(var(--accent) / 0.12), transparent 22%),
+    radial-gradient(circle at 50% 100%, hsl(220 60% 7% / 0.9), transparent 48%),
+    linear-gradient(180deg, hsl(220 50% 4%), hsl(var(--background)) 42%, hsl(223 47% 3%));
 }
 
 .cm-app-shell__grid,
@@ -27,24 +34,26 @@ export const appCss = `/**
 }
 
 .cm-app-shell__grid {
-  background-size: 40px 40px;
+  background-size: 48px 48px;
   background-image:
-    linear-gradient(to right, hsl(217 33% 17% / 0.3) 1px, transparent 1px),
-    linear-gradient(to bottom, hsl(217 33% 17% / 0.3) 1px, transparent 1px);
+    linear-gradient(to right, hsl(188 95% 43% / 0.08) 1px, transparent 1px),
+    linear-gradient(to bottom, hsl(188 95% 43% / 0.08) 1px, transparent 1px);
   transition: transform 140ms linear;
+  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0.16));
 }
 
 .cm-app-shell__gradient {
   background-image:
-    radial-gradient(circle at 50% 0%, hsl(270 60% 10% / 0.2), transparent 70%),
-    linear-gradient(to bottom, transparent, hsl(var(--background)));
+    radial-gradient(circle at 50% 0%, hsl(var(--primary) / 0.08), transparent 38%),
+    radial-gradient(circle at 55% 18%, hsl(var(--accent) / 0.08), transparent 30%),
+    linear-gradient(180deg, transparent 0%, hsl(var(--background) / 0.18) 36%, hsl(var(--background)) 100%);
 }
 
 .cm-app-shell__scanline {
   top: -100px;
   height: 100px;
-  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, hsl(188 95% 43% / 0.05) 50%, rgba(0, 0, 0, 0) 100%);
-  opacity: 0.1;
+  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, hsl(188 95% 43% / 0.07) 50%, rgba(0, 0, 0, 0) 100%);
+  opacity: 0.22;
   animation: cm-app-scanline 8s linear infinite;
 }
 
@@ -61,7 +70,7 @@ export const appCss = `/**
 .cm-app-shell__content {
   position: relative;
   z-index: 1;
-  min-height: 100vh;
+  min-height: 100dvh;
 }
 `;
 //# sourceMappingURL=styles.js.map

package/dist/app/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/app/styles.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiErB,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/app/styles.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0ErB,CAAC"}

package/dist/css/agents.css

@@ -6,13 +6,14 @@
 .cm-agent-card {
   display: grid;
   grid-template-columns: minmax(0, 1fr);
-  gap: 1rem;
-  border-radius: 0.65rem;
-  border: 1px solid hsl(var(--border) / 0.75);
-  background: linear-gradient(145deg, hsl(var(--card) / 0.82), hsl(var(--card) / 0.48));
+  gap: 0.85rem;
+  border-radius: max(var(--radius, 0.25rem), 0.3rem);
+  border: 1px solid hsl(var(--border) / 0.84);
+  background:
+    linear-gradient(180deg, hsl(var(--card) / 0.96), hsl(var(--card) / 0.78));
   box-shadow:
-    0 4px 24px -1px hsl(0 0% 0% / 0.3),
-    inset 0 1px 0 hsl(0 0% 100% / 0.05);
+    0 18px 40px hsl(240 30% 2% / 0.24),
+    inset 0 1px 0 hsl(0 0% 100% / 0.04);
   overflow: hidden;
 }
 
@@ -27,7 +28,7 @@
   transform: translateY(-2px);
   border-color: hsl(var(--primary) / 0.45);
   box-shadow:
-    0 16px 36px hsl(240 30% 2% / 0.28),
+    0 18px 36px hsl(240 30% 2% / 0.32),
     0 0 24px hsl(var(--primary) / 0.14),
     inset 0 1px 0 hsl(0 0% 100% / 0.05);
 }
@@ -42,8 +43,8 @@
 
 .cm-agent-card__main {
   display: grid;
-  gap: 1rem;
-  padding: 1.2rem;
+  gap: 0.9rem;
+  padding: 1rem;
 }
 
 .cm-agent-card__header {
@@ -55,13 +56,15 @@
 .cm-agent-card__avatar {
   width: 3.5rem;
   height: 3.5rem;
-  border-radius: 999px;
-  border: 2px solid hsl(var(--primary) / 0.24);
-  background: radial-gradient(circle, hsl(var(--primary) / 0.12), transparent 72%);
+  border-radius: max(var(--radius, 0.25rem), 0.35rem);
+  border: 1px solid hsl(var(--primary) / 0.28);
+  background:
+    linear-gradient(180deg, hsl(var(--background) / 0.92), hsl(var(--muted) / 0.34));
   display: grid;
   place-items: center;
   flex-shrink: 0;
   overflow: hidden;
+  box-shadow: inset 0 0 0 1px hsl(var(--primary) / 0.08);
 }
 
 .cm-agent-card__avatar-image {
@@ -73,9 +76,9 @@
 .cm-agent-card__avatar-fallback {
   font-family: var(--font-mono), monospace;
   color: hsl(var(--primary));
-  font-size: 1rem;
+  font-size: 0.88rem;
   font-weight: 700;
-  letter-spacing: 0.06em;
+  letter-spacing: 0.14em;
   text-transform: uppercase;
 }
 
@@ -107,8 +110,8 @@
 
 .cm-agent-card__description {
   color: hsl(var(--muted-foreground));
-  font-size: 0.86rem;
-  line-height: 1.55;
+  font-size: 0.84rem;
+  line-height: 1.48;
 }
 
 .cm-agent-card__badges,
@@ -129,8 +132,11 @@
   border: 1px solid hsl(var(--border) / 0.72);
   background: hsl(var(--muted) / 0.28);
   color: hsl(var(--muted-foreground));
-  font-size: 0.72rem;
+  font-family: var(--font-mono), monospace;
+  font-size: 0.64rem;
+  letter-spacing: 0.08em;
   line-height: 1;
+  text-transform: uppercase;
 }
 
 .cm-agent-card__badge-icon {
@@ -180,8 +186,8 @@
   grid-template-columns: auto minmax(0, 1fr);
   gap: 0.6rem;
   align-items: center;
-  padding: 0.8rem 0.9rem;
-  border-radius: 0.5rem;
+  padding: 0.72rem 0.8rem;
+  border-radius: var(--radius, 0.25rem);
   border: 1px solid hsl(var(--border) / 0.65);
   background: hsl(var(--background) / 0.5);
 }
@@ -204,8 +210,9 @@
 .cm-agent-card__tags-title,
 .cm-agent-card__meta-label {
   color: hsl(var(--muted-foreground));
-  font-size: 0.68rem;
-  letter-spacing: 0.08em;
+  font-family: var(--font-mono), monospace;
+  font-size: 0.62rem;
+  letter-spacing: 0.12em;
   text-transform: uppercase;
 }
 
@@ -214,7 +221,7 @@
 .cm-agent-card__meta-value {
   color: hsl(var(--foreground));
   font-family: var(--font-mono), monospace;
-  font-size: 0.86rem;
+  font-size: 0.8rem;
   line-height: 1.2;
   overflow-wrap: anywhere;
 }
@@ -249,10 +256,11 @@
   grid-template-columns: auto minmax(0, 1fr);
   gap: 0.7rem;
   align-items: center;
-  padding: 0.95rem 1rem;
-  border-radius: 0.5rem;
+  padding: 0.85rem 0.95rem;
+  border-radius: var(--radius, 0.25rem);
   border: 1px solid hsl(var(--border) / 0.72);
-  background: linear-gradient(135deg, hsl(var(--primary) / 0.12), transparent 68%);
+  background:
+    linear-gradient(135deg, hsl(var(--primary) / 0.11), transparent 68%);
 }
 
 .cm-agent-card__focus-icon {
@@ -310,7 +318,7 @@
   gap: 0.6rem;
   align-items: center;
   padding: 0.65rem 0.75rem;
-  border-radius: 0.45rem;
+  border-radius: var(--radius, 0.25rem);
   border: 1px solid hsl(var(--border) / 0.65);
   background: hsl(var(--background) / 0.42);
 }
@@ -342,7 +350,7 @@
   display: flex;
   align-items: flex-start;
   gap: 0.55rem;
-  padding: 1.2rem 1.2rem 1.2rem 0;
+  padding: 1rem 1rem 1rem 0;
 }
 
 .cm-agent-card__action-stack {
@@ -357,7 +365,7 @@
 }
 
 .cm-agent-card__skeleton {
-  border-radius: 0.45rem;
+  border-radius: var(--radius, 0.25rem);
   background: linear-gradient(90deg, hsl(var(--muted) / 0.55), hsl(var(--muted) / 0.8), hsl(var(--muted) / 0.55));
   background-size: 220% 100%;
   animation: cm-agent-card-shimmer 1.6s linear infinite;
@@ -366,7 +374,7 @@
 .cm-agent-card__skeleton--avatar {
   width: 3.5rem;
   height: 3.5rem;
-  border-radius: 999px;
+  border-radius: max(var(--radius, 0.25rem), 0.35rem);
 }
 
 .cm-agent-card__skeleton--title {

package/dist/css/app.css

@@ -5,10 +5,12 @@
 
 .cm-app-shell {
   position: relative;
-  min-height: 100vh;
+  min-height: 100dvh;
   background: hsl(var(--background));
   color: hsl(var(--foreground));
   overflow-x: hidden;
+  overflow-y: hidden;
+  isolation: isolate;
 }
 
 .cm-app-shell__backdrop {
@@ -17,6 +19,11 @@
   pointer-events: none;
   z-index: 0;
   overflow: hidden;
+  background:
+    radial-gradient(circle at 18% 14%, hsl(var(--primary) / 0.14), transparent 26%),
+    radial-gradient(circle at 82% 12%, hsl(var(--accent) / 0.12), transparent 22%),
+    radial-gradient(circle at 50% 100%, hsl(220 60% 7% / 0.9), transparent 48%),
+    linear-gradient(180deg, hsl(220 50% 4%), hsl(var(--background)) 42%, hsl(223 47% 3%));
 }
 
 .cm-app-shell__grid,
@@ -27,24 +34,26 @@
 }
 
 .cm-app-shell__grid {
-  background-size: 40px 40px;
+  background-size: 48px 48px;
   background-image:
-    linear-gradient(to right, hsl(217 33% 17% / 0.3) 1px, transparent 1px),
-    linear-gradient(to bottom, hsl(217 33% 17% / 0.3) 1px, transparent 1px);
+    linear-gradient(to right, hsl(188 95% 43% / 0.08) 1px, transparent 1px),
+    linear-gradient(to bottom, hsl(188 95% 43% / 0.08) 1px, transparent 1px);
   transition: transform 140ms linear;
+  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0.16));
 }
 
 .cm-app-shell__gradient {
   background-image:
-    radial-gradient(circle at 50% 0%, hsl(270 60% 10% / 0.2), transparent 70%),
-    linear-gradient(to bottom, transparent, hsl(var(--background)));
+    radial-gradient(circle at 50% 0%, hsl(var(--primary) / 0.08), transparent 38%),
+    radial-gradient(circle at 55% 18%, hsl(var(--accent) / 0.08), transparent 30%),
+    linear-gradient(180deg, transparent 0%, hsl(var(--background) / 0.18) 36%, hsl(var(--background)) 100%);
 }
 
 .cm-app-shell__scanline {
   top: -100px;
   height: 100px;
-  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, hsl(188 95% 43% / 0.05) 50%, rgba(0, 0, 0, 0) 100%);
-  opacity: 0.1;
+  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, hsl(188 95% 43% / 0.07) 50%, rgba(0, 0, 0, 0) 100%);
+  opacity: 0.22;
   animation: cm-app-scanline 8s linear infinite;
 }
 
@@ -61,5 +70,5 @@
 .cm-app-shell__content {
   position: relative;
   z-index: 1;
-  min-height: 100vh;
+  min-height: 100dvh;
 }

package/dist/css/index.d.ts

@@ -12,5 +12,5 @@ export declare function generateRadiusCss(): string;
 export declare const baseTokensCss: string;
 export declare const darkThemeCss: string;
 export declare const lightThemeCss: string;
-export declare const indexCss = "/**\n * Compose.Market Theme System\n * @compose-market/theme/css\n * \n * Import this file for the complete theme (dark by default).\n * For light mode support, also import ./light.css\n */\n\n@import './tokens.css';\n@import './dark.css';\n@import './shell.css';\n";
+export declare const indexCss = "/**\n * Compose.Market Theme System\n * @compose-market/theme/css\n * \n * Import this file for the complete theme (dark by default).\n * For light mode support, also import ./light.css\n */\n\n@import './tokens.css';\n@import './dark.css';\n@import './shell.css';\n@import './effects.css';\n@import './app.css';\n@import './agents.css';\n@import './session.css';\n";
 //# sourceMappingURL=index.d.ts.map

package/dist/css/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,SAAS,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAanF;AAED,wBAAgB,eAAe,IAAI,MAAM,CASxC;AAED,wBAAgB,iBAAiB,IAAI,MAAM,CAS1C;AAED,eAAO,MAAM,aAAa,QAazB,CAAC;AAEF,eAAO,MAAM,YAAY,QAaxB,CAAC;AAEF,eAAO,MAAM,aAAa,QAiBzB,CAAC;AAEF,eAAO,MAAM,QAAQ,+QAWpB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,SAAS,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAanF;AAED,wBAAgB,eAAe,IAAI,MAAM,CASxC;AAED,wBAAgB,iBAAiB,IAAI,MAAM,CAS1C;AAED,eAAO,MAAM,aAAa,QAazB,CAAC;AAEF,eAAO,MAAM,YAAY,QAaxB,CAAC;AAEF,eAAO,MAAM,aAAa,QAiBzB,CAAC;AAEF,eAAO,MAAM,QAAQ,kXAepB,CAAC"}

package/dist/css/index.js

@@ -93,5 +93,9 @@ export const indexCss = `/**
 @import './tokens.css';
 @import './dark.css';
 @import './shell.css';
+@import './effects.css';
+@import './app.css';
+@import './agents.css';
+@import './session.css';
 `;
 //# sourceMappingURL=index.js.map

package/dist/css/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,UAAU,gBAAgB,CAAC,KAAuB,EAAE,SAAiB;IACzE,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,4BAA4B,SAAS,KAAK,CAAC,CAAC;IACvD,KAAK,CAAC,IAAI,CAAC,4CAA4C,CAAC,CAAC;IACzD,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAEf,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QACjD,MAAM,UAAU,GAAG,KAAK,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC;QACvE,KAAK,CAAC,IAAI,CAAC,KAAK,UAAU,KAAK,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,eAAe;IAC7B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC/B,KAAK,MAAM,IAAI,IAAI,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC;QAC/C,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACnE,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,iBAAiB;IAC/B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;IAClC,KAAK,MAAM,CAAC,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;QACtC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,eAAe,EAAE;;EAEjB,iBAAiB,EAAE;;CAEpB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;EAS1B,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC;;;;;;EAMrC,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;;CAEtE,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG;;;;;;;;;;;CAWvB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/css/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,UAAU,gBAAgB,CAAC,KAAuB,EAAE,SAAiB;IACzE,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,4BAA4B,SAAS,KAAK,CAAC,CAAC;IACvD,KAAK,CAAC,IAAI,CAAC,4CAA4C,CAAC,CAAC;IACzD,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAEf,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QACjD,MAAM,UAAU,GAAG,KAAK,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC;QACvE,KAAK,CAAC,IAAI,CAAC,KAAK,UAAU,KAAK,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,eAAe;IAC7B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC/B,KAAK,MAAM,IAAI,IAAI,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC;QAC/C,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACnE,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,UAAU,iBAAiB;IAC/B,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;IAClC,KAAK,MAAM,CAAC,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;QACtC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC1B,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,eAAe,EAAE;;EAEjB,iBAAiB,EAAE;;CAEpB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;EAS1B,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG;;;;;;;;;EAS3B,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC;;;;;;EAMrC,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;;CAEtE,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG;;;;;;;;;;;;;;;CAevB,CAAC"}