.bootOverlay {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: #000;
z-index: 99999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-family: 'JetBrains Mono', monospace;
overflow: hidden;
transition: opacity 1s ease-out;
}
.fadeOut {
opacity: 0;
pointer-events: none;
}
.terminalContainer {
width: 80%;
max-width: 800px;
height: 60vh;
overflow-y: auto;
padding: 2rem;
background: rgba(0, 5, 0, 0.9);
border: 1px solid #003300;
position: relative;
scrollbar-width: none; /* Hide scrollbar for Firefox */
}
.terminalContainer::-webkit-scrollbar {
display: none; /* Hide scrollbar for Chrome/Safari */
}
.terminalContent {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.line {
color: #00ff00;
font-size: 1.1rem;
line-height: 1.4;
text-shadow: 0 0 5px rgba(0, 255, 0, 0.5);
animation: flicker 0.1s infinite alternate;
}
.prompt {
color: #006600;
font-weight: bold;
}
.success {
color: #00ffff;
text-shadow: 0 0 5px rgba(0, 255, 255, 0.5);
}
.alert {
color: #ffaa00;
text-shadow: 0 0 5px rgba(255, 170, 0, 0.5);
font-weight: bold;
}
.cursorLine {
display: flex;
align-items: center;
}
.cursor {
color: #00ff00;
animation: blink 0.8s infinite;
margin-left: 2px;
}
.scanline {
width: 100%;
height: 100px;
z-index: 100;
background: linear-gradient(
0deg,
rgba(0, 0, 0, 0) 0%,
rgba(0, 255, 0, 0.05) 50%,
rgba(0, 0, 0, 0) 100%
);
opacity: 0.1;
position: absolute;
top: 0;
left: 0;
pointer-events: none;
animation: scan 6s linear infinite;
}
.crtEffect {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: repeating-linear-gradient(
0deg,
rgba(18, 16, 16, 0.1) 0px,
rgba(18, 16, 16, 0.1) 1px,
transparent 1px,
transparent 2px
);
z-index: 101;
pointer-events: none;
}
.skipPrompt {
margin-top: 2rem;
color: #003300;
font-size: 0.9rem;
cursor: pointer;
transition: color 0.2s;
letter-spacing: 2px;
}
.skipPrompt:hover {
color: #00ff00;
text-shadow: 0 0 10px #00ff00;
}
@keyframes scan {
from { transform: translateY(-100%); }
to { transform: translateY(100vh); }
}
@keyframes blink {
0%, 100% { opacity: 1; }
50% { opacity: 0; }
}
@keyframes flicker {
0% { opacity: 0.97; }
100% { opacity: 1; }
}
