docs: migrate documentation to Fumadocs

apps/docs/src/components/pages/getting-started/concept-flow.module.css

@@ -1,36 +1,34 @@
 .diagram {
-  --diagram-ink: var(--ifm-font-color-base);
-  --diagram-muted: var(--ifm-color-emphasis-700);
-  --diagram-panel: var(--ifm-background-surface-color);
-  --diagram-line: var(--ifm-color-emphasis-300);
+  --diagram-ink: var(--color-fd-foreground);
+  --diagram-muted: var(--color-fd-muted-foreground);
+  --diagram-panel: var(--color-fd-card);
+  --diagram-line: var(--color-fd-border);
   margin: 0;
-  padding: 1rem;
-  border: 1px solid var(--diagram-line);
-  border-radius: 0.75rem;
+  padding: 0;
+  border: 0;
   color: var(--diagram-ink);
-  background: var(--diagram-panel);
+  background: transparent;
 }
 
 .lane {
   display: grid;
-  grid-template-columns: minmax(8.5rem, 1.1fr) 2.75rem minmax(8.5rem, 1fr) 2.75rem minmax(8.5rem, 1fr) 2.75rem minmax(
+  grid-template-columns: minmax(8.5rem, 1.1fr) 2.25rem minmax(8.5rem, 1fr) 2.25rem minmax(8.5rem, 1fr) 2.25rem minmax(
       8.5rem,
       1fr
     );
   align-items: stretch;
-  gap: 0.35rem;
+  gap: 0.25rem;
 }
 
 .stage {
   display: grid;
   grid-template-rows: auto 1fr;
-  gap: 0.75rem;
+  gap: 0.55rem;
   min-width: 0;
-  padding: 0.7rem;
-  border: 1px solid var(--diagram-line);
-  border-radius: 0.55rem;
+  padding: 0.45rem;
+  border: 0;
   margin: 0;
-  background: var(--ifm-background-color);
+  background: transparent;
 }
 
 .stageHeading {
@@ -42,7 +40,7 @@
 }
 
 a.stageHeading:hover {
-  color: var(--ifm-color-primary);
+  color: var(--color-fd-primary);
   text-decoration: none;
 }
 
@@ -98,7 +96,7 @@ a.stageHeading:hover {
 
 .service:hover,
 .widget:hover {
-  border-color: var(--ifm-color-primary);
+  border-color: var(--color-fd-primary);
   color: var(--diagram-ink);
   text-decoration: none;
 }
@@ -107,6 +105,7 @@ a.stageHeading:hover {
   flex: none;
   width: 1.25rem;
   height: 1.25rem;
+  margin: 0;
 }
 
 .widget svg {
@@ -123,6 +122,7 @@ a.stageHeading:hover {
 .widget span {
   overflow: hidden;
   font-size: 0.67rem;
+  line-height: 1.3;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
@@ -134,6 +134,7 @@ a.stageHeading:hover {
   color: var(--diagram-muted);
   background: transparent;
   font-size: 0.56rem;
+  line-height: 1.3;
   white-space: nowrap;
 }
 
@@ -142,7 +143,7 @@ a.stageHeading:hover {
   align-content: center;
   justify-items: center;
   gap: 0.35rem;
-  min-height: 5rem;
+  min-height: 4rem;
   text-align: center;
 }
 
@@ -160,8 +161,8 @@ a.stageHeading:hover {
   display: grid;
   align-content: center;
   gap: 0.28rem;
-  min-height: 5rem;
-  padding: 0.42rem;
+  min-height: 0;
+  padding: 0.38rem;
   border: 1px solid var(--diagram-line);
   border-radius: 0.4rem;
   background: var(--diagram-panel);
@@ -172,6 +173,7 @@ a.stageHeading:hover {
   align-items: baseline;
   justify-content: space-between;
   gap: 0.3rem;
+  line-height: 1.2;
 }
 
 .calendarHeader strong {
@@ -194,6 +196,7 @@ a.stageHeading:hover {
   color: var(--diagram-muted);
   font-family: var(--font-mono);
   font-size: 0.38rem;
+  line-height: 1.2;
   text-align: center;
 }
 
@@ -202,12 +205,13 @@ a.stageHeading:hover {
   display: grid;
   place-items: center;
   min-width: 0;
-  aspect-ratio: 1;
+  min-height: 1rem;
   border-radius: 0.18rem;
   color: var(--diagram-muted);
   background: color-mix(in srgb, var(--diagram-line) 28%, transparent);
   font-family: var(--font-mono);
   font-size: 0.42rem;
+  line-height: 1;
 }
 
 .calendarDays span[data-event] {