From e78779f01c023e768aa19fdff1fde2b520951786 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Thu, 6 Aug 2026 21:18:22 +0200
Subject: [PATCH 01/10] tuneing

---
 themes/one-pager/assets/css/style.css         | 40 ++++++++++++++++---
 themes/one-pager/layouts/partials/header.html |  6 +--
 2 files changed, 38 insertions(+), 8 deletions(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index ccd17c1..53a71cd 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -156,6 +156,30 @@ body {
   pointer-events: none;
 }
 
+#bannerino {
+
+  position:absolute;
+  top:0;
+  left:0;
+  right:0;
+  bottom:0;
+  z-index:0;
+  background-size:cover;
+  background-position:center;
+  background-attachment:fixed;
+}
+#texture {
+  filter: invert(50%) sepia(100%) saturate(100%) hue-rotate(15deg);
+  position:absolute;
+  top:0;
+  left:0;
+  right:0;
+  bottom:0;
+  z-index:1;
+  background-image:url('/images/texture.png');
+  pointer-events:none;
+}
+
 /* Content sits above overlay */
 .header-content {
   max-width: 1200px;
@@ -163,8 +187,11 @@ body {
   width: 100%;
   position: relative;
   z-index: 1;
+  transition: all 1s ease;
+}
+.header-content:hover {
+  transition: all 1s ease;
 }
-
 /* Profile layout */
 .header-profile {
   display: flex;
@@ -179,16 +206,18 @@ body {
   width: 180px;
   height: 180px;
   border-radius: 0;
-  border: 4px solid var(--accent-yellow);
+  border: 4px solid var(--accent-grey);
   object-fit: cover;
-  box-shadow: 12px 12px 0 var(--accent-yellow);
+  box-shadow: 12px 12px 0 var(--accent-grey);
   transition: all 0.3s ease;
   border-radius: 100%;
+
 }
 
 .profile-picture:hover {
   transform: scale(1.02);
   box-shadow: 16px 16px 0 var(--accent-yellow);
+  border: 4px solid var(--accent-yellow);
 
 }
 
@@ -206,7 +235,7 @@ body {
   font-size: 7rem;
   letter-spacing: -2px;
   line-height: 1.1;
-  color: var(--accent-yellow);
+  color: var(--accent-grey);
   text-transform: uppercase;
   margin-bottom: 0.5rem;
   text-shadow:
@@ -341,11 +370,12 @@ body {
   z-index: 999;
   background: var(--bg-primary);
   border-bottom: 3px solid var(--accent-yellow);
+  opacity: .9;
   padding: 0.8rem 2rem;
   transform: translateY(-100%);
   transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s ease;
   box-shadow: 0 4px 20px var(--shadow-color);
-  backdrop-filter: blur(10px);
+  backdrop-filter: blur(20px);
   -webkit-backdrop-filter: blur(10px);
 }
 
diff --git a/themes/one-pager/layouts/partials/header.html b/themes/one-pager/layouts/partials/header.html
index f29e478..ef94269 100644
--- a/themes/one-pager/layouts/partials/header.html
+++ b/themes/one-pager/layouts/partials/header.html
@@ -56,9 +56,9 @@
 <header class="main-header" style="position:relative;overflow:hidden;">
     <!-- Background image -->
     {{ if $banner }}
-    <div style="position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;background-image:url('{{ $banner }}');background-size:cover;background-position:center; background-attachment:fixed;"></div>
+    <div id="bannerino" style="background-image:url('{{ $banner }}');"></div>
     <!-- Dark overlay for readability -->
-    <div style="position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;background-image:url('/images/texture.png');pointer-events:none;"></div>
+    <div id="texture"></div>
     {{ end }}
     
 
@@ -69,7 +69,7 @@
     <div class="header-content">
         <div class="header-profile">
             {{ if $picture }}
-            <img src="{{ $picture }}" alt="{{ $displayName }}" class="profile-picture" loading="lazy">
+            <img src="{{ $picture }}" alt="{{ $displayName }}'s profile picture'" class="profile-picture" loading="lazy">
             {{ end }}
             <div class="header-text">
 

From e9f851df8ef78628fc6cfdda910677e15de5ed6d Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Thu, 6 Aug 2026 21:35:56 +0200
Subject: [PATCH 02/10] petty detail

---
 themes/one-pager/assets/css/style.css | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index 53a71cd..ee67723 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -177,6 +177,7 @@ body {
   bottom:0;
   z-index:1;
   background-image:url('/images/texture.png');
+  background-size: 80%;
   pointer-events:none;
 }
 
@@ -263,13 +264,13 @@ body {
   line-height: 1.5;
 
   color: var(--text-secondary);
-  border-left: 4px solid var(--accent-yellow);
+  border: 4px solid var(--accent-grey);
   padding: 0.5rem 1rem 1.5rem 1.5rem;
   letter-spacing: 0.5px;
   background: rgba(0, 0, 0, 0.5);
   backdrop-filter: blur(20px);
   -webkit-backdrop-filter: blur(20px);
-  border-radius: 0 8px 8px 0;
+  border-radius: 8px;
 }
 
 [data-theme="dark"] .profile-about {

From 95199fa473b8c0aaa21cf35798fa4cb27eaf44a3 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Fri, 7 Aug 2026 09:02:53 +0200
Subject: [PATCH 03/10] match in mobile too

---
 themes/one-pager/assets/css/style.css | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index ee67723..0e4284e 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -1076,8 +1076,7 @@ button {
   .profile-about {
     margin-left: auto;
     margin-right: auto;
-    border-left: none;
-    border-top: 4px solid var(--accent-yellow);
+    border: 4px solid var(--accent-grey);
     padding: 1rem;
     text-align: center;
   }

From ed40e2b45cf11877540099efcafe86485ae2cc77 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Fri, 7 Aug 2026 10:58:14 +0200
Subject: [PATCH 04/10] petty

---
 themes/one-pager/assets/css/style.css | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index 0e4284e..83b6a96 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -85,7 +85,7 @@ body {
   padding: 4rem 2rem;
   position: relative;
   background: var(--bg-primary);
-  border-bottom: 4px solid var(--accent-yellow);
+  border-bottom: 4px solid var(--accent-grey);
   transition: background-color 0.4s ease;
   overflow: hidden;
   flex-shrink: 0;
@@ -151,7 +151,7 @@ body {
   font-family: 'Poppins', sans-serif;
   font-weight: 900;
   font-size: 4rem;
-  color: var(--accent-yellow);
+  color: var(--accent-y);
   opacity: 0.15;
   pointer-events: none;
 }
@@ -212,7 +212,10 @@ body {
   box-shadow: 12px 12px 0 var(--accent-grey);
   transition: all 0.3s ease;
   border-radius: 100%;
-
+  filter: grayscale(100%);
+}
+.profile-picture:hover {
+    filter: grayscale(0%);
 }
 
 .profile-picture:hover {
@@ -503,7 +506,7 @@ body {
   left: 0;
   width: 80px;
   height: 4px;
-  background: var(--accent-yellow);
+  background: var(--accent-grey);
 }
 
 /* Blog Grid - KEEP SKEW ON CARDS */

From 2bd4e392263a5508bf6238ef42a80205f180ee63 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Fri, 7 Aug 2026 11:25:43 +0200
Subject: [PATCH 05/10] boring meeting

---
 themes/one-pager/assets/css/style.css | 34 +++++++++++++--------------
 1 file changed, 16 insertions(+), 18 deletions(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index 83b6a96..8eaa647 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -157,7 +157,7 @@ body {
 }
 
 #bannerino {
-
+  filter: grayscale(100%);
   position:absolute;
   top:0;
   left:0;
@@ -372,15 +372,13 @@ body {
   left: 0;
   right: 0;
   z-index: 999;
-  background: var(--bg-primary);
+  background: #0000008a;
   border-bottom: 3px solid var(--accent-yellow);
-  opacity: .9;
   padding: 0.8rem 2rem;
   transform: translateY(-100%);
   transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s ease;
-  box-shadow: 0 4px 20px var(--shadow-color);
+  box-shadow: 0 4px 20px #0000008a;
   backdrop-filter: blur(20px);
-  -webkit-backdrop-filter: blur(10px);
 }
 
 .sticky-nav.visible {
@@ -528,14 +526,14 @@ body {
 
 .blog-card:hover {
   transform: skewX(0deg) translate(-4px, -4px);
-  box-shadow: 12px 12px 0 var(--accent-yellow);
+  box-shadow: 12px 12px 0 var(--accent-grey);
 }
 
 .blog-header-image {
   width: 100%;
   height: 220px;
   object-fit: cover;
-  border-bottom: 3px solid var(--accent-yellow);
+  border-bottom: 3px solid var(--accent-grey);
   filter: grayscale(100%);
   transition: all 0.3s ease;
 }
@@ -587,7 +585,7 @@ button {
 .read-more-toggle {
   background: var(--accent-yellow);
   color: #0a0a0a !important; /* Force black */
-  border: 2px solid var(--accent-grey);
+  border: 2px solid var(--accent-yellow);
   padding: 0.6rem 1.5rem;
   font-family: 'Poppins', sans-serif;
   font-weight: 700;
@@ -600,7 +598,7 @@ button {
 
 .read-more-toggle:hover {
   background: var(--accent-black);
-  color: var(--accent-yellow) !important; /* Yellow on hover */
+  color: var(--bg-primary) !important; /* Yellow on hover */
   border-color: var(--accent-yellow);
   transform: scale(1.05);
 }
@@ -644,7 +642,7 @@ button {
 
 .music-card:hover {
   transform: skewX(0deg) translate(-4px, -4px);
-  box-shadow: 12px 12px 0 var(--accent-yellow);
+  box-shadow: 12px 12px 0 var(--accent-grey);
 }
 
 .music-image {
@@ -734,7 +732,7 @@ button {
 .lyrics-toggle {
   background: var(--accent-yellow);
   color: #0a0a0a !important; /* Force black */
-  border: 2px solid var(--accent-grey);
+  border: 2px solid var(--accent-yellow);
   padding: 0.6rem 1.5rem;
   font-family: 'Poppins', sans-serif;
   font-weight: 700;
@@ -761,7 +759,7 @@ button {
   margin-top: 1rem;
   padding: 1.5rem;
   background: var(--bg-secondary);
-  border-left: 4px solid var(--accent-yellow);
+  border-left: 1px solid var(--accent-yellow);
   color: var(--text-secondary);
   font-weight: 400;
   font-size: 0.9rem;
@@ -787,7 +785,7 @@ button {
 
 .photo-item:hover {
   transform: skewX(0deg) translate(-4px, -4px);
-  box-shadow: 12px 12px 0 var(--accent-yellow);
+  box-shadow: 12px 12px 0 var(--accent-grey);
 }
 
 .photo-item img {
@@ -843,14 +841,14 @@ button {
 
 .video-item:hover {
   transform: skewX(0deg) translate(-4px, -4px);
-  box-shadow: 12px 12px 0 var(--accent-yellow);
+  box-shadow: 12px 12px 0 var(--accent-grey);
 }
 
 .video-item video {
   width: 100%;
   background: var(--accent-black);
   display: block;
-  border-bottom: 3px solid var(--accent-yellow);
+  border-bottom: 3px solid var(--accent-grey);
 }
 
 .video-info {
@@ -1256,8 +1254,8 @@ button {
   text-transform: uppercase;
   cursor: pointer;
   transition: all 0.3s ease;
-  filter: drop-shadow(0px 0px 10px var(--accent-yellow));
-  animation: glow 1s infinite alternate;
+  filter: drop-shadow(0px 0px 20px var(--accent-yellow));
+  animation: glow 3s infinite alternate;
 }
 
 .refresh-button:hover {
@@ -1276,7 +1274,7 @@ button {
     filter: drop-shadow(0px 0px 5px var(--accent-yellow));
   }
   to {
-    filter: drop-shadow(0px 0px 10px var(--accent-yellow));
+    filter: drop-shadow(0px 0px 20px var(--accent-yellow));
   }
 }
 /* ============ CYBERPUNK FOOTER ============ */

From 5eec62b318eaf7b1d447342f0f489f89ee41c7df Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Fri, 7 Aug 2026 11:34:11 +0200
Subject: [PATCH 06/10] meh

---
 themes/one-pager/assets/css/style.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index 8eaa647..22334ce 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -1152,7 +1152,7 @@ button {
   .photo-item:hover,
   .video-item:hover {
     transform: translate(-2px, -2px);
-    box-shadow: 6px 6px 0 var(--accent-yellow);
+    box-shadow: 6px 6px 0 var(--accent-grey);
   }
 
   .custom-lightbox-prev,

From e18ed3f320765cb3c98e9dd26398ff84404cb287 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Fri, 7 Aug 2026 11:48:43 +0200
Subject: [PATCH 07/10] nailed it

---
 themes/one-pager/assets/css/style.css | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index 22334ce..8c75c04 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -168,6 +168,7 @@ body {
   background-position:center;
   background-attachment:fixed;
 }
+
 #texture {
   filter: invert(50%) sepia(100%) saturate(100%) hue-rotate(15deg);
   position:absolute;
@@ -611,10 +612,11 @@ button {
   margin-top: 1.5rem;
   padding: 1.5rem;
   background: var(--bg-secondary);
-  border-left: 4px solid var(--accent-yellow);
+  border: 1px solid var(--accent-yellow);
   color: var(--text-secondary);
   font-weight: 400;
   font-size: 0.95rem;
+  box-shadow: 0 10px 40px #ffd7005c
 }
 
 .blog-full-content img {
@@ -649,7 +651,6 @@ button {
   width: 100%;
   height: 200px;
   object-fit: cover;
-  border: 2px solid var(--accent-grey);
   margin-bottom: 1rem;
   filter: grayscale(100%);
   transition: all 0.3s ease;
@@ -1939,8 +1940,10 @@ button {
   display: flex;
   align-items: center;
   justify-content: center;
-  background: rgba(0, 0, 0, 0.4);
-  opacity: 0;
+  background: rgba(0, 0, 0, 0);
+  background-image:url('/images/texture.png');
+  background-size: 70%;
+  opacity: 1;
   transition: opacity 0.3s ease;
   cursor: pointer;
 }

From c3a9df080ee99785675ee5f1be769cab3cbaa05d Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Fri, 7 Aug 2026 11:56:26 +0200
Subject: [PATCH 08/10] fix that bullshit button

---
 themes/one-pager/assets/css/style.css |  1 +
 themes/one-pager/assets/js/scripts.js | 11 ++++++++---
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index 8c75c04..5a07fb6 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -743,6 +743,7 @@ button {
   cursor: pointer;
   transition: all 0.3s ease;
   margin-top: 0.8rem;
+  z-index: 10;
 }
 
 .lyrics-toggle:hover {
diff --git a/themes/one-pager/assets/js/scripts.js b/themes/one-pager/assets/js/scripts.js
index e176862..fc96e78 100644
--- a/themes/one-pager/assets/js/scripts.js
+++ b/themes/one-pager/assets/js/scripts.js
@@ -222,9 +222,10 @@ function renderMusicTracks(tracks, containerId, randomize = false) {
     card.className = 'music-card clickable';
     card.dataset.playlistIndex = index;
 
-    // Click on card opens lightbox
+    // Click on card opens lightbox (except when clicking on info button)
     card.addEventListener('click', function(e) {
-      if (e.target.closest('audio') || e.target.closest('.lyrics-toggle') || e.target.closest('.lyrics')) {
+      // Don't trigger if clicking on lyrics-toggle or inside lyrics
+      if (e.target.closest('.lyrics-toggle') || e.target.closest('.lyrics')) {
         return;
       }
       const idx = parseInt(this.dataset.playlistIndex);
@@ -259,6 +260,7 @@ function renderMusicTracks(tracks, containerId, randomize = false) {
         content = originalTrack.content || '';
     }
 
+    // Build the card HTML
     let cardHTML = `
     <div class="music-card-inner">
     <div class="music-image-wrapper">
@@ -298,7 +300,10 @@ function initMusicEventListeners() {
   });
 }
 
-function handleLyricsToggle() {
+function handleLyricsToggle(e) {
+  // Stop the click from bubbling up to the card
+  e.stopPropagation();
+
   const lyrics = this.nextElementSibling;
   if (lyrics && lyrics.classList.contains('lyrics')) {
     if (lyrics.style.display === 'none') {

From 3e96c213ebca23369be5846614f3b52ff52422e3 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Fri, 7 Aug 2026 12:04:43 +0200
Subject: [PATCH 09/10] add lyrics to player

---
 themes/one-pager/assets/css/style.css | 45 +++++++++++++++++++++++++++
 themes/one-pager/assets/js/scripts.js | 29 ++++++++++++++++-
 themes/one-pager/layouts/index.html   |  7 +++--
 3 files changed, 77 insertions(+), 4 deletions(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index 5a07fb6..041f4fd 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -767,7 +767,52 @@ button {
   font-size: 0.9rem;
   white-space: pre-wrap;
 }
+/* Music lightbox lyrics - below controls */
+.music-lightbox-lyrics {
+  margin-top: 1.5rem;
+  padding: 1.2rem 1.5rem;
+  background: rgba(0, 0, 0, 0.4);
+  border: 1px solid var(--accent-yellow);
+  border-radius: 0 8px 8px 0;
+  color: rgba(255, 255, 255, 0.85);
+  font-family: 'Poppins', sans-serif;
+  font-weight: 300;
+  font-size: 0.85rem;
+  line-height: 1.8;
+  max-height: 200px;
+  overflow-y: auto;
+  text-align: left;
+  width: 100%;
+  max-width: 500px;
+  backdrop-filter: blur(10px);
+  -webkit-backdrop-filter: blur(10px);
+  scrollbar-width: thin;
+  scrollbar-color: var(--accent-yellow) rgba(255, 255, 255, 0.1);
+  box-shadow: 0 4px 20px #0000008a;
+}
 
+.music-lightbox-lyrics::-webkit-scrollbar {
+  width: 4px;
+}
+
+.music-lightbox-lyrics::-webkit-scrollbar-track {
+  background: rgba(255, 255, 255, 0.1);
+  border-radius: 2px;
+}
+
+.music-lightbox-lyrics::-webkit-scrollbar-thumb {
+  background: var(--accent-yellow);
+  border-radius: 2px;
+}
+
+.music-lightbox-lyrics p {
+  margin-bottom: 0.5rem;
+}
+
+.music-lightbox-lyrics br {
+  display: block;
+  margin: 0.2rem 0;
+}
 /* Photo Grid - KEEP SKEW ON CARDS */
 .photo-grid {
   display: grid;
diff --git a/themes/one-pager/assets/js/scripts.js b/themes/one-pager/assets/js/scripts.js
index fc96e78..0f2002a 100644
--- a/themes/one-pager/assets/js/scripts.js
+++ b/themes/one-pager/assets/js/scripts.js
@@ -592,6 +592,8 @@ function openMusicLightbox(index) {
   const progressFill = document.getElementById('musicLightboxProgressFill');
   const playBtn2 = document.getElementById('musicLightboxPlayBtn2');
   const playIcon2 = document.getElementById('musicPlayIcon2');
+  // Get the lyrics element
+  const lyricsDisplay = document.getElementById('musicLightboxLyrics');
 
   // Set album art
   const artUrl = track.image || '/images/default-album.jpg';
@@ -603,13 +605,38 @@ function openMusicLightbox(index) {
   artist.textContent = track.artist || 'Unknown Artist';
   album.textContent = track.album || '';
 
+  // Set lyrics - find the original track data to get content
+  let lyricsContent = '';
+  // Find the original track data
+  const originalTrack = window.allMusicData ? window.allMusicData.find(t => {
+    let url = '';
+    if (t.tags) {
+      t.tags.forEach(tag => {
+        if (tag[0] === 'url') url = tag[1];
+      });
+    }
+    return url === track.url;
+  }) : null;
+
+  if (originalTrack && originalTrack.content) {
+    lyricsContent = originalTrack.content;
+  }
+
+  // Display lyrics if they exist
+  if (lyricsContent) {
+    lyricsDisplay.innerHTML = lyricsContent.replace(/\n/g, '<br>');
+    lyricsDisplay.style.display = 'block';
+  } else {
+    lyricsDisplay.style.display = 'none';
+  }
+
   // Reset progress
   progressFill.style.width = '0%';
   currentTimeDisplay.textContent = '0:00';
   durationDisplay.textContent = track.duration ? formatTime(track.duration) : '0:00';
 
   // Set play buttons to play state
-  playIcon2.textContent = '▶️';
+  playIcon2.textContent = '▶';
 
   // Create audio player
   musicPlayer = new Audio(track.url);
diff --git a/themes/one-pager/layouts/index.html b/themes/one-pager/layouts/index.html
index fda64ef..5db3a5e 100644
--- a/themes/one-pager/layouts/index.html
+++ b/themes/one-pager/layouts/index.html
@@ -61,13 +61,10 @@
                 <img id="musicLightboxImage" src="" alt="Album art">
             </div>
 
-            <!-- In the info section -->
             <div class="music-lightbox-info">
                 <h2 id="musicLightboxTitle">Title</h2>
                 <p class="music-lightbox-artist" id="musicLightboxArtist">Artist</p>
                 <p class="music-lightbox-album-name" id="musicLightboxAlbum">Album</p>
-                <!-- ... rest ... -->
-            </div>
 
                 <div class="music-lightbox-progress">
                     <span class="music-lightbox-time" id="musicLightboxCurrentTime">0:00</span>
@@ -84,10 +81,14 @@
                     </button>
                     <button class="music-lightbox-control-btn" id="musicLightboxNext">⏭</button>
                 </div>
+
+                <!-- Lyrics moved here - below the controls -->
+                <div class="music-lightbox-lyrics" id="musicLightboxLyrics" style="display: none;"></div>
             </div>
         </div>
     </div>
 
+
     {{ $js := resources.Get "js/scripts.js" | resources.Minify | fingerprint }}
     <script src="{{ $js.RelPermalink }}"></script>
 </body>

From 79430649e93d50eaf2fa117f84303a2128dede99 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Fri, 7 Aug 2026 12:05:53 +0200
Subject: [PATCH 10/10] na bitch

---
 themes/one-pager/assets/css/style.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/themes/one-pager/assets/css/style.css b/themes/one-pager/assets/css/style.css
index 041f4fd..ee7a6d9 100644
--- a/themes/one-pager/assets/css/style.css
+++ b/themes/one-pager/assets/css/style.css
@@ -788,7 +788,7 @@ button {
   -webkit-backdrop-filter: blur(10px);
   scrollbar-width: thin;
   scrollbar-color: var(--accent-yellow) rgba(255, 255, 255, 0.1);
-  box-shadow: 0 4px 20px #0000008a;
+  box-shadow: 0 10px 40px #ffd7005c;
 }
 
 .music-lightbox-lyrics::-webkit-scrollbar {