standardise buttons: .btn base class (border-radius 10px, padding var(--space-xs))

app/public/assets/css/admin.css

@@ -89,68 +89,26 @@
     gap: var(--space-s);
 }
 
-.admin-btn {
-    padding: var(--space-2xs) var(--space-l);
-    background: var(--accent-primary);
-    color: var(--accent-foreground);
-    border: none;
-    border-radius: 3px;
-    font-size: var(--step--1);
-    font-family: inherit;
-    cursor: pointer;
-    letter-spacing: 0.04em;
-    text-decoration: none;
-    display: inline-block;
-    transition: background 0.15s;
-}
+/* ── Admin button aliases — see common.css .btn base class ────────────── */
 
-.admin-btn:hover {
-    background: var(--accent-secondary);
+.admin-btn {
+    /* deprecated alias for .btn--primary; kept for backward-compat */
 }
 
 .admin-btn-secondary {
-    padding: var(--space-3xs) var(--space-m);
-    background: transparent;
-    color: var(--text-tertiary);
-    border: 1px solid var(--border-primary);
-    border-radius: 3px;
-    font-size: var(--step--1);
-    font-family: inherit;
-    cursor: pointer;
-    letter-spacing: 0.04em;
-    text-decoration: none;
-    display: inline-block;
-    transition: all 0.15s;
+    /* deprecated alias for .btn--secondary; kept for backward-compat */
 }
 
-.admin-btn-secondary:hover {
-    border-color: var(--text-secondary);
-    color: var(--text-primary);
-}
-
-/* Small size modifier */
 .admin-btn--sm {
-    padding: var(--space-3xs) var(--space-2xs);
-    font-size: var(--step--2);
+    /* deprecated alias for .btn--sm; kept for backward-compat */
 }
 
-/* Semantic colour modifiers */
 .admin-btn--warning {
-    background: var(--accent-yellow);
-    color: var(--text-primary);
-    border: none;
-}
-.admin-btn--warning:hover {
-    filter: brightness(0.9);
+    /* deprecated alias for .btn--warning; kept for backward-compat */
 }
 
 .admin-btn--danger {
-    background: var(--accent-red);
-    color: var(--accent-foreground);
-    border: none;
-}
-.admin-btn--danger:hover {
-    filter: brightness(0.9);
+    /* deprecated alias for .btn--danger; kept for backward-compat */
 }
 
 /* ── Toast messages (bottom-center, CSS-only auto-fade) ─────────────── */
@@ -319,37 +277,11 @@
 }
 
 .admin-filters-btn {
-    padding: var(--space-3xs) var(--space-s);
-    background: var(--accent-primary);
-    color: var(--accent-foreground);
-    border: none;
-    border-radius: 3px;
-    font-size: var(--step--1);
-    font-family: inherit;
-    cursor: pointer;
-    transition: background 0.15s;
-}
-
-.admin-filters-btn:hover {
-    background: var(--accent-secondary);
+    /* deprecated alias for .btn--primary; kept for backward-compat */
 }
 
 .admin-filters-reset {
-    font-size: var(--step--1);
-    color: var(--text-secondary);
-    background: none;
-    border: 1px solid var(--border-primary);
-    border-radius: 3px;
-    font-family: inherit;
-    padding: var(--space-3xs) var(--space-xs);
-    cursor: pointer;
-    text-decoration: none;
-    transition: border-color 0.15s, color 0.15s;
-}
-
-.admin-filters-reset:hover {
-    border-color: var(--text-secondary);
-    color: var(--text-primary);
+    /* deprecated alias for .btn--secondary; kept for backward-compat */
 }
 
 /* ── Bulk actions bar ───────────────────────────────────────────────────── */
@@ -449,80 +381,40 @@
     color: var(--error);
 }
 
-/* ── Action buttons in table ────────────────────────────────────────────── */
+/* ── Action buttons in table — see common.css .btn base class ──────────── */
 .admin-actions {
     display: flex;
     gap: var(--space-3xs);
     flex-wrap: wrap;
 }
 
+/* Legacy table-action size — now just an alias */
 .admin-btn-sm {
-    padding: var(--space-3xs) var(--space-2xs);
-    min-height: 2rem;
-    border-radius: 3px;
-    font-size: var(--step--2);
-    font-family: inherit;
-    cursor: pointer;
-    text-decoration: none;
-    display: inline-flex;
-    align-items: center;
-    border: 1px solid transparent;
-    transition: all 0.15s;
-    white-space: nowrap;
+    /* deprecated alias for .btn--sm; kept for backward-compat */
 }
 
 .admin-btn-view {
-    background: var(--blue-muted-bg);
-    color: var(--accent-blue);
-    border-color: var(--blue-muted-border);
-}
-.admin-btn-view:hover {
-    background: var(--blue-muted-bg-hover);
+    /* deprecated alias for .btn--sm .btn--blue */
 }
 
 .admin-btn-visit {
-    background: var(--success-muted-bg);
-    color: var(--success);
-    border-color: var(--success-muted-border);
-}
-.admin-btn-visit:hover {
-    background: var(--green-muted-bg-hover);
+    /* deprecated alias for .btn--sm .btn--green */
 }
 
 .admin-btn-edit {
-    background: var(--yellow-muted-bg);
-    color: var(--accent-yellow);
-    border-color: var(--yellow-muted-border);
-}
-.admin-btn-edit:hover {
-    background: var(--yellow-muted-bg-hover);
+    /* deprecated alias for .btn--sm .btn--yellow */
 }
 
 .admin-btn-publish {
-    background: var(--green-muted-bg);
-    color: var(--accent-green);
-    border-color: var(--green-muted-border);
-}
-.admin-btn-publish:hover {
-    background: var(--green-muted-bg-hover);
+    /* deprecated alias for .btn--sm .btn--green */
 }
 
 .admin-btn-unpublish {
-    background: var(--bg-secondary);
-    color: var(--text-tertiary);
-    border-color: var(--border-primary);
-}
-.admin-btn-unpublish:hover {
-    background: var(--bg-tertiary);
+    /* deprecated alias for .btn--sm .btn--muted */
 }
 
 .admin-btn-delete {
-    background: var(--error-muted-bg);
-    color: var(--error);
-    border-color: var(--error-muted-border, var(--border-primary));
-}
-.admin-btn-delete:hover {
-    filter: brightness(0.9);
+    /* deprecated alias for .btn--sm .btn--red */
 }
 
 .publish-form {
@@ -705,7 +597,7 @@
     padding-top: var(--space-2xs);
 }
 
-.admin-login-box .admin-btn {
+.admin-login-box .btn {
     width: 100%;
 }
 
@@ -1121,53 +1013,15 @@
 }
 
 .param-form > button {
-    align-self: flex-start;
-    padding: var(--space-2xs) var(--space-l);
-    background: var(--accent-primary);
-    color: var(--accent-foreground);
-    border: none;
-    border-radius: 3px;
-    font-size: var(--step--1);
-    font-family: inherit;
-    cursor: pointer;
-    letter-spacing: 0.04em;
-    transition: background 0.15s;
-}
-
-.param-form > button:hover {
-    background: var(--accent-secondary);
+    /* deprecated alias for .btn--primary; kept for backward-compat */
 }
 
 .param-btn-warning {
-    padding: var(--space-3xs) var(--space-s);
-    background: var(--accent-yellow);
-    color: var(--text-primary);
-    border: none;
-    border-radius: 3px;
-    font-size: var(--step--1);
-    font-family: inherit;
-    cursor: pointer;
-    transition: filter 0.15s;
-}
-
-.param-btn-warning:hover {
-    filter: brightness(0.9);
+    /* deprecated alias for .btn--warning; kept for backward-compat */
 }
 
 .param-btn-danger {
-    padding: var(--space-3xs) var(--space-s);
-    background: var(--accent-red);
-    color: var(--accent-foreground);
-    border: none;
-    border-radius: 3px;
-    font-size: var(--step--1);
-    font-family: inherit;
-    cursor: pointer;
-    transition: filter 0.15s;
-}
-
-.param-btn-danger:hover {
-    filter: brightness(0.9);
+    /* deprecated alias for .btn--danger; kept for backward-compat */
 }
 
 .param-danger-zone {
@@ -1208,19 +1062,7 @@
 }
 
 .param-btn-export {
-    padding: var(--space-3xs) var(--space-s);
-    background: var(--primary, #2563eb);
-    color: var(--accent-foreground, #fff);
-    border: none;
-    border-radius: 3px;
-    font-size: var(--step--1);
-    font-family: inherit;
-    cursor: pointer;
-    transition: filter 0.15s;
-}
-
-.param-btn-export:hover {
-    filter: brightness(0.9);
+    /* deprecated alias for .btn--primary; kept for backward-compat */
 }
 
 
@@ -1541,7 +1383,7 @@
     min-height: 2.75rem;
     padding: 0 var(--space-2xs);
     border: 1px solid var(--border-secondary);
-    border-radius: 3px;
+    border-radius: 10px;
     color: var(--text-primary);
     font-size: var(--step--1);
     text-decoration: none;

app/public/assets/css/common.css

@@ -390,6 +390,174 @@ main {
     }
 }
 
+/* ============================================================
+   BUTTONS — shared .btn base class
+   Targets both <a> and <button>, always has a background.
+   border-radius: 10px; padding: var(--space-xs)
+   ============================================================ */
+
+.btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--space-3xs);
+    padding: var(--space-xs);
+    border-radius: 10px;
+    font-size: var(--step--1);
+    font-family: inherit;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    cursor: pointer;
+    text-decoration: none;
+    line-height: 1.3;
+    border: none;
+    transition:
+        background 0.15s,
+        opacity 0.15s,
+        box-shadow 0.15s,
+        filter 0.15s;
+}
+
+.btn:hover {
+    filter: brightness(0.92);
+}
+
+/* Primary: accent background, white text */
+.btn--primary {
+    background: var(--accent-primary);
+    color: var(--accent-foreground);
+}
+
+.btn--primary:hover {
+    background: var(--accent-secondary);
+    filter: none;
+}
+
+/* Secondary: light background with border */
+.btn--secondary {
+    background: var(--bg-primary);
+    color: var(--text-secondary);
+    border: 1px solid var(--border-primary);
+}
+
+.btn--secondary:hover {
+    border-color: var(--text-secondary);
+    color: var(--text-primary);
+    filter: none;
+}
+
+/* Muted secondary: bg-secondary background */
+.btn--muted {
+    background: var(--bg-secondary);
+    color: var(--text-secondary);
+    border: 1px solid var(--border-primary);
+}
+
+.btn--muted:hover {
+    background: var(--bg-tertiary);
+    color: var(--text-primary);
+    filter: none;
+}
+
+/* Ghost: transparent bg, border, for links styled as buttons */
+.btn--ghost {
+    background: transparent;
+    color: var(--text-secondary);
+    border: 1px solid var(--border-primary);
+}
+
+.btn--ghost:hover {
+    border-color: var(--text-secondary);
+    color: var(--text-primary);
+    filter: none;
+}
+
+/* Danger: red background */
+.btn--danger {
+    background: var(--accent-red);
+    color: var(--accent-foreground);
+}
+
+.btn--danger:hover {
+    filter: brightness(0.9);
+}
+
+/* Warning: yellow background */
+.btn--warning {
+    background: var(--accent-yellow);
+    color: var(--text-primary);
+}
+
+.btn--warning:hover {
+    filter: brightness(0.9);
+}
+
+/* Success: green background */
+.btn--success {
+    background: var(--accent-green);
+    color: var(--accent-foreground);
+}
+
+.btn--success:hover {
+    filter: brightness(0.9);
+}
+
+/* Small size modifier */
+.btn--sm {
+    padding: var(--space-2xs) var(--space-xs);
+    font-size: var(--step--2);
+}
+
+/* Large size modifier */
+.btn--lg {
+    padding: var(--space-s) var(--space-m);
+    font-size: var(--step-0);
+}
+
+/* Semantic colour modifiers on the muted base (for table/action buttons) */
+.btn--blue {
+    background: var(--blue-muted-bg);
+    color: var(--accent-blue);
+    border: 1px solid var(--blue-muted-border);
+}
+
+.btn--blue:hover {
+    background: var(--blue-muted-bg-hover);
+    filter: none;
+}
+
+.btn--yellow {
+    background: var(--yellow-muted-bg);
+    color: var(--accent-yellow);
+    border: 1px solid var(--yellow-muted-border);
+}
+
+.btn--yellow:hover {
+    background: var(--yellow-muted-bg-hover);
+    filter: none;
+}
+
+.btn--green {
+    background: var(--green-muted-bg);
+    color: var(--accent-green);
+    border: 1px solid var(--green-muted-border);
+}
+
+.btn--green:hover {
+    background: var(--green-muted-bg-hover);
+    filter: none;
+}
+
+.btn--red {
+    background: var(--error-muted-bg);
+    color: var(--error);
+    border: 1px solid var(--danger-border-muted);
+}
+
+.btn--red:hover {
+    filter: brightness(0.9);
+}
+
 /* ============================================================
    SEMANTIC HTML ELEMENTS — baseline styling shared everywhere
    ============================================================ */

app/public/assets/css/file-access.css

@@ -195,32 +195,15 @@
 }
 
 .access-req-btn {
-    font-family: inherit;
-    font-size: var(--step--1);
-    font-weight: 600;
-    padding: var(--space-2xs) var(--space-m);
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    transition: background 0.2s, opacity 0.2s;
+    /* deprecated alias for .btn; kept for backward-compat */
 }
 
 .access-req-btn--approve {
-    background: var(--accent-primary);
-    color: var(--accent-foreground);
-}
-
-.access-req-btn--approve:hover {
-    background: var(--accent-secondary);
+    /* deprecated alias for .btn--primary */
 }
 
 .access-req-btn--reject {
-    background: #e53e3e;
-    color: white;
-}
-
-.access-req-btn--reject:hover {
-    background: #c53030;
+    /* deprecated alias for .btn--danger */
 }
 
 /* Pagination */

app/public/assets/css/form.css

@@ -250,20 +250,7 @@ label:has(+ div > input:required)::after {
 }
 
 .admin-btn-remove {
-    background: none;
-    border: 1px solid var(--border-primary);
-    color: var(--text-tertiary);
-    border-radius: 3px;
-    padding: var(--space-3xs) var(--space-2xs);
-    min-height: 2rem;
-    font-size: var(--step--2);
-    line-height: 1;
-    display: inline-flex;
-    align-items: center;
-    cursor: pointer;
-    transition:
-        border-color 0.15s,
-        color 0.15s;
+    /* deprecated alias for .btn--sm .btn--ghost; kept for backward-compat */
 }
 
 .admin-btn-remove:hover {
@@ -317,20 +304,7 @@ label:has(+ div > input:required)::after {
 }
 
 .form-footer button {
-    padding: var(--space-2xs) var(--space-l);
-    background: var(--accent-primary);
-    color: var(--accent-foreground);
-    border: none;
-    border-radius: 3px;
-    font-size: var(--step--1);
-    font-family: inherit;
-    cursor: pointer;
-    letter-spacing: 0.04em;
-    transition: background 0.15s;
-}
-
-.form-footer button:hover {
-    background: var(--accent-secondary);
+    /* deprecated alias for .btn--primary; kept for backward-compat */
 }
 
 /* ── Flash messages ─────────────────────────────────────────────────────── */
@@ -510,19 +484,7 @@ label:has(+ div > input:required)::after {
 }
 
 .password-gate button {
-    padding: var(--space-xs) var(--space-l);
-    font-size: var(--step--1);
-    font-family: inherit;
-    cursor: pointer;
-    background: var(--accent-primary);
-    color: var(--accent-foreground);
-    border: none;
-    border-radius: 3px;
-    transition: background 0.15s;
-}
-
-.password-gate button:hover {
-    background: var(--accent-secondary);
+    /* deprecated alias for .btn--primary; kept for backward-compat */
 }
 
 .password-error {
@@ -971,27 +933,7 @@ a.recap-file-name:hover {
 }
 
 .btn-new-form {
-    display: inline-flex;
-    align-items: center;
-    gap: var(--space-2xs);
-    padding: var(--space-m) var(--space-2xl);
-    background: var(--accent-primary);
-    color: var(--accent-foreground);
-    border: none;
-    border-radius: 6px;
-    font-size: var(--step-0);
-    font-weight: 600;
-    font-family: inherit;
-    text-decoration: none;
-    cursor: pointer;
-    letter-spacing: 0.04em;
-    transition: background 0.15s, transform 0.15s;
-    margin-top: var(--space-s);
-}
-
-.btn-new-form:hover {
-    background: var(--accent-secondary);
-    transform: translateY(-1px);
+    /* deprecated alias for .btn--primary .btn--lg; kept for backward-compat */
 }
 
 
@@ -1089,31 +1031,9 @@ a.recap-file-name:hover {
 }
 
 .btn-primary {
-    padding: var(--space-xs) var(--space-m);
-    background: var(--accent-primary);
-    color: #fff;
-    border: none;
-    border-radius: 4px;
-    font-size: var(--step-0);
-    cursor: pointer;
-    font-weight: 600;
-}
-
-.btn-primary:hover {
-    background: var(--accent-secondary, var(--accent-primary));
-    transform: translateY(-1px);
+    /* deprecated alias for .btn--primary; kept for backward-compat */
 }
 
 .btn-secondary {
-    padding: var(--space-xs) var(--space-m);
-    background: transparent;
-    color: var(--text-secondary);
-    border: 1px solid var(--border-primary);
-    border-radius: 4px;
-    font-size: var(--step-0);
-    cursor: pointer;
-}
-
-.btn-secondary:hover {
-    background: color-mix(in srgb, var(--text-secondary) 8%, transparent);
+    /* deprecated alias for .btn--secondary; kept for backward-compat */
 }

app/public/assets/css/public.css

@@ -219,7 +219,7 @@
     min-height: 2.75rem;
     padding: 0 var(--space-2xs);
     border: 1px solid var(--border-secondary);
-    border-radius: 3px;
+    border-radius: 10px;
     color: var(--text-primary);
     font-size: var(--step--1);
     text-decoration: none;

app/public/assets/css/repertoire.css

@@ -272,19 +272,7 @@
 }
 
 .search-apply-btn {
-    font-size: var(--step--1);
-    padding: var(--space-3xs) var(--space-xs);
-    background: var(--accent-primary);
-    color: var(--accent-foreground);
-    border: none;
-    border-radius: 3px;
-    cursor: pointer;
-    font-family: inherit;
-    transition: background 0.15s;
-}
-
-.search-apply-btn:hover {
-    background: var(--accent-secondary);
+    /* deprecated alias for .btn--primary; kept for backward-compat */
 }
 
 .search-reset-link {
@@ -311,7 +299,7 @@
     min-height: 2.75rem;
     padding: 0 var(--space-2xs);
     border: 1px solid var(--border-secondary);
-    border-radius: 3px;
+    border-radius: 10px;
     color: var(--text-primary);
     font-size: var(--step--1);
     text-decoration: none;

app/public/assets/css/system.css

@@ -309,18 +309,10 @@
     font-family: ui-monospace, monospace;
 }
 .log-copy-btn {
+    /* uses .btn--secondary .btn--sm but with absolute positioning overrides */
     position: absolute;
     top: var(--space-2xs);
     right: var(--space-2xs);
-    background: var(--bg-primary);
-    border: 1px solid var(--border-primary);
-    color: var(--text-secondary);
-    border-radius: 4px;
-    font-size: var(--step--2);
-    padding: var(--space-3xs) var(--space-2xs);
-    cursor: pointer;
-    font-family: inherit;
-    transition: color .15s, border-color .15s;
     z-index: 2;
 }
 .log-copy-btn:hover {

app/public/assets/css/tfe.css

@@ -283,23 +283,12 @@ aside figcaption {
 }
 
 .tfe-btn-request-access {
-    font-family: inherit;
-    font-size: var(--step--1);
-    font-weight: 600;
-    padding: var(--space-2xs) var(--space-s);
-    background: var(--accent);
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    transition:
-        background 0.2s,
-        opacity 0.2s;
+    /* deprecated alias for .btn--primary; kept for backward-compat */
     margin-top: var(--space-3xs);
 }
 
 .tfe-btn-request-access:hover:not(:disabled) {
-    background: var(--accent-dark);
+    /* handled by .btn--primary */
 }
 
 .tfe-btn-request-access:disabled {