body { padding: 20px; background: #f5f6fa; }
.container { max-width: 760px; margin: 0 auto; }

.backlink { color: #3498db; text-decoration: none; font-size: 14px; }
.lang-row a {
    display: inline-block; padding: 3px 10px; margin: 0 2px; border-radius: 20px;
    font-size: 12px; font-weight: 600; color: #5d6d7e; text-decoration: none; background: #ecf0f1;
}
.lang-row a.active { background: #3498db; color: #fff; }

article {
    background: white; border-radius: 15px; padding: 40px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08); margin-top: 14px;
}
article h1 { color: #2c3e50; margin: 0 0 10px; font-size: 30px; line-height: 1.3; }
.meta { font-size: 14px; color: #95a5a6; margin-bottom: 6px; }
.excerpt { color: #5d6d7e; font-size: 17px; line-height: 1.6; margin: 14px 0 0; }
.cover { width: 100%; border-radius: 10px; margin: 22px 0 0; }

.content { margin-top: 28px; color: #34495e; line-height: 1.75; font-size: 16px; }
.content h2 { color: #2c3e50; margin: 32px 0 12px; font-size: 24px; }
.content h3 { color: #2c3e50; margin: 26px 0 10px; font-size: 19px; }
.content p  { margin: 0 0 16px; white-space: pre-line; }
.content ul { margin: 0 0 16px; padding-left: 22px; }
.content li { margin-bottom: 8px; }
.content img { max-width: 100%; border-radius: 8px; }
.content figcaption { font-size: 13px; color: #95a5a6; text-align: center; margin-top: 6px; }

.content pre {
    background: #1a1a2e; color: #e0e0e0; padding: 18px; border-radius: 10px;
    overflow-x: auto; font-size: 14px; line-height: 1.5; margin: 0 0 16px;
}
.content blockquote {
    border-left: 4px solid #3498db; margin: 0 0 16px; padding: 8px 18px;
    color: #5d6d7e; font-style: italic; background: #f8f9fa; border-radius: 0 8px 8px 0;
}
.callout {
    border-radius: 10px; padding: 16px 18px; margin: 0 0 16px; font-size: 15px;
    background: #eaf3fb; border: 1px solid #c8e0f4; color: #2c5777;
}
.callout.warning { background: #fdf3e6; border-color: #f6dcb7; color: #8a5a17; }
.callout.success { background: #eafaf1; border-color: #a9dfbf; color: #1e8449; }
.callout .label { font-weight: 700; display: block; margin-bottom: 4px; }
.divider { border: none; border-top: 1px solid #ecf0f1; margin: 28px 0; }

.tags { margin-top: 28px; }
.tag {
    display: inline-block; background: #ecf0f1; color: #5d6d7e;
    font-size: 12px; padding: 3px 10px; border-radius: 20px; margin-right: 6px;
}
.cta {
    margin-top: 32px; background: #1a1a2e; color: #e0e0e0;
    border-radius: 12px; padding: 24px; text-align: center;
}
.cta a { color: #7ec8e3; font-weight: 700; text-decoration: none; }