/* ========================================
   VivoMusic - Main Styles
   ======================================== */

@font-face {
    font-family: 'FarDomrol';
    src: url('../fonts/Far_Domrol.ttf') format('truetype');
    font-display: swap;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    background: #060b06;
    font-family: 'FarDomrol', 'Segoe UI', Tahoma, sans-serif;
    color: #e0e0e0;
    min-height: 100vh;
    overflow-x: hidden;
    line-height: 1.6;
}

/* Background */
.vm-bg {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 0;
    pointer-events: none;
}

.vm-bg-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    animation: orbFloat 12s ease-in-out infinite;
}

.vm-bg-orb:nth-child(1) {
    width: 500px; height: 500px;
    background: rgba(34, 197, 94, 0.07);
    top: -10%; left: -5%;
}
.vm-bg-orb:nth-child(2) {
    width: 400px; height: 400px;
    background: rgba(22, 163, 74, 0.05);
    bottom: -10%; right: -5%;
    animation-delay: -6s;
}
.vm-bg-orb:nth-child(3) {
    width: 350px; height: 350px;
    background: rgba(34, 197, 94, 0.04);
    top: 50%; left: 40%;
    animation-delay: -3s;
}

@keyframes orbFloat {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(40px, -30px) scale(1.2); }
    66% { transform: translate(-20px, 25px) scale(0.85); }
}

/* Particles */
.vm-particles {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    z-index: 0;
}

.vm-particle {
    position: absolute;
    width: 3px; height: 3px;
    background: #22c55e;
    border-radius: 50%;
    box-shadow: 0 0 6px #22c55e;
    animation: particleFloat 8s linear infinite;
}

@keyframes particleFloat {
    0% { transform: translateY(100vh) scale(0); opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { transform: translateY(-10vh) scale(1.5); opacity: 0; }
}

/* Selection */
::selection {
    background: rgba(34, 197, 94, 0.3);
    color: #fff;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: #060b06;
}
::-webkit-scrollbar-thumb {
    background: #166534;
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: #22c55e;
}
/* ========================================
   VivoMusic - Main Styles
   ======================================== */

@font-face {
    font-family: 'FarDomrol';
    src: url('../fonts/Far_Domrol.ttf') format('truetype');
    font-display: swap;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
    background: #060b06;
    font-family: 'FarDomrol', 'Segoe UI', Tahoma, sans-serif;
    color: #e0e0e0;
    min-height: 100vh;
    overflow-x: hidden;
    line-height: 1.6;
}

.vm-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
.vm-bg-orb { position: absolute; border-radius: 50%; filter: blur(100px); animation: orbFloat 12s ease-in-out infinite; }
.vm-bg-orb:nth-child(1) { width: 500px; height: 500px; background: rgba(34,197,94,0.07); top: -10%; left: -5%; }
.vm-bg-orb:nth-child(2) { width: 400px; height: 400px; background: rgba(22,163,74,0.05); bottom: -10%; right: -5%; animation-delay: -6s; }
.vm-bg-orb:nth-child(3) { width: 350px; height: 350px; background: rgba(34,197,94,0.04); top: 50%; left: 40%; animation-delay: -3s; }
@keyframes orbFloat { 0%,100%{transform:translate(0,0)scale(1)}33%{transform:translate(40px,-30px)scale(1.2)}66%{transform:translate(-20px,25px)scale(0.85)} }

.vm-particles { position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }
.vm-particle { position: absolute; width: 3px; height: 3px; background: #22c55e; border-radius: 50%; box-shadow: 0 0 6px #22c55e; animation: particleFloat 8s linear infinite; }
@keyframes particleFloat { 0%{transform:translateY(100vh)scale(0);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(-10vh)scale(1.5);opacity:0} }

::selection { background: rgba(34,197,94,0.3); color: #fff; }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #060b06; }
::-webkit-scrollbar-thumb { background: #166534; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #22c55e; }