*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Merriweather', serif;
}

body{
    background:linear-gradient(120deg,#0f2027,#203a43,#2c5364);
    color:#f5f5f5;
    min-height:100vh;
}

header{
    text-align:center;
    padding:40px 20px;
    animation:fade 1s ease;
}

header h1{
    font-size:2.2rem;
    letter-spacing:2px;
}

header p{
    opacity:0.75;
    margin-top:10px;
}

main{
    max-width:850px;
    margin:auto;
    padding:20px;
}

.poem-list a{
    display:block;
    text-decoration:none;
    color:#fff;
}

.poem-item{
    padding:20px;
    border-bottom:1px solid rgba(255,255,255,0.15);
    transition:0.3s;
}

.poem-item:hover{
    background:rgba(255,255,255,0.1);
}

.poem-title{
    font-size:1.3rem;
}

.poem-meta{
    font-size:0.9rem;
    opacity:0.7;
    margin-top:6px;
}

.poem-page pre{
    white-space:pre-wrap;
    line-height:1.9;
    font-size:1.05rem;
}

.back-home{
    display:inline-block;
    margin-top:30px;
    text-decoration:none;
    color:#fff;
    opacity:0.8;
}

.back-home:hover{
    opacity:1;
}

@keyframes fade{
    from{opacity:0; transform:translateY(10px);}
    to{opacity:1; transform:translateY(0);}
}

@media(max-width:600px){
    header h1{font-size:1.7rem;}
}