refactor: tweaks to styles

- cuesheet action is ghosted
- mute index in cuesheet milestones
- clarify mirrored state in navigation menu
- align overview contents

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/BlockRow.tsx

@@ -40,7 +40,7 @@ export default function BlockRow({ blockId, colour, hidePast, rowId, rowIndex, t
         <td className={style.actionColumn} tabIndex={-1} role='cell'>
           <IconButton
             aria-label='Options'
-            variant='subtle-white'
+            variant='ghosted-white'
             size='small'
             onClick={(e) => {
               const rect = e.currentTarget.getBoundingClientRect();

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/EventRow.tsx

@@ -93,7 +93,7 @@ export default function EventRow({
         <td className={style.actionColumn} tabIndex={-1} role='cell'>
           <IconButton
             aria-label='Options'
-            variant='subtle-white'
+            variant='ghosted-white'
             size='small'
             onClick={(e) => {
               const rect = e.currentTarget.getBoundingClientRect();

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/MilestoneRow.module.scss

@@ -16,4 +16,8 @@
     background-color: $gray-1250;
     border-radius: 2px;
   }
+
+  .indexColumn {
+    color: $label-gray;
+  }
 }

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/MilestoneRow.tsx

@@ -52,7 +52,7 @@ export default function MilestoneRow({
         <td className={style.actionColumn} tabIndex={-1} role='cell'>
           <IconButton
             aria-label='Options'
-            variant='subtle-white'
+            variant='ghosted-white'
             size='small'
             onClick={(e) => {
               const rect = e.currentTarget.getBoundingClientRect();