/* Baseline fallback styling if Tailwind isn't available (e.g., before build). */
html, body {
	height: 100%;
}

body {
	margin: 0;
	background: #090b12; /* ink-900 */
	color: #f5f7fb;      /* mist-50 */
	font-family: "IBM Plex Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}

/* Markdown rendering for assistant messages */
.markdown {
	color: rgba(255, 255, 255, 0.82);
}

.markdown a {
	color: #20c5ff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.markdown a:hover {
	color: #0abf8c;
}

.markdown p {
	margin: 0.6rem 0;
}

.markdown ul,
.markdown ol {
	margin: 0.6rem 0;
	padding-left: 1.25rem;
}

.markdown li {
	margin: 0.2rem 0;
}

.markdown code {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	font-size: 0.92em;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.10);
	padding: 0.12rem 0.35rem;
	border-radius: 0.4rem;
}

.markdown pre {
	background: rgba(9, 11, 18, 0.65);
	border: 1px solid rgba(255, 255, 255, 0.10);
	border-radius: 0.75rem;
	padding: 0.9rem;
	overflow: auto;
}

.markdown pre code {
	background: transparent;
	border: 0;
	padding: 0;
}

.markdown blockquote {
	margin: 0.75rem 0;
	padding: 0.25rem 0 0.25rem 0.9rem;
	border-left: 3px solid rgba(32, 197, 255, 0.45);
	color: rgba(255, 255, 255, 0.75);
}

.markdown hr {
	border: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	margin: 1rem 0;
}

a { color: #20c5ff; }

/* Small, non-utility styles that complement Tailwind */

select { appearance: none; -webkit-appearance: none; -moz-appearance: none; }
select::-ms-expand { display: none; }

/* Keep code blocks readable */
pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }

/* Thin scrollbar utility (apply via class="scrollbar-thin") */
.scrollbar-thin {
	scrollbar-width: thin; /* Firefox */
	scrollbar-color: rgba(255, 255, 255, 0.18) transparent;
}

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

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

.scrollbar-thin::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.16);
	border-radius: 9999px;
}

/* Constellation typing indicator (Assistant streaming) */
.sn-typing {
	display: inline-flex;
	align-items: center;
	transform: translateY(-1px);
}

.sn-typing-svg {
	overflow: visible;
}

.sn-typing-link {
	stroke: rgba(245, 247, 251, 0.35);
	stroke-width: 1.6;
	stroke-linecap: round;
	opacity: 0.55;
	stroke-dasharray: 16 8;
	animation: snTypingLink 1.35s ease-in-out infinite;
}

.sn-typing-dot {
	fill: rgba(245, 247, 251, 0.7);
	filter: drop-shadow(0 0 6px rgba(32, 197, 255, 0.22));
	transform-box: fill-box;
	transform-origin: center;
	animation: snTypingDot 1.35s ease-in-out infinite;
}

.sn-typing-dot2 { animation-delay: 0.12s; fill: rgba(32, 197, 255, 0.85); }
.sn-typing-dot3 { animation-delay: 0.24s; }
.sn-typing-dot4 { animation-delay: 0.36s; }

.sn-typing-link2 { animation-delay: 0.10s; }
.sn-typing-link3 { animation-delay: 0.20s; }

@keyframes snTypingDot {
	0%, 100% { transform: translateY(0px) scale(0.98); opacity: 0.55; }
	45% { transform: translateY(-2px) scale(1.22); opacity: 1; }
	75% { transform: translateY(0.5px) scale(1.02); opacity: 0.7; }
}

@keyframes snTypingLink {
	0% { opacity: 0.18; stroke-dashoffset: 0; }
	45% { opacity: 0.55; }
	100% { opacity: 0.18; stroke-dashoffset: -22; }
}

.scrollbar-thin::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 255, 255, 0.22);
}