From 98011cf604d931079174f68b483208f24a3bf931 Mon Sep 17 00:00:00 2001
From: Your Name <you@example.com>
Date: Thu, 19 Feb 2026 16:54:12 +0200
Subject: [PATCH] style: remove controls container and bump surface contrast

Strip background/border-radius from .controlsStrip so playback
controls float freely. Roughly double all --surface opacity values
for better element visibility against the dark slate background.
---
 src/styles/main.css   | 14 +++++++-------
 src/styles/player.css |  7 ++-----
 2 files changed, 9 insertions(+), 12 deletions(-)

diff --git a/src/styles/main.css b/src/styles/main.css
index 8b829b7..8209ab1 100644
--- a/src/styles/main.css
+++ b/src/styles/main.css
@@ -12,13 +12,13 @@
   --textMuted:rgba(160,174,204,.72);
   --textDim:rgba(158,174,208,.68);
   /* Surfaces — cool-tinted, subtle fills */
-  --surface-0:rgba(140,165,220,.02);
-  --surface:rgba(140,165,220,.03);
-  --surface-2:rgba(140,165,220,.045);
-  --surface-3:rgba(140,165,220,.065);
-  --surface-4:rgba(140,165,220,.085);
-  --surfaceHover:rgba(140,165,220,.055);
-  --surfaceActive:rgba(140,165,220,.07);
+  --surface-0:rgba(140,165,220,.04);
+  --surface:rgba(140,165,220,.06);
+  --surface-2:rgba(140,165,220,.09);
+  --surface-3:rgba(140,165,220,.12);
+  --surface-4:rgba(140,165,220,.15);
+  --surfaceHover:rgba(140,165,220,.10);
+  --surfaceActive:rgba(140,165,220,.13);
   /* Shadows — minimal */
   --shadow:0 8px 24px rgba(0,0,0,.25);
   --shadow2:0 4px 12px rgba(0,0,0,.15);
diff --git a/src/styles/player.css b/src/styles/player.css
index eff779f..afe386a 100644
--- a/src/styles/player.css
+++ b/src/styles/player.css
@@ -76,15 +76,12 @@ video::cue{
 .controlsStrip{
   display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap;
   padding:5px 6px;
-  border-radius:var(--r);
   border:none;
-  background:var(--surface);
-  transition:background .2s ease;
+  background:transparent;
 }
-.controlsStrip:hover{background:rgba(140,165,220,.04);}
 .controlsStrip::after{display:none;}
 .stripDivider{width:1px; height:22px; background:rgba(140,160,210,.06); flex:0 0 auto; transition:background .2s ease, height .2s ease;}
-.controlsStrip:hover .stripDivider{background:rgba(140,160,210,.09); height:24px;}
+.controlsStrip:hover .stripDivider{height:24px;}
 .group{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
 .controlsStrip .iconBtn{box-shadow:none;}
 .controlsStrip .miniCtl{box-shadow:none;}