:root {
    --pl-red: #ff0000;
    --pl-white: #ffffff;
    --pl-bg: #020000;
    --pl-dim-red: #440000;
}

/* Master Wrapper: Covers the whole screen, high Z-Index */
#pl_master_wrapper {
    position: fixed;
    top: 0; left: 0; width: 100vw; height: 100vh;
    background: var(--pl-bg);
    z-index: 99999;
    font-family: 'Share Tech Mono', monospace;
    overflow: hidden;
    color: var(--pl-white);
    display: none; /* Add this so it is hidden by default */
}

/* --- PHASE 1: GLITCH CONTAINER --- */
#pl_glitch_container {
    position: absolute; inset: 0; z-index: 10;
    display: flex; align-items: center; justify-content: center;
    transition: opacity 0.35s ease;
}

.pl_bg_image {
    position: absolute; inset: 0;
    background-image: url('images/matrix_lead_logo.png'); 
    background-size: contain; background-position: center;
    background-repeat: no-repeat; filter: blur(5px);
    opacity: 0.25; z-index: 1000; pointer-events: none;
}

.pl_scanlines {
    position: absolute; inset: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(255, 0, 0, 0.05) 50%);
    background-size: 100% 4px; pointer-events: none; z-index: 1;
}

.pl_geometry {
    position: absolute; width: 80vw; height: 80vw; max-width: 600px; max-height: 600px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    animation: pl-rotate-geo 20s linear infinite; z-index: 0;
}

@keyframes pl-rotate-geo { 100% { transform: rotate(360deg); } }

.pl_loader_content { position: relative; z-index: 10; text-align: center; width: 90%; max-width: 800px; }

/* --- RECTIFIED GLITCH TEXT SECTION --- */
.pl_glitch_text {
    font-family: 'Orbitron', sans-serif; 
    font-size: clamp(2rem, 10vw, 6rem);
    font-weight: 900; 
    text-transform: uppercase; 
    position: relative; 
    letter-spacing: clamp(5px, 2vw, 15px); 
    margin-bottom: 20px; 
    color: white;
    text-shadow: 0.05em 0 0 rgba(255, 0, 0, 0.75),
                 -0.025em -0.05em 0 rgba(0, 255, 0, 0.75),
                 0.025em 0.05em 0 rgba(0, 0, 255, 0.75);
    animation: pl-glitch-anim 500ms infinite;
}

.pl_glitch_text span {
    position: absolute; 
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--pl-bg); 
}

.pl_glitch_text span:first-child {
    animation: pl-glitch-anim 650ms infinite;
    clip-path: polygon(0 0, 100% 0, 100% 45%, 0 45%);
    transform: translate(-0.025em, -0.0125em);
    opacity: 0.8;
}

.pl_glitch_text span:last-child {
    animation: pl-glitch-anim 375ms infinite;
    clip-path: polygon(0 80%, 100% 20%, 100% 100%, 0 100%);
    transform: translate(0.0125em, 0.025em);
    opacity: 0.8;
}

@keyframes pl-glitch-anim {
    0%, 14% { text-shadow: 0.05em 0 0 rgba(255, 0, 0, 0.75), -0.05em -0.025em 0 rgba(0, 255, 0, 0.75), -0.025em 0.05em 0 rgba(0, 0, 255, 0.75); }
    15%, 49% { text-shadow: -0.05em -0.025em 0 rgba(255, 0, 0, 0.75), 0.025em 0.025em 0 rgba(0, 255, 0, 0.75), -0.05em -0.05em 0 rgba(0, 0, 255, 0.75); }
    50%, 99% { text-shadow: 0.025em 0.05em 0 rgba(255, 0, 0, 0.75), 0.05em 0 0 rgba(0, 255, 0, 0.75), 0 -0.05em 0 rgba(0, 0, 255, 0.75); }
    100% { text-shadow: -0.025em 0 0 rgba(255, 0, 0, 0.75), -0.025em -0.025em 0 rgba(0, 255, 0, 0.75), -0.025em -0.05em 0 rgba(0, 0, 255, 0.75); }
}

.pl_badge {
    font-size: clamp(0.5rem, 2vw, 0.7rem); color: var(--pl-red); letter-spacing: 3px; 
    margin-bottom: 10px; animation: pl-flicker 0.05s infinite alternate; 
}

.pl_console {
    background: rgba(255, 255, 255, 0.03); 
    padding: 15px; text-align: left; font-size: clamp(0.6rem, 1.5vw, 0.85rem);
    height: 120px; overflow: hidden; margin: 0 auto 25px auto; width: 100%;
    border-left: 2px solid var(--pl-white); box-sizing: border-box;
    line-height: 1.4;
}

.pl_progress_box { width: 100%; background: rgba(255,255,255,0.1); margin: 0 auto; }
.pl_bar { height: 2px; width: 0%; background: white; box-shadow: 0 0 15px white; }
.pl_meta_text { margin-top: 15px; font-size: 0.65rem; color: #444; letter-spacing: 3px; }

/* --- PHASE 2: TERMINALS --- */
#pl_bg_static {
    position: absolute; inset: 0; z-index: 0;
    display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    opacity: 0.15; pointer-events: none;
}

.pl_static_code {
    color: var(--pl-red); font-size: 8px; padding: 4px;
    white-space: pre; line-height: 1;
    animation: pl-flicker-fast 1.5s infinite;
}

.pl_terminal {
    position: absolute; background: rgba(5, 0, 0, 0.92);
    border: 1px solid rgba(255, 0, 0, 0.3);
    border-top: 2px solid var(--pl-red);
    z-index: 20; opacity: 0; display: flex; flex-direction: column;
    backdrop-filter: blur(10px); transition: opacity 0.5s ease;
    box-sizing: border-box;
    max-width: 95vw;
}

.pl_term_1 { top: 5%; left: 2%; width: 340px; height: 350px; }
.pl_term_2 { top: 10%; right: 5%; width: 35%; height: 50%; }
.pl_term_3 { bottom: 5%; left: 5%; width: 320px; height: 160px; }

@media (max-width: 768px) {
    .pl_term_1 { width: 90%; height: 22%; top: 2%; left: 5%; }
    .pl_term_2 { width: 90%; height: 28%; top: 26%; right: 5%; left: 5%; }
    .pl_term_3 { width: 90%; height: 15%; bottom: 8%; left: 5%; }
}

.pl_thead {
    background: rgba(255, 0, 0, 0.3); padding: 5px 12px;
    font-size: 9px; font-family: 'Orbitron'; color: var(--pl-white);
    border-bottom: 1px solid rgba(255, 0, 0, 0.6);
    display: flex; justify-content: space-between;
}
.pl_tbody { padding: 10px; font-size: 10px; color: #ffcccc; overflow: hidden; line-height: 1.2; flex-grow: 1; }

/* --- PHASE 3: ACCESS CARD (FIXED PADLOCK) --- */
#pl_access_container {
    position: absolute; inset: 0;
    display: none; align-items: center; justify-content: center; z-index: 1000; padding: 20px;
}

.pl_card {
    background: rgba(25, 0, 0, 0.98); border: 4px solid var(--pl-white);
    padding: 40px 60px; text-align: center; box-shadow: 0 0 100px var(--pl-red);
    backdrop-filter: blur(30px); opacity: 0; display: flex; flex-direction: column; align-items: center;
}

.pl_lock_box { 
    width: 40px; height: 60px; position: relative; margin-bottom: 20px; 
    display: flex; justify-content: center; 
}

.pl_shackle {
    width: 24px; height: 30px; border: 4px solid white; border-bottom: none; 
    border-radius: 12px 12px 0 0; position: absolute; 
    top: 8px; transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    z-index: 1;
}

.pl_lock_body {
    width: 40px; height: 32px; background: white; border-radius: 4px; 
    position: absolute; bottom: 0; z-index: 2; 
}

.pl_access_text { 
    font-family: 'Orbitron'; font-size: clamp(1.5rem, 6vw, 3.5rem); color: var(--pl-white); 
    letter-spacing: 8px; font-weight: 900; text-shadow: 0 0 20px var(--pl-red); margin: 0; 
}

.pl_access_sub { color: var(--pl-red); font-size: 10px; letter-spacing: 4px; margin-top: 10px; }

/* --- PHASE 4: BLACKOUT & ANIMATIONS --- */
.pl_blackout {
    position: fixed; inset: 0; background: black;
    z-index: 10000; opacity: 0; pointer-events: none;
    transition: opacity 0.6s ease-in;
}
.pl_blackout.active { opacity: 1; }

.pl_fw_box { height:10px; background:var(--pl-dim-red); margin-top:15px; border: 1px solid var(--pl-red); }
.pl_fw_progress { height: 100%; width: 0%; background: var(--pl-red); transition: width 0.3s ease-in-out; }
.pop-entry { animation: pl-spring-pop 0.15s cubic-bezier(0.1, 0.9, 0.2, 1.2) forwards; }

@keyframes pl-spring-pop { 0% { transform: scale(0.95); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
@keyframes pl-flicker { 0% { opacity: 1; } 100% { opacity: 0.2; } }
@keyframes pl-flicker-fast { 0%, 100% { opacity: 0.2; } 50% { opacity: 1; } }