@compose-market/theme 0.1.4 → 0.1.6

package/dist/css/agents.css

@@ -1,641 +1,143 @@
 /**
- * Compose.Market Agent Card
+ * Compose.Market Agent Card compatibility layer
  * @compose-market/theme/css/agents
  */
 
 .cm-agent-card {
-  container-type: inline-size;
-  display: grid;
-  grid-template-columns: minmax(0, 1fr);
-  width: 100%;
-  max-width: 100%;
-  min-width: 0;
-  gap: 0.85rem;
-  border-radius: 14px;
-  border: 1px solid hsl(var(--primary) / 0.18);
-  background:
-    linear-gradient(145deg, hsl(226 21% 23% / 0.42), hsl(221 50% 9% / 0.32)),
-    radial-gradient(circle at 18% 0%, hsl(var(--primary) / 0.08), transparent 34%),
-    hsl(224 36% 13% / 0.24);
-  box-shadow:
-    0 0 34px hsl(var(--primary) / 0.055),
-    inset 0 1px 0 hsl(0 0% 100% / 0.06);
-  overflow: hidden;
-  backdrop-filter: blur(16px) saturate(1.12);
-}
-
-.cm-agent-card--interactive {
-  cursor: pointer;
-  transition:
-    transform 180ms ease,
-    border-color 180ms ease,
-    box-shadow 180ms ease;
-}
-
-.cm-agent-card--interactive:hover {
-  transform: translateY(-2px);
-  border-color: hsl(var(--primary) / 0.45);
-  box-shadow:
-    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);
-}
-
-.cm-agent-card--interactive:focus-visible {
-  outline: 2px solid hsl(var(--primary) / 0.72);
-  outline-offset: 3px;
-}
-
-.cm-agent-card--running {
-  border-color: hsl(142 71% 45% / 0.48);
-  box-shadow:
-    0 10px 30px hsl(142 71% 45% / 0.08),
-    0 0 24px hsl(142 71% 45% / 0.12),
-    inset 0 1px 0 hsl(0 0% 100% / 0.05);
-}
-
-.cm-agent-card__main {
-  display: grid;
-  gap: 0.9rem;
-  padding: 1rem;
-  min-width: 0;
-  max-width: 100%;
-}
-
-.cm-agent-card__header {
-  display: flex;
-  align-items: flex-start;
-  gap: 1rem;
-  min-width: 0;
-  max-width: 100%;
-}
-
-.cm-agent-card__avatar {
-  width: 3.5rem;
-  height: 3.5rem;
-  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 {
-  width: 100%;
   height: 100%;
-  object-fit: cover;
-}
-
-.cm-agent-card__avatar-fallback {
-  font-family: var(--font-mono), monospace;
-  color: hsl(var(--primary));
-  font-size: 0.88rem;
-  font-weight: 700;
-  letter-spacing: 0.14em;
-  text-transform: uppercase;
-}
-
-.cm-agent-card__copy {
-  display: grid;
-  gap: 0.5rem;
-  min-width: 0;
-  max-width: 100%;
-  flex: 1;
-}
-
-.cm-agent-card__title-row {
-  display: flex;
-  align-items: flex-start;
-  gap: 0.6rem;
-  min-width: 0;
-  max-width: 100%;
-}
-
-.cm-agent-card__title {
-  font-family: var(--font-display), sans-serif;
-  font-size: 1.05rem;
-  line-height: 1.1;
-  color: hsl(var(--foreground));
-  min-width: 0;
-  max-width: 100%;
-  overflow-wrap: anywhere;
-}
-
-.cm-agent-card__header-action {
-  margin-left: auto;
-  flex-shrink: 0;
-}
-
-.cm-agent-card__description {
-  color: hsl(var(--muted-foreground));
-  font-size: 0.84rem;
-  line-height: 1.48;
-  max-width: 100%;
-  min-width: 0;
-  overflow-wrap: anywhere;
-}
-
-.cm-agent-card__badges,
-.cm-agent-card__tags {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.45rem;
-}
-
-.cm-agent-card__badge,
-.cm-agent-card__tag {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.35rem;
-  min-height: 1.7rem;
-  padding: 0 0.7rem;
-  border-radius: 999px;
-  border: 1px solid hsl(var(--border) / 0.72);
-  background: hsl(var(--muted) / 0.28);
-  color: hsl(var(--muted-foreground));
-  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 {
-  display: inline-flex;
-  align-items: center;
-}
-
-.cm-agent-card__badge[data-tone="cyan"],
-.cm-agent-card__tag {
-  border-color: hsl(var(--primary) / 0.28);
-  background: hsl(var(--primary) / 0.12);
-  color: hsl(var(--primary));
-}
-
-.cm-agent-card__badge[data-tone="green"] {
-  border-color: hsl(142 71% 45% / 0.28);
-  background: hsl(142 71% 45% / 0.12);
-  color: hsl(142 71% 45%);
-}
-
-.cm-agent-card__badge[data-tone="fuchsia"] {
-  border-color: hsl(292 85% 55% / 0.28);
-  background: hsl(292 85% 55% / 0.12);
-  color: hsl(292 85% 55%);
-}
-
-.cm-agent-card__badge[data-tone="warning"] {
-  border-color: hsl(42 100% 48% / 0.28);
-  background: hsl(42 100% 48% / 0.12);
-  color: hsl(42 100% 48%);
-}
-
-.cm-agent-card__badge[data-tone="danger"] {
-  border-color: hsl(var(--destructive) / 0.28);
-  background: hsl(var(--destructive) / 0.12);
-  color: hsl(var(--destructive));
-}
-
-.cm-agent-card__metrics {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(8.7rem, 1fr));
-  gap: 0.6rem;
-}
-
-.cm-agent-card__metric {
-  display: grid;
-  grid-template-columns: auto minmax(0, 1fr);
-  gap: 0.6rem;
-  align-items: center;
-  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);
-}
-
-.cm-agent-card__metric-icon {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  color: hsl(var(--primary));
-}
-
-.cm-agent-card__metric-copy {
-  display: grid;
-  gap: 0.14rem;
-  min-width: 0;
-}
-
-.cm-agent-card__metric-label,
-.cm-agent-card__focus-label,
-.cm-agent-card__tags-title,
-.cm-agent-card__meta-label {
-  color: hsl(var(--muted-foreground));
-  font-family: var(--font-mono), monospace;
-  font-size: 0.62rem;
-  letter-spacing: 0.12em;
-  text-transform: uppercase;
-}
-
-.cm-agent-card__metric-value,
-.cm-agent-card__focus-value,
-.cm-agent-card__meta-value {
-  color: hsl(var(--foreground));
-  font-family: var(--font-mono), monospace;
-  font-size: 0.8rem;
-  line-height: 1.2;
-  overflow-wrap: anywhere;
-}
-
-.cm-agent-card__metric[data-tone="green"] .cm-agent-card__metric-icon,
-.cm-agent-card__metric[data-tone="green"] .cm-agent-card__metric-value {
-  color: hsl(142 71% 45%);
-}
-
-.cm-agent-card__metric[data-tone="cyan"] .cm-agent-card__metric-icon,
-.cm-agent-card__metric[data-tone="cyan"] .cm-agent-card__metric-value {
-  color: hsl(var(--primary));
-}
-
-.cm-agent-card__metric[data-tone="fuchsia"] .cm-agent-card__metric-icon,
-.cm-agent-card__metric[data-tone="fuchsia"] .cm-agent-card__metric-value {
-  color: hsl(292 85% 55%);
-}
-
-.cm-agent-card__metric[data-tone="warning"] .cm-agent-card__metric-icon,
-.cm-agent-card__metric[data-tone="warning"] .cm-agent-card__metric-value {
-  color: hsl(42 100% 48%);
-}
-
-.cm-agent-card__metric[data-tone="danger"] .cm-agent-card__metric-icon,
-.cm-agent-card__metric[data-tone="danger"] .cm-agent-card__metric-value {
-  color: hsl(var(--destructive));
-}
-
-.cm-agent-card__focus {
-  display: grid;
-  grid-template-columns: auto minmax(0, 1fr);
-  gap: 0.7rem;
-  align-items: center;
-  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.11), transparent 68%);
-}
-
-.cm-agent-card__focus-icon {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  color: hsl(var(--primary));
-}
-
-.cm-agent-card__focus-copy,
-.cm-agent-card__tags-block {
-  display: grid;
-  gap: 0.35rem;
-}
-
-.cm-agent-card__meta {
-  display: grid;
-  gap: 0.55rem;
-}
-
-.cm-agent-card__meta-row {
-  display: flex;
-  align-items: flex-start;
-  justify-content: space-between;
-  gap: 1rem;
-}
-
-.cm-agent-card__footer {
-  padding-top: 0.9rem;
-  border-top: 1px solid hsl(var(--border) / 0.55);
-}
-
-.cm-agent-card__footer-stack {
-  display: grid;
-  gap: 0.8rem;
-}
-
-.cm-agent-card__endpoint,
-.cm-agent-card__creator {
-  display: grid;
-  gap: 0.45rem;
-}
-
-.cm-agent-card__endpoint-label,
-.cm-agent-card__creator-label {
-  color: hsl(var(--muted-foreground));
-  font-size: 0.68rem;
-  letter-spacing: 0.08em;
-  text-transform: uppercase;
-}
-
-.cm-agent-card__endpoint-row {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) auto;
-  gap: 0.6rem;
-  align-items: center;
-  padding: 0.65rem 0.75rem;
-  border-radius: var(--radius, 0.25rem);
-  border: 1px solid hsl(var(--border) / 0.65);
-  background: hsl(var(--background) / 0.42);
-}
-
-.cm-agent-card__endpoint-code,
-.cm-agent-card__creator-value {
-  color: hsl(var(--primary));
-  font-family: var(--font-mono), monospace;
-  font-size: 0.78rem;
-  overflow-wrap: anywhere;
-}
-
-.cm-agent-card__creator-value {
-  color: hsl(292 85% 55%);
-}
-
-.cm-agent-card__footer-link {
-  color: hsl(var(--primary));
-  font-size: 0.82rem;
-  font-weight: 600;
-  text-decoration: none;
-}
-
-.cm-agent-card__footer-link:hover {
-  text-decoration: underline;
-}
-
-.cm-agent-card--match-chat {
-  height: auto;
   min-height: 0;
-  max-height: 100%;
+  overflow: visible;
 }
 
-.cm-agent-card--match-chat > .cm-agent-card__main {
-  height: auto;
+.cm-agent-card--match-chat,
+.cm-agent-card--asset {
+  height: 100%;
   min-height: 0;
-  align-content: start;
-  overflow: visible;
+  max-height: none;
 }
 
 .cm-agent-card--market {
-  height: auto;
-  min-height: var(--cm-market-card-min-height, clamp(17rem, 30dvh, 20rem));
-}
-
-.cm-agent-card--market > .cm-agent-card__main {
-  display: grid;
-  grid-template-rows: auto auto auto auto;
-  height: auto;
+  height: 100%;
   min-height: 0;
-  gap: clamp(0.72rem, 1.45cqi, 0.95rem);
-  padding: clamp(0.82rem, 1.8cqi, 1.05rem);
-  align-content: start;
   overflow: visible;
 }
 
-.cm-agent-card--market .cm-agent-card__header {
-  gap: clamp(0.68rem, 1.55cqi, 0.9rem);
-  align-items: flex-start;
-}
-
-.cm-agent-card--market .cm-agent-card__avatar {
-  width: clamp(3rem, 9.2cqi, 3.45rem);
-  height: clamp(3rem, 9.2cqi, 3.45rem);
-}
-
-.cm-agent-card--market .cm-agent-card__copy {
-  gap: 0.38rem;
-}
-
-.cm-agent-card--market .cm-agent-card__title {
-  font-size: clamp(1.04rem, 2.72cqi, 1.18rem);
-  line-height: 1.12;
-}
-
-.cm-agent-card--market .cm-agent-card__identity {
-  gap: 0.26rem;
-}
-
-.cm-agent-card--market .cm-agent-card__identity-head {
-  flex-wrap: nowrap;
-}
-
-.cm-agent-card--market .cm-agent-card__identity-name,
-.cm-agent-card--market .cm-agent-card__identity-address,
-.cm-agent-card--market .cm-agent-card__model-name,
-.cm-agent-card--market .cm-agent-card__metric-value {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow-wrap: normal;
-  word-break: normal;
+.cm-agent-card--market > .cm-card__body {
+  height: 100%;
+  min-height: 0;
+  overflow: visible;
 }
 
-.cm-agent-card--market .cm-agent-card__model {
+.cm-agent-card__identity {
+  display: grid;
+  gap: 0.3rem;
+  min-width: 0;
   max-width: 100%;
-  font-size: clamp(0.72rem, 1.9cqi, 0.82rem);
 }
 
-.cm-agent-card--market .cm-agent-card__identity-meta {
+.cm-agent-card__identity-head {
   display: flex;
   align-items: center;
-  gap: 0.34rem;
+  gap: 0.42rem;
   min-width: 0;
   max-width: 100%;
   flex-wrap: nowrap;
 }
 
-.cm-agent-card--market .cm-agent-card__description {
-  font-size: clamp(0.9rem, 2.05cqi, 0.98rem);
-  line-height: 1.5;
+.cm-agent-card__identity-name {
   min-width: 0;
   max-width: 100%;
-}
-
-.cm-agent-card--market .cm-agent-card__badges,
-.cm-agent-card--market .cm-agent-card__tags {
-  gap: 0.34rem;
-  overflow: visible;
-}
-
-.cm-agent-card--market .cm-agent-card__badge,
-.cm-agent-card--market .cm-agent-card__tag {
-  min-height: clamp(1.65rem, 4.8cqi, 1.85rem);
-  padding: 0.34rem 0.62rem;
-  font-size: clamp(0.68rem, 1.72cqi, 0.76rem);
-  letter-spacing: 0.07em;
+  font-size: inherit;
+  line-height: inherit;
+  overflow: hidden;
+  text-overflow: ellipsis;
   white-space: nowrap;
 }
 
-.cm-agent-card--market .cm-agent-card__metrics {
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  gap: clamp(0.36rem, 1cqi, 0.52rem);
-}
-
-.cm-agent-card--market .cm-agent-card__metric {
-  min-width: 0;
-  min-height: clamp(3rem, 7.8cqi, 3.35rem);
-  gap: 0.45rem;
-  padding: clamp(0.56rem, 1.3cqi, 0.72rem);
-  border-color: hsl(var(--primary) / 0.15);
-  background:
-    radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.08), transparent 42%),
-    hsl(221 50% 9% / 0.34);
-}
-
-.cm-agent-card--market .cm-agent-card__metric-icon svg {
-  width: 0.92rem;
-  height: 0.92rem;
-}
-
-.cm-agent-card--market .cm-agent-card__metric-label {
-  font-size: clamp(0.62rem, 1.52cqi, 0.68rem);
-  letter-spacing: 0.08em;
-}
-
-.cm-agent-card--market .cm-agent-card__metric-value {
-  font-size: clamp(0.78rem, 1.85cqi, 0.88rem);
-}
-
-.cm-agent-card--market .cm-agent-card__tags-block {
-  align-self: stretch;
-  align-content: start;
-  gap: 0.42rem;
-  min-height: 0;
-  overflow: visible;
-}
-
-.cm-agent-card--market .cm-agent-card__tags-title {
-  display: block;
-}
-
-.cm-agent-card__metric,
-.cm-agent-card__metric-copy,
-.cm-agent-card__focus,
-.cm-agent-card__focus-copy,
-.cm-agent-card__tags-block,
-.cm-agent-card__footer,
-.cm-agent-card__footer-stack,
-.cm-agent-card__endpoint,
-.cm-agent-card__creator {
-  min-width: 0;
-  max-width: 100%;
-}
-
-.cm-agent-card__metric-value,
-.cm-agent-card__focus-value,
-.cm-agent-card__meta-value,
-.cm-agent-card__endpoint-code,
-.cm-agent-card__creator-value {
-  max-width: 100%;
-  min-width: 0;
-  white-space: normal;
+.cm-agent-card__identity-address {
+  color: hsl(var(--muted-foreground));
+  font-family: var(--font-mono), monospace;
+  font-size: 0.84rem;
+  font-weight: 500;
+  line-height: 1.2;
   overflow-wrap: anywhere;
-  word-break: break-word;
 }
 
-.cm-agent-card__identity {
+.cm-agent-card__identity-meta {
   display: grid;
-  gap: 0.32rem;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  align-items: center;
+  gap: 0.38rem;
+  width: 100%;
   min-width: 0;
   max-width: 100%;
 }
 
-.cm-agent-card__identity-head {
-  display: flex;
-  align-items: baseline;
-  gap: 0.45rem;
+.cm-agent-card__identity-meta > .cm-hint {
   min-width: 0;
+  width: 100%;
   max-width: 100%;
-  flex-wrap: wrap;
 }
 
-.cm-agent-card__identity-meta {
-  display: flex;
-  align-items: center;
-  gap: 0.38rem;
-  min-width: 0;
-  max-width: 100%;
-  flex-wrap: wrap;
+.cm-agent-card__identity-meta > .cm-hint > .cm-hint__trigger {
+  width: 100%;
 }
 
+.cm-agent-card__verified,
 .cm-agent-card__network {
-  display: inline-grid;
-  width: 1.28rem;
-  height: 1.28rem;
-  place-items: center;
-  flex: 0 0 auto;
-  border-radius: 999px;
-  border: 1px solid hsl(var(--primary) / 0.22);
-  background: hsl(var(--primary) / 0.08);
-  color: hsl(var(--primary));
-}
-
-.cm-agent-card__verified {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: 1.1rem;
-  height: 1.1rem;
   flex: 0 0 auto;
-  color: hsl(142 76% 54%);
+  width: 1.15rem;
+  height: 1.15rem;
 }
 
-.cm-agent-card__network svg {
-  width: 0.82rem;
-  height: 0.82rem;
+.cm-agent-card__verified {
+  border-radius: 999px;
+  background: hsl(142 76% 54%);
+  color: hsl(221 50% 9%);
 }
 
 .cm-agent-card__verified svg {
-  width: 1.08rem;
-  height: 1.08rem;
-  fill: hsl(142 76% 54% / 0.18);
-  stroke-width: 2.35;
-}
-
-.cm-agent-card__network-image {
-  width: 0.9rem;
-  height: 0.9rem;
-  object-fit: contain;
-  display: block;
+  width: 0.78rem;
+  height: 0.78rem;
+  stroke-width: 3.1;
 }
 
-.cm-agent-card__identity-name {
-  min-width: 0;
-  max-width: 100%;
-  overflow-wrap: anywhere;
+.cm-agent-card__network {
+  border: 0;
+  border-radius: 999px;
+  background: transparent;
 }
 
-.cm-agent-card__identity-address {
-  color: hsl(var(--muted-foreground));
-  font-family: var(--font-mono), monospace;
-  font-size: 0.76rem;
-  font-weight: 500;
-  line-height: 1.1;
+.cm-agent-card__network-image {
+  display: block;
+  width: 1.05rem;
+  height: 1.05rem;
+  object-fit: contain;
 }
 
 .cm-agent-card__model {
-  display: inline-flex;
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
   align-items: center;
-  gap: 0.28rem;
-  width: fit-content;
+  gap: 0.32rem;
+  min-width: 0;
+  width: 100%;
   max-width: 100%;
-  padding: 0.16rem 0.44rem;
+  min-height: 1.78rem;
+  max-height: 1.78rem;
+  padding: 0.22rem 0.52rem;
   border: 1px solid hsl(var(--primary) / 0.3);
   border-radius: 999px;
-  background: hsl(var(--primary) / 0.06);
+  background: hsl(var(--primary) / 0.08);
   color: hsl(var(--foreground));
   font-family: var(--font-mono), monospace;
   font-size: 0.76rem;
-  font-weight: 600;
+  font-weight: 650;
   line-height: 1.25;
+  overflow: hidden;
 }
 
 .cm-agent-card__model[data-tone="warning"] {
@@ -644,15 +146,10 @@
   color: hsl(42 100% 58%);
 }
 
-.cm-agent-card__model[data-tone="warning"] svg {
-  color: hsl(42 100% 58%);
-}
-
 .cm-agent-card__model svg {
-  width: 0.68rem;
-  height: 0.68rem;
-  flex-shrink: 0;
-  color: hsl(var(--primary));
+  width: 0.74rem;
+  height: 0.74rem;
+  flex: 0 0 auto;
 }
 
 .cm-agent-card__model-name {
@@ -663,187 +160,64 @@
   white-space: nowrap;
 }
 
-.cm-agent-card__badge,
-.cm-agent-card__tag {
-  max-width: 100%;
-  min-width: 0;
-  height: auto;
-  padding-top: 0.35rem;
-  padding-bottom: 0.35rem;
-  line-height: 1.2;
-  white-space: normal;
-  overflow-wrap: anywhere;
-}
-
-.cm-agent-card__endpoint-row {
+.cm-agent-card__footer-stack,
+.cm-agent-card__endpoint,
+.cm-agent-card__creator,
+.cm-agent-card__action-stack {
+  display: grid;
+  gap: 0.68rem;
   min-width: 0;
   max-width: 100%;
-  cursor: pointer;
-  text-align: left;
-}
-
-.cm-agent-card__endpoint-row:focus-visible {
-  outline: 2px solid hsl(var(--primary) / 0.75);
-  outline-offset: 2px;
-}
-
-.cm-agent-card__actions {
-  display: flex;
-  align-items: flex-start;
-  gap: 0.55rem;
-  padding: 1rem 1rem 1rem 0;
 }
 
 .cm-agent-card__action-stack {
   display: flex;
   align-items: flex-start;
-  gap: 0.55rem;
   flex-wrap: wrap;
+  gap: 0.55rem;
 }
 
-.cm-agent-card--skeleton {
-  pointer-events: none;
+.cm-agent-card__endpoint-label,
+.cm-agent-card__creator-label {
+  color: hsl(var(--muted-foreground));
+  font-family: var(--font-mono), monospace;
+  font-size: 0.7rem;
+  letter-spacing: 0.08em;
+  line-height: 1.25;
+  text-transform: uppercase;
 }
 
-.cm-agent-card__skeleton {
+.cm-agent-card__endpoint-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  gap: 0.6rem;
+  align-items: center;
+  min-width: 0;
+  max-width: 100%;
+  padding: 0.65rem 0.75rem;
+  border: 1px solid hsl(var(--border) / 0.65);
   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;
-}
-
-.cm-agent-card__skeleton--avatar {
-  width: 3.5rem;
-  height: 3.5rem;
-  border-radius: max(var(--radius, 0.25rem), 0.35rem);
-}
-
-.cm-agent-card__skeleton--title {
-  height: 1.1rem;
-  width: 10rem;
-}
-
-.cm-agent-card__skeleton--line {
-  height: 0.82rem;
-  width: 100%;
-}
-
-.cm-agent-card__skeleton--line.short {
-  width: 76%;
-}
-
-.cm-agent-card__skeleton--metric {
-  min-height: 4.4rem;
-}
-
-.cm-agent-card__skeleton--focus {
-  min-height: 4.3rem;
-}
-
-.cm-agent-card__skeleton--tags {
-  min-height: 5.6rem;
-}
-
-.cm-agent-card__skeleton--footer {
-  min-height: 4.2rem;
-}
-
-@keyframes cm-agent-card-shimmer {
-  0% {
-    background-position: 200% 0;
-  }
-
-  100% {
-    background-position: -200% 0;
-  }
-}
-
-@media (max-width: 720px) {
-  .cm-agent-card__main {
-    gap: 0.65rem;
-    padding: 0.85rem;
-  }
-
-  .cm-agent-card__avatar {
-    width: 2.5rem;
-    height: 2.5rem;
-  }
-
-  .cm-agent-card__title {
-    font-size: 1rem;
-  }
-
-  .cm-agent-card__description {
-    font-size: 0.9rem;
-    line-height: 1.45;
-  }
-
-  .cm-agent-card__metrics {
-    grid-template-columns: repeat(2, 1fr);
-  }
-
-  .cm-agent-card__metric {
-    padding: 0.55rem 0.7rem;
-  }
-
-  .cm-agent-card__focus {
-    padding: 0.7rem 0.8rem;
-  }
-
-  .cm-agent-card__badges,
-  .cm-agent-card__tags {
-    gap: 0.3rem;
-  }
-
-  .cm-agent-card__badge,
-  .cm-agent-card__tag {
-    min-height: 1.65rem;
-    padding: 0 0.5rem;
-    font-size: 0.72rem;
-  }
-
-  .cm-agent-card__endpoint-code,
-  .cm-agent-card__creator-value {
-    font-size: 0.68rem;
-  }
-
-  .cm-agent-card__actions {
-    padding: 0 0.85rem 0.85rem;
-    justify-content: flex-end;
-    flex-wrap: wrap;
-  }
+  background: hsl(var(--background) / 0.42);
+  cursor: pointer;
 }
 
-@container (max-width: 26rem) {
-  .cm-agent-card__metrics {
+@container (max-width: 22rem) {
+  .cm-agent-card__identity-meta {
     grid-template-columns: minmax(0, 1fr);
   }
-
-  .cm-agent-card--market .cm-agent-card__metrics {
-    grid-template-columns: repeat(3, minmax(0, 1fr));
-  }
-
-  .cm-agent-card__header {
-    gap: 0.7rem;
-  }
-
-  .cm-agent-card__avatar {
-    width: 2.75rem;
-    height: 2.75rem;
-  }
 }
 
-@container (max-width: 21rem) {
-  .cm-agent-card--market .cm-agent-card__main {
-    gap: 0.62rem;
-    padding: 0.75rem;
-  }
-
-  .cm-agent-card--market .cm-agent-card__description {
-    font-size: 0.88rem;
-  }
+.cm-agent-card__endpoint-code,
+.cm-agent-card__creator-value,
+.cm-agent-card__meta-value {
+  min-width: 0;
+  max-width: 100%;
+  color: hsl(var(--primary));
+  font-family: var(--font-mono), monospace;
+  font-size: 0.8rem;
+  overflow-wrap: anywhere;
+}
 
-  .cm-agent-card__endpoint-row {
-    grid-template-columns: minmax(0, 1fr);
-  }
+.cm-agent-card__creator-value {
+  color: hsl(var(--accent));
 }