.wg-help-article-page {
        --wg-border: rgba(148, 163, 184, .16);
        --wg-border-strong: rgba(96, 165, 250, .28);
        --wg-muted: #94a3b8;
        --wg-blue: #60a5fa;
        --wg-green: #34d399;
    }

    .wg-help-article-page * {
        box-sizing: border-box;
    }

    /* ============================================================
       Header
    ============================================================ */

    .wg-help-article-head {
        padding-top: 3.2rem;
        padding-bottom: 1.6rem;
    }

    .wg-help-article-head-inner {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1.5rem;
    }

    .wg-help-article-title {
        max-width: 820px;
    }

    .wg-help-article-title h1 {
        margin: .45rem 0 .65rem;
        font-size: clamp(2rem, 5vw, 3.4rem);
        line-height: 1.08;
        letter-spacing: -.04em;
    }

    .wg-help-article-title > p {
        max-width: 720px;
        margin: 0;
        color: var(--wg-muted);
        font-size: 1rem;
        line-height: 1.65;
    }

    /* ============================================================
       Layout
    ============================================================ */

    .wg-help-layout {
        display: grid;
        grid-template-columns: 280px minmax(0, 1fr);
        gap: 1.4rem;
        align-items: start;
        padding-bottom: 4.5rem;
    }

    /* ============================================================
       Sidebar
    ============================================================ */

    .wg-help-sidebar {
        position: sticky;
        top: 90px;
        overflow: hidden;
        border: 1px solid var(--wg-border);
        border-radius: 20px;
        background: rgba(15, 23, 42, .25);
    }

    .wg-help-sidebar-head {
        padding: 1.15rem;
        border-bottom: 1px solid var(--wg-border);
    }

    .wg-help-sidebar-head h3 {
        margin: .35rem 0 0;
        font-size: 1.05rem;
    }

    .wg-help-sidebar-nav {
        padding: .6rem;
    }

    .wg-help-sidebar-group {
        border-radius: 12px;
        overflow: hidden;
    }

    .wg-help-sidebar-group + .wg-help-sidebar-group {
        margin-top: .35rem;
    }

    .wg-help-sidebar-toggle {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;

        padding: .75rem .8rem;

        border: 0;
        border-radius: 11px;

        background: transparent;
        color: inherit;

        text-align: left;
        cursor: pointer;

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

    .wg-help-sidebar-toggle:hover {
        background: rgba(59, 130, 246, .06);
    }

    .wg-help-sidebar-group.active > .wg-help-sidebar-toggle {
        background: rgba(59, 130, 246, .08);
        color: var(--wg-blue);
    }

    .wg-help-sidebar-toggle-main {
        display: flex;
        align-items: center;
        gap: .55rem;
        min-width: 0;
        font-size: .86rem;
        font-weight: 800;
    }

    .wg-help-sidebar-icon {
        flex: 0 0 auto;
    }

    .wg-help-sidebar-chevron {
        display: inline-block;
        color: var(--wg-muted);
        transition: transform .15s ease;
    }

    .wg-help-sidebar-group.is-open .wg-help-sidebar-chevron {
        transform: rotate(180deg);
    }

    .wg-help-sidebar-collapse {
        display: none;
        padding: .2rem .4rem .6rem;
    }

    .wg-help-sidebar-group.is-open .wg-help-sidebar-collapse {
        display: block;
    }

    .wg-help-sidebar-children {
        display: grid;
        gap: .3rem;
    }

    .wg-help-sidebar-link {
        display: flex;
        justify-content: space-between;
        gap: .7rem;

        padding: .65rem .7rem;

        border-radius: 9px;

        color: inherit;
        text-decoration: none;

        font-size: .78rem;

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

    .wg-help-sidebar-link:hover {
        background: rgba(59, 130, 246, .06);
    }

    .wg-help-sidebar-link.active {
        background: rgba(59, 130, 246, .1);
        color: var(--wg-blue);
        font-weight: 800;
    }

    .wg-help-sidebar-link small {
        flex: 0 0 auto;
        color: var(--wg-muted);
        font-size: .66rem;
    }

    .wg-help-game-pills {
        display: none;
        flex-wrap: wrap;
        gap: .3rem;
        padding: .35rem .6rem .65rem;
    }

    .wg-help-game-pills.is-visible {
        display: flex;
    }

    .wg-help-game-pill {
        padding: .28rem .48rem;

        border: 1px solid var(--wg-border);
        border-radius: 999px;

        color: var(--wg-muted);
        text-decoration: none;

        font-size: .65rem;
    }

    .wg-help-game-pill:hover,
    .wg-help-game-pill.active {
        border-color: rgba(96, 165, 250, .3);
        background: rgba(59, 130, 246, .08);
        color: var(--wg-blue);
    }

    /* ============================================================
       Article
    ============================================================ */

    .wg-help-article {
        min-width: 0;
        overflow: hidden;

        border: 1px solid var(--wg-border);
        border-radius: 22px;

        background: rgba(15, 23, 42, .24);
    }

    .wg-help-article-meta {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: .55rem;

        padding: 1.1rem 1.35rem;

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

    .wg-help-category-pill {
        display: inline-flex;
        align-items: center;

        padding: .32rem .58rem;

        border: 1px solid rgba(96, 165, 250, .22);
        border-radius: 999px;

        background: rgba(59, 130, 246, .07);
        color: var(--wg-blue);

        font-size: .7rem;
        font-weight: 800;
    }

    .wg-help-updated {
        color: var(--wg-muted);
        font-size: .72rem;
    }

    /* ============================================================
       Article typography
    ============================================================ */

    .wg-help-article-content {
        padding: 2rem 2.1rem;
        line-height: 1.72;
    }

    .wg-help-article-content > *:first-child {
        margin-top: 0;
    }

    .wg-help-article-content > *:last-child {
        margin-bottom: 0;
    }

    .wg-help-article-content h2 {
        margin: 2.2rem 0 .8rem;
        font-size: 1.55rem;
        letter-spacing: -.02em;
    }

    .wg-help-article-content h3 {
        margin: 1.7rem 0 .65rem;
        font-size: 1.18rem;
    }

    .wg-help-article-content h4 {
        margin: 1.4rem 0 .55rem;
        font-size: 1rem;
    }

    .wg-help-article-content p {
        margin: 0 0 1rem;
        color: var(--text);
    }

    .wg-help-article-content ul,
    .wg-help-article-content ol {
        margin: .8rem 0 1.2rem;
        padding-left: 1.5rem;
    }

    .wg-help-article-content li {
        margin: .4rem 0;
    }

    .wg-help-article-content a {
        color: #38bdf8;
        text-decoration: underline;
        text-underline-offset: .2rem;
    }

    .wg-help-article-content img {
        max-width: 100%;
        height: auto;

        margin: 1.25rem auto;

        border: 1px solid var(--wg-border);
        border-radius: 14px;

        display: block;
    }

    .wg-help-article-content blockquote {
        margin: 1.25rem 0;
        padding: 1rem 1.1rem;

        border-left: 3px solid var(--wg-blue);
        border-radius: 0 12px 12px 0;

        background: rgba(59, 130, 246, .06);

        color: var(--wg-muted);
    }

    .wg-help-article-content code {
        padding: .15rem .35rem;
        border: 1px solid var(--wg-border);
        border-radius: 5px;
        background: rgba(15, 23, 42, .45);
        font-size: .88em;
    }

    .wg-help-article-content pre {
        max-width: 100%;
        overflow-x: auto;

        margin: 1rem 0;
        padding: 1rem;

        border: 1px solid var(--wg-border);
        border-radius: 12px;

        background: rgba(2, 6, 23, .55);
    }

    .wg-help-article-content pre code {
        padding: 0;
        border: 0;
        background: transparent;
    }

    .wg-help-article-content table {
        width: 100%;
        margin: 1.2rem 0;
        border-collapse: collapse;
    }

    .wg-help-article-content th,
    .wg-help-article-content td {
        padding: .7rem .8rem;
        border: 1px solid var(--wg-border);
        text-align: left;
        vertical-align: top;
    }

    .wg-help-article-content th {
        background: rgba(148, 163, 184, .05);
    }

    /* ============================================================
       Support
    ============================================================ */

    .wg-help-support-card {
        margin: 0 1.35rem 1.35rem;
        padding: 1.25rem;

        border: 1px solid var(--wg-border-strong);
        border-radius: 17px;

        background:
            radial-gradient(
                circle at right center,
                rgba(59, 130, 246, .08),
                transparent 40%
            ),
            rgba(15, 23, 42, .24);
    }

    .wg-help-support-card h3 {
        margin: 0 0 .35rem;
        font-size: 1.05rem;
    }

    .wg-help-support-card p {
        margin: 0;
        color: var(--wg-muted);
        font-size: .84rem;
        line-height: 1.5;
    }

    .wg-help-support-actions {
        display: flex;
        flex-wrap: wrap;
        gap: .6rem;
        margin-top: 1rem;
    }

    /* ============================================================
       Related
    ============================================================ */

    .wg-help-related {
        padding: 1.35rem;
        border-top: 1px solid var(--wg-border);
    }

    .wg-help-related h3 {
        margin: 0 0 .9rem;
        font-size: 1.05rem;
    }

    .wg-help-related-grid {
        display: grid;
        grid-template-columns: repeat(
            auto-fit,
            minmax(min(100%, 220px), 1fr)
        );
        gap: .65rem;
    }

    .wg-help-related-grid a {
        position: relative;
        padding: .8rem 2rem .8rem .85rem;

        border: 1px solid var(--wg-border);
        border-radius: 12px;

        background: rgba(15, 23, 42, .18);

        color: inherit;
        text-decoration: none;

        font-size: .8rem;
        font-weight: 700;

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

    .wg-help-related-grid a::after {
        content: "→";
        position: absolute;
        right: .75rem;
        top: 50%;
        transform: translateY(-50%);
        color: var(--wg-blue);
    }

    .wg-help-related-grid a:hover {
        transform: translateY(-1px);
        border-color: rgba(96, 165, 250, .28);
        background: rgba(59, 130, 246, .05);
    }

    /* ============================================================
       Mobile category browser
    ============================================================ */

    .wg-help-mobile-sidebar-toggle {
        display: none;
        width: 100%;
        margin-bottom: 1rem;
    }

    /* ============================================================
       Responsive
    ============================================================ */

    @media (max-width: 900px) {
        .wg-help-layout {
            grid-template-columns: 1fr;
        }

        .wg-help-sidebar {
            position: static;
            display: none;
        }

        .wg-help-sidebar.mobile-open {
            display: block;
        }

        .wg-help-mobile-sidebar-toggle {
            display: inline-flex;
        }
    }

    @media (max-width: 640px) {
        .wg-help-article-head {
            padding-top: 2.4rem;
        }

        .wg-help-article-head-inner {
            flex-direction: column;
        }

        .wg-help-article-head-inner > .btn {
            width: 100%;
        }

        .wg-help-article {
            border-radius: 17px;
        }

        .wg-help-article-content {
            padding: 1.3rem 1.1rem;
            font-size: .94rem;
        }

        .wg-help-article-meta {
            padding: .9rem 1rem;
        }

        .wg-help-support-card {
            margin: 0 1rem 1rem;
        }

        .wg-help-support-actions {
            flex-direction: column;
        }

        .wg-help-support-actions .btn {
            width: 100%;
        }

        .wg-help-related {
            padding: 1rem;
        }

        .wg-help-article-content table {
            display: block;
            overflow-x: auto;
        }
    }