:root {
    --bm-accent: #76bc21;
    --bm-accent-dark: #1a5632;
    --bm-danger: #f87171;
    --bm-text: #564d4a;
    --bm-muted: #888888;
    --bm-line: #eaeaea;
    --bm-soft: #f5f7f2;
    --bm-ticker-bg: #eeedec;
    --bm-surface: #ffffff;
    --bm-white: #ffffff;
    --bm-dark: #222222;
    --bm-black: #000000;
    --bm-text-secondary: #555555;
    --bm-border-light: #ebebeb;
    --bm-border-muted: #e5e5e5;
    --bm-border-field: #cccccc;
    --bm-field-bg: #f9f9f9;
    --bm-topic-separator: #e0e0e0;
    --bm-border-subtle: rgba(86, 77, 74, .08);
    --bm-border-strong: rgba(86, 77, 74, .35);
    --bm-border-social: rgba(86, 77, 74, .8);
    --bm-border-empty: rgba(190, 190, 190, .35);
    --bm-text-empty: rgba(125, 125, 125, .8);
    --bm-header-bg: rgba(255, 255, 255, .96);
    --bm-archive-gradient: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(118, 188, 33, .35) 100%);
    --bm-container: 1396px;
    --bm-container-narrow: 700px;
    --bm-container-form: 900px;
    --bm-font: Inter, Roboto, Arial, sans-serif;

    --bm-space-1: 4px;
    --bm-space-2: 8px;
    --bm-space-3: 12px;
    --bm-space-4: 16px;
    --bm-space-5: 20px;
    --bm-space-6: 24px;
    --bm-space-7: 28px;
    --bm-space-8: 32px;
    --bm-space-10: 40px;
    --bm-space-12: 48px;
    --bm-space-14: 56px;
    --bm-space-16: 64px;
    --bm-space-20: 80px;

    --bm-size-logo: 350px;
    --bm-size-logo-md: 300px;
    --bm-size-logo-sm: 250px;
    --bm-size-header: 92px;
    --bm-size-header-md: 82px;
    --bm-size-header-sm: 72px;
    --bm-size-control: 40px;
    --bm-size-control-sm: 36px;
    --bm-size-button: 44px;
    --bm-size-post-media: 180px;
    --bm-size-post-media-side: 220px;
    --bm-size-post-media-mobile: 240px;
    --bm-size-post-media-hero: 360px;
    --bm-size-post-media-card: 360px;
    --bm-size-sidebar-min: 280px;
    --bm-size-search-input: 190px;
    --bm-size-search-input-sm: 150px;
    --bm-size-latest-button: 164px;
    --bm-size-feed-card-min: 260px;
    --bm-size-pagination-sm: 36px;
    --bm-size-editor-card-min: 180px;
    --bm-size-form-field-min: 240px;

    --bm-font-size-xs: 13px;
    --bm-font-size-2xs: 12px;
    --bm-font-size-sm: 14px;
    --bm-font-size-md: 15px;
    --bm-font-size-base: 16px;
    --bm-font-size-lg: 18px;
    --bm-font-size-xl: 20px;
    --bm-font-size-2xl: 22px;
    --bm-font-size-3xl: 24px;
    --bm-font-size-4xl: 30px;
    --bm-font-size-5xl: 46px;
    --bm-font-size-display-sm: 26px;
    --bm-font-size-display-md: 30px;
    --bm-font-size-number: 100px;
    --bm-font-size-number-sm: 70px;

    --bm-line-flat: 1;
    --bm-line-tight: 1.2;
    --bm-line-title: 1.25;
    --bm-line-snug: 1.28;
    --bm-line-relaxed: 1.4;
    --bm-line-normal: 1.5;

    --bm-weight-medium: 500;
    --bm-weight-regular: 400;
    --bm-weight-semibold: 600;
    --bm-weight-bold: 700;
    --bm-weight-extrabold: 800;

    --bm-radius-sm: 9px;
    --bm-radius-md: 10px;
    --bm-radius-xs: 4px;
    --bm-radius-lg: 25px;
    --bm-radius-pill: 999px;

    --bm-transition-fast: .2s ease;
    --bm-transition-medium: .25s ease;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Safety net: ничего не выйдет за горизонталь viewport.
   `clip` лучше `hidden` — не создаёт scroll-context, не ломает position: sticky. */
html {
    overflow-x: clip;
}

body {
    margin: 0;
    overflow-x: clip;
    background: var(--bm-surface);
    color: var(--bm-text);
    font-family: var(--bm-font);
    font-size: var(--bm-font-size-base);
    line-height: var(--bm-line-normal);
    overflow-wrap: break-word;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
}

.bm-skip-link,
.bm-site-search__label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}

.bm-skip-link:focus {
    z-index: 100000;
    top: 12px;
    left: 12px;
    width: auto;
    height: auto;
    padding: var(--bm-space-3) var(--bm-space-4);
    clip: auto;
    border-radius: var(--bm-radius-xs);
    background: var(--bm-surface);
    box-shadow: 0 4px 18px rgba(0, 0, 0, .18);
}

.bm-container,
.bm-site-header__inner,
.bm-site-footer__inner,
.bm-default-page {
    width: min(calc(100% - var(--bm-space-12)), var(--bm-container));
    margin-right: auto;
    margin-left: auto;
}

@media (max-width: 767px) {
    .bm-container,
    .bm-home-lead,
    .bm-site-header__inner,
    .bm-site-footer__inner,
    .bm-default-page {
        width: min(calc(100% - var(--bm-space-7)), var(--bm-container));
    }
}