:root {
  --fh-bg: #030712;
  --fh-surface: #111827;
  --fh-surface-soft: rgba(17, 24, 39, 0.72);
  --fh-surface-muted: rgba(31, 41, 55, 0.72);
  --fh-border: rgba(31, 41, 55, 0.72);
  --fh-border-strong: #374151;
  --fh-text: #f3f4f6;
  --fh-text-muted: #9ca3af;
  --fh-text-soft: #6b7280;
  --fh-code-bg: #0d1117;
  --fh-code-border: #21262d;
}

html.light {
  --fh-bg: #f8fafc;
  --fh-surface: #ffffff;
  --fh-surface-soft: rgba(255, 255, 255, 0.88);
  --fh-surface-muted: rgba(248, 250, 252, 0.9);
  --fh-border: rgba(203, 213, 225, 0.8);
  --fh-border-strong: #cbd5e1;
  --fh-text: #0f172a;
  --fh-text-muted: #475569;
  --fh-text-soft: #64748b;
  --fh-code-bg: #0d1117;
  --fh-code-border: #d8dee9;
}

html,
body {
  background: var(--fh-bg);
  color: var(--fh-text);
  overflow-x: hidden;
}

body {
  transition: background-color 160ms ease, color 160ms ease;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  flex: 0 0 auto;
}

.theme-toggle-sun,
.theme-toggle-moon {
  display: none;
}

/* Prism TOML uses "table" as a token name; keep it from matching Tailwind's table utility. */
.token.table {
  display: inline !important;
}

html.dark .theme-toggle-sun,
html.light .theme-toggle-moon {
  display: block;
}

html.light .dot-grid {
  background-image: radial-gradient(circle, rgba(8, 145, 178, 0.14) 1px, transparent 1px) !important;
}

html.light .gradient-text {
  background: linear-gradient(135deg, #0891b2 0%, #4f46e5 60%, #0e7490 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

html.light .code-win {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
}

html.light .code-win pre[class*="language-"],
html.light .code-win code[class*="language-"] {
  background: transparent !important;
  color: #334155 !important;
  text-shadow: none !important;
}

html.light .token.comment,
html.light .token.prolog,
html.light .token.doctype,
html.light .token.cdata {
  color: #64748b !important;
}

html.light .token.punctuation,
html.light .token.operator {
  color: #475569 !important;
}

html.light .token.property,
html.light .token.tag,
html.light .token.boolean,
html.light .token.number,
html.light .token.constant,
html.light .token.symbol,
html.light .token.deleted {
  color: #9333ea !important;
}

html.light .token.selector,
html.light .token.attr-name,
html.light .token.string,
html.light .token.char,
html.light .token.builtin,
html.light .token.inserted {
  color: #047857 !important;
}

html.light .token.key,
html.light .token.keyword,
html.light .token.function,
html.light .token.class-name {
  color: #0369a1 !important;
}

html.light .section-divider {
  border-top-color: #e2e8f0 !important;
}

html.light .prose h2 {
  color: #0f172a !important;
  border-top-color: #e2e8f0 !important;
}

html.light .prose h3,
html.light .prose h4,
html.light .prose strong {
  color: #1e293b !important;
}

html.light .prose p,
html.light .prose li {
  color: #475569 !important;
}

html.light .prose code {
  background: #e0f2fe !important;
  color: #075985 !important;
}

html.light .callout-info,
html.light .callout.callout-info {
  background: rgba(8, 145, 178, 0.08) !important;
  border-color: rgba(8, 145, 178, 0.28) !important;
  color: #155e75 !important;
}

html.light .callout-warn,
html.light .callout.callout-warn {
  background: rgba(202, 138, 4, 0.1) !important;
  border-color: rgba(202, 138, 4, 0.3) !important;
  color: #854d0e !important;
}

html.light .roadmap-badge {
  background: rgba(124, 58, 237, 0.08) !important;
  border-color: rgba(124, 58, 237, 0.24) !important;
  color: #6d28d9 !important;
}

html.light .doc-link {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
}

html.light .doc-link:hover {
  background: #f8fafc !important;
  border-color: rgba(8, 145, 178, 0.34) !important;
}

html.light .bg-gray-950,
html.light .bg-gray-950\/80,
html.light .bg-gray-950\/70 {
  background-color: var(--fh-surface-soft) !important;
}

html.light body.bg-gray-950,
html.light .min-h-screen.bg-gray-950 {
  background-color: var(--fh-bg) !important;
}

html.light .bg-gray-900,
html.light .bg-gray-900\/70,
html.light .bg-gray-900\/60,
html.light .bg-gray-900\/50 {
  background-color: var(--fh-surface) !important;
}

html.light .bg-gray-800,
html.light .bg-gray-800\/80,
html.light .bg-gray-800\/60,
html.light .bg-gray-800\/50 {
  background-color: #f1f5f9 !important;
}

html.light .hover\:bg-gray-800:hover,
html.light .hover\:bg-gray-800\/60:hover,
html.light .hover\:bg-gray-700:hover {
  background-color: #e2e8f0 !important;
}

html.light .border-gray-800,
html.light .border-gray-800\/70,
html.light .border-gray-800\/60,
html.light .border-gray-800\/50,
html.light .border-gray-700,
html.light .border-gray-700\/60,
html.light .border-gray-700\/40 {
  border-color: var(--fh-border) !important;
}

html.light .border-cyan-800\/50,
html.light .border-cyan-800\/40,
html.light .border-cyan-800\/30 {
  border-color: rgba(8, 145, 178, 0.34) !important;
}

html.light .text-white,
html.light .text-gray-100 {
  color: #0f172a !important;
}

html.light .text-gray-300,
html.light .text-gray-400 {
  color: #475569 !important;
}

html.light .text-gray-500,
html.light .text-gray-600,
html.light .text-gray-700 {
  color: #64748b !important;
}

html.light .hover\:text-white:hover,
html.light .hover\:text-gray-300:hover,
html.light .hover\:text-gray-400:hover {
  color: #0f172a !important;
}

html.light .text-cyan-400,
html.light .hover\:text-cyan-300:hover {
  color: #0891b2 !important;
}

html.light .text-emerald-400 {
  color: #059669 !important;
}

html.light .text-amber-400 {
  color: #b45309 !important;
}

html.light .text-violet-400 {
  color: #7c3aed !important;
}

html.light .bg-cyan-500\/10,
html.light .bg-cyan-500\/8,
html.light .bg-cyan-500\/5 {
  background-color: rgba(8, 145, 178, 0.08) !important;
}

html.light .bg-emerald-500\/10,
html.light .bg-emerald-500\/5 {
  background-color: rgba(5, 150, 105, 0.08) !important;
}

html.light .bg-amber-500\/10,
html.light .bg-yellow-500\/10 {
  background-color: rgba(180, 83, 9, 0.1) !important;
}

html.light .bg-violet-500\/10,
html.light .bg-violet-500\/5 {
  background-color: rgba(124, 58, 237, 0.08) !important;
}

html.light .bg-cyan-500 {
  background-color: #0891b2 !important;
}

html.light .hover\:bg-cyan-400:hover {
  background-color: #0e7490 !important;
}

html.light .shadow-cyan-500\/20 {
  box-shadow: 0 12px 30px rgba(8, 145, 178, 0.18) !important;
}

html.light .glow-cyan {
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.05) !important;
}

html.light .glow-cyan:hover {
  box-shadow: 0 18px 42px rgba(8, 145, 178, 0.14) !important;
}

html.light table {
  color: #334155;
}

html.light thead tr,
html.light tbody tr {
  border-color: #e2e8f0 !important;
}

html.light img {
  color: #0f172a;
}

.source-doc {
  color: #cbd5e1;
  font-size: 0.96rem;
  line-height: 1.75;
}

.source-doc h1 {
  color: #ffffff;
  font-size: 2.25rem;
  line-height: 1.15;
  font-weight: 900;
  margin: 0 0 1.5rem;
}

.source-doc h2 {
  color: #ffffff;
  font-size: 1.45rem;
  line-height: 1.3;
  font-weight: 800;
  margin: 2.75rem 0 1rem;
  padding-top: 1.75rem;
  border-top: 1px solid #1f2937;
}

.source-doc h3,
.source-doc h4 {
  color: #e5e7eb;
  font-size: 1.05rem;
  line-height: 1.35;
  font-weight: 700;
  margin: 2rem 0 0.75rem;
}

.source-doc p,
.source-doc ul,
.source-doc ol {
  margin: 0 0 1rem;
}

.source-doc ul,
.source-doc ol {
  padding-left: 1.4rem;
}

.source-doc ul {
  list-style: disc;
}

.source-doc ol {
  list-style: decimal;
}

.source-doc li {
  margin: 0.35rem 0;
}

.source-doc code {
  background: #1f2937;
  color: #67e8f9;
  border-radius: 4px;
  padding: 0.12rem 0.36rem;
  font-size: 0.86em;
}

.source-doc pre {
  margin: 1.25rem 0 1.5rem;
  padding: 1rem 1.1rem;
  overflow-x: auto;
  background: #0d1117;
  border: 1px solid #21262d;
  border-radius: 10px;
  color: #d1d5db;
  line-height: 1.65;
}

.source-doc pre code {
  display: block;
  width: max-content;
  min-width: 100%;
  background: transparent;
  color: inherit;
  padding: 0;
  white-space: pre;
}

.source-table {
  overflow-x: auto;
  margin: 1.25rem 0 1.5rem;
  border: 1px solid #1f2937;
  border-radius: 10px;
}

.source-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.source-table th,
.source-table td {
  padding: 0.7rem 0.9rem;
  border-bottom: 1px solid #1f2937;
  vertical-align: top;
}

.source-table th {
  color: #94a3b8;
  font-weight: 700;
  text-align: left;
  background: rgba(17, 24, 39, 0.64);
}

.source-table tr:last-child td {
  border-bottom: 0;
}

html.light .source-doc {
  color: #334155;
}

html.light .source-doc h1,
html.light .source-doc h2 {
  color: #0f172a;
}

html.light .source-doc h3,
html.light .source-doc h4 {
  color: #1e293b;
}

html.light .source-doc h2,
html.light .source-table,
html.light .source-table th,
html.light .source-table td {
  border-color: #e2e8f0;
}

html.light .source-doc code {
  background: #e2e8f0;
  color: #0e7490;
}

html.light .source-doc pre {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  color: #334155 !important;
  box-shadow: none !important;
}

html.light .source-doc pre code {
  background: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
  border: 0 !important;
}

html.light .source-table th {
  background: #f1f5f9;
  color: #475569;
}