:root{--glitch-cyan:cyan;--glitch-red:red;--star-color:#fff;--glitch-duration:.2s;--star-scroll-duration:30s;--logo-glitch-duration:5s;--bg-gradient-duration:8s;--spotify-fade-duration:2s;--star-field-height:4000px;--star-field-offset:2000px;--bg-gradient:linear-gradient(132deg, #050505, #0a0f1c, #1b263b, #2c0a12, #3b0a1e, #0d1b2a, #050505);--star-field-small:radial-gradient(1px 1px at 5% 5%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 10% 90%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 15% 25%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 20% 75%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 25% 40%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 30% 60%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 35% 10%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 40% 90%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 45% 20%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 50% 80%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 55% 30%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 60% 70%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 65% 50%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 70% 15%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 75% 85%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 80% 35%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 85% 65%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 90% 45%, var(--star-color) 100%, transparent 0), radial-gradient(1px 1px at 95% 25%, var(--star-color) 100%, transparent 0);--star-field-medium:radial-gradient(2px 2px at 12% 60%, var(--star-color) 100%, transparent 0), radial-gradient(2px 2px at 18% 10%, var(--star-color) 100%, transparent 0), radial-gradient(2px 2px at 27% 95%, var(--star-color) 100%, transparent 0), radial-gradient(2px 2px at 34% 45%, var(--star-color) 100%, transparent 0), radial-gradient(2px 2px at 43% 70%, var(--star-color) 100%, transparent 0), radial-gradient(2px 2px at 52% 5%, var(--star-color) 100%, transparent 0), radial-gradient(2px 2px at 63% 85%, var(--star-color) 100%, transparent 0), radial-gradient(2px 2px at 76% 60%, var(--star-color) 100%, transparent 0), radial-gradient(2px 2px at 87% 30%, var(--star-color) 100%, transparent 0);--star-field-large:radial-gradient(3px 3px at 22% 38%, var(--star-color) 100%, transparent 0), radial-gradient(3px 3px at 48% 25%, var(--star-color) 100%, transparent 0), radial-gradient(3px 3px at 66% 12%, var(--star-color) 100%, transparent 0), radial-gradient(3px 3px at 79% 92%, var(--star-color) 100%, transparent 0), radial-gradient(3px 3px at 92% 58%, var(--star-color) 100%, transparent 0)}#spotify-container{margin-top:1rem;position:relative}iframe#spotify-player{opacity:0;border:none}.spinner{z-index:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.spinner-ring{border:3px solid #0000;border-top-color:var(--glitch-cyan);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.spinner.hidden{display:none}@keyframes spotify-fade-in{0%{opacity:0;transform:translateY(50%)scale(.95)}30%{opacity:0;transform:translateY(-5%)scale(1.02)}55%{opacity:.5;transform:translateY(2%)scale(.99)}80%{opacity:1.05;transform:translateY(0)scale(1)}to{opacity:1;transform:translateY(0)scale(1)}}.animate-spotify-fade-in{animation:spotify-fade-in var(--spotify-fade-duration) ease-out forwards}body{text-align:center;background:var(--bg-gradient);animation:backgroundGradient var(--bg-gradient-duration) ease-in-out infinite;background-size:300% 300%;margin:0;padding:0;overflow:hidden}#logo{animation:logoGlitch var(--logo-glitch-duration) infinite}@keyframes logoGlitch{0%,78%,to{filter:none;opacity:1;transform:rotate(0)translate(0)scale(1)}79%{filter:drop-shadow(8px 0 var(--glitch-cyan)) drop-shadow(-8px 0 var(--glitch-red)) brightness(220%) contrast(130%);opacity:.9;transform:rotate(-3deg)translate(4px,1px)scale(1.12)}80%{filter:drop-shadow(-7px 4px var(--glitch-cyan)) drop-shadow(7px -4px var(--glitch-red)) brightness(200%) contrast(120%);opacity:.95;transform:rotate(3deg)translate(-4px,-1px)scale(1.12)}81%{filter:drop-shadow(6px -6px var(--glitch-cyan)) drop-shadow(-6px 6px var(--glitch-red)) brightness(210%) contrast(125%);opacity:.9;transform:rotate(-2deg)translate(3px,2px)scale(1.1)}82%{filter:drop-shadow(-8px 0 var(--glitch-cyan)) drop-shadow(8px 0 var(--glitch-red)) brightness(220%) contrast(130%);opacity:.95;transform:rotate(2deg)translate(-4px,2px)scale(1.12)}83%{filter:none;opacity:1;transform:rotate(0)translate(0)scale(1)}}@keyframes backgroundGradient{0%{background-position:0}50%{background-position:100%}to{background-position:0}}body:before,body:after{z-index:-1;content:"";width:100%;height:var(--star-field-height);background:var(--star-field-small), var(--star-field-medium), var(--star-field-large);animation:starScroll var(--star-scroll-duration) linear infinite;position:absolute;top:0;left:0}body:after{top:var(--star-field-offset)}@keyframes starScroll{0%{transform:translateY(0)}to{transform:translateY(calc(-1 * var(--star-field-offset)))}}.container{flex-direction:column;justify-content:center;align-items:flex-start;min-height:100dvh;display:flex}.container>*{align-self:center}@keyframes glitch{0%{filter:drop-shadow(5px 4px 0 var(--glitch-cyan)) drop-shadow(-5px -6px 0 var(--glitch-red));transform:rotate(0)}25%{filter:drop-shadow(-5px -6px 0 var(--glitch-cyan)) drop-shadow(5px 4px 0 var(--glitch-red))}50%{filter:drop-shadow(5px -4px 0 var(--glitch-cyan)) drop-shadow(-8px 4px 0 var(--glitch-red));transform:rotate(10deg)}75%{filter:drop-shadow(-8px -4px 0 var(--glitch-cyan)) drop-shadow(-5px -4px 0 var(--glitch-red))}to{filter:drop-shadow(-5px 0px 0 var(--glitch-cyan)) drop-shadow(5px -4px 0 var(--glitch-red));transform:rotate(0)}}.social{justify-content:center;align-items:flex-start;padding:1rem;display:flex}.social a{color:#dc143c;padding:1rem;font-size:1.7rem;text-decoration:none}.social a svg{vertical-align:middle;width:2rem;height:2rem;display:inline-block}.glitch{animation:glitch var(--glitch-duration) infinite}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}