sdocs 0.0.15 → 0.0.16

package/dist/ui/styles/theme.css

@@ -0,0 +1,910 @@
+@import './fonts.css';
+
+/* sdocs design tokens
+ *
+ * Layer 1 — Primitives (Tailwind v4 oklch, never use directly in components)
+ * Layer 2 — Semantic aliases (per-theme, use these in components)
+ */
+
+:root {
+	/* zinc — Tailwind v4 zinc (oklch), 150-850 interpolated */
+	--color-zinc-0: #fff;
+	--color-zinc-50: oklch(0.985 0 0);
+	--color-zinc-100: oklch(0.967 0.001 286.375);
+	--color-zinc-150: oklch(0.944 0.003 286.348);
+	--color-zinc-200: oklch(0.920 0.004 286.32);
+	--color-zinc-250: oklch(0.896 0.005 286.303);
+	--color-zinc-300: oklch(0.871 0.006 286.286);
+	--color-zinc-350: oklch(0.788 0.011 286.177);
+	--color-zinc-400: oklch(0.705 0.015 286.067);
+	--color-zinc-450: oklch(0.629 0.016 286.003);
+	--color-zinc-500: oklch(0.552 0.016 285.938);
+	--color-zinc-550: oklch(0.497 0.017 285.862);
+	--color-zinc-600: oklch(0.442 0.017 285.786);
+	--color-zinc-650: oklch(0.406 0.015 285.796);
+	--color-zinc-700: oklch(0.370 0.013 285.805);
+	--color-zinc-750: oklch(0.322 0.010 285.919);
+	--color-zinc-800: oklch(0.274 0.006 286.033);
+	--color-zinc-850: oklch(0.242 0.006 285.959);
+	--color-zinc-900: oklch(0.210 0.006 285.885);
+	--color-zinc-950: oklch(0.141 0.005 285.823);
+	--color-zinc-1000: #000;
+
+	/* blue — Tailwind v4 blue (oklch), 150-850 interpolated */
+	--color-blue-50: oklch(0.970 0.014 254.604);
+	--color-blue-100: oklch(0.932 0.032 255.585);
+	--color-blue-150: oklch(0.907 0.046 254.857);
+	--color-blue-200: oklch(0.882 0.059 254.128);
+	--color-blue-250: oklch(0.846 0.082 252.971);
+	--color-blue-300: oklch(0.809 0.105 251.813);
+	--color-blue-350: oklch(0.758 0.135 253.219);
+	--color-blue-400: oklch(0.707 0.165 254.624);
+	--color-blue-450: oklch(0.665 0.190 257.220);
+	--color-blue-500: oklch(0.623 0.214 259.815);
+	--color-blue-550: oklch(0.585 0.230 261.348);
+	--color-blue-600: oklch(0.546 0.245 262.881);
+	--color-blue-650: oklch(0.517 0.244 263.629);
+	--color-blue-700: oklch(0.488 0.243 264.376);
+	--color-blue-750: oklch(0.456 0.221 265.007);
+	--color-blue-800: oklch(0.424 0.199 265.638);
+	--color-blue-850: oklch(0.402 0.173 265.580);
+	--color-blue-900: oklch(0.379 0.146 265.522);
+	--color-blue-950: oklch(0.282 0.091 267.935);
+
+	/* red — Tailwind v4 red (oklch), 150-850 interpolated */
+	--color-red-50: oklch(0.971 0.013 17.38);
+	--color-red-100: oklch(0.936 0.032 17.717);
+	--color-red-150: oklch(0.911 0.047 18.026);
+	--color-red-200: oklch(0.885 0.062 18.334);
+	--color-red-250: oklch(0.847 0.088 18.953);
+	--color-red-300: oklch(0.808 0.114 19.571);
+	--color-red-350: oklch(0.756 0.153 20.894);
+	--color-red-400: oklch(0.704 0.191 22.216);
+	--color-red-450: oklch(0.671 0.214 23.774);
+	--color-red-500: oklch(0.637 0.237 25.331);
+	--color-red-550: oklch(0.607 0.241 26.328);
+	--color-red-600: oklch(0.577 0.245 27.325);
+	--color-red-650: oklch(0.541 0.229 27.422);
+	--color-red-700: oklch(0.505 0.213 27.518);
+	--color-red-750: oklch(0.475 0.195 27.209);
+	--color-red-800: oklch(0.444 0.177 26.899);
+	--color-red-850: oklch(0.420 0.159 26.311);
+	--color-red-900: oklch(0.396 0.141 25.723);
+	--color-red-950: oklch(0.258 0.092 26.042);
+
+	/* green — Tailwind v4 green (oklch), 150-850 interpolated */
+	--color-green-50: oklch(0.982 0.018 155.826);
+	--color-green-100: oklch(0.962 0.044 156.743);
+	--color-green-150: oklch(0.944 0.064 156.369);
+	--color-green-200: oklch(0.925 0.084 155.995);
+	--color-green-250: oklch(0.898 0.117 155.222);
+	--color-green-300: oklch(0.871 0.150 154.449);
+	--color-green-350: oklch(0.832 0.180 153.080);
+	--color-green-400: oklch(0.792 0.209 151.711);
+	--color-green-450: oklch(0.758 0.214 150.645);
+	--color-green-500: oklch(0.723 0.219 149.579);
+	--color-green-550: oklch(0.675 0.207 149.397);
+	--color-green-600: oklch(0.627 0.194 149.214);
+	--color-green-650: oklch(0.577 0.174 149.642);
+	--color-green-700: oklch(0.527 0.154 150.069);
+	--color-green-750: oklch(0.488 0.137 150.699);
+	--color-green-800: oklch(0.448 0.119 151.328);
+	--color-green-850: oklch(0.421 0.107 151.932);
+	--color-green-900: oklch(0.393 0.095 152.535);
+	--color-green-950: oklch(0.266 0.065 152.934);
+
+	/* orange — Tailwind v4 orange (oklch), 150-850 interpolated */
+	--color-orange-50: oklch(0.980 0.016 73.684);
+	--color-orange-100: oklch(0.954 0.038 75.164);
+	--color-orange-150: oklch(0.928 0.057 72.931);
+	--color-orange-200: oklch(0.901 0.076 70.697);
+	--color-orange-250: oklch(0.869 0.102 68.494);
+	--color-orange-300: oklch(0.837 0.128 66.290);
+	--color-orange-350: oklch(0.794 0.156 61.112);
+	--color-orange-400: oklch(0.750 0.183 55.934);
+	--color-orange-450: oklch(0.728 0.198 51.769);
+	--color-orange-500: oklch(0.705 0.213 47.604);
+	--color-orange-550: oklch(0.676 0.218 44.360);
+	--color-orange-600: oklch(0.646 0.222 41.116);
+	--color-orange-650: oklch(0.600 0.209 39.759);
+	--color-orange-700: oklch(0.553 0.195 38.402);
+	--color-orange-750: oklch(0.512 0.176 37.853);
+	--color-orange-800: oklch(0.470 0.157 37.304);
+	--color-orange-850: oklch(0.439 0.140 37.738);
+	--color-orange-900: oklch(0.408 0.123 38.172);
+	--color-orange-950: oklch(0.266 0.079 36.259);
+
+	/* yellow — Tailwind v4 yellow (oklch), 150-850 interpolated */
+	--color-yellow-50: oklch(0.987 0.026 102.212);
+	--color-yellow-100: oklch(0.973 0.071 103.193);
+	--color-yellow-150: oklch(0.959 0.100 102.367);
+	--color-yellow-200: oklch(0.945 0.129 101.540);
+	--color-yellow-250: oklch(0.925 0.156 99.826);
+	--color-yellow-300: oklch(0.905 0.182 98.111);
+	--color-yellow-350: oklch(0.879 0.191 95.024);
+	--color-yellow-400: oklch(0.852 0.199 91.936);
+	--color-yellow-450: oklch(0.824 0.192 88.992);
+	--color-yellow-500: oklch(0.795 0.184 86.047);
+	--color-yellow-550: oklch(0.738 0.173 80.941);
+	--color-yellow-600: oklch(0.681 0.162 75.834);
+	--color-yellow-650: oklch(0.618 0.149 71.138);
+	--color-yellow-700: oklch(0.554 0.135 66.442);
+	--color-yellow-750: oklch(0.515 0.125 64.175);
+	--color-yellow-800: oklch(0.476 0.114 61.907);
+	--color-yellow-850: oklch(0.449 0.105 59.808);
+	--color-yellow-900: oklch(0.421 0.095 57.708);
+	--color-yellow-950: oklch(0.286 0.066 53.813);
+
+	/* purple — Tailwind v4 purple (oklch), 150-850 interpolated */
+	--color-purple-50: oklch(0.977 0.014 308.299);
+	--color-purple-100: oklch(0.946 0.033 307.174);
+	--color-purple-150: oklch(0.924 0.048 306.939);
+	--color-purple-200: oklch(0.902 0.063 306.703);
+	--color-purple-250: oklch(0.865 0.091 306.543);
+	--color-purple-300: oklch(0.827 0.119 306.383);
+	--color-purple-350: oklch(0.771 0.161 305.944);
+	--color-purple-400: oklch(0.714 0.203 305.504);
+	--color-purple-450: oklch(0.671 0.234 304.702);
+	--color-purple-500: oklch(0.627 0.265 303.900);
+	--color-purple-550: oklch(0.593 0.277 303.111);
+	--color-purple-600: oklch(0.558 0.288 302.321);
+	--color-purple-650: oklch(0.527 0.277 302.123);
+	--color-purple-700: oklch(0.496 0.265 301.924);
+	--color-purple-750: oklch(0.467 0.242 302.824);
+	--color-purple-800: oklch(0.438 0.218 303.724);
+	--color-purple-850: oklch(0.410 0.197 304.356);
+	--color-purple-900: oklch(0.381 0.176 304.987);
+	--color-purple-950: oklch(0.291 0.149 302.717);
+
+	/* lime — Tailwind v4 lime (oklch), 150-850 interpolated */
+	--color-lime-50: oklch(0.986 0.031 120.757);
+	--color-lime-100: oklch(0.967 0.067 122.328);
+	--color-lime-150: oklch(0.953 0.097 123.325);
+	--color-lime-200: oklch(0.938 0.127 124.321);
+	--color-lime-250: oklch(0.918 0.162 125.493);
+	--color-lime-300: oklch(0.897 0.196 126.665);
+	--color-lime-350: oklch(0.869 0.217 127.758);
+	--color-lime-400: oklch(0.841 0.238 128.850);
+	--color-lime-450: oklch(0.805 0.236 129.850);
+	--color-lime-500: oklch(0.768 0.233 130.850);
+	--color-lime-550: oklch(0.708 0.217 131.267);
+	--color-lime-600: oklch(0.648 0.200 131.684);
+	--color-lime-650: oklch(0.590 0.179 131.637);
+	--color-lime-700: oklch(0.532 0.157 131.589);
+	--color-lime-750: oklch(0.493 0.141 131.261);
+	--color-lime-800: oklch(0.453 0.124 130.933);
+	--color-lime-850: oklch(0.429 0.113 130.998);
+	--color-lime-900: oklch(0.405 0.101 131.063);
+	--color-lime-950: oklch(0.274 0.072 132.109);
+
+	/* cyan — Tailwind v4 cyan (oklch), 150-850 interpolated */
+	--color-cyan-50: oklch(0.984 0.019 200.873);
+	--color-cyan-100: oklch(0.956 0.045 203.388);
+	--color-cyan-150: oklch(0.937 0.063 204.215);
+	--color-cyan-200: oklch(0.917 0.080 205.041);
+	--color-cyan-250: oklch(0.891 0.104 206.060);
+	--color-cyan-300: oklch(0.865 0.127 207.078);
+	--color-cyan-350: oklch(0.827 0.141 209.304);
+	--color-cyan-400: oklch(0.789 0.154 211.530);
+	--color-cyan-450: oklch(0.752 0.149 213.376);
+	--color-cyan-500: oklch(0.715 0.143 215.221);
+	--color-cyan-550: oklch(0.662 0.135 218.472);
+	--color-cyan-600: oklch(0.609 0.126 221.723);
+	--color-cyan-650: oklch(0.565 0.116 222.426);
+	--color-cyan-700: oklch(0.520 0.105 223.128);
+	--color-cyan-750: oklch(0.485 0.095 223.706);
+	--color-cyan-800: oklch(0.450 0.085 224.283);
+	--color-cyan-850: oklch(0.424 0.078 225.838);
+	--color-cyan-900: oklch(0.398 0.070 227.392);
+	--color-cyan-950: oklch(0.302 0.056 229.695);
+
+	/* slate — Tailwind v4 slate (oklch), 150-850 interpolated */
+	--color-slate-50: oklch(0.984 0.003 247.858);
+	--color-slate-100: oklch(0.968 0.007 247.896);
+	--color-slate-150: oklch(0.949 0.010 251.702);
+	--color-slate-200: oklch(0.929 0.013 255.508);
+	--color-slate-250: oklch(0.899 0.018 254.201);
+	--color-slate-300: oklch(0.869 0.022 252.894);
+	--color-slate-350: oklch(0.787 0.031 254.841);
+	--color-slate-400: oklch(0.704 0.040 256.788);
+	--color-slate-450: oklch(0.629 0.043 257.103);
+	--color-slate-500: oklch(0.554 0.046 257.417);
+	--color-slate-550: oklch(0.500 0.045 257.349);
+	--color-slate-600: oklch(0.446 0.043 257.281);
+	--color-slate-650: oklch(0.409 0.044 257.284);
+	--color-slate-700: oklch(0.372 0.044 257.287);
+	--color-slate-750: oklch(0.326 0.043 258.659);
+	--color-slate-800: oklch(0.279 0.041 260.031);
+	--color-slate-850: oklch(0.244 0.042 262.893);
+	--color-slate-900: oklch(0.208 0.042 265.755);
+	--color-slate-950: oklch(0.129 0.042 264.695);
+
+	/* neutral — Tailwind v4 neutral (oklch), 150-850 interpolated */
+	--color-neutral-50: oklch(0.985 0 0);
+	--color-neutral-100: oklch(0.970 0 0);
+	--color-neutral-150: oklch(0.946 0 0);
+	--color-neutral-200: oklch(0.922 0 0);
+	--color-neutral-250: oklch(0.896 0 0);
+	--color-neutral-300: oklch(0.870 0 0);
+	--color-neutral-350: oklch(0.789 0 0);
+	--color-neutral-400: oklch(0.708 0 0);
+	--color-neutral-450: oklch(0.632 0 0);
+	--color-neutral-500: oklch(0.556 0 0);
+	--color-neutral-550: oklch(0.498 0 0);
+	--color-neutral-600: oklch(0.439 0 0);
+	--color-neutral-650: oklch(0.405 0 0);
+	--color-neutral-700: oklch(0.371 0 0);
+	--color-neutral-750: oklch(0.320 0 0);
+	--color-neutral-800: oklch(0.269 0 0);
+	--color-neutral-850: oklch(0.237 0 0);
+	--color-neutral-900: oklch(0.205 0 0);
+	--color-neutral-950: oklch(0.145 0 0);
+
+	/* stone — Tailwind v4 stone (oklch), 150-850 interpolated */
+	--color-stone-50: oklch(0.985 0.001 106.423);
+	--color-stone-100: oklch(0.970 0.001 106.424);
+	--color-stone-150: oklch(0.947 0.002 77.571);
+	--color-stone-200: oklch(0.923 0.003 48.717);
+	--color-stone-250: oklch(0.896 0.004 52.542);
+	--color-stone-300: oklch(0.869 0.005 56.366);
+	--color-stone-350: oklch(0.789 0.008 56.313);
+	--color-stone-400: oklch(0.709 0.010 56.259);
+	--color-stone-450: oklch(0.631 0.012 57.165);
+	--color-stone-500: oklch(0.553 0.013 58.071);
+	--color-stone-550: oklch(0.499 0.012 65.855);
+	--color-stone-600: oklch(0.444 0.011 73.639);
+	--color-stone-650: oklch(0.409 0.011 70.599);
+	--color-stone-700: oklch(0.374 0.010 67.558);
+	--color-stone-750: oklch(0.321 0.009 50.928);
+	--color-stone-800: oklch(0.268 0.007 34.298);
+	--color-stone-850: oklch(0.242 0.007 45.171);
+	--color-stone-900: oklch(0.216 0.006 56.043);
+	--color-stone-950: oklch(0.147 0.004 49.250);
+
+	/* amber — Tailwind v4 amber (oklch), 150-850 interpolated */
+	--color-amber-50: oklch(0.987 0.022 95.277);
+	--color-amber-100: oklch(0.962 0.059 95.617);
+	--color-amber-150: oklch(0.943 0.090 95.682);
+	--color-amber-200: oklch(0.924 0.120 95.746);
+	--color-amber-250: oklch(0.902 0.145 93.676);
+	--color-amber-300: oklch(0.879 0.169 91.605);
+	--color-amber-350: oklch(0.854 0.179 88.017);
+	--color-amber-400: oklch(0.828 0.189 84.429);
+	--color-amber-450: oklch(0.799 0.189 77.255);
+	--color-amber-500: oklch(0.769 0.188 70.080);
+	--color-amber-550: oklch(0.718 0.184 64.199);
+	--color-amber-600: oklch(0.666 0.179 58.318);
+	--color-amber-650: oklch(0.611 0.171 53.658);
+	--color-amber-700: oklch(0.555 0.163 48.998);
+	--color-amber-750: oklch(0.514 0.150 47.600);
+	--color-amber-800: oklch(0.473 0.137 46.201);
+	--color-amber-850: oklch(0.444 0.125 46.053);
+	--color-amber-900: oklch(0.414 0.112 45.904);
+	--color-amber-950: oklch(0.279 0.077 45.635);
+
+	/* emerald — Tailwind v4 emerald (oklch), 150-850 interpolated */
+	--color-emerald-50: oklch(0.979 0.021 166.113);
+	--color-emerald-100: oklch(0.950 0.052 163.051);
+	--color-emerald-150: oklch(0.928 0.073 163.601);
+	--color-emerald-200: oklch(0.905 0.093 164.150);
+	--color-emerald-250: oklch(0.875 0.118 164.564);
+	--color-emerald-300: oklch(0.845 0.143 164.978);
+	--color-emerald-350: oklch(0.805 0.160 164.101);
+	--color-emerald-400: oklch(0.765 0.177 163.223);
+	--color-emerald-450: oklch(0.731 0.174 162.852);
+	--color-emerald-500: oklch(0.696 0.170 162.480);
+	--color-emerald-550: oklch(0.646 0.158 162.853);
+	--color-emerald-600: oklch(0.596 0.145 163.225);
+	--color-emerald-650: oklch(0.552 0.132 164.419);
+	--color-emerald-700: oklch(0.508 0.118 165.612);
+	--color-emerald-750: oklch(0.470 0.107 166.263);
+	--color-emerald-800: oklch(0.432 0.095 166.913);
+	--color-emerald-850: oklch(0.405 0.086 167.927);
+	--color-emerald-900: oklch(0.378 0.077 168.940);
+	--color-emerald-950: oklch(0.262 0.051 172.552);
+
+	/* teal — Tailwind v4 teal (oklch), 150-850 interpolated */
+	--color-teal-50: oklch(0.984 0.014 180.720);
+	--color-teal-100: oklch(0.953 0.051 180.801);
+	--color-teal-150: oklch(0.932 0.074 180.614);
+	--color-teal-200: oklch(0.910 0.096 180.426);
+	--color-teal-250: oklch(0.883 0.117 180.749);
+	--color-teal-300: oklch(0.855 0.138 181.071);
+	--color-teal-350: oklch(0.816 0.145 181.492);
+	--color-teal-400: oklch(0.777 0.152 181.912);
+	--color-teal-450: oklch(0.741 0.146 182.208);
+	--color-teal-500: oklch(0.704 0.140 182.503);
+	--color-teal-550: oklch(0.652 0.129 183.604);
+	--color-teal-600: oklch(0.600 0.118 184.704);
+	--color-teal-650: oklch(0.556 0.107 185.548);
+	--color-teal-700: oklch(0.511 0.096 186.391);
+	--color-teal-750: oklch(0.474 0.087 187.304);
+	--color-teal-800: oklch(0.437 0.078 188.216);
+	--color-teal-850: oklch(0.412 0.071 188.316);
+	--color-teal-900: oklch(0.386 0.063 188.416);
+	--color-teal-950: oklch(0.277 0.046 192.524);
+
+	/* sky — Tailwind v4 sky (oklch), 150-850 interpolated */
+	--color-sky-50: oklch(0.977 0.013 236.620);
+	--color-sky-100: oklch(0.951 0.026 236.824);
+	--color-sky-150: oklch(0.926 0.042 233.863);
+	--color-sky-200: oklch(0.901 0.058 230.902);
+	--color-sky-250: oklch(0.865 0.085 230.610);
+	--color-sky-300: oklch(0.828 0.111 230.318);
+	--color-sky-350: oklch(0.787 0.136 231.490);
+	--color-sky-400: oklch(0.746 0.160 232.661);
+	--color-sky-450: oklch(0.716 0.165 234.992);
+	--color-sky-500: oklch(0.685 0.169 237.323);
+	--color-sky-550: oklch(0.637 0.164 239.645);
+	--color-sky-600: oklch(0.588 0.158 241.966);
+	--color-sky-650: oklch(0.544 0.146 242.358);
+	--color-sky-700: oklch(0.500 0.134 242.749);
+	--color-sky-750: oklch(0.472 0.122 241.770);
+	--color-sky-800: oklch(0.443 0.110 240.790);
+	--color-sky-850: oklch(0.417 0.100 240.833);
+	--color-sky-900: oklch(0.391 0.090 240.876);
+	--color-sky-950: oklch(0.293 0.066 243.157);
+
+	/* indigo — Tailwind v4 indigo (oklch), 150-850 interpolated */
+	--color-indigo-50: oklch(0.962 0.018 272.314);
+	--color-indigo-100: oklch(0.930 0.034 272.788);
+	--color-indigo-150: oklch(0.900 0.050 273.414);
+	--color-indigo-200: oklch(0.870 0.065 274.039);
+	--color-indigo-250: oklch(0.828 0.090 274.376);
+	--color-indigo-300: oklch(0.785 0.115 274.713);
+	--color-indigo-350: oklch(0.729 0.149 275.824);
+	--color-indigo-400: oklch(0.673 0.182 276.935);
+	--color-indigo-450: oklch(0.629 0.208 277.026);
+	--color-indigo-500: oklch(0.585 0.233 277.117);
+	--color-indigo-550: oklch(0.548 0.248 277.042);
+	--color-indigo-600: oklch(0.511 0.262 276.966);
+	--color-indigo-650: oklch(0.484 0.251 276.995);
+	--color-indigo-700: oklch(0.457 0.240 277.023);
+	--color-indigo-750: oklch(0.428 0.218 277.195);
+	--color-indigo-800: oklch(0.398 0.195 277.366);
+	--color-indigo-850: oklch(0.379 0.170 278.032);
+	--color-indigo-900: oklch(0.359 0.144 278.697);
+	--color-indigo-950: oklch(0.257 0.090 281.288);
+
+	/* violet — Tailwind v4 violet (oklch), 150-850 interpolated */
+	--color-violet-50: oklch(0.969 0.016 293.756);
+	--color-violet-100: oklch(0.943 0.029 294.588);
+	--color-violet-150: oklch(0.919 0.043 293.936);
+	--color-violet-200: oklch(0.894 0.057 293.283);
+	--color-violet-250: oklch(0.853 0.084 293.427);
+	--color-violet-300: oklch(0.811 0.111 293.571);
+	--color-violet-350: oklch(0.757 0.147 293.556);
+	--color-violet-400: oklch(0.702 0.183 293.541);
+	--color-violet-450: oklch(0.654 0.217 293.129);
+	--color-violet-500: oklch(0.606 0.250 292.717);
+	--color-violet-550: oklch(0.574 0.266 292.863);
+	--color-violet-600: oklch(0.541 0.281 293.009);
+	--color-violet-650: oklch(0.516 0.276 292.795);
+	--color-violet-700: oklch(0.491 0.270 292.581);
+	--color-violet-750: oklch(0.462 0.251 292.670);
+	--color-violet-800: oklch(0.432 0.232 292.759);
+	--color-violet-850: oklch(0.406 0.211 293.252);
+	--color-violet-900: oklch(0.380 0.189 293.745);
+	--color-violet-950: oklch(0.283 0.141 291.089);
+
+	/* fuchsia — Tailwind v4 fuchsia (oklch), 150-850 interpolated */
+	--color-fuchsia-50: oklch(0.977 0.017 320.058);
+	--color-fuchsia-100: oklch(0.952 0.037 318.852);
+	--color-fuchsia-150: oklch(0.928 0.057 319.236);
+	--color-fuchsia-200: oklch(0.903 0.076 319.620);
+	--color-fuchsia-250: oklch(0.868 0.111 320.527);
+	--color-fuchsia-300: oklch(0.833 0.145 321.434);
+	--color-fuchsia-350: oklch(0.787 0.192 321.797);
+	--color-fuchsia-400: oklch(0.740 0.238 322.160);
+	--color-fuchsia-450: oklch(0.704 0.267 322.155);
+	--color-fuchsia-500: oklch(0.667 0.295 322.150);
+	--color-fuchsia-550: oklch(0.629 0.294 322.523);
+	--color-fuchsia-600: oklch(0.591 0.293 322.896);
+	--color-fuchsia-650: oklch(0.555 0.273 323.423);
+	--color-fuchsia-700: oklch(0.518 0.253 323.949);
+	--color-fuchsia-750: oklch(0.485 0.232 324.270);
+	--color-fuchsia-800: oklch(0.452 0.211 324.591);
+	--color-fuchsia-850: oklch(0.427 0.191 325.102);
+	--color-fuchsia-900: oklch(0.401 0.170 325.612);
+	--color-fuchsia-950: oklch(0.293 0.136 325.661);
+
+	/* pink — Tailwind v4 pink (oklch), 150-850 interpolated */
+	--color-pink-50: oklch(0.971 0.014 343.198);
+	--color-pink-100: oklch(0.948 0.028 342.258);
+	--color-pink-150: oklch(0.924 0.045 342.745);
+	--color-pink-200: oklch(0.899 0.061 343.231);
+	--color-pink-250: oklch(0.861 0.091 344.625);
+	--color-pink-300: oklch(0.823 0.120 346.018);
+	--color-pink-350: oklch(0.771 0.161 347.890);
+	--color-pink-400: oklch(0.718 0.202 349.761);
+	--color-pink-450: oklch(0.687 0.222 352.035);
+	--color-pink-500: oklch(0.656 0.241 354.308);
+	--color-pink-550: oklch(0.624 0.245 357.446);
+	--color-pink-600: oklch(0.592 0.249 0.584);
+	--color-pink-650: oklch(0.559 0.236 2.271);
+	--color-pink-700: oklch(0.525 0.223 3.958);
+	--color-pink-750: oklch(0.492 0.205 3.887);
+	--color-pink-800: oklch(0.459 0.187 3.815);
+	--color-pink-850: oklch(0.434 0.170 3.124);
+	--color-pink-900: oklch(0.408 0.153 2.432);
+	--color-pink-950: oklch(0.284 0.109 3.907);
+
+	/* rose — Tailwind v4 rose (oklch), 150-850 interpolated */
+	--color-rose-50: oklch(0.969 0.015 12.422);
+	--color-rose-100: oklch(0.941 0.030 12.580);
+	--color-rose-150: oklch(0.917 0.044 11.291);
+	--color-rose-200: oklch(0.892 0.058 10.001);
+	--color-rose-250: oklch(0.851 0.088 10.820);
+	--color-rose-300: oklch(0.810 0.117 11.638);
+	--color-rose-350: oklch(0.761 0.156 12.533);
+	--color-rose-400: oklch(0.712 0.194 13.428);
+	--color-rose-450: oklch(0.679 0.220 14.934);
+	--color-rose-500: oklch(0.645 0.246 16.439);
+	--color-rose-550: oklch(0.616 0.250 17.012);
+	--color-rose-600: oklch(0.586 0.253 17.585);
+	--color-rose-650: oklch(0.550 0.238 17.260);
+	--color-rose-700: oklch(0.514 0.222 16.935);
+	--color-rose-750: oklch(0.485 0.205 15.316);
+	--color-rose-800: oklch(0.455 0.188 13.697);
+	--color-rose-850: oklch(0.430 0.170 13.072);
+	--color-rose-900: oklch(0.404 0.152 12.447);
+	--color-rose-950: oklch(0.271 0.105 12.094);
+
+	--sans: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+	--mono: 'JetBrains Mono', 'SF Mono', Monaco, Consolas, monospace;
+}
+
+body {
+	font-family: var(--sans);
+}
+
+:root,
+[data-sdocs-theme="light"] {
+	/* base — layouts, backgrounds, surfaces, borders, text */
+	--color-base-0: var(--color-zinc-0);
+	--color-base-50: var(--color-zinc-50);
+	--color-base-100: var(--color-zinc-100);
+	--color-base-150: var(--color-zinc-150);
+	--color-base-200: var(--color-zinc-200);
+	--color-base-250: var(--color-zinc-250);
+	--color-base-300: var(--color-zinc-300);
+	--color-base-350: var(--color-zinc-350);
+	--color-base-400: var(--color-zinc-400);
+	--color-base-450: var(--color-zinc-450);
+	--color-base-500: var(--color-zinc-500);
+	--color-base-550: var(--color-zinc-550);
+	--color-base-600: var(--color-zinc-600);
+	--color-base-650: var(--color-zinc-650);
+	--color-base-700: var(--color-zinc-700);
+	--color-base-750: var(--color-zinc-750);
+	--color-base-800: var(--color-zinc-800);
+	--color-base-850: var(--color-zinc-850);
+	--color-base-900: var(--color-zinc-900);
+	--color-base-950: var(--color-zinc-950);
+	--color-base-1000: var(--color-zinc-1000);
+	/* success — positive feedback, confirmations, valid states */
+	--color-success-50: var(--color-green-50);
+	--color-success-100: var(--color-green-100);
+	--color-success-150: var(--color-green-150);
+	--color-success-200: var(--color-green-200);
+	--color-success-250: var(--color-green-250);
+	--color-success-300: var(--color-green-300);
+	--color-success-350: var(--color-green-350);
+	--color-success-400: var(--color-green-400);
+	--color-success-450: var(--color-green-450);
+	--color-success-500: var(--color-green-500);
+	--color-success-550: var(--color-green-550);
+	--color-success-600: var(--color-green-600);
+	--color-success-650: var(--color-green-650);
+	--color-success-700: var(--color-green-700);
+	--color-success-750: var(--color-green-750);
+	--color-success-800: var(--color-green-800);
+	--color-success-850: var(--color-green-850);
+	--color-success-900: var(--color-green-900);
+	--color-success-950: var(--color-green-950);
+	/* danger — errors, destructive actions, invalid states */
+	--color-danger-50: var(--color-red-50);
+	--color-danger-100: var(--color-red-100);
+	--color-danger-150: var(--color-red-150);
+	--color-danger-200: var(--color-red-200);
+	--color-danger-250: var(--color-red-250);
+	--color-danger-300: var(--color-red-300);
+	--color-danger-350: var(--color-red-350);
+	--color-danger-400: var(--color-red-400);
+	--color-danger-450: var(--color-red-450);
+	--color-danger-500: var(--color-red-500);
+	--color-danger-550: var(--color-red-550);
+	--color-danger-600: var(--color-red-600);
+	--color-danger-650: var(--color-red-650);
+	--color-danger-700: var(--color-red-700);
+	--color-danger-750: var(--color-red-750);
+	--color-danger-800: var(--color-red-800);
+	--color-danger-850: var(--color-red-850);
+	--color-danger-900: var(--color-red-900);
+	--color-danger-950: var(--color-red-950);
+	/* warning — caution, attention needed */
+	--color-warning-50: var(--color-orange-50);
+	--color-warning-100: var(--color-orange-100);
+	--color-warning-150: var(--color-orange-150);
+	--color-warning-200: var(--color-orange-200);
+	--color-warning-250: var(--color-orange-250);
+	--color-warning-300: var(--color-orange-300);
+	--color-warning-350: var(--color-orange-350);
+	--color-warning-400: var(--color-orange-400);
+	--color-warning-450: var(--color-orange-450);
+	--color-warning-500: var(--color-orange-500);
+	--color-warning-550: var(--color-orange-550);
+	--color-warning-600: var(--color-orange-600);
+	--color-warning-650: var(--color-orange-650);
+	--color-warning-700: var(--color-orange-700);
+	--color-warning-750: var(--color-orange-750);
+	--color-warning-800: var(--color-orange-800);
+	--color-warning-850: var(--color-orange-850);
+	--color-warning-900: var(--color-orange-900);
+	--color-warning-950: var(--color-orange-950);
+	/* focus — selection, highlights, active states */
+	--color-focus-50: var(--color-yellow-50);
+	--color-focus-100: var(--color-yellow-100);
+	--color-focus-150: var(--color-yellow-150);
+	--color-focus-200: var(--color-yellow-200);
+	--color-focus-250: var(--color-yellow-250);
+	--color-focus-300: var(--color-yellow-300);
+	--color-focus-350: var(--color-yellow-350);
+	--color-focus-400: var(--color-yellow-400);
+	--color-focus-450: var(--color-yellow-450);
+	--color-focus-500: var(--color-yellow-500);
+	--color-focus-550: var(--color-yellow-550);
+	--color-focus-600: var(--color-yellow-600);
+	--color-focus-650: var(--color-yellow-650);
+	--color-focus-700: var(--color-yellow-700);
+	--color-focus-750: var(--color-yellow-750);
+	--color-focus-800: var(--color-yellow-800);
+	--color-focus-850: var(--color-yellow-850);
+	--color-focus-900: var(--color-yellow-900);
+	--color-focus-950: var(--color-yellow-950);
+	/* component — component doc badges, tags, accents */
+	--color-component-50: var(--color-pink-50);
+	--color-component-100: var(--color-pink-100);
+	--color-component-150: var(--color-pink-150);
+	--color-component-200: var(--color-pink-200);
+	--color-component-250: var(--color-pink-250);
+	--color-component-300: var(--color-pink-300);
+	--color-component-350: var(--color-pink-350);
+	--color-component-400: var(--color-pink-400);
+	--color-component-450: var(--color-pink-450);
+	--color-component-500: var(--color-pink-500);
+	--color-component-550: var(--color-pink-550);
+	--color-component-600: var(--color-pink-600);
+	--color-component-650: var(--color-pink-650);
+	--color-component-700: var(--color-pink-700);
+	--color-component-750: var(--color-pink-750);
+	--color-component-800: var(--color-pink-800);
+	--color-component-850: var(--color-pink-850);
+	--color-component-900: var(--color-pink-900);
+	--color-component-950: var(--color-pink-950);
+	/* layout — layout doc badges, tags, accents */
+	--color-layout-50: var(--color-purple-50);
+	--color-layout-100: var(--color-purple-100);
+	--color-layout-150: var(--color-purple-150);
+	--color-layout-200: var(--color-purple-200);
+	--color-layout-250: var(--color-purple-250);
+	--color-layout-300: var(--color-purple-300);
+	--color-layout-350: var(--color-purple-350);
+	--color-layout-400: var(--color-purple-400);
+	--color-layout-450: var(--color-purple-450);
+	--color-layout-500: var(--color-purple-500);
+	--color-layout-550: var(--color-purple-550);
+	--color-layout-600: var(--color-purple-600);
+	--color-layout-650: var(--color-purple-650);
+	--color-layout-700: var(--color-purple-700);
+	--color-layout-750: var(--color-purple-750);
+	--color-layout-800: var(--color-purple-800);
+	--color-layout-850: var(--color-purple-850);
+	--color-layout-900: var(--color-purple-900);
+	--color-layout-950: var(--color-purple-950);
+	/* example — code examples, snippets, playground accents */
+	--color-example-50: var(--color-cyan-50);
+	--color-example-100: var(--color-cyan-100);
+	--color-example-150: var(--color-cyan-150);
+	--color-example-200: var(--color-cyan-200);
+	--color-example-250: var(--color-cyan-250);
+	--color-example-300: var(--color-cyan-300);
+	--color-example-350: var(--color-cyan-350);
+	--color-example-400: var(--color-cyan-400);
+	--color-example-450: var(--color-cyan-450);
+	--color-example-500: var(--color-cyan-500);
+	--color-example-550: var(--color-cyan-550);
+	--color-example-600: var(--color-cyan-600);
+	--color-example-650: var(--color-cyan-650);
+	--color-example-700: var(--color-cyan-700);
+	--color-example-750: var(--color-cyan-750);
+	--color-example-800: var(--color-cyan-800);
+	--color-example-850: var(--color-cyan-850);
+	--color-example-900: var(--color-cyan-900);
+	--color-example-950: var(--color-cyan-950);
+	/* docs — documentation file badges, tags, accents */
+	--color-docs-50: var(--color-amber-50);
+	--color-docs-100: var(--color-amber-100);
+	--color-docs-150: var(--color-amber-150);
+	--color-docs-200: var(--color-amber-200);
+	--color-docs-250: var(--color-amber-250);
+	--color-docs-300: var(--color-amber-300);
+	--color-docs-350: var(--color-amber-350);
+	--color-docs-400: var(--color-amber-400);
+	--color-docs-450: var(--color-amber-450);
+	--color-docs-500: var(--color-amber-500);
+	--color-docs-550: var(--color-amber-550);
+	--color-docs-600: var(--color-amber-600);
+	--color-docs-650: var(--color-amber-650);
+	--color-docs-700: var(--color-amber-700);
+	--color-docs-750: var(--color-amber-750);
+	--color-docs-800: var(--color-amber-800);
+	--color-docs-850: var(--color-amber-850);
+	--color-docs-900: var(--color-amber-900);
+	--color-docs-950: var(--color-amber-950);
+	/* page — page doc badges, tags, accents */
+	--color-page-50: var(--color-yellow-50);
+	--color-page-100: var(--color-yellow-100);
+	--color-page-150: var(--color-yellow-150);
+	--color-page-200: var(--color-yellow-200);
+	--color-page-250: var(--color-yellow-250);
+	--color-page-300: var(--color-yellow-300);
+	--color-page-350: var(--color-yellow-350);
+	--color-page-400: var(--color-yellow-400);
+	--color-page-450: var(--color-yellow-450);
+	--color-page-500: var(--color-yellow-500);
+	--color-page-550: var(--color-yellow-550);
+	--color-page-600: var(--color-yellow-600);
+	--color-page-650: var(--color-yellow-650);
+	--color-page-700: var(--color-yellow-700);
+	--color-page-750: var(--color-yellow-750);
+	--color-page-800: var(--color-yellow-800);
+	--color-page-850: var(--color-yellow-850);
+	--color-page-900: var(--color-yellow-900);
+	--color-page-950: var(--color-yellow-950);
+	/* action — links, buttons, interactive accents */
+	--color-action-50: var(--color-blue-50);
+	--color-action-100: var(--color-blue-100);
+	--color-action-150: var(--color-blue-150);
+	--color-action-200: var(--color-blue-200);
+	--color-action-250: var(--color-blue-250);
+	--color-action-300: var(--color-blue-300);
+	--color-action-350: var(--color-blue-350);
+	--color-action-400: var(--color-blue-400);
+	--color-action-450: var(--color-blue-450);
+	--color-action-500: var(--color-blue-500);
+	--color-action-550: var(--color-blue-550);
+	--color-action-600: var(--color-blue-600);
+	--color-action-650: var(--color-blue-650);
+	--color-action-700: var(--color-blue-700);
+	--color-action-750: var(--color-blue-750);
+	--color-action-800: var(--color-blue-800);
+	--color-action-850: var(--color-blue-850);
+	--color-action-900: var(--color-blue-900);
+	--color-action-950: var(--color-blue-950);
+}
+
+[data-sdocs-theme="dark"] {
+	/* base — layouts, backgrounds, surfaces, borders, text (inverted) */
+	--color-base-0: var(--color-zinc-1000);
+	--color-base-50: var(--color-zinc-950);
+	--color-base-100: var(--color-zinc-900);
+	--color-base-150: var(--color-zinc-850);
+	--color-base-200: var(--color-zinc-800);
+	--color-base-250: var(--color-zinc-750);
+	--color-base-300: var(--color-zinc-700);
+	--color-base-350: var(--color-zinc-650);
+	--color-base-400: var(--color-zinc-600);
+	--color-base-450: var(--color-zinc-550);
+	--color-base-500: var(--color-zinc-500);
+	--color-base-550: var(--color-zinc-450);
+	--color-base-600: var(--color-zinc-400);
+	--color-base-650: var(--color-zinc-350);
+	--color-base-700: var(--color-zinc-300);
+	--color-base-750: var(--color-zinc-250);
+	--color-base-800: var(--color-zinc-200);
+	--color-base-850: var(--color-zinc-150);
+	--color-base-900: var(--color-zinc-100);
+	--color-base-950: var(--color-zinc-50);
+	--color-base-1000: var(--color-zinc-0);
+	/* success — positive feedback, confirmations, valid states (inverted) */
+	--color-success-50: var(--color-green-950);
+	--color-success-100: var(--color-green-900);
+	--color-success-150: var(--color-green-850);
+	--color-success-200: var(--color-green-800);
+	--color-success-250: var(--color-green-750);
+	--color-success-300: var(--color-green-700);
+	--color-success-350: var(--color-green-650);
+	--color-success-400: var(--color-green-600);
+	--color-success-450: var(--color-green-550);
+	--color-success-500: var(--color-green-500);
+	--color-success-550: var(--color-green-450);
+	--color-success-600: var(--color-green-400);
+	--color-success-650: var(--color-green-350);
+	--color-success-700: var(--color-green-300);
+	--color-success-750: var(--color-green-250);
+	--color-success-800: var(--color-green-200);
+	--color-success-850: var(--color-green-150);
+	--color-success-900: var(--color-green-100);
+	--color-success-950: var(--color-green-50);
+	/* danger — errors, destructive actions, invalid states (inverted) */
+	--color-danger-50: var(--color-red-950);
+	--color-danger-100: var(--color-red-900);
+	--color-danger-150: var(--color-red-850);
+	--color-danger-200: var(--color-red-800);
+	--color-danger-250: var(--color-red-750);
+	--color-danger-300: var(--color-red-700);
+	--color-danger-350: var(--color-red-650);
+	--color-danger-400: var(--color-red-600);
+	--color-danger-450: var(--color-red-550);
+	--color-danger-500: var(--color-red-500);
+	--color-danger-550: var(--color-red-450);
+	--color-danger-600: var(--color-red-400);
+	--color-danger-650: var(--color-red-350);
+	--color-danger-700: var(--color-red-300);
+	--color-danger-750: var(--color-red-250);
+	--color-danger-800: var(--color-red-200);
+	--color-danger-850: var(--color-red-150);
+	--color-danger-900: var(--color-red-100);
+	--color-danger-950: var(--color-red-50);
+	/* warning — caution, attention needed (inverted) */
+	--color-warning-50: var(--color-orange-950);
+	--color-warning-100: var(--color-orange-900);
+	--color-warning-150: var(--color-orange-850);
+	--color-warning-200: var(--color-orange-800);
+	--color-warning-250: var(--color-orange-750);
+	--color-warning-300: var(--color-orange-700);
+	--color-warning-350: var(--color-orange-650);
+	--color-warning-400: var(--color-orange-600);
+	--color-warning-450: var(--color-orange-550);
+	--color-warning-500: var(--color-orange-500);
+	--color-warning-550: var(--color-orange-450);
+	--color-warning-600: var(--color-orange-400);
+	--color-warning-650: var(--color-orange-350);
+	--color-warning-700: var(--color-orange-300);
+	--color-warning-750: var(--color-orange-250);
+	--color-warning-800: var(--color-orange-200);
+	--color-warning-850: var(--color-orange-150);
+	--color-warning-900: var(--color-orange-100);
+	--color-warning-950: var(--color-orange-50);
+	/* focus — selection, highlights, active states (inverted) */
+	--color-focus-50: var(--color-yellow-950);
+	--color-focus-100: var(--color-yellow-900);
+	--color-focus-150: var(--color-yellow-850);
+	--color-focus-200: var(--color-yellow-800);
+	--color-focus-250: var(--color-yellow-750);
+	--color-focus-300: var(--color-yellow-700);
+	--color-focus-350: var(--color-yellow-650);
+	--color-focus-400: var(--color-yellow-600);
+	--color-focus-450: var(--color-yellow-550);
+	--color-focus-500: var(--color-yellow-500);
+	--color-focus-550: var(--color-yellow-450);
+	--color-focus-600: var(--color-yellow-400);
+	--color-focus-650: var(--color-yellow-350);
+	--color-focus-700: var(--color-yellow-300);
+	--color-focus-750: var(--color-yellow-250);
+	--color-focus-800: var(--color-yellow-200);
+	--color-focus-850: var(--color-yellow-150);
+	--color-focus-900: var(--color-yellow-100);
+	--color-focus-950: var(--color-yellow-50);
+	/* component — component doc badges, tags, accents (inverted) */
+	--color-component-50: var(--color-pink-950);
+	--color-component-100: var(--color-pink-900);
+	--color-component-150: var(--color-pink-850);
+	--color-component-200: var(--color-pink-800);
+	--color-component-250: var(--color-pink-750);
+	--color-component-300: var(--color-pink-700);
+	--color-component-350: var(--color-pink-650);
+	--color-component-400: var(--color-pink-600);
+	--color-component-450: var(--color-pink-550);
+	--color-component-500: var(--color-pink-500);
+	--color-component-550: var(--color-pink-450);
+	--color-component-600: var(--color-pink-400);
+	--color-component-650: var(--color-pink-350);
+	--color-component-700: var(--color-pink-300);
+	--color-component-750: var(--color-pink-250);
+	--color-component-800: var(--color-pink-200);
+	--color-component-850: var(--color-pink-150);
+	--color-component-900: var(--color-pink-100);
+	--color-component-950: var(--color-pink-50);
+	/* layout — layout doc badges, tags, accents (inverted) */
+	--color-layout-50: var(--color-purple-950);
+	--color-layout-100: var(--color-purple-900);
+	--color-layout-150: var(--color-purple-850);
+	--color-layout-200: var(--color-purple-800);
+	--color-layout-250: var(--color-purple-750);
+	--color-layout-300: var(--color-purple-700);
+	--color-layout-350: var(--color-purple-650);
+	--color-layout-400: var(--color-purple-600);
+	--color-layout-450: var(--color-purple-550);
+	--color-layout-500: var(--color-purple-500);
+	--color-layout-550: var(--color-purple-450);
+	--color-layout-600: var(--color-purple-400);
+	--color-layout-650: var(--color-purple-350);
+	--color-layout-700: var(--color-purple-300);
+	--color-layout-750: var(--color-purple-250);
+	--color-layout-800: var(--color-purple-200);
+	--color-layout-850: var(--color-purple-150);
+	--color-layout-900: var(--color-purple-100);
+	--color-layout-950: var(--color-purple-50);
+	/* example — code examples, snippets, playground accents (inverted) */
+	--color-example-50: var(--color-cyan-950);
+	--color-example-100: var(--color-cyan-900);
+	--color-example-150: var(--color-cyan-850);
+	--color-example-200: var(--color-cyan-800);
+	--color-example-250: var(--color-cyan-750);
+	--color-example-300: var(--color-cyan-700);
+	--color-example-350: var(--color-cyan-650);
+	--color-example-400: var(--color-cyan-600);
+	--color-example-450: var(--color-cyan-550);
+	--color-example-500: var(--color-cyan-500);
+	--color-example-550: var(--color-cyan-450);
+	--color-example-600: var(--color-cyan-400);
+	--color-example-650: var(--color-cyan-350);
+	--color-example-700: var(--color-cyan-300);
+	--color-example-750: var(--color-cyan-250);
+	--color-example-800: var(--color-cyan-200);
+	--color-example-850: var(--color-cyan-150);
+	--color-example-900: var(--color-cyan-100);
+	--color-example-950: var(--color-cyan-50);
+	/* docs — documentation file badges, tags, accents (inverted) */
+	--color-docs-50: var(--color-amber-950);
+	--color-docs-100: var(--color-amber-900);
+	--color-docs-150: var(--color-amber-850);
+	--color-docs-200: var(--color-amber-800);
+	--color-docs-250: var(--color-amber-750);
+	--color-docs-300: var(--color-amber-700);
+	--color-docs-350: var(--color-amber-650);
+	--color-docs-400: var(--color-amber-600);
+	--color-docs-450: var(--color-amber-550);
+	--color-docs-500: var(--color-amber-500);
+	--color-docs-550: var(--color-amber-450);
+	--color-docs-600: var(--color-amber-400);
+	--color-docs-650: var(--color-amber-350);
+	--color-docs-700: var(--color-amber-300);
+	--color-docs-750: var(--color-amber-250);
+	--color-docs-800: var(--color-amber-200);
+	--color-docs-850: var(--color-amber-150);
+	--color-docs-900: var(--color-amber-100);
+	--color-docs-950: var(--color-amber-50);
+	/* page — page doc badges, tags, accents (inverted) */
+	--color-page-50: var(--color-yellow-950);
+	--color-page-100: var(--color-yellow-900);
+	--color-page-150: var(--color-yellow-850);
+	--color-page-200: var(--color-yellow-800);
+	--color-page-250: var(--color-yellow-750);
+	--color-page-300: var(--color-yellow-700);
+	--color-page-350: var(--color-yellow-650);
+	--color-page-400: var(--color-yellow-600);
+	--color-page-450: var(--color-yellow-550);
+	--color-page-500: var(--color-yellow-500);
+	--color-page-550: var(--color-yellow-450);
+	--color-page-600: var(--color-yellow-400);
+	--color-page-650: var(--color-yellow-350);
+	--color-page-700: var(--color-yellow-300);
+	--color-page-750: var(--color-yellow-250);
+	--color-page-800: var(--color-yellow-200);
+	--color-page-850: var(--color-yellow-150);
+	--color-page-900: var(--color-yellow-100);
+	--color-page-950: var(--color-yellow-50);
+	/* action — links, buttons, interactive accents (inverted) */
+	--color-action-50: var(--color-blue-950);
+	--color-action-100: var(--color-blue-900);
+	--color-action-150: var(--color-blue-850);
+	--color-action-200: var(--color-blue-800);
+	--color-action-250: var(--color-blue-750);
+	--color-action-300: var(--color-blue-700);
+	--color-action-350: var(--color-blue-650);
+	--color-action-400: var(--color-blue-600);
+	--color-action-450: var(--color-blue-550);
+	--color-action-500: var(--color-blue-500);
+	--color-action-550: var(--color-blue-450);
+	--color-action-600: var(--color-blue-400);
+	--color-action-650: var(--color-blue-350);
+	--color-action-700: var(--color-blue-300);
+	--color-action-750: var(--color-blue-250);
+	--color-action-800: var(--color-blue-200);
+	--color-action-850: var(--color-blue-150);
+	--color-action-900: var(--color-blue-100);
+	--color-action-950: var(--color-blue-50);
+}