
        :root {
            --gp-v41-purple: #4b1684;
            --gp-v41-violet: #920ab6;
            --gp-v41-pink: #e10b79;
            --gp-v41-cyan: #0ba6b8;
            --gp-v41-lime: #d8f512;
            --gp-v41-heart: #e10b45;
            --gp-v41-ink: #20142d;
            --gp-v41-muted: rgba(32,20,45,.68);
            --gp-v41-card: rgba(255,255,255,.92);
            --gp-v41-border: rgba(75,22,132,.10);
            --gp-v41-shadow: 0 24px 60px rgba(74,18,107,.10);
        }

        .gp-blog-detail-page {
            direction: rtl;
            overflow: hidden;
        }

        .gp-blog-detail-hero {
            position: relative;
            margin: 22px auto 28px;
            padding: clamp(28px, 4vw, 58px);
            border-radius: 42px;
            background: radial-gradient(circle at 14% 10%, rgba(216,245,18,.25), transparent 24%), radial-gradient(circle at 88% 24%, rgba(255,255,255,.15), transparent 22%), linear-gradient(135deg, #4b1684 0%, #920ab6 54%, #e10b79 100%);
            color: #fff;
            box-shadow: 0 32px 80px rgba(74,18,107,.20);
            isolation: isolate;
            overflow: hidden;
        }

            .gp-blog-detail-hero::before,
            .gp-blog-detail-hero::after {
                content: "";
                position: absolute;
                border-radius: 999px;
                pointer-events: none;
                z-index: -1;
            }

            .gp-blog-detail-hero::before {
                width: 270px;
                height: 270px;
                left: -96px;
                top: -92px;
                background: rgba(255,255,255,.13);
                animation: gpV41Blob 10s ease-in-out infinite alternate;
            }

            .gp-blog-detail-hero::after {
                width: 340px;
                height: 340px;
                right: -130px;
                bottom: -172px;
                background: rgba(11,166,184,.22);
                animation: gpV41Blob 12s ease-in-out infinite alternate-reverse;
            }

        @@keyframes gpV41Blob {
            to {
                transform: translate3d(24px, 18px, 0) scale(1.06);
            }
        }

        .gp-blog-detail-hero-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(260px, .38fr);
            gap: clamp(20px, 4vw, 46px);
            align-items: center;
        }

        .gp-blog-detail-kicker {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 38px;
            padding: 0 14px;
            border-radius: 999px;
            background: rgba(255,255,255,.16);
            border: 1px solid rgba(255,255,255,.20);
            color: #fff !important;
            font-weight: 950;
            backdrop-filter: blur(14px);
        }

        .gp-blog-detail-hero h1 {
            margin: 16px 0 12px;
            color: #fff !important;
            font-size: clamp(30px, 4.6vw, 62px);
            font-weight: 1000;
            line-height: 1.42 !important;
            letter-spacing: -.02em;
        }

        .gp-blog-detail-hero p {
            max-width: 820px;
            margin: 0;
            color: rgba(255,255,255,.90) !important;
            font-size: clamp(14px, 1.2vw, 18px);
            font-weight: 850;
            line-height: 2.1;
        }

        .gp-blog-detail-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 24px;
        }

            .gp-blog-detail-actions a,
            .gp-blog-save-btn {
                min-height: 48px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                padding: 0 18px;
                border-radius: 999px;
                text-decoration: none !important;
                font-weight: 950;
                border: 0;
                cursor: pointer;
            }

                .gp-blog-detail-actions a:first-child {
                    background: #fff;
                    color: #4b1684 !important;
                    box-shadow: 0 18px 38px rgba(0,0,0,.14);
                }

                .gp-blog-detail-actions a:nth-child(2),
                .gp-blog-save-btn {
                    background: rgba(255,255,255,.13);
                    border: 1px solid rgba(255,255,255,.24);
                    color: #fff !important;
                }

                    .gp-blog-save-btn .gp-heart-icon {
                        color: #ff3f72 !important;
                    }

        .gp-blog-hero-stats {
            display: grid;
            gap: 12px;
        }

        .gp-blog-hero-stat {
            min-height: 92px;
            padding: 18px;
            border-radius: 28px;
            background: rgba(255,255,255,.16);
            border: 1px solid rgba(255,255,255,.20);
            backdrop-filter: blur(14px);
        }

            .gp-blog-hero-stat strong {
                display: block;
                color: #fff !important;
                font-size: 28px;
                font-weight: 1000;
                line-height: 1;
            }

            .gp-blog-hero-stat span {
                display: block;
                margin-top: 8px;
                color: rgba(255,255,255,.82) !important;
                font-weight: 850;
                line-height: 1.8;
            }

        .gp-blog-detail-shell {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
            gap: 22px;
            align-items: start;
            margin-bottom: 42px;
        }

        .gp-blog-main-card,
        .gp-blog-side-card,
        .gp-blog-comments-card {
            border-radius: 34px;
            background: var(--gp-v41-card);
            border: 1px solid var(--gp-v41-border);
            box-shadow: var(--gp-v41-shadow);
            backdrop-filter: blur(18px);
            overflow: hidden;
        }

        .gp-blog-main-media {
            position: relative;
            background: #101624;
        }

            .gp-blog-main-media img,
            .gp-blog-main-media video {
                display: block;
                width: 100%;
                max-height: 520px;
                object-fit: cover;
                background: #101624;
            }

        .gp-blog-main-body {
            padding: clamp(18px, 2.5vw, 34px);
        }

        .gp-blog-info-strip {
            display: flex;
            flex-wrap: wrap;
            gap: 9px;
            margin-bottom: 18px;
        }

            .gp-blog-info-strip span {
                min-height: 34px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 7px;
                padding: 0 12px;
                border-radius: 999px;
                background: rgba(146,10,182,.08);
                color: #6420a0 !important;
                font-size: 12px;
                font-weight: 900;
            }

        .gp-blog-content {
            color: var(--gp-v41-ink) !important;
            font-size: 16px;
            font-weight: 650;
            line-height: 2.25;
        }

            .gp-blog-content * {
                max-width: 100%;
            }

            .gp-blog-content p,
            .gp-blog-content li {
                color: var(--gp-v41-muted) !important;
                line-height: 2.25 !important;
                font-size: 16px !important;
            }

            .gp-blog-content h2,
            .gp-blog-content h3,
            .gp-blog-content h4 {
                color: var(--gp-v41-ink) !important;
                font-weight: 1000 !important;
                line-height: 1.7 !important;
                margin-top: 28px !important;
            }

            .gp-blog-content img {
                height: auto !important;
                border-radius: 24px;
                box-shadow: 0 16px 38px rgba(74,18,107,.10);
            }

            .gp-blog-content a {
                color: #7b16a4 !important;
                font-weight: 950 !important;
                text-decoration: none !important;
                border-bottom: 1px dashed rgba(146,10,182,.34);
            }

            .gp-blog-content blockquote {
                position: relative;
                margin: 24px 0 !important;
                padding: 18px 22px !important;
                border: 0 !important;
                border-right: 5px solid #920ab6 !important;
                border-radius: 24px !important;
                background: linear-gradient(135deg, rgba(146,10,182,.08), rgba(225,11,121,.06)) !important;
                color: var(--gp-v41-ink) !important;
                font-weight: 850 !important;
                line-height: 2.1 !important;
            }

            .gp-blog-content ul,
            .gp-blog-content ol {
                padding-right: 22px !important;
                margin: 18px 0 !important;
            }

            .gp-blog-content .gp-table-scroll {
                width: 100%;
                max-width: 100%;
                margin: 22px 0;
                overflow-x: auto;
                overflow-y: hidden;
                border-radius: 24px;
                border: 1px solid rgba(75,22,132,.10);
                background: rgba(255,255,255,.72);
                box-shadow: 0 18px 42px rgba(74,18,107,.09);
                -webkit-overflow-scrolling: touch;
            }

                .gp-blog-content .gp-table-scroll::-webkit-scrollbar {
                    height: 8px;
                }

                .gp-blog-content .gp-table-scroll::-webkit-scrollbar-thumb {
                    border-radius: 999px;
                    background: linear-gradient(90deg, #4b1684, #920ab6, #e10b79);
                }

            .gp-blog-content table {
                width: 100% !important;
                min-width: 640px;
                margin: 0 !important;
                border-collapse: separate !important;
                border-spacing: 0 !important;
                background: #fff !important;
                direction: rtl !important;
                overflow: hidden;
            }

                .gp-blog-content table th,
                .gp-blog-content table td {
                    padding: 14px 16px !important;
                    border: 0 !important;
                    border-bottom: 1px solid rgba(75,22,132,.09) !important;
                    border-left: 1px solid rgba(75,22,132,.06) !important;
                    color: var(--gp-v41-ink) !important;
                    font-size: 14px !important;
                    font-weight: 800 !important;
                    line-height: 1.9 !important;
                    vertical-align: middle !important;
                }

                .gp-blog-content table th,
                .gp-blog-content table thead td {
                    background: linear-gradient(135deg, rgba(75,22,132,.10), rgba(146,10,182,.08)) !important;
                    color: #4b1684 !important;
                    font-weight: 1000 !important;
                }

                .gp-blog-content table tr:nth-child(even) td {
                    background: rgba(146,10,182,.035) !important;
                }

                .gp-blog-content table tr:hover td {
                    background: rgba(216,245,18,.13) !important;
                }




        /* V68: SEO/GEO internal links and entity trust box */
        .gp-geo-internal-links {
            max-width: 860px;
            margin: 26px auto 6px;
            padding: 18px;
            border-radius: 28px;
            background: radial-gradient(circle at 10% 10%, rgba(216,245,18,.16), transparent 28%), linear-gradient(135deg, rgba(146,10,182,.075), rgba(225,11,121,.045));
            border: 1px solid rgba(75,22,132,.09);
        }

            .gp-geo-internal-links strong {
                display: block;
                color: var(--gp-v41-ink) !important;
                font-size: 17px;
                font-weight: 1000;
                line-height: 1.9;
                margin-bottom: 10px;
                text-align: center;
            }

        .gp-geo-link-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
            gap: 9px;
        }

            .gp-geo-link-grid a {
                min-height: 44px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                padding: 0 13px;
                border-radius: 999px;
                background: rgba(255,255,255,.78);
                border: 1px solid rgba(75,22,132,.08);
                color: #6420a0 !important;
                font-size: 12px;
                font-weight: 1000;
                text-decoration: none !important;
                text-align: center;
                line-height: 1.8;
                transition: transform .18s ease, background .18s ease;
            }

                .gp-geo-link-grid a:hover {
                    transform: translateY(-2px);
                    background: #fff;
                }

        .gp-article-reviewed-box {
            max-width: 860px;
            margin: 20px auto 0;
            padding: 14px 16px;
            border-radius: 24px;
            background: rgba(255,255,255,.70);
            border: 1px solid rgba(75,22,132,.08);
            color: var(--gp-v41-muted) !important;
            font-size: 13px;
            font-weight: 900;
            line-height: 2;
            text-align: center;
        }

        html.gp-dark-mode .gp-geo-internal-links,
        html.gp-dark-mode .gp-article-reviewed-box {
            background: rgba(255,255,255,.055) !important;
            border-color: rgba(255,255,255,.10) !important;
        }

        html.gp-dark-mode .gp-geo-link-grid a {
            background: rgba(255,255,255,.075) !important;
            border-color: rgba(255,255,255,.10) !important;
            color: #fff !important;
        }

        @@media(max-width: 768px) {
            .gp-geo-link-grid {
                grid-template-columns: 1fr;
            }
        }


        /* V43: Compact long article UX */
        .gp-reading-progress {
            position: fixed;
            top: 0;
            right: 0;
            width: 0;
            height: 4px;
            z-index: 2147482900;
            background: linear-gradient(90deg, #d8f512, #920ab6, #e10b79);
            box-shadow: 0 6px 18px rgba(146,10,182,.22);
            transition: width .08s linear;
        }

        .gp-blog-main-card {
            position: relative;
        }

        .gp-blog-content-wrap {
            position: relative;
        }

        .gp-blog-content {
            max-width: 860px;
            margin: 0 auto;
        }

            .gp-blog-content.is-collapsed {
                max-height: 1350px;
                overflow: hidden;
            }

        .gp-blog-content-wrap.is-collapsed::after {
            content: "";
            position: absolute;
            right: 0;
            left: 0;
            bottom: 0;
            height: 260px;
            pointer-events: none;
            background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.97) 74%);
            z-index: 4;
        }

        .gp-article-read-more-box {
            display: none;
            position: relative;
            z-index: 5;
            margin: -96px auto 8px;
            width: min(520px, 100%);
            padding: 18px;
            border-radius: 28px;
            background: rgba(255,255,255,.82);
            border: 1px solid rgba(75,22,132,.10);
            box-shadow: 0 22px 60px rgba(74,18,107,.15);
            backdrop-filter: blur(16px);
            text-align: center;
        }

            .gp-article-read-more-box.is-visible {
                display: block;
            }

            .gp-article-read-more-box strong {
                display: block;
                color: var(--gp-v41-ink) !important;
                font-size: 16px;
                font-weight: 1000;
                line-height: 1.8;
                margin-bottom: 6px;
            }

            .gp-article-read-more-box span {
                display: block;
                color: var(--gp-v41-muted) !important;
                font-size: 13px;
                font-weight: 850;
                line-height: 2;
                margin-bottom: 12px;
            }

        .gp-article-read-more-btn {
            min-height: 48px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            min-width: 220px;
            border: 0;
            border-radius: 999px;
            background: linear-gradient(135deg, var(--gp-v41-purple), var(--gp-v41-violet), var(--gp-v41-pink));
            color: #fff !important;
            font-weight: 1000;
            box-shadow: 0 16px 34px rgba(146,10,182,.22);
            cursor: pointer;
        }

        .gp-article-tools {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            justify-content: center;
            margin: 0 auto 22px;
            max-width: 860px;
            padding: 12px;
            border-radius: 24px;
            background: rgba(146,10,182,.055);
            border: 1px solid rgba(75,22,132,.08);
        }

        .gp-article-tool-btn {
            min-height: 38px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            padding: 0 13px;
            border: 0;
            border-radius: 999px;
            background: #fff;
            color: #6420a0 !important;
            font-size: 12px;
            font-weight: 1000;
            box-shadow: 0 12px 28px rgba(74,18,107,.07);
            cursor: pointer;
            text-decoration: none !important;
        }

        .gp-blog-content > p {
            max-width: 760px;
            margin-right: auto !important;
            margin-left: auto !important;
            text-align: justify !important;
        }

        .gp-blog-content > h2,
        .gp-blog-content > h3 {
            max-width: 820px;
            margin-right: auto !important;
            margin-left: auto !important;
            padding: 16px 20px !important;
            border-radius: 26px;
            background: radial-gradient(circle at 12% 16%, rgba(216,245,18,.16), transparent 30%), linear-gradient(135deg, rgba(146,10,182,.085), rgba(255,255,255,.72));
            border: 1px solid rgba(75,22,132,.08);
            text-align: center !important;
        }

        .gp-blog-content > h2 {
            font-size: clamp(21px, 2.1vw, 30px) !important;
        }

        .gp-blog-content > h3 {
            font-size: clamp(18px, 1.7vw, 24px) !important;
        }

            .gp-blog-content > h2::before,
            .gp-blog-content > h3::before {
                content: "";
                width: 36px;
                height: 5px;
                display: block;
                margin: 0 auto 10px;
                border-radius: 999px;
                background: linear-gradient(90deg, #d8f512, #920ab6);
            }

        .gp-blog-content > ul,
        .gp-blog-content > ol {
            max-width: 760px;
            margin-right: auto !important;
            margin-left: auto !important;
            padding: 18px 42px 18px 18px !important;
            border-radius: 24px;
            background: rgba(146,10,182,.045);
            border: 1px solid rgba(75,22,132,.07);
        }

        .gp-blog-content > img,
        .gp-blog-content > figure {
            display: block;
            margin-right: auto !important;
            margin-left: auto !important;
        }

        .gp-blog-toc-card {
            display: none;
        }

            .gp-blog-toc-card.is-visible {
                display: block;
            }

        .gp-blog-toc-list {
            display: grid;
            gap: 7px;
            max-height: 310px;
            overflow: auto;
            padding-left: 4px;
        }

            .gp-blog-toc-list a {
                display: block;
                padding: 10px 12px;
                border-radius: 16px;
                background: rgba(255,255,255,.66);
                border: 1px solid rgba(75,22,132,.08);
                color: var(--gp-v41-ink) !important;
                text-decoration: none !important;
                font-size: 12px;
                font-weight: 900;
                line-height: 1.8;
                transition: transform .18s ease, background .18s ease;
            }

                .gp-blog-toc-list a:hover {
                    transform: translateY(-2px);
                    background: #fff;
                }

        .gp-back-to-top {
            position: fixed;
            left: auto;
            right: 18px;
            bottom: 24px;
            z-index: 9998;
            width: 48px;
            height: 48px;
            display: none;
            align-items: center;
            justify-content: center;
            border: 0;
            border-radius: 18px;
            background: linear-gradient(135deg, var(--gp-v41-purple), var(--gp-v41-violet));
            color: #fff !important;
            font-size: 20px;
            font-weight: 1000;
            box-shadow: 0 18px 42px rgba(74,18,107,.22);
            cursor: pointer;
        }

            .gp-back-to-top.is-visible {
                display: inline-flex;
            }

        html.gp-dark-mode .gp-blog-content-wrap.is-collapsed::after {
            background: linear-gradient(180deg, rgba(24,24,40,0), rgba(24,24,40,.98) 74%);
        }

        html.gp-dark-mode .gp-article-read-more-box {
            background: rgba(24,24,40,.86);
            border-color: rgba(255,255,255,.10);
            box-shadow: 0 22px 60px rgba(0,0,0,.25);
        }

        html.gp-dark-mode .gp-article-tools {
            background: rgba(255,255,255,.055);
            border-color: rgba(255,255,255,.10);
        }

        html.gp-dark-mode .gp-article-tool-btn,
        html.gp-dark-mode .gp-blog-toc-list a {
            background: rgba(255,255,255,.075);
            border-color: rgba(255,255,255,.10);
            color: #fff !important;
        }

        html.gp-dark-mode .gp-blog-content > h2,
        html.gp-dark-mode .gp-blog-content > h3,
        html.gp-dark-mode .gp-blog-content > ul,
        html.gp-dark-mode .gp-blog-content > ol {
            background: rgba(255,255,255,.055);
            border-color: rgba(255,255,255,.10);
        }

        @@media(max-width: 1100px) {
            .gp-blog-toc-card.is-visible {
                display: none;
            }
        }

        @@media(max-width: 768px) {
            .gp-blog-content.is-collapsed {
                max-height: 1050px;
            }

            .gp-article-tools {
                margin-bottom: 16px;
                padding: 10px;
            }

            .gp-article-tool-btn {
                width: 100%;
            }

            .gp-blog-content > p {
                text-align: right !important;
            }

            .gp-blog-content > h2,
            .gp-blog-content > h3 {
                padding: 14px 14px !important;
                border-radius: 22px;
            }

            .gp-article-read-more-box {
                margin-top: -82px;
                border-radius: 24px;
            }

            .gp-back-to-top {
                left: 14px;
                right: auto;
                bottom: 86px;
            }
        }


        /* V42: Premium responsive article tables */
        .gp-blog-content .gp-table-scroll {
            position: relative;
            width: 100%;
            max-width: 100%;
            margin: 28px 0 !important;
            padding: 42px 0 0 !important;
            overflow-x: auto !important;
            overflow-y: hidden !important;
            border-radius: 28px !important;
            border: 1px solid rgba(75,22,132,.11) !important;
            background: radial-gradient(circle at 12% 0%, rgba(216,245,18,.12), transparent 26%), linear-gradient(135deg, rgba(255,255,255,.96), rgba(252,248,255,.90)) !important;
            box-shadow: 0 20px 54px rgba(74,18,107,.11) !important;
            -webkit-overflow-scrolling: touch !important;
            scrollbar-width: thin !important;
            scrollbar-color: #920ab6 rgba(146,10,182,.10) !important;
        }

            .gp-blog-content .gp-table-scroll::-webkit-scrollbar {
                height: 10px !important;
            }

            .gp-blog-content .gp-table-scroll::-webkit-scrollbar-track {
                background: rgba(146,10,182,.08) !important;
                border-radius: 999px !important;
            }

            .gp-blog-content .gp-table-scroll::-webkit-scrollbar-thumb {
                border-radius: 999px !important;
                background: linear-gradient(90deg, #4b1684, #920ab6, #e10b79) !important;
                border: 2px solid rgba(255,255,255,.75) !important;
            }

        .gp-blog-content .gp-table-hint {
            position: absolute;
            top: 9px;
            right: 12px;
            left: 12px;
            min-height: 28px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            padding: 0 10px;
            border-radius: 999px;
            background: rgba(255,255,255,.70);
            border: 1px solid rgba(75,22,132,.08);
            color: rgba(32,20,45,.68) !important;
            font-size: 12px !important;
            font-weight: 950 !important;
            line-height: 1 !important;
            pointer-events: none;
            backdrop-filter: blur(12px);
            z-index: 3;
        }

            .gp-blog-content .gp-table-hint::before {
                content: "جدول مقایسه‌ای";
                color: #4b1684;
                font-weight: 1000;
            }

            .gp-blog-content .gp-table-hint::after {
                content: "برای مشاهده کامل، جدول را بکشید ←";
                color: rgba(32,20,45,.58);
                font-weight: 900;
            }

        .gp-blog-content table {
            width: max-content !important;
            min-width: 100% !important;
            max-width: none !important;
            margin: 0 !important;
            border-collapse: separate !important;
            border-spacing: 0 !important;
            table-layout: auto !important;
            background: transparent !important;
            direction: rtl !important;
            overflow: visible !important;
        }

            .gp-blog-content table th,
            .gp-blog-content table td {
                min-width: 220px !important;
                max-width: 360px !important;
                padding: 18px 18px !important;
                border: 0 !important;
                border-bottom: 1px solid rgba(75,22,132,.085) !important;
                border-left: 1px solid rgba(75,22,132,.065) !important;
                color: var(--gp-v41-ink) !important;
                font-size: 14.5px !important;
                font-weight: 850 !important;
                line-height: 2.15 !important;
                vertical-align: top !important;
                text-align: right !important;
                white-space: normal !important;
                word-break: normal !important;
                overflow-wrap: break-word !important;
                hyphens: none !important;
            }

                .gp-blog-content table th:first-child,
                .gp-blog-content table td:first-child {
                    border-right: 0 !important;
                }

                .gp-blog-content table th:last-child,
                .gp-blog-content table td:last-child {
                    border-left: 0 !important;
                }

            .gp-blog-content table tr:last-child td {
                border-bottom: 0 !important;
            }

            .gp-blog-content table th,
            .gp-blog-content table thead td {
                position: sticky;
                top: 0;
                z-index: 2;
                background: radial-gradient(circle at 12% 18%, rgba(216,245,18,.18), transparent 28%), linear-gradient(135deg, rgba(75,22,132,.14), rgba(146,10,182,.10)) !important;
                color: #4b1684 !important;
                font-weight: 1000 !important;
                font-size: 15px !important;
                line-height: 1.95 !important;
                box-shadow: inset 0 -1px 0 rgba(75,22,132,.10);
            }

            .gp-blog-content table tbody tr:nth-child(odd) td {
                background: rgba(255,255,255,.76) !important;
            }

            .gp-blog-content table tbody tr:nth-child(even) td,
            .gp-blog-content table tr:nth-child(even) td {
                background: rgba(146,10,182,.045) !important;
            }

            .gp-blog-content table tbody tr:hover td,
            .gp-blog-content table tr:hover td {
                background: rgba(216,245,18,.16) !important;
            }

            .gp-blog-content table td strong,
            .gp-blog-content table th strong {
                color: #4b1684 !important;
                font-weight: 1000 !important;
            }

            .gp-blog-content table td p,
            .gp-blog-content table th p {
                margin: 0 !important;
                color: inherit !important;
                font-size: inherit !important;
                line-height: inherit !important;
            }

            .gp-blog-content table ul,
            .gp-blog-content table ol {
                margin: 0 !important;
                padding-right: 18px !important;
            }

            .gp-blog-content table li {
                margin-bottom: 6px !important;
                font-size: inherit !important;
                line-height: 2 !important;
            }

        @@media(max-width: 991px) {
            .gp-blog-content .gp-table-scroll {
                margin-right: -6px !important;
                margin-left: -6px !important;
                border-radius: 24px !important;
            }

            .gp-blog-content table th,
            .gp-blog-content table td {
                min-width: 210px !important;
                max-width: 320px !important;
                padding: 16px 15px !important;
                font-size: 14px !important;
            }
        }

        @@media(max-width: 640px) {
            .gp-blog-content .gp-table-scroll {
                margin-right: -12px !important;
                margin-left: -12px !important;
                padding-top: 45px !important;
                border-radius: 22px !important;
            }

            .gp-blog-content .gp-table-hint {
                justify-content: center !important;
                text-align: center !important;
                min-height: 32px !important;
            }

                .gp-blog-content .gp-table-hint::before {
                    content: "جدول";
                }

                .gp-blog-content .gp-table-hint::after {
                    content: "برای دیدن کامل، به طرفین بکشید";
                }

            .gp-blog-content table th,
            .gp-blog-content table td {
                min-width: 235px !important;
                max-width: 280px !important;
                padding: 15px 14px !important;
                font-size: 13.5px !important;
                line-height: 2.05 !important;
            }
        }

        html.gp-dark-mode .gp-blog-content .gp-table-scroll {
            background: radial-gradient(circle at 12% 0%, rgba(216,245,18,.08), transparent 26%), linear-gradient(135deg, rgba(24,24,40,.94), rgba(20,20,34,.90)) !important;
            border-color: rgba(255,255,255,.11) !important;
            box-shadow: 0 20px 54px rgba(0,0,0,.25) !important;
            scrollbar-color: #d8f512 rgba(255,255,255,.10) !important;
        }

        html.gp-dark-mode .gp-blog-content .gp-table-hint {
            background: rgba(255,255,255,.08) !important;
            border-color: rgba(255,255,255,.10) !important;
            color: rgba(246,247,251,.76) !important;
        }

            html.gp-dark-mode .gp-blog-content .gp-table-hint::before {
                color: #fff !important;
            }

            html.gp-dark-mode .gp-blog-content .gp-table-hint::after {
                color: rgba(246,247,251,.62) !important;
            }

        html.gp-dark-mode .gp-blog-content table {
            background: transparent !important;
        }

            html.gp-dark-mode .gp-blog-content table th,
            html.gp-dark-mode .gp-blog-content table thead td {
                background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(146,10,182,.15)) !important;
                color: #fff !important;
            }

            html.gp-dark-mode .gp-blog-content table tbody tr:nth-child(odd) td {
                background: rgba(255,255,255,.055) !important;
            }

            html.gp-dark-mode .gp-blog-content table tbody tr:nth-child(even) td,
            html.gp-dark-mode .gp-blog-content table tr:nth-child(even) td {
                background: rgba(255,255,255,.035) !important;
            }

            html.gp-dark-mode .gp-blog-content table tbody tr:hover td,
            html.gp-dark-mode .gp-blog-content table tr:hover td {
                background: rgba(216,245,18,.09) !important;
            }

            html.gp-dark-mode .gp-blog-content table td strong,
            html.gp-dark-mode .gp-blog-content table th strong {
                color: #d8f512 !important;
            }



        /* V44: newsletter ajax message spacing fix */
        .gp-newsletter-message-v44,
        .gp-newsletter-message-v44 #gpNewsMsg,
        .gp-blog-side-card .newsletter,
        .gp-blog-side-card #gpNewsMsg {
            display: block !important;
            width: 100% !important;
            min-height: 28px !important;
            margin: 12px 0 0 !important;
            padding: 8px 12px !important;
            border-radius: 16px !important;
            background: rgba(146,10,182,.065) !important;
            color: #6420a0 !important;
            font-size: 12px !important;
            font-weight: 950 !important;
            line-height: 1.9 !important;
            text-align: center !important;
            white-space: normal !important;
        }

            .gp-newsletter-message-v44:empty,
            .gp-newsletter-message-v44 #gpNewsMsg:empty {
                min-height: 0 !important;
                margin-top: 0 !important;
                padding: 0 !important;
                background: transparent !important;
            }

        .gp-newsletter-form-v41 + .text-center {
            margin-top: 10px !important;
            padding-top: 0 !important;
        }

        html.gp-dark-mode .gp-newsletter-message-v44,
        html.gp-dark-mode .gp-newsletter-message-v44 #gpNewsMsg,
        html.gp-dark-mode .gp-blog-side-card .newsletter,
        html.gp-dark-mode .gp-blog-side-card #gpNewsMsg {
            background: rgba(255,255,255,.075) !important;
            color: rgba(246,247,251,.88) !important;
            border-color: rgba(255,255,255,.10) !important;
        }


        .gp-blog-side {
            position: sticky;
            top: 18px;
            display: grid;
            gap: 14px;
        }

        .gp-blog-side-card {
            padding: 18px;
        }

            .gp-blog-side-card h3 {
                margin: 0 0 12px;
                color: var(--gp-v41-ink) !important;
                font-size: 19px;
                font-weight: 1000;
                line-height: 1.7 !important;
            }

            .gp-blog-side-card p {
                margin: 0 0 14px;
                color: var(--gp-v41-muted) !important;
                font-weight: 850;
                line-height: 2;
            }

        .gp-side-cta {
            min-height: 50px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            width: 100%;
            border-radius: 18px;
            background: linear-gradient(135deg, var(--gp-v41-purple), var(--gp-v41-violet));
            color: #fff !important;
            font-weight: 1000;
            text-decoration: none !important;
            box-shadow: 0 16px 32px rgba(146,10,182,.17);
        }

        .gp-newsletter-form-v41 {
            display: grid !important;
            grid-template-columns: minmax(0,1fr) 78px;
            gap: 8px;
        }

            .gp-newsletter-form-v41 input {
                height: 52px;
                border-radius: 18px !important;
                border: 1px solid rgba(75,22,132,.12) !important;
                background: #fff !important;
                color: var(--gp-v41-ink) !important;
                font-weight: 850 !important;
                padding: 0 14px !important;
                outline: 0 !important;
            }

            .gp-newsletter-form-v41 button {
                height: 52px;
                border: 0;
                border-radius: 18px;
                background: linear-gradient(135deg, var(--gp-v41-purple), var(--gp-v41-violet), var(--gp-v41-pink));
                color: #fff !important;
                font-weight: 1000;
                box-shadow: 0 14px 32px rgba(146,10,182,.22);
            }

        .gp-side-posts {
            display: grid;
            gap: 10px;
        }

        .gp-side-post {
            display: grid;
            grid-template-columns: 74px minmax(0, 1fr);
            gap: 10px;
            align-items: center;
            padding: 9px;
            border-radius: 20px;
            background: rgba(255,255,255,.65);
            border: 1px solid rgba(75,22,132,.08);
            text-decoration: none !important;
            transition: transform .18s ease, background .18s ease;
        }

            .gp-side-post:hover {
                transform: translateY(-2px);
                background: #fff;
            }

            .gp-side-post img {
                width: 74px;
                height: 74px;
                border-radius: 17px;
                object-fit: cover;
                background: #fff;
            }

            .gp-side-post strong {
                display: block;
                color: var(--gp-v41-ink) !important;
                font-size: 13px;
                font-weight: 950;
                line-height: 1.8;
            }

            .gp-side-post span {
                display: block;
                color: var(--gp-v41-muted) !important;
                font-size: 12px;
                font-weight: 850;
                margin-top: 3px;
            }

        .gp-social-links {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 8px;
        }

            .gp-social-links a {
                min-height: 44px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                border-radius: 16px;
                text-decoration: none !important;
                color: #fff !important;
                font-weight: 1000;
            }

                .gp-social-links a:nth-child(1) {
                    background: #25D366;
                }

                .gp-social-links a:nth-child(2) {
                    background: linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045);
                }

                .gp-social-links a:nth-child(3) {
                    background: #229ED9;
                }

        .gp-blog-comments-card {
            padding: clamp(18px, 2.4vw, 28px);
            margin: 22px 0 42px;
        }

            .gp-blog-comments-card h2 {
                margin: 0 0 16px;
                color: var(--gp-v41-ink) !important;
                font-size: clamp(22px, 2.6vw, 34px);
                font-weight: 1000;
                line-height: 1.6 !important;
            }

        .gp-comment-list {
            display: grid;
            gap: 12px;
            margin-bottom: 22px;
        }

        .gp-comment-item {
            display: grid;
            grid-template-columns: 54px minmax(0,1fr);
            gap: 12px;
            padding: 14px;
            border-radius: 24px;
            background: rgba(255,255,255,.66);
            border: 1px solid rgba(75,22,132,.08);
        }

            .gp-comment-item img {
                width: 54px;
                height: 54px;
                border-radius: 18px;
                object-fit: cover;
            }

            .gp-comment-item strong {
                display: block;
                color: var(--gp-v41-ink) !important;
                font-weight: 1000;
                line-height: 1.7;
            }

            .gp-comment-item p {
                margin: 5px 0 0;
                color: var(--gp-v41-muted) !important;
                font-weight: 850;
                line-height: 2;
            }

        .gp-comment-form {
            display: grid;
            gap: 10px;
        }

            .gp-comment-form input,
            .gp-comment-form textarea {
                width: 100%;
                border: 1px solid rgba(75,22,132,.12) !important;
                border-radius: 20px !important;
                background: rgba(255,255,255,.82) !important;
                color: var(--gp-v41-ink) !important;
                font-size: 14px !important;
                font-weight: 850 !important;
                outline: 0 !important;
                box-shadow: inset 0 1px 0 rgba(255,255,255,.70) !important;
            }

            .gp-comment-form input {
                height: 54px;
                padding: 0 16px !important;
            }

            .gp-comment-form textarea {
                min-height: 150px;
                padding: 16px !important;
                line-height: 2;
                resize: vertical;
            }

            .gp-comment-form button {
                min-height: 54px;
                border: 0;
                border-radius: 20px;
                background: linear-gradient(135deg, var(--gp-v41-purple), var(--gp-v41-violet), var(--gp-v41-pink));
                color: #fff !important;
                font-weight: 1000;
                box-shadow: 0 18px 42px rgba(146,10,182,.20);
            }

        .gp-blog-toast {
            position: fixed;
            right: 18px;
            bottom: 92px;
            z-index: 9999;
            min-height: 48px;
            max-width: min(330px, calc(100vw - 36px));
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0 18px;
            border-radius: 999px;
            background: rgba(29,20,48,.92);
            color: #fff;
            font-weight: 950;
            box-shadow: 0 18px 42px rgba(0,0,0,.22);
            transform: translateY(24px);
            opacity: 0;
            pointer-events: none;
            transition: transform .22s ease, opacity .22s ease;
        }

            .gp-blog-toast.is-visible {
                opacity: 1;
                transform: translateY(0);
            }

        .gp-heart-icon {
            color: var(--gp-v41-heart) !important;
            font-family: Tahoma, Arial, sans-serif !important;
            font-size: 18px !important;
            line-height: 1 !important;
        }

        html.gp-dark-mode .gp-blog-detail-page {
            --gp-v41-ink: #f7f7fb;
            --gp-v41-muted: rgba(246,247,251,.72);
            --gp-v41-card: rgba(24,24,40,.88);
            --gp-v41-border: rgba(255,255,255,.10);
            --gp-v41-shadow: 0 24px 60px rgba(0,0,0,.20);
        }

        html.gp-dark-mode .gp-blog-main-card,
        html.gp-dark-mode .gp-blog-side-card,
        html.gp-dark-mode .gp-blog-comments-card {
            background: rgba(24,24,40,.90) !important;
            border-color: rgba(255,255,255,.10) !important;
        }

        html.gp-dark-mode .gp-blog-info-strip span,
        html.gp-dark-mode .gp-side-post,
        html.gp-dark-mode .gp-comment-item {
            background: rgba(255,255,255,.07) !important;
            border-color: rgba(255,255,255,.10) !important;
            color: rgba(246,247,251,.86) !important;
        }

        html.gp-dark-mode .gp-newsletter-form-v41 input,
        html.gp-dark-mode .gp-comment-form input,
        html.gp-dark-mode .gp-comment-form textarea {
            background: rgba(255,255,255,.07) !important;
            border-color: rgba(255,255,255,.12) !important;
            color: #fff !important;
        }

        html.gp-dark-mode .gp-blog-content table {
            background: rgba(24,24,40,.95) !important;
        }

            html.gp-dark-mode .gp-blog-content table th,
            html.gp-dark-mode .gp-blog-content table td {
                color: rgba(246,247,251,.86) !important;
                border-bottom-color: rgba(255,255,255,.10) !important;
                border-left-color: rgba(255,255,255,.08) !important;
            }

            html.gp-dark-mode .gp-blog-content table th,
            html.gp-dark-mode .gp-blog-content table thead td {
                background: rgba(255,255,255,.09) !important;
                color: #fff !important;
            }

            html.gp-dark-mode .gp-blog-content table tr:hover td {
                background: rgba(216,245,18,.09) !important;
            }

        html.gp-dark-mode .gp-blog-content blockquote {
            background: rgba(255,255,255,.07) !important;
            color: #f7f7fb !important;
            border-right-color: #ff4f7c !important;
        }

        html.gp-dark-mode .gp-blog-content a {
            color: #ff9ac0 !important;
            border-bottom-color: rgba(255,154,192,.35);
        }

        @@media(max-width: 1100px) {
            .gp-blog-detail-hero-grid,
            .gp-blog-detail-shell {
                grid-template-columns: 1fr;
            }

            .gp-blog-hero-stats {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }

            .gp-blog-side {
                position: relative;
                top: auto;
            }
        }

        @@media(max-width: 768px) {
            .gp-blog-detail-hero {
                border-radius: 30px;
                padding: 26px 20px;
                text-align: center;
            }

            .gp-blog-detail-actions {
                justify-content: center;
            }

            .gp-blog-hero-stats,
            .gp-newsletter-form-v41,
            .gp-social-links {
                grid-template-columns: 1fr;
            }

            .gp-blog-main-card,
            .gp-blog-side-card,
            .gp-blog-comments-card {
                border-radius: 28px;
            }

            .gp-blog-main-body {
                padding: 18px;
            }

            .gp-blog-content p,
            .gp-blog-content li {
                font-size: 14px !important;
            }

            .gp-blog-content table {
                min-width: 560px;
            }

            .gp-comment-item {
                grid-template-columns: 1fr;
                text-align: center;
            }

                .gp-comment-item img {
                    margin: 0 auto;
                }

            .gp-blog-toast {
                left: 14px;
                right: 14px;
                bottom: 86px;
            }
        }


        /* V80: new grouped GEO/brand link hub */
        .gp-v80-link-hub {
            max-width: 920px !important;
            padding: clamp(16px, 2.2vw, 24px) !important;
            border-radius: 32px !important;
            background: radial-gradient(circle at 12% 10%, rgba(216,245,18,.18), transparent 30%), linear-gradient(135deg, rgba(146,10,182,.085), rgba(225,11,121,.055)) !important;
            box-shadow: 0 22px 56px rgba(74,18,107,.10);
        }

            .gp-v80-link-hub > strong {
                font-size: clamp(18px, 2vw, 26px) !important;
                margin-bottom: 6px !important;
            }

        .gp-v80-link-hub-lead {
            max-width: 780px;
            margin: 0 auto 16px !important;
            color: var(--gp-v41-muted) !important;
            font-size: 13px !important;
            font-weight: 850 !important;
            line-height: 2 !important;
            text-align: center !important;
        }

        .gp-v80-link-group {
            margin-top: 14px;
            padding: 14px;
            border-radius: 24px;
            background: rgba(255,255,255,.62);
            border: 1px solid rgba(75,22,132,.08);
        }

            .gp-v80-link-group h3 {
                margin: 0 0 10px !important;
                color: var(--gp-v41-ink) !important;
                font-size: 15px !important;
                font-weight: 1000 !important;
                line-height: 1.8 !important;
                text-align: right !important;
            }

        .gp-v80-link-grid {
            grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)) !important;
        }

            .gp-v80-link-grid a {
                min-height: 48px !important;
                border-radius: 18px !important;
                background: #fff !important;
                box-shadow: 0 10px 26px rgba(74,18,107,.06);
                transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
            }

                .gp-v80-link-grid a:hover {
                    transform: translateY(-3px);
                    box-shadow: 0 16px 34px rgba(74,18,107,.12);
                    background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(251,247,255,.98)) !important;
                }

        html.gp-dark-mode .gp-v80-link-hub-lead {
            color: rgba(246,247,251,.72) !important;
        }

        html.gp-dark-mode .gp-v80-link-group {
            background: rgba(255,255,255,.055) !important;
            border-color: rgba(255,255,255,.10) !important;
        }

            html.gp-dark-mode .gp-v80-link-group h3 {
                color: #fff !important;
            }

        html.gp-dark-mode .gp-v80-link-grid a {
            background: rgba(255,255,255,.075) !important;
        }

        @@media(max-width: 768px) {
            .gp-v80-link-grid {
                grid-template-columns: 1fr !important;
            }

            .gp-v80-link-group h3 {
                text-align: center !important;
            }
        }
    
/* =========================================================
   V99 - modern article page (breadcrumb, hero, share, prose,
   comments, related posts)
   ========================================================= */
.gp-article {
    padding-bottom: 20px;
}

/* breadcrumb */
.gp-article-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
    font-size: 12px;
    font-weight: 850;
    color: rgba(46,22,70,.55);
}

    .gp-article-breadcrumb a {
        color: #7a0799 !important;
        text-decoration: none !important;
    }

        .gp-article-breadcrumb a:hover {
            color: #c60069 !important;
        }

    .gp-article-breadcrumb > span:last-of-type {
        color: #33003f;
    }

/* hero */
.gp-article-hero {
    padding: clamp(22px, 3vw, 38px);
    border-radius: 30px;
    background:
        radial-gradient(circle at 90% 8%, rgba(255,255,255,.13), transparent 32%),
        linear-gradient(135deg, #4b1684 0%, #920ab6 52%, #c60069 100%);
    box-shadow: 0 26px 64px rgba(72,17,100,.24);
    margin-bottom: 22px;
}

.gp-article-cat-chip {
    display: inline-flex;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,.16);
    color: #ffd2f3 !important;
    font-size: 12px;
    font-weight: 950;
    text-decoration: none !important;
    margin-bottom: 12px;
}

.gp-article-hero h1 {
    margin: 0 0 14px;
    color: #fff !important;
    font-size: clamp(24px, 3.4vw, 40px);
    font-weight: 990;
    line-height: 1.55;
}

.gp-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin-bottom: 16px;
}

.gp-article-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(255,255,255,.85);
    font-size: 12.5px;
    font-weight: 850;
}

    .gp-article-meta-item i {
        font-style: normal;
        font-size: 14px;
    }

/* share */
.gp-article-share {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,.16);
}

.gp-share-label {
    color: rgba(255,255,255,.78);
    font-size: 12.5px;
    font-weight: 900;
    margin-left: 4px;
}

.gp-share-btn {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.22);
    background: rgba(255,255,255,.12);
    color: #fff !important;
    font-size: 17px;
    text-decoration: none !important;
    cursor: pointer;
    transition: transform .18s ease, background .18s ease;
}

    .gp-share-btn:hover {
        transform: translateY(-3px);
        background: rgba(255,255,255,.95) !important;
        color: #4b1684 !important;
    }

    .gp-share-tg:hover { background: linear-gradient(135deg, #2aabee, #229ed9) !important; color: #fff !important; }
    .gp-share-wa:hover { background: linear-gradient(135deg, #25d366, #128c7e) !important; color: #fff !important; }
    .gp-share-x:hover { background: linear-gradient(135deg, #1d1d1d, #000) !important; color: #fff !important; }
    .gp-share-mail:hover { background: linear-gradient(135deg, #920ab6, #c60069) !important; color: #fff !important; }
    .gp-share-copy:hover { background: linear-gradient(135deg, #d1f411, #9fd40a) !important; color: #26260a !important; }

/* featured figure */
.gp-article-figure {
    margin: 0 0 24px;
    border-radius: 26px;
    overflow: hidden;
    box-shadow: 0 22px 54px rgba(74,18,107,.14);
}

    .gp-article-figure img {
        display: block;
        width: 100%;
        height: auto;
    }

/* article body prose (legacy HTML from DB) */
.gp-article-body {
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(146,10,182,.10);
    border-radius: 26px;
    padding: clamp(20px, 3vw, 38px);
    box-shadow: 0 16px 40px rgba(74,18,107,.07);
    margin-bottom: 26px;
}

    .gp-article-body p {
        color: rgba(40, 22, 62, .88);
        font-size: 15px;
        font-weight: 750;
        line-height: 2.3;
        margin: 0 0 18px;
    }

    .gp-article-body h2,
    .gp-article-body h3 {
        color: #33003f;
        font-weight: 980;
        line-height: 1.7;
        margin: 26px 0 12px;
        padding-right: 14px;
        border-right: 4px solid;
        border-image: linear-gradient(180deg, #920ab6, #c60069) 1;
    }

    .gp-article-body h2 { font-size: 21px; }
    .gp-article-body h3 { font-size: 18px; }

    .gp-article-body img {
        max-width: 100%;
        height: auto;
        border-radius: 18px;
        margin: 14px 0;
        box-shadow: 0 12px 30px rgba(74,18,107,.10);
    }

    .gp-article-body ul,
    .gp-article-body ol {
        padding-right: 22px;
        color: rgba(40, 22, 62, .85);
        font-weight: 750;
        line-height: 2.2;
        margin: 0 0 18px;
    }

    .gp-article-body ul li { list-style: none; position: relative; }

    .gp-article-body ul li::before {
        content: "";
        position: absolute;
        right: -18px;
        top: 13px;
        width: 8px;
        height: 8px;
        border-radius: 999px;
        background: linear-gradient(135deg, #920ab6, #c60069);
    }

    .gp-article-body a {
        color: #920ab6 !important;
        font-weight: 900;
    }

    .gp-article-body table {
        width: 100%;
        border-collapse: collapse;
        margin: 14px 0;
        font-size: 13.5px;
    }

    .gp-article-body table td,
    .gp-article-body table th {
        border: 1px solid rgba(146,10,182,.14);
        padding: 9px 12px;
        line-height: 1.9;
    }

    .gp-article-body strong {
        color: #33003f;
    }

/* related posts */
.gp-article-related {
    margin-bottom: 26px;
}

    .gp-article-related h2 {
        margin: 0 0 16px;
    }

        .gp-article-related h2 span {
            display: inline-flex;
            padding: 7px 15px;
            border-radius: 999px;
            background: linear-gradient(135deg, rgba(146,10,182,.10), rgba(198,0,105,.08));
            color: #7a0799 !important;
            font-size: 14px;
            font-weight: 990;
        }

.gp-related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px;
}

.gp-related-card {
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    overflow: hidden;
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(146,10,182,.10);
    box-shadow: 0 12px 30px rgba(74,18,107,.08);
    text-decoration: none !important;
    transition: transform .2s ease, box-shadow .2s ease;
}

    .gp-related-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 22px 46px rgba(74,18,107,.15);
    }

    .gp-related-card img {
        width: 100%;
        aspect-ratio: 16 / 10;
        object-fit: cover;
    }

    .gp-related-card b {
        padding: 13px 15px;
        color: #2f1247;
        font-size: 13px;
        font-weight: 900;
        line-height: 1.9;
    }

/* comments */
.gp-comments-card {
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(146,10,182,.10);
    border-radius: 26px;
    padding: clamp(20px, 2.6vw, 32px);
    box-shadow: 0 16px 40px rgba(74,18,107,.07);
    margin-bottom: 26px;
}

    .gp-comments-card h2 {
        margin: 0 0 18px;
    }

        .gp-comments-card h2 span {
            display: inline-flex;
            padding: 7px 15px;
            border-radius: 999px;
            background: linear-gradient(135deg, rgba(146,10,182,.10), rgba(198,0,105,.08));
            color: #7a0799 !important;
            font-size: 14px;
            font-weight: 990;
        }

.gp-comments-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.gp-comment-item {
    display: flex;
    gap: 13px;
    padding: 15px 16px;
    border-radius: 18px;
    background: rgba(250, 246, 255, .8);
    border: 1px solid rgba(146,10,182,.09);
}

.gp-comment-avatar {
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: linear-gradient(135deg, #4b1684, #920ab6 55%, #c60069);
    color: #fff;
    font-size: 19px;
    font-weight: 990;
}

.gp-comment-body strong {
    display: block;
    color: #33003f;
    font-size: 13.5px;
    font-weight: 970;
    margin-bottom: 4px;
}

.gp-comment-body p {
    margin: 0;
    color: rgba(46,22,70,.74);
    font-size: 13px;
    font-weight: 800;
    line-height: 2.05;
}

.gp-comments-empty {
    margin: 0;
    color: rgba(46,22,70,.55);
    font-weight: 800;
    font-size: 13px;
}

/* back link */
.gp-article-back a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    padding: 0 24px;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(146,10,182,.09), rgba(198,0,105,.07));
    border: 1px solid rgba(146,10,182,.18);
    color: #7a0799 !important;
    font-weight: 950;
    text-decoration: none !important;
    transition: background .18s ease, color .18s ease;
}

    .gp-article-back a:hover {
        background: linear-gradient(135deg, #920ab6, #c60069);
        color: #fff !important;
    }

/* dark mode */
html.gp-dark-mode .gp-article-hero {
    background:
        radial-gradient(circle at 90% 8%, rgba(255,255,255,.08), transparent 32%),
        linear-gradient(135deg, #1c0a30 0%, #3a0f52 52%, #4a0a2e 100%) !important;
}

html.gp-dark-mode .gp-article-body,
html.gp-dark-mode .gp-comments-card,
html.gp-dark-mode .gp-related-card {
    background: linear-gradient(150deg, rgba(26,24,43,.95), rgba(18,20,33,.92)) !important;
    border-color: rgba(255,255,255,.10) !important;
}

html.gp-dark-mode .gp-article-body p,
html.gp-dark-mode .gp-article-body ul,
html.gp-dark-mode .gp-article-body ol,
html.gp-dark-mode .gp-comment-body p {
    color: rgba(255,255,255,.78) !important;
}

html.gp-dark-mode .gp-article-body h2,
html.gp-dark-mode .gp-article-body h3,
html.gp-dark-mode .gp-article-body strong,
html.gp-dark-mode .gp-comment-body strong,
html.gp-dark-mode .gp-related-card b {
    color: #f8f1ff !important;
}

html.gp-dark-mode .gp-article-breadcrumb > span:last-of-type {
    color: #f2e7fb;
}

html.gp-dark-mode .gp-comment-item {
    background: rgba(255,255,255,.05);
    border-color: rgba(255,255,255,.10);
}

/* =========================================================
   V100 - reading progress, TOC, vote, tags, prev/next, comment form
   ========================================================= */
.gp-read-progress {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    width: 0;
    z-index: 2147482600;
    background: linear-gradient(90deg, #d1f411, #ff8ac4 45%, #920ab6);
    border-radius: 0 4px 4px 0;
    transition: width .1s linear;
    pointer-events: none;
}

/* table of contents */
.gp-article-toc {
    background: linear-gradient(150deg, rgba(255,255,255,.97), rgba(250,244,255,.93));
    border: 1px solid rgba(146,10,182,.12);
    border-right: 4px solid;
    border-image: linear-gradient(180deg, #920ab6, #c60069) 1;
    border-radius: 20px;
    padding: 18px 22px;
    margin-bottom: 22px;
    box-shadow: 0 14px 34px rgba(74,18,107,.07);
}

    .gp-article-toc strong {
        display: block;
        color: #33003f;
        font-size: 14px;
        font-weight: 980;
        margin-bottom: 10px;
    }

    .gp-article-toc ol {
        margin: 0;
        padding: 0 18px 0 0;
        display: flex;
        flex-direction: column;
        gap: 7px;
    }

        .gp-article-toc li a {
            color: #6d0592 !important;
            font-size: 13px;
            font-weight: 850;
            text-decoration: none !important;
            transition: color .15s ease;
        }

            .gp-article-toc li a:hover {
                color: #c60069 !important;
            }

#gpArticleBody h2 {
    scroll-margin-top: 90px;
}

/* vote buttons */
.gp-article-vote {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

    .gp-article-vote > span {
        color: rgba(255,255,255,.78);
        font-size: 12.5px;
        font-weight: 900;
        margin-left: 4px;
    }

.gp-vote-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 40px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.24);
    background: rgba(255,255,255,.12);
    color: #fff;
    font-size: 12.5px;
    font-weight: 950;
    cursor: pointer;
    transition: background .18s ease, transform .18s ease;
}

    .gp-vote-btn:hover {
        background: rgba(255,255,255,.92);
        color: #4b1684;
        transform: translateY(-2px);
    }

    .gp-vote-btn.is-voted {
        background: #d1f411;
        color: #26260a;
        border-color: transparent;
    }

    .gp-vote-btn i {
        font-style: normal;
    }

/* keyword tags */
.gp-article-tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: -8px 0 26px;
    padding: 16px 18px;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(146,10,182,.06), rgba(198,0,105,.05));
    border: 1px dashed rgba(146,10,182,.20);
}

.gp-tags-label {
    color: #6d0592;
    font-size: 12.5px;
    font-weight: 950;
}

.gp-article-tags a {
    display: inline-flex;
    padding: 5px 13px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(146,10,182,.16);
    color: #6d0592 !important;
    font-size: 12px;
    font-weight: 900;
    text-decoration: none !important;
    transition: background .16s ease, color .16s ease, transform .16s ease;
}

    .gp-article-tags a:hover {
        background: linear-gradient(135deg, #920ab6, #c60069);
        color: #fff !important;
        transform: translateY(-2px);
    }

/* prev / next */
.gp-article-pn {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 26px;
}

.gp-pn-card {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 16px 18px;
    border-radius: 20px;
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(146,10,182,.12);
    box-shadow: 0 12px 30px rgba(74,18,107,.07);
    text-decoration: none !important;
    transition: transform .2s ease, box-shadow .2s ease;
}

    .gp-pn-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 20px 42px rgba(74,18,107,.14);
    }

    .gp-pn-card small {
        color: #920ab6;
        font-size: 11px;
        font-weight: 970;
    }

    .gp-pn-card b {
        color: #33003f;
        font-size: 13px;
        font-weight: 900;
        line-height: 1.9;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

.gp-pn-next {
    text-align: left;
}

.gp-pn-disabled {
    background: transparent;
    border: 1px dashed rgba(146,10,182,.15);
    box-shadow: none;
}

/* comment form */
.gp-comment-form {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px dashed rgba(146,10,182,.16);
}

.gp-comment-form-title {
    color: #33003f;
    font-size: 15.5px;
    font-weight: 980;
    margin: 0 0 14px;
}

.gp-comment-field-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0 14px;
}

.gp-comment-field {
    margin-bottom: 12px;
}

    .gp-comment-field input,
    .gp-comment-field textarea {
        width: 100%;
        border: 1.5px solid rgba(146,10,182,.16);
        border-radius: 14px;
        padding: 12px 15px;
        background: rgba(255,255,255,.9);
        color: #2f1247;
        font-weight: 800;
        font-size: 13px;
        transition: border-color .2s ease, box-shadow .2s ease;
    }

        .gp-comment-field input:focus,
        .gp-comment-field textarea:focus {
            outline: none;
            border-color: #920ab6;
            box-shadow: 0 0 0 4px rgba(146,10,182,.10);
        }

    .gp-comment-field textarea {
        min-height: 110px;
        resize: vertical;
    }

    .gp-comment-field .validation-message {
        color: #d63384;
        font-size: 11.5px;
        font-weight: 850;
    }

.gp-comment-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 30px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, #920ab6, #c60069);
    color: #fff;
    font-size: 14px;
    font-weight: 990;
    box-shadow: 0 14px 30px rgba(146,10,182,.28);
    transition: transform .2s ease, box-shadow .2s ease;
}

    .gp-comment-submit:hover:not(:disabled) {
        transform: translateY(-2px);
        box-shadow: 0 20px 40px rgba(146,10,182,.36);
    }

    .gp-comment-submit:disabled {
        opacity: .6;
    }

.gp-comment-error {
    color: #d63384;
    font-size: 12.5px;
    font-weight: 850;
    margin: 10px 0 0;
}

.gp-comment-success {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(209,244,17,.16), rgba(255,138,196,.10));
    border: 1px solid rgba(146,10,182,.18);
}

    .gp-comment-success > span {
        flex: 0 0 auto;
        width: 44px;
        height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background: linear-gradient(135deg, #d1f411, #9fd40a);
        color: #26260a;
        font-size: 20px;
        font-weight: 990;
    }

    .gp-comment-success strong {
        display: block;
        color: #33003f;
        font-size: 14px;
        font-weight: 980;
    }

    .gp-comment-success p {
        margin: 3px 0 0;
        color: rgba(46,22,70,.68);
        font-size: 12.5px;
        font-weight: 800;
    }

/* dark mode */
html.gp-dark-mode .gp-article-toc,
html.gp-dark-mode .gp-article-body,
html.gp-dark-mode .gp-comments-card,
html.gp-dark-mode .gp-pn-card {
    background: linear-gradient(150deg, rgba(26,24,43,.95), rgba(18,20,33,.92)) !important;
    border-color: rgba(255,255,255,.10) !important;
}

html.gp-dark-mode .gp-article-toc strong,
html.gp-dark-mode .gp-pn-card b,
html.gp-dark-mode .gp-comment-form-title,
html.gp-dark-mode .gp-comment-success strong {
    color: #f8f1ff !important;
}

html.gp-dark-mode .gp-article-toc li a {
    color: #ffd2f3 !important;
}

html.gp-dark-mode .gp-tags-label,
html.gp-dark-mode .gp-pn-card small {
    color: #d1f411 !important;
}

html.gp-dark-mode .gp-article-tags a {
    background: rgba(255,255,255,.07);
    border-color: rgba(255,255,255,.14);
    color: #ffd2f3 !important;
}

html.gp-dark-mode .gp-comment-field input,
html.gp-dark-mode .gp-comment-field textarea {
    background: rgba(255,255,255,.06);
    border-color: rgba(255,255,255,.14);
    color: #f2e7fb;
}

@media (max-width: 640px) {
    .gp-article-pn {
        grid-template-columns: 1fr;
    }
}
