Slide box: a scrim the circle's centred text can be read on

src/data/catalog.ts

@@ -1827,7 +1827,7 @@ import { analytics } from '../data/site';
       { name: '--slb-fade', fallback: '200ms', note: 'The crossfade under reduced motion.' },
       { name: '--slb-focus', fallback: 'var(--slb-accent)', note: 'Focus ring round the card.' },
       { name: '--slb-image-fg', fallback: '#fff', note: 'variant="image": text over the photo and on its tinted back.' },
-      { name: '--slb-scrim', fallback: 'linear-gradient(to top, rgb(20 24 40 / 0.45), rgb(20 24 40 / 0.3) 60%, transparent)', note: 'variant="image": behind the front’s title, for 4.5:1 over the photo. Measure it per image and set it on each tile; the fallback is a starting point, not an answer (latlonguas.com’s four photos needed 0.19–0.33).' },
+      { name: '--slb-scrim', fallback: 'linear-gradient(to top, rgb(20 24 40 / 0.45), rgb(20 24 40 / 0.3) 60%, transparent)', note: 'variant="image": behind the front’s title, for 4.5:1 over the photo. Measure it per image and set it on each tile; the fallback is a starting point, not an answer (latlonguas.com’s four photos needed 0.19–0.33). On shape="circle" it fills the disc instead, with its own fallback (a radial tint, 0.62 under the centred text, 0.38 at the rim); set a radial gradient or a flat colour there, not a foot gradient.' },
       { name: '--slb-image-back-bg', fallback: 'rgb(20 24 40 / 0.86)', note: 'variant="image": the tint that slides in over the photo.' },
       { name: '--slb-image-height', fallback: '16rem', note: 'variant="image": the card’s floor.' },
     ],

src/library/slide-box/SlideBox.astro

@@ -30,7 +30,10 @@
  *
  * The image variant's scrim. Measure `--slb-scrim` for each photo and set it on that tile; never
  * reuse one dark value. The fallback (0.45 at the foot) is only a starting point: on
- * latlonguas.com four real photos needed 0.19–0.33, and 0.85 buried them.
+ * latlonguas.com four real photos needed 0.19–0.33, and 0.85 buried them. A circle's text sits
+ * in the middle of the disc, so its scrim fills the disc instead (the fallback is a radial
+ * tint, darkest under the text); `--slb-scrim` overrides it there too, as a radial gradient or a
+ * flat colour, not a foot gradient.
  *
  * Sizing. Both panels share one grid cell, so the card is as tall as the taller panel and
  * neither is cut off; there is no fixed height. The host's grid sets the width.
@@ -530,11 +533,13 @@ locals.__slideBoxScript = true;
   .slb--circle[data-ready].slb--image .slb__front {
     align-content: center;
   }
+  /* The circle's scrim fills the disc, darkest under the centred text. --slb-scrim overrides it
+     here as well; a circle wants a radial or a flat value, not the foot gradient. */
   .slb--circle[data-ready].slb--image .slb__front::after {
     content: '';
     position: absolute;
     inset: 0;
-    background: rgb(20 24 40 / 0.35);
+    background: var(--slb-scrim, radial-gradient(closest-side, rgb(20 24 40 / 0.62) 55%, rgb(20 24 40 / 0.38)));
   }
   .slb--circle[data-ready] .slb__front .slb__body {
     position: relative;