*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg-dark: #0a0a0f;--bg-card: rgba(15, 15, 25, .85);--accent: #e946a0;--accent-glow: rgba(233, 70, 160, .4);--accent-purple: #8b5cf6;--accent-secondary: #533483;--text-primary: #f0e6d3;--text-secondary: rgba(255, 255, 255, .7);--text-muted: rgba(255, 255, 255, .4);--font-display: "Space Grotesk", sans-serif;--font-body: "Inter", sans-serif;--font-lyrics: "Cormorant Garamond", serif}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--bg-dark);color:var(--text-primary);-webkit-font-smoothing:antialiased;overflow-x:hidden}.hero{height:100vh;height:100dvh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,rgba(139,92,246,.15) 0%,transparent 70%),radial-gradient(ellipse at 30% 80%,rgba(233,70,160,.1) 0%,transparent 50%),var(--bg-dark)}.hero:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;background:url(/images/background.jpg) center/cover no-repeat;filter:blur(2px) brightness(.5)}.hero-content{position:relative;z-index:1;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem}.hero-title{font-family:var(--font-display);font-size:clamp(3rem,8vw,6rem);font-weight:700;background:linear-gradient(135deg,var(--accent) 0%,var(--accent-purple) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.hero-subtitle{font-family:var(--font-lyrics);font-size:clamp(1.2rem,2.5vw,1.8rem);color:var(--text-secondary);font-style:italic;margin-bottom:2rem}.song-card{cursor:pointer;width:280px;background:var(--bg-card);border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.1);transition:transform .3s ease,box-shadow .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.song-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 60px var(--accent-glow),0 0 40px #8b5cf633}.song-card-cover{position:relative;width:100%;aspect-ratio:1;overflow:hidden}.song-card-cover img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.song-card:hover .song-card-cover img{transform:scale(1.08)}.song-card-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;background:#e946a0d9;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease,transform .3s ease;box-shadow:0 0 30px var(--accent-glow)}.song-card:hover .song-card-play{opacity:1}.song-card-play svg{width:28px;height:28px;color:#fff;margin-left:3px}.song-card-info{padding:1.25rem;text-align:left}.song-card-title{font-family:var(--font-display);font-size:1.1rem;font-weight:600;margin-bottom:.25rem}.song-card-artist{font-size:.9rem;color:var(--text-muted)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);z-index:300;animation:fadeIn .3s ease}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:500;padding:2rem;overflow:hidden;overscroll-behavior:contain;animation:fadeIn .3s ease}.modal{position:relative;background:#ffffff26;border:none;border-radius:24px;padding:1px;max-width:1000px;width:100%;max-height:100%;overflow:hidden;transform:scale(.9) translateY(20px);animation:modalEnter .3s cubic-bezier(.4,0,.2,1) forwards;box-shadow:0 25px 80px #00000080}@keyframes modalEnter{to{transform:scale(1) translateY(0)}}.modal-close{position:absolute;top:.75rem;right:.75rem;background:transparent;border:none;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff6;transition:all .2s;z-index:10;padding:0}.modal-close svg{width:14px;height:14px;stroke-width:2.5}.modal-close:hover{color:#fffc}.modal-content{display:grid;grid-template-columns:1fr 1.2fr;height:100%;max-height:100%;border-radius:23px;overflow:hidden;position:relative;background:transparent}.modal-content:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:var(--cover-bg);background-size:cover;background-position:center;filter:blur(25px);z-index:0}.modal-content>*{position:relative;z-index:1}.modal-cover-section{display:flex;flex-direction:column;align-items:center;justify-content:safe center;padding:1rem 2rem;border-right:1px solid rgba(255,255,255,.15);overflow-y:auto;min-height:0;background:transparent;position:relative}.modal-cover-section:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#0003;pointer-events:none;z-index:0}.modal-cover-content{display:flex;flex-direction:column;align-items:center;gap:.4rem;width:100%;position:relative;z-index:1}.modal-cover-wrapper{position:relative;width:100%;max-width:min(280px,30vh);margin-bottom:.5rem;flex-shrink:1}.modal-cover{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;display:block}.modal-song-info{text-align:center;margin-top:.5rem}.modal-title{font-family:var(--font-display);font-size:1.75rem;font-weight:700;color:var(--text-primary);margin-bottom:.5rem}.modal-subtitle{font-family:var(--font-body);font-size:1.1rem;color:var(--text-secondary);font-style:italic}.audio-controls-desktop{display:flex;align-items:center;justify-content:center;margin-top:1rem}.audio-play-btn{width:80px;height:80px;border-radius:50%;border:.5px solid rgba(255,255,255,.2);background:#6366f140;color:#ec4899;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);outline:none;position:relative;overflow:hidden;transform:scale(1.08);box-shadow:0 0 40px #6366f180,0 0 80px #6366f14d}.audio-play-btn:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#818cf8,#a78bfa);opacity:1;z-index:-1;animation:rotateGradient 3s linear infinite}.audio-play-btn:after{content:"";position:absolute;top:1px;right:1px;bottom:1px;left:1px;border-radius:50%;background:#0f0f23e6;z-index:-1}.audio-play-btn svg{width:32px;height:32px;margin-left:4px;filter:drop-shadow(0 0 12px rgba(236,72,153,.8))}.audio-play-btn:hover{transform:scale(1.15)}@keyframes rotateGradient{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.audio-player{width:100%;margin-top:.75rem}.audio-progress-wrapper{width:100%;display:flex;flex-direction:column;gap:.5rem}.audio-time-row{display:flex;justify-content:space-between;padding:0 2px}.audio-time{font-family:var(--font-body);font-size:.85rem;color:#ffffff80;font-variant-numeric:tabular-nums}.audio-progress-bar{width:100%;height:8px;background:transparent;border-radius:8px;cursor:pointer;position:relative;overflow:visible;touch-action:none;padding:15px 0;margin:-15px 0;box-sizing:content-box}.audio-progress-track{position:absolute;top:15px;left:0;right:0;height:8px;background:#ffffff14;border-radius:8px}.audio-progress-fill{position:absolute;top:15px;left:0;height:8px;background:linear-gradient(90deg,var(--text-primary) 0%,var(--accent) 40%,var(--accent-secondary) 100%);border-radius:8px;transition:width .1s linear}.audio-progress-glow{position:absolute;top:7px;left:0;height:24px;background:linear-gradient(90deg,#f0e6d399,#e94560b3 40%,#53348399);border-radius:12px;filter:blur(12px);opacity:.85;transition:width .1s linear}.audio-progress-fill:before{content:"";position:absolute;top:-20px;left:0;right:-10px;height:30px;background:radial-gradient(ellipse 8px 12px at 20% 100%,var(--text-primary) 0%,transparent 70%),radial-gradient(ellipse 6px 15px at 40% 100%,var(--accent) 0%,transparent 70%),radial-gradient(ellipse 10px 18px at 60% 100%,rgba(233,69,96,.8) 0%,transparent 70%),radial-gradient(ellipse 7px 14px at 80% 100%,var(--accent-secondary) 0%,transparent 70%),radial-gradient(ellipse 5px 10px at 90% 100%,rgba(83,52,131,.6) 0%,transparent 70%);filter:blur(3px);pointer-events:none}.audio-progress-fill:after{content:"";position:absolute;top:-25px;left:0;right:-5px;height:35px;background:radial-gradient(ellipse 5px 10px at 15% 100%,rgba(240,230,211,.7) 0%,transparent 70%),radial-gradient(ellipse 8px 16px at 35% 100%,rgba(233,69,96,.6) 0%,transparent 70%),radial-gradient(ellipse 6px 12px at 55% 100%,rgba(255,107,138,.5) 0%,transparent 70%),radial-gradient(ellipse 9px 14px at 75% 100%,rgba(83,52,131,.5) 0%,transparent 70%),radial-gradient(ellipse 4px 8px at 95% 100%,rgba(83,52,131,.4) 0%,transparent 70%);filter:blur(4px);pointer-events:none}.audio-progress-thumb{position:absolute;top:19px;transform:translate(-50%,-50%);width:16px;height:16px;background:radial-gradient(circle,var(--text-primary) 0%,var(--accent) 50%,var(--accent-secondary) 100%);border-radius:50%;box-shadow:0 0 10px var(--text-primary),0 0 20px var(--accent),0 0 30px var(--accent),0 0 40px var(--accent-secondary)}.audio-progress-bar:hover .audio-progress-thumb{transform:translate(-50%,-50%) scale(1.1);transition:transform .2s ease}.audio-player-mobile,.audio-controls-mobile{display:none}.modal-lyrics-section{padding:2.5rem 1.5rem 2.5rem 2.5rem;overflow-y:auto;max-height:80vh;scroll-behavior:smooth;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:#0006;-ms-overflow-style:none;scrollbar-width:none}.modal-lyrics-section::-webkit-scrollbar{display:none}.lyrics-container{display:flex;flex-direction:column;gap:1.5rem}.lyrics-paragraph{padding:.75rem 1.25rem;border-radius:12px;transition:all .6s cubic-bezier(.4,0,.2,1);position:relative;opacity:.7;transform:scale(.98)}.lyrics-paragraph.lyrics-clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.lyrics-paragraph.lyrics-clickable:hover{background:#000000a6}.lyrics-line{font-family:var(--font-body);font-size:clamp(.85rem,2.5vw,1.2rem);line-height:1.8;color:var(--text-secondary);margin:0;padding:.1rem 0;text-wrap:balance}.lyrics-paragraph.active{opacity:1;transform:scale(1);background:linear-gradient(135deg,#1e1432f2,#321e50f2,#281941f2)}.lyrics-paragraph.active .lyrics-line{color:var(--text-primary);font-weight:600}.lyrics-paragraph.active:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:12px;padding:1px;background:linear-gradient(135deg,var(--text-primary) 0%,var(--accent) 50%,var(--accent-secondary) 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;box-shadow:0 0 10px var(--text-primary),0 0 20px var(--accent),0 0 30px var(--accent-secondary);pointer-events:none}.global-particles{position:fixed;top:0;left:0;width:100vw;height:100vh;overflow:hidden;pointer-events:none;z-index:50}.particle{position:absolute;width:3px;height:3px;background:#22d3eee6;border-radius:50%;opacity:0;animation:particleFloat 18s infinite ease-in-out;animation-delay:calc(var(--i) * .4s);box-shadow:0 0 6px #22d3eecc,0 0 14px #22d3ee80,0 0 28px #22d3ee4d}.particle:nth-child(3n){animation-duration:22s}.particle:nth-child(5n){animation-duration:14s}@keyframes particleFloat{0%{opacity:0;transform:translateY(100vh) translate(0) scale(0);left:calc(var(--i) * 4%)}10%{opacity:.7;transform:translateY(80vh) translate(15px) scale(1)}50%{opacity:.5;transform:translateY(40vh) translate(-20px) scale(.8)}90%{opacity:.25;transform:translateY(0) translate(15px) scale(.5)}to{opacity:0;transform:translateY(-10vh) translate(0) scale(0);left:calc(var(--i) * 4% + 8%)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (max-width: 768px){.modal-overlay{padding:0}.modal{width:100%;height:100%;max-width:100%;max-height:100%;border-radius:0;padding:0;background:transparent}.modal-content{grid-template-columns:1fr;grid-template-rows:auto 1fr;height:100%;max-height:100%;border-radius:0}.modal-content:before{filter:blur(30px)}.modal-content:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#00000059;pointer-events:none;z-index:0}.modal-cover-section{padding:.75rem 1rem;padding-top:calc(.75rem + env(safe-area-inset-top,0px));border-right:none;border-bottom:1px solid rgba(255,255,255,.15);display:flex;flex-direction:row;align-items:center;gap:.75rem;flex-wrap:wrap}.modal-cover-section:after{display:none}.modal-cover-content{display:contents}.modal-cover-wrapper{max-width:70px;margin-bottom:0;flex-shrink:0}.modal-cover{border-radius:10px}.modal-song-info{text-align:left;margin-top:0;flex:1;min-width:150px}.modal-title{font-size:1.1rem;margin-bottom:.15rem}.modal-subtitle{font-size:.85rem}.audio-player-desktop,.audio-controls-desktop{display:none!important}.audio-player-mobile{display:block!important;width:100%;margin-top:.25rem;order:11}.audio-controls-mobile{display:flex!important;justify-content:center;align-items:center;gap:2rem;margin-top:.25rem;margin-bottom:.25rem;order:12;width:100%}.audio-play-btn-mobile{width:72px;height:72px;background:#6366f140;border:1px solid rgba(255,255,255,.25);border-radius:50%;color:#ec4899;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 0 25px #6366f166,0 0 50px #6366f133;outline:none}.audio-play-btn-mobile svg{width:40px;height:40px;margin-left:4px;filter:drop-shadow(0 0 12px rgba(236,72,153,.8))}.audio-progress-bar{height:10px;padding:20px 0;margin:-20px 0}.audio-progress-track,.audio-progress-fill{top:20px;height:10px}.audio-progress-glow{top:12px}.audio-progress-thumb{top:25px;width:20px;height:20px}.modal-close{top:calc(.75rem + env(safe-area-inset-top,0px));right:1rem;width:32px;height:32px;background:#0006;border-radius:50%;color:#ffffffb3}.modal-close svg{width:16px;height:16px}.modal-lyrics-section{padding:.75rem .5rem;padding-bottom:calc(.75rem + env(safe-area-inset-bottom,0px));max-height:none;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.lyrics-container{width:100%;gap:1rem}.lyrics-paragraph{padding:.6rem .75rem;opacity:.85;border-radius:10px;border:2px solid transparent;transition:opacity .3s ease-out,border-color .3s ease-out,background .3s ease-out;text-align:center;scroll-margin-top:25vh;scroll-margin-bottom:25vh}.lyrics-line{font-size:clamp(1.1rem,5vw,1.25rem);text-align:center;word-spacing:.03em;color:#ffffffbf;text-wrap:balance}.lyrics-paragraph.active{opacity:1;background:linear-gradient(135deg,#1e1432f2,#321e50f2,#281941f2);border-color:var(--accent);box-shadow:0 0 20px #e945604d}.lyrics-paragraph.active .lyrics-line{color:var(--text-primary);font-weight:600}.lyrics-paragraph.active:before{display:none}.modal-backdrop{background:#000;backdrop-filter:none;-webkit-backdrop-filter:none}.song-card{width:240px}}