ardo 3.0.5 → 3.1.0

package/dist/ui/styles.css

@@ -1,375 +1,305 @@
-/* Ardo Theme Styles - Clean & Refined */
-
-/* CSS Variables */
+/* vanilla-extract-css-ns:src/ui/theme/light.css.ts.vanilla.css?source=#H4sIAAAAAAAAA5WWUW_aMBDH3_cpTkyVWsnpnJBAmj21m7pOKnsomvZsEhOsGl9kOy3VtO8-2cAI4KQa8ADx7-7_v7N9otCIFn5_AIgipiuMSpSoo4VmqioAn2W5uqTXaQ70Os4gntKrz0H2UdQrewiYvMd_Zfq5k9_h0wF83i6s5IeAGydAk4GIb5pVgitbgBSKMx3VuweX8TireE2CxQG9OCxkvooxJJReQUzpRUCqLuDj0r8Ca3NcdnpyM82cadrXlnrW2m6JWzrvo29lN3fi6TgMW77psEni0R4bjj3ZzPS93J7n-nj7-62jrrpwnr9PnzjalUsn4ZhKvIj_kDCi4gum7-rzveoR2EecVDK8CyVW_Egj32qkA_iZwFAdLmK-YhW-FkAhbjYwbjag6wW7pAR2n2s6DtTjo-brfVzSbPaa4N6fXFx6RTppz5YnfWlnlUubNhuY9Kd1imloudftY-3dUmc3CxsiO10PBYTPD7NoDs3OdmMhy4Lg8XHx42gAPj3zfuvzMP_KtBKqkz7zViaQ9sPHB8s3bhAP3cE4GFExVXdR7yWHpBcNNGaIDnUmDgYItcQTHykkSeAmODJooxfu2Z9ggMLunN77CN1IRwZ99MLB2ZifBkj2hq3dj6FforKrApKcNptzyGK5B9IgUKKyXNkZ2-y4OKZBcMVZxfUD387iaXLEWM2UEVagipbM2MJfHgOcGR6mFsxwRyVDkJF-mF2Pz6AlKhst2VrItwLMm7F8HbWCQMSaRvJo-4TAnRTqecbKuf99j8oSGM15jRx-fh8ReMIFWiQweuDyhVtRMvjBWz4icKsFkwQMUyYyXIvlqfgaFRbQCv_FNKzkBOb3M1QYPfG6lUw7qXtwT0YEZlxJJPAFlUHJDIHRo1hwzVyde-Zfpo6W-9vSmsisCzfLzhe2fcxDS7IuIPbb9OcvrF8g7egJAAA */
 :root {
-  /* ========================================
-     Base Colors (OKLCH for better color math)
-     ======================================== */
-
-  /* Brand - Teal/Green from logo - used sparingly for accents */
-  --ardo-brand-h: 170;
-  --ardo-brand-c: 0.15;
-  --ardo-brand-l: 0.48;
-
-  /* Semantic Colors (hue values) */
-  --ardo-hue-success: 155;
-  --ardo-hue-warning: 45;
-  --ardo-hue-danger: 25;
-  --ardo-hue-info: 220;
-  --ardo-hue-note: 270;
-
-  /* ========================================
-     Derived Brand Colors
-     ======================================== */
-  --ardo-c-brand: oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h));
-  --ardo-c-brand-light: oklch(
-    calc(var(--ardo-brand-l) + 0.12) var(--ardo-brand-c) var(--ardo-brand-h)
-  );
-  --ardo-c-brand-dark: oklch(
-    calc(var(--ardo-brand-l) - 0.08) calc(var(--ardo-brand-c) + 0.02) var(--ardo-brand-h)
-  );
-  --ardo-c-brand-subtle: oklch(0.96 0.02 var(--ardo-brand-h));
-  --ardo-c-brand-gradient: linear-gradient(
-    135deg,
-    oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h)) 0%,
-    oklch(
-        calc(var(--ardo-brand-l) + 0.08) calc(var(--ardo-brand-c) - 0.02)
-          calc(var(--ardo-brand-h) + 30)
-      )
-      100%
-  );
-
-  /* ========================================
-     Neutral Background Colors (brand-tinted)
-     ======================================== */
-  --ardo-c-bg: #ffffff;
-  --ardo-c-bg-soft: oklch(0.975 0.005 var(--ardo-brand-h));
-  --ardo-c-bg-mute: oklch(0.95 0.008 var(--ardo-brand-h));
-  --ardo-c-bg-alt: oklch(0.925 0.01 var(--ardo-brand-h));
-
-  /* Sidebar - brand-tinted */
-  --ardo-sidebar-bg: oklch(0.975 0.006 var(--ardo-brand-h));
-  --ardo-sidebar-border: oklch(0.925 0.01 var(--ardo-brand-h));
-
-  /* Code block styling - derived from brand hue */
-  --ardo-code-bg: oklch(0.985 0.004 var(--ardo-brand-h));
-  --ardo-code-border: oklch(0.92 0.008 var(--ardo-brand-h));
-  --ardo-code-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
-
-  /* ========================================
-     Text Colors (brand-tinted)
-     ======================================== */
-  --ardo-c-text: oklch(0.22 0.015 var(--ardo-brand-h));
-  --ardo-c-text-light: oklch(0.45 0.01 var(--ardo-brand-h));
-  --ardo-c-text-lighter: oklch(0.6 0.008 var(--ardo-brand-h));
-
-  /* Border Colors (brand-tinted) */
-  --ardo-c-border: oklch(0.88 0.008 var(--ardo-brand-h));
-  --ardo-c-border-light: oklch(0.925 0.006 var(--ardo-brand-h));
-  --ardo-c-divider: var(--ardo-c-border);
-
-  /* ========================================
-     Shadows
-     ======================================== */
-  --ardo-shadow-sm: 0 1px 2px oklch(0 0 0 / 0.04), 0 1px 3px oklch(0 0 0 / 0.06);
-  --ardo-shadow-md: 0 4px 6px oklch(0 0 0 / 0.04), 0 2px 4px oklch(0 0 0 / 0.03);
-  --ardo-shadow-lg: 0 10px 25px oklch(0 0 0 / 0.06), 0 4px 10px oklch(0 0 0 / 0.04);
-
-  /* ========================================
-     Container Colors (using hue variables)
-     ======================================== */
-  --ardo-c-tip: oklch(0.5 0.15 var(--ardo-hue-success));
-  --ardo-c-tip-bg: oklch(0.97 0.025 var(--ardo-hue-success));
-  --ardo-c-tip-border: oklch(0.85 0.08 var(--ardo-hue-success));
-
-  --ardo-c-warning: oklch(0.55 0.16 var(--ardo-hue-warning));
-  --ardo-c-warning-bg: oklch(0.98 0.03 var(--ardo-hue-warning));
-  --ardo-c-warning-border: oklch(0.88 0.1 var(--ardo-hue-warning));
-
-  --ardo-c-danger: oklch(0.5 0.18 var(--ardo-hue-danger));
-  --ardo-c-danger-bg: oklch(0.97 0.02 var(--ardo-hue-danger));
-  --ardo-c-danger-border: oklch(0.85 0.1 var(--ardo-hue-danger));
-
-  --ardo-c-info: oklch(0.5 0.14 var(--ardo-hue-info));
-  --ardo-c-info-bg: oklch(0.97 0.02 var(--ardo-hue-info));
-  --ardo-c-info-border: oklch(0.85 0.08 var(--ardo-hue-info));
-
-  --ardo-c-note: oklch(0.5 0.14 var(--ardo-hue-note));
-  --ardo-c-note-bg: oklch(0.97 0.02 var(--ardo-hue-note));
-  --ardo-c-note-border: oklch(0.88 0.08 var(--ardo-hue-note));
-
-  /* ========================================
-     Layout
-     ======================================== */
-  --ardo-sidebar-width: 280px;
-  --ardo-toc-width: 240px;
-  --ardo-content-max-width: 1100px;
-  --ardo-header-height: 72px;
-
-  /* Transitions */
+  --ardo-color-brand: oklch(0.48 0.15 170);
+  --ardo-color-brandLight: oklch(0.6 0.15 170);
+  --ardo-color-brandDark: oklch(0.4 0.17 170);
+  --ardo-color-brandSubtle: oklch(0.96 0.02 170);
+  --ardo-color-brandGradient:
+    linear-gradient(
+      135deg,
+      oklch(0.48 0.15 170) 0%,
+      oklch(0.56 0.13 200) 100%);
+  --ardo-color-bg: #ffffff;
+  --ardo-color-bgSoft: oklch(0.975 0.005 170);
+  --ardo-color-bgMute: oklch(0.95 0.008 170);
+  --ardo-color-bgAlt: oklch(0.925 0.01 170);
+  --ardo-color-text: oklch(0.22 0.015 170);
+  --ardo-color-textLight: oklch(0.45 0.01 170);
+  --ardo-color-textLighter: oklch(0.6 0.008 170);
+  --ardo-color-border: oklch(0.88 0.008 170);
+  --ardo-color-borderLight: oklch(0.925 0.006 170);
+  --ardo-color-divider: oklch(0.88 0.008 170);
+  --ardo-color-sidebarBg: oklch(0.975 0.006 170);
+  --ardo-color-sidebarBorder: oklch(0.925 0.01 170);
+  --ardo-color-codeBg: oklch(0.985 0.004 170);
+  --ardo-color-codeBorder: oklch(0.92 0.008 170);
+  --ardo-color-codeShadow: 0 1px 3px rgba(0, 0, 0, 0.03);
+  --ardo-color-shadowSm: 0 1px 2px oklch(0 0 0 / 0.04), 0 1px 3px oklch(0 0 0 / 0.06);
+  --ardo-color-shadowMd: 0 4px 6px oklch(0 0 0 / 0.04), 0 2px 4px oklch(0 0 0 / 0.03);
+  --ardo-color-shadowLg: 0 10px 25px oklch(0 0 0 / 0.06), 0 4px 10px oklch(0 0 0 / 0.04);
+  --ardo-color-tip: oklch(0.5 0.15 155);
+  --ardo-color-tipBg: oklch(0.97 0.025 155);
+  --ardo-color-tipBorder: oklch(0.85 0.08 155);
+  --ardo-color-warning: oklch(0.55 0.16 45);
+  --ardo-color-warningBg: oklch(0.98 0.03 45);
+  --ardo-color-warningBorder: oklch(0.88 0.1 45);
+  --ardo-color-danger: oklch(0.5 0.18 25);
+  --ardo-color-dangerBg: oklch(0.97 0.02 25);
+  --ardo-color-dangerBorder: oklch(0.85 0.1 25);
+  --ardo-color-info: oklch(0.5 0.14 220);
+  --ardo-color-infoBg: oklch(0.97 0.02 220);
+  --ardo-color-infoBorder: oklch(0.85 0.08 220);
+  --ardo-color-note: oklch(0.5 0.14 270);
+  --ardo-color-noteBg: oklch(0.97 0.02 270);
+  --ardo-color-noteBorder: oklch(0.88 0.08 270);
+  --ardo-layout-sidebarWidth: 280px;
+  --ardo-layout-tocWidth: 240px;
+  --ardo-layout-contentMaxWidth: 1100px;
+  --ardo-layout-headerHeight: 72px;
   --ardo-transition-fast: 0.15s ease;
-  --ardo-transition: 0.2s ease;
+  --ardo-transition-base: 0.2s ease;
   --ardo-transition-slow: 0.3s ease;
-
-  /* ========================================
-     Typography (System Font Stacks)
-     ======================================== */
   --ardo-font-family:
-    system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial,
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    Roboto,
+    "Helvetica Neue",
+    Arial,
     sans-serif;
   --ardo-font-mono:
-    ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
-
-  /* Radius */
-  --ardo-radius: 8px;
+    ui-monospace,
+    SFMono-Regular,
+    "SF Mono",
+    Menlo,
+    Consolas,
+    "Liberation Mono",
+    monospace;
   --ardo-radius-sm: 4px;
+  --ardo-radius-base: 8px;
   --ardo-radius-lg: 12px;
 }
 
-/* Dark mode */
+/* vanilla-extract-css-ns:src/ui/theme/dark.css.ts.vanilla.css?source=#H4sIAAAAAAAAA42WUW-bMBDH3_cpTpEqtRJkhkDC2FO7qeukZg9F054NOMSKYyPbtFTTvvtkUxZCDJ2ShwT_7n__O9snliWWB_j9AcD3sSyFXwgmpJ9LzMsUxIEV-2u0XMeAlsEagg26-exkH2m116eAzea9gK9YHk58bPlkhs-aXDNyiggBLVE0E_BN4pISrlNglBMs_ertwXWwiktSec7qAF2dFjYrsxBBiNANBAhdOVJVJ0uB0UFBPGGqysROjwoIp9hto4fFJrPwLRvorpI5F5q0A_aTKRChib4bdryv72lbnsjBznZNmfIuZDmkV3N1WnZkaL7akj7T_9ZXtCQ5lnfDHe3UJ_rTB4xqmN2sQpTkLEPX0Rl4rD57yExEtseleEkBQVC3sKpbkFWOr5EHb99l6KjFBmXHPiys2z4lmM9HcxPCG2-gerEcT8luSyMb1S2sp2VNxsixjJIp2cfKukXGbuyI7HSNpmUceS-PMK0HR9cWBUHsKEzTeriN_TSaQsfH3Eq78RcsOeXV6AYFa4im4TMr1ks8i4_sRLYbzogS8-rsOndzOpxEHV2Zgd19cQVQvhMjGxGEoeMOGNLlYpJ1mUCJO4CL4VzubbiuoiFdNibZKRvnAQy_ikb3s-cXLfU-hTBBdXsJaVH0QOQECsE14XqL2zcuCJAT3BNcEvlAuuG7Cc8YLTFXVFPB_R1WOrXXRgHBiripHCtiqHAOUswOseXqAtoJrv0dPlL2moJ6VZoc_YZ64OO6ZsTvnnhwxyg_bHGR2f_3gmsPFhmpBIGf3xcePIlcaOHB4oGwZ6JpgeEHacjCg1tJMfNAYa58RSTdjZMfBRcpNNT-UDUuiAfZ_VZw4T-RqmFYmlT3YJ4sPNgSzoQHXwRXgmHlweKR5kRiU2fP_FMa5DIvLI3y1TE1U-xyoetj4lpiVQqB3aY_fwHKHngS4wkAAA */
 .dark {
-  --ardo-brand-l: 0.65;
-  --ardo-brand-c: 0.16;
-
-  --ardo-c-brand-subtle: oklch(0.2 0.04 var(--ardo-brand-h));
-
-  /* Dark backgrounds - brand-tinted slate */
-  --ardo-c-bg: oklch(0.15 0.015 var(--ardo-brand-h));
-  --ardo-c-bg-soft: oklch(0.2 0.02 var(--ardo-brand-h));
-  --ardo-c-bg-mute: oklch(0.28 0.02 var(--ardo-brand-h));
-  --ardo-c-bg-alt: oklch(0.38 0.015 var(--ardo-brand-h));
-
-  --ardo-sidebar-bg: oklch(0.18 0.018 var(--ardo-brand-h));
-  --ardo-sidebar-border: oklch(0.28 0.02 var(--ardo-brand-h));
-
-  --ardo-code-bg: oklch(0.17 0.01 var(--ardo-brand-h));
-  --ardo-code-border: oklch(0.25 0.015 var(--ardo-brand-h));
-  --ardo-code-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
-
-  /* Light text on dark (brand-tinted) */
-  --ardo-c-text: oklch(0.93 0.008 var(--ardo-brand-h));
-  --ardo-c-text-light: oklch(0.7 0.015 var(--ardo-brand-h));
-  --ardo-c-text-lighter: oklch(0.55 0.012 var(--ardo-brand-h));
-
-  --ardo-c-border: oklch(0.3 0.02 var(--ardo-brand-h));
-  --ardo-c-border-light: oklch(0.38 0.015 var(--ardo-brand-h));
-  --ardo-c-divider: var(--ardo-c-border);
-
-  --ardo-shadow-sm: 0 1px 2px oklch(0 0 0 / 0.12), 0 1px 3px oklch(0 0 0 / 0.15);
-  --ardo-shadow-md: 0 4px 6px oklch(0 0 0 / 0.12), 0 2px 4px oklch(0 0 0 / 0.08);
-  --ardo-shadow-lg: 0 10px 25px oklch(0 0 0 / 0.2), 0 4px 10px oklch(0 0 0 / 0.12);
-
-  /* Dark container backgrounds */
-  --ardo-c-tip-bg: oklch(0.2 0.04 var(--ardo-hue-success));
-  --ardo-c-tip-border: oklch(0.35 0.1 var(--ardo-hue-success));
-
-  --ardo-c-warning-bg: oklch(0.22 0.05 var(--ardo-hue-warning));
-  --ardo-c-warning-border: oklch(0.4 0.12 var(--ardo-hue-warning));
-
-  --ardo-c-danger-bg: oklch(0.2 0.04 var(--ardo-hue-danger));
-  --ardo-c-danger-border: oklch(0.35 0.1 var(--ardo-hue-danger));
-
-  --ardo-c-info-bg: oklch(0.2 0.04 var(--ardo-hue-info));
-  --ardo-c-info-border: oklch(0.35 0.08 var(--ardo-hue-info));
-
-  --ardo-c-note-bg: oklch(0.2 0.04 var(--ardo-hue-note));
-  --ardo-c-note-border: oklch(0.35 0.08 var(--ardo-hue-note));
+  --ardo-color-brand: oklch(0.65 0.16 170);
+  --ardo-color-brandLight: oklch(0.77 0.16 170);
+  --ardo-color-brandDark: oklch(0.57 0.18 170);
+  --ardo-color-brandSubtle: oklch(0.2 0.04 170);
+  --ardo-color-brandGradient:
+    linear-gradient(
+      135deg,
+      oklch(0.65 0.16 170) 0%,
+      oklch(0.73 0.14 200) 100%);
+  --ardo-color-bg: oklch(0.15 0.015 170);
+  --ardo-color-bgSoft: oklch(0.2 0.02 170);
+  --ardo-color-bgMute: oklch(0.28 0.02 170);
+  --ardo-color-bgAlt: oklch(0.38 0.015 170);
+  --ardo-color-text: oklch(0.93 0.008 170);
+  --ardo-color-textLight: oklch(0.7 0.015 170);
+  --ardo-color-textLighter: oklch(0.55 0.012 170);
+  --ardo-color-border: oklch(0.3 0.02 170);
+  --ardo-color-borderLight: oklch(0.38 0.015 170);
+  --ardo-color-divider: oklch(0.3 0.02 170);
+  --ardo-color-sidebarBg: oklch(0.18 0.018 170);
+  --ardo-color-sidebarBorder: oklch(0.28 0.02 170);
+  --ardo-color-codeBg: oklch(0.17 0.01 170);
+  --ardo-color-codeBorder: oklch(0.25 0.015 170);
+  --ardo-color-codeShadow: 0 1px 3px rgba(0, 0, 0, 0.2);
+  --ardo-color-shadowSm: 0 1px 2px oklch(0 0 0 / 0.12), 0 1px 3px oklch(0 0 0 / 0.15);
+  --ardo-color-shadowMd: 0 4px 6px oklch(0 0 0 / 0.12), 0 2px 4px oklch(0 0 0 / 0.08);
+  --ardo-color-shadowLg: 0 10px 25px oklch(0 0 0 / 0.2), 0 4px 10px oklch(0 0 0 / 0.12);
+  --ardo-color-tip: oklch(0.5 0.15 155);
+  --ardo-color-tipBg: oklch(0.2 0.04 155);
+  --ardo-color-tipBorder: oklch(0.35 0.1 155);
+  --ardo-color-warning: oklch(0.55 0.16 45);
+  --ardo-color-warningBg: oklch(0.22 0.05 45);
+  --ardo-color-warningBorder: oklch(0.4 0.12 45);
+  --ardo-color-danger: oklch(0.5 0.18 25);
+  --ardo-color-dangerBg: oklch(0.2 0.04 25);
+  --ardo-color-dangerBorder: oklch(0.35 0.1 25);
+  --ardo-color-info: oklch(0.5 0.14 220);
+  --ardo-color-infoBg: oklch(0.2 0.04 220);
+  --ardo-color-infoBorder: oklch(0.35 0.08 220);
+  --ardo-color-note: oklch(0.5 0.14 270);
+  --ardo-color-noteBg: oklch(0.2 0.04 270);
+  --ardo-color-noteBorder: oklch(0.35 0.08 270);
+  --ardo-layout-sidebarWidth: 280px;
+  --ardo-layout-tocWidth: 240px;
+  --ardo-layout-contentMaxWidth: 1100px;
+  --ardo-layout-headerHeight: 72px;
+  --ardo-transition-fast: 0.15s ease;
+  --ardo-transition-base: 0.2s ease;
+  --ardo-transition-slow: 0.3s ease;
+  --ardo-font-family:
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    Roboto,
+    "Helvetica Neue",
+    Arial,
+    sans-serif;
+  --ardo-font-mono:
+    ui-monospace,
+    SFMono-Regular,
+    "SF Mono",
+    Menlo,
+    Consolas,
+    "Liberation Mono",
+    monospace;
+  --ardo-radius-sm: 4px;
+  --ardo-radius-base: 8px;
+  --ardo-radius-lg: 12px;
 }
 
-/* Base */
+/* vanilla-extract-css-ns:src/ui/theme/reset.css.ts.vanilla.css?source=KiB7CiAgYm94LXNpemluZzogYm9yZGVyLWJveDsKICBtYXJnaW46IDA7CiAgcGFkZGluZzogMDsKfQpodG1sIHsKICBzY3JvbGwtcGFkZGluZy10b3A6IGNhbGModmFyKC0tYXJkby1sYXlvdXQtaGVhZGVySGVpZ2h0KSArIGVudihzYWZlLWFyZWEtaW5zZXQtdG9wKSArIDI0cHgpOwp9CmJvZHkgewogIGZvbnQtZmFtaWx5OiB2YXIoLS1hcmRvLWZvbnQtZmFtaWx5KTsKICBmb250LXNpemU6IDE2cHg7CiAgbGluZS1oZWlnaHQ6IDEuNzsKICBjb2xvcjogdmFyKC0tYXJkby1jb2xvci10ZXh0KTsKICBiYWNrZ3JvdW5kOiB2YXIoLS1hcmRvLWNvbG9yLWJnKTsKICAtd2Via2l0LWZvbnQtc21vb3RoaW5nOiBhbnRpYWxpYXNlZDsKICAtbW96LW9zeC1mb250LXNtb290aGluZzogZ3JheXNjYWxlOwp9Cjo6c2VsZWN0aW9uIHsKICBiYWNrZ3JvdW5kOiBva2xjaCgwLjQ4IDAuMTUgMTcwIC8gMC4yKTsKfQouZGFyayA6OnNlbGVjdGlvbiB7CiAgYmFja2dyb3VuZDogb2tsY2goMC42NSAwLjE2IDE3MCAvIDAuMik7Cn0KOmZvY3VzLXZpc2libGUgewogIG91dGxpbmU6IDJweCBzb2xpZCB2YXIoLS1hcmRvLWNvbG9yLWJyYW5kKTsKICBvdXRsaW5lLW9mZnNldDogMnB4Owp9CmJ1dHRvbjpmb2N1cy12aXNpYmxlLCBhOmZvY3VzLXZpc2libGUgewogIG91dGxpbmU6IDJweCBzb2xpZCB2YXIoLS1hcmRvLWNvbG9yLWJyYW5kKTsKICBvdXRsaW5lLW9mZnNldDogMnB4Owp9CkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogbm8tcHJlZmVyZW5jZSkgewogIGh0bWwgewogICAgc2Nyb2xsLWJlaGF2aW9yOiBzbW9vdGg7CiAgfQp9 */
 * {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
 }
-
 html {
-  scroll-padding-top: calc(var(--ardo-header-height) + env(safe-area-inset-top) + 24px);
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  html {
-    scroll-behavior: smooth;
-  }
+  scroll-padding-top: calc(var(--ardo-layout-headerHeight) + env(safe-area-inset-top) + 24px);
 }
-
 body {
   font-family: var(--ardo-font-family);
   font-size: 16px;
   line-height: 1.7;
-  color: var(--ardo-c-text);
-  background: var(--ardo-c-bg);
+  color: var(--ardo-color-text);
+  background: var(--ardo-color-bg);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
-
-/* Selection */
 ::selection {
-  background: oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.2);
+  background: oklch(0.48 0.15 170 / 0.2);
+}
+.dark ::selection {
+  background: oklch(0.65 0.16 170 / 0.2);
+}
+:focus-visible {
+  outline: 2px solid var(--ardo-color-brand);
+  outline-offset: 2px;
+}
+button:focus-visible,
+a:focus-visible {
+  outline: 2px solid var(--ardo-color-brand);
+  outline-offset: 2px;
+}
+@media (prefers-reduced-motion: no-preference) {
+  html {
+    scroll-behavior: smooth;
+  }
+}
+
+/* vanilla-extract-css-ns:src/ui/theme/animations.css.ts.vanilla.css?source=QGtleWZyYW1lcyBhbmltYXRpb25zX2ZhZGVJblVwX18xZmo2OHI5MCB7CiAgZnJvbSB7CiAgICBvcGFjaXR5OiAwOwogICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDIwcHgpOwogIH0KICB0byB7CiAgICBvcGFjaXR5OiAxOwogICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDApOwogIH0KfQ */
+@keyframes animations_fadeInUp__1fj68r90 {
+  from {
+    opacity: 0;
+    transform: translateY(20px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
 }
 
-/* Layout */
-.ardo-layout {
+/* vanilla-extract-css-ns:src/ui/Layout.css.ts.vanilla.css?source=LkxheW91dF9sYXlvdXRfXzhhdXRqbTAgewogIG1pbi1oZWlnaHQ6IDEwMHZoOwogIGRpc3BsYXk6IGZsZXg7CiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjsKfQouTGF5b3V0X2xheW91dENvbnRhaW5lcl9fOGF1dGptMSB7CiAgZGlzcGxheTogZmxleDsKICBmbGV4OiAxOwogIHBhZGRpbmctdG9wOiB2YXIoLS1hcmRvLWxheW91dC1oZWFkZXJIZWlnaHQpOwp9Ci5MYXlvdXRfbWFpbl9fOGF1dGptMiB7CiAgZmxleDogMTsKICBtaW4td2lkdGg6IDA7CiAgcGFkZGluZzogNDBweCAzMnB4OwogIG1hcmdpbi1sZWZ0OiB2YXIoLS1hcmRvLWxheW91dC1zaWRlYmFyV2lkdGgpOwp9Ci5MYXlvdXRfaG9tZV9fOGF1dGptMyB7CiAgbWluLWhlaWdodDogMTAwdmg7Cn0KLkxheW91dF9ob21lTWFpbl9fOGF1dGptNCB7CiAgcGFkZGluZy10b3A6IHZhcigtLWFyZG8tbGF5b3V0LWhlYWRlckhlaWdodCk7Cn0KLkxheW91dF9ob21lX184YXV0am0zIC5MYXlvdXRfbWFpbl9fOGF1dGptMiB7CiAgbWFyZ2luLWxlZnQ6IDA7CiAgcGFkZGluZzogMDsKfQouTGF5b3V0X3NraXBMaW5rX184YXV0am01IHsKICBwb3NpdGlvbjogYWJzb2x1dGU7CiAgdG9wOiAtMTAwJTsKICBsZWZ0OiAxNnB4OwogIHotaW5kZXg6IDIwMDsKICBwYWRkaW5nOiAxMnB4IDI0cHg7CiAgYmFja2dyb3VuZDogdmFyKC0tYXJkby1jb2xvci1icmFuZCk7CiAgY29sb3I6IHdoaXRlOwogIGZvbnQtd2VpZ2h0OiA2MDA7CiAgZm9udC1zaXplOiAxNHB4OwogIHRleHQtZGVjb3JhdGlvbjogbm9uZTsKICBib3JkZXItcmFkaXVzOiB2YXIoLS1hcmRvLXJhZGl1cy1iYXNlKTsKICBib3gtc2hhZG93OiB2YXIoLS1hcmRvLWNvbG9yLXNoYWRvd01kKTsKfQouTGF5b3V0X3NraXBMaW5rX184YXV0am01OmZvY3VzIHsKICB0b3A6IDE2cHg7Cn0KQG1lZGlhIChtYXgtd2lkdGg6IDEwMjRweCkgewogIC5MYXlvdXRfbWFpbl9fOGF1dGptMiB7CiAgICBtYXJnaW4tbGVmdDogMDsKICB9Cn0 */
+.Layout_layout__8autjm0 {
   min-height: 100vh;
   display: flex;
   flex-direction: column;
 }
-
-.ardo-layout-container {
+.Layout_layoutContainer__8autjm1 {
   display: flex;
   flex: 1;
-  padding-top: var(--ardo-header-height);
+  padding-top: var(--ardo-layout-headerHeight);
 }
-
-.ardo-main {
+.Layout_main__8autjm2 {
   flex: 1;
   min-width: 0;
   padding: 40px 32px;
-  margin-left: var(--ardo-sidebar-width);
+  margin-left: var(--ardo-layout-sidebarWidth);
 }
-
-/* No sidebar margin and no padding on home page */
-.ardo-home .ardo-main {
+.Layout_home__8autjm3 {
+  min-height: 100vh;
+}
+.Layout_homeMain__8autjm4 {
+  padding-top: var(--ardo-layout-headerHeight);
+}
+.Layout_home__8autjm3 .Layout_main__8autjm2 {
   margin-left: 0;
   padding: 0;
 }
+.Layout_skipLink__8autjm5 {
+  position: absolute;
+  top: -100%;
+  left: 16px;
+  z-index: 200;
+  padding: 12px 24px;
+  background: var(--ardo-color-brand);
+  color: white;
+  font-weight: 600;
+  font-size: 14px;
+  text-decoration: none;
+  border-radius: var(--ardo-radius-base);
+  box-shadow: var(--ardo-color-shadowMd);
+}
+.Layout_skipLink__8autjm5:focus {
+  top: 16px;
+}
+@media (max-width: 1024px) {
+  .Layout_main__8autjm2 {
+    margin-left: 0;
+  }
+}
 
-/* ========================================
-   Header - Prominent & Clean
-   ======================================== */
-.ardo-header {
+/* vanilla-extract-css-ns:src/ui/Header.css.ts.vanilla.css?source=#H4sIAAAAAAAAA61VTXPbNhC961fspTPipFBJ2bJl5tJpLjkkObS9Z0BiSSKCABZYSnQ6-u8d8MukRKtWJhcRAhYPD_veYlcfkQu0X4v28_Wfb-nabkL4dwFQGidJGh1DJmsU7xcAZMoYQj9SmFE3tDIv-nGB7Z-Uq3R54HbJGLfCMMWfTUWsPeZjExTAO0B9WDqeIeMWOZPaITEyZRB4rJILIXXOmkNfi_SBCU93uTWVFjGYnUqLZQQhhPAbhKvtZggR1pQsk4rQxpCoyi6jdVkH4DhVlhMuo1UbzI6Y7CSxmzYlpmau4MIcYwghKmu4K-uOTjjQCe-DX7vl9dzyusH6zqQWWMcQheH7xWmxEtzuYHVFq8sUhKto0yBC9DhNxZuIRpurRKOg4TVh9MFo4lK_UIsaakK6UvHnGDKFtSfAlcw1k4R7F0OKmtD66W-VI5k9s9RoQk0xuJKnyBKkI6IemysKw19GBvHXuPMkQ1iHZX1J7BNm1HNa38Qp52UM6_s50D89lx717nZUb6MxqjK5-ST1roe8_wHI5vYAhDUxgamxvK1fbTT6hdQoY2MY1WUzw_yGxhtkue6L3pQ8lfQ8jn5ZZhl3FFzlHxfmgLa5RQcVexOe7-njN01kL_HdwzQ7ThL-LUlhH_7QhGdGE3PyO8ad9N3UsYN5DLvHiggt84Zq_MJ8XeB-fMDeJFLhZ9TVHxWR0f05j1MZ-kyO622YM1b4V2LIdmWdT3dpZC_T4NhtS7bdwiwXsnITYdop5vbBm1iOkj2mdqF0kv9lsqlwBd8nlc1fynY77zz_ZUJaTFt_pEZVez2Yb3NWJJeoruR6Cp0ok-48wlEKKl407F2w7rJ07UaDd89yGXW1MHI0V-qtbhbodmTKL_zQ83-6oR7nBOtx-NXe-jP65iutefCef3kgeuh-_jfBST5Ob8PSdwVnlBQz0U3YXKO5961kO9f0ttOm9_R0mcGREAlofrjVohOZHFmktBise_a-z5zYita5tG0_p8XvexSSw3LPazYs-WYRNNFvao6TJtbb_zQP_viwPce-_mrNVdpptPs1k8-8d6fF6T-ae4pTKwoAAA */
+.Header_header__qjc2r50 {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
-  height: calc(var(--ardo-header-height) + env(safe-area-inset-top));
+  height: calc(var(--ardo-layout-headerHeight) + env(safe-area-inset-top));
   padding-top: env(safe-area-inset-top);
   background: oklch(1 0 0 / 0.85);
   backdrop-filter: blur(12px) saturate(1.5);
   -webkit-backdrop-filter: blur(12px) saturate(1.5);
-  box-shadow:
-    0 1px 3px oklch(0 0 0 / 0.04),
-    0 1px 2px oklch(0 0 0 / 0.02);
+  box-shadow: 0 1px 3px oklch(0 0 0 / 0.04), 0 1px 2px oklch(0 0 0 / 0.02);
   z-index: 100;
 }
-
-.dark .ardo-header {
-  background: oklch(0.15 0.02 var(--ardo-brand-h) / 0.85);
-  box-shadow:
-    0 1px 3px oklch(0 0 0 / 0.15),
-    0 1px 2px oklch(0 0 0 / 0.1);
+.dark .Header_header__qjc2r50 {
+  background: oklch(0.15 0.02 170 / 0.85);
+  box-shadow: 0 1px 3px oklch(0 0 0 / 0.15), 0 1px 2px oklch(0 0 0 / 0.1);
 }
-
-.ardo-header-container {
+.Header_headerContainer__qjc2r51 {
   display: flex;
   align-items: center;
   justify-content: space-between;
   height: 100%;
-  padding: 0 32px 0 20px; /* Left padding matches sidebar padding for alignment */
+  padding: 0 32px 0 20px;
 }
-
-.ardo-header-left {
+.Header_headerLeft__qjc2r52 {
   display: flex;
   align-items: center;
   gap: 24px;
 }
-
-.ardo-logo-link {
+.Header_headerRight__qjc2r53 {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+.Header_logoLink__qjc2r54 {
   display: flex;
   align-items: center;
   gap: 10px;
   text-decoration: none;
-  color: var(--ardo-c-text);
+  color: var(--ardo-color-text);
   transition: opacity var(--ardo-transition-fast);
 }
-
-.ardo-logo-link:hover {
+.Header_logoLink__qjc2r54:hover {
   opacity: 0.8;
 }
-
-.ardo-logo {
+.Header_logo__qjc2r55 {
   height: 36px;
 }
-
-.ardo-site-title {
+.Header_siteTitle__qjc2r56 {
   font-size: 20px;
   font-weight: 700;
   letter-spacing: -0.02em;
 }
-
-/* Nav - with underline indicator */
-.ardo-nav {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.ardo-desktop-nav {
-  display: flex;
-  align-items: center;
-}
-
-.ardo-nav-link {
-  position: relative;
-  color: var(--ardo-c-text-light);
-  text-decoration: none;
-  font-size: 14px;
-  font-weight: 500;
-  padding: 8px 14px;
-  border-radius: var(--ardo-radius-sm);
-  transition: all var(--ardo-transition-fast);
-}
-
-.ardo-nav-link::after {
-  content: "";
-  position: absolute;
-  bottom: 0;
-  left: 50%;
-  transform: translateX(-50%);
-  width: 0;
-  height: 2px;
-  background: var(--ardo-c-brand);
-  border-radius: 1px;
-  transition: width var(--ardo-transition);
-}
-
-.ardo-nav-link:hover {
-  color: var(--ardo-c-text);
-  background: var(--ardo-c-bg-soft);
-}
-
-.ardo-nav-link.active {
-  color: var(--ardo-c-brand);
-}
-
-.ardo-nav-link.active::after {
-  width: calc(100% - 28px);
-}
-
-.ardo-header-right {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-}
-
-.ardo-social-link {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 40px;
-  height: 40px;
-  color: var(--ardo-c-text-light);
-  border-radius: var(--ardo-radius);
-  transition: all var(--ardo-transition-fast);
-}
-
-.ardo-social-link:hover {
-  color: var(--ardo-c-text);
-  background: var(--ardo-c-bg-soft);
-}
-
-/* Mobile menu */
-.ardo-mobile-menu-button {
+.Header_mobileMenuButton__qjc2r57 {
   display: none;
   background: none;
   border: none;
@@ -377,364 +307,433 @@ body {
   padding: 8px;
   border-radius: var(--ardo-radius-sm);
 }
-
-.ardo-mobile-menu-button:hover {
-  background: var(--ardo-c-bg-soft);
+.Header_mobileMenuButton__qjc2r57:hover {
+  background: var(--ardo-color-bgSoft);
 }
-
-.ardo-hamburger {
+.Header_hamburger__qjc2r58 {
   display: flex;
   flex-direction: column;
   gap: 5px;
 }
-
-.ardo-hamburger span {
+.Header_hamburger__qjc2r58 span {
   display: block;
   width: 20px;
   height: 2px;
-  background: var(--ardo-c-text);
+  background: var(--ardo-color-text);
   border-radius: 1px;
   transition: all var(--ardo-transition-fast);
 }
-
-.ardo-mobile-top-nav {
-  display: none;
-}
-
-.ardo-mobile-top-nav-inner {
-  overflow-x: auto;
-  -webkit-overflow-scrolling: touch;
-  scrollbar-width: thin;
-}
-
-.ardo-mobile-top-nav-inner .ardo-nav {
-  width: max-content;
-  min-width: 100%;
+.Header_desktopNav__qjc2r59 {
+  display: flex;
+  align-items: center;
 }
-
-.ardo-mobile-menu {
+.Header_mobileMenu__qjc2r5a {
   position: fixed;
-  top: calc(var(--ardo-header-height) + env(safe-area-inset-top));
+  top: calc(var(--ardo-layout-headerHeight) + env(safe-area-inset-top));
   left: 0;
   right: 0;
   padding: 12px 16px 16px;
-  background: var(--ardo-c-bg);
-  border-top: 1px solid var(--ardo-c-border);
+  background: var(--ardo-color-bg);
+  border-top: 1px solid var(--ardo-color-border);
   box-shadow: 0 14px 28px oklch(0 0 0 / 0.08);
   z-index: 99;
 }
-
-.ardo-mobile-menu-section + .ardo-mobile-menu-section {
-  margin-top: 12px;
-  padding-top: 12px;
-  border-top: 1px solid var(--ardo-c-border);
-}
-
-.ardo-mobile-menu .ardo-sidebar {
-  position: static;
-  top: auto;
-  left: auto;
-  width: auto;
-  height: auto;
-  padding: 0;
-  overflow-y: visible;
-  box-shadow: none;
-  background: transparent;
-  display: block;
+.Header_mobileNav__qjc2r5b nav {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 4px;
 }
-
-.ardo-mobile-menu .ardo-sidebar-text {
-  font-size: 11px;
+.Header_mobileNav__qjc2r5b a {
+  width: 100%;
 }
-
 @media (max-width: 1024px) {
-  .ardo-layout > .ardo-header-with-mobile-top-nav + .ardo-layout-container {
-    padding-top: calc(var(--ardo-header-height) + 44px);
-  }
-
-  .ardo-header {
-    z-index: 110;
+  .Header_headerContainer__qjc2r51 {
+    padding: 0 20px;
   }
-
-  .ardo-mobile-menu-button {
+}
+@media (max-width: 768px) {
+  .Header_mobileMenuButton__qjc2r57 {
     display: block;
   }
-
-  .ardo-desktop-nav {
+  .Header_desktopNav__qjc2r59 {
     display: none;
   }
+}
 
-  .ardo-mobile-top-nav {
-    display: block;
-    position: fixed;
-    top: calc(var(--ardo-header-height) + env(safe-area-inset-top));
-    left: 0;
-    right: 0;
-    padding: 6px 20px;
-    background: var(--ardo-c-bg);
-    border-top: 1px solid var(--ardo-c-border);
-    border-bottom: 1px solid var(--ardo-c-border);
-    z-index: 108;
-  }
-
-  .ardo-header-with-mobile-top-nav .ardo-mobile-menu {
-    top: calc(var(--ardo-header-height) + env(safe-area-inset-top) + 44px);
-    z-index: 109;
-  }
+/* vanilla-extract-css-ns:src/ui/Nav.css.ts.vanilla.css?source=#H4sIAAAAAAAAA7VTTW8iMQy98yuiSkhwCBpQkVD4C9VeeukNmcQzkxLiUWKm0131v1eT-YBKQLsr7S1x7Ofn95zFL6h3HurdbrMu_QEz8WcihLGxcvCuRO6w2U6EAGcLLy3jMSqh0TOGNlxApcSmaraTj8miR3qy_jCgLRNaRdGyJa9EQAdsa2xrNTkKStQQZlJCMCRTRDI2_GSLkudtVnuTBjUF6CA8-VSek2cZ7W9UYvlYNWPoDdtaJdZZ1sYqMMb6IrEcE_cUDAYZwNhT_EKhC8l47JoH8AN1cO4y8fwkc4gt1xsKKAU5Y0hCaPKMnpV4eNh-0QX2kdyJsSPHTEclEn2HeZplOtLJKRxVd3TA-DKT62ya2L5Zw2VfV_YqrPqBQR-KQCdvrgi-D-DN_Iouy674UoXU44YOe4h4R4eS6lGG287Pv6dbPFN-R_AF6HbF7nYaRr4PcWldL64Gp2fLLJsKKVabqjljRNIW3CXM6q--0uspss3f5bgj56e-92PW-TF4O9x_9pG-3fnevn_b-ivT_wfDPwF8WfSjrQQAAA */
+.Nav_nav__85hnke0 {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.Nav_navLink__85hnke1 {
+  position: relative;
+  color: var(--ardo-color-textLight);
+  text-decoration: none;
+  font-size: 14px;
+  font-weight: 500;
+  padding: 8px 14px;
+  border-radius: var(--ardo-radius-sm);
+  transition: all var(--ardo-transition-fast);
+}
+.Nav_navLink__85hnke1::after {
+  content: "";
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 0;
+  height: 2px;
+  background: var(--ardo-color-brand);
+  border-radius: 1px;
+  transition: width var(--ardo-transition-base);
+}
+.Nav_navLink__85hnke1:hover {
+  color: var(--ardo-color-text);
+  background: var(--ardo-color-bgSoft);
+}
+.Nav_navLink__85hnke1.active {
+  color: var(--ardo-color-brand);
+}
+.Nav_navLink__85hnke1.active::after {
+  width: calc(100% - 28px);
+}
+.Nav_socialLink__85hnke2 {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  color: var(--ardo-color-textLight);
+  border-radius: var(--ardo-radius-base);
+  transition: all var(--ardo-transition-fast);
+}
+.Nav_socialLink__85hnke2:hover {
+  color: var(--ardo-color-text);
+  background: var(--ardo-color-bgSoft);
 }
 
-/* ========================================
-   Sidebar - Clean with subtle interactions
-   ======================================== */
-.ardo-sidebar {
+/* vanilla-extract-css-ns:src/ui/Sidebar.css.ts.vanilla.css?source=#H4sIAAAAAAAAA71Wu27bMBTd_RVEgQLOQJeyY6dllqJdUiCdUqBjQIlXEmuKFEjKllvk3wtSj0iRazsdAg-yrnhf555DcvEgOMTMPNr2-RiR9c2BK4L-zBAqtRVOaEVRKmrgtzOEnC4p2jEzx5gZrrFkB105nAPjYO5AZLm78uskpI4i4v_uBXf5Mac26U__PTjlwZ-ihMlkHhGyyxE-lyw4loxzoTKKltdljZakrL1V78CkUu_xgSJWOe1tsa6xzRnXe4qiskYErcoa6a1M8jlB_vcBkQVZhbAxS7aZ0ZXio_ITLbXpqv-SXd3OnmYLzswWLU7jeVnyqAn4ItS9sK4PF4VwUliHrTtIoEhpBf9yi3q_VfArmMmEws2IomUDVmsM8900phbVFwtjbTiYzljWyGop-BSfZt19y4hpZd8cFHdhkn1561AeF7aU7EBRKiFkZFJkCgsHhaUoAeXAePOvyjqRHnCilQPlKLIlSwDH4PYA6jgYatsn24yTxVIn2xGXNmWNIjJEh6Kln5o3hB6PsMJB7e57Ffg3zCHRhjU6asaEUKqV5_9voCi6HuFqGBeVHUVuTNgWTUzDVCdLJuVw4fMnnDJ7HPYxBjT3IglInOrovBri7Hvl4IKMC5Y4sYOTKWPDFL8gp1_2UMVOwlUP6r7dQ9aETNi6OsHWPuWY9Td-ONOefkD9rMabV9E2YxOFjbl2llpgLiBXh8OmwWFIuFbIwT9QJtWmoKgqSzAJs9Ds386BwV5SoUCyIGso3pCnY4QpjSHVpqNNK_h37wbny7rpqjtD1kdVtSbvL6NVaEH77t3Bd78OIErwG7gRahvOtrNVX6yuc5Feo5pprK9aSlZa6ON9bI6jAQoddxq8nt-TylifrdSiI_CQtK_h6xsRZ9rsYAyX7WH_Ma5p1kXSmnjIPBCa0Y45mONPhENze_hcABcMzQtW45bOEfF3mavge-ZaMdh7urE9zZ7-AmuRysfcCQAA */
+.Sidebar_sidebar__1057ydn0 {
   position: fixed;
-  top: var(--ardo-header-height);
+  top: var(--ardo-layout-headerHeight);
   left: 0;
-  width: var(--ardo-sidebar-width);
-  height: calc(100vh - var(--ardo-header-height));
+  width: var(--ardo-layout-sidebarWidth);
+  height: calc(100vh - var(--ardo-layout-headerHeight));
   padding: 24px 20px;
   overflow-y: auto;
   box-shadow: 1px 0 3px oklch(0 0 0 / 0.03);
-  background: var(--ardo-sidebar-bg);
+  background: var(--ardo-color-sidebarBg);
 }
-
-.ardo-sidebar-list {
-  list-style: none;
+.dark .Sidebar_sidebar__1057ydn0 {
+  box-shadow: 1px 0 3px oklch(0 0 0 / 0.1);
 }
-
-.ardo-sidebar-list-0 > .ardo-sidebar-item {
-  margin-bottom: 20px;
+.Sidebar_sidebarList__1057ydn1 {
+  list-style: none;
 }
-
-.ardo-sidebar-list-1 {
+.Sidebar_sidebarList1__1057ydn3 {
   margin-left: 12px;
   margin-top: 6px;
   padding-left: 12px;
-  border-left: 1px solid var(--ardo-c-border-light);
+  border-left: 1px solid var(--ardo-color-borderLight);
 }
-
-.ardo-sidebar-item-header {
+.Sidebar_sidebarItemHeader__1057ydn5 {
   display: flex;
   align-items: center;
   justify-content: space-between;
 }
-
-.ardo-sidebar-link,
-.ardo-sidebar-text {
+.Sidebar_sidebarLink__1057ydn6 {
   display: block;
   padding: 6px 10px;
   margin: 2px 0;
-  color: var(--ardo-c-text-light);
+  color: var(--ardo-color-textLight);
   text-decoration: none;
   font-size: 14px;
   border-radius: var(--ardo-radius-sm);
   transition: all var(--ardo-transition-fast);
 }
-
-.ardo-sidebar-link:hover {
-  color: var(--ardo-c-text);
-  background: var(--ardo-c-bg-mute);
+.Sidebar_sidebarLink__1057ydn6:hover {
+  color: var(--ardo-color-text);
+  background: var(--ardo-color-bgMute);
 }
-
-.ardo-sidebar-link.active {
-  color: var(--ardo-c-brand);
-  background: var(--ardo-c-brand-subtle);
+.Sidebar_sidebarLink__1057ydn6.active {
+  color: var(--ardo-color-brand);
+  background: var(--ardo-color-brandSubtle);
   font-weight: 500;
-  border-left: 3px solid var(--ardo-c-brand);
+  border-left: 3px solid var(--ardo-color-brand);
   padding-left: 7px;
 }
-
-.ardo-sidebar-text {
-  cursor: pointer;
-  font-weight: 600;
-  font-size: 12px;
-  text-transform: uppercase;
-  letter-spacing: 0.05em;
-  color: var(--ardo-c-text-lighter);
-  padding: 6px 10px;
+.Sidebar_sidebarText__1057ydn7 {
   display: flex;
   align-items: center;
   gap: 6px;
-}
-
-/* When a sidebar group title is also a link */
-a.ardo-sidebar-text {
+  padding: 6px 10px;
+  color: var(--ardo-color-textLighter);
   text-decoration: none;
+  font-weight: 600;
+  font-size: 12px;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
   border-radius: var(--ardo-radius-sm);
   transition: all var(--ardo-transition-fast);
 }
-
-a.ardo-sidebar-text:hover {
-  color: var(--ardo-c-text);
-}
-
-a.ardo-sidebar-text.active {
-  color: var(--ardo-c-brand);
-}
-
-.ardo-sidebar-text::before {
+.Sidebar_sidebarText__1057ydn7::before {
   content: "";
   width: 5px;
   height: 5px;
   border-radius: 50%;
-  background: var(--ardo-c-brand);
+  background: var(--ardo-color-brand);
   opacity: 0.5;
   flex-shrink: 0;
 }
-
-.ardo-sidebar-text:hover {
-  color: var(--ardo-c-text);
+.Sidebar_sidebarText__1057ydn7:hover {
+  color: var(--ardo-color-text);
 }
-
-.ardo-sidebar-collapse {
+.Sidebar_sidebarText__1057ydn7.active {
+  color: var(--ardo-color-brand);
+}
+.Sidebar_sidebarCollapse__1057ydn8 {
   background: none;
   border: none;
   cursor: pointer;
   padding: 6px;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
   border-radius: var(--ardo-radius-sm);
   transition: all var(--ardo-transition-fast);
 }
-
-.ardo-sidebar-collapse:hover {
-  background: var(--ardo-c-bg-mute);
-  color: var(--ardo-c-text);
+.Sidebar_sidebarCollapse__1057ydn8:hover {
+  background: var(--ardo-color-bgMute);
+  color: var(--ardo-color-text);
 }
-
-.ardo-sidebar-collapse.collapsed {
+.Sidebar_sidebarCollapse__1057ydn8.collapsed {
   transform: rotate(-90deg);
 }
-
-.dark .ardo-sidebar {
-  box-shadow: 1px 0 3px oklch(0 0 0 / 0.1);
-}
-
 @media (max-width: 1024px) {
-  .ardo-header-container {
-    padding: 0 20px; /* Symmetric padding on mobile (no sidebar to align with) */
-  }
-
-  .ardo-sidebar {
+  .Sidebar_sidebar__1057ydn0 {
     display: none;
   }
-
-  .ardo-main {
-    margin-left: 0;
-  }
 }
 
-/* ========================================
-   TOC - Table of Contents
-   ======================================== */
-.ardo-toc {
+/* vanilla-extract-css-ns:src/ui/TOC.css.ts.vanilla.css?source=#H4sIAAAAAAAAA41UwW7iMBC98xU-wsEoCbRi3ctKvfRQaS-V9ohMPCEWjseyBwi74t9XtlNKdinbWzTznt-b53Hmbz-e14T1el2S3-G3omC_J4w5DJo0WsEa3YN6mjBG6AQ7SD_lXHqF3MgT7om3IBX4F9DblmYR5-OXYEX8PmpF7S0WYf0z9hKjhUyppamnZVEcWsb_p5SITiql7Vawaul6VhWuj1U8gG8MHvlJMLknfJqcJ_NhzDdNBi6zlmnWBi3xoH-BYGWZj0il42DrsUizEPTEyUsbGvSdYHvnwNcyQGwaIALPg5N1MlTMixV0sVOjQT-KIFV4PO41CoBPs3TSb7XlGyTCTrDyMTr5MP6qA118V8m30YF4oJMBwSxaGMPt7gJfJLjSwRl5EmxjsN6N4ntwfb6vocINNCRYucxpfHWElJCCGr3Mu5NdjRNe5DM36BX4QahyPQtotGIpXyc9WLoKJaP4u58EGtZTGnNt7KPFGxniQn6WiWjjnqRk7s03-8ss_wycMXcE57ImfYC7ihsvrfq65IAeKy4uksv8lEd3Wv2zV3a3vDAebjAWq8z43oHSkk072fPhXZfVqnD9LJHmt38kV3v3vg3nyfkPdv0voXYEAAA */
+.TOC_toc__1trko900 {
   position: fixed;
-  top: var(--ardo-header-height);
+  top: var(--ardo-layout-headerHeight);
   right: 0;
-  width: var(--ardo-toc-width);
-  height: calc(100vh - var(--ardo-header-height));
+  width: var(--ardo-layout-tocWidth);
+  height: calc(100vh - var(--ardo-layout-headerHeight));
   padding: 24px 20px;
   overflow-y: auto;
 }
-
-.ardo-toc-title {
+.TOC_tocTitle__1trko901 {
   font-size: 11px;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.08em;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
   margin-bottom: 16px;
 }
-
-.ardo-toc-list {
+.TOC_tocList__1trko902 {
   list-style: none;
 }
-
-.ardo-toc-link {
+.TOC_tocLink__1trko903 {
   display: block;
   padding: 5px 0;
   padding-left: 14px;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
   text-decoration: none;
   font-size: 13px;
   border-left: 2px solid transparent;
   margin-left: -14px;
   transition: all var(--ardo-transition-fast);
 }
-
-.ardo-toc-link:hover {
-  color: var(--ardo-c-text);
-  border-left-color: var(--ardo-c-border);
+.TOC_tocLink__1trko903:hover {
+  color: var(--ardo-color-text);
+  border-left-color: var(--ardo-color-border);
 }
-
-.ardo-toc-link.active {
-  color: var(--ardo-c-brand);
-  border-left-color: var(--ardo-c-brand);
+.TOC_tocLink__1trko903.active {
+  color: var(--ardo-color-brand);
+  border-left-color: var(--ardo-color-brand);
 }
-
-.ardo-toc-link-3 {
+.TOC_tocLink3__1trko904 {
   padding-left: 26px;
 }
-
-.ardo-toc-link-4 {
+.TOC_tocLink4__1trko905 {
   padding-left: 38px;
 }
-
 @media (max-width: 1280px) {
-  .ardo-toc {
+  .TOC_toc__1trko900 {
     display: none;
   }
 }
 
-/* ========================================
-   Content Area
-   ======================================== */
-.ardo-doc-page {
+/* vanilla-extract-css-ns:src/ui/Footer.css.ts.vanilla.css?source=#H4sIAAAAAAAAA61WTW_bOBC9-1fMJYAFlF7KsfPBXBZdoKdmUSC99FRQ4ljmmiK5FB3bXeS_L0jJsmQpgdsGRvxBijNv5r15zOyTMR7d91X98T29uf-X0ozCfxMAy4WQumBwPbd7mC_s_mEC4HHvCVey0Axy1B5dWM3MnlRrLsyOAQWS2j1c2z2YjcrXUwrh9QfQGb1O4tM83xTObLVgoKRG7kjhuJCo_TS9owKLD_DM3ZQQ7oQhuVHGkaxIgF59OMac3d-GgCmktzSBlNKr5GHyMpkJ7jYwe6uuC7Gm7wc1vYtQl-dYeyi_OFlyd2jBphGskJVV_MBgpTD2P7aeSI9l1SXgn23l5epAcqM9at_dKrhlQMO3EIPsXPgd3uOS0Z5U8gcySBuGYw1sWFVg_rMs1j42puSukJpkxntTMrgJZ89LekLLHffmxMC8X5TUoackUybfhKA7KfyaQQNkjSFb-zMzTqAjofvbisGSXp0T9DpkdB3QgfZ0Xgd9RudlztVR0qUUQuGwlM9Sb9oqrmMVr_Upc1yLpJ0Vgblx3EujGWijMW44ritZrxnLc-kP3TinbbLilR8RSx8OW5tndBFUE40Bnd0Njz1iVfEC25OLeOZXNBAbeh7-L2MPLuy2CZbvm-DjVirxVZanCm4GCeY_k6DVsTd2IOJmlj71TeQ2Zuwdo3XKxjDrxXlftXEtWE1llBQjoomPJSPpH9HzNvnduCkMpr-yPEeSod8h6jds42yKj6DfgTAU0vdUev-7QxNB7RpPWFL6m4M0BHjBGFmHz3_j_iRw3iekcFJEz3VSEI-lVdxjKHFb6opBunLhr3Xl9Exxx_AB10denWSejfMeDV1Ih3ndgjrRQ_fyDilgTrtivEyIA8PtPFovkYxX-DZn3bt2kKreeCqTcya5Uq-w2GS8pGMdNptCGu0db-VFuJXrSzle-IvBhT-u0qdt5hUmF5b3KHp4dYO1xSkiwu5_VdFBR2vkGar2IL7mfGNzcqkbRhyx3yvjSgZba9HlvIpkKvQeHQneEqVFZ3SJ5YiNLMZV_VV6dSJodcJ_BHvzNtijR7xM_ixRSA7TSDGD-JHEeD-li0Z1danxaxjXb1Myt_vYjpfJy_8ztN0aIwsAAA */
+.Footer_footer__169q00b0 {
+  padding: 32px 24px;
+  text-align: center;
+  box-shadow: 0 -1px 3px oklch(0 0 0 / 0.03);
+  background:
+    linear-gradient(
+      180deg,
+      var(--ardo-color-bg) 0%,
+      oklch(0.97 0.01 170) 100%);
+}
+.dark .Footer_footer__169q00b0 {
+  box-shadow: 0 -1px 3px oklch(0 0 0 / 0.1);
+  background:
+    linear-gradient(
+      180deg,
+      var(--ardo-color-bg) 0%,
+      oklch(0.18 0.015 170) 100%);
+}
+.Footer_footerPrimary__169q00b1 {
   display: flex;
-  max-width: calc(var(--ardo-content-max-width) + var(--ardo-toc-width));
-  margin: 0 auto;
-  padding-left: var(--ardo-sidebar-width);
+  align-items: center;
+  justify-content: center;
+  gap: 0;
+  flex-wrap: wrap;
+  font-size: 14px;
+  color: var(--ardo-color-textLight);
+  margin-bottom: 6px;
 }
-
-.ardo-content-container {
-  flex: 1;
-  max-width: var(--ardo-content-max-width);
-  padding: 0 24px;
-  padding-right: calc(var(--ardo-toc-width) + 24px);
+.Footer_footerSeparator__169q00b2 {
+  display: inline-block;
+  width: 4px;
+  height: 4px;
+  border-radius: 50%;
+  background: var(--ardo-color-textLighter);
+  margin: 0 12px;
+  vertical-align: middle;
 }
-
-@media (max-width: 1280px) {
-  .ardo-content-container {
-    padding-right: 24px;
+.Footer_footerLink__169q00b3 {
+  color: var(--ardo-color-brand);
+  text-decoration: none;
+  transition: opacity var(--ardo-transition-fast);
+}
+.Footer_footerLink__169q00b3:hover {
+  opacity: 0.8;
+}
+.Footer_footerMessage__169q00b4 {
+  font-size: 14px;
+  color: var(--ardo-color-textLighter);
+}
+.Footer_footerCopyright__169q00b5 {
+  font-size: 14px;
+  color: var(--ardo-color-textLighter);
+}
+.Footer_footerBuildTime__169q00b6 {
+  font-size: 12px;
+  color: var(--ardo-color-textLighter);
+  margin-top: 6px;
+}
+.Footer_contentFooter__169q00b7 {
+  margin-top: 60px;
+  padding-top: 24px;
+  border-top: 1px solid var(--ardo-color-border);
+}
+.Footer_contentMeta__169q00b8 {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 24px;
+  font-size: 14px;
+  color: var(--ardo-color-textLighter);
+}
+.Footer_editLink__169q00b9 {
+  color: var(--ardo-color-brand);
+  text-decoration: none;
+  font-weight: 500;
+  transition: opacity var(--ardo-transition-fast);
+}
+.Footer_editLink__169q00b9:hover {
+  opacity: 0.8;
+}
+.Footer_prevNext__169q00ba {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 16px;
+}
+.Footer_prevNextLinkBase__169q00bb {
+  display: flex;
+  flex-direction: column;
+  padding: 16px 20px;
+  border: 1px solid var(--ardo-color-border);
+  border-radius: var(--ardo-radius-base);
+  text-decoration: none;
+  box-shadow: var(--ardo-color-shadowSm);
+  transition: all var(--ardo-transition-base);
+}
+.Footer_prevNextLinkBase__169q00bb:hover {
+  border-color: oklch(0.48 0.15 170 / 0.4);
+  background: var(--ardo-color-brandSubtle);
+  box-shadow: var(--ardo-color-shadowMd);
+}
+.Footer_nextLink__169q00bd {
+  text-align: right;
+}
+.Footer_prevNextLabel__169q00be {
+  font-size: 12px;
+  font-weight: 500;
+  color: var(--ardo-color-textLighter);
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  margin-bottom: 4px;
+}
+.Footer_prevNextTitle__169q00bf {
+  font-weight: 600;
+  color: var(--ardo-color-brand);
+}
+@media (hover: hover) {
+  .Footer_prevNextLinkBase__169q00bb:hover {
+    transform: translateY(-2px);
   }
 }
 
-.ardo-content-header {
+/* vanilla-extract-css-ns:src/ui/DocPage.css.ts.vanilla.css?source=#H4sIAAAAAAAAA4WTP0_DMBDF93yKG1shR3YoUKULAgYGkBiQGJEbX1sjx46cA1JQvzuy04bQBJgivdyf37u8pDeueJBrfFb757NYiXL24jl8JgBK15WR2xxWBptFAlDKhr1rRZscCmmKyZv0E8akV44ZuXWvxApnCS3dy-Yp1E3hBIZF5Ir27bQd6tfa5sBBvpILSiWV0nbNDK4oH-mvtcKl9O2MRbJL0oOP_fprZ0lqi74zJKKh4CMHcWTlfxc9qMCZzaqmz-n1ekO_nqRzCyexc5T4FqXq4WYRt70MWzoiV-Yw4z_XHvQDztJ5hb6TRdVA7YxWfYOFMy6UhMpRkEdN5jsHp-3ZnA1H_8AcTs_bXVF6x9b4BedBM9oi2-w1kWZRQyL0rK5kEY_HeMozLBdDdyILk4dAN1gXXlekne2wZsdYYt5iRXv50DBhQ3cBbDoCej629sqpbbfvLO47ars4C32XJSotYdLLk-DxM8ee9O8_7Djr8Y67X8Zmcz4Y-0_gBxk9ZGWX7L4A44Kfbv0DAAA */
+.DocPage_docPage__1f1m4jr0 {
+  display: flex;
+  max-width: calc(var(--ardo-layout-contentMaxWidth) + var(--ardo-layout-tocWidth));
+  margin: 0 auto;
+  padding-left: var(--ardo-layout-sidebarWidth);
+}
+.DocPage_contentContainer__1f1m4jr1 {
+  flex: 1;
+  max-width: var(--ardo-layout-contentMaxWidth);
+  padding: 0 24px;
+  padding-right: calc(var(--ardo-layout-tocWidth) + 24px);
+}
+.DocPage_contentHeader__1f1m4jr2 {
   margin-bottom: 40px;
   padding-bottom: 24px;
-  border-bottom: 1px solid var(--ardo-c-border);
+  border-bottom: 1px solid var(--ardo-color-border);
 }
-
-.ardo-content-title {
+.DocPage_contentTitle__1f1m4jr3 {
   font-size: 36px;
   font-weight: 700;
   line-height: 1.2;
   letter-spacing: -0.02em;
   margin-bottom: 12px;
 }
-
-.ardo-content-description {
+.DocPage_contentDescription__1f1m4jr4 {
   font-size: 18px;
-  color: var(--ardo-c-text-light);
+  color: var(--ardo-color-textLight);
   line-height: 1.6;
 }
-
-.ardo-content-body {
+.DocPage_contentBody__1f1m4jr5 {
   line-height: 1.75;
 }
+@media (max-width: 1024px) {
+  .DocPage_docPage__1f1m4jr0 {
+    padding-left: 0;
+  }
+}
+@media (max-width: 1280px) {
+  .DocPage_contentContainer__1f1m4jr1 {
+    padding-right: 24px;
+  }
+}
 
-/* ========================================
-   Typography in Content
-   ======================================== */
+/* vanilla-extract-css-ns:src/ui/content.css.ts.vanilla.css?source=#H4sIAAAAAAAAA5VV246bMBB9z1eMKlXaSDU1l5DI-YW-9QscbMCKsalxskmr_fcKcICA2cvb7tnZmXNmzsEBNUyjTCvLlYUy_AHBMxItkHiBJAtkt0BS-LcByLWy6JWLorQEUoyPGwApFEelw8IgbrGKmkIoZHVNIMH1bYKdtLW6IhCmPSy5tdygpqaZUAUBhAMc8uq4edvMKIQjhUb85QTiqG2xqIvmdVHSj6opY0IVIwXH7KQN42aAlVa8K9eNsEIrAoZLasWVr_GNvHwjQmhuuenoOJTAt29tFyaaWtI7gZPU2blFXgWzJYHk0HN6LDR2FGl2Loy-KEbgSs0LQm6W1AadDFVsO1FiKBOXhkD0tPnuGr3mBdd4sTN_XTKvC_e-urorW7l4RW_Iqd3jrFz-N3Ubk9q8q9bym0WMZ9rQ_k4Xxbhp_ej5K3L99Flm5QsOkgPgINxBuMfwE3AQjy2HNkjnecPHK1hD1cMT3vZTtmMxymljtx6dpNRX548Vtqvq3zYBo-YMvs19oDzdtcrTJ-Vzahc5_wJo-d5NH9GSPLdj4D68tBS-pgefpaQgpKLmPOTJv59W-682Otx4ZHVp-3PRlk_m9mYHPNHRC3MhGGLVi0vqGzRaCjaz0qFd6PbjsBa_dW59acXT4h5EJ9rw7SreUe7DaO-SExCWSpEdP7Mfz3ZK87SVZNhKT3T8Mjri_QdlWMdSalfmGWTpSfYXcO4IMf5-9B7Ejcq0lLRuOIHHT8fZdyjxmcaWcxtb1s0d7xzVt8HFD52f0eRiRqUoFIHWGr7x3bDP-sH3uk4lxl6JJ83uYA1RtkRZKSR74Veutl-YPG8pqsIZYYjv40Azy64Y86u7nBPINOPjQ5PTSsj707AOr7TS29mOcHDY79rXeHLiuL5BunxG1x4CnPrCuVTaVCs61xqHHqW14aPagTGec30O3uP3t_-ovNIa_gkAAA */
 .ardo-content h1,
 .ardo-content h2,
 .ardo-content h3,
@@ -747,7 +746,6 @@ a.ardo-sidebar-text.active {
   margin-bottom: 16px;
   letter-spacing: -0.01em;
 }
-
 .ardo-content h1 {
   font-size: 32px;
 }
@@ -758,13 +756,12 @@ a.ardo-sidebar-text.active {
   position: relative;
   letter-spacing: -0.02em;
 }
-
 .ardo-content h2::after {
   content: "";
   display: block;
   width: 48px;
   height: 3px;
-  background: var(--ardo-c-brand);
+  background: var(--ardo-color-brand);
   border-radius: 2px;
   margin-top: 10px;
 }
@@ -774,274 +771,199 @@ a.ardo-sidebar-text.active {
 .ardo-content h4 {
   font-size: 17px;
 }
-
 .ardo-content p {
   margin-bottom: 16px;
   max-width: 70ch;
 }
-
 .ardo-content a {
-  color: var(--ardo-c-brand);
+  color: var(--ardo-color-brand);
   text-decoration: underline;
-  text-decoration-color: oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.3);
+  text-decoration-color: oklch(0.48 0.15 170 / 0.3);
   text-underline-offset: 3px;
   transition: text-decoration-color var(--ardo-transition-fast);
 }
-
 .ardo-content a:hover {
-  text-decoration-color: var(--ardo-c-brand);
+  text-decoration-color: var(--ardo-color-brand);
+}
+.dark .ardo-content a {
+  text-decoration-color: oklch(0.65 0.16 170 / 0.3);
 }
-
 .ardo-content ul,
 .ardo-content ol {
   margin-bottom: 16px;
   padding-left: 24px;
   max-width: 70ch;
 }
-
 .ardo-content li {
   margin-bottom: 8px;
 }
-
 .ardo-content li::marker {
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
 }
-
 .ardo-content blockquote {
   margin: 20px 0;
   padding: 16px 20px;
-  border-left: 4px solid
-    oklch(var(--ardo-brand-l) calc(var(--ardo-brand-c) + 0.03) var(--ardo-brand-h));
-  background: var(--ardo-c-bg-soft);
-  border-radius: 0 var(--ardo-radius) var(--ardo-radius) 0;
+  border-left: 4px solid oklch(0.48 0.18 170);
+  background: var(--ardo-color-bgSoft);
+  border-radius: 0 var(--ardo-radius-base) var(--ardo-radius-base) 0;
   font-style: italic;
-  color: var(--ardo-c-text-light);
+  color: var(--ardo-color-textLight);
 }
-
 .ardo-content hr {
   margin: 40px 0;
   border: none;
-  border-top: 1px solid var(--ardo-c-border);
+  border-top: 1px solid var(--ardo-color-border);
 }
-
 .ardo-content table {
   width: 100%;
   margin: 20px 0;
   border-collapse: collapse;
   font-size: 14px;
 }
-
 .ardo-content th,
 .ardo-content td {
   padding: 12px 16px;
-  border: 1px solid var(--ardo-c-border);
+  border: 1px solid var(--ardo-color-border);
   text-align: left;
 }
-
 .ardo-content th {
-  background: var(--ardo-c-bg-soft);
+  background: var(--ardo-color-bgSoft);
   font-weight: 600;
   font-size: 13px;
 }
-
 .ardo-content tbody tr:nth-child(even) {
-  background: var(--ardo-c-bg-soft);
+  background: var(--ardo-color-bgSoft);
 }
-
 .ardo-content img {
   max-width: 100%;
-  border-radius: var(--ardo-radius);
-  border: 1px solid var(--ardo-c-border);
+  border-radius: var(--ardo-radius-base);
+  border: 1px solid var(--ardo-color-border);
 }
-
-/* Inline code */
 .ardo-content code {
   font-family: var(--ardo-font-mono);
   font-size: 0.875em;
   padding: 3px 6px;
-  background: oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.06);
+  background: oklch(0.48 0.15 170 / 0.06);
   border-radius: var(--ardo-radius-sm);
-  border: 1px solid oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.1);
+  border: 1px solid oklch(0.48 0.15 170 / 0.1);
 }
-
 .ardo-content pre code {
   padding: 0;
   background: none;
   border: none;
 }
 
-/* ========================================
-   Code Blocks - Warm & Distinct
-   ======================================== */
-.ardo-code-block {
+/* vanilla-extract-css-ns:src/ui/components/CodeBlock.css.ts.vanilla.css?source=#H4sIAAAAAAAAA-VWO2_bMBDe_StYFAFiIFQpv5IoWzt0Cbo0QMeAFs8SYZokSCpxWuS_F6RkWpZlWwXaqZt1vOd33905-aIYfBYqXz_n8ddzKhZ3hk4J-jVCaENNwWWGJkRvEXmIEixg5TKE04XeeulSGQYGG8p4ZTP0Qs01xtQw1YjwkloYe031AmYl1GuGSs4YyGBN83VhVCXZgWmuhDI4pFaM91EylOotskpwdkI7qDUWW2xLyny8Xt3v4XH8MHofJYdwPHEnIMKRBjg0ZYzLIkOpxyMW30pfcAnU4MKXDdJd3xMGxQ1Sa5GX1ySZ3SGSpHOU3hL0CZGEzMaIXN2crQOlhFyFalZKOmz5T8hQOq1jB9Er8KJ0GZoTEmUruuHi7aDqIN8oqYKzEKcHFQdb9-j9tSDHS-Wc2gxH_gjNH4ZqDSbiOanxVJY7rmSGDAjq-AsMMtUGDtgZqt73pmnLjml4myFaOTUcmjbOs9qZ7ysuG5zTZDG_BOG4ywxnqLSaGpAOfeAbrYyj0oV6GTVrNLjqJupHmMDdigwGzL8Ee8atFvQtQysBNYcEbDHjBvK6F7kS1Ub-mePEA1Q3hcs9UKLscfPI5X6wpoc5Lb3WQ7u3-yUTO0xQZ-_U22gaydnC-mL8pORFKXy-wEIu7aadmtt03ImOT3Fhaahk3YnwYH2rNssWlrNDHLgMjItwvHLmygxNJ3XdF4e32X_-G1PBCz9iXt5a4abpUQNlZcFgCwJylyGpJPRS82TmO1bObufzxX2wtSVf8yNIz8xBbWA1lW2XdZHhDYtmMcXMLpt4vb6N9NWoSsci5v_7uQtwPNGljZAs-rfF5ezb-fyd67FLLuZ2O_Ac1zzeQ7n7zitjPVG04tKBOXdc_80hnfTvqki4nR5O61SCVnMrqRDtaPsnvKLWDcMvKz0zj2fm-IoNcJbQ3N_us952e7CDxMW9OXRc3kdJI2aAvbrGmkoQ3bt67l8u6aNKZ9ZJd86iXv-Oexi9_wbZM8AFaAsAAA */
+.CodeBlock_codeBlock__1l68ra30 {
   margin: 20px 0;
   margin-left: -16px;
-  border-radius: var(--ardo-radius);
+  border-radius: var(--ardo-radius-base);
   overflow: hidden;
-  background: var(--ardo-code-bg);
-  border: 1px solid var(--ardo-code-border);
-  box-shadow: var(--ardo-code-shadow);
-}
-
-/* Shiki syntax highlighting - dual theme support */
-.shiki {
-  background: transparent !important;
-}
-
-.shiki span {
-  color: var(--shiki-light);
-}
-
-.dark .shiki span {
-  color: var(--shiki-dark);
+  background: var(--ardo-color-codeBg);
+  border: 1px solid var(--ardo-color-codeBorder);
+  box-shadow: var(--ardo-color-codeShadow);
 }
-
-.ardo-code-title {
+.CodeBlock_codeTitle__1l68ra31 {
   padding: 10px 16px;
-  background: linear-gradient(
-    90deg,
-    oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.04) 0%,
-    var(--ardo-code-border) 100%
-  );
+  background:
+    linear-gradient(
+      90deg,
+      oklch(0.48 0.15 170 / 0.04) 0%,
+      var(--ardo-color-codeBorder) 100%);
   font-size: 13px;
   font-weight: 500;
   font-family: var(--ardo-font-mono);
-  color: var(--ardo-c-text-light);
-  border-bottom: 1px solid var(--ardo-code-border);
+  color: var(--ardo-color-textLight);
+  border-bottom: 1px solid var(--ardo-color-codeBorder);
 }
-
-.ardo-code-wrapper {
+.CodeBlock_codeWrapper__1l68ra32 {
   position: relative;
 }
-
-.ardo-code-wrapper pre {
+.CodeBlock_codeWrapper__1l68ra32 pre {
   margin: 0;
   padding: 16px;
   overflow-x: auto;
   font-family: var(--ardo-font-mono);
   font-size: 14px;
   line-height: 1.65;
-  color: var(--ardo-c-text);
+  color: var(--ardo-color-text);
   background: transparent !important;
 }
-
-.ardo-code-wrapper pre code {
+.dark .CodeBlock_codeWrapper__1l68ra32 pre {
+  color: #e2e8f0;
+}
+.CodeBlock_codeWrapper__1l68ra32 pre code {
   display: flex;
   flex-direction: column;
 }
-
-/* Shiki emits empty <span class="line"></span> for blank lines.
-   Inside a flex column these collapse to 0 height, so we give
-   every line a minimum height equal to one line of code. */
-.ardo-code-wrapper pre code .line {
+.CodeBlock_codeWrapper__1l68ra32 pre code .line {
   min-height: 1lh;
 }
-
-.dark .ardo-code-wrapper pre {
-  color: #e2e8f0;
-}
-
-.ardo-code-line {
+.CodeBlock_codeLine__1l68ra33 {
   display: block;
   margin: 0 -16px;
   padding: 0 16px;
   border-left: 3px solid transparent;
 }
-
-.ardo-code-line.highlighted {
-  background: oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.1);
-  border-left-color: var(--ardo-c-brand);
+.CodeBlock_codeLine__1l68ra33.highlighted {
+  background: oklch(0.48 0.15 170 / 0.1);
+  border-left-color: var(--ardo-color-brand);
 }
-
-.ardo-line-number {
+.CodeBlock_lineNumber__1l68ra34 {
   display: inline-block;
   width: 32px;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
   text-align: right;
   margin-right: 16px;
   user-select: none;
 }
-
-.dark .ardo-line-number {
+.dark .CodeBlock_lineNumber__1l68ra34 {
   color: #475569;
 }
-
-.ardo-copy-button {
-  position: absolute;
-  top: 10px;
-  right: 10px;
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  padding: 6px 10px;
-  background: var(--ardo-c-bg);
-  border: 1px solid var(--ardo-c-border);
-  border-radius: var(--ardo-radius-sm);
-  cursor: pointer;
-  font-size: 12px;
-  font-family: var(--ardo-font-family);
-  color: var(--ardo-c-text-light);
-  opacity: 0.6;
-  transition: all var(--ardo-transition);
+.shiki {
+  background: transparent !important;
 }
-
-.ardo-copy-button:hover {
-  opacity: 1;
-  background: var(--ardo-c-bg-soft);
-  border-color: var(--ardo-c-brand);
-  color: var(--ardo-c-brand);
+.shiki span {
+  color: var(--shiki-light);
 }
-
-/* Code groups */
-.ardo-code-group {
+.dark .shiki span {
+  color: var(--shiki-dark);
+}
+.CodeBlock_codeGroup__1l68ra35 {
   margin: 20px 0;
   margin-left: -16px;
-  border-radius: var(--ardo-radius);
+  border-radius: var(--ardo-radius-base);
   overflow: hidden;
-  background: var(--ardo-code-bg);
-  border: 1px solid var(--ardo-code-border);
-  box-shadow: var(--ardo-code-shadow);
+  background: var(--ardo-color-codeBg);
+  border: 1px solid var(--ardo-color-codeBorder);
+  box-shadow: var(--ardo-color-codeShadow);
 }
-
-.ardo-code-group-tabs {
+.CodeBlock_codeGroupTabs__1l68ra36 {
   display: flex;
-  background: var(--ardo-code-border);
-  border-bottom: 1px solid var(--ardo-code-border);
+  background: var(--ardo-color-codeBorder);
+  border-bottom: 1px solid var(--ardo-color-codeBorder);
 }
-
-.ardo-code-group-tab {
+.CodeBlock_codeGroupTab__1l68ra37 {
   padding: 10px 16px;
   background: none;
   border: none;
   cursor: pointer;
   font-size: 13px;
   font-family: var(--ardo-font-mono);
-  color: var(--ardo-c-text-light);
+  color: var(--ardo-color-textLight);
   border-bottom: 2px solid transparent;
   margin-bottom: -1px;
   transition: all var(--ardo-transition-fast);
 }
-
-.ardo-code-group-tab:hover {
-  color: var(--ardo-c-text);
-}
-
-.ardo-code-group-tab.active {
-  color: var(--ardo-c-brand);
-  border-bottom-color: var(--ardo-c-brand);
-  background: var(--ardo-code-bg);
-}
-
-.ardo-code-group-panel {
-  display: none;
+.CodeBlock_codeGroupTab__1l68ra37:hover {
+  color: var(--ardo-color-text);
 }
-
-.ardo-code-group-panel.active {
-  display: block;
+.CodeBlock_codeGroupTab__1l68ra37.active {
+  color: var(--ardo-color-brand);
+  border-bottom-color: var(--ardo-color-brand);
+  background: var(--ardo-color-codeBg);
 }
-
-/* Strip inner code-block chrome when nested inside a code group */
-.ardo-code-group-panel .ardo-code-block {
+.ardo-code-group-panel .CodeBlock_codeBlock__1l68ra30 {
   margin: 0;
   border: none;
   border-radius: 0;
@@ -1049,48 +971,40 @@ a.ardo-sidebar-text.active {
   background: transparent;
 }
 
-/* ========================================
-   Containers - Clear Visual Distinction
-   ======================================== */
-.ardo-container {
+/* vanilla-extract-css-ns:src/ui/components/Container.css.ts.vanilla.css?source=#H4sIAAAAAAAAA52UwW7CMBBE7_mKPZaDEaE0UHNrf6F35MSOsWpsyzEFWvHvVZw0BErtpLdoMjN6knd3-qqVI0Ixuym6r00ql-ywtDP4SgB2xHKhMKSZOcJsnQAYQqlQHEM6N0ev12quLWUWWULFvsLwQewDQsRS3UooJxWbXJwYUnOESktBe3HJSodhcflzTqb3GN3JsI0TpoNNPWxOindu9V7RK4JCS22RE-aF9wga-Q-jd0xuyEKJSZj1QKwSine88zhvGxnG_GMex92mIuyUKN6bi8c4epMYRt56x4E3oQi3UKXuqBdx6to_jNk7xxHXkQiv0o51vE9x3to_jNc7x_HWkT9534STF9TMo1JRGUlOGErJ_EUgUnCFhGO7CkPBlGO2ljkxGFbN0Si1cujABN86DNls1mmV-GQY0kVja24QyrVzeteGQ2C_rsPSE_5ne3uFtyu8CpbGVqtXfLNfz8HeyOT3aq_GnwRLg8PZq7ya0DxYGZyfWmLKdVWFr7rz8lIohrbtgKTTbJ2cvwGhHDgltAYAAA */
+.Container_container__1l7ew7r0 {
   margin: 16px 0;
   padding: 12px 16px;
-  border-radius: var(--ardo-radius);
+  border-radius: var(--ardo-radius-base);
   border: 1px solid;
   border-left: 4px solid;
 }
-
-.ardo-container-tip {
-  background: var(--ardo-c-tip-bg);
-  border-color: var(--ardo-c-tip-border);
-  border-left-color: var(--ardo-c-tip);
+.Container_container_type_tip__1l7ew7r1 {
+  background: var(--ardo-color-tipBg);
+  border-color: var(--ardo-color-tipBorder);
+  border-left-color: var(--ardo-color-tip);
 }
-
-.ardo-container-warning {
-  background: var(--ardo-c-warning-bg);
-  border-color: var(--ardo-c-warning-border);
-  border-left-color: var(--ardo-c-warning);
+.Container_container_type_warning__1l7ew7r2 {
+  background: var(--ardo-color-warningBg);
+  border-color: var(--ardo-color-warningBorder);
+  border-left-color: var(--ardo-color-warning);
 }
-
-.ardo-container-danger {
-  background: var(--ardo-c-danger-bg);
-  border-color: var(--ardo-c-danger-border);
-  border-left-color: var(--ardo-c-danger);
+.Container_container_type_danger__1l7ew7r3 {
+  background: var(--ardo-color-dangerBg);
+  border-color: var(--ardo-color-dangerBorder);
+  border-left-color: var(--ardo-color-danger);
 }
-
-.ardo-container-info {
-  background: var(--ardo-c-info-bg);
-  border-color: var(--ardo-c-info-border);
-  border-left-color: var(--ardo-c-info);
+.Container_container_type_info__1l7ew7r4 {
+  background: var(--ardo-color-infoBg);
+  border-color: var(--ardo-color-infoBorder);
+  border-left-color: var(--ardo-color-info);
 }
-
-.ardo-container-note {
-  background: var(--ardo-c-note-bg);
-  border-color: var(--ardo-c-note-border);
-  border-left-color: var(--ardo-c-note);
+.Container_container_type_note__1l7ew7r5 {
+  background: var(--ardo-color-noteBg);
+  border-color: var(--ardo-color-noteBorder);
+  border-left-color: var(--ardo-color-note);
 }
-
-.ardo-container-title {
+.Container_containerTitle__1l7ew7r6 {
   display: flex;
   align-items: center;
   gap: 8px;
@@ -1098,289 +1012,135 @@ a.ardo-sidebar-text.active {
   font-size: 14px;
   margin-bottom: 8px;
 }
-
-.ardo-container-tip .ardo-container-title {
-  color: var(--ardo-c-tip);
+.Container_containerTitle_type_tip__1l7ew7r7 {
+  color: var(--ardo-color-tip);
 }
-.ardo-container-warning .ardo-container-title {
-  color: var(--ardo-c-warning);
+.Container_containerTitle_type_warning__1l7ew7r8 {
+  color: var(--ardo-color-warning);
 }
-.ardo-container-danger .ardo-container-title {
-  color: var(--ardo-c-danger);
+.Container_containerTitle_type_danger__1l7ew7r9 {
+  color: var(--ardo-color-danger);
 }
-.ardo-container-info .ardo-container-title {
-  color: var(--ardo-c-info);
+.Container_containerTitle_type_info__1l7ew7ra {
+  color: var(--ardo-color-info);
 }
-.ardo-container-note .ardo-container-title {
-  color: var(--ardo-c-note);
+.Container_containerTitle_type_note__1l7ew7rb {
+  color: var(--ardo-color-note);
 }
-
-.ardo-container-content {
+.Container_containerContent__1l7ew7rc {
   font-size: 14px;
   line-height: 1.6;
 }
 
-.ardo-container-content p:last-child {
-  margin-bottom: 0;
+/* vanilla-extract-css-ns:src/ui/components/Search.css.ts.vanilla.css?source=#H4sIAAAAAAAAA81Y3YrjNhi9n6cQCwsJHaV24mRSL4VCYaF0KUund2VZZEuJ1SiSseTE2WXevUi2YtlWnGQGSpmLSeRP3-_R0XFmzwQVafZV1v--HqsU00MAvj8AkAtJFRU8BgVhSNED-fAAwJFilcUgZWifT-bzIK8ewSI4HB_BYhXk1VTb7FEFG7swCN7rJVUgbt2ZR-CAigmEqMACtg_hBkk1_fDw8jDrZPaREoZteqFJD1OZM3SKwYaRSodAjG45pIrsZQxSwhUp9PIW5TFY58ZkTznMCN1mKgZRUK_lCGPKt8YGhPN6MUHpbluIkuPYTTQVTBQw2T6LjTKVJqLApIhBmFdACkaxx9qYONawQJiWsuO4XoIJksRYmq2e0IpU6pPOv_GYloXUhnq93-Ymmtk41u1HkIgKygxhcRy3u-pqOLgzpOJMHEgBxsb6CC7t3Yi0lPBIVUb5qAuDDLdw3_gKxPFtXW6mZrsTg8D8LfIKiB1Ls0kwi9YgmIVLED4F4Ef9MfJ04Teel8omOTdJatTGILSobI5L4IKKC26OnCgVo5y0CxvBFZT0G4lBGA0Ba83GyruaZBznDKUkEwyTwmR8GyaveK0neaCSJowYt73q-vs_i1wDx3pY9KgJJVKwUpl6lchjkCKWTjTrgB9AaAmpqI984BDYnvLJcmXoy245HAEE8yivptMbOMB3osNVM407aaEF2MCufvCpDqc7sWHaLqMYE67XvkHKscbSPAyG7fuTyJIpadsXmfYxKhWU6sQcTGnObqmx4UYbD55igEolLvm37pddZk6YSHcdjtX8CuaNdw0ciEkqClQP80bgntueCKXE_oY2t4e5Q5DnAd_Hab2aY4akgmlGGXbpxybnh3Xfh2HHPgH2jGaSMJIq0oRx4HmJjILlxfT_oooR63p1YW6GaI4NKpZBUAOl2FJ-Ls9cmP4QzyTVbbRBnsaCNGy2qJHxOqr5Q_TQvq7JwoJvMQCfkQyuWHhd4I9CqJaifvLLk39KqejmBFPBFeFqIFHmUU-PdM7KfYIEGiq8jX3c9s_f0v5-F3YJ7vZf17O6qZy3a6ummQ1YG_6PfFj9lRF0zhp1Z0e5vprgFYU5MtnmsrGztQRrv2vHUGYF5Tt793vu8b4esKIvF9TGcYe4vmeIzngi9-4aEalyP2BSxNh9FNpteqMN-6w2hvM7tc3vyVkjJt0Rt_efQQojm0tA6fj4P4DbHXroLG3QnrJTJ7azbrrzy55gisDEeVN7Wq3zamqKuiDDzbMzpu3708tgg0eSD3Y1pBfUn913ML9Pj4K2Glor8lqcOHEaxyJHKVWnNlB9ZCA5EK5kO_1hQK_u7CrJjpaM5h4tGVgt6WmS587wwHK40cNXN-07j_FvjBSCpMoRxwT__E4VJXn35caXr-_9uhc-DT1S95U0_pMXxHMB9teJ7q8EF34TeGstXQi_qpaRUxD2AB_6AW8PyluL6aLwVcWMA7l39b64pNW-L18krQHhexRZM_WFHe_LvzbcwBQOEwAA */
+.Search_search__wxcdiv0 {
+  position: relative;
+  width: clamp(220px, 30vw, 360px);
+  max-width: 100%;
+  transition: width var(--ardo-transition-fast);
 }
-
-/* Details */
-.ardo-details {
-  margin: 20px 0;
-  border: 1px solid var(--ardo-c-border);
-  border-radius: var(--ardo-radius);
+.Search_searchField__wxcdiv1 {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  min-height: 40px;
+  padding: 8px 12px;
+  background: var(--ardo-color-bgSoft);
+  border: 1px solid var(--ardo-color-border);
+  border-radius: var(--ardo-radius-base);
+  color: var(--ardo-color-textLighter);
+  cursor: text;
+  transition:
+    border-color var(--ardo-transition-fast),
+    box-shadow var(--ardo-transition-fast),
+    color var(--ardo-transition-fast);
 }
-
-.ardo-details-summary {
-  padding: 14px 16px;
-  cursor: pointer;
-  font-weight: 500;
-  background: var(--ardo-c-bg-soft);
-  transition: background var(--ardo-transition-fast);
+.Search_search__wxcdiv0:hover .Search_searchField__wxcdiv1,
+.Search_search__wxcdiv0:focus-within .Search_searchField__wxcdiv1 {
+  border-color: var(--ardo-color-brand);
+  color: var(--ardo-color-textLight);
+  box-shadow: 0 0 0 3px oklch(0.48 0.15 170 / 0.14);
 }
-
-.ardo-details-summary:hover {
-  background: var(--ardo-c-bg-mute);
+.Search_searchInput__wxcdiv2 {
+  flex: 1;
+  min-width: 0;
+  border: none;
+  outline: none;
+  font-size: 14px;
+  background: none;
+  color: var(--ardo-color-text);
 }
-
-.ardo-details[open] .ardo-details-summary {
-  border-bottom: 1px solid var(--ardo-c-border);
+.Search_searchInput__wxcdiv2::placeholder {
+  color: var(--ardo-color-textLighter);
 }
-
-.ardo-details > *:not(summary) {
-  padding: 16px;
+.Search_searchInput__wxcdiv2:focus-visible {
+  outline: none;
 }
-
-/* ========================================
-   Footer Area
-   ======================================== */
-.ardo-content-footer {
-  margin-top: 60px;
-  padding-top: 24px;
-  border-top: 1px solid var(--ardo-c-border);
+.Search_searchPopover__wxcdiv3 {
+  position: absolute;
+  top: calc(100% + 10px);
+  right: 0;
+  width: min(560px, calc(100vw - 24px));
+  background: var(--ardo-color-bg);
+  border-radius: 16px;
+  border: 1px solid var(--ardo-color-border);
+  box-shadow: var(--ardo-color-shadowLg);
+  overflow: hidden;
+  z-index: 210;
 }
-
-.ardo-content-meta {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 24px;
-  font-size: 14px;
-  color: var(--ardo-c-text-lighter);
+.Search_searchResults__wxcdiv4 {
+  list-style: none;
+  max-height: 400px;
+  overflow-y: auto;
 }
-
-.ardo-edit-link {
-  color: var(--ardo-c-brand);
+.Search_searchResult__wxcdiv5 {
+  display: block;
+  padding: 12px 20px;
   text-decoration: none;
-  font-weight: 500;
-  transition: opacity var(--ardo-transition-fast);
+  color: var(--ardo-color-text);
+  border-bottom: 1px solid var(--ardo-color-borderLight);
+  transition: background var(--ardo-transition-fast);
 }
-
-.ardo-edit-link:hover {
-  opacity: 0.8;
-}
-
-.ardo-prev-next {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  gap: 16px;
-}
-
-.ardo-prev-link,
-.ardo-next-link {
-  display: flex;
-  flex-direction: column;
-  padding: 16px 20px;
-  border: 1px solid var(--ardo-c-border);
-  border-radius: var(--ardo-radius);
-  text-decoration: none;
-  box-shadow: var(--ardo-shadow-sm);
-  transition: all var(--ardo-transition);
-}
-
-.ardo-prev-link:hover,
-.ardo-next-link:hover {
-  border-color: oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.4);
-  background: var(--ardo-c-brand-subtle);
-  box-shadow: var(--ardo-shadow-md);
-}
-
-@media (hover: hover) {
-  .ardo-prev-link:hover,
-  .ardo-next-link:hover {
-    transform: translateY(-2px);
-  }
+.Search_searchResult__wxcdiv5:last-child {
+  border-bottom: none;
 }
-
-.ardo-next-link {
-  text-align: right;
+.Search_searchResult__wxcdiv5:hover,
+.Search_searchResult__wxcdiv5.selected {
+  background: oklch(0.48 0.15 170 / 0.05);
 }
-
-.ardo-prev-next-label {
-  font-size: 12px;
+.Search_searchResultTitle__wxcdiv6 {
+  display: block;
   font-weight: 500;
-  color: var(--ardo-c-text-lighter);
-  text-transform: uppercase;
-  letter-spacing: 0.05em;
-  margin-bottom: 4px;
+  margin-bottom: 2px;
 }
-
-.ardo-prev-next-title {
-  font-weight: 600;
-  color: var(--ardo-c-brand);
+.Search_searchResultSection__wxcdiv7 {
+  display: block;
+  font-size: 13px;
+  color: var(--ardo-color-textLighter);
 }
-
-/* Page footer */
-.ardo-footer {
-  padding: 32px 24px;
+.Search_searchNoResults__wxcdiv8 {
+  padding: 32px 20px;
   text-align: center;
-  box-shadow: 0 -1px 3px oklch(0 0 0 / 0.03);
-  background: linear-gradient(
-    180deg,
-    var(--ardo-c-bg) 0%,
-    oklch(0.97 0.01 var(--ardo-brand-h)) 100%
-  );
-}
-
-.dark .ardo-footer {
-  box-shadow: 0 -1px 3px oklch(0 0 0 / 0.1);
-  background: linear-gradient(
-    180deg,
-    var(--ardo-c-bg) 0%,
-    oklch(0.18 0.015 var(--ardo-brand-h)) 100%
-  );
+  color: var(--ardo-color-textLighter);
 }
-
-.ardo-footer-primary {
+.Search_searchFooter__wxcdiv9 {
   display: flex;
-  align-items: center;
   justify-content: center;
-  gap: 0;
-  flex-wrap: wrap;
-  font-size: 14px;
-  color: var(--ardo-c-text-light);
-  margin-bottom: 6px;
-}
-
-.ardo-footer-separator {
-  display: inline-block;
-  width: 4px;
-  height: 4px;
-  border-radius: 50%;
-  background: var(--ardo-c-text-lighter);
-  margin: 0 12px;
-  vertical-align: middle;
-}
-
-.ardo-footer-link {
-  color: var(--ardo-c-brand);
-  text-decoration: none;
-  transition: opacity var(--ardo-transition-fast);
-}
-
-.ardo-footer-link:hover {
-  opacity: 0.8;
-}
-
-.ardo-footer-message,
-.ardo-footer-copyright {
-  font-size: 14px;
-  color: var(--ardo-c-text-lighter);
-}
-
-.ardo-footer-build-time {
+  gap: 24px;
+  padding: 12px 20px;
+  background: var(--ardo-color-bgSoft);
+  border-top: 1px solid var(--ardo-color-border);
   font-size: 12px;
-  color: var(--ardo-c-text-lighter);
-  margin-top: 6px;
-}
-
-/* ========================================
-   Search
-   ======================================== */
-.ardo-search {
-  position: relative;
-  width: clamp(220px, 30vw, 360px);
-  max-width: 100%;
-  transition: width var(--ardo-transition-fast);
-}
-
-.ardo-search-field {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  min-height: 40px;
-  padding: 8px 12px;
-  background: var(--ardo-c-bg-soft);
-  border: 1px solid var(--ardo-c-border);
-  border-radius: var(--ardo-radius);
-  color: var(--ardo-c-text-lighter);
-  cursor: text;
-  transition:
-    border-color var(--ardo-transition-fast),
-    box-shadow var(--ardo-transition-fast),
-    color var(--ardo-transition-fast);
-}
-
-.ardo-search:hover .ardo-search-field,
-.ardo-search:focus-within .ardo-search-field {
-  border-color: var(--ardo-c-brand);
-  color: var(--ardo-c-text-light);
-  box-shadow: 0 0 0 3px oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.14);
-}
-
-.ardo-search-kbd {
-  display: none;
-  margin-left: 4px;
+  color: var(--ardo-color-textLighter);
 }
-
-@media (min-width: 768px) {
-  .ardo-search-kbd {
-    display: flex;
-    gap: 3px;
-  }
-}
-
-.ardo-search-kbd kbd {
+.Search_searchFooter__wxcdiv9 kbd {
   padding: 2px 6px;
-  background: var(--ardo-c-bg);
-  border: 1px solid var(--ardo-c-border);
+  background: var(--ardo-color-bg);
+  border: 1px solid var(--ardo-color-border);
   border-radius: 4px;
-  font-size: 11px;
-  font-family: var(--ardo-font-family);
-}
-
-.ardo-search-input {
-  flex: 1;
-  min-width: 0;
-  border: none;
-  outline: none;
-  font-size: 14px;
-  background: none;
-  color: var(--ardo-c-text);
-}
-
-.ardo-search-input::placeholder {
-  color: var(--ardo-c-text-lighter);
-}
-
-.ardo-search-input:focus-visible {
-  outline: none;
-}
-
-.ardo-search-popover {
-  position: absolute;
-  top: calc(100% + 10px);
-  right: 0;
-  width: min(560px, calc(100vw - 24px));
-  background: var(--ardo-c-bg);
-  border-radius: 16px;
-  border: 1px solid var(--ardo-c-border);
-  box-shadow: var(--ardo-shadow-lg);
-  overflow: hidden;
-  z-index: 210;
+  margin-right: 4px;
 }
-
-.ardo-search-clear {
+.Search_searchClear__wxcdiva {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -1391,212 +1151,165 @@ a.ardo-sidebar-text.active {
   border: none;
   cursor: pointer;
   font-size: 18px;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
   padding: 4px;
   border-radius: var(--ardo-radius-sm);
   transition: all var(--ardo-transition-fast);
 }
-
-.ardo-search-clear:hover {
-  background: var(--ardo-c-bg-soft);
-  color: var(--ardo-c-text);
-}
-
-.ardo-search-results {
-  list-style: none;
-  max-height: 400px;
-  overflow-y: auto;
-}
-
-.ardo-search-result {
-  display: block;
-  padding: 12px 20px;
-  text-decoration: none;
-  color: var(--ardo-c-text);
-  border-bottom: 1px solid var(--ardo-c-border-light);
-  transition: background var(--ardo-transition-fast);
-}
-
-.ardo-search-result:last-child {
-  border-bottom: none;
-}
-
-.ardo-search-result:hover,
-.ardo-search-result.selected {
-  background: oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.05);
-}
-
-.ardo-search-result-title {
-  display: block;
-  font-weight: 500;
-  margin-bottom: 2px;
-}
-
-.ardo-search-result-section {
-  display: block;
-  font-size: 13px;
-  color: var(--ardo-c-text-lighter);
-}
-
-.ardo-search-no-results {
-  padding: 32px 20px;
-  text-align: center;
-  color: var(--ardo-c-text-lighter);
+.Search_searchClear__wxcdiva:hover {
+  background: var(--ardo-color-bgSoft);
+  color: var(--ardo-color-text);
 }
-
-.ardo-search-footer {
-  display: flex;
-  justify-content: center;
-  gap: 24px;
-  padding: 12px 20px;
-  background: var(--ardo-c-bg-soft);
-  border-top: 1px solid var(--ardo-c-border);
-  font-size: 12px;
-  color: var(--ardo-c-text-lighter);
+.Search_searchKbd__wxcdivb {
+  display: none;
+  margin-left: 4px;
 }
-
-.ardo-search-footer kbd {
+.Search_searchKbd__wxcdivb kbd {
   padding: 2px 6px;
-  background: var(--ardo-c-bg);
-  border: 1px solid var(--ardo-c-border);
+  background: var(--ardo-color-bg);
+  border: 1px solid var(--ardo-color-border);
   border-radius: 4px;
-  margin-right: 4px;
+  font-size: 11px;
+  font-family: var(--ardo-font-family);
 }
-
 @media (max-width: 768px) {
-  .ardo-search {
+  .Search_search__wxcdiv0 {
     width: 40px;
   }
-
-  .ardo-search-field {
+  .Search_searchField__wxcdiv1 {
     width: 40px;
     gap: 0;
     padding: 8px;
   }
-
-  .ardo-search-input {
+  .Search_searchInput__wxcdiv2 {
     flex: 0 0 auto;
     width: 0;
     opacity: 0;
     pointer-events: none;
   }
-
-  .ardo-search-clear,
-  .ardo-search-kbd {
+  .Search_searchPopover__wxcdiv3 {
+    right: 0;
+    width: min(420px, calc(100vw - 20px));
+  }
+  .Search_searchFooter__wxcdiv9 {
     display: none;
   }
-
-  .ardo-search[data-expanded="true"],
-  .ardo-search:focus-within {
+  .Search_searchClear__wxcdiva {
+    display: none;
+  }
+  .Search_search__wxcdiv0[data-expanded=true],
+  .Search_search__wxcdiv0:focus-within {
     width: min(360px, calc(100vw - 20px));
   }
-
-  .ardo-search[data-expanded="true"] .ardo-search-field,
-  .ardo-search:focus-within .ardo-search-field {
+  .Search_search__wxcdiv0[data-expanded=true] .Search_searchField__wxcdiv1,
+  .Search_search__wxcdiv0:focus-within .Search_searchField__wxcdiv1 {
     width: 100%;
     gap: 8px;
     padding: 8px 12px;
   }
-
-  .ardo-search[data-expanded="true"] .ardo-search-input,
-  .ardo-search:focus-within .ardo-search-input {
+  .Search_search__wxcdiv0[data-expanded=true] .Search_searchInput__wxcdiv2,
+  .Search_search__wxcdiv0:focus-within .Search_searchInput__wxcdiv2 {
     flex: 1;
     opacity: 1;
     pointer-events: auto;
   }
-
-  .ardo-search[data-expanded="true"] .ardo-search-clear,
-  .ardo-search:focus-within .ardo-search-clear {
+  .Search_search__wxcdiv0[data-expanded=true] .Search_searchClear__wxcdiva,
+  .Search_search__wxcdiv0:focus-within .Search_searchClear__wxcdiva {
     display: inline-flex;
   }
-
-  .ardo-search-popover {
-    right: 0;
-    width: min(420px, calc(100vw - 20px));
-  }
-
-  .ardo-search-footer {
-    display: none;
-  }
-}
-
-/* Theme toggle */
-.ardo-theme-toggle {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 40px;
-  height: 40px;
-  background: none;
-  border: none;
-  cursor: pointer;
-  color: var(--ardo-c-text-light);
-  border-radius: var(--ardo-radius);
-  transition: all var(--ardo-transition-fast);
 }
-
-.ardo-theme-toggle:hover {
-  background: var(--ardo-c-bg-soft);
-  color: var(--ardo-c-text);
+@media (min-width: 768px) {
+  .Search_searchKbd__wxcdivb {
+    display: flex;
+    gap: 3px;
+  }
 }
 
-/* Tabs */
-.ardo-tabs {
+/* vanilla-extract-css-ns:src/ui/components/Tabs.css.ts.vanilla.css?source=LlRhYnNfdGFic19fMWp5cHIzNDAgewogIG1hcmdpbjogMjBweCAwOwp9Ci5UYWJzX3RhYkxpc3RfXzFqeXByMzQxIHsKICBkaXNwbGF5OiBmbGV4OwogIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCB2YXIoLS1hcmRvLWNvbG9yLWJvcmRlcik7CiAgZ2FwOiA0cHg7Cn0KLlRhYnNfdGFiX18xanlwcjM0MiB7CiAgcGFkZGluZzogMTBweCAxOHB4OwogIGJhY2tncm91bmQ6IG5vbmU7CiAgYm9yZGVyOiBub25lOwogIGN1cnNvcjogcG9pbnRlcjsKICBmb250LXNpemU6IDE0cHg7CiAgZm9udC13ZWlnaHQ6IDUwMDsKICBjb2xvcjogdmFyKC0tYXJkby1jb2xvci10ZXh0TGlnaHQpOwogIGJvcmRlci1ib3R0b206IDJweCBzb2xpZCB0cmFuc3BhcmVudDsKICBtYXJnaW4tYm90dG9tOiAtMXB4OwogIHRyYW5zaXRpb246IGFsbCB2YXIoLS1hcmRvLXRyYW5zaXRpb24tZmFzdCk7Cn0KLlRhYnNfdGFiX18xanlwcjM0Mjpob3ZlciB7CiAgY29sb3I6IHZhcigtLWFyZG8tY29sb3ItdGV4dCk7Cn0KLlRhYnNfdGFiX18xanlwcjM0Mi5hY3RpdmUgewogIGNvbG9yOiB2YXIoLS1hcmRvLWNvbG9yLWJyYW5kKTsKICBib3JkZXItYm90dG9tLWNvbG9yOiB2YXIoLS1hcmRvLWNvbG9yLWJyYW5kKTsKfQouVGFic190YWJQYW5lbF9fMWp5cHIzNDMgewogIHBhZGRpbmc6IDIwcHggMDsKfQ */
+.Tabs_tabs__1jypr340 {
   margin: 20px 0;
 }
-
-.ardo-tab-list {
+.Tabs_tabList__1jypr341 {
   display: flex;
-  border-bottom: 1px solid var(--ardo-c-border);
+  border-bottom: 1px solid var(--ardo-color-border);
   gap: 4px;
 }
-
-.ardo-tab {
+.Tabs_tab__1jypr342 {
   padding: 10px 18px;
   background: none;
   border: none;
   cursor: pointer;
   font-size: 14px;
   font-weight: 500;
-  color: var(--ardo-c-text-light);
+  color: var(--ardo-color-textLight);
   border-bottom: 2px solid transparent;
   margin-bottom: -1px;
   transition: all var(--ardo-transition-fast);
 }
-
-.ardo-tab:hover {
-  color: var(--ardo-c-text);
+.Tabs_tab__1jypr342:hover {
+  color: var(--ardo-color-text);
 }
-
-.ardo-tab.active {
-  color: var(--ardo-c-brand);
-  border-bottom-color: var(--ardo-c-brand);
+.Tabs_tab__1jypr342.active {
+  color: var(--ardo-color-brand);
+  border-bottom-color: var(--ardo-color-brand);
 }
-
-.ardo-tab-panel {
+.Tabs_tabPanel__1jypr343 {
   padding: 20px 0;
 }
 
-/* ========================================
-   Hero Section - Home Page
-   ======================================== */
-.ardo-home {
-  min-height: 100vh;
+/* vanilla-extract-css-ns:src/ui/components/ThemeToggle.css.ts.vanilla.css?source=LlRoZW1lVG9nZ2xlX3RoZW1lVG9nZ2xlX18xOGc1aXl6MCB7CiAgZGlzcGxheTogZmxleDsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGp1c3RpZnktY29udGVudDogY2VudGVyOwogIHdpZHRoOiA0MHB4OwogIGhlaWdodDogNDBweDsKICBiYWNrZ3JvdW5kOiBub25lOwogIGJvcmRlcjogbm9uZTsKICBjdXJzb3I6IHBvaW50ZXI7CiAgY29sb3I6IHZhcigtLWFyZG8tY29sb3ItdGV4dExpZ2h0KTsKICBib3JkZXItcmFkaXVzOiB2YXIoLS1hcmRvLXJhZGl1cy1iYXNlKTsKICB0cmFuc2l0aW9uOiBhbGwgdmFyKC0tYXJkby10cmFuc2l0aW9uLWZhc3QpOwp9Ci5UaGVtZVRvZ2dsZV90aGVtZVRvZ2dsZV9fMThnNWl5ejA6aG92ZXIgewogIGJhY2tncm91bmQ6IHZhcigtLWFyZG8tY29sb3ItYmdTb2Z0KTsKICBjb2xvcjogdmFyKC0tYXJkby1jb2xvci10ZXh0KTsKfQ */
+.ThemeToggle_themeToggle__18g5iyz0 {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  background: none;
+  border: none;
+  cursor: pointer;
+  color: var(--ardo-color-textLight);
+  border-radius: var(--ardo-radius-base);
+  transition: all var(--ardo-transition-fast);
+}
+.ThemeToggle_themeToggle__18g5iyz0:hover {
+  background: var(--ardo-color-bgSoft);
+  color: var(--ardo-color-text);
 }
 
-.ardo-home-main {
-  padding-top: var(--ardo-header-height);
+/* vanilla-extract-css-ns:src/ui/components/CopyButton.css.ts.vanilla.css?source=LkNvcHlCdXR0b25fY29weUJ1dHRvbl9fMWZsbTJ1bDAgewogIHBvc2l0aW9uOiBhYnNvbHV0ZTsKICB0b3A6IDEwcHg7CiAgcmlnaHQ6IDEwcHg7CiAgZGlzcGxheTogZmxleDsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGdhcDogNnB4OwogIHBhZGRpbmc6IDZweCAxMHB4OwogIGJhY2tncm91bmQ6IHZhcigtLWFyZG8tY29sb3ItYmcpOwogIGJvcmRlcjogMXB4IHNvbGlkIHZhcigtLWFyZG8tY29sb3ItYm9yZGVyKTsKICBib3JkZXItcmFkaXVzOiB2YXIoLS1hcmRvLXJhZGl1cy1zbSk7CiAgY3Vyc29yOiBwb2ludGVyOwogIGZvbnQtc2l6ZTogMTJweDsKICBmb250LWZhbWlseTogdmFyKC0tYXJkby1mb250LWZhbWlseSk7CiAgY29sb3I6IHZhcigtLWFyZG8tY29sb3ItdGV4dExpZ2h0KTsKICBvcGFjaXR5OiAwLjY7CiAgdHJhbnNpdGlvbjogYWxsIHZhcigtLWFyZG8tdHJhbnNpdGlvbi1iYXNlKTsKfQouQ29weUJ1dHRvbl9jb3B5QnV0dG9uX18xZmxtMnVsMDpob3ZlciB7CiAgb3BhY2l0eTogMTsKICBiYWNrZ3JvdW5kOiB2YXIoLS1hcmRvLWNvbG9yLWJnU29mdCk7CiAgYm9yZGVyLWNvbG9yOiB2YXIoLS1hcmRvLWNvbG9yLWJyYW5kKTsKICBjb2xvcjogdmFyKC0tYXJkby1jb2xvci1icmFuZCk7Cn0 */
+.CopyButton_copyButton__1flm2ul0 {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 10px;
+  background: var(--ardo-color-bg);
+  border: 1px solid var(--ardo-color-border);
+  border-radius: var(--ardo-radius-sm);
+  cursor: pointer;
+  font-size: 12px;
+  font-family: var(--ardo-font-family);
+  color: var(--ardo-color-textLight);
+  opacity: 0.6;
+  transition: all var(--ardo-transition-base);
+}
+.CopyButton_copyButton__1flm2ul0:hover {
+  opacity: 1;
+  background: var(--ardo-color-bgSoft);
+  border-color: var(--ardo-color-brand);
+  color: var(--ardo-color-brand);
 }
 
-.ardo-hero {
+/* vanilla-extract-css-ns:src/ui/components/Hero.css.ts.vanilla.css?source=#H4sIAAAAAAAAA71WTW_jNhC951cQCxiwgNClHFuWlUvTFmgLFL1sW2BPAS2OZMYUKVB0rN0i_70gJdr68jrYFr3YEkXOPD7Oe8PFL6DV897-PL9sYrINCfr7DqGSMsZlnqCQkLJGy1VZo5iU9eMdQgZqg6nguUxQCtKAtqOlqrjhSiZIg6CGv4IdVa-gM6FOCdpzxkA-3r3dLcY5k2QHmdLgcqdKGpAmQR8-9APTXaXE0bjARpUJIvZJQGbaR83zvX_eKWNU4V9oesi1OkqWIE0ZpwLn9h-kmYMQvKwARWSG1mSGqEEPZIbI7B6pg0j3c7JYxYgswjVaEoK-Q2RBosB9N5rKqqQapLHLg_urweNL8A2ZIRxOhQ83TfhwOQ6_ceEFl0D1JXwYEwb5PXqleo4x1UzhVAml8S5vQkx8-KgyE9hznQUNvdweIYZXkKZKkFQS3Ckxqg_o1ln9S2Kjtd1udCY2_E959dE9r_8frd0i_1FJQ7kE7RkMHXMFrfGJM7NPUExaZRVU51wmiCB6NOq6qr5gLhnUCQr7qZ4kL6gBn2jpElE32AjIP1bPGWXwq_yzfH4Os5co1luCyCKqENAKrHb2V5SKeJEP8YdxDz_20lu1wxkXBnSCmFYlrvaUqdOcIGspS2suV2WwDgZU_gW64kp6MA8OCONVKejnBHFpzxHvhEoPj10Ps5nCVYtFSYMr_gUSFD50hk7QeEdEnGG4U00mzllTyYKhpUxP-3jcGQHNZKWZZSAsa1QpwdnXNn1ZgG1BHqsEbbfbSYbDqBkWYKyGq5KmbsdkQZZQ9Mn7nRbnylg55jpcRKsJLmIyMs_pnf7cCsdBxyfYHbjBl2U4FbxMXN_oTnB9JONC4JbtjjD7eQcBhrvFZEEe7HaRUzLet_jDxUAff0BtPAXrIQWreIKCTUNBS7trOvE05dhzPgaxHqCguZ3hgURDIGGb4VoNWhp-s8GDIbTlylfJWZvrqK_Nplt6e2kH277pRwf4owH-p7SxkBb_pq_CTIDL93KsDM8-43M3v1wVclpeSreL_2wYAmp80naa_Z1K77PHkx7gQbhbCuYGimoEoGX5ctNxhhSPbWJ93SZcCTNIlW4dtumeI_12zrAZwjtaNdbgit5fcIToTr188tPHPPxg9efJ2I568lcMrC2v056bFnLdmrNtQN4zrxrVwzvgJHt7_3snqJ-oPgRjINGtNrGaBPIkzkqn7wCQB7cUd8XHx6HclJuYutQ0tXK75dya8Xb3fQGMUzTvGMAmiss6cImm2rkd74ggIi3dNt9bb824f_Ttc3LR2HF7i7zcBoumDLKvycivu-zZEZog9zfc743ibFWYKV20XUhQA5_meFnWwTBPqSEDXWEN7JgCw4XyFzT7Pso8dSXrXcq8Zbx9M-JLhLd_ACOwkWHQDQAA */
+.Hero_hero__j780910 {
   padding: 100px 24px 80px;
   text-align: center;
   position: relative;
   overflow: hidden;
 }
-
-/* Gradient background with dual orbs */
-.ardo-hero::before {
+.Hero_hero__j780910::before {
   content: "";
   position: absolute;
   top: 0;
@@ -1606,99 +1319,93 @@ a.ardo-sidebar-text.active {
   background:
     radial-gradient(
       ellipse 60% 50% at 30% 0%,
-      oklch(var(--ardo-brand-l) var(--ardo-brand-c) calc(var(--ardo-brand-h) + 30) / 0.06) 0%,
-      transparent 60%
-    ),
+      oklch(0.48 0.15 200 / 0.06) 0%,
+      transparent 60%),
     radial-gradient(
       ellipse 80% 50% at 70% -10%,
-      oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.12) 0%,
-      transparent 70%
-    ),
-    linear-gradient(180deg, var(--ardo-c-bg) 0%, var(--ardo-c-bg-soft) 100%);
+      oklch(0.48 0.15 170 / 0.12) 0%,
+      transparent 70%),
+    linear-gradient(
+      180deg,
+      var(--ardo-color-bg) 0%,
+      var(--ardo-color-bgSoft) 100%);
   pointer-events: none;
 }
-
-.dark .ardo-hero::before {
+.dark .Hero_hero__j780910::before {
   background:
     radial-gradient(
       ellipse 60% 50% at 30% 0%,
-      oklch(var(--ardo-brand-l) var(--ardo-brand-c) calc(var(--ardo-brand-h) + 30) / 0.1) 0%,
-      transparent 60%
-    ),
+      oklch(0.65 0.16 200 / 0.1) 0%,
+      transparent 60%),
     radial-gradient(
       ellipse 80% 50% at 70% -10%,
-      oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.2) 0%,
-      transparent 70%
-    ),
-    linear-gradient(180deg, var(--ardo-c-bg) 0%, var(--ardo-c-bg-soft) 100%);
-}
-
-.ardo-hero-container {
+      oklch(0.65 0.16 170 / 0.2) 0%,
+      transparent 70%),
+    linear-gradient(
+      180deg,
+      var(--ardo-color-bg) 0%,
+      var(--ardo-color-bgSoft) 100%);
+}
+.Hero_heroContainer__j780911 {
   max-width: 800px;
   margin: 0 auto;
   position: relative;
   z-index: 1;
 }
-
-.ardo-hero-image img {
+.Hero_heroAnimate__j780912 {
+  animation: animations_fadeInUp__1fj68r90 0.6s ease both;
+}
+.Hero_hero__j780910 img {
   max-width: 180px;
   margin-bottom: 40px;
-  filter: drop-shadow(
-    0 4px 20px oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.15)
-  );
+  filter: drop-shadow(0 4px 20px oklch(0.48 0.15 170 / 0.15));
 }
-
-.ardo-hero-version {
+.Hero_heroVersion__j780913 {
   display: inline-block;
   padding: 4px 14px;
   font-size: 13px;
   font-weight: 600;
-  color: var(--ardo-c-brand);
-  background: var(--ardo-c-brand-subtle);
-  border: 1px solid oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.15);
+  color: var(--ardo-color-brand);
+  background: var(--ardo-color-brandSubtle);
+  border: 1px solid oklch(0.48 0.15 170 / 0.15);
   border-radius: 999px;
   margin-bottom: 16px;
   letter-spacing: 0.02em;
 }
-
-.ardo-hero-name {
+.Hero_heroName__j780914 {
   font-size: 64px;
   font-weight: 800;
-  background: var(--ardo-c-brand-gradient);
+  background: var(--ardo-color-brandGradient);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
   letter-spacing: -0.03em;
   line-height: 1.1;
 }
-
-.ardo-hero-text {
+.Hero_heroText__j780915 {
   font-size: 48px;
   font-weight: 700;
   margin-top: 8px;
   letter-spacing: -0.02em;
   line-height: 1.15;
 }
-
-.ardo-hero-tagline {
+.Hero_heroTagline__j780916 {
   font-size: 18px;
-  color: var(--ardo-c-text-light);
+  color: var(--ardo-color-textLight);
   margin-top: 24px;
   max-width: 560px;
   margin-left: auto;
   margin-right: auto;
   line-height: 1.65;
 }
-
-.ardo-hero-actions {
+.Hero_heroActions__j780917 {
   display: flex;
   justify-content: center;
   gap: 16px;
   margin-top: 40px;
   flex-wrap: wrap;
 }
-
-.ardo-hero-action {
+.Hero_heroAction__j780918 {
   display: inline-flex;
   align-items: center;
   gap: 8px;
@@ -1706,591 +1413,220 @@ a.ardo-sidebar-text.active {
   font-size: 15px;
   font-weight: 600;
   text-decoration: none;
-  border-radius: var(--ardo-radius);
-  transition: all var(--ardo-transition);
+  border-radius: var(--ardo-radius-base);
+  transition: all var(--ardo-transition-base);
 }
-
-.ardo-hero-action-brand {
-  background: var(--ardo-c-brand);
+.Hero_heroActionBrand__j780919 {
+  background: var(--ardo-color-brand);
   color: white;
-  box-shadow: 0 4px 14px oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.3);
-}
-
-.ardo-hero-action-brand:hover {
-  background: var(--ardo-c-brand-dark);
-  box-shadow: 0 6px 20px oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.4);
+  box-shadow: 0 4px 14px oklch(0.48 0.15 170 / 0.3);
 }
-
-@media (hover: hover) {
-  .ardo-hero-action-brand:hover {
-    transform: translateY(-2px);
-  }
-}
-
-.ardo-hero-action-alt {
-  background: var(--ardo-c-bg);
-  color: var(--ardo-c-text);
-  border: 1px solid var(--ardo-c-border);
-}
-
-.ardo-hero-action-alt:hover {
-  border-color: var(--ardo-c-brand);
-  color: var(--ardo-c-brand);
-}
-
-/* ========================================
-   Features Section
-   ======================================== */
-.ardo-features {
-  padding: 80px 24px;
-  background: var(--ardo-c-bg-soft);
-  border-top: 1px solid var(--ardo-c-border);
-}
-
-.ardo-features-container {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
-  gap: 20px;
-  max-width: 1100px;
-  margin: 0 auto;
-}
-
-.ardo-feature {
-  padding: 28px;
-  background: var(--ardo-c-bg);
-  border-radius: var(--ardo-radius-lg);
-  border: 1px solid var(--ardo-c-border);
-  box-shadow: var(--ardo-shadow-sm);
-  transition: all var(--ardo-transition);
-  animation: ardo-fade-in-up 0.5s ease both;
-}
-
-.ardo-feature:nth-child(1) {
-  animation-delay: 0ms;
-}
-.ardo-feature:nth-child(2) {
-  animation-delay: 80ms;
-}
-.ardo-feature:nth-child(3) {
-  animation-delay: 160ms;
+.Hero_heroActionBrand__j780919:hover {
+  background: var(--ardo-color-brandDark);
+  box-shadow: 0 6px 20px oklch(0.48 0.15 170 / 0.4);
 }
-.ardo-feature:nth-child(4) {
-  animation-delay: 240ms;
+.Hero_heroActionAlt__j78091a {
+  background: var(--ardo-color-bg);
+  color: var(--ardo-color-text);
+  border: 1px solid var(--ardo-color-border);
 }
-.ardo-feature:nth-child(5) {
-  animation-delay: 320ms;
+.Hero_heroActionAlt__j78091a:hover {
+  border-color: var(--ardo-color-brand);
+  color: var(--ardo-color-brand);
 }
-.ardo-feature:nth-child(6) {
-  animation-delay: 400ms;
-}
-
-.ardo-feature:hover {
-  border-color: oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.4);
-  box-shadow:
-    var(--ardo-shadow-md),
-    0 0 0 1px oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.1);
+@media (max-width: 768px) {
+  .Hero_hero__j780910 {
+    padding: 60px 20px;
+  }
+  .Hero_heroName__j780914 {
+    font-size: 40px;
+  }
+  .Hero_heroText__j780915 {
+    font-size: 28px;
+  }
+  .Hero_heroTagline__j780916 {
+    font-size: 16px;
+  }
 }
-
 @media (hover: hover) {
-  .ardo-feature:hover {
-    transform: translateY(-3px);
+  .Hero_heroActionBrand__j780919:hover {
+    transform: translateY(-2px);
   }
 }
-
-.ardo-feature-icon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 48px;
-  height: 48px;
-  margin-bottom: 16px;
-  background: var(--ardo-c-brand-subtle);
-  border: 1px solid oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.12);
-  border-radius: 50%;
-  color: var(--ardo-c-brand);
-  transition: all var(--ardo-transition);
-}
-
-.ardo-feature:hover .ardo-feature-icon {
-  background: var(--ardo-c-brand);
-  color: white;
-  border-color: transparent;
-}
-
-.ardo-feature-title {
-  font-size: 17px;
-  font-weight: 600;
-  margin-bottom: 10px;
-  letter-spacing: -0.01em;
-}
-
-.ardo-feature-details {
-  font-size: 14px;
-  color: var(--ardo-c-text-light);
-  line-height: 1.6;
-  margin-bottom: 12px;
-}
-
-.ardo-feature-link {
-  font-size: 14px;
-  font-weight: 500;
-  color: var(--ardo-c-brand);
-  text-decoration: none;
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-  transition: gap var(--ardo-transition-fast);
-}
-
-.ardo-feature-link:hover {
-  gap: 8px;
+@media (prefers-reduced-motion: reduce) {
+  .Hero_heroAnimate__j780912 {
+    animation: none;
+  }
+  .Hero_heroActionBrand__j780919:hover {
+    transform: none;
+  }
 }
 
-.ardo-feature-link::after {
-  content: "\2192";
+/* vanilla-extract-css-ns:src/ui/components/Features.css.ts.vanilla.css?source=#H4sIAAAAAAAAA7VWTY_bNhC9768gAhSwgaVLybKs1V4KtCgSIDltcihQwKDFkcSsRKoknVVa7H8PSMlayaZiL9CFDvqa4XszHM681Z9AzUGB3uXHh12w-Qfu9g1B_90g1FDGuChSlJCmRWHUtPc3CO1p9lgoeRAsRd-oWmBMFZM4k5VUeF88yNwsnZ1UDBQ2sklR0LRIy4ozj4czW97fPN-szgi9B8pADbQCR8tAazCteCFSlIEwoCxcTVXBBd5LY2SdoiixbH1rfuamgmHJ0C2ZS2Gw5v9CitZxF6b79AS8KE2KtoTYbxUYAwrrhmYuL5isSAi1Bz4I5-AfDnszYbA-ZRAkHQOXH0-ObfwfLa9lB9ziJ85MmaJNTDrPjkyKCKIHI_08fpfCUC5G2Y0cEcZ1U9HvKSoUZ3Yxe8cG6qaiBiyFQy10ihQ0QM3CAuCcm1tUc1HTdhFaErcoyNXS8Stok6JwIDaQDQJyPduB42ZamGFyVU2O61FRxg96YtZ9wtXY7rqatdYt1iVl8smD3P14qJ2lUVRobrgUKaJVNbZ--YX3VIMzp4LXtLc-PupdThl8EF-a3S7Iv8aJuiOIrDYaAdWA9tKUF9KXlvIbKJfEPh99lcnHKisXZBUliKyCDQq2BP2KyCq6NspPbHmLiLts5ubWC2ZOuq8cfxaHMCXOSl6xRbB04QxJwgxc_ZJa_99Q4QxU8gZY6xmsIH4DsGgGLIzeAGwzA7YO3wAsngGLyBzYh0yKYal42hPzCly_cdMHcwO1Hs-grwdteP4dZ1IYEGb8q-96Ud-wyn6wHN9Px0d8TV9TVDA7TiqYaVyzhzD0dcQN-eVnY8fBvb6TXdOOrtmDy6lYjtg_ldzA_VmXc_QaqkAYL7OpNtieTeatRxvEnTY43cF-uPkkQ2Algwf9DzCUVy8qLDnDj16jDCouAB8LLVjFr5EpH7l4HHjczfGY5GHT5eGK8rH6jUEmVT_fhBRur4ZjxoXjfuG0OWXRMxmXZEGbmZLMqTb-kpzGO5qSDmROS554pTQ3vdvQAd79HQZ34Tvr_lsNjFO0GImgbZw0bdehzpveiRofyR7bNYYe8ex19qncyR4epZPffUalTqtgIPASm0tcitxtJi6vGOl3MJeq7k-pVZt_LfC6aZenII2CHJTGCtghA4Zr2W18934RtgccCaxjAXpzcZnvi_vzD2POg09UDQAA */
+.Features_features__15qe9bp0 {
+  padding: 80px 24px;
+  background: var(--ardo-color-bgSoft);
+  border-top: 1px solid var(--ardo-color-border);
 }
-
-/* Features title and subtitle */
-.ardo-features-header {
+.Features_featuresHeader__15qe9bp1 {
   text-align: center;
   margin-bottom: 48px;
 }
-
-.ardo-features-title {
+.Features_featuresTitle__15qe9bp2 {
   font-size: 36px;
   font-weight: 700;
   letter-spacing: -0.02em;
   margin-bottom: 12px;
 }
-
-.ardo-features-subtitle {
+.Features_featuresSubtitle__15qe9bp3 {
   font-size: 18px;
-  color: var(--ardo-c-text-light);
+  color: var(--ardo-color-textLight);
   max-width: 560px;
   margin: 0 auto;
 }
-
-/* ========================================
-   Home Page Sections
-   ======================================== */
-.ardo-home-section {
-  padding: 80px 24px;
-}
-
-.ardo-home-section-alt {
-  background: var(--ardo-c-bg-soft);
-}
-
-.ardo-home-section-container {
+.Features_featuresContainer__15qe9bp4 {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+  gap: 20px;
   max-width: 1100px;
   margin: 0 auto;
 }
-
-.ardo-home-section-title {
-  font-size: 36px;
-  font-weight: 700;
-  text-align: center;
-  letter-spacing: -0.02em;
-  margin-bottom: 12px;
-}
-
-.ardo-home-section-subtitle {
-  font-size: 18px;
-  color: var(--ardo-c-text-light);
-  text-align: center;
-  max-width: 560px;
-  margin: 0 auto 48px;
-}
-
-/* ========================================
-   Terminal Section
-   ======================================== */
-.ardo-home-terminal {
-  max-width: 600px;
-  margin: 0 auto;
-  border-radius: var(--ardo-radius-lg);
-  overflow: hidden;
-  background: #1e1e1e;
-  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
-}
-
-.dark .ardo-home-terminal {
-  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
-}
-
-.ardo-home-terminal-header {
-  display: flex;
-  gap: 8px;
-  padding: 14px 16px;
-  background: #323232;
-}
-
-.ardo-home-terminal-dot {
-  width: 12px;
-  height: 12px;
-  border-radius: 50%;
-  background: #ff5f56;
-}
-
-.ardo-home-terminal-dot:nth-child(2) {
-  background: #ffbd2e;
-}
-
-.ardo-home-terminal-dot:nth-child(3) {
-  background: #27ca40;
-}
-
-.ardo-home-terminal-body {
-  padding: 20px 24px;
-  font-family: var(--ardo-font-mono);
-  font-size: 14px;
-  line-height: 1.8;
-  color: #e0e0e0;
-}
-
-.ardo-home-terminal-prompt {
-  color: #27ca40;
-  margin-right: 8px;
-}
-
-.ardo-home-terminal-success {
-  color: #27ca40;
-}
-
-.ardo-home-terminal-link {
-  color: #61afef;
-}
-
-/* ========================================
-   Code Example Section
-   ======================================== */
-.ardo-home-code-example {
-  max-width: 700px;
-  margin: 0 auto;
-}
-
-.ardo-home-code-block {
+.Features_feature__15qe9bp5 {
+  padding: 28px;
+  background: var(--ardo-color-bg);
   border-radius: var(--ardo-radius-lg);
-  overflow: hidden;
-  background: var(--ardo-code-bg);
-  border: 1px solid var(--ardo-code-border);
-  box-shadow: var(--ardo-code-shadow);
-}
-
-.ardo-home-code-header {
-  padding: 12px 16px;
-  background: var(--ardo-code-border);
-  font-size: 13px;
-  font-weight: 500;
-  font-family: var(--ardo-font-mono);
-  color: var(--ardo-c-text-light);
-  border-bottom: 1px solid var(--ardo-code-border);
+  border: 1px solid var(--ardo-color-border);
+  box-shadow: var(--ardo-color-shadowSm);
+  transition: all var(--ardo-transition-base);
+  animation: animations_fadeInUp__1fj68r90 0.5s ease both;
 }
-
-.ardo-home-code-content {
-  padding: 20px 24px;
-  margin: 0;
-  overflow-x: auto;
-  font-family: var(--ardo-font-mono);
-  font-size: 14px;
-  line-height: 1.7;
-  color: var(--ardo-c-text);
-}
-
-.dark .ardo-home-code-content {
-  color: #e2e8f0;
-}
-
-/* ========================================
-   Comparison Table Section
-   ======================================== */
-.ardo-home-comparison {
-  overflow-x: auto;
-}
-
-.ardo-home-comparison-table {
-  width: 100%;
-  border-collapse: collapse;
-  font-size: 14px;
-  min-width: 600px;
-}
-
-.ardo-home-comparison-table th,
-.ardo-home-comparison-table td {
-  padding: 14px 18px;
-  text-align: center;
-  border: 1px solid var(--ardo-c-border);
-}
-
-.ardo-home-comparison-table th {
-  background: var(--ardo-c-bg-soft);
-  font-weight: 600;
-  font-size: 15px;
-}
-
-.ardo-home-comparison-table td:first-child {
-  text-align: left;
-  font-weight: 500;
-  background: var(--ardo-c-bg-soft);
-}
-
-.ardo-home-comparison-highlight {
-  background: var(--ardo-c-brand-subtle) !important;
-}
-
-.ardo-home-comparison-table th.ardo-home-comparison-highlight {
-  color: var(--ardo-c-brand);
-}
-
-.ardo-home-check {
-  color: var(--ardo-c-tip);
-}
-
-.ardo-home-x {
-  color: var(--ardo-c-text-lighter);
+.Features_feature__15qe9bp5:hover {
+  border-color: oklch(0.48 0.15 170 / 0.4);
+  box-shadow: var(--ardo-color-shadowMd), 0 0 0 1px oklch(0.48 0.15 170 / 0.1);
 }
-
-.ardo-home-comparison-cta {
-  text-align: center;
-  margin-top: 24px;
-}
-
-.ardo-home-link {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-  color: var(--ardo-c-brand);
-  font-weight: 500;
-  text-decoration: none;
-  transition: gap var(--ardo-transition-fast);
+.Features_featuresContainer__15qe9bp4 .Features_feature__15qe9bp5:nth-child(1) {
+  animation-delay: 0ms;
 }
-
-.ardo-home-link:hover {
-  gap: 10px;
+.Features_featuresContainer__15qe9bp4 .Features_feature__15qe9bp5:nth-child(2) {
+  animation-delay: 80ms;
 }
-
-/* ========================================
-   Tech Stack Grid
-   ======================================== */
-.ardo-home-tech-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
-  gap: 20px;
-  max-width: 800px;
-  margin: 0 auto;
+.Features_featuresContainer__15qe9bp4 .Features_feature__15qe9bp5:nth-child(3) {
+  animation-delay: 160ms;
 }
-
-.ardo-home-tech-item {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 12px;
-  padding: 24px 16px;
-  background: var(--ardo-c-bg);
-  border-radius: var(--ardo-radius-lg);
-  border: 1px solid var(--ardo-c-border);
-  transition: all var(--ardo-transition);
+.Features_featuresContainer__15qe9bp4 .Features_feature__15qe9bp5:nth-child(4) {
+  animation-delay: 240ms;
 }
-
-.ardo-home-tech-item:hover {
-  border-color: var(--ardo-c-brand);
+.Features_featuresContainer__15qe9bp4 .Features_feature__15qe9bp5:nth-child(5) {
+  animation-delay: 320ms;
 }
-
-@media (hover: hover) {
-  .ardo-home-tech-item:hover {
-    transform: translateY(-2px);
-  }
+.Features_featuresContainer__15qe9bp4 .Features_feature__15qe9bp5:nth-child(6) {
+  animation-delay: 400ms;
 }
-
-.ardo-home-tech-icon {
+.Features_featureIcon__15qe9bp6 {
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 56px;
-  height: 56px;
-  background: var(--ardo-c-brand-subtle);
-  border-radius: var(--ardo-radius);
-  color: var(--ardo-c-brand);
-}
-
-.ardo-home-tech-item span {
-  font-weight: 600;
-  font-size: 14px;
-}
-
-/* ========================================
-   CTA Section
-   ======================================== */
-.ardo-home-cta-section {
-  background: linear-gradient(180deg, var(--ardo-c-bg) 0%, var(--ardo-c-brand-subtle) 100%);
-}
-
-.dark .ardo-home-cta-section {
-  background: linear-gradient(
-    180deg,
-    var(--ardo-c-bg) 0%,
-    oklch(0.18 0.04 var(--ardo-brand-h)) 100%
-  );
-}
-
-.ardo-home-cta-buttons {
-  display: flex;
-  justify-content: center;
-  gap: 16px;
-  flex-wrap: wrap;
-}
-
-.ardo-home-cta-primary,
-.ardo-home-cta-secondary {
-  display: inline-flex;
-  align-items: center;
-  gap: 10px;
-  padding: 16px 32px;
-  font-size: 16px;
-  font-weight: 600;
-  text-decoration: none;
-  border-radius: var(--ardo-radius);
-  transition: all var(--ardo-transition);
+  width: 48px;
+  height: 48px;
+  margin-bottom: 16px;
+  background: var(--ardo-color-brandSubtle);
+  border: 1px solid oklch(0.48 0.15 170 / 0.12);
+  border-radius: 50%;
+  color: var(--ardo-color-brand);
+  transition: all var(--ardo-transition-base);
 }
-
-.ardo-home-cta-primary {
-  background: var(--ardo-c-brand);
+.Features_feature__15qe9bp5:hover .Features_featureIcon__15qe9bp6 {
+  background: var(--ardo-color-brand);
   color: white;
+  border-color: transparent;
 }
-
-.ardo-home-cta-primary:hover {
-  background: var(--ardo-c-brand-dark);
-  box-shadow: 0 8px 24px oklch(var(--ardo-brand-l) var(--ardo-brand-c) var(--ardo-brand-h) / 0.3);
+.Features_featureTitle__15qe9bp7 {
+  font-size: 17px;
+  font-weight: 600;
+  margin-bottom: 10px;
+  letter-spacing: -0.01em;
 }
-
-@media (hover: hover) {
-  .ardo-home-cta-primary:hover {
-    transform: translateY(-2px);
-  }
+.Features_featureDetails__15qe9bp8 {
+  font-size: 14px;
+  color: var(--ardo-color-textLight);
+  line-height: 1.6;
+  margin-bottom: 12px;
 }
-
-.ardo-home-cta-secondary {
-  background: var(--ardo-c-bg);
-  color: var(--ardo-c-text);
-  border: 1px solid var(--ardo-c-border);
+.Features_featureLink__15qe9bp9 {
+  font-size: 14px;
+  font-weight: 500;
+  color: var(--ardo-color-brand);
+  text-decoration: none;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  transition: gap var(--ardo-transition-fast);
 }
-
-.ardo-home-cta-secondary:hover {
-  border-color: var(--ardo-c-brand);
-  color: var(--ardo-c-brand);
+.Features_featureLink__15qe9bp9:hover {
+  gap: 8px;
 }
-
-/* Responsive */
-@media (max-width: 1024px) {
-  .ardo-doc-page {
-    padding-left: 0;
-  }
+.Features_featureLink__15qe9bp9::after {
+  content: "\2192";
 }
-
 @media (max-width: 768px) {
-  .ardo-hero {
-    padding: 60px 20px;
-  }
-
-  .ardo-hero-name {
-    font-size: 40px;
-  }
-
-  .ardo-hero-text {
-    font-size: 28px;
-  }
-
-  .ardo-hero-tagline {
-    font-size: 16px;
-  }
-
-  .ardo-features {
-    padding: 48px 16px;
-  }
-
-  .ardo-home-section {
+  .Features_features__15qe9bp0 {
     padding: 48px 16px;
   }
-
-  .ardo-home-section-title {
-    font-size: 28px;
-  }
-
-  .ardo-home-section-subtitle {
-    font-size: 16px;
-    margin-bottom: 32px;
-  }
-
-  .ardo-features-title {
+  .Features_featuresTitle__15qe9bp2 {
     font-size: 28px;
   }
-
-  .ardo-features-subtitle {
+  .Features_featuresSubtitle__15qe9bp3 {
     font-size: 16px;
   }
-
-  .ardo-home-terminal-body {
-    font-size: 12px;
-    padding: 16px;
+}
+@media (hover: hover) {
+  .Features_feature__15qe9bp5:hover {
+    transform: translateY(-3px);
   }
-
-  .ardo-home-tech-grid {
-    grid-template-columns: repeat(2, 1fr);
+}
+@media (prefers-reduced-motion: reduce) {
+  .Features_feature__15qe9bp5 {
+    animation: none;
   }
-
-  .ardo-home-cta-primary,
-  .ardo-home-cta-secondary {
-    width: 100%;
-    justify-content: center;
+  .Features_feature__15qe9bp5:hover {
+    transform: none;
   }
 }
 
-/* ================================
-   API Documentation Styles
-   ================================ */
-
-/* API Item */
-.ardo-api-item {
+/* vanilla-extract-css-ns:src/ui/components/ApiItem.css.ts.vanilla.css?source=#H4sIAAAAAAAAA91YS2_jNhC-51cQWBRogCqgnpaV03a3RYsu2qLJPRiRQ5u1JKoUncS76H8vJEuyZDGSXWwvPcWhOPPxmxnOg3fvS_mzwfwJ2r9Pn2HHXKTkyw0hOeiNLBLixeUrofc3hJTAuSw2TqqMUfnxS72eKs1R98tu-UoqlUlOnkF_6ziguXKYylS9pd55e3_z983dW-BJBpVx2FZmvDnHmfZCFWiTf5Qmw06J20hyWZUZHBIiMmwOCpncFI40mFcJYVgY1PXyBsqEuN6RzJH2iUyzPIX7FfIezWvQhCqMIyCX2SEZMm_Wc1Wo2_tu1wvKzdYkJKL0XPf7gm2V7jT7jebGdsnUmgZfzadaU2NSQur_HY5MaTBSFZ2tCFElMGkOCaF3QbNRQ1HJ457221D76bMjoDJWd43NnWzVM2qyRGRwjtim9CNWTMuyRu4Eg8sscGtzXXT0aCYLdLatyd276Bz5e-Cbnko4jhxZNNJdALU3ICF--UpcetTfuLSSnzEhrjtYGnm59U5jWqF0npB9WaJmUDUeytAY1E5VG6jWT-9oiPngcmngcl-NTHBccqr89rRvcPvsNHey4E8sg6rqGEfHWwZst9FqX_CEvEMhIiEG6K3936WCp6I5cLfiYkBBNFgc9I78S0QXfYjBguinsSeiIeLaZ6GYYyfrey2A9T5dWRgywUVowYOV8Dkd4tEoFEG0yPASVBoF6KcWVJem69gdokaIq3Q1w9Icyh4qnkIJIVK0QQmO0dHSvUG9gFJcJLgAuIr9kNpiRoRrpOkQUDDuB3MexGLf14O1hVsofGt4cs6jcXiGqeemy85bAAyYy9e2aInTkI2jkwXpfHSKfcGGCQ4s_LjwRGwzZcoExiPfcXfVmnKO3wWgse_GgW8BRRbE6_XIf2uIeTDDMUezVbwDSy0MqVjbEwxgVJtvcP38aA3uIsNFSMoCiNACSRFCHPFbce4LNsOv1KpEbQ4dHLMwBBFaGeKatx96OOYDLvvwAtAwdlm8smW1OAzFajlOH-SmALPX_UXno1awrqhk0rL0Qh8U7wWxEezrZVeLh8eddoebByWMvZrN9JIX1MgUKmx21m2KyNSL85oQ2Bt1f13j1lb5wNpYhOeG-QUPL0r3QSmGrcw7JjzPeyPrzgoKsUpX3jnWj-0NH_alm5Fc7IWUv1Gpl6W5B7EQ56iPhxJ_Bw15X9u3IykahhTeILkku1ozOkUcS8jF7nDSvP6BZq-Lx0Ex-_PiIy_J2o_8gI1tRx3z7jQytDHlf_XO8dKxoW2bjSoT4gUXT0GPkJ74ZA2fF8nNNiEupd_cD9OG102Qp7SUQVlhQrpf1hs2i2e235G5z_wsAdVn6C7uddmlMX8zOiYkQ2EWDzZJzHOZzubwoSXasfQ_jYFZPkxxtEfrWOy3Zm6DrJPMJ0LtcHRlXNYmT0g0BfyIAvaZ6fCK8eSWZortzsM7mE5s3jWHsqWSPhmpC2rlD6-Qlxn2MuXlMp3IXyOR88eZ_2WpPcunaq9PY5YemOPo5M4AX8nL53AwW3NSDQWfe41ZUN6-pHyxKdgXHHXddJxr-UmiBs22fW9YXRBWvdAnWfWXyDSCmayMU5lDhqc3pD6-LlWUyesf4WJr9bHc_RMmpNinnP0k5Vzld0JyWTinIjaF_VC_Smrs56jnSfB1BbR7Kz1mL4-OXkrbxavfSZvmBw3qPn-82B39D_FNZVbaFQAA */
+.ApiItem_apiItem__zakc1e0 {
   margin: 28px 0;
   padding-bottom: 28px;
-  border-bottom: 1px solid var(--ardo-c-border);
+  border-bottom: 1px solid var(--ardo-color-border);
 }
-
-.ardo-api-item:last-child {
+.ApiItem_apiItem__zakc1e0:last-child {
   border-bottom: none;
 }
-
-.ardo-api-item-title {
+.ApiItem_apiItemTitle__zakc1e1 {
   display: flex;
   align-items: center;
   gap: 12px;
   margin-bottom: 12px;
 }
-
-.ardo-api-item-name {
+.ApiItem_apiItemName__zakc1e2 {
   font-family: var(--ardo-font-mono);
   font-weight: 600;
 }
-
-.ardo-api-anchor {
-  color: var(--ardo-c-text-lighter);
+.ApiItem_apiAnchor__zakc1e3 {
+  color: var(--ardo-color-textLighter);
   text-decoration: none;
   opacity: 0.4;
   transition: opacity var(--ardo-transition-fast);
 }
-
-.ardo-api-item-title:hover .ardo-api-anchor {
+.ApiItem_apiItemTitle__zakc1e1:hover .ApiItem_apiAnchor__zakc1e3 {
   opacity: 0.8;
 }
-
-.ardo-api-item-description {
-  color: var(--ardo-c-text-light);
+.ApiItem_apiItemDescription__zakc1e4 {
+  color: var(--ardo-color-textLight);
   margin-bottom: 16px;
   line-height: 1.6;
 }
-
-/* API Badges */
-.ardo-api-badge {
+.ApiItem_apiBadge__zakc1e5 {
   display: inline-flex;
   padding: 3px 10px;
   font-size: 11px;
@@ -2300,565 +1636,211 @@ a.ardo-sidebar-text.active {
   border-radius: var(--ardo-radius-sm);
   border: 1px solid;
 }
-
-.ardo-api-badge-class {
+.ApiItem_apiBadge_kind_class__zakc1e6 {
   background: #eff6ff;
   border-color: #bfdbfe;
   color: #1e40af;
 }
-
-.dark .ardo-api-badge-class {
+.dark .ApiItem_apiBadge_kind_class__zakc1e6 {
   background: #1e3a8a;
   border-color: #3b82f6;
   color: #93c5fd;
 }
-
-.ardo-api-badge-interface {
+.ApiItem_apiBadge_kind_interface__zakc1e7 {
   background: #ecfdf5;
   border-color: #a7f3d0;
   color: #065f46;
 }
-
-.dark .ardo-api-badge-interface {
+.dark .ApiItem_apiBadge_kind_interface__zakc1e7 {
   background: #064e3b;
   border-color: #10b981;
   color: #6ee7b7;
 }
-
-.ardo-api-badge-type {
+.ApiItem_apiBadge_kind_type__zakc1e8 {
   background: #fffbeb;
   border-color: #fde68a;
   color: #92400e;
 }
-
-.dark .ardo-api-badge-type {
+.dark .ApiItem_apiBadge_kind_type__zakc1e8 {
   background: #78350f;
   border-color: #f59e0b;
   color: #fcd34d;
 }
-
-.ardo-api-badge-enum {
+.ApiItem_apiBadge_kind_enum__zakc1e9 {
   background: #f5f3ff;
   border-color: #ddd6fe;
   color: #5b21b6;
 }
-
-.dark .ardo-api-badge-enum {
+.dark .ApiItem_apiBadge_kind_enum__zakc1e9 {
   background: #4c1d95;
   border-color: #8b5cf6;
   color: #c4b5fd;
 }
-
-.ardo-api-badge-function {
+.ApiItem_apiBadge_kind_function__zakc1ea {
   background: #fdf2f8;
   border-color: #fbcfe8;
   color: #9d174d;
 }
-
-.dark .ardo-api-badge-function {
+.dark .ApiItem_apiBadge_kind_function__zakc1ea {
   background: #831843;
   border-color: #ec4899;
   color: #f9a8d4;
 }
-
-.ardo-api-badge-method {
+.ApiItem_apiBadge_kind_method__zakc1eb {
   background: #f0f9ff;
   border-color: #bae6fd;
   color: #0369a1;
 }
-
-.dark .ardo-api-badge-method {
+.dark .ApiItem_apiBadge_kind_method__zakc1eb {
   background: #0c4a6e;
   border-color: #0ea5e9;
   color: #7dd3fc;
 }
-
-.ardo-api-badge-property {
+.ApiItem_apiBadge_kind_property__zakc1ec {
   background: #faf5ff;
   border-color: #e9d5ff;
   color: #7c3aed;
 }
-
-.dark .ardo-api-badge-property {
+.dark .ApiItem_apiBadge_kind_property__zakc1ec {
   background: #581c87;
   border-color: #a855f7;
   color: #c4b5fd;
 }
-
-/* API Signature */
-.ardo-api-signature {
+.ApiItem_apiSignature__zakc1ed {
   margin: 16px 0;
 }
-
-.ardo-api-signature-code {
+.ApiItem_apiSignatureCode__zakc1ee {
   padding: 16px;
-  background: var(--ardo-c-bg-soft);
-  border: 1px solid var(--ardo-c-border);
-  border-radius: var(--ardo-radius);
+  background: var(--ardo-color-bgSoft);
+  border: 1px solid var(--ardo-color-border);
+  border-radius: var(--ardo-radius-base);
   overflow-x: auto;
   font-family: var(--ardo-font-mono);
   font-size: 14px;
   line-height: 1.5;
 }
-
-.ardo-api-keyword {
+.ApiItem_apiKeyword__zakc1ef {
   color: #cf222e;
 }
-
-.dark .ardo-api-keyword {
+.dark .ApiItem_apiKeyword__zakc1ef {
   color: #ff7b72;
 }
-
-.ardo-api-function-name {
+.ApiItem_apiFunctionName__zakc1eg {
   color: #8250df;
 }
-
-.dark .ardo-api-function-name {
+.dark .ApiItem_apiFunctionName__zakc1eg {
   color: #d2a8ff;
 }
-
-.ardo-api-type-params {
+.ApiItem_apiTypeParams__zakc1eh {
   color: #0550ae;
 }
-
-.dark .ardo-api-type-params {
+.dark .ApiItem_apiTypeParams__zakc1eh {
   color: #79c0ff;
 }
-
-.ardo-api-params {
-  color: var(--ardo-c-text);
+.ApiItem_apiParams__zakc1ei {
+  color: var(--ardo-color-text);
 }
-
-.ardo-api-return-type {
+.ApiItem_apiReturnType__zakc1ej {
   color: #0550ae;
 }
-
-.dark .ardo-api-return-type {
+.dark .ApiItem_apiReturnType__zakc1ej {
   color: #79c0ff;
 }
-
-/* API Section Titles */
-.ardo-api-section-title {
+.ApiItem_apiSectionTitle__zakc1ek {
   font-size: 13px;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.05em;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
   margin-top: 24px;
   margin-bottom: 12px;
 }
-
-/* API Tables */
-.ardo-api-table {
+.ApiItem_apiTable__zakc1el {
   width: 100%;
   margin: 12px 0;
   border-collapse: collapse;
   font-size: 14px;
 }
-
-.ardo-api-table th,
-.ardo-api-table td {
+.ApiItem_apiTable__zakc1el th,
+.ApiItem_apiTable__zakc1el td {
   padding: 12px 14px;
-  border: 1px solid var(--ardo-c-border);
+  border: 1px solid var(--ardo-color-border);
   text-align: left;
 }
-
-.ardo-api-table th {
-  background: var(--ardo-c-bg-soft);
+.ApiItem_apiTable__zakc1el th {
+  background: var(--ardo-color-bgSoft);
   font-weight: 600;
   font-size: 12px;
   text-transform: uppercase;
   letter-spacing: 0.05em;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
 }
-
-.ardo-api-table code {
+.ApiItem_apiTable__zakc1el code {
   font-size: 13px;
 }
-
-.ardo-api-optional {
+.ApiItem_apiOptional__zakc1em {
   font-size: 11px;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
   margin-left: 6px;
 }
-
-.ardo-api-default {
+.ApiItem_apiDefault__zakc1en {
   display: block;
   margin-top: 4px;
   font-size: 12px;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
 }
-
-/* API Returns */
-.ardo-api-returns {
+.ApiItem_apiReturns__zakc1eo {
   margin: 16px 0;
 }
-
-.ardo-api-returns code {
-  font-size: 14px;
-}
-
-/* API Examples */
-.ardo-api-examples {
+.ApiItem_apiExamples__zakc1ep {
   margin: 16px 0;
 }
-
-.ardo-api-example {
+.ApiItem_apiExample__zakc1eq {
   margin: 8px 0;
   padding: 16px;
-  background: var(--ardo-c-bg-soft);
-  border: 1px solid var(--ardo-c-border);
-  border-radius: var(--ardo-radius);
+  background: var(--ardo-color-bgSoft);
+  border: 1px solid var(--ardo-color-border);
+  border-radius: var(--ardo-radius-base);
   overflow-x: auto;
   font-family: var(--ardo-font-mono);
   font-size: 14px;
 }
-
-/* API Source Link */
-.ardo-api-source {
+.ApiItem_apiSource__zakc1er {
   margin-top: 16px;
   font-size: 12px;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
 }
-
-.ardo-api-source a {
-  color: var(--ardo-c-brand);
+.ApiItem_apiSource__zakc1er a {
+  color: var(--ardo-color-brand);
   text-decoration: none;
 }
-
-.ardo-api-source a:hover {
+.ApiItem_apiSource__zakc1er a:hover {
   text-decoration: underline;
 }
-
-/* API Hierarchy */
-.ardo-api-hierarchy {
+.ApiItem_apiHierarchy__zakc1es {
   margin: 16px 0;
 }
-
-.ardo-api-hierarchy-list {
+.ApiItem_apiHierarchyList__zakc1et {
   list-style: none;
   padding: 0;
 }
-
-.ardo-api-hierarchy-list li {
+.ApiItem_apiHierarchyList__zakc1et li {
   display: flex;
   align-items: center;
   gap: 8px;
   margin-bottom: 6px;
 }
-
-.ardo-api-hierarchy-label {
+.ApiItem_apiHierarchyLabel__zakc1eu {
   font-size: 12px;
-  color: var(--ardo-c-text-lighter);
+  color: var(--ardo-color-textLighter);
   min-width: 100px;
 }
-
-/* API Children (nested items) */
-.ardo-api-children {
+.ApiItem_apiChildren__zakc1ev {
   margin-top: 24px;
   padding-left: 20px;
-  border-left: 2px solid var(--ardo-c-border);
+  border-left: 2px solid var(--ardo-color-border);
 }
-
-/* API Parameters */
-.ardo-api-parameters {
+.ApiItem_apiParameters__zakc1ew {
   margin: 16px 0;
 }
-
-/* ========================================
-   Animations
-   ======================================== */
-@keyframes ardo-fade-in-up {
-  from {
-    opacity: 0;
-    transform: translateY(20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-.ardo-hero-animate {
-  animation: ardo-fade-in-up 0.6s ease both;
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ardo-feature,
-  .ardo-hero-animate {
-    animation: none;
-  }
-
-  .ardo-feature:hover,
-  .ardo-prev-link:hover,
-  .ardo-next-link:hover,
-  .ardo-hero-action-brand:hover,
-  .ardo-home-tech-item:hover,
-  .ardo-home-cta-primary:hover {
-    transform: none;
-  }
-}
-
-/* ========================================
-   Skip Link - Accessibility
-   ======================================== */
-.ardo-skip-link {
-  position: absolute;
-  top: -100%;
-  left: 16px;
-  z-index: 200;
-  padding: 12px 24px;
-  background: var(--ardo-c-brand);
-  color: white;
-  font-weight: 600;
-  font-size: 14px;
-  text-decoration: none;
-  border-radius: var(--ardo-radius);
-  box-shadow: var(--ardo-shadow-md);
-}
-
-.ardo-skip-link:focus {
-  top: 16px;
-}
-
-/* ========================================
-   Focus States - Accessibility
-   ======================================== */
-:focus-visible {
-  outline: 2px solid var(--ardo-c-brand);
-  outline-offset: 2px;
-}
-
-button:focus-visible,
-a:focus-visible {
-  outline: 2px solid var(--ardo-c-brand);
-  outline-offset: 2px;
-}
-
-/* ========================================
-   Icons (CSS mask-image, colored via currentColor)
-   ======================================== */
-.ardo-icon {
-  display: inline-block;
-  flex-shrink: 0;
-  background: currentColor;
-  mask-size: contain;
-  mask-repeat: no-repeat;
-  mask-position: center;
-}
-
-.ardo-icon-github {
-  mask-image: url("./icons/github.svg");
-}
-.ardo-icon-twitter {
-  mask-image: url("./icons/twitter.svg");
-}
-.ardo-icon-message-circle {
-  mask-image: url("./icons/message-circle.svg");
-}
-.ardo-icon-linkedin {
-  mask-image: url("./icons/linkedin.svg");
-}
-.ardo-icon-youtube {
-  mask-image: url("./icons/youtube.svg");
-}
-.ardo-icon-package {
-  mask-image: url("./icons/package.svg");
-}
-.ardo-icon-sun {
-  mask-image: url("./icons/sun.svg");
-}
-.ardo-icon-moon {
-  mask-image: url("./icons/moon.svg");
-}
-.ardo-icon-monitor {
-  mask-image: url("./icons/monitor.svg");
-}
-.ardo-icon-lightbulb {
-  mask-image: url("./icons/lightbulb.svg");
-}
-.ardo-icon-alert-triangle {
-  mask-image: url("./icons/alert-triangle.svg");
-}
-.ardo-icon-x-circle {
-  mask-image: url("./icons/x-circle.svg");
-}
-.ardo-icon-info {
-  mask-image: url("./icons/info.svg");
-}
-.ardo-icon-file-text {
-  mask-image: url("./icons/file-text.svg");
-}
-.ardo-icon-copy {
-  mask-image: url("./icons/copy.svg");
-}
-.ardo-icon-check {
-  mask-image: url("./icons/check.svg");
-}
-.ardo-icon-chevron-down {
-  mask-image: url("./icons/chevron-down.svg");
-}
-.ardo-icon-search {
-  mask-image: url("./icons/search.svg");
-}
-.ardo-icon-folder {
-  mask-image: url("./icons/folder.svg");
-}
-
-/* ========================================
-   Steps Component
-   ======================================== */
-.ardo-steps {
-  margin: 24px 0;
-}
-
-.ardo-steps ol {
-  list-style: none;
-  padding-left: 0;
-  counter-reset: ardo-step;
-}
-
-.ardo-steps ol > li {
-  position: relative;
-  padding-left: 48px;
-  padding-bottom: 24px;
-  counter-increment: ardo-step;
-  margin-bottom: 0;
-}
-
-.ardo-steps ol > li:last-child {
-  padding-bottom: 0;
-}
-
-/* Step number badge */
-.ardo-steps ol > li::before {
-  content: counter(ardo-step);
-  position: absolute;
-  left: 0;
-  top: 2px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 32px;
-  border-radius: 50%;
-  background: var(--ardo-c-brand);
-  color: white;
-  font-size: 14px;
-  font-weight: 700;
-  line-height: 1;
-  flex-shrink: 0;
-}
-
-/* Vertical connecting line */
-.ardo-steps ol > li::after {
-  content: "";
-  position: absolute;
-  left: 15px;
-  top: 38px;
-  bottom: 0;
-  width: 2px;
-  background: var(--ardo-c-border);
-}
-
-.ardo-steps ol > li:last-child::after {
-  display: none;
-}
-
-/* Override inherited content styles */
-.ardo-content .ardo-steps ol {
-  padding-left: 0;
-  max-width: none;
-}
-
-.ardo-content .ardo-steps ol > li {
-  padding-left: 48px;
-  margin-bottom: 0;
-}
-
-.ardo-content .ardo-steps ol > li::marker {
-  content: none;
-}
-
-/* ========================================
-   FileTree Component
-   ======================================== */
-.ardo-filetree {
-  margin: 24px 0;
-  padding: 16px 20px;
-  background: var(--ardo-c-bg-soft);
-  border: 1px solid var(--ardo-c-border);
-  border-radius: var(--ardo-radius);
-  font-family: var(--ardo-font-mono);
-  font-size: 14px;
-  line-height: 1.8;
-}
-
-.ardo-filetree ul {
-  list-style: none;
-  padding-left: 0;
-  margin: 0;
-}
-
-.ardo-filetree ul ul {
-  padding-left: 20px;
-  border-left: 1px solid var(--ardo-c-border);
-  margin-left: 8px;
-}
-
-.ardo-filetree li {
-  position: relative;
-  padding-left: 28px;
-  margin-bottom: 0;
-}
-
-/* File icon */
-.ardo-filetree-file::before {
-  content: "";
-  position: absolute;
-  left: 2px;
-  top: 50%;
-  transform: translateY(-50%);
-  width: 18px;
-  height: 18px;
-  background: var(--ardo-c-text-light);
-  mask-image: url("./icons/file-text.svg");
-  mask-size: contain;
-  mask-repeat: no-repeat;
-  mask-position: center;
-}
-
-/* Folder icon */
-.ardo-filetree-dir::before {
-  content: "";
-  position: absolute;
-  left: 2px;
-  top: 50%;
-  transform: translateY(-50%);
-  width: 18px;
-  height: 18px;
-  background: var(--ardo-c-brand);
-  mask-image: url("./icons/folder.svg");
-  mask-size: contain;
-  mask-repeat: no-repeat;
-  mask-position: center;
-}
-
-/* Override inherited content styles */
-.ardo-content .ardo-filetree ul {
-  padding-left: 0;
-  margin-bottom: 0;
-  max-width: none;
-}
-
-.ardo-content .ardo-filetree ul ul {
-  padding-left: 20px;
-}
-
-.ardo-content .ardo-filetree li {
-  margin-bottom: 0;
-}
-
-.ardo-content .ardo-filetree li::marker {
-  content: none;
-}
+/*# sourceMappingURL=styles.css.map */