branch:
styles.css
1804 bytesRaw
@source "../../../node_modules/@cloudflare/kumo/dist/**/*.{js,jsx,ts,tsx}";
@source "../../../node_modules/streamdown/dist/index.js";
@import "tailwindcss";
@import "@cloudflare/kumo/styles/tailwind";
@import "@cloudflare/agents-ui/theme/workers.css";

/* Streamdown theme bridge — maps shadcn-style tokens to Kumo semantics */
.sd-theme {
  --color-primary: light-dark(#e07315, #f6821f);
  --color-primary-foreground: light-dark(#ffffff, #ffffff);
  --color-foreground: light-dark(#111827, #e8eaed);
  --color-background: light-dark(#ffffff, #08090d);
  --color-muted: light-dark(#f0f2f5, #1c1f28);
  --color-muted-foreground: light-dark(#6b7280, #9aa0ab);
  --color-border: light-dark(#e2e5eb, #2c3040);
  overflow-wrap: break-word;
  word-break: break-word;
}
.sd-theme .rounded-xl:has(pre) {
  border: none;
  border-radius: 0;
  padding: 0;
  margin: 0.5rem 0;
  background: none;
}
.sd-theme .rounded-xl:has(pre) > :not(:has(pre)):not(pre) {
  display: none !important;
}
.sd-theme pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.8125rem;
  line-height: 1.5;
  background: var(--color-muted);
  border-radius: 0.375rem;
  padding: 0.75rem;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: break-word;
  border: none;
  margin: 0;
}
.sd-theme pre code {
  all: unset;
  font: inherit;
}

/* Playground-specific: log entry styles (no Kumo equivalent) */
@layer components {
  .log-entry {
    @apply px-3 py-1.5 text-xs font-mono text-kumo-default border-b border-kumo-fill last:border-0;
  }

  .log-entry-in {
    @apply bg-green-500/10;
  }

  .log-entry-out {
    @apply bg-kumo-info-tint;
  }

  .log-entry-error {
    @apply bg-kumo-danger-tint text-kumo-danger;
  }

  .log-entry-info {
    @apply bg-kumo-base;
  }
}