
*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{

background:#05100c url("background.jpg") center center fixed;
background-size:cover;

font-family:'VT323', monospace;

color:#baffc8;

display:flex;

justify-content:center;

align-items:center;

height:100vh;

overflow:hidden;

}

.scanlines{

position:fixed;

width:100%;

height:100%;

pointer-events:none;

background:
repeating-linear-gradient(
0deg,
rgba(255,255,255,.03) 0px,
rgba(255,255,255,.03) 2px,
transparent 2px,
transparent 4px
);

animation:flicker .18s infinite;

opacity:.3;

}

.window{

width:760px;

background:#0d2019;

border:3px solid #89bba0;

box-shadow:
0 0 25px rgba(0,255,100,.25);

padding:20px;

position:relative;

}

.titlebar{

background:#27473b;

padding:8px;

font-size:26px;

text-align:center;

border-bottom:2px solid #9cd8b2;

margin-bottom:20px;

}

.logo{

text-align:center;

margin-bottom:20px;

}

.logo img{

width:160px;

}

h1{

text-align:center;

font-size:48px;

letter-spacing:3px;

margin-bottom:10px;

}

.tagline{

text-align:center;

font-size:26px;

margin-bottom:30px;

color:#d5ffe0;

}

.terminal{

background:#06110d;

padding:20px;

border:2px solid #3eff7d;

margin-bottom:30px;

}

.terminal p{

font-size:28px;

margin-bottom:12px;

}

.online{

color:#4dff74;

font-weight:bold;

}

.menu{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:12px;

margin-bottom:30px;

}

.menu a{

text-decoration:none;

color:#baffc8;

border:2px solid #4fff82;

padding:12px;

text-align:center;

transition:.25s;

font-size:28px;

background:#10241d;

}

.menu a:hover{

background:#41ff7d;

color:#001b09;

box-shadow:0 0 20px #41ff7d;

}

.status{

background:#08140f;

padding:15px;

border:2px solid #3eff7d;

}

.status-title{

font-size:30px;

margin-bottom:15px;

}

.bar{

height:20px;

background:#163024;

border:1px solid #64ff95;

margin-bottom:15px;

}

.fill{

width:92%;

height:100%;

background:#41ff7d;

animation:pulse 2s infinite;

}

footer{

margin-top:25px;

text-align:center;

font-size:22px;

color:#77cc8f;

}

@keyframes pulse{

0%{

width:92%;

}

50%{

width:96%;

}

100%{

width:92%;

}

}

@keyframes flicker{

0%{

opacity:.25;

}

50%{

opacity:.35;

}

100%{

opacity:.25;

}
}
.error-window {

    position: fixed;

    top:50%;
    left:50%;

    transform:translate(-50%, -50%);

    width:340px;

    background:#111;

    border:2px solid #900;

    padding:10px;

    color:white;

    z-index:9999;

    box-shadow:0 0 25px red;

}


.title-bar {

    cursor: move;

    background:#700000;

    padding:8px;

    display:flex;

    justify-content:space-between;

    font-weight:bold;

}


.error-title {

    letter-spacing:2px;

}


.close-button {

    background:red;

    color:white;

    border:none;

    cursor:pointer;

}


.error-message {

    background:#050505;

    border:1px solid #600;

    padding:15px;

    margin-top:10px;

    color:#ff4444;

}


.action-buttons {

    text-align:center;

    margin-top:15px;

}


.action-buttons button {

    background:#700000;

    color:white;

    border:2px outset red;

    padding:7px 15px;

    margin:5px;

    cursor:pointer;

}


.action-buttons button:hover {

    background:red;

}