diff --git a/docs/design-tokens.md b/docs/design-tokens.md
index 64e0f97..bc71c8f 100644
--- a/docs/design-tokens.md
+++ b/docs/design-tokens.md
@@ -40,6 +40,8 @@ Application rules:
 - Use `.ops-headline-h2` and `.ops-headline-h3` for readable section and card headings.
 - Do not remove mono from sigils, readiness status, telemetry, or controls.
 - Prefer `.ops-mono` or `.ops-eyebrow` when a component needs explicit tactical voice.
+- Use `.ops-telemetry-label`, `.ops-telemetry-value`, and `.ops-telemetry-detail` inside telemetry chips instead of one-off muted or attention text mixes.
+- Telemetry attention states should use the mapped `data-tone="attention"` rail and register treatment. Do not restyle them as full warning banners.
 
 ### Tracking scale
 
@@ -175,12 +177,14 @@ Application rules:
 - Reserve clipped panel notches for the app shell, first-level section cards, and key repeated controls.
 - Use `ops-flat-panel` for secondary decision zones and narrative guidance inside a section.
 - Use `ops-inline-alert` for non-critical banners that need tone without a full notched frame.
+- Use `.ops-recovery-support-panel` for steady backup, undo, and storage guidance blocks that need cockpit structure without alert escalation.
 - Use `tactical-subpanel` only when a nested control truly needs cockpit framing.
 - Use `tactical-subpanel-strong` when a detail brief or selected-state summary should read one step higher than surrounding support strips.
 - Use `tactical-chip-panel` for compact meta blocks, legends, and grouped facts that should feel inset rather than flat.
 - Keep these utilities inside the current cockpit language. They are not a license to add decorative glow, blur, or card-rounding.
 - Use tone chip panels for import, restore, recovery, and fault guidance instead of repeating inline gradient stacks.
 - Use uniform calm `SignalCard` chrome for backup summary signals. Express caution with the left spine or an inline tone chip rather than recoloring the entire card amber when the state is an intended safety lock.
+- Accordion status chips stay in `.ops-export-accordion-status` so badge alignment remains stable across open and collapsed recovery panels.
 
 Frame emphasis:
 
@@ -217,6 +221,16 @@ Application rules:
 - Do not recreate cockpit focus treatment with ad hoc `focus-visible:ring-*` Tailwind stacks in component markup.
 - Keep `ops-focus-ring-chip` on the clipped chip surface itself. If the focusable element is a parent shell, proxy focus to the chip surface instead of inventing a new ring pattern.
 
+History selection chrome:
+
+- `--ops-history-selection-bg`, `--ops-history-selection-bg-strong`, and `--ops-history-selection-border` are selection-only accents for the history grid and mobile week selector.
+- Use `.ops-history-selection-axis-header` on the selected desktop day header.
+- Use `.ops-history-selection-axis` on cells that belong to the selected desktop day column.
+- Use `.ops-history-selection-row-header` on the selected desktop sector row header.
+- Use `.ops-history-selection-node` on the exact selected desktop cell or selected mobile day.
+- Keep `aria-selected`, `aria-current`, and `aria-pressed` as the semantic source of truth. These classes are visual reinforcement only.
+- Do not use readiness status colors for selection axes. Status colors remain reserved for the cell payload, badges, and spines.
+
 ## Notch geometry
 
 Shared notch sizes live in `src/styles/index.css`.
diff --git a/src/components/HeaderTelemetry.tsx b/src/components/HeaderTelemetry.tsx
index 6bc7b51..1adf502 100644
--- a/src/components/HeaderTelemetry.tsx
+++ b/src/components/HeaderTelemetry.tsx
@@ -182,7 +182,7 @@ function TelemetryChip({
       ].join(' ')}
     >
       <span className="ops-telemetry-label-row">
-        <span className="ops-eyebrow text-[10px] font-semibold text-ops-text-muted">
+        <span className="ops-telemetry-label ops-eyebrow text-[10px] font-semibold text-ops-text-muted">
           {isAttention ? (
             <span className="ops-telemetry-attention-pip" aria-hidden="true">
               !
@@ -211,7 +211,7 @@ function TelemetryChip({
         <TelemetryRail />
       )}
       {detail ? (
-        <span className="ops-tracking-grid text-[10px] leading-4 text-ops-text-muted uppercase">
+        <span className="ops-telemetry-detail ops-tracking-grid text-[10px] leading-4 text-ops-text-muted uppercase">
           {detail}
         </span>
       ) : null}
diff --git a/src/features/export/StorageHealthSection.tsx b/src/features/export/StorageHealthSection.tsx
index 1106952..c8c38f0 100644
--- a/src/features/export/StorageHealthSection.tsx
+++ b/src/features/export/StorageHealthSection.tsx
@@ -48,7 +48,7 @@ export function StorageHealthSection({
           onRequestStorageProtection={onRequestStorageProtection}
           isRequestingStorageProtection={isRequestingStorageProtection}
         />
-        <div className="ops-flat-panel p-4 text-sm leading-6 text-ops-text-secondary sm:p-5">
+        <div className="ops-recovery-support-panel ops-flat-panel p-4 text-sm leading-6 text-ops-text-secondary sm:p-5">
           The browser automatically manages local storage. You can manually
           request exemption from automatic deletion, though browsers may deny
           this silently. Always rely on routine exports to secure your critical
diff --git a/src/features/export/UndoRecoverySection.tsx b/src/features/export/UndoRecoverySection.tsx
index 3b9c4c4..50e000f 100644
--- a/src/features/export/UndoRecoverySection.tsx
+++ b/src/features/export/UndoRecoverySection.tsx
@@ -38,7 +38,7 @@ export function UndoRecoverySection({
       <div className="space-y-4">
         <NotchedFrame
           emphasis="quiet"
-          innerClassName="tactical-chip-panel tactical-chip-panel-neutral p-4 text-sm leading-6 sm:p-5"
+          innerClassName="ops-recovery-support-panel tactical-chip-panel tactical-chip-panel-neutral p-4 text-sm leading-6 sm:p-5"
         >
           Undo restores the pre-import snapshot for the current session only.
           Reload the app and that rope is gone. Keep external backups current.
diff --git a/src/features/export/exportPanelShared.tsx b/src/features/export/exportPanelShared.tsx
index 677a8ce..c7e49fc 100644
--- a/src/features/export/exportPanelShared.tsx
+++ b/src/features/export/exportPanelShared.tsx
@@ -67,7 +67,9 @@ export function AccordionSection({
               </span>
             </span>
             {statusChip ? (
-              <span className="flex shrink-0 justify-end">{statusChip}</span>
+              <span className="ops-export-accordion-status flex shrink-0 justify-end">
+                {statusChip}
+              </span>
             ) : null}
           </span>
         </button>
diff --git a/src/features/history/DesktopHistoryGrid.tsx b/src/features/history/DesktopHistoryGrid.tsx
index 23c7ff3..d5276ef 100644
--- a/src/features/history/DesktopHistoryGrid.tsx
+++ b/src/features/history/DesktopHistoryGrid.tsx
@@ -177,7 +177,7 @@ export function DesktopHistoryGrid({ model }: DesktopHistoryGridProps) {
                             isToday
                               ? 'ops-history-today-header bg-[var(--ops-tint-1)] text-ops-accent-muted'
                               : isSelectedColumn
-                                ? 'ops-history-selected-column-header bg-[var(--ops-tint-2)] text-ops-text-primary'
+                                ? 'ops-history-selected-column-header ops-history-selection-axis-header bg-[var(--ops-tint-2)] text-ops-text-primary'
                                 : 'bg-ops-surface-1 text-ops-text-secondary',
                           ].join(' ')}
                           scope="col"
@@ -211,7 +211,7 @@ export function DesktopHistoryGrid({ model }: DesktopHistoryGridProps) {
                             'ops-history-sector-row-header ops-history-sector-divider ops-tracking-table sticky left-0 z-20 border-r border-ops-border-struct bg-ops-surface-2 px-4 py-3 text-left text-xs font-semibold uppercase',
                             getSectorTintClassName(sector.id),
                             isSelectedRow && hasInteractedWithHistory
-                              ? 'ops-history-selected-row-header'
+                              ? 'ops-history-selected-row-header ops-history-selection-row-header'
                               : '',
                             isSelectedRow
                               ? 'text-ops-accent-muted'
@@ -277,12 +277,12 @@ export function DesktopHistoryGrid({ model }: DesktopHistoryGridProps) {
                                   ? 'ops-history-week-boundary'
                                   : '',
                                 isSelected && hasInteractedWithHistory
-                                  ? 'ops-history-selected-cell bg-[var(--ops-tint-3)]'
+                                  ? 'ops-history-selected-cell ops-history-selection-node bg-[var(--ops-tint-3)]'
                                   : isToday
                                     ? 'ops-history-today-cell'
                                     : dateKey === selectedCell.dateKey &&
                                         hasInteractedWithHistory
-                                      ? 'ops-history-selected-column bg-[var(--ops-tint-1)]'
+                                      ? 'ops-history-selected-column ops-history-selection-axis bg-[var(--ops-tint-1)]'
                                       : isOddWeek
                                         ? 'ops-history-week-band'
                                         : '',
diff --git a/src/features/history/HistoryDetailBrief.tsx b/src/features/history/HistoryDetailBrief.tsx
index 92d0e83..c99153f 100644
--- a/src/features/history/HistoryDetailBrief.tsx
+++ b/src/features/history/HistoryDetailBrief.tsx
@@ -51,10 +51,12 @@ export function HistoryDetailBrief({
   }));
 
   return (
-    <div className="grid gap-4">
+    <div className="ops-history-detail-brief grid gap-4">
       <div className="flex items-start justify-between gap-3">
         <div className="min-w-0">
-          <p className="ops-eyebrow text-ops-text-muted">{title}</p>
+          <p className="ops-history-detail-label ops-eyebrow text-ops-text-muted">
+            {title}
+          </p>
           <div className="mt-2 flex flex-wrap items-center gap-2">
             {hasInteractedWithHistory ? (
               <span
@@ -69,7 +71,7 @@ export function HistoryDetailBrief({
             ) : null}
             <p className="ops-headline-h3">{selectedSector.label}</p>
           </div>
-          <h3 className="ops-numeric ops-tracking-caption mt-4 text-2xl leading-none font-semibold text-ops-text-primary uppercase">
+          <h3 className="ops-history-detail-date ops-numeric ops-tracking-caption mt-4 text-2xl leading-none font-semibold text-ops-text-primary uppercase">
             {selectedDateLabel}
           </h3>
         </div>
@@ -82,7 +84,7 @@ export function HistoryDetailBrief({
         {selectedStatusSummary}
       </p>
 
-      <div className="ops-flat-panel px-3 py-3">
+      <div className="ops-history-momentum-panel ops-flat-panel px-3 py-3">
         <div className="flex flex-wrap items-center justify-between gap-2">
           <p className="ops-eyebrow text-[10px] text-ops-text-muted">
             Sector momentum
diff --git a/src/features/history/MobileHistoryGrid.tsx b/src/features/history/MobileHistoryGrid.tsx
index cddb84d..b7d8c33 100644
--- a/src/features/history/MobileHistoryGrid.tsx
+++ b/src/features/history/MobileHistoryGrid.tsx
@@ -277,7 +277,7 @@ export function MobileHistoryGrid({ model }: MobileHistoryGridProps) {
                         className={[
                           'ops-focus-ring-chip ops-mobile-day-button ops-notch-chip clip-notched min-h-14 min-w-10 border px-2 py-2.5 text-center font-semibold transition hover:border-ops-border-struct hover:bg-[var(--ops-tint-2)] hover:text-ops-text-primary',
                           isSelectedDay && hasInteractedWithHistory
-                            ? 'ops-mobile-day-button-selected ops-history-selected-cell text-ops-accent-muted'
+                            ? 'ops-mobile-day-button-selected ops-history-selected-cell ops-history-selection-node text-ops-accent-muted'
                             : 'border-ops-border-soft bg-ops-surface-2 text-ops-text-secondary',
                           isToday && !isSelectedDay
                             ? 'ops-history-today-cell'
diff --git a/src/styles/index.css b/src/styles/index.css
index fc7576e..2a5573a 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -216,6 +216,17 @@
     var(--color-ops-accent-deep) 70%,
     transparent
   );
+  --ops-history-selection-bg: color-mix(
+    in srgb,
+    var(--color-ops-accent) 8%,
+    transparent
+  );
+  --ops-history-selection-bg-strong: color-mix(
+    in srgb,
+    var(--color-ops-accent) 12%,
+    var(--color-ops-surface-2)
+  );
+  --ops-history-selection-border: rgba(183, 247, 218, 0.28);
   --ops-radio-chip-status-border: rgba(255, 255, 255, 0.18);
   --ops-frame-calibration: rgba(183, 247, 218, 0.34);
   --ops-frame-calibration-muted: rgba(255, 255, 255, 0.085);
@@ -1622,6 +1633,31 @@ h3,
     inset 0 -1px 0 rgba(0, 0, 0, 0.34);
 }
 
+.ops-telemetry-chip[data-tone='subtle'] {
+  color: color-mix(in srgb, var(--color-ops-text-secondary) 92%, white 8%);
+}
+
+.ops-telemetry-chip[data-tone='attention'] .ops-telemetry-register {
+  border-color: color-mix(
+    in srgb,
+    var(--ops-status-degraded-border) 42%,
+    transparent
+  );
+  color: var(--ops-status-degraded-text);
+}
+
+.ops-telemetry-label {
+  color: color-mix(in srgb, var(--color-ops-text-muted) 88%, white 12%);
+}
+
+.ops-telemetry-chip[data-tone='accent'] .ops-telemetry-label {
+  color: color-mix(in srgb, var(--color-ops-accent-muted) 84%, white 16%);
+}
+
+.ops-telemetry-chip[data-tone='attention'] .ops-telemetry-label {
+  color: color-mix(in srgb, var(--ops-status-degraded-text) 86%, white 14%);
+}
+
 .ops-telemetry-label-row,
 .ops-telemetry-value-row {
   display: flex;
@@ -1704,6 +1740,12 @@ h3,
   color: var(--ops-status-degraded-text);
 }
 
+.ops-telemetry-detail {
+  display: block;
+  margin-top: 0.35rem;
+  color: color-mix(in srgb, var(--color-ops-text-muted) 88%, white 12%);
+}
+
 .ops-telemetry-attention-pip {
   display: inline-flex;
   margin-right: 0.35rem;
@@ -1939,15 +1981,24 @@ h3,
 }
 
 .ops-history-row-selected > th {
-  background: var(--color-ops-surface-3);
+  background:
+    linear-gradient(90deg, var(--ops-history-selection-bg), transparent 58%),
+    var(--color-ops-surface-3);
 }
 
 .ops-history-selected-row-header {
+  background:
+    linear-gradient(90deg, var(--ops-history-selection-bg), transparent 68%),
+    var(--color-ops-surface-3);
   box-shadow:
-    inset 4px 0 0 var(--ops-sector-border, var(--ops-today-rail)),
+    inset 5px 0 0 var(--ops-sector-border, var(--ops-today-rail)),
     inset 0 -1px 0 var(--color-ops-border-soft),
     inset 0 1px 0 rgba(255, 255, 255, 0.08),
-    inset 0 0 0 1px rgba(255, 255, 255, 0.035);
+    inset 0 0 0 1px var(--ops-history-selection-border);
+}
+
+.ops-history-selection-row-header {
+  color: var(--color-ops-accent-muted);
 }
 
 .ops-history-cell {
@@ -2015,20 +2066,40 @@ h3,
 }
 
 .ops-history-selected-column-header {
+  background:
+    linear-gradient(180deg, var(--ops-history-selection-bg), transparent 70%),
+    var(--ops-history-selection-bg-strong);
   box-shadow:
-    inset 0 3px 0 var(--color-ops-border-strong),
-    inset 1px 0 0 rgba(255, 255, 255, 0.09),
-    inset -1px 0 0 rgba(255, 255, 255, 0.07),
-    inset 0 -1px 0 rgba(255, 255, 255, 0.05);
+    inset 0 3px 0 var(--ops-history-selection-border),
+    inset 1px 0 0 var(--ops-history-selection-border),
+    inset -1px 0 0 rgba(183, 247, 218, 0.18),
+    inset 0 -1px 0 rgba(255, 255, 255, 0.08);
 }
 
 .ops-history-selected-column {
+  background:
+    linear-gradient(90deg, rgba(110, 231, 183, 0.04), transparent 58%),
+    var(--ops-history-selection-bg);
   box-shadow:
-    inset 1px 0 0 rgba(255, 255, 255, 0.1),
-    inset -1px 0 0 rgba(255, 255, 255, 0.07),
+    inset 1px 0 0 var(--ops-history-selection-border),
+    inset -1px 0 0 rgba(183, 247, 218, 0.14),
     inset 0 0 0 1px rgba(255, 255, 255, 0.025);
 }
 
+.ops-history-selection-axis-header {
+  color: color-mix(in srgb, var(--color-ops-accent-muted) 82%, white 18%);
+}
+
+.ops-history-selection-axis {
+  color: var(--color-ops-text-primary);
+}
+
+.ops-history-selection-node {
+  background:
+    linear-gradient(180deg, rgba(183, 247, 218, 0.1), transparent 72%),
+    var(--ops-history-selection-bg-strong);
+}
+
 .ops-mobile-week-pip {
   height: 4px;
   width: 1rem;
@@ -2040,7 +2111,8 @@ h3,
 
 .ops-mobile-week-status {
   background:
-    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 38%),
+    linear-gradient(180deg, rgba(255, 255, 255, 0.065), transparent 38%),
+    linear-gradient(90deg, var(--ops-history-selection-bg), transparent 52%),
     var(--color-ops-surface-overlay);
   box-shadow:
     inset 0 1px 0 rgba(255, 255, 255, 0.09),
@@ -2049,6 +2121,9 @@ h3,
 }
 
 .ops-mobile-week-state-chip {
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 42%),
+    var(--color-ops-surface-base);
   border-color: var(--color-ops-panel-border-strong);
   box-shadow:
     inset 0 1px 0 rgba(255, 255, 255, 0.05),
@@ -2087,10 +2162,12 @@ h3,
 .ops-mobile-day-button[aria-pressed='true'] {
   border-color: var(--ops-status-nominal-border);
   background:
-    linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 40%),
-    rgba(110, 231, 183, 0.16);
+    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 40%),
+    linear-gradient(90deg, rgba(110, 231, 183, 0.13), transparent 72%),
+    rgba(110, 231, 183, 0.18);
   box-shadow:
     inset 0 0 0 1px var(--ops-status-nominal-border),
+    inset 0 3px 0 rgba(183, 247, 218, 0.72),
     inset 0 1px 0 rgba(255, 255, 255, 0.12),
     inset 0 -1px 0 rgba(2, 44, 28, 0.36);
 }
@@ -2101,8 +2178,9 @@ h3,
 
 .ops-history-selected-cell {
   box-shadow:
-    0 0 0 1px rgba(110, 231, 183, 0.42),
-    inset 0 0 0 1.5px var(--ops-focus-ring);
+    0 0 0 1px rgba(183, 247, 218, 0.42),
+    inset 0 0 0 1px rgba(10, 15, 13, 0.84),
+    inset 0 0 0 2px var(--ops-focus-ring);
 }
 
 .ops-history-selected-cell:focus-visible,
@@ -2243,13 +2321,34 @@ h3,
 }
 
 .ops-mobile-active-week {
+  background:
+    linear-gradient(90deg, rgba(110, 231, 183, 0.075), transparent 42%),
+    var(--color-ops-surface-raised);
   box-shadow:
-    inset 3px 0 0 var(--ops-today-rail),
+    inset 4px 0 0 var(--ops-today-rail),
     inset 0 1px 0 rgba(255, 255, 255, 0.07),
     inset 0 0 0 1px var(--color-ops-panel-border-strong),
     var(--ops-elevation-1);
 }
 
+.ops-history-detail-label {
+  color: color-mix(in srgb, var(--color-ops-text-muted) 90%, white 10%);
+}
+
+.ops-history-detail-date {
+  text-shadow:
+    0 0 18px rgba(110, 231, 183, 0.12),
+    0 1px 0 rgba(0, 0, 0, 0.72);
+}
+
+.ops-history-momentum-panel {
+  border-color: var(--color-ops-panel-border-strong);
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent 36%),
+    linear-gradient(90deg, var(--ops-history-selection-bg), transparent 52%),
+    rgba(10, 15, 13, 0.24);
+}
+
 .ops-history-brief-spark {
   height: 18px;
 }
@@ -2267,14 +2366,20 @@ h3,
 
 .ops-history-neighbor-row {
   min-height: 3.25rem;
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 40%),
+    var(--color-ops-surface-base);
 }
 
 .ops-history-neighbor-current {
-  color: var(--color-ops-text-muted);
+  color: var(--color-ops-text-secondary);
+  background:
+    linear-gradient(90deg, var(--ops-history-selection-bg), transparent 62%),
+    var(--color-ops-surface-raised);
   box-shadow:
-    inset 2px 0 0 var(--color-ops-border-struct),
+    inset 3px 0 0 var(--ops-history-selection-border),
     inset 0 1px 0 rgba(255, 255, 255, 0.05),
-    inset 0 0 0 1px var(--color-ops-panel-border);
+    inset 0 0 0 1px var(--color-ops-panel-border-strong);
 }
 
 .ops-history-sector-mark {
@@ -2580,6 +2685,16 @@ h3,
     var(--color-ops-surface-raised);
 }
 
+.ops-signal-frame[data-tone='warning'] .ops-signal-card {
+  --ops-signal-rail: var(--ops-status-degraded-border);
+  background:
+    linear-gradient(90deg, rgba(245, 158, 11, 0.14), transparent 34%) left top /
+      100% 1px no-repeat,
+    linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 34%),
+    linear-gradient(90deg, rgba(245, 158, 11, 0.035), transparent 44%),
+    var(--color-ops-surface-raised);
+}
+
 .ops-signal-card-safe {
   --ops-signal-rail: var(--ops-status-nominal-border);
 }
@@ -2598,6 +2713,11 @@ h3,
     0 0 0 1px rgba(110, 231, 183, 0.04);
 }
 
+.ops-export-accordion-status {
+  align-self: start;
+  padding-top: 0.125rem;
+}
+
 .ops-export-accordion-trigger {
   --ops-accordion-cap-color: rgba(110, 231, 183, 0.32);
   position: relative;
@@ -2623,12 +2743,21 @@ h3,
 }
 
 .ops-export-accordion-trigger-storage {
-  --ops-accordion-cap-color: var(--color-ops-border-strong);
+  --ops-accordion-cap-color: color-mix(
+    in srgb,
+    var(--color-ops-text-muted) 56%,
+    transparent
+  );
 }
 
 .ops-export-accordion-trigger-open {
   background:
     linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 34%),
+    linear-gradient(
+      90deg,
+      color-mix(in srgb, var(--ops-accordion-cap-color) 10%, transparent),
+      transparent 42%
+    ),
     var(--ops-tint-1);
   box-shadow:
     inset 6px 0 0 var(--ops-accordion-cap-color),
@@ -2641,6 +2770,11 @@ h3,
 .ops-export-accordion-trigger-collapsed:hover {
   background:
     linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 34%),
+    linear-gradient(
+      90deg,
+      color-mix(in srgb, var(--ops-accordion-cap-color) 8%, transparent),
+      transparent 38%
+    ),
     var(--ops-tint-2);
   box-shadow:
     inset 4px 0 0 var(--ops-accordion-cap-color),
@@ -2668,6 +2802,18 @@ h3,
     0 0 12px color-mix(in srgb, var(--ops-accordion-cap-color) 42%, transparent);
 }
 
+.ops-recovery-support-panel {
+  color: var(--color-ops-text-secondary);
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent 38%),
+    linear-gradient(90deg, rgba(110, 231, 183, 0.035), transparent 48%),
+    var(--color-ops-surface-overlay);
+  box-shadow:
+    inset 0 1px 0 rgba(255, 255, 255, 0.06),
+    inset 0 -1px 0 rgba(0, 0, 0, 0.28),
+    inset 0 0 0 1px var(--color-ops-panel-border-strong);
+}
+
 @media (prefers-reduced-motion: reduce) {
   *,
   *::before,