
:root{ --accent:#0077cc; --muted:#6b7280; --bg:#f6f7fb; --card:#ffffff }
*{box-sizing:border-box}
html,body{height:100%}
body{font-family:Inter, 'Segoe UI', Arial, sans-serif;margin:0;background:var(--bg);color:#0f172a;line-height:1.5}
.site-header{background:linear-gradient(90deg, #ffffff, #fbfdff);border-bottom:1px solid #e6eaf2}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;max-width:1100px;margin:0 auto;padding:18px}
.site-header h1{margin:0;font-size:20px}
.site-header h1 a{color:var(--accent);text-decoration:none}
.site-header nav a{margin-left:16px;color:var(--muted);text-decoration:none;padding:8px;border-radius:6px}
.site-header nav a:hover{background:#f0f6ff;color:var(--accent)}
.container{max-width:1100px;margin:28px auto;display:flex;gap:28px;padding:0 16px}
.sidebar{width:240px;background:var(--card);padding:16px;border:1px solid #eef3fb;border-radius:8px}
.sidebar h3{margin-top:0}
.sidebar ul{padding-left:16px;margin:8px 0}
.posts{flex:1}
.post{display:flex;background:var(--card);padding:12px;border:1px solid #eef3fb;margin-bottom:14px;border-radius:8px;transition:box-shadow .18s ease,transform .12s ease}
.post:hover{box-shadow:0 8px 24px rgba(16,24,40,0.08);transform:translateY(-4px)}
.post img{width:180px;height:110px;object-fit:cover;margin-right:14px;border-radius:6px}
.post-body h3{margin:0 0 6px;font-size:18px}
.post-body h3 a{color:#0b1220;text-decoration:none}
.meta{color:var(--muted);font-size:13px}
.post-meta{color:var(--muted);font-size:13px;margin:6px 0}
.excerpt{color:#334155;margin-top:8px}
.post-tags{margin-top:10px}
.post-tags .tag{display:inline-block;background:#eef8ff;color:var(--accent);padding:6px 10px;border-radius:999px;margin-right:8px;font-size:13px;text-decoration:none}
.post-tags .tag:hover{background:#dfeffd}
.site-footer{margin-top:36px;background:var(--card);border-top:1px solid #eef3fb}
.site-footer .wrap{max-width:1100px;margin:0 auto;padding:12px}
.post-full .hero{width:100%;max-height:520px;object-fit:cover;margin:12px 0;border-radius:8px}
.content{background:var(--card);padding:18px;border:1px solid #eef3fb;border-radius:8px}
.single .container{gap:0}

/* Utility */
.wrap{max-width:1100px;margin:0 auto;padding:0 12px}

@media(max-width:900px){.container{flex-direction:column}.sidebar{width:auto}}

/* Domain list and active states */
.domain-list{list-style:none;padding:0;margin:8px 0}
.domain-list li{margin-bottom:6px}
.domain-list a{display:block;padding:8px 10px;color:var(--muted);text-decoration:none;border-radius:6px}
.domain-list a:hover{background:#f4f8ff;color:var(--accent)}
.domain-list a.active{background:var(--accent);color:#fff;font-weight:600}

.site-header nav a{margin-left:12px;color:var(--muted);text-decoration:none;padding:8px;border-radius:6px}
.site-header nav a.active{background:var(--accent);color:#fff}


