/* «Граф Колесов» — стили раздела: статьи: список, рубрики, статья. Подключается после grafkolesov.css ({% block css %}); порядок правил — как в исходном общем файле, правила общего файла, которые должны перебивать правила раздела, повторены здесь (ТЗ-14). */
.gk-demo{font:600 11px 'JetBrains Mono',monospace;padding:2px 6px;background:var(--gk-neutral);color:var(--gk-on-neutral);letter-spacing:.08em}
.gk-form-toggle>summary{list-style:none;display:inline-flex;cursor:pointer}
.gk-form-toggle[open]>summary{margin-bottom:12px}
.gk-demo-note{display:flex;gap:10px;align-items:center;font-size:13px;color:var(--gk-mute);margin:0 0 10px}
/* ---------- статья: обложка, автор, текст слева, виджеты справа, комментарии ---------- */
.gk-art-head{display:flex;flex-direction:column;gap:14px;max-width:860px;padding-top:12px}
.gk-art-head h1{margin:0}
.gk-art-byline{display:flex;align-items:center;gap:12px}
.gk-art-avatar{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;flex:none;background:var(--gk-panel);
  border:1px solid var(--gk-line);font:700 18px Onest,sans-serif;color:var(--gk-acc-text);overflow:hidden}
.gk-art-avatar--lg{width:64px;height:64px;font-size:26px}
.gk-art-avatar--sm{width:30px;height:30px;font-size:14px}
.gk-art-who{display:flex;flex-direction:column;gap:2px;font-size:14px}
.gk-art-who b{font-size:15px}
.gk-art-cover{margin:24px 0 0;position:relative}
.gk-art-cover img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;border:1px solid var(--gk-line)}
.gk-art-cover figcaption{position:absolute;right:10px;bottom:8px;font-size:12px;color:var(--gk-on-dark);opacity:.75}
.gk-art-head .gk-hero-lead{max-width:860px}
.gk-side-sizes{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.gk-side-sizes a{padding:6px 9px;border:1px solid var(--gk-line);font:600 13px 'JetBrains Mono',monospace;background:var(--gk-bg)}
.gk-side-sizes a:hover{border-color:var(--gk-acc)}
.gk-side-arts li{line-height:1.35}
.gk-article-body .gk-callout{margin:22px 0;padding:16px 18px 16px 52px;position:relative;border:1px solid var(--gk-line);background:var(--gk-card);font-size:16px}
.gk-article-body .gk-callout::before{content:"!";position:absolute;left:16px;top:15px;width:24px;height:24px;display:grid;place-items:center;
  background:var(--gk-acc);color:var(--gk-on-acc);font:800 14px Onest,sans-serif}
.gk-article-body .gk-callout--tip::before{content:"✓";background:var(--gk-ok);color:var(--gk-on-ok)}
.gk-article-body .gk-callout b:first-child{display:block;margin-bottom:4px}
.gk-art-sources{margin-top:28px}
.gk-art-sources h2{font-size:20px}
.gk-art-sources ol{font-size:14px;color:var(--gk-mute)}
.gk-art-author{display:flex;gap:16px;align-items:flex-start;margin-top:32px;padding:20px;border:1px solid var(--gk-line);background:var(--gk-card)}
.gk-art-author p{margin:6px 0 0;font-size:14px;line-height:1.55}
.gk-comments{margin-top:32px;padding:20px;border:1px solid var(--gk-line);background:var(--gk-card)}
.gk-comments h2{font-size:20px;margin:0 0 14px}
.gk-comment{padding:14px 0;border-bottom:1px solid var(--gk-line)}
.gk-comment-head{display:flex;align-items:center;gap:10px;font-size:14px}
.gk-comment-head time{margin-left:auto;font-size:13px}
.gk-comment p{margin:8px 0 0;font-size:15px;line-height:1.55}
.gk-comment-reply{margin-top:10px;padding:10px 14px;border-left:3px solid var(--gk-acc);background:var(--gk-bg);font-size:14px}
.gk-comments .gk-form-toggle{margin-top:16px}
.gk-comment-form{display:flex;flex-direction:column;gap:12px;max-width:560px;margin-top:12px}
@media (max-width:560px){.gk-art-cover{margin-left:-16px;margin-right:-16px}.gk-art-cover img{border-left:0;border-right:0}}
/* схемы в статьях (apps/blog/graphics.py) */
.gk-art-graphic{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;align-items:center;padding:20px;margin:8px 0;background:var(--gk-panel);border:1px solid var(--gk-line)}
.gk-art-graphic svg{max-width:100%;height:auto}
.gk-art-graphic--tire svg,.gk-art-graphic--tread svg{flex:1 1 320px}
/* обложка в списке статей — превью 600×315, во всю ширину карточки */
.gk-article-thumb{display:block;margin:-14px -14px 4px;aspect-ratio:600/315;overflow:hidden;background:var(--gk-panel)}
.gk-article-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.gk-art-graphic svg.gk-dial,.gk-art-graphic--dial svg{max-width:440px;height:auto;margin:0 auto;display:block}
/* карточки статей: дата прижата к низу, на одной высоте в ряду */
.gk-article-card{display:flex;flex-direction:column}
.gk-article-card>span:last-child{margin-top:auto}