body {
    background-color: #121212;
    margin: 0;
    padding: 0;
    overflow: hidden;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

p {
    border-right: solid 3px rgba(0,255,0,.75);
    white-space: nowrap;
    overflow: hidden;
    font-family: Consolas, monospace;
    font-size: 28px;
    color: rgba(0,255,0,.70);
    /*margin: 0 auto;*/
}

/* animation */
p {
    animation: animated-text 3s steps(27,end) 1s 1 normal both, animated-cursor 600ms steps(27,end) infinite;
}

p span {
    color: #ffffff;
}

/* text */

@keyframes animated-text {
    from {
        width: 0;
    }

    to {
        width: 415px;
    }
}

/* cursor */

@keyframes animated-cursor {
    from {
        border-right-color: rgba(0,255,0,.75);
    }

    to {
        border-right-color: transparent;
    }
}


.noise {
    z-index: 100;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: .15;
}

@keyframes turn-on {
    0% {
        transform: scale(1, 0.8) translate3d(0, 0, 0);
        opacity: 0;
    }

    5% {
        opacity: 1;
    }

    100% {
        transform: scale(1, 1) translate3d(0, 0, 0);
        opacity: 1;
    }
}

.crt {
    animation: flicker 0.5s infinite, turn-on 2s linear;
}

/* Эффект засветки по краям */
.corner {
    position: absolute;
    width: 50px;
    height: 50px;
    border: 2px solid rgba(0, 255, 0, 0.3);
    pointer-events: none;
}

.top-left {
    top: 10px;
    left: 10px;
    border-right: none;
    border-bottom: none;
}

.top-right {
    top: 10px;
    right: 10px;
    border-left: none;
    border-bottom: none;
}

.bottom-left {
    bottom: 10px;
    left: 10px;
    border-right: none;
    border-top: none;
}

.bottom-right {
    bottom: 10px;
    right: 10px;
    border-left: none;
    border-top: none;
}

.crt {
    position: relative;
    width: 80vw;
    height: 80vh;
    background-color: #111;
    border: 10px solid #333;
    border-radius: 5px;
    box-shadow: 0 0 30px rgba(0, 100, 0, 0.5);
    overflow: hidden;
    padding: 20px;
    color: #0f0;
    text-shadow: 0 0 5px #0f0;
}

    /* Эффект сканирующих линий */
    .crt::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: linear-gradient( rgba(0, 0, 0, 0) 50%, rgba(0, 20, 0, 0.2) 50% );
        background-size: 100% 4px;
        pointer-events: none;
        z-index: 10;
    }

    /* Эффект свечения */
    .crt::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: radial-gradient( ellipse at center, rgba(0, 255, 0, 0.05) 0%, rgba(0, 0, 0, 0) 70% );
        pointer-events: none;
        z-index: 10;
    }

/* Эффект мерцания */
@keyframes flicker {
    0% {
        opacity: 0.95;
    }

    5% {
        opacity: 0.9;
    }

    10% {
        opacity: 0.85;
    }

    15% {
        opacity: 0.92;
    }

    20% {
        opacity: 0.88;
    }

    25% {
        opacity: 0.94;
    }

    30% {
        opacity: 0.98;
    }

    35% {
        opacity: 0.9;
    }

    40% {
        opacity: 0.86;
    }

    45% {
        opacity: 0.91;
    }

    50% {
        opacity: 0.89;
    }

    55% {
        opacity: 0.93;
    }

    60% {
        opacity: 0.95;
    }

    65% {
        opacity: 0.88;
    }

    70% {
        opacity: 0.96;
    }

    75% {
        opacity: 0.92;
    }

    80% {
        opacity: 0.97;
    }

    85% {
        opacity: 0.94;
    }

    90% {
        opacity: 0.99;
    }

    95% {
        opacity: 0.93;
    }

    100% {
        opacity: 0.95;
    }
}

.crt {
    animation: flicker 0.5s infinite;
}

/* Эффект искривления экрана */
.content {
    transform: perspective(300px) rotateX(2deg);
    height: 100%;
    overflow-y: auto;
    padding-right: 10px;
}

    /* Стиль полосы прокрутки */
    .content::-webkit-scrollbar {
        width: 8px;
    }

    .content::-webkit-scrollbar-thumb {
        background-color: #0f0;
        border-radius: 4px;
    }