@4djs/assistant 0.0.0

package/src/styles/assistant.css

@@ -0,0 +1,3009 @@
+.btn {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	gap: 0.5rem;
+	padding: 0.625rem 1.125rem;
+	border-radius: var(--radius-base);
+	font-size: 0.875rem;
+	font-weight: 500;
+	font-family: inherit;
+	border: 1px solid transparent;
+	cursor: pointer;
+	transition:
+		background 180ms ease,
+		border-color 180ms ease,
+		color 180ms ease,
+		transform 120ms ease,
+		box-shadow 180ms ease;
+}
+.btn:active:not(:disabled) {
+	transform: scale(0.98);
+}
+.btn:disabled {
+	opacity: 0.45;
+	cursor: not-allowed;
+}
+.btn-primary {
+	background: var(--brand);
+	color: var(--brand-on-surface);
+	box-shadow: var(--btn-primary-shadow);
+}
+.btn-primary:hover:not(:disabled) {
+	background: var(--brand-medium);
+	box-shadow: var(--btn-primary-shadow-hover);
+}
+.btn-secondary {
+	background: var(--overlay-subtle);
+	color: var(--text-heading);
+	border-color: var(--border-default-medium);
+}
+.btn-secondary:hover:not(:disabled) {
+	background: var(--overlay-hover);
+	border-color: var(--border-default-medium);
+}
+.btn-ghost {
+	background: transparent;
+	color: var(--text-body);
+}
+.btn-ghost:hover:not(:disabled) {
+	background: var(--overlay-hover);
+	color: var(--text-heading);
+}
+.btn-danger {
+	background: var(--danger-soft);
+	color: var(--text-danger);
+	border-color: var(--border-danger-subtle);
+}
+.btn-danger:hover:not(:disabled) {
+	background: var(--danger);
+	color: var(--danger-on-hover);
+}
+.btn-compact {
+	padding: 0.3125rem 0.625rem;
+	font-size: 0.6875rem;
+	font-weight: 600;
+	border-radius: calc(var(--radius-base) - 2px);
+	min-height: 1.625rem;
+}
+.btn-danger--solid {
+	background: var(--danger);
+	color: var(--danger-on-hover);
+	border-color: transparent;
+	box-shadow: 0 1px 0 rgb(255 255 255 / 0.08) inset;
+}
+.btn-danger--solid:hover:not(:disabled) {
+	background: var(--danger-strong);
+}
+
+.model-selector {
+	min-width: 0;
+}
+.model-selector__field {
+	position: relative;
+	width: min(220px, 42vw);
+}
+.model-selector__input {
+	width: 100%;
+	padding-top: 0.375rem;
+	padding-bottom: 0.375rem;
+	font-size: 0.75rem;
+}
+.model-selector__list {
+	position: absolute;
+	top: calc(100% + 0.375rem);
+	left: 0;
+	right: 0;
+	z-index: 30;
+	display: flex;
+	flex-direction: column;
+	gap: 0.125rem;
+	max-height: 12rem;
+	overflow-y: auto;
+	padding: 0.25rem;
+	border: 1px solid var(--border-default-medium);
+	border-radius: var(--radius-base);
+	background: var(--surface-chat-card);
+	box-shadow: var(--shadow-sm);
+}
+.model-selector__option {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.5rem;
+	width: 100%;
+	padding: 0.5rem 0.625rem;
+	border: none;
+	border-radius: calc(var(--radius-base) - 2px);
+	background: transparent;
+	font: inherit;
+	text-align: left;
+	color: var(--text-heading);
+	cursor: pointer;
+}
+.model-selector__option--active,
+.model-selector__option:hover {
+	background: var(--overlay-hover);
+}
+.model-selector__option-label {
+	min-width: 0;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	font-size: 0.75rem;
+	font-family: "JetBrains Mono", ui-monospace, monospace;
+}
+.model-selector__option-hint {
+	flex-shrink: 0;
+	font-size: 0.625rem;
+	font-weight: 600;
+	letter-spacing: 0.04em;
+	text-transform: uppercase;
+	color: var(--text-brand);
+}
+.markdown-body {
+	line-height: 1.65;
+	word-break: break-word;
+}
+.markdown-body > :first-child {
+	margin-top: 0;
+}
+.markdown-body > :last-child {
+	margin-bottom: 0;
+}
+.markdown-body p,
+.markdown-body ul,
+.markdown-body ol,
+.markdown-body pre,
+.markdown-body blockquote {
+	margin: 0.625rem 0;
+}
+.markdown-body h1,
+.markdown-body h2,
+.markdown-body h3,
+.markdown-body h4 {
+	margin: 0.875rem 0 0.5rem;
+	font-weight: 600;
+	color: var(--text-heading);
+}
+.markdown-body h1 {
+	font-size: 1.25rem;
+}
+.markdown-body h2 {
+	font-size: 1.125rem;
+}
+.markdown-body h3 {
+	font-size: 1rem;
+}
+.markdown-body ul,
+.markdown-body ol {
+	padding-left: 1.25rem;
+}
+.markdown-body li + li {
+	margin-top: 0.25rem;
+}
+.markdown-body .markdown-pre code.hljs {
+	padding: 0;
+	border: none;
+	background: transparent;
+	font-size: 0.8125rem;
+}
+.markdown-body blockquote {
+	padding-left: 0.875rem;
+	border-left: 3px solid var(--border-brand-subtle);
+	color: var(--text-body-subtle);
+}
+.markdown-body a {
+	color: var(--text-brand);
+	text-decoration: underline;
+	text-underline-offset: 2px;
+}
+
+.markdown-body pre:has(.markdown-mermaid) {
+	margin: 0.5rem 0;
+	padding: 0;
+	border: none;
+	background: transparent;
+}
+
+.markdown-body .markdown-pre:not(:has(.markdown-mermaid)) {
+	overflow-x: auto;
+	border-radius: calc(var(--radius-base) - 2px);
+	border: 1px solid var(--border-default);
+	background: var(--surface-inset);
+	padding: 0.625rem 0.75rem;
+}
+
+.markdown-body .markdown-inline-code {
+	font-family:
+		"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+		monospace;
+	font-size: 0.8125em;
+	padding: 0.125rem 0.375rem;
+	border-radius: 0.25rem;
+	background: var(--surface-code);
+	border: 1px solid var(--surface-code-border);
+}
+
+.markdown-body .katex {
+	font-size: 1.02em;
+	color: var(--text-heading);
+}
+
+.markdown-body .katex-display {
+	margin: 0.625rem 0;
+	overflow-x: auto;
+	overflow-y: hidden;
+}
+
+.markdown-mermaid {
+	display: block;
+	overflow-x: auto;
+	margin: 0.375rem 0;
+	padding: 0.625rem;
+	border-radius: calc(var(--radius-base) - 2px);
+	border: 1px solid var(--border-default-medium);
+	background: var(--surface-inset);
+}
+
+.markdown-mermaid svg {
+	display: block;
+	height: auto;
+}
+
+/* ── Assistant chat (aligned with 4d-ai-agents editor) ── */
+@keyframes assistant-icon-spin {
+	to {
+		transform: rotate(360deg);
+	}
+}
+
+@keyframes assistant-message-in {
+	from {
+		opacity: 0;
+		transform: translateY(6px);
+	}
+	to {
+		opacity: 1;
+		transform: translateY(0);
+	}
+}
+
+@keyframes assistant-typing-bounce {
+	0%,
+	60%,
+	100% {
+		opacity: 0.35;
+		transform: translateY(0);
+	}
+	30% {
+		opacity: 1;
+		transform: translateY(-2px);
+	}
+}
+
+@keyframes assistant-empty-state-in {
+	from {
+		opacity: 0;
+		transform: translateY(4px);
+	}
+	to {
+		opacity: 1;
+		transform: translateY(0);
+	}
+}
+
+@keyframes assistant-empty-state-glow {
+	0%,
+	100% {
+		box-shadow:
+			0 0 0 1px var(--border-brand-subtle),
+			0 0 20px color-mix(in oklab, var(--brand) 12%, transparent);
+	}
+	50% {
+		box-shadow:
+			0 0 0 1px var(--border-brand-subtle),
+			0 0 32px color-mix(in oklab, var(--brand) 22%, transparent);
+	}
+}
+
+@keyframes assistant-empty-state-spin {
+	to {
+		transform: rotate(360deg);
+	}
+}
+
+.assistant-message {
+	width: 100%;
+	animation: assistant-message-in 0.28s ease-out both;
+}
+
+.assistant-message-list {
+	display: flex;
+	flex-direction: column;
+	gap: 1rem;
+	padding: 0.875rem 1rem 0.75rem;
+}
+
+.assistant-message-list > .assistant-message:last-child {
+	margin-bottom: 0.125rem;
+}
+
+.assistant-message--user {
+	display: flex;
+	justify-content: flex-end;
+}
+
+.assistant-message--assistant {
+	display: block;
+}
+
+.assistant-user-row {
+	display: flex;
+	min-width: 0;
+	max-width: min(100%, 28rem);
+	margin-left: auto;
+	align-items: flex-end;
+	gap: 0.5rem;
+}
+
+.assistant-user-bubble {
+	min-width: 0;
+	flex: 1 1 auto;
+	padding: 0.625rem 0.9375rem;
+	border-radius: 1.125rem 1.125rem 0.375rem 1.125rem;
+	color: var(--text-on-brand);
+	background: linear-gradient(
+		145deg,
+		color-mix(in oklab, var(--brand) 92%, white 8%),
+		color-mix(in oklab, var(--brand) 82%, white 18%)
+	);
+	box-shadow:
+		0 1px 0 rgb(255 255 255 / 0.2) inset,
+		0 10px 28px -14px rgb(0 0 0 / 0.35);
+}
+
+.assistant-user-bubble__text {
+	margin: 0;
+	font-size: 0.875rem;
+	line-height: 1.55;
+	white-space: pre-wrap;
+	overflow-wrap: anywhere;
+	word-break: break-word;
+}
+
+.assistant-user-avatar,
+.assistant-bot-avatar {
+	display: flex;
+	flex-shrink: 0;
+	width: 1.75rem;
+	height: 1.75rem;
+	align-items: center;
+	justify-content: center;
+	border-radius: 9999px;
+}
+
+.assistant-user-avatar {
+	align-self: flex-end;
+	margin-bottom: 0.125rem;
+	color: var(--brand-on-surface);
+	background: linear-gradient(
+		160deg,
+		color-mix(in oklab, var(--brand) 75%, white),
+		color-mix(in oklab, var(--brand) 85%, black)
+	);
+	box-shadow: 0 0 0 1px color-mix(in oklab, var(--brand) 35%, transparent);
+}
+
+.assistant-bot-avatar {
+	margin-top: 0.125rem;
+	color: var(--text-brand);
+	background: color-mix(in oklab, var(--surface-panel) 88%, var(--brand) 12%);
+	box-shadow:
+		0 0 0 1px var(--border-brand-subtle),
+		0 8px 20px -14px color-mix(in oklab, var(--brand) 25%, transparent);
+}
+
+.assistant-assistant-row {
+	display: flex;
+	min-width: 0;
+	align-items: flex-start;
+	gap: 0.625rem;
+}
+
+.assistant-assistant-card {
+	min-width: 0;
+	flex: 1;
+	overflow: hidden;
+	border-radius: 0.375rem 1.125rem 1.125rem 1.125rem;
+	border: 1px solid var(--border-default-medium);
+	background: var(--surface-chat-card);
+	box-shadow: var(--shadow-xs);
+}
+
+.assistant-assistant-card--error {
+	border-color: color-mix(
+		in oklab,
+		var(--danger) 28%,
+		var(--border-default-medium)
+	);
+	background: color-mix(in oklab, var(--danger) 4%, var(--surface-chat-card));
+	box-shadow:
+		inset 3px 0 0 var(--danger),
+		var(--shadow-xs);
+}
+
+.assistant-assistant-card__error {
+	padding: 0.5rem 0.875rem 0.75rem;
+}
+
+.assistant-assistant-card__meta {
+	display: flex;
+	align-items: center;
+	padding: 0.4375rem 0.875rem 0;
+}
+
+.assistant-assistant-card__typing {
+	padding: 0.625rem 0.875rem 0.75rem;
+}
+
+.assistant-role-label {
+	display: inline-flex;
+	align-items: center;
+	padding: 0.125rem 0.5rem;
+	border-radius: 9999px;
+	border: 1px solid var(--border-default-medium);
+	background: var(--overlay-subtle);
+	letter-spacing: 0.04em;
+	text-transform: uppercase;
+	font-size: 0.625rem;
+	font-weight: 600;
+	color: var(--text-chat-secondary);
+}
+
+.assistant-markdown {
+	padding: 0.375rem 0.875rem 0.75rem;
+	color: var(--text-body);
+}
+
+.assistant-markdown .markdown-body {
+	color: var(--text-body);
+	font-size: 0.875rem;
+	line-height: 1.6;
+}
+
+.assistant-markdown .markdown-body p,
+.assistant-markdown .markdown-body ul,
+.assistant-markdown .markdown-body ol,
+.assistant-markdown .markdown-body pre,
+.assistant-markdown .markdown-body blockquote {
+	margin: 0.375rem 0;
+}
+
+.assistant-markdown .markdown-body h1,
+.assistant-markdown .markdown-body h2,
+.assistant-markdown .markdown-body h3,
+.assistant-markdown .markdown-body h4 {
+	margin: 0.625rem 0 0.25rem;
+}
+
+.assistant-markdown .markdown-body h3 {
+	font-size: 0.9375rem;
+}
+
+.assistant-markdown .markdown-body ul,
+.assistant-markdown .markdown-body ol {
+	padding-left: 1.125rem;
+}
+
+.assistant-markdown .markdown-body li + li {
+	margin-top: 0.125rem;
+}
+
+.assistant-markdown .markdown-body p,
+.assistant-markdown .markdown-body li,
+.assistant-markdown .markdown-body td {
+	color: var(--text-body);
+}
+
+.assistant-markdown .markdown-body strong {
+	color: var(--text-heading);
+}
+
+.assistant-markdown .markdown-body code.markdown-inline-code {
+	color: var(--text-heading);
+	background: var(--surface-code);
+	border-color: var(--surface-code-border);
+}
+
+.assistant-markdown > :first-child {
+	margin-top: 0;
+}
+
+.assistant-markdown > :last-child {
+	margin-bottom: 0;
+}
+
+.assistant-markdown__cursor {
+	display: inline-block;
+	width: 0.125rem;
+	height: 1rem;
+	margin-left: 0.125rem;
+	vertical-align: middle;
+	background: var(--accent-violet);
+	animation: assistant-cursor-pulse 1s ease-in-out infinite;
+}
+
+@keyframes assistant-cursor-pulse {
+	0%,
+	100% {
+		opacity: 0.35;
+	}
+	50% {
+		opacity: 1;
+	}
+}
+
+.assistant-assistant-card .assistant-markdown {
+	padding-bottom: 0.625rem;
+}
+
+.assistant-assistant-card
+	.assistant-markdown:has(+ .assistant-activity--embedded) {
+	padding-bottom: 0.5rem;
+}
+
+.assistant-typing {
+	display: flex;
+	align-items: center;
+	gap: 0.375rem;
+	padding: 0.125rem 0;
+}
+
+.assistant-typing-dot {
+	width: 0.375rem;
+	height: 0.375rem;
+	border-radius: 9999px;
+	background: color-mix(in oklab, var(--brand) 70%, transparent);
+	animation: assistant-typing-bounce 1.1s ease-in-out infinite;
+}
+
+.assistant-activity {
+	min-width: 0;
+}
+
+.assistant-activity pre {
+	margin: 0;
+	border: none;
+	background: transparent;
+	box-shadow: none;
+	padding: 0;
+	min-width: 0;
+	max-width: 100%;
+	overflow-x: hidden;
+	white-space: pre-wrap;
+	overflow-wrap: anywhere;
+	word-break: break-word;
+}
+
+.assistant-activity pre .hljs {
+	background: transparent;
+	color: var(--log-syntax-base);
+	white-space: pre-wrap;
+	overflow-wrap: anywhere;
+	word-break: break-word;
+}
+
+.assistant-activity pre .hljs .hljs-attr,
+.assistant-activity pre .hljs .hljs-property,
+.assistant-activity pre .hljs .hljs-title {
+	color: var(--log-syntax-key);
+}
+
+.assistant-activity pre .hljs .hljs-string {
+	color: var(--log-syntax-string);
+}
+
+.assistant-activity pre .hljs .hljs-number {
+	color: var(--log-syntax-number);
+}
+
+.assistant-activity pre .hljs .hljs-literal,
+.assistant-activity pre .hljs .hljs-keyword {
+	color: var(--log-syntax-literal);
+}
+
+.assistant-activity pre .hljs .hljs-punctuation {
+	color: var(--log-syntax-punctuation);
+}
+
+.assistant-activity__live {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.25rem;
+	font-size: 0.625rem;
+	font-weight: 500;
+	color: var(--text-brand);
+}
+
+.assistant-activity__live::before {
+	content: "";
+	width: 0.375rem;
+	height: 0.375rem;
+	border-radius: 9999px;
+	background: var(--text-brand);
+}
+
+.assistant-activity--embedded {
+	background: var(--surface-chat-trace);
+	overflow: hidden;
+}
+
+.assistant-assistant-card .assistant-activity--embedded {
+	border-top: 1px solid var(--border-default);
+}
+
+.assistant-activity__header {
+	display: flex;
+	align-items: center;
+	gap: 0.375rem;
+	min-height: 2rem;
+	border-bottom: 1px solid var(--border-default);
+	padding: 0.4375rem 0.875rem;
+	background: color-mix(
+		in oklab,
+		var(--surface-chat-trace) 92%,
+		var(--border-default) 8%
+	);
+}
+
+.assistant-activity__toggle {
+	display: flex;
+	min-width: 0;
+	flex: 1;
+	align-items: center;
+	gap: 0.375rem;
+	border: none;
+	background: transparent;
+	padding: 0;
+	font: inherit;
+	text-align: left;
+	color: inherit;
+	cursor: pointer;
+}
+
+.assistant-activity__toggle-chevron {
+	width: 0.875rem;
+	height: 0.875rem;
+	flex-shrink: 0;
+	color: var(--text-chat-tertiary);
+	transition:
+		transform 150ms ease,
+		color 150ms ease;
+}
+
+.assistant-activity__toggle:hover .assistant-activity__toggle-chevron {
+	color: var(--text-chat-secondary);
+}
+
+.assistant-activity__toggle-chevron--open {
+	transform: rotate(90deg);
+}
+
+.assistant-activity__title {
+	font-size: 0.625rem;
+	font-weight: 600;
+	letter-spacing: 0.04em;
+	text-transform: uppercase;
+	color: var(--text-chat-tertiary);
+}
+
+.assistant-activity__count {
+	border-radius: 9999px;
+	background: var(--surface-chip);
+	padding: 0.0625rem 0.375rem;
+	font-size: 0.625rem;
+	font-weight: 500;
+	color: var(--text-chat-secondary);
+	font-variant-numeric: tabular-nums;
+}
+
+.assistant-activity__steps {
+	list-style: none;
+	margin: 0;
+	padding: 0.375rem 0.875rem 0.625rem;
+}
+
+.assistant-activity-step {
+	display: flex;
+	gap: 0.625rem;
+	min-width: 0;
+}
+
+.assistant-activity-step + .assistant-activity-step {
+	margin-top: 0.125rem;
+}
+
+.assistant-activity-step__rail {
+	display: flex;
+	width: 1.375rem;
+	flex-shrink: 0;
+	flex-direction: column;
+	align-items: center;
+	padding-top: 0.0625rem;
+}
+
+.assistant-activity-step__connector {
+	margin-block: 0.125rem;
+	width: 1px;
+	flex: 1;
+	min-height: 0.375rem;
+	background: var(--border-default);
+}
+
+.assistant-activity-step__body {
+	min-width: 0;
+	flex: 1;
+	padding-bottom: 0.375rem;
+}
+
+.assistant-activity-step:last-child .assistant-activity-step__body {
+	padding-bottom: 0;
+}
+
+.assistant-activity-step__header {
+	display: flex;
+	width: 100%;
+	min-height: 1.625rem;
+	align-items: center;
+	gap: 0.3125rem;
+	border: none;
+	border-radius: 0.4375rem;
+	background: transparent;
+	padding: 0.125rem 0.3125rem;
+	font: inherit;
+	text-align: left;
+	color: var(--text-chat-secondary);
+	cursor: pointer;
+	transition:
+		background-color 150ms ease,
+		color 150ms ease;
+}
+
+.assistant-activity-step__header:hover {
+	background: var(--overlay-hover);
+	color: var(--text-heading);
+}
+
+.assistant-activity-step__header--active {
+	color: var(--text-heading);
+}
+
+.assistant-activity-step__header--static {
+	cursor: default;
+}
+
+.assistant-activity-step__header--static:hover {
+	background: transparent;
+	color: var(--text-chat-secondary);
+}
+
+.assistant-activity-step__chevron {
+	width: 0.875rem;
+	height: 0.875rem;
+	flex-shrink: 0;
+	color: var(--text-chat-tertiary);
+	transition:
+		transform 150ms ease,
+		color 150ms ease;
+}
+
+.assistant-activity-step__header:hover .assistant-activity-step__chevron {
+	color: var(--text-chat-secondary);
+}
+
+.assistant-activity-step__chevron--open {
+	transform: rotate(90deg);
+}
+
+.assistant-activity-step__label {
+	display: inline-flex;
+	min-width: 0;
+	flex: 1;
+	align-items: center;
+	gap: 0.25rem;
+	font-size: 0.75rem;
+	font-weight: 500;
+	line-height: 1.25;
+}
+
+.assistant-activity-step__label-text {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.assistant-activity-step__tool-icon {
+	width: 0.75rem;
+	height: 0.75rem;
+	flex-shrink: 0;
+	opacity: 0.6;
+}
+
+.assistant-activity-step__details {
+	margin-top: 0.375rem;
+	min-width: 0;
+	border-radius: 0.5rem;
+	border: 1px solid var(--border-default);
+	background: var(--surface-chat-card);
+	padding: 0.375rem 0.5rem;
+}
+
+.assistant-activity-step__details--interactive {
+	border-color: transparent;
+	background: transparent;
+	padding: 0;
+}
+
+.assistant-activity-step__json-label {
+	margin: 0 0 0.125rem;
+	font-size: 0.625rem;
+	font-weight: 600;
+	letter-spacing: 0.04em;
+	text-transform: uppercase;
+	color: var(--text-chat-tertiary);
+}
+
+.assistant-activity-step__json-block {
+	min-width: 0;
+	border-radius: 0.375rem;
+	background: var(--surface-inset);
+	padding: 0.25rem 0.5rem;
+}
+
+.assistant-activity-step__json-block pre {
+	max-height: 8rem;
+	overflow-y: auto;
+}
+
+.assistant-trace-icon {
+	display: flex;
+	width: 1.375rem;
+	height: 1.375rem;
+	align-items: center;
+	justify-content: center;
+	border-radius: 9999px;
+	color: var(--text-chat-secondary);
+	background: var(--overlay-subtle);
+	box-shadow: 0 0 0 1px var(--border-default);
+}
+
+.assistant-trace-icon--active {
+	color: var(--text-brand);
+	background: var(--surface-promo);
+	box-shadow: 0 0 0 1px var(--border-brand-subtle);
+}
+
+.assistant-icon-spin {
+	animation: assistant-icon-spin 0.85s linear infinite;
+}
+
+.assistant-trace-icon--error {
+	color: var(--text-danger);
+	background: var(--danger-soft);
+	box-shadow: 0 0 0 1px var(--border-danger-subtle);
+}
+
+.assistant-composer {
+	position: relative;
+	overflow: visible;
+	border-radius: 1rem;
+	border: 1px solid var(--border-default);
+	background: var(--surface-chat-input);
+	box-shadow: var(--shadow-xs);
+	transition:
+		border-color 150ms,
+		box-shadow 150ms;
+}
+
+.assistant-composer:focus-within {
+	border-color: var(--border-default-medium);
+}
+
+.assistant-composer__input-row {
+	display: flex;
+	align-items: flex-end;
+	gap: 0.5rem;
+	padding: 0.5rem;
+}
+
+.assistant-composer__textarea {
+	flex: 1;
+	min-height: 2.5rem;
+	max-height: 6rem;
+	resize: none;
+	border: none;
+	background: transparent;
+	padding: 0.5rem;
+	font: inherit;
+	font-size: 0.875rem;
+	color: var(--text-heading);
+	outline: none;
+	box-shadow: none;
+}
+
+.assistant-composer__textarea:focus,
+.assistant-composer__textarea:focus-visible {
+	outline: none;
+	box-shadow: none;
+}
+
+.assistant-composer__textarea::placeholder {
+	color: var(--text-chat-tertiary);
+}
+
+.assistant-composer__footer {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.5rem;
+	border-top: 1px solid var(--border-default);
+	padding: 0.375rem 0.5rem;
+}
+
+.assistant-composer__tools {
+	display: inline-flex;
+	flex-shrink: 0;
+	align-items: center;
+	gap: 0.125rem;
+	margin-left: auto;
+}
+
+.assistant-composer__tool {
+	padding: 0.375rem;
+}
+
+.assistant-composer__tool-spinner {
+	animation: assistant-empty-state-spin 0.8s linear infinite;
+}
+
+.assistant-composer__hint {
+	margin-top: 0.5rem;
+	text-align: center;
+	font-size: 0.6875rem;
+	color: var(--text-chat-tertiary);
+}
+
+.composer-command-menu {
+	position: absolute;
+	bottom: calc(100% + 0.5rem);
+	left: 0;
+	z-index: 20;
+	width: 100%;
+	min-width: 14rem;
+	overflow: hidden;
+	border-radius: 0.75rem;
+	border: 1px solid var(--border-default-medium);
+	background: var(--surface-chat-card);
+	box-shadow: var(--shadow-sm);
+}
+
+.composer-command-menu__header {
+	border-bottom: 1px solid var(--border-default);
+	padding: 0.5rem 0.75rem;
+	font-size: 0.625rem;
+	font-weight: 600;
+	letter-spacing: 0.04em;
+	text-transform: uppercase;
+	color: var(--text-chat-tertiary);
+}
+
+.composer-command-menu__list {
+	max-height: 12rem;
+	overflow-y: auto;
+	padding-block: 0.25rem;
+}
+
+.composer-command-menu__item {
+	display: flex;
+	width: 100%;
+	align-items: flex-start;
+	gap: 0.625rem;
+	padding: 0.5rem 0.75rem;
+	text-align: left;
+	color: var(--text-body);
+	transition: background-color 150ms;
+}
+
+.composer-command-menu__item:hover,
+.composer-command-menu__item--active {
+	background: var(--overlay-hover);
+}
+
+.composer-command-menu__icon {
+	margin-top: 0.125rem;
+	flex-shrink: 0;
+	color: var(--text-chat-tertiary);
+}
+
+.composer-command-menu__usage {
+	display: block;
+	font-family: ui-monospace, monospace;
+	font-size: 0.75rem;
+	font-weight: 500;
+	color: var(--text-heading);
+}
+
+.composer-command-menu__description {
+	display: block;
+	margin-top: 0.125rem;
+	font-size: 0.6875rem;
+	color: var(--text-chat-secondary);
+}
+
+.assistant-command-error {
+	display: flex;
+	align-items: flex-start;
+	justify-content: space-between;
+	gap: 0.5rem;
+	margin-bottom: 0.75rem;
+	border-radius: var(--radius-base);
+	border: 1px solid var(--border-danger-subtle);
+	background: var(--danger-soft);
+	padding: 0.5rem 0.625rem;
+}
+
+.assistant-command-error__text {
+	min-width: 0;
+	font-size: 0.75rem;
+	line-height: 1.4;
+	color: var(--text-danger);
+}
+
+.assistant-command-error__dismiss {
+	display: flex;
+	flex-shrink: 0;
+	align-items: center;
+	justify-content: center;
+	border: none;
+	border-radius: 0.375rem;
+	background: transparent;
+	padding: 0.125rem;
+	color: var(--text-danger);
+	cursor: pointer;
+}
+
+.assistant-command-error__dismiss:hover {
+	background: color-mix(in oklab, var(--danger) 12%, transparent);
+}
+
+.assistant-llm-setup {
+	border-radius: var(--radius-base);
+	border: 1px solid var(--border-brand-subtle, var(--border-default-medium));
+	background: color-mix(in oklab, var(--brand) 5%, var(--overlay-subtle));
+}
+
+.assistant-llm-setup--banner {
+	margin-bottom: 0.625rem;
+	padding: 0.5rem 0.625rem;
+}
+
+.assistant-llm-setup__row {
+	display: flex;
+	align-items: center;
+	gap: 0.5rem;
+	min-width: 0;
+}
+
+.assistant-llm-setup__badge {
+	display: inline-flex;
+	flex-shrink: 0;
+	align-items: center;
+	justify-content: center;
+	width: 1.375rem;
+	height: 1.375rem;
+	border-radius: 999px;
+	background: color-mix(in oklab, var(--brand) 12%, transparent);
+	color: var(--text-brand-strong, var(--text-brand));
+}
+
+.assistant-llm-setup__copy {
+	min-width: 0;
+	flex: 1;
+	margin: 0;
+	font-size: 0.75rem;
+	line-height: 1.45;
+	color: var(--text-body-subtle, var(--text-chat-secondary));
+}
+
+.assistant-llm-setup .assistant-llm-setup__copy strong {
+	font-weight: 600;
+	color: var(--text-body-strong, var(--text-body));
+}
+
+.assistant-llm-setup__sep {
+	margin-inline: 0.25rem;
+	opacity: 0.55;
+}
+
+.assistant-llm-setup__chip {
+	display: inline-flex;
+	flex-shrink: 0;
+	align-items: center;
+	gap: 0.25rem;
+	padding: 0.1875rem 0.5rem;
+	border: 1px solid var(--border-brand-subtle, var(--border-default-medium));
+	border-radius: 999px;
+	background: color-mix(in oklab, var(--surface-panel) 88%, var(--brand) 12%);
+	color: var(--text-brand-strong, var(--text-brand));
+	font-family: inherit;
+	font-size: 0.6875rem;
+	font-weight: 600;
+	line-height: 1.2;
+	cursor: pointer;
+	transition:
+		background 150ms ease,
+		border-color 150ms ease;
+}
+
+.assistant-llm-setup__chip:hover {
+	background: color-mix(in oklab, var(--surface-panel) 78%, var(--brand) 22%);
+	border-color: var(--border-brand-subtle, var(--border-default));
+}
+
+.assistant-llm-setup__chip:focus-visible {
+	outline: 2px solid var(--border-brand-subtle, var(--border-default));
+	outline-offset: 2px;
+}
+
+.assistant-llm-setup--inline {
+	min-width: 0;
+	flex: 1;
+	padding: 0.625rem 0.75rem;
+	border-radius: 0.375rem 1.125rem 1.125rem 1.125rem;
+}
+
+.assistant-llm-setup--inline .assistant-llm-setup__copy {
+	font-size: 0.8125rem;
+}
+
+.assistant-llm-setup__label {
+	font-weight: 600;
+	color: var(--text-body-strong, var(--text-body));
+}
+
+.assistant-llm-setup__action {
+	display: inline;
+	padding: 0;
+	border: none;
+	background: none;
+	color: var(--text-brand-strong, var(--text-brand));
+	font-family: inherit;
+	font-size: inherit;
+	font-weight: 600;
+	line-height: inherit;
+	text-decoration: underline;
+	text-decoration-color: color-mix(in oklab, currentColor 35%, transparent);
+	text-underline-offset: 0.12em;
+	cursor: pointer;
+}
+
+.assistant-llm-setup__action:hover {
+	text-decoration-color: currentColor;
+}
+
+.assistant-llm-setup__action:focus-visible {
+	outline: 2px solid var(--border-brand-subtle, var(--border-default));
+	outline-offset: 2px;
+	border-radius: 0.125rem;
+}
+
+.assistant-empty-state {
+	margin-inline: auto;
+	width: 100%;
+	max-width: 40rem;
+	padding: 1.25rem 1rem 1.5rem;
+	display: flex;
+	flex-direction: column;
+	gap: 1.25rem;
+}
+
+.assistant-empty-state__card {
+	position: relative;
+	overflow: hidden;
+	border-radius: var(--radius-xl, 1rem);
+	border: 1px solid var(--border-default-medium);
+	background: var(
+		--surface-hero,
+		linear-gradient(
+			135deg,
+			color-mix(in oklab, var(--surface-panel) 96%, var(--brand) 4%) 0%,
+			var(--surface-panel) 100%
+		)
+	);
+	box-shadow:
+		var(--shadow-sm, 0 1px 2px rgb(0 0 0 / 0.04)),
+		var(
+			--shadow-glow,
+			0 0 32px color-mix(in oklab, var(--brand) 8%, transparent)
+		);
+	backdrop-filter: blur(16px);
+}
+
+.assistant-empty-state__card-glow {
+	position: absolute;
+	inset: 0;
+	background: var(
+		--surface-hero-glow,
+		radial-gradient(
+			circle at 85% 15%,
+			color-mix(in oklab, var(--brand) 12%, transparent),
+			transparent 45%
+		)
+	);
+	pointer-events: none;
+}
+
+.assistant-empty-state__card-inner {
+	position: relative;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	padding: 1.75rem 1.25rem 1.5rem;
+	text-align: center;
+	gap: 0.625rem;
+}
+
+.assistant-empty-state__eyebrow {
+	margin: 0;
+	font-size: 0.6875rem;
+	font-weight: 600;
+	letter-spacing: 0.12em;
+	text-transform: uppercase;
+	color: var(--text-brand);
+}
+
+.assistant-empty-state__icon-ring {
+	display: flex;
+	width: 3.25rem;
+	height: 3.25rem;
+	align-items: center;
+	justify-content: center;
+	margin-block: 0.25rem;
+	border-radius: 1rem;
+	color: var(--text-brand);
+	background: var(--surface-promo);
+	animation: assistant-empty-state-glow 4s ease-in-out infinite;
+}
+
+.assistant-empty-state__title {
+	margin: 0;
+	font-size: 1.125rem;
+	font-weight: 600;
+	letter-spacing: -0.02em;
+	color: var(--text-heading);
+}
+
+.assistant-empty-state__description {
+	margin: 0;
+	max-width: 32ch;
+	font-size: 0.8125rem;
+	line-height: 1.55;
+	color: var(--text-body-subtle);
+}
+
+.assistant-empty-state__capabilities {
+	display: flex;
+	flex-wrap: wrap;
+	justify-content: center;
+	gap: 0.375rem;
+	margin-top: 0.25rem;
+}
+
+.assistant-empty-state__capability {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.375rem;
+	padding: 0.3125rem 0.625rem;
+	border-radius: 9999px;
+	border: 1px solid var(--surface-chip-border, var(--border-default));
+	background: var(--surface-chip, var(--overlay-subtle));
+	font-size: 0.6875rem;
+	font-weight: 500;
+	color: var(--text-body);
+}
+
+.assistant-empty-state__cta {
+	display: flex;
+	width: 100%;
+	align-items: center;
+	gap: 0.75rem;
+	margin-top: 0.75rem;
+	padding: 0.875rem 1rem;
+	border-radius: var(--radius-base);
+	border: 1px solid var(--border-brand-subtle);
+	background: color-mix(in oklab, var(--brand) 6%, var(--surface-panel));
+	color: inherit;
+	font-family: inherit;
+	text-align: left;
+	cursor: pointer;
+	transition:
+		background 180ms ease,
+		border-color 180ms ease,
+		transform 120ms ease,
+		box-shadow 180ms ease;
+}
+
+.assistant-empty-state__cta:hover {
+	border-color: color-mix(in oklab, var(--brand) 35%, var(--border-default));
+	background: color-mix(in oklab, var(--brand) 10%, var(--surface-panel));
+	transform: translateY(-1px);
+	box-shadow: var(--shadow-sm, 0 1px 2px rgb(0 0 0 / 0.04));
+}
+
+.assistant-empty-state__cta:active {
+	transform: translateY(0);
+}
+
+.assistant-empty-state__cta-icon {
+	display: flex;
+	width: 2.25rem;
+	height: 2.25rem;
+	flex-shrink: 0;
+	align-items: center;
+	justify-content: center;
+	border-radius: calc(var(--radius-base) - 2px);
+	color: var(--text-brand);
+	background: var(--surface-promo);
+	box-shadow: 0 0 0 1px var(--border-brand-subtle);
+}
+
+.assistant-empty-state__cta-text {
+	min-width: 0;
+	flex: 1;
+}
+
+.assistant-empty-state__cta-label {
+	display: block;
+	font-size: 0.8125rem;
+	font-weight: 600;
+	color: var(--text-heading);
+}
+
+.assistant-empty-state__cta-hint {
+	display: block;
+	margin-top: 0.125rem;
+	font-size: 0.6875rem;
+	line-height: 1.4;
+	color: var(--text-body-subtle);
+}
+
+.assistant-empty-state__section {
+	min-width: 0;
+}
+
+.assistant-empty-state__section-header {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.75rem;
+	margin-bottom: 0.625rem;
+}
+
+.assistant-empty-state__section-title {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.375rem;
+	margin: 0;
+	font-size: 0.6875rem;
+	font-weight: 600;
+	letter-spacing: 0.06em;
+	text-transform: uppercase;
+	color: var(--text-body-subtle);
+}
+
+.assistant-empty-state__section-spinner {
+	animation: assistant-empty-state-spin 0.8s linear infinite;
+}
+
+.assistant-empty-state__section-refresh {
+	gap: 0.375rem;
+	padding-inline: 0.5rem;
+	font-size: 0.75rem;
+}
+
+.assistant-empty-state__hero {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	gap: 0.75rem;
+	text-align: center;
+}
+
+.assistant-empty-state__hero-icon {
+	display: flex;
+	width: 2.5rem;
+	height: 2.5rem;
+	align-items: center;
+	justify-content: center;
+	border-radius: 0.875rem;
+	color: var(--text-brand);
+	background: var(--surface-promo);
+	box-shadow: 0 0 0 1px var(--border-brand-subtle);
+}
+
+.assistant-empty-state__grid {
+	display: grid;
+	grid-template-columns: minmax(0, 1fr);
+	gap: 0.625rem;
+}
+
+@media (min-width: 32rem) {
+	.assistant-empty-state__grid:not(.assistant-empty-state__grid--compact) {
+		grid-template-columns: repeat(2, minmax(0, 1fr));
+	}
+}
+
+.assistant-empty-state__grid--compact {
+	margin-top: 0;
+}
+
+.assistant-empty-state__actions {
+	display: flex;
+	justify-content: center;
+	margin-top: 1rem;
+}
+
+.assistant-empty-state__actions--inline {
+	margin-top: 0.75rem;
+	margin-bottom: -0.25rem;
+}
+
+.assistant-empty-state__fetch {
+	gap: 0.5rem;
+}
+
+.assistant-empty-state__refresh {
+	font-size: 0.8125rem;
+}
+
+.assistant-error-callout {
+	display: flex;
+	align-items: flex-start;
+	gap: 0.625rem;
+	min-width: 0;
+	border-radius: var(--radius-base);
+	border: 1px solid color-mix(in oklab, var(--danger) 22%, transparent);
+	background: color-mix(in oklab, var(--danger) 6%, var(--overlay-subtle));
+}
+
+.assistant-error-callout--embedded {
+	padding: 0.625rem 0.75rem;
+}
+
+.assistant-error-callout--panel {
+	margin-top: 0.25rem;
+	padding: 0.625rem 0.75rem;
+}
+
+.assistant-error-callout__badge {
+	display: inline-flex;
+	flex-shrink: 0;
+	align-items: center;
+	justify-content: center;
+	width: 1.375rem;
+	height: 1.375rem;
+	border-radius: 999px;
+	background: color-mix(in oklab, var(--danger) 14%, transparent);
+	color: var(--text-danger);
+}
+
+.assistant-error-callout__body {
+	display: flex;
+	min-width: 0;
+	flex: 1;
+	flex-direction: column;
+	gap: 0.125rem;
+}
+
+.assistant-error-callout__title {
+	margin: 0;
+	font-size: 0.8125rem;
+	font-weight: 600;
+	line-height: 1.35;
+	color: var(--text-body-strong, var(--text-body));
+}
+
+.assistant-error-callout__detail {
+	margin: 0;
+	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+	font-size: 0.6875rem;
+	line-height: 1.45;
+	color: var(--text-danger);
+}
+
+.assistant-error-callout__hint {
+	margin: 0.125rem 0 0;
+	font-size: 0.75rem;
+	line-height: 1.45;
+	color: var(--text-body-subtle, var(--text-chat-secondary));
+}
+
+.assistant-error-callout__chip {
+	display: inline-flex;
+	flex-shrink: 0;
+	align-items: center;
+	gap: 0.25rem;
+	align-self: center;
+	padding: 0.1875rem 0.5rem;
+	border: 1px solid color-mix(in oklab, var(--danger) 28%, transparent);
+	border-radius: 999px;
+	background: color-mix(in oklab, var(--surface-panel) 90%, var(--danger) 10%);
+	color: var(--text-danger);
+	font-family: inherit;
+	font-size: 0.6875rem;
+	font-weight: 600;
+	line-height: 1.2;
+	cursor: pointer;
+	transition:
+		background 150ms ease,
+		border-color 150ms ease;
+}
+
+.assistant-error-callout__chip:hover:not(:disabled) {
+	background: color-mix(in oklab, var(--surface-panel) 82%, var(--danger) 18%);
+	border-color: color-mix(in oklab, var(--danger) 40%, transparent);
+}
+
+.assistant-error-callout__chip:focus-visible {
+	outline: 2px solid color-mix(in oklab, var(--danger) 45%, transparent);
+	outline-offset: 2px;
+}
+
+.assistant-error-callout__chip:disabled {
+	opacity: 0.55;
+	cursor: not-allowed;
+}
+
+.assistant-suggestions-strip {
+	margin-bottom: 0.75rem;
+	padding: 0.75rem;
+	border-radius: var(--radius-base);
+	border: 1px solid var(--border-default);
+	background: var(--surface-panel);
+}
+
+.assistant-suggestions-strip__header {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.5rem;
+	margin-bottom: 0.5rem;
+}
+
+.assistant-suggestions-strip__title {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.375rem;
+	font-size: 0.8125rem;
+	font-weight: 600;
+	color: var(--text-heading);
+}
+
+.assistant-suggestions-strip__actions {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.25rem;
+}
+
+.assistant-suggestions-strip__refresh {
+	gap: 0.375rem;
+	font-size: 0.8125rem;
+}
+
+.assistant-panel__clear {
+	padding: 0.5rem;
+}
+
+.assistant-empty-state__prompt {
+	display: flex;
+	width: 100%;
+	align-items: flex-start;
+	gap: 0.625rem;
+	padding: 0.875rem;
+	border-radius: var(--radius-base);
+	border: 1px solid var(--border-default);
+	background: var(--surface-panel);
+	color: inherit;
+	font-family: inherit;
+	text-align: left;
+	cursor: pointer;
+	position: relative;
+	transition:
+		background 180ms ease,
+		border-color 180ms ease,
+		transform 120ms ease,
+		box-shadow 180ms ease;
+	animation: assistant-empty-state-in 0.35s ease-out both;
+}
+
+.assistant-empty-state__prompt:not(
+	.assistant-empty-state__prompt--compact
+):hover {
+	border-color: var(--border-brand-subtle);
+	background: color-mix(in oklab, var(--brand) 4%, var(--surface-panel));
+	transform: translateY(-2px);
+	box-shadow: var(--shadow-sm, 0 1px 2px rgb(0 0 0 / 0.04));
+}
+
+.assistant-empty-state__prompt--compact {
+	align-items: center;
+	padding: 0.625rem 0.75rem;
+}
+
+.assistant-empty-state__prompt--compact:hover {
+	border-color: var(--border-brand-subtle);
+	background: color-mix(in oklab, var(--brand) 4%, var(--surface-panel));
+}
+
+.assistant-empty-state__icon {
+	display: flex;
+	width: 2rem;
+	height: 2rem;
+	flex-shrink: 0;
+	align-items: center;
+	justify-content: center;
+	border-radius: calc(var(--radius-base) - 2px);
+	color: var(--text-brand);
+	background: var(--surface-promo);
+	box-shadow: 0 0 0 1px var(--border-brand-subtle);
+}
+
+.assistant-empty-state__prompt--compact .assistant-empty-state__icon {
+	width: 1.75rem;
+	height: 1.75rem;
+}
+
+.assistant-scroll-down {
+	position: absolute;
+	bottom: 0.75rem;
+	left: 50%;
+	z-index: 10;
+	display: flex;
+	width: 2.25rem;
+	height: 2.25rem;
+	align-items: center;
+	justify-content: center;
+	border-radius: 9999px;
+	border: 1px solid var(--border-default);
+	background: color-mix(in oklab, var(--surface-panel) 95%, transparent);
+	box-shadow: 0 4px 16px rgb(0 0 0 / 0.12);
+	transform: translateX(-50%);
+	cursor: pointer;
+	color: var(--text-heading);
+	backdrop-filter: blur(8px);
+}
+
+.model-selector--footer {
+	min-width: 0;
+	flex: 1;
+}
+
+.model-selector--footer .model-selector__field {
+	width: 100%;
+	max-width: none;
+}
+
+.model-selector--footer .model-selector__input {
+	border: none;
+	background: transparent;
+	padding-top: 0.25rem;
+	padding-bottom: 0.25rem;
+	font-size: 0.75rem;
+	color: var(--text-chat-secondary);
+}
+
+.model-selector--footer .model-selector__input:focus,
+.model-selector--footer .model-selector__input:focus-visible {
+	outline: none;
+	box-shadow: none;
+}
+
+.model-selector--footer .model-selector__list--drop-up {
+	top: auto;
+	bottom: calc(100% + 0.375rem);
+	z-index: 40;
+}
+
+/* Interactive confirmation / choices in trace */
+.assistant-interactive-prompt {
+	position: relative;
+	overflow: clip;
+	display: flex;
+	flex-direction: column;
+	gap: 0.4375rem;
+	width: 100%;
+	min-width: 0;
+	border-radius: var(--radius-base);
+	border: 1px solid var(--border-default-medium);
+	background: var(--surface-chat-card);
+	padding: 0.5rem 0.5625rem 0.5rem 0.625rem;
+	font-family: inherit;
+}
+
+.assistant-interactive-prompt::before {
+	content: "";
+	position: absolute;
+	inset-block: 0.3125rem;
+	inset-inline-start: 0;
+	width: 2px;
+	border-radius: 0 9999px 9999px 0;
+	background: var(--accent-violet);
+}
+
+.assistant-interactive-prompt--caution {
+	border-color: color-mix(
+		in oklab,
+		var(--warning) 30%,
+		var(--border-default) 70%
+	);
+	background: color-mix(
+		in oklab,
+		var(--warning-soft) 35%,
+		var(--surface-chat-card)
+	);
+}
+
+.assistant-interactive-prompt--caution::before {
+	background: var(--warning);
+}
+
+.assistant-interactive-prompt__main {
+	display: flex;
+	align-items: flex-start;
+	gap: 0.4375rem;
+	min-width: 0;
+}
+
+.assistant-interactive-prompt__icon {
+	display: flex;
+	width: 1.5rem;
+	height: 1.5rem;
+	flex-shrink: 0;
+	align-items: center;
+	justify-content: center;
+	border-radius: 0.3125rem;
+	color: var(--accent-violet);
+	background: color-mix(
+		in oklab,
+		var(--accent-violet) 12%,
+		var(--surface-chip)
+	);
+}
+
+.assistant-interactive-prompt__icon--caution {
+	color: var(--warning);
+	background: var(--warning-soft);
+}
+
+.assistant-interactive-prompt__content {
+	display: flex;
+	flex-direction: column;
+	gap: 0.1875rem;
+	min-width: 0;
+	flex: 1;
+}
+
+.assistant-interactive-prompt__title {
+	margin: 0;
+	font-size: 0.75rem;
+	font-weight: 600;
+	line-height: 1.25;
+	color: var(--text-heading);
+}
+
+.assistant-interactive-prompt__body {
+	display: flex;
+	flex-direction: column;
+	gap: 0.125rem;
+	min-width: 0;
+}
+
+.assistant-interactive-prompt__message {
+	margin: 0;
+	font-size: 0.75rem;
+	line-height: 1.4;
+	color: var(--text-chat-secondary);
+	overflow-wrap: anywhere;
+}
+
+.assistant-interactive-prompt__action {
+	margin: 0;
+	font-size: 0.6875rem;
+	font-weight: 600;
+	line-height: 1.3;
+	color: var(--text-chat-tertiary);
+	overflow-wrap: anywhere;
+}
+
+.assistant-interactive-prompt__action--caution {
+	color: var(--text-danger);
+}
+
+.assistant-interactive-prompt__bar {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.5rem;
+	padding-top: 0.3125rem;
+	border-top: 1px solid var(--border-default);
+}
+
+.assistant-interactive-prompt--caution .assistant-interactive-prompt__bar {
+	border-top-color: color-mix(
+		in oklab,
+		var(--warning) 15%,
+		var(--border-default) 85%
+	);
+}
+
+.assistant-interactive-prompt__hint {
+	margin: 0;
+	flex-shrink: 0;
+	font-size: 0.625rem;
+	line-height: 1;
+	color: var(--text-chat-tertiary);
+	white-space: nowrap;
+}
+
+.assistant-interactive-prompt__actions {
+	display: flex;
+	flex-shrink: 0;
+	align-items: center;
+	gap: 0.3125rem;
+}
+
+.assistant-interactive-choice-list {
+	display: flex;
+	flex-direction: column;
+	gap: 0.375rem;
+}
+
+.assistant-interactive-choice {
+	display: flex;
+	cursor: pointer;
+	align-items: flex-start;
+	gap: 0.4375rem;
+	padding: 0.375rem 0.4375rem;
+	border-radius: calc(var(--radius-base) - 2px);
+	border: 1px solid var(--border-default);
+	background: var(--surface-inset);
+	transition:
+		border-color 150ms ease,
+		background-color 150ms ease;
+}
+
+.assistant-interactive-choice:hover:not(
+	.assistant-interactive-choice--disabled
+) {
+	border-color: var(--border-brand-subtle);
+	background: var(--overlay-hover);
+}
+
+.assistant-interactive-choice--selected {
+	border-color: var(--border-brand-subtle);
+	background: color-mix(
+		in oklab,
+		var(--accent-violet) 8%,
+		var(--surface-inset)
+	);
+}
+
+.assistant-interactive-choice--disabled {
+	cursor: not-allowed;
+	opacity: 0.55;
+}
+
+.assistant-interactive-choice__check {
+	display: flex;
+	width: 1rem;
+	height: 1rem;
+	flex-shrink: 0;
+	margin-top: 0.0625rem;
+	align-items: center;
+	justify-content: center;
+	border-radius: 9999px;
+	border: 1px solid var(--border-default-medium);
+	background: var(--surface-chip);
+	color: var(--modern-primary-deep);
+	transition:
+		border-color 150ms ease,
+		background-color 150ms ease;
+}
+
+.assistant-interactive-choice__check--on {
+	border-color: var(--accent-violet);
+	background: var(--accent-violet);
+}
+
+.assistant-interactive-choice__content {
+	min-width: 0;
+	flex: 1 1 auto;
+}
+
+.assistant-interactive-choice__label {
+	display: block;
+	font-size: 0.75rem;
+	font-weight: 600;
+	line-height: 1.35;
+	color: var(--text-heading);
+	overflow-wrap: anywhere;
+}
+
+.assistant-interactive-choice__label--mono {
+	font-family: ui-monospace, monospace;
+	font-size: 0.6875rem;
+	letter-spacing: -0.01em;
+}
+
+.assistant-interactive-choice__description {
+	display: block;
+	margin-top: 0.1875rem;
+	font-size: 0.6875rem;
+	line-height: 1.4;
+	color: var(--text-chat-tertiary);
+	overflow-wrap: anywhere;
+}
+
+.assistant-interactive-kbd {
+	display: inline-flex;
+	min-width: 1.25rem;
+	align-items: center;
+	justify-content: center;
+	flex-shrink: 0;
+	margin-top: 0.0625rem;
+	border-radius: 0.375rem;
+	border: 1px solid var(--border-default-medium);
+	background: var(--surface-chat-card);
+	padding: 0.0625rem 0.375rem;
+	font-family: ui-monospace, monospace;
+	font-size: 0.625rem;
+	font-weight: 600;
+	line-height: 1.2;
+	color: var(--text-chat-tertiary);
+	opacity: 0;
+	transition: opacity 0.15s ease;
+}
+
+.assistant-interactive-choice:hover .assistant-interactive-kbd,
+.assistant-interactive-choice--selected .assistant-interactive-kbd {
+	opacity: 1;
+}
+
+.assistant-activity-step--waiting .assistant-trace-icon--active {
+	color: var(--warning);
+	background: var(--warning-soft);
+	box-shadow: 0 0 0 1px color-mix(in oklab, var(--warning) 30%, transparent);
+}
+
+.assistant-activity-step-details--interactive {
+	display: flex;
+	flex-direction: column;
+	gap: 0.625rem;
+}
+
+/* Reply suggestions */
+.assistant-reply-suggestions {
+	padding: 0.5rem 0.875rem 0.625rem;
+}
+
+.assistant-assistant-card .assistant-reply-suggestions {
+	border-top: 1px solid var(--border-default);
+	background: var(--surface-chat-trace);
+}
+
+.assistant-reply-suggestions__panel {
+	overflow: clip;
+	border-radius: calc(var(--radius-base) - 1px);
+	border: 1px solid var(--border-default-medium);
+	background: var(--surface-inset);
+}
+
+.assistant-reply-suggestions__list {
+	display: flex;
+	flex-direction: column;
+}
+
+.assistant-reply-option {
+	display: flex;
+	width: 100%;
+	align-items: center;
+	gap: 0.5rem;
+	padding: 0.4375rem 0.5rem;
+	border: 0;
+	border-bottom: 1px solid var(--border-default);
+	background: transparent;
+	text-align: left;
+	cursor: pointer;
+	font-family: inherit;
+	transition: background-color 120ms ease;
+}
+
+.assistant-reply-option:last-of-type {
+	border-bottom: none;
+}
+
+.assistant-reply-option:hover:not(:disabled) {
+	background: var(--overlay-hover);
+}
+
+.assistant-reply-option__arrow {
+	opacity: 0;
+	color: var(--text-chat-tertiary);
+	transition:
+		opacity 120ms ease,
+		color 120ms ease;
+}
+
+.assistant-reply-option:hover:not(:disabled) .assistant-reply-option__arrow {
+	opacity: 1;
+	color: var(--accent-violet);
+}
+
+.assistant-reply-option:disabled {
+	cursor: not-allowed;
+	opacity: 0.55;
+}
+
+.assistant-reply-option--custom {
+	border-bottom-style: dashed;
+}
+
+.assistant-reply-option--structured {
+	align-items: flex-start;
+	padding-block: 0.5rem;
+}
+
+.assistant-reply-option__index {
+	display: inline-flex;
+	width: 1.125rem;
+	height: 1.125rem;
+	flex-shrink: 0;
+	align-items: center;
+	justify-content: center;
+	border-radius: 0.3125rem;
+	font-size: 0.625rem;
+	font-weight: 700;
+	font-family: ui-monospace, monospace;
+	color: var(--accent-violet);
+	background: color-mix(
+		in oklab,
+		var(--accent-violet) 10%,
+		var(--surface-chat-card)
+	);
+	box-shadow: inset 0 0 0 1px
+		color-mix(in oklab, var(--accent-violet) 18%, transparent);
+}
+
+.assistant-reply-option__body {
+	min-width: 0;
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+	gap: 0.125rem;
+}
+
+.assistant-reply-option__label {
+	font-size: 0.75rem;
+	font-weight: 500;
+	line-height: 1.35;
+	color: var(--text-heading);
+	overflow-wrap: anywhere;
+}
+
+.assistant-reply-option__meta {
+	font-size: 0.6875rem;
+	line-height: 1.35;
+	color: var(--text-chat-tertiary);
+	overflow-wrap: anywhere;
+}
+
+.assistant-reply-option__custom {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.375rem;
+	font-size: 0.75rem;
+	color: var(--text-chat-secondary);
+}
+
+.assistant-reply-option__badges {
+	display: flex;
+	flex-wrap: wrap;
+	gap: 0.25rem;
+	margin-top: 0.125rem;
+}
+
+.assistant-reply-badge {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.25rem;
+	padding: 0.0625rem 0.375rem;
+	border-radius: 9999px;
+	font-size: 0.625rem;
+	background: var(--surface-chat-card);
+	box-shadow: inset 0 0 0 1px var(--border-default);
+}
+
+.assistant-reply-badge__label {
+	font-weight: 600;
+	text-transform: uppercase;
+	color: var(--text-chat-tertiary);
+}
+
+.assistant-reply-badge__value {
+	color: var(--text-heading);
+}
+
+.assistant-reply-tool {
+	display: inline-flex;
+	padding: 0.0625rem 0.375rem;
+	border-radius: 0.25rem;
+	font-family: ui-monospace, monospace;
+	font-size: 0.625rem;
+	color: var(--accent-violet);
+	background: color-mix(
+		in oklab,
+		var(--accent-violet) 8%,
+		var(--surface-chat-card)
+	);
+}
+
+.assistant-reply-suggestions__hint {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	gap: 0.25rem;
+	margin: 0;
+	padding: 0.3125rem 0.5rem;
+	border-top: 1px solid var(--border-default);
+	font-size: 0.625rem;
+	line-height: 1;
+	color: var(--text-chat-tertiary);
+}
+
+.assistant-reply-kbd {
+	display: inline-flex;
+	min-width: 0.875rem;
+	align-items: center;
+	justify-content: center;
+	padding: 0.0625rem 0.25rem;
+	border-radius: 0.1875rem;
+	border: 1px solid var(--border-default-medium);
+	background: var(--surface-chat-card);
+	font-family: ui-monospace, monospace;
+	font-size: 0.5625rem;
+	font-weight: 600;
+	color: var(--text-chat-secondary);
+}
+
+/* ── Assistant panel shell ── */
+.assistant-panel {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+	min-height: 0;
+	width: 100%;
+	margin-inline: auto;
+	overflow: hidden;
+}
+
+.assistant-panel__header {
+	display: flex;
+	flex-shrink: 0;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.5rem;
+	border-bottom: 1px solid var(--border-default);
+	padding: 0.75rem 1rem;
+}
+
+.assistant-panel__header-main {
+	display: flex;
+	min-width: 0;
+	align-items: center;
+	gap: 0.625rem;
+}
+
+.assistant-panel__header-icon {
+	display: flex;
+	width: 2rem;
+	height: 2rem;
+	flex-shrink: 0;
+	align-items: center;
+	justify-content: center;
+	border-radius: 0.625rem;
+	color: var(--text-brand);
+	background: var(--surface-promo);
+	box-shadow: 0 0 0 1px var(--border-brand-subtle);
+}
+
+.assistant-panel__header-text {
+	min-width: 0;
+}
+
+.assistant-panel__title {
+	margin: 0;
+	font-size: 0.875rem;
+	font-weight: 600;
+	letter-spacing: -0.01em;
+	color: var(--text-heading);
+}
+
+.assistant-panel__subtitle {
+	margin: 0;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	font-size: 0.6875rem;
+	color: var(--text-chat-secondary);
+}
+
+.assistant-panel__clear {
+	padding: 0.5rem;
+}
+
+.assistant-panel__footer {
+	position: relative;
+	z-index: 10;
+	flex-shrink: 0;
+	overflow: visible;
+	border-top: 1px solid var(--border-default);
+	background: var(--surface-chat);
+	padding: 0.75rem;
+}
+
+.assistant-panel__empty-title {
+	margin: 0;
+	font-size: 0.875rem;
+	font-weight: 600;
+	letter-spacing: -0.01em;
+	color: var(--text-heading);
+}
+
+.assistant-panel__empty-description {
+	margin: 0.25rem 0 0;
+	font-size: 0.6875rem;
+	line-height: 1.5;
+	color: var(--text-body-subtle);
+}
+
+.assistant-empty-state__prompt-text {
+	min-width: 0;
+	flex: 1;
+	text-align: left;
+}
+
+.assistant-empty-state__prompt-label {
+	display: block;
+	padding-right: 1.25rem;
+	font-size: 0.8125rem;
+	font-weight: 500;
+	line-height: 1.35;
+	color: var(--text-heading);
+}
+
+.assistant-empty-state__prompt--compact .assistant-empty-state__prompt-label {
+	padding-right: 0;
+	font-size: 0.75rem;
+}
+
+.assistant-empty-state__prompt-hint {
+	display: block;
+	margin-top: 0.1875rem;
+	font-size: 0.6875rem;
+	line-height: 1.4;
+	color: var(--text-body-subtle);
+}
+
+.assistant-empty-state__prompt-arrow {
+	position: absolute;
+	top: 0.875rem;
+	right: 0.75rem;
+	flex-shrink: 0;
+	color: var(--text-disabled);
+	transition:
+		color 180ms ease,
+		transform 120ms ease;
+}
+
+.assistant-empty-state__prompt:not(
+		.assistant-empty-state__prompt--compact
+	):hover
+	.assistant-empty-state__prompt-arrow {
+	color: var(--text-brand);
+	transform: translateX(2px);
+}
+
+.assistant-empty-state__prompt--compact .assistant-empty-state__prompt-arrow {
+	position: static;
+}
+
+.assistant-composer__send,
+.assistant-composer__stop {
+	flex-shrink: 0;
+	padding: 0.5rem;
+	border-radius: 0.75rem;
+}
+
+/* ── Assistant buttons (self-contained) ── */
+.assistant-btn {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	gap: 0.5rem;
+	padding: 0.625rem 1.125rem;
+	border-radius: var(--radius-base, 0.5rem);
+	font-size: 0.875rem;
+	font-weight: 500;
+	font-family: inherit;
+	border: 1px solid transparent;
+	cursor: pointer;
+	transition:
+		background 180ms ease,
+		border-color 180ms ease,
+		color 180ms ease,
+		transform 120ms ease;
+}
+
+.assistant-btn:active:not(:disabled) {
+	transform: scale(0.98);
+}
+
+.assistant-btn:disabled {
+	opacity: 0.45;
+	cursor: not-allowed;
+}
+
+.assistant-btn--primary {
+	background: var(--brand);
+	color: var(--brand-on-surface);
+}
+
+.assistant-btn--primary:hover:not(:disabled) {
+	filter: brightness(1.05);
+}
+
+.assistant-btn--secondary {
+	background: var(--surface-panel);
+	border-color: var(--border-default);
+	color: var(--text-heading);
+}
+
+.assistant-btn--secondary:hover:not(:disabled) {
+	background: var(--overlay-hover);
+}
+
+.assistant-btn--ghost {
+	background: transparent;
+	color: var(--text-body);
+}
+
+.assistant-btn--ghost:hover:not(:disabled) {
+	background: var(--overlay-hover);
+}
+
+.assistant-input {
+	width: 100%;
+	padding: 0.375rem 0.625rem;
+	border: 1px solid var(--border-default);
+	border-radius: var(--radius-base, 0.5rem);
+	font: inherit;
+	font-size: 0.875rem;
+	color: var(--text-heading);
+	background: var(--surface-input, var(--surface-panel));
+	transition:
+		border-color 150ms,
+		background 150ms;
+}
+
+.assistant-input:focus {
+	outline: none;
+	border-color: var(--border-default-medium);
+	background: var(--surface-input-focus, var(--surface-panel));
+}
+
+.model-selector__label {
+	display: flex;
+	min-width: 0;
+	align-items: center;
+	gap: 0.5rem;
+}
+
+.model-selector__label-text {
+	flex-shrink: 0;
+	font-size: 0.75rem;
+	color: var(--text-body-subtle);
+}
+
+.sr-only {
+	position: absolute;
+	width: 1px;
+	height: 1px;
+	padding: 0;
+	margin: -1px;
+	overflow: hidden;
+	clip: rect(0, 0, 0, 0);
+	white-space: nowrap;
+	border: 0;
+}
+
+.assistant-empty-state__prompt--skeleton {
+	pointer-events: none;
+	cursor: default;
+}
+
+.assistant-empty-state__icon--skeleton,
+.assistant-empty-state__skeleton-line {
+	background: linear-gradient(
+		90deg,
+		var(--overlay-subtle) 25%,
+		var(--overlay-hover) 50%,
+		var(--overlay-subtle) 75%
+	);
+	background-size: 200% 100%;
+	animation: assistant-skeleton-shimmer 1.2s ease-in-out infinite;
+}
+
+.assistant-empty-state__icon--skeleton {
+	width: 1.75rem;
+	height: 1.75rem;
+	border-radius: calc(var(--radius-base) - 2px);
+}
+
+.assistant-empty-state__skeleton-line {
+	display: block;
+	height: 0.625rem;
+	border-radius: 9999px;
+}
+
+.assistant-empty-state__skeleton-line--title {
+	width: 72%;
+}
+
+.assistant-empty-state__skeleton-line--hint {
+	width: 48%;
+	margin-top: 0.375rem;
+}
+
+@keyframes assistant-skeleton-shimmer {
+	0% {
+		background-position: 200% 0;
+	}
+	100% {
+		background-position: -200% 0;
+	}
+}
+
+/* ── LLM settings strip ── */
+.assistant-llm-settings-strip {
+	display: flex;
+	flex-direction: column;
+	max-height: min(78vh, 34rem);
+	margin-bottom: 0.75rem;
+	padding: 0.75rem;
+	border-radius: var(--radius-base);
+	border: 1px solid var(--border-default);
+	background: var(--surface-panel);
+	overflow: hidden;
+}
+
+.assistant-llm-settings-strip__header {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.5rem;
+	flex-shrink: 0;
+	margin-bottom: 0.5rem;
+}
+
+.assistant-llm-settings-strip__title {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.375rem;
+	font-size: 0.8125rem;
+	font-weight: 600;
+	color: var(--text-heading);
+}
+
+.assistant-llm-settings-strip__header-actions {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.125rem;
+	flex-shrink: 0;
+}
+
+.assistant-llm-settings-strip__header-btn {
+	padding: 0.375rem;
+}
+
+.assistant-llm-settings-strip__loading {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	gap: 0.375rem;
+	padding: 0.75rem 0;
+	font-size: 0.75rem;
+	color: var(--text-body-subtle);
+}
+
+.assistant-llm-settings-strip__form {
+	display: flex;
+	flex: 1;
+	min-height: 0;
+	flex-direction: column;
+}
+
+.assistant-llm-settings-strip__fields {
+	display: flex;
+	flex: 1;
+	min-height: 0;
+	flex-direction: column;
+	gap: 0.5rem;
+	overflow-y: auto;
+	overscroll-behavior: contain;
+	scrollbar-width: thin;
+	scrollbar-color: var(--scrollbar-thumb, var(--border-default)) transparent;
+}
+
+.assistant-llm-settings-strip__field {
+	display: flex;
+	min-width: 0;
+	flex-direction: column;
+	gap: 0.25rem;
+}
+
+.assistant-llm-settings-strip__label {
+	font-size: 0.6875rem;
+	font-weight: 600;
+	color: var(--text-body-subtle);
+}
+
+.assistant-llm-settings-strip__input--mono {
+	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+	font-size: 0.75rem;
+}
+
+.assistant-llm-settings-strip__textarea {
+	min-height: 5rem;
+	resize: vertical;
+	line-height: 1.45;
+	font-size: 0.8125rem;
+}
+
+/* System prompt — compact doc panel */
+.assistant-system-prompt {
+	min-width: 0;
+}
+
+.assistant-system-prompt__shell {
+	overflow: hidden;
+	border-radius: var(--radius-base);
+	border: 1px solid var(--border-default);
+	background: var(--surface-input, var(--surface-panel));
+}
+
+.assistant-system-prompt__bar {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.5rem;
+	padding: 0.25rem 0.25rem 0.25rem 0.5rem;
+	border-bottom: 1px solid var(--border-default);
+	background: var(--overlay-subtle);
+}
+
+.assistant-system-prompt__bar-start {
+	display: inline-flex;
+	min-width: 0;
+	align-items: center;
+	gap: 0.375rem;
+}
+
+.assistant-system-prompt__label {
+	font-size: 0.6875rem;
+	font-weight: 600;
+	color: var(--text-body-subtle);
+}
+
+.assistant-system-prompt__tag {
+	padding: 0.0625rem 0.375rem;
+	border-radius: var(--radius-full);
+	background: var(--surface-chip, var(--overlay-subtle));
+	border: 1px solid var(--surface-chip-border, var(--border-default));
+	font-size: 0.5625rem;
+	font-weight: 600;
+	color: var(--text-brand);
+}
+
+.assistant-system-prompt__modes {
+	display: inline-flex;
+	flex-shrink: 0;
+	gap: 0.0625rem;
+	padding: 0.0625rem;
+	border-radius: calc(var(--radius-base) - 3px);
+	background: var(--surface-panel);
+}
+
+.assistant-system-prompt__mode {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: 1.375rem;
+	height: 1.375rem;
+	padding: 0;
+	border: none;
+	border-radius: calc(var(--radius-base) - 4px);
+	background: transparent;
+	color: var(--text-body-subtle);
+	cursor: pointer;
+	transition:
+		background 150ms ease,
+		color 150ms ease;
+}
+
+.assistant-system-prompt__mode:hover {
+	color: var(--text-heading);
+	background: var(--overlay-hover);
+}
+
+.assistant-system-prompt__mode--active {
+	color: var(--text-brand);
+	background: color-mix(in oklab, var(--brand) 10%, var(--surface-panel));
+}
+
+.assistant-system-prompt__editor {
+	display: block;
+	width: 100%;
+	min-height: 9rem;
+	max-height: 14rem;
+}
+
+.assistant-markdown-editor {
+	position: relative;
+	width: 100%;
+	min-height: inherit;
+	max-height: inherit;
+	overflow: hidden;
+}
+
+.assistant-markdown-editor__highlight,
+.assistant-markdown-editor__input {
+	box-sizing: border-box;
+	width: 100%;
+	min-height: 9rem;
+	max-height: 14rem;
+	margin: 0;
+	padding: 0.5rem 0.625rem;
+	border: none;
+	background: transparent;
+	font: inherit;
+	font-size: 0.75rem;
+	line-height: 1.5;
+	white-space: pre-wrap;
+	overflow-wrap: anywhere;
+	word-break: break-word;
+	tab-size: 2;
+}
+
+.assistant-markdown-editor__highlight {
+	position: absolute;
+	inset: 0;
+	overflow: auto;
+	pointer-events: none;
+	scrollbar-width: none;
+}
+
+.assistant-markdown-editor__highlight::-webkit-scrollbar {
+	display: none;
+}
+
+.assistant-markdown-editor .assistant-markdown-editor__highlight code.hljs {
+	display: block;
+	padding: 0;
+	border: none;
+	background: transparent;
+	font: inherit;
+	font-size: inherit;
+	line-height: inherit;
+	color: var(--text-heading);
+	white-space: pre-wrap;
+	overflow-wrap: anywhere;
+	word-break: break-word;
+}
+
+.assistant-markdown-editor__highlight .hljs-section {
+	font-weight: 700;
+	color: var(--text-brand);
+}
+
+.assistant-markdown-editor__highlight .hljs-strong {
+	font-weight: 600;
+	color: var(--text-heading);
+}
+
+.assistant-markdown-editor__highlight .hljs-bullet,
+.assistant-markdown-editor__highlight .hljs-symbol {
+	color: var(--text-brand);
+	font-weight: 700;
+}
+
+.assistant-markdown-editor__highlight .hljs-code {
+	padding: 0 0.125rem;
+	border-radius: 0.1875rem;
+	background: var(--surface-code);
+	color: var(--surface-code-text, var(--text-heading));
+	font-family:
+		"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+		monospace;
+	font-size: 0.92em;
+	font-weight: 500;
+}
+
+.assistant-markdown-editor__highlight .hljs-emphasis {
+	font-style: italic;
+	color: var(--text-body-subtle);
+}
+
+.assistant-markdown-editor
+	.assistant-markdown-editor__highlight
+	code.hljs
+	.hljs-link,
+.assistant-markdown-editor
+	.assistant-markdown-editor__highlight
+	code.hljs
+	.hljs-string {
+	color: var(--text-brand);
+}
+
+.assistant-markdown-editor__highlight .hljs-quote {
+	color: var(--text-body-subtle);
+}
+
+.assistant-markdown-editor__input {
+	position: relative;
+	z-index: 1;
+	display: block;
+	resize: vertical;
+	color: transparent;
+	caret-color: var(--text-heading);
+	-webkit-text-fill-color: transparent;
+	overflow: auto;
+}
+
+.assistant-markdown-editor__input:focus {
+	outline: none;
+}
+
+.assistant-markdown-editor__input::placeholder {
+	color: var(--text-body-subtle);
+	-webkit-text-fill-color: var(--text-body-subtle);
+	opacity: 1;
+}
+
+.assistant-markdown-editor__input:disabled {
+	opacity: 0.55;
+	cursor: not-allowed;
+}
+
+.assistant-system-prompt__doc {
+	max-height: 14rem;
+	overflow-y: auto;
+	padding: 0.4375rem 0.625rem 0.5rem;
+	scrollbar-width: thin;
+	scrollbar-color: var(--scrollbar-thumb, var(--border-default)) transparent;
+}
+
+.assistant-system-prompt__md {
+	font-family: inherit;
+	font-size: 0.75rem;
+	line-height: 1.48;
+	color: var(--text-body);
+}
+
+.assistant-system-prompt__md > :first-child {
+	margin-top: 0;
+}
+
+.assistant-system-prompt__md > :last-child {
+	margin-bottom: 0;
+}
+
+.assistant-system-prompt__md p {
+	margin: 0.25rem 0;
+}
+
+.assistant-system-prompt__md h1,
+.assistant-system-prompt__md h2,
+.assistant-system-prompt__md h3,
+.assistant-system-prompt__md h4 {
+	margin: 0.375rem 0 0.125rem;
+	font-weight: 600;
+	line-height: 1.3;
+	color: var(--text-heading);
+}
+
+.assistant-system-prompt__md h2 {
+	font-size: 0.625rem;
+	font-weight: 700;
+	letter-spacing: 0.05em;
+	text-transform: uppercase;
+	color: var(--text-brand);
+}
+
+.assistant-system-prompt__md h3 {
+	font-size: 0.75rem;
+}
+
+.assistant-system-prompt__md h2 + p {
+	margin-bottom: 0.125rem;
+	font-size: 0.6875rem;
+	color: var(--text-body-subtle);
+}
+
+.assistant-system-prompt__md ul,
+.assistant-system-prompt__md ol {
+	margin: 0.125rem 0 0.25rem;
+	padding: 0;
+	list-style: none;
+}
+
+.assistant-system-prompt__md ul ul,
+.assistant-system-prompt__md ol ul {
+	margin-top: 0.125rem;
+	padding-left: 0.625rem;
+}
+
+.assistant-system-prompt .assistant-system-prompt__md li {
+	position: relative;
+	margin: 0.1875rem 0;
+	padding-left: 0.6875rem;
+}
+
+.assistant-system-prompt__md ul > li::before {
+	content: "–";
+	position: absolute;
+	left: 0;
+	top: 0;
+	color: var(--text-brand);
+	font-weight: 600;
+	line-height: inherit;
+}
+
+.assistant-system-prompt__md ul ul > li::before {
+	content: "·";
+	font-weight: 700;
+}
+
+.assistant-system-prompt__md ol {
+	counter-reset: prompt-item;
+}
+
+.assistant-system-prompt__md ol > li {
+	padding-left: 1rem;
+}
+
+.assistant-system-prompt__md ol > li::before {
+	content: counter(prompt-item) ".";
+	counter-increment: prompt-item;
+	position: absolute;
+	left: 0;
+	top: 0;
+	font-size: 0.6875rem;
+	font-weight: 600;
+	font-variant-numeric: tabular-nums;
+	color: var(--text-brand);
+	line-height: inherit;
+}
+
+.assistant-system-prompt .assistant-system-prompt__md strong {
+	font-weight: 600;
+	color: var(--text-heading);
+}
+
+.assistant-system-prompt
+	.assistant-system-prompt__md
+	code.markdown-inline-code {
+	padding: 0 0.25rem;
+	border: none;
+	border-radius: 0.1875rem;
+	background: var(--surface-code);
+	color: var(--surface-code-text, var(--text-heading));
+	font-family:
+		"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+		monospace;
+	font-size: 0.68em;
+	font-weight: 500;
+}
+
+.assistant-system-prompt__md .markdown-pre:not(:has(.markdown-mermaid)) {
+	margin: 0.25rem 0;
+	padding: 0.375rem 0.5rem;
+	border-radius: calc(var(--radius-base) - 3px);
+	border: 1px solid var(--border-default);
+	background: var(--surface-inset, var(--overlay-subtle));
+}
+
+.assistant-llm-settings-strip .assistant-input {
+	font-size: 0.8125rem;
+	padding: 0.375rem 0.5rem;
+}
+
+.assistant-llm-settings-strip__advanced-toggle {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.25rem;
+	align-self: flex-start;
+	margin-top: 0.125rem;
+	padding: 0.125rem 0;
+	border: none;
+	background: none;
+	font: inherit;
+	font-size: 0.6875rem;
+	font-weight: 600;
+	color: var(--text-body-subtle);
+	cursor: pointer;
+	transition: color 150ms ease;
+}
+
+.assistant-llm-settings-strip__advanced-toggle:hover {
+	color: var(--text-heading);
+}
+
+.assistant-llm-settings-strip__chevron {
+	transition: transform 180ms ease;
+}
+
+.assistant-llm-settings-strip__chevron--open {
+	transform: rotate(180deg);
+}
+
+.assistant-llm-settings-strip__advanced {
+	display: flex;
+	flex-direction: column;
+	gap: 0.5rem;
+	padding-left: 0.125rem;
+}
+
+.assistant-llm-settings-strip__status {
+	margin: 0;
+	font-size: 0.6875rem;
+	line-height: 1.4;
+}
+
+.assistant-llm-settings-strip__status--error {
+	color: var(--danger);
+}
+
+.assistant-llm-settings-strip__status--success {
+	color: var(--text-brand);
+}
+
+.assistant-llm-settings-strip__footer {
+	display: flex;
+	justify-content: flex-end;
+	align-items: center;
+	gap: 0.25rem;
+	flex-shrink: 0;
+	margin-top: 0.5rem;
+	padding-top: 0.5rem;
+	border-top: 1px solid var(--border-default);
+}
+
+.assistant-llm-settings-strip__footer-btn--reset {
+	margin-right: auto;
+}
+
+.assistant-llm-settings-strip__footer-btn {
+	padding: 0.375rem 0.75rem;
+	font-size: 0.75rem;
+}