*, *::before, *::after { box-sizing: border-box; }

body {
    margin: 0;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 15px;
    line-height: 1.7;
    background: #0a0a1a;
    color: #e0e0f0;
}

/* Header */
.site-header {
    background: #10102a;
    border-bottom: 2px solid #3a3a8a;
    padding: 1.5rem 24px;
    text-align: center;
}
.site-title {
    display: block;
    font-size: 2.2rem;
    font-weight: bold;
    color: #7b7bff;
    text-decoration: none;
    letter-spacing: .03em;
}
.site-title:hover { color: #a0a0ff; }
.site-desc { color: #7070b0; margin: .3rem 0 0; font-size: .95rem; font-style: italic; }

/* Layout */
.layout {
    display: flex;
    max-width: 1060px;
    margin: 28px auto;
    padding: 0 20px;
    gap: 28px;
    align-items: flex-start;
}

/* Posts */
.main-content { flex: 1; min-width: 0; }

.post-card {
    background: #10102a;
    border: 1px solid #2a2a6a;
    border-radius: 6px;
    padding: 22px 26px;
    margin-bottom: 20px;
}
.post-title { font-size: 1.3rem; margin: 0 0 6px; }
.post-title a { color: #7b7bff; text-decoration: none; }
.post-title a:hover { text-decoration: underline; }
.post-meta { color: #505090; font-size: .85rem; margin: 0 0 8px; font-style: italic; }
.post-tags { margin: 10px 0 0; }
.tag {
    display: inline-block;
    background: #1e1e50;
    color: #9999ff;
    border-radius: 3px;
    padding: 2px 8px;
    font-size: .78rem;
    margin: 2px 3px 2px 0;
    font-family: sans-serif;
}
.back-link { margin-top: 16px; }
.back-link a { color: #7b7bff; font-family: sans-serif; font-size: .9rem; }

/* Post body */
.post-body { margin-top: 12px; }
.post-body img {
    max-width: 100%;
    height: auto;
    border: 1px solid #2a2a6a;
    display: block;
}
.post-body table { width: 100% !important; border-collapse: collapse; }
.post-body table td { padding: 4px; vertical-align: top; }
.post-body table td[colspan] img { width: 100% !important; height: auto !important; }
.post-body table td:not([colspan]) img { width: 100% !important; height: auto !important; }
.post-body a { color: #9090ff; }
.post-body p { margin: 0 0 12px; }
.post-body td[colspan] { font-size: .9rem; color: #9090c0; padding-top: 10px; font-family: sans-serif; }

/* Sidebar */
.sidebar {
    width: 220px;
    flex-shrink: 0;
}
.widget {
    background: #10102a;
    border: 1px solid #2a2a6a;
    border-radius: 6px;
    padding: 14px 16px;
    margin-bottom: 18px;
}
.widget h3 {
    font-size: .8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #505090;
    margin: 0 0 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #2a2a6a;
    font-family: sans-serif;
}
.widget ul { list-style: none; margin: 0; padding: 0; }
.widget li { margin-bottom: 7px; }
.widget a { color: #9090ff; font-size: .85rem; text-decoration: none; font-family: sans-serif; }
.widget a:hover { text-decoration: underline; color: #b0b0ff; }

/* Footer */
.site-footer {
    text-align: center;
    padding: 20px;
    color: #303060;
    font-size: .82rem;
    border-top: 1px solid #1e1e40;
    font-family: sans-serif;
    margin-top: 12px;
}
.footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 20px;
    margin-bottom: 12px;
}
.footer-links a {
    color: #5555aa;
    text-decoration: none;
    font-size: .85rem;
}
.footer-links a:hover { color: #7b7bff; text-decoration: underline; }

@media (max-width: 700px) {
    .layout { flex-direction: column; }
    .sidebar { width: 100%; }
}