html, body {height:100%;margin:0;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
background:linear-gradient(135deg,#0f2027,#203a43,#2c5364);background-size:cover;background-attachment:fixed;color:#fff;line-height:1.6;display:flex;flex-direction:column}
header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:.5rem 1rem;background:rgba(0,0,0,.3);position:relative}
.logo h1{margin:0;font-size:1.5rem;font-style:italic;justify-self:start}
#tagline{font-size:.9rem;font-style:italic;justify-self:center;text-align:center}
.menu-toggle{justify-self:end;font-size:1.5rem;cursor:pointer;z-index:1100}
nav{position:absolute;top:100%;right:0;background:rgba(0,0,0,.85);border-radius:6px;display:none;flex-direction:column;min-width:180px;z-index:1000}
nav.show{display:flex}nav a{padding:.75rem 1rem;border-bottom:1px solid rgba(255,255,255,.1)}
nav a:last-child{border-bottom:none}
a{color:#5dade2;text-decoration:none}a:hover{text-decoration:underline}
.announcement{max-width:1100px;margin:.5rem auto 0;padding:.75rem 1rem;background:rgba(0,0,0,.35);border:1px solid #5dade2;border-radius:8px}
.announcement h1,.announcement h2,.announcement h3{margin-top:0}
#content-area{display:flex;gap:2rem;padding:1rem;flex:1}
#content{flex:3}#content article{font-size:.95rem;line-height:1.5}
.post-separator{border:none;border-top:2px dashed #5dade2;margin:1.5rem 0}
#sidebar{flex:1;background:rgba(0,0,0,.2);padding:1rem;border-radius:8px}
.sidebar-block{margin-bottom:2rem}.sidebar-block h3{border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.5rem}
#pagination{margin:1rem 0;text-align:center}
#pagination button{margin:0 .5rem;padding:.5rem 1rem;background:rgba(0,0,0,.4);border:1px solid #5dade2;color:#5dade2;border-radius:4px;cursor:pointer}
#pagination button:disabled{opacity:.5;cursor:not-allowed}
footer{text-align:center;padding:.5rem;background:rgba(0,0,0,.3)}
.footer-link{color:#5dade2}.footer-link:hover{text-decoration:underline}
.tag{display:inline-block;margin-left:.5rem;font-size:.85rem;color:#5dade2}.tag:hover{text-decoration:underline}
@media(max-width:700px){header{grid-template-columns:1fr auto;grid-template-areas:'logo menu' 'tagline tagline'}.logo{grid-area:logo}#tagline{grid-area:tagline}.menu-toggle{grid-area:menu}}