/* ERZEUGT von tools/sync_appshot_css.py — NICHT von Hand bearbeiten.
   Quelle: app/src/styles/base.css, app/src/styles/chat.css
   Erzeugt am: 2026-09-02 */

.appshot {
  font-family: Segoe UI Variable Text, Segoe UI Variable, Segoe UI, system-ui, sans-serif;
  font-size: var(--ca-fs-base);
  line-height: var(--ca-lh-body);
  color: rgb(var(--ca-fg));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.appshot *,
.appshot *::before,
.appshot *::after {
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
  border-color: rgb(var(--ca-edge));
}

.appshot button,
.appshot input,
.appshot optgroup,
.appshot select,
.appshot textarea {
  font-family: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-size: 100%;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

.appshot button,
.appshot select {
  text-transform: none;
}

.appshot button,
.appshot input:where([type='button']),
.appshot input:where([type='reset']),
.appshot input:where([type='submit']) {
  -webkit-appearance: button;
  background-color: transparent;
  background-image: none;
}

.appshot textarea {
  resize: vertical;
}

.appshot input::-moz-placeholder,
.appshot textarea::-moz-placeholder {
  opacity: 1;
  color: #9ca3af;
}

.appshot input::placeholder,
.appshot textarea::placeholder {
  opacity: 1;
  color: #9ca3af;
}

.appshot button,
.appshot [role="button"] {
  cursor: pointer;
}

.appshot :disabled {
  cursor: default;
}

.appshot {
  --ca-r-window: 10px;
  --ca-r-tile: 12px;
  --ca-r-bubble: 14px;
  --ca-r-mark: 18px;
  --ca-r-control: 8px;
  --ca-r-pill: 999px;
  --ca-fs-2xs: 0.625rem;
  --ca-fs-xs: 0.6875rem;
  --ca-fs-sm: 0.75rem;
  --ca-fs-base: 0.875rem;
  --ca-fs-lg: 1rem;
  --ca-fs-xl: 1.25rem;
  --ca-fs-2xl: 1.5rem;
  --ca-lh-body: 1.5;
  --ca-h-control: 2rem;
  --ca-h-control-sm: 1.75rem;
  --ca-h-control-lg: 2.25rem;
  --ca-h-titlebar: 2.25rem;
  --ca-icon-btn: 2rem;
  --ca-icon-btn-sm: 1.75rem;
  --ca-icon-glyph: 1.125rem;
  --ca-chat-gutter: 0.625rem;
  --ca-msg-gap: 0.75rem;
  --ca-msg-gap-tight: 0.375rem;
  --ca-measure-empty: 22.5rem;
  --ca-measure-empty-text: 17.5rem;
  --ca-gutter: 0.75rem;
  --ca-col-content: 30rem;
  --ca-field-gap: 0.75rem;
  --ca-field-control: 10.25rem;
  --ca-field-control-min: 6.5rem;
  --ca-field-label-min: 7.25rem;
  --ca-pad-control: 0.625rem;
  --ca-rail-labels: 7.5rem;
  --ca-rail-icons: 3rem;
  --ca-pad-input-y: 0.375rem;
  --ca-pad-input-x: 0.5625rem;
  --ca-card-pad-y: 0.625rem;
  --ca-card-pad-x: 0.75rem;
  --ca-stack-gap: 0.5rem;
  --ca-textarea-min: 4.75rem;
  --ca-toggle-w: 2.25rem;
  --ca-toggle-h: 1.25rem;
  --ca-toggle-knob: 0.875rem;
  --ca-shadow-menu: 0 8px 24px rgb(0 0 0 / 0.18), 0 2px 6px rgb(0 0 0 / 0.1);
  --ca-shadow-dialog: 0 16px 48px rgb(0 0 0 / 0.28);
}

.appshot {
  --ca-bg: 255 255 255;
  --ca-surface: 241 243 244;
  --ca-surface-2: 232 234 237;
  --ca-surface-3: 218 220 224;
  --ca-edge: 218 220 224;
  --ca-fg: 32 33 36;
  --ca-fg-muted: 95 99 104;
  --ca-fg-subtle: 128 134 139;
  --ca-danger: 197 34 31;
  --ca-danger-soft: 252 232 230;
  --ca-warn: 154 82 0;
  --ca-warn-soft: 254 243 224;
  --ca-ok: 24 128 56;
  --ca-ok-soft: 236 247 239;
  --ca-code-bg: 241 243 244;
  --ca-code-inline: 232 234 237;
  --ca-scrollbar: 176 180 186;
  --ca-scrim: 32 33 36;
  --ca-accent-soft: 0.12;
  --ca-accent-soft-strong: 0.2;
  --ca-shadow-raise: 0 1px 2px rgb(0 0 0 / 0.06), 0 4px 12px rgb(0 0 0 / 0.07);
  --ca-accent: 26 115 232;
  --ca-accent-hover: 23 104 209;
  --ca-accent-press: 19 88 177;
  --ca-on-accent: 255 255 255;
  --ca-accent-text: 23 104 209;
  --ca-focus: 26 115 232;
}

:root[data-theme="dark"] .appshot {
  --ca-bg: 32 33 36;
  --ca-surface: 41 42 45;
  --ca-surface-2: 53 54 58;
  --ca-surface-3: 66 68 72;
  --ca-edge: 60 64 67;
  --ca-fg: 232 234 237;
  --ca-fg-muted: 154 160 166;
  --ca-fg-subtle: 128 134 139;
  --ca-danger: 242 139 130;
  --ca-danger-soft: 56 33 31;
  --ca-warn: 253 214 99;
  --ca-warn-soft: 58 45 20;
  --ca-ok: 129 201 149;
  --ca-ok-soft: 33 53 39;
  --ca-code-bg: 24 25 27;
  --ca-code-inline: 53 54 58;
  --ca-scrollbar: 95 99 104;
  --ca-scrim: 0 0 0;
  --ca-accent-soft: 0.2;
  --ca-accent-soft-strong: 0.28;
  --ca-shadow-raise: 0 1px 2px rgb(0 0 0 / 0.28), 0 4px 14px rgb(0 0 0 / 0.32);
  --ca-accent: 138 180 248;
  --ca-accent-hover: 154 191 250;
  --ca-accent-press: 120 165 240;
  --ca-on-accent: 32 33 36;
  --ca-accent-text: 138 180 248;
  --ca-focus: 138 180 248;
}

.appshot .scroll-thin::-webkit-scrollbar {
  width: 8px;
}

.appshot .scroll-thin::-webkit-scrollbar-thumb {
  border-radius: var(--ca-r-pill);
  background-color: rgb(var(--ca-scrollbar) / 0.9);
  border: 2px solid transparent;
  background-clip: padding-box;
}

.appshot .scroll-thin::-webkit-scrollbar-track {
  background: transparent;
}

.appshot .scroll-thin::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}

.appshot .scroll-hidden {
  scrollbar-width: none;
}

.appshot .scroll-hidden::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.appshot .chat-scroll {
  scrollbar-gutter: stable;
}

.appshot .chat-scroll[data-edge="top"] {
  box-shadow: inset 0 1px 0 rgb(var(--ca-edge));
}

.appshot .chat-scroll[data-edge="bottom"] {
  box-shadow: inset 0 -1px 0 rgb(var(--ca-edge));
}

.appshot .chat-scroll[data-edge="both"] {
  box-shadow: inset 0 1px 0 rgb(var(--ca-edge)),
      inset 0 -1px 0 rgb(var(--ca-edge));
}

.appshot .md :is(p, ul, ol, pre, table) {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.appshot .md ul {
  list-style-type: disc;
  padding-left: 1.25rem;
}

.appshot .md ol {
  list-style-type: decimal;
  padding-left: 1.25rem;
}

.appshot .md code {
  cursor: pointer;
  border-radius: 0.25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-code-inline) / var(--tw-bg-opacity, 1));
  padding-left: 0.375rem;
  padding-right: 0.375rem;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.appshot .md code:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-3) / var(--tw-bg-opacity, 1));
}

.appshot .md code:active {
  background-color: rgb(var(--ca-accent) / 0.2);
}

.appshot .md pre {
  overflow-x: auto;
  border-radius: var(--ca-r-tile);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-code-bg) / var(--tw-bg-opacity, 1));
  padding: 0.75rem;
}

.appshot .md pre code {
  cursor: auto;
  background-color: transparent;
  padding: 0px;
}

.appshot .md pre code:hover {
  background-color: transparent;
}

.appshot .md pre code:active {
  background-color: transparent;
}

.appshot .md .code-block-row {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  display: block;
  width: 100%;
  min-width: 0px;
  overflow: hidden;
  border-radius: var(--ca-r-tile);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-code-bg) / var(--tw-bg-opacity, 1));
}

.appshot .md .code-block-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  padding-left: 0.75rem;
  padding-right: 0.25rem;
}

.appshot .md .code-block-language {
  min-width: 0px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--ca-fs-2xs);
  line-height: 1.4;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .md .code-block-actions {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 0.25rem;
}

.appshot .md .code-block-row pre {
  margin-top: 0px;
  margin-bottom: 0px;
  border-radius: 0px;
  background-color: transparent;
  padding: 0.75rem;
  font-size: var(--ca-fs-sm);
  line-height: 1.45;
  overflow-x: hidden;
  overflow-y: hidden;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.appshot .md .code-line {
  display: block;
}

.appshot .md .code-line:empty::after {
  content: " ";
}

.appshot .md .code-copy-button, .appshot .md .code-apply-button {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: var(--ca-r-pill);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.appshot .md .code-copy-button {
  height: var(--ca-icon-btn-sm);
  width: var(--ca-icon-btn-sm);
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .md .code-copy-button:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-3) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
}

.appshot .md .code-copy-button svg, .appshot .md .code-apply-button svg {
  height: 1rem;
  width: 1rem;
  flex-shrink: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
}

.appshot .md .code-apply-button {
  height: var(--ca-icon-btn-sm);
  gap: 0.25rem;
  padding-left: 0.375rem;
  padding-right: 0.625rem;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-accent-text) / var(--tw-text-opacity, 1));
}

.appshot .md .code-apply-button:disabled {
  cursor: default;
  opacity: 0.6;
}

.appshot .md .code-apply-button {
  background-color: rgb(var(--ca-accent) / var(--ca-accent-soft));
}

.appshot .md .code-apply-button:hover:not(:disabled) {
  background-color: rgb(var(--ca-accent) / var(--ca-accent-soft-strong));
}

.appshot .md .code-apply-label {
  white-space: nowrap;
}

.appshot .md .hl-comment {
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
  font-style: italic;
}

.appshot .md .hl-string {
  color: rgb(var(--ca-ok));
}

.appshot .md .hl-number {
  color: rgb(var(--ca-warn));
}

.appshot .md .hl-keyword {
  --tw-text-opacity: 1;
  color: rgb(var(--ca-accent-text) / var(--tw-text-opacity, 1));
}

.appshot .md .code-apply-button[data-apply-state="applied"] {
  background-color: rgb(var(--ca-ok) / 0.15);
  --tw-text-opacity: 1;
  color: rgb(var(--ca-ok) / var(--tw-text-opacity, 1));
}

.appshot .md .code-apply-button[data-apply-state="failed"] {
  background-color: rgb(var(--ca-danger) / 0.15);
  --tw-text-opacity: 1;
  color: rgb(var(--ca-danger) / var(--tw-text-opacity, 1));
}

.appshot .md .code-apply-spinner {
  animation: code-apply-spin 0.8s linear infinite;
}

.appshot .md a {
  --tw-text-opacity: 1;
  color: rgb(var(--ca-accent-text) / var(--tw-text-opacity, 1));
  text-decoration-line: underline;
  text-underline-offset: 2px;
}

.appshot .md :is(h1, h2, h3, h4, h5, h6) {
  margin-bottom: 0.25rem;
  margin-top: 1rem;
  font-weight: 600;
  line-height: 1.375;
}

.appshot .md :is(h1, h2) {
  font-size: var(--ca-fs-lg);
  line-height: 1.4;
}

.appshot .md :is(h3, h4) {
  font-size: 1.0625rem;
}

.appshot .md :is(h5, h6) {
  font-size: var(--ca-fs-base);
  line-height: var(--ca-lh-body);
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .md > *:first-child {
  margin-top: 0px;
}

.appshot .md > *:last-child {
  margin-bottom: 0px;
}

.appshot .md blockquote {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
  padding-left: 0.75rem;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
  border-left: 2px solid rgb(var(--ca-edge));
}

.appshot .md blockquote > *:first-child {
  margin-top: 0px;
}

.appshot .md blockquote > *:last-child {
  margin-bottom: 0px;
}

.appshot .md hr {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  border-width: 0px;
  border-top: 1px solid rgb(var(--ca-edge));
}

.appshot .md :is(ul, ol) :is(ul, ol) {
  margin-top: 0.125rem;
  margin-bottom: 0.125rem;
}

.appshot .md li {
  margin-top: 0.125rem;
  margin-bottom: 0.125rem;
}

.appshot .md li > p {
  margin-top: 0px;
  margin-bottom: 0px;
}

.appshot .md li:has(> input[type="checkbox"]) {
  list-style-type: none;
  margin-left: -1.25rem;
}

.appshot .md li > input[type="checkbox"] {
  margin-right: 0.375rem;
  height: 0.75rem;
  width: 0.75rem;
  vertical-align: middle;
  accent-color: rgb(var(--ca-accent) / 1);
}

.appshot .md table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  table-layout: fixed;
}

.appshot .md :is(th, td) {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  text-align: left;
  vertical-align: top;
  border: 1px solid rgb(var(--ca-edge));
  overflow-wrap: anywhere;
}

.appshot .md th {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
  font-weight: 600;
}

.appshot .app-shell {
  position: relative;
  display: flex;
  height: 100%;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--ca-r-window);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-bg) / var(--tw-bg-opacity, 1));
}

.appshot .titlebar {
  display: grid;
  height: var(--ca-h-titlebar);
  flex-shrink: 0;
  align-items: center;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-bg) / var(--tw-bg-opacity, 1));
  padding-left: 0.375rem;
}

.appshot .titlebar {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}

.appshot .titlebar-leading, .appshot .titlebar-trailing {
  display: flex;
  align-items: center;
  gap: 0.125rem;
}

.appshot .titlebar-trailing {
  justify-content: flex-end;
  gap: 0px;
}

.appshot .titlebar-title {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  text-align: center;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .titlebar-title-group .titlebar-title {
  padding-right: 0.25rem;
}

.appshot .titlebar-button {
  display: flex;
  height: var(--ca-icon-btn-sm);
  width: var(--ca-icon-btn-sm);
  align-items: center;
  justify-content: center;
  border-radius: var(--ca-r-pill);
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.appshot .titlebar-button:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
}

.appshot .titlebar-button:active {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-3) / var(--tw-bg-opacity, 1));
}

.appshot .titlebar-button svg {
  height: 1rem;
  width: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.appshot .titlebar-new {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-accent) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-on-accent) / var(--tw-text-opacity, 1));
}

.appshot .titlebar-new:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-accent-hover) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-on-accent) / var(--tw-text-opacity, 1));
}

.appshot .titlebar-new:active {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-accent-press) / var(--tw-bg-opacity, 1));
}

.appshot .titlebar-new:disabled {
  cursor: not-allowed;
  opacity: 0.4;
}

.appshot .titlebar-new:hover:disabled {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-accent) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-on-accent) / var(--tw-text-opacity, 1));
}

.appshot .titlebar-new {
  height: 23px;
  width: 23px;
}

.appshot .titlebar-new svg {
  height: 1rem;
  width: 1rem;
  stroke-width: 1.8;
}

.appshot .titlebar-close {
  height: var(--ca-h-titlebar);
  width: 46px;
  border-radius: 0px;
  transition-property: none;
  --titlebar-close-red: #c42b1c;
}

.appshot .titlebar-close svg {
  height: 1.25rem;
  width: 1.25rem;
  stroke-width: 2;
}

.appshot .titlebar-close:hover, .appshot .titlebar-close:active {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  background: var(--titlebar-close-red);
}

.appshot .titlebar-close:active {
  background: color-mix(in srgb, var(--titlebar-close-red) 88%, #000);
}

.appshot .titlebar-close:focus-visible {
  outline-offset: -2px;
}

.appshot .composer-wrap {
  position: relative;
  flex-shrink: 0;
  padding-left: var(--ca-chat-gutter);
  padding-right: var(--ca-chat-gutter);
  padding-bottom: 0.625rem;
  padding-top: 0.375rem;
}

.appshot .composer-surface {
  border-radius: var(--ca-r-bubble);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface) / var(--tw-bg-opacity, 1));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
  box-shadow: var(--ca-shadow-raise);
  transition: background-color 150ms, box-shadow 150ms;
}

.appshot .composer-wrap.is-keyboard-focus .composer-surface:focus-within {
  box-shadow: 0 0 0 2px rgb(var(--ca-focus)), var(--ca-shadow-raise);
}

.appshot .composer-surface.is-dragging {
  background-color: rgb(var(--ca-accent) / var(--ca-accent-soft-strong));
  box-shadow: 0 0 0 2px rgb(var(--ca-focus)), var(--ca-shadow-raise);
}

.appshot .composer-drop-hint {
  pointer-events: none;
  margin-bottom: 0.25rem;
  border-radius: var(--ca-r-control);
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  text-align: center;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-accent-text) / var(--tw-text-opacity, 1));
  background-color: rgb(var(--ca-accent) / var(--ca-accent-soft));
}

.appshot .composer-input {
  width: 100%;
  -webkit-user-select: text;
  -moz-user-select: text;
  user-select: text;
  resize: none;
  background-color: transparent;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
  padding-right: 0.25rem;
  line-height: 1.375;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.appshot .composer-input::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .composer-input::placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .composer-input:disabled {
  opacity: 0.6;
}

.appshot .composer-grid {
  display: grid;
  align-items: center;
  -moz-column-gap: 0.375rem;
  column-gap: 0.375rem;
  row-gap: 0.125rem;
}

.appshot .composer-grid.has-mode {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  grid-template-areas: "attach input mode send";
}

.appshot .composer-grid.without-mode {
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-template-areas: "attach input send";
}

.appshot .composer-grid.has-mode.is-expanded {
  grid-template-areas: "input input input input"
      "attach . mode send";
}

.appshot .composer-grid.without-mode.is-expanded {
  grid-template-areas: "input input input"
      "attach . send";
}

.appshot .composer-attach {
  grid-area: attach;
}

.appshot .composer-input {
  grid-area: input;
}

.appshot .composer-mode {
  grid-area: mode;
}

.appshot .composer-send, .appshot .composer-stop {
  grid-area: send;
}

.appshot .composer-icon-button, .appshot .composer-stop, .appshot .composer-send {
  display: flex;
  height: var(--ca-h-control);
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.appshot .composer-icon-button:disabled, .appshot .composer-stop:disabled, .appshot .composer-send:disabled {
  cursor: not-allowed;
  opacity: 0.4;
}

.appshot .composer-icon-button {
  width: var(--ca-h-control);
  border-radius: var(--ca-r-pill);
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .composer-icon-button:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
}

.appshot .composer-icon-button:active {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-3) / var(--tw-bg-opacity, 1));
}

.appshot .composer-icon-button svg {
  height: var(--ca-icon-glyph);
  width: var(--ca-icon-glyph);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.appshot .composer-mode {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  border-radius: var(--ca-r-pill);
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.appshot .composer-mode:disabled {
  cursor: not-allowed;
  opacity: 0.4;
}

.appshot .composer-mode {
  height: 1.5rem;
  align-self: center;
  background-color: rgb(var(--ca-surface-3));
  font-size: var(--ca-fs-xs);
}

.appshot .composer-mode:hover:not(:disabled) {
  background-color: rgb(var(--ca-surface-2));
}

.appshot .composer-mode[data-slot="deep"] {
  color: rgb(var(--ca-accent-text));
  background-color: rgb(var(--ca-accent) / var(--ca-accent-soft));
}

.appshot .composer-mode[data-slot="deep"]:hover:not(:disabled) {
  background-color: rgb(var(--ca-accent) / var(--ca-accent-soft-strong));
}

.appshot .composer-stop, .appshot .composer-send {
  border-radius: var(--ca-r-pill);
  height: var(--ca-h-control-lg);
  width: var(--ca-h-control-lg);
}

.appshot .composer-stop svg, .appshot .composer-send svg {
  height: 1.25rem;
  width: 1.25rem;
}

.appshot .composer-stop {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
}

.appshot .composer-stop:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-3) / var(--tw-bg-opacity, 1));
}

.appshot .composer-stop svg {
  fill: currentColor;
  stroke: none;
}

.appshot .composer-send {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-accent) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-on-accent) / var(--tw-text-opacity, 1));
}

.appshot .composer-send:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-accent-hover) / var(--tw-bg-opacity, 1));
}

.appshot .composer-send:active {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-accent-press) / var(--tw-bg-opacity, 1));
}

.appshot .composer-send svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.appshot .composer-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-top: 0.5rem;
}

.appshot .composer-chip {
  display: flex;
  min-width: 0px;
  max-width: 100%;
  align-items: center;
  justify-content: center;
  border-radius: var(--ca-r-pill);
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.appshot .composer-chip:disabled {
  cursor: not-allowed;
  opacity: 0.4;
}

.appshot .composer-chip {
  flex: 1 1 auto;
  min-height: var(--ca-h-control);
  background: rgb(var(--ca-surface-3));
  text-align: center;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
}

.appshot .composer-chip:hover:not(:disabled) {
  color: rgb(var(--ca-accent-text));
  background: rgb(var(--ca-accent) / var(--ca-accent-soft));
}

.appshot .composer-chip:active:not(:disabled) {
  background: rgb(var(--ca-accent) / 0.28);
}

.appshot .context-preview {
  min-width: 0;
  max-width: 100%;
}

.appshot .context-image-card {
  position: relative;
  display: flex;
  height: 5rem;
  min-width: 0px;
  max-width: 100%;
  align-items: center;
  overflow: hidden;
  border-radius: var(--ca-r-bubble);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
}

.appshot .context-image-toggle {
  position: absolute;
  bottom: 0.25rem;
  left: 0.25rem;
  z-index: 10;
  border-radius: var(--ca-r-pill);
  background-color: rgb(var(--ca-bg) / 0.9);
  padding-left: 0.375rem;
  padding-right: 0.375rem;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
  font-size: 11px;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
  --tw-shadow: var(--ca-shadow-menu);
  --tw-shadow-colored: var(--ca-shadow-menu);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.appshot .context-image-toggle:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-bg) / var(--tw-bg-opacity, 1));
}

.appshot .context-processing-card {
  display: flex;
  height: 2.25rem;
  min-width: 9rem;
  max-width: 100%;
  align-items: center;
  gap: 0.5rem;
  border-radius: var(--ca-r-bubble);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}

.appshot .context-processing-spinner {
  display: block;
  height: 1rem;
  width: 1rem;
  flex-shrink: 0;
  border-radius: 9999px;
  border-width: 2px;
  border-color: rgb(var(--ca-fg-muted) / 0.4);
  --tw-border-opacity: 1;
  border-top-color: rgb(var(--ca-accent-text) / var(--tw-border-opacity, 1));
  animation: context-spin 0.8s linear infinite;
}

.appshot .context-card {
  position: relative;
  min-width: 0px;
  max-width: 100%;
  border-radius: var(--ca-r-bubble);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
  padding: 0.625rem;
}

.appshot .context-selection-text {
  min-width: 0px;
  max-width: 100%;
  white-space: pre-wrap;
  overflow-wrap: break-word;
  font-family: Cascadia Code, Cascadia Mono, Consolas, ui-monospace, monospace;
  font-size: var(--ca-fs-sm);
  line-height: 1.375;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
}

.appshot .context-selection-text.is-clamped {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.appshot .context-card.is-rejected {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-danger-soft) / var(--tw-bg-opacity, 1));
}

.appshot .context-eyebrow {
  margin-bottom: 0.25rem;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.025em;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .context-expand {
  margin-top: 0.25rem;
  border-radius: var(--ca-r-control);
  padding-left: 0.375rem;
  padding-right: 0.375rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-accent-text) / var(--tw-text-opacity, 1));
}

.appshot .context-expand:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-3) / var(--tw-bg-opacity, 1));
}

.appshot .context-rejected {
  font-size: var(--ca-fs-sm);
  line-height: 1.45;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-danger) / var(--tw-text-opacity, 1));
  overflow-wrap: anywhere;
}

.appshot .context-file-icon {
  height: var(--ca-icon-glyph);
  width: var(--ca-icon-glyph);
  flex-shrink: 0;
  fill: none;
  stroke: rgb(var(--ca-fg-muted) / 1);
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.appshot .context-remove {
  display: flex;
  height: 1.75rem;
  width: 1.75rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: var(--ca-r-pill);
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.appshot .context-remove:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-danger-soft) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-danger) / var(--tw-text-opacity, 1));
}

.appshot .context-remove.is-overlay {
  position: absolute;
  right: 0.25rem;
  top: 0.25rem;
  z-index: 10;
  display: flex;
  height: 1rem;
  width: 1rem;
  background-color: rgb(var(--ca-bg) / 0.9);
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
  --tw-shadow: var(--ca-shadow-menu);
  --tw-shadow-colored: var(--ca-shadow-menu);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.appshot .context-remove svg {
  height: 0.875rem;
  width: 0.875rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.appshot .message-action svg {
  height: 15px;
  width: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.appshot .message-row {
  display: flex;
  margin-bottom: var(--ca-msg-gap-tight);
}

.appshot .message-row:last-child {
  margin-bottom: 0;
}

.appshot .message-row.is-assistant + .message-row.is-user {
  margin-top: var(--ca-msg-gap);
}

.appshot .message-row.is-assistant:has(.message-actions) {
  margin-bottom: 0;
}

.appshot .message-row.is-assistant:has(.message-actions) + .message-row.is-user {
  margin-top: 0;
}

.appshot .message-row.is-user {
  justify-content: flex-end;
}

.appshot .message-row.is-assistant {
  justify-content: flex-start;
}

.appshot .empty-state {
  margin-left: auto;
  margin-right: auto;
  display: flex;
  width: 100%;
  max-width: var(--ca-measure-empty);
  flex: 1 1 0%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-left: 1rem;
  padding-right: 1rem;
  text-align: center;
  min-height: 0;
}

.appshot .empty-state-mark {
  margin-bottom: 1rem;
  display: grid;
  place-items: center;
  height: 8.5rem;
  width: 8.5rem;
}

.appshot .empty-state-mark svg {
  height: 100%;
  width: 100%;
}

.appshot .empty-state-logo-z {
  fill: rgb(var(--ca-fg));
}

.appshot .empty-state-logo-bolt {
  fill: rgb(var(--ca-accent));
  stroke: rgb(var(--ca-bg));
  stroke-width: 1.6;
  stroke-linejoin: round;
  paint-order: stroke fill;
}

.appshot .empty-state > p {
  margin: 0px;
  max-width: var(--ca-measure-empty-text);
  font-size: var(--ca-fs-sm);
  line-height: 1.625;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .user-message {
  position: relative;
  display: flex;
  min-width: 0px;
  max-width: 95%;
  flex-direction: column;
  align-items: flex-end;
}

.appshot .message-action {
  display: flex;
  height: 1.5rem;
  width: 1.5rem;
  align-items: center;
  justify-content: center;
  border-radius: var(--ca-r-pill);
  font-size: var(--ca-fs-2xs);
  line-height: 1.4;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.appshot .message-action:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
}

.appshot .message-action:disabled {
  opacity: 0.4;
}

.appshot .user-bubble, .appshot .user-bubble-editor {
  min-width: 0px;
  max-width: 100%;
  border-radius: var(--ca-r-bubble);
  border-bottom-right-radius: 0.125rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
  overflow-wrap: anywhere;
  background-color: rgb(var(--ca-accent) / var(--ca-accent-soft));
}

.appshot .user-bubble {
  white-space: pre-wrap;
  overflow-wrap: break-word;
}

.appshot .user-action-card {
  position: relative;
  margin-left: auto;
  display: flex;
  min-width: 0px;
  max-width: 100%;
  align-items: center;
  gap: 0.5rem;
  overflow: hidden;
  border-radius: var(--ca-r-control);
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  text-align: left;
  width: 11rem;
  background: rgb(var(--ca-accent) / var(--ca-accent-soft));
}

.appshot .user-action-card::before {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0px;
  background-color: rgb(var(--ca-accent) / 0.65);
  --dash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' rx='8' fill='none' stroke='%23000' stroke-width='6' stroke-dasharray='7 9'/%3E%3C/svg%3E");
  -webkit-mask-image: var(--dash);
  mask-image: var(--dash);
}

.appshot .user-action-head {
  display: flex;
  min-width: 0px;
  flex: 1 1 0%;
  align-items: center;
  gap: 0.5rem;
}

.appshot .user-action-icon {
  display: grid;
  height: 1.75rem;
  width: 1.75rem;
  flex-shrink: 0;
  place-items: center;
  border-radius: var(--ca-r-control);
  --tw-text-opacity: 1;
  color: rgb(var(--ca-accent-text) / var(--tw-text-opacity, 1));
  background: rgb(var(--ca-accent) / var(--ca-accent-soft-strong));
}

.appshot .user-action-icon svg {
  height: 1rem;
  width: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.appshot .user-action-label {
  stroke: rgb(var(--ca-bg));
  stroke-width: 1.6;
  stroke-linejoin: round;
  paint-order: stroke fill;
}

.appshot .user-bubble-editor:focus-visible {
  outline-offset: 0;
}

.appshot .source-list {
  margin-top: 0.375rem;
  display: flex;
  list-style-type: none;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  padding: 0px;
}

.appshot .source-item {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border-radius: var(--ca-r-pill);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-2) / var(--tw-bg-opacity, 1));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
  font-size: var(--ca-fs-2xs);
  line-height: 1.25;
  text-decoration-line: none;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.appshot .source-item:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-surface-3) / var(--tw-bg-opacity, 1));
}

.appshot .source-item:hover .source-icon {
  stroke: rgb(var(--ca-accent-text) / 1);
}

.appshot .source-domain {
  max-width: 14rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-accent-text) / var(--tw-text-opacity, 1));
}

.appshot .message-error {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 0.625rem;
  border-radius: var(--ca-r-bubble);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--ca-danger-soft) / var(--tw-bg-opacity, 1));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  font-size: var(--ca-fs-sm);
  line-height: 1.45;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-danger) / var(--tw-text-opacity, 1));
}

.appshot .message-error > svg {
  margin-top: 0.125rem;
  height: 1rem;
  width: 1rem;
  flex-shrink: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
}

.appshot .message-error.is-quiet {
  width: 100%;
  background-color: transparent;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-subtle) / var(--tw-text-opacity, 1));
}

.appshot .message-error > button {
  flex-shrink: 0;
  border-radius: var(--ca-r-pill);
  background-color: rgb(var(--ca-danger) / 0.1);
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
  font-weight: 600;
}

.appshot .message-error > button:hover {
  background-color: rgb(var(--ca-danger) / 0.2);
}

.appshot .pointer-events-none {
  pointer-events: none;
}

.appshot .absolute {
  position: absolute;
}

.appshot .relative {
  position: relative;
}

.appshot .inset-0 {
  inset: 0px;
}

.appshot .z-20 {
  z-index: 20;
}

.appshot .mb-1 {
  margin-bottom: 0.25rem;
}

.appshot .mb-2 {
  margin-bottom: 0.5rem;
}

.appshot .mt-1 {
  margin-top: 0.25rem;
}

.appshot .mt-1\.5 {
  margin-top: 0.375rem;
}

.appshot .block {
  display: block;
}

.appshot .flex {
  display: flex;
}

.appshot .grid {
  display: grid;
}

.appshot .h-full {
  height: 100%;
}

.appshot .w-full {
  width: 100%;
}

.appshot .min-w-0 {
  min-width: 0px;
}

.appshot .max-w-full {
  max-width: 100%;
}

.appshot .flex-1 {
  flex: 1 1 0%;
}

.appshot .shrink-0 {
  flex-shrink: 0;
}

.appshot .cursor-zoom-in {
  cursor: zoom-in;
}

.appshot .select-none {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.appshot .select-text {
  -webkit-user-select: text;
  -moz-user-select: text;
  user-select: text;
}

.appshot .resize-none {
  resize: none;
}

.appshot .flex-col {
  flex-direction: column;
}

.appshot .flex-wrap {
  flex-wrap: wrap;
}

.appshot .items-start {
  align-items: flex-start;
}

.appshot .items-center {
  align-items: center;
}

.appshot .justify-end {
  justify-content: flex-end;
}

.appshot .justify-center {
  justify-content: center;
}

.appshot .gap-1 {
  gap: 0.25rem;
}

.appshot .gap-1\.5 {
  gap: 0.375rem;
}

.appshot .gap-2 {
  gap: 0.5rem;
}

.appshot .space-y-1\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
}

.appshot .overflow-hidden {
  overflow: hidden;
}

.appshot .overflow-y-auto {
  overflow-y: auto;
}

.appshot .truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.appshot .break-words {
  overflow-wrap: break-word;
}

.appshot .rounded {
  border-radius: 0.25rem;
}

.appshot .rounded-window {
  border-radius: var(--ca-r-window);
}

.appshot .border {
  border-width: 1px;
}

.appshot .border-0 {
  border-width: 0px;
}

.appshot .px-1\.5 {
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}

.appshot .px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.appshot .px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.appshot .px-chat-gutter {
  padding-left: var(--ca-chat-gutter);
  padding-right: var(--ca-chat-gutter);
}

.appshot .py-0\.5 {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}

.appshot .py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.appshot .text-\[11px\] {
  font-size: 11px;
}

.appshot .text-xs {
  font-size: var(--ca-fs-xs);
  line-height: 1.4;
}

.appshot .font-medium {
  font-weight: 500;
}

.appshot .text-fg {
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg) / var(--tw-text-opacity, 1));
}

.appshot .text-muted {
  --tw-text-opacity: 1;
  color: rgb(var(--ca-fg-muted) / var(--tw-text-opacity, 1));
}

.appshot .outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] .appshot {
  --ca-bg: 32 33 36;
  --ca-surface: 41 42 45;
  --ca-surface-2: 53 54 58;
  --ca-surface-3: 66 68 72;
  --ca-edge: 60 64 67;
  --ca-fg: 232 234 237;
  --ca-fg-muted: 154 160 166;
  --ca-fg-subtle: 128 134 139;
  --ca-danger: 242 139 130;
  --ca-danger-soft: 56 33 31;
  --ca-warn: 253 214 99;
  --ca-warn-soft: 58 45 20;
  --ca-ok: 129 201 149;
  --ca-ok-soft: 33 53 39;
  --ca-code-bg: 24 25 27;
  --ca-code-inline: 53 54 58;
  --ca-scrollbar: 95 99 104;
  --ca-scrim: 0 0 0;
  --ca-accent-soft: 0.2;
  --ca-accent-soft-strong: 0.28;
  --ca-shadow-raise: 0 1px 2px rgb(0 0 0 / 0.28), 0 4px 14px rgb(0 0 0 / 0.32);
  --ca-accent: 138 180 248;
  --ca-accent-hover: 154 191 250;
  --ca-accent-press: 120 165 240;
  --ca-on-accent: 32 33 36;
  --ca-accent-text: 138 180 248;
  --ca-focus: 138 180 248;
  }
}