/**
 * [RS] Wiki article page styles.
 * The hero itself is the shared hero used by /wiki/index.php.
 */

.article-overview {
    padding-top: 30px;
    padding-bottom: 30px;
}

.article-overview .article-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px;
    margin: 0;
    color: rgba(255,255,255,.42);
    font-size: .64rem;
    font-weight: 700;
    letter-spacing: .04em;
}

.article-overview .article-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.article-overview a.article-meta-item:hover {
    color: #fff;
}

.article-overview .article-meta-item i {
    color: var(--red-bright);
}

.article-overview .article-meta-divider {
    width: 1px;
    height: 14px;
    background: var(--border);
}

@media (max-width: 480px) {
    .article-overview .article-meta {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .article-overview .article-meta-divider {
        display: none;
    }
}

/* =====================================================
           READING PROGRESS
        ====================================================== */

        .reading-progress {

            position: fixed;

            top: 0;
            left: 0;

            z-index: 99999;

            width: 100%;
            height: 2px;

            pointer-events: none;

        }


        .reading-progress-bar {

            width: 0;
            height: 100%;

            background:
                var(--red-bright);

            box-shadow:
                0 0 10px
                rgba(224,0,0,.50);

        }

/* =====================================================
           MOBILE ARTICLE NAVIGATION
        ====================================================== */

        .mobile-article-nav {

            display: none;

            border-bottom:
                1px solid
                var(--border);

            background:
                #090909;

        }


        .mobile-article-nav-inner {

            display: flex;

            align-items: center;

            gap: 8px;

            padding:
                12px
                0;

            overflow-x: auto;

            scrollbar-width: none;

        }


        .mobile-article-nav-inner::-webkit-scrollbar {

            display: none;

        }


        .mobile-article-link {

            flex:
                0
                0
                auto;

            min-height: 38px;

            display: inline-flex;

            align-items: center;

            padding:
                0
                13px;

            border:
                1px solid
                var(--border);

            color:
                rgba(255,255,255,.52);

            background:
                #0d0d0d;

            font-size: .65rem;

            font-weight: 700;

            white-space: nowrap;

        }


        .mobile-article-link:hover {

            color: #fff;

            border-color:
                var(--red-border);

            background:
                rgba(189,0,0,.06);

        }


        /* =====================================================
           ARTICLE LAYOUT
        ====================================================== */

        .article-section {

            padding:
                78px
                0
                115px;

        }


        .article-layout {

            display: grid;

            grid-template-columns:
                330px
                minmax(0, 920px);

            gap: 68px;

            align-items: start;

            justify-content: center;

        }


        /* =====================================================
           WIKI SIDEBAR
        ====================================================== */

        .article-toc {

            position: sticky;

            top: 108px;

            max-height:
                calc(100vh - 132px);

            overflow-y: auto;

            scrollbar-width: thin;

            scrollbar-color:
                rgba(255,255,255,.14)
                transparent;

        }


        .article-toc::-webkit-scrollbar {

            width: 5px;

        }


        .article-toc::-webkit-scrollbar-track {

            background:
                transparent;

        }


        .article-toc::-webkit-scrollbar-thumb {

            background:
                rgba(255,255,255,.13);

        }


        .article-toc::-webkit-scrollbar-thumb:hover {

            background:
                rgba(189,0,0,.55);

        }


        .wiki-nav-panel {

            overflow: hidden;

            border:
                1px solid
                var(--border);

            background:
                #0d0d0d;

            box-shadow:
                0 18px 48px
                rgba(0,0,0,.20);

        }


        /* =====================================================
           SIDEBAR SECTIONS
        ====================================================== */

        .wiki-nav-section {

            border-bottom:
                1px solid
                var(--border);

        }


        .wiki-nav-heading {

            min-height: 56px;

            display: flex;

            align-items: center;

            justify-content: space-between;

            gap: 12px;

            padding:
                0
                18px;

            border-bottom:
                1px solid
                var(--border);

            color:
                rgba(255,255,255,.50);

            font-size: .66rem;

            font-weight: 800;

            letter-spacing: .10em;

            line-height: 1.3;

            text-transform: uppercase;

        }


        .wiki-nav-heading > span:first-child {

            min-width: 0;

            display: flex;

            align-items: center;

            gap: 9px;

        }


        .wiki-nav-heading i {

            flex-shrink: 0;

            color:
                var(--red-bright);

            font-size: .80rem;

        }


        .wiki-nav-count {

            min-width: 28px;
            height: 25px;

            flex-shrink: 0;

            display: inline-flex;

            align-items: center;
            justify-content: center;

            padding:
                0
                6px;

            border:
                1px solid
                var(--border);

            color:
                rgba(255,255,255,.50);

            background:
                rgba(255,255,255,.025);

            font-size: .58rem;

            font-weight: 800;

        }


        /* =====================================================
           TABLE OF CONTENTS
        ====================================================== */

        .toc-links {

            max-height: 370px;

            overflow-y: auto;

            scrollbar-width: thin;

            scrollbar-color:
                rgba(255,255,255,.12)
                transparent;

        }


        .toc-links::-webkit-scrollbar {

            width: 4px;

        }


        .toc-links::-webkit-scrollbar-thumb {

            background:
                rgba(255,255,255,.11);

        }


        .toc-link {

            position: relative;

            display: block;

            padding:
                13px
                18px;

            border-bottom:
                1px solid
                var(--border-soft);

            color:
                rgba(255,255,255,.55);

            font-size: .74rem;

            font-weight: 500;

            line-height: 1.52;

            transition:
                color .18s ease,
                background .18s ease,
                padding-left .18s ease;

        }


        .toc-link:last-child {

            border-bottom: 0;

        }


        .toc-link.level-3 {

            padding-left: 35px;

            color:
                rgba(255,255,255,.40);

            font-size: .67rem;

        }


        .toc-link:hover,
        .toc-link.active {

            color: #fff;

            background:
                rgba(189,0,0,.055);

        }


        .toc-link:hover {

            padding-left: 22px;

        }


        .toc-link.level-3:hover {

            padding-left: 39px;

        }


        .toc-link.active {

            font-weight: 650;

        }


        .toc-link.active::before {

            content: "";

            position: absolute;

            left: 0;

            top: 18%;
            bottom: 18%;

            width: 2px;

            background:
                var(--red-bright);

            box-shadow:
                0 0 9px
                rgba(224,0,0,.28);

        }


        /* =====================================================
           CATEGORY LIST
        ====================================================== */

        .wiki-category-list {

            display: flex;

            flex-direction: column;

        }


        .wiki-category-item {

            border-bottom:
                1px solid
                var(--border-soft);

            background:
                #0b0b0b;

        }


        .wiki-category-item:last-child {

            border-bottom: 0;

        }


        .wiki-category-summary {

            min-height: 58px;

            display: flex;

            align-items: center;

            justify-content: space-between;

            gap: 12px;

            padding:
                10px
                15px;

            color:
                rgba(255,255,255,.64);

            list-style: none;

            cursor: pointer;

            transition:
                color .18s ease,
                background .18s ease;

        }


        .wiki-category-summary::-webkit-details-marker {

            display: none;

        }


        .wiki-category-summary:hover {

            color: #fff;

            background:
                rgba(255,255,255,.025);

        }


        .wiki-category-item.current
        .wiki-category-summary {

            color: #fff;

            background:
                linear-gradient(
                    to right,
                    rgba(189,0,0,.075),
                    rgba(189,0,0,.025)
                );

        }


        .wiki-category-summary-left {

            min-width: 0;

            display: flex;

            align-items: center;

            gap: 11px;

        }


        .wiki-category-icon {

            width: 32px;
            height: 32px;

            flex:
                0
                0
                32px;

            display: flex;

            align-items: center;
            justify-content: center;

            color:
                var(--red-bright);

            border:
                1px solid
                rgba(189,0,0,.27);

            background:
                rgba(189,0,0,.055);

            font-size: .70rem;

        }


        .wiki-category-name {

            min-width: 0;

            overflow: hidden;

            color: inherit;

            font-size: .72rem;

            font-weight: 750;

            line-height: 1.35;

            text-overflow: ellipsis;

            white-space: nowrap;

        }


        .wiki-category-summary-right {

            display: flex;

            align-items: center;

            gap: 9px;

            flex-shrink: 0;

        }


        .wiki-category-count {

            min-width: 22px;

            color:
                rgba(255,255,255,.40);

            font-size: .58rem;

            font-weight: 800;

            text-align: right;

        }


        .wiki-category-chevron {

            color:
                rgba(255,255,255,.30);

            font-size: .64rem;

            transition:
                color .18s ease,
                transform .18s ease;

        }


        .wiki-category-summary:hover
        .wiki-category-chevron {

            color:
                var(--red-bright);

        }


        .wiki-category-item[open]
        .wiki-category-chevron {

            color:
                var(--red-bright);

            transform:
                rotate(180deg);

        }


        /* =====================================================
           CATEGORY ARTICLES
        ====================================================== */

        .wiki-category-articles {

            border-top:
                1px solid
                var(--border-soft);

            background:
                #080808;

        }


        .wiki-category-view-all {

            min-height: 44px;

            display: flex;

            align-items: center;

            justify-content: space-between;

            gap: 10px;

            padding:
                0
                16px;

            border-bottom:
                1px solid
                var(--border-soft);

            color:
                rgba(255,255,255,.44);

            font-size: .60rem;

            font-weight: 800;

            letter-spacing: .07em;

            text-transform: uppercase;

            transition:
                color .18s ease,
                background .18s ease;

        }


        .wiki-category-view-all:hover {

            color: #fff;

            background:
                rgba(189,0,0,.04);

        }


        .wiki-category-view-all i {

            color:
                var(--red-bright);

        }


        .wiki-sidebar-article {

            position: relative;

            min-height: 48px;

            display: grid;

            grid-template-columns:
                21px
                minmax(0, 1fr);

            align-items: center;

            gap: 9px;

            padding:
                11px
                15px;

            border-bottom:
                1px solid
                rgba(255,255,255,.035);

            color:
                rgba(255,255,255,.52);

            font-size: .68rem;

            font-weight: 500;

            line-height: 1.48;

            transition:
                color .15s ease,
                background .15s ease;

        }


        .wiki-sidebar-article:last-child {

            border-bottom: 0;

        }


        .wiki-sidebar-article:hover {

            color: #fff;

            background:
                rgba(255,255,255,.025);

        }


        .wiki-sidebar-article.active {

            color: #fff;

            font-weight: 650;

            background:
                rgba(189,0,0,.075);

        }


        .wiki-sidebar-article.active::before {

            content: "";

            position: absolute;

            top: 0;
            bottom: 0;
            left: 0;

            width: 2px;

            background:
                var(--red-bright);

        }


        .wiki-sidebar-article-marker {

            display: flex;

            align-items: center;
            justify-content: center;

            color:
                rgba(255,255,255,.25);

            font-size: .58rem;

        }


        .wiki-sidebar-article.active
        .wiki-sidebar-article-marker {

            color:
                var(--red-bright);

        }


        /* =====================================================
           SIDEBAR FOOTER
        ====================================================== */

        .wiki-nav-footer {

            display: grid;

            grid-template-columns:
                repeat(2, minmax(0, 1fr));

        }


        .wiki-nav-footer-link {

            min-height: 50px;

            display: flex;

            align-items: center;
            justify-content: center;

            gap: 7px;

            padding:
                0
                10px;

            color:
                rgba(255,255,255,.44);

            font-size: .60rem;

            font-weight: 800;

            letter-spacing: .055em;

            line-height: 1.35;

            text-align: center;

            text-transform: uppercase;

            transition:
                color .18s ease,
                background .18s ease;

        }


        .wiki-nav-footer-link:first-child {

            border-right:
                1px solid
                var(--border);

        }


        .wiki-nav-footer-link:hover {

            color: #fff;

            background:
                rgba(189,0,0,.05);

        }


        .wiki-nav-footer-link i {

            color:
                var(--red-bright);

            font-size: .70rem;

        }


        /* =====================================================
           ARTICLE CONTENT
        ====================================================== */

        .article-content {

            min-width: 0;

            color:
                rgba(255,255,255,.68);

            font-size: 1rem;

            line-height: 1.9;

        }


        .article-content > p:first-child {

            color:
                rgba(255,255,255,.80);

            font-size: 1.07rem;

            line-height: 1.85;

        }


        /* =====================================================
           ARTICLE HEADINGS
        ====================================================== */

        .article-content h2 {

            position: relative;

            margin:
                72px
                0
                24px;

            padding-top: 21px;

            border-top:
                1px solid
                var(--border);

            color: #fff;

            font-size:
                clamp(
                    1.8rem,
                    3vw,
                    2.7rem
                );

            font-weight: 900;

            line-height: 1.03;

            letter-spacing: -.04em;

        }


        .article-content h2:first-child {

            margin-top: 0;

            padding-top: 0;

            border-top: 0;

        }


        .article-content h2::before {

            content: "";

            position: absolute;

            top: -1px;
            left: 0;

            width: 50px;
            height: 1px;

            background:
                var(--red-bright);

        }


        .article-content h2:first-child::before {

            display: none;

        }


        .article-content h3 {

            margin:
                42px
                0
                15px;

            color:
                rgba(255,255,255,.94);

            font-size: 1.22rem;

            font-weight: 800;

            line-height: 1.3;

            letter-spacing: -.025em;

        }


        .article-content h4 {

            margin:
                31px
                0
                13px;

            color:
                rgba(255,255,255,.88);

            font-size: 1rem;

            font-weight: 800;

        }


        /* =====================================================
           BODY
        ====================================================== */

        .article-content p {

            margin:
                0
                0
                23px;

        }


        .article-content strong {

            color:
                rgba(255,255,255,.93);

            font-weight: 700;

        }


        .article-content a {

            color: #fff;

            text-decoration:
                underline;

            text-decoration-color:
                rgba(224,0,0,.65);

            text-underline-offset:
                3px;

        }


        .article-content a:hover {

            text-decoration-color:
                var(--red-bright);

        }


        /* =====================================================
           LISTS
        ====================================================== */

        .article-content ul,
        .article-content ol {

            margin:
                24px
                0
                30px;

            padding-left: 27px;

        }


        .article-content li {

            margin-bottom: 11px;

            padding-left: 5px;

        }


        .article-content li::marker {

            color:
                var(--red-bright);

        }


        /* =====================================================
           BLOCKQUOTES
        ====================================================== */

        .article-content blockquote {

            margin:
                35px
                0;

            padding:
                24px
                27px;

            border:
                1px solid
                var(--red-border);

            border-left:
                3px solid
                var(--red-bright);

            background:
                rgba(189,0,0,.055);

            color:
                rgba(255,255,255,.66);

            font-size: .93rem;

            line-height: 1.8;

        }


        .article-content blockquote p:last-child {

            margin-bottom: 0;

        }


        /* =====================================================
           CALLOUTS
        ====================================================== */

        .article-content .wiki-note,
        .article-content .wiki-warning,
        .article-content .wiki-important,
        .article-content .wiki-tip {

            position: relative;

            margin:
                32px
                0;

            padding:
                24px
                26px
                24px
                60px;

            border:
                1px solid
                var(--border);

            background:
                #0e0e0e;

            color:
                rgba(255,255,255,.63);

            font-size: .88rem;

            line-height: 1.75;

        }


        .article-content .wiki-note::before,
        .article-content .wiki-warning::before,
        .article-content .wiki-important::before,
        .article-content .wiki-tip::before {

            position: absolute;

            left: 22px;
            top: 24px;

            font-family:
                "bootstrap-icons";

            color:
                var(--red-bright);

            font-size: 1.05rem;

        }


        .article-content .wiki-note::before {

            content: "\F431";

        }


        .article-content .wiki-warning::before {

            content: "\F33A";

        }


        .article-content .wiki-important::before {

            content: "\F52A";

        }


        .article-content .wiki-tip::before {

            content: "\F46B";

        }


        .article-content .wiki-warning {

            border-color:
                rgba(255,177,0,.22);

            background:
                rgba(255,177,0,.035);

        }


        .article-content .wiki-warning::before {

            color:
                #e4a400;

        }


        /* =====================================================
           TABLES
        ====================================================== */

        .article-content table {

            width: 100%;

            margin:
                32px
                0;

            border-collapse:
                collapse;

            border:
                1px solid
                var(--border);

            background:
                #0d0d0d;

            font-size: .82rem;

        }


        .article-content th {

            padding:
                15px
                17px;

            border-bottom:
                1px solid
                var(--border);

            color:
                rgba(255,255,255,.82);

            background:
                rgba(255,255,255,.025);

            font-size: .66rem;

            font-weight: 800;

            letter-spacing: .07em;

            text-align: left;

            text-transform: uppercase;

        }


        .article-content td {

            padding:
                15px
                17px;

            border-bottom:
                1px solid
                var(--border-soft);

            color:
                rgba(255,255,255,.55);

            vertical-align: top;

        }


        .article-content tr:last-child td {

            border-bottom: 0;

        }


        /* =====================================================
           CODE
        ====================================================== */

        .article-content code {

            padding:
                2px
                6px;

            border:
                1px solid
                rgba(255,255,255,.07);

            background:
                rgba(255,255,255,.045);

            color:
                rgba(255,255,255,.86);

            font-size: .87em;

        }


        .article-content pre {

            margin:
                32px
                0;

            padding: 24px;

            overflow-x: auto;

            border:
                1px solid
                var(--border);

            background:
                #070707;

            color:
                rgba(255,255,255,.76);

            font-size: .80rem;

            line-height: 1.72;

        }


        .article-content pre code {

            padding: 0;

            border: 0;

            background:
                transparent;

        }


        /* =====================================================
           IMAGES / HR
        ====================================================== */

        .article-content hr {

            margin:
                52px
                0;

            border: 0;

            border-top:
                1px solid
                var(--border);

            opacity: 1;

        }


        .article-content img {

            display: block;

            margin:
                32px
                auto;

            border:
                1px solid
                var(--border);

        }


        /* =====================================================
           ARTICLE END
        ====================================================== */

        .article-end {

            margin-top: 72px;

            padding-top: 30px;

            border-top:
                1px solid
                var(--border);

        }


        .article-end-label {

            display: flex;

            align-items: center;

            gap: 12px;

            color:
                rgba(255,255,255,.25);

            font-size: .58rem;

            font-weight: 800;

            letter-spacing: .10em;

            text-transform: uppercase;

        }


        .article-end-label::before {

            content: "";

            width: 32px;
            height: 1px;

            background:
                var(--red-bright);

        }


        /* =====================================================
           PREVIOUS / NEXT
        ====================================================== */

        .article-navigation {

            display: grid;

            grid-template-columns:
                repeat(
                    2,
                    minmax(0, 1fr)
                );

            gap: 14px;

            margin-top: 28px;

        }


        .article-nav-card {

            min-height: 118px;

            display: flex;

            flex-direction: column;

            padding:
                21px
                22px;

            border:
                1px solid
                var(--border);

            background:
                #0d0d0d;

            transition:
                border-color .18s ease,
                background .18s ease,
                transform .18s ease;

        }


        .article-nav-card:hover {

            transform:
                translateY(-2px);

            border-color:
                var(--red-border);

            background:
                rgba(189,0,0,.035);

        }


        .article-nav-label {

            color:
                rgba(255,255,255,.28);

            font-size: .56rem;

            font-weight: 800;

            letter-spacing: .10em;

            text-transform: uppercase;

        }


        .article-nav-title {

            margin-top: 10px;

            color:
                rgba(255,255,255,.78);

            font-size: .78rem;

            font-weight: 750;

            line-height: 1.48;

        }


        .article-nav-arrow {

            margin-top: auto;

            padding-top: 11px;

            color:
                var(--red-bright);

            font-size: .68rem;

        }


        .article-nav-card.next {

            text-align: right;

        }


        /* =====================================================
           RELATED
        ====================================================== */

        .related-section {

            padding:
                84px
                0;

            border-top:
                1px solid
                var(--border);

            background:
                var(--bg-dark);

        }


        .related-heading {

            display: flex;

            align-items: flex-end;

            justify-content: space-between;

            gap: 30px;

            margin-bottom: 34px;

        }


        .related-kicker {

            display: flex;

            align-items: center;

            gap: 10px;

            color:
                var(--red-bright);

            font-size: .62rem;

            font-weight: 800;

            letter-spacing: .17em;

            text-transform: uppercase;

        }


        .related-kicker::before {

            content: "";

            width: 33px;
            height: 1px;

            background:
                var(--red-bright);

        }


        .related-title {

            margin-top: 12px;

            color: #fff;

            font-size:
                clamp(
                    1.9rem,
                    3vw,
                    3rem
                );

            font-weight: 900;

            line-height: .96;

            letter-spacing: -.04em;

            text-transform: uppercase;

        }


        .related-category-link {

            display: inline-flex;

            align-items: center;

            gap: 7px;

            color:
                rgba(255,255,255,.40);

            font-size: .60rem;

            font-weight: 800;

            letter-spacing: .07em;

            text-transform: uppercase;

        }


        .related-category-link:hover {

            color: #fff;

        }


        .related-grid {

            display: grid;

            grid-template-columns:
                repeat(
                    3,
                    minmax(0, 1fr)
                );

            gap: 14px;

        }


        .related-card {

            min-height: 190px;

            display: flex;

            flex-direction: column;

            padding: 25px;

            border:
                1px solid
                var(--border);

            background:
                #0d0d0d;

            transition:
                transform .18s ease,
                border-color .18s ease,
                background .18s ease;

        }


        .related-card:hover {

            transform:
                translateY(-3px);

            border-color:
                var(--red-border);

            background:
                rgba(189,0,0,.035);

        }


        .related-card-category {

            color:
                var(--red-bright);

            font-size: .55rem;

            font-weight: 800;

            letter-spacing: .10em;

            text-transform: uppercase;

        }


        .related-card-title {

            margin-top: 13px;

            color: #fff;

            font-size: .90rem;

            font-weight: 800;

            line-height: 1.45;

        }


        .related-card-copy {

            margin-top: 8px;

            color:
                rgba(255,255,255,.36);

            font-size: .72rem;

            line-height: 1.62;

        }


        .related-card-link {

            display: flex;

            align-items: center;

            gap: 6px;

            margin-top: auto;

            padding-top: 17px;

            color:
                rgba(255,255,255,.39);

            font-size: .57rem;

            font-weight: 800;

            letter-spacing: .07em;

            text-transform: uppercase;

        }


        .related-card:hover
        .related-card-link {

            color: #fff;

        }


        /* =====================================================
           WIKI TABLES
        ====================================================== */

        .wiki-table {

            --bs-table-bg: transparent;
            --bs-table-color: #d7d7d7;
            --bs-table-border-color: rgba(255,255,255,.09);

            --bs-table-striped-bg:
                rgba(255,255,255,.025);

            --bs-table-striped-color:
                #d7d7d7;

            --bs-table-hover-bg:
                rgba(189,0,0,.08);

            --bs-table-hover-color:
                #fff;

            width: 100%;

            margin:
                1.9rem
                0;

            color:
                #d7d7d7;

            background:
                transparent;

            border-collapse:
                collapse;

        }


        .wiki-table thead {

            background:
                rgba(189,0,0,.12);

        }


        .wiki-table thead th {

            padding:
                1rem
                1.1rem;

            color: #fff;

            font-size: .78rem;

            font-weight: 700;

            letter-spacing: .08em;

            text-transform: uppercase;

            border-bottom:
                1px solid
                rgba(189,0,0,.45);

            background:
                transparent;

            white-space: nowrap;

        }


        .wiki-table tbody tr {

            background:
                transparent;

            transition:
                background .18s ease;

        }


        .wiki-table tbody tr:nth-child(even) {

            background:
                rgba(255,255,255,.018);

        }


        .wiki-table tbody tr:hover {

            background:
                rgba(189,0,0,.07);

        }


        .wiki-table tbody td {

            padding:
                .95rem
                1.1rem;

            color:
                #c4c4c4;

            background:
                transparent;

            border-bottom:
                1px solid
                rgba(255,255,255,.07);

            vertical-align: middle;

        }


        .wiki-table tbody td:first-child {

            color: #fff;

        }


        .wiki-table tbody td strong {

            color: #fff;

            font-weight: 700;

        }


        .wiki-table tbody tr:last-child td {

            border-bottom: 0;

        }


        .table-responsive {

            margin:
                1.9rem
                0;

            border:
                1px solid
                rgba(255,255,255,.08);

            border-radius: 0;

            overflow-x: auto;

            background:
                rgba(255,255,255,.015);

        }


        .table-responsive
        .wiki-table {

            margin: 0;

        }


        /* =====================================================
           RESPONSIVE
        ====================================================== */

        @media (max-width: 1199.98px) {

            .article-layout {

                grid-template-columns:
                    310px
                    minmax(0, 820px);

                gap: 45px;

            }

        }


        @media (max-width: 991.98px) {

            .article-layout {

                grid-template-columns:
                    1fr;

            }


            .article-toc {

                display: none;

            }


            .mobile-article-nav {

                display: block;

            }


            .article-content {

                max-width: 880px;

                margin-inline: auto;

            }


            .related-grid {

                grid-template-columns:
                    repeat(
                        2,
                        minmax(0, 1fr)
                    );

            }

        }


        @media (max-width: 767.98px) {

            .article-hero {

                padding:
                    145px
                    0
                    60px;

            }


            .article-title {

                font-size:
                    clamp(
                        2.6rem,
                        12vw,
                        4.4rem
                    );

            }


            .article-description {

                font-size: .94rem;

            }


            .article-section {

                padding:
                    58px
                    0
                    78px;

            }


            .article-content {

                font-size: .95rem;

                line-height: 1.84;

            }


            .article-content > p:first-child {

                font-size: 1rem;

            }


            .article-content h2 {

                margin-top: 57px;

            }


            .article-navigation {

                grid-template-columns:
                    1fr;

            }


            .article-nav-card.next {

                text-align: left;

            }


            .related-heading {

                align-items:
                    flex-start;

                flex-direction:
                    column;

            }


            .related-grid {

                grid-template-columns:
                    1fr;

            }


            .wiki-table {

                min-width: 650px;

            }


            .wiki-table thead th,
            .wiki-table tbody td {

                padding:
                    .85rem
                    .95rem;

            }

        }


        @media (max-width: 480px) {

            .article-meta-divider {

                display: none;

            }


            .article-meta {

                flex-direction: column;

                align-items: flex-start;

                gap: 8px;

            }


            .article-content table {

                display: table;

                white-space: normal;

            }

        }


        /* =====================================================
           MOBILE / SMALL-SCREEN HARDENING
        ====================================================== */

        @media (max-width: 767.98px) {

            html,
            body {

                max-width: 100%;

                overflow-x: clip;

            }


            .site-container {

                width:
                    calc(100% - 24px);

            }


            .article-hero {

                padding:
                    118px
                    0
                    42px;

            }


            .article-hero-inner,
            .article-title,
            .article-description,
            .article-content {

                width: 100%;

                max-width: 100%;

                min-width: 0;

            }


            .article-breadcrumb {

                gap:
                    7px
                    8px;

                margin-bottom: 21px;

                font-size: .58rem;

                line-height: 1.55;

                overflow-wrap: anywhere;

            }


            .article-category {

                gap: 9px;

                font-size: .61rem;

                letter-spacing: .13em;

            }


            .article-category-icon {

                width: 29px;
                height: 29px;

                flex:
                    0
                    0
                    29px;

            }


            .article-title {

                margin-top: 16px;

                font-size:
                    clamp(
                        2.05rem,
                        10vw,
                        3.35rem
                    );

                line-height: .98;

                letter-spacing: -.045em;

                overflow-wrap: anywhere;

                word-break: normal;

                hyphens: auto;

            }


            .article-description {

                margin-top: 19px;

                font-size: .91rem;

                line-height: 1.67;

            }


            .article-meta {

                margin-top: 22px;

                gap:
                    9px
                    15px;

                font-size: .58rem;

                line-height: 1.45;

            }


            .mobile-article-nav-inner {

                padding:
                    10px
                    0;

                scroll-padding-inline: 12px;

                -webkit-overflow-scrolling: touch;

            }


            .mobile-article-link {

                min-height: 40px;

                padding:
                    0
                    12px;

                font-size: .62rem;

            }


            .article-section {

                padding:
                    38px
                    0
                    58px;

            }


            .article-layout {

                width: 100%;

                min-width: 0;

            }


            .article-content {

                overflow-wrap: break-word;

                word-wrap: break-word;

                font-size: .94rem;

                line-height: 1.76;

            }


            .article-content > * {

                max-width: 100%;

            }


            .article-content > p:first-child {

                font-size: .98rem;

                line-height: 1.74;

            }


            .article-content h2 {

                margin:
                    46px
                    0
                    18px;

                padding-top: 18px;

                font-size:
                    clamp(
                        1.48rem,
                        7.2vw,
                        2.05rem
                    );

                line-height: 1.08;

                letter-spacing: -.035em;

                overflow-wrap: anywhere;

            }


            .article-content h3 {

                margin:
                    32px
                    0
                    13px;

                font-size: 1.10rem;

                line-height: 1.34;

                overflow-wrap: anywhere;

            }


            .article-content h4 {

                margin:
                    27px
                    0
                    12px;

                font-size: .96rem;

            }


            .article-content p {

                margin-bottom: 19px;

            }


            .article-content ul,
            .article-content ol {

                margin:
                    20px
                    0
                    25px;

                padding-left: 21px;

            }


            .article-content li {

                margin-bottom: 10px;

                padding-left: 2px;

            }


            .article-content blockquote {

                margin:
                    27px
                    0;

                padding:
                    19px
                    18px;

                font-size: .89rem;

                line-height: 1.72;

            }


            .article-content .wiki-note,
            .article-content .wiki-warning,
            .article-content .wiki-important,
            .article-content .wiki-tip {

                margin:
                    25px
                    0;

                padding:
                    48px
                    18px
                    19px;

                font-size: .86rem;

                line-height: 1.68;

            }


            .article-content .wiki-note::before,
            .article-content .wiki-warning::before,
            .article-content .wiki-important::before,
            .article-content .wiki-tip::before {

                left: 18px;
                top: 17px;

            }


            .article-content pre {

                max-width: 100%;

                margin:
                    25px
                    0;

                padding: 17px;

                font-size: .74rem;

                line-height: 1.62;

                -webkit-overflow-scrolling: touch;

            }


            .article-content code {

                overflow-wrap: anywhere;

            }


            .article-content img {

                max-width: 100%;

                margin:
                    25px
                    auto;

            }


            .wiki-table-wrap,
            .table-responsive {

                width: 100%;

                max-width: 100%;

                margin:
                    25px
                    0;

                overflow-x: auto;

                overscroll-behavior-inline: contain;

                -webkit-overflow-scrolling: touch;

            }


            .wiki-table-wrap .wiki-table,
            .table-responsive .wiki-table,
            .article-content > table {

                min-width: 560px;

                margin: 0;

            }


            .wiki-table thead th,
            .wiki-table tbody td,
            .article-content th,
            .article-content td {

                padding:
                    .78rem
                    .82rem;

                font-size: .76rem;

                line-height: 1.45;

                white-space: normal;

            }


            .wiki-table thead th {

                font-size: .63rem;

            }


            .article-end {

                margin-top: 50px;

                padding-top: 24px;

            }


            .article-navigation {

                gap: 10px;

                margin-top: 22px;

            }


            .article-nav-card {

                min-height: 104px;

                padding:
                    18px
                    17px;

            }


            .article-nav-title {

                font-size: .76rem;

                overflow-wrap: anywhere;

            }


            .related-section {

                padding:
                    56px
                    0;

            }


            .related-heading {

                gap: 18px;

                margin-bottom: 25px;

            }


            .related-title {

                font-size:
                    clamp(
                        1.65rem,
                        8vw,
                        2.3rem
                    );

                line-height: 1;

            }


            .related-category-link {

                font-size: .58rem;

            }


            .related-grid {

                gap: 10px;

            }


            .related-card {

                min-height: 0;

                padding: 20px;

            }


            .related-card-title,
            .related-card-copy {

                overflow-wrap: anywhere;

            }

        }


        @media (max-width: 480px) {

            .site-container {

                width:
                    calc(100% - 20px);

            }


            .article-hero {

                padding:
                    104px
                    0
                    36px;

            }


            .article-title {

                font-size:
                    clamp(
                        1.9rem,
                        9.7vw,
                        2.7rem
                    );

                line-height: 1;

            }


            .article-description {

                font-size: .88rem;

            }


            .article-meta {

                width: 100%;

            }


            .article-meta-item {

                max-width: 100%;

                white-space: normal;

            }


            .mobile-article-link {

                max-width: 78vw;

                overflow: hidden;

                text-overflow: ellipsis;

            }


            .article-section {

                padding:
                    32px
                    0
                    48px;

            }


            .article-content {

                font-size: .92rem;

                line-height: 1.72;

            }


            .article-content h2 {

                margin-top: 40px;

                font-size:
                    clamp(
                        1.4rem,
                        7.3vw,
                        1.82rem
                    );

            }


            .article-content h3 {

                font-size: 1.04rem;

            }


            .article-content ul,
            .article-content ol {

                padding-left: 19px;

            }


            .wiki-table-wrap .wiki-table,
            .table-responsive .wiki-table,
            .article-content > table {

                min-width: 500px;

            }


            .article-navigation {

                grid-template-columns: 1fr;

            }


            .article-nav-card.next {

                text-align: left;

            }


            .related-section {

                padding:
                    48px
                    0;

            }

        }
