Button: drop the optical shift, centre the label geometrically
Tried on the eye rather than the ruler: with the label a pixel low it read
worse, not better. Back to plain --_pad-y top and bottom. The size ramp
(27/34/43) is unaffected — the shift only ever moved the label inside the
box.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_019yEVAE5whghEqnU1g2tuX7
change
commit f38e9256fadec5f839387057386e021a53a66e67
author Claude <noreply@anthropic.com>
date
parent ec5a9e5d
diff --git a/_components/button.md b/_components/button.md
index 64af107..5ec2fd6 100644
--- a/_components/button.md
+++ b/_components/button.md
@@ -40,11 +40,6 @@ with it — weight, radius, and letter-spacing never move. Medium is the
 default, and it lands within a pixel of a default IconButton's 34px box, so
 a button and an icon button in the same row line up.
 
-At every size the label sits one pixel below the geometric centre of the
-box. Centred exactly, a word with no descenders reads high — the eye counts
-the empty descender space under it as part of the word. The pixel is a
-deliberate correction, not a rounding error.
-
 <figure class="example">
 <figcaption>Sizes</figcaption>
 <div>
diff --git a/_sass/components/button.css b/_sass/components/button.css
index 8593328..feab235 100644
--- a/_sass/components/button.css
+++ b/_sass/components/button.css
@@ -25,18 +25,13 @@ a.btn {
   --_fg: var(--gl-color-text-primary);
   --_pad-y: 0.5rem;
   --_pad-x: 1rem;
-  --_shift: 1px;
   --_font: var(--gl-step--1);
 
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: var(--gl-space-2xs);
-  /* Optically centred, not geometrically: a mono label reads a shade high
-     in the box, so it gets one pixel more above it than below. The two
-     calcs cancel, so the button's height is exactly 2 × --_pad-y + the
-     line box either way. */
-  padding: calc(var(--_pad-y) + var(--_shift)) var(--_pad-x) calc(var(--_pad-y) - var(--_shift));
+  padding: var(--_pad-y) var(--_pad-x);
   border: none;
   border-radius: var(--gl-radius-md);
   background: var(--_bg);