diff --git a/index.html b/index.html
index 6a45014..627196c 100644
--- a/index.html
+++ b/index.html
@@ -259,6 +259,7 @@
}
/* Damage on cassette housing */
+ /* Removed by popular demand.
.cassette::before {
content: '';
position: absolute;
@@ -271,6 +272,7 @@
border-radius: 3px;
pointer-events: none;
}
+ */
.cassette::after {
content: '';
@@ -950,6 +952,94 @@
opacity: 0.7;
}
+ /* Current track section - shown when audio is playing */
+ .alby-track-section {
+ margin-top: 15px;
+ display: none; /* Hidden by default, shown via JS when audio playing */
+ }
+
+ .alby-track-section.visible {
+ display: block;
+ }
+
+ /* Track display box - styled like address box with CRT look */
+ .alby-track-box {
+ background: linear-gradient(180deg, #0a1a0a 0%, #050f05 100%);
+ border: 3px solid #000;
+ padding: 12px;
+ margin-bottom: 10px;
+ box-shadow:
+ inset 0 0 20px rgba(0,0,0,0.9),
+ inset 0 0 5px rgba(255, 170, 0, 0.1);
+ position: relative;
+ }
+
+ /* Scanlines effect on track box */
+ .alby-track-box::after {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: repeating-linear-gradient(0deg, transparent, transparent 1px, rgba(0,0,0,0.4) 1px, rgba(0,0,0,0.4) 2px);
+ pointer-events: none;
+ }
+
+ /* Track name text - amber like lightning address */
+ .alby-track-name {
+ color: #cc8800;
+ font-size: 13px;
+ text-shadow: 0 0 8px rgba(255, 170, 0, 0.5);
+ word-break: break-word;
+ position: relative;
+ z-index: 1;
+ }
+
+ /* Checkbox label container */
+ .alby-checkbox-label {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ cursor: pointer;
+ padding: 5px 0;
+ }
+
+ /* Custom checkbox styling to match retro theme */
+ .alby-checkbox-label input[type="checkbox"] {
+ -webkit-appearance: none;
+ appearance: none;
+ width: 20px;
+ height: 20px;
+ background: linear-gradient(180deg, #0a1a0a 0%, #050f05 100%);
+ border: 3px solid #000;
+ cursor: pointer;
+ position: relative;
+ box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
+ }
+
+ /* Checkbox checked state - green checkmark */
+ .alby-checkbox-label input[type="checkbox"]:checked::after {
+ content: '';
+ position: absolute;
+ left: 4px;
+ top: 1px;
+ width: 6px;
+ height: 10px;
+ border: solid #00ff00;
+ border-width: 0 3px 3px 0;
+ transform: rotate(45deg);
+ box-shadow: 0 0 5px rgba(0, 255, 0, 0.5);
+ }
+
+ /* Checkbox text - green CRT style */
+ .alby-checkbox-text {
+ color: #00ff00;
+ font-size: 12px;
+ text-shadow: 0 0 5px rgba(0, 255, 0, 0.5);
+ letter-spacing: 1px;
+ }
+
/* Main boost button - amber Lightning theme */
.alby-boost-btn {
width: 100%;
@@ -1092,6 +1182,18 @@
0/400
+
+
+
CURRENT TRACK
+
+
TRACK 1 - PINK FLIGHT ATTENDANT
+
+
+
+