body{
background:#f6f3ea;
font-family:"Noto Serif SC","Source Han Serif SC",serif;
margin:0;
color:#222;
line-height:1.9;
transition:background .3s,color .3s;
}

.wrap{
max-width:760px;
margin:auto;
padding:80px 24px;
}

header{
text-align:center;
margin-bottom:60px;
}

h1{
font-size:48px;
letter-spacing:6px;
margin:0;
}

.subtitle{
color:#555;
margin-top:10px;
}

.author{
color:#888;
font-size:14px;
}

.toolbar{
display:flex;
gap:10px;
margin-bottom:40px;
}

input{
flex:1;
padding:10px;
font-size:16px;
}

button{
padding:10px 14px;
cursor:pointer;
}

section h2{
border-bottom:1px solid #ddd;
padding-bottom:8px;
}

.article-link{
display:block;
margin-top:14px;
text-decoration:none;
color:#333;
font-size:18px;
}

footer{
text-align:center;
margin-top:80px;
color:#999;
font-size:14px;
}

.dark{
background:#111;
color:#ddd;
}

.dark .subtitle{color:#bbb}
.dark .author{color:#aaa}
.dark .article-link{color:#ddd}