/* 206: SEO məzmun səhifələri (bələdçilər, /sql-tasks) - oxunaqlı en (~70 simvol), kod bloku və cədvəl scroll, açıq/tünd tema
   mövcud tokenlərlə (tokens.css / tokens-v2.css) işləyir. */
.article-page { padding-top: var(--space-5); padding-bottom: var(--space-7); }
.article-page .breadcrumbs { max-width: 740px; margin: 0 auto var(--space-4); font-size: 14px; color: var(--ink-muted); }
.article-page .breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; }
.article-page .breadcrumbs li + li::before { content: "›"; margin: 0 8px; color: var(--ink-muted); }
.article-page .breadcrumbs a { color: var(--ink-muted); text-decoration: underline; text-underline-offset: 2px; }
.article-page .breadcrumbs [aria-current="page"] { color: var(--ink); }
.article { max-width: 740px; margin: 0 auto; font-size: 17px; line-height: 1.7; overflow-wrap: anywhere; }
.article h1 { margin: 0 0 var(--space-4); }
.article h2 { font-size: 24px; line-height: 1.3; margin: var(--space-6) 0 var(--space-3); }
.article h3 { font-size: 19px; line-height: 1.35; margin: var(--space-5) 0 var(--space-2); }
.article p, .article ul, .article ol { margin: 0 0 var(--space-3); }
.article ul, .article ol { padding-left: 1.4em; }
.article li { margin: 0 0 6px; }
.article a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.article code { font-family: var(--font-mono); font-size: 0.92em; background: var(--code-bg); padding: 1px 5px; border-radius: 4px; overflow-wrap: anywhere; }
.article pre { margin: 0 0 var(--space-3); padding: var(--space-3); background: var(--code-bg); border-radius: 6px; overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
.article pre code { background: none; padding: 0; font-size: 14px; line-height: 1.6; white-space: pre; overflow-wrap: normal; display: block; }
.article .table-scroll { overflow-x: auto; max-width: 100%; margin: 0 0 var(--space-3); -webkit-overflow-scrolling: touch; }
.article table { border-collapse: collapse; min-width: 100%; font-size: 15px; line-height: 1.5; }
.article th, .article td { border: 1px solid var(--border, #d9dce6); padding: 8px 12px; text-align: left; vertical-align: top; }
.article th { background: var(--surface, var(--code-bg)); font-weight: 700; white-space: nowrap; }
.article td { min-width: 6em; }
.article blockquote { margin: 0 0 var(--space-3); padding-left: var(--space-3); border-left: 3px solid var(--border-strong, var(--ink-muted)); color: var(--ink-muted); }
.article .muted { margin: var(--space-2) 0; }
.article-faq { margin-top: var(--space-6); padding-top: var(--space-4); border-top: 1px solid var(--border, #d9dce6); }
.article-faq h2 { margin-top: 0; }
.sample-task { margin: 0 0 var(--space-4); padding: var(--space-3) var(--space-4); border: 1px solid var(--border, #d9dce6); border-radius: 8px; background: var(--surface, transparent); }
.sample-task h3 { margin-top: 0; }
.sample-task pre { margin-bottom: var(--space-2); }
.guide-list { list-style: none; padding: 0; margin: 0; }
.guide-list li { margin: 0 0 var(--space-4); padding: var(--space-3) var(--space-4); border: 1px solid var(--border, #d9dce6); border-radius: 8px; }
.guide-list h2 { font-size: 20px; margin: 0 0 var(--space-2); }
.guide-list p { margin: 0; color: var(--ink-muted); }
@media (max-width: 480px) { .article { font-size: 16px; } .article h2 { font-size: 21px; } .sample-task, .guide-list li { padding: var(--space-3); } }