body.single-chapter{
    background:#050816;
}

/* Remove normal site spacing */
.single-chapter .site-header,
.single-chapter footer{
    display:none;
}

.reader-page{
    width:100%;
    min-height:100vh;
}

/* TOPBAR */

.reader-topbar{
    position:sticky;
    top:0;
    z-index:999;

    display:flex;
    justify-content:space-between;
    align-items:center;

    gap:20px;

    padding:16px 24px;

    background:rgba(5,8,22,.92);
    backdrop-filter:blur(12px);

    border-bottom:1px solid rgba(255,255,255,.06);
}

.reader-back{
    color:#fff;
    text-decoration:none;
    font-weight:700;
}

.reader-chapter-select{
    background:#11182d;
    color:#fff;

    border:none;
    border-radius:14px;

    padding:14px 18px;

    font-size:15px;
}

/* PDF */

.pdf-reader{
    width:100%;
    max-width:900px;

    margin:0 auto;
    padding:40px 0;
}

.pdf-page{
    width:100% !important;
    height:auto !important;

    display:block;

    margin-bottom:0;

    border-radius:0;

    box-shadow:none;
}

/* NAVIGATION */

.reader-navigation{
    display:flex;
    justify-content:space-between;
    align-items:center;

    gap:20px;

    max-width:900px;

    margin:60px auto;
    padding:0 20px;
}

.reader-navigation a{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-width:170px;

    padding:16px 24px;

    border-radius:999px;

    background:#11182d;

    color:#fff;
    text-decoration:none;
    font-weight:700;

    transition:.25s ease;
}

.reader-navigation a:hover{
    background:linear-gradient(
        135deg,
        #7b2ff7,
        #b845ff
    );
}

/* MOBILE */

@media(max-width:768px){

    .reader-topbar{
        flex-direction:column;
        align-items:stretch;

        padding:14px;
    }

    .reader-chapter-select{
        width:100%;
    }

    .reader-navigation{
        flex-direction:column;
    }

    .reader-navigation a{
        width:100%;
    }

}