@compose-market/theme 0.0.97 → 0.0.98

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  container-type: inline-size;\n  display: grid;\n  grid-template-columns: minmax(0, 1fr);\n  width: 100%;\n  max-width: 100%;\n  min-width: 0;\n  gap: 0.85rem;\n  border-radius: 14px;\n  border: 1px solid hsl(var(--primary) / 0.18);\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.42), hsl(221 50% 9% / 0.32)),\n    radial-gradient(circle at 18% 0%, hsl(var(--primary) / 0.08), transparent 34%),\n    hsl(224 36% 13% / 0.24);\n  box-shadow:\n    0 0 34px hsl(var(--primary) / 0.055),\n    inset 0 1px 0 hsl(0 0% 100% / 0.06);\n  overflow: hidden;\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-agent-card--interactive {\n  cursor: pointer;\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--interactive:focus-visible {\n  outline: 2px solid hsl(var(--primary) / 0.72);\n  outline-offset: 3px;\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  min-width: 0;\n  max-width: 100%;\n}\n\n.cm-agent-card__header {\n  display: flex;\n  align-items: flex-start;\n  gap: 1rem;\n  min-width: 0;\n  max-width: 100%;\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  max-width: 100%;\n  flex: 1;\n}\n\n.cm-agent-card__title-row {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.6rem;\n  min-width: 0;\n  max-width: 100%;\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  max-width: 100%;\n  overflow-wrap: anywhere;\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  max-width: 100%;\n  min-width: 0;\n  overflow-wrap: anywhere;\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--match-chat {\n  height: 100%;\n  min-height: 0;\n}\n\n.cm-agent-card--match-chat > .cm-agent-card__main {\n  height: 100%;\n  min-height: 0;\n  align-content: start;\n  overflow: hidden;\n}\n\n.cm-agent-card--market,\n.cm-agent-card--market-full {\n  height: var(--cm-market-card-height, clamp(26rem, 46vw, 32rem));\n  min-height: 0;\n}\n\n.cm-agent-card--market > .cm-agent-card__main,\n.cm-agent-card--market-full > .cm-agent-card__main {\n  display: grid;\n  grid-template-rows: auto auto auto minmax(0, 1fr) auto;\n  height: 100%;\n  min-height: 0;\n  gap: clamp(0.64rem, 1.45cqi, 0.9rem);\n  padding: clamp(0.82rem, 1.85cqi, 1.05rem);\n  align-content: stretch;\n  overflow: hidden;\n}\n\n.cm-agent-card--market .cm-agent-card__header,\n.cm-agent-card--market-full .cm-agent-card__header {\n  gap: clamp(0.68rem, 1.55cqi, 0.9rem);\n  align-items: flex-start;\n}\n\n.cm-agent-card--market .cm-agent-card__avatar,\n.cm-agent-card--market-full .cm-agent-card__avatar {\n  width: clamp(2.65rem, 8.5cqi, 3.25rem);\n  height: clamp(2.65rem, 8.5cqi, 3.25rem);\n}\n\n.cm-agent-card--market .cm-agent-card__copy,\n.cm-agent-card--market-full .cm-agent-card__copy {\n  gap: 0.38rem;\n}\n\n.cm-agent-card--market .cm-agent-card__title,\n.cm-agent-card--market-full .cm-agent-card__title {\n  font-size: clamp(0.94rem, 2.55cqi, 1.08rem);\n  line-height: 1.12;\n}\n\n.cm-agent-card--market .cm-agent-card__identity,\n.cm-agent-card--market-full .cm-agent-card__identity {\n  gap: 0.26rem;\n}\n\n.cm-agent-card--market .cm-agent-card__identity-head,\n.cm-agent-card--market-full .cm-agent-card__identity-head {\n  flex-wrap: wrap;\n}\n\n.cm-agent-card--market .cm-agent-card__identity-name,\n.cm-agent-card--market-full .cm-agent-card__identity-name,\n.cm-agent-card--market .cm-agent-card__identity-address,\n.cm-agent-card--market-full .cm-agent-card__identity-address,\n.cm-agent-card--market .cm-agent-card__model-name,\n.cm-agent-card--market-full .cm-agent-card__model-name,\n.cm-agent-card--market .cm-agent-card__metric-value,\n.cm-agent-card--market-full .cm-agent-card__metric-value,\n.cm-agent-card--market .cm-agent-card__endpoint-code,\n.cm-agent-card--market-full .cm-agent-card__endpoint-code,\n.cm-agent-card--market .cm-agent-card__creator-value,\n.cm-agent-card--market-full .cm-agent-card__creator-value {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow-wrap: normal;\n  word-break: normal;\n}\n\n.cm-agent-card--market .cm-agent-card__model,\n.cm-agent-card--market-full .cm-agent-card__model {\n  max-width: 100%;\n  font-size: clamp(0.58rem, 1.85cqi, 0.66rem);\n}\n\n.cm-agent-card--market .cm-agent-card__description,\n.cm-agent-card--market-full .cm-agent-card__description {\n  display: -webkit-box;\n  min-height: calc(3 * 1.36em);\n  max-height: calc(3 * 1.36em);\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 3;\n  font-size: clamp(0.72rem, 1.9cqi, 0.82rem);\n  line-height: 1.36;\n}\n\n.cm-agent-card--market .cm-agent-card__badges,\n.cm-agent-card--market-full .cm-agent-card__badges,\n.cm-agent-card--market .cm-agent-card__tags,\n.cm-agent-card--market-full .cm-agent-card__tags {\n  gap: 0.34rem;\n  overflow: hidden;\n}\n\n.cm-agent-card--market .cm-agent-card__badges,\n.cm-agent-card--market-full .cm-agent-card__badges {\n  max-height: 4.1rem;\n}\n\n.cm-agent-card--market .cm-agent-card__badge,\n.cm-agent-card--market-full .cm-agent-card__badge,\n.cm-agent-card--market .cm-agent-card__tag,\n.cm-agent-card--market-full .cm-agent-card__tag {\n  min-height: clamp(1.38rem, 4.6cqi, 1.62rem);\n  padding: 0.28rem 0.52rem;\n  font-size: clamp(0.54rem, 1.65cqi, 0.62rem);\n  letter-spacing: 0.07em;\n  white-space: nowrap;\n}\n\n.cm-agent-card--market .cm-agent-card__metrics,\n.cm-agent-card--market-full .cm-agent-card__metrics {\n  grid-template-columns: repeat(3, minmax(0, 1fr));\n  gap: clamp(0.36rem, 1cqi, 0.52rem);\n}\n\n.cm-agent-card--market .cm-agent-card__metric,\n.cm-agent-card--market-full .cm-agent-card__metric {\n  min-width: 0;\n  min-height: clamp(2.52rem, 7cqi, 3rem);\n  gap: 0.38rem;\n  padding: clamp(0.42rem, 1.2cqi, 0.58rem);\n  border-color: hsl(var(--primary) / 0.15);\n  background:\n    radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.08), transparent 42%),\n    hsl(221 50% 9% / 0.34);\n}\n\n.cm-agent-card--market .cm-agent-card__metric-icon svg,\n.cm-agent-card--market-full .cm-agent-card__metric-icon svg {\n  width: 0.78rem;\n  height: 0.78rem;\n}\n\n.cm-agent-card--market .cm-agent-card__metric-label,\n.cm-agent-card--market-full .cm-agent-card__metric-label {\n  font-size: clamp(0.48rem, 1.45cqi, 0.56rem);\n  letter-spacing: 0.08em;\n}\n\n.cm-agent-card--market .cm-agent-card__metric-value,\n.cm-agent-card--market-full .cm-agent-card__metric-value {\n  font-size: clamp(0.62rem, 1.75cqi, 0.72rem);\n}\n\n.cm-agent-card--market .cm-agent-card__tags-block,\n.cm-agent-card--market-full .cm-agent-card__tags-block {\n  align-self: stretch;\n  align-content: start;\n  gap: 0.34rem;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.cm-agent-card--market .cm-agent-card__tags-title,\n.cm-agent-card--market-full .cm-agent-card__tags-title {\n  display: block;\n}\n\n.cm-agent-card--market .cm-agent-card__footer,\n.cm-agent-card--market-full .cm-agent-card__footer {\n  padding-top: clamp(0.52rem, 1.2cqi, 0.74rem);\n}\n\n.cm-agent-card--market .cm-agent-card__footer-stack,\n.cm-agent-card--market-full .cm-agent-card__footer-stack {\n  grid-template-columns: minmax(0, 1fr) minmax(5rem, 0.42fr);\n  align-items: end;\n  gap: clamp(0.48rem, 1.25cqi, 0.68rem);\n}\n\n.cm-agent-card--market .cm-agent-card__endpoint,\n.cm-agent-card--market-full .cm-agent-card__endpoint,\n.cm-agent-card--market .cm-agent-card__creator,\n.cm-agent-card--market-full .cm-agent-card__creator {\n  gap: 0.34rem;\n  min-width: 0;\n}\n\n.cm-agent-card--market .cm-agent-card__endpoint-label,\n.cm-agent-card--market-full .cm-agent-card__endpoint-label,\n.cm-agent-card--market .cm-agent-card__creator-label,\n.cm-agent-card--market-full .cm-agent-card__creator-label {\n  display: block;\n}\n\n.cm-agent-card--market .cm-agent-card__endpoint-row,\n.cm-agent-card--market-full .cm-agent-card__endpoint-row {\n  min-height: 2.05rem;\n  padding: 0.32rem 0.42rem 0.32rem 0.56rem;\n  gap: 0.32rem;\n  border-color: hsl(var(--primary) / 0.15);\n}\n\n.cm-agent-card--market .cm-agent-card__creator-value,\n.cm-agent-card--market-full .cm-agent-card__creator-value,\n.cm-agent-card--market .cm-agent-card__endpoint-code,\n.cm-agent-card--market-full .cm-agent-card__endpoint-code {\n  font-size: clamp(0.58rem, 1.62cqi, 0.68rem);\n}\n\n.cm-agent-card--market .cm-agent-card__creator-value,\n.cm-agent-card--market-full .cm-agent-card__creator-value {\n  display: block;\n  text-align: right;\n}\n\n.cm-agent-card__metric,\n.cm-agent-card__metric-copy,\n.cm-agent-card__focus,\n.cm-agent-card__focus-copy,\n.cm-agent-card__tags-block,\n.cm-agent-card__footer,\n.cm-agent-card__footer-stack,\n.cm-agent-card__endpoint,\n.cm-agent-card__creator {\n  min-width: 0;\n  max-width: 100%;\n}\n\n.cm-agent-card__metric-value,\n.cm-agent-card__focus-value,\n.cm-agent-card__meta-value,\n.cm-agent-card__endpoint-code,\n.cm-agent-card__creator-value {\n  max-width: 100%;\n  min-width: 0;\n  white-space: normal;\n  overflow-wrap: anywhere;\n  word-break: break-word;\n}\n\n.cm-agent-card__identity {\n  display: grid;\n  gap: 0.32rem;\n  min-width: 0;\n  max-width: 100%;\n}\n\n.cm-agent-card__identity-head {\n  display: flex;\n  align-items: baseline;\n  gap: 0.45rem;\n  min-width: 0;\n  max-width: 100%;\n  flex-wrap: wrap;\n}\n\n.cm-agent-card__identity-name {\n  min-width: 0;\n  max-width: 100%;\n  overflow-wrap: anywhere;\n}\n\n.cm-agent-card__identity-address {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 500;\n  line-height: 1.1;\n}\n\n.cm-agent-card__model {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.28rem;\n  width: fit-content;\n  max-width: 100%;\n  padding: 0.16rem 0.44rem;\n  border: 1px solid hsl(var(--primary) / 0.3);\n  border-radius: 999px;\n  background: hsl(var(--primary) / 0.06);\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.66rem;\n  font-weight: 600;\n  line-height: 1.25;\n}\n\n.cm-agent-card__model svg {\n  width: 0.68rem;\n  height: 0.68rem;\n  flex-shrink: 0;\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__model-name {\n  min-width: 0;\n  max-width: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.cm-agent-card__badge,\n.cm-agent-card__tag {\n  max-width: 100%;\n  min-width: 0;\n  height: auto;\n  padding-top: 0.35rem;\n  padding-bottom: 0.35rem;\n  line-height: 1.2;\n  white-space: normal;\n  overflow-wrap: anywhere;\n}\n\n.cm-agent-card__endpoint-row {\n  min-width: 0;\n  max-width: 100%;\n  cursor: pointer;\n  text-align: left;\n}\n\n.cm-agent-card__endpoint-row:focus-visible {\n  outline: 2px solid hsl(var(--primary) / 0.75);\n  outline-offset: 2px;\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\n@container (max-width: 26rem) {\n  .cm-agent-card__metrics {\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  .cm-agent-card__header {\n    gap: 0.7rem;\n  }\n\n  .cm-agent-card__avatar {\n    width: 2.75rem;\n    height: 2.75rem;\n  }\n}\n\n@container (max-width: 21rem) {\n  .cm-agent-card__endpoint-row {\n    grid-template-columns: minmax(0, 1fr);\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  container-type: inline-size;\n  display: grid;\n  grid-template-columns: minmax(0, 1fr);\n  width: 100%;\n  max-width: 100%;\n  min-width: 0;\n  gap: 0.85rem;\n  border-radius: 14px;\n  border: 1px solid hsl(var(--primary) / 0.18);\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.42), hsl(221 50% 9% / 0.32)),\n    radial-gradient(circle at 18% 0%, hsl(var(--primary) / 0.08), transparent 34%),\n    hsl(224 36% 13% / 0.24);\n  box-shadow:\n    0 0 34px hsl(var(--primary) / 0.055),\n    inset 0 1px 0 hsl(0 0% 100% / 0.06);\n  overflow: hidden;\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-agent-card--interactive {\n  cursor: pointer;\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--interactive:focus-visible {\n  outline: 2px solid hsl(var(--primary) / 0.72);\n  outline-offset: 3px;\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  min-width: 0;\n  max-width: 100%;\n}\n\n.cm-agent-card__header {\n  display: flex;\n  align-items: flex-start;\n  gap: 1rem;\n  min-width: 0;\n  max-width: 100%;\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  max-width: 100%;\n  flex: 1;\n}\n\n.cm-agent-card__title-row {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.6rem;\n  min-width: 0;\n  max-width: 100%;\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  max-width: 100%;\n  overflow-wrap: anywhere;\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  max-width: 100%;\n  min-width: 0;\n  overflow-wrap: anywhere;\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--match-chat {\n  height: auto;\n  min-height: 0;\n  max-height: 100%;\n}\n\n.cm-agent-card--match-chat > .cm-agent-card__main {\n  height: auto;\n  min-height: 0;\n  align-content: start;\n  overflow: visible;\n}\n\n.cm-agent-card--market,\n.cm-agent-card--market-full {\n  height: var(--cm-market-card-height, clamp(19.5rem, 36dvh, 22.5rem));\n  min-height: 0;\n}\n\n.cm-agent-card--market > .cm-agent-card__main,\n.cm-agent-card--market-full > .cm-agent-card__main {\n  display: grid;\n  grid-template-rows: auto auto auto auto auto;\n  height: 100%;\n  min-height: 0;\n  gap: clamp(0.48rem, 1.15cqi, 0.72rem);\n  padding: clamp(0.68rem, 1.55cqi, 0.92rem);\n  align-content: start;\n  overflow: hidden;\n}\n\n.cm-agent-card--market .cm-agent-card__header,\n.cm-agent-card--market-full .cm-agent-card__header {\n  gap: clamp(0.68rem, 1.55cqi, 0.9rem);\n  align-items: flex-start;\n}\n\n.cm-agent-card--market .cm-agent-card__avatar,\n.cm-agent-card--market-full .cm-agent-card__avatar {\n  width: clamp(2.65rem, 8.5cqi, 3.25rem);\n  height: clamp(2.65rem, 8.5cqi, 3.25rem);\n}\n\n.cm-agent-card--market .cm-agent-card__copy,\n.cm-agent-card--market-full .cm-agent-card__copy {\n  gap: 0.38rem;\n}\n\n.cm-agent-card--market .cm-agent-card__title,\n.cm-agent-card--market-full .cm-agent-card__title {\n  font-size: clamp(0.94rem, 2.55cqi, 1.08rem);\n  line-height: 1.12;\n}\n\n.cm-agent-card--market .cm-agent-card__identity,\n.cm-agent-card--market-full .cm-agent-card__identity {\n  gap: 0.26rem;\n}\n\n.cm-agent-card--market .cm-agent-card__identity-head,\n.cm-agent-card--market-full .cm-agent-card__identity-head {\n  flex-wrap: wrap;\n}\n\n.cm-agent-card--market .cm-agent-card__identity-name,\n.cm-agent-card--market-full .cm-agent-card__identity-name,\n.cm-agent-card--market .cm-agent-card__identity-address,\n.cm-agent-card--market-full .cm-agent-card__identity-address,\n.cm-agent-card--market .cm-agent-card__model-name,\n.cm-agent-card--market-full .cm-agent-card__model-name,\n.cm-agent-card--market .cm-agent-card__metric-value,\n.cm-agent-card--market-full .cm-agent-card__metric-value,\n.cm-agent-card--market .cm-agent-card__endpoint-code,\n.cm-agent-card--market-full .cm-agent-card__endpoint-code,\n.cm-agent-card--market .cm-agent-card__creator-value,\n.cm-agent-card--market-full .cm-agent-card__creator-value {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow-wrap: normal;\n  word-break: normal;\n}\n\n.cm-agent-card--market .cm-agent-card__model,\n.cm-agent-card--market-full .cm-agent-card__model {\n  max-width: 100%;\n  font-size: clamp(0.58rem, 1.85cqi, 0.66rem);\n}\n\n.cm-agent-card--market .cm-agent-card__description,\n.cm-agent-card--market-full .cm-agent-card__description {\n  display: -webkit-box;\n  min-height: calc(3 * 1.36em);\n  max-height: calc(3 * 1.36em);\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 3;\n  font-size: clamp(0.72rem, 1.9cqi, 0.82rem);\n  line-height: 1.36;\n}\n\n.cm-agent-card--market .cm-agent-card__badges,\n.cm-agent-card--market-full .cm-agent-card__badges,\n.cm-agent-card--market .cm-agent-card__tags,\n.cm-agent-card--market-full .cm-agent-card__tags {\n  gap: 0.34rem;\n  overflow: visible;\n}\n\n.cm-agent-card--market .cm-agent-card__badge,\n.cm-agent-card--market-full .cm-agent-card__badge,\n.cm-agent-card--market .cm-agent-card__tag,\n.cm-agent-card--market-full .cm-agent-card__tag {\n  min-height: clamp(1.38rem, 4.6cqi, 1.62rem);\n  padding: 0.28rem 0.52rem;\n  font-size: clamp(0.54rem, 1.65cqi, 0.62rem);\n  letter-spacing: 0.07em;\n  white-space: nowrap;\n}\n\n.cm-agent-card--market .cm-agent-card__metrics,\n.cm-agent-card--market-full .cm-agent-card__metrics {\n  grid-template-columns: repeat(3, minmax(0, 1fr));\n  gap: clamp(0.36rem, 1cqi, 0.52rem);\n}\n\n.cm-agent-card--market .cm-agent-card__metric,\n.cm-agent-card--market-full .cm-agent-card__metric {\n  min-width: 0;\n  min-height: clamp(2.52rem, 7cqi, 3rem);\n  gap: 0.38rem;\n  padding: clamp(0.42rem, 1.2cqi, 0.58rem);\n  border-color: hsl(var(--primary) / 0.15);\n  background:\n    radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.08), transparent 42%),\n    hsl(221 50% 9% / 0.34);\n}\n\n.cm-agent-card--market .cm-agent-card__metric-icon svg,\n.cm-agent-card--market-full .cm-agent-card__metric-icon svg {\n  width: 0.78rem;\n  height: 0.78rem;\n}\n\n.cm-agent-card--market .cm-agent-card__metric-label,\n.cm-agent-card--market-full .cm-agent-card__metric-label {\n  font-size: clamp(0.48rem, 1.45cqi, 0.56rem);\n  letter-spacing: 0.08em;\n}\n\n.cm-agent-card--market .cm-agent-card__metric-value,\n.cm-agent-card--market-full .cm-agent-card__metric-value {\n  font-size: clamp(0.62rem, 1.75cqi, 0.72rem);\n}\n\n.cm-agent-card--market .cm-agent-card__tags-block,\n.cm-agent-card--market-full .cm-agent-card__tags-block {\n  align-self: stretch;\n  align-content: start;\n  gap: 0.34rem;\n  min-height: 0;\n  overflow: visible;\n}\n\n.cm-agent-card--market .cm-agent-card__tags-title,\n.cm-agent-card--market-full .cm-agent-card__tags-title {\n  display: block;\n}\n\n.cm-agent-card--market .cm-agent-card__footer,\n.cm-agent-card--market-full .cm-agent-card__footer {\n  padding-top: clamp(0.52rem, 1.2cqi, 0.74rem);\n}\n\n.cm-agent-card--market .cm-agent-card__footer-stack,\n.cm-agent-card--market-full .cm-agent-card__footer-stack {\n  grid-template-columns: minmax(0, 1fr) minmax(5rem, 0.42fr);\n  align-items: start;\n  gap: clamp(0.42rem, 1.05cqi, 0.6rem);\n}\n\n.cm-agent-card--market .cm-agent-card__endpoint,\n.cm-agent-card--market-full .cm-agent-card__endpoint,\n.cm-agent-card--market .cm-agent-card__creator,\n.cm-agent-card--market-full .cm-agent-card__creator {\n  gap: 0.34rem;\n  min-width: 0;\n}\n\n.cm-agent-card--market .cm-agent-card__endpoint-label,\n.cm-agent-card--market-full .cm-agent-card__endpoint-label,\n.cm-agent-card--market .cm-agent-card__creator-label,\n.cm-agent-card--market-full .cm-agent-card__creator-label {\n  display: block;\n}\n\n.cm-agent-card--market .cm-agent-card__endpoint-row,\n.cm-agent-card--market-full .cm-agent-card__endpoint-row {\n  min-height: 2.05rem;\n  padding: 0.32rem 0.42rem 0.32rem 0.56rem;\n  gap: 0.32rem;\n  border-color: hsl(var(--primary) / 0.15);\n}\n\n.cm-agent-card--market .cm-agent-card__creator-value,\n.cm-agent-card--market-full .cm-agent-card__creator-value,\n.cm-agent-card--market .cm-agent-card__endpoint-code,\n.cm-agent-card--market-full .cm-agent-card__endpoint-code {\n  font-size: clamp(0.58rem, 1.62cqi, 0.68rem);\n}\n\n.cm-agent-card--market .cm-agent-card__creator-value,\n.cm-agent-card--market-full .cm-agent-card__creator-value {\n  display: block;\n  text-align: right;\n}\n\n.cm-agent-card__metric,\n.cm-agent-card__metric-copy,\n.cm-agent-card__focus,\n.cm-agent-card__focus-copy,\n.cm-agent-card__tags-block,\n.cm-agent-card__footer,\n.cm-agent-card__footer-stack,\n.cm-agent-card__endpoint,\n.cm-agent-card__creator {\n  min-width: 0;\n  max-width: 100%;\n}\n\n.cm-agent-card__metric-value,\n.cm-agent-card__focus-value,\n.cm-agent-card__meta-value,\n.cm-agent-card__endpoint-code,\n.cm-agent-card__creator-value {\n  max-width: 100%;\n  min-width: 0;\n  white-space: normal;\n  overflow-wrap: anywhere;\n  word-break: break-word;\n}\n\n.cm-agent-card__identity {\n  display: grid;\n  gap: 0.32rem;\n  min-width: 0;\n  max-width: 100%;\n}\n\n.cm-agent-card__identity-head {\n  display: flex;\n  align-items: baseline;\n  gap: 0.45rem;\n  min-width: 0;\n  max-width: 100%;\n  flex-wrap: wrap;\n}\n\n.cm-agent-card__identity-name {\n  min-width: 0;\n  max-width: 100%;\n  overflow-wrap: anywhere;\n}\n\n.cm-agent-card__identity-address {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 500;\n  line-height: 1.1;\n}\n\n.cm-agent-card__model {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.28rem;\n  width: fit-content;\n  max-width: 100%;\n  padding: 0.16rem 0.44rem;\n  border: 1px solid hsl(var(--primary) / 0.3);\n  border-radius: 999px;\n  background: hsl(var(--primary) / 0.06);\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.66rem;\n  font-weight: 600;\n  line-height: 1.25;\n}\n\n.cm-agent-card__model svg {\n  width: 0.68rem;\n  height: 0.68rem;\n  flex-shrink: 0;\n  color: hsl(var(--primary));\n}\n\n.cm-agent-card__model-name {\n  min-width: 0;\n  max-width: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.cm-agent-card__badge,\n.cm-agent-card__tag {\n  max-width: 100%;\n  min-width: 0;\n  height: auto;\n  padding-top: 0.35rem;\n  padding-bottom: 0.35rem;\n  line-height: 1.2;\n  white-space: normal;\n  overflow-wrap: anywhere;\n}\n\n.cm-agent-card__endpoint-row {\n  min-width: 0;\n  max-width: 100%;\n  cursor: pointer;\n  text-align: left;\n}\n\n.cm-agent-card__endpoint-row:focus-visible {\n  outline: 2px solid hsl(var(--primary) / 0.75);\n  outline-offset: 2px;\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\n@container (max-width: 26rem) {\n  .cm-agent-card__metrics {\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  .cm-agent-card__header {\n    gap: 0.7rem;\n  }\n\n  .cm-agent-card__avatar {\n    width: 2.75rem;\n    height: 2.75rem;\n  }\n}\n\n@container (max-width: 21rem) {\n  .cm-agent-card__endpoint-row {\n    grid-template-columns: minmax(0, 1fr);\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,mooBAo1BrB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/agents/styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS,ohoBAg1BrB,CAAC"}

package/dist/agents/styles.js

@@ -372,32 +372,33 @@ export const agentsCss = `/**
 }
 
 .cm-agent-card--match-chat {
-  height: 100%;
+  height: auto;
   min-height: 0;
+  max-height: 100%;
 }
 
 .cm-agent-card--match-chat > .cm-agent-card__main {
-  height: 100%;
+  height: auto;
   min-height: 0;
   align-content: start;
-  overflow: hidden;
+  overflow: visible;
 }
 
 .cm-agent-card--market,
 .cm-agent-card--market-full {
-  height: var(--cm-market-card-height, clamp(26rem, 46vw, 32rem));
+  height: var(--cm-market-card-height, clamp(19.5rem, 36dvh, 22.5rem));
   min-height: 0;
 }
 
 .cm-agent-card--market > .cm-agent-card__main,
 .cm-agent-card--market-full > .cm-agent-card__main {
   display: grid;
-  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
+  grid-template-rows: auto auto auto auto auto;
   height: 100%;
   min-height: 0;
-  gap: clamp(0.64rem, 1.45cqi, 0.9rem);
-  padding: clamp(0.82rem, 1.85cqi, 1.05rem);
-  align-content: stretch;
+  gap: clamp(0.48rem, 1.15cqi, 0.72rem);
+  padding: clamp(0.68rem, 1.55cqi, 0.92rem);
+  align-content: start;
   overflow: hidden;
 }
 
@@ -476,12 +477,7 @@ export const agentsCss = `/**
 .cm-agent-card--market .cm-agent-card__tags,
 .cm-agent-card--market-full .cm-agent-card__tags {
   gap: 0.34rem;
-  overflow: hidden;
-}
-
-.cm-agent-card--market .cm-agent-card__badges,
-.cm-agent-card--market-full .cm-agent-card__badges {
-  max-height: 4.1rem;
+  overflow: visible;
 }
 
 .cm-agent-card--market .cm-agent-card__badge,
@@ -536,7 +532,7 @@ export const agentsCss = `/**
   align-content: start;
   gap: 0.34rem;
   min-height: 0;
-  overflow: hidden;
+  overflow: visible;
 }
 
 .cm-agent-card--market .cm-agent-card__tags-title,
@@ -552,8 +548,8 @@ export const agentsCss = `/**
 .cm-agent-card--market .cm-agent-card__footer-stack,
 .cm-agent-card--market-full .cm-agent-card__footer-stack {
   grid-template-columns: minmax(0, 1fr) minmax(5rem, 0.42fr);
-  align-items: end;
-  gap: clamp(0.48rem, 1.25cqi, 0.68rem);
+  align-items: start;
+  gap: clamp(0.42rem, 1.05cqi, 0.6rem);
 }
 
 .cm-agent-card--market .cm-agent-card__endpoint,

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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAo1BxB,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/agents/styles.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAg1BxB,CAAC"}

package/dist/css/agents.css

@@ -372,32 +372,33 @@
 }
 
 .cm-agent-card--match-chat {
-  height: 100%;
+  height: auto;
   min-height: 0;
+  max-height: 100%;
 }
 
 .cm-agent-card--match-chat > .cm-agent-card__main {
-  height: 100%;
+  height: auto;
   min-height: 0;
   align-content: start;
-  overflow: hidden;
+  overflow: visible;
 }
 
 .cm-agent-card--market,
 .cm-agent-card--market-full {
-  height: var(--cm-market-card-height, clamp(26rem, 46vw, 32rem));
+  height: var(--cm-market-card-height, clamp(19.5rem, 36dvh, 22.5rem));
   min-height: 0;
 }
 
 .cm-agent-card--market > .cm-agent-card__main,
 .cm-agent-card--market-full > .cm-agent-card__main {
   display: grid;
-  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
+  grid-template-rows: auto auto auto auto auto;
   height: 100%;
   min-height: 0;
-  gap: clamp(0.64rem, 1.45cqi, 0.9rem);
-  padding: clamp(0.82rem, 1.85cqi, 1.05rem);
-  align-content: stretch;
+  gap: clamp(0.48rem, 1.15cqi, 0.72rem);
+  padding: clamp(0.68rem, 1.55cqi, 0.92rem);
+  align-content: start;
   overflow: hidden;
 }
 
@@ -476,12 +477,7 @@
 .cm-agent-card--market .cm-agent-card__tags,
 .cm-agent-card--market-full .cm-agent-card__tags {
   gap: 0.34rem;
-  overflow: hidden;
-}
-
-.cm-agent-card--market .cm-agent-card__badges,
-.cm-agent-card--market-full .cm-agent-card__badges {
-  max-height: 4.1rem;
+  overflow: visible;
 }
 
 .cm-agent-card--market .cm-agent-card__badge,
@@ -536,7 +532,7 @@
   align-content: start;
   gap: 0.34rem;
   min-height: 0;
-  overflow: hidden;
+  overflow: visible;
 }
 
 .cm-agent-card--market .cm-agent-card__tags-title,
@@ -552,8 +548,8 @@
 .cm-agent-card--market .cm-agent-card__footer-stack,
 .cm-agent-card--market-full .cm-agent-card__footer-stack {
   grid-template-columns: minmax(0, 1fr) minmax(5rem, 0.42fr);
-  align-items: end;
-  gap: clamp(0.48rem, 1.25cqi, 0.68rem);
+  align-items: start;
+  gap: clamp(0.42rem, 1.05cqi, 0.6rem);
 }
 
 .cm-agent-card--market .cm-agent-card__endpoint,

package/dist/css/shell.css

@@ -221,11 +221,12 @@
   overscroll-behavior: contain;
   scrollbar-width: thin;
   padding: var(--cm-workspace-pad);
+  padding-bottom: max(clamp(0.45rem, 1.1vw, 0.85rem), env(safe-area-inset-bottom));
 }
 
 .cm-workspace-canvas--fade {
-  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 1.6%, #000 98.4%, transparent 100%);
-  mask-image: linear-gradient(180deg, transparent 0, #000 1.6%, #000 98.4%, transparent 100%);
+  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 1.5%, #000 95%, transparent 100%);
+  mask-image: linear-gradient(180deg, transparent 0, #000 1.5%, #000 95%, transparent 100%);
 }
 
 .cm-workspace__body {
@@ -798,7 +799,7 @@
   padding:
     calc(env(safe-area-inset-top) + clamp(4.8rem, 7vw, 5.9rem))
     clamp(5.25rem, 6vw, 7rem)
-    calc(env(safe-area-inset-bottom) + clamp(5.35rem, 7.4vw, 6.35rem));
+    calc(env(safe-area-inset-bottom) + clamp(0.85rem, 2vw, 1.55rem));
 }
 
 .cm-app-chrome__navdock {
@@ -1572,7 +1573,7 @@
     padding:
       calc(env(safe-area-inset-top) + clamp(4.25rem, 14vw, 4.85rem))
       clamp(0.75rem, 4.2vw, 1.05rem)
-      calc(env(safe-area-inset-bottom) + clamp(5.55rem, 16vw, 6.55rem));
+      calc(env(safe-area-inset-bottom) + var(--cm-hud-size) + clamp(0.72rem, 3.4vw, 1rem));
   }
 
   .cm-app-chrome__hud {

package/dist/shell/styles.d.ts

@@ -1,2 +1,2 @@
-export declare const shellCss = "/**\n * Compose.Market Shared Shell\n * @compose-market/theme/css/shell\n */\n\n:root {\n  --cm-shell-glow-primary: hsl(var(--primary) / 0.3);\n  --cm-shell-glow-accent: hsl(var(--accent) / 0.16);\n  --cm-shell-surface:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.38), hsl(221 50% 9% / 0.24)),\n    radial-gradient(circle at 18% 0%, hsl(var(--primary) / 0.08), transparent 34%),\n    hsl(224 36% 13% / 0.28);\n  --cm-shell-border: hsl(var(--primary) / 0.18);\n  --cm-shell-shadow:\n    0 0 40px hsl(var(--primary) / 0.055),\n    inset 0 1px 0 hsl(0 0% 100% / 0.06);\n  --cm-chrome-gutter: clamp(0.7rem, 1.4vw, 1.15rem);\n  --cm-chrome-sidebar: 16rem;\n  --cm-chrome-sidebar-collapsed: 4.7rem;\n  --cm-chrome-topbar: 4rem;\n  --cm-chrome-mobile: 3.55rem;\n  --cm-page-max: 88rem;\n}\n\n.cm-shell-stack {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n\n.cm-shell-cluster {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  flex-wrap: wrap;\n}\n\n.cm-shell-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.55rem;\n  min-height: 2.3rem;\n  padding: 0 0.95rem;\n  border-radius: 999px;\n  border: 1px solid hsl(var(--primary) / 0.22);\n  background:\n    linear-gradient(180deg, hsl(var(--card) / 0.72), hsl(var(--background) / 0.36));\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.76rem;\n  font-weight: 600;\n  letter-spacing: 0.08em;\n  line-height: 1;\n  text-transform: uppercase;\n  cursor: pointer;\n  transition:\n    transform 160ms ease,\n    background-color 160ms ease,\n    border-color 180ms ease,\n    color 180ms ease,\n    box-shadow 180ms ease;\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.04),\n    0 0 16px hsl(var(--primary) / 0.035);\n  backdrop-filter: blur(12px) saturate(1.08);\n}\n\n.cm-shell-button:hover:not(:disabled) {\n  transform: translateY(-1px);\n  border-color: hsl(var(--primary) / 0.38);\n}\n\n.cm-shell-button:disabled {\n  opacity: 0.55;\n  cursor: not-allowed;\n}\n\n.cm-shell-button--primary {\n  background:\n    linear-gradient(135deg, #8aebff, #22d3ee);\n  color: hsl(var(--primary-foreground));\n  border-color: hsl(var(--primary) / 0.56);\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.16),\n    0 0 20px var(--cm-shell-glow-primary);\n}\n\n.cm-shell-button--primary:hover:not(:disabled) {\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.18),\n    0 0 24px var(--cm-shell-glow-primary),\n    0 0 18px var(--cm-shell-glow-accent);\n}\n\n.cm-shell-button--secondary {\n  background: hsl(221 50% 9% / 0.36);\n  border-color: hsl(var(--primary) / 0.2);\n  color: hsl(var(--primary));\n}\n\n.cm-shell-button--secondary:hover:not(:disabled) {\n  background: hsl(var(--primary) / 0.1);\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.1);\n}\n\n.cm-shell-button--ghost {\n  background: transparent;\n  border-color: transparent;\n  color: hsl(var(--muted-foreground));\n  box-shadow: none;\n}\n\n.cm-shell-button--ghost:hover:not(:disabled) {\n  color: hsl(var(--foreground));\n  background: hsl(var(--muted) / 0.24);\n}\n\n.cm-shell-button--danger {\n  background: hsl(var(--destructive) / 0.12);\n  border-color: hsl(var(--destructive) / 0.42);\n  color: hsl(var(--destructive-foreground));\n}\n\n.cm-shell-button--danger:hover:not(:disabled) {\n  background: hsl(var(--destructive) / 0.2);\n}\n\n.cm-shell-button--sm {\n  min-height: 2rem;\n  padding: 0 0.75rem;\n  font-size: 0.7rem;\n}\n\n.cm-shell-button--lg {\n  min-height: 2.65rem;\n  padding: 0 1.1rem;\n  font-size: 0.82rem;\n}\n\n.cm-shell-button--icon {\n  width: 2.3rem;\n  padding: 0;\n}\n\n.cm-shell-pill {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.45rem;\n  min-height: 1.75rem;\n  padding: 0 0.72rem;\n  border-radius: 999px;\n  border: 1px solid hsl(var(--primary) / 0.2);\n  background:\n    linear-gradient(180deg, hsl(var(--card) / 0.76), hsl(var(--muted) / 0.26));\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n.cm-shell-pill strong,\n.cm-shell-pill span {\n  color: inherit;\n}\n\n.cm-shell-panel {\n  border: 1px solid var(--cm-shell-border);\n  border-radius: 12px;\n  background: var(--cm-shell-surface);\n  box-shadow: var(--cm-shell-shadow);\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-shell-page {\n  container-type: inline-size;\n  width: min(var(--cm-page-max), 100%);\n  min-width: 0;\n  margin-inline: auto;\n  display: grid;\n  gap: clamp(1rem, 2.2cqi, 1.55rem);\n}\n\n.cm-shell-page--full {\n  --cm-page-max: none;\n}\n\n.cm-shell-page-body {\n  display: grid;\n  gap: clamp(0.9rem, 2cqi, 1.35rem);\n  min-width: 0;\n}\n\n.cm-workspace {\n  --cm-workspace-pad: clamp(0.85rem, 2.2vw, 1.45rem);\n  --cm-workspace-gap: clamp(0.85rem, 1.8vw, 1.25rem);\n  --cm-workspace-max: var(--cm-page-max, 88rem);\n  container-type: inline-size;\n  display: grid;\n  grid-template-rows: minmax(0, 1fr);\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  min-width: 0;\n  overflow: hidden;\n}\n\n.cm-workspace--page {\n  grid-template-rows: minmax(0, 1fr);\n}\n\n.cm-workspace--canvas {\n  overflow: hidden;\n}\n\n.cm-workspace-canvas {\n  min-width: 0;\n  min-height: 0;\n  overflow: auto;\n  overscroll-behavior: contain;\n  scrollbar-width: thin;\n  padding: var(--cm-workspace-pad);\n}\n\n.cm-workspace-canvas--fade {\n  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 1.6%, #000 98.4%, transparent 100%);\n  mask-image: linear-gradient(180deg, transparent 0, #000 1.6%, #000 98.4%, transparent 100%);\n}\n\n.cm-workspace__body {\n  display: grid;\n  gap: var(--cm-workspace-gap);\n  width: min(100%, var(--cm-workspace-max));\n  min-width: 0;\n  margin-inline: auto;\n}\n\n.cm-page-stack {\n  display: grid;\n  grid-template-rows: auto auto minmax(0, 1fr);\n  align-content: stretch;\n  gap: var(--cm-workspace-gap, clamp(0.85rem, 1.8vw, 1.25rem));\n  width: min(100%, var(--cm-workspace-max, var(--cm-page-max, 88rem)));\n  height: 100%;\n  max-height: 100%;\n  min-width: 0;\n  min-height: 0;\n  margin-inline: auto;\n  overflow: hidden;\n}\n\n.cm-page-stack--simple {\n  grid-template-rows: auto minmax(0, 1fr);\n}\n\n.cm-page-stack__header,\n.cm-page-stack__controls {\n  min-width: 0;\n  min-height: 0;\n}\n\n.cm-page-stack__controls {\n  display: grid;\n  gap: clamp(0.5rem, 1.1vw, 0.75rem);\n}\n\n.cm-page-list {\n  min-width: 0;\n  min-height: 0;\n  overflow-x: hidden;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  scrollbar-width: thin;\n  padding-block: clamp(0.1rem, 0.5vw, 0.3rem);\n}\n\n.cm-page-tabs {\n  display: flex;\n  min-width: 0;\n  min-height: 0;\n  flex-direction: column;\n  gap: clamp(0.6rem, 1.2vw, 0.85rem);\n  overflow: hidden;\n}\n\n.cm-page-tabs > [role=\"tablist\"] {\n  flex: 0 0 auto;\n}\n\n.cm-page-tab-panel {\n  flex: 1 1 auto;\n  min-width: 0;\n  min-height: 0;\n  margin-top: 0;\n  overflow-x: hidden;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  scrollbar-width: thin;\n  padding-block: 0.05rem 0.35rem;\n}\n\n.cm-page-tab-panel[data-state=\"inactive\"] {\n  display: none;\n}\n\n.cm-chat-workspace,\n.cm-compose-workspace {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  min-width: 0;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.cm-chat-workspace {\n  flex-direction: column;\n}\n\n.cm-compose-workspace {\n  gap: clamp(0.7rem, 1.4vw, 1rem);\n  flex-direction: column;\n}\n\n@media (min-width: 1024px) {\n  .cm-compose-workspace {\n    flex-direction: row;\n  }\n}\n\n.cm-control-rail {\n  container-type: inline-size;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: clamp(0.5rem, 1.4cqi, 0.85rem);\n  min-width: 0;\n  padding: clamp(0.48rem, 1.2cqi, 0.68rem);\n  border: 1px solid hsl(var(--primary) / 0.18);\n  border-radius: 16px;\n  background:\n    radial-gradient(circle at 8% 0%, hsl(var(--primary) / 0.12), transparent 32%),\n    radial-gradient(circle at 92% 100%, hsl(var(--accent) / 0.1), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 23% / 0.42), hsl(221 50% 9% / 0.34));\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.06),\n    0 0 24px hsl(var(--primary) / 0.06);\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-control-rail--compact {\n  padding: clamp(0.36rem, 0.9cqi, 0.52rem);\n  border-radius: 14px;\n}\n\n.cm-control-rail__main,\n.cm-control-rail__actions,\n.cm-control-rail__tabs {\n  display: flex;\n  align-items: center;\n  gap: clamp(0.42rem, 1.1cqi, 0.7rem);\n  min-width: 0;\n}\n\n.cm-control-rail__main {\n  flex: 1 1 22rem;\n}\n\n.cm-control-rail__actions,\n.cm-control-rail__tabs {\n  flex: 0 1 auto;\n  flex-wrap: wrap;\n  justify-content: flex-end;\n}\n\n.cm-responsive-pair {\n  --cm-pair-side: clamp(17rem, 27cqi, 22rem);\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) minmax(min(100%, 16rem), var(--cm-pair-side));\n  align-items: start;\n  gap: clamp(0.85rem, 2cqi, 1.25rem);\n  min-width: 0;\n}\n\n.cm-responsive-pair--reverse {\n  grid-template-columns: minmax(min(100%, 16rem), var(--cm-pair-side)) minmax(0, 1fr);\n}\n\n.cm-choice-card {\n  display: grid;\n  gap: clamp(0.75rem, 2cqi, 1rem);\n  align-content: start;\n  min-width: 0;\n  width: 100%;\n  padding: clamp(1rem, 3cqi, 1.45rem);\n  border: 1px solid hsl(var(--primary) / 0.2);\n  border-radius: 16px;\n  background:\n    radial-gradient(circle at 50% 0%, hsl(var(--primary) / 0.12), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 23% / 0.42), hsl(221 50% 9% / 0.36));\n  color: hsl(var(--foreground));\n  text-align: left;\n  box-shadow: var(--cm-shell-shadow);\n  cursor: pointer;\n  backdrop-filter: blur(16px) saturate(1.12);\n  transition:\n    transform 170ms ease,\n    border-color 170ms ease,\n    box-shadow 170ms ease;\n}\n\n.cm-choice-card[data-tone=\"fuchsia\"] {\n  border-color: hsl(var(--accent) / 0.22);\n  background:\n    radial-gradient(circle at 50% 0%, hsl(var(--accent) / 0.12), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 23% / 0.42), hsl(221 50% 9% / 0.36));\n}\n\n.cm-choice-card:hover,\n.cm-choice-card:focus-visible {\n  outline: none;\n  transform: translateY(-2px);\n  border-color: hsl(var(--primary) / 0.45);\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.16),\n    0 0 28px hsl(var(--primary) / 0.14),\n    inset 0 1px 0 hsl(0 0% 100% / 0.07);\n}\n\n.cm-choice-card[data-tone=\"fuchsia\"]:hover,\n.cm-choice-card[data-tone=\"fuchsia\"]:focus-visible {\n  border-color: hsl(var(--accent) / 0.44);\n  box-shadow:\n    0 0 0 1px hsl(var(--accent) / 0.14),\n    0 0 28px hsl(var(--accent) / 0.13),\n    inset 0 1px 0 hsl(0 0% 100% / 0.07);\n}\n\n.cm-choice-card__icon {\n  display: grid;\n  width: clamp(2.75rem, 7cqi, 3.55rem);\n  height: clamp(2.75rem, 7cqi, 3.55rem);\n  place-items: center;\n  border-radius: 999px;\n  border: 1px solid hsl(var(--primary) / 0.26);\n  background: hsl(var(--primary) / 0.1);\n  color: hsl(var(--primary));\n  box-shadow: 0 0 20px hsl(var(--primary) / 0.12);\n}\n\n.cm-choice-card[data-tone=\"fuchsia\"] .cm-choice-card__icon {\n  border-color: hsl(var(--accent) / 0.28);\n  background: hsl(var(--accent) / 0.1);\n  color: hsl(var(--accent));\n  box-shadow: 0 0 20px hsl(var(--accent) / 0.12);\n}\n\n.cm-choice-card__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: clamp(1rem, 2.5cqi, 1.25rem);\n  letter-spacing: 0.05em;\n  line-height: 1.05;\n  text-transform: uppercase;\n}\n\n.cm-choice-card__copy {\n  color: hsl(var(--muted-foreground));\n  font-size: clamp(0.82rem, 1.9cqi, 0.92rem);\n  line-height: 1.45;\n}\n\n.cm-fold {\n  border: 1px solid hsl(var(--primary) / 0.17);\n  border-radius: 14px;\n  background:\n    radial-gradient(circle at 12% 0%, hsl(var(--primary) / 0.08), transparent 32%),\n    hsl(221 50% 9% / 0.36);\n  overflow: hidden;\n}\n\n.cm-fold__summary {\n  display: flex;\n  align-items: center;\n  gap: 0.55rem;\n  min-height: 2.75rem;\n  padding: 0.72rem 0.9rem;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.74rem;\n  font-weight: 700;\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n  cursor: pointer;\n}\n\n.cm-fold__summary:focus-visible {\n  outline: 2px solid hsl(var(--primary) / 0.68);\n  outline-offset: -2px;\n}\n\n.cm-fold__body {\n  display: grid;\n  gap: 0.75rem;\n  padding: 0 0.9rem 0.9rem;\n  color: hsl(var(--muted-foreground));\n  font-size: 0.88rem;\n  line-height: 1.5;\n}\n\n.cm-fold:not([open]) > .cm-fold__body {\n  display: none;\n}\n\n.cm-setting-row {\n  display: grid;\n  grid-template-columns: auto minmax(0, 1fr) auto;\n  align-items: center;\n  gap: 0.78rem;\n  min-width: 0;\n  padding: 0.72rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 14px;\n  background:\n    linear-gradient(145deg, hsl(226 21% 20% / 0.42), hsl(221 50% 9% / 0.34));\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.05);\n}\n\n.cm-setting-row__icon {\n  display: grid;\n  width: 2.35rem;\n  height: 2.35rem;\n  place-items: center;\n  border-radius: 12px;\n  background: hsl(var(--primary) / 0.1);\n  color: hsl(var(--primary));\n}\n\n.cm-setting-row__copy {\n  display: grid;\n  gap: 0.16rem;\n  min-width: 0;\n}\n\n.cm-setting-row__label {\n  color: hsl(var(--foreground));\n  font-size: 0.88rem;\n  font-weight: 700;\n  line-height: 1.15;\n}\n\n.cm-setting-row__description {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.76rem;\n  line-height: 1.35;\n}\n\n.cm-setting-row__control {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  min-width: max-content;\n}\n\n.cm-field {\n  display: grid;\n  gap: 0.42rem;\n  min-width: 0;\n}\n\n.cm-field__label,\n.cm-field label,\n.cm-field .cm-field-label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 700;\n  letter-spacing: 0.12em;\n  line-height: 1.15;\n  text-transform: uppercase;\n}\n\n.cm-field__hint {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.76rem;\n  line-height: 1.35;\n}\n\n.cm-surface-card,\n.cm-builder-panel {\n  min-width: 0;\n  border: 1px solid hsl(var(--primary) / 0.17);\n  border-radius: 16px;\n  background:\n    radial-gradient(circle at 10% 0%, hsl(var(--primary) / 0.1), transparent 34%),\n    radial-gradient(circle at 96% 100%, hsl(var(--accent) / 0.08), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 22% / 0.42), hsl(221 50% 9% / 0.34));\n  box-shadow:\n    0 0 28px hsl(var(--primary) / 0.045),\n    inset 0 1px 0 hsl(0 0% 100% / 0.055);\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-builder-panel {\n  display: grid;\n  align-content: start;\n  gap: clamp(0.72rem, 1.55cqi, 1rem);\n  padding: clamp(0.86rem, 1.8cqi, 1.15rem);\n}\n\n.cm-builder-panel[data-tone=\"green\"] {\n  border-color: hsl(142 71% 45% / 0.2);\n  background:\n    radial-gradient(circle at 10% 0%, hsl(142 71% 45% / 0.1), transparent 34%),\n    radial-gradient(circle at 96% 100%, hsl(var(--primary) / 0.08), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 22% / 0.42), hsl(221 50% 9% / 0.34));\n}\n\n.cm-builder-panel[data-tone=\"fuchsia\"] {\n  border-color: hsl(var(--accent) / 0.22);\n  background:\n    radial-gradient(circle at 10% 0%, hsl(var(--accent) / 0.1), transparent 34%),\n    radial-gradient(circle at 96% 100%, hsl(var(--primary) / 0.08), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 22% / 0.42), hsl(221 50% 9% / 0.34));\n}\n\n.cm-builder-panel__title {\n  display: flex;\n  align-items: center;\n  gap: 0.48rem;\n  color: hsl(var(--primary));\n  font-family: var(--font-display), sans-serif;\n  font-size: 0.82rem;\n  font-weight: 800;\n  letter-spacing: 0.06em;\n  line-height: 1.1;\n  text-transform: uppercase;\n}\n\n.cm-builder-panel[data-tone=\"green\"] .cm-builder-panel__title {\n  color: hsl(142 71% 45%);\n}\n\n.cm-builder-panel[data-tone=\"fuchsia\"] .cm-builder-panel__title {\n  color: hsl(var(--accent));\n}\n\n.cm-stat-strip {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr));\n  gap: clamp(0.45rem, 1cqi, 0.68rem);\n  min-width: 0;\n}\n\n.cm-stat-strip--dense {\n  grid-template-columns: repeat(auto-fit, minmax(min(100%, 6.75rem), 1fr));\n}\n\n.cm-stat-cell,\n.cm-stat-grid__cell {\n  min-width: 0;\n  border: 1px solid hsl(var(--primary) / 0.15);\n  border-radius: 12px;\n  background:\n    radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.08), transparent 42%),\n    hsl(221 50% 9% / 0.34);\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.045);\n}\n\n.cm-stat-cell {\n  display: grid;\n  gap: 0.25rem;\n  padding: clamp(0.5rem, 1.2cqi, 0.68rem);\n}\n\n.cm-stat-cell__label,\n.cm-stat-grid__cell-label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.58rem;\n  letter-spacing: 0.1em;\n  line-height: 1.1;\n  text-transform: uppercase;\n}\n\n.cm-stat-cell__value-row {\n  display: flex;\n  align-items: center;\n  gap: 0.38rem;\n  min-width: 0;\n}\n\n.cm-stat-cell__value,\n.cm-stat-grid__cell-value {\n  min-width: 0;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.75rem;\n  font-weight: 800;\n  line-height: 1.2;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.cm-popover-panel {\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.2);\n  border-radius: 14px;\n  background:\n    radial-gradient(circle at 8% 0%, hsl(var(--primary) / 0.1), transparent 32%),\n    hsl(221 50% 8% / 0.92);\n  box-shadow:\n    0 18px 50px hsl(240 30% 2% / 0.42),\n    0 0 28px hsl(var(--primary) / 0.1);\n  backdrop-filter: blur(18px) saturate(1.14);\n}\n\n.cm-popover-panel__header,\n.cm-popover-panel__footer {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 0.65rem;\n  padding: 0.48rem 0.68rem;\n  border-color: hsl(var(--primary) / 0.13);\n}\n\n.cm-popover-panel__header {\n  border-bottom: 1px solid hsl(var(--primary) / 0.13);\n}\n\n.cm-popover-panel__footer {\n  border-top: 1px solid hsl(var(--primary) / 0.13);\n}\n\n.cm-popover-panel__label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.62rem;\n  font-weight: 800;\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n}\n\n.cm-switch,\n.cm-checkbox,\n.cm-radio-item {\n  border-color: hsl(var(--primary) / 0.34);\n  background:\n    linear-gradient(145deg, hsl(221 50% 8% / 0.92), hsl(226 21% 18% / 0.72));\n  box-shadow:\n    inset 0 0 0 1px hsl(0 0% 100% / 0.04),\n    0 0 14px hsl(var(--primary) / 0.055);\n}\n\n.cm-switch[data-state=\"checked\"],\n.cm-checkbox[data-state=\"checked\"],\n.cm-radio-item[data-state=\"checked\"] {\n  border-color: hsl(var(--primary) / 0.72);\n  background:\n    radial-gradient(circle at 76% 50%, hsl(var(--accent) / 0.28), transparent 42%),\n    linear-gradient(135deg, hsl(var(--primary) / 0.92), hsl(var(--accent) / 0.76));\n  color: hsl(var(--primary-foreground));\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.22),\n    0 0 18px hsl(var(--primary) / 0.24);\n}\n\n.cm-switch:focus-visible,\n.cm-checkbox:focus-visible,\n.cm-radio-item:focus-visible {\n  outline: 2px solid hsl(var(--primary) / 0.78);\n  outline-offset: 2px;\n}\n\n.cm-switch:disabled,\n.cm-checkbox:disabled,\n.cm-radio-item[data-disabled] {\n  opacity: 0.55;\n  cursor: not-allowed;\n}\n\n.cm-app-chrome {\n  --cm-chrome-safe: clamp(0.62rem, 1.25vw, 1rem);\n  --cm-chrome-gap: clamp(0.34rem, 0.75vw, 0.55rem);\n  --cm-hud-size: clamp(2.65rem, 4.1vw, 3rem);\n  --cm-hud-radius: 999px;\n  position: relative;\n  min-height: 100dvh;\n  isolation: isolate;\n}\n\n.cm-app-chrome__main {\n  min-width: 0;\n  min-height: 100dvh;\n  padding:\n    calc(env(safe-area-inset-top) + clamp(4.8rem, 7vw, 5.9rem))\n    clamp(5.25rem, 6vw, 7rem)\n    calc(env(safe-area-inset-bottom) + clamp(5.35rem, 7.4vw, 6.35rem));\n}\n\n.cm-app-chrome__navdock {\n  position: fixed;\n  inset-block-start: 50%;\n  inset-inline-start: calc(env(safe-area-inset-left) + var(--cm-chrome-safe));\n  z-index: 55;\n  display: grid;\n  gap: var(--cm-chrome-gap);\n  transform: translate3d(0, -50%, 0);\n  pointer-events: none;\n}\n\n.cm-app-chrome__navgroup,\n.cm-app-chrome__navutility {\n  display: grid;\n  gap: var(--cm-chrome-gap);\n  pointer-events: none;\n}\n\n.cm-app-chrome__navutility {\n  margin-top: clamp(0.45rem, 1vw, 0.7rem);\n  padding-top: clamp(0.45rem, 1vw, 0.7rem);\n}\n\n.cm-app-chrome__navitem,\n.cm-hud-button {\n  position: relative;\n  display: inline-grid;\n  place-items: center;\n  width: var(--cm-hud-size);\n  min-width: var(--cm-hud-size);\n  height: var(--cm-hud-size);\n  min-height: var(--cm-hud-size);\n  border: 1px solid hsl(var(--primary) / 0.18);\n  border-radius: var(--cm-hud-radius);\n  background:\n    radial-gradient(circle at 30% 14%, hsl(var(--primary) / 0.15), transparent 38%),\n    radial-gradient(circle at 78% 90%, hsl(var(--accent) / 0.12), transparent 42%),\n    linear-gradient(145deg, hsl(226 21% 23% / 0.48), hsl(221 50% 9% / 0.38));\n  color: hsl(var(--muted-foreground));\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.07),\n    inset 0 -1px 0 hsl(var(--primary) / 0.07),\n    0 0 26px hsl(var(--primary) / 0.065);\n  backdrop-filter: blur(18px) saturate(1.16);\n  cursor: pointer;\n  pointer-events: auto;\n  text-decoration: none;\n  transition:\n    transform 160ms ease,\n    border-color 180ms ease,\n    background-color 180ms ease,\n    color 180ms ease,\n    box-shadow 180ms ease,\n    opacity 180ms ease;\n}\n\n.cm-app-chrome__navitem::before {\n  content: \"\";\n  position: absolute;\n  inset: -0.18rem;\n  border-radius: 999px;\n  background:\n    radial-gradient(circle at 50% 18%, hsl(var(--primary) / 0.28), transparent 46%),\n    radial-gradient(circle at 50% 86%, hsl(var(--accent) / 0.18), transparent 42%);\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.42),\n    0 0 18px hsl(var(--primary) / 0.2),\n    0 0 22px hsl(var(--accent) / 0.1);\n  opacity: 0;\n  transform: scale(0.72);\n  transition:\n    opacity 180ms ease,\n    transform 180ms ease;\n  pointer-events: none;\n}\n\n.cm-app-chrome__navitem:hover,\n.cm-app-chrome__navitem:focus-visible,\n.cm-app-chrome__navitem[data-active=\"true\"],\n.cm-hud-button:hover,\n.cm-hud-button:focus-visible,\n.cm-hud-button[data-active=\"true\"] {\n  color: hsl(var(--foreground));\n  border-color: hsl(var(--primary) / 0.42);\n  outline: none;\n  transform: translate3d(0, -1px, 0);\n  box-shadow:\n    inset 0 0 24px hsl(var(--primary) / 0.075),\n    0 0 24px hsl(var(--primary) / 0.14),\n    0 0 18px hsl(var(--accent) / 0.08);\n}\n\n.cm-app-chrome__navitem[data-active=\"true\"] {\n  color: hsl(var(--primary));\n  border-color: hsl(var(--primary) / 0.52);\n  background:\n    radial-gradient(circle at 30% 14%, hsl(var(--primary) / 0.24), transparent 42%),\n    radial-gradient(circle at 78% 90%, hsl(var(--accent) / 0.18), transparent 44%),\n    linear-gradient(145deg, hsl(226 21% 25% / 0.58), hsl(221 50% 9% / 0.48));\n}\n\n.cm-app-chrome__navitem[data-active=\"true\"]::before {\n  opacity: 1;\n  transform: scale(1);\n}\n\n.cm-app-chrome__navitem-icon,\n.cm-hud-icon,\n.cm-app-nav__icon {\n  display: inline-flex;\n  width: 1.12rem;\n  height: 1.12rem;\n  align-items: center;\n  justify-content: center;\n  color: currentColor;\n}\n\n.cm-app-chrome__tooltip {\n  position: absolute;\n  inset-inline-start: calc(100% + 0.55rem);\n  top: 50%;\n  max-width: min(14rem, 52vw);\n  padding: 0.42rem 0.58rem;\n  border: 1px solid hsl(var(--primary) / 0.22);\n  border-radius: 999px;\n  background: hsl(221 50% 8% / 0.84);\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.64rem;\n  font-weight: 700;\n  letter-spacing: 0.1em;\n  line-height: 1;\n  text-transform: uppercase;\n  white-space: nowrap;\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.12);\n  opacity: 0;\n  pointer-events: none;\n  transform: translate3d(-0.18rem, -50%, 0);\n  transition:\n    opacity 150ms ease,\n    transform 150ms ease;\n}\n\n.cm-app-chrome__navitem:hover .cm-app-chrome__tooltip,\n.cm-app-chrome__navitem:focus-visible .cm-app-chrome__tooltip {\n  opacity: 1;\n  transform: translate3d(0, -50%, 0);\n}\n\n.cm-app-chrome__hud {\n  position: fixed;\n  inset-block-start: calc(env(safe-area-inset-top) + var(--cm-chrome-safe));\n  inset-inline: calc(env(safe-area-inset-left) + var(--cm-chrome-safe)) calc(env(safe-area-inset-right) + var(--cm-chrome-safe));\n  z-index: 60;\n  display: flex;\n  align-items: flex-start;\n  justify-content: flex-end;\n  gap: var(--cm-chrome-gap);\n  pointer-events: none;\n}\n\n.cm-app-chrome__hud-group {\n  container-type: inline-size;\n  display: flex;\n  width: min(100%, 68rem);\n  min-width: 0;\n  align-items: center;\n  justify-content: flex-end;\n  gap: var(--cm-chrome-gap);\n  flex-wrap: nowrap;\n  pointer-events: auto;\n}\n\n.cm-app-chrome__hud-item,\n.cm-app-chrome__hud-fold,\n.cm-app-chrome__search {\n  position: relative;\n  min-width: max-content;\n  flex: 0 0 auto;\n}\n\n.cm-app-chrome__search {\n  display: inline-flex;\n  min-width: var(--cm-hud-size);\n  align-items: center;\n  justify-content: flex-end;\n  gap: var(--cm-chrome-gap);\n}\n\n.cm-app-chrome__hud-item[data-priority=\"low\"] {\n  flex-shrink: 0;\n}\n\n.cm-hud-button {\n  display: inline-flex;\n  align-items: center;\n  width: auto;\n  max-width: min(15.5rem, 52vw);\n  justify-content: center;\n  gap: 0.52rem;\n  padding-inline: clamp(0.72rem, 1.4vw, 0.92rem);\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.72rem;\n  font-weight: 700;\n  letter-spacing: 0.06em;\n  line-height: 1;\n  text-transform: uppercase;\n  white-space: nowrap;\n}\n\n.cm-hud-button--icon,\n.cm-hud-button[data-icon-only=\"true\"] {\n  width: var(--cm-hud-size);\n  padding-inline: 0;\n}\n\n.cm-hud-value,\n.cm-hud-address {\n  display: inline-block;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.cm-hud-value {\n  color: hsl(var(--foreground));\n}\n\n.cm-hud-address {\n  color: hsl(var(--primary));\n  max-width: 8.8rem;\n}\n\n.cm-hud-wallet {\n  min-width: min(13.75rem, 42vw);\n  justify-content: flex-start;\n  padding-inline: 0.82rem 0.74rem;\n  background:\n    radial-gradient(circle at 14% 50%, hsl(var(--primary) / 0.18), transparent 34%),\n    radial-gradient(circle at 86% 100%, hsl(var(--accent) / 0.12), transparent 40%),\n    linear-gradient(145deg, hsl(226 21% 22% / 0.58), hsl(221 50% 8% / 0.48));\n}\n\n.cm-hud-wallet__icon {\n  color: hsl(var(--primary));\n  opacity: 0.92;\n}\n\n.cm-hud-wallet .cm-hud-value {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 0.76rem;\n  letter-spacing: 0.05em;\n}\n\n.cm-hud-wallet .cm-hud-address {\n  color: hsl(var(--primary) / 0.9);\n  font-size: 0.68rem;\n  font-weight: 650;\n  letter-spacing: 0.04em;\n}\n\n.cm-app-chrome__navselect {\n  width: var(--cm-hud-size);\n  min-width: var(--cm-hud-size);\n  max-width: var(--cm-hud-size);\n  padding-inline: 0;\n  pointer-events: auto;\n}\n\n.cm-app-chrome__navselect .cm-hud-value {\n  display: none;\n}\n\n.cm-hud-status {\n  width: 0.48rem;\n  height: 0.48rem;\n  border-radius: 999px;\n  background: hsl(var(--primary));\n  box-shadow: 0 0 12px hsl(var(--primary) / 0.62);\n  flex: 0 0 auto;\n}\n\n.cm-hud-status[data-tone=\"red\"] {\n  background: hsl(0 84% 66%);\n  box-shadow: 0 0 12px hsl(0 84% 66% / 0.54);\n}\n\n.cm-hud-status[data-tone=\"blue\"] {\n  background: hsl(211 100% 64%);\n  box-shadow: 0 0 12px hsl(211 100% 64% / 0.54);\n}\n\n.cm-hud-status[data-state=\"muted\"] {\n  background: hsl(var(--muted-foreground));\n  box-shadow: none;\n}\n\n.cm-hud-overflow {\n  display: none;\n}\n\n.cm-app-chrome__hud-popover {\n  position: absolute;\n  top: calc(100% + 0.58rem);\n  right: 0;\n  z-index: 90;\n  width: min(21rem, calc(100vw - var(--cm-chrome-safe) * 2));\n  max-height: min(74dvh, 34rem);\n  overflow: auto;\n  border: 1px solid hsl(var(--primary) / 0.2);\n  border-radius: 18px;\n  background:\n    radial-gradient(circle at 20% 0%, hsl(var(--primary) / 0.11), transparent 34%),\n    radial-gradient(circle at 92% 100%, hsl(var(--accent) / 0.12), transparent 36%),\n    linear-gradient(145deg, hsl(226 21% 20% / 0.78), hsl(221 50% 7% / 0.86));\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.07),\n    0 0 36px hsl(var(--primary) / 0.12);\n  backdrop-filter: blur(22px) saturate(1.16);\n}\n\n.cm-hud-menu {\n  border: 1px solid hsl(var(--primary) / 0.2);\n  border-radius: 16px;\n  background:\n    radial-gradient(circle at 20% 0%, hsl(var(--primary) / 0.11), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 20% / 0.82), hsl(221 50% 7% / 0.9));\n  color: hsl(var(--foreground));\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.07),\n    0 0 28px hsl(var(--primary) / 0.12);\n  backdrop-filter: blur(20px) saturate(1.14);\n}\n\n.cm-app-chrome__hud-popover--wide {\n  width: min(25rem, calc(100vw - var(--cm-chrome-safe) * 2));\n}\n\n.cm-app-chrome__hud-popover-body {\n  display: grid;\n  gap: 0.58rem;\n  padding: 0.75rem;\n}\n\n.cm-app-chrome__hud-popover-title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 0.82rem;\n  font-weight: 800;\n  letter-spacing: 0.04em;\n}\n\n.cm-app-chrome__hud-popover-copy {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.78rem;\n  line-height: 1.45;\n}\n\n.cm-app-chrome__hud-row {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 0.75rem;\n  min-height: 2.65rem;\n  padding: 0.42rem;\n  border-radius: 14px;\n  background: hsl(var(--primary) / 0.055);\n}\n\n.cm-app-chrome__hud-stack {\n  display: grid;\n  gap: 0.58rem;\n}\n\n.cm-search {\n  display: flex;\n  min-width: 0;\n  align-items: center;\n  gap: 0.6rem;\n  min-height: 2.55rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 999px;\n  background: hsl(221 50% 9% / 0.38);\n  padding: 0 0.85rem;\n  color: hsl(var(--muted-foreground));\n  box-shadow: inset 0 0 20px hsl(var(--primary) / 0.04);\n}\n\n.cm-search--hud {\n  width: 0;\n  max-width: min(24rem, calc(100vw - var(--cm-chrome-safe) * 2 - var(--cm-hud-size)));\n  min-height: var(--cm-hud-size);\n  padding-inline: 0;\n  border-width: 0;\n  opacity: 0;\n  overflow: hidden;\n  pointer-events: none;\n  transform: scaleX(0.92);\n  transform-origin: right center;\n  transition:\n    width 180ms ease,\n    padding-inline 180ms ease,\n    opacity 150ms ease,\n    transform 180ms ease,\n    border-color 180ms ease;\n}\n\n.cm-app-chrome__search[data-open=\"true\"] .cm-search--hud {\n  width: clamp(13rem, 29vw, 24rem);\n  padding-inline: 0.85rem;\n  border-width: 1px;\n  opacity: 1;\n  pointer-events: auto;\n  transform: scaleX(1);\n}\n\n.cm-search input,\n.cm-search__input {\n  min-width: 0;\n  flex: 1;\n  border: 0;\n  outline: none;\n  background: transparent;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.82rem;\n}\n\n.cm-search input::placeholder,\n.cm-search__input::placeholder {\n  color: hsl(var(--muted-foreground) / 0.72);\n}\n\n.cm-app-chrome__sidebar,\n.cm-app-chrome__topbar,\n.cm-app-chrome__mobilebar,\n.cm-app-chrome__drawer {\n  display: none;\n}\n\n.cm-app-chrome__brand {\n  display: none;\n}\n\n.cm-shell-panel--muted {\n  background:\n    linear-gradient(145deg, hsl(224 36% 13% / 0.36), hsl(221 50% 9% / 0.72)),\n    radial-gradient(circle at 18% 0%, hsl(var(--primary) / 0.06), transparent 34%);\n}\n\n.cm-shell-panel--ghost {\n  background: transparent;\n  box-shadow: none;\n}\n\n.cm-shell-panel__body {\n  padding: 1rem;\n}\n\n.cm-shell-page-header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 1rem 1.1rem;\n}\n\n.cm-shell-page-header__copy {\n  display: flex;\n  flex-direction: column;\n  gap: 0.32rem;\n}\n\n.cm-shell-page-header__eyebrow {\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  letter-spacing: 0.18em;\n  text-transform: uppercase;\n}\n\n.cm-shell-page-header__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: clamp(1.12rem, 1.65vw, 1.52rem);\n  letter-spacing: 0.04em;\n  line-height: 1.02;\n}\n\n.cm-shell-page-header__subtitle {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.88rem;\n  line-height: 1.45;\n  max-width: 48rem;\n}\n\n.cm-shell-stat-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));\n  gap: 0.8rem;\n}\n\n.cm-shell-stat {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  padding: 0.85rem 0.9rem;\n}\n\n.cm-shell-stat__label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.66rem;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n}\n\n.cm-shell-stat__value {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 1rem;\n  letter-spacing: 0.04em;\n}\n\n.cm-shell-stat__hint {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.74rem;\n}\n\n.cm-shell-tab-strip {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.35rem;\n  padding: 0.25rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 999px;\n  background: hsl(var(--muted) / 0.14);\n  backdrop-filter: blur(12px);\n}\n\n.cm-shell-tab {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.5rem;\n  min-height: 2.1rem;\n  padding: 0 0.85rem;\n  border-radius: 999px;\n  border: 1px solid transparent;\n  background: transparent;\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  cursor: pointer;\n  transition:\n    background-color 180ms ease,\n    color 180ms ease,\n    border-color 180ms ease,\n    box-shadow 180ms ease;\n}\n\n.cm-shell-tab:hover {\n  color: hsl(var(--foreground));\n  border-color: hsl(var(--primary) / 0.18);\n}\n\n.cm-shell-tab[data-active=\"true\"],\n.cm-shell-tab[data-state=\"active\"] {\n  background:\n    linear-gradient(180deg, hsl(var(--primary) / 0.18), hsl(var(--primary) / 0.1));\n  border-color: hsl(var(--primary) / 0.36);\n  color: hsl(var(--foreground));\n  box-shadow:\n    inset 0 1px 0 hsl(var(--primary) / 0.16),\n    0 0 18px hsl(var(--primary) / 0.14);\n}\n\n.cm-shell-notice {\n  display: flex;\n  align-items: center;\n  gap: 0.7rem;\n  padding: 0.8rem 0.95rem;\n  border-radius: 12px;\n  border: 1px solid;\n  backdrop-filter: blur(12px);\n}\n\n.cm-shell-notice--info {\n  background: hsl(var(--primary) / 0.08);\n  border-color: hsl(var(--primary) / 0.22);\n  color: hsl(var(--foreground));\n}\n\n.cm-shell-notice--success {\n  background: hsl(148 75% 24% / 0.18);\n  border-color: hsl(148 75% 46% / 0.3);\n  color: hsl(var(--foreground));\n}\n\n.cm-shell-notice--warning {\n  background: hsl(42 100% 48% / 0.12);\n  border-color: hsl(42 100% 52% / 0.25);\n  color: hsl(var(--foreground));\n}\n\n.cm-shell-notice--error {\n  background: hsl(var(--destructive) / 0.13);\n  border-color: hsl(var(--destructive) / 0.28);\n  color: hsl(var(--foreground));\n}\n\n.cm-shell-banner {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 0.95rem 1rem;\n}\n\n.cm-shell-banner__copy {\n  display: flex;\n  flex-direction: column;\n  gap: 0.35rem;\n}\n\n.cm-shell-banner__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 0.98rem;\n  letter-spacing: 0.03em;\n}\n\n.cm-shell-banner__subtitle {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.84rem;\n  line-height: 1.45;\n}\n\n.cm-shell-empty {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 0.75rem;\n  min-height: 18rem;\n  padding: 2rem 1.25rem;\n  text-align: center;\n}\n\n.cm-shell-empty__icon {\n  color: hsl(var(--primary));\n}\n\n.cm-shell-empty__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 1.08rem;\n  letter-spacing: 0.04em;\n}\n\n.cm-shell-empty__description {\n  color: hsl(var(--muted-foreground));\n  max-width: 38rem;\n  line-height: 1.55;\n}\n\n.cm-shell-modal-overlay {\n  position: fixed;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 1rem;\n  background:\n    radial-gradient(circle at 50% 24%, hsl(var(--primary) / 0.08), transparent 28rem),\n    hsl(240 30% 2% / 0.82);\n  backdrop-filter: blur(12px);\n  z-index: 100;\n}\n\n.cm-shell-modal {\n  width: min(100%, 46rem);\n  max-height: min(90vh, 56rem);\n  overflow: auto;\n  border-radius: 12px;\n}\n\n.cm-shell-modal__header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 1rem 1rem 0;\n}\n\n.cm-shell-modal__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 1rem;\n  letter-spacing: 0.04em;\n}\n\n.cm-shell-modal__subtitle {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.84rem;\n  margin-top: 0.3rem;\n  line-height: 1.45;\n}\n\n.cm-shell-modal__body {\n  padding: 1rem;\n}\n\n@container (max-width: 42rem) {\n  .cm-app-chrome__hud-item[data-priority=\"low\"] {\n    display: none;\n  }\n\n  .cm-hud-overflow {\n    display: inline-flex;\n  }\n}\n\n@container (max-width: 31rem) {\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-hud-address,\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-hud-label {\n    display: none;\n  }\n\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-hud-wallet .cm-hud-value {\n    display: none;\n  }\n\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-hud-wallet {\n    width: var(--cm-hud-size);\n    min-width: var(--cm-hud-size);\n    padding-inline: 0;\n  }\n\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-session-trigger {\n    width: auto;\n    min-width: max-content;\n    max-width: min(12rem, 58vw);\n    padding-inline: 0.72rem;\n  }\n}\n\n@media (max-width: 820px) {\n  .cm-shell-page-header,\n  .cm-shell-banner {\n    flex-direction: column;\n    align-items: stretch;\n  }\n\n  .cm-shell-stat-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .cm-shell-tab-strip {\n    width: 100%;\n    overflow-x: auto;\n  }\n\n  .cm-app-chrome__main {\n    padding:\n      calc(env(safe-area-inset-top) + clamp(4.25rem, 14vw, 4.85rem))\n      clamp(0.75rem, 4.2vw, 1.05rem)\n      calc(env(safe-area-inset-bottom) + clamp(5.55rem, 16vw, 6.55rem));\n  }\n\n  .cm-app-chrome__hud {\n    justify-content: flex-end;\n  }\n\n  .cm-app-chrome__hud-group {\n    width: min(100%, calc(100vw - var(--cm-chrome-safe) * 2));\n  }\n\n  .cm-app-chrome__hud-item,\n  .cm-app-chrome__hud-fold,\n  .cm-app-chrome__search {\n    min-width: auto;\n  }\n\n  .cm-app-chrome__navdock {\n    inset-block-start: auto;\n    inset-block-end: calc(env(safe-area-inset-bottom) + var(--cm-chrome-safe));\n    inset-inline: calc(env(safe-area-inset-left) + var(--cm-chrome-safe)) calc(env(safe-area-inset-right) + var(--cm-chrome-safe));\n    display: flex;\n    justify-content: center;\n    overflow-x: auto;\n    padding: 0.22rem;\n    transform: none;\n    scrollbar-width: none;\n  }\n\n  .cm-app-chrome__navdock::-webkit-scrollbar {\n    display: none;\n  }\n\n  .cm-app-chrome__navgroup,\n  .cm-app-chrome__navutility {\n    display: flex;\n    gap: var(--cm-chrome-gap);\n  }\n\n  .cm-app-chrome__navutility {\n    margin-top: 0;\n    padding-top: 0;\n  }\n\n  .cm-app-chrome__navitem {\n    flex: 0 0 auto;\n  }\n\n  .cm-app-chrome__navitem::before {\n    inset: -0.16rem;\n    width: auto;\n    height: auto;\n    transform: scale(0.72);\n  }\n\n  .cm-app-chrome__navitem[data-active=\"true\"]::before {\n    transform: scale(1);\n  }\n\n  .cm-app-chrome__tooltip {\n    display: none;\n  }\n\n  .cm-hud-address,\n  .cm-hud-label {\n    display: none;\n  }\n\n  .cm-app-chrome__hud-item[data-priority=\"low\"] {\n    display: none;\n  }\n\n  .cm-hud-overflow {\n    display: inline-flex;\n  }\n\n  .cm-app-chrome__hud-group[data-search-open=\"true\"] .cm-app-chrome__hud-item,\n  .cm-app-chrome__hud-group[data-search-open=\"true\"] .cm-app-chrome__hud-fold {\n    display: none;\n  }\n\n  .cm-app-chrome__search[data-open=\"true\"] {\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n\n  .cm-app-chrome__search[data-open=\"true\"] .cm-search--hud {\n    width: min(100%, calc(100vw - var(--cm-chrome-safe) * 2 - var(--cm-hud-size) - var(--cm-chrome-gap)));\n  }\n\n  .cm-workspace-canvas {\n    padding: clamp(0.7rem, 3.6vw, 1rem);\n  }\n\n  .cm-control-rail {\n    align-items: stretch;\n    flex-direction: column;\n  }\n\n  .cm-control-rail__main,\n  .cm-control-rail__actions,\n  .cm-control-rail__tabs {\n    width: 100%;\n    flex: 1 1 auto;\n    justify-content: stretch;\n  }\n\n  .cm-control-rail__tabs > *,\n  .cm-control-rail__actions > * {\n    min-width: 0;\n  }\n\n  .cm-responsive-pair,\n  .cm-responsive-pair--reverse {\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  .cm-setting-row {\n    grid-template-columns: auto minmax(0, 1fr);\n  }\n\n  .cm-setting-row__control {\n    grid-column: 1 / -1;\n    justify-content: stretch;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .cm-choice-card,\n  .cm-app-chrome__navitem,\n  .cm-hud-button,\n  .cm-shell-button {\n    transition-duration: 1ms;\n  }\n}\n\n/* \u2500\u2500 Form Controls \u2500\u2500 */\n.cm-form-group {\n  margin-bottom: 14px;\n}\n\n.cm-form-group label {\n  display: block;\n  margin-bottom: 6px;\n  font-family: var(--font-mono), monospace;\n  font-size: 11px;\n  color: hsl(var(--muted-foreground));\n  font-weight: 600;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n}\n\n.cm-form-input,\n.cm-form-textarea,\n.cm-form-select {\n  width: 100%;\n  padding: 10px 12px;\n  background: hsl(222 47% 7% / 0.84);\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 10px;\n  color: hsl(var(--foreground));\n  font-size: 14px;\n  font-family: var(--font-sans), sans-serif;\n  transition: border-color 0.2s, box-shadow 0.2s, background-color 0.2s;\n}\n\n.cm-form-input:focus,\n.cm-form-textarea:focus,\n.cm-form-select:focus {\n  outline: none;\n  border-color: hsl(var(--primary));\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.24),\n    inset 0 0 20px hsl(var(--primary) / 0.06);\n  background: hsl(var(--background) / 0.96);\n}\n\n.cm-form-input:disabled,\n.cm-form-textarea:disabled,\n.cm-form-select:disabled {\n  opacity: 0.6;\n  cursor: not-allowed;\n}\n\n.cm-form-textarea {\n  min-height: 80px;\n  resize: vertical;\n}\n\n/* \u2500\u2500 Notification / Alert \u2500\u2500 */\n.cm-notification {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 12px 16px;\n  border-radius: 8px;\n  font-size: 14px;\n  font-weight: 500;\n  animation: cm-slide-in 0.2s ease;\n}\n\n@keyframes cm-slide-in {\n  from { opacity: 0; transform: translateY(-10px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n\n.cm-notification--success {\n  background: hsl(142 71% 45% / 0.15);\n  color: hsl(142 71% 45%);\n  border: 1px solid hsl(142 71% 45%);\n}\n\n.cm-notification--error {\n  background: hsl(var(--destructive) / 0.15);\n  color: hsl(var(--destructive));\n  border: 1px solid hsl(var(--destructive));\n}\n\n.cm-notification--warning {\n  background: hsl(42 100% 48% / 0.12);\n  color: hsl(42 100% 52%);\n  border: 1px solid hsl(42 100% 52% / 0.5);\n}\n\n.cm-notification--info {\n  background: hsl(var(--primary) / 0.08);\n  border: 1px solid hsl(var(--primary) / 0.22);\n  color: hsl(var(--foreground));\n}\n\n/* \u2500\u2500 Navigation \u2500\u2500 */\n.cm-nav {\n  display: flex;\n  gap: 4px;\n  padding: 12px 0 0;\n}\n\n.cm-nav-btn {\n  padding: 8px 14px;\n  background: transparent;\n  border: 1px solid transparent;\n  color: hsl(var(--muted-foreground));\n  cursor: pointer;\n  border-radius: var(--radius, 0.25rem);\n  font-size: 11px;\n  font-weight: 600;\n  font-family: var(--font-mono), monospace;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  transition: all 0.2s;\n}\n\n.cm-nav-btn:hover {\n  color: hsl(var(--foreground));\n  background: hsl(var(--muted));\n  border-color: hsl(var(--primary) / 0.18);\n}\n\n.cm-nav-btn[data-active=\"true\"],\n.cm-nav-btn.active {\n  color: hsl(var(--primary));\n  background: hsl(var(--primary) / 0.12);\n  border-color: hsl(var(--primary) / 0.28);\n}\n\n/* \u2500\u2500 Loading State \u2500\u2500 */\n.cm-loading-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 60px;\n  color: hsl(var(--muted-foreground));\n}\n\n.cm-spinner {\n  animation: cm-spin 1s linear infinite;\n}\n\n@keyframes cm-spin {\n  from { transform: rotate(0deg); }\n  to   { transform: rotate(360deg); }\n}\n\n/* \u2500\u2500 Badge / Tag \u2500\u2500 */\n.cm-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 3px 8px;\n  border-radius: 4px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.03em;\n}\n\n.cm-badge--primary {\n  background: hsl(var(--primary) / 0.15);\n  color: hsl(var(--primary));\n}\n\n.cm-badge--accent {\n  background: hsl(var(--accent) / 0.15);\n  color: hsl(var(--accent));\n}\n\n.cm-badge--muted {\n  background: hsl(var(--muted));\n  color: hsl(var(--muted-foreground));\n}\n\n.cm-badge--success {\n  background: hsl(142 71% 45% / 0.15);\n  color: hsl(142 71% 45%);\n}\n\n.cm-badge--destructive {\n  background: hsl(var(--destructive) / 0.15);\n  color: hsl(var(--destructive));\n}\n\n/* \u2500\u2500 Search Bar \u2500\u2500 */\n.cm-search-bar {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 10px 12px;\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius, 0.25rem);\n}\n\n.cm-search-bar__icon {\n  color: hsl(var(--muted-foreground));\n  flex-shrink: 0;\n}\n\n.cm-search-bar__input {\n  flex: 1;\n  background: transparent;\n  border: none;\n  color: hsl(var(--foreground));\n  font-size: 14px;\n  font-family: var(--font-sans), sans-serif;\n  outline: none;\n}\n\n.cm-search-bar__input::placeholder {\n  color: hsl(var(--muted-foreground));\n}\n\n/* \u2500\u2500 Filter Buttons \u2500\u2500 */\n.cm-filter-btn {\n  padding: 6px 14px;\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: 999px;\n  color: hsl(var(--muted-foreground));\n  font-size: 11px;\n  font-family: var(--font-mono), monospace;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  cursor: pointer;\n  transition: all 0.2s;\n}\n\n.cm-filter-btn:hover {\n  border-color: hsl(var(--primary));\n  color: hsl(var(--foreground));\n}\n\n.cm-filter-btn[data-active=\"true\"],\n.cm-filter-btn.active {\n  background: hsl(var(--primary));\n  color: hsl(var(--primary-foreground));\n  border-color: hsl(var(--primary));\n}\n\n/* \u2500\u2500 Icon Button \u2500\u2500 */\n.cm-icon-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: 8px;\n  background: transparent;\n  border: 1px solid hsl(var(--border));\n  color: hsl(var(--muted-foreground));\n  border-radius: var(--radius, 0.25rem);\n  cursor: pointer;\n  font-family: var(--font-sans), sans-serif;\n  transition: all 0.2s;\n}\n\n.cm-icon-btn:hover {\n  background: hsl(var(--muted));\n  color: hsl(var(--foreground));\n}\n\n.cm-icon-btn--danger:hover {\n  border-color: hsl(var(--destructive));\n  color: hsl(var(--destructive));\n}\n\n/* \u2500\u2500 Settings Section \u2500\u2500 */\n.cm-settings-section {\n  margin-bottom: 24px;\n  padding: 16px;\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: max(var(--radius, 0.25rem), 0.3rem);\n}\n\n.cm-settings-section__title {\n  font-size: 14px;\n  font-weight: 600;\n  margin-bottom: 16px;\n  color: hsl(var(--muted-foreground));\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n.cm-settings-section__hint {\n  margin-bottom: 14px;\n  font-size: 13px;\n  color: hsl(var(--muted-foreground));\n}\n\n/* \u2500\u2500 Pagination \u2500\u2500 */\n.cm-pagination {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 16px;\n  margin-top: 32px;\n  padding-top: 24px;\n  border-top: 1px solid hsl(var(--border));\n}\n\n.cm-page-btn {\n  padding: 8px 16px;\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: 6px;\n  color: hsl(var(--muted-foreground));\n  cursor: pointer;\n  font-size: 13px;\n  font-family: var(--font-sans), sans-serif;\n  transition: all 0.2s;\n}\n\n.cm-page-btn:hover:not(:disabled) {\n  background: hsl(var(--muted));\n  color: hsl(var(--foreground));\n}\n\n.cm-page-btn:disabled {\n  opacity: 0.4;\n  cursor: not-allowed;\n}\n\n.cm-page-info {\n  font-size: 13px;\n  color: hsl(var(--muted-foreground));\n}\n\n/* \u2500\u2500 Card \u2500\u2500 */\n.cm-card {\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: 10px;\n  padding: 18px;\n  transition: all 0.2s;\n}\n\n.cm-card:hover {\n  border-color: hsl(var(--border) / 0.8);\n  transform: translateY(-2px);\n  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);\n}\n\n/* \u2500\u2500 Code Block \u2500\u2500 */\n.cm-code-block {\n  display: block;\n  padding: 10px 12px;\n  background: hsl(var(--muted));\n  border-radius: 6px;\n  font-size: 12px;\n  color: hsl(var(--primary));\n  word-break: break-all;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n/* \u2500\u2500 Error / Empty States \u2500\u2500 */\n.cm-error-message {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px;\n  background: hsl(var(--destructive) / 0.15);\n  border: 1px solid hsl(var(--destructive));\n  border-radius: 8px;\n  color: hsl(var(--destructive));\n}\n\n/* \u2500\u2500 Playground / Chat Primitives \u2500\u2500 */\n.cm-playground {\n  container-type: inline-size;\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  height: min(58rem, calc(100dvh - clamp(8.5rem, 14vw, 10rem)));\n  min-height: 34rem;\n  overflow: hidden;\n  border-radius: 16px;\n}\n\n.cm-playground__toolbar,\n.cm-playground__chat-toolbar,\n.cm-playground__caps-row {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n  gap: clamp(0.4rem, 1.4cqi, 0.8rem);\n}\n\n.cm-playground__toolbar {\n  flex: 0 0 auto;\n  justify-content: space-between;\n  padding: clamp(0.5rem, 1.6cqi, 0.8rem);\n  border: 1px solid hsl(var(--primary) / 0.14);\n  border-radius: 16px;\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.38), hsl(221 50% 9% / 0.32)),\n    radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.1), transparent 36%);\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.055);\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-playground__title {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.42rem;\n  min-width: 0;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: clamp(0.68rem, 1.8cqi, 0.86rem);\n  font-weight: 800;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n.cm-playground__title-icon {\n  width: 1rem;\n  height: 1rem;\n  color: hsl(var(--primary));\n  filter: drop-shadow(0 0 10px hsl(var(--primary) / 0.44));\n}\n\n.cm-playground__toolbar-right {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 0.45rem;\n  min-width: 0;\n  flex-wrap: wrap;\n}\n\n.cm-playground__grid {\n  flex: 1;\n  min-height: 0;\n  display: grid;\n  grid-template-columns: minmax(0, 1fr);\n  gap: clamp(0.75rem, 1.8cqi, 1rem);\n  padding-top: clamp(0.75rem, 1.8cqi, 1rem);\n}\n\n@container (min-width: 62rem) {\n  .cm-playground__grid {\n    grid-template-columns: minmax(0, 2fr) minmax(19rem, 0.82fr);\n  }\n\n  .cm-playground__grid--collapsed {\n    grid-template-columns: minmax(0, 1fr);\n  }\n}\n\n.cm-playground__chat-cell,\n.cm-playground__pane-cell {\n  min-width: 0;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.cm-playground__chat-cell {\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 16px;\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.34), hsl(221 50% 9% / 0.26)),\n    hsl(224 36% 13% / 0.18);\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.045);\n  backdrop-filter: blur(16px) saturate(1.1);\n}\n\n.cm-playground__pane-cell {\n  display: none;\n}\n\n@container (min-width: 62rem) {\n  .cm-playground__pane-cell {\n    display: flex;\n  }\n}\n\n.cm-playground__chat-toolbar {\n  flex: 0 0 auto;\n  padding: clamp(0.55rem, 1.5cqi, 0.85rem);\n  border-bottom: 1px solid hsl(var(--primary) / 0.1);\n  background: hsl(221 50% 9% / 0.24);\n  flex-wrap: wrap;\n}\n\n.cm-playground__filter-wrap {\n  display: flex;\n  align-items: center;\n  gap: 0.45rem;\n  min-width: min(100%, 13rem);\n  flex: 1 1 13rem;\n  flex-wrap: wrap;\n}\n\n.cm-playground__chips {\n  display: flex;\n  align-items: center;\n  gap: 0.42rem;\n  min-width: 0;\n  flex: 1 1 18rem;\n  overflow: hidden;\n}\n\n.cm-playground__chip-section {\n  display: flex;\n  align-items: center;\n  gap: 0.36rem;\n  min-width: 0;\n  overflow: auto hidden;\n  scrollbar-width: none;\n}\n\n.cm-playground__chip-section::-webkit-scrollbar {\n  display: none;\n}\n\n.cm-playground__chip-section--types {\n  flex: 1 1 auto;\n}\n\n.cm-playground__chip-section--providers {\n  flex: 0 1 38%;\n}\n\n.cm-playground__chip-label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.62rem;\n  font-weight: 800;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  white-space: nowrap;\n}\n\n.cm-playground__divider {\n  width: 1px;\n  align-self: stretch;\n  min-height: 1.45rem;\n  background: linear-gradient(180deg, transparent, hsl(var(--primary) / 0.18), transparent);\n  flex: 0 0 auto;\n}\n\n.cm-playground__filter-select {\n  min-width: 0;\n  flex: 1 1 8rem;\n  min-height: 2.15rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 999px;\n  background: hsl(221 50% 9% / 0.46);\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.72rem;\n  padding: 0 0.75rem;\n}\n\n.cm-playground__filter-select:hover,\n.cm-playground__filter-select:focus,\n.cm-playground__filter-select--active {\n  outline: none;\n  border-color: hsl(var(--primary) / 0.42);\n  box-shadow: 0 0 16px hsl(var(--primary) / 0.08);\n}\n\n.cm-playground__model-count,\n.cm-playground__caps-label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n  white-space: nowrap;\n}\n\n.cm-playground__caps-row {\n  flex: 0 0 auto;\n  padding: 0.45rem clamp(0.55rem, 1.5cqi, 0.85rem);\n  border-bottom: 1px solid hsl(var(--primary) / 0.08);\n  overflow: auto hidden;\n}\n\n.cm-playground__cap-tag,\n.cm-playground__chip,\n.cm-playground__badge,\n.cm-model-badge,\n.cm-tool-chip,\n.cm-receipt-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.35rem;\n  border: 1px solid hsl(var(--primary) / 0.18);\n  border-radius: 999px;\n  background: hsl(221 50% 9% / 0.38);\n  color: hsl(var(--foreground) / 0.78);\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 700;\n  line-height: 1;\n  text-transform: uppercase;\n  transition:\n    transform 160ms ease,\n    border-color 180ms ease,\n    box-shadow 180ms ease,\n    color 180ms ease,\n    background-color 180ms ease;\n}\n\n.cm-playground__cap-tag {\n  min-height: 1.55rem;\n  padding: 0 0.58rem;\n}\n\n.cm-playground__chip {\n  min-height: 1.9rem;\n  max-width: min(13rem, 42vw);\n  flex: 0 0 auto;\n  padding: 0 0.58rem;\n  white-space: nowrap;\n}\n\n.cm-playground__chip-icon {\n  width: 0.78rem;\n  height: 0.78rem;\n  flex: 0 0 auto;\n}\n\n.cm-playground__chip--type-text {\n  border-color: hsl(188 95% 43% / 0.26);\n  background: hsl(188 95% 43% / 0.08);\n  color: hsl(188 95% 74%);\n}\n\n.cm-playground__chip--type-image {\n  border-color: hsl(292 85% 55% / 0.28);\n  background: hsl(292 85% 55% / 0.09);\n  color: hsl(292 85% 78%);\n}\n\n.cm-playground__chip--type-audio {\n  border-color: hsl(148 75% 46% / 0.28);\n  background: hsl(148 75% 46% / 0.09);\n  color: hsl(148 75% 72%);\n}\n\n.cm-playground__chip--type-video {\n  border-color: hsl(42 100% 52% / 0.3);\n  background: hsl(42 100% 52% / 0.09);\n  color: hsl(42 100% 72%);\n}\n\n.cm-playground__chip--type-embedding,\n.cm-playground__chip--type-conversational {\n  border-color: hsl(211 100% 64% / 0.3);\n  background: hsl(211 100% 64% / 0.09);\n  color: hsl(211 100% 78%);\n}\n\n.cm-playground__chip--type-classification,\n.cm-playground__chip--type-translation,\n.cm-playground__chip--type-summarization,\n.cm-playground__chip--type-research {\n  border-color: hsl(270 80% 68% / 0.28);\n  background: hsl(270 80% 68% / 0.09);\n  color: hsl(270 80% 82%);\n}\n\n.cm-playground__chip--provider {\n  border-color: hsl(var(--primary) / 0.18);\n  background: hsl(221 50% 9% / 0.42);\n}\n\n.cm-playground__badge,\n.cm-model-badge {\n  min-width: 0;\n  max-width: min(100%, 24rem);\n  min-height: 2.2rem;\n  padding: 0 0.72rem;\n  cursor: pointer;\n}\n\n.cm-playground__badge:hover,\n.cm-playground__badge:focus-visible,\n.cm-model-badge:hover,\n.cm-model-badge:focus-visible,\n.cm-playground__chip:hover,\n.cm-playground__chip:focus-visible,\n.cm-playground__chip--active {\n  transform: translateY(-1px);\n  outline: none;\n  border-color: hsl(var(--primary) / 0.44);\n  background: hsl(var(--primary) / 0.09);\n  color: hsl(var(--foreground));\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.12);\n}\n\n.cm-model-badge[data-placeholder=\"true\"] {\n  color: hsl(var(--muted-foreground));\n  font-weight: 500;\n}\n\n.cm-playground__badge-dot,\n.cm-model-badge__dot {\n  width: 0.48rem;\n  height: 0.48rem;\n  border-radius: 999px;\n  background: hsl(var(--primary));\n  box-shadow: 0 0 12px hsl(var(--primary) / 0.56);\n  flex: 0 0 auto;\n}\n\n.cm-playground__badge-name,\n.cm-model-badge__name {\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.cm-playground__badge-price,\n.cm-playground__badge-shortcut,\n.cm-model-badge__price,\n.cm-model-badge__shortcut,\n.cm-playground__chip-count {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.62rem;\n}\n\n.cm-playground__pane-toggle,\n.cm-playground__pane-expand {\n  display: inline-grid;\n  place-items: center;\n  border: 1px solid hsl(var(--primary) / 0.22);\n  background: hsl(221 50% 9% / 0.72);\n  color: hsl(var(--primary));\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.08);\n  cursor: pointer;\n}\n\n.cm-playground__pane-toggle {\n  position: absolute;\n  left: -0.7rem;\n  top: 0.85rem;\n  z-index: 4;\n  width: 1.55rem;\n  height: 1.55rem;\n  border-radius: 999px;\n}\n\n.cm-playground__pane-expand {\n  display: none;\n  position: fixed;\n  right: 0.2rem;\n  top: 50%;\n  z-index: 45;\n  width: 2rem;\n  height: 3.25rem;\n  border-radius: 999px 0 0 999px;\n}\n\n@container (min-width: 62rem) {\n  .cm-playground__pane-expand {\n    display: inline-grid;\n  }\n}\n\n.cm-playground__cmd-backdrop,\n.cm-command-overlay {\n  position: fixed;\n  inset: 0;\n  z-index: 90;\n  display: flex;\n  align-items: flex-start;\n  justify-content: center;\n  padding: max(8vh, 4rem) 1rem 1rem;\n  background:\n    radial-gradient(circle at 50% 18%, hsl(var(--primary) / 0.09), transparent 30rem),\n    hsl(240 30% 2% / 0.72);\n  backdrop-filter: blur(14px);\n}\n\n.cm-playground__cmd-panel,\n.cm-command-panel {\n  width: min(42rem, 100%);\n  max-height: min(70dvh, 42rem);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.24);\n  border-radius: 18px;\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.58), hsl(221 50% 9% / 0.78)),\n    hsl(var(--background));\n  box-shadow:\n    0 0 44px hsl(var(--primary) / 0.12),\n    inset 0 1px 0 hsl(0 0% 100% / 0.08);\n}\n\n.cm-playground__cmd-header,\n.cm-playground__cmd-footer,\n.cm-command-header,\n.cm-command-footer {\n  flex: 0 0 auto;\n  padding: 0.75rem 0.95rem;\n  border-color: hsl(var(--primary) / 0.12);\n}\n\n.cm-playground__cmd-header,\n.cm-command-header {\n  border-bottom: 1px solid hsl(var(--primary) / 0.12);\n}\n\n.cm-playground__cmd-footer,\n.cm-command-footer {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 0.75rem;\n  border-top: 1px solid hsl(var(--primary) / 0.12);\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  flex-wrap: wrap;\n}\n\n.cm-playground__cmd-input,\n.cm-command-input {\n  width: 100%;\n  border: 0;\n  outline: none;\n  background: transparent;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: clamp(0.92rem, 2.2vw, 1.1rem);\n}\n\n.cm-playground__cmd-list,\n.cm-command-list {\n  flex: 1;\n  min-height: 0;\n  overflow: auto;\n  padding: 0.35rem;\n}\n\n.cm-playground__cmd-group,\n.cm-command-group {\n  padding: 0.55rem 0.7rem 0.28rem;\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 800;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n}\n\n.cm-playground__cmd-item,\n.cm-command-item {\n  display: flex;\n  align-items: center;\n  gap: 0.65rem;\n  min-height: 2.55rem;\n  border: 1px solid transparent;\n  border-radius: 12px;\n  padding: 0 0.75rem;\n  cursor: pointer;\n}\n\n.cm-playground__cmd-item:hover,\n.cm-playground__cmd-item--selected,\n.cm-playground__cmd-item--current,\n.cm-command-item:hover,\n.cm-command-item[data-selected=\"true\"],\n.cm-command-item[data-current=\"true\"] {\n  border-color: hsl(var(--primary) / 0.22);\n  background: hsl(var(--primary) / 0.08);\n}\n\n.cm-playground__cmd-item-name,\n.cm-command-item__name {\n  min-width: 0;\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.82rem;\n}\n\n.cm-playground__cmd-item-meta,\n.cm-playground__cmd-footer-hints,\n.cm-command-item__meta,\n.cm-command-footer__hints {\n  display: flex;\n  align-items: center;\n  gap: 0.4rem;\n  flex-wrap: wrap;\n}\n\n.cm-playground__cmd-item-provider,\n.cm-playground__cmd-item-type,\n.cm-playground__cmd-item-price,\n.cm-playground__cmd-hint kbd,\n.cm-command-item__provider,\n.cm-command-item__type,\n.cm-command-item__price,\n.cm-command-hint kbd {\n  border-radius: 999px;\n  background: hsl(221 50% 9% / 0.52);\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.62rem;\n  padding: 0.22rem 0.45rem;\n}\n\n.cm-playground__cmd-empty,\n.cm-command-empty {\n  padding: 2rem 1rem;\n  color: hsl(var(--muted-foreground));\n  text-align: center;\n}\n\n.cm-chat {\n  display: flex;\n  min-width: 0;\n  min-height: 0;\n  flex-direction: column;\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 16px;\n  background: hsl(221 50% 9% / 0.24);\n}\n\n.cm-chat--bare {\n  border: 0;\n  border-radius: 0;\n  background: transparent;\n}\n\n.cm-chat__header,\n.cm-chat__activity,\n.cm-chat__composer {\n  flex: 0 0 auto;\n  border-color: hsl(var(--primary) / 0.1);\n}\n\n.cm-chat__header {\n  display: flex;\n  align-items: center;\n  gap: 0.55rem;\n  padding: 0.75rem 0.9rem;\n  border-bottom: 1px solid hsl(var(--primary) / 0.1);\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n}\n\n.cm-chat__body {\n  position: relative;\n  flex: 1;\n  min-height: 0;\n  overflow: auto;\n  padding: clamp(0.85rem, 2cqi, 1.15rem);\n}\n\n.cm-chat__empty {\n  display: grid;\n  place-items: center;\n  gap: 0.35rem;\n  min-height: 14rem;\n  color: hsl(var(--muted-foreground));\n  text-align: center;\n}\n\n.cm-chat__messages {\n  display: grid;\n  gap: 1rem;\n}\n\n.cm-chat-message {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.7rem;\n  min-width: 0;\n}\n\n.cm-chat-message--user {\n  justify-content: flex-end;\n}\n\n.cm-chat-message__avatar {\n  width: 2rem;\n  height: 2rem;\n  flex: 0 0 auto;\n}\n\n.cm-chat-message__avatar-assistant,\n.cm-chat-message__avatar-user {\n  background: hsl(var(--primary) / 0.14);\n  color: hsl(var(--primary));\n}\n\n.cm-chat-message__avatar-user {\n  background: hsl(var(--accent) / 0.15);\n  color: hsl(var(--accent));\n}\n\n.cm-chat-message__bubble {\n  position: relative;\n  max-width: min(44rem, 82%);\n  min-width: 0;\n  border: 1px solid hsl(var(--primary) / 0.14);\n  border-radius: 16px;\n  padding: 0.75rem 0.85rem;\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.34), hsl(221 50% 9% / 0.28));\n  color: hsl(var(--foreground));\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.045);\n}\n\n.cm-chat-message__bubble--user {\n  border-color: hsl(var(--accent) / 0.22);\n  background:\n    linear-gradient(145deg, hsl(var(--accent) / 0.24), hsl(var(--primary) / 0.08));\n}\n\n.cm-chat-message__actions {\n  position: absolute;\n  right: 0;\n  top: -2.1rem;\n  display: none;\n  align-items: center;\n  gap: 0.25rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 999px;\n  background: hsl(var(--background) / 0.86);\n  padding: 0.18rem;\n  backdrop-filter: blur(12px);\n}\n\n.cm-chat-message__bubble:hover .cm-chat-message__actions,\n.cm-chat-message__bubble:focus-within .cm-chat-message__actions {\n  display: flex;\n}\n\n.cm-chat__activity {\n  display: flex;\n  align-items: center;\n  gap: 0.55rem;\n  border-top: 1px dashed hsl(var(--primary) / 0.16);\n  background: hsl(221 50% 9% / 0.34);\n  padding: 0.55rem 0.8rem;\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.72rem;\n}\n\n.cm-chat__composer {\n  border-top: 1px solid hsl(var(--primary) / 0.1);\n  padding: clamp(0.7rem, 1.7cqi, 0.9rem);\n}\n\n.cm-chat__attachments {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.5rem;\n  margin-bottom: 0.6rem;\n}\n\n.cm-chat__attachment {\n  position: relative;\n  display: grid;\n  width: 3rem;\n  height: 3rem;\n  place-items: center;\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 12px;\n  background: hsl(221 50% 9% / 0.48);\n}\n\n.cm-chat__composer-row {\n  display: flex;\n  align-items: flex-end;\n  gap: 0.55rem;\n  min-width: 0;\n}\n\n.cm-chat__composer-row textarea {\n  min-height: 2.55rem;\n  max-height: calc(1.45em * 4 + 1rem);\n  overflow-y: auto;\n  border-color: hsl(var(--primary) / 0.16);\n  border-radius: 14px;\n  background: hsl(221 50% 9% / 0.4);\n}\n\n.cm-chat__jump {\n  position: sticky;\n  bottom: 0.35rem;\n  z-index: 3;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.38rem;\n  width: max-content;\n  margin: 0.5rem auto 0;\n  padding: 0.42rem 0.68rem;\n  border: 1px solid hsl(var(--primary) / 0.28);\n  border-radius: 999px;\n  background: hsl(221 50% 8% / 0.86);\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 800;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.16);\n  backdrop-filter: blur(14px);\n}\n\n.cm-chat__icon-action {\n  color: hsl(var(--muted-foreground));\n}\n\n.cm-chat__icon-action:hover {\n  color: hsl(var(--primary));\n}\n\n@media (max-width: 820px) {\n  .cm-playground {\n    height: calc(100dvh - clamp(10rem, 28vw, 11.75rem) - env(safe-area-inset-top) - env(safe-area-inset-bottom));\n    min-height: 30rem;\n  }\n\n  .cm-playground__title-text {\n    display: none;\n  }\n\n  .cm-playground__chips {\n    flex-basis: 100%;\n    order: 4;\n  }\n\n  .cm-playground__chip-label,\n  .cm-playground__divider {\n    display: none;\n  }\n\n  .cm-playground__chip-section--providers {\n    flex-basis: 42%;\n  }\n\n  .cm-chat-message__bubble {\n    max-width: 88%;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .cm-app-chrome__navitem,\n  .cm-hud-button,\n  .cm-app-chrome__hud-popover,\n  .cm-playground__badge,\n  .cm-playground__chip,\n  .cm-chat-message__bubble {\n    transition-duration: 0.01ms !important;\n  }\n}\n";
+export declare const shellCss = "/**\n * Compose.Market Shared Shell\n * @compose-market/theme/css/shell\n */\n\n:root {\n  --cm-shell-glow-primary: hsl(var(--primary) / 0.3);\n  --cm-shell-glow-accent: hsl(var(--accent) / 0.16);\n  --cm-shell-surface:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.38), hsl(221 50% 9% / 0.24)),\n    radial-gradient(circle at 18% 0%, hsl(var(--primary) / 0.08), transparent 34%),\n    hsl(224 36% 13% / 0.28);\n  --cm-shell-border: hsl(var(--primary) / 0.18);\n  --cm-shell-shadow:\n    0 0 40px hsl(var(--primary) / 0.055),\n    inset 0 1px 0 hsl(0 0% 100% / 0.06);\n  --cm-chrome-gutter: clamp(0.7rem, 1.4vw, 1.15rem);\n  --cm-chrome-sidebar: 16rem;\n  --cm-chrome-sidebar-collapsed: 4.7rem;\n  --cm-chrome-topbar: 4rem;\n  --cm-chrome-mobile: 3.55rem;\n  --cm-page-max: 88rem;\n}\n\n.cm-shell-stack {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n\n.cm-shell-cluster {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  flex-wrap: wrap;\n}\n\n.cm-shell-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.55rem;\n  min-height: 2.3rem;\n  padding: 0 0.95rem;\n  border-radius: 999px;\n  border: 1px solid hsl(var(--primary) / 0.22);\n  background:\n    linear-gradient(180deg, hsl(var(--card) / 0.72), hsl(var(--background) / 0.36));\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.76rem;\n  font-weight: 600;\n  letter-spacing: 0.08em;\n  line-height: 1;\n  text-transform: uppercase;\n  cursor: pointer;\n  transition:\n    transform 160ms ease,\n    background-color 160ms ease,\n    border-color 180ms ease,\n    color 180ms ease,\n    box-shadow 180ms ease;\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.04),\n    0 0 16px hsl(var(--primary) / 0.035);\n  backdrop-filter: blur(12px) saturate(1.08);\n}\n\n.cm-shell-button:hover:not(:disabled) {\n  transform: translateY(-1px);\n  border-color: hsl(var(--primary) / 0.38);\n}\n\n.cm-shell-button:disabled {\n  opacity: 0.55;\n  cursor: not-allowed;\n}\n\n.cm-shell-button--primary {\n  background:\n    linear-gradient(135deg, #8aebff, #22d3ee);\n  color: hsl(var(--primary-foreground));\n  border-color: hsl(var(--primary) / 0.56);\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.16),\n    0 0 20px var(--cm-shell-glow-primary);\n}\n\n.cm-shell-button--primary:hover:not(:disabled) {\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.18),\n    0 0 24px var(--cm-shell-glow-primary),\n    0 0 18px var(--cm-shell-glow-accent);\n}\n\n.cm-shell-button--secondary {\n  background: hsl(221 50% 9% / 0.36);\n  border-color: hsl(var(--primary) / 0.2);\n  color: hsl(var(--primary));\n}\n\n.cm-shell-button--secondary:hover:not(:disabled) {\n  background: hsl(var(--primary) / 0.1);\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.1);\n}\n\n.cm-shell-button--ghost {\n  background: transparent;\n  border-color: transparent;\n  color: hsl(var(--muted-foreground));\n  box-shadow: none;\n}\n\n.cm-shell-button--ghost:hover:not(:disabled) {\n  color: hsl(var(--foreground));\n  background: hsl(var(--muted) / 0.24);\n}\n\n.cm-shell-button--danger {\n  background: hsl(var(--destructive) / 0.12);\n  border-color: hsl(var(--destructive) / 0.42);\n  color: hsl(var(--destructive-foreground));\n}\n\n.cm-shell-button--danger:hover:not(:disabled) {\n  background: hsl(var(--destructive) / 0.2);\n}\n\n.cm-shell-button--sm {\n  min-height: 2rem;\n  padding: 0 0.75rem;\n  font-size: 0.7rem;\n}\n\n.cm-shell-button--lg {\n  min-height: 2.65rem;\n  padding: 0 1.1rem;\n  font-size: 0.82rem;\n}\n\n.cm-shell-button--icon {\n  width: 2.3rem;\n  padding: 0;\n}\n\n.cm-shell-pill {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.45rem;\n  min-height: 1.75rem;\n  padding: 0 0.72rem;\n  border-radius: 999px;\n  border: 1px solid hsl(var(--primary) / 0.2);\n  background:\n    linear-gradient(180deg, hsl(var(--card) / 0.76), hsl(var(--muted) / 0.26));\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n.cm-shell-pill strong,\n.cm-shell-pill span {\n  color: inherit;\n}\n\n.cm-shell-panel {\n  border: 1px solid var(--cm-shell-border);\n  border-radius: 12px;\n  background: var(--cm-shell-surface);\n  box-shadow: var(--cm-shell-shadow);\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-shell-page {\n  container-type: inline-size;\n  width: min(var(--cm-page-max), 100%);\n  min-width: 0;\n  margin-inline: auto;\n  display: grid;\n  gap: clamp(1rem, 2.2cqi, 1.55rem);\n}\n\n.cm-shell-page--full {\n  --cm-page-max: none;\n}\n\n.cm-shell-page-body {\n  display: grid;\n  gap: clamp(0.9rem, 2cqi, 1.35rem);\n  min-width: 0;\n}\n\n.cm-workspace {\n  --cm-workspace-pad: clamp(0.85rem, 2.2vw, 1.45rem);\n  --cm-workspace-gap: clamp(0.85rem, 1.8vw, 1.25rem);\n  --cm-workspace-max: var(--cm-page-max, 88rem);\n  container-type: inline-size;\n  display: grid;\n  grid-template-rows: minmax(0, 1fr);\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  min-width: 0;\n  overflow: hidden;\n}\n\n.cm-workspace--page {\n  grid-template-rows: minmax(0, 1fr);\n}\n\n.cm-workspace--canvas {\n  overflow: hidden;\n}\n\n.cm-workspace-canvas {\n  min-width: 0;\n  min-height: 0;\n  overflow: auto;\n  overscroll-behavior: contain;\n  scrollbar-width: thin;\n  padding: var(--cm-workspace-pad);\n  padding-bottom: max(clamp(0.45rem, 1.1vw, 0.85rem), env(safe-area-inset-bottom));\n}\n\n.cm-workspace-canvas--fade {\n  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 1.5%, #000 95%, transparent 100%);\n  mask-image: linear-gradient(180deg, transparent 0, #000 1.5%, #000 95%, transparent 100%);\n}\n\n.cm-workspace__body {\n  display: grid;\n  gap: var(--cm-workspace-gap);\n  width: min(100%, var(--cm-workspace-max));\n  min-width: 0;\n  margin-inline: auto;\n}\n\n.cm-page-stack {\n  display: grid;\n  grid-template-rows: auto auto minmax(0, 1fr);\n  align-content: stretch;\n  gap: var(--cm-workspace-gap, clamp(0.85rem, 1.8vw, 1.25rem));\n  width: min(100%, var(--cm-workspace-max, var(--cm-page-max, 88rem)));\n  height: 100%;\n  max-height: 100%;\n  min-width: 0;\n  min-height: 0;\n  margin-inline: auto;\n  overflow: hidden;\n}\n\n.cm-page-stack--simple {\n  grid-template-rows: auto minmax(0, 1fr);\n}\n\n.cm-page-stack__header,\n.cm-page-stack__controls {\n  min-width: 0;\n  min-height: 0;\n}\n\n.cm-page-stack__controls {\n  display: grid;\n  gap: clamp(0.5rem, 1.1vw, 0.75rem);\n}\n\n.cm-page-list {\n  min-width: 0;\n  min-height: 0;\n  overflow-x: hidden;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  scrollbar-width: thin;\n  padding-block: clamp(0.1rem, 0.5vw, 0.3rem);\n}\n\n.cm-page-tabs {\n  display: flex;\n  min-width: 0;\n  min-height: 0;\n  flex-direction: column;\n  gap: clamp(0.6rem, 1.2vw, 0.85rem);\n  overflow: hidden;\n}\n\n.cm-page-tabs > [role=\"tablist\"] {\n  flex: 0 0 auto;\n}\n\n.cm-page-tab-panel {\n  flex: 1 1 auto;\n  min-width: 0;\n  min-height: 0;\n  margin-top: 0;\n  overflow-x: hidden;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  scrollbar-width: thin;\n  padding-block: 0.05rem 0.35rem;\n}\n\n.cm-page-tab-panel[data-state=\"inactive\"] {\n  display: none;\n}\n\n.cm-chat-workspace,\n.cm-compose-workspace {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  min-width: 0;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.cm-chat-workspace {\n  flex-direction: column;\n}\n\n.cm-compose-workspace {\n  gap: clamp(0.7rem, 1.4vw, 1rem);\n  flex-direction: column;\n}\n\n@media (min-width: 1024px) {\n  .cm-compose-workspace {\n    flex-direction: row;\n  }\n}\n\n.cm-control-rail {\n  container-type: inline-size;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: clamp(0.5rem, 1.4cqi, 0.85rem);\n  min-width: 0;\n  padding: clamp(0.48rem, 1.2cqi, 0.68rem);\n  border: 1px solid hsl(var(--primary) / 0.18);\n  border-radius: 16px;\n  background:\n    radial-gradient(circle at 8% 0%, hsl(var(--primary) / 0.12), transparent 32%),\n    radial-gradient(circle at 92% 100%, hsl(var(--accent) / 0.1), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 23% / 0.42), hsl(221 50% 9% / 0.34));\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.06),\n    0 0 24px hsl(var(--primary) / 0.06);\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-control-rail--compact {\n  padding: clamp(0.36rem, 0.9cqi, 0.52rem);\n  border-radius: 14px;\n}\n\n.cm-control-rail__main,\n.cm-control-rail__actions,\n.cm-control-rail__tabs {\n  display: flex;\n  align-items: center;\n  gap: clamp(0.42rem, 1.1cqi, 0.7rem);\n  min-width: 0;\n}\n\n.cm-control-rail__main {\n  flex: 1 1 22rem;\n}\n\n.cm-control-rail__actions,\n.cm-control-rail__tabs {\n  flex: 0 1 auto;\n  flex-wrap: wrap;\n  justify-content: flex-end;\n}\n\n.cm-responsive-pair {\n  --cm-pair-side: clamp(17rem, 27cqi, 22rem);\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) minmax(min(100%, 16rem), var(--cm-pair-side));\n  align-items: start;\n  gap: clamp(0.85rem, 2cqi, 1.25rem);\n  min-width: 0;\n}\n\n.cm-responsive-pair--reverse {\n  grid-template-columns: minmax(min(100%, 16rem), var(--cm-pair-side)) minmax(0, 1fr);\n}\n\n.cm-choice-card {\n  display: grid;\n  gap: clamp(0.75rem, 2cqi, 1rem);\n  align-content: start;\n  min-width: 0;\n  width: 100%;\n  padding: clamp(1rem, 3cqi, 1.45rem);\n  border: 1px solid hsl(var(--primary) / 0.2);\n  border-radius: 16px;\n  background:\n    radial-gradient(circle at 50% 0%, hsl(var(--primary) / 0.12), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 23% / 0.42), hsl(221 50% 9% / 0.36));\n  color: hsl(var(--foreground));\n  text-align: left;\n  box-shadow: var(--cm-shell-shadow);\n  cursor: pointer;\n  backdrop-filter: blur(16px) saturate(1.12);\n  transition:\n    transform 170ms ease,\n    border-color 170ms ease,\n    box-shadow 170ms ease;\n}\n\n.cm-choice-card[data-tone=\"fuchsia\"] {\n  border-color: hsl(var(--accent) / 0.22);\n  background:\n    radial-gradient(circle at 50% 0%, hsl(var(--accent) / 0.12), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 23% / 0.42), hsl(221 50% 9% / 0.36));\n}\n\n.cm-choice-card:hover,\n.cm-choice-card:focus-visible {\n  outline: none;\n  transform: translateY(-2px);\n  border-color: hsl(var(--primary) / 0.45);\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.16),\n    0 0 28px hsl(var(--primary) / 0.14),\n    inset 0 1px 0 hsl(0 0% 100% / 0.07);\n}\n\n.cm-choice-card[data-tone=\"fuchsia\"]:hover,\n.cm-choice-card[data-tone=\"fuchsia\"]:focus-visible {\n  border-color: hsl(var(--accent) / 0.44);\n  box-shadow:\n    0 0 0 1px hsl(var(--accent) / 0.14),\n    0 0 28px hsl(var(--accent) / 0.13),\n    inset 0 1px 0 hsl(0 0% 100% / 0.07);\n}\n\n.cm-choice-card__icon {\n  display: grid;\n  width: clamp(2.75rem, 7cqi, 3.55rem);\n  height: clamp(2.75rem, 7cqi, 3.55rem);\n  place-items: center;\n  border-radius: 999px;\n  border: 1px solid hsl(var(--primary) / 0.26);\n  background: hsl(var(--primary) / 0.1);\n  color: hsl(var(--primary));\n  box-shadow: 0 0 20px hsl(var(--primary) / 0.12);\n}\n\n.cm-choice-card[data-tone=\"fuchsia\"] .cm-choice-card__icon {\n  border-color: hsl(var(--accent) / 0.28);\n  background: hsl(var(--accent) / 0.1);\n  color: hsl(var(--accent));\n  box-shadow: 0 0 20px hsl(var(--accent) / 0.12);\n}\n\n.cm-choice-card__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: clamp(1rem, 2.5cqi, 1.25rem);\n  letter-spacing: 0.05em;\n  line-height: 1.05;\n  text-transform: uppercase;\n}\n\n.cm-choice-card__copy {\n  color: hsl(var(--muted-foreground));\n  font-size: clamp(0.82rem, 1.9cqi, 0.92rem);\n  line-height: 1.45;\n}\n\n.cm-fold {\n  border: 1px solid hsl(var(--primary) / 0.17);\n  border-radius: 14px;\n  background:\n    radial-gradient(circle at 12% 0%, hsl(var(--primary) / 0.08), transparent 32%),\n    hsl(221 50% 9% / 0.36);\n  overflow: hidden;\n}\n\n.cm-fold__summary {\n  display: flex;\n  align-items: center;\n  gap: 0.55rem;\n  min-height: 2.75rem;\n  padding: 0.72rem 0.9rem;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.74rem;\n  font-weight: 700;\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n  cursor: pointer;\n}\n\n.cm-fold__summary:focus-visible {\n  outline: 2px solid hsl(var(--primary) / 0.68);\n  outline-offset: -2px;\n}\n\n.cm-fold__body {\n  display: grid;\n  gap: 0.75rem;\n  padding: 0 0.9rem 0.9rem;\n  color: hsl(var(--muted-foreground));\n  font-size: 0.88rem;\n  line-height: 1.5;\n}\n\n.cm-fold:not([open]) > .cm-fold__body {\n  display: none;\n}\n\n.cm-setting-row {\n  display: grid;\n  grid-template-columns: auto minmax(0, 1fr) auto;\n  align-items: center;\n  gap: 0.78rem;\n  min-width: 0;\n  padding: 0.72rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 14px;\n  background:\n    linear-gradient(145deg, hsl(226 21% 20% / 0.42), hsl(221 50% 9% / 0.34));\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.05);\n}\n\n.cm-setting-row__icon {\n  display: grid;\n  width: 2.35rem;\n  height: 2.35rem;\n  place-items: center;\n  border-radius: 12px;\n  background: hsl(var(--primary) / 0.1);\n  color: hsl(var(--primary));\n}\n\n.cm-setting-row__copy {\n  display: grid;\n  gap: 0.16rem;\n  min-width: 0;\n}\n\n.cm-setting-row__label {\n  color: hsl(var(--foreground));\n  font-size: 0.88rem;\n  font-weight: 700;\n  line-height: 1.15;\n}\n\n.cm-setting-row__description {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.76rem;\n  line-height: 1.35;\n}\n\n.cm-setting-row__control {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  min-width: max-content;\n}\n\n.cm-field {\n  display: grid;\n  gap: 0.42rem;\n  min-width: 0;\n}\n\n.cm-field__label,\n.cm-field label,\n.cm-field .cm-field-label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 700;\n  letter-spacing: 0.12em;\n  line-height: 1.15;\n  text-transform: uppercase;\n}\n\n.cm-field__hint {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.76rem;\n  line-height: 1.35;\n}\n\n.cm-surface-card,\n.cm-builder-panel {\n  min-width: 0;\n  border: 1px solid hsl(var(--primary) / 0.17);\n  border-radius: 16px;\n  background:\n    radial-gradient(circle at 10% 0%, hsl(var(--primary) / 0.1), transparent 34%),\n    radial-gradient(circle at 96% 100%, hsl(var(--accent) / 0.08), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 22% / 0.42), hsl(221 50% 9% / 0.34));\n  box-shadow:\n    0 0 28px hsl(var(--primary) / 0.045),\n    inset 0 1px 0 hsl(0 0% 100% / 0.055);\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-builder-panel {\n  display: grid;\n  align-content: start;\n  gap: clamp(0.72rem, 1.55cqi, 1rem);\n  padding: clamp(0.86rem, 1.8cqi, 1.15rem);\n}\n\n.cm-builder-panel[data-tone=\"green\"] {\n  border-color: hsl(142 71% 45% / 0.2);\n  background:\n    radial-gradient(circle at 10% 0%, hsl(142 71% 45% / 0.1), transparent 34%),\n    radial-gradient(circle at 96% 100%, hsl(var(--primary) / 0.08), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 22% / 0.42), hsl(221 50% 9% / 0.34));\n}\n\n.cm-builder-panel[data-tone=\"fuchsia\"] {\n  border-color: hsl(var(--accent) / 0.22);\n  background:\n    radial-gradient(circle at 10% 0%, hsl(var(--accent) / 0.1), transparent 34%),\n    radial-gradient(circle at 96% 100%, hsl(var(--primary) / 0.08), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 22% / 0.42), hsl(221 50% 9% / 0.34));\n}\n\n.cm-builder-panel__title {\n  display: flex;\n  align-items: center;\n  gap: 0.48rem;\n  color: hsl(var(--primary));\n  font-family: var(--font-display), sans-serif;\n  font-size: 0.82rem;\n  font-weight: 800;\n  letter-spacing: 0.06em;\n  line-height: 1.1;\n  text-transform: uppercase;\n}\n\n.cm-builder-panel[data-tone=\"green\"] .cm-builder-panel__title {\n  color: hsl(142 71% 45%);\n}\n\n.cm-builder-panel[data-tone=\"fuchsia\"] .cm-builder-panel__title {\n  color: hsl(var(--accent));\n}\n\n.cm-stat-strip {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr));\n  gap: clamp(0.45rem, 1cqi, 0.68rem);\n  min-width: 0;\n}\n\n.cm-stat-strip--dense {\n  grid-template-columns: repeat(auto-fit, minmax(min(100%, 6.75rem), 1fr));\n}\n\n.cm-stat-cell,\n.cm-stat-grid__cell {\n  min-width: 0;\n  border: 1px solid hsl(var(--primary) / 0.15);\n  border-radius: 12px;\n  background:\n    radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.08), transparent 42%),\n    hsl(221 50% 9% / 0.34);\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.045);\n}\n\n.cm-stat-cell {\n  display: grid;\n  gap: 0.25rem;\n  padding: clamp(0.5rem, 1.2cqi, 0.68rem);\n}\n\n.cm-stat-cell__label,\n.cm-stat-grid__cell-label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.58rem;\n  letter-spacing: 0.1em;\n  line-height: 1.1;\n  text-transform: uppercase;\n}\n\n.cm-stat-cell__value-row {\n  display: flex;\n  align-items: center;\n  gap: 0.38rem;\n  min-width: 0;\n}\n\n.cm-stat-cell__value,\n.cm-stat-grid__cell-value {\n  min-width: 0;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.75rem;\n  font-weight: 800;\n  line-height: 1.2;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.cm-popover-panel {\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.2);\n  border-radius: 14px;\n  background:\n    radial-gradient(circle at 8% 0%, hsl(var(--primary) / 0.1), transparent 32%),\n    hsl(221 50% 8% / 0.92);\n  box-shadow:\n    0 18px 50px hsl(240 30% 2% / 0.42),\n    0 0 28px hsl(var(--primary) / 0.1);\n  backdrop-filter: blur(18px) saturate(1.14);\n}\n\n.cm-popover-panel__header,\n.cm-popover-panel__footer {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 0.65rem;\n  padding: 0.48rem 0.68rem;\n  border-color: hsl(var(--primary) / 0.13);\n}\n\n.cm-popover-panel__header {\n  border-bottom: 1px solid hsl(var(--primary) / 0.13);\n}\n\n.cm-popover-panel__footer {\n  border-top: 1px solid hsl(var(--primary) / 0.13);\n}\n\n.cm-popover-panel__label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.62rem;\n  font-weight: 800;\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n}\n\n.cm-switch,\n.cm-checkbox,\n.cm-radio-item {\n  border-color: hsl(var(--primary) / 0.34);\n  background:\n    linear-gradient(145deg, hsl(221 50% 8% / 0.92), hsl(226 21% 18% / 0.72));\n  box-shadow:\n    inset 0 0 0 1px hsl(0 0% 100% / 0.04),\n    0 0 14px hsl(var(--primary) / 0.055);\n}\n\n.cm-switch[data-state=\"checked\"],\n.cm-checkbox[data-state=\"checked\"],\n.cm-radio-item[data-state=\"checked\"] {\n  border-color: hsl(var(--primary) / 0.72);\n  background:\n    radial-gradient(circle at 76% 50%, hsl(var(--accent) / 0.28), transparent 42%),\n    linear-gradient(135deg, hsl(var(--primary) / 0.92), hsl(var(--accent) / 0.76));\n  color: hsl(var(--primary-foreground));\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.22),\n    0 0 18px hsl(var(--primary) / 0.24);\n}\n\n.cm-switch:focus-visible,\n.cm-checkbox:focus-visible,\n.cm-radio-item:focus-visible {\n  outline: 2px solid hsl(var(--primary) / 0.78);\n  outline-offset: 2px;\n}\n\n.cm-switch:disabled,\n.cm-checkbox:disabled,\n.cm-radio-item[data-disabled] {\n  opacity: 0.55;\n  cursor: not-allowed;\n}\n\n.cm-app-chrome {\n  --cm-chrome-safe: clamp(0.62rem, 1.25vw, 1rem);\n  --cm-chrome-gap: clamp(0.34rem, 0.75vw, 0.55rem);\n  --cm-hud-size: clamp(2.65rem, 4.1vw, 3rem);\n  --cm-hud-radius: 999px;\n  position: relative;\n  min-height: 100dvh;\n  isolation: isolate;\n}\n\n.cm-app-chrome__main {\n  min-width: 0;\n  min-height: 100dvh;\n  padding:\n    calc(env(safe-area-inset-top) + clamp(4.8rem, 7vw, 5.9rem))\n    clamp(5.25rem, 6vw, 7rem)\n    calc(env(safe-area-inset-bottom) + clamp(0.85rem, 2vw, 1.55rem));\n}\n\n.cm-app-chrome__navdock {\n  position: fixed;\n  inset-block-start: 50%;\n  inset-inline-start: calc(env(safe-area-inset-left) + var(--cm-chrome-safe));\n  z-index: 55;\n  display: grid;\n  gap: var(--cm-chrome-gap);\n  transform: translate3d(0, -50%, 0);\n  pointer-events: none;\n}\n\n.cm-app-chrome__navgroup,\n.cm-app-chrome__navutility {\n  display: grid;\n  gap: var(--cm-chrome-gap);\n  pointer-events: none;\n}\n\n.cm-app-chrome__navutility {\n  margin-top: clamp(0.45rem, 1vw, 0.7rem);\n  padding-top: clamp(0.45rem, 1vw, 0.7rem);\n}\n\n.cm-app-chrome__navitem,\n.cm-hud-button {\n  position: relative;\n  display: inline-grid;\n  place-items: center;\n  width: var(--cm-hud-size);\n  min-width: var(--cm-hud-size);\n  height: var(--cm-hud-size);\n  min-height: var(--cm-hud-size);\n  border: 1px solid hsl(var(--primary) / 0.18);\n  border-radius: var(--cm-hud-radius);\n  background:\n    radial-gradient(circle at 30% 14%, hsl(var(--primary) / 0.15), transparent 38%),\n    radial-gradient(circle at 78% 90%, hsl(var(--accent) / 0.12), transparent 42%),\n    linear-gradient(145deg, hsl(226 21% 23% / 0.48), hsl(221 50% 9% / 0.38));\n  color: hsl(var(--muted-foreground));\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.07),\n    inset 0 -1px 0 hsl(var(--primary) / 0.07),\n    0 0 26px hsl(var(--primary) / 0.065);\n  backdrop-filter: blur(18px) saturate(1.16);\n  cursor: pointer;\n  pointer-events: auto;\n  text-decoration: none;\n  transition:\n    transform 160ms ease,\n    border-color 180ms ease,\n    background-color 180ms ease,\n    color 180ms ease,\n    box-shadow 180ms ease,\n    opacity 180ms ease;\n}\n\n.cm-app-chrome__navitem::before {\n  content: \"\";\n  position: absolute;\n  inset: -0.18rem;\n  border-radius: 999px;\n  background:\n    radial-gradient(circle at 50% 18%, hsl(var(--primary) / 0.28), transparent 46%),\n    radial-gradient(circle at 50% 86%, hsl(var(--accent) / 0.18), transparent 42%);\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.42),\n    0 0 18px hsl(var(--primary) / 0.2),\n    0 0 22px hsl(var(--accent) / 0.1);\n  opacity: 0;\n  transform: scale(0.72);\n  transition:\n    opacity 180ms ease,\n    transform 180ms ease;\n  pointer-events: none;\n}\n\n.cm-app-chrome__navitem:hover,\n.cm-app-chrome__navitem:focus-visible,\n.cm-app-chrome__navitem[data-active=\"true\"],\n.cm-hud-button:hover,\n.cm-hud-button:focus-visible,\n.cm-hud-button[data-active=\"true\"] {\n  color: hsl(var(--foreground));\n  border-color: hsl(var(--primary) / 0.42);\n  outline: none;\n  transform: translate3d(0, -1px, 0);\n  box-shadow:\n    inset 0 0 24px hsl(var(--primary) / 0.075),\n    0 0 24px hsl(var(--primary) / 0.14),\n    0 0 18px hsl(var(--accent) / 0.08);\n}\n\n.cm-app-chrome__navitem[data-active=\"true\"] {\n  color: hsl(var(--primary));\n  border-color: hsl(var(--primary) / 0.52);\n  background:\n    radial-gradient(circle at 30% 14%, hsl(var(--primary) / 0.24), transparent 42%),\n    radial-gradient(circle at 78% 90%, hsl(var(--accent) / 0.18), transparent 44%),\n    linear-gradient(145deg, hsl(226 21% 25% / 0.58), hsl(221 50% 9% / 0.48));\n}\n\n.cm-app-chrome__navitem[data-active=\"true\"]::before {\n  opacity: 1;\n  transform: scale(1);\n}\n\n.cm-app-chrome__navitem-icon,\n.cm-hud-icon,\n.cm-app-nav__icon {\n  display: inline-flex;\n  width: 1.12rem;\n  height: 1.12rem;\n  align-items: center;\n  justify-content: center;\n  color: currentColor;\n}\n\n.cm-app-chrome__tooltip {\n  position: absolute;\n  inset-inline-start: calc(100% + 0.55rem);\n  top: 50%;\n  max-width: min(14rem, 52vw);\n  padding: 0.42rem 0.58rem;\n  border: 1px solid hsl(var(--primary) / 0.22);\n  border-radius: 999px;\n  background: hsl(221 50% 8% / 0.84);\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.64rem;\n  font-weight: 700;\n  letter-spacing: 0.1em;\n  line-height: 1;\n  text-transform: uppercase;\n  white-space: nowrap;\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.12);\n  opacity: 0;\n  pointer-events: none;\n  transform: translate3d(-0.18rem, -50%, 0);\n  transition:\n    opacity 150ms ease,\n    transform 150ms ease;\n}\n\n.cm-app-chrome__navitem:hover .cm-app-chrome__tooltip,\n.cm-app-chrome__navitem:focus-visible .cm-app-chrome__tooltip {\n  opacity: 1;\n  transform: translate3d(0, -50%, 0);\n}\n\n.cm-app-chrome__hud {\n  position: fixed;\n  inset-block-start: calc(env(safe-area-inset-top) + var(--cm-chrome-safe));\n  inset-inline: calc(env(safe-area-inset-left) + var(--cm-chrome-safe)) calc(env(safe-area-inset-right) + var(--cm-chrome-safe));\n  z-index: 60;\n  display: flex;\n  align-items: flex-start;\n  justify-content: flex-end;\n  gap: var(--cm-chrome-gap);\n  pointer-events: none;\n}\n\n.cm-app-chrome__hud-group {\n  container-type: inline-size;\n  display: flex;\n  width: min(100%, 68rem);\n  min-width: 0;\n  align-items: center;\n  justify-content: flex-end;\n  gap: var(--cm-chrome-gap);\n  flex-wrap: nowrap;\n  pointer-events: auto;\n}\n\n.cm-app-chrome__hud-item,\n.cm-app-chrome__hud-fold,\n.cm-app-chrome__search {\n  position: relative;\n  min-width: max-content;\n  flex: 0 0 auto;\n}\n\n.cm-app-chrome__search {\n  display: inline-flex;\n  min-width: var(--cm-hud-size);\n  align-items: center;\n  justify-content: flex-end;\n  gap: var(--cm-chrome-gap);\n}\n\n.cm-app-chrome__hud-item[data-priority=\"low\"] {\n  flex-shrink: 0;\n}\n\n.cm-hud-button {\n  display: inline-flex;\n  align-items: center;\n  width: auto;\n  max-width: min(15.5rem, 52vw);\n  justify-content: center;\n  gap: 0.52rem;\n  padding-inline: clamp(0.72rem, 1.4vw, 0.92rem);\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.72rem;\n  font-weight: 700;\n  letter-spacing: 0.06em;\n  line-height: 1;\n  text-transform: uppercase;\n  white-space: nowrap;\n}\n\n.cm-hud-button--icon,\n.cm-hud-button[data-icon-only=\"true\"] {\n  width: var(--cm-hud-size);\n  padding-inline: 0;\n}\n\n.cm-hud-value,\n.cm-hud-address {\n  display: inline-block;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.cm-hud-value {\n  color: hsl(var(--foreground));\n}\n\n.cm-hud-address {\n  color: hsl(var(--primary));\n  max-width: 8.8rem;\n}\n\n.cm-hud-wallet {\n  min-width: min(13.75rem, 42vw);\n  justify-content: flex-start;\n  padding-inline: 0.82rem 0.74rem;\n  background:\n    radial-gradient(circle at 14% 50%, hsl(var(--primary) / 0.18), transparent 34%),\n    radial-gradient(circle at 86% 100%, hsl(var(--accent) / 0.12), transparent 40%),\n    linear-gradient(145deg, hsl(226 21% 22% / 0.58), hsl(221 50% 8% / 0.48));\n}\n\n.cm-hud-wallet__icon {\n  color: hsl(var(--primary));\n  opacity: 0.92;\n}\n\n.cm-hud-wallet .cm-hud-value {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 0.76rem;\n  letter-spacing: 0.05em;\n}\n\n.cm-hud-wallet .cm-hud-address {\n  color: hsl(var(--primary) / 0.9);\n  font-size: 0.68rem;\n  font-weight: 650;\n  letter-spacing: 0.04em;\n}\n\n.cm-app-chrome__navselect {\n  width: var(--cm-hud-size);\n  min-width: var(--cm-hud-size);\n  max-width: var(--cm-hud-size);\n  padding-inline: 0;\n  pointer-events: auto;\n}\n\n.cm-app-chrome__navselect .cm-hud-value {\n  display: none;\n}\n\n.cm-hud-status {\n  width: 0.48rem;\n  height: 0.48rem;\n  border-radius: 999px;\n  background: hsl(var(--primary));\n  box-shadow: 0 0 12px hsl(var(--primary) / 0.62);\n  flex: 0 0 auto;\n}\n\n.cm-hud-status[data-tone=\"red\"] {\n  background: hsl(0 84% 66%);\n  box-shadow: 0 0 12px hsl(0 84% 66% / 0.54);\n}\n\n.cm-hud-status[data-tone=\"blue\"] {\n  background: hsl(211 100% 64%);\n  box-shadow: 0 0 12px hsl(211 100% 64% / 0.54);\n}\n\n.cm-hud-status[data-state=\"muted\"] {\n  background: hsl(var(--muted-foreground));\n  box-shadow: none;\n}\n\n.cm-hud-overflow {\n  display: none;\n}\n\n.cm-app-chrome__hud-popover {\n  position: absolute;\n  top: calc(100% + 0.58rem);\n  right: 0;\n  z-index: 90;\n  width: min(21rem, calc(100vw - var(--cm-chrome-safe) * 2));\n  max-height: min(74dvh, 34rem);\n  overflow: auto;\n  border: 1px solid hsl(var(--primary) / 0.2);\n  border-radius: 18px;\n  background:\n    radial-gradient(circle at 20% 0%, hsl(var(--primary) / 0.11), transparent 34%),\n    radial-gradient(circle at 92% 100%, hsl(var(--accent) / 0.12), transparent 36%),\n    linear-gradient(145deg, hsl(226 21% 20% / 0.78), hsl(221 50% 7% / 0.86));\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.07),\n    0 0 36px hsl(var(--primary) / 0.12);\n  backdrop-filter: blur(22px) saturate(1.16);\n}\n\n.cm-hud-menu {\n  border: 1px solid hsl(var(--primary) / 0.2);\n  border-radius: 16px;\n  background:\n    radial-gradient(circle at 20% 0%, hsl(var(--primary) / 0.11), transparent 34%),\n    linear-gradient(145deg, hsl(226 21% 20% / 0.82), hsl(221 50% 7% / 0.9));\n  color: hsl(var(--foreground));\n  box-shadow:\n    inset 0 1px 0 hsl(0 0% 100% / 0.07),\n    0 0 28px hsl(var(--primary) / 0.12);\n  backdrop-filter: blur(20px) saturate(1.14);\n}\n\n.cm-app-chrome__hud-popover--wide {\n  width: min(25rem, calc(100vw - var(--cm-chrome-safe) * 2));\n}\n\n.cm-app-chrome__hud-popover-body {\n  display: grid;\n  gap: 0.58rem;\n  padding: 0.75rem;\n}\n\n.cm-app-chrome__hud-popover-title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 0.82rem;\n  font-weight: 800;\n  letter-spacing: 0.04em;\n}\n\n.cm-app-chrome__hud-popover-copy {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.78rem;\n  line-height: 1.45;\n}\n\n.cm-app-chrome__hud-row {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 0.75rem;\n  min-height: 2.65rem;\n  padding: 0.42rem;\n  border-radius: 14px;\n  background: hsl(var(--primary) / 0.055);\n}\n\n.cm-app-chrome__hud-stack {\n  display: grid;\n  gap: 0.58rem;\n}\n\n.cm-search {\n  display: flex;\n  min-width: 0;\n  align-items: center;\n  gap: 0.6rem;\n  min-height: 2.55rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 999px;\n  background: hsl(221 50% 9% / 0.38);\n  padding: 0 0.85rem;\n  color: hsl(var(--muted-foreground));\n  box-shadow: inset 0 0 20px hsl(var(--primary) / 0.04);\n}\n\n.cm-search--hud {\n  width: 0;\n  max-width: min(24rem, calc(100vw - var(--cm-chrome-safe) * 2 - var(--cm-hud-size)));\n  min-height: var(--cm-hud-size);\n  padding-inline: 0;\n  border-width: 0;\n  opacity: 0;\n  overflow: hidden;\n  pointer-events: none;\n  transform: scaleX(0.92);\n  transform-origin: right center;\n  transition:\n    width 180ms ease,\n    padding-inline 180ms ease,\n    opacity 150ms ease,\n    transform 180ms ease,\n    border-color 180ms ease;\n}\n\n.cm-app-chrome__search[data-open=\"true\"] .cm-search--hud {\n  width: clamp(13rem, 29vw, 24rem);\n  padding-inline: 0.85rem;\n  border-width: 1px;\n  opacity: 1;\n  pointer-events: auto;\n  transform: scaleX(1);\n}\n\n.cm-search input,\n.cm-search__input {\n  min-width: 0;\n  flex: 1;\n  border: 0;\n  outline: none;\n  background: transparent;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.82rem;\n}\n\n.cm-search input::placeholder,\n.cm-search__input::placeholder {\n  color: hsl(var(--muted-foreground) / 0.72);\n}\n\n.cm-app-chrome__sidebar,\n.cm-app-chrome__topbar,\n.cm-app-chrome__mobilebar,\n.cm-app-chrome__drawer {\n  display: none;\n}\n\n.cm-app-chrome__brand {\n  display: none;\n}\n\n.cm-shell-panel--muted {\n  background:\n    linear-gradient(145deg, hsl(224 36% 13% / 0.36), hsl(221 50% 9% / 0.72)),\n    radial-gradient(circle at 18% 0%, hsl(var(--primary) / 0.06), transparent 34%);\n}\n\n.cm-shell-panel--ghost {\n  background: transparent;\n  box-shadow: none;\n}\n\n.cm-shell-panel__body {\n  padding: 1rem;\n}\n\n.cm-shell-page-header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 1rem 1.1rem;\n}\n\n.cm-shell-page-header__copy {\n  display: flex;\n  flex-direction: column;\n  gap: 0.32rem;\n}\n\n.cm-shell-page-header__eyebrow {\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  letter-spacing: 0.18em;\n  text-transform: uppercase;\n}\n\n.cm-shell-page-header__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: clamp(1.12rem, 1.65vw, 1.52rem);\n  letter-spacing: 0.04em;\n  line-height: 1.02;\n}\n\n.cm-shell-page-header__subtitle {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.88rem;\n  line-height: 1.45;\n  max-width: 48rem;\n}\n\n.cm-shell-stat-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));\n  gap: 0.8rem;\n}\n\n.cm-shell-stat {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  padding: 0.85rem 0.9rem;\n}\n\n.cm-shell-stat__label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.66rem;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n}\n\n.cm-shell-stat__value {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 1rem;\n  letter-spacing: 0.04em;\n}\n\n.cm-shell-stat__hint {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.74rem;\n}\n\n.cm-shell-tab-strip {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.35rem;\n  padding: 0.25rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 999px;\n  background: hsl(var(--muted) / 0.14);\n  backdrop-filter: blur(12px);\n}\n\n.cm-shell-tab {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.5rem;\n  min-height: 2.1rem;\n  padding: 0 0.85rem;\n  border-radius: 999px;\n  border: 1px solid transparent;\n  background: transparent;\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  cursor: pointer;\n  transition:\n    background-color 180ms ease,\n    color 180ms ease,\n    border-color 180ms ease,\n    box-shadow 180ms ease;\n}\n\n.cm-shell-tab:hover {\n  color: hsl(var(--foreground));\n  border-color: hsl(var(--primary) / 0.18);\n}\n\n.cm-shell-tab[data-active=\"true\"],\n.cm-shell-tab[data-state=\"active\"] {\n  background:\n    linear-gradient(180deg, hsl(var(--primary) / 0.18), hsl(var(--primary) / 0.1));\n  border-color: hsl(var(--primary) / 0.36);\n  color: hsl(var(--foreground));\n  box-shadow:\n    inset 0 1px 0 hsl(var(--primary) / 0.16),\n    0 0 18px hsl(var(--primary) / 0.14);\n}\n\n.cm-shell-notice {\n  display: flex;\n  align-items: center;\n  gap: 0.7rem;\n  padding: 0.8rem 0.95rem;\n  border-radius: 12px;\n  border: 1px solid;\n  backdrop-filter: blur(12px);\n}\n\n.cm-shell-notice--info {\n  background: hsl(var(--primary) / 0.08);\n  border-color: hsl(var(--primary) / 0.22);\n  color: hsl(var(--foreground));\n}\n\n.cm-shell-notice--success {\n  background: hsl(148 75% 24% / 0.18);\n  border-color: hsl(148 75% 46% / 0.3);\n  color: hsl(var(--foreground));\n}\n\n.cm-shell-notice--warning {\n  background: hsl(42 100% 48% / 0.12);\n  border-color: hsl(42 100% 52% / 0.25);\n  color: hsl(var(--foreground));\n}\n\n.cm-shell-notice--error {\n  background: hsl(var(--destructive) / 0.13);\n  border-color: hsl(var(--destructive) / 0.28);\n  color: hsl(var(--foreground));\n}\n\n.cm-shell-banner {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 0.95rem 1rem;\n}\n\n.cm-shell-banner__copy {\n  display: flex;\n  flex-direction: column;\n  gap: 0.35rem;\n}\n\n.cm-shell-banner__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 0.98rem;\n  letter-spacing: 0.03em;\n}\n\n.cm-shell-banner__subtitle {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.84rem;\n  line-height: 1.45;\n}\n\n.cm-shell-empty {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 0.75rem;\n  min-height: 18rem;\n  padding: 2rem 1.25rem;\n  text-align: center;\n}\n\n.cm-shell-empty__icon {\n  color: hsl(var(--primary));\n}\n\n.cm-shell-empty__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 1.08rem;\n  letter-spacing: 0.04em;\n}\n\n.cm-shell-empty__description {\n  color: hsl(var(--muted-foreground));\n  max-width: 38rem;\n  line-height: 1.55;\n}\n\n.cm-shell-modal-overlay {\n  position: fixed;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 1rem;\n  background:\n    radial-gradient(circle at 50% 24%, hsl(var(--primary) / 0.08), transparent 28rem),\n    hsl(240 30% 2% / 0.82);\n  backdrop-filter: blur(12px);\n  z-index: 100;\n}\n\n.cm-shell-modal {\n  width: min(100%, 46rem);\n  max-height: min(90vh, 56rem);\n  overflow: auto;\n  border-radius: 12px;\n}\n\n.cm-shell-modal__header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 1rem 1rem 0;\n}\n\n.cm-shell-modal__title {\n  color: hsl(var(--foreground));\n  font-family: var(--font-display), sans-serif;\n  font-size: 1rem;\n  letter-spacing: 0.04em;\n}\n\n.cm-shell-modal__subtitle {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.84rem;\n  margin-top: 0.3rem;\n  line-height: 1.45;\n}\n\n.cm-shell-modal__body {\n  padding: 1rem;\n}\n\n@container (max-width: 42rem) {\n  .cm-app-chrome__hud-item[data-priority=\"low\"] {\n    display: none;\n  }\n\n  .cm-hud-overflow {\n    display: inline-flex;\n  }\n}\n\n@container (max-width: 31rem) {\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-hud-address,\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-hud-label {\n    display: none;\n  }\n\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-hud-wallet .cm-hud-value {\n    display: none;\n  }\n\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-hud-wallet {\n    width: var(--cm-hud-size);\n    min-width: var(--cm-hud-size);\n    padding-inline: 0;\n  }\n\n  .cm-app-chrome__hud-item[data-priority=\"medium\"] .cm-session-trigger {\n    width: auto;\n    min-width: max-content;\n    max-width: min(12rem, 58vw);\n    padding-inline: 0.72rem;\n  }\n}\n\n@media (max-width: 820px) {\n  .cm-shell-page-header,\n  .cm-shell-banner {\n    flex-direction: column;\n    align-items: stretch;\n  }\n\n  .cm-shell-stat-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .cm-shell-tab-strip {\n    width: 100%;\n    overflow-x: auto;\n  }\n\n  .cm-app-chrome__main {\n    padding:\n      calc(env(safe-area-inset-top) + clamp(4.25rem, 14vw, 4.85rem))\n      clamp(0.75rem, 4.2vw, 1.05rem)\n      calc(env(safe-area-inset-bottom) + var(--cm-hud-size) + clamp(0.72rem, 3.4vw, 1rem));\n  }\n\n  .cm-app-chrome__hud {\n    justify-content: flex-end;\n  }\n\n  .cm-app-chrome__hud-group {\n    width: min(100%, calc(100vw - var(--cm-chrome-safe) * 2));\n  }\n\n  .cm-app-chrome__hud-item,\n  .cm-app-chrome__hud-fold,\n  .cm-app-chrome__search {\n    min-width: auto;\n  }\n\n  .cm-app-chrome__navdock {\n    inset-block-start: auto;\n    inset-block-end: calc(env(safe-area-inset-bottom) + var(--cm-chrome-safe));\n    inset-inline: calc(env(safe-area-inset-left) + var(--cm-chrome-safe)) calc(env(safe-area-inset-right) + var(--cm-chrome-safe));\n    display: flex;\n    justify-content: center;\n    overflow-x: auto;\n    padding: 0.22rem;\n    transform: none;\n    scrollbar-width: none;\n  }\n\n  .cm-app-chrome__navdock::-webkit-scrollbar {\n    display: none;\n  }\n\n  .cm-app-chrome__navgroup,\n  .cm-app-chrome__navutility {\n    display: flex;\n    gap: var(--cm-chrome-gap);\n  }\n\n  .cm-app-chrome__navutility {\n    margin-top: 0;\n    padding-top: 0;\n  }\n\n  .cm-app-chrome__navitem {\n    flex: 0 0 auto;\n  }\n\n  .cm-app-chrome__navitem::before {\n    inset: -0.16rem;\n    width: auto;\n    height: auto;\n    transform: scale(0.72);\n  }\n\n  .cm-app-chrome__navitem[data-active=\"true\"]::before {\n    transform: scale(1);\n  }\n\n  .cm-app-chrome__tooltip {\n    display: none;\n  }\n\n  .cm-hud-address,\n  .cm-hud-label {\n    display: none;\n  }\n\n  .cm-app-chrome__hud-item[data-priority=\"low\"] {\n    display: none;\n  }\n\n  .cm-hud-overflow {\n    display: inline-flex;\n  }\n\n  .cm-app-chrome__hud-group[data-search-open=\"true\"] .cm-app-chrome__hud-item,\n  .cm-app-chrome__hud-group[data-search-open=\"true\"] .cm-app-chrome__hud-fold {\n    display: none;\n  }\n\n  .cm-app-chrome__search[data-open=\"true\"] {\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n\n  .cm-app-chrome__search[data-open=\"true\"] .cm-search--hud {\n    width: min(100%, calc(100vw - var(--cm-chrome-safe) * 2 - var(--cm-hud-size) - var(--cm-chrome-gap)));\n  }\n\n  .cm-workspace-canvas {\n    padding: clamp(0.7rem, 3.6vw, 1rem);\n  }\n\n  .cm-control-rail {\n    align-items: stretch;\n    flex-direction: column;\n  }\n\n  .cm-control-rail__main,\n  .cm-control-rail__actions,\n  .cm-control-rail__tabs {\n    width: 100%;\n    flex: 1 1 auto;\n    justify-content: stretch;\n  }\n\n  .cm-control-rail__tabs > *,\n  .cm-control-rail__actions > * {\n    min-width: 0;\n  }\n\n  .cm-responsive-pair,\n  .cm-responsive-pair--reverse {\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  .cm-setting-row {\n    grid-template-columns: auto minmax(0, 1fr);\n  }\n\n  .cm-setting-row__control {\n    grid-column: 1 / -1;\n    justify-content: stretch;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .cm-choice-card,\n  .cm-app-chrome__navitem,\n  .cm-hud-button,\n  .cm-shell-button {\n    transition-duration: 1ms;\n  }\n}\n\n/* \u2500\u2500 Form Controls \u2500\u2500 */\n.cm-form-group {\n  margin-bottom: 14px;\n}\n\n.cm-form-group label {\n  display: block;\n  margin-bottom: 6px;\n  font-family: var(--font-mono), monospace;\n  font-size: 11px;\n  color: hsl(var(--muted-foreground));\n  font-weight: 600;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n}\n\n.cm-form-input,\n.cm-form-textarea,\n.cm-form-select {\n  width: 100%;\n  padding: 10px 12px;\n  background: hsl(222 47% 7% / 0.84);\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 10px;\n  color: hsl(var(--foreground));\n  font-size: 14px;\n  font-family: var(--font-sans), sans-serif;\n  transition: border-color 0.2s, box-shadow 0.2s, background-color 0.2s;\n}\n\n.cm-form-input:focus,\n.cm-form-textarea:focus,\n.cm-form-select:focus {\n  outline: none;\n  border-color: hsl(var(--primary));\n  box-shadow:\n    0 0 0 1px hsl(var(--primary) / 0.24),\n    inset 0 0 20px hsl(var(--primary) / 0.06);\n  background: hsl(var(--background) / 0.96);\n}\n\n.cm-form-input:disabled,\n.cm-form-textarea:disabled,\n.cm-form-select:disabled {\n  opacity: 0.6;\n  cursor: not-allowed;\n}\n\n.cm-form-textarea {\n  min-height: 80px;\n  resize: vertical;\n}\n\n/* \u2500\u2500 Notification / Alert \u2500\u2500 */\n.cm-notification {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 12px 16px;\n  border-radius: 8px;\n  font-size: 14px;\n  font-weight: 500;\n  animation: cm-slide-in 0.2s ease;\n}\n\n@keyframes cm-slide-in {\n  from { opacity: 0; transform: translateY(-10px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n\n.cm-notification--success {\n  background: hsl(142 71% 45% / 0.15);\n  color: hsl(142 71% 45%);\n  border: 1px solid hsl(142 71% 45%);\n}\n\n.cm-notification--error {\n  background: hsl(var(--destructive) / 0.15);\n  color: hsl(var(--destructive));\n  border: 1px solid hsl(var(--destructive));\n}\n\n.cm-notification--warning {\n  background: hsl(42 100% 48% / 0.12);\n  color: hsl(42 100% 52%);\n  border: 1px solid hsl(42 100% 52% / 0.5);\n}\n\n.cm-notification--info {\n  background: hsl(var(--primary) / 0.08);\n  border: 1px solid hsl(var(--primary) / 0.22);\n  color: hsl(var(--foreground));\n}\n\n/* \u2500\u2500 Navigation \u2500\u2500 */\n.cm-nav {\n  display: flex;\n  gap: 4px;\n  padding: 12px 0 0;\n}\n\n.cm-nav-btn {\n  padding: 8px 14px;\n  background: transparent;\n  border: 1px solid transparent;\n  color: hsl(var(--muted-foreground));\n  cursor: pointer;\n  border-radius: var(--radius, 0.25rem);\n  font-size: 11px;\n  font-weight: 600;\n  font-family: var(--font-mono), monospace;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  transition: all 0.2s;\n}\n\n.cm-nav-btn:hover {\n  color: hsl(var(--foreground));\n  background: hsl(var(--muted));\n  border-color: hsl(var(--primary) / 0.18);\n}\n\n.cm-nav-btn[data-active=\"true\"],\n.cm-nav-btn.active {\n  color: hsl(var(--primary));\n  background: hsl(var(--primary) / 0.12);\n  border-color: hsl(var(--primary) / 0.28);\n}\n\n/* \u2500\u2500 Loading State \u2500\u2500 */\n.cm-loading-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 60px;\n  color: hsl(var(--muted-foreground));\n}\n\n.cm-spinner {\n  animation: cm-spin 1s linear infinite;\n}\n\n@keyframes cm-spin {\n  from { transform: rotate(0deg); }\n  to   { transform: rotate(360deg); }\n}\n\n/* \u2500\u2500 Badge / Tag \u2500\u2500 */\n.cm-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 3px 8px;\n  border-radius: 4px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.03em;\n}\n\n.cm-badge--primary {\n  background: hsl(var(--primary) / 0.15);\n  color: hsl(var(--primary));\n}\n\n.cm-badge--accent {\n  background: hsl(var(--accent) / 0.15);\n  color: hsl(var(--accent));\n}\n\n.cm-badge--muted {\n  background: hsl(var(--muted));\n  color: hsl(var(--muted-foreground));\n}\n\n.cm-badge--success {\n  background: hsl(142 71% 45% / 0.15);\n  color: hsl(142 71% 45%);\n}\n\n.cm-badge--destructive {\n  background: hsl(var(--destructive) / 0.15);\n  color: hsl(var(--destructive));\n}\n\n/* \u2500\u2500 Search Bar \u2500\u2500 */\n.cm-search-bar {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 10px 12px;\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: var(--radius, 0.25rem);\n}\n\n.cm-search-bar__icon {\n  color: hsl(var(--muted-foreground));\n  flex-shrink: 0;\n}\n\n.cm-search-bar__input {\n  flex: 1;\n  background: transparent;\n  border: none;\n  color: hsl(var(--foreground));\n  font-size: 14px;\n  font-family: var(--font-sans), sans-serif;\n  outline: none;\n}\n\n.cm-search-bar__input::placeholder {\n  color: hsl(var(--muted-foreground));\n}\n\n/* \u2500\u2500 Filter Buttons \u2500\u2500 */\n.cm-filter-btn {\n  padding: 6px 14px;\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: 999px;\n  color: hsl(var(--muted-foreground));\n  font-size: 11px;\n  font-family: var(--font-mono), monospace;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  cursor: pointer;\n  transition: all 0.2s;\n}\n\n.cm-filter-btn:hover {\n  border-color: hsl(var(--primary));\n  color: hsl(var(--foreground));\n}\n\n.cm-filter-btn[data-active=\"true\"],\n.cm-filter-btn.active {\n  background: hsl(var(--primary));\n  color: hsl(var(--primary-foreground));\n  border-color: hsl(var(--primary));\n}\n\n/* \u2500\u2500 Icon Button \u2500\u2500 */\n.cm-icon-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: 8px;\n  background: transparent;\n  border: 1px solid hsl(var(--border));\n  color: hsl(var(--muted-foreground));\n  border-radius: var(--radius, 0.25rem);\n  cursor: pointer;\n  font-family: var(--font-sans), sans-serif;\n  transition: all 0.2s;\n}\n\n.cm-icon-btn:hover {\n  background: hsl(var(--muted));\n  color: hsl(var(--foreground));\n}\n\n.cm-icon-btn--danger:hover {\n  border-color: hsl(var(--destructive));\n  color: hsl(var(--destructive));\n}\n\n/* \u2500\u2500 Settings Section \u2500\u2500 */\n.cm-settings-section {\n  margin-bottom: 24px;\n  padding: 16px;\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: max(var(--radius, 0.25rem), 0.3rem);\n}\n\n.cm-settings-section__title {\n  font-size: 14px;\n  font-weight: 600;\n  margin-bottom: 16px;\n  color: hsl(var(--muted-foreground));\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n.cm-settings-section__hint {\n  margin-bottom: 14px;\n  font-size: 13px;\n  color: hsl(var(--muted-foreground));\n}\n\n/* \u2500\u2500 Pagination \u2500\u2500 */\n.cm-pagination {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 16px;\n  margin-top: 32px;\n  padding-top: 24px;\n  border-top: 1px solid hsl(var(--border));\n}\n\n.cm-page-btn {\n  padding: 8px 16px;\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: 6px;\n  color: hsl(var(--muted-foreground));\n  cursor: pointer;\n  font-size: 13px;\n  font-family: var(--font-sans), sans-serif;\n  transition: all 0.2s;\n}\n\n.cm-page-btn:hover:not(:disabled) {\n  background: hsl(var(--muted));\n  color: hsl(var(--foreground));\n}\n\n.cm-page-btn:disabled {\n  opacity: 0.4;\n  cursor: not-allowed;\n}\n\n.cm-page-info {\n  font-size: 13px;\n  color: hsl(var(--muted-foreground));\n}\n\n/* \u2500\u2500 Card \u2500\u2500 */\n.cm-card {\n  background: hsl(var(--card));\n  border: 1px solid hsl(var(--border));\n  border-radius: 10px;\n  padding: 18px;\n  transition: all 0.2s;\n}\n\n.cm-card:hover {\n  border-color: hsl(var(--border) / 0.8);\n  transform: translateY(-2px);\n  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);\n}\n\n/* \u2500\u2500 Code Block \u2500\u2500 */\n.cm-code-block {\n  display: block;\n  padding: 10px 12px;\n  background: hsl(var(--muted));\n  border-radius: 6px;\n  font-size: 12px;\n  color: hsl(var(--primary));\n  word-break: break-all;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n/* \u2500\u2500 Error / Empty States \u2500\u2500 */\n.cm-error-message {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px;\n  background: hsl(var(--destructive) / 0.15);\n  border: 1px solid hsl(var(--destructive));\n  border-radius: 8px;\n  color: hsl(var(--destructive));\n}\n\n/* \u2500\u2500 Playground / Chat Primitives \u2500\u2500 */\n.cm-playground {\n  container-type: inline-size;\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  height: min(58rem, calc(100dvh - clamp(8.5rem, 14vw, 10rem)));\n  min-height: 34rem;\n  overflow: hidden;\n  border-radius: 16px;\n}\n\n.cm-playground__toolbar,\n.cm-playground__chat-toolbar,\n.cm-playground__caps-row {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n  gap: clamp(0.4rem, 1.4cqi, 0.8rem);\n}\n\n.cm-playground__toolbar {\n  flex: 0 0 auto;\n  justify-content: space-between;\n  padding: clamp(0.5rem, 1.6cqi, 0.8rem);\n  border: 1px solid hsl(var(--primary) / 0.14);\n  border-radius: 16px;\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.38), hsl(221 50% 9% / 0.32)),\n    radial-gradient(circle at 0% 0%, hsl(var(--primary) / 0.1), transparent 36%);\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.055);\n  backdrop-filter: blur(16px) saturate(1.12);\n}\n\n.cm-playground__title {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.42rem;\n  min-width: 0;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: clamp(0.68rem, 1.8cqi, 0.86rem);\n  font-weight: 800;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n.cm-playground__title-icon {\n  width: 1rem;\n  height: 1rem;\n  color: hsl(var(--primary));\n  filter: drop-shadow(0 0 10px hsl(var(--primary) / 0.44));\n}\n\n.cm-playground__toolbar-right {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 0.45rem;\n  min-width: 0;\n  flex-wrap: wrap;\n}\n\n.cm-playground__grid {\n  flex: 1;\n  min-height: 0;\n  display: grid;\n  grid-template-columns: minmax(0, 1fr);\n  gap: clamp(0.75rem, 1.8cqi, 1rem);\n  padding-top: clamp(0.75rem, 1.8cqi, 1rem);\n}\n\n@container (min-width: 62rem) {\n  .cm-playground__grid {\n    grid-template-columns: minmax(0, 2fr) minmax(19rem, 0.82fr);\n  }\n\n  .cm-playground__grid--collapsed {\n    grid-template-columns: minmax(0, 1fr);\n  }\n}\n\n.cm-playground__chat-cell,\n.cm-playground__pane-cell {\n  min-width: 0;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.cm-playground__chat-cell {\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 16px;\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.34), hsl(221 50% 9% / 0.26)),\n    hsl(224 36% 13% / 0.18);\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.045);\n  backdrop-filter: blur(16px) saturate(1.1);\n}\n\n.cm-playground__pane-cell {\n  display: none;\n}\n\n@container (min-width: 62rem) {\n  .cm-playground__pane-cell {\n    display: flex;\n  }\n}\n\n.cm-playground__chat-toolbar {\n  flex: 0 0 auto;\n  padding: clamp(0.55rem, 1.5cqi, 0.85rem);\n  border-bottom: 1px solid hsl(var(--primary) / 0.1);\n  background: hsl(221 50% 9% / 0.24);\n  flex-wrap: wrap;\n}\n\n.cm-playground__filter-wrap {\n  display: flex;\n  align-items: center;\n  gap: 0.45rem;\n  min-width: min(100%, 13rem);\n  flex: 1 1 13rem;\n  flex-wrap: wrap;\n}\n\n.cm-playground__chips {\n  display: flex;\n  align-items: center;\n  gap: 0.42rem;\n  min-width: 0;\n  flex: 1 1 18rem;\n  overflow: hidden;\n}\n\n.cm-playground__chip-section {\n  display: flex;\n  align-items: center;\n  gap: 0.36rem;\n  min-width: 0;\n  overflow: auto hidden;\n  scrollbar-width: none;\n}\n\n.cm-playground__chip-section::-webkit-scrollbar {\n  display: none;\n}\n\n.cm-playground__chip-section--types {\n  flex: 1 1 auto;\n}\n\n.cm-playground__chip-section--providers {\n  flex: 0 1 38%;\n}\n\n.cm-playground__chip-label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.62rem;\n  font-weight: 800;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  white-space: nowrap;\n}\n\n.cm-playground__divider {\n  width: 1px;\n  align-self: stretch;\n  min-height: 1.45rem;\n  background: linear-gradient(180deg, transparent, hsl(var(--primary) / 0.18), transparent);\n  flex: 0 0 auto;\n}\n\n.cm-playground__filter-select {\n  min-width: 0;\n  flex: 1 1 8rem;\n  min-height: 2.15rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 999px;\n  background: hsl(221 50% 9% / 0.46);\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.72rem;\n  padding: 0 0.75rem;\n}\n\n.cm-playground__filter-select:hover,\n.cm-playground__filter-select:focus,\n.cm-playground__filter-select--active {\n  outline: none;\n  border-color: hsl(var(--primary) / 0.42);\n  box-shadow: 0 0 16px hsl(var(--primary) / 0.08);\n}\n\n.cm-playground__model-count,\n.cm-playground__caps-label {\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n  white-space: nowrap;\n}\n\n.cm-playground__caps-row {\n  flex: 0 0 auto;\n  padding: 0.45rem clamp(0.55rem, 1.5cqi, 0.85rem);\n  border-bottom: 1px solid hsl(var(--primary) / 0.08);\n  overflow: auto hidden;\n}\n\n.cm-playground__cap-tag,\n.cm-playground__chip,\n.cm-playground__badge,\n.cm-model-badge,\n.cm-tool-chip,\n.cm-receipt-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.35rem;\n  border: 1px solid hsl(var(--primary) / 0.18);\n  border-radius: 999px;\n  background: hsl(221 50% 9% / 0.38);\n  color: hsl(var(--foreground) / 0.78);\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 700;\n  line-height: 1;\n  text-transform: uppercase;\n  transition:\n    transform 160ms ease,\n    border-color 180ms ease,\n    box-shadow 180ms ease,\n    color 180ms ease,\n    background-color 180ms ease;\n}\n\n.cm-playground__cap-tag {\n  min-height: 1.55rem;\n  padding: 0 0.58rem;\n}\n\n.cm-playground__chip {\n  min-height: 1.9rem;\n  max-width: min(13rem, 42vw);\n  flex: 0 0 auto;\n  padding: 0 0.58rem;\n  white-space: nowrap;\n}\n\n.cm-playground__chip-icon {\n  width: 0.78rem;\n  height: 0.78rem;\n  flex: 0 0 auto;\n}\n\n.cm-playground__chip--type-text {\n  border-color: hsl(188 95% 43% / 0.26);\n  background: hsl(188 95% 43% / 0.08);\n  color: hsl(188 95% 74%);\n}\n\n.cm-playground__chip--type-image {\n  border-color: hsl(292 85% 55% / 0.28);\n  background: hsl(292 85% 55% / 0.09);\n  color: hsl(292 85% 78%);\n}\n\n.cm-playground__chip--type-audio {\n  border-color: hsl(148 75% 46% / 0.28);\n  background: hsl(148 75% 46% / 0.09);\n  color: hsl(148 75% 72%);\n}\n\n.cm-playground__chip--type-video {\n  border-color: hsl(42 100% 52% / 0.3);\n  background: hsl(42 100% 52% / 0.09);\n  color: hsl(42 100% 72%);\n}\n\n.cm-playground__chip--type-embedding,\n.cm-playground__chip--type-conversational {\n  border-color: hsl(211 100% 64% / 0.3);\n  background: hsl(211 100% 64% / 0.09);\n  color: hsl(211 100% 78%);\n}\n\n.cm-playground__chip--type-classification,\n.cm-playground__chip--type-translation,\n.cm-playground__chip--type-summarization,\n.cm-playground__chip--type-research {\n  border-color: hsl(270 80% 68% / 0.28);\n  background: hsl(270 80% 68% / 0.09);\n  color: hsl(270 80% 82%);\n}\n\n.cm-playground__chip--provider {\n  border-color: hsl(var(--primary) / 0.18);\n  background: hsl(221 50% 9% / 0.42);\n}\n\n.cm-playground__badge,\n.cm-model-badge {\n  min-width: 0;\n  max-width: min(100%, 24rem);\n  min-height: 2.2rem;\n  padding: 0 0.72rem;\n  cursor: pointer;\n}\n\n.cm-playground__badge:hover,\n.cm-playground__badge:focus-visible,\n.cm-model-badge:hover,\n.cm-model-badge:focus-visible,\n.cm-playground__chip:hover,\n.cm-playground__chip:focus-visible,\n.cm-playground__chip--active {\n  transform: translateY(-1px);\n  outline: none;\n  border-color: hsl(var(--primary) / 0.44);\n  background: hsl(var(--primary) / 0.09);\n  color: hsl(var(--foreground));\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.12);\n}\n\n.cm-model-badge[data-placeholder=\"true\"] {\n  color: hsl(var(--muted-foreground));\n  font-weight: 500;\n}\n\n.cm-playground__badge-dot,\n.cm-model-badge__dot {\n  width: 0.48rem;\n  height: 0.48rem;\n  border-radius: 999px;\n  background: hsl(var(--primary));\n  box-shadow: 0 0 12px hsl(var(--primary) / 0.56);\n  flex: 0 0 auto;\n}\n\n.cm-playground__badge-name,\n.cm-model-badge__name {\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.cm-playground__badge-price,\n.cm-playground__badge-shortcut,\n.cm-model-badge__price,\n.cm-model-badge__shortcut,\n.cm-playground__chip-count {\n  color: hsl(var(--muted-foreground));\n  font-size: 0.62rem;\n}\n\n.cm-playground__pane-toggle,\n.cm-playground__pane-expand {\n  display: inline-grid;\n  place-items: center;\n  border: 1px solid hsl(var(--primary) / 0.22);\n  background: hsl(221 50% 9% / 0.72);\n  color: hsl(var(--primary));\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.08);\n  cursor: pointer;\n}\n\n.cm-playground__pane-toggle {\n  position: absolute;\n  left: -0.7rem;\n  top: 0.85rem;\n  z-index: 4;\n  width: 1.55rem;\n  height: 1.55rem;\n  border-radius: 999px;\n}\n\n.cm-playground__pane-expand {\n  display: none;\n  position: fixed;\n  right: 0.2rem;\n  top: 50%;\n  z-index: 45;\n  width: 2rem;\n  height: 3.25rem;\n  border-radius: 999px 0 0 999px;\n}\n\n@container (min-width: 62rem) {\n  .cm-playground__pane-expand {\n    display: inline-grid;\n  }\n}\n\n.cm-playground__cmd-backdrop,\n.cm-command-overlay {\n  position: fixed;\n  inset: 0;\n  z-index: 90;\n  display: flex;\n  align-items: flex-start;\n  justify-content: center;\n  padding: max(8vh, 4rem) 1rem 1rem;\n  background:\n    radial-gradient(circle at 50% 18%, hsl(var(--primary) / 0.09), transparent 30rem),\n    hsl(240 30% 2% / 0.72);\n  backdrop-filter: blur(14px);\n}\n\n.cm-playground__cmd-panel,\n.cm-command-panel {\n  width: min(42rem, 100%);\n  max-height: min(70dvh, 42rem);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.24);\n  border-radius: 18px;\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.58), hsl(221 50% 9% / 0.78)),\n    hsl(var(--background));\n  box-shadow:\n    0 0 44px hsl(var(--primary) / 0.12),\n    inset 0 1px 0 hsl(0 0% 100% / 0.08);\n}\n\n.cm-playground__cmd-header,\n.cm-playground__cmd-footer,\n.cm-command-header,\n.cm-command-footer {\n  flex: 0 0 auto;\n  padding: 0.75rem 0.95rem;\n  border-color: hsl(var(--primary) / 0.12);\n}\n\n.cm-playground__cmd-header,\n.cm-command-header {\n  border-bottom: 1px solid hsl(var(--primary) / 0.12);\n}\n\n.cm-playground__cmd-footer,\n.cm-command-footer {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 0.75rem;\n  border-top: 1px solid hsl(var(--primary) / 0.12);\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  flex-wrap: wrap;\n}\n\n.cm-playground__cmd-input,\n.cm-command-input {\n  width: 100%;\n  border: 0;\n  outline: none;\n  background: transparent;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: clamp(0.92rem, 2.2vw, 1.1rem);\n}\n\n.cm-playground__cmd-list,\n.cm-command-list {\n  flex: 1;\n  min-height: 0;\n  overflow: auto;\n  padding: 0.35rem;\n}\n\n.cm-playground__cmd-group,\n.cm-command-group {\n  padding: 0.55rem 0.7rem 0.28rem;\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 800;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n}\n\n.cm-playground__cmd-item,\n.cm-command-item {\n  display: flex;\n  align-items: center;\n  gap: 0.65rem;\n  min-height: 2.55rem;\n  border: 1px solid transparent;\n  border-radius: 12px;\n  padding: 0 0.75rem;\n  cursor: pointer;\n}\n\n.cm-playground__cmd-item:hover,\n.cm-playground__cmd-item--selected,\n.cm-playground__cmd-item--current,\n.cm-command-item:hover,\n.cm-command-item[data-selected=\"true\"],\n.cm-command-item[data-current=\"true\"] {\n  border-color: hsl(var(--primary) / 0.22);\n  background: hsl(var(--primary) / 0.08);\n}\n\n.cm-playground__cmd-item-name,\n.cm-command-item__name {\n  min-width: 0;\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  color: hsl(var(--foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.82rem;\n}\n\n.cm-playground__cmd-item-meta,\n.cm-playground__cmd-footer-hints,\n.cm-command-item__meta,\n.cm-command-footer__hints {\n  display: flex;\n  align-items: center;\n  gap: 0.4rem;\n  flex-wrap: wrap;\n}\n\n.cm-playground__cmd-item-provider,\n.cm-playground__cmd-item-type,\n.cm-playground__cmd-item-price,\n.cm-playground__cmd-hint kbd,\n.cm-command-item__provider,\n.cm-command-item__type,\n.cm-command-item__price,\n.cm-command-hint kbd {\n  border-radius: 999px;\n  background: hsl(221 50% 9% / 0.52);\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.62rem;\n  padding: 0.22rem 0.45rem;\n}\n\n.cm-playground__cmd-empty,\n.cm-command-empty {\n  padding: 2rem 1rem;\n  color: hsl(var(--muted-foreground));\n  text-align: center;\n}\n\n.cm-chat {\n  display: flex;\n  min-width: 0;\n  min-height: 0;\n  flex-direction: column;\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 16px;\n  background: hsl(221 50% 9% / 0.24);\n}\n\n.cm-chat--bare {\n  border: 0;\n  border-radius: 0;\n  background: transparent;\n}\n\n.cm-chat__header,\n.cm-chat__activity,\n.cm-chat__composer {\n  flex: 0 0 auto;\n  border-color: hsl(var(--primary) / 0.1);\n}\n\n.cm-chat__header {\n  display: flex;\n  align-items: center;\n  gap: 0.55rem;\n  padding: 0.75rem 0.9rem;\n  border-bottom: 1px solid hsl(var(--primary) / 0.1);\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n}\n\n.cm-chat__body {\n  position: relative;\n  flex: 1;\n  min-height: 0;\n  overflow: auto;\n  padding: clamp(0.85rem, 2cqi, 1.15rem);\n}\n\n.cm-chat__empty {\n  display: grid;\n  place-items: center;\n  gap: 0.35rem;\n  min-height: 14rem;\n  color: hsl(var(--muted-foreground));\n  text-align: center;\n}\n\n.cm-chat__messages {\n  display: grid;\n  gap: 1rem;\n}\n\n.cm-chat-message {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.7rem;\n  min-width: 0;\n}\n\n.cm-chat-message--user {\n  justify-content: flex-end;\n}\n\n.cm-chat-message__avatar {\n  width: 2rem;\n  height: 2rem;\n  flex: 0 0 auto;\n}\n\n.cm-chat-message__avatar-assistant,\n.cm-chat-message__avatar-user {\n  background: hsl(var(--primary) / 0.14);\n  color: hsl(var(--primary));\n}\n\n.cm-chat-message__avatar-user {\n  background: hsl(var(--accent) / 0.15);\n  color: hsl(var(--accent));\n}\n\n.cm-chat-message__bubble {\n  position: relative;\n  max-width: min(44rem, 82%);\n  min-width: 0;\n  border: 1px solid hsl(var(--primary) / 0.14);\n  border-radius: 16px;\n  padding: 0.75rem 0.85rem;\n  background:\n    linear-gradient(145deg, hsl(226 21% 23% / 0.34), hsl(221 50% 9% / 0.28));\n  color: hsl(var(--foreground));\n  box-shadow: inset 0 1px 0 hsl(0 0% 100% / 0.045);\n}\n\n.cm-chat-message__bubble--user {\n  border-color: hsl(var(--accent) / 0.22);\n  background:\n    linear-gradient(145deg, hsl(var(--accent) / 0.24), hsl(var(--primary) / 0.08));\n}\n\n.cm-chat-message__actions {\n  position: absolute;\n  right: 0;\n  top: -2.1rem;\n  display: none;\n  align-items: center;\n  gap: 0.25rem;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 999px;\n  background: hsl(var(--background) / 0.86);\n  padding: 0.18rem;\n  backdrop-filter: blur(12px);\n}\n\n.cm-chat-message__bubble:hover .cm-chat-message__actions,\n.cm-chat-message__bubble:focus-within .cm-chat-message__actions {\n  display: flex;\n}\n\n.cm-chat__activity {\n  display: flex;\n  align-items: center;\n  gap: 0.55rem;\n  border-top: 1px dashed hsl(var(--primary) / 0.16);\n  background: hsl(221 50% 9% / 0.34);\n  padding: 0.55rem 0.8rem;\n  color: hsl(var(--muted-foreground));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.72rem;\n}\n\n.cm-chat__composer {\n  border-top: 1px solid hsl(var(--primary) / 0.1);\n  padding: clamp(0.7rem, 1.7cqi, 0.9rem);\n}\n\n.cm-chat__attachments {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.5rem;\n  margin-bottom: 0.6rem;\n}\n\n.cm-chat__attachment {\n  position: relative;\n  display: grid;\n  width: 3rem;\n  height: 3rem;\n  place-items: center;\n  overflow: hidden;\n  border: 1px solid hsl(var(--primary) / 0.16);\n  border-radius: 12px;\n  background: hsl(221 50% 9% / 0.48);\n}\n\n.cm-chat__composer-row {\n  display: flex;\n  align-items: flex-end;\n  gap: 0.55rem;\n  min-width: 0;\n}\n\n.cm-chat__composer-row textarea {\n  min-height: 2.55rem;\n  max-height: calc(1.45em * 4 + 1rem);\n  overflow-y: auto;\n  border-color: hsl(var(--primary) / 0.16);\n  border-radius: 14px;\n  background: hsl(221 50% 9% / 0.4);\n}\n\n.cm-chat__jump {\n  position: sticky;\n  bottom: 0.35rem;\n  z-index: 3;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.38rem;\n  width: max-content;\n  margin: 0.5rem auto 0;\n  padding: 0.42rem 0.68rem;\n  border: 1px solid hsl(var(--primary) / 0.28);\n  border-radius: 999px;\n  background: hsl(221 50% 8% / 0.86);\n  color: hsl(var(--primary));\n  font-family: var(--font-mono), monospace;\n  font-size: 0.68rem;\n  font-weight: 800;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  box-shadow: 0 0 18px hsl(var(--primary) / 0.16);\n  backdrop-filter: blur(14px);\n}\n\n.cm-chat__icon-action {\n  color: hsl(var(--muted-foreground));\n}\n\n.cm-chat__icon-action:hover {\n  color: hsl(var(--primary));\n}\n\n@media (max-width: 820px) {\n  .cm-playground {\n    height: calc(100dvh - clamp(10rem, 28vw, 11.75rem) - env(safe-area-inset-top) - env(safe-area-inset-bottom));\n    min-height: 30rem;\n  }\n\n  .cm-playground__title-text {\n    display: none;\n  }\n\n  .cm-playground__chips {\n    flex-basis: 100%;\n    order: 4;\n  }\n\n  .cm-playground__chip-label,\n  .cm-playground__divider {\n    display: none;\n  }\n\n  .cm-playground__chip-section--providers {\n    flex-basis: 42%;\n  }\n\n  .cm-chat-message__bubble {\n    max-width: 88%;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .cm-app-chrome__navitem,\n  .cm-hud-button,\n  .cm-app-chrome__hud-popover,\n  .cm-playground__badge,\n  .cm-playground__chip,\n  .cm-chat-message__bubble {\n    transition-duration: 0.01ms !important;\n  }\n}\n";
 //# sourceMappingURL=styles.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/shell/styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,QAAQ,w2lEA8zFpB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/shell/styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,QAAQ,08lEA+zFpB,CAAC"}

package/dist/shell/styles.js

@@ -221,11 +221,12 @@ export const shellCss = `/**
   overscroll-behavior: contain;
   scrollbar-width: thin;
   padding: var(--cm-workspace-pad);
+  padding-bottom: max(clamp(0.45rem, 1.1vw, 0.85rem), env(safe-area-inset-bottom));
 }
 
 .cm-workspace-canvas--fade {
-  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 1.6%, #000 98.4%, transparent 100%);
-  mask-image: linear-gradient(180deg, transparent 0, #000 1.6%, #000 98.4%, transparent 100%);
+  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 1.5%, #000 95%, transparent 100%);
+  mask-image: linear-gradient(180deg, transparent 0, #000 1.5%, #000 95%, transparent 100%);
 }
 
 .cm-workspace__body {
@@ -798,7 +799,7 @@ export const shellCss = `/**
   padding:
     calc(env(safe-area-inset-top) + clamp(4.8rem, 7vw, 5.9rem))
     clamp(5.25rem, 6vw, 7rem)
-    calc(env(safe-area-inset-bottom) + clamp(5.35rem, 7.4vw, 6.35rem));
+    calc(env(safe-area-inset-bottom) + clamp(0.85rem, 2vw, 1.55rem));
 }
 
 .cm-app-chrome__navdock {
@@ -1572,7 +1573,7 @@ export const shellCss = `/**
     padding:
       calc(env(safe-area-inset-top) + clamp(4.25rem, 14vw, 4.85rem))
       clamp(0.75rem, 4.2vw, 1.05rem)
-      calc(env(safe-area-inset-bottom) + clamp(5.55rem, 16vw, 6.55rem));
+      calc(env(safe-area-inset-bottom) + var(--cm-hud-size) + clamp(0.72rem, 3.4vw, 1rem));
   }
 
   .cm-app-chrome__hud {

package/dist/shell/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/shell/styles.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8zFvB,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/shell/styles.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+zFvB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@compose-market/theme",
-  "version": "0.0.97",
+  "version": "0.0.98",
   "description": "Official design tokens and theme system for Compose.Market",
   "keywords": [
     "design-tokens",
@@ -171,4 +171,4 @@
     "access": "public"
   },
   "module": "./dist/index.js"
-}
+}