.me{

    margin:0;

    background:#d9d1c6;

    display:flex;

    justify-content:center;

    font-family:
    "Baskerville",
    "Songti TC",
    "Songti SC",
    serif;

    color:#49443d;

}

.paper{

    position:relative;

    width:min(92%,760px);

    min-height:100vh;

    padding:80px 80px 120px;

    background:
    repeating-linear-gradient(
        to bottom,
        #f7f3ea 0px,
        #f7f3ea 39px,
        rgba(120,110,100,.18) 40px
    );

    box-shadow:
    0 8px 30px rgba(0,0,0,.12);

}

/* 左侧红线 */

.paper::before{

    content:"";

    position:absolute;

    top:0;

    bottom:0;

    left:60px;

    width:1px;

    background:rgba(185,95,95,.45);

}

/* 返回 */

.back-link{

    text-decoration:none;

    color:#666;

    font-size:18px;

    transition:.25s;

}

.back-link:hover{

    opacity:.6;

}

/* JULY */

.month-title{

    text-align:center;

    font-size:56px;

    letter-spacing:.08em;

    margin:60px 0 45px;

    font-weight:400;

}

/* 星期 */

.week{

    display:grid;

    grid-template-columns:repeat(7,1fr);

    text-align:center;

    margin-bottom:35px;

    font-size:18px;

    opacity:.75;

}

/* 日历 */

.calendar{

    display:grid;

    grid-template-columns:repeat(7,1fr);

    justify-items:center;

    gap:26px 10px;

    margin-bottom:70px;

}

/* 空心 */

.day{

    width:13px;

    height:13px;

    border:1.7px solid #4b4741;

    border-radius:50%;

    box-sizing:border-box;

}

/* 实心 */

a.day{

    display:block;

    transition:.25s;

    cursor:pointer;

}

a.day:hover{

    transform:scale(1.35);

}

.active{

    background:#4b4741;

}

/* 分隔线 */

.divider{

    border:none;

    border-top:1px solid rgba(0,0,0,.18);

    margin:40px 0 28px;

}

/* Archive */

.archive-btn{

    display:flex;

    align-items:center;

    gap:10px;

    background:none;

    border:none;

    padding:0;

    font:inherit;

    font-size:24px;

    color:#49443d;

    cursor:pointer;

}

#arrow{

    transition:.3s;

}

.archive-list{

    display:none;

    margin-top:25px;

}

.archive-list.show{

    display:block;

}

.archive-list a{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:14px 0;

    text-decoration:none;

    color:#49443d;

    border-bottom:1px solid rgba(0,0,0,.08);

    transition:.25s;

}

.archive-list a:hover{

    opacity:.6;

}

.archive-date{

    width:120px;

    opacity:.65;

}

.archive-title{

    flex:1;

}

/* 手机 */

@media(max-width:768px){

    .paper{

        padding:60px 28px 80px;

        width:100%;

    }

    .paper::before{

        left:22px;

    }

    .month-title{

        font-size:42px;

    }

    .week{

        font-size:15px;

    }

    .calendar{

        gap:22px 6px;

    }

    .archive-btn{

        font-size:21px;

    }

    .archive-list a{

        flex-direction:column;

        align-items:flex-start;

        gap:3px;

    }

}
@keyframes pageFade{

    from{

        opacity:0;

    }

    to{

        opacity:1;

    }

}

.me{

    animation:pageFade .7s ease;

}