body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: 'Orbitron', sans-serif;
    color: #00ffe7;
    background: #000;
    overflow: hidden;
    cursor: none;
}

.stars, .twinkling {
    position: absolute;
    top: 0; left: 0;
    right: 0; bottom: 0;
    display: block;
    z-index: 0;
}

.stars {
    background: url('https://raw.githubusercontent.com/VincentGarreau/particles.js/master/demo/media/stars.png') repeat;
}

.twinkling {
    background: url('https://raw.githubusercontent.com/VincentGarreau/particles.js/master/demo/media/twinkling.png') repeat;
    animation: moveTwinkBack 200s linear infinite;
}

@keyframes moveTwinkBack {
    from {background-position:0 0;}
    to {background-position:-10000px 5000px;}
}

.content {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.title {
    font-size: 3.5rem;
    margin-bottom: 1rem;
}

.subtitle {
    font-size: 2rem;
    color: #0ff;
}

/* Canvas cursor overlay */
#cursorCanvas {
    position: fixed;
    top: 0; left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 3;
    pointer-events: none;
}