turbo-themes 0.40.17 → 0.41.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 2264b02a4eb5f5af5af47d7601a68280eb8334fc3993cf397daf4fb74d3dc494
-  data.tar.gz: 977b7c6535e9d38bbe79a714aeafcbf75089b9c4941fbca88acde8ded37a6ed1
+  metadata.gz: 3a8013dc373c73f6bf4158c858eef0d4618b7ea99545ed9b6c1a76aad5d3f2b2
+  data.tar.gz: 1f588862d17e07ec105370caf1666617fffa6d7a830bbc25f4f68d271fded137
 SHA512:
-  metadata.gz: 0ce38afc1b6f282a69bb0086f2f6b139f845c121ef9409ec61bcbf0fe722920198a3994d02c0333fbf1c74dcaa61e05c10bc2f1ee1092807a2b8103a96942762
-  data.tar.gz: 8461207ee842d51aa5da5dc18a04599254d995427168b7e2afa3ab088ff994a5a18b40c2b5e8757545b6b136d76060b124dfec4e8c2257304c3accaa31025e02
+  metadata.gz: d4adcd38fc59b9bb18a52c11c24079905a5fc424849738115e2aeadf776e974728ac8d3df17f6370ee2761f0b49f57dbdc612fe9985746308d00442f16756765
+  data.tar.gz: 25c5ae91fdfd421a0ee6c0738b055330966eabbf290472f5e65709f872d980e7193e71e40bc26245ab5debf50e3a06bafaf3d6696613feab9f9339b3e012095b

data/CHANGELOG.md

@@ -10,6 +10,12 @@ The format is based on Keep a Changelog and this project adheres to SemVer.
 
 - TBD
 
+## [0.41.0] - 2026-07-27
+
+### ✨ Added
+
+- Strict WCAG AA contrast and widened axe coverage (#774)
+
 ## [0.40.17] - 2026-07-27
 
 ### 🐛 Fixed

data/assets/css/home.css

@@ -149,8 +149,11 @@
  */
 .showcase-page .showcase-theme-more {
   font-size: 0.875rem;
-  color: color-mix(in srgb, var(--turbo-brand-primary) 60%, var(--turbo-text-primary));
-  text-decoration: none;
+  color: var(--turbo-accent-link, var(--turbo-text-primary));
+  text-decoration: underline;
+  text-underline-offset: 2px;
+  /* Beat chrome link color transitions during theme application. */
+  transition: none;
 }
 
 .showcase-page .showcase-theme-more:hover {
@@ -223,7 +226,8 @@
 
 .showcase-preview-tab {
   flex: 1;
-  padding: 0.375rem 0.5rem;
+  padding: 0.5rem 0.625rem;
+  min-height: 44px;
   border: none;
   border-radius: 0.375rem;
   background: transparent;
@@ -777,6 +781,7 @@
   font-size: 0.8125rem;
   font-weight: 600;
   line-height: 1.25;
+  color: var(--turbo-text-primary);
 }
 
 .showcase-features {

data/assets/css/noir.css

@@ -0,0 +1,447 @@
+/**
+ * Noir Editorial — design foundation tokens & shared patterns.
+ * Source: landing-designs.html Design #2 (.d2) via issue #512.
+ */
+
+/* ==========================================================================
+   Design tokens
+   ========================================================================== */
+
+/*
+ * Fallback faces with size-adjust so system fonts approximate webfont metrics.
+ * Paired with display=optional in BaseLayout (#729) to keep homepage CLS under
+ * the 0.1 CWV budget when Instrument Sans / Playfair swap (or never load).
+ */
+@font-face {
+  font-family: 'Instrument Sans Fallback';
+  src: local('Arial'), local('Helvetica Neue'), local('Helvetica');
+  size-adjust: 102%;
+  ascent-override: 95%;
+  descent-override: 22%;
+  line-gap-override: 0%;
+}
+
+@font-face {
+  font-family: 'Playfair Display Fallback';
+  src: local('Times New Roman'), local('Times'), local('Georgia');
+  size-adjust: 108%;
+  ascent-override: 90%;
+  descent-override: 22%;
+  line-gap-override: 0%;
+}
+
+@font-face {
+  font-family: 'JetBrains Mono Fallback';
+  src: local('Menlo'), local('Consolas'), local('Monaco'), local('Courier New');
+  size-adjust: 100%;
+  ascent-override: 92%;
+  descent-override: 22%;
+  line-gap-override: 0%;
+}
+
+:root {
+  /* Fonts */
+  --font-display: 'Playfair Display', 'Playfair Display Fallback', Georgia, serif;
+  --font-body: 'Instrument Sans', 'Instrument Sans Fallback', system-ui, sans-serif;
+  --font-mono: 'JetBrains Mono', 'JetBrains Mono Fallback', ui-monospace, monospace;
+
+  /* Backgrounds */
+  --noir-bg-base: #0a0a0b;
+  --noir-bg-panel: #0e0e10;
+  --noir-bg-code: #111114;
+
+  /* Text */
+  --noir-text-primary: #e8e6e3;
+  --noir-text-secondary: #888;
+  --noir-text-muted: #7c7c7c;
+  /* AA normal text on --noir-bg-base (#0a0a0b): was #555 (~2.65:1) */
+  --noir-text-muted-deep: #8a8a8a;
+  --noir-text-eyebrow: #9a9a9a;
+  --noir-ghost: #222;
+  --noir-ghost-deep: #1a1a1c;
+
+  /* Accent */
+  --noir-accent: #cba6f7;
+  --noir-accent-glow: rgba(203, 166, 247, 0.2);
+
+  /* Borders */
+  --noir-border-section: #222;
+  --noir-border-row: #1a1a1c;
+  --noir-border-ghost: #333;
+
+  /* Motion */
+  --noir-ease: cubic-bezier(0.4, 0, 0.2, 1);
+  --noir-duration: 250ms;
+  --transition-fast: 200ms var(--noir-ease);
+  --transition-normal: 250ms var(--noir-ease);
+  --transition-slow: 300ms var(--noir-ease);
+
+  /*
+   * Theme gradients / radii / elevation come from site.css + turbo tokens.
+   * Do not flatten them here — that fought showcase/prod glam while Noir
+   * chrome remains temporarily (full Noir retirement is a separate task).
+   */
+}
+
+/* ==========================================================================
+   Global base (scoped to Noir design context)
+   ========================================================================== */
+
+html[data-design='noir'] body {
+  margin: 0;
+  padding: 0;
+  font-family: var(--font-body);
+  font-size: 1rem;
+  line-height: 1.6;
+  color: var(--noir-text-primary);
+  background-color: var(--noir-bg-base);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  /* No color/background transition: theme swaps would otherwise animate
+     through a mid-flight blend that fails WCAG AA under axe. */
+}
+
+html[data-design='noir'] h1,
+html[data-design='noir'] h2,
+html[data-design='noir'] h3,
+html[data-design='noir'] .page-title {
+  font-family: var(--font-display);
+  font-weight: 900;
+  line-height: 1.1;
+  letter-spacing: -0.03em;
+  color: var(--noir-text-primary);
+}
+
+html:root h1,
+html:root .page-title {
+  letter-spacing: -0.04em;
+}
+
+html:root h1 em,
+html:root h2 em,
+html:root h3 em {
+  font-style: italic;
+  font-weight: 400;
+  color: var(--turbo-brand-primary, var(--noir-accent));
+}
+
+html:root code,
+html:root pre,
+html:root kbd,
+html:root samp {
+  font-family: var(--font-mono);
+}
+
+/*
+ * Content links follow the active theme accent (AA-normalized). Fixed
+ * `--noir-accent` is only ~2:1 on light theme bases. Header/footer keep
+ * their own noir ink via more-specific chrome selectors. Exclude `.btn`
+ * so component button colors win (#741).
+ */
+html:root a:where(:not(.btn)) {
+  color: var(--turbo-accent-link, var(--noir-accent));
+}
+
+html:root a:where(:not(.btn)):hover {
+  color: var(--turbo-brand-primary, var(--noir-text-primary));
+}
+
+/* ==========================================================================
+   Header — editorial chrome
+   ========================================================================== */
+
+html:root .header {
+  position: sticky;
+  top: 0;
+  z-index: 100;
+  background: var(--noir-bg-base);
+  backdrop-filter: none;
+  border-bottom: 1px solid var(--noir-border-section);
+  transition: border-color var(--transition-slow);
+}
+
+html:root .header-content {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+  padding: 0.875rem 1.5rem;
+  max-width: var(--container-wide, 1440px);
+  margin: 0 auto;
+}
+
+html:root .logo {
+  font-family: var(--font-display);
+  font-size: 1.125rem;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+  color: var(--noir-text-primary);
+  text-decoration: none;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+html:root .logo:hover {
+  color: var(--turbo-brand-primary, var(--noir-accent));
+  text-decoration: none;
+}
+
+html:root .logo-icon {
+  color: var(--turbo-brand-primary, var(--noir-accent));
+  font-size: 1rem;
+  line-height: 1;
+}
+
+html:root .logo-text {
+  text-transform: none;
+}
+
+/*
+ * Phone layout: let the brand wrap to two lines again. site.css pins
+ * `.logo` to `flex-shrink: 0` + `white-space: nowrap` (#742/#747) so the
+ * brand and nav cannot overlap on desktop; at 375px that keeps the brand
+ * on one line and pushes the theme selector off the right edge of the
+ * viewport. Noir chrome loads after site.css, so relaxing it here below
+ * the 768px breakpoint restores the wrapped phone brand while desktop
+ * keeps the no-shrink rule.
+ */
+@media (max-width: 767px) {
+  html:root .logo {
+    flex-shrink: 1;
+    white-space: normal;
+  }
+}
+
+/*
+ * Do not set `display` here — site.css owns desktop flex + the mobile
+ * `display: none` / `.open` drawer. Noir loads after site.css; an
+ * unconditional `display: flex` kept the mobile menu permanently open
+ * and hid the homepage behind the drawer.
+ */
+html:root .nav-links {
+  align-items: center;
+  gap: 0.25rem;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+/* Higher specificity than site.css theme-token nav colors so light themes
+   cannot paint dark secondary text onto the fixed noir header (#0a0a0b). */
+html[data-design='noir'] .header .nav-link,
+html[data-design='noir'] .header .nav-dropdown-trigger {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.35rem;
+  padding: 0.5rem 0.75rem;
+  min-height: 44px;
+  font-family: var(--font-body);
+  font-size: 0.75rem;
+  font-weight: 600;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+  color: var(--noir-text-muted);
+  text-decoration: none;
+  background: none;
+  border: none;
+  border-radius: var(--radius-md);
+  cursor: pointer;
+  /* No color/background transition — see the body rule above. */
+}
+
+html[data-design='noir'] .header .nav-link:hover,
+html[data-design='noir'] .header .nav-dropdown-trigger:hover {
+  color: var(--noir-text-primary);
+  background: transparent;
+  text-decoration: none;
+}
+
+/*
+ * The Noir header is fixed dark chrome (#0a0a0b), so the active pill keeps
+ * Noir ink like the sibling rules above. Light themes' --turbo-brand-primary
+ * is tuned for a light page background and lands at ~3.4-3.7:1 here, which
+ * fails AA (axe flags a[data-testid="nav-home"] under catppuccin-latte,
+ * github-light/dark, everforest-light-soft, rose-pine-dawn, tokyo-night-light).
+ */
+html[data-design='noir'] .header .nav-link.active {
+  color: var(--noir-accent);
+  background: color-mix(in srgb, var(--noir-accent) 14%, transparent);
+}
+
+html:root .menu-toggle {
+  color: var(--noir-text-primary);
+}
+
+html:root .menu-toggle:hover {
+  background: var(--noir-bg-panel);
+}
+
+html:root .nav-dropdown-menu {
+  background: var(--noir-bg-panel);
+  border: 1px solid var(--noir-border-section);
+  border-radius: var(--radius-lg);
+  box-shadow: var(--shadow-lg);
+  padding: 0.25rem 0;
+}
+
+html:root .nav-dropdown-item {
+  color: var(--noir-text-secondary);
+  border-radius: var(--radius-md);
+  font-size: 0.8125rem;
+  letter-spacing: 0.04em;
+}
+
+html:root .nav-dropdown-item:hover {
+  color: var(--noir-text-primary);
+  background: var(--noir-bg-code);
+}
+
+html:root .nav-controls {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  flex: 1;
+  justify-content: flex-end;
+  max-width: 500px;
+}
+
+/* Theme / search chrome — muted panel, theme radii */
+html[data-design='noir'] .header .theme-trigger,
+html[data-design='noir'] .header .search-bar-inner {
+  border-color: var(--noir-border-ghost);
+  background: var(--noir-bg-panel);
+  color: var(--noir-text-secondary);
+}
+
+html:root .theme-menu,
+html:root .search-menu {
+  border-color: var(--noir-border-section);
+  background: var(--noir-bg-panel);
+  box-shadow: var(--shadow-lg);
+}
+
+/* ==========================================================================
+   Footer — editorial chrome
+   ========================================================================== */
+
+html[data-design='noir'] .footer {
+  padding: 0;
+  background: var(--noir-bg-base);
+  border-top: 1px solid var(--noir-border-section);
+  margin-top: var(--space-4xl, 6rem);
+}
+
+html:root .footer-content {
+  display: grid;
+  grid-template-columns: 1.4fr 1fr 1fr 1fr;
+  gap: 2.5rem;
+  align-items: start;
+  padding: 3.75rem 1.5rem;
+  max-width: var(--container-wide, 1440px);
+  margin: 0 auto;
+}
+
+html:root .footer-brand {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+
+html:root .footer-brand-row {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+html[data-design='noir'] .footer .footer-logo {
+  color: var(--turbo-brand-primary, var(--noir-accent));
+  font-size: 1rem;
+  line-height: 1;
+}
+
+html[data-design='noir'] .footer .footer-title {
+  font-family: var(--font-display);
+  font-size: 1.125rem;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+  color: var(--noir-text-primary);
+}
+
+html[data-design='noir'] .footer .footer-tagline {
+  margin: 0;
+  max-width: 28ch;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  color: var(--noir-text-secondary);
+}
+
+html:root .footer-col {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+
+html[data-design='noir'] .footer .footer-col-label {
+  margin: 0 0 0.25rem;
+  font-family: var(--font-body);
+  font-size: 0.6875rem;
+  font-weight: 600;
+  letter-spacing: 0.15em;
+  text-transform: uppercase;
+  color: var(--noir-text-eyebrow);
+}
+
+html[data-design='noir'] .footer .footer-col a,
+html[data-design='noir'] .footer .footer-links a {
+  color: var(--noir-text-secondary);
+  font-size: 0.875rem;
+  text-decoration: none;
+}
+
+html[data-design='noir'] .footer .footer-col a:hover,
+html[data-design='noir'] .footer .footer-links a:hover {
+  color: var(--noir-text-primary);
+  text-decoration: none;
+}
+
+html[data-design='noir'] .footer .footer-bottom {
+  grid-column: 1 / -1;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  padding-top: 1.5rem;
+  border-top: 1px solid var(--noir-border-row);
+}
+
+html[data-design='noir'] .footer .footer-copyright {
+  margin: 0;
+  font-size: 0.75rem;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: var(--noir-text-muted);
+}
+
+html[data-design='noir'] .footer .footer-separator {
+  color: var(--noir-text-muted-deep);
+}
+
+@media (max-width: 900px) {
+  html:root .footer-content {
+    grid-template-columns: 1fr 1fr;
+    gap: 2rem;
+    padding: 2.5rem 1.25rem;
+  }
+
+  html:root .footer-brand {
+    grid-column: 1 / -1;
+  }
+}
+
+@media (max-width: 600px) {
+  html:root .footer-content {
+    grid-template-columns: 1fr;
+  }
+}

data/assets/css/site.css

@@ -140,14 +140,17 @@ p {
   margin: 0 0 var(--space-md);
 }
 
-a {
-  color: var(--turbo-brand-primary);
+/* Exclude `.btn` anchors so component button colors win over chrome link ink
+   (same pattern as noir.css / #741). `a:hover` must not paint brand-primary
+   text onto primary CTAs. Do not transition `color` — theme swaps would
+   animate through mid-flight ink that fails WCAG AA / axe scans. */
+a:where(:not(.btn)) {
+  color: var(--turbo-accent-link, var(--turbo-brand-primary));
   text-decoration: none;
-  transition: color var(--transition-fast);
 }
 
-a:hover {
-  color: var(--turbo-accent-link, var(--turbo-brand-primary));
+a:where(:not(.btn)):hover {
+  color: var(--turbo-brand-primary, var(--turbo-accent-link));
 }
 
 /* Links in text need underlines for accessibility (WCAG link-in-text-block) */
@@ -367,6 +370,7 @@ html:root .nav-dropdown-trigger {
   align-items: center;
   gap: var(--space-xs);
   padding: var(--space-sm) var(--space-md);
+  min-height: 44px;
   font-size: 0.9375rem;
   font-weight: 500;
   color: var(--turbo-text-secondary);
@@ -501,6 +505,8 @@ html:root .theme-trigger {
   align-items: center;
   gap: var(--space-sm);
   padding: var(--space-sm) var(--space-md);
+  min-height: 44px;
+  min-width: 44px;
   font-size: 0.875rem;
   font-weight: 500;
   color: var(--turbo-text-primary);
@@ -544,16 +550,15 @@ html:root .theme-menu {
   border: 1px solid var(--turbo-border-default);
   border-radius: var(--radius-lg);
   box-shadow: var(--shadow-lg);
-  opacity: 0;
-  visibility: hidden;
+  /* display:none when closed so axe/AT skip offscreen menu ink (opacity:0 still scans) */
+  display: none;
   transform: translateY(-8px);
-  transition: all var(--transition-fast);
+  transition: transform var(--transition-fast);
   z-index: 100;
 }
 
 html:root .theme-dropdown.open .theme-menu {
-  opacity: 1;
-  visibility: visible;
+  display: block;
   transform: translateY(0);
 }
 
@@ -579,6 +584,7 @@ html:root .theme-option {
   align-items: center;
   gap: var(--space-sm);
   width: 100%;
+  min-height: 44px;
   padding: var(--space-sm) var(--space-sm);
   font-size: 0.875rem;
   font-weight: 500;
@@ -3262,7 +3268,10 @@ html:root .footer-links a:hover {
   margin-bottom: 1.25rem;
   font-family: var(--turbo-font-mono);
   font-size: 1.0625rem;
-  color: color-mix(in srgb, var(--turbo-brand-primary) 60%, var(--turbo-text-primary));
+  color: var(--turbo-text-primary);
+  /* Reset global/inline-code chip backgrounds so primary ink stays AA */
+  background: transparent;
+  padding: 0;
 }
 
 @media (max-width: 900px) {
@@ -3303,6 +3312,17 @@ html:root .footer-links a:hover {
     opacity: 1;
     transform: none;
   }
+
+  /* Theme swaps change CSS variables; lingering transitions otherwise leave
+     text/background mid-blend under axe contrast checks. */
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+  }
 }
 
 /* ==========================================================================

data/assets/css/themes/ayu-dark.css

@@ -23,13 +23,18 @@
   --turbo-bg-surface: #141821; /* color */
   --turbo-bg-overlay: #1b1f29; /* color */
   --turbo-text-primary: #bfbdb6; /* color */
-  --turbo-text-secondary: #5b6876; /* color */
+  --turbo-text-secondary: #7c8691; /* color */
   --turbo-text-inverse: #0d1017; /* color */
   --turbo-brand-primary: #e6b450; /* color */
+  --turbo-brand-primary-text: #0d1017; /* color */
   --turbo-state-info: #39bae6; /* color */
   --turbo-state-success: #aad94c; /* color */
   --turbo-state-warning: #ff8f40; /* color */
   --turbo-state-danger: #d95757; /* color */
+  --turbo-state-info-text: #0d1017; /* color */
+  --turbo-state-success-text: #0d1017; /* color */
+  --turbo-state-warning-text: #0d1017; /* color */
+  --turbo-state-danger-text: #0d1017; /* color */
   --turbo-border-default: #1b1f29; /* color */
   --turbo-accent-link: #ffb454; /* color */
   --turbo-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; /* fontFamily */
@@ -41,7 +46,7 @@
   --turbo-heading-h5: #d2a6ff; /* color */
   --turbo-heading-h6: #ff8f40; /* color */
   --turbo-body-primary: #bfbdb6; /* color */
-  --turbo-body-secondary: #5b6876; /* color */
+  --turbo-body-secondary: #7c8691; /* color */
   --turbo-link-default: #ffb454; /* color */
   --turbo-selection-fg: #bfbdb6; /* color */
   --turbo-selection-bg: #1c212b; /* color */

data/assets/css/themes/ayu-light.css

@@ -23,29 +23,31 @@
   --turbo-bg-surface: #fafafa; /* color */
   --turbo-bg-overlay: #e7eaed; /* color */
   --turbo-text-primary: #5c6166; /* color */
-  --turbo-text-secondary: #828e9f; /* color */
+  --turbo-text-secondary: #656f7c; /* color */
   --turbo-text-inverse: #f8f9fa; /* color */
   --turbo-brand-primary: #f29718; /* color */
+  --turbo-brand-primary-text: #343435; /* color */
   --turbo-state-info: #55b4d4; /* color */
   --turbo-state-success: #86b300; /* color */
   --turbo-state-warning: #ff7e33; /* color */
   --turbo-state-danger: #e65050; /* color */
-  --turbo-state-info-text: #000000; /* color */
-  --turbo-state-success-text: #000000; /* color */
-  --turbo-state-warning-text: #000000; /* color */
+  --turbo-state-info-text: #39393a; /* color */
+  --turbo-state-success-text: #373737; /* color */
+  --turbo-state-warning-text: #343435; /* color */
+  --turbo-state-danger-text: #161617; /* color */
   --turbo-border-default: #e7eaed; /* color */
-  --turbo-accent-link: #a37acc; /* color */
+  --turbo-accent-link: #8160a1; /* color */
   --turbo-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; /* fontFamily */
   --turbo-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* fontFamily */
-  --turbo-heading-h1: #f2a300; /* color */
-  --turbo-heading-h2: #399ee6; /* color */
-  --turbo-heading-h3: #55b4d4; /* color */
-  --turbo-heading-h4: #86b300; /* color */
+  --turbo-heading-h1: #c28200; /* color */
+  --turbo-heading-h2: #3696db; /* color */
+  --turbo-heading-h3: #4899b4; /* color */
+  --turbo-heading-h4: #759c00; /* color */
   --turbo-heading-h5: #a37acc; /* color */
-  --turbo-heading-h6: #ff7e33; /* color */
+  --turbo-heading-h6: #e3702d; /* color */
   --turbo-body-primary: #5c6166; /* color */
-  --turbo-body-secondary: #828e9f; /* color */
-  --turbo-link-default: #a37acc; /* color */
+  --turbo-body-secondary: #656f7c; /* color */
+  --turbo-link-default: #8160a1; /* color */
   --turbo-selection-fg: #5c6166; /* color */
   --turbo-selection-bg: #e5e9ed; /* color */
   --turbo-blockquote-border: #e7eaed; /* color */