:root{--color-primary: #00FFFF;--color-secondary: #33FFFF;--color-accent: #FF00FF;--color-black: #00FFFF;--color-white: #000814;--color-gray: #00AAAA;--border-width: 2px;--bg-gradient-start: #001219;--bg-gradient-end: #000814;--card-bg: #001219;--text-color: #00FFFF;--glow: 0 0 5px #00FFFF, 0 0 10px #00FFFF}:root.light-mode{--color-primary: #FF00FF;--color-secondary: #FF1493;--color-accent: #FF10F0;--color-black: #FF00FF;--color-white: #1a0033;--color-gray: #CC00CC;--bg-gradient-start: #0f001f;--bg-gradient-end: #1a0033;--card-bg: #0f001f;--text-color: #FF00FF;--glow: 0 0 5px #FF00FF, 0 0 10px #FF00FF}*{margin:0;padding:0;box-sizing:border-box}.icon,[aria-hidden=true]{font-variant-emoji:text}.skip-link{position:absolute;top:-48px;left:0;background:var(--color-primary);color:var(--color-white);padding:8px 16px;text-decoration:none;z-index:10000;font-weight:700;border:2px solid var(--color-black);box-shadow:var(--glow)}.skip-link:focus{top:0}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}*:focus{outline:3px solid var(--color-primary);outline-offset:2px}*:focus:not(:focus-visible){outline:none}*:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px;box-shadow:0 0 0 5px #00ff004d}:root.light-mode *:focus-visible{box-shadow:0 0 0 5px #ff00ff4d}.loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;z-index:10001;display:flex;align-items:center;justify-content:center;transition:opacity .3s ease}.loading-screen.fade-out{opacity:0;pointer-events:none}.loading-content{font-family:Courier New,monospace;color:(var)--color-secondary;font-size:16px;line-height:1.8;letter-spacing:.5px;text-transform:lowercase}.loading-line{opacity:0;white-space:nowrap;overflow:hidden;width:0;animation:revealLine .5s steps(40) forwards;margin-bottom:4px;text-shadow:var(--glow)}.loading-line[data-delay="0"]{animation-delay:0s}.loading-line[data-delay="1"]{animation-delay:.25s}.loading-line[data-delay="2"]{animation-delay:.5s}.loading-line[data-delay="3"]{animation-delay:.75s}.loading-line[data-delay="4"]{animation-delay:1s}@keyframes revealLine{0%{width:0;opacity:1}to{width:100%;opacity:1}}.cursor{display:inline-block;width:8px;height:14px;background:(var)--color-primary;margin-left:2px;animation:blink .8s infinite;vertical-align:middle}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.loading-hint{margin-top:40px;font-size:12px;opacity:0;animation:fadeInHint .3s ease forwards;animation-delay:1.3s;text-align:center}@keyframes fadeInHint{to{opacity:.6}}@media (prefers-reduced-motion: reduce){.loading-line{animation:instantReveal 0s forwards}.loading-line[data-delay="0"],.loading-line[data-delay="1"],.loading-line[data-delay="2"],.loading-line[data-delay="3"],.loading-line[data-delay="4"]{animation-delay:0s}@keyframes instantReveal{to{width:100%;opacity:1}}.cursor{animation:none;opacity:1}.loading-hint{animation-delay:0s}.loading-screen.fade-out{transition:opacity .1s ease}}body{font-family:Courier New,"Perfect DOS VGA 437",monospace;background:var(--bg-gradient-start);color:var(--text-color);min-height:100vh;line-height:1.4;padding-bottom:120px;position:relative;transition:background .3s ease,color .3s ease;text-shadow:var(--glow);image-rendering:pixelated;border-top:var(--border-width) solid var(--color-black);box-shadow:inset 0 4px 10px #0000004d,0 0 20px var(--color-black)}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:repeating-linear-gradient(0deg,rgba(0,0,0,.15),rgba(0,0,0,.15) 1px,transparent 1px,transparent 2px);pointer-events:none;z-index:999;animation:scanlines 8s linear infinite}@keyframes scanlines{0%{transform:translateY(0)}to{transform:translateY(2px)}}body:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at center,transparent 0%,rgba(0,0,0,.3) 100%);pointer-events:none;z-index:998}.container{max-width:1600px;margin:0 auto;position:relative;z-index:2}.container--full{max-width:100%;padding:0}.hero-banner{position:relative;overflow:hidden;background:var(--card-bg);height:calc(100vh - 160px);display:flex;align-items:center;justify-content:flex-start;margin-bottom:0}.hero-banner:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:url(/assets/prettyflux-petrol-station-CedwPOlS.png);background-size:cover;background-position:center;opacity:.3;z-index:0;pointer-events:none}.hero-banner:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(0deg,var(--color-primary),var(--color-primary) 1px,transparent 1px,transparent 3px);opacity:.03;z-index:1;pointer-events:none;animation:header-scanlines 6s linear infinite}@keyframes header-scanlines{0%{transform:translateY(0)}to{transform:translateY(3px)}}.hero-content{position:relative;z-index:2;padding:0 40px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;height:100%;transition:opacity .3s ease,transform .3s ease}.hero-text{font-size:1rem;line-height:1.8;color:var(--color-primary);text-shadow:var(--glow);max-width:400px;text-align:left;margin-bottom:32px}.scroll-to-tracks-btn{position:absolute;bottom:40px;left:50%;transform:translate(-50%);z-index:10;background:var(--color-black);border:var(--border-width) solid var(--color-primary);border-radius:50%;width:60px;height:60px;cursor:pointer;color:var(--color-primary);font-size:2rem;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 8px #0000004d,inset 0 1px #0ff3;transition:all .3s ease;animation:bounce 2s infinite}.scroll-to-tracks-btn:hover{background:var(--color-primary);color:var(--color-black);box-shadow:0 6px 12px #0006,var(--glow);transform:translate(-50%) scale(1.1)}.scroll-icon{display:inline-block;font-size:2rem;line-height:1;font-style:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@keyframes bounce{0%,20%,50%,80%,to{transform:translate(-50%) translateY(0)}40%{transform:translate(-50%) translateY(-10px)}60%{transform:translate(-50%) translateY(-5px)}}.theme-toggle{display:none;width:56px;height:56px;border:var(--border-width) solid var(--color-black);background:var(--card-bg);cursor:pointer;transition:all .2s ease;box-shadow:6px 6px 0 var(--color-black);padding:0;flex-shrink:0;position:relative;overflow:hidden}.theme-toggle:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--color-black)}.theme-toggle:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--color-black)}.moon-icon{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.moon-circle{width:24px;height:24px;border-radius:50%;background:var(--color-black);transition:transform .4s ease}.moon-mask{position:absolute;width:24px;height:24px;border-radius:50%;background:var(--card-bg);transform:translate(30px);transition:transform .4s ease}:root.light-mode .moon-mask{transform:translate(8px)}h1{font-size:1.3rem;font-family:Courier New,monospace;font-weight:700;color:var(--color-black);text-transform:uppercase;line-height:.9;text-shadow:var(--glow)}.subtitle{color:var(--color-gray);font-size:.9rem;font-weight:400;letter-spacing:.02em;max-width:300px;text-shadow:var(--glow)}.header-nav{display:flex;gap:32px;justify-content:space-between;align-items:center;padding:20px}.navigation-group{display:flex;gap:24px;align-items:center}.nav-link{color:var(--color-gray);text-decoration:none;font-size:.9rem;text-transform:lowercase;letter-spacing:.05em;transition:color .2s ease;position:relative;padding-bottom:4px}.nav-link:hover,.nav-link.active{color:var(--color-primary)}.nav-link.active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--color-primary);box-shadow:var(--glow)}.page-view{display:none;padding:20px}.page-view.active{display:block}#home-view .page-container{padding:40px 0}.page-title{font-size:1rem;font-weight:700;text-transform:uppercase;margin-bottom:32px;color:var(--color-primary);text-shadow:var(--glow)}.recordings-list{display:flex;flex-direction:column;gap:16px}.recording-item{background:var(--color-white);border:var(--border-width) solid var(--color-black);padding:20px;display:flex;flex-direction:column;justify-content:space-between;align-items:start;transition:all .1s ease;box-shadow:inset -3px -3px #00000080,inset 3px 3px #ffffff0d}.recording-item:hover{background:var(--card-bg);box-shadow:inset 0 0 15px var(--color-black),var(--glow)}.recording-item-info{flex:1;display:flex;flex-direction:column;gap:16px}.recording-item-name{font-size:1.1rem;font-weight:700;text-transform:lowercase;color:var(--color-primary);text-shadow:var(--glow);margin-bottom:4px}.recording-item-meta{font-size:.85rem;color:var(--color-gray)}.recording-item-actions{display:flex;gap:12px;align-items:center}.btn-record{background:transparent;border:2px solid var(--color-primary);color:var(--color-primary);padding:8px 16px;font-family:Courier New,monospace;font-size:.85rem;cursor:pointer;transition:all .1s ease;text-shadow:var(--glow);box-shadow:var(--glow);text-decoration:none}.btn-record:hover{background:var(--color-primary);color:var(--color-white);box-shadow:0 0 20px var(--color-primary)}.btn-record:active{transform:scale(.98)}.recording-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;z-index:10002;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s ease}.recording-modal.active{opacity:1;pointer-events:all}.recording-modal-container{background:var(--color-white);border:3px solid var(--color-primary);max-width:500px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 0 40px var(--color-primary),inset 0 0 20px #00ff001a}.recording-modal-header{padding:20px 24px;border-bottom:2px solid var(--color-primary);display:flex;justify-content:space-between;align-items:center;background:var(--card-bg)}.recording-modal-title{font-size:1.3rem;font-weight:700;text-transform:lowercase;letter-spacing:.08em;color:var(--color-primary);text-shadow:var(--glow);margin:0}.close-recording-modal-btn{background:transparent;border:none;color:var(--color-primary);font-size:1.5rem;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.close-recording-modal-btn:hover{transform:scale(1.2);text-shadow:0 0 10px var(--color-primary)}.recording-modal-body{padding:24px}.recording-track-info{margin-bottom:24px;padding:12px;background:var(--card-bg);border:1px solid var(--color-primary)}.recording-track-label{color:var(--color-gray);font-size:.85rem;text-transform:lowercase;margin-right:8px}.recording-track-name{color:var(--color-primary);font-weight:700;text-shadow:var(--glow)}.recording-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-label{color:var(--color-primary);font-size:.9rem;text-transform:lowercase;letter-spacing:.05em;font-weight:700}.duration-inputs{display:flex;gap:12px}.duration-input-group{display:flex;align-items:center;gap:6px;flex:1}.duration-input,.form-input{background:var(--card-bg);border:2px solid var(--color-primary);color:var(--color-primary);padding:10px 12px;font-family:Courier New,monospace;font-size:1rem;width:100%;text-align:center;transition:all .2s ease}.duration-input:focus,.form-input:focus{outline:none;box-shadow:0 0 15px var(--color-primary);background:var(--color-white)}.duration-label{color:var(--color-gray);font-size:.85rem;font-weight:700}.recording-status{min-height:24px;color:var(--color-primary);font-size:.9rem;text-align:center;text-shadow:var(--glow)}.recording-actions{display:flex;gap:12px;margin-top:8px}.btn-primary,.btn-secondary{flex:1;padding:12px 24px;font-family:Courier New,monospace;font-size:1rem;text-transform:lowercase;cursor:pointer;transition:all .1s ease;border:2px solid var(--color-primary);font-weight:700}.btn-primary{background:var(--color-primary);color:var(--color-white);box-shadow:0 0 15px var(--color-primary)}.btn-primary:hover{box-shadow:0 0 25px var(--color-primary);transform:translateY(-2px)}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:transparent;color:var(--color-primary)}.btn-secondary:hover{background:var(--card-bg)}.tracks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:32px;margin-bottom:40px}.tracks-list{display:flex;flex-direction:column;gap:16px;max-width:900px;margin-bottom:40px}.tracks-list .track-card{width:100%}.station-content{max-width:600px}.station-description{font-size:1rem;line-height:1.8;color:var(--text-color);text-shadow:var(--glow);margin-bottom:24px}.track-card{background:var(--color-white);border:var(--border-width) solid var(--color-black);padding:0;transition:all .1s ease;cursor:pointer;position:relative;box-shadow:inset -3px -3px #00000080,inset 3px 3px #ffffff0d,var(--glow)}.track-card:hover{background:var(--card-bg);box-shadow:inset 0 0 15px var(--color-black),var(--glow)}.track-card.active{background:var(--color-white);color:var(--color-black);box-shadow:inset 0 0 30px var(--color-primary),0 0 20px var(--color-primary);animation:crt-pulse 2s ease-in-out infinite}@keyframes crt-pulse{0%,to{box-shadow:inset 0 0 30px var(--color-primary),0 0 20px var(--color-primary)}50%{box-shadow:inset 0 0 40px var(--color-primary),0 0 30px var(--color-primary)}}.track-card.active .track-description{color:var(--color-black);text-shadow:var(--glow)}.track-card.active .track-meta{border-top-color:var(--color-black);color:var(--color-black);text-shadow:var(--glow)}.track-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--color-black);display:none;box-shadow:var(--glow)}.track-card.active:before{display:block;background:var(--color-primary);box-shadow:0 0 10px var(--color-primary)}.track-card-header{display:flex;justify-content:space-between;align-items:flex-start;padding:24px;border-bottom:var(--border-width) solid var(--color-black)}.track-card.active .track-card-header{border-bottom-color:var(--color-black)}.track-card h3{font-size:1.3rem;font-family:Courier New,monospace;font-weight:700;color:var(--color-black);margin-bottom:0;text-transform:uppercase;letter-spacing:.05em;text-shadow:var(--glow)}.track-card.active h3{color:var(--color-black)}.play-button{width:56px;height:56px;border:var(--border-width) solid var(--color-black);background:var(--card-bg);color:var(--color-black);display:flex;align-items:center;justify-content:center;font-size:1.4rem;cursor:pointer;transition:all .1s ease;flex-shrink:0;font-weight:900;box-shadow:inset -2px -2px #00000080,inset 2px 2px #ffffff0d,var(--glow);text-shadow:var(--glow)}.play-button:hover{background:var(--color-white);box-shadow:inset 0 0 10px var(--color-black),var(--glow)}.track-card.active .play-button{border-color:var(--color-black);background:var(--color-white);color:var(--color-black);box-shadow:0 0 15px var(--color-primary),var(--glow)}.track-card.active .play-button:hover{background:var(--card-bg);box-shadow:inset 0 0 15px var(--color-primary),var(--glow)}.track-card-body{flex:1}.track-description{color:var(--color-black);font-size:.9rem;line-height:1.6;padding:24px;font-weight:400;text-shadow:var(--glow)}.track-meta{display:flex;gap:24px;padding:20px 24px;border-top:var(--border-width) solid var(--color-black);font-size:.8rem;color:var(--color-black);font-weight:700;text-transform:uppercase;text-shadow:var(--glow)}.meta-item{display:flex;align-items:center;gap:8px}.player-bar{position:fixed;bottom:0;left:0;right:0;background:var(--color-white);border-top:var(--border-width) solid var(--color-black);padding:20px 24px;z-index:1000;box-shadow:inset 0 4px 10px #0000004d,0 0 20px var(--color-black)}.player-content{max-width:1600px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:40px}.now-playing-info{display:flex;align-items:center;gap:20px;min-width:0}.playing-indicator{width:16px;height:16px;position:relative;flex-shrink:0;border:2px solid var(--color-black);background:var(--color-white);box-shadow:var(--glow)}.pulse{position:absolute;width:100%;height:100%;background:var(--color-primary);opacity:0}.playing .pulse{animation:pulse-indicator 1s ease-in-out infinite}@keyframes pulse-indicator{0%,to{opacity:0;transform:scale(.5);box-shadow:none}50%{opacity:1;transform:scale(1);box-shadow:0 0 10px var(--color-primary)}}#visualizer{border:var(--border-width) solid var(--color-black);background:var(--color-white);box-shadow:inset -2px -2px #00000080,inset 2px 2px #ffffff0d;display:none}#visualizer.active{display:block}.track-details{min-width:0;flex:1}.track-name{font-size:1rem;font-weight:700;color:var(--color-black);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase;letter-spacing:.05em;text-shadow:var(--glow)}.track-status{font-size:.8rem;color:var(--color-gray);font-weight:400;text-transform:uppercase;text-shadow:var(--glow)}.player-controls{display:flex;gap:16px;align-items:center}.control-btn{width:52px;height:52px;border:var(--border-width) solid var(--color-black);background:var(--card-bg);color:var(--color-black);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .1s ease;font-size:1.2rem;font-weight:900;box-shadow:inset -2px -2px #00000080,inset 2px 2px #ffffff0d,var(--glow);text-shadow:var(--glow)}.control-btn .icon,.play-button .icon,.scroll-icon{font-style:normal;font-variant:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-variant-emoji:text;-webkit-text-size-adjust:none;text-size-adjust:none}.control-btn svg.icon,.play-button svg.icon{display:block;width:16px;height:16px;color:currentColor;filter:drop-shadow(0 0 2px currentColor)}.control-btn:hover:not(:disabled){background:var(--color-white);box-shadow:inset 0 0 10px var(--color-black),var(--glow)}.control-btn:disabled{opacity:.3;cursor:not-allowed}.control-btn.playing{background:var(--color-white);color:var(--color-black);box-shadow:inset 0 0 20px var(--color-primary),0 0 15px var(--color-primary)}.control-btn.playing:hover{background:var(--card-bg);box-shadow:inset 0 0 25px var(--color-primary),0 0 20px var(--color-primary)}.volume-section{display:flex;align-items:center;gap:16px}.volume-icon{font-size:.85rem;font-weight:700;color:var(--color-black);text-shadow:var(--glow);letter-spacing:.1em}#volume-slider{width:140px;height:8px;background:var(--color-white);outline:none;-webkit-appearance:none;border:var(--border-width) solid var(--color-black);box-shadow:inset 2px 2px 4px #00000080}#volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;background:var(--color-primary);cursor:pointer;border:2px solid var(--color-black);box-shadow:0 0 8px var(--color-primary),inset -1px -1px 2px #00000080}#volume-slider::-webkit-slider-thumb:hover{background:var(--color-secondary);box-shadow:0 0 12px var(--color-secondary),inset -1px -1px 2px #00000080}#volume-slider::-moz-range-thumb{width:20px;height:20px;background:var(--color-primary);cursor:pointer;border:2px solid var(--color-black);box-shadow:0 0 8px var(--color-primary),inset -1px -1px 2px #00000080}#volume-slider::-moz-range-thumb:hover{background:var(--color-secondary);box-shadow:0 0 12px var(--color-secondary),inset -1px -1px 2px #00000080}.volume-text{font-size:.85rem;color:var(--color-black);min-width:45px;font-weight:700;text-shadow:var(--glow)}.visualizer-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000f2;z-index:999;display:none;align-items:center;justify-content:center}.visualizer-modal.active{display:flex}.visualizer-container{position:relative;width:100vw;height:100vh}.close-visualizer-btn{position:absolute;top:20px;right:20px;width:60px;height:60px;background:var(--card-bg);border:var(--border-width) solid var(--color-black);color:var(--color-black);font-size:2rem;font-weight:900;cursor:pointer;z-index:10;box-shadow:inset -3px -3px #00000080,inset 3px 3px #ffffff0d,var(--glow);transition:all .1s ease;display:flex;align-items:center;justify-content:center;line-height:1;text-shadow:var(--glow)}.close-visualizer-btn:hover{background:var(--color-white);box-shadow:inset 0 0 15px var(--color-black),var(--glow)}.close-visualizer-btn:active{box-shadow:inset 3px 3px 8px #000c,var(--glow)}#p5-canvas-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding-bottom:120px}#p5-canvas-container canvas{border:none;box-shadow:none}@media (max-width: 1100px){.player-content{grid-template-columns:1fr;gap:20px}.player-bar{padding:16px 20px}.now-playing-info{order:1}.player-controls{order:2;justify-content:center}.volume-section{order:3;justify-content:center}body,#p5-canvas-container{padding-bottom:200px}}@media (max-width: 640px){.navigation-group{flex-direction:column;align-items:start;gap:0px}.tracks-grid{grid-template-columns:1fr}.track-card{box-shadow:6px 6px 0 var(--color-black)}.track-card:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 var(--color-black)}#volume-slider{width:100px}header{padding-bottom:20px;margin-bottom:40px;height:300px}.hero-content{padding:20px;justify-content:flex-start}.hero-text{text-align:left}.player-content{flex-direction:column}}