/* Chibo - учебная библиотека. Палитра от фавиконки: чернильно-синий, бирюзовый, золото, бумага. */
:root{--ink:#10263d;--ink2:#1c3a5a;--teal:#0d6b5f;--teal2:#0a564c;--gold:#e0ad4f;--gold2:#b9852a;--paper:#fbf8f1;--card:#fff;--line:#e7dfcd;--line2:#d9cfb8;
--text:#1f2a37;--muted:#5d6876;--ru:#2f6fb0;--lit:#9a3b52;--sci:#0d6b5f;--his:#8a5a1c;--nat:#3d7d32;--soc:#6b4f9a;--r:10px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--text);font:17px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;overflow-wrap:break-word}
img{max-width:100%;height:auto}
a{color:var(--teal);text-underline-offset:2px}
a:hover{color:var(--teal2)}
h1,h2,h3,h4{font-family:"PT Serif",Georgia,"Times New Roman",serif;color:var(--ink);line-height:1.25;font-weight:700}
.w{max-width:1180px;margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-9999px;top:0;background:#fff;padding:8px 12px;z-index:10}
.skip:focus{left:8px}

/* шапка: не закреплена */
.hd{position:static}
.hd-top{background:var(--ink);color:#fff}
.hd-in{display:flex;align-items:center;gap:20px;min-height:72px;padding-top:10px;padding-bottom:10px}
.brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;flex-shrink:0}
.brand:hover{color:#fff}
.brand .mk{display:block;border-radius:9px;box-shadow:0 0 0 2px rgba(224,173,79,.45)}
.bt{display:flex;flex-direction:column;line-height:1.1}
.bn{font-family:"PT Serif",Georgia,serif;font-size:26px;font-weight:700;letter-spacing:.5px}
.bs{font-size:13px;color:var(--gold);letter-spacing:.6px;text-transform:lowercase}
.hd-note{margin:0 0 0 auto;font-size:14px;color:#c9d4df;max-width:330px;line-height:1.4;text-align:right}
.nav-btn{display:none;margin-left:auto;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.45);border-radius:8px;padding:8px 14px;font:inherit;font-size:15px;cursor:pointer}
.nav-btn::before{content:"\2630";margin-right:8px}
.nav-btn[aria-expanded="true"]::before{content:"\2715"}
.shelf{background:#fff;border-bottom:1px solid var(--line)}
.shelf ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0}
.shelf li{margin:0}
.shelf a{display:block;padding:13px 16px 11px;color:var(--ink);text-decoration:none;font-weight:600;font-size:15px;border-top:4px solid transparent}
.shelf a:hover{background:var(--paper)}
.shelf a[aria-current="page"]{background:var(--paper)}
.r-ru a{border-top-color:var(--ru)}.r-lit a{border-top-color:var(--lit)}.r-sci a{border-top-color:var(--sci)}.r-his a{border-top-color:var(--his)}
.r-nat a{border-top-color:var(--nat)}.r-soc a{border-top-color:var(--soc)}.r-all a{border-top-color:var(--gold)}
.shelf .r-all{margin-left:auto}

/* раскладка */
main{display:block;padding:22px 0 40px}
.lay{display:block}
.lay.has-aside{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:36px;align-items:start}
.main-col{min-width:0}
.bc{font-size:14px;color:var(--muted);margin:0 0 14px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 0}
.bc a{color:var(--muted)}
.bc .sep::before{content:"\203A";margin:0 8px;color:var(--line2)}

/* статья */
.post{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:30px 38px 34px}
.post h1{font-size:34px;margin:0 0 10px}
.meta{font-size:14px;color:var(--muted);margin:0 0 18px}
.lead{font-size:18.5px;color:#2a3644;margin:0 0 20px}
.post h2{font-size:26px;margin:36px 0 12px;padding-top:6px;border-top:1px solid var(--line)}
.post h3{font-size:21px;margin:26px 0 10px}
.post h4{font-size:18px;margin:22px 0 8px}
.post p{margin:0 0 14px}
.post ul,.post ol{padding-left:24px;margin:0 0 16px}
.post li{margin:0 0 6px}
.post blockquote{margin:18px 0;padding:12px 18px;border-left:4px solid var(--gold);background:var(--paper);border-radius:0 8px 8px 0}
.post pre{overflow-x:auto;background:#f4f1e8;padding:12px;border-radius:8px;font-size:14px;white-space:pre-wrap}
.post figure{margin:22px auto;text-align:center;max-width:600px}
.post figure img{display:block;margin:0 auto;width:auto;max-width:100%;height:auto;border-radius:6px}
.post figure.sm{display:inline-block;margin:6px 8px;max-width:none}
.post figure.cover{margin:6px auto 22px}
.post figcaption{font-size:13px;color:var(--muted);margin-top:6px}
.post .cap{font-size:14px;color:var(--muted);text-align:center;margin-top:-10px}
.post .sep-line{text-align:center;color:var(--muted);letter-spacing:6px}
.post a{overflow-wrap:anywhere}

/* содержание под спойлером */
.toc{margin:4px 0 26px;background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:8px}
.toc summary{cursor:pointer;padding:12px 16px;font-weight:700;color:var(--ink);list-style:none;display:flex;align-items:center;gap:10px}
.toc summary::-webkit-details-marker{display:none}
.toc summary::before{content:"\25B8";color:var(--gold2);transition:transform .15s}
.toc[open] summary::before{transform:rotate(90deg)}
.toc ol{margin:0;padding:0 18px 14px 40px;columns:2;column-gap:28px}
.toc li{margin:0 0 6px;break-inside:avoid;font-size:15.5px}
.toc a{color:var(--ink2);text-decoration:none}
.toc a:hover{text-decoration:underline}

/* таблицы */
.tw{overflow-x:auto;margin:0 0 18px;-webkit-overflow-scrolling:touch}
.post table{border-collapse:collapse;width:100%;font-size:15.5px}
.post th,.post td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.post th{background:#f4efe2;color:var(--ink)}
.post tr:nth-child(even) td{background:#fdfbf6}

/* FAQ */
.faq h3{font-size:19px}

/* похожие */
.rel{margin-top:30px}
.rel h2{font-size:24px;margin:0 0 14px}

/* карточки: каталожные карточки с корешком цвета раздела */
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.card{display:flex;gap:14px;background:var(--card);border:1px solid var(--line);border-left:5px solid var(--gold);border-radius:8px;padding:14px;color:var(--text);text-decoration:none;min-width:0}
.card:hover{border-color:var(--line2);box-shadow:0 4px 14px rgba(16,38,61,.08);color:var(--text)}
.card img,.card .ph{flex:0 0 96px;width:96px;height:96px;object-fit:cover;border-radius:6px;background:#efe9da}
.card .ph{display:block;background:linear-gradient(135deg,#efe7d3,#f8f3e7)}
.card .cb{min-width:0;display:flex;flex-direction:column}
.card .lbl{font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.card .cardt{font-family:"PT Serif",Georgia,serif;font-weight:700;color:var(--ink);font-size:17px;line-height:1.3;margin-bottom:4px}
.card p{margin:0;font-size:14.5px;color:var(--muted);line-height:1.5}
.card.k-ru{border-left-color:var(--ru)}.card.k-lit{border-left-color:var(--lit)}.card.k-sci{border-left-color:var(--sci)}
.card.k-his{border-left-color:var(--his)}.card.k-nat{border-left-color:var(--nat)}.card.k-soc{border-left-color:var(--soc)}

/* боковая колонка */
.aside .box{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin-bottom:18px}
.aside .bt2{font-family:"PT Serif",Georgia,serif;font-weight:700;color:var(--ink);font-size:18px;margin:0 0 10px}
.aside ul{list-style:none;margin:0;padding:0}
.aside li{padding:7px 0;border-top:1px solid var(--line);font-size:15px;line-height:1.4}
.aside li:first-child{border-top:0}
.aside a{color:var(--ink2);text-decoration:none}
.aside a:hover{color:var(--teal);text-decoration:underline}

/* главная */
.hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:30px 34px;margin-bottom:28px}
.hero h1{font-size:36px;margin:0 0 12px}
.hero p{margin:0 0 12px;color:#2a3644}
.hero .stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.hero .stats span{background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:14px;color:var(--ink2)}
.subjects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.subj{display:block;padding:12px 14px;border-radius:10px;background:var(--paper);border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.subj b{display:block;font-family:"PT Serif",Georgia,serif;font-size:17px}
.subj span{display:block;font-size:13px;color:var(--muted);line-height:1.35;margin-top:2px}
.subj:hover{border-color:var(--line2);color:var(--ink)}
.subj.k-ru{border-top:4px solid var(--ru)}.subj.k-lit{border-top:4px solid var(--lit)}.subj.k-sci{border-top:4px solid var(--sci)}
.subj.k-his{border-top:4px solid var(--his)}.subj.k-nat{border-top:4px solid var(--nat)}.subj.k-soc{border-top:4px solid var(--soc)}
.sec{margin:0 0 30px}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px;border-bottom:2px solid var(--line);padding-bottom:6px}
.sec-h h2{margin:0;font-size:25px}
.sec-h a{font-size:15px;font-weight:600}
.cols2{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:28px;align-items:start}
.toplist{counter-reset:t;list-style:none;margin:0;padding:0;background:var(--card);border:1px solid var(--line);border-radius:var(--r)}
.toplist li{counter-increment:t;display:flex;gap:12px;padding:11px 16px;border-top:1px solid var(--line);line-height:1.4}
.toplist li:first-child{border-top:0}
.toplist li::before{content:counter(t);flex:0 0 26px;height:26px;border-radius:50%;background:var(--ink);color:var(--gold);font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;margin-top:1px}
.toplist a{color:var(--ink2);text-decoration:none;font-size:15.5px}
.toplist a:hover{color:var(--teal);text-decoration:underline}

/* разделы, карта, служебные */
.box{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:26px 30px;margin-bottom:24px}
.box h1{font-size:32px;margin:0 0 10px}
.box p:last-child{margin-bottom:0}
.list{columns:2;column-gap:32px;padding-left:20px;margin:0}
.list li{margin:0 0 8px;break-inside:avoid;line-height:1.4}
.chips{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chips a{display:inline-block;padding:6px 13px;border:1px solid var(--line2);border-radius:999px;font-size:14.5px;text-decoration:none;color:var(--ink2);background:var(--paper)}
.chips a:hover,.chips a[aria-current="page"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.pager{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0}
.pager a,.pager span{padding:6px 12px;border:1px solid var(--line2);border-radius:6px;text-decoration:none;background:#fff}
.pager span{background:var(--ink);color:#fff;border-color:var(--ink)}
.e404{text-align:center;padding:46px 24px}
.e404 .code{font-family:"PT Serif",Georgia,serif;font-size:84px;line-height:1;color:var(--gold);margin:0 0 6px}
.e404 .chips{justify-content:center}

/* подвал */
.ft{background:var(--ink);color:#c9d4df;margin-top:20px;font-size:15px}
.ft-in{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:30px;padding-top:34px;padding-bottom:24px}
.ft a{color:#e9eef3;text-decoration:none}
.ft a:hover{color:var(--gold);text-decoration:underline}
.ft-brand{display:flex;align-items:center;gap:10px;font-family:"PT Serif",Georgia,serif;font-size:22px;color:#fff;margin:0 0 10px}
.ft-brand .mk{width:34px;height:34px}
.ft-h{color:var(--gold);font-weight:700;margin:0 0 10px;letter-spacing:.4px}
.ft ul{list-style:none;margin:0;padding:0}
.ft li{margin:0 0 7px}
.ft-bot{border-top:1px solid rgba(255,255,255,.12);padding-top:14px;padding-bottom:18px;font-size:13.5px;color:#9fb0c2}
.ft-bot p{margin:0}

/* планшет */
@media (max-width:1080px){
 .lay.has-aside{grid-template-columns:minmax(0,1fr)}
 .aside{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
 .aside .box{margin:0}
 .hd-note{display:none}
}
@media (max-width:900px){
 .hero{grid-template-columns:minmax(0,1fr);padding:24px}
 .cols2{grid-template-columns:minmax(0,1fr)}
 .ft-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .ft-about{grid-column:1/-1}
}
/* телефон */
@media (max-width:760px){
 body{font-size:16.5px}
 .hd-in{min-height:60px}
 .bn{font-size:22px}
 .brand .mk{width:34px;height:34px}
 .nav-btn{display:block}
 .shelf{display:none}
 .shelf.open{display:block}
 .shelf ul{flex-direction:column}
 .shelf a{border-top:0;border-left:4px solid transparent;padding:12px 16px}
 .r-ru a{border-left-color:var(--ru)}.r-lit a{border-left-color:var(--lit)}.r-sci a{border-left-color:var(--sci)}.r-his a{border-left-color:var(--his)}
 .r-nat a{border-left-color:var(--nat)}.r-soc a{border-left-color:var(--soc)}.r-all a{border-left-color:var(--gold)}
 .shelf .r-all{margin-left:0}
 main{padding-top:14px}
 .post{padding:20px 16px 24px;border-radius:8px}
 .post h1{font-size:26px}
 .post h2{font-size:22px;margin-top:28px}
 .post h3{font-size:19px}
 .lead{font-size:17px}
 .post figure{max-width:100%}
 .toc ol{columns:1}
 .cards{grid-template-columns:minmax(0,1fr)}
 .card img,.card .ph{flex-basis:72px;width:72px;height:72px}
 .aside{grid-template-columns:minmax(0,1fr)}
 .box{padding:20px 16px}
 .box h1,.hero h1{font-size:26px}
 .subjects{grid-template-columns:minmax(0,1fr)}
 .list{columns:1}
 .ft-in{grid-template-columns:minmax(0,1fr)}
 /* широкие таблицы с заголовками: карточка на строку */
 .post table.rt thead{display:none}
 .post table.rt,.post table.rt tbody,.post table.rt tr,.post table.rt td{display:block;width:100%}
 .post table.rt tr{border:1px solid var(--line);border-radius:8px;margin:0 0 10px;overflow:hidden}
 .post table.rt td{border:0;border-top:1px solid var(--line);display:grid;grid-template-columns:42% minmax(0,1fr);gap:8px}
 .post table.rt td:first-child{border-top:0}
 .post table.rt td::before{content:attr(data-label);font-weight:600;color:var(--ink)}
 .post table.rt td:not([data-label])::before{content:none}
 .post table.rt td:not([data-label]){grid-template-columns:minmax(0,1fr)}
}
