/* 1. THE FOUNDATION (The Moving Stars) */
body {
    background-color: #000000;
    
    /* LAYER 1: The moving stars (top) | LAYER 2: The fixed stars (bottom) */
    background-image: 
        radial-gradient(white, rgba(255,255,255,.2) 2px, transparent 40px),
        url('back-stars.png');
    
    /* Layer 1 moves, Layer 2 stays locked to the distant background */
    background-attachment: scroll, fixed; 
    background-size: 550px 550px, cover;
    background-repeat: repeat, no-repeat;
    
    /* The drift animation */
    animation: moveStars 100s linear infinite;

    margin: 0;
    padding: 0;
    color: #33ff33;
    font-family: 'Courier New', monospace;
    overflow: hidden;
}

/* THE SEAMLESS DRIFT ENGINE */
/* Math: 1100 and 550 are perfect multiples of the 550px size. No more jumping! */
@keyframes moveStars {
    from { background-position: 0 0, center center; }
    to { background-position: 1100px 550px, center center; }
}

/* 2. THE STAR */
.star-companion {
    position: fixed; 
    right: 10%;      
    top: 20%;        
    width: 300px;    
    z-index: 100;
    pointer-events: none;
}

/* 3. THE INTERFACE */
.terminal-text {
    color: #33ff33;
    font-family: 'Courier New', Courier, monospace;
    font-size: 40px;
    letter-spacing: 4px;
    text-shadow: 0 0 5px #33ff33, 0 0 10px #33ff33;
    
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    
    margin: 0;
    text-transform: uppercase;
}

/* THE NORTHERN CROSS (Asset 02) */
.asset-02 {
    position: fixed;
    left: 4%;         
    top: 14%;         
    width: 200%;     
    opacity: 0.5;     
    z-index: 50;
    pointer-events: none;
    filter: brightness(0.8);
}

/* THE RETURN BRIDGE */
.return-link {
    color: #33ff33;
    font-family: 'Courier New', monospace;
    font-size: 12px;
    text-decoration: none;
    letter-spacing: 2px;
    
    position: fixed;
    bottom: 75px;
    left: 50%;
    transform: translateX(-50%);
    
    opacity: 0.5;
    transition: 0.4s;
}

.return-link:hover {
    opacity: 1;
    text-shadow: 0 0 8px #33ff33;
}