From 541b5740a96bdc9585e8e3b88e44955603db862c Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.net>
Date: Fri, 15 May 2026 12:06:40 +0000
Subject: refactor(colours): tokenise card shadows and scrims

Introduce --shadow-card, --shadow-card-emphasized, --shadow-cta,
--scrim, --scrim-soft, and --scrim-banner. Migrate 14 inline
literals (card.css, input.css, Notification, MediaRoulette, the
two Landing CTA buttons, the popup overlay, the palette and
roulette scrims, three identity banners, the user profile cover
art shadow) onto the tokens, with light/dark adaptation handled
by the existing prefers-color-scheme blocks instead of duplicated
inline. Two single-use Landing demo-focus values stay inline.
---
 src/lib/List/MediaRoulette.svelte | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/lib/List/MediaRoulette.svelte')

diff --git a/src/lib/List/MediaRoulette.svelte b/src/lib/List/MediaRoulette.svelte
index d6e33d7a..3fbc89d6 100644
--- a/src/lib/List/MediaRoulette.svelte
+++ b/src/lib/List/MediaRoulette.svelte
@@ -163,7 +163,7 @@ const handleOverlayClick = (e: MouseEvent) => {
     left: 0;
     right: 0;
     bottom: 0;
-    background: rgba(0, 0, 0, 0.6);
+    background: var(--scrim);
     display: flex;
     align-items: center;
     justify-content: center;
@@ -320,7 +320,7 @@ const handleOverlayClick = (e: MouseEvent) => {
     margin: 0 auto 1rem;
     border-radius: 8px;
     overflow: hidden;
-    box-shadow: rgba(0, 0, 11, 0.1) 0px 7px 29px 0px;
+    box-shadow: var(--shadow-card);
   }
 
   .cover-wrapper :global(.roulette-cover) {
-- 
cgit v1.2.3

