:root{
    --bg:#ffffff;
    --text:#111111;
    --muted:#6b7280;
    --line:#e5e7eb;
    --code:#f6f7f9;
    --link:#0f766e;
}

*{box-sizing:border-box}
html{font-size:18px;-webkit-text-size-adjust:100%}
body{
    margin:0;
    background:var(--bg);
    color:var(--text);
    font:400 1rem/1.75 Georgia,"Times New Roman",serif;
    text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}

/* Шапка */
.site-header{
    border-bottom:1px solid var(--line);
    background:#ffffff;
}
.site-header__inner{
    max-width:960px;
    margin:0 auto;
    padding:10px 16px;
}
.site-header__brand{
    display:flex;
    align-items:center;
    gap:12px;
}
.site-header__logo img{
    width:40px;
    height:40px;
    border-radius:12px;
}
.site-header__text{
    display:flex;
    flex-direction:column;
    gap:2px;
}
.site-header__title{
    font:600 .95rem/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.site-header__meta{
    font:400 .8rem/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    color:var(--muted);
}
.site-header__meta span,
.site-header__meta a{
    color:inherit;
}

/* Статья */
.page{
    padding:24px 18px 72px;
}
.article{
    max-width:760px;
    margin:0 auto;
}
.article__header{
    margin:12px 0 24px;
}
.article__title{
    margin:0;
    font:700 clamp(2rem,4vw,3.1rem)/1.08 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    letter-spacing:-0.03em;
}
.article__cover{
    margin:0 0 28px;
    border-radius:18px;
    overflow:hidden;
    background:#f3f4f6;
}
.article__cover img{
    width:100%;
    object-fit:cover;
}
.article__video{
    margin:0 0 28px;
}
.article__video video{
    width:100%;
    max-height:480px;
    border-radius:18px;
    background:#000;
}

/* Контент */
.article__content h1,
.article__content h2,
.article__content h3,
.article__content h4{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    line-height:1.2;
    letter-spacing:-0.02em;
    margin:2.1em 0 .7em;
}
.article__content h1{font-size:1.9rem}
.article__content h2{font-size:1.6rem}
.article__content h3{font-size:1.3rem}
.article__content h4{font-size:1.1rem}

.article__content p,
.article__content ul,
.article__content ol,
.article__content blockquote,
.article__content pre,
.article__content figure{
    margin:0 0 1.3em;
}
.article__content ul,
.article__content ol{
    padding-left:1.3em;
}
.article__content blockquote{
    padding:0 0 0 1em;
    border-left:3px solid var(--line);
    color:#374151;
}
.article__content hr{
    border:0;
    border-top:1px solid var(--line);
    margin:2em 0;
}
.article__content pre,
.article__content code{
    font:400 .92rem/1.6 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
}
.article__content pre{
    background:var(--code);
    border-radius:14px;
    padding:14px 16px;
    overflow:auto;
}
.article__content :not(pre) > code{
    background:var(--code);
    border-radius:6px;
    padding:.12em .35em;
}
.article__content figure img{
    border-radius:14px;
}
.article__content figcaption{
    margin-top:.55em;
    color:var(--muted);
    font:400 .92rem/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.article__content strong{
    font-weight:700;
}

@media (max-width:640px){
    html{font-size:17px}
    .site-header__inner{padding:8px 12px;}
    .page{padding:18px 14px 48px}
    .article__cover{margin-bottom:22px;border-radius:14px}
    .article__video video{border-radius:14px}
}