v4: every inline editor ends in a btn-primary Save and a btn-secondary Cancel — comments drew their own .comment-submit-btn and .comment-cancel-btn, the profile's email its own .profile-email-btn pair, the bio a plain-text form-cancel, and the chat's edit box shrank the shared buttons with a rule of its own; they were four sizes, two orders of chrome, and the comment button's white label sat on Smooth's yellow accent. They all take the shared classes now, and the new .btn-sm is the one compact size, for the comment forms, the chat edit box and the email editor; the bio and the dump title stay full size. .btn-secondary gets a disabled state, as btn-primary has. The bespoke rules are gone, with GeoCities' bevel for the comment buttons, which btn-primary and btn-secondary already have. 670 frontend tests pass, and tsc, eslint and deno fmt are clean; the comment, reply, chat edit, email and bio editors were checked in screenshots in Smooth, Kanagawa, Brutalist and GeoCities at 1100 and 360px.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/components/chat/ChatEditBox.tsx

@@ -78,13 +78,17 @@ export function ChatEditBox(
       <div className="chat-edit-actions">
         <button
           type="button"
-          className="btn-primary"
+          className="btn-primary btn-sm"
           onClick={save}
           disabled={!sendable(draft)}
         >
           <Trans>Save</Trans>
         </button>
-        <button type="button" className="btn-secondary" onClick={onCancel}>
+        <button
+          type="button"
+          className="btn-secondary btn-sm"
+          onClick={onCancel}
+        >
           <Trans>Cancel</Trans>
         </button>
       </div>

src/components/comment/CommentForm.tsx

@@ -109,7 +109,7 @@ export function CommentForm({
       <FormError title={errorTitle} />
       <div className="comment-form-actions">
         <SubmitButton
-          className="comment-submit-btn"
+          className="btn-primary btn-sm"
           pendingLabel={pendingLabel}
           disabled={disabled}
         >
@@ -118,7 +118,7 @@ export function CommentForm({
         {showCancel && (
           <button
             type="button"
-            className="comment-cancel-btn"
+            className="btn-secondary btn-sm"
             onClick={() => {
               form.reset({ body: "" });
               onCancel?.();

src/components/profile/DescriptionEditor.tsx

@@ -90,7 +90,7 @@ export function DescriptionEditor(
           </SubmitButton>
           <button
             type="button"
-            className="form-cancel"
+            className="btn-secondary"
             onClick={onCancel}
             disabled={submitting}
           >

src/components/profile/EmailEditor.tsx

@@ -68,7 +68,7 @@ export function EmailEditor(
         />
         <div className="profile-email-actions">
           <SubmitButton
-            className="profile-email-btn profile-email-btn--save"
+            className="btn-primary btn-sm"
             pendingLabel={<Trans>Saving…</Trans>}
             disabled={!email.trim()}
           >
@@ -76,7 +76,7 @@ export function EmailEditor(
           </SubmitButton>
           <button
             type="button"
-            className="profile-email-btn profile-email-btn--cancel"
+            className="btn-secondary btn-sm"
             onClick={onCancel}
             disabled={submitting}
           >