Embed

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DCR Blueprint Loading</title>

<style>
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html,body{
    width:100%;
    height:100%;
    overflow:hidden;
    background:#ffffff;
    font-family:Arial,Helvetica,sans-serif;
}

.loader{
    position:fixed;
    inset:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    z-index:999999999;
    background:#ffffff;
}

.title{
    font-size:clamp(42px,8vw,90px);
    font-weight:900;
    color:#0066ff;
    letter-spacing:2px;
    animation:pulse 1s infinite;
}

.loading{
    margin-top:15px;
    font-size:clamp(24px,4vw,42px);
    font-weight:800;
    color:#000;
}

.timer{
    margin-top:30px;
    font-size:80px;
    font-weight:900;
    color:#e60000;
}

.message{
    margin-top:10px;
    font-size:22px;
    font-weight:bold;
    color:#444;
}

@keyframes pulse{
    0%{transform:scale(1);}
    50%{transform:scale(1.08);}
    100%{transform:scale(1);}
}
</style>
</head>

<body>

<div class="loader">
    <div class="title">DCRBLUEPRINT</div>
    <div class="loading">LOADING...</div>

    <div class="timer" id="timer">6</div>

    <div class="message">
        Redirecting in <span id="seconds">6</span> seconds...
    </div>
</div>

<script>
let time = 6;

const countdown = setInterval(() => {
    time--;
    document.getElementById("timer").textContent = time;
    document.getElementById("seconds").textContent = time;

    if(time <= 0){
        clearInterval(countdown);
        window.location.href = "https://dcrblueprint.lovable.app/";
    }
},1000);
</script>

</body>
</html>