From bf2a53eca6834fcef9fc21d5b22e8d933133638a Mon Sep 17 00:00:00 2001
From: Michael Czechowski <mail@dailysh.it>
Date: Tue, 30 Dec 2025 18:34:41 +0100
Subject: [PATCH] style: improve preview section UI

- Make preview-header fully transparent
- Add inset shadow to preview-section
- Remove green tint from expected overlay
---
 src/main.css | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/main.css b/src/main.css
index f1d442e..dffca73 100644
--- a/src/main.css
+++ b/src/main.css
@@ -430,6 +430,7 @@ code, kbd {
 	display: flex;
 	flex-direction: column;
 	min-height: 0;
+	box-shadow: inset 0 -40px 30px -30px rgba(0, 0, 0, 0.08);
 }
 
 .preview-header {
@@ -437,7 +438,7 @@ code, kbd {
 	justify-content: space-between;
 	align-items: center;
 	padding: var(--spacing-xs) var(--spacing-md);
-	background: rgba(255, 255, 255, 0.7);
+	background: transparent;
 }
 
 .preview-label {
@@ -474,7 +475,7 @@ code, kbd {
 .expected-overlay {
 	position: absolute;
 	inset: 0;
-	background: rgba(88, 184, 144, 0.1);
+	background: var(--panel-bg);
 	opacity: 0;
 	pointer-events: none;
 	transition: opacity 0.3s ease;
@@ -499,7 +500,6 @@ code, kbd {
 	height: 100%;
 	border: none;
 	border-radius: var(--border-radius-sm);
-	opacity: 0.7;
 }
 
 /* Success Match Animation */