remove dead CSS classes, extract color-mix tokens

Delete 9 unused classes (admin-badge-danger, admin-spinner, admin-swap,
5 setup-inbox-* classes, image-field-empty). Extract 5 admin text
opacity tokens as CSS custom properties, replacing 80 inline color-mix
calls. Saves ~4 KB (92 KB -> 87 KB).

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

assets/css/admin/components.css

@@ -2,6 +2,15 @@
 
 @layer admin {
 
+/* ── Derived tokens ── */
+:root {
+  --admin-text-ghost: var(--admin-text-ghost);
+  --admin-text-faintest: var(--admin-text-faintest);
+  --admin-text-faint: var(--admin-text-faint);
+  --admin-text-muted: var(--admin-text-muted);
+  --admin-text-soft: var(--admin-text-soft);
+}
+
 /* ── Layout ── */
 
 .admin-layout {
@@ -245,7 +254,7 @@
 .admin-header-subtitle {
   font-size: 0.875rem;
   line-height: 1.25rem;
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
 }
 
 .admin-header-actions {
@@ -278,7 +287,7 @@
   font-size: 0.875rem;
   line-height: 1.25rem;
   font-weight: 400;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 
   &:hover { text-decoration: underline; }
 }
@@ -325,7 +334,7 @@
 
 .admin-card-subtitle {
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
   margin-top: 0.25rem;
 }
 
@@ -336,7 +345,7 @@
   row-gap: 0.25rem;
   margin-top: 0.5rem;
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .admin-card-toolbar {
@@ -357,7 +366,7 @@
   height: 4rem;
   margin-inline: auto;
   margin-bottom: 1rem;
-  color: color-mix(in oklch, var(--t-text-primary) 30%, transparent);
+  color: var(--admin-text-ghost);
 }
 
 .admin-empty-state-title {
@@ -367,7 +376,7 @@
 
 .admin-empty-state-text {
   margin-top: 0.5rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   max-width: 28rem;
   margin-inline: auto;
 }
@@ -457,7 +466,7 @@
     font-size: 0.75rem;
     text-transform: uppercase;
     letter-spacing: 0.05em;
-    color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+    color: var(--admin-text-muted);
     border-bottom: 1px solid var(--t-surface-sunken);
   }
 
@@ -718,7 +727,7 @@
   font-weight: 500;
   border-radius: 9999px;
   background-color: var(--t-surface-sunken);
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
 }
 
 .admin-badge-sm {
@@ -741,14 +750,9 @@
   color: var(--t-status-warning, #b45309);
 }
 
-.admin-badge-danger {
-  background-color: color-mix(in oklch, var(--t-status-error, #ef4444) 15%, transparent);
-  color: var(--t-status-error, #dc2626);
-}
-
 .admin-badge-neutral {
   background-color: var(--t-surface-sunken);
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 /* ── Dropdown ── */
@@ -806,23 +810,13 @@
   to { transform: rotate(360deg); }
 }
 
-.admin-spinner {
-  display: inline-block;
-  width: 1.25rem;
-  height: 1.25rem;
-  border: 2px solid var(--t-border-default);
-  border-top-color: var(--t-accent);
-  border-radius: 9999px;
-  animation: admin-spin 0.6s linear infinite;
-}
-
 /* ── Divider ── */
 
 .admin-divider {
   display: flex;
   align-items: center;
   gap: 1rem;
-  color: color-mix(in oklch, var(--t-text-primary) 40%, transparent);
+  color: var(--admin-text-faintest);
   font-size: 0.75rem;
 
   &::before,
@@ -918,26 +912,11 @@
 
 .admin-alert-outline {
   background: none;
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
   border: 1px solid var(--t-border-default);
 }
 
-/* ── Swap (visibility toggle) ── */
 
-.admin-swap {
-  position: relative;
-  display: inline-flex;
-
-  & .admin-swap-on,
-  & .admin-swap-off {
-    display: none;
-  }
-
-  & .admin-swap-off { display: inline-flex; }
-
-  &.active .admin-swap-on { display: inline-flex; }
-  &.active .admin-swap-off { display: none; }
-}
 
 /* ── Dashboard stats grid ── */
 
@@ -991,7 +970,7 @@
 .admin-section-desc {
   margin-top: 0.5rem;
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .admin-section-body {
@@ -1044,7 +1023,7 @@
 .admin-status-pill-zinc {
   --_pill-ring: color-mix(in oklch, var(--t-text-primary) 10%, transparent);
   background: color-mix(in oklch, var(--t-surface-sunken) 50%, transparent);
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 /* ── Definition lists (key-value pairs) ── */
@@ -1062,7 +1041,7 @@
 .admin-dl-term {
   width: 7rem;
   flex-shrink: 0;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .admin-dl-value {
@@ -1085,7 +1064,7 @@
   font-weight: 500;
   border-bottom: 2px solid transparent;
   margin-bottom: -1px;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 
   &:hover {
     color: var(--t-text-primary);
@@ -1101,7 +1080,7 @@
 .admin-tab-count {
   margin-inline-start: 0.25rem;
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 40%, transparent);
+  color: var(--admin-text-faintest);
 }
 
 /* ── Status dot indicators (inline status with coloured dot) ── */
@@ -1127,7 +1106,7 @@
 .admin-status-dot-red { --_dot-color: #ef4444; color: #b91c1c; }
 .admin-status-dot-muted {
   --_dot-color: var(--t-border-default);
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 /* ── Stat cards (number + label) ── */
@@ -1146,7 +1125,7 @@
 
 .admin-stat-label {
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 /* ── Info box (warning/notice with ring) ── */
@@ -1184,7 +1163,7 @@
 
 .admin-link-subtle {
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 
   &:hover { color: var(--t-text-primary); }
 }
@@ -1280,7 +1259,7 @@
 }
 
 .setup-subtitle {
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   margin-top: 0.25rem;
   font-size: 0.875rem;
 }
@@ -1320,7 +1299,7 @@
   font-weight: 600;
   flex-shrink: 0;
   background: var(--t-surface-sunken, #e5e5e5);
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .setup-card-number-done {
@@ -1337,7 +1316,7 @@
   margin-top: 0.25rem;
   padding-inline-start: 2.5rem;
   font-size: 0.8125rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .setup-card-body {
@@ -1345,38 +1324,9 @@
   padding-inline-start: 2.5rem;
 }
 
-/* Setup: check inbox phase */
-.setup-check-inbox {
-  text-align: center;
-  padding: 1rem 0;
-}
-
-.setup-inbox-icon {
-  color: var(--t-text-primary, #171717);
-  margin: 0 auto 0.75rem;
-}
-
-.setup-inbox-heading {
-  font-size: 1.125rem;
-  font-weight: 600;
-  margin-bottom: 0.25rem;
-}
-
-.setup-inbox-detail {
-  font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
-  margin-bottom: 1rem;
-}
-
-.setup-start-over {
-  font-size: 0.8125rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
-  margin-top: 1rem;
-}
-
 .setup-hint {
   font-size: 0.8125rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   margin-bottom: 0.75rem;
 }
 
@@ -1387,7 +1337,7 @@
 
 .setup-key-hint {
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   margin-top: 0.25rem;
 }
 
@@ -1444,7 +1394,7 @@
 
   @media (hover: hover) {
     &:hover:not(:has(:disabled)) {
-      border-color: color-mix(in oklch, var(--t-text-primary) 40%, transparent);
+      border-color: var(--admin-text-faintest);
     }
   }
 
@@ -1476,7 +1426,7 @@
 
 .card-radio-description {
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .card-radio-badge {
@@ -1484,12 +1434,12 @@
   padding: 0.125rem 0.375rem;
   border-radius: 9999px;
   background: var(--t-surface-sunken, #e5e5e5);
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .card-radio-link {
   font-size: 0.6875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   text-decoration: underline;
   text-underline-offset: 2px;
 
@@ -1511,7 +1461,7 @@
   padding: 0.0625rem 0.375rem;
   border-radius: 9999px;
   background: var(--t-surface-sunken, #e5e5e5);
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
   white-space: nowrap;
 }
 
@@ -1543,7 +1493,7 @@
 
 .setup-complete p {
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   margin: 0.25rem 0 1rem;
 }
 
@@ -1573,7 +1523,7 @@
   align-items: center;
   gap: 0.5rem;
   font-size: 0.8125rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .admin-checklist-bar {
@@ -1631,7 +1581,7 @@
 }
 
 .admin-checklist-label-done {
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .admin-checklist-action {
@@ -1661,7 +1611,7 @@
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.05em;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   margin-bottom: 0.5rem;
 }
 
@@ -1704,7 +1654,7 @@
   border-radius: 0.375rem;
   background: var(--t-surface-sunken);
   flex-shrink: 0;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .page-card-info {
@@ -1721,12 +1671,12 @@
 
 .page-card-meta {
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
 }
 
 .page-card-arrow {
   flex-shrink: 0;
-  color: color-mix(in oklch, var(--t-text-primary) 30%, transparent);
+  color: var(--admin-text-ghost);
 }
 
 .page-card-custom {
@@ -1756,7 +1706,7 @@
   display: flex;
   align-items: center;
   padding: 0 0.25rem;
-  color: color-mix(in oklch, var(--t-text-primary) 30%, transparent);
+  color: var(--admin-text-ghost);
   cursor: pointer;
   border: none;
   background: none;
@@ -1772,7 +1722,7 @@
   display: flex;
   align-items: center;
   padding: 0 0.75rem 0 0.25rem;
-  color: color-mix(in oklch, var(--t-text-primary) 30%, transparent);
+  color: var(--admin-text-ghost);
   cursor: pointer;
   border: none;
   background: none;
@@ -1950,7 +1900,7 @@
 .block-list-empty {
   text-align: center;
   padding: 2rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   font-size: 0.875rem;
   border: 1px dashed var(--t-border-default);
   border-radius: 0.5rem;
@@ -1977,14 +1927,14 @@
   border-radius: 0.25rem;
   font-size: 0.75rem;
   font-weight: 600;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   flex-shrink: 0;
 }
 
 .block-card-icon {
   display: flex;
   align-items: center;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   flex-shrink: 0;
 }
 
@@ -2004,7 +1954,7 @@
 .block-card-preview {
   display: block;
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -2142,7 +2092,7 @@
   grid-column: 1 / -1;
   text-align: center;
   padding: 1rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   font-size: 0.8125rem;
 }
 
@@ -2170,7 +2120,7 @@
   align-items: flex-start;
   gap: 0.375rem;
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   background: color-mix(in oklch, var(--t-accent) 8%, transparent);
   border: 1px solid color-mix(in oklch, var(--t-accent) 20%, transparent);
   border-radius: 0.375rem;
@@ -2427,17 +2377,7 @@
   white-space: nowrap;
 }
 
-.image-field-empty {
+
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  padding: 0.75rem;
-  border: 2px dashed var(--t-border-default);
-  border-radius: 0.375rem;
-  color: var(--t-text-primary);
-  opacity: 0.5;
-  font-size: 0.8125rem;
-}
 
 .image-field-actions {
   display: flex;
@@ -2569,7 +2509,7 @@
   grid-column: 1 / -1;
   text-align: center;
   padding: 1.5rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   font-size: 0.8125rem;
 }
 
@@ -2587,7 +2527,7 @@
   border-radius: 0.375rem;
   font-size: 0.8125rem;
   cursor: pointer;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   transition: border-color 100ms, color 100ms;
 
   @media (hover: hover) {
@@ -3121,7 +3061,7 @@
 
 .admin-timeline-time {
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
 }
 
 /* ── Product thumbnail ── */
@@ -3158,7 +3098,7 @@
   background-color: var(--t-surface-sunken);
   padding: 0.125rem 0.375rem;
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   margin-top: 0.125rem;
 }
 
@@ -3211,7 +3151,7 @@
   border-radius: 9999px;
 }
 
-.admin-provider-dot-idle { background: color-mix(in oklch, var(--t-text-primary) 30%, transparent); }
+.admin-provider-dot-idle { background: var(--admin-text-ghost); }
 .admin-provider-dot-syncing { background: var(--t-status-warning); animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
 .admin-provider-dot-ok { background: var(--t-status-success); }
 .admin-provider-dot-error { background: var(--t-status-error); }
@@ -3228,7 +3168,7 @@
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.05em;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   margin-bottom: 0.75rem;
 }
 
@@ -3276,7 +3216,7 @@
 
 .admin-activity-time {
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   white-space: nowrap;
 }
 
@@ -3296,7 +3236,7 @@
   padding-block: 2rem;
   font-size: 0.875rem;
   line-height: 1.25rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .admin-stream-empty:only-child {
@@ -3356,12 +3296,12 @@
 .admin-text-secondary {
   font-size: 0.75rem;
   line-height: 1rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .admin-text-tertiary {
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
 }
 
 /* Checkbox/toggle + label inline pair */
@@ -3432,7 +3372,7 @@
   align-items: center;
   gap: 0.25rem;
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   margin-bottom: 1rem;
 
   &:hover {
@@ -3458,7 +3398,7 @@
 
 .theme-subtitle {
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   line-height: 1.6;
 }
 
@@ -3477,7 +3417,7 @@
 .theme-collapse-icon {
   width: 1.25rem;
   height: 1.25rem;
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
 }
 
 /* Section label (uppercase heading above option groups) */
@@ -3487,7 +3427,7 @@
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.05em;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   margin-bottom: 0.75rem;
 }
 
@@ -3573,7 +3513,7 @@
 
 .theme-preset-desc {
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 /* Colour picker inline row */
@@ -3600,7 +3540,7 @@
 .theme-color-value {
   font-family: monospace;
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
 }
 
 /* File upload trigger label */
@@ -3611,13 +3551,13 @@
   border-radius: 0.5rem;
   padding: 0.75rem;
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   text-align: center;
   cursor: pointer;
   transition: border-color 0.15s, color 0.15s;
 
   &:hover {
-    border-color: color-mix(in oklch, var(--t-text-primary) 40%, transparent);
+    border-color: var(--admin-text-faintest);
     color: color-mix(in oklch, var(--t-text-primary) 80%, transparent);
   }
 }
@@ -3712,13 +3652,13 @@
 .theme-slider-label {
   font-size: 0.75rem;
   font-weight: 500;
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
 }
 
 .theme-slider-value {
   font-size: 0.75rem;
   font-family: monospace;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 /* Customise accordion group */
@@ -3745,7 +3685,7 @@
 .theme-customise-label {
   font-size: 0.875rem;
   font-weight: 600;
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
   transition: color 0.1s;
 }
 
@@ -3757,7 +3697,7 @@
 .theme-customise-chevron {
   width: 1.25rem;
   height: 1.25rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   transition: transform 0.2s;
 }
 
@@ -3782,7 +3722,7 @@
 .theme-group-icon {
   width: 1rem;
   height: 1rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
 }
 
 .theme-group-title {
@@ -3804,7 +3744,7 @@
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.05em;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   margin-bottom: 0.5rem;
 }
 
@@ -3816,7 +3756,7 @@
 
 .theme-combination-footnote {
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 40%, transparent);
+  color: var(--admin-text-faintest);
   margin-top: 0.5rem;
 }
 
@@ -3859,7 +3799,7 @@
   font-weight: 500;
   border-radius: 0.375rem;
   transition: all 0.15s;
-  color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+  color: var(--admin-text-soft);
 
   &:hover {
     color: var(--t-text-primary);
@@ -3878,7 +3818,7 @@
   align-items: center;
   background: linear-gradient(to bottom, var(--t-border-default), color-mix(in oklch, var(--t-border-default) 80%, transparent));
   border: 1px solid color-mix(in oklch, var(--t-text-primary) 20%, transparent);
-  border-bottom-color: color-mix(in oklch, var(--t-text-primary) 30%, transparent);
+  border-bottom-color: var(--admin-text-ghost);
   border-radius: 0.625rem 0.625rem 0 0;
   padding: 0.625rem 0.875rem;
   gap: 0.875rem;
@@ -3925,12 +3865,12 @@
 .theme-browser-url-icon {
   width: 0.875rem;
   height: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
 }
 
 .theme-browser-url-text {
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -3947,10 +3887,10 @@
 
 /* Upload cancel button */
 .theme-upload-cancel {
-  color: color-mix(in oklch, var(--t-text-primary) 40%, transparent);
+  color: var(--admin-text-faintest);
 
   &:hover {
-    color: color-mix(in oklch, var(--t-text-primary) 70%, transparent);
+    color: var(--admin-text-soft);
   }
 }
 
@@ -3980,7 +3920,7 @@
   transition: border-color 0.15s, background 0.15s;
 
   &:hover {
-    border-color: color-mix(in oklch, var(--t-text-primary) 30%, transparent);
+    border-color: var(--admin-text-ghost);
   }
 }
 
@@ -4061,7 +4001,7 @@
 
 .admin-help-text {
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 60%, transparent);
+  color: var(--admin-text-muted);
 }
 
 .admin-warning-text {
@@ -4181,7 +4121,7 @@
 
 .admin-nav-empty {
   font-size: 0.875rem;
-  color: color-mix(in oklch, var(--t-text-primary) 50%, transparent);
+  color: var(--admin-text-faint);
   padding: 1rem 0;
 }
 
@@ -4197,7 +4137,7 @@
 
 .nav-editor-dropdown-slug {
   font-size: 0.75rem;
-  color: color-mix(in oklch, var(--t-text-primary) 40%, transparent);
+  color: var(--admin-text-faintest);
 }
 
 /* ── Page editor ── */
@@ -4238,7 +4178,7 @@
 .admin-icon-positive { color: #16a34a; }
 
 .admin-icon-muted {
-  color: color-mix(in oklch, var(--t-text-primary) 30%, transparent);
+  color: var(--admin-text-ghost);
 }
 
 /* ── Filter select label & wrapper ── */