:root {
  color-scheme: dark;
  --accent-300: #67e8f9;
  --accent-400: #22d3ee;
  --accent-500: #06b6d4;
  --accent-shadow: rgb(8 145 178 / 0.24);
}

[data-theme="light"] {
  color-scheme: light;
  --accent-300: #0e7490;
  --accent-400: #0891b2;
  --accent-500: #0e7490;
  --accent-shadow: rgb(8 145 178 / 0.14);
}

[data-product="mintflow"] {
  --accent-300: #6ee7b7;
  --accent-400: #34d399;
  --accent-500: #10b981;
  --accent-shadow: rgb(16 185 129 / 0.28);
}

[data-product="nova"] {
  --accent-300: #7dd3fc;
  --accent-400: #38bdf8;
  --accent-500: #0ea5e9;
  --accent-shadow: rgb(14 165 233 / 0.26);
}

[data-theme="light"][data-product="mintflow"] {
  --accent-300: #047857;
  --accent-400: #059669;
  --accent-500: #047857;
  --accent-shadow: rgb(4 120 87 / 0.18);
}

[data-theme="light"][data-product="nova"] {
  --accent-300: #0369a1;
  --accent-400: #0284c7;
  --accent-500: #0369a1;
  --accent-shadow: rgb(3 105 161 / 0.18);
}

body {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
}

.topnav-link {
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 0.24rem 0.72rem;
  color: #cbd5e1;
  font-weight: 600;
}

summary {
  list-style: none;
}

summary::-webkit-details-marker {
  display: none;
}

.topnav-link:hover {
  color: var(--accent-300) !important;
  border-color: color-mix(in srgb, var(--accent-500) 38%, transparent);
  background: color-mix(in srgb, var(--accent-500) 12%, transparent);
}

.topnav-link-active {
  color: var(--accent-300) !important;
  border-color: color-mix(in srgb, var(--accent-500) 52%, transparent);
  background: color-mix(in srgb, var(--accent-500) 18%, transparent);
}

[data-theme="light"] .topnav-link {
  color: #334155;
}

[data-theme="light"] .topnav-link:hover,
[data-theme="light"] .topnav-link-active {
  color: var(--accent-500) !important;
  border-color: color-mix(in srgb, var(--accent-500) 35%, #94a3b8);
  background: color-mix(in srgb, var(--accent-500) 10%, #ffffff);
}

h1,
h2,
h3,
h4,
h5,
h6,
.font-mono {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
}

.prose h2,
.prose h3,
.prose h4 {
  scroll-margin-top: 7rem;
}

.prose {
  line-height: 1.58;
  font-weight: 430;
  letter-spacing: -0.005em;
}

.prose :where(p, ul, ol, pre, blockquote):not(:where(.not-prose, .not-prose *)) {
  margin-top: 0.65rem;
  margin-bottom: 0.65rem;
  font-weight: 420;
}

.prose :where(h2):not(:where(.not-prose, .not-prose *)) {
  margin-top: 1.8rem;
  margin-bottom: 0.8rem;
  font-size: 1.5rem;
  font-weight: 700;
}

.prose :where(h3):not(:where(.not-prose, .not-prose *)) {
  margin-top: 1.4rem;
  margin-bottom: 0.6rem;
  font-size: 1.2rem;
  font-weight: 650;
}

.prose :where(ul):not(:where(.not-prose, .not-prose *)) {
  list-style: disc;
  padding-left: 1.4rem;
}

.prose :where(ol):not(:where(.not-prose, .not-prose *)) {
  list-style: decimal;
  padding-left: 1.4rem;
}

.prose :where(li):not(:where(.not-prose, .not-prose *)) {
  margin-top: 0.2rem;
  font-weight: 420;
}

.prose img {
  border-radius: 0.75rem;
}

[data-theme="light"] body {
  background: linear-gradient(180deg, #f8fbff 0%, #edf3ff 100%) !important;
  color: #0f172a !important;
}

::selection {
  background-color: color-mix(in srgb, var(--accent-500) 30%, transparent);
}

.text-cyan-300,
.prose-a\:text-cyan-300 :where(a):not(:where(.not-prose, .not-prose *)) {
  color: var(--accent-300) !important;
}

.subnav-link {
  color: #94a3b8 !important;
  font-weight: 500;
  position: relative;
  padding-bottom: 0.42rem;
}

[data-theme="light"] .subnav-link {
  color: #334155 !important;
}

.subnav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: color-mix(in srgb, var(--accent-500) 80%, transparent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 180ms ease;
}

.subnav-link:hover::after,
.subnav-link-active::after {
  transform: scaleX(1);
}

.subnav-link-active {
  color: var(--accent-300) !important;
  font-weight: 650;
}

[data-theme="light"] .subnav-link-active {
  color: var(--accent-500) !important;
}

.hover\:text-cyan-200:hover {
  color: color-mix(in srgb, var(--accent-300) 80%, white) !important;
}

.hover\:text-cyan-300:hover {
  color: var(--accent-300) !important;
}

.hover\:border-cyan-500\/60:hover,
.hover\:border-cyan-500:hover {
  border-color: color-mix(in srgb, var(--accent-500) 60%, transparent) !important;
}

[data-theme="light"] .hover\:border-cyan-500\/60:hover,
[data-theme="light"] .hover\:border-cyan-500:hover {
  border-color: color-mix(in srgb, var(--accent-500) 40%, #94a3b8) !important;
}

.shadow-cyan-950\/40 {
  --tw-shadow-color: var(--accent-shadow) !important;
}

.prose :where(a):not(:where(.not-prose, .not-prose *)) {
  color: var(--accent-400) !important;
  text-decoration: underline;
  text-underline-offset: 0.16em;
  text-decoration-thickness: 1.5px;
  font-weight: 600;
}

[data-theme="light"] .prose :where(a):not(:where(.not-prose, .not-prose *)) {
  color: var(--accent-500) !important;
}

[data-theme="light"] .bg-zinc-950,
[data-theme="light"] .bg-zinc-950\/90,
[data-theme="light"] .bg-zinc-950\/70 {
  background-color: #f8fbff !important;
}

[data-theme="light"] .bg-zinc-900,
[data-theme="light"] .bg-zinc-900\/70,
[data-theme="light"] .bg-zinc-900\/80,
[data-theme="light"] .bg-zinc-900\/60 {
  background-color: #ffffff !important;
  box-shadow: 0 8px 24px rgb(15 23 42 / 0.06);
}

[data-theme="light"] .text-zinc-50,
[data-theme="light"] .text-zinc-100 {
  color: #0f172a !important;
}

[data-theme="light"] .text-zinc-200,
[data-theme="light"] .text-zinc-300 {
  color: #334155 !important;
}

[data-theme="light"] .text-zinc-400,
[data-theme="light"] .text-zinc-500 {
  color: #64748b !important;
}

[data-theme="light"] .border-zinc-900,
[data-theme="light"] .border-zinc-800,
[data-theme="light"] .border-zinc-800\/80,
[data-theme="light"] .border-zinc-700 {
  border-color: #cfdbee !important;
}

[data-theme="light"] .border-emerald-500\/40 {
  border-color: color-mix(in srgb, #10b981 36%, #cbd5e1) !important;
}

[data-theme="light"] .border-sky-500\/40 {
  border-color: color-mix(in srgb, #0ea5e9 36%, #cbd5e1) !important;
}

[data-theme="light"] .shadow-emerald-900\/20 {
  --tw-shadow-color: rgb(16 185 129 / 0.12) !important;
}

[data-theme="light"] .shadow-sky-900\/20 {
  --tw-shadow-color: rgb(14 165 233 / 0.12) !important;
}

[data-theme="light"] .shadow-cyan-950\/40 {
  --tw-shadow-color: var(--accent-shadow) !important;
}

[data-theme="light"] .prose-invert {
  color: #334155 !important;
  font-weight: 420;
}

[data-theme="light"] .prose-invert :where(h1, h2, h3, h4, th, strong) {
  color: #0f172a !important;
}

[data-theme="light"] .prose-invert :where(a) {
  color: var(--accent-500) !important;
}

[data-theme="light"] .prose-invert :where(code) {
  background: #e8eef7 !important;
  color: #1e293b !important;
}