
    * {
        box-sizing: border-box;
    }

    body {
        margin: 0;
        min-height: 100vh;
        background: #080a0f;
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: Arial, sans-serif;
        color: white;
        overflow: hidden;
    }

    /*
     * Ana disk
     */
    .disk {
    text-align: center;
    margin: auto;
    position: relative;
    width: min(900px, 90vw);
    height: 55px;
    border-radius: 50%;
    /* background: radial-gradient(ellipse at center, #ffffff 0%, #ffffff73 45%, #ffffff7a 75%, #ffffff 100%); */
   /* box-shadow: 0 0 40px rgb(255 255 255 / 80%), inset 0 0 35px rgb(255 255 255);*/
    overflow: hidden;
    perspective: 900px;
    top: 41px;
    }

    /*
     * Disk üzerindeki parlaklık çizgileri
     */
    .disk::before {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: 50%;
        /* background:
            repeating-radial-gradient(
                ellipse at center,
                transparent 0px,
                transparent 15px,
                rgba(255,255,255,.025) 16px,
                transparent 18px
            ); */
        pointer-events: none;
        z-index: 5;
    }

    /*
     * Üst / alt parlaklık
     */
    .disk::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        height: 45%;
        /* background: linear-gradient(
            to bottom,
            rgba(255,255,255,.08),
            transparent
        ); */
        border-radius: 50%;
        pointer-events: none;
        z-index: 6;
    }

    /*
     * Metin hareket alanı
     */
    .viewport {
        position: absolute;
        inset: 0;
        overflow: hidden;

        /*
         * Sağ ve sol kenarlarda opacity maskesi
         */
        mask-image: linear-gradient(
            to right,

            
            transparent 0%,
            rgba(0,0,0,.15) 8%,
            rgba(0,0,0,.45) 14%,
            black 22%,

            
            black 78%,

            
            rgba(0,0,0,.45) 86%,
            rgba(0,0,0,.15) 92%,
            transparent 100%
        );
        -webkit-mask-image: linear-gradient(
            to right,

            transparent 0%,
            rgba(0,0,0,.15) 8%,
            rgba(0,0,0,.45) 14%,
            black 22%,

            black 78%,

            rgba(0,0,0,.45) 86%,
            rgba(0,0,0,.15) 92%,
            transparent 100%
        );
    }

    /*
     * Metin satırı
     */
    .track {
        position: absolute;

        left: 0;
        top: 50%;

        display: flex;
        align-items: center;
        gap: 100px;

        white-space: nowrap;

        transform: translateY(-50%);

        animation: scroll 18s linear infinite;
    }

.track a {
   
    color: white;
    text-decoration: auto;
}

    .item {
        font-size: 23px;
        font-weight: 700;
        letter-spacing: 4px;
        color: #f5f7fa;
        text-shadow:
            0 0 8px rgba(255,255,255,.35),
            0 0 25px rgba(100,150,255,.15);

        /*
         * Disk perspektifi
         */
        transform:
            perspective(700px)
            rotateX(8deg);
    }

    /*
     * Sağa doğru giden animasyon.
     * Metinlerin başlangıç noktası ekranın sağ tarafı.
     */
    @keyframes scroll {

        from {
            transform:
                translate(100%, -50%);
        }

        to {
            transform:
                translate(-100%, -50%);
        }
    }

    /*
     * Merkez çizgisi
     */
    .center-line {
        position: absolute;

        left: 50%;
        top: 15%;
        bottom: 15%;

        width: 1px;

        background: rgba(255,255,255,.08);

        z-index: 10;

        pointer-events: none;
    }

    /*
     * Disk kenarı
     */
    .rim {
        position: absolute;
        inset: 0;
        border-radius: 50%;
        /* border: 1px solid rgba(255,255,255,.12); */
        /* box-shadow:
            inset 0 0 20px rgba(255,255,255,.05); */
        pointer-events: none;
        z-index: 20;
    }

