/* proof.hockey — колонка: список статей и статья (по макетам холста «Колонка — шаблон статьи», «Статья — телефон», «Колонка — список статей»).
   Подключается только на страницах колонки, поверх site.css. Все классы с префиксом a- / cl-. */

@font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-serif-cyrillic-400-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-serif-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-serif-cyrillic-400-italic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'IBM Plex Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-serif-latin-400-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-serif-cyrillic-500-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-serif-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--serif:'IBM Plex Serif',Georgia,'Times New Roman',serif}

/* ---------- статья ---------- */
.a-page{background:var(--panel)}
.a-page+.site-foot,.cl-page+.site-foot{margin-top:0}
.a-art{padding:48px 32px 64px;display:flex;flex-direction:column;align-items:center}
.a-col{width:100%;max-width:720px;display:flex;flex-direction:column;gap:22px}
.a-crumbs{display:flex;gap:8px;font-size:14px;color:var(--muted)}
.a-kicker{font-family:var(--mono);font-size:13px;color:var(--blue)}
.a-title{margin:0;font-family:var(--serif);font-size:52px;line-height:1.08;letter-spacing:-.02em;font-weight:500}
.a-sub{margin:0;font-family:var(--serif);font-style:italic;font-size:23px;line-height:1.4;color:var(--ink2)}
.a-by{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.a-by .who{display:flex;align-items:center;gap:12px}
.a-ava{width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--bg);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:18px;flex:none}
.a-by .who b{display:block;font-weight:500}
.a-by .who span span{display:block;font-size:14px;color:var(--muted)}
.a-ava-ph{overflow:hidden;background:var(--panel)}
.a-ava-ph img{width:100%;height:100%;object-fit:cover;display:block}
.a-by .who b{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.a-by .who b a{color:inherit;text-decoration:none}
.a-by .who b a:hover{color:var(--blue)}
.a-by .who .a-ovr{display:inline-block;font-family:var(--mono);font-size:12px;font-weight:500;line-height:18px;color:var(--blue);border:1px solid currentColor;border-radius:999px;padding:0 8px}
.cl-about .cl-ava{width:64px;height:64px;border-radius:50%;flex:none}
.cl-about .cl-ava+div{flex:1 1 320px}
.a-share{display:flex;flex-wrap:wrap;gap:8px}
.a-share a,.a-share button{display:inline-flex;align-items:center;height:40px;padding:0 14px;border-radius:10px;border:1px solid var(--input);background:var(--panel);color:var(--ink);font:inherit;font-size:14px;cursor:pointer}
.a-share a:hover,.a-share button:hover{border-color:var(--ink);text-decoration:none;color:var(--ink)}
.a-lead{margin:8px 0 0;font-family:var(--serif);font-size:22px;line-height:1.55}
.a-col>p{margin:0;font-family:var(--serif);font-size:19px;line-height:1.7}
.a-col>p b{font-weight:500}
.a-h2{margin:20px 0 0;font-family:var(--serif);font-size:32px;line-height:1.2;letter-spacing:-.01em;font-weight:500}

/* широкие блоки: картинка, график, блок со страницы игрока */
.a-wide{width:100%;max-width:960px;margin:40px 0;display:flex;flex-direction:column;gap:14px}
.a-wide img{display:block;width:100%;height:auto;border-radius:20px}
.a-wide.a-xl{max-width:1240px}
.a-cap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;font-size:14px;color:var(--muted);padding:0 4px}
.a-shot{background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:22px 28px 26px;display:flex;flex-direction:column;gap:16px}
.a-shot-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px}
.a-shot-h .who{display:flex;align-items:center;gap:12px}
.a-shot-h .who b{display:block;font-weight:600;font-size:18px}
.a-shot-h .who span span{display:block;font-size:14px;color:var(--muted)}
.a-shot-h .tag{font-family:var(--mono);font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:12px;padding:3px 10px;background:var(--panel)}
.a-shot .sec{gap:14px}
.a-shot .sec>.h2{display:none}
.a-shot .sec+.sec{padding-top:16px;border-top:1px solid var(--line)}

/* цифра-выноска */
.a-digit{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 24px;align-items:baseline;padding:28px 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line)}
.a-digit .n{font-family:var(--mono);font-size:56px;font-weight:500;line-height:1;color:var(--blue);white-space:nowrap}
.a-digit .t{font-size:17px;color:var(--ink2)}

/* цитата */
.a-quote{margin:12px 0;padding:0;display:flex;flex-direction:column;gap:10px}
.a-quote .q{font-family:var(--serif);font-style:italic;font-size:28px;line-height:1.35}
.a-quote .w{font-size:15px;color:var(--muted)}

/* таблица */
.a-tbl{margin:8px 0;display:flex;flex-direction:column;gap:10px}
.a-tbl table{width:100%;border-collapse:collapse;font-size:16px}
.a-tbl caption{text-align:left;font-weight:600;padding-bottom:10px}
.a-tbl th{font-family:var(--mono);font-size:12px;color:var(--muted);font-weight:400;text-align:left;padding:8px 8px 8px 0;border-bottom:1px solid var(--ink)}
.a-tbl td{padding:9px 8px 9px 0;border-bottom:1px solid var(--line2);vertical-align:middle}
.a-tbl td.r,.a-tbl th.r{text-align:right;font-family:var(--mono);white-space:nowrap}
.a-tbl tr.hl td{background:var(--hl)}
.a-tbl tr.hl td:first-child{box-shadow:inset 3px 0 0 var(--blue);padding-left:10px}
.a-tbl tr.dim td{color:var(--muted)}
.a-barc{display:flex;align-items:center;gap:10px}
.a-barc span:first-child{flex:1;height:8px;background:var(--chip);border-radius:4px;overflow:hidden}
.a-barc span:first-child i{display:block;height:8px;background:var(--blue);border-radius:4px}
.a-barc span:last-child{font-family:var(--mono);width:64px;text-align:right}
.a-tbl figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;font-size:14px;color:var(--muted)}

/* как считали, гипотезы, источники */
.a-box{display:flex;flex-direction:column;gap:8px;padding:22px 24px;background:var(--bg);border-radius:12px;font-size:15px;color:var(--ink2)}
.a-box>b{font-weight:600;color:var(--ink)}
.a-box ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.a-src{margin:0;padding:16px 0 0 20px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}
.a-tags{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.a-tags .t{display:flex;flex-wrap:wrap;gap:6px}
.a-tags .t span{padding:4px 12px;border-radius:14px;background:var(--chip);color:var(--ink2);font-size:14px}
.a-tags .d{font-size:13px;color:var(--muted);max-width:380px}

/* читать дальше */
.a-next{width:100%;max-width:1136px;margin:48px 0 0;display:flex;flex-direction:column;gap:16px}
.a-next h2{margin:0;font-size:22px;font-weight:600}
.a-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.a-card{display:flex;flex-direction:column;gap:10px;padding:22px;background:var(--bg);border-radius:12px;color:var(--ink)}
.a-card:hover{text-decoration:none;color:var(--ink);background:var(--hl)}
.a-card.sec2{background:var(--panel);border:1px solid var(--line)}
.a-card .k{font-family:var(--mono);font-size:12px;color:var(--muted)}
.a-card .h{font-family:var(--serif);font-size:21px;line-height:1.25}
.a-card.sec2 .h{font-family:var(--sans);font-size:19px;font-weight:600}

/* ---------- список статей ---------- */
.cl-hero{background:var(--panel);border-bottom:1px solid var(--line)}
.cl-hero .wrap{padding-top:44px;padding-bottom:28px;display:flex;flex-direction:column;gap:24px}
.cl-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 40px}
.cl-top h1{margin:0;font-family:var(--serif);font-size:56px;line-height:1.02;letter-spacing:-.02em;font-weight:500}
.cl-top p{margin:12px 0 0;max-width:680px;font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.45;color:var(--ink2)}
.cl-sub{display:inline-flex;align-items:center;height:48px;padding:0 20px;border-radius:12px;border:1.5px solid var(--ink);color:var(--ink);font-weight:500}
.cl-sub:hover{text-decoration:none;color:var(--ink);background:var(--bg)}
.cl-tabs{display:flex;flex-wrap:wrap;gap:6px}
.cl-tabs button{height:40px;padding:0 16px;border-radius:20px;font:inherit;font-size:15px;cursor:pointer;border:1px solid var(--input);background:var(--panel);color:var(--ink)}
.cl-tabs button[aria-pressed="true"]{border-color:var(--ink);background:var(--ink);color:#fff}
.cl-main{padding-top:36px;padding-bottom:64px;display:flex;flex-direction:column;gap:40px}
.cl-lead{display:flex;flex-wrap:wrap;background:var(--night);color:var(--night-ink);border-radius:16px;overflow:hidden}
.cl-lead:hover{text-decoration:none;color:var(--night-ink)}
.cl-lead .tx{flex:1 1 520px;min-width:0;padding:44px;display:flex;flex-direction:column;justify-content:space-between;gap:48px}
.cl-lead .k{font-family:var(--mono);font-size:13px;color:var(--night-muted)}
.cl-lead .h{display:block;font-family:var(--serif);font-size:44px;line-height:1.1;letter-spacing:-.015em}
.cl-lead .s{display:block;margin-top:16px;font-family:var(--serif);font-style:italic;font-size:20px;line-height:1.4;color:var(--night-soft)}
.cl-lead .go{font-size:15px;color:var(--night-muted)}
.cl-lead .cv{flex:1 1 360px;min-width:0;min-height:300px;background:#161B23;display:flex;align-items:center;justify-content:center;padding:32px}
.cl-lead .cv img{width:100%;height:auto;border-radius:12px}
.cl-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.cl-card{display:flex;flex-direction:column;gap:14px;padding:26px;background:var(--panel);border:1px solid var(--line);border-radius:12px;color:var(--ink);min-height:220px}
.cl-card:hover{text-decoration:none;color:var(--ink);border-color:var(--ink)}
.cl-card .k{display:flex;justify-content:space-between;gap:10px;font-family:var(--mono);font-size:12px;color:var(--muted)}
.cl-card .h{font-family:var(--serif);font-size:24px;line-height:1.22}
.cl-card .s{font-family:var(--serif);font-style:italic;font-size:16px;line-height:1.45;color:var(--ink2)}
.cl-empty{padding:32px;border:1px dashed var(--muted2);border-radius:12px;color:var(--ink2)}
.cl-about{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 32px;padding:28px 32px;background:var(--panel);border:1px solid var(--line);border-radius:12px}
.cl-about div{display:flex;flex-direction:column;gap:4px;max-width:640px}
.cl-about b{font-weight:600}
.cl-about span{font-size:15px;color:var(--ink2)}
.cl-about nav{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:15px}
[hidden]{display:none!important}

/* ---------- телефон (макеты 390) ---------- */
@media (max-width:640px){
  .a-art{padding:20px 16px 40px}
  .a-col{gap:18px}
  .a-crumbs{font-size:13px}
  .a-kicker{font-size:12px}
  .a-title{font-size:32px;line-height:1.12;letter-spacing:-.015em}
  .a-sub{font-size:19px}
  .a-by{gap:10px;padding:12px 0}
  .a-ava{width:40px;height:40px;font-size:16px}
  .a-share a{display:none}
  .a-lead{font-size:20px}
  .a-col>p{font-size:18px;line-height:1.65}
  .a-h2{font-size:25px;margin-top:8px}
  .a-wide{margin:8px -16px 16px;width:calc(100% + 32px)}
  .a-wide img{border-radius:0}
  .a-cap{font-size:12px;padding:0 16px}
  .a-shot{border-radius:0;border-left:0;border-right:0;padding:16px}
  .a-shot .tbl-wrap:has(>.lanes){display:none}
  .a-shot-h .tag{display:none}
  .a-digit{grid-template-columns:1fr;gap:4px;padding:16px 0}
  .a-digit .n{font-size:40px}
  .a-digit .t{font-size:15px}
  .a-quote .q{font-size:22px}
  .a-tbl table{font-size:14px}
  .a-barc span:last-child{width:52px}
  .a-box{padding:14px;font-size:14px}
  .a-next{margin-top:24px}
  .cl-hero .wrap{padding-top:24px}
  .cl-top h1{font-size:38px}
  .cl-top p{font-size:18px}
  .cl-tabs{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:0 16px}
  .cl-tabs button{flex:none}
  .cl-lead .tx{padding:24px;gap:28px}
  .cl-lead .h{font-size:28px}
  .cl-lead .s{font-size:17px}
  .cl-lead .cv{min-height:0;padding:16px}
  .cl-cards{grid-template-columns:1fr}
  .cl-about{padding:20px}
}

/* сайт по макетам (v2): длинные неразрывные формулы и блоки со страницы игрока не распирают телефон */
.a-col>p,.a-lead,.a-cap{overflow-wrap:break-word}
.a-shot{overflow-x:auto}
/* широкие таблицы колонки: прокрутка вбок внутри блока (18.10.2026) */
.a-tbl .a-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.a-tbl .a-scroll table{min-width:100%}
/* врезка :::врезка (19.10.2026) */
.a-note{margin:14px 0;padding:22px 26px 24px 24px;background:var(--hl);border-left:4px solid var(--blue);border-radius:4px 14px 14px 4px;display:flex;flex-direction:column;gap:10px}
.a-note .k{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.a-note>b{font-weight:600;font-size:19px;line-height:1.3;color:var(--ink)}
.a-note p{margin:0;font-size:17px;line-height:1.6;color:var(--ink2)}
@media (max-width:640px){.a-note{padding:18px 18px 20px 16px}.a-note>b{font-size:17px}.a-note p{font-size:16px}}
