From c08839d59e56017b815debf5f58751a53a05ce6c Mon Sep 17 00:00:00 2001
From: tiennm99 <tiennm99@outlook.com>
Date: Fri, 2 Oct 2026 15:29:39 +0700
Subject: [PATCH] style(gacha): cap the mirror glint at 120/255 alpha

---
 renderer/src/gacha/page/page.css | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/renderer/src/gacha/page/page.css b/renderer/src/gacha/page/page.css
index 307c5cd..84f4ad5 100644
--- a/renderer/src/gacha/page/page.css
+++ b/renderer/src/gacha/page/page.css
@@ -137,13 +137,15 @@ body {
  * The mirror glint that sweeps across the card once it lands (page.js). It is
  * blended additively (plus-lighter), so it brightens the card's own colours
  * instead of painting flat white over them; the light is tinted with the
- * card's accent (--glint) so it matches the card's tone.
+ * card's accent (--glint) so it matches the card's tone. The gradients peak at
+ * full strength and the clip's opacity caps the whole sprite at 120/255.
  */
 .wish-glint-clip {
   --glint-core: color-mix(in srgb, var(--glint, #fff) 35%, #fff);
   border-radius: inherit;
   inset: 0;
   mix-blend-mode: plus-lighter;
+  opacity: calc(120 / 255);
   overflow: hidden;
   pointer-events: none;
   position: absolute;
@@ -154,11 +156,11 @@ body {
   background: linear-gradient(
     135deg,
     transparent 45.3%,
-    color-mix(in srgb, var(--glint, #fff) 14%, transparent) 47.7%,
-    color-mix(in srgb, var(--glint-core) 60%, transparent) 49.7%,
-    color-mix(in srgb, var(--glint-core) 75%, transparent) 50%,
-    color-mix(in srgb, var(--glint-core) 60%, transparent) 50.3%,
-    color-mix(in srgb, var(--glint, #fff) 14%, transparent) 52.3%,
+    color-mix(in srgb, var(--glint, #fff) 19%, transparent) 47.7%,
+    color-mix(in srgb, var(--glint-core) 80%, transparent) 49.7%,
+    var(--glint-core) 50%,
+    color-mix(in srgb, var(--glint-core) 80%, transparent) 50.3%,
+    color-mix(in srgb, var(--glint, #fff) 19%, transparent) 52.3%,
     transparent 54.7%
   );
   height: 300%;
@@ -176,8 +178,8 @@ body {
 .wish-glint-flare {
   background: radial-gradient(
     circle,
-    color-mix(in srgb, var(--glint-core) 85%, transparent) 0 14%,
-    color-mix(in srgb, var(--glint) 45%, transparent) 30%,
+    var(--glint-core) 0 14%,
+    color-mix(in srgb, var(--glint) 53%, transparent) 30%,
     transparent 64%
   );
   aspect-ratio: 1;